/* Theme Name: POS
Author: Firefly Agency
Website: www.fireflyagency.ae
Author URI: www.fireflyagency.ae
Description: Website created by FireFly Agency
*/

body {
    margin: 0;
    background: #0C2120;
    font-family: Poppins;
    color: #FFF;
    font-style: normal;
    line-height: normal;
    font-weight: 300;
}

a {
    text-decoration: none;
    color: #FFF;
}

.navbar img{max-width:100px;}

.btn:focus {
    box-shadow: none;
}

a.nav-link:focus {
    color: #FFF;
}

.nav-link:focus, .nav-link:hover,
.navbar-nav .nav-item .nav-link:focus {
    color: #FFF;
}

.form-control:focus {
    box-shadow: none;
}

.btn-close:focus,
.navbar-toggler:focus {
    border: 0 !important;
    box-shadow: none;
}

.quickcontact {
    display: none !important;
}

.navbar ul.navbar-nav {
    display: none;
}

.navbar .redirectbtn {
    display: none;
}

.redirectbtn:hover {
    background-color: #FFFFFF;
    color: #0D2524;
}

.navbar-toggler-icon.custom-toggler {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23FFF' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    background-size: 1.5em 1.5em;
}

.offcanvas-body ul li a {
    position: relative;
    padding-bottom: 5%;
}

.offcanvas-body ul li a:before {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    background: #FFF;
    bottom: 0;
    left: 0;
}

.backimg {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 845px;
}

.navbar {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 4;
}

.nav-link {
    color: #FFF;
    font-size: 16px;
}

h1 {
    font-size: 28px;
}

.title {
    font-size: 14px;
}

h2 {
    font-size: 18px;
    font-weight: 300;
}

h4 {
    /* font-size: 40px; */
    font-size: 22px;
    font-weight: 300;
    line-height: 1.5;
}

.card {
    cursor: pointer;
}

p.card-text {
    font-size: 14px;
    color:#FFF;
}

.toppadding {
    padding-top: 10%;
    padding-bottom: 10%;
}

.desktopview {
    display: none;
}

.mobileview {
    display: flex;
}

.owl-theme .owl-nav [class*=owl-]:hover {
    background: none;
}

h3 {
    font-size: 18px;
    font-weight: 300;
}

.overlaydiv {
    top: 5%;
}

@keyframes infiniteScroll {
from {
    transform: translateX(0);
}

to {
    transform: translateX(-50%);
}
}

.sustainability-carousel.owl-carousel .owl-stage {
    display: flex;
    width: max-content !important;
    animation: infiniteScroll 0.1s linear infinite;
    will-change: transform;
}

.sustainability-carousel.owl-carousel .owl-stage {
    display: flex;
    width: max-content !important;
    animation: infiniteScroll 70s linear infinite;
    will-change: transform;
}

.sustainability-carousel.owl-carousel .item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
}

.sustainability-carousel .item p {
    margin: 0;
    display: flex;
    align-items: center;
}

.feature-icon svg::after {
    content: "";
    width: 1px;
    height: 30px;
    background-color: white;
    display: block;
}

#insights .owl-nav {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.owl-nav button:hover svg path {
    fill: #63F0D4;
}

.btnhover:hover svg path,
.btnhover:hover {
    color: #FFF !important;
    fill: #FFF;
}


footer p:not(.buildby):hover a {
    color: #63F0D4 !important;
}

footer p:not(.buildby):hover,
.navbar .nav-item .nav-link:hover {
    color: #63F0D4;
}

.buildby:hover a {
    color: #63F0D4 !important;
}

footer h6 {
    font-size: 16px;
    font-weight: 600;
}

footer p {
    font-size: 14px;
    cursor: pointer;
}

.sustainable .overlaydiv {
    right: 0%;
    margin-top: 10%;
    padding: 5%;
}

.sustainable.backimg {
    height: 493px;
}

footer .linkdiv {
    gap: 33%;
}

.contactcard p {
    font-size: 16px;
}

.contactcard h6 {
    font-size: 16px;
}

.paddingleftright {
    padding-left: 6%;
    padding-right: 6%;
    padding-top: 6%;
}

.btn.redirectbtn:hover {
    background-color: #FFF !important;
    color: #0D2524 !important;
}

.contact .herosection {
    height: 870px !important;
}

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

.contactcard .card {
    right: 5px;
}

.form-label {
    font-size: 14px;
}

ul.points li {
    font-size: 16px;
    color:#FFF;
}

.line {
    flex-grow: 1;
    height: 1px;
    background-color: #FFFFFF;
    margin-right: 10px;
}

.contactform .wpcf7-form-control {
    background: transparent;
    border: none;
    border-bottom: 1px solid #ffffff;
    font-weight:100;
    border-radius: 0;
    color: #ffffff;
}

