@font-face {
    font-family: "Font Awesome 6 Brands";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-brands-400.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-brands-400.ttf") format("truetype");
}

@font-face {
    font-family: "Font Awesome 6 Duotone";
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-duotone-900.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-duotone-900.ttf") format("truetype");
}

@font-face {
    font-family: "Font Awesome 6 Pro";
    font-style: normal;
    font-weight: 300;
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-light-300.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-light-300.ttf") format("truetype");
}

.fal,
.fa-light {
    font-family: "Font Awesome 6 Pro";
    font-weight: 300;
}

:root,
:host {
    --fa-font-regular: normal 400 1em/1 "Font Awesome 6 Pro";
}

@font-face {
    font-family: "Font Awesome 6 Pro";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-regular-400.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-regular-400.ttf") format("truetype");
}

.far,
.fa-regular {
    font-family: "Font Awesome 6 Pro";
    font-weight: 400;
}

:root,
:host {
    --fa-font-solid: normal 900 1em/1 "Font Awesome 6 Pro";
}

@font-face {
    font-family: "Font Awesome 6 Pro";
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-solid-900.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-solid-900.ttf") format("truetype");
}

.fas,
.fa-solid {
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
}

:root,
:host {
    --fa-font-thin: normal 100 1em/1 "Font Awesome 6 Pro";
}

@font-face {
    font-family: "Font Awesome 6 Pro";
    font-style: normal;
    font-weight: 100;
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-thin-100.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-thin-100.ttf") format("truetype");
}

.fat,
.fa-thin {
    font-family: "Font Awesome 6 Pro";
    font-weight: 100;
}

@font-face {
    font-family: "Font Awesome 5 Brands";
    font-display: block;
    font-weight: 400;
    src: url("/lib/fontawesome/webfonts/fa-brands-400.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-brands-400.ttf") format("truetype");
}

@font-face {
    font-family: "Font Awesome 5 Pro";
    font-display: block;
    font-weight: 900;
    src: url("/lib/fontawesome/webfonts/fa-solid-900.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-solid-900.ttf") format("truetype");
}

@font-face {
    font-family: "Font Awesome 5 Pro";
    font-display: block;
    font-weight: 400;
    src: url("/lib/fontawesome/webfonts/fa-regular-400.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-regular-400.ttf") format("truetype");
}

@font-face {
    font-family: "Font Awesome 5 Pro";
    font-display: block;
    font-weight: 300;
    src: url("/lib/fontawesome/webfonts/fa-light-300.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-light-300.ttf") format("truetype");
}

@font-face {
    font-family: "Font Awesome 5 Duotone";
    font-display: block;
    font-weight: 900;
    src: url("/lib/fontawesome/webfonts/fa-duotone-900.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-duotone-900.ttf") format("truetype");
}

@font-face {
    font-family: "FontAwesome";
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-solid-900.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-solid-900.ttf") format("truetype");
}

@font-face {
    font-family: "FontAwesome";
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-brands-400.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-brands-400.ttf") format("truetype");
}

@font-face {
    font-family: "FontAwesome";
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-regular-400.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-regular-400.ttf") format("truetype");
    unicode-range: U+F003, U+F006, U+F014, U+F016-F017, U+F01A-F01B, U+F01D, U+F022, U+F03E, U+F044, U+F046, U+F05C-F05D, U+F06E, U+F070, U+F087-F088, U+F08A, U+F094, U+F096-F097, U+F09D, U+F0A0, U+F0A2, U+F0A4-F0A7, U+F0C5, U+F0C7, U+F0E5-F0E6, U+F0EB, U+F0F6-F0F8, U+F10C, U+F114-F115, U+F118-F11A, U+F11C-F11D, U+F133, U+F147, U+F14E, U+F150-F152, U+F185-F186, U+F18E, U+F190-F192, U+F196, U+F1C1-F1C9, U+F1D9, U+F1DB, U+F1E3, U+F1EA, U+F1F7, U+F1F9, U+F20A, U+F247-F248, U+F24A, U+F24D, U+F255-F25B, U+F25D, U+F271-F274, U+F278, U+F27B, U+F28C, U+F28E, U+F29C, U+F2B5, U+F2B7, U+F2BA, U+F2BC, U+F2BE, U+F2C0-F2C1, U+F2C3, U+F2D0, U+F2D2, U+F2D4, U+F2DC;
}

@font-face {
    font-family: "FontAwesome";
    font-display: block;
    src: url("/lib/fontawesome/webfonts/fa-v4compatibility.woff2") format("woff2"), url("/lib/fontawesome/webfonts/fa-v4compatibility.ttf") format("truetype");
    unicode-range: U+F041, U+F047, U+F065-F066, U+F07D-F07E, U+F080, U+F08B, U+F08E, U+F090, U+F09A, U+F0AC, U+F0AE, U+F0B2, U+F0D0, U+F0D6, U+F0E4, U+F0EC, U+F10A-F10B, U+F123, U+F13E, U+F148-F149, U+F14C, U+F156, U+F15E, U+F160-F161, U+F163, U+F175-F178, U+F195, U+F1F8, U+F219, U+F250, U+F252, U+F27A;
}

.fa-brands, .fab {
    font-family: "Font Awesome 6 Brands";
}

.fab{
    font-weight: 400;
}

html {
    box-sizing: border-box;
}

*,
*:before,
*:after {
    box-sizing: border-box;
}

body {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    line-height: 1.5;
}

ul,
li {
    list-style: none;
    margin: 0;
    padding: 0;
}

a {
    display: block;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0px;
    padding: 0px;
}

@media (max-width : 992px) {
    h1 br,
    h2 br,
    h3 br,
    h4 br,
    h5 br,
    h6 br,
    p br {
        display: none;
    }
}

button {
    border: none;
}

/*========================================
       Color Variable Start Here
=========================================*/

/* Root Level Gobal Css Variables */
:root{
    --dark-rgba-1: rgba(0, 0, 0, 0.8);
    --dark-rgba-2: rgba(0, 0, 0, 0.5);
    --dark-rgba-3: rgba(0, 0, 0, 0.3);
    --dark-rgba-4: rgba(0, 0, 0, 0.2);
    --dark-rgba-5: rgba(0, 0, 0, 0.1);

    --light-rgba-1: rgba(255, 255, 255, 0.8);
    --light-rgba-2: rgba(255, 255, 255, 0.5);
    --light-rgba-3: rgba(255, 255, 255, 0.3);
    --light-rgba-4: rgba(255, 255, 255, 0.2);
    --light-rgba-5: rgba(255, 255, 255, 0.1);
    
    --light: #ffffff;
    --dark: #000000;
    --theme-lightShade-bgcolor1: #f8f4f4;
    --theme-lightShade-bgcolor2: #f0f0f0;
    --theme-lightShade-bgcolor3: #e6e6e6;
    --theme-DarkShade-bgcolor1: #393939;
    --theme-DarkShade-bgcolor2: #282828;
    --theme-DarkShade-bgcolor3: #181818;
    --theme-primary-color: #0A4396;
    --theme-secondary-color: #02B9E5;
    --theme-tertiary-color: #54687D;

    --btn-font-size: 18px;
    --btn-line-height: 28px;
    --btn-font-family: "Outfit-Bold";
    --btn-border-radius: 12px;
    --btn-vertical-padding: 16px;
    --btn-horizontal-padding: 40px;

    --input-font-size: 18px;
    --input-line-height: 28px;
    --input-font-family: "Outfit-Medium";
    --input-border-radius: 12px;
    --input-vertical-padding: 14px;
    --input-horizontal-padding: 20px;
    --input-text-color: #54687D;
    --input-text-focus-color: #54687D;
    --input-text-placeholder-color: #54687D;
    --input-primary-bg: #E7EFFA;
    --input-border-color: #fff;
    --input-border-focus-color: #54687D;

    --btn-primary-bg: #0A4396;
    --btn-primary-text: #ffffff;
    --btn-primary-hover-bg: #02B9E5;
    --btn-primary-hover-border: #0A4396;
    --btn-primary-hover-text: #ffffff;

    --btn-secondary-bg: #3498db;
    --btn-secondary-text: #ffffff;
    --btn-secondary-hover-bg: #0A4396;
    --btn-secondary-hover-border: #3498db;
    --btn-secondary-hover-text: #ffffff;

    --btn-dark-bg: #000000;
    --btn-dark-text: #ffffff;
    --btn-dark-hover-bg: #000000;
    --btn-dark-hover-border: #cdcdcd;
    --btn-dark-hover-text: #ffffff;

    --btn-light-bg: #ffffff;
    --btn-light-text: #000000;
    --btn-light-hover-bg: #000000;
    --btn-light-hover-border: #cdcdcd;
    --btn-light-hover-text: #ffffff;

    --theme-border-color: #cdcdcd;
    
    --text-primary: #0A4396;
    --text-secondary: #02B9E5;
    --text-tertiary: #54687D;
}

