@charset "utf-8"; 
/*Reset*/
html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, font, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td{margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent}
body{line-height:1}
ol, ul{list-style:none}
blockquote, q{quotes:none}
blockquote:before, blockquote:after, 
q:before, q:after{content:''; content:none}

/* remember to define focus styles! */
:focus{outline:0}

/* remember to highlight inserts somehow! */
ins{text-decoration:none}
del{text-decoration:line-through}

/* tables still need 'cellspacing="0"' in the markup */
table{border-collapse:collapse; border-spacing:0}
/***********Body*************/
a:hover{color:#9CF}
body{ font-family:Georgia,"Times New Roman",Times,serif; scrollbar-3dlight-color:; scrollbar-arrow-color:; scrollbar-DarkShadow-Color:; scrollbar-Face-Color:; scrollbar-Highlight-Color:; scrollbar-Shadow-Color:; scrollbar-Track-Color:none}
.wrapper{margin:0 auto; padding:0; width:982px; position:relative}

/*********Header***********/
#header{width:100%; position:relative; height:150px}
#logo{position:relative; float:left; padding-left:3em; background-image:url(../images/logo.jpg); width:216px; height:135px; background-repeat:no-repeat}
/***********Navigation**********/
#topnav{height:60px; margin:0 auto; position:relative; width:100%; z-index:1000; padding-left:6em}
#nav{float:left; position:absolute; width:100%; z-index:1000}
#nav ul{line-height:1; margin:0; padding:0; position:relative}
li.headlink ul{display:none}
li.headlink:hover ul{display:block}
#nav ul li{float:left; list-style-image:none; list-style-position:outside; list-style-type:none; position:relative}
#nav li{border-left:1 px solid #666; padding:0}
#nav ul li a{color:#031725; display:block; font-size:2em; height:60px; padding:0 16px; text-decoration:none}
#nav ul li a:hover{ color:#666; position:relative}
#nav li.current{ color:#666}
#nav li.current a{color:#666}
#nav ul li:hover ul{display:block; position:absolute}

#nav ul li:hover ul li a{display:block; color:#031725; text-align:center; border-right:none; font-size:1em; height:15px}
#nav ul li:hover ul li a:hover{background-repeat:repeat-x; color:#666; font-size:1em; height:15px}
#botnav{height:10px; margin:0 auto; position:relative; width:70%; z-index:1000; padding-left:6em; top:4em}
#subnav{float:left; position:absolute; width:100%; z-index:1000}
#subnav ul{line-height:1; margin:0; padding:0; position:relative}
#subnav ul li{float:left; list-style-image:none; list-style-position:outside; list-style-type:none; position:relative}
#subnav li{border-left:1 px solid #666; padding:0}
#subnav ul li a{color:#031725; display:block; font-size:.8em; height:10px; padding:0 16px; text-decoration:none}
#subnav ul li a:hover{ color:#666; position:relative}
#subnav li.current{ color:#666}
#subnav li.current a{color:#666}
/************Main Area************/
#mainarea{width:100%; background-image:url(../images/back2.jpg); height:650px; color:#fff; background-repeat:repeat-x}
#mainarea h1{color:#0bdcde; text-align:center; font-size:1.5em}
#textarea{width:37%; height:100%; position:relative; float:left; background:rgba(3,23,37,.6); font-size:.96em; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; padding-top:.5em;top:.5em;}
#bioarea{width:65%; height:100%; position:relative; float:left; background:rgba(3,23,37,.6); font-size:.96em; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; padding-top:.5em;top:.5em}
#photo{width:60%; height:100%; position:relative; float:right;top:1.5em}
#bio{width:33%; height:100%; position:relative; float:right;top:.5em}
.padding{padding-left:1em}
#portlinks{ /*****Gallery Area******/width:15%; height:100%; position:relative; float:left; background:rgba(255,255,255,.6); font-size:.96em; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; padding-top:.5em; padding-bottom:.5em}
#portlinks a:hover{color:#0FF}
#gallery{position:relative; width:100%; padding:5px; float:left; height:590px}
div.nomargin{/* our special nomargin class */margin-right:0px}

.pic{/* divs that hold all the pictures in the gallery */float:left; margin:0 15px 15px 0; border:5px solid white; width:200px; height:250px}

.pic a{/* in every .pic container there is a hyperlink exactly the size of the container */width:200px; height:250px; text-indent:-99999px; display:block; /* don't forget that widths and heights of hyperlinks are useless without display:block */}
.clear{clear:both}

#flashcontent{height:100%; margin-top:70px}
#middle{ width:100%;  height:auto}
#middle h1{font-size:2.5em}
/*********Footer************/
#footer{width:100%; position:relative; float:left; color:#031725; clear:both; padding:4em 0 0}
#socialnav{width:100%; float:left; position:relative; display:block}
#proofs{width:90%; position:relative; background-color:#363333; border:5px #FFF; font-size:1.2em}
#proofs a{text-decoration:none; padding-left:1em; color:#0ff}
#proofs a:hover{color:#fff}
#bottom{width:100%; position:relative; float:left; padding-top:1em; padding-bottom:.5em; border-top:2px solid #2f2f2f}
#designhtml{position:relative; float:left; width:100%}
#designhtml a{position:relative; float:left}

.col{float:left; width:33%; padding-top:5px}
#footer h3{color:#031725; font-size:1.1em; font-weight:bold; letter-spacing:1px; margin:0 0 0; text-transform:uppercase}
.text{width:80%}
#projects{width:175px}
#projects a{border:0 none}
.sep{border-bottom:2px solid #2f2f2f; margin-bottom:20px; width:85%; padding-bottom:2em; display:block; clear:both}
#footer ul{margin:0 0 10px}
#footer ul li{line-height:2em}
.end{border-top:2px solid #2f2f2f; clear:both; display:block; line-height:1.5em; padding:18px 0 55px 0; text-transform:none; width:100%}
#news{width:90%}
#contest{width:90%}
.connect a{margin-right:8px; width:80%}
#creditfooter{display:none; visibility:hidden}