/* ------------------------------------------------------------------------------ */
/* --------------------- Santander Commercial CSS Overrides --------------------- */
/* ------------------------------------------------------------------------------ */

/* show & hide mobile & desktop */
@media only screen and (max-width: 767px) {
    .show-mobile {
        display: block !important;
    }

    .show-desktop {
        display: none !important;
    }
}

@media only screen and (min-width: 768px) {
    .show-mobile {
        display: none !important;
    }

    .show-desktop {
        display: block !important;
    }
}



/* additional text colors */
.text-santander-blue .lead {
    color: #0172ce;
}

.subtitle-black .subtitle {
    color: #000 !important;
}



/* apply custom santander webfonts */
.webfont-san div div {
    font-family: 'SantanderTextW05-Regular' !important;
    font-weight: normal !important;
}

.webfont-san.large div div {
    font-size: 1.45em;
}

.webfont-san-bold div div {
    font-family: 'SantanderHeadlineW05-Bold' !important;
    font-weight: normal !important;
}

.webfont-san-bold.large div div {
    font-size: 1.45em;
}

.webfont-san-light div div {
    font-family: 'SantanderHeadlineW05-Light' !important;
    font-weight: normal !important;
}

.webfont-san-light.large div div {
    font-size: 1.45em;
}



/* adjust breadcrumb position */
.breadcrumb {
    margin: 0.25em 0 !important;
    padding: 0 !important;
    line-height: 1.25em !important;
}



/* adjust accordion symbol position */
.accordion .accordion-item-btn {
    padding: .65em 1em .65em 1em !important;
}



/* ------------------------------------------------------------------------------ */
/* -------------------------- additional button styles -------------------------- */

/* gray button styles */
.gray-btn a.btn.btn-primary {
    background-color: #fff;
    color: #697072;
    text-decoration: none;
    padding: 0.75em 1.65em 0.73em;
    border: 2px solid #697072;
}

.gray-btn a.btn.btn-primary:active,
.gray-btn a.btn.btn-primary:hover {
    paddong: 0.75em 1.65em 0.73em;
    border: 2px solid #697072;
    background-color: #697072;
    color: #fff;
}


/* commercial button icon styles */
.read-more .btn {
    background-image: url("data:image/svg+xml; utf8, <svg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'><g><path fill='white' d='M836.9,990c16.9,0,30.6-13.7,30.6-30.6V206c0-0.7-0.3-1.3-0.4-1.9c-0.2-2.8-0.7-5.4-1.6-8c-0.4-1-0.6-2-1.1-3c-1.4-2.9-3.2-5.7-5.5-8.1c-0.2-0.2-0.3-0.5-0.5-0.6c0,0-0.1-0.1-0.1-0.2L689.9,18.8c-2.5-2.5-5.5-4.3-8.6-5.8c-0.9-0.4-1.9-0.7-2.9-1c-2.6-0.9-5.3-1.4-8-1.6c-0.6,0-1.2-0.4-1.8-0.4H163.1c-16.9,0-30.6,13.7-30.6,30.6v918.8c0,16.9,13.7,30.6,30.6,30.6H836.9z M699.1,113.6l62.9,61.8h-62.9V113.6z M193.7,71.3h444.1V206c0,16.9,13.7,30.6,30.6,30.6h137.8v692.1H193.7V71.3z'/></g></svg>") !important;
    background-size: 20px !important;
    background-repeat: no-repeat !important;
    background-position: 10px !important;
    text-indent: 15px !important;
    border: 3px solid #DA1414 !important;
    transition: none !important;
}

.read-more .btn:hover,
.read-more .btn:active {
    background-image: url("data:image/svg+xml; utf8, <svg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'><g><path fill='%23DA1414' d='M836.9,990c16.9,0,30.6-13.7,30.6-30.6V206c0-0.7-0.3-1.3-0.4-1.9c-0.2-2.8-0.7-5.4-1.6-8c-0.4-1-0.6-2-1.1-3c-1.4-2.9-3.2-5.7-5.5-8.1c-0.2-0.2-0.3-0.5-0.5-0.6c0,0-0.1-0.1-0.1-0.2L689.9,18.8c-2.5-2.5-5.5-4.3-8.6-5.8c-0.9-0.4-1.9-0.7-2.9-1c-2.6-0.9-5.3-1.4-8-1.6c-0.6,0-1.2-0.4-1.8-0.4H163.1c-16.9,0-30.6,13.7-30.6,30.6v918.8c0,16.9,13.7,30.6,30.6,30.6H836.9z M699.1,113.6l62.9,61.8h-62.9V113.6z M193.7,71.3h444.1V206c0,16.9,13.7,30.6,30.6,30.6h137.8v692.1H193.7V71.3z'/></g></svg>") !important;
    border: 3px solid #DA1414 !important;
    background-color: white !important;
}

