@import "fonts.css";
html, body {font-family: 'Montserrat', sans-serif;/* overflow-x: hidden; */background: #fff;scroll-behavior: smooth;}
:root {
    --main-color:#2460AB;
    --main-color-flu: rgba(36,96,171,.8);
}
.font-nycd {font-family: 'Caveat', cursive;font-size: 45px;}
.table-content{display: table; width: 100%; height: 100%;}
.table-cell-content{display: table-cell; vertical-align: middle; text-align: center;}
.table-content.left{display: table; width: 100%; height: 100%;}
.table-content.left .table-cell-content{display: table-cell; vertical-align: middle; text-align: left;}
.disp-block {display: block !important;}
.m0 {margin: 0 !important;}
.p0 {padding: 0;}
* {outline: none !important;}
.fl-r {float: right;}
.s-margin {margin: auto 60px;}
.df-center {display: flex;align-items: center;}
p.baslik{color: var(--main-color);font-size: 65px;font-family: 'Caveat', cursive;line-height: normal;font-weight: 200;}
p.baslik.small{font-size: 40px !important;}
p.baslik.big{font-size: 135px !important;}
.mt75 {margin-top: 75px !important;}
.mt50 {margin-top: 50px !important;}
.mt30 {margin-top: 30px !important;}
.mobile-visible{display:none;}
.wp-mesaj {position: fixed;bottom: 30px;right: 30px;z-index: 5;}
.wp-mesaj img{max-width: 50px;}
a {text-decoration: none !important;}
.h-fix {height:1px; min-height: 100%;}
.h-full {height:100%;}
.img-box {width: 100%; position: relative; background-size: cover !important; background-repeat: no-repeat !important; background-position: center center !important; background-color: transparent;}
.img-box::after {display: block; padding-bottom: 100%; content: '';}
.img-box.h50::after {display: block; padding-bottom: 50% !important; content: '';}
.h-m100 {min-height: 100vh;}
.img-box p.type {padding: 8px 30px; color: #fff; font-weight: 500; letter-spacing: 1px; position: absolute;bottom: 30px; right: 0; border-radius: 100px 0 0 100px;}
.img-box p.type.satilik {background: #34db3a;}
.img-box p.type.kiralik {background: #dce50d; color: #000;}
.m0a {margin: 0 auto; display: inline-block;position: relative;left: 50%;transform: translateX(-50%);}
h1.head {font-weight: 900; font-size: 35px; margin: 60px 0; color: #e21b12;}
.pl0 {padding-left: 0;}
.hidden {display: none !important;}
/* width */
::-webkit-scrollbar {width: 5px;}
/* Track */
::-webkit-scrollbar-track {background: #fff;}
/* Handle */
::-webkit-scrollbar-thumb {background: #000;}
.show {display: block !important;}

/*header {display: flex;align-items: center;justify-content: space-between;height: 80px;padding: 0 100px;position: fixed;top: 0;left: 0;width: 100%;z-index: 100;background: #fff;filter: invert(1);}*/
header {display: flex;align-items: center;justify-content: space-between;height: 80px;padding: 0 100px;position: fixed;top: 0;left: 0;width: 100%;z-index: 100;background: #000;gap: 90px;}
header img.logo {max-height: 50px;filter: invert(1)}
/*header.active {background:#000;border-bottom: 1px solid #e7e7e7;}*/
header ul {display: flex;align-items: center;justify-content: center;gap: 40px;list-style: none;padding: 0;margin: 0;}
header ul li a {font-size: 16px;color: #fff !important;font-weight: 600;letter-spacing: -.5px;text-transform: uppercase;}
header  ul.right {display: flex;align-items: center;justify-content: center;gap: 20px;list-style: none;padding: 0;margin: 0;}
header  ul.right li a {display: flex;align-items: center;justify-content: center;/*border-radius: 100px;*/border: 1px solid #3c3c3c;gap: 12px;font-size: 18px;color: #fff;font-weight: 500;padding: 12px 50px;transition: all .4s;height: 80px;border-top: none;border-bottom: none;}
header ul.right li a img {transition: all .4s; filter: invert(1)}
header ul.right li a:hover {background: #fff;color: #000 !important;}
header ul.right li a:hover img {filter:invert(0);}

/*header:not(.active) .right ul li a {border-color: #fff;color: #fff;}*/
/*header:not(.active) .right ul li a img {filter:invert(1);}*/



.home {height: 100vh;display: flex;align-items: stretch;justify-content: center;gap: 30px;padding:0 100px;position: relative;background: url(/front/images/homeBack.jpg) top center no-repeat;background-size: cover;overflow: hidden;}
.home .left {flex-direction: column;gap: 30px;display: flex;justify-content: flex-start;padding-top: 200px;width: 50%;}
.home .right {width: 50%}
.home h1 {margin: 0;font-size: 56px;color: #000;font-weight: 700;}
.home p {margin: 0;font-size: 22px;color: #000;font-weight: 300;line-height: 180%;width: 700px;max-width: 80%;margin-top: 30px;}
.home .right {transform: rotate(-15deg);display: flex;align-items: center;justify-content: center;}
.home img.urun {}
/*.home img.urun {position: absolute;top: 25%;right: 120px;filter: drop-shadow(-50px 50px 15px rgba(0, 0, 0, 0.15));max-width: 50%;width: 45%;transform: translateY(-50%);}*/
/*.home img.urun.active {transform: scale(1) translateY(-50%) translateX(0) rotate(-15deg);transform: scale(1) translateY(-50%) translateX(0) rotate(-15deg);opacity: 1;transition-delay: .4s;}*/


.urunDetails {padding:150px 100px;display: flex;align-items: stretch;justify-content: center;position: relative;padding-bottom: 0;margin-top: -130px;}
/*.urunDetails img.backProduct {position: absolute;top: 50%;right: -30%;transform: translateY(-50%);opacity: 1;width: 70%;z-index: 0;}*/
.urunDetails .content {display: inline-flex;align-items: flex-start;justify-content: center;flex-direction: column;width: 50%;gap: 40px;text-align: left;}
.urunDetails .content h2 {font-size: 46px;color: #000;font-weight: 700;}
.urunDetails .content h2:not(:first-child) {margin-top: 30px;}
.urunDetails .content p {font-weight: 400;font-size: 18px;color: #000;line-height: 180%;}
.urunDetails .content ul {padding: 0;margin: 0;/*list-style-image: url(/front/images/icons/tick.svg);*/display: flex;align-items: flex-start;justify-content: center;flex-direction: column;gap: 15px;list-style-position: inside;list-style: none}
.urunDetails .content ul li {font-size: 18px;color: #000;font-weight: 700;display: flex;}
.urunDetails .content ul li span {padding-left: 10px;font-weight: 300;}
.urunDetails .img img {padding-left: 100px;position: sticky;top: 120px;}


.productVideo {position: relative;margin: 0 250px;padding-top: 120px;}
.productVideo .video-content {overflow: hidden;border-radius: 20px;position: relative;}
.productVideo .video-content iframe {width: 100%;height: 550px;}
h2.head {font-size: 46px;color: #000;font-weight: 700;margin: 60px 0;text-align: center;}
.productVideo .video-content .overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(255,255,255,.8) url(/front/images/icons/tanitim-video.svg) center center no-repeat;background-size: 40%;display: none;}


a.urunsatinal {display: inline-flex;align-items: center;justify-content: center;border-radius: 100px;border: 1px solid #000;gap: 12px;font-size: 18px;color: #000;font-weight: 400;padding: 12px 35px;transition: all .4s;margin-top: 60px;}
a.urunsatinal:hover {background: #000;color: #fff;}


#sss {margin: 60px 0;padding:0 100px;display: flex;align-items: center;justify-content: center;flex-direction: column;margin-top: 0;padding-top: 100px;}
#sss .sss-content {margin-top: 60px;display: flex;align-items: flex-start;justify-content: flex-start;flex-direction: column;gap: 0px;width: 1000px;max-width: 90%;}
#sss .sss-content .item {display: flex;align-items: flex-start;justify-content: flex-start;flex-direction: column;width: 100%;}
#sss .sss-content .item p {font-size: 18px;color: #000;font-weight: 300;display: flex;flex-direction: column;/* gap: 15px; */width: 100%;}
#sss .sss-content .item p span {padding: 40px;line-height: 170%;border: 1px solid #efefef;border-radius: 30px;display: none;}
#sss .sss-content .item p strong {font-size: 18px;font-weight: 700;padding-bottom: 15px;cursor: pointer;background: #000;display: block;color: #fff;width: 100%;padding: 15px 30px;margin-bottom: 15px;transition: all .4s;position: relative;border-radius: 100px;}
#sss .sss-content .item p strong::before {content: '';position: absolute;top: 50%;right: 30px;transform: translateY(-50%);background: url(/front/images/icons/plus.svg) center center no-repeat;background-size: contain;width: 20px;height: 20px;transition: all .4s;}
#sss .sss-content .item p.active strong::before {transform: translateY(-50%) rotate(45deg);}


#cart {padding:0 100px;margin-bottom: 70px;}
#cart .urun_foto {height: 80px;}
#cart table tr td, #cart table tr th {vertical-align: middle;}
#cart table tr td .adetD {display: flex;align-items: center;justify-content: center;gap: 15px;}
#cart table tr td .adetD button {width: 40px;height: 40px;border-radius: 100px;background: #000;color: #fff;border: 0;font-size: 22px;font-weight: 400;transition: all .4s;}
#cart table tr td .adetD button:hover {transform: scale(1.2)}
#cart table tr td .adetD button svg {width: 40%;height: 40%;}
#cart table tr th {font-size: 18px;color: #000;font-weight: 600;}
#cart table tr td .buttonSatinAl {background: #000;border-radius: 10px;color: #fff;border: 1px solid #000;padding: 10px 40px;font-size: 16px;transition: all .4s;}
#cart table tr td .buttonSatinAl:hover {background: transparent;color: #000;}
#cart table tr td {padding:30px;}
#cart table tr td span.toplamFiyat {font-size: 18px;color: #000;font-weight: 400;margin-right: 30px;}
#cart table tr th {padding:10px 30px;}
#cart table tr td .urun_ad {font-size: 18px;color: #000;font-weight: 400;}
#cart table tr td .adetD input {border-radius: 100px;text-align: center;width: 70px;border: 1px solid #ddd;height: 40px;font-weight: 600;}
#cart table tr td .adetD input::-webkit-outer-spin-button, #cart table tr td .adetD input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0;}
#satin-al {width:400px;max-width: 90%;}
#satin-al form#teklif_formu {display: inline-block;position: relative;width: 100%;}
#satin-al form#teklif_formu .loading{position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;background: rgba(255,255,255,.7);display: none;}
#satin-al form#teklif_formu input {display: block;padding:14px 20px;border: 1px solid #dddddd;font-size: 18px;color: #000;margin-bottom: 15px;width: 100%;}
#satin-al form#teklif_formu textarea {display: block;padding:14px 20px;border: 1px solid #dddddd;font-size: 18px;color: #000;margin-bottom: 15px;width: 100%;height: 150px;}
#satin-al form#teklif_formu label {display: block;padding:20px 0;font-size: 24px;color: #000;}
#satin-al form#teklif_formu button {display: block;padding:14px 20px;border: 2px solid #000;background: #000000;color:#fff;font-size: 18px;width: 100%;transition: all .4s;}
#satin-al form#teklif_formu button:hover {background:transparent;color: #000;}
#satin-al form#teklif_formu *::placeholder {font-size: 16px;}



footer {padding: 70px 100px;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 50px;background: #fbfbfb;}
footer p.adres {margin-top:-20px;font-size: 18px;color: #000000;font-weight: 400;text-align: center;}
footer a.tel {font-size: 24px;color: #000;font-weight: 500;margin-top: -20px;}
footer ul {display: flex;align-items: center;justify-content: center;gap: 30px;list-style: none;margin: 0;padding: 0;}
footer ul li a {color: #8B8B8B;font-size: 18px;font-weight: 400;position: relative;}
footer ul li  a:hover {color: #000;}


@media screen and (max-width: 768px) {
    html,body {overflow-x: hidden;}
    header {padding: 0 15px;}
    .mobile-hidden {display: none !important;}
    .mobile-visible {display:block !important;}
    .mobile-visible.flx {display:flex !important;}
    .outer-menu{display: block !important; top: 28px !important;}
    .home {padding: 90px 15px;flex-direction: column;height: auto;}
    .home .left, .home .right {width: 100%;padding-top: 20px;gap: 10px;}
    .home .right {transform:scale(.9)}
    .home h1 {font-size: 32px;}
    .home p {font-size: 18px;max-width: 100%;margin-top: 10px;}
    .home p strong {font-size: 16px;}
    .home img.urun {width: 100%;}
    .urunDetails .img img {max-width: 100%;}
    .urunDetails {padding: 10px 15px;margin-top: 0;flex-direction: column;}
    .urunDetails .content,.urunDetails .img {width: 100%;gap: 30px;}
    .urunDetails .content h2 {font-size: 32px;}
    .urunDetails .content p {font-size: 14px;}
    .urunDetails .content ul li {font-size: 14px;}
    .urunDetails .img img {padding: 0;margin-top: 50px;}
    .productVideo {margin: 0 15px;padding-top: 50px;}
    .productVideo iframe {height: 250px !important;}
    h2.head {font-size: 32px;margin: 40px 0;}
    #sss {margin: 40px 0;padding:0 15px;}
    #sss .sss-content {max-width: 100%;margin-top: 40px;}
    #sss .sss-content .item p strong {font-size: 12px;}
    #sss .sss-content .item p strong::before {width: 13px;height: 13px;}
    #sss .sss-content .item p span {padding:25px;font-size: 14px;}
    footer ul {flex-direction: column;gap: 20px;}
    footer a.tel {font-size: 18px;}
    footer ul li a {text-align: center;font-size: 14px;}
    footer ul li {text-align: center;font-size: 14px;}
    footer ul.social {flex-direction: row;}
    .outer-menu .menu > div > div > ul > li > a {font-size: 16px;}
    .outer-menu .menu > div > div > ul > li {line-height: 35px !important;}
    #cart {padding: 0 15px;}
    #cart table tr td .adetD button svg {filter: brightness(0) invert(1);}
    #cart table tr td .adetD button {width: 20px;height: 30px;}
    #cart table tr td .adetD button span {width: 40%;height: 40%;display: flex;align-items: center;justify-content: center;line-height: 0;}
    #cart table tr td .urun_ad {line-height: normal;}
    #satin-al * {font-size: 14px !important;}
    #satin-al label {font-size: 18px !important;}
    #satin-al form#teklif_formu textarea {height: 100px;}
    #satin-al *::placeholder {font-size: 14px !important;}
}









.outer-menu {position: fixed; right: 76px; z-index: 999; display: none; margin-top: -11px; transition:margin .3s;}
.outer-menu .checkbox-toggle {position: absolute; top: 0; left: 0; z-index: 2; cursor: pointer; width: 60px; height: 60px; opacity: 0;}
.outer-menu .checkbox-toggle:checked + .hamburger > div {-webkit-transform: rotate(135deg); transform: rotate(135deg);}
.outer-menu .checkbox-toggle:checked + .hamburger > div:before, .outer-menu .checkbox-toggle:checked + .hamburger > div:after {top: 0; -webkit-transform: rotate(90deg); transform: rotate(90deg);}
.outer-menu .checkbox-toggle:checked + .hamburger > div:after {opacity: 0;}
.outer-menu .checkbox-toggle:checked ~ .menu {pointer-events: auto; visibility: visible;}
.outer-menu .checkbox-toggle:checked ~ .menu > div {-webkit-transform: translateX(0);transform: translateX(0);-webkit-transition-duration: .75s;transition-duration: .75s;}
.outer-menu .checkbox-toggle:checked ~ .menu > div > div {opacity: 1; -webkit-transition: opacity 0.4s ease 0.4s; transition: opacity 0.4s ease 0.4s;}
.outer-menu .checkbox-toggle:hover + .hamburger {}
.outer-menu .checkbox-toggle:checked:hover + .hamburger > div {-webkit-transform: rotate(225deg); transform: rotate(225deg);}
.outer-menu .hamburger {position: absolute; top: 0; left: 0; z-index: 1; width: 60px; height: 40px; padding: .5em 1em; cursor: pointer; -webkit-transition: box-shadow 0.4s ease; transition: box-shadow 0.4s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .hamburger > div {position: relative; -webkit-box-flex: 0; -ms-flex: none; flex: none; width: 100%; height: 2px; background: #fff; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .hamburger > div:before, .outer-menu .hamburger > div:after {content: ''; position: absolute; z-index: 1; top: -10px; left: 0; width: 100%; height: 2px; background: inherit; -webkit-transition: all 0.4s ease; transition: all 0.4s ease;}
.outer-menu .hamburger > div:after {top: 10px;}
.outer-menu .menu {position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; visibility: hidden; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; outline: 1px solid transparent; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .menu > div {width: 100%;height: 100%;color: #FEFEFE;background: rgba(0, 0, 0, 0.9);-webkit-transition: all 0.4s ease;transition: all 0.4s ease;-webkit-box-flex: 0;-ms-flex: none;flex: none;-webkit-transform: translateX(100%);transform: translateX(100%);-webkit-backface-visibility: hidden;backface-visibility: hidden;overflow: hidden;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
.outer-menu .menu > div > div {text-align: center; max-width: 90vw; max-height: 100vh; opacity: 0; -webkit-transition: opacity 0.4s ease; transition: opacity 0.4s ease; overflow-y: auto; -webkit-box-flex: 0; -ms-flex: none; flex: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.outer-menu .menu > div > div > ul {list-style: none; padding: 0 1em; margin: 0; display: block; max-height: 100vh; overflow: hidden;}
.outer-menu .menu > div > div > ul > li {padding: 0; margin: 1em; font-size: 24px; display: block; text-align: center; width: 100%; padding: 0; margin: 0; line-height: 50px;}
.outer-menu .menu > div > div > ul > li > a {/*--0%-100% border bottom actived----position: relative;*/ display: inline; cursor: pointer; color:#fff; -webkit-transition: color 0.4s ease; transition: color 0.4s ease;}
.outer-menu .menu > div > div > ul > li > a:hover {color: #e5e5e5; text-decoration: none;}
.outer-menu .menu > div > div > ul > li > a:hover:after {width: 100%;}
.outer-menu .menu > div > div > ul > li > a:after {content: ''; position: absolute; z-index: 1; bottom: -0.15em; left: 0; width: 0; height: 2px; background: #e5e5e5; -webkit-transition: width 0.4s ease; transition: width 0.4s ease;}