/* -------------------------------------------- */
/* ------------------Font---------------------- */

/*Add your font at here*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap');


/* -------------------------------------------- */
/* ------------------Reset--------------------- */
a,abbr,acronym,address,applet,article,aside,audio,b,blockquote,big,body,center,canvas,caption,cite,code,command,datalist,dd,del,details,dfn,dl,div,dt,em,embed,fieldset,figcaption,figure,font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,keygen,label,legend,li,meter,nav,object,ol,output,p,pre,progress,q,s,samp,section,small,span,source,strike,strong,sub,sup,table,tbody,tfoot,thead,th,tr,tdvideo,tt,u,ul,var{
	background:transparent;border:0 none;font-size:100%;margin:0;padding:0;border:0;outline:0;vertical-align:top;}





/* -------------------------------------------- */
/* --------------Cookie Consent---------------- */

.cc_dialog.simple {
    right: 30px !important;
    bottom: 30px !important;
}

.light.cc_dialog {
    background-color: #fff !important;
    color: #4b4b4b !important;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 20px 0 #000000;
    box-shadow: 0px 0px 20px 0 #000000;
}

.light.cc_dialog button.cc_b_cp {
    background-color: #4b4b4b !important;
    color: #fff !important;
}


/* -------------------------------------------- */
/* ------------------Style--------------------- */

html, body {
	width:100%; 
	padding:0; 
	margin:0;
	height:100%;
	}

