/* MAIN WP CSS FILE -- DESKTOP FIRST STYLESHEET */

/*-------- INTRO SLIDES ------------------------------------------- */

/* @keyframes swap-image{
	0%{
	background: url("../images/intro2.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	}
	50%{
	background: url("../images/intro1.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	}
	100%{
	background: url("../images/intro3.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	}
}  */

.intro-slides{
	position: fixed;
	height: 100vh;
	width: 100vw;
	top: 0;
	left: 0;
	/*color: #fff; */
	/* background-image: url("../images/intro1.jpg"); */
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	/* animation: swap-image 5s infinite normal;  */
	/* animation: swap-image 6s 1 normal;    */
}
.intro-slides .logo{
    width: 100%;
    height: auto;
    z-index: 10;
    text-align: center;
}
.intro-slides .logo img{
	    width: 750px;
}
.intro-slides .logo svg .lga{
	fill:none;
	stroke:#fff;
	stroke-linecap:square;
	stroke-miterlimit:10;

	stroke-width:14px;
 
	stroke-dasharray: 330px;
	stroke-dashoffset: 330; 
	transition: stroke-dashoffset 1s linear; /* ease-in-out*/;
}
.intro-slides .intro-filler,
.intro-slides .intro-slide{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	height: 100vh;
	width: 100vw;
	background-color: var(--navy);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	z-index: 1;
}
.intro-slides .intro-slide#is0{
	/* background-image: url("../images/Intro1.jpg"); */
	/* z-index: 3; */
}
.intro-slides .intro-slide#is1{
	/* background-image: url("../images/Intro2.jpg"); */
	/* z-index: 2; */
}
.intro-slides .intro-slide#is2{
	/* background-image: url("../images/Intro3.jpg"); */
	/* z-index: 1; */
}
/* trigger animation */
.intro-slides .logo.animate svg .lga{
	stroke-dashoffset: 0; 
}
@font-face{ 
	font-family: 'Montserrat'; 
	src: url('../fonts/Montserrat/Montserrat-Regular.ttf') 
	format('truetype'); 
	font-weight: normal; 
	font-style: normal; 
}

@font-face{ 
	font-family: 'Montserrat'; 
	src: url('../fonts/Montserrat/Montserrat-Medium.ttf') 
	format('truetype'); 
	font-weight: 500; 
	font-style: normal; 
}
@font-face{ 
	font-family: 'Montserrat'; 
	src: url('../fonts/Montserrat/Montserrat-Bold.ttf') 
	format('truetype'); 
	font-weight: bold; 
	font-style: normal; 
}
/*--------------------------------------------------------- variables */
:root{
  --navy: #161A36;
  --blue: #3473B8;
  --orange: #F9A01D; /* #E4A850; */
  --white-shade: #F3F3F3;
  --grey: #BCBDC0; /*BCBDC0*/
  --light-grey: rgb(221,222,223);
}