.watch-video .btn {
    background-image: url('/documents/330001/423970/icon_button_watch_video_sprite.png/eb93636d-bbe1-dcd9-a68d-2b281e5454a3') !important;
    background-size: 23px 46px !important;
    background-repeat: no-repeat !important;
    background-position: 10px -16px !important;
    text-indent: 1em !important;
    transition: none !important;
}

.watch-video .btn:hover,
.watch-video .btn:active {
    background-image: url('/documents/330001/423970/icon_button_watch_video_sprite.png/eb93636d-bbe1-dcd9-a68d-2b281e5454a3') !important;
    background-position: 10px 8px !important;
}

.no-button-icon .btn {
    background-image: none !important;
    text-indent: 0 !important;
}



.san-mod .disclosure {
    font-size: .8em;
    margin-bottom: 1em;
}



/* commercial center mobile buttons */
@media only screen and (max-width: 767px) {
    .button-container {
        text-align: center !important;
    }

    .button-container .btn.btn-primary {
        display: inline-block !important;
    }
}



/* commercial heading mobile adjustments */
@media only screen and (max-width: 767px) {
    #main-content .container .component-paragraph h1 {
        font-size: 7.5vw !important;
    }

    #main-content .container .component-paragraph h2 strong {
        /*font-size: 9.5vw !important;*/
    }
}



/* commercial content section heading mobile adjustments */
@media only screen and (max-width: 767px) {
    #main-content .container .component-paragraph {
        padding-left: 0 !important;
    }

    #main-content .container .component-paragraph h3,
    #main-content .container .component-paragraph h4 {
        font-size: 1.73em !important;
    }
}



/* commercial round image mobile adjustments */
@media only screen and (max-width: 767px) {
    #main-content .round-img .component-image div:nth-of-type(1) {
        text-align: center !important;
    }

    #main-content .round-img .component-image img {
        width: 216px !important;
        margin: 0 auto !important;
    }
}



/* commercial change underline text links */
#main-content u a,
#main-content .txt-link a {
    text-decoration: underline !important;
}



