/* conociendo a las chinches */

.color-conociendo {

    background-color: #F7F7F7;

}



.textp-first-conociendo {

    font-size: 16px;

    color: #151515;

    text-align: justify;

}



.color-vinietas {

    color: #CE3700;

}



.color-vinietas span {

    font-size: 15px;

    color: #1C1C1C;

}



@media screen and (min-width: 1025px) {

    .color-vinietas {

        margin-bottom: 20px;

    }

}



.box-conociendo-equal {

    font-size: 16px;

    color: #1C1C1C;

}



.box-conociendo-title-1 {

    font-size: 20px;

    color: #0527A5;

}



.box-conociendo-title-2 {

    font-size: 20px;

    color: #9E4820;

}



.box-conociendo-title-3 {

    font-size: 20px;

    color: #D6106A;

}



.box-conociendo-title-4 {

    font-size: 20px;

    color: #D6106A;

}



.box-conociedo-1,

.box-conociedo-2,

.box-conociedo-4 {

    width: 332px;

    height: 88px;

    line-height: 16px;

    position: absolute;

}



.box-conociedo-3 {

    width: 200px;

    height: 88px;

    line-height: 16px;

    position: absolute;

}



.box-conociedo-4 {

    left: 73%;

    top: 3%;

}



.box-conociedo-3 {

    left: 70%;

    top: 82%;

}



.box-conociedo-2 {

    left: -2%;

    top: 82%;

}



.box-conociedo-1 {

    top: 3%;

}



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

    .box-conociedo-3 {

        left: 75%;

    }



    .box-conociedo-2 {

        left: -4%;

    }

}



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

    .box-conociedo-2 {

        top: 90%;

        left: 8%;

    }



    .box-conociedo-3 {

        left: 76%;

        top: 90%;

    }



    .box-conociedo-4 {

        left: 58%;

        top: -4%;

    }



    .box-conociedo-1 {

        top: -4%;

    }

}



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

    .box-conociedo-1 {

        top: 5%;

    }



    .box-conociedo-3 {

        left: 72%;

    }



    .box-conociedo-4 {

        left: 66%;

        top: 5%;

    }

}



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

    .caja-principal {

        margin-top: 60px;

    }



    .box-conociedo-4 {

        left: 61%;

        top: -7%;

        width: 300px;

    }



    .box-conociedo-1 {

        top: -7%;

        width: 300px;

    }



    .box-conociedo-3 {

        left: 75%;

    }

}



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



    .box-conociedo-1 {

        left: 7%;

        width: 250px;

    }



    .box-conociedo-4 {

        width: 250px;

    }



    .box-conociedo-3 {

        left: 65%;

        top: 95%;

    }



}



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



    .box-conociedo-1 {

        top: -10%;

        width: 200px;

    }



    .box-conociedo-4 {

        top: -10%;

        width: 200px;

    }



}



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



    .box-conociedo-1 {

        top: -14%;

    }



    .box-conociedo-4 {

        top: -14%;

        left: 58%;

    }



}



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



    .box-conociendo-title-1,

    .box-conociendo-title-2,

    .box-conociendo-title-3,

    .box-conociendo-title-4 {

        font-size: 16px;

    }



    .box-conociedo-4 {

        top: -17%;

        left: 55%;

    }



    .box-conociendo-equal {

        font-size: 14px;

    }



}



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

    .caja-principal {

        margin-top: 100px;

    }



    .box-conociedo-4 {

        width: 150px;

        top: -26%;

    }



    .box-conociedo-1 {

        width: 150px;

        top: -26%;

    }



    .box-conociedo-3 {

        width: 150px;

    }



}



/* ciclo vida */

.color-ciclo-vida {

    height: 75px;

    width: 75px;

    background-color: #163A6B;

    border-radius: 50%

}



.text-ciclo-vida {

    font-size: 25px;

    color: #0C2247;

}



.icon-Huevos {

    font-size: 65px;

    color: white;

    margin-left: 5px;

}



.icon-Ninfa {

    font-size: 70px;

    color: white;

    margin-left: 3px;

}



.icon-Chinche {

    font-size: 70px;

    color: white;

    margin-left: 3px;

}



