/* ==|== primary styles =====================================================
   ========================================================================== */

/*Header and Masthead*/

#main{
    overflow:visible !important;   
}

.smallMasthead .masthead{
    max-width:1024px;  
    min-height:83px;
    background-color:#0e8fc5;
    background: -ms-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: -webkit-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: -moz-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: radial-gradient(circle, #44a8d2, #0e8fc5);
}

.smallMasthead .masthead>div{
    font-family:"Open Sans";
    font-weight:600px;
    font-size:19px;
    color:White;
    text-align:center;
    padding:15px 15% 15px 15%;
    max-width: 70%;
    width: 100%;
}

.smallMasthead .masthead>div.oneLine { padding-top: 27px; }

.bigMasthead .masthead>img{
    width:100%;
    max-height:260px;
}

.bigMasthead .masthead>div{
    font-family:Times New Roman;
    font-style:italic;
    font-size:16px;
    color:White;
    text-align:left;
    padding:5px 5% 9px 5%;
}

.bigMasthead .masthead{
    max-width:1024px;  
    min-height:83px;
    background-color:#0e8fc5;
    background: -ms-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: -webkit-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: -moz-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: radial-gradient(circle, #44a8d2, #0e8fc5);
}

/*Main Content*/  

.subRotator{
    padding:15px 0 0 0;   
} 

/*Funnel*/

.funnel .funnelBlock{
    display:inline-block;
    vertical-align:top;
    width:300px;
    background-color:#f1eedc;
    padding:10px;
    margin:20px 20px 20px 0;
}

.ie7 .funnel .funnelBlock{
    zoom: 1;
    display: inline;
}

.funnel .funnelBlock .featureImage{
    text-align:center;
}

.funnel .funnelBlock .featureImage img{
    border: 3px solid white;
    -webkit-box-shadow: 0px 0px 7px #434343;
    -moz-box-shadow: 0px 0px 7px #434343;
    box-shadow: 0px 0px 7px #434343;
}

.funnel .funnelBlock h3{
    clear: both;
    color: #98002e;
    font-family: "Open Sans";
    font-weight: normal;
    font-size: 16px;
    padding: 10px 0 5px 0;
    margin: 0;  
}

.funnel .funnelBlock ul{
    list-style-type:none;
    padding:0;   
}

.funnel .funnelBlock .linkList{    
    margin: 10px 0 0 0;
}

.funnel .funnelBlock li{
    margin:0 0 3px 0;   
}

.funnel .more{
    color:Black;
    font-weight:bold;
    font-size:11px;
    cursor:hand;
    cursor:pointer;
    display:none;
}
 
/*Right Column*/

.rightColumn{
    margin:0 0 10px 0;   
}

.rightColumn .callout{
    background-color:#e1dbbf;
    float:left;
    vertical-align:top;
    width:160px;
    padding:10px 25px 10px 10px;
    margin:0 10px 10px 0;
    position:relative;
    -moz-box-shadow: inset 8px 8px 8px -8px #ccc5a5;
    -webkit-box-shadow: inset 8px 8px 8px -8px #ccc5a5;
    box-shadow: inset 8px 8px 8px -8px #ccc5a5;
}

.rightColumn .callout>img{
    position:relative;
    top:-10px;
    left:-10px;   
}

.rightColumn .callout h2{
    font-family:"Open Sans";
    font-weight:600;
    font-size:14px;   
    margin:0 0 5px 0;
}

.rightColumn .callout .editableContent{
    font-family:Arial;   
    font-size:11px;
    line-height:16px;
}

.rightColumn .callout.noPhoto h2{
    margin-top:7px;
}

.rightColumn .photo{
    float:left;   
}

.rightColumn .border{
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:7px; 
}

.rightColumn .styleOne{ 
    background-color:#e1dbbf;
    background: -ms-radial-gradient(circle, #e2dcc0, #e1dbbf);
    background: -webkit-radial-gradient(circle, #e2dcc0, #e1dbbf);
    background: -moz-radial-gradient(circle, #e2dcc0, #e1dbbf);
    background: -ms-radial-gradient(circle, #e2dcc0, #e1dbbf); 
    position: relative;
    overflow: hidden;
}

.rightColumn .styleOne h2 {    
    color:#896d49;   
}

.rightColumn .styleOne .border{
    background-color:#896d49;      
}

.rightColumn .styleTwo{
    color:White;
    background-color:#36aada;       
    background: -ms-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: -webkit-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: -moz-radial-gradient(circle, #44a8d2, #0e8fc5);
    background: -ms-radial-gradient(circle, #44a8d2, #0e8fc5);
    position: relative;
    overflow: hidden;
}

.rightColumn .styleTwo h2 {    
    color:white;   
}

.rightColumn .styleTwo .border{
    background-color:#0c85b8;  
}

.rightColumn .linkList{
    list-style-type:none;   
}

.rightColumn .callout .linkList li a{
    padding:10px 0 10px 0;
    display:block;
    border-top:1px solid #ccc0a7;
}

.rightColumn .callout .linkList li:first-child a{
    border-top:none;
}

/*Middle Column*/

.addThis{
    clear:both;    
    margin: 20px 0 10px;
}

.addThis .twitter_share { top: 2px; position: relative; float: left; }
.addThis .fb_like_container { top: 2px; float: left; position: relative; width: 110px !important; overflow: hidden; }

/* ==|== media queries ====================================================== */

@media only screen and (min-width: 780px) {
    
    .addThis{
        display:block;   
    }
        
}

@media only screen and (min-width: 1024px) {
    
    .smallMasthead header{
        padding: 0 0 30px 0;
    }

    .bigMasthead header{
        padding: 0 0 285px 0;   
    }

    .bigMasthead.smallRotator header{
        padding: 0 0 260px 0;   
    }
    
    .smallMasthead .masthead{   
        position:relative;        
        top: -15px;
        margin: 0 auto -15px auto;     
    }
    
    .smallMasthead .masthead>div{
        position:absolute;
    }
    
    .smallMasthead .masthead:before{
        content:'';
        position:absolute;
        top:0;
        right:0;
        bottom:0;
        left:0;
        background-color:transparent;
        background-image: url("../img/masthead_bg_small.png");
        background-repeat:no-repeat;
        background-position:left top;        
    }
    
    .bigMasthead .masthead{
        position:relative;
        top:-270px;
        margin: 0 auto -270px auto;
    }
            
    .middleRightContainer{
        float:right;    
        width:70%;
        position:relative;
    }
   
    .rightColumn{
        width:195px;
        margin: 0 30px 0 0;
        position:relative;
        float:right;
        margin:0 30px 0 -195px;
    }
    
    .rightColumn .callout{        
        margin:0 0 10px 0;
    }
    
    .primaryContent .main{
        width:100%;
        max-width:465px;   
        float:left;
    }
    
    .primaryContent.twoColumns .main{
        max-width:100%;   
    }
    
    .story{
        float:left;
        width:115px;
        padding:0 20px 0 15px;
        margin:10px 0 10px 0;
        border-right:1px solid #dfd3bc;
    }    
    
    .twoColumns .main .story {
        width: 182px;
    }

    .story.future{
        border:none;   
    }
        
}

@media only screen and (min-width: 1085px) {
    
}