.contactform .wpcf7-select {
    appearance: none;
    background-image: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22 fill=%22none%22%3E%3Cpath d=%22M10.0003 12.9166L13.7503 9.16663L12.5628 7.99996L10.0003 10.5625L7.43783 7.99996L6.25033 9.16663L10.0003 12.9166ZM10.0003 18.3333C8.84755 18.3333 7.76421 18.1145 6.75033 17.677C5.73644 17.2395 4.85449 16.6458 4.10449 15.8958C3.35449 15.1458 2.76074 14.2638 2.32324 13.25C1.88574 12.2361 1.66699 11.1527 1.66699 9.99996C1.66699 8.84718 1.88574 7.76385 2.32324 6.74996C2.76074 5.73607 3.35449 4.85413 4.10449 4.10413C4.85449 3.35413 5.73644 2.76038 6.75033 2.32288C7.76421 1.88538 8.84755 1.66663 10.0003 1.66663C11.1531 1.66663 12.2364 1.88538 13.2503 2.32288C14.2642 2.76038 15.1462 3.35413 15.8962 4.10413C16.6462 4.85413 17.2399 5.73607 17.6774 6.74996C18.1149 7.76385 18.3337 8.84718 18.3337 9.99996C18.3337 11.1527 18.1149 12.2361 17.6774 13.25C17.2399 14.2638 16.6462 15.1458 15.8962 15.8958C15.1462 16.6458 14.2642 17.2395 13.2503 17.677C12.2364 18.1145 11.1531 18.3333 10.0003 18.3333ZM10.0003 16.6666C11.8614 16.6666 13.4378 16.0208 14.7295 14.7291C16.0212 13.4375 16.667 11.8611 16.667 9.99996C16.667 8.13885 16.0212 6.56246 14.7295 5.27079C13.4378 3.97913 11.8614 3.33329 10.0003 3.33329C8.13921 3.33329 6.56283 3.97913 5.27116 5.27079C3.97949 6.56246 3.33366 8.13885 3.33366 9.99996C3.33366 11.8611 3.97949 13.4375 5.27116 14.7291C6.56283 16.0208 8.13921 16.6666 10.0003 16.6666Z%22 fill=%22white%22/%3E%3C/svg%3E');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 20px;
}

.contactform .wpcf7-submit.btn-link {
    color: #0C2120;
    font-weight: normal;
    text-decoration: none;
    background: #64f0d4;
    border: none;
    padding: 10px 30px;
    display: inline-flex;
    border-radius: 10px;
    align-items: center;
    margin-top: 10px;
}

.contactform .wpcf7-submit.btn-link::after {
    content: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cpath d="M2.5 9.16663L14.3125 9.16663L13 7.83329L14.1667 6.66663L17.5 9.99996L14.1667 13.3333L13 12.1666L14.3125 10.8333L2.5 10.8333V9.16663Z" fill="%2363F0D4"/%3E%3C/svg%3E');
    margin-left: 5px;
}

.contactform .wpcf7-textarea {
    height: auto;
}

.wpcf7-not-valid-tip{
    position:relative;
    top:10px;
}

.wpcf7-form-control::-webkit-input-placeholder{
    color:#ffffff;
}

.wpcf7-response-output{
    padding-bottom: 30px;
}

.screen-reader-response{
    display: none;
}

.send-btn p{
    display:flex;
    gap:1px;
}

.nav-link:hover {
    cursor: pointer;
}

.nav-link.current {
    font-weight: 600;
}

.paddingtop {
    padding-top: 40%;
}

.subsidiary .paddingtop {
    padding-top: 100%;
}

.industries .paddingtop {
    padding-top: 60%;
}

.custom-card {
    width: 250px;
}

.min-height {
    min-height: 345px;
}

.sustainable.backimg.industry {
    height: 540px;
}

.partnership-card ul li {
    line-height: 1.8;
}

.partnership-card ul li p span {
    font-weight: 700;
}

.dropdown-menu {
    background-color: #0D2524;
}

.dropdown-menu li a {
    font-size: 16px;
    color: #FFF;
}

.dropdown-item:hover {
    color: #63F0D4;
    background-color: #0D2524;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #0D2524;
}

.contact-info-wrapp {
    height: 100%;
    overflow: hidden;
}

option {
    background: #000000;
    color: #ffffff;
    padding: 10px;
}

option:hover {
    background: #000000 !important;
    color: #63F0D4 !important;
}

.error-container{
    background: rgba(0, 0, 0, 0.5);
    padding:20px;
    padding-bottom:40px;
    backdrop-filter: blur(10px);
}

