@charset "UTF-8";
/* CSS Document */

/*
biomes of the earth css styles

body
type - h1 thru 6+ paragraph
layout - all divs both ids and class (text areas, banners, footer)
specialty - links ect
other - ?????

color codes:

tan rgba(227,187,139,1.0)
deep tan rgba(131,129,108,1.0)
pale green rgba(139,160,134,1.0)
light green rgba(105,195,120,1.0)
deep green rgba(81,142,87,1.0)
light blue rgba(177,226,235,1.0)

type / fonts:
	font - 	main heading - Trevor Extrabold
			sub head - Cheap Pine
			Paragraph - IM FELL DW Pica
*/

body{min-height:3000;
	margin:0;
	padding:0;
	background: rgba(255,255,255,1.0);
}

#topper{  display: flex;
  align-items: center;
  justify-content: center;
}

#leftpicture{float:left;
width:600px;
background:rgba(255,255,255,1.00);
margin:0 auto;
	padding-left: 125px}

#rightpicture{float:right;
width:600px;
background:rgba(255,255,255,1.00);
margin:0 auto;
	padding-right: 125px}

#lefttext{float:left;
width:600px;
background:rgba(255,255,255,1.00);
margin:0 auto;
	padding-left: 125px}

#righttext{float:right;
width:600px;
background:rgba(255,255,255,1.00);
margin:0 auto;
	padding-right: 125px}

#banner_home{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/water.jpg") no-repeat scroll center center/
	cover;
	position: relative;
	top: 40px;
}

#banner_about{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/space.jpg") no-repeat scroll center center/
	cover;
	position: relative;
	top: 40px;
	color: rgba(255,255,255,1.00);
}

#banner_chap{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/chaparral/utah.jpg") no-repeat scroll center center / 
	cover;
	color:rgba(242,242,242,1.00);
}

#banner_savannah{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/savannah/natural.jpg") no-repeat fixed center center / 
	cover;
	color:rgba(242,242,242,1.00);
}

#banner_tropforest{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/tropical_rainforest/junglefloor.jpg") no-repeat fixed center center / 
	cover;
	color:rgba(0,0,20,1.00);
}

#banner_tempforest{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/temperate/fall.jpg") no-repeat fixed center center / 
	cover;
	color:rgba(242,242,242,1.00);
}

#banner_desert{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/desert/dunes.jpg") no-repeat fixed center center / 
	cover;
	color:rgba(242,242,242,1.00);
}

#banner_tundra{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/tundra/mountain.jpg") no-repeat fixed center center / 
	cover;
	color:rgba(12,12,12,1.00);
}

#banner_grass{width:1200px;
height:400px;
margin: 0 auto;
padding-top: 50px;
padding-left: 80px;
background:url("../images/grassland/tree.jpg") no-repeat fixed center center / 
	cover;
	color:rgba(242,242,242,1.00);
}

.banner_copy{width:1200px;
position: absolute;
top: 40px;
color: rgba(255,255,255,1.00);
margin-left: auto;
margin-right: auto;
text-align: center;
}

#main_content{min-hieght: 600px;
width:1100px;
background:rgba(255,255,255,1.00);
margin:0 auto;
	padding: 50px;
}

h1{font-family: 'Fredericka the Great', cursive;
font-size:36px;}

h2{font-family: 'Laila', sans-serif;}

h3{font-family: 'Amatic SC', cursive;
font-size:32px}

h4{font-family: 'Laila', sans-serif;
font-size:14px;}

h5{tont-family: 'Laila', sans-serif;
font-size:16px;
	text-align:center;}

.ghost-button {
	display: inline-block;
	width: 100px;
	font-weight: bold;
	padding: 8px;
	color: #fff;
	border: 1px solid #fff;
	border-radius: 5px;
	text-align: center;
	outline: none;
	text-decoration: none;
	transition: background-color 0.2s ease-out, color 0.2s ease-out;
}

