/**********************************
GENERAL
***********************************/

@font-face {
  font-family: 'HoneywellCond';
  src: url("../fonts/HoneywellCond-Black.otf") format("opentype"), url("../fonts/HoneywellCond-Bold.otf") format("opentype"), url("../fonts/HoneywellCond-Book.otf") format("opentype"), url("../fonts/HoneywellCond-ExtraBold.otf") format("opentype"), url("../fonts/HoneywellCond-Light.otf") format("opentype"), url("../fonts/HoneywellCond-Medium.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'HoneywellSans';
  src: url("../fonts/HoneywellSans-Black.otf") format("opentype"), url("../fonts/HoneywellSans-Bold.otf") format("opentype"), url("../fonts/HoneywellSans-Book.otf") format("opentype"), url("../fonts/HoneywellSans-ExtraBold.otf") format("opentype"), url("../fonts/HoneywellSans-Light.otf") format("opentype"), url("../fonts/HoneywellSans-Medium.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'HoneywellSans-Light';
  src: url("../fonts/HoneywellSans-Light.otf") format("opentype");
  font-weight: lighter;
  font-style: normal;
}
@font-face {
  font-family: 'HoneywellSans-Book';
  src: url("../fonts/HoneywellSans-Book.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'HoneywellSans-Bold';
  src: url("../fonts/HoneywellSans-Bold.otf") format("opentype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'HoneywellSans-Medium';
  src: url("../fonts/HoneywellSans-Medium.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}

* {
	-webkit-box-sizing: border-box;
	/* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;
	/* Firefox, other Gecko */
	box-sizing: border-box;
	/* Opera/IE 8+ */
}

.glyphicon {
	position: relative;
	top: 1px;
	display: inline-block;
	font-family: 'Glyphicons Halflings';
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body {
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
	font-family: "HoneywellSans-Book";
	/*font-smoothing: antialiased;*/
	text-rendering: optimizeLegibility;
	color: #737373;
	background-color: #cccccc;
}

#wrapper {
	width: 92%;
	max-width: 920px;
	margin: 0 auto;
	padding: 0;
}

a {
	text-decoration: none;
}

img {
	max-width: 100%;
}

h3 {
	margin: 0 0 1em 0;
}


/**********************************
MARKETO
***********************************/

#marketo {
	margin: 50px 4%;
}


/**********************************
HELPERS
***********************************/

.clear-left {
	clear: left;
}

.clear-fix {
	clear: both;
}

/*trying a second type of clearfix...*/
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

.spacer-10px {
	width: 100%;
	height: 10px;
}

.spacer-20px {
	width: 100%;
	height: 20px;
}

.spacer-50px {
	width: 100%;
	height: 50px;
}

.full-width-image {
	width: 100%;
	height: auto;
}


/**********************************
HEADING, HEADLINES AND COPY
***********************************/

#header {
	width: 92%;
	max-width: 920px;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 100000;
}

#logo {
	text-align: left;
	margin: 0;
}

#logo img {
	width: 26.63%;
	margin: 25px 0 25px 0;
	min-width: 245px;
}

h1 {
	margin: 25px 0 35px 0;
	font-size: 42px;
	font-weight: normal;
	line-height: 42px;
}

h2 {
	font-size: 1.5em;
	margin: -5px 0 0;
	font-weight: normal;
}

h3 {
	font-size: 0.9em;
	margin: -5px 0 0;
	font-weight: normal;
}

h1, h2, h3, p {
	text-align: center;
}

p {
	color: #000000;
	font-size: 18px;
	margin: 18px 0 22px;
}


/**********************************
NAVIGATION
***********************************/

nav {
	font-family: "HoneywellSans-Medium";
	text-align: right;
	padding: 10px 0;
	margin: 81px 0 0;
	font-size: 14px;
}

nav ul {
	list-style: none;
	margin: 0 10px;
	padding: 0;
}

nav li {
	display: inline-block;
}

nav a {
	padding: 15px 10px;
}


/**********************************
HERO
***********************************/

#hero {
	float: left;
	position: relative;
	width: 100%;
}

#hero-copy {
	float: left;
	width: 44.5%;
	padding-right: 5%;
}

