/* --------------------------------------------- */
/* Title	Default Styles
/* Author	Paul Karlik Byte-Mechanic
/* Updated	July 2010
/* --------------------------------------------- */

/* basic CSS reset styles ---------------------- */

body, div, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, embed, object{padding: 0;margin: 0;}
address, caption, cite, code, em, h1, h2, h3, h4, h5, h6, strong, var {font-weight: normal;font-style: normal;}
h1, h2, h3, h4, h5, h6 {font-size: 1.0em;}
table {border-collapse: collapse;border-spacing: 0;}
fieldset, img, abbr {border: 0;}
ul {list-style: none;}
caption, div, span {text-align: left;}
a, ins {text-decoration: none;}
:focus {outline: 0;}
.clear{clear:both;}
body html {height:100%;}

/* --------------------------------------------- */

/* basic page layout styles -------------------- */
.byte{
	background-image:url(../images/background-cork.jpg);
	margin:0px;padding:0px;background-color:#a45c28;
	font-family:Verdana,Arial,sans-serif;font-size:12px;}

a{color:#fd791e;}
a.text{text-decoration:none;}
a.footer{font-size:10px;text-decoration:underline;color:#5f330e;}

.accent{color:#FD791E;}
.complementry{color:#999;}
/* --------------------------------------------- */


/* main-page wrapper styles -------------------- */

#wrapper{
	background:url(../images/background-stripe.gif) 0 0px repeat-x;
	padding:0px;margin:0px;}

	#byte-logo{
		background:url(../images/byte-logo.png) bottom left no-repeat;
		margin:auto;padding:10px 0px 0px 0px;width:864px;height:32px;}

#date{
	margin:58px 0px 10px 20px;}
		
#container{background:#fff;
	margin:auto;width:900px;}

	#container .section{
	background-color:#fff;width:900px;margin:20px 0px 0px 0px;}
	
	.left-box{
		background:url(../images/dotted-horz.gif) top right repeat-y;
		margin:0px;float:left;width:540px;}
	.right-box{
		margin:0px;float:left;width:360px;}

	.box-shadow{
		background:url(../images/box-shadow.png) top left no-repeat;
		height:41px;width:420px;float:right;}

/* --------------------------------------------- */


/* main-page wrapper styles -------------------- */

	#container h1{
	background:url(../images/header-lg-paper-tape.gif) top left no-repeat;
	font-family: Verdana, sans-serif;font-size:16px;font-weight:bold;color:#000;
	height:32px;width:230px;padding:2px 0px 0px 8px;margin:20px 0px 10px 20px;}

	#container h2{
	background:url(../images/header-lg-paper-tape.gif) top left no-repeat;
	font-family: Verdana, sans-serif;font-size:14px;font-weight:normal;color:#000;
	height:32px;width:200px;padding:2px 0px 0px 8px;margin:20px 0px 10px 20px;}

	#container h3{
	background:url(../images/header-paper-tape.gif) top left no-repeat;
	font-family: Verdana, sans-serif;font-size:12px;font-weight:normal;color:#000;
	height:32px;width:230px;padding:2px 0px 0px 8px;margin:20px 0px 10px 20px;}
 	
	#container h4{
	font-size:14px;font-weight: bold;margin:0px 0px 8px 0px;}

	#container h5{
	font-size:12px;margin:5px 0px 0px 0px;}
	
	#container .content{
	color:#999;padding:0px 0px 10px 20px;width:500px;}
	
	#container .buttons{
	margin:0px 0px 0px 20px;padding:0px 0px 20px 0px;display:none;}

			#container .buttons a.box-button{
			font-size:10px;color:#fff;
			display:block;width:12px;height:12px;padding-bottom:2px;margin-right:2px;float:left;background:#000;text-align:center;}
	
	#container .sub-story{
	margin:0px 0px 0px 20px;}
			
	.story-box{
	position: absolute;
	display:block;	
	}
			
	#container .three-content{
	font-size:10px;color:#999;
	width:150px;float:left;margin:10px 20px 0px 0px;}

	#container .three-content h5{font-size:10px;font-weight:bold;color:#000;}
		
	.cut-off{
	overflow:hidden;width:150px;height:80px;}
	
	.history .cut-off img{
	margin:-20px 0px 0px -20px;}

