body {
}

.banner-main{
    position: relative;
    width: 100%;
    max-width: 100%
}

.content-title-rybelsus{
    position: absolute;
    top: 0;

}

.content-descuentos-hex {
    display: flex;
    justify-content: center;
    flex-direction: row;
    width: 100%;
    gap: 5%;
    margin-top: calc(-8% + 3rem);
}
.descuentos-ex-title {
    font-size: 2.3rem;
    font-weight: 500;
    letter-spacing: 2;
    color: #4C25A3;
    line-height: 1;
    -webkit-text-stroke: .2px;

}


.start-suscripcion {
    margin: 2rem 0;
}
.btnSuscripcion {
    /*#171c8f #f8aa19*/
    /*background: linear-gradient(90deg, #171c8f 10%, #171c8f 68%, #f8aa19 96%, #f8aa19 100%);*/
    background: linear-gradient(86deg, #171c8f -5%, #F8AA19 200%);
    padding: 1.2rem 2.2rem 1.4rem;
    /*background-color: #171c8f;*/
    text-align: center;
    color: #FFFFFF;
    font-size: 1.6rem;
    border-radius: 6rem;
    font-weight: 700;
    letter-spacing: 2;
    margin: 0 .5rem;
    cursor: pointer
}
.btnSuscripcionSolid {
    background: linear-gradient(86deg, #171c8f -5%, #F8AA19 200%);
    padding: 1.2rem 2.2rem 1.4rem;
    text-align: center;
    color: #FFFFFF;
    font-size: 1.5rem;
    border-radius: 6rem;
    font-weight: 700;
    letter-spacing: 2;
    margin: 0 .5rem;
    cursor: pointer
}

.btnSuscripcionWhats {
    background: #25d366;
    padding: 1.2rem 1.7rem 1.4rem;
    text-align: center;
    color: #FFFFFF;
    font-size: 1.3rem;
    border-radius: 6rem;
    font-weight: 700;
    letter-spacing: 1;
    margin: 0 .5rem;
    cursor: pointer;
    display: flex;
    align-items: flex-end
}

.btnSuscripcionWhats i {
    font-size: 1.7rem;
    padding-right: .3rem
}

#videoContent .btnSuscripcion {
    padding: 1rem 2.4rem 1.3rem;
}

#videoContent .btnSuscripcionWhats i {
    font-size: 1.7rem;
    padding-right: .3rem
}


.btnSuscripcion:hover, .btnSuscripcionSolid:hover{
    background-color: #fd8323;
    transition-duration: .25s
}
.beneficioPaciente {
    font-size: 1.7rem
}

.content-title-rybelsus {
    width: 100%;
    text-align: center;
    color: #FFFFFF;
    font-size: 1.6rem;
    font-weight: 400;
    letter-spacing: 3;
    top: 1vw;
    transition-duration: .5s
}
.imgTitleRyblesus {
    width: 16rem;
    transition-duration: .5s
}
/*mod*/
.content-points-l {
    color: #00A5DE;
    padding: 0 7px;
    font-size: 1.25rem;
    font-weight: 800;
}

.content-points-r {
    color: #00A5DE;
    padding: 0 7px;
    font-size: 1.25rem;
    font-weight: 800;
}

.benefits-sub {
    display: flex;
    justify-content: center;
    text-align: center;
    margin: 0;
    padding: 0 .4rem
}

.order-secction {
    display: flex;
    flex-direction: column
}
.content-img-benefit {
    display: flex;
    justify-content: center
}

.img-benefit {
    width: 90px;
    height: 90px
}

.lineHeight12 {
    line-height: 1.2
}

.lineHeight15 {
    line-height: 1.5
}

.content-rybelsus .benefit-title {
    font-size: 1.2rem;
    color: #482d8c
}
.benefit-subtitle {
    font-size: 1.2rem;
    color: #666666
}

.quest-rybelsus {
    margin: 1rem 0;
    cursor: pointer;
    font-size: 1.4rem;
    font-weight: 400;
    color: #FFFFFF;
    padding: 0 1.5rem;
    display: flex;
    justify-content: space-between;
}

