/*
Theme Name: Cyberfrog (Shaun)

Author: Shaun Hearnden

Version: 999999999999999999999999999999

*/

body{max-width:1920px; margin:0 auto!important; display:block;}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}html{scroll-behavior:smooth}body{line-height:1}a{text-decoration-skip-ink:auto}a[href^="tel"]{color:inherit;text-decoration:none}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}input[type="search"]{-webkit-appearance:textfield}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;word-break:normal}
.screen-reader-text:focus{background-color:#f7f7f7;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;-webkit-clip-path:none;clip-path:none;color:#007acc;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;right:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}
.skip-link{left:-9999rem;top:2.5rem;z-index:999999999;text-decoration:underline}
.skip-link:focus{display:block;left:6px;top:7px;font-size:14px;font-weight:600;text-decoration:none;line-height:normal;padding:15px 23px 14px;z-index:100000;right:auto}
.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active){position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}

h1, h2, h3, h4, h5, h6, p {
    margin-top: 0; /* Removes default top margin */
    margin-bottom: 16px; /* Standard bottom margin */
    line-height: 1.5; /* Line height for readability */
}
 #test_strip h1, #test_strip h2, #test_strip h3, .single .internal_banner h3, h4, h5, h6, #case_studies_blocks h5, .four_case h5, .big_pic_text h5, .big_pic_text h3, .internal_banner h5, .home_white_section h2, body, p, input, span, button, textarea, select, .case_studies_slider  a > span{ font-family: "Noto Sans", sans-serif!important;}
.internal_banner *{color:#fff;}

#case_studies_blocks .wrapper > div{   display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 90px; /* Adjust the gap between grid items as needed */}


.line_link.dark {
    border-color: #00000060;
}

.vac_overview h5{
    padding-bottom:10px;
    border-bottom:1px solid #00000060;
    color: #313946;
margin-bottom:100px;
display:block;
font-size: 20px;
font-style: normal;
font-weight: 300;
line-height: normal;
letter-spacing: -0.6px;
    
}

.single_vacancy{
    margin:70px 0;
     display: grid;
    grid-template-columns: 30% 67%; /* Adjust these values as needed */
    gap: 0%; /* Optional: Adjust the gap between columns if needed */
    
    
}

.single_vacancy .wizzy_wig{
    border-left: 1px solid #00000060;
    padding-left: 30px;
    margin-left: 30px;
    max-width:800px;
}



.wizzy_wig h1, .wizzy_wig h2, .wizzy_wig h3, .wizzy_wig h4, .wizzy_wig h5, .wizzy_wig h6{font-weight:600;}


.vac_overview div strong{font-weight:500; margin-right:5px;}
.vac_overview div{
    
    color: #313946;

font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;
letter-spacing: -0.48px;
    
}

.wizzy_wig p{
    
    
margin:40px 0;
color: #000;

font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;
letter-spacing: -0.48px;
}

#case_studies_blocks span.secret_link{
color: #313946;
display:block;
padding:10px 0;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.6px;
    border-bottom:1px solid #00000060;
}


.browse_link {
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.6px;
    border-bottom: 1px solid #ffffff60;
    width: 100%;
    display: block;
    padding-bottom: 10px;
    margin-top: 60px;
}
.slick-list {
  margin: 0 -30px!important; /* half the desired gap on each side */
}

.slick-slide {
    position: relative;
    right:-1px;
  padding: 0 30px; /* half the desired gap on each side */
  box-sizing: border-box;
 border-right:1px solid #ffffff00 
}
.slick-slide.slick-active{
    border-right:1px solid #ffffff60 
    
}

/*.slick-slide.slick-active:last-child{ border-right:1px solid #ffffff00!important }*/
   
 #home_split .blue_section > span *, #home_split .red_section > span *{color:#fff!important;}

#form_box input, #form_box textarea{
    border:none!important;
    border-bottom:1px solid #00000060!important;
    outline:none!important;
    -webkit-appearance:none!important;
    color: #000!important;


font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px; /* 200% */
letter-spacing: -0.48px;
    
}

::placeholder{
    
        color: #000!important;


font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px; /* 200% */
letter-spacing: -0.48px;
    
}

