/*   

MAIN.CSS
Contains:    Basic Template, Layout, and Typography
For:         Awe.sm
By:          Joey @ Goose Rock Design : gooserockdesign.com
             joey@gooserockdesign.com
Created:     04/27/11 Joey

*/

@import 'reset.css';
@import 'depot.css';
@import 'helveticaNeue.css';

/* -----  HTML & Body  ----- */
html {font-size:100.01%; height: 100%;}
body { 
    height:100%;
    font-family:HelveticaNeueRoman,Helvetica,Verdana,sans-serif;
    font-size:13px;
    background:#fff url('../images/bg-body.png') repeat 0 0;
    color:#253238;}
    
/* -- Inner Sections -- */
.inner, #content {
    position:relative;
    width:952px;
    /*width:870px;*/
    margin:0 auto; }
    
/* -- Header -- */
#header{
    position:relative;
    width:100%;
    height:99px;
    background:#fff url('../images/bg-header.png') repeat-x bottom; }
    #header #logo {
        position:absolute;
        top:41px;
        left:0; }
        #header #logo img { border:0; }

/* -- Navigation & Top Navigation -- */
#navigation,
#topNavigation {
    position:absolute;
    top:50px;
    right:0; }
#topNavigation { top:6px; }
    #navigation li,
    #topNavigation li{
        display:inline-block;  /* IE[display:inline] */
        vertical-align:top;
        list-style-type:none; }
/* -- old three-items top nav; through Oct 2011 -- */
/*    #navigation li { margin:0 0 0 68px; } */
/* -- four-items top nav; Oct 20 2011 jec -- */
      #navigation li { margin:0 0 0 34px; } 


    #navigation a {
        padding:4px 0 4px;
        margin:0;
        font-size:20px;
        line-height:28px;
        font-family:DepotMedium,Futura,Arial,sans-serif;
        text-decoration:none;
        color:#112f46;
        -webkit-transition: color 0.2s ease-in-out;
        -moz-transition: color 0.2s ease-in-out;
        -o-transition: color 0.2s ease-in-out;
        -ms-transition: color 0.2s ease-in-out;
        transition: color 0.2s ease-in-out;}
    #navigation a.current,
    #navigation a:hover { color:#F49038; }
    #topNavigation a {
        padding:6px 0 10px;
        margin:0 18px;
        font-size:12px;
        text-decoration:none;
        text-transform:uppercase;
        font-family:DepotMedium,Futura,Arial,sans-serif;
        color:#49565b;
        -webkit-transition: color 0.2s ease-in-out;
        -moz-transition: color 0.2s ease-in-out;
        -o-transition: color 0.2s ease-in-out;
        -ms-transition: color 0.2s ease-in-out;
        transition: color 0.2s ease-in-out;}
    #topNavigation a.nav-sign-in { font-family:DepotBold,Futura,Arial,sans-serif; margin-right:0; }
    #topNavigation a.current,
    #topNavigation a:hover { color:#EC832E; }
    
