@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Varela+Round&display=swap');


.banner-encontremoslos {
    
    margin-top: 60px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: stretch;
   
    position:relative;
    background: linear-gradient(180deg, #ebebeb 90%, #fff 10%);
    min-height: 180px;
    max-height: 266.64px;
}

.container-banner-encontremoslos{
    background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
    background-repeat: no-repeat, no-repeat !important;
    background-position: right top, left 131px !important;
    width: 100%;
}

.image-right-banner .wpb_single_image {
    margin-top: 0px !important;
}


p.copy-title-banner {
    font-size: 1.5em;
    text-align: center;
    line-height: 1.1;
    color: #00b3fe;
    font-weight: bold;
    font-family: 'Varela Round', sans-serif;
    margin-top:57px;
}

p.copy-banner-message {
    text-align: center;
    font-size: 1.3em;
    line-height: 1;
    color: #3a3a3a;
   
    font-family: 'Varela Round', sans-serif;
}

.copys-container-banner {
   display:flex;
}





.left-banner-container.col-md-3.col-lg-3 {
    text-align: right;
}


.left-banner-container.col-md-3.col-lg-3 img {
    position: relative;
    top: 29px;
}
.right-banner-container.col-md-3.col-lg-3 img {
    position: relative;
    top: -1px;
    width: 248px;
    z-index: 1;
}


@media (max-width:991px){
    .left-banner-container.col-md-3.col-lg-3{
        display:none;
    }
    
    .right-banner-container.col-md-3.col-lg-3{
        display:none;
    }
    
    
}

@media (min-width:320px) and (max-width:348px){
    
    .container-banner-encontremoslos {
    background-image: none;
    background-repeat: no-repeat, no-repeat !important;
    background-position: right top!important;
}

p.copy-title-banner {
    font-size: 1em;
    text-align: center;
    line-height: 1.1;
    color: #00b3fe;
    font-weight: bold;
    font-family: 'Varela Round', sans-serif;
    margin-top: 11px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

p.copy-banner-message {
    text-align: center;
    font-size: 0.9em;
    line-height: 1;
    color: #3a3a3a;
    font-family: 'Varela Round', sans-serif;
    width: 74%;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}
}

@media (min-width:349px) and (max-width:364px){
    
     .container-banner-encontremoslos {
    background-image: none;
    background-repeat: no-repeat, no-repeat !important;
    background-position: right top!important;
}

p.copy-title-banner {
    font-size: 1em;
    text-align: center;
    line-height: 1.1;
    color: #00b3fe;
    font-weight: bold;
    font-family: 'Varela Round', sans-serif;
    margin-top: 25px;
    width: 83%;
    margin-left: auto;
    margin-right: auto;
}

p.copy-banner-message {
    text-align: center;
    font-size: 0.9em;
    line-height: 1;
    color: #3a3a3a;
    font-family: 'Varela Round', sans-serif;
    width: 65%;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}

}

@media (min-width:365px) and (max-width:385px){    
    .container-banner-encontremoslos {
    background-image: none;
    background-repeat: no-repeat, no-repeat !important;
    background-position: right top!important;
}


p.copy-title-banner {
    font-size: 1.1em;
    text-align: center;
    line-height: 1.1;
    color: #00b3fe;
    font-weight: bold;
    font-family: 'Varela Round', sans-serif;
    margin-top: 21px;
    width: 86%;
    margin-left: auto;
    margin-right: auto;
}

p.copy-banner-message {
    text-align: center;
    font-size: 1em;
    line-height: 1;
    color: #3a3a3a;
    font-family: 'Varela Round', sans-serif;
    width: 68%;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}

}

@media (min-width:386px) and (max-width:430px){   
     .container-banner-encontremoslos {
    background-image: none;
    background-repeat: no-repeat, no-repeat !important;
    background-position: right top!important;
}

p.copy-title-banner {
    font-size: 1.2em;
    text-align: center;
    line-height: 1.1;
    color: #00b3fe;
    font-weight: bold;
    font-family: 'Varela Round', sans-serif;
    margin-top: 16px;
    width: 88%;
    margin-left: auto;
    margin-right: auto;
}
    
    p.copy-banner-message {
    text-align: center;
    font-size: 1.1em;
    line-height: 1;
    color: #3a3a3a;
    font-family: 'Varela Round', sans-serif;
    width: 71%;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}
    
}

@media (min-width:431px) and (max-width:515px){
    .container-banner-encontremoslos{
    background-image: url(images/fondo-banner-encontremoslos-2-top.jpg);
    background-repeat: no-repeat !important;
    background-position: right top !important;
}

p.copy-title-banner {
    font-size: 1em;
    text-align: center;
    line-height: 1.1;
    color: #00b3fe;
    font-weight: bold;
    font-family: 'Varela Round', sans-serif;
    margin-top: 37px;
}

p.copy-banner-message {
    text-align: center;
    font-size: 0.9em;
    line-height: 1;
    color: #3a3a3a;
    font-family: 'Varela Round', sans-serif;
    margin-bottom: 0px;
}
}

@media (min-width:516px) and (max-width:673px){
    .container-banner-encontremoslos{
    background-image: url(images/fondo-banner-encontremoslos-2-top.jpg);
    background-repeat: no-repeat !important;
    background-position: right top !important;
}

p.copy-title-banner {
    font-size: 1.2em;
    text-align: center;
    line-height: 1.1;
    color: #00b3fe;
    font-weight: bold;
    font-family: 'Varela Round', sans-serif;
    margin-top: 37px;
}

p.copy-banner-message {
    text-align: center;
    font-size: 1.1em;
    line-height: 1;
    color: #3a3a3a;
    font-family: 'Varela Round', sans-serif;
    margin-bottom: 0px;
}

}


@media (min-width:674px) and (max-width:991px){
    
 .container-banner-encontremoslos {
    background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
    background-repeat: no-repeat, no-repeat !important;
    background-position: right top, left 67px !important;
}
p.copy-title-banner {
    font-size: 1.5em;
    text-align: center;
    line-height: 1.1;
    color: #00b3fe;
    font-weight: bold;
    font-family: 'Varela Round', sans-serif;
    margin-top: 13px;
}


p.copy-banner-message {
    text-align: center;
    font-size: 1.3em;
    line-height: 1;
    color: #3a3a3a;
    font-family: 'Varela Round', sans-serif;
    margin-bottom: 34px;
}
span.menu-image-title-after.menu-image-title {
    font-size: 11px;
}

.logo-img {
    z-index: 99;
    position: absolute;
    left: 7px;
    height: 73px;
    top: 17px;
}

.logo-scroll {
    z-index: 99;
    position: absolute;
    left: 33px;
    height: 62px;
    top: 1px;
}
}
@media (min-width:992px) and (max-width:1024px){
    span.menu-image-title-after.menu-image-title {
        font-size: 11px;
    }
    
    .logo-img {
        z-index: 99;
        position: absolute;
        left: 7px;
        height: 73px;
        top: 17px;
    }
    
    .logo-scroll {
        z-index: 99;
        position: absolute;
        left: 33px;
        height: 62px;
        top: 1px;
    }
}
@media (min-width:1025px) and (max-width:1040px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 140px !important;
        width: 100%;
    }
    span.menu-image-title-after.menu-image-title {
        font-size: 11px;
    }

    .logo-img {
        z-index: 99;
        position: absolute;
        left: 7px;
        height: 73px;
        top: 17px;
    }
    
    .logo-scroll {
        z-index: 99;
        position: absolute;
        left: 33px;
        height: 62px;
        top: 1px;
    }
}

@media (min-width:1041px) and (max-width:1050px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 143px !important;
        width: 100%;
    }
}

