@import url('https://fonts.googleapis.com/css?family=Raleway&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Titillium+Web&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Dancing+Script&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Great+Vibes&subset=latin-ext');
body{
	font-family: 'Raleway', sans-serif;
	font-size:12px;
}

header{           
            // set animation
            -webkit-transition: all 0.4s ease;
            transition: all 0.4s ease;
            position:fixed;
            width:100%;
            z-index:9999;
        }
        header.sticky {
            position: fixed;
            width: 100%;
            text-align: left;
            padding-left: 20px;
            z-index:9999;
            box-shadow: 2px 1px 3px #8f8f8f;
            background-color:#f0f0f0;
        }
        header>.logo{
          margin-left:10%;
          margin-top:1%;
        }
        header.sticky>.logo{
          margin-left:10%;
          margin-top:5px;
            margin-bottom:2px;
        }
        header>.logo>img{
           margin-top:0px;
            // set animation
            -webkit-transition: all 0.4s ease;
            transition: all 0.4s ease;

        }
        header.sticky>.logo>img{
            margin-top:1px;
        }
        header>.navi{
          float:right;
          margin-top:2%;
        }
        header.sticky>.navi{
          margin-top:20px;
        }

        header>.navi>.navbuton{
           
        margin-bottom:5px;
        margin-top:0px;
        text-align:right!important;
        
            // set animation
            -webkit-transition: all 0.4s ease;
            transition: all 0.4s ease;
            float:right!important;
        }
         header.sticky>.navi>.navbuton{
           
        margin-bottom:0px;
        margin-top:0px;
        text-align:right!important;
        }
		
		.navbuton{
  font-size:24px;
  cursor:pointer;
  float:right;
  top:5%;
  right:30%;
}
.overlay {
    height: 0%;
    width: 100%;
    position: fixed;
    z-index: 9999999;
    top: 0;
    left: 0;
    background-color: rgb(35,31,32);
    background-color: rgba(35,31,32, 0.9);
    overflow-y: hidden;
    transition: 0.5s;
}

.overlay-content {
    position: relative;
    top: 25%;
    width: 30%;
	left:35%;
    text-align: center;
	background:#ebebeb;
	border-radius: 100px;
    margin-top: 30px;
}

.overlay a {
    padding: 8px;
    text-decoration: none;
    font-size: 26px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
    color: #f1f1f1;
}

.overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;

    font-size: 60px;
}

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 20;
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper > .container {
  padding-right: 0;
  padding-left: 0;
}
.navbar-wrapper .navbar {
  padding-right: 15px;
  padding-left: 15px;
}
.navbar-wrapper .navbar .container {
  width: auto;
}
input[type=text]{
	width:100%;
	height:30px;
	border:1px solid #CCC;
}
input[type=button]{
	width:100%;
	background:#CCC;
	border:0;
	width:35%;
	margin-left:35%;
	height:30px;
	margin-top:30px;
}
input[type=submit]{
	width:100%;
	background:#CCC;
	border:0;
	width:35%;
	margin-left:35%;
	height:30px;
	margin-top:30px;
}
.modal-body{
	display:table;
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
 	width: 100%;
    height: 100vh;
    overflow:hidden;
	background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */

.carousel .carousel-inner {
    height:100%;    
}
.carousel .carousel-inner img {
    display:block;
    object-fit: cover;
}

.carousel .item {
	display: run-in;
	width: 100%;
	height: auto!important;
}


.navbar-inverse{
	background:none;
	border:none;
}
.navbar-brand img{
	height:170px;
}
.navbar-nav{
	margin-top:40px;
}
.navbar-inverse .navbar-nav>li>a{
	color:#FFF;
}

.slogan{
	font-family: 'Great Vibes', cursive;
	font-size:30px;
}

.bordobar{
	background:#992134;
	color:#FFF;
	margin-top:10px;
	padding-top:10px;
	padding-bottom:10px;
}

.bordobar .iletisim{
	text-align:center;
}
.footerbar{
	position:absolute;
	z-index:99999;
	bottom:0;
	width:100%;
	color:#FFF;
	padding-top:10px;
	padding-bottom:10px;
}
.footerbar .copyright{
	margin-top:30px;
	text-align:right;
}

.urun{
	margin-bottom:30px;
	text-align:center;
}
.urun img{
	text-align:center;
}
.urun .urunkodu .model {
	font-size:11px;
	padding:0;
	margin:0;
	text-align:left;
}
.urun .urunkodu .modelkodu {
	font-size:24px;
	padding:0;
	margin-top:-8px;
	text-align:left;
}
.urun .urunkodu {
	font-family: 'Titillium Web', sans-serif;
    background:#992134;
	color:#FFF;
    z-index: 5;
    position: absolute;
    right: 15px;
    bottom: 0;
    height: 42px;
    padding-top: 2px!important;
    padding-left: 5px!important;
}
#cboxTitle{
	font-family: 'Titillium Web', sans-serif;
	background:#992134;
	padding:5px;
	height: 42px;
	font-size:24px;
	top:-40px;
	color:#FFF;
}
.sayfa{
	min-height:500px;
}
.baslik{
	font-family: 'Titillium Web', sans-serif;
	font-size:24px;
	color:#992134;
	margin-bottom:20px;
}
.aciklama{
	font-family: 'Titillium Web', sans-serif;
	font-size:14px;
}

.navbar-toggle{
	margin-top:40px;
}
.menu{
	float:right;
}
.sosyal{
	float:left;
	padding:0;
}
.sosyal img{
	width:22px;
}
.yaklastir{
	margin-left:-25px;
}

/* RESPONSIVE CSS
-------------------------------------------------- */

@media (max-width: 768px) {
  /* Navbar positioning foo */
  header>.logo{
	 margin-left:0;
	 margin-top:10px;
  }
  .carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img{
	  height:100vh;
  }
  .navbar-brand img{
	  height:70px;
  }
  .menu{
	  float:left;
  }
  .navbar-nav{
	  margin-top:5px;
	  width:100%;
  }
  .navbar-inverse .navbar-nav>li{
	  width:100%;
	  background:#992134;
	  color:#FFF;
  }
  .navbar-wrapper {
    margin-top: 20px;
  }
  .navbar-wrapper .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .navbar-wrapper .navbar {
    padding-right: 0;
    padding-left: 0;
  }

  /* The navbar becomes detached from the top, so we round the corners */
  .navbar-wrapper .navbar {
    border-radius: 4px;
  }
.overlay-content {
    position: relative;
    top: 25%;
    width: 70%;
	left:16%;
    text-align: center;
	background:#ebebeb;
	border-radius: 50px;
    margin-top: 30px;
}
  .carousel {
		padding-top: 0px;
	}


  .featurette-heading {
    font-size: 50px;
  }
}
.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}