body {
  overscroll-behavior-y: none;
}

:root {
  --cu-dark-blue: rgb(9,45,95);
  --cu-dark-blue-trans: rgba(9,45,95,0.75);
  --cu-light-blue: rgba(0,82,150,100);
  --cu-light-blue-zero: rgba(0,82,150,0);
  --cu-light-blue-tint: rgba(0,82,150,0.75);
  --cu-slate: rgb(111,137,134);
  --cu-slate-trans: rgba(111,137,134,0.9);
  --cu-slate-trans-light: rgba(111,137,134,0.25);
  --cu-slate-trans-zero: rgba(111,137,134,0.0);
   --cu-slate-trans-fifty: rgba(111,137,134,0.50);
--cu-orange: rgb(240,125,0);
--cu-orange-trans: rgba(240,125,0,0.75);
  --cu-green: rgb(105,177,63);
 --cu-green-trans: rgba(105,177,63,0.75);
--cu-light-grey: #E6EDEC;

}

#loadMore {
  width: 200px;
  display: block;
  text-align: center;
  margin: 20px auto;
  padding: 8px;
  padding-bottom: 32px;
  position: relative;
  background-color: #fff;
}

#loadMore:after {
  
  content: "v";
  bottom: 0px;
  width: 100%;
  position: absolute;
  left: 0px;
  bottom: -0px;
  font-family: complete-icons;
  
}

.noContent {
  color: #000 !important;
  background-color: transparent !important;
  pointer-events: none;
}


.viewmorenews {
  float: left;
  width: 100%;
  text-align: center;
    background-color: #fff;
    padding-bottom: 48px;
}




#hide input[type=file] {
display:none;
margin:10px;
}
#hide input[type=file] + label {
display:inline-block;
margin:20px;
padding: 4px 32px;
background-color: #FFFFFF;
border:solid 1px #666F77;
border-radius: 6px;
color:#666F77;
}
#hide input[type=file]:active + label {
background-image: none;
background-color:#2D6C7A;
color:#FFFFFF;
}
.jobapplication  #hide label {
    border: 1px solid #d8d8d8;
    color: #eee;
    padding: 12px 12px;
    position: relative;
    cursor: pointer;
     color: #333;
}

#hide label {
    border: 1px solid #eee;
    color: #eee;
    padding: 12px 12px;
    position: relative;
    cursor: pointer;
   
}

#hide label:after {
   content: "s";
   position: absolute;
   right: 4px;
   font-family: complete-icons;
   font-size: 24px;
   width: 36px;
   text-align: center;
   top: 10px;
}






@font-face {
  font-family: "complete-extra";
  src:url("https://www.completeutilities.co.uk/fonts/complete-extra.eot");
  src:url("https://www.completeutilities.co.uk/fonts/complete-extra.eot#iefix") format("embedded-opentype"),
    url("https://www.completeutilities.co.uk/fonts/complete-extra.woff") format("woff"),
    url("https://www.completeutilities.co.uk/fonts/complete-extra.ttf") format("truetype"),
    url("https://www.completeutilities.co.uk/fonts/complete-extra.svg#complete-extra") format("svg");
  font-weight: normal;
  font-style: normal;

}



[data-newicon]:before {
  font-family: "complete-extra" !important;
  content: attr(data-newicon);
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^="newicon-"]:before,
[class*=" newicon-"]:before {
  font-family: "complete-extra" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.newicon-youtube-square:before {
  content: "\61";
}
.newicon-youtube-play:before {
  content: "\62";
}









@charset "UTF-8";
@font-face {
    font-family: complete-icons;
    src: url(https://www.completeutilities.co.uk/fonts/complete-icons.eot);
    src: url(https://www.completeutilities.co.uk/fonts/complete-icons.eot#iefix) format("embedded-opentype"), url(../fonts/complete-icons.woff) format("woff"), url(https://www.completeutilities.co.uk/fonts/complete-icons.ttf) format("truetype"), url(https://www.completeutilities.co.uk/fonts/complete-icons.svg#complete-icons) format("svg");
    font-weight: 400;
    font-style: normal
}





[data-icon]:before {
    font-family: complete-icons!important;
    content: attr(data-icon);
    font-style: normal!important;
    font-weight: 400!important;
    font-variant: normal!important;
    text-transform: none!important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

[class*=" icon-"]:before,
[class^=icon-]:before {
    font-family: complete-icons!important;
    font-style: normal!important;
    font-weight: 400!important;
    font-variant: normal!important;
    text-transform: none!important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-arrowdown:before {
  content: "\61";
}
.icon-arrowleft:before {
  content: "\62";
}
.icon-arrowright:before {
  content: "\63";
}
.icon-arrowup:before {
  content: "\64";
}
.icon-cross:before {
  content: "\65";
}
.icon-email:before {
  content: "\66";
}
.icon-facebook:before {
  content: "\67";
}
.icon-linkedin:before {
  content: "\68";
}
.icon-magnifying:before {
  content: "\69";
}
.icon-magnifyingjobs:before {
  content: "\6a";
}
.icon-navarrow:before {
  content: "\6b";
}
.icon-navarrowdown:before {
  content: "\6c";
}
.icon-navarrowleft:before {
  content: "\6d";
}
.icon-navarrowright:before {
  content: "\6e";
}
.icon-navarrowup:before {
  content: "\6f";
}
.icon-phone:before {
  content: "\70";
}
.icon-smallarrowright:before {
  content: "\71";
}
.icon-twitter:before {
  content: "\72";
}
.icon-upload:before {
  content: "\73";
}
.icon-magnifyingjobs-1:before {
  content: "\74";
}
.icon-quotes:before {
  content: "\75";
}
.icon-arrowdownnew:before {
  content: "\76";
}
.icon-arrowleftnew:before {
  content: "\77";
}
.icon-arrowrightnew:before {
  content: "\78";
}
.icon-arrowupnew:before {
  content: "\79";
}

.icon-thumbs-up:before {
  content: "\7a";
}
.icon-mail:before {
  content: "\41";
}
.icon-location:before {
  content: "\42";
}



#teamprofileslist 

 {
   display: inline-grid;
    padding: 20px 0;
    margin-top: 60px;
    padding-bottom: 60px;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 32px;
    padding: 0px 64px;
    padding-bottom: 100px;
    width: 100%;

}

.staffmemberbox 

 {
   display: inline-grid;
   margin-top: 60px;
   padding-bottom: 60px;
   grid-template-columns: repeat(3, 1fr);
   grid-gap: 32px;
   padding: 0px 64px;
   padding-bottom: 0px;
   float: left;
}

.staffmembertext 

 {
   grid-column: 2 / 4;
}


.staffmembertext  h3

 {
  font-size: 32px;
}

.jobtitle

 {
  font-size: 24px;
  padding-bottom: 16px;
}


.profilelisting .profilename

 {
  font-size: 24px;
  padding-top: 16px;
  font-weight: 600;
}


.profilelisting .jobtitle

 {
  font-size: 18px;
  padding-bottom: 16px;
}

#prevnext 


 {
   width: 100%;
   padding: 16px 64px;
   padding-bottom: 100px;
   float: left;
   margin-top: 64px;
}


.previous 

 {

   float: left;
}

.next 
 {
   float: right;
}

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
    text-decoration: none;
}

.calltoactionblog {
  float: left;
  width: 100%;
  display: block !important;
  padding: 0px;
  text-align: center;
  background-color: #70ad28;
  margin-top: 16px;
}

.calltoactionblog a {
  float: left;
  width: 100%;
  display: block !important;
  padding: 16px;
  text-align: center;
  color: #fff;
  margin-top: 0px;
  font-size: 18px;
}

.videoareaoutside {
    padding: 16px;
    background-color: rgb(28 82 150);
    width: 100%;
    display: inline-block;
    background-repeat: no-repeat;
    margin-top: 24px;
    color: rgb(255, 255, 255);
    text-align: center;
}

.videoarea {
    padding: 16px;
    background-color: rgb(51 105 173);
    width: 48%;
    display: block;
    background-repeat: no-repeat;
    border-radius: 8px;
    color: rgb(255, 255, 255);
    display: inline-block;
}

.videoeventarea .videoarea {
    padding: 8px;
    background-color: rgb(33, 42, 41);
    width: 100%;
    display: inline-block;
}

.videoarea h3 {
    padding: 8px;
    color: rgb(255, 255, 255);
    line-height: 1;
}

.casevideoarea {
    padding: 8px;
    background-color: rgb(37, 7, 37);
    width: 100%;
    display: inline-block;
}

.videoarea video {
    margin-top: 12px;
}

video {
    width: 100%;
    height: auto;
    background-size: cover;
    transition: opacity 1s ease 0s;
    display: block;
    line-height: 0;
    padding: 0px;
    margin: 0px;
}


.staffcontact {
    float: left;
    width: 100%;
    padding: 0px;
    /* background-color: #eee; */
}

.staffemail a,
.stafflinked a {
  padding: 6px;
  padding-left: 34px;
  font-weight: 600;
  position: relative;
  float: left;
  background-color: #1c5296;
  color: #fff;
  margin-right: 12px;
  border-right: 1px solid #123561;
  font-size: 14px;
}

.staffemail a:after
 {
    position: absolute;
    content: "f";
    font-family: complete-icons;
    color: #fff;
    left: 2px;
    top: 2px;
    font-size: 28px;
    height: 28px;
    line-height: 1;
    padding: 2px;
}

.stafflinked a:after {
   position: absolute;
   content: "h";
   font-family: complete-icons;
   color: #fff;
   left: 2px;
   top: 2px;
   font-size: 28px;
   height: 28px;
   line-height: 1;
}










.basicsearch {
    float: left;
    left: 0;
    background-color: var(--cu-orange);
    width: 100%;
    height: auto;
    margin-top: 32px;
    position: relative;
}

.basicsearch form {
    margin: 0;
    padding: 24px
}


.basicsearch form input {
    border-bottom: 1px solid #fff;
    width: 85%;
    float: left;
    background-color: rgba(0, 0, 0, 0);
}

.basicsearch form input::-webkit-input-placeholder {
    color: #fff
}

.basicsearch form input:-ms-input-placeholder {
    color: #fff
}

.basicsearch form input::placeholder {
    color: #fff
}

.basicsearch form input.sb-search-submit {
    float: left;
    width: 15%;
    border-bottom: none;
    color: #fff;
    background-color: var(--cu-orange);
    font-family: complete-icons;
    cursor: pointer;
    font-size: 32px;
}


.sixcolumns {
    display: grid;
    grid-template-columns: 1fr 1fr 4fr 4fr 1fr 1fr;
    grid-gap: 24px;
}


.sixcolumns > * {
  grid-column: 2 / -2;
  width: 100%;
}

.gridblock {
    grid-column: 2 / 6;
}

.gridtextblock.alignleft {
    grid-column: 2 / 4;
}

.gridimageblock.alignleft {
    grid-column: 4 / 8;
}

.gridtextblock.alignright {
    grid-column: 4 / 6;
}

.gridimageblock.alignright {
    grid-column: 1 / 4;
    grid-row: 3 /3;
}



.contentbreak {
    float: left;
    margin: 12px 0px;
    width: 100%;
}

* {
    margin: 0;
    padding: 0;

}

body,
html {
    height: 100%;
    color: var(--cu-dark-blue);
    font-size: 16px;
}

h1,
h2,
h3,
h4,
h5
{padding-bottom: 12px;font-weight: 300;}


p {
    margin: 0;
    padding-bottom: 12px;
    font-weight: 300;
}

h1 {
    font-size: 30px;
    font-weight: 600;
}

h2 {
    font-size: 20px;
}

.careers h2 {
    font-size: 18px;
}

.careers h3 {
    font-size: 24px;
    font-weight: 600;
}


.greyback h2 {
    font-size: 21px;
    font-weight: 300;
    /* margin-top: 16px; */
}

h2 a {
    font-weight: 300
}

h3 {
    font-weight: 600;
    font-size: 20px;
}

#mainwrapper {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    display: block;
}

.maincontent {
    float: left;
    width: 100%;
    background-color: #fff;
    padding: 48px 0;
    line-height: 1.5;
    position: relative;
    z-index: 1;
    padding-bottom: 88px;
}


.maincontent.archive {
    padding: 0px;
}

.maincontent.lightest {
 
    padding-top: 0px;
}

 .maincontent.lightest #picturenavservicessmall {
   padding: 20px 0px;
 }

.maincontent.contactmain {
    background-color: #e6edec;
    padding-bottom: 0px;
   

}

.maincontent.contactblocks {
    background-color: #fff;
    padding-top: 0px;
     margin-top: 48px;


}

.visionarea {
    float: left;
    width: calc(100%-64px);
    background-color: var(--cu-green);
    padding: 48px 0;
    line-height: 1.5;
    position: relative;
    z-index: 1;
    padding-bottom: 80px;
    color: #fff;
    margin-left: 64px;
}


.visionarea .nuvo_textblock_left
 {
    width: 28%;
    float: left;
    padding: 0px 12px 0px 0px;
    padding-top: 32px;
}

.visionarea .nuvo_textblock_right
 {
    width: 72%;
    float: left;
    padding: 0px 12px 0px 64px;
    padding-top: 32px;
}


.visionarea em {
   font-size: 20px;
   line-height: 33px;
}

.visionarea:before {
    position: absolute;
    content: "";
    width: 64px;
    background-color: #fff;
    height: 50%;
    left: -64px;
    top: 0px;
}

.visionarea:after {
    position: absolute;
    content: "";
    width: 33%;
    background-color: var(--cu-light-grey);
    height: 64px;
    left: 0px;
    bottom: 0px;
}

.maincontent.introarea:after {
  content: "";
  width: 64px;
  height: 120px;
  background-color: var(--cu-light-blue);
position: absolute;
bottom: 0px;
right: 0px;

    
}


.maincontent.introarea a {
    float: left;
    background-color:var(--cu-dark-blue);
    padding: 10px 48px;
    text-transform: uppercase;
    color: #fff;
    margin-top: 32px;
}

.jpfilters {
    margin-bot
}

.maincontent.greyback {
    float: left;
    width: 100%;
    background-color:var(--cu-light-grey);
    padding: 48px 0;
    line-height: 1.5;
    position: relative;
    z-index: 1;
}


.maincontent.newsborder {
    float: left;
    width: 100%;
}

.maincontent.navareahome {
 background-color:var(--cu-light-blue);
}


.maincontent.darker {
    padding: 0;
}

.maincontent.contactpage {
background-color: var(--cu-light-blue);
}



.maincontent.withstatements {
    margin-top: -100px;
    position: relative;
    background-color: rgba(0,0,0,0);
    }


    .threestatements {
    display: inline-grid;
    grid-gap: 64px;
    grid-template-columns: repeat(3, 1fr);
    position: relative;
    grid-column: content-end/full-end;
    }


    .threeimage {
        float: left;
        width: 100%;
        padding-left: 32px;
        grid-column: content-end/full-end;
    }

     .threedesc {
        float: left;
        width: 100%;
        padding-left: 32px;
        padding-top: 16px;
        font-size: 16px;
    }

.threeimageheaders {
    margin-top: -48px;
    float: left;
}

.headerone,
.headertwo {
    float: left;
    width: 100%
}



.headerone span,
.headertwo span
 {
    background-color:var(--cu-light-blue);
    font-size: 32px;
    padding: 0px 8px;
    font-weight: 800;
    color: #fff;
    float: left;
    position:relative;
}

.headerone span {
     background-color:var(--cu-light-blue);
}

.headertwo span {
     background-color: var(--cu-slate);
}





   .aboutvalues {
    display: inline-grid;
    grid-gap: 64px;
    grid-row-gap: 64px;
    grid-template-columns: repeat(2, 1fr);
    position: relative;
    padding: 64px;
    grid-column: content-end/full-end;
    }

   .value {
     padding-left: 32px;
     background-color: var(--cu-light-grey);
   }

    .valueimage {
        float: left;
        width: calc(100% + 32px);
padding-left: 32px;
margin-left: -32px;
        background-color: #fff;
    }

     .valuedesc {
       margin-left: 32px;
       float: right;
       width: calc(100% + 32px);
       padding: 32px;
       padding-left: 24px;
       font-size: 16px;
       border-left: 32px solid #fff;
       height: 100%;
    }

.valueheaders {
    margin-top: -48px;
    margin-left: -32px;
    float: left;
}


.greenheading {
    float: left;
    width: 100%
}



.greenheading span

 {
    background-color:var(--cu-green);
    font-size: 32px;
    padding: 0px 8px;
    font-weight: 800;
    color: #fff;
    float: left;
    position:relative;
}



.singleorangeheading {
     float: left;
     width: 100%;
     margin-top: -70px;
}

.singleorangeheading h1 {
   padding: 0px;
   margin: 0px;
}


.singleorangeheading span {
     background-color: var(--cu-light-blue);
     color: #fff;
     padding: 2px 16px;
     font-size: 34px;
     font-weight: 600;
     float: left;
}











.maparea {
    display: inline-grid;
    grid-gap: 24px;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: row;
    padding: 40px 0;
    position: relative;
    background-color: var(--cu-light-blue);
}

.maparea h3 {
   font-size: inherit;
   padding: 0px;

   }

.maparea .maincontent {
    position: absolute;
    background-color: rgba(0,0,0,0);
    padding-top: 0px;
}

.maparealeft {
    grid-column: 1/2
}


.mapaddress {
background-color: #fff;
float: left;
width: 100%;
max-width: 320px;
padding: 32px 12px 80px 64px;
padding-left: ;
font-size: 18px;
position: relative;


}

.mapaddress:before {content: "B";
left: 0px;top: 16px;position: absolute;font-size: 64px;line-height: 1;font-family: complete-icons;color: var(--cu-green);}

.maparearight {
    grid-column: 2/4;
    margin-left: -100px
}

.maincontent.darkest {
    background-color: #3f3f3f
}

.innerwrapper {
    width: 100%;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 64px;
    clear: both;
}




  .contactcolumns {
     width: 100%;
     display: inline-grid;
     grid-gap: 64px;
     grid-auto-columns: 1fr;
     grid-auto-flow: column;
     text-align: center;
     font-size: 18px;
     font-weight: 600;
     align-items: stretch;
     margin-top: -54px;
}

.contactcol {
    position: relative;
    padding: 64px 0px 64px 0px;
    color: #fff;
    background-color: var(--cu-light-blue);
}

.contactintro {
    text-align: left;

}

.contacttel {
    font-weight: 600;
    padding-top: 80px;
}



.contacttel a {
   
    position: relative;
     font-weight: 300;
}


.contactemail {
    font-weight: 600;
    padding-top: 80px;
}


.contactemail a {

    float: left;
    width: 100%;
    position: relative;
    font-weight: 300;
    font-size: 16px;
}


.callus,
.emailus,
.followus {
    content: "f";
    position: absolute;
    top: 0px;
    left: 0px;
    width: auto;
    font-size: 20px;
    padding: 12px 16px 12px 48px;
    background-color: var(--cu-dark-blue);
}



.emailus:before {
    content: "A";
    position: absolute;
    top: 4px;
    left: 8px;
    font-family: complete-icons;
    font-size: 32px;
    padding: 0px;
}

.callus:before {
    content: "p";
    position: absolute;
    top: 8px;
    left: 8px;
    font-family: complete-icons;
    font-size: 40px;
    padding: 0px;
    line-height: 1;
}

.followus:before {
    content: "z";
    position: absolute;
    top: 4px;
    left: 8px;
    font-family: complete-icons;
    font-size: 32px;
    padding: 0px;
}


.contactsocial {
     /* padding-top: 24px; */
     font-size: 48px;
}

.socialiconsnew {
  display: flex;
  justify-content: center;
    width: 100%;
    line-height: 40px;
    font-size: 60px

   
}

.socialiconsnew a i,
.socialiconsnew a {
    height: 20px;
    line-height: 20px;
   
}

.contactsocial h3 {
    padding: 0px;
    float: left;
    width: 100%;
}

.navigationintro {
    float: left;
    text-align: center;
    color: #fff;
    width: 100%;
    padding: 0px 16px;
}

.navigationintro h3 {
    font-weight: 600;
    font-size: 28px;
    color: #fff;
    padding: 16px 0px;
}

.maincontent.lightest .navigationintro,
.maincontent.lightest h3 {
  color: var(--cu-dark-blue);
}

.newsleft {
    float: left;
    width: 75%;
    padding: 32px 0
}

.newsright {
    float: left;
    width: 25%;
    padding: 32px 0
}

.innerwrapperwider {
    width: 100%;
    float: left;
    padding: 0 64px;
    /* position: relative; */
}

.newsblock {
    display: inline-flex;
    grid-gap: 36px;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-flow: row;
    padding: 40px 0;
}

.newsblock h3 {
    padding-top: 0;
    margin-top: 0;
    float: left;
    width: 100%;
}

.newsblock h3 span {
    font-size: 20px;
    font-weight: 600;
    padding: 8px;
    margin-bottom: 24px;
    float: left;
    background-color: var(--cu-slate-trans-fifty);
    color: #fff;
}

.newsblockthird {
    position: relative;
    padding-bottom: 24px;
}





.phoneblock {
    float: left;
    width: 100%;
    padding-top: 40px;
}

.emailblock a,
.phoneblock a {
    padding-left: 40px;
    font-weight: 600;
    position: relative
}

.emailblock a:after,
.phoneblock a:after {
    position: absolute;
    content: "a";
    font-family: complete-icons;
    color: #9e9e9e
}

.phoneblock a:after {
    content: "p";
    font-size: 40px;
    top: -8px;
    left: -4px
}

.emailblock a:after {
    content: "f";
    left: 0;
    top: -4px;
    font-size: 32px
}

.emailblock {
    float: left;
    width: 100%;
    padding-top: 24px;
}




#strapline .phoneblock {
    float: left;
    width: auto;
    padding-top: 0px;

}

#strapline .emailblock a,
#strapline .phoneblock a {
    padding-left: 40px;
    font-weight: 600;
    position: relative;
    float: left;
}

