.ferris-container {
	padding:120px 0 !important;
}
.ferris-wrapper {
	position:relative;
	display:block;
	width:300px;
	height:300px;
	margin:0 auto;
}
.ferris-wrapper:before {
  content: "";
  height: 200px;
  width: 200px;
  position: absolute;
  border-radius: 50%;
  left: calc(50% - 100px);
  top: calc(50% - 100px);
  z-index: 5;
  background:url('https://psa-relief-as.init1-dev.com/wp-content/uploads/2020/11/relief-logo-1.jpg') no-repeat center center;
  background-size:contain;
  background-color:#ffffff;
	border-radius:100%;
}
.ferris-wrapper:after {
	z-index:3;
	height:150px;
	width:150px;
	margin-left:-75px;
	margin-top:-75px;
	background-image:none;
	background-color:#ffffff;
}

.ferris_wheel ,.wheel {
  border: 4px solid rgba(255,255,255,0.3);
  width: 300px;
  height: 300px;
  border-radius: 50%;
}

.ferris_wheel {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%) scale(1.4, 1.4);
  border: 0;
}

.wheel_wrap {
  position: absolute;
  animation: wheel_rotate 90s infinite linear;
}
.second .wheel_wrap {
  animation: wheel_rotate 75s infinite linear;
}


.wheel span:nth-child(1):before {
  content: "";
  border-bottom: 4px solid rgba(255,255,255,0.3);
  position: absolute;
  top: 0;
  left: 0;
  width: 300px;
  top: 50%;
  left: 6px;
}

.wheel span:nth-child(1):after {
  content: "";
  border-right: 4px solid rgba(255,255,255,0.3);
  position: absolute;
  top: 0;
  left: 0;
  height: 300px;
  left: 50%;
  transform: rotate(-30deg);
}

.wheel span:nth-child(2):before {
  content: "";
  border-right: 4px solid rgba(255,255,255,0.3);
  position: absolute;
  top: 0;
  left: 0;
  height: 300px;
  left: 50%;
  transform: rotate(30deg);
}

/* .wheel span:nth-child(2):after {
  content: "";
  border-right: 3px solid #17386c7a;
  position: absolute;
  top: 0;
  left: 0;
  height: 300px;
  left: 50%;
  transform: rotate(55deg);
}

.wheel span:nth-child(3):before {
  content: "";
  border-right: 3px solid #17386c7a;
  position: absolute;
  top: 0;
  left: 0;
  height: 300px;
  left: 50%;
  transform: rotate(-18deg);
} */


/*2nd Wheel*/
.second .wheel span:before,
.second .wheel span:after{
	display:none;
	border-right:0;
}
.second .wheel span:nth-child(1):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-35deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.second .wheel span:nth-child(2):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-110deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.second .wheel span:nth-child(3):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-180deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.second .wheel span:nth-child(4):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-250deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.second .wheel span:nth-child(5):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-324deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.second .wheel span:nth-child(6):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-220deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.second .wheel span:nth-child(7):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-260deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.second .wheel span:nth-child(8):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-300deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.second .wheel span:nth-child(9):before { content: ""; border-bottom: 0; height:4px; position: absolute; width: 300px; top: 50%; left: 0; display:block; background: rgb(23,56,108);  transform: rotate(-340deg); background:linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}



@keyframes wheel_rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}



.buckets > div {
  position: absolute;
  width:110px;
  animation: bucket_rotate 90s infinite linear;
  top: 50%;
  left: 50%;
  margin-left:-55px;
	margin-top:-55px;
}
.buckets > div.cabin {	
	text-align:center;
    border: 1px solid rgba(0,0,0,0);
	border-radius:50%;
	color:#ffffff;
}

