.panel{
	padding: 2em 2em;
	
}

.top-bar-section  ul.button-group li > a {
	
	color: white;
	
}

.title h1{
	
	padding:.75em 0;
}

.location{
	padding:4em 0;
	
	
}

.button-group{
	  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  transition: all 300ms ease-out; 

	padding: .5em 0;
	margin:1em 0  2em 0;
}

.button-group.round, .switcher, .button-group .button, .text{
		-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;

}

.location .button{
	margin:0;
	color: #000;
	background:  #f2efe9

	
}

button.small, .button.small{
	font-size: 0.6125em;
	font-weight: bold;
	line-height: 3em;
/* 	padding-bottom: 40px; */
	
	
}


.location .button:hover, .location .button:focus, .location .button.active, .location .social .button:hover{
background:#5bd79a;
color:#fff;

}




@media only screen and (max-width: 768px){
	
	.button-group{
		margin-before: 0;
		
	}
	.button-group.even-6 li{

	width:100%;}


	


	
	button.small, .button.small{

	line-height:2em;
	padding-bottom: 0.625em;
}	
			
}






svg{
  max-height:100%; /* chrome needs it  */
  margin-bottom: 0;
  padding-bottom: 0;
  
}


.bird-2{
	min-height: 450px;
}




.my-svg-container{
 display: inline-block;
 position: relative;
 width: 100%;

 vertical-align: top; /* top | middle | bottom ... do what you want */
}



/* *** background styles, same as Savannah *** */

.background1, .river, .fish-group, .running-away{
	
	background-color: #65c298; /* light green */

	
}

.background2{
	background-color: #3f2500; /* dark brown */
}

.pattern{
	
	padding:40px 0;
}

.river{
	background-image:
	url(svg/cloud1.svg),
	url(svg/cloud2.svg),
	url(svg/cloud3.svg),
	url(svg/cloud4.svg),
	url(river-savannah1.jpg); /* bright yellow */
	background-position: -10% 20%,60% 55%, 40% 80%, 90% 10%, left top;

	background-repeat: no-repeat;
	background-size:auto, auto, auto, auto, contain;
	min-height: 800px;
	
}

.die{
	background-image:
	url(svg/cloud4.svg),
	url(svg/cloud2.svg),
	url(svg/cloud1.svg),
	url(svg/cloud3.svg); /* bright yellow */
	background-position: -10% 20%,60% 55%, 70% 80%, 90% 10%;

	background-repeat: no-repeat;
	background-size:auto, auto, auto, auto;
	min-height: 800px;
	
}

.flew-back{
	background-image:
	url(svg/cloud1.svg),
	url(svg/cloud4.svg),
	url(svg/cloud2.svg);
	background-position: -10% 20%, 70% 80%, 70% 30%;
	background-repeat: no-repeat;
	background-size:auto, auto, auto;
	min-height: 800px;
	
}

.anthill{
	
	background-image:
	url(svg/cloud1.svg),
	url(svg/cloud3.svg),
	url(svg/cloud1.svg),
	url(savannah-grass.jpg); /* bright yellow */
	background-position: -10% 20%,5% 95%, 100% 80%, left top;
	background-repeat: no-repeat;
	background-size:auto, auto, auto, cover;
	min-height: 500px;
}


.ant-chamber{
	
	background-image:
	url(svg/cloud4.svg),
	url(svg/cloud2.svg),
	url(svg/cloud1.svg),
	url(svg/cloud3.svg); /* bright yellow */
	background-position: -10% 20%,60% 55%, 70% 80%, 90% 10%;
	background-repeat: no-repeat;
	background-size:auto, auto, auto, auto;
}

.fish-group{
	background-image:
	url(svg/thin-fish2.svg),
	url(svg/perch-fish.svg),
	url(big-fish-savannah.jpg); 
	background-position: 95% 35%, 63% 100%, left top;
	background-repeat: no-repeat;
	background-size:400px, 1000px, contain;
	min-height: 800px;
	
}

.running-away{
	
	background-image:
	url(svg/cloud2.svg),
	url(svg/cloud1.svg),
	url(savannah-grass.jpg); /* bright yellow */
	background-position: 125% 35%, 53% 70%, 80% -240%;
	background-repeat: no-repeat;
	background-size:auto, auto, cover;
	
}

.lotus{
	
	max-height: 400px;
}


.village{
	background-image:
	url(svg/cloud1.svg),
	url(svg/cloud2.svg),
	url(svg/cloud3.svg),
	url(svg/cloud4.svg),
	url(savannah-village.jpg); /* bright yellow */
	background-position: -10% 20%,60% 55%, 40% 80%, 90% 10%, left top;
	background-color: #65c298;
	background-repeat: no-repeat;
	background-size:auto, auto, auto, auto, cover;
	min-height: 700px;
	
}




.text{
	background: #fff; 
	
}

.text p{
	color: #222222;
	font-size: 1.4em;
	line-height: 1.4;
	margin-bottom: 1.45em;
	
}





/* *** button styles *** */

.button-group .switcher{
	margin-right:4%;
	
}

.button-group > *:last-child{
	margin-right:0;
	
}


.switcher{
	padding:125px 10px 10px;



}

@media only screen and (max-width: 768px){

.switcher{
	padding:0;
	margin-bottom: 1px;
	background: none;
	

}

.text p{

	font-size: 1.13em;
	line-height: 1.4;

	
}




}
.switcher-savannah, .switcher-canyon, .switcher-rainforest, .switcher-desertnight, .switcher-foggymountain {
	background-image: url(death-switcher-bg.jpg);
	background-repeat: no-repeat;
}


.switcher-savannah {
	background-position: 0 top;
}
.switcher-canyon {
	background-position: 0 -190px;
}
.switcher-rainforest {
	background-position: 0 -380px;
}
.switcher-rainforest {
	background-position: 0 -380px;
}
.switcher-desertnight {
	background-position: 0 -570px;
}
.switcher-foggymountain {
	background-position: 0 -760px;
}



/* *** SVG styles *** */


/* Savannah Color Set */

.st0{fill:#f36c21;} /* orange */
.st1{fill:#cee6bf;} /* light green */
.st2{fill:#65c298;} /* medium green */
.st3{fill:#12b57b;} /* great green */
.st4{fill:#ffcf01;} /* yellow */
.st5{fill:#deb343;} /* light brown */
.st6{fill:#b07e09;} /* medium brown */
.st7{fill:#3f2500;} /* dark brown */
.st8{fill:#ffffff;} /* white */
.st9{fill:#000000;} /* black */







/* *** text styles *** */