html			{ background:url(../images/background.jpg) no-repeat; font-family: 'Chivo',  Arial, Helvetica, sans-serif; }

.half, .third, .quarter, .fifth, .sixth{ width: 100%; }
.half li, .third li, .quarter li, .fifth li, .sixth li{ float: left; list-style-type: none;}
.half li{ padding-right: 0%; width: 50% }
.third li{  padding-right: 5%; width: 28.3% }
.quarter li{  padding-right: 5%; width: 20% }
.fifth li{  padding-right: 5%; width: 15% }

A:link { color:#006;}
A:visited { color:#006;}
A:active { color:#006;}
A:hover { color:#006;}


/*** Clouds ***/
.clouds					{ width:100%; height:302px; overflow:hidden;  }
#clouds-small			{ width:3000px; height:100%; background:url(../images/bg-clouds-small.png) repeat-x; }
#cloud2					{ position:relative; top:-269px; left:-38px;  }
#clouds-big				{ width:9000px; height:100%; background:url(../images/bg-clouds-big.png) repeat-x;  }

/*** Header ***/
h1#logo				{ background:url(../images/logo.png) top left no-repeat; height:200px; width:600px;
						text-indent:-9999px; position:absolute; top:10px; left:0px; }


#menu				{ float:right; position:absolute; top:180px; left:200px; z-index:10; }

#menu a				{ color:black; text-decoration:none; padding:10px; font-family: 'Metrophobic', Arial, Helvetica, sans-serif;
						margin-right:10px; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
					
#menu a:hover		{ color:red; text-decoration:none; padding:10px;
						margin-right:10px; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}

#menu a.selected	{ color:red; text-decoration:none; padding:10px;
						margin-right:10px; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
					
#menu li			{ float:left; }

.social			{ float:right; position:absolute; top:50px; right:50px; z-index:10; }


/*** Body Content ***/
#wrapper	{ width:100%; height:100%; position:absolute; top:0; left:0; overflow:hidden; }

#mask		{ width:400%; height:100%; }

.box		{ width:25%; height:100%; float:left; }

.content	{ width:1000px; height:400px; top:100px; margin: 0 auto; position:relative;  margin-top:100px; }
				
.inner		{ width:1000px; height:360px;  -margin:5px; padding:15px; top:5px; position:relative; }
					
					    /* Content */
    article{
        float: left;
        width: 57%;
        margin-top:25px;
         }
    
    /* Sidebar */
    aside{
        float: left;
        width: 40%;
        margin-left:3%;
         margin-top:35px;
    }
    
       .strikethrough {
  background-image: url("../images/words/strikethrough.png");
  background-repeat: repeat-x;
}

.social {
z-index: 1;
background:url(../images/box.png);
padding: 18px; 
}


#map {
			margin:0;
			padding:0;
			width:460px;
			height:366px;
			background:url(../images/home-graphic.png) top left no-repeat;
			font-family:arial, helvetica, sans-serif;
			font-size:8pt;
			z-index:100;
		}
		
		#map li {
			margin:0;
			padding:0;
			list-style:none;
			z-index:100;
		}
		
		#map li a {
			position:absolute;
			display:block;
   			background:url(../images/blank.gif);
   			text-decoration:none;
			color:#000;
			z-index:100;
		}
		
		#map li a span { display:none; }
		
		#map li a:hover span {
			position:absolute;
			display:block;
			padding:5px;
 			z-index:100;
 		}
	
		#map a.email {
			top:40px;
			left:556px;
			width:85px;
			height:85px;
			z-index:100;
		}
		
		#map a.web {
			top:135px;
			left:580px;
			width:126px;
			height:90px;		
		}
		
		#map a.ad {
			top:30px;
			left:670px;
			width:83px;
			height:83px;	
		}
		
		#map a.photo {
			top:160px;
			left:720px;
			width:95px;
			height:95px;
		}
		
		#map a.copy {
			top:75px;
			left:775px;
			width:88px;
			height:79px;
		}
		
		
		
