/**
	@Author:	Elmwood Safety Solutions - Holding Page
	@Date:		10 2022
	@Notes:		elmwoodsafetysolutions.co.uk
		
	FONTS & COLORS
	-------------	
	Font-family: 'DIN Condensed', sans-serif;
	available weight: 300, 400, 400i, 700;
*/

:root {
	--header: #051728;
	--grey-2: #f3f2ee; /* PS preferred */
	--navy: #002F6C;
	--lightblue: #6fbad9;
	--textblue: #459fc4;
	--lightgrey: #f1f1f1;
	--light-grey: #e2e2e2;
	--accent: #FCF150;
	--accent-1: #2b73b6; /* button color  #d2484a;  #938c84 */
	--accent-2: #2b73b6; /* button hover color  #af3436 */
	}

/**
 * Reset stylesheet to normalize styles across browsers
 */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,label,input,textarea,p,blockquote,th,td {  
	margin:0; 
	padding:0; 
	}
table { 
	border-collapse:collapse; 
	border-spacing:0; 
	}
fieldset,img {  
	border:0; 
	}
address,caption,cite,code,dfn,em,strong,th,var { 
	font-style:normal; 
	font-weight:normal; 
	}
ol,ul,li { 
	list-style:none; 
	margin: 0;
	padding: 0;
	}
caption,th { 
	text-align:left; 
	} 
h1,h2,h3,h4,h5,h6 { 
	font-size:100%; 
	font-weight:normal; 
	} 
q:before,q:after { 
	content:''; 
	} 
abbr,acronym { 
	border:0; 
	} 
a {
	text-decoration: none;
	}


* {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
	box-sizing: border-box;
	}

html {
	font-size: 100%;
	height: 100%;
	}
body {
	height: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	font-size: 16px;
	line-height: 1.3;
	background: #ffffff;
	}

body, input, textarea, table {
	font-family: din-condensed,sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #222;
	}

img {
	display: block;
	vertical-align: middle;
	max-width: 100%;
	}

/* ----- [ Typography ] -------------------------*/	
p,
li,
td {
	font-family: din-condensed,sans-serif;
	font-weight: 400;
	line-height: 1.6em;
	margin: 0 0 1em;
	}
li {
	margin: 0;
	}
em {
	font-style: italic;
	}
b,
strong {
	font-weight: 700;
	}

a {
	color: #222;
	}
a:hover {
	color: #ca3a31;
	text-decoration: underline;
	}

h1,.h1 {
	font-family: din-condensed,sans-serif;
	font-weight: 400;
	font-size: 1.6rem;
	line-height: 1em;
	text-transform: uppercase;
	color: #fff;
	background: #222;
	padding: 0.4em 1em 0.3em;
	margin: auto 0 0.6em;
	letter-spacing: 0.2em;
	width: 100%;
	}

h2,.h2 {
	font-family: din-condensed,sans-serif;
	font-weight: 400;
	font-size: 1.2rem;
	line-height: 1.3em;
	margin: 0.3em 0 1em;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	}

@media screen and (min-width: 600px) {
	h1,.h1 {
		font-size: 2rem;
		}

	h2,.h2 {
		font-size: 1.4rem;
		}
}


/* ----- [ Structure ] --------------------------*/
.page-wrapper {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: nowrap;
	flex-direction: column;
	align-items: center;
	padding: 0;
	background: #fff;
	min-height: 100%;
	}
	
header,
section,
footer {
	background: #ffffff;
	width: 100%;
	margin: 0;
	position: relative;
	}
section {
	padding: 40px 0;
	}
.inner {
	position: relative;
	max-width: 1280px;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	padding: 0 20px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	}
	
@media screen and (min-width: 769px) {
	.page-wrapper {
		position: fixed;
		top: 0;
		left: 0;
		height: 100vh;
		}
}


/* ----- [  ] -------------*/
.top-meta {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	font-size: 1.2rem;
	line-height: 1.6;
	padding: 0.2em 0;
	letter-spacing: 0.02em;
	width: 100%;
	}
.top-meta div {
	white-space: nowrap;
	}

.logowrap {
	width: 100%;;
	margin: auto;
	height: calc(30vh - 40px);
	}
.logowrap img {
	width: auto;
	height: 100%;
	margin: 0 auto;
	padding: 10px;
	}

.phone-icon,
.env-icon {
	display: inline-block;
	height: 16px;
	margin-right: 0.3em;
	}
.phone-icon {
	height: 20px;
	margin-right: 0.05em;
	}

@media screen and (min-width: 400px) {
	.top-meta {
		font-size: 1rem;
		margin-bottom: 0.5em;
		line-height: 1.4;
		letter-spacing: 0.05em;
		}
}