#strapline .emailblock a:after,
#strapline .phoneblock a:after {
    position: absolute;
    content: "a";
    font-family: complete-icons;
    color: #9e9e9e
}

#strapline .phoneblock a:after {
    content: "p";
    font-size: 40px;
    top: -8px;
    left: -4px
}

#strapline .emailblock a:after {
    content: "f";
    left: 0;
    top: -4px;
    font-size: 32px
}

#strapline .emailblock {
    float: left;
    width: auto;
    padding-top: 0px;
     padding-left: 12px;
}








.addressblock {
    float: left;
    width: 100%;
    padding-top: 24px;
    line-height: 26px;
}


.addresshome {
    width: 30%;
    order: 1;
}

.jobshome {
    width: 35%;
    padding-right: 24px;
    margin-top: 80px;
    order: 2;
}

.newshome {
   margin-top: 80px;
   width: 35%;
   padding-right: 0;
   order: 3;
}

.newssmalllist {
    float: left;
    width: 100%;
    margin-bottom: 16px
}

.newssmalllist .newsitemleft {
    position: relative;
    width: 30%;
    max-width: 132px;
}

.newssmalllist .newsitemleft img {
    width: 100%;
    max-width: 800px;
}

.newssmalllist .newsitemleft .newsdate {
    position: absolute;
    bottom: 0;
    display: none;
    padding: 4px;
    background-color: #70ad28;
    color: #fff;
}


.newsdatesimple,
.newscatsimple,
.authorsimple {float: left;font-size: 16px;/* margin-top: 36px; */}

.viewalllinkhome {
    bottom: 16px;
    right: 16px;
    padding-right: 16px;
}

.viewalllinkhome a {
    padding-right: 8px;
    position: relative;
    font-weight: 600;
}

.viewalllinkhome a:after {
    right: -18px;
    position: absolute;
    font-family: complete-icons;
    content: "x";
    font-size: 20px;
    top: -1px;
    text-transform: none
}

.newsblock #socialmediabase {
    position: relative;
    float: left;
    padding-left: 18px
}

#socialmediabase {
    position: absolute;
    right: 32px;
    top: 23px;
    text-align: right
}

#socialmediabase a {
    display: block;
    float: left;
    width: auto;
}

#socialmediabase i {
    width: 34px;
    height: 34px;
    display: block;
    font-size: 32px;
    top: 0;
    padding: 8px;
    text-align: center;
    cursor: pointer;
    color: #fff;
}



#socialmediabase .icon-twitter:before {
  content: "\72";
  font-size: 36px;
  position: relative;
}

#socialmediabase i {
    color: #9e9e9e
}

#socialmediabase i:hover {
    color: #8d8d8d
}

.newsblockthird img {
    max-width: 200px;
}

.list-item {
    float: left;
    width: 100%;
    display: none;
}

.newsitemleft {
    float: left;
    width: 40%;
    position: relative;
}

.newsitemright {
    float: left;
    width: 60%;
    padding-left: 48px;
}

.newssmalllist .newsitemright {
    padding: 0 16px;
    width: 70%;
}

.newssmalllist .newsitemright a {
    font-weight: 600
}

.newssmalllist h4 {
    font-weight: 600;
    padding: 0
}

.newslistcat {
    padding: 4px 16px;;
    position: absolute;
    top: -20px;
    clear: both;
    background-color: #70ad28;
    color: #fff;
}

.newslistcat.latest-news { 
    background-color: var(--cu-green);
}

.newslistcat.insight { 
    background-color: var(--cu-light-blue);
}

.newslistcat.case-studies { 
    background-color: var(--cu-orange);
}


.newslistcat.industry-news { 
    background-color: var(--cu-slate);
}

    .newslistcat span{
   font-weight: 600
    }
  
}

.newslisttitle {
    float: left;
    width: 100%;
    clear: both;
    font-weight: 600
}

.newslisttitle h2 {
    font-weight: 600;
    width: 100%;
    float: left;
}

.newsdetailslist {
    float: left;
    padding: 0 0;
    width: 100%;
    clear: both
}

.mainarticlelist {
    float: left;
    padding: 0 0;
    width: 100%;
    clear: both;
    margin-bottom: 12px
}

.threequarters {
    float: left;
    width: 75%;
    padding-right: 48px
}

.onequarter {
    float: left;
    width: 25%
}

.onehalf {
    float: left;
    width: 75%
}

body {
    margin: 0;
    width: 100%;
    background-color: var(--cu-light-grey)
}

header {
    width: 100%;
    float: left;
    position: relative;
    height: 144px;
    z-index: 2;
}

header.shrink #navigationarea {
    position: fixed;
    max-width: 1200px;
    top: 0px;
    right: 0;
    left: 0;
    margin-right: auto;
    margin-left: auto;
    background-color: var(--cu-slate);
    transition: all .4s ease-in-out
}

#logoareatwo {

   opacity: 0;
    transition: all .1s ease-in-out;
}

#logoareatwo img {
    float: left;
    width: 160px;
}



.calltoaction {
    padding: 64px 120px 120px 120px;
    float: left;
    width: 100%;
    background-color: var(--cu-orange);
    color: #fff;
    text-align: center;
    position: relative;
    font-size: 18px
}

.newsarea {
  position: relative;
}

.newsarea:before {
    width: 30%;
    height: 64px;
    content: "";
    background-color: var(--cu-light-grey);
    top: -64px;
    left: 0px;
    position: absolute;
    z-index: 1;
}


.contactcolumnscta {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: center;
    z-index: 1;
    padding: 24px 0px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    font-size: 22px;
    margin-top: 16px;
   
  }




.contactcolcta:nth-child(1) {
    position: relative;
    color: #fff;
    width: 50%;
    display: flex;
    text-align: center;
}

.contactcolcta:nth-child(2) {
    position: relative;
    color: #fff;
    width: 30%;
    text-align: center;
}

.contactcolcta:nth-child(3) {
    position: relative;
    color: #fff;
    width: 25%;
    text-align: center;
    float: right;
}

.contactcolcta {
    position: relative;
    color: #fff;
    width: 33.3333333%;
    text-align: center;
}

.contactcolcta i {
   font-size: 32px;
   margin-top: -4px;
   position: relative;
   height: 12px;
   line-height: 0;

}

.followwords {
  float: left;
  padding-top: 4px;
}


.socialiconscta {
     width: auto;
     font-size: 36px;
     line-height: 1;
     margin-top: -8px;
     padding-top: 12px;

}
.followuscta, .calluscta, .emailuscta {
    text-align: center;
    display: flex;
    flex-direction: row;
    /* width: 100%; */
}

.calluscta a {
    width: auto;
    font-weight: 600;
    padding-left: 0px;
    position: relative;
}

.calluscta a:before {
    position: absolute;
    content: "p";
    font-size: 40px;
    line-height: 30px;
    left: 0px;
    top: 8px;
    font-family: complete-icons;
}

.emailuscta a:before {
    position: absolute;
    content: "A";
    font-size: 36px;
    line-height: 30px;
    left: 0px;
    top: 8px;
    font-family: complete-icons;
}

.calluscta a,
.emailuscta a
 {
    font-weight: 600;
    position: relative;
    padding: 12px;
    padding-left: 42px;
}

.emailuscta {
    width: 100%;
}

.followuscta {
    float: right;
    width: auto;
    padding: 8px;
}






.calltoaction h3 {
    font-size: 24px;

}

.calltoaction h4 {
    font-size: 24px;
    font-weight: 600
}

.calltoaction h4 a {
    text-decoration: underline
}

footer {
    width: 100%;
    float: left;
    background-color:var(--cu-dark-blue);
    position: relative;
    color: #eee;
    font-size: 14px;
    text-align: center;
}

.styled-checkbox {
    position: absolute;
    opacity: 0
}

