/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/



<style>

/* space between accordions on mobile view */
.span4.widget-span.widget-type-cell.cell_1705160746243-background-color.dnd-column.aos-init.aos-animate {
    margin-bottom: 10px!important;
}

.span4.widget-span.widget-type-cell.cell_1705160808544-background-color.dnd-column.aos-init.aos-animate {
    margin-bottom: 10px!important;
}




ul.checkmark li {
    margin-bottom: 0;
    font-family: 'Poppins'!important;
}
  .product-label-icon.is-active {
    display: none;
}
  
  a.button.button--primary {
    display: inline-block;
}
  
  /* Live CSS background */

html, body {
  width: 100%;
  height:100%;
}

body {
/* background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);*/
/*    background:linear-gradient(-45deg, #583e94, #6752b1, #2c214e); */
background: linear-gradient(-45deg, #262529, #2b1b62, #27155f);
    background-size: 2000% 2000%;
    animation: gradient 15s ease infinite;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* End of Live CSS background */
  

/* Standalone Style in CSS not working properly */
ul.checkmark li {
margin-bottom:0;
}



/* Remove menu temporarily */
li.hs-menu-item.hs-menu-depth-1 {
    display: none;
}

/* Sympo footer logo */
p.footer__logo {
    width: 170px;
}

/* Adjust slider text spacing */
p.tag {
    padding-top: 10px;
    margin-bottom: -6px!important;
}

/* alter the style of the accordion text */
.accordion__item-content strong {
    font-weight: 400;
    font-size: 0.9rem;
    font-family: 'Poppins';
}

/* Contact Form Table - icon alignment */
td {
    vertical-align: middle;
}

/* Update link style and formatting */
a {
    font-family: 'Poppins';
    font-size: 0.8rem;
}

.hs_submit.hs-submit {
    padding-top: 10px;
}
/* Large Form Button */
input.hs-button.primary.large {
    box-shadow: inset 0 10px 16px -10px rgba(255,255,255,.06), 0 8px 8px rgba(0,31,31,.06), 0 4px 4px rgba(0,31,31,.06), 0 2px 2px rgba(0,31,31,.06), 0 0 1px rgba(0,31,31,.32), inset 0 -2px 1px rgba(0,31,31,.24), inset 0 1px 1px rgba(205,250,206,.08);
/*    background-image: linear-gradient(to bottom,#772df5,#292047); */
	background-image:linear-gradient(to bottom,#96d58d,#D3E373);
    color: black!important;
    border: none;
    padding-top:20px;
}

form label {
color:white;
}

.form_styler form {
background-image: radial-gradient(circle at 100% 0,#190a36,#3E0C8F);
border:none!important;
}

/* Menu button color  */
.button.header-main__cta {
    background-image: linear-gradient(to bottom,#190a36,#3E0C8F);
}

/* Remove the tag from the toggle section */
.toggle-features-tag-text {
    display: none;
}

/* Icons in the accordion of the toggle */
#hs_cos_wrapper_widget_1704184157627 .item_icon.icon1 {
    background-color: #96d58d;
    box-shadow: 0 0 0.1em 0 rgb(44 71 71 / 0%), 0 0.2em 0.2em 0 rgb(69 148 148 / 0%), 0 0.3em 0.3em 0 rgb(0 31 31 / 15%), inset 0.6em -1em 0.8em 0 #96d58d, inset 0.8em -1.2em 1.6em 0 #96d58d, inset 0 -0.1em 0.16em 0 rgb(0 31 31 / 29%), inset 0 0.1em 0.1em 0 rgb(168 204 155 / 0%);
}

#hs_cos_wrapper_widget_1704184157627 .item_icon.icon2 {
    background-color: none;
}

#hs_cos_wrapper_widget_1704184157627 .item_icon.icon3 {
    background-color: none;
}

#hs_cos_wrapper_widget_1704184157627 .item_icon.icon4 {
    background-color: none;
}



h2 {
    font-size: 3.2rem;
    color: white;
}

/* Style logo in the hero banner */
p.hero_body_text img {
    width: 120px!important;
    border-radius: 4px!important;
}

/* Contact form Table text */
table {
    border: none;
}
table td {
    border: none!important;
}

table p {
    font-family: 'Poppins';
}

/*  Original Colours in the moving heading gradient 
linear-gradient(90deg, #96301e 0%,rgba(199,201,88,1) 10%,rgba(28,147,46,1) 20%,rgba(74,165,168,1) 30%,rgba(89,90,165,1) 40%,rgba(84,16,67,1) 50%,rgba(28,58,63,1) 60%,rgba(82,175,183,1) 70%,rgba(78,170,76,1) 80%,rgba(150,48,30,1) 90%,rgba(199,201,88,1) 100%)

Plain white gradient
linear-gradient(90deg, rgb(255 255 255) 0%,rgb(255 255 255))
*/

/* linear-gradient(90deg, #D3E373 100%, #96d58d 100%, #57CCB0 100%)*/


/*
Original Colorful linear gradient with reds
linear-gradient(90deg, rgba(150,48,30,1) 0%,rgba(199,201,88,1) 10%,rgba(28,147,46,1) 20%,rgba(74,165,168,1) 30%,rgba(89,90,165,1) 40%,rgba(84,16,67,1) 50%,rgba(28,58,63,1) 60%,rgba(82,175,183,1) 70%,rgba(78,170,76,1) 80%,rgba(150,48,30,1) 90%,rgba(199,201,88,1) 100%)

*/

/* Update the toggle styling */
.toggle_text.show p {
    font-family: 'Poppins';
    font-size: 0.8rem;
    font-weight: 300;
    padding-left: 21px;
    padding-right: 21px;
}


/* Review cards text colour */
.review-author-detail.mb-5 p {
    color: #bfbfbf;
}

/* Review cards text colour */
.review-card span {
    color: black;
}

/* Accordion Content Padding */
.accordion__item-content {
    padding: 0rem 1.4em;
}

/* Accordion Content Text Size */
.accordion__item-content p {
    font-size: 0.9rem!important;
	font-family:'Poppins';
	
}

/* Background hover effect on Accordion */
.accordion:hover {
    background: #fbfbfb;
}

#hs_cos_wrapper_widget_1704184157627 .item_icon svg, #hs_cos_wrapper_widget_1704184157627 .item_icon img {
    height: 20px;
    width: 20px;
}


