:root {
  --corner-size: 7px;
  --corner-stroke: clamp(1px,.175em,3px);
  --light:#727171;
  --white: #fff;
  --dark-light: #151515;
  --dark: #0F1515;
}

@font-face {
  font-family: Gilroy;
  src: url(/font/gilroy-ultralight-webfont.woff) format("woff2");
  font-weight: 100;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-thin-webfont.woff) format("woff2");
  font-weight: 200;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-light-webfont.woff) format("woff2");
  font-weight: 300;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-regular-webfont.woff) format("woff2");
  font-weight: 400;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-medium-webfont.woff) format("woff2");
  font-weight: 500;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-semibold-webfont.woff) format("woff2");
  font-weight: 600;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-bold-webfont.woff) format("woff2");
  font-weight: 700;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-bold-webfont.woff) format("woff2");
  font-weight: 800;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-extrabold-webfont.woff) format("woff2");
  font-weight: bold;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-black-webfont.woff) format("woff2");
  font-weight: 900;
}

@font-face {
  font-family: Gilroy;
  src: url(/font/gilroy-ultralight-webfont.woff) format("woff2");
  font-weight: 100;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-thin-webfont.woff) format("woff2");
  font-weight: 200;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-light-webfont.woff) format("woff2");
  font-weight: 300;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-regular-webfont.woff) format("woff2");
  font-weight: 400;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-medium-webfont.woff) format("woff2");
  font-weight: 500;
}
@font-face {
  font-family: Gilroy;
  src: url(../font/gilroy-semibold-webfont.woff) format("woff2");
  font-weight: 600;
}
@font-face {
  font-family: "gilroy-black";
  src: url("../font/gilroy-black.woff2") format("woff2"), url("../font/gilroy-black.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Gilroy";
  src: url("../font/gilroy-extrabold.woff2") format("woff2"), url("../font/gilroy-extrabold.woff") format("woff");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: "Gilroy";
  src: url("../font/gilroy-black.woff2") format("woff2"), url("../font/gilroy-black.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Gilroy";
  src: url("../font/gilroy-bold.woff2") format("woff2"), url("../font/gilroy-bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}



body {
  background: var(--dark);
  font-style: normal;
  font-weight: 300;
  font-family: Gilroy;
}



h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  font-family: Gilroy;
}

#footer-outer .widget h4, #sidebar h4, #call-to-action .container a, .uppercase, .nectar-post-grid-wrap .load-more, .nectar-button, .nectar-button.medium, .nectar-button.small, .nectar-view-indicator span, .nectar-3d-transparent-button, .swiper-slide .button a, .play_button_with_text span[data-font*=btn], body .widget_calendar table th, body #footer-outer #footer-widgets .col .widget_calendar table th, body:not([data-header-format=left-header]) #header-outer nav > ul > .megamenu > ul > li > a, .carousel-heading h2, body .gform_wrapper .top_label .gfield_label, body .vc_pie_chart .wpb_pie_chart_heading, #infscr-loading div, #page-header-bg .author-section a, .ascend input[type=submit], .ascend button[type=submit], .material input[type=submit], .material button[type=submit], .original .checkout_coupon button[type=submit], .original.woocommerce-cart .actions button[type=submit], .ascend .checkout_coupon button[type=submit], .ascend.woocommerce-cart .actions button[type=submit], body.material #page-header-bg.fullscreen-header .inner-wrap > a, body #page-header-bg[data-post-hs=default_minimal] .inner-wrap > a, .widget h4, .text-on-hover-wrap .categories a, .meta_overlaid article.post .post-header h3, .meta_overlaid article.post.quote .post-content h3, .meta_overlaid article.post.link .post-content h3, .meta_overlaid article .meta-author a, .pricing-column.highlight h3 .highlight-reason, .blog-recent[data-style=minimal] .col > span, body .masonry.classic_enhanced .posts-container article .meta-category a, body .masonry.classic_enhanced .posts-container article.wide_tall .meta-category a, .blog-recent[data-style*=classic_enhanced] .meta-category a, .nectar-recent-posts-slider .container .strong, .single .heading-title[data-header-style=default_minimal] .meta-category a, .nectar-fancy-box .link-text, .post-area.standard-minimal article.post .post-meta .date a, .post-area.standard-minimal article.post .more-link span, body[data-button-style=rounded] #pagination > a, html body #pagination > span, body[data-form-submit=see-through-2] input[type=submit], body[data-form-submit=see-through-2] button[type=submit], body[data-form-submit=see-through] input[type=submit], body[data-form-submit=see-through] button[type=submit], body[data-form-submit=regular] input[type=submit] body[data-form-submit=regular] button[type=submit], .nectar_team_member_overlay .team_member_details .title, body:not([data-header-format=left-header]) #header-outer nav > ul > .megamenu > ul > li > ul > li.has-ul > a, .nectar_fullscreen_zoom_recent_projects .project-slide .project-info .normal-container > a, .nectar-hor-list-item .nectar-list-item-btn, .nectar-category-grid-item .content span.subtext, .yikes-easy-mc-form .yikes-easy-mc-submit-button, .nectar-cta .nectar-button-type, .nectar-post-grid-wrap .nectar-post-grid-filters h4, .nectar-inherit-btn-type {
  font-family: Gilroy;
}


body #slide-out-widget-area-bg {
  backdrop-filter: blur(3px);
  background-color: rgba(0, 0, 0, 0.3);
}

body #header-outer {
  background-color: transparent;
}

