
.content__body {
    display: flex;
    top: 3rem;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 33rem;
    max-height: 35rem;
}
.cBody__right { flex-direction: row; }
.cBody__left { flex-direction: row-reverse; }

.primary__content {
    position: relative;
    width: 75%;
}
.primary__content.full__width {width: 100%;}
.primary__content__caption {
    width: 100%;
    position: absolute;
    top: 6rem;
    padding-left: 2rem;
    padding-top: 1.5rem;
    padding-right: 0.5rem;
    padding-bottom: 1.5rem;
    background-image: url("/images/banners/trazado_banner.svg");
    background-repeat: no-repeat;
    background-position: left;
    background-size: 50.5rem;
    
    display: flex;
    flex-direction: row;
    align-items: center;
}
.primary__content__caption.widthLeft{
    width: 82%;
    background-size: 51rem;
}
.primary__content__caption img {
    width: 35%;
}
.primary__content__caption span.span__title {
    width: 75%;
    margin-left: 2rem;
    font-weight: 700;
}
.primary__content__caption span.span__title p { margin-bottom: 0; max-width: 19rem; }
    
    
.second__content{
    width: 25%;
    /*height: calc(100vh - 10.8rem);*/
    height: auto;
    /*display: flex;*/
    /*flex-direction: column;*/
    /*justify-content: center;*/
    /*align-items: flex-start;*/
    
    /*background-color: aquamarine;*/
}
.second__content__top { background-color: var(--template_color_blue_gray); }
.second__content__bottom { background-color: var(--template_color_red_slider); }

.second__content__top,
.second__content__bottom {
    width: 100%;
    height: 16.5rem;
    padding-left: 2rem;
    padding-right: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.second__content__top p,
.second__content__bottom p {
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: normal;
    text-align: left;
    color: white;
    margin-bottom: 1.5rem;
}
.second__content__top .btn__link,
.second__content__bottom .btn__link{
    font-size: 14px;
    color: white;
}
.second__content__top .btn__link:hover,
.second__content__top .btn__link:focus,
.second__content__bottom .btn__link:hover,
.second__content__bottom .btn__link:focus {
    text-decoration: none;
}

.second__content__top .btn__link:hover,
.second__content__bottom .btn__link:hover {
    background-color: white;
    color: var(--template_color_ginda);
}
.second__content__bottom .btn__link {
}



@media screen and (max-width:1920px){
    .content__body {
        height: 55rem;
        max-height: 55rem;
    }
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 49rem;
        max-height: 55rem;
    }
    .primary__content__caption { top: 11rem; background-size: 74rem; }
    .primary__content__caption.widthLeft { top: 8rem; background-size: 72.5rem; }
    .cBody__right .primary__content__caption { top: 8rem; background-size: 76.7rem; }
    
    .primary__content__caption img { width: 28%; }
    .primary__content__caption.widthLeft img,
    .cBody__right .primary__content__caption img { width: 32%; }
    
    .primary__content__caption span.span__title { margin-left: 4rem;}
    .primary__content__caption span.span__title p { font-size: 20px; max-width: 25rem; }
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p { font-size: 18px;  }
    
    .second__content__top,
    .second__content__bottom{
        height: 24.5rem;
        padding-left: 4rem;
        padding-right: 7rem;
    }
    
}


@media screen and (max-width:1680px){
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 43rem;
    }
    .primary__content__caption { top: 11rem; background-size: 74rem; }
    .primary__content__caption.widthLeft { background-size: 63rem; }
    .cBody__right .primary__content__caption { background-size: 62.6rem; }
   
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p { font-size: 17px; max-width: 21rem;  }
    
    .second__content__top,
    .second__content__bottom{
        height: 21.5rem;
    }
    
}

@media screen and (max-width:1600px){
    .content__body,
    .content__body {
        height: 43rem;
    }
    
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 41rem;
    }
    
    .primary__content__caption.widthLeft { background-size: 59.8rem; }
    .cBody__right .primary__content__caption { background-size: 59.5rem; }
    
    
    .second__content__top,
    .second__content__bottom{
        height: 20.5rem;
    }
   
}

@media screen and (max-width:1495px){
    .second__content__top,
    .second__content__bottom{
        height: 20.4rem;
        padding-left: 3rem;
        padding-right: 4rem;
    }
}
@media screen and (max-width:1450px){
    .second__content__top,
    .second__content__bottom{
        height: 19.8rem;
    }
}

