﻿ul, li, body {
margin:0;
padding:0;
list-style-type:none;
}
header{
    width:100%;
    height:auto;
    position:absolute;
    left:0;
    top:0;
    background-color:rgba(0,0,0,0.4);

}


.sticky {
    position: fixed;
    height: 140px!important;
    min-height: 110px;
    top: 0px;
    width: 100%;
    padding: 0px;
    z-index: 10000000000;
    -moz-transition: all 0.30s ease;
    -webkit-transition: all 0.30s ease;
    -o-transition: all 0.30s ease;
 background-color:rgba(0,0,0,0.85);

}

* {
    font-family: 'Montserrat', sans-serif;
    -moz-transition: all 0.50s ease;
    -webkit-transition: all 0.50s ease;
    -o-transition: all 0.50s ease;
}
.navx{
    position:absolute;
    left:0;
    width:100%;
    bottom:30px;
    text-align:center;
}
.navx a{
    display:inline-block;
    height:20px;
    margin-left:3px;
    margin-right:3px;
    background-color:rgba(0, 0, 0, 0.75);
    width:20px;
    border-radius:50px;
    font-size:0.01px;
    color:transparent;
}
.navx .active{
    border:solid 2px #fff;
    background-color:transparent;
}
.navx a:hover{
    background-color:#0f98b4;
}
.ustbant{
    height:35px;
    width:100%;
    float:left;
    background-color:rgba(0,0,0,0.4);
    line-height:35px;
}
.ustbant .telefon{
    float:left;
    line-height:35px;
    color:#fff;
    font-size:13px;
    font-family:'Myriad Pro';
    margin-right:10px;
}
.ustbant .eposta{
    float:left;
    line-height:35px;
    color:#fff;
    font-size:13px;
    font-family:'Myriad Pro';
    margin-right:10px;
}
.headersosyal a{
    height:35px;
    width:35px;
    line-height:35px;
    text-align:center;
    display:block;
    float:left;
    color:#fff;
}
.headersosyal a:hover{
    background-color:#0f98b4;
    color:#fff;
}
* {
    -moz-transition: all 0.50s ease;
    -webkit-transition: all 0.50s ease;
    -o-transition: all 0.50s ease;
}
.headeraltbant{
    height:150px;
}
.Logo{
    width:220px;
    height:auto;
    float:left;
    margin-top:10px;
}
.Logo img{
    max-width:90%;
    height:auto;
    display:block;
}
.mainmenu{
    float:right;
    height:auto;
    margin-top:60px;
}
.mainmenu li{
    float:left;
    display:block;
    border-radius:50px;
    margin-left:5px;
    
}
.mainmenu li a{
    color:#fff;
    text-decoration:none;
    padding-left:15px;
    padding-right:15px;
    width:100%;
    font-size:17px;
    font-family:'Myriad Pro';
    padding-top:7px;
    display:block;
    padding-bottom:4px;

}
.mainmenu li:hover{
    background-color:#0f98b4;
}
.SliderAlan{
    width:100%;
    height:auto;
    float:left;
    background-image:url(../images/sliderbg.jpg);
    background-position:center top;
    background-repeat:no-repeat;
}
.SliderAlan li{
    width:100%;
    overflow:hidden;
}
.SliderAlan li img{
    width:100%;
    height:auto;
}
.Bizkimiz{
    float:left;
    height:auto;
    padding-bottom: 250px;
    padding-top: 250px;
    background-color:#fff;
    width:100%;
    background-image:url(../images/kim.png);
    background-position:right center;
    background-repeat:no-repeat;
}
.Bizkimiz h1{
    font-size:45px;
    margin-bottom:0;
    font-weight:bold;
     font-family:'Myriad Pro';
}
.Bizkimiz h2{
    margin-top:0;
    font-size:40px;
    color:#303030;
    font-weight:normal;
     font-family:'Myriad Pro';

}
.Bizkimiz h2 img{
    height:40px;
}
.Bizkimiz p{
    text-indent:15px;
    width:100%;
    display:block;
    float:left;
    margin-top:20px;
}
.hizmetlerimiz{
    float:left;
    padding-top:160px;
    width:100%;
    height:auto;
    padding-bottom:100px;
    background-image:url(../images/hizmetbg.jpg);
    background-repeat:no-repeat;
    background-size:cover;
}
.hizmetlerimiz h4{
    width:100%;
    text-align:center;
    float:left;
    color:#0f98b4;
     font-family:'Myriad Pro';
     font-size:28px;
}
.hizmetlerimiz h2{
    width:100%;
    text-align:center;
    float:left;
    color:#fff;
     font-family:'Myriad Pro';
     font-size:36px;
     font-weight:normal;
     margin-top:0;
     margin-bottom:30px;
}
.hizbox {
    color:#fff;
    margin-bottom:25px;
    margin-top:25px;
    padding-right:5% !important;
}
.hizresim{
    background-color:#0a83a2;
    border-radius:100px;
    text-align:center;
    height:100px;
    line-height:95px;
    width:100px;
    float:left;
    margin-right:30px;
}
.HizDetay h5{
font-family:'Myriad Pro';
font-weight:bold;
font-size:20px;
margin-bottom:0;
}
.HizDetay p{
font-family:'Myriad Pro';
font-size:14px;
margin-bottom:0;
padding-top:10px;
}
.projeler{
float:left;
padding-top:160px;
width:100%;
height:auto;
padding-bottom:100px;
text-align:center;
background-color:#fff;
}
.projeler h4{
width:100%;
text-align:center;
float:left;
color:#494949;
font-family:'Myriad Pro';
font-size:36px;
font-weight:900;
margin-top:0;
margin-bottom:50px;
}
.proceler{
    width:100%;
    float:left;
    height:50px;
    margin-top:30px;
    margin-bottom:30px;
    text-align:center;
    display:none;
}
#devameden{
    display:block;
}
.proceler li{
    float:none;
    display:inline-block;
    padding-left:20px;
    padding-right:20px;
    line-height:53px;
    font-size:15px;
     font-family:'Myriad Pro';
     cursor:pointer;
}
.proceler .active{
    background-color:#0f98b4;
    color:#fff;
    border-radius:100px;
}