div#form_box {
    display: block;
    max-width: 800px;
}

div#form_box textarea{height:160px;}

#home_split p{
    
    
    color: #FFF;

text-align: center;
margin:30px 0;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 32px; /* 177.778% */
letter-spacing: -0.54px;
}

#home_split a{
        padding: 10px 30px;
color: #FFF;
text-align: center;
margin-top:30px; display:inline-block;
    border-radius:50px;
    border:1px solid #ffffff60;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.6px;
    
}

.blue_section .trans {
   background: #304A79;
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.6;
}

.red_section .trans {
     background: #E92C34;
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.6;
}

#case_gallery a:hover{opacity:0.8; transition:0.3s;}

#home_split .blue_section > span, #home_split  .red_section > span{max-width:600px; margin:0 auto; display:block; z-index: 4; position: relative;}

.home_white_section a:hover { background: #273246; color:#fff; transition:0.3s;}
#home_split a:hover{background:#fff; color:#333!important; transition:0.3s;}
.three_case a:hover, .four_case a:hover, .slick-slide:hover, .big_pic_text .text a:hover{opacity:0.7; transition:0.3s;}

.home_white_section a, #home_split a, .numbers_block > span strong, #test_strip h6, #foot_3 a, #foot_3 strong, #foot_2 > div > span, .big_menu_link, .browse_link, #case_studies_blocks span.secret_link, .big_pic_text .text a, h1, h2, h3, .small_menu_link, input#gform_submit_button_1, input#gform_submit_button_2, input#gform_submit_button_3, input#gform_submit_button_4, .tabs button{font-family: "Arvo", serif!important;}
.red_section{background:#C15461;}
.blue_section{background:#576B90}

.blue_section *, .red_section *{color:#fff;}

input#gform_submit_button_1, input#gform_submit_button_2, input#gform_submit_button_3, input#gform_submit_button_4{
    
    
    color: #34404F!important;

background-color:transparent!important;
font-size: 18px!important;
font-style: normal!important;
font-weight: 700!important;
line-height: normal;
letter-spacing: -0.54px!important;
    border:none!important;
    padding-right: 50px;
}

input#gform_submit_button_1, input#gform_submit_button_2, input#gform_submit_button_3, input#gform_submit_button_4{
 
    background-image:url('https://www.cphoodelectrical.co.uk/wp-content/uploads/2025/10/arrow-blue-2.png')!important;
    background-repeat:no-repeat!important;
      background-size:contain!important;
  background-position:95% 50%!important;
}
input#gform_submit_button_1:hover, input#gform_submit_button_2:hover{cursor:pointer; opacity:0.7; transition:0.3s;}

#foot_3 a{
    
    color: #34404F;


font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.54px;
    
}

#foot_1{ display: grid;
    grid-template-columns: 45% 50%; /* Adjust these values as needed */
    gap: 5%; /* Optional: Adjust the gap between columns if needed */}


#foot_1 span:first-child img{width:150px;}

#foot_1 p{
    
    color: #313946;


font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 28px; /* 200% */
letter-spacing: -0.42px;
    
    
}

#foot_2 > div > span{
    color: #34404F;

display:inline-block;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.54px;
    
    
    
}

#foot_2 > div {margin-bottom:20px;}
#foot_2 > div > a{display:inline-block;

color: #313946;

margin-left:20px;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 28px; /* 200% */
letter-spacing: -0.42px;

}


#foot_3 strong{
    
    color: #34404F;
display:inline-block;

font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.54px;
    
}


.single .internal_banner h3{

color: #FFF;
margin-top:0;
    position: relative; top:-40px;
font-size: 32px;
font-style: normal;
font-weight: 300;
line-height: 48px;
letter-spacing: -0.96px;
}

.single .internal_banner  .browse_link{margin-top:110px;}

.project_specs > div{display:block; margin-bottom:15px;}
strong{font-weight:700;}
#foot_3 p{
    
    color: #313946;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 28px;
letter-spacing: -0.42px;
    
}

#footer .wrapper > div {
    display: grid;
    grid-template-columns: 25% 40% 25%;
    gap: 5%;
}

.sp-lc-button-next, .sp-lc-button-prev{display:none!important;}

