@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@700&display=swap');     /*MENSAJE INICIO*/
@import url('https://fonts.googleapis.com/css2?family=Playfair:ital,opsz,wght@0,5..1200,300..900;1,5..1200,300..900&family=Viaoda+Libre&display=swap');/*NUEVO MENU*/

#banner{
 margin-top: 90px;
 margin: auto;
 position: relative;
}

#banner img{
 width: 100%;
 height: 90%;
 margin: auto;
}

#video .contenedorVideo{        
 width: 90%;
 height: 90%;
 position: absolute;
 top: 180%;
 left: 50%;
 transform: translateX(-50%) translateY(-50%);
 text-align: center;
}

#video .contenedorVideo .margen{ width: 100%; }

#video .contenedorVideo .margen .youtube{ width: 100%; }

#video .contenedorVideo .cuadros{ /*iframe*/
 margin-top: 20px;
 width: 80%;
 height: 80%;
}

#leyenda{ color: white; }

#resenas{
 background: #a5763d; /*#a8926c;*/
 color:white;
 text-align: center;
 padding: 20px;
 margin-top: 46%;
}

#resenas .contenedorRes{
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 margin-top: 10px;  /*espacio con TESTIMONIOS*/
}

.info-pet{ margin: 20px; }

.info-pet h2{ color: #161f16; }

.info-pet h4{
 font-size: 25px;
 letter-spacing: 2px;
 font-family: "Playfair", serif;   /*nombres parejas*/
 font-optical-sizing: auto;
 font-weight: <weight>;
 font-style: normal;
 font-variation-settings: "wdth" 100;
}

.info-pet p{  font-size: 22px; }

.info-pet img{
 width: 200px;
 height: 200px;
}


/**************************RESPONSIVE*********************/

@media(min-width:360px){ /*SAMSUNG GALAXY S8+*/
 #banner img{ margin-top: 80px; width: 110%; margin-left: -12px;}
 #video .contenedorVideo{ top: 92%; }
 #video .contenedorVideo .margen .youtube{ height: 220px; }
 #leyenda .contenedorLeyenda{ margin-top: 75%;  }
 #resenas{ margin-top: 100%;}
}    

@media(min-width:480px){
 #banner img{ height: 100%;}   
 .info-pet{ width: 40%; }
 #banner img{ margin-top: 10%; } 
 #resenas{ margin-top: 90%; }
 footer{ margin-top: 3%; }
 #video .contenedorVideo{ top: 68%; width: 90%; height: 35%; }
 #video .contenedorVideo .margen .youtube{ height: 300px; }
 #leyenda .contenedorLeyenda{ top: 93%; }
 #leyenda .contenedorLeyenda .frase .leyendaP{ size: 5px; }
}/*480*/


@media(min-width:768px){    
 #banner .contenedor{ top: 120%; }
 footer{ margin-top: 3%;}
 #leyenda .contenedorLeyenda{ margin-top: 27%; }
 #resenas{ margin-top: 75%;}
 #video .contenedorVideo{ top: 92%; height: 50%; }  
 #video .contenedorVideo .margen .youtube{ height: 400px; }
}/*768*/


@media(min-width:1024px){
 .info-pet{ width: auto; }
 #banner img{ margin:  auto; }
 #leyenda .contenedorLeyenda{ margin-top: 39%; }
 #video .contenedorVideo{ top: 103%; } 
 #video .contenedorVideo .margen .youtube{ height: 520px; }
 #resenas{ margin-top: 60%;}
}/*1024*/


@media(min-width:1280px){
 #banner .contenedor{ top: 115%; }
 #leyenda .contenedorLeyenda{ margin-top: 54%; }
 #resenas{ margin-top: 60%; }
 #video .contenedorVideo{ width: 90%; height: 75%; position: absolute; top: 133%; } 
 #video .contenedorVideo .margen .youtube{ height: 620px; }
}/*1280*/

@media(min-width:1440px){
 #leyenda .contenedorLeyenda{ margin-top: 65%; }
 #resenas{ margin-top: 53%; }
 #video .contenedorVideo{ width: 90%; height: 75%; position: absolute; top: 163%; } 
}/*1280*/


@media(min-width:1680px){
 #banner .contenedor{ top: 110%; }
 #leyenda .contenedorLeyenda{ margin-top: 71%; }
 #resenas{ margin-top: 60%; }
 #video .contenedorVideo{ top: 163%; }
 #video .contenedorVideo .margen .youtube{ height: 850px; }
}/*1680*/

@media(min-width:1920px){
 #leyenda .contenedorLeyenda{ margin-top: 76%; }
 #resenas{ margin-top: 51%; }
 #video .contenedorVideo{ top: 190%; }
 #video .contenedorVideo .margen .youtube{ height: 850px; border: 1px solid #fff;}
}/*1920*/