html{font-size:62.5%}

:root {
	--primary-font: 'Inter';
	--secondary-font: 'Montserrat';
	--tertiary-font: 'Lato';
}
body {
	background: #FFFFFF;
	font-family: var(--primary-font), var(--secondary-font), var(--tertiary-font), Arial;
	margin: 0px;
}
body {
	--primary-color: #134F91;
	--secondary-color: #194E8F;
	--tertiary-color: #808285;
	--secondary-txt: #000000;
	--white-txt: #FFFFFF;
	--gray-txt: #58595B;
}

footer{
    background: #6D6E71;
}
footer div.container div.wrapper-footer{
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 10px 0px 20px 0px;
}


/* Genral styles */
div.wrapper-header div.wrapper-label{
    display: flex;
    align-items: center;
}
div.wrapper-header div.wrapper-label h2{
    margin-left: -26px;
    color: var(--primary-color);
    font-size: 43px;
    font-weight: 700;
}
div.wrapper-header span{
    color: var(--secondary-color);
    font-size: 17px;
    font-style: italic;
    font-weight: 700;
}
div.wrapper-header p{
    color: var(--tertiary-color);
    font-size: 21px;
    font-style: italic;
    font-weight: 400;
    line-height: 137%; /* 28.77px */
}


/* Section Header */
section.section-header{
    text-align: center;
}
section.section-header div.background-section{
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    background-image: url("../../../img/index/background.png");
}
section.section-header img.logo-mex{
    width: 100%;
    max-width: 500px;
    margin: 154px 0px 30px 0px;
}
section.section-header p.compensation{
    margin-top: 50px;
    color: var(--gray-txt);
    text-align: center;
    font-size: 14px;
    font-style: italic;
    font-weight: 300;
    line-height: normal;

    max-width: 441px;
    margin-left: auto;
    margin-right: auto;
}
section.section-header div.container-paragraph{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}
section.section-header div.container-paragraph div.p-content{
    display: flex;
    align-items: center;
}
section.section-header div.container-paragraph div.p-content p.compensation-first{
    display: none;
}
section.section-header div.container-paragraph div.p-content p.second{
    margin-left: 150px;
}
section.section-header p.p-one{
    display: none;
}
section.section-header p.first{
    color: #66686B;
    font-size: 22px;
    font-style: italic;
    font-weight: 400;
    line-height: normal;

    margin-top: -100px;
    max-width: 217px;
    text-align: left;
}
section.section-header p.first span.num{
    color: #66686B;
    font-size: 36px;
    font-style: italic;
    font-weight: 700;
    line-height: normal;
}
section.section-header p.first span.text{
    color: #66686B;
    font-family: Inter;
    font-size: 22px;
    font-style: italic;
    font-weight: 700;
    line-height: normal;
}
section.section-header div.container-paragraph div.p-content p.second{
    color: var(--secondary-color);
    font-size: 22px;
    font-style: italic;
    font-weight: 400;
    line-height: normal;

    margin-top: 220px;
    max-width: 227px;
}
section.section-header div.container-paragraph div.p-content p.second span{
    color: var(--secondary-color);
    font-size: 36px;
    font-style: italic;
    font-weight: 700;
    line-height: normal;
}



