/* header background images */

section.homepage {
 /* The image used */
 /* background-image: url("assets/img/header-bg.jpg");*/

width: 100%;
height: 100vh;
  
text-align:center !important;


  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* for pages without image header */
.padding-top {
padding-top: 0px;
}

.ribbon{
position:relative;
z-index:0;
}

.banner ul.kf-slider {
  list-style: none;
  margin: 0;
  padding: 0;
}
.banner ul.kf-slider li {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  opacity:0;
  
  animation: fade-out 24s infinite;
  background-image: url(assets/img/tailoring.jpg);


  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;

}

.banner ul.kf-slider li:nth-child(2) {
  background-image: url(assets/img/alterations.jpg);

  animation-delay: 8s;
}
.banner ul.kf-slider li:nth-child(3) {
  background-image: url(assets/img/repairs.jpg);
  animation-delay: 16s;
}
@keyframes fade-out {
  0% {opacity: 0;}
  8.333%{opacity:1}
  33.333%{opacity:1}
  41.666% {opacity: 0;}
}



/* Container holding the image and the text */
.homepage {
  position: relative;
  text-align: center;
  color: white;
}

/* Bottom  */
.bottom {
  position: absolute;
  bottom: 8px;
left: 20%;
right:20%;
}

/* Centered text HEADER */
.homepage .centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


@media only screen and (max-width: 768px) {
.homepage .centered {
  position: absolute;
  top: 30%;
  left: 8%;
  transform: translate(-8%, -8%);
text-align:center;
}

.homepage .centered h1 {
font-size: 42px;
}

.homepage .centered p {
font-size: 18px;
}

.ribbon p a {
color: #ba9858 !important;
text-decoration: none;
font-size: 18px;
}

.ribbon {
text-align:center;
}

#float {
position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
}
}



.parallax-1 {
position: relative;
  /* The image used */
  background-image: url("assets/img/parallax-1.jpg");

  /* Set a specific height */
  min-height: 500px; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.parallax-2 {
position: relative;
  /* The image used */
  background-image: url("assets/img/parallax-2.jpg");

  /* Set a specific height */
  min-height: 500px; 

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Turn off parallax scrolling for tablets and phones */
@media only screen and (max-device-width: 1024px) {
  .parallax, .parallax-2 {
    background-attachment: scroll;
  }
}

/* hidden form field */
form #website {
display:none;
}


/* Floating button */
#float{
	position:fixed;
        /*padding: 15px 15px;
	min-width:60px;
	min-height:60px;*/
	bottom:40px;
	right:40px;
	/*background-color:#424530;
        color: white;
	border: 1px solid #333;
	border-radius:8px;
	text-align:center;*/
	/*box-shadow: 1px 1px 2px #eee;*/
       /* text-decoration:none;*/
        opacity: 0.8;
}

#float:hover {
/*
color:white !important;*/
/*box-shadow: 0px 0px 0px;*/
opacity: 1.0;
}

.bi-star {
margin: 2px;
}




		.cookiealert {
			position: fixed;
			bottom: 0;
			width: 100%;
			padding: 20px;
			margin: 0 !important;
			z-index: 999;
			opacity: 0;
			border-radius: 10px 0 0 0;
			background-color: black;
			transform: translateY(100%);
			transition: all 0.5s ease-out;
			color: #ecf0f1;
			text-align: center;
		}
		
		.cookiealert.show {
			opacity: 0.8;
			transform: translateY(0);
			transition-delay: 1s;
		}
		
		.cookiealert a {
			text-decoration: none;
			color: #fff !important;
		}
		
		.cookiealert .acceptcookies {
			margin-left: 10px;
			border-radius: 8px;
			vertical-align: baseline;
		  
		}