@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&display=swap');
@import url("https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css");
@import url("https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css");
@charest "utf-8";

*,
:after,
:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    word-wrap: break-word;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-style: normal;
    outline: 0;
    background-color: transparent;
    resize: none;
    font-family: "Comfortaa", sans-serif;
    line-height: 1.5;
}

body,
html {
    overflow-x: hidden;
    scroll-behavior: smooth;
    width: 100vw;
    height: 100vh
}

a {
    color: inherit;
    font-weight: inherit;
    text-decoration: none
}

.slick-dots li,
button,
form button,
select {
    cursor: pointer
}

.clear:after {
    content: "";
    display: block;
    clear: both
}

.grid {
    max-width: 1700px;
    position: relative;
    margin-left: auto;
    margin-right: auto
}

@media (max-width:1720px) {
    .grid {
        margin-left: 10px;
        margin-right: 10px
    }
}

@-webkit-keyframes logo {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        top: 0
    }

    to {
        -webkit-transform: scale(1);
        transform: scale(1);
        top: 30%
    }
}

@-webkit-keyframes slogan {
    0% {
        top: 100%
    }

    to {
        top: 60%
    }
}

@-webkit-keyframes text {
    0% {
        top: 200%
    }

    to {
        top: 63.5%
    }
}

.loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #07B2B0;
    z-index: 99;
    /* background-image: url(../img/loading-background.png); */
    background-position: center bottom 33px;
    text-align: center;
    -webkit-transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1);
    -o-transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1);
    background-blend-mode: multiply;
}

.loading:hover {
    -webkit-transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1);
    -o-transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1)
}

.loading img {
    position: absolute;
    width: 100px;
    left: calc(50% - 50px);
    -webkit-animation-name: logo;
    animation-name: logo;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-transition: all 0.4s cubic-bezier(0.65, 0, 0.35, 1);
    -o-transition: all 0.4s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.4s cubic-bezier(0.65, 0, 0.35, 1)
}

.loading img:hover {
    -webkit-transition: all 0.4s cubic-bezier(0.65, 0, 0.35, 1);
    -o-transition: all 0.4s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.4s cubic-bezier(0.65, 0, 0.35, 1)
}

.loading p {
    position: absolute;
    width: 100%;
    left: 0;
    font-weight: 500;
    font-size: 20px;
    color: #fff;
    -webkit-animation-name: slogan;
    animation-name: slogan;
    -webkit-animation-duration: .7s;
    animation-duration: .7s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    margin-top: 20px;
    -webkit-transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1);
    -o-transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1);
    padding: 0 50px
}

.loading p:hover {
    -webkit-transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1);
    -o-transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1)
}

.loading>span {
    margin-top: 20px;
    position: absolute;
    width: 100%;
    left: 0;
    font-weight: 500;
    font-size: 16px;
    color: #fff;
    top: 63.5%;
    -webkit-animation-name: text;
    animation-name: text;
    -webkit-animation-duration: .9s;
    animation-duration: .9s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    -o-transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1)
}

.loading>span:hover {
    -webkit-transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    -o-transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    transition: all 0.6s cubic-bezier(0.65, 0, 0.35, 1)
}