/* banner fisrt */

.color-banner-first {

    background-color: #7A101A;

}



.title-table {

    color: white;

    font-weight: bold;

    font-size: 20px;

}



.sub-title-table {

    font-size: 16px;

    font-weight: 500;

    color: white;

}



.des-title-table {

    font-size: 14px;

    color: white;

}



.color-tr {

    background-color: #ffffff63;

}



/* llamanos escribenos */

.llamanos-escribenos {

    background-color: #F12D1B;

    height: 146px;

    width: 146px;

    border-radius: 50px 50px 50px 50px;

}



.title-box {

    color: black;

    font-size: 31px;

    font-weight: 800;

    text-align: center;

}



.sub-title-box {

    color: black;

    font-size: 34px;

    font-weight: 600;

    text-align: center;

}



.box-llamanoos {

    background-color: rgb(255, 157, 0);

}


.arriba{
    position: relative;
    top: -31%;
}
.arribaB{
    margin-top: -9%;
}
.sobra {

    width: 1271px;

    height: 121px;

    position: relative;

    top: 51%;

    rotate: -2deg;

    background-color: black;

}



.sombra2 {

    width: 942px;

    height: 209px;

    position: relative;

    rotate: -2deg;

    background-color: black;

    top: 19%;

}



.sombra3 {

    width: 1272px;

    height: 192px;

    position: relative;

    rotate: -2deg;

    background-color: black;

    top: 50%;

}



.sombra4 {

    width: 1272px;

    height: 192px;

    position: relative;

    rotate: -2deg;

    background-color: black;

    top: 19%;

}



.icon-Correo {

    font-size: 66px;

    color: white;

}



.icon-Telefono {

    font-size: 66px;

    color: white;

}

.icon-Correo1 {

    font-size: 15px;

    color: #202F5C;;

}



.icon-Telefono1 {

    font-size: 15px;

    color: #202F5C;;

}



.text-box-llamanos {

    font-size: 15px;

    color: white;

}



.box-style-llamanos {

    margin-left: 36px;

    padding-top: 22px;

}



.box-style-llamanos2 {



    margin-left: 41px;

    padding-top: 26px;



}



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

    .sobra {

        width: 1092px;

    }



    .sombra2 {

        width: 811px;

    }



    .sombra3 {

        width: 1082px;

        height: 158px;

        top: 41%;

    }



    .sombra4 {

        width: 1086px;

    }

}



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

    .sobra {

        width: 909px;

    }



    .sombra2 {

        width: 912px;

    }



    .sombra3 {

        width: 904px;

        height: 76px;

        top: 26%;

    }



    .sombra4 {

        width: 906px;

    }

}



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

    .sobra {

        top: 30%;

    }



    .sombra2 {

        height: 105px;

        top: 26%;

    }



    .sombra4 {

        height: 119px;

        top: 29%;

    }

}



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

    .sobra {

        width: 668px;

        top: 24%;

    }



    .sombra2 {

        width: 668px;

        top: 22%;

    }



    .sombra3 {

        width: 670px;

        top: 21%;

    }



    .sombra4 {

        width: 668px;

        top: 23%;

    }

}



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

    .sobra {

        width: 493px;

        top: 22%;

    }



    .sombra2 {

        width: 487px;

        top: 19%;

    }



    .sombra3 {

        width: 490px;

        top: 19%;

    }



    .sombra4 {

        width: 488px;

        top: 20%;

    }

}



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

    .sobra {

        width: 487px;

    }



    .sombra3 {

        width: 470px;

        top: 19%;

    }



    .sombra4 {

        display: none;

    }

}



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

    .sobra {

        width: 472px;

    }



    .sombra2 {

        display: none;

    }



    .sombra3 {

        display: none;

    }



    .box-llamanoos {



        box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
        top: -4%;
    }

}



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

    .sobra {

        width: 454px;

    }

}



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

    .sobra {

        width: 424px;

    }

}



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

    .sobra {

        width: 405px;

        top: 20%;

    }

}



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

    .sobra {

        width: 377px;

        top: 18%;

    }

}



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

    .sobra {

        width: 364px;

    }

}



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

    .sobra {

        width: 348px;

    }

}



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

    .sobra {

        top: 29%;

        width: 314px;

    }

}



