/*  *   *   *   *   *   *   *   *   *   *   *

Universal Styles

Place all of your universal styles that apply to all site versions beneath this comment.

*   *   *   *   *   *   *   *   *   *   *   */

@font-face {
     font-family: 'Novecento-Bold';
     src: url('Novecentowide-Bold.otf');
}

@font-face {
     font-family: 'Novecento-Light';
     src: url('Novecentowide-Light.otf');
}

@font-face {
     font-family: 'Avenir-Book';
     src: url('AvenirLTStd-Book.otf');
}

* {
     color: #58595B;  
     font-family: Avenir-Book, Helvetica, Arial, sans-serif;
}

.blue {
     color: #569FD2;
}

.darkblue {
     color: #4986B1;
}

.orange {
     color: #E6A227;
     text-transform: uppercase;
     letter-spacing: 1px;
}

.darkorange {
     color: #BE871E;
}

.darkgray {
     color: #58595B;   
}

.gray {
     color: #808285;   
}

.bgblue {
     background-color: #569FD2;
}

.bgdarkblue {
     background-color: #4986B1;
}

.bgorange {
     background-color: #E6A227;
}

.bgdarkorange {
     background-color: #BE871E;
}

.bgdarkgray {
     background-color: #58595B;   
}

.bggray {
     background-color: #808285;   
}

.gradient {
     background: #569FD2; /* Old browsers */ 
}

.logo {
     width: 250px;   
}

.cp_bar {
     width: 100%;
     height: 25px;
     background-image: url(../_images/cp_bar.png);
     background-repeat: repeat-x;
     margin-top: 25px;
     background-size: 700px;
}

.video {
     background-color: #ffffff; 
     background-image: url(../_images/video_sprite.png);
     background-size: 200%;
     background-repeat: no-repeat;
     background-position: left;
     box-shadow: 0px 0px 1px #58595B;
}

.video:hover {
     box-shadow: 0px 0px 5px #58595B;
     background-position: right;
}

.consult, .connect, .health, .lobby, .experience {
     list-style: none;
     padding-left: 55px;
     background-size: 30px;
     background-repeat: no-repeat;
}

.consult {
     background-image: url(../_images/ic_account.png);   
}

.connect {
     background-image: url(../_images/ic_share.png);   
}

.health {
     background-image: url(../_images/ic_hosp.png);   
}

.lobby {
     background-image: url(../_images/ic_business.png);   
}

.experience {
     background-image: url(../_images/ic_school.png);   
}

.tagline {
    text-align: right;
    width: auto;
    display: inline-block;
    float: right !important;
    margin-top: 45px;
}    

.uppercase {
     text-transform: uppercase;
     letter-spacing: 1px;
}

header p {
     margin: 0px;
     padding: 0px;
     text-transform: uppercase;
     font-size: 16px;
     letter-spacing: 1px;
}

.callout h2, footer p {
    color: #ffffff;
    font-family: Novecentowide-Light, Helvetica-Neue, Helvetica, Arial, sans-serif;
    font-weight: 400;
    letter-spacing: 2px;
    line-height: 1.3;
    text-transform: uppercase;
}

div.left {
     width: 530px;
     float: left;
}

div.left ul {
    padding-left: 0px;
    list-style-position: outside;
}    

div.left ul li {
     margin-bottom: 15px; 
     border-bottom: 1px solid #569FD2;
     padding-bottom: 15px;
}

div.left ul li:last-child {
     border-bottom: 0px solid #000;   
}

div.right {
     width: 300px;
     float: right;
}

figure.video {
     margin: 0;
     padding: 0;
     width: 100%;
}

figure.video:before {
     content: " ";
     display: block;
     padding-top: 56%;
}

footer {
     padding: 15px 30px;   
}

h2 {
    font-size: 16px;
}

p {
    font-size: 13px;   
}


/*  *   *   *   *   *   *   *   *   *   *   *

Media Queries

*   *   *   *   *   *   *   *   *   *   *   */

/*  *   *   *   *   *   *   *   *   *   *   *

Desktop Styles

*   *   *   *   *   *   *   *   *   *   *   */

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

/*  *   *   *   *   *   *   *   *   *   *   *

Laptop Styles

*   *   *   *   *   *   *   *   *   *   *   */

@media screen and (min-width:960px) {
    body section, body article, body header, body footer {
        width: 900px;
    }    
    div.right {
        width: 300px;
    }
    div.left {
        width: 570px;
    }
}

/*  *   *   *   *   *   *   *   *   *   *   *

Tablet Styles

*   *   *   *   *   *   *   *   *   *   *   */

@media screen and (min-width:760px) and (max-width:959px) {
    body section, body article, body header, body footer {
        width: 700px;
    }    
    div.right, div.left {
         float: none;
         width: 100%;
         margin: 0 auto 30px;
    }
}

/*  *   *   *   *   *   *   *   *   *   *   *

Phablet Styles

*   *   *   *   *   *   *   *   *   *   *   */

@media screen and (min-width:667px) and (max-width:759px) {
    body section, body article, body header, body footer {
        width: 600px;
    }   
    div.right, div.left {
         float: none;
         width: 100%;
         margin: 0 auto 30px;
    }
    .tagline {
        text-align: left;
        width: 100%;
        display: block;
        float: none;
        margin-top: 0px;
    } 
}

/*  *   *   *   *   *   *   *   *   *   *   *

Phone Styles

*   *   *   *   *   *   *   *   *   *   *   */

@media screen and (max-width:666px) {
    body section, body article, body header, body footer {
        width: 90%;
    }    
    section, article, header, footer {
         padding: 30px 5%;   
    }  
    div.right, div.left {
         float: none;
         width: 100%;
         margin: 0 auto 30px;
    }
    .callout h2 {
         font-size: 16px;
         letter-spacing: 1px;
    }
    .tagline {
        text-align: left;
        width: 100%;
        display: block;
        float: none;
        margin-top: 0px;
    } 
    header p {
         font-size: 14px;   
    }
    .cp_bar {
         background-size: 100%;   
    }
}

/*  *   *   *   *   *   *   *   *   *   *   *

End Media Queries

*   *   *   *   *   *   *   *   *   *   *   */