/* =============================================================================
================================================================================

	--------- Surface Restore ---------

	Design by :: Mike Wedge of Fifteen Ten Ltd.
	
	Carefully crafted by :: Thomas Dale of D Taled Designs Ltd.

	Date created :: 23/10/2017

	© Copyright Fifteen Ten Ltd. 2017. All rights reserved.

 =============================================================================
 ============================================================================= */

@import url("../css/reboot.min.css");

/* =============================================================================
   @FONT-FACEY
   ========================================================================== */

@import url("http://fast.fonts.net/t/1.css?apiType=css&projectid=9468aadc-f64a-44b4-9a98-cbae1ebecca2");

@font-face { font-family: "Proxima Nova W01 Medium"; src: url("../fonts/b918fc25-caba-4cf5-8606-d77742e476f4.eot?#iefix"); src: url("../fonts/b918fc25-caba-4cf5-8606-d77742e476f4.eot?#iefix") format("eot"), url("../fonts/e898042a-5eb9-4810-b578-c3993ab58f0f.woff2") format("woff2"), url("../fonts/cb9d4f02-d326-46b0-a857-930cce057f80.woff") format("woff"), url("../fonts/75cafc03-22e4-41b0-8bc2-1b9081506ecc.ttf") format("truetype"), url("../fonts/efb9f6bb-840c-47d2-a504-11c8c352aded.svg#efb9f6bb-840c-47d2-a504-11c8c352aded") format("svg"); }
@font-face{ font-family: "Proxima N W01 Reg"; src: url("../fonts/7e90123f-e4a7-4689-b41f-6bcfe331c00a.eot?#iefix"); src: url("../fonts/7e90123f-e4a7-4689-b41f-6bcfe331c00a.eot?#iefix") format("eot"), url("../fonts/64017d81-9430-4cba-8219-8f5cc28b923e.woff2") format("woff2"), url("../fonts/e56ecb6d-da41-4bd9-982d-2d295bec9ab0.woff") format("woff"), url("../fonts/2aff4f81-3e97-4a83-9e6c-45e33c024796.ttf") format("truetype"), url("../fonts/ab9cd062-380f-4b53-b1a7-c0bec7402235.svg#ab9cd062-380f-4b53-b1a7-c0bec7402235") format("svg"); }
@font-face { font-family: "Proxima N W01 Xbold"; src: url("../fonts/9fbce143-f5db-4c0b-9159-b1e666079f67.eot?#iefix"); src: url("../fonts/9fbce143-f5db-4c0b-9159-b1e666079f67.eot?#iefix") format("eot"), url("../fonts/eb39afe0-709e-46d6-92ad-db5c3bfd24a9.woff2") format("woff2"), url("../fonts/19dd5cf2-ac2d-48d5-901a-c432fd291ee2.woff") format("woff"), url("../fonts/22cfbfa4-f607-4751-92eb-6fa194353e57.ttf") format("truetype"), url("../fonts/3d6b6348-e05f-4123-b19a-3bfd02c7f361.svg#3d6b6348-e05f-4123-b19a-3bfd02c7f361") format("svg"); }
@font-face { font-family: "Proxima N W01 Black"; src: url("../fonts/9b05cd3b-19d8-496a-816b-8de46cf24af1.eot?#iefix"); src: url("../fonts/9b05cd3b-19d8-496a-816b-8de46cf24af1.eot?#iefix") format("eot"),url("../fonts/a086d1e1-d71a-4248-bc5b-6a91bbda0756.woff2") format("woff2"), url("../fonts/43106d4c-07a9-48c0-bdeb-d82f359c85f5.woff") format("woff"), url("../fonts/7783372a-b74a-4eb3-902f-ab18b106eb46.ttf") format("truetype"), url("../fonts/22e79766-6290-47c1-b1af-93665675dd48.svg#22e79766-6290-47c1-b1af-93665675dd48") format("svg"); }

.left-section, .right-section { width: 50%; padding: 0 20px; box-sizing: border-box; }
.left-section { float: left; }
.right-section { float: right; }
img.product-pic { position: absolute; right: 0px; top: 140px; }

.services-list { background-color: #ddd; padding: 40px; }
#services .text-area {
    padding-top: 60px;
}
#services .services-list ul > li .image {
    overflow: hidden;
    position: relative;
    border: 2px solid #eee;
    background: #fff;
    box-shadow: 0px 0px 5px #bbb;
}


/* =============================================================================
   GLOBAL
   ========================================================================== */

/*---- Html ----*/
html { -ms-font-feature-settings: inherit; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -webkit-overflow-scrolling: touch; -webkit-text-size-adjust: 100%; font-size: 62.5%; margin: 0; min-height: 100%; padding: 0; width: 100%; }
html.overflow-hidden, 
html.overflow-hidden body { overflow-y: hidden; position: relative; }

