@charset "utf-8";
/* CSS Document */
body {margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif;}

.inner980 {width: 980px; margin: 0 auto;}
.inner900 {width: 900px; margin: 0 auto;}

p {font-size: 10pt}

/************************ HEADER *************************/
#header {height: 215px; background: #436e5f url(pattern-header-bg.gif) 0 0 repeat; border-bottom: 1px solid #365b4e; position: relative; }
#inner-header {height: 215px; background: url(menu-bg-black.png) 0 0 repeat-x; overflow: hidden; position: relative;}
#header-container {height: 174px; position: relative;}

#logo-box {width: 175px; height: 174px; position: absolute; top: 0; left: 0; z-index:10;}
#logo-box img {border: none;}

#booked {position: absolute; top: 65px; right: 15px; width: 400px; height: 70px; text-align: right; color: #fff; font-size:14pt;}
#booked a:link, #booked a:visited { text-decoration:none; color: #fff;}
#booked a:hover { text-decoration: none; color: #203c32; background-color: #fff;}

#headertxt {position: absolute; top: 160px; background: url(overlay-header.png) 0 0 repeat; border-top: 1px solid #b4ccc4; width:100%; height:115px; float:left; }
#headertxt h1 {color: #fff; padding: 5px 0; margin: 0;}
#headertxt p {color: #fff; padding: 5px 0;; margin: 5px 0 0; line-height: 1.4em}

/************************* GLOBAL NAV ********************************/

#navigation { position:relative; float:right; height: 44px; width: 750px; padding: 0; margin: 0; } 
#menu {	position: relative; right: 0; width: 750px; padding: 0;	margin: 0; height:44px; line-height: 44px; font-size: 20px; }
#menu li { float: right; list-style: none; }
#menu li.backLava { background: url("menu.gif") no-repeat right 0px; width: 15px; height: 44px; z-index: 80; position: absolute; }
#menu li.backLava .leftLava { background: url("menu.gif") no-repeat top left; height: 44px; margin-right: 15px; /* 8px is the width of the rounded shape */ }

#menu li a:link, #menu li a:visited {text-decoration: none; color: #fff; outline: none; text-align: center; z-index: 100; display: block; height: 44px; position: relative; overflow: hidden; margin: auto 15px; }
#menu li a:hover, #menu li a:active { border: none; }

/************************ LATEST WORK *************************/

#featured {height: 439px; background: #fff url(featured-box-bg.gif) 0 0 repeat-x; border-bottom: 1px solid #d7b6b1;}
#featured-box {height: 439px; margin: 0 auto; background: url(featured-shadow-bg.jpg) top center no-repeat;}

#slider-container {width: 972px; height: 360px; margin: 0 auto; border: 1px solid #dfc8c3; background-color:#fff; position: relative; top: 40px; }

#slider-container .wrapper { width: 900px; overflow: auto; height: 286px; margin: 35px; position: absolute; top: 0; left: 0; border: 1px solid #c29790; background: url(slider-container-bg.gif) repeat-x 0 0; }