/*========================================
       Color Variable End Here
=========================================*/

/*========================================
       Font Family Variable Start Here
=========================================*/

:root {
    --font-family-medium: "Outfit-Medium";
    --font-family-regular: "Outfit-Regular";
    --font-family-semibold: "Outfit-SemiBold";
    --font-family-bold: "Outfit-Bold";
}

/*========================================
       Font Family Variable End Here
=========================================*/

:root {
    --box-shadow1: 0px 4px 27px -2px rgba(10, 67, 150, 0.15);
}

/*========================================
       Common Styles Start Here
=========================================*/

/*========================================
       Common Styles End Here
=========================================*/

:root{
    --h1-font-size: 36px;
    --h1-line-height: 44px;
    --h1-font-family: "Outfit-Bold";
    --h1-text-color: #0A4396;
    --h1-text-color-light: #ffffff;
    --h1-line-bg-color: #0A4396;
    --h1-line-light-bg-color: #ffffff;

    --h2-font-size: 30px;
    --h2-line-height: 38px;
    --h2-font-family: "Outfit-Bold";
    --h2-text-color: #0A4396;
    --h2-text-color-light: #ffffff;
    --h2-line-bg-color: #0A4396;
    --h2-line-light-bg-color: #ffffff;

    --h3-font-size: 24px;
    --h3-line-height: 32px;
    --h3-font-family: "Outfit-Bold";
    --h3-text-color: #54687D;
    --h3-text-color-light: #ffffff;
    --h3-line-bg-color: #54687D;

    --h4-font-size: 22px;
    --h4-line-height: 30px;
    --h4-font-family: "Outfit-Medium";
    --h4-text-color: #54687D;
    --h4-line-bg-color: #54687D;

    --h5-font-size: 20px;
    --h5-line-height: 28px;
    --h5-font-family: "Outfit-Medium";
    --h5-text-color: #54687D;
    --h5-line-bg-color: #54687D;

    --h6-font-size: 20px;
    --h6-line-height: 26px;
    --h6-font-family: "Outfit-Medium";
    --h6-text-color: #54687D;
    --h6-line-bg-color: #54687D;

    --small-heading-color: #54687D;
    --text-color: #54687D;
    --text-color-light: #ffffff;
}

h1,
h1 span{
    position: relative;
    display: inline-block;
    font-size: var(--h1-font-size);
    line-height: var(--h1-line-height);
    font-family: var(--h1-font-family);
    color: var(--h1-text-color);
    margin-bottom: 32px;
    position: relative;
    width: auto !important;
    z-index: 1;
}
  
h1::before {
    content: "";
    position: absolute;
    bottom: -18px;
    left: 50%;
    width: calc(100% + 200px);
    height: 2px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(10, 67, 150, 1) 50%, rgba(255, 255, 255, 0) 100%);
    transform: translateX(-50%);
    z-index: -1;
}

h1::after {
    content: "";
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #285aa3;
    border: 14px solid #fff;
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
}

.h1-start-align::before{
    left: 52px;
    transform: translateX(0);
    background: linear-gradient(90deg, rgba(10, 67, 150, 1) 0%, rgba(10, 67, 150, 1) 50%, rgba(255, 255, 255, 0) 100%);
    width: calc(100% - 52px);
}

.h1-start-align::after{
    left: 0;
    transform: translateX(0);
}

h2,
h2 span{
    position: relative;
    display: inline-block;
    font-size: var(--h2-font-size);
    line-height: var(--h2-line-height);
    font-family: var(--h2-font-family);
    color: var(--h2-text-color);
    margin-bottom: 32px;
    position: relative;
    width: auto !important;
    z-index: 1;
}
  
h2::before {
    content: "";
    position: absolute;
    bottom: -18px;
    left: 50%;
    width: calc(100% + 200px);
    height: 2px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(10, 67, 150, 1) 50%, rgba(255, 255, 255, 0) 100%);
    transform: translateX(-50%);
    z-index: -1;
}

h2::after {
    content: "";
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #285aa3;
    border: 14px solid #fff;
    bottom: -40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: -1;
}

.h2-start-align::before{
    left: 52px;
    transform: translateX(0);
    background: linear-gradient(90deg, rgba(10, 67, 150, 1) 0%, rgba(10, 67, 150, 1) 50%, rgba(255, 255, 255, 0) 100%);
    width: calc(100% - 52px);
}

.h2-start-align::after{
    left: 0;
    transform: translateX(0);
}

@media (max-width : 992px){
    /* h1,
    h1 span,
    h2,
    h2 span{
        font-size: 28px;
        line-height: 36px;
    } */
    h1::before,
    h2::before{
        bottom: -16px;
        width: 100%;
    }
    h1::after,
    h2::after{
        bottom: -40px;
    }
}

h3{
    font-size: var(--h3-font-size);
    line-height: var(--h3-line-height);
    font-family: var(--h3-font-family);
    color: var(--h3-text-color);
    width: auto !important;
}

h4{
    font-size: var(--h4-font-size);
    line-height: var(--h4-line-height);
    font-family: var(--h4-font-family);
    width: auto !important;
}

h5{
    font-size: var(--h5-font-size);
    line-height: var(--h5-line-height);
    font-family: var(--h5-font-family);
    color: var(--h5-text-color);
    width: auto !important;
}

h6{
    font-size: var(--h6-font-size);
    line-height: var(--h6-line-height);
    font-family: var(--h6-font-family);
    color: var(--h6-text-color);
    width: auto !important;
}

h1,h2{
    font-weight: normal;
}

h3,h4,h5,h6{
    margin-bottom: 2px;
    font-weight: normal;
}

p,
span,
strong,
label,
b,
ul,
li,
a,
summary,
details,
table,
tr,
td,
th {
    font-size: 20px;
    line-height: 26px;
    color: var(--text-color);
    font-family: var(--font-family-semibold);
}

.product-details-template h1 {
    font-size: 36px;
    line-height: 40px;
    font-family: "Outfit-Bold";
    color: #181818;
    font-weight: normal;
}

.product-details-template h2 {
    font-size: 32px;
    line-height: 32px;
    font-family: "Outfit-Bold";
    color: #181818;
    font-weight: normal;
}

.product-details-template h3 {
    font-size: 24px;
    line-height: 28px;
    font-family: "Outfit-Bold";
    color: #181818;
    font-weight: normal;
}

.product-details-template h4 {
    font-size: 20px;
    line-height: 26px;
    font-family: "Outfit-Bold";
    color: #181818;
    font-weight: normal;
}

.h3-heading{
    font-size: var(--h3-font-size);
    line-height: var(--h3-line-height);
    font-family: var(--h3-font-family);
    color: var(--h3-text-color);
    font-weight: normal;
}

.h4-heading{
    font-size: var(--h4-font-size);
    line-height: var(--h4-line-height);
    font-family: var(--h4-font-family);
    color: var(--h4-text-color);
    font-weight: normal;
}

.h5-heading{
    font-size: var(--h5-font-size);
    line-height: var(--h5-line-height);
    font-family: var(--h5-font-family);
    color: var(--h5-text-color);
    font-weight: normal;
}

