@font-face {
    font-family: 'Asap';
    src: url('fonts/Asap-Medium.woff2') format('woff2'),
        url('fonts/Asap-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Asap';
    src: url('fonts/Asap-Bold.woff2') format('woff2'),
        url('fonts/Asap-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}


@font-face {
    font-family: 'Asap';
    src: url('fonts/Asap-MediumItalic.woff2') format('woff2'),
        url('fonts/Asap-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
}

:root {
	--blue: rgba(46,69,82,1);
	--white: #F2F2F2;
	--yellow: rgba(222,221,28,1);
	--transYellow: rgba(222,221,28,0.85);
}

*, *::before, *::after {box-sizing: border-box;}

a:focus,
input:focus, 
select:focus {background-color: rgba(222,221,28,0.33); outline: none;}

html {overflow-x: hidden;}
html, 
body {padding: 0; margin: 0;}

table tr {vertical-align: baseline;}
table td {border: 1px solid var(--blue); padding: 0.25rem;}

div.cky-btn-revisit-wrapper {
    left: -100% !important;
/* mobile   top: calc(100vh - (1.25rem + 45px)) !important;*/
    top: calc(100vh - (1rem + 45px)) !important;
    transition: 0.5s ease-out;
    background-color: var(--transYellow) !important;
}

div.cky-btn-revisit-wrapper.ckyscrollin {
    left: 1rem !important;
}

#loader, 
nav {
	position: fixed; 
	z-index: 999; 
	top: 0; left: 0; 
	background-color: var(--white); 
	display: flex; 
	flex-flow: row nowrap; 
	align-items: center; 
	justify-content: center;
	align-content: space-between;
	width: 100%; 
	height: 100vh;
	transition: 0.5s ease-out; 
	pointer-events: none;
	opacity: 1;
}
#loader > * {max-width: 750px;transition: 0.5s ease-out; transition-delay: 0.75s; height: 100%; padding: 0 1rem;}

/*#catapult-cookie-bar {
    right: 2.5rem !important;
    bottom: 5rem !important;
    transition: opacity 0.25s !important;
}*/

#cookie-law-info-bar {margin-bottom: 6rem; transition: opacity 0.25s !important;}

.small.cli-plugin-button, .small.cli-plugin-button:visited {
    font-size: inherit !important;
}

#cookie-law-info-bar .cli_messagebar_head {font-size: 21px;}

.cli-style-v2 {font-size: 14px;}

section:not(#slider) > *, 
footer > *, 
.breakOut > *,
a.InjruyTypeGroup {
	transform: translate3d(-25vw, 0, 0); 
	opacity: 0;
	transition: 0.75s ease-out;
	backface-visibility: hidden; 
	transform-style:preserve-3d;
	/*will-change: transform;*/
}

section:not(#slider) > *:nth-child(2n), 
footer > *:nth-child(2n), 
.breakOut > *:nth-child(2n), 
.breakOut > *:nth-child(3n),
a.InjruyTypeGroup:nth-child(2n) {
	transform: translate3d(-25vw, 0, 0); 
	transition-delay: 0.1s;
}

section:not(#slider) > *:nth-child(3n), 
footer > *:nth-child(3n), 
.breakOut > *:nth-child(3n),
a.InjruyTypeGroup:nth-child(3n) {transition-delay: 0.2s;}

*.animateOn {backface-visibility: hidden; transform-style: preserve-3d;}

section:not(#slider) > *.animateOn,
section:not(#slider) > *.animateOn a.InjruyTypeGroup,
footer > *.animateOn, 
.breakOut > *.animateOn {transform: translate3d(0,0,0) !important; opacity: 1;}

img, figure video {width: 100%; height: auto; max-width: 100%; min-width: 0; max-height: 100vh;}

h1,h2,h3,h4,h5,h6,p,div,a {font-family:'Asap', Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; line-height: 1.2;}

h1,h2,h3,h4,h5, strong, strong * {font-weight: bold;}

h6,p,ul,li,div,* {font-weight: 500;}

p, ul, li {line-height: 1.45;}

/*ul, li { font-style: italic;} testing */

figcaption {font-style: italic; font-size: 0.75em;}

span {font-weight: inherit !important; font-style: inherit !important;}

p span {text-transform: lowercase;} /* ? */

a {text-decoration: none; color: inherit;}

strong > u {
    text-decoration: none !important;
}

strong a {
    background-color: white;
    padding: 0rem 0.2em 0.1em;
    text-decoration: none !important;
    border: 1px solid dodgerblue;
    margin: 0 0.05em;
}

strong a:hover {
    background-color: dodgerblue;
    color: white !important;
}

.mainForPost .halfBlockRow > p, .mainForPost .halfBlockRow > img, .mainForPost .halfBlockRow > figure { /* TESTING */
    margin: 2rem 0 3rem !important;
}

.yellow {
	background-color: var(--yellow);
	color: var(--blue);
}

.white { 
	background-color: var(--white);
	color: var(--blue);
}

.blue {
	background-color: var(--blue);
	color: var(--white);
}

.phoneBox.blue {color: var(--yellow);}

a.yellow, 
a.white, 
a.blue {
	transition: 0.25s ease;
	border: 1px solid transparent;
}

a.yellow:hover {
	background-color: var(--white);
	color: var(--blue);
}
a.white:hover {
	background-color: var(--yellow);
}

a.blue:hover {
	background-color: var(--white);
}

nav {
	transform: translateY(-150vh);
	transition-delay: 0s !important;
	pointer-events: all !important;
	flex-flow: row wrap !important;
	padding: 0 1rem;
	overflow-y: scroll;
	justify-content: flex-end !important;
    z-index: 998;
}
nav.opened {transform: translateY(0);}

#brandArea, 
#linksArea {
    display: flex;
    flex-flow: row wrap;
    flex: 1 1 100%;
    padding: 0 25vw;
    align-items: center;
    justify-content: center;
}

#linksArea {
	padding: 2rem 0.5rem !important;
	justify-content: space-around !important;
	text-align: center;
	align-items: baseline;
}

.verticleLine {
	flex: 0 0 1px;
	background-color: var(--blue);
	align-self: stretch;
}
.verticleLine:last-of-type {display: none;}
header .suasageLinks {justify-content: flex-end; font-size: 1.1em;}
header .suasageLinks > li {
	padding: 0 0.5em;
	border-right: 1px solid var(--blue);
	list-style: none;
    position: relative;
}

header .suasageLinks li ul.sub-menu { /* EDITING 310320 */
    position: absolute;
    top: unset;
    left: -1px;
	padding: 0.5em 0.5em 0;
	list-style: none;
    opacity: 0;
    transform: translateY(-1rem);
    transition: 0.25s ease-in;
    visibility: hidden;
    background-color: #f2f2f2;
    z-index: 900;
    margin-top: 0;
    border-left: 1px solid rgba(46,69,82,1);
    max-height: 20rem;
    overflow-y: scroll;
}
header .suasageLinks li ul.sub-menu li {
    padding: 0.5em 0;
    border-top: 1px solid rgba(46,69,82,1);
    line-height: 1.05 !important;
} 

header .suasageLinks > li:hover > ul.sub-menu {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}
header .suasageLinks > li:last-of-type { border: none; padding: 0 0 0 0.5em; }

footer .suasageLinks li {line-height: 2;}

footer a:hover {color: dodgerblue;}

/*footer .suasageLinks li ul.sub-menu::before {content: ' - ';}*/

footer .ACUKBlurb {
	max-width: 750px;
  	text-align: center;
  	padding-bottom: 2rem;
  	margin-bottom: 0;
  	position: relative;
}

footer .ACUKBlurb::after {
    content: '';
    margin: 0 auto;
	position: absolute;
	bottom: 0;left: 0;right:0;
	width: 5rem;
	height: 1px;
	background-color: var(--blue);
}

footer .menu-item-has-children {
    padding: 1rem !important;
    margin-bottom: 1rem;
    background-color: rgba(46,69,82,1);
}

footer .menu-item-has-children a {
    color: #F2F2F2 !important;
}footer .menu-item-has-children a:hover {color: rgba(222,221,28,1) !important;}

footer .menu-item-has-children > a {
    text-decoration: none !important;
    background-color: dodgerblue;
    padding: 0.25em;
}footer .menu-item-has-children > a:hover {background-color: rgba(222,221,28,1); color:rgba(46,69,82,1);}



footer .suasageLinks li ul.sub-menu {
    padding-left: 0;
    list-style: none;
    display: inline;
}footer .suasageLinks li ul.sub-menu li {display: inline; font-size: 1em; padding-right: 0.5em;  }


#linksArea .exampleLinks {
    flex: 1 1 20%;
    position: sticky;
    top: 1rem; /* intergrate! */
}

/*.exampleLinks:nth-of-type(3),
.exampleLinks:nth-of-type(5) {flex-grow: 5 !important;}*/

#linksArea h3 {
	font-size: 1.5em;
	color: var(--blue);
	text-decoration: underline;
}

#linksArea ul {
	list-style: none;
	color: var(--blue);
	display: table;
    margin: 0 auto;
}

#linksArea div > ul {
	padding: 0rem 2rem 2rem;
}

#linksArea .exampleLinks > ul > li > ul.sub-menu {
	padding: 0.5rem;
    border: 1px solid var(--blue);
    margin-bottom: 2rem;
    margin-top: 0.25rem;
    width: 100%;
    font-size: 0.9rem;
}

#linksArea .exampleLinks > ul > li > ul.sub-menu li > ul {
    padding: 0.225rem;
    font-size: 0.75rem;
    border-top: 1px solid;
    border-bottom: 1px solid;
    margin-top: 0.25rem;
    width: 75%;
}

#linksArea li {margin: 0.5rem 0;}
#linksArea li:nth-of-type(2n) {color: #8c8f9e;}

#linksArea a {transition: 0.25s ease;}
#linksArea a:hover {
	color: var(--yellow);
}

form {display: flex; flex-flow: row wrap;font-size: 1.5em;}
form.search-form {align-items: flex-end;}

.page-template-corePage form {margin: 0 1rem 0;}

form > * {flex: 1 1 40%;}

input, 
select {
	background-color: transparent;
	border: 2px solid var(--white);
	color: var(--white);
	padding: 0.5rem 0.75rem;
	/* width: 50%; */
	margin: 0.75rem;
	font-size: 0.75em;
	border-radius: 100px;
    max-width: calc(100% - 1.5rem);
}

.page-template-corePage input, .page-template-corePage select {
    font-size: 0.65em;
    margin: 0.75rem 0.25rem;
    padding: 1rem 0rem 0.75rem 1rem;
}

select {-webkit-appearance: none;/*font-size: 0.75rem;padding: 1em 0.75em;*/}

input.prefill, select.prefill, option.prefill {background-color: var(--white); color: var(--blue) !important;}

