/* Container */
@media (min-width: 1200px) {
.container:not(.container-bs):not(.container-xl-custom):not(.container-xxl-custom) {
max-width: 1240px
}
html:not(.sticky-header-active) #header.header-floating-bar .header-body {
max-width: 1240px;
right: 15px;
}
}
.wix-madefor-text-titles {
font-family: "Wix Madefor Text", sans-serif !important;
font-optical-sizing: auto;
font-style: normal;
}
@font-face {
font-family: 'Britanica';
src: url('../fonts/Britanica-Black.eot');
src: url('../fonts/Britanica-Black.eot?#iefix') format('embedded-opentype'),
url('../fonts/Britanica-Black.woff2') format('woff2'),
url('../fonts/Britanica-Black.woff') format('woff'),
url('../fonts/Britanica-Black.ttf') format('truetype');
font-weight: 900;
font-style: normal;
font-display: swap;
}
.space-grotesk-font {
font-family: "Space Grotesk", sans-serif;
font-optical-sizing: auto;
font-style: normal;
}
.main-title-font{
font-family: 'Britanica';
font-style: normal;
}
.text-21 {
font-size: 7.66em !important;
}
.text-22 {
font-size: 8.66em !important;
}
.text-23 {
font-size: 9.66em !important;
}
.text-24 {
font-size: 10.66em !important;
}
section.section.section-blue-background {
background: #0039cf;
}
section.section.section-black-background{
background: #000000;
}
.blue-color{
color: #0039cf;
}
a.blue-color:hover{
color: #0039cf;
}
.blue-background {
background: #0039cf;
}
.text-color-black{
color: #000000 !important;
}
#header .header-body{
background: transparent;
}
#header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a, #header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li > a{
color: #ffffff;
}
#header .header-nav-main nav > ul > li > a{
text-transform: none;
}
#header .header-nav-main nav > ul > li > a.active{
font-weight:bold;
}
#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.active:before,
#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.is-active:before
{
background: var(--light);
opacity: 1 !important;
}
#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.active:after
{
background: white;
}
/*
#header .header-nav.header-nav-line.header-nav-top-line nav > ul > li > a:before,
#header .header-nav.header-nav-line.header-nav-top-line nav > ul > li:hover > a:before{
display: none;
}
#header .header-nav.header-nav-line.header-nav-top-line nav > ul > li > a:after,
#header .header-nav.header-nav-line.header-nav-top-line nav > ul > li:hover > a:after{
content: "";
position: absolute;
width: 40%;
height: 3px;
top: -2px;
left: 0;
color: #ffffff !important;
}*/
body{
font-family: "Manrope", sans-serif;
font-optical-sizing: auto;
font-style: normal;
font-weight: 400;
}
.top-bottom-left-lg-rounded{
border-top-left-radius:50px ;
border-bottom-left-radius: 50px;
}
.top-left-lg-rounded{
border-top-left-radius:50px ;
}
.top-right-left-lg-rounded{
border-top-left-radius:50px ;
border-top-right-radius: 50px;
}
.top-right-left-lg-rounded-20{
border-top-left-radius:20px ;
border-top-right-radius: 20px;
}
.top-right-left-lg-rounded-30{
border-top-left-radius: 30px ;
border-top-right-radius: 30px;
}
.top-right-left-lg-rounded-15{
border-top-left-radius:15px ;
border-top-right-radius: 15px;
}
.bottom-right-left-lg-rounded-15{
border-bottom-left-radius:15px ;
border-bottom-right-radius: 15px;
}
.right-top-bottom-lg-rounded-10{
border-top-right-radius:10px ;
border-bottom-right-radius: 10px;
}
.right-top-bottom-lg-rounded-20{
border-top-right-radius:20px ;
border-bottom-right-radius: 20px;
}
.left-top-bottom-lg-rounded-20{
border-top-left-radius:20px ;
border-bottom-left-radius: 20px;
}
.rounded-10 {
border-radius: 10px !important;
}
.rounded-15 {
border-radius: 15px !important;
}
.rounded-20 {
border-radius: 20px !important;
}
.rounded-25 {
border-radius: 25px !important;
}
.rounded-30 {
border-radius: 30px !important;
}
.rounded-50 {
border-radius: 50px !important;
}
.owl-carousel{
margin-bottom: 0 !important;
}
h1, h2, h3, h4, h5, h6{
letter-spacing: normal !important;
}
.featured-project-image img{
display: none;
}
p {
font-size: 18px;
}
li{
font-size: 16px;
}
@media (max-width: 576px) {
.top-bottom-left-lg-rounded{
border-radius: 0;
}
.m-padding-left-0-with{
padding-left: 0 !important;
}
.coming-soon{
font-size: 4em !important;
}
.ps-0-mobile{
padding-left: 0 !important;
}
.ms-0-mobile{
margin-left: 0 !important;
}
.pe-0-mobile{
padding-right: 0 !important;
}
.me-0-mobile{
margin-right: 0 !important;
}
.pb-5-mobile{
padding-bottom: 3rem !important;
}
.mb-5-mobile{
margin-bottom: 3rem !important;
}
.featured-project-image{
background: none !important;
}
.featured-project-image img{
display: block !important;
}
.next-prev h4{
font-size: 1.80em !important
}
p{
font-size: 16px;
}
}
@media (min-width:1400px){
.coming-soon{
/*font-size: 6.5em !important;*/
position: absolute;
width: 600px;
z-index: 2;
}
}
@media (min-width:1200px){
.coming-soon{
/*font-size: 4.5em !important;*/
position: absolute;
width: 450px;
z-index: 2;
}
}
@media (min-width: 992px) {
#header .header-nav-main nav > ul > li > a.dropdown-toggle .fa-chevron-down{
display: block;
font-size: 14px;
padding-left: 5px;
padding-top: 3px;
}
#header .header-nav-main nav > ul > li > a{
font-size: 1.5em;
font-weight: normal;
letter-spacing:normal;
height: auto !important;
}
#header .header-nav.header-nav-line nav > ul li:hover > a:before{
background: #ffffff;
}
#header .header-nav.header-nav-line nav > ul:not(:hover) li > a.active{
color: #ffffff;
}
#header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li:not(:hover) > a.active:before{
content: "";
position: absolute;
width: 40%;
height: 3px;
top: 99%;
/* left: 15px; */
/* right: 15px; */
margin: 0 auto;
transform: translateY(-3px);
color: #ffffff;
background: #ffffff;
}
#header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li > a:before, #header .header-nav.header-nav-line.header-nav-bottom-line nav > ul > li:hover > a:before {
content: "";
position: absolute;
width: 40%;
height: 3px;
top: 99%;
/* left: 15px; */
/* right: 15px; */
margin: 0 auto;
transform: translateY(-3px);
color: #ffffff;
}
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu{
border-top-color:var(--quaternary);
}
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu li a{
color: var(--quaternary);
}
section.video video{
border-top-left-radius:50px ;
}
}
#header .header-nav-main nav > ul > li.dropdown .dropdown-menu li a:hover{
color: var(--light);
background-color: var(--quaternary);
}
.news-carousel{
}
.news-carousel .owl-nav{
margin-top:35px !important;
}
.ceo-words .owl-nav{
margin-top:-60px !important;
}
@media (max-width: 576px) {
.ceo-words .owl-nav{
margin-top:0 !important;
}
}
.news-carousel.owl-carousel:not(.nav-arrows-1):not(.show-nav-title) .owl-nav button[class*="owl-"]:hover, .owl-carousel:not(.nav-arrows-1):not(.show-nav-title) .owl-nav button[class*="owl-"].hover{
background-color: var(--secondary);
border-color: var(--secondary) ;
}
.ceo-words.owl-carousel:not(.nav-arrows-1):not(.show-nav-title) .owl-nav button[class*="owl-"]:hover{
background-color: var(--light);
border-color: var(--light) ;
}
.news-carousel.owl-carousel:not(.nav-arrows-1):not(.show-nav-title) .owl-nav button[class*="owl-"]{
color: var(--light) ;
background-color: var(--secondary);
border-color: var(--secondary);
}
.ceo-words.owl-carousel:not(.nav-arrows-1):not(.show-nav-title) .owl-nav button[class*="owl-"]{
color: var(--secondary) ;
background-color: var(--light);
border-color: var(--light);
}
.news-carousel.owl-carousel .owl-nav button.owl-prev, .news-carousel.owl-carousel .owl-nav button.owl-next,
.ceo-words.owl-carousel .owl-nav button.owl-prev, .ceo-words.owl-carousel .owl-nav button.owl-next
{
width: 52px !important;
height: 52px !important;
border-radius: 0;
}
.owl-theme .owl-nav .disabled{
color: var(--grey-900) !important;
background-color: var(--light) !important;
border: 2px solid var(--grey-900) !important;
opacity: 10;
}
.owl-theme .owl-nav .disabled:hover{
background-color: var(--light) !important;
}
.ceo-words.owl-theme .owl-nav .disabled{
color: var(--grey) !important;
background-color: var(--light) !important;
border: 2px solid var(--grey-100) !important;
opacity: 10;
}
.owl-carousel.nav-bottom .owl-nav button.owl-next
{
margin-left: 15px;
}
.owl-carousel.show-nav-title .owl-nav button.owl-prev{
left: -70px;
}
.owl-carousel .owl-nav button.owl-next:before{
content: "\f061";
top: 2px !important;
}
.owl-carousel .owl-nav button.owl-prev:before{
content: "\f060";
top: 2px !important;
}
@media (min-width:1200px){
.owl-carousel .owl-nav button.owl-next:before, .owl-carousel .owl-nav button.owl-prev:before{
font-size: 25px !important;
}
}
@media (max-width: 576px) {
.owl-carousel .owl-nav button.owl-next:before, .owl-carousel .owl-nav button.owl-prev:before{
font-size: 25px !important;
}
}
.counters .counter {
text-align: left;
}
.number-counter-opacity{
opacity: 0.9;
}
#footer{
margin-top: 0 !important;
}
.projects-div-container{
margin-top: -155px;
position: relative;
}
@media (max-width: 991px) {
#header .header-nav-main nav {
background: var(--secondary);
}
#header .header-nav-main nav > ul li a{
padding: 2px 5px;
}
#header .header-nav-main nav > ul > li > a.active {
width: 100%;
display: block;
background: white !important;
color: #0039cf !important;
}
.dropdown-item{
color: var(--light);
}
}
#header .header-btn-collapse-nav{
background: var(--light);
color: var(--quaternary);
}
.owl-carousel.carousel-center-active-item-2 .owl-item > div {
width: 60.6666%;
margin-left: auto;
padding: 0;
border-radius: 20px;
background: none;
box-shadow:none;
/*margin-right: -250px !important;*/
transform: scale(0.85);
transition: transform 0.4s ease;
opacity: 0.2;
}
.owl-carousel.carousel-center-active-item-2 .owl-item.active > div {
background: none;
transform: scale(1);
opacity: 1;
}
.owl-carousel.carousel-center-active-item-2 .owl-item:not(.active) > div {
padding:3rem !important;
}
.owl-carousel.carousel-center-active-item-2 .owl-item.active > div * {
/*color: var(--light) !important;*/
padding: 0 !important;
}
#project-slider.owl-carousel .owl-dots .owl-dot span {
width: 12px;
height: 2px;
}
#project-slider.owl-carousel .owl-dots .owl-dot.active span, .owl-carousel .owl-dots .owl-dot:hover span {
background-color: var(--primary);
width: 15px;
}
#project-slider .owl-prev{
background: none !important;
border: none !important;
}
#project-slider .owl-nav button.owl-prev:before{
color: var(--primary);
content: "\f177";
}
#project-slider .owl-next{
background: none !important;
border: none !important;
}
#project-slider .owl-nav button.owl-next:before{
color: var(--primary);
content: "\f178";
}
/*.owl-nav button.owl-next:not(.disabled), .owl-nav button.owl-prev:not(.disabled){
border-color: var(--light);
}*/
.owl-carousel.rounded-nav .owl-nav:not(.disabled) button[class*="owl-"]{
border-color: var(--light);
}
.owl-nav button.owl-next:not(.disabled):before, .owl-nav button.owl-prev:not(.disabled):before{
color: var(--light);
}
html .scroll-to-top{
background: var(--secondary);
}
html .scroll-to-top:hover{
color:var(--light);
}
.owl-carousel.show-nav-title .owl-nav button[class*="owl-"], .owl-carousel.show-nav-title .owl-nav button[class*="owl-"]:hover, .owl-carousel.show-nav-title .owl-nav button[class*="owl-"].hover{
color: var(--quaternary);
}
/*.panel {
position: absolute;
will-change: transform;
}*/
.panels-container {
height: 100vh;
position: relative;
}
.panel:not(:first-child) {
position: absolute;
top: 100vh;
width: 100%;
}
.constructa-panels-container {
height: 100vh;
position: relative;
}
.panel2:not(:first-child) {
/*position: absolute;*/
top: 100vh;
width: 100%;
}
.bg-home {
background: url("../img/home-banner.jpg") no-repeat ;
background-size: cover;
}
@media (max-width: 576px) {
.bg-home {
background-position: center;
}
.section-countries{
background: none !important;
}
.header-logo img{
width: 250px;
}
.bg-map{
background-image: none !important;
}
}
ul.services-list{
list-style: none;
}
ul.services-list li{
border: 2px solid var(--grey);
border-radius: 25px;
margin: 5px;
float: left;
padding: 7px 12px;
}
ul.services-list li a{
color: var(--light);
}
.servises-links span{
border: 2px solid var(--grey);
border-radius: 25px;
margin: 5px;
/*float: left;*/
padding: 7px 15px;
white-space:nowrap;
display: inline-block;
}
.servises-links span a{
color: var(--light);
}
.servises-maximo span{
border: 1px solid var(--grey-100);
margin: 5px;
/*float: left;*/
padding: 7px 15px;
white-space:nowrap;
display: inline-block;
}
.servises-maximo span a{
color: var(--grey-200);
}
.h-75{
height: 75% !important;
}
.h-80{
height: 80% !important;
}
.h-85{
height: 85% !important;
}
.companies.owl-carousel .owl-item img{
width: auto !important;
}
#accordion100{}
#accordion100 .card-body{
background-color: var(--grey-100);
}
#accordion100.accordion-modern-status-primary.accordion-modern-status > .card .card-header a:not(.collapsed) {
background-color: var(--grey-100) !important;
color: var(--black) !important;
}
#accordion100.accordion-modern-status-primary.accordion-modern-status > .card:hover .card-header a.collapsed {
color: var(--primary) !important;
}
ul{
}
ul li{
color: var(--default);
font-size: 18px;
margin-bottom: 6px !important;
}
ul li::marker {
color: var(--secondary); /* Change bullet color */
font-size: 1.5em; /* Optional: make bullet bigger */
}
.social-icons{
}
.social-icons li:not(:first-child){
padding-left: 10px;
}
.social-icons:not(.social-icons-opacity-light):not(.social-icons-transparent):not(.social-icons-clean):not(.social-icons-clean-with-border):not(.social-icons-dark):not(.social-icons-dark-2):not(.custom-social-icons) li a{
background: transparent;
color: var(--light) !important;
}
.social-icons li:hover a{
background: transparent !important;
}
#header .header-nav.header-nav-links nav > ul li:hover > a,
#header .header-nav.header-nav-links nav > ul li > a.is-active,
#header .header-nav.header-nav-links nav > ul li > a.active{
color: var(--light);
/*font-weight: bold;*/
border-bottom: 2px solid var(--light);
text-shadow: 0 0 0 currentColor;
}
#header .header-nav.header-nav-links nav > ul:not(:hover) > li > a.active,
#header .header-nav.header-nav-links nav > ul:not(:hover) > li > a.is-active {
color: var(--light) !important;
}
.btn-secondary:hover{
color: var(--secondary);
background-color: var(--light) !important;
/*border: 1px solid var(--secondary);*/
}
.tabs.tabs-simple.tabs-start .nav-tabs {
justify-content: start !important;
}
.form-control{
border-radius: 0 !important;
}
/* Responsive width utilities for Bootstrap 4 */
@media (min-width: 576px) {
.w-sm-25 { width: 25% !important; }
.w-sm-50 { width: 50% !important; }
.w-sm-75 { width: 75% !important; }
.w-sm-100 { width: 100% !important; }
}
@media (min-width: 768px) {
.w-md-25 { width: 25% !important; }
.w-md-50 { width: 50% !important; }
.w-md-75 { width: 75% !important; }
.w-md-100 { width: 100% !important; }
}
@media (min-width: 992px) {
.w-lg-25 { width: 25% !important; }
.w-lg-50 { width: 50% !important; }
.w-lg-65 { width: 65% !important; }
.w-lg-75 { width: 75% !important; }
.w-lg-85 { width: 85% !important; }
.w-lg-100 { width: 100% !important; }
}
@media (min-width: 1200px) {
.w-xl-25 { width: 25% !important; }
.w-xl-50 { width: 50% !important; }
.w-xl-75 { width: 75% !important; }
.w-xl-100 { width: 100% !important; }
}
@media (min-width: 1400px) {
.w-xxl-25 { width: 25% !important; }
.w-xxl-50 { width: 50% !important; }
.w-xxl-75 { width: 75% !important; }
.w-xxl-100 { width: 100% !important; }
}
.corner-frame {
position: relative;
display: inline-block;
}
.corner-frame img {
display: block;
width: 100%; /* Bootstrap responsive image */
height: auto;
}
.corner {
position: absolute;
width: 12px; /* Length of corner lines */
height: 12px;
border: 2px solid white; /* Corner color */
}
.corner-tl {
top: 20px;
left: 20px;
border-right: none;
border-bottom: none;
}
.corner-tr {
top: 20px;
right: 20px;
border-left: none;
border-bottom: none;
}
.corner-bl {
bottom: 20px;
left: 20px;
border-right: none;
border-top: none;
}
.corner-br {
bottom: 20px;
right: 20px;
border-left: none;
border-top: none;
}
@media (min-width: 992px) { /* lg breakpoint */
.vh-lg-100 {
height: 100vh !important;
}
.vh-lg-40 {
height: 40vh !important;
}
.vh-lg-50 {
height: 50vh !important;
}
.vh-lg-65 {
height: 65vh !important;
}
.vh-lg-75 {
height: 75vh !important;
}
}
.vh-25 {
height: 25vh !important;
}
.vh-40 {
height: 40vh !important;
}
.vh-50 {
height: 50vh !important;
}
.vh-65 {
height: 65vh !important;
}
.vh-75 {
height: 75vh !important;
}
.hs-300 {
height: 300px !important;
}
.hs-250 {
height: 250px !important;
}
.nav-link{
color: var(--light);
}
.nav-link:hover{
color: var(--light);
/*font-weight: bold;*/
text-shadow: 0 0 0 currentColor;
}
#topnav .is-active{
background: none;
text-shadow: 0 0 0 currentColor;
}
html body .btn-light:hover, html body .btn-light.hover, html body .btn-outline.btn-light:hover, html body .btn-outline.btn-light.hover {
background-color: #ffffff;
border-color: #ffffff;
color: var(--primary);
}
/* Base style for panels */
.column-panel {
flex-grow: 1;
transition: flex-grow 0.4s ease;
cursor: pointer;
min-height: 220px; /* keeps good height on mobile */
}
/* Expand hovered column on desktop only */
@media (min-width: 992px) { /* lg and up */
.column-panel:hover {
flex-grow: 4;
}
.text-lg-21 {
font-size: 7.66em !important;
}
.text-lg-22 {
font-size: 8.66em !important;
}
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu {
background: var(--holding-color);
}
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown li a {
border-bottom-color: var(--light);
}
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu > li > a {
color: var(--light);
}
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu > li:hover > a,
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu > li:focus > a,
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu > li:active > a,
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu > li.active > a,
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu > li.open > a,
#header .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu > li.accessibility-open > a{
background-color: var(--holding-top-color);
}
.sticky-header-active #header .hide-mobile .header-nav{
align-self: end !important;
}
.sticky-header-active #header .header-top{
border: 0 !important;
}
}
.btn-outline.btn-secondary:hover, .btn-outline.btn-secondary.hover {
color: var(--secondary-inverse);
background-color: var(--secondary) !important;
border-color: var(--secondary);
}
.bg-primary-200{
background-color: var(--primary-200) !important;
}
.text-color-projects{
color: var(--projects-color) !important;
}
.bg-projects{
background-color: var(--projects-color) !important;
}
.btn-projects{
background-color: var(--projects-color) !important;
}
.btn-projects:hover{
color: var(--light) !important;
}
.bg-utilities{
background-color: var(--utilities-color) !important;
}
.btn-utilities{
background-color: var(--utilities-color) !important;
}
.btn-utilities:hover{
color: var(--light) !important;
}
.text-color-utilities{
color: var(--utilities-color) !important;
}
.bg-utilities-100{
background-color: var(--utilities-color-100) !important;
}
.bg-utilities-200{
background-color: var(--utilities-color-200) !important;
}
.bg-utilities-300{
background-color: var(--utilities-color-300) !important;
}
.bg-utilities-400{
background-color: var(--utilities-color-400) !important;
}
.bg-utilities-500{
background-color: var(--utilities-color-500) !important;
}
.bg-utilities-top{
background-color: var(--utilities-top-color) !important;
}
.text-color-industries{
color: var(--industries-color) !important;
}
.bg-industries{
background-color: var(--industries-color) !important;
}
.bg-industries-100{
background-color: var(--industries-color-100) !important;
}
.bg-industries-200{
background-color: var(--industries-color-200) !important;
}
.bg-industries-300{
background-color: var(--industries-color-300) !important;
}
.bg-industries-400{
background-color: var(--industries-color-400) !important;
}
.bg-industries-top{
background-color: var(--industries-top-color) !important;
}
.btn-industries{
background-color: var(--industries-color) !important;
}
.btn-industries:hover{
color: var(--light) !important;
}
.bg-technology{
background-color: var(--technology-color) !important;
}
.btn-technology{
background-color: var(--technology-color) !important;
}
.btn-technology:hover{
color: var(--light) !important;
}
.text-color-technology{
color: var(--technology-color) !important;
}
.bg-technology-100{
background-color: var(--technology-color-100) !important;
}
.bg-technology-200{
background-color: var(--technology-color-200) !important;
}
.bg-technology-300{
background-color: var(--technology-color-300) !important;
}
.bg-technology-400{
background-color: var(--technology-color-400) !important;
}
.bg-technology-top{
background-color: var(--technology-top-color) !important;
}
.bg-academy{
background-color: var(--academy-color) !important;
}
.bg-academy-top{
background-color: var(--academy-top-color) !important;
}
.text-color-academy{
color: var(--academy-color) !important;
}
.btn-academy{
background-color: var(--academy-color) !important;
}
.btn-academy:hover{
color: var(--light) !important;
}
/* Custom transparent background */
.btn-outline.btn-light.btn-semi-transparent {
background-color: rgba(255, 255, 255, 0.2); /* 20% white */
border: 1px solid rgba(255, 255, 255, 0.3); /* subtle border */
backdrop-filter: blur(4px); /* optional: glass effect */
}
.btn-semi-transparent:hover {
/*background-color: rgba(255, 255, 255, 0.35);*/ /* stronger on hover */
}
.my-disabled-btn {
cursor: default !important;
pointer-events: none; /* optional: prevent clicks */
}
.featured-projects .owl-stage{
overflow: hidden;
padding-left: 0 !important; /* hide left padding */
}
.featured-projects.owl-carousel.show-nav-title .owl-nav{
margin-top: -60px;
}
.featured-projects.owl-carousel.show-nav-title .owl-nav button.owl-prev {
left: -140px;
}
.text-overlay{
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, .2));
padding: 12px 15px;
/* display: inline-block; */
border-radius: 25px;
}
.text-overlay-shadow{
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
}
/* plyr style */
:root {
--plyr-color-main: var(--holding-color);
--plyr-video-control-color: #fff;
--plyr-video-control-background-hover: rgba(255,255,255,0.2);
}
.ytp-chrome-top,
.ytp-title,
.ytp-share-button,
.ytp-show-cards-title,
.ytp-button {
display: none !important;
}
nav.pagination-wrapper ul.pagination{
margin-bottom: 0;
}
@media (max-width: 576px) {
.featured-projects.owl-carousel.show-nav-title .owl-nav button.owl-prev {
left: -95px;
}
.owl-carousel.nav-lg.rounded-nav .owl-nav button.owl-prev, .owl-carousel.nav-lg.rounded-nav .owl-nav button.owl-next{
width: 40px;
height: 40px;
}
.divider{
margin: 0;
}
.hide-mobile{
display: none !important;
}
}
.featured-projects.owl-carousel .owl-nav button.owl-prev:before {
content: "\f104";
top: 2px !important;
}
.featured-projects.owl-carousel .owl-nav button.owl-next:before {
content: "\f105";
top: 2px !important;
}
/* menu */
/* Burger button */
.burger-btn {
width: 40px;
height: 22px;
position: relative;
border: none;
background: none;
cursor: pointer;
z-index: 10001;
}
.burger-btn span {
display: block;
height: 3px;
width: 100%;
background: var(--light);
margin-bottom: 5px;
transition: all 0.3s ease;
}
.burger-btn.open span:nth-child(1) {
transform: rotate(45deg) translate(5px, 5px);
}
.burger-btn.open span:nth-child(2) {
opacity: 0;
}
.burger-btn.open span:nth-child(3) {
transform: rotate(-45deg) translate(6px, -6px);
}
/* Fullscreen nav overlay */
#mainNav {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background: var(--secondary);*/
display: flex;
align-items: start;
justify-content: start;
flex-direction: column;
z-index: 10000;
opacity: 0;
visibility: hidden;
transform: translateY(-20px);
transition: all 0.4s ease;
}
#mainNav.active {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
/* Menu items */
#mainNav ul {
list-style: none;
padding: 0;
margin: 0;
/*text-align: center;*/
}
#mainNav ul li {
/*margin: 20px 0;*/
opacity: 0;
/*transform: translateY(20px);*/
transition: all 0.4s ease;
}
#mainNav.active ul li {
opacity: 1;
transform: translateY(0);
}
#mainNav ul li:nth-child(1) { transition-delay: 0.1s; }
#mainNav ul li:nth-child(2) { transition-delay: 0.2s; }
#mainNav ul li:nth-child(3) { transition-delay: 0.3s; }
#mainNav ul li:nth-child(4) { transition-delay: 0.4s; }
#mainNav ul li:nth-child(5) { transition-delay: 0.5s; }
#mainNav ul li a {
font-size: 28px;
font-weight: bold;
color: #fff;
text-decoration: none;
transition: color 0.3s;
}
#mainNav ul li a:hover {
color: #f5b900; /* Porto accent */
}
/* Scroll lock */
/*body.menu-open {
overflow: hidden;
}*/
/* prevent scroll burger button */
body.menu-open #mobileMenuToggle{
position: fixed;
}
.bg-holding{
background-color: var(--holding-color) !important;
}
.bg-holding-top{
background-color: var(--holding-top-color) !important;
}
.bg-holding-100{
background-color: var(--holding-color-100) !important;
}
.text-color-holding{
color: var(--holding-color) !important;
}
.text-color-secondary.apply-color-children p, .text-color-secondary.apply-color-children, .text-color-secondary.apply-color-children ul li,
.text-color-secondary.apply-color-children h1,
.text-color-secondary.apply-color-children h2,
.text-color-secondary.apply-color-children h3,
.text-color-secondary.apply-color-children h4,
.text-color-secondary.apply-color-children h5,
.text-color-secondary.apply-color-children h6{
color: var(--secondary);
}
.special-date-separator{
background: url("../img/icons/point.webp") no-repeat ;
background: url(/web/themes/madkour/img/icons/point.webp) no-repeat;
background-position: center;
background-size: contain;
height: 40px;
position: absolute;
width: 40px;
top: -20px;
left: 0;
}
@media (max-width: 576px) {
.special-date-separator-wrapper{
margin: 30px auto !important;
}
}
.two-lines {
line-height: 1.3em; /* define line-height relative to font */
min-height: calc(1.3em * 2); /* two lines tall */
max-height: calc(1.3em * 2);
/*overflow: hidden;*/ /* prevent extra text overflow */
}
@media (min-width: 992px) { /* lg breakpoint */
.w-lg-100 {
width: 100% !important;
}
.w-lg-40 {
width: 40% !important;
}
.w-lg-50 {
width: 50% !important;
}
.w-lg-60 {
width: 60% !important;
}
.w-lg-65 {
width: 65% !important;
}
.w-lg-75 {
width: 75% !important;
}
}
.w-40 {
width: 40% !important;
}
.w-60 {
width: 60% !important;
}
.w-65 {
width: 65% !important;
}
.w-75 {
width: 75% !important;
}
@media (min-width: 992px) { /* lg breakpoint in Bootstrap */
.position-lg-absolute {
position: absolute !important;
}
.position-lg-relative {
position: relative !important; /* or relative if you prefer */
}
}
.list-bullets-light ul li::marker
{
color: var(--light) !important;
}
.list-bullets-secondary ul li::marker
{
color: var(--secondary) !important;
}
.contact-form label, .apply-for-job-form label {
display: block;
color: var(--holding-color);
font-size: 1.2em !important;
text-align: left;
text-transform: uppercase;
}
.contact-form input[type="text"], .contact-form input[type="email"], .apply-for-job-form input[type="text"], .apply-for-job-form input[type="email"]{
width: 100%;
border: 0;
border-radius: 15px;
background-color: var(--light) !important;
padding: 24px 16px;
margin-bottom: 20px;
font-size: 20px;
font-weight: lighter;
color: var(--secondary);
}
.contact-form textarea, .apply-for-job-form textarea {
width: 100%;
border: 0;
border-radius: 15px;
background-color: var(--light) !important;
padding: 24px 16px;
margin-bottom: 20px;
font-size: 20px;
font-weight: lighter;
color: var(--secondary);
resize: none;
}
.contact-form input[type="submit"], .apply-for-job-form input[type="submit"]{
background: var(--holding-color);
border: 0;
color: var(--light);
font-size: 20px;
font-weight: 600;
padding: 10px 19px;
width: 32%;
border-radius: 24px;
text-align: left;
display: block;
/*margin-top: -30px;*/
position: relative;
z-index: 10;
margin-left: auto;
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
background-position: center right 3px;
background-size: 40px 30px;
cursor: pointer;
}
.search-form label {
display: block;
color: var(--holding-color);
font-size: 1.2em !important;
text-align: left;
text-transform: uppercase;
}
.search-form input[type="text"], .search-form input[type="search"]{
width: 100%;
border: 0;
border-radius: 15px;
background-color: var(--light) !important;
padding: 24px 16px;
margin-bottom: 20px;
font-size: 20px;
font-weight: lighter;
color: var(--secondary);
}
.search-form .search-help-link{
display:none !important;
}
.search-form input[type="submit"], .apply-for-job-form input[type="submit"]{
background: var(--holding-color);
border: 0;
color: var(--light);
font-size: 20px;
font-weight: 600;
padding: 10px 19px;
width: 32%;
border-radius: 24px;
text-align: left;
display: block;
position: relative;
z-index: 10;
margin-left: auto;
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
background-position: center right 3px;
background-size: 40px 30px;
cursor: pointer;
}
.newsletter-form input[type="email"]{
width: 100%;
border: 0;
border-radius: 15px;
background-color: var(--light) !important;
padding: 3px 20px;
font-size: 15px;
font-weight: lighter;
color: var(--secondary);
}
.newsletter-form input[type="submit"]{
padding: 5px 30px !important;
}
.apply-for-job-form .form-managed-file{
border-radius: 15px;
background-color: var(--light) !important;
padding: 24px 16px;
margin-bottom: 20px;
font-size: 17px;
color: var(--secondary);
}
.apply-for-job-form .form-managed-file .form-submit{
font-size: 16px;
width: auto;
background-image: none;
}
.apply-for-job-form .form-item-upload-resume .description{
color: var(--secondary);
border: 1px solid var(--secondary);
padding: 10px;
border-radius: 5px;
margin: 5px auto;
}
.confirm-message-success{
background-color: var(--secondary);
color: var(--light);
border-radius: 25px;
padding: 20px;
text-align: center;
font-size: 18px;
}
/* Target the Drupal error message wrapper */
[data-drupal-messages] [role="alert"] {
background-color: #f8d7da; /* light red background */
color: #721c24; /* dark red text */
border: 1px solid #f5c6cb; /* border in same tone */
border-radius: 10px; /* rounded corners */
padding: 1rem 1.25rem; /* spacing inside */
margin: 1rem 0; /* space around */
font-size: 0.95rem;
line-height: 1.5;
position: relative;
}
/* Optional: add an alert icon before the message */
[data-drupal-messages] [role="alert"]::before {
content: "⚠️"; /* you can replace with SVG background if needed */
margin-right: 0.5rem;
font-size: 1.2rem;
display: inline-block;
vertical-align: middle;
}
/* Make the placeholder (like email) stand out */
[data-drupal-messages] .placeholder {
font-weight: bold;
color: var(--secondary);
text-decoration: underline;
background-color: var(--light);
}
[data-drupal-messages] ul li {
color: var(--secondary) !important;
}
#views-exposed-form-all-projects-block-1{
}
#views-exposed-form-all-projects-block-1 input[type="submit"]{
background: var(--holding-color);
border: 0;
color: var(--light);
font-size: 18px;
font-weight: 600;
padding: 6px 19px;
width: 32%;
border-radius: 24px;
text-align: left;
display: block;
/*margin-top: -30px;*/
position: relative;
z-index: 10;
/*margin-left: auto;*/
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
background-position: center right 3px;
background-size: 40px 30px;
cursor: pointer;
}
#views-exposed-form-all-projects-block-1 .form-item-field-related-company-target-id,
#views-exposed-form-all-projects-block-1 .form-item-field-country-target-id
{
color: var(--holding-color) !important;
font-size: 18px;
/*margin-bottom: 5px !important;*/
}
.mfp-close, .mfp-close-btn-in .mfp-close{
color: #ffffff;
}
.social-icons:not(.social-icons-opacity-light):not(.social-icons-transparent):not(.social-icons-clean):not(.social-icons-clean-with-border):not(.social-icons-dark):not(.social-icons-dark-2):not(.custom-social-icons) li{
box-shadow: none !important;
}
@media (max-width: 991px) {
#header #mainNav nav > ul li.dropdown.open > .dropdown-menu
{
display: block;
margin-left: 20px !important;
background: transparent;
padding: 0;
margin: 0;
/*font-size: 13px;*/
box-shadow: none;
border-radius: 0;
border: 0;
clear: both;
/*display: none;*/
float: none;
position: static;
}
#header #mainNav nav > ul li.dropdown a.dropdown-toggle::after{
display: none !important;
}
#header #mainNav nav > ul li.dropdown > ul li > a.dropdown-item:focus,
#header #mainNav nav > ul li.dropdown > ul li > a.dropdown-item:hover{
background: none !important;
}
#header #mainNav nav > ul li.active a, #header #mainNav nav > ul li a.active{
background: none !important;
}
}
.language-switcher ul{
--bs-nav-link-padding-x: 1rem;
--bs-nav-link-padding-y: 0.5rem;
--bs-nav-link-font-weight: ;
--bs-nav-link-color: var(--bs-link-color);
--bs-nav-link-hover-color: var(--bs-link-hover-color);
--bs-nav-link-disabled-color: var(--bs-secondary-color);
display: flex;
flex-wrap: wrap;
padding-left: 0;
margin-bottom: 0;
list-style: none;
}
.language-switcher a, .language-switcher a:hover{
color: var(--light);
}
.language-switcher .is-active {
display: none;
}
.language-switcher.mobile{
padding: 10px 15px;
}
.language-switcher.mobile a{
font-size: 20px !important;
}
#header .header-nav-features:before, #header .header-nav-features:after
{
background: rgba(255, 255, 255, 0.9) !important;
}