@charset "utf-8";
/* CSS Document */

@import 'https://fonts.googleapis.com/css?family=Maitree';
@import url("font-awesome.min.css");
@import url("navi.css");
@import url("lightcase.css");
@import url("media.css");

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; }

html, body	{ background: #ffffff; font-family: 'Maitree', serif; font-size: 18px; color: #555555; line-height: 1.4; }

h1 { color: #555555; font-size: 1rem; font-weight: normal; text-align: center; }
h2 { color: #477b8f; font-weight: normal; margin-bottom: 1.25rem; }
h3 { color: #999999; font-weight: bold; margin-bottom: 1rem; }

p { margin-bottom: 1rem; }
a, a:link, a:focus { color: #477b8f; cursor: pointer; text-decoration: none; }
a:hover, a:visited { color: #555555; text-decoration: none; }
img { display: block; height: auto; max-width: 100%; }
hr { border: 0; border-top: 3px #477b8f solid; margin: 1rem 0 1.5rem ; width: 100%; }
li { list-style: none; }
audio { margin-bottom: 1rem; }

#header, #page, #footer { padding: 1.5rem 0; overflow: auto; width: 100%; }
#footer { border-top: 5px #477b8f solid; margin-bottom: 2rem; padding: 1rem 2%; text-align: right; }
#teaser img { border-top: 5px #477b8f solid; width: 100%; }

.bold { font-weight: bold; margin-bottom: 0.5rem; text-align: left; }
.capital { text-transform: uppercase; }
.color { color: #477b8f; }
.info { background: #477b8f; color: #ffffff; padding: 1rem 0.75rem; }
.text {  padding: 1rem 0.75rem; }
.small { font-size: 90%; margin-bottom: 0.25rem; }
.space { border: none; margin-bottom: 2rem }
.note { border: 1px solid #477b8f; padding: 1.5rem 1.5rem 0.5rem; margin-bottom: 1rem; }

#navigation { margin: 0 auto; z-index: 999; color: #477b8f; }
.nav { background: #477b8f; margin: 0 auto; position: relative; text-align: center; }
.nav li { color: #fff; text-transform: uppercase;  min-width: 14%;  }
.nav li a { color: #ffffff; padding: 1rem 5% ; }
.nav li a:hover { background: #477b8f; }
.nav li ul { background: #555555; width: 100%; }
.nav li ul li { width: 100%; }
.nav li ul li a { font-size: 0.75rem; }
.toggleMenu { background: #477b8f; color: #ffffff!important; padding: 1rem 0; text-align: center; width: 100%; }

.logo { margin: 0 auto; width: 50%; }
.logo img { width: 70%; margin: 0 auto; }
.flex { display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.content { background: #ffffff; max-width: 1200px; margin: 0 auto; width: 96%; }
.ratio_3 { width: 38.2%; }
.ratio_6 { width: 61.8%; }
.full { width: 100%; padding: 1rem 2%; }
.third { width: 33.333%; padding: 1rem 2%; }

.event_short { border-bottom: 3px solid #477b8f; margin: 1rem 0 0; padding-right: 1.375rem; position: relative; }
.event { border-bottom: 3px solid #477b8f; margin: 1rem 0 0; position: relative; }
.event  a { color: #477b8f; text-decoration: underline; }
.event  ul li { margin-bottom: 0.5rem; }
.event span { display: inline-block; min-width: 1.5rem; }
.more { background: #477b8f; bottom: 0; color: #ffffff!important; height: 1.25rem; margin: 0; position: absolute; right: 0; text-align: center; width: 1.25rem; }

.member { border: 3px solid #477b8f; margin: 1rem 1%; position: relative; width: 18%; }
.member .details { background: #477b8f; bottom: 0; color: #ffffff; padding: 0.5rem 2%;  width: 100%; }
.member p { margin: 0; text-align: center; }
.member img { display: block; width: 100%; }

.gallery { margin: 1rem 1%; width: 18%; }
.gallery img { display: block; width: 100%; }
.gallery a { transition: 0.2s ease all; }
.gallery a:hover { opacity: 0.85; transition: 0.2s ease all; }

.audio { margin-bottom: 1rem; }

.press { width: 100%; }   
.press tr { overflow: auto; padding: 0.75rem 0; vertical-align: top; }
.press tr td { padding: 0.5rem; }
.press tr td:nth-child(1) { width: 10%; }
.press tr td:nth-child(2) { width: 75%; }
.press tr td:nth-child(3) { width: 15%; }

.fieldlong input, .fieldlong textarea { border: 1px solid #555555; display: block; font-family: 'Maitree', sans-serif; font-size: 1rem; margin: 0.5rem 0; padding: 0.5rem 1%; max-width: 700px; width: 100%; }
.captchapic img { display: block; max-width: 700px; width: 100%; }
.captchafield input { border: 1px solid #555555; display: block; font-family: 'Maitree', sans-serif; font-size: 1rem;  margin: 0.5rem 0; padding: 0.5rem 1%; max-width: 700px; width: 100%; }
.buttonfield input { background: #477b8f; border: none; color: #ffffff; display: block; font-family: 'Maitree', sans-serif; font-size: 1.125rem;  margin: 0.5rem 0; padding: 0.5rem 1%; text-transform: uppercase; max-width: 700px; width: 100%; }
.buttonfield input:hover { background: #555555; cursor: pointer; }
.buttonfield input:disabled { background: #999999; color: #555555; cursor: default; }


/* WEBEDITION */

body > div:last-child:not(#lightcase-nav) { background: #ffffff; }
body > div:last-child:not(#lightcase-nav) > a { color: #555555; font-size: 0.5rem; margin-right: 0.5rem; }


@media screen and (max-width: 1000px) {
	
	
	.nav li a { padding: 1rem 0.625rem ;  }
}

@media screen and (max-width: 760px) and (orientation: landscape) {
	
	.logo { margin: 0 auto; width: 60%; }
	.ratio_3 { width: 100%; }
	.ratio_6 { width: 100%; }
	.third { width: 100%; }
	.audio { border: 3px solid #477b8f; }
	.nav li { width: 100%; }
	
	.event { border: 3px solid #477b8f; }
	.member { margin: 0.5rem 2%; width: 29%; }
	.gallery { margin: 0.5rem 2%; width: 29%; }
	.press tr td:nth-child(1), .press tr td:nth-child(2), .press tr td:nth-child(3) { display: block; padding: 0; width: 100%; }
}

@media screen and (max-width: 760px) and (orientation: portrait) {
	
	.logo { margin: 0 auto; width: 80%; }
	.ratio_3 { width: 100%; }
	.ratio_6 { width: 100%; }
	.third { width: 100%; }
	.audio { border: 3px solid #477b8f; }
	.nav li { width: 100%; }
	
	.event { border: 3px solid #477b8f; }
	.member { margin: 0.5rem 2%; width: 46%; }
	.gallery { margin: 0.5rem 2%; width: 29%; }
	.press tr td:nth-child(1), .press tr td:nth-child(2) { display: block; padding: 0; width: 100%; }
	.press tr td:nth-child(3) { display: block; padding: 0 0 0.75rem; width: 100%; }
}