@media (min-width:1051px) and (max-width:1071px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 146px !important;
        width: 100%;
    }
}

@media (min-width:1072px) and (max-width:1078px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 150px !important;
        width: 100%;
    }
}

@media (min-width:1078px) and (max-width:1086px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 151px !important;
        width: 100%;
    }
}
@media (min-width:1087px) and (max-width:1099px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 151px !important;
        width: 100%;
    }
}
@media (min-width:1100px) and (max-width:1111px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 151px !important;
        width: 100%;
    }

    .left-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 29px;
        width: 74%;
        left: 20px;
    }
}

@media (min-width:1112px) and (max-width:1119px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 151px !important;
        width: 100%;
    }
}

@media (min-width:1119px) and (max-width:1137px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 123px !important;
        width: 100%;
    }
    .right-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 5px;
        width: 84%;
    }

    .left-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 46px;
        width: 68%;
    }
}
@media (min-width:1138px) and (max-width:1148px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 126px !important;
        width: 100%;
    }
    .right-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 5px;
        width: 84%;
    }

    .left-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 46px;
        width: 68%;
    }
}

@media (min-width:1149px) and (max-width:1157px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 169px !important;
        width: 100%;
    }
    .left-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 29px;
        width: 82%;
        left: 49px;
    }
    .right-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: -1px;
        width: 95%;
    }
}

@media (min-width:1158px) and (max-width:1169px){
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 151px !important;
        width: 100%;
    }

    .left-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 29px;
        width: 75%;
        left: 20px;
    }
    .right-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 2px;
        width: 91%;
    }

}

@media (min-width:1170px) { 
    .left-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 29px;
        width: 74%;
        left: 20px;
    }
    .container-banner-encontremoslos {
        background-image: url(images/fondo-banner-encontremoslos-2-top.jpg), url(images/fondo-banner-encontremoslos-2bottom.jpg);
        background-repeat: no-repeat, no-repeat !important;
        background-position: right top, left 146px !important;
        width: 100%;
    }

    .right-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 5px;
        width: 233px;
    }
}

@media (min-width:1339px) {
    .left-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 29px;
        width: 65%;
        left: 20px;
    }

}

@media (min-width:1511px) { 
    .left-banner-container.col-md-3.col-lg-3 img {
        position: relative;
        top: 29px;
        width: 56%;
        left: 20px;
    }
}
@media (min-width:1700px) { 
.left-banner-container.col-md-3.col-lg-3 img {
    position: relative;
    top: 29px;
    width: 48%;
    left: 20px;
}
}
@media(max-width:1100px){
.left-banner-container.col-md-3.col-lg-3 img {
    position: relative;
    top: 67px;
    width: 70%;
    left: 6px;
}
}



.well {
   
    margin-top: 20px;
}