.loading img {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

.loading.hidden {
    left: -100vw
}

.loading.hidden img {
    left: -120vw
}

.loading.hidden p {
    left: -130vw
}

.loading.hidden>span {
    left: -140vw
}

header {
    padding: 50px 10px 25px;
    /* background-image: url(../img/loading-background.png); */
    background-position: center bottom;
    background-color: #07B2B0;
    position: fixed;
    width: 100%;
    background-blend-mode: multiply;
    background-size: cover;
}

header:after {
    content: "";
    display: block;
    clear: both
}

header>a {
    display: block;
    float: left;
    text-align: center;
    width: 15%
}

header>a>span {
    font-weight: 400;
    font-size: 9px;
    color: #fff;
    display: block;
    text-transform: capitalize
}

header>a p {
    font-weight: 300;
    font-size: 16px;
    color: #fff
}

header>a p span {
    font-weight: 600
}

header>a:nth-child(2) {
    width: 70%
}

header>a:nth-child(2) img {
    /* margin-bottom: 15px; */
    height: 100px;
    /* transform: scale(1.3); */
}

header.subpage {
    background-color: #fff;
    background-image: none;
    padding: 30px 20px 20px
}

header.subpage h1 {
    font-weight: 500;
    font-size: 15px;
    color: #07B2B0;
    text-align: center;
    line-height: 1.658;
    padding: 0 77px
}

header.subpage a {
    width: 70px;
    text-align: left
}

header.subpage a img {
    height: 21px;
    display: inline;
    -webkit-transform: translateY(5px);
    -ms-transform: translateY(5px);
    transform: translateY(5px);
    margin-right: 5px
}

header.subpage a p {
    display: inline-block;
    font-weight: 300;
    font-size: 15px;
    color: #07B2B0
}

header.subpage+section {
    padding-top: 82px;
    height: 100vh
}

header+section {
    padding-top: 150px;
    height: 100vh
}

section .table {
    font-weight: 600;
    font-size: 16px;
    color: #00113B;
    padding: 8px 0
}

section .table.title {
    margin: 17px 0;
    height: 82px;
    background-image: url(../img/title.svg);
    background-position: center top;
    text-align: center
}

section .table.title span {
    color: #07B2B0
}

section .categori {
    padding: 0 40px;
    text-align: center
}

section .categori li a {
    display: block;
    font-weight: 500;
    font-size: 15px;
    color: #2D2D2B;
    border-top: 1px solid #E2E2E2;
    text-transform: capitalize;
    padding: 22px
}

section .wifi {
    display: block;
    font-weight: 400;
    font-size: 15px;
    color: #07B2B0;
    border-top: 1px solid #E2E2E2;
    border-bottom: 1px solid #E2E2E2;
    text-transform: capitalize;
    padding: 8px 0 22px;
    margin: 0 40px;
    text-align: center
}

section .wifi img {
    margin-right: 10px;
    -webkit-transform: translateY(9px);
    -ms-transform: translateY(9px);
    transform: translateY(9px)
}

section .instagram {
    display: block;
    text-align: center;
    font-weight: 300;
    font-size: 12px;
    color: #222221;
    background-image: url(../img/instagram-down.svg);
    background-position: center bottom;
    padding-bottom: 7px;
    margin-top: 20px
}

/* section .instagram img {
    -webkit-transform: translateY(2px);
    -ms-transform: translateY(2px);
    transform: translateY(2px)
} */

section .domain {
    display: block;
    text-align: center;
    font-weight: 300;
    font-size: 13px;
    color: #07B2B0;
    background-image: url(../img/domain.svg);
    background-position: center top;
    padding-top: 9px
}

section .domain span {
    font-weight: 600
}

section .content {
    text-align: center;
    margin: 10px 0
}

section .content a {
    display: inline-block;
    font-weight: 500;
    font-size: 13px;
    color: #161615
}

section .content a img {
    width: 10px
}

section .content a+a {
    margin-left: 12px
}

section .address {
    font-weight: 500;
    font-size: 13px;
    color: #161615;
    text-align: center;
    padding: 0 30px;
    display: block
}

section .year {
    /* padding: 100px 15px; */
    height: 40px;
    margin-top: 11px;
    background-image: url(../img/year.svg);
    background-position: center top;
    display: block;
    text-align: center;
    font-weight: 300;
    font-size: 11px;
    color: transparent;
    margin-bottom: 15px;
}

section .banner {
    margin-bottom: 15px;
    padding: 0 20px
}

section .banner img {
    display: block;
    width: 100%;
    height: 180px;
    -o-object-fit: cover;
    object-fit: cover;
    object-position: center;
}

section .products li a {
    display: block;
    padding: 15px 20px;
    border-bottom: 1px solid #F5F1EA
}

section .products li a:after {
    content: "";
    display: block;
    clear: both
}

section .products li a h3 {
    font-weight: 500;
    font-size: 15px;
    color: #2D2D2B;
}

section .products li a p {
    font-weight: 400;
    font-size: 10px;
    color: #2D2D2B;
    line-height: 1.3;
    /* padding-left: 122px */
}

section .products li a span {
    font-weight: 600;
    font-size: 14px;
    color: #07B2B0;
    float: right
}

section .products li a img {
    float: left;
    width: 110px;
    height: 85px;
    -o-object-fit: cover;
    object-fit: cover;
    border: 1px solid #EAEAEA;
    margin-right: 12px;
    object-fit: cover;
    object-position: center;
}

section .products li a .plus {
    float: right;
    text-align: center;
    padding-top: 25px
}

section .products li a .plus>div {
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    display: inline-block;
    border-radius: 15px;
    overflow: hidden
}

section .products li a .plus>div input {
    border-radius: 0;
    height: 35px;
    width: 35px;
    font-weight: 600;
    font-size: 18px;
    color: #04303E;
    -webkit-transform: translateY(2px);
    -ms-transform: translateY(2px);
    transform: translateY(2px);
    text-align: center
}

section .products li a .plus>div input:nth-child(2) {
    background-color: #EF4B55;
    color: #fff;
    font-size: 14px;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

section .products li:nth-child(2n) {
    background-color: #F7F7F7;
}

section .products.sepet {
    border-top: 1px solid #F5F1EA
}

section .comment-title {
    margin: 0 20px
}

section .comment-title h2 {
    font-weight: 500;
    font-size: 15px;
    color: #07B2B0
}

section .comment-title h3 {
    font-weight: 400;
    font-size: 13px;
    color: #07B2B0;
    margin: 10px 0 30px
}

section ::-webkit-input-placeholder {
    color: #747474;
    text-transform: capitalize
}

section ::-moz-input-placeholder {
    color: #747474;
    text-transform: capitalize
}

section :-moz-input-placeholder {
    color: #747474;
    text-transform: capitalize
}

section :-ms-input-placeholder {
    color: #747474;
    text-transform: capitalize
}

section form {
    margin: 0 20px;
    padding-bottom: 50px
}

section form .degerlendirme {
    border-top: 1px solid #E2E2E2;
    padding: 19px 0
}

section form .degerlendirme:after {
    content: "";
    display: block;
    clear: both
}

section form .degerlendirme #lezzet-2:checked~section [for=lezzet-1] svg,
section form .degerlendirme #lezzet-2:checked~section [for=lezzet-2] svg,
section form .degerlendirme #lezzet-3:checked~section [for=lezzet-1] svg,
section form .degerlendirme #lezzet-3:checked~section [for=lezzet-2] svg,
section form .degerlendirme #lezzet-3:checked~section [for=lezzet-3] svg,
section form .degerlendirme #lezzet-4:checked~section [for=lezzet-1] svg,
section form .degerlendirme #lezzet-4:checked~section [for=lezzet-2] svg,
section form .degerlendirme #lezzet-4:checked~section [for=lezzet-3] svg,
section form .degerlendirme #lezzet-4:checked~section [for=lezzet-4] svg,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-1] svg,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-2] svg,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-3] svg,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-4] svg,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-5] svg#tazelik-1:checked~section [for=tazelik-1] svg,
section form .degerlendirme #memnuniyet-2:checked~section [for=memnuniyet-1] svg,
section form .degerlendirme #memnuniyet-2:checked~section [for=memnuniyet-2] svg,
section form .degerlendirme #memnuniyet-3:checked~section [for=memnuniyet-1] svg,
section form .degerlendirme #memnuniyet-3:checked~section [for=memnuniyet-2] svg,
section form .degerlendirme #memnuniyet-3:checked~section [for=memnuniyet-3] svg,
section form .degerlendirme #memnuniyet-4:checked~section [for=memnuniyet-1] svg,
section form .degerlendirme #memnuniyet-4:checked~section [for=memnuniyet-2] svg,
section form .degerlendirme #memnuniyet-4:checked~section [for=memnuniyet-3] svg,
section form .degerlendirme #memnuniyet-4:checked~section [for=memnuniyet-4] svg,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-1] svg,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-2] svg,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-3] svg,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-4] svg,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-5] svg,
section form .degerlendirme #servis-1:checked~section [for=servis-1] svg,
section form .degerlendirme #servis-2:checked~section [for=servis-1] svg,
section form .degerlendirme #servis-2:checked~section [for=servis-2] svg,
section form .degerlendirme #servis-3:checked~section [for=servis-1] svg,
section form .degerlendirme #servis-3:checked~section [for=servis-2] svg,
section form .degerlendirme #servis-3:checked~section [for=servis-3] svg,
section form .degerlendirme #servis-4:checked~section [for=servis-1] svg,
section form .degerlendirme #servis-4:checked~section [for=servis-2] svg,
section form .degerlendirme #servis-4:checked~section [for=servis-3] svg,
section form .degerlendirme #servis-4:checked~section [for=servis-4] svg,
section form .degerlendirme #servis-5:checked~section [for=servis-1] svg,
section form .degerlendirme #servis-5:checked~section [for=servis-2] svg,
section form .degerlendirme #servis-5:checked~section [for=servis-3] svg,
section form .degerlendirme #servis-5:checked~section [for=servis-4] svg,
section form .degerlendirme #servis-5:checked~section [for=servis-5] svg#lezzet-1:checked~section [for=lezzet-1] svg,
section form .degerlendirme #tazelik-2:checked~section [for=tazelik-1] svg,
section form .degerlendirme #tazelik-2:checked~section [for=tazelik-2] svg,
section form .degerlendirme #tazelik-3:checked~section [for=tazelik-1] svg,
section form .degerlendirme #tazelik-3:checked~section [for=tazelik-2] svg,
section form .degerlendirme #tazelik-3:checked~section [for=tazelik-3] svg,
section form .degerlendirme #tazelik-4:checked~section [for=tazelik-1] svg,
section form .degerlendirme #tazelik-4:checked~section [for=tazelik-2] svg,
section form .degerlendirme #tazelik-4:checked~section [for=tazelik-3] svg,
section form .degerlendirme #tazelik-4:checked~section [for=tazelik-4] svg,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-1] svg,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-2] svg,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-3] svg,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-4] svg,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-5] svg#memnuniyet-1:checked~section [for=memnuniyet-1] svg {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

section form .degerlendirme #lezzet-1:checked~section [for=lezzet-1] svg path,
section form .degerlendirme #lezzet-2:checked~section [for=lezzet-1] svg path,
section form .degerlendirme #lezzet-2:checked~section [for=lezzet-2] svg path,
section form .degerlendirme #lezzet-3:checked~section [for=lezzet-1] svg path,
section form .degerlendirme #lezzet-3:checked~section [for=lezzet-2] svg path,
section form .degerlendirme #lezzet-3:checked~section [for=lezzet-3] svg path,
section form .degerlendirme #lezzet-4:checked~section [for=lezzet-1] svg path,
section form .degerlendirme #lezzet-4:checked~section [for=lezzet-2] svg path,
section form .degerlendirme #lezzet-4:checked~section [for=lezzet-3] svg path,
section form .degerlendirme #lezzet-4:checked~section [for=lezzet-4] svg path,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-1] svg path,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-2] svg path,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-3] svg path,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-4] svg path,
section form .degerlendirme #lezzet-5:checked~section [for=lezzet-5] svg path,
section form .degerlendirme #memnuniyet-1:checked~section [for=memnuniyet-1] svg path,
section form .degerlendirme #memnuniyet-2:checked~section [for=memnuniyet-1] svg path,
section form .degerlendirme #memnuniyet-2:checked~section [for=memnuniyet-2] svg path,
section form .degerlendirme #memnuniyet-3:checked~section [for=memnuniyet-1] svg path,
section form .degerlendirme #memnuniyet-3:checked~section [for=memnuniyet-2] svg path,
section form .degerlendirme #memnuniyet-3:checked~section [for=memnuniyet-3] svg path,
section form .degerlendirme #memnuniyet-4:checked~section [for=memnuniyet-1] svg path,
section form .degerlendirme #memnuniyet-4:checked~section [for=memnuniyet-2] svg path,
section form .degerlendirme #memnuniyet-4:checked~section [for=memnuniyet-3] svg path,
section form .degerlendirme #memnuniyet-4:checked~section [for=memnuniyet-4] svg path,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-1] svg path,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-2] svg path,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-3] svg path,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-4] svg path,
section form .degerlendirme #memnuniyet-5:checked~section [for=memnuniyet-5] svg path,
section form .degerlendirme #servis-1:checked~section [for=servis-1] svg path,
section form .degerlendirme #servis-2:checked~section [for=servis-1] svg path,
section form .degerlendirme #servis-2:checked~section [for=servis-2] svg path,
section form .degerlendirme #servis-3:checked~section [for=servis-1] svg path,
section form .degerlendirme #servis-3:checked~section [for=servis-2] svg path,
section form .degerlendirme #servis-3:checked~section [for=servis-3] svg path,
section form .degerlendirme #servis-4:checked~section [for=servis-1] svg path,
section form .degerlendirme #servis-4:checked~section [for=servis-2] svg path,
section form .degerlendirme #servis-4:checked~section [for=servis-3] svg path,
section form .degerlendirme #servis-4:checked~section [for=servis-4] svg path,
section form .degerlendirme #servis-5:checked~section [for=servis-1] svg path,
section form .degerlendirme #servis-5:checked~section [for=servis-2] svg path,
section form .degerlendirme #servis-5:checked~section [for=servis-3] svg path,
section form .degerlendirme #servis-5:checked~section [for=servis-4] svg path,
section form .degerlendirme #servis-5:checked~section [for=servis-5] svg path,
section form .degerlendirme #tazelik-1:checked~section [for=tazelik-1] svg path,
section form .degerlendirme #tazelik-2:checked~section [for=tazelik-1] svg path,
section form .degerlendirme #tazelik-2:checked~section [for=tazelik-2] svg path,
section form .degerlendirme #tazelik-3:checked~section [for=tazelik-1] svg path,
section form .degerlendirme #tazelik-3:checked~section [for=tazelik-2] svg path,
section form .degerlendirme #tazelik-3:checked~section [for=tazelik-3] svg path,
section form .degerlendirme #tazelik-4:checked~section [for=tazelik-1] svg path,
section form .degerlendirme #tazelik-4:checked~section [for=tazelik-2] svg path,
section form .degerlendirme #tazelik-4:checked~section [for=tazelik-3] svg path,
section form .degerlendirme #tazelik-4:checked~section [for=tazelik-4] svg path,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-1] svg path,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-2] svg path,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-3] svg path,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-4] svg path,
section form .degerlendirme #tazelik-5:checked~section [for=tazelik-5] svg path {
    fill: #07B2B0;
    stroke: #07B2B0;
}

section form .degerlendirme label {
    display: inline-block;
    width: 22px;
    text-align: center;
    cursor: pointer
}

section form .degerlendirme label svg {
    width: 100%;
    height: auto;
    fill: white;
    stroke: #C89F67;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transition: -webkit-transform 200ms ease-in-out;
    transition: -webkit-transform 200ms ease-in-out;
    -o-transition: transform 200ms ease-in-out;
    transition: transform 200ms ease-in-out;
    transition: transform 200ms ease-in-out, -webkit-transform 200ms ease-in-out
}

section form .degerlendirme label svg path {
    -webkit-transition: fill 200ms ease-in-out, stroke 100ms ease-in-out;
    -o-transition: fill 200ms ease-in-out, stroke 100ms ease-in-out;
    transition: fill 200ms ease-in-out, stroke 100ms ease-in-out
}

section form .degerlendirme label+label {
    margin-left: 15px
}

section form .degerlendirme label[for=star-null] {
    display: block;
    margin: 0 auto;
    color: #999
}

section form .degerlendirme label[for=servis-null] {
    display: block;
    margin: 0 auto;
    color: #999
}

section form .degerlendirme label[for=lezzet-null] {
    display: block;
    margin: 0 auto;
    color: #999
}

section form .degerlendirme label[for=tazelik-null] {
    display: block;
    margin: 0 auto;
    color: #999
}

section form .degerlendirme label[for=memnuniyet-null] {
    display: block;
    margin: 0 auto;
    color: #999
}

section form .degerlendirme p {
    font-weight: 500;
    font-size: 13px;
    color: #2d2d2b;
    text-transform: capitalize;
    float: left
}

section form .degerlendirme section {
    float: right
}

section form input[type=text],
section form textarea {
    width: 100%;
    height: 65px;
    border-top: 1px solid #E2E2E2
}

section form textarea {
    padding: 19px 0;
    border-bottom: 1px solid #E2E2E2;
    height: 150px;
    margin-bottom: 30px
}

section form button {
    width: 100%;
    height: 62px;
    background-color: #07B2B0;
    border-radius: 6px;
    font-weight: 500;
    font-size: 15px;
    color: #fff;
    text-transform: capitalize
}

section .menu>div {
    margin: 0 -1.2%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

section .menu>div>* {
    width: 47.6%;
    margin: 0 1.2% 10px
}

section .menu a {
    border: 1px solid #EDEDED;
    border-radius: 15px;
    text-align: center;
    height: 58px;
    line-height: 58px
}

section .menu a img {
    margin-right: 5px;
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
    height: 30px
}

section .menu a p {
    display: inline-block;
    font-weight: 400;
    font-size: 14px;
    color: #04303E
}

section .categori-title {
    margin-bottom: 25px
}

section .categori-title:after {
    content: "";
    display: block;
    clear: both
}

section .categori-title h2 {
    font-weight: 500;
    font-size: 18px;
    color: #04303E;
    float: left;
    line-height: 1
}

section .categori-title a {
    float: right;
    font-weight: 500;
    font-size: 14px;
    color: #909090
}

section .categori-content {
    text-align: center
}

section .categori-content>div {
    margin: 0 -2%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

section .categori-content>div>* {
    width: 29.33333%;
    margin: 0 2% 25px
}

section .categori-content a img {
    border: 1px solid #EAEAEA;
    border-radius: 15px;
    display: block;
    width: 100%;
    margin-bottom: 6px
}

section .categori-content a p {
    font-weight: 500;
    font-size: 13px;
    color: #04303E
}

section .description {
    padding: 25px 0 20px
}

section .description h2 {
    font-weight: 500;
    font-size: 15px;
    color: #04303E
}

section .description p {
    font-weight: 400;
    font-size: 11px;
    color: #8B8B8B
}

section .description span {
    font-weight: 600;
    font-size: 14px;
    color: #EF4B55
}

section .product-form h3 {
    font-weight: 500;
    font-size: 15px;
    color: #04303E;
    margin-bottom: 15px
}

section .product-form form>div {
    margin: 0 -10px;
    padding: 25px 20px
}

section .product-form .background {
    background-color: #F4F5F9;
    border-top: 1px solid #E8E8E8;
    border-bottom: 1px solid #E8E8E8
}

section .product-form .extra ul li {
    margin-bottom: 10px
}

section .product-form .extra ul li input {
    width: 22px;
    height: 22px;
    border-radius: 5px;
    border: 2px solid #EF4B55;
    display: inline-block
}

section .product-form .extra ul li input:checked {
    background-color: #EF4B55
}

section .product-form .extra ul li label {
    display: inline-block;
    font-weight: 400;
    font-size: 12px;
    color: #04303E;
    -webkit-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
    margin-left: 12px
}

section .product-form .extra ul li label span {
    font-weight: 400;
    font-size: 13px;
    color: #EF4B55
}

section .product-form .delete ul {
    margin: 0 -3px
}

section .product-form .delete ul li {
    display: inline-block;
    margin: 0 3px
}

section .product-form .delete ul li input {
    display: none
}

section .product-form .delete ul li input+label {
    font-weight: 400;
    font-size: 12px;
    color: #04303E;
    padding: 5px 19px;
    border: 1px solid #EF4B55;
    border-radius: 10px
}

section .product-form .delete ul li input:checked+label {
    color: #EF4B55;
    text-decoration: line-through
}

section .product-form .note textarea {
    width: 100%;
    height: 100px;
    border: 1px solid #D8D8D8;
    border-radius: 10px;
    background-color: #fff;
    padding: 10px
}

section .product-form .plus {
    text-align: center
}

section .product-form .plus>div {
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    display: inline-block;
    border-radius: 27px;
    overflow: hidden
}

section .product-form .plus>div input {
    border-radius: 0;
    height: 54px;
    width: 54px;
    font-weight: 600;
    font-size: 25px;
    color: #04303E;
    -webkit-transform: translateY(2px);
    -ms-transform: translateY(2px);
    transform: translateY(2px);
    text-align: center
}

section .product-form .plus>div input:nth-child(2) {
    background-color: #EF4B55;
    color: #fff;
    font-size: 19px;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

section .add {
    padding: 25px 20px
}

section .add:after {
    content: "";
    display: block;
    clear: both
}

section .add a,
section .add button {
    background-color: #EF4B55;
    border-radius: 15px;
    height: 65px;
    font-weight: 600;
    font-size: 18px;
    color: #fff;
    width: 65%;
    display: inline-block;
    text-align: center;
    line-height: 65px
}

section .add div {
    height: 65px;
    float: right;
    border: 1px solid #EBEBEB;
    border-radius: 15px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    width: 33%;
    line-height: 65px;
    text-align: center;
    font-weight: 600;
    font-size: 18px;
    color: #04303E
}

section .total {
    background-color: #EF4B55;
    margin: 0 -10px 15px;
    padding: 20px
}

section .total:after {
    content: "";
    display: block;
    clear: both
}

section .total p {
    font-weight: 500;
    font-size: 18px;
    color: #fff
}

section .total p:first-child {
    float: left
}

section .total p:nth-child(2) {
    float: right
}

section .total-detail {
    border: 1px solid #CCCCCC;
    border-radius: 15px
}

section .total-detail table {
    width: 100%;
    border-collapse: collapse
}

section .total-detail table tr td,
section .total-detail table tr th {
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    text-align: center;
    height: 55px
}

section .total-detail table tr td:last-child,
section .total-detail table tr th:last-child {
    border-right: 0
}

section .total-detail table tr th {
    font-weight: 600;
    font-size: 15px;
    color: #EF4B55
}

section .total-detail table tr td {
    font-weight: 400;
    font-size: 15px;
    color: #04303E
}

section .total-detail table tr:last-child td,
section .total-detail table tr:last-child th {
    border-bottom: 0
}

section.categori {
    background-color: #F4F5F9;
    border-top: 1px solid #EDEDED;
    margin: 0 -10px;
    padding: 20px
}

#arama {
    padding: 70px 20px 45px;
    text-align: center;
    border-radius: 6px
}

#arama button {
    opacity: 0
}

#arama img {
    height: 45px
}

#arama h2 {
    font-weight: 400;
    font-size: 22px;
    color: #07B2B0;
    text-transform: capitalize;
    margin: 8px 0 24px
}