::placeholder {color: var(--white); opacity: 1;}
:-ms-input-placeholder {color: #F2F2F2;opacity: 1;}
*::-webkit-input-placeholder { border: none !important;opacity: 1;}

input.prefill::placeholder, select.prefill::placeholder, option.prefill::placeholder {color: var(--blue) !important;opacity: 1;}
input.prefill:-ms-input-placeholder, select.prefill::-ms-input-placeholder, option.prefill::-ms-input-placeholder {color: rgba(46,69,82,1) !important;opacity: 1;}

option {color: var(--blue);}

input[type="submit"] {
	background-color: var(--yellow);
	color: var(--blue);
	border: none;
	transition: 0.25s ease;
	cursor: pointer;
}input[type="submit"]:hover {
	background-color: var(--white);
}

label.checkboxLabel {
	flex: 1 1 100%;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: center;
	margin: 0 1.5rem;
}
label.checkboxLabel input {margin: 0 1rem 0 0; transform: scale(1.5);}
label.checkboxLabel p {font-size: 0.65rem; text-align: left; line-height: 1.2;}
label.checkboxLabel a {color: var(--yellow); text-decoration: underline;}

.swearch .halfBlock input,
.no-results .halfBlock input {
	border: 2px solid var(--blue);
	color: var(--blue);
	width: auto;
	margin: 1rem 0 !important;
}
.swearch .halfBlock input[type="submit"]:hover,
.no-results .halfBlock input[type="submit"]:hover {
	background-color: var(--blue);
	color: var(--yellow);
}

header {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: space-between;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background-color: var(--white);
	padding: 1rem 2rem;
	z-index: 900;
	box-shadow: 0px 0px 25px -5px var(--blue);
}/*
header {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: space-between;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background-color: var(--white);
	padding: 1rem 2rem 0;
	z-index: 900;
}*/

header > * {flex: 0 1 11rem;}

header > h2, 
header > h4 {
	position: relative;
	color: var(--yellow);
	background-color: var(--blue);
	flex: 1 1 100%;
	text-align: center;
	padding: 0.5em 2em;
	font-weight: bold;
	font-size: 1em;
	text-transform: capitalize;
	margin: 0;
	margin-top: 1rem;
	margin-left: -2rem;
	margin-right: -2rem;
}

header > h2::before, 
header > h2::after, 
header > h4::before, 
header > h4::after { 
	content: ''; 
	width: 15vw; 
	height: 3px; 
	background-color: var(--yellow); 
	position: absolute;
	border-radius: 10px; 
	top: 47.5%;
}

header > h2::before, 
header > h4::before {margin-left: -16.5vw;}

header > h2::after, 
header > h4::after  {margin-left: 1.5vw;}

header > div {
	flex: 1 1 33%;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: flex-end;
}

header > div > .numberAndIcon, 
.formArea .numberAndIcon {margin-right: 1rem;}

div.numberAndIcon a.tel.InfinityNumber.clickable::after, a.InfinityNumber.phoneBox::after, a#callUs::after {
	content: "\005E";
	font-size: 0.5em;
	position: absolute;
}
a.InfinityNumber.phoneBox::after {
	right: 1.25rem;
	top: 1rem;
}

.block .numberAndIcon {margin-bottom: 1rem;}

header div div, 
.block .numberAndIcon, 
.block .messageAndIcon, 
.numberAndIcon, 
.messageAndIcon {
	display: flex; flex-flow: row nowrap;
	align-items: center;
	justify-content: space-around;
	flex: 0 1 13rem;
	font-size: 1.25em;
}

/*header div a, */
header div p, 
.block .numberAndIcon a, 
.block .messageAndIcon p,
.block .messageAndIcon a,
.numberAndIcon a, 
.messageAndIcon p,
.messageAndIcon a {
	text-decoration: none;
	color: var(--blue);
	font-weight: bold;
	flex: 1 0 10rem;
	cursor: pointer;
	transition: 0.25s ease;
}
.suasageLinks {
    flex: 1 1 90%;
	margin: 0.5rem 0;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
	list-style: none;
	line-height: 0;
}

.suasageLinks a {
	font-size: 0.75em;
	color: var(--blue);
	transition: 0.25s ease;
	font-weight: normal;
	padding: 0 0.1em;
} 

header div > p:hover, 
header div a:hover {
	color: var(--yellow);
}

header div img, 
.block .numberAndIcon img, 
.block .messageAndIcon img, 
.numberAndIcon img,  
.messageAndIcon img {
	margin-right: 1rem;
	flex: 1 0 20%;
    max-height: 3.5rem;
}

.block h4 {color: var(--yellow); font-style: italic;}

header img {
	width: auto !important;
	height: auto !important;
}

header #logo {
	flex: 0 1 25rem;
    width: 100%;
    transition: 0.25s ease;
}header #logo:hover {
    transform: scale(1.05);
}

.burger, 
#navCloser {
	width:  auto;
    flex: 0 0 2.6rem;
    margin: 0 0rem 0 1rem !important;
	cursor: pointer;
	transition: 0.25s ease-out;
}
.burger img {width: 100% !important; height: 100% !important;}
.burger:hover, 
#navCloser:hover {
	opacity: 0.75;
	transform: scale(1.25,1.25);
} 

#navCloser {
	position: absolute;
	top: 1rem;
    right: 1rem;
	width: 2.6rem;
    z-index: 20;
}

section, 
main, 
footer {
	min-height: calc(100vh - 8rem); 
	width: 100%;
	background-color: var(--white);
	color: var(--blue);
	position: relative;
	padding: 2rem;
	display: flex;
	flex-flow: row wrap;
	align-items: stretch;
	justify-content: space-between;
	
}

header ~ img.attachment-post-thumbnail, 
header ~ img.attachment-full.size-full.wp-post-image, 
header ~ #corePageTitleArea img.attachment-full.size-full.wp-post-image { /* EDITING 050420 top:0; height: 100vh; object-position: top; */ 
    height: 66vh; 
    max-height: 100vh; 
    object-fit: cover; 
    position: fixed; 
    top: 6rem; 
    left: 0; 
    object-position: center;
    backface-visibility: hidden;
    transform-style: preserve-3d;
}

#corePageTitleArea + main {margin-top: 0 !important;}

header ~ img.attachment-post-thumbnail ~ main.mainForPost, 
header ~ img.attachment-full.size-full.wp-post-image ~ main.mainForPost {padding: 2rem 2rem 2rem 0;}

img.attachment-post-thumbnail ~ main div.halfBlock, 
img.attachment-full.size-full.wp-post-image ~ main div.halfBlock { /* EDITING 050420 margin-top: -11rem; */
    
    margin-top: calc(1 * (6rem + -40vh));
    background-color: #F2F2F2;
    margin-right: 2rem;
    border-radius: 0rem 2.5rem 0 0;
}

img.attachment-post-thumbnail + div.breakOut, 
img.attachment-full.size-full.wp-post-image + div.breakOut {margin-top: 50vh !important;}

img.attachment-post-thumbnail + div.breakOut ~ main div.halfBlock, 
img.attachment-full.size-full.wp-post-image + div.breakOut ~ main div.halfBlock {margin-top: 0rem;}

main {margin-top:6rem;}

#slider ~ main, 
img.attachment-post-thumbnail ~ main, 
img.attachment-full.size-full.wp-post-image ~ main {margin-top:0rem !important;}

img.attachment-post-thumbnail ~ main, 
img.attachment-full.size-full.wp-post-image ~ main {margin-top:70vh !important;}

img.attachment-post-thumbnail + div.breakOut ~ main, 
img.attachment-full.size-full.wp-post-image + div.breakOut ~ main {margin-top:0 !important;}

main .halfBlockRow figure,
/*main .halfBlockRow iframe,*/
main .halfBlockRow > video {max-width: 100%; margin: 1rem 0; width: auto !important;}

main .halfBlockRow p img[class*="wp-image"] {float: left; margin: 0.4rem 1rem 0.4rem 0; width: auto !important;}

main, footer {
	min-height: 0; 
	padding: 4rem 2rem;
	align-items: flex-start;
}

main > * {
    z-index: 5;
}

main div.circle { /* main.mainForPost div.circle EDITING 310320 */
	bottom: unset;
	opacity: 0.7 !important;
	top: -50vh;
	left: -25vw;
	z-index: 0;
}

main.mainForPost div.circle {left:-10vw;}

main.mainForPost > div.circle { /* main.mainForPost div.circle EDITING 070420 */
    right: -90% !important;
	top: -90vh;
	left: 0 !important;
	z-index: 0;
}


#slider.smallSlider ~ main div.circle {
	bottom: -100px;
	top: unset;
}

main article.formArea {
	flex: 1 1 100%;
	padding: 2rem;
	margin: 0 !important;
	border-radius: 0px 0px 50px 50px;
	top: 12rem;
	/*min-height: calc(100vh - 14rem);*/
    min-height: calc(100vh - 18rem);
}

main article.formArea h2 {margin: 0 0 0.25em; font-size: 2em;}

main article.formArea .numberAndIcon {
	margin: 0;
}

main article.formArea h4 {/*margin-top: 0em;*/margin-bottom: 0;}

.tce-logo {
	max-height: 11rem;
	width: auto;
	
	margin-left: 0rem;
	margin-top: 1rem;
	
}
.revealed .tce-logo {
	max-height: 13rem;
	margin-left: -5.5rem;
	margin-top: -1rem;
}


main#secondMain {padding-top: 0;}

main#secondMain .halfBlock:first-of-type {
	order: 5;
    flex: 1 1 100%;
}
main#secondMain .halfBlock #wpFPContent {
	padding: 0 5%;
}

main#secondMain .halfBlock #wpFPContent h3/*, 
main#secondMain .halfBlock #wpFPContent p + h3, 
main#secondMain .halfBlock #wpFPContent ul + h3*/ {
	margin-top: 3rem;
	border-bottom: 1px solid var(--blue);
	padding-bottom: 0.25rem;
    text-transform: uppercase;
}

main#secondMain .halfBlock > img {
	min-height: calc(100vh - 16rem);
	object-fit: cover;
	object-position: right;
}

.halfBlockRow {
	padding: 0 15% 4rem 10%;
	margin-bottom: 2rem;
}

main.mainForPost .halfBlockRow {max-width: 700px; }
.page-template-corePage main.mainForPost .halfBlockRow {max-width: 900px; }

img.attachment-post-thumbnail ~ main div.halfBlock .halfBlockRow, 
img.attachment-full.size-full.wp-post-image ~ main div.halfBlock .halfBlockRow {
    padding: 2rem;
    margin-bottom: 0;
    z-index: 23;
    position: relative;
} 

.groupedHeadnIcon {
    width: 100%;
    position: relative;
}
.groupedHeadnIcon h1 {
    border-bottom: 2px solid rgba(46,69,82,1);
    padding: 0 0 1rem;
    line-height: 1.05;
}
/*#breadcrumbs {
    margin: 0 !important;
    border: 1px solid rgba(46,69,82,1);
    padding: 1rem;
    font-size: 0.85em;
    font-style: italic;
    background-color: rgba(46,69,82,0.25);
    display: inline-block;
}*/

.halfBlock a {color: dodgerblue;text-decoration: underline; transition: 0.25s ease;}
.halfBlock h3 a, .halfBlock h2 a, .halfBlock h4 a, .halfBlock h5 a, .halfBlock h6 a {text-decoration: none;}

.halfBlock a:hover, .formArea .numberAndIcon a:hover {color: rgb(222, 221, 28);}

.halfBlockRow h1 {
	font-size: 3em;
	line-height: 1;
    margin-top: 0; /* new */
}

.halfBlockRow h2, body.home .halfBlockRow h1 {
	font-size: 2.25em !important;
	line-height: 1.1;
}

.halfBlockRow h3 {
	font-size: 1.5em;
	max-width: 100% !important;
}

section#slider/*, section#slider > div.classical*/ {
	padding: 0;
	overflow: hidden;
	flex-flow: row nowrap;
	align-items: stretch;
	justify-content: flex-start;
	/*background-color: transparent;*/
	/*z-index: 250;*/
    z-index: 1;
}

div.circle {
	position: absolute;
	background-color: var(--yellow);
	/*background-color: transparent;*/
    background-image: linear-gradient(35deg, var(--yellow) 60%, rgba(222,221,28,0.00));
	border-radius: 50%;
	width: calc((600px / 0.7) - 2.5vw);
	padding-bottom: calc((600px / 0.7) - 2.5vw);
	
	width: calc((600px / 0.8) + 5vw);
	padding-bottom: calc((600px / 0.8) + 5vw);
	bottom:-15vh;
	left: -100px;
	margin: auto;
	z-index: 0;
	transition: 0.75s ease;
	transform-origin: left;
	opacity: 0.9;
	transform-style: preserve-3d;
    backface-visibility: hidden;
    /*background-position: 10% 90%;
    background-size: 70%;

    background-repeat: no-repeat;*/
}

/*
.circle.spin {
	transform: rotate(-360deg);
}
.circle.spinback {
	transform: rotate(360deg);
}*/

.controls, 
.prompts {
	position: absolute;
	right: 2rem;
	bottom: 2rem;
    /* late-COVID bottom: 6rem; */
	z-index: 10;
	display: flex;
	flex-flow: row nowrap;
}

.prompts {
	right: unset;
	left: 3rem;
}

.controls > * {
	background-color: var(--transYellow);
	border-radius: 50%;
	width: 3rem;
	height: 3rem;
	padding: 0.25rem 0.75rem;
	color: var(--blue);
	font-size: 2em;
	font-weight: bold;
	transition: 0.25s ease-out;
	cursor: pointer;
	border: 2px solid var(--blue);
	line-height: 0.9;
}

