﻿/* CSS 3.0 specification */
/* Author: bors235 */
/* Last updated: July 26, 2013 */

/*NOTE: See bottom of file for global styles */

/*hide certain items for desktop*/
    .tinynav {
        display: none;
    }

    .ui-widget-content a {
    color: #275FB7;
}

/* =========================================================*/
/* LANDSCAPE tablet device styles */
/* =========================================================*/
@media screen and (min-width: 769px) and (max-width: 960px) {
    .center {
        width: 100%;
        margin: 0 auto;
    }
    .container {
        background: none repeat scroll 0 0 #FFFFFF;
        margin: 0 auto;
        padding: 10px;
        width: 96.5%;
    }

    .body {
        padding: 0 10px;
    }

        .content {
        float: left;
        width: 73.127%;
        padding: 0 0 0 15px;
    }

    #body {
        font-size: 100%;
        padding-right: 0;
        padding-left: 0;
    }
    
    /* --------------------------- HEADER -------------------------- */
    #header {
        background-image: none;
        background: #9A9A7C url('../images/header_bg_scale.jpg') repeat-x top left;
        position: relative;
    }

    h1.branding {
        margin: 0;
        position: absolute;
        top: 20px;
        left: 20px;
        z-index: 100;
        width: 35%;
        height: 50%;
        background: url("../images/h1_branding_med.png") no-repeat scroll left 25% transparent;
    }

    #core {
        width: 100%;
        position: relative;
        top: 0;
        left: 0;
        background: transparent;
    }
    
    #title {
        padding: 10px 0;
    }

        #title h1.pageTitle {
            text-align: left;
            font: normal 25px/120% 'Lucida Sans Unicode','Lucida Grande', sans-serif;
            color: #374C59;
        }

        #title #tools1 {
            width: 112px;
        }

        #title #tools2 {
            width: 95px;
        }

        #title ul.dropdown {
            float: right;
            padding: 0 0 0 5px;
            border-left: 1px dotted #83989C;
        }

            #title ul.dropdown li {
                font: bold 8pt/16pt Arial, Helvetica, sans-serif;
                text-align: left;
                margin: .5em 0;
                height: 20px;
            }

                #title ul.dropdown li a {
                    text-decoration: none;
                    padding: 0 0 0 23px;
                }

                #title ul.dropdown li.spanish {
                    background: url('../images/tools_icon_spanish.gif') no-repeat left 50%;
                }

                #title ul.dropdown li.english {
                    background: url('../images/tools_icon_english.gif') no-repeat left 50%;
                }

                #title ul.dropdown li.contact {
                    background: url('../images/tools_icon_contact.gif') no-repeat left 50%;
                }

                #title ul.dropdown li.email {
                    background: url('../images/tools_icon_mail.gif') no-repeat left 50%;
                }

                #title ul.dropdown li.faq {
                    background: url('../images/tools_icon_faq.gif') no-repeat left 50%;
                }


    .pageNarrow {
        width: 450px;
    }
    /* sets the body width to full when there is no sidebar */
    .pageWide {
        width: 97%;
    }

    /* right panel for related and other websites for features */
    #sidebar {
        float: right;
        clear: both;
        width: 220px;
        padding: 0 0 10px 0;
    }

    .top-level #sidebar {
        margin-top: 8px;
    }

    #sidebar div.feature {
        width: 220px;
        height: 156px;
        margin-bottom: 20px;
    }

        #sidebar div.feature a {
            display: block;
            width: 220px;
            height: 156px;
        }

    .safetyImage {
        background: url('../images/feature_sa.jpg') no-repeat;
    }

    .claimsImage {
        background: url('../images/feature_ci.jpg') no-repeat;
    }

    .claimsImage2 a {
        background: url('../images/callouts/claimsins/workerscompchanges.jpg') no-repeat;
    }

    .rightsImage {
        background: url('../images/callouts/workplacerights/ECESFeature.png') no-repeat;
    }

    .tradesImage {
        background: url('../images/callouts/tradeslicensing/NewCards.jpg') no-repeat;
    }

    .tradesImage2 {
        background: url('../images/callouts/tradeslicensing/researchstudy.jpg') no-repeat;
    }

    #sidebar div.providersImage {
        width: 252px;
        height: 311px;
    }

        #sidebar div.providersImage a {
            width: 252px;
            height: 311px;
            background: url('../images/callouts/claimsins/providersurvey2.jpg') no-repeat;
        }

            #sidebar div.providersImage a:hover,
            .claimsImage2 a:hover {
                background-position: bottom;
            }

    #sidebar .survey {
        position: relative;
        left: 20px;
        width: 220px;
        text-align: left;
        padding: 13px 0;
    }

        #sidebar .survey a {
            display: block;
            height: 48px;
            background: url('../images/survey-right_bg.gif') right top no-repeat;
        }

            #sidebar .survey a:hover {
                text-decoration: none;
                background-position: right bottom;
            }

        #sidebar .survey p {
            color: #5E5F61;
            font-size: 0.85em;
            font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
            padding: 0 90px 0 0;
        }

            #sidebar .survey p strong {
                display: block;
                color: #275FB7;
                font-size: 1.3em;
                padding: 0 0 2px 0;
            }

        #sidebar .survey a:hover p strong {
            color: #AC560D;
        }

    #sidebar div.links {
        text-align: left;
        padding: 0 0 20px 0;
    }

        #sidebar div.links p {
            font-weight: bold;
        }

        #sidebar div.links ul {
            padding: 0 0 0 3px;
        }

            #sidebar div.links ul li {
                font-size: 1.0em;
                line-height: 125%;
                font-weight: normal;
                border-bottom: none;
            }

                #sidebar div.links ul li a {
                    display: block;
                    background: url('../images/nav_bullet_arrow.gif') no-repeat 0 8px;
                    padding: 4px 0 0 10px;
                }

                    #sidebar div.links ul li a:hover {
                        background-position: 0 -142px;
                    }

                    #sidebar div.links ul li a, #sidebar div.links ul li a:hover {
                        text-decoration: none;
                    }

    a#minorworkpermit {
        display: block;
        width: 455px;
        height: 70px;
        margin: 10px 0;
    }

    a#minorworkpermit {
        background: url('../images/callouts/workplacerights/minorworkpermitB.jpg') center top no-repeat;
        margin-bottom: 20px;
    }

        a#minorworkpermit:hover {
            background-position: center bottom;
        }

    .spacerFour {
        padding: 0 3px;
    }

    .textindent {
        margin-left: 15px;
    }

    /* page ratings at the bottom of all content 
    #pageRating {
        width: 450px;
        text-align: center;
        color: #676767;
        font-size: 11px;
    }

        #pageRating h5 {
            color: #E19A15;
            text-align: left;
        }

    #ratingScale {
        width: 380px;
        margin: 0 auto;
        text-align: center;
        color: #414141;
    }

    * html #ratingScale {
        width: 400px;
    }

        #ratingScale form {
            margin: 0;
            padding: 10px 5px 7px 5px;
            display: inline;
            background: #E19A15;
            background: -webkit-gradient(linear, 0% 0%, 100% 100%, from(#FEFCF8), to(#E19A15));
            background: -moz-linear-gradient(center right, #E19A15 15%,#FEFCF8 100%);
            background: linear-gradient(#FEFCF8, #E19A15);
        }

        #ratingScale span.statement {
            line-height: 300%;
        }

        #ratingScale input {
            margin: 8px 5px 0 5px;
        }

    #ratingResponse {
        margin: 15px 0;
    }
    */
    /* modal window styles ==================*/
    #mask {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        display: none;
        background-color: #D4D4D4;
    }

    .modal_window {
        /* common attributes for all modals on the page */
        position: absolute; /* important so that it can be center-positioned */
        background-color: #FFF;
        display: none;
        z-index: 999;
        border: 1px solid #666;
        -webkit-box-shadow: #666 0px 5px 7px;
        -moz-box-shadow: #666 0px 5px 7px;
        box-shadow: #666 0px 5px 7px;
        behavior: url('../css/PIE.htc');
    }

        .modal_window .closeButton a {
            position: absolute;
            background: url('../images/closeButton.png') top left no-repeat;
            height: 30px;
            width: 30px;
            top: -12px;
            right: -15px;
            cursor: pointer;
            z-index: 181;
            display: block;
        }
    /* modal window  */
    #survey_window {
        padding: 20px 20px 30px 20px;
        width: 830px;
        height: 435px;
        background-color: #FFF;
    }
    /* another modal window  */
    #help_window {
        padding: 30px;
        background-color: #FFF;
        width: 550px;
        height: 465px;
    }

    /* site down message*/
    div.siteDownMessage {
        position: relative;
        margin: 1.0em 10%;
        width: 500px;
        padding: 1.0em;
        border: 2px solid #ff6600;
        background: #FC6;
        background: -webkit-gradient(linear, 0 0, 0 bottom, from(#ffeec2), to(#faf5e6));
        background: -moz-linear-gradient(#ffeec2, #faf5e6);
        background: linear-gradient(#ffeec2, #faf5e6);
        -pie-background: linear-gradient(#ffeec2, #faf5e6);
        behavior: url('../CSS/PIE.htc');
    }

        div.siteDownMessage p {
            margin: 0;
            padding: 0;
            color: #000;
        }

    /* fixed right-bottom corner */
    #fixed-bottom {
        background: url('../images/take-survey.gif') 0 0 no-repeat;
        position: fixed;
        bottom: 0;
        right: 0;
        height: 80px;
        width: 85px;
    }

        #fixed-bottom span a {
            display: block;
            height: 80px;
            width: 85px;
        }
    /* fixed right-bottom corner */
    #fixed-bottomESP {
        background: url('../images/take-surveyESP.gif') 0 0 no-repeat;
        position: fixed;
        bottom: 0;
        right: 0;
        height: 80px;
        width: 85px;
    }

        #fixed-bottomESP span a {
            display: block;
            height: 80px;
            width: 85px;
        }

    
}
/*end LANDSCAPE tablet styles*/
/*==========================================================*/



