@charset "UTF-8";

@font-face {
    font-family: 'Lato', sans-serif;
}

@font-face {
    font-family: "Amalfi";
    font-weight: 100;
    font-style: normal;
    src: url(../fonts/Amalfi\ Coast.woff) format("woff");
    src: url(../fonts/Amalfi\ Coast.woff2) format("woff2");
    src: url(../fonts/Amalfi\ Coast.otf) format("opentype");
    src: url(../fonts/Amalfi\ Coast.ttf) format("truetype");
}



body {
    margin: 0 auto;
    color:#303030;
    max-width: 1920px;	
    background-color: #ffffff;
}

img{
    vertical-align: middle;
}

h1{
    font-family: "lato";
    font-size: 24px;
    font-weight: 400;
    width: 35%;
    margin: auto;
}

.gracias{
    font-family: "Amalfi";
    color: #559088;
    font-size: 96px;
    -moz-transform: skewy(-8deg) translate(-85% , 0);
    -webkit-transform: skewy(-8deg) translate(-85% , 0);
    transform: skewy(-8deg) translate(-85% , 0);
    line-height: 1.2em;
    font-weight: 100;
    display: block;
}

h2{
    font-family: "lato";
    font-size: 20px;
    font-weight: 400;
    text-align: center;
}

h3{
    font-family: "lato";
    font-size: 16px;
    font-weight: bold;
    color: #ffffff;
}

h4{
    font-family: "Amalfi";
    color: #080509;
    font-size: 42px;
    -webkit-transform: skewy(-8deg);
    transform: skewy(-8deg);
    line-height: 1em;
    font-weight: 100;
}

p{
    font-family: "lato";
    font-size: 16px;
    font-weight: 400;
    color: #ffffff;
}

a{
    font-family: "lato";
    padding: 20px 50px;
    font-size: 16px;
    cursor: pointer;
    border: 0px;
    background: transparent;
    position: relative;
    margin: 20px;
    transition: all .25s ease;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 900;
}

.btn-1 {
    background: #fff;
    color: #080509;
    border-radius: 30px;
    transition: all .25s ease;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    
    box-shadow: 0px 0px rgba(159,247,242,0), 0px 0px rgba(159,247,242,0);
    -webkit-box-shadow: 0px 0px rgba(159,247,242,0), 0px 0px rgba(159,247,242,0);
    -moz-box-shadow: 0px 0px rgba(159,247,242,0), 0px 0px rgba(159,247,242,0);
    
}

.btn-1::after, .btn-1::before {
    content: '';
    position: absolute;
    opacity: .3;
    background:rgba(159,247,242,0.5);
    border-radius: inherit;
    width: 100%;
    height: 100%;
    left: 0px;
    bottom: 0px;
    z-index: -1;
    transition: all .25s ease;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
}

.btn-1:hover {
    transform: translate(-12px, -12px);
}

.btn-1:hover {
     box-shadow: 6px 6px rgba(159,247,242,0.5), 12px 12px rgba(159,247,242,0.25);
     -webkit-box-shadow: 6px 6px rgba(159,247,242,0.5), 12px 12px rgba(159,247,242,0.25);
     -moz-box-shadow: 6px 6px rgba(159,247,242,0.5), 12px 12px rgba(159,247,242,0.25);

}

.btn-1:hover:after {
    transform: translate(6px, 6px);
}

.btn-1:hover:before {
    transform: translate(12px, 12px);
}

.accent{
    color: #1e918a;
}

.flex{
    display: flex;
}

.section-cabecera{
    background-color: #9ff7f2;
    padding: 64px 64px 16px 64px;
    align-items: center;
}

.div-left-cabecera{
    width: 50%;
    text-align: left;
}

.div-right-cabecera{
    width: 50%;
    text-align: right;
}

.section-cabecera img{
    width: 24vh;
}

.section-2{   
    background-color: #9ff7f2;
}

.titular{
    max-width: 770px;
    padding: 16px 16px 164px 16px;
    margin: 0 auto;
    text-align: center;
}

.div-h1{
    margin-top: 56px;
}

.section-3{   
    background-color: #000000;
}

.content-section-3{
    max-width: 770px;
    padding: 16px 16px 56px 16px;
    margin: 0 auto;
    text-align: center;
}

