
/*-------------------*/
/*----@fontface------*/
/*-------------------*/
@font-face {
    font-family: 'Open Sans';
    src: url('../font/OpenSans-Bold.eot');
    src: url('../font/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('../font/OpenSans-Bold.woff2') format('woff2'),
        url('../font/OpenSans-Bold.woff') format('woff'),
        url('../font/OpenSans-Bold.ttf') format('truetype'),
        url('../font/OpenSans-Bold.svg#OpenSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../font/OpenSans.eot');
    src: url('../font/OpenSans.eot?#iefix') format('embedded-opentype'),
        url('../font/OpenSans.woff2') format('woff2'),
        url('../font/OpenSans.woff') format('woff'),
        url('../font/OpenSans.ttf') format('truetype'),
        url('../font/OpenSans.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../font/OpenSans-Light.eot');
    src: url('../font/OpenSans-Light.eot?#iefix') format('embedded-opentype'),
        url('../font/OpenSans-Light.woff2') format('woff2'),
        url('../font/OpenSans-Light.woff') format('woff'),
        url('../font/OpenSans-Light.ttf') format('truetype'),
        url('../font/OpenSans-Light.svg#OpenSans-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Steinem';
    src: url('../font/Steinem.eot');
    src: url('../font/Steinem.eot?#iefix') format('embedded-opentype'),
        url('../font/Steinem.woff2') format('woff2'),
        url('../font/Steinem.woff') format('woff'),
        url('../font/Steinem.ttf') format('truetype'),
        url('../font/Steinem.svg#Steinem') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../font/OpenSans-Semibold.eot');
    src: url('../font/OpenSans-Semibold.eot?#iefix') format('embedded-opentype'),
        url('../font/OpenSans-Semibold.woff2') format('woff2'),
        url('../font/OpenSans-Semibold.woff') format('woff'),
        url('../font/OpenSans-Semibold.ttf') format('truetype'),
        url('../font/OpenSans-Semibold.svg#OpenSans-Semibold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}




/*----------------------------------------*/
/*------------ESTILOS GENERALES-----------*/
/*----------------------------------------*/
*{
margin: 0px;
padding:0px;
box-sizing: border-box;
/*-------------------*/
/*-PALETA DE COLORES-*/
/*-------------------*/
/* CSS HEX */
--blue: #003049ff;
--red: #d62828ff;
--orange: #f77f00ff;
--black: #212121ff;
--gray: #cfcfcfff;
--cultured: #f5f5f5ff;
}

body{
width: 100%;
margin: 0;
height: auto;
overflow-x: hidden;
background-color: white;
}
a{
font-size: 1em;
text-decoration: none;
font-family: 'Open Sans';
color: var(--red);
}
a:hover{
transition:.1s;
text-decoration:underline;
}
blockquote{
font-size: 1.5em;
line-height:1.4583em ;
width: 80%;
padding: 10px 0px 20px;
text-align: center;
margin: auto;
color: black;
font-family: 'Open Sans';
font-style: oblique;
}
h1, h2, h3, h4{
font-family: 'Steinem', serif;

}

p, ul, li, ol{
font-size: 1em;
line-height: 1.375em;
text-align: justify;
font-family: 'Open Sans';
color: black;
margin-bottom:20px;
}
ul, ol, li{
position: relative;
text-align: left !important;
}
ol{
list-style-type:lower-alpha;
}
ul, ol{
left: 10px;    
}
section{
position: relative;
width: 100%;
height: auto;
margin: 0;
padding: 0;
}
main{
width: 100%;
height: auto;
min-height: auto;
position: relative;
top: 0;
margin: auto;
padding: 0;
}
footer{
position: relative;
top: 0;
width: 100%;
background-color: transparent;
}
/*-----scroll-------*/
::-webkit-scrollbar              { background-color: transparent; width: 2px;}
::-webkit-scrollbar-button       { background-color: #3f3f3f; }
::-webkit-scrollbar-track        { background-color: transparent}
::-webkit-scrollbar-track-piece  { background-color: transparent; }
::-webkit-scrollbar-thumb        { background-color: #f44336; }
::-webkit-scrollbar-thumb:window-inactive {background-color: rgba(0,0,0,.1); }


@media(min-width:300px){
/*----------------------------------------*/
/*------------ESTILOS GENERALES-----------*/
/*----------------------------------------*/
h1{
font-size: 2em;
line-height: 1.25em;
}
h2{
font-size: 1.625em;
line-height: 1.15384615em;

}
h3{
font-size: 1.375em;
line-height: 1.13636364em;

}
h4{
font-size: 1.125em;
line-height: 1.11111111em;

}
ol{
width: 90%;
padding: 12px 16px 0 16px;
}    
/*---*/
  
    
    
/*-------POLITICA DE COOKIES----*/
 #cookies{
background-color: var(--red);
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
padding: 16px 5%;
color: white;
}
.cookie-txt p{
color: white        
}
.cookie-txt a{
color: white;
text-decoration: underline;
}
#btn_cookie{
text-decoration: none;
border:none;
background-color: white;
color:#192738;
padding: 8px;
width: 100px;
height: 30px;
border-radius:25px;
font-weight: 500;
}  
#btn_cookie:hover{
cursor: pointer;
background-color: var(--orange);
color: white;
} 
/*-------POLITICA DE PRIVACIDAD----*/    
.section-privacidad {
padding-top: 50px;        
}   
.section-privacidad h3{
text-align: center;
margin-bottom: 28px;
color: var(--black);
}    
.section-privacidad h4{
margin-bottom: 18px;
font-size: 14px;
color: var(--black);
}
.section-privacidad p{
font-size: 12px ;
color: var(--black);
}
/*-------VENTANA MODAL-------*/    
/*---MODAL----*/   
#my-modal-ventas, #my-modal-ventas-footer{
position: absolute;
width: 100%;
height: 100vh;
min-height: 600px;
padding: 60px 0 0;
z-index: 100;
display: none;
overflow-y: auto;
top: 0;
}
.modal-box{
position: relative;
width: 93%;
height: 88vh;
background-color: white;
box-shadow: 8px 8px 18px rgba(0,0,0,.3);
border-radius: 15px;
padding: 0; 
margin: auto;
border-top: 1px solid var(--cultured);
border-left: 1px solid var(--cultured);
overflow-y: auto;
}    
.close{
padding: 3px 9px 2px 8px;
border: none;
background: red;
color: white;
width: 30px;
position: absolute;
right: 3px;
top: 2px;
font: bold 24px arial sans-serif;
outline:none;
border-radius: 0 15px 0 15px;
z-index: 2;
font-weight: bold;
}    
.close:hover{
background-color: var(--gray);
transition: .2s;
cursor: pointer;
}    
.modal-content{
width: 100%;
height: 96%;
position: relative;
top: 0px;
} 
#contact-title{
margin-bottom: 0        
}
/*---modal btn----*/    
#modal-btn-ventas-footer{
border: none;
color: white;
font-size: 18px;
background: none;
outline:none;
}
#modal-btn-ventas-footer:hover{
transition: .5s;
cursor: pointer
} 
/*---contact form----*/ 
.form{
    width: 100%; 
    height: auto;  
    background-color: white;
    border-radius: 8px;
    padding: 16px;
    }
    .form h3{
    margin-bottom: 24px;
    color: #3f3f3f; 
    text-align: left;   
    }
    .div-input-box,.div-textarea-box{
    width: 100%;
    height: auto;
    padding: 18px ;
    position: relative;
    margin-bottom: 18px;
    border-radius: 6px; 
    border: 1px solid #dcdcdc;
    }
    .div_input_box_hover{
    border: 2px solid #0466c8;
     height: 60px;  
    }
    .div_label_hover{
    color: blue;
    font-size: 14px; 
    top: -12px; 
    left:10px;
    background-color: white; 
    padding: 0 6px;
    
    }
    .div_input_hover{
    height: 24px; 
    display: block;   
    }
    .div-label{
    color: #3f3f3f;
    font-family: 'Lato';
    font-size: 16px; 
    position: absolute;
    z-index: 1;
    }
    .div-input{
    width: 100%;
    height: 24px; 
    outline: none;
    border: none; 
    font-size: 14px; 
    position: relative;
    }
    /**/
    .div-textarea-box{
    min-width: 100%;
    max-width: 100%;
    min-height: 250px;
    max-height: 550px;
    border: 1px solid #dcdcdc;
    padding-top: 50px;
    color: #3f3f3f;   
    }
    .div-label-textarea{
    color: #3f3f3f;
    font-family: 'Lato';
    font-size: 16px; 
    position: absolute;
    z-index: 1; 
    top: 16px; 
     
    }
    .input-textarea{
    min-width: 100%;
    max-width: 100%;
    min-height: 250px;
    max-height: 250px;
    border-color: #dcdcdc;
    outline: #d1cece;
    overflow-wrap: break-word;
    font-family: 'Lato';
    text-align: justify;
    padding: 6px;
    color: #3f3f3f;
    top: 10px;
    position: relative;
    }
    .div-textarea-box-hover{
    border: 2px solid #0466c8;
    padding: 16px;
    }
    .div-label-textarea-hover{
    color: blue;
    font-size: 14px; 
    top: -12px; 
    left:10px;
    background-color: white; 
    padding: 0 6px;
    }
    .input-textarea-hover{
    position: relative;
    min-width: 100%;
    max-width: 100%;
    min-height: 280px;
    max-height: 100%;
    
    }
    #div-input-box-check{
    border: none;
    display:flex ;
    padding: 0;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    margin-bottom: 12px;  
    }
    #div-label-check{
    font-size: 14px; 
    font-style: italic;
    position: relative;   
    }
    #div-input-check{
    display: block;
    width: 28px; 
    margin-right: 24px;
    font-size: 48px;
    transform: scale(1);
    position: relative; 
    }
    #div-input-box-submit{
    border: none;
    padding: 48px 0 0;
       
    }
    #div-input-submit{
    background-color: #3f3f3f;
    border: none;
    color: white;
    padding: 16px 32px;
    text-decoration: none;
    cursor: pointer;
    border-radius: 42px;
    width: 100%;
    font-weight: 400;
    font-size: 16px; 
    }
    #div-input-submit:hover{
    box-shadow: 0 1366px 0 #04AA6D inset;    
    }
    /*------ERROR-----------*/
    #error-name, #error-lastname,#error-subject, #error-email, #error-phone {
    width: 100%; 
    min-height: 5px; 
    background: #ffdddd;
    border: 1px solid #ffdddd; 
    border-left: 6px solid #f44336;
    color: #3f3f3f;
    font-family: "Lato"; 
    padding: 8px;
    margin-bottom: 12px;
    display:none;
    }
    /*------MENSAJE-----------*/
    #alert-name, #alert-lastname, #alert-subject, #alert-email, #alert-phone, #alert-message, #alert-check{
    width: 100%; 
    min-height: 5px; 
    background: #ffffcc;
    border: 1px solid #ffffcc;
    border-left: 6px solid #ffeb3b;
    color: #3f3f3f;
    font-family: "Lato"; 
    padding: 8px;
    margin-bottom: 12px;
    display:none;
    }