#hero-title {
	text-align: left;
	font-size: 38px;
	line-height: 35px;
}

#hero-body {
	text-align: left;
	font-size: 18px;
	line-height: 23px;
}

#slideshow {
	width: 55.5%;
	height: 100%;
	float: right;
	position: relative;
	padding: 0;
	clear: right;
}

#slideshow>div {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	right: 0;
}

#slideshow>div .hero-img {
	width: 100%;
	height: auto;
}


/**********************************
CPRO BANNER
***********************************/


.cpro-banner {
	font-family: "HoneywellSans-Light";
	font-weight: bold;
	float: left;
	width: 100%;
	background-color: #ee3124;
}

.cpro-banner #envelope {
	float: left;
	width: 3.913%;
	margin: 32px 31px 32px 3.478%;
}

.cpro-banner p {
	float: left;
	margin: 32px 0;
	color: white;
	font-size: 24px;
}

.cpro-banner p strong {
	font-family: 'HoneywellSans-Bold';
	font-weight: bold;
	font-size: 26px;
}

.fix-cpro {
	max-width: 1000px;
	width: 100%;
	float: none;
	position: fixed;
	top: 91px;
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 100000;
}

.fix-cpro #envelope {
	margin-left: 6.478%;
}

.fix-cpro #back-to-form {
	float: right;
	width: 4%;
	margin-top: 4%;
	margin-right: 4%;
}

.display-none {
	display: none;
}

#top {
	height: 92px;
	/* Space in here for search */
	padding-top: 40px;
	position: relative;
}


/**********************************
PAGE: GALLERY 3-ACROSS
***********************************/

.gallery, .gallery-overlay {
	margin: 0 auto;
	padding: 0;
	list-style: none;
	clear: left;
}

.gallery li {
	float: left;
	width: 30.3333%;
	margin: 1.5%;
}

.gallery li img {
	width: 100%;
}

.gallery li h2, .gallery li h3, .gallery-overlay li h2, .gallery-overlay li h3 {
	margin: 20px 20px 20px 10px;
	text-align: left;
}

.gallery li h2 {
	font-weight: bold;
}

.gallery li h3 {
	margin: 20px 10px 20px 10px;
	font-size: 16.5px;
	line-height: 26px;
}

.gallery li:nth-child(4n) {
	clear: left;
}

.gallery li a p {
	margin: 0;
	padding: 5%;
	font-size: 0.75em;
	color: #bdc3c7
}

.gallery-overlay li {
	float: left;
	position: relative;
	width: 30.3333%;
	margin: 1.5%;
}

.gallery-overlay li h2 {
	position: absolute;
	width: 93%;
	text-align: center;
	top: 37%;
	font-size: 19px;
	color: #fff;
	-webkit-transition: top .75s ease;
	transition: top .75s ease;
}

.gallery-overlay li h3 {
	position: absolute;
	width: 93%;
	text-align: center;
	top: 37%;
	font-size: 16px;
	color: #fff;
	opacity: 0;
	-webkit-transition: opacity 1s ease;
	transition: opacity 1s ease;
}

.gallery-overlay li img {
	width: 100%;
	position: absolute;
}

#gal1 {
	background: url(../img/easypts.png);
	background-size: contain;
	background-repeat: no-repeat;
}

#gal2 {
	background: url(../img/rewardbiz.png);
	background-size: contain;
	background-repeat: no-repeat;
}

#gal3 {
	background: url(../img/rewardyou.png);
	background-size: contain;
	background-repeat: no-repeat;
}


/**********************************
OVERLAY EFFECTS
***********************************/

.overlay {
	width: 100%;
	background: rgba(0, 0, 0, 1);
	text-align: center;
	opacity: .35;
	-webkit-transition: opacity .75s ease;
	transition: opacity .75s ease;
}

.overlay:hover {
	background: rgba(0, 0, 0, 1);
	opacity: .75;
	-webkit-transition: opacity .75s ease;
	transition: opacity .75s ease;
}

#h2-1, #h2-2, #h2-3, #h3-1, #h3-2, #h3-3 {
	z-index: 50000;
}

.hover-box {
	position: absolute;
	width: 100%;
	top: 0;
	z-index: 100000;
}


