:root{
    --primary-color:  rgba(12, 41, 64, 1);
    --secondary-color:  rgba(222, 118, 43, 1);
}
/*#data-cont { padding: 2rem 3rem; }*/

#loading { padding-top: 50px; font-size: 18px; text-align: center; min-height: 500px; }
#heading h2{ color: var(--secondary-color); margin-bottom: 12px; font: normal normal bold 30px/40px Lato; letter-spacing: -1.3px;}
#heading p{ color: #0C2940; font: normal normal normal 16px/22px Lato}
#heading div {line-height: 115%; }
#location { display: none; font-size: 23px; padding: 10px 0 15px 0; }
#changeloclbl { display: none; }

#statelist { margin-top: 10px; width: 85%; height: 2.5rem; background-color: #0c2a42; color: white; border: none;
    font: normal normal normal 16px/24px Lato;
    text-transform: uppercase;
    padding-left: 10px;
    background: url("../svg/white_arrow_down.svg") no-repeat no-repeat #0c2a42 98%;
    background-size: 12px 12px;
}
#adv-cont { }
.advisors {
    
}

.region-name{
    text-align: center;
    font-size: 1.2rem;
}
.advisors a { text-decoration:none; color: #005288;}



.advisors .bld {
    font-weight: bold;
}

.advisors .reg {
    
}

.advisors .reg.last {
    border-bottom: none;
}

.advisors-result--title {
    text-transform: uppercase;
    font: normal normal bold 24px/30px Lato;
    letter-spacing: -1.2px;
    color: #de762b;
}

.advisors-result--desc {
    font: normal normal normal 16px/20px Lato;
    color: #0C2940;
    margin-top: 12px;
}

.statelist_label {
    font: normal normal normal 16px/18px Lato;
    color: #0C2940;
}
.advisors .lg {
    padding: 10px 2px 10px 10px;
    font-size: 16px;
}

.advisors .ttl {
    text-transform: uppercase;
    font-size: 12px;
}

#map-cont {
    padding-top: 50px;
}

#map {
    position: relative;
    /* margin: 0 auto; */
    /* width: 650px;
    height: 400px; */
}

#adv-cont #adv1, #adv-cont #adv2 {
    display:none;
}

#adv-cont #adv4 {
    display:block;
}

/* @media screen and (max-width : 880px) {
    #adv-cont #adv1 { display: none; }
    #adv-cont #adv2 { display: block; }
    #adv-cont #adv4 { display: none; }

}
@media screen and (max-width : 480px) {
    #adv-cont #adv1 { display: block; }
    #adv-cont #adv2 { display: none; }
    #adv-cont #adv4 { display: none; }
} */


#acc-cont {
    padding-top: 35px;
    padding-bottom: 20px;
    display:none;
    padding: 3.7rem 6rem 7.7rem 6rem;
    background-color: #f5f8fa;
    border-top: solid 10px #e7b591;
}

.accounts {
    width: 100%;
    margin: 0 auto;
}

.accounts .hdr {
    color: var(--secondary-color);
    font-size: 1.2rem;
    padding-bottom: 1.5rem;
    font: normal normal bold 30px/30px Lato;
    letter-spacing: -1.5px;
    color: #DE762B;
    text-transform: capitalize;
}

/* .accounts .reg {
    padding: 5px 10px;
    font-size: 14px;
    border-bottom: 1px solid #a9a9a9;
    border-top: 1px solid #a9a9a9;
} */

.accounts .ttl {
    font-size: 12px;
}

.accounts .last {
    border-bottom: none;
}

.accounts .color {
    background: #EDEFF2;
    border-bottom: none;
}

.accounts .color.last {
    padding-bottom: 5px;
    border-bottom: 1px solid #a9a9a9;
}

.accounts .lg {
    padding: 10px 2px 10px 10px;
    font-size: 16px;
}

#acc-cont #acc1, #acc-cont #acc2 {
    display:none;
}

#acc-cont #acc4 {
    /* display:table; */
}

#legend  {
    margin-top: 10px;
}

#legend table {
    width: 400px;
    max-width: 320px;
    margin: 0 auto;
}

#legend table td {
    text-align: left;
    vertical-align: middle;
}