/* remove extra mobile padding on HTML fragment content */
@media only screen and (max-width: 767px) {
    #main-content .component-html {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}



/* commercial blue-box styles */
.san-mod .tab-content-box p {
    margin: 0 0 1em;
}

.san-mod .tab-content-box .capt02 {
    font-size: 1.45em;
    line-height: 1.5em;
    margin-bottom: .25em;
    font-weight: 700;
}

.san-mod .tab-content-box ul {
    padding: 0 1em;
}

.san-mod .tab-content-box li {
    line-height: 1.65em;
}



.san-mod .tab-content-box.two-col row-container {
    position: relative;
}

.san-mod .tab-content-box.two-col .col1,
.san-mod .tab-content-box.two-col .col2 {
    position: relative;
    float: left;
}

.san-mod .tab-content-box.two-col .col1 .image {
    width: 100%;
    max-width: 345px;
}

.san-mod .tab-content-box.two-col .col2 {
    margin: 0 0 0 2em;
}

.san-mod .tab-content-box.three-col .row-container {
    position: relative;
}

.san-mod .tab-content-box.three-col .col1,
.san-mod .tab-content-box.three-col .col2,
.san-mod .tab-content-box.three-col .col3 {
    position: relative;
    float: left;
    text-align: center;
    margin: .5em;
    padding: .5em 1em;
}

.san-mod .tab-content-box.three-col .blue .col1,
.san-mod .tab-content-box.three-col .blue .col2,
.san-mod .tab-content-box.three-col .blue .col3 {
    color: #fff;
    background: #0172ce;
}


/* MOBILE VERSION */
@media only screen and (max-width: 767px) {
    .san-mod .wtabs04 li span {
        color: #666;
    }

    .san-mod .wtabs04 li.active span {
        color: #fff;
        transition: color .2s;
        -webkit-transition: color .2s;
        -moz-transition: color .2s;
        -o-transition: color .2s;
    }

    .san-mod .tab-content-box.two-col .col1,
    .san-mod .tab-content-box.two-col .col2 {
        width: 96%;
        margin: 2%;
    }

    .san-mod .tab-content-box.three-col .row-container {
        width: 100%;
    }

    .san-mod .tab-content-box.three-col .col1,
    .san-mod .tab-content-box.three-col .col2,
    .san-mod .tab-content-box.three-col .col3 {
        width: calc((100% /1) - 3em);
        display: table;
        margin-left: 1.5em;
    }

    .san-mod .tab-content-box.three-col .blue-box-16 p {
        display: table-cell;
        vertical-align: middle;
    }

}

/* TABLET VERSION */
@media only screen and (min-width: 768px) and (max-width:979px) {
    .san-mod .tab-content-box.two-col .col1 {
        width: 50%;
    }

    .san-mod .tab-content-box.two-col .col2 {
        width: calc(50% - 2em);
    }

    .san-mod .tab-content-box.three-col .row-container {
        width: 100%;
    }

    .san-mod .tab-content-box.three-col .col1,
    .san-mod .tab-content-box.three-col .col2,
    .san-mod .tab-content-box.three-col .col3 {
        /*width: calc((100% /3) - 3em);*/
        width: calc((100% /3) - 1em);
        display: table;
    }

    .san-mod .tab-content-box.three-col .blue-box-16 p {
        display: table-cell;
        vertical-align: middle;
    }

}

/* DESKTOP VERSION */
@media only screen and (min-width: 980px) {
    .san-mod .tab-content-box.two-col .col1 {
        width: 35%;
    }

    .san-mod .tab-content-box.two-col .col2 {
        width: calc(65% - 2em);
    }

    .san-mod .tab-content-box.three-col .row-container {
        width: 100%;
    }

    .san-mod .tab-content-box.three-col .col1,
    .san-mod .tab-content-box.three-col .col2,
    .san-mod .tab-content-box.three-col .col3 {
        /*width: calc((100% /3) - 3em);*/
        width: calc((100% /3) - 1em);
        display: table;
    }

    .san-mod .tab-content-box.three-col .blue-box-16 p {
        display: table-cell;
        vertical-align: middle;
    }

}



/* add flame icon to mobile menu */
@media (max-width: 1184px) {
    #main-content .main-nav.wlrMenu05 .nav-menu>nav>.list-nav-menu {
        top: -84px !important;
    }

    #main-content .main-nav.wlrMenu05 .nav-menu.active:before {
        content: '';
        background: url('/documents/330001/423970/spritesheet.png/83823071-dd8c-64e9-ba15-af5eb375631b') no-repeat scroll 0 0;
        width: 29px;
        height: 26px;
        background-position: -507px -5px;
        position: absolute;
        right: 1em;
        top: -5em;
    }

    #main-content .main-nav.wlrMenu05 .nav-menu .nav-menu-trigger:hover {
        background-color: #c90212;
    }
}



/* ------------------------------------------------------------------------------ */
/* ---------------------------- content table styles ---------------------------- */
.san-mod .table-wrapper {
    display: table;
    width: 98.5%;
    clear: both;
    margin-bottom: 2em;
    overflow-x: scroll;
}

.san-mod .table-wrapper table.common-table {
    margin-bottom: 1em;
    border-collapse: collapse;
    width: 100%;
}

.san-mod .table-wrapper table.common-table tbody {
    width: 100%;
}

.san-mod .table-wrapper table.common-table tr {
    border: 1px solid #eff6f9;
}

.san-mod .table-wrapper table.common-table th {
    color: #137a7a;
    background: #eff6f9;
    font-size: 1.75em;
    font-weight: 400;
    border-right: 1px solid #fff;
    vertical-align: top;
    padding: 10px 20px;
}

.san-mod .table-wrapper table.common-table td {
    color: #697072;
    vertical-align: top;
    border-right: 1px solid #eff6f9;
    padding: 10px 20px;
}