.content-img{
    margin-top: -144px;
    visibility: hidden;
}

.section-4{   
    background-color: #ffffff;
}

.content-section-4{
    max-width: 1440px;
    padding: 16px 16px 16px 16px;
    margin: 0 auto;
    text-align: center;
}

.titular-h2{
    padding-top: 32px;
}

.content-column{
    padding: 8px;
}

.column{
    width: 25%;
    background-color: #1e918a;
    margin: 8px;   
    position: relative;

}

.column-img-column{
    width: 100%;
    overflow: hidden;
}

.column-img-column img{
    width: 100%;
    transition: all 2s ease-out;
    -webkit-transition: all 2s ease-out;
    -moz-transition: all 2s ease-out;
}

.content-text{
    padding: 16px;
}

.footer-titular-h2{
    padding: 32px 34%;
}

.section-5{   
    background-color: #1e918a;
}

.content-section-5{
    max-width: 770px;
    padding: 32px 16px 32px 16px;
    margin: 0 auto;
    text-align: center;
    align-items: center;
}

.section-5-text{
    width: 50%;
    padding: 16px;
    text-align: right;
}
.section-5-button{
    width: 50%;
    padding: 16px;
    text-align: left;
}

.div-accent{
    background-color: #9ff7f2;
    height: 24px;
}

.footer{
    max-width: 770px;
    padding: 32px 16px 32px 16px;
    margin: 0 auto;
    text-align: center;
    align-items: center;
    background-color: #ffffff;
}

.logo-footer{
    margin-top: -56px;
}

.logo-footer img{
    width: 24vh;
}

.hashtag{
    color: #080509;
    font-style: oblique;
}

.column:hover img{
    transform: scale(1.1);
}

.scroll{
    visibility: hidden;
}

@media (max-width: 1024px) {

    .content-column {
        flex-wrap: wrap;
    }

    .column {
        width: 47.33%;
    }

    .section-5-button {
        width: 60%;
    }

    .footer-titular-h2 {
        padding: 32px 27%;
    }
  }

@media (max-width: 880px) {

    .gracias {
        font-size: 8vw;
        -moz-transform: skewy(-8deg) translate(-15vw , 0);
        -webkit-transform: skewy(-8deg) translate(-15vw , 0);
        transform: skewy(-8deg) translate(-15vw , 0);
    }

  }
  
@media (max-width: 675px) {

    .content-column {
        flex-wrap: wrap;
    }
    
    .column {
        width: 100%;
    }

    .section-cabecera img {
        width: 20vh;
    }

    .content-section-5 {
        flex-wrap: wrap;
    }

    .section-5-text {
        width: 100%;
        text-align: center;
    }

    .section-5-button {
        width: 100%;
        text-align: center;
    }

    h1 {
        width: 100%;
    }

    .gracias {
        font-size: 40px;
        -moz-transform: skewy(-8deg) translate(0vw  , 0);
        -webkit-transform: skewy(-8deg) translate(0vw  , 0);
        transform: skewy(-8deg) translate(0vw , 0);
        line-height: 3.2em;
    }
    
    .footer-titular-h2 {
        padding: 32px 20%;
    }

    .section-cabecera {
       
        padding: 64px 32px 16px 32px;
    }

    .div-left-cabecera {
        width: 100%;
    }

    .div-left-cabecera {
        width: 100%;
    }

    .section-cabecera img {
        width: 24vh;
    }
  }

  @media (max-width: 540px) {

    .section-cabecera{
        flex-wrap: wrap;
        padding: 56px 64px 16px 64px;
    }

    .div-left-cabecera {
        width: 100%;
        text-align: center;
        margin: 24px 0;
    }

    .div-right-cabecera {
        width: 100%;
        text-align: center;
    }

    .section-cabecera {
        padding: 32px 16px 16px 16px;
    }

    .section-cabecera img {
        width: 26vh;
        padding: 8px 0;
    }

    a{
        padding: 20px 32px;
    }

    .content-section-5 {

        padding: 32px 16px 56px 16px;

    }

    .footer-titular-h2 {
        padding: 32px 0%;
    }

    h4 {
        line-height: 2em;
        font-size: 32px;
    }
  }