body,
 html {
   margin: 0;
   padding: 0;
   overflow: hidden;
 }


 .section {
   text-align: center;
   font-size: 2em;
   display: flex;
   align-items: center;
   justify-content: center;
   height: 100vh;
   width: 100vw;
   position: relative;
 }

 .section.height-auto {
   height: auto;
 }

 .padding-top-20p {
   padding-top: 20%;
 }

 .padding-bottom-20p {
   padding-bottom: 20%;
 }

 .padding-bottom-10p {
   padding-bottom: 10%;
 }

 .padding-top-10p {
   padding-top: 10%;
 }

 .padding-bottom-5p {
   padding-bottom: 5%;
 }



 .section.no-flex {
   display: block;
 }

 #section1 {
   color: white;
 }

 #section2 {
   color: black;
 }

 #section3 {
   color: white;
 }

 #section4 {
   color: white;
 }

 #section5 {
   color: white;
 }

 #section6 {
   color: white;
 }

 html,
 body {
   font-family: "Inter", sans-serif;
   padding: 0px;
   margin: 0px;
   background: #ED3D63;
   transition: background-color 1s ease-in-out;
   scroll-behavior: smooth;
   overflow-x: hidden;
 }

 html.white-bg {
   background: #ffffff;
   overflow-y: auto;
 }

 body.white-bg {
   background: #ffffff;
   overflow-y: auto;
 }


 .home-div {
   height: 100vh;
   width: 100vw;
   display: table;
 }


 .menu-btn {
   position: fixed;
   top: 20px;
   left: 20px;
   border: none;
   color: white;
   font-size: 30px;
   cursor: pointer;
   z-index: 9999;
   background: none;
 }

 .hiding-btn {
   height: 70px;
   width: 70px;
   background: #000000;
 }

 .menu-overlay {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0);
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.4s ease, visibility 0.4s ease;
   z-index: 9999;
 }

 .menu-overlay.active {
   opacity: 1;
   visibility: visible;
 }

 .menu-overlay ul {
   list-style: none;
   padding: 0;
   text-align: center;
 }

 .menu-overlay ul li {
   margin: 20px 0;
   font-size: 2rem;
   cursor: pointer;
   transform: translateY(-20px);
   opacity: 0;
   transition: transform 0.4s ease, opacity 0.4s ease;
 }

 .menu-overlay.active ul li {
   transform: translateY(0);
   opacity: 1;
   display: inline-block;
   margin-left: 30px;
   margin-right: 30px;
 }


 .menu-overlay ul li {
   display: inline-block;
 }


 .menu-overlay ul li a,
 .menu-overlay ul li a:hover {
   color: #ffffff;
   text-decoration: none;
   font-size: 4rem;
   font-weight: 700;
 }



 .hidden-d {
   display: none;
 }


 .logo-div-animate {
   width: 100%;
   text-align: center;
   vertical-align: middle;
   position: fixed;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   transition: top 1s ease-in-out;
   z-index: 99;
 }

 .logo-div-animate.active {
   top: 35px;
   transform: translate(-50%, 0);
 }



 .logo-div-animate p {
   margin-bottom: 0px;
   color: #000;
   text-align: center;
   font-size: 30px;
   font-style: normal;
   font-weight: 600;
   line-height: normal;
   margin-top: 20px;
 }

 .scroll-lock {
   overflow: hidden;
 }


 .logo-div-animate img {
   transition: width 1s ease-in-out;
   width: 661px;
   /* Set an explicit width instead of max-width */
 }

 .logo-div-animate.active img {
   width: 150px;
   /* Reduce the width smoothly */
 }



 .max-661 {
   width: 661px;
   display: inline-block;
 }



 #video-section {
   position: relative;
   overflow: hidden;
 }

 .video-container {
   width: 1200px;
   /* Small initial width */
   height: auto;
   /* Small initial height */
   transition: all 0.5s ease-out;
   z-index: 10;
 }


 .video-wrapper:after {
   content: " ";
   position: absolute;
   height: 100%;
   background: transparent;
   width: 100%;
   left: 0px;
 }


 .video-container iframe {
   width: 100%;
   height: 100%;
   border-radius: 10px;
   transition: width 0.5s, height 0.5s, transform 0.5s;
 }


 .content-section-slide-1 h2 {
   font-family: "Source Serif 4", serif;
   font-size: 8rem;
   margin-top: 0px;
   margin-bottom: 0px;
   color: #000000;
   font-weight: 800;
   line-height: 0.7;
 }

 .content-section-slide-2 h1 {
   font-family: "Source Serif 4", serif;
   font-size: 8rem;
   margin-top: 0px;
   margin-bottom: 0px;
   color: #000000;
   font-weight: 800;
   line-height: 0.7;
 }

 .content-section-slide-1 h3 {
   font-family: "Source Serif 4", serif;
   font-size: 5.5rem;
   margin-top: 0px;
   margin-bottom: 0px;
   color: #000000;
   font-weight: 800;
   line-height: 0.7;
 }


 .content-section-slide-1 h1.title {
   font-family: "Source Serif 4", serif;
   font-size: 2rem;
   margin-top: 0px;
   margin-bottom: 0px;
   color: #000000;
   font-weight: 300;
   line-height: 1;
 }


 .content-section-slide-1 h2.small {
   font-size: 6rem;
 }

 .content-section-slide-1 .left-side-section {
   display: inline-block;
   float: left;
   width: 50%;
   text-align: left;
 }

 .left-side-section.forty {
   width: 40%;
 }

 .content-section-slide-1 .right-side-section {
   display: inline-block;
   float: left;
   width: 50%;
 }

 .content-section-slide-1 .right-side-section.sixty {
   width: 60%;
 }

 .content-section-slide-1 {
   display: table-cell;
   vertical-align: bottom;
   width: 100%;
   padding: 5%;
	padding-bottom:0px;
 }




 .big-description {
   max-width: 660px;
   color: #000000;
 }

 .big-description p {
   font-size: 20px;
   text-align: left;
 }


 .big-description p.brand-description {
   font-size: 3rem;
   letter-spacing: normal;
   line-height: normal;
 }

 .final-svg svg {
   width: 100%;
 }

 .final-svg img {
   width: 400px;
 }

 .home-div.half {
   height: 75vh;
 }

 .home-div.black-bg {
   background: #000000;
 }

 .ourservice-scroller {
   flex-wrap: nowrap;
   overflow-y: hidden;
   overflow-x: auto;
   position: relative;
   border: none;
 }

 .ourservice-scroller .services-card {
   display: inline-block;
   float: left;
   background: #8D3FD0;
   margin-right: 30px;
 }





 .ourservice-scroller {
   display: flex;
   gap: 10px;
   /* Adjust spacing between cards */
   overflow-x: auto;
   overflow-y: hidden;
   /* Prevent vertical overflow */
   scroll-snap-type: x mandatory;
   white-space: nowrap;
   padding: 10px;
   -webkit-overflow-scrolling: touch;
   /* Enable smooth scrolling on mobile */
   scrollbar-width: none;
   /* Hide scrollbar in Firefox */
   -ms-overflow-style: none;
   /* Hide scrollbar in IE/Edge */
   max-width: 100vw;
   /* Prevents extra width issues */
 }

 /* Hide scrollbar for WebKit browsers */
 .ourservice-scroller::-webkit-scrollbar {
   display: none;
 }

 .services-card.blank {
   background: transparent;
   width: 50px;
   box-shadow: none;
 }

 .services-card {
   flex: 0 0 auto;
   background: #f3f3f3;
   /* Example background */
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 16px;
   font-weight: bold;
   scroll-snap-align: start;
   box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
   width: 400px;
   height: 525px;
   color: #ffffff;
 }


 .services-card h2 {
   font-size: 36px;
   white-space: initial;
   font-weight: 300;
   text-align: left;
 }

 .services-card.item-1 {
   background: #8D3FD0;
 }

 .services-card.item-1:hover {
   background: #641AA3;
 }

 .services-card.item-2 {
   background: #ED3D63;
 }

 .services-card.item-2:hover {
   background: #BB2042;
 }

 .services-card.item-3 {
   background: #223CCF;
 }

 .services-card.item-3:hover {
   background: #0F25A4;
 }




 .services-card.item-4 {
   background: #641AA3;
 }

 .services-card.item-5 {
   background: #BB2042;
 }

 .services-card.item-6 {
   background: #0F25A4;
 }

 .requires-padding {
   padding-top: 25%;
 }


 .services-card .card-content {
   white-space: initial;
   color: #ffffff;
   text-align: center;
 }


 .services-card .card-content img {
   width: 150px;
 }

 .services-card .card-content h2 {
   text-align: left;
 }




 /* Card color variables */

 .services-card {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 20px;
   position: relative;
 }




 .services-card .card-new {
   overflow: hidden;
   transition: all 0.3s ease-out;
   box-sizing: border-box;
   background-color: transparent;
 }

 .services-card .card-new:hover {
   transform: translateY(-5px) scale(1.005) translateZ(0);
   box-shadow: 0 24px 36px rgba(0, 0, 0, 0.11),
     0 24px 46px var(--box-shadow-color);
 }

 .services-card .card-new:hover .overlay {
   transform: scale(4) translateZ(0);
 }


 .services-card .card-new:active {
   transform: scale(1) translateZ(0);
   box-shadow: 0 15px 24px rgba(0, 0, 0, 0.11),
     0 15px 24px var(--box-shadow-color);
 }


 .services-card .circle-new {
   text-align: center;
   margin-top: 120px;
 }



 .services-card:hover .circle-new {
   display: none;
 }


 .services-card .circle-new img {
   width: 250px;
   z-index: 10;
 }


 /* Content styles */
 .services-card .card-content {
   text-align: center;
   z-index: 2;
   display: none;
   margin-top: 100px;
   position: relative;
 }

 .services-card:hover .card-content {
   display: block;
 }

 .services-card .card-content h2 {
   font-size: 22px;
   color: #333;
   margin-bottom: 15px;
 }

 .services-card .card-content .description {
   font-size: 20px;
   line-height: 1.5;
   color: #ffffff;
   margin-bottom: 20px;
   text-align: left;
   font-weight: normal;
 }

 .services-card .divider {
   height: 1px;
   width: 50px;
   background-color: #eee;
   margin: 15px auto;
 }

 .services-card .know-more {
   display: none;
 }


 .services-card:hover .know-more {
   font-size: 14px;
   letter-spacing: 1px;
   text-align: right;
   transition: color 0.3s ease-out;
   margin-top: 10px;
   font-weight: 300;
   color: #ffffff;
   text-decoration: none;
   display: inline-block;
   width: 100%;
   position: absolute;
   bottom: 10px;
   right: 10px;
 }


 .text-white {
   color: #ffffff;
 }





 .fade-on-scroll {
   opacity: 1;
   transform: translateY(0);
   transition: opacity 0.8s ease, transform 0.8s ease;
 }

 .fade-on-scroll.active {
   opacity: 0;
   transform: translateY(-50px);
   /* Moves text 50px upwards */
 }




 .video-container {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 100%;
   height: 100%;
   margin-top: 50px;
 }

 .video-wrapper {
   position: relative;
   width: 100vw;
   /* Adjust width as needed */
   height: 50vw;
   /* Maintain aspect ratio for 16:9 */
   max-width: 1200px;
   max-height: 600px;
 }

 .video-wrapper iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 1;
   pointer-events: none;
 }


 .case-study p {
   font-size: 1.2rem;
   font-style: normal;
   font-weight: 300;
   line-height: 1.5;
   margin-bottom: 0px;
 }

 .case-study h3 {
   color: #FFF;
   font-family: "Source Serif 4";
   font-size: 3rem;
   font-style: normal;
   line-height: 1;
 }




 .case-study a,
 .case-study a:hover {
   color: #FFF;
   font-size: 1.2rem;
   font-style: normal;
   font-weight: 300;
   line-height: 1.5;
   /* 173.077% */
   text-decoration: none;
 }



 .height-100 {
   height: 100vh;
 }

 .w-100 {
   width: 100%;
 }


 .bg-case-study {
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center center;
 }


 .align-center-top {
   display: table-cell;
   vertical-align: middle;
 }

 .display-table {
   display: table;
 }


 .content-section-slide-1 .left-side-section.display-table {
   display: table;
 }

 .padding-left-5 {
   padding-left: 5%;
 }

 .logo-div {
   display: inline-block;
   margin-left: 10px;
   margin-right: 10px;
   width: calc(20% - 40px);
 }

 .all-clients-logos {
   background-color: #ffffff;
   padding-top: 10%;
   padding-bottom: 10%;
 }


 .flex-start {
   align-items: flex-start;
 }


 .footer {
   display: flex;
   justify-content: space-between;
   padding: 40px;
   background: #000;
   color: #fff;
 }

 .footer-left {
   max-width: 300px;
   text-align: left;
 }

 .footer-left h2 {
   font-size: 50px;
   font-weight: 400;
 }

 .footer-left p {
   margin: 5px 0;
   font-size: 16px;
   font-weight: 300;
 }

 .footer-left a {
   color: #fff;
   text-decoration: none;
   font-weight: 300;
 }

 .social-icons {
   margin-top: 15px;
 }

 .social-icons a {
   color: #fff;
   font-size: 18px;
   margin-right: 10px;
   text-decoration: none;
   font-weight: 300;
 }

 .footer-right {
   text-align: left;
 }

 .footer-links {
   display: flex;
   justify-content: space-between;
   gap: 40px;
   position: relative;
 }


 .footer-links div {
   position: relative;
 }



 .footer-links svg {}

 .footer-links h4 {
   margin: 5px 0;
   font-weight: normal;
   font-size: 16px;
   cursor: pointer;
   margin-bottom: 0px;
   font-weight: 300;
   position: relative;
   position: relative;
   margin-bottom: -20px;
   padding-bottom: 10px;
 }

 .footer-bottom {
   margin-top: 20px;
   display: flex;
   justify-content: flex-end;
   gap: 15px;
   font-size: 14px;
 }

 .footer-bottom a {
   color: #fff;
   text-decoration: none;
 }





 .footer-bottom p {
   font-weight: 300;
 }


 .display-inline-block {
   display: inline-block;
 }

 .text-center {
   text-align: center;
 }

 .text-black {
   color: #000000;
 }

 .max-width-660px {
   max-width: 660px;
 }

 .max-width-80p {
   max-width: 80%;
 }

 .max-width-70p {
   max-width: 70%;
 }

 .text-description {
   font-size: 20px;
 }

 .margin-top-50 {
   margin-top: 50px;
 }

 .margin-extra {
   margin-top: 50px;
 }





 .team-wrapper {
   display: flex;
   width: 100%;
   justify-content: space-around;
   display: inline-block;
   text-align: center;
 }

 .team-card {
   width: 300px;
   height: 400px;
   padding: 1.5rem;
   background: white;
   position: relative;
   display: flex;
   align-items: flex-end;
   transition: 0.4s ease-out;
   display: inline-block;
   margin: 20px;
   padding-top: 0px;
 }

 .team-card:hover:before {
   opacity: 0;
 }

 .team-card .info {
   opacity: 0;
 }

 .team-card:hover .info {
   opacity: 1;
 }

 .team-card:before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   display: block;
   width: 100%;
   height: 100%;
   z-index: 2;
   transition: 0.5s;
   opacity: 0;
 }

 .team-card.bg-1:before {
   background: rgba(237, 61, 99, 0.95);
 }

 .team-card.bg-2:before {
   background: rgba(141, 63, 208, 0.95);
 }

 .team-card.bg-3:before {
   background: rgba(0, 159, 247, 0.95);
 }

 .team-card.bg-4:before {
   background: rgba(34, 60, 207, 0.95);
 }

 .team-card.bg-5:before {
   background: rgba(22, 27, 127, 0.95);
 }

 .team-card.bg-6:before {
   background: rgba(0, 159, 247, 0.95);
 }

 .team-card.bg-7:before {
   background: rgba(237, 61, 99, 0.95);
 }

 .team-card.bg-8:before {
   background: rgba(141, 63, 208, 0.95);
 }

 .team-card.bg-9:before {
   background: rgba(34, 60, 207, 0.95);
 }

 .team-card.bg-10:before {
   background: rgba(22, 27, 127, 0.95);
 }




 .team-card:hover:before {
   opacity: 1;
 }


 .team-card img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
   position: absolute;
   top: 0;
   left: 0;
 }

 .team-card .info {
   position: relative;
   z-index: 3;
   color: white;
   opacity: 0;
   transform: translateY(30px);
   transition: 0.5s;
   height: 100%;
 }

 .team-card .info h2 {
   margin: 0px;
   text-align: left;
   font-size: 20px;
   font-weight: 300;
   margin-bottom: 10px;
 }

 .team-card .info p {
   letter-spacing: 1px;
   font-size: 12px;
   margin-top: 8px;
   font-weight: 200;
 }


 .team-intro {
   overflow: hidden;
   text-align: left;
   position: absolute;
 }


 .team-card .info h3 {
   margin: 0px;
   text-align: left;
   font-size: 14px;
   font-weight: 300;
 }

 .final-svg {
   bottom: 10px;
 }

 .know-more svg {
   width: 16px;
 }


 .menu-btn-black-top,
 .menu-btn-black-top:hover {
   position: fixed;
   right: 10px;
   top: 20px;
   background: #000000;
   color: #ffffff;
   border: none;
   height: 70px;
   width: 140px;
   z-index: 99999;
   text-decoration: none;
   text-align: center;
   line-height: 70px;
 }


 .highe-z-index {
   z-index: 999;
 }

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

 .pright-0 {
   padding-right: 0px;
 }

 .margin-top-30 {
   margin-top: 30px;
 }

 .show-only-mobile {
   display: none !important;
 }



 .advertising-block {
   display: flex;
   flex-direction: column;
   gap: 22px;
   align-items: flex-start;
   justify-content: flex-start;
   position: relative;
 }


 .advertising-descr-p {
   color: #000000;
   text-align: left;
   font-size: 20px;
   line-height: 1.5;
   font-weight: 200;
   position: relative;
   align-self: stretch;
 }

 .liner-inline {
   margin-top: -4px;
   border-style: solid;
   border-color: #223ccf;
   border-width: 4px 0 0 0;
   flex-shrink: 0;
   width: 103px;
   height: 0px;
   position: relative;
 }

 .liner-inline.pink {
   border-color: #ED3D63;
 }

 .liner-inline.blue {
   border-color: #009FF7;
 }



 .advertising-descr {
   display: flex;
   flex-direction: column;
   gap: 0px;
   align-items: flex-start;
   justify-content: flex-start;
   flex-shrink: 0;
   position: relative;
 }

 .advertising-descr-title {
   color: #000000;
   text-align: left;
   font-size: 24px;
   line-height: 1.5;
   font-weight: 500;
   position: relative;
   align-self: stretch;
 }


 .advertising-block h1 {
   color: #000;
   font-family: "Source Serif 4";
   font-size: 56px;
   font-style: normal;
   font-weight: 500;
   line-height: 1.5;
   text-transform: uppercase;
   text-align: left;
 }


 .advert-left {
   text-align: center;
 }

 .advert-left svg {
   width: 60%;
   text-align: center;
 }



 .advert-left.brand-solutions svg {
   margin-top: 140px;
 }


 .logo-section-adv {
   display: inline-block;
   width: 100%;
   margin-top: 100px;
   margin-bottom: 100px
 }

 .logo-section-adv div {
   width: calc(20% - 20px);
   display: inline-block;
   height: 100px;
 }


 .get-in-touch-details {
   display: flex;
   flex-direction: column;
   gap: 35px;
   align-items: flex-start;
   justify-content: flex-start;
   position: relative;
   padding-right: 10%;
 }

 .get-in-touch {
   color: #000;
   font-family: "Source Serif 4", serif;
   font-size: 70px;
   font-style: normal;
   font-weight: 400;
   line-height: 80px;
 }

 .get-in-touch-details .frame-12 {
   display: flex;
   flex-direction: column;
   gap: 30px;
   align-items: flex-start;
   justify-content: flex-start;
   align-self: stretch;
   flex-shrink: 0;
   position: relative;
 }

 .get-in-touch-details .frame-10 {
   display: flex;
   flex-direction: column;
   gap: 13px;
   align-items: flex-start;
   justify-content: flex-start;
   flex-shrink: 0;
   position: relative;
 }

 .want-to-talk-about-your-brand {
   color: #000000;
   text-align: left;
   font-size: 30px;
   line-height: 45px;
   font-weight: 500;
   position: relative;
   align-self: stretch;
 }

 .newbusiness-rb-2-f-com {
   color: #000000;
   text-align: left;
   font-size: 24px;
   font-weight: 300;
   text-decoration: underline;
   position: relative;
   align-self: stretch;
 }

 .get-in-touch-details .frame-11 {
   display: flex;
   flex-direction: column;
   gap: 0px;
   align-items: flex-start;
   justify-content: flex-start;
   flex-shrink: 0;
   position: relative;
 }

 .want-a-job {
   color: #000000;
   text-align: left;
   font-size: 30px;
   line-height: 45px;
   font-weight: 500;
   position: relative;
   align-self: stretch;
 }

 .careers-rb-2-f-com {
   color: #000000;
   text-align: left;
   font-size: 20px;
   font-weight: 200;
   position: relative;
   align-self: stretch;
 }

 .form-p {
   color: #000000;
   text-align: left;
   font-size: 20px;
   font-weight: 200;
   position: relative;
   align-self: stretch;
 }


 .contact-form input,
 .contact-form input:focus,
 .contact-form select,
 .contact-form select:focus,
 .contact-form textarea:focus,
 .contact-form textarea {
   width: 100%;
   background: #F5F5F5;
   color: #000000;
   font-size: 20px;
   font-style: normal;
   font-weight: 400;
   line-height: normal;
   margin-top: 10px;
   margin-bottom: 10px;
   border: none;
   padding: 10px;
   outline: none;
 }

 .contact-form input,
 .contact-form select {
   height: 70px;
 }



 input::placeholder,
 textarea::placeholder {
   font-style: normal;
   color: #8C8C8C;
   font-size: 20px;
   font-style: normal;
   font-weight: 300;
 }


 .btn.btn-brand {
   background: #ED3D63;
   color: #fff;
   font-size: 20px;
   border-radius: 0px;
   width: 100%;
   height: 50px;
   line-height: 50px;
   position: relative;
   padding: 0px;
 }


 .btn.btn-brand svg {
   position: absolute;
   top: 10px;
   margin-left: 10px;
 }



 .footer-links h4 a,
 .footer-links h4 a:hover {
   text-decoration: none;
   color: #ffffff;
 }


 .rb2-menu {
   width: 50%;
 }

 .rb2-menu-item,
 .rb2-menu-item:hover {
   font-family: "Source Serif 4", serif;
   padding: 15px;
   text-decoration: none;
   font-size: 40px;
   border-bottom: 1px solid gray;
   cursor: pointer;
   display: inline-block;
   width: 100%;
   color: #fff;
   font-weight: 600;
   padding-left: 0px;
 }

 .rb2-menu-item:hover,
 .rb2-menu-item:focus {
   color: #ED3D63;
 }


 .rb2-menu-item .dropdown {
   padding-left: 0px;
 }

 .rb2-menu-item .dropdown a,
 .rb2-menu-item .dropdown a:hover {
   font-size: 30px;
   padding-left: 0px;
   text-decoration: none;
   padding-bottom: 0px;
   padding-top: 0px;
   font-weight: 400;
 }

 .rb2-menu-item .dropdown a:hover {
   color: #ED3D63;
 }


 .dropdown {
   display: none;
   background-color: black;
   padding-left: 20px;
 }

 .dropdown a {
   display: block;
   padding: 10px;
   text-decoration: none;
   color: white;
   font-size: 18px;
 }

 .dropdown a:hover {
   text-decoration: underline;
 }

 .arrow-drp {
   float: right;
 }


 .arrow-drp svg {
   width: 20px;
   height: 20px;
 }


 .final-svg.max-height-300 svg {
   max-height: 300px;
 }

 .final-svg.max-width-200 svg {
   max-width: 500px;
 }



 .final-svg.max-width-200 img {
   max-width: 300px;
 }

 .color-black,
 .color-black:hover,
 .color-black:focus {
   color: #000000;
 }




 .grid-container {
   columns: 3 200px;
   column-gap: 1.5rem;
   width: 90%;
   margin: 0 auto;
 }

 .grid-container div,
 .grid-container a {
   width: 150px;
   margin: 0 1.5rem 1.5rem 0;
   display: inline-block;
   width: 100%;
   border: solid 2px black;
   padding: 5px;
   box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
   border-radius: 5px;
   transition: all 0.25s ease-in-out;
   text-decoration: none;
 }

 .grid-container div:hover img,
 .grid-container a:hover img {
   filter: grayscale(0);
 }

 .grid-container div:hover,
 .grid-container a:hover {
   border-color: coral;
 }

 .grid-container a img,
 .grid-container div img {
   width: 100%;
   filter: grayscale(100%);
   border-radius: 5px;
   transition: all 0.25s ease-in-out;
 }

 .grid-container a p,
 .grid-container div p {
   margin: 5px 0;
   padding: 0;
   text-align: center;
   font-style: italic;
   color: #000000;
 }



 .brand-video {
   width: 100%;
 }

 .brand-video video {
   width: 100%;
 }




 .video-play-button {
   display: -ms-flexbox;
   display: flex;
   -ms-flex-pack: center;
   justify-content: center;
   left: 0;
   margin: 0 auto;
   opacity: 1;
   position: absolute;
   right: 0;
   top: 50%;
   transform: translateY(-50%);
   transition: visibility .7s, opacity .7s ease;
   visibility: visible;
   width: 100%;
   z-index: 1;
 }

 .video-play-button__button {
   background: 0 0;
   border: none;
   box-shadow: none;
   cursor: pointer;
   display: block;
   outline: 0;
   padding: 0;
 }

 .video-play-button__button__background {
   background-color: #ffcd0f;
   border: none;
   box-shadow: none;
   display: block;
   height: 74px;
   opacity: .6;
   width: 74px;
 }

 @media only screen and (max-width:767px) {
   .video-play-button__button__background {
     width: 60px;
     height: 60px;
   }
 }

 .video-play-button__play {
   border-bottom: 8px solid transparent;
   border-left: 12px solid #fff;
   border-top: 8px solid transparent;
   height: 0;
   left: 50%;
   position: absolute;
   top: 50%;
   transform: translate(-50%, -50%);
   width: 0;
 }

 .teaser-play-button {
   display: -ms-flexbox;
   display: flex;
   z-index: 500;
 }

 * {
   box-sizing: border-box;
 }

 .pause {
   width: 15px;
   left: 50%;
   position: absolute;
   top: 50%;
   transform: translate(-50%, -50%);
 }

 #pause_section {
   display: none;
 }

 :focus {
   outline: 0 !important;
 }

 .thar_video {
   margin-top: 0px;
   width: 100%;
   height: 90vh;
   display: block;
   position: relative;
 }

 .thar_video video {
   height: inherit;
   width: inherit;
 }

 .play_btn,
 .pause_btn {
   top: 50% !important;
 }

 @media screen and (max-width: 767px) {
   .thar_video {
     height: auto !important;
   }
 }









 .manifesto .section-subtitle {
   color: #fff;
 }

 .manifesto .copy-section__container {
   overflow: hidden;
 }

 @media only screen and (min-width:1000px) {
   .manifesto .copy-section__subtitle {
     padding-top: 0;
   }
 }

 .copy-section__container {
   margin-left: auto;
   margin-right: auto;
   padding-bottom: 10px;
   padding-top: 10px;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-direction: column;
   flex-direction: column;
   width: 74.35897%;
 }

 @media only screen and (min-width:768px) {
   .copy-section__container {
     padding-bottom: 100px;
     padding-top: 100px;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__container {
     padding-bottom: 10px;
     padding-top: 10px;
   }
 }

 @media only screen and (min-width:768px) {
   .copy-section__container {
     width: 83.05085%;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__container {
     -ms-flex-direction: row;
     flex-direction: row;
     width: 74.68354%;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__content {
     margin-left: 1.69492%;
     width: 66.10169%;
   }
 }

 @media only screen and (max-width:767px) {
   .copy-section__container {
     width: 90%;
     padding-top: 10px;
   }
 }

 .copy-section__title {
   font-size: 2.5rem;
   letter-spacing: -.15rem;
   line-height: 1.1;
   margin-bottom: 50px;
 }

 @media only screen and (min-width:768px) {
   .copy-section__title {
     font-size: 2.75rem;
     letter-spacing: -.09375rem;
     line-height: 1.04545;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__title {
     font-size: 2.75rem;
     letter-spacing: -.09375rem;
     line-height: 1.04545;
   }
 }

 @media only screen and (min-width:2000px) {
   .copy-section__title {
     font-size: 4.625rem;
     letter-spacing: -.1875rem;
     line-height: 1.02703;
   }
 }

 .copy-section--intro .copy-section__title {
   font-size: 1.875rem;
   line-height: 1.4;
   color: #fff;
   margin-bottom: 30px !important;
   letter-spacing: normal !important;
 }

 @media only screen and (min-width:768px) {
   .copy-section--intro .copy-section__title {
     font-size: 2.625rem;
     letter-spacing: -.0625rem;
     line-height: 1.28571;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section--intro .copy-section__title {
     font-size: 50px;
     line-height: 1.25;
   }
 }

 @media only screen and (min-width:2000px) {
   .copy-section--intro .copy-section__title {
     font-size: 4.625rem;
     line-height: 1.21622;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__title {
     margin-bottom: 70px;
   }
 }

 .section-subtitle {
   font-size: .875rem;
   letter-spacing: -.04063rem;
   line-height: 1.42857;
   color: #fff;
   margin-bottom: 50px;
   width: 82.75862%;
 }

 @media only screen and (min-width:768px) {
   .section-subtitle {
     font-size: 1rem;
     letter-spacing: -.04063rem;
     line-height: 1;
   }
 }

 @media only screen and (min-width:1000px) {
   .section-subtitle {
     font-size: 1rem;
     letter-spacing: -.04063rem;
     line-height: 1;
   }
 }

 @media only screen and (min-width:2000px) {
   .section-subtitle {
     font-size: 1.25rem;
     letter-spacing: -.04063rem;
     line-height: 1;
   }
 }

 @media only screen and (min-width:768px) {
   .section-subtitle {
     width: 48.97959%;
   }
 }

 @media only screen and (min-width:1000px) {
   .section-subtitle {
     width: 32.20339%;
   }
 }

 @media only screen and (max-width:1600px) {
   .manifesto .copy-section__subtitle {
     padding-top: 0;
   }
 }

 @media only screen and (max-width:1400px) {
   .manifesto .copy-section__subtitle {
     padding-top: 0;
   }
 }

 @media only screen and (max-width:1250px) {
   .manifesto .copy-section__subtitle {
     padding-top: 0;
   }
 }

 @media (max-height:768px) {
   .para_head {
     margin-top: 14px;
   }
 }

 :focus {
   outline: 0 !important;
 }

 .copy-section__content {
   color: #000;
   position: relative;
 }

 .para_head {
   font-size: 1.5rem;
   letter-spacing: -.0625rem;
   line-height: 1.25;
   display: block;
 }

 .para_content_small {
   font-size: 1.125rem !important;
   letter-spacing: -.01719rem !important;
   line-height: 1.88889 !important;
   margin-bottom: 0px !important;
 }

 .second-content-container {
   padding-top: 100px !important;
   padding-bottom: 0 !important;
 }

 @media screen and (max-width: 767px) {
   .para_head {
     margin-bottom: 30px;
   }
 }

 @media screen and (max-width: 767px) {
   .para_head {
     margin-bottom: 0px !important;
     ;
     padding-top: 0px !important;
     ;
     padding-bottom: 0px !important;
   }
 }

 .para_content_small {
   font-size: 24px !important;
   font-weight: 200;
   letter-spacing: normal;
   margin-bottom: 0px !important;
 }



 .black-bg {
   background: #000000;
 }





 .manifesto .copy-section__container {
   overflow: hidden;
 }

 .copy-section__container {
   margin-left: auto;
   margin-right: auto;
   padding-bottom: 10px;
   padding-top: 10px;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-direction: column;
   flex-direction: column;
   width: 74.35897%;
 }

 @media only screen and (min-width:768px) {
   .copy-section__container {
     padding-bottom: 100px;
     padding-top: 100px;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__container {
     padding-bottom: 10px;
     padding-top: 10px;
   }
 }

 @media only screen and (min-width:768px) {
   .copy-section__container {
     width: 83.05085%;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__container {
     -ms-flex-direction: row;
     flex-direction: row;
     width: 74.68354%;
   }
 }

 @media only screen and (max-width:767px) {
   .copy-section__container {
     width: 90%;
     padding-top: 10px;
   }
 }

 :focus {
   outline: 0 !important;
 }

 .slider_container {
   width: 93.68354% !important;
   padding-left: 50px !important;
   padding-right: 50px !important;
 }

 .mob-1-head {
   font-family: "Source Serif 4", serif;
   font-size: 2.75rem;
   line-height: 1.25;
 }

 .mob-1-row {
   margin-top: 90px;
 }

 .left-h4 {
   margin-top: 60px;
   font-size: 2.75rem;
   letter-spacing: -.09375rem;
   line-height: 1.04545;
 }

 .left-h4-p {
   font-family: "Source Serif 4", serif;
   font-size: 1.125rem;
   letter-spacing: -.01719rem;
   margin-top: 50px;
   line-height: 1.88889;
 }

 .bottom-h4 {
   margin-top: 60px;
   font-size: 2.75rem;
   line-height: 1.04545;
 }

 .bottom-h4-p {
   margin-top: 105px;
   font-size: 6.75rem;
   letter-spacing: -.09375rem;
   line-height: 1.04545;
 }

 .mob-first-img {
   position: absolute;
   right: 0;
 }

 .mob-1-left {
   margin-top: 190px;
 }

 .mob-second-content {
   margin-left: 33%;
 }

 .mob-second-img {
   position: absolute;
   left: 0;
 }

 .mob-second-img img {
   margin-top: 130px;
 }

 .project_details {
   background-color: #B7B7B7;
   border-color: #ffffff;
   color: #ffffff;
 }

 .project_details_cont {
   padding-top: 50px;
   margin-top: 100px;
 }

 hr {
   border-top: 1px solid #fff !important;
 }

 @media screen and (max-width: 767px) {
   .slider_container {
     padding-left: 30px !important;
     padding-right: 30px !important;
     margin-bottom: 50px !important;
   }

   .mob-1-left {
     margin-top: 50px;
   }

   .bottom-h4-p {
     margin-top: 50px;
   }

   .mob-first-img {
     position: relative;
     width: 100%;
   }

   .mob-first-img img {
     width: 100%;
   }

   .mob-second-img {
     position: relative;
   }

   .mob-second-img img {
     width: 100%;
   }

   .mob-second-content {
     margin-left: 0px;
   }
 }

 @media screen and (max-width: 767px) {
   .slider_container {
     padding-left: 30px !important;
     padding-right: 30px !important;
     margin-bottom: 50px !important;
   }
 }


 .float-img-right img {
   float: right;
 }







 .manifesto .copy-section__container {
   overflow: hidden;
 }

 .copy-section__container {
   margin-left: auto;
   margin-right: auto;
   padding-bottom: 10px;
   padding-top: 10px;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-direction: column;
   flex-direction: column;
   width: 74.35897%;
 }

 @media only screen and (min-width:768px) {
   .copy-section__container {
     padding-bottom: 100px;
     padding-top: 100px;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__container {
     padding-bottom: 10px;
     padding-top: 10px;
   }
 }

 @media only screen and (min-width:768px) {
   .copy-section__container {
     width: 83.05085%;
   }
 }

 @media only screen and (min-width:1000px) {
   .copy-section__container {
     -ms-flex-direction: row;
     flex-direction: row;
     width: 74.68354%;
   }
 }

 @media only screen and (max-width:767px) {
   .copy-section__container {
     width: 90%;
     padding-top: 10px;
   }
 }

 :focus {
   outline: 0 !important;
 }

 .carousel {
   margin: auto;
 }

 .slider_container {
   width: 93.68354% !important;
   padding-left: 50px !important;
   padding-right: 50px !important;
 }

 .carousel-control-prev {
   background: transparent;
   opacity: 1;
   height: 76px;
   width: 12%;
   margin-left: -40px;
   z-index: 1000;
   -webkit-filter: drop-shadow(1px 3px 0px rgba(0, 0, 0, 0.9));
   filter: drop-shadow(1px 3px 0px rgba(0, 0, 0, 0.9));
   top: 43%;
 }

 .carousel-control-next {
   background: transparent;
   opacity: 1;
   height: 76px;
   width: 12%;
   margin-right: -40px;
   z-index: 1000;
   top: 43%;
   -webkit-filter: drop-shadow(1px 3px 0px rgba(0, 0, 0, 0.9));
   filter: drop-shadow(1px 3px 0px rgba(0, 0, 0, 0.9));
 }

 .carousel-indicators {
   bottom: -50px;
 }

 .carousel-indicators li {
   background-color: #8e8e8e;
 }

 .carousel-indicators .active {
   background-color: #fff;
 }

 @media screen and (max-width: 767px) {
   .carousel-control-prev {
     height: 45px;
     width: 18%;
     top: 34%;
     margin-left: -30px;
   }

   .carousel-control-next {
     height: 45px;
     width: 18%;
     top: 34%;
     margin-right: -30px;
   }

   .slider_container {
     padding-left: 30px !important;
     padding-right: 30px !important;
     margin-bottom: 50px !important;
   }
 }

 @media screen and (max-width: 767px) {
   .carousel-control-prev {
     height: 45px !important;
     ;
     width: 18% !important;
     ;
     top: 34% !important;
     ;
     margin-left: -45px !important;
   }

   .carousel-control-next {
     height: 45px !important;
     ;
     width: 18% !important;
     ;
     top: 34% !important;
     ;
     margin-right: -45px !important;
   }

   .slider_container {
     padding-left: 30px !important;
     padding-right: 30px !important;
     margin-bottom: 50px !important;
   }
 }







 .w3-image {
   max-width: 100%;
   height: auto
 }

 img {
   vertical-align: middle
 }

 a {
   color: inherit
 }

 .w3-table,
 .w3-table-all {
   border-collapse: collapse;
   border-spacing: 0;
   width: 100%;
   display: table
 }

 .w3-table-all {
   border: 1px solid #ccc
 }

 .w3-bordered tr,
 .w3-table-all tr {
   border-bottom: 1px solid #ddd
 }

 .w3-striped tbody tr:nth-child(even) {
   background-color: #f1f1f1
 }

 .w3-table-all tr:nth-child(odd) {
   background-color: #fff
 }

 .w3-table-all tr:nth-child(even) {
   background-color: #f1f1f1
 }

 .w3-hoverable tbody tr:hover,
 .w3-ul.w3-hoverable li:hover {
   background-color: #ccc
 }

 .w3-centered tr th,
 .w3-centered tr td {
   text-align: center
 }

 .w3-table td,
 .w3-table th,
 .w3-table-all td,
 .w3-table-all th {
   padding: 8px 8px;
   display: table-cell;
   text-align: left;
   vertical-align: top
 }

 .w3-table th:first-child,
 .w3-table td:first-child,
 .w3-table-all th:first-child,
 .w3-table-all td:first-child {
   padding-left: 16px
 }

 .w3-btn,
 .w3-button {
   border: none;
   display: inline-block;
   padding: 8px 16px;
   vertical-align: middle;
   overflow: hidden;
   text-decoration: none;
   color: inherit;
   background-color: inherit;
   text-align: center;
   cursor: pointer;
   white-space: nowrap
 }

 .w3-btn:hover {
   box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
 }

 .w3-btn,
 .w3-button {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none
 }

 .w3-disabled,
 .w3-btn:disabled,
 .w3-button:disabled {
   cursor: not-allowed;
   opacity: 0.3
 }

 .w3-disabled *,
 :disabled * {
   pointer-events: none
 }

 .w3-btn.w3-disabled:hover,
 .w3-btn:disabled:hover {
   box-shadow: none
 }

 .w3-badge,
 .w3-tag {
   background-color: #000;
   color: #fff;
   display: inline-block;
   padding-left: 8px;
   padding-right: 8px;
   text-align: center
 }

 .w3-badge {
   border-radius: 50%
 }

 .w3-ul {
   list-style-type: none;
   padding: 0;
   margin: 0
 }

 .w3-ul li {
   padding: 8px 16px;
   border-bottom: 1px solid #ddd
 }

 .w3-ul li:last-child {
   border-bottom: none
 }

 .w3-tooltip,
 .w3-display-container {
   position: relative
 }

 .w3-tooltip .w3-text {
   display: none
 }

 .w3-tooltip:hover .w3-text {
   display: inline-block
 }

 .w3-ripple:active {
   opacity: 0.5
 }

 .w3-ripple {
   transition: opacity 0s
 }

 .w3-input {
   padding: 8px;
   display: block;
   border: none;
   border-bottom: 1px solid #ccc;
   width: 100%
 }

 .w3-select {
   padding: 9px 0;
   width: 100%;
   border: none;
   border-bottom: 1px solid #ccc
 }

 .w3-dropdown-click,
 .w3-dropdown-hover {
   position: relative;
   display: inline-block;
   cursor: pointer
 }

 .w3-dropdown-hover:hover .w3-dropdown-content {
   display: block
 }

 .w3-dropdown-hover:first-child,
 .w3-dropdown-click:hover {
   background-color: #ccc;
   color: #000
 }

 .w3-dropdown-hover:hover>.w3-button:first-child,
 .w3-dropdown-click:hover>.w3-button:first-child {
   background-color: #ccc;
   color: #000
 }

 .w3-dropdown-content {
   cursor: auto;
   color: #000;
   background-color: #fff;
   display: none;
   position: absolute;
   min-width: 160px;
   margin: 0;
   padding: 0;
   z-index: 1
 }

 .w3-check,
 .w3-radio {
   width: 24px;
   height: 24px;
   position: relative;
   top: 6px
 }

 .w3-sidebar {
   height: 100%;
   width: 200px;
   background-color: #fff;
   position: fixed !important;
   z-index: 1;
   overflow: auto
 }

 .w3-bar-block .w3-dropdown-hover,
 .w3-bar-block .w3-dropdown-click {
   width: 100%
 }

 .w3-bar-block .w3-dropdown-hover .w3-dropdown-content,
 .w3-bar-block .w3-dropdown-click .w3-dropdown-content {
   min-width: 100%
 }

 .w3-bar-block .w3-dropdown-hover .w3-button,
 .w3-bar-block .w3-dropdown-click .w3-button {
   width: 100%;
   text-align: left;
   padding: 8px 16px
 }

 .w3-main,
 #main {
   transition: margin-left .4s
 }

 .w3-modal {
   z-index: 3;
   display: none;
   padding-top: 100px;
   position: fixed;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   overflow: auto;
   background-color: rgb(0, 0, 0);
   background-color: rgba(0, 0, 0, 0.4)
 }

 .w3-modal-content {
   margin: auto;
   background-color: #fff;
   position: relative;
   padding: 0;
   outline: 0;
   width: 600px
 }

 .w3-bar {
   width: 100%;
   overflow: hidden
 }

 .w3-center .w3-bar {
   display: inline-block;
   width: auto
 }

 .w3-bar .w3-bar-item {
   padding: 8px 16px;
   float: left;
   width: auto;
   border: none;
   display: block;
   outline: 0
 }

 .w3-bar .w3-dropdown-hover,
 .w3-bar .w3-dropdown-click {
   position: static;
   float: left
 }

 .w3-bar .w3-button {
   white-space: normal
 }

 .w3-bar-block .w3-bar-item {
   width: 100%;
   display: block;
   padding: 8px 16px;
   text-align: left;
   border: none;
   white-space: normal;
   float: none;
   outline: 0
 }

 .w3-bar-block.w3-center .w3-bar-item {
   text-align: center
 }

 .w3-block {
   display: block;
   width: 100%
 }

 .w3-responsive {
   display: block;
   overflow-x: auto
 }

 .w3-container:after,
 .w3-container:before,
 .w3-panel:after,
 .w3-panel:before,
 .w3-row:after,
 .w3-row:before,
 .w3-row-padding:after,
 .w3-row-padding:before,
 .w3-cell-row:before,
 .w3-cell-row:after,
 .w3-clear:after,
 .w3-clear:before,
 .w3-bar:before,
 .w3-bar:after {
   content: "";
   display: table;
   clear: both
 }

 .w3-col,
 .w3-half,
 .w3-third,
 .w3-twothird,
 .w3-threequarter,
 .w3-quarter {
   float: left;
   width: 100%
 }

 .w3-col.s1 {
   width: 8.33333%
 }

 .w3-col.s2 {
   width: 16.66666%
 }

 .w3-col.s3 {
   width: 24.99999%
 }

 .w3-col.s4 {
   width: 33.33333%
 }

 .w3-col.s5 {
   width: 41.66666%
 }

 .w3-col.s6 {
   width: 49.99999%
 }

 .w3-col.s7 {
   width: 58.33333%
 }

 .w3-col.s8 {
   width: 66.66666%
 }

 .w3-col.s9 {
   width: 74.99999%
 }

 .w3-col.s10 {
   width: 83.33333%
 }

 .w3-col.s11 {
   width: 91.66666%
 }

 .w3-col.s12 {
   width: 99.99999%
 }

 @media (min-width:601px) {
   .w3-col.m1 {
     width: 8.33333%
   }

   .w3-col.m2 {
     width: 16.66666%
   }

   .w3-col.m3,
   .w3-quarter {
     width: 24.99999%
   }

   .w3-col.m4,
   .w3-third {
     width: 33.33333%
   }

   .w3-col.m5 {
     width: 41.66666%
   }

   .w3-col.m6,
   .w3-half {
     width: 49.99999%
   }

   .w3-col.m7 {
     width: 58.33333%
   }

   .w3-col.m8,
   .w3-twothird {
     width: 66.66666%
   }

   .w3-col.m9,
   .w3-threequarter {
     width: 74.99999%
   }

   .w3-col.m10 {
     width: 83.33333%
   }

   .w3-col.m11 {
     width: 91.66666%
   }

   .w3-col.m12 {
     width: 99.99999%
   }
 }

 @media (min-width:993px) {
   .w3-col.l1 {
     width: 8.33333%
   }

   .w3-col.l2 {
     width: 16.66666%
   }

   .w3-col.l3 {
     width: 24.99999%
   }

   .w3-col.l4 {
     width: 33.33333%
   }

   .w3-col.l5 {
     width: 41.66666%
   }

   .w3-col.l6 {
     width: 49.99999%
   }

   .w3-col.l7 {
     width: 58.33333%
   }

   .w3-col.l8 {
     width: 66.66666%
   }

   .w3-col.l9 {
     width: 74.99999%
   }

   .w3-col.l10 {
     width: 83.33333%
   }

   .w3-col.l11 {
     width: 91.66666%
   }

   .w3-col.l12 {
     width: 99.99999%
   }
 }

 .w3-rest {
   overflow: hidden
 }

 .w3-stretch {
   margin-left: -16px;
   margin-right: -16px
 }

 .w3-content,
 .w3-auto {
   margin-left: auto;
   margin-right: auto
 }

 .w3-content {
   max-width: 980px
 }

 .w3-auto {
   max-width: 1140px
 }

 .w3-cell-row {
   display: table;
   width: 100%
 }

 .w3-cell {
   display: table-cell
 }

 .w3-cell-top {
   vertical-align: top
 }

 .w3-cell-middle {
   vertical-align: middle
 }

 .w3-cell-bottom {
   vertical-align: bottom
 }

 .w3-hide {
   display: none !important
 }

 .w3-show-block,
 .w3-show {
   display: block !important
 }

 .w3-show-inline-block {
   display: inline-block !important
 }

 @media (max-width:1205px) {
   .w3-auto {
     max-width: 95%
   }
 }

 @media (max-width:600px) {
   .w3-modal-content {
     margin: 0 10px;
     width: auto !important
   }

   .w3-modal {
     padding-top: 30px
   }

   .w3-dropdown-hover.w3-mobile .w3-dropdown-content,
   .w3-dropdown-click.w3-mobile .w3-dropdown-content {
     position: relative
   }

   .w3-hide-small {
     display: none !important
   }

   .w3-mobile {
     display: block;
     width: 100% !important
   }

   .w3-bar-item.w3-mobile,
   .w3-dropdown-hover.w3-mobile,
   .w3-dropdown-click.w3-mobile {
     text-align: center
   }

   .w3-dropdown-hover.w3-mobile,
   .w3-dropdown-hover.w3-mobile .w3-btn,
   .w3-dropdown-hover.w3-mobile .w3-button,
   .w3-dropdown-click.w3-mobile,
   .w3-dropdown-click.w3-mobile .w3-btn,
   .w3-dropdown-click.w3-mobile .w3-button {
     width: 100%
   }
 }

 @media (max-width:768px) {
   .w3-modal-content {
     width: 500px
   }

   .w3-modal {
     padding-top: 50px
   }
 }

 @media (min-width:993px) {
   .w3-modal-content {
     width: 900px
   }

   .w3-hide-large {
     display: none !important
   }

   .w3-sidebar.w3-collapse {
     display: block !important
   }
 }

 @media (max-width:992px) and (min-width:601px) {
   .w3-hide-medium {
     display: none !important
   }
 }

 @media (max-width:992px) {
   .w3-sidebar.w3-collapse {
     display: none
   }

   .w3-main {
     margin-left: 0 !important;
     margin-right: 0 !important
   }

   .w3-auto {
     max-width: 100%
   }
 }

 .w3-top,
 .w3-bottom {
   position: fixed;
   width: 100%;
   z-index: 1
 }

 .w3-top {
   top: 0
 }

 .w3-bottom {
   bottom: 0
 }

 .w3-overlay {
   position: fixed;
   display: none;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: rgba(0, 0, 0, 0.5);
   z-index: 2
 }

 .w3-display-topleft {
   position: absolute;
   left: 0;
   top: 0
 }

 .w3-display-topright {
   position: absolute;
   right: 0;
   top: 0
 }

 .w3-display-bottomleft {
   position: absolute;
   left: 0;
   bottom: 0
 }

 .w3-display-bottomright {
   position: absolute;
   right: 0;
   bottom: 0
 }

 .w3-display-middle {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   -ms-transform: translate(-50%, -50%)
 }

 .w3-display-left {
   position: absolute;
   top: 50%;
   left: 0%;
   transform: translate(0%, -50%);
   -ms-transform: translate(-0%, -50%)
 }

 .w3-display-right {
   position: absolute;
   top: 50%;
   right: 0%;
   transform: translate(0%, -50%);
   -ms-transform: translate(0%, -50%)
 }

 .w3-display-topmiddle {
   position: absolute;
   left: 50%;
   top: 0;
   transform: translate(-50%, 0%);
   -ms-transform: translate(-50%, 0%)
 }

 .w3-display-bottommiddle {
   position: absolute;
   left: 50%;
   bottom: 0;
   transform: translate(-50%, 0%);
   -ms-transform: translate(-50%, 0%)
 }

 .w3-display-container:hover .w3-display-hover {
   display: block
 }

 .w3-display-container:hover span.w3-display-hover {
   display: inline-block
 }

 .w3-display-hover {
   display: none
 }

 .w3-display-position {
   position: absolute
 }

 .w3-circle {
   border-radius: 50%
 }

 .w3-round-small {
   border-radius: 2px
 }

 .w3-round,
 .w3-round-medium {
   border-radius: 4px
 }

 .w3-round-large {
   border-radius: 8px
 }

 .w3-round-xlarge {
   border-radius: 16px
 }

 .w3-round-xxlarge {
   border-radius: 32px
 }

 .w3-row-padding,
 .w3-row-padding>.w3-half,
 .w3-row-padding>.w3-third,
 .w3-row-padding>.w3-twothird,
 .w3-row-padding>.w3-threequarter,
 .w3-row-padding>.w3-quarter,
 .w3-row-padding>.w3-col {
   padding: 0 8px
 }

 .w3-container,
 .w3-panel {
   padding: 0.01em 16px
 }

 .w3-panel {
   margin-top: 16px;
   margin-bottom: 16px
 }

 .w3-grid {
   display: grid
 }

 .w3-grid-padding {
   display: grid;
   gap: 16px
 }

 .w3-flex {
   display: flex
 }

 .w3-text-center {
   text-align: center
 }

 .w3-text-bold,
 .w3-bold {
   font-weight: bold
 }

 .w3-text-italic,
 .w3-italic {
   font-style: italic
 }

 .w3-code,
 .w3-codespan {
   font-family: Consolas, "courier new";
   font-size: 16px
 }

 .w3-code {
   width: auto;
   background-color: #fff;
   padding: 8px 12px;
   border-left: 4px solid #4CAF50;
   word-wrap: break-word
 }

 .w3-codespan {
   color: crimson;
   background-color: #f1f1f1;
   padding-left: 4px;
   padding-right: 4px;
   font-size: 110%
 }

 .w3-card,
 .w3-card-2 {
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
 }

 .w3-card-4,
 .w3-hover-shadow:hover {
   box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19)
 }

 .w3-spin {
   animation: w3-spin 2s infinite linear
 }

 @keyframes w3-spin {
   0% {
     transform: rotate(0deg)
   }

   100% {
     transform: rotate(359deg)
   }
 }

 .w3-animate-fading {
   animation: fading 10s infinite
 }

 @keyframes fading {
   0% {
     opacity: 0
   }

   50% {
     opacity: 1
   }

   100% {
     opacity: 0
   }
 }

 .w3-animate-opacity {
   animation: opac 0.8s
 }

 @keyframes opac {
   from {
     opacity: 0
   }

   to {
     opacity: 1
   }
 }

 .w3-animate-top {
   position: relative;
   animation: animatetop 0.4s
 }

 @keyframes animatetop {
   from {
     top: -300px;
     opacity: 0
   }

   to {
     top: 0;
     opacity: 1
   }
 }

 .w3-animate-left {
   position: relative;
   animation: animateleft 0.4s
 }

 @keyframes animateleft {
   from {
     left: -300px;
     opacity: 0
   }

   to {
     left: 0;
     opacity: 1
   }
 }

 .w3-animate-right {
   position: relative;
   animation: animateright 0.4s
 }

 @keyframes animateright {
   from {
     right: -300px;
     opacity: 0
   }

   to {
     right: 0;
     opacity: 1
   }
 }

 .w3-animate-bottom {
   position: relative;
   animation: animatebottom 0.4s
 }

 @keyframes animatebottom {
   from {
     bottom: -300px;
     opacity: 0
   }

   to {
     bottom: 0;
     opacity: 1
   }
 }

 .w3-animate-zoom {
   animation: animatezoom 0.6s
 }

 @keyframes animatezoom {
   from {
     transform: scale(0)
   }

   to {
     transform: scale(1)
   }
 }

 .w3-animate-input {
   transition: width 0.4s ease-in-out
 }

 .w3-animate-input:focus {
   width: 100% !important
 }

 .w3-opacity,
 .w3-hover-opacity:hover {
   opacity: 0.60
 }

 .w3-opacity-off,
 .w3-hover-opacity-off:hover {
   opacity: 1
 }

 .w3-opacity-max {
   opacity: 0.25
 }

 .w3-opacity-min {
   opacity: 0.75
 }

 .w3-greyscale-max,
 .w3-grayscale-max,
 .w3-hover-greyscale:hover,
 .w3-hover-grayscale:hover {
   filter: grayscale(100%)
 }

 .w3-greyscale,
 .w3-grayscale {
   filter: grayscale(75%)
 }

 .w3-greyscale-min,
 .w3-grayscale-min {
   filter: grayscale(50%)
 }

 .w3-sepia {
   filter: sepia(75%)
 }

 .w3-sepia-max,
 .w3-hover-sepia:hover {
   filter: sepia(100%)
 }

 .w3-sepia-min {
   filter: sepia(50%)
 }

 .w3-tiny {
   font-size: 10px !important
 }

 .w3-small {
   font-size: 12px !important
 }

 .w3-medium {
   font-size: 15px !important
 }

 .w3-large {
   font-size: 18px !important
 }

 .w3-xlarge {
   font-size: 24px !important
 }

 .w3-xxlarge {
   font-size: 36px !important
 }

 .w3-xxxlarge {
   font-size: 48px !important
 }

 .w3-jumbo {
   font-size: 64px !important
 }

 .w3-left-align {
   text-align: left !important
 }

 .w3-right-align {
   text-align: right !important
 }

 .w3-justify {
   text-align: justify !important
 }

 .w3-center {
   text-align: center !important
 }

 .w3-border-0 {
   border: 0 !important
 }

 .w3-border {
   border: 1px solid #ccc !important
 }

 .w3-border-top {
   border-top: 1px solid #ccc !important
 }

 .w3-border-bottom {
   border-bottom: 1px solid #ccc !important
 }

 .w3-border-left {
   border-left: 1px solid #ccc !important
 }

 .w3-border-right {
   border-right: 1px solid #ccc !important
 }

 .w3-topbar {
   border-top: 6px solid #ccc !important
 }

 .w3-bottombar {
   border-bottom: 6px solid #ccc !important
 }

 .w3-leftbar {
   border-left: 6px solid #ccc !important
 }

 .w3-rightbar {
   border-right: 6px solid #ccc !important
 }

 .w3-section,
 .w3-code {
   margin-top: 16px !important;
   margin-bottom: 16px !important
 }

 .w3-margin {
   margin: 16px !important
 }

 .w3-margin-top {
   margin-top: 16px !important
 }

 .w3-margin-bottom {
   margin-bottom: 16px !important
 }

 .w3-margin-left {
   margin-left: 16px !important
 }

 .w3-margin-right {
   margin-right: 16px !important
 }

 .w3-padding-small {
   padding: 4px 8px !important
 }

 .w3-padding {
   padding: 8px 16px !important
 }

 .w3-padding-large {
   padding: 12px 24px !important
 }

 .w3-padding-16 {
   padding-top: 16px !important;
   padding-bottom: 16px !important
 }

 .w3-padding-24 {
   padding-top: 24px !important;
   padding-bottom: 24px !important
 }

 .w3-padding-32 {
   padding-top: 32px !important;
   padding-bottom: 32px !important
 }

 .w3-padding-48 {
   padding-top: 48px !important;
   padding-bottom: 48px !important
 }

 .w3-padding-64 {
   padding-top: 64px !important;
   padding-bottom: 64px !important
 }

 .w3-padding-top-64 {
   padding-top: 64px !important
 }

 .w3-padding-top-48 {
   padding-top: 48px !important
 }

 .w3-padding-top-32 {
   padding-top: 32px !important
 }

 .w3-padding-top-24 {
   padding-top: 24px !important
 }

 .w3-left {
   float: left !important
 }

 .w3-right {
   float: right !important
 }

 .w3-button:hover {
   color: #000 !important;
   background-color: #ccc !important
 }

 .w3-transparent,
 .w3-hover-none:hover {
   background-color: transparent !important
 }

 .w3-hover-none:hover {
   box-shadow: none !important
 }

 .w3-rtl {
   direction: rtl
 }

 .w3-ltr {
   direction: ltr
 }

 /* Colors */
 .w3-amber,
 .w3-hover-amber:hover {
   color: #000 !important;
   background-color: #ffc107 !important
 }

 .w3-aqua,
 .w3-hover-aqua:hover {
   color: #000 !important;
   background-color: #00ffff !important
 }

 .w3-blue,
 .w3-hover-blue:hover {
   color: #fff !important;
   background-color: #2196F3 !important
 }

 .w3-light-blue,
 .w3-hover-light-blue:hover {
   color: #000 !important;
   background-color: #87CEEB !important
 }

 .w3-brown,
 .w3-hover-brown:hover {
   color: #fff !important;
   background-color: #795548 !important
 }

 .w3-cyan,
 .w3-hover-cyan:hover {
   color: #000 !important;
   background-color: #00bcd4 !important
 }

 .w3-blue-grey,
 .w3-hover-blue-grey:hover,
 .w3-blue-gray,
 .w3-hover-blue-gray:hover {
   color: #fff !important;
   background-color: #607d8b !important
 }

 .w3-green,
 .w3-hover-green:hover {
   color: #fff !important;
   background-color: #4CAF50 !important
 }

 .w3-light-green,
 .w3-hover-light-green:hover {
   color: #000 !important;
   background-color: #8bc34a !important
 }

 .w3-indigo,
 .w3-hover-indigo:hover {
   color: #fff !important;
   background-color: #3f51b5 !important
 }

 .w3-khaki,
 .w3-hover-khaki:hover {
   color: #000 !important;
   background-color: #f0e68c !important
 }

 .w3-lime,
 .w3-hover-lime:hover {
   color: #000 !important;
   background-color: #cddc39 !important
 }

 .w3-orange,
 .w3-hover-orange:hover {
   color: #000 !important;
   background-color: #ff9800 !important
 }

 .w3-deep-orange,
 .w3-hover-deep-orange:hover {
   color: #fff !important;
   background-color: #ff5722 !important
 }

 .w3-pink,
 .w3-hover-pink:hover {
   color: #fff !important;
   background-color: #e91e63 !important
 }

 .w3-purple,
 .w3-hover-purple:hover {
   color: #fff !important;
   background-color: #9c27b0 !important
 }

 .w3-deep-purple,
 .w3-hover-deep-purple:hover {
   color: #fff !important;
   background-color: #673ab7 !important
 }

 .w3-red,
 .w3-hover-red:hover {
   color: #fff !important;
   background-color: #f44336 !important
 }

 .w3-sand,
 .w3-hover-sand:hover {
   color: #000 !important;
   background-color: #fdf5e6 !important
 }

 .w3-teal,
 .w3-hover-teal:hover {
   color: #fff !important;
   background-color: #009688 !important
 }

 .w3-yellow,
 .w3-hover-yellow:hover {
   color: #000 !important;
   background-color: #ffeb3b !important
 }

 .w3-white,
 .w3-hover-white:hover {
   color: #000 !important;
   background-color: #fff !important
 }

 .w3-black,
 .w3-hover-black:hover {
   color: #fff !important;
   background-color: #000 !important
 }

 .w3-grey,
 .w3-hover-grey:hover,
 .w3-gray,
 .w3-hover-gray:hover {
   color: #000 !important;
   background-color: #9e9e9e !important
 }

 .w3-light-grey,
 .w3-hover-light-grey:hover,
 .w3-light-gray,
 .w3-hover-light-gray:hover {
   color: #000 !important;
   background-color: #f1f1f1 !important
 }

 .w3-dark-grey,
 .w3-hover-dark-grey:hover,
 .w3-dark-gray,
 .w3-hover-dark-gray:hover {
   color: #fff !important;
   background-color: #616161 !important
 }

 .w3-asphalt,
 .w3-hover-asphalt:hover {
   color: #fff !important;
   background-color: #343a40 !important
 }

 .w3-crimson,
 .w3-hover-crimson:hover {
   color: #fff !important;
   background-color: #a20025 !important
 }

 .w3-cobalt,
 w3-hover-cobalt:hover {
   color: #fff !important;
   background-color: #0050ef !important
 }

 .w3-emerald,
 .w3-hover-emerald:hover {
   color: #fff !important;
   background-color: #008a00 !important
 }

 .w3-olive,
 .w3-hover-olive:hover {
   color: #fff !important;
   background-color: #6d8764 !important
 }

 .w3-paper,
 .w3-hover-paper:hover {
   color: #000 !important;
   background-color: #f8f9fa !important
 }

 .w3-sienna,
 .w3-hover-sienna:hover {
   color: #fff !important;
   background-color: #a0522d !important
 }

 .w3-taupe,
 .w3-hover-taupe:hover {
   color: #fff !important;
   background-color: #87794e !important
 }

 .w3-danger {
   color: #fff !important;
   background-color: #dd0000 !important
 }

 .w3-note {
   color: #000 !important;
   background-color: #fff599 !important
 }

 .w3-info {
   color: #fff !important;
   background-color: #0a6fc2 !important
 }

 .w3-warning {
   color: #000 !important;
   background-color: #ffb305 !important
 }

 .w3-success {
   color: #fff !important;
   background-color: #008a00 !important
 }

 .w3-pale-red,
 .w3-hover-pale-red:hover {
   color: #000 !important;
   background-color: #ffdddd !important
 }

 .w3-pale-green,
 .w3-hover-pale-green:hover {
   color: #000 !important;
   background-color: #ddffdd !important
 }

 .w3-pale-yellow,
 .w3-hover-pale-yellow:hover {
   color: #000 !important;
   background-color: #ffffcc !important
 }

 .w3-pale-blue,
 .w3-hover-pale-blue:hover {
   color: #000 !important;
   background-color: #ddffff !important
 }

 .w3-text-amber,
 .w3-hover-text-amber:hover {
   color: #ffc107 !important
 }

 .w3-text-aqua,
 .w3-hover-text-aqua:hover {
   color: #00ffff !important
 }

 .w3-text-blue,
 .w3-hover-text-blue:hover {
   color: #2196F3 !important
 }

 .w3-text-light-blue,
 .w3-hover-text-light-blue:hover {
   color: #87CEEB !important
 }

 .w3-text-brown,
 .w3-hover-text-brown:hover {
   color: #795548 !important
 }

 .w3-text-cyan,
 .w3-hover-text-cyan:hover {
   color: #00bcd4 !important
 }

 .w3-text-blue-grey,
 .w3-hover-text-blue-grey:hover,
 .w3-text-blue-gray,
 .w3-hover-text-blue-gray:hover {
   color: #607d8b !important
 }

 .w3-text-green,
 .w3-hover-text-green:hover {
   color: #4CAF50 !important
 }

 .w3-text-light-green,
 .w3-hover-text-light-green:hover {
   color: #8bc34a !important
 }

 .w3-text-indigo,
 .w3-hover-text-indigo:hover {
   color: #3f51b5 !important
 }

 .w3-text-khaki,
 .w3-hover-text-khaki:hover {
   color: #b4aa50 !important
 }

 .w3-text-lime,
 .w3-hover-text-lime:hover {
   color: #cddc39 !important
 }

 .w3-text-orange,
 .w3-hover-text-orange:hover {
   color: #ff9800 !important
 }

 .w3-text-deep-orange,
 .w3-hover-text-deep-orange:hover {
   color: #ff5722 !important
 }

 .w3-text-pink,
 .w3-hover-text-pink:hover {
   color: #e91e63 !important
 }

 .w3-text-purple,
 .w3-hover-text-purple:hover {
   color: #9c27b0 !important
 }

 .w3-text-deep-purple,
 .w3-hover-text-deep-purple:hover {
   color: #673ab7 !important
 }

 .w3-text-red,
 .w3-hover-text-red:hover {
   color: #f44336 !important
 }

 .w3-text-sand,
 .w3-hover-text-sand:hover {
   color: #fdf5e6 !important
 }

 .w3-text-teal,
 .w3-hover-text-teal:hover {
   color: #009688 !important
 }

 .w3-text-yellow,
 .w3-hover-text-yellow:hover {
   color: #d2be0e !important
 }

 .w3-text-white,
 .w3-hover-text-white:hover {
   color: #fff !important
 }

 .w3-text-black,
 .w3-hover-text-black:hover {
   color: #000 !important
 }

 .w3-text-grey,
 .w3-hover-text-grey:hover,
 .w3-text-gray,
 .w3-hover-text-gray:hover {
   color: #757575 !important
 }

 .w3-text-light-grey,
 .w3-hover-text-light-grey:hover,
 .w3-text-light-gray,
 .w3-hover-text-light-gray:hover {
   color: #f1f1f1 !important
 }

 .w3-text-dark-grey,
 .w3-hover-text-dark-grey:hover,
 .w3-text-dark-gray,
 .w3-hover-text-dark-gray:hover {
   color: #3a3a3a !important
 }

 .w3-border-amber,
 .w3-hover-border-amber:hover {
   border-color: #ffc107 !important
 }

 .w3-border-aqua,
 .w3-hover-border-aqua:hover {
   border-color: #00ffff !important
 }

 .w3-border-blue,
 .w3-hover-border-blue:hover {
   border-color: #2196F3 !important
 }

 .w3-border-light-blue,
 .w3-hover-border-light-blue:hover {
   border-color: #87CEEB !important
 }

 .w3-border-brown,
 .w3-hover-border-brown:hover {
   border-color: #795548 !important
 }

 .w3-border-cyan,
 .w3-hover-border-cyan:hover {
   border-color: #00bcd4 !important
 }

 .w3-border-blue-grey,
 .w3-hover-border-blue-grey:hover,
 .w3-border-blue-gray,
 .w3-hover-border-blue-gray:hover {
   border-color: #607d8b !important
 }

 .w3-border-green,
 .w3-hover-border-green:hover {
   border-color: #4CAF50 !important
 }

 .w3-border-light-green,
 .w3-hover-border-light-green:hover {
   border-color: #8bc34a !important
 }

 .w3-border-indigo,
 .w3-hover-border-indigo:hover {
   border-color: #3f51b5 !important
 }

 .w3-border-khaki,
 .w3-hover-border-khaki:hover {
   border-color: #f0e68c !important
 }

 .w3-border-lime,
 .w3-hover-border-lime:hover {
   border-color: #cddc39 !important
 }

 .w3-border-orange,
 .w3-hover-border-orange:hover {
   border-color: #ff9800 !important
 }

 .w3-border-deep-orange,
 .w3-hover-border-deep-orange:hover {
   border-color: #ff5722 !important
 }

 .w3-border-pink,
 .w3-hover-border-pink:hover {
   border-color: #e91e63 !important
 }

 .w3-border-purple,
 .w3-hover-border-purple:hover {
   border-color: #9c27b0 !important
 }

 .w3-border-deep-purple,
 .w3-hover-border-deep-purple:hover {
   border-color: #673ab7 !important
 }

 .w3-border-red,
 .w3-hover-border-red:hover {
   border-color: #f44336 !important
 }

 .w3-border-sand,
 .w3-hover-border-sand:hover {
   border-color: #fdf5e6 !important
 }

 .w3-border-teal,
 .w3-hover-border-teal:hover {
   border-color: #009688 !important
 }

 .w3-border-yellow,
 .w3-hover-border-yellow:hover {
   border-color: #ffeb3b !important
 }

 .w3-border-white,
 .w3-hover-border-white:hover {
   border-color: #fff !important
 }

 .w3-border-black,
 .w3-hover-border-black:hover {
   border-color: #000 !important
 }

 .w3-border-grey,
 .w3-hover-border-grey:hover,
 .w3-border-gray,
 .w3-hover-border-gray:hover {
   border-color: #9e9e9e !important
 }

 .w3-border-light-grey,
 .w3-hover-border-light-grey:hover,
 .w3-border-light-gray,
 .w3-hover-border-light-gray:hover {
   border-color: #f1f1f1 !important
 }

 .w3-border-dark-grey,
 .w3-hover-border-dark-grey:hover,
 .w3-border-dark-gray,
 .w3-hover-border-dark-gray:hover {
   border-color: #616161 !important
 }

 .w3-border-pale-red,
 .w3-hover-border-pale-red:hover {
   border-color: #ffe7e7 !important
 }

 .w3-border-pale-green,
 .w3-hover-border-pale-green:hover {
   border-color: #e7ffe7 !important
 }

 .w3-border-pale-yellow,
 .w3-hover-border-pale-yellow:hover {
   border-color: #ffffcc !important
 }

 .w3-border-pale-blue,
 .w3-hover-border-pale-blue:hover {
   border-color: #e7ffff !important
 }

 /* W3.CSS 5.02 March 31 2025 by Jan Egil and Borge Refsnes */



 .reel-container {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
   justify-content: center;
 }

 .reel {
   width: 300px;
   height: 540px;
 }

 @media (max-width: 640px) {
   .reel {
     width: 100%;
   }
 }



 .swiper {
   width: 100%;
   height: auto;
 }

 .swiper-slide {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 20px;
   box-sizing: border-box;
 }

 .slide-image {
   width: 100%;
   height: auto;
   border-radius: 12px;
   object-fit: cover;
 }

 .reel-wrapper {
   display: flex;
   gap: 20px;
   justify-content: center;
   flex-wrap: wrap;
   width: 100%;
 }

 .reel {
   width: 300px;
   height: 540px;
   border: none;
   border-radius: 12px;
 }


 .swiper-button-next,
 .swiper-button-prev {
   color: #ffffff !important;
 }


 .padding-top-0p {
   padding-top: 0px;
 }


 .team-collections {
   margin: 0 auto;
   max-width: 1200px;
 }

 /* careers page */
 .career-section {
   background-color: #F83D7A;
   padding-top: 5rem;
   padding-bottom: 5rem;
   color: white;
 }

 .career-section .hero-heading {
   text-align: left;
   font-family: "Inter", sans-serif;
   font-weight: bold;
   line-height: 1.2;
 }

 .career-section .hero-paragraph {
   text-align: left;
   font-weight: normal;
   margin-left: auto;
   margin-right: auto;
   font-size: 1rem;
 }

 .current-openings-section {
   padding: 50px 0;
 }

 .current-openings-section .section-title {
   font-size: 2.5rem;
   font-weight: bold;
   color: #000000;
   /* Black title */
   margin-bottom: 40px;
   text-align: center;
 }

 .getform-sec {
   padding-bottom: 50px;

 }

 .getform-sec h2 {
   font-size: 2.5rem;
   color: #000000;
 }

 .job-box {
   color: #fff;
   padding: 25px;
   cursor: pointer;
   transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
   display: flex;
   flex-direction: column;
   justify-content: center;
   min-height: 180px;
 }

 .job-box:hover {
   transform: translateY(-5px);
   box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
 }

 .job-box h5 {
   font-size: 1.4rem;
   font-weight: bold;
   margin-bottom: 10px;
 }

 .job-box p {
   font-size: 0.9rem;
   margin-bottom: 0;
 }

 .job-box .location-icon {
   margin-right: 5px;
 }

 .bg-purple-1 {
   background-color: #8A2BE2;
 }

 /* Brighter Purple */
 .bg-blue-1 {
   background-color: #00AEEF;
 }

 /* Bright Blue */
 .bg-dark-blue-1 {
   background-color: #1A237E;
 }

 /* Dark Blue */
 .bg-purple-2 {
   background-color: #6A0DAD;
 }

 /* Darker Purple */

 .current-openings-section .marketplace-manager h5 {
   padding-bottom: 10px;
   margin-bottom: 15px;
 }

 /* Last item styling */
 .full-width-job {
   display: block;
   text-align: center;
   padding: 20px;
   min-height: 80px;
 }

 .full-width-job h5 {
   font-size: 1.5rem;
   display: inline;
 }

 .full-width-job p {
   display: inline;
   font-size: 1rem;
 }



 .jobModal .modal-title-custom {
   font-weight: bold;
   font-size: 2.25rem;
   color: #333;
 }

 .jobModal .modal-body {
   padding: 2rem;
 }

 .jobModal .form-control {
   border-radius: 0.375rem;
   border: 1.5px solid #939699;
   padding: 12px;
 }

 .jobModal .form-control:focus {
   border-radius: 0.375rem;
   border: 1px solid #000;
   box-shadow: none;
 }

 .jobModal .form-check-input {
   border: 1.5px solid #939699;

 }

 .jobModal .form-control::placeholder {
   color: #000;
   font-size: 14px;
   opacity: 1;
   /* Firefox */
 }

 .jobModal .form-check-label {
   font-size: 0.9rem;
   color: #000;
 }

 .jobModal .radio-group-label {
   display: block;
   margin-bottom: 0.75rem;
   font-size: 0.95rem;
   color: #000;
 }

 .jobModal .btn-submit-custom {
   background-color: #FF337A;
   /* Vibrant Pink */
   border-color: #FF337A;
   color: white;
   padding: 0.6rem 1.5rem;
   font-weight: 500;
 }

 .jobModal .btn-submit-custom:hover {
   background-color: #e62e6a;
   border-color: #e62e6a;
   color: white;
 }

 #jobModal .modal-dialog-centered .modal-content {
   max-width: 600px;
   margin-left: auto;
   margin-right: auto;
 }

 /* new css */

 .team-highlight-section {
   background-color: #E94E77;
   color: #212529;
   padding-top: 20%;
   padding-bottom: 15%;
 }

 .team-highlight-section .heading-custom,
 .contact-form-sec h2 {
   font-weight: 700;
   line-height: 1.1;
   color: #000000;
   font-family: "Source Serif 4";
 }

 .team-highlight-section .text-custom {
   font-size: 1rem;
   line-height: 1.6;
   color: #000000;
   text-align: left;
 }

 @media (max-width: 991.98px) {
   .team-highlight-section .heading-custom {
     font-size: 3.5rem;
   }
 }

 @media (max-width: 767.98px) {
   .team-highlight-section .heading-custom {
     font-size: 2.8rem;
     margin-bottom: 1.5rem;
   }

   .team-highlight-section .text-custom {
     font-size: 0.95rem;
     text-align: justify;
   }
 }

 .contact-form-sec {
   padding-top: 10%;
   padding-bottom: 10%
 }

 .current-opening-sec {
   padding-top: 10%;
   background-color: #fff;
 }

 .current-opening-sec .section-title {
   font-weight: 700;
   font-size: 2.8rem;
   color: #000;
   margin-bottom: 2rem;
 }

 .current-opening-sec .title-divider {
   border: 0;
   border-top: 3px solid #e7426b;
   opacity: 1;
   width: 80px;
   margin-bottom: 2rem;
   margin-left: 0;
 }

 .accordion-item {
   border: none;
   border-bottom: 1px solid #e0e0e0;
 }

 .accordion-item:first-of-type {
   border-top: 1px solid #e0e0e0;
 }

 .accordion-item:last-of-type {
   border-bottom: 1px solid #e0e0e0;
 }


 .accordion-header {
   margin-bottom: 0;
 }

 .accordion-button {
   background-image: url('./black-arrow.svg');
   background-repeat: no-repeat;
   background-position: right 1rem center;
   background-size: 20px;
   transition: background-image 0.3s ease;
 }

 .accordion-button::after {
   display: none;
 }

 .accordion-button .job-title {
   font-weight: 500;
   color: #191C1F;
   flex-grow: 1;
   padding-right: 10px;
 }

 .accordion-button .job-location {
   font-weight: 500;
   padding-right: 100px;
   color: #555555;
   white-space: nowrap;
 }

 .accordion-button .arrow-icon {
   font-weight: bold;
   font-size: 1.2rem;
   color: #000000;
   margin-left: 15px;
   transition: transform 0.2s ease-in-out;
 }

 .accordion-button:not(.collapsed) {
   color: #e7426b;
   background-color: #fff !important;
 }

 .accordion-button:not(.collapsed) .job-title,
 .accordion-button:not(.collapsed) .job-location,
 .accordion-button:not(.collapsed) .arrow-icon {
   color: #e7426b;
 }

 .accordion-button:not(.collapsed) .arrow-icon {
   transform: rotate(90deg);
 }

 .accordion-button:hover .job-title,
 .accordion-button:hover .job-location,
 .accordion-button:focus .job-title,
 .accordion-button:focus .job-location {
   color: #e7426b;
 }

 .accordion-button:hover .arrow-icon,
 .accordion-button:focus .arrow-icon {
   background-image: url(./red-arrow.svg);
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
 }

 .accordion-button .arrow-icon {
   background-image: url(./black-arrow.svg);
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
 }

 .accordion-body {
   padding: 1rem 1.25rem;
   background-color: #f9f9f9;
   font-size: 0.9rem;
   color: #333;
 }

 @media (max-width: 768px) {
   .current-opening-sec .section-title {
     font-size: 2.2rem;
   }

   .accordion-button {
     padding: 0.8rem 1rem;
   }

   .accordion-button .job-title {
     font-size: 0.95rem;
   }

   .accordion-button .job-location {
     font-size: 0.9rem;
   }
 }

 @media (max-width: 576px) {
   .accordion-button {
     flex-direction: column;
     align-items: flex-start;
   }

   .accordion-button .job-location {
     margin-left: 0;
     margin-top: 0.25rem;
     width: 100%;
   }

   .accordion-button .arrow-icon {
     position: absolute;
     right: 1rem;
     top: 50%;
     transform: translateY(-50%);
   }

   .accordion-button:not(.collapsed) .arrow-icon {
     transform: translateY(-50%) rotate(90deg);
   }
 }

 .accordion-button:not(.collapsed) {
   background-image: url('./red-arrow.svg');
   background-repeat: no-repeat;
   background-position: right 1rem center;
   background-size: 20px;
   transition: background-image 0.3s ease;
 }

 .resume-upload-wrapper {
   display: flex;
   align-items: center;
   gap: 10px;
   font-family: sans-serif;
   color: #555;
 }

 .resume-upload-wrapper input[type="file"] {
   display: none;
 }

 .resume-upload-wrapper img {
   cursor: pointer;
   transition: transform 0.3s ease;
 }

 .resume-upload-wrapper img:hover {
   transform: translateY(-3px);
 }

 .apply-btn {
   display: inline-block;
   padding: 12px 28px;
   background-color: #ff4c60;
   color: #ffffff;
   font-size: 16px;
   font-weight: 600;
   text-decoration: none;
   border: none;
   border-radius: 50px;
   box-shadow: 0 8px 20px rgba(255, 76, 96, 0.3);
   transition: all 0.3s ease;
   cursor: pointer;
   text-decoration: none;
 }

 .apply-btn:hover {
   background-color: #e64355;
   box-shadow: 0 8px 30px rgba(255, 76, 96, 0.5);
   transform: translateY(-2px);
 }

 .apply-btn:active {
   transform: scale(0.97);
 }



 .team-highlight-section .heading-custom,
 .contact-form-sec h2 {
   font-weight: 700;
   line-height: 1.1;
   color: #000000;
   font-family: "Source Serif 4";
   font-size: 3rem;
 }

 .team-highlight-section .text-custom {
   font-size: 1rem;
   line-height: 1.6;
   color: #000000;
   text-align: left;
 }

 @media (max-width: 991.98px) {
   .team-highlight-section .heading-custom {
     font-size: 3.5rem;
   }
 }

 @media (max-width: 767.98px) {
   .team-highlight-section .heading-custom {
     font-size: 2.8rem;
     margin-bottom: 1.5rem;
   }

   .team-highlight-section .text-custom {
     font-size: 0.95rem;
     text-align: justify;
   }
 }

 .contact-form-sec {
   padding-top: 10%;
   padding-bottom: 10%
 }

 .current-opening-sec {
   padding-top: 10%;
   background-color: #fff;
 }


 .current-opening-sec .title-divider {
   border: 0;
   border-top: 3px solid #e7426b;
   opacity: 1;
   width: 80px;
   margin-bottom: 2rem;
   margin-left: 0;
 }

 .current-opening-sec .accordion-item {
   border: none;
   border-bottom: 1px solid #e0e0e0;
 }

 .current-opening-sec .accordion-item:first-of-type {
   border-top: 1px solid #e0e0e0;
 }

 .current-opening-sec .accordion-item:last-of-type {
   border-bottom: 1px solid #e0e0e0;
 }


 .current-opening-sec .accordion-header {
   margin-bottom: 0;
 }

 .current-opening-sec .accordion-button {
   background-image: url('./black-arrow.svg');
   background-repeat: no-repeat;
   background-position: right 1rem center;
   background-size: 20px;
   transition: background-image 0.3s ease;
 }

 .current-opening-sec .accordion-button::after {
   display: none;
 }

 .current-opening-sec .accordion-button .job-title {
   font-weight: 500;
   color: #191C1F;
   flex-grow: 1;
   padding-right: 10px;
 }

 .current-opening-sec .accordion-button .job-location {
   font-weight: 500;
   padding-right: 100px;
   color: #555555;
   white-space: nowrap;
 }

 .current-opening-sec .accordion-button .arrow-icon {
   font-weight: bold;
   font-size: 1.2rem;
   color: #000000;
   margin-left: 15px;
   transition: transform 0.2s ease-in-out;
 }

 .current-opening-sec .accordion-button:not(.collapsed) {
   color: #e7426b;
   background-color: #fff !important;
 }

 .current-opening-sec .accordion-button:not(.collapsed) .job-title,
 .current-opening-sec .accordion-button:not(.collapsed) .job-location,
 .current-opening-sec .accordion-button:not(.collapsed) .arrow-icon {
   color: #e7426b;
 }

 .current-opening-sec .accordion-button:not(.collapsed) .arrow-icon {
   transform: rotate(90deg);
 }

 .current-opening-sec .accordion-button:hover .job-title,
 .current-opening-sec .accordion-button:hover .job-location,
 .current-opening-sec .accordion-button:focus .job-title,
 .current-opening-sec .accordion-button:focus .job-location {
   color: #e7426b;
 }

 .current-opening-sec .accordion-button:hover .arrow-icon,
 .current-opening-sec .accordion-button:focus .arrow-icon {
   background-image: url(./red-arrow.svg);
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
 }

 .current-opening-sec .accordion-button .arrow-icon {
   background-image: url(./black-arrow.svg);
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
 }

 .current-opening-sec .accordion-body {
   padding: 1rem 1.25rem;
   background-color: #f9f9f9;
   font-size: 0.9rem;
   color: #333;
 }

 @media (max-width: 768px) {
   .current-opening-sec .section-title {
     font-size: 2.2rem;
   }

   .current-opening-sec .accordion-button {
     padding: 0.8rem 1rem;
   }

   .current-opening-sec .accordion-button .job-title {
     font-size: 0.95rem;
   }

   .current-opening-sec .accordion-button .job-location {
     font-size: 0.9rem;
   }
 }

 @media (max-width: 576px) {
   .current-opening-sec .accordion-button {
     flex-direction: column;
     align-items: flex-start;
   }

   .current-opening-sec .accordion-button .job-location {
     margin-left: 0;
     margin-top: 0.25rem;
     width: 100%;
   }

   .current-opening-sec .accordion-button .arrow-icon {
     position: absolute;
     right: 1rem;
     top: 50%;
     transform: translateY(-50%);
   }

   .current-opening-sec .accordion-button:not(.collapsed) .arrow-icon {
     transform: translateY(-50%) rotate(90deg);
   }
 }

 .current-opening-sec .accordion-button:not(.collapsed) {
   background-image: url('./red-arrow.svg');
   background-repeat: no-repeat;
   background-position: right 1rem center;
   background-size: 20px;
   transition: background-image 0.3s ease;
 }

 .get-in-desc {
   padding-top: 2%;
 }

 @media (max-width: 768px) {
   .footer {
     flex-direction: column;
     text-align: center;
     padding: 30px;
   }

   .footer-right {
     text-align: center;
     margin-top: 20px;
   }

   .footer-links {
     flex-direction: column;
     align-items: center;
     gap: 10px;
   }

   .footer-bottom {
     justify-content: center;
   }
 }

 .service-options-container {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   margin-bottom: 20px;
 }

 .service-option input[type="checkbox"] {
   display: none;
 }

 .service-option label {
   display: inline-block;
   padding: 10px 20px;
   border: 1px solid #000000;
   border-radius: 25px;
   /* Pill shape */
   background-color: #ffffff;
   color: #000000;
   font-size: 14px;
   cursor: pointer;
   transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
   text-align: center;
   white-space: nowrap;
 }

 .service-option input[type="checkbox"]:checked+label {
   background-color: #cccccc;
   color: #000000;
   border-color: #cccccc;
 }

 .service-option input[type="checkbox"]:not(:checked)+label:hover {
   background-color: #f0f0f0;
 }

 #contact-form {
   font-family: Arial, sans-serif;
 }

 #contact-form input[type="text"],
 #contact-form input[type="email"] {
   display: block;
   width: calc(100% - 22px);
   padding: 10px;
   margin-bottom: 15px;
   border: 1px solid #ccc;
   border-radius: 4px;
 }

 .logo-image-container {
   display: flex;
 }

 .logo-image-container img {
   height: 70px;
   margin-bottom: 30px;
   padding-right: 5%;
 }

 .logo-image-container .revbooster {}

 .logo-image-container .brand-fanatics {
   height: 60px;
 }

 @media (max-width: 768px) {
   

   .logo-image-container img {
     height: 60px;
     padding-top: 5%;
   }
   .padd-150-desktop {
    padding-top: 0px;
}

 }

 
.portfolio-card:hover {
  transform: scale(1.03); /* Makes the card slightly larger */
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2); /* Makes the shadow more prominent */
}

.portfolio-card.animation-locked {
  transform: scale(1.03);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
}