body {
  height: 100%;
  font-size: 16px;
  font-family: 'Varela Round', sans-serif;
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  background-color: #fff;
}


h1, h2, h3, h4, h5, h6{
  font-family: 'Varela Round', sans-serif;
  letter-spacing: -1px;
}

h1{
	font-weight: 700;
}

.headback{
	background-image: url(../img/spatone_header_back.jpg);
	background-position: middle;
	background-repeat: no-repeat;
	background-attachment: cover;
	padding-top: 5%;
	padding-bottom: 45%;
	padding-left: 7%;
	padding-right: 7%;
}

.headback h1{
	color: #f37021;
	text-align: center;
	padding-bottom: 15px;
}

.headback img{
	display: block;
	margin: auto;
}

.compentry{
	background-color: #f37021;
	padding-top: 30px;
	padding-bottom: 30px;
	border-radius: 10px;
	padding-left: 2%;
	padding-right: 2%;
}

.compentry h3{
	color: #fff;
}

.compentry label{
	font-family: 'Varela Round', sans-serif;
	color: #fff;
}

.compentry .btn-default{
	background-color: #fff;
}

.compentry .btn-default:hover{
	background-color: #efefef;
}

.compentry .btn-default:active{
	background-color: #fff;
}

.info{
	background-image: url(../img/orange_back.png);
	padding-top: 10%;
	padding-bottom: 15%;
	margin-top: -150px;
	background-repeat: no-repeat;
}

.info p{
	text-align: center;
	color: #fff;
}

.info img{
	display: block;
	margin: auto;
	padding-bottom: 20px;
}

.productrow1{
	text-align: center;
	padding-top: 5%;
	padding-bottom: 5%;
	margin-top: -230px;
}

.productrow1 .img-responsive{
	margin: 0 auto;
}

.liquid{
	color: #f37021;
}

.liquid .btn-primary{
	background-color: #f37021;
	transition-property: background;
  	transition-duration: 0.2s;
  	transition-timing-function: linear;
}

.liquid .btn-primary:hover{
	background-color: #d6570c;
}

.apple{
	color: #8dc63f;
}

.apple .btn-primary{
	background-color: #8dc63f;
	transition-property: background;
  	transition-duration: 0.2s;
  	transition-timing-function: linear;
}

.apple .btn-primary:hover{
	background-color: #75a830;
}

.apple .btn-primary:active{
	background-color: #8dc63f;
}

.social{
	padding-top: 5%;
	padding-bottom: 5%;
	background-color: #f37021;
}

.social h3{
	color: #fff;
}

.social i{
	color: #fff;
	display: inline-block;
	font-size: 5em;
	padding-left: 10px;
	padding-right: 10px;
	margin: auto;
}

.social ul{
	width: 100%;
	text-align: center;
	margin-left: -25px;
}

ul li {
    display:inline-block;
    text-align: center;
}


.fa-instagram{
	color: #FFFFFF !important;
	transition-property: color;
  	transition-duration: 0.2s;
  	transition-timing-function: linear;
}

.fa-instagram:hover{
	color: #e0e0e0 !important;
}

.fa-instagram:active{
	color: #FFFFFF  !important;
}

.fa-facebook-square{
	color: #FFFFFF  !important;
	transition-property: color;
  	transition-duration: 0.2s;
  	transition-timing-function: linear;
}

.fa-facebook-square:hover{
	color: #e0e0e0 !important;
}

.fa-facebook-square:active{
	color: #FFFFFF  !important;
}

.socialbutt{
	margin-left: 20px;
	margin-right: 20px;
}

.buttcontainer{
	padding-top: 20px;
	margin: 0 auto;
    text-align: center;
    width: inherit;
    display: inline-block;
}

.btn-group-wrap {
    text-align: center;
}

.footer1{
	padding-top: 15px;
	padding-bottom: 10px;
	background-color: #222222;
	color: #fff;
}

.footer1 .text-muted{
	font-size: 0.8em;
}

.success{
	padding-top: 20px;
	padding-bottom: 20px;
	text-align: center;
  color: #fff;
}

.success h1{
	padding-top: 10%;
	padding-bottom: 20%;
	text-align: center;
  color: #fff;
}

@media (max-width: 575px) {

	.headback{
		background-image: url(../img/spatone_header_back.jpg);
		background-position: left;
	}

	.info{
		padding-top: 40%;
		padding-bottom: 60%;
		margin-top: -140px;
		background-repeat: no-repeat;
	}

	.productrow1{
		text-align: center;
		padding-top: 5%;
		padding-bottom: 5%;
		margin-top: -150px;

	}

	.socialbutt{
		margin-left: 10px;
		margin-right: 10px;
	}

	.apple{
		padding-top: 20%;
		padding-bottom: 20%;
	}

	.apple .btn-primary{
		margin-left: 10px;
		margin-right: 10px;
	}

}


@media (min-width: 576px) and (max-width: 767px) {

	.headback{
		background-image: url(../img/spatone_header_back.jpg);
		background-position: left center;
	}


	.info{
		padding-top: 20%;
		padding-bottom: 30%;
		margin-top: -200px;
		background-repeat: no-repeat;
	}

	.productrow1{
		text-align: center;
		padding-top: 5%;
		padding-bottom: 5%;
		margin-top: -200px;

	}

	.apple{
		padding-top: 10%;
		padding-bottom: 10%;
	}

}


@media (min-width: 767px) and (max-width: 991px) {

	.headback{
		background-image: url(../img/spatone_header_back.jpg);
		background-position: left center;
	}

	.info{
		padding-top: 15%;
		padding-bottom: 30%;
		margin-top: -250px;
		background-repeat: no-repeat;
	}

	.productrow1{
		text-align: center;
		padding-top: 5%;
		padding-bottom: 10%;
		margin-top: -200px;

	}

}


@media (min-width: 992px) and  (max-width: 1199px) {

	.headback{
			background-image: url(../img/spatone_header_back.jpg);
			background-position: center;
			padding-bottom: 82%;
	}

	.info{
			padding-top: 15%;
			padding-bottom: 25%;
			margin-top: -250px;
			background-repeat: no-repeat;
	}

	.productrow1{
			text-align: center;
			padding-top: 5%;
			padding-bottom: 10%;
			margin-top: -200px;

	}

	.socialbutt{
		margin-left: 10px;
		margin-right: 10px;
	}

	.apple .btn-primary{
		margin-left: 10px;
		margin-right: 10px;
	}
}

@media (min-width: 1200px) and  (max-width: 1530px) {

	.headback{
			background-image: url(../img/spatone_header_back.jpg);
			background-position: center;
			padding-bottom: 65%;
	}

	.info{
			padding-top: 12%;
			padding-bottom: 17%;
			margin-top: -250px;
			background-repeat: no-repeat;
	}

	.productrow1{
			text-align: center;
			padding-top: 5%;
			padding-bottom: 10%;
			margin-top: -250px;

	}

	.socialbutt{
		margin-left: 10px;
		margin-right: 10px;
	}

	.apple .btn-primary{
		margin-left: 10px;
		margin-right: 10px;
	}
}