/* video blog section */ .ocfa-video-section {   background-color: #FAFAFA;   padding-top: 72px;   padding-bottom: 72px;   width: 100%;   overflow: hidden;   position: relative; } .video-header {   display: flex;   justify-content: space-between;   align-items: flex-end;   margin-bottom: 40px;   row-gap: 24px;   column-gap: 24px; } .video-heading-wrap {   max-width: 624px; } .main-video-card {   width: 100%;   border-radius: 12px;   overflow: hidden;   margin-bottom: 24px;   position: relative;   cursor: pointer; } .main-img-wrap {   width: 100%;   height: 560px;   position: relative; } .main-img-wrap img {   width: 100%;   height: 100%;   object-fit: cover;   object-position: center center;   display: block; } .video-overlay {   position: absolute;   top: 0;   left: 0;   width: 100%;   height: 100%;   background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 50%);   display: flex;   flex-direction: column;   justify-content: flex-end;   align-items: flex-start;   padding: 36px; } .main-overlay {   padding: 48px; } .btn-play {   background: transparent;   border: none;   color: rgb(255, 255, 255);   font-size: 32px;   cursor: pointer;   position: absolute;   top: 50%;   left: 50%;   transform: translate(-50%, -50%);   opacity: 0.9;   transition: opacity 0.3s ease, transform 0.3s ease; } .main-play {   font-size: 64px;   opacity: 0; } .main-video-card:hover .main-play {   opacity: 1;   transform: translate(-50%, -50%) scale(1.1); } .small-video-card:hover .btn-play {   opacity: 1;   transform: translate(-50%, -50%) scale(1.1); } .main-video-title {   font-family: "Inter Tight", sans-serif;   font-weight: 500;   font-size: 36px;   color: rgb(255, 255, 255);   margin: 0;   line-height: 130%; } .video-scroll-wrapper {   width: 100%;   overflow-x: auto;   scrollbar-width: none;   padding-left: max(15px, -630px + 50vw);   padding-right: 15px; } .video-scroll-wrapper::-webkit-scrollbar {   display: none; } .video-track {   display: flex;   row-gap: 16px;   column-gap: 16px;   padding-bottom: 8px; } .small-video-card {   flex: 0 0 320px;   border-radius: 8px;   overflow: hidden;   position: relative;   cursor: pointer;   border: 2px solid transparent;   transition: border-color 0.3s ease; } .small-video-card.active {   border-color: #F6841F; } .small-img-wrap {   width: 100%;   height: 180px;   position: relative; } .small-img-wrap img {   width: 100%;   height: 100%;   object-fit: cover;   object-position: center center;   display: block; } .small-video-card .video-overlay {   padding-top: 16px;   padding-right: 16px;   padding-bottom: 16px;   padding-left: 16px; } .small-video-title {   font-family: "Inter", sans-serif;   font-weight: 400;   font-size: 14px;   color: rgb(255, 255, 255);   margin: 0;   line-height: 140%; } .ocfa-video-modal {   position: fixed;   top: 0px;   left: 0px;   width: 100%;   height: 100%;   z-index: 9999;   display: none;   align-items: center;   justify-content: center; } .ocfa-video-modal.show {   display: flex; } .modal-overlay {   position: absolute;   top: 0px;   left: 0px;   width: 100%;   height: 100%;   background-color: rgba(0, 0, 0, 0.85);   cursor: pointer; } .modal-content {   position: relative;   width: 90%;   max-width: 900px;   z-index: 10000; } .iframe-container {   position: relative;   padding-bottom: 56.25%;   height: 0px;   overflow-x: hidden;   overflow-y: hidden;   border-top-left-radius: 8px;   border-top-right-radius: 8px;   border-bottom-right-radius: 8px;   border-bottom-left-radius: 8px;   background-color: rgb(0, 0, 0); } .iframe-container iframe {   position: absolute;   top: 0px;   left: 0px;   width: 100%;   height: 100%; } .modal-close {   position: absolute;   top: -40px;   right: 0px;   background-image: initial;   background-position-x: initial;   background-position-y: initial;   background-size: initial;   background-repeat: initial;   background-attachment: initial;   background-origin: initial;   background-clip: initial;   background-color: transparent;   border-top-width: medium;   border-right-width: medium;   border-bottom-width: medium;   border-left-width: medium;   border-top-style: none;   border-right-style: none;   border-bottom-style: none;   border-left-style: none;   border-top-color: currentcolor;   border-right-color: currentcolor;   border-bottom-color: currentcolor;   border-left-color: currentcolor;   border-image-source: none;   border-image-slice: 100%;   border-image-width: 1;   border-image-outset: 0;   border-image-repeat: stretch;   color: rgb(255, 255, 255);   font-size: 32px;   cursor: pointer;   transition-behavior: normal;   transition-duration: 0.3s;   transition-timing-function: ease;   transition-delay: 0s;   transition-property: color; } .modal-close:hover {   color: rgb(246, 132, 31); } .btn-show-more {   display: inline-flex;   align-items: center;   justify-content: space-between;   border-top-width: 1px;   border-right-width: 1px;   border-bottom-width: 1px;   border-left-width: 1px;   border-top-style: solid;   border-right-style: solid;   border-bottom-style: solid;   border-left-style: solid;   border-top-color: rgb(35, 45, 104);   border-right-color: rgb(35, 45, 104);   border-bottom-color: rgb(35, 45, 104);   border-left-color: rgb(35, 45, 104);   border-image-source: none;   border-image-slice: 100%;   border-image-width: 1;   border-image-outset: 0;   border-image-repeat: stretch;   color: rgb(35, 45, 104);   background-color: transparent;   font-family: "Plus Jakarta Sans", sans-serif;   font-weight: 500;   font-size: 16px;   padding-top: 6px;   padding-right: 6px;   padding-bottom: 6px;   padding-left: 20px;   border-top-left-radius: 6px;   border-top-right-radius: 6px;   border-bottom-right-radius: 6px;   border-bottom-left-radius: 6px;   text-decoration-line: none;   text-decoration-thickness: initial;   text-decoration-style: initial;   text-decoration-color: initial;   transition-behavior: normal;   transition-duration: 0.3s;   transition-timing-function: ease;   transition-delay: 0s;   transition-property: all; } .btn-show-more .btn-icon {   background-color: rgb(35, 45, 104);   width: 32px;   height: 32px;   display: flex;   align-items: center;   justify-content: center;   border-top-left-radius: 4px;   border-top-right-radius: 4px;   border-bottom-right-radius: 4px;   border-bottom-left-radius: 4px;   margin-left: 16px; } .btn-show-more .btn-icon i {   color: rgb(255, 255, 255) !important; } .btn-show-more:hover {   background-color: rgba(35, 45, 104, 0.05); } .desktop-btn {   display: inline-flex; } .mobile-btn {   display: none; } @media (max-width: 991.98px) {   .video-header {     align-items: center;   } } @media (max-width: 767.98px) {   .ocfa-video-section {     padding-top: 40px;     padding-bottom: 40px;   }   .video-header {     flex-direction: column;     align-items: flex-start;     margin-bottom: 24px;   }   .desktop-btn {     display: none;   }   .mobile-btn {     display: inline-flex;     margin-top: 32px;     width: 100%;   }   .modal-close {     top: -36px;     right: 0px;   } } .ocfa-video-section {   background-color: rgb(250, 250, 250);   padding-top: 72px;   padding-bottom: 72px;   width: 100%;   overflow-x: hidden;   overflow-y: hidden;   position: relative; } * {   box-sizing: border-box; } body {   margin-top: 0px;   margin-right: 0px;   margin-bottom: 0px;   margin-left: 0px; }