﻿@charset "utf-8";

body {
    background-color: #f8f4e8;

}

.productContainer {
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    left: 50%;
    z-index: 0;
}
.zI15 {
    z-index:15;
}
.productImg {
    position: relative;
    left: -50%;
    top: -50%;
}
.ksBg {
    background-image: url("../img/05.png");
    width: 100%;
    height: 101%;
    background-size: calc(var(--smPercentage) * 1.4);
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    z-index: 5;
}
.ksBg2 {
    background-image: url("../img/05a.png");
    width: 100%;
    height: 101%;
    background-size: calc(var(--smPercentage) * 1.4);
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    z-index: -5;
}

.translate {
    background-image: url("../img/05a.png");
    width: 500px;

    background-position: center center;
    position: absolute;
    z-index: -5;
}
.imgBg {
    background-size: var(--smPercentage);
    background-position: center center;
    background-repeat: no-repeat;
}

.productNameT {
    font-size: 15vw;
    text-align: left;
    line-height: normal;
}

.productSlg {
    font-size: 8vw;
    line-height: 0.9em;

}
.firstSlide {
 margin-bottom: 20px;
}
.productInfoT {
    font-size: 15vw;
    opacity: 0.4;
    line-height: 0.8em;
    /*text-shadow: 2px 2px 5px #f8f4e8; */
}

.swiper-wrapper {
    /*height: 75vh;*/
}



.productImg {
    width: calc(var(--smPercentage) / var(--ratio));
}


.productCalendarName {
    font-size: 40px;
    background-size: 100% 70px;
    background-repeat: no-repeat;
    width: auto;
}
.calendarBg1 {
    background-image: url("../img/calendar/01Bg.png");
    /*gri*/
}

.calendarBg2 {
    background-image: url("../img/calendar/02Bg.png");
    /*truncu*/
}

.calendarBg3 {
    background-image: url("../img/calendar/03Bg.png");
    /*acik turuncu*/
}
.calendarBg6 {
    background-image: url("../img/calendar/04Bg.png");
    /*pembe*/
}
.calendarBg7 {
    background-image: url("../img/calendar/05Bg.png");
    /*sari*/
}
.calendarBg8 {
    background-image: url("../img/calendar/06Bg.png");
    /*yesil*/
}
.calendarBg9 {
    background-image: url("../img/calendar/07Bg.png");

}
.calendarBg10 {
    background-image: url("../img/calendar/08Bg.png");

}
.calendarBg11 {
    background-image: url("../img/calendar/09Bg.png");

}
.calendarBg12 {
    background-image: url("../img/calendar/10Bg.png");
}
.calendarBg4 {

    background-image: url("../img/calendar/calendarTitleBg.png");
    background-position: top;
    background-repeat: no-repeat;
    background-size: 100%;
}
.calendarBg5 {
    background-image: url("../img/calendar/calendarBg.png");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: 100%;
}
.cBGr {
    background-image: url("../img/calendar/bulletGreen.png");
    background-size: 100% 100%;
    width: 20px;
    height: 20px;
}
.cBRd {
    background-image: url("../img/calendar/bulletRed.png");
    background-size: 100% 100%;
    width: 20px;
    height: 20px;
}
.cMonths {
    width: 20px;
    height: auto;
}
.calSt{
    font-size: 32px;

}
.uyh {
    font-size: 8vw;
    color: #d1cbb7;
    padding: 10px;
}

@media (min-width: 768px) {
    .productImg {
        width: calc(var(--lgPercentage) / var(--ratio));
    }

    .imgBg {
        background-size: var(--lgPercentage);
    }

    .ksBg, .ksBg2 {
        background-size: var(--lgPercentage);
    }
}

@media (min-width: 576px) {
    .productNameT {
        font-size: 7.5vw;
    }

    .productSlg {
        font-size: 4vw;
    }
    .productInfoT {
        font-size: 6vw;
    }
        .swiper-wrapper {
        height: 85vh;
    }
}