#footer{padding:40px 0;}

a{text-decoration:none;}
.slick-prev:hover, .slick-next:hover{cursor:pointer; opacity: 0.7; transition:0.3s;}
.slick-prev img, .slick-next img{width:28px}
.slick-prev {
    position: absolute;
    left: -50px;
    top: 200px;
    border: none;
    background: none;
    outline: none;
}
#logo-carousel-free-84.sp-lc-container .sp-logo-carousel {
    padding-top: 0!important;
    padding: 10px 0!important;
}
.case_studies_slider h2{font-weight:600; margin-bottom:80px;}

#foot_3 a > span{
    
    background:url(https://www.cphoodelectrical.co.uk/wp-content/uploads/2025/10/arrow-blue-2.png);
    display:inline-block;
    width:28px;height:20px;
    background-size:contain;
    position: relative;
    top:4px; left:10px;
    
    
}

.case_studies_slider p {
 
    color: #FFF;

font-size: 16px;
font-style: normal;
font-weight: 300;
line-height: 32px;
letter-spacing: -0.48px;
    
    
}

.big_pic_text h1{color: #313946;}
.slick-next {
    position: absolute;
    right: -50px;
    top: 200px;
    font-weight:600;
    border: none;
    background: none;
    outline: none;
}

.browse_link > span {
    background: url(https://www.cphoodelectrical.co.uk/wp-content/uploads/2025/10/arrow-white-2.png);
    display: inline-block;
    width: 28px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
    top: 3px;
    left: 11px;
}

a.small_menu_link:hover, a.big_menu_link:hover{opacity:0.6; transition:0.3s;}

.small_menu_link{
    
    color: #FFF;
display:block;
margin-bottom:15px;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.72px;
    
}

.big_menu_link{display:block;

color: #FFF;

margin-bottom:20px;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -1.08px;
}
.case_studies_slider h4{
color: #FFF;

max-height:35px; overflow:hidden;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.72px;
}


.menu_grid  .wrapper > div {
    display: grid;
  
     display: grid;
    grid-template-columns: 30% 30% 35%; /* Adjust these values as needed */
    gap: 5%; /* Optional: Adjust the gap between columns if needed */
    margin-top: 200px;
}

.case_studies_slider  a > span{
color: #FFF;
position: relative;
    top:-10px;
    display:block;
    padding-bottom:30px;
font-size: 20px;
font-style: normal;
font-weight: 300;
line-height: 36px;
letter-spacing: -0.6px;
}

.case_studies_slide p {
    
    

color: #FFF;

font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;
letter-spacing: -0.48px;
    
}

#case_studies_blocks span.secret_link > span {
    background: url(https://www.cphoodelectrical.co.uk/wp-content/uploads/2025/10/arrow-blue-2.png);
    display: inline-block;
    width: 28px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
    top: 3px;
    left: 11px;
}
#case_studies_blocks.red_section span.secret_link > span {
    background: url(https://www.cphoodelectrical.co.uk/wp-content/uploads/2025/10/arrow-white-5.png);
    display: inline-block;
    width: 28px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    position: relative;
    top: 3px;
    left: 11px;
}





#header_right > img{max-width:115px;}

#header_right > img:hover{opacity:0.7; transition:0.3s; cursor:pointer}

#header_right > a:nth-child(1){position:relative; top:-27px;}
#header_right > a:nth-child(2){position:relative; top:-20px;}
.mouse {
    
    position: absolute;
bottom: 200px;
left: 50%;
transform: translateX(-50%);
    z-index: 4;
    
}
.mouse img {
  display: block;
  max-width: 100%;
  height: auto;
  animation: bounce 1.2s ease-in-out infinite;
}

@keyframes bounce {
  0%   { transform: translateY(0); }
  25%  { transform: translateY(-12px); }
  50%  { transform: translateY(0); }
  75%  { transform: translateY(-6px); }
  100% { transform: translateY(0); }
}

/* Specific Heading Styles */

h1 {
    font-size: 48px;
    line-height: 1.2;
    margin-bottom: 24px; /* Extra space below larger headings */
    font-weight:600;
}

h2 {
    font-size: 36px;
    line-height: 1.3;
    margin-bottom: 20px;
}

h3 {
    font-size: 30px;
    line-height: 1.4;
    margin-bottom: 18px;
}

h4 {
    font-size: 24px;
    line-height: 1.4;
    margin-bottom: 16px;
}

h5 {
    font-size: 20px;
    line-height: 1.5;
    margin-bottom: 14px;
}

h6 {
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 12px;
}

/* Paragraph Styles */

p, .text ul li {
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 16px; /* Space between paragraphs */
}
.text ul {list-style:disc; padding-left:20px;}
.home_banner > img{    
        position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    height: 100%;
    z-index: 1;
    object-position: 50% 50%;}

.wrapper {display:block; max-width:1680px; margin:0 auto; position: relative; z-index: 2;}

.home_white_section{display:block; padding:100px 0; background:#fff;}

.home_white_section a {
    color: #273246;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.6px;
    border-radius: 50px;
    border: 1px solid #273246;
    padding: 15px 30px;
    margin-top:40px;
    display:inline-block;
}

.home_white_section .wrapper > span{max-width:900px; margin:0 auto; display:block; text-align: center;

color: #273246;

text-align: center;
font-size: 36px;
font-style: normal;
font-weight: 300;
line-height: 48px; /* 133.333% */
letter-spacing: -1.08px;

}

.three_case *, .four_case *{color:#000;}

#header_right > *{color:#fff;margin-left:40px; display:inline-block; position: relative;}

#header .wrapper > div{display:flex; justify-content: space-between;}

#header{
    padding:10px 0;
    width:100%;
    left:0;
    position: absolute;
    z-index: 11;
    background:url(https://www.cphoodelectrical.co.uk/wp-content/uploads/2025/10/header_trans.png);
    background-position: left center;
    background-size:cover;
   
}


#case_description p{
    
    
    color: #000;

font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;
letter-spacing: -0.48px;
}
#case_description ol, #case_description ul{
    
    
    color: #000;

font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 25px;
letter-spacing: -0.48px;
}

#case_description ul{list-style:disc; padding-left:20px;}

.line_link {
    display: block;
    text-align: right;
    width: 100%;
}

.line_link img {
width:28px;
    display:inline-block!important;
}


#header.active{background:none; transition:0.3s;}

#header.active .logo_white{display:block!important; transition:0.3s;}
#header.active .logo_dark{display:none;}

#logo{width:180px; display:block;}
#logo img{width:100%;}

.image img{
    
        
        position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    height: 100%;
    object-position: 50% 50%;
}

div#top_banner.internal_banner {
    padding-top: 140px;
}

.home_banner > .grady{background:#00000080; position: absolute; left:0; top:0;
width:100%; height:100%; z-index: 1; 
}

#home_split{display:block; width:100%; }

.internal_banner > div > div{position:relative;}

#home_split > div{   display: grid;
    position: relative;
    height:1000px;
    grid-template-columns: repeat(2, 1fr);
    gap: 0px; /* Adjust the gap between grid items as needed */}
