/*	-------------------------------------------------------------- */
/*	CSS STYLESHEET COPYRIGHT WEBMULTIMEDIA GMBH, BERN - JAN CIBULA 
/*	-------------------------------------------------------------- */



/* 
NEUE FARBE FAMBAU  			    #a0b496 rgba(160,180,150,1.0)
*/

:root {
    --farbe_1:rgba(111,10,22,.9);
    --hintergrund:rgba(111,10,22,.9);
    --linkfarbe:rgba(111,10,22,.9);
    --randbreite:2px solid darkslategray;
}


/*	-------------------------------------------------------------- */
/*	SCHRIFTART											   
/*	-------------------------------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Lato&Istok+Web:wght@400;700');



/*	-------------------------------------------------------------- */
/*	BASICS 												   
/*	-------------------------------------------------------------- */



html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
	width:100%;
	height:100%;
}

body {
	position:relative;
	width:100%;
	height:100%;
	box-sizing:border-box;
	padding:0;
	margin:0;
	overflow-y:scroll;
	color:black;
    font-size:18px;
	background-color:rgba(250,250,250,1);
    background-size: cover;
    font-family: 'Istok Web', sans-serif;
    font-weight:400;
}

/* RESET DEFINITIONEN */
div {
	box-sizing:border-box;
	margin:0px;
	padding:0px;
}

img {
	border:none;
}


/* SCHRIFTARTEN */

body, input, textarea {
	font-family: 'Istok Web', Verdana, Arial, sans-serif;
	color:black;
}


.blaucolor {
	color:rgba(29,76,142,1.00);
}
.blauback {
	background:rgba(29,76,142,1.00);
}

/*	-------------------------------------------------------------- */
/*	CONTAINER											  			   
/*	-------------------------------------------------------------- */

#easycontainer {
	background:white;
	box-shadow:0px 0px 3px 1px rgba(33,33,33,0.2);
	margin:0 auto;
	position: relative;
	width:95%;
	padding:0rem;
    max-width:1600px; /* */
}

/*	-------------------------------------------------------------- */
/*	LINKS											  			   
/*	-------------------------------------------------------------- */

a:link {
	color:rgba(29,76,142,1.00);
	font-weight:bold;
	text-decoration: none;
}
a:hover {
}

a:link, 
a:visited {
	color:rgba(29,76,142,1.00);
    transition:all ease-in-out 0.2s;
} 
a:hover, 
a:active {
	color:black;
    transition:all ease-in-out 0.4s;
}
.linkdeaktiviert {
	pointer-events: none;
   	cursor: default;
	color:#ccc !important;
}
.not-active {
  /* pointer-events: none;*/
   cursor: default;
   opacity:0.5;
}

/*	-------------------------------------------------------------- */
/*	HEADER											  			   
/*	-------------------------------------------------------------- */

#easyheader {
    position: relative;
	height:12rem;
	border-bottom:1px solid rgba(29,76,142,1.00);
}

.logo_oben_links  {
	position:absolute;
	height:11rem;
	top:1rem;
    left:1rem;
}
.logo_oben_links img  {
	height:11rem;
}

.logo_oben_rechts  {
	position:absolute;
	height:4rem;
	bottom:1rem;
    right:1rem;
}
.logo_oben_rechts img  {
	height:3rem;
    margin-top:1rem;
}

#header_balken {
	position:relative;
	height:35rem;
    background-size: cover !important;
    background-position:center bottom !important;
	transition: all cubic-bezier(0, .75, .08, 1) 0.6s;
}
#header_balken:hover {
	height:35rem;
    background-size: cover !important;
    background-position:center bottom !important;
	transition: all ease-in-out 1.3s;
}

.header_titel {
    color:rgba(255,255,255,1);
    height:100%;
    display:flex;
    justify-content: flex-end;
    align-items: flex-end;
    font-size:1.7rem;
    font-weight:700;
}
.header_titel h1 {
    margin-right:1rem;
    margin-bottom:.5rem;
    color:rgba(255,255,255,0.9);
    text-shadow: 1px 1px 3px rgba(33,33,33,0.5);
}



.zweispalten {
	display:flex;
	justify-content: space-between;
    height:300px;
}
.zweispalten video {
	width:49%;
    background:darkgray;
}
.standard_duo {
	display:flex;
	justify-content: space-between;
}
.standard_text {
	width:auto;
}
.standard_bilder {
	width:50%;
}
.standard_bilder img {
	width:95%;
	border:1px solid black;
	border-radius:2px;
	transition: all ease-in-out 0.3s;
	opacity:1;
}
.standard_bilder img:hover {
	opacity:0.8;
	transition: all ease-in-out 0.5s;
}

