/*
font-family: 'Roboto', sans-serif;
font-family: 'Roboto Mono', monospace;
font-family: 'Roboto Slab', serif;
*/


@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@600&family=Roboto+Slab:wght@400;500;700&family=Roboto:wght@300;400;500;700&display=swap');

*{
	margin: 0px;
	padding: 0px;
}

.fixit {
position: fixed;
top: 0px;

}

img{
	border:0px;
	}
	
a{-webkit-transition: 300ms linear 0s; -moz-transition: 300ms linear 0s; -o-transition: 300ms linear 0s; transition: 300ms linear 0s; outline: 0 none; text-decoration: none; }

ul{ padding: 0px; margin: 0px; list-style: none; }
	
/*The reason for this is to prevent "centering jumps" when navigating back and forth between 
pages with enough content to have a vertical scroll bar and pages that do not.*/

html {
overflow-y: scroll;
}
/*centering jump ends*/


html {  -webkit-font-smoothing: subpixel-antialiased; -webkit-text-stroke:1px transparent;  z-index: 7;}


/*content wrapper for fade effect starts*/
#content-wrapper{
display:none;	
}
/*content wrapper for fade effect ends*/


/* Force WOWSlider to display correctly */
#wowslider-container1 {
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.ws_images {
    width: 100% !important;
}

.ws_images img {
    width: 100% !important;
    height: auto !important;
}


/*SWAP BACK AFTER XMAS:*/

body{margin: 0; padding: 0px; font-family: 'Roboto', sans-serif; text-align: center; -webkit-text-size-adjust: 100%;
 text-rendering: optimizeLegibility; background-color: #fff;
width: 100%;  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
 background-attachment: fixed; background-image:url("../images/bg2.jpg");}



/*XMAS BODY REMOVE AFTER XMAS
body{margin: 0; padding: 0px; font-family:'DIN Next W01 Medium'; text-align: center; -webkit-text-size-adjust: 100%;
 change below to fixed or scroll text-rendering: optimizeLegibility; background-color: #fff;
width: 100%; -moz-background-size:cover;-webkit-background-size:cover;-o-background-size:cover;background-size:cover;background-attachment:fixed; background-image:url("../images/xmasbkg.jpg");}*/


/*XMAS SNOW STARTS

.snowflake {
    position: fixed;
    top: -10px;
    color: white;
    font-size: 1em;
    animation: fall linear infinite;
    z-index: 800;
    pointer-events: none; /* Allows touch/click events to pass through
}

@keyframes fall {
    0% {
        transform: translateY(0) translateX(0);
        opacity: 1;
    }
    100% {
        transform: translateY(100vh) translateX(30px);
        opacity: 0;
    }
}
*/


/*CTA STARTS*/

/* Shake animation - existing button */
@keyframes shake-attention {
  0% { transform: rotate(0deg); }
  2%, 6%, 10%, 14%, 18%, 22%, 26% { transform: rotate(-2deg); }
  4%, 8%, 12%, 16%, 20%, 24% { transform: rotate(2deg); }
  28.5%, 100% { transform: rotate(0deg); }
}

/* Shake animation - book button (delayed so they don't sync) */
@keyframes shake-attention-book {
  0%, 40% { transform: rotate(0deg); }
  42%, 46%, 50%, 54%, 58%, 62%, 66% { transform: rotate(-2deg); }
  44%, 48%, 52%, 56%, 60%, 64% { transform: rotate(2deg); }
  68.5%, 100% { transform: rotate(0deg); }
}

/* Wrapper positions both buttons together as a group */
.side-cta-wrapper {
  position: fixed;
  left: 0;
  top: 40%;
  transform: translateY(-40%);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Remove fixed positioning from individual buttons - wrapper handles it */
.side-cta {
  position: relative;
  left: auto;
  top: auto;
  transform: none;
  z-index: auto;
}

.side-cta:first-child {
  animation: shake-attention 7s ease-in-out infinite;
}

.side-cta--book {
  animation: shake-attention-book 7s ease-in-out infinite;
}

.side-cta a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #91C846;
  color: #ffffff;
  text-decoration: none;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
  padding: 28px 16px;
  border-radius: 8px 0 0 8px;
  box-shadow: -3px 0 10px rgba(0,0,0,0.25);
  gap: 14px;
  transition: background-color 0.3s ease;
}

.side-cta a:hover {
  background-color: #494949;
}

/* Book button uses teal as default, green on hover */
.side-cta--book a {
  background-color: #0099af;
}

.side-cta--book a:hover {
  background-color: #494949;
}

.side-cta__label {
  font-size: 25px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.side-cta__number {
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 2px;
  white-space: nowrap;
}

/* Add this alongside your existing CTA CSS */
.side-cta__icon {
  font-size: 22px;
  margin-bottom: 4px;
  /* Icon rotated back to upright since the container is rotated 180deg */
  transform: rotate(180deg);
}

/*CTA ENDS*/






/*Master Container Starts*/
#master-container {
	width: 1200px;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
	text-align: left;/*this overrights  ie5 text align box model error*/
	-webkit-font-smoothing: subpixel-antialiased;
	text-rendering: geometricPrecision;
	background-color: #fff;
	border-bottom: 3px solid #91C846;	
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); /* Soft shadow */
	}
	/*Master Container Ends*/


