/* ESTILOS GENERALES ------------------------------------------------  */

html {
	scroll-behavior: smooth;
}

*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;	
}


a:link, a:visited, a:active {
	text-decoration:none;
}

p {
	margin-bottom: 0px;
}


/* COLORES CORPORATIVOS ------------------------------------------------  */
:root {
	--color-01: #3399CC; /* cliente */
	--color-02: #d8ad51; /* oro */
	--color-03: #FFCC00; /* mi amarillo */
}





/* FUENTES ------------------------------------------------------------  */
.fuente-01 {
	font-family: 'Oswald', sans-serif;
}
.fuente-02 {
	font-family: 'Shadows Into Light', cursive;
}
.fuente-03 {
	font-family: 'Great Vibes', cursive;
}
.fuente-04 {
	font-family: 'Orbitron', sans-serif;
}




/* TITULOS ------------------------------------------------------------  */
h1 {
	font-size: 30px;
	color: #FFF;
	line-height: 120%;
	font-weight: 100;
}
h2 {
	font-size: 20px;
	color: #FFF;
	line-height: 120%;
	font-weight: 100;
}
h3 {
	font-size: 15px;
	color: #FFF;
	line-height: 120%;
	font-weight: 100;
}




/* COLORES ------------------------------------------------------------  */
.color-01 {
	color: var(--color-01);
}
.color-02 {
	color: var(--color-02);
}
.color-03 {
	color: var(--color-03);
}
.color-blanco {
	color: #FFF;
}
.color-negro {
	color: #000;
}
.color-999 {
	color: #999;
}
.color-666 {
	color: #666;
}
.color-333 {
	color: #333;
}




/* TAMAÑOS ------------------------------------------------------------  */
.tamano-15 {
	font-size: 15;
	line-height: 120%;
}
.tamano-16 {
	font-size: 16;
	line-height: 120%;
}
.tamano-17 {
	font-size: 17;
	line-height: 120%;
}
.tamano-18 {
	font-size: 18;
	line-height: 120%;
}
.tamano-19 {
	font-size: 19;
	line-height: 120%;
}
.tamano-20 {
	font-size: 20px;
	line-height: 120%;
}
.tamano-25 {
	font-size: 25px;
	line-height: 120%;
}
.tamano-30 {
	font-size: 30px;
	line-height: 120%;
}
.tamano-35 {
	font-size: 35px;
	line-height: 120%;
}
.tamano-40 {
	font-size: 40px;
	line-height: 120%;
}
.tamano-45 {
	font-size: 45px;
	line-height: 120%;
}
.tamano-50 {
	font-size: 50px;
	line-height: 120%;
}
.tamano-55 {
	font-size: 55px;
	line-height: 120%;
}
.tamano-60 {
	font-size: 60px;
	line-height: 120%;
}
.tamano-65 {
	font-size: 65px;
	line-height: 120%;
}




/* GROSOR ------------------------------------------------------------  */
.grosor-01 {
	font-weight: lighter;
}
.grosor-02 {
	font-weight: normal;
}
.grosor-03 {
	font-weight: bold;
}






/* FONDOS -----------------------------------------------------------------------------------------  */
.fondo-01 {
	background-color: var(--color-01);
}
.fondo-02 {
	background-color: var(--color-02);
}
.fondo-03 {
	background-color: var(--color-03);
}





/* ESQUINAS ------------------------------------------------------------  */
.imagen-esquinas-redondas {
	border-radius: 5px;
}
.cuadro-esquinas-redondas {
	border: thin solid #CCC;
	border-radius: 10px;
}
.cuadro-esquinas-vivas {
	border: thin solid #CCC;
}






/* FORMULARIOS ------------------------------------------------------------  */
.celda-formulario {
	font-size: 16px;
	line-height: 120%;
	color: #666;
	background-color: #FFF;
	border: 1px solid #CCC;
	border-radius: 3px;
	min-height: 50px;
	padding: 15px;
	width: 100%;
	overflow: hidden;
}




/* ANIMACIONES ------------------------------------------------------------  */
.animacion-esala {
	transition: all 0.5s ease;
}
.animacion-esala:hover {
	transform: scale(1.5);
}




.animacion-transparente {
	transition: all 0.5s ease;
}
.animacion-esala-transparente:hover {
	opacity: 0.5;
}