@media screen and (max-width:1440px){
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 39.5rem;
    }
    
    .primary__content__caption { top: 8rem; background-size: 68.7rem; }
    .primary__content__caption.widthLeft { top: 6rem; background-size: 51.3rem; }
    .cBody__right .primary__content__caption { top: 7rem; background-size: 57.7rem; }
    
    /*Imagen principal de slider*/
    .primary__content__caption.widthLeft img, .cBody__right .primary__content__caption img { width: 33%; }
    /* Texto del recuadro transparente*/
    .primary__content__caption.widthLeft span.span__title p, .cBody__right .primary__content__caption span.span__title p {
        font-size: 19px;
        max-width: 21rem;
    }

    .second__content__top,
    .second__content__bottom{
        height: 19.7rem;
        padding-left: 3rem;
        padding-right: 4rem;
    }
    .second__content__top p, .second__content__bottom p { font-size: 18px;}
}
@media screen and (max-width:1390px){
    .second__content__top,
    .second__content__bottom{
        height: 19rem;
    }
}
@media screen and (max-width:1366px){
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 35rem;
    }
    
    .primary__content__caption { top: 8rem; background-size: 68.7rem; }
    .primary__content__caption.widthLeft { top: 6rem; background-size: 51.3rem; }
    .cBody__right .primary__content__caption { top: 6rem; background-size: 51.1rem; }
    
    .second__content__top,
    .second__content__bottom{
        height: 17.5rem;
    }
    .second__content__top p, .second__content__bottom p { font-size: 18px;}
}

@media screen and (max-width:1280px){
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 33rem;
    }
    
    
    .primary__content__caption { background-size: 64.1rem; }
    .primary__content__caption.widthLeft { top: 6rem; background-size: 47.9rem; }
    .cBody__right .primary__content__caption { top: 6rem; background-size: 47.6rem; }
    
    .second__content__top,
    .second__content__bottom{
        height: 16.5rem;
    }
   
}

@media screen and (max-width:1200px){
    .content__body,
    .content__body {
        height: 41rem;
    }
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 31rem;
    }
    
    
    .primary__content__caption { top: 6rem; background-size: 60.7rem; }
    .primary__content__caption.widthLeft { top: 5rem; background-size: 45.1rem; }
    .cBody__right .primary__content__caption { top: 5rem; background-size: 44.9rem; }
    
    .second__content__top,
    .second__content__bottom{
        height: 15.4rem;
    }
   
}

@media screen and (max-width:1024px){
    .content__body,
    .content__body {
        height: 35rem;
    }
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 26rem;
    }
    
    
    .primary__content__caption { background-size: 51.4rem; }
    .primary__content__caption.widthLeft { top: 5rem; background-size: 38rem; }
    .cBody__right .primary__content__caption { top: 4rem; background-size: 39.6rem; }
    
    .primary__content__caption span.span__title p { font-size: 18px; max-width: 22rem; }
    
    .primary__content__caption.widthLeft span.span__title,
    .cBody__right .primary__content__caption span.span__title{ margin-left: 1rem; }
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p { font-size: 15px; max-width: 18rem; }
    
    .second__content__top,
    .second__content__bottom{
        height: 13.4rem;
        padding-left: 3rem;
        padding-right: 4rem;
    }
    .second__content__top p, .second__content__bottom p { font-size: 16px;}
   
}

@media screen and (max-width:912px){
    .content__body, .content__body { height: 31rem; }
    .content__body.cBody__left,
    .content__body.cBody__right { height: 23rem; }
    
    .primary__content__caption { top: 4rem; background-size: 46rem; }
    .primary__content__caption.widthLeft { top: 3rem; background-size: 34.4rem; }
    .cBody__right .primary__content__caption { top: 3rem; background-size: 34.3rem; }
    
    .primary__content__caption.widthLeft img,
    .cBody__right .primary__content__caption img {
        width: 32%;
    }
    
    
    .second__content__top,
    .second__content__bottom {
        height: 11.5rem;
        padding-left: 2rem;
        padding-right: 3rem;
    }

}

@media screen and (max-width:820px){
    .content__body,
    .content__body {
        height: 26rem;
    }
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 19rem;
    }
    
    .primary__content__caption { background-size: 39.4rem; }
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption { top: 3rem; background-size: 31.6rem; }
    
    
    .cBody__right .primary__content__caption img { width: 27%; }
    
    .primary__content__caption span.span__title { margin-left: 1rem; }
    .primary__content__caption span.span__title p { font-size: 16px; max-width: 20rem; }
    
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p { font-size: 12px; max-width: 14rem; }
    
    .second__content__top,
    .second__content__bottom{
        height: 9.5rem;
        padding-left: 2rem;
        padding-right: 2.5rem;
    }
    .second__content__top p, .second__content__bottom p { font-size: 13px;}
}

@media screen and (max-width:768px){
    
    
    .primary__content__caption { background-size: 37.5rem; }
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption { top: 2rem; background-size: 29.1rem; }
    
    
    .primary__content__caption span.span__title { margin-left: 1rem; }
    .primary__content__caption span.span__title p { font-size: 16px; max-width: 20rem; }
    
    
    /*.cBody__right .primary__content__caption img { width: 27%; }*/
    /*.primary__content__caption.widthLeft span.span__title p,*/
    /*.cBody__right .primary__content__caption span.span__title p { font-size: 12px; max-width: 14rem; }*/
    
    /*.second__content__top,*/
    /*.second__content__bottom{*/
    /*    height: 9.5rem;*/
    /*    padding-left: 2rem;*/
    /*    padding-right: 2.5rem;*/
    /*}*/
    /*.second__content__top p, .second__content__bottom p { font-size: 13px;}*/
   
}

