html{
    height: 100%;
    width: 100%;
}

body{
    background-image: linear-gradient(#000000ba, #000000bf), url(../img/placa.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    width: 100%;
    background-attachment: fixed;
    background-position: center;
}

@media(max-width:1400px){
    body{
    background-image: linear-gradient(#00000063, #000000bf), url(../img/placa2.jpg);
    background-size: 100%;
    background-repeat: repeat;
    width: 100%;
    background-attachment: fixed;
    background-position: center;
    }
}

.container-1{
    display: flex;
    margin-top: 5%;
}

.container-1 .btn{
    text-align: none !important;
    vertical-align: none !important;
    display: flex !important;
    flex-direction: column !important;
}

.container-1{
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.container-1 a{
    width: 100% !important;
}


.container-1 .btn button a{
    margin-right: 5px !important;
    height: 100%;
}

.container-1 .btn button{
    font-family: "Archivo Black", sans-serif;
    font-weight: bold;
    font-size: 1.7rem;
    height: 70%;
    color: black;
    padding: 35px 70px;
    background: rgba(253,196,1,255);
    border: 5px solid black;
    cursor: pointer;
    transition: all 0.3s ease 0s;
}

@media(max-width:1385px){
    .container-1 .btn button{
        font-size: 1.4rem !important;
    }
}

@media(max-width:710px){
    .container-1 .btn button{
            padding: 35px 10px !important;
    }
}

@media(max-width:575px){
    .container-1 .btn button{
            padding: 35px 0px !important;
    }
}

@media(max-width:450px){
    .container-1 .btn button{
        font-size: 1.1rem !important;
    }
}

.container-1 .btn button:hover{
    color: #ed0000;
}

.container-2{
    display: flex;
    justify-content: center;
    align-items: center;
}

.img-logo-body{
    width: 400px !important;
}

@media(max-width:1400px){
    .img-logo-body{
        width: 300px  !important;
    }
}

@media(max-width:550px){
    .img-logo-body{
        width: 200px  !important;
    }
}

.container-3{
    display: flex;
    margin-left: 5%;
    margin-right: 5%;
}

@media(max-width:1400px){
    .container-3{
        flex-direction: column;
        align-items: center;
    }
}

.container-3 .btn{
    text-align: none !important;
    vertical-align: none !important;
    display: flex !important;
}

.container-3 .col-6-btn-izq{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.container-3 .col-6-btn-der{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

@media(max-width:1400px){
    .container-3 .col-6{
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 20px;
        margin-bottom: 20px;
    }
}

.container-3 .btn button a{
    margin-right: 5px !important;
    height: 100%;
}

.container-3 .btn button{
    font-family: "Archivo Black", sans-serif;
    font-weight: bold;
    font-size: 500%;
    height: 70%;
    color: black;
    background: white;
    border: 5px solid black;
    cursor: pointer;
    transition: all 0.3s ease 0s;
}

@media(max-width:750px){
    .container-3 .btn button{
        font-size: 400% !important;
    }
}

@media(max-width:610px){
    .container-3 .btn button{
        font-size: 350% !important;
    }
}

@media(max-width:540px){
    .container-3 .btn button{
        font-size: 300% !important;
    }
}

@media(max-width:470px){
    .container-3 .btn button{
        font-size: 250% !important;
    }
}

@media(max-width:400px){
    .container-3 .btn button{
        font-size: 200% !important;
    }
}

@media(max-width:340px){
    .container-3 .btn button{
        font-size: 150% !important;
    }
}

@media(max-width:265px){
    .container-3 .btn button{
        font-size: 100% !important;
    }
}

.container-3 .btn button:hover{
    color: rgba(253,196,1,255);
}

.container-4{
    display: flex;
    margin-left: 5%;
    margin-right: 5%;
    padding-bottom: 4%;
}

@media(max-width:1400px){
    .container-4{
        flex-direction: column;
        align-items: center;
        margin-top: 20px;
    }
}

.container-4 .btn{
    text-align: none !important;
    vertical-align: none !important;
    display: flex !important;
    flex-direction: column !important;
}

.container-4{
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.container-4 a{
    width: 100% !important;
}


.container-4 .btn button a{
    margin-right: 5px !important;
    height: 100%;
}

.container-4 .btn button{
    font-family: "Archivo Black", sans-serif;
    font-weight: bold;
    font-size: 200%;
    height: 70%;
    color: black;
    padding: 35px 70px;
    background: white;
    border: 5px solid rgba(253,196,1,255);
    cursor: pointer;
    transition: all 0.3s ease 0s;
}

@media(max-width:550px){
    .container-4 .btn button{
        font-size: 150%;
    }
}

@media(max-width:450px){
    .container-4 .btn button{
        font-size: 130%;
        padding: 35px 25px;
    }
}

@media(max-width:300px){
    .container-4 .btn button{
        font-size: 100%;
        padding: 35px 25px;
    }
}

.container-4 .btn button:hover{
    color: rgba(253,196,1,255);
}

.container-5{
    background-color: rgba(253,196,1,255);
    display: flex;
    justify-content: space-around;
    margin-left: 6%;
    margin-right: 6%;
}

@media(max-width:1100px){
    .container-5{
        margin-left: 6.3%;
        margin-right: 6.3%;
    }
}

@media(max-width:750px){
    .container-5{
        margin-left: 6.5%;
        margin-right: 6.5%;
    }
}

@media(max-width:700px){
    .container-5{
        display: flex;
        justify-content: center;
    }
}

@media(max-width:550px){
    .container-5{
        margin-left: 7%;
        margin-right: 7%;
    }
}

@media(max-width:400px){
    .container-5{
        margin-left: 8%;
        margin-right: 8%;
    }
}

@media(max-width:300px){
    .container-5{
        margin-left: 9%;
        margin-right: 9%;
    }
}

.img-tiktok{
    width: 120px !important;
}

.container-51 .img-tiktok:hover{
    transform: scale(1.1);
    cursor: pointer;
    filter: opacity(0.8);
    transition: all 0.6s ease;
}

@media(max-width:470px){
    .img-tiktok{
        width: 100px !important;
    }
}

@media(max-width:340px){
    .img-tiktok{
        width: 90px !important;
    }
}

@media(max-width:300px){
    .img-tiktok{
        width: 80px !important;
    }
}

.img-instagram{
    width: 120px !important;
}

.container-51 .img-instagram:hover{
    transform: scale(1.1);
    cursor: pointer;
    filter: opacity(0.8);
    transition: all 0.6s ease;
}

@media(max-width:470px){
    .img-instagram{
        width: 100px !important;
    }
}

@media(max-width:340px){
    .img-instagram{
        width: 90px !important;
    }
}

@media(max-width:300px){
    .img-instagram{
        width: 80px !important;
    }
}

.img-facebook{
    width: 120px !important;
}

.container-52 .img-facebook:hover{
    transform: scale(1.1);
    cursor: pointer;
    filter: opacity(0.8);
    transition: all 0.6s ease;
}

@media(max-width:470px){
    .img-facebook{
        width: 100px !important;
    }
}

@media(max-width:340px){
    .img-facebook{
        width: 90px !important;
    }
}

@media(max-width:300px){
    .img-facebook{
        width: 80px !important;
    }
}

.img-x{
    width: 120px !important;
}

.container-52 .img-x:hover{
    transform: scale(1.1);
    cursor: pointer;
    filter: opacity(0.8);
    transition: all 0.6s ease;
}

@media(max-width:470px){
    .img-x{
        width: 100px !important;
    }
}

@media(max-width:340px){
    .img-x{
        width: 90px !important;
    }
}

@media(max-width:300px){
    .img-x{
        width: 80px !important;
    }
}

.container-51{
    display: contents;
    justify-content: space-around;
    margin-left: 6%;
    margin-right: 6%;
}

@media(max-width:700px){
    .container-51{
        display: flex;
        flex-direction: column;
    }
}

.container-52{
    display: contents;
    justify-content: space-around;
    margin-left: 6%;
    margin-right: 6%;
}

@media(max-width:700px){
    .container-52{
        display: flex;
        flex-direction: column;
    }
}