@import url('https://fonts.googleapis.com/css?family=Exo+2:400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&subset=cyrillic,latin-ext');

*{

  font-family: 'Exo 2', Arial, Tahoma;

}



/* REFERANSLAR TASARIM CSS*/

.resimradius{

  box-shadow: 2px 2px 6px #000;

}

.resimradius2{

  box-shadow: 2px 2px 6px #000;

}

.prj_ustecik{

  width: 100%;

  height: 166px;

  position: absolute;

  display: table;

  right: -1px;

  background:rgba(0, 0, 0, 0.51);

  top: -100%;

  transition: all 0.5s; 

  vertical-align: middle !important;

  text-align: center !important;

  font-size: 12px;

}

.prj_ustecik p{ 

  width: 100%;

  display: table-cell;

  vertical-align: middle;

  text-align: center;

  color: #fff;

  font-weight: 500;

  font-family: sans-serif;

}

.projeler_a{

  display: block;

  overflow: hidden;

  position: relative;

  text-decoration: none;



}

.projeler_a:hover .prj_ustecik{

  top: 0%;

  text-decoration: none;



}

.projeler_p{

  color: #fff;  

  padding: 10px; 

  background: #752c7a; 

  margin: 0px;

  height: 40px;

}







/* BANKA HESAPLARIMIZ CSS AYARLARI*/



.banka_resim img{

  height: auto;

  max-width: 130px;

}











/*İLETİŞİM BUTON AYARLARI*/



  .iletisim1{

    border: 1px solid #033b69;

    border-radius: 6px;

    color: #033b69; 

    text-align: center;

    font-size: 20px;

  }

  .iletisim1:hover{

    background: #033b69;

    color: #fff; 

  }

  .iletisim1 a{

    display: block;

    color: #033b69;

    padding: 2px;

  }

  .iletisim1 a:hover{

    color: #fff;

  }

  .iletisim2{

    border: 1px solid #033b69;

    border-radius: 6px;

    color: #033b69; 

    padding: 6px;

  }





  /*Bizimle çalışmak istermini butonu*/



  .kariyer1{

    border: 1px solid #033b69;

    border-radius: 6px;

    color: #033b69; 

    font-weight: bold;

    text-align: center;

    font-size: 20px;

    padding: 6px; 

  }

  .kariyer1:hover{

    background: #033b69;

    color: #fff; 

  }







/*SLİDER CSS AYARLARI CSS BAŞLANGIÇ */



.sliderboyut img{

  height: 280px;

  max-width: 100%;

  min-width: 100%;

  width: 100%;

  padding:0;

}







/* SOSYAL MEDYA İCON AYARLARI CSS*/







  

.sosyalbutonlar1,

.sosyalbutonlar2,

.sosyalbutonlar3{

  display: block;

  position: relative;

  

  

  }

  

.sosyalbutonlar1 a,

.sosyalbutonlar2 a,

.sosyalbutonlar3 a  {

  text-decoration: none;

  color: #FFF;

  width: 40px;

  height: 40px;

  display: inline-block;

  border-radius: 10px;



  font-size: 25px;

  overflow: hidden;

  position: relative;

  line-height: 37px;

  text-align: center;

  transition: transform 0.4s linear 0s, 

   border-top-left-radius 0.1s linear 0s, 

   border-top-right-radius 0.1s linear 0.1s, 

   border-bottom-right-radius 0.1s linear 0.2s, 

   border-bottom-left-radius 0.1s linear 0.3s;

 

   

  }







/*sosyalbutonlar1 ve sosyalbutonlar3  */

 .facebook{

      background-color: #3b5998;

      border: 2px solid #3b5998;

    }

    

.twitter{

      background-color: #00aced;

      border: 2px solid #00aced;

    }

    

.google-plus {

      background-color: #dd4b39;

      border: 2px solid #dd4b39;

    }

    

.instagram {

      background-color: #bc2a8d;

      border: 2px solid #bc2a8d;

    }

    