.styled-checkbox+label {
    position: relative;
    cursor: pointer;
    padding: 0
}

.styled-checkbox+label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 1px;
    width: 28px;
    height: 28px;
    background: #fff;
    border: 1px solid #333;
    border-radius: 4px;
    -moz-box-shadow: inset 2px 2px 2px rgba(0, 0, 0, .2);
    -webkit-box-shadow: inset 2px 2px 2px rgba(0, 0, 0, .2);
    box-shadow: inset 2px 2px 2px rgba(0, 0, 0, .2)
}

.styled-checkbox:hover+label:before {
    background: #70ad28
}

.styled-checkbox:focus+label:before {
    box-shadow: 0 0 0 3px rgba(0, 0, 0, .12)
}

.styled-checkbox:checked+label:before {
    background: #70ad28;
    -moz-box-shadow: inset 2px 2px 2px rgba(0, 0, 0, .2);
    -webkit-box-shadow: inset 2px 2px 2px rgba(0, 0, 0, .2);
    box-shadow: inset 2px 2px 2px rgba(0, 0, 0, .2)
}

.styled-checkbox:disabled+label {
    color: #b8b8b8;
    cursor: auto
}

.styled-checkbox:disabled+label:before {
    box-shadow: none;
    background: #ddd
}

.styled-checkbox:checked+label:after {
    content: "e";
    position: absolute;
    left: -1px;
    top: 0;
    font-size: 32px;
    font-family: complete-icons;
    text-transform: none
}

.sb-icon-search {
    width: 106px;
    height: 66px;
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    padding: 11px;
    margin: 0;
    text-align: center;
    cursor: pointer;
}

.sb-search-submit {
    background: #fff;
    opacity: 1;
    color: transparent;
    border: none;
    outline: 0
}

.sb-icon-search {
    color: #fff;
    background-color:var(--cu-slate);
    speak: none;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
}

.sb-icon-search:before {
    content: "t";
    font-family: complete-icons;
    font-size: 30px;
    line-height: 48px;
}

.modal {
    display: none;
    position: absolute;
    right: 0px;
    width: 600px;
    max-width: 100%;
    height: auto;
}

.shrink .modal {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    width: 600px;
    height: auto
}

.modal form {
    margin: 0;
    padding: 24px;
    background: var(--cu-light-grey);
}

.modal form input {
    border-bottom: 1px solid var(--cu-dark-blue);
    width: 70%;
    float: left
}

.modal form input.sb-search-submit {
    float: left;
    width: 30%;
    border-bottom: none;
    color: #fff;
    background: var(--cu-dark-blue);
}

.modal.visible {
    display: block
}

.modalheader {
    float: right;
    width: 106px;
    line-height: 50px;
    text-align: center;
    position: relative;
    height: 66px;
    box-sizing: border-box;
    z-index: 2;
    background-color: var(--cu-light-grey);
}

.modalheader a {
    position: absolute;
    width: 100%;
    height: 100%;
    display: block!important;
    
}

.modalheader:before {
    position: absolute;
    content: "e";
    font-family: complete-icons;
    top: 8px;
    left: 0;
    font-size: 48px;
    width: 106px;
    pointer-events: none;
    color: var(--cu-light-blue);
}

.modal_header a {
    position: absolute;
    top: 0;
    right: 0;
    text-decoration: none;
    color: #fff;
    font-weight: 700;
    display: block;
    padding: 0 20px;
    font-size: 16px;
    background: #555;
    height: 100%
}

a.js-open-search-modal {
    position: absolute;
    width: 106px;
    height: 72px;
    top: 0;
    right: 0px;
    z-index: 2;
    padding: 24px;
    color: #eee;
}

.vacancyform {
  float: right;
  width: 100%;
  max-width: 440px;
}

.jobsearch {
    float: left;
    left: 0;
    background-color:var(--cu-dark-blue);
    width: 100%;
    height: auto;
    margin-top: -151px;
    position: relative;
}

.halfcolumn .jobsearch {
    float: left;
    width: 100%;
    margin-top: -136px
}

.jobsearch form {
    margin: 0;
    padding: 24px
}

.jobsearch form input {
    border-bottom: 1px solid #fff;
    width: 85%;
    float: left;
    background-color: rgba(0, 0, 0, 0);
}

.jobsearch form input::-webkit-input-placeholder {
    color: #fff
}

.jobsearch form input:-ms-input-placeholder {
    color: #fff
}

.jobsearch form input::placeholder {
    color: #fff
}

.jobsearch form input.sb-search-submit {
    float: left;
    width: 15%;
    border-bottom: none;
    color: #fff;
    background-color:var(--cu-dark-blue);
    font-family: complete-icons;
    cursor: pointer;
    font-size: 32px;
}

.vacancyitem {
    float: left;
    width: 100%;
    margin-top: 48px;
    position: relative;
}

.vacancyheader {
    float: left;
    width: 100%;
}

.vaclocation {
    float: left;
    width: 100%;
    text-transform: uppercase;
    font-size: 22px;
}

.vacancyitemleft {
    float: left;
    width: 66.66666%;
    padding-right: 48px
}

.vacancyitemright {
    float: left;
    width: 33.333333%
}

.refanddate {
    padding: 24px 0;
    font-size: 18px;
    margin-bottom: 24px;
  
}



.vacancysmalldetails {
    float: left;
    width: 100%;
    padding: 0px;
    margin-bottom: 24px;
}

.vacancyitem h2 {
    font-weight: 600;
    font-size: 28px;
}

.vacancyitem left {
    float: left;
    width: 100%;
    padding: 60px 0
}

.vacdetail {
    float: left;
    width: 100%;
    padding: 4px 0;
    font-size: 17px;
}

.vacancyitemlist .vacancysmalldetails {
    float: left;
    width: 100%;
    padding: 0;
    /* background-color: #ddd */
}

.vacancyitemlist .refanddate {
    font-weight: 600;
    position: absolute;
    top: 16px;
    right: 16px;
    padding: 0;
    font-size: 20px;
}

.vacancyitemlist .vacdetail {
    float: left;
    width: 100%;
    padding: 8px;
    font-size: 14px;
    margin-bottom: 4px;
    background-color: #fff;
}

.jobdetailsleft {
    float: left;
    width: 30%;
    font-weight: 600
}

jobdetailsright {
    float: left;
    width: 70%;
    font-weight: 600
}

.vacancylistouter {
    float: left;
    width: 100%;
}

.vacancylistoutersimple {
    float: left;
    width: 100%;
    background-color: var(--cu-light-grey);
    margin-top: -48px;
    padding: 24px;
}


.vacancyitemlistsimple h3 {
  padding: 0px;
  font-size: 18px;
  text-transform: uppercase;
}

.vacancyitemlistsimple {
  padding: 0px;
  float: left;
  margin-bottom: 32px;
  padding-right: 48px;

}

.jobapplication {
    float: left;
    width: 100%;
    padding: 12px;
    background-color: var(--cu-slate);
    color: #fff;
}

.halfcolumn .vacancylistouter {
    float: left;
    width: 100%;
    padding: 24px;
    background-color: #f2f2f2;
    position: relative;
    margin-top: -48px;
    padding-top: 60px;
}

.halfcolumn .vacancylistouter h2 {
    padding-bottom: 32px;
    padding-top: 0
}

.halfcolumn .vacancylistouter .viewallvacs {
    position: absolute;
    top: 64px;
    right: 16px
}

.viewallvacs {
    position: absolute;
    right: 0;
    top: -48px;
    padding-right: 16px;
}

.vacancylistoutersimple .viewallvacs {
    position: relative;
   width: 100%;
   float: left;
    padding-right: 16px;
    margin-top: 48px;
}

.viewallvacs a {
    padding: 8px;
    position: relative;
    font-weight: 600;
}

.viewallvacs a:after {
    right: -16px;
    position: absolute;
    font-family: complete-icons;
    content: "c";
    top: 2px;
    font-size: 20px;
    text-transform: none
}

.halfcolumn .vacancylistouter .vacancyitemlist {
    padding: 16px;
    margin-bottom: 16px
}

.halfcolumn .vacancyitemlist .vacdetailsmall {
    font-weight: 600!important;
    padding-bottom: 8px
}

.vacancylistouter h4 {
    font-weight: 600;
    text-transform: uppercase;
    padding: 0
}

.smallvacancy {
    float: left;
    width: 100%;
    padding-bottom: 36px;
}

.newsblockthird .vacdetailsmall {
    padding-bottom: 8px;
}

.vacancyitemlist {
    float: left;
    width: 100%;
    padding: 40px 24px 40px 24px;
    background-color: var(--cu-light-grey);
    position: relative;
    margin-bottom: 24px;
}

.vacancyitemlist h2 {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 18px;
}


.detailslink {
    font-size: 18px;
    font-weight: 600;
    margin-top: 24px;
}


.newswhiteblock {
    float: left;
    width: 100%;
    background-color: #fff;


}

.archivesection {
  float: left;
  width: 100%;
  text-align: center;
  padding: 24px;
}


.archivesection ul li {
  display: inline-block;
  width: auto;
  padding: 16px;
}

.archivesection ul {
  display: inline-block;
}

.archivesection ul li ul {
  width: 100%;
  float: left
}

.newscategoryheading {
    float: left;
    width: calc(100% + -180px);
    font-weight: 600;
    background-color: var(--cu-light-blue);
    position: relative;
    padding: 0px 0px 20px 64px;
    color: #fff;
    position: relative;
    z-index: 1;
    margin-top: -48px;
}

.newscategoryheading.casestudy {
    float: left;
    width: calc(100% + -180px);
    font-weight: 600;
    background-color: var(--cu-dark-blue);
    position: relative;
    padding: 0px 0px 20px 64px;
    color: #fff;
    position: relative;
    z-index: 1;
    margin-top: -48px;
}

.newsharebanner {
    float: left;
    width: 100%;
    padding: 12px 0;
    font-weight: 600;
    background-color: #c8c8c8
}

.author,
.newsdate {
    float: left;
    padding: 0 0 16px 0
}

.sharenews,
.viewnews {
    float: left;
}

.viewnews {
    float: left;
    clear:both;
    width: 100%;
    margin-top: -20px;
    position: relative;
    z-index: 3;
}

.newsmaintitle {
  float: left;
  width: 100%;
  font-size: 22px;
  padding: 36px 0px 36px 0px;
}

.viewnews a {
    float: left;
    padding: 8px 16px 8px 32px;
    background-color:var(--cu-orange);
    color: #fff;
}


.viewnews.casestudy {
    float: left;
    padding: 8px 16px 8px 16px;
    background-color:var(--cu-slate);
    color: #fff;
    width: auto;
    border-left: 8px solid var(--cu-green);
    text-transform: uppercase;
}

.sharenews {
    float: left;
    padding: 8px;
    position: absolute;
    margin-left: 32px;
    color: #fff;
    bottom: 8px;
    right: 16px;
}

.shareword {
    float: left;
    /* border: 1px solid #666; */
    /* background-color: #666; */
    color: #fff;
    font-size: 14px;
}

.sharefacebook,
.sharelinkedin,
.sharetwitter {
    float: left;
    color: #fff;
    width: 20px;
    margin-left: 8px;
}

span.sharefacebook a,
span.sharelinkedin a,
span.sharetwitter a {
    float: left;
    color: #bdbdbd;
    width: 16px;
    height: 16px;
    position: relative;
    margin-bottom: 12px;
}

span.sharefacebook a:before,
span.sharelinkedin a:before,
span.sharetwitter a:before {
    content: "";
    color: #bdbdbd;
    width: 32px;
    height: 32px;
    position: absolute;
    border-radius: 50%;
    top: -4px;
    line-height: 1;
    font-family: complete-icons;
}

span.sharefacebook a:after,
span.sharelinkedin a:after,
span.sharetwitter a:after {
    content: "g";
    font-family: complete-icons;
    color: #bdbdbd;
    width: 32px;
    height: 32px;
    position: absolute;
    top: 0;
    font-size: 24px;
    line-height: 1;
    text-align: center
}

span.sharefacebook a:after {
    content: "g"
}

span.sharetwitter a:after {
    content: "r"
}

span.sharelinkedin a:after {
    content: "h"
}

.newsdetails {
    float: left;
    padding: 8px 0px;
    width: 100%;
}

.newsdetailsright {
    float: right;
    padding: 4px
}

.newscategoryheading span {
    /* font-weight: 600; */
    /* text-transform: uppercase; */
    /* font-size: 22px; */
    /* color: #fff; */
}

.greentext {
  color: var(--cu-green)
}

.sitemapleft,
.sitemapright {
    width: 100%;
    float: left
}

.sitemapright .sitemaphtml a {
    width: 100%;
    font-size: 13px;
    margin: 0;
    padding: 0
}

.sitemapright .sitemaphtml li {
    margin: 0;
    padding: 0
}

ul.sitemaphtml li {
    margin-left: 0;
    list-style: none;
    margin-top: 4px
}

ul.sitemaphtml {
    float: left;
    width: 100%;
    padding-bottom: 36px;
}

ul.sitemaphtmltwo {
    float: left;
    width: 100%;
    padding-bottom: 36px;
}

.pagename {
    color: #70ad28;
    font-size: 16px;
    float: left;
    width: 100%;
    padding-top: 14px
}

.pageurl a {
    
    font-size: 16px;
    float: left;
    width: 100%;
    padding-bottom: 0;
}

.pagename {
    /* font-size: 18px; */
    /* font-weight: 600; */
    /* color: #0d2d5f; */
}

ul.sitemaphtml li {
    font-weight: 400;
    font-size: 16px;
    width: 100%;
    padding-bottom: 24px
}

ul.sitemaphtml ul li {
    font-weight: 400;
    font-size: 16px;
    width: 100%;
    border-bottom: none
}

ul.sitemaphtml li {
    margin-left: 0;
    list-style: none;
    margin-bottom: 32px;

}


ul.sitemaphtml li:last-child {
    margin-left: 0;
    list-style: none;
    padding-bottom: 36px
}



ul.sitemaphtml li ul li {
    margin-left: 0;
    list-style: none;
    margin-top: 0;
    padding-bottom: 0
}

ul.sitemaphtml ul li ul li a {
    font-size: 14px
}

ul.sitemaphtml ul li ul li ul li a {
    font-size: 13px;
    text-transform: uppercase
}

.testimonialarea {
    padding: 0px 64px;
    background-color: #fff;
    float: left;
    width: 100%;
    padding-bottom: 140px

}

.testimonialareahome {
    background-color: #fff;
    float: left;
    width: 100%
}

.testimonialhome {
    float: left;
    color: #fff;
    position: relative;
    min-height: 500px;
    width: 100%;
    background-size: cover;
}


.testimonialhome:after {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgb(0 49 67 / 0.3);
    top: 0px;
    left: 0px;
    content: "";
}