#header-outer #top ul .slide-out-widget-area-toggle a .lines-button .lines,
#header-outer.transparent #top nav ul .slide-out-widget-area-toggle a .lines-button .lines,
#header-outer.transparent.dark-slide > #top nav ul .slide-out-widget-area-toggle a .lines-button i,
#top nav ul .slide-out-widget-area-toggle a .lines,
#top nav ul .slide-out-widget-area-toggle a .lines:after,
#top nav ul .slide-out-widget-area-toggle a .lines:before {
  background-color: #fff !important;
}

#slide-out-widget-area, #slide-out-widget-area a,
#slide-out-widget-area h3, #slide-out-widget-area h4,
#header-outer .cart-outer .widget_shopping_cart_content p.woocommerce-mini-cart__empty-message,
#header-outer .cart-menu .cart-icon-wrap .icon-salient-cart,
#top nav ul #nectar-user-account a span, #top nav ul #search-btn a span {
  color: #fff;
}

#header-outer .widget_shopping_cart .cart_list a,
#header-outer .woocommerce.widget_shopping_cart .cart_list li a.remove,
#header-outer a.cart-contents .cart-wrap span {
  color: #000 !important;
}

#slide-out-widget-area.slide-out-from-right {
  background-color: var(--dark-light);
  transform: translate(340px, 0) !important;
  -webkit-transform: translate(340px, 0) !important;
  width: 340px;
  padding: 48px 18px 0;
}

#slide-out-widget-area.slide-out-from-right.open {
  transform: translate(0) !important;
  -webkit-transform: translate(0) !important;
}

#slide-out-widget-area .inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100% !important;
}

body #top nav .widget_shopping_cart a.button {
  background-color: #000 !important;
}

#header-space {
  height: 0 !important;
}

div#header-outer.side-widget-closed,
div#header-outer.at-top {
  background-color: transparent !important;
      transform: translateY(0px) translate(0px, 0px) !important;
}

#top nav ul .slide-out-widget-area-toggle a:hover .lines:before,
#top nav ul .slide-out-widget-area-toggle a:hover .lines::after {
  background-color: var(--white) !important;
}

#header-outer[data-lhe=animated_underline] #top nav > ul > li > a .menu-title-text:after {
  border-color: var(--white) !important;
}

div#header-outer.scrolling.invisible,
div#header-outer.scrolling {
  background-color: var(--dark) !important;
}

#header-outer.transparent #top #logo {
  transform: translate(0) !important;
}

#header-outer #logo img,
#header-outer .logo-spacing img {
  height: 22px;
}

#top nav ul li a, body[data-header-color=light] .mobile-header,
.body[data-header-color=light] .span_9 > .slide-out-widget-area-toggle a .label {
  color: #fff;
}

.admin-bar .wpb_row.vc_row-o-full-height.top-level,
.admin-bar .wpb_row.vc_row-o-full-height.top-level > .col.span_12 {
  min-height: calc(100vh - 32px);
}

.wpb_row.vc_row-o-full-height.top-level,
.wpb_row.vc_row-o-full-height.top-level > .col.span_12 {
  min-height: 100vh;
}

.no-padding .wpb_column.column_container {
  padding: 0;
}

#slide-out-widget-area[data-dropdown-func=separate-dropdown-parent-link] .off-canvas-menu-container li ul,
.material #slide-out-widget-area[class*=slide-out-from-right] .off-canvas-menu-container li ul {
  padding-left: 20px;
  visibility: visible !important;
  max-height: unset !important;
}

body[data-full-width-header=true] .slide_out_area_close {
  right: 25px;
  position: absolute;
  display: block;
}
body[data-full-width-header=true] .slide_out_area_close .icon-default-style {
  color: var(--light) !important;
}