#arama ul {
    margin-bottom: 40px;
    width: 80vw
}

#arama ul li a {
    font-weight: 300;
    font-size: 19px;
    color: #07B2B0;
    display: block;
    padding: 22px 0;
    border-top: 1px solid #E2E2E2
}

#arama ul li:last-child a {
    border-bottom: 1px solid #E2E2E2
}

#arama>a {
    font-weight: 400;
    font-size: 20px;
    color: #07B2B0;
}

aside {
    position: fixed;
    z-index: 99;
    left: -100vw;
    top: 0;
    bottom: 0;
    width: 80%;
    background-color: rgba(4, 48, 62, 0.97);
    -webkit-box-shadow: 16px 8px 20px rgba(0, 0, 0, 0.29);
    box-shadow: 16px 8px 20px rgba(0, 0, 0, 0.29);
    padding: 50px 30px
}

aside h4 {
    font-weight: 600;
    font-size: 22px;
    color: #fff;
    margin-bottom: 35px
}

aside ul {
    height: 60vh;
    overflow-y: scroll
}

aside ul li a {
    display: block;
    padding: 11px 0;
    border-bottom: 1px solid #1E4C5C
}

aside ul li a:after {
    content: "";
    display: block;
    clear: both
}

aside ul li a img {
    width: 55px;
    height: 55px;
    border-radius: 10px;
    border: 1px solid #EAEAEA;
    float: left;
    margin-right: 25px
}

