/* PUBLIC SETTINGS */
*, *::before, *::after {box-sizing: border-box;transition: var(--t03);}


*, html, body{margin: 0;padding: 0;font-family: var(--tf);transition: var(--t03);line-height: normal;} 
html, body{width: 100%;height: 100%;}
body{width: 100%;height: 100%;overflow: hidden;overflow-y: auto; background-color: var(--bodybg);color: var(--bodycolor);transition: opacity 0.5s ease;}
body.hidden {opacity: 0;}
a{text-decoration: none;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;}
a:active {text-decoration: none;}
button{background: transparent;outline: none;border: none;}
::-webkit-scrollbar {position: fixed;top:0;right: 0;height: 100%; width: 11px;background: transparent;}
::-webkit-scrollbar-thumb {background-color: var(--ccc);}
::-webkit-scrollbar-thumb:hover {background-color: #aaa;}
/* BASIC SETTINGS */
.satir_1{display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical; overflow:hidden;}
.satir_2{display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; overflow:hidden;}
.satir_3{display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical; overflow:hidden;}
/* YUKARI CIK BUTTONU */
.scroll_up_btn_nnt{position: fixed; display: flex; justify-content: center; align-items: center; height: 44px; width: 42px; background: var(--color); right: 30px; bottom: 10px; color: #FFFFFF; z-index: 10; font-size: 1.7rem; border-radius: 10px; border-bottom-width: 2px; cursor: pointer; opacity: 0; pointer-events: none; transition: all 0.3s ease; }
.scroll_up_btn_nnt.scroll_up_btn_nnt_show{bottom: 30px; opacity: 1; pointer-events: auto; }
.scroll_up_btn_nnt:hover{filter: brightness(90%); }
.scroll_up_btn_nnt.scroll_up_btn_nnt_show{bottom: 30px; opacity: 1; pointer-events: auto; }
.scroll_up_btn_nnt:hover{filter: brightness(90%); }
@media (max-width: 500px) {.scroll_up_btn_nnt{right: 15px; bottom: 15px; height: 38px; width: 35px; font-size: 1.1rem;} }
.ul_sifirla{list-style-type: none;margin: 0;padding:0;}
img.lazy {display: block;}
.img_cover{width: 100%;height: 100%;object-fit: cover;}
.img_contain{width: 100%;height: 100%;object-fit: contain;}
.body_no_scroll{overflow: hidden;}
@media (max-width: 768px) {}
.fff{color: var(--white);}
.black{color: var(--black);}
.color{color: var(--color);}

/* Pulse Grow */
@keyframes pulse-grow {to {transform: scale(1.1); } } 
.pulse-grow {display: inline-block; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); }
.pulse-grow:hover {animation-name: pulse-grow; animation-duration: 0.3s; animation-timing-function: linear; animation-iteration-count: infinite; animation-direction: alternate; }
@keyframes pulse-shrink {to {transform: scale(0.9); } }
.pulse-shrink {display: inline-block; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); }
.pulse-shrink:hover {animation-name: pulse-shrink; animation-duration: 0.3s; animation-timing-function: linear; animation-iteration-count: infinite; animation-direction: alternate; }
/* Push */
@keyframes push {50% {transform: scale(0.8); } 100% {transform: scale(1); } }
.push {display: inline-block; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); }
.push:hover {animation-name: push; animation-duration: 0.3s; animation-timing-function: linear; animation-iteration-count: 1; }
/* Float Shadow */
.float-shadow {display: inline-block; position: relative; transition-duration: 0.3s; transition-property: transform; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); }
.float-shadow:before {pointer-events: none; position: absolute; z-index: -1; content: ""; top: 100%; left: 5%; height: 10px; width: 90%; opacity: 0; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%); /* W3C */ transition-duration: 0.3s; transition-property: transform opacity; }
.float-shadow:hover {transform: translateY(-5px);}
.float-shadow:hover:before {opacity: 1; transform: translateY(5px); }
@keyframes hover {50% {transform: translateY(-3px); } 100% {transform: translateY(-6px); } } 
@keyframes hover-shadow {0% {transform: translateY(6px); opacity: 0.4; } 50% {transform: translateY(3px); opacity: 1; } 100% {transform: translateY(6px); opacity: 0.4; } }
.hover-shadow {display: inline-block; position: relative; transition-duration: 0.3s; transition-property: transform; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); }
.hover-shadow:before {pointer-events: none; position: absolute; z-index: -1; content: ""; top: 100%; left: 5%; height: 10px; width: 90%; opacity: 0; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%); /* W3C */ transition-duration: 0.3s; transition-property: transform opacity; }
.hover-shadow:hover {transform: translateY(-6px); animation-name: hover; animation-duration: 1.5s; animation-delay: 0.3s; animation-timing-function: linear; animation-iteration-count: infinite; animation-direction: alternate; }
.hover-shadow:hover:before {opacity: 0.4; transform: translateY(6px); animation-name: hover-shadow; animation-duration: 1.5s; animation-delay: 0.3s; animation-timing-function: linear; animation-iteration-count: infinite; animation-direction: alternate; }