/*----------------------------------------*/
/*-----------------HEADER----------------*/
/*----------------------------------------*/    
    
/*-----Menu Principal*-----*/   
#logo-desk{
display: none;        
}
#logo-movil{
width: 165px;        
}
.black-bar{
width: 100%;
height: 20px;
background-color: var(--black);
display: none;
} 
.btn-language{
padding: 4px;
border-style: none;
background-color: transparent;
border-radius: 50% ;
position: absolute;
top: 15px;
right: 60px;
border: 2px solid white;
}
.btn-language a{
color:white;
font-weight: bold;
text-decoration: none;
}
#menu{
width: 100%;
height: 60px;
background-color: var(--black);
top: 0px;
left: 0px;
z-index: 100;
position: fixed;
box-shadow: 6px 6px 12px rgba(0,0,0,.3);
}
.head_adjust{
position: relative;
margin: auto;
width: 100%;
height: auto;
padding: 6px 16px;
}
#btn-menu{
display: none;
}    
.icon-menu{
color: white;
font-size: 2em;
margin: 12px 10px;
cursor: pointer;
position: absolute;
top: 0;
right: 0;
}
#btn-menu:checked ~ #cssnav{
transform: translateX(0%);
}    
#cssnav{
position: absolute;
width: 100%;
height: 100vh;
background-color: white;
top: 60px;
left: 0;
transition: all 0.5s;
transform: translateX(-100%);
overflow-y: auto;
}
/**/

   
/*--todos los ul tienen padding 0 para que no generen espacio adicional a los li*/    