@media screen and (min-width: 600px) {
	.top-meta {
		font-size: 1.5rem;
		margin-bottom: 0;
		line-height: 1.2;
		letter-spacing: 0.05em;
		}
	.phone-icon,
	.env-icon {
		height: 26px;
		margin-right: 0.3em;
		}
	.phone-icon {
		height: 38px;
		margin-right: 0.15em;
		}
}

@media screen and (min-width: 795px) {
	.top-meta {
		flex-direction: row;
		}
	.logowrap img {
		padding: 4px;
		}
}

.grid-wrapper {
	/*height: 60vh;*/
	margin-top: 0;
	}

.col {
	height: 28vh;
	}
.sector {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: space-between;
	overflow: hidden;
	}


.imgwrap img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	}

@media screen and (min-width: 600px) {
	.imgwrap {
		height: calc(28vh - 46px);
		overflow: hidden;
		}
}

/* ----- [ Strandoo Flex Grid System v1 ] ------ */
.row {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	flex-direction: column;
	/*justify-content: stretch;*/
	list-style: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	position: relative;
	}

.col {
	flex: 1;
	padding: 0;
	}

@media only screen and (min-width: 420px) {
	.row.no-padding,
	.row.padding-0 {
		margin-left: 0;
		margin-right: 0;
		}
	.row.padding-1 {
		margin-left: -1px;
		margin-right: -1px;
		}
	.row.padding-5 {
		margin-left: -5px;
		margin-right: -5px;
		}
	.row.padding-10 {
		margin-left: -10px;
		margin-right: -10px;
		}
	.row.padding-15 {
		margin-left: -15px;
		margin-right: -15px;
		}
	.row.padding-20 {
		margin-left: -20px;
		margin-right: -20px;
		}
	.row.padding-30 {
		margin-left: -30px;
		margin-right: -30px;
		}

	.no-padding > .col,
	.padding-0 > .col {
		padding: 0;
		}
	.padding-1 > .col {
		padding-left: 1px;
		padding-right: 1px;
		}
	
	.padding-5 > .col {
		padding-left: 5px;
		padding-right: 5px;
		}
	.padding-10 > .col {
		padding-left: 10px;
		padding-right: 10px;
		}
	.padding-15 > .col {
		padding-left: 15px;
		padding-right: 15px;
		}
	.padding-20 > .col {
		padding-left: 20px;
		padding-right: 20px;
		}
	.padding-30 > .col {
		padding-left: 30px;
		padding-right: 30px;
		}

	.row.text-center > .col {
		text-align: center;
		}
}

.col > img {
	max-width: 100%;
	}

@media only screen and (min-width: 100px) and (max-width: 599px) {
	.base-row.row {
		flex-direction: row;
		}

	.base-row .m-1of2,
	.base-row .m-2of4,
	.base-row .m-50 {
		width: 50%;
		flex: none;
		}
	.base-row .m-1of3,
	.base-row .m-33 {
		width: 33.3333%;
		flex: none;
		}
}

@media only screen and (min-width: 600px) { 
	.row {
		flex-direction: row;
		}

	.m-auto {
		width: auto;
		}
	.m-full,
	.m-1of1,
	.m-2of2 {
		width: 100%;
		flex: auto;
		}
	.m-1of2,
	.m-50 {
		width: 50%;
		flex: none;
		}
	.m-1of3,
	.m-33 {
		width: 33.3333%;
		flex: none;
		}
	.m-2of3,
	.m-66 {
		width: 66.6667%;
		flex: none;
		}
	.m-1of4,
	.m-25 {
		width: 25%;
		flex: none;
		}
	.m-3of4,
	.m-75 {
		width: 75%;
		flex: none;
		}
	.m-1of5,
	.m-20 {
		width: 20%;
		flex: none;
		}
		
	.m-hidden { display: none; }
}