/*mobil icon*/
.mobil_ico{display: flex;cursor: pointer;}
.mobil_ham {width: 60px; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform 400ms; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; }
.mobil_hamRotate.active {transform: rotate(45deg); }
.mobil_hamRotate180.active {transform: rotate(180deg);} 
.line {fill:none; transition: stroke-dasharray 400ms, stroke-dashoffset 400ms; stroke:var(--color); stroke-width:3; stroke-linecap:round; }
.mobil_ham .top {stroke-dasharray: 40 172; } .mobil_ham .middle {stroke-dasharray: 40 111; } 
.mobil_ham .bottom {stroke-dasharray: 40 172; } .mobil_ham.active .top {stroke-dashoffset: -132px; } 
.mobil_ham.active .middle {stroke-dashoffset: -71px; } .mobil_ham.active .bottom {stroke-dashoffset: -132px; }


/* KAPAK */
.kapak_content{position: relative; display: flex;flex-wrap: wrap; width: 100%;height: 100vh;justify-content: center;align-content: center;}
.kapak_bg{width: 100%;height: 100%;object-fit: cover;}
.kapak_ust_cotent{position: absolute;top: 0;left: 0;z-index: 10;display: flex;justify-content: center;align-content: center;flex-wrap: wrap;width: 100%;height: 100%;}
.kapak_logo{display: flex;width: 100%;justify-content: center;align-items: center;}
.kapak_logo > img{max-width: 100%;object-fit: contain;}
/* menu btn */
.btn1{position: relative;display: inline-flex;align-items: center;padding: 0.75rem 3rem;font-size: 1.125rem;font-weight: 500;background-color: var(--bg-white);color: var(--color);border: 2px solid var(--color);border-radius: 50px;overflow: hidden;transition: var(--t03);}
.btn1 .name{position: relative;z-index: 5;}
.btn1 .bg{position: absolute;width: 100%;height: 0;left: 0;z-index: 1;}
.btn1 .ico{position: absolute;z-index: 4;color:var(--white);font-size: 1.125rem;  display: inline-flex;width: 2.5rem;height: 2.5rem;justify-content: center;align-items: center;right: -3rem;visibility: hidden;opacity: 0;pointer-events: none;transition: var(--t03);}
.btn1:hover{color: var(--white);transition: var(--t03);}
.btn1:hover .bg{height: 100%;background-color: var(--color);transition-duration: 0.1s;transition-delay: 0.2s;}
.btn1:hover .ico{right: 5px;visibility: visible;opacity: 1;pointer-events: auto;transition-delay: .2s;}
/* lang ul - btn */
.lang_ul{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;gap: 8px;width: 100%;}
.btn2{display: inline-flex;align-items: center;justify-content: center;gap: 10px; padding:10px 20px;color: var(--color);border-radius: 50px;background-color: var(--bg-white);transition: var(--t03);transition: var(--t03);}
.btn2:hover, .btn2.active{background-color: var(--color);color: var(--white);transition: var(--t03);}

/* MENU */
/*header*/
.header_body{position: relative; display: flex;flex-wrap: wrap;width: 100%;max-height: 70vh;overflow: hidden;}
.header_logo{position: absolute;z-index: 5;left: 20px;top: 20px;max-width: 200px;}
.header_logo img{width: 100%;object-fit: contain;}
.header_bg{display: flex;width: 100%;height: 100%;}
.header_bg > img{width: 100%; object-fit: cover;object-position: center;}
.header_body .overley{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 2;opacity: 0.4;background-color: var(--overly-bg);}
@media (max-width: 768px) {.header_logo{left: 15px;top: 10px;max-width: 140px;}.header_body{height: 50vh;}}