.prompts > *, 
.slide > a {
	border: 2px solid var(--blue);
	border-radius: 50px;
	width: auto;
	padding: 0.5rem 1.5rem;
	color: var(--blue);
	font-size: 1.25em;
	
	font-style: italic;
	transition: 0.25s ease-out;
	cursor: pointer;
}

.slide > a {
	transform: translateX(200px);
	transition-delay: 0.35s;
	transition: transform 1s ease-out, border 0.25s ease-out, color 0.25s ease-out;
    /*align-self: flex-end;*/
    margin-bottom: -4rem;
    margin-top: 1rem;
	margin-left: 380px;
    font-size: 1em;
    font-weight: normal;
	opacity: 0;
	z-index: 15;
    background-color: rgba(222,221,28,0.8);
}

.prompts > *:hover, 
.slide > a:hover {
	border: 2px solid var(--white);
	color: var(--white);
}

.controls > *:hover {background-color: rgba(185, 185, 53, 0.5); border-color: var(--yellow); color: var(--blue);}

.controls > .left, 
.prompts > * {margin-right: 1rem;}

.controls > .right {padding-left: 0.9rem;}

.slide {
	flex: 1 0 100%;
	width: 100%;
	min-height: 100vh;
	position: relative;
	display: flex;
	flex-flow: column wrap;
	align-items: flex-start;
	align-content: flex-start;
	justify-content: flex-end;
	padding: 10rem 3rem 6rem; 
    /* late-COVID padding: 10rem 3rem;*/
	transition: 0.25s ease-out, opacity 0.5s ease;
	/*overflow-x: hidden;*/
    font-size: 1.3em;
	transform-style: flat;
	backface-visibility: hidden;
}

.slide h2, 
.slide h3,
.slide dd,
.slide > p {
	position: relative;
	z-index: 5;
	color: var(--blue) !important;
	transform: translateX(200px);
	opacity: 0;
	line-height: 1;
	transition: 1s ease-out;
	min-width: 250px;
	max-width: 650px;
    transform-style: flat;
    backface-visibility: hidden;
}

.slide h2 {
	animation-delay: 0.1s;
	font-size: 2.25em;
	margin: 0 0 0.25em;
	font-weight: bold;
}
.slide h3 { /* text-align: right; EDITING 30/03/20 */
	animation-delay: 0.15s;
	margin: 0;
	padding: 0 0rem 0 5rem;
	text-align: left;
	position: relative;
	font-size: 1.25em;
	color: var(--white) !important;
	font-style: italic;
	font-weight: bold;
	transition-delay: 0.1s;
}

.slide h3::before {
	content: '';
	position: absolute;
	height: 2px;
	background-color: var(--white);
	left: 0;
	top: 50%;
	width: 4rem;
}
.slide dd,
.slide > p {
	animation-delay: 0.2s;
	line-height: 1.2;
	transition-delay: 0.2s;
}

.slide img {
	position: absolute;
	object-fit: cover;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
    min-height: 100%;
	transition: 0.5s ease-out;
	transition-delay: 0.25s;
    transform-style: flat;
    backface-visibility: hidden;
	opacity: 0.1;
}

.slide.onthescreen > img {opacity: 1 !important;}
.slide.onthescreen > * {opacity: 1 !important ;transform: translateX(0) !important;}
.slide.animationOff > * {animation: none !important;opacity: 1;transform: translateX(0);}
.slide.animatePaused > * {animation-play-state: paused !important;}

@keyframes ontoscreen {
	0% {transform: translateX(200px);opacity: 0;}
	25%, 92.5% {opacity: 1;}
	20%, 95% {transform: translateX(0);}
	100% {transform: translateX(-200px);opacity: 0;}
}

 @supports (-ms-ime-align:auto) {
     .slide img {
        transform-style: preserve-3d;
        backface-visibility: hidden;
     }
}

section#slider.smallSlider, 
section#slider.smallSlider .slide {min-height: 65vh !important; overflow: hidden;}

main ~ section#slider.smallSlider, 
main ~ section#slider.smallSlider .slide {padding-top: 0;}

section#slider.smallSlider .slide {align-content: center; text-align: center; align-items: center !important; justify-content: flex-end !important; padding: 4rem 3rem 5rem !important;}

/*section#slider.smallSlider .slide p {font-size: 0.8em;}*/
section#slider.smallSlider .slide > a {align-self: center;margin: 0 !important;}

section#slider.smallSlider .prompts {right: 0; left: 1rem; align-items: center; justify-content: center;}
section#slider.smallSlider .prompts, section#slider.smallSlider .controls {bottom: 1rem !important;}

section#slider.smallSlider div.circle {bottom: -32.5vh !important; right: 0 !important;left: 0 !important; transform-origin: center; display: 
block !important; background-color: var(--yellow) !important;}

img.attachment-post-thumbnail + div.breakOut ~ main div.circle, 
img.attachment-full.size-full.wp-post-image + div.breakOut ~ main div.circle {top: -10vh; left: -20vw;}

#sliderPayne {
    /*position: sticky; 
    top: 12rem;*/
	width: 100%;
	padding: 0 !important;
	height: 100%;
    max-height: calc(100vh - 11rem);
    overflow: hidden;
}

#sliderPayne > div {
    height: 100%;
    display: flex;
    padding: 0 !important;
	flex-flow: row nowrap;
    width: 100%;
    /*min-height: calc(100vh - 16rem);*/
    animation: 20s mainTwoAutoSlider ease-out infinite;
    backface-visibility: hidden;
    transform-style: flat;
}

@keyframes mainTwoAutoSlider {
    0%, 22.5%, 100% {transform: translateX(0);}
    25%, 52.5% {transform: translateX(-100%);}
    55%, 72.5% {transform: translateX(-200%);}
    75%, 97.5% {transform: translateX(-300%);}
}

#sliderPayne .imgCaption {
	flex: 1 0 100%; 
	padding: 0 !important;
	object-fit: cover;
	max-width: 100%;
	height: 100%;
	align-items: stretch;
	justify-content: flex-start;
	transition: 0.25s ease-out;
	position: relative;
    min-height: calc(100vh - 16rem);
}

#sliderPayne picture {display: flex; height: 100%;}

#sliderPayne picture img {width: 100%; height: 100%; object-fit: cover;}

#sliderPayne picture.imgCaption[alt]::after {
    content: attr(alt);
    position: absolute;
	background-color: var(--blue);
    bottom: 0;
    left: 0;
	padding: 1rem 2rem;;
    right: 0;
    width: 100%;
	display: table;
    font-size: 1em;
    z-index: 99;
    color: white;
    font-family: inherit;
   text-align: center;
}

#messageBox {
	width: 100%;
	height: calc(100vh - 7.5rem);
	padding: 2em;
	position: fixed;
	z-index: 999;
	top: 7.5rem;
	left: calc(-100vw - 25em);
	background-color: rgba(46,69,82,0.9);
	color: var(--white);
	display: flex;
	flex-flow: row wrap;
	align-items: stretch;
	justify-content: center;
	opacity: 0;
	transition: 0.25s ease-out opacity;
}

nav.opened ~ aside#messageBox {
    top: 0;
    height: 100vh;
}

#messageBox > img {
	flex: 1 1 10%; 
	object-fit: cover;
	border: 1px solid var(--white);
	border-right: none;
	transition: 0.35s ease-out 0.25s;
	transform: translateX(-100vw);
	/* max-height: 100%; maaaaaybe - isn't is not liked by chrome? */
}
#messageBox article {
	flex: 2 1 49%;
	border: 1px solid var(--white);
	border-left: none;
	transition: 0.25s ease-out 0.25s;
	opacity: 1;
	transform: translateX(-100vw);
	border-radius: unset;
    max-width: 100%;
}

#messageBox.revealed {
	left: 0;
	opacity: 1;
} 

#messageBox.revealed article {
	max-height: 100%;
	overflow: scroll;
	align-content: space-between;
} 

#messageBox.revealed article, 
#messageBox.revealed img  {
	transform: translateX(0);
} 

#messageBox .formArea .numberAndIcon ~ h4 {
    margin-left: 1.5rem !important;
    flex: 0 1 auto !important;
}
/*#messageBox .formArea h4 {
    margin-left: 0 !important;
    flex: 0 1 auto !important;
}*/

#messageBox .formArea .numberAndIcon {
    margin-right: 0 !important;
    flex: 0 1 15rem !important;
    justify-content: center !important;
}
#messageBox .formArea .numberAndIcon img {
    flex: 0 0 20% !important;
}


#close {
	position: absolute;
	top: 0rem;
	right: 1rem;
	background-color: var(--yellow); 
	border-radius: 50%; 
	color: var(--blue);
	padding: 1rem 1.35rem;
	transition: 0.25s ease;
	cursor: pointer;
	z-index: 99;
}
/*#close {
	position: absolute;
	top: -2rem;
	right: -1rem;
	background-color: var(--yellow); 
	border-radius: 50%; 
	color: var(--blue);
	padding: 0.9rem 1.35rem;
	transition: 0.25s ease;
	cursor: pointer;
}*/

#close:hover {background-color:tomato !important;}

section > h2 {margin:0;}

div.breakOut {
	width: 100%;
	height: auto;
	padding: 2rem;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: space-around;
	z-index: 5;
	position: relative;
}

div.breakOut > * {margin: 0.25em 0;}

div.breakOut.column {
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
	text-align: center;
}

div.breakOut.column > p {
	color: var(--yellow);
	font-style: italic;
	font-weight: bold;
	font-size: 1.5em;
	text-align: center;
    max-width: 100%;
}

div.breakOut.icon-group {
    padding: 3rem 10vw;
    align-items: stretch;
    
}

div.breakOut.icon-group > * {
    padding: 1rem;
    
    margin: 0 1rem 1rem;
    text-align: center;
    display: flex;
    flex-flow: row wrap;
    align-content: space-between;
    align-items: center;
    justify-content: center;
    
}
div.breakOut.icon-group > a {
    cursor: pointer;
    border-radius: 2rem;
    flex: 1 1 25%;
}

div.breakOut.icon-group.five-group > div.iconBlock {
    flex: 1 1 10%;
}

div.breakOut.icon-group img {
    max-height: 200px;
}

div.breakOut.icon-group h3 {
    font-size: 1.5em;
}
div.breakOut.icon-group .icbCTA {
    border: 2px solid var(--yellow);
    color: var(--yellow);
    padding: 0.5rem 1rem;
    display: table;
    margin: 0 auto;
    transition: 0.25s ease;
}
div.breakOut.icon-group a.iconBlock:hover {
    background-color: var(--transYellow);
}
div.breakOut.icon-group .iconBlock:hover > .icbCTA {
    background-color: var(--white);
    color: var(--blue);
}

div.halfBlock {
	flex: 1 1 35%;
	display: flex;
	flex-flow: column;
	padding: 2rem;
    align-items: center;
}

section.hashalfImg {
	padding: 0;
}

.hashalfImg .halfBlock {
	padding: 4rem;
}

.halfImg {
	flex: 1 1 45%;
	object-fit: cover;
	/*position: sticky;
	top: 7rem;*/
}

article.formArea {
	background-color: var(--blue);
	padding: 2rem 3rem;
	color: var(--white);
	/*position: sticky;
	top: 9rem;*/
	flex: 3 1 60%;
	text-align: center;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	align-content: space-around;
	border-radius: 50px 0 0 50px;
}

section .formArea, 
footer .formArea {margin-right: -2rem;} 

.formArea h2 {flex: 1 1 100%; font-size: 3em;}

.revealed .formArea h2 {margin-bottom: 1rem;}

.formArea .numberAndIcon a {
	color: var(--white);
	margin-right: 1em;
}
	
.formArea h4 {
	color: var(--yellow);
	/*flex: 1 1 auto;*/
	text-align: center;
	/*margin-left: 0;
	margin-top: 1rem;*/
	margin-left: 1rem;
	margin-top: 0rem;
	display: table;
}

.revealed .formArea .numberAndIcon ~ h4 {
	margin-left: 1rem;
	margin-top: 1.35rem;
}

.errors {margin: 1rem 0 0;}
.captcha {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
	margin-top: 0.5rem;
}

.leftLine, #successCriteria .halfBlock ol {
	padding-left: 1rem;
	border-left: 1px solid var(--blue);
	margin-left: 2rem;
	max-width: 75%;
	font-style: italic;
}

