@charset "UTF-8";
/* CSS Document */

/*DAN COLLISON WEB DESIGN*/

/*RESETS*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, input, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
{border:none; outline:none; padding:0; margin:0;}

.clear {clear:both;}
a {text-decoration:none; color:#99ccff; -webkit-transition:color .25s ease-in; -moz-transition:color .25s ease-in; -o-transition:color .25s ease-in; transition:color .25s ease-in;}
a:hover {text-decoration:none; color:#C7E2FD;}

/*TEXT AND FONTS*/
h1 {font-weight:bold; font-style:italic;}
h2 {color:#99ccff;}
h4 {font-weight:bold; font-style:italic; font-size:1.6em;}
h5 {color:#99ccff; font-size:1.2em;}
h6 {color:#99ccff; font-size:1.2em; font-weight:normal;}
h6.title {display:none;}

p.main-text {font-size:1.1em;}
p.testim {font-style:italic; color:#C7E2FD;}
span.details {font-size:.8em;}

/*CSS LINKS*/
a.logo {display:block; text-indent:-9999em; overflow:hidden; width:290px; height:120px; background:url(../images/site-layout/logo.png) no-repeat;}

h3 a {display:block; text-indent:-9999em; position:relative; overflow:hidden;}

h3 a.latest1, h3 a.latest1:hover {background:url(../images/site-layout/latest-link.png); margin:-20px 0 0 130px; width:150px; height:50px;}
h3 a.latest1 {background-position:top;}
h3 a.latest1:hover {background-position:bottom;}

h3 a.coming1, h3 a.coming1:hover {background:url(../images/site-layout/coming-link.png); margin:-20px 0 0 120px; width:160px; height:50px;}
h3 a.coming1 {background-position:top;}
h3 a.coming1:hover {background-position:bottom;}

h3 a.featured1, h3 a.featured1:hover {background:url(../images/site-layout/featured-link.png); margin:-20px 0 0 110px; width:170px; height:50px;}
h3 a.featured1 {background-position:top;}
h3 a.featured1:hover {background-position:bottom;}

h3 a.early1, h3 a.early1:hover {background:url(../images/site-layout/early-link.png); margin:-20px 0 0 140px; width:140px; height:50px;}
h3 a.early1 {background-position:top;}
h3 a.early1:hover {background-position:bottom;}

h3 a.sneak1, h3 a.sneak1:hover {background:url(../images/site-layout/sneak-link.png); margin:-20px 0 0 110px; width:170px; height:50px;}
h3 a.sneak1 {background-position:top;}
h3 a.sneak1:hover {background-position:bottom;}

/*MAIN LAYOUT*/
body {background:#036 url(../images/site-layout/body-x2.png) repeat-x; color:#FFF; font-family:Arial, Helvetica, sans-serif; line-height:20px;}
.body-home {background:#036 url(../images/site-layout/body-x.png) repeat-x;}
#outter-wrapper {width:960px; margin:0 auto; font-size:.8em;}
#header-wrapper {width:940px; height:130px; margin:0 10px; padding-top:10px; background:url(../images/site-layout/header-bg.png) no-repeat; float:left;}
#logo-wrapper {width:480px; float:left;}
#signup {width:460px; float:left; margin:48px 0 0 0;}
#main-nav {width:940px; height:50px; margin:0 10px; background:url(../images/site-layout/nav-bg.png) no-repeat right; float:left; overflow:hidden;}
#content-wrapper {width:960px; float:left;}
#footer-wrapper {width:940px; height:240px; margin:0 auto; padding-top:30px; background:url(../images/site-layout/footer-bg.png) no-repeat; float:left;}

/*MAIN NAV*/
#main-nav li {display:inline;}
#main-nav li a {display:block; height:50px; float:left; text-indent:-9999em;}

#main-nav li a.nav1, #main-nav li a.nav1:hover, #main-nav li a.sel1 {width:120px; background:url(../images/nav/nav1.png);}
#main-nav li a.nav2, #main-nav li a.nav2:hover, #main-nav li a.sel2 {width:160px; background:url(../images/nav/nav2.png);}
#main-nav li a.nav3,#main-nav li a.nav3:hover, #main-nav li a.sel3 {width:170px; background:url(../images/nav/nav3.png);}
#main-nav li a.nav4, #main-nav li a.nav4:hover, #main-nav li a.sel4 {width:170px; background:url(../images/nav/nav4.png);}
#main-nav li a.nav5, #main-nav li a.nav5:hover, #main-nav li a.sel5 {width:160px; background:url(../images/nav/nav5.png);}
#main-nav li a.nav6, #main-nav li a.nav6:hover, #main-nav li a.sel6 {width:160px; background:url(../images/nav/nav6.png);}

#main-nav li a.nav1, #main-nav li a.nav2, #main-nav li a.nav3, #main-nav li a.nav4, #main-nav li a.nav5, #main-nav li a.nav6 {background-position:top;}

#main-nav li a.nav1:hover, #main-nav li a.sel1, #main-nav li a.nav2:hover, #main-nav li a.sel2, #main-nav li a.nav3:hover, #main-nav li a.sel3, #main-nav li a.nav4:hover, #main-nav li a.sel4, #main-nav li a.nav5:hover, #main-nav li a.sel5, #main-nav li a.nav6:hover, #main-nav li a.sel6 {background-position:bottom;}

/*Signup Form*/
.signup-field {border:#396ea4 solid 1px; background:none; width:208px; height:16px; float:left; margin:0 0 0 10px; padding:6px 5px; color:#f1f1f1; font-size:.9em;}
.signup-btn {border:none; float:right; margin:-30px 0 0 0;}
.join {text-align:right; margin:0 0 5px 0;}

/*logos*/
#logos {width:960px; height:70px; overflow:hidden;}
#logos li {display:inline; float:left;}
#logos li a {display:block; text-indent:-9999em;}

#logos li a.w3schools {width:114px; height:27px; margin:20px 0 0 160px; background:url(../images/logos/w3schools.png);}
#logos li a.w3c {width:80px; height:42px; margin:12px 0 0 30px; background:url(../images/logos/w3c.png);}
#logos li a.apple {width:45px; height:56px; margin:0 0 0 32px; background:url(../images/logos/apple.png);}
#logos li a.adobe {width:46px; height:63px; margin:2px 0 0 32px; background:url(../images/logos/adobe.png);}
#logos li a.chrome {width:55px; height:51px; margin:7px 0 0 33px; background:url(../images/logos/chrome.png);}
#logos li a.teesside {width:131px; height:40px; margin:13px 0 0 32px; background:url(../images/logos/teesside.png);}

#logos li a.w3schools, #logos li a.w3c, #logos li a.apple, #logos li a.adobe, #logos li a.chrome, #logos li a.teesside {opacity:.6; -webkit-transition:opacity .25s ease-in; -moz-transition:opacity .25s ease-in; -o-transition:opacity .25s ease-in; transition:opacity .25s ease-in;}
#logos li a.w3schools:hover, #logos li a.w3c:hover, #logos li a.apple:hover, #logos li a.adobe:hover, #logos li a.chrome:hover, #logos li a.teesside:hover {opacity:1;}

/*footer*/
#footer-wrapper a {color:#FFF;}
#footer-wrapper a:hover {color:#99ccff;}
#footer-nav {margin:25px 0 0 10px; float:left;}
#footer-nav li {display:inline; margin-left:15px;}
#copy {margin:25px 10px 0 0; float:right; text-align:right;}

/*HOME LAYOUT*/
#home-text {width:290px; margin:10px; padding-top:30px; float:left;}
#cv {height:50px; margin-top:60px;}
#pdf {width:42px; height:42px; background:url(../images/site-layout/PDFicon.png) no-repeat; float:right; margin:-62px 30px 0 0;}
#home-cycle {width:600px; height:420px; margin:20px 0 10px 20px; padding:10px; position:relative; float:left; background:url(../images/site-layout/flash-bg.png) no-repeat;}
#teaser-wrapper {width:960px; margin:10px 0 30px 0; float:left;}
.teaser {width:280px; height:130px; margin:10px; padding:10px; float:left; background:url(../images/site-layout/teaser-bg.png) no-repeat; position:relative;}

.hi {margin-top:10px;}
.qual {margin-top:20px;}
.home1 {margin-top:10px;}

/*PORTFOLIO LAYOUT*/
.blue-wrapper, .blue-wrapper2 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg.png) repeat-x; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
.black-wrapper {width:960px; margin:10px 0; float:left; background:#112e4b url(../images/site-layout/port-bg-2.png) repeat-x; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
.v3 {background:url(../images/site-layout/v3.png) no-repeat 10px bottom;}
.yell1 {background:url(../images/site-layout/yell.png) no-repeat 20px bottom;}
.yell2 {background:url(../images/site-layout/yell.png) no-repeat right bottom;}
.blue-wrapper li {list-style-type:none;}
.blue-wrapper ul {margin-bottom:10px;}
.blue-wrapper2 {margin:20px 0;}

/*executive-grapevine*/
.blue-wrapper3 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg3.png) no-repeat; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
/*manatee*/
.blue-wrapper4 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg4.png) no-repeat; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
/*lakeland-motor-musuem*/
.blue-wrapper5 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg5.png) no-repeat; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
/*lizzie-curwen*/
.blue-wrapper6 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg6.png) no-repeat; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
/*mjbo*/
.blue-wrapper7 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg7.png) no-repeat; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
/*kim-lawther*/
.blue-wrapper8 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg8.png) no-repeat; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
/*chris-cook-magic*/
.blue-wrapper9 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg9.png) no-repeat; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}
/*grant-and-cameron*/
.blue-wrapper10 {width:960px; margin:10px 0; float:left; background:#1a4876 url(../images/site-layout/port-bg10.png) no-repeat; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; -khtml-border-radius:10px;}

.port-img1 {width:440px; height:308px; margin:10px; padding:10px; float:left; background:url(../images/site-layout/port-img-bg.png) no-repeat;}
.port-img1 a img {opacity:1; -webkit-transition:opacity .25s ease-in; -moz-transition:opacity .25s ease-in; -o-transition:opacity .25s ease-in; transition:opacity .25s ease-in;}
.port-img1 a img:hover {opacity:.35;}
.port-img2 {width:440px; height:308px; margin:10px; padding:10px; float:left; background:url(../images/site-layout/port-img-bg-2.png) no-repeat;}
.port-text1 {width:450px; margin:10px; float:left;}
.port-text2 {width:450px; margin:10px; padding-left:10px; float:left; text-align:right;}
#totop {text-align:center; padding:10px;}

.tech-box {margin:10px 0 0 0;}
.tech-box img {margin:0 0 0 5px;}

/*STANDARDS LAYOUT*/
#stan-left {width:260px; margin:10px; float:left; padding:20px 10px 20px 20px;}
#stan-right {width:620px; margin:10px; float:left;}
#home-flash2 {width:600px; height:411px; margin:20px 10px 10px 10px; padding:10px; position:relative; float:left; background:url(../images/site-layout/flash-bg2.png) no-repeat;}
.line1 {border-bottom:#16426e dashed 1px; margin:-5px 0 15px 0;}

/*WORKFLOW LAYOUT*/
.flow-left {width:435px; margin:20px 15px 0 30px; padding-bottom:20px; float:left;}
.flow-right {width:435px; margin:20px 30px 0 15px; padding-bottom:20px; float:left;}
.flow-big {text-align:center; margin:20px 0;}
.flow-sen {text-align:center; margin:0 auto 20px auto; width:880px;}

/*ABOUT ME LAYOUT*/
.about-left {width:290px; margin:10px; float:left;}
.about-mid {width:310px; margin:10px; padding-top:20px; float:left;}
.about-right {width:300px; margin:10px; padding-top:20px; float:left;}
.about-image1 {margin:-30px 0 0 -30px; position:relative; float:left;}

/*CONTACT LAYOUT*/
#form-wrapper {width:280px; margin:10px; float:left; padding:20px 0 0 20px;}
.form-field1 {width:240px; height:20px; padding:10px; background:url(../images/site-layout/form-field-bg.png) no-repeat; border:0; margin-bottom:20px; color:#FFF; font-size:1.05em;}
.form-field2 {width:240px; height:70px; padding:10px; background:#c6d1dd; border:0; margin-bottom:20px; color:#FFF; font-size:1.05em; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; font-family:Arial, Helvetica, sans-serif;}
.form-field1:focus, .form-field2:focus {color:#333;}
.form-btn {width:270px; height:50px; background:none; border:none; margin-left:-5px;}

#social-wrapper {width:300px; margin:10px; float:left; padding-top:20px;}
#soc-box {width:300px; padding:20px 0 13px 0; margin-bottom:20px; background:#c6d1dd; text-align:center; -moz-border-radius:5px; -webkit-border-radius:5px;  border-radius:5px;}
#soc-box img {margin-bottom:20px; opacity:1; -webkit-transition:opacity .25s ease-in; -moz-transition:opacity .25s ease-in; -o-transition:opacity .25s ease-in; transition:opacity .25s ease-in;}
#soc-box img:hover {opacity:.8;}

#working {width:280px; margin:20px; float:left; padding-top:10px;}

/*FORM VALIDATION*/
/*input, select {border:1px solid #888; background:#fff; padding:3px 4px; color:#222; margin:0px 5px 0px 0px; border-radius:7px; -moz-border-radius:7px;}*/
input:focus, select:focus {outline:none;}
.InputGroup {display:inline-block; padding:3px 4px; border:1px solid #FFF; border-radius:7px; -moz-border-radius:7px;}
.ErrorField {color:#D00;}
span.ValidationErrors {display:none; font-size:12px; color:#D00; padding-left:10px; font-style:italic; width:200px; height:30px;}

/*THANKS LAYOUT*/
a.logo2 {display:block; text-indent:-9999em; width:330px; height:100px; margin:0 auto; background:url(../images/site-layout/logo.png) no-repeat;}
#results {margin-top:80px; text-align:center;}

/*WJ-LINK*/
.outlink {width:100px; height:200px; background:#ccc; float:right; margin:250px 0 0 0; -webkit-transition:background .25s ease-in; -moz-transition:background .25s ease-in; -o-transition:background .25s ease-in; transition:background .25s ease-in; -moz-box-shadow: 0px 0px 10px #333; -webkit-box-shadow: 0px 0px 10px #333; box-shadow:  0px 0px 10px #333;}
.outlink:hover {background:#fff;}
a.wj-link {text-indent:-9999em; overflow:hidden; display:block; width:100px; height:200px; background:url(../images/site-layout/wj-link.png) no-repeat;}