@import url('https://fonts.googleapis.com/css2?family=Spartan:wght@400;500;600;700&display=swap');
@import url("https://fonts.googleapis.com/css?family=PT+Sans+Narrow:300,400,600,700");
@import url("https://fonts.googleapis.com/css2?family=Spartan:wght@300;800&display=swap");
.sombra {
    /* -webkit-box-shadow: 14px 14px 20px -10px rgba(0,0,0,0.77);
    -moz-box-shadow: 14px 14px 20px -10px rgba(0,0,0,0.77);
    box-shadow: 14px 14px 20px -10px rgba(0,0,0,0.77); */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

.micsa-textura {
    background-color: #008c8c;
    background-image: url("https://www.transparenttextures.com/patterns/black-scales.png");
    /* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}

.FontPicapino {
    font-family: 'Spartan', sans-serif;
    font-weight: small;
    font-style: small;    
}

.fondo-sidebar-header {
    background-image: url('../../img/design/BG1.jpg')
}

.fondo-card {
    background-image: url('../../img/design_opacity/BG5.jpg');
    background-position: center top;
    background-size: 100% auto;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.1);
    padding: 6px;
    border-radius: 5px;
}

/* boton flotante ini */

.float {
    position: fixed;
    width: 90px;
    height: 90px;
    bottom: 40px;
    right: 40px;
    background-color: #6E6A69;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    box-shadow: 2px 2px 3px #999;
}

/* cambio el color en hover, para el boton flotante unicamente */

a.float:hover {
    color: #ffffff;
    background-color: #423f3e;
}

.my-float {
    margin-top: 30px;
}

/* boton flotante fin */

.micsa-register-bacground {
    background: rgba(255, 255, 255, 1);
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 35%, rgba(161, 193, 25, 1) 95%, rgba(161, 193, 25, 1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(35%, rgba(255, 255, 255, 1)), color-stop(95%, rgba(161, 193, 25, 1)), color-stop(100%, rgba(161, 193, 25, 1)));
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 35%, rgba(161, 193, 25, 1) 95%, rgba(161, 193, 25, 1) 100%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 35%, rgba(161, 193, 25, 1) 95%, rgba(161, 193, 25, 1) 100%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 35%, rgba(161, 193, 25, 1) 95%, rgba(161, 193, 25, 1) 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 35%, rgba(161, 193, 25, 1) 95%, rgba(161, 193, 25, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#a1c119', GradientType=0);
}

.row.equal {
    display: flex;
    flex-wrap: wrap;
  }
  .col-igual {
    margin: auto;
  }

@media (min-width: 768px) {
    .picapino-font {
        font-family: Righteous;
        font-size: 3em;
        color: #fcfcfc;
        font-weight: lighter;
        letter-spacing: 7px;
    }
    .picapino-font-landing {
        font-family: Righteous;
        font-size: 24px;
        color: #ffffff;
    }
    .picapino-font-landing-title {
        padding: 10px 10px;
        font-family: Righteous;
        font-size: 24px;
        color: #ffffff;
        font-weight: lighter;
        letter-spacing: 7px;
    }
    .contenedor2 {
        padding-left: 5em;
        padding-right: 5em;
        padding-top: 3em;
    }
    .picapino-quantity-control {
        /* float: right; */
        width: 99%;
        padding: 1em;
        text-align: center;
        display: inline-block;
    }
    .landing-page .header-back {
        height: 440px;
        width: 100%;
    }
    .landing-page .header-back.one {
        /* Los parametros en porcentaje indican la posicion, al tener backrgound-size en 100% de ancho el posicionamiento es indiferente */
        /* background: url('../../img/landing/BannerAgosto1300x440.jpg') 50% 50% no-repeat; */
        background: url('../../img/landing/BannerMicsaPapas1920x440.png') 50% 50% no-repeat;
        background-size: cover;
    }
    .landing-page .header-back.two {
        background: url('../../img/landing/BannerMicsaPimiento1920x440.png') 50% 50% no-repeat;
        background-size: cover;
        /* background-position: center top;
        background-size: 100% auto; */
    }
    .landing-page .header-back.three {
        background: url('../../img/landing/BannerMicsaTomate1920x440.png') 50% 50% no-repeat;
        background-size: cover;
        /* background-position: center top;
        background-size: 100% auto; */
    }
    .landing-page .carousel {
        height: 440px;
    }
    .landing-page .carousel-caption {
        z-index: 10;
    }
    .landing-page .carousel .item {
        height: 440px;
        background-color: #777;
    }
    .landing-page .carousel-inner>.item>img {
        position: absolute;
        top: 0;
        left: 0;
        min-width: 100%;
        height: 440px;
    }
    .info-modal {
        text-align: justify;
    }
    .espacioEncabezadoMovil {
        height: 0px;
    }
    .micsa-login-header {
        background-color: #ffffff;
        border-bottom-right-radius: 50%;
        border-bottom-left-radius: 50%;
        border-top-left-radius: 0%;
        border-top-right-radius: 0%;
    }
    .degradado {
        background: rgba(78, 163, 47, 1);
        background: -moz-linear-gradient(left, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(78, 163, 47, 1)), color-stop(56%, rgba(148, 194, 31, 1)), color-stop(100%, rgba(78, 163, 47, 1)));
        background: -webkit-linear-gradient(left, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        background: -o-linear-gradient(left, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        background: -ms-linear-gradient(left, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        background: linear-gradient(to right, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ea32f', endColorstr='#4ea32f', GradientType=1);
    }
    .img-transparente {
        background-image: url('../../img/leaf_transparent.png');
        background-size: cover;
        height: 100%;
    }
}

@media (max-width: 768px) {
    .picapino-font {
        font-family: Righteous;
        font-size: 2em;
        color: #fcfcfc;
    }
    .content-to-hide {
        display: none;
    }
    .picapino-font-landing-title {
        padding: 10px 10px;
        font-family: Righteous;
        font-size: 24px;
        color: #A6A6A6;
    }
    .picapino-quantity-control {
        width: 99%;
        padding: 1em;
        text-align: center;
        display: inline-block;
    }
    .landing-page .header-back {
        height: 200px;
        width: 100%;
    }
    .landing-page .header-back.one {
        background: url('../../img/landing/BannerMicsaPapas1920x440.png') 50% 50% no-repeat;
        background-position: center top;
        /* background-size: 100% auto; */
        background-size: cover;
    }
    .landing-page .header-back.two {
        background: url('../../img/landing/BannerMaracuya1080x540.png') 50% 50% no-repeat;
        background-position: center top;
        /* background-size: 100% auto; */
        background-size: cover;
    }
    .landing-page .header-back.three {
        background: url('../../img/landing/BannerMicsaTomate1080x540.png') 50% 50% no-repeat;
        background-position: center top;
        /* background-size: 100% auto; */
        background-size: cover;
    }
    .landing-page .carousel {
        height: 200px;
    }
    .landing-page .carousel-caption {
        z-index: 10;
    }
    .landing-page .carousel .item {
        height: 200px;
        background-color: #777;
    }
    .landing-page .carousel-inner>.item>img {
        position: absolute;
        top: 0;
        left: 0;
        min-width: 100%;
        height: 200px;
    }
    .info-modal {
        text-align: center;
    }
    .quantity {}
    /* .landing-items-col {
        
    } */
    .espacioEncabezadoMovil {
        height: 60px;
    }
    .micsa-login-header {
        background-color: #ffffff;
    }
    .degradado {
        background: rgba(78, 163, 47, 1);
        background: -moz-linear-gradient(left, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(78, 163, 47, 1)), color-stop(56%, rgba(148, 194, 31, 1)), color-stop(100%, rgba(78, 163, 47, 1)));
        background: -webkit-linear-gradient(left, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        background: -o-linear-gradient(left, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        background: -ms-linear-gradient(left, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        background: linear-gradient(to right, rgba(78, 163, 47, 1) 0%, rgba(148, 194, 31, 1) 56%, rgba(78, 163, 47, 1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4ea32f', endColorstr='#4ea32f', GradientType=1);
    }
    .img-transparente {
        background-image: url('../../img/leaf_transparent.png');
        background-size: 100%;
        height: 100%;
    }
}

@media (max-width: 369px) {
    .picapino-logo {
        display: none;
    }
}

@media (min-width: 1367px) {
    /* .landing-page .header-back.one {
        Los parametros en porcentaje indican la posicion, al tener backrgound-size en 100% de ancho el posicionamiento es indiferente 
        background: url('../../img/landing/BannerMaracuya1920x440.jpg') 50% 50% no-repeat;
        background-size: 100% 100%;
    } */
}