/* =========================================================*/
/* PORTRAIT tablet device styles */
/* =========================================================*/
@media screen and (min-width: 569px) and (max-width: 768px) {
    
    /*body {
        text-align: center;
        font: normal 82% 'Lucida Sans Unicode','Lucida Grande','Trebuchet MS', sans-serif;
        padding: 5px 0;
    }*/

       
    /*containers*/
    #header {
        position: relative;
        top: 0;
        left: 0;
        background: url('../images/header_bg_scale.jpg') repeat-x top left #9A9A7C;
    }

    .content {
        float: left;
        width: auto;
        padding: 10px;
        text-align: left;
    }

    #core {
        position: relative;
        top: 80px;
        float: none;
        height: 40px;
        width: 100%;
    }

    /* branding -------------------------- */

    h1.branding {
        position: absolute;
        top: 20px;
        left: 15px;
        float: none;
        display: block;
        height: 50px;
        width: 175px;
        background: url('../Images/h1_branding_sm.png') no-repeat left top;
        margin: 0;
    }

        h1.branding span {
            display: none;
        }

    .center {
        width: 100%;
        margin: 0 auto;
    }

    /* content containers -------------------------- */

    /*.content {
        float: left;
        width: calc(643/910 *100%);
    }*/

    .container {
        width: 95.333%;
    }

         #body {
        margin: 0;
        padding: 0;
    }

    .ShowHide {
        display: none;
        border-bottom: 1px solid #DFDFDF;
        margin-bottom: 6px;
    }


    .top-level {
        width: 940px;
    }

        .top-level div#title {
            width: 705px;
            padding: 10px 0 10px 5px;
        }

        .top-level div#body {
            width: 700px;
            padding: 5px;
        }

    /* === SECTION FIRST LEVEL PAGES === */
    .toplevelColumn {
        float: left;
        width: 215px;
        background: url('../images/content_vr.gif') 320px 0 repeat-y;
        padding-right: 20px;
    }

    .last {
        background: none;
    }

    .toplevelColumn p a {
        text-decoration: none;
    }

    .toplevelColumn ul {
        padding: 0 0 10px 3px;
    }

        .toplevelColumn ul li {
            text-align: left;
        }

            .toplevelColumn ul li a {
                text-decoration: none;
            }

                .toplevelColumn ul li a.secure {
                    background: url('../images/icon_secure.gif') right no-repeat;
                    padding: 0 15px 0 0;
                }

    #title {
        padding: 0 0 10px 0;
    }

        #title h1.pageTitle {
            text-align: left;
            font: normal 25px/120% 'Lucida Sans Unicode','Lucida Grande', sans-serif;
            color: #374C59;
        }

        #title #tools1 {
            width: 112px;
        }

        #title #tools2 {
            width: 95px;
        }

        #title ul.dropdown {
            float: right;
            padding: 0 0 0 5px;
            border-left: 1px dotted #83989C;
        }

            #title ul.dropdown li {
                font: bold 8pt/16pt Arial, Helvetica, sans-serif;
                text-align: left;
                margin: .5em 0;
                height: 20px;
            }

                #title ul.dropdown li a {
                    text-decoration: none;
                    padding: 0 0 0 23px;
                }

                #title ul.dropdown li.spanish {
                    background: url('../images/tools_icon_spanish.gif') no-repeat left 50%;
                }

                #title ul.dropdown li.english {
                    background: url('../images/tools_icon_english.gif') no-repeat left 50%;
                }

                #title ul.dropdown li.contact {
                    background: url('../images/tools_icon_contact.gif') no-repeat left 50%;
                }

                #title ul.dropdown li.email {
                    background: url('../images/tools_icon_mail.gif') no-repeat left 50%;
                }

                #title ul.dropdown li.faq {
                    background: url('../images/tools_icon_faq.gif') no-repeat left 50%;
                }


    .pageNarrow {
        width: 450px;
    }
    /* sets the body width to full when there is no sidebar */
    .pageWide {
        width: 97%;
    }

    /* right sidebar panel for related and other websites */
    #sidebar {
        float: right;
        clear: both;
        width: 220px;
        padding: 0 0 10px 0;
    }

    .top-level #sidebar {
        margin-top: 8px;
    }

    #sidebar div.feature {
        width: 220px;
        height: 156px;
        margin-bottom: 20px;
    }

        #sidebar div.feature a {
            display: block;
            width: 220px;
            height: 156px;
        }

    #sidebar div.links {
        text-align: left;
        padding: 0 0 20px 0;
    }

        #sidebar div.links p {
            font-weight: bold;
        }

        #sidebar div.links ul {
            padding: 0 0 0 3px;
        }

            #sidebar div.links ul li {
                font-size: 1.0em;
                line-height: 125%;
                font-weight: normal;
                border-bottom: none;
            }

                #sidebar div.links ul li a {
                    display: block;
                    background: url('../images/nav_bullet_arrow.gif') no-repeat 0 8px;
                    padding: 4px 0 0 10px;
                }

                    #sidebar div.links ul li a:hover {
                        background-position: 0 -142px;
                    }

                    #sidebar div.links ul li a, #sidebar div.links ul li a:hover {
                        text-decoration: none;
                    }

    .spacerFour {
        padding: 0 3px;
    }

    .textindent {
        margin-left: 15px;
    }


    /* site down message*/
    div.siteDownMessage {
        position: relative;
        margin: 1.0em 10%;
        width: 500px;
        padding: 1.0em;
        border: 2px solid #ff6600;
        background: #FC6;
        background: -webkit-gradient(linear, 0 0, 0 bottom, from(#ffeec2), to(#faf5e6));
        background: -moz-linear-gradient(#ffeec2, #faf5e6);
        background: linear-gradient(#ffeec2, #faf5e6);
        -pie-background: linear-gradient(#ffeec2, #faf5e6);
        behavior: url('../CSS/PIE.htc');
    }

        div.siteDownMessage p {
            margin: 0;
            padding: 0;
            color: #000;
        }

    #fixed-bottom {
        display: none;
    }

}
/*end portrait tablet styles*/
/*==========================================================*/







/* =========================================================*/
/* SMARTPHONE device styles */
/* =========================================================*/
@media screen and (max-width: 568px) {
    #core, #fixed-bottom, #backBtn, #breadcrumbs, #left_navigation, img.logoPrint {
        display: none;
    }

    /*prevents iOS devices from zooming when accessing web form controls*/
	input[type="tel"]:focus, input[type="text"]:focus, select:focus{
        /*font-size: 16px;*/
    }

    body {
        padding: 0;
        margin: 0;
        font-size: 80%;
        background: none;
    }

    a img {
        border: none;
    }
   
    .tinynav {
        display: block; /*for select nav menus change to block*/
        width: 100%;
    }

    .container {
        margin: 0;
        padding: 0;
        width: 100%;
        /*text-align: center; KEEPS MAPS from getting messed up*/
    }

    #body {
        background: #FFF;
        font-size: 100%;
        font-family: Arial, Helvetica, sans-serif;
        margin: 0;
        padding: 0 7px;
    }

    .content {
        float: none;
        padding: 0;
        margin: 0;
        text-align: left;
        background: #FFF;
        width: 100%;
    }


    
   #title {
        min-height: 45px;
        padding: 10px 0 10px 10px;
        /*margin-left: 10px;*/
    }
                             
   /*global styles for touch-enabled devices*/
    a:link, a:visited {
        text-decoration: underline;
    }





}
/*end of smartphone device*/
/*==========================================================*/



a:active {
  outline: none;
}
a:focus {
  -moz-outline-style: none;
}

a img {
    border: none;
}

img.imgEmail {
    vertical-align: middle;
}

img.logoPrint {
    display: none;
}

h1 strong {
    display: none;
}

div#drw {
    display: none;
}

