/* BACK TO TOP */

.back-to-top {
	background-color: #12122f;
	border: 1px solid #FFF;
	opacity: .2;}

.back-to-top:hover{
	background-color: #12122f;
	color: #FFF;
	border: 1px solid #FFF;
	opacity: 1;}

/* HEADER */

header {
	background-image: url(../../images/landing/domestic/banner_mobile@2x.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center top;
	margin: 40px 0 0 0;
	padding: 0;
	overflow: hidden;
	height: 520px;}

/* PRODUCTS */

#products{
	background-color: #FFF;}

#products h2{
	color: #182051;
	margin-top: -50px;
	margin-bottom: 20px;}

/* product buttons */
#products .button{
  	margin-bottom: 10px;}

#products .button a{
	background-color: #4b97b0;
	color: #FFF;
	padding: 5px 10px;
	-webkit-border-radius: 10px;
 	-moz-border-radius: 10px;
	border-radius: 10px;
	display: block;}

#products .button a:hover{
	background-color: #65aac1;}

/* product listings */
#products .appear{
  	margin-top: 80px;}

#products .appear-hide{
  	display: none;}

#products .appear h2{
 	text-transform: uppercase;
	font-size: 30px;
	color: #182051;}

#products .appear a h3{
	color: #182051;
	font-size: 16px;}

#products .fastener img{
	width: 120px;
	height: auto;
	margin: 0 auto;}

/* MEDIA QUERIES */

@media (min-width: 768px) {

/* HEADER */	

header{
  background-image: url(../../images/landing/domestic/banner_tablet@2x.jpg);
  height: 600px;}
}

@media (min-width: 992px) {

/* HEADER */

header{
  background-image: url(../../images/landing/domestic/banner_desktop@2x.jpg);
  height: 400px;}
	
/* PRODUCTS */

.hvr-float-desktop {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;}

.hvr-float-desktop:hover, .hvr-float:focus, .hvr-float:active {
  -webkit-transform: translateY(-8px);
  transform: translateY(-8px);}
}

@media (min-width: 1200px) {

/* HEADER */
	
header{
  background-image: url(../../images/landing/domestic/banner_extra-large@2x.jpg);
  height: 500px;}
}