body {
	background: #0099cc;
	color: #4b4b4b;
	font-family: 'Open Sans', sans-serif;
	font-size:0.875rem;
	/* text-transform: uppercase; */
	font-weight:600;
	background: url(../images/background.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	line-height:180%;	
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
  }
  
.cc_banner-wrapper {
    text-shadow: none;
}

a{color: #4b4b4b;text-decoration: none;}
a:hover {color: #0099cc;; text-decoration: none;}

a.button{cursor: pointer;color: #ffffff;line-height: 14px;font-family:'Open Sans', sans-serif;font-size: 0.875rem;font-weight: bold;	background: #3F3F3F;border:1px solid #ffffff; -webkit-border-radius: 4px;-moz-border-radius: 4px;-khtml-border-radius: 4px;border-radius: 4px;}
a.button {	display: inline-block;	text-decoration: none;	padding: 6px 12px 6px 12px;}
a.button:hover{}

.clear{content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

h1, h2, h3, textfarbe {
/*	font-family: 'Shadows Into Light', cursive;*/
	text-align:left; 
	font-size:1.8rem;
	color:#0099cc;
	line-height:120%;
	padding-bottom: 15px;
}

h1 {	
	font-family: 'Open Sans', sans-serif;
	font-size:0.80rem;
	color:#4b4b4b!important;
}

h3 {
	font-size:1.4rem;
}

.big {
	font-size:1.8rem;
}

red, .red {
	color:#0099cc!important;
}

black, .black {
	color:#4b4b4b!important;
}


hr {
    border: none;
    background-color: #ccc;
    height: 1px;
}

/*ol, ul {list-style:none;}*/

ol, ul {
    margin-left: 40px;
    padding: 7px 0;
}

li {
    /* padding-bottom: 10px; */
}

ul.blanko {
	list-style-type: none;
	margin: 0;
}

ul.blanko > li {
	padding: 0;
}

ul.dashed {
	list-style-type: none;
	margin-left: 10px;
}
ul.dashed > li {
	text-indent: -5px;
}

ul.dashed.second > li {
    padding-bottom: 0;
    line-height: 1.5;
}

ul.dashed > li:before {
	content: "•";
	padding-right: 5px;
	text-indent: -5px;
}

ul.arrows, ul.check {
    list-style: none;
	margin-left: 16px;
}

 ul.arrows li, ul.check li {
    text-indent: -23px;
    margin-left: 23px;
}

ul.arrows li::before {
    content: '\f061';
    font-family: 'fontawesome';
    /* color: #fff; */
    padding-right: 10px;
}

ul.check li::before {
    content: '\f00c';
    font-family: 'fontawesome';
    padding-right: 10px;
}

/*li::before {
    content: '•';
	margin-right: 10px
}*/

.left {
	text-align:left !important;
}

.right {
    text-align: right !important;
    display: inline-block;
    width: 100%;
}

.center {
    text-align: center !important;
}

.bildrechts {
	float: right;
	margin-left: 20px;
	margin-bottom: 30px;
}

blockquote, q {quotes:none;}

/*table, table td {padding:0;border:none;border-collapse:collapse;}*/

img {vertical-align:top;}

embed {vertical-align:top;}

article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block;}

mark, rp, rt, ruby, summary, time {display:inline;}
/*input, textarea {border:0; padding:0; margin:0; outline: 0;}*/
iframe {border:0; margin:0; padding:0;}
/*input, textarea, select {margin:0; padding:0px;}*/


.wrap-nav, .wrap-featured,  .wrap-content {
	-webkit-box-shadow: 0px 0px 20px 0 #000000;
	box-shadow: 0px 0px 20px 0 #000000;
	border-radius: 10px;
	overflow: auto;
}

.mitte-mitte {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
	width: auto;
}


button, .btn {
    border-radius: 5px;
    border: none;
    background: #0099cc;
    color: #fff;
    font-size: 1rem;
    padding: 10px 15px;
    cursor: pointer;
}

button:hover, .btn:hover {
    background: #4b4b4b;
}

.bildrechts {
	float: right;
	margin-top: 20px;
	margin-left: 20px;
	margin-bottom: 30px;
	
}

/* -------------------------------------------- */
/* ------------------Header-------------------- */

header {
	background: #99cc33;
	/* background: #fff; */
	border-bottom: 3px solid #4b4b4b;
	height: 180px;
}
	
header .wrap-header {
	height: 100%;
	/* background: #ffffff; */
	
}
	
header .wrap-header .header-inside {
	/*background:#3F3F3F;*/
	color: #ffffff;
	padding: 10px;
}

header #logo {
	position: relative;
	display: inline-block;
	overflow: hidden;
	margin: 0;
	height:100%;
	width: 100%;
}

header #logo img {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    width: auto;
    height: calc(100% - 25px);
}



/* -------------------------------------------- */
/* ------------------Featured---------------- */

.featured{position: relative;margin:20px auto;z-index: 1}
.featured .wrap-featured{
	
	background: rgba(255,255,255,0.8);
	}

.featured .wrap-featured .slider{padding: 0px;}


/* -------------------------------------------- */
/* ------------------Content------------------- */

#content {
	margin: 40px 0;
}

#content .wrap-content{
	background: rgba(255,255,255,0.8);
	padding-top: 5px;
}

.maincontent {
	margin:20px 0px; 
	padding: 0 25px 20px 25px;
	/*border-bottom:1px dashed #CCC;*/
}
.maincontent-slider {
	margin:20px 0px; 
	padding: 0;
	/*border-bottom:1px dashed #CCC;*/
}
	
.maincontent p {
	font-family: 'Open Sans', sans-serif;
	font-size: 1rem;
	font-weight:400;
	color: #4b4b4b;
	text-align:left; 
	line-height:150%;
	padding: 7px 0;
}
	
.image-text {
    color: #0099cc !important;
    font-size: 1rem !important;
    font-weight: bolder !important;
	line-height:120%;
	padding-top: 10px;
    text-align: center !important;
}
	
.image-text a {
    color: #0099cc !important;
	font-size: 1.8rem;
	line-height:120%;
}

article {
	clear: both;
}

.googlemap {
	border: 1px solid #4b4b4b;
	width: 100%;
}

.googlemap.mobile {
    display: none;
}