.san-mod .table-wrapper table.common-table th:last-child,
.san-mod .table-wrapper table.common-table td:last-child {
    border-right: none;
}

.san-mod .table-wrapper table.common-table td:first-child {
    border-right: 1px solid #eff6f9;
}

.san-mod .table-wrapper table.common-table ul {
    margin: 0 !important;
}

.san-mod .table-wrapper table.common-table li {
    margin-bottom: .5em;
}

/* -- alternating table styles -- */
.san-mod .table-wrapper table.alt-table {
    margin-bottom: 1em;
    border-collapse: collapse;
    width: 100%;
}

.san-mod .table-wrapper table.alt-table tbody {
    width: 100%;
}

.san-mod .table-wrapper table.alt-table tr:nth-child(even) {
    /*border: 1px solid #eff6f9;*/
    background: #eff6f9;
}

.san-mod .table-wrapper table.alt-table th {
    color: #e20000;
    background: #fff;
    font-size: 1em;
    font-weight: 700;
    border-right: 1px solid #eff6f9;
    padding: 10px 20px;
    vertical-align: top;
    text-align: left;
}

.san-mod .table-wrapper table.alt-table td {
    color: #697072;
    vertical-align: top;
    border-right: 1px solid #eff6f9;
    padding: 10px 20px;
}

.san-mod .table-wrapper table.alt-table td:first-child {
    border-right: 1px solid #eff6f9;
}

.san-mod .table-wrapper table.alt-table tr:nth-child(even) td {
    border-right: 1px solid #fff;
}

.san-mod .table-wrapper table.alt-table th:last-child,
.san-mod .table-wrapper table.alt-table td:last-child {
    border-right: none;
}

.san-mod .table-wrapper table.alt-table ul {
    margin: 0;
}

.san-mod .table-wrapper table.alt-table li {
    margin-bottom: .5em;
}

/* -- nested table styles -- */
.san-mod .table-wrapper table.nested-table {
    margin-bottom: 1em;
    border-collapse: collapse;
    width: 100%;
}

.san-mod .table-wrapper table.nested-table tbody {
    width: 100%;
}

.san-mod .table-wrapper table.nested-table tr {
    border: 1px solid #eff6f9;
}

.san-mod .table-wrapper table.nested-table th {
    color: #e20000;
    background: #eff6f9;
    font-size: 1em;
    font-weight: 700;
    border-right: 1px solid #fff;
    padding: 10px 20px;
    vertical-align: top;
    text-align: left;
}

.san-mod .table-wrapper table.nested-table td {
    color: #697072;
    vertical-align: top;
    border-right: 1px solid #eff6f9;
    padding: 10px 20px;
}

.san-mod .table-wrapper table.nested-table td:first-child {
    border-right: 1px solid #eff6f9;
}

.san-mod .table-wrapper table.nested-table tr:nth-child(odd) td {
    border-right: 1px solid #fff;
}

.san-mod .table-wrapper table.nested-table th:last-child,
.san-mod .table-wrapper table.nested-table td:last-child {
    border-right: none;
}

.san-mod .table-wrapper table.nested-table ul {
    margin: 0;
}

.san-mod .table-wrapper table.nested-table li {
    margin-bottom: .5em;
}

/* -- simple-table styles -- */
.san-mod .table-wrapper table table.simple-table {
    margin-bottom: 0
}

.san-mod .table-wrapper table.simple-table {
    margin-bottom: 1em;
    border-collapse: collapse;
    width: 100%;
}

.san-mod .table-wrapper table.simple-table tbody {
    width: 100%;
}

.san-mod .table-wrapper table.simple-table tr {
    border: none;
}

.san-mod .table-wrapper table.simple-table th {
    color: #697072;
    background: none;
    font-size: inherit;
    font-weight: 400;
    border-right: none;
    padding: 0;
}

.san-mod .table-wrapper table.simple-table td {
    color: #697072;
    vertical-align: top;
    border-right: none;
    padding: 0;
}

.san-mod .table-wrapper table.simple-table td:first-child {
    border-right: none;
}

/* -- table column presets -- */
.san-mod .table-wrapper .col-1-2 th,
.san-mod .table-wrapper .col-1-2 td {
    width: 50%;
}

