/* Medias */
@media only screen and (max-width: 1820px) {
    .section__graphs {
        grid-template-columns: 1fr;
    }
    .article__count {
        width: 100%;
    }
    .chart__top {
        text-align: left;
    }
}
@media only screen and (max-width: 1220px) {
    .counts section.counts__main {
        grid-template-columns: repeat(2, 1fr);
    }
    .list__top {
        grid-template-columns: 1fr;
    }
}
@media only screen and (max-width: 1200px) {
    .donation {
        font-size: .6em;
        top: calc(12%);
        right: calc(2%);
        max-width: 250px;
    }
}
@media only screen and (max-width: 991px)  {
    .container__step {
        padding: 3em 1em;
    }
    .title__step  {
        font-size: 2.3em;
    }
    nav.options-menu.mobile .options-menu-content {
        flex-wrap: nowrap;
        gap: 0;
    }
    nav.options-menu .options-menu-content {
        flex-wrap: wrap;
        justify-content: center;
        gap: 25px;
    }
    .sp-vert {
        display: none;
    }

    .navbar.first-nav {
        display: none;
    }
    .second-nav__items {
        display: none !important;
    }
    .nav-mobile {
        display: flex;
    }
    .mobile {
        display: flex !important;
    }
    .firms__now {
        position: fixed;
        bottom: 0;
        left: 0;
        top: inherit;
        width: 100%;
        z-index: 2;
    }
    .second-nav-main {
        background: var(--color-primary);
        padding-bottom: 1em;
    }
    nav.second-nav {
        padding: 20px;
        background: var(--color-primary);
    }
    nav.second-nav .logo img.mobile {
        display: block;
    }
    nav.second-nav .logo img.desktop {
        display: none;
    }
    .card-activate .card-activate__content {
        padding: 56px 21px 21px;
    }
    nav.options-menu.mobile {
        display: block;
        position: relative;
    }
    nav.options-menu.mobile .options-menu-content {
        background: #F0F0F0;
        border-radius: 0;
        padding: 20px 30px;
        justify-content: space-around;
        overflow-x: auto;
    }
    nav.options-menu.mobile .options-menu-content::-webkit-scrollbar {
        height: 0px;
    }

    .options-menu-item__img {
        background: #fff;
        padding: 10px;
        width: 60px;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 200px;
        margin-bottom: 5px;
    }
    .options-menu-item {
        margin-right: 20px;
    }
    .options-menu-item:last-child {
        margin-right: 0;
    }
    nav.options-menu.desktop {
        display: none;
    }
    section.banner {
        background: #FFF;
    }
    .start__campanign {
        left: calc(37%);
        bottom: calc(25%);
    }
    .main__campaign {
        display: grid;
        grid-template-columns: 1fr;
    }
    .graphs__gauge {
        display: flex;
        flex-wrap: wrap;
        gap: 6em;
        justify-content: center;
    }
}

@media only screen and (max-width: 800px)  {
    .graphs__gauge {
        margin-left: 0;
    }
    .signatories {
        grid-template-columns: 1fr;
    }
    nav.options-menu.mobile .options-menu-content {
        justify-content: flex-start;
    }
    .carousel-recents {
        padding: 20px 0 30px 30px;
    }
    .card-activate {
        border-radius: 20px;
        height: 320px;
        /* width: 226px; */
    }
    .card-activate::after {
        border-radius: 20px;
    }
    .card-activate .card-activate__title {
        font-size: .8em;
        font-weight: 400;
    }
    .card-activate .card-activate__firms {
        font-size: 1em;
    }
    .card-activate .card-activate__options-item img.playvideo {
        width: 30px !important;
    }
    .card-activate .card-activate__options-item {
        width: 30px;
        height: 30px;
    }
    .card-activate .card-activate__options-item img {
        width: 20px !important;
    }
    .owl-carousel.header .owl-nav {
        display: none !important;
    }
    .card-activate .card-activate__author {
        font-size: .8em;
    }
    .posts-main {
        margin-top: 0;
    }
    .posts {
        padding: 1em 3em;
    }
    .post-articles .owl-nav img {
        width: 20px;
    }
    .post-articles .owl-nav .owl-next {
        right: -1.9em;
    }
    .post-articles .owl-nav .owl-prev {
        left: -1.9em;
    }
    /* Post */
    .post {
        box-shadow: 0 5px 15px #00000026;
        border-radius: 10px;
    }
    .post .post__img {
        margin-bottom: 0;
    }
    .post .post__content {
        padding: 10px;
    }
    .post .post__title {
        font-size: .6em;
        margin-bottom: 0;
    }
    .post .post__description,
    .post .post__firms,
    .post .post__author,
    .post .post__more {
        font-size: .7em;
    }
    .post .post__firms span {
        color: var(--color-primary);
    }
    .post .post__footer {
        display: flex; 
        flex-direction: row-reverse;
        justify-content: space-between;
    }
    .post .post__button {
        display: block;
        margin: 5px auto;
        border: none;
        padding: 2px 10px;
        border-radius: 200px;
        color: #fff;
        background: var(--color-primary);
        font-size: 1em;
    }
    .post .post__range {
        display: block;
        position: relative;
        border-radius: 200px;
        border: 0.2px solid silver;
        height: 8px;
        margin-bottom: 5px;
    }
    .post .post__range span {
        position: absolute;
        height: 100%;
        top: 0;
        left: 0;
        background: var(--color-primary);
    }
    .start__campanign {
        font-size: 1em;
    }
}
@media only screen and (max-width: 750px) {
    .footer__author {
        flex-direction: column;
    }
    .footer__author-logo {
        margin-bottom: 30px;
    }
    .footer__author-terms-privacy {
        align-items: center;
        text-align: center;
        margin-bottom: 80px;
    }
    .footer__activate {
        padding: 4em 2em 1em;
    }
    .start__campanign {
        font-size: .8em;
        left: calc(33%);
        bottom: calc(20%);
        border: none;
        padding: 5px 20px;
    }
    .donation {
        font-size: .4em;
        top: calc(5%);
        max-width: 200px;
    }
    .donation__content {
        padding: 20px;
    }
}

