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


html,body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{

    border: 0 none;
    margin: 0;
	padding:0;
	outline: 0;
 

 
	}


body{
	background-color:#95c004;
	
	  
  }
  
 
  
  
  .banner { position: relative; overflow: auto; }
    .banner li { list-style: none;
	 }
        .banner ul li { float: left; }
  
 
 
 
 
 
 
 body, html {
				padding:0px;
				margin: 0px;
			}
			.banner { 
				position: relative; 
				width: 100% !important; 
				overflow: auto; 
				padding: 0px;
				margin:0 auto;
			}
			.banner ul {
				padding: 0px;
				margin: 0px;
			}
			.banner li { 
				list-style: none; 
				padding: 0px;
				margin: 0px;
			}
			.banner ul li { 
				float:left;
			    padding: 0px;
				margin: 0px;
			    min-height:160px;
				-webkit-background-size: 100% auto;
				-moz-background-size: 100% auto;
				-o-background-size: 100% auto;
				-ms-background-size: 100% auto;
				background-size: 100% auto;
				background-position-y: -15px;
		
				
			}
			
			
			
			.bluetx{ 
			width:400px;
			height:40px;
			position:absolute;
			background-color:#91c040;
			top:10px;
		
	
			
	}
		.bluetx:hover{ 
			width:450px;
			height:45px;
			position:absolute;
			background-color:#09C;
			 -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	
			
	}
		
		
			
		
		

	#container{background-color:#FFF;
	width:100%;
	
	
	}
	
	
h1, h2, h3, h4, h5, h6 {
   
   font-weight: normal;
	
}

a{text-decoration:none;
color:#FFF;
-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	padding:4px;}

a:hover{text-decoration:none;
color:#0CC;
-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;}

h1{
	font-size:3em;
font-family: 'Damion', cursive;
line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;



display:block;
color:#FC0;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;}
	
	h1:hover{
	


color:#06F;
	}
	
	
	
	h2{
	font-size:1em;
font-family: 'Damion', cursive;
line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
display:block;
color:#069;
	}
	
	
	
	
	
	
	
h5{
	font-size:0px;
	
	}
	
	


img {max-width:100%}



	

#logo{
	/* for jquery box */
	
	
	}






#searchbar{
	left:35%;
	position:relative;
	
}



nav{

max-width:100%;	
	




}



nav li {
	/* distance */margin: 0 3px;
	/* distance down */padding: 0 0 8px;
	float: left;
	position: relative;
	list-style: none;
}


/* main level link */
nav a {
	
	/* main text color*/color:#333;
	text-decoration: none;
	
/*resizes box*/	padding: ;
	margin: 0;
   
	
	font-family: 'Muli', sans-serif;

	 -webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
		 -o-transition: all .3s ease;
			transition: all .3s ease;
			cursor: pointer; cursor: hand;
	
	
}




	
	
	


		h27{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#09C;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	}

h27:hover{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#0C0;

	}
	
	
	
		h28{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#09C;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	}

h28:hover{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#0C0;

	}
	
	
		h29{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#09C;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	}

h29:hover{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#0C0;

	}
	
	
	
	
	
	h30{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#09C;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	}

h30:hover{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#0C0;

	}



	
	h31{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#09C;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	}

h31:hover{

font-size:70px;

line-height: 0.9;
margin-bottom: 1px;
padding-bottom: 0.04px;
font-weight:100;
width:100px;
display:block;
color:#0C0;

	}

#x{
	position:absolute;
	left:40px;
	
	top:20px;
	
	}
	



#flip18{

    
	background-repeat:no-repeat;
	
}



#flip18:hover{

	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	
	
	}


#panel18
{
display:none;
background-color:#FFF;
border:solid 10px #09C;
max-width:800px;
margin:0 auto;


position:relative;


}


.text_panel18{
	left: 35%;
	font-family: 'Muli', sans-serif;
	color: #8b744b;
margin:100px 0px 0px 40px;
	width:89%;
	font-size:1.13em;
	line-height:180%;
	height:50%;
}




#flip19{

    
	background-repeat:no-repeat;
	
}



#flip19:hover{

	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	
	
	}


#panel19
{
display:none;
background-color:#FFF;
border:solid 10px #09C;
max-width:850px;
margin:0 auto;


position:relative;


}


.text_panel19{
	left: 35%;
	font-family: 'Muli', sans-serif;
	color: #8b744b;
margin:100px 0px 0px 40px;
	width:89%;
	font-size:1.13em;
	line-height:180%;
	height:50%;
}





#flip20{

    
	background-repeat:no-repeat;
	
}



#flip20:hover{

	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	
	
	}


#panel20
{
display:none;
background-color:#FFF;
border:solid 10px #09C;
max-width:850px;
margin:0 auto;


position:relative;


}


.text_panel20{
	left: 35%;
	font-family: 'Muli', sans-serif;
	color: #8b744b;
margin:100px 0px 0px 40px;
	width:89%;
	font-size:1.13em;
	line-height:180%;
	height:50%;
}








#flip21{

    
	background-repeat:no-repeat;
	
}



#flip21:hover{

	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	
	
	}