#legend .swatch {
    width: 20px;
    height: 20px;
    display: inline-block;
}

#legend span {
    margin-left: 10px;
    position: relative;
    top: -4px;
    font-weight: 600;
}

#legend .swatch.west { background: #0D5947; }
#legend .swatch.midatlantic { background: #9A9C9E; }
#legend .swatch.southcentral { background: #BECBD7; }
#legend .swatch.northeast { background: #AB3F49; }
#legend .swatch.northcentral { background: #465E83; }
#legend .swatch.southeast { background: #E5B53B; }
/* 
@media screen and (max-width : 880px) {
    #acc-cont #acc1 { display: none; }
    #acc-cont #acc2 { display: block; }
    #acc-cont #acc4 { display: none; }

}
@media screen and (max-width : 480px) {
    #acc-cont #acc1 { display: block; }
    #acc-cont #acc2 { display: none; }
    #acc-cont #acc4 { display: none; }
} */
@media screen and (min-width: 85.375rem){

    .sales-advisor-col-1{
        display: inline-block;
        width: 69%;
    }
    
    .sales-advisor-col-2{
        display: inline-block;
        width: 30%;
        vertical-align: top;
    }
    
    .advisor-card--grid{
        column-gap: 1rem;
        row-gap: 1.5rem;
        grid-template-columns: repeat(3,1fr);
        display: grid;
    }
}

@media screen and (min-width: 48rem) and (max-width: 85.3125rem){
    .advisor-card--grid{
        display: grid;
        column-gap: .7rem;
        row-gap: 1rem;
        grid-template-columns: repeat(2,1fr);
    }
}

.secondary-border-container {
    padding: 4rem 6.5rem 4rem 6rem;
}

.secondary-border-container::before, .secondary-border-container::after{
    height: 0px;
    content: '';
    display: block;
    background-color: var(--secondary-color);
    margin: 0rem;
}

.advisor-card{
    border: 1px solid #E8E8E8;
    -webkit-box-shadow: 0 5px 20px #0000000F;
    box-shadow: 0 5px 20px #0000000F;
    padding: 0.5rem 1.2rem 0.7rem 1rem;
    margin: .5rem 0;
}

.advisor-card .linkedin_url{
    margin: auto;
    float: right;
    background: url('../svg/linkedin.svg') no-repeat center center; 
    width: 22px;
    height: 22px;
}

.advisor-card .name{
    text-transform: uppercase;
    margin-bottom: 0px;
    font: normal normal normal 20px/22px Lato;
    letter-spacing: 0px;
    color: #101010;
}
.advisor-card .title{
    border-bottom: 1px solid #E8E8E8;
    padding: 6px 0 9px 0px;
    font: normal normal normal 14px/26px Lato;
    color: #0C2940;
    text-transform: uppercase;
}

.accounts .advisor-card.dir-card{
    background: #E7F0F5;
}

.advisor-card .email {
    border-bottom: 1px solid #E8E8E8;
    padding-bottom: 7px !important;
}

.advisors .email {
    padding-bottom: 4px !important;
}

.email,.phone{
    margin-top: 4px;
    color: #005288;
    font: normal normal normal 16px/26px Lato;
}

.phone {
    margin-top: 6px;
}

.email a {
    color: #005288;
}


.phone a {
    color: #005288;
}

.email a::before{
    content: '';
    background: url('../svg/email_line_item.svg') no-repeat center center; 
    width: 24px;
    height: 24px;
    display: inline-block;
    margin-right: 0.75rem;
    vertical-align: middle;
}

.phone::before{
    content: '';
    background: url('../svg/phone_line_item.svg') no-repeat center center;
    width: 24px;
    height: 23px;
    display: inline-block;
    margin-right: 0.75rem;
    vertical-align: middle;
    margin-bottom: 3px;
}

.accounts .advisor-card{
    padding: 0.625rem 1rem;
    background-color: white;
}

.accounts .advisor-card *{
    padding: .2rem 0;
}

.svp{
    background-color: #C9DAE5;
}


.reg-card{
    background-color: #E7F0F5;
}

.statelist-wrapper{
    width: 100%;
    font-size: 1.25rem;
    font-weight:600;
    padding: 1rem 0px;
    display: flex;
    flex-direction: column;
    text-transform: uppercase;
}

