/* Colors
================================*/
:root {
  --primary-main: #10243D;
  --primary-hover: #18518c;
  --primary-focus: #18518c;
  --primary-light: #e4eefa;
  --primary-light-hover: #c3dbf4;
  
  --gray-25:#FCFCFC;
  --gray-50:#FAFAFA;
  --gray-100:#F5F5F5;
  --gray-200:#E5E5E5;
  --gray-300:#D6D6D6;
  --gray-400:#A3A3A3;
  --gray-500:#737373;

  --text-primary: #141414;
  --text-secondary: #737373;
  --text-muted: #A3A3A3;
  
  --white: #FFF;
  --black: #000;
  --white-rgba: rgba(255, 255, 255, 0.1);
  --black-rgba: rgba(0, 0, 0, 0.1);
  
  --state-success: #17B26A;
  --state-danger: #F04438;
  --state-warning: #F79009;
  
  --yellow: #FAC515;
  --cyan: #22CCEE;
  --purple: #A48AFB;
  --green: #3CCB7F;
  --orange: #FF692E;
  
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
}

/* Reset CSS
================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
img { max-width: 100%; vertical-align: middle; border: none; border-radius: 0 }
button, input, select, textarea { resize: none; border: 0; border-radius: 0; -webkit-border-radius: 0; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; font-family: "Inter", sans-serif; }
ul, li { list-style: none; }
a { text-decoration: none; transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; -moz-transition: all ease-in-out 0.3s; }
sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline }
sup { top: -0.5em }
sub { bottom: auto; }
strong { font-weight: 600; }

/* Body CSS
================================*/
body { overflow-x: hidden; font-size: 16px; font-family: "Inter", sans-serif; font-weight: normal; font-optical-sizing: auto; font-style: normal; letter-spacing: -0.3px; }
section { position: relative; }
.sec-padding { padding: 120px 0; }
.sec-padding-sm { padding: 80px 0; }
.sec-padding-xs { padding: 56px 0; }

/* Typography
================================*/
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { line-height: 130%; color: var(--text-primary); font-weight: normal; letter-spacing: -1px; }
h1, .h1 { font-size: 48px; letter-spacing: -1.5px; }
h2, .h2 { font-size: 40px; letter-spacing: -1.5px; }
h3, .h3 { font-size: 36px; }
h4, .h4 { font-size: 28px; }
h5, .h5 { font-size: 24px; }
h6, .h6 { font-size: 20px; }
.text-lg { font-size: 20px; }
.text-md { font-size: 18px; }
.text-rg { font-size: 16px; }
.text-sm { font-size: 14px; }
.text-xs { font-size: 12px; }
p { line-height: 155%; color: var(--text-secondary); }
.text-bold, strong { font-weight: 700; }
.text-medium { font-weight: 500 }

/* Text & Background colors
================================*/
.gmp .text-primary { color: var(--text-primary) !important; }
.gmp .text-secondary { color: var(--text-secondary) !important; }
.gmp .text-muted { color: var(--text-muted) !important; }
.gmp .text-blue { color: var(--primary-main); }