#slide-out-widget-area:not(.fullscreen) ul.off-canvas-social-links li {
  padding: 0;
}
#slide-out-widget-area .ocm-dropdown-arrow {
  display: none;
}
#slide-out-widget-area .bottom-meta-wrap {
  position: absolute;
  bottom: 26px;
}
#slide-out-widget-area .bottom-meta-wrap .off-canvas-social-links li i {
  font-size: 12px;
  line-height: 12px;
  top: 1px;
}
#slide-out-widget-area .bottom-meta-wrap .off-canvas-social-links li a {
  padding: 0 4px 0 0 !important;
  opacity: 1;
}
#slide-out-widget-area .bottom-meta-wrap .off-canvas-social-links li a:hover {
  color: #fff;
}
#slide-out-widget-area .inner {
  padding-bottom: 37px;
}
#slide-out-widget-area h3 {
  font-size: 12px;
  font-weight: 600;
  line-height: 140%;
  text-transform: uppercase;
  font-family: Gilroy;
  margin-bottom: 4px;
}
#slide-out-widget-area p {
  color: var(--light);
  font-family: Gilroy;
  font-size: 12px;
  font-weight: 300;
  line-height: 140%;
}
#slide-out-widget-area .off-canvas-menu-container {
  padding-top: 80px;
  font-family: Gilroy;
}
#slide-out-widget-area .off-canvas-menu-container .menu > .menu-item:hover a, #slide-out-widget-area .off-canvas-menu-container .menu > .menu-item.current-menu-item a {
  color: var(--white);
}
#slide-out-widget-area .off-canvas-menu-container .menu > .menu-item:hover a:after, #slide-out-widget-area .off-canvas-menu-container .menu > .menu-item.current-menu-item a:after {
  transform: rotate(45deg);
}
#slide-out-widget-area .off-canvas-menu-container .menu > .menu-item > a {
  border-top: solid 1px var(--light);
  width: 100%;
  font-family: Gilroy;
  font-size: 20px;
  font-weight: 600;
  line-height: 120%;
  text-transform: uppercase;
  display: inline-block;
  position: relative;
  color: var(--light);
  padding-top: 9px;
  padding-bottom: 21px;
}
#slide-out-widget-area .off-canvas-menu-container .menu > .menu-item > a:hover {
  color: var(--white);
}
#slide-out-widget-area .off-canvas-menu-container .menu > .menu-item > a:hover:after {
  transform: rotate(45deg);
}
#slide-out-widget-area .off-canvas-menu-container .menu > .menu-item > a:after {
  content: " ";
  height: 10px;
  width: 10px;
  background-image: url(../img/arrow_back.svg);
  display: block;
  position: absolute;
  right: 0;
  top: 8px;
  transition: all 0.5s ease-out;
}
#slide-out-widget-area .off-canvas-menu-container .menu .sub-menu {
  margin-top: -2px !important;
  position: absolute !important;
  right: 23px;
  top: 3px;
}
#slide-out-widget-area .off-canvas-menu-container .menu .sub-menu li {
  margin: 0 !important;
}
body #slide-out-widget-area .inner-wrap > .inner .off-canvas-menu-container  .sub-menu li > a,
#slide-out-widget-area .off-canvas-menu-container .menu .sub-menu a {
  color: var(--light);
  font-size: 8px !important;
  font-weight: 600;
  line-height: 120%;
  font-family: Gilroy;
  text-transform: uppercase;
}
#slide-out-widget-area .off-canvas-social-links a {
  color: var(--light);
}