/* HOVER ON H1 AND H2 ABOVE DIV TO MAKE THE DIV OVERLAY */

#h2-1:hover~#ov-1, #h2-2:hover~#ov-2, #h2-3:hover~#ov-3, #h3-1:hover~#ov-1, #h3-2:hover~#ov-2, #h3-3:hover~#ov-3, #hb-1:hover~#ov-1, #hb-2:hover~#ov-2, #hb-3:hover~#ov-3 {
	background: rgba(0, 0, 0, 1);
	opacity: .75;
	-webkit-transition: opacity .75s ease;
	transition: opacity .75s ease;
	-webkit-transition: background .75s ease;
	transition: background .75s ease;
}


/* MOVE TITLE LINE UP */

#hb-1:hover~#h2-1, #hb-2:hover~#h2-2, #hb-3:hover~#h2-3 {
	top: 20%;
	-webkit-transition: top .75s ease;
	transition: top .75s ease;
}


/* MAKE PARAGRAPH COPY VISIBLE */

#hb-1:hover~#h3-1, #hb-2:hover~#h3-2, #hb-3:hover~#h3-3 {
	opacity: 1;
	-webkit-transition: opacity 1.25s ease;
	transition: opacity 1.25s ease;
}


/**********************************
TESTIMONIALS SECTION
***********************************/

.testy-box {
	width: 97%;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	clear: left;
}

.testy-box li {
	float: left;
	width: 48.5%;
	margin: 5% 1.5% 5% 0;
}

.testy-box li:nth-child(2n) {
	margin: 5% 0 5% 1.5%;
}

.testy-box li .quote {
	width: 100%;
	padding: 6%;
	font-size: 24px;
	background-color: #f2f2f2;
}

.testy-box li .info {
	font-size: 20px;
	margin: 0 3.2% 5% 0;
}

.testy-box li .info .read-more {
	font-size: 16px;
	font-family: 'HoneywellSans-Bold';
	font-weight: bolder;
}

.testy-box li .info .read-more img {
	height: 12px;
	width: auto;
}

.testy-box li .quote .name {
	font-family: 'HoneywellSans-Bold';
	font-size: 16px;
	font-weight: bolder;
}

#exit-testy-box {
	float: right;
	margin: 0 1.5% 0 0;
	position: relative;
	right: 0;
	top: 50%;
}

#exit-testy-box img {
	height: 15px;
}

.arrow-left {
	width: 0;
	height: 0;
	border-top: 30px solid transparent;
	border-bottom: 30px solid transparent;
	border-right: 30px solid #f2f2f2;
	-ms-transform: rotate(45deg);
	/* IE 9 */
	-webkit-transform: rotate(45deg);
	/* Chrome, Safari, Opera */
	transform: rotate(45deg);
	margin-top: -5.8%;
	margin-left: 10%;
}


/**********************************
FOOTER
***********************************/

footer {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	font-size: 0.75em;
	padding: 22.5px 4%;
	color: #ccc;
	background-color: #ededed;
}

#footer-logo {
	text-align: left;
	margin: 0;
}

#footer-logo img {
	width: 26.63%;
	margin: 0;
	min-width: 245px;
}

.social {
	float: right;
	text-align: right;
	margin: 0;
}

.social-icon {
	width: 15%;
	height: 15%;
	margin: 0 5px;
	border-radius: 50%;
	border: 1px solid #999;
}


/**********************************
COLORS
***********************************/


/* site body */

body {
	background-color: #fff;
	color: #737373;
}


#hero-title {
	color: #737373;
}

#hero-body {
	color: #000;
}

/* hnwl header */

#header {
	background: #fff;
	border-color: #599a68;
}

#wrapper {
	/*background-color: #dddddd;*/
}


/* nav background on mobile */

nav {
	background: #fff;
	color: #95989a;
}


/* logo text */

h1 {
	color: #737373;
}

h3 {}

.gallery li h3 {
	color: #000;
}


/* links */

a {
	color: #999;
}


/* nav link */

nav a, nav a:visited {
	color: #95989a;
}


/* selected nav link */

nav a.selected, nav a:hover {
	color: #666;
}

.testy-box li {
	color: #000;
}

.testy-box li .read-more {
	color: #ee3124;
}