#successCriteria .halfBlock ol {
    border-left: 1px solid var(--white);
}

ul.leftLine, #successCriteria .halfBlock ol {
	padding-left: 0;
	margin-left: 3rem;
} ul.leftLine li, #successCriteria .halfBlock ol li {
	padding-left: 0.5rem;
	margin-bottom: 1.5em;
} ul.leftLine li:last-child, #successCriteria .halfBlock ol li:last-child {
	margin-bottom:0;
}

.largerText {
	font-size: 1.5em;
}

.phoneBox {
	padding: 0rem 2rem 0 0rem;
	display: flex;
	flex-flow: row-reverse nowrap;
	align-items: center;
	justify-content: space-between;
	flex: 0 1 auto;
	min-width: 250px;
	font-size: 1.5em;
	border-radius: 100px;
}
.phoneBox > p {
	flex: 1 1 auto;
	display: table;
    margin: 0.25em 0;
}

.phoneBox > img {
	flex: 0 1 20%;
	min-width: 100px;
    max-height: 5rem;
}

.breakOut > h3 {
	flex: 0 1 50%;
}

.breakOut > img, .breakOut  >  img + * {
	flex: 0 1 30%;
}

.breakOut .block:nth-child(3) {
	flex: 0 1 11rem;
	
}
.breakOut .block:nth-child(3) a, .breakOut .block:nth-child(3) p {color: var(--yellow);}
.breakOut .block:nth-child(3) a:hover, .breakOut .block:nth-child(3) p:hover {color: var(--white);}

section.causes {
	padding: 0;
	overflow-y: hidden;
	min-height: calc(100vh - 12rem);
}

aside.values {
	flex: 1 5 10%;
	min-width: 300px;
	display: flex;
	position: relative;
	flex-flow: column wrap;
	align-items: center;
	align-content: center;
	justify-content: flex-start;
	text-align: center;
	padding-right: 1rem;
	z-index: 7;
}

aside.values .block {
	padding: 4rem 6rem 0 2rem;
	text-align: left !important;
	max-width: 350px;
}

aside.values .block h2 {
	font-size: 4em;
	margin: 0 0 0.25em;
	line-height: 1;
}

aside.values + img {
	flex: 1 5 60%;
	z-index: 4;
	object-fit: cover;
	max-height: calc(100vh - 12rem);
}

aside.values > * { 
	position: relative; 
	z-index: 5; 
}
aside.values .controls {
	position: relative;
	right: unset; 
	bottom: unset; 
	justify-content: flex-end;
	margin-top: 3rem
}

aside.values .controls > *{
	background-color: var(--blue);
	color: var(--yellow);
}
 
#valuesSlider {
	position: absolute;
	margin-top: 2rem;
	bottom: 1rem;
	right: -23rem;
	
}
#valuesSlider::before {
	content: '';
	position: absolute;
	top: -5rem;
	left: 0;
	right: 0;
	width: 90%;
	padding-bottom: 90%;
	border-radius: 50%;
	z-index: 0;
	background-color: var(--transYellow);
	margin: auto;
}

.valuesGroup {
	display: flex;
	width: 30rem;
	flex-flow: row nowrap;
	align-self: center;
	justify-content: flex-start;
	align-items: center;
	overflow-x: hidden;
}

#valuesSlider .value { 
	position: relative;
	flex: 0 0 100%;
	margin-right: 2rem;
	transition: 0.25s ease-out;
	padding: 0 6rem;
	text-align: left;
	max-width: 28rem;
}

.value h4 {
	font-weight: bold;
	font-size: 3em;
	margin-bottom: 0;
	text-decoration: underline;
}


section.causes > div {
	flex: 1 1 70%;
	display: flex;
	flex-flow: row wrap;
	align-items: flex-end;
	justify-content: space-around;
	align-content: space-evenly;
	padding-left: 2rem;
}

.causes > div img {
	flex: 1 1 100%;
	object-fit: cover;
	height: 50%;
}

.causes > div .block, 
.causes #causesList {
	flex: 1 1 45%;
	padding-left: 2rem;
	position: relative;
	padding-top: 1rem;
	z-index: 1;
}

.causes > div .block::before, 
.causes #causesList::before {
	content: '';
	position: absolute;
	z-index: -1;
	height: 5rem;
	width: 5rem;
	border-radius: 50%;
	background-color: var(--yellow);
}
.causes > div .block::before {
	top: -1rem;
	left: 0;
}
.causes #causesList {
	display: table; 
	margin-left: 5rem; 
	margin-bottom: -1rem;
}
.causes #causesList::before {
	bottom: -2rem;
	right: 1rem;
}

#ourBenefits {
    border-left: 2.5em ridge rgba(222,221,28,1);
    text-align: center;
}
#ourBenefits .halfBlock {align-items: center; padding: 4rem;}
#ourBenefits h2 {font-size: 1.75em;}
#ourBenefits div > h2, #ourBenefits > div > p {
    max-width: 75%;
}
.icon-group {
    display: flex;
    flex-flow: row wrap;
}
.icon-group > * {
    flex: 1 1 27%;
    margin: 1rem 1%;
    text-align: center;
    padding: 0.5em 1rem 0.25em;
    border: 1px solid rgba(222,221,28,1);
}
.icon-group h4 {
    font-size: 1.5em;
    margin: 0.5em 0;
}
#ourBenefits .benefit-icon img {max-width: 8rem;}
.icon-group p {font-size: 0.8em;}

section#InjuryTypesArea {
	padding: 0 !important;
	min-height: 0 !important;
	font-size: 2em;
}

section#successCriteria, #ourBenefits {
    background-color: var(--blue);
    color: var(--white);
}
#ourBenefits ~ #successCriteria {background-color: rgb(30, 47, 56) !important;}

section#successCriteria .leftLine, section#ourBenefits .leftline {
    border-left: 1px solid var(--white);
}

#UKLocations {
    padding: 0;
    background-color: rgba(30,144,255,0.30);
    min-height: 0;
}
#UKLocText .halfBlockRow {
    padding: 2rem 5rem 3rem 4rem;
    border: 2px solid dodgerblue;
    margin: 4rem 2rem;
    background-color: white;
}
#UKMap .halfBlockRow {
    padding: 0;
    max-width: none;
    position: sticky;
    position: -webkit-sticky;
    top: 10.5rem;
}
#UKMap object {
    min-width: auto;
    min-height: 100%;
    height: calc(100vh - 14rem);
    width: auto;
    max-width: 100%;
    max-height: 100vh;
}

.IT-row {
	padding: 8rem 2rem 8rem;
	display: flex; 
	width: 100%;
	flex-flow: row wrap;
	align-items: flex-start;
	justify-content: flex-end;
	background-color: var(--white);
	
}.IT-row:nth-of-type(even) {background-color:white;}


.IT-row#topRow {
	justify-content: space-around;
	background-color:white !important;
	padding: 4rem 2rem;
}

.IT-row#topRow > * { flex: 0 1 40%;}

.IT-row h3 {
    margin: 0 0 0.5rem; 
    text-decoration: underline;
}

.IT-block {
	flex: 1 1 10%; 
	min-width: 200px; 
	/*position: sticky; 
	top: 16rem;*/
	margin-right: 0.5rem;
} .IT-block h3 {text-decoration: none;}

.IT-block a {
    text-decoration: underline;
    transition: 0.25s ease;
}.IT-block a:hover {color: rgb(222, 221, 28);}
.IT-block a[href$="#!"]:hover {color: inherit !important;}

#InjuryTypesArea .prompts {
	flex: 1 1 100%; 
	left: 0; 
	right: 0; 
	bottom: unset;
	font-size: 0.5em;
	position: relative;
	flex-flow: row wrap;
	justify-content: center;
	padding: 1rem 0 0.5rem;
	background-color: var(--transYellow);
}

#InjuryTypesArea .prompts * {font-style: normal; margin-bottom: 0.5rem; padding: 0.25rem 1rem}
#InjuryTypesArea .prompts *:hover {
	border: 2px solid var(--white);
    color: var(--white);
}

.ITG-G {
	flex: 1 1 70%;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: space-around;
	padding-top: 3rem;
}

.IT-row p {font-size: 0.5em;}

.InjruyTypeGroup {
	display: flex; 
	position: relative;
	padding: 2rem 0 0 5rem;
	flex-flow: column nowrap;
	z-index: 5;
	margin: 0;
	width: 20rem;
	height: 20rem;
	max-width: 100%;
	text-align: right;
	cursor: pointer;
	justify-content: flex-start;
	align-items: flex-start;
}

.InjruyTypeGroup:nth-of-type(odd) {/* padding: 5rem 6rem 0 0; EDITING 010420 */
	margin: 10% 0 0%;
	padding: 2rem 5rem 0 0;
    text-align: left;
	justify-content: flex-end;
	align-items: flex-end;
}

.InjruyTypeGroup:nth-of-type(5n) {
    margin: 7% 0 0;
}

.InjruyTypeGroup img {
	position: absolute; 
	top: 0;
	left: 0; 
	object-fit: cover; 
	width: 100%; 
	height: 100%; 
	z-index: 6; 
	object-position: right top;
	transition: 0.25s cubic-bezier(.86,0,.07,1);
	font-size: 12px;
	display: flex;
	flex-flow: row wrap;
	align-items: flex-end;
}

.InjruyTypeGroup .ITG-text, 
.InjruyTypeGroup .IT-cta {
	z-index: 7;
	position: relative;
}

.InjruyTypeGroup .IT-cta { /* margin: 1rem 0rem 0 -2rem; EDITING 010420 */
	margin: 1rem 0rem;
	border: 4px solid var(--blue);
	background-color: var(--white);
	display: table;
	padding: 0.25rem 0.5rem;
	transition: 0.25s ease-out;
	font-size: 0.6em;
    text-align: center;
}

.IT-row:nth-of-type(even) .IT-cta {background-color:white;}

.InjruyTypeGroup:nth-of-type(odd) .IT-cta {
	/*margin: 1rem 0rem 0 2rem; EDITING 010420 */
}

.InjruyTypeGroup .ITG-text {
	padding: 1rem;
	background-color: var(--transYellow);
	color: var(--blue);
	transition: 0.25s ease-out;
	font-size: 0.95em;
	overflow-x: clip;
}

.InjruyTypeGroup .ITG-text h4 {
	line-height: 1;
	margin-bottom: 0.5rem !important;
	font-size: 1.1em;
}

.InjruyTypeGroup:hover .ITG-text {
	background-color: rgba(46,69,82,0.75);
	color: var(--white);
}
.InjruyTypeGroup:hover .IT-cta {
	color: var(--yellow);
	border-color: var(--yellow);
	background-color: var(--blue);
}

@supports (clip-path: circle()) or (-webkit-clip-path:circle()) {
    .InjruyTypeGroup img {
        -webkit-clip-path: circle(45% at 45% 45%);
        clip-path: circle(45% at 45% 45%);
    }
    .InjruyTypeGroup:nth-of-type(odd) img {
        -webkit-clip-path: circle(45% at 54% 45%);
	    clip-path: circle(45% at 54% 45%);
	    object-position: left top;
    }
    .InjruyTypeGroup:hover img {
        -webkit-clip-path: circle(100% at 45% 45%);
	    clip-path: circle(100% at 45% 45%);
    }

}

.ITG-text > * {margin: 0 !important;}

