/* css reset v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*text selection*/

::selection {
	background: #add2ed; /* Safari */
	color:#555;
	}
::-moz-selection {
	background: #add2ed; /* Firefox */
	color:#555;
}


/*******************************************************/
/*Mike Brogowski styles*/

html{
	height:100%;
}

body{
	font: 75% / 1.5em Arial, Tahoma, "Trebuchet MS", Vardana;
	background: #444 url(../images/gfx/body-bg.jpg) center center;
	width: 100%;
	height: 100%;
}

#body-wrapper-front{
	background:url(../images/gfx/body-wrapper-bg-short-graphic.jpg) repeat-x center top;
}

#body-wrapper{
	background:url(../images/gfx/body-wrapper-bg-short.jpg) repeat-x center top;
}


#container{
        position:   relative;
	width:	960px;
	min-height: 500px;
	margin:	0 auto;

}

#header{
	height: 104px;
}

#header-front{
	height: 130px;
}

#breadcrumbs{
	position:absolute;
	top:80px;
	left:400px;
        color:#aaa;
}

#call-to-action{
		position:relative;
		height:	150px;
}

#cta-punchline{
	position:absolute;
	right:0;
	top:0;
	text-align:right;
	z-index:2;
}

#projects-cycler{
	display: none;
	height:282px;
	width: 460px;
	overflow:hidden;
	margin: 0 auto;
}

#thumbsList{
	text-align: center;
}

#logo{
        display:block;
        padding: 35px 0 0 0;
		width:218px;
		height:35px;
}

#menu-wrapper{
        position: absolute;
        width: 560px;
        height: 71px;
        top:0;
        left:400px;
}

#sidebar{
	width: 280px;
	float: left;
	padding:0 10px 0 0;
	background:url(../images/gfx/sidebar-bg.png) no-repeat left top;
}

#sidebar-blank{
	width: 280px;
	float: left;
	padding:0 10px 0 0;
}

#main-content{
	position:relative;
	width: 460px;
	float: left;
	padding:0 0 0 0;	
	}

#main-content-full{
        width:auto;
        position: relative;
        margin: 10px 0 0 0;
}

.column{
	width:31%;
	margin:0 0.165% 0 0.165%;
	margin:0 1% 0 1%;
	float:left;
}

.column-twothirds{
	width:65%;
	margin:0 0.165% 0 0.165%;
	margin:0 1% 0 1%;
	float:left;
}

#footer{
	height:100px;
	padding:20px 0 20px 0;
	clear: both;
	text-align:center;
}

#work-submenu{
	float:left;
	width:180px;
	padding:0;
	margin:10px 0 0 0;		
}

#work-submenu a{
	padding:20px 0 0 0;
}

#work-submenu span{
	padding:20px 0 0 0;
	color:#ddd;
}

.workCategory{
	font-size: 1.1em;
	display:block;
	float:right;
	text-align:center;
	margin: 	0 0 0 0;
/*	padding:	20px 0 0 0;*/
	width:180px;
	height:34px;
/*	background:url(../images/gfx/work-category-bg.jpg) no-repeat left top;*/
}


.workCategory-current{
	font-size: 1.1em;
	display:block;
	float:right;
	text-align:center;
	margin:0;
	width:185px;
	height:42px;
	background:url(../images/gfx/work-category-bg.jpg) no-repeat right top;
}

.projectThumb{
		display:block;
        width:25px;
        height: 25px;
        float: left;
        overflow:hidden;
        padding:10px;
		margin:10px 10px 0 0;
		
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
		opacity:0.5;
		text-indent:-9999px;
}

.projectThumb:hover{
        width:25px;
        height: 25px;
        float: left;
        overflow:hidden;
        padding:10px;
		margin:10px 10px 0 0;
		
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
		
/*		border:1px solid #add2ed;*/
}

