/**
* Override.css
* 6/17/2021
*
* Overrides the themes default styling. 
*
* Quest Digital 2021
*/

/* ========================================
   CSS VARIABLES
   ======================================== */

:root {
    --maroon: #6F0C24;
    --white: #ffffff;
    --brown: #4e2714;
    --black: #000000;
    --pink: #f08080;
    --beige: #DECBA5;
    --orange: #f37445;
    --amber: #883000;
    --purple: #aa237a;
    --mediumblue: #009ca2;
    --blue: #47778b;
    --merlot: #b6a6ad;
    --green: #a7b8b3;
    --grey: #fafafa;
    --gold: #b5b076;
    --dark-grey: #2e2e2e;
    --font-oswald: 'Oswald', sans-serif;
    --font-robotoslab: 'Roboto Slab', serif;
}


/* ========================================
   COLOR UTILITY CLASSES
   ======================================== */

.white {
    color: var(--white);
}

.orange {
    color: var(--orange);
}

.beige {
    color: var(--beige);
}

.purple {
    color: var(--purple);
}

.merlot {
    color: var(--merlot);
}

.blue {
    color: var(--blue);
}

.mediumblue {
    color: var(--mediumblue);
}

.brown {
    color: var(--brown);
}

.green {
    color: var(--green);
}

.maroon {
    color: var(--maroon);
}


/* ========================================
   TYPOGRAPHY
   ======================================== */

h2, .h2 {
    line-height: 74px;
    font-size: 64px;
    text-transform: none;
    text-align: center !important;
    color: var(--green);
    font-family: "fave-script-pro", sans-serif;
    font-weight: normal;
    letter-spacing: 0px;
    font-style: normal;
    text-align: left;
    padding: 10px 0px;
    width: 100%;
    margin-bottom: 0 !important;
}

h4 {
    color: var(--blue);
    line-height: 44px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-style: normal;
}

h5 {
    font-family: "Dancing Script", cursive;
    text-align: center !important;
}

    h5 a {
        color: var(--blue);
    }

        h5 a:hover {
            color: var(--green);
        }

p {
    font-family: "EB Garamond", serif;
    font-weight: 300;
    font-style: normal;
    font-size: 20px;
    margin-bottom: 30px;
    color: #333;
}

    p span {
        font-weight: normal;
        color: #094268;
    }

blockquote {
    font-family: "EB Garamond", serif;
    font-size: 24px;
    line-height: 4rem;
    font-weight: 300;
    color: var(--dark-grey);
    background-color: #eee;
    margin-left: 0px;
    margin-right: 0px;
    border-left: 0;
    border-radius: 1px !important;
    padding: 3rem;
}

    blockquote:before {
        font-family: "fontello";
        font-weight: 400;
        color: var(--white);
        margin-right: 0.25em;
    }


/* ========================================
   LINKS
   ======================================== */

a {
    color: var(--blue);
}

    a:hover {
        color: #30434d;
    }


/* ========================================
   UTILITY CLASSES
   ======================================== */

.bold {
    font-weight: bold;
}

.center {
    margin: 0 auto;
    text-align: center;
}

.section-padding {
    padding: 42px 0;
}

.caption {
    margin-top: 6px;
    margin-left: 10px;
    font-size: 12px;
    width: auto;
    line-height: normal;
}

.feature-wrapper {
    padding: 0 30px;
}


/* ========================================
   HEADER COMPONENTS
   ======================================== */

#header-text {
    width: 100%;
    padding: 40px 0px !important;
}

    #header-text h1 {
        font-family: "fave-script-pro", sans-serif;
        font-weight: normal;
        font-style: normal;
        font-size: 144px;
        line-height: 154px;
        text-transform: none;
        text-shadow: 0px 1px 5px rgba(0, 0, 0, .3);
        opacity: 1 !important;
    }

    #header-text p {
        margin-top: 15px;
        color: #fff;
        opacity: 1 !important;
        font-family: "EB Garamond", serif;
        font-weight: 300;
        font-style: normal;
        font-size: 20px;
        margin-bottom: 20px;
        text-shadow: 0px 1px 5px rgba(0, 0, 0, 0.3);
    }

        #header-text p a {
            color: white;
            text-decoration: underline;
        }


