﻿@charset "UTF-8";

@font-face {
    font-family: 'Roboto-Light';
    src: url('../fonts/Roboto-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Regular';
    src: url('../fonts/Roboto-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Archivo-Regular';
    src: url('../fonts/Archivo/Archivo-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Lato-Regular';
    src: url('../fonts/Lato/Lato-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto-Thin';
    src: url('../fonts/Roboto-Thin.ttf') format('truetype');
}

@import url(style.less);

:root {
    --main-bg-color: #4CC552;
    --bg-site: #4CC552;
    --bg-site-dark: #3EA055;
    --bg-site-light: #F0FFF0;
}

html {
    scroll-behavior: smooth;
}

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

body {
    font-family: Roboto-Light !important;
}

.logo-site {
    width: 50%;
    height: 30%;
}

.logo-font {
    font-weight: 700;
}

#barApp a {
    color: #000;
    font-size: 18px;
    font-weight: 600;
}

    #barApp a:hover {
        background-color: var(--bg-site);
        color: #fff;
    }


h1 {
    font-family: Lato-Regular, sans-serif;
    font-weight: 800;
}

h2 {
    font-family: Archivo-Regular, sans-serif;
    font-weight: 500;
}

.lato-regular {
    font-family: Lato-Regular, sans-serif;
}

.archivo-regular {
    font-family: Archivo-Regular, sans-serif;
}

.text-title-card {
    font-family: Archivo-Regular, sans-serif;
    font-weight: 500;
    font-size: 26px;
}

p lead {
    font-family: Lato-Regular, sans-serif;
    font-weight: 500;
}

.text-site {
    color: var(--main-bg-color);
}

.text-site-dark {
    color: var(--bg-site-dark);
}

.text-site-light {
    color: var(--bg-site-light);
}

.bg-site {
    background-color: var(--main-bg-color) !important;
}

.bg-site-dark {
    background-color: var(--bg-site-dark) !important;
}

.bg-site-light {
    background-color: var(--bg-site-light) !important;
}

.bg-orangered {
    background-color: #FF4500 !important;
}

.bg-light-blue {
    background-color: #F0F8FF !important;
}

.bg-dark-blue {
    background-color: var(--bg-site) !important;
}

.text-dark-blue {
    color: var(--bg-site) !important;
}

/*span.fa {
    display: inline-block;
    border-radius: 60px;
    box-shadow: 0 0 2px #fff;
    padding: 0.5em 0.6em;
}
*/

.font-weight-bold {
    font-weight: bold;
}

.btn-rounded {
    border-radius: 12px;
}

.space-design {
    margin-bottom: 100px;
}

#telefonos a {
    text-decoration: none;
    color: var(--bg-site-light) !important;
    font-size: 12px;
}

    #telefonos a:hover {
        text-decoration: underline;
        color: var(--bg-site-light) !important;
        cursor: pointer;
        opacity: 0.8;
    }

footer a {
    text-decoration: none;
    color: var(--bg-site-light) !important;
    font-size: 12px;
}

    footer a:hover {
        text-decoration: underline;
        color: var(--bg-site-light) !important;
        cursor: pointer;
        opacity: 0.8;
    }

.call-to-action {
    position: relative;
    background-color: var(--main-bg-color);
    /*background: url("../Images/vector2.jpg") no-repeat center center;*/
    opacity: .9;
    background-size: cover;
    padding-top: 7rem;
    padding-bottom: 7rem;
}

    .call-to-action:before {
        content: "";
        position: absolute;
        background-color: var(--main-bg-color);
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        opacity: 0.8;
    }

footer.footer {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.back-to-top {
    position: fixed;
    bottom: 25px;
    right: 25px;
    display: none;
}

.lightbox {
    display: none;
    z-index: -2000;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.8);
    cursor: pointer;
}

.imgFull {
    width: 95%;
    height: 95%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    margin-top: 10px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.labelImg {
    background-color: var(--bg-site);
    padding: 5px;
    height: 300px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border: 4px solid rgb(255,255,255);
    cursor: pointer;
}

    .labelImg:hover {
        z-index: 1;
        box-shadow: 0 8px 50px rgba(0, 0, 0, .2);
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }


#mainNav {
    /* box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);*/
    transition: background-color 0.2s ease;
    color: #fff;
}

    #mainNav .navbar-brand {
        font-weight: 700;
    }
   
    #mainNav .navbar-nav .nav-item .nav-link {
        color: #fff;
        font-weight: 700;
    }

        #mainNav .navbar-nav .nav-item .nav-link:hover, #mainNav .navbar-nav .nav-item .nav-link:active {
            color: #fff;
        }