/*---nivel 1----*/  
#menu-arrow{
color: var(--red);        
}
#cssnav ul{
list-style: none;
width: 100%;
padding: 16px;
background-color: transparent;
left: 0;
}
#cssnav ul li{
border-bottom: 1px solid var(--gray);
background-color: transparent;
padding: 12px 0;
padding-left: 10px;
cursor: pointer;
display: flex;
flex-wrap: wrap;
}
#cssnav ul li a{
font-family: 'Steinem';
font-size: 24px;
color: var(--black);
}
#cssnav ul li a:hover{
color: var(--red);
text-decoration: none;
}   
#cssnav ul li:hover ul{
display: block;        
}
#cssnav ul li:hover ul a{
font-size: 16px;
}
 /*cierro el nivel 3   
#cssnav ul li:hover ul li ul{
display: none;        
}*/
/*---nivel 2----*/
#cssnav ul li ul{
display: none;
padding: 0;
margin: 0;
padding-left: 28px;
padding-top: 16px;
}
#cssnav ul li ul li{
background-color:transparent;
border: none;
padding: 0px;
border-bottom: 1px solid var(--cultured);
padding-bottom: 12px
}
#cssnav ul li ul li a{
font-size: 18px !important;
margin-bottom: 0;
display: block;
font-family: 'Open Sans';
}
#cssnav ul li ul li a:hover{
font-size: 18px;
margin-bottom: 0;
display: block;
font-family: 'Open Sans';
} 

/*---nivel 3----*/    
#cssnav ul li ul li ul{
padding: 0;
}
#cssnav ul li ul li ul li{
background-color:transparent;
border-bottom: none;
padding: 5px 15px;
}
#cssnav ul li ul li ul li:first-child{
padding-top: 0;
}    

/*----------------------------------------*/
/*------------SECTIONS GENERAL------------*/
/*----------------------------------------*/
.section-standar{
width: 100%;
height: auto;
min-height: 300px;
padding: 120px 16px 60px;
}
.section-title{
font-size: 42px;
text-align: center;
}    
/*----------------------------------------*/
/*------------SECTION SLIDER-----------*/
/*----------------------------------------*/
.index-slider{
background-color: var(--black);
height: 360px;
padding: 0 16px;
padding-top:60px; 
position: relative;

}
/* Slideshow container */
.slideshow-container {
 width: 100%;
 position: absolute;
 margin: auto;
left: 0;
top: 0;
height: 100%;
}

/* Hide the images by default */
.mySlides {
display: none;
height: 100%;
animation-duration: 10s;
}
#slide-1, #slide-2, #slide-3, #slide-4, #slide-5{
background-origin: content-box;
background-repeat: no-repeat;
background-position: center top;
background-size: cover;    
}
#slide-1{
background-image: url(../img/slider-cebu-1.jpg);
}
#slide-2{
background-image: url(../img/slider-cafe-2.jpg);
}
#slide-3{
background-image: url(../img/slider-cerdo-3.jpg);
}
#slide-4{
background-image: url(../img/slider-mariscos-4.jpg);
}
#slide-5{
background-image: url(../img/slider-maiz-5.jpg);
}

/* Caption text */
.slider-text {
padding: 16px 28px;
position: absolute;
bottom: 60px;
width: 100%;
height: auto;
background-color: rgb(0,0,0,.8);
}
.slider-text p{
font-size: 36px;
color: var(--orange);
font-family: 'Steinem';
text-align: left;
line-height: 36px;
}
/*----------------------------------------*/
/*------------SECTION Bienvenida-----------*/
/*----------------------------------------*/
.bienvenida-box{
width: 100%;
height: auto;
background-color: var(--orange);
padding: 16px;
box-shadow: 0 8px 15px rgba(0,0,0,0.3) inset;
} 
.deco-vaquilla{
width: 100%;
max-width: 440px;
margin: auto;
display: flex;
align-items: center;

}
.linea-deco{
background-color: white;
width: 39.65%;
height: 2px;
}
.vaquilla-box{
width: 20.7%;
height: 100%;
padding:2%; 
}
.vaquilla-box img{
width: 100%;        
}
.bienvenida-box h2, .bienvenida-box p{
text-align: center;
color: white;
}
/*----------------------------------------*/
/*------------SECTION ACERCA DE-----------*/
/*----------------------------------------*/
.section-acerca{
background-image: url(../img/acerca.jpg);
background-origin: border-box;
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
}    
#section-title-acerca{
color: white;
}
#deco-vaquilla-acerca{
width: 200px;
margin-bottom: 70px;
}   
.historia{
width: 100%;
height: auto;
margin-bottom: 60px
}
.historia h2, .negocio-box h2{
color: white;
margin-bottom: 18px;
}    
.historia p, .negocio-box p{
color: white;        
}   
.historia ul{
width: 90%;
position: relative;
left: 32px;
}
.historia ul li{
color: white;
text-align: left;
margin-bottom: 16px;
}
/*----------------------------------------*/
/*-----SECTION  INDEX PRODUCTOS-----------*/
/*----------------------------------------*/    
#section-title-productos{
color: var(--blue);
font-size: 52px;
} 
#deco-vaquilla-productos{
width: 60%;
margin-bottom: 50px;
}
#linea-deco-orange{
background-color: var(--orange);        
}    
.prod-tipo-box{
position: relative;
width: 200px;
height: auto;
margin: auto;
margin-bottom: 48px;
}    
.prod-item-box{
width: 200px;
height: 200px;
border: 5px solid var(--cultured);
border-radius: 50%;
box-shadow: 5px 5px 7px rgba(0,0,0,.2);
margin-bottom: 20px;

}
.prod-item-box a{
display: block;
width: 100%;
height: 100%;
}
.prod-item-box:hover{
transition: .2s;
box-shadow: 15px 15px 17px rgba(0,0,0,.2);
border-color: rgba(207,207,207,.5);
}    
.prod-img-box{
margin: auto;
width: auto
}    
#prod-tipo-vacuno{
padding-top: 37px;        
}
#prod-img-vacuno{
width: 130px;
}
#prod-tipo-porcino{
padding-top: 40px;        
}
#prod-img-porcino{
width: 130px;
}
#prod-tipo-marino{
padding-top: 38px;       
}
#prod-img-marino{
width: 100px;
}
#prod-tipo-semilla{
padding-top: 40px;       
}
#prod-img-semilla{
width: 45px;
}
.prod-tipo-box h3{
text-align: center;
font-size: 28px;
font-family: 'Open Sans';
font-weight: 600;
color: var(--black);
margin-bottom: 16px;
}
.prod-tipo-box p{
text-align: center; 
color: var(--black);
}