/* -- Masthead Section -- */
#masthead {
    position:relative;
    background:transparent url('../images/bg-masthead.jpg') repeat-x 0 0;
    width:100%;
    padding-bottom:13px;}
    #masthead h1 {
        font-size:43px;
        font-family:DepotBold,Futura,Arial,sans-serif;
        font-weight:normal;
        color:#fff;
        line-height:52px;
        text-shadow:0 0 9px #000;
        text-shadow:0 0 9px rgba(0,0,0,0.6); 
        padding:23px 0 10px; }
    #masthead h2 {
        font-size:19px;
        line-height:25px;
        color:#fff;
        padding-bottom:20px;
        letter-spacing:1px;
        font-family:HelveticaNeueLight,Helvetica,Verdana,sans-serif;}
    .interior #masthead h2 { color:#a4cfe1; }
    #masthead h2 strong,
    #masthead h2 b { font-weight:bold; }
    
    /* - Tabs - */
    #masthead #tabs { margin:0; padding:0; }
        #masthead #tabs li {
            display:inline-block;  /* IE[display:inline] */
            vertical-align:bottom;
            margin:0 -3px 0 0;} 
        #masthead #tabs a {
           display:block;
            font-size:16px;
            font-family:DepotMedium,Futura,Arial,sans-serif;
            background:#2a708e url('../images/bg-tabs-inactive.png') repeat-x bottom;
            color:#fff;
            padding:10px 40px 15px;
            border-top:1px solid #397e9d;
            border-right:1px solid #084763;
            border-left:1px solid #498fab;
            text-decoration:none;
            -webkit-transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;}
        #masthead #tabs a:hover,
        #masthead #tabs a.current{
            background:#fff;
            color:#2a2c2d;}
        #masthead #tabs a.current {
            padding-top:16px;
            -webkit-border-top-left-radius: 3px;
            -webkit-border-top-right-radius: 3px;
            -moz-border-radius-topleft: 3px;
            -moz-border-radius-topright: 3px;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px; }
    
/* -- Step Pager -- */
#pager {
    position:relative;
    width:100%;
    border-bottom:1px solid #c2ced2;
    border-top:1px solid #7d929f;
    background:#e0eaee; }
    #pager ul {
        list-style-type:none;
        padding:0; }
    #pager li {
        display:inline-block;
        vertical-align:top; }
    #pager a {
        position:relative;
        display:block;
        border:1px solid #e0eaee;
        border-width:0 1px;
        font-family:HelveticaNeueRoman,Helvetica,Verdana,sans-serif;
        font-size:19px;
        color:#1d3c52;
        text-decoration:none;
        text-align:center;
        padding:32px 38px;
        text-shadow:1px 1px 0 #fff;
        text-shadow:1px 1px 0 rgba(255,255,255,0.4);
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;}
        #pager a strong { font-weight:bold; }
        #pager a img { 
            position:absolute;
            bottom:-20px;
            z-index:999;
            left:38%;
            display:none; }
    #pager a:hover,
    #pager a.current { background:#c5d4d8; border-color:#bbcacf;}
    #pager a.current img { display:block; }
    
/* -- Documentation Link -- */