.buckets > div.cabin .img-holder { position:relative; }
.buckets > div.cabin .img-holder img.png {
	position:absolute;
	left:0; top:0;
	z-index:10;
	width:100%;
}
.buckets div img { max-width:100%; border-radius:50%; background:#ffffff; position:relative; z-index:1; -webkit-transition: all 0.34s ease; transition : all 0.34s ease; opacity:1; filter:alpha(opacity=100); }
.buckets div.cabin:hover img { background: rgba(255,255,255,0.6); border: 1px solid #ffffff; }
/* .residential .buckets div.cabin:hover img { background: #1A4993AB; border: 1px solid #2D599DA1; }
.buckets > div.cabin:hover .img-holder img.png { opacity:0; filter:alpha(opacity=0); } */
.buckets div h3 { font-size:1.1em; display:none; line-height:1.1; font-weight:600; font-family:"Roboto"; color:#ffffff; min-height:2.2em; }

.buckets span {
  display: inline-block;
  height: 0;
  width: auto;
  position: relative;
}



@keyframes bucket_rotate {
  0% { 
    transform: rotate(0) translateX(150px) rotate(0); 
  }
  100% { 
    transform: rotate(360deg) translateX(150px) rotate(-360deg); 
  }
}

.buckets div:nth-child(2) {
  animation-delay: -14.9s;
}

.buckets div:nth-child(3) {
  animation-delay: -30s;
}

.buckets div:nth-child(4) {
  animation-delay: -45s;
}

.buckets div:nth-child(5) {
  animation-delay: -60s;
}

.buckets div:nth-child(6) {
  animation-delay: -75s;
}

.buckets div:nth-child(7) {
  animation-delay: -90s;
}

.buckets div:nth-child(8) {
  animation-delay: -105s;
}

.buckets div:nth-child(9) {
  animation-delay: -120s;
}

.buckets div:nth-child(10) {
  animation-delay: -135s;
}

.buckets div:nth-child(11) {
  animation-delay: -150s;
}

.ferris_wheel:hover .wheel_wrap,
.ferris_wheel:hover .buckets div,
.ferris_wheel:hover .buckets > div:before {
	 animation-play-state: paused !important; 
}



/*2nd Commercial Ferris Wheel*/
.second .buckets div:nth-child(2) {
  animation-delay: -14.9s;
}

.second .buckets div:nth-child(3) {
  animation-delay: -30s;
}

.second .buckets div:nth-child(4) {
  animation-delay: -45s;
}

.second .buckets div:nth-child(5) {
  animation-delay: -60s;
}

.second .buckets div:nth-child(6) {
  animation-delay: -75s;
}

.second .buckets div:nth-child(7) {
  animation-delay: -90s;
}

.second .buckets div:nth-child(8) {
  animation-delay: -105s;
}

.second .buckets div:nth-child(9) {
  animation-delay: -120s;
}


.second .buckets > div {
  animation: bucket_rotate 75s infinite linear;
}


#commercial_slick .slick-list { padding:10px 0 !important; }
#commercial_slick .slick-ferris { padding-top:150px; padding-bottom:150px; }
#commercial_slick .btn-prev,
#commercial_slick .btn-next { position:absolute; top:50%; margin-top:-10px; z-index:10; background:transparent; font-size:40px; }
#commercial_slick .btn-prev:hover,
#commercial_slick .btn-next:hover { background:rgba(0,0,0,0.3);}
#commercial_slick .btn-prev { left:0; }
#commercial_slick .btn-next { right:0; }
#commercial_slick button.slick-disabled,
#commercial_slick button.slick-disabled:hover { background:transparent; cursor:default; opacity:0.2; filter:alpha(opacity=20);}



@media only screen and (max-width:767px) {
	.buckets > div {
	  position: absolute;
	  width:65px;
	  margin-left:-32.5px;
		margin-top:-32.5px;
	}
	.ferris-wrapper {
		width:200px;
		height:200px;
	}
	.ferris_wheel, .wheel {
		width: 200px;
		height: 200px;
	}
	.ferris-wrapper:before {
	  height: 150px;
	  width: 150px;
	  left: calc(50% - 75px);
	  top: calc(50% - 75px);
	  background-size:150px 150px;
	}
	.wheel span:nth-child(1):before,
	.wheel span:nth-child(1):after,
	.wheel span:nth-child(2):before,
	.wheel span:nth-child(2):after,
	.wheel span:nth-child(3):before {
	  height: 200px;
	}
	.wheel span:nth-child(1)::before {
		width:200px;
		height:0;
	}

	.second .wheel span:nth-child(1):before,
	.second .wheel span:nth-child(2):before,
	.second .wheel span:nth-child(3):before,
	.second .wheel span:nth-child(4):before,
	.second .wheel span:nth-child(5):before,
	.second .wheel span:nth-child(6):before,
	.second .wheel span:nth-child(7):before,
	.second .wheel span:nth-child(8):before,
	.second .wheel span:nth-child(9):before { width: 200px; }
	
	@keyframes bucket_rotate {
	  0% { 
		transform: rotate(0) translateX(100px) rotate(0); 
	  }
	  100% { 
		transform: rotate(360deg) translateX(100px) rotate(-360deg); 
	  }
	}
	
	#commercial_slick .btn-prev, #commercial_slick .btn-next {
		top:auto;
		bottom:0;
		font-size:30px;
	}
	#commercial_slick .slick-ferris {
		padding-top:110px;
		padding-bottom:120px;
	}
	
}