.special-tacking
{
    letter-spacing: 0px !important;
}

#header-logo {
    margin-top: 40px;
    width: 245px;
}

#narrative-header {
    text-align: center;
}

    #narrative-header .cat {
        padding-right: 5px;
    }

@media (max-width: 768px) {


    .mobile-margin {
        margin-top: 40px;
    }
}

    /* ========================================
   NAVIGATION
   ======================================== */
    #nav-bar {
        background-color: var(--white);
        padding: 20px 20px !important;
    }

        #nav-bar #img-logo img {
            width: 190px;
        }

    #logo-wrapper {
        text-align: center;
        float: none;
    }


    /* ========================================
   CONTENT SECTIONS
   ======================================== */

    .wine {
        font-size: 30px;
        position: relative;
        z-index: 2;
        margin-left: -7px;
    }

    .slide-title-inner-wrapper {
        width: 100% !important;
    }

    .transbox {
        background-repeat: repeat;
        margin-top: 0px !important;
        background-position: 0%;
        background-size: cover;
        width: 100% !important;
        height: 100% !important;
        padding: 60px 40px !important;
        bottom: 0 !important;
        position: absolute;
        left: 0%;
        opacity: 0.22;
        margin-top: 3%;
        border-radius: 4px;
        line-height: normal;
    }

    .image-wrapper {
        margin: 20px 0px;
    }

    .day-night {
        float: left;
        margin-right: 20px;
    }

    .icon-and-title {
        margin-left: 0;
        margin-bottom: 0px !important;
    }

    .the-feature {
        text-align: center;
    }

    .abstract {
        font-family: "fave-script-pro", sans-serif;
        font-weight: 300;
        font-style: normal;
        font-size: 18px;
        line-height: 40px;
        margin-bottom: 30px;
        color: var(--dark-grey);
        text-align: center;
        font-weight: 300;
        border-top: var(--gold) 3px solid;
        border-bottom: var(--gold) 3px solid;
        background-color: var(--gold);
        padding: 18px 60px;
    }

        .abstract h2, .abstract p {
            color: var(--dark-grey);
        }

        .abstract a, .blue-abstract a {
            color: var(--dark-grey);
            text-decoration: underline;
        }

            .abstract a:hover, .blue-abstract a:hover {
                color: var(--dark-grey);
                text-decoration: none;
            }

    .blue-abstract {
        font-family: "fave-script-pro", sans-serif;
        font-weight: 300;
        font-style: normal;
        font-size: 18px;
        line-height: 44px;
        color: var(--white);
        font-weight: 300;
        background: #49B9D4;
        padding: 18px 28px;
    }

        .blue-abstract h3 {
            font-family: "fave-script-pro", sans-serif;
            font-weight: 700;
            font-style: normal;
            color: #fff;
            background: none;
            margin-bottom: 10px;
            margin-bottom: 10px;
        }

        .blue-abstract ul {
            font-size: 18px;
        }

    .bold400 a, .bold400 {
        font-family: "fave-script-pro", sans-serif;
        color: var(--green);
        font-size: 34px;
        letter-spacing: 0px;
        text-align: center !important;
    }

    hr {
        padding: 10px 0px;
        border-top: #d9e4ca solid 6px !important;
    }

    .the-feature {
        font-size: 20px;
    }
    /* ========================================
   IMAGES & GALLERY
   ======================================== */
    .photo-item:hover img.hover-animation.image-zoom-in {
        -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
        -o-transform: scale(1.05);
        transform: scale(1) !important;
    }

    .photo-item .layer.hidden-blue-overlay,
    .photo-item .hidden-blue-overlay {
        background-color: none !important;
        display: none;
    }

    .photo-item img {
        /*  clip-path: circle() !important;*/
        width: 100%;
    }

    .photo-item .layer.hidden-blue-overlay {
        background-color: rgba(0,69,124, 0.4);
    }

    .image-divider .divider-overlay, .video-divider .divider-overlay {
        opacity: 0.1;
    }

    .de-button {
        background-color: var(--blue) !important;
    }

        .de-button:hover {
            border-color: var(--white) !important;
        }

    .mfp-bg {
        background-color: var(--blue) !important;
        opacity: 0.98 !important;
    }


    /* ========================================
   BUTTONS & FORMS
   ======================================== */

    a.de-button,
    span.de-button,
    input[type=submit] {
        background-color: var(--blue) !important;
        line-height: 26px;
        width: 80%;
        border: 0 !important;
        font-family: 'Open Sans', sans-serif;
        font-weight: 400;
        font-style: normal;
        padding: 10px !important;
    }


    /* ========================================
   CAROUSEL/OWL
   ======================================== */

    .owl-theme .owl-controls .owl-page.active span,
    .owl-theme .owl-controls.clickable .owl-page:hover span {
        background: #49b9d4 !important;
    }

    .item p {
        margin-bottom: 0px;
    }


    /* ========================================
   FOOTER
   ======================================== */

    .top-footer {
        background-size: cover;
        width: 100%;
        margin-bottom: 00px;
    }

    footer .alignment {
        background-color: var(--gold);
    }

        footer .alignment address p {
            text-align: center;
            font-size: 1.75rem;
            line-height: 2rem;
            margin-bottom: 2px;
        }

    footer div[class^="col-md-"] {
        margin-bottom: 10px;
        margin-top: 0px;
    }

    footer .alignment .social li a i {
        color: var(--white);
        font-size: 4.5rem;
    }

        footer .alignment .social li a i:before {
            margin-right: 0;
        }

    footer .alignment .social > li {
        padding-right: 0;
    }

    footer p {
        margin-top: 60px;
        color: #fff;
        text-align: left;
    }

        footer p a {
            color: var(--merlot);
        }

            footer p a:hover {
                color: #fff;
            }

    .footer-link {
        clear: both !important;
        color: var(--white);
        font-size: 16px;
        margin-bottom: 10px;
        width: 100%;
        display: block;
    }


    /* ========================================
   MEDIA QUERIES
   ======================================== */

    @media screen and (min-width: 768px) {
        #nav-bar {
            text-align: initial;
            padding: 15px 60px;
            background-color: var(--white);
            border-top: 6px solid #b6a6ad;
        }

        #narrative-header {
            text-align: initial;
        }

            #narrative-header .cat {
                margin-right: 6px;
            }

        footer .alignment img {
            margin-top: 20px;
        }

        footer .alignment {
            background-color: var(--gold);
            height: 35%;
            padding: 40px 0px;
        }

            footer .alignment address p {
                text-align: right;
            }

            footer .alignment .social li a i {
                color: var(--maroon);
                font-size: 2.3rem;
            }

            footer .alignment .social {
                text-align: right;
            }

                footer .alignment .social li:not(:last-child) {
                    padding-right: 1.0em;
                }

        footer div[class^="col-md-"] {
            margin-bottom: inherit;
        }
    }

    @media screen and (max-width: 767px) {
        footer .alignment {
            height: auto;
            padding: 20px 0 20px 0;
        }

        .top-footer {
            background-size: cover;
            width: 100%;
            margin-bottom: -30px;
        }

        #header-text p {
            font-size: 18px;
        }

        .slide-image {
            background-position: 55% center !important;
        }

        #header-text {
            margin-top: 1%;
        }

            #header-text h1 {
                font-size: 76px;
            }

        #slide-arrow {
            display: none;
        }
    }