.horizontalaccordion>ul {
    margin-top: 60px;
    padding: 0;
    list-style:none;
   	height: 300px;
}

.horizontalaccordion>ul>li {
    display:block;
	overflow: hidden;
    float:left;
    margin: 0;
    padding: 0;
    list-style:none;
	width:128px;
	height: 300px;


    /* CSS3 Transitions */
    transition: width 0.3s ease-in-out;
    -moz-transition: width 0.3s ease-in-out;
    -webkit-transition: width 0.3s ease-in-out;
    -o-transition: width 0.3s ease-in-out;
}

.horizontalaccordion>ul>li>h3 {
    display:block;
    float:left;
    margin: 0;
    padding:10px;
    height:108px;
    width:280px;
    margin-top:-90px;

    /* Decorative CSS */
    font-family: Arial, Helvetica, sans-serif;
    text-decoration:none;
    text-transform:uppercase;
    color: #000;

    /* CSS3 Transform Rotate & Translate */
    white-space:nowrap;
    margin-top:-20px;



    /* CSS3 Gradient Effect */
}

.horizontalaccordion>ul>li>div {
    display:none;
    float:left;
	overflow: auto;
    position:relative;
    top:-120px;
    left:40px;
    *top:0px;       /* IE7 Hack */
    *left:0px;      /* IE7 Hack */
    margin-left:80px;
    margin-top:30px;
    width:240px;
    height:280px;
    padding:10px;
}

.horizontalaccordion>ul>li:hover {
    overflow: hidden;
	width: 380px;
}

.horizontalaccordion:hover>ul>li:hover>div {
    display:block;
}

.horizontalaccordion:hover>ul>li:hover>h3 {
    /* Decorative CSS */

    /* CSS3 Gradient Effect */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1.0)
            progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff454545, endColorstr=#ff000000); /* IE 5.5 - IE 7 */
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1.0)"
                "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ff454545, endColorstr=#ff000000)";   /* IE 8 */
}

.horizontalaccordion>ul>li>h3:hover {
    cursor:pointer;
}




.hover {
	margin-top: -390px;
	margin-left: 0px;
}
		
		


.do p {
font-size:13px; 
line-height:18px;
}		

.do h4 {
text-transform:uppercase; 
font-family: Arial, Helvetica, sans-serif; 
font-weight:900;
font-size:13px; 
line-height:18px;
}
		
		
		/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/cssplay-radiobox.html
Copyright (c) 2005-2011 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
.radioBoxImages {padding-left:15px; padding-top:10px;}
.rBox img {border:0;    cursor:pointer;
}
input.pop {position:absolute; left:-9999px;}

.radioBox {display:table; position:fixed; top:0; left:-9999px; width:100%; height:100%; z-index:500; background:rgba(0,0,0,0.5);  
}
.radioBox .holder {position:absolute; width:100%; height:100%; left:0; top:0; z-index:50; text-align:center; display:table-cell;   
}

.radioBox .frame {display:inline-block; margin:50px auto; padding:15px; background:#fff; position:relative; text-align:left; font-family:arial, sans-serif;
border-radius:5px 5px 0 0;
opacity:0;
-webkit-transition: 0.75s;
-moz-transition: 0.75s;
-o-transition: 0.75s;
transition: 0.75s;
}
.radioBox .frame .clickLeft {position:absolute; left:15px; top:15px; right:50%; bottom:15px; background:url(trans.gif); z-index:110;  
}
.radioBox .frame .clickLeft .previous {opacity:0; position:absolute; width:100px; height:40px; top:120px; left:0;  
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
}
.radioBox .frame .clickLeft:hover .previous {opacity:1;    cursor:pointer;
}