/*---- Body ----*/
body { background-color: #000000; color: #000000; font-family: "Proxima N W01 Reg", Arial, Helvetica, sans-serif; font-size: 15px; font-weight: 400; height: 100%; letter-spacing: 0.02em; line-height: 20px; margin: 0; overflow-x: hidden; padding: 0; width: 100%; }

/*---- Wrappers ----*/
#site-wrapper { margin: 0; min-height: 100%; min-width: 320px; padding: 112px 0 0 0; position: relative; width: 100%; }
.wrapper { -moz-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; margin: 0 auto; max-width: 1360px; padding: 45px 40px; position: relative; transition: all 0.2s ease-in-out 0s; }
.content-page #site-wrapper { padding-top: 112px;}

/*---- Main ----*/
#main {  }

/*---- Anchors ----*/
a { -moz-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; color: #EB2D2E; text-decoration: underline; transition: all 0.2s ease-in-out 0s; }
a:hover,
a:focus,
a:active { color: #ff3839; text-decoration: underline; }

/*---- Buttons ----*/
.button,
a.button { background: #EB2D2E; border: none; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; color: #000000; display: inline-block; font-family: "Proxima N W01 Xbold", Arial, Helvetica, Verdana, sans-serif; font-size: 1.7rem; font-weight: 900; letter-spacing: 0.06em; padding: 12px 50px 12px 21px; position: relative; text-decoration: none; text-transform: uppercase; vertical-align: middle; }
.button:after,
a.button:after { -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); content: "\f054"; font-family: "fontAwesome"; display: block; right: 20px; position: absolute; top: 50%; transform: translateY(-50%); -moz-transition: 0.3s ease; -ms-transition: 0.3s ease; -o-transition: 0.3s ease; -webkit-transition: 0.3s ease; transition: 0.3s ease; }
.button:hover, a.button:hover { background-color:#ff3839; }
.button:hover:after,
a.button:hover:after { right: 25px; }
.button.no-arrow { padding-right: 20px; }
.button.no-arrow:after { display: none; }
.button.secondary { background-color: #a1a1a1; }
.cf > .button { margin-bottom: 20px; }
button { background: none; border: none; outline: none; }

/* =============================================================================
   HELPERS
   ========================================================================== */

/* ALIGNMENT
   ========================================================================== */

.left { float: left; }
.right { float: right; }
.clear { clear: both; padding: 0; }
.centred { margin-left: auto; margin-right: auto; text-align: center; }
	   
.align-left { text-align: left; }
.align-right { text-align: right; }
.transition { -moz-transition: 0.2s ease; -ms-transition: 0.2s ease; -o-transition: 0.2s ease; -webkit-transition: 0.2s ease; transition: 0.2s ease; } 

/* COLUMNS
   ========================================================================== */

/*---- Column ----*/
.column { float: left; padding: 0 1%; }
.two-column, .three-column, .four-column, .five-column, .six-column {
    margin: 40px -1% 40px;
    clear: both;
    box-sizing: border-box;
    padding: 0 30px;
}

.two-column .column { width: 50%; }
.three-column .column { width: 33.33%; }
.four-column .column { width: 25%; }
.five-column .column { width: 20%; }
.six-column .column { width: 12%; }

.two-column .column:nth-child(2n+1),
.three-column .column:nth-child(3n+1),
.four-column .column:nth-child(4n+1),
.five-column .column:nth-child(5n+1),
.six-column .column:nth-child(6n+1) { clear: left; }

.text-area .four-column .column img { max-width: 160px; }

.cf:after {
	content:'';
	height:1px;
	display:block;
	width:100%;
	clear:both;
}



/* VIEWPORTS
   ========================================================================== */

.mobile-view { display: none; }

/* WIDTHS
   ========================================================================== */

.two-column-width { width: 20%; }
.three-column-width { width: 30%; }
.four-column-width { width: 40%; }
.half-width { width: 50%; }
.six-column-width { width: 60%; }
.seven-column-width { width: 70%; }
.eight-column-width { width: 80%; }
.nine-column-width { width: 90%; }

/* COLOURS
   ========================================================================== */

.secondary-bg { background-color: #e4e4e4; }

/* =============================================================================
   PAGE LEVEL
   ========================================================================== */
  
/* HEADER
   ========================================================================== */

header#header { width: 100%; position: fixed; top: 0px; left: 0px; z-index: 9111; background: #000; border-bottom: 4px solid #EB2D2E;height:118px}
header#header .wrapper { max-width: 100%; padding: 0; position: relative; }
.nav-open header#header { z-index: auto; }
.homepage .introduction { overflow: hidden; }


/*---- Navicon Wrapper ----*/
#navicon-wrapper {
    background: #EB2D2E;
    height: 100%;
    left: 30px;
    padding: 9px 7px;
    position: relative;
    top: 33px;
}
#navicon { cursor: pointer; display: block; height: 28px; margin: 0; padding: 0; position: relative; width: 41px; }
#navicon > span { -webkit-transition: all linear 0.3s; -moz-transition: all linear 0.3s; -ms-transition: all linear 0.3s; background: #000000; height: 2px; left: 0; margin-top: 0px; position: absolute; top: 50%; transition: all linear 0.3s; width: 100%; }
#navicon > span:after,
#navicon > span:before { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -webkit-transition: all linear 0.3s; -moz-transition: all linear 0.3s; -ms-transition: all linear 0.3s; background: #000000; content: ""; display: block; height: 2px; left: 0; position: absolute; transform: rotate(0); transition: all linear 0.3s; width: 100%; }
#navicon > span:before { top: -7px; }
#navicon > span:after {	top: 7px; }
#navicon.open { margin: 0; }
#navicon.open:before { background: #000000; left: auto; left: -13px; width: 63px; }
#navicon.open > span { background: transparent; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear;	-ms-transition: all 0.3s linear; transition: all 0.3s linear; }
#navicon.open > span:before { background-color: #000000; visibility: visible; top: 0 !important; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
#navicon.open > span:after { background-color: #000000; visibility: visible; top: 0 !important; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
.nav-open #navicon-wrapper { left: 260px; z-index: 5; }

/*---- Logo ----*/
#logo { background: url("../images/logo.png") no-repeat 0 0 transparent; -moz-background-size: 301px auto; -ms-background-size: 301px auto; -o-background-size: 301px auto; -webkit-background-size: 301px auto; background-size: 301px auto; height: 58px; left: 50%; position: absolute; top: 54px; -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); width: 301px; }
#logo > a { display: block; height: 100%; width: 100%; }

/*---- Navigation ----*/
nav#navigation { -moz-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; -webkit-overflow-scrolling: touch; -webkit-transform: translateZ(0) translate3d(0,0,0); background: #000000; display: block; height: 100%; overflow-y: auto; position: fixed; left: -260px; padding: 0; text-align: left; top: 0; transition: all 0.2s ease-in-out 0s; width: 260px; z-index: 9999;border-right: 4px solid #EB2D2E; }
nav#navigation.open { left: 0; }
nav#navigation ul { display: block; font-family: "Proxima N W01 Xbold", Arial, Helvetica, Verdana, sans-serif; table-layout: auto; width: 100%; }
nav#navigation ul > li,
nav#navigation ul > li:first-child,
nav#navigation ul > li, nav#navigation ul > li:first-child, nav#navigation ul > li:last-child {
    border-top: 1px solid rgba(255, 255, 255, 0.33);
    display: block;
    font-size: 2rem;
    margin-left: 0;
    padding: 0;
    text-transform: uppercase;
}
nav#navigation ul > li:first-child { border-top: none; }
nav#navigation ul ul > li { font-size: 0.8em !important; text-transform: capitalize; border-top: 1px solid rgba(255, 255, 255, 0.33) !important; }
nav#navigation ul ul > li > a { padding-left: 30px }
nav#navigation ul > li > a { color: #EB2D2E; display: block; padding: 22px 20px; text-decoration: none; }
nav#navigation ul > li.active > a, nav#navigation ul > li > a:hover { background: #EB2D2E; color: #ffffff; }
nav#navigation ul > li > ul.secondary-nav { background: #e1e1e1; border: none; display: none; position: relative; top: auto; width: 100%; }
nav#navigation ul > li > ul.secondary-nav:before { display: none; }
nav#navigation ul > li > ul.secondary-nav > li { border-color: #ffffff; }
nav#navigation ul ul { margin-bottom: 0px; padding-bottom: 0px; } 

/*---- Request a Quote ----*/
#request-a-quote { margin-right: 34px; margin-top: 34px; }
  
/* BANNERS
   ========================================================================== */

#banner { border-bottom: 4px solid #EB2D2E; border-top: 4px solid #EB2D2E; touch-action: auto; user-select: none; -webkit-user-drag: none; overflow: hidden; position: relative; }
#banner.scrolling { touch-action: pan-x; }
#banner .items { height: 100%; position: relative; width: 100%; }

/*---- Parallax Banner ----
.parallax .parallax-banner { background-attachment: fixed; -moz-background-size: cover; -ms-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-size: cover; height: 100%; left: 0; overflow: hidden; position: absolute; top: 0; -moz-transform: translate3d(0, 100%, 0); -ms-transform: translate3d(0, 100%, 0); -o-transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -moz-transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; -ms-transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; -o-transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; -webkit-transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; width: 100%; will-change: transform; }
.parallax .parallax-banner.active { -moz-transform: translate3d(0, 0, 0) scale(1); -ms-transform: translate3d(0, 0, 0) scale(1); -o-transform: translate3d(0, 0, 0) scale(1); -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); }
.parallax .parallax-banner:before { background: rgba(64, 71, 72, 0.44); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }*/



/*---- New Home Banner ----*/

.homepage #banner .items > div { height: 100vh; width: 100%; background-size: cover; background-attachment: fixed; position:relative; border-bottom: 4px solid #EB2D2E; }
.banner-content { color: #ffffff; font-size: 2rem; left: 0; line-height: 2.5rem; margin-left: 15%; max-width: 640px; position: absolute; top: 50%; width: 85%; }
.homepage .banner-content { top:30%; }
.banner-content h1 { color: #ffffff; }
.banner-content p { padding-bottom: 30px; padding-right: 100px; } 

/*---- Content Banner ----*/
.content-banner { max-height: 636px; }
.content-banner .items > div > div > div {
    height: 636px;
    max-height: 636px;
    position: relative;
    width: 100%;
    background-position: center center;
    background-size: cover;
}
.content-banner .slick-arrow { border: none; font-size: 0; height: 87px; outline: none; padding: 0; position: absolute; top: 50%; text-indent: -9999px; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 50px; z-index: 1; }
.content-banner .slick-slider .slick-disabled { display: none !important; }
.content-banner .slick-arrow.slick-prev { left: 30px; }
.content-banner .slick-arrow.slick-next { right: 30px; }
.content-banner .slick-arrow:before { color: #ffffff; content: ""; display: block; font-family: "fontAwesome"; font-size: 6rem; line-height: 6rem; text-indent: 0; }
.content-banner .slick-arrow.slick-prev:before { content: "\f053"; }
.content-banner .slick-arrow.slick-next:before { content: "\f054"; }

/* MODULES
   ========================================================================== */

.module { -moz-background-size: cover; -ms-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-size: cover; border-top: 4px solid #EB2D2E; }
.module .title { background: #f0f0f0; border-bottom: 4px solid #EB2D2E; text-align: center; }
.module .title.watermark { background: url("../images/logo-watermark-full.png") no-repeat center center #f0f0f0; background-size: 200px auto; }
.module .title .wrapper { padding-bottom: 50px; padding-top: 50px;}
.module .title h2 { margin: 0; }

/*----- Introduction -----*/
.introduction .wrapper { color: #ffffff; font-family: "Proxima N W01 Xbold", Arial, Helvetica, Verdana, sans-serif; font-size: 2.5rem; letter-spacing: -0.02em; line-height: 3rem; max-width: 95%; padding-right: 22%; text-transform: uppercase; }
.homepage .introduction p { display: none; }
.introduction p { display: block; }

/*----- Request a free quote -----*/
.request-free-quote { background-attachment: fixed; display: table; table-layout: fixed; width: 100%; }
.request-free-quote .wrapper { display: table-cell; padding: 150px 40px; text-align: center; vertical-align: middle; width: 100%; }
.request-free-quote .wrapper h1 { color: #ffffff; font-size: 5rem; line-height: 5rem; margin: 0; }

/*----- Inverted Double Slides -----*/
.inverted-double { background: #ffffff; position: relative; }
.inverted-double:before { background: #f0f0f0; content: ""; display: block; left: 0; height: 100%; position: absolute; top: 0; width: 50%; }
.inverted-double .wrapper { display: table; font-size: 2rem; line-height: 2.5rem; padding: 0; table-layout: fixed; width: 100%; }
.inverted-double .wrapper > .inverted-double-slide { display: table-cell; padding: 110px 40px 110px 100px; vertical-align: top; width: 100%; }
.inverted-double .wrapper > .inverted-double-slide:first-child { padding-left: 40px; padding-right: 100px; }
.inverted-double .wrapper > .inverted-double-slide p,
.inverted-double .wrapper > .inverted-double-slide ul { margin-bottom: 30px; padding: 0; }
.inverted-double .wrapper > .inverted-double-slide ul > li { font-family: "Proxima Nova W01 Medium", Arial, Helvetica, Verdana, sans-serif; font-weight: 400; padding-left: 30px; }
.inverted-double .wrapper > .inverted-double-slide ul > li:before { background: url("../images/icons/tick-icon.png") no-repeat 0 0 transparent; -moz-background-size: 22px auto; -ms-background-size: 22px auto; -o-background-size: 22px auto; -webkit-background-size: 22px auto; background-size: 22px auto; content: ""; display: block; height: 22px; left: 0; position: absolute; top: 0; width: 22px; }
.inverted-double .wrapper > .inverted-double-slide ul > li + li:before { top: 14px; }

/*----- Related Projects -----*/
.related-projects { background: #ffffff; }
.related-projects .project { display: table; table-layout: fixed; width: 100%; }
.related-projects .project > .project-image,
.related-projects .project > .project-text { display: table-cell; vertical-align: top; width: 50%; }

/* Project Image */
.related-projects .project > .project-image { overflow: hidden; }
.related-projects .project > .project-image img { height: 100%; object-fit: cover; width: 100%; }
.ie9 .related-projects .project > .project-image img { height: auto; width: auto; }

/* Project Text */
.related-projects .project > .project-text .inner { padding: 80px 120px 80px 60px; }
.related-projects .project > .project-text .inner h4 { color: #EB2D2E; margin-bottom: 5px; }
.related-projects .project > .project-text .inner h4 a { text-decoration: none; }
.related-projects .project > .project-text .inner p.post-date { font-family: "Proxima N W01 XBold", Arial, Helvetica, Verdana, sans-serif; font-weight: 400; }
.related-projects .project > .project-text .inner .description { line-height: 2.5rem; margin: 40px 0; padding: 40px 0; position: relative; }
.related-projects .project > .project-text .inner .description:before,
.related-projects .project > .project-text .inner .description:after { background: #EB2D2E; content: ""; display: block; height: 2px; left: 0; margin: 0; position: absolute; top: 0; width: 150px; }
.related-projects .project > .project-text .inner .description:after { bottom: 0; top: auto; }
.related-projects .project > .project-text .inner p.tags { color: #EB2D2E; font-family: "Proxima N W01 XBold", Arial, Helvetica, Verdana, sans-serif; text-transform: uppercase; }

/* CONTENT AREA
   ========================================================================== */

/*----- Why Choose -----*/
#why-choose { background: url("../images/logo-watermark.png") no-repeat 0 0 #ffffff; -moz-background-size: 284px auto; -ms-background-size: 284px auto; -o-background-size: 284px auto;	-webkit-background-size: 284px auto; background-size: 284px auto; }
#why-choose .wrapper { padding-bottom: 70px; padding-top: 70px; }
#why-choose .wrapper > p { font-size: 2rem; line-height: 2.5rem; margin-bottom: 50px; }
#why-choose .wrapper > ul > li .image { margin-bottom: 30px; }
#why-choose .wrapper > ul > li h3 { color: #EB2D2E; font-size: 3.5rem; margin-bottom: 20px; }

/*----- Services -----*/
#services { background: #ffffff; }
#services .title { border-top: none; display:none }
#services .services-list ul { margin: 0 -3px; }
#services .services-list ul > li { padding: 0 3px; text-align: center; }
#services .services-list ul > li h4 {
    color: #EB2D2E;
    font-size: 1.2em;
    line-height: 2rem;
    margin-bottom: 60px;
    margin-top: 30px;
    padding: 0 20px;
    text-transform: uppercase;
}
#services .services-list ul > li h4 > a { text-decoration: none; } 
#services .services-list ul > li .image { overflow: hidden; position: relative; }
#services .services-list ul > li .image > a:after { z-index:9001; background: url("../images/logo-watermark-full.png") no-repeat center center transparent; -moz-background-size: cover; -ms-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-size: cover; content: ""; display: block; height: 100%; position: absolute; top: -100%; -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); -moz-transition: 0.4s ease; -ms-transition: 0.4s ease; -o-transition: 0.4s ease; -webkit-transition: 0.4s ease; transition: 0.4s ease; width: 100%; }
#services .services-list ul > li .image > a:before { content: ''; background-color:#222425; position:absolute; top:0px; left: 0px; width:100%; height:100%; opacity:0;-moz-transition: 0.4s ease; -ms-transition: 0.4s ease; -o-transition: 0.4s ease; -webkit-transition: 0.4s ease; transition: 0.4s ease; z-index: 8888; }
#services .services-list ul > li .image span { z-index: 9905;bottom: -100%; display: block; font-family: "Proxima N W01 XBold", Arial, Helvetica, Verdana, sans-serif; font-size: 2.5rem; line-height: 3rem; position: absolute; text-transform: uppercase; -moz-transition: 0.4s ease; -ms-transition: 0.4s ease; -o-transition: 0.4s ease; -webkit-transition: 0.4s ease; transition: 0.4s ease; width: 100%; } 
#services .services-list ul > li:hover .image > a:after { top: 0; -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); }
#services .services-list ul > li:hover .image > a:before { opacity: 1; }
#services .services-list ul > li:hover .image span { bottom: 50%; margin-bottom: -15px; }

/*---- Latest News ----*/
#latest-news { background: #ffffff; }
#latest-news .news-list ul { margin: 0 -3px; }
#latest-news .news-list ul > li { padding: 0 3px 80px; text-align: center; }
#latest-news .news-list ul > li h4 { color: #EB2D2E; font-size: 2.5rem; line-height: 3rem; margin-bottom: 5px; margin-top: 30px; padding: 0 20px; }
#latest-news .news-list ul > li h4 > a { text-decoration: none; }
#latest-news .news-list ul > li p { font-family: "Proxima N W01 XBold", Arial, Helvetica, Verdana, sans-serif; font-weight: 400; }
#latest-news .news-list ul > li .image { overflow: hidden; position: relative; }
#latest-news .news-list ul > li .image > a:after { background: url("../images/logo-watermark-full.png") no-repeat center center transparent; -moz-background-size: cover; -ms-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-size: cover; content: ""; display: block; height: 100%; position: absolute; top: -100%; -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); -moz-transition: 0.4s ease; -ms-transition: 0.4s ease; -o-transition: 0.4s ease; -webkit-transition: 0.4s ease; transition: 0.4s ease; width: 100%; z-index: 9000 }
#latest-news .news-list ul > li .image > a:before { content: ''; background-color:#222425; position:absolute; top:0px; left: 0px; width:100%; height:100%; opacity:0;-moz-transition: 0.4s ease; -ms-transition: 0.4s ease; -o-transition: 0.4s ease; -webkit-transition: 0.4s ease; transition: 0.4s ease; z-index: 8888; }
#latest-news .news-list ul > li .image span { bottom: -100%; display: block; font-family: "Proxima N W01 XBold", Arial, Helvetica, Verdana, sans-serif; font-size: 2.5rem; line-height: 3rem; position: absolute; text-transform: uppercase; -moz-transition: 0.4s ease; -ms-transition: 0.4s ease; -o-transition: 0.4s ease; -webkit-transition: 0.4s ease; transition: 0.4s ease; width: 100%; z-index:9444; } 
#latest-news .news-list ul > li:hover .image > a:before { opacity: 1; }
#latest-news .news-list ul > li:hover .image > a:after { top: 0; -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); }
#latest-news .news-list ul > li:hover .image span { bottom: 50%; margin-bottom: -15px; }

.text-area p { margin-bottom: 30px; }

/*---- Quote Form ----*/
#quote-form form label,
#quote-form form label a,
#quote-form { font-size: 2rem; line-height: 2.5rem; color: #ffffff; }
#quote-form .content { padding-right: 80px; }
#quote-form .content p { margin-bottom: 60px; margin-top: 10px; }
#quote-form h3 { color: #EB2D2E; }
#quote-form .contact p:first-of-type { margin-bottom: 40px; }
#quote-form .contact p { margin-bottom: 10px; }
#quote-form .contact img { margin-top: 40px; }
.map-contain { position: relative; padding-bottom: 75%;  height: 0; overflow: hidden; }
.map-contain iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; }

/* FOOTER
   ========================================================================== */

footer#footer { background: #000000; border-top: 4px solid #EB2D2E; color: #ffffff; }
footer#footer > section { border-bottom: 1px solid #ffffff; }
footer#footer > section + section { border-color: #EB2D2E; border-width: 4px; }

/*----- Footer Top -----*/
footer#footer #footer-top { text-align: center; }
footer#footer #footer-top h3 { display: inline-block; margin: 0 4%; vertical-align: middle; }
footer#footer #footer-top h3 > a { padding-left: 75px; }
footer#footer #footer-top h3 > a:before { background-position: 0 0; background-repeat: no-repeat; background-size: 60px auto; content: ""; display: block; height: 60px; left: 0; position: absolute; top: 0; width: 60px; }
footer#footer #footer-top h3.tel > a:before { background-image: url("../images/icons/footer-tel-icon.png"); }
footer#footer #footer-top h3.email > a:before { background-image: url("../images/icons/footer-email-icon.png"); top: 11px; }

/*----- Footer Middle -----*/
footer#footer #footer-middle h4 { color: #ffffff; }
footer#footer #footer-middle p { line-height: 3.1rem; margin-bottom: 30px; }
footer#footer #footer-middle ul > li:before { background: #ffffff; -moz-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100%; content: ""; display: block; height: 5px; left: 0; position: absolute; top: 8px; width: 5px; }
footer#footer #footer-middle ul > li + li:before { top: 23px; }

/*----- Footer Bottom -----*/
footer#footer #footer-bottom { position: relative; }
footer#footer #footer-bottom #footer-logo { background: url("../images/logo.png") no-repeat center center transparent; background-size: contain; height: 300px; margin: 0 auto; width: 500px; }
footer#footer #footer-bottom #back-to-top { background: #EB2D2E; bottom: 0; height: 115px; padding: 0; position: absolute; right: 0; width: 115px; }
footer#footer #footer-bottom #back-to-top > span { display: block; height: 15px; left: 5px; margin: 0 auto; position: relative; top: -5px; width: 0; }
footer#footer #footer-bottom #back-to-top > span:before,
footer#footer #footer-bottom #back-to-top > span:after { background: #000000; content: ""; display: block; height: 20px; position: absolute; right: 0; top: 50%; transform: rotate(-45deg); width: 2px; }
footer#footer #footer-bottom #back-to-top > span:after { left: -15px; right: auto; transform: rotate(45deg); }

/* PAGE OVERLAY
   ========================================================================== */
	
#page-overlay { background-color: rgba(0, 0, 0, 0.69); display: none; height: 100%; position: fixed; right: 0; top: 0; width: 100%; z-index: 4; }


/* STYLE TEMPLATE
   ========================================================================== */

.text-area ul li { position: relative; padding: 0 10px 15px 25px; }
.text-area ul li::before {
    position: absolute;
    top: 7px;
    left: 10px;
    border-radius: 50%;
    height: 7px;
    width: 7px;
    content: '';
    background: #EB2D2E;
    padding: 0;
}

/*---- Paragraphs ----*/
p { padding: 0; }
	
/* Introduction */
p.introduction { color: #3c434d; font-size: 1.9rem; line-height: 2.7rem; font-weight: 900; margin: 0 auto 40px; max-width: 860px; padding-bottom: 40px; }

/*---- Lists ----*/
ul:before,
ul:after,
ol:before,
ol:after { clear: both; content: ""; display: table; width: 100%; }
ul.left:after,
ul.right:after,
ol.left:after,
ol.right:after { display: none; }

/* Undordered */
ul { list-style: none; margin: 0 0 32px; padding: 0; }
ul li { display: block; list-style: none; padding: 0 10px 0 12px; position: relative; }
ul li + li { padding-top: 15px; padding-top: 1.5rem; }
#content-area ul > li:before { -moz-border-radius: 50%; -webkit-border-radius: 50%; background: #EB2D2E; border-radius: 50%; content: ""; display: block; height: 4px; left: 0; position: absolute; top: 11px; width: 4px; }
#content-area ul > li + li:before { top: 25px; }

/* Ordered */
ol { list-style: none; overflow: hidden; padding: 0 0 32px; }
ol li:before { background-color: #EB2D2E; color: #ffffff; content: counter(step-counter); font-size: 1.3rem; font-weight: 700; height: 18px; left: 0; line-height: 1.8rem; margin: 0; padding: 0; position: absolute; text-align: center; top: 4px; width: 18px; }
ol li { counter-increment: step-counter; display: block; padding: 0 30px; position: relative; }
ol li + li { padding-top: 15px; }
ol > li + li:before { top: 20px; }
	
/*---- Headings ----*/
h1,
h2,
h3,
h4,
h5,
h6 { color: #000000; font-family: "Proxima N W01 Xbold", Arial, Helvetica, sans-serif; font-weight: 400; letter-spacing: -0.02em; margin: 0 0 30px; padding: 0; position: relative; text-transform: uppercase; }

h1 { font-size: 7.7rem; line-height: 6rem; text-transform: uppercase; }
h2 { font-size: 4rem; font-weight: 400; line-height: 5rem; }
h3 { font-size: 3.5rem; font-weight: 400; line-height: 6rem; }
h4 { font-size: 1.9rem; font-weight: 400; line-height: 2.3rem; }
h4 a { font-weight: 900; }
h5 { font-size: 1.6rem; line-height: 2rem; }
h6 { font-size: 1.4rem;	line-height: 2rem; 	}
	
/*---- Images ----*/
img { display: block; height: auto; margin: auto; max-width: 100%; }
img.left { margin: 0 70px 20px 0; max-width: 50%; }	
img.right { margin: 0 0 20px 70px; max-width: 50%; }	

/*---- Forms ----*/
form .form-field { margin-top: 20px; width: 100%; }
form label { display: block; margin-bottom: 5px; width: 100%; }
form input,
form textarea,
form select { background: #ffffff; border: 2px solid #f0f0f0; padding: 20px 25px; width: 100%; }
form select { appearance: none; -moz-appearance: none; -webkit-appearance: none; -moz-border-radius: 0; -webkit-border-radius: 0;  border-radius: 0; display: block; outline: none; width: 100%; }
form textarea { height: 150px; resize: none; }
form input.no-border,
form textarea.no-border { border: none; }
form input[type="checkbox"],
form input[type="checkbox"] + label { display: inline-block; vertical-align: middle; width: auto; }
form input[type="checkbox"] + label { max-width: 90%; }
::-webkit-input-placeholder { color: #3c434d; }
:-moz-placeholder { color: #3c434d; opacity: 1; }
::-moz-placeholder { color: #3c434d; opacity: 1; }
:-ms-input-placeholder { color: #3c434d; }
::-ms-input-placeholder { color: #3c434d; }
::placeholder { color: #3c434d; }

/*---- Tables ----*/
table { width: 100%; }
.two-cols > * {
    width: 50%;
    float: left;
    padding: 30px;
    box-sizing: border-box;
}
.right { float:right }
.left { float: left }


/* ------------ SERVICES LIST -------------- */

#services .services-list ul > li .image span { display: none !important; }



/* =============================================================================
   MEDIA QUERIES
   ========================================================================== */

@media screen and (max-width: 1200px) {
	.parallax .parallax-banner .banner-content { margin-left: 40px; }
	}

@media screen and (max-width: 1024px) {
	
    img.product-pic {
    position: relative;
    right: 0px;
    top: 0;
    margin: 20px;
    }
	/*---- Helpers ----*/

	/* Widths */
	.four-column-width,
	.six-column-width { width: 50%; }

	/* Columns */
	.two-column,
	.three-column,
	.four-column,
	.five-column,
	.six-column { margin: 0 -2%; }
	.three-column .column,
	.four-column .column,
	.five-column .column,
	.six-column .column { padding: 0 2% 4%; width: 50%; }
	.two-column .column:nth-child(2n+1),
	.three-column .column:nth-child(3n+1),
	.four-column .column:nth-child(4n+1),
	.five-column .column:nth-child(5n+1),
	.six-column .column:nth-child(6n+1) { clear: none; }
	.two-column .column:nth-child(2n+1),
	.three-column .column:nth-child(2n+1),
	.four-column .column:nth-child(2n+1),
	.five-column .column:nth-child(2n+1),
	.six-column .column:nth-child(2n+1) { clear: left; }
	
	/*---- Header ----*/
	
	/* Logo */
	#logo { -moz-background-size: 270px auto; -ms-background-size: 270px auto; -o-background-size: 270px auto; -webkit-background-size: 270px auto; background-size: 270px auto; width: 270px; }
	
	/* Request a Quote */
	#request-a-quote { margin-top: 23px; max-width: 170px; }
	#request-a-quote .button { font-size: 1.4rem; }
	
	#why-choose .three-column .column:last-child { float: none; margin: 0 auto; padding-bottom: 0; }
	
	}
	
@media screen and (max-width: 880px) {
	header { height: 116px; }
	#site-wrapper { padding-top: 111px; }
	.content-page #site-wrapper { padding-top: 111px; }

	#banner .pagination { bottom: 40px; left: 50%; top: auto; -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); }
	#banner .pagination > button.pager { display: inline-block; margin: 0 10px; vertical-align: middle; }
	
	.inverted-double .wrapper > .inverted-double-slide { padding: 60px 40px 60px 60px; }
	.inverted-double .wrapper > .inverted-double-slide ul { margin-bottom: 15px; width: 100%; }
	.inverted-double .wrapper > .inverted-double-slide ul + ul{ float: none; } 
	}
	
@media screen and (max-width: 736px) {
	
    .left-section, .right-section { width: 100% !important; }
    
	header { height:90px }
	#site-wrapper { padding-top: 85px; }
	.content-page #site-wrapper { padding-top: 85px; }
	
	/*---- Wrappers ----*/
	.wrapper { padding-left: 25px; padding-right: 25px; }
	
	/*---- Helpers ----*/

	/* Columns */
	.two-column,
	.three-column,
	.four-column,
	.five-column,
	.six-column { margin: 0; }
	.column,
	.two-column .column,
	.three-column .column,
	.four-column .column,
	.five-column .column,
	.six-column .column,
	.two-column-width,
	.three-column-width,
	.four-column-width,
	.half-width,
	.six-column-width,
	.seven-column-width,
	.eight-column-width,
	.nine-column-width,
	.two-column .column:nth-child(2n+1),
	.three-column .column:nth-child(3n+1),
	.four-column .column:nth-child(4n+1),
	.five-column .column:nth-child(5n+1),
	.six-column .column:nth-child(6n+1) { clear: both; padding: 0 0 20px; width: 100%; }
	
	/* Viewports */
	.mobile-view { display: block; }
	.desktop-view { display: none; }
		
	/*---- Header ----*/
	
	/* Navicon Wrapper */
	#navicon-wrapper { padding: 30px; }
	
	/* Logo */
	#logo { -moz-background-size: 200px auto; -ms-background-size: 200px auto; -o-background-size: 200px auto; -webkit-background-size: 200px auto; background-size: 200px auto; height: 38px; width: 200px; }
	
	/* Request a Quote */
	#request-a-quote { margin: 0; }
	#request-a-quote .button { font-size: 0; padding: 34px 30px; text-indent: -9999rem; width: 101px; }
	#request-a-quote .button:after { content: "\f044"; font-size: 3rem; height: 30px; left: 50%; line-height: 3rem; text-indent: 0; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 30px; }
	
	/*---- Parallax Banner ----*/	
	.banner-content { margin-left: 25px; max-width: 85%; }
	.banner-content p { padding-right: 30px; }
	.content-banner .slick-arrow { bottom: 0; height: 40px; top: auto; width: 30px; }
	.content-banner .slick-arrow:before { font-size: 3rem; line-height: 3rem; }
	
	/*---- Modules ----*/	
	
	/* Request Free Quote */
	.request-free-quote .wrapper h1 { font-size: 4rem; line-height: 4rem; }
	
	/* Inverted Double */
	.inverted-double:before { display: none; }
	.inverted-double .wrapper { display: block; }
	.inverted-double .wrapper > .inverted-double-slide { display: block; padding: 40px 25px; width: 100%; }
	.inverted-double .wrapper > .inverted-double-slide:first-child { background: #f0f0f0; padding: 40px; }
	.inverted-double .wrapper > .inverted-double-slide ul { margin-bottom: 15px; }
	
	/* Related Projects */
	.related-projects .project,
	.related-projects .project > .project-image,
	.related-projects .project > .project-text { display: block; table-layout: auto; width: 100%; }
	.related-projects .project.reversed { display: flex; flex-flow: column-reverse; }
	.related-projects .project.reversed > .project-image,
	.related-projects .project.reversed > .project-text { display: flex; }
	.related-projects .project > .project-text .inner { padding: 40px 40px 40px 25px; }
	
	/*---- Content Area ----*/		
	
	/* Services */
	#services .services-list ul,
	#latest-news .news-list ul { margin: 0; }
	#services .services-list ul > li,
	#latest-news .news-list ul > li { padding: 0; }	
	#services .services-list ul > li h4 { margin-bottom: 35px; }
	#services .services-list ul > li:hover .image > a:after,
	#latest-news .news-list ul > li:hover .image > a:after { top: -100%; }
	#services .services-list ul > li:hover .image > a span,
	#latest-news .news-list ul > li:hover .image > a span { bottom: -100%; } 
	
	/* Latest News */
	#latest-news .news-list ul > li { padding-bottom: 35px; }
	
	/* Quote */
	#quote-form .content { margin-bottom: 30px; padding-right: 0; }
	
	/*---- Footer ----*/	
	
	/* Footer Top */
	footer#footer #footer-top { text-align: left; }
	footer#footer #footer-top h3 { display: block; font-size: 2.2rem; line-height: 4.5rem; margin: 0; }
	footer#footer #footer-top h3 > a { display: block; padding-left: 60px; word-break: break-word; }
	footer#footer #footer-top h3 > a:before { background-size: 40px auto; height: 40px; width: 40px; }
	
	/* Footer Bottom */
	footer#footer #footer-bottom #footer-logo { height: 100px; width: 280px; }
	footer#footer #footer-bottom #back-to-top { height: 75px; width: 75px; }
	
	/*---- Style Template ----*/	
	
	/* Heading */
	h1 { font-size: 4.7rem; line-height: 5rem; }
	}

@media screen and (max-width: 640px) {

	/* Images */
	img.left,
	img.right { margin: 0 auto 30px; max-width: 100%; }
	
	#navicon-wrapper { top: 0px; left: 0px; }
	
	}
@media screen and (max-width: 480px) {
	
	/*---- Header ----*/
	
	header { height: 70px; }
	#site-wrapper { padding-top: 65px; }
	.content-page #site-wrapper { padding-top: 65px; }
	
	/* Navicon Wrapper */
	#navicon-wrapper { padding: 20px 15px; }
	
	/* Logo */
	#logo { -moz-background-size: 150px auto; -ms-background-size: 150px auto; -o-background-size: 150px auto; -webkit-background-size: 150px auto; background-size: 150px auto; height: 28px; width: 150px; }

	/* Request a Quote */
	#request-a-quote .button { padding: 24px 15px; width: 71px; }
	
	/*---- Modules ----*/	
	.module .title.watermark { background-size: 80% auto; }
	
	/* Introduction */		
	.introduction .wrapper { padding-right: 10%; }
	
	}