.quest-info-rybelsus {
    padding: 0 2rem;
    color: #666666;
    font-size: 1.2rem;
}

.content-rybelsus .img-flecha {
    width: 50px;
    height: 25px;
    filter: invert(65%) sepia(74%) saturate(295%) hue-rotate(346deg) brightness(148%) contrast(140%);

}
.statusArrow[aria-expanded="true"] .img-flecha {
    filter: invert(79%) sepia(52%) saturate(2994%) hue-rotate(228deg) brightness(109%) contrast(85%);
}

.statusArrow[aria-expanded="true"] .flecha-option {
    transform: rotateZ(-180deg);
}

.statusArrow[aria-expanded="true"] .flecha-option .maxStat {
    display: none
}
.statusArrow[aria-expanded="true"] .flecha-option .menosStat {
    display: flex
}

    .quest-change {
        color: #666666;
    }

.cntntQuest:has(.statusArrow[aria-expanded="true"]) {
    border: 1px solid #482D8C;
}
.cntntQuest:has(.statusArrow[aria-expanded="true"]) .quest-change {
    color: #482D8C;
}

.flecha-option {
    width: fit-content;
    height: 100%
}
.container-rybelsus {
    padding: .7rem
}

.container-rybelsus-quests{
    padding: 0.3rem 2% 0
}

.hexa-form {
    position: relative;
    z-index: 1;
    overflow-y: clip;
    align-items: center;
    display: flex;
    text-align: center;
    font-size: 1.45rem;
    justify-content: center
}

.sq-right, .sq-left {
    position: absolute;
    height: 20rem;
    width: 20rem;
    z-index: -1;
    transform: rotate(45deg);
    background-color: #171c8f
}
.sq-left{
    left: -.2rem
}
.sq-right{
    right: -.2rem
}
.save-time {
    color: #482d8c;
    font-size: 1.9rem
}
.save-time span{
    font-weight: 600
}

.text-size{
    font-size: 1.45rem
}

.textSizeProgram {
    color: #666666;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: .6px;
}

@media(min-width: 768px){
    .textSizeProgram{
        font-size: 1.7rem
    }
}
.send-not {
    font-size: 1.4rem;
    text-align: center;
    letter-spacing: .9;
    font-weight: 500;
    color: #666666
}

@media(min-width: 992px){
    .send-not{
        font-size: 1.2rem;
    }
}

.address-locat {
    font-size: 1.8rem;
    letter-spacing: 1;
    color: #482D8C;
    font-weight: 600;
    -webkit-text-stroke: .2px;
}
.docs-hand{
    font-size: 1.45rem
}

.text-program-sus {
    font-size: 1.75rem;
    letter-spacing: 1.7;
    font-weight: 500;
    color: #f1511e
}

.dv-image-color-rybel{
    margin: 2rem 0 1.5rem
}

.quest-rybel-title {
    color: #482D8C;
    font-size: 1.85rem;
    font-weight: 500;
    margin-bottom: 2.5rem
}

.content-logo-send{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}

.send-logo {
    width: 38%;
    margin-top: 1.5rem 
}

.hexa-form-rewor {
    width: 27rem;
    display: flex;
    position: relative;
    justify-content: center;
    max-width: 100%;
}

.image-hexa{
    position: absolute;
    top: 24%;
    width: 88% !important
}

.text-mssi{
    position: absolute;
    top: 15%;
    color: #171C8F;
    font-weight: 700;
    font-size: 1.05rem
}

.interval-mss{
    position: absolute;
    top: 72%;
    color: #171c8f;
    font-weight: 500;
    font-size: .55rem
}

.item-content{
    width: 100%;
}