section.related-posts {
    min-height: 0;
    background-color: rgb(28, 42, 50);
    justify-content: space-around;
    border-top: 1px solid rgba(46,69,82,1);
    border-bottom: 1px solid rgba(46,69,82,1);
    padding-bottom: 3rem;
    /*align-items: center;*/
}
section.related-posts h3 {
    flex: 1 1 100%;
    font-size: 1.75rem;
    align-self: center;
    text-align: center;
    margin: 1rem 1rem 3rem;
    color: rgba(222,221,28,0.85);
}
div.related-post {
    position: relative;
    background-color: var(--white);
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-start;
    flex: 1 1 30%;
    margin: 0 1rem 1rem;
    max-width: 40%;
    box-shadow: 0.25rem 0.5rem 1rem 0rem #1c1c1c;
    min-width: 300px;
} 
div.related-post img.wp-post-image {
    max-height: 15rem;
    object-fit: cover;
    flex: 0 1 15rem;
}
div.related-post img.DYNicon {
    position: absolute;
    top: -3rem;
    right: 1.5rem;
    height: 6rem;
    left: unset;
    width: 6rem;
    border-radius: 50%;
    border: 0.25em solid #F2F2F2;
}
div.related-post div {
    padding: 2rem;
    position: relative;
    flex: 1 1 auto;
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
}
div.related-post div h4 {
    font-size: 1.5em;
    margin: 0 6rem 0 0;
}
div.related-post div a, .all-articles-link a {
    font-size: 1.125em;
    border: 1px solid rgba(46,69,82,1);
    padding: 0.5em 1em;
    margin: 0;
    display: table;
    align-self: flex-end;
    transition: 0.25s ease;
} div.related-post div a:hover {background-color: rgba(222,221,28,0.85); }
.all-articles-link {
    flex: 1 1 100%;
    display: flex; 
    flex-flow: row nowrap;
    justify-content: center;
    margin-top: 2rem;
}
.all-articles-link a {
    color: rgba(222,221,28,1);
    border: 1px solid rgba(222,221,28,1);
} .all-articles-link a:hover {
    color: #F2F2F2;
    border: 1px solid #F2F2F2;
}

.wp-block-quote {
	border-left: 4px solid var(--blue);
	margin-left: 0;
	padding: 0.75rem 0 0.75rem 1.5rem;
	font-size: 1.125em;
}

.wp-block-quote p {margin: 0;}

/* Review area */

section#reviewsArea {
	min-height: auto;
	justify-content: center;
	background-color: white;
	padding: 4rem 1rem 2rem 1rem;
	z-index: 500;
}

#aggregateRatingArea {
	order: -1;
	display: flex;
	flex-flow: column;
	align-items: center;
}

#aggregateRating {text-align: center;}

#aggregateRatingArea img {
	width: 25rem;
	margin: 0 0 1rem 0;
}

#testimonials, #testiomialContainer {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#testiomialContainer {
	width: 100%;
	justify-content: center;
}

#testimonials {
	/*padding: 0 var(--main-padding) calc(var(--main-padding) / 2);
	flex: unset;*/
	flex-flow: row nowrap;
	overflow: hidden;
	align-items: center;
	flex: 0 1 40rem;
	padding: 0;
	/*max-width: 80%;*/
	margin-top: 0.5rem;
}

.testiomial {
	display: flex;
	flex-flow: column;
	justify-content: center;
	align-content: center;
	align-items: center;
	text-align: center;
	transition: 0.25s ease-out;
}

#testimonials .testiomial {flex: 0 0 100%; max-width: 100%;}

.testiomial p:empty {display: none;}

.review-rating h3 {
	font-size: 3em;
	margin: 0 0 0 0.2rem;
}


.review-body {
	flex: 0 1 auto;
	display: flex;
	flex-flow: column nowrap;
	/*max-width: 20rem;*/
}

.review-body * {margin: 0.25em 0;}

p.review-content {
	max-width: 38rem;
}

.review-body h4 {font-size: 1.5em;}

.reviewDate {font-size: 0.75em;}

#testiomialContainer .mover {
	font-size: 3em;
	background-color: transparent !important;
	cursor: pointer;
}
#testiomialContainer .mover:hover {
	color: rgba(222,221,28,1);
}

p.review-content span::before {
	content: '"';
	margin-right: -0.2em;
}

p.review-content span::after {
	content: '"';
	margin-left: -0.2em;
}
footer {
    align-items: stretch !important;
    padding: 0; 
    font-size: 0.85em; 
    min-height: 0;
}

footer#newFooter {
    padding: 2rem 0 1rem;
    flex-flow: column nowrap;
}

footer > * {
	flex: 1 1 20% !important;
	padding: 2rem 10% !important;
	border-right: 1px solid var(--blue);
	margin: 0 !important;
	display: flex;
	flex-flow: column nowrap;
	justify-content: space-around;
}

footer#newFooter .footerRow {
    flex-flow: column nowrap;
    border: none;
    margin: 2rem 0;
}

footer#newFooter .footerRow#footerAbout, .socialBlock {
    flex-flow: row wrap;
    display: flex;
}

.fb-wrapper {
	margin-top: 2rem;
	flex: 1 1 100%;
	max-width: calc(100% - 4rem);
	width: 100%;
	text-align: center;
	overflow: hidden;
}

footer#newFooter .footerRow > .footerArea {
    
    display: flex;
    flex-flow: column nowrap;
}

#footerAbout {
    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
}


footer#newFooter .footerRow#footerAbout > .footerArea {flex: 1 1 18%; margin: 1rem;}

footer#newFooter .footerRow#footerAbout > .footerArea:first-child {flex: 0 5 25%;}

footer#newFooter .footerRow#footerAbout > .footerArea > * {margin-top: 0;}

#footerAbout > .footerArea img ~ h4 {margin-top: 0.75em !important; font-size: 1.25em;}

footer #footerAbout .suasageLinks {border-left: 1px solid var(--blue);padding-left: 1.5rem;}

footer #footerAbout .suasageLinks li {padding: 0; line-height: 1; font-size: 1.3em; margin-bottom: 0.5em; flex: 0 1 100%;} 



#FLNetwork {align-items: center; margin-top: 2rem;background-color: #d8d8d8; padding: 2rem 10% 3rem !important;}

#FLNetwork > img {
    max-width: 40%;
    margin-top: 2rem;
}

#FLNetwork .suasageLinks {
    flex: 1 1 100%;
    margin: 2rem 10% 2rem;
    font-size: 1.25em;
    justify-content: center;
}

.socialBlock > * {flex: 1 1 auto; margin: 0;}

.socialBlock .socialLink img {width: 3rem; height: 3rem; margin: 0 0.5rem; transition: 0.25s ease-out;}

.socialLink img:hover {background-color: var(--yellow);}

#footerLegal {margin: 0 !important; align-items: stretch;}

#footerLegal #legalLinks {
    margin: 0.5em 0;
}
#footerLegal #legalLinks a {
    padding: 0 0.5em;
    border-left: 1px solid var(--blue);
  
}#footerLegal #legalLinks a:first-child {border: none; padding: 0 0.5em 0 0;}

#footerLegal #legalInfo, #footerLegal #legalCopy {
    font-size: 0.75em;
}

#footerLegal #legalInfo {
    border-bottom: 1px solid var(--blue);
    border-top: 1px solid var(--blue);
    padding: 0.5em 0;
    margin: 0.5em 0 !important;
}

footer .block  img {
	margin-top: 2rem;
	max-width: 350px;
}

footer > .block a {
	text-decoration: underline;
}
footer .suasageLinks { 
	align-items: flex-start;
	flex: none;
}
footer .suasageLinks li {
	padding: 0rem 1em 0rem 0;
	font-size: 1.1em;
    text-align: left;
}

footer article.formArea {
	/*font-size: 0.8em;*/
	border-radius: 0;
	background-color: transparent;
	border: none !important;
}

footer article.formArea input, 
footer article.formArea select {
    color: var(--blue);
    border: 2px solid var(--blue);

}

footer article.formArea *::placeholder {
    color: var(--blue);
    border: 2px solid var(--blue);

}

footer .formArea .numberAndIcon a, 
footer .formArea h4 {
    color: var(--blue);
}

footer > .block:first-child { 
	border-right: 1px solid var(--blue);
}

footer > .block:last-child { 
	background-color: #d8d8d8;
}

#breadcrumbs {
	margin: 0 !important;
	border: 1px solid rgba(46,69,82,1);
	padding: 1rem;
	font-size: 0.85em;
	font-style: italic;
	background-color: rgba(46,69,82,0.25);
    display: inline-block;
}

.newCorePageFormat #breadcrumbs {
    margin: 0 !important;
	border: none;
    border-bottom: 1px solid var(--blue);
	padding: 0;
	font-size: 0.85em;
	font-style: italic;
	background-color: transparent;
    display: inline-block;
} 

.newCorePageFormat #breadcrumbs a {text-decoration: none;}

main.newCorePageFormat div.halfBlock {padding-top: 0 !important; padding-bottom: 0 !important;}

main.newCorePageFormat div.halfBlock .halfBlockRow {padding-bottom: 0 !important;}

.groupedHeadnIcon {
    width: 100%;
    position: relative;
}
.groupedHeadnIcon h1 {
    border-bottom: 2px solid rgba(46,69,82,1);
    padding: 0 0 1rem;
    line-height: 1.05;
}

.page-template-corePage {}

.page-template-corePage section > div:not(.floatyCircle) {position: relative; z-index: 5;}

.page-template-corePage section h2 {font-size: 2.25em; line-height: 1.1;}
.page-template-corePage section h3 {font-size: 1.5em;line-height: 1.1;}
.page-template-corePage section h4 {font-size: 1.25em;line-height: 1.1;}

.page-template-corePage section p a {color: dodgerblue; text-decoration: underline; transition: 0.25s ease;}
.page-template-corePage section p a:hover {color: var(--yellow);}

#corePageTitleArea {
    position: relative;
	min-height: 50vh;
	max-height: 60vh;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-content: center;
	align-items: center;
    margin-top: 5rem;
}

#corePageTitleArea::after {
    content: '';
    z-index: 25;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: var(--blue);
    opacity: 0.75;
}

#corePageTitleArea h1 {
    position: relative;
    z-index: 250;
    font-size: 4em;
    margin: 0 15%;
    text-align: center;
    color: var(--white);
    line-height: 1.1;
}


/* from commonSubs / accident types area block */

section#accidentTypes {
    background-color: #d8d8d8;
}

section#accidentTypes .accidentTypesContainer, #accidentTypes .accidentHeader {
    margin: 2rem 10% 0rem; 
    flex: 1 1 100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

#accidentTypes .accidentHeader {
    justify-content: space-between;
    align-items: baseline;
}

#accidentTypes .accidentHeader img {
    flex: 0 1 15rem;
    position: sticky;
    top: 12rem;
}

#accidentTypes .accidentHeader div {flex: 1 1 50%; max-width: 60%; padding: 0 1rem;}

.accidentTypesContainer .newCard {
    flex: 1 1 25%;
    margin: 1rem;
    background-color: var(--white);
    padding: 0 2rem 1rem;
    text-align: center;
    box-shadow: 5px 5px 10px -5px var(--blue);
    transition: 0.25s ease-out;
    max-width: 30%;
    min-width: 200px;
}

.accidentTypesContainer .newCard img {
	margin: 0 -2rem 0 -2rem;
	width: calc(100% + 4rem);
	max-width: none;
    transition: 0.25s ease-out;
}

.newCard h3 {
    position: relative; 
    margin: 1.25rem auto -0.25em;
    display: table;
    z-index: 5;
}

.newCard h3::after {
    content: '';
    position: absolute;
    z-index: -1;
    width: 110%;
    height: 0%;
    bottom: 0.2em; left: -5%; right: -5%;
    background-color: var(--yellow);
    transition: 0.25s ease-out;
}

.newCard .button {
	display: table;
	margin: 1.5rem auto 0.5rem;
	border: 2px solid;
	padding: 0.25em 1em;
	font-size: 0.75em;
    transition: 0.25s ease-out;
}


.accidentTypesContainer .newCard:hover {
    box-shadow: 5px 5px 10px 0px var(--blue);
}

.newCard:hover h3::after {
    height: 35%;
   
}

.accidentTypesContainer .newCard:hover img {
	opacity: 0.75;
}

.newCard:hover .button {
    background-color: var(--yellow);
}


/* from fatal by accident block */

section#fatalities img {object-position: center !important;}

section#fatalities img, section#costToUk img, section#fatalIndustry img, #UKregions img {
    position: sticky;
    top: 7rem;
}

#fatalities .floatyCircle {
    left: calc(40% + 3rem);
    bottom: 4rem;
}

/* from at fatal by industry block */

section#fatalIndustry {
    background-color: #d8d8d8;
}

section#fatalIndustry > div:not(.floatyCircle) {
    margin: 3rem 0rem 5rem 2rem;
}
#fatalIndustry .floatyCircle {
    bottom: 10%;
    left: 8rem;
}


/* from at risk block */

#atRisk img {
    object-position: bottom;
}