.proceler li:hover{
    background-color:#0f98b4;
    color:#fff;
    border-radius:100px;
}
.projebox{
height:330PX;
width:330PX;
padding:10PX;
background-color:#FFF;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
-moz-box-shadow:    0px 0px 10px 0px rgba(0, 0, 0, 0.25);
box-shadow:         0px 0px 10px 0px rgba(0, 0, 0, 0.25);
transform: rotate(45deg) ;
-webkit-transform: rotate(45deg) ;
-moz-transform: rotate(45deg) ;
-o-transform: rotate(45deg) ;
-ms-transform: rotate(45deg) ;
position:relative;
border:solid 15px #fff;
overflow:hidden;
}
.b1 h1{
height:50px;
width:250px;
text-align:center;
position:absolute;
bottom:50px;
font-size:18px;
background-color:#252525;
color:#fff;
text-align:center;
padding-top:15px;
padding-bottom:15px;
display:inline-block;
left:50%;
margin-left:-125px;
transform: skew(30deg, 0deg) ;
-webkit-transform: skew(30deg, 0deg) ;
-moz-transform: skew(30deg, 0deg) ;
-o-transform: skew(30deg, 0deg) ;
-ms-transform: skew(30deg, 0deg) ;

}
.b1 h1 span{
    transform: skew(-30deg, 0deg) ;
-webkit-transform: skew(-30deg, 0deg) ;
-moz-transform: skew(-30deg, 0deg) ;
-o-transform: skew(-30deg, 0deg) ;
-ms-transform: skew(-30deg, 0deg) ;
display:block;
}
.projebox .presim{
-webkit-transform: rotate(-45deg) ;
-moz-transform: rotate(-45deg) ;
-o-transform: rotate(-45deg) ;
-ms-transform: rotate(-45deg) ;
width: 150%;
position: absolute;
left: -25%;
top: -25%;
padding:10px;
}
.presim img{
    width:100%;
}
.b1{
position:relative;
text-align:center;
height:430PX;
width:330PX;
float:none;
cursor:pointer;
opacity:0.7;
z-index:3;
zoom:0.8;
display:inline-block;
}
.b1:nth-child(even) {
   z-index:500;
   opacity:1;
   zoom:1;
 top:40px;
}
.b1:hover{
    opacity:0.9;
}
.group1 div{
-webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    width: 150%;
    position: absolute;
    left: -25%;
    top: -25%;
 
    padding: 10px;
    height:380px;
}
.projegalerisi .group1{
 
height:253px;
overflow:hidden;
position:relative;
border:solid 10px #fff;
 
margin-bottom:115px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
}

