/*----CSS Reset----*/
*{margin:0;padding:0}iframe,a img,fieldset,form,table{border:0}h6,h5,h4,h3,h2,h1,caption,th,td{font-size:100%;font-weight:normal}dd,dt,dl,ol,ul{list-style:none}legend{color:#000}button,select,textarea,input{font-size:100%}table{border-collapse:collapse}caption,th,td{text-align:left}
/*----End CSS Reset----*/
/*---------------------------------------------------------------------*/
/*----Elements----*/

body {
  background: #2dc5f6 url(http://www.coloradocarbonfund.org/images/framework/background-clouds.jpg) center top repeat-x ;
  font: normal 62.5% freesans, helvetica, arial, san-serif;
  color: #000;
  text-align: center;
}

a {
  text-decoration: none;
  outline: none;
 color: #0a3c84;
}

a:hover {
  text-decoration: underline;
}
/*----End Elements----*/
/*---------------------------------------------------------------------*/
/*----framework----*/
.clear {
  clear: both;
  height: 1px;
  line-height: 1px;
  font-size: 1px;
}


#container {
  width: 900px;
  margin: 0 auto;
  text-align: left;
position: relative;
}

/*----End framework----*/
/*---------------------------------------------------------------------*/
/*----left-home----*/
#left-home {
  margin-top: 70px;
  width: 170px;
  text-align: center;
  float: left;
  margin-left: 20px;
}

#left-home a {
  color: #ffffff;
  text-align: left;
}


#left-home p {
  color: #ffffff;
  font-size: 1.1em;
}

#left-home h3 {
  color: #f79434;
  font-size: 1.7em;
  font-weight: bold;
  margin-top: 10px;
  text-align: center;
}

#left-home  h4 {
  color: #ffe07d;
  font-size: 1.2em;
  font-weight: bold;
  border-bottom: 1px solid #fff;
}

#left-home img {
  margin-bottom: 10px;
}
#left-arrow {
   top: 100px;
  width: 170px;
  text-align: center;
  left: 0px; 
position: absolute;

}
#left-arrow a {
  color: #ffffff;
  text-align: left;
}


#left-arrow p {
  color: #ffffff;
  font-size: 1.1em;
}

#left-arrow h3 {
  color: #f79434;
  font-size: 1.7em;
  font-weight: bold;
  margin-top: 30px;
  text-align: center;
}

#left-arrow h4 {
  color: #ffe07d;
  font-size: 1.6em;
  font-weight: bold;

}





#left {
  margin-top: 100px;
  width: 170px;
  text-align: center;
float: left;
}

#left a {
  color: #ffffff;
  text-align: left;
}


#left p {
  color: #ffffff;
  font-size: 1.1em;
}

#left h3 {
  color: #f79434;
  font-size: 1.7em;
  font-weight: bold;
  margin-top: 30px;
  text-align: center;
}

#left h4 {
  color: #ffe07d;
  font-size: 1.6em;
  font-weight: bold;

}

#left img {
  margin-bottom: 10px;
}
#left ul {
  margin-top: 50px;
}
#left li {
  margin: 0 px 10px;
  padding: 3px 0;
}


#left ul li  a {
  display: inline;
  background: #1354a3;
}


#left ul li a h4 {
  text-align: center;
}
#left ul li a p {
  float: left;
  color: #8895c8;
  font-size: 1.7em;
  font-weight: bold;
  margin-left: 5px;
}
#left .one {
   background: #1354a3;
    border: 1px solid #ffffff;
   border-top: 10px solid #ef4137;
   margin: 10px 0px;

}
#left .one a:hover p, #left .one a:hover h4 {
  color: #fff;

}


#left .two {
  background: #1354a3;
   border: 1px solid #ffffff;
   border-top: 10px solid #8cc63f;
   margin: 10px 0px;
}
#left .two a:hover p, #left .two a:hover h4 {
  color: #fff;

}
#left .three {
  background: #1354a3;
  border: 1px solid #ffffff;
   border-top: 10px solid #f7931e;
   margin: 10px 0px;
}
#left .three a:hover p, #left .three a:hover h4 {
  color: #fff;

}



.news {
   margin-top: 30px;
   padding-bottom: 10px;
   border-bottom: 1px solid #fff;
}