.inhaltnews{
	padding-bottom:1rem;
	margin-bottom:2rem;
}
.inhaltnews h3{
	margin-bottom:0.5rem;
}
.inhaltnews p{
	margin-bottom:0.5rem;
	display:block;
	width:98%;
}
.bildtitel {
	color:gray;
	font-weight:bold;
	display:block;
}
.einbild{
	margin-top:2rem;
	padding-left:0rem;
}
/*	-------------------------------------------------------------- */
/*	NAVIGATION											  			   
/*	-------------------------------------------------------------- */





.galerie_neu_container{
	
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
}
.galerie_neu{
	width:100%;
	border:1px solid rgba(29,76,142,1.00);
	line-height: 0;
	margin-bottom:1rem;
	height:20rem;
}
.galerie_neu_container img{
	object-fit: cover;
	width:100%;
	height:100%;
}


/*	-------------------------------------------------------------- */
/*	NAVIGATION											  			   
/*	-------------------------------------------------------------- */

#easynavi {
    margin-top:0;
	background:rgba(29,76,142,1.00);
	display:flex;
}
#easynavi a {
	padding:1rem;
	color:white !important;
}
#easynavi a:last-child{
}

#easynavi a:hover {
	background:#ccc !important;
	color:rgba(29,76,142,1.00) !important;
}
#easynavi a.standpunkt {
	background:#fff !important;
	color:rgba(29,76,142,1.00) !important;
}









/*	-------------------------------------------------------------- */
/*	ERWEITERUNG											  			   
/*	-------------------------------------------------------------- */




			.bilder_2_spalten {
				display:flex;
				
			}
			.bilder_2_spalten .einbild {
				width:50%;
				padding:0rem 0.5rem;
			}
			
			.bilder_1_spalte {
			}
			.bilder img {
				height:95%;
				width:95%;
				object-fit: cover;
			}
			
			#easycontent table {
				border:1px solid black;
				width:800px !important;
			}
			#easycontent  td {
				border-top:1px solid black;
				padding:0.3rem;
			}
			
			#easycontent  tr:first-child td{
				border-top:none;
			}
			#easycontent  tr:first-child {
				background:rgba(153,179,216,1.00);
			}
			#easycontent  tr:last-child td {
				border-top:3px double black;
			}
			






/*	-------------------------------------------------------------- */
/*	CONTENT											  			   
/*	-------------------------------------------------------------- */

#easycontent {
	padding:1rem;
}

#easyheader {
    margin:0 auto;
}


.bottom_0{
	margin-bottom:0;
	padding-bottom:0;
}
.normal {
	font-weight:normal !important;
}




/*	-------------------------------------------------------------- */
/*	PROJEKTE										  			   
/*	-------------------------------------------------------------- */
.projekt_container{
	/*border:2px solid var(--farbe_1);*/
    margin-bottom:3rem;
}
.siegerprojekt .projekt_titel {
	/* background:gold !important;*/
}

.projekt_container img {
    
    cursor:pointer !important;
}



/* Filter */
.filter {
    padding:0.5rem;
    background:lightgray;
    margin-right:0.2rem;
}
.filteraktiv {
    padding:0.5rem;
    background:none;
    margin-right:0.2rem;
}
.projekt_titel {
	margin-bottom:0.5rem;
    padding:0.5rem;
    background:lightgray;
}
.projekt_titel h2{
	margin:0rem;
}
.projekt_klein {
	font-size:0.8rem !important;
	font-weight:normal;
}
.projekt_bildanzeige {
	border-bottom:1px solid lightgray;
	display:grid;
	grid-template-columns:49% 49%;
	grid-template-rows:49% 49%;
	grid-gap:0.5%;
	font-size:0.8rem;
	transition:.5s all ease-in-out;
}

.projekt_container_start {
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
    line-height:0;
}
.projekt_bildanzeige_start {
	width:100%;
    background-size:cover;
}
.projekt_bildcontainer_text_start {
	font-size:0.9rem;
}
.projekt_bildanzeige_start_both {
	width:70%;
    padding-right:0.5rem;
    background-size:cover;
}
.projekt_bildanzeige_start_both img {
	width:100%;
    object-fit: cover;
}

.projekt_dreibilder_start {
    display:flex;
    flex-direction:column;
	width:30%;     
    height:auto;

}

.projekt_dreibilder_start img {
	width:100%;
    object-fit: cover;
    height:auto;
    flex-grow:1; 
    padding-bottom:0.5rem;
}
.projekt_dreibilder_start img:last-child {
    padding-bottom:0rem;
}

