@charset "utf-8";

@font-face {
	font-family: Maian;
	src: url(MAIAN.TTF);
  }

/* MAIN SKELETON */
html, body {
	height:100%;
	margin:0px;
	padding0px;	
}

#page {
	width:1178px;
	min-height:100%;
	margin:auto;
	position:relative;
	background-color:#f4f9e4;
	background-size:100% 100%;
}

#header {
	width:100%;
	height:161px;
	position:relative;
	padding-top:25px;
}



#logo1 {
	background-image:url(img/logo.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#impressum {
	position:relative;
	float:right;
	margin:auto;
	margin-right:5.01%;
	margin-top:-20px;
	
}



#unterschrift {
	background-image:url(img/unterschrift.png);
	height:93px;
	width:221px;
	margin:auto;
	margin-right:0px;
}

#navbar {
	float:center;	
	width:100%

}

#navbar ul {
	display:flex;
	width:100%;
	flex-wrap: wrap;
	justify-content: space-between;
}

#navbar a{
	font-family: Maian;
	font-size:1.1rem;
	font-weight: 100;

	margin:0 12px;
}

#navbar a:hover{
	color:#95B522;
}

#navbar a:active{
	color:#95B522;
}


#picn {
	background-image:url(img/pic_news.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#pic1 {
	background-image:url(img/pic1.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#pic2 {
	background-image:url(img/pic2.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#pic3 {
	background-image:url(img/pic3.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#pic4 {
	background-image:url(img/pic4.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#pic5 {
	background-image:url(img/pic5.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#pic6 {
	background-image:url(img/pic6.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#pic7 {
	background-image:url(img/pic7.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}

#pic8 {
	background-image:url(img/pic8.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}
#pic_hund {
	background-image:url(img/pic_hund.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;
}


#wrapper {
	width: 100%;
	display: inline-block;
	position: relative;
}

#wrapper:after {
    padding-top: 33%; /*16:9 ratio*/
    display: block;
    content: '';
}

#wrappern {
	width: 100%;
	display: inline-block;
	position: relative;
}

#wrappern:after {
    padding-top: 33%; /*16:9 ratio*/
    display: block;
    content: '';
}



#uberschrift {
	background-image:url(img/head_home.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#uberschrift2 {
	background-image:url(img/head_uber.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#uberschrift3 {
	background-image:url(img/head_burn.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#uberschrift4 {
	background-image:url(img/head_erschopfung.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#uberschrift5 {
	background-image:url(img/head_krise.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#uberschrift6 {
	background-image:url(img/head_hsp.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}
#uberschrift9 {
	background-image:url(img/head_hund.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

iframe {
	border-style:none;
	float:right;
	width:100%;
	height:100%;
	
}

#news {
	border-style:none;
	float:right;
	width:34%;
	margin:10% 12% 18% 10%;
	height:47%;
	overflow:auto;
	webkit-overflow-scrolling : touch;
}

#uberschrift7 {
	background-image:url(img/head_kontakt.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#uberschrift8 {
	background-image:url(img/head_impressum.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#text_burn {
	background-image:url(img/text_burn.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#text_hsp {
	background-image:url(img/text_hsp.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#text_krise {
	background-image:url(img/text_krise.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#text_erschopfung {
	background-image:url(img/text_erschopfung.png);
	background-size:100% 100%;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}

#text_hund {
	background-image:url(img/text_hund.png);
	background-size:80% 80%;
	background-position:center;
	background-repeat: no-repeat no-repeat;
	margin:0px;
	position: absolute;
    top: 0; bottom: 0; right: 0; left: 0;	
}




#wrapperhead {
	width: 602px;
	display: inline-block;
	position: relative;
}

#wrapperhead:after {
    padding-top: 14.28%; /*16:9 ratio*/
    display: block;
    content: '';
}

#wrapperlogo {
	width: 446px;
	display: inline-block;
	position: relative;
	left:50%;
	margin-left:-223px;
}


#wrapperlogo:after {
    padding-top: 32.7%; /*16:9 ratio*/
    display: block;
    content: '';
}

#wrappertext {
	width: 926px;
	display: inline-block;
	position: relative;
	margin-bottom:20px;
}


#wrappertext:after {
    padding-top: 11.01%; /*16:9 ratio*/
    display: block;
    content: '';
	
}

#wrappertext2 {
	width: 926px;
	display: inline-block;
	position: relative;
	margin-bottom:20px;
}


#wrappertext2:after {
    padding-top: 8.02%; /*16:9 ratio*/
    display: block;
    content: '';	
}

#wrappertext4 {
	width: 925px;
	display: inline-block;
	position: relative;
	margin-bottom:20px;
}


#wrappertext4:after {
    padding-top: 13.4%; /*16:9 ratio*/
    display: block;
    content: '';	
}

#wrappertext3 {
	width: 522px;
	display: inline-block;
	position: relative;
	margin-bottom:20px;
}