/* urunler */
.menu_title{color: var(--titlecolor);font-weight: 700;}
.urun_ul{display: block;width: 100%;}
.urun_ul .urun_li{display: flex;width: 100%;align-items: flex-start;padding: 8px 15px;cursor: pointer;margin-bottom: 3px;font-size: 0.9rem;}
.urun_ul .urun_li:hover{background-color: var(--bg-white);}
.urun_ul .urun_li .name{display: flex;width: 100%;align-items: flex-start;color: var(--color);}
.urun_ul .urun_li .fiyat{display: inline-flex;flex-shrink: 0;color: var(--color);}
.banner_row, .banner_img{position: relative; display: flex;width: 100%;}
.banner_row{gap: 15px;}
.banner_img img{width: 100%;height: 450px;object-fit: cover;}
@media (max-width: 992px) {.banner_row .banner_img img{height: 400px;}}
@media (max-width: 768px) {
  .urun_ul .urun_li{padding: 6px 5px;}
  .mobil_ust{order: 1;}
  .mobil_alt{order: 2;}
}
@media (max-width: 650px) {.banner_row .banner_img img{height: 300px;}}
@media (max-width: 450px) {.urun_ul .urun_li{font-size: 0.8rem;}}

.modal_title{color: var(--titlecolor);}
.modal_img{width: 100%;max-height: 40vh;object-fit: contain;}
.urun_turu_ul{display: flex;flex-wrap: wrap;width: 100%;justify-content: center;}
.urun_turu_ul > li{padding: 0 5px;}
.urun_turu_ul > li .icon{display: flex;width: 50px;height: 50px;border-radius: 50px;padding: 10px;background-color: var(--bgf5);}
.urun_turu_ul > li .icon img{width: 100%;object-fit: contain;}
.modal_img_body{position: relative;width: 100%;}
.modal_content{font-size: 0.9rem;color: var(--color);}
.modal_fiyat{display: inline-flex;padding: 15px;font-weight: 600;}
.banner_img a, .modal_img_body a{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 5;}




.urundiv{display: flex;align-items: flex-start;padding: 8px 15px;cursor: pointer;margin-bottom: 3px;font-size: 0.9rem;justify-content: space-between;}
.urundiv:hover{background-color: var(--bg-white);}
.urundiv .name{display: flex;align-items: flex-start;color: var(--color);}
.urundiv .fiyat{display: inline-flex;flex-shrink: 0;color: var(--color);}
@media (max-width: 768px){ .urundiv{padding: 6px 5px;} }
@media (max-width: 450px){ .urundiv{font-size: 0.8rem;} }


/* FIX SABIT MENU */
.header_fixed{position: fixed;z-index: 99;top: -150px;visibility: hidden;opacity: 0;pointer-events: none; left: 0; width: 100%;background-color: var(--bg-white);transition: var(--t03);}
.header_fixed.active{top: 0;visibility: visible;opacity: 1;pointer-events: auto;transition: var(--t03);}
.fix_nav{visibility: hidden;opacity: 0;pointer-events: none; width: 100%;border-bottom: 1px solid var(--ccc);padding: 5px;}
.header_fixed.active .fix_nav{visibility: visible;opacity: 1;pointer-events: auto; width: 100%;}
.sabit_menu{display: flex;align-items: center; width: 100%;justify-content: space-between;}
.menu_logo{display: inline-flex; max-width: 100px;}
.menu_logo img{width: 100%;max-height: 60px; object-fit: contain;}
.sabit_menu_ul{display: flex;}