#hs_cos_wrapper_module_17056057759165 .room120_panels__desc {
    font-family: 'Poppins';
}



div#hs_cos_wrapper_module_1704974250754 .eyebrow {
    display: none;
}

.showcase-slider-pro-slick-section .slick-wrap .slick-item {
min-height: 270px;
}

.masonry-image-gallery__lynton__item.masonry-image-gallery__lynton-animate.masonry-image-gallery__lynton-animate--fade-in.masonry-image-gallery__lynton-image-hover--color.masonry-image-gallery__lynton-animate--active {
    border: 10px solid white;
    border-radius: 38px;

}

.masonry-image-gallery__lynton__item.masonry-image-gallery__lynton-animate.masonry-image-gallery__lynton-animate--fade-in.masonry-image-gallery__lynton-image-hover--grayscale.masonry-image-gallery__lynton-animate--active {

    border: 10px solid white;
    border-radius: 38px;

}


.masonry-image-gallery__lynton__item.masonry-image-gallery__lynton-animate.masonry-image-gallery__lynton-animate--fade-in.masonry-image-gallery__lynton-image-hover--zoom-in.masonry-image-gallery__lynton-animate--active {
    border: 10px solid white;
    border-radius: 38px;
}


/* brand border around FAQ slider */ 
#hs_cos_wrapper_widget_1704974234809 .faq-slider .faq-slider_repeater .faq-slider_content {
    border: 9px solid #96d58d;
    padding: 20px;
}

#hs_cos_wrapper_module_17060242096147 .faq-slider .faq-slider_repeater .faq-slider_content {
    border: 9px solid #96d58d;
    padding: 20px;
}

h4.faq-slider_question {
    font-size: 1.2rem;
}

p.faq-slider_answer {
    color: white;
    font-size: 0.9rem;
}

/* Hero title wrapper */
.title-wrapper.hero {
    margin-bottom: 0px;
    padding-bottom: 0px;
    padding-top: 0px;
/*    margin-top: -60%; */ 
}

.smaller-heading-gradient h1 {
    font-size: 4.6rem;
	background:linear-gradient(90deg,rgba(199,201,88,1) 10%,rgba(28,147,46,1) 20%,rgba(74,165,168,1) 30%,rgba(89,90,165,1) 40%,rgba(28,58,63,1) 60%,rgba(82,175,183,1) 70%,rgba(78,170,76,1) 80%,rgba(199,201,88,1) 100%);
/*    background: linear-gradient(90deg, rgba(150,48,30,1) 0%,rgba(199,201,88,1) 10%,rgba(28,147,46,1) 20%,rgba(74,165,168,1) 30%,rgba(89,90,165,1) 40%,rgba(84,16,67,1) 50%,rgba(28,58,63,1) 60%,rgba(82,175,183,1) 70%,rgba(78,170,76,1) 80%,rgba(150,48,30,1) 90%,rgba(199,201,88,1) 100%); */
    background-size: 1000% 100%;
    animation: background 20s linear infinite;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    line-height: 6rem;
}


