/*
Theme Name: TheBaconHouse
Theme URI: http://TheBaconHouse
Author: ****
Description: This is a custom theme built specifically for the TheBaconHouse website.
Version: 1.0
License: GNU General Public License
License URI: license.txt
*/


@font-face {
    font-family: "MyriadPro";
    src: url('font/MyriadPro-Regular.otf');
    font-weight: 400;
}

@font-face {
    font-family: "Segoe UI";
    src: url('font/Segoe UI SL.ttf');
    font-weight: 300;
}

@font-face {
    font-family: "Segoe UI";
    src: url('font/Segoe UI SB.ttf');
    font-weight: 600;
}

@font-face {
    font-family: "Segoe UI";
    src: url('font/Segoe UI Bold.ttf'), url('font/Segoe UI Bold.woff');
    font-weight: 700;
}


@font-face {
    font-family: "Ubuntu";
    src: url('font/Ubuntu-Light.ttf');
    font-weight: 300;
}


@font-face {
    font-family: "Ubuntu";
    src: url('font/Ubuntu-Medium.ttf');
    font-weight: 500;
}


body {
    background-color: #0E0E0E;
    color: white;
    letter-spacing: 2px;
    font-family: Segoe UI, "sans-serif";
}
body.menu-open {
    overflow: hidden;
}


h2 {
    letter-spacing: 0;
    line-height: 1.6;
}

h3 {
    font-weight: 600;
}

h4 {
    font-weight: 600;
    line-height: 1.4;
}
h5 {
    font-weight: 600;
    line-height: 1.8;
}


p {
    line-height: 2;
    font-weight: 600;
}

.op-38 {
    opacity: 0.38;
}

.op-60 {
    opacity: 0.6;
}

.op-80 {
    opacity: 0.8;
}

.op-87 {
    opacity: 0.87;
}

.lineH-normal {
    line-height: 1.4;
}

.lineH-1-5 {
    line-height: 1.5;
}

header h1 {
    font-weight: 300;
    letter-spacing: 7px;
    font-family: "Ubuntu", sans-serif;

}

header p {
    font-size: 20px;
    letter-spacing: 13px;
    font-family: "Ubuntu", sans-serif;
    font-weight: 300;
    text-indent: 13px;
}


nav {
    background-color: #0A5EA7;
    padding: 2px 10px;
}

nav ul {
    max-width: 1300px;
    width: 100%;
    display: flex;
    overflow-y: auto;
    overflow-x: visible;
    mask-image: -webkit-linear-gradient(to right, transparent, black 20px, black 90%, transparent);
    mask-image: -moz-linear-gradient(to right, transparent, black 20px, black 90%, transparent);
    mask-image: linear-gradient(to right, transparent, black 20px, black 90%, transparent);
    -webkit-mask-image: -webkit-linear-gradient(to right, transparent, black 20px, black 90%, transparent);
    -webkit-mask-image: -moz-linear-gradient(to right, transparent, black 15px, black 98%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 15px, black 98%, transparent);
    -ms-overflow-style: none;
    flex-wrap: nowrap !important;
}

nav ul li {
    min-width: max-content;
}

nav ul::-webkit-scrollbar {
    display: none;
}

nav ul {
    -ms-overflow-style: none;
    scrollbar-width: none;
}


nav a, nav a:hover {
    text-decoration: none;
    color: #ffffff;
    font-family: "Segoe UI", sans-serif;
    font-weight: 300;
}
/*changed nav-link to li a*/
nav ul li a{
    display: block;
    padding: 0.5rem 1rem;
	text-transform:uppercase;
}


nav .blur  a{
    opacity: 0.38;
}

nav .highlight  a {
    opacity: 1;
    color: #fff;
    font-weight: bold;
}

nav .current_page_item a{font-weight:bold;}

button.nav-link {
    background-color: transparent;
    color: #ffffff;
    font-family: "Segoe UI", sans-serif;
    font-weight: 300;
}

hr {
    border-top: 1px dotted #aaaaaa;
}

.btn-blue {
    display: inline-block;
    background-color: #0A5EA7;
    color: white;
    padding: 12px 30px;
    border-radius: 0;
    font-family: Ubuntu, "sans-serif";
    font-size: 16px;
    letter-spacing: 3px;
    font-weight: 300;
}

.btn-blue:hover {
    background-color: #0073BC;
    transition: background-color 0.3s;
}

header .btn-blue {
    position: absolute;
    top: 50%;
    right: 2rem;
    transform: translateY(-50%);
}

.btn-trans {
    display: block;
    border: 1px solid #ffffff;
    padding: 15px 60px;
    border-radius: 0;
    color: white;
    font-family: Ubuntu, "sans-serif";
    letter-spacing: 5px;
    font-weight: 300;
}

.btn:hover {
    color:white;
}

.section-bg-blue {
    background-color: rgba(0,77,152,0.75);
}

.section-border-blue {
    border-top:4px solid #004D98 ;
    border-bottom:4px solid #004D98 ;
}

.banner {
    border-bottom:10px solid rgba(0,77,152,1) ;
    min-height: 300px;
}

.banner img {
    width: 100%;
    height: 100%;
    min-height: 300px;
    object-fit: cover;
}

/****** home ******/

.section-1-home {
    font-size: 20px;
}

