/*
Theme Name: LWCode 
Theme URI: https://triggersolutions.co.uk/
Author: Trigger Solutions
Author URI: http://triggersolutions.co.uk
Description: Custom theme for LWCode
Version: 1.0


 

/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */


html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
button {
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    zoom: 1;
    font-size: 100%;
    font-family: 'Montserrat', sans-serif;
}
font {font-family: inherit;}

body {
    line-height: 1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
    font-weight: normal;
    font-weight: 300;
    font-family: 'Montserrat', serif;text-wrap: balance
}

ol,
ul {
    list-style: none;
}

blockquote {
    quotes: none;
}

blockquote:before,
blockquote:after {
    content: '';
    content: none;
}

del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

a img {
    border: none;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
pre,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td,
label {

    font-family: 'Montserrat', sans-serif;

    line-height: 1.4;
    font-weight: 300;
}

img {
    height: auto
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}



fieldset,
img {
    border: 0;
}

address,
caption,
cite,
code,
dfn,
th,
var {
    font-style: normal;
    font-weight: normal;
}



a,
span {
    font-family: inherit;
}

ol,
ul {
    list-style: none;
}

caption,
th {
    text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: normal;
    font-family: 'Montserrat', serif;
}

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


.darkest-bluebg {background:#041d2b }

.dark-bluebg {background:#0c5076}
.lightbluebg {background:#dcecf0}
.orangebg {background:#f1985b}
.lightorangebg {background:#fcece0

}
.greybg {background:#f2f2f2}
.whitebg {background:#fff}
.yellowbg {background:#d09c00

}
.primary {background:#ee7e32}
.secondary {background:#ee7e32}

.orange-outline.button {border:1px solid #ee7e32; position:absolute; top:20px; right:60px; color:#ee7e32; line-height
:20px}

.orange-outline.button img {
    float: left;
    margin-right: 10px; height:20px; width:auto
}
.orange-outline.button:hover {color:#fff; background:#0c5076; border-color:#0c5076}

.orange-fill.button {
    border: 1px solid #ee7e32;
    position: absolute;
    top: 20px;
    right: 220px;
    color: #fff;
    background: #ee7e32;
    line-height: 20px;
}
.orange-fill.button:hover {color:#ee7e32; background:white}
.orange-fill.button img {
    float: left;
    margin-right: 10px; height:20px; width:auto
}

.question {cursor:pointer;font-size:18px; border:none; cursor:pointer;border-radius:15px;
 padding:10px 20px; color:#000; transition:all ease-in-out 0.5s; font-weight:700; margin-bottom:20px}
.question p {font-weight:700}
.question:after {content:''; float:right; width:25px; height:25px; background-size:contain; background-image:url(/wp-content/themes/LWCode/img/orange%20arrow.svg); background-repeat:no-repeat;    margin-top: -25px;}
.question.active:after {transform:rotate(90deg)}
.answer p, .answer li {font-size:16px; margin-bottom:30px}
.answer p:last-child {margin-bottom:30px}
.accordions h2 {margin-top:50px}


.answer {display:none}
.button,.wpcf7-submit {font-size:16px; border:none; cursor:pointer;border-radius:30px;
 padding:10px 30px; color:#fff; transition:all ease-in-out 0.5s; font-weight:700}
.button.whitebg {}
.button.whitebg:hover,.wpcf7-submit:hover {background:black; color:white}
.button.yellowbg {color:white}
.button.yellowbg:hover {background:black; color:white}
.button.greybg:hover {background:black; color:white}
.button.dark-bluebg {color:white}
.button.dark-bluebg:hover {background:black; color:white}
.button.lightbluebg {color:white}
.button.lightbluebg:hover {background:black; color:white}

header .inner{padding-top:30px; padding-bottom:30px; max-width:1320px}
footer .inner{padding-top:30px; padding-bottom:30px; max-width:1320px}

#mainnav {
        width: auto;
    float: right;
    margin-top: 36px;
    clear: both;
}
#mainnav ul {display:block}
#mainnav ul li {display:inline-block; padding:10px 15px; margin:0}

#mainnav ul li a {color:#0c5076; font-size:18px; font-weight:700}
#mainnav ul li a:hover {color:#d9a441}
#mainnav ul li.whitebg a {color:black; }


footer {padding-top:0px; padding-bottom:30px; background:black; margin-top:50px}
footer h5 {color:white}
footer p {color:white; font-size:16px}
footer a {color:#d9a441}
footer .column {padding-top:50px}
footer .column:nth-child(1) p {font-size:12px}
footer .column:last-child {text-align:right; }
.socials a {background:white; border-radius:50%; padding:10px; display:inline-block; margin-right:5px}
.socials a img {width:25px; height:25px;    display: block;}
.wpcf7 input[type="url"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"] {
  padding:10px; margin-bottom:10px
}

p {margin-bottom:25px; color:#000; font-size:16px}
p strong {font-weight:700}
p:last-child {margin-bottom:0}
section li  {    margin-bottom: 10px;
    color: #000;
    font-size: 16px;
    list-style: disc; margin-left:25px}
section li ul {margin-top:20px;}
section  ul { margin-bottom:20px}
h1 {font-size:36px; font-family:Montserrat, sans-serif; color:#0c5076; margin-bottom:20px; font-weight:700}
h2 {font-size:28px; font-family:Montserrat, sans-serif; color:#0c5076; margin-bottom:20px; font-weight:700}
h3 {font-size:22px; font-family:Montserrat, sans-serif; color:#0c5076; margin-bottom:20px; font-weight:700; }
h4 {font-size:21px; font-family:Montserrat, sans-serif; color:#0c5076; margin-bottom:20px; font-weight:700}
h5 {font-size:19px; font-family:Montserrat, sans-serif; color:#0c5076; margin-bottom:20px; font-weight:700}
h6 {font-size:18px; font-family:Montserrat, sans-serif; color:#0c5076; margin-bottom:20px; font-weight:700}



header .inner, footer .inner,.inner {  position:relative;  box-sizing: border-box; margin:auto; width:100%; padding-left:40px; padding-right:40px; overflow:hidden;}

section { margin:auto;max-width:1320px; border-radius:30px; position:relative;  background-size:cover; background-position:center;   box-sizing: border-box;}
.single sectiosn {max-width:none}
.home #hero:before{content:''; background:rgba(12, 80, 118,.35); width:100%; height:100%; display:block; z-index:1;position:absolute; left:0; top:0; bottom:0;right:0}
.home #hero p, .home #hero h1, .home #hero a {position:relative; z-index:9}
.home #hero img { z-index:9}
#hero img {position: absolute;
    right: 0;
    top: -11px;
    height: 360px;
    width: auto;}
#hero h1, #hero h2, #hero h3, #hero h4, #hero h5, #hero h6, #hero p {max-width:55%; color:white;    text-wrap: balance;}
#hero p {font-size:30px}
#hero h1 {padding-top:60px}
#hero p:last-child {padding-bottom:80px}
#hero .button {margin-right:10px}
section#hero  {margin-right:0px; display:block; max-width:none; border-radius:0; margin-bottom: 60px;}
section#hero .inner {max-width:1320px}
section#hero video  {
    width: 100vw;
    height: 100%;
    object-fit: cover;
    position: absolute;
}
section#hero .inner {      overflow: visible;}
section#hero .inner{ min-height: 340px; }
.home section#hero .inner{ min-height: 600px; }
.home section#hero .inner{ min-height: 600px; }
section#hero h1 {font-size:56px; line-height:64px}
section#hero p {font-weight:500; font-size:24px}

section p:nth-child(1) strong {font-size:18px}
.thinnerwidth   .inner .column {padding:100px 14%}

.wp-image-141 {position:absolute; bottom:-20px; left:0; width:18%; height:auto}
.wp-image-144 {position:absolute; top:40px; right:0; width:16%; height:auto}

section.orangebg {padding:60px; margin-bottom:60px}
section.orangebg h2 {color:white; font-size:28px}
section.orangebg p {font-size:16px}
section p, section li, section li div, footer p, footer a {font-weight:500}
section.orangebg:after{content: '';
    display: block;
    width: 100%;
    height: 2.8vw;
    max-height: 39px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: cover;
 background-image:url(/wp-content/themes/LWCode/img/orange%20block%20bottom.jpg);}


section.greybg {padding:60px 0; margin-bottom:60px; padding-bottom:120px}
section.greybg h2 {color:#0c5076; font-size:28px}
section.greybg p {font-size:16px; padding-left:120px; position:relative; margin-bottom:5px}

section.greybg p strong{color:#0c5076; display:inline-block; margin-top:10px;     font-size: 18px;}
section.greybg p img {position:absolute; left:0; top:14px}
section.greybg:after{content: '';
    display: block;
    width: 100%;
    height: 2.8vw;
    max-height: 39px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: cover;
 background-image:url(/wp-content/themes/LWCode/img/grey%20block%20bottom.jpg);}

section.greybg:before{content: '';
    display: block;
    width: 143px;
    height: 150px;
    max-height: none;
    position: absolute;
    bottom: -12px;
    z-index: 9999999;
    right: 189px;
    background-size: cover;
 background-image:url(/wp-content/uploads/2026/03/cactus-trans.gif);}

section.greybg .column:nth-child(2) p:last-child img {    width: 21%;
    float: right;
    position: static;
    height: auto;}
	
	
	
	
section.lightbluebg {padding:100px 0;    margin-bottom:60px; margin-top:60px;   background-size: cover;
 background-image:url(/wp-content/themes/LWCode/img/light%20blue%20block.jpg);}
.home section.lightbluebg {padding:60px 0;  padding-bottom: 40px; }
section.lightbluebg h2 {color:#0c5076; font-size:28px; }
section.lightbluebg h3 {color:#0c5076; font-size:22px; }
section.lightbluebg p {font-size:16px;  position:relative; margin-bottom:5px; }
section.lightbluebg p strong{color:#0c5076; display:inline-block; margin-top:10px}
.page-id-110 section.lightbluebg p {max-width:70%; margin-left:auto; margin-right:auto}
.page-id-110 section.lightbluebg h3 {max-width:70%; margin-left:auto; margin-right:auto}
.page-id-110 section.lightbluebg p:last-child{padding:0; margin-bottom:0px; max-width:none}
.page-id-110 section.lightbluebg {padding-bottom:0}
.home lightbluebg h2 { padding:0 120px}
.home lightbluebg h3 { padding:0 120px}
.home lightbluebg p { padding:0 120px}

section.lightbluebg:after{content: '';
    display: block;
    width: 100%;
    height: 2.8vw;
    max-height: 39px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: cover;
 background-image:url(/wp-content/themes/LWCode/img/light%20blue%20block%20bottom.png);}
.testimonials.yellowbg:before{content: '';
       content: '';
    display: block;
    height: 280px;
    max-height: 280px;
    width: 188px;
    position: absolute;
    top: 20px;
    right: 0;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 53px;
    right: 42px;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 0;
    
    right: 100px;
    background-size: cover;
 background-image:url(/wp-content/uploads/2026/03/sheep2-b.gif);}   
section.blog {margin-bottom:80px}
section.blog .column {margin-bottom:60px}
section.blog .column.before {margin-bottom:0px}
section.blog img {width:100%; height:auto;     border-radius: 10px;    display: block;}
section.blog p {font-size:16px}
section.blog p{margin-bottom:10px}
section.blog p strong{color:#0c5076; display:inline-block; margin-top:10px; font-size:20px}
section.blog p a.readmore {color:#ee7e32; font-weight:700}
section.blog p a.readmore:after {content: '';
    display: inline-block;
    width: 16px; margin-left:5px;
    height: 15px;
   
    background-size: contain;
 background-image:url(/wp-content/themes/LWCode/img/orange%20arrow.svg);}
 
 
 
 section.yellowbg {padding:60px 0; margin-bottom:60px;   background-size: cover;
 background-image:url(/wp-content/themes/LWCode/img/yellow%20block.jpg);}
section.yellowbg h2 {color:#fff; font-size:28px; }
section.yellowbg h3 {color:#0c5076; font-size:22px; }
section.yellowbg p {font-size:22px;  position:relative; margin-bottom:5px;}


.home section.yellowbg h2 { padding:0 120px; color:#0c5076;}
.home section.yellowbg h3 { padding:0 120px}
.home section.yellowbg p strong{color:#fff; }

section.yellowbg p strong{ display:inline-block; margin-top:10px; font-size:16px}
section.yellowbg p {font-size:16px}
section.yellowbg p img {display:block; width:70%; border-radius:50%;max-width:200px;     max-height: 200px;}
.home section.yellowbg p img {display:block; width:auto; border-radius:0; }

section.yellowbg:after{content: '';
    display: block;
    width: 100%;
    height: 2.8vw;
    max-height: 39px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: cover;
 background-image:url(/wp-content/themes/LWCode/img/yellow%20block%20bottom.png);}
 .testimonials   div {display:block}
  .testimonials .inner {padding:0 60px}
.testimonials .column {width:100%; padding-right:30%; box-sizing:border-box; text-align:center}
 .testimonials  .slide {padding:0 80px;box-sizing:border-box; width:100%}
 .slick-dots li button:before {

 font-size: 13px;}
 .slick-prev, .slick-next {
 
    display: block;
    width: 53px;
    height: 53px;
 }
 .testimonials .slick-prev:before {
  content: "";
     width: 53px;
    height: 53px;display: block;
    opacity: 1;
  
  
    background-size: contain;
 background-image:url(/wp-content/themes/LWCode/img/arrow%20circle%20left.svg);
}
 .testimonials .slick-next:before {
  content: "";
     width: 53px;display: block;
    opacity: 1;
    height: 53px;
  
  
    background-size: contain;
 background-image:url(/wp-content/themes/LWCode/img/arrow%20circle%20right.svg);
}
 
.row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;gap: 40px;
}

.column {
	     max-width: 100%;
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
}
.threecolumns {flex-wrap: wrap; --cols: 3;
  --gap: 30px;
  display: flex;
  gap: var(--gap);}
.threecolumns .column {flex-basis:calc(100% / var(--cols) - var(--gap) / var(--cols) * (var(--cols) - 1));; max-width:calc(100% / var(--cols) - var(--gap) / var(--cols) * (var(--cols) - 1))}

.twocolumns {flex-wrap: wrap; --cols: 2;
  --gap: 60px;
  display: flex;
  gap: var(--gap);}
.twocolumns .column {flex-basis:calc(100% / var(--cols) - var(--gap) / var(--cols) * (var(--cols) - 1));}

.homesection#section-3 p,.home section p,.home section li{
    transition: all 2s cubic-bezier(.23,1,.32,1);
    transform: translate3d(0px,100px,0px);
    opacity: 0;
	
}
section#section-3 p.transition, section p.transition, .question p, #hero p , section li.transition, .slick-dots,.slide p, .slide p, .slide li, .slick-dots,.slick-dots li{
    transform: translate3d(0px,0px,0px) !important;
    opacity: 1 !important;
}

section.yellowbg .slide p {
    font-size: 22px;
}
.page-id-110s #section-2:after {content:''; display:block; position:absolute; bottom:-152px; left:0;background-image:url(/wp-content/uploads/2026/03/pair-of-eclairs-scaled.png); background-size:contain; background-repeat:no-repeat; height:200px; width:200px; max-height:none}
.before {margin-bottom:30px}
iframe {width:100%; height:auto}

.page-id-110 section img {border-radius:10px}
.blogpost  {max-width:70%; margin:auto}
.blogpost  img {border-radius:10px}

.questions   {max-width:70%; margin:auto}
.page-id-110 .threecolumns .before  {max-width:70%; margin:auto}

.multicolour  .before   {max-width:70%; margin:auto}
.multicolour  .threecolumns   {max-width:75%; margin:auto}
.multicolour .threecolumns .column p {margin:0}
.multicolour .threecolumns .column p strong {font-size:16px}
.multicolour .threecolumns .column p a {text-decoration:underline}
.multicolour .threecolumns .column {border-radius:10px; text-align:center; padding:10px 50px; box-sizing:border-box; margin-top:40px; margin-bottom:40px}
.multicolour .threecolumns .column:nth-child(1){background:#c5e0e7}
.multicolour .threecolumns .column:nth-child(1) p:nth-child(1) strong{color:#5fa9bc}
.multicolour .threecolumns .column:nth-child(1) p:nth-child(2) strong{color:#14567a; font-size:24px

}

.multicolour .threecolumns .column:nth-child(2){background:#dae5bc

}
.multicolour .threecolumns .column:nth-child(2) p:nth-child(1) strong{color:#95b440}
.multicolour .threecolumns .column:nth-child(2) p:nth-child(2) strong{color:#14567a; font-size:24px

}

.multicolour .threecolumns .column:nth-child(3){background:#f4e4ae

}

.video-thumbnail svg {
    z-index: 5;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    fill: #ee7e32;
    font-size: 3.5rem !important;
    transition: all 0.25s ease;
    background: linear-gradient(#fff, #fff);
    background-size: 50% 50%;
    background-repeat: no-repeat;
    background-position: center;     border: 3px solid white;
    border-radius: 50%;
}
.page-id-124 section p:nth-child(2) strong {
    color:#0c5076
}
.page-id-124 #section-1 li {list-style:none; overflow:hidden; position:relative; padding-left:75px; margin-left:0;

list-style: none;
	background-image: url(/wp-content/uploads/2026/02/tested-icon.png);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 75px; display: flex;
  align-items: center;min-height: 55px;
}
.page-id-124 #section-1 li div {display:block}
.page-id-124 #section-1 li  strong {
    font-weight: 700;
}
.page-id-124 #section-1 li:befores {
      content: '';
    display: inline-block;
    width: 75px;
    height: 75px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(/wp-content/uploads/2026/02/tested-icon.png);
    float: none;
    margin-top: 0px;
    margin-bottom: 7px;
    vertical-align: middle; position:absolute; left:0; top:0
}
.page-id-124 p.bluebg  {
    background: #0c5076;
    padding: 20px 150px;
    text-align: center;
    color: white;
    border-radius: 20px; font-weight:700
}
.page-id-124 .thinnerwidth .inner .column {
    padding-top:0px
}
.page-id-108 .thinnerwidth .inner .column {
    padding-top:0px
}

.page-id-116 .thinnerwidth .inner .column {
    padding-top:40px
}
.page-id-116 #section-1.thinnerwidth .inner .column {
    padding-top:0px
}
.page-id-116 section.lightbluebg .inner .column {
    padding: 0;
}
.page-id-116 section.lightbluebg {    background: none;
    margin: 0 auto;    padding: 0;
    margin-bottom: 0;}
section.lightbluebg:after {display:none}
.page-id-116 section.lightbluebg .inner {background:#ebf4f7;  margin:auto; padding:80px; border-radius:30px}
.page-id-116 section.lightbluebg .inner img {    height: 88px;
    width: auto;
    display: block;
    margin: auto;
    margin-bottom: 20px; margin-top:52px}
  .wp-image-307{
    padding: 20px;
    box-sizing: border-box;
}
  .page-id-116 section.lightbluebg .inner img.wp-image-388 {
      padding: 0px;
    box-sizing: border-box;
    height: 75px;
    margin-top: 38px;
    box-sizing: border-box;
}


.page-id-116  section.yellowbg:before {content: '';
    display: block;
    width: 282px;
    height: 300px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    right: 13px;
    top: -131px;background-image:url( http://troyr122.sg-host.com/wp-content/uploads/2026/03/online-octopus.png)}
body .gallery {margin-top:30px !important}
body .gallery img {width:100%; height:auto}
body #gallery-1 img {
    border: none;
    padding: 20px;
	
    box-sizing: border-box;
    display: block;
    border-radius: 0; 
}
body #gallery-1 .slick-active img {
padding:10px;  
}
body #gallery-1 *{vertical-align:bottom}
body #gallery-1 .gallery-item {
    vertical-align: top;
    float: none;
    margin-top: 0;
    text-align: center;
    width: 100%;
}
.home #section-4 {display:none}
section p a, section li a {text-decoration:underline}
section p a.button {text-decoration:none}
@media only screen and (max-width: 600px) {
  .threecolumns, .twocolumns,.threecolumns .column, .twocolumns .column {display:block; width:100%}
  
}

.postthumbnail img {width:100%; height:auto; margin-bottom:30px}
.icon {display:none}


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


	#hero h1, #hero h2, #hero h3, #hero h4, #hero h5, #hero h6, #hero p {
    max-width: 60%;
}
	#hero h1, #hero h2, #hero h3, #hero h4, #hero h5, #hero h6, #hero p {
    max-width: 55%;
   
}
	#hero img {
    position: absolute;
    right: 20px;
    top: 20px;
   
   
}
}
@media only screen and (max-width: 1280px) {

#mainnav ul li {
    
    margin: 0;    padding: 10px 7px
}
}
@media only screen and (max-width: 1100px) {

#mainnav ul li {
    
    margin: 0;    padding: 10px 5px
}
}
@media only screen and (max-width: 1080px) {
	section.greybg:before,.testimonials.yellowbg:before {display:none}
	
}
@media only screen and (max-width: 1140px) {
	
	    .multicolour .threecolumns {
     --gap: 0px;
    }
	.multicolour .threecolumns .column {
 
    margin-bottom: 0;
}
	.page-id-110 #section-2:after  {display:none}
#hero .button {
    margin-top: 10px;
    display: inline-block;
}
	header .inner, footer .inner, .inner {
    
    padding-left: 20px;
    padding-right: 20px;
   
}
	section.orangebg,section.yellowbg {
    padding: 20px;  margin-bottom: 30px;
    
}
	section.blog .column {
    margin-bottom: 20px;
}
	section.orangebg:after,section.greybg:after,section.lightbluebg:after,section.yellowbg:after {display:none}
	section.greybg {
    padding: 20px 0;
    margin-bottom: 30px;
}
	.wp-image-144 {
   
    top: 15px;
	}
	section#hero {
    
    margin-bottom: 30px;
}
	.home section#hero {
    
    margin-bottom: 0;
}
	.thinnerwidth .inner .column {
    padding: 100px 30px;
}
	.wp-image-140 {display:none}
.threecolumns ,.twocolumns,.fourcolumns{
    flex-wrap: wrap;
    --cols: 1;
    --gap: 30px;
    display: flex;
    gap: var(--gap);
}
.thinnerleft.twocolumns .column:nth-child(2) {
    width: 100%;
    flex-basis: 100%;
    padding: 20px;
    box-sizing: border-box;
}
.icon {
  z-index: 999999999999999;
  position: fixed;
  background: none;
  display: block;
  padding: 11px;
  height: 40px;
  width: 28px;
  margin: 0px;
     top: 10px;
    right: 20px;
  cursor:pointer;
  display:none;
  color:#fff;
  font-size:14px;
  display: block;

background:
transparent;

width: auto;

box-sizing: border-box;

left: auto;

top: 19px; padding-left:15px;     padding-right: 0px;
  
}
.icon span {color: #000; display:inline-block; margin-left: 33px;

float: left;

margin-top: 0px;

font-size: 17px;

margin-top:2px; }

.hamburger {
left: 8px;
    float: left;
    float: left !important;
    width: 22px !important;

}
.hamburger  div { width: 22px !important; left:8px}
.menui {
  background: #ffffff;
  transition: 0.35s linear;
  margin-top: 16px;
  position: absolute;
}
.menui {
  background: #ffffff;}
  .navactive  .menui {
  background: #ffffff;}
.top-menu {
  top: -5px;
  width: 22px;
  height: 3px;
  border-radius: 0;
}
.mid-menu {
  top: 3px;
  width: 22px;
  height: 3px;
  border-radius: 0;
}
.bottom-menu {
  top:11px;
   width: 22px;
  height: 3px;
  border-radius: 0;
}
.hamburger {float:left}
.icon {display:block; background:#0c5076}

	.navactive .top-menu{    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(45deg);
    top: 5px;}
.navactive .bottom-menu{transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg); top:5px}
.navactive .mid-menu {display:none}	
.navactive.icon {}

 #mainnav { width:100% !important; height:100vh; padding:20px; 
 padding-bottom:5vh; background:#0c5076; position:fixed; top:0px; left:-9999px; right:auto; z-index: 999999  padding-top:5vh; overflow-y:scroll; box-sizing:border-box;
    top: 0 !important;
    margin: 0; margin-left:0 !important; margin-top:0 !important; float:none}
	 nav ul {
    display: block;
    justify-content: normal; padding-top:5vw; z-index: 999;
}
#mainnav ul li ul,#mainnav ul li ul ul {
   
    position: static;
    top: 0;
    background: transparent;
    padding: 0;
    z-index: 99999;
    left: 0;
    min-height: 0;
    width: 100%;
    padding-top: 0;
}
    #mainnav ul li,#mainnav ul li ul ul li {
        display: block;
        padding: 10px 5px;
        margin: 0 2px;
        position: relative;
        text-align: center;
    }
	#mainnav ul li ul li a, #mainnav ul li ul ul li a ,#mainnav ul li a{
    color: white;
    background: transparent;}
.navactive  #mainnav {left:0; z-index: 999;}

    nav#mainnav  ul ul {
        display: none;
        transition: all 1s ease-in;
    }
	    nav#mainnav  ul .open ul {
        display: block;
    }
	
	  nav#mainnav  ul ul ul{
        display: none;
        transition: all 1s ease-in;
    }
	    nav#mainnav  ul .open ul .open ul {
        display: block;
    }
	 body nav#mainnav {
        left: auto !important;
        right: -100vw !important;
        transition: all ease-in-out 1s;
        width: 300px !important;
    }

	body.navactive nav#mainnav {
        left: auto !important;
        right: -0 !important;
        transition: all ease-in-out 1s;
    }
	section#hero .inner {
    min-height: 370px;
    overflow: hidden;
}
	#hero h1, #hero h2, #hero h3, #hero h4, #hero h5, #hero h6, #hero p {
    max-width: 60%;
   
}
	#hero img {
    position: absolute;
    right: 20px;
    top: 20px;
    height: auto;
    width: 40%;
}
	.testimonials .column {
   
    padding-right: 0;
   
}
	.orange-outline.button {top: 70px;right:20px}
	.orange-fill.button {top: 70px;right:180px}
}


@media only screen and (max-width: 768px) {
.page-id-116 section.lightbluebg .inner {
   
    max-width: 94%;
   
    padding: 20px;
}
	.thinnerwidth .inner .column {
        padding: 30px 20px; padding-top:0
    }
	
	.home #section-1.thinnerwidth .inner .column {
        padding: 30px 55px;
        padding-top: 0;
    }
	.page-id-116 .thinnerwidth .inner .column {
    padding-top: 20px;
}
	.page-id-116 section.yellowbg:before {
   
    width: 127px;
    height: 300px;
  
    right: 13px;
    top: -106px;
}
	.orange-outline.button {display:none}
	.orange-fill.button {display:none}
	section#hero h1 {
    font-size: 40px;
    line-height: 50px;    padding-top: 30px;
}
	section#hero p {
    font-weight: 500;
    font-size: 20px;
}
	#hero h1, #hero h2, #hero h3, #hero h4, #hero h5, #hero h6, #hero p {
        max-width: 100%;
    }
	#hero img {
        position: static;
        right: 20px;
        top: 20px;
        height: auto;
        width: 100%;
        margin-bottom: 30px; margin-top:20px
    }
	.multicolour .threecolumns {
    max-width: 100%;
    margin: auto;
}
	.multicolour .threecolumns .column {
   margin-bottom: 0;
		margin-top: 20px;}
	    .threecolumns, .twocolumns, .fourcolumns {
       
			--gap: 0px;}
	.questions {
    max-width: 100%;
    margin: auto;
}
	.page-id-124 .thinnerwidth .inner .column {
    padding-top: 0px;
    box-sizing: border-box;
    width: 100%;
}
	.page-id-124 p.bluebg {
    padding: 20px;
	}
	footer {
   
    margin-top: 0;
}
	footer .column {
    padding-top: 0;
}
	footer .column:last-child {
    text-align: left;
}
	.page-id-108 .thinnerwidth .inner .column {
    padding-top: 10px;
}
	.single-post     #hero img {
		margin-top: 20px;}
	
	.blogpost {
    max-width: 100%;
    margin: auto;
}
	    #hero .button {
        margin-left: 0;
        margin-bottom: 20px;
        display: inline-block;
    }
	.home section#hero .inner {
    min-height: 10px;
}
	
	#hero p:last-child {
    padding-bottom: 20px;
}
	
	.home #section-1 {padding-top:30px}
	.home section.lightbluebg h3 {
    max-width: 94%;
    margin-left: auto;
    margin-right: auto;
}
	.home section.lightbluebg p {
    max-width: 94%;
    margin-left: auto;
    margin-right: auto;
}
	.testimonials .inner {
    padding: 25px;
}
	section.yellowbg .slide p {
    font-size: 18px;
}
	.testimonials .slide {
    padding: 0;
	}
	section.blog {
    margin-bottom: 40px;
}
	section.lightbluebg {
		padding: 30px 0;}
	.page-id-110 .threecolumns .before {
    max-width: 100%;
    margin: auto;
}
	.multicolour .before {
    max-width: 100%;
    margin: auto;
}
	.question p {padding-right:40px}
	#hero .button {
    margin-right: 0;
    font-size: 14px;
    padding: 10px 20px;
}
	    .page-id-124 p.bluebg {
        padding: 20px;
        font-size: 14px;
    }
	.page-id-124 .thinnerwidth .inner .column {
        padding: 30px 0px;
        padding-top: 0;
    }
	.testimonials.yellowbg:before,.testimonials.yellowbg button.slick-arrow {display:none !important}
	section.greybg:before {
   
    width: 98px;
    height: 111px;
   
    bottom: -12px;
    right: auto;
		left: 10px;}
	
	.wp-image-141 {
  
    bottom: -4px;
  
}
}
@media only screen and (min-width: 1060px) {

#mainnav ul li#menu-item-378 {display:none}
}