.h6-heading{
    font-size: var(--h6-font-size);
    line-height: var(--h6-line-height);
    font-family: var(--h6-font-family);
    color: var(--h6-text-color);
    font-weight: normal;
}

.wrp-start p,
.wrp-right p,
.wrp-center p{
    position: relative;
    z-index: 1;
}

.wrp-center{
    width: 100%;
    max-width: 700px;
    text-align: center;
    margin: 0 auto 30px auto;
}

.wrp-right,
.wrp-start{
    text-align: start;
    margin: 0 0 30px 0;
}

.wrp-end,
.wrp-left{
    text-align: end;
    margin: 0 0 30px 0;
}

.text-center{
    text-align: center;
}

.text-start{
    text-align: start;
}

.text-end{
    text-align: end;
}

.wrp-w-full{
    max-width: 100% !important;
}

.wrp-w-xlg{
    max-width: 1024px !important;
}

.wrp-w-lg{
    max-width: 900px !important;
}

.wrp-w-md{
    max-width: 700px !important;
}

.wrp-w-sm{
    max-width: 500px !important;
}

.short-desc p:not(:last-child),
.short-desc ul li:not(:last-child),
.col-inr ul li:not(:last-child){
    margin-bottom: 8px;
}

.openingContent-sec .short-desc p span,
.openingContent-sec .short-desc p li,
.openingContent-sec .short-desc p b,
.openingContent-sec .short-desc p strong,
.openingContent-sec .short-desc p font,
.openingContent-sec .short-desc p *{
    color: var(--theme-secondary-color);
}

.openingContent-sec .inline-link,
section .inline-link{
    display: inline-block;
    color: var(--theme-primary-color) !important;
    background-color: transparent !important;
    text-decoration: none !important;
    transition: .3s;
}

.openingContent-sec .inline-link:hover,
section .inline-link:hover{
    color: var(--theme-secondary-color) !important;
    background-color: transparent !important;
}

#htmlContent .openingContent-sec .short-desc p span,
#htmlContent .openingContent-sec .short-desc p li,
#htmlContent .openingContent-sec .short-desc p b,
#htmlContent .openingContent-sec .short-desc p strong,
#htmlContent .openingContent-sec .short-desc p font,
#htmlContent .openingContent-sec .short-desc p *{
    display: inline-block;
}

.icon{
    font-size: 24px;
    color: var(--text-color);
}

.primary-bg{
    background-color: var(--theme-primary-color);
}

.secondary-bg{
    background-color: var(--theme-secondary-color);
}

.tertiary-bg{
    background-color: var(--theme-tertiary-color);
}

.bg-transparent{
    background-color: transparent;
}

.theme-btn{
    /* Button heights Needs to be  */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: var(--btn-vertical-padding) var(--btn-horizontal-padding);
    font-size: var(--btn-font-size);
    line-height: var(--btn-line-height);
    border-radius: var(--btn-border-radius);
    background-color: var(--btn-primary-bg);
    font-family: var(--btn-font-family);
    color: var(--btn-primary-text);
    text-align: center;
    cursor: pointer;
    height: 60px;
    transition: .3s;
}

.theme-btn:hover{
    color: var(--btn-primary-hover-text);
    background-color: var(--btn-primary-hover-bg);
}

.theme-btn .icon{
    color: var(--light);
    font-size: 18px;
    transition: .3s;
}

.theme-btn-outline{
    background-color: transparent;
    color: var(--theme-secondary-color);
    border: 2px solid var(--theme-secondary-color);
}

.theme-btn-outline .icon{
    color: var(--theme-secondary-color);
}

.theme-btn-outline:hover .icon{
    color: var(--light);
}

.theme-btn-primary{
    background-color: var(--theme-primary-color);
}

.theme-btn-primary:hover{
    background-color: var(--theme-secondary-color);
}

.theme-input,
.form-control{
    /* Input height needs to be  */
    padding: var(--input-vertical-padding) var(--input-horizontal-padding);
    color: var(--input-text-color);
    font-size: var(--input-font-size);
    line-height: var(--input-line-height);
    border-radius: var(--input-border-radius);
    background-color: var(--input-primary-bg);
    font-family: var(--input-font-family);
    border: 2px solid var(--input-border-color);
    text-align: start;
    outline: none;
    height: 60px;
    transition: .3s;
}

.theme-input:focus,
.form-control:focus{
    border: 2px solid var(--input-border-focus-color);
    color: var(--input-text-focus-color);
}

.theme-input:focus::placeholder,
.form-control:focus::placeholder{
    color: var(--input-text-focus-color);
}

.theme-input::placeholder,
.form-control::placeholder{
    color: var(--input-text-placeholder-color);
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

:root{
    --text-btn-color: #02B9E5;
    --text-btn-line-bg-color: #0A4396;
    --text-btn-hover-color: #0A4396;
    --text-btn-font-size: 18px;
    --text-btn-line-height: 28px;
    --text-btn-font-family: "Outfit-Medium";
    --text-btn-border-radius: 12px;
    --text-btn--vertical-padding: 10px;
    --text-btn-horizontal-padding: 20px;
}

.text-btn{
    padding-bottom: 6px;
    display: inline-flex;
    gap: 12px;
    position: relative;
    font-size: var(--text-btn-font-size);
    line-height: var(text-btn-line-height);
    font-family: var(--text-btn-font-family);
    color: var(--text-btn-color);
    transition: .3s;
}

.text-btn .icon{
    color: var(--text-btn-color);
    font-size: 20px;
    position: relative;
    top: 2px;
    transition: .3s;
}

.text-btn:hover,
.text-btn:hover .icon{
    color: var(--text-btn-hover-color);
}

.text-btn:hover::after{
    width: 100%;
}

.text-btn::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background-color: var(--text-btn-line-bg-color);
    transition: .3s;
}

.title-start h1::after,
.title-start h2::after{
    left: inherit;
    right: 0;
    transform: translate(0);
    bottom: -8;
}

@media (max-width : 992px){
    .title-start h1::after,
    .title-start h2::after{
        bottom: -5px;
    }
}

.custom-ol,
.custom-ul{
    padding: 0;
    margin: 12px 0;
}

.custom-ol li:not(:last-child),
.custom-ul li:not(:last-child){
    margin-bottom: 8px;
}

.style-decimal-ul li,
.custom-ol li{
    list-style: decimal;
    list-style-position: inside;
}

.style-disc-ul li,
.custom-ul li{
    list-style: disc;
    list-style-position: inside;
}

.ul-hypen-style li:before {
    content: "-";
    margin-right: 10px;
}

/* Margin (All Sides) */
.m-0 { margin: 0 !important; }
.m-4 { margin: 4px !important; }
.m-6 { margin: 6px !important; }
.m-8 { margin: 8px !important; }
.m-12 { margin: 12px !important; }
.m-14 { margin: 14px !important; }
.m-16 { margin: 16px !important; }
.m-20 { margin: 20px !important; }
.m-30 { margin: 30px !important; }
.m-40 { margin: 40px !important; }
.m-50 { margin: 50px !important; }

/* Margin X (Left & Right) */
.mx-auto { margin-left: auto !important; margin-right: auto !important; }
.mx-0 { margin-left: 0 !important; margin-right: 0 !important; }
.mx-4 { margin-left: 4px !important; margin-right: 4px !important; }
.mx-6 { margin-left: 6px !important; margin-right: 6px !important; }
.mx-8 { margin-left: 8px !important; margin-right: 8px !important; }
.mx-12 { margin-left: 12px !important; margin-right: 12px !important; }
.mx-14 { margin-left: 14px !important; margin-right: 14px !important; }
.mx-16 { margin-left: 16px !important; margin-right: 16px !important; }
.mx-20 { margin-left: 20px !important; margin-right: 20px !important; }
.mx-30 { margin-left: 30px !important; margin-right: 30px !important; }
.mx-40 { margin-left: 40px !important; margin-right: 40px !important; }
.mx-50 { margin-left: 50px !important; margin-right: 50px !important; }