html, body{
	margin: 0;
	padding: 0;
	font-size: 1.33vw; /* body font scales to viewport - all other fonts are REMS to scale to this - when no longer scaling we change ONLY the body tag to hard px */
	letter-spacing: -0.05vw;
	font-family: Montserrat;
	font-weight: normal;
	color: var(--navy);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	/* height: 100%; */
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{
	padding: 0px 0px 0px 0px;
	font-weight: normal;
	margin: 0px 0px 0px 0px;
}
	h1, .h1{
		font-size: 3.15rem;
	}
	h2, .h2{
		font-size: 2.45rem;
		font-weight: 500;
	}
	h3, .h3{
		font-size: 1.85rem;
		font-weight: 500;
	}
	h4, .h4{
		font-size: 1.2rem;
		font-weight: normal;
	}
	h5, .h5{
		font-size: 1.2rem;
    	line-height: 1.4rem;
	}
	h6, .h6{
		font-size: 1rem;
		font-style: normal;
		font-weight: bold;
	}

.text-caption{
	font-size: 0.73rem;
    line-height: 1rem;
}

.text-blockquote{
	font-size: 1.23rem;
    line-height: 1.5rem;
}

.text-paragraph{
	font-size: 1rem;
	line-height: 1.4rem;
}


.wysiwyg a{
	text-decoration: underline;
}

.section_page_default{
	padding-bottom: 4rem;
}

.single-post{
	padding-bottom: 4rem;
}

/*--------------------------------------------------------- Wrapper / Inner */

.inner{
	padding: 0rem 7rem 0rem 7rem;
}

/*-------- GFORM OVERRIDES ------------------------------------------- */

body label,
body .gform_wrapper.gravity-theme .gfield_label,
body .gform_wrapper .gfield_label{
	font-size: 1rem;
	font-style: normal;
	font-weight: bold;
	margin-bottom: 0.5rem;
	margin-top: 1rem;
}

select,
.gform_wrapper.gravity-theme .gfield select,
body .gform_wrapper.gravity-theme .gfield select.small,
body .gform_wrapper.gravity-theme .gfield select.large{
	border: 0;
	border-bottom: 1px solid var(--navy);
	font-size: 1rem;
	font-style: normal;
	font-weight: bold;
	letter-spacing: -0.05vw;
	font-family: Montserrat;
	color: var(--navy);

	padding: 0.5rem 0 1.5rem 0;

	background-image: url(../images/pointer-down.png);
	background-repeat: no-repeat;
	background-position: right 1rem;
	background-size: 33px auto;
}

body .gform_wrapper .gform_fields,
body .gform_wrapper.gravity-theme .gform_fields{
	grid-row-gap: 2.5rem;
}


body .gform_wrapper.gravity-theme .gfield input,
body .gform_wrapper.gravity-theme .gfield input.small,
body .gform_wrapper.gravity-theme .gfield input.large{
	border: 0;
	font-size: 18px;
	border-bottom: 1px solid var(--navy);
	letter-spacing: -0.05vw;
	font-family: Montserrat;
	color: var(--navy);
	padding: 0.5rem 0 1rem 0;
}

body .gform_wrapper.gravity-theme .gfield input[type="file"] {
	border-bottom: 0;
	padding-bottom: 10px;
}

body .gform_wrapper.gravity-theme .gfield input[type="file"] + .gform_fileupload_rules {
	text-align: left;
}

body .gform_wrapper.gravity-theme .gfield input::placeholder{
	border: 0;
	color: var(--navy);
}

body .gform_wrapper.gravity-theme .gfield textarea,
body .gform_wrapper.gravity-theme .gfield textarea.large,
body .gform_wrapper.gravity-theme .gfield textarea.small{
	letter-spacing: -0.05vw;
	font-family: Montserrat;
	color: var(--navy);
	font-size: 1rem;
	border: 1px solid var(--navy);
}

body .gform_wrapper.gravity-theme .gfield textarea::placeholder{
	color: var(--navy);
}

/*-------- CUSTOM REQUEST A QUOTE / TEMPLATE ------------------------------------------- */

.page-template-tpl-request-quote .default-title h1{
	text-align: center;
}

@media only screen and (min-width: 1200px) {
	.page-template-tpl-request-quote .default-title h1{
		font-size: 64px;
		line-height: 74px;
	}
}

.page-template-tpl-request-quote .default-title{
	padding-bottom: 1.5rem;
}

section.request-quote{

}

section.request-quote .inner{
	    padding: 0rem 19rem 0rem 19rem;
}

section.request-quote .text-paragraph{
	text-align: center;
}

body.page-template-tpl-request-quote .gform_wrapper{

}

body.page-template-tpl-request-quote .gform_wrapper form{
	display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
	/* margin-top: 3rem; */
	margin-bottom: 8rem;
}

body.page-template-tpl-request-quote .gform_wrapper .gfield.gfield_html{
	margin-bottom: 2rem;
}

body.page-template-tpl-request-quote .gform_wrapper .gf_page_steps{
	grid-row-start: 2;
	display: flex;
	justify-content: center;
	gap: 30px;
	border-bottom: 0;
	margin-bottom: 0;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields{
	text-align: center;
}

body.page-template-tpl-request-quote .gform_wrapper .gfield_label{
	font-size: 1.2rem;
	font-weight: normal;
    line-height: 1.4rem;
	margin: 0 0 30px;
	text-align: left;
	display: block;
}

body.page-template-tpl-request-quote .gform_wrapper .image-choices-field.image-choices-show-labels .image-choices-choice-text{
	font-size: 22px;
	font-style: normal;
	font-weight: bold;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_page_footer{
	display: flex;
	justify-content: space-between;
	margin-top: 45px;
    margin-bottom: 45px;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_page_footer #gform_ajax_spinner_6{
	display: none;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_page_footer .gform_next_button.button{
	margin-left: auto;
	visibility: hidden;
}

body.page-template-tpl-request-quote .gform_wrapper .gf_step_label{
	display: none;
}

body.page-template-tpl-request-quote .gform_wrapper .gf_step_number{
	border-radius: 0;
	border: 1px solid var(--light-grey);
	font-weight: bold;
	color: var(--light-grey);
}

body.page-template-tpl-request-quote .gform_wrapper .gf_step{
	margin: 0 0 0 0;
}

body.page-template-tpl-request-quote .gform_wrapper .gf_step_active .gf_step_number{
	background-color: var(--navy);
	border: 1px solid var(--navy);
	color: #fff;
}

body.page-template-tpl-request-quote .gform_wrapper .gf_step_completed .gf_step_number:before{
	border-radius: 0;
	border: 1px solid var(--light-grey);
	background-color: var(--light-grey);
}

body.page-template-tpl-request-quote .gform_wrapper .image-choices-field div.gfield_radio{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 30px;
}

body.page-template-tpl-request-quote .gform_wrapper .image-choices-field .image-choices-choice{
	/* max-width: 200px;
	margin: 0 30px 30px 0 !important; */
	width: 200px;
    margin: 0 !important;
}

body.page-template-tpl-request-quote .gform_wrapper .image-choices-field .image-choices-choice:last-child{
	margin-right: 0 !important;
}

body.page-template-tpl-request-quote .gform_wrapper legend.gfield_label{
	text-align: left;
	display: block;
	margin: 0 0 30px;
}

body.page-template-tpl-request-quote .gform_wrapper .ginput_container_radio .gfield_radio {
	display: flex;
	width: 100%;
	gap: 10px 30px;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10{
	display: grid;
	grid-template-columns: 1fr 2rem 1fr;
	grid-template-rows: auto;
	grid-column-gap: 0;
	grid-row-gap: 0;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 .gfield_label{
	font-size: 1rem;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 .gfield{
	margin-top: 2rem;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 .gfield .gfield_radio{
	display: flex;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 .gfield .gfield_radio .gchoice{
	margin-right: 1rem;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 input{
	padding-bottom: 1rem;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 input::placeholder{
	font-size: 1rem; 
	color: var(--grey);
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_24{ /*first name */
	grid-column: auto;
	grid-column-start: 1;
	grid-column-end: 1;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_25{ /*surname */
	grid-column: auto;
	grid-column-start: 3;
	grid-column-end: 3;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_26{ /*email */
	grid-column: auto;
	grid-column-start: 1;
	grid-column-end: 1;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_27{ /*phone */
	grid-column: auto;
	grid-column-start: 3;
	grid-column-end: 3;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_28{ /*suburb */
	grid-column: auto;
	grid-column-start: 1;
	grid-column-end: 1;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_29{ /*postcode */
	grid-column: auto;
	grid-column-start: 3;
	grid-column-end: 3;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_30{ /*finance */
	grid-column: auto;
	grid-column-start: 1;
	grid-column-end: 1;
	text-align: left;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_30 legend{
	margin-bottom: 1rem;
    padding-top: 1rem;
}

body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 #field_6_31{ /*finance */
	grid-column: auto;
	grid-column-start: 3;
	grid-column-end: 3;
	text-align: left;
}

#gform_confirmation_message_6{
	margin: 60px 0;
	text-align: center;
}
#gform_confirmation_message_6 h3 {
	margin: 30px 0;
}

.gform_confirmation_message a {
	color: #f9a01d;
	background: linear-gradient(#f9a01d, #f9a01d) no-repeat center bottom;
	background-size: 0 1px;
	transition: background-size .3s ease-in-out 0s;
}
.gform_confirmation_message a:hover {
	background-size: 100% 1px;
}

/*--------------------------------------------------------- Clearfix */


/* Slider Firefox issue - https://github.com/kenwheeler/slick/issues/982 */
*{ min-height: 0; min-width: 0; }

/* blue outline on focus fields */
*:focus{ outline: none; }

/* blue background on focus fields mobile */
*:focus, *:active{ -webkit-tap-highlight-color: transparent; }

/* highlight on content select */
/*
*::selection{}
*::-moz-selection{}

img::selection{}
img::-moz-selection{}

.bg-white *::selection{
	color: #fff; background-color: rgba(0, 0, 0, 0.99);
}
.bg-black *::-moz-selection{
	color: #000; background-color: rgba(255, 255, 255, 0.99);
}
*/

*::selection{
	color: #fff; background-color: rgba(0, 0, 0, 0.99);
}
*::-moz-selection{
	color: #000; background-color: rgba(255, 255, 255, 0.99);
}


img{ max-width: 100%; height: auto; box-shadow: #000 0em 0em 0em; border: 0; }
img.alignleft{ display: block; margin-left: 0; margin-right: auto; }
img.alignright{ display: block; margin-left: auto; margin-right: 0; }
img.aligncenter{ display: block; margin-left: auto; margin-right: auto; }
img.block{ display: block; width: 100%; }

table{ width: 100%; }
table.alignright, table.alignleft{ width: auto; }
td, th{ padding: 4px; }

iframe,
.vimeo-iframe{ width: 100%; max-width: 100%; min-height: 320px; }
video{ display: block; width: 100%; max-width: 100%; height: auto; object-fit: cover; object-position: center; }

input, 
input[type="submit"], 
button,
select{ 
	border-radius: 0; 
	-webkit-appearance: none; 
	-webkit-border-radius:0px; 
}

input[type="checkbox"],
input[type="radio"]{
	-webkit-appearance:checkbox;
} 

.ginput_container.ginput_container_radio label{
	margin-top: 0;
}

a{ 
	color: inherit; 
	text-decoration: none; 
	transition: all 0.4s ease 0s; 
}
@media (hover: hover){
	a:hover{ 
		transition: all 0.4s ease 0s; 
	}	
}

ul, ol{ margin: 0 0 0 0; padding: 0 0 0 0; }
ul li, ol li{ margin: 0 0 0 0; padding: 0 0 0 0; }

.wysiwyg ul{
	padding-left: 2rem;
	margin-top: 1.5rem;
	list-style-type: circle;
}

input[type=button],
body .gform_wrapper .gform_page_footer input[type=button],
body .gform_wrapper.gform_previous_button.button, 
body .gform_wrapper .gform_save_link.button,
input[type=submit],
a.btn{
	display: inline-block;
	border: 1px solid #000;
	line-height: 2rem;
    font-size: 1rem;
    padding: 0 0.4rem 0 0.4rem;
	background-color: transparent;
	cursor: pointer;
	font-family: Montserrat;
	color: var(--navy);
	letter-spacing: -0.05vw;
	transition: all 0.5s;
}

a.btn.white{
	border: 1px solid #fff;
	color: #fff;
}

a.btn.white:hover{
	background-color: #fff;
	color: var(--navy);
}

input[type=submit]:hover,
a.btn:hover{
	background-color: var(--navy);
	color: #fff;
}

.text-white{
	color: #fff;
}

.text-navy{
	color: var(--navy);
}





	/*
    .img-holder{
      width: 100%;
      height: 300px;
      -webkit-animation: swap-image 5s infinite normal;
      animation: swap-image 5s infinite normal;
    }
*/

/*-------- HEADER + MENU ------------------------------------------- */

.nav-drop{
	position: fixed;
	height: 100vh;
	width: 100vw;
	top: -100vh;
	background-color: var(--navy);
	color: #fff;
	z-index: 1; /* so quote-link and cross can show through*/
}

.menu-open .nav-drop{
	display: block;
}

.nav-drop .main-nav{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	text-align: center;
}

.nav-drop .main-nav .main-nav-inner{
	position: relative;
	width: 50vw;
	overflow: hidden;
	top: 40px
}

.nav-drop .main-nav .main-nav-inner .quote-link{
	display: none; /* only on mobile */
}


.nav-drop .main-nav .main-nav-inner ul,
.nav-drop .main-nav .main-nav-inner li{
	list-style: none;
	padding: 0;
	margin: 0;
}

.nav-drop .main-nav .main-nav-inner ul{
	position: relative;
	/* opacity: 1; */
	left: 0;
	transition: left 0.5s, opacity 0.5s;
}

.nav-drop .main-nav .main-nav-inner ul.slide{
	left: -50vw;
	/* opacity: 0; */
}
.nav-drop .main-nav .main-nav-inner ul.slide.sub_menu_lv{
	left: -100vw;
}
.nav-drop .main-nav .main-nav-inner .sub-menu{
	display: none;
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}


.nav-drop .main-nav .main-nav-inner .drop_menu .sub-menu.open{
	display: block;
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
}
.nav-drop .main-nav .main-nav-inner .drop_menu .sub-menu.sub-open{
	display: block;
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
}
.nav-drop .main-nav .main-nav-inner li.menu-item-has-children::before{
    width: 26px;
    height: 26px;
    font-size: 1.4em;
    content: "\f105";
    position: absolute;
    display: inline-block;
    font-family: FontAwesome;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: -webkit-transform 0.4s;
    -moz-transition: -moz-transform 0.4s;
    transition: transform 0.4s;
    right: 10px;
    margin-top: 20px;
}

.nav-drop .main-nav .main-nav-inner .menu-back{
	height: 24px;
	text-align: center;
}

.nav-drop .main-nav .main-nav-inner .menu-back span{
	display: none;
	cursor: pointer;
}

.nav-drop .main-nav .main-nav-inner .menu-back span svg{
	width: 23px;
	transform: rotateZ(180deg);
}

.nav-drop .main-nav .main-nav-inner > ul > li > a{
	display: block;
	text-align: center;
	font-weight: 500;
	font-size: 2.5rem;
	margin-bottom: 0.8rem;
	position: relative;
	opacity: 0;
	top: -100px; 
}

.nav-drop .main-nav .main-nav-inner .sub-menu li{
	flex-basis: 100%;
}

.nav-drop .main-nav .main-nav-inner .sub-menu a{
	display: block;
	text-align: center;
	font-weight: 500;
	font-size: 1.5rem;
	margin-bottom: 1rem;
}

.nav-drop .main-nav .main-nav-inner a:hover{
	color: var(--blue);
}

.nav-drop .main-nav .main-nav-inner .socials{
	display: flex;
	justify-content: center;
	transition: opacity 0.5s;
}

.nav-drop .main-nav .main-nav-inner .socials.hide{
	opacity: 0;
}

.nav-drop .main-nav .main-nav-inner .socials a{
	display: block;
	width: 0.9rem;
	height: 0.9rem;
	min-height: 17px;
	min-width: 17px;
	margin-right: 0.6rem;
	opacity: 0;
}

.nav-drop .main-nav .main-nav-inner .socials a.facebook-link{

}

.nav-drop .main-nav .main-nav-inner .socials a.linkedin-link{
	margin-right: 0.5rem;
}

.nav-drop .main-nav .main-nav-inner .socials a.instagram-link{
	width: 1rem;
	height: 1rem;
	padding-top: 0.05rem;
	margin-right: 0;
}

body.no-banner{
	padding-top: 7vw; /*cant do rems on body */
}

header{
	/* transition: all 1s; */
	transition: top 1s, background-color 0.3s;
	position: fixed;
	width: 100%;
	z-index: 3;
	top: 0px;
}

header.hide{
	top: -6rem;
}

header#site-header.default{
	/* background-color: #fff;
	color: var(--navy); */
}

/* on sticky header colours are forced navy/white */
.sticky-header header{
	background-color: var(--navy);
	color: #fff;
}

.sticky-header header.text-navy{
	color: #fff;
}
body.sticky-header header .inner-header .left .logo svg,
body.sticky-header header.text-navy .inner-header .left .word-logo svg, 
body.sticky-header header.text-navy .inner-header .left .logo svg{
	fill: #fff;
}

body.sticky-header header.text-navy .inner-header .right .quote-link{
    color: #fff;
    border: 1px solid #fff;
}

body.sticky-header header.text-navy .inner-header .right .menu-icon .menu-button .line{
	background-color: #fff;
}

body.menu-open{
	overflow: hidden;
}

header .inner{
	padding: 0 4rem 0 4rem;

}


header .inner-header{
	display: flex;
	padding: 1rem 0 1rem 0;
}

header .inner-header .left {
	flex-basis: 50%;
	display: flex;
	transition: opacity 0.5s;
}
.home_content_center img.alignright{
	margin: 20px 0;
}
#residential_roofing .wpb_text_column ul{padding-left: 35px;}
#commercial_roofing .wpb_text_column ul{padding-left: 35px;}
#common_issues .wpb_text_column ul{padding-left: 35px;}
#site-footer div.widget_block {
    font-size: 0.73rem;
    line-height: 1rem;
}

@media only screen and (max-width: 740px) {
	header .inner-header .left {
		flex-basis: 25%;
	}
}

header .inner-header .left.hide{
	opacity: 0;
}

header .inner-header .left .logo{
	width: 200px;
}

.menu-open header.text-navy .inner-header .left .logo svg, /* menu open always navy background so needs white logo */
.menu-open header .inner-header .left .logo svg,
header.text-white .inner-header .left .word-logo svg,
header.text-white .inner-header .left .logo svg{
	fill: #fff;
}

header.text-navy .inner-header .left .word-logo svg,
header.text-navy .inner-header .left .logo svg{
	fill: var(--navy);
}

header .inner-header .left .word-logo{
	width: 11.2rem;
	margin-left: 0.5rem;
}

header .inner-header .right{
	flex-basis: 50%;
	display: flex;
	align-items: center;
}

@media only screen and (max-width: 740px) {
	header .inner-header .right {
		flex-basis: 75%;
	}
}

header .inner-header .right .quote-link{
	margin-left: auto;
	position: relative;
	z-index: 2;
}

body.sticky-header header .inner-header .right .quote-link,
body.menu-open header .inner-header .right .quote-link,
header.text-white .inner-header .right .quote-link{
	color: #fff;
	border: 1px solid #fff;
}

body.menu-open header .inner-header .right .quote-link:hover,
header.text-white .inner-header .right .quote-link:hover{
	background-color: #fff;
	color: var(--navy);
}

@media only screen and (max-width: 740px) {
	.inner-header .right .quote-link {
		padding: 6px;
	}
}

header.text-navy .inner-header .right .quote-link{

	color: var(--navy);
	border: 1px solid var(--navy);
}

header.text-navy .inner-header .right .quote-link:hover{
	background-color: var(--navy);
	color: #fff;
}

/* header .inner-header .right .quote-link.btn:hover{
	background-color: var(--navy);
}

.menu-open header .inner-header .right .quote-link.btn{
	border-color: #fff;
	color: #fff;
} */

.menu-open header .inner-header .right .quote-link.btn:hover{
	background-color: #fff;
	color: var(--navy);
}

header .inner-header .right .menu-icon{
	flex-basis: 10%;
}

header .inner-header .right .menu-icon .menu-button{
	z-index: 2;
	position: relative;
	/* width: 1.6rem; */
	width: 30px;
	/* width: 1vw; */
	/* min-width: 30px; */
	/* height: 1.4rem; */
	height: 26px;
	/* min-height: 26px; */
	margin-left: auto;
	cursor: pointer;
}

header .inner-header .right .menu-icon .menu-button .line{
	
	position: absolute;
	height: 4px;
	/* height: 0.35vw; */
	width: 100%;
    top: 0;
	left: 0;
	transform: rotate(0deg);
	transform-origin: left;
	transition: transform 0.5s, opacity 0.5s;
}

header .inner-header .right .menu-icon .menu-button .line{
	background-color: var(--navy);
}

header.text-white .inner-header .right .menu-icon .menu-button .line{
	background-color: #fff;
}

header.text-navy .inner-header .right .menu-icon .menu-button .line{
	background-color: var(--navy);
}

.sticky-header header .inner-header .right .menu-icon .menu-button .line,
.menu-open header .inner-header .right .menu-icon .menu-button .line{
	background-color: #fff;
}

header .inner-header .right .menu-icon .menu-button .line.xtop{

}

header .inner-header .right .menu-icon .menu-button .line.xcenter{
	top: 11px;
	/* top: 0.7vw; */
}

header .inner-header .right .menu-icon .menu-button .line.xbottom{
	top: 22px;
	/* top: 1.4vw; */
}

.menu-open header .inner-header .right .menu-icon .menu-button .line.xtop{
	transform: rotate(45deg);
    
}

.menu-open header .inner-header .right .menu-icon .menu-button .line.xcenter{
	opacity: 0;
}

.menu-open header .inner-header .right .menu-icon .menu-button .line.xbottom{
	transform: rotate(-45deg);
    top: 21px;
}

.default-title{
	padding: 4rem 0 4rem 0;
}

/*-------- TITLE BANNER --------------------------------------------------- */

section.title-banner{
	
}

section.title-banner .banner-title{
	padding: 8rem 0 4rem 0;
}
section.title-banner .banner-title .subtitle{
	font-weight: 400;
}

@media only screen and (min-width : 1024px){
	section.title-banner .banner-title .inner h1 {
		margin-bottom: 30px;
	}
}

section.title-banner .banner-image{
	
}

section.title-banner .banner-image  img{
	width: 100%;
	display: block;
	
}

section.title-banner .banner-image .banner-image-inner{
	position: relative;
	padding-bottom: 3rem;
}


section.title-banner .banner-image .banner-image-inner .floating-text{
	width: 40rem;
	background-color: #fff;
	color: #000;
	position: absolute;
	bottom: 0px;
	left: 0px;
	padding: 3rem 5rem 0 0;
}

section.title-banner .banner-image .banner-image-inner .floating-text h2{
	margin-bottom: 2rem;
}

/*-------- CONTent IMAGE BANNER --------------------------------------------------- */

section.content-image-banner{
	padding-top: 8rem;
	padding-bottom: 4rem;
}

section.content-image-banner a{
	text-decoration: underline;
}

section.content-image-banner .block-wrap{
	display: flex;
}

section.content-image-banner .block-wrap .left-block{
	flex-basis: 40%;
	padding-right: 10%;
}

section.content-image-banner .block-wrap .left-block h1{
	margin-bottom: 1.7rem;
}

section.content-image-banner .block-wrap .left-block .breadcrumb{
	margin-bottom: 1.7rem;
}

section.content-image-banner .block-wrap .right-block{
	flex-basis: 50%;
}

section.content-image-banner .block-wrap .right-block .image{

}


/* @media (hover: hover){
	ul.menu-mainnav > li > a:hover{}
	ul.menu-mainnav > li.menu-item-has-children ul li > a:hover{}
} */

/*-------- SECTION TEXT RIGHT IMAGE --------------------------------------------------- */

section.text-right-image{
	display: flex;
	padding: 5rem 0 4rem 0;
}

section.text-right-image .text-content{
	flex-basis: 36%;
	padding: 0 4rem 0 7rem;
	display: flex;
	align-items: center;
}

section.text-right-image .text-content .text-content-inner{

}

section.text-right-image .text-content .text-content-inner .h3{
	margin-bottom: 1rem;
}

section.text-right-image .text-content .text-content-inner .text-paragraph{
	margin-bottom: 1.5rem;
}

section.text-right-image .image-content{
	flex-basis: 50%;
}

section.text-right-image .image-content img{
	width: 100%;
}

/*-------- SECTION ACCORDION  --------------------------------------------------- */

section.accordion{
	padding: 4rem 0 7rem 0;
}

section.accordion .accordion-list{

}

section.accordion .accordion-list h3{
	border-top: 1px solid var(--navy);
	cursor: pointer;
	padding-top: 1rem;
	margin-top: 2rem;
	background-image: url(../images/pointer-down.png);
	background-repeat: no-repeat;
	background-position: right 28px;
	background-size: 33px auto;
}

section.accordion .accordion-list h3.ui-accordion-header-active{
	background-image: url(../images/pointer-up.png);
}

section.accordion .accordion-list .text-paragraph{
	padding-top: 2rem;
}

/*-------- SECTION FULL WIDTH TEXT  --------------------------------------------------- */

section.full-width-text{
	padding: 7rem 0 7rem 0;
}

section.full-width-text .indent{
	padding-left: 7rem;
}

section.full-width-text .indent .h1 + a{
	margin-top: 1.5rem;
}

/*-------- SECTION CONTENT SCROLLING POPOUT  ------------------------------------------- */

section.content-scrolling-popout{
	padding: 7rem 0 7rem 7rem;
	background-color: var(--light-grey);
	/* position: relative; */
}

section.content-scrolling-popout .block-wrap{
	display: flex;
}

section.content-scrolling-popout .left-block{
	flex-basis: 58%;
	padding-right: 5%;
}
section.content-scrolling-popout .left-block .wysiwyg ol {
	list-style: none;
	counter-reset: numeric-list;
}

section.content-scrolling-popout .left-block .wysiwyg ol li {
	counter-increment: numeric-list;
	padding-left: 40px;
	position: relative;
	margin-bottom: 5px;
}

@media only screen and (max-width : 767px){
	section.content-scrolling-popout .left-block .wysiwyg ol li {
		padding-left: 25px;
	}
}


section.content-scrolling-popout .left-block .wysiwyg ol li:before {
	content: counter(numeric-list)'.';
	position: absolute;
	top: 0;
	left: 0;
}

section.content-scrolling-popout .right-block{
	flex-basis: 37%;
	position: relative;
}

/* section.content-scrolling-popout .content{
	padding-right: 21rem;
} */

section.content-scrolling-popout .right-block .popout{
	background-color: var(--navy);
	color: #fff;
	top: 7rem;
	padding: 2.5rem;
	position: sticky;
}

section.content-scrolling-popout .right-block .popout a{
	/* display: block; */
	margin-top: 1.5rem;
}

/* section.content-scrolling-popout .popout{
	background-color: var(--navy);
	color: #fff;
	
	width: 24rem;
	top: 7rem;
	margin-left: auto;


	position: sticky;
} */

/*-------- SECTION FULL MULTI HEIGHT PARALLEL  --------------------------------------------------- */

section.multi-height-parallel{
	padding: 11rem 0 0;
}

@media only screen and (max-width: 767px) {
	section.multi-height-parallel{
		padding: 45px 0 0;
	}
}
section.multi-height-parallel .inner{
	padding-bottom: 8rem;
}

@media only screen and (max-width: 740px) {
	section.multi-height-parallel .inner{
		padding-bottom: 45px;
	}
}

section.multi-height-parallel .grey-inner{
	background-color: var(--light-grey);
	padding-bottom: 8rem;
}
section.multi-height-parallel.heading-offset{}
section.multi-height-parallel.heading-offset .block-header-wrap{
	margin-bottom: 5.5rem;
  padding: 7rem 0 5.5rem;
}
section.multi-height-parallel.heading-offset .block-wrap{}


section.multi-height-parallel .block-wrap{
	display: flex;
}

section.multi-height-parallel .block-wrap .left-block{
	flex-basis: 50%;
	position: relative;
    top: -5.5rem;
	margin-right: 0.7rem;
}

section.multi-height-parallel .block-wrap .right-block{
	flex-basis: 50%;
	margin-top: 5rem;
	margin-left: 0.7rem;
}

section.multi-height-parallel .block-wrap .block{
}

section.multi-height-parallel .block-wrap .block .image{
	margin-bottom: 2rem;
}

section.multi-height-parallel .block-wrap .block .image img{
	width: 100%;
}

section.multi-height-parallel .block-wrap .block .h3{
	margin-bottom: 1.5rem;
}

section.multi-height-parallel .block-wrap .block h5{
	margin-bottom: 1.5rem;
}

section.multi-height-parallel .block-wrap .block .indent{
	padding-left: 1.6rem;
}

/*-------- CONTENT SLIDER  --------------------------------------------------- */

section.content-slider{
	padding: 9rem 0 9rem 0;
}

section.content-slider .h3{
	border-top: 1px solid #000;
	margin-bottom: 4rem;
	padding-top: 2rem;
}

section.content-slider .slider{
	margin: 0rem 5rem 0rem 5rem;
}

section.content-slider .slider .slide-item{
	margin-left: 3rem;
}

section.content-slider .slider .slide-item .image{
	height: 10rem;
	/* height: 15rem; */
	/* display: flex; */
	display: block;
	align-items: center;
	background-repeat: no-repeat;
	background-size: 10rem auto;
	background-position: left center;
}

section.content-slider .slider .slide-item .image img{
	/* height: 50px;
	width: auto; */
}

section.content-slider .slider .slide-item h4{
	margin-bottom: 2rem;
}

section.content-slider .slider .slick-arrow{
	position: absolute;
	top: 50%;
	border: none;
    outline: none;
    background-repeat: no-repeat;
	background-position: center center;
	background-color: transparent;
	background-size: 16px auto;
	cursor: pointer;
	font-size: 0;
	line-height: 0;
	width: 2rem;
	height: 2rem;
}

section.content-slider .slider .slick-arrow.slick-prev{
	left: 0px;
	background-image: url(../images/arrow-left.png);
	
}

section.content-slider .slider .slick-arrow.slick-next{
	right: 0px;
	background-image: url(../images/arrow-right.png);
}

section.content-slider .slider .slick-list{
	margin: 0rem 3rem 0rem 3rem;
}

section.content-slider .slider .slick-list .slick-slide{
	height: 100%;
}

section.content-slider .slider .slick-list .slick-slide > div{
	height: 100%;
}

section.content-slider .slider .slick-list .slick-track{
	height: 16rem;
}

/*-------- CONTACT FORM MAP  --------------------------------------------------- */

section.contact-form-map{
	padding: 2rem 0 4rem 0;
}

section.contact-form-map .inner{
	padding-right: 4rem;
}

section.contact-form-map .block-wrap{
	display: flex;
}

section.contact-form-map .block-wrap .left-block{
	flex-basis: 48%;
	padding-right: 11%;
}

section.contact-form-map .block-wrap .right-block{
	flex-basis: 40%;
}

section.contact-form-map .block-wrap .right-block h6{
	margin-top: 1rem;
	margin-bottom: 1rem;
}

section.contact-form-map .block-wrap .right-block a.btn{
	margin-top: 2rem;
}

/*-------- MARQUEE SCROLLER  --------------------------------------------------- */

section.marquee-scroller{
	padding: 8rem 0 8rem 0;
	background-color: var(--light-grey);

}

section.marquee-scroller .h3{
	border-top: 1px solid #000;
	margin-bottom: 4rem;
	padding-top: 2rem;
}

section.marquee-scroller .marquee-item{
	
}

section.marquee-scroller .marquee-item a{
	display: flex;
	justify-content: center;
}

section.marquee-scroller .marquee-item a img{
	
}

/*-------- TEXT RIGHT OVERLAP IMAGE --------------------------------------------------- */


section.text-right-overlap-image{
	padding: 0 0 8rem 0;
}

@media only screen and (max-width: 767px) {
	section.text-right-overlap-image + .left-titles-and-text {
		margin-top: -8rem;
	}
}

section.text-right-overlap-image .grey-inner{
	background-color: var(--light-grey);
	
}

section.text-right-overlap-image .block-wrap{
	display: flex;
	padding-left: 7rem;
	padding-top: 3rem;
}

section.text-right-overlap-image .block-wrap .left-block{
	flex-basis: 50%;
}

section.text-right-overlap-image .block-wrap .left-block .h6{
	color: var(--grey);
	text-transform: uppercase;
	margin-bottom: 2rem;
}

section.text-right-overlap-image .block-wrap .left-block .text-paragraph{
	padding-bottom: 2rem;
}

section.text-right-overlap-image .block-wrap .left-block h3{
	margin-bottom: 2rem;
}

section.text-right-overlap-image .block-wrap .right-block{
	flex-basis: 43%;
	position:relative;
	margin-left: auto;
	display: flex;
	align-items: center;
}

section.text-right-overlap-image .block-wrap .right-block img{
	position: relative;
	top: 6.5rem;
}

/*-------- LEFT IMAGE TEXT --------------------------------------------------- */

section.left-image-text{
	padding: 7rem 0 4rem 0;
}

section.left-image-text .block-wrap{
	display: flex;
}

section.left-image-text .block-wrap .left-block{
	flex-basis: 40%;
}

section.left-image-text .block-wrap .left-block .image{

}

section.left-image-text .block-wrap .left-block .image img{
	width: 100%;
}

section.left-image-text .block-wrap .right-block{
	display: flex;
	flex-basis: 60%;
	align-items: center;
}

section.left-image-text .block-wrap .right-block .indent{
	padding: 0 7rem 0 8rem;
}

section.left-image-text .block-wrap .right-block .h6{
	text-transform: uppercase;
	color: var(--grey);
	margin-bottom: 2rem;
}

section.left-image-text .block-wrap .right-block h3{
	margin-bottom: 2rem;
}

/*-------- LEFT TITLES AND TEXT --------------------------------------------------- */

section.left-titles-and-text{
	padding: 7rem 0 6rem 0;
}

section.left-titles-and-text .block-wrap{
	display: flex;
}

section.left-titles-and-text .block-wrap .left-block{
	flex-basis: 50%;
}

section.left-titles-and-text .block-wrap .left-block .h6{
	text-transform: uppercase;
	color: var(--grey);
	margin-bottom: 2rem;
}

section.left-titles-and-text .block-wrap .left-block h3{
	padding-right: 5%;
}

section.left-titles-and-text .block-wrap .right-block{
	flex-basis: 50%;
}

section.left-titles-and-text .block-wrap .left-block > *:first-child,
section.left-titles-and-text .block-wrap .right-block > *:first-child{
	margin-top: 1rem;
}



/*-------- LEFT IMAGE AND CONTENT --------------------------------------------------- */

section.left-image-content{
	padding: 6rem 0 10rem 0;
	background-color: var(--light-grey);
}

section.left-image-content .block-wrap{
	display: flex;
	margin-top: 6rem;
}

section.left-image-content .block-wrap .left-block{
	flex-basis: 40%;
}

section.left-image-content .block-wrap .left-block .image{

}

section.left-image-content .block-wrap .right-block{
	flex-basis: 60%;
}

section.left-image-content .block-wrap .right-block .content{
	margin: 0 7rem 0 8.5rem;
}

/*-------- PARALLEL GRID --------------------------------------------------- */

section.parallel-grid{
	/*padding: 14rem 0 7rem 0;*/
	padding: 7rem 0 7rem 0;
}

section.parallel-grid .parallel-list{
	display: flex;
	flex-wrap: wrap;
	margin-left: 7rem;
	padding-top: 4rem;
}

section.parallel-grid .parallel-list .parallel-item{
	flex-basis: 41.5%;
	margin-bottom: 4rem;
	margin-top: -4rem;
}

section.parallel-grid .parallel-list .parallel-item:nth-child(2){ /* only second one */	
	/*margin-top: 5rem;*/
}

section.parallel-grid .parallel-list .parallel-item:nth-child(2n+2){ /* every second */
	margin-top: 4rem;
	margin-left: auto;
}

section.parallel-grid .parallel-list .parallel-item .image{
	margin-bottom: 1.8rem;
}

section.parallel-grid .parallel-list .parallel-item h3{
	margin-bottom: 1.1rem;
}

section.parallel-grid .parallel-list .parallel-item .text-paragraph{
	margin-bottom: 1.5rem;
}

/*-------- LEFT TITLES AND TEXT --------------------------------------------------- */

section.feature-grid{
	padding: 7rem 0 4rem 0;
	background-color: var(--navy);
	color: #fff;
}

section.feature-grid h3{
	margin-bottom: 1.2rem;
}

section.feature-grid .feature-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

section.feature-grid .feature-list .feature-item{
	flex-basis: 14rem;
	margin-bottom: 2rem;
}

section.feature-grid .feature-list .feature-item h5{
	margin-bottom: 0.7rem;
}

section.feature-grid .feature-list .feature-item .icon{
	
	display: flex;
    align-items: flex-end;
    height: 6rem;
	margin-bottom: 1.7rem;
}

section.feature-grid .feature-list .feature-item .icon img {
	width: 65px;
	height: 65px;
	object-fit: contain;
}

/*-------- PHOTO GRID --------------------------------------------------- */

section.photo-grid{
	padding: 7rem 0 2.5rem 0;
	background-color: var(--light-grey);
}

section.photo-grid .h3{
	margin-bottom: 2rem;
}

section.photo-grid .photo-list{
	margin-top: 4rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	
}

section.photo-grid .photo-list .photo-item{
	flex-basis: 14rem;
	margin-bottom: 2rem;
}

section.photo-grid .photo-list .photo-item .photo{
	margin-bottom: 1.4rem;
}

section.photo-grid .photo-list .photo-item .photo img{
	width: 100%;
}

section.photo-grid .photo-list .photo-item .photo-caption{
	margin-bottom: 0.5rem;
}

/*-------- LEFT TEXT SCROLLER --------------------------------------------------- */

section.left-text-scroller{
	padding: 4rem 0 7rem 0;
	background-color: var(--light-grey);
}

section.left-text-scroller .block-wrap{
	display: flex;
}

section.left-text-scroller .block-wrap .left-block{
	flex-basis: 50%;
}

section.left-text-scroller .block-wrap .left-block .indent{
	margin-right: 7rem;
}

section.left-text-scroller .block-wrap .left-block .h3{
	margin-bottom: 1rem;
}

section.left-text-scroller .block-wrap .right-block{
	flex-basis: 50%;
	display: flex;
    align-items: center;
	justify-content: center;
}

section.left-text-scroller .block-wrap .right-block .scroller{
	width: 450px;
	margin-left: auto;
}

section.left-text-scroller .block-wrap .right-block .scroller .scroller-item{
	
}

section.left-text-scroller .block-wrap .right-block .scroller .scroller-item a img{
	
}

/*-------- BLOCKQUOTE SLIDER --------------------------------------------------- */

section.blockquote-slider{
	padding: 7rem 0 7rem 0;
}

section.blockquote-slider .blockquote-slider-inner{
	padding: 0 15rem 0 15rem;
}

section.blockquote-slider h2.h6{
	text-transform: uppercase;
	color: var(--grey);
	margin-bottom: 1.5rem;
}

section.blockquote-slider h3{
	margin-bottom: 5rem;
}

section.blockquote-slider .blockquotes{
	padding: 0 15rem 0 15rem;
}

section.blockquote-slider .blockquotes .slick-arrow.slick-prev{
    left: 3rem;
    background-image: url(../images/arrow-left.png);
}

section.blockquote-slider .blockquotes .slick-arrow.slick-next{
	right: 3rem;
    background-image: url(../images/arrow-right.png);
}

section.blockquote-slider .blockquotes .slick-arrow{
    position: absolute;
    top: 50%;
    border: none;
    outline: none;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: transparent;
    background-size: 16px auto;
    cursor: pointer;
    font-size: 0;
    line-height: 0;
    width: 2rem;
    height: 2rem;
}

section.blockquote-slider .blockquotes .blockquote-item{

}

section.blockquote-slider .blockquotes .blockquote-item .blockquote{
	margin-bottom: 1.7rem;
}

/*-------- FOOTER + MENU --------------------------------------------------- */

#site-footer{
	background-color: var(--navy);
	color: #fff;
}



#site-footer .inner{
	padding-top: 4rem;
	padding-bottom: 2rem;
}

.footer-grid{
	display: grid;
	grid-template-columns:1fr 1fr 2fr;
	grid-template-rows: 1fr;
	column-gap: 4rem;
}

.footer-grid h6{
	margin-bottom: 1rem;
}

.footer-grid .grid-content{

}

.footer-grid .grid-quick-links{
	
}

	.footer-grid .footer-menu{
		
	}

	.footer-grid .footer-menu a{
		display: block;
		margin-bottom: 0.2rem;
	}

	.footer-grid .footer-menu a:hover{
		color: var(--light-grey);
	}

.footer-grid .grid-footer-menu{
	
}

.footer-grid .grid-links{
	text-align: right;
}

.footer-grid .grid-links a.btn{
	margin-bottom: 1.4rem;
}



.footer-grid .socials{
	display: flex;
	margin-top: 1rem;
}

.footer-grid .socials a{
	display: block;
	width: 0.9rem;
	height: 0.9rem;
	min-height: 17px;
	min-width: 17px;
	margin-right: 0.6rem;
}

.footer-grid .socials a.facebook-link{

}

.footer-grid .socials a.linkedin-link{
	margin-right: 0.5rem;
}

.footer-grid .socials a.instagram-link{
	width: 1rem;
	height: 1rem;
	padding-top: 0.05rem;
	margin-right: 0;
}

#site-footer .footer-bottom{
	display: flex;
	color: var(--light-grey);
	margin-top: 4rem;
}

#site-footer .footer-bottom a:hover{
	color: #fff;
}

#site-footer .footer-bottom .copyright{
	
}

#site-footer .footer-bottom .bottom-links{
	margin-left: auto;
}

#site-footer .footer-bottom .bottom-links a{
	display: inline-block;
	margin-left: 1rem;
}

/* ul.menu-footernav{}
ul.menu-footernav > li{}
ul.menu-footernav > li > a{}

@media (hover: hover){
	ul.menu-footernav > li > a:hover{}
} */

/*-------- BANNER ---------------------------------------------------------- */

/*-------- HOME ------------------------------------------------------------ */

/*-------- PAGE ------------------------------------------------------------ */

/*-------- POST ------------------------------------------------------------ */

/*-------- ARCHIVE --------------------------------------------------------- */


/*---------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------*/
/*-------------------------------------------------------- RESPONSIVE STYLES */
/*---------------------------------------------------------------------------*/
/*
COMMON SCREEN SIZES (May 2021) https://gs.statcounter.com/screen-resolution-stats
Desktop:
1. 1920x1080 (~21%)
2. 1366x768 (~20%)
3. 1536x864 (~10%)
4. 1440x900 (~7%)
5. 1440x900 (~6%)
6. 1280x720 (~4%)
Tablet:
1. 768x1024 (~42%)
2. 1280x800 (~8%)
3. 800x1280 (~6%)
4. 601x962 (~5%)
5. 810x1080 (~4%)
Mobile: 
1. 360x640 (~11%)
2. 414x896 (~7%)
3. 360x780 (~6%)
4. 375x667 (~5%)
5. 360x800 (~5%)
5. 360x760 (~5%)

Note: 
- Consider capping width at 1440px, or as seen in Inklab design file
- Google defines 12px as the MINIMUM font size for mobile
- Google defines 10~8px as the MINIMUM space betwen clickable elements
- Google recommends ~46px as the best size for a clickable element
- Font size smaller than 16px on form input in mobile triggers auto-zoom on click: avoid! 
*/

/* ------ we stop scaling larger at 1920px, all fonts/padding REM based on this size */
@media only screen and (min-width : 1920px){
	body{
		font-size: 26px;
	}
	.inner{
		
		max-width: 1920px;
		margin: 0 auto;
	}
}

/*----------- normal responsive -----------*/

@media only screen and (max-width : 1200px){
	html, body{
		font-size: 1.63vw;
	}

	section.title-banner .banner-image .banner-image-inner .floating-text{
		width: 35rem;
		padding: 2rem 3rem 0 0;
	}

	section.title-banner .banner-image .banner-image-inner{
		padding-bottom: 5rem;
	}

	section.text-right-overlap-image .block-wrap{
		padding-bottom: 3rem;
	}

	.footer-grid{
		grid-template-columns: 1fr 1fr 1fr;
	}

	.footer-grid .grid-links{
		text-align: left;
	}

	section.left-image-text .block-wrap .right-block .indent{
		padding: 0 7rem 0 6rem;
	}

	section.parallel-grid{
		/*padding-top: 7rem;*/
		padding-top: 4rem;
		padding-bottom: 4rem;
	}

	section.request-quote .inner{
		padding: 0 10rem 0 10rem;
	}
	
}



@media only screen and (max-width : 1024px){
	html, body{
		font-size: 2vw;
	}

	header .inner-header .right .menu-icon{
		flex-basis: 15%;
	}

	.inner{
		padding: 0rem 4rem 0rem 4rem
	}

	section.parallel-grid .parallel-list{
		margin-left: 0;
	}

	section.full-width-text{
		padding: 4rem 0 4rem 0;
	}

	section.content-slider .slider .slide-item{
		margin-left: 0;
		text-align: center;
	}

	section.content-slider .slider .slide-item .image{
		background-position: center center;
	}

	section.content-slider .slider .slick-list{
		padding-bottom: 3rem;
	}

	section.text-right-overlap-image .block-wrap .right-block img{
		top: 0;
	}

	section.text-right-overlap-image .block-wrap{
		padding-left: 4rem;
	}

	section.left-image-text .block-wrap .right-block .indent{
		padding: 0 4rem 0 5rem;
	}

	section.blockquote-slider .blockquote-slider-inner{
		padding: 0 4rem 0 4rem;
	}

	section.blockquote-slider .blockquotes{
		padding: 0 6rem 0 6rem;
	}

	section.left-image-content .block-wrap .right-block .content{
		margin: 0 3rem 0 4.5rem;
	}

	section.accordion .accordion-list h3{
		padding-top: 2rem;
	}

	section.content-scrolling-popout{
    	padding: 7rem 0 7rem 4rem;
	}

	section.request-quote .inner{
		padding: 0 4rem 0 4rem;
	}

}

/* Mobile */
@media only screen and (max-width : 740px){

	html, body{
		font-size: 2.5vw;
	}

	h1, .h1{
		font-size: 2.47rem;
		line-height: 2.6rem;
	}

	h2, .h2{
		font-size: 2.7rem;
		line-height: 2.9rem;
	}

	h3, .h3{
		font-size: 2.5rem;
		line-height: 2.8rem;
	}

	h4, .h4{
		font-size: 2.1rem;
		line-height: 2.4rem;
	}

	h5, .h5{
		font-size: 1.9rem;
		line-height: 2.2rem;
	}

	h6, .h6{
		font-size: 1.7rem;
		line-height: 2rem;
	}

	h1 br, 
	.h1 br, 
	h2 br, 
	.h2 br, 
	h3 br, 
	.h3 br, 
	h4 br, 
	.h4 br, 
	h5 br, 
	.h5 br, 
	h6 br, 
	.h6 br{
		display: none;
	}

	.wysiwyg,
	.text-paragraph {
		font-size: 1.8rem;
		line-height: 2rem;
	}

	.text-caption{
		font-size: 1.5rem;
		line-height: 2rem;
	}

	.gform_confirmation_message,
	.text-blockquote{
		font-size: 1.7rem;
		line-height: 2.2rem;
	}

	.inner{
		padding: 0 2rem 0 2rem;
	}

	.default-title{
		padding: 8rem 0 4rem 0;
	}

	header .inner{
		padding: 0 2rem 0 2rem;
	}

	body label, 
	body .gform_wrapper.gravity-theme .gfield_label, 
	body .gform_wrapper .gfield_label{
		font-size: 1.7rem;
		line-height: 2.2rem;
	}

	body .gform_wrapper.gravity-theme input:not([type=radio]):not([type=checkbox]):not([type=image]):not([type=file]),
	input[type=submit], a.btn{
		font-size: 1.8rem;
		padding: 1rem;
		margin-bottom: 0;
		line-height: 2rem;
    	min-height:auto;
	}

	.nav-drop .main-nav .main-nav-inner > ul > li > a{
	/* .nav-drop .main-nav .main-nav-inner > a{ */
		font-weight: normal;
		margin-bottom: 2.8rem;
	}

	.nav-drop .main-nav .main-nav-inner .quote-link{
		display: inline-block;
		font-size: 1.6rem;
    	padding: 0.7rem;
		margin-bottom: 2.8rem;
	}

	.nav-drop .main-nav .main-nav-inner .sub-menu{
		margin-bottom: 2.8rem;
	}

	header .inner-header .left.hide{
		opacity: 1;
	}

	header .inner-header .left .word-logo{
		/* opacity: 0; */
		display: none;
	}

	.nav-drop .main-nav .main-nav-inner .socials a{
		margin-right: 1rem;
	}

	.nav-drop .main-nav .main-nav-inner .socials a.linkedin-link{
		margin-right: 1rem;
	}

	header .inner-header .right .menu-icon{
		flex-basis: auto;
		flex-shrink: 0;
		margin-left: 20px;
	}

	header .inner-header{
		padding: 1.7rem 0 1rem 0;
	}

	header .inner-header .left .logo{
		width: 250px;
	}

	body .gform_wrapper.gravity-theme .gfield textarea, 
	body .gform_wrapper.gravity-theme .gfield textarea.large, 
	body .gform_wrapper.gravity-theme .gfield textarea.small,
	body .gform_wrapper.gravity-theme .gfield input::placeholder, 
	body .gform_wrapper.gravity-theme .gfield input, 
	body .gform_wrapper.gravity-theme .gfield input.small, 
	body .gform_wrapper.gravity-theme .gfield input.large,
	select, .gform_wrapper.gravity-theme .gfield select, 
	body .gform_wrapper.gravity-theme .gfield select.small, 
	body .gform_wrapper.gravity-theme .gfield select.large{
		font-size: 1.8rem;
	}

	section.contact-form-map .inner{
		padding: 0 2rem 0 2rem;
	}

	section.contact-form-map .block-wrap{
		display: block;
	}

	section.contact-form-map .block-wrap .left-block{
		padding-right: 0;
		padding-bottom: 4rem;
	}

	section.content-scrolling-popout .block-wrap{
		display: block;
	}

	section.content-scrolling-popout{
		padding: 7rem 2rem 7rem 2rem;
	}

	section.content-scrolling-popout .right-block{
		margin-top: 6rem;
	}

	section.content-image-banner .block-wrap{
		display: block;
	}

	section.content-image-banner .block-wrap .left-block{
		padding-right:0;
		margin-bottom: 4rem;
	}

	section.left-image-content .block-wrap .right-block .content{
		margin: 0 0 0 0;
	}

	section.left-image-content .block-wrap .right-block{
		padding: 0 2rem 0 2rem;
		margin-top: 4rem;
	}

	section.left-image-content{
		padding-bottom: 4rem;
	}

	section.title-banner .banner-image .banner-image-inner .floating-text{
		width: auto;
		position: relative;
		padding: 2rem 2rem 2rem 2rem;
		margin-top: 3rem;
	}

	section.title-banner .banner-image .banner-image-inner{
		padding-bottom: 0rem;
	}

	section.parallel-grid{
		padding: 4rem 0 4rem 0;
	}

	section.parallel-grid .parallel-list{
		display: block;
		padding-top: 0;
	}

	section.parallel-grid .parallel-list .parallel-item{
		margin-top: 0;
		margin-bottom: 30px;
	}

	section.left-image-content .block-wrap{
		display: block;
	}

	section.left-image-text .block-wrap{
		display: block;
	}

	section.left-image-text .block-wrap .right-block .indent{
		padding: 6rem 2rem 0 2rem;
	}

	section.left-titles-and-text{
		padding: 4rem 0 4rem 0;
	}

	section.left-titles-and-text .block-wrap{
		display: block;
	}

	section.left-titles-and-text .block-wrap .left-block h3{
		margin-bottom: 2rem;
	}

	section.title-banner .banner-title{
		padding: 8rem 0 3rem 0;
	}

	section.text-right-image{
		display: block;
		
	}

	section.text-right-image .text-content{
		padding: 0 2rem 4rem 2rem;
	}

	section.text-right-image .text-content .text-content-inner .h3{
		margin-bottom: 2rem;
	}

	section.text-right-image .image-content{
		padding-left: 2rem;
	}

	section.full-width-text .indent{
		padding-left: 0;
	}

	section.full-width-text{
		padding: 2rem 0 2rem 0;
	}

	section.multi-height-parallel .block-wrap{
		display: block;
	}

	section.multi-height-parallel .block-wrap .block .indent{
		padding-left: 0;
	}

	section.multi-height-parallel .block-wrap .right-block{
		margin-top: 0rem;
		margin-left: 0;
	}

	section.content-slider{
		padding: 5rem 0 5rem 0;
	}

	section.content-slider .slider{
		margin: 0rem 0.5rem 0rem 0.5rem;
	}

	section.text-right-overlap-image .block-wrap{
		padding-left: 2rem;
		padding-right: 2rem;
		padding-bottom: 5rem;
		display: block;
	}

	section.text-right-overlap-image .block-wrap .left-block{
		margin-bottom: 20px;
	}

	section.marquee-scroller{
		padding: 4rem 0 4rem 0;
	}

	section.marquee-scroller .marquee-inner.slick-initialized .slick-slide{
		margin-right: 1rem;
		margin-left: 1rem;
		
	}

	section.feature-grid .feature-list{
		display: block;
	}

	section.feature-grid .feature-list .feature-item{
		margin-top: 6rem;
	}

	section.feature-grid .feature-list .feature-item .icon{
		height: auto;
	}

	section.feature-grid .feature-list .feature-item .text-paragraph{
		font-size: 1.6rem;
	}

	section.photo-grid .photo-list{
		display: block;
	}

	section.photo-grid .photo-list .photo-item{
		margin-bottom: 0;
		margin-top: 6rem;
	}

	section.left-text-scroller .block-wrap{
		display: block;
	}

	section.left-text-scroller .block-wrap .left-block .indent{
		margin-right: 0;
	}

	section.left-text-scroller .block-wrap .left-block{
		margin-bottom: 6rem;
	}

	section.blockquote-slider .blockquotes{
		padding: 0 3rem 0 3rem;
	}

	section.blockquote-slider .blockquote-slider-inner{
		padding: 0 2rem 0 2rem;
	}

	section.blockquote-slider .blockquotes .slick-arrow.slick-next{
		right: 0.5rem;
	}

	section.blockquote-slider .blockquotes .slick-arrow.slick-prev{
		left: 0.5rem;
	}

	/* .footer-grid{
		display: block;
	} */

	.footer-grid{
		grid-template-columns: 1fr;
		/* grid-template-rows: 0.6fr 1fr 1fr 1fr; */
	}

	.footer-grid .grid-links{
		text-align: left;
		grid-row-start: 1;
		grid-row-end: 2;
		margin-bottom: 3rem;
	}

	.footer-grid .grid-links a.btn{
		margin-bottom: 2.5rem;
		margin-right: 3rem;
	}

	.footer-grid h6{
		margin-bottom: 2rem;
	}

	.footer-grid .grid-content{
		margin-bottom: 5rem;
	}

	.footer-grid .grid-quick-links{
		margin-bottom: 5rem;
	}

	.footer-grid .grid-footer-menu{
		margin-bottom: 5rem;
	}
	
	#site-footer .footer-bottom{
		display: block;
		margin-top: 0;
	}

	#site-footer .footer-bottom .bottom-links a{
		margin-left: 0;
		margin-right: 1rem;
	}

	body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10{
		display: block;
	}

	body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 input[type=file]{
		font-size: 1.2rem;
	}

	body.page-template-tpl-request-quote .gform_wrapper .gfield.gfield_html{
		font-size: 1.8rem;
	}

	body.page-template-tpl-request-quote .gform_wrapper .gfield_label{
		font-size: 2.1rem;
		line-height: 2.5rem;
	}

	body.page-template-tpl-request-quote .gform_wrapper legend.gfield_label{
		padding-top: 4rem;
	}

	body.page-template-tpl-request-quote .gform_wrapper .image-choices-field .image-choices-choice{
		margin: 0 0px 0px 0 !important;
	}

	body.page-template-tpl-request-quote .gform_wrapper .image-choices-field.image-choices-show-labels .image-choices-choice-text{
		font-size: 2rem;
	}

	body.page-template-tpl-request-quote .gform_wrapper .gf_step_number{
		border: 0;
		
	}

	body.page-template-tpl-request-quote .gform_wrapper .gf_step_completed .gf_step_number:before{
		/* background-color: #fff;
		display: block;
		height: 40px;
		left: -2px;
		position: absolute;
		top: -2px;
		width: 40px; */
		display: none;

	}

	body .gform_wrapper.gravity-theme .gf_step_completed .gf_step_number:after{
		color: var(--navy);
	}

	body.page-template-tpl-request-quote .gform_wrapper .gf_step_completed .gf_step_number{
	/* body .gform_wrapper.gravity-theme .gf_step_completed .gf_step_number{ */
		color: #fff;
	}

	body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 input::placeholder{
		font-size: 1.8rem;
	}

	body.page-template-tpl-request-quote .gform_wrapper .gform_fields#gform_fields_6_10 .gfield_label{
		font-size: 1.8rem;
	}

	.nav-drop .main-nav .main-nav-inner .menu-back span{
		font-size: 5vw;
	}

	.nav-drop .main-nav .main-nav-inner .menu-back span svg{
    	/* width: 15px; */
	}

}
@media only screen and (max-width : 360px){}

/* ============================= Curtain ==================== */

.curtain {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 101;
	animation: 1s linear 1s 1 forwards curtain-animation;
}

.curtain .logo {
	width: 260px;
}

.curtain .logo svg .lga {
	fill: none;
	stroke: var(--navy);
	stroke-linecap: square;
	stroke-miterlimit: 10;
	stroke-width: 14px;
	stroke-dasharray: 330px;
	animation: 1s linear 1 forwards curtain-logo-animation;
}

@keyframes curtain-animation {
	0% {
		opacity: 1;
		z-index: 101;
	}
	50% {
		opacity: 0;
	}
	100% {
		opacity: 0;
		z-index: -1;
	}
}

@keyframes curtain-logo-animation {
	0% {
		stroke-dashoffset: 330px;
	}
	100% {
		stroke-dashoffset: 0;
	}
}