/*BOTON PARA BAJAR EL BROCHURE*/
.box-brochure-link{
padding: 24px 0;
margin: auto;
width: 280px;
}
.btn-download{
width: 280px    ;
padding: 16px 24px 16px 48px;
border: none;
background-color: #3f3f3f;
margin: auto;
border-radius: 48px;
cursor: pointer;
box-shadow: 8px 8px 17px rgba(0,0,0,.2);
background-image: url(../img/icon-pdf.png);
background-repeat: no-repeat;
background-position: left 24px center;
} 
.btn-download:hover{
    box-shadow: 4px 4px 10px rgba(0,0,0,.4);
background-color: #f44336;
transition:  .5s;

}
.btn-download a{
font-size: 18px;
color: white; 
text-decoration: none;
text-align: right;   
display: block;
} 
/*----------------------------------------*/
/*------------SECTION SERVICIOS-----------*/
/*----------------------------------------*/    
.section-servicios{
background-color: var(--red);        
}    
.section-servicios p{
color: white;        
}   
/*----------------------------------------*/
/*------------SECTION CERDITO-----------*/
/*----------------------------------------*/
#section-cerdito{
padding-top: 0;
padding-bottom: 30px;
min-height: 100px;
}
.imagen-cerdito{
width: 250px;
margin: auto;
position: relative;
top: -50px
}   
.imagen-cerdito  img{
width: 100%;        
}
/*----------------------------------------*/
/*------------------FOOTER-----------------*/
/*----------------------------------------*/    
#section-footer-contacto{
background-color: var(--orange);
border-top: 5px solid var(--gray);
padding: 0;
margin: 0;
min-height: auto;
padding: 30px 16px;
}  
#section-footer-creditos{
background-color: var(--black); 
min-height: auto;
padding: 0;
margin: 0;
padding: 24px 16px 30px;    
}
.logo-footer-box{
margin: auto;
width: 210px;
margin-bottom: 30px;
}
.contacto-footer-box p{
color: white;
font-size: 18px;
text-align: left;
font-weight: 600;
margin-bottom: 6px;
}
.contacto-footer-box a{
display: block;
font-weight: 600;
font-size: 18px;
color: white;
text-decoration: underline;
margin-bottom: 8px;

}
.txt-legal-box{
margin-bottom: 30px;        
}
.txt-legal-box p{
color: white;
text-align: center;
margin-bottom: 8px;
}    
.txt-legal-box a{
color: white;
text-decoration: underline;
display: block;
margin-bottom: 8px;
text-align: center
}    
/*semiotica*/
.semiotica-box{
width: 130px;
height: 30px;
display: flex;
flex-flow: wrap;
justify-content: space-between;
margin: auto;
}
.semiotica-icon-box{
width: 30px;
height: 30px;
}
.semiotica-icon-box img{
width: 100%;
height: 100%;
}
.semiotica-link-box{
width: 90px;
padding-top: 0px;
}
.semiotica-link-box p{
text-align: right;
font: 10px arial, sans-serif;
color: #a5a5a5;
margin-bottom: 3px;
}
.semiotica-link-box a{
font: 16px arial, sans-serif;
display:block;
text-decoration: none;
color: #a5a5a5;

}
.semiotica-link-box a:hover{
color: #ff7f00;    
}
/*-----social---*/    
.social-box{
width: 70%;
display: flex;
justify-content: space-between;
align-items: baseline;
}
.social-box a, #modal-btn-ventas-footer{
text-decoration: none;
font-size: 28px;
}
.social-box a:hover, #modal-btn-ventas-footer:hover{
color: var(--blue);
transition: .2s;
}
/*----------------------------------------*/
/*------------HOJA DE PRODUCTOS-----------*/
/*----------------------------------------*/
/*------CARD DE PRODUCTOS-----*/    
.card_4_box{
width: 100%;
height: auto;
max-width: 380px;
box-shadow: 8px 8px 15px rgba(0,0,0,0.2);
border-radius: 7px;
margin: auto;
margin-bottom: 30px;
}
.card_4_box:hover{
box-shadow: 8px 8px 15px rgba(0,0,0,0.3);    
}
/*--*/
.card_4_img_box{
width: 100%;
height: 21.94%;
position: relative;
border-radius: 7px 7px 0 0;
}
.card_4_img_box img{
width: 100%;
border-radius: 7px 7px 0 0;
}
.card_4_overlay{
position: absolute;
top: 0;
width: 100%;
height: 99%;
background-color: rgba(0,0,0,.5);
border-radius: 7px 7px 0 0;
opacity: 0;
}
.card_4_overlay:hover{
opacity: 1;
transition: .3s;
}
.card_4_overlay a{
position: absolute;
top: 0;
width: 100%;
height: 100%;
padding: 25% 40%;   
} 
/*--*/
.card_4_txt_box{
position: relative;
width: 100;
padding: 30px 20px 30px 20px;
height: 150px;
}
.card_4_txt_box p{
padding: 0;
margin: 0;
font-family: 'Steinem';
color: var(--red)
}
#card_4_minitxt{
display: inline-block;
font-size: .875em;
}    
#card_4_title{
padding: 8px 0;
font-size: 28px;
display: block;
font-family: 'Open Sans';
color: var(--black);
line-height: 1.125em;
}
#card_4_title:hover{
color: var(--blue);
text-decoration: none;
}      
/*------SECTION-----*/    
.section-contenido-productos{
padding: 30px 16px;
margin:0;

}  
.prod-imagen-sec-box{
width: 100%;
height: 100px;
background-image: url(../img/producto-header-bovino.jpg);
background-origin: content-box;
background-position: left top;
background-repeat: repeat;
background-size: cover;
position: relative;
}    
.prod-ide-tipo{
width: 100%;
height: 120px;
padding: 10px 0;
box-shadow: 0px 5px 12px rgba(0,0,0,.2)
}
.prod-ide-tipo h2{
text-align: center;
color: white;
font-size: 32px;
}
#deco-vaquilla-producto-bovino, #deco-vaquilla-producto-porcino, #deco-vaquilla-producto-marino, #deco-vaquilla-producto-semilla{
width: 50%;        
}
/*---bovino---*/
/*------------*/
#prod-ide-tipo-bovino{
background-color: var(--red);        
}
#prod-ide-tipo-bovino h2{
 font-size: 32px;       
}
/*animacion*/
.prod-ide-tipo{
animation-delay: 1s;        
}
.card_4_box{
animation-delay: 2s;    
animation-duration: 2s;        
}
/*card de producto*/    
    
/*---porcino---*/
/*------------*/
#prod-ide-tipo-porcino{
background-color: var(--orange);        
}
#prod-imagen-sec-box-porcinos{
background-image: url(../img/producto-header-porcino.jpg);
}    
/*---marino---*/
/*------------*/
#prod-ide-tipo-marino{
background-color: var(--blue);        
}
#prod-imagen-sec-box-marinos{
background-image: url(../img/producto-header-marino.jpg);
}     
/*---semillas---*/
/*------------*/
#prod-ide-tipo-semilla{
background-color: var(--black);        
}
#prod-imagen-sec-box-semillas{
background-image: url(../img/producto-header-semilla.jpg);
}         
    
