@media (max-width: 850px) {
    .seconeline{
        font-size: var(--size-40px);
    }

    .btnCard{
        width: var(--size-650px);
    }

    .btnCard h3 {
        width: var(--size-520px);
        font-size: var(--size-20px);
    }

    .box {
        width: var(--size-620px);
    }
}

@media screen and (max-width: 680px) {
    .thumbnail{
        justify-content: start;
    }

    .firstSlider .firstList .thumbnailItem .content {
        font-size: var(--size-60px);
    }

    .firstArrows{
        top: var(--size-300px);
    }

    .seconeline{
        font-size: var(--size-24px);
    }

    .seconeSection p{
        font-size: var(--size-14px);
    }

    .btnCard{
        width: var(--size-450px);
    }

    .btnCard h3 {
        width: var(--size-300px);
        font-size: var(--size-16px);
    }

    .box {
        width: var(--size-420px);
    }
}

@media screen and (max-width: 550px) {
    .firstArrows{
        top: var(--size-330px);
    }
}

@media screen and (max-width: 500px) {
    .firstSlider .firstList .item .content h2{
        font-size: var(--size-30px);
    }

    .navigation{
        position: absolute;
        right: var(--size-16px);
    }

    .footerContainer{
        position: flex;
        bottom: var(--size-0);
        left: var(--size-0);
        right: var(--size-0);
        background-color: var(--green-color);
        color: var(--color);
        display: flex;
        justify-content: space-around;
        align-items: center;
    }

    .footerSocial{
        gap: var(--size-5px);
        padding: var(--size-5px);
    }

    .footerSocial img{
        height: var(--size-32px);
        width: var(--size-32px);
    }

    .footerAdress {
        padding: var(--size-5px);
        gap: var(--size-5px);
    }

    .flooterLink img {
        width: var(--size-32px);
        height: var(--size-32px);
    }
}

@media screen and (max-width: 500px) {
    .firstSlider .firstList .item .content h2{
        font-size: var(--size-20px);
    }

    .btnCard{
        width: var(--size-350px);
    }

    .btnCard h3 {
        width: var(--size-300px);
        font-size: var(--size-14px);
    }

    .box {
        width: var(--size-300px);
    }

    .footerRight{
        font-size: var(--size-14px);
    }
}

@media screen and (max-width: 390px) {
    .navigation{
        position: absolute;
        right: var(--size-10px);
    }

    .btnCard{
        width: var(--size-350px);
    }

    .btnCard h3 {
        width: var(--size-300px);
        font-size: var(--size-14px);
    }

    .box {
        width: var(--size-300px);
    }

    .footerRight{
        font-size: var(--size-10px);
    }
}

@media screen and (max-width: 360px) {
    .navigation{
        position: absolute;
        right: var(--size-10px);
        top: var(--size-10px);
    }

    .firstArrows{
        top: var(--size-350px);
    }

    .seconeSection p{
        font-size: var(--size-12px);
    }

    .btnCard{
        width: var(--size-250px);
    }

    .btnCard h3 {
        width: var(--size-200px);
        font-size: var(--size-12px);
    }

    .box {
        width: var(--size-220px);
        text-align: center;
    }

    .footerLeft {
        width: var(--size-250px);
        padding-left: 25px;
    }

    .uyanLogo{
        width: var(--size-50px);
        height: var(--size-50px);
    }

    .footerRight{
        font-size: var(--size-10px);
    }

    .menuLink{
        margin-left: 0;
    }
}

@keyframes animate {
    from{
        opacity: var(--size-0);
        transform: translate(var(--size-0), var(--size-100px));
        filter: blur(var(--size-33px));
    } to{
        opacity: var(--size-1);
        transform: translate(var(--size-0));
        filter: blur(var(--size-0));
    }
}

@keyframes next1{
    from{
        left: var(--size-0P);
    }to{
        left: var(--size-100PM);
    }
}

@keyframes next2{
    from{
        left: var(--size-100P);
    }to{
        left: var(--size-0P);
    }
}

@keyframes prev1{
    from{
        left: var(--size-0P);
    }to{
        left: var(--size-100P);
    }
}

@keyframes prev2{
    from{
        left: var(--size-100PM);
    }to{
        left: var(--size-0P);
    }
}