@media (max-width: 1330px) {
    .gallery{
        display: flex;
        justify-content: flex-start;
    }

    .image{
        width: calc(var(--index) * 12);
    }

    .text-block{
        font-size: 1rem;
    }

    .gallery__right .text-block {
        margin-right: 0;
    }

    .gallery__left{
        margin-top: calc(var(--gallery-gap) * 0.15);
    }

    .mars-txt{
        margin-top: calc(var(--gallery-gap) * -0.2);
    }
}


@media (max-width: 1100px) {
    .rotate-earth{
        display: none;
    }

    .index-SolarSystem{
        width: 90%;
        top: 6rem;
    }
    
    .list-planets{
        margin-top: 18rem;
    }

    .moon-title{
        flex-direction: column-reverse;
    }
}

@media (max-width: 470px) {
    .container-p {
        padding: 0 1rem;
    }

    .menu__list-link {
        padding: 0.7rem 0.8rem;
    }
    .index-SolarSystem {
        font-size: 1rem;
    }
    .list-planets {
        margin-top: 22rem;
    }
    .planets-title {
        padding: 2rem 0;
    }
    .Moon {
        margin: 1rem;
    }
    .moon__img {
        width: 30rem;
        margin-top: 6rem;
    }
    .moon-title .text {
        font-size: 1.2rem;
    }
    .click {
        font-size: 2rem;
    }

    .main-title p{
        font-size: 1rem;
        color:#D9D9D9;
        width: auto;
    }
    .main-title__moon{
        margin-bottom: 1rem;
        font-size: 1.5rem;
        padding-bottom: 2px;
        top: var(--gallery-gap);
        left: calc(var(--gallery-gap) * 0.1);
    }
    
    .about-moon__title{
        margin: 4.5rem auto;
        font-size: 0.8rem;
    }
    .about-moon__list{
        align-items: start;
        align-content: space-between;
        height: 90rem;
    }
    .about-moon__name-title{
        padding-bottom: 0;
    }

    .about-moon__item{
        width: 90%;
        font-size: 1rem;
    }
    
    .about-moon__item::before{
        color: #000000;
        top: -4rem;
        font-size: 1.5rem;
        width: 3rem;
        height: 3rem;
    }
    .about-moon__item h3{
        margin-bottom: 1rem;
    }
    
    .about-moon__article{
        margin: 0 auto;
        width: 100%;
    }
    .about-moon__article h3{
        margin-top: 5rem;
        margin-bottom: 0.5rem;
    }
    .about-moon__article h4{
        margin-bottom: 1rem;
    }
    .about-moon__article p{
        padding-bottom: 1.5rem;
        font-size: 1rem;
    }
    
    .about-moon__article-img img{
        width: 7rem;
        padding: 0 0.2rem 0.2rem 0;
    }
}