body {
    background-color: #ffffff;
}

/* paragraph of text */
p
{ 
FONT-FAMILY: Open Sans;
FONT-SIZE: 10pt;
FONT-WEIGHT : normal;
COLOR: #676767; 
}

b
{ 
FONT-FAMILY: Open Sans;
FONT-SIZE: 10pt;
FONT-WEIGHT : bold;
COLOR: #676767; 
}

/* Bullets in a list */
li
{ 
FONT-FAMILY: Open Sans;
FONT-SIZE: 10pt;
FONT-WEIGHT : normal;
COLOR: #676767; 
}

/* Hyperlink Links */
a:link 
{
FONT-FAMILY: Open Sans;
FONT-SIZE: 10pt;
FONT-WEIGHT : normal;
TEXT-DECORATION: underline;
COLOR: #0191C8; 
}

a:visited 
{
FONT-FAMILY: Open Sans;
FONT-SIZE: 10pt;
FONT-WEIGHT : normal;
TEXT-DECORATION: underline;
COLOR: #0191C8;
}

a:hover 
{
FONT-FAMILY: Open Sans;
FONT-SIZE: 10pt;
FONT-WEIGHT : normal;
TEXT-DECORATION: none;
COLOR: #0191C8;
}

a.HotJobsStyle:link 
{ 
FONT-FAMILY: Open Sans;
FONT-SIZE: 10pt;
FONT-WEIGHT : normal;
COLOR: #4c835c;
TEXT-DECORATION: none; 
}

a.HotJobsStyle:visited
{ 
     FONT-FAMILY: Open Sans;
     FONT-SIZE: 10pt;
     FONT-WEIGHT : normal;
     COLOR: purple;
     TEXT-DECORATION: none; 
}

a.HotJobsStyle:hover
{ 
     FONT-FAMILY: Open Sans;
     FONT-SIZE: 10pt;
     FONT-WEIGHT : normal;
     COLOR: #4c835c;
     TEXT-DECORATION: underline; 
}

a.ApplyNowStyle:link 
{ 
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT : normal;
    COLOR: #0191C8;
    TEXT-DECORATION: none;	
}

a.ApplyNowStyle:visited
{ 
    FONT-FAMILY: Open Sans; 
    FONT-SIZE: 10pt;
    FONT-WEIGHT : normal;
    COLOR: #0191C8;
    TEXT-DECORATION: none;  
}

a.ApplyNowStyle:hover
{ 
    FONT-WEIGHT : normal;
    FONT-FAMILY: Open Sans; 
    FONT-SIZE: 10pt;
    COLOR: #0191C8;
    TEXT-DECORATION: underline;  
}

a.JobLink:link 
{ 
    FONT-FAMILY: Open Sans;  
    FONT-SIZE: 10pt;
    FONT-WEIGHT: bold;
    TEXT-DECORATION: none;
}
a.JobLink:visited {
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: bold;
    TEXT-DECORATION: none;
}

a.JobLink:hover
{ 
    FONT-FAMILY: Open Sans; 
    FONT-SIZE: 10pt;
    FONT-WEIGHT: bold;
    TEXT-DECORATION: underline;
}

a.ReqSort:link 
{    
    FONT-FAMILY: Open Sans; 
    FONT-SIZE: 10pt;
    FONT-WEIGHT : bold;
    TEXT-DECORATION: none;	
}

a.ReqSort:visited
{     
    FONT-FAMILY: Open Sans; 
    FONT-SIZE: 10pt;
    FONT-WEIGHT : bold;
    TEXT-DECORATION: none;
}

a.ReqSort:hover
{ 
    FONT-FAMILY: Open Sans; 
    FONT-SIZE: 10pt;
    FONT-WEIGHT : bold;
    TEXT-DECORATION: underline;
}


TH.HeaderRow
{
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: bold;
    TEXT-ALIGN: left;
    BORDER-TOP: 1px solid #676767;
    BORDER-BOTTOM: 1px solid #676767;
}

TD.MainRow
{
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: normal;
    COLOR: #676767;
    TEXT-ALIGN: left;
    BACKGROUND-COLOR: white;
}

TD.AltRow
{ 
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: normal;
    COLOR: #676767;
    TEXT-ALIGN: left;
    BACKGROUND-COLOR: #f1f1f1;
}

TD.HeaderStyle {
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 12pt;
    FONT-WEIGHT: bold;
    COLOR: #676767;
    TEXT-DECORATION: none;
    text-transform: uppercase;
}

TD.JDHeaderStyle
{
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: bold;
    COLOR: #676767;
    TEXT-DECORATION: none;
}

TD.CaptionStyle
{
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: bold;
    COLOR: #676767;
    TEXT-DECORATION: none;
}

span.CaptionStyle
{
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: bold;
    COLOR: #676767;
    TEXT-DECORATION: none;
}

TD.MainBodyText
{
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: normal;
    COLOR: #676767;
}

span.MainBodyText {
    FONT-FAMILY: Open Sans;
    FONT-SIZE: 11pt;
    FONT-WEIGHT: normal;
    COLOR: #676767;
    TEXT-DECORATION: none;
}



/* controls overall width of content*/
.container {
    max-width: 80%;
    margin: 0 auto;
    position: relative;
}