.ghost-button-lush {
	display: inline-block;
	width: 100px;
	font-weight: bold;
	padding: 8px;
	color: rgba(105,195,120,1.0);
	border: 1px solid rgba(105,195,120,1.0);
	border-radius: 5px;
	text-align: center;
	outline: none;
	text-decoration: none;
	transition: background-color 0.2s ease-out, color 0.2s ease-out;
}

.ghost-button-barren {
	display: inline-block;
	width: 100px;
	font-weight: bold;
	padding: 8px;
	color: #fff;
	border: 1px solid rgba(131,129,108,1.0);
	border-radius: 5px;
	text-align: center;
	outline: none;
	text-decoration: none;
	transition: background-color 0.2s ease-out, color 0.2s ease-out;
}

.ghost-button-arid {
	display: inline-block;
	width: 100px;
	font-weight: bold;
	padding: 8px;
	color: #fff;
	border: 1px solid rgba(227,187,139,1.0);
	border-radius: 5px;
	text-align: center;
	outline: none;
	text-decoration: none;
	transition: background-color 0.2s ease-out, color 0.2s ease-out;
}

.ghost-button-frigid {
	display: inline-block;
	width: 100px;
	font-weight: bold;
	padding: 8px;
	color: rgba(177,226,235,1.0);
	border: 1px solid rgba(177,226,235,1.0);
	border-radius: 5px;
	text-align: center;
	outline: none;
	text-decoration: none;
	transition: background-color 0.2s ease-out, color 0.2s ease-out;
}

.ghost-button:hover,
.ghost-button:active {
	background-color: #fff;
	color: #000;
	transition: background-color 0.3s ease-in, color 0.3s ease-in;
}

.ghost-button-lush:hover,
.ghost-button-lush:active {
	background-color: rgba(105,195,120,1.0);
	color: rgba(81,142,87,1.0);
	transition: background-color 0.3s ease-in, color 0.3s ease-in;
}

.ghost-button-barren:hover,
.ghost-button-barren:active {
	background-color: rgba(139,160,134,1.0);
	color: #fff;
	transition: background-color 0.3s ease-in, color 0.3s ease-in;
}

.ghost-button-arid:hover,
.ghost-button-arid:active {
	background-color: rgba(227,187,139,1.0);
	color: rgba(131,129,108,1.0);
	transition: background-color 0.3s ease-in, color 0.3s ease-in;
}

.ghost-button-frigid:hover,
.ghost-button-frigid:active {
	background-color: rgba(177,226,235,1.0);
	color: #fff;
	transition: background-color 0.3s ease-in, color 0.3s ease-in;
}

.social{margin: 6px;}

.row_container{width:1200px;
margin:0px auto;
background:rgba(255,255,255,1.00);}

.feature{
width: 400px;
height:300px;
text-align: center;
float:left;
background:rgba(255,255,255,1.00);
padding: 0px 10px;
color: rgba(15,15,15,1.00);
border-right: rgba(25,25,25,1.00) solid 1px;
}

.feature2{
width: 400px;
height:300px;
text-align: center;
float:left;
background:rgba(255,255,255,1.00);
padding: 0px 10px;
color: rgba(15,15,15,1.00);
border-right: rgba(25,25,25,1.00) solid 0px;
}

.feature:last-child {border-right: rgba(25,25,25,1.00) solid 0px;
}

.clearfloats{clear: both;}

#main_content{width:1200px;
margin:0px auto;
padding: 50px;
background: rgba(255,255,255,1.00);
color: rgba(0,0,0,1.00);
}

footer{width:1200px;
height: 250px;
margin: 0 auto;
margin-left: 100 center;
margin-right: 100 center;
background:rgba(177,226,235,1.0);
text-align:center;
padding-top: 50px;}

footer a:link{color: rgba(255,255,255,1.00);}
footer a:visited{color: rgba(255,255,255,1.00);}
footer a:hover{color: rgba(255,255,255,1.00);
text-decoration: none;}
footer a:active{color: rgba(255,255,255,1.00);}