body{ width: 100%; height: 100%; padding: 0; margin: 0; font-family: 'Oswald', sans-serif; font-weight: 400; color: #111; background-color: #fff; overflow: overlay; overflow-x: hidden;}

/* LOADING */

.loading{ position: fixed; width: calc(100% + 9px); height: 100vh; background: #000000; top: 0; left: 0; z-index: 9999999999999999;}
@media(max-width: 991px){ .loading{ width: 100%;} }
.loading .mid{ transform: scale(0); position: absolute; width: 240px; height: 240px; top: calc(50% - 40px); left: 50%; margin-top: -120px; margin-left: -120px; animation: mid 0.6s; animation-delay: 2.4s; animation-fill-mode: backwards;}
.loading .mid img{ width: 150%; margin-left:-65px; -webkit-animation: rotating 2s linear infinite; -moz-animation: rotating 2s linear infinite; -ms-animation: rotating 2s linear infinite; -o-animation: rotating 2s linear infinite; animation: rotating 2s linear infinite;}

.loading .mid .line1{ position: absolute; top: 0; right: 0; height: 21px; background: #000000; animation: line1 0.6s linear;}
.loading .mid .line2{ position: absolute; right: 0; bottom: 0; width: 21px; background: #000000; animation: line2 0.6s linear; animation-delay: 0.6s; animation-fill-mode: backwards;}
.loading .mid .line3{ position: absolute; left: 0; bottom: 0; height: 21px; background: #000000; animation: line3 0.6s linear; animation-delay: 1.2s; animation-fill-mode: backwards;}
.loading .mid .line4{ position: absolute; left: 0; top: 0; width: 21px; background: #000000; animation: line4 0.6s linear; animation-delay: 1.8s; animation-fill-mode: backwards;}

.loading .slogan{ width: 360px; margin-left: -40px; margin-top: 40px; font-size: 17px; font-weight: 600; color: #ffffff; letter-spacing: 3px; font-family: 'Gotham Narrow', sans-serif;}

@-webkit-keyframes rotating {
    from {
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  @keyframes rotating {
    from {
      -ms-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -ms-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -webkit-transform: rotate(360deg);
      -o-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }

@keyframes line1
{
    0%{ width: 240px;}
    100%{ width: 0;}
}
@keyframes line2
{
    0%{ height: 240px;}
    100%{ height: 0;}
}
@keyframes line3
{
    from{ width: 240px;}
    to{ width: 0;}
}
@keyframes line4
{
    from{ height: 240px;}
    to{ height: 0;}
}
@keyframes mid
{
    0%{ transform: scale(1);}
    100%{ transform: scale(0);}
}

.loading2{ position: fixed; width: calc(100% + 9px); height: 100vh; background: #000000; top: 0; left: 0; z-index: 9999999999999999;}

::selection{ background: #ffffff; color: #fff;}

/* width */
::-webkit-scrollbar{ width: 9px;}

/* Track */
::-webkit-scrollbar-track{ background: transparent;}
 
/* Handle */
::-webkit-scrollbar-thumb{background: rgba(0,0,0,0.6); border-radius: 9px;}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover{}


/* HEAD */

.head { width: 100%; padding-top: 18px; padding-bottom: 16px; background: #000000; z-index: 9; }

/* LOGO */

.logo{ max-width: 125px; width: 125px;}
    .logo img { width: 225px; margin-left: -56px; }
.logo a{ text-decoration: none; color: currentColor; display: block;}

/* Home Carou */
.home-carou { width: 100%; display: flex; position: relative; margin-top: -95px; }
    .home-carou .item { transition: 0.3s; width: 25%; height: 100%; padding: 0 10px; overflow: hidden; }
    .home-carou a { text-decoration: none; color: currentColor; display: block; position: relative; min-height: 400px; }
        .home-carou a::after { transition: 0.3s; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 2; }
    .home-carou img { width: 100%; height: 100%; position: absolute; object-fit: cover; left: 0; top: 0; }
    .home-carou h2 { position: absolute; width: 100%; left: 0; bottom: 0; padding: 20px; margin-bottom: 0; color: #fff; z-index: 3; font-weight: 500; opacity: 1.5; }

    .home-carou .item:hover { width: 40%; }
        .home-carou .item:hover a::after { opacity: 0; }
        .home-carou .item:hover h2 { color: white; font-weight: bold; opacity: 1; }

    .home-carou::after { content: ""; position: absolute; width: 200px; height: 200px; border-right: 15px solid #e6342c; border-top: 15px solid #e6342c; right: -5px; top: -15px; }
    .home-carou::before { content: ""; position: absolute; width: 200px; height: 200px; border-left: 15px solid #e6342c; border-bottom: 15px solid #e6342c; left: -5px; bottom: -15px; }

/* Ref List */

.ref-list { padding-bottom: 45px; }
    .ref-list .swiper-slide { padding: 10px 0; }
    .ref-list a { text-decoration: none; box-shadow: 0px 5px 1px rgba(0,0,0,0.1); color: currentColor; display: flex; align-items: center; justify-content: center; background: #fafafa; border-radius: 60px; padding: 30px; }
        .ref-list a img { max-width: 100%; }

    .ref-list .swiper-pagination span { width: 30px; height: 5px; border-radius: 50rem; }
    .ref-list .swiper-pagination .swiper-pagination-bullet-active { width: 60px; background: #999; }


/* TOP MENU */

.top-menu{ width: 100%; text-align: center;}
.top-menu ul{ list-style: none; margin: 0; padding: 0;}
.top-menu ul li{ display: inline-block; position: relative; border: 1px solid transparent;}
.top-menu ul li.active{ border: 3px #ffffff solid;}
.top-menu ul li a{ text-decoration: none; color: #ffffff; padding: 10px; padding-left: 20px; padding-right: 20px; font-size: 16px; display: block; font-weight: 700;}

.top-menu ul li:hover{ border: 1px #ffffff solid;}

.top-menu .sub-ul{ transition: 0.3s; border-top: 1px #000000 solid; text-align: left; position: absolute; z-index: 3; background: #ffffff; box-shadow: 0px 10px 30px rgba(0,0,0,0.2); min-width: 200px; left: 0; visibility: hidden; opacity: 0; margin-top: 1px; margin-left: -8px;}
.top-menu .sub-ul.hover{ visibility: visible; opacity: 1; margin-left: -1px;}
.top-menu .sub-ul li{ width: 100%; margin-left: 0; border: 0; border-bottom: 1px #000000 solid;}
.top-menu .sub-ul li:last-child{ border-bottom: 0;}
.top-menu .sub-ul li:hover:last-child{ border-bottom: 0;}
.top-menu .sub-ul li a{ border: 0; width: 100%; text-decoration: none; color: #000000; font-size: 16px; font-weight: 500; padding: 0; margin: 0; padding: 7px; padding-left: 12px; padding-right: 12px;}
.top-menu .sub-ul li a:hover{ border: 0;}
.top-menu .sub-ul li:hover{ border: 0; border-bottom: 1px #000000 solid;}

.operationfield{
    background: url("/Site/Library/images/solutions-banner.png");
    background-repeat: no-repeat;
    object-fit: cover;
    object-position: center;
    display: flex;
    justify-content: center;
    align-items: center;
}


/* LANG */

.lang{ max-width: 120px; width: 120px;}
.lang a{ text-decoration: none; color: #ffffff; float: left; border-right: 1px #ffffff solid; padding: 5px; padding-left: 10px; padding-right: 10px; margin-right: 0;}
.lang a:last-child{ border: 0;}
.lang a.active{ font-weight: 800;}

/* SLIDER */

.slider{ width: 100%; position: relative; z-index: 1;}
.slider a{ text-decoration: none; color: currentColor; display: block; width: 100%;}
.slider img{ width: 100%;}

/* BANNER */

.banner{ width: 100%; position: relative; z-index: 1;}
.banner a{ text-decoration: none; color: currentColor; display: block; width: 100%;}
.banner img{ width: 100%;}

/* PAGE */

.page{ margin-top: 30px; margin-bottom: calc(3% + 30px);}

/* HAKKIMIZDA */

.hakkimizda{ text-align: center; margin-bottom: calc(3% + 30px);}
.hakkimizda p{ font-size: 16px; font-weight: 500; color: #666; font-family: 'Gotham Narrow', sans-serif;}

.hkkmzd{}
.hkkmzd a{ text-decoration: none; color: currentColor; display: block; display: flex; align-items: center;}

.hkkmzd .img{ width: 50%; position: relative;}
.hkkmzd .img img{ width: 100%; position: relative; z-index: 2;}

.hkkmzd .icerik{ width: 50%; padding-left: 5%;}
.hkkmzd .icerik h1{ font-size: 28px; font-weight: 600; margin-bottom: 15px; padding-bottom: 15px; color: #000000; display: block; border-bottom: 1px solid #aaa;}
.hkkmzd .icerik .tarih{ font-size: 20px; font-weight: 400; color: #888;}
.hkkmzd .icerik p{ color: #000000; font-family: 'Gotham Narrow', sans-serif; font-weight: 500; font-size: 15px;}

.hkkmzd ul{ list-style: none; padding: 0; margin: 0; max-width: 1110px; width: 100%; margin: auto;}
.hkkmzd ul li{ margin-bottom: 45px;}

/* �ift sat�rlar */
.hkkmzd ul li:nth-child(even) .img{ order: 2; padding-right: unset;}
.hkkmzd ul li:nth-child(even) .img::after{ right: auto; left: 0px;}

.hkkmzd ul li:nth-child(even) .icerik{ order: 1; padding-left: unset; padding-right: 5%; text-align: left;}

.hkkmzd .icerik span{ text-decoration: none !important; display: inline-block; border: 1px solid #ffffff; color: #888 !important; padding: 5px; padding-left: 12px; padding-right: 26px; font-size: 18px;}
.hkkmzd .icerik span{ background-image: url(../images/arrow-right.png); background-repeat: no-repeat; background-position: center right 10px; background-size: 8px 12px;}

/* PROJELER */

.projeler{ margin-bottom: 30px; padding-top: 30px; padding-bottom: 30px; background: #000000;}
.projeler a{ text-decoration: none; color: currentColor; display: block; max-width: 1110px; margin: auto; width: 100%; display: flex; align-items: center;}

.projeler .img{ width: 50%; position: relative; padding-right: 4%;}
    .projeler .img::after { position: absolute; content: ""; top: 10%; right: 0px; width: 100%; height: 80%; border: 10px solid #e6332b; z-index: 1; }
.projeler .img img{ width: 100%; position: relative; z-index: 2;}

.projeler .icerik{ width: 50%; padding-left: 4%;}
.projeler .icerik h1{ font-size: 24px; font-weight: 400; margin-bottom: 30px; color: #ffffff; display: inline-block; padding-right: 10px;}
.projeler .icerik .tarih{ font-size: 20px; font-weight: 400; color: #888;}
.projeler .icerik p{ color: #ddd; font-family: 'Gotham Narrow', sans-serif; font-weight: 500;}

.projeler ul{ list-style: none; padding: 0; margin: 0; width: 100%; margin: auto;}
.projeler ul li{ width: 100%; margin-bottom: 45px; position: relative;}

.projeler ul li:nth-child(1)::before{ position: absolute; content: ""; max-width: 348px; width: 100%; top: calc(50% - 248px); height: 428px; right: -90px; background-image: url(../images/yprk2.png); background-repeat: no-repeat; background-position: center; background-size: contain; display: none;}
.projeler ul li:nth-child(2)::before{ position: absolute; content: ""; max-width: 329px; width: 100%; top: calc(50% - 129px); height: 500px; left: -90px; background-image: url(../images/yprk1.png); background-repeat: no-repeat; background-position: center; background-size: contain; display: none;}
.projeler ul li:nth-child(4)::before{ position: absolute; content: ""; max-width: 267px; width: 100%; top: calc(50% - 167px); height: 281px; right: -90px; background-image: url(../images/yprk3.png); background-repeat: no-repeat; background-position: center; background-size: contain; display: none;}
/*.projeler ul li:nth-child(odd)::after{ position: absolute; content: ""; max-width: 446px; width: 100%; top: -100px; height: 428px; right: -90px; background-image: url(../images/yprk2.png); background-repeat: no-repeat; background-position: center; background-size: contain;}*/

/*.projeler ul::after{ position: absolute; content: ""; width: 334px; bottom: 0; height: 496px; right: -50px; background-image: url(../images/sag-alt.png); background-repeat: no-repeat; background-position: center; background-size: 334px 496px;}*/

.projeler .detay-btn{ display: inline-block !important; width: 115px; margin-left: 20px;}

/* �ift sat�rlar */
.projeler ul li:nth-child(even) .img{ order: 2; padding-right: unset; padding-left: 4%;}
.projeler ul li:nth-child(even) .img::after{ right: auto; left: 0px;}

.projeler ul li:nth-child(even) .icerik{ order: 1; padding-left: unset; padding-right: 4%; text-align: left;}

/* Home Services */
.home-services { text-align: center; }
    .home-services h2 { font-size: 42px; font-weight: 700; position: relative; padding-bottom: 30px; margin-bottom: 30px; }
    .home-services h2 { background: url(../images/line.png) no-repeat center bottom; background-size: auto; }

/* PROJE L�STE */

.proje-list{}
.proje-list a{ text-decoration: none; color: currentColor; display: block; display: flex; align-items: flex-end;}

.proje-list .img{ width: 50%; position: relative;}
.proje-list .img img{ width: 100%; position: relative; z-index: 2;}

.proje-list .icerik{ width: 50%; padding-left: 4%;}
.proje-list .icerik h1{ font-size: 24px; font-weight: 600; margin-bottom: 15px; color: #000000; display: inline-block; padding-right: 10px;}
.proje-list .icerik .tarih{ font-size: 20px; font-weight: 400; color: #888;}
.proje-list .icerik p{ color: #000000; border-top: 1px #ccc solid; padding-top: 20px;}

.proje-list ul{ list-style: none; padding: 0; margin: 0; max-width: 1110px; width: 100%; margin: auto;}
.proje-list ul li{ margin-bottom: 75px;}
.proje-list ul li:last-child{ margin-bottom: 0;}

/* �ift sat�rlar */
.proje-list ul li:nth-child(even) .img{ order: 2; padding-right: unset;}
.proje-list ul li:nth-child(even) .img::after{ right: auto; left: 0px;}

.proje-list ul li:nth-child(even) .icerik{ order: 1; padding-left: unset; padding-right: 4%; text-align: left;}

/* HABER �TEM */

.haber-item{ text-align: left;}
.haber-item a{ text-decoration: none; color: currentColor; display: block;}

.haber-item .img{ width: 100%; margin-bottom: 20px; overflow: hidden;}
.haber-item .img img{ width: 100%; transition: 0.6s;}

    .haber-item h1 { font-size: 20px; font-weight: 600; color: #000000; display: inline-block; padding-right: 10px; }
.haber-item .tarih{ display: inline-block; font-weight: 500;}

.haber-item a:hover img{ transform: scale(1.1);}

.haber-item p{ font-family: 'Gotham Narrow', sans-serif; font-size: 14px; font-weight: 500; overflow: hidden; height: auto;}

.haber-detay .gold { color: #000000; font-size: 24px; }
.haber-detay p{ font-family: 'Gotham Narrow', sans-serif; font-weight: 500; color: #000000;}
#lblTarih{ margin-bottom: 10px; display: block; color: #999;}

/* REFERANS L�STES� */

.referans-list{}
.referans-list ul{ list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap;}
.referans-list ul li{ width: 20%; text-align: center;}
.referans-list ul li a{ text-decoration: none; color: currentColor; display: block; padding: 20px;}

.referans-list ul li .img{ width: 100%; border: 1px #ccc solid; margin-bottom: 10px; padding: 20px; overflow: hidden;}
.referans-list ul li .img img{ width: 100%; transition: 0.6s;}
.referans-list ul li h1{ font-size: 20px; font-weight: 500; color: #000000;}

.referans-list ul li a:hover img{ transform: scale(1.1);}

/* ��T�RAKLER�M�Z */
a.istirak-item { display:block; }
a.istirak-item:hover { text-decoration:none; }


.istirak-item{ text-align: center; padding-top: 20px; padding-bottom: 20px; position: relative; z-index: 1;}
.istirak-item .img{ max-width: 220px; width: 100%; display: inline-block; margin-bottom: 10px;}
.istirak-item .img img{ width: 100%;}

.istirak-item .icerik{ max-width: 1110px; width: 100%; margin: auto; padding-left: 15px; padding-right: 15px;}
.istirak-item .icerik p{ font-size: 15px; font-weight: 500; color: #000000; font-family: 'Gotham Narrow', sans-serif;}

.istirak-item:nth-child(even){ background: #000000;}
.istirak-item:nth-child(even) .icerik p{ color: #fff;}

/* PROJE DETAY */

.proje-detay{ text-align: center;}
.proje-detay .owl-item{ opacity: 0.3; transform: scale(0.7, 0.8)}
.proje-detay .owl-item.center{ transition: 0.6s; opacity: 1; transform: scale(1, 1)}

.proje-detay .owl-nav.disabled{ display: unset; text-align: center;}
.proje-detay .owl-dots{ display: none;}

.proje-detay .owl-prev{ font-size: 32px !important; margin-right: 5px; outline: none !important;}
.proje-detay .owl-next{ font-size: 32px !important; margin-left: 5px; outline: none !important;}

.proje-detay .owl-carousel{ margin-bottom: 30px;}

.proje-detay h1{ font-size: 24px; font-weight: 600; margin-bottom: 15px; color: #000000; display: inline-block; padding-right: 10px;}
.proje-detay .tarih{ font-size: 20px; font-weight: 400; color: #888;}
.proje-detay p{ color: #000000; border-top: 1px #ccc solid; padding-top: 20px; font-family: 'Gotham Narrow', sans-serif; font-size: 15px; font-weight: 500;}

.proje-detay .proje-icerik{ max-width: 900px; width: 100%; margin: auto; padding-left: 15px; padding-right: 15px;}

/* �KONLAR */

.ikonlar{ margin-bottom: 20px; text-align: center;}
.ikonlar a{ text-decoration: none; color: currentColor; display: block; padding: 10px; width: 100%; align-items: center;}
.ikonlar .ikn{}
.ikonlar .img{ width: 80px; height: 80px; margin: auto; margin-bottom: 10px;}
.ikonlar .img img{ width: 100%;}

    .ikonlar h1 { font-size: 20px; font-weight: 400; color: #e6332c; display: inline-block; padding: 7px; padding-left: 12px; padding-right: 12px; }

/* About */
.about { text-align: center; }
    .about img { max-width: 100%; }
    .about h2 { font-size: 18px; font-weight: 600; margin-bottom: 30px; position: relative; padding: 0 45px; }
        .about h2::before { content: ""; position: absolute; top: -20px; left: 0; width: 43px; height: 37px; background: url(../images/quote.png) no-repeat center; background-size: 43px 37px; }


/* CONTACT */

.map{ width: 100%; display: block; margin-bottom: 30px; height:100%;}
.map iframe{ width: 100%; height: 500px;}

.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; font-family: 'Gotham Narrow', sans-serif; font-weight: 500;}
.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{ margin-bottom: 30px;}
.contact-form h1{ font-size: 18px; font-weight: 800; margin-bottom: 20px; text-decoration: underline;}
.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: 14px; font-weight: 500; 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: 14px; font-weight: 700; 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: 12px; color: #aaa;}
.contact-form ul li textarea{ transition: 0.3s ease all; width: 100%; height: 120px; font-size: 14px; font-weight: 700; padding: 10px; padding-left: 0; padding-right: 0; border: none; border-bottom: 1px #ddd solid; outline: none; display: block; width: 100%;}
.contact-form ul li textarea:focus ~ label, .contact-form ul li textarea:valid ~ label{ top: -10px; font-size: 12px; font-weight: 700; color: #aaa;}
.contact-form ul li input[type=submit]{ padding: 15px; font-size: 14px; letter-spacing: 1px; font-weight: 700; border: 0; cursor: pointer; background-image: linear-gradient(to right, #ffffff 0%, #ffffff 50%, #ffffff 100%); background-size: 200% auto; color: #fff; transition: 0.6s; border-radius: 4px;}
.contact-form ul li input[type=submit]:hover{ background-position: right center;}
.contact-form ul li .bar{ position: relative; display: block; width: 100%;}
.contact-form ul li .bar:before, .bar:after{ content: ''; height: 1px; width: 0; bottom: 0; position: absolute; background: #ffffff; transition: 0.3s ease all; -moz-transition: 0.3s ease all; -webkit-transition: 0.3s ease all;}
.contact-form ul li .bar:before{ left: 50%;}
.contact-form ul li .bar:after{ right: 50%;}
.contact-form ul li input:focus ~ .bar:before, .contact-form ul li input:focus ~ .bar:after{ width: 50%;}
.contact-form ul li textarea:focus ~ .bar:before, .contact-form ul li textarea:focus ~ .bar:after{ width: 50%;}
.contact-form ul li .highlight{ position: absolute; height: 22px; width: 100px; top: 8px; left: 0; pointer-events: none; opacity: 0.5;}
.contact-form ul li input:focus ~ .highlight{ -webkit-animation: inputHighlighter 0.3s ease; -moz-animation: inputHighlighter 0.3s ease; animation: inputHighlighter 0.3s ease;}
.contact-form ul li textarea:focus ~ .highlight{ -webkit-animation: inputHighlighter 0.3s ease; -moz-animation: inputHighlighter 0.3s ease; animation: inputHighlighter 0.3s ease;}*/
.contact-form h1{ font-size: 18px; font-weight: 800; margin-bottom: 10px; text-decoration: underline;}


/* GRUP ELEMENTLER� */

.grup-elementleri > li{ width: 100% !important; float: none !important; position: relative; font-family: 'Gotham Narrow', sans-serif;}
.grup-elementleri > li input{ transition: 0.3s ease all; font-weight: 500; width: 100%; font-size: 14px; padding: 10px !important; padding-left: 0 !important; padding-right: 0 !important; border: none !important; border-bottom: 1px #ddd solid !important; outline: none;}
.grup-elementleri > li input:focus{ border-color: #e47a79 !important;}
.grup-elementleri > li textarea{ transition: 0.3s ease all; font-weight: 500; width: 100%; height: 120px; font-size: 14px; padding: 10px; padding-left: 0; padding-right: 0; border: none; border-bottom: 1px #ddd solid; outline: none;}
.grup-elementleri > li textarea:focus{ border-color: #e47a79;}

.grup-elementleri > li label{ color: #999; font-size: 16px; left: 5px; top: 20px; position: absolute; transition: 0.3s ease all; -moz-transition: 0.3s ease all; -webkit-transition: 0.3s ease all; pointer-events: none;}

/*.grup-elementleri > li input:focus + label, .grup-elementleri > li input:valid + label{ top: -10px; font-size: 14px; color: #e47a79;}
.grup-elementleri > li textarea:focus + label, .grup-elementleri > li textarea:valid + label{ top: -10px; font-size: 14px; color: #e47a79;}*/

.grup-elementleri > li input:placeholder-shown + label { color: #999; font-size: 14px; font-weight: 500; left: 0; top: 20px; position: absolute; transition: 0.3s ease all; -moz-transition: 0.3s ease all; -webkit-transition: 0.3s ease all; pointer-events: none;}
.grup-elementleri > li textarea:placeholder-shown + label { color: #999; font-size: 14px; font-weight: 500; left: 0; top: 20px; position: absolute; transition: 0.3s ease all; -moz-transition: 0.3s ease all; -webkit-transition: 0.3s ease all; pointer-events: none;}
.grup-elementleri > li input::-webkit-input-placeholder{ opacity: 0; transition: inherit;}
.grup-elementleri > li textarea::-webkit-input-placeholder{ opacity: 0; transition: inherit;}
.grup-elementleri > li input:focus::-webkit-input-placeholder{ opacity: 1;}
.grup-elementleri > li textarea:focus::-webkit-input-placeholder{ opacity: 1;}
.grup-elementleri > li input:not(:placeholder-shown) + label, .grup-elementleri > li input:focus + label{ left: 0; top: 0; font-size: 12px; font-weight: 500; color: #e47a79;}
.grup-elementleri > li textarea:not(:placeholder-shown) + label, .grup-elementleri > li textarea:focus + label{ left: 0; top: 0; font-size: 12px; font-weight: 500; color: #e47a79;}
/* animations */
/*@-webkit-keyframes inputHighlighter {
  from { background: #ff0600; }
  to   { width: 0; background: transparent; }
}
@-moz-keyframes inputHighlighter {
  from { background: #ff0600; }
  to   { width: 0; background: transparent; }
}
@keyframes inputHighlighter {
  from { background: #ff0600; }
  to   { width: 0; background: transparent; }
}*/

/* BREADCRUMB */

.breadcrumb{ background: #fff; margin-bottom: 30px; text-align: left; display: block;}
.breadcrumb a{ text-decoration: none; color: currentColor; font-size: 15px;}
.breadcrumb span{ font-size: 14px; padding-left: 8px; padding-right: 8px;}
.breadcrumb a:last-child{ font-weight: bold;}

/* PAGINATION */

.pagi{ width: 100%; text-align: center;}
.pagi a{ text-decoration: none; color: #111; padding: 5px; padding-left: 10px; padding-right: 10px;}
.pagi a.prev::before{ content: "<< geri";}
.pagi a.next::after{ content: "ileri >>";}
.pagi a.active{ background: #111; color: #fff;}

/* E-B�LTEN */

.e-bulten{ background: #000000;}
.e-bulten .container{ border-bottom: 1px solid #666; padding-top: 30px; padding-bottom: 30px;}
.e-bulten .f-logo{ width: 210px; margin: auto; margin-bottom: 20px;}
.e-bulten .f-logo img{ width: 100%;}
.e-bulten .f-logo a{ text-decoration: none; color: currentColor;}

.e-bulten h1{ font-size: 20px; font-weight: 700; margin-bottom: 0; color: #ffffff;}

.e-bulten .ebltn{ position: relative; max-width: 400px;}
.e-bulten .ebltn input[type=text]{ width: 100%; padding: 10px; padding-right: 100px; height: 50px; outline: none; border: 0; font-family: 'Gotham Narrow', sans-serif; font-weight: 500;}
    .e-bulten .ebltn input[type=submit] { position: absolute; top: 0; right: 0; height: 50px; padding: 10px; padding-left: 20px; padding-right: 20px; outline: none; border: 0; background: #e6332c; color: #fff; font-size: 15px; font-weight: 600; }

/* FOOTER */

.footer{ width: 100%; height: 100%; position: relative; z-index: 2; padding-top: 30px; padding-bottom: 30px; background: #000000; text-align: left;}
.footer .row:first-child { border-bottom: 1px solid #666; margin-bottom:20px; }



.footer-logo{ max-width: 430px; width: 100%; position: relative; z-index: 2; margin-bottom: 30px !important; margin: auto;}
.footer-logo a{ text-decoration: none; color: #fff; display: block; width: 100%;}
.footer-logo img{ width: 100%;}

.f-social{ position: relative; z-index: 2; text-align: center;}
.f-social a{ text-decoration: none; color: currentColor; width: 32px; height: 32px; display: inline-block;}
.f-social .facebook{ background-image: url("../images/social/facebook.png"); background-repeat: no-repeat; background-position: center; background-size: 20px 20px;}
.f-social .twitter{ background-image: url("../images/social/twitter.png"); background-repeat: no-repeat; background-position: center; background-size: 20px 20px;}
.f-social .instagram{ background-image: url("../images/social/instagram.png"); background-repeat: no-repeat; background-position: center; background-size: 20px 20px;}
.f-social .pinterest{ background-image: url("../images/social/pinterest.png"); background-repeat: no-repeat; background-position: center; background-size: 20px 20px;}
.f-social .whatsapp{ background-image: url("../images/social/whatsapp.png"); background-repeat: no-repeat; background-position: center; background-size: 20px 20px;}

.f-item{ width: 100%; position: relative; z-index: 2; margin-bottom: 30px;}
    .f-item img { width: 233px; }
.f-item h1{ display: inline-block; font-size: 18px; font-weight: 700; margin-bottom: 20px; color: #ffffff; }
.f-item ul{ list-style: none; padding: 0; margin: 0; font-family: 'Gotham Narrow', sans-serif;}
.f-item ul li{ display: block; margin-bottom: 5px; font-size: 13px; color: #fff;}
.f-item ul li a{ width: 100%; display: inline-block; text-decoration: none; color: #fff; font-size: 14px;}
  .f-item ul li.sarilink a { color: #ffffff; }
  .f-item ul li a b { font-size: 15px; font-weight: bold; color: #fff; font-weight: 700; }
.f-item ul li b{ font-size: 15px; font-weight: bold; color: #fff; font-weight: 700;}

.hzmt ul{ columns: 2;}
.hzmt ul li a{ }
.hzmt h1{ display: block; padding-left: 24%;}
@media(max-width: 991px)
{
	.hzmt ul{ order: 1;}
    .hzmt h1{padding-left: 0 !important;}
}

/* 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 .copyright{ text-align: left; font-size: 14px; font-weight: 500; font-family: 'Gotham Narrow', sans-serif;}
.footer-alt .design{ text-align: right; font-size: 14px; font-weight: 500; font-family: 'Gotham Narrow', sans-serif;}
.footer-alt .design a{ text-decoration: none; color: #111; font-weight: 800; font-size: 14px; font-family: 'Gotham Narrow', sans-serif;}

/* GO TO TOP */

#go-to-top{ display: inline-block; background-color: #000000; color: #ffffff; border: 0; width: 50px; height: 50px; text-align: center; position: fixed; bottom: 20px; right: 15px; 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; }

/* SAB�TLER */

a.fix-telefon{ z-index: 2; text-decoration: none; color: currentColor; line-height: 1.2em; width: 175px; display: flex; align-items: center; justify-content: center; position: fixed; bottom: 140px; right: 15px; background: rgba(218,154,107,0.8); color: #000000; height: 50px; }
a.fix-telefon i{ margin-right: 10px; font-size: 24px;}
a.fix-telefon b{ position: relative; top: 2px;}
a.fix-telefon b span{ display: block; width: 100%; font-size: 15px;}

a.fix-wp{ z-index: 2; text-decoration: none; color: currentColor; width: 175px; display: flex; align-items: center; justify-content: center; position: fixed; bottom: 80px; right: 15px; background: rgba(0,121,20,0.8); color: #fff; height: 50px; }
a.fix-wp i{ margin-right: 10px; font-size: 24px;}

.page{ position: relative;}
.back{ position: absolute; display: block;}
.yprk1{ top: calc(50% - 150px); left: -90px; z-index: 2; max-width: 329px; width: 100%; height: 500px; background-size: contain; background-image: url(../images/yprk1.png); background-repeat: no-repeat; background-position: center; z-index: -1; display: none;}
.yprk2{ top: 0; right: -90px; z-index: 2; max-width: 348px; width: 100%; height: 428px; background-size: contain; background-image: url(../images/yprk2.png); background-repeat: no-repeat; background-position: center; z-index: -1; display: none;}
.yprk3{ bottom: 0; right: -90px; z-index: 2; max-width: 267px; width: 100%; height: 281px; background-size: contain; background-image: url(../images/yprk3.png); background-repeat: no-repeat; background-position: center; z-index: -1; display: none;}

@media(max-width: 991px)
{
    a.fix-telefon{ width: 50px;}
    a.fix-telefon i{ margin-right: 0;}
    a.fix-telefon b{ display: none;}
    a.fix-wp{ width: 50px;}
    a.fix-wp i{ margin-right: 0;}
    a.fix-wp b{ display: none;}
    .back{ display: none !important;}

.projeler ul li:nth-child(even)::before{ display: none !important;}
.projeler ul li:nth-child(odd)::after{ display: none !important;}

    .home-carou .swiper-slide { width: 20% !important; }
    .home-carou .swiper-slide-active { width: 40% !important; }
    .home-carou { flex-wrap: wrap; }
        .home-carou .item { width: 50%; margin-bottom: 20px; }
        .home-carou::before { bottom: 5px; }

}

/* OTHERS */

.detay-btn { text-decoration: none !important; display: inline-block; border: 1px solid #e6332b; color: #888 !important; padding: 7px; padding-left: 12px; padding-right: 60px; font-size: 20px; }
.detay-btn{ background-image: url(../images/arrow-right.png); background-repeat: no-repeat; background-position: center right 10px; background-size: 8px 12px;}

.git-btn{ display: inline-block; border: 1px solid #000000; padding: 10px; padding-left: 20px; padding-right: 20px; color: #000000; font-weight: 500;}

.git-btn{ text-decoration: none !important; display: inline-block; border: 1px solid #ffffff; color: #888 !important; padding: 7px; padding-left: 12px; padding-right: 26px; font-size: 18px;}
.git-btn{ background-image: url(../images/arrow-right.png); background-repeat: no-repeat; background-position: center right 10px; background-size: 8px 12px;}

.h1-ana{ font-size: 32px; font-weight: 700; margin-bottom: 20px; color: #ffffff; text-align: center;}

.mobi{ display: none; }
.mobilBtn{ max-width: 44px; width: 44px; height: 44px; display: inline-block; text-align: center; border: 3px solid #ffffff; color: #ffffff; font-size: 24px; padding: 0;}

.plus{ display: none;}
.minus{ display: none;}

@media(max-width: 991px)
{
    .head{ position: relative; z-index: 4;}

    .top-menu{ transition: 0.3s; visibility: hidden; position: fixed; max-width: 100%; width: 100%; height: 100vh; background: #000000; top: 0; left: -100%; padding: 30px; padding-top: 110px; overflow: auto; overflow-x: hidden;}
    .top-menu.opened{ visibility: visible; left: 0;}

    .top-menu ul li{ border: 0;}
    .top-menu ul li.active{ border: 1px #ffffff solid;}
    .top-menu ul li:hover{ border: 0;}

    .sub-ul{ width: 100% !important; margin-left: 0 !important; box-shadow: none !important; color: #ffffff; background: #000000 !important; text-align: center !important;}
    .sub-ul li{ border: 0;}
    .top-menu .sub-ul li a{ color: #ffffff !important;}
    .sub-ul.opened{ display: block; position: relative; visibility: visible; opacity: 1;}
    .top-menu ul li a{ padding: 10px; color: #ffffff;}

    .top-menu ul{ border-bottom: 0;}
    .top-menu ul li{ display: block; position: relative; border-bottom: 1px #666 solid;}
    .plus{ display: block; color: #ffffff; position: absolute; z-index: 2; top: 9px; right: 9px;}
    .minus{ display: block; color: #ffffff;}

    .f-item{ margin-bottom: 30px;}

    .map iframe{ height: 300px;}

    .footer{ text-align: center;}

    .footer-alt .copyright{ text-align: center;}
    .footer-alt .design{ text-align: center;}

    .logo{ max-width: 100%; order: 2; z-index: 2; text-align: center;}
        .logo a img { width: 195.5px; display: inline-block; }

    .mobi{ display: block; order: 3; max-width: 120px; text-align: right; padding-right: 30px;}

    .lang{ order: 1;}

    .projeler a{ display: block;}
    .projeler .img{ width: 100%; padding: 15px !important;}
    .projeler .img::after{ display: none;}
    .projeler .icerik{ width: 100%; padding: 15px !important; text-align: left !important;}

    .projeler ul li{ margin-bottom: 0px;}

    .e-bulten .text-right{ text-align: center !important; margin-bottom: 20px;}
    .e-bulten .ebltn{ max-width: 100%;}

    .hkkmzd a{ display: block;}
    .hkkmzd .img{ width: 100%; margin-bottom: 20px;}
    .hkkmzd .icerik{ width: 100%; padding: 0 !important; text-align: left !important;}

    .proje-list a{ display: block;}
    .proje-list .img{ width: 100%; margin-bottom: 20px;}
    .proje-list .icerik{ width: 100%; padding: 0 !important; text-align: left !important;}
    .proje-list ul li{ margin-bottom: 30px;}

    .referans-list ul li{ width: 25%;}


    .hakkimizda p{ font-size: 15px;}
    .h1-ana{ font-size: 24px;}
    .projeler .icerik h1{ font-size: 20px;}
    .haber-item h1{ font-size: 18px;}
    .haber-item .tarih{ font-size: 14px;}
    .e-bulten h1{ font-size: 17px;}
    .f-item ul li a{ font-size: 13px;}
    .f-item h1{ font-size: 16px;}
    .footer-alt .copyright{ font-size: 13px;}
    .footer-alt .design{ font-size: 13px;}
    .hkkmzd .icerik h1{ font-size: 20px;}
    .hkkmzd .icerik p{ font-size: 13px;}
    .proje-list .icerik h1{ font-size: 20px;}
    .proje-list .icerik p{ font-size: 14px;}
    .referans-list ul li h1{ font-size: 16px;}
    .contact-info h1{ font-size: 16px;}
    .contact-info ul li a{ font-size: 14px;}
    .contact-info ul li{ font-size: 14px;}
    .projeler ul li:nth-child(1)::before{ display: none;}
}

@media(max-width: 768px)
{
    .referans-list ul li{ width: 33.333%;}
    .home-carou .swiper-slide { width: 25% !important; }
    .home-carou .swiper-slide-active { width: 50% !important; }
}

@media(max-width: 640px)
{
    .ikonlar .img{ width: 60px; height: 60px;}
    .ikonlar h1{ font-size: 16px;}
    .home-carou .swiper-slide { width: 50% !important; }
    .home-carou .swiper-slide-active { width: 50% !important; }
}

@media(max-width: 540px) {
    .home-carou .item { width: 100%; }
    .home-carou a { min-height: 300px; }
   
}

@media(max-width: 500px)
{
    .tabs .tab-link{ width: 100%; display: block; border: 1px #ddd solid;}
    .referans-list ul li{ width: 50%;}
}

@media(max-width: 440px) {
   
    .home-carou .swiper-slide { width: 100% !important; }
    .home-carou .swiper-slide-active { width: 100% !important; }
}

@media(max-width: 320px)
{
    .referans-list ul li{ width: 100%;}
}