aside ul li a p {
    font-weight: 400;
    font-size: 19px;
    color: #fff;
    padding-top: 11px
}

aside .close {
    position: fixed;
    z-index: 99;
    right: -100vw;
    top: 0;
    bottom: 0;
    width: 20%
}

aside button {
    font-weight: 400;
    font-size: 19px;
    color: #fff;
    position: absolute;
    left: 30px;
    bottom: 50px
}

aside button img {
    -webkit-transform: translateY(23px);
    -ms-transform: translateY(23px);
    transform: translateY(23px)
}

.lang {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: rgba(4, 48, 62, 0.97);
    padding: 30vh 35px 0;
    text-align: center;
    top: -100vh
}

.lang .button {
    background-color: #E8F2FF;
    border: 1px solid #EDEDED;
    border-radius: 15px;
    display: block;
    font-weight: 400;
    font-size: 15px;
    color: #04303E;
    height: 70px;
    line-height: 70px;
    margin-bottom: 15px
}

.lang .close {
    color: #ADC4CB
}

.swal2-styled.swal2-confirm {
    background-color: #07B2B0 !important;
    outline: none !important;
    border-radius: 15px !important
}

.swal2-icon.swal2-success .swal2-success-ring {
    border: .25em solid #07B2B0 !important
}

.swal2-icon.swal2-success [class^=swal2-success-line] {
    background-color: #07B2B0 !important
}

header>a:nth-child(2) img {
    height: 80px;
}

/* #07B2B0 */