.linkedin {

      background-color: #007bb6;

      border: 2px solid #007bb6;

    }

    

.youtube {

      background-color: #bb0000;

      border: 2px solid #bb0000;

    }



.sosyalbutonlar1 a:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

}



/*Sosyal Buton2 Kodları */



.sosyalbutonlar2 .facebook  {

 border: 2px solid #3b5998;

 border-radius: 50%; 

 background-color: #752c7a; 

 color: #3b5998;

}





.sosyalbutonlar2 .twitter{

  border: 2px solid #00aced;

  border-radius: 50%;

  background-color: #752c7a;

  color:#00aced;

    }





.sosyalbutonlar2 .google-plus{

  border: 2px solid  #dd4b39;

  border-radius: 50%;

  background-color: #752c7a;

  color: #dd4b39;

    }



.sosyalbutonlar2 .instagram{

  border: 2px solid  #bc2a8d;

  border-radius: 50%;

  background-color: #752c7a;

  color: #bc2a8d;

    }



.sosyalbutonlar2 .linkedin{

 border: 2px solid   #007bb6;

  border-radius: 50%;

  background-color: #752c7a;

  color:  #007bb6;

    }



.sosyalbutonlar2 .youtube{

 border: 2px solid  #bb0000;

  border-radius: 50%;

  background-color: #752c7a;

  color: #bb0000;

    }







.sosyalbutonlar2 .facebook:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color:#3b5998;

 color: #fff;  

}





.sosyalbutonlar2 .twitter:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color:  #00aced; 

 color: #fff;  

}



.sosyalbutonlar2 .google-plus:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: #dd4b39;

 color: #fff;  

}



.sosyalbutonlar2 .instagram:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: #bc2a8d; 

 color: #fff;  

}



.sosyalbutonlar2 .linkedin:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color:#007bb6;

 color: #fff;  

}



.sosyalbutonlar2 .youtube:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: #bb0000; 

 color: #fff;  

}



/*Sosyal Buton3 Hover */

.sosyalbutonlar3 .facebook:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: white; 

 color: #3b5998;  

}





.sosyalbutonlar3 .twitter:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: white; 

 color: #00aced;  

}



.sosyalbutonlar3 .google-plus:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: white; 

 color: #dd4b39;  

}



.sosyalbutonlar3 .instagram:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: white; 

 color: #bc2a8d;  

 

}



.sosyalbutonlar3 .linkedin:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: white; 

 color: #007bb6;  

}



.sosyalbutonlar3 .youtube:hover {

 transform: rotate(360deg);

 border-radius: 50%; 

 background-color: white; 

 color: #bb0000; 

}







/* BLOG- BİZDEN HABERLER CSS AYAR*/





.makalearka{

  background: #ededed;

  box-shadow: 1px 2px 3px #000;

}

.detayarka{

  background: #fff;

}

.makale-baslik p{

  color: #000;

  font-family: 'Oswald', sans-serif;

  font-size: 22px;

  overflow: hidden;

  -webkit-line-clamp: 4;

  -webkit-box-orient: vertical;

  text-overflow: ellipsis;

    display: -webkit-box;



}

.makale-baslik p:hover{

color: #EC8928;

}







.detay_baslik{

  background: #00aae3;

  color: #fff;

  text-align: center;

  font-family: 'Oswald', sans-serif;

  padding: 5px 5px;



}







/* BAYİ HESABI MENU VE HESABIM PROFİL CSS AYARLARI */









nav.ustmenu1 ul{

  list-style: none;

  margin: 0;

  padding: 0;

  overflow: hidden;

  

}



nav.ustmenu1 ul li{



  background: rgb(117, 44, 122);

  margin-bottom: 1px; 

}





nav.ustmenu1 ul li a{

  color: #e2790d;

  font-weight: bold;

  text-decoration: none;

  font-size: 15px;

  padding: 13px 15px;

  display: inline-block;

  width: 100%;

}