#homepage__banner > .col {
  max-width: 1020px;
}
#homepage__banner .nectar-animated-title-inner::after {
  display: none;
}
#homepage__banner .nectar-animated-title-inner h1, #homepage__banner .nectar-animated-title-inner h6 {
  padding: 0;
}
#homepage__casestudy {
  color: var(--dark);
}
#homepage__casestudy .casestudy--list {
  display: flex;
  gap: 24px 0;
  margin: 0;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 45px;
}
@media (min-width: 480px) {
  #homepage__casestudy .casestudy--list {
    gap: 24px 30px;
  }
}
@media (min-width: 992px) {
  #homepage__casestudy .casestudy--list {
    gap: 24px 60px;
  }
}
#homepage__casestudy .casestudy--img {
  overflow: hidden;
  position: relative;
}
#homepage__casestudy .casestudy--item {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}
@media (min-width: 480px) {
  #homepage__casestudy .casestudy--item {
    width: calc(50% - 15px);
  }
}
@media (min-width: 992px) {
  #homepage__casestudy .casestudy--item {
    width: calc(33% - 38px);
  }
}
#homepage__casestudy .casestudy--item img {
  width: 100% !important;
  margin: 0 !important;
  vertical-align: middle;
  transition: transform 0.6s cubic-bezier(0.24, 1, 0.3, 1), opacity 0.55s ease 0.25s;
  height: 100% !important;
  object-fit: cover;
}
#homepage__casestudy .casestudy--item:hover .casestudy--tooltip {
  display: block !important;
}
#homepage__casestudy .casestudy--item:hover img {
  transform: scale(1.1);
}
#homepage__casestudy .casestudy--item h3 {
  color: var(--dark);
  font-size: 16px;
  font-weight: 500;
  line-height: 140%; /* 22.4px */
  display: none;
}
#homepage__casestudy .casestudy--item h3 span {
  font-weight: 300;
}
#homepage__casestudy .casestudy--toolbox {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}
#homepage__casestudy .casestudy--toolbox:hover .casestudy--tooltip {
  display: block !important;
}
#homepage__casestudy .casestudy--toolbox:hover img {
  transform: scale(1.1);
}
#homepage__casestudy .casestudy--tooltip {
  position: absolute;
  display: none;
  background-color: rgba(230, 230, 230, 0.8);
  padding: 10px 20px;
  border-radius: 16px;
  z-index: 111;
  white-space: nowrap; /* Prevent line breaks */
  color: var(--dark);
  font-weight: 500;
  line-height: 140%;
}
#homepage__casestudy .casestudy--tooltip span {
  font-weight: 300;
}
#homepage__casestudy .nectar-animated-title-inner::after {
  display: none;
}
#homepage__casestudy .nectar-animated-title-inner h2 {
  padding: 0;
  font-size: 24px;
  font-weight: 300;
  line-height: 120%; /* 28.8px */
  color: var(--white);
}
@media (min-width: 768px) {
  #homepage__offer .toggles {
    padding-left: 80px;
  }
}
@media (min-width: 992px) {
  #homepage__offer .toggles {
    padding-left: 120px;
  }
}
@media (min-width: 1200px) {
  #homepage__offer .toggles {
    padding-left: 224px;
  }
}
#homepage__offer .nectar-animated-title-inner::after {
  display: none;
}
#homepage__offer .nectar-animated-title-inner h2 {
  padding: 0;
  font-size: 24px;
  font-weight: 300;
  line-height: 120%;
  margin-bottom: 23px;
}
#homepage__offer .toggle {
  overflow: hidden;
}
#homepage__offer .toggle:hover .toggle-heading {
  color: var(--white);
}
#homepage__offer .toggle:last-child {
  border-bottom: solid 1px rgba(255, 255, 255, 0.5);
}
#homepage__offer .toggle > .toggle-title a i {
  left: auto;
  right: 15px;
  background-image: url(../img/accordion_arrow.svg);
  width: 24px;
  height: 24px;
}
#homepage__offer .toggle > .toggle-title a i::before {
  display: none;
}
#homepage__offer .open > div {
  overflow: visible;
}
#homepage__offer .open .toggle-title a i {
  background-image: url(../img/accordion_arrow_active.svg);
}
#homepage__offer .open img {
  margin-top: 4px;
}
@media (min-width: 992px) {
  #homepage__offer .open .toggle-heading {
    color: #000;
    height: 0px;
    overflow: hidden;
    padding-top: 60px;
  }
}
#homepage__offer .open .inner-toggle-wrap {
  margin-top: -65px;
}
@media (min-width: 992px) {
  #homepage__offer .open .inner-toggle-wrap {
    margin-top: -108px;
  }
}
@media (min-width: 992px) {
  #homepage__offer .open .inner-toggle-wrap h3 {
    display: block;
  }
}
#homepage__offer .toggle-heading {
  color: var(--light, #727171);
  font-family: Gilroy;
  font-size: 35px;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
  background: transparent;
  border-top: solid 1px rgba(255, 255, 255, 0.5);
  padding-left: 10px;
  padding-top: 16px;
}
@media (min-width: 992px) {
  #homepage__offer .toggle-heading {
    font-size: 60px;
  }
}
#homepage__offer .toggle > div {
  background-color: #000;
}
#homepage__offer .toggle-title {
  z-index: 99999;
}
@media (min-width: 992px) {
  #homepage__offer .toggle-title {
    padding-bottom: 48px;
  }
}
#homepage__offer .inner-toggle-wrap h3 {
  color: #FFF;
  font-family: Gilroy;
  font-size: 60px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
  display: none;
}
#homepage__blog {
  color: var(--dark);
}
#homepage__blog .blog--list {
  display: flex;
  gap: 17px;
  margin: 0;
  flex-wrap: wrap;
  justify-content: center;
}
#homepage__blog .blog--img {
  overflow: hidden;
  position: relative;
}
#homepage__blog .blog--img h5 {
  position: absolute;
  z-index: 9;
  padding: 26px;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: 2.1px;
}
#homepage__blog .blog--date {
  color: var(--white);
  font-size: 10px;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: 2.1px;
  text-transform: uppercase;
  padding-left: 27px;
  padding-top: 11px;
}
#homepage__blog .blog--item {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  position: relative;
}
@media (min-width: 768px) {
  #homepage__blog .blog--item {
    width: calc(33.33% - 12px);
  }
}
#homepage__blog .blog--item:hover img {
  transform: scale(1.1);
  -webkit-filter: grayscale(0%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
  filter: grayscale(0%); /* FF 35+ */
}
#homepage__blog .blog--item img {
  width: 100%;
  height: 100%;
  margin: 0;
  vertical-align: middle;
  object-fit: cover;
  -webkit-filter: grayscale(100%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
  filter: grayscale(100%); /* FF 35+ */
  transition: transform 0.6s cubic-bezier(0.24, 1, 0.3, 1), opacity 0.55s ease 0.25s, filter 0.3s ease-in-out;
}
#homepage__blog h3 {
  color: var(--white);
  font-size: 25px;
  font-weight: 300;
  line-height: 120%;
  position: absolute;
  z-index: 9;
  top: 0;
  padding: 0 27px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 1200px) {
  #homepage__blog h3 {
    font-size: 40px;
  }
}
#homepage__blog .nectar-animated-title-inner::after {
  display: none;
}
#homepage__blog .nectar-animated-title-inner h2 {
  padding: 0;
  color: var(--white);
  font-size: 24px;
  font-weight: 300;
  line-height: 120%;
  margin-bottom: 25px;
}
#homepage_client .nectar-animated-title-inner::after {
  display: none;
}
#homepage_client .nectar-animated-title-inner h2 {
  padding: 0;
  color: var(--white);
  font-size: 24px;
  font-weight: 300;
  line-height: 120%;
  margin-bottom: 25px;
}

