html, body {
	margin:0; 
	padding:0px;
	text-align:center;

color : #000;
font : 100% arial;
}
#wrapper
{
	width:900px;
	margin:0px auto;
	text-align:left;

}
.hide {
font-size: 1%;
}


a {
color : #fff;
font-size: 100%;
text-decoration: underline;
margin: 0;
}
a:hover, a:focus, a:active {
color: #51a646;
}

a:focus, a:active {
color : #fff;
}

p {
color: #FFF;
font : 80% arial;
}
h2 {
font-size: 110%;
font-style:italic;
font-weight: normal;
color: #fff;
}
.testimonial {
padding: 0 10px 0 7px;
font-size: 75%;
text-align:left;
font-style:italic;
}
.testimonialName {
padding: 0 8px 0 5px;
font-size: 75%;
font-weight: normal;
text-align: left;
}



#header {
height : 78px;
width : 524px;
text-indent : -999em;
margin: 10px 0 10px 0;
background : url(images/logo.jpg) no-repeat;

margin-left : auto;
margin-right : auto;
}





#navigation {
width: 900px;	
height: 40px;

display: block;
}
.menu{
margin: 0;
padding: 0;
float: left;
font: bold 108% Arial;
width: 900px;
overflow: hidden;
border-width: 1px 0;
background: url(images/butback.jpg) center center repeat-x;
}

.menu li{
display: inline;
}

.menu li a{
float: left;
color: #565756;
padding-top: 9px;
padding-bottom: 10px;
padding-left: 30px;
padding-right: 34px;
text-decoration: none;
font-size: 75%;
}


.menu li a:hover, .menu li .current{
color: white;

}


img {border: none; margin:0;}
a {color: #fff;}

.main_image {
margin: 0 0 6px 0;
width: 900px;
height: 365px;
		float: left;
	position: relative;
	overflow: hidden;
	color: #fff;
}
.main_image h2 {
	font-size: 1.2em;
	font-weight: normal;
	margin: 0 0 5px;	
	padding: 5px 10px 5px 10px;
	font-style: normal;
}
.main_image p {
	font-size: 0.8em;
	padding: 10px;	margin: 0;
	line-height: 1.6em;
}
.block small { 
	padding: 0 0 0 20px; 
	background: url(images/icon_calendar.gif) no-repeat 0 center; 
	font-size: 0.7em; 
	
}
.main_image .block small {margin-left: 10px;}
.main_image .desc{
	position: absolute;
	bottom: 0;	left: 0;
	width: 100%;
	display: none;
}
.main_image .block{
	width: 100%;
	background: #111;
	border-top: 1px solid #000;
}
.main_image a.collapse {
	background: url(images/btn_collapse2.gif) no-repeat left top;
	height: 27px; width: 93px;
	text-indent: -99999px;
	position: absolute; 
	top: -27px; right: 20px; 
}
.main_image a.show {background-position: left bottom;} 





#mainpenguins {
margin-bottom: 6px;
width: 900px;
height: 367px;
background: url(images/penguins.jpg) center center;
}

#mainhill {
margin-bottom: 6px;
width: 900px;
height: 367px;
background: url(images/mainhill.jpg) center center;
}
#greenupper {
margin-bottom: 6px;
width: 900px;
height: 365px;
background: url(images/greenupper.jpg) center center;
}
#sharkupper{
margin-bottom: 6px;
width: 900px;
height: 365px;
background: url(images/sharkupper.jpg) center center;
position: relative;
overflow: hidden;
}
#elepupper{
margin-bottom: 6px;
width: 900px;
height: 365px;
background: url(images/elepupper.jpg) center center;	
}



#strapline {
color: #FFF;
padding: 10px 0 0 10px;
font-weight: bold;
letter-spacing: 2px;
}
#straplineb{
color: #000;
padding: 10px 0 0 10px;
font-weight: bold;
letter-spacing: 2px;
}

#container {
width : 100%;
height: 342px;
clear: both;
}
#container #penreflect{
width : 100%;
height: 100%;
background: #000 url(images/penguinereflection.jpg) top no-repeat ;
}
#container #greenreflect{
width : 100%;
height: 341px;
background: #000 url(images/greenreflection.jpg) top no-repeat ;
}

