@font-face {
    font-family: "Gotham Book"; 
    src: url('/Fonts/Gotham-Book.otf');
}

body {
    background-color: #dceefb;
    color: #58595B;
}

.nav > li {
    font-size: 1.25em;
}

.navbar-right-link {
    color: #06A0D3; /*!important;*/
    padding-left: 8px; /*!important;*/
    padding-right: 8px; /*!important;*/
    text-transform: none;
}

footer .row {
    line-height: 3.0;
    font-family: "Gotham Book", sans-serif;
}

.footer-img {
    max-height: 50px;
    height: auto;
    width: auto;
    padding-right: 16px;
}

.footer-link {
    color: #fff;
    padding: 0 8px 0 8px;
}

    .footer-link:hover {
        color: #fbb034;
        text-decoration: none;
    }

    .footer-link a:visited, .footer-social a:active, .footer-social a:focus {
        text-decoration: none;
    }

.footer-social {
    color: #fff;
    padding: 8px 8px 8px 8px;
}

    .footer-social:hover {
        color: #fbb034;
        text-decoration: none;
    }

    .footer-social a:visited, .footer-social a:active, .footer-social a:focus {
        text-decoration: none;
    }

.footer-nav {
    background-color: #fff;
    padding: 32px 0 32px 0;
    font-family: "Gotham Book", sans-serif;
    font-style: normal;
    font-weight: 400;
}

    .footer-nav a {
        display: block;
        color: #58595B;
    }

        .footer-nav a:hover, h5:hover {
            color: #fbb034;
            text-decoration: none;
        }

    .footer-nav h5:active, .footer-nav h5:visited, .footer-nav h5:focus {
        text-decoration: none;
    }

    .footer-nav a:active, .footer-nav a:visited, .footer-nav a:focus {
        text-decoration: none;
    }

.hero-link {
    font-size: 1.5em;
    color: #fff;
}

    .hero-link:hover {
        color: #fff;
        text-decoration: underline;
    }

    .hero-link:active {
        color: #ccc;
        text-decoration: underline;
    }

.card {
    width: 100%;
    background-color: #fff;
}

/*Home page icon boxes*/
.col-md-2 {
    width: 20.2%;
    padding: 0px 9px 16px 11px;
}

.container-fluid {
    margin-left: 3.65px;
    margin-right: -13px;
    padding-top: 32px;
}

#home-container {
    padding-top: 16px;
    padding-left: 0px;
}

@media screen and (max-width: 1040px) {
    .container-fluid {
        padding: 16px 23px 0px 19px;
        margin-right: -18px;
        margin-left: 0;
    }
}

.col-md-2:nth-child(2) {
    margin-left: -112px;
}

@media (max-width:1200px) {
    .col-md-2:nth-child(2) {
        margin-left: -95px;
    }
}

@media (max-width:1040px) {
    .col-md-2 {
        width: 100%;
    }

        .col-md-2:nth-child(2) {
            margin-left: 0px;
        }
}

.feature-card {
    max-width: 100%;
    background-color: #fff;
    text-align: center;
    cursor: pointer;
}

.feature-card-image img {
    max-width: 75%;
    max-height: 75%;
    padding: 0px 0px 0px 0px;
}

.feature-card-title {
    font-size: 1.5em;
    color: #fbb034;
    font-family: poppins,sans-serif;
    margin-top: 0px;
}

.feature-card-subtitle {
    color: #58595B;
    font-family: "Gotham Book", sans-serif;
    font-style: normal;
    font-weight: 400;
    height: 40px;
}

    .feature-card-subtitle p {
        margin: 0;
        line-height: 17px;
        padding-left: 10px;
        padding-right: 10px;
        height: 100%;
    }

.feature-card-bar {
    width: 100%;
    height: 11px;
    margin-bottom: 0px;
    background-color: #06A0D3;
    padding-top: 10px;
}

@media screen and (min-width: 1199px) {
    #middle-feature-card .feature-card-bar {
        margin-top: 18px;
    }

    #middle-feature-card .feature-card-subtitle {
        padding-bottom: 8px;
    }

    .feature-card-subtitle {
        padding-bottom: 0.1px;
    }
}

h1, h2, h3, h4, h5, h6 {
    color: #06A0D3;
    font-family: poppins,sans-serif;
    font-weight: 400;
    font-style: normal;
}

h1 {
    font-size: 24px;
}

h2 {
    font-size: 18px;
}

h3 {
    font-size: 18px;
}

h5 {
    font-size: 1.15em;
    color: #06A0D3;
}

b, strong {
    font-weight: 600;
}

/* Sidebar styling */

.ul-sidebar {
    padding-left: 0px;
}

    .ul-sidebar > li > a {
        color: inherit;
    }

        .ul-sidebar > li > a:hover {
            text-decoration: none;
        }

.card-sidebar {
    padding: 0 10px;
}

    .card-sidebar p {
        padding-left: 20px;
    }

    .card-sidebar h4 {
        padding-top: 5px;
        padding-left: 20px;
    }

    .card-sidebar li {
        padding-left: 20px;
    }

.bottom-bar {
    margin-top: 12px;
    width: 100%;
    height: 6px;
    background-color: #06A0D3;
}

.break-line {
    border: 1px solid darkgrey;
    margin-top: 20px;
    margin-bottom: 20px;
}

/*Light blue button used throughout site (Ex: side bar buttons)*/
.blue-btn {
    color: #06A0D3;
    background-color: #ddecf2;
    border: none;
    padding: 0.3px 0px 0.3px 6px;
    text-align: left;
    text-decoration: none;
    display: flex;
    cursor: pointer;
    border-radius: 16em;
    width: fit-content;
    font-family: poppins;
    align-items: stretch;
}

    .blue-btn:hover {
        background-color: #fbb034;
        color: white;
        text-decoration: none;
    }

        .blue-btn:hover > .blue-btn-body {
            color: white;
        }

        .blue-btn:hover > .blue-btn-caret {
            background-color: #fecb81;
            color: white;
        }