/* -------------------------------------------- */
/* ------------------Components-------------------- */
.photos{}
.photos:after{content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
.photos a{display: block; float:left; margin: 0px 4px 10px 4px;position: relative;}
.photos a img{display:block; border:1px solid #CCC;}


/* -------------------------------------------- */
/* ------------------Navigation---------------- */

nav {
	position: relative;
	margin: 40px 0;
	z-index: 10
}
nav .wrap-nav {
	height: 49px; 
	background: rgba(255,255,255,0.8);
	overflow: initial;
}

.topnav {
	overflow: hidden;
	background-color: transparent;
}

.topnav a {
    float: left;
    display: block;
    color: #4b4b4b;
    text-align: center;
    padding: 11px 16px;
    text-decoration: none;
	letter-spacing: 1px;
	text-transform: uppercase;
    font-size: 1rem;
    height: auto;
	width: auto;
	border-bottom: 3px solid #0099cc;
}

.active {
	border-bottom: 3px solid #0099cc;
}

.topnav .icon {
	display: none;
}

.dropdown {
	float: left;
	overflow: hidden;
}

.dropdown .dropbtn {
	height:49px;
	display: block;
}

/* dropdown pfeil */

.fa-caret-down:before {
    top: 4px !important;
    position: relative;
}

.dropdown-content {
	display: none;
	position: absolute;
	background-color: rgba(255,255,255,0.8);
	min-width: 170px;
	z-index: 20;
	width: auto;
	height: auto;
	border-top: 3px solid #4b4b4b;
	margin: -3px 0;
}

.dropdown-content a {
	display: block;
	width: calc(100% - 32px);
	text-align: left;
} 

.topnav a:hover {
  background-color: rgba(238,238,238,0.5);
  /* color: white; */
  border-bottom: 3px solid #4b4b4b;
}

.dropdown-content a:hover {
  /* background-color: #eee;
  color: black; */
}

.dropdown:hover .dropdown-content {
  display: block;
  border-bottom: 3px solid transparent;
}



/* -------------------------------------------- */
/* ------------------- SLIDER ----------------- */

.nivo-controlNav {
    display: none;
}




/* -------------------------------------------- */
/* ------------------Footer-------------------- */

footer {
	/*background: rgba(255,255,255,0.8);*/
	height: auto;
    margin: -20px 0 20px 0;
	color:#ffffff;
	text-shadow: 1px 1px 1px #000;
}

footer .wrap-footer {
	background:/*none*/;
}

footer .wrap-footer .copyright {
	/*text-align:center; */ 
	padding:0px 0px;
}

footer a {
	/* text-decoration:underline; */ 
	color:#ffffff; 
}

footer a:hover {
	/* text-decoration:underline; */ 
	color:#0099cc; 
}
footer .fa::before {
    padding-left: 10px;
    font-size: 20px;
}

.copyright img {
    width: 17px;
    display: inline-block;
    top: 4px;
    position: relative;
	padding-left: 10px;
}


/* -------------------------------------------- */
/* -------------------- GRID ------------------ */


.zerogrid {
    width: 80% !important;
    position: relative;
    margin: 0 auto;
    padding: 0px;
}

.g-grid.first {
    /* margin-bottom: -40px; */
}

.g-grid {
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    flex-flow: row wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    text-rendering: optimizespeed;
}

.g-block {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    -webkit-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    min-height: 0;
}

.size-33 {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    box-flex: 0;
    -webkit-flex: 0 33%;
    -moz-flex: 0 33%;
    -ms-flex: 0 33%;
    flex: 0 33%;
    width: 33%;
}

.size-50 {
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    box-flex: 0;
    -webkit-flex: 0 50%;
    -moz-flex: 0 50%;
    -ms-flex: 0 50%;
    flex: 0 50%;
    width: 50%;
}

.g-content {
    margin: 0px 10px;
    padding: 0;
}

.box1, .box2, .box3 {
    width: 100%;
    /*height: 320px;*/
}


/* -------------------------------------------- */


.img-zoom-container {
  position: relative;
}

.img-zoom-lens {
  position: absolute;
  border: 1px solid #d4d4d4;
  /*set the size of the lens:*/
  width: 40px;
  height: 40px;
}

.img-zoom-result {
  border: 1px solid #d4d4d4;
  /*set the size of the result div:*/
  width: 300px;
  height: 300px;
}