/*----------------------------------------*/
/*----------SINGLE DE PRODUCTOS-----------*/
/*----------------------------------------*/    
.section-contenido-single-pro{
padding: 0;
padding: 30px 16px 30px 16px;
}   
.contenido-single-box{
position: relative;
margin: auto;
width: 100%;
height: auto;
display: flex;
justify-content: space-around;
flex-wrap: wrap;
align-items: flex-start;
}    
.contenido-single-img-box{
width: 100%;
}    
.contenido-single-img-box img{
width: 100%;
border-radius: 8px;
box-shadow: 5px 5px 5px rgba(0,0,0,0.1);
margin-bottom: 24px;

}    
.contenido-single-img-linea-deco{
width: 70%;
height: 2px;
background-color: var(--gray);
margin: auto;
margin-bottom: 32px;
}
.contenido-single-desc-box{
width: 100%;
height: auto;
}
.contenido-single-desc-box h2{
color: var(--red);
font-size: 32px;
margin-bottom: 32px;
}
}
#contenido-single-desc-box-porcino h2{
color: var(--orange) !important;
}
.single-desc-subtitle{
padding: 0 8px;
border-bottom: 1px solid var(--black);
margin-bottom: 30px;
}
.single-desc-subtitle p{
margin-bottom: 10px;
font-weight: 600;
font-size: 18px
}
.contenido-single-desc-box ul{
position: relative;
left: 24px;
margin-bottom: 60px;
}
.contenido-single-desc-box ul li{
margin-bottom: 12px;        
}
.info-adicional{
text-align: right;
margin-bottom: 8px;
}  
.contenido-single-desc-box a{
text-align: right;
display: block;
text-decoration: underline;
}
.modal-link-ventas-single{
color: var(--blue)  !important  ;    
 }    
/*----------------------------------------*/
/*---------------CONTACTO-----------------*/
/*----------------------------------------*/    
.section-contacto{
padding-top: 48px  ;      
}
.section-contacto h4{
color: var(--black);
margin-bottom: 16px;
}
.header-de-contacto{
width: 100%;
height: 150px;
background-image: url(../img/contacto-header.jpg);
background-origin: border-box;
background-position: left top;
background-repeat: no-repeat;
background-size: cover;
box-shadow: 5px 5px 15px rgba(0,0,0,.3);
}
.header-de-contacto h2{
text-align: center;
color: white;
padding-top: 90px;
font-size: 42px;
text-shadow: 5px 5px 5px rgba(0,0,0,.5);
font-weight: 300;
}
.contact-link-prod{
color: var(--blue) !important;
font-weight: 600;
font-size: 16px !important;
margin-bottom: 20px;
display: block;
text-decoration: underline;
}
.linea-deco-contacto{
height: 3px;
width: 50%;
background-color: var(--gray);
margin-bottom: 30px
}
.contact-creditos{
font-weight: 600;
font-size: 18px;
margin-bottom: 8px;
}
.txt-credito{
font-size: 14px;
margin-bottom: 12px;
}
.section-contacto ul{
left: 30px;        
}
.section-contacto ul li{
margin: 0;
margin-bottom: 6px;
font-size: 12px;
font-style: oblique;
}
.btn-ventas-footer{
font-size: 16px !important;
color: var(--red)!important;

}   
/*CORREO ENVIADO*/
    
.imagen-enviado-box{
width: 180px;
margin: auto;
margin-bottom: 18px;
}    
.imagen-enviado-box img{
width: 100%;        
}    
.todo-listo{
text-align: center;
display: block;
width: 100%;
color: var(--black);
font-size: 36px;
margin-bottom: 16px;
}  
.al-principio{
font-family: 'Steinem';
text-align: center;
display: block;
width: 100%;
font-weight: 300;
font-size: 24px;
color: var(--black);
}
/*---animacion---*/    
    
/*----------------------------------------*/
/*---------HOJA--ACERCA DE NOSOTROS-------*/
/*---esta seccion hereda css del index en la seccion de acerca de----*/
#section-about{
background: none;        
}    
#deco-vaquilla-about{
width: 70% ; 
margin-bottom: 30px
}
#linea-deco-blue{
background-color: var(--blue);        
} 
#section-title-about{
color: var(--blue);        
}  
#historia-about h2, #historia-about p, #historia-about li, #negocio-about-box h2, #negocio-about-box p{
color: var(--blue) !important;        
}
/*animacion*/    
#deco-vaquilla-about{
animation-delay: 1s;        
}
#historia-about{
animation-delay: 2s;        
}    
#negocio-about-box{
animation-delay: 3s;        
}  
/*----------------------------------------*/
/*---------HOJA--SERVICIOS-------*/
/*---esta seccion hereda css del index en la seccion de servicios----*/
#section-servicios-servicios{
background: none; 
padding-bottom: 90px !important;
}    
#section-servicios-servicios h2, #section-servicios-servicios p{
color: var(--red);        
}  
#deco-vaquilla-servicios{
width: 50% ;
margin-bottom: 30px;
}
#linea-deco-servicios{
background-color: var(--red) ;       
} 
#section-cerdito-servicios{
background-color: var(--red);
padding: 0;
margin: 0;
min-height: auto;
}
#imagen-cerdito-servicios{
top: -80px;        
}
/*---animacion----*/
#deco-vaquilla-servicios{
animation-delay: 1s;        
}  
#section-servicios-servicios p{
animation-delay: 2s;        
}    
#imagen-cerdito-servicios{
animation-delay: 3s;        
}    
/*----------*/    

@media(min-width:600px){
/*----------------------------------------*/
/*------------ESTILOS GENERALES-----------*/
/*----------------------------------------*/
/*-------POLITICA DE PRIVACIDAD----*/    
.section-privacidad {
padding-top: 100px !important;        
}   

/*------------MODAL-------------*/    
#my-modal-ventas-footer{
height: 100vh;

}

.modal-box{
height: 80vh;
overflow-y: auto;
padding: 20px;
padding-bottom: 24px;
}   

#contact-title{
padding-bottom: 10px;
border-bottom: none;
margin-bottom: 10px;
}
.form{
margin: 0;
padding-bottom: 24px;
}
#modal-btn-ventas-footer{
font-size: 14px;

}
/*----------------------------------------*/
/*------------SECTIONS GENERAL-----------*/
/*----------------------------------------*/
.section-standar{
padding-left: 5%;
padding-right: 5%; 
padding-top: 60px;
}
/*----------------------------------------*/
/*------------SECTION SLIDER-----------*/
/*----------------------------------------*/
.index-slider{
height: 264px;
}
/* Caption text */
.slider-text {
bottom: 50px;
}