#wrappertext3:after {
    padding-top: 10.72%; /*16:9 ratio*/
    display: block;
    content: '';	
}

#foto {
	float:left;	
	margin-left:0px;
	margin-right:6px;
	
}

#main {
	padding-top:20px;
	margin-top:0px;
	width:79%;	
	margin:auto;
	padding-bottom:67px;
	
	
}

#footer {
	padding-top:10px;
	width:100%;
	height:27px;
	position:absolute;
	bottom:0;
	background-color:#c8dd5d;	
	text-align:center;
}

#bgfooter {
	padding-top:10px;
	width:100%;
	height:27px;
	background-color:#fff;	
	margin-top:-37px;
}

#footer a {
	color:#25845b;	
	font-family:Calibri, Helvetica, sans-serif;
    font-weight:bold;
}

a#footerlong {
	display:block;	
}

a#footershort {
	display:none;	
}

a#footertiny {
	display:none;
}

/* NAVIGATION */

nav {
	margin-left:126px;
	width:926px;;
	background-color:#00705b;	
	font-size:11pt;
	font-family: 'PT Sans', Arial, sans-serif;
	font-weight: bold;
	position:relative;
	
}

nav ul {
	padding:0;
	margin:0 auto;
	width:926px;
}

nav li {
list-style: none;
margin:0;
}

nav a {
	color:#fff;
	display:inline-block;
	text-align:center;
	text-decoration:none;
	line-height:40px;

}

nav a#pull {
	display:none;	
}


.navtop {
	display:none;
}


/* BUBBLE EFFECT */

.bubbleeffect
{
	list-style-type:none;
	float:right;
	position:absolute;
	top:95px;
	right:5%;
}
.bubbleeffect li
{
	display:inline;
	width: 50px;
	height:60px;
}
.bubbleeffect li img
{
	width: 32px; /* for width of images */
	height: 32px; /* for height of images */
	border:0;
	margin-right: 5px; /*for spacing between images*/
	-moz-transition:-moz-transform 0.1s ease-in;-webkit-transition:-webkit-transform 0.1s ease-in;
	-o-transition:-o-transform 0.1s ease-in;
}
.bubbleeffect li img:hover
{
	-moz-transform:scale(1.8); /* for image scaling */
	-webkit-transform:scale(1.8);
	-o-transform:scale(1.8);
}


/* CONTENT % TYPES */

#text2col {
	width:100%;
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	-webkit-column-gap: 15px;
	-moz-column-gap: 15px;
	column-gap: 15px; 	
}


#t1 {
	font-family:Calibri, Helvetica, sans-serif;
	text-align:justify;
	font-size:17px;
	margin:0;
	display:block;
	color:#00705b;
}

#liste {
	font-family:Calibri, Helvetica, sans-serif;
	text-align:left;
	font-size:17px;
	margin:0;
	display:block;
	color:#00705b;
}

#t1n {
	-webkit-column-break-inside:avoid;
	-moz-column-break-inside:avoid;
	-o-column-break-inside:avoid;
	-ms-column-break-inside:avoid;
	column-break-inside:avoid;
	display:inline-block;
	font-family:Calibri, Helvetica, sans-serif;
	text-align:justify;
	font-size:17px;
	margin:0;
	color:#00705b;
}

#t2 {
	font-family:Calibri, Helvetica, sans-serif;
	text-align:center;
	font-size:17px;
	margin:auto;
	display:block;
	color:#00705b;
}

#t3 {
	font-family:Calibri, Helvetica, sans-serif;
	text-align:justify;
	font-size:10px;
	margin:auto;
	display:block;
	color:#00705b;
}

h1 {
	margin:0;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	font-weight:bold;	
}


a#link {
	color:#c8dd5d;
	text-align:center;
	text-decoration:underline;
	text-shadow:0px 1px 1px #B0FFBE;	
	background-position:center;
	background-repeat:no-repeat;
}

/* MEDIA QUERIES */