/* Large paragraph text */
p.hero_body_text {
    font-size: 2.2rem;
    color: white; 
    font-family: 'Poppins';

}

/* Toggle UZ Feature Section - adjust image size in 2nd Column */ 
#hs_cos_wrapper_widget_1704184157627 .toggle-features-card-img{
flex:0 0 40%;

}

/* padding on bottom of feature card */
#hs_cos_wrapper_widget_1704184157627 .toggle-features-card {

    margin-bottom: 40px;
}


.feature_image {
    text-align: center;
}

/* Toggle Section Accordion Text */

.lower_item_text h4 {
    font-size: 1.0rem!important;
}

/* Toggle Section Styling - Accordions */
.content_section {

    background: #ffffff!important;
    /* border-radius: 20px; */
    border-radius: 20px!important;
    padding: 10px 5px 10px 0px!important;
    box-shadow: inset 0 10px 16px -10px hsla(0,0%,100%,.06), 0 8px 8px rgba(0,31,31,.06), 0 4px 4px rgba(0,31,31,.06), 0 2px 2px rgba(0,31,31,.06), 0 0 1px rgba(0,31,31,.32), inset 0 -2px 1px rgba(0,31,31,.24), inset 0 1px 1px rgba(205,250,206,.08)!important;
}

/* Toggle Section accordion spacing */
#hs_cos_wrapper_widget_1704184157627 .feature_items_repeat {
padding: 8px 0px;
}


p.big-body-text-black {
    font-size: 1.2rem!important;
    
    text-align: center!important;
    display: block!important;
    font-family: 'Poppins';
}

/* card behind every day issues */

.span4.widget-span.widget-type-cell.cell_1705160746243-background-color.dnd-column.aos-init.aos-animate {
    padding:13px 10px 1px 13px;
    border-radius: 20px;
}


.span4.widget-span.widget-type-cell.cell_1705160808544-background-color.dnd-column.aos-init.aos-animate {
    padding:13px 10px 1px 13px;
    border-radius: 20px;
}


.span4.widget-span.widget-type-cell.dnd-column.cell_1705161157233-background-gradient.aos-init.aos-animate {
    padding:13px 10px 1px 13px;
    border-radius: 20px;
}



/* property to eyebrow items to the left */
.left-align .title-wrapper {
    align-items: baseline;
}

/* left align main heading for component 2 */
.left-align h2 {
    text-align: left;
}

p.faq-slider_answer {
    color: black;
    margin-top: 5px!important;
}

/* Fixes border-radius override from module */
.slide-inner-content {
    margin: -9px;
}

/* white border around slick slideshow */
.slick-track .slick-item {
    border: 9px solid white;
    border-radius: 1.6rem;
    
}

/* styling for slide show slider */
#hs_cos_wrapper_widget_1704971637000 .description
{
    color: #999999;
    font-size:1rem;
    font-weight:300;
    font-family:'Poppins'
}

#hs_cos_wrapper_widget_1704971637000 .tag {
    color: #000;
    font-size:1.2rem;
    font-weight:500;
    font-family:'Poppins'
}  


#hs_cos_wrapper_widget_1705516323988 .why-us-box {
padding-bottom: 0px!important;
box-shadow:0 24px 24px 0 rgb(0 31 31 / 0%), 0 16px 16px 0 rgb(0 31 31 / 4%), 0 8px 8px 0 rgb(0 31 31 / 4%), 0 4px 4px 0 rgb(0 31 31 / 4%), 0 2px 2px 0 rgb(0 31 31 / 4%), 0 0 1px 0 rgb(0 31 31 / 24%);
}  

.slide-inner-content {
    border-radius: 0px 0px 20px 24px;
    height: 100px;
	background-color: #000000;
    /* box-shadow: 0 0 0.1em 0 rgba(0,31,31,.24), 0 0.2em 0.2em 0 rgba(0,31,31,.06), 0 0.3em 0.3em 0 rgba(0,31,31,.06), inset 0.6em -1em 0.8em 0 rgba(0,163,163,.48), inset 0.8em -1.2em 1.6em 0 rgba(0,163,163,.48), inset 0 -0.1em 0.16em 0 rgba(0,31,31,.32), inset 0 0.1em 0.1em 0 rgba(235,255,228,.64); */
    color: #fff;    
}