.blue-btn-body {
    display: flex;
    padding: 15px 20px;
    flex-grow: 1;
}

.blue-btn-caret {
    color: #06A0D3;
    background-color: #bedae6;
    border: none;
    padding: 14px 12px 12px 12px;
    margin-left: -5.5px;
    text-align: center;
    text-decoration: none;
    display: flex;
    border-radius: 0 14em 14em 0em;
    font-size: 20px;
    position: relative;
}

    .blue-btn-caret .fa-angle-right {
        top: 50%;
        position: absolute;
        transform: translateY(-50%);
        margin-left: -4px;
    }

/*Orange button used throughout site (ex: calculator buttons) */
.orange-btn {
    color: white;
    background-color: #fbb034;
    border: none;
    padding: 0.3px 0px 0.3px 6px;
    text-align: left;
    text-decoration: none;
    display: flex;
    cursor: pointer;
    border-radius: 16em;
    width: fit-content;
    font-family: poppins;
    align-items: stretch;
}

    .orange-btn:hover {
        background-color: #06A0D3;
        color: white;
        text-decoration: none;
    }

        .orange-btn:hover > .orange-btn-body {
            color: white;
        }

        .orange-btn:hover > .orange-btn-caret {
            background-color: #33b5e4;
            color: white;
        }

.orange-btn-body {
    display: flex;
    padding: 15px 20px;
    flex-grow: 1;
    color: white;
}

.orange-btn-caret {
    color: white;
    background-color: #fecb81;
    border: none;
    padding: 14px 12px 12px 12px;
    margin-left: -5.5px;
    text-align: center;
    text-decoration: none;
    display: flex;
    border-radius: 0 14em 14em 0em;
    font-size: 20px;
    position: relative;
}

    .orange-btn-caret .fa-angle-right {
        top: 50%;
        position: absolute;
        transform: translateY(-50%);
        margin-left: -4px;
    }

/*Calculator button*/
#calculateStrandCableButton {
    margin: 10px 0px;
}

/*Site search dropdown menu button*/
.blue-btn:hover > #dropdown-item-btn-caret {
    background-color: #fecb81;
    color: white;
}

/*Search results page*/
#search-btn {
    margin-top: 1px;
    margin-left: 5px;
}

.searchresults {
    padding-left: 10px;
    padding-right: 10px;
}

    .searchresults a {
        color: #06A0D3;
        font-family: poppins,sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 1.15em;
    }

        .searchresults a:hover {
            color: #fbb034;
            text-decoration: none
        }

        .searchresults a:visited, .searchresults a:active, .searchresults a:focus {
            text-decoration: none;
        }

    .searchresults ul li:not(.no-chevron)::before {
        position: relative;
        bottom: 1.9pt;
        content: "";
        display: inline-block;
        width: 0.4em;
        height: 0.4em;
        border-right: 0.14em solid #58595B;
        border-top: 0.14em solid #58595B;
        transform: rotate(45deg);
        margin-right: 0.7em;
    }

    .searchresults ul {
        list-style: none;
    }

@media screen and (max-width: 767px) {
    .searchresults ul {
        padding-left: 0px;
    }
}

.searchresults ul li p {
    padding-left: 1.36em;
}

@media screen and (max-width: 767px) {
    #search-btn {
        margin-top: 16px;
        margin-left: 0px;
    }
}

/*404 page button*/
@media screen and (max-width: 992px) {
    #page-404-btn {
        margin-left: 12px;
    }
}

/*Navigation-Clean1.css code*/
.navigation-clean {
    background: #fff;
    padding-top: 10px;
    padding-bottom: 0px;
    color: #333;
    border-radius: 0;
    box-shadow: none;
    border: none;
    margin-bottom: 0;
    -webkit-box-shadow: 0 2px 10px 0 #ddd;
    box-shadow: 0 2px 10px 0 #ddd;
    font-family: poppins,sans serif;
}


@media (max-width:767px) {
    .navigation-clean {
        padding-top: 0;
        padding-bottom: 0;
    }
}

@media (max-width:767px) {
    .navigation-clean .navbar-header {
        padding-top: 10px;
        padding-bottom: 10px;
    }
}


.navbar-brand-nopadding {
    padding: 0 0 0 0;
}

.navigation-clean .navbar-brand:hover {
    color: #337ab7;
}

.navigation-clean.navbar-inverse .navbar-brand:hover {
    color: #f0f0f0;
}

.navigation-clean .navbar-brand img {
    height: 80%;
    display: inline-block;
    margin-right: 26px;
    margin-top: 6px;
    width: auto;
}

.navigation-clean .navbar-brand .logo {
    height: 100%;
    display: inline-block;
    margin-top: 0px;
    width: auto;
}

.navigation-clean .navbar-toggle {
    border-color: #ddd;
}

    .navigation-clean .navbar-toggle:hover, .navigation-clean .navbar-toggle:focus {
        background: none;
    }

.navigation-clean.navbar-inverse .navbar-toggle {
    border-color: #555;
    display: flex;
}

.navigation-clean .navbar-toggle .icon-bar {
    background-color: #888;
}

.navigation-clean.navbar-inverse .navbar-toggle .icon-bar {
    background-color: #eee;
}

.navigation-clean .navbar-collapse, .navigation-clean .navbar-form {
    border-top-color: #ddd;
}

.navigation-clean.navbar-inverse .navbar-collapse, .navigation-clean.navbar-inverse .navbar-form {
    border-top-color: #333;
}

.navigation-clean .navbar-nav > .active > a, .navigation-clean .navbar-nav > .open > a {
    background: none;
    box-shadow: none;
}

.navigation-clean.navbar-default .navbar-nav > .active > a, .navigation-clean.navbar-default .navbar-nav > .active > a:focus, .navigation-clean.navbar-default .navbar-nav > .active > a:hover {
    color: #8f8f8f;
    box-shadow: none;
    background: none;
    pointer-events: none;
}