/*----------------------------------------*/
/*------------SECTION PRODUCTOS-----------*/
/*----------------------------------------*/    
#section-title-productos{
font-size: 48px;
} 
#deco-vaquilla-productos{
width: 30%;
}
.productos-txt-box{
display: flex;
flex-wrap:nowrap;
justify-content: space-between;
position: relative;
align-items: flex-start
}    
.prod-tipo-box{
width: 23%;
height: 100%;
padding: 0;
margin: 0;
}    
.prod-item-box{
width: 100%;
height: 130px;
margin-bottom: 0;
margin-bottom: 12px
}  
.prod-img-box{
margin: auto;
width: 80px;
height: 80px;
padding: 0;
}    
#prod-tipo-vacuno{
padding-top: 28px;
 
}
#prod-img-vacuno{
width: 80px;
}
#prod-img-vacuno img, #prod-img-porcino img{
width: 100%;
}
#prod-img-marino img, #prod-img-semilla img{
height: 100%;
}
#prod-tipo-porcino{
padding-top: 28px;        
}
#prod-img-porcino{
width: 80px;
}
#prod-tipo-marino{
padding-top: 24px;       
}
#prod-img-marino{
width: 65px;
}
#prod-tipo-semilla{
padding-top: 24px;       
}
#prod-img-semilla{
width: 34px;
}    
.prod-tipo-box h3{
font-size: 24px ;      
}
/*------animations-----*/    
#prod-animation-2{
animation-delay: .5s;        
}    
#prod-animation-3{
animation-delay: 1s;        
} 
#prod-animation-4{
animation-delay: 1.5s;        
} 
/*----------------------------------------*/
/*-----------------FOOTER-----------------*/
/*----------------------------------------*/
#section-footer-contacto{
display: flex;
justify-content: space-between;
align-items: flex-end;
}    
.logo-footer-box{
width: 180px; 
margin: 0;
padding: 0;
} 
.logo-footer-box img{
width: 100%;        
}
.contacto-footer-box p{
font-size: 16px;       
}
.contacto-footer-box a{
font-size: 14px;       
}
    
#section-footer-creditos{
margin: 0;
padding: 16px;
padding-bottom: 30px;
display: flex;
justify-content: space-between;
align-items: center;
}
.txt-legal-box{
display: flex;
flex-wrap: wrap;
width: 60%;
justify-content: flex-start;
margin-bottom: 0;
}
.txt-legal-box p, .txt-legal-box a{
font-size: 14px;
margin-right: 10px;
margin-bottom: 6px;
}    
.semiotica-box{
margin: 0 20px ;        
} 
/*-----social---*/    
.social-box a, #modal-btn-ventas-footer{
font-size: 24px;
}

/*----------------------------------------*/
/*------------HOJA DE PRODUCTOS-----------*/
/*----------------------------------------*/
.section-contenido-productos{
display: flex;
justify-content: space-evenly;
align-items: flex-start;
flex-wrap: wrap;
} 

.prod-imagen-sec-box{
height: 110px;
}    
.prod-imagen-sec-box h2{
font-size: 42px;
}   
.prod-ide-tipo{
height: 85px;

}
 #card-prod-bovino, #card-prod-porcino, #card-prod-marino, #card-prod-semilla{
width: 45%;        
}   
/*Bovinos*/
#deco-vaquilla-producto-bovino, #deco-vaquilla-producto-porcino, #deco-vaquilla-producto-marino, #deco-vaquilla-producto-semilla{
width: 20%;        
}
/*----------------------------------------*/
/*----------SINGLE DE PRODUCTOS-----------*/
/*----------------------------------------*/    
.section-contenido-single-pro{
padding: 30px 24px 60px 24px;
}   
  
.contenido-single-img-box{
width: 70%;
margin: auto;
}
/*----------------------------------------*/
/*---------HOJA--ACERCA DE NOSOTROS-------*/
/*---esta seccion hereda css del index en la seccion de acerca de----*/
#section-about{
padding-top: 90px;        
}
#deco-vaquilla-about{
width: 40%;        
}
/*---------HOJA--SERVICIOS-------*/
/*---esta seccion hereda css del index en la seccion de servicios----*/
#section-servicios-servicios{
padding-top: 100px;
}    
/*---*/      
}
@media(min-width:700px){
/*----------------------------------------*/
/*------------ESTILOS GENERALES-----------*/
/*----------------------------------------*/

/*----------------------------------------*/
/*------------SECTIONS CONTACTO-----------*/
/*----------------------------------------*/
.section-contacto-enviado{
padding-top: 80px;        
}
 
/*----------------------------------------*/
/*------------SECTION ACERCA DE-----------*/
/*----------------------------------------*/

.acerca-txt-box{
display: flex;  
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;        
}    
#acerca-de-title{
width: 100%;
}
#deco-vaquilla-acerca{
width: 100%;
padding: 0 12%;
}   
.historia, .negocio-box{
width: 48%;
margin-bottom: 0;
}
.historia h2, .negocio-box h2{
color: white;
margin-bottom: 18px;
}    
.historia p, .negocio-box p{
color: white;        
}   
.historia ul{
width: 90%;
position: relative;
left: 32px;
}
.historia ul li{
color: white;
text-align: left;
margin-bottom: 16px;
}
/*----------------------------------------*/
/*------------SECTION PRODUCTOS-----------*/
/*----------------------------------------*/    
/*------CARD DE PRODUCTOS-----*/    
.card_4_box{
max-width: 280px;
margin-left: 10px;
margin-right: 10px;
}
/*--*/  
#card_4_title{
font-size: 24px;
line-height: 1.125em;
} 

/*nuevo padding*/    
#prod-tipo-porcino{
padding-top: 28px;        
}
#prod-img-porcino{
width: 80px;
}
#prod-tipo-marino{
padding-top: 24px;       
}
#prod-img-marino{
width: 65px;
}
#prod-tipo-semilla{
padding-top: 24px;       
}
#prod-img-semilla{
width: 34px;
}    
/*----------------------------------------*/
/*---------HOJA--ACERCA DE NOSOTROS-------*/
/*---esta seccion hereda css del index en la seccion de acerca de----*/
#section-about{
padding-top: 100px;

}
#deco-vaquilla-about{
width: 40%;        
} 
#historia-about, #negocio-about-box{
width: 80% ;
margin: auto;
} 
#historia-about{
margin-bottom: 48px;        
}
#historia-about h2, #negocio-about-box h2{
text-align: center       
} 
/*---*/      
}
@media(min-width:1020px){
/*----------------------------------------*/
/*------------ESTILOS GENERALES-----------*/
/*----------------------------------------*/
h1{
font-size: 3em;
line-height: 1.05em;

}
h2{
font-size: 2.25em;
line-height: 1.25em;

}
h3{
font-size: 1.75em;
line-height: 1.25em;

}
h4{
font-size: 1.125em;
line-height: 1.22222222em;

}
/*-------POLITICA DE PRIVACIDAD----*/    
.section-privacidad {
padding-top: 150px !important;        
}
/*-------MODAL------*/ 
#my-modal-ventas-footer {
height: 90vh;
top: 60px;
overflow: hidden;
}    
.modal-box{
width: 60%; 
height: 95%;
padding: 0;
}    