#hs_cos_wrapper_widget_1704971637000 .slide-inner-content {
    background: #ffffff;
}

#hs_cos_wrapper_widget_1704971637000 .description
{
margin-bottom: 0px;
}


#hs_cos_wrapper_widget_1705516323988 .why-us-box .content span {
    color: #381130;
    font-size: 15px!important;
    font-family: Poppins,sans-serif;
    font-weight: 200;
    text-transform:upper-case;
    display:block;
    margin-top:5px;

    
}

.why_us.why-us-section {
    background: none!important;
}

#hs_cos_wrapper_widget_1705516323988 .why-us-section {
padding-top:30px;
}

#hs_cos_wrapper_widget_1705516323988 .why-us-box {
padding-bottom: 0px;
}

.why_us.card-heading h2
{
    font-size: 1.1rem!important;
    padding-top:20px;
}

/* Why us card icon */
.why_us img {
    width: 25%!important;
    height: 25%!important;
    padding: 6px;
    background-color: linear-gradient(to bottom,#772df5,#292047);
	box-shadow:inset 0.1em -1.2em 3.6em 0 #96d58d, inset 0 0.1em 0.1em 0 rgb(168 204 155 / 0%);
	/*box-shadow:0 0 0.1em 0 rgb(44 71 71 / 0%), 0 0.2em 0.2em 0 rgb(69 148 148 / 0%), 0 0.3em 0.3em 0 rgb(0 31 31 / 15%), inset 0.6em -1em 0.8em 0 #96d58d, inset 0.8em -1.2em 1.6em 0 #96d58d, inset 0 -0.1em 0.16em 0 rgb(0 31 31 / 29%), inset 0 0.1em 0.1em 0 rgb(168 204 155 / 0%);*/
    /* box-shadow: 0 0 0.1em 0 rgba(0,31,31,.24), 0 0.2em 0.2em 0 rgba(0,31,31,.06), 0 0.3em 0.3em 0 rgba(0,31,31,.06), inset 0.6em -1em 0.8em 0 rgba(0,163,163,.48), inset 0.8em -1.2em 1.6em 0 rgba(0,163,163,.48), inset 0 -0.1em 0.16em 0 rgba(0,31,31,.32), inset 0 0.1em 0.1em 0 rgba(235,255,228,.64); */
    /*box-shadow: 0 0 0.1em 0 #190a36, 0 0.2em 0.2em 0 #001f1f14, 0 0.3em 0.3em 0 rgba(0,31,31,.06), inset 0.6em -1em 0.8em 0 rgb(248 248 248 / 48%), inset 0.8em -1.2em 1.6em 0 #190a36, inset 0 -0.1em 0.16em 0 #190a36, inset 0 0.1em 0.1em 0 #190a3600; */
    color: #fff;    
}

/* why us background box */
.why_us.why-us-box {
    background: #fcfcfc!important;
}


ul.why-card--bullet-list {
    margin: 0px;
    font-size: 0.8rem;
    text-align: center;
    font-weight: 200;
    width: 70%;
    display: inline-block;
    text-transform:capitalize;
    display: none;
}

/* Logo banner */
.span12.widget-span.widget-type-cell.cell_17055077981942-background-color.dnd-column {
    padding-top: 30px;
    padding-bottom: 30px;
}


/* remove maginfying glass from menu bar */
form.search--menu svg {
    display: none;
}

/* menu button colour override */
.button.header-main__cta {
    background-image: linear-gradient(to bottom,#772df5,#292047);
	color: white;
}

/* remove top bar from menu bar */
.top-bar {
    display: none;
}

/* Feature Section Styler */
.content_section {
    background: #f2f2f2;
    border-radius: 20px;
    padding: 15px 6px 15px 0px;
}
/* Feature Section UZ - remove black line seperator */
.feature_items_repeat {
    border: none!important;
}

.slick-track > div {
box-shadow: none!important;
}

@keyframes background {
  0%{background-position:0% 50%}
  100%{background-position:100% 50%}
}

/* Start of Shape Transformation */

div {
  animation: rotate-all 2s 0 infinite linear alternate;
}

.div1 {
  width: 80px;
  height: 80px;
  background-color: #669999;
  position: relative;
  margin: auto;
  animation: square-to-circle 2.5s .5s infinite cubic-bezier(1,.015,.295,1.225) alternate-reverse;

}

.div2 {
    width: 80px;
  height: 80px;
  background-color: #669999;
  position: relative;
  margin: auto;
  animation: square-to-circle2 2.5s .42s infinite cubic-bezier(1,.015,.295,1.225) alternate-reverse;
}

#one {
  top: 150px;
}
 
#two {
  top: 150px;
  right: 80px;
}