#home_split > div > div{padding:150px; text-align:center;position: relative;}

#home_split > div img{

    
        position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    height: 100%;
    object-position: 50% 50%;

}

.internal_banner h5{
    
    color: #FFF;


font-size: 20px;
font-style: normal;
font-weight: 300;
line-height: normal;
letter-spacing: -0.6px;
}

 .big_pic_text h5{
    
    color: #000;


font-size: 20px;
font-style: normal;
font-weight: 300;
line-height: normal;
letter-spacing: -0.6px;
}

.internal_banner > div{
    
    
     display: grid;
    grid-template-columns: 700px auto; /* Adjust these values as needed */
    gap: 40px; /* Optional: Adjust the gap between columns if needed */
    
}

#case_studies_blocks{display:block; width:100%; padding:60px 0;}

.internal_banner > div .text {
    margin-left: 125px;
    text-align: left;
    padding-right: 40px;
    border-right: 1px solid #ffffff50;
}

.three_case{   display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 70px; /* Adjust the gap between grid items as needed */}


.four_case{   display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px; /* Adjust the gap between grid items as needed */}

#big_menu{
    
    
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:url(https://www.cphoodelectrical.co.uk/wp-content/uploads/2025/10/Component-1.jpg);
    background-size:cover;
    z-index: 10;
    
}