.insettest {
    float: right;
    color: #fff;
    position: relative;
    background-color:var(--cu-slate);
    width: 40%;
    padding: 80px;
    padding-bottom: 40px;
    font-style: italic;
    margin-top: -36px;
    z-index: 1;
}


.insettestsmall {
    float: right;
    color: #fff;
    position: relative;
    background-color:var(--cu-slate);
    width: 80%;
    padding: 80px;
    padding-bottom: 40px;
    font-style: italic;
    z-index: 1;
    margin-bottom: 12px;
}



.insettestsmall:nth-child(1) {
    margin-top: -72px;
}


.testimonialdesc {
        line-height: 30px;
        font-size: 21px;
    }

    .testperson {
       font-style: normal;
       font-size: 14px;
       font-weight: 600;
       margin-top: 24px;
       line-height: 20px;
    }

    .testcompany {
       font-style: normal;
       font-size: 14px;
       font-weight: 300;
    }



.insettest:before {
  content:"u";
    float: right;
    font-family: complete-icons;
    color: #fff;
    position: absolute;
    background-color:var(--cu-green);
padding: 12px;
  top: 0px;
  left: 0px;
    font-style: normal;
    font-size: 36px;
    height: 48px;
    width: 48px;
    line-height: 44px;
    font-weight: 600;
    text-align: center;



}


.insettestsmall:before {
  content:"u";
    float: right;
    font-family: complete-icons;
    color: #fff;
    position: absolute;
    background-color:var(--cu-green);
padding: 12px;
  top: 0px;
  left: 0px;
    font-style: normal;
    font-size: 36px;
    height: 48px;
    width: 48px;
    line-height: 44px;
    font-weight: 600;
    text-align: center;



}








.logolist {
    float: left;
    width: 100%;
    min-height: 400px
}

.logolist h2 {
    float: left;
    width: 100%;
    font-size: 28px;
    padding-bottom: 16px
}

.logolist .ind_logo {
    float: left;
    width: 24%;
    margin: .5%
}

.logolist .ind_logo img {
    float: left;
    width: 100%;
    padding: 12px
}

#webdesigner {
    padding-top: 34px;
    float: left;
    width: 100%
}

.usefullinks_area {
    width: 100%;
    height: auto;
    margin-right: 1%;
    overflow: visible;
    padding: 8px;
    background-color: #eee;
    color: #333;
    margin-top: 12px;
    float: left
}

.weblinksinner,
.weblinksouter {
    width: 100%;
    display: block;
    height: auto
}

.weblinksouter {
    float: left;
    padding: 0;
    margin: 4px 4px 4px 0;
    background-color: #fff
}

.weblinksouter a {
    float: right;
    color: #eee;
    padding: 4px 12px;
    margin-top: 4px;
    background-color: #e6007e
}

.nuvo_textblock_right
 {
    width: 66.6666666666%;
    float: left;
    padding: 0px 59px 0px 54px;
    position: relative;
    z-index: 1;
    padding-top: 16px;
}

.contactintro .nuvo_textblock_right
 {

    padding: 0px 64px 0px 0px;
    padding-top: 32px;
}


.nuvo_textblock_left {
  padding-top: 16px;
  width: 33.33333333%;
  float: left;
}

.nuvo_textblock_left h1 {
   
    font-size: 30px;
    font-weight: 600;
}

.nuvo_textblock_left h2 {
   
    font-size: 30px;
    font-weight: 600;
}




.aboutus h3 {
   
    font-size: 30px;
    font-weight: 600;
}


.twothirds
 {
    width: 66.6666666666%;
    float: left;
    padding: 0px 64px;
    position: relative;
    z-index: 1;
}

.careers .twothirds
 {
    width: 66.6666666666%;
    float: left;
    padding: 0px 0px;
    position: relative;
    z-index: 1;
}

.onethird {
    width: 33.3333333333%;
    float: left;
}

.halfcolumn {
    float: left;
    width: 50%
}

.halfcolumn.leftside {
   padding-right: 32px;
}

.fullcolumn {
    float: left;
    width: 100%;
    padding: 8px
}

.quartercolumn {
    width: 25%;
    float: left;
    padding: 8px;
    text-align: center
}

.weblinksinner {
    float: left;
    padding: 8px
}

.weblinkimage {
    float: left;
    width: 100%
}

.weblinkimage img {
    float: left;
    max-width: 300px
}

.weblinksdescription {
    float: left;
    width: 70%;
    padding-right: 12px;
    display: block;
    height: auto;
    color: #666
}

form {
    margin-top: 32px;
    float: left
}



#hoverlinkarea {
    width: 100%;
    padding: 0;
    text-align: center;
    max-width: 1180px
}

.divisionband {
    float: left;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right center;
    text-align: center;
    padding: 48px 12px;
    background-color: #0d2d5f
}

.slidingimageband {
    width: 100%;
    float: left;
    padding: 48px 0;
    top: 0;
    height: 100%;
    text-align: center
}

.mainform {
    display: inline-block;
    width: 100%;
    max-width: 1080px;
    padding: 16px;
    padding-bottom: 64px;
    background-color: rgba(256, 256, 256, .1);
    border: 1px solid #3ea8c0;
    position: relative;


}




 

.clearform {
    display: inline-block;
    width: 100%;
    padding: 8px;
    background-color: #333;
    color: #3ea8c0;
    max-width: 200px;
    position: absolute;
    bottom: 0;
    right: 0
}

#form2_shipping_method {
    float: left;
    width: 100%;
    padding: 16px;
    background-color: #fff;
    margin-bottom: 16px;
    border-bottom: 1px solid #ccc;
    display: none
}

#form1_shipping_method {
    float: left;
    width: 100%;
    padding: 16px;
    background-color: #fff;
    margin-bottom: 16px;
    border-bottom: 1px solid #ccc;
    display: none
}

form .formitem {
    display: block;
    text-align: center;
    width: auto;
    display: inline-block;
    width: 33%;
    font-size: 20px
}

form label {
    display: block;
    width: auto;
    float: left;
    padding: 8px 0;
    font-size: 16px;
    width: 100%
}

.formitem input[type=submit] {
    -webkit-appearance: none;
    border-radius: 0;
    float: left;
    color: #fff;
    padding: 8px;
    margin-top: 0;
    margin-left: 0;
    border: 0;
    background-color: #3ea8c0;
    font-size: 20px;
    border-radius: 4px;
    color: #333;
    width: 100%
}

.formerror {
    background-color: #70ad28;
    display: inline-block;
    padding: 4px;
    border-radius: 4px;
    margin-bottom: 12px;
    color: #fff
}

.select-style select {
    padding: 5px 8px;
    width: 130%;
    border: none;
    box-shadow: none;
    background: 0 0;
    background-image: none;
    -webkit-appearance: none
}

.select-style select:focus {
    outline: 0
}

*,
html {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
  
}


form {
    float: left;
    width: 100%;
    padding-bottom: 32px;
    margin-top: 32px
}

.newformarea {
    float: left;
    width: 100%;
    padding: 32px;
    background-color: #fff;
    margin-top: 32px
}

em.keyword {
    padding: 4px;
    background-color: #ef7d00;
    color: #fff;
    border-radius: 4px
}

.pageresult {
    border-bottom: 1px solid #ddd;
    padding-bottom: 4px;
    margin-bottom: 4px
}

.pageroute {
    padding-bottom: 4px;
    margin-bottom: 24px;
    color: #039c44
}



.headercta {
    width: 100%;
    float: left;
    text-align: center;
    padding: 0;
    color: #eee;
    padding-bottom: 32px
}

.ctalineone,
.ctalinetwo {
    display: inline-block;
    font-size: 18px;
    padding-left: 12px
}

.dancetel {
    position: absolute;
    right: 72px;
    top: 80px;
    border-radius: 4px;
    padding: 4px 8px;
    padding-left: 44px;
    height: 36px;
    font-family: Orbitron, sans-serif
}

.dancetel a {
    position: relative;
    display: inline-block;
    border-radius: 4px;
    padding: 6px 8px;
    padding-left: 44px;
    background-color: #029c44;
    height: 36px;
    font-family: Orbitron, sans-serif
}

.dancetel a:before {
    top: 0;
    left: 0;
    width: 36px;
    height: 100%;
    content: "T";
    position: absolute;
    line-height: .8;
    color: #fff;
    border-radius: 0;
    padding: 0;
    background-color: #727272;
    border-radius: 4px;
    line-height: 40px
}

.infolink:before {
    left: 0;
    font-size: 20px;
    content: "H";
    position: absolute;
    font-family: complete-icons;
    color: #7ab44d
}

.da-thumbs li a div span,
.grid figure button,
.person,
.stuff h1 {
    text-transform: uppercase
}

.rslides1_nav,
.rslides2_nav,
.rslides3_nav {
    -webkit-tap-highlight-color: transparent;
    overflow: hidden
}

.rslides1_nav:focus,
.rslides2_nav:focus,
.rslides3_nav:focus,
button:focus {
    outline: 0
}

.da-thumbs li a,
.grid figure,
.productbox,
.rslides,
.rslides1_nav,
.rslides2_nav,
.rslides3_nav,
.rslides_tabs a {
    overflow: hidden
}

.da-thumbs,
.rslides,
.rslides_tabs,
ol,
ul {
    list-style: none;
    width: 100%
}

.da-thumbs {
    width: 100%;
    position: relative;
    margin: 20px auto;
    padding: 0
}

.da-thumbs li {
    float: left;
    margin: 0;
    background: #fff;
    padding: 1px;
    position: relative;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    width: 33.250725250725250725250725250725%
}

.websitelaunchlink a {
    font-size: 16px;
    padding: 4px;
    padding-left: 8px;
    padding-right: 8px;
    background-color: #cca952;
    border-radius: 16px;
    position: absolute;
    top: 16px;
    right: 0
}

.da-thumbs li a,
.da-thumbs li a img {
    display: block;
    position: relative
}

.da-thumbs li a div {
    position: absolute;
    background: #250725;
    background: rgba(75, 75, 75, .7);
    width: 100%;
    height: 100%
}

.da-thumbs li a div span {
    display: block;
    padding: 10px 0;
    margin: 40px 20px 20px;
    color: rgba(255, 255, 255, .9);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
    border-bottom: 1px solid rgba(255, 255, 255, .5);
    box-shadow: 0 1px 0 rgba(0, 0, 0, .1), 0 -10px 0 rgba(255, 255, 255, .3)
}

.expander,
.headerbutton {
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
    -moz-box-shadow: 0 1px 1px rgba(000, 000, 000, .5), inset 0 1px 1px rgba(255, 255, 255, .5);
    -webkit-box-shadow: 1px 2px 2px rgba(000, 000, 000, .5), inset 0 1px 1px rgba(255, 255, 255, .5)
}

.noshow {
    display: none
}

.row {
    padding: 12px;
    width: 100%;
    float: left
}

.headerbutton {
    background: #eee;
    background: -moz-linear-gradient(top, #fff 0, #ebebeb 50%, #dbdbdb 50%, #b5b5b5);
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(.5, #fff), color-stop(.5, #fff), to(#ccc));
    border-radius: 16px;
    box-shadow: 0 1px 1px rgba(000, 000, 000, .5), inset 0 1px 1px rgba(255, 255, 255, .5);
    padding: 4px;
    font-size: 14px;
    line-height: 24px;
    height: 30px;
    float: left;
    width: 84px
}

.clienttext {
    float: right;
    padding-left: 4px;
    padding-right: 4px
}

#cookie-bar {
    background: #111;
    padding: 4px;
    height: auto;
    line-height: 24px;
    color: #eee;
    text-align: center;
    padding: 8px
}

#cookie-bar.fixed {
    position: fixed;
    top: 0;
    z-index: 10;
    left: 0;
    width: 100%
}

#cookie-bar.fixed.bottom {
    bottom: 0;
    top: auto
}

#cookie-bar p {
    margin: 0;
    padding: 0
}

#cookie-bar a {
    color: #fff;
    display: inline-block;
    border-radius: 3px;
    text-decoration: none;
    padding: 0 6px;
    margin-left: 8px
}

#cookie-bar .cb-enable {
    background: #70ad28
}

#cookie-bar .cb-enable:hover {
    background: #5c8f20
}

#cookie-bar .cb-disable {
    background: #900
}

#cookie-bar .cb-disable:hover {
    background: #b00
}

#cookie-bar .cb-policy {
    background: #2b2b2b;
    color: #8a8a8a
}

#cookie-bar .cb-policy:hover {
    background: #ef7d00;
    color: #eee
}

.headerbutton.icon-locked:before {
    content: "\4b";
    font-size: 20px
}

.lightgallery {
    display: inline-block;
    width: 100%;
    max-width: 1180px;
    margin-top: 16px
}

.ind_photo {
    float: left;
    width: 25%;
    position: relative
}

.ind_photo a {
    float: left;
    width: 100%;
    padding: 8px
}

#html5-videos .imagetitle,
.lightgallery .imagetitle {
    position: absolute;
    bottom: 8px;
    padding: 8px;
    width: 100%;
    color: #fff;
    font-size: 12px;
    pointer-events: none
}

.lightgallery a img {
    float: left;
    width: 100%
}

.imageGallery1 a {
    float: left;
    width: 16.6666666667%
}

.imageGallery1 a img {
    float: left;
    width: 100%
}

#html5-videos .ind_photo a:after,
.lightgallery .ind_photo a:after {
    content: "\e311";
    font-family: lg!important;
    position: absolute;
    right: 8px;
    bottom: 8px;
    font-size: 24px;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    color: #fff;
    border-radius: 50%;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .7)
}

.ind_photo a:after {
    content: "\e311";
    font-family: lg!important;
    position: absolute;
    right: 4px;
    bottom: 4px;
    font-size: 24px;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    color: #fff;
    border-radius: 50%;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .7)
}