/* Button css
================================*/
.gmp .btn { gap: 6px; border-radius: 4px; font-size: 16px; font-weight: 500; padding: 0 20px; height: 48px; display: inline-flex; align-items: center !important; justify-content: center; transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; border-width: 1.5px; }
.gmp .btn-sm { height: 40px; padding: 0px 16px; }
.gmp .btn-primary { background-color: var(--primary-main); border-color: var(--primary-main); }
.gmp .btn-primary:hover { background-color: var(--primary-hover); border-color: var(--primary-hover); }
.gmp .btn-primary:focus { background-color: var(--primary-focus); border-color: var(--primary-focus); }
.gmp .btn-outline-primary { color: var(--primary-main); border-color: var(--primary-main); }
.gmp .btn-outline-primary:hover { color: var(--white); border-color: var(--primary-hover); background: var(--primary-hover); }
.gmp .btn-outline-primary:hover { color: var(--white); border-color: var(--primary-focus); background: var(--primary-focus); }
.gmp .text-link { font-weight: 500; display: inline-flex; gap: 8px; position: relative; align-items: center; color: var(--primary-main); }
.gmp .text-link:after { content: url('../images/arrow-right.svg'); height: 20px; width: 20px; transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in; }
.gmp .text-link:hover { color: var(--text-secondary); }
.gmp .text-link:hover:after { content: url('../images/arrow-right-hover.svg'); }
.gmp .btn-dark { background: var(--text-primary); border-color: var(--text-primary); }
.gmp .btn-dark:hover, .gmp .btn-dark:focus { background: #212529; border-color: #212529; }

/*Form CSS
================================*/
.gmp .form-control, .gmp .form-select { background-color: var(--white); padding: 8px 16px !important; height: 56px; border-color: #D0D5DD; box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05); border-radius: var(--radius-sm); }
.gmp .form-check-input { height: 20px; width: 20px; box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05) !important; background-color: var(--white); margin-top: 0; border-color: #D0D5DD; margin-left: -2rem; }
.gmp .form-control { background-image: none; }
.gmp .form-check { padding-left: 2rem }
.gmp .form-check-input:checked { background-color: var(--primary-main); border-color: var(--primary-main); }
.gmp .form-label, .gmp .form-text, .gmp .form-check-label { color: var(--text-primary) !important; }
.gmp .form-text { opacity: 0.5; }
.gmp .form-check-label a { color: var(--text-primary); }
.gmp .form-check-label a:hover { color: var(--primary-main); }
.gmp .form-select option { color: var(--text-primary); }
.gmp .form-select { background-image: url('../images/chevron-down.svg') !important; }
.gmp textarea.form-control { height: auto; }
.gmp .valid-feedback { color: var(--state-success); }
.gmp .form-control.is-valid, .gmp .was-validated .form-control:valid, .gmp .form-select.is-valid, .gmp .was-validated .form-select:valid { border-color: var(--state-success) !important; }
.gmp .form-check-input.is-valid:checked, .gmp .was-validated .form-check-input:valid:checked { background-color: var(--state-success) !important; border-color: var(--state-success); }
.gmp .form-control.is-invalid, .gmp .was-validated .form-control:invalid, .gmp .form-select.is-invalid, .gmp .was-validated .form-select:invalid { border-color: var(--state-danger) !important; }
.gmp .invalid-feedback { color: var(--state-danger); }
.gmp .form-check-input.is-invalid, .gmp .was-validated .form-check-input:invalid { border-color: var(--state-danger) !important; }
.gmp .form-check-label a { color: var(--text-primary); }
.gmp .form-check-label a:hover { opacity: 0.7; }
.gmp .input-group-text { color: var(--text-primary); text-align: center; white-space: nowrap; background-color: var(--white); border-color: #D0D5DD; border-radius: var(--radius-sm); box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05) !important; padding: 0 16px; }
.form-floating>label { padding-left: 8px; left: 8px; right: 0; width: auto; }
.form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label { width: auto; background: #fff; opacity: 1; color: var(--primary-main); padding: 0px 8px; right: auto; height: auto; }
.form-floating>.form-control-plaintext~label, .form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label { transform: scale(.85) translateY(-10px) translateX(0.15rem); -webkit-transform: scale(.85) translateY(-10px) translateX(0.15rem); }
.form-floating>.form-control-plaintext.is-invalid~label, .form-floating>.form-control.is-invalid:focus~label, .form-floating>.form-control.is-invalid:not(:placeholder-shown)~label, .form-floating>.form-select.is-invalid~label { color: var(--state-danger); }
.form-floating>.form-control-plaintext.is-valid~label, .form-floating>.form-control.is-valid:focus~label, .form-floating>.form-control.is-valid:not(:placeholder-shown)~label, .form-floating>.form-select.is-valid~label { color: var(--state-success); }
.form-floating>.form-control-plaintext:focus, .form-floating>.form-control-plaintext:not(:placeholder-shown), .form-floating>.form-control:focus, .form-floating>.form-control:not(:placeholder-shown) { border-color: var(--primary-main); }

/* Container width
================================*/
.container.max-1440 { max-width: calc(1440px + 24px); width: 100%; }

/* Navbar
================================*/
header { background: var(--white); transition: all ease-in 0.1s; -webkit-transition: all ease-in 0.1s; z-index: 1021; box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1); }
.gmp .navbar-brand img, .f-logo img { height: 30px; }
.gmp .navbar { border-radius: 0; padding: 0; height: 64px; }
.gmp .navbar-nav { gap: 32px; }
.gmp .navbar-nav .nav-link { position: relative; padding: 22px 0; font-size: 16px; color: var(--text-secondary); border-bottom: 2px solid transparent; }
.gmp .navbar-nav .show>.nav-link, .gmp .navbar-nav .nav-link:focus, .gmp .navbar-nav .nav-link:hover { color: var(--text-primary); opacity: 1; }
.gmp .navbar-nav .nav-link.active { color: var(--text-primary); border-color: var(--primary-main); }
.gmp button.navbar-toggler { padding: 5px; margin-left: 5px; transition: all ease-in-out 0.3s; border: none !important; border-radius: 100%; height: 40px; width: 40px; text-align: center; border-radius: 0; box-shadow: none !important; background: var(--white); }
.gmp .navbar-toggler span.menu-line { height: 2px; display: block; width: 22px; background: var(--primary-main); margin-bottom: 6px; opacity: 1; border-radius: 8px; margin-left: auto; margin-right: auto; }
.gmp .navbar-toggler span.menu-line:last-child { margin-bottom: 0; }

/* Hero CSS
================================*/
.phone-img { max-width: 356px; border-radius: 24px; overflow: hidden; border: 1px solid var(--gray-300); box-shadow: 8px 8px 48px 0 rgba(0, 0, 0, 0.1); z-index: 4; position: relative; }
.inner-orbit, .outer-orbit { border-radius: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%) }
.orbit { position: absolute; height: 100%; width: 100%; left: 0; top: 0; }
.inner-orbit { height: 72%; width: 72%; }
.outer-orbit { width: 95%; height: 95%; }
.io-img { position: absolute; }
.oi-sm { height: 48px; width: 48px; }
.oi-md { height: 64px; width: 64px; }
.io-img01 { top: 40%; left: -24px; }
.io-img02 { top: 50%; right: -24px; }
.oo-img01 { left: 79px; top: 9%; }
.oo-img02 { top: 15%; right: 51px; }
.oo-img03 { bottom: 12%; left: 56px; }
.oo-img04 { bottom: 16%; right: 33px; }
.dot { height: 18px; width: 18px; position: absolute; border-radius: 100%; }
.dot-green { background-color: #127E39; left: 50%; bottom: -9px; }
.orbitals { height: 700px; width: 700px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }
.orbit-holder { position: absolute; height: 100%; width: 100%; left: 0; top: 0; }
.dot-yellow { background-color: #FFB128; left: 50%; top: -9px; }

/*Hero rotation animation
================================*/
.inner-orbit .orbit-holder { -webkit-animation: rotation 40s infinite linear; animation: rotation 40s infinite linear; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }
.inner-orbit .io-img { -webkit-animation: rotation-op 40s infinite linear; animation: rotation-op 40s infinite linear; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }
.outer-orbit .orbit-holder { -webkit-animation: rotation 65s infinite linear; animation: rotation 65s infinite linear; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }
.outer-orbit .io-img { -webkit-animation: rotation-op 65s infinite linear; animation: rotation-op 65s infinite linear; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }
@keyframes rotation {
  0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@-webkit-keyframes rotation {
  0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes rotation-op {
  0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(-360deg); transform: rotate(-360deg); }
}
@-webkit-keyframes rotation-op {
  0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(-360deg); transform: rotate(-360deg); }
}

/*Awards
================================*/
.newspaper { background-color: var(--gray-50); }
.nlogo-wrapper { padding: 0 28px; display: inline-block; }
.nlogo-wrapper img { height: 52px; width: auto; }

/*Logos marquee CSS
================================================================*/
.newlistslider-outer { --duration: 20s; display: flex; overflow: hidden; white-space: nowrap; position: relative; }
.newlistslider-outer:before { left: 0; }
.newlistslider-outer:before, .newlistslider-outer:after { height: 100%; width: 100px; position: absolute; content: ""; z-index: 11; background: linear-gradient(90deg, #FAFAFA 0%, rgba(250, 250, 250, 0.00) 122.33%); }
.newlistslider-outer:after { right: 0; transform: rotate(180deg); -webkit-transform: rotate(180deg); }
.newsp-lists { display: flex; flex-shrink: 0; justify-content: space-around; min-width: 100%; }
.newlistslider-outer:hover .appsslider-line { animation-play-state: paused; -webkit-animation-play-state: paused; }
.newsp-lists { animation: var(--duration) slide-1 infinite linear; -webkit-animation: var(--duration) slide-1 infinite linear; }
.newslistwrap-a { animation: var(--duration) slide-1 1 linear, calc(var(--duration) * 2) slide-2 var(--duration) infinite linear; -webkit-animation: var(--duration) slide-1 1 linear, calc(var(--duration) * 2) slide-2 var(--duration) infinite linear; }
.newslistwrap-b { animation: calc(var(--duration) * 2) slide-3 infinite linear; -webkit-animation: calc(var(--duration) * 2) slide-3 infinite linear; }
@keyframes slide-1 {
  from { transform: translateX(0); -webkit-transform: translateX(0); }
  to { transform: translateX(-100%); -webkit-transform: translateX(-100%); }
}
@keyframes slide-2 {
  0% { transform: translateX(100%); -webkit-transform: translateX(100%); }
  100% { transform: translateX(-100%); -webkit-transform: translateX(-100%); }
}
@keyframes slide-3 {
  0% { transform: translateX(0); -webkit-transform: translateX(0); }
  100% { transform: translateX(-200%); -webkit-transform: translateX(-200%); }
}

/*benifits
================================*/
.benifits .slick-track, .benifits .slick-list { height: auto !important; /* or any fixed height if necessary */ }
.bc-image { width: 100%; text-align: center; }
.slider-timer { min-width: 2px; background: var(--gray-200); position: relative; overflow: hidden; }
.slick-current .slider-timer { background: var(--primary-main); }
.gmp .benifits-content .slick-arrow { display: none !important; }
.slick-slide:not(:last-child) .bc-box { margin-bottom: 48px; }

/*Slick slider dots css
================================*/
.gmp ul.slick-dots { width: 100%; justify-content: center; margin-top: 20px; display: flex; gap: 12px; }
.gmp ul.slick-dots li button { padding: 0; font-size: 0; height: 10px; width: 10px; border-radius: 100%; background: var(--gray-200); }
.gmp ul.slick-dots li.slick-active button { background: var(--primary-main); }

/* Sectors
================================*/
.sectors-box { padding: 0 12px; }
.sectors-slider .slick-list { margin-left: -12px; margin-right: -12px; }
.sb-profile img { width: 20px; }
.sb-profile p { margin-top: 2px; display: inline-flex; }
.sb-img-inner { border-radius: var(--radius-lg); overflow: hidden; margin: 0 auto; background: var(--white); }
.sb-img-inner { position: relative; text-align: center; }
.sb-img-inner img { position: relative; z-index: 4; margin: 0 auto; }
.sb-img-inner:before { position: absolute; left: 0; right: 0; top: 20%; bottom: 0; border-radius: var(--radius-lg); background: var(--primary-main); content: ""; }
.suitable-cta { background: var(--primary-light); border-radius: var(--radius-md); }
.sc-left img { width: 32px; height: 32px; min-width: 32px; }
.sb-img-inner.green:before { background: var(--green); }
.sb-img-inner.yellow:before { background: var(--yellow); }
.sb-img-inner.orange:before { background: var(--orange); }
.sb-img-inner.cyan:before { background: var(--cyan); }
.sb-img-inner.purple:before { background: var(--purple); }
.gmp .slick-arrow { position: absolute; height: 44px; width: 44px; background-color: var(--primary-main); font-size: 0; top: 45%; background-position: center; background-repeat: no-repeat; background-size: 22px auto; z-index: 4; border-radius: 100% !important; transition: all ease-in 0.3s; }
.gmp button.slick-prev { background-image: url('../images/chevv-left.svg'); left: -72px; }
.gmp button.slick-next { background-image: url('../images/chevv-right.svg'); right: -72px; }
.gmp .slick-arrow.slick-disabled { opacity: 0.5; pointer-events: none; cursor: default; }
.gmp .slick-arrow:hover { background-color: var(--primary-hover); }

/*How we do it
================================*/
.howwe-img { text-align: center; }
.howwe-img img { max-width: 680px; width: 100%; }
.hp-box { position: relative; padding: 32px 0 16px 40px; }
.hp-number { font-size: 96px; font-weight: bold; color: var(--gray-200); opacity: 0.4; line-height: 70%; position: absolute; left: 20px; top: 0; z-index: 1; }
.hp-box h6 { position: relative; z-index: 4; }
.hp-points li { color: var(--text-secondary); font-size: 14px; }
.hp-box:before, .hp-box:not(:last-child):after { position: absolute; left: 0; top: 2px; content: ""; }
.hp-box:before { height: 11px; width: 11px; background: var(--primary-main); border-radius: 100%; top: 2px; }
.hp-box:not(:last-child):after { height: calc(100% + 50px); width: 1px; background: var(--primary-main); opacity: 0.3; left: 5px; }
.hp-points ul li { display: inline-flex; text-align: left; line-height: 155%; }
.hp-points ul li:before, .pb-features ul li:before { position: relative; content: ""; background: url('../images/tick-circle.svg') no-repeat center; height: 16px; min-width: 16px; display: inline-flex; margin-top: 2px; margin-right: 8px; background-size: 16px auto; }

/*Success stories
================================*/
.testimonial-box { padding: 1px; }
.tb-inner { border: 1px solid var(--gray-200); border-radius: var(--radius-xl); }
.client-says h5 { line-height: 155%; }
.cd-image img { height: 48px; min-width: 48px; width: 48px; object-fit: cover; overflow: hidden; border-radius: 100%; }
.cr-box { background: var(--primary-light); border-radius: var(--radius-md); }

/*Grow with us
================================*/
.numberbox img { max-width: 260px; margin: 0 auto; width: 100%; }

/*Pricing box
================================*/
.pricing-box { border: 1px solid var(--gray-200); border-radius: var(--radius-xl); position: relative; }
.pb-head { border-bottom: 1px solid var(--gray-200); }
.pb-head, .pb-features { padding: 32px; }
.pb-features ul li { font-size: 14px; color: var(--text-secondary); line-height: 155%; display: inline-flex; }
.popular-plan { background: var(--primary-light); border-color: var(--primary-light); }
.popular-plan .pb-head { border-bottom: 1px solid var(--black-rgba); }
.popular-plan .pb-features ul li:before { background: url('../images/tick-circle-fill.svg') no-repeat center; background-size: 17px auto; }
.poplar-tag { background: var(--primary-main); color: var(--white); position: absolute; padding: 8px 14px; border-radius: 40px; font-size: 12px; font-weight: 500; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 0; }

/* Download Checklist
================================*/
.checklist-img { max-width: 750px; margin: 0 auto; }
.stamp { position: absolute; gap: 12px; bottom: 64px; left: 90%; }
.stamp img { width: 48px; min-width: 48px; }
.stamp p { line-height: 120%; white-space: nowrap; }

/*Footer
================================*/
footer { background: var(--gray-50); }
.footer-top { border-bottom: 1px solid var(--gray-200); }
.ft-socials ul { display: flex; gap: 12px; }
.ft-socials ul li a { height: 32px; min-width: 32px; width: 32px; border: 1px solid var(--gray-200); border-radius: var(--radius-sm); display: inline-flex; align-items: center; justify-content: center; }
.ft-socials ul li a img { height: 20px; width: 20px; }
.ft-socials ul li a:hover { background: var(--gray-200); }
.f-links a { color: var(--text-muted); }
.f-links a:hover { color: var(--primary-main); }
.sub-footer .select-lang { color: var(--text-secondary); margin: 0; padding: 4px 8px; border: 1px solid var(--gray-200); border-radius: var(--radius-sm); display: inline-flex; align-items: center; }
.sub-footer .select-lang:before { content: url('../images/globe.svg'); height: 20px; width: 20px; margin-right: 4px; }
.sub-footer .select-lang:after { border: none; content: url('../images/caretdown.svg'); margin-top: 3px; margin-left: 48px; width: 14px; }

/*Contact page css
================================*/
.contact, .payment-page { background-image: url('../images/bg-ptrn.png'); background-repeat: no-repeat; background-position: center top; background-size: auto 100%; }
.contact-wrapper { border: 1px solid var(--gray-200); border-radius: var(--radius-lg); background: var(--white); box-shadow: 4px 4px 48px 0 rgba(16, 36, 61, 0.05); }
.our-location { background: var(--gray-50); }
.olc-inner { display: inline-flex; height: 48px; width: 48px; background: var(--primary-light); border-radius: 100%; align-items: center; justify-content: center; }
.olc-inner img { width: 24px; }
.ol-text { max-width: 240px; margin: 0 auto; }

/*Loader CSS
================================*/
.gmp-loader-div { position: fixed; background: var(--white); left: 0; top: 0; right: 0; bottom: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; }
.gmp-loader-div .loader { border-radius: 100%; position: relative; margin: 0 auto; display: flex; gap: 12px; justify-content: center; }
.gmp-loader-div .loader span { width: 16px; height: 16px; border-radius: 100%; opacity: 0; }
.gmp-loader-div .loader span:nth-child(1) { animation: opacitychange 1s ease-in-out infinite; -webkit-animation: opacitychange 1s ease-in-out infinite; background-color: var(--yellow); }
.gmp-loader-div .loader span:nth-child(2) { animation: opacitychange 1s ease-in-out 0.33s infinite; -webkit-animation: opacitychange 1s ease-in-out 0.33s infinite; background-color: var(--primary-main); }
.gmp-loader-div .loader span:nth-child(3) { animation: opacitychange 1s ease-in-out 0.66s infinite; -webkit-animation: opacitychange 1s ease-in-out 0.66s infinite; background-color: var(--green); }
@keyframes opacitychange {
  0%, 100% { opacity: 0; }
  60% { opacity: 1; }
}
@-webkit-keyframes opacitychange {
  0%, 100% { opacity: 0; }
  60% { opacity: 1; }
}
.media-logo { gap: 32px; max-width: 420px; width: 100%; }
.lg-wrapper img { height: 36px; width: auto; }

/* Payment page
==============================*/
.payment-page { min-height: 100vh; align-items: center; display: flex; background-image: url('../images/bg-ptrn-payment.png'); }
.back-btn a { display: inline-flex; height: 32px; width: 32px; background: var(--primary-light); border-radius: 100%; align-items: center; justify-content: center; }
.back-btn a img { height: 20px; width: 20px; transform: rotate(180deg); }
.back-btn a:hover { background-color: var(--primary-light-hover); }
.iti-inner { height: 48px; width: 48px; min-width: 48px; background: var(--primary-light); border-radius: var(--radius-md); }
.iti-inner img { height: 20px; width: 20px; }
.gmp .item-qty .form-select { height: auto; padding: 0 20px 0 0 !important; border: none; box-shadow: none; line-height: normal; font-size: 14px; width: auto; min-width: 24px; background-position: right center; border-radius: 0; text-align: center; cursor: pointer; }
.payment-total, .final-total { border-top: 1px solid var(--gray-200); }
a.form-link { border-bottom: 1px solid var(--primary-main); color: var(--text-secondary); display: inline-flex; padding-bottom: 2px; }
a.form-link:hover { color: var(--primary-main); }
.form-floating input[type=number]::-webkit-inner-spin-button, .form-floating input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; }
.cardsn-input { position: relative; }
.cardsn-input .form-control { padding-right: calc(126px + 20px) !important; }
.cardsn-input:after { position: absolute; right: 16px; top: 0; bottom: 0; background: url('../images/cards-option.svg') no-repeat center; width: 126px; content: ""; }
.card-cvv { position: relative; }
.card-cvv .form-control { padding-right: calc(24px + 20px) !important; }
.card-cvv:after { position: absolute; right: 16px; background: url('../images/cvv.png') no-repeat center/ 24px auto; top: 0; bottom: 0; width: 24px; content: ""; }
.payment-ftr { position: absolute; left: 0; bottom: 0; }
.payment-ftr ul li a { font-size: 14px; }