.navigation-clean.navbar .navbar-nav > li > a {
    padding-left: 18px;
    padding-right: 18px;
}

.navigation-clean.navbar-default .navbar-nav > li > a {
    color: #465765;
}


.navigation-clean .navbar-nav > li > .dropdown-menu { /*dropdown menu entire container*/
    box-shadow: 0 4px 8px rgba(0,0,0,.1);
    background-color: #06A0D3;
    border-radius: 2px;
    padding: 2em 15em 2em 15em;
    border-width: 0 0.1em 0.1em 0.1em;
    height: 600%;
}

@media (max-width:767px) {
    .navigation-clean .navbar-nav .open .dropdown-menu {
        box-shadow: none;
    }
}

@media (max-width:767px) {
    .navigation-clean .navbar-nav .open .dropdown-menu > a { /*.open .dropdown-menu > a*/
        background-color: #06A0D3;
        color: #37434d;
        padding-top: 12px;
        padding-bottom: 12px;
        line-height: 1;
        text-align: center;
        display: inline-block;
    }
}

.navigation-clean .dropdown-menu > li > a:focus, .navigation-clean .dropdown-menu > li > a:hover {
    color: white;
    background: #fbb034;
}

.navigation-clean.navbar-inverse {
    background-color: #1f2021;
    color: #fff;
}

    .navigation-clean.navbar-inverse .navbar-nav > .active > a, .navigation-clean.navbar-inverse .navbar-nav > .active > a:focus, .navigation-clean.navbar-inverse .navbar-nav > .active > a:hover {
        color: #8f8f8f;
        box-shadow: none;
        background: none;
        pointer-events: none;
    }

    .navigation-clean.navbar-inverse .navbar-nav > li > a {
        color: #dfe8ee;
    }

        .navigation-clean.navbar-inverse .navbar-nav > li > a:focus, .navigation-clean.navbar-inverse .navbar-nav > li > a:hover {
            color: #fff !important;
            background-color: transparent;
        }

    .navigation-clean.navbar-inverse .navbar-nav > li > .dropdown-menu {
        background-color: #1f2021;
    }

    .navigation-clean.navbar-inverse .dropdown-menu > li > a:focus, .navigation-clean.navbar-inverse .dropdown-menu > li > a {
        color: #f2f5f8;
    }

        .navigation-clean.navbar-inverse .dropdown-menu > li > a:focus, .navigation-clean.navbar-inverse .dropdown-menu > li > a:hover {
            background: #363739;
        }

@media (max-width:767px) {
    .navigation-clean.navbar-inverse .open .dropdown-menu > a {
        color: #fff;
    }
}

.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {
    font-size: 17px;
}

/*Nadia's add-ins*/

/*New Nav*/
.nav-link.dropdown-toggle {
    display: inline-block;
    float: left;
    margin-left: 10px;
    padding-right: 40px;
    padding-left: 40px;
    padding-top: 11px;
    padding-bottom: 20px;
    color: #58595B;
    font-size: 20px;
    text-decoration: none;
    text-transform: lowercase;
}

    .nav-link.dropdown-toggle:hover {
        color: white;
        background-color: #06A0D3;
        text-decoration: none;
        border-radius: 0.5em 0.5em 0em 0em;
        border-width: 1em 1em 0em 1em;
        padding-bottom: 20px;
    }

/*Mega menu appears when hovering over navbar links*/
.nav-item-dropdown:hover .dropdown-menu {
    display: table;
    background-color: #06A0D3;
    position: absolute;
    z-index: 1;
    margin-top: 0px;
    box-shadow: 0 4px 8px rgba(0,0,0,.1);
    border-radius: 2px;
    padding: 2em 15em 2em 15em;
    border-width: 0 0.1em 0.1em 0.1em;
    text-align: center;
    left: 0;
    right: 0;
    width: 100%;
    height: auto;
}

.open > .dropdown-menu {
    display: table; /*block*/
    background-color: #06A0D3;
    position: absolute;
    z-index: 1;
    margin-top: -18px;
    box-shadow: 0 4px 8px rgba(0,0,0,.1);
    border-radius: 2px;
    padding: 2em 15em 2em 15em;
    border-width: 0 0.1em 0.1em 0.1em;
    text-align: center;
    left: 0;
    right: 0;
    max-width: 100%;
    height: auto;
}

/*Mega menu scrollbar*/
@media screen and (max-height: 925px) {
    .dropdown-menu .row {
        overflow: auto;
        height: auto;
        max-height: 500px;
    }

        .dropdown-menu .row::-webkit-scrollbar {
            width: 7px;
            background-color: transparent;
        }

    /* Handle */
    ::-webkit-scrollbar-thumb {
        background: #ddecf2;
    }

        /* Handle on hover */
        ::-webkit-scrollbar-thumb:hover {
            background: #bedae6;
        }
}

.dropdown-item {
    padding: 10px 30px 10px 30px;
    text-align: center;
    line-height: 3;
    font-size: 15px;
    color: #06A0D3;
    background-color: #dceefb;
    border-radius: 16em;
    font-size: 21px;
    white-space: nowrap;
}

    .dropdown-item:hover {
        color: white;
        background: #fbb034;
        text-decoration: none;
    }

.sub-dropdown-menu > a {
    color: white;
    text-decoration: none;
    font-size: 18px;
    padding-left: 15px;
    vertical-align: baseline;
    display: flex;
    font-weight: 300;
    padding-bottom: 12px;
}


    .sub-dropdown-menu > a:hover {
        color: #fbb034;
        text-decoration: none;
    }

.sub-dropdown-menu {
    text-align: left;
    padding: 15px;
}

.sub-dropdown-menu2 > a {
    color: white;
    text-decoration: none;
    font-size: 16px;
    padding-left: 15px;
    vertical-align: baseline;
    display: flex;
    font-weight: 300;
}

    .sub-dropdown-menu2 > a:hover {
        color: #fbb034;
        text-decoration: none;
    }

