/*       _________
        d         b
       d           b
      d             b
     d               b
    d                 b
     ''':::.....:::'''
            fff
          .'   '.
         ^       ^.'--.
         b       d     ,
          czzzzzd       ..oOo

	   Amerlux Homepage      
	Written by Weblications */


/* !! MINIFY THIS FILE BEFORE PRODUCTION !! */
.HomeSlide {
	min-height:500px;
	height: 80vh;
	width:100vw;
	/*background-color:green;*/
}
#HSCarousel {
	height:90%;
	width:100%;
}
#HSCarousel .carousel-inner, #HSCarousel .carousel-item {
	height:100%;
	width:100%;
}
#HSCarousel .carousel-item {
	position:relative;
	overflow:hidden;
}
#HSCarousel .carousel-item .item-bg {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background-position:center;
	background-size:cover;
	z-index:1;
}

#HSCarousel .carousel-item .item-textbox {
	position:absolute;
	z-index:2;
	width:45vw;
	min-width: 600px;
	background-color: rgba(255,255,255,0.8);
	display:flex;
	transition: all 0.5s;
}
#HSCarousel .item-textbox .controls {display:none;}
.item-textbox[location$="-top"] {margin-top:5%;}
.item-textbox[location$="-bottom"] {margin-bottom:5%;bottom:0;}

  .item-textbox .box-content {width:80%;padding:2rem;display:flex;flex-direction:column;justify-content:center;}

#HSCarousel .carousel-item .item-textbox .box-content > span {
	font-family: "Poppins", sans-serif;
	display: block;
}

#HSCarousel .carousel-item .item-textbox .title {
	text-transform:uppercase;
	font-weight: 600;
	font-size:22px;
}

#HSCarousel .carousel-item .item-textbox .title {
	font-size:16px;
	line-height:24px;
	max-height:96px;
}


#HSCarousel .carousel-item .item-textbox .link a {
	color:#fba919;
	text-transform:uppercase;
	font-weight: 600;
	font-size:16px;
	margin-bottom:15px;
}

#HSCarousel .carousel-item .item-textbox[location^="left-"] {left:0;margin-left:-45vw;}
#HSCarousel .carousel-item.active .item-textbox[location^="left-"] {margin-left:0;}
#HSCarousel .carousel-item.active .item-textbox[location^="right-"] {margin-right:0;}
#HSCarousel .carousel-item .item-textbox[location^="left-"] .box-content {margin-left:auto;text-align:right;}
#HSCarousel .carousel-item .item-textbox[location^="right-"] {right:0;margin-right:-45vw;}
#HSCarousel .carousel-item .item-textbox[location^="right-"] .box-content {margin-right:auto;text-align:left;}

.HomeSlide .carousel-indicators {
	position:static;
	margin-top:1vh;
}
.HomeSlide .carousel-indicators li {
	height:1.5vh;
	width:1.5vh;
	background-color:#c5c3c3;
	border-radius:50%;
	opacity:1;
}
.HomeSlide .carousel-indicators li.active {background-color:#fba919;}

.textContent {
	text-align:center;
	margin-bottom:2rem;
}
.textContent h1 {font-family:'Playfair Display', serif;font-weight:bold;color:#464646;margin-bottom:3rem;}

.textContent p {max-width:80%;font-family: "Poppins", sans-serif;margin: 0 auto;}
#technologies .row {margin-bottom:3rem;}
#technologies .row > div[class*="col-"] {
	margin-bottom:2rem;
	max-width:100%!important;
	flex:1!important;
}

#technologies .row > div[class*="col-"] .img {
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;
	max-width:100%;
	width:auto;
	height:auto;
	min-height:80px;
}

#technologies .row > div[class*="col-"] p {
	margin-top:1rem;
	text-transform:uppercase;
	font-family: "Poppins", sans-serif;
	font-weight: 300;
	width: 100%;
	font-size: 14.3px;
	text-align: center;
	max-width: 100%;
}

div.tech-hover:hover{
	background-color: #f0f0f0;
}

@media screen and (max-width: 1100px) {
	
	#technologies .row > div[class*="col-"] p {
		font-size: 14px !important;	
	}
	
}

#spotlight .showcasing {margin-top:2rem !important;}

#spotlight .showcasing ul.nav {
	background-color:#f29900;
	display:flex;
	justify-content:center;
	position:relative;
}
#spotlight .showcasing ul.nav > li {
	min-width:calc(100% / 3);
	max-width:33.33333%;
	text-transform:uppercase;
	font-weight: 600;
	font-family: "Poppins",sans-serif;
	padding:1rem;
	font-size:22px;
}
#spotlight .showcasing ul.nav > li > a {color:white;text-decoration:none;}

#spotlight .showcasing .controls {display:none;}

#spotlight .showcasing .tab-content {
	display:flex;
	width:100%;
}
#spotlight .showcasing .tab-content > div.tab-pane {
	min-width:calc(100% / 3);
	max-width:33.33333%;
	/*display:block;*/
	display:flex;
	flex-direction:column;
}