/* -- Temporary platform-announce toast til Jeremiah fixes it -- */
.btn-documentation2 {
    position:relative;
    display:block;
    text-align:center;
    font-size:25px;
    color:#ffffff;
    height:25px;
    padding:25px 0;
    margin-top:-19px;
    text-decoration:none !important; 
    font-family:DepotRegular,Futura,Verdana,sans-serif;
    background:#256f90 }
    .btn-documentation2 strong,
    .btn-documentation2 b { 
        font-family:DepotBold,Futura,Verdana,sans-serif;
        color:#ee8700;
        font-weight:normal;
        text-decoration:underline !important; }
.btn-documentation2:hover { text-decoration:none !important; }

.btn-documentation {
    position:relative;
    display:block;
    width:950px;
    left:-33px;
    text-align:center;
    text-shadow:1px 1px 0 #fff;
    text-shadow:1px 1px 0 rgba(255,255,255,0.7);
    font-size:20px;
    color:#252829;
    height:34px;
    padding:14px 0;
    margin-top:-19px;
    text-decoration:none !important; 
    font-family:DepotRegular,Futura,Verdana,sans-serif;
    background:#fff url('../images/bg-btn-documentation.png') repeat-x 0 0; }
    .btn-documentation strong,
    .btn-documentation b { 
        font-family:DepotBold,Futura,Verdana,sans-serif;
        color:#ee8700;
        font-weight:normal;
        text-decoration:underline !important; }
.btn-documentation:hover { text-decoration:none !important; }
        
/* -- Main Content Area & Typography -- */
#content { padding:25px 0; }
    #content h1 {
        font-size:44px;
        color:#2a2c2d;
        font-family:DepotBold,Futura,Arial,sans-serif;
        font-weight:normal;
        padding:15px 0 0;
        line-height:52px; }
    #content h2 {
        font-size:19px;
        line-height:28px;
        color:#456271;
        padding-bottom:20px;
        letter-spacing:1px;
        font-family:HelveticaNeueLight,Helvetica,Verdana,sans-serif;}
    #content h2 strong,
    #content h2 b { font-weight:bold; }
    #content h3,
    #whatWeDo h3,
    #signUp h3,
    #message h3{
        font-size:27px;
        line-height:33px;
        padding:40px 0 20px;
        color:#112f46;
        font-family:DepotMedium,Futura,Arial,sans-serif;
        font-weight:normal; }
    #content h3 a { color:#112f46; text-decoration:none;  }
    #content h3 a:hover { color:#EC832E; text-decoration:none;}
    #content .box .leftColumn h3,
    #content .box .rightColumn h3 { padding-top:26px; }
    .single #content .box .leftColumn h3 { padding-top:0; }
    .search #content .box .leftColumn h3,
    .blog #content .box .leftColumn h3 { padding-top:13px; padding-bottom:0;}
    #content .box h3,
    #content .box .noBorder h3{ padding:20px 0 10px 0; }
    #content h4,
    #message h4,
    #freeMeansFree h4{
        font-size:19px;
        padding:20px 0 0 0;
        color:#456271;
        letter-spacing:1px;
        font-family:HelveticaNeueRoman,Helvetica,Verdana,sans-serif;
        font-weight:normal;
        line-height:28px; }
    .search #content h4,
    .blog #content h4,
    .single #content h4 {
        font-size:19px;
        line-height:28px;
        color:#456271;
        padding:0 0 3px 0;
        letter-spacing:1px;
        font-family:HelveticaNeueLight,Helvetica,Verdana,sans-serif; }
    .search #content .rightColumn h4,
    .blog #content .rightColumn h4,
    .single #content .rightColumn h4 { padding-top:20px; }
        #content h4 a { color:#456271; text-decoration:underline; }
        #content h4 a:hover { color:#EC832E; }
    #content h5 { padding:0; line-height:18px; margin:0; font-size:13px; font-weight:normal; }
    #content p,
    #message p,
    #freeMeansFree p,
    #content li,
    #content td,
    #content label,
    #content address{
        font-weight:normal;
        line-height:22px;
        padding:11px 0;}
    #content p small { font-size:10px; }
    #content li { padding:5px 0; }
        #content .noBorder p { font-size:14px; }
    #content strong,
    #content b { font-weight:bold; } 
    #content em { font-family:HelveticaNeueItalic,Verdana,Arial,sans-serif; }
    #content a {
        text-decoration:underline;
        color:#2b708f;
        -webkit-transition: color 0.2s ease-in-out;
        -moz-transition: color 0.2s ease-in-out;
        -o-transition: color 0.2s ease-in-out;
        -ms-transition: color 0.2s ease-in-out;
        transition: color 0.2s ease-in-out; }
    #content a:hover { color:#EC832E; }
    
    /* Blockquotes for the blog */
    #content blockquote {
        background:#f7f7f7;
        padding:10px;
        margin:10px;
        border:1px solid #eee; }
    
    #content ul li { list-style-type:disc; margin-left:20px; padding-bottom:0;}
    #content ol li { list-style-type:decimal; margin-left:20px; }
        #content ol li ul li { list-style-type:disc; }
    .what-we-do #content .leftColumn ul { padding-left:310px; }
    
    #content address {
        font-size:13px;
        line-height:18px;
        color:#253238; }
        
    #content sup { vertical-align:super; color:#999 !important; font-size:10px !important; text-decoration:none !important;}
        
    /* -- Content Area Boxen -- */
    #content .box,
    #freeMeansFree .box{
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        border:1px solid #c2c2c4;
        background:#fff;
        padding:20px 33px;}
        #content .box hr {
            position:relative;
            left:-33px;
            top:6px;
            /*border-bottom:1px solid #d4dde0;*/
            border-color:#D4DDE0;
            color:#D4DDE0;
            background:#D4DDE0;
            height:1px;
            border-width:0;
            width:952px;
            clear:both;}
            
