html,
body {
  font-family: "DIN", sans-serif;
  background-color: white;
  color: #7f7f7f;
}

.tablo {
  width: 100%;
}

.tablo th,
.tablo td {
  font-family: DINBEK, sans-serif;
  padding: 5px;
  border: 1px solid silver;
  text-align: left;
  vertical-align: center;
  font-size: 14px;
}

.header_img {
  width: 100%;
  height: auto;
}

.urunler_con {
  position: relative;
  width: 100%;
  background: #faf7f0;
}

.urunler_inner {
  position: relative;
  width: 100%;
  max-width: 1300px;
  padding: 30px 20px;
  margin: 30px auto;
  text-align: center;
}

.urunler_con .item {
  display: inline-block;
  width: 260px;
  height: auto;
  margin: 10px 5px;

  vertical-align: top;
}

.urunler_con .item figure {
  padding: 5px;
  display: block;
  background: white;
  border-radius: 6px;
  box-shadow: 0 7px 20px -10px rgba(0, 0, 0, 0.2);
}

.urunler_con .item figure img {
  width: 100%;
  height: auto;
}

.urunler_con .item .baslik {
  display: block;
  width: 100%;
  color: #202945;
  font-size: 16px;
  line-height: 18px;
  padding: 10px 5px;
}

.home_metin {
  font-size: 28px;
  line-height: 32px;
  text-align: center;
  padding: 0 15px;
  margin: 30px auto 20px;
  width: 100%;
  max-width: 660px;
}

@media only screen and (max-width: 480px) {
  .home_metin {
    font-size: 18px;
    line-height: 21px;
  }
}

.content {
  padding: 0 20px;
}

.full {
  display: block;
  width: 100%;
}

.iletisim_con {
  position: relative;
  width: 100%;
  max-width: 760px;
  padding: 30px 20px;
  margin: 0 auto;
}

.iletisim_con a {
  text-decoration: none;
  color: white;
}

.hakkimizda_con {
  position: relative;
  width: 100%;
  max-width: 1100px;
  padding: 40px 20px 30px;
  margin: 0 auto 30px;
  text-align: center;
}

.hakkimizda_con p {
  max-width: 760px;
  margin: 5px auto 20px;
}

.hakkimizda_metin {
  position: relative;
  text-align: center;
  display: block;
  width: 100%;
  font-size: 15px;
  line-height: 18px;
  max-width: 760px;
  padding: 0 15px;
  margin: 5px auto 20px;
}

.haberler_con {
  position: relative;
  width: 100%;
  background: #3b3e45 url(/content/img/back_bokeh3.jpg) no-repeat;
  background-size: cover;
  background-attachment: fixed;
  padding: 80px 10px 100px;
}

.haberler {
  position: relative;
  text-align: center;
  display: block;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto 20px;
}

.haberler .item {
  position: relative;
  display: inline-block;
  width: 250px;
  height: auto;
  margin: 0 10px 20px;
  line-height: 21px;
  margin-top: 85px;
  padding: 10px 10px 20px;
  border-radius: 4px;
  background-color: #3b3e45;
  box-shadow: 0 10px 10px -5px rgba(0, 0, 0, 0.6);
}

.haberler .item .gorsel {
  text-decoration: none;
  color: #fff;
  font-weight: 300;
  display: inline-block;
  text-transform: uppercase;
}

.haberler .item .gorsel span {
  display: inline-block;
  height: 60px;
  overflow: hidden;
}

.haberler .item .gorsel img {
  display: inline-block;
  width: auto;
  height: 330px;
  margin-top: -80px;
  border: 1px solid #54565a;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.6);
  border-radius: 4px;
  margin-bottom: 10px;
}

.haber_detay {
  width: 100%;
  max-width: 550px !important;
  padding: 40px;
  display: none;
  color: #333;
  border-radius: 4px;
  box-shadow: 0 10px 10px -5px rgba(0, 0, 0, 0.6);
}

.haber_detay h3 {
  text-transform: uppercase;
  line-height: 21px;
  font-weight: 700;
}

.haber_detay img {
  margin: 0 20px 20px 0;
  float: left;
}

.hide,
.hidden {
  display: none !important;
}

section {
  position: relative;
  display: block;
  clear: both;
}

header {
  display: block;
  margin: 35px auto;
}

header h1 {
  text-align: center;
  font-size: 18px;
  line-height: 24px;
  font-weight: 300;
}

a {
  text-decoration: none;
}

h1 {
  font-size: 32px;
  line-height: 34px;
  margin: 15px 0;
  font-weight: 700;
}