@media screen and (min-width: 1199px) {

    .box-llamanoos1 {

        height: 132px;

        line-height: 30px;

    }



    .box-llamanoos4 {

        height: 209px;

        line-height: 30px;

    }



    .box-llamanoos2 {

        line-height: 28px;

        height: 209px;

    }

}



@-webkit-keyframes animar {

    0% {

        -webkit-transform: translate(0px, 0px);

    }



    10% {

        -webkit-transform: translate(0px, 5px);

    }



    20% {

        -webkit-transform: translate(0px, 0px);

    }



    30% {

        -webkit-transform: translate(0px, 5px);

    }



    40% {

        -webkit-transform: translate(0px, 0px);

    }



    50% {

        -webkit-transform: translate(0px, 5px);

    }



    60% {

        -webkit-transform: translate(0px, 0px);

    }



    70% {

        -webkit-transform: translate(0px, 5px);

    }



    80% {

        -webkit-transform: translate(0px, 0px);

    }



    90% {

        -webkit-transform: translate(0px, 5px);

    }



    100% {

        -webkit-transform: translate(0px, 0px);

    }

}





.llamanos-escribenos {

    -webkit-animation: animar 2.5s infinite;

}



/* como la detectan */

.color-detectan {

    background: transparent linear-gradient(180deg, #FF6903 0%, #640000 100%) 0% 0% no-repeat padding-box;

}



.color-detectan1 {

    background: transparent linear-gradient(180deg, #FF6903 0%, #640000 100%) 0% 0% no-repeat padding-box;

}



.title-detectan {

    color: white;

    font-size: 26px;

    font-weight: bold;

    text-align: center;

}



.card-style {

    background: #7c050524;

    border: 0px solid #707070;

    border-radius: 39px;

}



.dest-detectan {

    font-size: 16px;

    color: white;

    text-align: center;

}

.lm-descri{
    background-color: transparent;
    color: white;
    border: transparent;
}

.comport-mosq {

    font-size: 16px;

    color: white;

    text-align: left;

}



.des-alimentan-text {

    font-size: 16px;

    color: black;

    font-weight: 500;

    margin-bottom: 5px;

}



.des2-alimentan-text {

    font-size: 16px;

    color: #FF4F26;

    font-weight: 600;

}



/* second banner */

.second-banner-title {

    color: white;

    font-size: 32px;

    font-weight: bold;

}


.title-first-mosquitos {
    color: rgb(245, 58, 12);
    font-weight: bold;
    font-size: 26px;
    text-align: center;
}



.second-banner-sub-title {

    font-size: 15px;

    color: white;

}



.second-banner-sub-title-2 {

    color: white;

    font-size: 25px;

}





.box-chicnche {

    position: relative;

    height: 923px;

}





.img-chinche-detactan {

    position: absolute;

    left: 37%;

}



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

    .img-chinche-detactan {

        height: 105%;

    }

}



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

    .img-chinche-detactan {

        height: 105%;

    }

}



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

    .color-detectan1 {

        height: 960px;

    }



    .img-chinche-detactan {

        height: 100%;

    }

}



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

    .color-detectan1 {

        height: 995px;

    }



}



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

    .color-detectan1 {

        height: 1010px;

    }

}



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

    .box-chicnche {

        height: 420px;

    }



    .img-chinche-detactan {

        height: 89%;

        left: 33%;

    }



    .color-detectan1 {

        height: 1130px;

        margin-bottom: 100px;

    }

}



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



    .color-detectan1 {

        height: 1100px;

    }

}



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



    .color-detectan1 {

        height: 1200px;

    }

}



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



    .color-detectan1 {

        height: 1300px;

    }

}



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

    .color-detectan1 {

        height: 1308px;

    }

}



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

    .color-detectan1 {

        height: 1320px;

    }

}

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

    .color-detectan1 {

        height: 1380px;

    }

}



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

    .img-chinche-detactan {

        left: 23%;

    }

}



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

    .color-detectan1 {

        height: 1415px;

    }

}



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

    .color-detectan1 {

        height: 1450px;

    }

}



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

    .color-detectan1 {

        height: 1400px;

    }



    .img-chinche-detactan {

        top: -7%;

    }

}



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

    .color-detectan1 {

        height: 1500px;

    }

}



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

    .color-detectan1 {

        height: 1500px;

    }



}



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

    .color-detectan1 {

        height: 1520px;

    }



}



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

    .color-detectan1 {

        height: 1580px;

    }



}



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

    .color-detectan1 {

        height: 1630px;

    }



}



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

    .color-detectan1 {

        height: 1625px;

    }



}



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

    .color-detectan1 {

        height: 1700px;

    }



}



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

    .color-detectan1 {

        height: 1715px;

    }



}



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

    .color-detectan1 {

        height: 1740px;

    }

    .img-chinche-detactan {

        

        left: 15%;

    }



}



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

    .color-detectan1 {

        height: 1770px;

    }



}



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

    .color-detectan1 {

        height: 1810px;

    }



}



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

    .color-detectan1 {

        height: 1840px;

    }



}



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

    .color-detectan1 {

        height: 1880px;

    }



}



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

    .color-detectan1 {

        height: 1910px;

    }

    .img-chinche-detactan {

        

        left: 10%;

    }



}



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

    .color-detectan1 {

        height: 1980px;

    }



}



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

    .color-detectan1 {

        height: 1990px;

    }



}



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

    .color-detectan1 {

        height: 2050px;

    }



}



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

    .color-detectan1 {

        height: 2070px;

    }



}



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

    .color-detectan1 {

        height: 2130px;

    }



}



