@import url('https://fonts.googleapis.com/css2?family=Lora:wght@700&display=swap');
@import url("secciones.css");
@import url("banners.css");
@import url("keyframes.css");
@import url("menu.css");
@import url("formulario.css");
@import url("productos.css");
@import url("servicios.css");
@import url("botones.css");
@import url("clientes.css");
@import url("tabs.css");
@import url("footer.css");
@import url("grids.css");
/*@import url("slyder.css");*/
@import url("imagenes.css");
@import url("video.css");
/* Universal Styles */
:root{
  --ff-body: 'Lora', bold;
  --fs-xl: 2rem;
  --fs-600: 1.25rem;
  --fs-500: 1rem;
  --fs-400: 0.8rem;
  --fs-200: 0.5rem;
  --tam-detalle: 100px;
  --fs-detalle: 1rem;
  --width-logo: 8%;
  --margin-botonera:  90% 0% 10% 0%;
  --color_morado:#4a3f83;
  --color_morado_traslucido:rgb(74, 63, 131, .7);
  --color_rojo: #d72626;
  --color_rojo_traslucido: rgb(215, 38, 38, .7);
  --color_blanco: #FFF;
  --color_hueso: #fdf2e9;
  --color_negro: #17202a;
  --color_negro_traslucido: rgb(23,37,42, .7);
  --color_gris: #808b96;
  --color_gris_traslucido: rgb(128, 139, 150, .7);
}
/*
@media (min-width:40em){}*/
@media screen and (max-width: 1920px){
  :root{
    --fs-xl: 3.5rem;
    --fs-600: 1.5rem;
    --fs-500: 1.25rem;
    --fs-400: 1rem;
    --fs-200: 0.9rem;
    --tam-detalle: 100px;
    --fs-detalle: 0.9rem;
    --width-logo: 8%;
    --margin-botonera:  60% 0% 40% 0%;
    --tamano-div-clientes:80%;
  }
}
@media screen and (max-width: 1280px){
  :root{
    --fs-xl: 3rem;
    --fs-600: 1.25rem;
    --fs-500: 1rem;
    --fs-400: 0.9rem;
    --fs-200: 0.8rem;
    --tam-detalle: 70px;
    --fs-detalle: 0.5rem;
    --width-logo: 10%;
    --margin-botonera:  60% 0% 40% 0%;
    --tamano-div-clientes:80%;
  }
}
@media screen and (max-width: 800px){
  :root{
    --fs-xl: 2rem;
    --fs-600: 1.25rem;
    --fs-500: 1rem;
    --fs-400: 0.8rem;
    --fs-200: 0.5rem;
    --tam-detalle: 50px;
    --fs-detalle: 0.4rem;
    --width-logo: 10%;
    --margin-botonera:  70% 0% 30% 0%;
    --tamano-div-clientes:90%;
  }
}
@media screen and (max-width: 428px){
  :root{
    --fs-xl: 1.5rem;
    --fs-600: 1.25rem;
    --fs-500: 1rem;
    --fs-400: 0.8rem;
    --fs-200: 0.5rem;
    --tam-detalle: 30px;
    --fs-detalle: 0.3rem;
    --width-logo: 15%;
    --margin-botonera:  90% 0% 10% 0%;
    --tamano-div-clientes:100%;
  }
}


*{ margin: 0; padding: 0;}
html, body{ background-color: var(--color_blanco);   font-family: var(--ff-body); font-size: var(--fs-400); width: 100%;  height: 100%; }  
#videoBG {
  position:fixed;
  z-index: -1;
  width:100%;     
  height: auto;
}

.texto-encima{
    position: absolute;
    top: 10px;
    left: 10px;
}
.nombre{
  font-size: var(--fs-400);
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 auto;
}
.referencia{
  font-size: var(--fs-400);
  font-weight: 300;
  margin-top: 5px;
  color: var(--color_gris);
}
  /*
img:hover{
    filter: grayscale(0%);
    filter: blur(5px);
    filter: grayscale(80%);
    filter: sepia(60%);
    filter: saturate(180%);
    filter: opacity(.5);
    .contenedor:hover .imagen {-webkit-transform:scale(1.3);transform:scale(1.3);}
    .contenedor {overflow:hidden;}
}*/