.onload{
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: white;
    position: fixed;
    z-index: 1000;
    text-align: center;
    transition: visibility 0.3s linear,opacity 0.3s linear;
  }
  
  .onload img{
    width: 40vh;
    margin-top: 35vh;
    z-index: 1001;
  }

body{
    font-family: 'Montserrat', sans-serif;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

button{
    font-family: 'Montserrat', sans-serif;
}

input{
    font-family: 'Montserrat', sans-serif;
}

.baslik{
    position: absolute;
    z-index: 150;
    width: 19vh;
    height: auto;
    left: 91.1%;
    top: 50%;
    padding: 2vh;
    font-size: 2.5vh;
    background-color: #c40005;
    color: white;
    border: none;
    border-top-left-radius: 5vh;
    border-bottom-left-radius: 5vh;
    transition: ease .4s;
    font-weight: 500;
}

.baslik:hover{
    background-color: black;
}

.sosyal{
    position: fixed;
    z-index: 10;
    width: 8vh;
    height: auto;
    background-color: ;
    margin-top: 30vh;
    margin-left: 2vh;
    border: 0.5vh solid white;
}

.sosyal button{
    width: 100%;
    height: 10vh;
    background: none;
    border: transparent;
    font-size: 5vh;
    color: white;
    cursor: pointer;
}

header{
    width: 100%;
    height: 13vh;
    background-color: rgba(0, 0, 0, 0.452);
    position: fixed;
    z-index: 50;
    border-bottom: 0.3vh solid #c40005;
}

header img{
    width: 26vh;
    margin-left: 20vh;
    float: left;
    margin-top: 0.5vh;
}

header p{
    float: left;
    margin-left: 3vh;
    color: white;
    margin-top: 5vh;
    font-size: 2.5vh;
    font-weight: bold;
    cursor: pointer;
    transition: ease .4s;
}

header p:hover{
    color: #c40005;
}

header button{
    transform: skew(-7deg);
    background: #c40005;
    border: 0.3vh solid white;
    color: white;
    transition: ease .4s;
    width: 17vh;
    height: 5vh;
    font-weight: 700;
    font-size: 2.4vh;
    border-top-right-radius: 5vh;
    border-top-left-radius: 0vh;
    border-bottom-left-radius: 5vh;
    border-bottom-right-radius: 0vh;
}

header button:hover{
    border-top-right-radius: 0vh;
    border-top-left-radius: 5vh;
    border-bottom-left-radius: 0vh;
    border-bottom-right-radius: 5vh;
    background-color: #c4000786;
}

.kategori-div{
    float: right;
    margin-right: 20vh;
    margin-top: 4vh;
}

.kategori-div a{
    margin-right: 2vh;
    font-size: 2.5vh;
    color: white;
    font-weight: 500;
    text-decoration: none;
    transition: ease .4s;
}

.kategori-div a:hover{
    color: #c40005;
}

@font-face {
    font-family: 'bancol';
    src: url(bancol.otf);
  }

  .acil{
    color: white;
    font-size: 3vh;
    animation: acil ease infinite 2.5s;
    text-decoration: none;
    margin-top: 4.6vh;
    display: inline-block;
    margin-left: 4vh;
}

@keyframes acil {
    25%{color: #c40005;}
    50%{color: white;}
}

.acil-span{
    font-size: 4vh;
}

.alanlar-div{
    width: 100%;
    height: 80vh;
    background-image: url(alanlar.jpg);
    background-size: cover;
    background-attachment: local;
    text-align: center;
}

.alan{
    width: 22vh;
    height: 28vh;
    background-color: rgba(0, 0, 0, 0.452);
    text-align: center;
    display: inline-table;
    margin-top: 20vh !important;
    margin: 3vh;
    border: 0.3vh solid white;
    border-radius: 3vh;
    transition: ease .4s;
}

.alan-ikon{
    width: 12vh;
    height: 12vh;
    background-color: #c40005;
    color: white;
    font-size: 7vh;
    margin-top: 5vh;
    border-radius: 10vh;
    border: transparent;
    transition: ease .4s;
}

.alan-baslik{
    font-size: 2.5vh;
    color: white;
    font-weight: bold;
    transition: ease .4s;
}

footer{
    background-image: url(footer.jpg);
    background-size: cover;
    background-attachment: local;
    width: 100%;
    height: 60vh;
}

.footer-bilgi{
    width: 50vh;
    position: absolute;
    height: auto;
    background-color: ;
    margin-top: 25vh;
    left: 42%;
}

.footer-bilgi a{
    color: rgb(34, 34, 34);
    text-decoration: none;
    font-size: 2.2vh;
}

.footer-iletisim{
    float: left;
    width: 50%;
    height: 100%;
    background-color: ;
}

.teklif-al{
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: fixed;
    z-index: 102;
    background-color: rgba(0, 0, 0, 0.753);
    transition: visibility 0.3s linear,opacity 0.3s linear;
    visibility: hidden;
    opacity: 0;
    text-align: center;
    overflow: auto;
}

.teklif-header{
    width: 100%;
    height: 15vh;
    background-color: ;
}

.teklif-header button{
    float: right;
    margin-top: 5vh;
    margin-right: 6vh;
    color: red;
    font-size: 3vh;
    background: none;
    border: transparent;
    font-weight: bold;
    cursor: pointer;
}

.teklif-form{
    width: 70vh;
    height: 70vh;
    background-color: rgb(233, 233, 233);
    margin: 0 auto;
    border-radius: 5vh;
    text-align: center;
}

.teklif-form h1{
    color: #c40005;
    padding-top: 3vh;
    font-size: 5vh;
}

.teklif-form input{
    width: 80%;
    padding-right: 3vh;
    padding-left: 3vh;
    height: 7vh;
    margin-top: 2vh;
    background: none;
    border: 0.3vh solid #c40005;
    outline: none;
    font-size: 2.5vh;
    color: #c40005;
    font-weight: 500;
    transition: ease .4s;
    border-radius: 2vh;
}

.teklif-form button{
    width: 87%;
    padding-right: 3vh;
    padding-left: 3vh;
    height: 7vh;
    margin-top: 2vh;
    font-size: 2.5vh;
    color: white;
    background: rgb(34, 34, 34);
    border: transparent;
    border-radius: 2vh;
    transition: ease .4s;
    cursor: pointer;
    font-weight: 700;
}

.teklif-form button:hover{
    background: white;
    color: #c40005;
    border-top-left-radius: 0vh;
    border-top-right-radius: 5vh;
    border-bottom-left-radius: 5vh;
    border-bottom-right-radius: 0vh;
}

.teklif-form input:focus-visible{
    background-color: rgb(34, 34, 34);
}

::placeholder{
    color: rgb(34, 34, 34);
}

.medyada-biz{
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: fixed;
    z-index: 102;
    background-color: rgba(0, 0, 0, 0.753);
    transition: visibility 0.3s linear,opacity 0.3s linear;
    visibility: hidden;
    opacity: 0;
    text-align: center;
    overflow: auto;
}

.medya-header{
    width: 100%;
    height: 15vh;
    background-color: ;
}

.medya-header button{
    float: right;
    margin-top: 5vh;
    margin-right: 6vh;
    color: red;
    font-size: 3vh;
    background: none;
    border: transparent;
    font-weight: bold;
    cursor: pointer;
}

iframe{
    width: 500px;
    height: 350px;
    border-radius: 5vh;
    border: 0.3vh solid white;
    margin: 5vh;
    display: inline-table;
}

video{
    width: 500px;
    height: 350px;
    border-radius: 5vh;
    border: 0.3vh solid white;
    margin: 5vh;
    display: inline-table;
}

li{
    list-style: none;
  }
  
  .slider{
      height: 100vh;
      overflow: hidden;
    z-index: 1;
    position: relative;
    box-shadow: 0vh 0vh 3vh black;

  }
  
  .slider > ul {
    height: 90vh;
  }
  .slider > ul > li{
      height: 100%;
      position: absolute;
      left: 0;
      top: 0;
      opacity: 0;
      z-index: 1;	
        -webkit-transition: all 2000ms ease;
        -moz-transition: all 2000ms ease;
        -ms-transition: all 2000ms ease;
        -o-transition: all 2000ms ease;
        transition: all 2000ms ease;
  }
  .slider > #input-slide-0:checked ~ ul > li.slide-0,
  .slider > #input-slide-1:checked ~ ul > li.slide-1,
  .slider > #input-slide-2:checked ~ ul > li.slide-2,
  .slider > #input-slide-3:checked ~ ul > li.slide-3{
      opacity: 1;
      z-index: 2;
  }
  .slider > ul > li.slide-0{
    background-image: url(slider1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: ;
    position: absolute;
    width: 100%;
    height: 100vh;
    padding: 0;
    margin: 0 auto;
  }
  .slider > ul > li.slide-1{
    background-image: url(slider2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    position: absolute;
    width: 100%;
    height: 100vh;
    padding: 0;
    margin: 0 auto;
  }
  .slider > ul > li.slide-2{
    background-image: url(slider3.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    position: absolute;
    width: 100%;
    height: 100vh;
    padding: 0;
    margin: 0 auto;
  }
  .slider > ul > li.slide-3{
    background-image: url(slider4.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    position: absolute;
    width: 100%;
    height: 100vh;
    padding: 0;
    margin: 0 auto;
  }
  
  .slider > .slider-arrow-prev,
  .slider > .slider-arrow-next {
      position: absolute;
      top: 50%;
      left: 0;
      z-index: 10;
  }
  .slider > .slider-arrow-prev > label,
  .slider > .slider-arrow-next > label {
      position: absolute;
      width: 5vw;
      height: 5vw;
      margin-top: -2.5vw;
      opacity: 0;
      background-size: 100% auto;
      background-position: center;
  
      z-index: -1;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
  }
  .slider > #input-slide-0:checked ~ .slider-arrow-prev > label.slide-3,
  .slider > #input-slide-0:checked ~ .slider-arrow-next > label.slide-1, 
  .slider > #input-slide-1:checked ~ .slider-arrow-prev > label.slide-0,
  .slider > #input-slide-1:checked ~ .slider-arrow-next > label.slide-2, 
  .slider > #input-slide-2:checked ~ .slider-arrow-prev > label.slide-1,
  .slider > #input-slide-2:checked ~ .slider-arrow-next > label.slide-3, 
  .slider > #input-slide-3:checked ~ .slider-arrow-prev > label.slide-2,
  .slider > #input-slide-3:checked ~ .slider-arrow-next > label.slide-0 {
      z-index: 1;
  }
  .slider:hover > .slider-arrow-prev > label,
  .slider:hover > .slider-arrow-next > label{
      opacity: 1;
  }
  .slider > .slider-arrow-prev > label {
      left: 5vw;
      background-image: url(http://panikaro.interiowo.pl/img/arrow-left.png);
  }
  .slider > .slider-arrow-next > label {
      right: 5vw;
      background-image: url(http://panikaro.interiowo.pl/img/arrow-right.png);
  }
  
  .slider > .slider-dot {
      position: relative;
      margin-top: -4vw;
      text-align: center;
      z-index: 300;
      font-size: 0;
  }
  .slider > .slider-dot > label {
      position: relative;
      display: inline-block;
      margin: 1vw 0.5vw;
      width: 1vw;
      height: 1vw;
      border-radius: 50%;
  
      background-color: #FFF;
  }
  .slider > #input-slide-0:checked ~ .slider-dot > label.slide-0,
  .slider > #input-slide-1:checked ~ .slider-dot > label.slide-1,
  .slider > #input-slide-2:checked ~ .slider-dot > label.slide-2,
  .slider > #input-slide-3:checked ~ .slider-dot > label.slide-3 {
      background-color: #c40005;
  }
  .slider > .slider-dot > label:hover{
      background-color: #c40005 !important;
  }
  
  .slider > .slide-description{
      position: absolute;
      width: 50%;
      top: calc(50% - 3vw);
      left: 25%;
      z-index: 200;
  }
  .slider > .slide-description > label{
      position: absolute;
      width: 100%;
      top: 0;	
      left: 0;
    cursor: default;
  
      z-index: 0;
      opacity: 0;
      visibility: hidden;
        -webkit-transition: all 0.75s ease;
        -moz-transition: all 0.75s ease;
        -ms-transition: all 0.75s ease;
        -o-transition: all 0.75s ease;
        transition: all 0.75s ease;	
  }
  .slider > #input-slide-0:checked ~ .slide-description > .slide-0,
  .slider > #input-slide-1:checked ~ .slide-description > .slide-1,
  .slider > #input-slide-2:checked ~ .slide-description > .slide-2,
  .slider > #input-slide-3:checked ~ .slide-description > .slide-3{
      z-index: 2;
      opacity: 1;
      visibility: visible;	
  }
  .slider > .slide-description > label > .text-slide{
      margin: 0 auto;
      line-height: 6vw;
      text-align: center;
  }
  .slider > .slide-description > .slide-0{
    font-family: 'Kumbh Sans', sans-serif;
  }
  .slider > .slide-description > .slide-1{
    font-family: 'Kumbh Sans', sans-serif;
  }
  .slider > .slide-description > .slide-2{
    font-family: 'Kumbh Sans', sans-serif;
  }
  .slider > .slide-description > .slide-3{
    font-family: 'Kumbh Sans', sans-serif;
  }
  
  @-webkit-keyframes slide{
      0%, 100% { opacity: 0; }
      6%, 25% { opacity: 1; z-index: 2; }
      30%, 50% { opacity: 0; z-index: 2; }
  }
  @-moz-keyframes slide{
      0%, 100% { opacity: 0; }
      6%, 24% { opacity: 1; z-index: 2; }
      30%, 50% { opacity: 0; z-index: 2; }
  }
  @-ms-keyframes slide{
      0%, 100% { opacity: 0; }
      6%, 25% { opacity: 1; z-index: 2; }
      30%, 50% { opacity: 0; z-index: 2; }
  }
  @-o-keyframes slide{
      0%, 100% { opacity: 0; }
      6%, 25% { opacity: 1; z-index: 2; }
      30%, 50% { opacity: 0; z-index: 2; }
  }
  @keyframes slide{
      0%, 100% { opacity: 0; }
      6%, 25% { opacity: 1; z-index: 2; }
      30%, 50% { opacity: 0; z-index: 2; }
  }
  .slider > #input-slide-autoplay:checked ~ ul > li.slide-0{
      -webkit-animation: slide 32000ms infinite -2000ms linear;
      -moz-animation: slide 32000ms infinite -2000ms linear;
      -ms-animation: slide 32000ms infinite -2000ms linear;
      -o-animation: slide 32000ms infinite -2000ms linear;
      animation: slide 32000ms infinite -2000ms linear;
  }
  .slider > #input-slide-autoplay:checked ~ ul > li.slide-1{
      -webkit-animation: slide 32000ms infinite 6000ms linear;
      -moz-animation: slide 32000ms infinite 6000ms linear;
      -ms-animation: slide 32000ms infinite 6000ms linear;
      -o-animation: slide 32000ms infinite 6000ms linear;
      animation: slide 32000ms infinite 6000ms linear;	
  }
  .slider > #input-slide-autoplay:checked ~ ul > li.slide-2{
      -webkit-animation: slide 32000ms infinite 14000ms linear;
      -moz-animation: slide 32000ms infinite 14000ms linear;
      -ms-animation: slide 32000ms infinite 14000ms linear;
      -o-animation: slide 32000ms infinite 14000ms linear;
      animation: slide 32000ms infinite 14000ms linear;	
  }
  .slider > #input-slide-autoplay:checked ~ ul > li.slide-3{
      -webkit-animation: slide 32000ms infinite 22000ms linear;
      -moz-animation: slide 32000ms infinite 22000ms linear;
      -ms-animation: slide 32000ms infinite 22000ms linear;
      -o-animation: slide 32000ms infinite 22000ms linear;
      animation: slide 32000ms infinite 22000ms linear;	
  }
  .slider > #input-slide-autoplay:checked ~ ul > li{
      -webkit-transition: none;
      -moz-transition: none;
      -ms-transition: none;
      -o-transition: none;
      transition: none;	
  }
  /* -------------------------------------------------------- autoplay arrow */
  @-webkit-keyframes arrow {
      0%, 24% { z-index: 1; }
      25%, 100% { z-index: -1; }
  }
  @-moz-keyframes arrow {
      0%, 24% { z-index: 1; }
      25%, 100% { z-index: -1; }
  }
  @-ms-keyframes arrow {
      0%, 24% { z-index: 1; }
      25%, 100% { z-index: -1; }
  }
  @-o-keyframes arrow {
      0%, 24% { z-index: 1; }
      25%, 100% { z-index: -1; }
  }
  @keyframes arrow {
      0%, 24% { z-index: 1; }
      25%, 100% { z-index: -1; }
  }
  .slider > #input-slide-autoplay:checked ~ .slider-arrow-prev > label.slide-3,
  .slider > #input-slide-autoplay:checked ~ .slider-arrow-next > label.slide-1{
      -webkit-animation: arrow 32000ms infinite -2000ms;
      -moz-animation: arrow 32000ms infinite -2000ms;
      -ms-animation: arrow 32000ms infinite -2000ms;
      -o-animation: arrow 32000ms infinite -2000ms;
      animation: arrow 32000ms infinite -2000ms;	
  }
  .slider > #input-slide-autoplay:checked ~ .slider-arrow-prev > label.slide-0,
  .slider > #input-slide-autoplay:checked ~ .slider-arrow-next > label.slide-2{
      -webkit-animation: arrow 32000ms infinite 6000ms;
      -moz-animation: arrow 32000ms infinite 6000ms;
      -ms-animation: arrow 32000ms infinite 6000ms;
      -o-animation: arrow 32000ms infinite 6000ms;
      animation: arrow 32000ms infinite 6000ms;	
  }
  .slider > #input-slide-autoplay:checked ~ .slider-arrow-prev > label.slide-1,
  .slider > #input-slide-autoplay:checked ~ .slider-arrow-next > label.slide-3{
      -webkit-animation: arrow 32000ms infinite 14000ms;
      -moz-animation: arrow 32000ms infinite 14000ms;
      -ms-animation: arrow 32000ms infinite 14000ms;
      -o-animation: arrow 32000ms infinite 14000ms;
      animation: arrow 32000ms infinite 14000ms;	
  }
  .slider > #input-slide-autoplay:checked ~ .slider-arrow-prev > label.slide-2,
  .slider > #input-slide-autoplay:checked ~ .slider-arrow-next > label.slide-0{
      -webkit-animation: arrow 32000ms infinite 22000ms;
      -moz-animation: arrow 32000ms infinite 22000ms;
      -ms-animation: arrow 32000ms infinite 22000ms;
      -o-animation: arrow 32000ms infinite 22000ms;
      animation: arrow 32000ms infinite 22000ms;	
  }
  /* -------------------------------------------------------- autoplay dot */
  @-webkit-keyframes dot {
      0%, 24%	{ background-color: #c40005; }
      25%, 100% { background: #FFF; }
  }
  @-moz-keyframes dot {
      0%, 24%	{ background-color: #c40005; }
      25%, 100% { background: #FFF; }
  }
  @-ms-keyframes dot {
      0%, 24%	{ background-color: #c40005; }
      25%, 100% { background: #FFF; }
  }
  @-o-keyframes dot {
      0%, 24%	{ background-color: #c40005; }
      25%, 100% { background: #FFF; }
  }
  @keyframes dot {
      0%, 24%	{ background-color: #c40005; }
      25%, 100% { background: #FFF; }
  }
  .slider > #input-slide-autoplay:checked ~ .slider-dot > label.slide-0{
      -webkit-animation: dot 32000ms infinite -2000ms;
      -moz-animation: dot 32000ms infinite -2000ms;
      -ms-animation: dot 32000ms infinite -2000ms;
      -o-animation: dot 32000ms infinite -2000ms;
      animation: dot 32000ms infinite -2000ms;	
  }
  .slider > #input-slide-autoplay:checked ~ .slider-dot > label.slide-1{
      -webkit-animation: dot 32000ms infinite 6000ms;
      -moz-animation: dot 32000ms infinite 6000ms;
      -ms-animation: dot 32000ms infinite 6000ms;
      -o-animation: dot 32000ms infinite 6000ms;
      animation: dot 32000ms infinite 6000ms;	
  }
  .slider > #input-slide-autoplay:checked ~ .slider-dot > label.slide-2{
      -webkit-animation: dot 32000ms infinite 14000ms;
      -moz-animation: dot 32000ms infinite 14000ms;
      -ms-animation: dot 32000ms infinite 14000ms;
      -o-animation: dot 32000ms infinite 14000ms;
      animation: dot 32000ms infinite 14000ms;	
  }
  .slider > #input-slide-autoplay:checked ~ .slider-dot > label.slide-3{
      -webkit-animation: dot 32000ms infinite 22000ms;
      -moz-animation: dot 32000ms infinite 22000ms;
      -ms-animation: dot 32000ms infinite 22000ms;
      -o-animation: dot 32000ms infinite 22000ms;
      animation: dot 32000ms infinite 22000ms;	
  }
  /* -------------------------------------------------------- autoplay description */
  @-webkit-keyframes description{
      0%, 5% { opacity: 0; z-index: 2; visibility: visible; }
      6%, 24% { opacity: 1; z-index: 2; visibility: visible; }
      25%, 100% { opacity: 0; z-index: 0; visibility: hidden; }
  }
  @-moz-keyframes description{
      0%, 5% { opacity: 0; z-index: 2; visibility: visible; }
      6%, 24% { opacity: 1; z-index: 2; visibility: visible; }
      25%, 100% { opacity: 0; z-index: 0; visibility: hidden; }
  }
  @-ms-keyframes description{
      0%, 5% { opacity: 0; z-index: 2; visibility: visible; }
      6%, 24% { opacity: 1; z-index: 2; visibility: visible; }
      25%, 100% { opacity: 0; z-index: 0; visibility: hidden; }
  }
  @-o-keyframes description{
      0%, 5% { opacity: 0; z-index: 2; visibility: visible; }
      6%, 24% { opacity: 1; z-index: 2; visibility: visible; }
      25%, 100% { opacity: 0; z-index: 0; visibility: hidden; }
  }
  @keyframes description{
      0%, 5% { opacity: 0; z-index: 2; visibility: visible; }
      6%, 24% { opacity: 1; z-index: 2; visibility: visible; }
      25%, 100% { opacity: 0; z-index: 0; visibility: hidden; }
  }
  .slider > #input-slide-autoplay:checked ~ .slide-description > .slide-0{
      -webkit-animation: description 32000ms infinite -2000ms ease;
      -moz-animation: description 32000ms infinite -2000ms ease;
      -ms-animation: description 32000ms infinite -2000ms ease;
      -o-animation: description 32000ms infinite -2000ms ease;
      animation: description 32000ms infinite -2000ms ease;
  }
  .slider > #input-slide-autoplay:checked ~ .slide-description > .slide-1{
      -webkit-animation: description 32000ms infinite 6000ms ease;
      -moz-animation: description 32000ms infinite 6000ms ease;
      -ms-animation: description 32000ms infinite 6000ms ease;
      -o-animation: description 32000ms infinite 6000ms ease;
      animation: description 32000ms infinite 6000ms ease;
  }
  .slider > #input-slide-autoplay:checked ~ .slide-description > .slide-2{
      -webkit-animation: description 32000ms infinite 14000ms ease;
      -moz-animation: description 32000ms infinite 14000ms ease;
      -ms-animation: description 32000ms infinite 14000ms ease;
      -o-animation: description 32000ms infinite 14000ms ease;
      animation: description 32000ms infinite 14000ms ease;
  }
  .slider > #input-slide-autoplay:checked ~ .slide-description > .slide-3{
      -webkit-animation: description 32000ms infinite 22000ms ease;
      -moz-animation: description 32000ms infinite 22000ms ease;
      -ms-animation: description 32000ms infinite 22000ms ease;
      -o-animation: description 32000ms infinite 22000ms ease;
      animation: description 32000ms infinite 22000ms ease;
  }
  .slider > #input-slide-autoplay:checked ~ .slide-description > label{
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none;  	
  }

.teklif-div{
    background-image: url(teklif-banner.jpg);
    background-size: cover;
    background-attachment: local;
    width: 100%;
    height: 80vh;
}

.teklif-div button{
    position: absolute;
    margin-top: 65vh;
    margin-left: 15vh;
    width: 20vh;
    height: 6vh;
    font-weight: 700;
    background: none;
    border: 0.3vh solid #c40005;
    color: #c40005;
    transition: ease .4s;
    cursor: pointer;
}

.teklif-div button:hover{
    background-color: rgb(34, 34, 34);
    color: white;
    border: transparent;
}

.sldr{
    display: none;
}

.sosyal{
    display: block;
}

.m-head{
    display: none;
}

.footer-img{
    display: none;
}

.hemen-ara{
    display: none;
}

/* MOBİL */

@media only screen and (max-width: 1024px){
    header{
        display: none !important;
    }

    .slider{
        display: none;
    }

    .sosyal{
        display: none;
    }

    .m-head{
        display: block;
    }

    .footer-img{
        display: block;
    }

    .hemen-ara{
        display: block;
    }

    .sldr {
        display: block;
        max-height: 100vh;
        max-width: 100%;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        -ms-scroll-snap-type: x mandatory;
            scroll-snap-type: x mandatory;
      }
      
      .slider__slide {
        height: 100vh;
        min-width: 100%;
        width: 100%;
        justify-content: center;
        align-items: center;
        scroll-snap-align: start;
      }
    
      .slider__slide div{
        width: 40vh;
        height: auto;
        background-color: rgba(0, 0, 0, 0.708);
        border-radius: 2vh;
        margin-top: 40vh;
        margin-left: 20vh;
        padding: 5vh;
        transition: ease .4s;
      }
    
      .slider__slide div:hover{
        background-color: rgb(0, 0, 0);
        box-shadow: 0vh 0vh 1vh white;
        border-top-right-radius: 10vh;
        border-bottom-left-radius: 10vh;
      }
    
      .slider__slide .foto2-div{
        margin-left: 150vh;
        margin-top: 25vh;
      }
    
      .slider__slide .foto3-div{
        margin-top: 20vh;
      }
    
      .slider__slide .foto4-div{
        margin-top: 65vh;
        margin-left: 45vh;
        width: 115vh;
        height: 20vh;
      }
    
      .slider__slide .foto5-div{
        margin-left: 150vh;
        margin-top: 20vh;
      }
    
      .slider__slide .foto6-div{
        margin-left: 150vh;
        margin-top: 30vh;
      }
    
      .slider__slide .foto7-div{
        margin-left: 137vh;
        margin-top: 50vh;
      }
    
      .slider__slide .foto8-div{
        margin-top: 68vh;
        margin-left: 25vh;
      }
    
      .slider__slide .foto9-div{
        margin-top: 10vh;
      }
    
      .slider__slide h1{
        font-weight: 800;
        color: #01FF70;
        transition: ease .4s;
        margin-top: -1vh;
      }
    
      .slider__slide h1:hover{
        color: white;
      }
    
      .slider__slide p{
        color: white;
        font-weight: 400;
        font-size: 2.5vh;
        line-height: 3.5vh;
      }
      
      .foto1 {
        background-image: url(/css/mobil1.jpg);
        background-repeat: no-repeat;
        background-size:cover;
      }
      
      .foto2 {
        background-image: url(/css/mobil2.jpg);
        background-repeat: no-repeat;
        background-size:cover;
      }
      
      .foto3 {
        background-image: url(/css/mobil3.jpg);
        background-repeat: no-repeat;
        background-size:cover;
      }
      
      .foto4{
        background-image: url(/css/mobil4.jpg);
        background-repeat: no-repeat;
        background-size:cover;
      }
      
      /* Hide the scrollbar */
      .sldr::-webkit-scrollbar {
        display: none; /* Safari, Google Chrome, Opera,  */
      }
      .sldr {
        -ms-overflow-style: none; /* IE and Edge */
        scrollbar-width: none; /* Firefox */
      }

    .m-head{
        width: 100%;
        height: 15vh;
        background-color: rgba(29, 29, 29, 0.295);
        border-bottom: 0.4vh solid rgba(255, 255, 255, 0.486);
        position: fixed;
    }

    .m-head img{
        width: 25vh;
        float: left;
        margin: 2vh;
    }

    .m-nav{
        float: right;
        background: none;
        border: none;
        outline: none;
        color: white;
        font-size: 5.5vh;
        margin: 4vh;
        transition: ease .4s;
    }

    .m-nav:hover{
        color: red;
    }

    .tanitim-div{
        height: 50vh;
    }

    .tanitim-div img{
        width: 50vh;
    }

    .tanitim-div h1{
        font-size: 4vh;
        padding-right: 3vh;
        padding-left: 3vh;
    }

    .tanitim-div span{
        font-size: 5vh;
    }

    .teklif-div{
        display: none;
    }

    .banner-div{
        display: none;
    }

    .alanlar-div{
        height: auto;
    }

    .alan{
        margin: 2vh;
        margin-top: 10vh !important;
    }

    footer{
        background-image: none;
        background-color: ;
        width: 100%;
        height: 50vh;
    }

    footer img{
        width: 30vh;
        margin: 2vh;
    }
    
    .footer-bilgi{
        width: 45vh;
        position: absolute;
        height: auto;
        background-color: ;
        margin-top: 5vh;
        left: 5%;
    }

    nav{
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        position: fixed;
        z-index: 100;
        background-color: rgba(255, 255, 255, 0.801);
        text-align: center;
        margin-top: 120vh;
        transition: ease .4s;
    }

    nav img{
        width: 30vh !important;
        float: none !important;
        margin-top: 10vh !important;
    }

    nav button{
        width: 35vh;
        height: 7vh;
        margin-top: 2vh;
        background: none;
        border: 0.2vh solid #c40005;
        color: #c40005;
        text-decoration: none;
        font-size: 2vh;
        font-weight: 600;
    }

    nav a{
        color: #c40005;
        text-decoration: none;
        font-size: 2vh;
        font-weight: 600;
    }

    .m-kapat{
        position: absolute;
        left: 85%;
        font-size: 4vh;
        color: red;
    }

    iframe{
        width: 300px;
        height: 200px;
    }
    
    video{
        width: 300px;
        height: 200px;
    }

    .teklif-form{
        width: 40vh;
        height: auto;
        padding: 4vh;
        background-color: rgb(233, 233, 233);
        margin: 0 auto;
        border-radius: 5vh;
        text-align: center;
    }

/* cont baslik */

.cont{
    height: auto;
}

.cont-baslik{
    text-align: center;
    color: white;
    letter-spacing: 1vh;
    font-weight: 300;
    font-size: 5vh;
    margin-top: 25vh;
}

.cont-med{
    width: 80%;
    height: 100%;
    background-color: ;
    margin: 0 auto;
}

.vizyon{
    font-size: 3.5vh;
    color: white;
}

.biz-yapan{
    font-size: 5vh;
    color: #c40005;
    margin-top: -3vh;
    font-weight: 300;
}

.vizyon-ust{
    width: 100%;
    height: 50vh;
    background-color: ;
}

.vizyon-sol{
    float: left;
    background-color: ;
    width: 100%;
    height: 100%;
}

.vizyon-sol h1{
    font-size: 4vh;
    color: #ff0008;
}

.vizyon-sol p{
    color: rgb(219, 219, 219);
    font-size: 2.5vh;
    line-height: 4vh;
    padding-right: 10%;
    font-weight: 500;
}

.vizyon-sag{
    float: right;
    background-color:;
    width: 100%;
    height: 100%;
}

.vizyon-sag h1{
    font-size: 4vh;
    color: #ff0008;
}

.vizyon-sag p{
    color: rgb(219, 219, 219);
    font-size: 2.5vh;
    line-height: 4vh;
    padding-right: 10%;
    font-weight: 500;
}

.vizyon-alt{
    width: 100%;
    height: 50vh;
    background-color: ;
}

.cont-bottom{
    width: 100%;
    height: auto;
    margin: 0  auto;
    background-color: ;
    text-align: center;
    margin-top: 10vh;
}

.cont-bottom button{
    width: 30vh;
    height: 9vh;
    font-size: 3vh;
    background: none;
    color: white;
    border: 0.3vh solid white;
    transition: ease .4s;
    cursor: pointer;
    font-weight: 500;
}

.cont-bottom button:hover{
    background-color: white;
    color: black;
    border-radius: 2vh;
}

.farkimiz-div{
    width: 35vh;
    height: 30vh;
    padding: 2vh;
    background-color: #c4000742;
    border: 0.3vh solid white;
    border-top-right-radius: 20vh;
    border-bottom-left-radius: 20vh;
    transition: ease .4s;
    display: inline-table;
    margin: 2vh;
}

.farkimiz-div h1{
    color: white;
    font-size: 4vh;
}

.farkimiz-div p{
    color: white;
    font-size: 2.4vh;
}

.farkimiz-div:hover{
    border-top-right-radius: 0vh;
    border-bottom-left-radius: 0vh;
    border-top-left-radius: 20vh;
    border-bottom-right-radius: 20vh;
}

#img01{
    width: 50vh;
    z-index: 200;
    margin-top: 20vh;
    border: 1vh solid #8d0321;
}

/* PROJE VER 2 */

.proje-resim-div{
    margin: 0vh;
    margin-right: 0vh;
}

.iletisim-div{
    width: 100%;
    height: auto;
    margin: 0 auto;
    margin-top: 20vh;
    display: inline-block;
}

.iletisim-header{
    display: none;
}

.iletisim-sol{
    width: 100%;
    height: auto;
    background-color: ;
    float: none;
    text-align: center;
}

.iletisim-sol h1{
    font-weight: bolder;
    color: #c40005;
    font-size: 6vh;
}

.iletisim-sol h4{
    margin-top: -3vh;
    font-size: 2.5vh;
    color: rgb(31, 31, 31);
}

.iletisim-sol input{
    width: 75%;
    height: 8vh;
    padding-left: 3vh;
    margin-top: 2vh;
    border: 0.3vh solid rgb(31, 31, 31);
    outline: none;
    font-size: 2.5vh;
}

.iletisim-sol button{
    width: 80%;
    height: 8vh;
    margin-top: 2vh;
    background: none;
    border: 0.3vh solid #c40005;
    color: #c40005;
    font-weight: 500;
    transition: ease .4s;
}

.iletisim-sol button:hover{
    background: #c40005;
    color: white;
}

.iletisim-sag{
    width: 100%;
    height: auto;
    background-color: ;
    float: none;
}

.iletisim-sag h1{
    font-size: 5vh;
    color: #292929;
    padding-left: 10vh;
}

.iletisim-sag p{
    font-size: 2.5vh;
    color: #292929;
    padding-left: 10vh;
    padding-right: 10vh;
}

.iletisim-sag i{
    color: #c40005;
}

.iletisim-harita{
    width: 300px;
    height: 500px;
    display: none;
}

.hemen-ara{
    position: fixed;
    margin-top: 94vh;
    height: 6vh;
    width: 100%;
    background-color: red;
    color: white;
    font-size: 3vh;
    font-weight: 600;
    border: transparent;
    z-index: 200;
    animation: hemenara 3s ease infinite;
}

@keyframes hemenara {
    25%{background-color: red; color: white;}
    50%{background-color: rgb(0, 0, 0); box-shadow: 0vh 0vh 10vh black;}
}

}