html, body { height: 99%; margin: 0; padding: 0 }
body { margin: 0; padding: 0; min-width: 610px; min-height: 400px }
body, select  { font-family: Myriad Pro, Lucida Grande, Calibri, Trebuchet MS, Verdana, sans-serif; position: relative; }
a img { border: none; }

#header { position: relative; background-color: rgba(100,100,100,0.6); padding: 10px 5px; -moz-border-radius: 10px; border-radius: 10px; margin: 10px; margin-left: 10px;  -webkit-box-shadow:  2px 2px 10px 5px rgba(0, 0, 0, 0.3); box-shadow:  2px 2px 5px 1px rgba(0, 0, 0, 0.1); background: url('//s3.amazonaws.com/DBWebsite/wallpaper.png'); }
#header img { float: left; margin-left: 15px; margin-top: 2px; }

ul#nav { float: right; list-style-type: none; padding: 0; margin: 0 0 0 0; }
ul#nav li { float: left; margin: 0 0 0 0; text-transform: uppercase; letter-spacing: 1px; }
ul#nav li a { color: #fff; font-size: 0.8em; text-decoration: none; padding: 10px 22px; display: block; font-weight: normal; }
ul#nav li.selected a { color: rgb(64,169,170); }

#maximage .slideHolder { position: relative; }
#maximage .slide { position: absolute; top: 100px; width: 500px; background-color: rgba(100,100,100,0.6); padding: 10px 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow:  2px 2px 5px 5px rgba(0, 0, 0, 0.15); box-shadow:  2px 2px 5px 5px rgba(0, 0, 0, 0.15); }
#maximage h1 { font-size: 5em; margin: 0 0 0 -10px; color: #fff; font-weight: normal; text-align: center; position: relative }
#maximage h2 { font-size: 0.9em; margin: 0 0 0 0; color: #fff; line-height: 1.2em; font-weight: normal; text-align: center; }

#maximage #slide1 { background-color: rgba(64,169,170,0.85); top: 60%; left: 5%; width: 500px; background: url('/images/slide_bg_green.png'); }
#maximage #slide2 { background-color: rgba(214,175,119,0.85); top: 50%; right: 5%; width: 500px; background: url('/images/slide_bg_brown.png'); }
#maximage #slide3 { background-color: rgba(87,133,66,0.85); top: 60%; right: 5%; width: 550px; background: url('/images/slide_bg_red.png'); }
#maximage #slide4 { background-color: rgba(64,169,170,0.85); top: 60%; left: 5%; width: 600px; background: url('/images/slide_bg_green.png'); }
#maximage #slide5 { background-color: rgba(214,175,119,0.85); top: 70%; right: 5%; width: 550px; background: url('/images/slide_bg_brown.png'); }
#maximage #slide6 { background-color: rgba(87,133,66,0.85); top: 60%; right: 5%; width: 500px; background: url('/images/slide_bg_red.png'); }

#footer { position: fixed; bottom: 2px; width: 100%; margin-right: 10px; }
#footer p { margin: 0; font-size: 0.6em; color: #fff; text-align: right; text-transform: uppercase; float: right; margin-right: 10px; }