#panel21
{
display:none;
background-color:#FFF;
border:solid 10px #09C;
max-width:800px;
margin:0 auto;


position:relative;


}


.text_panel21{
	left: 35%;
	font-family: 'Muli', sans-serif;
	color: #8b744b;
margin:100px 0px 0px 40px;
	width:89%;
	font-size:1.13em;
	line-height:180%;
	height:50%;
}








#flip22{

    
	background-repeat:no-repeat;
	
}



#flip22:hover{

	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
	
	
	}


#panel22
{
display:none;
background-color:#FFF;
border:solid 10px #09C;
max-width:800px;
margin:0 auto;


position:relative;


}


.text_panel22{
	left: 35%;
	font-family: 'Muli', sans-serif;
	color: #8b744b;
margin:100px 0px 0px 40px;
	width:89%;
	font-size:1.13em;
	line-height:180%;
	height:50%;
}




/* sub levels link hover */

	
/* main level link hover the color boxes inside */
nav li a:hover {
	background:#;
	-moz-border-radius:10px;
	-khtml-border-radius: 10px;
	-webkit-border-radius:10px;
	border-radius: 15px;
	color:#ffcb11;
	
	}
	
	

/* dropdown */
nav li:hover > ul {
	display: block;
}


nav ul li {
	float: none;
	margin: 0;
	padding: 0;
}


/*nav*/


#greenbar {
	background-color:#;
	font-size:8px;
	
	
 }
	

#blue_mission {
	
background: #24a2ff;

	
 }
 
 #redbar {
	
background: #e41b23;

	
 }
 
  #orangebar {
	
background: #dd330c;

	
 }
 
 #aboutimg {
	 background-image:url(../img/about.jpg);
min-width: 320px;
min-height: 180px;

margin:0 auto;
width: 100%;
background-repeat: no-repeat;
background-size: 100%;
	
 }
 
 
  #volimg {
	 background-image:url(../img/volunteer_big.jpg);
min-width: 320px;
min-height: 180px;

margin:0 auto;
width: 100%;
background-repeat: no-repeat;
background-size: 100%;
	
 }



 #progimg {
	 background-image:url(../img/signup.jpg);
min-width: 320px;
min-height: 180px;

margin:0 auto;
width: 100%;
background-repeat: no-repeat;
background-size: 100%;
	
 }
 
  #donateimg {
	 background-image: url(../img/programs_main1.jpg);
min-width: 320px;
min-height: 180px;

margin:0 auto;
width: 100%;
background-repeat: no-repeat;
background-size: 100%;
	
 }
 
 
  #moleimg {
	 background-image: url(../img/mole_main.png);
min-width: 320px;
min-height: 130px;

margin:0 auto;
width: 100%;

background-size: 100%;
background-color:#e69220;
	
 }
 
 


	


	
	
	
	
	
#t1 {
	
	font-family: 'Alegreya Sans SC', sans-serif;
color:#FFF; 
		font-size:3em;
 }
 
 
#t7 {
	
	font-family: 'Muli', sans-serif;
color:#FFF; 
		font-size:0.8em;
		left:4%;
	
		position:relative;
 }
 
 
 #t4 {
	 font-weight:bold;
	 font-family:Arial, Helvetica, sans-serif;
color:#2b95d3; 
		font-size:1.4em;
		left:40px;
		position:relative;
		
		
 }
 
 
 
 
 #t5 {
	 font-weight:bold;
	 font-family:Arial, Helvetica, sans-serif;
color:#2b95d3; 
		font-size:1.6em;
		left:8%;
		position:relative;
		
		
 }
 
#t2 {
	font-family:Arial, Helvetica, sans-serif;
color:#FFF; 
		font-size:1.6em;
 }
 
 
 
#t3 {
	font-family: 'Muli', sans-serif;
color:#FFF; 
font-size:1.4em;
left:10px;
top:10px;
position:absolute;

 }
 
	
		
 p{
	 
color:#666; 
		font-size:1.4em;
		padding-left:40px;}
		
 
  .contact{
	font-family: Arial, Helvetica, sans-serif;
color:#46c9f3; 
		font-size:2em;
		padding-left:40px;
		padding-top:40px;}
 
 
 
 
 
/*main nav wrap */
.mainNav { 
background-image: url(../img/white_wall_hash_@2X.png);
	
	
	 }

/*menu toggle */
.menuToggle { color:#24a2ff; font-size:27px;  position:relative; display: block; margin:0px 50px; width: 435px; height: 50px;  
	font-family: 'Alegreya Sans SC', sans-serif; font-weight:bold;}

.menuToggle span { display: block; text-indent: -999em; }


/* nav list */
.navList { display:none; width: 100%; margin: 0; padding:-20px;
 list-style: none; font-family: 'Muli', sans-serif;}
