html,body{
    overflow-x: hidden;
}
.seccontacto{
    background-image: url(../img/contacto/fondo.webp);
    background-size: cover;
    background-repeat: no-repeat;
    padding-top: 70px;
    padding-bottom: 70px;
}
.divform{
    background: #252627;
    z-index: 1;
    position: relative;
}
.divform h2{
    color: #219BD8;
    margin-bottom: 18px;
}
.parrafoagencia {
    font-size: 1rem;
}
.divform button{
    background: #219BD8;
        color: #FFF;
        padding: 16px 43px;
    text-align: center;
}
#contentanimation{
    position: relative;
    text-align: center;
}
#imgcelular{
    position: absolute;
    left: -19%;
    top: -5%;
    width: 473px;
    z-index: 0;
    animation: celularanimation 3s steps(3) infinite ;
}
@keyframes celularanimation {
    0%,100% {
        transform:  scale(1);
    }
    50% {
        transform:  scale(1.05);
    }
}
#imgdialogo{
    position: absolute;
    right: 0%;
    top: 0%;
    width: 200px;
    z-index: 2;
    animation: rotatdialog 2s steps(3) infinite;
}


@keyframes rotatdialog {
    0% {
        transform: rotate(-8deg);
    }
    50% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-8deg);
    }
}
#imglaptop{
    position: absolute;
    left: -30%;
    bottom: 0%;
    width: 380px;
    z-index: 0;
    transform: rotate(-8deg) scale(1);
    animation: collageRotate 3s steps(3) infinite ;
}
@keyframes collageRotate {
    0% {
        transform: rotate(-8deg) scale(1);
    }
    50% {
        transform: rotate(5deg) scale(1.05);
    }
    100% {
        transform: rotate(-5deg) scale(1);
    }
}
#imgflecha{
    position: absolute;
    right: 0%;
    bottom: 10%; 
    width: 300px;
    animation: flechaMove 2s steps(3) infinite ;
}
@keyframes flechaMove {
    0%,100% {
        transform:  translateY(0px) scale(1);
    }
    50% {
        transform: translateY(-8px) scale(1.01);
    }
}
#imggallo{
    position: relative;
    z-index: 1;
    width: 70%;
    top: -20px;
    animation: rotategallo 3s steps(1) infinite ;
}

@keyframes rotategallo {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(4deg);
    }
    100% {
        transform: rotate(0deg);
    }
}


@media (max-width: 1400px){
    #imgdialogo {
        width: 165px;
    }
    #imgcelular{
        width: 400px;
        left: -22%;
        top: -9%;
    }
    #imglaptop {
        left: -29%;
        bottom: 0%;
        width: 330px;
    }
    #imgflecha {
        bottom: 12%;
        width: 240px;
    }
    #imggallo {
        width: 67%;
        top: -3px;
    }
}


@media (max-width: 992px){
    #imggallo {
        width: 90%;
        top: 0;
    }
    #imgcelular {
        width: 288px;
        left: -18%;
        top: -11%;
    }
    #imglaptop {
        left: -27%;
        bottom: 0%;
        width: 174px;
    }
    #imgdialogo {
        width: 111px;
    }
    #imgflecha {
        bottom: 12%;
        width: 138px;
    }
}
@media (max-width: 767px){
    #imggallo {
        width: 70%;
        top: 0;
    }
    #imgcelular {
        width: 295px;
        left: -11%;
        top: -11%;
    }
    #imgdialogo {
        width: 150px;
        right: -7%;
    }
    #imglaptop {
        left: -63px;
        bottom: 0%;
        width: 215px;
    }
    #imgflecha {
        bottom: 7%;
        width: 203px;
        right: -2%;
    }
}
@media (max-width: 370px){
    #imglaptop {
        width: 190px;
    }
    #imgcelular {
        width: 265px;
        left: -14%;
    }
    #imgdialogo {
        width: 135px;
        right: -7%;
    }
    #imgflecha {
        width: 178px;
        right: -7%;
    }
}