/*
Theme Name: CLH
Author: CLH
*/
@charset "UTF-8";

	:root {
	--g-font-family: "Open Sans",-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
	--g-secondary-font: "Sen", system-ui;
	--g-font-size: 1.em;
	--g-text-color: #22171b; /*Brown*/
	--g-text-light: #136280; /*petrol blue*/
	--g-text : #05100E;
	--g-text-hover: #cc5600; /*Orange*/
	--g-secondary: #bfe6f5; /*Lighter blue*/
	--g-background-color: #fafafa;
	--g-background-dark: #4d4747; /*Darker*/
	--g-primary: #abc6d1; /*#bbc3ce;*/ 
	--g-lightgrey: #CCCCCC;
	--g-paragraph: #58595B;
    --g-box-background: #dfeaf8;
    --g-red-back: #FFC7CE;
    --g-red-text: #9c0006;
    --g-green-back: #C0D9B4;
    --g-green-text: #004233;
    --g-white: #ffffff;
    --spacing-section: 4.375rem;
    --border-radius: 0.5rem;
    --width-gutter: 2rem;
    --small-gutter:1.5rem;
    --width-page: calc(80rem + 2 * var(--width-gutter));
    --font-size-16: 1rem;
    --font-size-24: 1.5rem;
    --weight-bold: 700;
    --weight-semi-bold: 600;
    --font-size-p: 1.125rem;
}

/*Main*/
body {
	background-color: var(--g-white);
	font-family: var(--g-font-family);
	font-size: var(--g-font-size);
	color: var(--g-text-color);
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.5;
	margin: 0;height: 100vh;
}
::-webkit-scrollbar { 
    display: none; 
}
div {
    border: 0;
    font-family: inherit;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
    margin: 0;
    outline: 0;
    padding: 0;
    vertical-align: baseline;
}
.established {font-weight: 200;font-size:2em;color:var(--g-white);}
.background-navy p.provision {margin-top: 6em;color: var(--g-text);font-family: var(--g-secondary-font);text-align:center;font-size:16px;}
.main::after,.mainHome::after {
  content: "";
  background: url('../images/fullcircle.webp');
  opacity: 0.2;
  top: 100px;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
  background-repeat:no-repeat;
  height:100vw;
}
.main::after,.mainNotHome::after {
  content: "";
  background: url('../images/fullcircle.webp');
  opacity: 0.2;
  top: 100px;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
  background-repeat:no-repeat;
  height:100vw;
}
.site-info {color:var(--g-primary);}
.footer {background:url('../images/small-background.webp');
   background-size:12%;
   background-position: bottom right;
    background-repeat:no-repeat;
    background-blend-mode: multiply;
  }
.separatorChar {color:var(--g-text-hover);}

* {box-sizing: border-box;}

h1 {font-size: 1.8em;font-weight:500;font-family:var(--g-secondary-font);}
h2 {text-decoration: none;font-size: 1.4em;	font-weight: 500;margin-top: .5rem;color:var(--g-text-hover);}
h3 {font-size: 1.1em;letter-spacing: 0.04em;margin: 0;font-weight: 400;transition: all 0.5s ease-in-out;}
fieldset {padding: .35em .75em .625em;}
p {	margin: 0 0 1.5em;padding: 0;font-size: 0.9em;color: var(--g-paragraph);}
ol,ul {margin: 0;padding: 0;}
li {list-style-type: none;}
b,strong {font-weight: 700;}
input,
select,
textarea {
	background-color: var(--g-background-color);
	border: none;
	border-radius: 1px;
	color: var(--g-paragraph); /**/
	font-size: 14px;
	font-weight: 400;
	padding: 12px;
	width: auto;
}
p {transition: all 0.5s ease-out;}
a {text-decoration: none;transition: color 0.5s ease-in-out, background-color 0.5s ease-in-out;}
a {color:var(--g-text-hover);}
a:hover {color: var(--g-text-light);}

.screen-reader-shortcut,
.screen-reader-text,
.screen-reader-text span {border: 0;clip: rect(0, 0, 0, 0);height: 1px;overflow: hidden;position: absolute !important;width: 1px;word-wrap: normal !important;}

.phone-number,.phoneIconSpan a,.footer-phone-number a,.footer-phone-number {font-size: large;color:var(--g-text-light);font-family:var(--g-secondary-font);}
.phoneIconSpan {display:none;justify-content: center;align-items:center;}
.footer .phoneIconSpan,.footer-phone-number {display:flex;text-align: center;justify-content: center;}
.phoneIcon {fill:var(--g-text-light);width:20px;margin-right:0.5em;}
.footer .phoneIcon, .footer .phone-number,.footer .phoneIconSpan a {fill:var(--g-white);color:var(--g-white);}
.site-header {text-align: center;justify-content: center;display: flex;flex-direction: column;line-height: normal;align-items: center;padding-top:15px;width:95%;margin:auto;}
.site-title a {font-family: var(--g-secondary-font), sans-serif; font-size: 1em;color: var(--g-text-light);font-weight: 600;}