h2 {
  font-size: 46px;
  line-height: 48px;
  margin-bottom: 30px;
  font-weight: 700;
  color: #e64b38;
  text-align: center;
  text-transform: uppercase;
}

p {
  font-family: DINBEK, sans-serif;
  font-size: 15px;
  line-height: 21px;
  letter-spacing: 1px;
  margin-bottom: 15px;
  color: #7f7f7f;
}

b,
strong {
  font-weight: 700;
}

br {
  height: 20px;
}

hr {
  height: 1px;
  background: silver;
  border: none;
}

.clearfix {
  clear: both;
  width: 100%;
}
.video-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  margin-bottom: 60px;
}
.video-container iframe,
.video-container object,
.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sosyal a {
  display: inline-block;
  width: 26px;
  height: 26px;
  background-image: url(/content/img/icon-sosyal.svg);
  background-size: 130px 26px;
  background-repeat: no-repeat;
  margin: 2px;
  vertical-align: top;
  border-radius: 2px;
}

a.twitter {
  background-position: -26px;
}

a.googleplus {
  background-position: -66px;
}

a.linkedin {
  background-position: -52px;
}

.gizli {
  display: none;
}

.btn {
  position: relative;
  text-decoration: none;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  font-size: 17px;
  padding: 12px 20px;
  margin: 10px 0 !important;
  border-radius: 2px;
  user-select: none;
  -webkit-appearance: none;
}

.btn_grey {
  display: inline-block;
  padding: 10px 20px 8px;
  margin: 10px auto !important;
  color: #e3e3e3;
  font-weight: 700;
  background: #54565a;
  border: 1px solid #e64b38;
  box-shadow: 0 5px 20px -5px rgba(0, 0, 0, 0.9);
}

.btn_grey:hover {
  color: #54565a;
  background: #e3e3e3;
}

.btn_gonder {
  display: inline-block;
  margin: 4px auto !important;
  color: #fff;
  background: #e64b38;
}

.btn_gonder:hover {
  color: #e64b38;
  background: #fff;
  border: 1px solid #e64b38;
}
input,
select,
textarea {
  width: 100%;
  margin: 5px 0;
  padding: 8px 10px 7px;
  font-size: 14px;
  border: 1px solid silver;
  font-family: inherit;
  border-radius: 2px;
  -webkit-appearance: none;
}
input:required:valid {
  background-image: url(/content/img/form-valid.svg);
  background-size: 24px 14px;
  background-position: right center;
  background-repeat: no-repeat;
}

input:focus:invalid {
  background-image: url(/content/img/form-invalid.svg);
  background-size: 24px 14px;
  background-position: right center;
  background-repeat: no-repeat;
  box-shadow: none;
}

input:focus:valid,
textarea:focus:valid {
  outline: none;
  border: 1px solid #18e109;
}

input:focus:invalid,
textarea:focus:invalid {
  outline: none;
  border: 1px solid #f5192f;
}

select {
  background: #54565a url(/content/img/input-select.svg) right center no-repeat;
  background-size: 20px 20px;
  display: inline-block;
  font-weight: 700;
  margin: 10px auto !important;
  padding: 10px 25px 8px 20px;
  border: 1px solid #3b3e45;
  color: #e3e3e3;
  box-shadow: 0 5px 20px -5px rgba(0, 0, 0, 0.9);
}

.form span {
  position: relative;
  display: block;
  z-index: 999;
}

.form span:before {
  padding: 2px 5px;
  display: block;
  position: absolute;
  top: -7px;
  left: 0;
  text-align: center;
  font-size: 12px;
  background-color: #fef4c5;
  border: 1px solid #d4b943;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
}

input:focus:invalid + span:before {
  content: attr(data-error);
}

input:focus:valid + span:before {
  display: none;
}

input:hover + span:before,
textarea:hover + span:before {
  content: attr(title);
}

.uyari {
  font-size: 16px;
  margin: -3px 0 5px;
  color: #ee1b2d;
}

.sonuc {
  color: #189213;
}

@media only screen and (max-width: 768px) {
}

@media only screen and (max-width: 480px) {
  header h1 {
    font-size: 16px;
    line-height: 21px;
  }

  nav .nav_inner .logo {
    height: 35px;
  }

  nav .nav_inner .menu_mobil {
    width: 35px;
    height: 35px;
    background-size: 35px 35px;
  }

  header {
    display: block;
    margin: 15px auto 35px;
  }

  figure {
    margin: 20px auto 50px;
  }

  figure img {
    display: inline-block;
    width: 100%;
    height: auto;
  }
}