.debug {
    border: 1px solid red; 
}

.block-head {
    background-color: #444;
    color: white;
    text-transform: uppercase;
    padding: 5px 5px;
    font-weight: bold;
    
    margin-bottom: 10px;
}

.navbar-linktext {
    color: #333;
}

.newsbox {
    /* background-color: #273c35;  */
    overflow: hidden;
    color: white;
    height: 280px;
    width: 100%;
    padding: 10px;   
}

.newsbox-gradient {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,273c35+30&0+0,1+55 */
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(39,60,53,0.55) 30%, rgba(39,60,53,1) 55%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(39,60,53,0.55) 30%,rgba(39,60,53,1) 55%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(39,60,53,0.55) 30%,rgba(39,60,53,1) 55%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#273c35',GradientType=0 ); /* IE6-9 */
    
    position: absolute; bottom: 0px; left: 0px; right: 0px; height: 80px; margin: 0px 15px; padding: 0px 10px;
}

.newsbox-grid > div {
    margin-bottom: 20px;
}

#header_container {
	position: fixed; z-index: 20; background-color: white; width: 100%; -webkit-box-shadow: 0px 0px 103px -30px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 103px -30px rgba(0,0,0,0.75); -shadow: 0px 0px 103px -30px rgba(0,0,0,0.75);
}
#header_topline {
	width: 100%; height: 5px; background-color: #273c35;
}
#header_logo {
	max-height: 70px; margin-top: 15px;
}
#header_menustrip {
	padding-top: 30px;
}

#content_container {
	padding-top: 130px;
	min-height: calc(100vh - 300px);
}

.carousel-caption {
	text-align: left;
}

.item_image {
	height: 294px; width: 100%; background-size:cover; 
}

.greybox {
	padding-bottom: 132px; padding-right: 0px;
}

.greybox_inner {
	left: 15px; bottom: 0px; top: 0px; right: 15px; position: absolute; background-color: #333; color: white; padding: 20px;
}

.newsbox_background {
	z-index: -2; margin: 0px 15px; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; background-color: #273c35;
}

.newsbox_background_img {
	z-index: -1; opacity: 0.5; margin: 0px 15px; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; 
}

.newsbox_headline {
	font-size: 22px; font-weight: bold; margin-top: 90px
}

.newsbox_autor {
	margin-bottom: 10px;
}

.newsbox_content {
	
}

.newsbox-gradient>div {
	position: absolute; bottom: 10px;
}

.contentbox {
	padding: 15px;
	margin-bottom: 20px;
}

.contentbox>.termin_content {
	padding-left: 50px;
	padding-bottom: 20px;
}

.contentbox>.bereich {
	font-weight: 500; font-size: 14px;
}

.termin_content>.headline {
	font-weight: 500; font-size: 16px;
}

.termin_content>.detailtext {
	font-weight: 100; font-style: italic; font-size: 16px; letter-spacing: 1px;
}

.row.termin {
	background-color: #d4d8d7;
	color: #263c35;
	margin: 10px 0px;
	padding: 10px 0px;
	font-weight: 500;
}

.row.termin.vergangene {
	background-color: #f4f5f5;
	color: #ababab;
	text-align: center;
}

.row.termin>div>a {
	color: #263c35;
}

.koenige>.koenigspaar {
	text-align: center; height: 340px; overflow: hidden;
}

.koenigspaar>button {
	margin-top: 10px;
}

.koenigspaar>.foto {
	 width: 180px; height: 180px; border-radius: 100px; background-size: cover; background-position: center top; margin: 15px auto;
}

.koenigspaar>.jahr {
	font-weight: 200; letter-spacing: 1px;
}

.koenigspaar>.namen {
	font-weight: 500;
}


.vorstandsmitglied {
	text-align: center;
	height: 250px;
}
.vorstandsmitglied>.foto {
	 width: 140px; height: 140px; border-radius: 100px; background-size: cover; background-position: center top; margin: 15px auto;
}

.vorstandsmitglied>.position {
	font-weight: 200; letter-spacing: 1px;
}

.vorstandsmitglied>.name {
	font-weight: bold;
}

.anekdote {
	min-height: 300px;
	display: flex;
    align-items: center;
    justify-content: center;
    background-image: url('/assets/images/anekdote.png');
    background-size: cover;
    color: white;
    font-size: 16px;
    font-weight: 200;
    padding: 10px;
}

.gruen {
	background-color: #263c35;
	color: white;
}

.gruen-70 {
	background-color: #687772;
	color: white;
}