/* esconde */

.color-esconden {

    background: transparent linear-gradient(270deg, #0058CE 0%, #184383 100%) 0% 0% no-repeat padding-box;

    height: 555px;

}



.title-esconden {

    font-size: 36px;

    color: white;

    font-weight: bold;

    text-align: center;

}



.des-esconden {

    font-size: 16px;

    color: white;

}



.box-color-esconde {

    background-color: rgb(230, 237, 247);

}



.text-des-color-box-esconde {

    font-size: 15px;

    color: #0C4DA8;

    font-weight: bold;

    text-align: justify;

}



.box-img-esconde {

    position: relative;

    height: 550px;

}



.img-esconde {

    position: absolute;

    top: -15%;

    left: -7%;

}



.icon-stye-esconde-1 {

    color: white;

    font-size: 57px;

}



.style-box-banner2-esconde {

    height: 840px;

}



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

    .color-esconden {

        height: 100%;

    }

}



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

    .img-esconde {

        position: initial;

        width: 100%;

    }



    .box-img-esconde {

        position: relative;

        height: 100%;

    }



    .style-box-banner2-esconde {

        height: 100%;

    }

}



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

    .style-img-chinche {

        width: 100%;

    }

}





/* mitos */

.title-mitos {
    
    font-size: 36px;

    color: black;

    font-weight: bold;

}



.des-mitos {

    font-size: 14px;

    font-weight: 400;

    font-weight: bold;

}



.rectangulo-mitos {

    width: 1069px;
    height: 235px;
    border: 4px solid #FF7F00;
    padding-left: 20px;
    padding-right: 20px;

}



.color-banner-black {

    background-color: #292929;

}



.title-banner-black {

    color: white;

    font-size: 36px;

    font-weight: bold;

}



.des-banner-black {

    color: white;

    font-size: 16px;

}



.box-mitos-2 {

    margin-top: 110px;

    margin-right: 50px;

}



.des-mitos2 {
    text-align: justify;
    padding: 10px;

}



.img-mitos-not-static{

    display: none;

}



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

    .rectangulo-mitos {

        position: relative;

        left: -23%;

    }

}

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

    .box-mitos-2 {

        margin-top: 35px;

    }



    .img-mitos-not-static{

        display: block;

    }



    .img-mitos-static{

        display: none;

    }

}



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

    .rectangulo-mitos {

        left: -27%;

    }

}



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

    .rectangulo-mitos {

        width: 750px;

        left: -10%;

    }

}



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

    .rectangulo-mitos {

        width: 602px;

        left: -2%;

    }



    .des-mitos2 {

        padding: 0px;

    }

}



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

    .rectangulo-mitos {

        left: -22%;

    }

}



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

    .rectangulo-mitos {

        width: 500px;

        left: -12%;

    }

}



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

    .rectangulo-mitos {

        width: 100%;

        left: -12%;

    }

}



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

    .rectangulo-mitos {

        width: 100%;

        left: -2%;

        height: 100%;



    }

}



