
@font-face {
    font-family: 'futur2';
    src: url('../font/futur2.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body{
    font-family:'futur2';
}

.bodygeneral{
    margin-top: -7%;
    opacity: 1;
    width: 100%;
    height: 230vh;
    position: absolute;
    background-size: 100% 230vh;
}

.bodygeneral_mobil{
    display: none;
}

.div_logo{
    text-align: center;
    width: 100%;
    position: fixed;
    top: 2%;
}

.div_logo_black{
    text-align: center;
    width: 100%;
    position: fixed;
    top: 2%;
}

.logo_ark{
    margin-top: -1%;
    width: 30%;
    z-index: 20;
    image-rendering:auto;
}

.logo_arkBlack{
    margin-top: -1%;
    width: 30%;
    z-index: 10;
    image-rendering:auto;
}



.logo_rss{
    right: 3%;
    top:45%;
    width: 2.5%;
    z-index: 10;
    image-rendering:auto;
    position: fixed;
}

.logo_rss3{
    right: 3%;
    top:45%;
    width: 2.5%;
    z-index: 10;
    image-rendering:auto;
    position: fixed;
}

.logo_rss2{
    right: 3%;
    top:52%;
    width: 2.5%;
    z-index: 10;
    image-rendering:auto;
    position: fixed;
}



.p1{
    left:26%;
    top: 35%;
    width: 50%;
    display: block;
    text-align: justify;
    position: absolute;
    font-size: 15px;
    color:white;
    font-weight:normal;
}



.button_contact{
    position: relative;
    top: 875px;
    text-align: center;
}

.size-button{
    background-color:rgba(255, 255, 255, 0.2);
    border: solid 1px;
    width:250px;
    height:30px;
    border-radius: 10px; 
    transition: 1s;
}

.size-button:hover{
    border: none;
    background-color: black;
    color: white;
    transition: 1s;
}

.inside_btn{
    font-size: 18px;
    font-weight: bold;
}



.text_service{
    width: 100%;
    position: absolute;
    top: 152%;
    text-align: center;
}

.service{
    width: 100%;
    position: absolute;
    top: 164%;
    padding-left: 14%;
}

.service_1{
    margin-left: -6%;
    display: inline-block;
    width: 17%;
    text-align: center;
    image-rendering:optimizeQuality;
}

.logo_linkedin{
    width: 60%;
}



.iso-img{
    right: 47%;
    top:186%;
    width: 5%;
    z-index: 13;
    image-rendering:auto;
    position: absolute;
}


.rrss_2{
    font-weight: bold;
    color: black;
}

.rss_down{
    width: 60%;
    position: absolute;
    top: 203%;
    left: 35%;
}

.r1{
    width: 25%;
    display: inline-block;
    text-align: right;
    image-rendering:optimizeQuality;
}

.r2{
    width: 25%;
    display: inline-block;
    text-align: left;
    image-rendering:optimizeQuality;
}

.r1_wi{
    width: 17%;
}


.rrss{
    width: 30%;
    position: absolute;
    top: 209%;
    left:46.5%;
    font-weight: bold;
    font-size: 12px;
}





/* Parte responsive */



@media only screen and (max-width: 975px){

    .p1{
        font-size: 14px;
    }

    .rrss{
        left:45%;
    }

}



@media only screen and (max-width: 767px){

    .service_1{
        margin-left: 1%;
        margin-top: 1%;
        width: 20%;
    }

    .logo_rss{
        width: 4%;
    }

    .logo_rss3{
        width: 4%;
    }

    .logo_rss2{
        width: 4%;
    }

    .iso-img{
        right: 45%;
        top:195%;
        width: 7%;
    }

    .rss_down{
        width: 70%;
        top: 208%;
        left: 30%;
    }

    .r1{
        width: 30%;
    }

    .r2{
        width: 30%;
    }

    .rrss{
        top: 214%;
    }

}



@media only screen and (max-width: 550px){

    .bodygeneral{
        display: none;
    }
    
    .bodygeneral_mobil{
        display: block;
        opacity: 1;
        width: 100%;
        height: 230vh;
        position: absolute;
        background-size: 100% 230vh;
    }

    .button_contact{
        top: 860px;
    }

    .text_service{
        top: 145%;
    }

    .service{
        top: 155%;
    }

    .service_1{
        margin-left: -1%;
        margin-top: 1%;
        width: 30%;
    }

    .rrss{
        top: 216%;
        left: 40%;
    }

    .p1{
        left:15%;
        top: 20%;
        width: 70%;
    }

    .iso-img{
        top:200%;
    }

    .rss_down{
        top: 210%;
        left: 20%;
    }

    .r1{
        width: 45%;
    }

    .r2{
        width: 45%;
    }

    .logo_rss{
        width: 5%;
    }

    .logo_rss3{
        width: 5%;
    }

    .logo_rss2{
        width: 5%;
    }

}



@media only screen and (max-width: 450px){

    .text_service{
        top: 160%;
    }

    .text_service h3{
        font-size: 20px;
    }

    .service{
        top: 166%;
        padding-left: 8%;
    }

    .service_1{
        width: 45%;
        margin-left: 0
    }

/* 

    .logo_ark{
        width: 48%;
    }

    .logo_arkBlack{
        width: 48%;
    } */

    .p1{
        top: 15%;
        font-size: 14px;
    }

    .button_contact{
        top: 950px;
    }

    .logo_rss{
        width: 7%;
    }

    .logo_rss3{
        width: 7%;
    }

    .logo_rss2{
        width: 7%;
    }

    .iso-img{
        top:227%;
    }

    .rss_down{
        top: 235%;
    }

    .rrss{
        top: 239%;
        /* left: 54%; */
    }

}

@media only screen and (max-width: 415px){



    .text_service{
        top: 160%;
    }

    .text_service h3{
        font-size: 20px;
    }

    .service{
        top: 166%;
        padding-left: 8%;
    }

    .service_1{
        width: 45%;
        margin-left: 0
    }

    .size-button{
        background-color:rgba(255, 255, 255, 0.5);
        color: white;
    }
    
    .size-button:hover{
        background-color: white;
        color: black;
    }

    .logo_rss{
        width: 7%;
    }

    .logo_rss3{
        width: 7%;
    }

    .logo_rss2{
        width: 7%;
    }

    .iso-img{
        top:227%;
    }

    .rss_down{
        top: 235%;
    }

    .rrss{
        top: 239%;
        /* left: 54%; */
    }

}

@media only screen and (max-height: 750px) and (max-width: 450px){

    .bodygeneral_mobil{
        height: 245vh;
        background-size: 100% 245vh;
    }

    .button_contact{
        top: 620px;
    }

    .p1{
        top: 15%;
        font-size: 15px;
    }

}

@media only screen and (max-height: 650px)  and (max-width: 450px){

    .bodygeneral_mobil{
        height: 230vh;
        background-size: 100% 230vh;
    }

    .button_contact{
        top: 560px;
    }

    .p1{
        top: 15%;
        font-size: 13.5px;
    }

}

@media only screen and (max-height: 600px){

    .button_contact{
        top: 480px;
    }

    .p1{
        top: 15%;
        font-size: 12px;
    }

    .iso-img{
        top:240%;
    }

    .rss_down{
        top: 248%;
    }

    .rrss{
        top: 253%;
        /* left: 54%; */
    }

}