.gruen-5 {
	background-color: #f4f5f5;
	color: #263c35;
}

.terminbox {
    height: 170px;
}

a {
	color: #263c35;
}
a:hover, a:visited {
	color: #687772;
}


.navbar-default .navbar-toggle {
    border-color: #ddd;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #888;
}

.navbar {
	margin-bottom: 0px;
	min-height: 110px;
	background-color: white;
}

.navbar-brand {
	height: auto;
}

.navbar-nav {
	margin-top: 35px;
}

.navbar-toggle {
	margin-top: 40px;
	
}

.festablauf {
    overflow: auto;
    padding-top: 15px;
}

.festablauf>.col-xs-3, 
.festablauf>.col-xs-9 {
    margin: 5px 0px;
} 

div.stretchy-wrapper {
	width: 100%;
	padding-bottom: 66.5%; /* 16:9 */
	position: relative;
	background-size: cover;
	background-color: #283C35;
}

div.stretchy-wrapper > div {
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
	
}

.textcontainer {
	width: 100%; min-height: 30px; background-color: rgba(255,255,255,0.75); bottom: 0px; position: absolute; padding: 5px; font-size: 16px; max-height: 100%; overflow: hidden;
}

a.no-decoration, a.no-decoration:hover, a.no-decoration:visited {
	text-decoration: none;
	color: inherit;
}

a.white {
    color: white;
}
a.white:hover, a.white:visited {
    color: white;
}

.btn.btn-outline {
	border: 1px solid white;
    border-radius: 6px;
    background-color: transparent;
}

.btn.btn-outline:hover, .btn.btn-outline:focus {
	color:#d4d4d4;
}

.terminbox {
	
}

.terminbox>.datum{
	font-size: 22px;
}

.terminbox>.titel {
	font-size: 26px; font-weight: bold;
}

@media (min-width: 1200px)
{

    .terminbox>.datum{
		font-size: 18px;
	}
	
	.terminbox>.titel {
		font-size: 22px; font-weight: bold;
	}
}

@media (max-width: 991px)
{
	.greybox {
		margin-top: 30px;
	}
	
	.navbar-nav {
	    margin-top: 5px;
	    margin-bottom: 5px;
	}
	
}

@media (min-width: 768px) and (max-width: 991px)
{
	#content_container {
	    padding-top: 190px;
	}
	.terminbox>.datum{
		font-size: 14px;
	}
	
	.terminbox>.titel {
		font-size: 15px; font-weight: bold;
	}
	
	.navbar-nav>li>a {
		font-size: 10px;
	}

}

@media (max-width: 768px)
{
	#header_logo {
    	max-height: 50px;
    }
    
    .terminbox>.datum{
		font-size: 16px;
	}
	
	.terminbox>.titel {
		font-size: 19px; font-weight: bold;
	}
	
	.hofstaat {
		border: 15px solid white;
	}
}

@media (min-width: 992px) and (max-width: 1199px)
{
	
	.terminbox>.datum{
		font-size: 16px;
	}
	
	.terminbox>.titel {
		font-size: 19px; font-weight: bold;
	}
	
	.navbar-nav>li>a {
		font-size: 12px;
	}
}

/* ---------------------------------------------------------------------------
   Kontaktformular
   --------------------------------------------------------------------------- */

/* Das Feld im Honigtopf existiert nur, um automatische Ausfüller zu erkennen.
   Menschen sehen es nicht; wird es dennoch befüllt, verschickt der Server keine
   Mail (siehe sulu_form.honeypot in config/packages/sulu_form.yaml).

   Bewusst nicht "display: none": manche Bots überspringen so ausgeblendete
   Felder gezielt. */
.app-honigtopf {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Pflichtfelder kennzeichnen, damit vor dem Absenden klar ist, was nötig ist. */
#content_container form .control-label {
    font-weight: 600;
}

#content_container form .required .control-label:after {
    content: " *";
    color: #a94442;
}

/* Der Absendeknopf trägt das Grün der Seite statt des Bootstrap-Grüns. */
#content_container form .btn-success,
#content_container form .btn-success:focus {
    background-color: #263c35;
    border-color: #263c35;
    padding: 10px 24px;
    font-size: 16px;
}

#content_container form .btn-success:hover,
#content_container form .btn-success:active {
    background-color: #687772;
    border-color: #687772;
}

/* Etwas Luft zwischen Feldern und Knopf. */
#content_container form .form-group {
    margin-bottom: 18px;
}