@media only screen and (max-width: 620px)  {
    .status {
        grid-template-columns: 1fr;
    }
    .activate__now {
        display: none;
    }
    body {
        background: #F0F0F0 !important;
    }
    body.dashboard {
        background: #fff !important;
    }
    body.dashboard main {
        background: #fff !important;
    }
    main {
        background: #F0F0F0;
    }
    section.banner {
        margin: 10px 30px 0;
        padding: 10px;
        border-radius: 20px;
    }
    section.banner h2 {
        font-size: 1.1em;
    }
    section.banner img {
        width: 100px;
    }
    .header-category-title h1 {
        font-weight: bold;
        margin-left: 10px;
        font-size: 2em;
    }
    .title__step  {
        font-size: 1.5em;
    }
}
@media only screen and (max-width: 540px) {
    .donation {
        font-size: .3em;
        top: calc(5%);
        max-width: 150px;
    }
    .donation__content {
        padding: 20px 10px 15px;
        border-radius: 20px;
    }
    .donation__subtitle {
        margin-bottom: 0;
    }
    .people__firms {
        flex-direction: column;
        align-items: flex-start;
    }
    .section__author__firms {
        padding: 10px;
    }
    .firms__now {
        font-size: 1.2em;
        padding: 20px 0;
    }
    .campaign__others {
        font-size: 2em;
    }
    section.banner h2 {
        font-size: 1em;
    }
    .counts section.counts__main {
        grid-template-columns: 1fr;
    }
    .start__campanign {
        left: calc(30%);
        bottom: calc(5%);
    }
    .footer__socials {
        transform: scale(0.8);
        justify-content: center;
    }
    .footer__text h1 {
        font-size: 2em !important;
    }
}
@media only screen and (max-width: 420px)  {
    .donation__button {
        display: none;
    }
    .start__campanign {
        bottom: calc(12%);
    }
    .owl-carousel.nav-carousel .owl-nav img {
        width: 17px;
    }
    .footer__socials img {
        width: 30px;
    }
    section.banner h2 {
        font-size: 0.65em;
    }
    .donation {
        right: calc(30%);
        top: 43%;
    }
    .donation__content {
        display: none;
        margin-top: 40px;
    }
    .footer__socials img[alt="Facebook"] {
        width: 14px;
    }
    .donation__content {
        padding: 4px 10px 4px;
        border-radius: 20px;
    }
    .header-category-title h1 {
        font-weight: bold;
        margin-left: 10px;
        font-size: 1.5em;
    }
    .header-category-title {
        top: 70%;
    }
    .header__campaign-content {
        padding: 6em 1em 1em;
    }
    .header__campaign-title {
        font-size: 2.5em;
    }
    .article__campaign {
        padding: 10px 1.3em;
    }
    .article {
        min-width: 250px;
    }
}

@media only screen and (max-width: 360px)  {
    .header__campaign-title {
        font-size: 2em;
        word-break: break-word;
    }
}