#contact-title{
font-size: 14px  ;      
}    
#modal-btn-ventas-footer{
font-size: 16px;
padding-left: 0;
} 
/*-----menu principal----*/
.head_adjust{
    position: relative;
    min-width: 1020px;
    max-width: 100%;
    height: 100px;
    margin: auto;
    top: 0px;
    padding: 0 24px;
    background-color: transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    }
/*Linea negra superior*/    
.black-bar{
display: block;
}    
/*cambio de logo*/
#logo-movil{
display: none;        
}
#logo-desk{
display: block;  
background-color: transparent;
width: 300px;
height: 60px;
position: relative;
top: -8px;
}
#logo-desk img{
width: 100%;    
}
.btn-language{
position: relative;
top: 0;
right: 0px;
border: 2px solid #3f3f3f;
}
.btn-language:hover{
cursor: pointer;    
border: 2px solid #f44336;
transition: .2s;;
}
.btn-language a{
color:#3f3f3f;
}
.btn-language a:hover{
color:#f44336;
transition: .2s;;
}

/**/  
#menu{
height: 100px;
background-color: white;
position: relative; 
position: fixed;
}    

.icon-menu{
display: none;        
}
/**/    
#cssnav{
overflow: initial;
position: relative;
width: 560px;
height: 40px;
top: 6px;
transform: none;
padding: 0;
background-color: transparent;
left: 24px;
}   

/*---nivel 1----*/ 
#menu-arrow{
display: none;     
}
#cssnav ul{
display: flex;
justify-content: flex-end; 
padding: 0;
position: relative;
}
#cssnav ul li{
padding: 0px 18px;
border: none;
position: relative;

}  
#cssnav ul li a{
font-size: 1.125em;
} 
#cssnav ul li:hover{
border: none;        
}
/*---nivel 2----*/
#cssnav ul li ul{
padding: 24px 16px;
padding-bottom: 0;
background-color: white;
position: absolute;
top: 20px;
width: 160px;
border-radius: 0 0 7px 7px;
box-shadow: 1px 24px 20px rgba(0,0,0,.3);
}
#cssnav ul li ul li{
background-color:transparent;
border: none;
padding: 0px;
border-bottom: 1px solid var(--cultured);
padding-bottom: 0;
margin-bottom: 16px;
}
#cssnav ul li ul li:hover{
border-bottom: 1px solid var(--red);        
}
#cssnav ul li ul li a{
font-size: 14px !important;
text-align: left;
color: var(--black);
}

    
/*---nivel 3----*/    
#cssnav ul li ul li ul{  
position: relative;
left: 100px;
top: -40px;
}
    
/*----------------------------------------*/
/*------------SECTIONS GENERAL-----------*/
/*----------------------------------------*/
.section-standar{
padding-top: 120px;
padding-bottom: 120px;
}
.section-title{
 font-size: 60px;       
}    
    
/*----------------------------------------*/
/*------------SECTION SLIDER-----------*/
/*----------------------------------------*/
.index-slider{
height: 430px;
margin-top: 100px;
}

/* Caption text */
.slider-text {
padding: 24px 9%;
bottom: 90px;
}
.slider-text p{
font-size: 3em;
line-height: 42px;
margin-bottom: 0
}
/*----------------------------------------*/
/*------------SECTION BIENVENIDA----------*/
/*----------------------------------------*/ 
.bienvenida-box{
padding-right: 20%;
padding-left: 20%;
} 
/*----------------------------------------*/
/*----------------------------------------*/
/*------------SECTION ACERCA DE-----------*/
/*----------------------------------------*/
    
#deco-vaquilla-acerca{
padding: 8px 2.5%        
}  
.historia p, .historia ul li, .negocio-box p{
font-size: 14px;    
}    
/*----------------------------------------*/
/*------------SECTION PRODUCTOS-----------*/
/*----------------------------------------*/    
.section-contenido-productos{
padding-top: 50px;        
}    
.prod-item-box{
height: 210px;
}  
.prod-img-box{
width: 210px;
height: 120px;
padding: 0;
}  

/*nuevo padding y ancho | se maneja la alineacion horizontal con margin auto y la vertical con padding-top*/
#prod-tipo-vacuno, #prod-tipo-porcino, #prod-tipo-marino, #prod-tipo-semilla{
padding-top: 48px;        
}
/*se ajusta la caja de cada elemento al ancho de la imagen para que quede en el centro*/
#prod-img-vacuno, #prod-img-porcino{
width: 120px;
    }
#prod-img-marino{
width: 100px;
}
#prod-img-semilla{
width: 48px;
}    
.prod-tipo-box h3{
font-size: 28px ;      
}
/*----------------------------------------*/
/*------------SECTION SERVICIOS-----------*/
/*----------------------------------------*/
#section-servicios p{
max-width: 60%;
margin: auto;
}    
/*----------------------------------------*/
/*------------SECTION CERDITO-----------*/
/*----------------------------------------*/

.imagen-cerdito{
width: 360px;
top: -80px;
} 
/*----------------------------------------*/
/*------------SECTION FOOTER-----------*/
/*----------------------------------------*/
#section-footer-contacto, #section-footer-creditos{
padding: 20px 5%  ;
    }
.contacto-footer-box p{
font-size: 18px;       
}
.contacto-footer-box a{
font-size: 18px;       
}
.txt-legal-box{
margin: 0;
padding: 0
}    
.txt-legal-box a, .txt-legal-box p{
margin-bottom: 0  ;      
}
/*------social-----*/
.social-box a, #modal-btn-ventas-footer{
font-size: 24px;
}    
    
    
/*----------------------------------------*/
/*------------HOJA DE PRODUCTOS-----------*/
/*----------------------------------------*/
  