#atRisk .floatyCircle {
    top: 40%;
    left: 5rem;
} 

#atRisk .columnBlock h2 {text-align: center;}

#atRisk .columnBlock > p {flex: 1 3 30%; margin: 0 0.5rem;}

/* from regions block */

#UKregions {
    background-color: var(--blue);
    min-height: auto;
    padding: 1rem 10%;
}

#UKregions #UKLocText .halfBlockRow {
	border: none;
	margin: 0;
    padding: 0rem 0rem 2rem;
    color: var(--white) !important;
    background-color: transparent;
}

#UKregions img {
	min-height: 100%;
    max-height: 100vh;
	object-fit: cover;
}

#UKregions .floatyCircle {
    right: 82.5%;
    bottom: 3rem;
}

/* from costs block */

section#costToUk, section#fatalIndustry, section#fatalities {
	min-height: auto;
	padding: 2rem 10%;
}

section#costToUk > *, section#fatalIndustry > *, section#fatalities > * {
    flex: 1 1 40%;
    
}

section#costToUk img, section#fatalIndustry img, section#fatalities img {
    object-fit: cover;
    object-position: right;
    margin: 3rem;
}

section#costToUk > div:not(.floatyCircle), section#fatalities > div:not(.floatyCircle) {
    margin: 3rem 2rem 5rem 0rem;
}

section#costToUk .floatyCircle {
	left: calc(40% + 3rem);
	top: 3rem;
}

/* from prevention block */


section#prevention {background-color: #d8d8d8;}

section#prevention, section#atRisk {
    min-height: auto;
    
}

#prevention img, section#atRisk img {
    max-height: 33vh;
    object-fit: cover;
    object-position: right;
}

#prevention img ~ .floatyCircle {
    top: 31%;
    right: 5rem;
}


#prevention .columnBlock, section#atRisk .columnBlock {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-content: center;
    margin: 2rem 10%;
}

#prevention .columnBlock h2, #atRisk .columnBlock h2 {flex: 1 1 100%;}
#prevention .columnBlock > p {flex: 1 3 30%; margin-right: 2rem;}
#prevention .columnBlock ul {margin: 0; flex: 3 1 60%;}

/* advantages area under successCriteria */

.page-template-corePage #successCriteria h2 {margin: 1rem 0 0;}

.page-template-corePage #successCriteria p {margin: 0 0 1rem 0; line-height: 1.2;}

/* from faq_pages block */

section#faqBlock {
    
    flex-flow: column nowrap;
    align-items: center;
    justify-content: center;
    min-height: auto;
    padding: 4rem;
}

#faqBlock h2 {
    padding: 0 1rem;
    position: relative;
    background-color: var(--white);
    z-index: 1;
}
        
#faqBlock h2::before, #faqBlock h2::after {
    content: '';
    position: absolute;
    top: 50%;
    left: -100%;
    right: 0;
    border: 2px solid var(--blue);
    width: 100%;
    z-index: 0;
    height: 3px;
    background-color: var(--blue);
}
#faqBlock h2::after {
    left: unset;
    right: -100%;
}


.faqsContainer {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-content: stretch;
    align-items: flex-start;
    margin: 2rem 10%;
}

.faqsContainer > .iniFaq {
    flex: 2 1 45%;
    border: 2px solid var(--blue);
    padding: 2rem;
    margin: 1rem;
    max-width: 40rem;
    position: relative;
} 

.faqsContainer img {
    flex: 1 10 30%;
    margin: 1rem;
    max-width: 40rem;
    max-height: 30rem;
    object-fit: cover;
    align-self: stretch;
}

.iniFaq h3 {
    margin-top: 0;
}

details {
    transition: 0.5s ease;
    position: relative;
    /* create read more button prompt that vanishes on open  */ 
}

summary {
	margin-bottom: -0.85rem;
	z-index: 5;
	position: relative;
	padding-bottom: 1.75rem;
    cursor: pointer;
    min-height: 10em;
}summary:focus {
    outline: none;
}

details[open] summary {cursor: auto; min-height: 0em;}


details summary ~ * {
    transition: 0.25s ease-out 0s, opacity 0.5s ease-out 0.25s, transform 0.25s ease-out 0.25s;
    
} details a, details p a {color: dodgerblue !important; transition: 0.25s ease;}

details a:hover, details p a:hover {color: var(--yellow) !important;}

details:not([open]) summary ~ * {
    transform: translateY(5rem);
    font-size: 0;
    margin: 0;
    opacity: 0;
    padding: 0;
}


details[open] summary ~ * {
    transform: translateY(0);
    opacity: 1;
}

.faqExtend {
	position: absolute;
	bottom: 1.25rem;
	right: 2rem;
	border: 2px solid var(--blue);
	background-color: var(--white);
	padding: 0.1rem 1rem;
	cursor: pointer;
	pointer-events: none;
	font-size: 0.9em;
    transition: 0.25s ease-out;
}

details:not([open]):hover ~ .faqExtend {background-color: var(--yellow);}

details[open] ~ .faqExtend {
    opacity: 0;
    transform: translateY(5rem);
}


section#faqBlock > div:nth-of-type(2) {
    right: -3.5rem;
    top: 5%;
}

section#faqBlock > div:nth-of-type(3) {
    left: -3.5rem;
    top: 50%;
}

section#faqBlock > div:nth-of-type(4) {
    right: -1.75rem;
    bottom: 2rem;
}


/* from helperpages block */

section#helperPages {
    background-color: var(--yellow);
    flex-flow: column nowrap;
    align-items: center;
    justify-content: center;
    min-height: auto;
    padding: 1.6rem 2rem 3rem;
}
section#helperPages::before {top: 3.2rem !important;}

section#helperPages h2 { 
    background-color: var(--yellow);
    padding: 0 2rem;
    margin-bottom: 1rem;
    z-index: 5;
    position: relative;
}

.articleBlock {
    display: flex;
    flex-flow: row wrap;
    margin-top: 1rem;
    justify-content: center;
    padding: 0 10%;
}

.articleBlock > * {
    margin: 1rem;
    flex: 1 1 18%;
    max-width: 20rem;
    text-align: center;
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
    align-items: center;
}

.articleBlock > * > * {margin: 0;}
.articleBlock > * > a {margin-top: 1rem;}

#helperPages .DYNicon {
    border:3px solid var(--blue);
    border-radius: 50%;
    max-width: 10rem;
    margin-bottom: 1rem;
}


/* from git block */
section#getInTouch {
    flex-flow: column nowrap;
    align-items: center;
    justify-content: center;
    min-height: auto;
    padding: 6rem 4rem 4rem;
}

section#getInTouch::before, section#helperPages::before {
    content: '';
    position: absolute;
    pointer-events: none;
    border: 2px solid var(--blue);
    left: 2rem; right: 2rem; top: 2rem; bottom: 2rem;
    z-index: 1;
}
section#getInTouch.blue::before {border: 2px solid var(--white);}

section#getInTouch > * {margin: 0 0 0.75rem 0;text-align: center;}
section#getInTouch h2 {font-size: 3em;}
section#getInTouch > p {max-width: 50%;}

#getInTouch + footer {
    border-top: 2rem solid var(--blue) !important;
}
#getInTouch + footer .block  {border: none !important;}

.floatyCircle {
    position: absolute;
    pointer-events: none;
    z-index: 0;
    border-radius: 50%;
    background-color: var(--yellow);
    width: 7.5rem;
    height: 7.5rem;
    transform: translate3d(0,0,0) !important;
    opacity: 1;
}
section#getInTouch .floatyCircle {
    right: 5%;
    top: 5%;
}

.boxContainer {
    display: flex;
    flex-flow: row nowrap;
}

.boxContainer a, .articleBlock a {
    position: relative;
    margin: 0.75rem;
    padding: 1rem 1.75rem;
    background-color: var(--yellow);
    transition: 0.25s ease;
    display: block;
    width: auto;
}
section.blue .boxContainer a {color:var(--blue);}

.boxContainer a::before, .articleBlock a::before {
    content: '';
    position: absolute;
    pointer-events: none;
    border: 2px solid var(--blue);
    left: 0.22rem; right: 0.22rem; top: 0.22rem; bottom: 0.22rem;
    z-index: 0;
}.boxContainer a:hover, .articleBlock a:hover {background-color: var(--white);}

/* new rules here */

@supports (position:sticky) or (position:-webkit-sticky){
    #navCloser {
        position: -webkit-sticky;
        position: sticky;
    }
    main#secondMain .halfBlock:first-of-type {
        order: 0;
        flex: 1 1 35%;
        position: -webkit-sticky;
        position: sticky;
        top: 11rem;
    }
    #sliderPayne {
        position: -webkit-sticky;
        position: sticky; 
        top: 12rem;
    }
    .halfImg {
        position: -webkit-sticky;
	    position: sticky;
	    top: 7rem;
    }
    main article.formArea {
        flex: 1 1 25%;
        position: -webkit-sticky;
	    position: sticky;
	    top: 7rem;
    }
    .IT-block {
        position: -webkit-sticky;
	    position: sticky; 
	    top: 13rem;
    }
    #InjuryTypesArea .prompts {
        position: -webkit-sticky;
	    position: sticky;
	    top: 7.5rem;
    }
}

@media screen and (min-width:1200px) {
    @supports (shape-outside: circle()) {
        .groupedHeadnIcon {
            margin-bottom: 3rem;
        }
        
        .groupedHeadnIcon img {
            shape-outside: circle();
            float: left;
            width: 16rem;
            height: 16rem;
            shape-margin: 0;
            margin-right: 4rem;
            margin-top: 1rem;
        }
        
        .groupedHeadnIcon h1 {
            padding: 1rem 0;
            border-top: 2px solid rgba(46,69,82,1);
            font-size: 2.5rem;
            
        }
    }
}
    
@media screen and (max-width: 1200px) {
	header #logo {flex: 1 3 20%;}
    header > div {flex: 3 1 40%;}
    
	header div div, .block .numberAndIcon, .block .messageAndIcon, .numberAndIcon, .messageAndIcon {flex: 0 1 10rem; font-size: 1em;justify-content: space-between;} /* flex: 0 1 10rem;  TESTING */
    
    header div div {flex: 0 1 11.5rem !important; max-height: 11.5rem !important;}
    /*header div div {flex: 0 0 3rem !important;}*/
    
	header .suasageLinks, header #goggle {display: none;}
	header {padding: 1.5rem 2rem;}
    
    header ~ img.attachment-post-thumbnail, 
    header ~ img.attachment-full.size-full.wp-post-image {height: 55vh; top: 2rem; }
    
    img.attachment-post-thumbnail ~ main div.halfBlock, 
    img.attachment-full.size-full.wp-post-image ~ main div.halfBlock {
    margin-top: calc(1 * (4rem + -20vh));
    margin-right: 0rem;
    border-radius: 0rem ;
    }
	
	#InjuryTypesArea .prompts, main article.formArea, main#secondMain .halfBlock:first-of-type {top: 5.75rem;}
    
    #sliderPayne .imgCaption {min-height: calc(100vh - 12rem);}
    
    img.attachment-post-thumbnail ~ main, img.attachment-full.size-full.wp-post-image ~ main {margin-top: 50vh !important;}
    
    /*div.circle {background-position: 30% 95%;background-size: 45%;}*/
    
    .groupedHeadnIcon {padding-top: 2rem;}
    .groupedHeadnIcon img {
        position: absolute;
        top: -11rem;
        left: 0;
        width: 12rem;
    }
    .groupedHeadnIcon h1 { font-size: 2.5rem }
    .circle {background-image: none !important;}
	
	#messageBox {
		height: calc(100vh - 5.75rem);
		top: 5.75rem;
	}
	
}