.scrolled #mainNav {
    transition: 500ms ease;
    background: var(--bg-site);
    opacity: .9;
    color: #fff;
}

@media only screen and (max-device-width: 830px) {
    #mainNav {
        transition: 500ms ease;
        opacity: .9;
        color: #fff;
    }


    .navbar-nav {
        background-color: var(--bg-site) !important;
        color: #000000 !important;
        opacity: .9;
    }

    #mainNav .navbar-nav .nav-item .nav-link {
        color: #fff;
        padding-left: 2px;
        font-weight: 900;
    }

    .nav-item {
        text-align: end !important;
        padding-right: 10px;
    }

    .nav-link :hover {
        text-decoration: underline !important;
        color: #fff !important;
    }

    .scrolled #mainNav {
        transition: 500ms ease;
        background: var(--bg-site);
        opacity: .9;
        color: #fff;
    }

    .scrolled .navbar-toggler {
        transition: 1500ms ease;
        height: 70%;
        float: inline-end !important;
        float: inline-end;
    }

    .scrolled .navbar-toggler-icon {
        transition: 1500ms ease;
        font-size: 13px;
    }

    .navbar-collapse {
        padding-top: 2px;
    }

    .border-bottom-sm {
        border-bottom: 1px solid #fff;
    }
}

.scrolled .logo-site {
    transition: 1500ms ease;
    width: 30%;
    height: 20%;
}

.carousel-item {
    height: 100vh;
    min-height: 350px;
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.carousel-caption {
    bottom: 2.25rem;
}

.image-product {
    width: 150px;
    /*height:50%;*/
}


.card-border-left {
    border-left: 5px solid var(--bg-site-dark);
}

.logistica-image {
    background-image: linear-gradient(to bottom, rgba(92, 77, 66, 0.9) 0%, rgba(97, 197, 82, 0.7) 100%), url('../Images/logistica.png');
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-size: cover;
    background-color: #000;
}

#logistica a:hover {
    text-decoration: underline;
    color: var(--bg-site-dark) !important;
}

p small {
    color: var(--bg-site-dark) !important;|
}

#organicos a {
    color:white;
    text-decoration:none;
}

/*================================ BG COLORS ========================================== */
.bg-primary-50 {
    background-color: #E3F2FD !important;
}

.bg-primary-100 {
    background-color: #BBDEFB !important;
}

.bg-primary-200 {
    background-color: #90CAF9 !important;
}

.bg-primary-300 {
    background-color: #64B5F6 !important;
}

.bg-primary-400 {
    background-color: #42A5F5 !important;
}

.bg-primary-500 {
    background-color: #2196F3 !important;
}

.bg-primary-600 {
    background-color: #1E88E5 !important;
}

.bg-primary-700 {
    background-color: #1976D2 !important;
}

.bg-primary-800 {
    background-color: #1565C0 !important;
}

.bg-primary-900 {
    background-color: #0D47A1 !important;
}

.bg-success-50 {
    background-color: #E0F2F1 !important;
}

.bg-success-100 {
    background-color: #B2DFDB !important;
}

.bg-success-200 {
    background-color: #80CBC4 !important;
}

.bg-success-300 {
    background-color: #4DB6AC !important;
}

.bg-success-400 {
    background-color: #26A69A !important;
}

.bg-success-500 {
    background-color: #009688 !important;
}

.bg-success-600 {
    background-color: #00897B !important;
}

.bg-success-700 {
    background-color: #00796B !important;
}

.bg-success-800 {
    background-color: #00695C !important;
}

.bg-success-900 {
    background-color: #004D40 !important;
}

.bg-info-50 {
    background-color: #9acffa !important;
}

.bg-info-100 {
    background-color: #82c4f8 !important;
}

.bg-info-200 {
    background-color: #6ab8f7 !important;
}

.bg-info-300 {
    background-color: #51adf6 !important;
}

.bg-info-400 {
    background-color: #39a1f4 !important;
}

.bg-info-500 {
    background-color: #2196F3 !important;
}

.bg-info-600 {
    background-color: #0d8aee !important;
}

.bg-info-700 {
    background-color: #0c7cd5 !important;
}

