html {
    scrollbar-color: rgb(212 23 16 / 95%) #191919cf !important;
    scrollbar-width: thin !important;
    background: linear-gradient(320deg, #272629, #5c5a5b, #1d1720) !important;
}

body {
    padding-top: 50px;
    padding-bottom: 20px;
    padding-left: 0px;
    padding-right: 0px;
    /*background: linear-gradient(320deg, #252323, #777685, #262326) !important;*/
    background: linear-gradient(320deg, #272629, #5c5a5b, #1d1720) !important;
    /*background: #51C3EE !important;*/
    overflow-x: hidden !important;
    scrollbar-color: rgb(212 23 16 / 95%) #191919cf !important;
    scrollbar-width: thin !important;
}

/* custom fonts */
@font-face {
    font-family: 'eurof55-webfont';
    src: url('https://www.thingswecre8.com/fonts/eurof55-webfont.eot');
    src: local('☺'), url('https://www.thingswecre8.com/fonts/eurof55-webfont.woff') format('woff'), url('https://www.thingswecre8.com/fonts/eurof55-webfont.ttf') format('truetype'), url('https://www.thingswecre8.com/fonts/eurof55-webfont.svg#webfont8xigBfG2') format('svg');
}

@font-face {
    font-family: 'eurof35-webfont';
    src: url('https://www.lawdshouse.com/fonts/eurof35-webfont.eot');
    src: local('☺'), url('https://www.thingswecre8.com/fonts/eurof35-webfont.woff') format('woff'), url('https://www.thingswecre8.com/fonts/eurof35-webfont.ttf') format('truetype'), url('https://www.thingswecre8.com/fonts/eurof35-webfont.svg#webfont8xigBfG2') format('svg');
}

@font-face {
    font-family: 'graublauweb-webfont';
    src: url('https://www.lawdshouse.com/fonts/graublauweb-webfont.eot');
    src: local('☺'), url('https://www.thingswecre8.com/fonts/graublauweb-webfont.woff') format('woff'), url('https://www.thingswecre8.com/fonts/graublauweb-webfont.ttf') format('truetype'), url('https://www.thingswecre8.com/fonts/graublauweb-webfont.svg#webfont8xigBfG2') format('svg');
}

/*@font-face {
    font-family: 'DigitalFirebomb';
    src: url('https://www.lawdshouse.com/fonts/DigitalFirebomb.eot');
    src: local('☺'), url('https://www.thingswecre8.com/fonts/DigitalFirebomb.woff') format('woff'), url('https://www.thingswecre8.com/fonts/DigitalFirebomb.ttf') format('truetype'), url('https://www.thingswecre8.com/fonts/DigitalFirebomb.svg#webfont8xigBfG2') format('svg');
}*/

/* Set padding to keep content from hitting the edges */
.body-content {
    /*    padding-left: 15px;
    padding-right: 15px;*/
}

main {
    background:transparent!important;
    /*background: linear-gradient(320deg, #272629, #5c5a5b, #1d1720) !important;*/
    /*background: linear-gradient(320deg, #7a7877, #5c5a5b, #3e3e3e) !important;*/
    /*background: linear-gradient(320deg, #252323, #777685, #262326) !important;*/
}

.homepage-div-col-6 {
    min-height: 300px;
    height: 100%;
    display: flex;
    align-items: center;
}

.navbar {
    background: rgb(223 225 238 / 19%) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1)!important;
    backdrop-filter: blur(15.3px)!important;
    -webkit-backdrop-filter: blur(15.3px)!important;
    border: 1px solid rgba(255, 255, 255, 0.3)!important;
    position:sticky!important;
    padding-top:10px!important;
}

.navbar-nav .dropdown-menu {
    background: rgba(10, 10, 10, 0.88);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
    border: 1px solid white !important;
}

    .navbar-nav .dropdown-menu > li > a {
        color: white !important;
    }

    .navbar-nav .dropdown-menu > li > a:hover {
        color: black !important;
    }



.text-white {
    color: white !important;
}

.ipx-glass-light {
    background: rgb(255 255 255 / 22%);
    border-radius: 3px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.13);
    backdrop-filter: blur(40.3px);
    -webkit-backdrop-filter: blur(40px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.ipx-glass-light-nb {
    background: rgb(255 255 255 / 22%);
    border-top-left-radius: 3px !important;
    border-top-right-radius: 3px !important;
    border-bottom: 1px solid white !important;
    /*  backdrop-filter: blur(40.3px);
  -webkit-backdrop-filter: blur(40px);
*/
}

.ipx-glass-light-nb-2 {
    background: rgb(255 255 255 / 8%);
    border-top-left-radius: 3px !important;
    border-top-right-radius: 3px !important;
    border-bottom: 1px solid white !important;
    /*  backdrop-filter: blur(40.3px);
  -webkit-backdrop-filter: blur(40px);
*/
}

.ipx-glass-light-2 {
    /*background: rgb(40 11 11 / 67%) !important;*/
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.13) !important;
    backdrop-filter: blur(40.3px) !important;
    -webkit-backdrop-filter: blur(40px) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

.ipx-glass {
    background: rgba(255, 255, 255, 0.2);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(7.3px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}



.ipx-glass-dark {
    background: rgba(127, 118, 118, 0.2);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.ipx-glass-frost {
    background: rgb(238 223 223 / 57%);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
    /*border: 1px solid rgba(255, 255, 255, 0.3);*/
}

.ipx-glass-frost-2 {
    background: rgb(223 225 238 / 19%) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
}

.ipx-glass-frost-3 {
    background: rgb(186 204 211 / 15%) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    border-color: white !important;
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
}

.ipx-glass-frost-4 {
    background: rgb(204 211 214 / 87%) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    border-color: white !important;
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
}


.ipx-glass-dark-2 {
    background: rgb(95 125 137 / 61%);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.ipx-glass-dark-5 {
    background: rgb(95 125 137 / 45%);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.ipx-glass-dark-3 {
    background: rgb(32 37 54 / 57%);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
    border: 1px solid rgba(0, 0, 0, 0.8);
}

.ipx-glass-dark-4 {
    background: rgb(102 122 185 / 47%);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
    border: 1px solid rgba(0, 0, 0, 0.8);
}

.ipx-glass-dark-6 {
    background: rgb(53 63 84 / 76%) !important;
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(15.3px);
    -webkit-backdrop-filter: blur(15.3px);
    border: 1px solid rgba(0, 0, 0, 0.8);
}


.ipx-btn-glass {
    background: rgb(255 255 255 / 8%);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.13);
    backdrop-filter: blur(7.3px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-color: #fff !important;
    color: #000;
    font-weight: 600;
    /*  border: none;
*/ cursor: pointer;
    font-size: 16px;
    transition: 0.3s ease;
}

.ipx-btn-glass-3 {
    background: rgb(255 255 255 / 18%) !important;
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.13);
    backdrop-filter: blur(7.3px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.8)!important;
    border-color: #fff !important;
    color: #000;
    font-weight: 600 !important;
    /*  border: none;
*/ cursor: pointer;
    font-size: 16px;
    transition: 0.3s ease;
}

.ipx-btn-glass-4 {
    background: rgb(255 255 255 / 38%) !important;
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.13);
    backdrop-filter: blur(7.3px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-color: #fff !important;
    color: #000;
    font-weight: 600 !important;
    /*  border: none;
*/ cursor: pointer;
    font-size: 16px;
    transition: 0.3s ease;
}

.btn.ipx-btn-glass:hover {
    color: #fff;
    border-color: #fff;
    background: rgba(255, 255, 255, 0.15);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
}

.btn.ipx-btn-glass-3:hover {
    color: #fff;
    border-color: #fff;
    background: rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25) !important;
}



.ipx-btn-glass-2 {
    background: rgb(255 255 255 / 22%);
    /*border-radius: 16px;*/
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.13);
    backdrop-filter: blur(7.3px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-color: #fff !important;
    color: #000;
    font-weight: 600;
    /*  border: none;
*/ cursor: pointer;
    font-size: 16px;
    transition: 0.3s ease;
}

.btn.ipx-btn-glass-2:hover {
    color: #fff;
    border-color: #fff;
    background: rgba(255, 255, 255, 0.38);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
}



@media (max-width: 767px) {
    .homepage-div-col-6 {
        min-height: 300px;
        height: 100%;
        display: flex;
        align-items: flex-start;
        align-content: flex-end;
        flex-direction: column;
        background-color: transparent!important;
        /*background-color: #d37838!important;*/
    }


    .navbar-nav .dropdown-menu {
        margin-top: 36px !important;
        background: rgba(255, 255, 255, 0.18);
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
        border: 1px solid white !important;
    }
    .navbar-nav .dropdown-menu>li>a {
        color: white!important;

    }
}

.homepage-div-col-6-li {
    font-size: 7vw;
    margin-left: 9vw;
    margin-right: 3vw;
    /*margin-bottom: 30px!important;*/
    font-style: italic;
}

.homepage-div-col-6-li-title {
    font-size: 4vw;
    vertical-align: top !important;
    font-style: normal!important;
}

.homepage-div-col-6-li-desc {
    font-family: inherit;
    margin-top: -4.5vw !important;
    font-size: 2vw;
    vertical-align: top !important;
    font-style: normal !important;
}

@media (max-width: 767px) {

    .homepage-div-col-6-li {
        font-size: 8vw;
        margin-left: 4vw;
        margin-right: 1vw;
        margin-bottom: 20px !important;
    }

    .homepage-div-col-6-li-title {
        font-size: 5vw;
        vertical-align: top !important;
    }

    .homepage-div-col-6-li-desc {
        font: inherit;
        margin-top: -20px !important;
        font-size: 4vw;
        vertical-align: top !important;
    }
}

    .homepage-header-video {
        object-fit: contain !important;
        width: 100% !important;
        opacity:0.85!important;
    }

    @media (max-width: 767px) {
        .homepage-header-video {
            /*        padding-right: 5%;
        padding-left: 5%;*/
            object-fit: cover !important;
            height: 60vh !important;
        }
    }

    .box {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 0px;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0.7;
    }

.box-top {
    display: flex;
    align-items:self-start;
    justify-content: center;
    margin-left: 0px;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.7;
}

.box-top-text {
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol'; 
    font-size: 2vw; 
    text-align: center; 
    color: white;
    margin-left:-4vw;
    font-weight:500;
}

.box-top-text-foot {
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
    font-size: 1.5vw;
    text-align: center;
    color: white;
    font-weight: 300;
    display: block;
    margin-top:-20px;
}

@media (max-width: 767px) {
    .box-top-text {
        font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
        font-size: 4.5vw;
        text-align: center;
        color: white;
        margin-left: -3vw;
        font-weight: 500;
    }
    .box-top-text-foot {
        font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
        font-size: 3.30vw;
        text-align: center;
        color: white;
        font-weight: 300;
        display: block;
        margin-top:-8px;
    }
}

    .box-bottom {
        display: flex;
        align-items: end;
        justify-content: center;
        padding-bottom: 30px;
        margin-left: 0px;
        width: 100%;
        height: 100%;
        position: absolute;
        bottom: 0;
        left: 0;
        opacity: 1;
    }

        .box-bottom button {
            width: 260px;
        }

    @media (max-width: 767px) {
        .box-bottom {
            display: flex;
            align-items: end;
            justify-content: center;
            padding-bottom: 15px;
            margin-left: 0px;
            width: 100%;
            height: 100%;
            position: absolute;
            bottom: 0;
            left: 0;
            opacity: 1;
        }

            .box-bottom button {
                width: 260px;
            }
    }

.SSDRedHeader02 {
    background: url('https://www.thingswecre8.com/content/images/SSDRedHeader02.jpg') no-repeat center center; 
    height: 170px; 
    margin-bottom: 0px; 
    margin-top: 0px; 
    background-size: 100%;
    background-color:transparent!important;
}

@media (max-width: 767px) {
    .SSDRedHeader02 {
        background: url('https://www.thingswecre8.com/content/images/SSDRedHeader02.jpg') no-repeat center center;
        height: 170px;
        margin-bottom: -30px!important;
        margin-top: -30px;
        background-size: 100%;
        background-color: transparent !important;
    }
}

.SSDRedHeader03 {
    background: url('https://www.thingswecre8.com/content/images/SSDRedHeader03.jpg') no-repeat center center;
    height: 170px;
    margin-bottom: 0px;
    margin-top: 0px;
    background-size: 100%;
    background-color: transparent !important;
}

@media (max-width: 767px) {
    .SSDRedHeader03 {
        background: url('https://www.thingswecre8.com/content/images/SSDRedHeader03.jpg') no-repeat center center;
        height: 170px;
        margin-bottom: -30px !important;
        margin-top: -30px;
        background-size: 100%;
        background-color: transparent !important;
    }
}

.SSDRedHeader {
    background: url('https://www.thingswecre8.com/content/images/SSDRedHeader.jpg') no-repeat center center;
    height: 170px;
    margin-bottom: 0px;
    margin-top: 0px;
    background-size: 100%;
    background-color: transparent !important;
}

@media (max-width: 767px) {
    .SSDRedHeader {
        background: url('https://www.thingswecre8.com/content/images/SSDRedHeader.jpg') no-repeat center center;
        height: 170px;
        margin-bottom: -30px !important;
        margin-top: -30px;
        background-size: 100%;
        background-color: transparent !important;
    }
}

.product-certification {
    transition: transform .2s; /* Animation */
    min-width: 100%;
}

    .product-certification:hover {
        transform: scale(2); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
        display: flex;
        align-items: center;
        justify-content: center;
        position:absolute;
        z-index:99999;
    }

/*@media (max-width: 767px) {
    .product-certification:hover {
        transform: scale(2);*/ /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
        /*display: flex;
        align-items: center;
        justify-content: center;
    }
}

@media (min-width: 768px) {
    .product-certification:active {
        transform: scale(2);*/ /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
        /*display: flex;
        align-items: center;
        justify-content: center;
    }
}*/

.full-width-review {
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
    font-size: 2.5vw;
    font-weight: bold;
    display: block;
    align-items: center;
    justify-content: center;
    min-height: 260px !important;
    width: 100%;
    /*    margin-top: 2px;
*/ margin-bottom: 2px;
    border-bottom: 0px solid #90cce2;
    background-color: #455c6fb8 !important;
    /*background-color: #3683be !important;*/
}



/* width */
/*::-webkit-scrollbar {
    width: 6px !important;
    background-color: #131212 !important;
    height: 18px;
}*/

/* Track */
/*::-webkit-scrollbar-track {
    background-color: transparent !important;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.13);
}*/

/* Handle */
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: red !important;
    background-color: #3683be !important;
    border: 1px solid rgba(0, 0, 0, 0.13);
}

    /* Handle on hover */
    /*::-webkit-scrollbar-thumb:hover {
        background-color: #2b74ac !important;
    }*/


/* Style the container with a rounded border, grey background and some padding and margin */
.review-list {
    background-color: #455c6fb8 !important;
    /*background-color: #3683be !important;*/
    max-height: 600px;
    display: block;
    overflow-y: hidden;
    overflow-x: auto;
    table-layout: fixed;
    scrollbar-width: thin !important;
    scrollbar-color: #bc0a0a63 transparent !important;
    /*    -webkit-overflow-scrolling: touch !important;
    -ms-overflow-style: -ms-autohiding-scrollbar !important;*/
}



/*
body {
    scrollbar-width: thin !important;
    scrollbar-color: #bc0a0a63 transparent !important;
}*/

.review-container {
    border: 2px solid #2b74ac;
    background-color: #2b74ac;
    border-radius: 15px;
    padding: 16px;
    width: 400px;
    margin: 16px 16px;
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
    color: #ffffff;
    display: inline-table;
    table-layout: fixed;
    height:460px;
}

.review-country {
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
    color: #ffffff;
    font-style: italic;
    display: inline-table;
}


    /* Clear floats after containers */
.review-container::after {
    content: "";
    clear: both;
    display: inline-table;
}

    /* Float images inside the container to the left. Add a right margin, and style the image as a circle */
    .review-container img {
/*        float: left;
*/        display:block;
        margin-right: 20px;
        margin-bottom: 60px;
        border-radius: 5px;
    }

.review-container-bottom-quote {
            float: right;
 display: block;
    margin-right: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
}

    /* Increase the font-size of a span element */
    .review-container p {
        font-size: 20px;
        margin-left: 25px;
        margin-right: 25px;
        font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
        color: #ffffff;
/*        font-size: 2.5vw;
        font-weight: bold;
    
*/    }

    .review-container span {
        font-size: 20px;
        margin-right: 15px;
        font-weight:700;
        font-size: 2.5vh;
        font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
        color: #ffffff;
        /*        font-size: 2.5vw;
        font-weight: bold;
    
*/
    }

/* Add media queries for responsiveness. This will center both the text and the image inside the container */
@media (max-width: 500px) {
    .review-container {
        text-align: center;
        max-width: 98vw;
        display: inline-table;
    }

        .review-container img {
            margin: auto;
            float: none;
            display: block;
        }
}

    .full-width-heading {
        font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
        font-size: 2.5vw;
        font-weight: bold;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 260px !important;
        width: 100%;
        /*    margin-top: 2px;
*/ margin-bottom: 2px;
        border-bottom: 0px solid #90cce2;
        background-color: transparent!important;
    }

.full-width-heading-transparent {
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
    font-size: 2.5vw;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 260px !important;
    width: 100%;
    /*    margin-top: 2px;
*/ margin-bottom: 2px;
    background-color: transparent !important;
}

.navbar-toggler{
    border: 1px solid #272727!important;
    color:white!important;
}

    .navbar-toggler:focus {
        border: 1px solid #272727!important;
        color: white !important;
        outline:none!important;
    }

.navbar-toggler:after{
    color:white!important;
    content: "Menu"!important;
}

    @media (max-width: 767px) {
        .full-width-heading {
            font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
            font-size: 3.5vw;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 100px !important;
            width: 100%;
            margin-top: 10px;
            background-color: #455c6fb8 !important;
            /*background-color: #3683be !important;*/
            border-bottom: 0px solid #90cce2;
            background-color: transparent !important;
            /*background-color: #77c8e8 !important;*/
        }
        .full-width-heading-transparent {
            font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
            font-size: 3.5vw;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 50px !important;
            width: 100%;
            margin-top: 10px;
            background-color: transparent !important;
        }
        }

    @media (min-width:768px) and (max-width: 820px) {
        .full-width-heading {
            font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
            font-size: 2.5vw;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 100px !important;
            width: 100%;
            margin-top: 10px;
            background-color: #455c6fb8 !important;
            /*background-color: #3683be !important;*/
            border-bottom: 0px solid #90cce2;
        }
        .full-width-heading-transparent {
            font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
            font-size: 2.5vw;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 50px !important;
            width: 100%;
            margin-top: 10px;
            background-color: transparent !important;
        }
    }


    @media (min-width:821px) and (max-width: 912px) {
        .full-width-heading {
            font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
            font-size: 2.5vw;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 100px !important;
            width: 100%;
            margin-top: 10px;
            background-color: #455c6fb8 !important;
            /*background-color: #3683be !important;*/
            border-bottom: 0px solid #90cce2;
        }
        .full-width-heading-transparent {
            font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
            font-size: 2.5vw;
            font-weight: bold;
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 50px !important;
            width: 100%;
            margin-top: 10px;
            background-color: transparent !important;
        }
    }

    @media (max-width: 767px) {
        .container .jumbotron, .container-fluid .jumbotron {
            padding-right: 10px !important;
            padding-left: 10px !important;
        }
    }

.box-image {
    min-width:45%; 
    max-width:50%;

}

.homepage-banner {
    margin-top:-2px!important; 
    margin-bottom:-6px!important; 
    margin-left:0px!important;
}

.homepage-header-01 {
    margin-top: -16px !important; 
    margin-bottom: -5px !important; 
    margin-left: 0px; 
    padding: 0px; 
    color: white;

}

.shopify-buy__product{
    background-color: transparent!important;
}

.shopify-buy__btn-wrapper{
    margin-top: 0px!important;
}

.homepage-prod-use {
    margin-top: 3px !important;
    margin-bottom: -5px !important;
    margin-left: 0px;
    padding: 0px;
    color: white;
}

.homepage-prod-use-img {
    min-width: 100%;
}

.homepage-animation {
    margin-top:-2px!important; 
    margin-bottom:-10px!important; 
    margin-left:0px!important;
}

.homepage-animation-container {
    /*background: #51C3EE;*/
    background: transparent!important;
}

.manual-button {
    background-color: #40b8e5!important; 
    width: 320px; 
    margin: 10px; 
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
}

    .manual-button:hover {
        background-color: #3ba6cf!important;
    }

.btn-override {
    background-color: #40b8e5!important; 
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
}

    .btn-override:hover {
        background-color: #3ba6cf !important;
    }


.copy-footer {
/*    padding-right: 0px !important; 
*/    margin-bottom:10px;
    /*background-color: #51C3EE !important; */
    display: flex; 
    align-items: center; 
    justify-content: center;
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
    color: white;
/*    position: absolute;
    bottom:0px;
*/}

.slidecontainer {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
    color: white;
    width: 100%; /* Width of the outside container */
}

/* The slider itself */
.slider {
    -webkit-appearance: none; /* Override default CSS styles */
    appearance: none;
    width: 100%; /* Full-width */
    height: 25px; /* Specified height */
    background: #ffffff; /* Grey background */
    outline: none; /* Remove outline */
    opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
    -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    transition: opacity .2s;
}

    /* Mouse-over effects */
    .slider:hover {
        opacity: 1; /* Fully shown on mouse-over */
    }

    /* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
    .slider::-webkit-slider-thumb {
        -webkit-appearance: none; /* Override default look */
        appearance: none;
        width: 25px; /* Set a specific slider handle width */
        height: 25px; /* Slider handle height */
        background: #51C3EE; /* Green background */
        cursor: pointer; /* Cursor on hover */
    }

    .slider::-moz-range-thumb {
        width: 25px; /* Set a specific slider handle width */
        height: 25px; /* Slider handle height */
        background: #51C3EE; /* Green background */
        cursor: pointer; /* Cursor on hover */
    }

    .overlay {
        z-index: 9;
        margin: 30px;
        background: #009938;
    }

    /* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
    .dl-horizontal dt {
        white-space: normal;
    }

    /* Set width on the form input elements since they're 100% wide by default */
    input,
    select,
    textarea {
        max-width: 280px;
    }

    .mc-body {
        padding-left: 20vw;
        padding-right: 20vw;
    }

    @media (max-width: 767px) {
        .mc-body {
            padding-left: 2.5vw;
            padding-right: 2.5vw;
        }
    }

    #mc_embed_signup {
        clear: left;
        font: 14px Helvetica,Arial,sans-serif;
        width: 100% !important;
    }

        #mc_embed_signup form {
            width: 100% !important;
            padding: 0px !important;
        }

    #mc-embedded-subscribe {
        margin: 1em 5% 1em 5% !important;
    }

    .form-control {
        background: #d6ebf3;
        color: #4787ac
    }

    #mc_embed_signup div.response {
        font-size: 14pt !important;
        color: white !important;
        width: 100% !important;
    }

    #mc_embed_signup div#mce-responses {
        padding: 0em 0em .5em !important;
        width: 100% !important;
    }

    #mc_embed_signup .foot {
        grid-template-columns: 3fr !important;
        width: 100% !important;
    }

    #mc_embed_signup .brandingLogo {
        justify-self: center !important;
    }

    .wrapper {
        margin-top: 0px;
        min-height: 100vh;
        display: flex;
        border-top-color: #4e95c3 !important;
        border-top: 5px !important;
        /*background: #51C3EE;*/
        /*background: red;*/
    }

        .wrapper .image-holder {
            width: 69.9%;
        }

        .wrapper .form-inner {
            width: 30.1%;
        }


    input, textarea, select, button {
        font-family: "Muli-SemiBold";
    }

    p, h1, h2, h3, h4, h5, h6, ul {
        margin: 0;
    }

    img {
        max-width: 100%;
    }


    .image-holder {
        background: url("../images/registration-form-8.jpg") no-repeat;
        background-size: cover;
    }

        .image-holder img {
            display: none;
        }

    .form-inner {
        /*background: #51C3EE;*/
        padding-left: 4vw;
        padding-right: 4vw;
    }



    form {
        width: 100%;
    }

    .form-header {
        text-align: center;
        margin-bottom: 39px;
    }

    h3 {
        text-transform: uppercase;
        font-size: 40px;
        font-family: "ChelseaMarket-Regular";
    }

    label {
        margin-bottom: 11px;
        display: block;
    }

    .form-group {
        margin-bottom: 26px;
        position: relative;
    }

    .form-control-mailchimp {
        border: 1px solid white !important;
        border-radius: 5px;
        display: inline;
        min-width: 100% !important;
        height: 45px;
        background: transparent;
        padding: 0 19px;
        color: #fff;
        font-size: 17px;
    }


    .form-control-mailchimp-textarea {
        border: 1px solid white !important;
        border-radius: 5px;
        display: inline;
        min-width: 100% !important;
        height: 145px;
        background: transparent;
        padding: 0 19px;
        color: #fff;
        font-size: 17px;
    }

    .form-control.error {
        border-color: #fd677a !important;
        background: url("../images/error.png") no-repeat center right 19px;
    }

    .form-control.valid {
        background: url("../images/valid.png") no-repeat center right 19px;
    }

    .form-error {
        margin-top: 10px;
        display: inline-block;
    }

    .mailchimp-button {
        border: none;
        width: 100%;
        height: 46px;
        border-radius: 22.5px;
        margin: auto;
        margin-top: 40px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        background: #fff;
        color: #4787ac;
        text-transform: uppercase;
        font-size: 17px;
        overflow: hidden;
        -webkit-transform: perspective(1px) translateZ(0);
        transform: perspective(1px) translateZ(0);
        position: relative;
        -webkit-transition-property: color;
        transition-property: color;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
    }

        .mailchimp-button:before {
            content: "";
            position: absolute;
            z-index: -1;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            background: #4787ac;
            -webkit-transform: scaleX(0);
            transform: scaleX(0);
            -webkit-transform-origin: 50%;
            transform-origin: 50%;
            -webkit-transition-property: transform;
            transition-property: transform;
            -webkit-transition-duration: 0.3s;
            transition-duration: 0.3s;
            -webkit-transition-timing-function: ease-out;
            transition-timing-function: ease-out;
        }

        .mailchimp-button:hover {
            color: white;
        }

            .mailchimp-button:hover:before {
                -webkit-transform: scaleX(1);
                transform: scaleX(1);
            }

    .socials {
        text-align: center;
        margin-top: 59px;
    }

    .socials-icon {
        display: inline-flex;
        width: 41px;
        height: 41px;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(255, 255, 255, 0.5);
        font-size: 19px;
        color: #fff;
        transition: all 0.5s ease;
        margin-right: 19px;
    }

        .socials-icon:hover {
            background: #fff;
            border: 1px solid transparent;
            color: #ff97a4;
        }

        .socials-icon:last-child {
            margin-right: 0;
        }

    p {
        font-family: "Muli-SemiBold";
        color: #ffff66;
        margin-bottom: 22px;
    }
    /* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
                    We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
    .carousel-indicators {
        position: absolute;
        right: 0;
        bottom: -10px !important;
        left: 0;
        z-index: 15;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding-left: 0;
        margin-right: 15%;
        margin-left: 15%;
        list-style: none;
    }


    @media (max-width: 767px) {
        .carousel-indicators {
            position: absolute;
            right: 0;
            bottom: -20px !important;
            left: 0;
            z-index: 15;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            padding-left: 0;
            margin-right: 15%;
            margin-left: 15%;
            list-style: none;
        }
    }

    carousel-indicators li {
        position: relative;
        -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        width: 30px !important;
        height: 3px !important;
        margin-right: 5px;
        margin-left: 5px;
        text-indent: -999px;
        background-color: rgba(255,255,255,.5);
    }

    .carousel-caption {
        position: absolute;
        right: 15%;
        margin-top: 120px;
        bottom: -20px !important;
        left: 15%;
        z-index: 10;
        padding-top: 20px;
        padding-bottom: 20px;
        color: #fff;
        text-align: center;
        font-size: 3.25rem;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
    }


    .carousel-item {
        position: relative;
        display: none;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 100%;
        transition: -webkit-transform 0.6s ease;
        transition: transform 0.6s ease;
        transition: transform 0.6s ease, -webkit-transform 0.6s ease;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-perspective: 1000px;
        perspective: 1000px;
        padding-bottom: 220px !important;
    }

    @media (max-width: 767px) {
        .carousel-item {
            padding-bottom: 20px !important;
        }
    }

    .carousel-item.active,
    .carousel-item-next,
    .carousel-item-prev {
        display: block;
    }

    @keyframes tonext {
        75% {
            left: 0;
        }

        95% {
            left: 100%;
        }

        98% {
            left: 100%;
        }

        99% {
            left: 0;
        }
    }

    @keyframes tostart {
        75% {
            left: 0;
        }

        95% {
            left: -300%;
        }

        98% {
            left: -300%;
        }

        99% {
            left: 0;
        }
    }

    @keyframes snap {
        96% {
            scroll-snap-align: center;
        }

        97% {
            scroll-snap-align: none;
        }

        99% {
            scroll-snap-align: none;
        }

        100% {
            scroll-snap-align: center;
        }
    }

    /*.carousel-body {*/
    /*    max-width: 100rem;*/
    /*max-width:100vw;
max-height:60vh;
    margin: 0 auto;
    padding: 0 1.25rem;
    font-family: 'Lato', sans-serif;
}

* {
    box-sizing: border-box;
    scrollbar-color: transparent transparent;*/ /* thumb and track color */
    /*scrollbar-width: 0px;
}

    *::-webkit-scrollbar {
        width: 0;
    }

    *::-webkit-scrollbar-track {
        background: transparent;
    }

    *::-webkit-scrollbar-thumb {
        background: transparent;
        border: none;
    }

* {
    -ms-overflow-style: none;
}

.carousel-ol, carousel-li {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-y:hidden;
}*/

    /*.carousel {
    position: relative;
    padding-top: 75%;
    filter: drop-shadow(0 0 10px #0003);
    perspective: 100px;
}*/

    /*.carousel__viewport {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    overflow-x: scroll;
    counter-reset: item;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
}

.carousel__slide {
    position: relative;
    flex: 0 0 100%;
    width: 100%;*/
    /*    background-color: #f99;
*/ /*counter-increment: item;
}

    .carousel__slide:nth-child(even) {*/
    /*        background-color: #99f;
*/ /*}

    .carousel__slide:before {
        content: counter(item);
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate3d(-50%,-40%,70px);
        color: #fff;
        font-size: 2em;
    }

.carousel__snapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    scroll-snap-align: center;
}

@media (hover: hover) {
    .carousel__snapper {
        animation-name: tonext, snap;
        animation-timing-function: ease;
        animation-duration: 4s;
        animation-iteration-count: infinite;
    }

    .carousel__slide:last-child .carousel__snapper {
        animation-name: tostart, snap;
    }
}

@media (prefers-reduced-motion: reduce) {
    .carousel__snapper {
        animation-name: none;
    }
}

.carousel:hover .carousel__snapper,
.carousel:focus-within .carousel__snapper {
    animation-name: none;
}

.carousel__navigation {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
}

.carousel__navigation-list,
.carousel__navigation-item {
    display: inline-block;
}

.carousel__navigation-button {
    display: none;
    width: 1.5rem;
    height: 1.5rem;
    background-color: #333;
    background-clip: content-box;
    border: 0.25rem solid transparent;
    border-radius: 50%;
    font-size: 0;
    transition: transform 0.1s;
}

.carousel::before,
.carousel::after,
.carousel__prev,
.carousel__next {
    position: absolute;
    top: 0;
    margin-top: 37.5%;
    width: 4rem;
    height: 4rem;
    transform: translateY(-50%);
    border-radius: 50%;
    font-size: 0;
    outline: 0;
}

.carousel::before,
.carousel__prev {
    left: -1rem;
}

.carousel::after,
.carousel__next {
    right: -1rem;
}

.carousel::before,
.carousel::after {
    content: '';
    z-index: 1;
    background-color: #333;
    background-size: 1.5rem 1.5rem;
    background-repeat: no-repeat;
    background-position: center center;
    color: #fff;
    font-size: 2.5rem;
    line-height: 4rem;
    text-align: center;
    pointer-events: none;
} 

.carousel::before {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='0,50 80,100 80,0' fill='%23fff'/%3E%3C/svg%3E");
}

.carousel::after {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='100,50 20,100 20,0' fill='%23fff'/%3E%3C/svg%3E");
}*/