.slider-container .wrapper ul { width: 32700px; list-style: none; position: absolute; top: 0; left: 0; margin: 0; padding: 0; }
.slider-container ul li { display: block; float: left; padding: 0; height: 288px; width: 900px; margin: 0; }
.slider-container .arrow { display: block; height: 49px; width: 49px; background: url(arrows.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 155px; cursor: pointer; }
.slider-container .forward { background-position: 0 0; right: 12px; }
.slider-container .back { background-position: -49px 0; left: 12px; }
.slider-container .forward:hover { background-position: 0 -49px; }
.slider-container .back:hover { background-position: -49px -49px; }

.slider-container .featuring { display: block; position: absolute; right: 36px; top: 36px; width: 127px; height: 125px; }
.slider-container .featuring img { border: none; }

.slider-image-div {width:569px; height: 288px; overflow: hidden; float: left; margin: 0; padding: 0;}
.slider-text-div {width:289px; height: 288px; overflow: hidden; float: left; margin: 0; padding: 0 40px 0 0;}
.slider-text-div h3 {padding: 45px 0 0 0; margin: 0; color: #666; font-size:20pt; text-transform:uppercase;}
.slider-text-div p {color: #000; font-size: 9pt; line-height: 14pt; margin: 0; padding: 8px 0;}

#thumbNav { position: relative; top: 328px; left: 36px; font-family: Arial, Helvetica, sans-serif; font-size:14px; font-weight: bold; }
#thumbNav a:link, #thumbNav a:visited { color: #d5b7b2; display: inline-block; padding: 0; height: 27px; width: 27px; margin: 0 4px 0 0; background: url(nav-numbers.gif) no-repeat 0 0; text-align: center; line-height: 27px; text-decoration: none; text-shadow: -1px 1px #fff;  }
#thumbNav a:hover { background: url(nav-numbers.gif) no-repeat -27px 0; color: #fff; text-decoration: none; text-shadow: -1px 1px 1px #a57770; }
#thumbNav a.cur { background: url(nav-numbers.gif) no-repeat -27px 0; color: #fff; text-decoration: none; text-shadow: -1px 1px 1px #a57770; }

#start-stop { display: none; }
#start-stop.playing { }
#start-stop:hover { }

a.exteranal-design-site:link, a.exteranal-design-site:visited {padding: 0 0 0 22px; color: #666; text-decoration: none; background: url(external-link.gif) 0 0 no-repeat; line-height: 16px; height: 16px; display: block;}
a.exteranal-design-site:hover {color: #477667; text-decoration: none; background: url(external-link.gif) 0 -16px no-repeat;}


/********************************** CONTENT *********************************/

#content {margin: 0 auto; background: url(content-bg.giv) 0 0 repeat-x; padding: 15px 0;}
#content #left-col {width: 612px; padding: 0; margin: 0 20px 0 0; float: left;}
#content h2 {margin: 15px 0; padding: 0; color: #666; font-size:20pt;}
#content p {color: #444; font-size: 10pt; line-height: 14pt; margin: 0; padding: 8px 0;}
#content p.first { font-weight: bold;}
#content p.testemonial { font-style:italic;}
#content p.signature { font-style:italic; color: #666!important; font-weight: bold; padding: 0 0 8px 0!important; text-align:right;}

#content p a:link, #content p a:visited { color: #666; text-decoration: underline;}
#content p a:hover {color: #000;}

#content #right-col {width: 268px; padding: 0; margin: 0; float: left;}

/*********************************** FOOTER ***********************************/

#footer {margin: 10px 0 0; padding: 15px 0; border-top: 1px solid #999; width: 980px;}
#social-links {height: 60px; padding: 0;}
#social-links ul {margin: 0; padding: 0;}
#social-links ul li {float: left; list-style: none; margin-right: 25px; position:relative;}

#deviantart {height: 47px; width: 48px; overflow:hidden; display:block; background: url("footer/deviant.gif") 0 0 no-repeat;}
#deviantart:hover {background-position: 0 -47px;}
#deviantart span {display:none;}

#logopond{height: 47px; width: 65px; overflow:hidden; display:block; background: url("footer/logopond.gif") 0 0 no-repeat;}
#logopond:hover {background-position: 0 -47px;}
#logopond span {display:none;}

#nintyninedesigns{height: 47px; width: 124px; overflow:hidden; display:block; background: url("footer/99designs.gif") 0 0 no-repeat;}
#nintyninedesigns:hover {background-position: 0 -47px;}
#nintyninedesigns span {display:none;}

#linkedIN{height: 47px; width: 96px; overflow:hidden; display:block; background: url("footer/linkedIN.gif") 0 0 no-repeat;}
#linkedIN:hover {background-position: 0 -47px;}
#linkedIN span {display:none;}

#youtube{height: 47px; width: 80px; overflow:hidden; display:block; background: url("footer/youtube.gif") 0 0 no-repeat;}
#youtube:hover {background-position: 0 -47px;}
#youtube span {display:none;}

#tweeter{height: 47px; width: 105px; overflow:hidden; display:block; background: url("footer/tweeter.gif") 0 0 no-repeat;}
#tweeter:hover {background-position: 0 -47px;}
#tweeter span {display:none;}

#facebook{height: 47px; width: 104px; overflow:hidden; display:block; background: url("footer/facebook.gif") 0 0 no-repeat;}
#facebook:hover {background-position: 0 -47px;}
#facebook span {display:none;}

#footerlinks {margin:0; padding: 0; color: #999; font-size:0.75em; }
#footerlinks ul {margin: 0; padding: 0;}
#footerlinks ul li {float: left; list-style: none; margin: 0; padding: 0 5px; border-right: 1px solid #999;}
#footerlinks ul li.first {padding: 0 5px 0 0!important;}
#footerlinks ul li.last { border-right: none!important;}
#footerlinks ul li a:link, #footerlinks ul li a:visited {color: #999; text-decoration: none;}
#footerlinks ul li a:hover {color: #666; text-decoration: underline;}

#copyright {margin: 15px 0 0 0; padding: 0; color: #999; font-size:0.75em;}
#copyright p {margin: 0; padding: 0; line-height: 1.6em;}

/********************************** ACCESSIBILITY ********************************/

.clear {clear:both;}
br.clear {height: 1px;}