.h7 {
    color: #8f8f8f;
    position: absolute;
}

a.dropdown-item {
    margin-right: 10px;
}

.col {
    text-align: center;
    float: none;
    margin: 0 auto;
}

@media screen and (max-width: 1500px) {
    .col {
        width: 25%;
    }
}

.col:nth-child(3) > .sub-dropdown-menu {
    margin-left: 0.5em;
}

.col:nth-child(2) > .sub-dropdown-menu {
    margin-left: 0.5em;
}

.col:nth-child(1) > .sub-dropdown-menu {
    margin-left: 0.5em;
}

.col:nth-child(4) > .sub-dropdown-menu {
    margin-left: 0.5em;
}

.dropdown-menu > .row {
    display: flex;
}

@media screen and (max-width: 1380px) {
    .dropdown-menu > .row {
        margin-left: -70px;
    }
}

.mobile-menu {
    display: none;
}


@media screen and (max-width: 1200px) {
    #mobile-navbar-collapse {
        background-color: #06A0D3;
        padding-bottom: 15px;
        max-height: 100%;
        padding-top: 15px;
    }

    @media screen and (min-width: 768px) {
        #mobile-navbar-collapse {
            margin-top: 50px;
        }
    }

    .nav-link-header {
        margin-right: 50px;
        text-align: left;
        color: white;
        font-size: 16px;
        text-decoration: none;
        margin: 14px 25px 0px 15px;
        line-height: 2.5;
    }

    .h7 {
        text-decoration: none;
        text-transform: lowercase;
    }

    a:focus, a:hover {
        color: #fbb034;
    }

    .nav-links {
        margin-left: 15px;
        font-weight: 300;
    }

        .nav-links > a {
            text-align: left;
            color: white;
            text-decoration: none;
            font-size: 15.5px;
            line-height: 1.5;
        }

            .nav-links > a:hover, a:focus {
                color: #fbb034;
            }

    .nav-link.dropdown-toggle > a {
        list-style-type: none;
        margin: 14px 25px 0px 25px;
        display: block;
        text-decoration: none;
        position: absolute;
        text-align: left;
    }

    .dropdown-item {
        margin-left: 0px;
        margin-right: 0px;
        font-size: 20px;
        margin-top: 5px;
        margin-bottom: 5px;
        display: inline-block;
        border-radius: 16em;
        padding: 5px 30px 5px 30px;
        line-height: 2;
    }

    .open > .dropdown-menu {
        /*display: none; */
        text-align: left;
        padding: 2em 15em 2em 7em;
        /*height: 200px;*/
        max-height: 45vh;
        max-width: 100%;
        overflow: auto;
        overflow-y: scroll;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
    }

    .navigation-clean .navbar-brand img {
        height: 59%;
        margin-top: 10px;
        margin-left: 20px;
    }

    /*New mobile navbar*/

    .nav-header-mobile > li {
        text-align: left;
    }

    .desktop-menu {
        display: none;
    }

    .mobile-menu {
        display: contents;
    }

    .navbar-right-mobile {
        list-style: none;
        padding-right: 5px;
        padding-left: 5px;
        margin-bottom: 2px;
        margin-top: 15px;
        display: inline-block;
    }

        .navbar-right-mobile > li {
            display: inline;
            margin-right: 13px;
        }

    .navbar-right-link > a {
        text-decoration: none;
    }

    navbar-right-link > a:hover, a:visited, a:link, a:active {
        text-decoration: none;
    }

    @media (min-width: 768px) {
        .navbar-toggle {
            display: inline-block;
            float: right;
            position: absolute;
        }
    }

    .navbar-toggle {
        right: 15px;
    }

    #globe-dropdown {
        background-color: #06A0D3;
        padding-bottom: 15px;
        max-height: 100%;
        padding-top: 15px;
    }

        #globe-dropdown > a {
            color: white;
            line-height: 2.5;
            font-size: 16px;
            text-decoration: none;
            margin: 14px 25px 0px 15px;
            font-weight: 300;
        }

            #globe-dropdown > a:hover, a:focus {
                color: #fbb034
            }

    @media screen and (min-width: 768px) {
        #globe-dropdown {
            margin-top: 50px;
        }
    }

    #search-dropdown {
        background-color: #06A0D3;
        padding-bottom: 15px;
        max-height: 100%;
        padding-top: 15px;
    }

        #search-dropdown > p {
            color: white;
            line-height: 2.5;
            font-size: 16px;
            text-decoration: none;
            margin: 12px 25px 8px 13px;
            font-weight: 300;
        }

    @media screen and (min-width: 768px) {
        #search-dropdown {
            margin-top: 50px;
        }
    }

    button[name=mobile-search] {
        background-color: #fbb034;
        color: white;
        margin-bottom: 15px;
        margin-left: 12px;
        margin-top: 2px;
    }

        button[name=mobile-search] .blue-btn-caret {
            background-color: #fecb81;
            color: white;
        }

        button[name=mobile-search]:hover {
            background-color: #ddecf2;
            color: #06A0D3;
        }

            button[name=mobile-search]:hover > #mobile-search-caret {
                background-color: #bedae6;
                color: #06A0D3;
            }

    #query, #query-mobile {
        width: 90%;
        background-color: #dceefb;
        border-radius: 8px;
        border: 0;
        line-height: 2.2;
        font-size: 16px;
        margin-left: 10px;
        margin-right: 10px;
        box-shadow: 0 0 3px gray;
    }

    button.navbar-toggle {
        border: 0;
    }

    .dropdown-backdrop {
        display: none;
    }

    .navbar.navbar-default.navbar-fixed-top.navigation-clean > .container {
        padding-left: 0px;
        padding-right: 0px;
        margin-right: 0px;
        margin-left: 0px;
        width: 100%;
    }

    .navbar.navbar-default.navbar-fixed-top.navigation-clean {
        padding-bottom: 0px;
    }
}