/* Margin Y (Top & Bottom) */
.my-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.my-4 { margin-top: 4px !important; margin-bottom: 4px !important; }
.my-6 { margin-top: 6px !important; margin-bottom: 6px !important; }
.my-8 { margin-top: 8px !important; margin-bottom: 8px !important; }
.my-12 { margin-top: 12px !important; margin-bottom: 12px !important; }
.my-14 { margin-top: 14px !important; margin-bottom: 14px !important; }
.my-16 { margin-top: 16px !important; margin-bottom: 16px !important; }
.my-20 { margin-top: 20px !important; margin-bottom: 20px !important; }
.my-30 { margin-top: 30px !important; margin-bottom: 30px !important; }
.my-40 { margin-top: 40px !important; margin-bottom: 40px !important; }
.my-50 { margin-top: 50px !important; margin-bottom: 50px !important; }

/* Margin T (Top) */
.mt-0 { margin-top: 0 !important; }
.mt-4 { margin-top: 4px !important; }
.mt-6 { margin-top: 6px !important; }
.mt-8 { margin-top: 8px !important; }
.mt-12 { margin-top: 12px !important; }
.mt-14 { margin-top: 14px !important; }
.mt-16 { margin-top: 16px !important; }
.mt-20 { margin-top: 20px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-40 { margin-top: 40px !important; }
.mt-50 { margin-top: 50px !important; }

/* Margin B (Bottom) */
.mb-0 { margin-bottom: 0 !important; }
.mb-4 { margin-bottom: 4px !important; }
.mb-6 { margin-bottom: 6px !important; }
.mb-8 { margin-bottom: 8px !important; }
.mb-12 { margin-bottom: 12px !important; }
.mb-14 { margin-bottom: 14px !important; }
.mb-16 { margin-bottom: 16px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-40 { margin-bottom: 40px !important; }
.mb-50 { margin-bottom: 50px !important; }

/* Margin R (Right) */
.mr-0 { margin-right: 0 !important; }
.mr-4 { margin-right: 4px !important; }
.mr-6 { margin-right: 6px !important; }
.mr-8 { margin-right: 8px !important; }
.mr-12 { margin-right: 12px !important; }
.mr-14 { margin-right: 14px !important; }
.mr-16 { margin-right: 16px !important; }
.mr-20 { margin-right: 20px !important; }
.mr-30 { margin-right: 30px !important; }
.mr-40 { margin-right: 40px !important; }
.mr-50 { margin-right: 50px !important; }

/* Margin L (Left) */
.ml-0 { margin-left: 0 !important; }
.ml-4 { margin-left: 4px !important; }
.ml-6 { margin-left: 6px !important; }
.ml-8 { margin-left: 8px !important; }
.ml-12 { margin-left: 12px !important; }
.ml-14 { margin-left: 14px !important; }
.ml-16 { margin-left: 16px !important; }
.ml-20 { margin-left: 20px !important; }
.ml-30 { margin-left: 30px !important; }
.ml-40 { margin-left: 40px !important; }
.ml-50 { margin-left: 50px !important; }

/* Padding (All Sides) */
.p-0 { padding: 0 !important; }
.p-4 { padding: 4px !important; }
.p-6 { padding: 6px !important; }
.p-8 { padding: 8px !important; }
.p-12 { padding: 12px !important; }
.p-14 { padding: 14px !important; }
.p-16 { padding: 16px !important; }
.p-20 { padding: 20px !important; }
.p-30 { padding: 30px !important; }
.p-40 { padding: 40px !important; }
.p-50 { padding: 50px !important; }

/* Padding X (Left & Right) */
.px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.px-4 { padding-left: 4px !important; padding-right: 4px !important; }
.px-6 { padding-left: 6px !important; padding-right: 6px !important; }
.px-8 { padding-left: 8px !important; padding-right: 8px !important; }
.px-12 { padding-left: 12px !important; padding-right: 12px !important; }
.px-14 { padding-left: 14px !important; padding-right: 14px !important; }
.px-16 { padding-left: 16px !important; padding-right: 16px !important; }
.px-20 { padding-left: 20px !important; padding-right: 20px !important; }
.px-30 { padding-left: 30px !important; padding-right: 30px !important; }
.px-40 { padding-left: 40px !important; padding-right: 40px !important; }
.px-50 { padding-left: 50px !important; padding-right: 50px !important; }

/* Padding Y (Top & Bottom) */
.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.py-4 { padding-top: 4px !important; padding-bottom: 4px !important; }
.py-6 { padding-top: 6px !important; padding-bottom: 6px !important; }
.py-8 { padding-top: 8px !important; padding-bottom: 8px !important; }
.py-12 { padding-top: 12px !important; padding-bottom: 12px !important; }
.py-14 { padding-top: 14px !important; padding-bottom: 14px !important; }
.py-16 { padding-top: 16px !important; padding-bottom: 16px !important; }
.py-20 { padding-top: 20px !important; padding-bottom: 20px !important; }
.py-30 { padding-top: 30px !important; padding-bottom: 30px !important; }
.py-40 { padding-top: 40px !important; padding-bottom: 40px !important; }
.py-50 { padding-top: 50px !important; padding-bottom: 50px !important; }

/* Padding T (Top) */
.pt-0 { padding-top: 0 !important; }
.pt-4 { padding-top: 4px !important; }
.pt-6 { padding-top: 6px !important; }
.pt-8 { padding-top: 8px !important; }
.pt-12 { padding-top: 12px !important; }
.pt-14 { padding-top: 14px !important; }
.pt-16 { padding-top: 16px !important; }
.pt-20 { padding-top: 20px !important; }
.pt-30 { padding-top: 30px !important; }
.pt-40 { padding-top: 40px !important; }
.pt-50 { padding-top: 50px !important; }

/* Padding B (Bottom) */
.pb-0 { padding-bottom: 0 !important; }
.pb-4 { padding-bottom: 4px !important; }
.pb-6 { padding-bottom: 6px !important; }
.pb-8 { padding-bottom: 8px !important; }
.pb-12 { padding-bottom: 12px !important; }
.pb-14 { padding-bottom: 14px !important; }
.pb-16 { padding-bottom: 16px !important; }
.pb-20 { padding-bottom: 20px !important; }
.pb-30 { padding-bottom: 30px !important; }
.pb-40 { padding-bottom: 40px !important; }
.pb-50 { padding-bottom: 50px !important; }

/* Padding R (Right) */
.pr-0 { padding-right: 0 !important; }
.pr-4 { padding-right: 4px !important; }
.pr-6 { padding-right: 6px !important; }
.pr-8 { padding-right: 8px !important; }
.pr-12 { padding-right: 12px !important; }
.pr-14 { padding-right: 14px !important; }
.pr-16 { padding-right: 16px !important; }
.pr-20 { padding-right: 20px !important; }
.pr-30 { padding-right: 30px !important; }
.pr-40 { padding-right: 40px !important; }
.pr-50 { padding-right: 50px !important; }

/* Padding L (Left) */
.pl-0 { padding-left: 0 !important; }
.pl-4 { padding-left: 4px !important; }
.pl-6 { padding-left: 6px !important; }
.pl-8 { padding-left: 8px !important; }
.pl-12 { padding-left: 12px !important; }
.pl-14 { padding-left: 14px !important; }
.pl-16 { padding-left: 16px !important; }
.pl-20 { padding-left: 20px !important; }
.pl-30 { padding-left: 30px !important; }
.pl-40 { padding-left: 40px !important; }
.pl-50 { padding-left: 50px !important; }

.swiper-wrapper{
    box-sizing: border-box !important;
}

.scroll-hidden{
    overflow-y: hidden;
}

.style-decimal-ul li{
    list-style: decimal;
    list-style-position: inside;
}

.style-disc-ul li{
    list-style: disc;
    list-style-position: inside;
}

.style-circle-ul li{
    list-style: circle;
    list-style-position: inside;
}

.style-square-ul li{
    list-style: square;
    list-style-position: inside;
}

/*========================================
      Bootstarp Common Css Start Here
=========================================*/

.container,.container-fluid,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
    width: 100%;
    padding-left: 12px;
    padding-right: 12px;
    margin-left: auto;
    margin-right: auto
}

@media (min-width: 576px) {
    .container,.container-sm {
        max-width:540px
    }
}

@media (min-width: 768px) {
    .container,.container-md,.container-sm {
        max-width:720px
    }
}

@media (min-width: 992px) {
    .container,.container-lg,.container-md,.container-sm {
        max-width:960px
    }
}

@media (min-width: 1200px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl {
        max-width:1140px
    }
}

@media (min-width: 1400px) {
    .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
        max-width:1320px
    }
}

