body{
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    color: #000000;
    padding: 0;
    margin: 0;
 }

.bg {
    background-image: url(../../assets/img/bg.png);
    height: 100vh;
    position: absolute;
    width: 100%;
    background-size: cover;
}


.element {
    background-image: url(../../assets/img/element.svg);
    height: 100%;
    position: absolute;
    width: 100%;
    max-width: 1600px;
    background-size: cover;
    left: -750px;
    top: 0;
    background-position: center -81px;
    background-repeat: no-repeat;
}

.container{
    position: relative;
    z-index: 1;
    padding-top: 22%;
    width: 100%;
    max-width: 1181px;
    margin: auto;
}

.bl{
    width: 40%;
}
.logo {
    background-image: url(../../assets/img/logo.svg);
    height: 100px;
    position: relative;
    width: 262px;
    max-width: 262px;
    background-size: 100%;
}

h1{

    font-size: 48px;
    font-weight: 100;
    margin: 26px 0;
    color: #1ADCF8;
    background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #1ADCF8), color-stop(1, #05A4ED));
    background-image: gradient( linear, left top, right top, color-stop(0, #1ADCF8), color-stop(1, #05A4ED));
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}



@media (max-height: 600px){
    .container {
        padding-top: 15%;
    }
}
@media (max-width: 1200px){
    .element {
        left: -491px;
        top: 0;
        background-position: -73px center;
    }

    .container {
        max-width: 1000px;
    }
}


@media (max-width: 1000px){
    .element {
        left: -491px;
        top: 0;
        background-position: right;
        width: 1042px;
    }
    .logo {
        width: 204px;
        background-repeat: no-repeat;
    }
    .container {
        max-width: 818px;
        padding: 300px 30px 0;
    }
    h1 {
        font-size: 37px;
    }
    .bl {
        width: 100%;
    }
}

@media (max-width: 500px){

    .bloque {
        width: 100%;
        height: 100vh;
        overflow: hidden;
        position: relative;
    }
    
    .element {
        max-width: 1600px;
        width: 474px;
        background-size: cover;
        left: -166px;
        background-position: right 4px;
        bottom: 0;
        top: inherit;
        transform: rotate(
    21deg
    );
    }

    .bg {
        background-position: top;
    }
    .container {
        padding: 294px 30px 0;
    }
    .logo {
        height: 71px;
        width: 177px;
        max-width: 251px;
    }

    .container {
        box-sizing: border-box;
    }

    h1 {
        font-size: 30px;
    }

}