﻿body, div, span, input, a {font-family: 'Montserrat', sans-serif !important;}
.dizi{display:flex; flex-wrap:wrap;}
.dizirow{display:flex; flex-wrap:wrap; margin:0 -30px; padding:0 !important;}
.sifirla{margin:0 !important; padding:0 !important;}
a, a:hover{text-decoration:none !important;}
.tepe{height:50px; border-bottom:1px solid rgba(1000, 2515, 2255, 0.20); position:relative; z-index:10;}
    .tepe span{color:#fff; line-height:50px; font-size:12px; margin-right:25px;}
    .tepe span a{color:#f7af10; transition:.2s; text-decoration:none;}
    .tepe span a:hover{color:#fff;}

    .tepe .sosyal{text-align:right; display:block; font-size:20px;}
        .tepe .sosyal a{color:#fff; margin-left:5px;}
        .tepe .sosyal a:hover{color:#f7af10;}

.baslik{height:98px; position:relative; z-index:10;}
    .baslik .menudiz{margin-left:100px;}
    .baslik .navbar-nav .nav-item .nav-link{font-weight:300; font-size:14px; color:#fff; padding:0 20px;}
    .baslik .navbar-nav .nav-item span{background:#f7af10; height:2px; width:0; display:block; margin-left:20px; margin-top:10px; transition:.2s;}
    .baslik .navbar-nav .nav-item span.aktif{height:2px; width:50px;}
    .baslik .navbar-nav .nav-item:hover span{height:2px; width:50px;}
    
.afis{position:relative; z-index:1; margin-top:-148px;}
.banneryaz{position: absolute; width: 1140px; bottom: 20px; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: #fff; text-align: left; left: 50%; top: 48%; transform: translate(-50%, -50%); }
    .banneryaz span{}
    .banneryaz .b-icon{font-size:130px; width:200px; height:200px; border:3px solid #fff;}
        .banneryaz .b-icon i:before{margin:0 .1em !important;}
    .banneryaz .b-abas{display:block; font-size:40px; font-weight:200; color:#fff; margin-top:30px;}
    .banneryaz .b-kbas{display:block; font-size:60px; font-weight:800; color:#f7af10;}
    .banneryaz .b-kyaz{display:block; max-width:350px; font-size:16px; font-weight:300; color:#fff; margin-bottom:40px;}
    .banneryaz .b-dobuton{background:#f7af10; color:#333; font-size:14px; text-transform:uppercase; padding:10px 20px; border-radius:5px; font-weight:800; transition:.2s;}
    .banneryaz .b-dobuton:hover{ padding:10px 50px; background:#fff;}
       .b-ok{position: absolute; top: 0; bottom: 0; z-index: 1; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; width: auto; color: #fff; text-align: center; transition: .2s;}
       .b-ok:hover{text-decoration:none; color:#f7af10;}
        .banneroksol{font-size:50px; left:50px;}
        .banneroksag{font-size:50px; right:50px;}


.anacobanalan{padding:80px 0; background:url('/Assets/images/anacoban.jpg'); background-size:cover;}
    .anacobanbas{font-size:28px; font-weight:300; color:#fff; }
    .anacobanbas span{font-size:48px; font-weight:700; color:#f7af10; line-height:50px;}
    .anacobanyaz{font-size:14px; font-weight:300; color:#fff; }
    .anacobanyaz .b-dobuton{background:#f7af10; color:#333; font-size:14px; text-transform:uppercase; padding:10px 20px; border-radius:5px; font-weight:800; transition:.2s;}
    .anacobanyaz .b-dobuton:hover{ padding:10px 50px; background:#fff;}

.markalaralan{background-image: url('/Assets/images/markalar/markalararka.jpg'); background-size:cover; background-position:center; padding:40px 0;}
    .markalar{padding-bottom:40px;}
        .markadiz{padding:20px !important; transition:.2s;-webkit-filter: grayscale(100%); filter: grayscale(100%);}
        .markadiz:hover{padding:15px !important;-webkit-filter: grayscale(0); filter: grayscale(0)}

        .markaddiz{padding:15px !important; transition:.2s;-webkit-filter: grayscale(100%); filter: grayscale(100%);}
        .markaddiz:hover{-webkit-filter: grayscale(0); filter: grayscale(0)}

            .markadiz a{display:block; border:1px solid #ccc; padding:20px;}
            .markaddiz a{display:block; border:1px solid #ccc; padding:20px;}
        .markayaz{font-size:13px; }
.katalogalan{background:url('/Assets/images/katalogarka.jpg'); background-size:cover; padding:40px 0;}
    .katalogbaslik{font-size:38px; display:block; font-weight:200; color:#f7af10;}
    .katalogyaz{font-size:14px; display:block; font-weight:300; color:#fff;}
.katalogalan .btn{background:#f7af10; color:#000; position:absolute; right:0; top:50%; transform:translateY(-50%); font-size:16px; font-weight:700;}
.katalogalan .btn:hover{background:#fff; color:#000;}
.katalogbil{padding-bottom:10px;}


.anaarka{background:#f0f0f0 url(/Assets/images/arka.png) no-repeat; background-size:contain; background-position:center; padding:50px 0 100px 0;}
    .anabutonlar{padding:0 !important;}
        .anabuts{margin:15px 0;}
            .anabuton{background:#fff; color:#444; overflow:hidden; display:block; padding-top:20px; min-height:220px; transition:.2s; cursor:pointer; margin:0 0 30px 0;}
                .anabuton:hover,.anabutonlar .aktif{background:#2e2e2e; color:#fff;}
                .anabuton:hover .baslik,.anabutonlar .aktif .baslik{color:#fff;}
                    .anabuton .ikon{color:#444; font-size:65px; display:block; color:#f7af10} 
                    .anabuton .baslik{color:#444; font-size:12px; display:block; padding-left:15px; transition:.2s; font-weight:500;}

    .anayaz{overflow:hidden;}
    .anaacikla{background:#fff; padding:0 !important; height:100%;}
        .anaacikla .baslik{height:98px; color:#444; font-weight:300; font-size:18px;}
            .anaacikla .baslik span.baslikyaz{display:block; float:left; height:98px; line-height:98px;}
            .anaacikla .baslik span.baslikikon{display:block; float:left; height:98px; line-height:98px;}
            .anaacikla .baslik i{height:98px; line-height:98px; font-size:70px; color:#f7af10;}
        .anaacikla .resim{}
            .anaacikla .resim img{width:100%}
            .anaacikla .acikla{padding:30px; font-size:16px;}
            .anaacikla .hizmetdevami{padding: 0 30px;}
                .hizmetdevami a{padding:10px 20px; border-radius:5px; font-weight:600; color:#000; font-size:14px; background:#f7af10; transition:.2s;}
                .hizmetdevami a:hover{color:#000; font-size:14px; background:#ccc;}

    .anailetisim{background:#000; margin-top:-50px;}
        .anailetisim .row{padding:30px;}
        .anailetisim .tel{display:inline-block; color:#fff; font-size:22px; padding:15px 0;}
        .anailetisim .bizeulasin{display:inline-block; color:#fff; font-size:14px; margin-left:40px;}
        .anailetisim .bizeulasin strong{color:#f7af10; font-size:14px;}
        .anailetisim span i{font-size:50px; color:#f7af10;}

    .spbas{padding:60px 0 0 0;}
        .spikon{font-size:80px; color:#f7af10; }
        .spbaslik{font-size:24px; color:#222; font-weight:600;}
        .spyaz{margin:15px 0 0 0; font-size:16px; color:#222;}
            .oklar{margin:45px 0 0 0}
            .oklar a{display:inline-block; border-radius:5px; padding:7px 15px; color:#fff; transition:.2s;}
            .oklar .sol{background:#ccc;}
            .oklar .sag{background:#f7af10;}
            .oklar .sol:hover{background:#f7af10; color:#fff;}
            .oklar .sag:hover{background:#ccc; color:#fff;}

    .sonprojeler{margin:50px 0 100px 0; overflow:hidden;}
        .spdiz{padding:60px 0 0 0;}
            .sonprojeler .projebaslik{bottom:0px; z-index:1;}
                .sonprojeler .projeadi{display:block; font-weight:600; font-size:22px; text-align:left; color:#222;}
                .sonprojeler .projenitelik{display:block; font-weight:300; font-size:14px; letter-spacing:2px; text-align:left; color:#999; transition:.2s;}
            .sonprojeler .projeres{height:392px; max-height:392px; bottom:0px; z-index:9; transition:.2s; -webkit-filter: grayscale(100%); filter: grayscale(100%); transition:.4s; overflow:hidden;}
            .sonprojeler .projeres img{height:100%; width:auto;}
            .sonprojeler .spa{}
            .sonprojeler .spa:hover .projeres{margin-top:-70px; z-index:9; -webkit-filter: grayscale(0); filter: grayscale(0);}
            .sonprojeler .spa:hover .projeadi{color:#222;}
            .sonprojeler .spa:hover .projenitelik{color:#999;}
                 .suok{font-size:45px; color:#000}

        .projediz{margin-bottom:25px;}
        .projediz:hover .projeres{-webkit-filter: grayscale(0); filter: grayscale(0);}
        .projediz .projeres{overflow:hidden; display:block; height:300px; max-height:300px; transition:.2s; -webkit-filter: grayscale(100%); filter: grayscale(100%); transition:.4s; display:flex;}
        .projediz .projerestaban{overflow:hidden; display:block; height:100%; width:100%;}
        .projediz .projeres img{height:100%; width:auto;}
        .projediz .projeadi{display:block; font-weight:600; font-size:22px; text-align:left; color:#222;}
        .projediz .projenitelik{display:block; font-weight:300; font-size:14px; letter-spacing:2px; text-align:left; color:#999; transition:.2s; margin:15px 0 0 0;}
        .projeler{padding:15px;}
                .pblokbaslik{color:#444;  margin:15px;}
                .projeresdiz{margin-top:15px; margin-bottom:15px; height:350px; overflow:hidden;}
                .projeresdiz a{ height:350px; -webkit-filter: grayscale(100%); filter: grayscale(100%); transition:.4s; overflow:hidden; display:block; text-align:center; background:#ccc;}
                .projeresdiz a:hover{-webkit-filter: grayscale(0); filter: grayscale(0); border-radius:10px; }
                .projeresdiz img{width:auto; height:100%;}
/*İç Sayfa*/
.icbanner{ background-size:cover; height:470px; position:relative; z-index:1; margin-top:-148px;}
    .icbanner .container{height:100%;}
        .icbanner .container .row{height:100%; position:relative;}
            .icbanneryaz{position: absolute; width: 100%; z-index: 10; padding:15px; color: #fff; text-align: left; left: 50%; top: 60%; transform: translate(-50%, -50%);}
            .ibminibaslik{font-size:14px; color:#f7af10; font-weight:300; letter-spacing:2px;}
            .ibbaslik{font-size:32px; font-weight:600; text-transform:capitalize;}
                .iibcizgi{padding:0}
                .ibcizgi span{height:2px; width:80px; background:#f7af10; display:block;}

.icerik{padding:50px 0; background:#f0f0f0 !important;}
    .icerikblok{background:#fff; /*-webkit-box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1); box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1);*/}    
    .ib2{margin-top:30px; background:url('/Assets/images/icbanner.jpg'); background-size:cover;}    
        .iblokikon{color:#f7af10; font-size:100px; margin-top:40px;}
        .iblokiletisim{color:#444;  margin:40px 15px;}
        .iblokbaslik{color:#444;  margin:0 15px 15px 15px;}
            .ibbasilk{margin-top:40px !important;}
        .ibbk{display:block; font-size:12px; color:#f7af10; font-weight:300; letter-spacing:2px;}
        .ibbbu{display:block; font-size:38px; font-weight:800; line-height:48px; text-transform:capitalize;}
        .iblokiletisim .ibbbu{display:block; font-size:24px !important; line-height:28px; font-weight:600; color:#fff;}
        .iblokiletisim .btn{float:right;}
        .iblokyaz{color:#444; font-size:13px; margin:15px 15px 40px 15px;}
        .hizmblokyaz{color:#444; font-size:13px;}
            .iblokyaz input{color:#444; font-size:13px;}
            .iblokyaz textarea{color:#444; font-size:13px; height:120px !important ;}
            .iblokyaz .input-group-text{color:#444; font-size:13px;}
            .iblokyaz .btn{margin:15px 0; font-size:13px;}
    .hakres{min-height:100%; background:url('/Assets/images/hakres.jpg'); background-size:cover;}
    .abic{margin-top:40px;}    



.footer{background:#f7af10; }
    .footer .row{padding:30px 0;}
    .footer .row .footer-logo{text-align:center;}
    .footer .row .footer-copy{text-align:left; color:#222; font-size:12px;}
    .footer .row .footer-copy a{color:#222; font-size:12px; font-weight:600; transition:.2s;}
    .footer .row .footer-copy a:hover{color:#fff;}
    .footer .row .footer-logo img{width:150px;}
    .aabuts{display:none;}
@media (max-width: 1460px) {
    .banneryaz .b-icon{font-size:80px; border:3px solid #fff;}
    .banneryaz .b-abas{display:block; font-size:30px; font-weight:200; color:#fff; margin-top:30px;}
    .banneryaz .b-kbas{display:block; font-size:50px; font-weight:800; color:#f7af10;}
    .banneryaz .b-kyaz{display:block; max-width:350px; font-size:16px; font-weight:300; color:#fff; margin-bottom:40px;}

}

@media (max-width: 1200px) {
    .banneryaz{max-width:900px;}
    .banneryaz .b-icon{font-size:50px; border:3px solid #fff;}
    .banneryaz .b-abas{display:block; font-size:20px; font-weight:200; color:#fff; margin-top:30px;}
    .banneryaz .b-kbas{display:block; font-size:30px; font-weight:800; color:#f7af10;}
    .banneryaz .b-kyaz{display:block; max-width:350px; font-size:12px; font-weight:300; color:#fff; margin-bottom:40px;}
    .tepe{display:none;}
           .salt,.tesisat,.trafo,.kompanzasyon,.ufo{margin:15px 0;}
        .elektrik,.paratoner,.toptan{margin:15px 0;}

}

@media (max-width: 1000px) {
    .banneryaz{display:none !important;}
    .tepe{display:none;}
    .banneroksol, .banneroksag{display:none;}
    .baslik .menudiz{margin-left:0; background:rgba(0,0,0,0.8); padding:20px;}
           .salt,.tesisat,.trafo,.kompanzasyon,.ufo{margin:15px 0;}
        .elektrik,.paratoner,.toptan{margin:15px 0;}
            .banneroksol, .banneroksag{display:none;}
    .baslik .menudiz{margin-left:0; background:rgba(0,0,0,0.8); padding:20px;}
    .abuts{display:none; }
    .aabuts{display:block;}
    .katalogbaslik{font-size:18px;}
    .katalogalan .btn{background:#f7af10; color:#000; position:relative; font-size:16px; font-weight:700;}
    .anacobanbas span{font-size:28px; line-height:30px;}
        .projediz .projeres{padding:0 15px;}
        .projediz .projeadi{padding:0 15px;}
        .projediz .projenitelik{padding:0 15px;}

        .baslik{padding-top:15px;}
            .baslik .navbar-nav .nav-item .nav-link{}
            .baslik .navbar-nav .nav-item span{ margin-top:5px; margin-bottom:15px;}
            .baslik .navbar-nav .nav-item span.aktif{height:2px; width:50px;}
            .baslik .navbar-nav .nav-item:hover span{height:2px; width:50px;}
            .hizmblokyaz{margin-bottom:30px;}
        
            .projeresdiz{height:100px;}
            .markadiz{padding:5px !important;}
            .markaddiz{padding:5px !important;}
    }