/* banner final */

.color-banner-final {

    background: transparent linear-gradient(180deg, #BF0202 0%, #510000 100%) 0% 0% no-repeat padding-box;

}



.color-banner-final-card {

    background: #ffffff61;

    border-radius: 61px;

    height: 323px;

}



.title-card-banner-final {

    color: white;

    font-size: 26px;

    text-align: center;

}



.des-card-banner-final {

    font-size: 16px;

    color: white;

    text-align: center;

}







.img-fumigador {

    position: absolute;

    left: 32%;

    top: 1%;

}









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

    .img-fumigador {

        left: 23%;

        top: 1.5%;

    }

}



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

    .img-fumigador {

        left: 15%;

    }

}



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

    .img-fumigador {

        left: 10%;

    }

}



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

    .img-fumigador {



        left: 32%;

    }

}



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

    .img-fumigador {

        left: 0%;

    }

}



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

    .img-fumigador {

        top: 10%;

        height: 90%;

    }

}



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

    .img-fumigador {

        top: 20%;

        height: 80%;

    }

}



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

    .img-fumigador {

        top: 30%;

        height: 70%;

    }

}



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



    .color-banner-final {

        height: 1702px;

    }



    .img-fumigador {

        height: 70%;

        left: 27%;

        top: 3%;

    }

}





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

    .box-fumigador {

        height: 500px;

    }



    .img-fumigador {

        height: 115%;

    }

}



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



    .img-fumigador {

        top: -2%;

    }

}





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

    .color-banner-final-card {

        height: 350px;

    }



    .box-fumigador {

        height: 500px;

    }



    .img-fumigador {

        top: -3%;

        left: 24%;

        height: 100%;

    }

}



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

    .img-fumigador {

        top: -4%;

        left: 24%;

        height: 90%;

    }

}



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

    .img-fumigador {

        top: 7%;

        left: 20%;

    }

}



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

    .img-fumigador {

        top: -4%;

        left: 16%;

    }

}



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

    .img-fumigador {

        top: -9%;

    }

}



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

    .img-fumigador {

        height: 80%;

        top: -3%;

    }

}



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

    .img-fumigador {

        height: 70%;

        top: 2%;

    }

}



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

    .img-fumigador {

        height: 60%;

        top: 2%;

    }

}



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

    .img-fumigador {

        height: 50%;

        top: 1.5%;

    }

}







@media screen and (min-width: 600px) {

    .card-espacio {

        margin-top: 3rem;

        margin-left: 3rem;

        margin-right: 3rem;

    }

}



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

    .color-nav {

      font-size: 10px;

    }

  }



  /* estilos efectos */

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



    [data-aos="fade-right"],

    [data-aos="zoom-out-up"],

    [data-aos="fade-left"]{

      transform: translateY(50px);

    }

  }




  .title-second-Mosquitos{
    color: #4C578C;
    font-weight: bold;
    font-size: 36px;
    text-align: center;
  }

  .especies-mosquitos{
    background-image: url('../src/img/blog/mosquito/Fondo_msoquito.jpg');
    background-repeat: no-repeat;
 }
 .color-banner-second{
    background-color: #1A4383;
    color: #FFFF;
 }

 .flotante{

    border-radius: 15%;
    position: relative;
    bottom: 10em;
    left: 5em;
    height: auto;
    width: auto;
    margin-bottom: -20%;
 }

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

    .flotante{
        border-radius: 15%;
        position: relative;
        bottom: 5em;
        left: 0em;
        height: auto;
        width: auto;
        margin-top: 20%;
     }

 }

 .contenidoP{
    color:#000; 
    font-size:25px; 
    font-weight:bold;
    text-align: justify;
 }
 .fumigadorMosquito{
    height: auto;
    max-height: 100%;
 }