/*
Theme Name: Webthatmatters.com
Theme URI: http://wordpress.org/
Description: The official webthatmatters.com wordpress template <a href="http://www.webthatmatters.com">Morgan Craft</a>.
Version: 0.01
Author: Morgan Craft
Author URI: http://www.webthatmatters.com/
Tags: webthatmatters

	This theme was designed and built by Morgan Craft,
	whose blog you will find at http://www.webthatmatters.com/

	The CSS, XHTML and design cannot be used without the expressed permission from the author

*/
/*
Standard Orange:   #E96500
Standard Blue:     #538CB7
Dark BlueBG:       #598194

ORIGIANL BG:     #6390A5 
PAGE BG:         #608BA8
HEADER LINES :   #517B95

*/

body{font-family:"lucida Grande";  background-color:#608BA8; line-height:1.2em; text-align:center; margin:0; padding:0;}
h1, h2, h3, h4, h5, p, ul, li, dl, dt, dd, div{margin:0; padding:0; text-align:left;}
h2,h3,h4{}
ul li{list-style:none;}
a{color:#fff; text-decoration:none;}
a img{border:none;}
#mastHead{background:url("images/mastheadBG.gif") repeat-x left top; height:56px;}
#mastHead h1{padding:29px 0 0 10px; float:left;}

#mastHead ul{float:right; position:relative; top:35px; padding-bottom:14px;}
#mastHead ul li{float:left; padding-right:20px;}
#mastHead ul li a{color:#ccc; border-bottom:1px solid #1a1a1a; font-weight:bold; letter-spacing:.09em; padding:0 3px;}
#mastHead ul li.selected a, #mastHead ul li.selected a:hover{border-bottom:1px solid #e96500; color:#fff;}
#mastHead ul li a:hover{border-bottom:1px solid #fff; color:#fff;}



.innerWrapper{width:900px; margin:0 auto;}
h3.innerWrapper{text-align:left;}

#introduction{background-color:#000; min-height:191px; }
#introduction h2{color:#f2f2f2; font-size:18px; font-weight:bold; width:550px; padding:30px 0 4px 0; line-height:1.6em; letter-spacing:.05em; margin-left:40px; }
#introduction h2 a{color:#E96500; font-size:13px; text-decoration:none;}
#introduction p{margin-left:430px; background:url("images/symbolTriangle333.gif") no-repeat 0 50%; padding-left:14px;}
#introduction p a{ color:#E96500; font-size:18px; border-bottom:1px solid #333; }
#introduction p a:hover{border-bottom:1px solid #E96500; }
#introduction .innerWrapper{background:#000 url("images/myMug.gif") no-repeat 691px 0; min-height:191px;}


#contentHeader{background-color:#517B95;  margin-top:20px;}
#contentHeader h3{padding:10px 0 10px 76px; color:#fff; text-shadow:0px 1px 1px #394D59; font-size:17px;}

#news{width:400px; float:left; border-right:1px solid  #517B95; padding:25px 0px 100px 0; color:#fff; margin-left:50px;}
#news h2{font-size:16px; border-bottom:1px solid  #517B95; font-weight:normal; padding-bottom:2px; font-size:17px; text-shadow:0 2px 1px #517B95;}
#news .entry {border-bottom:1px solid #517B95; clear:both; padding:10px;  background-color:#608BA8;}
#news .entry dl{padding:10px;}
#news .entry dt{width:310px;  clear:both; font-size:12px;}
#news .entry dd{float:right; position:relative; top:-18px; font-size:11px;}
#news .entry.last{border-bottom:none;}
#news .entry.hover{background-color:#82A8C0; text-shadow:; text-shadow:0 2px 1px #517B95;}

.dualColumn h2, .dualColumn h4{text-shadow:0 2px 1px #517B95;}

.rightColumn {color:#fff; float:left; padding:30px 0 0 40px; font-size:12px; width:240px;}
.rightColumn.index{width:230px; float:left; padding:30px 0 0 35px;}
.rightColumn h4{border-bottom:1px solid #517B95; padding:0 0 3px 3px; font-size:14px; clear:left; text-shadow:0 2px 1px #517B95;}

.rightColumn div{clear:left; padding-top:0px;}
.rightColumn div.firstChild{padding-top:0;}
.rightColumn .promoItem{color:#fff; margin-bottom:20px;}

.rightColumn .promoItem.rss{background:url("images/symbolRssIcon.jpg") no-repeat left top; padding-left:90px; height:100px;}
.rightColumn .promoItem.twitter{background:url("images/twitter-ico-landingpage.jpg") no-repeat left top; padding-left:90px; padding-top:10px;height:90px; }
.rightColumn .promoItem.featuredWork.mp{background:url("images/colored-mp-logo.jpg") no-repeat left top; padding-left:90px; padding-top:10px;height:90px;}
.rightColumn .promoItem h4{border-bottom:none; font-weight:normal; font-size:17px; padding:0;}
.rightColumn .promoItem p{font-size:12px; font-weight:normal; width:250px;}
.rightColumn .promoItem ul.userControl li{float:left; padding-right:12px;}
.rightColumn .promoItem ul.userControl li a{color:#454545; font-size:12px;  border:none;}
.rightColumn .promoItem ul.userControl li a:hover{color:#fff;  border:none;}
/*
.rightColumn .promoItem a{color:#454545;}
.rightColumn .promoItem a:hover{color:#fff;}
*/

.rightColumn .promoItem a{border-bottom:1px dotted #333;}
.rightColumn .promoItem a:hover{border-bottom:1px dotted #fff;}


.rightColumn ul{padding:0px 0 0 2px;}
.rightColumn ul li{padding:0 0 5px 0;}





/* service */
#serviceContent{padding-bottom:60px;}
#serviceNav{ margin-left:80px; padding:22px 0 12px 0;}
#serviceNav li{float:left; padding-right:30px;}
#serviceNav li a{color:#416271; font-weight:bold}
#serviceNav li a:hover{color:#e0e0e0;}
#serviceNav li.selected a{color:#f8f8f8;}
.serviceDescription{font-size:12px; clear:both; border-top:1px solid #598194; padding:20px 200px 24px 0; margin:8px 0 0 82px; color:#fff; width:600px;}
div.serviceSet{width:300px; float:left; margin:0 40px 0 82px;}
div.serviceSet h3{color:#fff; border-bottom:1px dotted #40616F; font-size:14px; padding:3px 4px; letter-spacing:.08em;}
div.serviceSet ul{padding:4px 0 0 6px;}
div.serviceSet ul li{color:#fff; font-size:12px; background:url(images/symbolListCircle.jpg) no-repeat left 10px; padding:3px 0 6px 12px;}


/* move from laptop css */
div.pageContent{padding-bottom:60px;}

/* about */
div.aboutContent{color:#fff; padding:20px 0 0 36px; width:764px;}
div.aboutContent a{border-bottom:1px dotted #333;}
div.aboutContent a:hover{border-bottom:1px dotted #fff;}
div.aboutContent.testIndent{padding:20px 0 0 56px; width:744px;}
div.aboutContent .dualColumn{ width:410px; font-size:12px; float:left;}
div.aboutContent .dualColumn h3{color:#fff; border-bottom:1px solid #517B95; font-size:14px; padding:3px 4px; letter-spacing:.08em;}
div.aboutContent .dualColumn p{padding:5px 0 10px 4px;}
div.aboutContent .dualColumn.right{width:300px; margin:20px 0 0 50px;}
div.aboutContent .dualColumn.right p{padding:0;}
div.aboutContent .dualColumn.right div{margin-bottom:20px;}
div.aboutContent .dualColumn.right div.twitter{background:url("images/twitter-ico-landingpage.jpg") no-repeat left top; padding-left:81px; padding-top:10px; height:90px;}
div.aboutContent .dualColumn.right div.linkedin{background:url("images/linkedin-withBG.jpg") no-repeat left top; padding-left:85px; padding-top:0px; height:90px;}



#footer{border-top:10px solid #517B95; text-align:right; font-size:11px;}  /* margin-top will probably not work in ie6/7 */
#footer ul{float:right;  padding:8px 0 0 0;}
#footer ul li{text-align:right; float:left; }
#footer ul li a{color:#f2f2f2; padding:0 4px;}
#footer p{clear:both; float:right; color:#f2f2f2; padding-right:8px;}

.clear{clear:both;}

.contactContent{color:#fff; padding:30px 0 0 80px;}
.contactContent p{text-align:center;}
.contactContent dl.contactForm{padding-top:30px;}
.contactContent dl.contactForm dt{float:left; width:200px; text-align:right; padding:5px 20px 0 0;}
.contactContent dl.contactForm dd{padding-bottom:10px;}
input.standardTextBox, textarea.standardTextBox{border:10px solid #517B95; width:300px; padding:5px; color:#343434;}
textarea.standardTextBox{height:130px; font-family:lucida grande; font-size:11px;}
.standardSubmit{border:none; border:2px solid #416271; background-color:#517B95; color:#fff; padding:4px; font-size:13px;}
.standardSubmit:hover{border-color:#f2f2f2; }
.contactContent .error{position:relative; left:500px; top:-37px; width:300px;}
.contactContent .submitBox{padding-top:14px;}

.entryContent{color:#fff; float:left; padding:20px 0 0 40px; width:545px; font-size:12px;}
.entryContent p{padding:0 0 20px 0;}
.entryContent p img{float:left; padding-right:12px;}
.entryContent ul{padding:0 0 20px 20px;}
.entryContent ul li{color:#fff; font-size:12px; background:url(images/symbolListCircle.jpg) no-repeat left 10px; padding:2px 0 2px 12px;}
/*
#entryContainer .rightColumn{color:#fff; float:left; padding:20px 0 0 20px; font-size:12px; width:240px;}
#entryContainer .rightColumn h4{border-bottom:1px solid #598194; padding:0 0 3px 3px; font-size:14px;}
#entryContainer .rightColumn ul{padding:6px 0 0 4px;}
#entryContainer .rightColumn ul li{padding:0 0 5px 0;}
#entryContainer .rightColumn ul li a{display:block; color:#e2e2e2;}
#entryContainer .rightColumn ul li a:hover{color:#fff;}
*/
/*  breakoff introduction as class because it ID overrides a direct class */
#introduction h2.noBorder{border:none;}

/* contact form */
div.wpcf7{position:relative;}
div.wpcf7-mail-sent-ok{border:none; color:#398F1A;}
div.wpcf7-validation-errors{border:none; color:#ff0000;}
div.wpcf7-mail-sent-ng{border:none;}
div.wpcf7-spam-blocked {border:none; color:#ff0000;}
div.wpcf7-response-output{width:215px; position:absolute; left:640px; top:45px; color:#fff;}
/* hide inline errors - eventually reposition with relative */
div.wpcf7 span.wpcf7-not-valid-tip{display:none;}