/*@media screen and (max-width: 355px) and (min-width: 280px) {
    ul.navbar-right-mobile > li {
        margin-left: -19px;
    }
}*/

@media screen and (max-width: 280px) {
    ul.navbar-right-mobile {
        margin-left: 30px;
    }
}

/*Table formatting*/
table {
    max-width: 100%; /*Takes care of overset tables*/
    font-size: 12px;
    margin-top: 18.5px;
}

tr:nth-child(odd) {
    background-color: #fff1e2;
}

td:not(:last-child) {
    border-right: 4px solid white;
}

td, th {
    padding: 5px 15px;
}

    td > p {
        margin-bottom: 0px;
    }

    th > p {
        margin-bottom: 0px;
    }

#strandCableResults tr:nth-child(even) {
    background-color: #fff1e2;
}

#strandCableResults tr:nth-child(odd) {
    background-color: white;
}

#strandCableResults td {
    border-top: none;
}

#strandCableHead tr:first-child {
    background-color: #fff1e2;
}

#strandCableHead th {
    border-bottom: none;
}

th:not(:last-child) {
    border-right: 4px solid white;
}

@media screen and (max-width: 767px) {
    table {
        overflow: auto;
        display: block;
    }
}

.panel-bar {
    width: 100%;
    height: 14px;
    margin-bottom: 0px;
    margin-top: 13.6px;
    background-color: #06A0D3;
}
/*Search menu overrides*/

#SearchDropdown {
    margin-top: -1px;
    margin-right: 0px;
}
.search-dropdown {
    border-radius: .5em;
    border-top-right-radius: 0;
    padding: .8em;
}

    .search-dropdown.search-text {
        border-radius: .5em;
    }

.dropdown:focus .fa.fa-search {
    color: white;
    padding: 0;
}

#NavSearch .fa-search {
    padding: 8px;
}

#nav-search-btn {
    padding-left: 0px;
    padding-right: 0px;
    margin-top: 7px;
}

#search-dropdown-btn {
    margin-top: 20px;
    margin-bottom: 7px;
}
/*Language translations dropdown*/

.language-dropdown-button :hover {
    border-radius: .6em;
    background-color: #06A0D3;
    color: white;
    padding: .1em .5em 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.language-dropdown .dropdown-content {
    border-radius: 1em;
    font-weight: 300;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #06A0D3;
    min-width: 160px;
    height: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    left: auto;
    right: 0;
    margin-top: -5px;
    margin-right: 8px;
}

    .dropdown-content a {
        color: white;
        padding: 8px 16px;
        text-decoration: none;
        display: block;
        font-size: 18px;
        font-family: poppins, sans-serif;
    }

        .dropdown-content a:hover {
            color: #fbb034;
        }

#globe-dropdown-content {
    margin-top: 0px;
    margin-right: 0px;
    border-top-right-radius: 0;
}

/* Show the language menu on hover */
.dropdown:active .dropdown-content {
    display: block;
    margin-top: 0px;
    margin-right: 0px;
}

button.navbar-right-link {
    margin-top: 11px;
    border: none;
    background-color: white;
}

.navbar-right-link {
    font-family: poppins, sans-serif;
}

.language-dropdown:hover .language-dropdown-button {
    background-color: #06A0D3;
    padding: .3em .3em 0;
    color: white;
    border-radius: .5em;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.dropdown:hover .fa.fa-globe {
    color: white;
    padding: 0;
}

.dropdown:hover .language-dropdown-button > p {
    color: white;
    padding: 0;
}

.navbar-collapse > .dropdown-menu:hover .nav-link.dropdown-toggle {
    background-color: blue;
}

.language-dropdown-button > p {
    margin-bottom: 0px;
}

img {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
}

iframe {
    max-width: 100%;
}

#strandCableBody td:first-child {
    width: 15%;
}

@media (max-width: 450px) {
    #strandCableBody img {
        min-width: 50px;
        min-height: 50px;
    }
}

/*Dark Mode*/
/*Theme switch button*/
.theme-switch {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .theme-switch .checkbox {
        opacity: 0;
        position: absolute;
    }

    .theme-switch .label {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 8px;
        border-radius: 50px;
        position: relative;
        height: 40px;
        width: 73px;
        cursor: pointer;
        background-color: #dceefb;
        margin-left: 10px;
        margin-top: 4px;
    }

    .theme-switch .ball {
        transition: all ease-in-out 0.3s;
        position: absolute;
        border-radius: 50%;
        top: 5px;
        left: 5px;
        height: 30px;
        width: 30px;
    }

    .theme-switch .moon {
        transform-origin: center center;
        transition: all 0.5s cubic-bezier(0.76, 0, 0.24, 1);
        transform: rotate(0);
    }

    .theme-switch .sun {
        transform-origin: center center;
        transition: all 0.5s cubic-bezier(0.76, 0, 0.24, 1);
        transform: rotate(0);
        color: #121212;
    }

    .theme-switch .ball {
        transform: translateX(0);
        background-color: #bedae6;
    }

.dark .theme-switch .ball {
    transform: translateX(33px);
    background-color: #fecb81;
}

.dark .theme-switch .label {
    background-color: #fbb034;
}

.navbar-right {
    margin-right: 0px;
}

@media screen and (max-width: 1200px) {
    .theme-switch {
        justify-content: left;
        margin-top: 10px;
    }

        .theme-switch .label {
            height: 28px;
            width: 50px;
            margin-top: -22px;
            margin-left: 50px;
            margin-right: 20px;
            padding: 7px;
        }

        .theme-switch .checkbox {
            margin-top: -28px;
            margin-left: 50px;
        }

        .theme-switch .moon {
            height: 14px;
            width: 14px;
        }

        .theme-switch .sun {
            height: 14px;
            width: 14px;
        }

        .theme-switch .ball {
            height: 20px;
            width: 20px;
            top: 4px;
        }

    .dark .theme-switch .ball {
        transform: translateX(21px);
    }

    .navbar-right-link {
        padding-left: 1px;
        padding-right: 6px;
    }

    .navbar.navbar-default.navbar-fixed-top.navigation-clean > .container {
        margin-bottom: -10px;
    }

    .navbar-right-mobile {
        margin-top: 12px;
    }

    .dark #mobile-navbar-collapse {
        background-color: #2e2e2e;
    }

    .dark .navigation-clean .navbar-toggle .icon-bar {
        background-color: white !important;
    }
}

