@CHARSET "ISO-8859-1";
@import url('https://fonts.googleapis.com/css2?family=Viga&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merienda&family=Playfair+Display&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Franklin&display=swap');

/* Reset CSS */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}

/* Custom CSS */
body{
    background-color: white;
	color: white !important;
}

.navbar {
    position: absolute;
    z-index: 999;
    top: 0;
    width: 100%;
}

.navbar-brand {
    font-family: 'Viga', sans-serif;
}

.title-products {
    font-family: 'Viga', sans-serif;
}

.desc-products {
    font-family: 'Montserrat', sans-serif;
}

.modal-title-products {
    font-family: 'Viga', sans-serif;
}

.modal-desc-products {
    font-family: 'Montserrat', sans-serif;
}

/* Owl Carousel */

.owl-prev {
    left: 10px;
}

.owl-next {
    right: 10px;
}

.owl-prev,
.owl-next {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
}

.owl-prev:hover,
.owl-prev:active,
.owl-prev:focus,
.owl-next:hover,
.owl-next:active,
.owl-next:focus {
    outline: 0;
}

.owl-prev span,
.owl-next span {
    font-size: 60px;
    color: white;
    text-shadow: 1px 1px 5px #999;
}

.owl-theme .owl-nav [class*="owl-"]:hover {
    background-color: transparent;
}

@media (max-width: 575.98px) {
    .title-products {
        font-size: 1.5em;
    }

    .desc-products {
        font-size: 1em;
    }

    .desktop-only {
        display: none !important;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .title-products {
        font-size: 2em;
    }

    .desc-products {
        font-size: 1em;
        width: 85%;
    }

    .desktop-only {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .title-products {
        font-size: 2em;
    }

    .desc-products {
        font-size: 1em;
        width: 75%;
    }

    .desktop-only {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .navbar {
        background-color: transparent !important;
    }

    .navbar .navbar-brand {
        color: white;
    }

    .navbar .navbar-brand:hover {
        color: whitesmoke;
    }

    .navbar .nav-item .nav-link {
        color: whitesmoke;
    }

    .navbar .nav-item .nav-link:hover {
        color: rgba(255, 255, 255, 0.75);
    }

    .title-products {
        font-size: 2.5em;
    }

    .desc-products {
        font-size: 1.1em;
        width: 65%;
    }

    .modal {
        overflow-y: hidden;
        overflow-x: hidden;
    }

    .modal-cover {
        width: 50%;
        height: 100vh;
    }

    .modal-title-products {
        font-size: 2em;
    }

    .modal-desc-products {
        font-size: 1.1em;
        text-align: justify;
    }

    .content-right {
        padding: 75px;
    }

    .img-content {
        width: 100%;
        height: 100vh;
    }
}

@media (min-width: 1200px) {
    .navbar {
        background-color: transparent !important;
    }

    .navbar .navbar-brand {
        color: white;
    }

    .navbar .navbar-brand:hover {
        color: whitesmoke;
    }

    .navbar .nav-item .nav-link {
        color: whitesmoke;
    }

    .navbar .nav-item .nav-link:hover {
        color: rgba(255, 255, 255, 0.75);
    }

    .title-products {
        font-size: 3em;
        width: 55%;
    }

    .desc-products {
        font-size: 1.25em;
        width: 55%;
    }

    .modal {
        overflow-y: hidden;
        overflow-x: hidden;
    }

    .modal-cover {
        width: 50%;
        height: 100vh;
    }

    .modal-title-products {
        font-size: 2.25em;
    }

    .modal-desc-products {
        font-size: 1.25em;
        text-align: justify;
    }

    .content-right {
        padding: 100px;
    }

    .img-content {
        width: 100%;
        height: 100vh;
    }
}