#three {
  top: 150px;
}

#four {
  bottom: 10px;
  left: 80px;
}

@keyframes square-to-circle {
  0%  {
    border-radius:0 0 0 0;
    background:;
    transform:rotate(45deg);
  }
  25%  {
    border-radius:50% 0 0 0;
    background:darksalmon;
    transform:rotate(135deg);
  }
  50%  {
    border-radius:50% 50% 0 0;
    background:indianred;
    transform:rotate(180deg);
  }
  75%  { 
    border-radius:50% 50% 50% 0;
    background:lightcoral;
    transform:rotate(315deg);
  }
  100% {  
    border-radius:50%;
    background:darksalmon;
    transform:rotate(404deg);
  }
}

@keyframes square-to-circle2 {
  0%  {
    border-radius:0 0 0 0;
    background:;
    transform:rotate(45deg);
  }
  25%  {
    border-radius:0 0 50% 0;
    background:darksalmon;
    transform:rotate(135deg);
  }
  50%  {
    border-radius:0 0 50% 50%;
    background:indianred;
    transform:rotate(180deg);
  }
  75%  { 
    border-radius:50% 0 50% 50%;
    background:lightcoral;
    transform:rotate(315deg);
  }
  100% {  
    border-radius:50%;
    background:darksalmon;
    transform:rotate(404deg);
  }
}



/* End of shape transformation */



/* Start of circle animation */

.context {
    width: 100%;
    position: absolute;
    top:50vh;
    
}

.context h1{
    text-align: center;
    color: #fff;
    font-size: 50px;
}


.area{
    background: #4e54c8;  
    background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8);  
    width: 100%;
    height:100vh;
    
   
}

.circles{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.circles li{
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: rgba(255, 255, 255, 0.2);
    animation: animate 25s linear infinite;
    bottom: -150px;
    
}

.circles li:nth-child(1){
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}


.circles li:nth-child(2){
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}

.circles li:nth-child(3){
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.circles li:nth-child(4){
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 18s;
}

.circles li:nth-child(5){
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.circles li:nth-child(6){
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}

.circles li:nth-child(7){
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 7s;
}

.circles li:nth-child(8){
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
}

.circles li:nth-child(9){
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}

.circles li:nth-child(10){
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s;
}



@keyframes animate {

    0%{
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }

    100%{
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 50%;
    }

}



/* end of circle animation */



body > div {
    margin-right: 0em;
}
  
  
span {
    font-family: 'Poppins';
}

/* Remove header from feature banner */
.feature_inr {
    display: none;
}

.lower_item_text {
    font-family: 'Poppins';
}


.lower_item_text {
    padding-left: 20px;
    padding-right: 20px;
    font-size: 0.8rem;
    font-weight: 500;
}



.lower_item_text li {
    font-size: 0.8rem!important;
    text-align: left;
}

div#hs_cos_wrapper_widget_1704185453274 {
    border-radius: 20px;
	border: 20px solid white;
    box-shadow: inset 0 10px 16px -10px hsla(0,0%,100%,.06), 0 8px 8px rgba(0,31,31,.06), 0 4px 4px rgba(0,31,31,.06), 0 2px 2px rgba(0,31,31,.06), 0 0 1px rgba(0,31,31,.32), inset 0 -2px 1px rgba(0,31,31,.24), inset 0 1px 1px rgba(205,250,206,.08)!important;
}

/*  Purple gentle gradient and transition 
background:linear-gradient(45deg,#4d3ce5,#7c2cf7);
*/

.feature_items_repeat {
    background: white;
}

/* Breaks the Card Component 26
.w-background-video{
height:250px;
}*/

h4 {
    font-weight: 300;
}


/* UZ title heading*/

.toggle-features-title-text h2 {
    font-size: 3rem!important;
    line-height: 4rem;
}

/* Steps description text */
.desc {
    color: #686868;
}

#hs_cos_wrapper_module_1704374449155 .step_module .step-iit-bg {
    max-width: 35px;
    min-height: 35px;
}


#hs_cos_wrapper_module_17043744491555 .step_module .step-iit-bg {
    max-width: 35px;
    min-height: 35px;
}


.accordion__item-content p {
    FONT-WEIGHT: 100;
}


.accordion button {
    font-weight: 400;
    letter-spacing:0px; 
    font-family: 'Poppins';

}

.accordion__icon {
background-color:#ababab36;
}