body h3, .row .col h3, .toggle h3 a, .ascend #respond h3, .ascend h3#comments, .woocommerce ul.products li.product.text_on_hover h3 {
    font-family: Lovelo, sans-serif !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 20px;
    line-height: 28px;
    font-weight: bold;
}

/* sf menu is the menu under the logo at the top of the screen */
.sf-menu li {
    float: left;
    line-height: 12px !important;
    font-size: 12px !important;
    position: relative;
}

.sf-menu li {
    float: left;
    position: relative;
}

.sf-menu a {
    margin: 0 1px;
}

.sf-menu, .sf-menu * {
    list-style: none outside none;
    margin: 0;
    padding: 0;
    z-index: 10;
    padding: 4px;
}

/* Controls page header on blue background*/
body #page-header-bg h1, html body .row .col.section-title h1 {
    font-family: Open Sans;
    font-size: 32px;
    line-height: 42px;
}

#page-header-bg h1, body h1, body .row .col.section-title h1 {
    font-family: Montserrat;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 52px;
    line-height: 58px;
    font-weight: 700;
}

#page-header-bg {
    background-color: #0191C8;
    background-image: none;
    color: white;
    font-family: Open Sans;
    font-size: 18px;
    background-color: rgb(1, 145, 200);
    background-image: none;
    height: 93.75px;
    overflow: visible;
    margin-bottom: 0;
}

page-header-bg h1 {
    font-family: 'OpenSansSemibold';
    font-size: 32px;
    line-height: 58px !important;
    margin-bottom: 0;
    display: block;
    color: #fff;
    z-index: 101;
}

#page-header-bg h1, body h1, body .row .col.section-title h1 {
    text-transform: uppercase;
    letter-spacing: 2px;
}

/* These are to style and position the menu under the logo */
header#top nav > ul > li > a {
    font-family: Lovelo, sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 14px;
    line-height: 19.6px;
    font-weight: bold;
}
header#top nav > ul > li > a {
    padding-bottom: 42px;
    padding-top: 30px;
}
header#top nav ul li a {
    color: #888;
}
header#top .span_9 {
    position: static !important;
}

header#top nav > ul > li {
    float: left;
}
header#top nav ul li {
    float: right;
}
header#top nav > ul > li > a {
    padding-bottom: 42px;
    padding-top: 30px;
}

header#top #logo img {
    max-height: 100px;
    text-indent: -9999px;
    max-width: none;
    width: auto;
    transition: opacity 0.4s ease;
}

/* This will set the width for all of the fields on refer friend screen. */
#CRAppSSMain1_tblReferFriend * {
    width: 250px !important;
}

#CRCareers1_tblTable {
    padding-top: 50px;
    padding-bottom: 30px;
    margin-left: 50px;
    width: 90%;
}
/**************************************************************************************/
/*for screens up to 690 wide*/
@media only screen and (min-width: 1px) and (max-width: 690px) {
    .container {
        max-width: 100% !important;
    }

    .mobile-menu {
        display: block !important;
    }


    header#top, #header-outer, #logo {
        height: auto !important;
        height: 24px !important;
        margin-top: -3px !important;
        position: relative;
    }

    #header-space {
        margin-bottom: 0;
    }

    body {
        background-color: #ffffff;
        width: 100% !important;
    }

    label.CaptionStyle {
        width: 100px;
    }

    /* Controls page header on blue background*/
    body #page-header-bg h1, html body .row .col.section-title h1 {
        font-family: Open Sans;
        font-size: 32px;
        line-height: 42px;
        margin-left: 10%;
    }

    #page-header-bg {
        margin-top: 160px !important; /* allows margin above page title*/
        width: 95%;
    }

    label.CaptionStyle, label.RequiredCaptionStyle {
        FONT-SIZE: 8pt !important;
    }


    /* Limit size of form fields and tables for small screen*/
    #CRAppSSMain1_txtFirstName, #CRAppSSMain1_txtMiddleName, #CRAppSSMain1_txtLastName,
    #CRAppSSMain1_txtNickName, #CRAppSSMain1_txtHomeStreet1, #CRAppSSMain1_txtHomeStreet2 {
        max-width: 60% !important;
    }

    #CRAppSSMain1_tblDDMain, #CRCareers1_lblBrowseInstTable {
        width: 60% !important;
    }

    #CRCareers1_tblTable {
        max-width: 60% !important;
    }

    #CRCareers1_tblTableDetail, #CRCareers1_tblTableDetail2 {
        margin-left: -25px !important;
        max-width: 50% !important;
    }

    #CRCareers1_lblIntro #CRCareers1_tblPageGroup {
        max-width: 60% !important;
        width: 60% !important;
    }

    #CRCareers1_lblBrowseInstGroup, #CRCareers1_Table2 {
        max-width: 90% !important;
        width: 90% !important;
    }

    .RadUpload .ruFakeInput {
        width: 30px !important;
    }

    input#CareersKeyword {
        width: 80px !important;
    }
    /* This will set the width for all of the fields on refer friend screen. */
    #CRAppSSMain1_tblReferFriend * {
        width: 50px !important;
    }

    .HeaderRow, #CRCareers1_tblTableDetail2 > tbody > tr:nth-child(1) > th:nth-child(1) {
        width: 10% !important;
    }
}