.clicked .expander,
.expander {
    background: -moz-linear-gradient(top, #fff 0, #ebebeb 50%, #dbdbdb 50%, #b5b5b5);
    padding: 4px;
    font-size: 14px;
    line-height: 24px;
    height: 30px;
    float: left;
    width: 84px;
    bottom: 20px;
    right: 4px;
    position: absolute;
    cursor: pointer
}

.productgallery .lightgallery {
    margin: 0;
    float: left
}

.expander {
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(.5, #fff), color-stop(.5, #fff), to(#ccc));
    border-radius: 16px;
    box-shadow: 0 1px 1px rgba(000, 000, 000, .5), inset 0 1px 1px rgba(255, 255, 255, .5);
    color: #250725;
    text-align: center
}

.clicked .expander {
    background: -webkit-gradient(linear, left top, left bottom, from(#ff9f8a), color-stop(.5, #ff3a0f), color-stop(.5, #cca952), to(#d24729));
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
    border-radius: 16px;
    -moz-box-shadow: 0 1px 1px rgba(000, 000, 000, .5), inset 0 1px 1px rgba(255, 255, 255, .5);
    -webkit-box-shadow: 1px 2px 2px rgba(000, 000, 000, .5), inset 0 1px 1px rgba(255, 255, 255, .5);
    box-shadow: 0 1px 1px rgba(000, 000, 000, .5), inset 0 1px 1px rgba(255, 255, 255, .5);
    color: #fafafa;
    text-align: center
}

.expander:before {
    content: "MORE";
    top: 4px;
    left: 0;
    width: 100%;
    position: absolute
}

.clicked .expander:before {
    content: "LESS"
}

#navigationarea {
    float: right;
    display: block;
    width: 100%;
    position: relative;
    overflow: visible;
    z-index: 1;
    background-color: var(--cu-slate-trans-zero);
    transition: all .4s ease-in-out
}

.indlogo {
    padding-right: 8px;
    width: auto;
    display: inline-block;
    margin-bottom: 12px;
}

.logoimage {
    float: left;
    width: 100%;
    clear: both
}

.logocaption {
    float: left;
    clear: both;
    text-align: center;
    font-size: 10px;
    width: 100%;
}

.indlogo img {
    /* display: inline-flex; */
    width: auto;
    margin-bottom: 2px;
    height: 64px;
}

.homepagelinksarea {
    float: left;
    width: 100%
}

.largehoverlinks {
    text-align: center;
    float: left;
    width: 32.3333333333%;
    padding: 12px;
    border: 1px solid #414141;
    background-color: rgba(41, 41, 41, .86);
    padding-bottom: 48px;
    position: relative;
    margin: .5%
}

.largehoverlinks a {
    float: left;
    width: 100%
}

.linkimageholder {
    float: left;
    width: 100%;
    pointer-events: none
}

.linkimage {
    width: 220px;
    border: 3px solid #039c44;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    overflow: hidden;
    background-color: #fff;
    transition: all .4s ease-in-out
}

.linkimage img {
    float: left
}

.linkdesc,
.linkinfo,
.linkname,
.moreinfo {
    float: left;
    width: 100%;
    color: #fff;
    padding: 12px 0
}

.moreinfo {
    position: absolute;
    bottom: 12px;
    padding: 12px;
    width: 100%;
    color: #fff
}

.moreinfo span {
    padding: 12px;
    width: 100%;
    background-color: #029c44
}

.linkname {
    float: left;
    width: 100%;
    font-family: Orbitron, sans-serif;
    font-size: 24px;
    text-transform: uppercase
}

.linkdesc {
    float: left;
    width: 100%
}

.largehoverlinks .linkimage:after {
    position: absolute;
    width: 85%;
    height: 85%;
    left: 50%;
    top: 50%;
    z-index: 2;
    border: 200px solid #c8006e;
    background-color: rgba(256, 256, 256, 0);
    border-radius: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
    transform: translateY(-50%) translateX(-50%) scale(1);
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
    transform: translateY(-50%) translateX(-50%) scale(1);
    transition: all .4s ease-in-out
}

form {
    padding: 0;
    margin-top: 16px;
    float: left;
    width: 100%
}

.headingband {
    float: left;
    width: 100%;
    background-size: 800px;
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    background-position: right -400px top -90px;
    padding: 0 0;
    text-align: center;
    padding: 0 12px
}

#lightgallery a:after {
    content: "o";
    font-family: SocialMedia!important;
    position: absolute;
    right: 8px;
    bottom: 8px;
    font-size: 24px;
    width: 24px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    color: #fff;
    border-radius: 50%;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .7)
}

#lightgallery a {
    float: left;
    position: relative;
    width: 19%;
    border: 8px solid #000;
    margin: .5%
}

#lightgallery a img {
    float: left;
    position: relative;
    width: 100%
}

strong {
    font-weight: 600
}

div.map {
    display: block;
    width: 100%;
    height: 480px
}

.cmsmap {
    width: 100%;
    height: 300px
}

.cmsmap img {
    max-width: none
}

.google-thin {
    float: left;
    height: 480px;
    width: 100%;
    overflow: hidden
}

.google-thin div.cmsmap {
    width: 100%!important;
    float: left
}

.timetablearea h2 {
    text-align: center;
    background-color: #e30413;
    width: auto;
    min-width: 200px;
    color: #eee
}




.iconlinks {
    float: left;
    background-color: #fff;
    width: 100%
}

.iconlink {
    float: left;
    width: 33%;
    text-align: center;
    padding: 24px 0
}

.iconlink:nth-child(1) {
    border-top: 2px dotted #fff;
    border-left: 2px dotted #fff;
    border-right: 2px dotted #fff;
    border-bottom: 2px dotted #009fe3
}

.iconlink:nth-child(2) {
    border-top: 2px dotted #fff;
    border-left: 2px dotted #009fe3;
    border-right: 2px dotted #009fe3;
    border-bottom: 2px dotted #009fe3
}

.iconlink:nth-child(3) {
    border-top: 2px dotted #fff;
    border-left: 2px dotted #fff;
    border-right: 2px dotted #fff;
    border-bottom: 2px dotted #009fe3
}

.iconlink:nth-child(4) {
    border-top: 2px dotted #fff;
    border-left: 2px dotted #fff;
    border-right: 2px dotted #fff;
    border-bottom: 2px dotted #fff
}

.iconlink:nth-child(5) {
    border-top: 2px dotted #fff;
    border-left: 2px dotted #009fe3;
    border-right: 2px dotted #009fe3;
    border-bottom: 2px dotted #fff
}

.iconlink:nth-child(6) {
    border-top: 2px dotted #fff;
    border-left: 2px dotted #fff;
    border-right: 2px dotted #fff;
    border-bottom: 2px dotted #fff
}

.iconimage {
    float: left;
    width: 100%;
    text-align: center;
    padding: 0 0;
    text-align: center
}

#socialmedia {
    position: relative;
    float: right;
    text-align: center;
    padding: 16px 0px;
    background-color:var(--cu-light-blue);
    height: 56px;
    width: 132px;
}

#socialmedia a {
    display: inline-block;
    margin-left: -4px;
}

#socialmedia i {
    width: 28px;
    height: 28px;
    display: block;
    font-size: 28px;
    top: 0;
    /* padding: 2px; */
    text-align: center;
    cursor: pointer;
    color: #fff;
}

#socialmedia i {
    color: #bdbdbd
}

#socialmedia i:hover {
    color: #eee
}

#relatedpages {
    float: right;
    margin-top: 16px;
    width: 100%;
    background-color:var(--cu-light-blue);
    margin-top: -148px;
    position: relative;
    z-index: 1;
}

#relatedpages ul {
    float: left;
    padding-top: 16px;
    padding-bottom: 32px;
    width: 100%;
    padding-left: 32px;
    padding-right: 70px;
}

#relatedpages h3 {
    padding-bottom: 12px;
    color: #fff;
    font-size: 18px;
    
    text-transform: uppercase
}

#relatedpages li {
    width: 100%;
    margin: 0;
    float: left
}

#relatedpages li a {
    display: block;
    width: 100%;
    color: #fff;
    padding: 8px 8px;
    font-size: 14px;
    border-bottom: 1px solid rgba(84, 154, 232, 0.85);
}

#relatedpages li.current a {
    background-color: #0061d0;
}

.internalpagelinks {
    float: left;
    width: 100%
}

.internalpagelinks a {
    width: auto;
    display: inline-block;
    padding: 12px;
    background-color: #029c44;
    -moz-border-radius: 4px;
    color: #fafafa
}

.externalpagelinks {
    float: left;
    width: 100%
}

.thirdcolumn .externalpagelinks {
    float: left;
    width: 100%;
    position: absolute;
    bottom: 8px
}

.externalpagelinks a {
    width: auto;
    display: inline-block;
    padding: 6px 12px 6px 12px;
    background-color: #e5edec;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    /* color: #fafafa; */
    text-align: center;
}

.vacancydescriptiontwo {
  margin-top: 16px;
  border-top: 1px solid #ccc;
  padding-top: 16px;
}

.vacancydescriptiontwo {
  margin-top: 16px;
  border-top: 1px solid #ccc;
  padding-top: 16px;
}

.mainarticle ul,
.contentbreak ul,
.vacancydescription ul {
    display: inline-block;
    text-align: left;
    /* padding-top: 12px; */
    padding-bottom: 12px;
}
.mainarticle ul li,
.contentbreak ul li,
.vacancydescription ul li {
    position: relative;
    padding-left: 16px;
}

.mainarticle ul li:before,
.contentbreak ul li:before,
.vacancydescription ul li:before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 8px;
    background-color: #70ad28;
}

.noshow {
    display: none
}

.show {
    display: block
}

#slider-wrapper:after,
.rslides li {
    -webkit-backface-visibility: hidden
}

::-moz-selection {
    color: #d5d5d5
}

::selection {
    color: #a9a9a9;
}

::-moz-selection {
    background: #d5d5d5
}

::selection {
    background: #d5d5d5
}

.usefulforms {
    display: block;
    clear: both;
    float: left;
    width: 100%;
    margin-bottom: 16px;
}

.usefulforms .box {
    float: left;
    width: 100%
}

.usefulforms a:after {
    position: absolute;
    top: -1px;
    right: -1px;
    content: "a";
    font-family: complete-icons;
    font-size: 22px;
    height: 22px;
    width: 22px;
    padding: 6px;
    background-color: #fff;
    color: #4d4d4d;
    border: 1px solid #ddd;
    line-height: 1
}

.usefulforms a {
    width: 100%;
    background-color: #ededed;
    position: relative;
    margin-bottom: 4px;
    color: #172344;
    text-indent: 0;
    border: 1px solid #dcdcdc;
    float: left;
    line-height: 34px;
    text-align: left;
    overflow: visible;
    text-decoration: none;
    background-size: 40px;
    padding-right: 40px;
}

.filename {
    float: left;
    padding: 0px 12px;
    /* color: #fff; */
}

.filesize {
    float: left;
    border-left: 1px solid #dcdcdc;
    padding-left: 8px;
    padding-right: 8px;
    font-size: 11px;
    color: #333;
}

#logoarea {
      top: 8px;
      left: 64px;
      position: absolute;
      opacity: 1;
      transition: all .4s ease-in-out;
}

#logoarea img {
    float: left;
    width: 200px;
}

#strapline {
    float: right;
    padding: 16px;
    height: 56px;
    background-color:var(--cu-dark-blue);
    color: #eee;
    font-size: 19px;
    letter-spacing: 0.8px;
}

footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer p {
    margin: 0;
    padding-top: 8px;
    padding-bottom: 8px;
    font-weight: 300;
    float: left;
    clear: both;
    width: 100%;
    font-size: 12px;
}



#footercolumns h3,
.contentbreak h3 {
    font-size: 20px;
}

.thankyou h1 {
    padding-top: 0;
    padding-bottom: 0;
    font-size: 32px
}

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

.picturelinktext {
    text-align: center;
    padding: 32px 140px;
    color: #eee
}

.picturelinktext h3 {
    font-weight: 300;
    font-size: 28px;
    text-transform: uppercase
}

#picturenav {
    display: inline-grid;
    grid-gap: 80px;
    row-gap: 80px;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-flow: row;
    padding: 40px 0;
    text-align: left;
}




#picturenavservices {
    display: inline-grid;
    grid-gap: 32px;
    grid-row-gap: 64px;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: row;
    padding: 40px 0;
    text-align: left;
}

#picturenavabout {
    display: inline-grid;
    grid-gap: 32px;
    row-gap: 96px;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-flow: row;
    padding: 40px 0;
    text-align: left;
    margin-top: 60px;
}

.servicesimagelink {
  position: relative;
  background-color: var(--cu-light-grey)
}

.aboutimagelink {
  position: relative;
}

.servicesimagelinksmall {
  position: relative;
  margin-left: 32px;
  height: calc(100%);
padding-bottom: 24px;
  background-color: var(--cu-light-grey);
}


.servicesimageareasmall {
  width: calc(45% + 32px);
  margin-left: -32px;
  float: left;
}

.aboutimagelink {
  position: relative;
  margin-right: 0px;
  height: calc(100% + 0px);
  background-color: var(--cu-dark-blue);

}


.aboutimagelink:after
 {
  position: absolute;
  background-color: var(--cu-slate);
  width: 48px;
  height: 48px;
  content: "x";
  font-family: complete-icons;
  padding: 8px;
  overflow: hidden;
  text-align: center;
  right: 0px;
  bottom: 0px;
  color: #fff;
  font-size: 32px;
  line-height: 48px;
  pointer-events: none;
 }



.servicesimagelink:after,
.servicesimagelinksmall:after {
  position: absolute;
  background-color: var(--cu-orange);
  width: 24px;
  height: 24px;
  content: "x";
  font-family: complete-icons;
  padding: 8px;
  overflow: hidden;
  text-align: center;
  right: 0px;
  bottom: 0px;
  color: #fff;
  font-size: 16px;
  line-height: 24px;
 }

.servicesimagearea {
  padding-right: 32px;
  margin-top: -32px;


}


.servicesimagearea {
  padding-right: 32px;
  margin-top: -32px;


}


.casestudieswrapper {
    float: left;
    width: 100%;
    padding: 48px 0;
    line-height: 1.5;
    position: relative;
    z-index: 1;
    padding-bottom: 80px;
}

.casestudieswrapper .navigationintro h3 {
   color: var(--cu-dark-blue);
}


.casestudiesarea {
    display: inline-grid;
    grid-gap: 32px;
    row-gap: 96px;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: row;
    padding: 40px 0;
    text-align: left;
    margin-top: 60px;
    width: 100%;
}

.casestudiesarea a {
   
    width: 100%;
    float: left;
    height: 100%;
}



.picturenavimageabout{
  width: calc(100% + -64px);
  margin-left: 0px;
  float: right;
  position: relative;
  margin-top: -64px;
}



.servicestext {
    padding: 16px 16px 60px 16px;
    font-size: 20px;
    font-weight: 600;
}

.servicestextsmall {
    padding: 12px;
    font-size: 20px;
    font-weight: 600;
    width: calc(55%);
    float: left;
}

.servicestext span {
    font-weight: 600;
}

.servicestextsmall span {
    font-weight: 600;
    font-size: 17px;
}

#picturenavservicessmall {
    display: inline-grid;
    grid-gap: 48px;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-flow: row;
     padding: 32px 0px;
     width: 100%;
}




.imagelink {background-color: var(--cu-dark-blue);padding-bottom: 80px;position: relative;}

#picturenavsmall .imagelink {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #3f3f3f
}

#picturenavsmall .picturenavimagearea {
    width: 33.33333%;
    float: none
}



.picturenavtext {
    width: 100%;
    float: left;
    margin-top: -44px;


}

.picturenavtextabout {
    width: 100%;
    float: left;
    padding: 24px 24px 60px 64px;
    background-color: var(--cu-dark-blue);
    color: #fff;
}


.picturenavdesc {
    width: 100%;
    float: left;
    padding: 16px 64px;
    padding-bottom: 0px;
    color: #fff;
    background-color: var(--cu-dark-blue);
}