.news p {
  text-align: left;
  margin-top: 10px;
  width: 150px;
  font-size: 1.3em;
  line-height: 1.3em;
  margin-left: 10px;
}
.news a:hover {
 text-decoration: underline;
}
#twitter {
  float: left;
  margin-top: 20px;
}
#facebook {
  float: right;
   margin-top: 20px;
}
/*----pic----*/
.pic {
  float: left;
  width: 300px;

  text-align: center;
}
#right .pic img {
  float: none;
  text-align: center;

}



/*----right----*/
#right-home {
  float: right;

  margin-top: 120px;
  width: 685px;

}
#right-home {
  font-size: 1.2em;
}


#right-home ul {
  float: right;
}
#right {
  float: right;
  margin-top: 100px;
  width: 700px;
font-size: 1.2em;
}

#right ul#nav {
  float: right;
}
#right img { float: right; margin: 0 0 10px 10px;}
#right .event {
float: left;
width: 425px;
}
#right .event .date {width: 100px;}





#nav {
  height: 30px;
  font-weight: bold;
  font-family: freesans, helvetica, arial, san-serif;
padding-top: 10px;
 
}

#nav a:hover {
  color: #04a9e6;
}

  #nav li {
    height: 30px;
    float: left;
    position: relative;
    display: block;
    border-left: 1px solid #fff;
     padding-left: 5px;
    }

  #nav li a {
    
    color: #fff;
    padding: 0px 10px 0px 10px;
    text-decoration: none;
    display: block;
    border: none;
  }

 #nav ul {
   display: none;
    }

 #nav li:hover ul, #nav li.iehover ul {
   display: block;
   position: absolute;
   left: 0px;
   top: 30px;
   width: 150px;
    border: none;
    color: #ffffff;
background: #0682c5;
 }

 #nav ul li {
   float: none;
    border: none;
   height: auto;
   padding: 0;
 }

 #nav ul li a {
   text-align: left;

   padding: 10px 10px;
   display: block;
   background: #04a9e6;
   line-height: 1.2em;

 }
 #nav .noborder {
   border: none;
 }
 #nav ul li a:hover {
   color: #ffffff;
   background: #0682c5;
 }
 #scene p {
   width: 450px;
   margin-top: -190px;
   margin-left: 50px;
   font-size: 1.2em;
  line-height: 1.3em;
  color: #ffffff;
 }
 #scene h4 {
   color: #ffffff;
   text-transform: uppercase;
   font-size: 1.5em;
   font-weight: bold;
   margin-left: 50px;
   margin-top: 10px;
 }


.email {
  text-align: center;
}


#email {

  background: transparent;
  border: 1px solid #ffffff;
  text-align: center;
  color: #ffffff;
  font-size: 1.3em;
  width: 160px;
  margin-top: 10px;
padding: 2px 0;
}

#newsletter {
  text-align: center;
  margin-top: 170px;
  font-size: 1.3em;
  color: #fff;
float: left;

}
#left #newsletter {
  margin-top: 30px;
}
#left-arrow  #newsletter {
  margin-top: 30px;
}


 #boxes {
  position: absolute;
  right: 10px;
  top: 488px;
 }



 #boxes h5 {
   color: #ffe07d;
   font-size: 2.7em;
   font-weight: bold;
   text-align: right;
 }

 #boxes a {
   text-align: right;
   color: #ffffff;
   text-decoration: none;
 }
 #boxes a:hover {
   color: #ffe07d;
 }
 #boxes a:hover h5 {
   color: #fff;
 }


 #fund {
   border: 1px solid #ffffff;
   border-top: 15px solid #f79320;
   width: 135px;
   float: right;
   background: #005da6 url(http://www.coloradocarbonfund.org/images/framework/bg-3.gif) left bottom no-repeat;
   padding: 5px;
   margin-left: 5px;