.projekt_bildanzeige:hover {
	transition:1s all ease-in-out;
}
.projekt_bildanzeige h3, .projekt_bildcontainer_text_start h3 {
	margin:0.2rem 0rem 0rem 0rem;
	padding:0rem;
	font-size:1.2rem;
	color:gray;
	font-weight: 300;
}

h4 {
	margin:0.2rem 0rem 0rem 0rem;
	padding:0rem;
	font-size:1.2rem !important;
	color:black !important;
	font-weight: 300 !important;
}
h5 {
	margin:0.2rem 0rem 0rem 0rem;
	padding:0rem;
	font-size:1rem !important;
	color:gray !important;
	font-weight: 300 !important;
}

.projekt_bildanzeige p {
	margin:0.2rem 0rem 0.5rem 0rem;
	padding:0rem;
	font-size:1rem;
}
.projekt_bildanzeige img {
	border-radius:3px;
	object-fit: cover;
	width:99%;
}
.projekt_bildcontainer_links {
	position:relative;
	line-height:0; 
	grid-row: 1 / span 2;
	background-size: cover;
}
.projekt_bildcontainer_rechts_2 {
}
.projekt_bildcontainer_rechts_3 {
}

.projekt_bildcontainer_beschrieb{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:2rem;
	background-color:rgba(33,33,33,0.7);
	color:white;
	z-index:2;
}

.projekt_bildcontainer_text {
    font-size:1.4rem !important;	
    line-height:1.5rem; 
}

.projekt_bildcontainer_info {
    z-index:3;
    background:rgba(33,33,33,0.8);
    height:2rem;
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    line-height:2rem;
    padding:0rem 1rem;
    color:white;
}
.projekt_bildcontainer_bild {
	overflow:hidden;
	object-fit: cover !important;
}
.projekt_bildcontainer_bild img {
	object-fit: cover !important;
}

.projekt_bildcontainer_rechts_3 {
}

.projekt_bildcontainer_doppelbild{
	display:flex !important;
	justify-content: space-between;
	width:100% !important;
	height:100% !important;
}
.projekt_bildcontainer_doppelbild a{
    margin-right:0.5rem;
	width:99% !important;
	height:100% !important;
    background-size:cover;
}

.openprojectdetails {
	grid-column: 1 / span 2;
	font-size:1.2rem;
	line-height:1.2rem;
	cursor:pointer;
	height:4rem;
	background:rgba(222,222,222,0.8);
	display:flex;
	padding:1rem;
	align-items: center;
}
.oplink {
	font-size:1.2rem;
	background:rgba(222,222,222,0.8);
}

.projekt_more_container {
	grid-column: 1 / span 2;
	display:none;
}
.projekt_more_container_bilder{
	display:flex !important;
	flex-wrap:wrap !important;
	justify-content: space-between;
	margin:0;
	margin-top:0.5rem;
	padding:0;
}
.projekt_more_container_bilder span{
	border:1px solid lightgray;
	width:20%;
	margin:0 0 1rem 0;
	padding:0;
}
.projekt_more_container_bilder img{
	width:100%;
	margin:0;
	padding:0;
}

.projekt_more_container_text{
	column-count:3;
	column-gap: 2rem;
	font-size:0.9rem;
	margin-bottom:1rem;
}

.projekt_more_container_text p{
	margin-top:0;
	padding-top:0;
	text-align: justify;
}
.projekt_more_container_text h4{
	margin-top:0;
	padding-top:0;
	column-count:1;
	column-span: all;
	
}
/*	-------------------------------------------------------------- */
/*	TITEL, ABSATZ, FORMULARE										  			   
/*	-------------------------------------------------------------- */

h1, h2, h3, h4 {
	margin:1rem 0rem;
	font-weight: bold;
    color:rgba(29,76,142,1.00);
}

h1 {
	font-size: 1.8em;
	-webkit-margin-before: 0.67em;
	-webkit-margin-after: 0.67em;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
	}

h2 {
	margin:2rem 0rem 0.5rem 0rem;
	font-size: 1.6em;
	}
h3 {
}

p, h2 {
	padding:0;
	outline:0; 
}
hr {
	border:1px solid #fff;
}
fieldset {
	border:1px solid var(--farbe_1);	
	margin-bottom:10px;
    border-radius:2px;
}
legend {
	font-weight:normal;
    color:rgba(222,222,222,0.8);	
    background:var(--farbe_1);
    padding:0.2rem 0.5rem;
    border-radius:2px;
}

input, select, textarea {
	line-height: 1.625em;
}

/* LISTEN */