#footer .nectar-text-inline-images.right_margin_desktop_-4pct .nectar-text-inline-images__marker {
  margin-right: -3%;
}
#footer h2 {
  font-size: 60px;
  font-weight: 300;
  line-height: 120%;
}
#footer h2.widgettitle {
  font-size: 20px;
}
#footer ul#menu-footer-menu {
  margin: 0;
}
#footer ul li {
  list-style: none;
}
#footer ul li a {
  color: var(--white);
}
#footer ul li a:hover {
  opacity: 0.6;
}
#footer .nectar-cta {
  margin: 0;
  line-height: 1.15;
}
#footer .nectar-cta * {
  line-height: 1.15;
}
#footer .link_text {
  font-size: 16px;
  font-weight: 300;
  line-height: 140%;
  text-transform: none;
}
#footer__socials {
  font-size: 16px;
  font-weight: 300;
  line-height: 140%; /* 22.4px */
  margin-top: 5px;
}
#footer__socials .nectar-social {
  margin-left: 12px;
  font-size: 20px;
}
#footer__socials .nectar-social a {
  margin-right: 6px;
}
#footer .border-top {
  border-top: solid 1px rgba(255, 255, 255, 0.5);
}

#client-logo-top2 .swiper-container,
#client-logo-top .swiper-container {
  width: 100%;
  height: 150px;
  position: relative;
}
#client-logo-top2 .swiper-wrapper,
#client-logo-top .swiper-wrapper {
  -webkit-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
  position: relative;
}
#client-logo-top2 .swiper-slide,
#client-logo-top .swiper-slide {
  text-align: center;
  font-size: 33px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
  position: relative;
  overflow: hidden;
  padding: 0 50px;
  height: 150px !important;
}
#client-logo-top2 img,
#client-logo-top img {
  opacity: 0.5;
  -webkit-filter: grayscale(100%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
  filter: grayscale(100%); /* FF 35+ */
  transition: transform 0.6s cubic-bezier(0.24, 1, 0.3, 1), opacity 0.55s ease 0.25s, filter 0.3s ease-in-out;
}
#client-logo-top2 img:hover,
#client-logo-top img:hover {
  transform: scale(1.1);
  opacity: 1;
  -webkit-filter: grayscale(0%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
  filter: grayscale(0%); /* FF 35+ */
}

.container-wrap {
  transition: background-color 0.6s;
}

.casestudy-active .container-wrap {
  background-color: #fff !important;
  transition: background-color 6s;
}