@charest "utf-8";

/* author Ali AKKEÇECİ - FrameWorkV1 */

@import url("slick.css");
@import url("jquery.fancybox.min.css");
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700');
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap');
@font-face {
    font-family: 'proxima-bold';
    src: url('../fonts/proxima/proximanovasemibold.eot');
    src: url('../fonts/proxima/proximanovasemibold.eot?#iefix') format('embedded-opentype'), url('../fonts/proxima/proximanovasemibold.woff2') format('woff2'), url('../fonts/proxima/proximanovasemibold.woff') format('woff'), url('../fonts/proxima/proximanovasemibold.ttf') format('truetype');
    font-weight: normal
}

@font-face {
    font-family: 'korol-bold';
    src: url('../fonts/korolev/korolevbold.eot');
    src: url('../fonts/korolev/korolevbold.eot?#iefix') format('embedded-opentype'), url('../fonts/korolev/korolevbold.woff2') format('woff2'), url('../fonts/korolev/korolevbold.woff') format('woff'), url('../fonts/korolev/korolevbold.ttf') format('truetype');
    font-weight: normal
}

@font-face {
    font-family: 'ptserif-bold';
    src: url('../fonts/ptserif/ptserifbold.eot');
    src: url('../fonts/ptserif/ptserifbold.eot?#iefix') format('embedded-opentype'), url('../fonts/ptserif/ptserifbold.woff2') format('woff2'), url('../fonts/ptserif/ptserifbold.woff') format('woff'), url('../fonts/ptserif/ptserifbold.ttf') format('truetype');
    font-weight: normal
}

@font-face {
    font-family: 'pancetta-medium';
    src: url('../fonts/pancetta/pancettamedium.eot');
    src: url('../fonts/pancetta/pancettamedium.eot?#iefix') format('embedded-opentype'), url('../fonts/pancetta/pancettamedium.woff2') format('woff2'), url('../fonts/pancetta/pancettamedium.woff') format('woff'), url('../fonts/pancetta/pancettamedium.ttf') format('truetype');
    font-weight: normal
}