@media (min-width: 576px) {

    .container {
	max-width: 100%;
	padding-left: 6%;
	padding-right: 6%;
    }

    h1 {
	font-size: 34px;
    }

    h2 {
	font-size: 25px;
    }

    .title {
	font-size: 16px;
    }

    .toppadding {
	padding-top: 5%;
	padding-bottom: 5%;
    }

    .sustainable .overlaydiv {
	right: 6%;
	margin-top: 5%;
	padding: 3%;
    }

    footer .linkdiv {
	gap: 0%;
    }

    footer p {
	font-size: 14px;
    }

    .contactcard .card {
	right: 16px;
    }

    .min-height {
	min-height: 320px;
    }

    .industries .paddingtop {
	padding-top: 40%;
    }

    .sustainable.backimg.industry {
	height: 570px;
    }
}

@media (min-width: 768px) {

    .container {
	max-width: 100%;
	padding-left: 6%;
	padding-right: 6%;
    }

    h1 {
	font-size: 40px;
    }

    h2 {
	font-size: 32px;
    }

    h3 {
	font-size: 20px;
    }

    p.card-text,
    .card-title.title {
	font-size: 14px;
    }

    #tailored h5.card-title.title {
	font-size: 18px;
    }


    .sustainable .overlaydiv {
	padding: 5%;
    }

    .sustainable.backimg {
	height: 530px;
    }

    footer h6,
    footer p {
	font-size: 16px;
    }

    .custom-card {
	width: 300px;
    }

    .min-height {
	min-height: 300px;
    }

    .subsidiary .paddingtop {
	padding-top: 80%;
    }

    h4 {
	font-size: 26px;
    }

    .sustainable.backimg.industry {
	height: 525px;
    }
}

@media (min-width: 992px) {

    .container {
	max-width: 100%;
	padding-left: 6%;
	padding-right: 6%;
    }

    .quickcontact {
	display: flex !important;
    }

    .navbar ul.navbar-nav {
	display: flex;
    }

    .navbar .redirectbtn {
	display: flex;
    }

    .card-title.title {
	font-size: 16px;
    }

    p.card-text {
	font-size: 14px;
    }

    .sustainable.backimg {
	height: 635px;
    }

    .contact .herosection {
	height: 884px !important;
    }

    .contactcard .card {
	right: 0;
    }

    .paddingtop {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
    }

    footer h6,
    footer p {
	font-size: 14px;
    }

    .min-height {
	min-height: 330px;
    }

    .subsidiary .paddingtop {
	padding-top: 50%;
    }

    .industries .paddingtop {
	padding-top: 30%;
    }

    .sustainable.backimg.industry {
	height: 565px;
    }
}

@media (min-width: 1200px) {

    .container {
	max-width: 100%;
	padding-left: 6%;
	padding-right: 6%;
    }

    h1 {
	font-size: 60px;
    }

    h2 {
	font-size: 30px;
    }

    h3 {
	font-size: 30px;
    }

    .card-title.title {
	font-size: 20px;
    }

    .uniqueadvan p.card-text {
	font-size: 14px;
    }

    p.card-text {
	font-size: 16px;
    }

    .toppadding {
	padding-top: 3%;
	padding-bottom: 3%;
    }

    .sustainable.backimg {
	height: 944px;
    }

    .sustainable .overlaydiv {
	padding: 3%;
    }

    footer .linkdiv {
	gap: 2%;
    }

    .contact .herosection {
	height: 1070px !important;
    }

    .paddingtop {
	padding-top: 35%;
	flex-direction: row;
    }

    .custom-card {
	width: 245px;
    }

    .min-height {
	min-height: 370px;
    }

    .subsidiary .paddingtop {
	padding-top: 30%;
    }

    .sustainable.backimg.industry {
	height: 765px;
    }

    .customCard {
	min-height: 250px;
    }
}

@media (min-width: 1400px) {

    .container {
	max-width: 100%;
	padding-left: 6%;
	padding-right: 6%;
    }

    h1 {
	font-size: 64px;
    }

    h2 {
	font-size: 42px;
    }

    .sustainable .overlaydiv {
	padding: 5%;
    }

    .uniqueadvan p.card-text {
	font-size: 16px;
    }

    .contact .herosection {
	height: 1080px !important;
    }

    .mobileview.owl-carousel.owl-loaded, .mobileview {
	display: none;
    }

    .desktopview {
	display: flex;
    }

    .custom-card {
	width: 300px;
    }

    .paddingtop {
	padding-top: 25%;
    }

    .min-height {
	min-height: 440px;
    }

    .subsidiary .paddingtop {
	padding-top: 25%;
    }

    h4 {
	font-size: 40px;
    }

    .subsidiary.backimg {
	height: 1080px;
    }

    .industries .paddingtop {
	padding-top: 25%;
    }

    .customCard {
	min-height: 195px;
    }

    .sustainable.backimg.industry {
	height: 740px;
    }
}