.no-js .navList { display: block;}
.navList li { display: block; }
.navList a { display: block; 
    text-align: center; 
    padding: 10px;
  
    text-decoration: none; 
    font-size: 1.4em; 
   
color:#90bf3f;
    }
    .navList a:hover, .navList a:focus {  background:#;
	color:#24a2ff; }
	
	
	
	
	
	.navList2 { display:none; width: 100%; margin: 0; padding:-20px;
 list-style: none; font-family: 'Muli', sans-serif;}
.no-js .navList2 { display: block;}
.navList2 li { display: block; }
.navList2 a { display: block; 
    text-align: center; 
    padding: 10px;
  
    text-decoration: none; 
    font-size: 1.2em; 
   
color:#09C;
    }
    .navList2 a:hover, .navList a:focus {  background:#;
	color:#90bf3f; }
	
	
	

    @media (min-width: 767px) {
        .menuToggle { display: none;}
        .navList { display: table !important; width: 100%;  background-color:#;}
        .navList li { display: table-cell; } 
     .navList2 { display: table !important; width: 100%;  background-color:#;}
        .navList2 li { display: table-cell; } 
    
	 #t1 {
	
	font-family: 'Alegreya Sans SC', sans-serif;
color:#FFF;

	font-size:5em;
	
 }
 


.contact{
	font-family: Arial, Helvetica, sans-serif;
color:#46c9f3; 
		font-size:2em;
		padding-left:40px;
		padding-top:40px;}
 
 
 
 
 
#searchbar{
	left:20%;
	position:relative;
	
}



.banner { 
				position: relative; 
				width: 100% !important; 
				overflow: auto; 
				padding: 0px;
				margin: 10px;
			}
			.banner ul {
				padding: 0px;
				margin: 0px;
			}
			.banner li { 
				list-style: none; 
				padding: 0px;
				margin: 0px;
			}
			.banner ul li { 
				float:left;
			    padding: 0px;
				margin: 0px;
			    min-height:300px;
				-webkit-background-size: 100% auto;
				-moz-background-size: 100% auto;
				-o-background-size: 100% auto;
				-ms-background-size: 100% auto;
				background-size: 100% auto;
				background-position-y: -15px;
				
			}
			


	 #moleimg {
	 background-image: url(../img/mole_main.png);
min-width: 320px;
min-height:480px;


margin:0 auto;
width: 100%;

background-size: 100%;
	
	
 }
 
 
 .moleras {
	
	position:absolute;
	top:180px;
	left: 20%;
	
	}

 
 #t7 {
	
	font-family: 'Muli', sans-serif;
color:#FFF; 
		font-size:1.7em;
		left:4%;
	   padding-top:36px;
		position:relative;
		
 }
 

	
    }
	
	
	
	
	

/* ---Main Banner ---*/

	 

 @media (min-width: 1024px) {
	  
	  #t1 {
	
	font-family: 'Alegreya Sans SC', sans-serif;
color:#FFF;

	font-size:5.80em;
 }
 
 
 #t5 {
	 font-weight:bold;
	 font-family:Arial, Helvetica, sans-serif;
color:#2b95d3; 
		font-size:1.6em;
		left:20%;
		position:relative;
		
		
 }
 
 .banner ul li { 
				float:left;
			    padding: 0px;
				margin: 0px;
			    min-height:450px;
				-webkit-background-size: 100% auto;
				-moz-background-size: 100% auto;
				-o-background-size: 100% auto;
				-ms-background-size: 100% auto;
				background-size: 100% auto;
				background-position-y: -15px;
				
			}
			



 #aboutimg {
	 background-image:url(../img/about.jpg);
min-width: 320px;
min-height: 480px;

margin:0 auto;
width: 1000px;
background-repeat: no-repeat;
background-size: 100%;
	
 }
 
 #volimg {
	 background-image:url(../img/volunteer_big.jpg);
min-width: 320px;
min-height: 400px;

margin:0 auto;
width: 1000px;
background-repeat: no-repeat;

	
 }
 
 
 #progimg {
	 background-image: url(../img/signup.jpg);
min-width: 320px;
min-height: 480px;

margin:0 auto;
width: 1000px;
background-repeat: no-repeat;
background-size: 100%;
	
 }



  #donateimg {
	 background-image: url(../img/programs_main1.jpg);
min-width: 320px;
min-height: 480px;

margin:0 auto;
width: 1000px;
background-repeat: no-repeat;
background-size: 100%;
	
 }
 
   #moleimg {
	 background-image: url(../img/mole_main.png);
min-width: 320px;
min-height: 480px;

margin:0 auto;
width: 1000px;

background-size: 100%;
background-color:#F90;

	
 }
 
#greenbar {
	background-color:#;
	font-size:10px;
	
	
 }
 
 
.moleras {
	
	top: 178px;
	left: 30%;
	}
	
	 
#t7 {
	
	font-family: 'Muli', sans-serif;
color:#FFF; 
		font-size:1.8em;
	
		padding-top:35px;
			left:-9%;
		position:relative;
		font-weight:bold;
 }
 
	
	 
 
 }
 


@media (min-width: 1100px) {	 
#t7 {
	
	font-family: 'Muli', sans-serif;
color:#FFF; 
		font-size:2em;
	
		padding-top:35px;
			left:-9%;
		position:relative;
		font-weight:bold;
 }
 
	}
 
 @media (min-width: 1900px) {
	 
	 
.moleras {
	
	top: 178px;
	left: 38%;
	}}