ul {
	padding-start: 20px;
	-moz-padding-start: 20px;
    -webkit-padding-start: 20px;
	line-height:1.5em;
}
ul li li {
	line-height:1.5em;
}
ol {
	padding-start: 20px;
	-moz-padding-start: 20px;
    -webkit-padding-start: 20px;
}
ol li {
	padding-bottom:15px;
}


/*	-------------------------------------------------------------- */
/*	LAYOUT ELEMENTE		(EIGENES DESIGN FRAMEWORK)								  			   
/*	-------------------------------------------------------------- */

.ausblenden {
	display:none !important;	
}

.einblenden {
	display:block !important;	
}
/* AUSRICHTUNGEN */

.overflow_fix {
	overflow:hidden;	
}
.clear_fix {
	clear:both;
	height:1px;
	width:100%;	
}

/* DIVERSES */

.scroll_overflow {
	overflow: auto;
}
.easy_clearfix {
	clear:both;	
	height:1px;
}


.klein {
	font-size:0.8em !important;
}
.sehrklein {
	font-size:0.5em !important;
}
.erfolg {
	/*padding:30px;*/
	color:#669966 !important;
}
.fehler {
	color:#f00;
}
.icon {
	padding-right:6px;
}
.icon-klein {
	font-size:15px !important;
	margin:7px !important;
}
.easy_animation {	
	-moz-transition:all ease-in-out  0.4s;
	-o-transition:all ease-in-out  0.4s;
	-webkit-transition:all ease-in-out  0.4s;
	transition:all ease-in-out  0.4s;
}

/*	-------------------------------------------------------------- */
/*	STRUKTUR DIV-LAYOUT											  			   
/*	-------------------------------------------------------------- */
.hamburger {
    display:none;
}
#close_container{
	background:rgba(113,155,88,0.9);
	border-radius:50%;
	padding:4px 6px;
	width:28px;
	height:28px;
	margin-left:-14px;
	position:absolute;
	top:-14px;
	left:52%;
}
#close_container:hover{
	background:#fff;
}
#close_container .fa:hover{
	color:rgba(113,155,88,0.9);
}




/*	-------------------------------------------------------------- */
/*	EIGENE KLASSEN											  			   
/*	------



	



/*	-------------------------------------------------------------- */
/*	FORMULAR											  			   
/*	-------------------------------------------------------------- */


.form2spalten{
	display:flex;
	border-bottom:1px solid lightgray;
	justify-content: space-between;
	align-items: flex-start;
}
.form2spalten .formspalte{
	width:47%;
}
.form2spaltebreite{
	width:95% !important;
	height:3rem !important;
	padding:0.25rem 1rem !important;
}
.form2spaltebreiteselect{
	padding:0.75rem 1rem !important;  
    -webkit-appearance: none;
}
.form2spaltebreitekurz{
	width:92% !important;
	height:3rem !important;
	padding:0.25rem 1rem !important;
}
.checkunsichtbar {
	display:none;
}
.bischeck, .voncheck {
}




#formular {
	padding:20px 0px;
	text-align:left;
	letter-spacing:1.1px;
    line-height:1.5em;
}
#formbox div {
	padding:10px 0;
	text-align:left;
}
#formbox div.captcha input {
	width:30%;
}
#formbox div.captcha img {
	
}

#formspez {
}
#formspez div,
#formspez h2 {
	background-color:#F3F3F3;
	padding:10px;
	margin:10px 0;
}
#formspez h2 {
	margin-top:30px;
}
.formspezupload div {
	padding:0;
}


input,
select,
textarea {
	font-size:1em !important;
	background-color:#cdcdcd;
	color:#121212 !important;
	border:none;
	padding:8px;
	width:98%;
}
input:focus, textarea:focus {
	color:#111;
	background-color:#cdcdcd;
}

input[placeholder], [placeholder], *[placeholder] {
	color:#343434 !important;
	padding:8px;
}
/* Webkit */
::-webkit-input-placeholder { color: #343434; 
	padding:8px;
	}
/* Firefox 4-18 */
:-moz-placeholder { color: #343434;
	padding:8px;
	}
/* Firefox 19+ */
::-moz-placeholder { color: #343434;
	padding:8px;
	}
/* IE10+ */
:-ms-input-placeholder { color: #343434;
	padding:8px;
	 }


textarea {
	height:70px;
}
input[type=submit],
input[type=button] {
	cursor:pointer;
	text-align:left;
	width:auto;
	padding:8px;
	margin:30px 10px 0 0;
	background-color:#343434;
	color:#cdcdcd !important;
}
input[type=submit]:hover,
input[type=button]:hover {
	background-color:#cdcdcd;
	color:#121212 !important;
}
input[type=radio],
input[type=checkbox] {
	width:auto;
}