.picturenavdesc h3 {
    color: #fff !important;
    font-size: 22px;
}

.picturenavdescabout {
    width: 100%;
    float: left;
    padding-bottom: 0px;
    color: #fff;
    background-color: var(--cu-dark-blue);
}


.learnmore {
    position: absolute;
    padding: 0px 30px 12px 64px;
    font-weight: 600;
    color: #fff;
    background-color: var(--cu-dark-blue);
    bottom: 16px;
    line-height: 1;
}

.learnmore:after {
    position: absolute;
    top: 0px;
    content: "x";
    right: 0px;
    font-family: complete-icons;
}

.picturenavtext span {
    width: auto;
    padding: 4px 12px;
    font-weight: 700;
    height: 44px;
    background-color: var(--cu-green);
    font-size: 24px;
    color: #fff;
    float: left;


}

.picturenavimagearea {
    float: left;
    width: 100%
}

.breadcrumbs {
    width: 100%;
    padding-bottom: 8px;
    float: left;
}

.breadcrumbs {
    width: 100%;
    padding-bottom: 32px;
    float: left;
    font-weight: 300;
}

.breadcrumbs ul {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}



.breadcrumbs a {
    padding-right: 8px;
    padding-left: 8px;
    position: relative;
    font-size: 12px;
}

.breadcrumbs a:after {
    content: "|";
    position: absolute;
    right: 0
}

.breadcrumbs li:last-child a:after {
    content: none;
    position: absolute;
    right: 0
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-top: 12px
}

.video-container embed,
.video-container iframe,
.video-container object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.vacancyformarea {
    float: left;
    clear: both;
    padding: 12px;
    width: 100%;
    background-color: #212a29;
    color: #eee;
    background-repeat: repeat;
    background-position: left 00px top 0;
    background-size: 30px
}

.captioncontainer {
    width: 100%;
    margin-left: 0
}

.exptime,
.fstop,
.iso {
    display: inline-block;
    padding: 4px;
    margin-left: -2px;
    margin-right: -2px;
    background-color: #1a1a1a;
    border-left: 1px solid #585858;
    font-size: 12px
}

.captionarea {
    margin-left: auto;
    margin-right: auto;
    max-width: 1080px;
    height: 100%;
    width: 100%;


}


.captionblock {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    bottom: 160px;
}



.captioncontainer {
    max-width: 1440px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    align-items: baseline;
    display: inline-grid;
    grid-gap: 24px;
    grid-template-columns: repeat(2, 1fr);
}



.caption1 {
    width: 100%;
}




    .caption1 span {
    font-size: 24px;
}


.maincontent.archive
.pagecaptions {
    margin-top: -124px;
    width: 100vw;
     float: left;
     width: 100%;


}

.pagecaptions {
    margin-top: -172px;
    width: 100vw;
     float: left;
     width: 100%;


}

.twothirds .pagecaptions {
    margin-bottom: 24px;


}



.aboutus .pagecaptions {
    margin-top: -110px;
    float: left;
}

.captionone,
.captiontwo,
.captionthree,
.captionfour,
.captionfive {
    font-weight: 600;
    position: relative;
    display: block;
    float: left;
    clear: both;
}

.captionone span,
.captiontwo span,
.captionthree span,
.captionfour span,
.captionfive span {
    background-color:var(--cu-light-blue);
    font-size: 44px;
    padding: 4px 30px;
    font-weight: 700;
    color: #fff;
    float: left;
    position:relative;
    padding-left: 62px;
    line-height: 54px;
}

.captionone span {
     background-color:var(--cu-dark-blue);
}

.captiontwo span {
     background-color:var(--cu-orange);
}

.captionthree span {
     background-color:var(--cu-light-blue);
}

.captionfour span {
     background-color:var(--cu-slate);
}

.captionfive span {
     background-color:var(--cu-green);
}


.captionone span:before,
.captiontwo span:before,
.captionthree span:before,
.captionfour span:before,
.captionfive span:before {
    background-color: rgba(252, 256, 256, 0.2);
    content: "";
    width: 43px;
    height: 100%;
    font-weight: 700;
    position:absolute;
    top: 0px;
    left: 0;
}






.caption1 span {
    font-weight: 600;
    font-size: 42px;
    position: relative;
    z-index: 1;
    display: block;
    padding-bottom: 0;
    float: left;
}

.rightcaptions span {
    float: left;
    font-size: 22px;
    z-index: 2;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .9);
    padding-right: 88px;
}

.rslides li:first-child {
    position: relative;
    display: block;
    float: left
}

.caption1 {
    color: #fff;
    position: relative;
    width: 100%
}

.captionsmall {
    color: #eee;
    float: left;
    clear: both;
    width: 100%;
    bottom: 60px;
    width: 540px;
    font-size: 20px;
    text-transform: uppercase
}

.caption1 {
    color: #fff;
    float: left;
    clear: both;
    width: 100%;
    bottom: 0;
    width: 540px;
}

.rightcaptions {

    line-height: 1.4;


}

.bannerbuttons {
    float: left;
    width: 100%;
    margin-top: 24px;
}

.bannerbuttonone {
    float: left;
    color: #eee;
    margin-right: 16px
}

.bannerbuttonone a {
    float: left;
    background-color: var(--cu-green);
    padding: 10px 48px;
    text-transform: uppercase;
}

.bannerbuttontwo {
    float: left;
    color: #eee
}

.bannerbuttontwo a {
   background-color: var(--cu-slate);
   float: left;
   padding: 10px 48px;
   text-transform: uppercase;
}

.rslides {
    position: relative;
    width: 100%;
    padding: 0;
    margin: 0 auto;
    z-index: 0;
    float: left;
    width: 100%
}

.rslides ul {
    padding: 0;
    margin: 0;
    float: left;
    width: 100%
}

.rslides li {
    position: absolute;
    display: none;
    width: 100%;
    left: 0;
    top: 0;
    float: left;
    width: 100%
}

.rslides li:first-child {
    position: relative;
    display: block;
    float: left
}

.rslides img {
    display: block;
    height: auto;
    float: left;
    width: 100%;
    border: 0
}

#slider-wrapper-shallow .banner {
    position: relative;
    height: 796px;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    background-position: center;
}

#slider-wrapper-shallow .banner:after {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.3);
    top: 0px;
    left: 0px;
    content: "";
}

#slider-wrapper-shallow-simple .banner {
    position: relative;
    height: 410px;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    background-position: bottom center;
    float: left;
    width: 100%;
}


#slider-wrapper-shallow-simple .banner:after {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.2);
    top: 0px;
    left: 0px;
    content: "";
}

#slider-wrapper-shallow {
    position: relative;
    float: left;
    width: 100%
}

.bannerwrapper {
    position: relative;
    float: left;
    width: 100%;
    background-color: #454545;
    margin-top: -144px;
    z-index: 1;
}

#slider-wrapper-shallow-simple:before {
    width: 180px;
    height: 64px;
    content: "";
    background-color: #fff;
    bottom: 0px;
    right: 0px;
    position: absolute;
    z-index: 1;
}


#slider-wrapper-shallow-simple.blue:before {
    background-color: var(--cu-light-blue);

}

#slider-wrapper-shallow-simple.grey:before {
    background-color: var(--cu-light-grey);
}

#slider-wrapper-shallow-simple.none:before {
    background-color: rgba(0,0,0,0);

}

#slider-wrapper-shallow-simple {
    position: relative;
    float: left;
    width: 100%;
}

.banner-container {
    float: left;
    width: 100%;
    margin-top: 132px;
    position: relative
}

.rslides1_nav.next:before,
.rslides1_nav.prev:before,
.rslides2_nav.next:before,
.rslides2_nav.prev:before {
    font-family: socialmedia!important;
    font-size: 1em;
    width: 40px;
    line-height: 1.2
}

.rslides1_nav:active {
    opacity: 1
}

.rslides1_nav.next {
    left: auto;
    background-position: right top;
    right: 0
}

.rslides2_nav {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    background: #fff;
    opacity: 0;
    width: auto;
    text-indent: -9999px;
    height: 91%
}

.rslides2_nav.next {
    left: auto;
    right: 0
}

.rslides3_nav {
    position: absolute;
    opacity: .6;
    text-indent: -9999px;
    top: 0;
    bottom: 0;
    left: 0;
    background: url(https://www.completeutilities.co.uk/css/themes.gif) left 50% no-repeat #000;
    width: 38px
}

.rslides3_nav:active {
    opacity: 1
}

.rslides3_nav.next {
    left: auto;
    background-position: right 50%;
    right: 0
}

.rslides_tabs {
    position: absolute;
    width: 100%;
    bottom: -32px;
    text-align: center
}

.rslides_tabs li {
    display: inline;
    float: none;
    margin-right: 5px;
    z-index: 0;
    position: relative
}

.rslides1_nav.next,
.rslides2_nav.next {
    left: auto;
    background-position: right top;
    right: 16px;
    width: 32px;
    height: 32px;
    display: block;
    position: absolute;
    margin: 0;
    color: rgba(256, 256, 256, 0);
    border: 1px solid rgba(256, 256, 256, .4);
    border-radius: 50%;
    display: none
}

.rslides_tabs {
    position: absolute;
    bottom: 24px;
    text-align: center;
    right: 8px
}

.rslides_tabs li {
    display: inline-block;
    float: none;
    position: relative
}

.rslides_tabs a {
    background: #fff;
    display: inline-block;
    height: 12px;
    border-radius: 50%;
    padding: 10px
}

.rslides1_nav,
.rslides2_nav {
    position: absolute;
    top: 40%;
    left: 0;
    z-index: 1;
    height: 40px;
    width: 40px
}

.rslides1_nav.next:hover,
.rslides2_nav.next:hover {
    background-color: rgba(256, 256, 256, .7)
}

.rslides1_nav.next:active,
.rslides2_nav.next:active {
    background-color: rgba(0, 0, 0, .3)
}

.rslides1_nav.prev,
.rslides2_nav.prev {
    background-position: right top;
    left: 16px;
    border: 1px solid rgba(256, 256, 256, .4);
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: block;
    position: absolute;
    margin: 0;
    color: rgba(256, 256, 256, 0);
    display: none
}

.rslides1_nav.prev:hover,
.rslides2_nav.prev:hover {
    background-color: rgba(256, 256, 256, .7)
}

.rslides1_nav.prev:active,
.rslides2_nav.prev:active {
    background-color: rgba(0, 0, 0, .3)
}

.rslides1_nav.next:before,
.rslides2_nav.next:before {
    position: absolute;
    content: "r";
    left: -4px;
    top: 6px;
    text-align: center;
    color: rgba(256, 256, 256, .4)
}

.rslides1_nav.next:before:hover,
.rslides2_nav.next:before:hover {
    color: rgba(0, 0, 0, 1)
}

.rslides1_nav.prev:before,
.rslides2_nav.prev:before {
    position: absolute;
    content: "s";
    right: -4px;
    top: 6px;
    text-align: center;
    color: rgba(256, 256, 256, .4)
}

.rslides_tabs a {
    text-indent: -9999px;
    background-color: #333;
    border: 1px solid #ccc;
    display: inline-block
}

.rslides_tabs .rslides_here a {
    background: #70ad28;
    border: 1px solid #ccc
}

.hoverlink img {
    top: 0;
    float: left;
    opacity: 1
}



fieldset[disabled] input[type=color],
fieldset[disabled] input[type=date],
fieldset[disabled] input[type=datetime-local],
fieldset[disabled] input[type=datetime],
fieldset[disabled] input[type=email],
fieldset[disabled] input[type=month],
fieldset[disabled] input[type=number],
fieldset[disabled] input[type=password],
fieldset[disabled] input[type=search],
fieldset[disabled] input[type=tel],
fieldset[disabled] input[type=text],
fieldset[disabled] input[type=time],
fieldset[disabled] input[type=url],
fieldset[disabled] input[type=week],
fieldset[disabled] textarea,
input[type=color]:disabled,
input[type=color][disabled],
input[type=color][readonly],
input[type=date]:disabled,
input[type=date][disabled],
input[type=date][readonly],
input[type=datetime-local]:disabled,
input[type=datetime-local][disabled],
input[type=datetime-local][readonly],
input[type=datetime]:disabled,
input[type=datetime][disabled],
input[type=datetime][readonly],
input[type=email]:disabled,
input[type=email][disabled],
input[type=email][readonly],
input[type=month]:disabled,
input[type=month][disabled],
input[type=month][readonly],
input[type=number]:disabled,
input[type=number][disabled],
input[type=number][readonly],
input[type=password]:disabled,
input[type=password][disabled],
input[type=password][readonly],
input[type=search]:disabled,
input[type=search][disabled],
input[type=search][readonly],
input[type=tel]:disabled,
input[type=tel][disabled],
input[type=tel][readonly],
input[type=text]:disabled,
input[type=text][disabled],
input[type=text][readonly],
input[type=time]:disabled,
input[type=time][disabled],
input[type=time][readonly],
input[type=url]:disabled,
input[type=url][disabled],
input[type=url][readonly],
input[type=week]:disabled,
input[type=week][disabled],
input[type=week][readonly],
select:disabled,
textarea:disabled,
textarea[disabled],
textarea[readonly] {
    background-color: #ddd;
    cursor: default
}

.address:after,
.emailaddress:after,
.openingtimes:after,
.telephone:after {
    left: 0;
    top: 0;
    font-family: SocialMedia
}

input[type=color],
input[type=date],
input[type=datetime-local],
input[type=datetime],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week],
textarea {
    -webkit-appearance: none;
    background-color: #ffffff;
    border-style: solid;
    border-width: 0;
    display: block;
    padding: 4px;
    width: 100%;
    transition: all .15s linear;
    margin-bottom: 8px;
    height: 44px;
    font-size: inherit;
}

input[type=color]:focus,
input[type=date]:focus,
input[type=datetime-local]:focus,
input[type=datetime]:focus,
input[type=email]:focus,
input[type=month]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=text]:focus,
input[type=time]:focus,
input[type=url]:focus,
input[type=week]:focus,
textarea:focus {
    background: #fafafa;
    border-color: #999;
    outline: 0
}

input[type=submit] {
    -webkit-appearance: none;
    border-radius: 0;
    color: #fff;
    padding: 10px;
    margin-top: 0;
    border: 0;
    background-color: #e9e9e9;
    font-size: 20px;
    color: #454545
}

.formintro {
    float: left;
    width: 50%;
    padding-right: 40px;
    color: #fff;
    font-size: 18px;
}

.contactform form {
    width: 66%;
    padding-left: 32px;
    
}


.contactform .formintro {
    float: left;
    width: 33%;
    padding-right: 40px;
    color: #fff;
    font-size: 18px;
}

.formintro h3 {
    font-size: 28px
}

.contactform {
    float: left;
    width: 100%;
    margin: 64px 0;
    position: relative;
    padding-bottom: 80px;
}