.radioBox .frame .clickRight {position:absolute; right:15px; top:15px; left:50%; bottom:15px; background:url(trans.gif); z-index:110;}
.radioBox .frame .clickRight .next {opacity:0; position:absolute; width:100px; height:40px; top:120px; right:0;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
}
.radioBox .frame .clickRight:hover .next {opacity:1;    cursor:pointer;
}

.radioBox .frame .caption {position:absolute; margin-top:10px; left:0; right:0; padding:5px 15px; background:#fff;
box-shadow:0 15px 10px -15px rgba(0,0,0,0.8);
border-radius: 0 0 5px 5px;
}
.radioBox .frame .caption h4 {font-size:18px; margin:0; padding:3px 0; color:#333;}
.radioBox .frame .caption p {font-size:14px; color:#444; margin-left:100px; padding:3px 0;}
.radioBox .frame .caption h4 span {float:right; font-size:9px;}
.radioBox .large {display:inline-block; position:relative; z-index:100; border:1px solid #888;}

.radioBox .frame .close {display:block; width:48px; height:48px; position:absolute; top:-24px; right:-24px; z-index:200;    cursor:pointer;}

#pop1:checked ~ .radioBox,
#pop2:checked ~ .radioBox,
#pop3:checked ~ .radioBox,
#pop4:checked ~ .radioBox,
#pop5:checked ~ .radioBox,
#pop6:checked ~ .radioBox,
#pop7:checked ~ .radioBox {left:0;}

#pop1:checked ~ .radioBox .h1, 
#pop2:checked ~ .radioBox .h2, 
#pop3:checked ~ .radioBox .h3, 
#pop4:checked ~ .radioBox .h4, 
#pop5:checked ~ .radioBox .h5, 
#pop6:checked ~ .radioBox .h6, 
#pop7:checked ~ .radioBox .h7 {z-index:100;}

#pop1:checked ~ .radioBox .h1 .frame, 
#pop2:checked ~ .radioBox .h2 .frame, 
#pop3:checked ~ .radioBox .h3 .frame, 
#pop4:checked ~ .radioBox .h4 .frame, 
#pop5:checked ~ .radioBox .h5 .frame, 
#pop6:checked ~ .radioBox .h6 .frame, 
#pop7:checked ~ .radioBox .h7 .frame {opacity:1; z-index:100;}


.click {
margin-top:-160px;
margin-left: 675px;
}

.quote {
margin-left:40px;
width:84%;
}

.who {
font-size:14px; line-height:22px;
}

.about { font-size:13px; line-height:26px; }

.homecontent {
font-size:13px; line-height:26px; padding-top:10px; width:85%;
}



#homebgnd {background:url(../images/homebgnd.png) no-repeat; position:relative; 
}

#stuffbgnd {background:url(../images/stuffbgnd.png) no-repeat; position:relative; 
}

#workbgnd {background:url(../images/workbgnd.png) no-repeat; position:relative; 
}

#aboutbgnd {background:url(../images/aboutbgnd.png) no-repeat; position:relative; 
}

#contactbgnd {background:url(../images/contactbgnd.png) no-repeat; position:relative; 
}

@media handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
    .content {width:60%; margin-right:10%; margin-left:40px;}  
	#map {margin-left:-40px;}
	.who {margin-right:100px; font-size:8px; line-height:14px;}
	.about {font-size:10px; line-height: 16px;}
	.homecontent {font-size:10px; line-height: 16px;}
	#aboutbgnd {background:url(../images/aboutbgnd-m.png) no-repeat; position:relative; }
	#contactbgnd {background:url(../images/contactbgnd-m.png) no-repeat; position:relative; }
	#workbgnd {background:url(../images/workbgnd-ie.png) no-repeat; }
	.contactpic { margin-left:-100px;}
	.foot {margin-left:500px;}
.radioBox {display:none;}
.click {display:none;}

	}  

img, div { behavior: url(/js/iepngfix.htc) }

.rss {
margin-left:-30px;
margin-top:-12px;
}