.animacion-esala-desplazamiento {
	transition: all 0.5s ease;
}
.animacion-esala-desplazamiento:hover {
	transform: translate(100px);
}








/* BOTONES 1 ------------------------------------------------------------  */
.boton-01 {
	font-size: 18px;
	line-height: 120%;
	font-weight:100;
	color: #FFF;
	border-radius: 3px;
	border: none;
	background-color: var(--color-01);
	padding: 10px 30px;
	text-decoration: none;
	cursor: pointer;
	position: relative;
}
.boton-01:hover {
	opacity: 0.8;
	color: #FFF;
	transition: all .5s ease;
}


.boton-02 {
	font-size: 18px;
	line-height: 120%;
	font-weight:100;
	color: var(--color-01);
	border-radius: 3px;
	border: 1px solid var(--color-01);
	background-color: #FFF;
	padding: 10px 30px;
	text-decoration: none;
	cursor: pointer;
	position: relative;
}
.boton-02:hover {
	background-color: var(--color-01);
	color: #FFF;
	transition: all .8s ease;
}



.boton-03 {
	color: #fff !important;
	font-size: 18px;
	font-weight: 100;
	padding: 10px 30px;
	background-color: var(--color-01);
	position: relative;
	border: none;
}
.boton-03:before {
	content:"";
	position: absolute;
	top: 0px;
	left: 0px;
	width: 0px;
	height: 100%;
	background: rgba(255, 255, 255, 0.1);
	transition: all 1s ease;
}
.boton-03:hover:before {
	width: 100%;
}









/* REDIMENSIONAR RECAPCHA DE GOOGLE PARA QUE NO SE SALGA DE LA PANTALLA EN MÓVILES PEQUEÑOS ---------------------  */
.redimensionarrecptcha   {
	transform: scale(0.84);
	transform-origin: 0 0;
   }







/* AJEDREZ ------------------------------------------------------------  */
.showcase .showcase-text {
  padding: 3rem;
}

.showcase .showcase-img {
  min-height: 30rem;
  background-size: cover;
}






/* TEXTO CENTRADO VERTICALMENTE ------------------------------------------------------------  */
.call-to-action {
  position: relative;
  background-color: #343a40;
  background: url("../imagenes/apartados/inicio/cabecera.jpg") no-repeat center center;
  background-size: cover;
  padding-top: 7rem;
  padding-bottom: 7rem;
}

.call-to-action .overlay {
  position: absolute;
  background-color: #212529;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  opacity: 0.3;
}









/* OPACIDAD ------------------------------------------------------------  */
.opacidad img {
  filter:alpha(opacity=50);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  opacity: 0.5;
  }

a.opacidad:hover img {
  filter:alpha(opacity=100);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  opacity: 1.0;
  }

.opacidadfija img {
  filter:alpha(opacity=50);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  opacity: 0.5;
  }



















/* IFRAME RESPONSIVE ------------------------------------------------------------  */
.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.embed-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}



















/* COOKIES ------------------------------------------------------------  */
#barraaceptacion {
    display:none;
    position:fixed;
    left:0px;
    right:0px;
    bottom:0px;
    padding-bottom:20px;
    width:100%;
    text-align:center;
    min-height:40px;
    background-color: rgba(0, 0, 0, 0.5);
    color:#fff;
    z-index:99999;
}
 
.inner {
    width:100%;
    position:absolute;
    padding-left:5px;
    font-family:verdana;
    font-size:12px;
    top:30%;
}
 
.inner a.ok {
    padding:4px;
    color:#00ff2e;
    text-decoration:none;
}
 
.inner a.info {
    padding-left:5px;
    text-decoration:none;
    color:#faff00;
}











/* NECESITAS AYUDA ------------------------------------------------------------  */
#ayuda {
    display:none;
    position:fixed;
    right:0px;
    bottom:0px;
    padding-bottom:20px;
    width:284px;
    text-align:right;
    min-height:40px;
    color:#fff;
    z-index:99999;
}
 
.inner {
    width:100%;
    position:absolute;
    padding-left:5px;
    font-family:verdana;
    font-size:12px;
    top:30%;
}
 
.inner a.ok {
    padding:4px;
    color:#00ff2e;
    text-decoration:none;
}
 
.inner a.info {
    padding-left:5px;
    text-decoration:none;
    color:#faff00;
}