.contactform div {
    margin-top: 24px;
}

#formvalidate {
    float: left;
    width: 4px;
    height: 4px;
    margin-top: 0px;
    
}

.registerform {
    float: left;
    width: 100%;
    margin: 64px 0;
    position: relative;
}


.registerform form {
    width: 50%;
    padding: 0px 48px;
}

.registerform form div {
    width: 100%;
    float: left;
    margin-bottom: 24px;
   }

.registerform div:nth-child(6) {
    grid-column: 4/5
}

#cvupload-filename {
 color: #fff;
  background-color: #70ad28;
}

.registerform input{
    background-color: var(--cu-orange);
    color: #fff;
  float: left;
  width: 100%;
  padding: 13px;

}

.registerform form div.submitone
 {
  float: right;
  width: 49%;
  margin-top: 12px;
}


div#hide {
  float: left;
  width: 49%;
  margin-top: 12px;
}

.formbreak {
  background-color: #2586d8;
  padding: 8px;
}

.formbreak 
input[type=checkbox], 
input[type=file], 
input[type=radio], 
select {
    margin: 0px !important];
    float: none;
}

.formbreak 

select {
    border-width: 1px;
    padding: 0em;
    font-size: .875em;
    color: rgba(0, 0, 0, .75);
    line-height: normal;
    border-radius: 0;
    height: 2.3125em;
    margin: 0px;
}


.contactform div:nth-child(7) {
    grid-column: 1/5
}

.contactform div:nth-child(8) {
    grid-column: 4/5;
    position: relative;
    text-align: right
}

.registerform input[type=email],
.contactform input[type=email],
.registerform input[type=text],
.contactform input[type=text],
.registerform textarea,
.contactform textarea {
    -webkit-appearance: none;
    background-color: #005295;
    border-style: solid;
    border-width: 0;
    display: block;
    padding: 4px;
    width: 100%;
    transition: all .15s linear;
    margin-bottom: 0px;
    height: 48px;
    font-size: inherit;
    border-bottom: 1px solid #eee;
    color: #fff;
    line-height: 36px;
}

.registerform input[type=email]:focus,
.contactform input[type=email]:focus,
.registerform input[type=text]:focus,
.contactform input[type=text]:focus,
.registerform textarea:focus,
.contactform textarea:focus {
    background: #fafafa;
    border-color: #999;
    outline: 0;
    color: #333
}

.contactform input[type=text]:focus {
    background: #fafafa;
    border-color: #999;
    outline: 0
}

.contactform input[type=submit] {
    border: 0;
    background-color: var(--cu-orange);
    font-size: 20px;
    width: 180px;
    color: #eee;
    text-transform: uppercase;
    position: relative;
    float: right
}

.forminputarrow:before {
    background-color: #bdbdbd;
    color: #333;
    position: absolute;
    content: "";
    width: 32px;
    height: 32px;
    right: 0;
    top: -4px;
    padding: 14px;
    pointer-events: none
}

.forminputarrow:after {
    color: #333;
    position: absolute;
    content: "c";
    right: -2px;
    top: -6px;
    padding: 14px;
    font-size: 36px;
    font-family: complete-icons;
    pointer-events: none
}

.registerform form input::-webkit-input-placeholder,
.contactform form input::-webkit-input-placeholder {
    color: #fff
}

.registerform form input:-ms-input-placeholder,
.contactform form input:-ms-input-placeholder {
    color: #fff
}

.registerform form input::placeholder,
.contactform form input::placeholder {
    color: #fff
}

.registerform form textarea::-webkit-input-placeholder,
.contactform form textarea::-webkit-input-placeholder {
    color: #fff
}

.registerform form textarea:-ms-input-placeholder,
.contactform form textarea:-ms-input-placeholder {
    color: #fff
}

.registerform form textarea::placeholder,
.contactform form textarea::placeholder {
    color: #fff
}

textarea {
    max-width: 100%
}

select {
    border-width: 1px;
    padding: .5em;
    font-size: .875em;
    color: rgba(0, 0, 0, .75);
    line-height: normal;
    border-radius: 0;
    height: 2.3125em
}

select::-ms-expand {
    display: none
}

input[type=checkbox],
input[type=file],
input[type=radio],
select {
    margin: 2px
}

input[type=checkbox],
input[type=file],
input[type=radio],
select {
    margin: 12px;
    float: none
}

input[type=radio]+label {
    display: inline-block;
    margin-left: .5em;
    margin-right: 1em;
    margin-bottom: 0;
    vertical-align: baseline
}

input[type=file] {
    width: 100%;
      background:  #454545;

}

fieldset {
    background-color: #2b2b2b;
    width: 100%;
    float: left;
    padding: 12px
}

fieldset legend {
    background: #2a2a2a;
    padding: 0;
    margin-bottom: 12px;
    float: left;
    width: 100%
}

[data-abide] .error small.error,
[data-abide] .error span.error,
[data-abide] small.error,
[data-abide] span.error {
    display: block;
    padding: .375em .5625em .5625em;
    margin-top: -1px;
    margin-bottom: 1em;
    font-size: .75em;
    font-style: italic;
    background: #f04124;
    color: #fff
}

[data-abide] small.error,
[data-abide] span.error {
    display: none
}

.error small.error,
small.error,
span.error {
    display: block;
    padding: .375em .5625em .5625em;
    margin-top: -1px;
    font-size: .75em;
    font-style: italic;
    background: #f04124
}

small.error,
span.error {
    margin-bottom: 1em;
    color: #fff
}

.error input,
.error select,
.error textarea {
    margin-bottom: 0
}

.error input[type=checkbox],
.error input[type=radio] {
    margin-bottom: 1em
}

.error label,
.error label.error {
    color: #f04124
}

.error small.error {
    margin-bottom: 1em;
    color: #fff
}

.error>label>small {
    color: #676767;
    background: 0 0;
    padding: 0;
    text-transform: capitalize;
    font-size: 60%;
    margin: 0;
    display: inline
}

.error span.error-message {
    display: block
}

input.error,
select.error,
textarea.error {
    margin-bottom: 0
}

label.error {
    background-color: #70ad28;
    display: inline-block;
    padding: 4px;
    border-radius: 4px;
    margin-bottom: 12px;
    color: #fff
}

blockquote,
q {
    quotes: none
}

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

table tr {
    padding: 0
}

.addressinfo {
    text-align: left;
    padding-left: 12px;
    padding-right: 12px
}

.address,
.emailaddress,
.openingtimes,
.telephone {
    padding-left: 32px
}

.address:after {
    content: "m";
    position: absolute
}

.telephone {
    position: relative
}

.telephone:after {
    content: "j";
    position: absolute
}

.emailaddress {
    position: relative
}

.emailaddress:after {
    content: "l";
    position: absolute
}

.footerlogos {
    float: left;
    width: 100%;
        padding: 32px 0;
    background-color:var(--cu-light-blue);
}

.footerlogosleft {
    float: left;
    width: auto;
}

.footerlogosright {
    float: right;
    width: auto;
}

.smallprint {
    float: left;
    width: 100%;
    /* padding: 8px 0; */
    text-align: center;
    font-size: 12px;
}

.smallprint p,
.smallprint br{
  display: inline-block;
  width: auto;
  float: none;
}

.right .textleft {
    text-align: left;
    float: left;
    width: 100%;
    padding: 16px 0;
    padding-right: 54%;
    margin-left: auto;
    margin-right: auto
}

.left .textleft {
    text-align: left;
    float: left;
    width: 100%;
    padding: 16px 0;
    padding-left: 54%;
    margin-left: auto;
    margin-right: auto
}

.videoinset {
    width: 50%;
    margin-bottom: 8px;
    display: inline-block;
    position: relative;
    background-color: #000;
    color: #df4547;
    padding: 8px
}

.nuvo_imagearea.circularpic img {
    width: 100%;
    border-radius: 50%
}

.nuvo_imagearea figcaption {
    font-size: 12px;
    padding-bottom: 8px;
    text-align: center
}

.left .nuvo_newimagearea {
    width: 50%;
    margin-bottom: 8px;
    position: absolute;
    left: 0;
    height: 100%;
    overflow: hidden;
    background-size: cover;
    background-position: center center
}

.right .nuvo_newimagearea {
    width: 50%;
    margin-bottom: 8px;
    position: absolute;
    right: 0;
    height: 100%;
    overflow: hidden;
    background-size: cover;
    background-position: center center
}

.nuvo_newimagearea.left {
    width: 50%;
    margin-bottom: 8px;
    position: absolute;
    left: 0;
    height: 100%;
    overflow: hidden;
    background-size: cover;
    background-position: right center
}

.nuvo_newimagearea img {
    width: 100%;
    margin-bottom: 8px;
    position: absolute;
    right: 0
}

#profilesone {
    position: relative;
    width: 100%;
    color: #eee;
    padding-top: 8px;
    padding-left: 8px;
    padding-right: 8px
}

.right {
    float: right;
    margin-right: 0
}

.left {
    float: left;
    margin-left: 0;
    /* margin-right: 8px */
}

.nuvo_imagearea.circularpic {
    border-radius: 50%
}

.nuvo_imagearea_center {
    width: 33.3333%;
    display: block;
    position: relative;
    line-height: 1;
    padding: 0;
    margin: 0;
    float: left
}

.nuvo_imagearea_center a {
    display: block;
    /*! line-height: 0; */
    padding: 0;
    margin: 0
}

.nuvo_imagearea_half {
    width: 50%;
    float: left
}

.nuvo_imagearea_third {
    width: 33.33333%;
    margin-bottom: 0;
    float: left
}

.nuvo_imagearea img {
    width: 100%
}

.nuvo_imagearea.circularpic img {
    width: 100%;
    border-radius: 50%
}

.fullwidthimagecaption,
figcaption {
    padding: 8px;
    width: 100%;
    text-align: center;
    font-size: 14px
}

.left .nuvo_imagearea {
    width: 40%;
    float: left;

}

.margintop {
  margin-top: 72px;
}

.right .nuvo_imagearea {
    width: 40%;
    float: right;
    padding-left: 16px
}


.left .nuvo_textblock{
    width: 60%;
    float: left;
    padding-left: 64px;
    padding-right: 64px;
}

.right .nuvo_textblock{
    width: 60%;
    float: left;
    padding-left: 64px;
    padding-right: 32px;
}


img {
    width: 100%;
    vertical-align: top;
    height: auto
}

.ind_photo img {
    width: 100%;
    vertical-align: top;
    height: auto
}

.downloads {
    float: left;
    clear: both;
    width: 100%
}

.downloadtab {
    padding: 0;
    border: 2px solid #fff;
    background-color: #043465;
    float: left;
    color: #fff;
    width: 33.2507253%;
    margin-top: 24px;
    margin-bottom: 24px;
    position: relative
}

.downloadtab:after {
    content: "1";
    position: absolute;
    font-size: 32px;
    font-family: school!important;
    bottom: 4px;
    right: 4px;
    line-height: 32px;
    color: #4bbdd3;
    pointer-events: none
}

.downloadname,
.downloadtab img {
    color: #fff;
    float: left;
    width: 100%
}

.downloadtab img {
    padding: 0;
    line-height: 0;
    margin: 0;
    -ms-transform: rotate(-7deg);
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg)
}

.downloadname {
    padding: 8px 8px 40px;
    margin-top: 20px;
    line-height: 100%;
    font-size: 20px
}

.downloadname .filesize {
    float: left;
    width: 100%;
    margin-top: 8px;
    padding-top: 4px;
    border-left: none;
    padding-left: 8px;
    padding-right: 0;
    font-size: 11px;
    color: #4bbdd3
}


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





}

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


    #logoareatwo {
    float: left;
    opacity: 1;
    z-index: 3;
    transition: all .1s ease-in-out;
    padding: 16px;
    position: fixed;
    width: 100%;
     background-color: var(--cu-slate-trans-zero);
    transition: all .4s ease-in-out

}

.cuheader.shrink
   #logoareatwo {
    float: left;
    opacity: 1;
    z-index: 3;
    padding: 8px 16px;
    position: fixed;
    width: 100%;
    background-color: var(--cu-slate);
    transition: all .4s ease-in-out;
}


  #socialmedia {
    margin-right: 64px;
}


 

    #logoarea img {

     width: 180px;
}




.bannerwrapper {
    position: relative;
    float: left;
    width: 100%;
    background-color: #454545;
    margin-top: -64px;
}



.halfcolumn.leftside {
   width: 100%
}

  .halfcolumn {
   width: 100%
}


.halfcolumn .jobsearch {
    margin-top: 16px
}

.halfcolumn .vacancylistouter {
    margin-top: 0px;
    padding-top: 60px;
}



    a.js-open-search-modal {
        top: 12px;
        right: 80px
    }
    .modal.visible {
        right: 72px;
        width: calc(100vw + -72px);
        max-width: 500px
    }
    header {
        height: 64px;
    }
    #picturenavsmall {
        grid-gap: 8px;
        grid-template-columns: repeat(2, 1fr);
        padding: 12px
    }
   
    .picturelinktext {
        text-align: center;
        padding: 32px 32px;
        color: #eee
    }
    #navigationarea {
        position: fixed;
        top: 0px;
        position: relative;
      
    }
    .right .textleft {
        text-align: left;
        float: left;
        width: 100%;
        padding: 16px 0;
        padding-right: 0;
        margin-left: auto;
        margin-right: auto
    }
    .left .textleft {
        text-align: left;
        float: left;
        width: 100%;
        padding: 16px 0;
        padding-left: 0;
        margin-left: auto;
        margin-right: auto
    }
    .left .nuvo_newimagearea,
    .right .nuvo_newimagearea {
        width: 100%;
        margin-bottom: 8px;
        position: relative;
        right: auto;
        height: 100%;
        height: 300px
    }
    #slider-wrapper-shallow-simple .banner {
        height: 320px;
    }
}


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


  .vacancylistoutersimple {
    
    margin-top: 0px;
    
}


  .maincontent.archive
.pagecaptions {
    margin-top: -112px;
   


}



.left .nuvo_textblock{
    padding-left: 24px;
}

.right .nuvo_textblock{
    padding-left: 24px;
}





 .pagecaptions {
    margin-top: -160px;
}




  #teamprofileslist 

 {
   display: inline-grid;
    margin-top: 60px;
    padding-bottom: 60px;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 32px;
    padding: 0px 24px;
    padding-bottom: 100px

}


  .staffmemberbox 

 {
   margin-top: 0px;
   padding-bottom: 24px;
   grid-template-columns: repeat(3, 1fr);
   grid-gap: 20px;
   padding: 24px;
}




  .followwords {
  float: left;
  padding-top: 0px;
}


.vacancyform {
  float: right;
  width: 100%;
  max-width: 100%;
  padding: 0px 24px;
}




  .visionarea {
    float: left;
    width: calc(100%-24px);
    padding: 04px 0;
    line-height: 1.5;
    position: relative;
    z-index: 1;
    padding-bottom: 80px;
    color: #fff;
    margin-left: 24px;
}


