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


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


@import url('https://fonts.googleapis.com/css?family=Oxygen');


/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */
/*	HTML TAGS GRUNDLAGEN 										   */									   
/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */


/*
Dunkelblau rgba(29,96,147,1); 
Hellblau rgba(172,196,232,1);


*/



body {
	width:100%;
	height:100%;
	box-sizing:border-box;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: top center;
	background-size: contain;
	margin:0;
	overflow-y:scroll;
	color:#000;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#feffff+0,eaeaea+100 */
	background: rgb(255,255,255);
    font-size:18px;
}


/* RESET DEFINITIONEN */
div {
	box-sizing:border-box;
}


/* TITEL ABSÄTZE FORMULARE */

body, input, textarea {
	font-family: 'Oxygen', sans-serif;
}

hr {
	border:0.5px solid #444;
}
fieldset {
	border:1px solid rgba(222,222,222,0.9);	
	margin-bottom:10px;
}

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

h1, h2, h3, h4 {
    color:rgba(29,96,147,1);
    margin:0.5rem 0rem 0.8rem 0;
}

h1 {
		font-size: 1.7rem;
   
    color: rgba(172,196,232,1);
	}
h2 {
		font-size: 1.2rem;
	}
h3 {
		font-size: 1.1rem;
	}

hr {
    color: rgba(29,96,147,1);
}


/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */
/*	LINKS & NAVIGATION											   */									  		
/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */

a:link, 
a:visited  {
    color:rgba(29,96,147,1);
    font-weight:bold;
	text-decoration:none;
}
a:hover,
a:active,
a.standpunkt {
	color:rgba(172,196,232,1);
}

.hauptmenu a {
	padding: 10px;
	display:inline-block;
}

.untermenu{
	font-size:0.9em;
}	
.untermenu a {
	padding: 10px;
	display:inline-block;
}

.untermenu2{
	font-size:0.8em;
}
.untermenu2 a {
	padding: 10px;
	display:inline-block;
}

.untermenu_responsive {
	display:none;
}
.untermenu2_responsive {
	display:none;
}


/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */
/*	SUCHE												           */										  		
/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */


/* *** Suchen Formular *** */
#easysuche {
	border:0px solid #0f0;
	/*display:none;*/
	margin-top:35px;
	margin-left: auto;
}

input[type=text].suche {
	display:inline-block;
	width:170px;
	font-size:0.8em;
	line-height: normal;
}
input[type=submit].suche {
	display:inline-block;
	font-size:0.8em;
	line-height: normal;
	margin:0 0 0 8px;
}
.suchergebnis {
	padding-bottom: 20px;
	border-top: 1px solid #444;
}
.suchergebnis:last-of-type {
	padding-bottom: 5px;
}
.suchbegriff {
	background-color:#b1cbf1;
}
#suchButton {
	background-color:rgba(255,255,255,0);
	border:0;
	font-size:1.1em;
	margin-left:5px;
	padding-top:5px;
}


/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */
/*	LAYOUT												           */										  		
/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */

#easyheader {
	background:rgba(255,255,255,0.9);
	padding:10px;
	display:flex;
	position: relative;
	margin:0 auto;
	width:65%; /* 100%;*/
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

#easylogo {
	float:left !important;
}

#easylogo_right {
	position: absolute;
	right:0px;
}
#easylogo_right img{
	margin:10px 15px;
	height:80px;
}
#easylogo img {
	margin:10px 15px;
	height:120px;
}
.menu {
	margin-top:65px;
}
#easynav {
	margin-top:65px;
	margin-left:15px;
	font-size:1.1em;
}

#hamburger {
	display:none;
}

#easycontent {
	background:rgba(255,255,255,0.9);
	padding:30px;
	margin:30px auto;
	width:65%;
	max-width:1600px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
    font-size:1rem;
    line-height:1.5rem;
}

#easycontent img {
	max-width:100%;
	border-radius: 10px;
}

#easycontent li {
	list-style-type: disc;
	margin-left:-1rem;
    line-height:1.2rem;
}

#easycontent p{
    margin:0rem !important;
    margin-bottom:0.2rem !important;
}
#easycontent strong{
    padding-bottom:0.3rem !important;
}
#easyfooter {
	margin-top:20px;
	border-top:1px solid rgba(29,96,147,1);
	padding:10px 0px 0px 0px;
	font-size:0.8em;
}

#easyfooter a:link, #easyfooter a:visited, #easyfooter a:active {
    color:rgba(29,96,147,1);
	
}
#easyfooter a:hover {
	color:#bbb;
}


.easytotop {
	background-color:rgba(255,255,255,0.6);
	/*border:1px solid #333;*/
	padding:12px; 
	font-weight: bold;
	font-size: 1.4em;
	position:fixed;
	bottom:20px;
	right:20px;
	display:none;
	z-index:9999;
}




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

.clear_fix {
	clear:both;
	height:0px;
}

.klein{
	font-size:0.7em;
}
.erfolg {
	color:#0F6413;
}

.rechts {
	float:right;
}

.dateien {
	margin:10px 0;
}

.spaltentext p { 
	/*
	column-count: 2;
	column-gap: 30px;
	*/
}


/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */
/*	BILDERBOX 													   */										  		
/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */

.bilderbox {
	display:flex;
	flex-wrap:wrap;
	justify-content: space-between;
	/* 
	Andere Ausrichtungen (justify-content): 
		center
		flex-start (linksbündig)
		flex-end (rechtsbündig)
		space-between (über die ganze Breite)
		Siehe auch: https://css-tricks.com/snippets/css/a-guide-to-flexbox/
	*/
}

.bilder img {
	height:250px;
}


/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */
/*	NEWS 														   */										  		
/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */

ul {
	margin-top:0.2rem;
}