#container #hillreflect{
width : 100%;
height: 342px;
background: #000 url(images/hillreflection.jpg) top no-repeat ;
}
#container #polarreflect{
width : 100%;
height: 342px;
background: #000 url(images/polarreflect.jpg) top no-repeat ;
}
#container #sharkreflect{
width : 100%;
height: 342px;
background: #000 url(images/sharkreflect.jpg) top no-repeat ;
}
#container #flyersreflect{
width : 100%;
height: 342px;
background: #000 url(images/flyersreflect.jpg) top no-repeat ;
}
#container #webreflect{
width : 100%;
height: 342px;
background: #000 url(images/webreflect.jpg) top no-repeat ;
}
#container #elepreflect{
width : 100%;
height: 342px;
background: #000 url(images/elepreflect.jpg) top no-repeat ;
}
#container #birdreflect{
width : 100%;
height: 342px;
background: #000 url(images/birdreflect.jpg) top no-repeat ;
}
#container #noreflect {
margin-top: 6px;
width : 100%;
height: 342px;
background: #000;
}


#container #colleft{
margin: 10px 7px 10px 10px;
float: left;
width: 174px;
height: 290px;
border-right: 1px solid #666;
padding-top: 30px;
text-align:center;
}


#container #colleft #greenachiever {
width: 100%;
height: 91px;
margin-top: 55px;
margin-bottom: 10px;
background: url(images/green.png) top no-repeat ;	
}
#container #colleft #contact-us {
width: 100%;
height: 64px;
margin-top: 73px;
margin-bottom: 10px;
background: url(images/phone.png) top no-repeat ;	
}
#container #portfolioright {
margin: 10px 7px 10px 10px;
padding-top: 30px;
float: left;
height: 280px;
width: 600px;
}
#container #contact-center {
margin: 10px 20px 10px 25px;
padding-top: 30px;
float: left;
height: 280px;
width: 290px;
}
#container #contact-right {
margin: 10px 7px 10px 10px;
padding: 30px 0 0 30px;
float: left;
height: 280px;
width: 310px;
}



	
	

#container #colcenter{
margin: 10px 7px 10px 10px;
padding: 20px 5px;
float: left;
height: 280px;
width: 500px;
border-right: 1px solid #666;
}


#container #colcenter #left{
width: 230px;
float: left;
margin-right: 25px;
text-align: justify;
}
#container #colcenter #right{
width: 230px;
float: left;
text-align: justify;
}







#container #colright{
margin: 10px 7px 10px 10px;
float: left;
width: 150px;
padding-top: 60px;
text-align:center;
}
#container #colright #minilogo {
width: 100%;
height: 40px;
margin-top: 55px;
margin-bottom: 10px;
background: url(images/minilogo.png) top no-repeat ;	
}
#container #colright #contact-us {
width: 100%;
height: 64px;
margin-top: 53px;
margin-bottom: 10px;
background: url(images/phone.png) top no-repeat ;	
}










        #porfolio {
            background-color: #000;
            width: 654px;
            margin: 15px auto;
			clear:both;
            
        }
        
        /* slider specific CSS */
        .sliderGallery {
            
            overflow: hidden;
            position: relative;
            padding: 0px;
            height: 160px;
            width: 656px;
        }
        
        .sliderGallery ul {
            position: absolute;
            list-style: none;
            overflow: none;
            white-space: nowrap;
            padding: 0;
            margin: 0;
			
        }
        
        .sliderGallery ul li {
            display: inline;
        }


			.sliderGallery img {
				border: none; 
					}
			.sliderGallery ul li.hover {
				background: #ddd;
				cursor: pointer;
			}
			.sliderGallery ul li.active {

}
html .sliderGallery ul li h2 {
	font-size: 1.5em; 
	margin: 5px 0; padding: 0;
	display: none;
}
.sliderGallery ul li .block {
display: none;
}	
.sliderGallery ul li p{display: none;}
.sliderGallery ul li small {
display: none;
}



        .slider {
            width: 654px;
            height: 17px;
            margin-top: 7px;
            margin-left: 1px;
			margin-bottom: 10px;
            padding: 1px;
            position: relative;
            background: url(images/scrollout.jpg) no-repeat;
        }
        
        .handle {
            position: absolute;
            cursor: move;
			margin: 3px 0 0 16px;
            height: 10px;
            width: 129px;
            top: 0;
            background: url(images/handle.png) no-repeat;
            z-index: 100;
			
        }
        
		
		
		
#footer {
margin-top: 8px;
padding: 10px 0 0 0;
text-align:center;
width: 100%;
height: 50px;
background: url(images/footerstrip.jpg) top repeat-x;	
}

#footer .text{

color: #FFF;
font-size: 70%;
margin: 0;
padding: 0;
}

#footer a {
color : #fff;
font-size: 100%;
text-decoration: underline;
margin: 0;
}
#footer a:hover, a:focus, a:active {
color: #000;
}