@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");
@import url("https://fonts.googleapis.com/css?family=Montserrat");
* { margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; color: #000; text-decoration: none; list-style: none; font-family: "Montserrat"; outline: 0; }

*::-moz-selection { color: #fe0000; }

*::selection { color: #fe0000; }

header { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0 100px; height: 85px; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; background: #fff; }
header .logo { margin-bottom: 10px; width: 210px; }
header .logo img { height: 50px; }
header ul.menu { display: -webkit-box; display: -ms-flexbox; display: flex; margin-left: 60px; z-index: 1; }
header ul.menu li { height: 85px; line-height: 100px; padding: 0 20px; -webkit-transition: all 0.5s; transition: all 0.5s; text-transform: uppercase; position: relative; font-size: 15px; }
header ul.menu li a { display: block; height: 100%; }
header ul.menu li i { font-size: 20px; }
header ul.menu li:hover { background: #013463; }
header ul.menu li:hover ul { display: block; }
header ul.menu li:hover ul li { color: #fff; }
header ul.menu li:hover a { color: #fff; }
header ul.menu li:hover i { color: #fff; }
header ul.menu li ul { display: none; position: absolute; left: 0; top: 85px; }
header ul.menu li ul li { line-height: normal !important; background: #013463; font-size: 13px; height: auto; padding: 15px; text-transform: none; position: relative; }
header ul.menu li ul li:hover { background: #fe0000; }
header ul.menu li ul li:hover ul { display: block !important; }
header ul.menu li ul li ul { display: none !important; left: 160px; top: 0px; }
header ul.menu li ul li ul li { width: 200px; }
header ul.menu .aktif { background: #013463; }
header ul.menu .aktif a, header ul.menu .aktif i { color: #fff; }
header .mail { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; text-align: right; line-height: 100px; height: 85px; font-size: 14px; color: rgba(0, 0, 0, 0.7); }

.header { position: fixed; top: -100%; left: 0; right: 0; height: 50px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition: all 0.5s; transition: all 0.5s; z-index: 3; background: #fff; padding: 0 100px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.header .logo { width: 210px; }
.header .logo img { height: 35px; }
.header .menu { display: -webkit-box; display: -ms-flexbox; display: flex; margin-left: 60px; }
.header .menu li { -webkit-transition: all 0.5s; transition: all 0.5s; height: 50px; line-height: 50px; padding: 0 20px; text-transform: uppercase; font-size: 15px; }
.header .menu li a { display: block; height: 100%; }
.header .menu li i { font-size: 20px; }
.header .menu li:hover { background: #013463; }
.header .menu li:hover a, .header .menu li:hover i { color: #fff; }
.header .menu li ul { display: none; }
.header .menu .aktif { background: #013463; }
.header .menu .aktif a, .header .menu .aktif i { color: #fff; }
.header .mail { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; text-align: right; font-size: 14px; color: rgba(0, 0, 0, 0.6); }

.anasayfa .slider { height: calc(100vh - 85px); position: relative; -webkit-perspective: 100px; perspective: 100px; overflow: hidden; }
.anasayfa .slider .slide { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; -webkit-transition: all 0.5s; transition: all 0.5s; opacity: 0; background-position: center; background-size: cover; }
.anasayfa .slider .slide:nth-child(1) { background-image: url("../img/slider1.jpg"); }
.anasayfa .slider .slide:nth-child(2) { background-image: url("../img/slider2.jpg"); }
.anasayfa .slider .slide:nth-child(3) { background-image: url("../img/slider3.jpg"); }
.anasayfa .slider .slide h1.slogan { color: #fff; position: absolute; bottom: 200px; right: 100px; font-size: 50px; text-shadow: 0 0 20px #000; }
.anasayfa .slider .slide h1.slogan span { font-size: 40px; color: #fff; }
.anasayfa .slider .aktif-slide { z-index: 0; opacity: 1; }
.anasayfa .slider .arac { position: absolute; bottom: 10px; right: 0; left: 0; text-align: center; }
.anasayfa .slider .arac i { color: #fff; padding: 0 2px; cursor: pointer; }

.hakkimizda { padding: 50px 100px; height: calc(100vh - 50px); position: relative; background: rgba(55, 55, 77, 0.5); }
.hakkimizda:after { position: absolute; left: 0; top: 0; z-index: -1; right: 0; bottom: 0; content: ""; display: block; background-image: url("../img/hakkimizda.jpg"); background-size: cover; background-position: center; }
.hakkimizda h1 { text-align: center; margin-bottom: 25px; color: #fff; font-size: 26px; }
.hakkimizda p { width: 770px; color: #fff; margin: auto; text-align: center; font-size: 16px; }
.hakkimizda .yazi { margin-bottom: 150px; }
.hakkimizda .ikon { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; }
.hakkimizda .ikon .item { text-align: center; text-transform: uppercase; font-size: 16px; color: #fff; }
.hakkimizda .ikon i { font-size: 120px; color: #fff; margin-bottom: 25px; -webkit-filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, 0.5)); filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, 0.5)); }
.hakkimizda .ikon img { margin-bottom: 25px; height: 120px; -webkit-filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, 0.5)); filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, 0.5)); }
.hakkimizda .ikon embed { margin-bottom: 25px; height: 120px; -webkit-filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, 0.5)); filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, 0.5)); }

.hizmet { height: calc(100vh - 50px); background-image: url("../img/hakkimizdaa.jpg"); background-size: cover; background-position: center; position: relative; overflow: hidden; -webkit-perspective: 100px; perspective: 100px; }
.hizmet ul.hiz-menu { margin-top: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.hizmet ul.hiz-menu li { color: #fff; cursor: pointer; padding: 0 15px; border-radius: 5px; font-size: 14px; }
.hizmet ul.hiz-menu li:hover { background: #fff; color: #013463; }
.hizmet ul.hiz-menu .aktifli { background: #fff; color: #013463; }
.hizmet ul.hizalt { margin-top: 20px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 12px; }
.hizmet ul.hizalt li { color: #fff; margin-right: 15px; cursor: pointer; padding: 0 15px; border-radius: 5px; }
.hizmet ul.hizalt li:hover { background: #fff; color: #013463; }
.hizmet ul.hizalt li:last-child { margin-right: 0; }
.hizmet .pencere { position: absolute; height: 80%; width: 80%; left: 10%; top: 15%; -webkit-transition: all 0.5s; transition: all 0.5s; -webkit-transform: translate3d(500%, 0, -50px) rotateY(-90deg); transform: translate3d(500%, 0, -50px) rotateY(-90deg); border-radius: 5px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 50px; }
.hizmet .pencere .yazi { text-align: center; }
.hizmet .pencere h1, .hizmet .pencere p { color: #ccc; }
.hizmet .pencere h1 { font-size: 26px; margin-bottom: 20px; }
.hizmet .pencere > div { margin: 25px; }
.hizmet .pencere .medya { -webkit-perspective: 400px; perspective: 400px; }
.hizmet .pencere img { height: 300px; -webkit-transform: rotateY(20deg); transform: rotateY(20deg); -webkit-filter: drop-shadow(0 50px 20px #000); filter: drop-shadow(0 50px 20px #000); }
.hizmet .aktif-pencere { -webkit-transform: translate3d(0, 0, 0) rotateY(0deg); transform: translate3d(0, 0, 0) rotateY(0deg); }

.galeri { height: calc(100vh - 50px); padding-top: 50px; position: relative; background: rgba(55, 55, 77, 0.8); }
.galeri:after { content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: -1; background-image: url("../img/galeri.jpg"); background-size: cover; background-position: center; }
.galeri h1 { color: #fff; font-size: 26px; text-align: center; }
.galeri .ic { margin-top: 50px; padding: 0 100px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.galeri .ic figure { margin: 10px; text-align: center; position: relative; cursor: pointer; overflow: hidden; }
.galeri .ic figure img { height: 120px; display: block; }
.galeri .ic figure:hover figcaption { top: 0; }
.galeri .ic figure figcaption { -webkit-transition: all 0.5s; transition: all 0.5s; font-size: 14px; color: #fff; white-space: normal; position: absolute; top: 100%; bottom: 0; left: 0; right: 0; background: rgba(1, 52, 99, 0.8); padding: 0 15px; text-transform: capitalize; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; overflow: hidden; }

.iletisim { height: calc(100vh - 50px); padding-top: 50px; position: relative; background: rgba(55, 55, 77, 0.8); }
.iletisim h1 { color: #fff; font-size: 26px; text-align: center; }
.iletisim .panel { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; height: 100%; margin-top: 30px; }
.iletisim:after { content: ""; display: block; height: calc(100vh - 50px); position: absolute; top: 0; left: 0; right: 0; z-index: -2; background-image: url("../img/iletisim.jpg"); background-size: cover; background-position: center; }
.iletisim .sol { width: 70%; margin-top: 14px; }
.iletisim .sol .map { height: 390px; width: 100%; }
.iletisim .sag { width: 240px; margin-right: 100px; }
.iletisim .sag i { color: #fff; font-size: 18px; margin-right: 10px; width: 20px; text-align: right; }
.iletisim .sag p { font-size: 14px; white-space: nowrap; padding: 10px; color: #fff; position: relative; padding-bottom: 0; }
.iletisim .sag input, .iletisim .sag textarea, .iletisim .sag button { border: 1px solid rgba(255, 255, 255, 0.2); outline: none; padding: 4px; width: 100%; background: transparent; color: #fff; }
.iletisim .sag textarea { height: 60px; }

.galeri-slide { opacity: 0; position: fixed; top: 0; bottom: 0; right: 0; left: 0; background: rgba(0, 0, 0, 0.9); -webkit-transition: all 0.5s; transition: all 0.5s; padding: 100px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; z-index: -50; }
.galeri-slide .img { width: 800px; height: 600px; background-size: cover; background-position: center; }

.spe { background: #fff; height: 15px; }

footer { background: #000; height: 200px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 100px; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding-top: 30px; position: relative; }
footer li { color: rgba(255, 255, 255, 0.7); font-size: 14px; cursor: pointer; }
footer li a { font-size: 14px; color: rgba(255, 255, 255, 0.7); }
footer img { width: 100px; }
footer #sky { position: absolute; bottom: 10px; left: calc(50% - 50px); opacity: 0.6; }
footer #skf { opacity: 0.8; }

.mobile { display: none; }

@media (max-width: 768px) { header, .header { display: none; }
  .hakkimizda { padding: 50px 10px; height: auto; }
  .hakkimizda .ikon { -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .hakkimizda .ikon .item { margin: 10px; }
  .hakkimizda p { width: 100%; }
  .galeri { height: auto; }
  .galeri .ic { padding: 0 10px; }
  .galeri-slide { display: none; }
  .iletisim { height: auto; padding-bottom: 50px; }
  .iletisim .panel { -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .iletisim .sol { width: 100%; }
  .iletisim .sag { width: 100%; margin-right: 0; }
  footer { height: auto; padding: 25px 10px; padding-bottom: 70px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  footer ul { display: none; }
  footer ul.hiz-menu { display: block; text-align: center; margin-bottom: 20px; }
  footer a img { margin-bottom: 20px; }
  .anasayfa .slider .slide h1.slogan { bottom: 20%; right: 10%; }
  .hizmet ul.hiz-menu, .hizmet ul.hizalt { display: none; }
  .hizmet .pencere { position: relative; -webkit-transform: translate3d(0, 0, 0) rotateY(0deg); transform: translate3d(0, 0, 0) rotateY(0deg); left: 0; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 10px; }
  .hizmet .pencere p { text-align: justify; font-size: 12px; }
  .hizmet .pencere img { -webkit-transform: rotateY(0); transform: rotateY(0); width: 100%; height: auto; }
  .hizmet { height: auto; }
  .mobile { display: block; position: fixed; top: 0; left: 0; right: 0; bottom: 90%; -webkit-transition: all 0.5s; transition: all 0.5s; z-index: 10; overflow: hidden; background: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 20px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; min-height: 70px; }
  .mobile .mail { color: #000; }
  .mobile li, .mobile a, .mobile i { text-align: center; color: #000; }
  .mobile img { height: 40px; margin-bottom: 20px; position: absolute; left: 10px; }
  .mobile i.fa-bars { cursor: pointer; position: absolute; top: 25px; right: 10%; font-size: 30px; }
  .mobile .menu { margin-top: 50px; }
  .mobile .menu li { font-size: 30px; padding-bottom: 10px; }
  .mobile-aktif { bottom: 0; }
  .iletisim .sag { margin-top: 20px; }
  .iletisim .tab { margin-top: 20px; } }