.top-row {display:flex;width:100%;justify-content:end;}
.bottom-row {display:flex;width:100%;margin:2em 0;align-items:center;}
.header-15 {width: 25%;display:flex;justify-content:start;}
.header-60 {width: 50%;}
.header-25 {width: 25%;display:flex;flex-direction:column;align-items: center;}

.mini-icon {width:1.5em;height:1.5em;vertical-align: -0.125em;line-height: normal;}
p.tagline {font-style:italic;font-weight:200;font-size:smaller;}
.centered {text-align:center;font-size:large!important;}
#div0 {width: inherit;display: block;}
#div1 {width:100%;display: flex;flex-direction: row;justify-content:space-between;align-items: center;padding-left: 20px;padding-right: 20px;margin-bottom: -4px;}
	
/*.mobile-menu-title {font-size: 1.6em;font-family:var(--g-secondary-font),Helvetica,Arial,sans-serif;font-weight:600;padding-left:15px;padding-right: 10px;}
.custom-logo-link {display: none;}*/

a.empty-href{display: block;color: var(--g-text-color);}
a.dropdown-toggle{display: none;}
a.dropdown-toggle{display: block;}

nav .navbar img {height:60px;padding-top:5px;}
nav {width: 100%;height: 70px;background: var(--g-white);/*box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);*/}
nav .navbar {display: flex;align-items: center;justify-content: end;margin: auto;height:auto;padding:0;}
.sidebar-logo .logo-name{font-size: 25px;color: #fff;}      
.navbar .fa-bars{width: 2em;height: 2em;vertical-align: -0.125em;display: block;}
.navbar .fa-bars {display: none;}
.navbar .fa-x	{width: 1.5em;height: 1.5em;vertical-align: -0.125em;}

@media screen and (min-width: 768px) {
.links a {font-size: 0.9rem;color: var(--g-text-color);}
/*.links li:hover {color: inherit;background-color: inherit;}*/

/*.links	{display: block;margin-top: 20px;}*/
.links li .arrow {line-height: 40px;}
.links li {display: block;transition: all 0.5s ease-out;}
.links li.has_children > a:after {content: '\25bc';font-size: 7px;vertical-align: 1px;padding-left: 5px;opacity: .75}
.links li li.has_children > a:after {content: '\25b6';font-size: 7px;vertical-align: 1px;padding-left: 5px;opacity: .75}


.links .depth-0 a {color: var(--g-text-color);}
.depth-0 .menu-item-has-children {position: relative;left: 0;}

nav {height:100%}
nav a {color: #fff;font-weight: 400;}
.navbar .logo a {font-size: 30px;color: #fff;text-decoration: none;font-weight: 600;}

.depth-1,.depth-2 {position: absolute;top: 0;left: 100%;width: max-content;list-style: none;padding: 0;margin: 0;display: none;z-index:999;}
.depth-1 > li,.depth-2 > li {background: #999999;padding: 0 15px 0 15px;}

.links > li:hover,.depth-0 > li:hover,.links li .depth-1 > li:hover, .links li .depth-2 > li:hover {position: relative;text-decoration-color:var(--g-text-hover); background: #CCCCCC;}

.depth-0,depth-1	{position: absolute;top: 100%;left: 0;width: max-content;list-style: none;padding: 0;margin: 0;display: none;background:#f2f2f2;}
.depth-0 > li, .depth-1 > li {position: relative;padding: 10px 15px 10px 15px;min-width:6em;text-align: left;}

.links {display: flex;margin: 0;z-index: 99999;color: #fff;}
.links > li	{width: max-content;position: relative;display: flex;align-items: center;justify-content: space-between;list-style: none;padding: 8px 14px;}
.links li:hover > ul {display: inline;}
.links li:hover > a {color:var(--g-text-hover);}
.depth-1 > li a,.depth-2 > li a {display:relative;z-index:9999;}
.navbar .clh-nav-links .sidebar-logo {display: none;}
.depth-0 > li,.depth-1 > li {position: relative;padding: 8px 15px;}
}

#searchButton {padding:0;height:23px;}  
#search-bar {background: #2c2c2c;padding: 20px 15px;overflow: hidden;opacity:0;position:relative;z-index:9999;left:-999em;box-sizing:border-box;width:100%;top:100%;transform:translateY(-98%);transition:transform 0.8s ease, opacity 0.8s ease, top 0s ease 0.8s, left 0s ease 0.8s;}
#search-bar.open {transform:translateY(0%);opacity:1;left:0;transition:transform 1s ease, opacity 1s ease;}
#search form {text-align: center;max-width: 600px;margin: 0 auto;}
#search input {padding: 5px;font-size: 1.2rem;border-radius: 5px;border: 2px solid #00585f;width: 100%;}

::-webkit-input-placeholder,:-moz-placeholder,::-moz-placeholder,:-ms-input-placeholder,::placeholder {color: var(--g-lightgrey);opacity: 0.5;}
.menu-item-title {color:var(--g-text);}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    border: 0 !important;
    cursor: pointer;
    text-decoration: none;
    background-color:var(--g-text-light);
    color:var(--g-white);	
    padding: 1.1em 1.4em 1.1em 1.4em;
    align-self: center;
    font-size: 12px;
    font-weight: 600 !important;	
    text-transform: uppercase;
    transition: all 1.5s ease-in-out;
}

input[type="submit"]:hover {background-color:var(--g-primary);color:var(--g-text-light);}


:focus-visible {outline: 1px dashed var(--g-text-hover);}

fieldset {font-size: 1em;padding: 0.5em;border-width: 0;}
.search-form {background-color :var(--g-background-color);}
.search-form label, .search-form input, .search-form button {font-size: inherit;
	padding: 0.3em 0.4em;
	margin: 0.1em 0.2em;
	background-color: #fff;
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 33px;
}
.search-form input {margin-right: 0;width: 80%;	border-radius: 0px !important;}
.search-form input:focus {outline: none;background-color: var(--g-background-color);}
.search-form button {margin-left: 0;background-color: #fff;border-radius: 0px !important;}
.searchButton img {	height: 20px;}

.woocommerce-breadcrumb {width: 65%;height: auto;background: transparent;box-shadow: none;border-bottom: 1px solid #eee;font-size: 0.8rem;margin:auto;margin-bottom: 20px;padding-left:40px;}
.woocommerce-breadcrumb a {color: var(--g-menu-buttons);}
.woocommerce-breadcrumb a:hover {color: var(--g-text-hover);}
.deskLogo {max-width:revert;height:100px;}

.credentials {display: flex;    justify-content: center;margin-bottom: 6em;}
/*Footer*/
.footer {background-color: var(--g-text-light);font-size: 13px;padding-bottom: 14px;text-align: center;width: 100%}
.footer-wrapper {display: flex;	margin-bottom: 3em;margin-top: 3em;	justify-content: flex-end;align-items:center;}
.menu-utility  {color:var(--g-white);text-align: left;}
.menu-utility a {font-size: larger;line-height: 1.8;color:var(--g-white);display:block;height:100%;}
.menu-utility a:hover {color: var(--g-text-hover);}
.social-media {height:2em;width:3em;}
.inner-container {padding-top: 6em;}
.site-info svg {fill: var(--g-text-light);}
.site-info svg:hover {fill: var(--g-text-hover);}
.social-icons {display:flex;justify-content: right;margin-right:5em;}
.pagelayer-shape-fill {fill:white;}
.clhSVG {background-color:var(--g-text-light);transform: rotateY(180deg);height: 65px;width: 100%;}
.svg-top {top:-1px;}


.formName, .formEmail, .formPhone, .formComments {display:flex;flex-direction:column;}
.formName, .formPhone {width:48%;}
label {margin-top:1em;color:var(--g-background-color);}
#sub-submit {margin-top:1em;min-width:10em;}
#commentsText {min-height:12em;font-family:inherit;}


#sub-form {box-shadow: 0 7px 10px rgba(19, 19, 56, 0.20);padding: 1em;}
.sub-form {display:flex;flex-direction:column;}   
.lineName {display:flex;justify-content: space-between;}

.contactLine {display:flex;align-items:center;font-size: inherit;}
.contactLine a {color:var(--g-background-color);}
.placeIcon {display:flex;}
.contactIcons {fill:var(--g-primary);width: 25px;margin-right:0.5em;}
.phoneNumber,.emailAddress,.messageText {margin-left:0.7em;}
.qualityText {text-align:center;font-family:var(--g-secondary-font);font-size:x-large;margin-bottom:6em;    padding: 4em;
    background-color: var(--g-primary);
    color: var(--g-text-color);}

.row {display: flex;flex-wrap: wrap;}
.side {flex: 12%;background-color: #f1f1f1;padding: 20px;}
.main {background-color: white;padding: 20px 40px;width:65%;margin:auto;margin-bottom: 6em;}

input[type=number] {outline: 0.5px ridge rgb(170 50 220 / 0.6);border-radius: 0.5rem;}
input[name=update_cart] {float:right;}

.help-wrapper,.wrap.waysContact {width:60%;margin:auto;}
ul.wp-block-list {font-size: smaller;margin-left: 3em;margin-bottom: 1.5em;padding-top: 0;color:var(--g-paragraph);}
ul.wp-block-list li {list-style-type:disc;}

thead {background-color:var(--g-primary) ;}

.rows {width:100%;}
h1:first-child, h2:first-child, h3:first-child, h4:first-child {
    margin-top: 0;
}

.left p {color:var(--g-white);}
.flex {
    padding:0;
    width: 100%;
    max-width: var(--width-page);
    padding: 0 var(--width-gutter);
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--width-gutter);
    }

.grid-special {
    width: 100%;
    max-width: var(--width-page);
    padding: 0 var(--width-gutter);
    margin: 0 auto;
    display: grid;
    gap: var(--width-gutter);
    grid-template-columns: 7fr 5fr;
    grid-template-rows: repeat(2, 1fr);
    aspect-ratio: 1280 / 550;}
  
 .grid-special.plando {
    width: 100%;
    max-width: var(--width-page);
    padding: 0 var(--width-gutter);
    margin: 0 auto;
    display: grid;
    gap: var(--width-gutter);
    grid-template-columns: 7fr 5fr;
    grid-template-rows: repeat(3, 1fr);
  /*  aspect-ratio: 1280 / 550;*/}
  
.grid-special.mainpanel {
    width: 100%;
    max-width: var(--width-page);
    padding: 0 var(--width-gutter);
    margin: 0 auto;
    display: grid;
    gap: var(--width-gutter);
    grid-template-columns: 7fr 5fr;
    grid-template-rows: 40% 40% 20%;
    aspect-ratio: 1280 / 650;
    
}
  
  
.grid-statement {
    width: 100%;
    max-width: var(--width-page);
    padding: 0 var(--width-gutter);
    margin: 0 auto;
    display: grid;
    gap: var(--width-gutter);
    grid-template-rows: repeat(1, 1fr);
    aspect-ratio: 1280 / 550;}    
    
.grid-special.about,.grid-special.plando,.wrap.about,.grid-statement  {width:64%;}
    
.grid-special .large {grid-row: span 2;}
.grid-special h1 {font-size: var(--font-size-24); margin-bottom: 0;color:var(--g-white);}
.grid-details {
    width: 100%;
    max-width: var(--width-page);
    padding: 0 var(--width-gutter);
    margin: 0 auto;
    display: grid;
    gap: var(--width-gutter);
    grid-template-columns: 7fr 5fr;
    grid-template-rows: repeat(2, 1fr);
    aspect-ratio: 1280 / 550;}
    
.grid-details.about,.wrap.about {width:64%;}
    
.grid-details .large {
    grid-row: span 2;
}
.grid-details h1 {font-size: var(--font-size-24);
    margin-bottom: 0;
    color:var(--g-white);
}
.grid-3 {
    width: 100%;
    max-width: var(--width-page);
    padding: 3em var(--width-gutter);
    margin: 0 auto;
    display: grid;
    gap: var(--width-gutter);
    grid-template-columns: repeat(3, minmax(0, 1fr));
} 
.grid-4 {
    width: 100%;
    max-width: var(--width-page);
    padding: 0 var(--width-gutter);
    margin: 0 auto;
    display: grid;
    gap: var(--width-gutter);
    grid-template-columns: repeat(2, minmax(0, 1fr));
  position:relative;
}
.grid-4::before
{ /* background-image: url('../images/ladder.webp'); content: "";
       top: 5px;
       left: -10px;
       bottom: 0;
       right: 0;
       position: absolute;
       z-index: -1;
       opacity: 0.5;*/}
.reasonsIcon {fill:var(--g-text-light);width:25px;overflow:visible;}
.reasonsIcon.big {width:42px;}
.problem,.action,.result {width:33%;padding:2em;}
.problem h3,.action h3,.result h3 {padding:2em 0 1em 0;}
.meetGreet {width:60%;display:flex;margin:auto;}
.parSpan {height:50px;display:flex;}

.issueHR {width: 30%;margin: 5em auto;}
hr.issueHR, .issueHR hr {color:white;}
.box-content {position: relative;
    border-radius: var(--border-radius);
    overflow: hidden;
    width: 100%;
    height: 100%;
    transition: all 0.5s ease-out;
}
.box-content.details {height:12em;} 
.section-featured-boxes-special .box-content .image-wrap,.section-featured-boxes-details .box-content .image-wrap  {
    height: 100%;
    width: 100%;
}

.section-advantages .advantages-intro.narrow h2 {color:var(--g-text-hover);}
.home-box {background-color:var(--g-text-hover);text-align:center;    justify-content: center;display: flex;align-items: center;}
h1.home-left {font-size:3em;}
.right a {color:var(--g-white);}
.box-content img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
    
.section {display: block;}
.section-featured-boxes-special {
    margin-bottom: 0;
    position: relative;
}
.section-featured-boxes-special:before {
    position: absolute;
    content: "";
    background: rgba(19, 98, 128,0.6);
    height: var(--spacing-section);
    width: 100%;
    left: 0;
    bottom: 0;
}
.section-featured-boxes-special.homespecial:before {
    position: absolute;
    content: "";
    background: rgba(19, 98, 128,0.6);
    width: 100%;
    height: unset;
    left: 0;
    bottom: 0;
}

.section-featured-boxes-details {
    margin-bottom: 0;
    position: relative;
}
.section-featured-boxes-details:before {
    position: absolute;
    content: "";
    background: var(--g-text-light);
    height: var(--spacing-section);
    width: 100%;
    left: 0;
    top: 0;
}
p.strapline  {text-align:center;}
.box-text {
    position: absolute;
    top: 0;
    padding: 1.875rem 1.25rem;
    gap: 1.25rem;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0)));
    background: linear-gradient(to bottom, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
}
.box-text.front {position: relative;padding:6em;flex-direction:column;}
.box-text.ppe {background: linear-gradient(to bottom, rgba(204, 86, 0, 1), rgba(204, 86, 0, 0.8));justify-content:start;height:100%;}
.box-text.ppe p,.box-text.ppe h3,h3.askUs,.box-text.statement-box p  {color:var(--g-white);}
.box-text.frontpage p, .box-text.statement-box p,.box-text.frontpage p {color: var(--g-text);font-family: var(--g-secondary-font);}
.box-text.statement-box {background:#abc6d1;display: flex; flex-direction: column;gap:unset;padding:3em;}
.box-text.frontpage {background:#abc6d1;display: flex; flex-direction: column;gap:unset;padding:2em;}
h3.askUs {color: var(--g-white);font-size: 1em;padding-left: 1em;}
.box-text.ppe h3 {font-weight:500;margin-bottom:1em;}
.btn-transparent a {color:var(--g-white);}
.btn-transparent a:hover {color:var(--g-text-hover);}
.box-text.clear {background:none;}


.iconPlacement {flex-direction:column;}
.icon {height:50px;}
.narrow {margin:auto; width:60%;}
.background-navy { background: rgba(19, 98, 128,0.6);}
.background-navy h2, .background-navy h3, .background-navy h4, .background-navy li, .background-navy p {color: var(--g-background-color);}
.wrap {width: 100%;max-width: var(--width-page);padding: 0 var(--width-gutter);margin: 0 auto;}
.section-advantages {padding-top:6em;padding-bottom:6em;}
.section-advantages .advantage { display:flex; flex-direction:column;gap: 5px;transition: all 0.5s ease;}

.section-advantages .advantages-intro { margin-bottom: 4em;}
.section-advantages .advantage .icon img {width: 2.5rem;height: 2.5rem;}
.section-advantages .advantage h3 {font-size: var(--font-size-p);font-weight: var(--weight-bold);}
.section-advantages .advantage p,.section-advantages .advantage h3,.section-advantages .advantage span {color:var(--g-background-color);}
.section-advantages .advantage:hover h3,.section-advantages .advantage:hover p,.section-advantages .advantage:hover span  {color:var(--g-primary);}
.section-advantages .advantages-intro h2 {font-size: var(--font-size-24);text-align: center;color:var(--g-background-color);}
.flex {padding:0;}
.box-text.home-text {align-items: center;display:flex;flex-direction:column;background:none;gap:unset;}

.box-text.aboutpage {display:flex;flex-direction:column;gap: 0.5em;height: 100%; justify-content: center;background:none;}
/*ul.homelist li {list-style-type:disc;margin-left:3em;font-size:0.9em;}
.top-para {margin-top:2em;}
*/
div#engagement div.box-text.home-text > p, #engagement > div.box-text.home-text > ul.qualifications li, #engagement > div.box-text.home-text > .top-para p {color:var(--g-white);}
div#engagement:hover div.box-text.home-text > p, #engagement:hover > div.box-text.home-text > ul.qualifications li, #engagement:hover > div.box-text.home-text > .top-para p {color:var(--g-text);}

.qualifications li {color:var(--g-box-background);font-size:0.9em;list-style-type:disc;margin-left:2em;transition: all 0.5s ease-in-out;}
.ppe .qualifications li {color:var(--g-white);}
#box3 .image-wrap,#box3-csi .image-wrap {background-color: var(--g-text-hover);}
#box3 .qualifications li,#box3-csi .qualifications li {color:var(--g-white);}
#box4 {    grid-column-start: 1;
    grid-column-end: 3;}
.par {display:flex;flex-direction:row;}
.meetIcon {display:flex;width:20%;}
p.meetText {margin:0;}

.established1 {color:var(--g-white);font-family:var(--g-secondary-font);font-weight:600;}
.front-page {color:var(--g-white);margin:1em 1em 1em 0em;}
.accreditations {text-align: center;
    font-size: 0.9em;
    font-style: italic;
    color: var(--g-paragraph);
    margin-bottom: 2em;}
.emailMessage {text-align: center;}    
.emailMessage .emailFail {background:var(--g-red-back);color:var(--g-red-text);padding:2em;}
.emailMessage .emailSuccess {background: var(--g-green-back);color: var(--g-green-text);padding: 2em;}
@media screen and (max-width: 768px) {
    h2.established1 {margin:0;}
    .help-wrapper,.wrap.waysContact {width:100%;}
    .help-wrapper {padding: 0 var(--width-gutter);}
    .established {font-size:1.5em;}
    .box-text.front {padding:1.2em;height:21em;}
    .box-text.ppe {height:100%;}
    .top-para {text-align:center;margin:0 3em;}
    .front-page {font-size:0px;margin:0 2em;}
    .grid-3 {    width: 100%;
        max-width: var(--width-page);
        padding: 0 2.5em;
        margin: 0 auto;
        display: grid;
        gap: var(--small-gutter);
        grid-template-columns: repeat(1, minmax(0, 1fr));
} 
    #box1 {order:3;}
    #box2 {order:2;}
    #box3 {order:1;}
    #box4 {order:4;}
    #box1-csi {order:3;}
    #box2-csi {order:1;}
    #box3-csi {order:2;}
.par {flex-direction:column;}
.problem, .action, .result {width:100%;display:flex;padding:0;}
.parIcon {display: flex;align-items: center;padding:1.5em;}
.parSpan {width:50px;display: flex; justify-content: center;}


.grid-special, .grid-special.about, .grid-special.mainpanel.grid-special.plando {margin-top:2em;width:100%;gap: 0.5em; padding: 0.6em;}
.grid-special h1,.grid-special.about h1,.grid-special p  {font-size:1em;/*margin: 0 0 0.3em 0;*/margin:1em;}
.grid-special .large {grid-row: unset;}
.grid-details, .grid-details.about {margin-top:2em;width:100%;gap: 1em;}
.grid-details h1,.grid-details.about h1,.grid-details p, .grid-details.about p  {font-size:0.7em;margin: 0 0 0.3em 0;}
.grid-special.about.aboutme {grid-template-rows: 25% 22% 23% auto;aspect-ratio: 880 / 2000;grid-template-columns: 1fr;}
.grid-special.plando {grid-template-rows: auto auto 45% 25%;
        aspect-ratio: 880 / 2100;grid-template-columns: 1fr;margin-top: 2em;
        width: 100%;
        gap: 0.5em;
        padding: 0.6em;}
.grid-special.mainpanel {grid-template-rows: 40% 10% 25% 25%;
        aspect-ratio: 880 / 2100;grid-template-columns: 1fr;margin-top: 2em;
        width: 100%;
        gap: 0.5em;
        padding: 0.6em;}
.box-text {padding:0.5em;gap:0;}
.box-text.aboutpage {padding:0.5em;gap:0;}
.box-text.aboutpage h1 {margin-top:0.6em;font-size:1.2em;}
.box-content img { position: relative;}
.top-para {margin-top:0em;}

.grid-special.about, .wrap.about {width: 100%;}
.grid-details.about {width: 100%;}
.section-featured-boxes-special:before {height:3em;}



.box-content.engagement {min-height:17em;}
.box-text.home-text {padding:0;font-size:0.9em;}
h1.home-left {font-size:1.2em;margin:1.1em;}
.box-text.home-text p {margin:0.9em 0.7em 0.5em 0.7em;padding:0;}


}

.arrow-down {
  width: 0; 
  height: 0; 
  border-left: 20em solid transparent;
  border-right: 20em solid transparent;
  border-top: 2em solid var(--g-text-light);
  display:flex;
  margin:auto;
  padding-bottom:6em;
}
.call_to_action, a.call_to_action:visited {border: none;
  color: white;
  background-color:var(--g-text-hover);
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
    transition: all 0.5s ease-out;
}
a.call_to_action:hover {color:var(--g-text-color);background-color:var(--g-box-background);}
a.call_to_action.train {background-color:var(--g-text);}
a.call_to_action.train:hover {color:var(--g-text-hover);background-color:var(--g-box-background);}
@media screen and (max-width: 492px) {
    .grid-4 {padding:0;}
    .grid-special {padding:0;grid-template-rows: repeat(1, 1fr);
        aspect-ratio: auto;
        grid-template-columns:auto;
    }
    .box-content.engagement {min-height: 15em;}
}
.box-text.front.chemical,.box-text.front.fire,.box-text.front.manual,.box-text.front.ppeSafety {display:flex;justify-content:space-evenly;height:25em;}
.trainingDetail {text-align:center;}

/******************************************************************************/
@media screen and (max-width: 768px) {
    .grid-4.trainingpage, .grid-4 {grid-template-columns: repeat(1, minmax(0, 1fr));}
    #box4 { grid-column-start: 1; grid-row-start:4;grid-column-end: unset;}
  .grid-special.about p {font-size:0.9em;margin:0;padding:0.5em 0.5em;}
    .box-text.home-text {display: flex;justify-content: center;height: 100%;padding: 0 2em;}
    .box-text.statement-box,.box-text.statement-box.planact, .box-text.frontpage {font-size:1em;padding:2em;}
    .planact p,.box-text.frontpage p {margin:0;font-size:0.9em;padding:0.5em 0.5em;}
    
    .section-featured-boxes-special.homespecial:before {
    position: absolute;
    content: "";
    background: rgba(19, 98, 128, 0.6);
    width: 100%;
    height: var(--spacing-section);
    left: 0;
    bottom: 0;
}
    #box2-csi .box-content.details {height:5em;} 
    .meetGreet {width:100%;}
    .meetProblem {padding:0 1em;}
    .arrow-down {border-left: 4em solid transparent;
    border-right: 4em solid transparent;}
    
    .main {width:100%;padding:20px;}
    h1.page-title  {margin:0 20px 20px 0px;}
    h1 {font-size: 1.4em;font-weight:500;margin:20px;}
    h2 {text-decoration: none;font-size: 1.2em;font-weight: 500;margin-top: .5rem;color:var(--g-text-hover);}
    input,select,textarea {background-color: transparent;border: none;color: var(--g-paragraph);font-size: var(--g-font-size);width: auto;}
    ::-webkit-input-placeholder,:-moz-placeholder,::-moz-placeholder,:-ms-input-placeholder,::placeholder {color: var(--g-lightgrey);opacity: 0.5;}/* WebKit, Blink, Edge */
    
    .phone-number {display:none;}
    .phone-number a {font-size: larger;font-weight: 600;}
    .phoneIconSpan {display:flex;justify-content: center;align-items:center;}
    .phoneIcon {width:22px;margin-right:0.3em;}
    .site-header {text-align: center;overflow: hidden;justify-content: center;display: flex;flex-direction: row;line-height: normal;align-items: center;padding:15px 0 0;}
    .site-title a {font-size: 20px;font-weight: 600;}
    .mini-icon {width:1.5em;height:1.5em;vertical-align: -0.125em;line-height: normal;stroke:var(--g-lightgrey);}
    .header-15 {display:none;}
    .header-60 {width: 90%;font-weight: bolder;}
    .header-25 {width: 25%;display: none;}
    .mini-cart {width: 10%;display:flex;justify-content:flex-start;}
    #div0 {width: inherit;display: block;}
    #div1 {/*width:100%;*/display: flex;flex-direction: row;justify-content:space-between;align-items: center;padding-left: 18px;padding-right: 20px;margin-bottom: -4px;}
    .mobile-menu-title {color:var(--g-text-light);font-size: 1em;font-family:var(--g-secondary-font);font-weight:600;padding-left:20px;padding-right: 10px;line-height: normal;}
    a.empty-href{display: block;color: var(--g-text-color);}
    nav .navbar img {height:60px;padding-top:5px;}
    nav {width: 100%;height: 70px;background: var(--g-white);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);}
    nav .navbar {width: 100%;display: flex;align-items: center;justify-content: space-evenly;margin: auto;height:auto;padding:0;}
    .links a {font-size: 0.9rem;color: var(--g-text-color);}
    .links li:hover {color: inherit;background-color: inherit;}
    .clh-nav-links{position: fixed;top: 0;left: -100%;display: block;max-width: 80%;width: 100%;background:#f2f2f2;line-height: 40px;padding: 20px;box-shadow: none;transition: all 0.5s ease;z-index: 1000;height:100vh;overflow:auto;}
    .clh-nav-links.open {left: 0;box-shadow: 2px 0 5px rgba(0,0,0,.2);transition: all 0.5s ease;}
    .navbar .clh-nav-links .sidebar-logo{display: flex;align-items: center;justify-content: space-between;}
    .sidebar-logo .logo-name{font-size: 25px;color: #fff;}      
    .navbar .fa-bars{width: 2em;height: 2em;vertical-align: -0.125em;display: block;fill:var(--g-text-light);}
    .navbar .fa-x	{width: 1.5em;height: 1.5em;vertical-align: -0.125em;}
    .links	{display: block;margin-top: 20px;}
    .links li .arrow {line-height: 40px;}
    .links li	{display: block;}
    .links > li {padding:0 14px;}
    .depth-0,.depth-1 {position: relative;top: 0;box-shadow: none;display: none;padding: 0 0 0 12px;border: none;background:#f2f2f2;
        
    left: unset;
    width: unset;
    list-style: none;
    margin: 0;
    }
    .depth-0 li,.depth-1 li {border-bottom: none;background:#f2f2f2;border: none;padding:0 5px 0 15px;}
    .depth-0 a,.depth-1 a {color: var(--g-text);}
    .links > li:hover, .depth-0 > li:hover,.depth-1 > li:hover {background:none;}
    .depth-0 .menu-item-has-children {position: relative;left: 0;}
    .depth-1 {position: relative;left: 0;top:0;}

    .depth-1 li,.depth-0 li {line-height:normal;margin-bottom:12px;}

    #searchButton {padding:0;height:23px;}  
    #search-bar {background: var(--g-background-color);padding: 20px 15px;overflow: hidden;opacity:0;position:relative;z-index:200;left:-999em;box-sizing:border-box;width:100%;top:100%;transform:translateY(-98%);transition:transform 0.8s ease, opacity 0.8s ease, top 0s ease 0.8s, left 0s ease 0.8s;}
    #search-bar.open {transform:translateY(0%);opacity:1;left:0;transition:transform 1s ease, opacity 1s ease;}
    .search-form input:focus {outline: none;background-color: var(--g-white);}

    .links li.has_children > a:after {content: '\25bc';font-size: 7px;vertical-align: 1px;padding-left: 5px;opacity: .75}
    .links li li.has_children > a:after {content: '\25b6';font-size: 7px;vertical-align: 1px;padding-left: 5px;opacity: .75}
    
    .woocommerce-breadcrumb a {color: var(--g-menu-buttons);}
    .woocommerce-breadcrumb a:hover {color: var(--g-text-hover);}
    .woocommerce-breadcrumb {padding-left:20px;padding-top:20px;margin:20px 0 0 0;width:auto;font-size: 0.8rem;border-bottom: none;}

    input,select,textarea {background-color:var(--g-background-color);padding: 5px;}
    .lineName {flex-wrap: wrap;}
    .formName, .formPhone {width:100%;}

 
    .footer {font-size: 13px;padding-bottom: 14px;	text-align: center;width: 100%;background-size:40%;}
    .footer-wrapper {display: flex;margin-bottom: 3em;margin-top: 3em;justify-content: space-between;padding-left: 2em;}
    .footer-wrapper li {list-style-type: circle;}
    .inner-container {padding-top: 6em;}
    .menu-utility  {text-align: left;}
    .menu-utility a {font-size: larger;line-height: 1.8;display:block;height:100%;}
    .social-media {height:2em;width:3em;}
    .site-info.social-icons {display:none;}
    .site-info svg {fill: var(--g-text-light);}
    .site-info svg:hover {fill: var(--g-text-hover);}
    .social-icons {display:flex;justify-content: right;padding-right:1em;padding-top:1em;width: 100%;margin-bottom: 4em;}
    a[x-apple-data-detectors] {color:var(--g-white)!important;text-decoration: none !important;font-size: inherit !important;font-family: inherit !important;font-weight: inherit !important;line-height: inherit !important;}

    .svg-top {top:-1px;}
    
    .credentials img {width:100%;}

}



.depth-0 li,.depth-1 li {border-bottom: none;background:#f2f2f2;border: none;padding:10px 15px;}