@charset "UTF-8";
/* 
AUTHOR: Chad Heaton
URL: www.Digital-Construct.com
 */
 


/* BASIC */

* { padding:0; margin:0; }

div { position:relative; }

.right { float: right; margin-left:10px; }

.left { float: left; margin: 0px 20px; }

.center { text-align:center; }

body, html { text-align:center; background: #eaeaea url(images/background.jpg) top center; color: #666666; line-height: 18px; font-size:14px; font-family: "Myriad Pro", Arial, Verdana,  Helvetica, sans-serif }




/* STRUCTURE */

body {  }

#Header { width:100%; height:150px; padding-top:15px; background:#ccc; position:fixed; top:0px; left:0; text-align:center; z-index:1000; }

#Navigation { width:100%; margin:auto; height:105px; margin-top:15px;  background: url(images/navBg.png) top center; }

#Container { margin:auto; width:100%; text-align:center; }

.content { width:800px; margin:auto; padding-top:250px; }

.break { clear:both; height:800px; width:100%; text-align:center;   }

#Footer { position:fixed; bottom:0; left:0; z-index:100; background: white; border-top: 1px solid #999999; width:100%; text-align:right; }




/* TYPOGRAPHY */

p { padding: 10px 0px; text-align:left;}

h1, h2, h3 { font-weight:bold; text-shadow:#fff 0px 1px 1px;  color:#4f4f51; margin: 5px 0; }

h1 { font-size:25px; }

h2 { font-size:25px; text-align:left; }

h3 { font-size:15px; text-align:left }

a { font-weight:bold; text-decoration:none; color:#666666; }

a:hover { color:#009bda;  }

ul { list-style: none; }

ul li { text-align:left; display:inline; }

.centered { text-align:center; }

label { text-shadow:#fff 0px 1px 1px; font-weight:bold; }

.required, .error { color: #990000; font-weight:normal; font-style: italic; }

#Footer { font-size:10px; color:#666666; }




/* NAVIGATION */

#Navigation ul { list-style:none; width:340px; margin:auto; height:75px; }

#Navigation ul li { display: inline; float:left; }

#Home { display: block; width: 85px; height: 75px; background: url(images/btnHome.png) 0 0 no-repeat;  }

#Portfolio { display: block; width: 85px; height: 75px; background: url(images/btnPortfolio.png) 0 0 no-repeat;  }

#Services { display: block; width: 85px; height: 75px; background: url(images/btnServices.png) 0 0 no-repeat;  }

#Process { display: block; width: 85px; height: 75px; background: url(images/btnProcess.png) 0 0 no-repeat;  }

#About { display: block; width: 85px; height: 75px; background: url(images/btnAbout.png) 0 0 no-repeat;  }

#Contact { display: block; width: 85px; height: 75px; background: url(images/btnContact.png) 0 0 no-repeat;  }

#Home:hover, #Portfolio:hover, #Services:hover, #About:hover, #Contact:hover, #Process:hover { background-position: 0px -75px; }

#Logo span, #Home span, #Services span, #Portfolio span, #Contact span, #About span, #Process span { display: none; }





/* FORM */

form { width: 365px;  border-left: 1px solid #ccc; padding: 0px 0px 10px 40px; margin-left:40px; text-align:left; }

label.error { width: 250px; text-align:right; display: block;  position:absolute; top:0; right:0; padding-left: 10px; } 

input, textarea {  border:0; padding:5px; margin: 5px 0;}

input, input:focus { background: url(images/inputBg.jpg) 0 0 no-repeat; width:355px; height: 25px; }

textarea, textarea:focus {  background: url(images/textareaBg.jpg) 0 0 no-repeat; width:355px; height:70px;  }

.submit, .submit:focus { color:#666; font-weight:bold; font-size:14px; margin:0; padding:0; cursor:pointer; background:none; }

.submit:hover { color: #990000;}




/* SLIDESHOW */

#sliderShadow { position:absolute; top:0; left:0; z-index:100; width:800px; height:250px; background: url(images/slideshowShadow.png) 0 0 no-repeat; }

#slider { position:relative; margin: 10px 0 50px 0; background:#ccc url(images/loading.gif) no-repeat 50% 50%; border-bottom:1px solid white; }

#slider img { position:absolute; top:0px; left:0px; display:none; height:250px; width:800px; }

#slider a { border:0; display:block; }

.nivoSlider img { position:absolute;  top:0px; left:0px; }

.nivoSlider a.nivo-imageLink { position:absolute; top:0px; left:0px; width:100%; height:100%; border:0; padding:0; margin:0; z-index:60; display:none; }

.nivo-slice { display:block; position:absolute; z-index:50; height:100%; }

.nivo-directionNav a { position:absolute; top:45%; z-index:99; cursor:pointer; }

.nivo-prevNav { left:0px; }

.nivo-nextNav { right:0px; }

.nivo-controlNav a { position:relative; z-index:99; cursor:pointer; }

.nivo-controlNav { position:absolute; left:47%; bottom:-20px; }

.nivo-controlNav a { display:block; width:10px; height:10px; background:url(images/bullets.png) no-repeat; text-indent:-9999px; border:0; margin: 0 4px; float:left; }

.nivo-controlNav a.active { background-position:-10px 0; }

.nivo-directionNav a { display:block; width:32px; height:34px; background:url(images/arrows.png) no-repeat; text-indent:-9999px; border:0; top:85px; }

a.nivo-nextNav { background-position:-32px 0; right:10px; }

a.nivo-prevNav { left:10px; }




/* PORTFOLIO */

#portfolio ul { overflow: hidden; width: 800px; text-align:center; }

#portfolio ul li { display:inline; margin: 1px 3px; }

#portfolio ul li img { border:0;  padding:0; }

#portfolio .lightbox { width:100%; height:100%; display:none; position:fixed; text-align:left; left:0; top:0; z-index:1000; padding:250px 0 0 0;  }

#portfolio .lightbox .light {width:100%; height:100%; position:fixed; z-index:-1; top:0; left:0; background: url(images/lightbox.png) repeat; text-align:center;}

/* this is for IE6 . If you want to have the lightbox scroll with the page in ALL browsers then remove the * html */
* html .lightbox {position:absolute;}

* html .lightbox .light {position:absolute; height:5000px;}

#portfolio .lightbox .box { width:800px;  min-height:300px; background: url(images/background.jpg) top center; border:10px solid #fff; margin:0 auto; padding:10px; position:relative; }

#portfolio .lightbox .box img { display:block; margin: 0 0 0 10px; padding: 0 5px 5px 0px; background: url(images/screenshotShadow.png) 0 0 no-repeat; }

#portfolio .lightbox .box p { padding: 10px; margin:0;  text-align:left; }

#portfolio .lightbox .box ul { list-style:square; margin: 0 0 20px 10px; width: 300px; }

#portfolio .lightbox .box ul li { float:none; display:block; padding:0; list-style:square;  }

#portfolio .lightbox .box a { color:#4f4f51; font-size:18px; }

#portfolio .lightbox .box a:hover { color:#009bda; }

#portfolio .lightbox .box a.closebox {display:block; width:100px; height:25px; line-height:25px; font-size:14px; text-align:right; position:absolute; bottom:0px; right:15px; }

#portfolio .lightbox .box a.closebox:hover { color: #990000;}

#p001:target, #p002:target, #p003:target, #p004:target, #p005:target, #p006:target, #p007:target, #p008:target, #p009:target, #p010:target, #p011:target  {display:block;}




/* SERVICES */

#tabbed_box {  width:800px; }

#tabbed_box .tabbed_area { padding:10px; }

#tabbed_box .tabbed_area ul { margin:auto; padding:0px; overflow: hidden; width: 600px; }

#tabbed_box .tabbed_area ul li { list-style:none; display:inline; float:left;  }

#tabbed_box .tabbed_area ul li a img { padding:0 25px; border:none; }

#tabbed_box .tabbed_area .content {	padding:10px; background: url(images/servicesBg.jpg) 0 0 no-repeat; border-bottom:1px solid #fff; }

#content_2, #content_3, #content_4, #content_5, #content_6 { display:none; }