body{ width: 100%; height: 100%; padding: 0; margin: 0; font-family: 'Futura PT Book', sans-serif; color: #111; background-color: #fff; overflow: overlay;}

.loading{ position: fixed; width: 100%; height: 100vh; background: #fff; top: 0; left: 0; z-index: 9999999999999999;}

/* width */
::-webkit-scrollbar{ width: 9px;}

/* Track */
::-webkit-scrollbar-track{ background: transparent;}
 
/* Handle */
::-webkit-scrollbar-thumb{ background: rgba(0,0,0,0.5); border-radius: 4px;}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover{ background: rgba(0,0,0,0.8);}

/* HEAD */

.head{ padding-top: 10px; padding-bottom: 10px; background: linear-gradient(to right, #111 0%, #666 100%);}

.logo{ width: 200px;}
.logo a{ text-decoration: none; color: currentColor; display: inline-block;}
.logo a img{ width: 100%;}

.top-menu{ text-align: right; display: inline-block;}
.top-menu ul{ list-style: none; padding: 0; margin: 0;}
.top-menu ul li{ display: inline-block; margin-left: 30px; position: relative;}
.top-menu ul li a{ font-family: 'Open Sans', sans-serif; font-weight: 600; transition: 0.3s; text-decoration: none; color: #fff; display: inline-block; padding-top: 10px; padding-bottom: 15px; font-size: 13px;}
.top-menu ul li a:hover{ color: #e47a79;}

.flag{ display: inline-block; margin-left: 20px; position: relative; top: 10px;}
.flag a{ text-decoration: none; color: currentColor; display: inline-block;}
.flag .tr{ width: 32px; height: 32px; background-image: url(../images/tr.png); background-repeat: no-repeat; background-position: center; background-size: contain;}
.flag .en{ width: 32px; height: 32px; background-image: url(../images/en.png); background-repeat: no-repeat; background-position: center; background-size: contain;}

/********************/

.sub-ul{ transition: 0.3s; position: absolute; background: #555; z-index: 2; text-align: left; box-shadow: 0px 10px 30px rgba(0,0,0,0.2); width: 220px; visibility: hidden; opacity: 0; left: -10px;}
.sub-ul.active{ visibility: visible; opacity: 1; left: 0;}
.sub-ul li{ display: block !important; margin: 0 !important; border-bottom: 1px #666 solid;}
.sub-ul li:last-child{ border-bottom: 0;}
.sub-ul li a{ display: block; width: 100%; padding: 10px !important; padding-left: 20px !important; padding-right: 20px !important; font-family: 'Futura PT Book', sans-serif !important; font-size: 16px !important; font-weight: normal !important;}

/********************/

.sl{ text-align: right; margin-bottom: 10px; margin-top: 10px;}

.sl .search{ display: inline-block; margin-right: 20px; width: 200px;}
.sl .search input[type=text]{ outline: none; width: 100%; height: 40px; padding-left: 10px; padding-right: 40px; border: 1px #eee solid;}
.sl .search input[type=submit]{ outline: none; background: none; width: 40px; height: 40px; border: 0; position: absolute; margin-left: -40px; outline: none; background-image: url("../images/search.png"); background-repeat: no-repeat; background-position: center; background-size: 20px 20px;}

.sl .lang{ display: inline-block;}
.sl .lang a{ text-decoration: none; color: currentColor; font-size: 15px;}
.sl .lang a.active{ font-weight: bold;}
.sl .lang .tre{ font-size: 17px;}

.bayi{ display: inline-block; margin-left: 20px;}
.bayi .bayiBtn{ text-decoration: none; background: #fdbe3d; color: #111; padding: 7px; padding-left: 12px; padding-right: 12px;}

/* SLIDER */

.slider{ width: 100%;}
.slider a{ display: inline-block; text-decoration: none; color: currentColor;}
.slider a img{ width: 100%;}

/* BANNER */

.banner{ width: 100%;}
.banner img{ width: 100%;}

/* CATS */

.cats{ margin-top: calc(3% + 30px); margin-bottom: calc(3% + 30px);}
.cats ul{ list-style: none; padding: 0; margin: 0;}
.cats ul li{ position: relative; text-align: center; margin-bottom: 15px; margin-right: 15px;}
.cats ul li a{ display: block; width: 100%; text-decoration: none; background: #fff;}
.cats ul li a img{ transition: 0.3s; width: 100%; }

.cats ul li:hover img{ transform: scale(0.97);}

/* Uzun */
.cats ul li:nth-child(4n+1){width: calc(60% - 15px); float: left; margin-left: 15px;}
.cats ul li:nth-child(4n+4){width: calc(60% - 15px); float: right; margin-right: 0;}

/* Kýsa */
.cats ul li:nth-child(4n+2){width: calc(40% - 15px); float: right; margin-right: 0;}
.cats ul li:nth-child(4n+3){width: calc(40% - 15px); float: left; margin-left: 15px;}

/* ICONS */

.icons{ text-align: center; background: #eee; padding-top: 30px; padding-bottom: 30px;}
.icons a{ text-decoration: none; display: block; color: currentColor;}
.icons a img{ width: 100px; height: 100px; margin: auto; margin-bottom: 10px;}
.icons a h2{ font-size: 20px;}
.icons a h3{ font-size: 18px;}

/* SITEMAP */

.sitemap{ padding-top: calc(2% + 30px); padding-bottom: calc(2% + 30px); background: #e1e8ef;}
.sitemap h1{ font-size: 32px;}

.sitemap .breadcrumb{ background: none; padding: 0; margin: 0; text-align: right !important; display: block;}

/* PAGE */

.page{ padding-top: 45px; padding-bottom: calc(2% + 30px);}
.page h1{ font-size: 32px; letter-spacing: 5px; margin-bottom: 20px; text-align: left;}
.page .img{ width: 120px; margin: auto;}
.page .img img{ width: 100%;}
.page h2{ font-size: 22px; font-weight: bold; margin-bottom: 20px; text-align: center;}
.page p{ margin-bottom: 30px;}

.page h5{ margin-bottom: 10px;}

.page .r-img{width: 100%;}
.page .r-img a{ text-decoration: none; color: currentColor; display: inline-block; width: 100%;}
.page .r-img a img{ transition: 0.3s; width: 100%; height: 200px; object-fit: contain; }
.page .r-img:hover img{ transform: scale(0.9);}

.side-menu a{ font-size: 16px;}
.side-menu a.active{ color: #e47a79;}

.map{ margin-bottom: 30px;}
.map iframe{ width: 100%; height: 240px;}

.page h3{ text-align: center;}

.page .h-img{ width: 100%; margin-bottom: 30px;}
.page .h-img img{ width: 100%;}

.others{ text-align: center; border: 1px solid #ddd;}
.others a{ text-decoration: none; color: currentColor; display: block; padding: 10px;}
.others a img{ width: 100%; height: 180px; object-fit: contain; margin-bottom: 20px;}
.others a h1{ letter-spacing: 0; text-align: center; font-size: 22px;}

/* NEWS */

.news{}
.news a{ text-decoration: none; color: currentColor; display: block;}
.news a img{ width: 100%; height: 180px; object-fit: cover; margin-bottom: 10px;}
.news a h1{ font-size: 20px; text-align: center; letter-spacing: 0; height: 48px; overflow: hidden;}

/* CONTACT */

.map{}
.map iframe{ width: 100%; height: 540px; box-shadow: 0px 10px 20px rgba(0,0,0,0.2);}

.contact-info{ margin-bottom: 30px;}
.contact-info ul{ list-style: none; padding: 0; margin: 0;}
.contact-info ul li{ margin-bottom: 10px;}
.contact-info ul li b{}
.contact-info ul li a{ text-decoration: none; color: currentColor;}
.contact-info ul li a b{}

/*.contact-form{ width: 100%;}
.contact-form ul{ list-style: none; padding: 0; margin: 0;}
.contact-form ul li{ display: block; position: relative; margin-bottom: 20px;}
.contact-form ul li input{ transition: 0.3s ease all; width: 100%; font-size: 16px; padding: 10px; padding-left: 0; padding-right: 0; border: none; border-bottom: 1px #ddd solid; outline: none;}
.contact-form ul li input:focus{ border-color: #e47a79;}
.contact-form ul li textarea:focus{ border-color: #e47a79;}
.contact-form ul li textarea{ transition: 0.3s ease all; width: 100%; height: 120px; font-size: 16px; padding: 10px; padding-left: 0; padding-right: 0; border: none; border-bottom: 1px #ddd solid; outline: none;}
.contact-form ul li label{ color: #999; font-size: 16px; left: 0; top: 10px; position: absolute; transition: 0.3s ease all; -moz-transition: 0.3s ease all; -webkit-transition: 0.3s ease all; pointer-events: none;}
.contact-form ul li input:focus ~ label, .contact-form ul li input:valid ~ label{ top: -10px; font-size: 14px; color: #e47a79;}
.contact-form ul li textarea:focus ~ label, .contact-form ul li textarea:valid ~ label{ top: -10px; font-size: 12px; color: #e47a79;}*/

.contact-form .btn-send{ max-width: 100px; width: 100%; min-height: 75px; border: 0; background: #e47a79; color: #fff; border-radius: 2px;}

/* BREADCRUMB */

.breadcrumb{ background: none; margin-top: 30px;}
.breadcrumb a{ text-decoration: none; color: #111;}
.breadcrumb span{ margin-left: 15px; margin-right: 15px; font-size: 16px;}

/* PRODUCT CATS */

.product-cats{ width: 100%; margin-bottom: calc(6% + 30px);}

.tab{ width: 100%; display: block; text-align: center;}
ul.tabs{ margin: 0px; padding: 0px; list-style: none; width: 100%; display: block;}
ul.tabs .tab-link{ font-size: 15px; text-transform: uppercase; letter-spacing: 1px;}
ul.tabs li{ background: none; color: #222; display: inline-block; padding: 10px; padding-left: 20px; padding-right: 20px; cursor: pointer;}
ul.tabs li.tcurrent{ background: none; border-bottom: 2px #fdbe3d solid; color: #222; font-weight: bold;}
.tab-content{ display: none; background: none; padding-top: 10px; font-size: 15px; border-top: 2px #eee solid; margin-top: -2px;}
.tab-content.tcurrent{ display: inherit;}

.cat-ul{ width: 100%; list-style: none; padding: 0; margin: 0; background: #eee; text-align: left; position: relative; z-index: 2;}
.cat-ul::after{ content: ""; z-index: 1; opacity: 0.5; position: absolute; width: 100%; height: 100%; background-image: url("../images/chair.png"); right: 0; bottom: 0; background-repeat: no-repeat; background-position: bottom right; background-size: contain;}
.cat-ul li{ display: inline-block; margin-right: 10px;}

.cat-ul li ul{ text-align: left; padding: 0; margin: 0; list-style: none; width: 100%; padding: 20px; position: relative; z-index: 2;}
.cat-ul li ul li{ display: block;}

.cat-ul a{ text-decoration: none; color: currentColor; display: block; padding: 5px;}

/* LIST */

.list a{ text-decoration: none; color: #111; display: block;}
.list a img{ width: 100%; height: 200px; object-fit: cover; margin-bottom: 10px;}
.list a h1{ font-size: 18px; letter-spacing: 0; text-align: center;}

/* ITEM */

.item{ text-align: center;}
.item a{ text-decoration: none; color: currentColor; display: block;}
.item a .img{ width: 100%; margin-bottom: 10px; border: 1px #ddd solid; padding: 10px;}
.item a .img img{ width: 100%; height: 240px; object-fit: contain;}
.item a h4{ font-size: 18px; margin-bottom: 10px; height: 24px; overflow: hidden;}
.item a .btn-dark{ letter-spacing: 3px; font-size: 12px;}
.item a p{ font-size: 14px; height: 63px; overflow: hidden; margin-bottom: 15px;}

/* DETAIL */

.detail{ margin-bottom: 20px;}
.detail img{ max-width: 400px; width: 100%; float: left; margin-right: 30px; margin-bottom: 10px; box-shadow: 0px 10px 20px rgba(0,0,0,0.2); border-radius: 2px;}
.detail h1{}
.detail h6{ font-weight: bold;}

/* MEDIA */

.media{ width: 100%;}
.media ul{ list-style: none; padding: 0; margin: 0;}
.media ul li{ width: calc(25% - 20px); float: left; margin-right: 20px; margin-bottom: 20px;}
.media ul li a{ text-decoration: none; color: currentColor; display: inline-block;}
.media ul li a img{ width: 100%; height: 150px; object-fit: cover;}

/* WORK */

.work{ text-align: center; padding-top: calc(3% + 30px); padding-bottom: calc(3% + 30px);}
.work h1{ font-family: 'Philosopher', sans-serif; font-size: 32px; font-weight: bold; margin-bottom: 20px;}
.work h1::before{ content: ""; width: 120px; height: 30px; top: -35px; left: 50%; margin-left: -65px; position: absolute; background-image: url("../images/hat.png"); background-repeat: no-repeat; background-position: center; background-size: contain;}

.work ul{ list-style: none; padding: 0; margin: 0;}
.work ul li{ transition: 0.3s; width: calc(24% - 30px); margin: 15px; margin-bottom: 15px; display: inline-block; border: 1px #d0b182 solid;}
.work ul li:hover{ box-shadow: 0px 5px 10px rgba(0,0,0,0.1);}
.work ul li a{ text-decoration: none; color: currentColor; display: inline-block; padding: 10px;}
.work ul li a img{ display: block; height: 100px; object-fit: contain; margin: auto; margin-bottom: 10px;}
.work ul li a h3{ font-size: 17px; font-weight: bold; height: 40px; overflow: hidden;}
.work ul li a p{ color: #999; font-size: 15px; line-height: 1.4em; height: 63px; overflow: hidden;}

/* ABOUT */

.about{ width: 100%; margin-top: calc(2% + 30px); margin-bottom: calc(2% + 30px); background: #fff;}
.about h3{ font-size: 42px; font-weight: bold; letter-spacing: 5px;}
.about img{ width: 100%;}

.btn-dark{ padding: 10px; font-size: 16px; border: 0; cursor: pointer; background-image: linear-gradient(to right, #333 0%, #777 50%, #333 100%); background-size: 200% auto; color: #fff !important; letter-spacing: 1px; transition: 0.6s; border-radius: 4px; width: 150px; margin-top: 30px; outline: none !important;}
#hakkindaHref{ display: block;}
.btn-dark:hover{ background-position: right center;}

/* GALLERY */

.gallery{ width: 100%;}
.gallery h1{ margin-bottom: 20px}
.gallery a{ text-decoration: none; display: block; color: currentColor;}
.gallery a img{ width: 100%; height: 400px; object-fit: cover;}

.gallery a h2{ font-size: 22px; margin-top: 10px; height: 26px; overflow: hidden;}
.gallery a p{ height: 72px; overflow: hidden;}

/* REFERENCES */

.references{ text-align: center; padding-top: calc(3% + 30px); padding-bottom: calc(3% + 30px); position: relative;}
.references h1{ font-family: 'Philosopher', sans-serif; font-size: 32px; font-weight: bold; margin-bottom: 30px; position: relative;}
.references h1::before{ content: ""; width: 120px; height: 30px; top: -35px; left: 50%; margin-left: -65px; position: absolute; background-image: url("../images/hat.png"); background-repeat: no-repeat; background-position: center; background-size: contain;}
.references a{ display: inline-block; text-decoration: none; color: currentColor;}
.references a img{ width: 100%;}

.references::after{ content: ""; position: absolute; width: 400px; height: 300px; right: 0; bottom: 20%; background-image: url("../images/feather.png"); background-repeat: no-repeat; background-position: center; background-size: contain;}

/* AVUKAT */

.avukat{ margin-bottom: 90px;}
.avukat a{ text-decoration: none; color: currentColor; display: inline-block; text-align: center; position: relative;}
.avukat a img{ width: 100%;}
.avukat .info{ background: #fff; box-shadow: 0px 10px 20px rgba(0,0,0,0.1); width: calc(100% - 80px); margin: auto; left: -50%; transform: translate(82%, 0%); bottom: -50px; position: absolute; padding: 20px; padding-left: 10px; padding-right: 10px;}
.avukat .info h2{ font-family: 'Philosopher', sans-serif; font-size: 20px; font-weight: bold; margin-bottom: 10px; position: relative;}
.avukat .info h3{ font-size: 16px; font-weight: bold; color: #d0b182; margin-bottom: 10px;}
.avukat .info p{ transition: 0.3s; color: #999; padding: 0; margin: 0; line-height: 1.4em; height: 0; overflow: hidden;}
.avukat a:hover p{ height: 66px; overflow: hidden;}

.content{ text-align: center;}
.content img{ max-width: 400px; width: 100%; margin-bottom: 20px;}
.content h2{ font-family: 'Philosopher', sans-serif; font-size: 32px; font-weight: bold; margin-bottom: 10px; position: relative;}
.content h3{ font-size: 18px; font-weight: bold; color: #d0b182; margin-bottom: 20px;}
.content span img{ width: 100px;}
.content .btn-gold{ color: #fff; border-radius: 2px; font-family: 'Futura PT Book', sans-serif; font-size: 18px;}
.content .btn-gold b{ display: block; font-family: 'Philosopher', sans-serif; font-size: 20px;}

/* PAGINATION */

.pagination{ margin: auto;}
.pagination a{ color: #111;}
.pagination a:hover{ color: #111;}

/* FOOTER */

.footer{ background-repeat: no-repeat; background-position: center; background-size: cover;}
.footer .footer-logo{ max-width: 180px; width: 100%; margin: auto; margin-bottom: 10px;}
.footer .footer-logo a{ text-decoration: none; color: #fff; display: inline-block;}
.footer .footer-logo a img{ width: 100%;}

.footer .footer-about{ color: #fff; margin-bottom: 20px; text-align: center;}

.footer .footer-ekat{ text-align: center;}
.footer .footer-ekat h1{ font-weight: bold; font-size: 16px; color: #fff; margin-bottom: 10px;}
.footer .footer-ekat a{ display: inline-block; text-decoration: none;}
.footer .footer-ekat a img{ width: 88px; margin: auto;}

.footer-social{ position: relative; z-index: 2; text-align: center; margin-bottom: 20px;}
.footer-social a{ text-decoration: none; color: #fff; width: 40px; height: 40px; display: inline-block;}
.footer-social .facebook{ background-image: url("../images/social/facebook.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}
.footer-social .twitter{ background-image: url("../images/social/twitter.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}
.footer-social .instagram{ background-image: url("../images/social/instagram.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}
.footer-social .pinterest{ background-image: url("../images/social/pinterest.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}
.footer-social .whatsapp{ background-image: url("../images/social/whatsapp.png"); background-repeat: no-repeat; background-position: center; background-size: 24px 24px;}

.footer .footer-item{ margin-bottom: 20px; text-align: center;}
.footer .footer-item h1{ font-weight: bold; font-size: 16px; color: #fff; margin-bottom: 10px;}
.footer .footer-item ul{ list-style: none; padding: 0; margin: 0;}
.footer .footer-item ul li{ display: block; padding-bottom: 10px; color: #fff}
.footer .footer-item ul li a{ text-decoration: none; color: #fff; display: block;}
.footer .footer-item ul li a b{ font-size: 20px;}
.footer .footer-item ul li b{ font-size: 20px;}

.bg-overlay{ background: rgba(0,0,0,0.3); padding-top: calc(2% + 30px); padding-bottom: calc(2% + 30px);}

/* FOOTER ALT */

.footer-alt{ background: linear-gradient(to right, #111 0%, #666 100%); padding: 10px; color: #fff;}
.footer-alt .copyright{ text-align: left; font-size: 16px;}
.footer-alt .copyright a{ text-decoration: none; color: currentColor;}

.footer-alt .design{ text-align: right; font-size: 16px;}
.footer-alt .design a{ text-decoration: none; color: currentColor;}

/* GO TO TOP */

#go-to-top{ opacity: 0; z-index: 2; position: fixed; right: 45px; bottom: 45px; font-size: 12px; border: 0; cursor: pointer; background-image: linear-gradient(to right, #333 0%, #777 50%, #333 100%); background-size: 200% auto; color: #fff !important; letter-spacing: 1px; transition: 0.6s; border-radius: 2px; width: 50px; height: 50px; margin: auto; outline: none !important; }
#go-to-top:hover { background-position: right center;}
#go-to-top:active {}
#go-to-top.show { opacity: 1; visibility: visible; }
#go-to-top i{ font-size: 24px; }

/* OTHERS */

.mobilBtn{ display: none;}
.mplus{ display: none;}

.mb-percent-2{ margin-bottom: calc(2% + 30px);}
.pt-percent-2{ padding-top: calc(2% + 30px);}
.pb-percent-2{ padding-bottom: calc(2% + 30px);}

.btnGit{ padding: 15px; font-size: 12px; border: 0; cursor: pointer; background-image: linear-gradient(to right, #333 0%, #777 50%, #333 100%); background-size: 200% auto; color: #fff !important; letter-spacing: 1px; transition: 0.6s; border-radius: 4px; width: 150px; margin: auto; outline: none !important;}
.btnGit:hover{ background-position: right center;}

.pdf{ margin-bottom: 20px; position: relative;}
.pdf::before{ position: absolute; width: 36px; height: 36px; top: 11px; left: 11px; content: ""; background-image: url(../images/pdf.png); background-repeat: no-repeat; background-position: center; background-size: 36px 36px;}
.pdf a{ transition: 0.3s; text-decoration: none; color: currentColor; display: block; padding: 15px; padding-left: 60px; font-size: 20px; background: #eee; border-radius: 2px;}
.pdf a:hover{ background: #666; color: #fff;}

@media(max-width: 991px)
{
    /* width */
    ::-webkit-scrollbar{ width: 2px;}

    .banner img{ height: 200px; object-fit: cover;}

    .mobilBtn{ display: block; position: absolute; top: 17px; right: 20px; border: 2px #999 solid; width: 44px; height: 44px; text-align: center; padding-top: 4px; border-radius: 2px; z-index: 4;}
    .mobilBtn i{ font-size: 32px; color: #999;}

    .mplus{ display: block; position: absolute; padding: 10px; padding-left: 20px; top: 0; right: 0; z-index: 2; color: #fff;}
    .mplus i{ font-size: 17px;}

    .head{ padding-top: 10px; padding-bottom: 10px;}
    .head .logo{ width: 130px; position: relative; z-index: 4;}
    .head .col-9{ overflow: auto; transition: 0.3s; visibility: hidden; left: -100%; position: fixed; max-width: 100%; width: 100%; height: 100vh; background: #333; z-index: 3; top: 0; padding-top: 36%;}
    .head .col-9.opened{ visibility: visible; left: 0;}

    .sl .search{ display: block; width: 100%; margin-bottom: 10px;}
    .sl .lang{ text-align: center; width: 100%; margin-bottom: 20px;}

    .parent-ul{ text-align: left;}
    .parent-ul li{ display: block !important; margin: 0 !important; border-bottom: 1px #444 solid;}

    .sub-ul{ position: relative; visibility: hidden; opacity: 0; display: block; height: 0; overflow: hidden; left: 0; box-shadow: none; width: 100%; border-bottom: 0; border-top: 1px #eee solid;}
    .sub-ul a{ color: #999 !important;}
    .sub-ul.m-active{ visibility: visible; opacity: 1; height: auto; overflow: auto;}

    .page .r-img a img{ height: auto; object-fit: none;}

    .media ul li{ width: calc(50% - 20px);}

    .side-menu{ margin-bottom: 40px; text-align: center;}

    .contact-form .btn-send{ width: 100%;}

    .footer-alt .copyright{ text-align: center; margin-bottom: 5px;}
    .footer-alt .design{ text-align: center; margin-bottom: 5px;}

    .cat-ul::after{ width: 160px;}

    .top-menu{ order: 2; display: block;}
    .top-menu ul li a{ padding-bottom: 10px;}
    .flag{ order: 1; display: block; text-align: center; margin-left: 0;}

    .sitemap h1{ text-align: center;}
    .sitemap .breadcrumb{ text-align: center !important;}
    .map iframe{ height: 300px;}
}

@media(max-width: 640px)
{
    .page p{ text-align: justify;}
}

@media(max-width: 480px)
{
    .media ul li{ width: 100%;}
    .media ul li a img{ height: 200px;}
}