@media screen and (max-width: 23.5rem){
    #map-cont{
        display: none;
    }
}

/* Mobile View - max-width: 767px */
@media (max-width: 47.9375rem) {

    .secondary-border-container {
        padding: 2.5rem 0 0.75rem 1rem;
        margin-bottom: 4rem;
    }

    #heading h2 {
        font: normal normal bold 24px/30px Lato;
        letter-spacing: -1.2px;
    }

    #heading p {
        font: normal normal normal 16px/24px Lato;
    }

    .statelist-wrapper {
        padding-top: 3rem;
    }

    .statelist_label {
        font: normal normal normal 20px/20px Lato;
     //   letter-spacing: 0px;
        color: #020202;
        text-transform: uppercase;
        font-weight: 600;
    }

    #statelist {
        font: normal normal bold 16px/19px Lato;
        height: 3.1rem;
        width: 95.5%;
        margin-top: 8px;
    }

    .advisors-result--title {
        font: normal normal bold 24px/30px Lato;
        letter-spacing: -1.2px;
        margin-top: 24px;
    }

    .advisors-result--desc {
        margin-bottom: 8px;
    }

    .advisor-card {
        margin: 15px 1rem 31px 0px;
        padding: 0.625rem 1.5rem 11px 1rem;
    }

    .advisor-card .name {
        font: normal normal normal 18px/20px Lato;
        margin-bottom: 9px;
    }

    .advisor-card .title {
        padding: 0px;
        padding-bottom: 9px;
    }

    .advisor-card .email a::before {
        margin-right: 12px;
    }

    .advisor-card .phone::before {
        margin-right: 12px;
    }

    .advisor-card .phone {
        margin-top: 6px;
    }

    #adv4 .advisor-card .email {
        border-bottom: none;
    }
    .advisor-card .email {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        margin-top: 0;
    }

    #acc-cont {
        padding: 2.5rem 0rem 2.5rem 1rem;
        padding-bottom: 100px;
    }

    #acc-cont .advisor-card .name {
        padding-top: 30px;
    }

    #acc-cont .advisor-card .title {
        padding-top: 5px;
    }

    .accounts .hdr {
        font: normal normal bold 24px/30px Lato;
        letter-spacing: -1.2px;
    }

    .accounts .advisor-card {
        margin: 15px 1rem 31px 0px;
        padding: 0.5rem 1.5rem 11px 1rem;
    }
}

/* Mobile View - min-width: 376px and max-width: 767px */
@media (min-width: 23.5rem) and (max-width: 47.9375rem) {

}

/* Tablet View - min-width: 768px and max-width: 1365px */
@media (min-width: 48rem) and (max-width: 85.3125rem) {
    .secondary-border-container {
        padding: 3.15rem 1.5rem 3.15rem 1.6rem;
    }

    #heading h2{ font: normal normal bold 24px/30px Lato;}
    #heading p{ font: normal normal normal 16px/24px Lato}

    .statelist_label {
        font: normal normal normal 20px/22px Lato;
        text-transform: uppercase;
    }

    #statelist {
        width: 100%;
        margin-top: 8px;
        height: 3.15rem;
        font: normal normal bold 16px/19px Lato;
    }

    #map-cont {
        padding-top: 4px;
    }

    #adv-cont #adv4 {
        margin-top:2.5rem;
    }

    #adv-cont #adv4 .advisor-card {
        margin-top: 1.8rem;
    }

    #adv-cont #adv4 .phone {
        float: right;
        top: -37px;
        position: relative;
    }

    #acc-cont {
        padding: 3.15rem 1.6rem;
        padding-bottom: 100px;
    }

    .accounts .hdr {
        font: normal normal bold 24px/36px Lato;
        padding-bottom: 2.5rem;
    }

    .accounts .advisor-card {
        padding: 0.5rem 1rem;
    }

    #adv4 .advisor-card .email {
        margin-top: 12px;
        padding-bottom: 11px;
        border-bottom: none;
    }

    .accounts .advisor-card .phone {
        margin-top: 10px;
        padding-bottom: 9px;
    }

    .advisor-card .title {
        padding: 0.6rem 0;
    }
}