.san-mod .table-wrapper .col-1-3 th,
.san-mod .table-wrapper .col-1-3 td {
    width: 33%;
    width: calc(100% / 3);
}

.san-mod .table-wrapper .col-1-4 th,
.san-mod .table-wrapper .col-1-4 td {
    width: 25%;
}

.san-mod .table-wrapper .col-1-5 th,
.san-mod .table-wrapper .col-1-5 td {
    width: 20%;
}

/* MOBILE VERSION */
@media only screen and (max-width: 767px) {

    /* -- mobile table styles -- */
    .san-mod .table-wrapper {
        margin-top: 1em;
        overflow-x: scroll;
    }

    .san-mod .table-wrapper table.common-table th {
        font-size: 1.25em;
    }

    .san-mod .table-wrapper table.alt-table th {
        color: #137a7a;
        font-size: .9em;
        line-height: 1.25em;
    }

    .san-mod .table-wrapper.nested-table-wrapper {
        display: block;
    }

    .san-mod .table-wrapper table.nested-table th {
        color: #137a7a;
        font-size: .9em;
        line-height: 1.25em;
    }
}

/* TABLET VERSION */
@media only screen and (min-width: 768px) and (max-width:979px) {}

/* DESKTOP SMALL VERSION */
@media only screen and (min-width: 980px) and (max-width:1199px) {}

/* DESKTOP LARGE VERSION */
@media only screen and (min-width:1200px) {}



/* ------------------------------------------------------------------------------- */
/* ---------------------------- content column styles ---------------------------- */
/* col styles */
.san-mod .col-wrapper {
    display: table;
    width: 100%;
    clear: both;
    margin-bottom: 2em;
}

/* two col */
.san-mod .col-wrapper .col-1-2 {
    vertical-align: top;
    width: 50%;
    width: calc(100% / 2);
    position: relative;
    display: inline-block;
    float: left;
}

.san-mod .col-wrapper .col-1-2.left-60 {
    float: left;
    width: 50%;
}

.san-mod .col-wrapper .col-1-2.right-40 {
    float: right;
    width: 40%;
}

/* three col */
.san-mod .col-wrapper .col-1-3 {
    vertical-align: top;
    width: 33%;
    width: calc(100% / 3);
    display: inline-block;
    position: relative;
    float: left;
}

/* four col */
.san-mod .col-wrapper .col-1-4 {
    vertical-align: top;
    width: 25%;
    width: calc(100% / 4);
    display: inline-block;
    position: relative;
    float: left;
}

/* five col */
.san-mod .col-wrapper .col-1-5 {
    vertical-align: top;
    width: 20%;
    width: calc(100% / 5);
    display: inline-block;
    position: relative;
    float: left;
}

/* MOBILE VERSION */
@media only screen and (max-width: 767px) {

    .san-mod .col-wrapper {
        display: table;
        width: 96%;
        clear: both;
        margin: 0 auto 2em;
    }

    /* two col */
    .san-mod .col-wrapper .col-1-2 {
        float: none !important;
        width: 100% !important;
    }

    .san-mod .col-wrapper .col-1-2.left-60 {
        float: none !important;
        width: 96% !important;
        margin: 0 auto 1em !important;
    }

    .san-mod .col-wrapper .col-1-2.right-40 {
        float: none !important;
        width: 80% !important;
        margin: 0 auto 1em !important;
        left: 10% !important;
    }

    /* three col */
    .san-mod .col-wrapper .col-1-3 {
        float: none !important;
        width: 100% !important;
    }

    .san-mod .col-wrapper .col-1-3 ul {
        margin: 0 2%;
    }

    /* four col */
    .san-mod .col-wrapper .col-1-4 {
        float: none !important;
        width: 50% !important;
    }

    /* five col */
    .san-mod .col-wrapper .col-1-5 {
        float: none !important;
        width: 100% !important;
    }

}

/* TABLET VERSION */
@media only screen and (min-width: 768px) and (max-width:979px) {

    /* four col */
    .san-mod .col-wrapper .col-1-4 {
        width: 50%;
        width: calc(100% / 2);
    }

}

/* DESKTOP VERSION */
@media only screen and (min-width: 980px) and (max-width:1199px) {}

/* DESKTOP LARGE VERSION */
@media only screen and (min-width:1200px) {}