.projectThumb-current{
        width:23px;
        height: 23px;
        float: left;
        overflow:hidden;
        padding:10px;
		margin:10px 10px 0 0;
		text-indent:-9999px;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
		opacity:1 !important;
		cursor:default;
		border:1px solid #add2ed;
}


.projectShowcase{
	float:left;
	display:none;	
	width:460px;
	height:308px;
	margin:0 0 0 0;
/*	margin:0 auto;*/
/*	background:#999;*/
	overflow:hidden;
	position:relative;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

.projectShowcase-movie{
	float:left;
	display:none;	
	width:460px;
	height:302px;
	margin:0 0 0 0;
/*	margin:0 auto;*/
	background:#999;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

.projectShowcaseSlide{
	display:block;
	width:460px;
	height:282px;
	text-indent: -9999px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	background-position: center center;
	background-repeat: no-repeat;
}

.description{
	width:460px;
}

#thumbsList{
/*	float:right;*/
/*	width:490px;*/
	min-height:527px;
	margin:45px auto 0 auto;
	width:220px;
}


/* MAIN NAV */

.menu-button{
	background:url(../images/gfx/menu-sprite.jpg) no-repeat left top;
	display:block;
	width:	126px;
	height:	41px;
	padding:30px 0 0 0;
	text-align:center;
	text-decoration:none;
	float:left;
	color:#ddd;
}

.menu-button-first{
	background:url(../images/gfx/menu-sprite.jpg) no-repeat left -213px;
	display:block;
	width:	126px;
	height:	41px;
	padding:30px 0 0 0;
	text-align:center;
	text-decoration:none;
	float:left;
	color:#ddd;
}

.menu-button:hover, .menu-button-first:hover{
	background:url(../images/gfx/menu-sprite.jpg) no-repeat 0 -71px;
	color:#add2ed;
}

.menu-button-current, .menu-button-first-current{
	background:url(../images/gfx/menu-sprite.jpg) no-repeat left -142px;
	display:block;
	width:	126px;
	height:	41px;
	padding:30px 0 0 0;
	text-align:center;
	text-decoration:none;
	float:left;
	color:#add2ed;
}

.panel{
		position:relative;
        width:289px;
        height:247px;
		padding:0 15px 0 15px;
		margin:0 1px 0 0;
        background:url(../images/gfx/panel-gloss.jpg) no-repeat top left;
        float:left;
}

.enter-button{
	position:absolute;
	bottom:20px;
	left:145px;
	display:block;
	text-indent:-9999px;
	line-height:0;
	width:36px;
	height:36px;
	background:url(../images/gfx/enter-button-sprite.jpg) no-repeat top left;
}

.enter-button:hover{
	background:url(../images/gfx/enter-button-sprite.jpg) no-repeat -36px left;	
}

.enter-button:active{
	background:url(../images/gfx/enter-button-sprite.jpg) no-repeat -72px left;		
}

.category-image{
	display:block;
	text-indent:-9999px;
	line-height:0;
	width:290px; 
	height:80px; 
	background-repeat:no-repeat;
	background-position: center center;
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}

.graphic-showcase{
        width: 527px;
        height: 300px;
        background-repeat:no-repeat;
        background-position:left top;
        overflow:hidden;
        text-indent:-9999px;
}

.PrevNextMenu{
	
}

.PrevNextMenu-full{
	width: 110px;
	margin: 10px auto 0 auto;
}

.prev{
         display:block;
         text-indent:-9999px;
         width:55px;
         height:23px;
         background:url(../images/gfx/prev.gif) no-repeat;
         float: right;
         /*position: absolute;
         top: 120px;
         left: 180px;*/
}

.prev:hover{
         background:url(../images/gfx/prev-over.gif) no-repeat;
}

.next{
         display:block;
         text-indent:-9999px;
         width:55px;
         height:23px;
         background:url(../images/gfx/next.gif) no-repeat;
         float: right;

         /*position: absolute;
         top: 120px;
         right: 180px;*/
}

.next:hover{
         background:url(../images/gfx/next-over.gif) no-repeat;
}

/* TYPE */

h1{
	font-size:2em;
	color:#add2ed;
	font-weight:normal;
	margin:10px 0 10px 0;
	padding:0 0 0 0;
}
h2{
	font-size:1.6em; 
	color:#aaa;
	font-weight:normal;
	margin:10px 0 5px 0;
	padding:0 0 0 0;

}
h3{
	font-size:1.1em; 
	color:#999;
	font-weight:bold;
	margin:10px 0 0 0;
	padding:0 0 0 0;

}
h4{
	font-size:1.3em; 
	color:#777;
	font-weight:normal;
	margin:5px 0 5px 0;
	padding:0 0 0 0;

}
h5{
	font-size:1.1em; 
	color:#555;
	font-weight:normal;
	margin:5px 0 5px 0;
	padding:0 0 0 0;

}

p{
    font-size:1em;
    color:#ddd;
	margin:5px 0 15px 0;
	padding:0 0 0 0;

}

a{
	color:#add2ed;
	text-decoration:none;
	}
	
a:hover{
	color:#d7efff;
	text-decoration:none;
	}	

a:active{
	color:#90afc5;
	}

ul{
	margin:0 0 0 10px;
}

li{
	color:		#ddd;
	font-size:	1em;
	margin:		5px 0 5px 0;
}

ul li ul{
	font-size:1em;
}

/*forms*/

label{
	display:block;
}

input[type='text']{
	padding:5px;
	background:#555;
	border:1px solid #999;
	color:#aaa;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}

textarea{
	padding:5px;
	background:#555;
	border:1px solid #999;
	color:#aaa;
	
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
}

/*helpers*/

.cl{
	clear:left;
}

.cr{
	clear:right;
}

.cb{
	clear:both;
}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/*Breadcrumbs*/

.B_currentCrumb{
	color:#ddd !important; 
}

/* ---------   Accordion --------------*/

#acc, #acc1, #acc2 {width:auto; list-style:none; color:#033; margin:0px;}
#acc h3, #acc1 h3, #acc2 h3 {
	width:auto;  
	padding:2px 2px 0 25px;  
	cursor:pointer; 
	color: #ddd; 
	font-size: 1.1em; 
	font-weight: bold;
	background:url(../images/gfx/plus.jpg) no-repeat left center;
}

#acc h3:hover, #acc1 h3:hover, #acc2 h3:hover {
	width:auto;  
	padding:2px 2px 0 25px;  
	cursor:pointer; 
	color: #add2ed; 
	font-size: 1.1em; 
	font-weight: bold;
	background:url(../images/gfx/plus-over.jpg) no-repeat left center;
}	

#acc h3.current, #acc1 h3.current, #acc2 h3.current {
	width:auto;  
	padding:2px 2px 0 25px;  
	cursor:pointer; 
	color: #add2ed; 
	font-size: 1.4em; 
	font-weight: normal;
	letter-spacing:-0.05em;
	background:url(../images/gfx/plus-expanded.jpg) no-repeat left center;
}

#acc h3:hover, #acc1 h3:hover, #acc2 h3:hover {}
#acc .acc-section, #acc1 .acc-section, #acc2 .acc-section {overflow:hidden;}
#acc .acc-content, #acc1 .acc-content, #acc2 .acc-content {
	width:auto; 
	padding:0 5px;  
	color:#bbb;
	}
	
.acc-content{
	font-size: 1em; 
	line-height: 1.2em;
	margin:10px 0 0 0;
	}
	
.acc-content p {
	font-size: 1em; 
	line-height: 1.2em;
	color:#fff;
}	
	
#acc li, #acc1 li, #acc2 li  {margin: 2px; padding: 0px;}

form#ContactForm label { margin-bottom: 5px; }

#bbb{
   background:#fff; 
   padding:5px;  
   width:210px; 
   margin:0 auto;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
}