.prod-imagen-sec-box, #prod-imagen-sec-box-porcinos{
height: 200px;
}   
.prod-imagen-sec-box h2{

padding-top: 120px;
font-size: 48px;
} 
.prod-ide-tipo{
height: 100px;
}
/*---bovino---*/
#prod-ide-tipo-bovino h2{
 font-size: 42px;       
}    
/*----------------------------------------*/
/*----------SINGLE DE PRODUCTOS-----------*/
/*----------------------------------------*/
.section-contenido-single-pro{
padding-top: 30px !important;
padding-bottom: 30px;
}
.contenido-single-box{
border: 2px solid var(--gray);
padding: 16px;
border-radius: 12px;
}    
.contenido-single-img-box{
width: 40%;
height: 100%;

padding: 0;
margin: 0;
}    
.contenido-single-desc-box{
width: 55% ;
height: 100%
}  
/*----------------------------------------*/
/*---------------CONTACTO-----------------*/
/*----------------------------------------*/ 
.header-de-contacto{
height: 200px;        
}
.header-de-contacto h2{
padding-top: 120px;        
}
.section-contacto{
padding-top: 60px;
padding-bottom: 60px;
}
 /*---FORMULARIO ENVIADO----*/   
.section-contacto-enviado{
padding-top: 150px !important; 

}
     
    
/*----------------------------------------*/
/*---------HOJA--ACERCA DE NOSOTROS-------*/
/*---esta seccion hereda css del index en la seccion de acerca de----*/
#section-about{
padding-top: 150px;
}
#historia-about p, #negocio-about-box p{
font-size: 16px;      
}
/*----------------------------------------*/
/*---------HOJA--SERVICIOS-------*/
/*---esta seccion hereda css del index en la seccion de servicios----*/
#section-about{
background: none;        
}    
#deco-vaquilla-about{
width: 70% ; 
margin-bottom: 30px
}
#linea-deco-blue{
background-color: var(--blue);        
} 
#section-title-about{
color: var(--blue);        
}  
#historia-about h2, #historia-about p, #historia-about li, #negocio-about-box h2, #negocio-about-box p{
color: var(--blue) !important;        
}
/*animacion*/    
#deco-vaquilla-about{
animation-delay: 1s;        
}
#historia-about{
animation-delay: 2s;        
}    
#negocio-about-box{
animation-delay: 3s;        
}  
/*----------------------------------------*/
/*---------HOJA--SERVICIOS-------*/
/*---esta seccion hereda css del index en la seccion de servicios----*/
#section-servicios-servicios{
padding-top: 130px;
padding-bottom: 140px !important;
}      
#deco-vaquilla-servicios{
width: 25% ;
margin-bottom: 30px;
}

#section-cerdito-servicios{
height: 210px;
}
#imagen-cerdito-servicios{
top: -130px;        
}    
    
    
/*---*/    
}
@media(min-width:1280px){
/*-------VENTANA MODAL-------*/    
/*---MODAL----*/   

.modal-box{
width: 60%; 
height: 95%;
padding: 0;
} 
/*----------------------------------------*/
/*-------------Menu PRINCIPAL------------*/
/*----------------------------------------*/
#cssnav{
width: 800px;
}

#cssnav ul li{
padding: 0px 24px;
     
} 
/*----------------------------------------*/
/*------------ESTILOS GENERALES-----------*/
/*----------------------------------------*/
/*---POLITICA DE PRIVACIDAD---*/
.section-privacidad {
padding-top: 150px !important;
padding-right: 15%;
padding-left: 15%;
}
/*----------------------------------------*/
/*----------------INDEX.PHP---------------*/
/*----------------------------------------*/

/*BOTON PARA BAJAR EL BROCHURE*/
.box-brochure-link{
padding-top: 60px;
}


/*----------------------------------------*/
/*------------SECTION PRODUCTOS-----------*/
/*----------------------------------------*/    
#section-title-productos{
font-size: 60px;        
}
.prod-item-box{
height: 210px;
width: 210px;
margin: auto;
margin-bottom: 16px;
}  
.prod-img-box{
width: 120px;
height: 120px;
padding: 0;  
}  
#deco-vaquilla-productos{
padding: 8px 2.5%         
}
/*----------------------------------------*/
/*------------SECTION CERDITO-----------*/
/*----------------------------------------*/

.imagen-cerdito{
width: 410px;
}
/*----------------------------------------*/
/*------------HOJA DE PRODUCTOS-----------*/
/*----------------------------------------*/  
.prod-ide-tipo{
height: 110px;
}
/*Bovinos*/
#deco-vaquilla-producto-bovino{
width: 15%;        
}    
.contenido-single-desc-box h2{
font-size: 36px;
margin-bottom: 24px;
} 
.txt-intro-bovinos{
width: 100%;
padding: 0 10% 0 10%;
margin: auto;
margin-bottom: 30px;
    }



/*----------------------------------------*/
/*---------HOJA--ACERCA DE NOSOTROS-------*/
/*---esta seccion hereda css del index en la seccion de acerca de----*/
#deco-vaquilla-about{
width: 20%;        
}

#historia-about p, #negocio-about-box p{
font-size: 16px;      
}  
/*----------------------------------------*/
/*---------HOJA--SERVICIOS-------*/
/*---esta seccion hereda css del index en la seccion de servicios----*/
#section-servicios-servicios{
padding-top: 130px;
padding-bottom: 170px !important;
}   
#section-servicios-servicios p{
width: 60%;
margin: auto;
font-size: 16px;
}
#deco-vaquilla-servicios{
width: 25% ;
margin-bottom: 30px;
}

#section-cerdito-servicios{
height: 240px;
}
#imagen-cerdito-servicios{
top: -130px;        
}   
/*---*/    
}
@media(min-width:1300px){
 /*----------------------------------------*/
/*-------------Menu PRINCIPAL------------*/
/*----------------------------------------*/
#cssnav{
width: 900px;
}
    
    
/**/
}
@media(min-width:1400px){
    /*----------------------------------------*/
   /*-------------Menu PRINCIPAL------------*/
   /*----------------------------------------*/
   #cssnav{
   width: 950px;
  
   }
       
       
   /**/
   }
   @media(min-width:1600px){
    /*----------------------------------------*/
   /*-------------Menu PRINCIPAL------------*/
   /*----------------------------------------*/
   #cssnav{
   width: 1150px;
   }
       
       
   /**/
   }
   @media(min-width:1700px){
    /*----------------------------------------*/
   /*-------------Menu PRINCIPAL------------*/
   /*----------------------------------------*/
   #cssnav{
   width: 1250px;
   }
       
       
   /**/
   }
   @media(min-width:1900px){
   /*----------------------------------------*/
   /*-------------VENTANA MODAL------------*/
   /*----------------------------------------*/
.modal-box{
padding: 24px;   
}

    /*----------------------------------------*/
   /*-------------Menu PRINCIPAL------------*/
   /*----------------------------------------*/
   #cssnav{
   width: 1400px;
   }
   #cssnav ul li a{
  font-size: 24px;
    }    
  .btn-language{
  width: 40px;
  height: 40px; 
  top: -6px;   
  } 
  .btn-language a{
    font-size: 18px;    
  }    
   /**/
   }