/* NEW RADIO CHECBOX */
.inputGroup {background-color: var(--bg-white);display: block;position: relative;border-radius: 25px;overflow: hidden;border: 1px solid var(--ccc);}
.inputGroup label {padding: 8px 45px 8px 15px;width: 100%;display: block;text-align: left;color: var(--black);cursor: pointer;position: relative;z-index: 2;transition: color 200ms ease-in;overflow: hidden;}
.inputGroup label:before {width: 10px;height: 10px;border-radius: 50%;content: "";background-color: var(--color);position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%) scale3d(1, 1, 1);transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);opacity: 0;z-index: -1;}
.inputGroup label:after {position: absolute; display: flex; justify-content: center; align-items: center; width: 30px; height: 30px; content:'\f00c'; font-family: "Font Awesome 6 Free"; font-weight: 900; border: 1px solid var(--ccc); background-color: var(--bg-white); color: var(--white); border-radius: 50%; z-index: 2; right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer; transition: all 200ms ease-in; }
.inputGroup input:checked ~ label {color: var(--white); }
.inputGroup input:checked ~ label:before {transform: translate(-50%, -50%) scale3d(56, 56, 1); opacity: 1; }
.inputGroup input:checked ~ label:after {background-color: #26bf07;border-color: #26bf07;}
.inputGroup input {width: 32px;height: 32px;order: 1;z-index: 2;position: absolute;right: 15px;top: 50%;transform: translateY(-50%);cursor: pointer;visibility: hidden;}


.nnt_input_box {align-items: center; border-radius: 100px; display: flex; font-weight: 700; margin-bottom: 16px;cursor:pointer;width: 100%;}
.nnt_input_box:last-of-type {margin: 0; } 
.nnt_input {clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; } 
.nnt_input:not([disabled]):active + .nnt_track, .nnt_input:not([disabled]):focus + .nnt_track {border: 1px solid transparent; box-shadow: 0px 0px 0px 2px #121943; }
.nnt_input:disabled + .nnt_track {cursor: not-allowed; opacity: 0.7; } 
.nnt_track {background: #e5efe9; border: 1px solid #5a72b5; border-radius: 100px; cursor: pointer; display: flex; height: 30px; margin-right: 12px; position: relative; width: 60px; } 
.nnt_indicator {align-items: center; background: #121943; border-radius: 24px; bottom: 2px; display: flex; height: 24px; justify-content: center; left: 2px; outline: solid 2px transparent; position: absolute; transition: 0.25s; width: 24px; }
.checkMark {position: relative;top: -2px; fill: #fff; height: 20px; width: 20px; opacity: 0; transition: opacity 0.25s ease-in-out; }
.nnt_input:checked + .nnt_track .nnt_indicator {background: #121943; transform: translateX(30px); } 
.nnt_input:checked + .nnt_track .nnt_indicator .checkMark {opacity: 1; transition: opacity 0.25s ease-in-out; }
@media screen and (-ms-high-contrast: active) {.nnt_track {border-radius: 0; } }
.nnt_input_box .ok{display: none; transition: var(--t03);}
.nnt_input_box .no{display: block;color: red; transition: var(--t03);}
.nnt_input_box input.nnt_input:checked ~ .ok {display: block;color: green; transition: var(--t03);}
.nnt_input_box input.nnt_input:checked ~ .no {display: none; transition: var(--t03);}
.nnt_input_box .checcolor{color: var(--color) !important;}

/* GIZLI MENU */
.offcanvas-body{position: relative;}
.gizlimenu_ul{display: block;width: 100%;margin-bottom: 60px;}
.gizlimenu_ul li:first-child{border-top: 1px solid var(--ccc);}
.gizlimenu_ul li{border-bottom: 1px solid var(--ccc);}
.gizlimenu_ul li a{display: flex;width: 100%;padding: 15px;color: var(--black);}
.gizlimenu_ul li a:hover{background-color: var(--bgf5); color: var(--color);}
.gizlimenu_footer{position: sticky;z-index: 99;bottom: 0;left: 0;width: 100%;background-color: var(--bg-white);}
.social_ul2{display: flex;width: 100%;padding: 15px;flex-wrap: wrap;gap: 10px;justify-content: center;}
.social_ul2 li a{color: var(--color);}
.social_ul2 li a .ico{display: flex;width: 40px;height: 40px;border-radius: 50%;flex-shrink: 0;background-color: var(--bgf5);justify-content: center;align-items: center;border: 1px solid var(--bgf5);}
.social_ul2 li a .ico:hover{background-color: var(--bg-white);border: 1px solid var(--color);}
@media (max-width: 450px) {.social_ul2 li a .ico{width: 30px;height: 30px;font-size: 0.8rem;} }




















/* FOOTER */
.footer_body{display: flex;width: 100%;height: 10vh;align-items: flex-end;}
.footer_Copyrights{display: flex;width: 100%;justify-content: center;height: 100%;align-items: flex-end;}