nav.ustmenu1 ul li a:hover{

  background-color: #0000004d;

  color: #fff;

  font-weight: bold;

  transition-duration: 0.7s;

  /*background-image: url("../images/menu2.png");*/

}

nav.ustmenu1 ul li ul{

  display: none;

  position: absolute;

  background: #8a8a8a;

}

nav.ustmenu1 ul li:hover ul{

  display: block;

}

nav.ustmenu ul li ul li{

  float: inherit;

  display: block;

}



nav.ustmenu1 ul a.ikon1{

  display: none;



}

/*

.menuayar1{

  width: 20%;

  min-height: 80px;



}

.menuayar1 a{

  width: 100%;

  min-height: 80px;

  line-height: 54px;

}

*/

@media screen and (min-width:800px){

  .mt65{

    margin-top: 65px;

  }

}

@media screen and (max-width:800px){

  nav.ustmenu1 ul li a{display: none;}

  nav.ustmenu1 ul li a.active{display: block;}

  nav.ustmenu1 ul a.ikon1{display: inline-block;float: left;}

}

@media screen and (max-width: 800px){

  nav.ustmenu1.mobil1{position: relative;}

  nav.ustmenu1.mobil1 ul a.ikon1{position: absolute;top:3px;right:5px;}

  nav.ustmenu1.mobil1 ul li {float: none;display: block;}

  nav.ustmenu1.mobil1 ul li a {display: block;text-align: left;}

  nav.ustmenu1.mobil1 ul li{background-image: url("../images/menu.png");margin-bottom: 1px;}

}





@media(min-width:768px){

.haber_resimayari{

  height: 250px;

}

}

@media(max-width: 768px) and (min-width: 480px) {

.haber_resimayari{

  height: 400px;

}

}

@media (max-width:480px){

.haber_resimayari{

  height: 350px;

}

}

 .bilgikutusu {

      border-style: solid;

      border-width: 2px;

      border-color: #d8d8d8;

   }



 .bilgikutusu:hover{

     

      border-width: 2px;

      border-color: #000000;

   }





.hstil1{

  background: #0066CC;

  font-size: 60px; color: #fff; 

  

}

.hstil1:hover{

  background: #3023f1;

  font-size: 60px; color: #fff;

  

}

.hstil2{

  background: #420ea9;

  font-size: 60px; color: #fff;

}

.hstil2:hover{

  background: #2b0771;

  font-size: 60px; color: #fff;   

}

.hstil3{

  background: #09771c;

  font-size: 60px; color: #fff;

}

.hstil3:hover{

  background: #054c11;

  font-size: 60px; color: #fff;   

}

.hstil4{

  background: #b57f07;

  font-size: 60px; color: #fff;

}

.hstil4:hover{

  background: #845d06;

  font-size: 60px; color: #fff;   

}



.hstil5{

  background: #c3c2c2;

  color: black;

}

.hstild{

  background: #ce1a2a;

}

 .hstild2{

  background: #fff;

  box-shadow: 1px 1px 2px #000;

 }

 .detay{

  background: #eab00c;

  height: 4px;

}

 .detay1{

  background: #fff;

 }

  .detay2{

  background: #06c739;

  height: 7px;

}

 .detay3{

  background: #fff;

 }



   .detay4{

  background: #d41019;

  height: 7px;

}

 .detay5{

  background: #fff;

 }

.stil7{

  background: rgb(117, 44, 122);

  height: 48px;

  line-height: 48px;

  color: #e6c626;

  font-weight: bold;

}





/* BAYİLERİMİZ SAYFASI CSS AYARLARI*/



      .bayiler ul{

        list-style-type: none;



      }

      .bayiler ul li{



        padding: 10px 20px;

        margin: 6px 0px;

        font-size: 14px;

        box-shadow: 1px 2px 3px #000;

        border-radius: 8px;

        background:#F4F8FC; 

      } 

      .bayiler{

        display: flex;

      }

      .bayi_baslik{

       border-radius: 5px;

     }