@import "css/reset.css";

/*MAIN CSS*/

body{background:#666;}

.clear{clear:both;}

li.clear{clear:both;float:none;display:none;}

.hide{display:none;}

/*HEADER CSS*/

#header{position:relative;top:0px;width:100%;height:79px;background:url(images/headerbg.png) repeat-x;z-index:5;}

#headerContainer{width:960px;height:79px;margin:0 auto;}

#logo{position:relative;float:left;width:283px;height:55px;padding:5px 0px 0px 0px;}

/*NAVIGATION CSS*/
#navigation{float:right;width:auto;font-family:"Arial Narrow", Arial, Helvetica, sans-serif;padding:18px 0px 0px 0px;position:relative;z-index:999999;}

#nav{position:relative;list-style: none;}

#nav li{float:left;position:relative;margin:0;padding:0;}

#nav li a{width:auto;height:25px;display:block;padding:10px;font-size:1.47em;color:#666;text-decoration:none;background:none;border-top:solid 1px #666;}

#nav li:hover a{color:#008bc3;background:url(images/topnav_hoverbg.jpg) repeat-x;border-top:solid 1px #ccc;}

#nav li.current a{background:url(images/topnav_hoverbg.jpg) repeat-x;color:#008bc3;border-top:solid 1px #ccc;}/*if on page*/

#nav li.current:hover a{background:url(images/topnav_hoverbg.jpg) repeat-x;color:#008bc3;border-top:solid 1px #ccc;}/*if on page*/

/*lower navigation css*/
#nav li .sub{display:none;top:46px;position:absolute;float:left;left:-8px;z-index:99;background:url(images/subnavbg.png);width:158px;}

#nav li .sub ul.secNav{background: url(images/headerbg.png) repeat-x 0px -64px;width:132px;border-bottom:solid 1px #ccc;margin-left:8px;position:absolute;z-index:5;padding:8px 0px 0px 0px;}

#nav .sub ul.subNav li{float:none;position:absolute;z-index:5;}

#nav .sub ul.secNav li:first-child a{border-top:none;}

#nav .sub ul.secNav li a{display:block;height:20px;font-size:1em;background:none;padding:5px 0px;width:132px;border-top:none;border-bottom:solid 1px #666;border-top:solid 1px #ccc;text-align:center;color:#666;}

#nav li.current a ul.secNav li a{color:#666;}/*if on page*/

#nav li.current:hover a ul.seNav li a{color:#666;}/*if on page*/

#nav .sub ul.secNav li.current_sub a{background:#ccc;color:#666;}/*if on page*/

#nav .sub ul.secNav li a:hover{display:block;background:#ccc;height:20px;color:#666;}

/*SLIDER CSS*/

#slideshow{width:956px;height:300px;border:solid 2px #333;margin:0px 0px 20px 0px;font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-weight:200;}

.slideImages{position:relative;height:300px;width:956px;float:left;margin-top:-38px;}

.slideImages div{display:none;position:absolute;top:0;left:0;height:300px;}

#slide1{background:url(images/slideimg1.jpg);color:#aaa;height:300px;width:956px;}

#slide2{background:url(images/slideimg2.jpg);color:#aaa;height:300px;width:956px;}

#slide3{background:url(images/slideimg3.jpg);color:#aaa;height:300px;width:956px;}

#slide1 a, #slide2 a, #slide3 a{width:956px;height:300px;position:relative;display:block;z-index:1px;}

.slideImages div.slideInner{display:block;float:right;background:url(images/slideInnerbg.png) repeat-x;position:relative;height:20px;width:250px;text-align:center;top:-20px;}

span.blue1{color:#4d8ac0;}

span.blue{color:#4d8ac0;font-size:1.2em;}

#slidecontleft{position:relative;z-index:3;float:left;width:38px;height:38px;left:-20px;top:133px;}

#slidecontright{position:relative;z-index:3;float:right;width:38px;height:38px;right:-20px;top:133px;}

.slideNav{display:none;}

a.backward{display:block;width:38px;height:38px;background:url(images/prev.png);cursor:pointer;text-indent:-9999em;}

a.forward{display:block;width:38px;height:38px;background:url(images/next.png);cursor:pointer;text-indent:-9999em;}

/*MAIN BODY CSS*/

#bodyContainer{width:960px;height:100%;margin:0px auto 40px auto;z-index:1;padding-bottom:10px;}

.homeContentBody{margin:35px auto 60px auto;}

.bottomBorder{border-bottom:solid 3px #333;}

#mainTitle{font-size:3.7em;color:#999;font-family:Arial, Helvetica, sans-serif;font-weight:bold;padding:5px 0px;border-top:solid 3px #333;border-bottom:solid 3px #333;text-align:center;}

#mainTitle.portHeader{border-bottom:solid 1px #333;}

#bodyleft{float:left;width:475px;height:475px;background:url(images/aboutrightbg.jpg);margin-top:10px;}

#bodyright{float:right;width:484px;}

#bodyleft p, #bodyright p{font-size:.83em;color:#aaa;line-height:2;font-family:Arial, Helvetica, sans-serif;padding:10px 0px;}

/*ABOUT CSS*/

#bodyleft #bodyleftInner{border-top:3px solid #333;border-bottom:3px solid #333;margin:108px 100px 0px 100px; padding:5px 0px;width:276px;}

#bodyleft #bodyleftInner p{font-size:.73em;padding:5px 0px;}

#bodyleft a:link, #bodyleft a:visited{color:#333;text-decoration:none;}

#bodyleft a:hover, #bodyleft a:active{color:#4d8ac0;text-decoration:none;}

#bodyright h3{font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-size:1.4em;margin-top:20px;text-transform:uppercase;border-bottom:solid 2px #333;color:#333;}

ul.techxp{padding:10px 0px 0px 18px;}

ul.techxp li{list-style-image:url(images/bullet2.png);color:#aaa;float:left;text-transform:uppercase;font-size:.83em;font-family:Arial, Helvetica, sans-serif;width:155px;height:40px;vertical-align:middle;text-indent:-6px;font-weight:bold;}

/*PORTFOLIO CSS*/

#portContentLeft{width:425px;float:left;padding:10px;height:160px;}

#portContentRight{width:460px;float:right;padding:10px;height:160px;}

#portContentLeft p, #portContentRight p{font-family:Arial, Helvetica, sans-serif;color:#ccc;font-size:.83em;line-height:1.5;padding:13px 0;position:relative;}

#portContentRight h3, #portContentLeft h3{font-family:Arial, Helvetica, sans-serif;font-size:1.4em;color:#333;text-align:center;border-bottom:solid 1px #333;}

#portContentLeft img.upanddown{float:left;margin-left:75px;padding-top:7px;}

#portContentLeft img.allarrowkeys{margin-left:30px;padding-top:13px;}

#portContentLeft p{float:right;padding:29px 5px;width:200px;margin-right:45px;line-height:1.4;}

#portContentLeft p.allarrowsP{margin-right:30px;padding-top:13px;}

#portfolioOverlaytop{position:relative;z-index:4;height:9px;width:960px;background:url(images/portfoliooverlaytop.png) repeat-x;border-top:solid 1px #333;}

#portfolioOverlayBottom{position:relative;z-index:4;height:9px;width:960px;background:url(images/portfoliooverlaybottom.png) repeat-x;margin-top:-9px;}

#portNavigation{width:230px;height:440px;float:left;position:relative;z-index:4;margin:-9px 0px 0px 20px;font-size:.83em;font-weight:bold;font-family:"Arial Narrow", Arial, Helvetica, sans-serif;border-right:solid 1px #333;}

.alignMid{margin-top:98px;}

#portNav li{margin:10px 0px;padding:5px 5px 8px;background:#333;color:#ccc;cursor:pointer;width:200px;}

#portNav li:hover{width:215px;background:#ccc;color:#666;}

#portNav li.active{width:215px;background:#ccc;color:#666;}

#portPanelsHolder{float:right;width:700px;height:441px;position:relative;margin-top:-9px;overflow:hidden;z-index:1;}

#portPanels{position:absolute;height:20000em;}

.panel{height:441px;width:700px;padding:70px 0px 0px 15px;}

.panelScrollable{position:relative;overflow:hidden;width:615px;height:302px;float:left;margin:1px 0px 0px 6px;top:-6px;z-index:2;}

.panelScrollablePrint{position:relative;overflow:hidden;width:615px;height:302px;float:left;margin:6px 0px 0px 6px;z-index:2;}

.infoHolder{width:615px;height:302px;margin:6px 0px 0px 6px;position:relative;z-index:8;float:left;overflow:hidden;top:-314px;}

.panelBg{width:627px;height:302px;background:url(images/panelbg.png) no-repeat;z-index:1;float:left;z-index:1;position:relative;}

.info{width:615px;height:250px;background:#292929;position:relative;z-index:8;float:left;margin-top:20px;}

.panelScrollablePrint .panelItems, .panelScrollable .panelItems {width:20000em;position:absolute;clear:both;}

.panelItem{float:left;cursor:pointer;width:615px;height:290px;z-index:2;}

.panelScrollablePrint .panelItems .panelItem{cursor:auto;}

.panelNavigation{float:right;width:62px;height:232px;background:url(images/portslideNav.png);position:relative;left:-25px;top:36px;}

a.infoToggle{margin-left:10px;cursor:pointer;width:38px;height:17px;display:block;text-transform:uppercase;font-family:Arial, Helvetica, sans-serif;font-size:.83em;text-align:center;vertical-align:bottom;padding-top:38px;margin:50px 13px 13px;}

a.infoToggle.webIcons{margin:20px 13px 13px 13px;}

a.infoToggle.infoopen{background:url(images/icons/infoicon.png) no-repeat -41px 0;color:#aaa;}

a.infoToggle.infoclosed{background:url(images/icons/infoicon.png) no-repeat 0 0;color:#666;}

a.infoToggle.infoclosed:hover{background:url(images/icons/infoicon.png) no-repeat -41px 0;color:#aaa;}

a.launch{margin-left:10px;cursor:pointer;width:38px;height:17px;display:block;text-transform:uppercase;font-family:Arial, Helvetica, sans-serif;font-size:.83em;text-align:center;vertical-align:bottom;padding-top:38px;margin:13px;background:url(images/icons/newwindow.png) no-repeat 0 0;color:#666;text-decoration:none;}

a.launch:hover{background:url(images/icons/newwindow.png) no-repeat -41px 0;color:#aaa;text-decoration:none;}

a.open{margin-left:10px;cursor:pointer;width:38px;height:17px;display:block;text-transform:uppercase;font-family:Arial, Helvetica, sans-serif;font-size:.83em;text-align:center;vertical-align:bottom;padding-top:38px;margin:13px;background:url(images/icons/newwindow.png) no-repeat 0 0;color:#666;text-decoration:none;}

a.open:hover{background:url(images/icons/newwindow.png) no-repeat -41px 0;color:#aaa;text-decoration:none;}

.innerPanelNav{cursor:pointer;z-index:3;position:relative;top:-24px;width:100px;margin:0 auto;}

.innerPanelNav a{width:10px;height:10px;background:#333;position:relative;float:left;z-index:8;margin:0px 10px;border-top:solid 1px #222;}

.innerPanelNav a.active{background:#aaa;}

/*info content css for portfolio*/

.info h3{text-align:center;color:#008bc3;font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-weight:bold;font-size:1.5em;border-bottom:solid 1px #666;}

.info p span.portTitle{font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-size:1.4em;color:#008bc3;}

.info p{padding:10px 20px;font-family:Arial, Helvetica, sans-serif;font-size:.83em;color:#999;}

.info p.topP{border-top:solid 1px #666;}

.info p.programs{float:left;width:120px;}

.programsUsed{width:575px;height:41px;}

.programsUsed img{float:left;padding:0px 3px;}

/*HOME CONTENT CSS*/

.homeContentTitle{font-size:1.2em;font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-weight:bold;text-transform:uppercase;color:#333;border-bottom:solid 1px #333;padding:5px 0;text-align:center;}

h3.secHeader{font-size:1.5em;font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-weight:bold;text-transform:uppercase;color:#333;margin:10px 0px;}

#webDev p, #printDev p, #photoDev p{font-size:.83em;font-family:Arial, Helvetica, sans-serif;color:#ccc;padding:5px 0;border-bottom:solid 1px #333;}

#webDev{width:278px;float:left;}

#printDev{width:278px;float:left;margin-left:60px;}

#photoDev{width:278px;float:right;}

/*PHOTOGRAPHY PAGE CSS*/

#slideUpMenu{width:100%;height:213px;background:url(images/slideupmenubg.png) repeat-x;position:fixed;bottom:0px;z-index:8;display:block;margin:0px 0px -24px 0px;left:0px;right:0px;}

#thumbnailHolder{ width:916px;height:96px;z-index:3;padding:20px 5px;margin:0 auto;overflow:hidden;position:relative;}

#slideNavTrigger{width:100%;height:75px;position:fixed;bottom:172px;margin:0 auto;z-index:9;}

.triggerBg{margin:0 auto;background:url(images/slidenavtriggerbg.png) no-repeat;width:75px;height:75px;cursor:pointer;}

.sign{width:28px;height:27px;position:relative;}

.opened{width:28px;height:9px;position:relative;left:19px;top:28px;background:url(images/minus.png) center;}

.closed{width:28px;height:27px;position:relative;left:19px;top:19px;background:url(images/plus.png);}

/*inner items*/

.scrollable{width:840px;height:98px;position:relative;overflow:hidden;float:left;}

.scrollable .items {width:20000em;position:absolute;clear:both;}

.scrollable .items > div {float:left;width:900px;}

.thumbnail{height:96px;width:128px;background:#000;float:left;margin:0px 5px;cursor:pointer;border:solid 1px #333;}

.thumbnail:hover{border:solid 1px #ccc;}

.activeImg{border:solid 1px #ccc;}

.thumbnail img{height:96px;width:128px;}

.browse{float:left;width:38px;height:38px;display:block;cursor:pointer;text-indent:-9999em;margin-top:30px;}

a.prev{background:url(images/prev.png);}

a.next{background:url(images/next.png);}

a.disabled{visibility:hidden;}

/*CONTACT FORM CSS*/

h1.contactTitle{margin-bottom:10px;}

#sidebar{width:300px;padding-right:10px;position:relative;float:left;border-right:solid 1px #333;}

#sidebar #networkIcons{width:100%;height:25px;padding:5px;border-bottom:dotted 1px #333;}

#sidebar h2 {font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-size:1.2em;padding:5px 0px;text-transform:uppercase;}

#sidebar h2 a:link, #sidebar h2 a:visited{color:#aaa;text-decoration:none;}

#sidebar h2 a:hover, #sidebar h2 a:active{color:#333;text-decoration:none;}

#sidebar h3{font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-size:1.5em;color:#333;text-transform:uppercase;}

#sidebar li{padding:5px 0px;border-bottom:dotted #333 1px;}

#sidebar li:last-child{border-bottom:none;}

#sidebar li a{font-size:.83em;font-family:Arial, Helvetica, sans-serif;}

#sidebar li a:link, #sidebar li a:visited{color:#aaa;text-decoration:none;}

#sidebar li a:hover, #sidebar li a:active{color:#333;text-decoration:none;}

#contactcenter{width:300px;float:left;position:relative;margin-left:15px;font-family:"Arial Narrow", Arial, Helvetica, sans-serif;}

#contactcenter h3.centerTitle{font-family:"Arial Narrow", Arial, Helvetica, sans-serif;font-size:1.3em;color:#333;text-transform:uppercase;padding-top:0px;}

#contactcenter a:link, #contactcenter a:visited{text-decoration:none;color:#333;}

#contactcenter a:hover, #contactcenter a:active{text-decoration:underline;color:#333;}

#contactcenter p{font-size:.83em;color:#aaa;}

#contactcenter h3{font-size:1.1em;color:#333;padding:10px 0px 0px 0px;}

#contactcenter #email, #contactcenter #name{background:#aaa;border:solid 1px #333;padding:5px;width:290px;color:#333;}

#contactcenter #email.error, #contactcenter #name.error, #contactcenter #subject.error{border:solid 1px #900;display:block;}

#contactcenter #subject{background:#aaa;padding:5px;width:177px;border:solid 1px #333;color:#333;}

#contactcenter #submit{width:65px;height:25px;postion:relative;margin:10px auto;text-transform:uppercase;}

#sendMail.disabled{display:none;}

#contactcenter textarea{width:290px;height:140px;background:#aaa;border:solid 1px #333;color:#333;padding:5px;}

#contactcenter div.error{color:#900;text-transform:uppercase;float:none;width:300px;display:none;font-size:.73em;padding-top:4px;}

#contactcenter #valid{color:#008bc3;font-family:Arial, Helvetica, sans-serif;text-align:center;text-transform:uppercase;font-weight:bold;font-size:.73em;margin-top:10px;display:none;background:#333;border:solid 1px #999;padding:3px 0px;}

#contactright{width:300px;float:right;}

.req{color:#900;}

/*SUPERSIZE CSS*/

#supersize{position:fixed;}

#supersize img, #supersize a {height:100%;width:100%;position:absolute;z-index: 0;}

/*FOOTER CSS*/

#footer{width:100%;height:54px;position:fixed;bottom:0;background:url(images/footerbg.png) repeat-x;font-family:Arial, Helvetica, sans-serif;z-index:10;}

#footerContainer{position:relative;width:443px;margin:18px auto 0px auto;}

#leftParen{width:16px;height:35px;background:url(images/leftparen.png);float:left;position:relative;}

#footerContent{float:left;font-size:.83em;color:#666;width:410px;padding-top:8px;text-transform:uppercase;}

#footerContent p{text-align:center;}

#footerContent a:link, #footerContent a:visited{color:#666;text-decoration:none;}

#footerContent a:hover, #footerContent a:active{color:#666;text-decoration:overline;}

#rightParen{width:17px;height:35px;background:url(images/rightparen.png);float:right;position:relative;}

.footerParen{font-size:3em;color:#6c6d6e;font-weight:900;}