h2.galleryCaption { position: absolute; bottom: 0.5%; left: 1%; text-shadow: 1px 1px 1px #000; text-transform: uppercase; letter-spacing: 1px; }

#prevImage, #nextImage { position: absolute; top: 45%; opacity: 0.8; width: 5%; cursor: pointer; z-index: 99}
#prevImage { left: 0.5%; }
#nextImage { right: 0.5%; }
#prevImage.homepage, #nextImage.homepage { opacity: 0.3 }

#bio { padding: 10px 20px 0px 20px;  width: 45%; margin: 0 10px 10px; background: rgba(30,30,30,0.1); -moz-border-radius: 10px; border-radius: 10px; }
#bio p { color: #000; font-size: 0.9em; line-height: 1.4em; margin: 0 0 10px 0 }
div.movieContainer h1, div#clientList h1, div#testimonials h1, div#accoladeContainer h1, #bio h1, #contactInfo h1, div.infoBox h1 { color: #000; font-weight: normal; font-size: 1.3em; margin: 20px 0 10px 0; padding: 0; text-transform: uppercase; letter-spacing: 2px; }
#contactInfo h1, div#clientList h1, div.movieContainer h1, div.infoBox h1 { color: #fff; }

div#bio blockquote.ft { font-size: 0.9em; line-height: 1.4em; color: #000; margin: 0 0 10px 0; padding: 0; }
div#bio blockquote.ft p { font-size: 0.8em; text-align: right; margin: 0; line-height: 1.2em; }

div#bio ul { color: #000; font-size: 0.9em; padding: 0; list-style-type: none }
div#bio ul li { line-height: 1.4em; }
div#bio ul li span { padding: 0 20px 0 0}

.portCollection { width: 97%; margin: 0 auto; }
.portCollection ul { list-style-type: none; padding: 0; margin: 20px 0 0 2%; }
.portCollection ul li { float: left; margin-right: 2%; position: relative; margin-bottom: 1.5%; width: 22%; }
.portCollection ul li div { }
.portCollection ul li img { -moz-border-radius: 10px; border-radius: 10px; width: 100%; }
.portCollection ul li a.portfolioName { text-transform: uppercase; width: 100%; font-weight: normal; font-size: 1em; margin: 0 0 0 0; padding: 5px 0; letter-spacing: 2px; position: absolute; left: 0; color: #fff; text-decoration: none; text-align: center; vertical-align: middle; background: rgba(30,30,30,0.7); -moz-border-radius: 10px; border-radius: 10px; bottom: 0px}

div#contactInfo a, div.infoBox a { text-decoration: none; color: #fff }
div#contactInfo a:hover, div.infoBox a:hover { text-decoration: underline; }
div#contactInfo, div.infoBox { padding: 10px 20px 10px 20px; width: 45%; margin: 0 10px 10px; background: rgba(30,30,30,0.5); -moz-border-radius: 10px; border-radius: 10px; bottom: 0px; }
div#contactInfo p, div.infoBox p { color: #fff; } 
div#contactInfo p#contactName { margin: 0 0 5px 0; }
div#contactInfo p#contactJob { margin: 0; font-size: 0.9em;}
div#contactInfo address#contactVagueAddress { font-size: 0.9em; color: #fff; font-style: normal; }
div#contactInfo span#contactFullAddress { float: left; display: block; }
div#contactInfo p#contactRepresented { clear: both; margin-bottom: 20px; font-size: 0.9em }

div#clientList { padding: 10px 20px 10px 20px;  width: 45%; margin: 0 10px 10px; background: rgba(30,30,30,0.6); -moz-border-radius: 10px; border-radius: 10px; color: #fff }
div#clientList ul { list-style-type: none; padding: 0; margin: 0; font-size: 0.9em; margin-bottom: 10px;  }
div#clientList ul li { float: left; margin-right: 30px; line-height: 1.4em }
div#clientList p.clientListHeader { clear: both; font-weight: bold;}

#movies { margin: 20px auto 0 auto; width: 95%; }

div.movieContainer { padding: 10px 20px 10px 20px;  width: 85%; background: rgba(30,30,30,0.7); -moz-border-radius: 10px; border-radius: 10px; color: #fff; margin: 0 8% 0 7%; box-shadow:  2px 2px 5px 5px rgba(0, 0, 0, 0.15); -webkit-box-shadow:  2px 2px 5px 5px rgba(0, 0, 0, 0.15); }
div.movieContainer div.movieDetails {  }
div.movieContainer div.movieDetails p { font-size: 0.9em; line-height: 1.4em; }
div.movieContainer div.movieFrame {  }

#pager.homepage { position: absolute; left: 40px; bottom: 5%; }
#pager.homepage a { height: 10px; width: 10px; background: rgba(255,255,255,0.9); display: block; text-decoration: none; float: left; margin-right: 5px; -moz-border-radius: 5px; border-radius: 5px;  }
#pager.homepage a.activeSlide { background-color: rgba(64,169,170,0.85); }

#pager.motion { margin: -40px 0 0 40px;  }
#pager.motion a { height: 10px; width: 10px; background: rgba(255,255,255,0.4); display: block; text-decoration: none; float: left; margin-right: 10px; -moz-border-radius: 5px; border-radius: 5px;  }
#pager.motion a.activeSlide { background-color: rgba(255,255,255,1); }

#pager.gallery { position: absolute; left: 40px; bottom: 5%; }
#pager.gallery a { height: 10px; width: 10px; background: rgba(255,255,255,0.4); display: block; text-decoration: none; float: left; margin-right: 10px; -moz-border-radius: 5px; border-radius: 5px;  }
#pager.gallery a.activeSlide { background-color: rgba(255,255,255,1); }

#contactInfo #contactDetails { float: left; width: 55%; margin-right: 5%; }
#contactInfo #socialInfo { float: left; width: 35%; margin-left: 5%; } 
#contactInfo #socialInfo ul { list-style-type: none; margin: 0; padding: 0; }
#contactInfo #socialInfo ul li { margin-bottom: 10px; }
#contactInfo #socialInfo ul li img { vertical-align: middle; margin-right: 5px; }

#contactInfo .assignments { float: left; font-size: 0.9em; margin-right: 15px; }
 
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}

a.buylink { z-index: 10001; color: #fff; text-decoration: none; cursor: pointer; }

div#standalonePage { width: 750px; background-color: #fff; margin: 30px auto; -webkit-box-shadow:  2px 2px 10px 5px rgba(0, 0, 0, 0.5); box-shadow:  2px 2px 5px 1px rgba(0, 0, 0, 0.5); padding: 30px 50px; padding: 1px solid #ccc; font-size: 0.95em; line-height: 1.5em; -moz-border-radius: 10px; border-radius: 10px; }

div.gallery img { margin-right: 12px; }

#logo { text-transform: uppercase; color: #fff; float: left; padding: 0 0 0 20px; margin: 0; font-weight: normal; font-size:2em;}
h1#logotumblr { text-transform: uppercase; color: #fff; float: left; padding: 0 0 0 20px; margin: 0; font-weight: normal; font-size: 2.6em; padding: 7px 0; }
h1#logotumblr a, #logo a { color: #fff; text-decoration: none; }
#logo img#logomark { padding: 7px 0; margin: 0 15px 0 0 }
h1#logotumblr img#logomark { margin: 0 15px 0 20px }

#buylink { position: fixed; bottom: 23px; margin-left: 1%; color: #fff; text-transform: uppercase; text-decoration: none; font-size: 0.75em; text-shadow: 1px 1px 1px #000; letter-spacing: 1px; }
#buylink img { vertical-align: middle; margin-right: 10px; width: 15px; margin-top: -5px; }