.news {
	width:100%;
}

.newsHeader {
	margin-top:0.8rem;
	margin-bottom:0.4rem;
}

.newsContent {
	
}

.newsBild {
	width:30%;
	float:left;
	padding-right:20px;
}
.newsBild img {
	width:100%;
}

.newsText {
	width:70%;
	float:left;
}
.newsTextVolleBreite{
	width:100%;
	float:left;
}


.newsText p {
	margin-top:0;
}


/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */
/*	TEAM 														   */										  		
/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */

.teamWrapper {
	display:flex;
	flex-wrap:wrap;
    flex-direction: column;
}
.team {
    border-bottom:1px solid #eee;
	width:100%;
	padding:0.2rem 0rem;
	margin-bottom:-0.2rem;
}
.team h2 {
	margin-top:-0.2rem;
	padding-top:0rem;
}
.team img {
	width:50%; 
}

.team ul {
	margin-bottom:0rem;
	padding-bottom:0rem;
}
.weiterlesen, .mehrinfos {
	padding:0.2rem;
    cursor:pointer;
    margin:0.2rem 0rem 1rem 0rem;
}
.weiterlesen_inhalt {
	display:none;
    padding:0.2rem;
    font-size:0.9rem;
}
.weiterlesen_inhalt p{
    line-height:1rem;
    margin:0rem;
    padding:0rem;
}
.weiterlesen_inhalt ul{
    line-height:1rem;
	margin-left:2rem;
    padding:0rem;
}
.weiterlesen_inhalt li{
    line-height:1rem;
    margin:0rem;
	margin-left:-1rem;
    padding:0rem;
}
.weiterlesen_inhalt h4{
    margin:0.5rem 0rem 0rem 0rem;
    padding:0rem;
}

/*
bevor eine neue Jahreszahl kommt
*/

.weiterlesen_inhalt strong{
    margin-top:1rem;
    padding-top:1rem;
    margin-bottom:2rem;
    padding-bottom:2rem;
}
.weiterlesen_inhalt strong::after{
    content:"";
    margin-bottom:2rem;
    padding-bottom:2rem;
}
.weiterlesen {
    background:rgba(222,222,222,0.9);
	padding:0.5rem;
}
.weiterlesen_inhalt {
    
}

.mehrinfos {
    background:rgba(222,222,222,0.9);
	padding:0.5rem;
    cursor:pointer;
}
.weiterlesen_inhalt {
	display:none;
    padding:0.5rem;
    font-size:0.9rem;
}


/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */
/*	BILDERGALERIE 												   */										  		
/*	-------------------------------------------------------------- */
/*	-------------------------------------------------------------- */

#easygalerie {

}

/* Fancybox Anpassungen */

.fancybox-caption {
	text-align:center;
	border-top:0px;
	font-size:16px;
	padding:15px 0;
}

/* Isotope Einstellungen */

.grid-item {
	float: left;
	width: 33.333333%;
	padding-bottom:10px;
	padding-right:10px;
}
.grid-item img {
	width:100%;
	height:100%;
}


/*	---------------------------------------------------------------------------------------------------------------------- */
/*	---------------------------------------------------------------------------------------------------------------------- */
/*	FORMULARE 							  																			       */
/*	---------------------------------------------------------------------------------------------------------------------- */
/*	---------------------------------------------------------------------------------------------------------------------- */

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

/* Spezial Formular (mehrseitig) */
#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;
	background-color:#cdcdcd;
	color:#121212;
	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:120px;
}
input[type=submit],
input[type=button] {
	cursor:pointer;
	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%;
}


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


 /* ---------------------------- 1050px ---------------------------- */


@media(max-width: 1050px) { 
	
	#easyheader {
	width:100%; 
	}
    
	#easycontent {
		width:80%;	
	}
	#easylogo_right{
		display:none !important;
	}
	.hauptmenu a {
		font-size:0.9em;
	}
	
	.untermenu{
		font-size:0.75em;
	}
	
	.team {
		width:50%;
	}
	
	.grid-item {
		width:50%;
	}
	
}


 /* ---------------------------- 900px ---------------------------- */


@media(max-width: 900px) { 
	
	#easycontent {
		width:100%;	
	}
	#easycontent img {
		
	}
	
	
	
	#easyheader {
		flex-direction: column;	
	}
	
	.spaltentext p {
		column-count: 1;
		column-gap: 0px;
	}
	
	#formular img {
		width:initial;
	}
	
	#formular {
		padding:0px;
	}
	#formbox div {
		padding:0px;
	}

	/* NAVIGATION -------------- */
	#hamburger {
		display:inline-block;
		position:absolute;
		right:30px;
		top:35px;
		font-size: 2em;
	}
	#easynav {
		width:100%;
		display:none;
		margin:0;
	}
	.menu {
		
	}
	.hauptmenu a {
		display:block;
		text-align: left;
	}
	.untermenu_responsive {
		margin-left:20px;
		display:block;
		font-size:0.8em;
	}
	.untermenu2_responsive {
		margin-left:20px;
		display:block;
		font-size:0.9em;
	}
	.untermenu {
		display:none;
	}
	.untermenu2 {
		display:none;
	}
	
	#easysuche {
		display:none;
		margin:15px 0 15px 10px;
		width: 100%;
	}
	input[type=text].suche {
		width:70%;
	}
	
	.bilder img {
		height:initial;
		width:100%;
	}
	/* end NAVIGATION -------------- */
	
	.newsBild {
		width:100%;
		padding-right:0px;
	}
	
	.newsText {
		width:100%;
	}
	.newsText p {
		margin:1em 0;
	}
	
	
	.grid-item {
		width:100%;
		padding-right:0;
	}
	
	.team {
		width:100%;
		padding:0;
	}
	.team img {
		width:100%; 
	}
	

}