.dark body {
    background-color: #121212;
}

.dark .navigation-clean {
    background-color: #2e2e2e;
    color: #ffffff;
    box-shadow: none;
}

    .dark .navigation-clean h7 {
        color: #ffffff;
    }

        .dark .navigation-clean h7:hover {
            color: #fbb034;
        }

.dark .footer-basic {
    background-color: #2e2e2e;
    color: #e2e2e2;
}

.dark .footer-nav {
    background-color: #1f1f1f;
}

    .dark .footer-nav a {
        color: #e2e2e2;
    }

        .dark .footer-nav a:hover {
            color: #fbb034;
        }

.dark .feature-card {
    background-color: #1f1f1f;
}

.dark .feature-card-bar {
    background-color: #353535;
}

.dark .feature-card-subtitle {
    color: #e2e2e2;
}

.dark .nav-item-dropdown:hover .dropdown-menu {
    background-color: #2e2e2e;
}

.dark .nav-link.dropdown-toggle:hover {
    background-color: #2e2e2e;
}

.dark .blue-btn {
    color: #121212;
    background-color: #fbb034;
    border: none;
    padding: 0.3px 0px 0.3px 6px;
    text-align: left;
    text-decoration: none;
    display: flex;
    cursor: pointer;
    border-radius: 16em;
    font-family: poppins;
    align-items: stretch;
}

    .dark .blue-btn:hover {
        background-color: #06A0D3;
        color: white;
    }

        .dark .blue-btn:hover > .blue-btn-caret {
            background-color: #33b5e4;
            color: white;
        }

.dark .blue-btn-body {
    display: flex;
    padding: 15px 20px;
    flex-grow: 1;
}

.dark .blue-btn-caret {
    color: #121212;
    background-color: #fecb81;
    border: none;
    padding: 14px 12px 12px 12px;
    margin-left: -5.5px;
    text-align: center;
    text-decoration: none;
    display: flex;
    border-radius: 0 14em 14em 0em;
    font-size: 20px;
    position: relative;
}

    .dark .blue-btn-caret .fa-angle-right {
        top: 50%;
        position: absolute;
        transform: translateY(-50%);
        margin-left: -4px;
    }

.dark .orange-btn {
    color: #121212;
}

    .dark .orange-btn:hover {
        color: white;
    }

.dark button[name=mobile-search] {
    color: #121212;
}

    .dark button[name=mobile-search]:hover {
        color: #06A0D3;
    }

.dark .orange-btn-caret {
    color: #121212;
}

.dark .orange-btn-body {
    color: #121212;
}

.dark #search-dropdown {
    background-color: #2e2e2e;
}

.dark .search-dropdown {
    background-color: #2e2e2e;
}

    .dark .search-dropdown .search-text {
        color: #2e2e2e;
    }

.dark #query, #query-mobile {
    color: #2e2e2e;
}

.dark #search-dropdown-btn:hover > #dropdown-item-btn-caret {
    background-color: #33b5e4;
    color: white;
}

.dark .search-button-desktop:hover {
    background-color: #2e2e2e;
}

.dark .dropdown:hover .fa.fa-search {
    color: #fbb034;
}

.dark .navbar-right-link {
    color: white;
    background-color: #2e2e2e;
}

.dark .fa-search {
    background-color: #2e2e2e;
}

    .dark .fa-search:before {
        background-color: #2e2e2e;
    }

.dark .dropdown:hover .search-button-desktop {
    background-color: #2e2e2e;
}

.dark .fa.fa-globe:hover {
    background-color: #2e2e2e;
    color: #fbb034;
}

.dark .dropdown:hover .language-dropdown-button > p {
    background-color: #2e2e2e;
}

.dark .panel-default {
    background-color: #1f1f1f;
    border: none;
}

.dark .panel-bar {
    background-color: #353535;
}

.dark .searchresults p {
    color: #e2e2e2;
}

.dark #searchResultsIcon {
    background-color: transparent;
}

    .dark #searchResultsIcon:before {
        background-color: transparent;
    }

.dark #globe-dropdown {
    background-color: #2e2e2e;
}

.dark #globe-dropdown-content {
    background-color: #2e2e2e;
}

.dark #language-dropdown-button:hover {
    background-color: #2e2e2e;
}

.dark .dropdown:hover #language-dropdown-button {
    background-color: #2e2e2e;
}

.dark .panel-default ul li:not(.no-chevron)::before {
    border-right: 0.14em solid #e2e2e2;
    border-top: 0.14em solid #e2e2e2;
}

.dark tr:nth-child(odd) {
    background-color: #353535;
}

.dark td:not(:last-child) {
    border-right: 4px solid #1f1f1f;
}

.dark #strandCableResults tr:nth-child(even) {
    background-color: #353535;
}

.dark #strandCableResults tr:nth-child(odd) {
    background-color: #1f1f1f;
}

.dark #strandCableHead th {
    background-color: #353535;
}

.dark th:not(:last-child) {
    border-right: 4px solid #1f1f1f;
}

.dark .umbraco-forms-form input.text, .dark .umbraco-forms-form textarea {
    color: black;
}

.dark .umbraco-forms-navigation .btn {
    color: black;
}

/*Images*/
.dark .feature-card-image {
    display: none;
}

.dark .feature-card-image-dark {
    display: inline-block;
    max-width: 75%;
    max-height: 75%;
}

.feature-card-image-dark {
    display: none;
}