.visionarea:after {
    position: absolute;
    content: "";
    width: 33%;
    background-color: var(--cu-light-grey);
    height: 48px;
    left: 0px;
    bottom: 0px;
}






  .aboutus .pagecaptions {
    margin-top: -140px;
    float: left;
}



  .newscategoryheading {

    padding: 0px 0px 20px 24px;
   
}


  #slider-wrapper-shallow-simple:before {
    width: 180px;
    height: 40px;
    content: "";
    background-color: #fff;
    bottom: 0px;
    right: 0px;
    position: absolute;
    z-index: 1;
}

  .singleorangeheading {
     margin-top: -64px;
}

  .singleorangeheading span {
    font-size: 22px;
}




  .leftcaptions {
    margin-left: -24px;

}




#logoarea img {
    float: left;
    width: 180px
}


#picturenavabout {
    grid-template-columns: repeat(2, 1fr);
    padding: 20px 0;
    margin-top: 60px;
    padding-bottom: 60px;
}


   .aboutvalues {
  
    grid-gap: 24px;
    grid-row-gap: 32px;
    grid-template-columns: repeat(2, 1fr);
    padding: 24px;
    }


  .calltoaction {
    padding: 32px 24px 80px 24px;

}





  #picturenavservices,
  #picturenavservicessmall {
    width: 100%;
    grid-template-columns: repeat(2, 1fr);
}


.newshome,
  .jobshome {

    margin-top: 16px;
}

 .innerwrapperwider {
    padding: 0 24px;
    display: block
}

.innerwrapper {
    padding: 0 24px;
}



  .contactintro .nuvo_textblock_right,
.nuvo_textblock_right
 {
width: 100%;
    padding: 0px;
     padding-top: 32px;: 0px;
    margin: 0px;
    
}
.contactintro .nuvo_textblock_left,
.nuvo_textblock_left
 {
width: 100%;
    padding: 0px;
    margin: 0px;
    float: left;
    display: block;
}



.testimonialhome {
    min-height: 500px;
    margin-top: 0px;
}


    .insettest {
    float: right;
    color: #fff;
    position: relative;
    background-color:var(--cu-slate);
    width: 90%;
    padding: 80px;
    padding-bottom: 40px;
    font-style: italic;
    margin-top: -72px;
    z-index: 1;
}


    #relatedpages {
    margin-top: 0px;

}

    .vacancylistouter{
    margin: 0px;
}
  


.jobsearch {
   
    margin-top: 0px

}






.captionblock {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    bottom: 80px;
}


.captioncontainer {
    max-width: 1440px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    align-items: baseline;
    display: inline-grid;
    grid-gap: 24px;
    grid-template-columns: repeat(1, 1fr);
    padding: 0px 24px;
}


.captionone span,
.captiontwo span,
.captionthree span,
.captionfour span,
.captionfive span {
    padding: 4px 12px;
    font-weight: 700;
    color: #fff;
    float: left;
    position:relative;
    padding-left: 32px;
    font-size: 32px;
    margin-left: 0px;
    line-height: 1.5;
}


.captionone span:before,
.captiontwo span:before,
.captionthree span:before,
.captionfour span:before,
.captionfive span:before {
    width: 24px;
}









 #slider-wrapper-shallow .banner {
        height: 720px;
    }


.rightcaptions span {
    font-size: 18px;
    padding: 0px;
}

.bannerbuttonone {
    float: left;
    color: #eee;
    margin-right: 4px
}

.bannerbuttonone a {
    float: left;
    /* background-color: rgb(252,76,2); */
    padding: 8px 16px;
    text-transform: uppercase;
    font-size: 16px;
}

.bannerbuttontwo {
    float: left;
    color: #eee
}

.bannerbuttontwo a {
   background-color: rgba(113, 124, 125, 1.0);
    float: left;
    padding: 8px 16px;
     text-transform: uppercase;
     font-size: 16px;
}



.maincontent.withstatements {
    margin-top: 0px;
    position: relative;
    background-color: rgba(0,0,0,0);
    }


    .threestatements {
    grid-template-columns: repeat(3, 1fr);

    }






     .contactcolumns {
    grid-gap: 24px;
    grid-template-columns: repeat(3, 1fr);
      }

      .contactintro {
          grid-column: 1/4;
          text-align: center;
          border-right: 0px;
      }

       .contacttel {
          grid-column: 1/2;
      }

      .contactemail {
          grid-column: 2/3;
      }

      .contactsocial {
          grid-column: 3/4;
      }



    .newsblock {
    display: inline-flex;
    flex-wrap: wrap;
    padding: 40px 0
}

.newsblockthird {
    border-bottom: 1px solid var(--cu-slate);
    position: relative;
    margin-bottom: 24px;
    padding-bottom: 48px;
}


.addresshome {
    width: 100%;
    order: 1;
}

.jobshome {
    width: 50%;
    padding-right: 24px;
    order: 2;
}

.newshome {
   width: 50%;
   padding-right: 0;
   order: 3;
}


}


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


  .videoarea {
    padding: 16px;
    background-color: rgb(51 105 173);
    width: 100%;
    display: block;
    background-repeat: no-repeat;
    border-radius: 8px;
    color: rgb(255, 255, 255);
    display: inline-block;
}



  .captionone span,
.captiontwo span,
.captionthree span,
.captionfour span,
.captionfive span {
    padding: 0px 12px;
    font-weight: 700;
    color: #fff;
    float: left;
    position:relative;
    padding-left: 32px;
    font-size: 28px;
    margin-left: 0px;
    line-height: 56px;
}


  .staffmemberbox 

 {
   display: inline-grid;
   margin-top: 60px;
   padding-bottom: 60px;
   grid-template-columns: repeat(6, 1fr);
   grid-gap: 0px;
   padding: 0px 24px;
   padding-bottom: 0px;
   float: left;
}

.staffmembertext 

 {
   grid-column: 1 / 5;
   padding-right: 24px;
   order: 1;
}


.staffimage

 {
   grid-column: 5 / 7;
   padding-bottom: 14px;
   order: 2;
}




.maincontent {
 
    padding-bottom: 16px;
}

  .vacancysmalldetails {
    float: left;
    width: 100%;
    padding: 16px 0px;
    
}


  .maincontent.contactblocks {
    background-color: #fff;
    padding: 0px 0px 24px 0px;
     margin-top: 64px;


}


  .maparealeft {
margin-top: 24px;}


.maparearight {
    grid-column: 1/4;
    margin-left: 0px;
    position: relative;
}


.maparea .maincontent {
    position: relative;
    padding: 0px;
    padding-bottom: 24px;
}


  .maparea {
    grid-gap: 0px;
    grid-template-columns: repeat(1, 1fr);
    padding: 0;

   
}


.mapaddress {

width: 100%;
max-width: 100%;
padding: 32px 12px 40px 64px;

}




.margintop {
  margin-top: 0px;
}


 



  .contactform form {
    width: 100%;
    padding: 0px;
    
}


.contactform .formintro {
    width: 100%;
    padding: 0px;
   
}





  .vacancyitemlist h2 {
    font-size: 18px;
    float: left;
    width: 100%;
    padding-right: 100px;
}



  .vacancyitemleft,
  .vacancyitemright {
    float: left;
    width: 100%;
    padding: 0px
}


.detailslink {
    font-size: 18px;
    font-weight: 600;
    margin-top: 0px;
}

.vacancysmalldetails {
    margin-bottom: 0px;
}



  .vacancyitemright {

    padding-top: 24px
}



.visionarea .nuvo_textblock_left
 {
    width: 100%;
    float: left;
    padding: 0px;
    padding-top: 24px;
}

.visionarea .nuvo_textblock_right
 {
    width: 100%;
    float: left;
    padding: 0px;
    padding-top: 0px;
}



  .casestudiesarea {
    display: inline-grid;
    grid-gap: 32px;
    row-gap: 96px;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-flow: row;
    padding: 40px 0;
    text-align: left;
    margin-top: 60px;
    width: 100%;
}











  .newsarea:before {
    width: 50%;
    height: 40px;
    top: -40px;
}


  .newscategoryheading {
    float: left;
    width: calc(100% + -0px);
    font-weight: 600;
    background-color: var(--cu-light-blue);
    position: relative;
    padding: 0px 0px 20px 24px;
    color: #fff;
    position: relative;
    z-index: 1;
    margin-top: -48px;
}




  .sharenews {
    display: none;
}



.newsmaintitle {
  font-size: 22px;
  padding: 16px 0px 16px 0px;
}



.registerform form,
.formintro {

    width: 100%;
    padding: 0px

}


.vacancylistoutersimple {
    margin: 24px 0px;

}



.twothirds,
.careers .twothirds,
.onethird,
.halfcolumn,
.halfcolumn.leftside,
.fullcolumn,
.quartercolumn {
    width: 100%;
    float: left;
    /* padding: 8px; */
}



.mainarticle {
  padding-top: 24px;
}




  .maincontent {
    /* padding: 0px; */
}

  .contactcolumnscta {
    flex-wrap: wrap;
    text-align: center;
    padding: 8px 0px;
    margin-top: 24px;
  }


  .emailuscta {
    float: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    line-height: 1;
    position: relative;
}

  .followuscta {
    float: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    line-height: 1;
}

 .followuscta a{
    float: none;
    display: inline-block;
    width: auto;
}





  .contactcolcta:nth-child(1),
  .contactcolcta:nth-child(2),
  .contactcolcta:nth-child(3) {
    position: relative;
    color: #fff;
    width: 100%;
    display: flex;
    text-align: center;
    padding: 8px 0px;
    align-items: center;
    justify-content: center;
    text-align: center;
}





.insettest {
    background-color:var(--cu-slate);
    width: calc(100% - 24px);
    padding: 80px 24px 40px 80px;

}



  .testimonialdesc {
        line-height: 26px;
        font-size: 18px;
    }



 .navigationintro h3 {
    font-size: 26px;
}

.nuvo_textblock_left h2 {
    font-size: 28px;
    font-weight: 600;
}



  .aboutvalues {
  
    grid-gap: 24px;
    grid-row-gap: 32px;
    grid-template-columns: repeat(1, 1fr);
    padding: 24px;
    }

    


  .left .nuvo_imagearea {
    width: 100%;
    padding: 0px 24px;
    margin-bottom: 24px;
    margin-top: 12px;
}

.right .nuvo_imagearea {
    width: 100%;
    padding: 0px 24px;
    margin-bottom: 24px;
}


.left .nuvo_textblock{
    width: 100%;
    padding: 0px 24px;
}

.right .nuvo_textblock{
    width: 100%;
    padding: 0px 24px;
}



    .newsitemleft {
    float: left;
    width: 100%
}

.newsitemright {
    float: left;
    width: 100%;
    padding: 16px;
}




.footerlogosleft,
.footerlogosright {
    float: left;
    width: 100%;
}





     .threestatements {
    grid-template-columns: repeat(1, 1fr);

    }




  .twothirds,
    .onethird
 {
    width: 100%;
    padding: 0px 24px;
}


#relatedpages {
    display: none;
}



    .topbar {
    display: none;
}


      .contactintro {
    text-align: center;

}


       .contactcolumns {
    grid-gap: 24px;
    grid-template-columns: repeat(1, 1fr);
      }


 .contactcol {
    border: 0px;
     grid-column: 1/1
      }

   

      .newsblock {
     display: inline-flex;
     margin-top: 0px;
     padding-top: 0px;
   

}

.addresshome {
    width: 100%;
    order: 3;
}

.jobshome {
    width: 100%;
    padding-right: 24px;
    margin-top: 60px;
    order: 1;
}

.newshome {
    margin-top: 0px;
     padding-top: 0px;
   width: 100%;
   padding-right: 0;
   order: 2;
}




    #picturenav {
        grid-gap: 24px;
        grid-template-columns: repeat(2, 1fr)
    }
    .ind_photo {
        width: 33%
    }
  
    .logolist .ind_logo {
        float: left;
        width: 49%;
        margin: .5%
    }
    .indlogo img {
        height: 54px;
    }
    .nuvo_newimagearea {
        width: 100%;
        margin-bottom: 8px;
        position: relative;
        float: left;
        height: 400px
    }
    .textinnerleft {
        width: 100%;
        padding-bottom: 24px
    }
    .textinnerright {
        width: 100%
    }
}

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

.captionone span,
.captiontwo span,
.captionthree span,
.captionfour span,
.captionfive span {
    padding: 0px 12px;
    font-weight: 700;
    color: #fff;
    float: left;
    position:relative;
    padding-left: 32px;
    font-size: 28px;
    margin-left: 0px;
    line-height: 48px;
}

#slider-wrapper-shallow-simple .banner {
        height: 280px;
    }


  .registerform form div.submitone,
  div#hide
 {
  width: 100%;

}

#teamprofileslist 

 {
   display: inline-grid;
    margin-top: 60px;
    padding-bottom: 60px;
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 32px;
    padding: 0px 24px;
    padding-bottom: 100px;

}

.casestudiesarea {
    display: inline-grid;
    grid-gap: 32px;
    row-gap: 96px;
    grid-template-columns: repeat(1, 1fr);
    grid-auto-flow: row;
    padding: 40px 0;
    text-align: left;
    margin-top: 60px;
    width: 100%;
}

  .nuvo_textblock_left h1 {
   
    font-size: 26px;
    font-weight: 600;
}

.nuvo_textblock_right h2 {
   
    font-size: 19px;
}

.aboutus .pagecaptions {
    margin-top: -120px;
    float: left;
}

.aboutus .captionone span,
.aboutus .captiontwo span,
.aboutus .captionthree span,
.aboutus .captionfour span,
.aboutus .captionfive span {
    padding: 4px 16px;
    font-weight: 700;
    color: #fff;
    float: left;
    position:relative;
    padding-left: 32px;
    font-size: 32px;
    margin-left: 0px;
    line-height: 1.3;
}

.aboutus .captionone span:before,
.aboutus .captiontwo span:before,
.aboutus .captionthree span:before,
.aboutus .captionfour span:before,
.aboutus .captionfive span:before {
    width: 24px;
}

  #picturenavabout {
    grid-template-columns: repeat(1, 1fr);
    padding: 0px 24px 120px 24px;
}
#logoarea img {
    width: 140px
}

    #logoarea {
     left: 12px;
     top: 12px;
}
    #logoarea img {

     width: 152px;
}

 #picturenavservices,
  #picturenavservicessmall {
    grid-template-columns: repeat(1, 1fr);
}

    #picturenavsmall {
        grid-gap: 8px;
        grid-template-columns: repeat(1, 1fr);
        padding: 16px
    }
    .nuvo_imagearea {
        width: 50%;
        float: right;
        position: relative
    }
    #picturenav {
        grid-gap: 0;
        row-gap: 24px;
        grid-template-columns: repeat(1, 1fr);

    }