:root {
    --primary-color:#e99e88;
    --secondary-color:#f33e67; 
    --tertiary-color: rgb(72, 180, 184);
}

.container__city_bar{
    display: flex;
    justify-content: center;
    align-items: center;

    position: -webkit-sticky;
    position: sticky;
    top: 0px;

    /* background-color: rgba(185, 31, 1, 0.9); */
    padding: 20px 0;

    z-index: 1000;
}

.city_bar{

    border: 1px solid red;
    background-color:#212529;
    border-radius:10px;
    padding: 15px 80px;

    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.city_bar p{
    display: inline-block;
    font-size: 20px;
    font-family: Montserrat, sans-serif;
    font-weight: 600;
    color: #fff;
    text-align: center;
    margin: 0;
}

.city{
    font-weight: bold;
    color: rgb(255, 255, 0);
    text-decoration: underline;
}

.notify{
    width: 350px;
    height:150px;
    background-color: #fff;

    border: 1px solid black;
    border-radius: 10px;
    box-shadow: 0 0 1px hsla(0deg,0%,0%,.075),0 1px 2px hsla(0deg,0%,0%,.075),1px 2px 4px hsla(0deg,0%,0%,.075),1px 3px 8px hsla(0deg,0%,0%,.075),2px 4px 16px hsla(0deg,0%,0%,.075);

    display: flex;
    flex-direction: column;
    justify-content: space-around;

    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1;
    margin: 10px;
}

.notify__container{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.notify__container-img{
    padding-left: 20px;
    padding-right: 10px;
}

.notify__img{
    width: 80px;
    height: 80px;
    border-radius: 100%;
}

.notify__description{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-right: 20px;
    padding-left: 10px;

    font-size: 16.5px;
    font-family: poppins, sans-serif;
}

.notify__title{
    margin-bottom: 10px;
    font-weight: bold;
}

.notify__subtitle{
    margin: 0;
}

.notify__timerBar{
    width:100%;
    height:5px;
    background-color:#e99e88;

    transform-origin: left center;
    animation: roundtime 10s linear forwards;

    animation-iteration-count:infinite;
    
}

@keyframes roundtime {
    to {
      /* More performant than `width` */
      transform: scaleX(0);
    }
  }

/*EMPEZAMOS AQUI*/

body {
    position: relative;
    margin: 0;
}

header {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.header--background {
    position: absolute;
    width: 100%;
    height: 667px;
    background-color: var(--secondary-color);
    /* background-image: linear-gradient(124deg, rgb(245, 180, 209) 0%, rgb(237, 136, 181) 100%); */
    z-index: -100;
    top: 0;
    left: 0;
}

.header--title {
    font-family: 'Montserrat', sans-serif;
    font-size: 50px;
    font-weight: 900;
    text-shadow: rgb(0 0 0 / 30%) 2px 0px 2px;
    margin: 0;
    /* margin-top: 50px; */
    margin-top: 10px;
    color: white;
    text-align: center;
    max-width: 1140px;
    width: 100%;
    height: auto;
    line-height: 1.1;
}

.header--title span {
    color: rgb(255, 255, 0);
}

.header--warning{
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 700;
    text-shadow: rgb(0 0 0 / 30%) 2px 0px 2px;
    margin: 0;
    /* margin-top: 50px; */
    margin-top: 10px;
    /* color: white; */
    color: #000000;
    text-align: center;
    max-width: 1140px;
    width: 100%;
    height: auto;
    line-height: 1.5;

    /* background-color: rgb(255, 255, 0); */

    padding: 20px 20px;
}

.header--warning span{
    color: rgb(255, 0, 0);
}

.header--subtitle {
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    text-shadow: rgb(0 0 0 / 30%) 2px 0px 2px;
    margin: 0;
    margin-top: 10px;
    margin-bottom: 15px;
    color: white;
    text-align: center;
    width: 100%;
    height: auto;
    font-weight: 800;
}

.header--container {
    max-width: 1150px;
    width: 100%;
    height: auto;
    padding: 0 20px;
    /*SI QUIERE MAS PADDING, TAMBIEN DEBES AGRANDAR EL MAX-WIDTH*/
}

.header--video {
    width: 100%;
    height: auto;
    border-radius: 20px;
    border: 5px solid white !important;
    box-shadow: 5px 10px 30px #000000;
    margin-bottom: 35px;
}

.ability--video{
    width: 100%;
    height: 700px;
    border-radius: 20px;
    border: 5px solid white !important;
    box-shadow: 5px 10px 30px #000000;
    margin: 0 auto;
    margin-bottom: 35px;

}

.header--question {
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    font-weight: 600;

    color: rgba(0, 0, 0);

    /* background-color:  #FFEA00; */

    text-shadow: rgba(255, 255, 255) 2px 0px 2px;
}

.header--phrase{
    font-family: 'Montserrat', sans-serif;
    font-size: 35px;
    font-weight: 700;

    font-style: italic;

    color: rgba(0, 0, 0);

    text-shadow: rgba(255, 255, 255) 2px 0px 2px;

    text-align: center;
}

.header--phrase span{
    color: #ff0000;
}

.estudiante__img{
    max-width:500px;
    width: 100%;
    height: auto;
    border-radius:10px;
    box-shadow: rgb(0 0 0 / 45%) 0px 4px 8px -1px;
    padding: 5px;
    margin-bottom:16px;
}

img[src="img1.png"] {
    max-width: 400px;
    width: 100%;
    height: auto;
}

img[src="img2.png"] {
    max-width: 512px;
    width: 100%;
    height: auto;
    border-radius: 30px;
}

.main--title:nth-child(1){
    font-family: Montserrat, sans-serif;
    font-weight: 800;
    font-size: 30px;

    text-decoration: underline;
    font-style: italic;
}

.main--title:nth-child(2) {
    font-family: Montserrat, sans-serif;
    font-weight: 800;
    font-size: 25px;
    color: #ff0000;

    text-decoration: underline;
    font-style: italic;
}

.main--subtitle {
    color: #ff0000;
    font-size: 30px;
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    text-align: center;

    padding: 0 15px;
}

.main--container-StudyPlan {
    padding: 0 25px;
}

.main--container-StudyPlan__item {
    max-width: 570px;
    width: 100%;
    height: auto;
    padding: 0 20px;
}

.main--container-StudyPlan__item--title {
    font-family: Montserrat, sans-serif;
    font-size: 28px;
    font-weight: 800;
    color: var(--tertiary-color);
    text-shadow: rgb(0 0 0 / 15%) 1px 1px 2px;
    text-align: center;
}

.main--container-StudyPlan__item--container--description__container--item--text {
    font-family: Montserrat, sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: #212529;
}

.main--container-StudyPlan__item--container--description__container--item--text span {
    font-weight: 700;
    color: var(--tertiary-color);
}

.main--container-StudyPlan__item--container--description__container--item {
    display: flex;
    flex-direction: row;
}

.bold--title {
    font-weight: 800 !important;
}

.bold p {
    font-weight: 600;
}

.bold p span {
    font-weight: 900;
    color: var(--tertiary-color);
}

.main--container-StudyPlan__item--container--description__container--img {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.main--container-StudyPlan__item--container--description__img {
    max-width: 400px;
    width: 100%;
    height: auto;
}

.main--container-StudyPlan__item--container--description__container--item--icon {
    color: rgb(2, 192, 2);
    margin-right: 10px;
    font-size: 20px;
}

.main--container-StudyPlan__item--container--description__text {
    font-family: Montserrat, sans-serif;
    font-size: 20px;
    font-weight: 700 !important;
}

.main--container-StudyPlan__item--container--description__container--img {
    display: flex;
    justify-content: center;
    height: auto;
}

.main--title--bonds {
    font-family: Montserrat, sans-serif;
    color: var(--primary-color);
    font-size: 28px;
    font-weight: 800;
    text-shadow: rgb(0 0 0 / 15%) 1px 1px 2px;

    max-width: 1140px;
    width: 100%;
    height: auto;

    text-align: center;
    margin: 30px auto;

    padding: 0 20px;
}

.main--container--bonds__item--icon {
    font-size: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--tertiary-color);
}

.main--container--bonds__item--title {
    font-family: 'Poppins', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #212529;
    text-align: center;
}

.main--container--bonds__item {
    padding: 10px;
}

.main--container--bonds__item--description {
    font-size: 18px;
    color: #212529;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
}

.main--container--bonds:after {
    content: '';
    background-image: url(./background.png);
    background-repeat: repeat;
    background-position: center center;
    position: absolute;
    top: 670px;
    width: 100%;
    height: 7000px;
    /*2800px*/
    z-index: -1;
    opacity: 0.2;
    /* Here is your opacity */
}

.main--gifs {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.main--gifs--title {
    font-family: Montserrat, sans-serif;
    color: var(--primary-color);
    font-size: 28px;
    font-weight: 800;
    text-shadow: rgb(0 0 0 / 15%) 1px 1px 2px;
    text-align: center;

    max-width: 1075px;
    width: 100%;
    height: auto;
    padding: 0 10px;
}

.main--gifs--subtitle {
    font-family: Montserrat, sans-serif;
    color: #212529;
    font-size: 28px;
    font-weight: 800;
    text-shadow: rgb(0 0 0 / 15%) 1px 1px 2px;
    text-align: center;

    max-width: 1075px;
    width: 100%;
    height: auto;
    padding: 0 10px;
}

.main--gifs--description {
    font-family: Montserrat, sans-serif;
    color: rgb(224, 77, 69);
    font-size: 28px;
    font-weight: 800;
    text-shadow: rgb(0 0 0 / 15%) 1px 1px 2px;
    text-align: center;

    max-width: 1075px;
    width: 100%;
    height: auto;
    padding: 0 10px;

    margin-bottom: 40px;
}

.main--container--gifs__item--container--img {
    display: flex;
    justify-content: center;
    align-items: center;
}

/*esto se usa para imagenes horizontales*/
.main--container--gifs__item--img {
    width: 100%;
    height: auto;
    margin-bottom: 25px;
}

/*usa esto en caso de que tengas una imagen vertical que se haya agrandado*/
.size_gif--1{ 
    width: 100%;
    height: auto;
    margin-bottom: 25px;
}

/*aqui esta bien, la imagen no es vertical, es horizontal*/
.size_gif--2{
    width: 100%;
    height: auto;
    margin-bottom: 25px;
}

/*usa esto en caso de que tengas una imagen vertical que se haya agrandado*/
.size_gif--3{
    width: 70%;
    height: auto;
    margin-bottom: 25px;
}

/*usa esto en caso de que tengas una imagen vertical que se haya agrandado*/
.size_gif--4{
    width: 100%;
    height: auto;
    margin-bottom: 25px;
}

/*usa esto en caso de que tengas una imagen vertical que se haya agrandado*/
.size_gif--5{
    width: 80%;
    height: auto;
    margin-bottom: 25px;
}

.main--container--gifs__item--title {
    font-size: 22px;
    font-weight: 700;
    font-family: 'Poppins', sans-serif;
    text-align: center;
}

del {
    text-decoration-color: red;
    text-decoration-thickness: 4px;
}


.main--container--gifs__item--description {
    font-size: 18px;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
}

.main--offer--title {
    font-size: 40px;
    font-family: Montserrat, sans-serif;
    font-weight: 900;
    color: #212529;
    text-align: center;
    padding: 0 50px;
}



.main--offer {
    background-color: #f7f7f7;
    padding: 50px 0;
}

.main--offer--description {
    color: #212529;
    font-size: 30px;
    font-family: 'Poppins', sans-serif;
    font-weight: 800;
    text-align: center;
}

.main--offer--progressBar--description {
    color: black;
    font-size: 20px;
    font-family: Montserrat, sans-serif;
    font-weight: 700;
    text-align: center;
}

.main--offer--container--img {
    display: flex;
    justify-content: center;
    align-items: center;
}

/*-----------------RECAPITULAR-------------------*/

.main--repeatOffer--tittle{
    font-size: 40px;
    font-weight: 900;
    text-shadow: rgba(0, 0, 0, 0.3) 2px 2px 1px;
    font-family: Montserrat, sans-serif;
    color: rgb(255, 255, 255);
    text-align: center;
    margin: 0;

    text-decoration: underline;
}

.main--repeatOffer--subtittle{
    font-family: Montserrat, sans-serif;
    font-size: 30px;
    font-weight: 500;
    text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 2px;
    letter-spacing: -0.5px;
    line-height: 1.2em;
    color: rgb(255, 255, 255);
    
}

.main--repeatOffer--recapitulate{
    margin: 0 auto;

    font-family: Montserrat, sans-serif;
    font-size: 20px;
    color: rgba(29, 29, 29, 0.84);
    line-height: 1.2em;
    font-weight: 500;

    margin-bottom: 50px;

    padding: 0 20px;
}

.container__recapitulate{
    border: 3px dashed white;    
    border-radius: 10px;
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;

    margin-bottom: 40px;
}

.main--repeatOffer--recapitulate__title{
    font-weight: 900;
    font-size: 40px;
    font-family: Montserrat, sans-serif;
    line-height: 1.25em;
    letter-spacing: -0.3px;

    text-align: center;

    color: #212529;

    margin: 0;
}

.main--repeatOffer--recapitulate__subtitle{
    font-family: Montserrat, sans-serif;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.25em;
    color: white;
    letter-spacing: -0.3px;

    text-align: center;

    text-shadow: rgb(0 0 0 / 30%) 2px 0px 2px;
}

hr{
    border: 1px solid white;
}

.main--repeatOffer--recapitulate__price_1{
    font-family: Montserrat, sans-serif;
    font-size: 60px;
    font-weight: 900;

    text-align: center;

    margin-bottom: 30px;
}

.main--repeatOffer--recapitulate__price_1 span{
    text-decoration: line-through;
    text-decoration-color: red;
    text-decoration-thickness: 10px;
}

.main--repeatOffer--recapitulate__price_2{
    font-size: 30px;
    font-weight: 800;
    font-family: Montserrat, sans-serif;

    text-align: center;

    margin-bottom: 30px;
}

.main--repeatOffer--recapitulate__price_3{
    color:rgb(17, 164, 0);

    font-size: 72px;
    font-weight: 800;
    font-family: Montserrat, sans-serif;
    text-shadow: rgb(0 0 0 / 0%) 0px 0px 0px;

    text-align: center;
}
/*----------------------------------------------*/

.main--offer--img,
.main--img,
.main--repeatOffer--img {
    max-width: 500px;
    width: 100%;
    height: auto;
    padding: 0 5px;
    margin-bottom: 10px;
}

.main--offer--containerPay,
.main--repeatOffer--containerPay,
.main--containerPay {
    display: flex;
    justify-content: center;
    align-items: center;
}

.main--offer--containerPay--icon,
.main--repeatOffer--containerPay--icon,
.main--containerPay--icon {
    font-size: 40px;
}

.main--offer--containerPay--description,
.main--repeatOffer--containerPay--description,
.main--containerPay--description {
    font-size: 26px;
    font-family: Montserrat, sans-serif;
    font-weight: 400;
    color: rgba(29, 29, 29, 0.84);
    margin: 0;
}

.main--warranty {
    background-color: var(--primary-color);
    padding: 25px 0;
}

.main--warranty--img {
    max-width: 320px;
    width: 100%;
    height: auto;
    padding: 10px;
}

.main--warranty--text {
    max-width: 552px;
    width: 100%;
    height: auto;
}

.main--warranty--text__title {
    text-shadow: rgb(0 0 0 / 30%) 2px 0px 1px;
    font-family: Montserrat, sans-serif;
    font-size: 30px;
    color: #fdfdfd;
    font-weight: 700;
}

.main--warranty--text__title span {
    text-decoration: underline;
    text-decoration-color: var(--tertiary-color);
    text-decoration-thickness: 10px;
}

.main--warranty--text__subtitle {
    font-size: 20px;
    text-shadow: rgb(0 0 0 / 30%) 2px 0px 1px;
    font-family: Montserrat, sans-serif;
    font-weight: 700;
    color: white;
    text-decoration: underline;
}

.main--warranty--text__description {
    font-size: 18px;
    text-shadow: rgb(0 0 0 / 30%) 2px 0px 1px;
    font-family: Montserrat, sans-serif;
    font-weight: 600;
    color: white;
}

.main--warranty--text__description span {
    font-weight: 800;
}

.main--opinions {
    padding: 20px 0;
}

.card {
    box-shadow: 5px 10px 20px #363a3d;
    font-family: Montserrat, sans-serif;
    margin-bottom: 30px;
    border-radius: 40px;
}

.card-header {
    font-weight: 700;
    border-radius: 40px;
    padding: 20px;
    margin-top: 30px;
}

.card-header p {
    margin: 0;
    margin-top: 10px;
}

.card img {
    margin: 0;
    /* padding: 0 15px;
    padding-bottom: 15px; */
    border-radius: 0px 0px 40px 40px;
}

.main--opinions--title {
    font-family: Montserrat, sans-serif;
    color: var(--primary-color);
    font-size: 28px;
    font-weight: 800;
    text-shadow: rgb(0 0 0 / 15%) 1px 1px 2px;
    text-align: center;
}

.main--teacher {
    margin-top: 20px;
    /* margin: 20px 0; */
    background-color: #f7f7f7;
    padding: 30px 10px;
}

.main--teacher--title {
    font-family: Montserrat, sans-serif;
    color: var(--primary-color);
    font-size: 28px;
    font-weight: 800;
    text-shadow: rgb(0 0 0 / 15%) 1px 1px 2px;

    margin-bottom: 20px;
}

.main--teacher--container--img {
    max-width: 400px;
    width: 100%;
    height: auto;
    border-radius: 40px;
}

.main--teacher--container--description {
    font-family: Montserrat, sans-serif;
    font-weight: 500;
    font-size: 17px;
}

.main--repeatOffer {
    background-color: var(--primary-color);
    padding: 30px 0;
}

.main--repeatOffer--linear {
    width: 100%;
    height: 4px;
    background-color: black;
}

.main--repeatOffer--description {
    font-size: 40px;
    font-weight: 900;
    text-shadow: rgb(0 0 0 / 30%) 2px 2px 2px;
    font-family: Montserrat, sans-serif;
    text-align: center;
    color: rgb(255, 255, 255);
    margin: 20px 0;
}

.main--repeatOffer--quotas span {
    font-size: 55px;
    font-weight: 900;
    font-family: Montserrat, sans-serif;
    color: #1c1c1c;

    margin-right: 10px;
}

.main--repeatOffer--quotas {
    font-size: 24px;
    font-weight: 600;
    font-family: Montserrat, sans-serif;
    color: #484848;
    text-align: center;

    display: flex;
    justify-content: center;
    align-items: center;

    margin: 0;
}

.main--repeatOffer--discount {
    font-size: 30px;
    font-weight: 800;
    font-family: Poppins, sans-serif;
    color: rgb(224, 77, 69);
    text-shadow: rgb(0 0 0 / 30%) 1px 1px 1px;
    text-align: center;
}

.main--repeatOffer--text {
    font-size: 30px;
    color: #212529;
    font-weight: 800;
    font-family: Poppins, sans-serif;
    text-align: center;
}

.main--frequentQuestions {
    margin-bottom: 50px;
}

.main--frequentQuestions--title {
    font-family: Montserrat, sans-serif;
    /* color: var(--primary-color); */
    font-size: 28px;
    font-weight: 800;
    text-shadow: rgb(0 0 0 / 15%) 1px 1px 2px;
    text-align: center;
    margin: 0;
    margin-top: 25px;
}

.main--certificate--img{
    max-width: 800px;
    width: 100%;
    height: auto;
    /* padding: 10px; */

    margin-bottom: 50px;
}

.container-main__take-action{
    display: flex;
    justify-content: center;
    align-items: center;
}

.main__take-action{
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 800;
    text-shadow: rgb(0 0 0 / 30%) 2px 0px 2px;
    margin: 0;
    /* margin-top: 50px; */
    margin-top: 10px;
    /* color: white; */
    color: #000000;
    text-align: center;
    max-width: 1280px;
    width: 100%;
    height: auto;
    line-height: 1.1;

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

    padding: 20px 20px;
    
}

.main__take-action span{
    color: rgb(255, 0, 0);
}

/*----------Acordeon------------*/
.wrapper {
    width: 100%;
}

/*NUEVO*/

.wrapper-content{
    display: inline-block;
}

.container-question .question::after{
    content: "\002B";
    font-size: 1.5rem;
    /*2.2rem*/
    position: absolute;

    left: 4px;
    top: 17px;


    transition: 0.2s;
    color: rgba(109, 161, 255, 0.9);
}

/*---------*/

.container-question {
    background-color: white;
    color: black;
    border-radius: 10px;
    box-shadow: 0 5px 10px 0 rgba(147, 147, 147, 0.25);
    margin: 20px 0;

    border: 1px solid rgba(109, 161, 255, 0.9);
}

.question {
    font-size: 20px;

    font-family: 'Montserrat', sans-serif;
    font-weight: 600;

    text-align: center;

    padding: 20px 20px 20px 20px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.question::after {
    content: "\002B";
    font-size: 2rem;
    /*2.2rem*/
    position: absolute;

    left: 10px;
    top: 13px;


    transition: 0.2s;
    color: rgba(109, 161, 255, 0.9);
}

.question.active::after {
    transform: rotate(45deg);
}

.answercont {
    max-height: 0;
    overflow: hidden;
    transition: 0.3s;
}

.answer {
    font-size: 18px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    color: rgb(125, 125, 125);

    padding: 0 20px 20px;
    line-height: 1.5rem;
}

@media screen and (max-width: 790px) {
    html {
        font-size: 14px;
    }

    .wrapper {
        width: 100%;
    }
}

/*--------*/

.question {
    font-size: 20px;
    font-family: Montserrat, sans-serif;
    font-weight: 800;
}

.main--container--img {
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer--description {
    font-family: Montserrat, sans-serif;
    font-weight: 400;
    font-size: 16px;
    text-shadow: rgb(0 0 0 / 30%) 2px 0px 0px;
    background-color: var(--primary-color);
    color: #ffffff;
    text-align: center;
    padding: 30px 20px;

    margin: 0;

    margin-top: 50px;
}

/*BUTTON*/
/* CSS */
.button-pay {
    appearance: none;
    background-image: radial-gradient(100% 100% at 100% 0, #ffc001 0, #f0473e 100%);
    border: 0;
    border-radius: 6px;
    box-shadow: rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, rgba(58, 65, 111, .5) 0 -3px 0 inset;
    box-sizing: border-box;
    cursor: pointer;
    height: auto;
    line-height: 1;
    list-style: none;
    overflow: hidden;
    padding-left: 16px;
    padding-right: 16px;
    position: relative;
    text-decoration: none;
    transition: box-shadow .15s, transform .15s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    white-space: nowrap;
    will-change: box-shadow, transform;
    font-family: Montserrat, sans-serif;
    color: #ffffff;
    font-size: 26px;
    font-weight: 700;
    text-align: center;
    width: 420px;
    height: 115px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
        /*centrar boton*/
}

.button-pay:focus {
    box-shadow: #f0473e 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #f0473e 0 -3px 0 inset;
}

.button-pay:hover {
    box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #f0473e 0 -3px 0 inset;
    transform: translateY(-2px);
    color: #ffffff;
    text-decoration: none;
}

.button-pay:active {
    box-shadow: #f0473e 0 3px 7px inset;
    transform: translateY(2px);
}

/*---------------------------------------------*/

.button-pay span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: 30px;
}

.button-pay small {
    margin-top: 10px;
}

/*BUTTON WHATSAPP*/
/* CSS */
.button-whatsapp {
    appearance: none;
    background-image: radial-gradient(100% 100% at 100% 0, #5cd464  0, #35b44c  100%);
    border: 0;
    border-radius: 6px;
    box-shadow: rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, rgba(58, 65, 111, .5) 0 -3px 0 inset;
    box-sizing: border-box;
    cursor: pointer;
    height: auto;
    line-height: 1;
    list-style: none;
    overflow: hidden;
    padding-left: 16px;
    padding-right: 16px;
    position: relative;
    text-decoration: none;
    transition: box-shadow .15s, transform .15s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    white-space: nowrap;
    will-change: box-shadow, transform;
    font-family: Montserrat, sans-serif;
    color: #ffffff;
    font-size: 26px;
    font-weight: 700;
    text-align: center;
    width: 420px;
    height: 115px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
        /*centrar boton*/
}

.button-whatsapp:focus {
    box-shadow: #35b44c  0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #35b44c  0 -3px 0 inset;
}

.button-whatsapp:hover {
    box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #35b44c  0 -3px 0 inset;
    transform: translateY(-2px);
    color: #ffffff;
    text-decoration: none;
}

.button-whatsapp:active {
    box-shadow: #35b44c  0 3px 7px inset;
    transform: translateY(2px);
}

.button-whatsapp span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: 30px;
}

.button-whatsapp small {
    margin-top: 10px;
}
/*---------------------------------------------*/

/*BUTTON FACEBOOK*/
/* CSS */
.button-facebook {
    appearance: none;
    background-image: radial-gradient(100% 100% at 100% 0, #3b5b9b 0, #24448c 100%);
    border: 0;
    border-radius: 6px;
    box-shadow: rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, rgba(58, 65, 111, .5) 0 -3px 0 inset;
    box-sizing: border-box;
    cursor: pointer;
    height: auto;
    line-height: 1;
    list-style: none;
    overflow: hidden;
    padding-left: 16px;
    padding-right: 16px;
    position: relative;
    text-decoration: none;
    transition: box-shadow .15s, transform .15s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    white-space: nowrap;
    will-change: box-shadow, transform;
    font-family: Montserrat, sans-serif;
    color: #ffffff;
    font-size: 26px;
    font-weight: 700;
    text-align: center;
    width: 420px;
    height: 115px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
        /*centrar boton*/
}

.button-facebook:focus {
    box-shadow: #24448c  0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #24448c  0 -3px 0 inset;
}

.button-facebook:hover {
    box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #24448c  0 -3px 0 inset;
    transform: translateY(-2px);
    color: #ffffff;
    text-decoration: none;
}

.button-facebook:active {
    box-shadow: #24448c 0 3px 7px inset;
    transform: translateY(2px);
}

.button-facebook span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: 30px;
}

.button-facebook small {
    margin-top: 10px;
}
/*---------------------------------------------*/

.main--repeatOffer--container--img {
    display: flex;
    justify-content: center;
    align-items: center;
}

.main--repeatOffer--progressBar--description {
    margin: 0;
}

.main--repeatOffer--price,
.main--offer--price {
    font-size: 60px;
    font-weight: 800;
    font-family: Montserrat, sans-serif;
    text-shadow: rgb(0 0 0 / 0%) 0px 0px 0px;
    text-align: center;
}

.main--repeatOffer--price span:nth-child(1),
.main--offer--price span:nth-child(1) {
    color: rgb(0, 0, 126);
    text-decoration: line-through;
    text-decoration-color: red;
    text-decoration-thickness: 15px;
}

.main--repeatOffer--price span:nth-child(2),
.main--offer--price span:nth-child(2) {
    color: rgb(241, 118, 0);
    text-decoration: line-through;
    text-decoration-color: red;
    text-decoration-thickness: 15px;
}

.main--repeatOffer--price span:nth-child(3),
.main--offer--price span:nth-child(3) {
    color: rgb(17, 164, 0);
}

.main--repeatOffer--container--set--img {
    display: flex;
    justify-content: center;
    align-items: center;
}

.main--repeatOffer--set--img {
    max-width: 1000px;
    /*800px*/
    width: 100%;
    padding: 0 10px;
    height: auto;
}

/*-------------------Reloj automatizado----------------*/
.contenedor-reloj {
    /* color: #333; */
    color: black;
    margin: 0 auto;
    /*centrar contador*/
    margin-bottom: 20px;
    padding: 20px;
    text-align: center;

    max-width: 500px;
    width: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* background: linear-gradient(180deg,#000000 0%,#8c0000 100%); */
    /*COLOR DEL FONDO DEL CONTADOR*/
    background-color: rgb(255, 244, 128);

    font-family: Montserrat, sans-serif;

    /* box-shadow: 10px 10px 0px 0px #8c0000; */
    /*SOMBRA DEL CONTADOR*/

}

.headline {
    margin: 0;
    font-size: 25px;
    font-weight: 700;
}

.contenedor-del-dia {
    margin: 0;
    padding: 0;
}

.item-contenedor-del-dia {
    display: inline-block;
    list-style-type: none;
    padding: 0 12px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 800;
}

.item-contenedor-del-dia span {
    display: block;
    font-size: 60px;
    font-weight: 800;
}

.emoji {
    display: none;
    padding: 0 16px;
    padding-top: 16px;
}

.emoji span {
    padding: 5px;
}

/*---------------------------------------------*/

/*--------ESTILOS DEL NUMERO QUE ESTA DENTRO DEL PROGRESS BAR--------*/
.cssProgress {
    max-width: 1140px;
    width: 100%;
    height: auto;
    padding: 0 20px;
    margin: 0 auto;
}

/*-------------------------------------------------------------------*/

/*--------ESTILOS DEL NUMERO QUE ESTA DENTRO DEL PROGRESS BAR--------*7
  .cssProgress-label{
    font-family: Montserrat, sans-serif !important;
    color: white !important;
    font-size: 20px !important;
    font-weight: 800 !important;
  }

  /*-------------------------------------------------------------------*/

/*---------------------------MEDIA QUERYS-----------------------------*/
/*TABLETS*/
@media (max-width: 913px) {


    .header--container {
        padding: 0 30px;
    }

    .header--title {
        padding: 0 30px;
    }

    .bold--title {
        margin-top: 60px;
    }

    .main--offer {
        padding: 50px 30px;
    }

    .main--teacher--container--description {
        margin-top: 30px;
        margin-bottom: 0;
        text-align: center;
    }

    .main--opinions {
        padding: 40px 30px;
    }

    .main--repeatOffer {
        padding: 80px 0;
    }

    .main--frequentQuestions {
        margin-top: 50px;
    }

    .footer--description {
        padding: 30px 40px;
    }
}

@media (max-width: 821px) {
    .main--gifs {
        padding: 20px;
    }
}

@media (max-width: 769px) {

    .main--repeatOffer--tittle{
        font-size: 25px;
    }

    .main--repeatOffer--subtittle{
        font-size: 20px;
    }

    .city_bar{
        padding: 15px 15px;
    }

    .city_bar p{
        font-size:18px;
    }

    .main--container--bonds:after {
        /* top: 300px; */
        top: 360px;
    }

    .header--background {
        /* height: 300px; */
        height: 550px;
    }

    .header--phrase{
        font-size: 25px;
    }

    .header--title {
        /* font-size: 20px; */
        font-size: 25px;
    }

    .header--warning{
        font-size: 15px;
    }

    .main__take-action{
        font-size: 15px;
    }

    .header--subtitle {
        font-size: 16px;
    }

    .header--question {
        font-size: 16px;
    }

    .main--title:nth-child(1) {
        font-size: 25px;
    }

    .main--title:nth-child(2) {
        font-size: 20px;
    }

    .main--subtitle {
        font-size: 21px;
    }

    .main--container-StudyPlan__item--title {
        font-size: 23px;
    }

    .main--title--bonds {
        font-size: 18px;
        padding: 0 20px;
        margin-bottom: 0;
    }

    .main--container--bonds__item--title {
        font-size: 18px;
        margin: 10px 0;
    }

    .main--gifs--title {
        font-size: 18px;
    }

    .main--gifs--subtitle {
        font-size: 18px;
    }

    .main--gifs--description {
        font-size: 20px;
    }

    .main--container--gifs__item--title {
        font-size: 18px;
    }

    .main--offer--title {
        padding: 0 0;
        font-size: 20px;
    }

    .main--offer--description {
        font-size: 20px;
    }

    .main--offer--price,
    .main--repeatOffer--price {
        font-size: 35px;
    }

    .main--offer--price span,
    .main--repeatOffer--price span {
        text-decoration-thickness: 10px !important;
    }

    .main--warranty {
        padding: 50px 25px;
    }

    .main--repeatOffer--description {
        font-size: 18px;
    }

    .main--repeatOffer--linear {
        height: 1px;
    }

    .main--repeatOffer--text {
        font-size: 21px;
    }

    .question {
        font-size: 18px;
    }
}

@media (max-width: 541px) {
    .item-contenedor-del-dia{
        padding: 0 10px;
    }

    .main--repeatOffer--recapitulate__price_1{
        font-size: 50px;
    }
}

/*CELULARES*/
@media (max-width: 468px){

    .container__city_bar{
        background-color: initial;
        padding: 0;
    }

    .city_bar{
        border: 2px solid red;
    }

    .button-pay, .button-whatsapp, .button-facebook {
        width: 300px;
        font-size: 23px;
    }

    .button-pay span, .button-whatsapp span, .button-facebook span {
        margin-left: 10px;
    }

    .main--subtitle {
        font-size: 18px;
    }

    .question{
        font-size:16px;
    }
}

@media (max-width: 415px) {

    .question::after {
        font-size: 23px;
    }

    .main--offer {
        padding: 30px 20px;
    }

    .item-contenedor-del-dia {
        font-size: 12px;
    }

    .contenedor-del-dia span {
        font-size: 30px;
    }

    .main__take-action{
        font-size: 15px;
    }

    .main--repeatOffer--recapitulate__title{
        font-size: 30px;
    }

    .main--repeatOffer--recapitulate__subtitle{
        font-size: 20px;
    }

    .container__recapitulate p{
        font-size: 18px;
    }

    .main--repeatOffer--recapitulate__price_1 span{
        text-decoration-thickness: 5px;
    }

    .main--repeatOffer--recapitulate__price_1{
        font-size: 35px;
    }

    .main--repeatOffer--recapitulate__price_2{
        font-size: 25px;
    }

    .main--repeatOffer--recapitulate__price_3{
        font-size: 60px;
    }

    /*----------------------------------------------*/
    .button-pay, .button-whatsapp, .button-facebook {
        width: 300px;
        font-size: 23px;
    }

    .button-pay span, .button-whatsapp span, .button-facebook span {
        margin-left: 10px;
    }

    .main--offer--containerPay--icon,
    .main--repeatOffer--containerPay--icon,
    .main--containerPay--icon {
        font-size: 30px;
    }

    .main--offer--containerPay--description,
    .main--repeatOffer--containerPay--description,
    .main--containerPay--description {
        font-size: 20px;
    }

    .main--frequentQuestions--title {
        font-size: 25px;
    }
}

@media (max-width: 413px) {}

@media (max-width: 394px) {
    .item-contenedor-del-dia {
        font-size: 10.5px;
    }

    .item-contenedor-del-dia span {
        font-size: 30px;
    }

    .main--repeatOffer--discount {
        padding: 0 20px;
    }

    .main--repeatOffer--quotas span {
        font-size: 45px;
    }

    .main--title {
        padding: 0 30px;
    }
}

@media (max-width: 391px) {}

@media (max-width: 376px) {

    .headline {
        font-size: 20px;
    }

    .item-contenedor-del-dia {
        font-size: 9.5px;
    }

    .item-contenedor-del-dia span {
        font-size: 30px;
    }

    .main--warranty--text__title {
        font-size: 21px;
    }

    .main--opinions--title {
        font-size: 20px;
    }

    .main--teacher--title {
        font-size: 22px;
    }
}

@media (max-width: 361px) {
    .item-contenedor-del-dia {
        font-size: 8.6px;
    }

    .item-contenedor-del-dia span {
        font-size: 30px;
    }

    .main--frequentQuestions--title {
        font-size: 23px;
    }
}

/*--------------------------------------------------------------------*/

/*BOTON WHATSAPP FLOTANTE*/
.float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 20px;
    right: 20px;
    background-color: #25d366;
    color: #ffffff;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 2000;

    display: flex;
    justify-content: center;
    align-items: center;

    transition: 0.5s;
}

.float:hover {
    color: #25d366;
    background-color: #ffffff;
    border: 2.5px solid #25d366;
}

/*ANIMACION BOTON WHATSAPP*/

/*La propiedad "animation-delay" SOLO establece un retraso inicial*/

@keyframes glowing {
    0% {
        box-shadow: 0 0 -10px #c4a300;
    }

    40% {
        box-shadow: 0 0 20px #c4a300;
    }

    60% {
        box-shadow: 0 0 20px #c4a300;
    }

    100% {
        box-shadow: 0 0 -10px #c4a300;
    }
}

@keyframes horizontal-shaking {
    0% {
        transform: translateY(0)
    }

    25% {
        transform: translateY(5px)
    }

    50% {
        transform: translateY(-5px)
    }

    75% {
        transform: translateY(5px)
    }

    100% {
        transform: translateY(0)
    }
}

.button-glow {
    animation: glowing 2000ms infinite, horizontal-shaking 4s infinite;
}

/*-------------------------------------------------------------*/