@font-face {
    font-family: 'pancetta-semibold';
    src: url('../fonts/pancetta/pancettasbold.eot');
    src: url('../fonts/pancetta/pancettasbold.eot?#iefix') format('embedded-opentype'), url('../fonts/pancetta/pancettasbold.woff2') format('woff2'), url('../fonts/pancetta/pancettasbold.woff') format('woff'), url('../fonts/pancetta/pancettasbold.ttf') format('truetype');
    font-weight: normal
}
@font-face {
    font-family: 'Now';
    src: url('../fonts/Now-Regular.woff2') format('woff2'), url('../fonts/Now-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Now';
    src: url('../fonts/Now-Bold.woff2') format('woff2'), url('../fonts/Now-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}



* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

html,
body {
    overflow-x: hidden;
    background-color: #f7f7f7;
    font-family: 'Roboto';
}

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

form *,
button {
    outline: 0
}

.grid {
    max-width: 1170px;
    position: relative;
    margin: 0 auto
}

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

.cevir {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}

header {
    position: absolute;
    width: 100%;
    height: 202px;
    left: 0;
    top: 0;
    background-image: url(../img/header-gogle.png);
    background-position: center bottom;
    z-index: 10;
    background-color: #2d2a4e;
}

header .ust {
    position: fixed;
    width: 100%;
    z-index: 111;
}

header .ust a {
    display: block;
    width: 20%;
    border-right: 1px solid #353544;
    border-bottom: 1px solid #060606;
    float: left;
    font-family: 'Now',sans-serif;
    font-weight: 300;
    font-size: 15px;
    color: #464754;
    text-align: center;
    text-transform: uppercase;
    padding: 15px;
    background-color: #191a24;
    position: relative
}

header .ust a:last-of-type {
    border-right: 0
}

header .ust a:hover {
    color: #fff;
    font-weight: 400
}

header .head {
    padding: 23px 0;
    margin-top: 50px
}

header .head .logo {
    display: block;
    width: 200px;
    height: 157px;
    background-image: url(../img/logo_light.png);
    background-size: contain;
    float: left;
    transform: translateX(-20%);
    -webkit-transform: translateX(-20%);
    -ms-transform: translateX(-20%);
    position:relative;
    z-index: 100;
}

header .head .mail,
header .head .phone {
    float: right;
    margin: 21px 0 21px 50px;
    font-family: 'Now';
    font-weight: 400;
    font-size: 15px;
    color: #95959f;
}

header .head .mail:before,
header .head .phone:before {
    content: "";
    display: block;
    float: left;
    width: 15px;
    height: 15px;
    margin-right: 15px;
    background-image: url(../img/kucuk-images.png)
}

header .head .mail:before {
    background-position: -15px -124px
}

header .head .phone:before {
    background-position: 0 -124px
}

header .head .mail:hover,
header .head .phone:hover {
    text-decoration: underline
}

header nav .menu-b {
    width: 100%;
    height: 50px;
    position: absolute;
    left: 0;
    top: 0;
    cursor: pointer;
    display: none;
    z-index: 0
}

header nav .menu-b:before {
    content: "";
    display: block;
    position: absolute;
    right: 10px;
    top: 12px;
    width: 25px;
    height: 25px;
    background-image: url(../img/kucuk-images.png);
    background-position: -62px -124px
}

header nav>ul {
    float: left
}

header nav>ul>li {
    float: left;
    height: 30px;
    line-height: 30px;
    border-left: 1px solid #55555f;
    position: relative
}

header nav>ul>li>a {
    display: block;
    height: 60px;
    padding: 0 27.75px;
    font-family: 'Rajdhani', sans-serif;
    font-weight: 600;
    font-size: 19px;
    color: #cbcbdb;
    text-transform: uppercase;
}

header nav>ul>li:hover>a {
    color: #ffcb08
}

header nav>ul>li ul {
    width: 240%;
    position: absolute;
    left: -70%;
    padding-bottom: 50px;
    background-color: #ffcb08;
    display: none
}

header nav>ul>li:hover ul {
    display: block
}

header nav>ul>li ul:before,
header nav .arama-b .arama-dropdown:before {
    content: "";
    border-color: transparent transparent #ffcb08 transparent;
    border-style: solid;
    border-width: 10px;
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%)
}

header nav>ul>li>ul>li>a {
    display: block;
    border-bottom: 1px solid #e1b613;
    font-family: 'Now';
    font-weight: 400;
    font-size: 15px;
    color: #2b2b4f;
    padding: 10px 30px;
    background-image: url(../img/dropdown-ok.png);
    background-position: 15px center;
    text-transform: uppercase;
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}

header nav>ul>li>ul>li>a:hover {
    background-color: #2b2b4f;
    background-image: url(../img/dropdown-ok-hover.png);
    background-position: 17px center;
    padding-left: 35px;
    color: #fff;
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}

header nav .arama-b {
    float: left;
    height: 30px;
    width: 50px;
    border-left: 1px solid #55555f;
    border-right: 1px solid #55555f
}

header nav .arama-b .ara-tikla {
    display: block;
    position: relative;
    height: 30px;
    cursor: pointer
}

header nav .arama-b .ara-tikla div {
    width: 14px;
    height: 14px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    background-image: url(../img/kucuk-images.png);
    background-position: 0 -66px
}

header nav .arama-b:hover .ara-tikla div {
    background-position: -14px -66px
}

header nav .arama-b.acikarama .ara-tikla div,
header nav .arama-b.acikarama:hover .ara-tikla div {
    background-position: -28px -66px !important
}

header nav .arama-b .arama-dropdown {
    position: absolute;
    left: 0;
    top: 60px;
    width: 100%;
    background-color: #ffcb08;
    padding: 18px;
    display: none
}

header nav .arama-b .arama-dropdown:before {
    left: 93.25%
}

header nav .arama-b .arama-dropdown>div {
    background-color: #fff;
    padding: 73px 24px 73px 73px
}

header nav .arama-b .arama-dropdown>div form {
    display: inline-block
}

header nav .arama-b .arama-dropdown>div form select {
    width: 238px;
    height: 58px;
    background-color: #eaeaea;
    border: 1px solid #dedede;
    border-radius: 0;
    -webkit-appearance: none;
    padding: 0 40px 0 30px;
    font-family: 'Now';
    font-weight: 500;
    font-size: 16px;
    color: #979797;
    text-transform: uppercase;
    background-image: url(../img/arama-select.png);
    background-position: right 24px center;
    cursor: pointer
}

header nav .arama-b .arama-dropdown>div form input[type="search"] {
    height: 58px;
    border: 1px solid #eaeaea;
    width: 620px;
    padding: 0 30px;
    font-family: 'Now';
    font-weight: 500;
    font-size: 16px;
    color: #969696
}

header nav .arama-b .arama-dropdown>div form input[type="submit"] {
    width: 72px;
    height: 58px;
    background-color: #ffcb08;
    border: 1px solid #e7b90b;
    cursor: pointer;
    transform: translateY(-1px);
    -webkit-transform: translateY(-1px);
    -ms-transform: translateY(-1px);
    background-image: url(../img/arama-buyuk-sumbit.png)
}

header nav .arama-b .arama-dropdown>div form * {
    margin-right: 8px
}

header nav .arama-b .arama-dropdown>div>a {
    display: inline-block;
    width: 70px;
    height: 58px;
    line-height: 58px;
    background-color: #51517a;
    border: 1px solid #424268;
    cursor: pointer;
    text-align: center;
    text-transform: uppercase;
    font-family: 'Roboto';
    font-weight: 500;
    font-size: 15px;
    color: #fff;
    transform: translateY(1px);
    -webkit-transform: translateY(1px);
    -ms-transform: translateY(1px)
}

header nav ul.diller>li {
    border-left: 0;
    border-right: 1px solid #55555f
}

header nav ul.diller>li>a {
    display: block;
    padding: 0 25px 0 11px
}

header nav ul.diller>li>a:before {
    content: "";
    display: block;
    position: absolute;
    right: 8px;
    top: 14px;
    width: 7px;
    height: 5px;
    background-image: url(../img/kucuk-images.png);
    background-position: -160px -99px
}

header nav ul.diller>li:hover>a:before {
    background-position: -160px -106px
}

header nav>ul.diller li ul {
    width: auto;
    min-width: 150px;
    padding: 14px 11px 14px 0;
    border-radius: 5px 0 0 5px;
    right: 0;
    left: auto
}

header nav>ul.diller>li>ul>li>a {
    border: 0;
    float: left;
    padding: 0 0 0 30px;
    margin-left: 13px;
    background-blend-mode: luminosity;
    background-image: none;
    background-color: #ffcb08;
    background-position: left center;
    color: #4e3e03;
    opacity: .5
}

header nav>ul.diller>li>ul>li>a:hover {
    opacity: 1;
    color: #fff;
    background-blend-mode: normal
}

header nav>ul.diller>li>ul>li>.alt-ar {
    background-image: url(../img/header-dil-ar.png)
}

header nav>ul.diller>li>ul>li>.alt-tr {
    background-image: url(../img/header-dil-tr.png)
}

header nav>ul.diller>li>ul>li>.alt-en {
    background-image: url(../img/header-dil-en.png)
}

header nav>ul.diller>li ul:before {
    left: auto;
    transform: translate(0);
    -webkit-transform: translate(0);
    -ms-transform: translate(0);
    right: 20px
}

header nav>ul>li.urunlerimiz-drop-button .grid {
    width: 1170px;
    position: absolute
}

header nav>ul>li.urunlerimiz-drop-button ul {
    background-color: #ffcb08;
    padding: 18px;
    width: 100%;
    left: -290px
}

header nav>ul>li.urunlerimiz-drop-button ul:before {
    transform: translateX(-1111%);
    -webkit-transform: translateX(-1111%);
    -ms-transform: translateX(-1111%)
}

header nav>ul>li.urunlerimiz-drop-button ul li {
    float: left;
    background-color: #fff;
    padding: 10px;
    margin: 0 1px 1px 0;
    position: relative
}

header nav>ul>li.urunlerimiz-drop-button ul li a {
    position: relative;
    display: block;
    font-family: 'Now';
    font-weight: 300;
    font-size: 16px;
    color: #54548e;
    width: 254px;
    height: 183px;
    text-transform: uppercase;
    text-align: center;
    padding: 140px 10px 0;
    line-height: 1;
    background-position: center 25px;
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.prefabrik {
    background-image: url(../img/drop-prefabrik.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.prefabrik:hover {
    background-image: url(../img/drop-prefabrik-hover.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.kopru {
    background-image: url(../img/drop-kopru.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.kopru:hover {
    background-image: url(../img/drop-kopru-hover.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.bims {
    background-image: url(../img/drop-bims.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.bims:hover {
    background-image: url(../img/drop-bims-hover.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.boru {
    background-image: url(../img/drop-boru.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.boru:hover {
    background-image: url(../img/drop-boru-hover.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.cevre {
    background-image: url(../img/drop-cevre.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.cevre:hover {
    background-image: url(../img/drop-cevre-hover.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.yeni {
    background-image: url(../img/drop-yeni.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a.yeni:hover {
    background-image: url(../img/drop-yeni-hover.png)
}

header nav>ul>li.urunlerimiz-drop-button ul li a:hover {
    background-color: #2b2b4f;
    color: #c6c6e4
}

header nav>ul>li.urunlerimiz-drop-button li:first-of-type {
    padding: 0;
    background-color: transparent;
    width: 295px;
    height: 407px;
    margin-right: 14px;
    overflow: hidden
}

header nav>ul>li.urunlerimiz-drop-button li a:first-of-type:hover:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(84, 84, 142, .55)
}

header nav>ul>li.urunlerimiz-drop-button li:first-of-type a {
    padding: 0;
    height: auto;
    width: auto
}

header>.urunler-dropdown {
    background-color: rgba(24, 25, 38, .9);
    height: 100vh;
    margin-top: -51px;
    display: none
}

section .etkinlik {
    width: 375px;
    height: 312px;
    float: left;
    background-image: url(../img/etkinlik-pattern.jpg);
    background-repeat: repeat;
    position: relative;
    margin-bottom: 21px
}

section .etkinlik a {
    display: block;
    width: 60px;
    height: 75px;
    background-color: #6d6e8b;
    position: absolute;
    right: 35px;
    font-family: 'pancetta-medium';
    text-align: center;
    padding-top: 23px;
    font-size: 13px;
    color: transparent;
    text-transform: capitalize;
    -wekit-transition: all 1s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all 1s cubic-bezier(.19, 1, .22, 1);
    transition: all 1s cubic-bezier(.19, 1, .22, 1)
}

section .etkinlik a:after {
    content: "";
    border-left: 30px solid #6d6e8b;
    border-right: 30px solid #6d6e8b;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    position: absolute;
    top: 50px;
    left: 0
}

section .etkinlik a:hover {
    color: #494a6a;
    -wekit-transition: all 1s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all 1s cubic-bezier(.19, 1, .22, 1);
    transition: all 1s cubic-bezier(.19, 1, .22, 1)
}

section .etkinlik a div {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: 33px;
    height: 32px;
    background-image: url(../img/kucuk-images.png);
    background-position: -76px -83px
}

section .etkinlik a:hover div {
    background-image: none
}

section .etkinlik .tarih {
    text-align: center;
    margin-top: 29px;
    font-size: 22px;
    font-family: 'pancetta-medium';
    color: #fff;
    text-transform: capitalize;
    line-height: .8
}

section .etkinlik .tarih span {
    display: block;
    font-family: 'pancetta-medium';
    font-size: 104px
}

section .etkinlik .button {
    font-family: 'Roboto';
    font-weight: 500;
    font-size: 19px;
    color: #494a6a;
    text-align: center;
    text-transform: uppercase;
    width: 135px;
    height: 33px;
    line-height: 33px;
    border-radius: 17px;
    background-color: #f0c855;
    margin: 13px auto
}

section .etkinlik .detay {
    font-family: 'pancetta-medium';
    font-size: 18px;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    padding: 0 15px;
    margin-bottom: 20px;
    text-shadow: 0px 1px 0px rgba(60, 61, 91, 0.004)
}

section .etkinlik .alt {
    display: table;
    margin: 0 auto
}

section .etkinlik .alt>* {
    font-family: 'Now';
    font-weight: 500;
    color: #75769a;
    display: inline-block;
    line-height: 22px;
    text-shadow: 0px 1px 0px rgba(60, 61, 91, 0.004);
    text-transform: uppercase;
    margin-right: 20px
}

section .etkinlik .alt .yer {
    margin-right: 0
}

section .etkinlik .alt>*:before {
    content: "";
    display: block;
    float: left;
    height: 22px;
    background-image: url(../img/kucuk-images.png)
}

section .etkinlik .alt .sehir:before {
    width: 21px;
    background-position: -87px -124px
}

section .etkinlik .alt .saat:before {
    width: 29px;
    background-position: -108px -124px
}

section .etkinlik .alt .yer:before {
    width: 27px;
    background-position: -138px -124px
}

footer {
    padding-top: 50px;
    background-color: #1a1a34;
    box-shadow: inset 0px 1px 0px 0px rgba(23, 23, 49, 0.004);
    background-image: url(../img/footer-background.jpg)
}

footer .adres {
    float: left;
    font-family: 'Now';
    font-weight: 400;
    font-size: 15px;
    color: #bfbfcc;
    width: 380px;
    border-right: 1px solid #454564;
    padding-right: 20px
}

footer .adres>a {
    margin-bottom: 20px;
    display: block
}

footer .adres>a div {
    width: 25px;
    height: 18px;
    float: left;
    background-image: url(../img/kucuk-images.png);
}

footer .adres .phone div {
    background-position: -60px -30px
}

footer .adres .mail div {
    background-position: -85px -30px
}

footer .adres .address div {
    height: 36px;
    background-position: -110px -30px
}

footer .adres .harita {
    line-height: 26px;
    font-size: 17px;
    text-transform: uppercase
}

footer .adres .harita div {
    background-position: -135px -30px;
    width: 36px;
    height: 26px
}

footer .adres .harita:after {
    content: "";
    display: inline-block;
    width: 13px;
    height: 13px;
    margin-left: 10px;
    background-image: url(../img/footer-harita-after.png);
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}

footer .adres .harita:hover:after {
    margin-left: 15px;
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}

footer .adres .diller a {
    display: block;
    line-height: 20px;
    text-transform: uppercase;
    float: left;
    margin-right: 15px
}

footer .adres .diller a div {
    background-image: url(../img/kucuk-images.png);
    width: 30px;
    height: 20px;
    margin-right: 10px;
    float: left
}

footer .adres .diller .tr div {
    background-position: 0 -30px
}

footer .adres .diller .en div {
    background-position: -30px -30px
}

footer .adres .sosyal {
    margin-top: 20px
}

footer .adres .sosyal a {
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: block;
    float: left;
    margin-right: 10px;
    background-image: url(../img/kucuk-images.png);
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}

footer .adres .sosyal a:hover {
    transform: translateY(-5px);
    -webkit-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}

footer .adres .sosyal .face {
    background-position: 0 0
}

footer .adres .sosyal .twitter {
    background-position: -30px 0
}

footer .adres .sosyal .insta {
    background-position: -60px 0
}

footer .adres .sosyal .youtube {
    background-position: -90px 0
}

footer .adres .sosyal .google {
    background-position: -120px 0
}

footer .adres .sosyal .pin {
    background-position: -150px 0
}

footer ul {
    float: left;
    width: 260px;
    padding-right: 75px
}

footer ul li a {
    display: block;
    text-align: right;
    font-family: 'Now';
    color: #bfbfcc;
    font-size: 14px;
    text-transform: uppercase;
    background-position: right center;
    margin-bottom: 17px;
}

footer ul li a:after {
    content: "";
    display: inline-block;
    width: 13px;
    height: 13px;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    margin-left: 10px;
    background-image: url(../img/footer-harita-after.png);
}

footer .katalog {
    width: 255px;
    height: 247px;
    border-right: 1px solid #454564;
    border-left: 1px solid #454564;
    float: left;
    padding: 15px 20px 0
}

footer .katalog div {
    height: 77px;
    line-height: 115px;
    font-size: 16px;
    font-family: 'Now';
    font-weight: 700;
    color: #bfbecb;
    text-align: center;
    text-transform: uppercase;
    border-bottom: 1px solid #454564;
    margin-bottom: 15px;
    position: relative
}

footer .katalog div:before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: 49px;
    height: 37px;
    background-image: url(../img/kucuk-images.png);
    background-position: -109px -83px
}

footer .katalog p {
    font-family: 'Now';
    font-weight: 300;
    font-size: 12px;
    color: #7e7e9a;
}

footer .katalog form input {
    width: 100%;
    height: 44px;
    border-radius: 3px;
    margin-top: 13px;
    font-family: 'Now'
}

footer .katalog form input[type="email"] {
    background-color: #2e2e4c;
    border: 1px solid #707090;
    padding-left: 15px;
    text-transform: capitalize;
    font-weight: 300;
    font-size: 14px;
    color: #8484a3
}

footer .katalog form input[type="submit"] {
    background-color: #bfbecb;
    border: 1px solid #7f7f9d;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 16px;
    color: #313150;
    cursor: pointer
}

footer .katalog form ::-webkit-input-placeholder {
    color: #57577d
}

footer .katalog form ::-moz-input-placeholder {
    color: #57577d
}

footer .katalog form :-moz-input-placeholder {
    color: #57577d
}

footer .katalog form :-ms-input-placeholder {
    color: #57577d
}

footer .logolar {
    float: left;
    width: 275px
}

footer .logolar>* {
    background-position: right center;
    text-align: right;
    margin-bottom: 11px;
    display: block
}

footer .logolar p {
    font-family: 'Now';
    font-weight: 400;
    font-size: 12px;
    color: #5c5d7b;
    text-transform: uppercase;
}

footer .logolar .aybeton {
    height: 71px;
    background-image: url(../img/footer-logo.png)
}

footer .logolar .insaat,
footer .logolar .yapimarket,
footer .logolar .petrol {
    height: 37px
}

footer .logolar .insaat {
    background-image: url(../img/footer-insaat.png)
}

footer .logolar .insaat:hover {
    background-image: url(../img/footer-insaat-hover.png)
}

footer .logolar .yapimarket {
    background-image: url(../img/footer-yapimarket.png)
}

footer .logolar .yapimarket:hover {
    background-image: url(../img/footer-yapimarket-hover.png)
}

footer .logolar .petrol {
    background-image: url(../img/footer-petrol.png)
}

footer .logolar .petrol:hover {
    background-image: url(../img/footer-petrol-hover.png)
}

footer .alt-footer {
    padding: 22px 0;
    border-top: 1px solid #454564;
    margin-top: 25px
}

footer .alt-footer p,
footer .alt-footer a {
    font-family: 'Now';
    font-weight: 400;
    font-size: 15px;
    color: #707090
}

footer .alt-footer p {
    float: left
}

footer .alt-footer a {
    float: right
}

footer .alt-footer a:hover {
    color: #ffcb08
}

@media (max-width: 1210px) {
    .grid {
        margin: 0 10px
    }
}

@media (max-width: 1170px) {
    header {
        height: 250px
    }
    header nav {
        position: relative
    }
    header nav .menu-b {
        display: block
    }
    header nav>ul.menu {
        float: none;
        display: none;
        background-color: #191a24;
        position: absolute;
        width: 100%;
        margin-top: 60px
    }
    header nav>ul>li {
        float: none;
        border-left: 0;
        border-top: 1px solid #55555f;
        height: auto
    }
    header nav>ul>li:hover ul {
        display: none
    }
    header nav>ul>li>a {
        min-height: 50px;
        line-height: 50px
    }
    header nav>ul>li:first-of-type {
        border-top: 0
    }
    header nav>ul>li>a {
        width: 100%;
        text-align: center;
        height: auto
    }
    header nav>ul>li ul {
        width: 100%;
        left: 0;
        position: relative
    }
    header nav>ul>li.urunlerimiz-drop-button .grid {
        width: auto;
        position: relative
    }
    header nav>ul>li.urunlerimiz-drop-button ul {
        left: 0
    }
    header nav>ul>li.urunlerimiz-drop-button ul:before {
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0)
    }
    header nav>ul>li.urunlerimiz-drop-button li:first-of-type {
        display: none
    }
    header nav>ul>li.urunlerimiz-drop-button ul li {
        width: 33.17%
    }
    header nav>ul>li.urunlerimiz-drop-button ul li a {
        width: 100%
    }
    header nav ul.diller>li {
        border-top: 0
    }
    header nav ul.diller>li>a {
        padding: 0 35px 0 20px
    }
    header nav ul.diller>li>a:before {
        right: 10px;
        top: 22px
    }
    header nav>ul.diller li ul {
        position: absolute;
        right: auto;
        left: 0;
        border-radius: 0 5px 5px 0
    }
    header nav>ul.diller>li ul:before {
        right: auto;
        left: 20px
    }
    header nav .arama-b {
        width: 80px;
        height: 50px;
        border-left: 0;
        z-index: 2
    }
    header nav .arama-b .ara-tikla {
        height: 50px
    }
    header nav .arama-b .arama-dropdown:before {
        left: 40px
    }
    header nav .arama-b .arama-dropdown>div {
        padding: 15px
    }
    header nav .arama-b .arama-dropdown>div form {
        width: 100%
    }
    header nav .arama-b .arama-dropdown>div form select {
        margin: 0;
        width: 100%
    }
    header nav .arama-b .arama-dropdown>div form input[type="search"] {
        width: 100%;
        margin: 15px 0
    }
    header nav .arama-b .arama-dropdown>div form input[type="submit"] {
        width: 100%;
        margin: 0
    }
    header nav .arama-b .arama-dropdown>div>a {
        width: 100%;
        margin-top: 15px
    }
    header>.urunler-dropdown {
        margin-top: 10px
    }
    footer>div>* {
        width: 50% !important
    }
    footer ul {
        padding: 0
    }
    footer .katalog {
        border-left: 0
    }
    footer .alt-footer .grid {
        width: 100% !important
    }
    footer .alt-footer p,
    footer .alt-footer a {
        float: none;
        display: block;
        text-align: center
    }
}

@media (max-width: 1000px) {
    header .head .mail {
        float: left;
        margin-left: 0
    }
}

@media (max-width: 900px) {
    header .ust a {
        width: 25%
    }
    header .ust a:last-of-type {
        display: none
    }
}

@media (max-width: 700px) {
    header .ust a {
        width: 33.333%
    }
    header .ust a:nth-last-of-type(2) {
        display: none
    }
    header .head .logo {
        left: 0;
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        position: relative
    }
    header .head .mail {
        display: none
    }
    header nav>ul>li.urunlerimiz-drop-button ul li {
        width: 49.7%
    }
    footer .adres {
        width: 65% !important
    }
    footer ul {
        width: 35% !important
    }
}

@media (max-width: 550px) {
    header .ust a {
        display: none
    }
    header .head {
        margin-top: 0
    }
    header .head .logo {
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%)
    }
    header .head .phone {
        position: absolute;
        right: 50px;
        margin: 0;
        padding: 16px 20px;
        transform: translateY(80px);
        -webkit-transform: translateY(80px);
        -ms-transform: translateY(80px);
        border-right: 1px solid #55555f;
        z-index: 1
    }
    header nav .arama-b {
        width: 60px
    }
    header nav .arama-b .arama-dropdown:before {
        left: 30px
    }
    footer>div.grid>* {
        width: 100% !important;
        border-right: 0;
        padding-bottom: 20px;
        border-bottom: 1px solid #454564;
        margin-bottom: 20px;
        height: auto
    }
    footer ul {
        display: none
    }
    footer .logolar>* {
        text-align: center;
        background-position: center center
    }
    footer>div.grid>*:last-of-type {
        border: 0;
        padding: 0
    }
}

@media (max-width: 460px) {
    header nav>ul>li.urunlerimiz-drop-button ul li {
        width: 100%
    }
}

@media (max-width: 380px) {
    header nav .arama-b {
        width: 40px;
        left: 55px
    }
    header nav ul.diller>li>a {
        padding: 0 25px 0 11px
    }
}

@media (min-width: 1170px) {
    header nav>ul.menu {
        display: block !important
    }
    nav .menu-b {
        display: none
    }
}
.grids {
    position: relative;
    clear: both;
    margin: 0 auto;
    padding: 1em 0 4em;
    max-width: 1000px;
    list-style: none;
    text-align: center;
}

/* Common style */
.grids figure {
    position: relative;
    float: left;
    overflow: hidden;
    margin: 5px 5px;
    /* min-width: 320px; */
    max-width: 480px;
    min-height: 250px;
    width: 32%;
    height: auto;
    background: #3085a3;
    text-align: center;
    cursor: pointer;
}

.grids figure img {
    position: relative;
    display: block;
    min-height: 100%;
    max-width: 100%;
    opacity: 0.8;
}

.grids figure figcaption {
    padding: 2em;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.grids figure figcaption::before,
.grids figure figcaption::after {
    pointer-events: none;
}

.grids figure figcaption,
.grids figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grids figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}

.grids figure h2 {
    word-spacing: -0.15em;
    font-weight: 300;
}

.grids figure h2 span {
    font-weight: 800;
}

.grids figure h2,
.grids figure p {
    margin: 0;
}

.grids figure p a {
     letter-spacing: 1px; 
     font-size: 14px; 
}
/* Common style */
.gridse figure {
    position: relative;
    float: left;
    overflow: hidden;
    margin: 5px 5px;
    /* min-width: 320px; */
    max-width: 480px;
    min-height: 250px;
    width: 100%;
    height: auto;
    background: #3085a3;
    text-align: center;
    cursor: ew-resize;
    font-family: 'Rajdhani', sans-serif;
}

.gridse figure img {
    position: relative;
    display: block;
    min-height: 100%;
    max-width: 100%;
    opacity: 0.8;
}

.gridse figure figcaption {
    padding: 2em;
    color: #fff;
    /* text-transform: uppercase; */
    font-size: 18px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.gridse figure figcaption::before,
.gridse figure figcaption::after {
    pointer-events: none;
}

.gridse figure figcaption,
.gridse figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.gridse figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}

.gridse figure h2 {
    word-spacing: -0.15em;
    font-weight: 300;
}

.gridse figure h2 span {
    font-weight: 800;
}

.gridse figure h2,
.gridse figure p {
    margin: 0;
}

.gridse figure p a {
     letter-spacing: 1px; 
     font-size: 14px; 
}
/*-----------------*/
/***** Winston *****/
/*-----------------*/

figure.effect-winston {
    background: #000000;
    text-align: left;border-radius:8px
}

figure.effect-winston img {
    -webkit-transition: opacity 0.45s;
    transition: opacity 0.45s;
    -webkit-backface-visibility: hidden;
    /* backface-visibility: hidden; */
    border-radius:7px;
    background-size: cover;
    height: 250px;
}

figure.effect-winston figcaption::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 118%;
    height: 100%;
    background: url(../img/master/triangle.svg) no-repeat center center;
    background-size: 100% 100%;
    content: '';
    -webkit-transition: opacity 0.45s, -webkit-transform 0.45s;
    transition: opacity 0.45s, transform 0.45s;
    -webkit-transform: rotate3d(0,0,1,45deg);
    transform: rotate3d(0,0,1,45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
}

figure.effect-winston h2 {
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(0,20px,0);
    transform: translate3d(0,20px,0);
    font-family: 'Rajdhani', sans-serif;
}

figure.effect-winston p {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 0 5px 7px 0;
}

figure.effect-winston a {
    /* margin: 0 10px; */
    color: #000;
    font-size: 16px;
}

figure.effect-winston a:hover,
figure.effect-winston a:focus {
    color: #000000;
}

figure.effect-winston p a {
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(0,50px,0);
    transform: translate3d(0,50px,0);
    font-family: 'Rajdhani', sans-serif;
}

figure.effect-winston:hover img {
    opacity: 0.3;
}

figure.effect-winston:hover h2 {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

figure.effect-winston:hover figcaption::before {
    opacity: 0.7;
    -webkit-transform: rotate3d(0,0,1,20deg);
    transform: rotate3d(0,0,1,16deg);
}

figure.effect-winston:hover p a{
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    font-size: 15px;
    font-weight: 600;
}

figure.effect-winston:hover p a:nth-child(3) i {
    -webkit-transition-delay: 0.05s;
    transition-delay: 0.05s;
}

figure.effect-winston:hover p a:nth-child(2) i {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

figure.effect-winston:hover p a:first-child i {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
}

/*---------------*/
/***** Oscar *****/
/*---------------*/

figure.effect-oscar {
    background: -webkit-linear-gradient(45deg, #22682a 0%, #9b4a1b 40%, #3a342a 100%);
    background: linear-gradient(45deg, #22682a 0%,#9b4a1b 40%,#3a342a 100%);
    /* border-radius:10px; */
    overflow:hidden
}

figure.effect-oscar img {
    opacity: 0.9;
    -webkit-transition: opacity 0.35s;
    transition: opacity 0.35s;
}

figure.effect-oscar figcaption {
    padding: 3em;
    background-color: rgb(58 52 42 / 0%);
    -webkit-transition: background-color 0.35s;
    transition: background-color 0.35s;
}

figure.effect-oscar figcaption::before {
    position: absolute;
    top: 30px;
    right: 30px;
    bottom: 30px;
    left: 30px;
    border: 1px solid #fff;
    content: '';
}

figure.effect-oscar h2 {
    margin: 20% 0 10px 0;
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
    opacity: 0;
}

figure.effect-oscar figcaption::before,
figure.effect-oscar p {
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: scale(0);
    transform: scale(0);
}

figure.effect-oscar:hover h2 {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    opacity: 1;
}

figure.effect-oscar:hover figcaption::before,
figure.effect-oscar:hover p {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

figure.effect-oscar:hover figcaption {
    background-color: rgb(42 44 58 / 90%);
}

figure.effect-oscar:hover img {
    opacity: 0.4;
}

.nedens{font-family: 'Rajdhani', sans-serif;
    background: url(../galeri/video-bg.jpg);
    background-attachment: fixed;
    background-size: cover;
    color:#fff;
}
.nedens h1{font-family: 'Rajdhani', sans-serif;text-align: center;padding:25px 0;    margin-top: -70px;}
.neden img{float:left;position: absolute;bottom: 0;width: 25%;}
.neden p{float: right;width: 75%;font-size:20px;}
.neden b{color:orange}

.nedenss h1{
    font-family: 'Rajdhani', sans-serif;
    text-align: center;
    padding:25px 0;
    font-size: 35px
}
.nedenss h2{
    font-family: 'Rajdhani', sans-serif;
    text-align: center;
    padding: 0 0 20px 0;
    font-weight: 560;font-size: 20px
}
.nedensss a{font-family: 'Rajdhani', sans-serif;
    text-align: center;
    padding: 10px 20px;
    font-size: 20px;
    background: orange;
    margin-top: 45px;
    display: inline-block;
    border-radius: 8px;
    font-weight: 600;
    color: #fff;
    border-bottom: 2px solid #c37f03;
}
.nedensss a:hover{
    background: #c37f03;margin-top: 47px;
    border-bottom: 0px solid #c37f03;
}
.nedensss a:after{
    content: "";
    display: inline-block;
    width: 24px;
    height: 28px;
    margin-left: 10px;
    background-image: url(../img/referans-ok2.png);
}
.nedensss {
    min-height: 150px;
    margin: 0 auto;
    text-align: center;
}
.owl-carousel div{ border-radius:8px;overflow: hidden;}
.menus{
    float: left;
    margin-top: -92px;
    margin-left: 183px;
}
.tp-bannertimer{display: none}
.ogrenci{
    display:block;font-family: 'Rajdhani', sans-serif;font-size: 20px;
}
.ogrenci div{
    padding:20px;float:left;
}
.ogrenci img{
    float:left;
}
.ogrenci p{
    padding:20px;font-family: 'Rajdhani', sans-serif;font-size: 20px;
}

.gonderbtn{
    margin:0 auto;text-align: center;width:100%;
}
.katlink{
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 18px;
    color: #866b06;
    text-transform: uppercase;
    height: 65px;
    line-height: 65px;
}
.altkat{
    display:none;
    text-align: left;
    width: 100%;
    /* padding:10px 0; */
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 18px;
/*    padding-left: 320px;*/
}
.altkat .altkat{
    
    text-align: left;
    width: 100%;
    padding:10px 0;
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 16px;
    padding-left:20px;
}

.altkat li .caret{
    text-align: left;
    width: 100%;
    /* padding: 10px 0; */
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 18px;
    padding-left: 30px;
    color: #a98c22;
    height: 45px;
    line-height: 45px;
    display: block;
    }
.altkat li a{
    text-align: left;
    width: 100%;
    /* padding: 10px 0; */
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 18px;
    padding-left: 30px;
    color: #a98c22;
    height: 45px;
    line-height: 45px;
    display: block;
    }
.altkat li a:hover {
    background: #ffd94a;
    background: -webkit-linear-gradient(left, #ffcb08, #ffd94a);
    background: -o-linear-gradient(right, #ffcb08, #ffd94a);
    background: -moz-linear-gradient(right, #ffcb08, #ffd94a);
    background: linear-gradient(to right, #ffcb08, #ffd94a);
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 35px;
    color: #fff;
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}
.altkat li .actives {
    background: #d7ab06;
    background: -webkit-linear-gradient(left, #ffcb08, #d7ab06);
    background: -o-linear-gradient(right, #ffcb08, #d7ab06);
    background: -moz-linear-gradient(right, #ffcb08, #d7ab06);
    background: linear-gradient(to right, #ffcb08, #d7ab06);
    background-position: left center;
    background-repeat: no-repeat;
/*    padding-left: 35px;*/
    color: #6e5907;
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}
.altkat2{
    
    width: 100%;
    padding:10px 0;
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 18px;
    padding-left: 20px;
}

.altkat .altkat li a{
    text-align: left;
    width: 100%;
    /* padding: 10px 0; */
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 16px;
    padding-left: 30px;
    color: #c1a439;
    height: 45px;
    line-height: 45px;
    }
.altkat .altkat li a:hover {
    background: #ffd94a;
    background: -webkit-linear-gradient(left, #ffcb08, #ffd94a);
    background: -o-linear-gradient(right, #ffcb08, #ffd94a);
    background: -moz-linear-gradient(right, #ffcb08, #ffd94a);
    background: linear-gradient(to right, #ffcb08, #ffd94a);
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 35px;
    color: #7C6308;
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}
.git{
    float: right;
    width: 40px !important;
    position: relative;
    /* background-color: #997906; */
    background-image:url(../img/git.webp);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 999;
    margin-right: -20px;
    border-radius: 8px;
    opacity: 0;
}
.caret:hover .git{
    float: right;
    width: 40px !important;
    position: relative;
    /* background-color: #997906; */
    background-image:url(../img/git.webp);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 999;
    margin-right: 1px;
    border-radius: 8px 2px 2px 8px;
    opacity:1;
}
.caret{cursor: pointer;}
.f-r{float:right !important}
.tar{float:right !important;text-align: right !important;}

.paylas a {
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: block;
    float: left;
    margin-right: 10px;
    background-image: url(../img/kucuk-images.webp);
        -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}
.paylas a:hover {
    transform: translateY(-5px);
    -webkit-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    -wekit-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    -moz-transition: all .4s cubic-bezier(.19, 1, .22, 1);
    transition: all .4s cubic-bezier(.19, 1, .22, 1)
}
.paylas .face {
    background-position: 0 0
}

.paylas .twitter {
    background-position: -30px 0
}

.paylas .insta {
    background-position: -60px 0
}
.paylas .whatsapp {
    background-position: -151px -148px
}
.paylas .youtube {
    background-position: -90px 0
}

.paylas .google {
    background-position: -120px 0
}

.paylas .pin {
    background-position: -150px 0
}