@media (min-width: 992px){
    .container{
        max-width: 1410px;
    }
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin: 0 12px;
}

@media (max-width : 992px){
    .row{
        margin: 0 -12px;
    }
}

.row>* {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-left: 12px;
    padding-right: 12px;
}

.col-1 {
    flex: 0 0 auto;
    width: 8.33333333%
}

.col-2 {
    flex: 0 0 auto;
    width: 16.66666667%
}

.col-3 {
    flex: 0 0 auto;
    width: 25%
}

.col-4 {
    flex: 0 0 auto;
    width: 33.33333333%
}

.col-5 {
    flex: 0 0 auto;
    width: 41.66666667%
}

.col-6 {
    flex: 0 0 auto;
    width: 50%
}

.col-7 {
    flex: 0 0 auto;
    width: 58.33333333%
}

.col-8 {
    flex: 0 0 auto;
    width: 66.66666667%
}

.col-9 {
    flex: 0 0 auto;
    width: 75%
}

.col-10 {
    flex: 0 0 auto;
    width: 83.33333333%
}

.col-11 {
    flex: 0 0 auto;
    width: 91.66666667%
}

.col-12 {
    flex: 0 0 auto;
    width: 100%
}

@media (max-width: 576px) {
    .col-xs-1 {
        flex: 0 0 auto;
        width: 8.33333333% !important;
    }

    .col-xs-2 {
        flex: 0 0 auto;
        width: 16.66666667% !important;
    }

    .col-xs-3 {
        flex: 0 0 auto;
        width: 25% !important;
    }

    .col-xs-4 {
        flex: 0 0 auto;
        width: 33.33333333% !important;
    }

    .col-xs-5 {
        flex: 0 0 auto;
        width: 41.66666667% !important;
    }

    .col-xs-6 {
        flex: 0 0 auto;
        width: 50% !important;
    }

    .col-xs-7 {
        flex: 0 0 auto;
        width: 58.33333333% !important;
    }

    .col-xs-8 {
        flex: 0 0 auto;
        width: 66.66666667% !important;
    }

    .col-xs-9 {
        flex: 0 0 auto;
        width: 75% !important;
    }

    .col-xs-10 {
        flex: 0 0 auto;
        width: 83.33333333% !important;
    }

    .col-xs-11 {
        flex: 0 0 auto;
        width: 91.66666667% !important;
    }

    .col-xs-12 {
        flex: 0 0 auto;
        width: 100% !important;
    }
}


@media (min-width: 576px){
    .col-sm-1 {
        flex: 0 0 auto;
        width: 8.33333333%
    }

    .col-sm-2 {
        flex: 0 0 auto;
        width: 16.66666667%
    }

    .col-sm-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-sm-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-sm-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .col-sm-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-sm-7 {
        flex: 0 0 auto;
        width: 58.33333333%
    }

    .col-sm-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .col-sm-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-sm-10 {
        flex: 0 0 auto;
        width: 83.33333333%
    }

    .col-sm-11 {
        flex: 0 0 auto;
        width: 91.66666667%
    }

    .col-sm-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

@media (min-width: 768px) {
    .col-md-1 {
        flex: 0 0 auto;
        width: 8.33333333%
    }

    .col-md-2 {
        flex: 0 0 auto;
        width: 16.66666667%
    }

    .col-md-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-md-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-md-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .col-md-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-md-7 {
        flex: 0 0 auto;
        width: 58.33333333%
    }

    .col-md-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .col-md-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-md-10 {
        flex: 0 0 auto;
        width: 83.33333333%
    }

    .col-md-11 {
        flex: 0 0 auto;
        width: 91.66666667%
    }

    .col-md-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

@media (min-width: 992px) {
    .col-lg-1 {
        flex: 0 0 auto;
        width: 8.33333333%
    }

    .col-lg-2 {
        flex: 0 0 auto;
        width: 16.66666667%
    }

    .col-lg-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-lg-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-lg-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .col-lg-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-lg-7 {
        flex: 0 0 auto;
        width: 58.33333333%
    }

    .col-lg-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .col-lg-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-lg-10 {
        flex: 0 0 auto;
        width: 83.33333333%
    }

    .col-lg-11 {
        flex: 0 0 auto;
        width: 91.66666667%
    }

    .col-lg-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

@media (min-width: 1200px) {
    .col-xl-1 {
        flex: 0 0 auto;
        width: 8.33333333%
    }

    .col-xl-2 {
        flex: 0 0 auto;
        width: 16.66666667%
    }

    .col-xl-3 {
        flex: 0 0 auto;
        width: 25%
    }

    .col-xl-4 {
        flex: 0 0 auto;
        width: 33.33333333%
    }

    .col-xl-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .col-xl-6 {
        flex: 0 0 auto;
        width: 50%
    }

    .col-xl-7 {
        flex: 0 0 auto;
        width: 58.33333333%
    }

    .col-xl-8 {
        flex: 0 0 auto;
        width: 66.66666667%
    }

    .col-xl-9 {
        flex: 0 0 auto;
        width: 75%
    }

    .col-xl-10 {
        flex: 0 0 auto;
        width: 83.33333333%
    }

    .col-xl-11 {
        flex: 0 0 auto;
        width: 91.66666667%
    }

    .col-xl-12 {
        flex: 0 0 auto;
        width: 100%
    }
}

.img-fluid{
    width: 100%;
    max-width: 100%;
    height: auto;
}

i{
  font-style: normal;
}

body.overflow-hidden {
    overflow: hidden;
}  

/*========================================
      Bootstarp Common Css End Here
=========================================*/

/*========================================
       Mobile Nav Css Start Here
=========================================*/

@media (min-width : 992px){
    .mobile-nav{
        display: none;
    }
}

.mob-header{
    padding: 15px 0;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
}

.mob-header .logo-otr,
.mob-header .logo-inr{
    display: flex;
	position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.mob-header .logo-img{
    width: 100px;
    height: 50px;
    object-fit: contain;
}

.mob-header .icon-main{
    position: relative;
}

.mob-header .icons-ul{
    display: flex;
    align-items: center;
    gap: 12px;
}

.mob-header .icons-ul .icon{
    font-size: 24px;
    color: var(--theme-primary-color);
}

.mob-header .desk-menu .box-menu .menu-container{
    right: inherit;
    left: -100%;
}

.body.open-menu .desk-menu .box-menu .menu-container{
    left: 0;
}

.mobile-nav .mob-header .desk-menu .menu-container .menu > li.menu-item-has-children .sub-menu{
    left: -100%;
}

.mobile-nav .mob-header .desk-menu .menu-container .menu > li.menu-item-has-children .sub-menu .sub-menu{
    left: -100%;
}

.mob-header .desk-menu .menu-container .menu > li.menu-item-has-children .sub-menu.open-sub{
    left: 0;
}

.mobile-nav .mob-header .desk-menu .menu-container .menu > li.menu-item-has-children .sub-menu .sub-menu.open-sub{
    left: 0;
}

.mobile-nav .mob-header .desk-menu .box-menu .menu-container .menu li a,
.mobile-nav .mob-header .desk-menu .box-menu .menu-container .menu li .sub-menu a{
    text-align: start;
    padding: 10px 0 !important;
}

.mobile-nav .mob-header .desk-menu .menu-container .menu > li.menu-item-has-children a::before,
body .mob-header .desk-menu .menu-container .menu > li.menu-item-has-children .sub-menu li.menu-item-has-children > a::before {
    right: 0 !important;
    top: 18px !important;
    width: 7px !important;
    left: inherit !important;
    transform: rotate(45deg) !important;
}

.mobile-nav .mob-header .desk-menu .menu-container .menu > li.menu-item-has-children a::after,
body .mob-header .desk-menu .menu-container .menu > li.menu-item-has-children .sub-menu li.menu-item-has-children > a::after {
    top: 23px !important;
    width: 7px !important;
    left: inherit !important;
    right: 0 !important;
    transform: rotate(-45deg) !important;
}

.mob-header .hamburger-menu{
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center;
}

/*========================================
       Mobile Nav Css End Here
=========================================*/

/*========================================
        Header Css Start Here
=========================================*/

.header-main{
    position: sticky;
    top: 0;
    left: 0;
    background-color: var(--light);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
    z-index: 1090;
    transition: .3s;
}

.header-main.over-banner{
    box-shadow: inherit;
}

.header-main.scrolled{
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5);
}

#htmlContent .header-main{
    position: relative;
}

.header-main .container{
    max-width: 1410px;
}

.header-main .wrapper{
    display: flex;
    align-items: center;
    justify-content: initial;
    gap: 12px 0;
}

.header-main .logo-otr{
    display: flex;
    position: relative;
    padding-right: 32px;
}

.header-main .logo-inr{
    display: flex;
    position: relative;
}

.header-main .logo-img{
    width: 175px;
    height: auto;
    object-fit: contain;
    transition: .3s;
}

.header-main .menu-main{
    position: initial;
}

.header-main .menu-main .menu-ul{
    display: flex;
    align-items: center;
    gap: 12px 40px;
}

.header-main .menu-main .menu-li{
    position: relative;
}

.header-main .menu-main .menu-link{
    line-height: 92px;
    font-family: var(--font-family-semibold);
    transition: .3s;
}

.header-main .menu-main .menu-link:hover,
.header-main .menu-li:hover > .menu-link,
.header-main .menu-li:has(.vertical-menu-ul:hover) > .menu-link{
    color: var(--theme-secondary-color);
}

.header-main .menu-main .menu-link:hover::after,
.header-main .menu-li:has(.vertical-menu-ul .vertical-menu-link:hover) > .menu-link::after,
.header-main .menu-li:has(.mega-menu-inr .subMenu-otr-link:hover) > .menu-link::after,
.header-main .menu-li:has(.mega-menu-inr .subMenu-inr-link:hover) > .menu-link::after,
.header-main .menu-li:has(.preview-img-otr:hover) > .menu-link::after{
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) scale(1);
}

.header-main .menu-link:has(.subMenu-otr-link:hover) > .menu-link::after {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) scale(1);
}

