body{
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-size:15px;
	line-height:1.5;
	margin:0;
	padding-top: 82px;
	background-color:#f4f4f4;
	font-family:  serif;
}

/* Global */
.container{
	width:94%;
	margin:auto;
	overflow:hidden;
}

/*!* Header *!*/
header{
	position:fixed;
	width: 100%;
	background:#f4f4f4;
	padding-top:30px;
	min-height:40px;
	top: 0;
	left: 0;
}

header a{
	color:black;
	text-decoration: none;
	/*text-transform: uppercase;*/
	font-size:16px;
}

header ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	/*background-color: #333;*/
}

header li {
	float: left;
}

header li a, .dropbtn {
	display: inline-block;
	color: black;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
}

header li a:hover, .dropdown:hover .dropbtn {
	background-color: #9AC0D7;
}

header li.dropdown {
	display: inline-block;
}

header .dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
}

header .dropdown-content a {
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
	text-align: left;
}

header .dropdown-content a:hover {background-color: #f1f1f1;}

header .dropdown:hover .dropdown-content {
	display: block;
}

/* Showcase */
#showcase{
	min-height: 300px;
	margin:0;
	width:100%;
	overflow:hidden;
}

#background-image-app{
	background: url("../img/appliances.jpg") fixed;
}

#background-image-light{
	background: url("../img/light.jpg") fixed;
}

#background-image-therm{
	background: url("../img/thermostat.jpg") fixed;
}

#background-image-plug{
	background: url("../img/plug.png") fixed;
}

#background-image-hub{
	background: url("../img/hub.jpg") fixed;
}

.background-image{
	min-height: 400px;
	width:94%;
	overflow:hidden;
	margin: 0 3% 0 3%;
}

.background-image h1{
	font-size: 100px;
	padding-left:1%;
}

.background-image p{
	font-size: 20px;
	padding-left: 1%;
}

#showcase-tech h1{
	position: relative;
}

/* Slideshow container */
.slideshow-container {
	position: relative;
	margin: auto;
}

/* Hide the images by default */
.mySlides {
	/*max-height:400px;*/
	/*max-width: 100%;*/
	/*display: none;*/
	margin:auto;
	width:100%;
}

/* Next & previous buttons */
.prev, .next {
	cursor: pointer;
	position: absolute;
	top: 50%;
	width: auto;
	margin-top: -22px;
	padding: 16px;
	color: white;
	font-weight: bold;
	font-size: 18px;
	transition: 0.6s ease;
	border-radius: 0 3px 3px 0;
	user-select: none;
}

/* Position the "next button" to the right */
.next {
	right: 0;
	border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
	background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.innerContent {
	color: white;
	font-size: 32px;
	padding: 8px 12px;
	position: absolute;
	bottom: 23%;
	left: 5%;
	width: 25%;
	background-color: rgba(0, 0, 0, 0.64);
	text-align: center;
}

.innerContent a{
	text-decoration: none;
	color: white;
}

.innerContent li{
	display:inline-block;
	padding: 2px 11%;
	width: 70%;
}

.innerContent ul{
	list-style-type: none;
	display: inline-block;
	margin: 0;
	padding: 0;
	zoom:1;
	*display:inline;
}

.innerContent a:hover{
	color: #a7a7a7;
}

/* The dots/bullets/indicators */
.dot {
	cursor: pointer;
	height: 15px;
	width: 15px;
	margin: 1% 2px 0 0;
	background-color: #bbb;
	border-radius: 50%;
	display: inline-block;
	transition: background-color 0.6s ease;
}

.active, .dot:hover {
	background-color: #717171;
}

/* Fading animation */
.fade {
	-webkit-animation-name: fade;
	-webkit-animation-duration: 1.5s;
	animation-name: fade;
	animation-duration: 1.5s;
}

@-webkit-keyframes fade {
	from {opacity: .4}
	to {opacity: 1}
}

@keyframes fade {
	from {opacity: .4}
	to {opacity: 1}
}

#technologies .tech{
	width: 15%;
	display:inline-block;
	color: black;
	text-align: center;
	background-color:white;
	margin-left: 1%;
	margin-right: 1%;
	padding: 1%;
	min-width: 170px;
}

#technologies a{
	text-decoration: none;
	color: black;
}

#technologies li{
	display:inline-block;
	padding: 2px 11%;
	width: 70%;
}

#technologies ul{
	list-style-type: none;
	display: inline-block;
	margin: 0;
	padding: 0;
	zoom:1;
	*display:inline;
}

#technologies i{
	font-size: 2.5vw;
	padding: 0 0 7% 0;
}

#technologies a:hover{
	color: #a7a7a7;
}

#technologies{
	margin: 2%;
	text-align: center;
}

#bottom{
	/*text-align:center;*/
	width: 89%;
	min-height: 300px;
	background-color:#35424a;
	display:inline-block;
	margin: 0 3% 0 3%;
	padding: 0 0 0 5%;
	color:white;
	font-size: 25px;
	overflow:hidden;
}

#bottom h3{
	text-align: center;
}

#bottom p{
	width: 90%
}

#amazon-products .tech{
	position: relative;
	width: 21%;
	display:inline-block;
	color: black;
	text-align: center;
	background-color:white;
	/*margin-left: 1%;*/
	/*margin-right: 1%;*/
	/*padding: 1%;*/
	min-width: 310px;
	padding:0;
	margin:3% 1.55% 0 1.55%;

}

#amazon-products .product-img{
	width:  300px;
	height: 300px;
	background: no-repeat 50% 50%;
	background-size:     cover;
}

#amazon-products a{
	text-decoration: none;
	color: black;
	padding:0;
	margin:0;
}

#amazon-products li{
	display:inline-block;
	/*padding: 5% 11%;*/
	width: 70%;
	padding:0;
	margin:0;
}

#amazon-products ul{
	list-style-type: none;
	display: inline-block;
	margin: 0;
	padding: 0;
	zoom:1;
	*display:inline;
}

#amazon-products i{
	font-size: 2.5vw;
	padding: 11% 0 7% 0;
}

#amazon-products a:hover{
	color: #a7a7a7;
	padding:0;
	margin:0;
}

#amazon-products{
	margin: 0 0 3% 0;
	padding: 0;
	text-align: center;
	overflow: hidden;
}

#amazon-products .overlay{
	position:absolute;
	background-color: rgba(255, 255, 255, 0.78);
	overflow: hidden;
	width:100%;
	height: 0;
	bottom: 0;
	left: 0;
	right: 0;
	transition: .25s ease;
}

.overlay-content {
	color: black;
	font-size: 20px;
	padding: 20%;
}

#amazon-products .tech:hover .overlay {
	height: 100%;
}

#amazon-products button{
	border:none;
	color:white;
	background-color: #9AC0D7;
	font-size: 16px;
	padding: 3%;
	transition-duration: 0.2s;
}

#amazon-products button:hover{
	background-color: #acd1e9;
}
