/* Fonts */
@import url(http://fonts.googleapis.com/css?family=Oswald:700,400);
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300);

body
{
margin: 0;
padding: 0;
background-color:#3b95da;
		font-family: 'Roboto', sans-serif;
	  	font-size: 18px;
	  	color: #fff;
	  	font-weight: 100;
}

#top
{
background: rgba(40,147,219,1);
background: -moz-linear-gradient(top, rgba(40,147,219,1) 0%, rgba(183,222,237,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(40,147,219,1)), color-stop(100%, rgba(183,222,237,1)));
background: -webkit-linear-gradient(top, rgba(40,147,219,1) 0%, rgba(183,222,237,1) 100%);
background: -o-linear-gradient(top, rgba(40,147,219,1) 0%, rgba(183,222,237,1) 100%);
background: -ms-linear-gradient(top, rgba(40,147,219,1) 0%, rgba(183,222,237,1) 100%);
background: linear-gradient(to bottom, rgba(40,147,219,1) 0%, rgba(183,222,237,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2893db', endColorstr='#b7deed', GradientType=0 );
overflow: hidden;
}

#constructionWrapper
{
width: 100%;
background: rgba(234,173,74,1);
background: -moz-linear-gradient(top, rgba(234,173,74,1) 0%, rgba(130,0,0,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(234,173,74,1)), color-stop(100%, rgba(130,0,0,1)));
background: -webkit-linear-gradient(top, rgba(234,173,74,1) 0%, rgba(130,0,0,1) 100%);
background: -o-linear-gradient(top, rgba(234,173,74,1) 0%, rgba(130,0,0,1) 100%);
background: -ms-linear-gradient(top, rgba(234,173,74,1) 0%, rgba(130,0,0,1) 100%);
background: linear-gradient(to bottom, rgba(234,173,74,1) 0%, rgba(130,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaad4a', endColorstr='#820000', GradientType=0 );
}

#constructionWrapperTop {
	width: 100%;
	background-color: rgba(234,173,74,1);
}

#constructionWrapper2
{
width: 100%;
background: rgba(205,188,0,1);
background: -moz-linear-gradient(top, rgba(205,188,0,1) 0%, rgba(185,142,0,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(205,188,0,1)), color-stop(100%, rgba(125,102,0,1)));
background: -webkit-linear-gradient(top, rgba(205,188,0,1) 0%, rgba(125,102,0,1) 100%);
background: -o-linear-gradient(top, rgba(205,188,0,1) 0%, rgba(125,102,0,1) 100%);
background: -ms-linear-gradient(top, rgba(205,188,0,1) 0%, rgba(125,102,0,1) 100%);
background: linear-gradient(to bottom, rgba(205,188,0,1) 0%, rgba(125,102,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cdbc00', endColorstr='#7d6600', GradientType=0 );
}

#constructionWrapper3
{
width: 100%;
background: rgba(64,100,184,1);
background: -moz-linear-gradient(top, rgba(64,100,184,1) 0%, rgba(35,55,144,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(64,100,184,1)), color-stop(100%, rgba(35,55,144,1)));
background: -webkit-linear-gradient(top, rgba(64,100,184,1) 0%, rgba(35,55,144,1) 100%);
background: -o-linear-gradient(top, rgba(64,100,184,1) 0%, rgba(35,55,144,1) 100%);
background: -ms-linear-gradient(top, rgba(64,100,184,1) 0%, rgba(35,55,144,1) 100%);
background: linear-gradient(to bottom, rgba(64,100,184,1) 0%, rgba(35,55,144,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4064b8', endColorstr='#233790', GradientType=0 );
}

#greenlivWrapper
{
width: 100%;
background: rgba(93,169,0,1);
background: -moz-linear-gradient(top, rgba(93,169,0,1) 0%, rgba(41,112,0,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(93,169,0,1)), color-stop(100%, rgba(41,112,0,1)));
background: -webkit-linear-gradient(top, rgba(93,169,0,1) 0%, rgba(41,112,0,1) 100%);
background: -o-linear-gradient(top, rgba(93,169,0,1) 0%, rgba(41,112,0,1) 100%);
background: -ms-linear-gradient(top, rgba(93,169,0,1) 0%, rgba(41,112,0,1) 100%);
background: linear-gradient(to bottom, rgba(93,169,0,1) 0%, rgba(41,112,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5da900', endColorstr='#297000', GradientType=0 );
}

#greenLivingWrapper
{
width: 100%;
background: rgba(14,75,124,1);
background: -moz-linear-gradient(top, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(14,75,124,1)), color-stop(100%, rgba(68,126,193,1)));
background: -webkit-linear-gradient(top, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
background: -o-linear-gradient(top, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
background: -ms-linear-gradient(top, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
background: linear-gradient(to bottom, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e4b7c', endColorstr='#447ec1', GradientType=0 );
}

#savingEnergyWrapper
{
width: 100%;
background: rgba(255,231,111,1);
background: -moz-linear-gradient(top, rgba(255,231,111,1) 0%, rgba(255,187,92,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,231,111,1)), color-stop(100%, rgba(255,187,92,1)));
background: -webkit-linear-gradient(top, rgba(255,231,111,1) 0%, rgba(255,187,92,1) 100%);
background: -o-linear-gradient(top, rgba(255,231,111,1) 0%, rgba(255,187,92,1) 100%);
background: -ms-linear-gradient(top, rgba(255,231,111,1) 0%, rgba(255,187,92,1) 100%);
background: linear-gradient(to bottom, rgba(255,231,111,1) 0%, rgba(255,187,92,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffe76f', endColorstr='#ffbb5c', GradientType=0 );
}

#savingEnergyPadding
{
width: 100%;
height: 80px;
background-color: rgba(255,187,92,1) 100%;
}

#savingEnergy
{
max-width: 960px;
margin: 0 auto;
overflow: hidden;
}

#logoWrapper
{
width: 100%;
background-color: rgba(0,20,10,0.33);
}

#logoWrapperFoundation, #logoWrapperFrame, #logoWrapperInsulation, #logoWrapperFlooring, #logoWrapperWalls, #logoWrapperWindows, #logoWrapperPaint, #logoWrapperPlumbing, #logoWrapperAppliances, #logoWrapperSolar, #logoWrapperAirQuality, #logoWrapperLandscaping, #logoWrapperChemicals
{
width: 100%;
background-color: #1f6c96;
margin-bottom: 15px;
}

#logoWrapperFoundation {background-color: #d98300}

#logoWrapperInsulation {background-color: #b39e00}

#logoWrapperPaint {background-color: #0040b3}

#logoWrapperAppliances {background-color: #d8b800}

#logoWrapperAirQuality {background-color: #347900}

#logoWrapperChemicals {background-color: #003e79}


#jour
{
display: block;
height: 30px;
margin: 0 auto;
padding: 15px 0;
opacity: 0.66;
}

.homeImage
{
width: 90%;
margin: 40px 5% 0 5%;
}

#introductionWrapper
{
width: 100%;
background-color: rgba(22,97,29,1);
}

#introduction
{
max-width: 960px;
margin: -60px auto 0 auto;
}

#introTitlesWrapper
{
max-width: 960px;
margin: 0 auto;
}

#introTitles
{
float: left;
max-width: 20%;
margin: 0 0 0 5%;
}

#introImage
{
float: right;
width: 78%;
margin: 20px -40px 0 0;
overflow: hidden;
}

#canvas
{
width: 100%;
}

.materialsWrapper
{
width: 100%;
background-color: rgba(22,97,29,1);
clear: both;
overflow: hidden;
}

.materials
{
max-width: 802px;
margin: 0 auto;
clear: both;
overflow: hidden;
}

iframe, object, embed 
{
max-width: 100%;
}

#test
{
max-width: 100%;
margin-bottom: 60px;
}

p.barTitle
{
font-size: 14px;
text-align: center;
margin-bottom: 40px;
}

#line1
{
margin-top: 40px;
width: 300px;
height: 200px;
}

#line2
{
margin-top: 20px;
width: 300px;
height: 200px;
}

#line3
{
margin-top: 20px;
width: 300px;
height: 200px;
}

#line4
{
margin-top: 40px;
width: 300px;
height: 200px;
}

#navIndex
{
max-width: 100%;
background-color: #3b95da;
margin: 200px auto 50px auto;
}

.navIndex
{
max-width: 95%;
margin: 0 auto;
border-radius: 6px;
border: 1px solid rgba(255,255,255,0.67);
}

.navIndex img
{
max-width: 100%;
}

.navIBoxL, .navIBoxR
{
max-width: 25em;
display: block;
height: auto;
border-radius: 6px;
border: 1px solid rgba(255,255,255,0.67);
margin: 50px auto auto 10px;
position: absolute;
}

.navIBoxR 
{
float: right;
margin: 10px auto auto 900px;
}

.navIndex a
{
font-family: 'Roboto', sans-serif;
width: 130px;
height: 10px !important;
padding: 2px 15px 2px 15px;
border-bottom: 1px solid rgba(255,255,255,0.67);
display: block;
font-size: 16px;
letter-spacing: 1px;
line-height: .05;
color: white;
font-weight: 100;
}

a.navIFirst
{
height: 20px !important;
line-height: 1.5;
text-decoration: none;
}

@media only screen and (max-width: 320px) {
   .navIndex a { font-size: 6px; height: 3px !important; }
}

@media only screen and (max-width: 450px) {
   .navIndex a { font-size: 8px; height:  7px !important; }
}

h1.introduction
{
width: 450px;
font-family: 'Oswald';
font-size: 72px;
color: white;
text-align: left;
font-weight: 400;
text-shadow: 2px 1px 2px #263e8b;
}

h2.introduction
{
font-family: 'Roboto', sans-serif;
font-size: 22px;
color: white;
text-align: center;
padding: 0 5% 160px 5%;
margin: 0;
font-weight: 100;
}

h2.introductionSub
{
width: 280px;
font-family: 'Roboto', sans-serif;
font-size: 28px;
color: white;
text-align: left;
margin: 10px 0 0 0;
font-weight: 100;
}

#infoTextWrapper
{
max-width: 800px;
overflow: hidden;
}

#textContent, #materialsGraph, #conclusion
{
max-width: 350px;
float: left;
margin: 0 25px 20px 25px;
clear: both;
}

#materialsGraph {
	max-width: 670px;
}

#conclusion {
max-width: 670px;
}

#chartsContent
{
max-width: 320px;
float: right;
margin: 0 25px 60px 25px;
}

#textContent1
{
max-width: 600px;
display: block;
margin: 120px auto 60px auto;
clear: both;
padding: 5%;
}

.bold
{
font-family: 'Roboto', sans-serif;
font-size: 26px;
font-weight: 900;
}

p.first {
margin-top: -20px;
}


p
{
font-size: 18px;
line-height: 28px;
color: white;
text-align: left;
padding: 0 0 15px 0;
font-weight: 300;
}

.numberContainer
{
display: block;
max-width: 260px;
border: 1px solid white;
padding: 6px 55px 10px 10px;
margin: 20px auto 0 auto;
border-radius: 12px;
}

#imageBox
{
max-width: 200px;
margin: 10px 0 0 50px;
float: right;
}

#chartsContent1
{
display: block;
max-width: 750px;
margin: 0 auto 120px auto;
}

#container1
{
float: left;
margin-bottom: 20px;
}

#container2
{
float: left;
margin-bottom: 20px;
}

#container3
{
float: left;
margin-bottom: 20px;
}
		  
.map
{
max-width: 100%;
border: 1px solid white;
}

.deforestMap {
max-width: 300px;
height: auto;
float: right;
display: block;
margin: 10px auto 30px auto;
}

p.center, p.centerBlack
{
text-align: center;
font-size: 15px;
line-height: 1.5;
margin-top: 10px;
}

p.centerBlack {color: black}

.photoCredit {
	font-size: 12px;
	text-align: right;
	margin: 0;
}

.cutline {
	font-size: 15px;
	text-align: left;
	margin-top: 3px;
}

#propeller, #propeller2
{
width: 39px;
margin: -20px auto -10px auto;
padding-bottom: 20px;
}

#propeller2 {
margin: 0 auto;
}

#introSecondary
{
max-width: 960px;
margin: 0 auto;
clear: both;
}

h1.introSecondary
{
font-family: 'Oswald';
font-size: 40px;
color: white;
text-align: center;
font-weight: 400;
padding: 30px 5% 15px 5%;
margin: 0;
}

#statsArea
{
display: block;
margin: 50px auto 60px auto;
clear: both;
}

h1.introSecondary1
{
max-width: 300px;
font-family: 'Roboto', sans-serif;
font-size: 60px;
color: white;
text-align: right;
font-weight: 100;
margin: 0 auto;
/*background-color: rgba(255,255,255,0.1)*/
}

h1.introSecondary2
{
font-family: 'Oswald';
font-size: 40px;
color: white;
text-align: center;
font-weight: 400;
margin: 0;
}

p.introSecondary
{
font-family: 'Roboto', sans-serif;
font-size: 18px;
color: white;
text-align: center;
padding: 0 5% 180px 5%;
margin: 0;
font-weight: 100;
}

p.introSecondaryP
{
font-family: 'Roboto', sans-serif;
font-size: 18px;
color: white;
text-align: left;
padding: 0 5% 25px 5%;
margin: 0;
font-weight: 100;
}

p.introSecondaryP1
{
font-family: 'Roboto', sans-serif;
font-size: 16px;
color: white;
text-align: left;
padding: 0 5% 20px 5%;
margin: 0;
font-weight: 100;
}

p.introSecondarySmall
{
font-family: 'Roboto', sans-serif;
font-size: 13px;
color: white;
text-align: center;
padding: 0 5% 40px 5%;
margin: 0;
font-weight: 100;
}

#yearBox
{
max-width: 740px;
margin: 20px 0 30px -20px;
background-color: rgba(255,255,255,0.1);
padding: 20px 0 10px 0;
}

.year
{
font-size: 22px;
font-weight: bold;
padding-right: 5px;
}

.bold1
{
font-weight: 900;
}

.indent
{
padding-left: 30px;
}

#centerWidth
{
max-width: 480px;
margin: 0 auto 20px auto;
}

h1.headline, h1.smallhed
{
font-family: 'Oswald';
font-size: 40px;
color: white;
text-align: center;
font-weight: 400;
padding: 30px 5% 150px 5%;
margin: 0;
}

h1.headline2
{
font-family: 'Oswald';
font-size: 40px;
color: white;
text-align: center;
font-weight: 400;
padding: 30px 5% 60px 5%;
margin: 0;
}

h1.smallhed
{
font-size: 20px;
padding-bottom: 5px;
}

h2.hedLine, h2.item, h2.hedLineBlack, h2.itemBlack
{
font-family: 'Roboto', sans-serif;
font-size: 40px;
color: white;
text-align: center;
font-weight: 100;
padding: 20px 5% 0 5%;
margin: 0;
}

h2.hedLine, h2.hedLineBlack {
	padding-bottom: 2%;
}

h2.hedLineBlack, h2.itemBlack {color:black}


#imgWrapper
{
max-width: 802px;
margin: 0 auto;
}

#infoWrapperWindows
{
max-width: 100%;
background-color: #3b95da;
}

#infoWrapWrap {
	margin: auto 5px auto 5px;
}

.infoWrapper, .infoWrapper2, .infoWrapper3
{
max-width: 960px;
margin: 0 auto;
border-radius: 6px;
background-color: rgba(255,255,255,0.25);
}

.infoWrapper2 {
	margin-bottom: 5px;
}

.infoWrapper3 {
	background-color: transparent;
}

.imageBox {
max-width: 100%;
height: auto;
float: right;
margin: 10px 100px 20px 50px;
}

.left, .right
{
float: left;
width: 32.9%;
padding: 3% 8%;
height: 100%;
margin: 0;
}

.right
{
float: right;
}

.object
{
width: 1px;
height: auto;
display: block;
clear: both;
}

h3.itemName, h3.itemNameL
{
font-family: 'Oswald';
font-size: 24px;
color: white;
font-weight: 100;
padding: 0 0 10px 0;
}

h3.itemNameL {
	padding-top: 20px;
	max-width: 640px;
	margin: 0 auto;
}

p.listItem
{
font-size: 15px;
margin: 0;
color: white;
font-weight: 100;
line-height: 1.4;
}

.vs
{
width: 80px;
position: absolute;
z-index: 1;
left: 50%;
margin-left: -40px;
margin-top: 55px;
}

#learnMore, #learnMoreBlack
{
width: 160px;
padding: 7px 10px;
background-color: rgba(255,255,255,0.33);
border-radius: 6px;
margin: 10px auto 80px auto;
font-family: 'Roboto', sans-serif;
font-size: 15px;
letter-spacing: 1px;
color: white;
text-align: center;
font-weight: 100;
}

#learnMoreBlack {
color: black;
}

#learnMore:hover, #learnMore2:hover
{
background-color: rgba(255,255,255,0.67);
}

#learnMore2
{
width: 160px;
padding: 7px 10px;
background-color: rgba(255,255,255,0.33);
border-radius: 6px;
margin: 0 auto 20px auto;
font-family: 'Roboto', sans-serif;
font-size: 15px;
letter-spacing: 1px;
color: white;
text-align: center;
font-weight: 100;
}

p.itemDescription, p.itemDescriptionBlack, p.itemDescriptionL, p.itemDescriptionL2
{
max-width: 640px;
font-family: 'Roboto', sans-serif;
font-size: 15px;
line-height: 1.6;
color: white;
text-align: center;
font-weight: 100;
margin: 0 auto;
padding-top: 10px;
}

p.itemDescriptionBlack {
	color: black;
}

p.itemDescriptionL, p.itemDescriptionL2 {
	text-align: left;
	padding-left: 5px;
}

p.itemDescriptionL2 {
	padding-top: 0;
}

p.itemDescriptionBig
{
max-width: 740px;
font-family: 'Roboto', sans-serif;
font-size: 24px;
color: white;
text-align: center;
font-weight: 100;
padding: 0 4% 30px 4%;
margin: 0 auto;
}

p.itemDescription a {
	color: rgba(255,231,111,1);
	text-decoration: none;
}

p.itemDescription a:hover {
	color: rgba(0,163,255,1);
	text-decoration: none;
}

.column1
{
float: left;
width: 22.00%;
padding: 3% 5%;
height: 100%;
margin: 0 0 30px 0;
}

.column2
{
float: left;
width: 22.00%;
padding: 3% 5%;
height: 100%;
margin: 0 0 30px 0.3%;
}

.column3
{
float: left;
width: 22.00%;
padding: 3% 5%;
height: 100%;
margin: 0 0 30px 0.3%;
}

.vs1
{
width: 55px;
position: absolute;
z-index: 1;
left: 0;
margin-left: 34.5%;
margin-top: 30px;
}

.vs2
{
width: 55px;
position: absolute;
z-index: 1;
left: 0;
margin-left: 60%;
margin-top: 30px;
}

h4.itemSub
{
font-family: 'Roboto', sans-serif;
font-size: 15px;
margin: 0;
padding: 8px 0 6px 0;
color: white;
font-weight: 100;
letter-spacing: 1px;
}

h1.headlineBlack
{
font-family: 'Oswald';
font-size: 40px;
color: black;
text-align: center;
font-weight: 400;
padding: 30px 5% 150px 5%;
margin: 0;
}

p.savingEnergyParagraph
{
font-size: 15px;
color: black;
line-height: 21px;
font-weight: 100;
}

h2.itemBlack
{
font-size: 40px;
color: black;
text-align: center;
font-weight: 100;
padding: 20px 5%;
margin: 0;
}

h2.itemBlack1
{
font-size: 40px;
color: black;
text-align: center;
font-weight: 100;
padding: 20px 5%;
margin-top: -100px;
}

h3.itemNameBlack
{
font-family: 'Oswald';
font-size: 24px;
color: black;
font-weight: 100;
padding: 0 0 10px 0;
margin: 0;
}

p.listItemBlack
{
font-size: 15px;
margin: 0;
padding: 0 0 6px 0;
color: black;
font-weight: 100;
line-height: 1.2;
}

.leftBlack
{
float: left;
width: 33.999%;
background-color: rgba(0,0,0,0.1);
padding: 3% 8%;
height: 100%;
margin: 0 0 30px 0;
}

.rightBlack
{
float: right;
width: 33.999%;
background-color: rgba(0,0,0,0.1);
padding: 3% 8%;
height: 100%;
margin: 0 0 30px 0;
}

.RTM1
{
font-size: 25px;
margin: 0;
padding: 0;
position: absolute;
}

.RTM2
{
font-size: 18px;
margin-top: -5px;
padding: 0;
position: absolute;
}

#greenLivingWrapper
{
width: 100%;
background: rgba(14,75,124,1);
background: -moz-linear-gradient(top, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(14,75,124,1)), color-stop(100%, rgba(68,126,193,1)));
background: -webkit-linear-gradient(top, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
background: -o-linear-gradient(top, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
background: -ms-linear-gradient(top, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
background: linear-gradient(to bottom, rgba(14,75,124,1) 0%, rgba(68,126,193,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e4b7c', endColorstr='#447ec1', GradientType=0 );
}

#greenLiving
{
max-width: 960px;
margin: 0 auto;
overflow: hidden;
}

h3.greenLiving
{
font-family: 'Oswald';
font-size: 24px;
color: white;
font-weight: 100;
padding: 2% 0 0 4%;
clear: both;
}

h3.greenLivingLast
{
font-family: 'Oswald';
font-size: 24px;
color: white;
font-weight: 100;
margin: 0;
padding: 0 4%;
clear: both;
margin-top: 100px;
}

p.greenLiving, p.greenLivingLastP, p.greenLPage
{
font-family: 'Roboto', sans-serif;
font-size: 15px;
line-height: 22px;
color: white;
font-weight: 100;
padding: 0 4%;
max-width: 750px;
}

p.greenLivingLastP
{
padding-bottom: 4%;
}

p.greenLPage {
	margin-left: 50px;
}

.column4, .column5, .column6
{
float: left;
width: 28.00%;
background-color: rgba(255,255,255,0.0);
height: 100%;
margin: 0 2% 60px 2%;
}

.column4
{
margin-left: 4%;
}

.column5
{
}

.column6
{
}

p.chemicalsParagraph, p.airqParagraph
{
font-size: 15px;
color: #aacdff;
line-height: 21px;
font-weight: 100;
padding-right: 8%;
}

p.airqParagraph {
	color: #e3ff7e;
}

p.iaqParagraph
{
font-size: 15px;
color: #eaaaff;
line-height: 21px;
font-weight: 100;
padding-right: 8%;
}

.standOut
{
color: white;
font-size: 17px;
font-weight: 100;
font-family: 'Oswald', sans-serif;
margin: 0;
padding: 0;
}

h4.itemSub2
{
font-family: 'Oswald', sans-serif;
font-size: 17px;
margin: 0;
padding: 8px 0 6px 0;
color: white;
font-weight: 100;
}

p.listItem2
{
font-size: 15px;
line-height: 22px;
margin: 0;
padding: 0 0 6px 0;
color: #aacdff;
font-weight: 100;
}

a:link {text-decoration: underline; color: white;}
a.noUnderline:link {text-decoration: none; color: white;}
a:hover {text-decoration: none; color: white}
a:visited {text-decoration: none; color: white}
a:active {text-decoration: none; color: white}





.menu 
{
position: fixed;
top: 15px;
right: 15px;
width:80px;
height: 80px;
list-style-type:none;
font-family: 'Roboto', sans-serif;
font-size: 14px;
text-align: center;
margin: 0;
padding:0;
line-height: 26px;
color:#626262;
z-index:1000;
}

.toplevel
{
width:80px;
height: 80px;
display:block;
line-height:80px;
color:#626262;
text-decoration:none;
background-color: white;
padding:0;
margin: 0;
border-radius: 80px;
z-index:1000;
border: 1px solid #cdcdcd;
font-family: 'Roboto', sans-serif;
}

a.toplevel:link {text-decoration:none; color:#626262;}      
a.toplevel:visited {text-decoration:none; color:#626262;}  
a.toplevel:hover {text-decoration:none; color:#626262;}
a.toplevel:active {text-decoration:none; color:#626262;}

/* Dropdowns */
.dropdown 
{
position:relative;
z-index:1000;
font-size: 15px;
line-height: 40px;
border-radius: 6px;
color:#626262;
}

.submenu 
{
position:absolute;
top:0;
left:0;
display:none;
width:200px;
list-style-type:none;
padding-top:12px;
z-index:1000;
line-height: 18px;
text-align: center;
margin-left: -250px;
margin-top: -28px;
color:#626262;
}

.submenu a:hover
{
background-color: #e0eeff;
}

.hover .submenu 
{
display:block;
border-radius: 6px;
color:#626262;
}

.submenu a 
{
display:block;
padding:6px;
color:black;
text-decoration:none;
background:white;
border-top: 1px solid #b7c1ce;
color:#626262;
}

.submenu a.first
{
border-radius: 6px 6px 0px 0px;
border-top: none;
}

.submenu a.last
{
border-radius: 0px 0px 6px 6px;
}

#background
{
width: auto;
background-color: rgb(249,249,249);
}

#sourceBox {
	width: 100%;
	overflow: !important;
}

h3.sourceName
{
font-size: 22px;
color: black;
text-align: center;
padding: 0;
margin: 0;
font-weight: 900;
}

h4.url
{
font-size: 14px;
color: black;
text-align: center;
padding: 0;
margin: 0;
font-weight: 300;
letter-spacing: 1px;
}

h5
{
font-size: 12px;
color: black;
text-align: center;
clear: both;
}

a.learnMoreLink { color: black; }


a.learnMoreLink:link { color:blue;}      
a.learnMoreLink:visited { color:blue;}  
a.learnMoreLink:hover { color:blue;}
a.learnMoreLink:active { color:blue;}

img.pdf
{
display: block;
width: 250px;
margin: 40px auto 5px auto;
box-shadow: 2px 2px 8px #c3c3c3;
}

#landscapingWrapper
{
width: 100%;
background: rgba(55,120,18,1);
background: -moz-linear-gradient(top, rgba(55,120,18,1) 0%, rgba(4,43,4,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(55,120,18,1)), color-stop(100%, rgba(4,43,4,1)));
background: -webkit-linear-gradient(top, rgba(55,120,18,1) 0%, rgba(4,43,4,1) 100%);
background: -o-linear-gradient(top, rgba(55,120,18,1) 0%, rgba(4,43,4,1) 100%);
background: -ms-linear-gradient(top, rgba(55,120,18,1) 0%, rgba(4,43,4,1) 100%);
background: linear-gradient(to bottom, rgba(55,120,18,1) 0%, rgba(4,43,4,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#377812', endColorstr='#042b04', GradientType=0 );
}

#landscaping
{
max-width: 960px;
margin: 0 auto;
overflow: hidden;
}

#iaqWrapper
{
width: 100%;
background: rgba(153,38,191,1);
background: -moz-linear-gradient(top, rgba(153,38,191,1) 0%, rgba(62,0,138,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(153,38,191,1)), color-stop(100%, rgba(62,0,138,1)));
background: -webkit-linear-gradient(top, rgba(153,38,191,1) 0%, rgba(62,0,138,1) 100%);
background: -o-linear-gradient(top, rgba(153,38,191,1) 0%, rgba(62,0,138,1) 100%);
background: -ms-linear-gradient(top, rgba(153,38,191,1) 0%, rgba(62,0,138,1) 100%);
background: linear-gradient(to bottom, rgba(153,38,191,1) 0%, rgba(62,0,138,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9926bf', endColorstr='#3e008a', GradientType=0 );
}

#iaq
{
max-width: 960px;
margin: 0 auto;
overflow: hidden;
}

#endWrapper
{
width: 100%;
background-color: #1f1f1f;
}

#end
{
max-width: 960px;
margin: 0 auto;
}

hr
{
width: 100%;
border: 0;
color: #595959;
background-color: #595959;
height: 1px;
}

.reload
{
width: 750px;
height: 650px;
display: block;
position: absolute;
margin: -650px 0 0 0;
border: 1px solid white;
}



/* Home index */

	#homeIWrapWrap {
		margin: auto 5px auto 5px;
	}

	.homeIndexWrapper {
		background-color: transparent;
	}
	
	.indexP, .indexPBlack {
	font-size: inherit;
	text-align: center;
	margin: 0 auto 0 auto;
	line-height: 1.4;
	}
	
	.indexPBlack {
	color: black;
	}
	
	#homeIWrapper, #homeIWrapperBlack {
		max-width: 500px;
		max-height: auto;
		border: 1px solid #fff;
		border-radius: 6px;
		margin: 0 auto 40px auto;
		padding: 20px;
	}
	
	#homeIWrapperBlack {
		border: 1px solid black;
	}

  	#homeIndexImage {
	  	max-width: 500px;
	  	max-height: auto;
	  	margin: 0 auto;
  	}
  	
  	#homeIndexImage img {
  		max-width: 100%;
  	}
  	  	
  	#homeIndex {
	  	max-width: 500px;
	  	max-height: auto;
	  	margin: -20px auto;
  	}
  	
  	.homeIWrapper {
	  	max-width: 100%;
	  	max-height: 100%;
	  }
	  
	.homeIWrapper a, .homeIWrapperBlack a {
	  	color: #fff;
	  	text-decoration: none;
  		max-width: 100%;
  		max-height: 1.5em;
  		display: block;
  		border: 1px solid #fff;
  		border-top: none;
  		padding: 0.25em;
  	}
  	
  	.homeIWrapperBlack, .homeIWrapperBlack a {
  		color: black;
  		border: 1px solid black;
  		border-top: none;
  		}
  		
  	.homeIWrapperBlack {border: none}
  	
  	a.firstI, a.firstIBlack {
	  	border-top: 1px solid #fff;
  	}
  	
  	 a.firstIBlack {
	  	border-top: 1px solid black;
  	}

  	
  	.homeIWrapper a:hover, .homeIWrapperBlack a:hover {
	  	background-color: rgba(255,255,255,0.33);
  	}
  	
  	#lColumn {
	  	width: 150px;
	  	float: left;
	  	margin: 0 20px 0 20px;
  	}
  	
  	#rColumn {
  		width: 150px;
	  	float: right;
	  	margin: 0 40px 0 0;
  	}
  	
  	.rColumnBottom {
	  	margin-top: 40px;
  	}
  	
.object, .object2
{
width: 1px;
height: auto;
display: block;
margin: 0;
clear: both;
}

.object2 {
	height: 15px;
}


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

	body {
		font-size: 14px;
	}
	
   .navIndex a { 
   		font-size: 14px; 
   		}

  	#lColumn, #rColumn {
	  	width: 120px;
	  	margin: 0 5px 0 5px;
  	}
  
    .rColumnBottom {
	  	margin-top: 32px;
  	}
}

/* end home index */




















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

#jour
{
height: 25px;
}

h1.introduction
{
font-size: 70px;
}

.vs
{
width: 56px;
margin-left: -28px
}

.vs
{
display: none;
}

.vs1
{
display: none;
}

.vs2
{
display: none;
}

h2.introductionSub
{
width: 200px;
font-size: 18px;
}

.column1, .column2, .column3, .column4, .column5, .column6 {
	float: none;
	width: 90%;
	}
	
h3.itemNameL {
	max-width: auto;
	margin-left: 10px;
	margin-right: 10px;
}

p.listItem, p.listItemBlack, p.itemDescription, p.itemDescriptionBlack, p.itemDescriptionL, p.itemDescriptionL2, p.savingEnergyParagraph {
	max-width: auto;
	margin-left: 10px;
	margin-right: 10px;
	}
	
.left, .right {
	float: none;
	width: 95%;
	padding: 2%;
	}
	
.imageBox {
float: none;
max-width: 300px;
margin: 10px auto;
}

}



@media all and (max-width:568px) {

h1.introduction
{
font-size: 60px;
}

.menu 
{
width:60px;
height: 60px;
}

.toplevel
{
width:60px;
height: 60px;
line-height: 60px;
font-size: 13px;
}

.dropdown 
{
font-size: 13px;
line-height: 18 px;
border-radius: 6px;
color:#626262;
}

.submenu 
{
line-height: 18px;
}

.deforestMap {
float: none;
margin-left: 20px;
}

#chartsContent {
float: none;
}

}



@media all and (max-width:480px) {

h1.introduction
{
font-size: 42px;
}

h2.introductionSub
{
width: 150px;
font-size: 16px;
}

#jour
{
height: 20px;
}

#logoWrapper
{
width: 100%;
}

iframe, object, embed 
{
max-width: 100%;
max-height: 37%;
}

.infoWrapper1, .infoWrapper2, .infoWrapper3 {
	max-width: 460px;
}

.vs
{
visibility: hidden}

p.listItem, p.listItemBlack, p.itemDescription, p.itemDescriptionBlack, p.itemDescriptionL, p.itemDescriptionL2, p.savingEnergyParagraph {
	max-width: auto;
	font-size: 14px;
	line-height: 1.6;
	margin-left: 10px;
	margin-right: 10px;
	}
	
.imageBox img {
	width: 300px;
	height: auto;
	float: none;
	margin: 10px auto;
}
}

@media all and (max-width:401px) {

iframe, object, embed 
{
max-width: 90%;
max-height: 5%;
}

}

@media only screen and (max-width: 360px) {
.column1, .column2, .column3, .column4, .column5, column6 {
	padding: 0;
	width: 90%;
}

}

a {text-decoration: none;}