.header-main .vertical-menu-li:has(.subdrop-ul:hover) > .vertical-menu-link,
.header-main .vertical-menu-li:has(.subdrop-ul .vertical-menu-link:hover) > .vertical-menu-link {
    color: var(--light);
    background-color: var(--theme-primary-color);
}

.header-main .vertical-menu-li:has(.subdrop-ul .vertical-menu-link:hover) > .vertical-menu-link .icon{
    color: var(--light);
}

.header-main .menu-main .menu-link::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: 27px;
    width: 100%;
    height: 1px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-50%) scale(0);
    background-color: var(--theme-secondary-color);
    transition: .3s;
}

/* Vertical Menu Css Start Here */

.header-main .menu-main .menu-li:hover .vertical-menu-ul{
    top: 92px;
    opacity: 1;
    visibility: visible;
}

.header-main-active .menu-main .menu-li:hover .vertical-menu-ul{
    top: 60px;
}

.header-main .menu-main .vertical-menu-ul{
    position: absolute;
    top: 110px;
    left: -24px;
    padding: 0;
    background-color: #fff;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}

.header-main .menu-main .vertical-menu-li{
    position: relative;
}

.header-main .menu-main .vertical-menu-link:hover{
    color: var(--light);
    background-color: var(--theme-primary-color);
}

.header-main .menu-main .vertical-menu-link:hover .icon{
    color: var(--light);
}

.header-main .menu-main .vertical-menu-link{
    padding: 10px 32px 10px 20px;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: .3s;
}

.header-main .menu-main .vertical-menu-link .icon{
    font-size: 18px;
    position: relative;
    top: 2px;
    transition: .3s;
}

.header-main .menu-main .subdrop-ul{
    position: absolute;
    left: 100%;
    top: 20px;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}

.header-main .menu-main .subdrop-ul{
    position: absolute;
    left: 100%;
    top: 20px;
    padding: 0;
    background-color: #fff;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}

.header-main .vertical-menu-li:hover .subdrop-ul{
    top: 0;
    opacity: 1;
    visibility: visible;
}

/* Megamenu Css Start Here */

.header-main .menu-main .mega-menu-otr{
    position: initial;
}

.header-main .menu-main .mega-menu-otr .menu-link{
    position: relative;
}

.header-main .mega-menu-otr:hover .mega-menu-inr,
.header-main:has(.logo-otr.active:hover) .mega-menu-inr{
    top: 92px;
    opacity: 1;
    visibility: visible;
}

.header-main-active .mega-menu-otr:hover .mega-menu-inr{
    top: 60px;
}

.header-main .mega-menu-inr{
    width: 100%;
    height: 70vh;
    position: absolute;
    top: 110px;
    left: 0;
    opacity: 0;
    visibility: hidden;
    overflow-x: auto;
    background-color: rgba(255, 255, 255, 0.88);
    transition: .3s;
} 

.header-main .mega-menu-inr .menu-grid{
    display: flex;
}

.header-main .menu-grid-inr{
    width: 600px;
}

.header-main .mega-menu-inr .subMenu-main{
    background-color: var(--light);
}

.header-main .mega-menu-inr .subMenu-otr-ul{
    width: 320px;
    background-color: var(--light);
}

.header-main .subMenu-otr-ul .subMenu-otr-li:first-child{
    border-top: 1px solid #f3f3f3;
}

.header-main .subMenu-otr-ul .subMenu-otr-li{
    position: relative;
    border-bottom: 1px solid #c9c9c9;
    transition: .3s;
}

.header-main .subMenu-otr-ul .active{
    border-bottom: 1px solid var(--theme-secondary-color);
}

.header-main .subMenu-otr-ul .active .subMenu-otr-link{
    color: var(--light);
    background-color: var(--theme-secondary-color);
}

.header-main .subMenu-otr-ul .subMenu-otr-link{
    padding: 10px 20px;
    line-height: 24px;
    transition: .3s;
}

.header-main .subMenu-inr-container{
    width: 280px;
    position: absolute;
    left: 320px;
    top: -1px;
}

.header-main .subMenu-inr-container .subMenu-inr-ul{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}

.header-main .subMenu-inr-container .subMenu-inr-ul.active{
    opacity: 1;
    visibility: visible;
}

.header-main .subMenu-inr-ul .subMenu-inr-li:first-child{
    border-top: 1px solid #D6D6D6;
    transition: .3s;
}

.header-main .subMenu-inr-ul .subMenu-inr-li:not(:last-child),
.header-main .subMenu-inr-ul .subMenu-inr-li:last-child{
    border-bottom: 1px solid #D6D6D6;
    transition: .3s;
}

.header-main .subMenu-inr-ul.active,
.header-main .subMenu-inr-ul .active{
    border-bottom: 1px solid transparent;
}

.header-main .subMenu-inr-ul .active .subMenu-inr-link{
    background-color: var(--light);
    border-left: 4px solid var(--theme-secondary-color);
}

.header-main .subMenu-inr-ul .subMenu-inr-link{
    padding: 10px 20px;
    line-height: 24px;
    border-left: 4px solid transparent;
    transition: .3s;
}

.header-main .preview-img-otr{
    flex: 1;
    padding: 20px;
}

.header-main .preview-img-otr .preview-img{
    width: 100%;
    height: auto;
    aspect-ratio: 16/8;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: var(--box-shadow1);
}

/* Sticky Nav Css Start Here */

.header-main-active .logo-img{
    width: 100px;
}

.header-main-active .menu-main .menu-link{
    line-height: 60px;
}

.header-main-active .menu-main .menu-link::after{
    bottom: 0;
    height: 3px;
}

/* Header menuBar Css End Here */

@media (max-width : 1400px){
    .header-main .menu-main .menu-ul{
        gap: 12px 20px;
    }
}

@media (max-width: 1200px){
    .header-main .menu-main .menu-ul{
        gap: 12px;
    }
    .header-main .menu-main .menu-link{
        font-size: 16px;
    }
}

@media (max-width : 992px){
    .header-main{
        display: none;
    }
}

.accessbility{
    display: none !important;
}


/*========================================
        Header Css End Here
=========================================*/

/*========================================
        Footer Css Start Here
=========================================*/

:root{
    --footer-bg-color: #e4eef9;
    --footer-color: #ffffff;
    --footer-hover-color: #02B9E5;

    --footer-social-icons-bg-color: #ffffff;
    --footer-social-icon-color: #000000;
    --footer-social-icons-bg-hover-color: #000000;
    --footer-social-icon-hover-color: #ffffff;

    --footer-heading-font-size: 30px;

    --footer-namebar-bg-color: #244d68;
    --footer-border-color: #E7EFFA;
}

.footer-main{
    position: relative;
    background-color: var(--footer-bg-color);
}

@media (min-width: 992px){
    .footer-main .quick-links{
        width: 22.2222%;
    }
    .footer-main .our-products{
        width: 22.2222%;
    }
    .footer-main .contact-info{
        width: 22.2222%;
    }
}

.footer-main *{
    /* color: var(--footer-color); */
    /* color: var(--text-color); */
    color: var(--dark);
}

.footer-main .row{
    gap: 30px 0;
    padding: 12px 0 12px 0;
}

.footer-main h1,
.footer-main h2,
.footer-main h3{
    color: var(--theme-primary-color);
    margin-bottom: 10px;
    font-size: var(--footer-heading-font-size);
}

.footer-main h1::after,
.footer-main h1::before,
.footer-main h2::after,
.footer-main h2::before,
.footer-main h3::after,
.footer-main h3::before{
    display: none;
}

.footer-main .col-about-inr{
    position: relative;
}

.footer-main .col-about-inr .logo-img{
    width: 180px;
    height: auto;
    object-fit: contain;
}

.footer-main .col-about-inr .short-desc{
    margin: 6px 0 22px 0;
}

/* Footer Social Icons Css Strat Here */

.footer-main .social-logo-wrp{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px 24px;
}

.footer-main .socail-icons-main{
    position: relative;
}

.footer-main .socail-icons-main .social-icons-ul{
    display: flex;
    align-items: center;
    gap: 12px;
}

.footer-main .socail-icons-main .social-icons-link{
    position: relative;
}

.footer-main .socail-icons-main .social-icons-link:hover .icon{
    color: var(--footer-hover-color);
}

.footer-main .socail-icons-main .icon{
    font-size: 36px;
    color: var(--theme-primary-color);
    transition: .3s;
}

/* Footer Social Icons Css End Here */

/* Footer Contact Details Css Strat Here */

.footer-main .info-details-main{
    position: relative;
}

.footer-main .info-details-main h3{
    font-size: 20px;
    margin: 0;
}

.footer-main .info-details-main .person-name{
    font-size: 18px;
    margin: 0 0 10px 0;
    color: var(--dark);
}

.footer-main .info-details-main .details-person{
    padding: 10px 0;
}

.footer-main .info-details-main .details-person1{
    padding-top: 0;
}

.footer-main .info-details-main .details-person:not(:last-child){
    border-bottom: 1px solid var(--theme-border-color);
}

.footer-main .info-details-main .info-ul{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.footer-main .info-details-main .info-link{
    display: inline-flex;
    gap: 12px;
}

.footer-main .info-details-main .info-link:hover .info-text,
.footer-main .info-details-main .info-link:hover .icon{
    color: var(--footer-hover-color);
}

.footer-main .info-details-main .info-text{
    font-size: 16px;
    line-height: 24px;
    transition: .3s;
}

.footer-main .info-details-main .icon{
    font-size: 20px;
    width: 24px;
    text-align: center;
    transition: .3s;
}

/* Footer Contact Details Css End Here */

/* Footer menu Column Css Start Here */

.footer-main .menu-ul{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.footer-main .menu-ul .menu-li{
    margin-bottom: 0;
}

.footer-main .menu-link{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    transition: .3s;
}

.footer-main .menu-link:hover,
.footer-main .menu-link:hover .caret-icon{
    color: var(--footer-hover-color);
}

.footer-main .menu-link .icon{
    font-size: 14px;
    transition: .3s;
}

/* Footer menu Column Css End Here */

/* Footer Bottom Part Css Start Here */

.footer-bottom .all-rights-text{
    padding: 14px 0;
    text-align: center;
    border-top: 1px solid #cdcdcd;
}

.footer-bottom .copyrights-text{
    padding: 16px 0;
    text-align: center;
    background-color: var(--light);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--theme-secondary-color);
}

.footer-bottom .copyrights-text a{
    display: inline;
    color: var(--theme-secondary-color);
    transition: .3s;
}

.footer-bottom .copyrights-text a:hover{
    color: var(--theme-primary-color);
}

.footer-bottom .slasi-logo-img{
    width: 20px;
    height: 20px;
    object-fit: contain;
    position: relative;
    top: 3px;
    margin-right: 8px;
}

/* Footer Bottom Part Css End Here */

/* Footer Copryright Css End Here */

/*========================================
        Footer Css End Here
=========================================*/

.floating-btn-main{
    position: fixed;
    bottom: 10px;
    left: 10px;
    z-index: 101010;
}

.floating-btn-main ul{
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.floating-btn-main ul a{
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--theme-secondary-color);
    background-color: var(--footer-bg-color);
    border-radius: 8px;
    padding: 8px 12px;
    transition: .3s;
}

.floating-btn-main ul a .text{
    color: var(--theme-primary-color);
    transition: .3s;
}

.floating-btn-main ul a .icon{
    font-size: 22px;
    line-height: normal;
   color: var(--theme-primary-color);
    transition: .3s;
}

.floating-btn-main ul a:hover{
    background-color: var(--theme-secondary-color);
}

.floating-btn-main ul a:hover *{
    color: var(--light);
}



/*========================================
        Footer Css End Here
=========================================*/



/*========================================
        Footer Css End Here
=========================================*/

/* Header Footer Icons Css Start Here */

.fa-envelope::before {
    content: "\f0e0";
}

.fa-mobile-android:before, 
.fa-mobile-phone:before, 
.fa-mobile:before {
    content: "\f3ce";
}

.fa-phone::before {
    content: "\f095";
}

.fa-whatsapp:before {
    content: "\f232";
}

.fa-facebook:before {
    content: "\f09a";
}

.fa-linkedin:before {
    content: "\f08c";
}

.fa-instagram:before {
    content: "\f16d";
}

.fa-wheelchair::before {
    content: "\f193";
}

.fa-bars::before {
    content: "\f0c9";
}

.fa-text-size::before {
    content: "\f894";
}

.fa-circle-half-stroke::before {
    content: "\f042";
}

.fa-circle-half-stroke::before {
    content: "\f042";
}

.fa-image::before {
    content: "\f03e";
}

.fa-underline::before {
    content: "\f0cd";
}

.fa-eye-slash::before {
    content: "\f070";
}

.fa-font::before {
    content: "\f031";
}

.fa-arrow-rotate-left::before {
    content: "\f0e2";
}

.fa-circle-xmark::before {
    content: "\f057";
}

.fa-circle-info::before {
    content: "\f05a";
}

.fa-circle-info::before {
    content: "\f05a";
}

.fa-download::before {
    content: "\f019";
}

.fa-phone-flip::before {
    content: "\f879";
}

.fa-angle-left::before {
    content: "\f104";
}

.fa-youtube::before {
    content: "\f167";
}

.fa-pinterest::before {
    content: "\f0d2";
}

.fa-play-circle::before {
    content: "\f144";
}

.fa-close::before, .fa-multiply::before, .fa-remove::before, .fa-times::before, .fa-xmark::before {
    content: "\f00d";
}

.fa-waze::before {
    content: "\f83f";
}

.fa-user::before{
    content: "\f007";
}

.fa-linkedin-in:before {
    content: "\f0e1";
}

.fa-angle-right:before {
    content: "\f105";
}

.fa-angle-left:before {
    content: "\f104";
}

.fa-location-dot:before, 
.fa-map-marker-alt:before {
    content: "\f3c5";
}

.fa-arrow-right:before {
    content: "\f061";
}

.fa-arrows-h:before, 
.fa-arrows-left-right:before {
    content: "\f07e";
}

.fa-chevron-right:before {
    content: "\f054";
}

.fa-chevron-left:before {
    content: "\f053";
}

/* Header Footer Icons Css End Here */

/*========================================
       Opening Section Start Here
=========================================*/

.opening-sec{
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid #cfcfcf;
    margin-bottom: 30px;
}

.opening-sec .opening-img{
    height: 300px;
    border-bottom: 1px solid #cfcfcf;
}

.opening-sec .container{
    position: relative;
}

.opening-sec .container h1{
    position: absolute;
    top: -300px;
    right: 0;
    width: 100%;
    height: 300px;
    display: flex;
    align-items: center;
}

.breadcrumb-main{
    border-top: 1px solid #cfcfcf;
    border-bottom: 1px solid #cfcfcf;
	overflow: hidden;
}

.breadcrumb-main .container{
    max-width: 1410px;
}

.breadcrumb{
    padding: 2px 0;
    display: flex;
    align-items: center;
    gap: 24px;
    margin: 0;
}

.breadcrumb .breadcrumb-item{
    display: flex;
    position: relative;
}

.breadcrumb .breadcrumb-item:first-child::after{
    display: none;
}

.breadcrumb .breadcrumb-item,
.breadcrumb .breadcrumb-item a{
    color: var(--theme-primary-color);
}

.breadcrumb .active,
.breadcrumb .breadcrumb-item .active{
    position: relative;
    color: var(--theme-tertiary-color) !important;
}

.breadcrumb .breadcrumb-item::before,
.breadcrumb .active::before{
    display: none;
}

.breadcrumb .breadcrumb-item::after,
.breadcrumb .active::after{
    content: "/";
    position: absolute;
    left: -16px;
    top: 1px;
    font-size: var(--font-size-20px);
    line-height: var(--line-heights-20px);
    font-family: var(--font-family-regular);
    color: #666666;
}

.openingContent-sec{
    position: relative;
    margin: 30px 0;
}

@media (max-width : 992px){
    .breadcrumb{
        flex-wrap: wrap;
        gap: 4px 14px;
        padding: 4px 0;
    }
    /* .breadcrumb .breadcrumb-item, 
    .breadcrumb .breadcrumb-item a{
        font-size: 14px;
        line-height: 20px;
    } */
    .breadcrumb .breadcrumb-item::after, 
    .breadcrumb .active::after{
        /* font-size: 14px;
        line-height: 20px; */
        left: -10px;
    }
}

@media (max-width : 576px){
    .inner-banner-sec picture .bg-img, 
    .inner-banner-sec .bg-img{
        height: 150px !important;
    }
}

@media (max-width : 992px){
    .inner-banner-sec,
    .only-breadcrumb-main{
        margin-top: 60px;
    }
}

/*========================================
       Opening Section End Here
=========================================*/

#htmlContent .box-link-otr {
    border: 2px solid #999999;
}

#htmlContent .short-desc,
#htmlContent .col-inr ul{
    border: 2px solid #999999;
    padding: 12px;
}

.account-login{
    margin: 120px 0 60px 0;
}

.account-login h3{
    text-align: center;
    margin-bottom: 24px;
}

.account-login .form-group .input-otr{
    display: flex;
    flex-direction: column;
    margin-bottom: 12px;
}

.account-login .form-group label{
    padding: 0 16px 10px 0;
}

.account-login .form-group:nth-child(3) div{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 24px;
}

.account-login .form-group:nth-child(3) div .theme-btn{
    max-width: 300px !important;
    width: 100% !important;
}

.all-projects-sec .content-div h2,
.all-projects-sec .content-div h3{
    -webkit-line-clamp: 3 !important;
}

/* Page editor Css Start Here */

#htmlContent h1,
#htmlContent h2,
#htmlContent h3,
#htmlContent h4,
#htmlContent h5,
#htmlContent h6,
#htmlContent .h1-heading,
#htmlContent .h2-heading,
#htmlContent .h3-heading,
#htmlContent .h4-heading,
#htmlContent .h5-heading,
#htmlContent .h6-heading,
#htmlContent p,
#htmlContent li,
#htmlContent ul,
#htmlContent strong,
#htmlContent span,
#htmlContent b,
#htmlContent font,
#htmlContent article,
#htmlContent form,
#htmlContent .action{
    padding: 8px;
    margin: 8px;
    border: 2px solid #999999;
}