@media(min-width: 576px) {
    .benefits-sub {
        padding-left: 15px;
        padding-right: 15px;
    }
    .content-rybelsus .benefit-title {
        font-size: 1.5rem
    }
    .benefit-subtitle {
        font-size: 1.3rem
    }
    .quest-rybelsus {
        font-size: 1.7rem
    }
    .descuentos-ex-title {
        font-size: 2.7rem;
    }
    .text-size {
        font-size: 2.2rem
    }
    .textSizeProgram {
        font-size: 1.7rem
    }
    .btnSuscripcion, .btnSuscripcionSolid {
        font-size: 2.4rem;
        padding: 1.3rem 3.3rem 1.5rem;
    }
    #videoContent .btnSuscripcion{
        font-size: 2.1rem;
        padding: 1rem 5.5rem 1.3rem;
    }
    .btnSuscripcionWhats {
        font-size: 2.1rem;
        padding: 1.2rem 2.5rem 1.5rem;
    }
    #videoContent .btnSuscripcionWhats {
        font-size: 2rem;
        padding: 1.2rem 3.5rem 1.5rem;
    }
    .btnSuscripcionWhats i{
        font-size: 3.5rem
    }
    #videoContent .btnSuscripcionWhats i {
        font-size: 2.4rem;
    }
    .hexa-form {
        width: 80%
    }
    .imgTitleRyblesus {
        width: 22rem
    }
    .content-title-rybelsus {
        font-size: 1.8rem;
        top: 1.5vw;
    }
    .content-rybelsus .benefit-title {
        font-size: 1.45rem;
    }
    .text-program-sus {
        font-size: 1.85rem;
    }
    .content-logo-send {
        width: 50%;
        display: flex;
        justify-content: space-evenly
    }
    .send-logo{
        width: 40%;
        margin-top: 0;
    }
    .text-mssi {
        font-size: 1.4rem
    }

    .interval-mss {
        font-size: .8rem
    }
}

@media(min-width: 768px) {
    .content-points-l {
        padding-left: 15px;
        font-size: 1.25rem;
        font-weight: 800;
    }

    .content-points-r {
        padding-right: 15px;
        font-size: 1.25rem;
        font-weight: 800;
    }


    .hexa-form {
        width: fit-content;
        font-size: 1.6rem;
    }

    .content-descuentos-hex img {
        width: 100%
    }

    .start-suscripcion {
        margin: 1.5rem 0;
    }

    .docs-hand {
        font-size: 1.55rem
    }

    .dv-image-color-rybel {
        margin: 1rem 0
    }

    .quest-rybel-title {
        font-size: 2.3rem;
    }

    .text-mssi {
        font-size: 1.9rem
    }

    .interval-mss {
        font-size: 1.05rem
    }

    .container-rybelsus-quests {
        padding: 0.3rem 8% 0
    }

    #videoContent .btnSuscripcionWhats {
        align-items: center
    }
}

@media(min-width: 992px) {
    .item-content {
        width: 50%;
    }
    .content-points-l {
        padding-left: 8rem;
        font-size: 1.25rem;
        font-weight: 800;
    }

    .content-points-r {
        padding-right: 8rem;
        font-size: 1.25rem;
        font-weight: 800;
    }
    .descuentos-ex-title {
        font-size: 3.9rem;
    }
    .btnSuscripcion, .btnSuscripcionSolid{
        font-size: 2.1rem;
    }
    .btnSuscripcionWhats{
        font-size: 1.9rem
    }
    #videoContent .btnSuscripcion {
        font-size: 2.1rem;
        padding: 1rem 4rem 1.2rem;
    }
    #videoContent .btnSuscripcionWhats {
        font-size: 1.8rem;
        align-items: flex-end;
    }
    .imgTitleRyblesus {
        width: 26rem
    }
    .content-title-rybelsus {
        font-size: 2.3rem;
        top: 2vw;
    }
    .text-program-sus {
        font-size: 2.1rem;
    }
}

@media(min-width: 1200px){
    .container-rybelsus {
        padding: 0 7%
    }
    .imgTitleRyblesus {
        width: 36rem
    }
    .content-title-rybelsus {
        font-size: 3rem;
        top: 4vw;
    }
    .send-not {
        font-size: 1.6rem;
    }
    .address-locat {
        font-size: 2rem;
    }
    .docs-hand {
        font-size: 1.7rem
    }
    
}