.main-flash-box{
background:url(../images/photo-shadow-white.gif) bottom right no-repeat;
padding:0px 0px 15px 0px;width:502px;height:281px;}
	
	.main-frame{
	border: 1px solid #000;}
	
.main-photo-box{
background:url(../images/photo-shadow-white.gif) bottom right no-repeat;
padding:0px 0px 15px 0px;margin:0px 0px 10px 10px;width:500px;height:281px;}

	.main-photo-box img{
	border:1px solid #000;margin-left:10px;}

	.main-photo-box p{
	color:#bbb;font-size:10px;margin-left:10px;}
		
	.page-info{
	width:320px;color:#999;margin:5px 0px 20px 20px;}
		
	#container .history h4{
	font-size:12px;font-weight: bold;margin:0px 0px 0px 0px;}

	#container .history h5{
	font-size:12px;font-weight: bold;margin:0px 0px 10px 0px;}
	
	#container .history p{
	margin:0px 0px 10px 0px;}
		
	#container .history ul li{
	list-style: disc;list-style-position: inside;}
	
	#container .history-image{
	width:150px;float:left;margin:0px 20px 10px 0px;}
	
	#container .history-image .cut-off{
	border:1px solid #999;}

	#container .three-area{
	 color:#999999;float:left;margin:10px 20px 0 0;padding-top:10px;width:150px;height:80px;border-top:1px dotted #999;}
	 
/* --------------------------------------------- */

/* parent navigation styles -------------------- */

.buttonSprite{
background:url(../images/arrow-hover.gif) 0px 0px no-repeat;	
color:#fff;overflow:hidden;width:160px;height:19px;display: block;}

.buttonSub{
background:url(../images/arrow-hover-sub.gif) 0px 0px no-repeat;
color:#fff;overflow:hidden;width:160px;height:19px;display: block;}

.subnav{float:right;display:none;}

.shownav{	
	position:relative;top:-44px;display:block;float:right;border-left:1px dotted #999;}

/* --------------------------------------------- */


/* IE 7 Hack for one extra space in an LI ------ */

*ul.shownav{top:-46px;}

#navigation{
padding:0px;margin:5px 0px 0px 20px;width:321px;position: relative;}

	#navigation ul{
	margin:0px;padding:0px;height:auto;}

	#navigation li{
	padding:0px;margin:0px 0px 3px 0px;list-style: none;}

	#navigation a{
	width:160px;height:19px;display: block;font-size:12px;text-decoration:none;	
	padding:0px 0px 0px 15px;margin:0px 0px 3px 0px;color:#000;}

	#navigation a:hover{color:#fff;} 

	.ul-main #navigation #main a,
	.ul-professional #navigation #professional a,
	.ul-development #navigation #development a,
	.ul-resources #navigation #resources a,
	.ul-contact #navigation #contact a{
	color:#fff;background:url(../images/arrow-hover-selected.gif) 0px 0px no-repeat;}

	.ul-professional #navigation.news #news a,
	.ul-professional #navigation.resume #resume a,
	.ul-professional #navigation.history #history a,
	.ul-professional #navigation.examples #examples a,
	.ul-development #navigation.flash #flash a,
	.ul-development #navigation.electronics #electronics a,
	.ul-development #navigation.design #design a,
	.ul-development #navigation.audio #audio a,
	.ul-development #navigation.web #web a,
	.ul-resources #navigation.links #links a,
	.ul-resources #navigation.downloads #downloads a,
	.ul-resources #navigation.other #other a {
	color:#fff;background:url(../images/arrow-hover.gif) 0px 0px no-repeat;}

/* --------------------------------------------- */