/* -- Columns -- */
.leftColumn,
.rightColumn {
    position:relative;
    display:inline-block;  /* IE[display:inline] */
    vertical-align:top; }
.leftColumn { 
    width:510px;
    border-right:1px solid #b2bfc2;
    padding:0 30px 0 0;}
.leftColumn.noBorder { border:none; }
.rightColumn { 
    width:305px;
    padding-left:30px; }
    
    
/* -- Message section -- */
#message {
    position:relative;
    width:100%;
    padding:10px 0;
    border-bottom:1px solid #c5cdd0;
    background:#e0e9ee; }
    #message h4 { color:#1d3c52; }
    #message p,
    #message a { color:#253238; }
    #message a { text-decoration:underline; }
    #message a:hover { text-decoration:none; }
    
/* -- What We Do section -- */
#whatWeDo {
    position:relative;
    width:100%;
    padding-bottom:30px;
    background:#e0eaee;
    border-top:2px solid #d2dee3;
    border-bottom:1px solid #b2bfc2; }
    #whatWeDo .quarter {
        position:relative;
        display:inline-block;  /* IE[display:inline] */
        vertical-align:top;
        width:205px; 
        height:350px;
        padding-bottom:40px;
        margin-right:40px; }
    #whatWeDo .quarter.last { margin-right:0; }
        #whatWeDo .quarter img {
            border:1px solid #979b9d; 
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px; }
        #whatWeDo .quarter h3 { margin:0; padding:10px 20px 15px 0; }
        #whatWeDo .quarter p {
            line-height:20px;
            font-size:14px; }
        #whatWeDo .quarter a.btn-blue {
            position:absolute;
            bottom:0;
            left:0; }
        #whatWeDo .quarter a.btn-blue:hover { bottom:-1px; }
        
/* -- Sign Up section & Free Means Free section -- */
#signUp,
#freeMeansFree{
    background:#fff;
    padding:40px 0 30px; }
#freeMeansFree { background:#e0e9ee; border-top:1px solid#c7d1d3; padding:40px 0 55px;}
    #signUp .leftColumn{ 
        width:597px;
        border:none; }
    #freeMeansFree .leftColumn { width:567px; width:560px; }
    #signUp .leftColumn { text-align:center; }
    #signUp .rightColumn,
    #freeMeansFree .rightColumn { width:280px; width:289px;}
        #signUp .rightColumn .box,
        #freeMeansFree .rightColumn .box{
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;
            padding:10px 10px 10px;
            padding:14px 14px 10px 14px;
            border:1px solid #c9c9c9; }
        #freeMeansFree .box { border-color:#bbbfc2 !important; background:#fff; }
        #signUp .leftColumn h3 { padding-top:10px; }
        #signUp .leftColumn .btn-orange-long { margin:0px auto; }
        #signUp .rightColumn h4,
        #freeMeansFree .rightColumn h4 {
            font-weight:normal;
            font-size:18px;
            color:#112f46;
            padding:3px 0 8px;
            font-family:DepotMedium,Futura,Arial,sans-serif; }
            
/* -- Clients & Testimonials section -- */
#clients {
    background:#d9e4e8;
    border-top:1px solid #eaf2f5;
    border-bottom:1px solid #d0d8db;
    padding:24px 0;}
    #clients .leftColumn { width:589px; }
    #clients .rightColumn { width:296px; }
        #clients .leftColumn a { display:block; float:left; margin:2px 22px; }
        #clients .rightColumn p {
            font-family:DepotLight,Helvetica,Verdana,sans-serif;
            font-size:14px;
            color:#253238;
            line-height:16px;
            padding:0; }
            #clients .rightColumn p strong,
            #clients .rightColumn p b { font-family:DepotRegular,Helvetica,Verdana,sans-serif; }
        #clients .rightColumn p:first-child {
            font-family:DepotLightItalic,Helvetica,Verdana,sans-serif;
            font-size:20px;
            line-height:25px;
            padding:0 0 15px;}
        
            

