#preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #fff; height: 100%; z-index: 9999; overflow: hidden; }
#status { width: 250px; height: 250px; position: absolute; left: 50%; top: 50%; background-image: url(../img/preloader.jpg); background-repeat: no-repeat; background-position: center;  margin: -115px 0 0 -110px; z-index: 9999;}

body {font-family: 'Open Sans', sans-serif !important; }
h1, h2, h3 {font-family: 'Bebas Neue', cursive; line-height: 1;}
h1 {font-size: 2rem}
h2 {font-size: 1.5rem}

@media only screen and (min-width: 1024px){
	h1 {font-size: 2.5rem; margin-bottom: 1.5rem;}
}

header .utility-nav { background-color: #000; color: #FFF; text-align: right; padding: 0.5rem 0;}
header .utility-nav ul {margin-bottom: 0px;}
header .utility-nav ul li { display: inline-block;}
header .utility-nav ul li a {color: #FFF; text-transform: uppercase; font-weight: 700; font-size: 0.75rem;}
header .utility-nav ul li a span {font-weight: 400;}
header .utility-nav ul li a i {margin: 0 0.5rem;}

.header-cta {padding: 1rem 0; max-width: 160px;}
.header-cta img {fill: #fe0002; max-width: 35px; float: left;}
.header-cta h2 {font-family: 'Bebas Neue', cursive; margin-left:40px; font-size: 0.95rem; line-height: 1.2; }

a.header.btn.red {background-color: #fe0002; color: #FFF; text-transform: uppercase; font-size: 1.5rem; padding: 0.5rem 0.75rem ; margin: 1.5rem 0; border-radius: 15px; display: inline-block; font-family: 'Bebas Neue', cursive; line-height: 1;}
a.header.btn.red i {font-size: 1.3rem;}

.title-bar {margin: 1rem 0 1rem 1rem; max-height: 2.5rem; background: #5587E0;}

.primary-nav {background-color: #5587E0; font-family: 'Bebas Neue', cursive; color: #FFF;}
.primary-nav .top-bar, .primary-nav .top-bar ul {background-color: #5587E0; color: #FFF;}
.primary-nav a {color: #FFF; font-size: 1.5rem;}

@media only screen and (min-width: 640px) {
	header .utility-nav ul li {margin-left: 1rem;}
	.header-cta {padding:2rem 0; max-width: 170px;}
	.header-cta img {max-width: 38px;}
	.header-cta h2 {margin-left:43px; font-size: 18px; line-height: 1.1;}
	.title-bar {margin: 2rem 0 1rem 0;}
}
@media only screen and (min-width: 1024px) {
	header .utility-nav ul li {margin-left: 1.75rem;}
	.header-cta {padding: 2rem 0;}
	.header-cta img {max-width: 35px;}
	.header-cta h2 {margin-left:43px; font-size: 15px;}
	a.header.btn.red {font-size: 1.25rem; padding: 1rem 1.5rem ; margin: 1.5rem 0; border-radius: 15px;}
	a.header.btn.red i {font-size: 1rem;}
}
@media only screen and (min-width: 1100px) {
	.header-cta {padding: 2.25rem 0;}
	.header-cta h2 {font-size: 17px;}
	a.header.btn.red {font-size: 1.5rem; margin: 2rem 0; }
	a.header.btn.red i {font-size: 1.25rem;}
	.primary-nav .dropdown.menu > li > a {padding: 0.75rem 1.2rem; font-size: 1.6rem;}
}
@media only screen and (min-width: 1250px) {
	header .utility-nav ul li a {font-size: 1rem;}
	.header-cta {padding: 2.5rem 0; max-width: 200px;}
	.header-cta img {max-width: 40px;}
	.header-cta h2 {font-size: 20px; margin-left: 50px;}
	a.header.btn.red {font-size: 1.75rem; padding: 1.25rem 1.75rem ; margin: 2.25rem 0;}
	a.header.btn.red i {font-size: 1.5rem;}
	.primary-nav .dropdown.menu > li > a {padding: 0.75rem 1.5rem; font-size: 1.7rem;}
}
@media only screen and (min-width: 1400px) {
	header .utility-nav ul li {margin-left: 2rem;}
	.header-cta {padding: 2.75rem 0; max-width: 200px;}
	.header-cta img {max-width: 50px;}
	.header-cta h2 {font-size: 23px; margin-left: 60px;}
	a.header.btn.red {font-size: 2rem; padding: 1.5rem 2rem ; margin: 2.5rem 0;}
	a.header.btn.red i {font-size: 1.75rem;}
	.primary-nav .dropdown.menu > li > a {padding: 0.85rem 1.85rem; font-size: 1.85rem;}
}

@media only screen and (min-width: 1600px) {
	.header-cta {padding: 3rem 0; max-width: 250px;}
	.header-cta img {max-width: 50px;}
	.header-cta h2 {font-size: 26px; margin-left: 60px;}
	.primary-nav .dropdown.menu > li > a {padding: 1rem 2.25rem; font-size: 2rem;}
}

.hero-bg {background: url("/_assets/img/home_banner.jpg"); background-repeat: no-repeat; background-size: cover; text-align: center;}
.hero-img {margin: 1rem 1rem 0 1rem; max-width: 80%;}
.hero-animation {padding:1rem; background: #FFF;}

.home_banner {background: #000;}
.home_banner {padding: 0px;}
.home_banner .black-bg {background: #000; padding: 1rem; color: #FFF;}
.home_banner .dark-grey-bg {border-radius: 10px; background:#262626; color:#FFF; padding:0.85rem 1rem 0.75rem 1rem; margin-bottom: 1rem;}
.home_banner .black-bg h1 {margin-bottom: 1rem;}
.home_banner .dark-grey-bg h2 {color: #FFF; margin-left: 45px; margin-bottom: 0px; font-size: 1.25rem;}
.home_banner .dark-grey-bg h2 a {color: #FFF;}
.home_banner .dark-grey-bg img { max-width: 30px; float: left;}

@media only screen and (min-width: 640px) {
	.hero-img {margin: 2rem 1rem 0 1rem; max-width: 85%;}
	.home_banner .black-bg {padding: 3rem 4rem;}
	.home_banner .dark-grey-bg {padding: 1rem 1.5rem 0.85rem;}
	.home_banner .dark-grey-bg img {margin-top: -7px;}
}

@media only screen and (min-width: 1024px) {
	.hero-img {margin: 4rem 1rem 2rem 1rem; max-width: 90%;}
	.home_banner .black-bg {padding: 2rem;}
	.home_banner .black-bg h1 {font-size: 1.5rem;}
	.home_banner .dark-grey-bg {padding: 1rem 1.25rem 0.85rem;}
	.home_banner .dark-grey-bg img {max-width: 25px}
	.home_banner .dark-grey-bg h2 {font-size: 1rem; margin-left: 40px;}
}
@media only screen and (min-width: 1100px) {
	.home_banner .dark-grey-bg h2 {font-size: 1.15rem;}
}
@media only screen and (min-width: 1250px) {
	.hero-img {margin: 4rem 1rem 2rem 1rem; max-width: 90%;}
	.home_banner .black-bg h1 {font-size: 2rem;}
	.home_banner .dark-grey-bg {padding: 1.25rem 1.25rem 1rem;}
	.home_banner .dark-grey-bg img {max-width: 30px}
	.home_banner .dark-grey-bg h2 {font-size: 1.25rem; margin-left: 40px;}
}
@media only screen and (min-width: 1400px) {
	.home_banner .black-bg {padding: 3rem 4rem;}
}
@media only screen and (min-width: 1600px) {
	.home_banner .black-bg {padding: 3rem 4rem;}
	.home_banner .black-bg h1 {font-size: 2.75rem; margin-bottom: 2rem;}
	.home_banner .dark-grey-bg {padding: 1.25rem 1.5rem 1rem 1.5rem;}
	.home_banner .dark-grey-bg h2 {font-size: 1.75rem; margin-left: 55px}
	.home_banner .dark-grey-bg img {max-width: 40px;}
}
@media only screen and (min-width: 1800px) {
	.home_banner .black-bg {padding: 5rem 4rem;}
}

section {padding: 3rem 0;}

.hire-by-category h2 {font-size: 2.5rem; margin-bottom: 1.5rem;}
.category-box, .product-box {border: solid 1px #ccc; padding: 2rem 1.5rem 1rem 1.5rem; transition: all 0.5s ease; margin-bottom: 1.5rem;}
.category-box img, .product-box img {margin-bottom: 1rem;}
.category-box h3, .product-box h3 {font-size: 1.5rem; font-family: 'Bebas Neue', cursive; line-height: 1; color: #262626;}
.category-box.air-conditioning:hover, .product-box.air-conditioning:hover {border:1px solid #5587E0; box-shadow: 0 4px 8px 0 rgba(85,135,224,0.3), 0 6px 20px 0 rgba(85,135,224,0.3); }
.category-box.heating:hover, .product-box.heating:hover {border: 1px solid #fe0002; box-shadow: 0 4px 8px 0 rgba(254, 0, 2, 0.3), 0 6px 20px 0 rgba(254, 0, 2, 0.3);}
.category-box.dehumidifiers:hover, .product-box.dehumidifiers:hover {border: 1px solid #598428; box-shadow: 0 4px 8px 0 rgba(89, 132, 40, 0.3), 0 6px 20px 0 rgba(89, 132, 40, 0.3);}
.category-box.fans-and-vacuums:hover, .product-box.fans-and-vacuums:hover {border: 1px solid #73274D; box-shadow: 0 4px 8px 0 rgba(115, 39, 77, 0.3), 0 6px 20px 0 rgba(115, 39, 77, 0.3);}
.category-box.extras:hover, .product-box.extras:hover {border: 1px solid #8D8D8D; box-shadow: 0 4px 8px 0 rgba(141, 141, 141, 0.3), 0 6px 20px 0 rgba(141, 141, 141, 0.3);}

footer {padding-top: 3rem;background: #262626; color: #FFF;}
.footer-call {list-style: none; margin-left: 0px;}
.footer-call li {margin-bottom: 0.5rem;}
.footer-call li a {color: #FFF; text-transform: uppercase; font-weight: 700; font-size: 1rem;}
.footer-call li a span {font-weight: 400;display:block; }
.footer-contact {list-style: none; margin-left: 0px;}
.footer-contact li.heading {text-transform: uppercase; font-weight: 700;}
.footer-contact li a {color: #FFF; font-size: 1rem;}
.footer-contact li .fa {margin-right: 0.5rem;}
.footer-menu {list-style: none; margin-left: 0px;}
.footer-menu li a {color: #FFF; font-size: 1rem;}
hr {max-width: 95em; border-bottom: 1px solid #ccc;}
footer .copyright, footer .developer {text-align: center; padding: 1rem 0;}
.footer-call li a:hover, .footer-contact li a:hover, .footer-menu li a:hover {color: #5587E0}

@media only screen and (min-width: 1024px) {
	footer .copyright {text-align: left;}
	footer .developer {text-align: right;}
}
@media only screen and (min-width: 1250px) {
	
}
@media only screen and (min-width: 1400px) {
	
}
@media only screen and (min-width: 1600px) {
	
}

.callout-box {
	border: solid 1px #ccc;
    padding: 2rem 1.5rem 1rem 1.5rem;
    transition: all 0.5s ease;
	background: #f0f0f0;
}

/* ============ HIGHLIGHT ============ */

.highlight {background: #f0f0f0; padding: 1rem  1.5rem 0.75rem 1.5rem; border-bottom: 5px solid #5587e0; margin-bottom: 1.5rem;}
.air-conditioning.highlight {border-bottom: 5px solid #5587e0;}
.heating.highlight {border-bottom: 5px solid #fe0002;}
.dehumidifiers.highlight {border-bottom: 5px solid #598527;}
.fans-and-vacuums.highlight {border-bottom: 5px solid #73264d;}
.extras.highlight {border-bottom: 5px solid #8d8d8d;}

/* ============MEDIA DOWNLOADS============ */
p.literature-container span.icon,p.literature-container span.name{font-family:'Open Sans', sans-serif; margin:0 3px 0 0;}
p.literature-container img{vertical-align:middle;}
p.literature-container {margin-top: 2rem;}
.literature-container a.literature {background: #5587e0; color: #FFF; padding:0.75rem 1rem;transition: all 0.5s ease;}
.literature-container a.literature span {background: #FFF; color: #5587e0; margin-left: 1rem;}
.air-conditioning .literature-container a.literature {background: #5587e0;}
.air-conditioning .literature-container a.literature span {color: #5587e0;}
.heating .literature-container a.literature {background: #fe0002;}
.heating .literature-container a.literature span {color: #fe0002;}
.dehumidifiers .literature-container a.literature {background: #598527;}
.dehumidifiers .literature-container a.literature span {color: #598527;}
.fans-and-vacuums .literature-container a.literature {background: #73264d;}
.fans-and-vacuums .literature-container a.literature span {color: #73264d;}
.extras .literature-container a.literature {background: #8d8d8d;}
.extras .literature-container a.literature span {color: #8d8d8d;}

.addcart-btn a.detail{height:34px;background: #5587e0;color:#fff;font-size:14px; border-radius: 5px; padding:0px 19px;position:relative; float:left;transition: all 0.5s ease;}
.addcart-btn a.detail:after {transition: all 0.5s ease;}
.air-conditioning .addcart-btn a.detail {background: #5587e0;}
.air-conditioning .addcart-btn a.literature {color: #5587e0;}
.air-conditioning .addcart-btn a.detail:after{border-left: 10px solid #5587e0;}
.heating .addcart-btn a.detail {background: #fe0002;}
.heating .addcart-btn a.literature {color: #fe0002;}
.heating .addcart-btn a.detail:after{border-left: 10px solid #fe0002;}
.dehumidifiers .addcart-btn a.detail {background: #598527;}
.dehumidifiers .addcart-btn a.literature {color: #598527;}
.dehumidifiers .addcart-btn a.detail:after{border-left: 10px solid #598527;}
.fans-and-vacuums .addcart-btn a.detail {background: #73264d;}
.fans-and-vacuums .addcart-btn a.literature {color: #73264d;}
.fans-and-vacuums .addcart-btn a.detail:after{border-left: 10px solid #73264d;}
.extras .addcart-btn a.detail {background: #8d8d8d;}
.extras .addcart-btn a.literature {color: #8d8d8d;}
.extras .addcart-btn a.detail:after{border-left: 10px solid #8d8d8d;}
.addcart-btn a.detail:after{content:'';position:absolute;top:0;right:-8px;width: 0;height: 0;border-top: 17px solid transparent; border-left: 10px solid #5587e0; border-bottom: 16px solid transparent;}
.addcart-btn a.detail:hover, .air-conditioning .addcart-btn a.detail:hover, .heating .addcart-btn a.detail:hover, .dehumidifiers .addcart-btn a.detail:hover, .fans-and-vacuums .addcart-btn a.detail:hover, .extras .addcart-btn a.detail:hover {background: #333333;}
.addcart-btn a.literature:hover, .air-conditioning .addcart-btn a.literature:hover, .heating .addcart-btn a.literature:hover, .dehumidifiers .addcart-btn a.literature:hover, .fans-and-vacuums .addcart-btn a.literature:hover, .extras .addcart-btn a.literature:hover {color: #333333;}
.addcart-btn a.detail:hover:after, .air-conditioning .addcart-btn a.detail:hover:after, .heating .addcart-btn a.detail:hover:after, .dehumidifiers .addcart-btn a.detail:hover:after, .fans-and-vacuums .addcart-btn a.detail:hover:after, .extras .addcart-btn a.detail:hover:after {border-left: 10px solid #333333; }
.addcart-btn button{background: #5587e0; font-size: 14px; font-weight: 500; color: #fff; height: 34px; line-height: 38px; padding: 0 12px;}
.addcart-btn{height:34px;line-height: 34px;width:199px; margin:0 auto; border-radius:5px;background: #f0f0f0; font-size: 14px;}
.addcart-btn a .fa {margin-right: 5px;}


li.phone {font-weight: 700; font-size: 16px;}
li.phone span{margin-left:5px; font-weight: 400;}

form .cat_button {
	background-color: #fe0002;
    color: #FFF;
    text-transform: uppercase;
    padding: 1rem 1.25rem;
    border-radius: 15px;
    display: inline-block;
    font-family: 'Bebas Neue', cursive;
    line-height: 1;
	font-size: 1.75rem;
}
form .cat_button:hover {
	cursor: pointer;
}
form .cat_button .fa {
	font-size: 1.5rem;
}