@media(min-width: 1400px){
    .content-descuentos-hex {
        margin-top: calc(-8%);
    }
    .container-rybelsus-quests {
        padding: 0.3rem 15% 0
    }
}

/*margin-top: 45% margin-top: 64vh*/
/*Añade video*/
.textPasoRybelsus {
    font-size: 1.6rem;
    text-transform: uppercase;
    font-weight: bold;
    background-color: #171c8f;
    color: white;
    padding: 1rem;
    text-align: center;
}

.fondoRybelsusArch {
    object-fit: contain
}
/*@media(min-width: 992px){
    .fondoRybelsusArch{
        object-fit: contain
    }
}*/


.imgDoc{
    width: 5.5rem;
    margin-right: 1rem
}

.descripcionDoc {
    font-size: 1.6rem;
    color: #4C25A3;
    font-weight: 800;
}
.textDoc{
    font-size: 1.35rem;
    color: #666666;
}

.cntntImgPay img{
    width: 7rem;
    margin: 0 .5rem
}
@media(min-width: 576px){
    .cntntImgPay img {
        width: 10rem;
    }
}

.sectionSteps {
    height: 42rem;
    width: 100%;
    background: linear-gradient(180deg, #171C8F 40%, #5F28AA 82%, #FFFFFF 68%);
}

.cntntCardStep {
    border: 2px solid #482D8C99;
    width: 34rem;
    height: fit-content;
    background-color: #FFFFFF;
    display: flex;
    align-items: center;
    flex-direction: row;
    border-radius: 1.5rem;
}
    .cntntCardStep div:last-child{
        width: 100%
    }
    .cntntCardStep div:has(img) {
        width: 5.5rem;
    }

.cntntCardStep img{
    width: 100%
}

@media(min-width:992px) {
    .sectionSteps{
        height: 32rem
    }
    .cntntCardStep div:last-child {
        width: fit-content
    }
        .cntntCardStep img {
        width: 7.5rem;
    }
    .cntntCardStep {
        border-radius: 0;
        width: 27rem;
        height: 18rem;
        flex-direction: column;
    }
}
.cntntQuest {
    width: 100%;
    border-bottom: 2px solid #ffffff;
    padding: .5rem 0;
    border: 1px solid #666666;
    margin-bottom: 1rem
}

.circleStatus{
    height: 3rem;
    width: 3rem;
    border: 1px solid #000000;
    border-radius: 50%;
}

.menosStat {
    display: none;
    color: #000000;
    height: 100%;
    justify-content: center;
    align-items: center;
}

.maxStat {
    color: #000000;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.imgProdRybelsus{
    width: 80%;
    object-fit: contain
}
.borderProgram {
    border-left: 0
}

.byPart1 {
    font-size: 1.7rem;
    font-weight: 500;
    width: 38rem
}

.byPart2 {
    width: 38rem;
    display: flex;
    align-items: end;
    font-size: 1.2rem;
    justify-content: center
}
.cntntLogosPaq {
    width: 100%;
}

@media(min-width: 576px){
    .cntntLogosPaq {
        width: 70%;
    }

    .byPart1 {
        font-size: 1.9rem;
    }

    .byPart2 {
        font-size: 1.4rem;
    }
}

@media(min-width: 992px) {
    .byPart1 {
        font-size: 2rem
    }
    .byPart2 {
        font-size: 1.5rem;
        justify-content: start
    }
}
@media(min-width: 1200px){
    .byPart1{
        font-size: 2.2rem
    }
    .byPart2 {
        font-size: 1.7rem
    }
}

@media(min-width: 992px){
    .imgProdRybelsus{
        width: 100%;
    }
    .borderProgram {
        border-left: 4px solid #FFFFFF;
    }
}

.bannerDescuentoRybelsus{
    margin-top: -8%;

}

@media(max-width: 800px) {
    .bannerDescuentoRybelsus {
        margin-top: 0;

    }
    .bannerDescuentoRybelsus img {
        width: 80%;
    }
}