#htmlContent div{
    margin-top: 0;
    margin-bottom: 0;
}

#htmlContent section{
    margin: 10px !important;
}

#htmlContent img{
    margin: 10px !important;
    padding: 10px !important;
    border: 2px solid #e2e2e2;
}

#htmlContent .textarea{
    background-color: #fff;
}

#htmlContent .products-layout-v1 .bg-image1,
#htmlContent .products-layout-v1 .bg-image2,
#htmlContent .contact-layout-v1 .bg-image1,
#htmlContent .contact-layout-v1 .bg-image2,
#htmlContent .products-layout-v4 .bg-image2,
#htmlContent .products-layout-v4 .bg-image1{
    width: 20%;
}

/* Page editor Css End Here */

.gallerySec-main-lay1 h1, 
.gallerySec-main-lay1 h2 {
    margin: inherit !important;
}

.gallerySec-main-lay1 .show-popup{
    z-index: 1120 !important;
}

.gallerySec-main .img-show img{
    object-fit: contain !important;
}

#htmlContent .icon-div{
    border: 2px solid #999;
}

.gallerySec-main-lay1 .row1{
    column-gap: 8px !important;
}

.gallerySec-main-lay1 .row1 .col-inr{
    display: flex !important;
}

.gallerySec-main-lay1 .container .row1 .box-link-otr{
    margin-bottom: 8px !important;
}

