/* ================================ */
/* WVC, Style! 
/* ================================ */

/* v1.0 | 20100611 */
/* Well Versed Creative, LLC. - http://wellversedcreative.com

/* 
---------------------------------------------------------------------------------------- *//* FRESH START */
html{margin:0; padding:0;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ol,ul{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym{border:0;}
a img{border:0;}

/* 
---------------------------------------------------------------------------------------- *//* RECYCLE */
.clear{clear: both;}
.lsidec{clear: left;}
.rsidec{clear: right;}

.strong{font-weight: bold;}

/* 
---------------------------------------------------------------------------------------- *//* CORE */
html {}
body {background: black url(/../img/v1_bkg_nausika_lowres.jpg) fixed; font-family:helvetica, sans-serif; color:black;}
#wrap{width:1300px; margin:0; /*debugg bkg*/ background: aqua;}
#nav{width: 300px; height: auto; float: left;}
#splat a{display: block; width: 285px; height: 144px; background: url(/../img/wvc_splat.png) no-repeat;text-indent: -9999px; overflow: hidden;}

/* Content Holders
------------ */
#WVC, #news, #contactus, #portfolio, #home {height: auto; float: left; margin: 63px 0 0 40px;}

#WVC {width: 880px;}
#news {width: 850px;}
#contactus {width: 815px;}
#portfolio {width: 880px;}

/* News Navigation Pages
------------ */
#pagination {display: block; position:absolute; top:95px; right: 0; background: #AAD037; padding: 5px 40px 5px 10px;  font-size: .75em;}
#ptitle{color: white; text-transform: uppercase; padding: 0 5px 0 0;}

/* Footer
------------ */
#footer {}
.highlight{background: #AAD037; font-size: .75em; padding: 3px 7px 3px 3px;}
#credits li{margin: 0 0 4px 0;}

.lilone img{background: #AAD037; padding: 3px 5px 3px 3px; margin: 1px 0 0 0;}

/* Format
------------ */
h1{font-size: 2.2em; text-transform: uppercase; font-weight: bold; margin: 0 0 -9px 0;}
h2{font-size: 1.5em;}
h3{}
a{text-decoration:underline; color: black;}
a:hover{text-decoration: none; color: white; background-color: #E7509C;-webkit-transition: .1s linear;}

/* 
---------------------------------------------------------------------------------------- *//* NAV BAR */
ul.navbar{margin: 80px 0 0 0;}
.navbar li a{display: block; text-indent: -9999px; overflow: hidden;-webkit-transition: 0s linear;}

/* wvc?
------------ */
.navbar li.navwvc a{background: url(/../img/nav_wvc.png) no-repeat; width: 85px; height: 33px;}
.navbar li.navwvc a:hover{background-position: 0 -33px;}

/* Contact Us
------------ */
.navbar li.navcontactus a{background: url(/../img/nav_contactus.png) no-repeat; width: 149px; height: 33px; margin: -4px 0 0 -2px;}
.navbar li.navcontactus a:hover{background-position: 0 -33px;}

/* News
------------ */
.navbar li.navnews a{background: url(/../img/nav_news.png) no-repeat; width: 83px; height: 24px; margin: -4px 0 0 -2px;}
.navbar li.navnews a:hover{background-position: 0 -24px;}

/* fb
------------ */
.navbar li.navfb a{background: url(/../img/nav_fb.png) no-repeat; width: 44px; height: 23px; margin: 30px 0 0 -2px; position: relative; z-index: 2;}
.navbar li.navfb a:hover{background-position: 0 -23px;}

/* Twitter
------------ */
.navbar li.navtwitter a{background: url(/../img/nav_twitter.png) no-repeat; width: 116px; height: 55px; margin: -30px 0 0 -5px;position: relative; z-index: 1;}
.navbar li.navtwitter a:hover{background-position: 0 -55px;}

/* Portfolio
------------ */
.navbar li.navlatest a{background: url(/../img/nav_latest.png) no-repeat; width: 232px; height: 124px; margin: 84px 0 111px -2px;}
.navbar li.navlatest a:hover{background-position: 0 -124px;}

/* 
---------------------------------------------------------------------------------------- *//* INTROS AND BLURBS */
#subheader{width: auto; height: 115px; margin: 0 0 13px 0;}

#introboxWVC, #introboxContact, #introboxNews, #introboxPortfolio{margin: 0 0 15px 2px; padding: 10px 10px 15px 10px; background: white; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}

#introboxNews{float: left; margin: 0 10px 0 0;}

#introboxWVC{width: 282px; margin: 0 0 30px 2px;}
.gray{color: #D8D9DB;}

#introboxContact{width: 500px;}
#introboxNews{width: 134px;}
#introboxPortfolio{width: 399px; margin: 0 0 60px 0;}

ul#introboxPages{width:400px; margin: 0 0 15px 2px; padding: 10px 10px 15px 10px; background: white; webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
#introboxPages li{}
ul#introboxPages li#servicelogo{display: block; width: 20px; height: 20px;}

/* 
---------------------------------------------------------------------------------------- *//* BOXES */
.box{display:block; float:left; width: 222px; height: 201px; margin: 0 20px 55px 0; font-size: .8em; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px;}
.radius {display: block; width: 222px; height: 201px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; overflow: hidden;background: black;}

.band{display:block; width: 222px; height: 20px; position: absolute; bottom: 10px; padding: 5px 0 0 27px; border: 1pt black; border-style: solid none solid none;}
.bandlink{display: block; width: auto; font-size: 1.1em; font-weight: bold;}
.bandlink a{text-decoration: none;}

.date{display:block; width: 221px; height: 40px; background: url(/../img/date_display.png) no-repeat; margin: 5px 0 0 0; padding: 9px 0 0 9px;}
.date a{color: white; text-decoration: none; text-transform: uppercase;}
p.comment {display: block; width:auto; margin: -3px 0 0 0;}
.comment a{font-size: .7em; color: #959595;}
.comment a:hover{color: white; background-color: #E7509C; text-decoration: none;}

/* Twitter
------------ */
.twitter{width: 222px; height: 201px; background: url(/../img/bubble_twitter_marker.png) no-repeat; position: relative;}
.twitterPic{position: absolute; bottom: 5px; left: 3px; width: 55px; height: 53px; background: url(/../img/twitter_pic_wvc.png) no-repeat;}
ul.twitterlink {width:98px; height: 25px; background: url(/../img/band_twitter.png) no-repeat; margin: 20px 0 0 115px;}
ul.twitterlink li{display: block; float: left;}

.twittericon{width: 7px; height: 7px; padding: 7px; margin: 0 7px 0 0;}

.twitteruser{margin: 6px 0 0 6px;}
.twitteruser a{color: white; text-decoration: none;}

p.tweet{padding: 15px; color: white;}
p.tweet a{color: #E7509C; text-decoration: none;}
p.tweet a:hover{color: white;}

/* facebook
------------ */
.facebook{background: #00ADEA; position: relative;}
.facebook .bandlink a{color: #00ADEA;}
.facebook .bandlink a:hover{color: white;}
p.fb {padding: 15px 15px 0 15px;}
p.fb a{color: white; text-decoration: none;}

/* flickr
------------ */
.flickr{position: relative;}
.flickr .bandlink a{color: white;}
.flickr .bandlink a:hover{background: black;}

/* vimeo
------------ */
.vimeo{position: relative;}
.vimeo .bandlink a{color: black;}
.vimeo .bandlink a:hover{color: white;}
.video {padding: 6px 0 0 5px;}

/* last.fm
------------ */
.lastfm{background: #F16253 url(/../img/lastfm_icon.png) no-repeat 15px 30px; position: relative;}
.lastfm .loved a:hover{color: white; background: black;}
.lastfm .bandlink a{color: #F16253;}
.lastfm .bandlink a:hover{color: white;}
p.loved{padding: 57px 15px 0 15px;}
p.loved a{color: white; text-decoration: none;}

/* 
---------------------------------------------------------------------------------------- *//* CONTACT US PAGE */
#channels{margin: 0 0 60px 0;}
#channels li, #channels li a{display:block; background: #AAD037; text-decoration: none;}
#channels li:hover, #channels li a:hover{background: #E7509C;}

#channels li.chvoice {position: relative; z-index: 4; width: 730px; height: 50px; font-size: 3.3em;}
#channels li.chemail a{position: relative; z-index: 1; display:block; width: 813px; height: 45px; font-size: 2.5em; margin: 5px 0 0 -3px; padding: 0 0 0 10px;}
#channels li.chtwitter a{position: relative; z-index: 2; float: left; width: 325px; height: 36px; font-size: 1.9em; margin: 2px 0 0 20px; padding: 0 0 0 10px;}
#channels li.chbird {position: relative; z-index: 3;float:left; width: 39px; height: 38px; background: url(/../img/bird.png); margin: -8px 0 0 -210px;}
#channels li.chfacebook a{float: left; width: 350px; height: 36px;font-size: 1.9em; margin: 2px 0 0 5px;}
#bird {margin: -8px 0 0 0;}

#introForm{margin: 0 0 15px 0;}
#introForm li{display: block; margin: -5px 0 0 0;}
.bigwhite{background: #1B1718; color: white; font-size: 1.4em; letter-spacing: .1em; padding: 0 20px 0 7px;}

/* Contact Form
------------ */
#labels {float:left; margin: 0 10px 0 5px;}
#labels li{display: block; color: #AAD037; background: #1B1718; text-transform: uppercase; font-size: 1em;}

.nnnn, .eeeee, .mmmm{display: block;}

.nnnn{margin: 0 0 5px 0; padding: 13px;}
.eeeee{margin: 0 0 8px 0; padding: 15px 5px 3px 13px;}
.mmmm{padding: 10px 20px 5px 13px;}

/* Field Control
------------ */
.clearFieldBlurred, .clearFieldActive{border: 3pt solid white; background-color: white; font-size: 1.5em; color: black; outline: none;}
.clearFieldActive {border: 3pt solid #AAD037;}

#namefield{width: 570px; height: 43px; margin: 0 0 5px -3px; padding: 0 0 0 8px;}
#emailfield{width: 445px; height: 33px; margin: 0 0 5px 0;}
#messagefield{float: left; padding: 0 0 0 10px;}
#action{display:block; float: left; margin: 75px 0 0 5px; }

#botsend{display: block; width:121px; height: 48px; margin: 0 0 3px 0; background:url(/../img/bot_send.png) no-repeat; text-indent: -9999px; border: none;}
#botsend:hover{background-position: 0 -48px;}
#warning{width: auto; float:left; background: black; color: #AAD037; text-transform: uppercase; font-size: .7em; padding: 2px;}

/* 
---------------------------------------------------------------------------------------- *//* PORTFOLIO PAGE */
#pages li a{font-size: 1.7em; letter-spacing: .1em; background:#AAD037; text-transform: uppercase; text-decoration: none;}
#pages li a:hover{background: #E7509C;}
.whut{margin: 0; padding: 6px; font-size: .9em; letter-spacing: .1em; background: #1B1718; color: #AAD037; text-transform: uppercase;}

#liveArticles{margin: -5px 0 0 105px;}
#liveArticles li{float: left; margin: 0 0 0 5px;}
#liveArticles li a{font-size: 1em; letter-spacing: .1em; background:#AAD037; text-transform: uppercase; text-decoration: none; padding: 5px;}
#liveArticles li a:hover{background: #E7509C;}
#liveArticles .whut{font-size: .8em;}

/* Pages
------------ */
.web{margin: 0 0 0 -5px; padding: 0 0 10px 0;}
.web a{padding: 3px 7px 0 10px; margin: 0 7px 10px 0;}

.design{padding: 0 0 20px 0;}
.design a{padding: 3px 12px 0 5px; margin: 0 7px 10px 0;}

.misc{margin: 0 0 0 -2px; padding: 0 0 15px 0; font-size: .75em;}
.misc a{padding: 3px 7px 0 5px; margin: 0 7px 10px 0;}

.copy{margin: 12px 0 0 -8px; padding: 0 0 20px 0;}
.copy a{padding: 3px 13px 0 5px; margin: 0 7px 10px 0;}

.long{padding: 6px 200px 6px 6px; margin: -10px 0 0 0;}

/* 
---------------------------------------------------------------------------------------- *//* ABOUT US PAGE */
.blurb{margin: 0 0 50px 0;}
.profile{margin: 0 0 70px -9px;}

.memberlinks{height: 90px; float: left; margin: 5px 7px 0 0;}
.memberlinks li a{background:#AAD037; text-decoration: none; font-size: .85em;}
.memberlinks li a:hover{background:#E7509C;}

.lineone {text-transform: uppercase; font-size: 1.2em; font-weight: bold; margin: 0 0 12px 0;}
.blurbs {background: #1B1718; color: #8A8C8E; font-size: .75em; letter-spacing: .09em; padding: 5px;}
.white{color: white; margin: 0 8px 0 0;}
.greenblack{background: #1B1718; color: #AAD037; font-weight: normal; font-size: .55em; letter-spacing: .1em;}

.spacer{display: block; margin: 0 0 3px 0;}