.internal_banner p{
    
    
    color: #FFF;

font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 32px;
letter-spacing: -0.54px;
    
}

#menu_2 .big_menu_link, #menu_3 .big_menu_link{border-bottom:1px solid #ffffff60;padding-bottom: 30px;margin-bottom:40px; display:block;}
 div#menu_1 {
    border-right: 1px solid #ffffff60;
}

#menu_3{border-left:1px solid #ffffff60;padding-left:40px;}

.internal_banner > div .text h1{margin:60px 0 40px 0; text-shadow:none!important;}
.internal_banner > div .text > span{border:1px solid #ffffff50; border-left:0; border-right:0; display:block;padding-bottom:20px; min-height: 355px}

.contact_split h3{font-weight:600; color:#313946;}
.contact_split{
    
    
     display: grid;
    grid-template-columns: 35% 65%; /* Adjust these values as needed */
    gap: 0px; /* Optional: Adjust the gap between columns if needed */
    
}

.contact_split > div:first-child span strong{font-weight:600;}
.contact_split > div:first-child span{
    margin-bottom:40px;
    display:block;
    color: #313946;
font-family: "Noto Sans";
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;
letter-spacing: -0.48px;
    
    
}

.contact_split > div:last-child{padding-left:40px; border-left:1px solid #00000060;}

.internal_banner.full_height > div .text > span{border-bottom:0;}

#top_banner h1{
    
    
    color: #FFF;


text-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
/*font-family: Arvo;*/
font-size: 48px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -1.44px;
    
}

.home_banner > span img{width:300px; display:block; margin:0 auto 30px auto;}

.internal_banner.full_height .image{max-height:100%; height:100%;}
.internal_banner .image{max-height:400px; height:400px;}

div#top_banner.full_height {
    padding-bottom: 40px;
}
.home_banner > span{
    text-align: center;
     position: absolute;
  top: 40%;
    z-index: 3;
  left: 50%;
  transform: translate(-50%, -50%);
    
}
#top_banner{width:100%; position:relative; display:block;min-height:580px;}

.home_banner{height:1000px; max-height:1000px;}

.numbers_block{position:relative;}

.numbers_block > img{
        
        position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    height: 100%;
    object-position: 50% 50%;
    
}

.numbers_block > span  strong{
    
    color: #273246;


font-size: 96px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -2.88px;
    
    
}
.numbers_block > span > div{
    
    color: #273246;
margin-bottom:30px;

font-size: 48px;
font-style: normal;
font-weight: 300;
line-height: 48px; /* 100% */
letter-spacing: -1.44px;
}

.numbers_block > span > div:last-child{
    
margin-bottom:0px; 
}


.numbers_block > span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70%;
    text-align: left;
}

.about_split{
       display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 100px; /* Adjust the gap between grid items as needed */
    
    
}

.big_pic_text{display:block; width:100%; padding:40px 0;}

.big_pic_text > div{ 

     display: grid;
    grid-template-columns: auto 600px; /* Adjust these values as needed */
    gap: 40px; /* Optional: Adjust the gap between columns if needed */
    

}


#copyright .wrapper{padding:10px 0; border-top:1px solid #00000060;}

#copyright, #copyright a{
    
    color: #000;


font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 28px; /* 233.333% */
letter-spacing: -0.36px;
    
}

.image{position:relative;}
.case_studies_slider{padding:90px 0; width:100%; display:block;}

.case_studies_slider .wrapper > h3{font-weight:600; margin-bottom:60px;}

.big_pic_text .image{height:800px; position:relative;}

.big_pic_text .image > img{
    
        
        position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    height: 100%;
    object-position: 50% 50%;
    
    
}

.big_pic_text .pic_last { grid-template-columns:  600px auto;}



.big_pic_text .pic_last .text{order:-1;    }
.big_pic_text .text{
    position: relative;
    border-left: 1px solid #00000060;
    padding-left: 40px;
 
    
}

.pic_last .text {
    border-right: 1px solid #00000060;
}