height: 159px;
 }
 #act {
   border: 1px solid #ffffff;
   border-top: 15px solid #8cc640;
   width: 135px;
   float: right;
   background: #005da6 url(http://www.coloradocarbonfund.org/images/framework/bg-2.gif) left bottom no-repeat;
   padding: 5px;
   height: 159px;
   margin: 0px 5px;
 }
 #think {
    border: 1px solid #ffffff;
   border-top: 15px solid #ef4137;
   width: 135px;
   float: right;
   background: #005da6 url(http://www.coloradocarbonfund.org/images/framework/bg-1.gif) left bottom no-repeat;
   padding: 5px;
   height: 159px;
   margin-right: 5px;
 }

 #content {
   background: #fff;
   padding: 20px;
 }
 #content h1 {
   font-size: 2em;
   color: #00aef4;
   margin-bottom: 10px;
 }
 #content h2 {
   font-size: 1.5em;
    color: #00aef4;
    margin: 10px 0px;
 }
 #content p {
   line-height: 1.5em;
   margin: 10px 0px;
 }
 #content ul li {
   list-style-type: disc;

   margin: 5px 0px 5px 20px;
 }
 #content ol li {
   list-style-type: decimal;
   margin: 5px 0px 5px 25px;
 }
#content ul ul  {
margin-left: 20px; }


 #geo {
   float: right;
   margin-right: 30px;
 }

#business {
   padding: 5px;
   background: #fff;

 }


  #busniness .fund {
   width: 120px;
   background: #0079bf;
   float: right;
   border-top: 10px solid #ef4036;
   padding-bottom: 15px;
 }

 #business a:hover h2 {
   color: #fff;
 }

.business {
   background: #ef3c39;
   height: 35px;
padding-bottom: 19px;
 }
#green {
   background: #8cc63f;
   height: 35px;
padding-bottom: 19px;
 }

.business h1 {
   font-size: 2em;
   color: #fff;
   float: left;
   font-weight: bold;
   margin-left: 20px;
padding-top: 10px;
 }

 .business h2 {
   font-size: 2em;
    color: #ffdb64;
    font-weight: bold;
    float: left;
    margin-left: 10px;
padding-top: 10px;
 }



 #business .act {
   border: 3px solid #fff;
 }
  #business .fund {
   border: 3px solid #fff;
 }


  #business .act {
   width: 120px;
   background: #0079bf;
   float: right;
   border-top: 10px solid #8cc63f;
   padding-bottom: 15px;
 }
 #business .fund {
    width: 120px;
   background: #0079bf;
   float: right;
   border-top: 10px solid #f7931e;
   padding-bottom: 15px;

 }
#business .think{
border: 3px solid #fff;
}
#business .think {
background: #0079BF;
border-top:10px solid #ef4036;
float:right;
padding-bottom: 15px;
width:120px;
}

  #page {
  padding: 10px 20px 10px 30px;
}
#page p {
  line-height: 1.5em;
   margin: 10px 0px;
}
#page .take {
float: left;
width: 400px;
}


#page h1 {
  font-size: 2em;
   color: #00aef4;
   margin-bottom: 10px;
}
#page h2 {
font-size: 1.5em;
    color: #00aef4;
    margin: 10px 0px;
}
 #pages {
  padding: 15px 5px 5px 5px ;
}
#pages p {
  line-height: 1.5em;
   margin: 10px 20px;
}


#pages h1 {
  font-size: 2em;
   color: #00aef4;
   margin-bottom: 10px;
}
#pages h2 {
font-size: 1.5em;
    color: #00aef4;
    margin: 10px 0px;
}





#arrow {


  width: 170px;
   position: absolute;
  top: 235px;
  left: 0px;
  z-index: 100;

 }


 #arrow a {
   color: #ffe07e;
border: none;
 }
  .indiviuals a:hover {
   background: #44ace2;
 }
 #arrow p {
   margin-top: 20px;

 }


 .individuals   {
   background: #253c91;
   border: 1px solid #748cc4;
   width: 170px;
   height: 59px;
 }
 .individuals:hover   {
   background: #44ace2;
 }
 # arrow .noborder  {
border: 0 auto;
}

 .businesses {
    background: #253c91;
     border: 1px solid #748cc4;
      width: 170px;
      height: 59px;
 }
#arrow .noborder {
border: 0 auto;
}




 .businesses:hover   {
   background: #44ace2;

 }
 .events {
    background: #253c91;
     border: 1px solid #748cc4;
      width: 170px;
      height: 59px;
 }
 .events:hover   {
   background: #44ace2;

 }
