/*BODY CONTROLS*/
body { background: #222; font-family: "Trebuchet MS", sans-serif; font-size: 14px; color: #333; margin: 0px auto; }
h1{ font-size:16px; color: #CCC;}
h2{ font-size:16px; color: #666;}
br{ clear: both; }
hr{ clear: both; width: 75%; color: #999; }

/*LAYOUT CONTROLS*/
#container{ width: 1020px; height: auto; background-color: black; margin: 0px auto; }
#header{ width: 1020px; height: 155px;	text-align: center;	line-height: 155px;	vertical-align: middle;	background: url('../images/header_bg.png'); background-repeat: no-repeat; background-position: center; }
#nav{ width: 1020px; height: 43px; text-align: left; border: 1px #222 solid; }
#webmail_block{ width: 1020px; height: 25px; line-height: 25px; text-align: right; background-color: #222; 
				vertical-align: middle; text-transform: uppercase; letter-spacing: .2em; font-size: 9px; font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif }
#content{ height: auto; width: 1000px; background-color: white; margin: 0px auto; padding: 10px; }
#footer {width: 100%; height: auto; background-color: #222; text-align: center; color: White; margin: auto auto; }
#footer td { border: none; }

/* MODAL WINDOW v1.1: Andrew Sauder, andrewsauder@gmail.com, 240.321.9009 */
#modalWindow { position:fixed; background:#FFF; width:720px; height: 600px; overflow: auto; z-index:999999; padding:25px; display:none; top:10px; left:50%; margin-left:-25%; border:1px solid #666; }
#modalClose { background:url(../images/modal/modalClose.png) no-repeat; width:24px; height:24px; position:relative; float:right; border:2px solid #FFF; filter: alpha(opacity='50'); opacity: .5; }
#modalClose:hover { filter: alpha(opacity='100'); opacity:1; cursor:pointer; }
#modalBK { position:fixed; top:0;left:0;width:100%; height:100%; background:#000; z-index:999998; display:none; text-align:center; margin:auto;  }
.shadow {	-moz-box-shadow: 3px 3px 4px #000; -webkit-box-shadow: 3px 3px 4px #000; box-shadow: 3px 3px 4px #000; } /* NOT IE COMPLIANT */
#modalData img { max-width:630px; }


/*PAGE SPECIFIC CONTROLS */

/* 1. Index Page */
#intro{ width:300px; height: 270px; background-color: #333; float: left; clear: left; }
#intro_text  { width: 280px; height: 250px; padding: 10px; color: white; }
#slide_container { width:698px; height: 268px; float: right; clear: right; border: 1px solid black; }
.content_block { width:325px; height: 230px; float: left; margin: 3px; background-image: url('../images/content_block.jpg'); background-position: center; background-repeat:no-repeat; }
#new_block { width: 980px; height: 385px; margin: 0px auto; padding: 10px; background-image: url('../images/content_block.jpg'); background-repeat: repeat-x; }

/* 2. Downloads */

#screenshot { position:absolute; border:1px solid #ccc; background:#333; padding:5px; display:none; color:#fff; }
#screenshot_b { position:absolute; border:1px solid #ccc; background:#333; padding:5px; display:none; color:#fff; }

/* 3. Downloads */
#ts_container { width: 940px; min-height: 100px; padding 0px; }
#ts_container_left { width: 320px; height: inherit; float: left; clear: left; padding: 10px; text-align: center; }
#ts_container_right{ width: 480px; min-height: 100px; line-height: 25px; vertical-align: middle; float: left; clear: right; padding: 25px;}
#ts_container img { border: 1px silver dashed; padding: 10px; }
	
/* 4. File Transfer Login */
#loginform 
{
	width: 620px; height: 320px; margin: 0px auto;
	background-image: url('../images/bg_form.png'); background-position: center center; background-repeat: no-repeat;
}

/* 5. File Transfer Page */
#ft_subhead_left { width: 300px; height: 25px; float: left; clear: left; line-height: 25px; }
#ft_subhead_left span { font-size:16px; color: #CCC; }
#ft_subhead_right { width: 300px; height: 25px; float: right; clear: right; line-height: 25px; text-align: right; color: red; }
	
/* 6. Project Page */
#getProjects { width: 1000px; height: auto; display: none; }
#defaultProjects img { padding: 5px; width: 300px; height: 225px; }

/* 7. Idler Page - 30mm */
#container_30mm { width: 800px; height: 700px; margin: 0px auto; padding: 5px; }
#container_3_4 { width: 800px; height: 610px; margin: 0px auto; padding: 5px; }
#container_17mm { width: 800px; height: 565px; margin: 0px auto; padding: 5px; }
#img_30mm { position: relative; left: 10px; top: 70px; }
#img_3_4 { position: relative; left: 10px; top: 25px; }
#img_17mm { position: relative; left: 10px; top: 70px; }
#block1 { position: relative; left: 10px; bottom: 455px; height: 50px; width: 328px; }
#block2 { position: relative; left: 430px; bottom: 445px; height: 30px; width: 330px;  }
#block3 { position: relative; left: 430px; bottom: 395px; height: 30px; width: 330px; }
#block4 { position: relative; left: 430px; bottom: 220px; height: 50px; width: 328px; }
#block5 { position: relative; left: 400px; bottom: 170px; height: 50px; width: 328px; }
#block6 { position: relative; left: 10px; bottom: 145px; height: 50px; width: 328px; }
#block7 { position: relative; left: 10px; bottom: 595px; height: 50px; width: 328px; }
#block8 { position: relative; left: 430px; bottom: 500px; height: 30px; width: 330px;  }
#block9 { position: relative; left: 430px; bottom: 475px; height: 30px; width: 330px; }
#block10 { position: relative; left: 430px; bottom: 315px; height: 50px; width: 328px; }
#block12 { position: relative; left: 410px; bottom: 275px; height: 50px; width: 328px; }
#block13 { position: relative; left: 10px; bottom: 235px; height: 50px; width: 328px; }
#block14 { position: relative; left: 10px; bottom: 450px; height: 50px; width: 328px; }
#block15 { position: relative; left: 430px; bottom: 425px; height: 30px; width: 330px;  }
#block16 { position: relative; left: 430px; bottom: 390px; height: 30px; width: 330px; }
#block17 { position: relative; left: 430px; bottom: 350px; height: 50px; width: 328px; }
#block18 { position: relative; left: 430px; bottom: 260px; height: 50px; width: 328px; }
#block19 { position: relative; left: 430px; bottom: 190px; height: 50px; width: 328px; }

/*Span Styles*/
.highlights { color: #333399; }
.bold { font-weight: bold; }
.caption { font-style: italic; font-size: 12px; color: #999; }
.h2 { font-size:16px; color: #666; font-weight: bold; }

/*Links Styles*/
/*standard links*/
a:link { color: #36F; text-decoration: none; }
a:visited { text-decoration: none; color: #36F; }
a:hover { color: #CCC; text-decoration: underline; background-color: #36F; }
/*webmail link*/
a.webmail_link:link { color: #FFF; text-decoration: none; }
a.webmail_link:visited { color: #FFF; text-decoration: none;  }
a.webmail_link:hover { color: #666; background-color: #222 ;}

/*Staff Tabs*/
ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 32px; border-bottom: 1px solid #999; border-left: 1px solid #999; width: 800px;;}
ul.tabs li { float: left; margin: 0; padding: 0; height: 31px; line-height: 31px; border: 1px solid #999; border-left: none; margin-bottom: -1px; overflow: hidden; position: relative; }
ul.tabs li a { text-decoration: none; color: #000; display: block;font-size: 1.2em; padding: 0 20px; border: 1px solid #fff; outline: none; }
ul.tabs li a:hover { background: #ccc; }	
html ul.tabs li.active, html ul.tabs li.active a:hover  { background: #fff; border-bottom: 1px solid #fff; }
.tab_container {
	border: 1px solid #999;
	border-top: none;
	clear: both;
	float: left; 
	width: 600px;
	background: #fff;
	margin: 0px auto;
}
.tab_content { padding: 0px; float: left;}