﻿/*body {
    margin: 0rem 88.50px;
}*/


@font-face {
    font-family: 'Exo2-Black';
    src: url('../fonts/Exo2-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Exo2-Regular';
    src: url('../fonts/Exo2-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Exo2-SemiBold';
    src: url('../fonts/Exo2-SemiBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Raleway-Black';
    src: url('../fonts/Raleway-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Raleway-Bold';
    src: url('../fonts/Raleway-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Raleway-Medium';
    src: url('../fonts/Raleway-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Raleway-Regular';
    src: url('../fonts/Raleway-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Raleway-SemiBold';
    src: url('../fonts/Raleway-SemiBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Raleway-Thin';
    src: url('../fonts/Raleway-Thin.ttf') format('truetype');
}

@font-face {
    font-family: 'Exo2-Light';
    src: url('../fonts/Exo2-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Raleway-Light';
    src: url('../fonts/Raleway-Light.ttf') format('truetype');
}

.font-blue {
    color: #003365;
}

.font-gray {
    color: #828282 !important;
}

.font-body-copy {
    font-family: 'Raleway-SemiBold' !important;
    font-size: 17px;
    line-height: 20px;
    color: #000000 !important;
}

.font-body {
    font-family: Raleway-Regular !important;
    font-size: 17px;
    line-height: 20px;
}

.font-submenu {
    font-family: Raleway-Regular !important;
    font-size: 17px;
    line-height: 30px;
    color: #003365
}

.font-table {
    font-family: Raleway-Regular !important;
    font-size: 8px;
    line-height: 10px;
}

.font-toolbar {
    font-family: Raleway-Medium !important;
    font-size: 18px;
    line-height: 20px;
    color: #000000 !important;
}

.font-light {
    font-family: Raleway-Light !important;
    font-size: 13px;
    line-height: 20px;
}

.sec-margin-left {
    margin-left: 14.50px;
}

.sec-margin-right {
    margin-right: 14.50px;
}

.navbar-nav .sec-margin-left {
    margin-left: 30px !important;
}

.navbar-nav .sec-margin-right {
    margin-right: 30px !important;
}

@media (min-width:1050px) {
    .font-table {
        font-family: Raleway-Regular !important;
        font-size: 12px;
        line-height: 20px;
    }

    .font-body {
        font-family: Raleway-Regular !important;
        font-size: 16px;
        line-height: 20px;
    }

    .font-body-copy {
        font-family: 'Raleway-SemiBold' !important;
        font-size: 17px;
        line-height: 21px;
    }

    .sec-margin-left {
        margin-left: 88.50px;
    }

    .sec-margin-right {
        margin-right: 88.50px;
    }

    .font-header {
        font-family: 'Exo2-SemiBold' !important;
    }

    .font-header-small {
        font-family: Exo2-Light !important;
        font-size: 1.25rem;
        line-height: 30px;
        text-align: justify;
    }

    .font-header-medium {
        font-family: 'Exo2-SemiBold';
        font-size: 2rem;
    }

    .font-header-large {
        font-family: 'Exo2-SemiBold';
        font-size: 2.45rem;
        letter-spacing: -1px;
    }

    .font-header-xlarge {
        font-family: 'Exo2-SemiBold' !important;
        font-size: 3rem !important;
    }
}

.cross-signs {
    font-family: Exo2-Regular;
    font-size: 1.75rem;
    line-height:1rem;
    font-weight:300;
}

.font-header {
    font-family: 'Exo2-SemiBold' !important;
}

.font-header-small {
    font-family: Exo2-Light !important;
    font-size: 1.25rem;
    line-height: 30px;
    text-align: justify;
}

.font-header-medium {
    font-family: 'Exo2-SemiBold';
    font-size: 1.75rem;
}

.font-header-large {
    font-family: 'Exo2-SemiBold';
    font-size: 2.25rem;
    letter-spacing: -1px;
}

.font-header-xlarge {
    font-family: 'Exo2-SemiBold' !important;
    font-size: 3rem !important;
}

header {
    padding-bottom: 0px;
}

.bg-blue {
    background-color: #002147;
}

.bg-blue-light {
    background: rgba(0, 33, 71, .8);
}

.bg-blue-lighter {
    background: rgba(0, 33, 71, .5);
}

.bg-yellow {
    background: #FFCC2A;
}

.fade-in div {
    transition: 1s ease;
}

    .fade-in div:hover {
        background: #707070;
    }

.fade-in div {
    background: #707070;
}


.border-top-gray {
    border-top: 1px solid rgba(112, 112, 112, 1);
}

.border-left-blue {
    border-left: 0.5px solid #002147;
}

.border-gray {
    border: 0.5px solid rgba(112, 112, 112, 1);
}

.padding-large {
    padding-left: 5rem;
}

.card {
    border-radius: 0;
}

.icon-flipped {
    transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
}

.custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 33, 71, 1)' stroke-width='4' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
}

.navbar-brand {
    height: 80%;
    width: 75%;
}

.header-large-items {
    font-size: 26px;
}

@media (min-width:500px) {
    .navbar-brand {
        height: 40%;
        width: 40%;
    }
}

@media screen and (max-width: 800px) {
    #firstNav {
        visibility: hidden;
        clear: both;
        float: left;
        margin: 0;
        width: 0%;
        display: none;
    }
}

@media screen and (max-width: 1000px) {
    #firstNav {
        visibility: hidden;
        clear: both;
        float: left;
        margin: 0;
        width: 0%;
        display: none;
    }
}

@media screen and (min-width: 1050px) {
    .navbar-nav {
        flex: none;
    }
}

@media screen and (max-width: 1050px) {
    .navbar-nav {
        flex: row;
    }
}


.ul-two {
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
    list-style-type: none;
    -webkit-column-gap: 1px; /* Chrome, Safari, Opera */
    -moz-column-gap: 1px; /* Firefox */
    column-gap: 1px;
}

.border-3 {
    border-width: 3px !important;
}

button:active,
button:focus {
    outline: none !important;
}

.card-body {
    padding-right: 30px;
    padding-left: 30px;
}

.btn-inquire {
    padding: 0.75rem;
    border-radius: 0.5rem;
    background-color: #002147;
}

.btn-arrow {
    border-radius: 20px;
}


@media (max-width:1050px) {
    .sec-footer-padding {
        padding: 0 14.50px !important;
    }
}

@media (max-width:1000px) {

    .sec-footer-padding {
        padding: 0 !important;
    }
}

.header-logo-left {
    margin-left: 30px;
}

.logo {
    width: 40%;
}

@media (min-width:1050px) {
    .logo {
        width: 25%;
    }
}

    .text-footer-padding {
        padding-right: 0;
    }

    @media (min-width:1050px) {
        .header-logo-left {
            margin-left: 0;
        }

        .sec-padding {
            padding: 0 88.50px !important;
        }

        .sec-footer-padding {
            padding: 0 20px !important;
        }

        .text-footer-padding {
            padding-right: 205px !important;
        }

        .logo {
            width: 30%;
        }

        .card-body {
            padding-right: 88.50px;
            padding-left: 88.50px;
        }
    }

    .square {
        width: 100px
    }

    .header-image {
        height: auto;
        width: 100%;
    }

    @media (min-width:1050px) {
        .header-image {
            height: 340px;
            padding-right: 88.50px;
            width: 100%;
        }
    }

    .header-top {
        margin-top: 2rem;
    }

    .header-body {
        padding-right: 100px !important;
        padding-top: 20px;
        padding-left: 20px;
        padding-bottom: 20px;
    }

    .quote-body-1 {
        margin-top: -80px;
        margin-left: -5px;
    }

    .quote-body-2 {
        margin-top: 150px;
        transform: scaleX(-1);
    }

    #client-body {
        margin-top: 50px;
        padding: 0 30px;
    }

    .client-section-text {
        margin-top: -120px;
    }

.modal-img {
    width: 380px;
    height: 200px;
}

.modal-img-before {
    width: 366px;
    height: 200px;
}

.proj-img {
    width: 395px;
    height: 300px;
}

.proj-img-before {
    width: 366px;
    height: 200px;
}


.after-label {
    position: relative;
    top: -190px;
    width:50%;
    float:right;
    right: 0px;
    padding: 8px 55px;
}

.proj-label {
    position: relative;
    top: -190px;
    width: 65%;
    float: right;
    right: 0px;
    padding: 8px 15px;
}

.proj-dropdown {
    margin-left: -5px !important;
    border-top:1px solid gray;
    padding: 5px 0px;
    margin-top: 11px;
    box-shadow: 0px;
    min-width: 14rem;
    text-align: center;
}

.before-label {
    position: absolute;
    top: 5px;
    left: 50%;
    padding: 8px 55px;
    transform: translate(-50%, -50%);
}

.before-proj-label {
    position: absolute;
    left: 50%;
    padding: 8px 55px;
    transform: translate(-50%, -50%);
}

    @media (min-width:1050px) {
        #client-body {
            margin-top: 300px;
            padding-left: 3rem;
            padding-right: 3rem;
        }

        .modal-img {
            width: 380px;
            height: 400px;
        }

        .modal-img-before {
            width: 366px;
            height: 240px;
        }

        .after-label {
            position: absolute;
            top: 10px;
            right: 0px;
            padding: 8px 55px;
        }

        .proj-label {
            position: absolute;
            top: 10px;
            right: 0px;
            padding: 8px 15px;
        }

        .proj-dropdown {
            margin-left: -60px !important;
            border: 0;
            padding: 5px 0px;
            margin-top: 21px;
            box-shadow: 0px;
        }

        .proj-img {
            width: 365px;
            height: 330px;
            float:right;
        }

        .proj-img-before {
            width: 391px;
            height: 300px;
        }
    }

    .client-quote-2 {
        margin-top: 100px;
        transform: scaleX(-1);
    }

    tr:nth-child(even) {
        background-color: #e5eaef
    }

    .close-btn {
        float: right;
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1;
        color: #000;
        text-shadow: 0 1px 0 #fff;
        opacity: 1;
        right: -20px;
        position: relative;
        top: -15px;
    }

    .close-img {
        width: 40px;
        height: 40px;
    }

    .dropdown-divider {
        border-top: 1px solid #707070
    }

    body {
        font-family: 'Roboto', sans-serif;
        font-size: 14px;
        line-height: 18px;
        background: #f4f4f4;
    }

    /* Pagination links */
    .pagination a {
        color: black;
        padding: 8px 16px;
        text-decoration: none;
        transition: background-color .3s;
    }

        /* Style the active/current link */
        .pagination a.active {
            background-color: dodgerblue;
            color: white;
        }

        /* Add a grey background color on mouse-over */
        .pagination a:hover:not(.active) {
            background-color: #ddd;
        }


.special-col
{
    max-width: 48% !important;
}

.special-col-margin{
    margin-right: 0.75rem;
}