.red_section *, .blue_section *{color:#fff!important;border-color:#ffffff60!important;}

.big_pic_text .text a {
    position: absolute;
    bottom: 0;
  
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.6px;
    padding-bottom: 20px;
    border-bottom: 1px solid #00000060;
    width: 100%;
    left: 0;
    padding-left: 0px;
    max-width:480px;
    margin-left:40px;
}

.big_pic_text .text a > span{display:inline-block; width:28px; height:20px; background:url(https://www.cphoodelectrical.co.uk/wp-content/uploads/2025/10/arrow-white-5.png); background-size:contain; position: relative;
    
        top: 4px;
    left: 10px;
    }


.big_pic_text  p{

color: #313946;

font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;
letter-spacing: -0.48px;
}

.big_pic_text  ul li{
    margin-bottom:0px;
   

font-style: normal;



    
    color: #313946;

font-size: 16px;

font-weight: 400;
line-height: 32px;
letter-spacing: -0.48px;
    
    
}

.big_pic_text .text > span {
    display: block;
    max-width: 487px;
    border: 1px solid #00000060;
    border-left: 0;
    border-bottom: 0;;
    border-right: 0;
    padding: 60px 0 20px 0;
}


.three_case a, .four_case a{position: relative;}

.three_case .image{height:330px;}
.four_case .image{height:250px;}
#case_studies_blocks h2, .four_case h2 {
    font-weight: 600;
    color: #313946;
    margin: 50px 0 0 0;
    font-size:30px;
}


#case_studies_blocks h4, .four_case h4{
    
    color: #313946;
position: relative;
    top:-10px;
font-size: 24px;
font-style: normal;
font-weight: 300;
line-height: 48px;
letter-spacing: -0.72px;
    
}

#case_studies_blocks p, .four_case p{
    
    
    color: #313946;

font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;
letter-spacing: -0.48px;
    
}

#single_study{display:block; padding:100px 0;}

#single_study .wrapper > div{   display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px; /* Adjust the gap between grid items as needed */}

#case_studies_blocks h5, .four_case h5{
    
    color: #313946;
padding-bottom:10px;
border-bottom:1px solid #00000060;
font-size: 20px;
font-style: normal;
font-weight: 300;
line-height: normal;
letter-spacing: -0.6px;
    
}


#case_gallery {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 3%;
    padding-right: 52px;
    border-right: 1px solid #00000060;
}


#case_gallery .gallery_row:nth-child(odd){
    
     display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2%; 
    
    
}

#case_gallery .gallery_row img{
    
        
        position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    height: 100%;
    object-position: 50% 50%;
}
#case_gallery .gallery_row:nth-child(odd) .image{height:167px; }
#case_gallery .gallery_row:nth-child(even) .image{height:267px; }


#case_gallery .gallery_row:nth-child(even){
    
   display: grid;
    grid-template-columns: 23% 23% 50%; /* Adjust these values as needed */
    gap: 2%; /* Optional: Adjust the gap between columns if needed */
    
}

#alternating_text_pic{display:block; width:100%; padding:40px 0;}


#alternating_text_pic > div:nth-child(even) > div{
    
    grid-template-columns: 600px auto;
    
    
}




#alternating_text_pic > div:nth-child(even) .text{order:-2; border-right:1px solid #00000060;}

.big_pic_text h3{
    margin-bottom:40px;
    margin-top:-25px;
    color: #FFF;

font-size: 32px;
font-style: normal;
font-weight: 300!important;
line-height: 48px;
letter-spacing: -0.96px;
    
}
.gradient_strip{width:100%; display:block; height:15px; background: linear-gradient(90deg, #3A65AD 0%, #FFF 50.14%, #E81D30 100%);}
.four_slider .image{width:100%; display:block; height:250px;}


#test_strip{width:100%; display:block; position: relative;padding:100px 0;}

#test_strip > img{    
        position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    height: 100%;
    object-position: 50% 50%;}

#test_strip .wrapper > span{max-width:1000px; margin:0 auto; display:block;}

#test_strip h6{
    margin-top:50px;
color: #FFF;
text-align: center;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 48px;
letter-spacing: -0.72px;
    
}

#plain{padding:60px 0; display:block; margin:0 auto;}