/* -- Buttons -- */
.btn {
    display:block;
    font-family:DepotBold,Futura,Arial,sans-serif;
    position:relative;
    text-align:center;
    text-decoration:none !important;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; }

    /* - Orange - */
    .btn-orange {
        font-size:22px;
        color:#fff !important;
        background:#f59539 url('../images/bg-btn-orange.png') repeat-x 0 0;
        padding:13px 0px;
        text-shadow:0px 1px 3px #000;
        text-shadow:0px 1px 3px rgba(0,0,0,0.8);
        border:1px solid #D8772b; }
    .btn-orange:hover { top:1px; }
        .btn-orange small {
            font-size:12px;
            text-shadow:none;
            display:block;
            font-family:HelveticaNeueBold,Helvetica,Verdana,sans-serif;
            line-height:23px; }
    .btn-cowperthwait {
        font-size:22px;
        color:#fff !important;
        background:#cccccc url('../images/bg-btn-cowperthwait.png') repeat-x 0 0;
        padding:13px 0px;
        text-shadow:0px 1px 3px #000;
        text-shadow:0px 1px 3px rgba(0,0,0,0.8);
        border:1px solid #999999; }


    
    /* - Long Orange - */
    .btn-orange-long {
        background-image: url('../images/bg-btn-orange-long.png');
        width:230px; }
        
    /* - Long Silver, Long Blue, and Long White - */
    .btn-gray,
    .btn-gray.transparent,
    .btn-blue,
    .btn-white{
        text-align:left;
        background:#e5ecf0 url('../images/bg-btn-gray.png') no-repeat 0 0;
        width:248px;
        height:29px;
        font-size:15px;
        line-height:29px;
        margin:7px 0;
        padding:0 5px !important;
        color:#2b708f !important;
        font-family:DepotMedium,Futura,Arial,sans-serif;}
    .btn-white {
        width:207px;
        height:30px;
        background:#fff url('../images/bg-btn-white.png') no-repeat 0 0; }
    .btn-gray:hover,
    .btn-white:hover { top:1px; }
    .btn-gray.transparent:hover { top:0; }
    .btn-blue { 
        background:#2b708f url('../images/bg-btn-blue.png') no-repeat 0 0;
        color:#fff !important;
        width:187px;
        padding-left:10px !important;
        -moz-box-shadow: 0px 0px 2px #000;
        -webkit-box-shadow: 0px 0px 2px #000;
        box-shadow: 0px 0px 2px #000;
        -moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.6);
        -webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.6);
        box-shadow: 0px 0px 2px rgba(0,0,0,0.6); }
    .btn-gray.transparent { background:none; padding-left:12px !important; }
        .btn-gray img,
        .btn-white img { float:left; margin-right:8px; }
        

/* -- Footer -- */
#footer {
    position:relative;
    width:100%;
    background:#173952 url('../images/bg-footer.jpg') repeat-x 0 0;
    padding-top:40px; }
    #footer .inner { height:220px; }
    
    /* Side-stacking footer navigation */
    #footer .inner > ul {
        float:left;
        padding-right:60px; }
        #footer ul > li,
        #footer ul > li > a {
            font-family:DepotBold,Futura,Arial,sans-serif;
            font-weight:normal;
            color:#fff;
            text-decoration:none;
            font-size:21px; }
        #footer ul > li a:hover { color:#d8782a; }
        #footer ul ul { padding-top:5px; }
        #footer ul ul li a {
            font-family:HelveticaNeueRoman,Helvetica,Verdana,sans-serif;
            font-size:12px;
            line-height:20px;
            color:#d9e4e9;
            text-decoration:none; }
        #footer ul a {
            -webkit-transition: color 0.2s ease-in-out;
            -moz-transition: color 0.2s ease-in-out;
            -o-transition: color 0.2s ease-in-out;
            -ms-transition: color 0.2s ease-in-out;
            transition: color 0.2s ease-in-out; }
            
    /* Disclaimer line */
    #footer #disclaimer {
        position:absolute;
        bottom:25px;
        left:0; }
        #footer #disclaimer p {
            font-size:12px;
            line-height:18px;
            color:#aabcc1; }
        #footer #disclaimer a {
            text-decoration:underline; 
            margin:0 4px 0 14px;
            color:#aabcc1; }
        #footer #disclaimer a:hover { text-decoration:none; }
        
    /* Social links */
    #footer #social {
        position:absolute;
        bottom:16px;
        right:0; }
        #footer #social p {
            width:251px;
            font-size:21px;
            color:#fff;
            font-family:DepotBold,Futura,Arial,sans-serif;
            line-height:40px;}
        #footer #social p > img { position:relative; top:7px; margin-right:8px;}
        #footer #social a {
            display:block;
            height:27px;
            width:27px; 
            margin:0 0 0 10px;
            padding:20px 0 0 0;
            float:right; }
            #footer #social a img { border:0; }
            