.group1 div img{
    width:100%;
    opacity:0.7;
}
.projegalerisi {
    padding-left: 5% !important;
    width: 100%;
    padding-right: 5% !important;
    float: left;
    display:none;
}
.projegalerisi .group1 span{
position:absolute;
bottom:180px;
left:0;
z-index:500000;
 
font-family:'Myriad Pro';
color:#fff;
font-weight:bold;
font-size:20px;
width:100%;
text-shadow:-2px 4px 5px #000000;
text-align:center;
}
.katalogbtn{
    display:block;
    float:right;
    height:50px;
    line-height:53px;
    border-radius:50px;
    color:#fff;
font-family:'Myriad Pro';
    font-weight:bold;
    background-color:#bc2e3a;
    padding-left:25px;
    padding-right:25px;
    margin-top:90px;
}
.katalogbtn:hover{
    background-color:#0f98b4;
    text-decoration:none;
    color:#fff;
}
.projegalerisi .group1:hover img{
    opacity:0.9;
}
 .basinda{
     float:left;
     width:100%;
     height:auto;
     padding-top:70px;
     padding-bottom:100px;
     background-image:url(../images/basinda.jpg);
     background-position:center top;
     background-repeat:no-repeat;
     background-size:cover;
     position:relative;
 }
 .basinda h4{
     width: 100%;
    text-align: center;
    float: left;
    color: #0f98b4;
    font-family: 'Myriad Pro';
    font-size: 28px;
 }
 .basinda h2 {
    width: 100%;
    text-align: center;
    float: left;
    color: #fff;
    font-family: 'Myriad Pro';
    font-size: 36px;
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 30px;
}
 .haberalani{
     float:none !important;
     margin-left:auto;
     margin-right:auto;
     position:relative;
     color:#fff;
     padding-left:0 !important;
     padding-right:0 !important;
    font-family: 'Myriad Pro';

 }
  .haberalani li:before{
content:url(../images/den.png);
display:block;float:left;
    top: -3px;
    position: absolute;
    left: -5px;
  }
    .haberalani li p{
        padding-left:75px;
    }
  .haberalani li{
      font-size:15px;
      line-height:24px;
  }
    .haberalani li strong{
        display:block;
        width:100%;
        float:left;
        margin-top:10px;
        font-weight:bold;
         padding-left:75px;
    }
    .navs{
        width:100%;
        text-align:center;
        margin-top:30px;
        float:left;
    }
    .navs a{
        height:20px;
        width:20px;
        display:inline-block;
        transform: rotate(45deg) ;
-webkit-transform: rotate(45deg) ;
-moz-transform: rotate(45deg) ;
-o-transform: rotate(45deg) ;
-ms-transform: rotate(45deg) ;
overflow:hidden;
position:relative;
cursor:pointer;
margin-left:5px;
margin-right:5px;
background-color:#fff;
font-size:0.01px;
color:transparent;
    }
 .navs a:hover{
     background-color:#0f98b4;
 }
     footer{
         width:100%;
         float:left;
         height:auto;
         padding-top:70px;
         padding-bottom:20px;
         background-image:url(../images/footer.jpg);
         background-position: center top;
         background-repeat:no-repeat;
         margin-top:30px;

     }
     .footerbox iframe{
         width:100%;
         height:250px;
         border:none;
         float:left;
         display:block;
     }
     .footerbox h4{
    font-family: 'Myriad Pro';
         font-size:23px;
         color:#fff;
         font-weight:bold;
         margin-top:0;
         margin-bottom:40px;;
         border-bottom:solid 5px #0f98b4;
         padding-bottom:10px;
                  width:100%;
         float:left;
     }
          .footerbox h5{
    font-family: 'Myriad Pro';
         font-size:23px;
         color:#fff;
         text-align:center;
         width:100%;
         float:left;
         font-weight:bold;
         margin-top:0;
         margin-bottom:0;
         padding-bottom:15px;
     }
          .footerbox > p{
              color:#fff;
              display:block;
              width:90%;
              height:auto;
              line-height:23px;
              font-size:15px;
              font-weight:normal;
              float:left;
    font-family: 'Myriad Pro';

          }
          .sosyallerfooter{
              float:left;
              width:100%;
              height:auto;
              margin-top:20px;
          }
          .sosyallerfooter a{
              height:35px;
              width:35px;
              float:left;
              display:block;
              text-align:center;
              line-height:35px;
              color:#fff;
              text-decoration:none;
          }
          .sosyallerfooter a:hover{
              background-color:#0f98b4;
              color:#fff;
              text-decoration:none;
          }
          .csatir{
              float:left;
              width:100%;
              height:auto;
              margin-top:10px;
          }
          .csatir i{
              color:#fff;
              float:left;
              margin-right:10px;
              margin-top:4px;
          }
          .csatir p{
              color:#fff;
              font-size:14px;
          }
          .siyahbant{
              float:left;
              background-color:#000;
              height:40px;
              line-height:40px;
              text-align:center;
              width:100%;
              margin-top:20px;
          }
          .siyahbant p{
              color:#fff;
              font-size:13px;
          }
          #devamdetay{
              display:block;
          }
          .element{
              width:100%;
              float:left;
              height:auto;
          }
          .projegalerisi .element{
              display:none;
          }
          .projegalerisi .element:first-child{
              display:block;
          }

          .MobilMenu{
              display:none;
          }
          .site{
              float:left;
              width:100%;
              height:auto;
          }
          .MobilAlan{
              display:none;
          }

 /*telefonlar için*/
