body{ width: calc(100% + 9px); height: 100%; padding: 0; margin: 0; font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 400; color: #111; background-color: #fff; overflow: overlay; overflow-x: hidden;}

.loading{ position: fixed; width: calc(100% + 9px); height: 100vh; background: #fff; top: 0; left: 0; z-index: 9999999999999999;}

::selection{ background: #f07d00; color: #fff;}

/* width */
::-webkit-scrollbar{ width: 9px;}

/* Track */
::-webkit-scrollbar-track{ background: transparent;}
 
/* Handle */
::-webkit-scrollbar-thumb{background: rgba(0,0,0,0.5); border-radius: 9px;}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover{ background: rgba(0,0,0,0.7);}

/* HEAD */

.head .tSocial{ width: 100%; text-align: right;}
.head .tSocial a{ text-decoration: none; color: currentColor; display: inline-block; margin-left: 10px;}
.head .tSocial a.facebook{ width: 20px; height: 20px; background: url(../images/social/facebook.png) no-repeat center; background-size: 16px 16px;}
.head .tSocial a.instagram{ width: 20px; height: 20px; background: url(../images/social/instagram.png) no-repeat center; background-size: 16px 16px;}
.head .tSocial a.whatsapp{ width: 20px; height: 20px; background: url(../images/social/whatsapp.png) no-repeat center; background-size: 16px 16px;}

.head{ width: 100%; background: #fff; padding-top: 15px; padding-bottom: 15px;}
.head .tahsilat{ max-width: 240px; width: 100%; position: relative;}
.head .tahsilat a{ height: 40px; text-decoration: none; display: inline-block; position: relative; color: currentColor; background: linear-gradient(to right, #f07d00, #f1bb03); border-radius: 10px; padding: 10px; padding-left: 40px; color: #fff;}
.head .tahsilat a::before{ width: 32px; height: 32px; left: 3px; top: 4px; position: absolute; content: ""; background-image: url(../images/tahsilat.png); background-repeat: no-repeat; background-position: left center; background-size: 32px 32px; }
.head .logo{ max-width: 280px; margin: auto;}
.head .logo a{ text-decoration: none; color: currentColor; display: block; width: 100%;}
.head .logo img{ width: 100%;}
.head .tk{ text-align: right;}
.head .tumDil{ position: relative;}
.head .tumDil select{ cursor: pointer; max-width: 120px; width: 100%; height: 40px; font-size: 14px; font-weight: 400; outline: none; border: 0; border-radius: 10px; color: #fff; text-align: center;}
.head .tumDil select{ -webkit-appearance: none; -moz-appearance: none; background-image: url("data:image/svg+xml;utf8,<svg fill='red' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>"); background-repeat: no-repeat; background-position-x: 100%; background-position: center right 5px; padding-left: 10px; padding-right: 1rem; background: linear-gradient(to right, #f07d00, #f1bb03);}
.head .tumDil::before{ content: ""; width: 26px; height: 26px; right: 0; top: 7px; position: absolute; background-image: url("data:image/svg+xml;utf8,<svg fill='white' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>"); background-repeat: no-repeat; background-position-x: 100%; background-position: center right 5px; padding-left: 10px; padding-right: 1rem;}
.head .tumDil select option{ background: #fff; color: #111;}

/* TOP MENU */

.top-menu{ position: relative; width: 100%; z-index: 3; text-align: center; border-top: 1px #ddd solid; margin-bottom: 1px;}
.top-menu ul{ list-style: none; margin: 0; padding: 0;}
.top-menu ul li{ display: inline-block; position: relative;}
.top-menu ul li a{ text-decoration: none; color: #111; padding: 15px 20px; display: block; font-size: 14px; font-weight: 700;}
.top-menu ul li:hover a{ color: #f07d00;}

.top-menu .sub-ul{ transition: 0.3s; text-align: left; position: absolute; z-index: 3; background: #fff; box-shadow: 0px 10px 30px rgba(0,0,0,0.2); width: 200px; left: 0; visibility: hidden; opacity: 0; margin-left: -15px;}
.top-menu .sub-ul.hover{ visibility: visible; opacity: 1; margin-left: 0;}
.top-menu .sub-ul li{ border-bottom: 1px #eee solid; width: 100%; margin-left: 0; border-top: 0;}
.top-menu .sub-ul li:hover{ border-bottom: 1px #eee solid;}
.top-menu .sub-ul li:last-child{ border-bottom: 0;}
.top-menu .sub-ul li a{ border-top: 0; width: 100%; text-decoration: none; color: #666 !important; font-size: 14px; font-weight: 400; padding: 0; margin: 0; padding: 10px 20px;}
.top-menu .sub-ul li a:hover{ color: #f07d00 !important;}

/* SLIDER */

.slider{ width: 100%;}
.slider img{ width: 100%;}

/* BANNER */

.banner{ width: 100%;}
.banner a{ text-decoration: none; color: currentColor; display: block; width: 100%;}
.banner img{ width: 100%;}

/* PAGE */

.page{ margin-top: 30px; margin-bottom: calc(2% + 30px);}

/* KATEGORİ LİSTESi */

.kat-list{ width: 100%; margin-bottom: calc(3% + 30px);}
.kat-list .item{ width: 100%;}
.kat-list .item a{ text-decoration: none; color: #111; display: block; width: 100%; overflow: hidden; position: relative;}
.kat-list .item img{ transition: 0.6s; width: 100%;}
.kat-list .item h1{ transition: 0.3s; font-size: 18px; font-weight: 500; position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; margin-bottom: 0; padding: 20px;}
.kat-list .item:hover img{ transform: scale(1.1);}
.kat-list .item:hover h1{ color: #df1a2b;}

/* ÜRÜN GRUPLARI */

.urun-grup{ width: 100%; margin-bottom: calc(4% + 30px); margin-top: 70px;}
.urun-grup a{ text-decoration: none; color: currentColor; display: block; width: 100%; height: 100%; text-align: center; border: 1px #ddd solid; padding: 20px;}
.urun-grup .img{ max-width: 140px; width: 100%; margin: auto; margin-top: -70px; background: linear-gradient(to right, #f07d00, #f1bb03); margin-bottom: 17px; padding: 10px; border-radius: 20px;}
.urun-grup .img img{ width: auto; height: 80px;}
.urun-grup .baslik{ font-family: 'DINEngCon', sans-serif; font-size: 24px; margin-bottom: 10px; padding: 0 20px; line-height: 1.1em; min-height: 52px;}
.urun-grup .icerik{ font-size: 13px; color: #888; height: 76px; overflow: hidden; margin-bottom: 20px;}
.urun-grup .detayBtn{ display: inline-block; background: #eee; padding: 7px 20px; padding-bottom: 9px; padding-right: 35px; border-radius: 20px;}
.urun-grup .detayBtn{ background-image: url(../images/arrow-right.png); background-repeat: no-repeat; background-position: right 15px center; background-size: 8px 10px;}

/* NEDEN 1 */

.neden1{ width: 100%; background: #f5f5f5; margin-bottom: calc(1% + 30px);}
.neden1 .container{ max-width: 650px;}
.neden1 h1{ font-size: 56px; font-family: 'TR Belove', sans-serif; line-height: 0.2em; margin-left: -60px; margin-top: -20px}
.neden1 h2{ font-family: 'DINEngCon', sans-serif; font-size: 60px; color: #f07d00;}
.neden1 ul{ list-style: none; padding: 0;}
.neden1 ul li{ background-image: url(../images/check.png); background-repeat: no-repeat; background-position: right center; background-size: 14px 14px; text-align:right; padding-right: 26px; margin-bottom: 5px;}

.neden1 .img{ max-width: 400px; position: absolute; bottom: 0;}
.neden1 .img img{ width: 100%;}

/* NEDEN 2 */

.neden2{ width: 100%; margin-bottom: calc(1% + 30px);}
.neden2 .item{ width: 100%; height: 100%;}
.neden2 .item.img img{ width: 100%;}
.neden2 .item a{ width: 100%; height: 100%; display: block; text-decoration: none; color: currentColor; text-align: center;}
.neden2 .item h1{ font-family: 'DINEngCon', sans-serif; color: #fff; line-height: 1em; padding: 20px;}
.neden2 .bg-orange{ background: linear-gradient(to right, #f07d00, #f1bb03);}
.neden2 .bg-gray{ background: linear-gradient(to right, #555, #999);}
.neden2 .detayBtn{ color: #fff; display: inline-block;}
.neden2 .detayBtn{ background-image: url(../images/arrow-right-w.png); background-repeat: no-repeat; background-position: right 15px center; background-size: 8px 10px; border: 2px #fff solid; padding: 8px 30px; padding-right: 40px; border-radius: 30px;}

/* ÜRÜN TEKLİ */

.urun-tekli{ width: 100%; margin-bottom: calc(2% + 30px);}
.urun-tekli .col-lg-12{ display: flex; align-items: center;}
.urun-tekli .container-fluid{ max-width: 960px;}
.urun-tekli a{ text-decoration: none; color: currentColor; display: block; width: 100%; height: 100%; display: flex; align-items: center;}

.urun-tekli .img{ width: 50%; margin-right: 20px;}
.urun-tekli .img ul{ list-style: none; padding: 0;}
.urun-tekli .img ul li{ width: calc(50% - 10px); float: left; margin-right: 10px; margin-bottom: 10px;}
.urun-tekli .img ul li:first-child{ margin-top: 60px;}
.urun-tekli .img ul li img{ width: 100%;}

.urun-tekli .icerik{ width: 50%;}
.urun-tekli .icerik h1{ font-family: 'DINEngCon', sans-serif; line-height: 1.0em; border-bottom: 1px #ddd solid; padding-bottom: 15px; margin-bottom: 15px;}
.urun-tekli .icerik p{}
.urun-tekli .icerik .detayBtn{ font-size: 14px; font-weight: normal; background: #f07d00; display: inline-block; padding: 10px 20px; padding-right: 40px; color: #fff; border-radius: 30px;}
.urun-tekli .icerik .detayBtn{ background-image: url(../images/arrow-right-w.png); background-repeat: no-repeat; background-position: right 15px center; background-size: 12px 14px;}

/* ÜRÜN VİDEO */

.urun-video{ width: 100%; margin-bottom: calc(1% + 30px);}
.urun-video .row{ align-items: center;}
.urun-video .icerik{}
.urun-video .icerik h1{ font-family: 'DINEngCon', sans-serif; line-height: 1.0em; border-bottom: 1px #ddd solid; padding-bottom: 15px; margin-bottom: 15px;}
.urun-video .icerik p{}
.urun-video iframe{ width: 100%; height: 300px;}

/* ÜRÜN GALERİ */

.urun-galeri{ width: 100%; margin-bottom: calc(2% + 90px) }
.urun-galeri a{ text-decoration: none; color: currentColor; display: block;}
.urun-galeri img{ width: 100%;}

/* HABER */

.haber a{ text-decoration: none; color: currentColor; display: inline-block; width: 100%; position: relative;}
.haber img{ width: 100%;}
.haber h1{ width: 100% !important; font-size: 24px; font-weight: 900; text-align: center; margin-bottom: 20px;}

.haber .overlay{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); padding: 20px;}
.haber .overlay .content{ width: calc(100% - 40px); color: #fff; position: absolute; bottom: 20px; left: 20px;}
.haber .overlay .content h2{ font-size: 18px; font-weight: 800; margin-bottom: 5px;}
.haber .overlay .content span{ font-size: 14px; display: block; margin-bottom: 8px; border-bottom: 1px solid #ff6d00; padding-bottom: 8px;}
.haber .overlay .content p{ font-size: 14px;}
.haber .overlay .content .detail-btn{ color: #fff; font-weight: 800;}

/* LOGOS */

.logos{ margin-bottom: calc(1% + 30px);}
.logos img{ width: auto;}
.logos a{ text-align: center; display: block; width: 100%; position: relative; height: 100%;}
.logos h1{ font-family: 'DINEngCon', sans-serif; text-align: center; font-size: 32px; margin-bottom: 20px;}

/* BROŞÜR */

.brosur{ text-align: center; margin-bottom: calc(2% + 30px);}
.brosur .icon{ width: 108px; display: inline-block; margin: auto; margin-bottom: 15px;}
.brosur .icon img{ width: 100%;}
.brosur h1{ font-size: 24px; font-weight: 900; color: #3455aa;}
.brosur a.indir{ text-decoration: none; color: #111; font-weight: 500;}

.brosur .vid{ width: 100%;}
.brosur .vid img{ width: 100%;}

/* REFERANSLAR */

.referanslar{ margin-bottom: calc(2% + 30px);}
.referanslar a{ text-decoration: none; color: currentColor; display: inline-block; width: 100%; position: relative;}
.referanslar img{ width: 100%;}
.referanslar h1{ width: 100% !important; font-size: 24px; font-weight: 900; text-align: center; margin-bottom: 20px;}

.referanslar .overlay{ transition: 0.3s; position: absolute; top: 0; left: 0; transform: scale(0.8); width: 100%; height: 100%; background: rgba(0,0,0,0.5); padding: 20px; visibility: hidden; opacity: 0;}
.referanslar .overlay .content{ width: calc(100% - 40px); color: #fff; position: absolute; bottom: 20px; left: 20px;}
.referanslar .overlay .content h2{ font-size: 18px; font-weight: 800; margin-bottom: 5px;}
.referanslar .overlay .content span{ font-size: 14px; display: block; margin-bottom: 8px; border-bottom: 1px solid #ff6d00; padding-bottom: 8px;}
.referanslar .overlay .content p{ font-size: 14px;}

.referanslar a:hover .overlay{ visibility: visible; opacity: 1; transform: scale(0.9);}

/* MENU TAB */

.menu-tab{ margin-bottom: calc(2% + 30px);}
.menu-tab .tab{ width: 100%; text-align: center;}
.menu-tab ul.tabs{ margin: 0px; padding: 0px; list-style: none; margin-bottom: 30px;}
.menu-tab ul.tabs .tab-link{ font-size: 15px; letter-spacing: 1px;}
.menu-tab ul.tabs li{ background: #aaa; color: #fff; display: inline-block; padding: 10px; padding-top: 12px; cursor: pointer; font-weight: 800;}
.menu-tab ul.tabs li.tcurrent{ background: #3455aa; position: relative;}
.menu-tab ul.tabs li.tcurrent::after{ position: absolute; content: ""; bottom: -16px; left: 50%; margin-left: -10px; width: 21px; height: 12px; background-image: url(../images/arrow-down.png); background-repeat: no-repeat; background-position: center; background-size: 21px 12px;}
.menu-tab .tab-content{ display: none; background: #fff; font-size: 15px; text-align: justify;}
.menu-tab .tab-content.tcurrent{ display: inherit; animation: fadeIn 1s; -webkit-animation: fadeIn 1s;}

.menu-tab a{ text-decoration: none; color: currentColor; display: inline-block;}
.menu-tab img{ width: 100%;}
.menu-tab .detail-btn{ float: right; border: 1px solid #ff6d00; color: #3455aa; border-radius: 10px; padding: 7px; padding-bottom: 6px; font-weight: 800; padding-left: 15px; padding-right: 15px;}

.menu-tab .owl-nav{ display: none;}
.menu-tab .owl-dots{ text-align: center;}
.menu-tab .owl-dots button{ width: 10px; height: 10px; border-radius: 100%; background: #111; margin-left: 4px; margin-right: 4px; outline: none; opacity: 0.5;}
.menu-tab .owl-dots button.active{ background: #ff6d00; opacity: 1; width: 14px; height: 14px; position: relative; top: 2px;}

/* INFO */

.info{ margin-bottom: 30px;}

/* MEDIA */

.media{ margin-bottom: 5px;}
.media a{ text-decoration: none; color: currentColor; display: block; width: 100%; overflow: hidden; border-radius: 20px;}
.media img{ width: 100%; transition: 0.6s;}
.media a:hover img{ transform: scale(1.1);}

/* REFERANS LIST */

.referans-list{}
.referans-list ul{ list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap;}
.referans-list ul li{ display: block; width: calc(50% - 15px);}
.referans-list ul li:nth-child(odd){ margin-right: 15px;}
.referans-list ul li:nth-child(even){ margin-left: 15px;}
.referans-list ul li a{ text-decoration: none; color: currentColor; display: block; width: 100%;}

.referans-list ul li .img{ position: relative; overflow: hidden;}
.referans-list ul li .img .icn{ display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; border-radius: 100%; position: absolute; z-index: 2; top: 50%; margin-top: -25px; margin-left: -25px; left: 50%; background: #df1a2b; color: #fff; text-align: center; font-size: 32px;}
.referans-list ul li .img img{ transition: 0.6s; width: 100%;}

.referans-list ul li .content{ text-align: center; max-width: 400px; margin: auto; background: #fff; position: relative; top: -65px; padding: 30px; box-shadow: 0px 10px 30px rgba(0,0,0,0.05);}
.referans-list ul li .content .date{ position: relative; padding-right: 14px; margin-right: 10px; display: inline-block; font-weight: 900; color: #f07d00;}
.referans-list ul li .content .date::after{ position: absolute; content: ""; border-right: 1px #aaa solid; width: 1px; height: 24px; right: 0;}
.referans-list ul li .content .title2{ display: inline-block;}
.referans-list ul li .content .title1{ font-size: 18px; font-weight: 900; margin-top: 10px;}

.referans-list ul li a:hover img{ transform: scale(1.1);}

/* REFERANS DETAY */

.referans-detay{}
.referans-detay a{ text-decoration: none; color: currentColor; display: inline-block; width: 100%; text-align: center;}
.referans-detay img{ max-width: 100%; margin: auto; margin-bottom: 10px;}
.referans-detay h1{ text-align: center; font-size: 18px;}

/* URUN LIST */

.urun-list{ margin-bottom: 10px;}
.urun-list .urn{ margin-bottom: 30px;}
.urun-list a{ position: relative; height: 100%; text-align: center; text-decoration: none; color: currentColor; display: block; width: 100%; }
.urun-list a:hover{ border-color: #df1a2b;}
.urun-list .img{ width: 100%; background: #000;}
.urun-list .img img{ width: 100%; opacity: 0.9; transition: 0.6s;}
.urun-list .baslik{ position: relative; font-size: 32px; font-weight: 700; position: absolute; bottom: 0; color: #fff; padding: 12px 20px; padding-bottom: 17px; width: 100%; text-align: left; background: rgba(0,0,0,0.5);}
.urun-list .baslik span{ font-family: 'DINEngCon', sans-serif; font-weight: normal; font-size: 39px; text-shadow: 0px 10px 10px #111; display: block; line-height: 1.1em;}
.urun-list .baslik .detayBtn{ font-size: 14px; font-weight: normal; background: rgba(240, 125, 0, 0.7); display: inline-block; padding: 10px 20px; padding-right: 40px;}
.urun-list .baslik .detayBtn{ background-image: url(../images/arrow-right-w.png); background-repeat: no-repeat; background-position: right 15px center; background-size: 12px 14px;}

/* URUN DETAY */

.urun-detay{ margin-bottom: calc(2% + 30px);}
.urun-detay h1{ font-size: 20px; display: inline-block; font-weight: 600; margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px #ddd solid;}
.urun-detay .kod{ margin-bottom: 5px;}
.urun-detay .kategori{ margin-bottom: 15px;}
.urun-detay .fiyat{ margin-bottom: 20px;}
.urun-detay .fiyat b{ font-size: 20px; font-weight: 800; color: #df1a2b;}
.urun-detay .secenekler{}
.urun-detay .secenekler h1{ background: #df1a2b; color: #fff; font-size: 14px; font-weight: 600; padding: 0; padding: 10px; margin-bottom: 30px; display: inline-block;}
.urun-detay .secenekler ul{ display: flex; width: 100%; flex-wrap: wrap; list-style: none; margin: 0; padding: 0;}
.urun-detay .secenekler ul li{ width: calc(25% - 10px); margin-right: 10px; border-right: 1px #ccc solid; margin-bottom: 20px;}
.urun-detay .secenekler ul li:nth-child(4n){ margin-right: 0; border-right: 0;}
.urun-detay .secenekler ul li a{ text-decoration: none; color: currentColor; display: block; width: 100%; padding: 0 10px;}
.urun-detay .secenekler ul li h2{ font-size: 13px;}
.urun-detay .secenekler ul li h3{ font-size: 13px;}
.urun-detay .secenekler ul li img{ width: 100%;}

/* DİĞER URUNLER */

.diger-urunler h1{ font-family: 'DINEngCon', sans-serif; font-size: 32px; font-weight: 800; margin-bottom: 20px; text-align: center;}
.diger-urunler a{ position: relative; height: 100%; text-align: center; text-decoration: none; padding: 20px; color: currentColor; display: block; width: 100%; border: 1px #ccc solid; }
.diger-urunler a:hover{ border-color: #df1a2b;}
.diger-urunler .img{ width: 100%; margin-bottom: 20px;}
.diger-urunler .img img{ width: 100%;}
.diger-urunler .kod{ border-bottom: 1px #ccc solid; padding-bottom: 10px; margin-bottom: 10px;}
.diger-urunler .kod b{ display: block;}
.diger-urunler .baslik{ position: relative; min-height: 74px; border-bottom: 1px #ccc solid; padding-bottom: 10px; margin-bottom: 10px; font-weight: 700;}
.diger-urunler .fiyat{ color: #df1a2b; font-weight: 800;}

/* PARTNER LIST */

.partner-list{}
.partner-list a{ text-decoration: none; color: currentColor; display: table; width: 100%; margin-bottom: 30px;}
.partner-list h1{ font-size: 19px; font-weight: 800;}
.partner-list h2{ font-size: 15px; font-weight: 500;}

.partner-list .img{ display: table-cell; vertical-align: middle; width: 120px;}
.partner-list .img img{ width: 108px; object-fit: contain;}
.partner-list .content{ display: table-cell; vertical-align: middle; padding-left: 10px;}






















/* SERVICES */

.services{ margin-bottom: calc(2% + 30px);}
.services a{ text-align: center; color: #fff; display: block; width: 100%; position: relative; overflow: hidden;}
.services .shadow{ transition: 0.6s; position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,0.6); top: 0; left: 0;}
.services .title{ font-size: 20px; font-weight: 800; letter-spacing: 1px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 15px;}
.services .title::before{ content: ""; position: absolute; height: 100%; top: 0; left: -5px; border: 3px solid red; border-right: none; padding: 7px;}
.services .title::after{ content: ""; position: absolute; height: 100%; top: 0; right: -5px; border: 3px solid red; border-left: none; padding: 7px;}
.services img{ transition: 0.6s;}
.services a:hover img{ transform: scale(1.1);}
.services a:hover .shadow{ opacity: 0;}

/* ABOUT */

.about{ text-align: center; padding-left: 20px; padding-right: 20px; margin-bottom: calc(2% + 30px);}
.about::before{ z-index: 1; width: 431px; height: 338px; left: calc(-100% + 431px); top: -40px; position: absolute; content: ""; background-image: url(../images/sol-img.jpg); background-repeat: no-repeat; background-position: center; background-size: cover;}
.about p{ position: relative; z-index: 2;}
.about p::before{ width: 22px; height: 44px; top: 0; left: -22px; position: absolute; content: ""; background-image: url(../images/quote-left.png); background-repeat: no-repeat; background-position: center; background-size: 22px 44px;}
.about p::after{ width: 22px; height: 44px; bottom: 10px; right: -22px; position: absolute; content: ""; background-image: url(../images/quote-right.png); background-repeat: no-repeat; background-position: center; background-size: 22px 44px;}
.about .detail-btn{ border: 0; background: red; color: #fff; display: inline-block; padding: 7px; padding-left: 15px; padding-right: 15px; font-size: 13px; letter-spacing: 1px; font-weight: 500;}

/* REFERENCES */

.references{ text-align: center; margin-bottom: calc(2% + 30px);}
.references h1{ font-size: 26px; text-align: center; font-family: 'Playfair Display', sans-serif; border-bottom: 1px #111 solid; display: inline-block; margin-bottom: 20px;}
.references a{ text-align: center; text-decoration: none; color: currentColor; display: block; width: 100%;}

/* PROJECTS */

.projects{ width: 100%; padding: 30px; padding-bottom: 10px; background: #000; position: relative;}
.projects a{ text-decoration: none; color: #fff;}
.projects::after{ content: ""; width: 50%; height: 100%; position: absolute; top: 0; right: 0; padding: 30px; background-image: url(../images/reference-bg.jpg); background-repeat: no-repeat; background-position: center left; background-size: cover;}
.projects ul{ list-style: none; padding: 0; margin: 0; display: flex;}
.projects ul li{ display: inline-block; width: 50%; float: left;}
.projects ul li img{ width: 100%;}
.projects ul li a{ text-decoration: none; color: #fff; display: block; width: 100%;}
.projects ul li h1{ display: inline-block; font-size: 22px; font-weight: 800; letter-spacing: 1px; border-bottom: 1px #666 solid; padding-bottom: 20px; margin-bottom: 20px;}
.projects ul li p{ font-weight: 400;}

.projects ul li:nth-child(2){ background: linear-gradient(to right, #333, transparent); padding: 40px;}

.projects .detail-btn{ display: inline-block; font-size: 15px; font-weight: 400; letter-spacing: 1px; border-bottom: 1px #666 solid; padding-bottom: 5px;}
.projects .detail-btn i{ color: red;}

/* PAGE CONTENT */

.content{}

/* PAGE LIST */

.list{ margin-bottom: 30px;}
.list::after{ content: ""; display: block; clear: both;}
.list h1{ font-family: 'PlayFair Display', sans-serif; font-size: 28px; margin-bottom: 20px;}
.list .date{ font-size: 14px; color: #999; margin-bottom: 10px;}
.list p{ margin-bottom: 20px;}

.list ul{ list-style: none; padding: 0; margin: 0; width: 100%;}
.list ul li{ margin-bottom: 30px; text-align: center;}
.list ul li a{ text-decoration: none; color: #111; display: block; width: 100%;}
.list ul li .img{ width: 100%; margin-bottom: 20px; border: 1px #ccc solid; overflow: hidden; background: #111;}
.list ul li .img img{ width: 100%; transition: 0.6s;}
.list ul li h2{ font-size: 16px; font-weight: 800; text-align: center; margin-bottom: 10px;}

.list ul li a:hover img{ transform: scale(1.1); opacity: 0.8;}

.list ul li:nth-child(2n+1){ width: calc(50%  - 15px); margin-right: 15px; float: left;}
.list ul li:nth-child(2n+2){ width: calc(50%  - 15px); margin-left: 15px; float: left;}

.list .detail-btn{ border: 0; background: red; color: #fff; display: inline-block; padding: 7px; padding-left: 15px; padding-right: 15px; font-size: 13px; letter-spacing: 1px; font-weight: 500;}

.list.columns-3 ul li:nth-child(3n+1){ width: calc(33.333%  - 15px); margin-left: 0; margin-right: 15px; float: left;}
.list.columns-3 ul li:nth-child(3n+2){ width: calc(33.333%  - 15px); margin-right: 7px; margin-left: 7px; float: left;}
.list.columns-3 ul li:nth-child(3n+3){ width: calc(33.333%  - 15px); margin-right: 0; margin-left: 15px; float: left;}

.list.columns-3 ul li p{ font-size: 13px; color: #777; font-weight: 500; margin-bottom: 20px; text-align: justify; height: 57px; overflow: hidden;}

/* PAGE DETAIL */

.detail{}
.detail .img{ max-width: 500px; width: 100%; margin: auto; margin-bottom: 30px;}
.detail .img a{ text-decoration: none; display: block; width: 100%;}
.detail .img img{ width: 100%;}
.detail h1{ font-family: 'PlayFair Display', sans-serif; font-size: 28px; margin-bottom: 20px; text-align: center;}
.detail .date{ display: block; width: 100%; text-align: center; margin-bottom: 20px; color: #999;}
.detail .gallery{ max-width: 600px; width: 100%; margin: auto; margin-bottom: 30px;}
.detail p{ text-align: justify; margin-bottom: 30px;}

.detail .media{ margin-bottom: 30px;}
.detail .media img{ width: 100%;}

.detail-tab{}
.detail-tab .tab{ width: 100%; text-align: left;}
.detail-tab ul.tabs{ margin: 0px; padding: 0px; list-style: none;}
.detail-tab ul.tabs .tab-link{ font-size: 14px;}
.detail-tab ul.tabs li{ background: none; color: #222; display: inline-block; padding: 10px 20px; cursor: pointer; font-weight: 700; border-right: 1px #ccc solid;}
.detail-tab ul.tabs li:last-child{ border-right: 0;}
.detail-tab ul.tabs li.tcurrent{ color: #df1a2b;}
.detail-tab .tab-content{ display: none; background: #fff; padding: 20px; font-size: 14px; text-align: justify; border: 1px #ccc solid;}
.detail-tab .tab-content.tcurrent{ display: inherit; animation: fadeIn 1s; -webkit-animation: fadeIn 1s;}

/* CONTACT */

.map{ margin-bottom: 30px; height:380px;}
  .map iframe { width: 100%; height: 100%; }

.contact-info{ margin-bottom: 30px;}
.contact-info h1{ font-size: 18px; font-weight: 800; margin-bottom: 20px; text-decoration: underline;}
.contact-info ul{ list-style: none; padding: 0; margin: 0;}
.contact-info ul li{ margin-bottom: 10px;}
.contact-info ul li b{ padding-bottom: 2px;}
.contact-info ul li a{ text-decoration: none; color: currentColor;}
.contact-info ul li a b{}

.contact-form { width: 100%; }
  .contact-form h1 { font-size: 18px; font-weight: 800; margin-bottom: 20px; text-decoration: underline; }
.grup-elementleri{ list-style: none; padding: 0;}
.grup-elementleri .element-textbox{ margin-bottom: 15px;}
.grup-elementleri .element-textbox input{ width: 100% !important; background: #f5f5f5 !important; outline: 0; height: 50px; padding: 0 15px !important; border: 2px #f5f5f5 solid !important; font-size: 13px;}
.grup-elementleri .element-textbox input:focus{ background: #fff; border-color: #ddd;}
.grup-elementleri .element-textarea{ margin-bottom: 15px;}
.grup-elementleri .element-textarea textarea{ width: 100%; border: 0; background: #f5f5f5; outline: 0; height: 110px; padding: 15px; border: 2px #f5f5f5 solid; font-size: 13px;}
.grup-elementleri .element-textarea textarea:focus{ background: #fff; border-color: #ddd;}
.grup-elementleri label{ display: none;}
.contact-form .form-gonder-button { background: linear-gradient(to right, #f07d00, #f1bb03); border: 0; color: #fff; padding: 15px 30px; border-radius: 10px; font-size: 14px; font-weight: 600; }

/* BREADCRUMB */

.breadcrumb{ background: #fff; margin-bottom: 30px; display: block;}
.breadcrumb a{ text-decoration: none; color: currentColor; font-size: 13px;}
.breadcrumb span{ font-size: 13px; padding-left: 8px; padding-right: 8px;}
.breadcrumb a:last-child{ font-weight: bold;}

/* SAYFALAMA */

.sayfalama{ width: 100%; text-align: center;}
.sayfalama a{ border: 1px solid #ccc; text-decoration: none; color: #ccc; width: 36px; height: 37px; display: inline-flex; justify-content: center; align-items: center;}
.sayfalama a.sol.ar::before{ content: "<";}
.sayfalama a.sag.ar::after{ content: ">";}
.sayfalama a.aktif{ border: 1px solid #f07d00; background: #f07d00; color: #fff;}

/* İKONLAR */

.ikonlar{ margin-bottom: 30px; text-align: center;}
.ikonlar .container{ background: #f8f8f8; padding: 20px 0;}
.ikonlar ul{ list-style: none; padding: 0; margin: 0; width: 100%; display: flex; flex-wrap: wrap;}
.ikonlar ul li{ width: 25%;}
.ikonlar ul li .img{ width: auto; height: 80px; margin: auto; margin-bottom: 5px;}
.ikonlar ul li .img img{ width: auto; height: 80px;}
.ikonlar ul li a{ text-decoration: none; color: currentColor; display: block; padding: 10px; width: 100%; align-items: center;}
.ikonlar ul li h1{ font-family: 'DINEngCon', sans-serif; font-size: 26px; letter-spacing: -1px; color: #f07d00;}
.ikonlar ul li h2{ font-size: 13px; font-weight: 400; color: #999;}

/* FOOTER */

.footer-logo{  width: 100%;}
.footer-logo a{ max-width: 280px; margin: auto; text-decoration: none; color: currentColor; display: block; width: 100%;}
.footer-logo img{ width: 100%;}

.footer { width: 100%; height: 100%; position: relative; z-index: 2; padding-top: calc(1% + 30px); padding-bottom: calc(1% + 5px); background: #f8f8f8;}

.footer-logo{ width: 100%; position: relative; z-index: 2; margin-bottom: 30px !important; border-bottom: 1px #ddd solid; padding-bottom: 30px;}
.footer-logo a{ width: 280px; margin: auto; text-decoration: none; color: currentColor;}
.footer-logo a img{ width: 100%;}

.footer-social{ position: relative; z-index: 2; margin-top: 30px; text-align: center;}
.footer-social a{ text-decoration: none; color: currentColor; width: 50px; height: 50px; display: inline-block;}
.footer-social .facebook{ background-image: url("../images/social/facebook-g.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}
.footer-social .twitter{ background-image: url("../images/social/twitter-g.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}
.footer-social .instagram{ background-image: url("../images/social/instagram-g.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}
.footer-social .pinterest{ background-image: url("../images/social/pinterest-g.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}
.footer-social .whatsapp{ background-image: url("../images/social/whatsapp-g.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}

.f-item{ width: 100%; position: relative; z-index: 2;}
.f-item h1{ font-size: 15px; font-weight: 600; margin-bottom: 20px; color: #111;}
.f-item ul{ list-style: none; padding: 0; margin: 0;}
.f-item ul li{ display: block; margin-bottom: 10px; font-size: 13px; color: #111;}
.f-item ul li a{ width: 100%; display: inline-block; text-decoration: none; color: #111; font-size: 13px; font-weight: 400;}
.f-item ul li a b{ font-size: 19px; font-weight: bold; color: #111; font-weight: 900;}
.f-item ul li b{ font-size: 21px; font-weight: bold; color: #111; font-weight: 900;}

.f-faaliyet ul{ columns: 2;}

/* FOOTER ALT */

.footer-alt{ width: 100%; background: #fff; padding-top: 15px; padding-bottom: 15px; position: relative; z-index: 2; bottom: 0; color: #111;}
/*.footer-alt .container{ border-top: 1px #ddd solid; padding-top: 15px;}*/
.footer-alt .copyright{ text-align: left; font-size: 14px;}
.footer-alt .design{ text-align: right; font-size: 14px;}
.footer-alt .design a{ text-decoration: none; color: #111; font-weight: bold; font-size: 14px;}

/* GO TO TOP */

#go-to-top{ display: inline-block; background: linear-gradient(to right, #f07d00, #f1bb03); color: #fff; border: 0; width: 50px; border-radius: 10px; height: 50px; text-align: center; 
            position: fixed; bottom: 100px; right: 20px; transition: background-color .3s, opacity .5s, visibility .5s; opacity: 0; visibility: hidden; z-index: 1000; text-decoration:none; outline:none; font-size:14px; font-weight:300; text-align:center; }
#go-to-top:hover {}
#go-to-top:active {}
#go-to-top.show { opacity: 1; visibility: visible; }
#go-to-top i{ font-size: 24px; }

/* OTHERS */

.others{}
.others h1{ font-family: 'PlayFair Display', sans-serif; font-size: 28px; margin-bottom: 20px; text-align: center;}
.others a{ text-decoration: none; color: currentColor; display: block; width: 100%; position: relative;}
.others img{ width: 100%;}
.others .shadow{ width: 100%; position: absolute; height: 100%; box-shadow: unset !important; z-index: 2; background: rgba(0,0,0,0.3); top: 0; left: 0; color: #fff;}
.others .shadow .icon{ top: 50%; left: 50%; position: absolute; margin-left: -20px; margin-top: -20px; width: 40px; height: 40px; border-radius: 100%; background: rgba(255,255,255,0.4); text-align: center; padding-top: 7px;}
.others .shadow .icon i{ font-size: 28px;}
.others .img{ position: relative; margin-bottom: 10px;}
.others h2{ font-size: 18px; font-weight: 800;}
.others p{ font-size: 14px;}
.others .date{ font-size: 14px; color: #999; margin-bottom: 5px; display: block;}
.mb-30{ margin-bottom: 30px;}

.mobilBtn{ display: none;}
.closeBtn{ display: none !important;}

.embed-responsive iframe{ position: relative; height: 500px;}

.uyari{ font-size: 12px; margin-top: 30px; padding-top: 30px; border-top: 1px #ddd solid;}

@media(max-width: 991px)
{
    .closeBtn{ display: block !important;}

    body{ width: 100%;}

    .head .tahsilat{ position: absolute; right: 70px; top: -4px; width: 50px; height: 40px; z-index: 3;}
    .head .tahsilat a{ font-size: 0;}

    .head .srch{ order: 3; margin-bottom: 0; margin-top: 20px;}
    .head .lg{ order: 1;}
    .head .tk{ order: 2; display: none;}
    .head .tk select{ max-width: 100%;}
    .head .col{ flex-basis: unset;}
    .head .logo{ max-width: 160px; margin: unset; top: 10px;}

    .slider{ margin-top: 0;}
    .banner{ margin-top: 0;}

    .bant{ display: none;}

    .links{ margin-top: 20px;}
    .links a{ display: block; margin-bottom: 10px; text-align: center; padding-left: 0 !important; margin-left: 0 !important;}
    .links a::before{ display: none;}
    .tumDil{ display: block; text-align: center; max-width: 100%;}
    .logo{ max-width: 120px; position: relative;}
    .logo img{ width: 100%;}

    .top-menu{ transition: 0.3s; visibility: hidden; position: fixed; max-width: 100%; width: 100%; height: 100vh; background: #fff; top: 0; left: -100%; z-index: 3; padding: 30px; padding-top: 80px; overflow: auto; overflow-x: hidden;}
    .top-menu.opened{ visibility: visible; left: 0;}
    .top-menu ul li a{ color: #111;}

    .sub-ul{ width: 100% !important; margin-left: 0 !important; box-shadow: none !important; border-top: 0px #eee solid; background: #fff !important; text-align: center !important;}
    .sub-ul li{ border: 0 !important;}
    .top-menu .sub-ul li a{ color: #999 !important;}
    .sub-ul.opened{ display: block; position: relative; visibility: visible; opacity: 1;}
    .top-menu ul li a{ padding: 10px;}

    .srch{ width: 100%; flex-basis: unset; margin-bottom: 20px;}
    .srch .search{ max-width: 100%; width: calc(100% - 45px); display: inline-block;}

    .mobilBtn{ display: inline-block !important; width: 40px; height: 40px; font-size: 27px; text-align: center; position: absolute; top: 3px; right: 15px; border: 1px #ccc solid; z-index: 2;}
    .closeBtn{ display: inline-block !important; width: 40px; height: 40px; font-size: 27px; text-align: center; position: absolute; top: 17px; right: 15px; border: 1px #ccc solid;}

    .top-menu ul{ border-bottom: 0;}
    .top-menu ul li{ display: block; position: relative; border-bottom: 1px #eee solid;}
    .plus{ color: #111; position: absolute; z-index: 2; top: 9px; right: 9px;}
    .minus{ color: #111;}

    .projects ul{ display: block;}
    .projects ul li{ float: unset; width: 100%;}

    .f-item{ margin-bottom: 30px;}

    .about::before{ display: none;}

    .list ul li{ width: 100% !important; margin: 0 !important; margin-bottom: 30px !important;}

    .map iframe{ height: 300px;}

    .footer{ text-align: center;}
    .footer-social{ margin-bottom: 30px;}

    .footer-alt .copyright{ text-align: center;}
    .footer-alt .design{ text-align: center;}

    .tabs .tab-link{ width: 100%; display: block;}
    .detail-tab ul.tabs li{ border: 0; border-bottom: 1px #ccc solid;}
    .detail-tab ul.tabs li:last-child{ border-bottom: 0;}
    .menu-tab ul.tabs li.tcurrent::after{ display: none;}
    .menu-tab ul.tabs .tab-link{ margin-bottom: 2px;}

    .referans-list ul li .content{ top: 0; background: none;}

    .ikonlar{ display: none;}
    .ikonlar ul li h1{ font-size: 22px;}

    .f-logo{ margin-bottom: 30px;}

    .urun-grup .col-lg-4{ margin-bottom: 70px;}
    .neden2 .col-lg-3{ margin-bottom: 20px;}
    .neden2 .item{ padding-bottom: 30px;}

    .urun-tekli a{ display: block;}
    .urun-tekli .img{ width: 100%;}
    .urun-tekli .icerik{ width: 100%;}

    .neden1 .img{ display: none;}
    .neden1 .icerik{ text-align: center;}
    .neden1 ul li{ background-image:none;}
    .urun-grup{ margin-bottom: 20px;}

    .urun-tekli .col-lg-12{ display: block;}

    .urun-list .baslik span{ font-size: 20px;}
    .urun-list .baslik .detayBtn{ padding: 5px 10px; padding-right: 40px;}
	
	.fixed-item span {display:none;}
	.fixed-item .wp {padding: 14px!important;}
}

@media(max-width: 768px)
{
    .referans-list ul li{ width: 100%; margin-right: 0 !important; margin-left: 0 !important;}
    .ikonlar ul li{ width: 50%;}
}

@media(max-width: 640px)
{
    .urun-detay .secenekler ul li{ width: calc(50% - 10px); margin-right: 10px; border-right: 1px #ccc solid; margin-bottom: 20px;}
    .urun-detay .secenekler ul li:nth-child(2n){ margin-right: 0; border-right: 0;}
}

@media(max-width: 500px)
{
    .gallery-top{ height: 370px;}
    .gallery-thumbs .swiper-slide{ height: 90px;}

    .ikonlar ul{ display: block;}
    .ikonlar ul li{ width: 100%;}
}
@media(max-width: 450px)
{
    .gallery-top{ height: 320px;}
    .gallery-thumbs .swiper-slide{ height: 80px;}
}
@media(max-width: 350px)
{
    .gallery-top{ height: 250px;}
    .gallery-thumbs .swiper-slide{ height: 70px;}
}



.fixed-item { position: fixed; z-index: 2; right: 0; top: 30%; right: 0; transform: translate(0%, -50%); }
  .fixed-item a { text-decoration: none; color: #fff; font-size: 24px; display: block; }
    .fixed-item a i { display: inline-block; margin-right: 5px; }
  .fixed-item .wp { background: rgba(76,216,63,.8); padding: 10px; font-family: 'Montserrat', sans-serif; font-weight: 900; }