@media screen and (max-width: 850px) {
	
	nav {transform: translateX(-150%); overflow-y: scroll;}
    #loader, nav, header {max-width: 100%;}
	nav.opened {transform: translateX(0vw);}
    
    main.mainForPost {padding: 4rem 2rem 2rem 2rem !important;}
	
	#linksArea {justify-content: center; padding: 0 0 2rem !important;}
	#linksArea .verticleLine {display: none;}
	#linksArea > * {flex: 1 1 45%; min-width: 200px; position: relative !important;}
	#brandArea {padding: 0; margin-top: 1rem;}
	/*#brandArea > div {flex: 0 1 45%;}*/
	#navCloser {order: -1; margin: 0 !important;}
	
	header div div, header .numberAndIcon, header .messageAndIcon {flex: 0 1 9.5rem !important;font-size: 0.8em;}
	/*article.formArea  .numberAndIcon {flex: 0 1 9rem !important;}*/
    main article.formArea {border-radius: 50px;}
    article.formArea .numberAndIcon {flex: 0 1 12rem !important;}
    article.formArea .numberAndIcon a {flex: 1 1 7rem;}
	
	header {padding: 0.75rem 1rem;}
	header #logo {margin-right: 1rem;}
	header div div, header div img {
		flex-grow: 1;
	}
	
	header .numberAndIcon a, header .messageAndIcon p, header .messageAndIcon a {flex: 1 1 auto;}
	
	header > h2, header > h4 {margin-top: 0.5rem;margin-left: -1rem; margin-right: -1rem;}
	
	header div img {margin-right: 0.5rem !important; flex: 1 1 100px;}
	
	header > h2::before, header > h2::after, header > h4::before, header > h4::after {content: none;}
	
	section#slider {padding-top: 4rem;}
	/*section#slider {padding-top: 6rem;}*/
	
	
	div.circle {
		background-image: linear-gradient(35deg, var(--yellow) 60%, rgba(222,221,28,0.00));
		bottom: -15vh !important;
		left: -15vw;
	}
	main div.circle {
		bottom:  unset !important;
	}
    main.mainForPost > div.circle { /* TESTING */
        right: -85% !important;
        top: -60vh;
        width: calc((300px / 0.8) + 5vw);
        padding-bottom: calc((300px / 0.8) + 5vw);
        background-color: rgba(222,221,28,1);
        /*background-position: 25% 85%;
        background-size: 60%;*/
    }
	.slide {min-height: calc(100vh - 4rem); padding: 2.5rem 3rem 6rem; /* late-COVID padding: 2.5rem 3rem 9rem*/;}
	
	.slide h2 {font-size: 2em;}
	.slide p {font-size: 1em;}
    .slide > a {align-self: flex-start; margin: 0 !important;}
	
	.prompts div:last-child {display: none;}
	
	
    /*  .controls .prompts {bottom: 1.9rem;} 
    late-COVID.controls, .prompts {bottom: 5rem;} */ 
	
	main, footer, section.hashalfImg {padding: 2rem;}
	main {margin-top: 4.5rem;}
	
	div.halfBlock, .hashalfImg .halfBlock {padding: 0; flex: 1 1 100%;margin-bottom: 2rem;}
	
	.formArea h2 {font-size: 2em;}
	
	.formArea h4 {
		flex: 1 1 100%;
		text-align: center;
		margin-left: 0;
		display: block;
	}
	
	.phoneBox {font-size: 0.95em;}
	
	aside.values {flex-flow: row nowrap;flex: 1 1 100%;height: auto;overflow: hidden; border: none; padding: 0;justify-content: space-around;}
	aside.values .block {padding: 2rem;}
	#valuesSlider {position: relative; margin-top: 0; bottom: unset; right: unset;}
	#valuesSlider::before {top: 0;}
	.valuesGroup {width: 25rem;}
	#valuesSlider .value {padding: 0px 3rem;max-width: 23rem;font-size: 0.75em;}
	aside.values .controls {margin-top: 0;}
	aside.values .block h2 {font-size: 2em;}
	
	section.causes > div {padding-left: 0; justify-content: flex-end;}
	
	.causes #causesList {margin-bottom: 5rem;}
	
	section#InjuryTypesArea, .IT-row p, .InjruyTypeGroup .IT-cta {font-size: 1.05rem; line-height: 1.2 !important;}
    .InjruyTypeGroup .ITG-text h4, .IT-row h3 {font-size: 1.75em;}
	.IT-row:first-of-type > *, .IT-row#topRow > * {flex: 1 1 100%;}
	.IT-row {padding: 2rem; flex: 1 1 100%;}
	#InjuryTypesArea .prompts {font-size: 0.75em;}
	#InjuryTypesArea .prompts > * {margin: 0.5rem;}
	#InjuryTypesArea .prompts, .IT-block, .halfImg {position: relative; top: unset;flex: 1 1 100%;}
	aside.values .controls {justify-content: center;}
	
	.InjruyTypeGroup {
		width: 17rem;
		height: 17rem;
		padding-top: 1rem !important;
	}
	
	footer {padding: 1rem 1rem 3rem;align-items: flex-start !important;}
	
	footer > * {
    	flex: 1 1 100% !important;
    	align-items: center;
    	text-align: center;
    	justify-content: center;
    	align-content: center;
		margin-bottom: 2rem;
		padding-right: 0;
		word-break: break-word;
		border: none !important;
	}
    footer#newFooter > * {text-align: left;}
    footer#newFooter .footerRow#footerAbout > .footerArea {flex-grow: 1;}
    footer#newFooter .footerRow#footerAbout > .footerArea:first-child {flex: 1 1 100% !important;}
    footer .formArea {order: -1;} 
    footer > .block:first-child {order: -2;}
    #FLNetwork {padding: 2rem 2rem 3rem !important;}
    #Gmap {flex: 1 1 100% !important; margin-bottom: 2rem;} 
	
	#messageBox {
		z-index: 999; 
		top: 0;
		padding: 0; 
		height: 100vh; 
		width: calc(100% + 26px);
		margin-right: -26px;
		overflow-y: scroll;
	}
	
	#messageBox > img {display: none;}
	
	#messageBox .formArea {
		border: none;
		position: relative;
		top: 0 !important; 	
		text-align: center; 
	}
	
	#close {top: 0; right: 2rem;}
    
  
    main#secondMain .halfBlock:first-of-type{
        position: relative;
        top: 0;
    }
    .tce-logo {margin: 1rem 0 0 0 !important; }
    
    section#accidentTypes .accidentTypesContainer, #accidentTypes .accidentHeader, .faqsContainer {margin: 2rem 0;} 
    section#costToUk, section#fatalIndustry, section#fatalities {padding: 2rem;}
    #corePageTitleArea h1 {font-size: 3em;}
    #corePageTitleArea {min-height: 40vh; margin-top: 4rem;}
    header ~ #corePageTitleArea img.attachment-full.size-full.wp-post-image {height: 50vh; top: 4rem;}
    section#fatalities img, section#costToUk img, section#fatalIndustry img, #UKregions img {position: relative; top: unset;}
    section#costToUk > *, section#fatalIndustry > *, section#fatalities > * {flex: 1 1 100%; }
    section#costToUk > div:not(.floatyCircle), section#fatalities > div:not(.floatyCircle) {margin: 0 2rem;}
    ul.leftLine, #successCriteria .halfBlock ol {margin-left: 0.75rem; max-width: 100%;}
    section#costToUk img, section#fatalIndustry img, section#fatalities img {margin: 1rem 2rem;}
    section#fatalIndustry > div:not(.floatyCircle) {margin: 2rem 0 2rem;}
    #atRisk .columnBlock > p, #prevention .columnBlock > p {flex: 1 1 100%; margin: 1em 0;}
}