@media screen and (max-width:1178px) {
	nav a {
	  background-position:left;

	}
	#page {
		width:100%;	
	}
	
	a#footerlong {
		display:none;	
	}

	a#footershort {
		display:block;	
	}
	
	nav {
		margin-left:9.34%;
		width:75.6%;
		height:auto;
	}
	
	nav li {
		float:left;
		position:relative;	
	}
	nav ul {
		width:100%;	
	}
	
}

@media screen and (max-width:926px) {
	#wrappertext {
		width: 100%;
}

	#wrappertext2 {
		width: 100%;
	}
	
	#wrappertext4 {
		width: 100%;
	}
	
}

@media screen and (max-width:600px) {
	iframe {
		float:center;
		width:100%;
		height:95%;
}
	#news {
		float:center;
		width:83%;
		height:35%;
		margin-top:70%;
}

	
	#text_burn {
		background-image:url(img/text_burnk.png);
	}
	
	#text_erschopfung {
		background-image:url(img/text_erschopfungk.png);
	}
	
	#text_krise {
		background-image:url(img/text_krisek.png);
	}
	
	#text_hsp {
		background-image:url(img/text_hspk.png);
	}
	#text_hund {
		background-image:url(img/text_hundk.png);
		background-size:contain;
	}
	
	#wrappertext3 {
		width: 100%;
	}
	
	#wrappertext:after {
  	   padding-top: 32.5%; /*16:9 ratio*/
	}
	
	#wrappertext2:after {
  	   padding-top: 34.66%; /*16:9 ratio*/
	}
	
	#wrappertext3:after {
  	   padding-top: 19%; /*16:9 ratio*/
	}
	
	#wrappertext4:after {
  	   padding-top: 40.16%; /*16:9 ratio*/
	}
	
	
	a#btn1 #btn2 #btn3 #btn4 #btn5 #btn6 #btn7 #btn8{
		width:100%;
	}	
	
	#picn {
		margin-top:10px;
		background-image:url(img/pink.png);
	}		
	
	#pic1 {
		margin-top:10px;
		background-image:url(img/pic1k.png);
	}
	#pic2 {
		margin-top:10px;
		background-image:url(img/pic2k.png);
	}
	#pic3 {
		margin-top:10px;
		background-image:url(img/pic3k.png);
	}
	#pic4 {
		margin-top:10px;
		background-image:url(img/pic4k.png);
	}
	#pic5 {
		margin-top:10px;
		background-image:url(img/pic5k.png);
	}
	#pic6 {
		margin-top:10px;
		background-image:url(img/pic6k.png);
	}
	#pic7 {
		margin-top:10px;
		background-image:url(img/pic7k.png);
	}
	#pic8 {
		margin-top:10px;
		background-image:url(img/pic8k.png);
	}	
	#pic_hund {
		margin-top:10px;
		background-image:url(img/pic_hund_k.png);
	}	
	#wrapper:after {
    	padding-top: 55.83%; /*16:9 ratio*/
	}
	#wrappern:after {
    	padding-top: 116.6%; /*16:9 ratio*/
	}
	
	#wrapperhead {
		width: 100%;
		display: inline-block;
		position: relative;

	
	}
	
	#wrapperlogo {
		width: 90%;
		display: inline-block;
		position: relative;
		margin:auto;
		left:0%;
	
	}
	
	nav {
		height:auto;
		margin-left:0;		
		width:100%;
	}
	
	nav ul {
		width:100%;	
	}
	nav li {
		width:25%;
		float:left;
		position:relative;	
	}
	
	nav a {
		text-align:center;
		width:100%;	
		margin:0 !important;
	}
	
	#text2col {
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}

}

@media only screen and (max-width:480px) {
	nav.navtop {
		display:block;	
	}
	
	nav li {
		width:50%;
	}

	.mainnav ul {
		display:none!important;
		height:auto;	
	}
	
	nav a#pull {
		display: block;
		background-color: #00705b;
		width: 100%;
		position: relative;
	}
	
	nav a#pull:after {
		content:"";
		background: url('nav-icon.png') no-repeat;
		width: 30px;
		height: 30px;
		display: inline-block;
		position: absolute;
		right: 15px;
		top: 10px;
	}
	
	a#footertiny {
		display:block;
	}

	a#footershort {
		display:none;	
	}

	
}

@media only screen and (max-width : 320px) {
	nav li {
		display: block;
		float: none;
		width: 100%;
	}
	nav li a {
		border-bottom: 1px solid #576979;
	}
}


/* CLEARFIX */

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

/* IMAGE HOVER */