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

/* Global reset-RESET */
/* The below restores some sensible defaults */

strong { font-weight: bold }
em { font-style: italic }
ol, ul, li { list-style:none }

* a { position:relative } /* Gets links displaying over a PNG background */
a { outline:none; } /* Gets rid of Firefox's dotted borders */
a img { border:none; text-decoration:none; } /* Gets rid of IE's blue borders */

.fl-left { float:left; }
.fl-right { float:right; }

.clr { clear:both; }

/*** Headings ***/
h1 { background:url(images/welcome.gif); width:286px; height:26px; margin:0 0 30px 0; }
h2 { margin:0; padding:0; }
h3 { margin:0 0 10px 0; padding:0; font-weight:bold; color:#FFFFFF; font-size:16px; }

body { margin:0; padding:0; background:url(images/bg.jpg) top center fixed no-repeat; background-color:#160902; } 


/*** Header ***/
#outerContainer { width:934px; margin:0 auto; }
.logo { background:url(images/logo.jpg) top left; width:213px; height:120px; float:left; display:block; border:none; }
.logo:hover { background:url(images/logo.jpg) top right; cursor:pointer; }
#topImg { background:url(images/header-top.png); height:58px; }
#headerLeft { background:url(images/header-right.png) no-repeat; width:20px; height:120px; float:left; margin:0 0 0 23px; }
#headerRight { background:url(images/header-left.png) no-repeat; width:45px; height:120px; float:left; }
#headerBottomLeft { background:url(images/header-bottom-left.png); width:20px; height:114px; display:block; float:left; margin:0 0 0 23px; }
#headerBottomRight { background:url(images/header-bottom-right.png); width:58px; height:114px; float:left; margin:-74px 0 0 0; }



/*** Navigation ***/
.work { background:url(images/work.jpg) top right; cursor:auto; display:block; width:70px; height:41px; float:left; }
#work { background:url(images/work.jpg) top left; width:70px; height:41px; float:left; }
#work:hover { background:url(images/work.jpg) top right; cursor:pointer; }
.freelance { background:url(images/freelance.jpg) top right; cursor:auto; display:block; width:108px; height:41px; float:left; }
#freelance { background:url(images/freelance.jpg) top left; width:108px; height:41px; float:left; }
#freelance:hover { background:url(images/freelance.jpg) top right; cursor:pointer; }
#blog { background:url(images/blog.jpg) top left; width:64px; height:41px; float:left; }
.blog { background:url(images/blog.jpg) top right; cursor:auto; }
#blog:hover { background:url(images/blog.jpg) top right; cursor:pointer; }
.about { background:url(images/about.jpg) top right; cursor:auto; width:104px; height:41px; display:block; float:left; }
#about { background:url(images/about.jpg) top left; width:104px; height:41px; float:left; }
#about:hover { background:url(images/about.jpg) top right; cursor:pointer; }
.contact { background:url(images/contact.jpg) top right; cursor:auto; display:block; width:134px; height:41px; float:left; }
#contact { background:url(images/contact.jpg) top left; width:134px; height:41px; float:left; }
#contact:hover { background:url(images/contact.jpg) top right; cursor:pointer; }



/*** Content ***/
#contentContainer { width:860px; margin:0 auto; }
#content { background:url(images/content-bg.png) repeat-x; font-family:Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:14px; line-height:8px; padding:1px 10px 10px 10px; }
#content p { line-height:20px; margin:5px 0 0px 0; padding:0; }
#content a { color:#FFFFFF; text-decoration:none; border-bottom:dotted 1px #FFFFFF; }
#content a:hover { color:#fd7020; border-bottom:dotted 1px #FFFFFF; }
#webDesignTitle { margin:20px 0 0 0; }
.title { font-size:17px; line-height:16px; font-weight:normal; margin:7px 0 -2px 0; padding:0 0 1px 0; display:block; }
.textContent { background:url(images/text-bg.png); color:#FFFFFF; padding:25px; margin:0 0 40px 0; font-family:Arial, Helvetica, sans-serif; line-height:22px; font-size:14px; }
.textContent a { color:#FFFFFF; text-decoration:none; border-bottom:dotted 1px #FFFFFF; }
.textContent a:hover { color:#fd7020; border-bottom:none; }
.skills ul { }
.skills ul li { color:#fff; background:url(images/tick.png) left center no-repeat; padding:0 0 0 18px; }


/*** Portfolio ***/
.img { border:solid 5px #fff; float:left; }
.img:hover { border:solid 5px #ef4f00; cursor:pointer; }

.imgRight { border:solid 5px #fff; margin:0 0 0 20px; width:400px; }
.imgRight:hover { border:solid 5px #ef4f00; cursor:pointer; }

.projectInfoLeft { width:410px; display:block; height:82px; background:url(images/project-bg.png) top left repeat-x; margin:0 20px 30px 0; float:left; font-family:Georgia, "Times New Roman", Times, serif; font-size:14px; font-style:italic; }
.projectInfoRight { width:410px; display:block; height:82px; background:url(images/project-bg.png) top left repeat-x; margin:0 0 30px 0; float:left; font-family:Georgia, "Times New Roman", Times, serif; font-size:14px; font-style:italic; }
.client { display:block; color:#fff; width:220px; float:left; padding:6px 0 0 8px; }
.type { display:block; float:left; font-size:12px; width:160px; font-style:normal; color:#ff5a00; text-align:right; padding:6px 0 0 0; }
.type strong { color:#e5dfdc; font-weight:normal; }



/*** Form ***/
.textarea { background:url(images/textarea_bg.png); height:50px; width:280px; border:solid 1px #291A0C; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#000000; letter-spacing:1.2px; padding:2px 3px 0 3px; margin:0 0 5px 0;}
.textfield { background:url(images/textarea_bg.png); height:19px; width:280px; border:solid 1px #291A0C; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#000000; letter-spacing:1.2px; padding:2px 3px 0 3px; margin:0 0 5px 0;}
.dropdown { background:url(images/textarea_bg.png); height:24px; width:288px; border:solid 1px #291A0C; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#000000; letter-spacing:1.2px; padding:2px 3px 0 3px; margin:0 0 5px 0;}
#button { width:70px; height:21px; background-color:#211408; border:solid 1px #0E0B03; color:#b6b1ab; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; padding:0 0 3px 0; }
#button:hover { width:70px; height:21px; background-color:#fd7020; border:solid 1px #0E0B03; color:#000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; cursor:pointer; padding:0 0 3px 0; }



/*** Foot ***/
#foot { background:url(images/foot_bg.png) repeat-x; height:207px; font-family:Arial, Helvetica, sans-serif; }
#footContainer { width:935px; margin:0 auto; }
#footContainer ul { float:left; width:200px; margin:13px 0 0 20px; }
#footContainer ul li { color:#e1dad0; width:300px; font-size:11px; }
#footContainer ul li a { color:#e1dad0; width:200px; text-decoration:none; font-size:13px; line-height:19px; }
#footContainer ul li a:hover { color:#fd7020; text-decoration:none; font-size:13px; border-bottom:dotted 1px #fd7020; }
.webdesign { padding:15px 0 0 0; display:block; }

.websiteBuild { width:201px; height:175px; background:url(images/foot-graphic-1.png) top left; float:left; border:none; margin:35px 0 0 95px; }
.websiteBuild:hover { background:url(images/foot-graphic-1.png) top right; cursor:pointer; }
.professionalWebsites { width:288px; height:214px; background:url(images/foot-graphic-2.png) top left; float:left; border:none; margin:-8px 0 0 55px; }
.professionalWebsites:hover { background:url(images/foot-graphic-2.png) top right; cursor:pointer; }