.bg-info-800 {
    background-color: #0a6ebd !important;
}

.bg-info-900 {
    background-color: #0960a5 !important;
}

.bg-warning-50 {
    background-color: #ffebc1 !important;
}

.bg-warning-100 {
    background-color: #ffe3a7 !important;
}

.bg-warning-200 {
    background-color: #ffdb8e !important;
}

.bg-warning-300 {
    background-color: #ffd274 !important;
}

.bg-warning-400 {
    background-color: #ffca5b !important;
}

.bg-warning-500 {
    background-color: #ffc241 !important;
}

.bg-warning-600 {
    background-color: #ffba28 !important;
}

.bg-warning-700 {
    background-color: #ffb20e !important;
}

.bg-warning-800 {
    background-color: #f4a500 !important;
}

.bg-warning-900 {
    background-color: #da9400 !important;
}

.bg-danger-50 {
    background-color: #feb7d9 !important;
}

.bg-danger-100 {
    background-color: #fe9ecb !important;
}

.bg-danger-200 {
    background-color: #fe85be !important;
}

.bg-danger-300 {
    background-color: #fe6bb0 !important;
}

.bg-danger-400 {
    background-color: #fd52a3 !important;
}

.bg-danger-500 {
    background-color: #fd3995 !important;
}

.bg-danger-600 {
    background-color: #fd2087 !important;
}

.bg-danger-700 {
    background-color: #fc077a !important;
}

.bg-danger-800 {
    background-color: #e7026e !important;
}

.bg-danger-900 {
    background-color: #ce0262 !important;
}

.bg-Purple-50 {
    background-color: #F3E5F5 !important;
}

.bg-Purple-100 {
    background-color: #E1BEE7 !important;
}

.bg-Purple-200 {
    background-color: #CE93D8 !important;
}

.bg-Purple-300 {
    background-color: #BA68C8 !important;
}

.bg-Purple-400 {
    background-color: #AB47BC !important;
}

.bg-Purple-500 {
    background-color: #9C27B0 !important;
}

.bg-Purple-600 {
    background-color: #8E24AA !important;
}

.bg-Purple-700 {
    background-color: #7B1FA2 !important;
}

.bg-Purple-800 {
    background-color: #6A1B9A !important;
}

.bg-Purple-900 {
    background-color: #4A148C !important;
}

.bg-Purple-A100 {
    background-color: #EA80FC !important;
}


/*================================ TEXT COLORS ========================================== */
.text-primary-50 {
    color: #E3F2FD !important;
}

.text-primary-100 {
    color: #BBDEFB !important;
}

.text-primary-200 {
    color: #90CAF9 !important;
}

.text-primary-300 {
    color: #64B5F6 !important;
}

.text-primary-400 {
    color: #42A5F5 !important;
}

.text-primary-500 {
    color: #2196F3 !important;
}

.text-primary-600 {
    color: #1E88E5 !important;
}

.text-primary-700 {
    color: #1976D2 !important;
}

.text-primary-800 {
    color: #1565C0 !important;
}

.text-primary-900 {
    color: #0D47A1 !important;
}

.text-warning-50 {
    color: #ffebc1 !important;
}

.text-warning-100 {
    color: #ffe3a7 !important;
}

.text-warning-200 {
    color: #ffdb8e !important;
}

.text-warning-300 {
    color: #ffd274 !important;
}

.text-warning-400 {
    color: #ffca5b !important;
}

.text-warning-500 {
    color: #ffc241 !important;
}

.text-warning-600 {
    color: #ffba28 !important;
}

.text-warning-700 {
    color: #ffb20e !important;
}

.text-warning-800 {
    color: #f4a500 !important;
}

.text-warning-900 {
    color: #da9400 !important;
}

.text-info-50 {
    color: #9acffa !important;
}

.text-info-100 {
    color: #82c4f8 !important;
}

.text-info-200 {
    color: #6ab8f7 !important;
}

.text-info-300 {
    color: #51adf6 !important;
}

.text-info-400 {
    color: #39a1f4 !important;
}

.text-info-500 {
    color: #2196F3 !important;
}

.text-info-600 {
    color: #0d8aee !important;
}

.text-info-700 {
    color: #0c7cd5 !important;
}

.text-info-800 {
    color: #0a6ebd !important;
}

.text-info-900 {
    color: #0960a5 !important;
}