@media screen and (max-width:640px){
    .content__body,
    .content__body.cBody__left,
    .content__body.cBody__right { height: 22rem; }
    .primary__content { width: 100%; }
    .primary__content__caption { background-size: 28.3rem; }
    .primary__content__caption img { width: 27%; }
    .primary__content__caption span.span__title p {
        font-size: 12px;
        max-width: 14rem;
    }
    .second__content {
        display: none;    
    }
    
}
@media screen and (max-width:600px){
    .content__body,
    .content__body.cBody__left,
    .content__body.cBody__right { height: 20.5rem; }
    
    
    .primary__content__caption { background-size: 29.3rem; }
    .primary__content__caption.widthLeft, .cBody__right .primary__content__caption {
        background-size: 30.4rem;
    }

    .primary__content__caption.widthLeft img,
    .cBody__right .primary__content__caption img { width: 35%; }
}

@media screen and (max-width:540px){
    .content__body, .content__body.cBody__left, .content__body.cBody__right {
        height: 18.5rem;
    }
    
    /* logo en slider */
    .primary__content__caption.widthLeft img,
    .cBody__right .primary__content__caption img {
        width: 31%;
    }

    .primary__content__caption { background-size: 26.5rem; }
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        background-size: 24rem;
        padding: 0.8rem;
        top: 2.5rem;
    }
    
    .primary__content__caption span.span__title p,
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p {
        font-size: 12px;
        max-width: 11rem;
        line-height: 1;
    }
    .carousel-indicators{
        margin-right: 0;
        margin-bottom: 0;
        margin-left: 0;
        width: 100%;
        bottom: 2rem;
    }
  
}
@media screen and (max-width:448px){
    .content__body, .content__body.cBody__left,
    .content__body.cBody__right {
        height: 13.5rem;
    }
    
    .primary__content__caption.widthLeft img,
    .cBody__right .primary__content__caption img {
        width: 25%;
    }

    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        background-size: 20.45rem;
    }
    .primary__content__caption span.span__title p,
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p {
        font-weight: 500;
    }
}

@media screen and (max-width:425px){
    .content__body, .content__body.cBody__left,
    .content__body.cBody__right {
        height: 14.7rem;
    }
    
    .primary__content__caption.widthLeft img,
    .cBody__right .primary__content__caption img {
        width: 25%;
    }

    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        background-size: 21.2rem;
        padding: 0.5rem;
    }
    .primary__content__caption span.span__title p,
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p {
        font-weight: 500;
    }
}


@media screen and (max-width:414px){
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        background-size: 20.65rem;
    }
}
@media screen and (max-width:412px){
    
    .primary__content__caption span.span__title p,
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p {
        font-size: 11px;
        max-width: 11rem;
        line-height: 1;
    }
    
    .primary__content__caption.widthLeft span.span__title,
    .cBody__right .primary__content__caption span.span__title {
        margin-left: 0.5rem;
    }
    
    .carousel-indicators{ bottom: 0; }
    
}

@media screen and (max-width:395px) {
    .content__body,
    .content__body.cBody__left,
    .content__body.cBody__right {
        height: 13rem;
    }
    .primary__content__caption,
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption{ top: 1rem; }
    
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        top: 2rem;
        background-size: 19.7rem;
        padding: 0.8rem;
    }
}

@media screen and (max-width:390px) {
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        background-size: 19.5rem;
    }
}

@media screen and (max-width:375px) {
    .primary__content__caption,
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption{ top: 1rem; }
    
    .primary__content__caption span.span__title p,
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p {
        font-size: 10px;
    }
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        top: 2rem;
        background-size: 18.8rem;
        padding: 0.9rem;
    }
}

@media screen and (max-width:360px) {
    .primary__content__caption,
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption{ top: 1rem; }
    
    .primary__content__caption span.span__title p,
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p {
        font-size: 10px;
    }
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        top: 3rem;
        background-size: 17.7rem;
        padding: 0.5rem;
    }
}

@media screen and (max-width:320px) {
    .primary__content__caption,
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption{ top: 1rem; }
    
    .primary__content__caption span.span__title p,
    .primary__content__caption.widthLeft span.span__title p,
    .cBody__right .primary__content__caption span.span__title p {
        font-size: 9px;
    }
    .primary__content__caption.widthLeft,
    .cBody__right .primary__content__caption {
        top: 3rem;
        background-size: 15.5rem;
        padding: 0.5rem;
    }
}



















