/******* ESTILOS GENERALES ***********/
@font-face {
    font-family: 'libre_baskervilleregular';
    src: url('../fonts/librebaskerville-regular-webfont.eot');
    src: url('../fonts/librebaskerville-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/librebaskerville-regular-webfont.woff2') format('woff2'),
         url('../fonts/librebaskerville-regular-webfont.woff') format('woff'),
         url('../fonts/librebaskerville-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'fjalla_oneregular';
    src: url('../fonts/fjallaone-regular-webfont.eot');
    src: url('../fonts/fjallaone-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/fjallaone-regular-webfont.woff2') format('woff2'),
         url('../fonts/fjallaone-regular-webfont.woff') format('woff'),
         url('../fonts/fjallaone-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}



body{font-size: 18px;font-family: 'libre_baskervilleregular'; font-weight: normal; font-style: normal ;color:black;}
a, a:visited{color:black;}
a:hover{color:#FFD500;}
h1{font-size: 24px; color:#000; margin-bottom: 10px; line-height: 2.4rem}
h2{font-size: 69px;font-family: 'fjalla_oneregular';text-align: right;text-transform: uppercase}
h3{font-family: 'fjalla_oneregular'; color:#FFD500;font-size: 37px;text-transform: uppercase}
.container{width: 88%;margin: 0 auto;}
section{padding: 65px 0; clear: both; min-height: 465px;}

.cta{
    margin-top:60px;
}

.btn{
    color: #000;
    background-color: #eceaea;
    border: none;
    width: auto;
    margin: 0;
    padding: 14px 58px;
    font-family: 'fjalla_oneregular';
    font-size: 32px;
    line-height: 2em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    transition: all 0.3s linear;
}

.btn:hover {
    background-color: #FFD500;
    color: #000;
}

.btn:hover img {
    transform: translateX(8px);
}

.btn-icon {
    transition: all 0.3s linear;
    position: relative;
    padding-left: 1em;
    height: 1em;
}


/******* HEADER ***********/

header{left: 0; top: 0; width: 100%;position: fixed;z-index: 10;display: block;padding: 5px 0;background-color: black;}
header .ico-menu{float: left;background: url(../images/hamburpequeblanca.png);}
header nav{display: none;float: left;clear: both;}
header img{width: 205px;float: right;}
header .blanca{display: block;}
header .negra{display: none;}
header .ico-menu{width: 36px; height: 40px; background: url(../images/hamburpequeblanca.png)}
nav ul{display:block;padding-left: 0;margin-top: 10px;}
nav li{margin: 0 0 5px;}
nav a, nav a:visited {font-family: 'fjalla_oneregular';font-size: 12px; text-decoration: none;color: white;}
nav a:hover{color:#ffec8c;}


/******* INICIO ***********/
h1 span{ position: relative; }
h1 span::before{content: '';position: absolute; width: 100%;background: url(../images/tachon.png) no-repeat 0 center transparent; height: 100%;background-size: 100% auto;}

.inicio{padding: 120px 20px 80px 20px;text-align: center; background-color: #DC0052;}
/* .inicio .bienvenido{font-size: 24px ; color:#FFD500; padding-top: 39px;} */
.inicio .asterisco{font-size: 15px; color: black; font-family:'fjalla_oneregular';padding-top: 79px;}
.hero-img {width: 1081px; max-width: 51%; }
/* .inicio .logo::after{content:'*';font-size: 56px; margin-top: 16px;display: inline-block; vertical-align: top;font-family: 'fjalla_oneregular';} */
.inicio .logo {padding: 40px 0}


/******* BLOQUE ***********/
.bloque .container{display: flex;}
.bloque .menu{width: 10%}
.bloque .titular{width: 25%; padding-right: 65px;}
.bloque .body-copy{width: 45%;}
.bloque .body-copy p{margin:0 0 20px; line-height: 23px;}
.bloque .logo{width: 20%; text-align: center;}
.bloque .logo img{width: 80%; max-width: 150px;}


/******* SECCIONES ***********/
.seccion1 {background: #64B9E4;}
.seccion2 {background: #E7511E;}
.seccion3 {background: #41A62A;}
.seccion4 {background: #CA9E64;}
.seccion5 {background: #7F6B5E;}
.seccion6 {background: #AF9584;}

/******* CONTACTO ***********/
.contacto .body-copy {width:65%;padding-top:20px;}
.contacto {background: #DC0052;}
.contacto .log img{width: 50%; padding-top: 13px;}
.contacto a{font-family: 'fjalla_oneregular';padding-bottom: 5px;text-decoration: none;display:inline-block;}
.contacto .log a:hover img {opacity: 0.6}
.contacto address{font-family: 'libre_baskervilleregular'}
.contacto .links{position: absolute;bottom: 0; padding-right: 20px}
.contacto .log a{width: 19%;margin-right: 20px}
.contacto .titular{position: relative;}
.contacto .links > a{display:block;}

/******* LOGO GRID ***********/
.logo-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  max-width: 100%;
  margin: 0 auto;
  padding: 1rem;
}

.logo-grid img {
  width: 100%;
  height: auto;
  display: block;
  background: #FFFFFF;
  transition: transform 0.2s ease;
}

.logo-grid img:hover {
  transform: scale(1.03);
  cursor: pointer;
}

/* Vista escritorio */
@media (min-width: 768px) {
  .logo-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}


@media (max-width: 1250px) {

	/******* ESTILOS GENERALES ***********/
	.container{width: 93%;}
    h2 {font-size: 50px;}
    h1{font-size: 24px;}
    .btn-icon{display: none}

    .inicio img {width: 80%}
    .bloque .titular{padding-right: 50px}
    .bloque .menu{ width:15%;}
    .bloque .logo{ width: 15%; text-align: right;}	
}


@media (max-width: 1024px) {

    .container {width: 86%;}
    h2 {text-align: left;padding-bottom: 20px}
    h3{padding-bottom: 20px}
    .btn-icon{display: none}
    .btn{font-size: 24px}  

    header{background-color: white; }
    header .container{overflow: hidden;}
    header .ico-menu{float: left;background: url(../images/hamburpeque.png);}
    header .blanca{display: none;}
    header .negra{display: block;}
    nav a, nav a:visited {color: black;}
    nav a:hover{color:#ffec8c;}

    /* .inicio .logo::after{margin-top: 0; font-size:19px;} */
    .inicio p,h1 {font-size: 18px;}
    .inicio img {max-width: 60%;}
    /* .inicio .bienvenido {font-size: 18px} */

    .bloque .container{display: block;}
    .bloque .titular { width: 100%; padding-right: 0px;}
    .bloque .body-copy {width: 100%;}
    .bloque .logo, .bloque .menu{display: none;}


    .contacto .body-copy {padding-top: 20px}
    .contacto .links {position: static;}
    .contacto .log a{width:55px;}
    .contacto .log{padding-top: 20px}
    .contacto address{padding-top: 20px}
}