@media only screen and (min-width: 770px) {
	.t-auto {
		width: auto;
		}
	.t-full,
	.t-2of2,
	.t-3of3,
	.t-4of4,
	.t-5of5 {
		width: 100%;
		flex: none;
		}
	.t-1of2,
	.t-2of4,
	.t-3of6,
	.t-50 {
		width: 50%;
		flex: none;
		}
	.t-1of3,
	.t-2of6,
	.t-33 {
		width: 33.3333%;
		flex: none;
		}
	.t-2of3,
	.t-4of6,
	.t-66 {
		width: 66.6667%;
		flex: none;
		}
	.t-1of4,
	.t-25 {
		width: 25%;
		flex: none;
		}
	.t-3of4,
	.t-75 {
		width: 75%;
		flex: none;
		}
	.t-1of5,
	.t-3of6,
	.t-20 {
		width: 20%;
		flex: none;
		}
	.t-2of5,
	.t-40 {
		width: 40%;
		flex: none;
		}
	.t-3of5,
	.t-60 {
		width: 60%;
		flex: none;
		}
	.t-4of5,
	.t-80 {
		width: 80%;
		flex: none;
		}
	.t-hidden { display: none; }
}
@media only screen and (min-width: 1200px) { 
	.d-auto {
		width: auto;
		}
	.d-full,
	.d-2of2,
	.d-3of3,
	.d-4of4,
	.d-5of5 {
		width: 100%;
		flex: none;
		}
	.d-1of2,
	.d-2of4,
	.d-3of6,
	.d-50 {
		width: 50%;
		flex: none;
		}
	.d-1of3,
	.d-2of6,
	.d-33 {
		width: 33.3333%;
		flex: none;
		}
	.d-2of3,
	.d-4of6,
	.d-66 {
		width: 66.6667%;
		flex: none;
		}
	.d-1of4,
	.d-25 {
		width: 25%;
		flex: none;
		}
	.d-3of4,
	.d-75 {
		width: 75%;
		flex: none;
		}
	.d-1of5,
	.d-3of6,
	.d-20 {
		width: 20%;
		flex: none;
		}
	.d-2of5,
	.d-40 {
		width: 40%;
		flex: none;
		}
	.d-3of5,
	.d-60 {
		width: 60%;
		flex: none;
		}
	.d-4of5,
	.d-80 {
		width: 80%;
		flex: none;
		}
	.d-1of6,
	.d-16 {
		width: 16.6666%;
		flex: none;
		}
		
	.d-hidden { display: none; }
}

/* ----- [ Flex Container ] ----------- */
.flex-container {
	display: block;
	height: 100%;
	height: auto;
	}
.flex-container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	position: relative;
	justify-content: space-between;
	align-items: center;
	padding: 0 20px;
	}
.flex-container > * {
	/*width: 100%;*/
	display: block;
	}
	
@media only screen and (min-width: 1110px) {
	/* Make this a Utility Class */
	.flex-container {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		flex-wrap: wrap;
		position: relative;
		justify-content: space-between;
		align-items: center;
		padding: 0 20px;
		}
	.flex-container > * {
		/*border: 1px solid gold;*/
		}
	
	.f-top { align-items: flex-start; }
	.f-middle { align-items: center; }
	.f-bottom { align-items: flex-end; }
	.f-left { justify-content: flex-start; }
	.f-right { justify-content: flex-end; }
	.f-center { justify-content: center; }
}


.h-rule {
	border: none;
	height: 2px;
	margin: 10px 0 20px;
	background: #000;
	}


/* Remember to remove any data-featherlight-iframe-width and data-featherlight-iframe-height 
attributes from the A tag! */

/* ----- [ Contact form ]----------------------- */
input,
select,
textarea {
	font-size: 1em;
	width: 100%;
	padding: 6px 10px;
	margin: 0 0 10px;
	color: #333;
	background: #fff;
	webkit-appearance: none;
	border: 1px solid #ccc;
	border-radius: 0;
    }
textarea {
	margin: 0 0 5px;
	}

input[type=submit],
input.button {
    -webkit-appearance: none;
	}

input:focus, 
textarea:focus {
	background: #fff;
	}

input[type="checkbox"] {
	width: auto !important;
	margin: 0 5px 0 0;
	}

select {
	height: 42px;
	font-size: 1.1;
	padding: 15px 19px;
	border: none;
	border-radius: 0;
	}

.form-wrapper {
	margin-top: 15px;
	margin-bottom: 30px;
	}
.form__item--c_contact_consent,
.form__item--c_terms_consent {
	line-height: 0.9em;
	margin-bottom: 0;
	}
	
.form__item--c_terms_consent {
	line-height: 1.3em;
	margin-bottom: 10px;
	text-align: center;
	}

.form__item label {
	font-size: 0.9em;
	}

.field__header--hidden,
.form__item--scf-website {
	display: none;
	}
	
.field--error input,
.field--error textarea {
	border: 1px solid #ca3a31;
	}
	
.field--error--message {
	/*float: right;*/
	color: #f36617;
	font-size: 0.95em;
	margin: 0;
	display: none;
	}

.form__item--c_terms_consent.field--error label {
	border-bottom: 1px solid #ca3a31;
	}
	