#spotlight .showcasing .tab-content > div.tab-pane > * {display: block;}
#spotlight .showcasing .tab-content > div.tab-pane > .img {
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	min-height:300px;
	height:30vh;
	width:100%;
}

#spotlight .showcasing .tab-content > div.tab-pane > .title  {
	font-family:"Poppins",sans-serif;
	font-size: 22px;
	font-weight:bold;
	text-transform:uppercase;
}

#spotlight .showcasing .tab-content > div.tab-pane > .see-all {
	margin-top:0.5rem;
	font-family:"Poppins",sans-serif;
	font-size: 20px;
	font-weight:normal;
	text-transform:uppercase;
	color:black;
}
#spotlight .showcasing .tab-content > div.tab-pane > .see-all > a {color:black;text-decoration:none;}

#CaseStudies {
	background-color: #003775;
    margin-bottom: 2rem;
}
#CaseStudies .row.masonry {
	min-height:600px;
	height:60vh;
	padding: 15px 0;
}
#CaseStudies .row.masonry .masonry-row h2 {font-family: "Poppins", sans-serif;font-weight:normal;font-size: 1.5rem;line-height: 2rem;}
#CaseStudies .row.masonry .masonry-row {position:relative;min-height:200px;}
#CaseStudies .row.masonry .masonry-row p{font-size: 14px;}
#CaseStudies .row.masonry .masonry-row .img {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-size:cover;
	background-position:center;
	transition: all 0.3s;
	opacity:1;
}
#CaseStudies .row.masonry .masonry-row .img > * {
	opacity:0;
	transition: all 0.2s;
}
#CaseStudies .row.masonry .masonry-row .details {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color: rgba(0, 0, 0, 0.2);
	opacity:0;
	transition: all 0.2s;
}

#CaseStudies .row.masonry .masonry-row .details a:hover {color:white;}
#CaseStudies .row.masonry .masonry-row:hover .img {opacity:0.4;}
#CaseStudies .row.masonry .masonry-row:hover .details {opacity:1;}

#CaseStudies .row.masonry .masonry-row .details .property-content {
	position:absolute;
	float:right;
	right:0;
	bottom:0;
	text-align:right;
	padding:1rem;
	font-family: "Poppins", sans-serif;
	color:white;
	font-size:1.2rem;
	line-height:2rem;
}
#CaseStudies .row.masonry .masonry-row .details .property-content > *{display:block;}

@media screen and (max-width: 768px) {
	.HomeSlide {height:700px;}
	.item-textbox {
		top:initial;
		left:0 !important;
		right:0 !important;
		margin:0 !important;
		width:100vw !important;
		min-width:100vw !important;
		max-width:100vw;
		overflow:hidden;
	}
	#HSCarousel .carousel-item .item-textbox[location$="-top"] {bottom:100%;top:0;margin-top:0 !important;}
	#HSCarousel .carousel-item .item-textbox[location$="-bottom"] {bottom:100%;top:0;margin-bottom:0 !important;}
	#HSCarousel .carousel-item.active .item-textbox[location$="-top"] {bottom:40%;}
	#HSCarousel .carousel-item.active .item-textbox[location$="-bottom"] {bottom:40%;}
	.item-textbox .box-content {
		width:100%;
	}
	#HSCarousel .carousel-item .item-bg {
		right:-50%;
		left:-50%;
	}
	#HSCarousel .carousel-item.active .item-bg {
		-webkit-animation-name: MOVE-BG;
		-webkit-animation-duration: 100s;
		-webkit-animation-timing-function: linear;
		-webkit-animation-iteration-count: infinite;
	}
	#HSCarousel .item-textbox .controls {display:flex;color:black;position:absolute;height:4rem;width:100%;}
	#HSCarousel .item-textbox .controls a i {color:rgba(0,0,0,0.8);}
	#HSCarousel .carousel-item.active .item-textbox[location$="-top"] .controls {top:0;}
	#HSCarousel .carousel-item.active .item-textbox[location$="-bottom"] .controls {top:0;}
	
	#spotlight .showcasing .controls {
		position:absolute;
		top:0;
		left:0;
		bottom:0;
		width:100vw;
		display:flex;
	}
	#spotlight .showcasing .controls > a {
		width:25%;
		height:100%;
		padding:1rem;
		font-size:18px;
		line-height:30px;
		color:white;
		position:absolute;
	}
	#spotlight .showcasing .controls > a.control-next {right:0;}
	
	#spotlight .showcasing {
		margin:0 -15px;
	}
	
	#spotlight .showcasing ul.nav > li, #spotlight .showcasing .tab-content > div.tab-pane {display:none;}
	#spotlight .showcasing ul.nav > li.active, #spotlight .showcasing .tab-content > div.tab-pane.active {display:block;min-width:100%;}
	
	#CaseStudies .row.masonry {
		min-height:100vh;
		height:auto;
	}
	#CaseStudies .row.masonry .masonry-col {height:auto;}
	#CaseStudies .masonry-row {height:auto;}
	#CaseStudies .masonry-row.img {max-height:200px;}
}

@-webkit-keyframes MOVE-BG {
	from {
		-webkit-transform: translateX(0);
	}
	to { 
		-webkit-transform: translateX(-40%);
	}
}