﻿/*Default Mobile Styles*/
#button-toggle-subnav {border-radius:0px;float:right;margin-top:28px;margin-right:10px;width:40px;text-align:center;padding:2px;font-size:22px}


/*XL (large desktops, 1200px and up)*/
@media (min-width: 1200px) { 
}

/*LG*/
@media (min-width: 992px) and (max-width: 1199px) {
    
}

/*MD*/
@media (min-width: 768px) and (max-width: 991px) {

    

        body {overflow-x:hidden;margin: 0 0 220px !important; /* bottom = footer height */}
    footer {height: 220px;position:absolute;width:100%;left:0;bottom:0}

    .header-links {text-align:left !important}

    .compliance-links {margin-top:10px}

    .footer-nav-item {float:none !important;display:block !important}

    #person-holder {overflow:hidden !important;position:static !important;margin-left:100px}    
    #person-inner {padding-left:200px;}  
    #chair-holder {right:0px !important}
    .copyright {margin-top:30px;text-align:center;}
    .copyright p {font-size:12px !important;}
    h1 {font-size:30px !important}

    .logo {margin-top:0px;margin-top:0px;margin-bottom:20px}

    #header-container {margin-top:-120px !important}

    #sub-header-wrapper{margin-top:-32px;position:absolute}

    #sub-header-container {margin:-0px -15px 0px -15px;position:relative;z-index:10000}
    #main-content {margin-top:120px !important;}
    #navigation-holder-strip {background-color:#fff !important;margin-top:0px !important;padding:0px 10px;}
    #navigation-holder-strip .container {padding:0px !important}
    .nav-item {padding:0px !important}
    .nav-link {padding-top:10px !important;padding-bottom:20px !important;display:inline-block;text-align:center !important;width:100%;}    
    
    .navbar-nav {display:block}

    .navbar-collapse {    position: absolute;margin:0px -10px;z-index: 1000;width: 100%;margin-top:-32px}

    .navbar-expand-lg {display:inline-block;width:100%;}
    
    .myper-page-header {padding:5px;margin-top:-20px;text-align:center}
    .myper-page-header  h4 {font-size:20px}

    .right-column-holder {margin-top:20px;padding:10px;}
    h4 {font-size:24px}
 
    
    .nav-tabs > li {border-right:1px solid #9ECCA3;background-color:#cedfd0 !important;border-bottom:1px solid #9ECCA3;}
    .nav-tabs > li:last-child {border-right:0px solid #9Ecca3}

    .nav-tabs>li>a  {font-size:12px;padding:8px}

    #account-tab-1 {width:50%}
    #account-tab-2 {width:50%;}
    #account-tab-3 {width:33%}
    #account-tab-4 {width:34%}
    #account-tab-5 {width:33%}
    
    
    .nav-tabs > li:hover {background-color:#f1f1f1 !important;cursor:pointer}

    .table-cv .row {background-color:#f2f2f2;margin-bottom:10px;font-size:14px}

    .table-cv .row .btn {font-size:11px  !important;padding:5px !important}

    .work-history-row .row {background-color:#f2f2f2;margin-bottom:10px;font-size:14px}

    .work-history-row .row .btn {font-size:11px  !important;padding:5px !important}
}

/*SM*/
@media (min-width: 576px) and (max-width: 767px) {

   
}


/*XS*/
@media (max-width: 575px) {


    .navbar {padding: 8px 0px 0px 11px !important}
    .navbar-toggler {z-index:20001;position:absolute;float:right;right:0px;border:none;}
    .navbar-toggler:active {border:none;}
    .navbar-toggler:focus {
    outline: none;
    box-shadow: none;border:none;
}
    .navbar-nav .nav-link {
    font-size: 18px !important;
    text-align:left !important
}
    .navbar-nav {text-align:left;}

    .navbar-collapse {
        display: block !important;
        width: 100vw;
        height: 100vh;
        position: absolute;
        left: 0;
        top: 0;
        margin-top:40px;
        margin-left:-105vw;
        padding-top:100px;
        z-index: 20000;
        background-color: rgba(255,255,255,0.9);

    }

    .navbar-collapse.show {
        margin-left:0px;
    }


    .audience-selector {padding-left:10px}
    .audience-item  {padding:4px;font-size:12px}

    .my-section-header  h4 {font-size:15px}

    h1 {font-size:20px !important}
    h4 {font-size:20px}

    .fs-18 {font-size:16px !important}

    .header-links {text-align:left !important}

    body {margin-bottom:1060px !important;margin-top:0px}


    .button-receive-alerts {float:right;margin-top:5px}

    .compliance-links {margin-top:10px}

    .footer-nav-item {float:none !important;display:block !important}

    .copyright {margin-top:30px;text-align:center;}
    .copyright p {font-size:12px !important;}

    .logo {margin-top:0px;margin-top:0px;margin-bottom:20px}

    #header-container {margin-top:-120px !important}

    #sub-header-wrapper{margin-top:-32px;position:absolute}

    #sub-header-container {margin:-0px -15px 0px -15px;position:relative;z-index:10000}
    #main-content {margin-bottom:0px;}
    #navigation-holder-strip {background-color:#fff !important;margin-top:0px !important;padding:0px 10px;}
    #navigation-holder-strip .container {padding:0px !important}
    
    .myper-page-header {padding:5px;margin-top:-20px;text-align:center}
    .myper-page-header  h4 {font-size:20px}

    .right-column-holder {margin-top:20px;padding:10px;}
    
    .offset-body-holder {margin-top:-220px}

    .switch-holder {margin-top:-42px}

    .nav-tabs > li {
        border-right: 1px solid #9ECCA3;
        background-color: #cedfd0 !important;
        border-bottom: 1px solid #9ECCA3;
    }
    .nav-tabs > li:last-child {border-right:0px solid #9Ecca3}

    .nav-tabs>li>a  {font-size:12px;padding:8px}
   
    
    .nav-tabs > li:hover {background-color:#f1f1f1 !important;cursor:pointer}

    .table-cv .row {background-color:#f2f2f2;margin-bottom:10px;font-size:14px}
    .table-cv .row .btn {font-size:11px  !important;padding:5px !important}

    .work-history-row .row {background-color:#f2f2f2;margin-bottom:10px;font-size:14px}
    .work-history-row .row .btn {font-size:11px  !important;padding:5px !important}


    #roles-list-holder.fixed-scroll {height: calc(100vh - 220px) !important;}

    #role-details {height:calc(100vh - 114px) !important;width:100vw;margin-left:-105vw;position:fixed;top:114px;background-color:#fff}
    #role-details.in-view {margin: 0px -10px 0px -10px;padding:10px}

    .mobile-back-link {float:right;color:#656447;font-size:15px;}
        .mobile-back-link.top {margin-top: -28px}
        .mobile-back-link.bottom {margin-top: 20px;margin-bottom:20px;padding-bottom:20px}

    .prefs-step {position:relative}

    .btn {
        padding: 6px 6px !important;
    }

}