/* Remove the box shadow from the vertical image */
div#hs_cos_wrapper_module_170497751708010 .vertical-accordion-image {
    box-shadow: none!important;
}

.accordion {
    /*background-image: linear-gradient(225deg,rgb(246 246 246),rgb(251 255 254)); */
    background: white;
    /*border:10px solid #ffffff;*/
}

/* Overwrite toggle Features tag with eyebrow style */
.toggle-features-tag-text p {
    border-radius: 1rem;
    box-shadow: inset 0 0 0 0.15em #51e0cd;
    color: teal;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .1em;
    margin-bottom: 1.2rem;
    padding: 0.3rem 0.8rem;
    text-transform: uppercase;
    background: white!important;
}

/* Button inside of rich text*/
a.interactive-button {
    -webkit-backface-visibility: hidden!important;
        background-color: #003d3d!important;
        background-image: linear-gradient(180deg,teal,#003d3d)!important;
        border-radius: 0.5rem!important;
        border-style: none!important;
        box-shadow: inset 0 10px 16px -10px hsla(0,0%,100%,.06), 0 8px 8px rgba(0,31,31,.06), 0 4px 4px rgba(0,31,31,.06), 0 2px 2px rgba(0,31,31,.06), 0 0 1px rgba(0,31,31,.32), inset 0 -2px 1px rgba(0,31,31,.24), inset 0 1px 1px rgba(205,250,206,.08)!important;
        color: #cdface!important;
        flex: none!important;
        flex-flow: row!important;
        font-size: .9rem!important;
        font-style: normal!important;
        font-weight: 500!important;
        justify-content: center!important;
        margin-bottom: unset!important;
        margin-left: unset!important;
        margin-right: unset!important;
        margin-top: 1.2rem!important;
        overflow: hidden!important;
        padding: 0.8rem 2rem!important;
        text-align: center!important;
        -webkit-transform-style: preserve-3d!important;
}

/* Live CSS background */

html, body {
  width: 100%;
  height:100%;
}

body {
/* background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);*/
/*    background:linear-gradient(-45deg, #583e94, #6752b1, #2c214e); */
background: linear-gradient(-45deg, #262529, #2b1b62, #27155f);
    background-size: 2000% 2000%;
    animation: gradient 15s ease infinite;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* End of Live CSS background */




.smallest-heading-black {
font-size: 2rem;
    color: #000000;
    line-height: 4rem;
}

/* Changes the size and colour of the intro text in each section */
p.big-body-text-white {
    font-size: 1.2rem;
}

/* Changes the size and colour of the intro text in each section */
p.big-body-text {
    font-size: 1.2rem;
}

.black {
color:black;
}

.white {
color:white;
}

.centered {
text-align:center;
}


/* Smaller Heading with gradient background effect) */
.smaller-heading-gradient h2 {
    font-size: 3.2rem;
    /* background: linear-gradient(to right, #000000, #684124,#6c246c, #3d6241);*/
  background:linear-gradient(90deg,rgba(199,201,88,1) 10%,rgba(28,147,46,1) 20%,rgba(74,165,168,1) 30%,rgba(89,90,165,1) 40%,rgba(28,58,63,1) 60%,rgba(82,175,183,1) 70%,rgba(78,170,76,1) 80%,rgba(199,201,88,1) 100%);
  /* background: linear-gradient(90deg, rgba(150,48,30,1) 0%,rgba(199,201,88,1) 10%,rgba(28,147,46,1) 20%,rgba(74,165,168,1) 30%,rgba(89,90,165,1) 40%,rgba(84,16,67,1) 50%,rgba(28,58,63,1) 60%,rgba(82,175,183,1) 70%,rgba(78,170,76,1) 80%,rgba(150,48,30,1) 90%,rgba(199,201,88,1) 100%);*/
  background-size: 1000% 100%;
  

    animation: background 20s linear infinite;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    line-height: 4rem;
    
}

.smaller-heading-white h2 {
    font-size: 3.2rem;
/*	background: linear-gradient(to right, #d94949, #dfffe2,#ffdaff, #99f0a2); */
  background: linear-gradient(90deg, #fefefe 100%, #ffffff 100%, #57CCB0 100%);
  background-size: 1000% 100%;
  

    animation: background 20s linear infinite;

    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    line-height: 4rem;
}

.smaller-heading-black h2 {
    font-size: 3.2rem;
    color: #000000;
    line-height: 4rem;
}





.eyebrow {
    background-color: #ffffff;
    font-family:'Poppins';
    }

/* Remove the small contact details at the top */
.light-version h2 {
    color: white!important;
    font-size: 3.2rem;
    line-height: 65px;
    font-weight: 400;
}


/* Remove the small contact details at the top */
.span9 {
    display: none!important;
}

/* Accordion Column background cards 
.span4.widget-span.widget-type-cell.dnd-column.aos-init.aos-animate {
    background: white;
    border-radius: 20px;
    box-shadow: 0 24px 24px 0 rgb(0 31 31 / 0%), 0 16px 16px 0 rgb(0 31 31 / 4%), 0 8px 8px 0 rgb(0 31 31 / 4%), 0 4px 4px 0 rgb(0 31 31 / 4%), 0 2px 2px 0 rgb(0 31 31 / 4%), 0 0 1px 0 rgb(0 31 31 / 24%);
    border: 1px #d6d6d6 solid;
}
*/

/* display responsiveness tooltip text */
#hs_cos_wrapper_module_17042228993954 .inner_tooltip p, #hs_cos_wrapper_module_17042228993954 .inner_tooltip
{
	font-weight: 400!important;
    font-family: 'Poppins';
    font-size:15px;
    color:white;
}

#hs_cos_wrapper_module_17042228993954 .avia-tooltip, #hs_cos_wrapper_module_17042228993954 .avia-arrow {
    background-color: rgb(97 210 255);
}


/* Start - Flex Items */
  
.step-flex_item.column-1 {
    background: #ffffff;
    border: 3px solid white;
    margin: 7px;
    border-radius: 20px;
    box-shadow: 0 24px 24px 0 rgb(0 31 31 / 0%), 0 16px 16px 0 rgb(0 31 31 / 4%), 0 8px 8px 0 rgb(0 31 31 / 4%), 0 4px 4px 0 rgb(0 31 31 / 4%), 0 2px 2px 0 rgb(0 31 31 / 4%), 0 0 1px 0 rgb(0 31 31 / 24%);
}
  
    
  
  /* Removes icons from cards */
  span#hs_cos_wrapper_widget_1704186085919_ {
    display: none!important;
}
  
/* Content Cards - Staggers the position */
.content-cards-gallery_grid-col.content-cards-gallery_grid--3col.mgi-col2 {
    margin-top: 70px;
}

.content-cards-gallery_grid-col.content-cards-gallery_grid--3col.mgi-col3 {
    margin-top: 140px;
}  
/* End of Content Cards */  
  
  
  /* Content Cards - Adds boxes around the icons */
  span#hs_cos_wrapper_widget_1704186085919_ {
    background: white;
    padding: 8px;
    border-radius: 15px;
    width: 57px;
    text-align: center;
}
  
 /* Working v1 - Add a white background card for the display responsivess features component */
  .ad_ft_step .container {
    background: linear-gradient(45deg,#4d3ce5,#7c2cf7)!important;
	border-radius: 30px;
    border: 10px white solid;
    padding: 45px!important;
    box-shadow: 0 24px 24px 0 rgb(0 31 31 / 0%), 0 16px 16px 0 rgb(0 31 31 / 4%), 0 8px 8px 0 rgb(0 31 31 / 4%), 0 4px 4px 0 rgb(0 31 31 / 4%), 0 2px 2px 0 rgb(0 31 31 / 4%), 0 0 1px 0 rgb(0 31 31 / 24%);
}

 /* Working v1 - Add a white background card for the display responsivess features component 
.ad_step_bx {
    background: white!important;
    padding: 30px!important;
    border-radius: 42px!important;
    margin-bottom: 20px!important;
}  
  */
  /* Light version of heading */
  .light-version h2 
  { 
    color: white!important; 
  }
  
  


  /* Start - Live CSS Background Gradients */
.surface {background-image: 
  linear-gradient(180deg, #0C003C 0%, #BFFFAF 100%), linear-gradient(165deg, #480045 25%, #E9EAAF 100%), linear-gradient(145deg, #480045 25%, #E9EAAF 100%), linear-gradient(300deg, rgba(233, 223, 255, 0) 0%, #AF89FF 100%), linear-gradient(90deg, #45EBA5 0%, #45EBA5 30%, #21ABA5 30%, #21ABA5 60%, #1D566E 60%, #1D566E 70%, #163A5F 70%, #163A5F 100%);
background-blend-mode: overlay, overlay, overlay, multiply, normal;}  
  
.shattered-glass{background-image: 
  linear-gradient(115deg, #000000 0%, #008500 55%, #000000 100%), linear-gradient(115deg, #0057FF 0%, #020077 100%), conic-gradient(from 110deg at -5% 35%, #000000 0deg, #FAFF00 360deg), conic-gradient(from 220deg at 30% 30%, #FF0000 0deg, #0000FF 220deg, #240060 360deg), conic-gradient(from 235deg at 60% 35%, #0089D7 0deg, #0000FF 180deg, #240060 360deg);
background-blend-mode: soft-light, soft-light, overlay, screen, normal;}    
     
     .halcyon {background-image: 
 linear-gradient(219.46deg, #FFFFFF 27.63%, #19004E 100%), radial-gradient(100% 246.94% at 100% 100%, #FFFFFF 0%, #000353 100%), linear-gradient(121.18deg, #1400FF 0.45%, #3A0000 100%), linear-gradient(222.34deg, #CF0C00 12.99%, #00574D 87.21%), linear-gradient(150.76deg, #B7D500 15.35%, #2200AA 89.57%);
background-blend-mode: overlay, overlay, difference, difference, normal;}
     
     .flawless{background-image: 
 linear-gradient(114.95deg, rgba(235, 0, 255, 0.5) 0%, rgba(0, 71, 255, 0) 34.35%), linear-gradient(180deg, #004B5B 0%, #FFA7A7 100%), linear-gradient(244.35deg, #FFB26A 0%, #3676B1 50.58%, #00A3FF 100%), linear-gradient(244.35deg, #FFFFFF 0%, #004A74 49.48%, #FF0000 100%), radial-gradient(100% 233.99% at 0% 100%, #B70000 0%, #AD00FF 100%), linear-gradient(307.27deg, #219D87 0.37%, #2650BA 50.19%, #2800C6 100%), radial-gradient(100% 140% at 100% 0%, #FF00C7 0%, #006C7A 49.48%, #760000 100%);
background-blend-mode: hard-light, overlay, overlay, overlay, difference, difference, normal;
  }
 
    /* End - Live CSS Background Gradients */

  /* Start - Feature Cards Override Button - remove  */
  #business-feature-cards a.button.button-1 {
    display: none;
}
  /* End - Feature Cards Override Button - remove  */ 
  
  
  /* Cards */  
.content-cards-card-description {
    font-size: 14px;
    padding: 0px;
    text-align: left;
}  
  
/* FAQ Box slider */
  .faq-slider.widget_1704974234809 {
    border-radius: 40px;
}
  
  
  /* Start - Content Card Styling */
  .content-cards-card-wrapper {
    background: gray;
    padding: 25px;
    border-radius: 23px;
}  
/* End - Content Card Styling */  
  
/* Start  - Filter Gallery Component */    
 .room120_portfolio__filter-cat {
    background: white;
    padding: 17px;
    border-radius: 23px;
} 
  
  .room120_portfolio__caption {
    background: white!important;
    border-radius: 0px!important;
}
   

  section.toggle-features-row.widget_1704184157627 {
    border-radius: 39px;
    padding: 20px;
    border: 9px solid #57ccb0;
}  

#hs_cos_wrapper_widget_1704184157627 .toggle-features-page-width {
padding:0px;
}
  
  
  h2{
    color:black;
  }
  
.room120_portfolio__item.web.graphic.motion {
    border: 10px solid white;
    background: white;
      box-shadow: 0 24px 24px 0 rgb(0 31 31 / 0%), 0 16px 16px 0 rgb(0 31 31 / 4%), 0 8px 8px 0 rgb(0 31 31 / 4%), 0 4px 4px 0 rgb(0 31 31 / 4%), 0 2px 2px 0 rgb(0 31 31 / 4%), 0 0 1px 0 rgb(0 31 31 / 24%);
    /* border-radius: 10px; */
}  
  /* End  - Filter Gallery Component */ 
  
/* Start - Display Feature Override */      
.avia-tooltip {
    border-radius: 14px;
    box-shadow: 0 24px 24px 0 rgb(0 31 31 / 0%), 0 16px 16px 0 rgb(0 31 31 / 4%), 0 8px 8px 0 rgb(0 31 31 / 4%), 0 4px 4px 0 rgb(0 31 31 / 4%), 0 2px 2px 0 rgb(0 31 31 / 4%), 0 0 1px 0 rgb(0 31 31 / 24%);
}  
  

  /* End - Display Feature Override */      
  
  .row-fluid-wrapper.row-depth-1.row-number-17.dnd_area-row-4-background-image.dnd-section.dnd_area-row-4-padding.every-day-issues-section {
    background: linear-gradient(358deg, #e4d4d4, #e7e5ec, #afd3e3, #eeeeee)!important;
}

</style>