/* Section onjetive */
section.section-objective{
    margin-bottom: 157px;
    margin-top: 111px;
    display: flex;
    align-items: center;
}
section.section-objective h2{
    color: #134F91;
    text-align: center;
    font-family: Inter;
    font-size: 35px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
section.section-objective p{
    color: #808285;
    text-align: justify;
    font-family: Inter;
    font-size: 22px;
    font-style: italic;
    font-weight: 400;
    line-height: 32px; /* 145.455% */
    margin-left: 28px;
}


/* Section eligibility */
div.wrapper-cards{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}
section.sectiion-eligibility div.container-img-card{
    max-width: 100px;
    height: 100px;
}
section.sectiion-eligibility div.wrapper-header p{
    margin-left: 28px;
}
div.card{
    width: 206.01px;
    height: 280.34px;
    background: #5CC2E7;
    border-radius: 25px;
    border: none;
    justify-content: center;
    align-items: center;
    margin: 30px;
}
div.card img{
    width: 100%;
}
div.card div.p-container{
    width: 180.74px;
    height: 103.2px;
    background: #194E8F;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}
div.card div.p-container p{
    color: #FFF;
    text-align: center;
    font-family: Inter;
    font-size: 17px;
    font-style: italic;
    font-weight: 600;
    line-height: normal;
}
section.sectiion-eligibility div.wrapper-header{
    display: flex;
    align-items: center;
}

/* Section Register */
section.section-register {
    margin: 75px 0px 75px 0px;
}
section.section-register div.wrapper-header{
    display: flex;
    align-items: center;
}
section.section-register div.wrapper-header p{
    margin-left: 28px;
}
section.section-register div.register-button{
    display: flex;
    align-items: center;
}
section.section-register div.register-button hr{
    width: 100%;
    height: 3px;
    background: linear-gradient(270deg, #00225D 20.49%, #194E8F 81.58%);
    margin-right: 15px;
}
section.section-register div.register-button a{
    width: 191.06px;
    height: 40.2px;
    background: rgba(0, 34, 93, 1);
    color: #FFF;
    text-align: center;
    font-family: Inter;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.44px;
    border-radius: 10px;
    margin-left: 15px;
    padding: 0px 20px 0px 20px;

    display: flex;
    align-items: center;
}

/* Section dictamen */
section.section-dictamen{
    display: flex;
    justify-content: space-between;
    margin-bottom: 123px;
}
section.section-dictamen div.card div.p-container{
    background: #8D9093;
}
section.section-dictamen div.card div.p-container p{
    color: #FFF;
}
section.section-dictamen div.wrapper-header p{
    max-width: 700px;
    margin: 20px;
}

/* section projects */
section.section-projects div.wrapper-header div.wrapper-label h2{
    margin-top: -67px;
    margin-left: -20px;
}
section.section-projects div.wrapper-header div.wrapper-label h2.prop2{
    display: none;
}
section.section-projects div.wrapper-header {
    display: flex;
}
section.section-projects div.wrapper-header p{
    margin-top: -30px;
    margin-left: 28px;
}

/* Section announcement */
section.section-announcement{
    margin: 140px 0px 140px 0px;
    display: flex;
    justify-content: space-around;
}
section.section-announcement div.buttons-download{
    display: flex;
    align-items: center;
    max-width: 260px;
    background: rgba(16, 62, 124, 1);
    width: 257.68px;
    height: 54.22px;
    border-radius: 15px;
    padding: 5px;
}
section.section-announcement div.buttons-download p{
    color: #FFF;
    text-align: center;
    font-family: Inter;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.44px;
    margin: 5px;
}
section.section-announcement div.regis p{
    margin-left: 25px;
}


@media (max-width: 991.99px) {
    section.section-header div.container-paragraph div.p-content p.second {
        margin-left: 0px;
    }
    section.section-dictamen div.wrapper-header p {
        max-width: 300px;
    }
}
@media (max-width: 768.99px) {
    section.section-header div.container-paragraph div.p-content {
        flex-direction: column;
    }
    section.section-header div.container-paragraph div.p-content p.first {
        margin-top: 0px;
        margin-bottom: 50px;
        max-width: 275px;
    }
    section.section-header div.container-paragraph div.p-content p.second {
        margin-top: 0px;
        text-align: left;
        max-width: 275px;
    }
    section.section-header div.container-paragraph div.p-content p.compensation-first{
        display: block;
        max-width: 275px;
    }
    section.section-header p.compensation-second{
        display: none;
    }
    section.section-objective {
        margin-bottom: 100px;
        margin-top: 100px;
        flex-direction: column;
        align-items: start;
    }
    section.section-objective p {
        margin-left: 0px;
    }
    section.sectiion-eligibility div.wrapper-header {
        flex-direction: column;
        align-items: flex-start;
    }
    section.sectiion-eligibility div.wrapper-header p {
        margin-left: 0px;
        margin-top: 15px;
    }
    div.wrapper-cards div.card{
        margin: 10px;
    }
    section.section-register div.wrapper-header {
        align-items: flex-start;
        flex-direction: column;
    }
    section.section-register div.wrapper-header p {
        margin-left: 0px;
        margin-top: 15px;
    }
    section.section-dictamen div.wrapper-header p {
        max-width: 412px;
        margin-left: 0px;
        font-size: 18px;
    }
    section.section-projects div.wrapper-header div.wrapper-label h2.prop1{
        display: none;
    }
    section.section-projects div.wrapper-header div.wrapper-label h2.prop2{
        display: block;
    }
    section.section-projects div.wrapper-header div.wrapper-label h2{
        margin-top: 0px;
    }
    section.section-projects div.wrapper-header {
        flex-direction: column;
    }
    section.section-projects div.wrapper-header p {
        margin-top: 30px;
        margin-left: 0px;
    }
    section.section-announcement {
        margin: 90px 0px 90px 0px;
        flex-direction: column;
        align-items: center;
    }
    section.section-announcement a{
        padding: 25px;
    }
    section.section-dictamen div.card{
        margin: 0px;
    }
    section.section-dictamen div.card div.p-container{
        width: 90%;
    }
    div.wrapper-header div.wrapper-label h2 {
        font-size: 35px;
    }
}

@media all and (max-width: 576.99px) {
    section.section-header img.logo-mex {
        width: 100%;
        max-width: 300px;
        margin: 79px 0px 77px 0px;
    }
    section.section-header p.p-two{
        display: none;
    }
    section.section-header p.p-one{
        display: block;
    }
    section.section-header div.container-paragraph div.p-content p.compensation-first {
        display: none;
    }
    section.section-header p.compensation-second {
        display: block;
    }
    section.section-header div.container-paragraph {
        flex-direction: row-reverse;
    }
    section.section-header p.first {
        margin-top: 0px;
        max-width: none;
        margin-bottom: 13px;
    }
    section.section-header p.first{
        font-size: 20px;
    }
    section.section-header p.first span.num{
        font-size: 24px;
    }
    section.section-header div.container-paragraph img{
        max-width: 150px;
    }
    section.section-header div.container-paragraph div.p-content p.second {
        text-align: end;
        font-size: 20px;
    }
    section.section-header div.container-paragraph div.p-content p.second span{
        font-size: 24px;
    }
    section.section-header p.compensation{
        font-size: 20px;
        margin-top: 40px;
    }
    section.section-objective {
        align-items: center;
        margin: 50px 0px 50px 0px;
    }
    section.section-objective p {
        text-align: center;
        font-size: 20px;
    }
    div.wrapper-header div.wrapper-label h2 {
        font-size: 30px;
        margin: 0px;
        margin-left: 5px;
    }
    div.wrapper-header div.wrapper-label img{
        max-width: 25px;
    }
    div.card {
        width: 150px;
        height: 200px;
    }
    div.card div.p-container {
        width: 133px;
        height: 76px;
    }
    div.card div.p-container p {
        font-size: 14px;
        margin: 0px;
    }
    section.section-dictamen div.card {
        width: 250px;
        height: 180px;
    }
    section.section-dictamen div.card img {
        max-width: 100px;
        margin: 0px;
    }
    section.section-dictamen div.card div.p-container {
        width: 115px;
        height: 75px;
        border-radius: 20px;
    }
    section.section-dictamen div.card div.p-container p {
        font-size: 13px;
    }
    section.section-dictamen div.wrapper-header p {
        margin: 15px 15px 0px 0px;
    }
    section.section-register div.wrapper-header {
        align-items: center;
    }
    section.section-register div.wrapper-header p{
        text-align: center;
    }
    section.section-dictamen {
        flex-direction: column;
        align-items: center;
    }
    div.wrapper-header div.wrapper-label {
        justify-content: center;
    }
    section.section-dictamen div.wrapper-header p {
        margin: 15px 0px 15px 0px;
        text-align: center;
    }
    section.section-dictamen div.card {
        width: 150px;
        height: 200px;
    }
    section.section-dictamen {
        margin-bottom: 50px;
    }
    section.section-announcement {
        margin: 30px 0px 30px 0px;
    }
    section.section-projects div.wrapper-header p{
        text-align: center;
    }
    section.section-projects div.wrapper-header div.wrapper-label h2.prop1 {
        display: block;
        margin-top: 35px;
        margin-left: 5px;
    }
    section.section-projects div.wrapper-header div.wrapper-label h2.prop2 {
        display: none;
    }
    section.section-projects div.wrapper-header div.wrapper-label h2 {
        margin-left: 0px;
    }
    div.wrapper-footer img{
        max-width: 50px;
    }
}