/*Top Nav Starts*/
.top-nav{float: left; width: 1200px; padding: 16px 0px; background: #494949; border-top: 3px solid #91C846;}
.top-nav li{display: inline;}
.top-nav li a{font-family: 'Roboto'; font-style: normal; font-weight: 500; font-size: 20px;
text-transform: uppercase; color: #a4a4a4; margin-left: 84px;}
.top-nav li a:hover{color: #91C846;}
.top-nav li #current{ color: #AEDED8;}
/*Top Nav Ends*/


/*Banner Content Starts*/
.banner{float: left; width: 1100px; padding: 20px 50px 5px 50px; background: #363637;}

.master-logo{float: left; width: 400px; height: 148px; }

/*Telephone Content Starts*/
.telsh{float: right; width: 254px; margin-right: 20px;}
.telh{float: left; width: 254px; margin-bottom: 15px;}
.telhl{float: left; width: 60px; margin-right: 10px;}
.telhr{float: right; width: 184px;}
.gtel{font-family: 'Roboto'; font-style: normal; font-weight: 500; color: #91C846; font-size: 24px; display: block; margin-bottom: 5px;}
.graytel{font-family: 'Roboto'; font-style: normal; font-weight: 500; color: #a4a4a4; font-size: 24px; display: block; margin-bottom: 5px;}
.graytel a{font-family: 'Roboto'; font-style: normal; font-weight: 500; color: #a4a4a4; font-size: 24px; display: block; margin-bottom: 5px;}
/*Telephone Content Ends*/

/*Calls To Actions Starts*/
.calltoactions{width: 300px; float: right;}

.fbut2 a, .fbut3 a, .fbut4 a{ width: 260px; display: block; margin-bottom: 8px; padding: 10px 20px; border-radius: 20px; font-family: 'Roboto Slab';font-style: normal; font-weight: 700; font-size: 18px; line-height: 24px; color: #363637; background-image: url(../images/icons/cta-arrow.png); background-repeat: no-repeat; background-position: 95% 50%;}

.fbut2 a{ background-color: #91C846;}
.fbut2 a:hover{ background-color: #ccc;}

.fbut3 a{background-color: #92EBFE;}
.fbut3 a:hover{ background-color: #ccc; color: #000;}


.fbut4 a{background-color: #F3F031;}
.fbut4 a:hover{ background-color: #ccc; color: #000;}

.fbut5 a{background-color: #61BEB6;}
.fbut5 a:hover{ background-color: #ccc; color: #000;}
.fbut5 a{ width: 260px; display: block; margin-bottom: 8px; padding: 10px 20px; border-radius: 20px; font-family: 'Roboto Slab';font-style: normal; font-weight: 700; font-size: 16px; line-height: 24px; color: #363637; background-image: url(../images/icons/cta-arrow.png); background-repeat: no-repeat; background-position: 95% 50%;}

/*Calls To Actions Ends*/

.tstrap{float: left; width: 1100px; padding: 10px 0px; text-align: center; font-family: 'Roboto'; font-style: normal; font-weight: 500; font-size: 16px; color: #a4a4a4;}

/*Banner Content Ends*/


/*Rotator Starts*/
.rotator{float:left; width: 1200px; height: 541px;}
/*Rotator Ends*/

/*Titles Starts*/
.titles{float:left; width: 1100px; padding: 20px 50px; background: #494949;}
.titles h1{color: #AEDED8; font-family: 'Roboto Slab'; font-style: normal; font-weight: 400; font-size: 20px; line-height: 32px;}
.titles h2{color: #fff; font-family: 'Roboto Slab'; font-style: normal; font-weight: 400; font-size: 17px; line-height: 27px;}
/*Titles Ends*/

/*Home Copy Starts Here*/
.hcopy{float:left; width: 1100px; padding: 50px; background: #91C846;}
.hcopyl{float:left; width: 450px;}
.hcopyr{float:right; width: 500px; margin-top: 15px; margin-right: 50px;}
.hcopyl h3{font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 300; font-size: 40px; line-height: 50px;}
.hcopyr p{font-family: 'Roboto Slab'; color: #fff; font-style: normal; font-weight: 300; font-size: 17px; line-height: 25px; display: block; margin-bottom: 20px;}
.hcopyr p bold{font-family: 'Roboto Slab'; color: #fff; font-style: normal; font-weight: 400; font-size: 17px; line-height: 25px; display: block; margin-bottom: 20px;}
/*Home Copy Ends Here*/

/*Home Services Starts Here*/
.hservices{float:left; width: 1100px; padding: 20px 50px 50px 60px;}
.hststrips{float:left; width: 1100px; text-align: center; margin: 60px 0px 50px 0px;}
.green-title{font-family: 'Roboto Slab'; color: #91C846; font-style: normal; font-weight: 400; font-size: 37px; line-height: 25px; text-transform: uppercase; display: block; margin-bottom: 20px;}
.turquoise-title{font-family: 'Roboto Slab'; color: #61BEB6; font-style: normal; font-weight: 400; font-size: 37px; line-height: 25px; text-transform: uppercase; display: block; margin-bottom: 20px;}
.light-blue-title{font-family: 'Roboto Slab'; color: #92EAFE; font-style: normal; font-weight: 400; font-size: 37px; line-height: 25px; text-transform: uppercase; display: block; margin-bottom: 20px;}
.hststrips p{font-family: 'Roboto Slab'; font-style: normal; font-weight: 400; font-size: 17px; line-height: 25px; color: #8b8b8b; margin-bottom: 20px;}


/*Home Block Navigation System Starts Here*/
.hstript{ width: 1100px; float: left;}
.hstrip{ width: 1100px; float: left; margin-bottom: 30px;}


/*Temporary home page areas covered accorians Starts Here*/
.isstriph{width: 1100px; float: left; margin: 20px 0px; background-color: #91C846;}
.isstriph h3{font-family: 'Roboto'; color: #000; font-style: normal; font-weight: 300; font-size: 50px; line-height: 55px; display: block; margin-bottom: 30px;}
.isstriph h4{font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 300; font-size: 25px; line-height: 30px; display: block; margin-bottom: 20px;}


/*INSIDE CONTENT STARTS HERE*/
.inside-container{width: 1100px; float: left; padding: 60px 50px 30px 50px;}
.isstrip{width: 1100px; float: left; margin-bottom: 80px;}
.isstrip img{border-radius: 16px;}
.insleft{width: 530px; float: left;}
.insright{width: 530px; float: right;}
.isstrip h3{font-family: 'Roboto'; color: #91C846; font-style: normal; font-weight: 300; font-size: 50px; line-height: 55px; display: block; margin-bottom: 30px;}
.isstrip h4{font-family: 'Roboto'; color: #91C846; font-style: normal; font-weight: 300; font-size: 25px; line-height: 30px; display: block; margin-bottom: 20px;}
.isstrip h5{font-family: 'Roboto'; color: #91C846; font-style: normal; font-weight: 700; font-size: 22px; line-height: 27px; display: block; margin-bottom: 15px;}
.isstrip h6{font-family: 'Roboto'; color: #91C846; font-style: normal; font-weight: 300; font-size: 20px; line-height: 26px; display: block; margin-bottom: 10px;}
.sub-green{font-family: 'Roboto'; color: #91C846; font-style: normal; font-weight: 300; font-size: 25px; line-height: 28px; display: block; margin-bottom: 10px;}
.sub-blue{font-family: 'Roboto'; color: #61BEB6; font-style: normal; font-weight: 300; font-size: 25px; line-height: 28px; display: block; margin-bottom: 10px;}
.isstrip p{font-family: 'Roboto Slab'; color: #8b8b8b; font-style: normal; font-weight: 300; font-size: 14px; line-height: 22px; display: block; margin-bottom: 30px;} 
.isstrip p a{font-family: 'Roboto Slab'; color: #91C846; font-style: normal; font-weight: 300; line-height: 22px;}
.isstrip p strong{font-family: 'Roboto Slab'; color: #999999; font-style: normal; font-weight: 700; font-size: 18px; line-height: 25px; display: block;} 
.isstrip li{font-family: 'Roboto Slab'; color: #000; font-style: normal; font-weight: 300; font-size: 14px; line-height: 22px; display: block; margin-bottom: 15px;}
.isstrip ul{margin-bottom: 30px;}
.isgreen{font-family: 'Roboto'; color: #91C846; font-style: normal; font-weight: 300; font-size: 34px; line-height: 38px; display: block; margin-bottom: 15px;}
.isblue{font-family: 'Roboto'; color: #61BEB6; font-style: normal; font-weight: 300; font-size: 34px; line-height: 38px; display: block; margin-bottom: 15px;}
.imgpush{margin-bottom: 30px;}

.isstrip p a, .isstrip h3 a, .isstrip h4 a, .isstrip h5 a, .isstrip h6 a, .sub-green a, .sub-blue a, .isstrip li a{color: #91C846; text-decoration: underline;}

.isstrip hr {
    display: block;
    height: 1px;
    border-top: 1px dashed #949494;
    margin: 1.5em 0;
    padding: 0;
    border-bottom: 0;
    border-right: 0;
    border-left: 0;
    float: left;
    width: 100%;
}


/*ten good reasons starts*/
.tgrholder{width: 480px; padding: 30px; float: right; background-color: #CEE86D;}
.tgrtop{width: 460px; float: left; border-bottom: 1px solid #fff; padding-bottom: 8px; margin-bottom: 10px;}
.ten{width: 114px; float: left; font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 300; font-size: 100px; display: block;}
.tttxt{width: 324px; float: right; font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 400; font-size: 42px; line-height: 45px;  display: block; margin-top: 12px;}
.ttstxt{float: left; width: 460px; margin-top: 10px;}
.ttblue{color: #61BEB6; font-family: 'Roboto'; font-style: normal; font-weight: 500; font-size: 22px; line-height: 26px;}
.ttwhite{color: #fff; font-family: 'Roboto'; font-style: normal; font-weight: 500; font-size: 22px; line-height: 26px; margin-right: 15px;}
.tgrholder p{display: block; margin-bottom: 8px; padding-left: 30px; color: #000;}
.ttstxtc{float: left; width: 460px; margin-top: 10px;}
.islgb{font-family: 'Roboto'; color: #61BEB6; font-style: normal; font-weight: 300; font-size: 36px; line-height: 40px; display: block; margin-bottom: 15px;}

/*GLASS PARTITIONS LIST NAV STARTS HERE*/
.gpartitions-nav{width: 480px; float: left; display: block; margin-bottom: 40px;}
.gpartitions-nav li a{ display: block; margin-bottom: 10px; font-family: 'Roboto'; color: #64D0C1; font-style: normal; font-weight: 600; font-size: 20px; line-height: 28px;}
.gpartitions-nav li a:hover{color: #91C846;}

/*INSIDE CONTENT LIST STARTS HERE*/
.strip-lists{float: left; width: 530px; padding-left: 10px; margin-bottom: 30px;}
.strip-lists li{font-family: 'Roboto Slab'; color: #8b8b8b; font-style: normal; font-weight: 300; font-size: 16px; display: block; margin-bottom: 15px; background-image: url("../images/icons/green-tick3.png"); background-position: left center; background-repeat: no-repeat; padding-left: 30px;}

/*LIST SECTION BLUE STARTS HERE*/
.lsectblue{width: 1150px; float: left; padding: 60px 0px 60px 50px; background-color: #92EBFE; background: linear-gradient(123deg, #20828f 9.28%, #91C846 50.81%); margin-bottom: 30px; }
.lsectitle{width: 1100px;float: left; font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 300; font-size: 55px; line-height: 60px; display: block; margin-bottom: 30px;}
.lsect3collh{width: 1100px; float: left;}
.lsect3col{width: auto; float: left; margin-right: 50px;}
.lsect3col li{font-family: 'Roboto Slab'; color: #000; font-style: normal; font-weight: 300; font-size: 13px; line-height: 16px; display: block; margin-bottom: 12px;}
/*LIST SECTION BLUE ENDS HERE*/

/*AUTO GLASS DISCLAIMER STARTS HERE*/
.auto-glass{width: 1100px; float: left; text-align: center; background: #d0f3fb; padding: 30px 0px; background-image: url("../images/universal/no-auto-glass.jpg");}
.auto-glass h5{font-family: 'Roboto'; color: #5ba39a; font-style: normal; font-weight: 600; font-size: 32px; display: block; margin-bottom: 8px;}
.pn-green{font-family: 'Roboto'; color: #79c167; font-style: normal; font-weight: 400; font-size: 32px;}
.auto-glass p{font-family: 'Roboto Slab'; color: #5ba39a; font-style: normal; font-weight: 300; font-size: 14px; line-height: 21px; display: block; margin-bottom: 8px;}
/*AUTO GLASS DISCLAIMER ENDS HERE*/

/*COLOUR CHARTS START HERE*/
.swatch-container {padding: 10px; overflow: hidden; width: 1000px; margin-left: 50px;}
.swatch-list {width: 80px;height: 140px;overflow: hidden;padding: 20px;text-align: center;float: left;}
.swatch-name, .bs-code {font-family: 'Roboto';font-style: normal; font-weight: 300;color: #999;font-size: 0.8em;margin-top: 10px;text-transform: uppercase;}
.swatch {width: 80px;height: 80px;border-radius: 38px 38px 0px 38px;}
/*COLOUR CHARTS END HERE*/


/*Enquire Actions Starts*/
.etoactions{width: 530px; float: left; margin-top: 30px;}
.ebut1 a, .ebut2 a{ width: 490px; display: block; margin-bottom: 12px; padding: 10px 20px; border-radius: 20px; font-family: 'Roboto Slab';font-style: normal; font-weight: 700; font-size: 18px; line-height: 24px; color: #363637; background-image: url(../images/icons/vta-arrow.png); background-repeat: no-repeat; background-position: 96% 50%;}
.ebut1 a{ background-color: #CEE86D;}
.ebut1 a:hover{ background-color: #ccc;}
.ebut2 a{background-color: #64D0C1;}
.ebut2 a:hover{ background-color: #ccc; color: #000;}
/*Enquire Actions Ends*/


/*Enquire Actions Starts*/
.learn-more-but{width: 300px; margin-top: 30px; display: block;}
.lmbut2 a{ width: auto; display: block; margin-bottom: 12px; padding: 8px 15px; border-radius: 20px; font-family: 'Roboto Slab';font-style: normal; font-weight: 700; font-size: 16px; line-height: 24px; color: #363637; background-image: url(../images/icons/vta-arrow.png); background-repeat: no-repeat; background-position: 96% 50%;}
.lmbut2 a{background-color: #EAEAEA;}
.lmbut2 a:hover{ background-color: #ccc; color: #000;}
/*Enquire Actions Ends*/


/*TESTIMONIALS INSIDE PAGE SECTION STARTS HERE*/
.testth{float: left; width: 1100px; text-align: center;}
.testinonial-h{float: left; width: 1100px; margin-bottom: 50px;}
.testinonial-h p{ font-family: 'Roboto Slab'; color: #8b8b8b; font-size: 14px; font-weight: 300; line-height: 22px;}
.tlefth{width: 348px; margin-right: 24px; float: left; background-color: #fff; border: solid 1px #DBDBDB;}
.trighth{width: 348px; float: right; background-color: #fff; border: solid 1px #DBDBDB;}
.ttop{width: 348px; float: left; height: 86px;}
.ttopb{width: 348px; float: right; height: 65px;}
.ttcopy{ width: 310px; float: left; padding: 5px 20px;}
.tttitle{font-family: 'Roboto'; color: #91C846; font-size: 18px; font-weight: 400; line-height: 22px; display: block; margin-bottom: 10px;}
.tbold{ font-family: 'Roboto Slab'; color: #91C846; font-size: 14px; font-weight: 500; line-height: 21px;}
/*TESTIMONIALS INSIDE PAGE SECTION ENDS HERE*/

/*INSIDE CONTENT ENDS HERE*/


/*MEET THE TEAM CONTENT STARTS HERE*/
.mtt-title{width: 1100px; float: left; text-align: center;}
.mtt-title h3{font-family: 'Roboto'; color: #61BEB6; font-style: normal; font-weight: 300; font-size: 70px; display: block; margin-bottom: 20px;}
.mtt-title p{font-family: 'Roboto Slab'; color: #8b8b8b; font-style: normal; font-weight: 300; font-size: 19px; line-height: 30px; display: block; margin-bottom: 50px;}
.mtt-strips{width: 1100px; float: left; margin-bottom: 40px;}
.mtt-stripst{width: 1100px; float: left; margin-bottom: 70px;}
.mtt-imgsl{width: 340px; height: 340px; margin-right: 40px; float: left;}
.mtt-imgsr{width: 340px; height: 340px; float: right;}
.mtt-tblockl{width: 340px; margin-right: 40px; float: left;}
.mtt-tblockr{width: 340px; float: right;}
.mtt-tblocknum{text-align: center; font-family: 'Roboto'; color: #61BEB6; font-style: normal; font-weight: 300; font-size: 80px; display: block; margin-bottom: 20px}
.mtt-tblockt{text-align: center; font-family: 'Roboto'; color: #91C846; font-style: normal; font-weight: 300; font-size: 30px; line-height: 35px; display: block; margin-bottom: 20px}
.mtt-tblocktb{font-family: 'Roboto Slab'; color: #8b8b8b; font-style: normal; font-weight: 300; font-size: 14px; line-height: 25px; text-align: center;}
/*MEET THE TEAM CONTENT ENDS HERE*/

/*ENERGY EFFICIENT CONTENT STARTS HERE*/
.energy-efficient{float: left; width: 1200px; height: 541px; background-image: url("../images/hp/energy-efficient-bk.jpg"); border-bottom: 6px solid #91C846; border-top: 6px solid #91C846;}
.egcoph{float: left; width: 800px; margin: 50px 0px 0px 50px; }
.enlg{font-family: 'Roboto'; color: #20828f; font-style: normal; font-weight: 300; font-size: 60px; line-height: 65px; display: block; margin-bottom: 20px;}
.ensub{font-family: 'Roboto'; color: #20828f; font-style: normal; font-weight: 400; font-size: 36px; line-height: 41px; display: block; margin-bottom: 25px;}
.egcoph p{font-family: 'Roboto Slab'; color: #231f20; font-style: normal; font-weight: 300; font-size: 16px; line-height: 27px;}
/*ENERGY EFFICIENT CONTENT ENDS HERE*/

/*Residential Service Links Start Here*/
.hmblinksl{ width: 250px; height: auto; float: left; margin: 0px 30px 0px 0px; text-align: center;}
.hmblinksl a{ font-family: 'Roboto Slab'; color: #75a730; font-style: normal; font-weight: 500; font-size: 22px; line-height: 25px; display: block; padding: 18px 18px 13px 18px; height: 60px; background: #CEE86D;}
.hmblinksl a:hover{ background-color: #91C846; color: #CEE86D;}
.hmblinksr{ width: 250px; height: auto; float: left; margin: 0px; text-align: center;}
.hmblinksr a{ font-family: 'Roboto Slab'; color: #75a730; font-style: normal; font-weight: 500; font-size: 22px; line-height: 25px; display: block; padding: 18px 18px 13px 18px; height: 60px; background: #CEE86D;}
.hmblinksr a:hover{ background-color: #91C846; color: #CEE86D;}
/*Residential Service Links End Here*/

/*Bespoke Service Links Start Here*/
.bhmblinksl{ width: 250px; height: auto; float: left; margin: 0px 30px 0px 0px; text-align: center;}
.bhmblinksl a{ font-family: 'Roboto Slab'; color: #d0ebe9; font-style: normal; font-weight: 500; font-size: 22px; line-height: 25px; display: block; padding: 18px 18px 13px 18px; height: 60px; background: #61BEB6;}
.bhmblinksl a:hover{ background-color: #d0ebe9; color: #61BEB6;}
.bhmblinksr{ width: 250px; height: auto; float: left; margin: 0px; text-align: center;}
.bhmblinksr a{ font-family: 'Roboto Slab'; color: #d0ebe9; font-style: normal; font-weight: 500; font-size: 22px; line-height: 25px; display: block; padding: 18px 18px 13px 18px; height: 60px; background: #61BEB6;}
.bhmblinksr a:hover{ background-color: #d0ebe9; color: #61BEB6;}
/*Bespoke Service Links End Here*/


/*Commercial Services Links Start Here*/
.chmblinksl{ width: 250px; height: auto; float: left; margin: 0px 30px 0px 0px; text-align: center;}
.chmblinksl a{ font-family: 'Roboto Slab'; color: #419790; font-style: normal; font-weight: 500; font-size: 22px; line-height: 25px; display: block; padding: 18px 18px 13px 18px; height: 60px; background: #92EBFE;}
.chmblinksl a:hover{ background-color: #58BAAC; color: #92EBFE;}
.chmblinksr{ width: 250px; height: auto; float: left; margin: 0px; text-align: center;}
.chmblinksr a{ font-family: 'Roboto Slab'; color: #419790; font-style: normal; font-weight: 500; font-size: 22px; line-height: 25px; display: block; padding: 18px 18px 13px 18px; height: 60px; background: #92EBFE;}
.chmblinksr a:hover{ background-color: #58BAAC; color: #92EBFE;}
/*Commercial Services Links End Here*/

.hmbimgsl{ width: 250px; height: 222px; background-color: #92EBFE; float: left; margin: 0px 30px 0px 0px ;}
.hmbimgsr{ width: 250px; height: 222px; background-color: #92EBFE; float: left; margin: 0px;}

.hmbimgsl img:hover, .hmbimgsr img:hover {
opacity: 0.5; filter: alpha(opacity=50); /* For IE8 and earlier */-webkit-transition: 200ms linear 0s; -moz-transition: 200ms linear 0s; -o-transition: 200ms linear 0s; transition: 200ms linear 0s; outline: 0 none; text-decoration: none;}
/*Home Block Navigation System Ends Here*/
/*Home Services Ends Here*/

/*Glass Office Partitions Start Here*/
.bgop-holder{float: left; width: 1200px;}
#bgop-border{ border-bottom: solid 4px #58BAAC;}
.bgop-title{float: left; width: 1100px; padding: 30px 50px; background-color: #494949; color: #91C846; text-align: center; font-family: 'Roboto Slab'; font-size: 32px; font-weight: 500;}
.bgop-img{float: left; width: 1200px; height: 390px;}
.bgop-copy{float: left; width: 1100px; background-color: #F4F4F4; padding: 50px;}
.bgop-copyl{float: left; width: 530px;}
.bgop-copyr{float: right; width: 470px;}
.bgop-copy h3{font-family: 'Roboto Slab'; color: #91C846; font-style: normal; font-weight: 500; font-size: 26px; line-height: 32px; display: block; margin-bottom: 20px;}
.bgop-copy h4{font-family: 'Roboto Slab'; color: #91C846; font-style: normal; font-weight: 500; font-size: 22px; line-height: 28px; display: block; margin-bottom: 10px;}
.bgop-copy p{font-family: 'Roboto Slab'; color: #30371A; font-style: normal; font-weight: 300; font-size: 16px; line-height: 27px; display: block; margin-bottom: 15px;}
.bgop-navh{width: 470px; float: left; margin-top: 10px;}
.bgop-navhl{width: 155px; float: left;}
.bgop-copy li a{color: #000; font-family: 'Roboto Slab'; font-style: normal; font-weight: 300; font-size: 16px; line-height: 27px; display: block; margin-bottom: 2px;}
.bgop-copy li a:hover{color: #91C846}

/*Glass Office Partitions end Here*/



/*COLOUR CHART SECTION STARTS HERE*/
.color-chart{width: 1100px; height: 451px; float: left; padding: 50px 50px; background-image: url("../images/ral-colours/ral-colours-bkg.jpg")}
.color-chart-title{width: 550px; float: left; color: #fff; font-family: 'Roboto'; font-style: normal; font-weight: 300; font-size: 60px; line-height: 65px;}
.color-chart-ph{width: 510px; float: right; margin-top: 10px;}
.color-chart-ph p{font-family: 'Roboto Slab'; font-style: normal; font-weight: 400; font-size: 16px; line-height: 25px; color: #231f20; display: block; margin-bottom: 30px;}
.spheda{font-family: 'Roboto'; font-style: normal; font-weight: 300; font-size: 40px; line-height: 42px; margin-bottom: 30px; display: block;}

.plinks{width: 510px; height: 120px; float: left;}


.plinks li a {float: left; height: 120px; color: #231f20; font-family:'Roboto'; font-style: normal; font-weight: 400; font-size: 20px; padding-bottom: 10px; background-image: url("../images/hp/testimonials-yellow-arrow.png"); background-repeat: no-repeat; background-position: 50% 85%;}

.plinks li a:hover {float: left; height: 120px; color: #231f20; font-family:'Roboto'; font-style: normal; font-weight: 400; font-size: 20px; padding-bottom: 10px; background-image: url("../images/hp/testimonials-yellow-arrow-ov.png"); background-repeat: no-repeat; background-position: 50% 85%;}

.plinkleft{width: 255px; height: 120px; float: left;}

.plinkright{width: 255px; height: 120px; float: right;}






/*COLOUR CHART SECTION ENDS HERE*/





/*FAQS ACCORDIAN BEGINS HERE*/

/*Faqs Content Starts*/

.faqssection{float: left; width: auto; padding: 60px 100px 60px 100px; text-align: left; background: #F4F4F4;}

.faqssection p {
    font-size: 16px;
    line-height: 30px;
    font-weight: normal;
    color: #fff;
	display: block; margin-bottom: 50px;
	font-family: 'Roboto Slab';
}

.faqssection li a{font-size: 18px; line-height: 30px; color: #149dcc; display: block; margin-bottom: 10px; font-weight: normal; font-family: 'Noto Sans', sans-serif !important;}

.faqssection li a:hover{color: #fff;}

.faqssection li #current{ color: #ff0000;}

#push{margin-bottom: 50px; float: left;}

/*Faqs Content ends*/

.faqssection {
            max-width: 1000px;
            margin: 0 auto;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
            overflow: hidden;
            animation: fadeInUp 0.8s ease-out;
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .faq-header {
            background: #91C846;
            color: #fff;
            padding: 20px 30px;
            text-align: center;
			border-radius: 8px;
			margin-bottom: 10px;
        }

        .faq-header h3 {
			font-family: 'Roboto Slab';
            font-size: 2.0rem;
            font-weight: 600;
            margin-bottom: 10px;
            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        }

        .faq-container {
         
        }

        .faq-item {
            border-bottom: 1px solid #e8e8e8;
            margin-bottom: 10px;
            border-radius: 8px;
            overflow: hidden;
            transition: all 0.3s ease;
        }

        .faq-item:last-child {
            border-bottom: none;
            margin-bottom: 0;
        }

        .faq-item:hover {
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        }

        .faq-question {
			font-family: 'Noto Sans', sans-serif !important;
            background: #f8f9fa;
            padding: 15px 25px;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-weight: 600;
            font-size: 1.1rem;
            color: #2c3e50;
            transition: all 0.3s ease;
            border-radius: 8px;
        }

        .faq-question:hover {
            background: rgb(97, 190, 182);
            color: #fff;
        }

        .faq-question.active {
            background: rgb(97, 190, 182);
            color: #fff;
            border-radius: 8px 8px 0 0;
        }

        .faq-icon {
            font-size: 1.2rem;
            transition: transform 0.3s ease;
            font-weight: bold;
        }

        .faq-question.active .faq-icon {
            transform: rotate(45deg);
        }

        .faq-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.4s ease, padding 0.4s ease;
            background: white;
        }
.faq-answer a{color: #91C846; font-weight: 600; text-decoration: underline;}

       .faq-answer li{ color: #555;
            font-size: 1rem;
            line-height: 1.7;
            margin: 0;
            font-family: 'Noto Sans', sans-serif !important;}

        .faq-answer.active {
            max-height: 200px;
            padding: 25px;
            border-radius: 0 0 8px 8px;
            background: #f8f9fa;
        }

        .faq-answer p {
            color: #555;
            font-size: 1rem;
            line-height: 1.7;
            margin: 0;
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            body {
                padding: 10px;
            }

            .faq-header {
                padding: 30px 20px;
            }

            .faq-header h3 {
                font-size: 1.8rem;
            }

            .faq-container {
                padding: 15px;
            }

            .faq-question {
                padding: 15px 20px;
                font-size: 1rem;
            }

            .faq-answer.active {
                padding: 20px;
                max-height: 300px;
            }
        }

        @media (max-width: 480px) {
            .faq-header h3 {
                font-size: 1.5rem;
            }

            .faq-question {
                padding: 12px 15px;
                font-size: 0.95rem;
            }

            .faq-answer.active {
                padding: 15px;
            }
        }


/*FAQS ACCORDIAN ENDS HERE*/




/*MAINTENANCE SECTION STARTS HERE*/
.maintenance-bkg{float: left; width: 1100px; height: 420px; padding: 60px 50px;}
#commercial{background-image: url("../images/maintenance-plans/commercial-maintenace-bkg.jpg");}
#residential{background-image: url("../images/maintenance-plans/residential-maintenance-bkg.jpg");}
#home-commercial{background-image: url("../images/maintenance-plans/commercial-residential-bkg.jpg");}
.hc-title{float: left; width: 850px;}
.hc-title h3{font-family: 'Roboto'; color: #20828f; font-style: normal; font-weight: 300; font-size: 55px; line-height: 61px; display: block; margin-bottom: 5px;}
.hc-subtitle{float: left; width: 850px; font-family: 'Roboto'; color: #6bbd76; font-style: normal; font-weight: 400; font-size: 37px; display: block;}
.hc-lholder{float: left; width: 800px; margin: 80px 0px 0px 290px;}
.hc-lholder a{font-family: 'Roboto'; color: #20828f; font-style: normal; font-weight: 500; font-size: 34px; display: block; padding-bottom: 150px; background-image: url("../images/hp/testimonials-yellow-arrow.png"); background-repeat: no-repeat; background-position: 90% 50%;}
.hc-lholder a:hover{color: #20828f; background-image: url("../images/hp/testimonials-yellow-arrow-ov.png"); background-repeat: no-repeat; background-position: 90% 50%;}
.hc-left{float: left; width: 150px;}
.hc-right{float: right; width: 150px; margin-right: 100px;}
.maintenance-title{float: left; width: 850px;}
.maintenance-title h3{font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 300; font-size: 60px; line-height: 66px; display: block; margin-bottom: 30px;}
.mlink{float: left; width: 1100px; margin-top: 130px;}
.mlink a{float: right; width: 1100px; height: 150px; font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 300; font-size: 48px; line-height: 54px; display: block; background-image: url("../images/hp/testimonials-yellow-arrow.png"); background-repeat: no-repeat; background-position: 100% 65%; padding-top: 30px;}
.mlink a:hover{color: #20828f; background-image: url("../images/hp/testimonials-yellow-arrow-ov.png"); background-repeat: no-repeat; background-position: 100% 65%;}
/*MAINTENANCE SECTION ENDS HERE*/



/*POLICE SECTION STARTS HERE*/
.police-content-holder{float: left; width: 1200px; height: 541px; background-image: url("../images/hp/police-bk.jpg"); border-bottom: 6px solid #92EBFE; border-top: 6px solid #92EBFE;}
.pccopyh{float: left; width: 700px; padding: 50px;}
.pccopyh h3{font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 300; font-size: 68px; line-height: 74px; display: block; margin-bottom: 30px;}
.pccopyh p{font-family: 'Roboto Slab'; color: #000; font-style: normal; font-weight: 400; font-size: 17px; line-height: 26px; display: block; margin-bottom: 30px;}
.pccopyh h4{font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 400; font-size: 32px; line-height: 36px; display: block; }
/*POLICE SECTION STARTS HERE*/

/*AREAS COVERED BEGINS HERE*/
.areas-covered{width: 1100px; float: left; padding: 50px 50px; background-color: #91C846;}
.acleft{width: 500px; float: left;}
.acleft h3{font-family: 'Roboto'; color: #000; font-style: normal; font-weight: 300; font-size: 48px; line-height: 50px; display: block; text-transform: uppercase; margin-bottom: 30px;}
.acleft p{font-family: 'Roboto Slab'; color: #fff; font-style: normal; font-weight: 500; font-size: 16px; line-height: 24px; display: block; margin-bottom: 25px;}
.acvan{width: 550px; height: 342px; float: left; margin-top: 20px;}
.acright{width: 550px; float: right;}
.actitle{width: 550px; float: left; margin: 15px 30px 30px 0px; display: block; text-align: left;}
.actitle h4{font-family: 'Roboto Slab'; color: #fff; font-style: normal; font-weight: 500; font-size: 24px;}
.acrlinks{width: 550px; float: left;}
.acrlinksl{width: 260px; float: left;}
.acrlinksr{width: 260px; float: right;}
.acrlinks li a{ width: 240px; display: block; margin-bottom: 10px; padding: 4px 15px; border-radius: 20px; font-family: 'Roboto Slab';font-style: normal; font-weight: 700; font-size: 16px; line-height: 24px; color: #fff; background-image: url(../images/icons/areas-arrow.png); background-repeat: no-repeat; background-position: 95% 50%; background-color: #B2D87D;}
.acrlinks li a:hover{ background-color: #CEE86D;}
.acrlinks li #current{ background-color: #CEE86D;}



/*Safe contractor Approved Starts*/
.sca{float: left; width: 1200px; height: 170px; background-image: url("../images/Safe-Contractor-Accreditation-bkg.jpg"); background-repeat: no-repeat;}

.sca h4{font-family: 'Roboto'; font-style: normal; font-weight: 300; font-size: 25px; line-height: 33px; color: #fff; padding: 50px 0px 0px 250px;}


/*SEO LANDING PAGES NAVIGATION STARTS HERE*/
.ldp-nav-holder{float: left; width: 1100px; padding: 60px 50px; background-color: #58BAAC; background-image: url("../images/seo-images/seo-nav-bkg.jpg"); background-repeat: repeat-y; text-align: center; border-bottom: 4px solid #58BAAC; border-top: 4px solid #58BAAC;}
.ldp-titles{float: left; width: 1100px; display: block; padding-bottom: 20px; margin-bottom: 30px; border-bottom: 1px solid #58BAAC; }
.ldp-titles h3{color: #58BAAC; font-family: 'Roboto'; font-size: 40px; font-weight: 400; line-height: 45px; display: block; margin-bottom: 10px;}
.ldp-nav-inh{float: left; width: 1100px;}
.ldp-nav-left h4{display: block; color: #58BAAC; font-family: 'Roboto Slab'; font-size: 20px; margin-bottom: 10px;}
.ldp-nav-left li a{display: block; color: #363637; font-family: 'Roboto Slab'; font-size: 14px; margin-bottom: 10px; font-weight: 700;}
.ldp-nav-left li a:hover{color: #8865A9;}
.ldp-nav-left{float: left; width: 366px;}
.ldp-nav-left li #current{ color: #58BAAC;}
/*SEO LANDING PAGES NAVIGATION ENDS HERE*/


/*TESTIMONIALS SECTION STARTS HERE*/
.testimonials-section{float: left; width: 1200px; height: 541px; background-image: url("../images/hp/testimonials.jpg");}
.tstitle{float: right; width: 700px; margin: 50px 15px 0px 0px;}
.tstitle h4{font-family: 'Roboto'; color: #20828f; font-style: normal; font-weight: 300; font-size: 60px; line-height: 64px; margin-bottom: 30px;}
.tstitle p{font-family: 'Roboto Slab'; color: #fff; font-style: normal; font-weight: 300; font-size: 27px; line-height: 35px; margin-bottom: 12px;}
.tspunch{float: right; width: 700px; font-family: 'Roboto'; color:#fff;font-style: normal; font-weight: 500; font-size: 26px; text-transform: uppercase;}
.tspunch a{float: right; width: 700px; height: 57px; font-family: 'Roboto'; color:#fff;font-style: normal; font-weight: 500; font-size: 26px; text-transform: uppercase; display: block; background-image: url("../images/hp/testimonials-yellow-arrow.png"); background-repeat: no-repeat; background-position: 90% 50%; padding-top: 30px;}
.tspunch a:hover{color: #20828f; background-image: url("../images/hp/testimonials-yellow-arrow-ov.png"); background-repeat: no-repeat; background-position: 90% 50%;}
.checkatrade{float: left; width: 1200px; height: 540px; border: 0px;}
/*TESTIMONIALS SECTION ENDS HERE*/


/*BOOK APPOINTMENT BEGINS HERE*/
/*Book Appointment Starts Here*/
.book_appointment{ width: 1100px; float: left; padding: 50px; background: linear-gradient(123deg, #61BEB6 9.28%, #CEE86D 50.81%);}
.book-left{ width: 540px; float: left; padding: 0px 15px 10px 0px;}
.book_appointment h3{ font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 300; font-size: 53px; line-height: 56px; margin-bottom: 20px; }
.book_appointment h4{ font-family: 'Roboto'; color: #fff; font-style: normal; font-weight: 400; font-size: 31px; line-height: 35px; margin-bottom: 20px; }

.basub{font-family: 'Roboto Slab'; color: #30371A; font-style: normal; font-weight: 600; font-size: 22px; line-height: 28px; display: block; margin-bottom: 25px;}

.book-left p{ font-family: 'Roboto Slab'; color: #30371A; font-style: normal; font-weight: 400; font-size: 16px; line-height: 25px; display: block; margin-bottom: 25px;}
.book-form{ width: 500px; float: right; }
.linefield{ width: 460px; float: left; padding: 10px 20px; background-color: #ddefa2; margin-bottom: 5px; font-family: 'Roboto Slab'; font-style: normal; font-weight: 400; font-size: 16px; line-height: 25px; color: #30371A; text-transform: uppercase; border: 0px;}
.linefield2{ width: 460px; float: left; padding: 10px 20px; height: 120px; background-color: #ddefa2; margin-bottom: 5px; font-family: 'Roboto Slab'; font-style: normal; font-weight: 400; font-size: 16px; line-height: 25px; color: #30371A; text-transform: uppercase; border: 0px;}
.book_appointment a{  width: 100%; float: left; text-align: center; padding: 15px 0px; background-color: #61BEB6; border: 0px; font-size: 20px; font-family: 'Roboto Slab'; font-style: normal; font-weight: 500; color: #fff; line-height: 25px; border-radius: 3px; text-transform: uppercase;}
.book_appointment a:hover{ background-color: #313031;}
/*below turns of blue border around formfields*/
.book_appointment input:focus {
border-color: #91C846; box-shadow: 0 0 10px #91C846; webkit-transition: 200ms linear 0s; -moz-transition: 200ms linear 0s; -o-transition: 200ms linear 0s; transition: 200ms linear 0s; outline: 0 none; text-decoration: none;}
/*below turns of blue border around textarea in form*/
.book_appointment textarea:focus {
 border-color: #91C846; box-shadow: 0 0 10px #91C846; webkit-transition: 200ms linear 0s; -moz-transition: 200ms linear 0s; -o-transition: 200ms linear 0s; transition: 200ms linear 0s; outline: 0 none; text-decoration: none;}	
.g-recaptcha{ float: left; margin: 5px 0px;}
/*Book Appointment Ends Here*/






/*Accreditations Content Starts*/
.acrredsh{float: left; width: 1200px;}
.gaccred{float: left; width: 1050px; padding: 40px 100px 40px 50px; background: #91C846;}
.gcredl{float: left; width: 350px; height: 180px; padding-top:15px;}
.gcredr{float: right; width: 620px; font-family: 'Roboto Slab'; font-style: normal; color: #fff;font-weight: 400; font-size: 25px; line-height: 36px;}
/*Accreditations Content Ends*/

.fstrap{float: left; width: 1100px; text-align: center; font-family: 'Roboto'; font-style: normal; font-weight: 500; font-size: 16px; color: #a4a4a4; margin-bottom: 15px;}

/*Footer Content Starts*/
.footer{float: left; width: 1200px;}
.ftop{float: left; width: 1100px; background: #363637; padding: 40px 50px;}
.flogos-tels{float: left; width: 1100px; border-bottom: 0.5px solid #9A9C9E;}
.flogo{float: left; width: 343px; height: 100px; margin-bottom: 6px;}

/*Footer Telephone Content Starts*/
.ftelsh{float: right; width: 528px; margin-top: 15px;}
.ftelh1{float: left; width: 254px; }
.ftelh2{float: right; width: 254px;}
.ftelhl{float: left; width: 60px; margin-right: 10px;}
.ftelhr{float: right; width: 184px;}
.gtel{font-family: 'Roboto'; font-style: normal; font-weight: 500; color: #91C846; font-size: 24px; display: block; margin-bottom: 5px;}
.graytel{font-family: 'Roboto'; font-style: normal; font-weight: 500; color: #a4a4a4; font-size: 24px; display: block; margin-bottom: 5px;}
/*Footer Telephone Content Ends*/

/*Footer Lists Start*/
.fstrips{float: left; width: 1100px; margin-top: 30px;}
.fcols{float: left; width: auto; display: inline-block; margin-right: 70px;}
.fcols h4{font-family: 'Roboto'; font-style: normal; font-weight: 700; font-size: 12px; line-height: 30px; color: #91C846; text-transform: uppercase;}
.fcols li a{font-family: 'Roboto'; font-style: normal; font-weight: 700; font-size: 12px; line-height: 30px; color: #a4a4a4; text-transform: uppercase;}
.fcols li a:hover{color: #91C846;}
.fcolsr{float: right; width: auto; display: inline-block; }
.fcolsr h4{font-family: 'Roboto'; font-style: normal; font-weight: 700; font-size: 12px; line-height: 30px; color: #91C846; text-transform: uppercase;}
.fcolsr li a{font-family: 'Roboto'; font-style: normal; font-weight: 700; font-size: 12px; line-height: 30px; color: #a4a4a4; text-transform: uppercase;}
.fcolsr li a:hover{color: #91C846;}
/*Footer Lists Ends*/


/*Footer Bottom Section Starts*/
.fcalltoactions{width: 300px; float: right; margin-top: 10px;}
.footerbot{float: left; width: 1100px; background: rgba(54, 54, 55, 0.95); padding: 30px 50px 0px 50px;}
.fblisth{float: left; width: 400px;}
.fbcol{float: left; width: auto; display: inline-block; margin-right: 60px;}
.fbcol h4{font-family: 'Roboto'; font-style: normal; font-weight: 700; font-size: 12px; line-height: 30px; color: #92EBFE; text-transform: uppercase;}
.fbcol p{font-family: 'Roboto'; font-style: normal; font-weight: 700; font-size: 11px; line-height: 30px; color: #fff; text-transform: uppercase;}
.fbcol li a{font-family: 'Roboto'; font-style: normal; font-weight: 700; font-size: 11px; line-height: 30px; color: #a4a4a4; text-transform: uppercase;}
.fbcol li a:hover{color: #91C846;}
/*Footer Bottom Section ends*/

.poig{float: left; width: 1100px; border-top: 0.5px solid #9A9C9E; margin-top: 25px;}
.poigr{float: left; width: 1000px; margin: 20px 0px 0px 0px;}
.poigr h4{font-family: 'Roboto'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 15px; color: #91C846; display: block; margin-bottom: 10px;}
.poigr h5{font-family: 'Roboto'; font-style: normal; font-weight: 600; font-size: 15px; line-height: 15px; color: #fff; display: block; margin-bottom: 10px;}
.poigr p{font-family: 'Roboto'; font-style: normal; font-weight: 600; font-size: 14px; line-height: 15px; color: rgba(255, 255, 255, 0.7); display: block; margin-bottom: 10px;}
.poigr a{font-family: 'Roboto'; font-style: normal; font-weight: 600; font-size: 14px; line-height: 15px; color: rgba(255, 255, 255, 0.7);}
.poigr a:hover{color: #91C846;}


.legal{float: left; width: 1100px; border-top: 0.5px solid #9A9C9E; margin-top: 25px;}
.legalr{float: left; width: 600px; margin:20px 0px}
.legalr p{font-family: 'Roboto'; font-style: normal; font-weight: 600; font-size: 12px; line-height: 15px; color: rgba(255, 255, 255, 0.7);}
.legall{float: right; width: 300px; margin:20px 0px; text-align: right;}
.legall a{font-family: 'Roboto'; font-style: normal; font-weight: 600; font-size: 10px; line-height: 15px; color: rgba(255, 255, 255, 0.7);}
.legall a:hover{color: #91C846;}
/*Footer Content Ends*/



/*Social Media Starts Here*/

.facebook{ width: 55px; float: left; height: 55px; margin-right: 33px;}
.facebook img:hover { opacity: 0.5; -webkit-transition: opacity 0.5s ease-in-out;  -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out;}	

.instagram{ width: 55px; float: left; height: 55px; margin-right: 33px; }
.instagram img:hover { opacity: 0.5; -webkit-transition: opacity 0.5s ease-in-out;  -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; }	

.linkedin{ width: 55px; float: left; height: 55px;}
.linkedin img:hover { opacity: 0.5; -webkit-transition: opacity 0.5s ease-in-out;  -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; }	



.fsocial_media{ width: 231px; float: left;  margin-top: 60px; margin-left: 25px; }







.strphead{ float: left; width: 1100px; background: rgba(54, 54, 55, 0.95); padding: 0px 50px 30px 50px;  }
	
.strphead p{ color: #a4a4a4; font-size: 13px; font-family: 'Roboto'; font-style: normal; font-weight: 600; line-height: 17px;}

.strphead p a{ color: #ccc; font-size: 13px; font-family: 'Roboto'; font-style: normal; font-weight: 600; line-height: 17px;}






/*Office Glass Partitions carousel Starts*/

.carousel {
  width: 1200px;
  height: 390px;
  position: relative;
  overflow: hidden;
}

.carousel-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.carousel-image.active {
  opacity: 1;
}

.carousel-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/*Office Glass Partitions carousel ends*/



/*IMAGE UPLOADS SECTIONS STARTS HERE*/


.contact-form-container {
 font-family: 'Montserrat', sans-serif;
  max-width: 900px;
  margin: 50px auto;
  background: #fff;
  padding: 50px 30px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
	

}

.contact-form-container h1 {
  font-size: 2rem;
  text-align: center;
  color: #91C846;
  margin-bottom: 20px;
}

.contact-form-container p{ font-size: 15px; line-height: 26px; display: block; margin-bottom: 10px;}

.contact-form-container label {
  display: block;
  font-weight: 600;
  margin: 15px 0 10px;
  color: #000;
  width: auto;
}

.contact-form-container input, button {
  width: 95%;
  padding: 12px;
  margin-bottom: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 1rem;
  outline: none;
  transition: all 0.3s ease;
  font-family: 'Roboto', sans-serif;
}

.contact-form-container input:focus {
  border-color: #91C846;
  box-shadow: 0 0 5px rgba(232, 107, 48, 0.5);
}

.contact-form-container button {
  background-color: #91C846;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  margin: 10px auto; /* Center the button */
}

.contact-form-container button:hover {
  background-color: #AEDED8;
color: #fff;
}

.contact-form-container textarea {
  width: 95%;
  padding: 12px;
  font-size: 1rem;
  font-family: 'Roboto', sans-serif;
  border: 1px solid #ccc;
  border-radius: 5px;
  resize: vertical;
  min-height: 120px;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
  outline: none;
	margin: 0px 0px 10px 0px;
}

.contact-form-container textarea:focus {
  border-color: #91C846;
  box-shadow: 0 0 5px rgba(232, 107, 48, 0.5);
}

.contact-form-container textarea::placeholder {
  color: #aaa;
  font-style: italic;
}

.contact-form-container input[type="file"] {
  display: none; /* Hide the default file input */
}

.custom-file-upload {
  display: block;
  width: 100%; /* Full width */
  max-width: 350px;
  padding: 15px;
  font-size: 1rem;
  font-weight: 600;
  color: #fff;;
  background-color: #91C846;
  border-radius: 5px;
  cursor: pointer;
  text-align: center;
  transition: all 0.3s ease;
  border: 2px solid transparent;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  margin: 10px auto; /* Center the button */
}

.custom-file-upload:hover {
  background-color: #AEDED8;
  color: #fff;
  border: 2px solid #AEDED8;
}

.custom-file-upload:active {
  transform: scale(0.97);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

#white{color: #fff;}


#fileFeedback {
  margin-top: 10px;
  font-size: 0.9rem;
  color: #000;
  text-align: left;
}

#fileFeedback ul {
  margin: 0;
  padding-left: 20px;
}

#fileFeedback li {
  margin-bottom: 5px;
}

.g-recaptcha {
  margin-bottom: 15px;
}

#feedback {
  color: red;
  font-size: 0.9rem;
  text-align: center;
  margin-top: -10px;
}

.contact-form-container input[type="file"] {
  border: none;
  padding: 0;
}

.contact-form-container input[type="file"]:hover {
  background: #AEDED8;
  cursor: pointer;
}


#progressContainer {
  display: none; /* Hidden by default */
  background-color: #f4f4f4;
  border: 1px solid #ccc;
  height: 20px;
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
  margin-top: 10px;
}

#progressBar {
  height: 100%;
  width: 0%;
  background-color: #91C846;
  transition: width 0.3s ease;
}

#progressText {
  text-align: center;
  margin-top: 5px;
  font-size: 0.9rem;
  color: #000;
  display: none;
}

#imagePreview img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  margin: 5px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

button.remove-image {
  width: 125px;
  background-color: #91C846;
  color: white;
  border: none;
  border-radius: 5px;
  padding: 5px 10px;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.2s ease;
	margin-left:10px;
}

button.remove-image:hover {
  background-color: #AEDED8;
  color: black;
  transform: scale(1.05);
}

button.remove-image:active {
  background-color: #000;
  color: white;
  transform: scale(0.95);
}

/*IMAGE UPLOADS SECTIONS ENDS HERE*/




/*GOOGLE TICKER STARTS HERE*/

.gticker{float: left; width: 1140px; padding: 30px 30px 25px 30px;}


/*GOOGLE TICKER ENDS HERE*/






/*
|--------------------------------------------------------------------------
| UItoTop jQuery Plugin 1.2
| http://www.mattvarone.com/web-design/uitotop-jquery-plugin/
|--------------------------------------------------------------------------
*/

#toTop {
  display:none;
  text-decoration:none;
  position:fixed;
  bottom:10px;
  right:10px;
  overflow:hidden;
  width:51px;
  height:51px;
  border:none;
  text-indent:100%;
  background:url(../ui.totop.png) no-repeat left top;
}

#toTopHover {
  background:url(../ui.totop.png) no-repeat left -51px;
  width:51px;
  height:51px;
  display:block;
  overflow:hidden;
  float:left;
  opacity: 0;
  -moz-opacity: 0;
  filter:alpha(opacity=0);
}

#toTop:active, #toTop:focus {
  outline:none;
}

/*aligns cookies left*/
.cc-banner{ text-align: left;}


.comparison-table table {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
  }

  .comparison-table th, td {
    border: 1px solid #ccc;
    padding: 12px;
    text-align: left;
  }

  .comparison-table thead {
    background-color: #f5f5f5;
  }

  .comparison-table th {
    font-weight: bold;
    background-color: #eaeaea;
  }

  .comparison-table tbody tr:nth-child(even) {
    background-color: #fafafa;
  }

  .comparison-table tbody tr:hover {
    background-color: #f1f1f1;
  }