@media screen and (max-width:719px) and (min-width:220px) {

    .mainmenu{
        display:none;
    }
    .Logo{
        width:180px;
    }
    .headeraltbant{
        height:auto;
        padding-bottom:10px;
    }
    .SliderAlan{
        height:auto;
        margin-top:120px;
    }
    header{
        background-color:#000;
    }

    .SliderAlan ul{
        margin-bottom:0;
    }
    .Bizkimiz{
        background-image:none;
    }
    .Bizkimiz h2, .Bizkimiz h1{
        width:100%;
        text-align:center;
    }
    .Bizkimiz p{
        text-align:center;
        margin-top:0;
    }
    .proceler li{
        padding-left:0;
        margin-left:5px;
        margin-right:5px;
        padding-right:0;
    }
     .proceler li:hover{
         color:#000;
         background-color:transparent;
     }
      .proceler .active{
          background-color:transparent !important;
          color:#000;
          font-weight:bold;
          border-bottom:solid 3px #000;
          border-radius:0;
      }
      .projeler{
          overflow:hidden;
      }
      .projegalerisi{
          padding-left:0;
          padding-right:0;
      }
      .proceler{
          height:auto;
      }
      .projegalerisi .group1 {
    transform: skew(0deg, 0deg);
    -webkit-transform: skew(0deg, 0deg);
    -moz-transform: skew(0deg, 0deg);
    -o-transform: skew(0deg, 0deg);
    -ms-transform: skew(0deg, 0deg);
    height: 200px;
    overflow: hidden;
    position: relative;
    border: solid 10px #fff;
    margin-bottom: 15px;
        margin-bottom: 5px;
    padding-left: 0;
    padding-right: 0;
}
      .group1 div {
    width: 100%;
    background-color: #000;
    transform: skew(0deg, 0deg);
    -webkit-transform: skew(0deg, 0deg);
    -moz-transform: skew(0deg, 0deg);
    -o-transform: skew(0deg, 0deg);
    -ms-transform: skew(0deg, 0deg);
    position: relative;
    z-index: 50;
    left:0;
    top:0;
    height:auto;
}
      .projegalerisi .group1 span {

    transform: skew(0deg, 0deg);
    -webkit-transform: skew(0deg, 0deg);
    -moz-transform: skew(0deg, 0deg);
    -o-transform: skew(0deg, 0deg);
    -ms-transform: skew(0deg, 0deg);
    top: 30%;
}
      footer{
          height:auto;
              background-size: cover;
      }
      .footerbox{
          margin-bottom:20px;
      }

      
          .MobilMenu{
              display:block;
              float:right;
              height:35px;
              width:35px;
              border-radius:4px;
              color:#fff;
              background-color:#0f98b4;
              text-align:center;
              line-height:35px;
              margin-top:22px;

          }
          .MobilAlan{
              display:block;
              position:fixed;
              width:100%;
              height:100%;
              z-index:1;
              background-color:#0f98b4;

          }
          .MobilAlan li{
              width:100%;
              height:auto;
              border-bottom:solid 1px rgba(0,0,0,0.2);
          }
          .MobilAlan li a{
    padding: 15px;
    width: 100%;
    display: block;
    color: #fff;
    font-family: 'Myriad Pro';
    font-weight: bold;
    padding-bottom: 10px;
              
          }
          .site{
              position:relative;
              z-index:2;
          }

          .MobilAlan li a:focus, .MobilAlan li a:active{
              background-color:#fff;
              color:#0f98b4;
              text-decoration:none;
          }
          .kapat{
              float:right;
              display:block;
              height:30px;
              width:30px;
              text-align:center;
              line-height:30px;
              background-color:#d10000;
              color:#fff;
              margin-right:20%;

          }
          .MobilAlan ul{
              margin-top:20px;

          }

    }

