body, html {
margin: 0;
padding: 0;
font-family: "Groningen", sans-serif;
box-sizing: border-box;
scroll-behavior: smooth;
overflow-x: hidden !important;
}
@font-face {
font-family: 'Groningen-Bold';
src: url('/assets/font/Groningen-Bold.woff2') format('woff2'),
url('/assets/font/Groningen-Bold.woff') format('woff'),
url('/assets/font/Groningen-Bold.ttf') format('truetype'),
url('/assets/font/Groningen-Bold.eot');
font-weight: bold;
font-style: normal;
}
body {
border-left: none !important;
border-right: none !important;
}
html, body {
overflow-x: hidden;
border-left: none !important;
border-right: none !important;
}
.full-width-dotted-line-index
{
position: relative;
top: 20px;
border: 1px dotted #ffc62a5e;
}
.svg-icon {
stroke: #75736e;
width: 25px;
height: 25px;
}
.press-button15:hover {
animation: pulse 0.6s infinite alternate;
}
.unique-news-icons
{
display: flex;
justify-content: space-around;
margin-bottom: 20px;
margin-top: 110px;
gap: 270px;
}
.sitemap-hr
{
margin-top: -17px;
width: 270px;
margin-left: 0px;
}
.sitemap-hr1
{
margin-top: 0px;
width: 270px;
margin-left: 0px;
}
.sitemap-hr2
{
margin-top: 0px;
width: 270px;
margin-left: 0px;
}
.follow-hr
{
margin-top: -17px;
width: 250px;
margin-left: 0px;
}
.new-foot1
{
margin-top: 30px;
color:#90949b;
font-size:12px;
}
.new-foot2
{
/*margin-top: -15px;*/
color:#90949b;
font-size:12px;
}
.follow-hr1
{
margin-top: 0px;
width: 250px;
margin-left: 0px;
}
.sitemap-hr3
{
/*margin-top: 15px;*/
width: 270px;
margin-left: 70px;
}
.bottom-hr
{
margin-top: -17px;
width: 270px;
margin-left: 0px;
}
.whatsapp_icon
{
height:20px;position: relative;left: 55%;bottom: 6%;
}
.insta-div
{
margin-left: -60px;
}
.fb_div
{
margin-left: -55px;
}
#google_translate_element .goog-te-gadget {
font-size: 0;
}
#google_translate_element .goog-te-gadget span {
display: none;
}
/* If it still shows up, try hiding it using important */
.goog-logo-link,
.goog-te-gadget span,
.goog-te-banner-frame {
display: none !important;
}
.jointeam-unique-right-bottom-icon
{
width: 15px;
height: 10px;
rotate: 90deg;
}
.jointeam-unique-right-bottom-icon1
{
width: 15px;
height: 10px;
rotate: -90deg;
}
.foot-plot
{
font-size:11px !important;
font-family: 'Helvetica', sans-serif;
}
.position-container
{
display: flex;
width: 100%;
margin: 0 auto;
gap: 10px;
}
.new-sourcing
{
font-size:18px;
font-family: 'Helvetica', sans-serif;
color:#0c284d;color:#0c284d;
}
.foot-para
{
font-size:12px !important;
font-family: 'Helvetica', sans-serif;
}
@font-face {
font-family: 'Groningen-Light';
src: url('/assets/font/Groningen-Light.woff2') format('woff2'),
url('/assets/font/Groningen-Light.woff') format('woff'),
url('/assets/font/Groningen-Light.ttf') format('truetype'),
url('/assets/font/Groningen-Light.eot');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Groningen-Regular';
src: url('/assets/font/Groningen-Regular.woff2') format('woff2'),
url('/assets/font/Groningen-Regular.woff') format('woff'),
url('/assets/font/Groningen-Regular.ttf') format('truetype'),
url('/assets/font/Groningen-Regular.eot');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Helvetica';
src: url('/assets/font/Helvetica.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Helvetica-Bold';
src: url('/assets/font/Helvetica-Bold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Helvetica-Light';
src: url('/assets/font/helvetica-light-587eb4a59211.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Helvetica-Oblique';
src: url('/assets/font/Helvetica-Oblique.ttf') format('truetype');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'Helvetica-BoldOblique';
src: url('/assets/font/Helvetica-BoldOblique.ttf') format('truetype');
font-weight: bold;
font-style: italic;
}
@font-face {
font-family: 'Helvetica-Compressed';
src: url('/assets/font/helvetica-compressed-587d1d4b6903a.otf') format('opentype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Helvetica-RoundedBold';
src: url('/assets/font/helvetica-rounded-bold-5871d05ead8de.otf') format('opentype');
font-weight: bold;
font-style: normal;
}
.last-sec-img
{
width:50px;
height:50px;
margin-top: 30px;
}
/* Top Bar Styling */
.top-bar {
background: rgba(0, 0, 0, 0.18); /* Background me opacity, text me nahi */
color: white; /* Text pure white */
display: flex;
justify-content: center;
padding: 5px 0;
border-top: 1px solid white;
border-bottom: 1px solid white;
margin-top: 20px; /* Top se 20px margin */
width: 80%; /* Header jitni width */
position: absolute;
left: 50%;
transform: translateX(-50%);
z-index: 11;
}
.top-bar-container {
display: flex;
justify-content: space-between;
width: 100%;
}
.top-bar-item {
font-size: 14px;
margin-left: 20px;
margin-right: 20px;
}
/* header full css */
/* Header */
/* Header */
header {
position: absolute;
top: 60px; /* Topbar se gap */
left: 50%;
transform: translateX(-50%);
width: 80%;
height: 60px;
background: white;
border-radius: 5px;
display: flex;
align-items: center;
justify-content: space-between;
z-index: 999;
}
/* Logo */
.logo img {
height: 30px;
margin-left:20px;
}
/* Navigation */
nav ul {
list-style: none;
display: flex;
gap: 26px;
margin: 0;
padding: 0;
position: relative;
}
nav ul li {
position: relative;
}
nav ul li a {
font-family: 'Helvetica', sans-serif;
color: #08254a;
font-size: 12px;
text-decoration: none;
}
nav ul li a:focus,
nav ul li a:active {
font-family: 'Helvetica-Bold', sans-serif;
}
/* Submenu Background */
.submenu-bg {
position: absolute;
top: 120px; /* Header ke neeche */
left: 50%;
transform: translateX(-50%);
width: 80%;
height: auto; /* 👈 Automatically height adjust karega */
background: rgba(0, 47, 97, 0.9);
border-radius: 5px;
display: none; /* By Default hidden */
z-index: 998;
transition: height 0.3s ease-in-out; /* 👈 Smooth height transition */
}
/* Submenu */
.submenu {
display: none;
position: absolute;
top: 100%; /* 👈 Ye fix kiya, ab submenu parent ke niche hi aayega */
left: 0;
text-align: left;
z-index: 999;
}
/* Submenu Items */
.submenu ul {
display: block;
list-style: none;
padding: 0;
margin: 0;
text-align: left;
width: auto; /* Ye default behavior rakhega */
white-space: nowrap; /* Ye text ko break hone se bachayega */
/*margin-left:35px;*/
}
.submenu li {
padding: 2px;
display: block;
}
nav ul li .submenu {
top: 60px; /* 👈 Header ke bilkul neeche aaye */
left: 0; /* 👈 Parent ke bilkul start se align ho */
min-width: 180px; /* 👈 Size fix rahe */
text-align: left; /* 👈 Ensure karega ki text bhi left align rahe */
padding: 5px 0;
display: none; /* 👈 By default hidden */
position: absolute;
}
.submenu li a {
color: white;
text-decoration: none;
font-family: 'Helvetica', sans-serif;
font-size:12px;
}
.submenu li a:hover {
color: #ffc62a;
font-family: 'Helvetica-Bold', sans-serif;
}
/* Dropdown Arrow */
.has-submenu a i {
transition: transform 0.3s, color 0.3s;
}
.has-submenu.active a i {
transform: rotate(180deg);
color: #ffc62a;
}
/* Icons */
.icons img {
width: 16px;
margin-left: 10px;
cursor:pointer;
}
/* 🔍 Search Box */
.search-box {
position: absolute;
top: 60px;
left: 0;
width: 100%;
max-width: 80vw;
height: auto;
background: rgba(0, 47, 97, 0.95);
border-radius: 5px;
display: none;
z-index: 999;
text-align: left;
padding: 30px;
box-sizing: border-box;
}
/* 🔍 Search Header */
.search-header {
display: flex;
align-items: center;
justify-content: space-evenly;
gap: 10px;
}
/* 🟡 "What is on your mind?" */
.search-text {
font-size: 18px;
font-family: 'Helvetica', sans-serif;
color: #ffc62a;
font-weight: bold;
margin-left: 175px;
}
/* 🔍 Search Button */
.search-btn {
width: 20px;
filter: invert(78%) sepia(97%) saturate(617%) hue-rotate(359deg) brightness(105%) contrast(106%);
position: relative;
right: 13%;
top: 20px;
}
/* 🔹 Popular Searches Heading */
.popular-search {
color: white;
font-size: 16px;
font-weight: bold;
text-align: -webkit-center;
margin-top: 10px;
position: relative;
right: 9%;
top: 10px;
}
/* 🔹 Line Below Search */
.search-line {
width: 100%;
max-width: 350px;
border: 1px solid white;
margin: 0px 0;
}
/* 🔹 Search Tags */
.search-tags {
display: flex;
align-items: flex-start;
color: white;
font-size: 13px;
gap: 10px;
width: 350px;
margin-top: 10px;
}
.search-tags1 {
display: flex;
align-items: flex-start;
color: white;
font-size: 13px;
gap: 10px;
width: 350px;
margin-top: 10px;
}
/* header full css */
/* Welcome Text */
.welcome-text {
font-size: 27px;
color: white;
font-family: 'Groningen-Regular', sans-serif;
margin-bottom: 40px; /* बटन से 10px का गैप */
}
/* Video Section */
.video-section {
position: relative;
height: 550px;
/*overflow: hidden;*/
}
.video-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background: rgba(0, 0, 0, 0.5); */
z-index: 1;
}
.custom-section-paras {
width: 80%;
margin: 0 auto;
}
.bg-video {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
min-width: 100%;
min-height: 100%;
z-index: -1;
}
.bottom-content {
position: absolute;
bottom: 30px; /* Footer से 30px ऊपर */
left: 10%; /* Header के हिसाब से left align */
width: 80%; /* लगभग पूरे वीडियो के बराबर चौड़ाई */
display: flex;
flex-direction: column; /* टेक्स्ट ऊपर, बटन नीचे */
align-items: flex-start; /* बाएँ तरफ अलाइन */
z-index: 2; /* Overlay के ऊपर दिखे */
}
/* Button Section */
.button-container {
/*position: absolute;*/
bottom: 30px;
left: 10%; /* Header ke start point se align */
width: 80%; /* Header ke width ke barabar */
display: flex;
justify-content: flex-start; /* Button left se start hoga */
z-index: 2;
}
.explore-row {
display: flex;
align-items: center;
gap: 30%;
}
.explore-button {
background: #ffc62a;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
}
.explore-button:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.explore-button-r {
background: #ffc62a;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
margin-top: auto;
align-self: flex-start;
}
.explore-button-r:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.explore-button9 {
background: #ffc62a;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
margin-top:120px;
float:right;
margin-right: -100px;
}
.explore-button9:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.explore-button15 {
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color:#09264b;
margin-bottom:50px;
margin-top:10px;
}
.explore-button15:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.full-width-dotted-line {
width: 100%;
border-top: 2px dotted black;
}
/*.explore-button img {*/
/* height: 28px;*/
/* width: 28px;*/
/* animation: right-bounce 1.5s infinite;*/
/*}*/
/*.scroll-info {*/
/* display: flex;*/
/* align-items: center;*/
/* gap: 10px;*/
/*}*/
/*.video-circle {*/
/* background: rgba(255, 255, 255, 0.3);*/
/* padding: 10px 15px;*/
/* border-radius: 50%;*/
/* font-weight: bold;*/
/*}*/
.button-container-about {
position: absolute;
bottom: 30px; /* Adjusted to be directly below the logo */
left: 60%;
transform: translateX(-50%);
width: 100%; /* Ensures full-width for the row */
}
.scroll-info {
display: inline-grid;
align-items: center;
font-size: 14px;
color: #fff;
}
.scroll-info img {
width: 20px; /* Size of the mouse icon */
height: auto;
animation: bounce-up 1.5s infinite; /* Applying bounce-up animation */
}
@keyframes bounce-up {
0%, 100% {
transform: translateY(0); /* Initial and final position */
}
50% {
transform: translateY(-10px); /* Move up by 10px */
}
}
.scroll-info img {
width: 20px; /* Size of the mouse icon */
height: auto;
margin-left:30px;
}
.video-circle {
background-color: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: #08254a;
font-size: 10px;
width: 30px;
height: 30px;
text-align: center;
}
@keyframes right-bounce {
0%, 20%, 50%, 80%, 100% {
transform: translateX(0); /* Start and end position */
}
40% {
transform: translateX(10px); /* Move to the right */
}
60% {
transform: translateX(5px); /* Slightly back to the left */
}
}
@media (min-width: 1024px) { /* Adjust min-width according to your design */
#hamburger-icon {
display: none;
}
}
@media (max-width: 1200px) { /* Adjust min-width according to your design */
.team-image1 {
width: calc(100% - 10px);
height: 500px !important;
border-radius: 5px;
padding: 5px;
}
}
.video-section-about {
position: relative;
height: 550px; /* Adjusted to make the section shorter */
overflow: hidden;
}
.bg-image-about {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
min-width: 100%;
min-height: 100%;
z-index: -1;
}
.button-container-about {
position: absolute;
bottom: 30px; /* Position of the button */
left: 16%;
transform: translateX(-50%);
}
.explore-button-about {
background: #ffc62a;
color: #08254a;
border: none;
padding: 6px 14px 8px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: inline-block;
font-weight: 600;
font-family: 'Helvetica-Bold', sans-serif;
}
.icons {
display: flex;
gap: 20px; /* Gap between icons */
margin-right: 20px; /* Space after menus */
}
.unique-info-section {
width: 80%;
margin: 0 auto; /* Center the section */
background-color: white;
/*padding: 20px;*/
position: relative;
color: #0c284d; /* Apply font color */
margin-top: 0px;
}
.unique-top-icons, .unique-bottom-icons {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
margin-top:-10px;
}
.unique-icon {
width: 25px; /* Smaller size */
height: 25px;
stroke-width: 1.5px; /* Lighter border */
stroke: #c3c3c3; /* #c3c3c3 color for the icons */
}
.unique-icon-about {
width: 20px; /* Smaller size */
height: 20px;
stroke-width: 1.5px; /* Lighter border */
stroke: black; /* #c3c3c3 color for the icons */
}
.unique-left-bottom-icon,
.unique-right-bottom-icon {
width:15px;
height:35px;
}
.unique-content-wrapper {
width: 100%;
background: url('../../assets/img/Group 2090.png') no-repeat center center/cover;
padding: 50px 0;
}
.unique-content {
display: flex;
justify-content: space-between;
align-items: center;
max-width: 1200px;
margin: 0 auto;
text-align: center;
}
.unique-content-item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
}
.unique-icon-img {
width: 60px;
height: 60px;
margin-bottom: 20px;
}
.unique-content-item h2 {
font-size: 24px;
color: #ffc62a;
font-family: 'Groningen-Regular', sans-serif;
font-weight: 100;
line-height: 1.4;
}
/* Yellow partition line */
.divider-line {
width: 2px;
background-color: #ffc62a;
height: 100px;
margin: 0 30px;
}
.unique-bottom-icons {
margin-top: 50px;
}
.language-dropdown {
position: relative;
display: flex;
align-items: center;
background: #d3d3d3; /* Grey Background */
padding: 5px 5px;
/*border-radius: 5px;*/
border: 1px solid #ccc;
cursor: pointer;
}
/* Styling for the dropdown */
#language-selector {
background: transparent;
border: none;
font-size: 14px;
color: #08254a; /* Blue Text */
cursor: pointer;
outline: none;
appearance: none; /* Hide default dropdown arrow */
padding-right: 20px;
}
/* Custom dropdown arrow */
.language-dropdown i {
position: absolute;
right: 10px;
color: white; /* White Icon */
font-size: 14px;
pointer-events: none; /* Prevent interaction */
}
.new-section {
display: flex;
flex-direction: column;
align-items: flex-start; /* Align all items to the left */
padding: 20px;
max-width: 80%; /* Set section width to 80% */
width: 100%; /* Ensure full width */
margin: 0 auto; /* Center the section */
}
.top-icons,
.middle-icons,
.bottom-icons {
display: flex;
justify-content: space-between;
width: 100%; /* Full width */
}
.bottom-icons-about{
display: flex;
justify-content: space-between;
width: 100%; /* Full width */
}
.bottom-icons newbottom-icons-about{
margin-top:20px;
}
.top-left-icon,
.middle-left-icon,
.top-right-icon,
.middle-right-icon {
width: 25px; /* Size of the SVG icons */
height: 25px;
color: #c3c3c3; /* SVG color */
}
.bottom-left-icon,
.bottom-right-icon {
width: 15px; /* Size of the SVG icons */
height: 35px;
color: #c3c3c3;
}
.minus-icon,
.middle-minus-icon,
.bottom-center-minus-icon {
width: 25px; /* Same size for minus icon */
height: 25px;
color: #c3c3c3; /* SVG color */
}
.main-heading {
font-size: 40px; /* Font size for the heading */
font-weight: normal; /* Font weight set to 200 */
color: #0c284d; /* Heading color */
margin: 20px 0; /* Margin around heading */
text-align: left; /* Left align heading */
font-family: 'Groningen-Regular', sans-serif;
}
.main-heading9 {
font-size: 40px; /* Font size for the heading */
font-weight: 100; /* Font weight set to 200 */
color: #132f52; /* Heading color */
margin: 20px 0; /* Margin around heading */
text-align: left; /* Left align heading */
font-family: 'Groningen-Regular', sans-serif;
width: 70%;
}
.main-heading-about1 {
font-size: 40px; /* Font size for the heading */
font-weight: normal; /* Font weight set to 200 */
color: #0c284d; /* Heading color */
margin: 20px 0; /* Margin around heading */
text-align: left; /* Left align heading */
font-family: 'Groningen-Regular', sans-serif;
}
.stats {
display: flex;
justify-content: space-between;
width: 100%; /* Full width */
margin-top: 30px; /* Space between heading and stats */
margin-bottom: 30px;
}
.stat-item {
text-align: left; /* Left align stats */
}
.stat-number {
font-size: 60px; /* Updated font size for numbers */
font-weight: 100; /* Font weight set to 100 */
color: #ffc62a; /* Changed color to #fec52a */
font-family: 'Groningen-Regular', sans-serif;
}
.stat-description {
color: white; /* Description color */
font-size: 1em; /* Normal font size */
margin-top: 10px; /* Space between number and description */
font-family: 'Helvetica', sans-serif;
}
.stat-description-about {
color: #1f2a44; /* Description color */
font-size: 1em; /* Normal font size */
margin-top: 10px; /* Space between number and description */
font-family: 'Helvetica', sans-serif;
}
.certificates-section {
width: 80%;
margin: 0 auto;
/*padding: 40px 0;*/
/*margin-top:60px;*/
margin-bottom:60px;
}
.certificates-heading {
font-size: 10px;
color: #08254a !important;
margin-bottom: 25px;
letter-spacing: 1px;
}
.certificates-container {
display: flex;
justify-content: space-between;
background-color: #ffc62a;
padding: 20px;
}
.certificate-box {
text-align: left;
flex: 1;
/*margin: 0 15px;*/
margin-right: 13px;
}
.certificate-box:last-child {
margin-right: 0; /* Remove margin-right from the last box */
}
.certificate-image-container {
background-color: #fff;
padding: 25px;
box-shadow: 0px 4px 8px rgba(0,0,0,0.1);
margin-bottom: 25px;
height: 150px;
display: flex; /* Centering Fix */
justify-content: center; /* Center horizontally */
align-items: center; /* Center vertically */
max-width: 100%; /* Responsive width */
overflow: hidden; /* Prevents overflow */
}
.certificate-image {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
.certificate-title {
font-size: 17px;
color: #333;
margin-bottom: 25px;
font-weight: 600;
font-family: 'Groningen-Regular', sans-serif;
text-align: center;
}
.certificate-subtitle {
font-size: 16px;
color: #555;
margin-bottom: 25px;
font-family: 'Helvetica', sans-serif;
}
.certificate-button {
background-color: #08254a;
color: #ffc62a;
border: none;
padding: 6px 8px;
font-size: 10px;
cursor: pointer;
display: inline-flex;
align-items: center;
border-radius: 4px;
}
.arrow-down {
font-size: 16px; /* Adjust as needed */
animation: bounce 1.5s infinite;
display: inline-block; /* Required for transform animations */
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
transform: translateY(0);
}
40% {
transform: translateY(10px);
}
60% {
transform: translateY(5px);
}
}
.certificates-section-about {
width: 80%;
margin: 0 auto;
padding: 40px 0;
}
.certificates-heading-about {
font-size: 10px;
color: #08254a !important;
margin-bottom: 25px;
letter-spacing: 1px;
}
.certificates-container-about {
display: flex;
justify-content: space-between;
background-color: #ffc62a;
padding: 20px;
}
.certificate-box-about {
text-align: left;
flex: 1;
/*margin: 0 15px;*/
margin-right: 13px;
}
.certificate-box-about:last-child {
margin-right: 0; /* Remove margin-right from the last box */
}
.certificate-image-container-about {
background-color: #fff;
padding: 25px;
box-shadow: 0px 4px 8px rgba(0,0,0,0.1);
margin-bottom: 25px;
height: 150px;
}
.certificate-image-about {
width: 100%;
height: auto;
margin-top:50px;
}
.certificate-title-about {
font-size: 24px;
color: #333;
margin-bottom: 25px;
font-weight: normal;
font-family: 'Groningen-Regular', sans-serif;
}
.certificate-subtitle-about {
font-size: 16px;
color: #555;
margin-bottom: 25px;
font-family: 'Helvetica', sans-serif;
}
.certificate-button-about {
background-color: #08254a;
color: #ffc62a;
border: none;
padding: 6px 8px;
font-size: 10px;
cursor: pointer;
display: inline-flex;
align-items: center;
border-radius: 4px;
}
.arrow-down-about {
font-size: 16px; /* Adjust as needed */
animation: bounce 1.5s infinite;
display: inline-block; /* Required for transform animations */
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
transform: translateY(0);
}
40% {
transform: translateY(10px);
}
60% {
transform: translateY(5px);
}
}
/* 1px full-width lines */
.top-line{
width: 100%;
height: 1px;
background-color: #d5dae0;
margin-top: 100px;
}
.bottom-line{
width: 100%;
height: 1px;
background-color: #707070;
margin-top:20px;
display: none !important;
}
/* 3 columns container */
.content-container {
display: flex;
justify-content: space-between;
width: 80%;
margin: 20px auto;
text-align: left;
}
/* Left column */
.left-column, .right-column {
width: 25%;
font-size: 12px;
color: white;
font-family: 'Helvetica', sans-serif;
}
/* Center column for main heading */
.center-column {
width: 50%;
text-align: center;
}
.center-column h1 {
font-size: 40px;
margin: 20px;
font-weight: normal;
color: #ffc62a;
font-family: 'Groningen-Regular', sans-serif;
}
.center-column h3 {
font-size: 36px;
margin-top: 10px;
color: white !important;
font-weight: 100;
/* letter-spacing: 5px; */
font-family: system-ui;
}
.left-column p {
margin-top: 120px;
margin-left: -100px;
}
/* Right column text */
.right-column {
text-align: left;
}
/* Full-width video section */
.video-container {
width: 100%;
height: 100vh;
/*background: #eaeaea;*/
position: relative;
overflow: hidden;
/*opacity:0.7;*/
}
.background-video {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
object-fit: cover; /* Makes the video cover the container */
transform: translate(-50%, -50%); /* Centers the video */
z-index: 1;
}
.play-text {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 60px;
color: white;
z-index: 2; /* Ensures text appears above the video */
font-weight: bold;
font-family: Helvetica, sans-serif; /* Sets font to Helvetica */
text-transform: uppercase; /* Makes text uppercase */
font-weight:normal;
letter-spacing:-5px;
font-family: 'Groningen-Regular', sans-serif;
}
.video-container-tech {
width: 80%;
max-width: 80%; /* Ensures it doesn't exceed 80% on larger screens */
height: 500px;
background: #eaeaea;
position: relative;
margin: 0 auto; /* Centers the container */
}
.video-overlay-tech {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
position: relative;
}
.play-button-tech {
background-color: rgba(0, 0, 0, 0.5);
border: none;
color: #fff;
font-size: 40px;
width: 80px;
height: 80px;
border-radius: 50%;
cursor: pointer;
position: absolute;
}
.play-button-tech:hover {
background-color: rgba(0, 0, 0, 0.7);
}
.search-container{
margin-top:8px;
}
/* Main container for news section */
.news-container {
width: 80%;
margin: 0 auto;
text-align: left;
}
/* Latest news heading */
.latest-news {
text-transform: uppercase;
font-size: 15px;
margin-top: 100px;
margin-bottom: 20px;
color: #333;
}
.latest-news-blog {
text-transform: uppercase;
font-size: 15px;
margin-bottom: 20px;
color: #333;
}
.main-heading-blog {
font-size: 30px;
margin-bottom: 30px;
color: #1f2a44;
}
/* Container for images and news items */
.news-images {
display: flex;
justify-content: space-between;
}
/* Individual news items */
.news-item {
width: 350px;
}
.news-item-blog{
width: 500px;
}
/* News images */
.news-image {
width: 100%;
height: 350px;
object-fit: cover;
margin-bottom: 20px;
}
/* Wrapper for heading and read button */
.title-and-button {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
/* News title */
.news-title {
font-size: 20px;
margin: 0;
color: #1f2a44;
}
.news-title-blog {
margin-top:10px;
}
/* News description paragraph */
.news-description {
font-size: 13px;
text-align: justify;
color: #08254a;
margin-right: 50px;
}
/* Read button */
.read-btn {
font-weight: 600;
width: 50px;
height: 40px;
background-color: #f5c242;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
font-size: 8px;
color: #08254a;
cursor: pointer;
}
.custom-section {
background-color: #08254a;
width: 100%;
padding: 40px 0;
height: 700px; /* Set height of custom section */
margin-top:100px;
}
.container {
display: flex;
width: 80%;
margin: 0 auto;
gap: 10px;
}
.image-section {
width: 62%;
position: relative;
height: 690px; /* Set height of image section */
overflow: hidden;
}
.image-wrapper {
position: relative;
height: 700px;
}
.background-image {
width: 100%;
height: 100%;
object-fit: cover;
}
.image-content {
position: absolute;
left: 20px;
right: 20px;
top: 20px;
color: #fff;
text-align: left;
}
.image-heading {
font-size: 35px;
font-weight: normal;
margin: 0;
font-family: 'Groningen-Regular', sans-serif;
}
.#fec52a-line,
.#fec52a-line2 {
height: 1px;
background-color: #ffcc00;
margin-bottom: 20px;
}
.#fec52a-line2 {
margin-top: 20px;
}
.image-description {
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
font-size: 14px;
color: #fff;
text-align: justify;
letter-spacing: 0.4px;
font-family: 'Helvetica', sans-serif;
}
.image-description::before {
content: "";
display: block;
width: 100%;
height: 1px;
background-color: #ffcc00;
margin-bottom: 20px;
}
.accordion-section {
width: 36%;
padding-left: 10px;
}
.accordion-item {
margin-bottom: 5px;
}
.accordion-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
background: #fff;
cursor: pointer;
font-size: 30px;
font-family: 'Groningen-Regular', sans-serif;
}
.accordion-content {
display: none;
padding: 10px;
background: #f9f9f9;
}
.accordion-content.active {
display: block;
}
.button-group {
display: flex;
gap: 10px;
margin-top: 10px;
}
.enquire-btn, .learn-btn {
padding: 0px 7px 7px 14px;
border: none;
cursor: pointer;
border-radius: 15px;
}
.enquire-btn {
background-color: #ffcc00;
color: #000;
font-size: 10px;
}
.enquire-btn img {
animation: right-bounce 1.5s infinite;
}
.learn-btn img {
animation: right-bounce 1.5s infinite;
}
.learn-btn {
background-color: #ddd;
color: #000;
font-size: 10px;
}
.process-section {
display: flex;
/*justify-content: space-around;*/
width: 80%;
margin: 0 auto;
gap: 6px;
margin-top:5px;
}
.process-item {
position: relative;
width: calc(50%);
height: 450px;
}
.process-item2 {
position: relative;
width: calc(50%);
height: 450px;
}
.video-container video {
width: 95%;
height: 100%;
object-fit: cover;
}
.overlay-content {
position: absolute;
top: 0;
width: 100%;
z-index: 2;
}
.process-header {
padding: 20px;
}
.#fec52a-line5 {
height: 1px;
background-color: #f5c242;
margin-bottom: 15px;
}
.#fec52a-line6 {
height: 1px;
background-color: #f5c242;
margin-top: 15px;
}
.header-content {
display: flex;
justify-content: space-between;
align-items: center;
}
.title {
font-size: 30px;
font-weight: normal;
color: #f5c242;
font-family: 'Groningen-Regular', sans-serif;
}
.icon img {
width: 45px;
height: 35px;
}
.sub-title {
font-size: 9px;
color: #f5c242;
font-family: 'Helvetica', sans-serif;
}
.process-footer {
position: absolute;
bottom: -80px;
width: 100%;
padding: 0 20px; /* Ensure 20px gap on both left and right */
display: flex;
justify-content: space-between;
align-items: center;
}
.process-footers {
position: absolute;
bottom: -80px;
width: 100%;
padding: 0 20px; /* Ensure 20px gap on both left and right */
display: flex;
justify-content: space-between;
align-items: center;
}
.footer-text {
font-size: 10px; /* Font size for paragraph */
color: #fff;
margin-right: 20px; /* 20px gap between text and button */
flex-grow: 1; /* Ensure text occupies available space */
width:25%;
font-family: 'Helvetica', sans-serif;
}
.detail-button {
background-color: #f5c242;
color: black;
border: none;
padding: 8px 15px;
font-size: 10px; /* Font size for the button text */
cursor: pointer;
border-radius: 25px;
margin-right: 40px; /* Ensure 20px gap to the right */
}
.detail-button:hover {
background-color: #d4b000;
}
/* Container */
.custom-container {
width: 80%;
margin: 0 auto;
/*background-color: #08254a;*/
margin-top: -60px;
padding: 25px 20px;
}
.custom-container-new-about {
width: 77%;
margin: 0 auto;
background-color: #08254a;
margin-top: 40px;
padding: 25px 20px;
}
.about-real-text{
width: 80%;
margin: 0 auto;
margin-top: 40px;
font-family: 'Groningen-Regular', sans-serif;
font-size: 40px;
font-weight: normal;
}
.custom-container-tech {
width: 80%;
margin: 0 auto;
background-color: #08254a;
margin-top: 0px;
padding: 25px 20px;
}
/* Top white line */
.top-white-line {
/*border-top: 1px solid white;*/
margin-top: -20px;
}
/* 3-column section with triangle, icon, and subtitle */
.top-three-column-section {
display: flex;
justify-content: space-between; /* Space out the columns */
align-items: center; /* Vertically center all content */
width: 100%; /* Full-width section */
margin: 0 auto; /* Center the section horizontally */
padding: 0px 0; /* Adjust top and bottom padding */
}
.triangle-icon {
flex: 1; /* Allow the icon to take available space */
background: url(path-to-triangle-icon.png) no-repeat left center;
padding-left: 10px; /* Space for the background icon */
color: #ffc62a;
font-size: 30px;
font-weight: normal;
white-space: nowrap; /* Prevent text wrapping */
font-family: 'Groningen-Regular', sans-serif;
}
.center-icon {
flex: 1; /* Center icon gets equal space */
display: flex;
justify-content: center; /* Center the icon horizontally */
}
.center-icon img {
width: 40px; /* Adjust based on icon size */
height: auto;
}
.center-icon-about {
flex: 1; /* Center icon gets equal space */
display: flex;
justify-content: center; /* Center the icon horizontally */
}
.center-icon-about img {
width: 77%; /* Adjust based on icon size */
height: auto;
}
.subtitle {
flex: 1; /* Right side with equal space */
color: #ffc62a;
font-size: 14px;
white-space: nowrap; /* Prevent text wrapping */
text-align: right; /* Align text to the right */
margin-right: 10px;
}
/* Divider line */
.divider-line {
border-top: 1px solid white;
margin: 15px 0;
margin-left: 10px;
margin-right: 10px;
}
.divider-line-about {
border-top: 1px solid #ffc62a;
margin: 15px 0;
margin-left: 10px;
margin-right: 10px;
}
/* Two-column content and button section */
.content-section {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 25px;
gap: 40px; /* Adjusted for better spacing */
padding: 10px;
}
.left-content {
width: 65%;
color: white;
}
.left-content p {
margin: 0;
font-size:16px;
font-weight: 100;
letter-spacing: 0.2px;
font-family: 'Helvetica', sans-serif;
}
.right-button {
/*width: 35%;*/
}
.right-button img{
animation: right-bounce 1.5s infinite;
}
.right-button2 {
width: 35%;
margin-right:-20px;
}
.right-button2 img{
animation: right-bounce 1.5s infinite;
}
.process-btn {
background-color: #ffc62a;
color: black;
padding: 10px 16px 10px 16px;
border-radius: 25px;
text-decoration: none;
font-size:12px;
font-family: 'Helvetica', sans-serif;
}
.process-btn2 {
background-color: #ffc62a;
color: black;
padding:7px 7px 7px 10px;
border-radius: 25px;
text-decoration: none;
font-size: 10px;
margin-left: -30px;
font-family: 'Helvetica', sans-serif;
}
.p_2{
/*margin-top:10px;*/
}
.process-btn:hover {
background-color: #E0C500;
}
/* 4-column video section */
.video-sectionnw {
display: flex;
justify-content: space-between;
margin-top: 20px;
gap: 4px; /* Adjusted for spacing */
padding: 10px;
}
.video-sectionnw-tech {
display: flex;
justify-content: space-between;
margin-top: 40px;
gap: 10px; /* Adjusted for spacing */
padding: 10px;
}
.video-item {
width: 25%;
position: relative; /* Needed for absolute positioning of overlay */
color: white; /* Text color */
overflow: hidden; /* Ensure the video stays contained within its box */
}
.video-item-tech {
width: 24%;
position: relative; /* Needed for absolute positioning of overlay */
color: white; /* Text color */
overflow: hidden; /* Ensure the video stays contained within its box */
}
.video-containerg {
position: relative; /* Make the container relative to allow absolute positioning for the overlay */
}
.video-containerg-tech {
position: relative; /* Make the container relative to allow absolute positioning for the overlay */
}
.video-containerg video {
width: 100%;
height: 160px;
object-fit: cover; /* Ensures the video covers the area properly */
}
.video-containerg-tech video {
width: 100%;
height: 160px;
object-fit: cover; /* Ensures the video covers the area properly */
}
.video-overlayg {
position: absolute;
bottom: 0;
left: 0;
right: 0;
/* background: rgba(0, 0, 0, 0.5); */
padding: 10px;
text-align: left;
}
.video-overlayg-tech {
position: absolute;
bottom: 0;
left: 0;
right: 0;
/* background: rgba(0, 0, 0, 0.5); */
padding: 10px;
text-align: left;
}
.video-description {
font-size: 10px; /* Adjust text size */
margin: 0; /* Remove default margins */
font-family: 'Helvetica', sans-serif;
}
.video-description-tech {
font-size: 14px; /* Adjust text size */
margin: 0; /* Remove default margins */
}
.video-subtitle {
font-size: 14px; /* Adjust subtitle size */
margin: 5px 0 0 0; /* Slight margin at the top */
font-family: 'Helvetica', sans-serif;
}
.video-subtitle-tech {
font-size: 12px; /* Adjust subtitle size */
margin: 5px 0 0 0; /* Slight margin at the top */
}
/* Full width video */
.full-width-video {
margin-top: -20px;
padding: 10px;
}
.full-width-video-about {
/*margin-top: -20px;*/
padding: 10px;
border-radius:2px;
}
.full-width-video-tech {
margin-top: -10px;
padding: 10px;
}
/* Bottom white line */
.bottom-white-line {
border-top: 1px solid white;
margin-top: 10px;
margin-right: 10px;
margin-left: 10px;
}
.bottom-line23 {
color: #445264;
font-size: 12px;
padding: 10px;
margin-top: -10px;
margin-bottom:0px;
font-family: 'Helvetica', sans-serif;
}
.bottom-line23::before {
content: "*"; /* Adds the star symbol */
color: #ffc62a; /* #fec52a color for the star */
font-size: 14px; /* Adjust size if needed */
margin-right: 5px; /* Adds space between star and text */
}
.foot-specialdiv
{
position: relative;
left: 70px;
}
/* Footer Styling */
.custom-footer {
/*background-color: #252525;*/
color: #d7d7d7;
padding: 0px 0;
font-family: Arial, sans-serif;
background-image: url('../img/Group 162.png');
/*margin-top: 20px;*/
margin-left:-2px;
}
.footer-container {
display: flex;
/*justify-content: space-between;*/
flex-wrap: wrap;
max-width: 80%;
margin: 0 auto;
gap:36px;
padding-bottom: 30px;
}
.footer-column {
width: 20%;
padding: 10px;
}
.footer-column h4, .footer-column h5 {
color: #ffc62a;
margin-bottom: 30px;
font-size: 16px;
margin-top: 70px;
font-weight:normal;
font-family: 'Groningen-Regular', sans-serif;
}
.footer-column ul {
list-style: none;
padding: 0;
line-height: 12px;
width: 130px;
}
.footer-column ul li {
margin: 5px 0;
width: 130px;
}
.footer-column ul li a {
color: #d7d7d7;
text-decoration: none;
font-family: 'Helvetica', sans-serif;
font-size:12px;
}
.footer-column ul li a:hover {
color: #ffc62a;
}
.footer-column a {
font-size: 14px;
}
.footer-column .social i {
margin-right: 10px;
font-size: 18px;
}
.qr-code img {
width: 100px;
height: 100px;
}
/* Newsletter and Callback Forms */
.newsletter-form, .callback-form {
display: flex;
align-items: center;
width:310px;
}
.newsletter-form input, .callback-form input {
padding: 10px;
margin-right: 5px;
border: none;
height: 30px;
/*border-radius: 5px;*/
background-color: #d7d7d7;
}
.newsletter-form button, .callback-form button {
background-color: #ffc62a;
color: black;
padding: 15px;
border: none;
height: 50px;
}
.map {
width: 310px;
margin-bottom: -15px;
margin-top: -40px;
}
.map img {
width: 100%;
margin-bottom: 10px;
height: 200px;
object-fit: cover;
}
/* Get a Call Back Section */
.call-back-section {
margin-top: 30px;
color: white;
}
.call-back-section h5 {
color: #ffc62a;
font-size: 16px;
margin-bottom: 10px;
}
.callback-form {
display: flex;
align-items: center;
justify-content: space-between;
}
.hr{
margin-top: -17px;
width: 250px;
margin-left: 0px;
}
/* Flex container for the inputs */
.input-group {
display: flex;
flex-direction: column;
flex-grow: 1;
gap: 4px;
}
/* Full-width input for Name */
.input-full {
padding: 10px;
border: none;
background-color: #333;
color: white;
font-size: 14px;
width: 170px;
height: 4px;
}
.input-full2 {
height: 3px !important;
}
/* Flex container for Email and Phone */
.half-inputs {
display: flex;
}
/* Half-width inputs for Email and Phone */
.input-half {
flex: 1;
padding: 10px;
border: none;
background-color: #333;
color: white;
font-size: 14px;
width: 30px;
height: 4px;
}
.input-half2 {
width: 108px;
height: 3px !important;
}
/* Submit button aligned to the right */
.submit-btn {
background-color: #ffc62a;
color: black;
padding: 12px;
font-size: 16px;
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
height:50px !important;
width: 43px !important;
}
.submit-btn i {
font-size: 18px;
}
.submit-btn:hover {
background-color: #e0b800;
}
/* Last Section */
.last-section {
margin-top: 50px;
color: #ffc62a;
font-size: 12px !important;
line-height: 1.6;
text-align: justify;
display: flex;
width: 310px;
gap: 15px;
}
.footer-wrapper {
background-color: #102038; /* Dark blue background */
padding: 10px 0;
display: flex;
justify-content: center;
align-items: center;
margin-top:1px;
}
.footer-container2 {
width: 80%;
max-width: 1200px;
display: flex;
justify-content: space-between;
align-items: center;
color: #d7d7d7; /* White text for readability */
}
.footer-left-content p,
.footer-right-content p {
margin: 0;
font-size: 12px;
font-family: 'Groningen-Regular', sans-serif;
}
.footer-left-content {
flex: 1;
text-align: left;
margin-left: 10px;
}
.footer-right-content {
flex: 1;
text-align: right;
margin-right: -225px;
}
.scroll-to-top {
position: fixed;
bottom: 50px;
right: 20px;
width: 30px;
height: 30px;
background-color: #ffffff;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
cursor: pointer;
transition: opacity 0.3s ease, transform 0.3s ease;
opacity: 0;
visibility: hidden;
z-index: 1000;
}
.scroll-to-top.show {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.arrow-up {
border: solid #f7c12e;
border-width: 0 3px 3px 0;
display: inline-block;
padding: 5px;
transform: rotate(-135deg);
margin-bottom: -4px;
}
.sectionji {
width: 100%;
background-image:url('../img/Rectangle 103.png');
/*background-color: #002f61;*/
padding: 25px 0; /* Add some padding for space around the content */
}
.sectionabout {
width: 100%;
padding: 60px 0 0; /* Add some padding for space around the content */
}
.section-wrapper {
width: 80%;
margin: 0 auto;
color: white;
text-align: left;
/*background-color: #002f61;*/
margin-top:25px;
}
.section-wrapper-about {
width: 80%;
margin: 0 auto;
color: white;
text-align: left;
}
.section-wrapper-tech {
width: 80%;
margin: 0 auto;
color: white;
text-align: left;
}
.main-title {
font-size: 40px;
color: #ffc62a;
margin-top: 20px;
font-weight: normal;
/*width: 80%;*/
margin-bottom: 20px;
font-family: 'Groningen-Regular', sans-serif;
}
.main-title-about {
font-size: 40px;
color: #ffc62a;
margin-top: 20px;
font-weight: normal;
width: 80%;
margin-bottom: 20px;
font-family: 'Groningen-Regular', sans-serif;
}
.main-title-about2 {
font-size: 40px;
color: #ffc62a;
font-weight: normal;
font-family: 'Groningen-Regular', sans-serif;
}
.main-title-tech {
font-size: 60px;
color: #ffc62a;
margin-top: 20px;
font-weight: 100;
width: 70%;
}
.main-title-tech2 {
font-size: 60px;
color: black;
margin-top: 20px;
font-weight: 100;
width: 70%;
}
.top-section-about {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%; /* Subsection width */
}
.subtitle1 {
font-size: 14px;
color: white;
margin-top: 10px;
line-height: 1.6;
font-family: 'Helvetica', sans-serif;
max-width: 80%; /* To ensure text wraps correctly */
}
.subtitle1-about {
font-size: 16px;
color: #0b284c;
margin-top: 10px;
line-height: 1.6;
width: 84%;
font-family: 'Helvetica', sans-serif;
}
.subtitletech {
font-size: 20px;
color: black;
margin-top: 10px;
line-height: 1.6;
width: 70%;
}
.text-bottom {
font-size: 42px;
color: white;
text-align: left;
margin-top: 30px;
font-weight: 100;
width: 85%;
font-family: 'Groningen-Regular', sans-serif;
}
/* SVG Styles */
.svg-icons-middle, .svg-icons-bottom {
display: flex;
justify-content: space-between;
}
.about-svg-icon {
stroke: #75736e;
width: 25px;
height: 25px;
}
.svg-icons-top{
display: flex;
justify-content: space-between;
}
.expertise-svg-icon {
stroke: #75736e;
width: 25px;
height: 25px;
}
.svg-icons-top-about{
display: flex;
justify-content: space-between;
}
.svg-icon {
stroke: #ffc62a;
width: 25px;
height: 25px;
}
.svg-icon-about {
stroke: black;
width: 20px;
height: 20px;
}
.svg-icon-index
{
color: #75736e !important;
width: 25px;
}
.full-video-white-video {
width: 100%;
overflow: hidden;
margin-top: 50px;
}
.video-bg-white-video {
width: 100%;
height: auto;
object-fit: cover;
display: block;
}
.top-content1 {
display: flex;
justify-content: space-between; /* Space between left and right content */
align-items: center; /* Center content vertically */
width: 80%; /* Set width to 80% */
}
.left-content1 {
color: #d7d7d7; /* Left content text color */
font-size: 13px; /* Adjust font size as needed */
margin-bottom: -80px;
margin-left: 135px;
text-transform: uppercase;
}
.right-content1 {
color: #d7d7d7; /* Right content text color */
font-size: 13px; /* Adjust font size as needed */
text-align: right; /* Align text to the right */
margin-bottom: -80px;
margin-right: -135px;
text-transform: uppercase;
}
.subtitle20{
font-size:20px;
width:60%;
}
.subtitleabout{
font-size:20px;
width:60%;
color:black;
}
.product-section-tech {
width: 80%;
margin: 0 auto;
padding: 20px 0;
}
.product-container-tech {
display: flex;
justify-content: space-between;
gap: 10px;
}
.product-box-tech {
width: 100%;
max-width: 350px;
background-color: #f7f7e0;
border-radius: 2px;
padding: 20px;
box-sizing: border-box;
}
.product-tag-tech {
background-color: #000;
color: #fff;
padding: 5px 10px;
border-radius: 2px;
font-size: 14px;
margin-bottom: 20px;
display: inline-block;
}
.new-tag-tech {
background-color: #000;
color: #fff;
font-size: 12px;
padding: 3px 6px;
margin-left: 5px;
}
.product-title-tech {
font-size: 20px;
margin: 20px 0;
}
.product-inner-box-tech {
background-color: #e0f7df;
padding: 20px;
position: relative;
text-align: center;
border-radius: 2px;
}
.icon-top-left-tech, .icon-top-right-tech, .icon-bottom-left-tech, .icon-bottom-right-tech {
position: absolute;
color: #a0a0a0;
font-size: 18px;
}
.icon-top-left-tech {
top: 10px;
left: 30px;
}
.icon-top-right-tech {
top: 10px;
right: 30px;
}
.product-image-tech {
max-width: 100%;
height: auto;
margin: 20px 0;
}
.icon-bottom-left-tech {
bottom: 10px;
left: 30px;
}
.icon-bottom-right-tech {
bottom: 10px;
right: 30px;
}
.product-image-tech {
max-width: 100%;
height: auto;
margin: 20px 0;
}
.product-description-tech {
font-size: 14px;
color: #333;
margin: 20px 0;
}
.order-button-tech {
background-color: #ffc62a;
border: none;
padding: 10px 20px;
font-size: 14px;
color: #000;
border-radius: 20px;
cursor: pointer;
display: inline-block;
text-align: center;
font-weight: bold;
}
.order-button-tech:hover {
background-color: #c7e700;
}
.custom-section-tech {
width: 80%;
background-color: #007BFF; /* Blue background */
margin: 0 auto;
padding: 30px;
}
.heading-container-tech {
position: relative;
margin-bottom: 20px;
width: 50%;
}
.main-heading-tech {
font-size: 60px;
color: #fff;
margin-bottom: 10px;
}
.svg-icon-left-top-tech,
.svg-icon-center-top-tech,
.svg-icon-right-top-tech {
width: 30px;
height: 30px;
color: #ffc62a;
}
.svg-icon-left-top-tech {
position: absolute;
color: #ffc62a;
left: 5%;
}
.svg-icon-center-top-tech {
position: absolute;
color: #ffc62a;
left: 50%;
transform: translateX(-50%);
}
.svg-icon-right-top-tech {
position: absolute;
color: #ffc62a;
right: 5%;
}
.numbers-row-tech {
display: flex;
justify-content: space-between;
margin-top: 20px;
}
.number-column-tech {
text-align: center;
color: #fff;
}
.large-number-tech {
font-size: 100px;
}
.subtext-tech {
font-size: 14px;
margin-top: -10px;
text-align:left;
}
.bottom-svg-icons-tech {
display: flex;
justify-content: space-between;
margin-top: 20px;
}
.experience-section-tech {
margin-top: 30px;
width:50%;
}
.experience-heading-tech {
font-size: 40px;
color: #fff;
margin-bottom: 10px;
}
.experience-paragraph-tech {
font-size: 16px;
color: #fff;
}
.features-row-tech {
display: flex;
justify-content: space-between;
gap: 10px;
margin-top: 10px;
}
.feature-box-tech {
background-color: #e0f7df;
padding: 20px;
border-radius: 2px;
width: 48%;
}
.feature-title-tech {
font-size: 40px;
color: #333;
}
.feature-description-tech {
font-size: 15px;
color: #333;
margin-top: 10px;
}
.feature-image-tech {
width: 100%;
margin-top: 20px;
}
.svg-icons-top-tech {
position: relative;
display: flex;
justify-content: space-between;
gap: 10px;
margin-top: 10px;
z-index: 10; /* Ensure the container is layered above other content */
}
.svg-icon-tech,
.unique-icon-tech {
width: 20px; /* Adjust size as needed */
height: 20px;
color: #f7c12e; /* White color */
z-index: 10; /* Layering above other elements */
}
/* Container Styling */
.container-tech {
display: flex;
justify-content: space-between;
width: 80%;
margin: auto;
gap: 10px;
}
/* Card Styling */
.card-tech {
background-color: #ffffff;
border-radius: 10px;
overflow: hidden;
width: calc(33.333% - 10px);
position: relative;
text-align: center;
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}
/* Image Wrapper Styling */
.image-wrapper-tech {
position: relative;
padding: 20px;
}
/* SVG Corner Icons */
.corner-icon-tech {
position: absolute;
width: 10px;
height: 10px;
stroke: black;
}
/* Positioning of Each Corner SVG */
.top-left-tech {
top: 20px;
left: 20px;
}
.top-right-tech {
top: 20;
right: 20px;
}
.bottom-left-tech {
bottom: -20px;
left: 20px;
}
.bottom-right-tech {
bottom: -20px;
right: 20px;
}
/* Image Styling */
.card-image-tech {
width: 100%;
height: auto;
border-radius: 10px;
}
/* Title Styling */
.card-title-tech {
font-size: 16px;
font-weight: bold;
color: #333;
margin-top: 50px;
text-align: left;
margin-left: 20px;
}
.image-container-about {
width: 100%;
height: 500px;
overflow: hidden;
margin: 0 auto; /* Center the image container */
}
.image-about {
width: 100%;
height: 100%;
object-fit: cover; /* Ensures the image covers the container proportionally */
}
.journey-section-about {
padding: 20px;
margin: 0 auto;
width: 80%;
}
.journey-heading-about {
font-size: 40px;
text-align: left;
color: #08254a;
margin-bottom: 15px;
}
.journey-content-about {
font-size: 16px;
line-height: 1.6;
color: #333;
text-align: left;
}
.journey-section-about {
width: 80%;
margin: 0 auto;
padding: 20px 0;
}
.main-heading-about {
font-size: 40px;
color: #000;
text-align: left;
margin-bottom: 20px;
}
.timeline-heading-about {
font-size: 40px;
color: #000;
margin-bottom: 10px;
}
.timeline-divider-about {
width: 100%;
border: none;
border-top: 1px solid #000;
margin-bottom: 20px;
}
.timeline-content-about {
display: flex;
gap: 130px;
align-items: flex-start;
}
.timeline-content-about2 {
display: flex;
gap: 130px;
align-items: flex-start;
margin-top:100px;
}
.timeline-text-about {
flex: 1;
}
.timeline-subheading-about {
font-size: 24px;
color: #000;
margin-bottom: 10px;
font-weight: bold;
}
.timeline-paragraph-about {
font-size: 16px;
line-height: 1.6;
color: #333;
}
.timeline-image-about {
flex: 1;
}
.image2-about {
width: 100%;
height: 250px;
border-radius: 5px;
}
.founders-section-about {
width: 80%;
margin: 0 auto;
padding: 20px 0;
}
.founders-heading-about {
font-size: 35px;
font-weight: bold;
text-align: left;
margin-bottom: 10px;
color: #000;
}
.section-divider-about {
border: none;
border-top: 1px solid #000;
margin-bottom: 20px;
}
.founder-row-about {
display: flex;
/* justify-content: space-between; */
align-items: center;
gap: 500px;
margin-bottom: 30px;
}
.founder-name-about {
font-size: 18px;
color: #000;
text-align: left;
}
.founder-title-about {
font-size: 18px;
color: #000;
text-align: left;
text-transform: uppercase;
}
.row-divider-about {
border: none;
border-top: 1px solid #000;
margin: 10px 0;
}
.blog-section {
width: 80%;
margin: auto;
display: flex;
gap: 20px;
margin-top:100px;
}
/* Individual blog post styling */
.blog {
flex: 1;
border-radius: 5px;
}
/* Image styling */
.blog img {
width: 100%;
height: 350px;
object-fit: cover;
border-radius: 5px;
}
/* News tag and date styling */
.blog-meta {
display: flex;
align-items: center;
margin-top: 8px;
font-size: 12px;
color: #333;
}
.blog-meta .news-tag {
background: black;
color: white;
padding: 2px 6px;
border-radius: 3px;
margin-right: 8px;
}
/* Blog title and paragraph styling */
.blog-title {
font-weight: bold;
margin: 8px 0;
}
.blog-paragraph {
font-size: 14px;
color: #555;
}
.about-section {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin: 0 auto;
gap: 50px;
}
.about-title {
font-size: 40px;
line-height: 1.2;
color: #1a1a1a; /* Replace with your desired color for normal text */
}
.about-title .highlight {
color: #f7b500; /* Replace with your desired highlight color */
}
.about-content {
flex: 1;
color: #163154;
font-size: 16px;
line-height: 1.5;
max-width: 50%;
margin-top:50px;
}
.about-content p {
margin: 0;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
font-family: 'Helvetica', sans-serif;
}
.about-products-section {
width: 80%;
margin: 0 auto;
padding: 20px 0;
}
.about-products-row {
display: flex;
justify-content: space-between;
gap: 20px;
}
.about-product-card {
flex: 1;
border: 1px solid #00274d;
border-radius: 3px;
padding: 15px;
text-align: left;
display: flex;
flex-direction: column;
}
.about-product-tag {
background-color: #00274d; /* Blue */
color: #f7b500; /* #fec52a */
padding: 5px 10px;
border-radius: 3px;
display: inline-block;
font-size: 13px;
text-transform: uppercase;
/*margin-bottom: 10px;*/
width:165px;
font-family: 'Helvetica', sans-serif;
}
.about-product-title {
font-size: 20px;
color: #1a1a1a;
margin: 10px 0;
font-family: 'Groningen-Regular', sans-serif;
}
.about-product-image {
width: 80%;
margin: 0 auto 15px auto;
display: block;
}
.about-product-description {
font-size: 14px;
line-height: 1.5;
color: #00274d;
margin-bottom: 15px;
font-family: 'Helvetica', sans-serif;
}
.about-product-button {
text-decoration: none;
background-color: #f7b500; /* #fec52a */
color: #00274d; /* Blue */
padding: 5px 15px;
border-radius: 50px;
font-size: 14px;
display: inline-flex;
align-items: center;
gap: 10px;
width: fit-content;
font-family: 'Helvetica', sans-serif;
}
.about-product-button img {
width: 30px;
height: auto;
}
.about-crafting-section {
width: 80%;
margin: 0 auto;
}
.about-crafting-heading {
font-size: 40px;
font-family: 'Groningen-Regular', sans-serif;
margin-bottom: 40px;
font-weight: normal;
}
.about-crafting-heading .highlighted-text {
color: #ffca39;
}
.about-crafting-row {
display: flex;
gap: 10px;
position: relative;
}
.about-column {
flex: 1;
position: relative;
overflow: hidden;
transition: flex 0.3s ease-in-out;
}
.about-column.active {
flex: 3; /* First column by default will be bigger */
}
.about-bg-video {
width: 100%;
height: 100%;
object-fit: cover;
}
.about-info-box {
position: absolute;
bottom: 20px;
left: 20px;
background: white;
padding: 17px;
display: none;
transition: opacity 0.3s ease;
width: 280px;
height: 70px;
}
.about-column.active .about-info-box {
display: block;
opacity: 1;
}
.div-text-about{
font-family: 'Groningen-Regular', sans-serif;
color:#08254a;
}
.team-section-about {
width: 80%;
margin: 0 auto;
}
.team-header-about {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.team-header-about h1 {
font-size: 40px;
color: #000;
margin: 0;
font-family: 'Groningen-Regular', sans-serif;
font-weight: normal;
}
.team-header-about .highlight-about {
color: #ffcc00;
}
.join-button-about {
background-color: #ffcc00;
color: #000;
border: none;
padding: 3px 12px;
font-size: 12px;
cursor: pointer;
display: flex;
align-items: center;
border-radius: 50px;
font-weight: 700;
font-family: 'Helvetica', sans-serif;
}
.arrow-icon-about {
width: 25px;
height: 25px;
margin-left: 10px;
}
.team-description-about {
font-size: 1rem;
color: #08254a;
margin-bottom: 40px;
text-align: left;
font-family: 'Helvetica', sans-serif;
width: 75%;
}
.team-row-about {
display: flex;
justify-content: space-between;
gap: 20px;
}
.team-column-about {
width: calc(25% - 20px);
text-align: left;
}
.team-image-about {
width: 100%;
border-radius: 5px;
margin-bottom: 10px;
}
.team-name-about {
font-size: 1rem;
font-weight: bold;
margin: 0;
font-family: 'Helvetica', sans-serif;
}
.team-title-about {
font-size: 0.9rem;
color: #888;
margin: 0;
font-family: 'Helvetica', sans-serif;
}
/* Main Section Styling */
/* Row with 4 Columns */
.row-section-paras {
display: flex;
justify-content: space-between;
gap: 5px; /* Gap between columns */
}
/* Column Styles */
.column-paras {
flex: 1;
display: flex;
flex-direction: column;
}
/* Image Box Styling */
.image-box-paras {
position: relative;
width: 100%;
}
.image-paras {
height: 350px; /* Image height updated */
background-size: cover;
background-position: center;
position: relative;
}
/* Black overlay for images */
.image-paras::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent);
z-index: 1;
}
/* Content over the image */
.content-paras {
position: absolute;
bottom: 20px;
left: 20px;
color: white;
z-index: 2;
}
.content-paras h3 {
color:#ffc62a;
font-size:40px;
font-family: 'Groningen-Regular', sans-serif;
margin-bottom: 0px;
font-weight: 100;
letter-spacing:1px;
}
.content-paras p {
color:#ffc62a;
font-size:17px;
font-family: 'Groningen-Regular', sans-serif;
margin-bottom: 0px;
margin-top: 0px;
}
/* Blue Box Styling */
.blue-box-paras {
background-color: #09264b;
padding: 10px;
/* width: 80%; */
/* margin-top: 5px; */
left: 50%;
/* transform: translateX(-50%); */
color: white;
font-family: 'Groningen-Regular', sans-serif;
height:100px;
}
/* Blue Box Paragraph Styling */
.blue-box-paras p {
font-size: 14px;
font-family:'Helvetica', sans-serif;
margin-top:2px;
text-align: justify;
}
/* Video Section Styling */
.video-section-paras {
margin-top: 5px;
position: relative;
}
.video-container-paras {
width: 100%;
position: relative;
}
#background-video {
width: 100%;
height: auto;
display: block;
}
.group-icon
{
height:100px;
}
.video-button-paras {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
cursor: pointer;
z-index:100;
}
.video-header-paras {
background-color: rgb(60 60 60 / 46%);
display: flex;
justify-content: center; /* center me le aaya */
position: absolute;
top: 0;
width: 100%;
left: 50%;
transform: translateX(-50%);
z-index: 2;
height: 100px;
}
.header-left-paras h2 {
font-size: 40px;
text-align: center;
font-family: 'Groningen-Regular', sans-serif;
color: white;
font-weight: 100;
margin: 30px 0; /* top bottom margin centralized look ke liye */
}
.comb{
font-family: 'Groningen-Regular', sans-serif;
font-size:17px;
text-align: center;
}
.video-footer-paras {
background-color: #09264b;
/*display: flex;*/
justify-content: space-between;
align-items: center;
padding: 10px;
color: white;
left: 50%;
/*transform: translateX(-50%);*/
}
.footer-left-paras .line-paras {
width: 80%;
height: 2px;
background-color: white;
}
/*.footer-right-paras button {*/
/* padding: 10px 20px;*/
/* background-color: white;*/
/* color: blue;*/
/* border: none;*/
/* cursor: pointer;*/
/* border-radius: 5px;*/
/*}*/
/*.footer-right-paras button:hover {*/
/* background-color: #ddd;*/
/*}*/
/* Overall Section */
.paras-home-section {
width: 80%;
margin: 0 auto;
}
/* Heading */
.paras-home-heading {
text-align: left;
font-size: 40px;
margin-bottom: 20px;
font-family: 'Groningen-Regular', sans-serif;
font-weight: 100;
color:#09264b;
margin-top:60px;
}
/* Image Box with Background Image */
.paras-home-image-box {
position: relative;
width: 100%;
background-image: url('../../assets/img/Rectangle 84.png');
background-size: cover;
background-position: center;
height: 512px;
background-position: center 65px; /* 65px नीचे की ओर शिफ्ट */
}
.paras-home-image-box::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3); /* 50% black overlay */
z-index: 1; /* Ensure it's above the image */
}
/* Small Image Box for Two Columns */
.paras-home-image-box.small {
height: 512px;
background-image: url('../../assets/img/Rectangle 199.png');
background-size: cover;
background-position: center 65px; /* 65px नीचे की ओर शिफ्ट */
}
.paras-home-image-box.small2 {
height: 512px;
background-image: url('../../assets/img/Rectangle 201.png');
background-size: cover;
background-position: center 65px; /* 65px नीचे की ओर शिफ्ट */
}
/* Header Inside Image Box */
.paras-home-header {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #09264b;
padding: 8px;
color: white;
height: 65px;
position: relative;
z-index: 2;
}
.paras-home-header-left h3 {
margin-left: 10px;
}
.paras-home-header-right img {
width: 40px;
height: auto;
}
.paras-home-header-right{
margin-right:10px;
}
.styles-delivered {
font-size: 10px;
margin-top: 5px;
}
/* Footer Content on Image */
.paras-home-footer-content {
position: absolute;
bottom: 20px;
left: 20px;
color: white;
z-index: 2;
}
.paras-home-footer-content p {
margin-bottom: 10px;
}
/* Two Column Layout */
.paras-home-row {
display: flex;
gap: 10px;
margin-top: 10px;
margin-bottom: 80px;
}
.explore-button10 {
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color:#09264b;
margin-bottom:25px;
margin-top: auto;
align-self: flex-start;
}
.explore-button10:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.explore-button11 {
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color:#08254a;
}
.explore-button11:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.paras-home-column {
flex: 1;
}
/* Heading Color */
.paras-head {
font-family: 'Groningen-Regular', sans-serif;
font-weight: 100;
font-size: 25px;
color: #ffc62a;
margin-left: 20px;
}
/* Overall Section */
.paras-news-blog-section {
width: 80%;
margin: 0 auto;
text-align: center;
}
/* Heading */
.paras-news-blog-heading {
font-size: 40px;
font-weight: 100;
margin-bottom: 30px;
font-family: 'Groningen-Regular', sans-serif;
color: #09264b;
}
/* 3 Column Layout */
.paras-news-blog-row {
display: flex;
justify-content: space-between;
gap: 30px;
}
/* Each Column */
.paras-news-blog-column {
/*width: calc(33.33% - 20px);*/
text-align: left;
display: flex;
flex-direction: column;
}
/* Image Styling */
.paras-news-blog-image {
width: 330px;
height: 240px;
object-fit: cover;
}
/* Title */
.paras-news-blog-title {
width: 330px;
font-size: 17px;
font-weight: 100;
margin-top: 10px;
font-family:'Groningen-Regular', sans-serif;
color:#09264b;
}
/* Paragraph */
.paras-news-blog-text {
width: 330px;
font-size: 14px;
margin-top: 20px;
font-family:'Helvetica', sans-serif;
color:#09264b;
}
/* Full-Width Section */
.paras-news-upper-footer {
width: 100%;
margin-top: -50px;
}
/* Background Image */
.paras-news-upper-footer-bg {
background-image: url('../../assets/img/Artboard 1 (6).jpg'); /* Change to your image */
background-size: cover;
background-position: center;
height: 265px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
/* Newsletter Heading */
.paras-news-upper-footer-title {
font-size: 30px;
font-weight: 100;
color: white;
margin-bottom: 5px;
font-family:'Groningen-Regular', sans-serif;
}
/* Paragraph Below Title */
.paras-news-upper-footer-text {
font-size: 17px;
color: white;
margin-bottom: 10px;
font-family:'Groningen-Regular', sans-serif;
}
/* Email Input Field */
.paras-news-upper-footer-input {
width: 400px;
padding: 15px;
background-color: #d7d7d7;
border: none;
text-align: center;
margin-bottom: 10px;
}
/* Placeholder Text Color */
.paras-news-upper-footer-input::placeholder {
color: black;
opacity: 0.7;
font-family:'Helvetica', sans-serif;
}
.map-container{
margin-top:80px;
}
/* Submit Button */
.paras-news-upper-footer-button {
padding: 8px 20px;
background-color: #ffc62a;
border: none;
font-size: 14px;
cursor: pointer;
}
.background-wrapper {
background-image: url('../img/Rectangle 103.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
/* Product page css */
.explore-row-text{
font-size: 40px;
color: white;
font-family:'Groningen-Bold', sans-serif;
}
/*.unique-content {*/
/* justify-content: space-between;*/
/*align-items: flex-start; */
/*text-align: left; */
/*}*/
.unique-info-section-product {
width: 80%;
margin: 0 auto; /* Center the section */
padding: 20px;
position: relative;
color: #0c284d; /* Apply font color */
margin-top: 0px;
}
.first-section-product-p{
font-size: 14px;
color: white;
font-family: 'Helvetica-Regular', sans-serif;
line-height:1.4;
}
/* Categories Heading */
.categories-heading {
text-align: left;
margin-bottom: 15px;
font-size: 40px;
font-family:'Groningen-Bold', sans-serif;
color:#08254a;
}
/* Container for Tabs & Image Section */
.product-third-section {
width: 80%;
margin: 0 auto;
padding-bottom: 20px;
}
/* Tabs Container (light grey bar) */
.tabs-container {
background-color: #f0f0f0;
height: 40px;
display: flex;
align-items: center;
padding-left: 16px;
gap: 40px;
}
/* Individual Tab */
.tab {
cursor: pointer;
color: #08254a;
padding: 0 20px;
height: 100%;
display: flex;
align-items: center;
font-family:'Groningen-Regular', sans-serif;
font-weight: 600;
}
/* Active Tab */
.tab.active {
background-color: #fff;
}
/* White Background Container for Image (with 15px padding on all sides) */
.image-wrapper-product {
background-color: #fff;
/*padding: 15px;*/
}
/* Image Background (position relative for overlay) */
.image-bg {
position: relative;
}
/* Main Image */
.main-image {
width: 100%;
height: 450px;
object-fit: cover;
display: block;
}
/* Overlay Content positioned directly on the image */
.content-overlay {
position: absolute;
left: 15px;
bottom: 15px; /* Position from top; adjust as needed */
right: 15px; /* Optionally ensure it doesn't exceed image bounds */
color: #fff;
/* Optional: add a slight text-shadow for better readability */
}
/* Overlay Title */
.content-overlay h2 {
margin: 0 0 10px;
font-size: 25px;
font-weight: 100;
font-family:'Groningen-Regular', sans-serif;
}
/* Overlay Paragraph */
.content-overlay p {
margin: 0 0 10px;
max-width: 65%;
font-family: 'Helvetica', sans-serif;
}
/* "KNOW MORE" Button */
.know-more-button {
background-color: #ffc62a;
border: none;
padding: 10px 20px;
font-size: 12px;
font-weight: 100;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
}
/* Outer Wrapper for the entire carousel section */
.product-fourthsection {
width: 100%;
position: relative;
display: flex;
align-items: center;
justify-content: center;
margin: 40px 0; /* Spacing above/below section */
}
/* Left/Right Arrows (Outside the 80% container) */
.arrow {
width: 40px; /* Adjust as needed for your arrow icon size */
height: 40px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
z-index: 2; /* So they appear above carousel items */
}
.arrow-left {
margin-right: 10px; /* Some spacing between arrow and carousel container */
}
.arrow-right {
margin-left: 10px;
}
/* 80% container for the carousel */
.carousel-container {
width: 80%;
overflow: hidden; /* Hide overflow so only 3 boxes show at a time */
position: relative;
}
/* The track that holds all the boxes */
.carousel-track {
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
gap: 20px;
transform: none !important; /* Disable any JS transform */
}
.carousel-top-heading {
font-size:24px;
color: #1d3557;
margin-bottom: 10px;
font-family:'Groningen-Bold', sans-serif;
}
.carousel-box-wrapper {
flex: 1 1 22%;
text-align: center;
}
/* Each box */
.carousel-box {
flex: 1 1 22%; /* 4 boxes fit in 100% (including gap) */
min-width: 0;
background-color: #002f61; /* Blue background */
border-radius: 20px;
padding: 20px;
text-align: center;
box-sizing: border-box;
}
/* The heading inside each box (#fec52a color) */
.carousel-box h3 {
color: #ffcc00; /* #fec52a color */
font-size: 40px;
margin-bottom: 10px;
font-family:'Groningen-Bold', sans-serif;
margin-top: 10px;
}
/* Subtitle (Units, Bags Per Month, etc.) */
.carousel-box .subtitle {
font-size: 24px;
margin-bottom: 10px;
text-align: center;
font-family:'Groningen-Regular', sans-serif;
color:white;
margin-top: -10px;
}
/* Description paragraph */
.carousel-box .description {
font-size: 14px;
line-height: 1.4;
font-family: 'Helvetica', sans-serif;
color:white;
}
.product-video-section {
width: 100%;
position: relative;
overflow: hidden;
background-color: #000;
margin-bottom:80px;
}
/* Reduced video height to half (50vh) */
.product-video-element {
width: 100%;
height: 100vh;
object-fit: cover;
display: block;
cursor: pointer;
}
/* Overlay container remains centered */
.product-video-overlay {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.product-video-play-icon {
width: 64px;
height: 64px;
cursor: pointer;
margin-bottom: 10px;
}
.product-video-watch-heading {
margin: 0 0 5px;
font-size: 24px;
font-weight: 600;
}
.product-video-paragraph {
margin: 0;
font-size: 14px;
line-height: 1.2;
}
/* Outer Section Container */
.sixthproductsection {
width: 100%;
display: flex;
justify-content: center;
margin: 40px 0; /* Adjust vertical spacing as needed */
}
/* 80% inner container */
.sixthproductsection-container {
width: 80%;
}
/* Section Heading (left aligned) */
.sixthproductsection-heading {
text-align: left;
font-size: 30px;
margin-bottom: 10px;
font-family:'Groningen-Regular', sans-serif;
color:#002f61;
font-weight:100;
}
/* #fec52a Line (80% width, 2px height) */
.sixthproductsection-#fec52a-line {
width: 100%;
height: 5px;
background-color: #ffc62a;
margin-bottom: 20px;
}
/* Gap of 20px */
.sixthproductsection-gap20 {
height: 20px;
}
/* Row: 3 columns per row */
.sixthproductsection-row {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}
/* Column: each column is centered */
.sixthproductsection-column {
flex: 1;
text-align: center;
padding: 10px;
box-sizing: border-box;
}
/* Ensure gap of 50px between columns */
.sixthproductsection-column:not(:last-child) {
margin-right: 50px;
}
/* Icon Image Styling */
.sixthproductsection-icon {
max-width: 100%;
height: auto;
}
/* Gap of 10px between elements inside each column */
.sixthproductsection-gap10 {
height: 10px;
}
/* Column Heading */
.sixthproductsection-column-heading {
font-size: 18px;
margin: 0;
font-family:'Groningen-Bold', sans-serif;
color:#002f61;
}
/* Column Paragraph */
.sixthproductsection-column-paragraph {
font-size: 14px;
margin: 0;
font-family: 'Helvetica', sans-serif;
color:#002f61;
}
/* Outer Section Container (full width, centered inner container at 80%) */
.nw-gallery-bag-section {
width: 100%;
padding: 40px 0;
display: flex;
justify-content: center;
margin-bottom:20px;
}
.nw-gallery-bag-container {
width: 80%;
max-width: 1200px;
}
.nw-gallery-bag-heading {
text-align: center;
font-size: 40px;
font-family:'Groningen-Bold', sans-serif;
color: #002f61;
margin-bottom: 20px;
}
.nw-gallery-bag-swiper {
width: 100%;
overflow: hidden;
}
.nw-gallery-bag-swiper .swiper-wrapper {
display: flex;
}
.nw-gallery-bag-swiper .swiper-slide {
flex-shrink: 0;
width: 400px !important;
height: 300px !important;
margin-right: 10px;
}
.nw-gallery-bag-image {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 5px;
}
/* Section Container (Full width, centered 80% content) */
.eightsectionproduct {
width: 100%;
margin: 40px 0;
position: relative;
}
.eightsectionproduct-container {
width: 80%;
margin: 0 auto;
}
/* Heading Row (80% container) */
.eightsectionproduct-heading-row {
display: flex;
justify-content: space-between;
align-items: center;
}
.testimonial-heading, .testimonial-trust {
font-size: 24px;
font-weight: bold;
}
.testimonial-heading {
text-align: left;
font-size: 30px;
margin-bottom: 10px;
font-family: 'Groningen-Regular', sans-serif;
color: #002f61;
font-weight: 100;
}
.testimonial-trust {
text-align: right;
color: #555;
font-family: 'Helvetica', sans-serif;
font-weight:100;
}
.gap20 {
height: 20px;
}
/* Slider Container (80% width) */
.testimonial-slider-container {
width: 100%;
margin: 0 auto;
overflow: hidden;
}
.testimonial-slider {
display: flex;
gap: 25px;
transition: transform 0.5s ease;
}
/* Testimonial Box */
.testimonial-box {
background-color: #002f61;
padding: 20px;
color: #fff;
/* 3 boxes visible with 2 gaps of 25px */
min-width: calc((100% - 50px) / 3);
box-sizing: border-box;
}
/* White Line */
.white-line {
width: 100%;
height: 2px;
background-color: #fff;
}
/* Rating Block */
.rating-block {
margin-top: 10px;
}
.rating-row {
display: flex;
align-items: center;
gap: 5px;
}
.stars {
color: #ffcc00;
font-size: 18px;
white-space: nowrap;
}
.testimonial-user {
display: flex;
align-items: center;
}
.user-img {
width: 40px;
height: 40px;
border-radius: 50%;
object-fit: cover;
}
/* User name below rating row */
.user-name {
font-size: 14px;
text-align: left;
margin-top: 5px;
}
/* Testimonial Text */
.testimonial-text {
font-size: 16px;
line-height: 1.4;
}
/* Arrows Container: Positioned outside the 80% container */
.slider-arrows {
position: absolute;
top: 50%;
width: 100%;
transform: translateY(-50%);
display: flex;
justify-content: space-between;
pointer-events: none; /* Allow clicks to pass to arrow divs only */
}
.slider-arrows .arrow {
width: 40px;
height: 40px;
cursor: pointer;
pointer-events: all; /* Enable clicking on arrows */
margin-left: 70px;
}
.slider-arrows .arrow img {
width: 100%;
height: 100%;
object-fit: contain;
margin-right: 70px;
}
/* Overall Section */
.ninthsectionproduct {
width: 100%;
display: flex;
justify-content: center;
margin: 40px 0;
}
.ninthsectionproduct-container {
width: 80%;
}
/* Heading Row */
.ninth-heading-row {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.ninth-heading-left {
text-align: left;
font-size: 40px;
margin-bottom: 10px;
font-family: 'Groningen-Bold', sans-serif;
color: white;
}
.ninth-heading-right {
text-align: left;
font-size: 30px;
margin-bottom: 10px;
font-family: 'Groningen-Bold', sans-serif;
color: #ffc62a;
}
/* Accordion Container */
.accordion-container {
display: flex;
flex-direction: column;
gap: 3px; /* 5px gap between accordion items */
}
/* Accordion Item */
.accordion-item {
background-color: #f0f0f0; /* light grey background when closed */
width: 100%;
border: 1px solid #ddd;
box-sizing: border-box;
transition: background-color 0.3s, color 0.3s;
color: black; /* default text color */
}
.accordion-item.active {
background-color: #888; /* dark grey when open */
color: white; /* text color white when open */
}
/* Accordion Header */
.accordion-header {
padding: 20px 20px;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
background: #d7d7d7;
}
.accordion-title {
font-size: 14px;
font-family: 'Helvetica-Regular', sans-serif;
color:#08254a;
}
.accordin-para {
font-size:14px;
font-family: 'Helvetica-Regular', sans-serif;
text-align:left;
}
.accordion-icon {
font-size: 18px;
color: #707070; /* default plus icon color */
}
.accordion-item.active .accordion-icon {
color: #ffc62a; /* minus icon color when open */
}
/* Accordion Content */
.accordion-content {
padding: 10px 20px;
display: none;
background:#707070;
}
.accordion-item.active .accordion-content {
display: block;
}
.accordion-item.active .accordion-header {
background: #707070; /* Dark grey background */
}
.accordion-item.active .accordion-title {
color: white !important; /* White text only when open */
}
/* BAGS PAGE CSS */
/* Naya wrapper inside button-container */
.explore-row-new {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
}
/* Left aligned text */
.explore-text {
font-size: 40px; /* adjust as needed */
font-weight: 100;
color: #ffc62a;
text-shadow: 1px 1px 3px rgba(0,0,0,0.6);
font-family: 'Groningen-Regular', sans-serif;
}
/* Right aligned icon container */
.explore-icon {
text-align: right;
}
.explore-icon img {
width: 65px; /* adjust size as needed */
height: auto;
}
/* Left Column */
.secondsectionbag-left {
flex: 1;
/* Customize font family or additional styling if required */
}
.ssb-heading {
margin: 0;
font-size: 40px;
font-family: 'Groningen-Regular', sans-serif;
font-weight:600;
color:#08254a;
}
.ssb-subheading {
font-size: 24px;
margin: 0;
font-family: 'Groningen-Regular', sans-serif;
color:#707070;
}
.ssb-paragraph {
font-size: 16px;
line-height: 1.5;
margin: 0;
width:65%;
color:#08254a;
font-family: 'Helvetica-Regular', sans-serif;
}
/* Gap classes */
.ssb-gap20 { height: 5px; }
.ssb-gap30 { height: 15px; }
.ssb-gap15 { height: 5px; }
.ssb-gap40 { height: 30px; }
/* Know More Button */
/* Right Column */
.secondsectionbag-right {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
}
.ssb-image {
width: 100%;
height: auto;
object-fit: cover;
}
/* Overall Section */
.thirdsectionbag-section {
width: 100%;
}
.thirdsectionbag-container {
margin: 0 auto;
background-color: #08254a;
padding: 40px 0;
display: flex;
flex-direction: column;
align-items: center;
}
/* Headings */
.thirdsectionbag-headings {
text-align: center;
margin-bottom: 20px;
}
.thirdsectionbag-heading {
color: #90949b;
font-size: 60px;
margin: 0;
font-family: 'Groningen-Light', sans-serif;
font-weight:100;
}
.thirdsectionbag-subheading {
color: #ffc62a;
font-size: 24px;
margin: 10px 0 0 0;
font-family: 'Groningen-Bold', sans-serif;
font-weight:100;
}
/* Video Wrapper */
.thirdsectionbag-video-wrapper {
position: relative;
width: 100%;
height: 100vh; /* Full screen height */
overflow: hidden;
}
.thirdsectionbag-video {
width: 100%;
height: 100vh; /* Full screen height */
object-fit: cover; /* Video ko stretch hone se bachane ke liye */
display: block;
}
.thirdsectionbag-video-overlay {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
cursor: pointer;
}
.thirdsectionbag-play-button {
width: 64px;
height: 64px;
}
/* Bottom Gap */
.thirdsectionbag-gap-bottom {
height: 20px;
}
/* Overall Section (80% width, centered) */
.fifthsectionbag {
width: 100%;
display: flex;
justify-content: center;
margin: 30px 0;
}
.fifthsectionbag-container {
width: 80%;
}
/* Heading & Paragraphs */
.fifthsectionbag-mainheading {
font-size: 40px;
text-align: left;
margin: 0;
font-family: 'Groningen-Bold', sans-serif;
color:#002f61;
}
.fifthsectionbag-gap10 {
height: 10px;
}
.fifthsectionbag-paragraph {
font-size: 14px;
line-height: 1.5;
margin: 0;
font-family: 'Helvetica', sans-serif;
font-weight:100;
color:#002f61;
}
/* Two Column Layout: NO gap */
.fifthsectionbag-twocolumn {
display: flex;
margin-top: 10px;
height:500px;
}
/* Left Column (#fec52a background) */
.fifthsectionbag-leftcol {
background-color: #ffcc00; /* #fec52a */
flex: 1;
padding: 20px;
box-sizing: border-box;
}
/* Accordion Items */
.fifthsectionbag-accordion-item {
padding: 15px 0;
cursor: pointer;
position: relative;
border-top: 3px solid transparent; /* We'll change to blue when active */
transition: border-color 0.3s;
}
.fifthsectionbag-accordion-header {
display: flex;
justify-content: space-between;
/* Align items at the top line so heading & list start at same baseline */
align-items: flex-start;
}
.fifthsectionbag-title-plus {
display: flex;
align-items: baseline; /* or flex-start; ensures heading & icon align well */
gap: 8px;
}
.fifthsectionbag-accordion-title {
font-size: 24px;
color: #002f61; /* default color */
transition: color 0.3s;
font-family: 'Groningen-Bold', sans-serif;
}
.fifthsectionbag-accordion-icon {
font-size: 24px;
color: white; /* plus sign color */
transition: color 0.3s, transform 0.3s;
}
/* Right-aligned list items (hidden by default, each on a new line) */
.fifthsectionbag-accordion-list {
display: none;
font-size: 14px;
color: #707070;
text-align: right;
margin: 0; /* remove default margin */
padding: 0; /* remove default padding */
}
.fifthsectionbag-accordion-list span {
display: block; /* each item on its own line */
}
/* Active/Opened State */
.fifthsectionbag-accordion-item.active {
border-top: 1px solid #002f61;
}
.fifthsectionbag-accordion-item.active .fifthsectionbag-accordion-title {
color: white; /* Title becomes white */
}
.fifthsectionbag-accordion-item.active .fifthsectionbag-accordion-icon {
color: #002f61; /* Icon becomes black */
transform: rotate(45deg); /* plus to cross */
}
.fifthsectionbag-accordion-item.active .fifthsectionbag-accordion-list {
display: block; /* show each item on new line */
}
/* "Know More" Button */
.fifthsectionbag-knowmore-btn {
background-color: #002f61;
border: none;
padding: 10px 20px;
font-size: 12px;
font-weight: 100;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica', sans-serif;
color:white;
margin-top: 90px;
}
/* Right Column */
.fifthsectionbag-rightcol {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
}
/* Image wrapper for border + padding */
.fifthsectionbag-image-wrapper {
width: 100%;
height: 100%;
border: 5px solid #ccc;/* 2px grey border */
box-sizing: border-box;/* ensures padding + border included in total size */
display: flex; /* so the image can fill wrapper */
}
/* The actual image */
.fifthsectionbag-rightimage {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
/* Outer Wrapper */
.sixthsectionbag {
width: 100%;
margin: 40px 0;
position: relative;
font-family: 'Helvetica', sans-serif;
}
/* Carousel Wrapper (80% width, centered, no wrapping) */
.sixthsectionbag-carousel-wrapper {
width: 80%;
margin: 0 auto;
overflow: hidden;
/*display: flex;*/
/*flex-wrap: nowrap;*/
transition: transform 0.5s ease;
}
/* Carousel Container */
.sixthsectionbag-carousel {
display: flex;
flex-wrap: nowrap;
}
/* Each Slide occupies 100% of the carousel wrapper */
.sixthsectionbag-slide {
min-width: 100%;
box-sizing: border-box;
padding: 0 10px;
display: flex;
flex-direction: column;
}
.sixthsectionbag-innercontainer {
width: 100%;
}
/* Heading & Paragraph */
.sixthsectionbag-heading-right {
text-align: left;
font-size: 40px;
margin: 0 0 10px 0;
color: #002f61;
font-family: 'Groningen-Regular', sans-serif;
font-weight:600;
}
.sixthsectionbag-paragraph {
font-size: 16px;
line-height: 1.4;
margin: 0 0 20px 0;
color: #002f61;
font-family: 'Helvetica', sans-serif;
}
/* Two-column container (no gap between columns) */
.sixthsectionbag-twocol {
display: flex;
margin-top: 70px;
height:500px;
}
.sixthsectionbag-leftcol,
.sixthsectionbag-rightcol {
flex: 1;
}
.sixthsectionbag-rightcol {
background-color: #ffcc00;
color: #002f61;
display: flex;
flex-direction: column;
padding: 20px;
box-sizing: border-box;
}
/* Image Wrapper: 3px padding inside a 2px grey border */
.sixthsectionbag-imagewrapper {
width: 100%;
height: 100%;
border: 5px solid #ccc;
box-sizing: border-box;
display: flex;
}
.sixthsectionbag-img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
/* Gaps */
.sixthsectionbag-gap30 { height: 30px; }
.sixthsectionbag-gap20 { height: 20px; }
.sixthsectionbag-gap50 { height: 50px; }
/* Subheadings & Subparagraphs */
.sixthsectionbag-subheading {
font-size: 14px;
margin: 0;
color: #08254a;
font-family: 'Helvetica-Bold', sans-serif;
}
.sixthsectionbag-subparagraph {
font-size: 14px;
line-height: 1.4;
margin: 0;
color: #002f61;
font-family: 'Helvetica-Regular', sans-serif;
}
.sixthsectionbag-submainheading{
font-size: 24px;
font-family: 'Groningen-Bold', sans-serif;
color:#08254a;
margin-top:20px;
}
/* KNOW MORE Button */
/* Arrow Icons Wrapper: Positioned relative to the carousel wrapper */
.sixthsectionbag-carousel-wrapper-arrows {
width: 85%;
margin: 0 auto;
position: absolute;
top: 60%;
left: 0;
right: 0;
transform: translateY(-50%);
display: flex;
justify-content: space-between;
pointer-events: none;
}
.sixthsectionbag-arrow {
width: 40px;
height: 40px;
cursor: pointer;
pointer-events: all;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
}
.sixthsectionbag-arrow img {
width: 100%;
height: 100%;
object-fit: contain;
}
/* Outer Section - full width, light grey background */
.seventhsectionbag-bg {
width: 100%;
margin-top:70px;
}
/* Inner container: 80% width, centered */
.seventhsectionbag-container {
width: 80%;
margin: 0 auto;
box-sizing: border-box;
}
/* Heading */
.seventhsectionbag-heading {
text-align: left;
font-size: 40px;
color: #002f61;
font-family: 'Groningen-Bold', sans-serif;
margin: 0;
}
/* Paragraph */
.seventhsectionbag-paragraph {
width: 100%;
font-size: 14px;
color: #002f61;
font-family: 'Helvetica-Regular', sans-serif;
line-height:1.4;
margin: 10px 0 0 0;
}
/* 30px Gap */
.seventhsectionbag-gap30 {
/*height: 30px;*/
}
/* Row of images */
.seventhsectionbag-images-row {
display: flex;
gap: 5px;
margin-top:35px;
}
/* Each image column */
.seventhsectionbag-image-col {
flex: 1;
display: flex;
flex-direction: column;
}
/* Image wrapper: 250px height, with 3px padding inside a 2px border */
.seventhsectionbag-image-wrapper {
position: relative;
width: 100%;
height: 300px;
/*padding: 3px;*/
/*border: 2px solid #ccc;*/
box-sizing: border-box;
overflow: hidden;
}
.seventhsectionbag-img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
/*opacity:0.8;*/
}
/* Overlay on image: black with slight opacity */
.seventhsectionbag-overlay {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 40px; /* Fixed height for footer strip */
background-color: #002f61; /* Blue strip */
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
border-radius: 0; /* Optional: remove if you want square footer */
padding: 0;
}
/* Heading on overlay */
.seventhsectionbag-img-heading {
color: #ffcc00;
font-family: 'Groningen-Bold', sans-serif;
font-size: 18px;
background: none;
padding: 0;
border-radius: 0;
}
/* Blue box below image */
.seventhsectionbag-bluebox {
width: 100%;
background-color: #002f61; /* blue */
padding: 13px;
box-sizing: border-box;
height:225px;
}
.seventhsectionbag-bluebox-text {
color: #fff;
font-family: 'Helvetica-Regular', sans-serif;
line-height: 1.3;
margin: 0;
font-size: 14px;
}
/* who we are page css start*/
/* Welcome Text */
.welcome-text.who-we-are-banner-section {
font-size: 40px;
color: white;
font-family: 'Groningen-Regular', sans-serif;
margin-bottom: 40px;
}
.beyond-text.who-we-are-banner-section {
display: block;
color: #ffd013;
}
/* Who We Are Banner Section */
.video-section.who-we-are-banner-section {
position: relative;
height: 550px; /* Ensure this is your desired banner height */
width: 100%;
overflow: hidden; /* Prevents overflow */
}
.video-overlay.who-we-are-banner-section {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
z-index: 1;
}
.bg-image.who-we-are-banner-section {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 100%; /* Ensures it covers the full width */
height: 100%; /* Ensures it takes the full height of the section */
object-fit: cover; /* Fits the image within the given height and width */
z-index: -1;
}
.bottom-content.who-we-are-banner-section {
position: absolute;
bottom: 30px;
left: 10%;
width: 80%;
display: flex;
flex-direction: column;
align-items: flex-start;
z-index: 2;
}
.who-we-are-second-section {
/*width: 100%;*/
margin: 0 auto;
text-align: left;
padding: 20px 0;
}
.intro-text.who-we-are-second-section {
font-size: 16px;
color: #1d3557;
line-height: 1.3;
font-family: 'Helvetica', sans-serif;
text-align: justify;
}
.about-heading.who-we-are-second-section {
font-size: 32px;
font-weight: bold;
margin-top: 20px;
}
.about-text.who-we-are-second-section {
color: #1d3557; /* Blue */
font-size:50px;
font-family: 'Groningen-Regular', sans-serif;
}
.us-text.who-we-are-second-section {
color: #ffcc00; /* #fec52a */
font-size:50px;
font-family: 'Groningen-Regular', sans-serif;
}
.content-text.who-we-are-second-section {
font-size: 30px;
/*line-height: 1.6;*/
color: #457b9d; /* Light Blue */
font-family: 'Groningen-Bold', sans-serif;
margin-top:50px;
}
.bold-text {
font-weight: bold;
color: #1d3557; /* Dark Blue */
font-family: 'Groningen-Bold', sans-serif;
}
.highlight-text {
font-weight: normal;
color: #457b9d; /* Light Blue */
}
.who-we-are-third-section {
background-color: #08254a; /* नीला बैकग्राउंड */
}
.content-container.who-we-are-third-section {
display: flex;
justify-content: space-between;
width: 80%;
margin: 20px auto;
text-align: left;
}
/* Left column */
.left-column.who-we-are-third-section, .right-column.who-we-are-third-section {
width: 25%;
font-size: 12px;
color: white;
font-family: 'Helvetica', sans-serif;
}
/* Center column for main heading */
.center-column.who-we-are-third-section {
width: 50%;
text-align: center;
}
.center-column.who-we-are-third-section h1 {
font-size: 40px;
margin: 20px;
font-weight: normal;
color: #ffc62a;
font-family: 'Groningen-Regular', sans-serif;
}
.center-column.who-we-are-third-section h3 {
font-size: 36px;
margin-top: 10px;
color: white !important;
font-weight: 100;
font-family: system-ui;
}
.left-column.who-we-are-third-section p {
margin-top: 120px;
margin-left: -100px;
}
/* Right column text */
.right-column.who-we-are-third-section {
text-align: left;
}
/* Full-width video section */
.video-container.who-we-are-third-section {
width: 100%;
height: 600px;
position: relative;
overflow: hidden;
}
.background-video.who-we-are-third-section {
position: absolute;
top: 50%;
left: 50%;
width: 95%;
height: 100vh;
object-fit: cover;
transform: translate(-50%, -50%);
z-index: 1;
}
.video-button-paras.who-we-are-third-section {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
cursor: pointer;
z-index: 100;
}
.explore-button9.who-we-are-third-section {
background: #ffc62a;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
margin-top: 120px;
float: right;
margin-right: -100px;
}
.explore-button9.who-we-are-third-section:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.video-button-paras.who-we-are-third-section {
background: none !important; /* बैकग्राउंड हटाने के लिए */
}
/* Ensure the section is 80% width */
.who-we-are-forth-section {
/*width: 80%;*/
margin-top:50px;
text-align: left; /* Everything aligned to left */
font-family: 'Helvetica', sans-serif;
}
/* Small heading - Crafting Legacy */
.crafting-legacy {
font-size: 30px;
color: #08254a;
margin-bottom:0px;
font-family: 'Groningen-Bold', sans-serif;
}
/* Big heading - Journey */
.journey-heading {
font-size: 40px;
color: #ffc62a;
margin-top: 0px;
margin-bottom:0px;
font-family: 'Groningen-Bold', sans-serif;
}
/* Paragraph below Journey */
.journey-text,
.requirements-text {
font-size: 16px;
color: #08254a;
line-height: 1.6;
margin-top:0px;
font-family: 'Helvetica-Regular', sans-serif;
}
/* SVG Icons Wrapper */
.icon-row {
display: flex;
justify-content: space-between;
margin: 20px 0;
width: 100%;
}
/* Individual Icon Styling */
.icon {
width: 50px;
height: 50px;
}
/* Three Columns Layout for Icons */
.icon-row .icon-box {
width: 33.33%;
display: flex;
justify-content: center;
}
/* Left icon align */
.icon-row .icon-box:first-child {
justify-content: flex-start;
}
/* Center icon align */
.icon-row .icon-box:nth-child(2) {
justify-content: center;
}
/* Right icon align */
.icon-row .icon-box:last-child {
justify-content: flex-end;
}
/* The Go-To Heading */
.go-to-heading {
font-size: 40px;
color: #08254a;
text-align: left;
margin-top: 0px;
margin-bottom: 0px;
font-family: 'Groningen-Bold', sans-serif;
}
/* Stats Section */
.stats-container {
display: flex;
justify-content: space-between;
margin-top: 20px;
}
/* Each stat box */
/* Number Heading */
.stat-number {
font-size: 40px;
margin-top: 0px;
color: #ffc62a;
margin-bottom: 10px;
font-family: 'Groningen-Bold', sans-serif;
}
/* Stats Text */
.stat-text {
font-size: 16px;
color: #08254a;
line-height: 1.3;
font-family: 'Helvetica-Regular', sans-serif;
margin-top:0px;
}
.who-we-are-forth-section1{
margin-top:0px;
}
.who-we-are-fifth-section {
position: relative;
width: 100%;
display: flex;
flex-direction: column;
min-height: 60vh;
margin-bottom: 50px;
}
.background-image {
background: url('../../assets/img/Rectangle 766.png') no-repeat bottom center/cover;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.content {
display: flex;
justify-content: space-between;
align-items: center;
width: 80%;
margin: auto;
}
.heading {
font-size: 40px;
color: #ffc62a;
font-family: 'Groningen-Bold', sans-serif;
text-align: left;
}
.meet-the-team {
background: #ffc62a;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
}
.meet-the-team:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.full-width-image {
width: 80%;
margin: 30px auto;
display: block;
margin-top:0px;
}
.#fec52a-line {
width: 100%;
height: 1px;
background: #ffc62a;
margin-top: 30px;
}
.facility-section {
display: flex;
justify-content: space-between;
align-items: center;
width: 80%;
margin: 30px auto;
margin-bottom:0px;
margin-top:0px;
}
.know-more {
background: #ffc62a;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
}
.know-more:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.facility-boxes {
display: flex;
justify-content: space-between;
width: 80%;
margin: 50px auto;
gap: 20px;
margin-top:0px;
}
.facility-box {
width: 32%;
height: 250px;
border: 1px solid white;
display: flex;
align-items: flex-start;
padding: 20px;
}
.facility-box:nth-child(1) {
background: url('../../assets/img/Path 10165.png') no-repeat center center/cover;
}
.facility-box:nth-child(2) {
background: url('../../assets/img/Path -1.png') no-repeat center center/cover;
}
.facility-box:nth-child(3) {
background: url('../../assets/img/Path -2.png') no-repeat center center/cover;
}
.box-content {
text-align: left;
color: white;
}
.box-content h3 {
font-size: 40px;
color: #ffc62a;
font-family: 'Groningen-Bold', sans-serif;
margin-bottom: 0px;
}
.box-content p{
font-family: 'Helvetica-Regular', sans-serif;
font-size:16px;
}
/* Full-Width Section */
.paras-news-upper-footer-who-we-are {
width: 100%;
}
/* Background Image */
.paras-news-upper-footer-bg-who-we-are {
background-image: url('../../assets/img/Rectangle 198.png'); /* Change to your image */
background-size: cover;
background-position: center;
height: 265px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
/* Newsletter Heading */
.paras-news-upper-footer-title-who-we-are {
font-size: 30px;
font-weight: 100;
color: white;
margin-bottom: 5px;
font-family:'Groningen-Regular', sans-serif;
}
/* Paragraph Below Title */
.paras-news-upper-footer-text-who-we-are {
font-size: 17px;
color: white;
margin-bottom: 10px;
font-family:'Groningen-Regular', sans-serif;
}
/* Email Input Field */
.paras-news-upper-footer-input-who-we-are {
width: 400px;
padding: 15px;
background-color: #d7d7d7;
border: none;
text-align: center;
margin-bottom: 10px;
}
/* Placeholder Text Color */
.paras-news-upper-footer-input-who-we-are::placeholder {
color: black;
opacity: 0.7;
font-family:'Helvetica', sans-serif;
}
/* leadership css start */
.video-section.leadership-banner-section {
position: relative;
width: 100%;
overflow: hidden;
}
.video-overlay.leadership-banner-section {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
z-index: 2;
}
.img-wrapper {
position: absolute;
top: 0px; /* 👈 yeh value increase karke face laa sakte ho neeche */
left: 0;
width: 100%;
height: auto;
z-index: 1;
}
.img-wrapper img {
width: 100%;
height: 550px;
object-fit: cover;
}
.bottom-content.leadership-banner-section {
position: absolute;
bottom: 30px;
left: 10%;
width: 80%;
display: flex;
flex-direction: column;
align-items: flex-start;
z-index: 2;
}
/* leadership css end */
.welcome-text.leadership-banner-section {
font-size: 40px;
color: white;
font-family: 'Groningen-Regular', sans-serif;
margin-bottom: 40px;
}
.leadership-second-section {
/*width: 100%;*/
margin: 0 auto;
text-align: left;
padding: 20px 0;
}
.content-text.leadership-second-section {
font-size: 16px;
line-height: 1.3;
color: #08254a;
font-family: 'Helvetica', sans-serif;
text-align:justify;
}
.team-headingg.leadership-second-section {
font-size: 40px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
}
.bold-text-leadership {
font-weight: bold;
color: white; /* Dark Blue */
font-family: 'Groningen-Bold', sans-serif;
}
.leadership-second-section2 {
width: 80%;
margin: 0 auto;
text-align: left;
background-color: white; /* White background added */
position: relative;
margin-top:50px;
}
.team-heading {
font-size: 40px;
color: #08254a;
margin-bottom: 20px;
text-align: left;
position: absolute;
top: -100px;
left: 0;
font-family: 'Groningen-Bold', sans-serif;
}
.svg-icon-team
{
stroke: #75736e !important;
width: 25px;
height: 25px;
}
.team-row {
display: flex;
/*justify-content: space-between;*/
flex-wrap: wrap;
padding: 0px 0;
}
.team-row-last
{
margin-bottom: 50px;
display: flex;
/* justify-content: space-between; */
flex-wrap: wrap;
padding: 0px 0px;
}
.team-column {
width: 33%;
padding: 5px;
box-sizing: border-box;
}
.team-image {
width: calc(104% - 10px); /* Image width adjusted for padding */
height: auto;
border-radius: 5px;
padding: 3px; /* Uniform padding around images */
}
.team-image1 {
width: calc(100% - 10px); /* Image width adjusted for padding */
height: 555px;
border-radius: 5px;
padding: 5px; /* Uniform padding around images */
}
.team-image2 {
width: calc(100% - 10px); /* Image width adjusted for padding */
height: 485px;
border-radius: 5px;
padding: 5px; /* Uniform padding around images */
}
.team-name {
font-size: 20px;
color: #fbc531;
margin-top: 10px;
margin-left: 5px;
}
.team-position {
font-size: 16px;
color: #08254a;
margin-bottom: 5px;
margin-left: 5px;
margin-top: -15px;
}
.team-underline {
width: 40%;
border-top: 2px solid #fbc531; /* Proper underline */
margin-bottom: 10px;
margin-left: 5px;
margin-top: 10px;
}
.team-description {
font-size: 14px;
color: #555;
margin-left: 5px;
}
.team-connect {
font-size: 14px;
font-weight: bold;
margin-top: 10px;
}
/* LinkedIn Button Alignment */
.linkedin-button {
display: flex;
align-items: center;
justify-content: center;
width: 100%; /* 👈 Full width */
height: 50px; /* 👈 Button height */
background-color: #08254a;
border-radius: 50px;
text-decoration: none;
margin-top: 10px;
}
.linkedin-button svg {
width: 24px;
height: 24px;
fill: white;
}
/* 7th Member Left Align */
.single-member {
width: 30%; /* Same width */
margin-left: 0; /* Align to left */
display: flex;
flex-direction: column;
align-items: flex-start;
padding: 5px;
margin-bottom: 20px;
}
/* Global Presence css start */
.facilities-fourth-team
{
width: 80%;
margin: auto;
text-align: center;
position: relative;
padding: 0px 0px 60px 0px;
margin-top: 100px;
}
.facilities-para
{
position: absolute;
left: 76%;
top: -8%;
font-size: 25px;
width: 300px;
}
.facilities-team-head{
font-size: 40px;
letter-spacing: 1px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
margin-bottom:10px;
}
.facilities-team-head-3{
font-size: 30px;
letter-spacing: 1px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
margin-top: 50px;
}
.facilities-team-para
{
text-align: left;
width: 400px;
margin: 10px 0;
font-family: 'Groningen-Bold', sans-serif;
font-size: 16px;
line-height: 1.4;
color: #08254a;
}
.facilities-team-para1
{
text-align: left;
width: 700px;
margin: 10px 0;
font-family: 'Helvetica', sans-serif;
font-size: 16px;
line-height: 20px;
color: #08254a;
}
.facilities-team-image {
max-width: 100%;
height: 220px;
position: relative;
left: -60px; /* Pura left align */
}
.facilities-team-image1 {
max-width: 90%;
height: 180px;
position: absolute;
left: 30%;
top: 70%;
z-index: 1;
}
.facilities-second-img {
display: flex;
align-items: flex-start;
position: relative;
}
.facility-nine-section {
margin: 50px auto 0;
text-align: left;
}
.key-heading {
font-size: 40px;
color: #08254a;
/*margin-bottom: 20px;*/
width: 80%;
font-family: 'Groningen-Bold', sans-serif;
}
.key-stats-container {
display: flex;
justify-content: space-between;
gap: 20px;
width: 80%;
margin-top: 0px;
}
.key-stat-box {
background-color: #08254a;
color: white;
flex: 1;
padding: 30px;
text-align: left;
position: relative;
height: 300px; /* Increased height */
}
.key-stat-number {
font-size: 40px;
margin-top: 30px;
color: #ffc107; /* Yellow color */
font-family: 'Groningen-Bold', sans-serif;
}
.key-stat-number-span {
font-size: 24px;
margin-top: 30px;
color: white; /* Yellow color */
font-family: 'Groningen-Bold', sans-serif;
}
.key-stat-text {
font-size: 16px;
margin-top: 10px;
margin-bottom: 100px; /* Added 100px margin below text */
font-family: 'Helvetica-Regular', sans-serif;
color:#707070;
}
.key-stat-line {
width: 20%;
height: 1px;
background-color: white;
position: absolute;
bottom: 50px;
left: 10%;
}
@media (max-width: 768px) {
.key-stats-container {
flex-direction: column;
}
}
.global-hr1
{
position: relative;
top: 40px;
width: 100px;
right: 36%;
}
.global-heading
{
font-size: 40px;
color: #1d3557;
font-family: 'Groningen-Bold', sans-serif;
text-align: left;
}
.global-box-content h2
{
font-size: 20px;
color: #1d3557;
font-family: 'Groningen-Bold', sans-serif;
margin-bottom: 0px;
}
.global-last-sec
{
text-align: center;
}
.global-presence-new {
position: relative;
width: 100%;
min-height: 100vh; /* Viewport की पूरी height */
display: flex;
flex-direction: column;
justify-content: center; /* Center में लाने के लिए */
align-items: center;
background: url('../../assets/img/Group 1778 (1).png') no-repeat center center;
background-size: cover;
}
/* Ensuring Content Stays Properly Positioned */
.global-presence-new .content-wrapper {
position: relative;
width: 80%;
text-align: center;
z-index: 2; /* Content को ऊपर रखने के लिए */
}
/* If Background is Not Expanding, Add This */
.global-presence-new::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
background: url('../../assets/img/Group 1778 (1).png') no-repeat center center;
background-size: cover;
opacity: 1; /* जरूरत हो तो opacity adjust करें */
}
.global-presence-new-content {
width: 80%;
margin: 0 auto;
text-align: left;
font-size: 40px;
font-family: 'Groningen-Bold', sans-serif;
color: white;
padding-top: 0px;
}
.global-presence-new-content .highlight {
color: #90949b;
}
.global-presence-new-video {
width: 80%;
}
.global-presence-new-video video {
width: 100%;
height: auto;
}
.global-presence-new-cards {
width: 80%;
display: flex;
justify-content: space-between;
gap: 15px;
margin: 50px auto;
}
.global-presence-new-card {
flex: 1;
background-size: cover;
padding: 20px;
position: relative;
color: white;
margin-top: 50px;
}
.card-1 {
background: url('../../assets/img/Path 10165.png') no-repeat center center/cover;
}
.card-2 {
background: url('../../assets/img/Path -1.png') no-repeat center center/cover;
}
.card-3 {
background: url('../../assets/img/Path -2.png') no-repeat center center/cover;
}
.global-presence-new-card h3 {
margin-bottom: 20px;
color: #f5a623;
margin-top:100px;
font-family: 'Groningen-Bold', sans-serif;
font-size:30px;
}
.global-presence-new-card p {
color: #90949b;
font-size: 14px;
line-height: 1.4;
font-family: 'Helvetica-Regular', sans-serif;
margin-bottom: 100px;
}
.global-presence-new-card hr {
width: 80px;
border: none;
border-top: 1px solid white;
position: absolute;
bottom: 30px; /* Always 30px from bottom */
left: 20px; /* Align with padding */
margin: 0;
}
/* Global Presence css end */
/* history cssstart */
.subtitle1-history {
font-size: 14px;
color: #08254a;
margin-top: 10px;
line-height: 1.6;
font-family: 'Helvetica', sans-serif;
}
.history-head {
font-size: 40px;
color: #08254a;
margin-top:0px;
text-align:left;
font-family: 'Groningen-Bold', sans-serif;
}
.history-section-three {
/*background-color: #00214d;*/
padding: 50px 0;
color: white;
text-align: center;
}
.history-section-three__container {
width: 80%;
margin: auto;
position: relative;
}
.history-section-three__title {
font-size: 40px;
color: #ffc62a;
margin: 0;
position: relative;
text-align:left;
font-family: 'Groningen-Bold', sans-serif;
}
.history-section-three__top-line,
.history-section-three__bottom-line {
height: 2px;
background-color: #ffc62a;
width: 100%;
left: 0;
}
.history-section-three__top-line {
top: 0;
}
.history-section-three__bottom-line {
bottom: 0;
}
.history-section-three__white-line {
height: 1px;
background-color: white;
width: 100vw;
margin: 50px 0;
position: relative;
left: -10vw;
}
.timeline-container {
flex-direction: column;
align-items: center;
position: relative;
margin: auto;
}
.timeline-divider {
position: absolute;
width: 2px;
background: white;
height: 100%;
left: 50%;
transform: translateX(-50%);
}
.timeline-row {
display: flex;
align-items: center;
width: 100%;
position: relative;
margin: 50px 0;
}
.timeline-row.reverse {
flex-direction: row-reverse;
}
.timeline-col {
display: flex;
align-items: center;
justify-content: center;
flex: 1;
}
.timeline-col.image img {
width: 80%;
height: 120px;
object-fit: cover;
margin-top: 30px;
}
.timeline-col.content {
flex: 1;
display: flex;
align-items: center;
padding: 20px;
}
.timeline-row:not(.reverse) .timeline-col.content {
justify-content: flex-start;
text-align: right;
margin-left: 20px;
}
.timeline-row.reverse .timeline-col.content {
justify-content: flex-end;
text-align: left;
margin-right: 20px;
}
.timeline-content {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.timeline-header {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 20px;
}
.timeline-year {
font-size: 24px;
color: #ffc62a;
}
.timeline-heading {
font-size: 30px;
color: white;
font-family: 'Groningen-Bold', sans-serif;
}
.timeline-text {
margin-top: 5px;
color: white;
text-align: left;
width: 100%;
line-height: 1.6;
}
.timeline-row.reverse .timeline-header {
flex-direction: row-reverse;
}
.timeline-dot {
width: 10px;
height: 10px;
background: #ffc62a;
border-radius: 50%;
position: absolute;
left: 50%;
transform: translateX(-50%);
}
/* history css end */
/* join our team css start */
.subtitle1-join-team {
font-size: 14px;
color: white;
margin-top: 0px;
line-height: 1.6;
font-family: 'Helvetica', sans-serif;
}
.bold-text-team {
font-weight: bold;
color: #ffffff; /* Dark Blue */
font-family: 'Groningen-Bold', sans-serif;
}
.highlight-text-team {
font-weight: normal;
color: #90949b; /* Light Blue */
}
.our-team {
width: 100%;
margin-top:80px;
}
.container-our-team {
width: 80%;
margin: auto;
}
.row-our-team {
display: flex;
justify-content: space-between;
}
.col-our-team {
flex: 1;
}
.team-img-our-team {
width: 100%;
display: block;
border: 1px solid #ffc62a;
}
.our-team-third {
width: 80%;
margin: auto;
position: relative;
margin-top: 120px;
}
.container-our-team-third {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
position: relative;
}
.row-our-team-third {
display: flex;
width: 100%;
justify-content: space-between;
}
.row-our-team-third:nth-child(1) .col-our-team-third {
border-bottom: 1px solid white;
}
.col-our-team-third {
width: 48%;
padding: 40px;
position: relative;
background: #0a2a4a;
color: white;
}
.title-our-team-third {
text-align: left;
font-family: 'Groningen-Bold', sans-serif;
font-size: 30px;
margin-bottom: 0px;
}
.icon-our-team-third {
position: absolute;
right: 50px;
top: 40px;
}
.text-our-team-third {
margin-top: 50px;
font-family: 'Helvetica', sans-serif;
font-size: 14px;
line-height:1.5;
}
.our-team-third::before,
.our-team-third::after {
content: '';
position: absolute;
background: white;
}
.our-team-third::before {
width: 100%;
height: 1px;
top: 50%;
left: 0;
}
.our-team-third::after {
width: 1px;
height: 100%;
left: 50%;
top: 0;
}
.our-team-fourth {
width: 80%;
margin: auto;
text-align: center;
position: relative;
padding: 50px 0;
}
.container-our-team-fourth {
position: relative;
}
.top-icons-our-team-fourth,
.bottom-icons-our-team-fourth {
display: flex;
justify-content: space-between;
align-items: center;
}
.top-icons-our-team-fourth img,
.bottom-icons-our-team-fourth img {
width: 50px; /* जरूरत के हिसाब से एडजस्ट कर लेना */
height: auto;
}
.text-our-team-fourth {
font-family: 'Groningen-Bold', sans-serif;
font-size: 14px;
margin: 30px 0;
text-align: left;
color: #08254a;
padding:10px;
}
.accordion-button:not(.collapsed) {
color: var(--bs-accordion-active-color);
background-color: #e6e6e630 !important;
box-shadow: inset 0 calc(-1* var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}
.accordion-button
{
background-color: #e6e6e630 !important;
font-family: 'Helvetica' !important;
}
.accordion-button:focus {
z-index: 3;
outline: 0;
box-shadow: none !important;
}
.join-smeta-team1
{
position: relative;
left: 50%;
}
.join-smeta-team-head2
{
font-size: 20px;
margin-right: 49%;
}
.join-smeta-team-para1
{
text-align: left;
margin-left: 70px;
width: 450px;
}
.join-smeta-team-headgold
{
font-size:20px;
margin-right: 32%;
}
.join-smeta-team-head1
{
font-size:20px;
margin-right: 52%;
}
.our-team-fourth-team {
width: 80%;
margin: auto;
text-align: center;
position: relative;
padding: 0px 0px 60px 0px;
}
.join-smeta-row {
display: flex;
justify-content: space-between; /* Left aur Right align ke liye */
align-items: center; /* Center align vertically */
width: 100%;
}
.join-smeta-team {
text-align: left;
max-width: 50%; /* 50-50 ratio ke liye */
}
.join-smeta-team-para {
text-align: left;
width: 100%; /* Full width me adjust hoga */
margin: 10px 0;
font-family: 'Groningen-Regular', sans-serif;
font-size: 14px;
color :#08254a;
}
.join-smeta-team-head {
font-size: 30px;
font-family: 'Groningen-Bold', sans-serif;
color:#08254a;
}
.know-more-team {
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color: #09264b;
margin-top: 10px;
}
.know-more-team:hover{
animation: pulse 0.6s infinite alternate;
transform: scale(1.09972);
}
.know-more-pos-team:hover{
animation: pulse 0.6s infinite alternate;
transform: scale(1.09972);
}
.certificate-team-image {
max-width: 100%; /* Responsive banane ke liye */
height: auto;
}
.know-more-team1
{
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 13px;
margin-right: 47%;
font-weight: 100;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color: #09264b;
margin-bottom: 50px;
margin-top: 10px;
}
.certificate-team-image1
{
position: relative;
left: -50%;
}
.our-team-fourth-team-hr1
{
width: 80%;
margin: auto;
text-align: center;
position: relative;
padding: 0px 0px 0px 0px;
top: -20px;
color:#707070;
}
.join-team-pos-img
{
width: 97%;
height: auto;
margin: 15px 0px;
}
.join-team-pos-div
{
margin-top: 100px !important;
}
.join-pos-team-head
{
font-family: 'Groningen-Bold', sans-serif;
font-size: 14px;
margin-right: 100px;
color: #ffffff;
left: 20px;
text-align: left;
position: relative;
width: 300px;
}
.know-more-pos-team
{
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 14px;
margin-right: 200px;
font-weight: 600;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color: #09264b;
margin-bottom: 50px;
margin-top: 50px;
}
.paras-testimonials-column
{
width: calc(33.33% - 20px);
text-align: left;
display: flex;
flex-direction: column;
background-image: url('../../assets/img/Group 1950.png'); /* Apni image ka path yahan daal */
background-size: cover; /* Puri div ko cover kare */
background-position: center; /* Center align rahe */
padding: 10px 0px 20px 25px;
border: 1px solid #ffffff;
}
.paras-testimonials-para
{
font-size: 14px;
margin: 20px 20px 20px 0px;
font-family: 'Helvetica-Regular', sans-serif;
color: #ffffff;
line-height: 1.4;
}
.paras-testimonials-row
{
display: flex;
justify-content: space-between;
gap: 5px;
margin-bottom: 50px;
padding-bottom: 100px;
}
.directors-para
{
color:#ffffff;
}
.testimonials-star
{
margin-left: -30px;
}
.testimonials-hr
{
color: antiquewhite;
width: 80%;
position: relative;
right: 10%;
}
.paras-testimonials-heading
{
font-size: 40px;
font-weight: 100;
margin-bottom: 30px;
font-family: 'Groningen-Regular', sans-serif;
color: #ffffff;
text-align: justify;
}
.team-all-bgimage {
background: url("../../assets/img/Rectangle 766.png");
background-position: center;
}
.paras-join-team-footer-who-we-are
{
width: 100%;
margin-top: -50px;
}
/* join our team css end */
/* bags page css start*/
.button-container-bags {
position: absolute;
bottom: 30px;
left: 10%; /* Header ke start point se align */
width: 80%; /* Header ke width ke barabar */
display: flex;
justify-content: flex-start; /* Button left se start hoga */
z-index: 2;
}
.arrow.arrow-left {
width: 60px; /* Width bada diya */
height: 60px; /* Height bada diya */
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%; /* Circle shape */
cursor: pointer;
}
.arrow.arrow-left i {
font-size: 28px; /* Icon size bada */
color: grey;
}
.arrow.arrow-right {
width: 60px; /* Width bada diya */
height: 60px; /* Height bada diya */
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%; /* Circle shape */
cursor: pointer;
}
.arrow.arrow-right i {
font-size: 28px; /* Icon size bada */
color: grey;
}
.sixthsectionbag-arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 40px; /* Same size */
height: 40px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
color: grey; /* Same grey color */
font-size: 20px;
}
.sixthsectionbag-arrow-left {
left: 10px;
}
.sixthsectionbag-arrow-right {
right: 10px;
}
.get-quote-button {
background: #ffc62a;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
}
.get-quote-button:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
/* Overall Section */
.bagsfirstsection {
width: 100%;
/*background-color: #08254a;*/
/*padding: 80px 0;*/
display: flex;
justify-content: center;
position: relative;
overflow: visible;
}
/* Container */
.bagsfirstsection-container {
width: 80%;
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
overflow: visible;
}
/* Left Column */
.bagsfirstsection-left {
flex: 1.2;
color: #fff;
padding-right: 50px;
}
.bagsfirstsection-heading {
font-size: 40px;
margin-bottom: 20px;
font-family: 'Groningen-Bold', sans-serif;
color:#08254a;
}
.bagsfirstsection-subheading {
font-size: 30px;
margin-bottom: 20px;
font-family: 'Groningen-Bold', sans-serif;
color:#90949b;
}
.bagsfirstsection-paragraph {
font-size: 16px;
color:#08254a;
line-height: 1.6;
text-align: justify;
}
.bagsfirstsection-gap {
height: 40px;
}
/* Right Column (Images) */
.bagsfirstsection-right {
flex: 1;
display: flex;
justify-content: center;
align-items: flex-end;
position: relative;
min-height: 550px;
overflow: visible;
}
/* Image Styling */
.bagsfirstsection-image {
position: absolute;
bottom: -200px;
transition: all 0.3s ease-in-out;
}
/* Image Order, Size & Layering */
.bag3 { /* 03.png (Sabse Peeche, Large Size) */
z-index: 1;
width: 175%;
left: -50%;
/*bottom: -240px;*/
top:0px;
}
.belts3 { /* 03.png (Sabse Peeche, Large Size) */
z-index: 1;
width: 125%;
left: -20%;
/*bottom: -180px;*/
top:0px;
}
.wallet3
{
z-index: 1;
width: 150%;
left: -20%;
/*bottom: -180px;*/
top:0px;
}
.hardgoods2
{
z-index: 1;
width: 150%;
left: -25%;
/*bottom: -280px;*/
top:0px;
}
/* Overall Section: Full width with centered 80% container */
.secondsectionbag {
width: 100%;
display: flex;
justify-content: center;
margin-top: 50px ;
margin-bottom: 50px ;
}
.secondsectionbag-container {
width: 80%;
display: flex;
gap: 50px; /* 50px gap between left and right columns */
}
.know-more-button {
background: #ffc62a;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
/*display: flex;*/
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
text-decoration: none;
}
.know-more-button:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.fifthsectionbag-twocolumn-new {
display: flex;
flex-wrap: wrap;
/*justify-content: space-between;*/
gap: 20px;
margin-top: 30px;
}
.fifthsectionbag-box {
background-color: #ffc62a;
padding: 20px;
width: calc(25% - 15px); /* 4 boxes with 20px gap */
box-sizing: border-box;
}
.fifthsectionbag-box h3 {
font-size: 24px;
margin-bottom: 10px;
color:#002f61;
text-transform: uppercase;
font-family: 'Groningen-Bold', sans-serif;
}
.fifthsectionbag-box ul {
list-style: none;
padding: 0;
margin: 0;
}
.fifthsectionbag-box ul li {
margin-bottom: 6px;
font-size: 15px;
color:#002f61;
font-family: 'Helvetica-Regular', sans-serif;
}
.fifthsectionbag-knowmore-btn {
background-color: #002f61;
color: white;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
margin-top: 150px;
}
.fifthsectionbag-knowmore-btn:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.sixthsectionbag-knowmore-btn {
background-color: #002f61;
color: white;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
width:fit-content;
}
.sixthsectionbag-knowmore-btn:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.seventhsectionbag-btn {
width: auto;
padding: 10px 30px;
background-color: #ffcc00;
color: #002f61;
border: none;
cursor: pointer;
font-size: 14px;
align-self: flex-start;
font-weight: 600;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
gap: 8px;
}
.seventhsectionbag-btn:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
.paras-news-upper-footer-bags {
width: 100%;
}
/* bags page css end*/
/* product page css start */
.button-container-product {
position: absolute;
bottom: 30px;
left: 10%; /* Header ke start point se align */
width: 80%; /* Header ke width ke barabar */
display: flex;
justify-content: flex-start; /* Button left se start hoga */
z-index: 2;
}
/* product page css end */
/* facilities page css start */
.facilities-section-three__white-line
{
height: 1px;
background-color: white;
width: 100vw;
margin: 50px 0;
position: relative;
left: -10vw;
}
.facilities-section-three__container
{
position: relative;
top: 30px;
}
.facilities-section-three
{
/*background-image: url('../img/Rectangle 103.png');*/
padding: 50px 0;
color: white;
margin-top: 50px;
text-align: center;
}
.facilities-main-row
{
display: flex;
justify-content: space-between;
align-items: center;
}
.facilities-section-para
{
font-size: 25px;
color: #b9b9b9;
}
.unique-bottom-facilities-icons
{
display: flex;
width: 80%;
justify-content: space-between;
margin-bottom: 20px;
margin-top: -10px;
margin-left: 10%;
}
.facilities-heading
{
font-size: 40px;
color: #ffffff;
font-family: 'Groningen-Bold', sans-serif;
text-align: left;
}
.facilities-boxes
{
display: flex;
justify-content: space-between;
width: 100%;
margin: 50px auto;
gap: 20px;
margin-top: 80px;
}
.facilities-hr
{
position: relative;
top: 90px;
width: 100px;
right: 75px;
}
.facilities-hr1
{
position: relative;
top: 20px;
width: 100px;
right: 75px;
}
.global-facilities-box
{
width: 30%;
height: 290px;
border: 1px solid white;
display: flex;
align-items: flex-start;
padding: 20px;
background: #1d3557;
}
.global-facilities-box1
{
flex: 1; /* Ensure equal width for all cards */
background-image: url('../img/Union 4.png');
border: 1px solid white;
padding: 20px;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
}
.facilities-box-content h3 {
font-size: 30px;
color: #ffffff;
font-family: 'Groningen-Bold', sans-serif;
margin-bottom: 0px;
margin-top: 80px;
}
.facilities-box-content
{
position: relative;
bottom: 60px;
}
.facilities-head-4
{
position: absolute;
top: 110%;
color: #ffcc00;
}
.facilities-background-wrapper
{
background-image: url('../img/Group 1778.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
height: 1000px;
}
.facilities-fifth-section
{
position: relative;
width: 100%;
/*margin-top: 100px;*/
display: flex;
flex-direction: column;
min-height: 20vh;
}
.facilities-machinery-heading
{
font-size: 40px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
text-align: justify;
margin-left: 10%;
}
.facility-m-boxes-new {
display: flex;
justify-content: space-between;
gap: 0;
padding: 0;
margin: 0 auto; /* Center align */
width: 80%;
}
.facilities-machinery-box-new {
flex: 1;
}
.facilities-machinery-box-new img {
width: 100%;
height: auto;
display: block;
}
.facilities-machinery-heading1
{
font-size: 40px;
color: #1d3557;
font-family: 'Groningen-Bold', sans-serif;
text-align: justify;
margin-left: 5%;
margin-top: 20%;
}
.global-para1
{
font-size: 18px;
font-family: 'Groningen-Bold', sans-serif;
text-align: justify;
margin-left: 5%;
color:white;
margin-right: 5%;
}
.facilities-home-row
{
display: flex;
gap: 0px;
margin-top: -55px;
width: 80%;
margin-left: 10%;
}
.facility-m-boxes
{
display: flex;
justify-content: space-between;
width: 80%;
margin: 50px auto;
gap: 0px;
margin-top: 0px;
}
.facilities-section-background {
width: 100%;
min-height: auto;
background: #08254a;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
display: flex;
flex-direction: column;
align-items: center;
padding: 50px 0;
}
.facilities-section-first {
width: 80%;
padding: 20px;
text-align: center;
border-radius: 10px;
}
.facilities-section-first-paragraph {
font-family: 'Groningen-Bold', sans-serif;
font-size: 18px;
color: white;
text-align: left;
}
/* Full Screen Width Yellow Line - Centered */
.facilities-section-second-header {
position: relative;
text-align: center;
padding: 10px 0;
margin: 0;
}
/* Pseudo Elements for Full Width Border */
.facilities-section-second-header::before,
.facilities-section-second-header::after {
content: "";
position: absolute;
left: 50%; /* Center from Left */
width: 100vw;
height: 2px;
background-color: #08254a;
transform: translateX(-50%); /* Shift Back by Half */
}
.facilities-section-second-header::before {
top: 0;
}
.main-facility-container {
display: flex;
justify-content: center;
align-items: center;
min-height: 50vh;
}
.main-facility-card {
background-size: cover;
background-position: center;
padding: 20px;
color: white;
display: flex;
flex-direction: column;
justify-content: flex-end;
position: relative;
overflow: hidden;
margin: -22px;
}
.card-overlay {
background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.facility-card-content {
z-index: 2;
}
.facilities-first-head {
font-size: 20px;
text-align: justify;
}
.facilities-first-para {
font-size: 14px;
margin-bottom: 10px;
text-align: left;
}
.facilities-second-para {
color: #FFD700;
text-decoration: none;
font-weight: bold;
text-align: justify;
}
.facilities-section-second-header::after {
bottom: 0;
}
/* Inside Content (80% Width) */
.facilities-section-second-header-container {
display: flex;
justify-content: center; /* Center the single title */
align-items: center;
max-width: 1200px;
margin: 0 auto;
padding: 10px 0;
}
.facilities-section-second-title {
color: #08254a;
font-size: 40px;
text-align: left;
font-family: 'Groningen-Bold', sans-serif;
}
.facilities-section-second-video-wrapper {
width: 90vw; /* Screen ka 90% width */
height: 100%; /* Full height */
margin: 30px auto 0 auto; /* Upar 30px margin aur center align */
background: black;
display: flex;
justify-content: center;
align-items: center;
transform: translateX(-50%); /* Perfect center align */
position: relative;
left: 50%;
min-height: 100%; /* Ensure full height remains */
max-height: 100%; /* Prevent shrinking */
overflow: hidden; /* Avoid any unwanted scroll */
}
.facilities-section-second-video {
width: 100%;
height: 100%;
object-fit: cover;
}
/* Custom Play Button - Properly Centered */
.facilities-section-second-play-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
cursor: pointer;
width: 80px;
height: 80px;
z-index: 2;
}
.facilities-section-second-play-icon img {
width: 100px;
height: 100px;
}
/* Hide Default Video Controls */
#facilityVideo::-webkit-media-controls {
display: none !important;
opacity: 0 !important;
pointer-events: none !important;
}
/* Responsive Fixes */
@media (max-width: 768px) {
.facilities-section-second-header-container {
flex-direction: column;
text-align: center;
}
.facilities-section-second-title,
.facilities-section-second-subtitle {
text-align: center;
margin: 5px 0;
}
}
/* facilities page css end */
/* design experties css start */
.design-expertise-full-screen-video
{
width: 100%;
height: 100%;
object-fit: cover;
}
.design-expertise-video-section
{
width: 100vw;
height: 100vh;
overflow: hidden;
position: relative;
}
.design-expertisesection-heading
{
font-size: 40px;
line-height: 1.3;
text-align: left;
font-family: 'Groningen-Bold', sans-serif;
color: #ffffff;
}
.design-expertise-heading
{
font-size: 40px;
color: #ffffff;
text-align: left;
margin-top: 0px;
margin-bottom: 0px;
font-family: 'Groningen-Bold', sans-serif;
}
.newexpertise-bottom-icons11
{
padding-top: 60px;
}
.design-expertise-last-sec
{
background: url('../../assets/img/Group 1778.png') no-repeat center center/cover;
}
.design-expertise-button
{
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color: #09264b;
margin-bottom: 100px;
margin-left: 10%;
}
.design-expertise-button:hover {
animation: pulse 0.6s infinite alternate;
}
.design-expertisesection
{
width: 100%;
display: flex;
justify-content: center;
margin: 50px 0;
}
.design-expertise-quote
{
position: relative;
top: 20px;
font-size: 30px;
}
.paras-design-expertise-para
{
font-size: 14px;
margin: 50px 20px 20px 0px;
font-family: 'Helvetica-Regular', sans-serif;
color: #ffffff;
line-height: 1.4;
}
.paras-design-expertise-row
{
display: flex;
justify-content: space-between;
gap: 5px;
margin-top: 30px;
}
.design-expertise-para
{
color: #ffc62a;
}
h3.design-experties-second-section.left-heading1 {
font-family: 'Groningen-Bold', sans-serif;
font-size: 36px;
color: #08254a;
text-align: left;
margin-top: 0px;
margin-bottom: 0px;
}
.design-experties-first-section {
width: 100%;
position: relative;
margin-bottom: 50px;
padding-bottom: 1px;
}
.design-experties-first-section .background-image {
background: url('../../assets/img/Group 1778.png') no-repeat center center/cover;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.design-experties-first-section .content-wrapper {
width: 80%;
margin: auto;
padding-top: 50px;
}
.design-experties-first-section .intro-text {
font-family: 'Groningen-Bold', sans-serif;
font-size: 30px;
color: #ffcc00;
}
.design-experties-first-section .heading-row {
display: flex;
justify-content: space-between;
align-items: center;
margin: 30px 0;
border-top: 1px solid #ffcc00;
border-bottom: 1px solid #ffcc00;
padding: 10px 0;
}
.design-experties-first-section .left-heading {
font-family: 'Groningen-Bold', sans-serif;
font-size: 40px;
color: #ffcc00;
text-align: left;
margin-top: 0px;
margin-bottom: 0px;
}
.design-experties-first-section .right-heading {
font-family: 'Groningen-Bold', sans-serif;
font-size: 24px;
color: white;
text-align: right;
margin-top: 0px;
margin-bottom: 0px;
}
.design-experties-ninth-section {
width:80%;
margin: auto;
text-align: left;
margin-bottom:80px;
}
.subheading-design-experties-ninth-section {
font-size: 40px !important;
font-family: 'Groningen-Bold', sans-serif;
color: #08254a;
}
.heading-design-experties-ninth-section {
font-size: 40px;
color: #ffcc00;
margin-top:0px;
margin-bottom: 40px;
font-family: 'Groningen-Bold', sans-serif;
}
.row-design-experties-ninth-section {
display: flex;
justify-content: space-between;
align-items: center;
text-align: center;
}
.column-design-experties-ninth-section {
flex: 1;
/*padding: 20px;*/
}
.line-design-experties-ninth-section {
width: 2px;
height: 150px;
background-color: #707070;
}
.icon-design-experties-ninth-section {
width: 50px;
height: 50px;
margin-bottom: 10px;
}
.title-design-experties-ninth-section {
font-size: 20px;
margin-bottom: 10px;
font-family: 'Groningen-Bold', sans-serif;
color:#08254a;
}
.paragraph-design-experties-ninth-section {
font-size: 14px;
color:#08254a;
}
@media (max-width: 768px) {
.row-design-experties-ninth-section {
flex-direction: column;
}
.line-design-experties-ninth-section {
display: none;
}
}
/* Design experties css end */
/* policy css start */
.policy-section {
width: 80%;
margin: auto;
margin-top: 50px;
margin-bottom: 50px;
}
.policy {
padding: 15px;
}
.policy h2 {
background: #f0f0f0;
padding: 10px;
color: #08254a;
margin: 0;
font-family: 'Groningen-Regular', sans-serif;
padding-left: 35px; /* Only text inside box shifts */
font-size:20px;
}
.policy p {
padding: 10px;
color: #08254a;
font-family: 'Helvetica-Regular', sans-serif;
font-size: 14px;
margin-bottom: 0px;
padding-left: 35px; /* Only text inside box shifts */
}
/* policy css end */
/* awards page css start */
.innovation-section {
width: 100%;
/*min-height: 100vh; */
/*padding: 50px 0;*/
/*background: url('../../assets/img/Group 1778.png') no-repeat center center;*/
background-size: 100% 100%; /* Yeh ensure karega ki pura fit aaye */
}
/* Content Wrapper (80% Width) */
.content-wrapper {
width: 80%;
margin: auto;
text-align: left;
position: relative;
}
.content-wrapper h2 {
font-family: 'Groningen-Bold', sans-serif;
color: #08254a;
margin-bottom: 20px;
font-size: 40px;
}
.content-wrapper p {
color: #08254a;
font-size: 14px;
font-family: 'Helvetica-Regular', sans-serif;
line-height: 1.4;
text-align: justify;
}
/* Pillars Section */
.pillars-wrapper {
/*width: 80%;*/
margin: 40px auto;
background: url('../../assets/img/Group 2090.png') no-repeat center center/cover;
padding: 40px 0;
display: flex;
justify-content: space-between;
align-items: center;
text-align: center;
}
/* Individual Pillar */
.pillar {
flex: 1;
}
.pillar img {
width: 50px;
height: auto;
margin-bottom: 10px;
}
.pillar h3 {
color: white;
font-size: 14px;
font-family: 'Groningen-Regular', sans-serif;
line-height:1.4;
font-weight: 100;
}
/* Divider Between Columns */
.divider {
width: 2px;
height: 80px;
background: #ffc62a;
}
.award-section {
width: 80%;
margin: 0 auto 50px auto;
text-align: left;
margin-top: 0px !important;
padding-top: 0px !important;
}
.award-section h2 {
font-size: 40px;
font-family: 'Groningen-Bold', sans-serif;
color: #ffd013;
margin-top:0px;
}
.award-section h2 span {
font-size: 30px;
color: #ffd013;
}
.compliance-container {
display: flex;
justify-content: space-between;
gap: 25px;
margin-top: 10px;
}
.compliance-box {
flex: 1;
border: 1px solid #e5e6e8;
padding: 20px;
text-align: center;
position: relative;
min-height: 250px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-size: cover;
background-position: bottom;
}
/* First box background image */
.first-box {
background-image: url('../../assets/img/Group 2047.png');
background-repeat: no-repeat;
background-position: top; /* Move image more towards bottom-left */
}
/* Second box background image */
.second-box {
position: relative;
overflow: hidden;
}
.second-box::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('../../assets/img/Group 2047.png');
background-repeat: no-repeat;
background-position: bottom;
background-size: cover;
transform: scaleX(-1); /* सिर्फ background image को flip किया */
z-index: -1; /* Image को background में रखने के लिए */
}
.third-box {
background-image: url('../../assets/img/Group 2047.png');
background-repeat: no-repeat;
background-position: top; /* Move image more towards bottom-left */
}
.compliance-box img {
width: 220px;
height: auto;
margin-bottom: 15px;
}
.compliance-box h3 {
font-size: 30px;
color: #08254a;
margin-bottom: 10px;
font-family: 'Groningen-Bold', sans-serif;
}
.compliance-box p {
font-size: 14px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
}
.divider2 {
width: 120px;
height: 2px;
background-color: #08254a;
margin: 20px auto 0;
margin-bottom:50px;
}
.award-new-heading {
font-size: 40px;
font-family: 'Groningen-Bold', sans-serif;
color: #ffd013;
margin-top:0px;
text-align: left;
}
.award-new-heading span {
font-size: 30px;
color: #ffd013;
}
.join-smeta-row-award {
display: flex;
flex-wrap: wrap; /* Mobile me neeche aa sake */
justify-content: center;
gap: 30px; /* Thoda gap 3 columns ke beech me */
width: 100%;
margin-top: 40px;
}
.col-lg-4 {
display: flex;
flex-direction: column; /* Image upar, text neeche */
align-items: center;
text-align: center;
max-width: 30%; /* 3 column banana hai */
}
.join-smeta-team-award {
text-align: center;
}
.join-smeta-team-para-award {
font-family: 'Groningen-Bold', sans-serif;
font-size: 14px;
color: #707070;
margin-bottom: 10px;
}
.new-para-color{
text-align: left;
width: 100%; /* Full width me adjust hoga */
margin: 10px 0;
font-family: 'Groningen-Bold', sans-serif;
font-size: 14px;
color:#08254a;
}
.join-smeta-team-head-award {
font-size: 24px;
font-family: 'Groningen-Bold', sans-serif;
color: #08254a;
margin-bottom: 10px;
}
.certificate-team-image-award {
width: 200px; /* Thoda adjust kar le na agar chhota ya bada dikh raha ho */
height: auto;
margin-bottom: 20px;
}
.pillars-wrapper-1 {
width: 80%;
margin: 40px auto;
padding: 40px 0;
display: flex;
justify-content: space-between;
align-items: center;
text-align: center;
}
.content-wrapper-2 {
width: 80%;
margin: auto;
text-align: left;
position: relative;
}
.content-wrapper-2 h2 {
font-family: 'Groningen-Bold', sans-serif;
color: #08254a;
margin-bottom: 20px;
font-size: 40px;
margin-top:0px;
}
.heading-2 {
font-size: 40px;
color: white;
font-family: 'Groningen-Bold', sans-serif;
text-align: left;
}
.full-width-image-2 {
width: 80%;
margin: 30px auto;
display: block;
margin-top:20px;
}
.pillar-1 {
flex: 1;
}
.pillar-1 img {
width: 50px;
height: auto;
margin-bottom: 10px;
}
.pillar-1 h3 {
color: #08254a;
font-size: 20px;
font-family: 'Groningen-Bold', sans-serif;
line-height:1.4;
}
.pillar-1 p {
color: #08254a;
font-size: 14px;
font-family: 'Helvetica-Bold', sans-serif;
line-height:1.4;
margin:10px;
}
/* awards page css end */
/* contact page css start */
.contact-banner-p{
color: white;
font-size: 14px;
font-family: 'Helvetica-Bold', sans-serif;
line-height:1.4;
}
.contact-page {
width: 80%;
margin: auto;
padding: 50px 0;
display: flex;
align-items: stretch;
margin-bottom: 30px;
}
.contact-page-container {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 50px;
}
/* Left Section */
.contact-page-left {
flex: 1;
max-width: 45%;
}
.contact-page-left h2 {
font-size: 30px;
color: #0a0a5c;
font-family: 'Groningen-Bold', sans-serif;
}
.contact-page-left p {
font-size: 18px;
color: #08254a;
margin-bottom: 20px;
font-family: 'Helvetica-Regular', sans-serif;
line-height: 1.4;
margin-top: 0px;
}
.contact-page-info {
margin-top: 80px;
}
.contact-page-info h3 {
font-size: 22px;
color: #08254a;
margin-bottom: 5px;
font-family: 'Groningen-Bold', sans-serif;
}
.contact-page-info p {
font-size: 18px;
color: #08254a;
margin-top: 0px;
margin-bottom: 0px;
font-family: 'Groningen-Bold', sans-serif;
}
/* Divider Line */
.contact-page-divider {
width: 2px;
height: auto;
background: #d7d7d7;
min-height: 100%; /* Adjust as per the section */
}
/* Right Section */
.contact-page-right {
flex: 1;
max-width: 45%;
}
.contact-page-right h2 {
font-size: 30px;
color: #08254a;
margin-bottom: 10px;
font-family: 'Groningen-Bold', sans-serif;
}
.contact-page-right p {
font-size: 14px;
color: #08254a;
margin-bottom: 20px;
font-family: 'Helvetica-Regular', sans-serif;
line-height: 1.4;
}
/* Form */
.contact-page-form {
display: flex;
flex-direction: column;
gap: 25px;
}
/* "I am a" और dropdown same line में */
.contact-page-dropdown {
display: flex;
align-items: center;
gap: 10px; /* Label और dropdown के बीच gap */
width: 100%;
max-width: 100%; /* Parent container के हिसाब से full width */
}
.labelcust{
font-family: 'Groningen-Bold', sans-serif;
}
.contact-page-dropdown-container {
display: flex;
align-items: center;
gap: 10px;
width: 100%;
max-width: 400px; /* बाक़ी input fields जितनी width */
}
.contact-page-dropdown-container label {
font-size: 14px;
color: #333;
white-space: nowrap; /* Text break ना हो */
}
.contact-page-dropdown select {
flex: 1; /* Available space को fill करेगा */
width: 100%;
max-width: 100%;
background: #d7d7d7; /* Grey background */
border: none;
text-align: center;
padding: 12px;
font-size: 14px;
outline: none;
height: 45px;
font-family: 'Groningen-Bold', sans-serif;
}
/* Text Inputs - सिर्फ bottom border */
.contact-page-input input,
.contact-page-input select,
.contact-page-input textarea {
width: 100%;
border: none;
border-bottom: 1px solid #ccc;
padding: 8px 0;
font-size: 14px;
outline: none;
font-family: 'Groningen-Bold', sans-serif;
color:#d7d7d7;
}
/* Placeholder Text Color */
.contact-page-input input::placeholder {
color: #d7d7d7; /* Dark Blue */
opacity: 1; /* Ensures full visibility */
}
/* For better compatibility across all browsers */
.contact-page-input input:-ms-input-placeholder { /* IE 10-11 */
color: #d7d7d7;
}
.contact-page-input input::-ms-input-placeholder { /* Microsoft Edge */
color: #d7d7d7;
}
/* Placeholder Text Color for Textarea */
.contact-page-input textarea::placeholder {
color: #d7d7d7; /* Dark Blue */
opacity: 1; /* Ensures full visibility */
}
/* For better compatibility across all browsers */
.contact-page-input textarea:-ms-input-placeholder { /* IE 10-11 */
color: #d7d7d7;
}
.contact-page-input textarea::-ms-input-placeholder { /* Microsoft Edge */
color: #d7d7d7;
}
/* Mobile Number Field */
.contact-page-phone {
display: flex;
align-items: center;
width: 100%;
max-width: 100%;
border-bottom: 1px solid #ccc; /* बाकी input fields जैसी underline */
padding: 5px 0;
}
.contact-page-phone .country-code {
font-size: 14px;
color: #333;
margin-right: 10px;
white-space: nowrap;
font-family: 'Groningen-Bold', sans-serif;
}
.contact-page-dropdown select option:checked {
background-color: #0a0a5c; /* Dark Blue */
color: white; /* Text color white */
}
.contact-page-phone input {
flex: 1;
border: none;
font-size: 14px;
padding: 8px;
outline: none;
width: 100%;
background: transparent;
font-family: 'Groningen-Bold', sans-serif;
}
.contact-page-phone-container {
display: flex;
flex-direction: column;
gap: 5px;
width: 100%;
max-width: 100%;
}
.contact-page-phone-container label {
font-size: 14px;
color: #d7d7d7;
font-family: 'Groningen-Bold', sans-serif;
}
/* Buttons */
.contact-page-buttons {
display: flex;
gap: 10px;
}
.contact-page-submit {
background: #ffcc00;
color: #000;
padding: 10px 20px;
border: none;
cursor: pointer;
}
.contact-page-reset {
background: #ddd;
color: #333;
padding: 10px 20px;
border: none;
cursor: pointer;
}
/* Responsive Design */
@media (max-width: 768px) {
.contact-page-container {
flex-direction: column;
}
.contact-page-left, .contact-page-right {
max-width: 100%;
}
.contact-page-divider {
display: none;
}
}
.contact-page-reset {
background: #d7d7d7;
color: #08254a;
border: none;
padding: 10px 30px;
cursor: pointer;
font-size: 14px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
gap: 8px;
font-family: 'Helvetica-Bold', sans-serif;
}
.contact-page-reset:hover {
animation: pulse 0.6s infinite alternate;
}
@keyframes pulse {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
/* contact page css end */
/* csr page css start */
.corporate-social-section {
display: flex;
justify-content: space-between;
align-items: flex-start;
width: 80%;
margin: auto;
}
.corporate-social-left {
/*width: 50%;*/
text-align: left;
}
.corporate-social-heading-small {
font-size: 30px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
margin-bottom:10px;
margin-top:0px;
}
.corporate-social-heading-large {
font-size: 40px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
margin-top:0px;
}
.corporate-social-paragraph {
font-size: 14px;
color: #08254a;
margin-bottom: 10px;
margin-top: 0px;
font-family: 'Helvetica-Regular', sans-serif;
line-height: 1.4;
text-align: justify;
}
.corporate-social-right {
width: 45%;
display: flex;
flex-direction: column;
align-items: flex-end;
}
.corporate-social-box {
background-size: cover;
background-position: center;
display: flex;
align-items: center;
color: white;
font-size: 1.2rem;
font-weight: bold;
padding: 20px;
}
.corporate-social-large {
width: 100%;
height: 120px;
}
.corporate-social-small {
width: 70%;
height: 100px;
margin-top: 10px;
}
.corporate-social-text {
padding: 10px;
font-family: 'Groningen-Bold', sans-serif;
}
.corporate-social-section-second {
width: 80%;
margin: auto;
}
.product-third-section-corporate-social-fourth {
margin: 20px auto 0 auto;
padding-bottom: 20px;
background-color: #08254a;
}
.categories-heading-corporate-social-fourth {
text-align: left;
margin-bottom: 0px;
font-size: 40px;
font-weight: 100;
font-family: 'Groningen-Regular', sans-serif;
color: #08254a;
margin-top: 50px;
}
.tabs-container-corporate-social-fourth {
background-color: #203f67;
height: 40px;
display: flex;
align-items: center;
padding-left: 16px;
gap: 40px;
}
.tab-corporate-social-fourth {
cursor: pointer;
color: white;
padding: 0 20px;
height: 100%;
display: flex;
align-items: center;
font-family:'Groningen-Regular', sans-serif;
font-weight: 600;
}
.tab-corporate-social-fourth.active-corporate-social-fourth {
background-color: #08254a;
}
.image-wrapper-product-corporate-social-fourth {
background-color: #08254a;
padding: 15px;
}
.image-bg-corporate-social-fourth {
position: relative;
}
.main-image-corporate-social-fourth {
width: 100%;
object-fit: cover;
display: block;
height:400px;
}
.content-overlay-corporate-social-fourth {
position: absolute;
left: 15px;
bottom: 15px;
right: 15px;
color: #fff;
text-shadow: 1px 1px 2px rgba(0,0,0,0.7);
}
.icon-image-corporate-social-fourth {
width: 55px;
height: 60px;
margin-bottom: 10px;
}
.content-overlay-corporate-social-fourth h2 {
margin: 0 0 10px;
font-size: 25px;
font-family:'Groningen-Bold', sans-serif;
}
.content-overlay-corporate-social-fourth p {
margin: 0 0 10px;
max-width: 65%;
font-family: 'Helvetica', sans-serif;
}
.know-more-button-corporate-social-fourth {
background-color: #ffc62a;
border: none;
padding: 10px 20px;
font-size: 14px;
font-weight: 100;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color:#08254a;
}
.corporate-social-sixth-section {
background-color: white;
padding: 50px 0;
display: flex;
flex-direction: column;
width: 100%;
position: relative;
width: 100%;
}
.corporate-social-sixth-container {
display: flex;
justify-content: space-between;
align-items: center;
width: 80%;
margin: 30px auto;
margin-bottom:0px;
margin-top:0px;
}
.corporate-social-sixth-row {
display: flex;
align-items: center;
gap: 60px;
flex-wrap: wrap; /* Makes it responsive */
}
.corporate-social-sixth-column {
flex: 1;
min-width: 400px; /* Prevents extreme shrinking */
}
.corporate-social-sixth-text h2 {
font-size: 40px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
margin-bottom: 0px;
}
.corporate-social-sixth-text p {
font-size: 14px;
color: #08254a;
font-family: 'Helvetica-Regular', sans-serif;
line-height: 1.4;
}
.corporate-social-sixth-image img {
width: 100%;
height: auto;
display: block;
}
.corporate-social-seventh-section {
width: 100%;
background-color: white;
padding: 50px 0;
text-align: left; /* Left align all content */
}
.corporate-social-seventh-heading {
font-size: 40px;
font-weight: bold;
margin-bottom: 10px;
color: #08254a;
font-family: 'Groningen-Bold', sans-serif;
width: 80%;
margin: auto;
}
.corporate-social-seventh-para {
font-family: 'Groningen-Bold', sans-serif;
font-size: 20px;
line-height: 1.4;
color: #08254a;
width: 80%;
margin: auto;
margin-bottom: 30px;
}
.corporate-social-seventh-container {
display: flex;
justify-content: space-between;
gap: 20px;
width: 80%;
margin: auto;
}
.corporate-social-seventh-box {
width: 50%;
height: 250px;
display: flex;
flex-direction: column;
justify-content: flex-end;
padding: 20px;
color: white;
position: relative;
background-size: cover;
background-position: center;
text-align: left; /* Left align inside the box */
}
.fair-labor {
background-image: url('../../assets/img/Path 10551.png'); /* Replace with actual image */
}
.health-safety {
background-image: url('../../assets/img/Path 10551.png'); /* Replace with actual image */
}
.corporate-social-seventh-title {
font-size: 24px;
margin-bottom: 10px;
text-align: left; /* Left align title */
font-family: 'Groningen-Bold', sans-serif;
}
.corporate-social-seventh-text {
font-family: 'Groningen-Bold', sans-serif;
font-size: 16px;
line-height: 1.4;
color: white;
text-align: left;
width:80%;
}
/* csr page css end */
/* press page css start */
.paras-press-para
{
font-size: 14px;
margin: 0px 20px 40px 0px;
font-family: 'Helvetica-Regular', sans-serif;
color: #ffffff;
line-height: 1.4;
}
.press-para
{
color: #ffc62a;
margin-top: 20px;
}
.paras-press-column
{
width: 100%;
text-align: left;
display: flex;
flex-direction: column;
background-image: url('../../assets/img/Group 1950.png'); /* Apni image ka path yahan daal */
background-size: cover; /* Puri div ko cover kare */
background-position: center; /* Center align rahe */
padding: 10px 10px 20px 10px;
border: 1px solid #ffffff;
}
.press-heading
{
font-size: 40px;
color: #08254a;
text-align: left;
margin-top: 0px;
margin-bottom: 0px;
font-family: 'Groningen-Bold', sans-serif;
}
.press-heading1
{
font-size: 40px;
color: #ffc62a;
text-align: left;
margin-top: 0px;
margin-bottom: 0px;
font-family: 'Groningen-Bold', sans-serif;
}
.join-press-row
{
display: flex;
justify-content: space-between;
width: 100%;
}
.join-press-img
{
width: 100%;
height: 100%;
}
.join-press-img-div
{
flex: 450%;
}
.press-team-head
{
font-family: 'Groningen-Bold', sans-serif;
font-size: 25px;
margin-right: 100px;
color: #1d3557;
left: 20px;
text-align: left;
position: relative;
width: 300px;
}
.intro-press-text{
font-size: 16px;
position: relative;
left: 20px;
color: #1d3557;
margin-right: 30px;
line-height: 1.3;
font-family: 'Helvetica', sans-serif;
}
.know-more-pos-press
{
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 14px;
position: relative;
font-weight: 600;
left: 20px;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color: #09264b;
margin-bottom: 50px;
margin-top: 20px;
}
.join-press-pos-div
{
margin-top: 50px !important;
}
.press-full-width-image
{
width: 100%;
height: auto;
}
.know-more-pos-press:hover {
animation: pulse 0.6s infinite alternate;
}
.press-container
{
display: flex;
flex-wrap: wrap;
gap: 20px;
justify-content: space-between;
width:100%;
margin-top: 20px;
}
.press-card
{
flex: 1 1 calc(50% - 20px);
background-color: #fff;
overflow: hidden;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.press-card img {
width: 100%;
height: 250px;
object-fit: cover;
}
.press-card-content
{
padding: 20px;
}
.press-card h3 {
color: #0056b3;
font-size: 20px;
margin-bottom: 10px;
}
.press-card p {
font-size: 14px;
color: #555;
margin-bottom: 20px;
}
.press-card {
flex: 1 1 calc(50% - 20px);
background-color: #e0e1e2;
overflow: hidden;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.press-card img {
width: 100%;
height: 250px;
object-fit: cover;
}
.press-card-content {
padding: 20px;
}
.press-card h3 {
color: #1d3557;
font-size: 20px;
margin-bottom: 10px;
}
.press-card p {
font-size: 14px;
color: #1d3557;
margin-bottom: 20px;
}
.press-team-head1
{
font-family: 'Groningen-Bold', sans-serif;
font-size: 25px;
margin-right: 100px;
color: #1d3557;
left: 20px;
text-align: left;
position: relative;
width: 300px;
}
.intro-press-text1
{
font-size: 16px;
position: relative;
left: 20px;
color: #1d3557;
margin-right: 30px;
line-height: 1.3;
font-family: 'Helvetica', sans-serif;
}
.press-button15
{
background-color: #ffc62a;
border: none;
padding: 10px 30px;
font-size: 14px;
font-weight: 600;
cursor: pointer;
border-radius: 50px;
font-family: 'Helvetica-Bold', sans-serif;
color: #09264b;
margin-bottom: 10px;
margin-top: 10px;
margin-left: 20px;
}
/* press page css end */
.custom-video-wrapper {
position: relative;
width: 100%;
height: 550px; /* full screen height */
overflow: hidden;
margin: 0;
padding: 0;
}
.custom-video {
position: absolute;
top: 0;
left: 0;
width: 101%; /* thoda zyada to remove white line */
height: 100%;
object-fit: cover;
object-position: center;
z-index: 1;
}