#test_strip h1{
    
    
    color: #FFF;

text-align: center;
text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);

font-size: 48px;
font-style: normal;
font-weight: 300;
line-height: 64px; /* 133.333% */
letter-spacing: -1.44px;
}

#test_strip h2{
    
    
    color: #FFF;

text-align: center;
text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);

font-size: 36px;
font-style: normal;
font-weight: 300;
line-height: 48px; /* 133.333% */
letter-spacing: -1.08px;
}

#test_strip > .grady{
    
    width:100%; height:100%;
    position: absolute; 
    background:#304A7980;
    left:0; top:0;
    z-index: 1;
}

#case_description h3{
    color: #000;


font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 32px; /* 133.333% */
letter-spacing: -0.72px;
    
    
}

.line_link {
    display: block;
    padding: 15px 0;
    border-bottom: 1px solid #ffffff60;
}


#values_blocks{display:block; padding:60px 0 100px 0;}

#values_blocks .wrapper > div{padding:0 50px; border-left:1px solid #00000060}

#values_blocks h1{
color: #273246;
margin-top:20px;
/*font-family: Arvo;*/
font-size: 64px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -1.92px;
    
}
div#popup-description {
    padding-bottom: 30px;
}
#team_filter{padding:80px 0; width:100%; display:block;}

#tab_block {
    display: grid;
    grid-template-columns: 13% 85%;
    gap: 20px;
}

#flex_pop {display:flex; align-content: space-between;margin-bottom:20px;}

#flex_pop > img{width:135px;}
.popup-inner{ display: grid;
    grid-template-columns: 35% 63%; /* Adjust these values as needed */
    gap: 2%; /* Optional: Adjust the gap between columns if needed */}


.popup-inner .role{
    color: #313946;

font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px; /* 200% */
letter-spacing: -0.48px;
    
}

.popup-inner h3 {
    color: #313946;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.6px;
    margin-bottom: 0;
    margin-top: 20px;
}

  .popup {
  display: none;
  position: fixed;
  z-index: 999999; /* increase this value */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.7);

  }
  .popup-content {
    background: #fff;
    margin: 5% auto;
    padding: 20px;
    width: 90%;
    max-width: 1000px;
  
    position: relative;
  }
  .popup-close {
    position: absolute;
    top: 10px;
    right: 20px;
    cursor: pointer;
    font-size: 22px;
    font-weight: bold;
  }


.team-member:hover{cursor:pointer;  transtion:0.3s;}

.team-member:hover .grady{opacity:0; transition:0.3s;}
.team-member:hover img{    filter: grayscale(0%);
  transition: filter 0.4s ease;}
.team-member .image{
    
    aspect-ratio:1 / 1;
    
}

.team-member img{
    
      filter: grayscale(100%);
  transition: filter 0.4s ease;
    
}

.team-member .image .grady {
    background: rgba(28, 102, 236, 0.25);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.team-member .image .grady{
    
    background: rgba(28, 102, 236, 0.25);
    
}

.team-members{   display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 50px; /* Adjust the gap between grid items as needed */}
.team-member h3{


color: #313946;


font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.54px;
}

.tab-content {
    padding-left: 30px;
    border-left: 1px solid #00000060;
}
.team-member .role{border-bottom:1px solid #00000060;



color: #313946;


font-size: 13px;
font-style: normal;
font-weight: 400;
line-height: 32px; /* 213.333% */
letter-spacing: -0.45px;
}

.tabs button{color: #313946;
opacity:0.4;
display:block;
    background:transparent;
    border:none;
    padding:0;
    outline:none;
font-size: 24px;
    cursor:pointer;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -0.72px;
        margin-bottom: 25px;
    max-width: 150px;
    text-align: left;
}
.tabs button.active{opacity:1;}
#values_blocks p{
    color: #000;
/*font-family: "Noto Sans";*/
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px; /* 200% */
letter-spacing: -0.48px;
      position: relative;
    top:20px;
    
}

#values_blocks .wrapper > div > div{ display: grid;
    border-bottom:1px solid #00000060;
    
  
    grid-template-columns: 30% 65%; /* Adjust these values as needed */
    gap: 5%; /* Optional: Adjust the gap between columns if needed */}