#next {

   width: 120px;
   height: 20px;
   border: 1px solid #000;
   background: #8cc640;
   text-align: center;
   margin-left: 250px;

 }
 #next a {
   display: block;
   color: #fff;
   margin: 2px;
 }
 #next a:hover {
   color: #8cc640;
 }


 #next:hover {
   color: #8cc640;
   background: #fff;
 }


#next.orange a:hover {
color: #f7931e
}
#next:hover {
   color: #8cc640;
   background: #fff;
 }
#next.orange {
background: #f7931e;
}
#calculate {
  border: 1px solid #000;
  background: #ef4137;
  
  color: #fff;
  text-align: center;
  margin-bottom: 5px;
}
#calculate_b {
  border: 1px solid #000;
  background: #0085C7;
  width: 120px;
  color: #fff;
  text-align: center;
  margin: 5px auto;
  padding: 5px 0;
}

 #calculate a {
   display: block;
   color: #fff;
   margin: 3px;
  padding: 5px 0;
 }
 #calculate a:hover {
   color: #ef4137;
 }
#calculate:hover {
background: #fff;
}

 #continue {
    width: 120px;
   height: 20px;
   border: 1px solid #000;
   background: #f7931e;
   text-align: center;
   margin: 5px auto;
 }
 #continue:hover {
   background: #fff;
 }
 #continue a:hover {
   color: #f7931e;
 }
 #choice {
   float: right;
   border: 1px solid #000;
   padding: 10px 10px;
   
   width: 200px;
   text-align: center;
 }
 #act-left {
  width: 200px;
   padding: 5px;
   margin-top: 20px;
   float: left;
 }
#act-middle{
  width: 200px;
   padding: 5px;
   margin-top: 20px;
   float: left;
 }
#act-right {
  width: 200px;
   padding: 5px;
   margin-top: 20px;
   float: right;
 }
 
#sidenav {
   font-weight: bold;
   line-height: 45px;
margin-top: 70px;
 }
#sidenav li {background: #243f93;}

 #left #sidenav a {
   display:block;
 }


 #sidenav a {
   background: ##283A8F;
   border: 1px solid #8190C6;
   color: #8CC640;
   display: block;
   height: 45px;
   text-align: center;
   text-decoration: none;
   width: 170px;
 }


 #sidenav li.current {
color: #FFE07E;
height: 59px;
line-height: 59px;
padding-right: 5px;
text-align: center;

background: none;

 }


 #sidenav a:hover {
background-color:#44ACE2;
border: 1px solid #FFFFFF;
color:#FFE07E;
 }
table { float: right; margin: 0 0 20px 20px;}
table a {color: #f7931e;}
th { background: #00aef4; border: 1px solid  #00aef4; font-weight: bold; padding: 5px;}
td { border: 1px solid  #00aef4; font-weight: bold; padding: 5px; text-align: center;}

 
   #results {     
     text-align: center;
     font-size: 1.2em;
position: absolute;
top: 720px;
right: 55px;
   }
   #results .center {
     text-align: center;
   }
   #results p span {
     background: #0085c7;
     padding: 5px 20px;
     color: #fff;
     font-weight: bold;
   }
   #results #continue {
     background: #8cc640;
     color: #fff;
     margin-left: 20px;
   }
   #results #continue a {
     color: #fff;
   }


   #results #continue:hover {
     background: #fff;
     color: #8cc640;
   }
   #results #continue a:hover {
     color: #8cc640;
   }

   iframe {
    
     clear: both;
margin-top: 40px;
overflow-x: false;
    
     
   }
   

   .textbox {
     width: 75px;
     margin: 5px 0px;
   }
   .submit {
     margin-top: 10px;
     background: #ef4137;
     color: #fff;
     margin-left: 10px;
     font-size: 1.3em;
   }
   .submit:hover {
     background: #fff;
     color: #ef4137;
   }
/* tooltip styling. uses a background image (a black box with an arrow) */ 
div.tooltip { 
    background:transparent url(http://www.coloradocarbonfund.org/images/framework/black_arrow.gif) no-repeat scroll 0 0; 
    font-size:12px; 
    height:67px; 
    padding:35px 20px 20px 20px; 
    width:169px; 
   
    display:none; 
    color:#fff; 
} 
 
/* tooltip title element (h3) */ 
div.tooltip h3 { 
    margin:0; 
    font-size:18px; 
    color:#fff; 
}
div.tooltip p {
font-weight: normal;
}