/* -- Basic Form Styles -- */
form .text { padding:4px 0px; }
#content form label { display:block; padding:0; }
    form .text input,
    form textarea {
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        border:1px solid #c2c2c4;
        background:#f7f7f7;
        font-size:16px;
        font-family:HelveticaNeueRoman,Helvetica,Verdana,sans-serif;
        padding:6px 10px;
        line-height:20px; }
    form .text input { width:300px; }
    form .smilies { padding-top:10px; }
    form textarea { width:520px; }
    form .form-submit input {
        font-size:22px;
        color:#fff !important;
        background:#f59539 url('../images/bg-btn-orange.png') repeat-x 0 0;
        padding:13px 21px;
        cursor:pointer;
        text-shadow:0px 1px 3px #000;
        text-shadow:0px 1px 3px rgba(0,0,0,0.8);
        border:1px solid #D8772b;
        display:block;
        font-family:DepotBold,Futura,Arial,sans-serif;
        text-align:center;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out; }
    #searchform .text input { width:194px; }
    form .form-submit input:hover { margin-top:1px; }
    form p.comment-note { font-size:11px; color:#aaa; line-height:15px; }
            
/* -- Some weird blog styles -- */
#content .leftColumn .entry iframe { margin-bottom:8px; }
#content .leftColumn .sociable .sociable_tagline { margin-top:6px; padding:2px 0; }
#content .leftColumn .sociable li { margin-left:4px; }
.search #content .leftColumn hr,
.blog #content .leftColumn hr { width:682px; margin-top:20px; }
#content .leftColumn #thecomments { margin-top:6px; }
        
/* -----  Classes  ----- */
.floatRight { float:right; }
.floatLeft { float:left; }
.alignLeft { text-align:left; }
.alignCenter { text-align:center; }
.alignRight { text-align:right; }
.clear { clear:both; }
.hidden { display:none; }

/* ----- Blog Classes ----- */
img.alignright { float:right; margin:0 0 10px 25px; }
img.alignleft { float:left; margin:0 25px 10px 0; }
img.alignrightpadded { float:right; margin:10px 10px 10px 25px; }


/* ----- Clear fix that Jeremiah promises me is important ----- */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* ----- Adding code formatting for blog posts; jec with input from jlc, 1/2012 ----- */
code {
font-family: monospace;
border: 1px solid #F0F0F0;
display: inline-block;
background-color: #FDFDFD;
padding: 0 .5em;
font-size: .9em;
}

pre {
margin: 10px;
font-family: monospace;
border: 1px solid #F0F0F0;
display: inline-block;
padding: 20px;
font-size: .9em;
}