/*
Theme Name: Mavigen Digital Agency
Version: 3.0
Description: Designed by <a href="http://www.mavigen.com">Mavigen Digital Agency</a>
Author: Mavigen Digital Agency
Author URI: http://www.mavigen.com
*/

@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900&subset=latin-ext');

body{ margin:0; }

.clearfix { clear:both; }

a { text-decoration:none; }
a:hover { text-decoration:none !important; color: #262626 !important; }

ul{ list-style:none; padding:0; margin:0; }

/************* ÖZEL FONT *************/
body{ font-family: 'Lato', sans-serif; }
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

/************* TRANSITION *************/
.social li,.filter-button:hover,.filter-button{ -webkit-font-smoothing: antialiased; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; -ms-transition: all .3s; transition: all .3s; }

/************* FONT AWESOME *************/
.social li a{ -moz-osx-font-smoothing: grayscale; display: inline-block; font-family: FontAwesome; font-feature-settings: normal; font-kerning: auto; font-language-override: normal; font-size: inherit; font-size-adjust: none; font-stretch: normal; font-style: normal; font-synthesis: weight style; font-variant: normal; font-weight: normal; line-height: 1; text-rendering: auto; transform: translate(0px, 0px); }


/* FW400 Regular */
{ font-weight: 400; }

/* FW600 SemiBold */
{ font-weight: 600; }

/* FW700 Bold */
header .nav >li > a{ font-weight: 700; }

/* FW800 ExtraBold */
h1,
.navbar-toggle { font-weight: 800 !important; }
.shadow{-webkit-box-shadow: 0px 3px 8px -2px rgba(10,3,10,0.67);-moz-box-shadow: 0px 3px 8px -2px rgba(10,3,10,0.67);box-shadow: 0px 3px 8px -2px rgba(10,3,10,0.67);}

/*------------------------- HEADER -------------------------*/
#header{-webkit-transition:all .8s ease;-moz-transition:all .8s ease;-ms-transition:all .8s ease;-o-transition:all .8s ease}
#header.clone{position:fixed;background:#fff;top:0;padding:0;opacity:1;z-index:99999}  
#header.clone{position:fixed;background:#fff;top:-125px;left:0;z-index:9999;padding: 10px 0;opacity:1;}
#header.clone .logo{float:left;margin: 0;position: relative;padding: 0;box-shadow: none !important;}
#header.clone .logo img{height:80px;}
#header.down.clone{top:0}
#header.clone .right .sf-menu{margin: 20px 0 0;}

header{z-index: 10;position:relative;top:0;width:100%;padding: 10px 0;}
header .container{z-index:2;position:relative;}

  header .logo{float:left;margin: 0;position: relative;}
    header .logo img{display:block;}
    header .right{float:right;width:74%;}
    header .right .sf-menu{float:right;margin: 30px 0 0;}
    .menuToggle {color: #fff;background:#28284C;padding: 0 10px;line-height: 40px;font-size: 14px;cursor: pointer;float:right;}
/*---------------------- / END HEADER ----------------------*/
/*------------------------- BANNER -------------------------*/
.bannerArea{overflow: hidden;position: relative;width: 100%;height: 100%;}
.slides>li{ position: relative; } 
.flex-caption{ position: absolute; z-index: 2; text-align: center; color: #fff; font-size: 34px; top: 100%; vertical-align: middle; width: 60% !important; padding: 0; margin: -18% -30% !important; left: 50%; }
.bannerArea table{position:absolute;width: 60%;height:100%;top: 40%;left: 50%;display: block;text-align: center;margin: 0 0 0 -31%;}
.bannerArea h1{color:#fff;text-transform:none;font-size: 46px;font-weight: 600 !important;}
.bannerArea h2{font-size: 50px;font-weight:400;margin:30px 0 40px;color:#fff;text-transform:none;font-weight: 900;}
.bannerArea .arrowdown{position: absolute;text-align: center;bottom: 10%;z-index: 9;width: 100%;}
.bannerArea .arrowdown img{cursor:pointer;}
.bannerArea .button.brown {background: #28284C;}
.bannerArea .button{color:#951630;cursor: pointer;padding: 10px;text-decoration: none;text-transform: uppercase;width: 280px;color: #fff;float: left;margin-right: 10px;font-size: 16px;text-align: center;background: #951630;font-family: 'Open Sans', sans-serif;border: none;box-sizing: border-box;border-radius: 25px;line-height: 30px;font-weight: 600;letter-spacing: 1px;}
.bannerArea .button.brown:hover{color:#951630  !important;background: #FFF;}
/*------------------------- / END BANNER -------------------------*/
/*------------------------- KISA BİLGİ -------------------------*/
.info { width: 100%; height: 380px; background: url(../images/bugday.jpg)no-repeat fixed;position: relative;padding: 100px 0; }
.info:after{position: absolute; bottom:0; content: ""; background: url(../images/infoafter.png) repeat-x; width: 100%; height: 38px; }
.info p{font-size:34px; color:#535353;text-align: center;}
/*------------------------- / END KISA BİLGİ -------------------------*/
/*------------------------- GALLERY -------------------------*/
#gallery {background: #fff;}
.gallery-title{font-size: 26px;color: #1B7D8E;text-align: center;font-weight:bold;margin-bottom: 30px;}
.filter-button{font-size: 16px;border: 1px solid #11B7BF;text-align: center;color: #11B7BF;margin-bottom: 30px; border-radius: 0; padding: 6px 20px;}
.filter-button:hover{font-size: 16px;border: 1px solid #11B7BF;text-align: center;color: #ffffff;background-color: #11B7BF;}
.btn-default:active .filter-button:active{background-color: #11B7BF;color: white;}
.port-image{width: 100%;}
.gallery_product{margin-bottom: 30px;}
.gallery_product .border{ border: 1px solid #11B7C0;}
#gallery .textArea{text-align: center; padding: 10px;}
#gallery .textArea p{margin: 0 0 5px; font-size: 16px;}
#gallery .textArea span{color: #999; font-size: 14px;}
/*------------------------- / END GALLERY -------------------------*/
/*------------------------- CLIENT -------------------------*/
    .clientgorus{ width: 100%; background: url(../images/client.jpg)no-repeat fixed;position: relative;padding: 100px 0; }
    .clientgorus h2{ font-size: 26px; margin: 0 0 55px; position: relative; text-align: center; color: #fff; font-weight: bold; }
    .clientgorus .border{padding: 6px 0 0 0;border:1px solid #11B7C0;width: 138px;height: 138px;border-radius: 100px;margin: 0 auto;}

        .coyuSlide{ text-align: justify;} 
        .coyuSlide .prev i,
        .coyuSlide .next i{font-size: 60px; color: #fff;}
        .coyuSlide .prev{position: absolute;left: 25%;top: 44%;z-index: 999;}
        .coyuSlide .next{position: absolute;right: 25%;top: 44%;z-index: 999;}

        .cySldes li {text-align: center; }
        .cySldes li img{text-align: center; width: 124px; height: 124px; border-radius: 100px;}
        .cySldes li p{ color: #fff; font-size: 14px; line-height: 30px; }
        .cySldes li .name{ color: #11B7BF; font-size: 14px; text-align: center; }
        .cySldes li .unvan{ color: #fff; font-size: 14px; text-align: center; }
/*------------------------- / END CLIENT -------------------------*/
/*-------------------------------------------- FOOTER --------------------------------------------*/
footer{width: 100%; position: relative;background:#ECF0F1;}
  footer .image-overlay{ background: url('../images/bgFooter.jpg') no-repeat left top; height: 630px;padding: 0;}
  footer h1 { color: #33485F; font-size: 1.5em;}
  footer .form { margin: 50px 0 0;}
      .detail {margin-top: 40px;color: #33475F;}
      .detail li {display: block;width:  100%;margin-bottom: 10px;}
      .detail li:first-child {display: block;margin: 0px 0 20px 0;}
      .detail li h2 {font-size: 14px;margin-bottom: 7px;font-weight: bold;}
      .detail li h3 {font-size: 14px;margin: 2px;float:left;font-weight: bold;}
      .detail li p {font-size: 14px;line-height: 22px;}
      .detail li span {font-size: 14px;margin-left: 20px;}

  footer .forms{margin:20px 0 0;position: relative;padding: 0 15px;}
    footer .forms input[type="text"],
    footer .forms input[type="email"]{background: #fff;padding: 0 10px;width: 31.42%;height: 42px;color: #33485F;font-size:14px !important;border: none;font-weight: 700;float: left;}
    footer .forms input[type="email"]{margin: 0!important;}
    
    footer .topForm .adSoyad,
    footer .topForm .ePosta,
    footer .topForm .telefon {margin: 0 15px 20px 0;}
    
    footer .botForm textarea {background: #fff;padding: 10px;height: 120px;border: none;color: #33485F;font-size:14px !important;clear:both;width:100%;font-weight: 700;}
    footer .formw input[type="submit"] {color:#fff;font-size:14px;width: 100px;height: 42px;line-height: 42px;margin: 0 auto;background: #E70000;border:0;display:block;text-align:center;float: left;margin-top: 20px;}
    footer .formw input[type="submit"]:hover {background:#707070; }

  footer .botFooter{background:#232323;width: 100%;padding: 25px 0;position: relative;}
  footer .copyright{float:left;font-size: 14px;color: #fff;line-height:40px;}
    footer .social{margin: 0 auto;display: table;}
    footer .social li,
    footer .social li a{ color: #fff; } 
    footer .social li{font-size: 20px;float: left;margin: 0 0 0 20px;}
  footer .mavigen{float:right; margin:12px 0 0;}
    footer .mavigen img{display:block;height:18px;}
/*-------------------------------------------- / END FOOTER --------------------------------------------*/

@media (max-width: 1440px){
.bannerArea table {width: 80%;margin: 0 0 0 -40%;}
}

@media (max-width: 1024px){
.sf-menu a {padding: 0px 18px;}
.bannerArea table {width: 100%;margin: 0 0 0 -50%;top: 26%;}
footer .forms input[type="text"], footer .forms input[type="email"] {width: 30.9%;}
}

@media (max-width: 990px){
    #header.clone{display: none;} 
    header .sf-menu,
    .sf-menu li{ float: none !important;padding:0}
    .sf-menu{border-top:2px solid #ddd}
    .sf-menu li{border-bottom:1px solid #eee}
    .sf-menu li:last-child{border:none;}
    .sf-menu{ height:auto; padding: 0; margin: 0 0 20px; overflow: hidden; }
    .sf-menu a{ color:#394C54!important;padding:0 10px}
    .sf-menu > li.selected >a{background:#28284C;color:#fff!important}
    .sf-menu > li:hover a{ border-color: transparent; }
    .sf-menu ul li a{ color: #394C54!important;padding:10px 20px }
    .sf-menu ul li.selected a{ color: #3B4446 !important; }
    .sf-menu ul{ display:none !important; position: relative; background: rgba(0,0,0,0.1); box-shadow: none; }
    .sf-menu ul{ left: auto !important; }
    .sf-arrows .sf-with-ul:after{ border-top-color: #fff; }
    .menuToggle{ display: block;float:right; margin-top: 27px;}
    .menuOpen{ height: auto; display: block!important;background:#fff;padding:10px 0 0;margin-top:20px;margin-bottom:0;clear:both;}
    .bannerArea table {top: 32%;}
    .info p {font-size: 28px;}
    footer .image-overlay{display: none;}
    footer .form {margin: 50px 0;}
    footer .forms input[type="text"], footer .forms input[type="email"] {width: 31.8%;}
    footer .copyright {text-align: center;}
    footer .mavigen {margin: 10px auto 0;width: 72px;display: block;float: none;}
}
@media (max-width: 768px){

} 
@media (max-width: 600px){
.bannerArea h2 {font-size: 20px;}
.info p {font-size: 25px;}
.coyuSlide{ text-align: justify;} 
footer .forms input[type="text"], footer .forms input[type="email"] {width: 31.3%;}

}     
@media (max-width: 414px){
.bannerArea table {top: 20%;}
.info p {font-size: 20px;}
footer .forms input[type="text"], footer .forms input[type="email"] {width: 100%;}
footer .botForm textarea {margin-top: 20px;}
header .right{width: 25%;}
#gallery .textArea {padding: 2px;}
.coyuSlide .next{right: 0;}
.coyuSlide .prev{left: 0;}
} 
@media (max-width: 411px){
} 
@media (max-width: 384px){
}
@media (max-width: 375px){
}
@media (max-width: 360px){
}
@media (max-width: 320px){
}

.bgCrumb{ background: #f5f5f5; margin: 0 0 20px; }
.bgCrumb .breadcrumb{ margin: 0; padding-left: 0; padding-right: 0; }
.bgCrumb .breadcrumb a{ color: #262626; }

.subContent { font-size:14px; margin:0 0 30px; min-height: 140px; }

.subContent h1{ font-size: 26px; color: #262626; margin: 0 0 30px; }
    .subContent h1 span{ position: relative; padding: 0 0 8px; }
    .subContent h1 span:before{ width: 60%; height: 1px; bottom: 0; left: 0; background: #000; position: absolute; content: ''; }

.subContent p { margin:0 0 10px 0; color: #262626; font-size: 14px; line-height: 22px; }


.mTo10{ margin-top: 10px; }
.mTo20{ margin-top: 20px; }
.mTo30{ margin-top: 30px; }
.mTo40{ margin-top: 40px; }

.mBo10{ margin-bottom: 10px; }
.mBo20{ margin-bottom: 20px; }
.mBo30{ margin-bottom: 30px; }
.mBo40{ margin-bottom: 40px; }



/*-------------------- İletişim Formu --------------------*/
.tip6 .formText,
.tip6 input[type="submit"]{ font-weight: 700; }

.tip6 input:focus,
.tip6 textarea:focus,
.tip6 select:focus,
.tip6 radio:focus,
.tip6 checkbox:focus{ outline: none !important; box-shadow: none !important; border-color: #555; }

.tip6 input,
.tip6 textarea,
.tip6 select{ border-radius: 0 !important; }

.tip6 textarea,
.tip6 .selectmulti{ height: 110px !important; }

.tip6 input[type="submit"]{ background: #cb5a5e; color: #fff; border:0; padding: 6px 10px; }
    .tip6 input[type="submit"]:hover{ background:#c23f44; }


/*-------------------- Listeleme Sayfası - Başlık + Özet + Resim --------------------*/
    .tip8 ul{ width: 102%; margin-left: -1%; font-size: 12px; }
        .tip8 li .image { padding:3px; border:1px solid #ccc; background:#fff; }    
            .tip8 li a:hover .image{ border-color:#eee; background:#fff; }
            .tip8 li img{ width: 100%; display: block; }
    .tip8 li a{ color: #202020; font-size: 14px; }
    .tip8 li .textArea h2{ margin: 4px 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .tip8 li .textArea p{ margin: 0; font-size: 12px; text-align: justify; }

/*-------------------- Listeleme Sayfası - Başlık + Özet --------------------*/
    .tip2 ul{ width: 100%; font-size: 12px; }
        .tip2 li{ border-bottom: 1px dotted #ddd; }
            .tip2 li:last-child{ border-bottom: none; }
        .tip2 li >a{ display:block; color: #262626; width: 100%; padding:10px 1%; }
            .tip2 li >a:hover { background:#eee; }
        .tip2 li h2{ font-size: 14px; margin: 0 0 5px; font-weight: 700; }
        .tip2 li p{ font-size: 12px; margin: 0; }

/*-------------------- Listeleme Sayfası - Başlık --------------------*/
    .tip7 ul{ width: 100%; font-size: 12px; }
        .tip7 li{ border-bottom: 1px dotted #ddd; }
            .tip7 li:last-child{ border-bottom: none; }
        .tip7 li >a{ display:block; color: #262626; width: 100%; padding:10px 1%; }
            .tip7 li >a:hover { background:#eee; }
        .tip7 li h2{ font-size: 14px; margin: 0 0 5px; font-weight: 700; }


/*-------------------- Dokümanlar --------------------*/
    .tip5 ul{ width: 100%; font-size: 12px; }
        .tip5 li{ border-bottom: 1px dotted #ddd; }
            .tip5 li:last-child{ border-bottom: none; }
        .tip5 li >a{ display:block; color: #262626; width: 100%; padding:10px 1%; }
            .tip5 li >a:hover { background:#eee; }
        .tip5 li h2{ font-size: 14px; margin: 0 0 5px; font-weight: 700; }


/*-------------------- Foto Galeri --------------------*/
    .tip3 ul{ width: 102%; margin-left: -1%; font-size: 12px; }
        .tip3 li{ padding: 8px; }

        .tip3 li >a{ display:block; color: #262626; width: 100%; padding:2px; border:1px solid #ccc; }
            .tip3 li >a:hover { background:#eee; border:1px solid #999; box-shadow:0px 0px 3px #bbb; }
            
        .tip3 li img{ width: 100%; display:block; } 
        .tip3 li h2{ font-size: 14px; margin: 0 0 5px; font-weight: 700; width:100%; padding:6px 3% 2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }


/*-------------------- Video Galeri --------------------*/
    .tip4 ul{ width: 102%; margin-left: -1%; font-size: 12px; }
        .tip4 li{ padding: 8px; text-align: center; }
        .tip4 li >a{ display:block; color: #262626; width: 100%; padding:2px; border:1px solid #ccc; }
            .tip4 li >a:hover { background:#eee; border:1px solid #999; box-shadow:0px 0px 3px #bbb; }
            
        .tip4 li img{ width: 100%; display:block; } 
        .tip4 li h2{ font-size: 14px; margin: 0 0 5px; font-weight: 700; width:100%; padding:6px 3% 2px; }


/*-------------------- Ürün Sayfası --------------------*/
    .tip14 ul{ width: 102%; margin-left: -1%; font-size: 12px; }
        .tip14 li .image { padding:3px; border:1px solid #ccc; background:#fff; }    
            .tip14 li a:hover .image{ border-color:#eee; background:#fff; }
            .tip14 li img{ width: 100%; display: block; }
    .tip14 li a{ color: #202020; font-size: 14px; }
    .tip14 li .textArea h2{ margin: 4px 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .tip14 li .textArea p{ margin: 0; font-size: 12px; text-align: justify; }

/*-------------------- İsim Listesi --------------------*/
    .tip10 ul{ width: 102%; margin-left: -1%; font-size: 12px; }
        .tip10 li .image { padding:3px; border:1px solid #ccc; background:#fff; }    
            .tip10 li a:hover .image{ border-color:#eee; background:#fff; }
            .tip10 li img{ width: 100%; display: block; }
    .tip10 li a{ color: #202020; font-size: 14px; }
    .tip10 li .textArea h2{ margin: 4px 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .tip10 li .textArea p{ margin: 0; font-size: 12px; text-align: justify; }


/*-------------------- Alt Sayfa Listeleme --------------------*/
    .tip0 ul{ width: 102%; margin-left: -1%; font-size: 12px; }
        .tip0 li{ padding-left:5px; padding-right:5px; }

        .tip0 li >a{ display:block; color: #262626; width:99%; float:left; display:inline; padding:0 0 0 4%; line-height:40px; height:40px;font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:12px; color:#495256; font-weight:600;text-decoration:none; border-bottom:1px dotted #ddd; position:relative; }
        .tip0 li >a:hover { color:#216a6e; text-decoration:none }
        .tip0 li >a:before { content:''; width:4%; height:40px; background:url('../images/next.png') no-repeat center 0; position:absolute; left:0; top:0; }
        .tip0 li >a:hover:before { background-position:center -40px; }

            .tip0 li >a:hover { background:#eee; }
        .tip0 li >a>div{ padding:0; }


/*-------------------- Resimli Alt Sayfalar --------------------*/
    .tip12 ul{ width: 102%; margin-left: -1%; font-size: 12px; }
        .tip12 li{ padding: 8px; }
        .tip12 li >a{ display:block; color: #262626; width: 100%; padding:2px; border:1px solid #ccc; }
            .tip12 li >a:hover { background:#eee; border:1px solid #999; box-shadow:0px 0px 3px #bbb; }
            
        .tip12 li img{ width: 100%; display:block; }    
        .tip12 li h2{ font-size: 14px; margin: 0 0 5px; font-weight: 700; width:100%; padding:6px 3% 2px; }


@media (max-width: 992px){ .tip8 li .textArea,.tip10 li .textArea,.tip14 li .textArea{ padding-left: 15px; padding-right: 15px; } }