.product-details-v1 .wrp-start p{
    margin-bottom: 8px;
}

.product-details-v1 .wrp-start p:last-child{
    margin: 0;
}

.product-details-v1 .wrp-start .custom-ul,
.product-details-v1 .wrp-start .custom-ol{
    margin: 8px 0;
}

#confirmModel{
    display: none;
}
@media (max-width : 992px){
   .floating-btn-main{
      display: none;
   }
}



:root{
    --whatsapp-bg-color: #25d366;
    --whatsapp-icon-color: #ffffff;
}

.contact-section-v2 .whatsapp-btn-otr,
.whatsapp-btn-otr{
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 200000;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 24px 0 30px 0;
    display: none;
}

.contact-section-v2 .whatsapp-btn,
.whatsapp-btn{
    width: 62px;
    height: 62px;
    border-radius: 100%;
    background-color: var(--whatsapp-bg-color);
    position: relative;
    transition: .3s;
}

.contact-section-v2 .whatsapp-btn .icon,
.whatsapp-btn .icon{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 28px;
    color: var(--whatsapp-icon-color);
    transition: .3s;
}

#htmlContent .contact-section-v2 .whatsapp-btn-otr,
#htmlContent .whatsapp-btn-otr{
    display: flex;
}

#htmlContent .contact-section-v2 .whatsapp-btn::before,
#htmlContent .whatsapp-btn::before{
    top: 0;
    left: 0;
}

#htmlContent .contact-section-v2 .whatsapp-btn,
#htmlContent .whatsapp-btn{
    width: 120px;
    height: 120px;
}

@media (max-width : 992px){
    .contact-section-v2 .whatsapp-btn-otr,
    .whatsapp-btn-otr{
        display: flex;
    }
}