/* =============  Common  =============*/
html {
    scroll-behavior: smooth;
}

html,
body {
    /* background-color: rgba(251, 251, 251, 1); */
    background-color: rgba(253, 250, 250, .8);
    height: 100%;
    margin: 0;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "wdth" 100;
}


/* =============  Font Family   =============*/
.roboto-400 {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "wdth" 100;
}

.tagesschrift-regular {
    font-family: "Tagesschrift", system-ui;
    font-weight: 400;
    font-style: normal;
}

.cormorant-garamond-400 {
    font-family: "Cormorant Garamond", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: italic;
}

.playfair-display-400 {
    font-family: "Playfair Display", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}


/* =============  Forms   =============*/


/* =============  Social Media Coloring   =============*/
.color-facebook {
    color: rgb(24, 119, 242);
}

.bg-color-facebook {
    background-color: rgb(24, 119, 242) !important;
}

.color-twitter {
    color: rgb(29, 161, 242);
}

.bg-color-twitter {
    background-color: rgb(29, 161, 242) !important;
}

.color-instagram {
    color: rgb(221, 42, 123);
}

.bg-color-instagram {
    background-color: rgb(221, 42, 123) !important;
}

.color-linkedin {
    color: rgb(0, 119, 181);
}

.bg-color-linkedin {
    background-color: rgb(0, 119, 181) !important;
}

.color-youtube {
    color: rgb(255, 0, 0);
}

.bg-color-youtube {
    background-color: rgb(255, 0, 0) !important;
}

.color-whatsapp {
    color: rgb(37, 211, 102);
}

.bg-color-whatsapp {
    background-color: rgb(37, 211, 102) !important;
}



/* =============  Heights   =============*/
.h-50px {
    height: 50px;
}

.h-75px {
    height: 75px;
}


.h-100px {
    height: 100px;
}

.h-150px {
    height: 150px;
}

.h-175px {
    height: 175px;
}

.h-200px {
    height: 200px;
}

.h-250px {
    height: 250px;
}

.h-275px {
    height: 275px;
}

.h-300px {
    height: 300px;
}

.h-350px {
    height: 350px;
}

.h-375px {
    height: 375px;
}

.h-400px {
    height: 400px;
}

.h-425px {
    height: 425px;
}

.h-450px {
    height: 450px;
}

.h-475px {
    height: 475px;
}

.h-500px {
    height: 500px;
}

.h-550px {
    height: 550px;
}

.h-575px {
    height: 575px;
}

.h-600px {
    height: 600px;
}

.h-650px {
    height: 600px;
}

.h-700px {
    height: 700px;
}

.h-750px {
    height: 750px;
}

.h-800px {
    height: 800px;
}

.h-850px {
    height: 850px;
}

.h-900px {
    height: 900px;
}

.height-6 {
    height: 6rem;
}

.height-7 {
    height: 7rem;
}

.height-8 {
    height: 8rem;
}

.height-9 {
    height: 9rem;
}

.height-10 {
    height: 10rem;
}


/* =============  Backgrounds   =============*/

.bg-color-1 {
    background-color: rgba(243, 240, 235, 0.8);
}

.bg-color-2 {
    background-color: rgba(151, 43, 52, 1);

    /* $black: rgba(0, 0, 0, 1);
$black-2: rgba(0, 0, 0, 1);
$red: rgba(255, 0, 0, 1);
$auburn: rgba(151, 43, 52, 1);
$black-3: rgba(0, 0, 0, 1); */
}


/* =============  Font Sizes   =============*/

.fs-1-5 {
    font-size: 1.5em;
}

.fs-10 {
    font-size: 0.625em;
}

.fs-11 {
    font-size: 0.6875em;
}

.fs-12 {
    font-size: 0.75em;
}

.fs-13 {
    font-size: 0.8125em;
}

.fs-14 {
    font-size: 0.875em;
}

.fs-15 {
    font-size: 0.9375em;
}

.fs-16 {
    font-size: 1em;
}

.fs-17 {
    font-size: 1.0625em;
}

.fs-18 {
    font-size: 1.125em;
}

.fs-19 {
    font-size: 1.1875em;
}

.fs-20 {
    font-size: 1.25em;
}

.fs-21 {

    font-size: 1.31em;
}

.fs-22 {
    font-size: 1.37em;
}

.fs-23 {
    font-size: 1.43em;
}

.fs-24 {
    font-size: 1.5em;
}

.fs-25 {
    font-size: 1.5625em;
}

.fs-30 {
    font-size: 1.875em;
}


.fs-40 {
    font-size: 2.5em;
}

.fs-42 {
    font-size: 2.6em;
}

.fs-45 {
    font-size: 2.812em;
}

.fs-46 {
    font-size: 2.875em;
}




/* =============  Parallax  =============*/

/* .parallax {
    background-size: cover;
    height: 100vh;
    position: relative;
} */


/* =============  Paddings  =============*/
.pad-spacing-1 {
    padding-top: 100px;
    padding-bottom: 100px;
}

.pad-spacing-2 {
    padding-top: 100px;
    padding-bottom: 0px;
}

.pad-spacing-3 {
    padding-top: 0px;
    padding-bottom: 100px;
}

.pad-spacing-4 {
    padding: 100px 10px 20px;
}

.pad-spacing-5 {
    padding: 150px 0 10px;
}

.pb-6 {
    padding-bottom: 4rem !important;
}

.pb-7 {
    padding-bottom: 4.5rem !important;
}

.pb-8 {
    padding-bottom: 5rem !important;
}

.pb-9 {
    padding-bottom: 5.5rem !important;
}

.pb-10 {
    padding-bottom: 6rem !important;
}

/* =============  Modals  =============*/
.modal {
    z-index: 2001;
    /*1055*/
}

.swal2-container {
    z-index: 2005 !important;
    /*1060*/
}

/* =============  Navigation  =============*/
#mainNavBar {
    z-index: 2000;
}

.navbar .nav-link {
    color: #fff;
}

.navbar #mainNavBarCollapse ul .active {
    color: rgb(202, 192, 193);
}



/* =============  Home =============*/

#intro {
    background-image: url("../images/background-large.jpeg");
    height: 100vh;
}


/* =============  Audit form =============*/

#page-banners {
    background-image: url("../images/background-large.jpeg");
    height: 35vh;
}






/* =============  Footer   =============*/


/* =============  Media Queries  =============*/


/************
1121px
************/
@media (min-width: 1121px) {}

/************
 991px
************/
@media (min-width: 992px) {
    /* #mainNavBar {
    padding-top: .8rem;
    padding-bottom: .8rem;
    transition: padding-top 0.3s ease-in-out, padding-bottom 0.3s ease-in-out;
} */

    .navbar-scrolled {
        /* padding-top: 1.5rem;
    padding-bottom: 1.5rem; */
        background-color: rgba(0, 0, 0, 1)
            /* rgba(151, 43, 52, 1) rgba(58, 9, 9, 0.95)*/
        ;
        transition: background-color 0.3s ease;
    }
}

@media (max-width: 991px) {
    #mainNavBarCollapse {
        background-color: #000;
        padding-left: .5rem;
    }

    .smb-md-4 {
        margin-bottom: 1.5rem;
    }

    .smb-md-5 {
        margin-bottom: 3rem;
    }

    .smb-md-3 {
        margin-bottom: 1rem;
    }

    .smb-md-2 {
        margin-bottom: .5rem;
    }

    .smb-md-1 {
        margin-bottom: .25rem;
    }
}


/************
 768px
************/
@media (max-width: 768px) {}


/************
 576px
************/
@media (max-width: 576px) {}