@media screen and (max-width: 600px) {
    body {padding-top: 0;max-width: 100vw;}
    /*body {padding-top: 8vw;max-width: 100vw;}*/
    
    #moreInfo {overflow-x: hidden;}
    section:not(#slider) > *, 
    footer > *, 
    .breakOut > *,
    a.InjruyTypeGroup {
    	transform: translate3d(0, 10vh, 0); 
    }
    
    section:not(#slider) > *:nth-child(2n), 
    footer > *:nth-child(2n), 
    .breakOut > *:nth-child(2n), 
    .breakOut > *:nth-child(3n),
    a.InjruyTypeGroup:nth-child(2n) {
    	transform: translate3d(0, 10vh, 0); 
    	
    }
    
	header {justify-content: center; position: relative; padding: 0rem 1rem ; max-width: 100%;}
	
    header #logo { /* padding-right: 0.5rem; EDITING 310320 */
        position: fixed; top: 0; left: 0; padding: 1rem 2rem; background-color: var(--white);z-index: -1; max-width: 100vw;}
	
	header div p, .block .numberAndIcon a, .block .messageAndIcon p, .block .messageAndIcon a, .numberAndIcon a, .messageAndIcon p, .messageAndIcon a {flex: 1 1 auto; font-size: 1em;}
	
	/*.burger {
		position: fixed;
		width: auto !important;
		height: calc(1vw * 9.686) !important;
		right: 0.5rem;
		top: calc(0.25vw * 9.686);
		margin: 0 !important;
	} EDITING 30/03/20 */
    
    /* .burger {
		position: fixed;
		width: auto !important;
		height: 2rem;
		right: 1rem;
        left: unset;
		top: unset;
		margin: 0 !important;
        bottom: 1rem;
        overflow: hidden;
	}  Edits SEPT 17 21 */
	.burger {
		position: fixed;
		width: calc(3rem + 12px);
		height: calc(3rem + 12px);
		right: 1rem;
        left: unset;
		top: unset;
		margin: 0 !important;
        bottom: 1rem;
        overflow: visible;
		display: flex;
		flex-flow: row nowrap;
		justify-content: center;
		align-items: center;
	}
    /* .burger > img {margin: 0 !important;width: 2rem !important; height: 2rem !important;} Edits SEPT 17 21 */
	
	.burger > img {
		margin: 0 !important;
		width: 3rem !important;
		height: 3rem !important;
		box-shadow: 1px 1px 5px 0px rgb(46, 69, 82);
		border-radius: 50% 50%;
		flex: 0 1 3rem;
	}
	
	 
	
	header > #logo.boxy {box-shadow: 0px 0px 20px gray;}
	
	header div img, .phoneBox > img {flex: 0 1 40px; min-width: 40px;}
	
    header > div { /* justify-content: center; EDITING 310320 */
        justify-content: flex-start;
        flex-flow: column nowrap;
        align-items: flex-start;
        position: fixed;
        bottom: 6rem;
        right: -100%; /* transition here after scroll */
        padding: 0.5rem 0.5rem 0.75rem 0.5rem;
        background-color: var(--white);
        border: 2px solid var(--blue);
        border-right: none;
        width: auto;
        border-radius: 1em 0 0% 1em;
        transition: 0.5s ease-out;
    }
    
    #goggle {
        flex: 0 1 auto !important;
        display: block !important;
        margin: 0.25rem 1rem 1rem 0.5rem !important;
    }
    
    #logo.boxy ~ div {
        right: 0; 
    }
    
    header > h2, header > h4 {

        margin-top: 0 !important;
    }
    
    header > div > .numberAndIcon {
        margin-right: 0rem;
        margin-bottom: 1rem;
    }
    header .numberAndIcon, header .messageAndIcon {flex: 0 0 100% !important;}
    
    header .numberAndIcon img,  header .messageAndIcon img {
        margin-right: 1rem;
        flex: 0 0 auto;
        width: 30px !important;
        height: 30px !important;
    }
    
    header .numberAndIcon a, header .messageAndIcon p, header .messageAndIcon a {flex: 1 1 auto !important;}
    
	header div div {flex-grow: 1;}
    
    main.mainForPost > div.circle {
        right: 2rem !important;
        top: -4rem;
        left: unset !important;
        z-index: 500;
        width: 8rem;
        height: 8rem;
        padding: 0 !important;
        opacity: 1 !important;
        background-color: rgba(222,221,28,1);
        /*background-size: cover;*/
		display: none;
    }
    
    .groupedHeadnIcon {padding-top: 0;}
    .groupedHeadnIcon img {
        top: -10rem;
        left: unset;
        right: -1rem;
        width: 10rem;
        border: 0.5em solid #F2F2F2;
        border-radius: 50%;
    }
    
    main.mainForPost > div.circle {
        right: unset !important;
        top: -17rem;
        left: 2rem !important;
        width: 6rem;
        height: 6rem;
    }
	
	ul.leftLine {
   		padding-left: 0rem;
    	margin-left: 1rem;
		max-width: 100%;
	}
	
	div.circle, .circle.spin {transform: none !important;opacity: 0.85;}
	section#slider {padding-top: 0; min-height: 100vh;  /* late-COVID min-height: calc(100vh - 12rem);*/}
	/* section#slider {padding-top: 0; min-height: calc(100vh - 10rem); }*/
    
    .slide {min-height: auto; padding: 0rem 1rem 6rem !important; justify-content: flex-end;}
    /*.slide {min-height: auto; padding: 5rem 1rem 5rem !important; justify-content: center;}*/
    
	main {margin-top:5rem; overflow: hidden;}
    main.mainForPost {padding: 3rem 1.5rem !important; overflow: visible;}
    
	.prompts {left: 1rem; bottom: 2rem;}
	
    .controls {right: 1rem; top:6.5rem; bottom: unset; margin-bottom: 2rem;}
    /*.controls {right: 1rem; top:0.5rem; bottom: unset; margin-bottom: 2rem;}*/
    
    section#slider.smallSlider .slide {
        text-align: left;
    }
    
    section#slider.smallSlider .slide > a {
        align-self: flex-start
    }
    
    section#slider.smallSlider .prompts {
        left: 3rem;
        align-items: center;
        justify-content: flex-start;
    }
    
    section#slider.smallSlider div.circle {
        bottom: -25% !important;
        left: -75% !important;
    }
    
    #ourBenefits .halfBlock {padding: 1rem 0;}
    .icon-group p {font-size: 1em;}
	
	article.formArea, main {padding: 1rem;}
	
	.breakOut {text-align: center;}
	
	.breakOut h3 {flex-grow: 1;}
	
	.breakOut > img, .breakOut > img + * {flex: 1 1 100%;}
	
	section.causes > div {margin-top: 4rem;}
	
	.halfBlockRow {padding: 2rem;}
	
	.halfBlockRow h1 {font-size: 2.5em;}
    .halfBlockRow h2 {font-size: 1.75em;}
    .halfBlockRow h3 {font-size: 1.15em;}
	
     #InjuryTypesArea .prompts{
        max-width: calc(100% - 2rem);
        margin: 0 auto;
    }
    
    .IT-block h3 {font-size: 2em;}
    
    .ITG-G {padding-top: 1rem;}
    
	.InjruyTypeGroup {margin: 3rem 0% 0 10%; width: auto; height: auto; max-width: 80vw; padding: 0 1rem !important; }
    
	.InjruyTypeGroup:nth-of-type(2n+1) {margin: 3rem 10% 0 0;}
    
    
    .InjruyTypeGroup img {
        position: relative;
        /*-webkit-clip-path: circle(50% at 50% 50%) !important;
        clip-path: circle(50% at 50% 50%) !important;*/
        -webkit-clip-path: none !important;
        clip-path: none !important;
    }
    
    .InjruyTypeGroup .ITG-text {
        /*margin-top: -3rem;*/
        padding: 1rem 1rem 2rem;
        font-size: 1em;
    }
    
    .InjruyTypeGroup .ITG-text h4 {
        line-height: 1.2;
        font-size: 1.5em;
        text-decoration: underline;
    }
    
    .InjruyTypeGroup:hover .ITG-text {background-color: rgb(46, 69, 82);}
    
    .InjruyTypeGroup .IT-cta {
        max-width: 150px;
        margin: -1rem 0rem 0rem 1rem;
        align-self: flex-start;
    }
    
    .InjruyTypeGroup:nth-of-type(2n+1) .IT-cta {
        margin: -1rem 1rem 0rem 0rem;
        align-self: flex-end;
    }
	
	aside.values {flex-flow: row wrap;}
    
    footer {padding: 1rem 1rem 16rem;}
    
    footer#newFooter {padding: 1rem 0rem 14rem !important;}
    
    #FLNetwork > img {max-width: 100%;}
    
    #FLNetwork .suasageLinks {margin: 2rem 0; padding: 0;}
	
	footer > * {
		flex: 1 1 100% !important; 
	}
    
    img.attachment-post-thumbnail ~ main div.halfBlock, 
    img.attachment-full.size-full.wp-post-image ~ main div.halfBlock {margin-top: 0 !important;}
    
    header ~ img.attachment-post-thumbnail, header ~ img.attachment-full.size-full.wp-post-image {height: auto !important; min-height: 50vh; top: 2rem;}
    
    /*img.attachment-post-thumbnail ~ main, img.attachment-full.size-full.wp-post-image ~ main {margin-top: 20rem !important;}*/
    
    #messageBox {max-width: 100% !important;width: 100% !important;}
    #messageBox .formArea {padding: 3rem 2rem !important;}
    
    .icon-group > *{flex: 1 1 100%;}
    
    #UKLocText .halfBlockRow {padding: 2rem;}
    
    .groupedHeadnIcon {padding-top: 0;}
    .groupedHeadnIcon img {
        top: -10rem;
        left: unset;
        right: -1rem;
        width: 10rem;
        border: 0.5em solid #F2F2F2;
        border-radius: 50%;
		background-color: #f2f2f2;
    }
          
    main.mainForPost > div.circle {
        right: unset !important;
        top: -17rem;
        left: 2rem !important;
        width: 6rem;
        height: 6rem;
    }
    
    #corePageTitleArea {margin-top: 0;}
    #corePageTitleArea h1 {font-size: 2.5em;}
    #accidentTypes .accidentHeader div {flex: 1 1 100%; max-width: 100%; order: 5;}
    #accidentTypes .accidentHeader img {position: relative; top: unset;}
    .accidentTypesContainer .newCard {max-width: 100%;}
    .faqsContainer > .iniFaq {flex: 1 1 100%; margin: 1em 0;}
    .floatyCircle {left: -4.5rem !important; top: 50% !important;}
    section:nth-of-type(odd) .floatyCircle:first-of-type {right: -4.5rem !important; left: unset !important; top: 50% !important;}
    .floatyCircle + .floatyCircle, section:nth-of-type(odd) .floatyCircle {top: 75% !important; right: -4.5rem !important; left: unset !important;}
    .floatyCircle + .floatyCircle + .floatyCircle {top: 25% !important; left: -4.5rem !important; }
    section#getInTouch > p {max-width: 100%;}
}

@media screen and (max-width: 450px) {
    /*main div.circle {max-width: 100vw !important;}*/
	header {/*padding: 3.5rem 0 0 ;*/ padding: 0; max-width: 100%;}
    header h4, header h2 {margin: 3rem 0 0 !important;font-size: 0.85rem; }
    /*header img {margin-top: calc(0.5rem - 0.5vw); margin-left: 1.5vw;}*/
    /*header #logo {padding: 0 !important;right:0;}
    header #logo img {padding: 0.25rem 0.5rem;}*/
	/*header div > .messageAndIcon {display: none;}*/
	header div > a {/* .numberAndIcon flex: 1 1 10rem;*/font-size: 1.25em !important;} 
	/*header div > .numberAndIcon.potentialfix {
		position: fixed;
		bottom: 0;
		background-color: var(--white);
		left: 0;
		right: 0;
		margin: 0;
		/*padding: 0.5rem 15%; * /
        padding: 0.5rem 20% 0.5rem 0.25rem;
		max-height: 3rem;
		box-shadow: -5px 1px 15px -5px gray;
        max-width: 100%;
	}header div > .numberAndIcon.potentialfix img {height: 2rem !important;}*/
    .halfBlockRow h2, body.home .halfBlockRow h1 {font-size: 1.75em !important;}
    
    /*.burger {bottom: 1.5rem;}Edits SEPT 17 21 */
    .burger {bottom: 1rem;}
	
	.slide {padding: 0rem 1rem 5rem !important; min-height: 0 !important;justify-content: flex-end;}
	/*.slide {padding: 4rem 1rem 4rem !important; min-height: 0 !important;justify-content: center;}*/
    .slide h2 {font-size: 1.75em;}
    .slide h3 {text-align: left; padding: 0; width: 100%;font-size: 1.25em;}
    .slide h3::before {content: none;}
    .slide p, .slide a {font-size: 0.75em;}
	.prompts {
        left: 1rem !important;
        right: 0.5rem !important;
        margin: 0 !important;
        bottom: 1rem !important;
        text-align: center;
        z-index: 500;
        font-size: 0.75em;
    }
    .prompts a {margin: 0rem 2.5% 0 0rem;padding: 0.5rem 1rem;}
	.controls {/*left: 1rem;right: 1rem;top: 1rem;*/top: 25vw;/*justify-content: flex-start;bottom: unset;*/}
    .controls > * {width: 2.5rem; height: 2.5rem;padding: 0.05rem 0.55rem !important;}
	div.circle {bottom: -10vh !important; left: -75vw;top: -5vh;}
	/*.IT-row {padding: 1rem 0.5rem;}*/
	.halfBlockRow {padding: 1rem;} 
    main article.formArea {padding: 2rem; border-radius: 0px; max-width: 100%;}
    
    body.home main article.formArea {margin:0 -1rem !important;  max-width: calc(100% + 2rem);}
    
    main.mainForPost {padding: 3rem 0rem !important;}
    /*.InjruyTypeGroup {margin: 0 0 1rem !important;}*/
	#valuesSlider .value {padding: 0 4rem;}
	section.causes {overflow: visible;}
	footer > * {padding: 0 !important;}
    div.breakOut.column > p {font-size: 1.1em;}
    .captcha {max-width: 250px; margin: 0 auto;}
    
    .phoneBox {padding: 0.125rem 0.75rem; flex: 0 1 250px;}
    
    #sliderPayne, #sliderPayne .imgCaption {min-height: 50vh;}
    
    aside.values .controls {margin-bottom: 2rem; margin-top: 0rem; max-width: 85vw;justify-content: flex-end;}
    
    footer > .block:last-child {padding: 1rem !important;}
    
    #ourBenefits {padding: 1rem !important;}
    
    article.formArea .numberAndIcon {
        flex-flow: column-reverse wrap;
        flex: 1 1 auto !important;
        margin-top: 1rem;
    }
    
    article.formArea .numberAndIcon a {flex: 1 1 auto; margin-top: 1rem;}
    
    #corePageTitleArea h1 {font-size: 2em;}
    #corePageTitleArea {min-height: 35vh;}
    .page-template-corePage main.mainForPost {padding: 1rem 0rem !important;}
    .page-template-corePage section {overflow-x: hidden;}
    .page-template-corePage section h2 {font-size: 2em;}
    .page-template-corePage section h3 {font-size: 1.25em;}
    .page-template-corePage section h4 {font-size: 1em;}
    section#costToUk > div:not(.floatyCircle), section#fatalities > div:not(.floatyCircle), #prevention .columnBlock, section#atRisk .columnBlock {margin: 0 !important;}
    section#faqBlock {padding: 2rem;}
    section#costToUk img, section#fatalIndustry img, section#fatalities img {margin: 1rem 0;}
    
    footer#newFooter .footerRow#footerAbout > .footerArea {flex: 1 1 100%;}
}

@media screen and (min-width:1200px) {
    .groupedHeadnIcon img {
        margin-bottom: 1rem;
        width:12rem;
        height:12rem;
    }
    @supports (shape-outside: circle()) {
        .groupedHeadnIcon {margin-bottom: 3rem;}
        .groupedHeadnIcon img {
            shape-outside: circle();
            float: left;
            width: 16rem;
            height: 16rem;
            shape-margin: 0;
            margin-right: 4rem;
            margin-top: 1rem;
            margin-bottom: 0 !important;
        }
        .groupedHeadnIcon h1 {
            padding: 1rem 0;
            border-top: 2px solid rgba(46,69,82,1);
            font-size: 2.5rem;
        }
    }
}

@media screen and (min-width: 1250px) { header .suasageLinks {font-size: 1.25em;}}
@media screen and (min-width: 1700px) {
	body{ font-size: 1.1em;}
	/*#InjuryTypesArea .prompts {top: 10rem;}*/
    .slide > a {margin-left: 390px;}
    .slide h2, .slide h3, .slide dd, .slide > p {max-width: 650px;}
    .controls > * {padding: 0.15rem 0.75rem;}
}

@media screen and (max-height: 600px) {img {max-height: 200vh;}}

@media screen and (max-height: 700px) and (min-width:850px) {
	main article.formArea {top: -3rem !important;}
	input, select {padding:6px 1rem !important;}
	.slide {padding: 8rem 3rem 7rem;}
	.slide h2 {font-size: 2em;}
	.slide h3 {font-size: 1.25em;}
	.controls, .prompts {bottom: 3rem;}
}