/*** text ***/
html { background: #EEEEEE;}
html,body, input, select, textarea { font-family: 'Open Sans', Arial, serif; font-weight: 300; font-size: 16px; line-height: 160%; color: #333333; }
p { margin: 0px 0px 20px 0px; }
h1 { font-family: 'Open Sans Condensed', sans-serif; color: #D41217; font-weight: normal; font-size: 60px; margin: 0 0 0px 0; line-height: 1 }
h2 { font-family: 'Open Sans Condensed', sans-serif; font-size: 46px; font-weight: normal; text-align: left; margin: 0px 0px 20px 0px; color: #D41217; }
h3 { font-size: 20px; margin-bottom: 10px; color: #D41217; }
h4 { color: #666666; font-size: 14px; margin-bottom: 0px }
h5 { color: #D41217; font-size: 14px; margin: 0px }
a, a:visited { color: #D41217; text-decoration: none; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; -o-transition: all .2s ease; }
a:active, a:hover, a.active, a:visited.active { text-decoration: underline }
.smalltext { max-width: 800px }
/*** fontello ***/
@font-face { font-family: 'fontello'; src: url('../font/fontello.eot?47726747'); src: url('../font/fontello.eot?47726747#iefix') format('embedded-opentype'), url('../font/fontello.woff?47726747') format('woff'), url('../font/fontello.ttf?47726747') format('truetype'), url('../font/fontello.svg?47726747#fontello') format('svg'); font-weight: normal; font-style: normal; }
.fontello { font-family: "fontello"; font-style: normal; font-weight: normal; display: inline-block; text-decoration: inherit; width: 1em; margin-right: .2em; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; margin-left: .2em; -webkit-font-smoothing: antialiased; }
#ctr-mainmenu { font-family: 'Open Sans Condensed', sans-serif; font-size: 28px; float: right }
#ctr-mainmenu a { margin: 0 10px 0 0px }
/*** general layout ***/
#ctr-body { padding: 0 50px }
#ctr-wrapper { margin: 75px auto 50px; background: #FFFFFF; box-shadow: 0 0 4px rgba(0,0,0,0.1); max-width: 1460px; position: relative; }
#ctr-content { padding: 200px 40px; min-height: 367px; }
#page-next #ctr-content { padding: 50px 0px 0px 0px; }
.centered { margin: 0px auto; max-width: 1380px; padding: 0 40px; position: relative; }
#page-next .centered { }
.ctr-flex { display: flex; flex-wrap: wrap; }
.ctr-flex .flex.one { flex: 0 1 49.2%; padding: 0 0px; box-sizing: border-box; margin: 0 20px 20px 0 }
.ctr-flex .flex.one:nth-child(2n) { margin: 0 0 20px 0; }
.ctr-flex .flex.two { flex: 2; padding: 0 20px 0 0 }
.description { background: #FFFFFF; padding: 40px 100px; font-weight: 300; line-height: 160%; font-size: 20px }
#ctr-header { position: fixed; z-index: 9999; padding: 20px 0px; top: 0px; left: 0px; right: 0px; background: #FFFFFF; box-shadow: 0 0 5px rgba(0,0,0,0.2); }
#ctr-searchform { position: relative; float: right; width: 25%; height: 40px; margin: 0px; border: 1px solid #DDDDDD; overflow: hidden; }
#ctr-searchform .input { position: absolute; border: none; padding: 5px 70px 5px 20px; box-sizing: border-box; margin: 0px; height: 100%; width: 100%; z-index: 10 }
#ctr-searchform .submit { position: absolute; margin: 0px; color: #FFFFFF; height: 100%; width: 50px; z-index: 20; background: #D41217; border: none; top: 0px; right: 0px; bottom: 0px; }
.menubutton { float: left; background: #D41217; color: #FFFFFF !important; text-align: center; height: 60px; width: 60px; box-sizing: border-box; padding: 20px 0 0 0; font-size: 20px; margin: 15px 30px 0 0 }
.social-instagram { color: #D41217 !important; font-size: 28px; margin: 0 0 0 5px; vertical-align: middle; }
.social-instagram:hover { color: #333333 !important; text-decoration: none; }
/*** mainartist tiles ***/
.mainartist { position: relative; background-size: cover; background-position: center center; background-repeat: no-repeat; display: block; width: 100%; margin-bottom: 0px; box-sizing: border-box; }
.mainartist .mainblock { position: absolute; bottom: 30px; left: 0px; padding: 20px; background: rgba(212,18,23,0.8); color: #FFFFFF }
.mainartist .title { font-size: 30px; margin: 0 0 10px 0 }
/*** vale hover overlay ***/
.mainartist .vale { display: none; position: absolute; z-index: 6000; top: 0px; left: 0px; bottom: 0px; right: 0px; }
.mainartist:hover .vale { display: flex !important; align-items: center; justify-content: center; }
/*** index page tile 1: about me with photo ***/
#tile-1 { height: 80vh; min-height: 400px; background-position: center 35%; }
#tile-1 .vale { background: rgba(0,0,0,0.4); color: #FFFFFF; font-size: 26px; }
/*** index page tile 2: agenda red strip ***/
#tile-2 { height: 120px; min-height: 120px; background-color: #D41217; }
#tile-2 .mainblock { position: absolute; top: 50%; bottom: auto; left: 0px; right: 0px; transform: translateY(-50%); background: transparent; padding: 0px 20px; }
#tile-2 .vale { background: rgba(0,0,0,0.15); color: #FFFFFF; font-size: 26px; }
/*** agenda page photo tile ***/
#agenda-tile { height: 800px; min-height: 300px; background-position: center top; }
/*** about page photo tile ***/
#about-tile { height: 800px; min-height: 300px; background-position: center top; }
/*** contact page split hero ***/
#contact-hero { display: flex; height: 800px; width: 100%; }
#contact-photo { flex: 1; background-size: cover; background-position: center 85%; background-repeat: no-repeat; }
#contact-red-right { flex: 1; background-color: #D41217; }
#contact-mobile-row { display: none; }
.smallartist .block { position: absolute; bottom: 0px; left: 0px; right: 0px; padding: 20px; background: rgba(0,0,0,0.3); color: #FFFFFF }
.smallartist .title { font-size: 24px; }
/*** responsive ***/
@media only screen and (max-width: 768px) {
#ctr-mainmenu { font-size: 14px; float: right; }
h1 { font-size: 22px; }
h2 { font-size: 20px; }
h3 { font-size: 10px; }
#ctr-header .centered { padding: 0 10px; }
.description { font-size: 14px; padding: 10px 10px; }
#page-next #ctr-content { padding: 120px 0px 0px 0px; margin: 0px; }
#tile-1 { height: calc(100vh - 160px); min-height: 300px; background-position: center 37%; margin-top: 0px; }
#tile-2 { height: 80px; min-height: 80px; }
#tile-2 .mainblock { padding: 0px 15px; }
#tile-2 .title { font-size: 24px; }
.mainartist .title { font-size: 24px; }
.social-instagram { font-size: 16px; margin: 0 0 0 2px; }
#ctr-mainmenu a { margin: 0 5px 0 0; }
#tile-1 .vale { font-size: 16px; }
#tile-2 .vale { font-size: 16px; }
#agenda-tile { height: 300px; min-height: 300px; margin-top: 0px; }
#about-tile { height: 300px; min-height: 300px; }
#about-content { margin: 0px auto 0 !important; box-shadow: none !important; }
#about-title { display: none !important; }
/*** contact page mobile ***/
#contact-hero { display: none; }
#contact-content { display: none !important; }
#contact-mobile-row { display: flex; flex-direction: row; width: 100%; }
#contact-mobile-photo { flex: 1; height: 250px; background-size: contain; background-repeat: no-repeat; background-position: left top; background-color: #FFFFFF; }
#contact-mobile-text { flex: 1; padding: 10px; font-size: 11px; background: #FFFFFF; }
#contact-mobile-text h2 { font-size: 14px; }
/*** agenda page mobile - red strip no photo ***/
#agenda-tile { height: 80px !important; min-height: 80px !important; background-image: none !important; background-color: #D41217; }
.agenda-header { display: none !important; }
.agenda-title-mobile { display: block !important; }
#agenda-content { margin: 0px auto 0 !important; box-shadow: none !important; }
}
@media only screen and (max-width: 480px) {
#ctr-mainmenu { font-size: 16px; }
h1 { font-size: 24px; }
}