#sendprogress {
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	text-align:center;
	background-color:rgba(255,255,255,0.5);
	line-height:100%;
	display:none;
}
#sendprogress .fa {
	position:absolute;
	top:50%;
}











/*	-------------------------------------------------------------- */
/*	FOOTER TO TOP										  			   
/*	-------------------------------------------------------------- */
#easyfooter {
    margin-top:2rem;
    padding:1rem;
	background:rgba(29,76,142,1.00);
    color:white !important;
}
#easyfooter a:link, #easyfooter a:visited, #easyfooter a:hover, #easyfooter a:active {
	background:none !important;
    color:white !important;
	font-weight:normal !important;
}
#easyfooter a:hover {
    color:lightgray !important;
	background:var(linkfarbe)  !important;
}
.easytotop {
	
	background:rgba(29,76,142,1.00);
	color:white !important;
	border:1px solid #333;
	padding:1rem; 
	font-weight: bold;
	position:fixed;
	bottom:30px;
	right:20px;
	display:none;
}
.easytotop a{
	
	color:white !important;
}
/*	-------------------------------------------------------------- */
/*	ENDE FOOTER TO TOP										  			   
/*	-------------------------------------------------------------- */
























/*	===================================================== MEDIA QUERIES =============================================== */
/*	===================================================== MEDIA QUERIES =============================================== */
/*	===================================================== MEDIA QUERIES =============================================== */
/*	===================================================== MEDIA QUERIES =============================================== */
/*	===================================================== MEDIA QUERIES =============================================== */
/*	===================================================== MEDIA QUERIES =============================================== */


 /* ---------------------------- 1020px ---------------------------- */
 /* ---------------------------- 1020px ---------------------------- */
 /* ---------------------------- 1020px ---------------------------- */

@media(max-width: 1500px) { 

	

html {
}
body {
    font-size:1em;	
}
	
	h1 {
		font-size:2.3rem;
	}
	.bericht {
		width:6rem !important;
		top:1rem !important;
	}
	
	
.projekt_titel h2 {
    font-size:2rem !important;
}
    .projekt_bildanzeige {
	display:block;
	font-size:0.8rem;
	transition:.5s all ease-in-out;
}

.projekt_bildcontainer_links {
 grid-row: 1 / span 3; 
    margin-bottom:0.5rem;
}
.projekt_klein{
	font-size:1rem !important;
}
.projekt_bildanzeige {
 grid-row: 1 / span 3; 
    width:100%;
}
.projekt_bildcontainer_doppelbild a{
    width:100% !important;
    margin-right:0;
}
.projekt_bildcontainer_doppelbild a:first-child{
    width:100% !important;
    margin-right:0.5rem;
}
.einblenden {
		display:block !important;
		width:100%;	
}

.ausblenden {
	display:none !important;	
}

.zweispalten {
	flex-direction:column;
    height:auto;
}
.zweispalten video {
	width:100%;
    margin-bottom:1rem;
}
	.bilder_2_spalten {
				flex-direction: column;
	} 
.bilder_2_spalten .einbild {
				width:100%;
				padding:0rem 0.5rem;
	} 
    
.hamburger {
    border-radius:0.5rem;
    display:block;
    position:absolute;
    background:rgba(113,155,88,0.9);
    color:white;
    width:3.5rem;
    height:3.5rem;
    padding:0.5rem;
    z-index:888;
    text-align:center;
    top:-2rem;
    right:1rem;
}
.hamburger .fa {
    color:white;
    font-size:2.5rem;
}
     #easynavi   {
        width:100% !important;
        display:flex;
        flex-direction: column;
    }
    #easynavi a:link,#easynavi a:active {
        width:97% !important;
        font-size:1.4rem;
    }

    
    #filter a{
        display:block;
        width:97% !important;
        margin-bottom:0.2rem;
    }
    
    .standard_duo {
        display:flex;
        flex-direction: column;
    }
    .standard_bilder {
        margin-top:0.5rem;
        width:100% !important;
    }
    
    .projekt_dreibilder_start{
        height:auto;
    }
    .projekt_dreibilder_start img {
        height: 10rem;
    object-fit: cover;
}
    
    
    
			#easycontent table {
				border:1px solid black;
				width:100% !important;
			}
    	
.galerie_neu_container{
	
	width:100%;
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
}
.galerie_neu{
	width:100%;
	border:1px solid rgba(29,76,142,1.00);
	line-height: 0;
	margin-bottom:1rem;
	height:20rem;
}
.galerie_neu_container img{
	object-fit: cover;
	width:100%;
	height:100%;
}
    
}