.font-weight-semi-bold {
    font-weight: 600;
}

.font-weight-semi-light {
    font-family: "Segoe UI", sans-serif;
    font-weight: 300;
}

.text-highlight {
    color: #488ABB;
    text-decoration: underline;
}


/* section-3 */

.section-3-content {
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    left: 0;
    width: 100%;
}

/* footer */

footer span {
    font-family: Ubuntu, "sans-serif";
    letter-spacing: 2px;
    font-weight: 300;
}



/****** Livability ******/

.img-border-blue {
    border: 10px solid rgba(0,77,152,1);
}

/****** Collectors Gallery ******/

.CG-section-2 ul {
    padding-left: 17px;
}

.CG-section-2 li {
    font-weight: 600;
}

/****** Technology ******/

.banner-content {
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    left: 0;
    width: 100%;
}

/****** Portfolio ******/

.banner-pic {
    width: 45%;
}

.img-border-gray {
    border: 5px solid #2E2D2E;
}

/****** designer ******/

.banner-content-1 {
    top: 70%;
    transform: translateY(-50%);
    right: 0;
    left: 0;
    width: 100%;
}


.contact-modal .modal-content {
    border: 10px solid rgba(0,77,152,1);
    border-radius: 0;
    color: #030504;
}

.contact-modal .modal-header {
    border: 0;
    border-radius: 0;
}

.contact-form {
    width: 100%;
    max-width: 350px;
    margin: 0 auto;
}

@media (max-width: 991px) {
    nav ul {
        max-width: 1300px;
        width: 100%;
        display: flex;
        overflow-y: auto;
        overflow-x: visible;
        mask-image: -webkit-linear-gradient(to right, transparent, black 20px, black 90%, transparent);
        mask-image: -moz-linear-gradient(to right, transparent, black 20px, black 90%, transparent);
        mask-image: linear-gradient(to right, transparent, black 20px, black 90%, transparent);
        -webkit-mask-image: -webkit-linear-gradient(to right, transparent, black 20px, black 90%, transparent);
        -webkit-mask-image: -moz-linear-gradient(to right, transparent, black 20px, black 90%, transparent);
        -webkit-mask-image: linear-gradient(to right, transparent, black 20px, black 90%, transparent);
        -ms-overflow-style: none;
        flex-wrap: nowrap !important;
    }

    .section-3 {
        min-height: 400px;
    }
}

@media (max-width: 767px) {
    body, .section-1-home {
        font-size: 16px !important;
    }

    header h1 {
        font-weight: 300;
        letter-spacing: 6px;
        font-size: 1.6rem;
    }

    header p {
        font-size: 12px;
        letter-spacing: 11px;
        font-family: "Segoe UI", sans-serif;
        text-indent: 11px;
    }

    h1, h2 {
        font-size: 1.6rem;
    }

    .btn-blue {
        background-color: #0A5EA7;
        color: white;
        padding: 12px 30px;
        border-radius: 0;
        font-size: 16px;
        letter-spacing: 2px;
    }

    .section-3 {
        min-height: 600px;
    }

    .head-bar {
        display: flex;
        justify-content: center;
    }

    .head-bar h1 {
        text-align: center;
        font-size: 1.4em;
    }

    .menu-toggler {
        display: block !important;
        width: 30px;
        height: 30px;
    }

    .menu-open-btn {
        position: absolute;
        right: 15px;
    }

    .menu-close-btn {
        padding: 5px;
        margin-left: auto;
    }

    nav.active ~ .overlay {
        background-color: rgba(0,0,0,0.7);
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        overflow: hidden;
        z-index: 999;
        transition: 0.2s;
    }
    nav {
        max-width: 400px;
        height: calc(100vh - 100px);
        position: absolute;
        top: 100px;
        left: -400px;
        z-index: 10000;
        transition: 0.2s left ease-in;
    }
    nav.active {
        left: 0;
        transition: 0.2s left ease-out;
    }
    .nav {
        display: block !important;
    }
    .nav-link {
        padding: 1em 1em;
    }
}

@media (max-width: 375px) {
    .head-bar h1 {
        font-size: 1em;
    }

    .menu-open-btn {
        width: 25px;
        height: 25px;
    }
}

/*NINJA form in popup*/
#popmake-478 h4{margin-top: 2rem;margin-bottom: 3rem !important;font-weight: 600;
    line-height: 1.4;font-size: 1.5rem;}
#popmake-478 .nf-form-content .list-select-wrap .nf-field-element>div, #popmake-478 .nf-form-content input:not([type=button]), #popmake-478 .nf-form-content textarea {
    background: #fff;border: 1px solid #ced4da;padding: 0.375rem 0.75rem;border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;}
	
#popmake-478 .nf-form-content button, #popmake-478 .nf-form-content input[type="button"], #popmake-478 .nf-form-content input[type="submit"]{ background-color: #0A5EA7;
padding: 12px 30px;
    border-radius: 0;
    font-family: Ubuntu, "sans-serif";
    font-size: 16px;
    letter-spacing: 3px;
    font-weight: 300;}
	
#popmake-478 .submit-wrap{text-align:center;}

#popmake-478 .nf-form-content input[type="button"]:hover {
    background-color: #0073BC;
    transition: background-color 0.3s; color:#FFF;}