/*

Theme Name: BW 2

Author: Brave Whale

Author URI: http://bravewhale.com

version: 1.0

*/



/* basics */
* { margin: 0; padding: 0; border: none; }
.clear:after { content: "."; visibility: hidden; height: 0px; display: block; clear: both; }
body { background: url(images/bodybg.jpg) repeat-x #fff; font: normal 14px arial, sans-serif; color: #666; }
img.left { float: left; border: none; padding: 6px 0 0 0; }
img.right { float: right; border: none; padding: 0 0 0 6px; }
code { font-family: "Courier New", Courier, monospace; }
a { color: #dc3e29; text-decoration: underline; }
a:hover { text-decoration: none; }

/* container */
#container { background: url(images/bwflag.png) top left no-repeat; width: 892px; margin: 0 auto; }

/* header */
#header { width: 839px; height: 127px; }
#header ul { float: right; padding: 97px 4px 0 0; }
#header ul li { display: inline; margin-right: 10px; }
#header ul li a { color: #8e9eaa; text-transform: uppercase; text-decoration: none; margin: 0 10px; padding-bottom: 5px; }
#header ul li a:hover { border-bottom: 1px dotted #8e9eaa; }
#header ul li.current_page_item a { border-bottom: 1px dotted #8e9eaa; }
#header ul li.current-cat a { border-bottom: 1px dotted #8e9eaa; }
#header a.logo { float: left; display: block; height: 127px; width: 147px; margin: 0 0 0 74px; }
#header a.logo span { display: none; }

/* content */
#content { width: 839px; margin: 0 auto; border-top: 1px dotted #ccc; }
#content.none { border: none; }
#content h2.pagetitle { font: italic 20px georgia; }
#holder { width: 839px; margin: 0px auto; }

#featured-work { background: url(images/framebg.png) no-repeat; width: 743px; height: 347px; padding: 12px; margin: 0 auto 20px auto; overflow: hidden; }
#featured-work img { cursor: pointer; }
#featured-work p { padding: 22px 22px 10px 22px; }
#folio-text { background: #fff; border-top: 1px dotted #ccc; border-bottom: 1px dotted #ccc;font: 14px arial, verdana; line-height: 20px; width: 740px; margin: 0 auto 10px auto; }
#folio-text h2.title { float: left; font: 18px arial, sans-serif; text-transform: uppercase; color: #88b4d4; }
#folio-text p { color: #2C5058; }
#folio-text #stripnav { float: right; }

#column-holder { width: 740px;  margin: 10px auto 0 auto; border-top: 1px dotted #ccc; line-height: 20px; font-size: 12px; }
#column-holder .col { float: left; width: 339px; padding: 20px 20px 0 10px; border-right: 1px dotted #ccc; }
#column-holder .col.none { margin:0px; padding: 20px 10px 0 20px; border: none; }
#column-holder .col p { margin-bottom: 12px; }
#column-holder .col h3 { font: 16px arial, sans-serif; text-transform: uppercase; color: #88b4d4; margin-bottom: 10px; }
#column-holder .col ul { margin: 0 15px; }
#column-holder .col img.btn { margin-top: 10px; }

#folio-item { width: 718px; height: 438px; padding-top: 10px; margin: 0 auto; }
#folio-item-holder { border: 1px dotted #ccc; width: 738px; height: 458px; margin: 0 auto; }
#folio-item ul li img.hover { position: relative; z-index: 100; }

#post-holder { width: 500px; border-right: 1px dotted #ccc; padding: 5px 20px 0 0; }
.post { margin:0; padding:0; line-height: 24px; }
.post h1 { font: 20px arial,sans-serif; text-transform: uppercase; color: #88b4d4; }
.post h2 { font: 20px arial,sans-serif; text-transform: uppercase; color: #88b4d4; }
.post h2 a { color: #88b4d4; text-decoration: none; text-transform: uppercase; }
.post h2 a:hover { text-decoration: underline; }
.post h3 { font: 18px arial, sans-serif; color: #88b4d4; padding: 10px 0; }
.post h3 a { font: 18px arial, sans-serif; color: #88b4d4; padding: 10px 0; }
.post h3 a:hover { text-decoration: none; }
.post small { color: #999; padding: 2px 5px 0 0; }
.post ul { margin: 0 0 0 60px; }
.post li { font: italic 16px georgia, serif; color: #666; line-height: 32px; }
.post img { border: 1px dotted #ccc; padding: 10px; }
.entry p { margin: 12px 0; font: 16px arial; color: #666; line-height: 24px; }
.entry blockquote p { border-left: 1px solid #ccc; margin: 10px; padding: 0 12px 0 12px; font: italic 12px/20px georgia; color: #999; }
.postmetadata { clear: both; padding: 6px 0; }
.postmetadata a { text-decoration: none; }
.postmetadata a:hover { text-decoration: underline; }
.navigation { border-top: 1px dotted #ccc; font-size: 12px; width: 100%; float: left; margin: 0; padding: 10px 0 0 0; overflow: hidden; }
.navigation h3 { font: 16px arial, sans-serif; color: #88b4d4; padding-bottom: 10px; }

#top-box { background: url(images/welcomebg.png) no-repeat; width: 799px; height: 92px; overflow: hidden; margin: 10px auto 0 auto; padding: 15px 20px; font: italic 23px/30px georgia, serif; color: #7fafd1; }
#top-box p span.hello { color: #999; }
#top-box p span.more a { font-size: 14px; }

#flag-holder { width: 839px; margin: 22px auto 0 auto; height: 150px; }
#flag-text { background: url(images/flagtext.png) no-repeat; width: 142px; height: 70px; margin: 0 0 0 57px; }
#flag-text.about { background: url(images/flagtext.png) no-repeat 0px -87px; width: 142px; height: 70px; margin: 0 0 0 57px; }
#flag-text.work { background: url(images/flagtext.png) no-repeat 0px -160px; width: 142px; height: 70px; margin: 0 0 0 60px; }
#flag-text.blog { background: url(images/flagtext.png) no-repeat 0px -250px; width: 142px; height: 70px; margin: 0 0 0 57px; }
#flag-text.archive { background: url(images/flagtext.png) no-repeat 0px -340px; width: 142px; height: 70px; margin: 0 0 0 57px; }

/* sidebar */
#sidebar { float: right; font-size: 12px; padding: 0; }
#sidebar .col1 { float: left; padding: 0 10px; border-right: 1px dotted #ccc; width: 195px; min-height: 500px; }
#sidebar .col2 { float: left; padding-left: 10px;  }
#sidebar h3 { margin-bottom: 10px; font: 16px arial, sans-serif; color: #88b4d4; }
#sidebar ul { margin: 0 0 20px 0; padding: 5px 0 0 0; border-bottom: 1px dotted #ccc; }
#sidebar ul li { margin: 0; list-style-type: none; display: block; }
#sidebar ul li a { padding: 5px 0; display: block; border-top: 1px dotted #ccc; text-decoration: none; }
#sidebar ul li a:hover { background: #f8f8f8; }
#sidebar ul ul { margin: 14px 0; padding: 0; }
#sidebar ul ul li { list-style-type: none; }
#sidebar ul ul ul { margin: 0; padding: 0; }
#sidebar ul ul ul li { padding: 0 0 0 15px; list-style-type: square; color: #898989; }

/*work page*/
#work-holder { width: 839px; margin: 0 auto; border-top: 1px dotted #ccc; }
.thumbnail { border-bottom: 1px dotted #ccc; padding-bottom: 10px; height: 200px; }
.thumbnail .title-top { background: #fff; border-bottom: 1px dotted #ccc; margin-bottom: 10px; }
.thumbnail .title-top h2 a { float: left; position: relative; top: 0px; text-decoration: none; font: 20px arial,sans-serif; text-transform: uppercase; color: #88b4d4; }
.thumbnail .title-top a { text-decoration: none; float: right; position: relative; top: 4px; }

.post-items .quote { background: url(images/workquotebg.png) no-repeat; display: block; height: 165px; width: 555px; float: right; }
.post-items .quote p { position: relative; top: 30%; font: italic 24px georgia; color: #999; }
.post-items a img { float: left; border: 1px dotted #ccc; padding: 5px; }

/* comments */
#commentform { margin: 0; padding: 0; }
#commentform p { color: #000; }
#commentform a { color: #000; text-decoration: none; line-height: 18px; }
#commentform h3 { font-family: georgia, times, verdana; font-size: 12px; font-weight: 300; color: #000; margin: 0; padding: 0; }
#comment { width: 498px; }
#author, #email, #url, #comment { background: #f9f9f9; font: 14px arial, sans-serif; margin: 5px 5px 0 0; padding: 5px; border: 1px solid #eee; }
#submit { cursor: pointer; background: #ccc; border: none; padding: 5px; color: #fff; }
#submit { margin: 5px 5px 0 0; }
#comments { margin: 0; padding: 0; }
ol.commentlist { list-style-type: none; margin:0; padding:0; }
.avatar { float:left; margin:0 12px 0 0; }
ol.commentlist li { background: #f9f9f9; width: 500px; margin: 10px 0; padding: 5px 0 5px 10px; list-style-type: none; }
ol.commentlist li.alt { background: #fff; }
ol.commentlist li p { margin: 6px 0 6px 0; padding: 0 12px 0 0; line-height: 20px; }
ol.commentlist a { color: #000; }
cite { font-family: arial, verdana, tahoma; font-size: 12px; font-weight: bold; font-style: normal; }
cite a { color: #000; text-decoration: none; }

/* search */
#searchform { padding: 0; margin: 14px 0; }
#searchform input#s { margin:0; padding:2px; border: 1px solid #000; }
#searchform input#searchsubmit { border: none; background: #333; color: #fff; text-transform: lowercase; }

/* misc */
img.aligncenter { display: block; margin: 0 auto; }
img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; }
img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; }
.alignright { float: right; }
.alignleft { float: left }
.wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; }
.wp-caption img { margin: 0; padding: 0; border: 0 none; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; }

/* footer */
#contact-us { background: #ccc; width: 100%; height: 100%; margin-top: 40px; border-top: 1px solid #999; padding: 0 0 50px 0;}
#footer { background: #666; width: 100%; border-top: 1px solid #555; padding: 0 0 20px 0; }
#footer #tweet { width: 839px; margin: 0 auto; position: relative; bottom: 86px; }
#footer #tweet a { background: url(images/tweet.png) no-repeat top right; float: right; display: block; width: 325px; height: 152px; text-decoration: none; }
#footer #tweet a:hover { background-position: 0 -152px; }
#footer #tweet a span { visibility: hidden; }
#footer #colholder { width: 839px; margin: 0 auto; padding-top: 20px; }
#footer #colholder .col ul { border-top: 1px dotted #999; border-bottom: 1px dotted #999; margin-top: 20px; padding: 5px 3px;  width: 226px; }
#footer #colholder .col li { display: inline; padding: 0 20px 0 0; }
#footer #colholder .col a { color: #ccc; text-decoration: none; }
#footer #colholder .col a:hover { text-decoration: underline; }

/*contact form*/
#contact-holder input:focus { outline: none; }
#contact-holder textarea:focus { outline: none; }
#contact-holder { margin: 30px auto; width: 839px; }
#contact-holder h2 { font: italic 22px georgia, serif; color: #4F7F9F; text-shadow: 1px 1px 0px #eee; margin-bottom: 20px; }
#contact-form { margin: 0; width: 652px; float: left; }
#contact-form p { font-size: 10px; color: #666; text-transform: uppercase; }
#contact-form p.title { padding-left: 5px; }
#contact-form input[type="text"], #contact-form textarea { border: none; }
#contact-form #input-text { float: left; margin-right: 18px; }
#contact-form #input-text input[type="text"] { background: url(images/inputbg.png) no-repeat; width: 257px; height: 19px; color: #666; margin-bottom: 5px; padding: 8px; }
#contact-form #textarea { float: left; }
#contact-form #textarea textarea { background: url(images/textareabg.png) no-repeat; overflow: auto; color: #666; width: 338px; height: 120px; padding: 10px; font: 13px arial; resize: none; }
#contact-form #textarea input[type="submit"] { background: url(images/sendbg.png) no-repeat; float: right; cursor: pointer; margin: 20px 0; padding: 2px 5px 5px 5px; width: 75px; height: 36px; color: #666; }
#contact-info { float: left; color: #666; width: 146px; height: 138px; margin: 12px 0 0 20px; padding: 0 0 0 20px; border-left: 1px dotted #fff; font: italic 12px georgia; line-height: 22px; text-shadow: 1px 1px 0px #eee; }
/*plugin ajax over-ride*/
div.wpcf7-response-output { height: 40px; border: none !important; top: -45px; position: relative; padding: 0 !important; margin: 0 !important; color: #f44; }

/*slideViewer*/
.svw { width: 50px; height: 20px; background: #fff; }
.svw ul { position: relative; left: -999em; }
.stripViewer { position: relative; overflow: hidden; }
.stripViewer ul { /* this is your UL of images */ margin: 0; padding: 0; position: relative; left: 0; top: 0; width: 1%; list-style-type: none; }
.stripViewer ul li { float:left; }
.stripTransmitter { overflow: hidden; margin: 1px 0; }
.stripTransmitter ul { margin: 0; padding: 0; list-style-type: none; }
.stripTransmitter ul li { float: left; margin: 0 5px 0 0; text-align: center; }
.stripTransmitter a { font-weight: bold; background: #88b4d4; color: #fff; text-decoration: none; padding: 0 5px; }
.stripTransmitter a:hover, a.current { background: #dc3e29; }