.error,
.success {
	color: #fff;
	background: #f36617;
	margin: 0 0 20px;
	padding: 10px;
	width: auto;
	}
.success {
	color: #00355e;
	background: #c5d301;
	}
.ui-widget-content p {
	text-align: right;
	margin: -1.6em 0 0;
	}
span.ui-state-error {
	color: #ca3a31;
	}

.form--error--message,
.form--success--message {
	text-align: left;
	font-size: 1rem;
	font-weight: 600;
	margin: 15px 0 20px;
	width: auto;
	clear: both;
	}
	
.form--error--message {
	text-align: center !important;
	font-size: 0.95rem;
	font-weight: 400;
	color: #fff;
	background: #ca3a31;
	padding: 10px;
	margin: 5px 0 20px;
	width: auto;
	clear: both;
	}

.FieldtypeCheckbox {
	margin-right: 0.5em;
	}

#wrap_InputfieldSubmit span,
.form__item--label,
li label span {
	display: none;
	}

.form__item--submit {
	text-align: center;
	}


@media only screen and (min-width: 660px) {		
	.form__item--c_terms_consent {
		text-align: left;
		}
	.form__item--submit {
		text-align: left;
		}	
}

/* ----- [ Buttons ] --------------------------- */
.button {
	display: inline-block;
	padding: 10px 20px;
	background: none;
	cursor: pointer;
	width: auto;
	opacity: 1;
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 10px;
	color: #fff;
	border: 2px solid #222;
	background: #222;
	}
.button:hover {
	color: #222;
	background: var(--accent);
	border-color: #222;
	text-decoration: none;
	}
	
.button-small {
	padding: 5px 15px;
	}
.button.outline {
	background: none;
	color: #d64236;
	}


/* ----- [ Modal ] --------------------------- */
/* The Modal (background) */
.modal {
	display: none;
	justify-content: center;
	align-items: flex-start;
	position: fixed;
	z-index: 999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.6);
	}

/* Modal Content/Box */
.modal-content {
	background-color: #fefefe;
	margin: 0 auto;
	padding: 30px;
	max-width: 900px;
	width: 100%;
	min-height: 100%;
	}
.modal h3 {
	font-size: 1.2rem;
	margin: 0 0 1em;
	}

/* The Close Button */
.modal-close {
	color: #ccc;
	float: right;
	font-size: 3rem;
	line-height: 0.2;
	font-weight: bold;
	margin: -5px -5px 0 0;
	}

.modal-close:hover,
.modal-close:focus {
	color: black;
	text-decoration: none;
	cursor: pointer;
	}
	
@media screen and (min-width: 600px) {
	.modal {
		align-items: center;
		}
	.modal-content {
		margin: 15% auto;
		border: 1px solid #888;
		width: 80%;
		min-height: 100px;
		}
}

/*- ----- [ Footer ] --------------------------- */
.page-footer {
	color: #fff;
	background: var(--lightblue);
	padding: 0;
	text-align: center;
	bottom: 0;
	left: 0;
	width: 100%;
	margin-top: auto;
	}
	
.page-footer .inner {
	max-width: 1180px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	position: relative;
	justify-content: space-between;
	align-items: flex-start;
	padding: 50px 20px 20px;
	}
.page-footer p,
.page-footer li {
	color: #fff;
	font-size: 0.95rem;
	line-height: 1.6em;
	font-weight: 400;
	}

.footer-col {
	margin-bottom: 2em;
	}

.page-footer a {
	color: #fff;
	border-bottom: none;
	}
.page-footer a:hover {
	color: var(--accent);
	border-bottom: 1px solid var(--accent);
	text-decoration: none;
	}

.copyright-credits {
	color: #fff;
	margin: 0 auto;
	margin: 0 auto 0 0;
	padding: 0;
	font-size: 1rem;
	text-align: left;
	}
	
@media only screen and (min-width:600px) {
	.page-footer .inner {
		flex-direction: row;
		}
}


/* ----- [ Misc. / Utility Styles ] ------------ */
img.inline {
	display: inline !important;
	}
img.right {
	float: right;
	}
.fright {
	float: right;
	}
.fleft {
	float: left;
	}

.center,
.center p,
.center h2,
.center h3,
.center h4,
.centered,
.centered p,
.centered h2,
.centered h3,
.centered h4 {
	text-align: center;
	}

.text-left,
.text-left p,
.text-left li,
.text-left h2,
.text-left h3 {
	text-align: left;
	}
.text-right,
.text-right p,
.text-right li {
	text-align: right;
	}
.text-center {
	text-align: center;
	}
.text-small {
	font-size: 1em;
	}
	
.overflow-visible {
	overflow: visible;
	}