.dark #navigationLogoLight {
    display: none;
}

.dark #navigationLogoDark {
    display: inline-block;
}

#navigationLogoDark {
    display: none;
}

.dark #navigationLogoLightMobile {
    display: none;
}

.dark #navigationLogoDarkMobile {
    display: inline-block;
}

#navigationLogoDarkMobile {
    display: none;
}

/*Dark mode for when user's browser is set to dark*/
@media (prefers-color-scheme: dark) {
    body {
        background-color: #121212;
        color: #e2e2e2;
    }

    .navigation-clean {
        background-color: #2e2e2e;
        color: #ffffff;
        box-shadow: none;
    }

        .navigation-clean h7 {
            color: #ffffff;
        }

            .navigation-clean h7:hover {
                color: #fbb034;
            }

    .footer-basic {
        background-color: #2e2e2e;
        color: #e2e2e2;
    }

    .footer-nav {
        background-color: #1f1f1f;
    }

        .footer-nav a {
            color: #e2e2e2;
        }

            .footer-nav a:hover {
                color: #fbb034;
            }

    .feature-card {
        background-color: #1f1f1f;
    }

    .feature-card-bar {
        background-color: #353535;
    }

    .feature-card-subtitle {
        color: #e2e2e2;
    }

    .nav-item-dropdown:hover .dropdown-menu {
        background-color: #2e2e2e;
    }

    .nav-link.dropdown-toggle:hover {
        background-color: #2e2e2e;
    }

    .blue-btn {
        color: #121212;
        background-color: #fbb034;
        border: none;
        padding: 0.3px 0px 0.3px 6px;
        text-align: left;
        text-decoration: none;
        display: flex;
        cursor: pointer;
        border-radius: 16em;
        font-family: poppins;
        align-items: stretch;
    }

        .blue-btn:hover {
            background-color: #06A0D3;
            color: white;
        }

            .blue-btn:hover > .blue-btn-caret {
                background-color: #33b5e4;
                color: white;
            }

    .blue-btn-body {
        display: flex;
        padding: 15px 20px;
        flex-grow: 1;
    }

    .blue-btn-caret {
        color: #121212;
        background-color: #fecb81;
        border: none;
        padding: 14px 12px 12px 12px;
        margin-left: -5.5px;
        text-align: center;
        text-decoration: none;
        display: flex;
        border-radius: 0 14em 14em 0em;
        font-size: 20px;
        position: relative;
    }

        .blue-btn-caret .fa-angle-right {
            top: 50%;
            position: absolute;
            transform: translateY(-50%);
            margin-left: -4px;
        }

    .orange-btn {
        color: #121212;
    }

        .orange-btn:hover {
            color: white;
        }

    .orange-btn-body {
        color: #121212;
    }

    button[name=mobile-search] {
        color: #121212;
    }

        button[name=mobile-search]:hover {
            color: #06A0D3;
        }

    .orange-btn-caret {
        color: #121212;
    }

    #search-dropdown {
        background-color: #2e2e2e;
    }

    .search-dropdown {
        background-color: #2e2e2e;
    }

        .search-dropdown .search-text {
            color: #2e2e2e;
        }

    #query, #query-mobile {
        color: #2e2e2e;
    }

    #search-dropdown-btn:hover > #dropdown-item-btn-caret {
        background-color: #33b5e4;
        color: white;
    }


    .dropdown:hover .fa.fa-search {
        color: #fbb034;
    }

    .navbar-right-link {
        color: white;
        background-color: #2e2e2e;
    }

    .fa-search {
        background-color: #2e2e2e;
    }

        .fa-search:before {
            background-color: #2e2e2e;
        }

    .dropdown:hover .search-button-desktop {
        background-color: #2e2e2e;
    }

    .dropdown:hover .fa.fa-globe {
        background-color: #2e2e2e;
        color: #fbb034;
    }

    .dropdown:hover .language-dropdown-button > p {
        background-color: #2e2e2e;
    }

    .panel-default {
        background-color: #1f1f1f;
        border: none;
    }

    .panel-bar {
        background-color: #353535;
    }

    .searchresults p {
        color: #e2e2e2;
    }

    #searchResultsIcon {
        background-color: transparent;
    }

        #searchResultsIcon:before {
            background-color: transparent;
        }

    #globe-dropdown {
        background-color: #2e2e2e;
    }

    #globe-dropdown-content {
        background-color: #2e2e2e;
    }

    #language-dropdown-button:hover {
        background-color: #2e2e2e;
    }

    .dropdown:hover #language-dropdown-button {
        background-color: #2e2e2e;
    }

    .panel-default ul li:not(.no-chevron)::before {
        border-right: 0.14em solid #e2e2e2;
        border-top: 0.14em solid #e2e2e2;
    }

    tr:nth-child(odd) {
        background-color: #353535;
    }

    td:not(:last-child) {
        border-right: 4px solid #1f1f1f;
    }

    #strandCableResults tr:nth-child(even) {
        background-color: #353535;
    }

    #strandCableResults tr:nth-child(odd) {
        background-color: #1f1f1f;
    }

    #strandCableHead th {
        background-color: #353535;
    }

    th:not(:last-child) {
        border-right: 4px solid #1f1f1f;
    }

    .umbraco-forms-form input.text, .umbraco-forms-form textarea {
        color: black;
    }

    .umbraco-forms-navigation .btn {
        color: black;
    }

    .feature-card-image {
        display: none;
    }

    .feature-card-image-dark {
        display: inline-block;
        max-width: 75%;
        max-height: 75%;
    }

    #navigationLogoLight {
        display: none;
    }

    #navigationLogoDark {
        display: inline-block;
    }

    #navigationLogoLightMobile {
        display: none;
    }

    #navigationLogoDarkMobile {
        display: inline-block;
    }

    button.navbar-right-link {
        color: white;
        background-color: #2e2e2e;
    }

    .theme-switch .ball {
        transform: translateX(33px);
        background-color: #fecb81;
    }

    .theme-switch .label {
        background-color: #fbb034;
    }

    .light .theme-switch .label {
        background-color: #dceefb;
    }

    .light .theme-switch .ball {
        transform: translateX(0);
        background-color: #bedae6;
    }

    .light .navigation-clean {
        background: #fff;
        color: #333;
        box-shadow: 0 2px 10px 0 #ddd;
    }

        .light .navigation-clean h7 {
            color: #58595B;
        }

    .light .nav-link.dropdown-toggle {
        color: #58595B;
    }

        .light .nav-link.dropdown-toggle:hover {
            color: white;
        }

    .light #navigationLogoLight {
        display: inline-block;
    }

    .light #navigationLogoDark {
        display: none;
    }

    .light #navigationLogoLightMobile {
        display: inline-block;
    }

    .light #navigationLogoDarkMobile {
        display: none;
    }

    .light body {
        background-color: #dceefb;
        color: #58595B;
    }

    .light .navbar-right-link {
        color: #06A0D3;
        background-color: white;
    }

    .light .footer-basic {
        background-color: #00a3de;
        color: #fff;
    }

    .light .footer-nav {
        background-color: #fff;
    }

        .light .footer-nav a {
            color: #58595B;
        }

            .light .footer-nav a:hover {
                color: #fbb034;
            }

    .light .feature-card {
        background-color: #fff;
    }

    .light .feature-card-bar {
        background-color: #06A0D3;
    }

    .light .feature-card-image {
        display: inline-block;
    }

    .light .feature-card-image-dark {
        display: none;
    }

    .light .feature-card-subtitle {
        color: #58595B;
    }

    .light .nav-item-dropdown:hover .dropdown-menu {
        background-color: #06A0D3;
    }

    .light .nav-link.dropdown-toggle:hover {
        background-color: #06A0D3;
    }

    .light .navigation-clean h7:hover {
        color: white;
    }

    .light .nav-link.dropdown-toggle:hover > h7 {
        color: white;
    }

    .light .blue-btn {
        color: #06A0D3;
        background-color: #ddecf2;
    }

        .light .blue-btn:hover {
            background-color: #fbb034;
            color: white;
        }

            .light .blue-btn:hover > .blue-btn-caret {
                background-color: #fecb81;
                color: white;
            }

    .light .blue-btn-caret {
        color: #06A0D3;
        background-color: #bedae6;
    }

    .light .orange-btn {
        color: white;
    }

        .light .orange-btn:hover {
            color: white;
        }

    .light .orange-btn-body {
        color: white;
    }

    .light button[name=mobile-search] {
        color: white;
    }

        .light button[name=mobile-search]:hover {
            color: white;
        }

    .light #search-dropdown-btn {
        background-color: #ddecf2;
        color: #06A0D3;
    }

        .light #search-dropdown-btn:hover {
            background-color: #f8b445;
            color: white;
        }

    .light #dropdown-item-btn-caret {
        background-color: #bedae6;
        color: #06A0D3;
    }

    .light #search-dropdown-btn:hover > #dropdown-item-btn-caret {
        background-color: #fecb81;
        color: white;
    }

    .light .orange-btn-caret {
        color: white;
    }

    .light .panel-default {
        background-color: white;
    }

    .light .panel-bar {
        background-color: #06A0D3;
    }

    .light tr:nth-child(odd) {
        background-color: #fff1e2;
    }

    .light td:not(:last-child) {
        border-right: 4px solid white;
    }

    .light #strandCableResults tr:nth-child(even) {
        background-color: #fff1e2;
    }

    .light #strandCableResults tr:nth-child(odd) {
        background-color: white;
    }

    .light #strandCableHead th {
        background-color: #fff1e2;
    }

    .light th:not(:last-child) {
        border-right: 4px solid white;
    }

    .light #globe-dropdown {
        background-color: #06A0D3;
    }

    .light .dropdown:hover #language-dropdown-button {
        background-color: #06A0D3;
    }

    .light #language-dropdown-button:hover {
        background-color: #06A0D3;
    }

    .light #globe-dropdown-content {
        background-color: #06A0D3;
    }

    .light .language-dropdown-button:hover > p {
        background-color: #06A0D3;
    }

    .light .fa-globe {
        color: #06A0D3;
    }

    .light .dropdown:hover .fa.fa-globe {
        background-color: #06A0D3;
        color: white;
    }

    .light .dropdown:hover .language-dropdown-button > p {
        color: white;
        background-color: #06A0D3;
    }

    .light .dropdown:hover .search-button-desktop {
        background-color: transparent;
    }

    .light .dropdown:hover .fa.fa-search {
        color: #06A0D3;
        padding: 0;
    }

    .light i.fa.fa-search:before {
        background-color: transparent;
    }

    .light .fa-search {
        background-color: transparent;
    }

        .light .fa-search:before {
            background-color: white;
        }

    .light .search-dropdown {
        background-color: #06A0D3;
    }

    .light .dropdown:hover .search-button-desktop {
        background-color: transparent;
    }

    .light .searchresults p {
        color: #58595B;
    }

    .light .panel-default ul li:not(.no-chevron)::before {
        border-right: 0.14em solid #58595B;
        border-top: 0.14em solid #58595B;
    }


    @media screen and (max-width: 1200px) {
        .theme-switch .ball {
            transform: translateX(21px);
        }

        #mobile-navbar-collapse {
            background-color: #2e2e2e;
        }

        .navigation-clean .navbar-toggle .icon-bar {
            background-color: white !important;
        }

        .light .navigation-clean .navbar-toggle .icon-bar {
            background-color: #06A0D3 !important;
        }

        .light #mobile-navbar-collapse {
            background-color: #06A0D3;
        }

        .light .navigation-clean h7 {
            color: white;
        }

        .light #search-dropdown {
            background-color: #06A0D3;
        }

            .light #search-dropdown .orange-btn:hover {
                color: #06A0D3;
            }
    }
}
