/*=========================================================
Template Name:Lifesafe-Real Estate & Property HTML5 Template
https://www.templatemonster.com/authors/techtime/
Description: Description
Version: 1.0.0
Text Domain: Lifesafe
Tags: 	agency, Business Agency, Business Consultant, business optimization, company website, consultancy, Lifesafeng, Lifesafeng Firm, corporate solutions, digital agency, financial analysis, market trends analysis, Strategic insights
================================================*/

/*TABLE OF CONTENTS*/
/*=====================
01. Lifesafe Header Top Menu Area Css
02. Lifesafe Nav Menu Area Css 
03. Lifesafe Slider Area Css
04. Lifesafe Section Title Css
05. Lifesafe Service Area css
06. Lifesafe About Area Css
07. Lifesafe Counter Area Css
08. Lifesafe Testimonial Area Css
09. Lifesafe Process Area Css
10. Lifesafe Team Area Css
11. Lifesafe Faq Area Css
12. Lifesafe Call Do Section Css
13. Lifesafe Form Box Css
14. Lifesafe Blog Area Css
15. Lifesafe footer Area Css
16. Lifesafe Subscribe Area Css
17. Lifesafe Prossess Ber Css
18. Lifesafe Scrollup Section
19. Lifesafe Breadcumb Area Css
20. Lifesafe abouts_areas Css
21. Lifesafe Pricing Section Css
22. Lifesafe Contact  US Css
23. Lifesafe Blog Sidber Widget CSS
24. Lifesafe Search Box Css
25. Lifesafe Loader Css
=======================*/




/*==================================================
 <-- Lifesafe Header Top Menu Area Css-->
===================================================*/
/* Global typography */
/*body, h1, h2, h3, h4, h5, h6, p, span, a, div, button {*/
/*    font-family: "Poppins", Arial, sans-serif; */
/*}*/

/* Global typography - Futura */
body, h1, h2, h3, h4, h5, h6, p, span, a, div, button {
    font-family: "Futura", "Trebuchet MS", Arial, sans-serif;
}



/* Global typography - Monospace */
/*body, h1, h2, h3, h4, h5, h6, p, span, a, div, button {*/
/*    font-family: "Courier New", Courier, monospace;*/
/*}*/


.topbar-area {
    padding: 15px 0;
    background: #0D3E83;
    position: relative;
}

.topbar-area .container {
    max-width: 1600px;
}

.topbar-items ul {
    list-style: none;
}

.topbar-items ul li {
    display: inline-block;
    margin-right: 100px;
}

.topbar-items ul li.line {
    position: relative;
}

.topbar-items ul li.line::before {
    position: absolute;
    content: "";
    width: 1px;
    height: 60px;
    background: rgba(0, 58, 55, 0.702);
    right: -54px;
    top: -17px;
}

.topbar-items ul li a {
    font-size: 16px;
    color: #fff;
    font-weight: 500;
    text-decoration: none;
    font-family: "Raleway";
}

.topbar-items ul li i {
    margin-right: 5px;
    font-size: 18px;
    color: #FFF;
}

.topbar-social {
    text-align: right;
}

.topbar-social h4 {
    display: inline-block;
    margin-right: 7px;
    font-size: 16px;
    color: #ffffff;
    font-weight: 400;
    font-family: "Raleway";
}

.topbar-social ul {
    list-style: none;
    display: inline-block;
}

.topbar-social ul li {
    display: inline-block;
    margin-right: 11px;
}

.topbar-social ul li a {
    color: #FFF;
    font-size: 16px;
}



/*==================================================
 <-- Lifesafe Header Area Css-->
===================================================*/

.header-area {
    position: relative;
    background: #fff;
    filter: drop-shadow(0px 1px 25.5px rgba(0, 0, 0, 0.11));
    z-index: 9;
}

.header-area::before {
    position: absolute;
    content: "";
    width: 452px;
    height: 140px;
    background-color: #0D3E83;
    left: 0;
    top: 0;
    z-index: -1;

}

.header-area::after {
    position: absolute;
    content: "";
    width: 720px;
    height: 42px;
    background: #0D3E83;
    transform: skewX(-10deg);
    z-index: -111;
    left: 12%;
}

.header-area .container {
    max-width: 1600px;
}

.header-menu {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-left: 80px;
}

.header-menu ul {
    list-style: none;
    display: inline-block;
}

.header-menu ul li {
    display: inline-block;
    margin-right: 54px;
}

.header-menu ul li a {
    font-size: 18px;
    color: #003a37;
    font-weight: 500;
    position: relative;
    transition: .5s;
    padding: 36px 0;
    text-decoration: none;
    display: inline-block;
}

.header-menu ul li a:hover {
    color: #0D3E83;
}

.header-menu ul li a i {
    font-size: 20px;
    position: relative;
    top: 2px;
    left: -6px;
}

.header-right {
    display: flex;
    align-items: center;
}

.header-search {
    margin-right: 44px;
}

.header-sidebar {
    margin-left: 35px;
}

.header-sidebar a {
    font-size: 42px;
}


/* sticky menu css */

.sticky-nav {
    left: 0;
    margin: auto;
    top: 0;
    right: 0;
    width: 100%;
    position: fixed !important;
    box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);
    -webkit-animation: 300ms running fadeInDown;
    animation: 500ms running fadeInUp;
    -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
    transition: 0.5s !important;
    background: #FFF !important;
    z-index: 9999 !important;
    animation: fadeInDown 1s both 0.2s;
    padding: 0 30px;
}

.sticky-nav .logo {
    margin-top: 0;
}


/* sub menu */

.header-menu ul .sub-menu {
    background: #fff;
    position: absolute;
    top: 98%;
    border-radius: 5px;
    width: 250px;
    text-align: left;
    margin: 0;
    -webkit-box-shadow: 0px 1px 3px rgb(0 0 0 / 30%);
    visibility: hidden;
    opacity: 0;
    z-index: 999;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-transform: scaleY(0) translateZ(100px);
    transform: scaleY(0) translateZ(100px);
    -webkit-transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, -webkit-transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease, -webkit-transform 700ms ease;
    overflow: hidden;
    padding: 10px 10px;
}

.header-menu ul li:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scaleY(1) translateZ(0px);
    transform: scaleY(1) translateZ(0px);
}

.header-menu ul .sub-menu ul li {
    display: inline-block;
    margin-left: 0;
    width: 100%;
}

.header-menu ul .sub-menu ul li a {
    padding: 8px 12px;
    text-align: left;
    width: 100%;
    display: inline-block;
    visibility: inherit !important;
    color: #003d4d;
    margin: 0;
    font-size: 18px;
    font-weight: 500;
    position: relative;
    z-index: 1;
}

.header-menu ul .sub-menu ul li a:hover {
    color: #fff;
}

.header-menu ul .sub-menu ul li a::before {
    position: absolute;
    content: "";
    width: 50%;
    height: 100%;
    background: #0D3E83;
    left: 0;
    top: 0;
    transition: 0.5s;
    z-index: -1;
    opacity: 0;
}

.header-menu ul .sub-menu ul li a:hover::before {
    width: 100%;
    opacity: 1;
}

.header-menu ul .sub-menu ul li a::after {
    position: absolute;
    content: "";
    width: 50%;
    height: 100%;
    background: #0D3E83;
    right: 0;
    top: 0;
    transition: 0.5s;
    z-index: -1;
    opacity: 0;
}

.header-menu ul .sub-menu ul li a:hover::after {
    width: 100%;
    opacity: 1;
}

/* mobile menu */

.mobile-menu-area {
    display: none;
}


/*==================================================
 <-- Lifesafe All Btn Css-->
===================================================*/

.Lifesafe-btn {
    display: inline-block;
}

.Lifesafe-btn a {
    display: inline-block;
    font-size: 18px;
    color: #ffffff;
    font-family: "Raleway";
    background: #0D3E83;
    text-decoration: none;
    padding: 16px 27px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    border-radius: 10px;
}

.Lifesafe-btn a::before {
    position: absolute;
    content: '';
    top: 0;
    left: -30px;
    width: 0;
    height: 100%;
    background: #212529;
    transition: .5s;
    transform: skew(35deg, 0deg) scale(1.7);
    z-index: -1;
    transition: 0.5s;
}

.Lifesafe-btn a:hover:before {
    width: 100%;
}

/* slider btn */

.Lifesafe-btn.slider1 {
    position: relative;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(-120px);
    transform: translateY(-120px);
    -webkit-transition-delay: 1000ms;
    transition-delay: 1000ms;
    -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease;
    transition: opacity 2000ms ease, -webkit-transform 2000ms ease;
    transition: transform 2000ms ease, opacity 2000ms ease;
    transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease;
}

.active .Lifesafe-btn.slider1 {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
}

/* explore btn */

.Lifesafe-btn.explore a {
    background: #FFF;
    color: #0D3E83;
}

.Lifesafe-btn.explore a:hover {
    color: #fff;
}

/*==================================================
 <-- Lifesafe Banner Area Css-->
===================================================*/
.banner-section {
    position: relative;
    display: block;
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 1;
}

.banner-carousel .slide-item {
    position: relative;
    overflow: hidden;
    min-height: 730px;
    top: 42px;
}

.banner-carousel .slide-item .image-layer {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease;
    transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease;
    transition: transform 7000ms ease, opacity 1500ms ease-in;
    transition: transform 7000ms ease, opacity 1500ms ease-in, -webkit-transform 7000ms ease;
}

.banner-carousel .slide-item .image-layer:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.20);
    content: "";
    z-index: -1;
}

.banner-carousel .active .slide-item .image-layer {
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
}

.slider-content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 45%;
    left: 11%;
}

.slider-sub-icon {
    display: inline-block;
    position: relative;
    top: 4px;
}

.slider-sub-title {
    margin-bottom: 28px;
    position: relative;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(-120px);
    transform: translateY(-120px);
    -webkit-transition-delay: 1000ms;
    transition-delay: 1000ms;
    -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease;
    transition: opacity 2000ms ease, -webkit-transform 2000ms ease;
    transition: transform 2000ms ease, opacity 2000ms ease;
    transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease;
}

.active .slider-sub-title {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
}


.slider-sub-title h4 {
    border-radius: 16px;
    font-size: 16px;
    font-weight: 600;
    color: #0D3E83;
    font-family: "Raleway";
    position: relative;
    background: #FFF;
    display: inline-block;
    padding: 6px 18px;
}

.slider-main-title {
    position: relative;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(-120px);
    transform: translateY(-120px);
    -webkit-transition-delay: 1000ms;
    transition-delay: 1000ms;
    -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease;
    transition: opacity 2000ms ease, -webkit-transform 2000ms ease;
    transition: transform 2000ms ease, opacity 2000ms ease;
    transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease;
}

.slider-main-title h1 {
    font-size: 72px;
    line-height: 82px;
    color: #ffffff;
    font-weight: 700;
}

.active .slider-main-title {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
}

.slider-main-title h1 {
    font-size: 72px;
    line-height: 82px;
    color: #003a37;
    font-weight: 800;
}

.slider-discription {
    position: relative;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(120px);
    transform: translateY(120px);
    -webkit-transition-delay: 1000ms;
    transition-delay: 1000ms;
    -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease;
    transition: opacity 2000ms ease, -webkit-transform 2000ms ease;
    transition: transform 2000ms ease, opacity 2000ms ease;
    transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease;
}


.active .slider-discription {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
}

.slider-discription p {
    font-size: 16px;
    line-height: 24px;
    color: #505050;
    font-weight: 400;
    margin: 30px 0 56px;
    width: 85%;
}

/* video icon */

.video-icon {
    display: inline-block;
    margin-left: 35px;
    position: relative;
    top: -16px;
}

.video-icon a {
    width: 60px;
    height: 60px;
    background-color: #0D3E83;
    display: inline-block;
    line-height: 60px;
    font-size: 38px;
    color: #FFF;
    position: relative;
    transition: 0.5s;
    border-radius: 50%;
    text-align: center;
}

.video-icon a::before {
    content: "";
    border: 4px solid #ffffff;
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    margin: auto;
    transform: translate(-50%, -50%);
    display: block;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    -webkit-animation: zoombig 3.25s linear infinite;
    animation: zoombig 3.25s linear infinite;
    -webkit-animation-delay: .8s;
    animation-delay: .8s;
}

.video-icon a::after {
    content: "";
    border: 4px solid #ffffff;
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 150px;
    height: 150px;
    -webkit-animation: zoombig 3.25s linear infinite;
    animation: zoombig 3.25s linear infinite;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
}


/* video area css */

.video-area {
    height: 1000px;
    position: relative;
}

.video-area {
    height: 1000px;
    position: relative;
}

video.video-background {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -1;
}

/*==================================================
 <-- Lifesafe Section title Css-->
===================================================*/

.section-sub-title h4 {
    font-size: 19px;
    color: #0D3E83;
    font-weight: 600;
    font-family: "Raleway";
    margin-bottom: 12px;
    padding: 0 95px;
    position: relative;
    display: inline-block;
}

.section-sub-title h4::before {
    position: absolute;
    content: "";
    width: 82px;
    height: 2px;
    background: #0D3E83;
    left: 0;
    top: 50%;
}

.section-main-title h2 {
    font-size: 48px;
    color: #23222a;
    font-weight: 800;
    font-family: "Raleway";
    margin-bottom: 42px;
}

/*==================================================
 <-- Lifesafe Feature Area Css-->
===================================================*/

.feature-area {
    padding: 90px 0 120px;
}

.feature-single-box {
    filter: drop-shadow(0px 1px 25.5px rgba(0, 0, 0, 0.11));
    background-color: #ffffff;
    position: relative;
    z-index: 1;
    padding: 45px 20px 23px;
    top: 0;
    overflow: hidden;
    transition: all 500ms ease;
}

.feature-single-box:hover {
    top: -30px;
}

.feature-single-box::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 2px;
    background-color: #0D3E83;
    bottom: 0;
    left: 0;
    transition: all 500ms ease;
    z-index: -1;
}

.feature-single-box:hover::before {
    height: 100%;
}

.fetaure-icon img {
    -webkit-transition: all 500ms linear;
    transition: all 500ms linear;
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
    filter: brightness(0) saturate(100%) invert(11%) sepia(100%) saturate(7487%) hue-rotate(1deg) brightness(89%) contrast(103%);
}

.feature-single-box:hover .fetaure-icon img {
    transform: scale(.9);
    filter: brightness(0)invert(1);
}

.feature-content h4 {
    font-size: 24px;
    line-height: 24px;
    color: #23222a;
    font-weight: 700;
    margin: 33px 0 21px;
    transition: all 500ms linear;
}

.feature-single-box:hover .feature-content h4 {
    color: #FFF;
}

.feature-content p {
    font-size: 16px;
    line-height: 24px;
    color: #505050;
    font-weight: 400;
    transition: all 500ms linear;
}

.feature-single-box:hover .feature-content p {
    color: #FFF;
}

.feature-shape {
    position: absolute;
    z-index: -1;
    bottom: 0;
    right: 0;
    -webkit-transition: all 500ms ease;
    transition: all 500ms ease;
    transition-delay: 400ms;
    transform: translateX(100%);
    opacity: 0;
}

.feature-single-box:hover .feature-shape {
    transform: translateX(0%);
    opacity: 1;
}



/*==================================================
 <-- Lifesafe About Area Css-->
===================================================*/
.about-area {
    padding: 0 0 120px;
}

/* about section title */

.section-main-title.about h2 {
    margin-bottom: 20px;
}

/* about thumb */

.about-thumb img {
    width: 100%;
    border-radius: 10px;
    /*! top: 10px; */
}

.about-discription p {
    font-size: 16px;
    line-height: 24px;
    color: #505050;
    font-weight: 400;
}

/* tab css */

ul.tabs {
    margin: 20px 0 60px;
}

.tab.list-tab ul li {
    list-style: none;
    display: inline-block;
    margin-right: 5px;
}

.tab.list-tab ul li a {
    text-decoration: none;
    font-size: 16px;
    color: #23222a;
    font-weight: 500;
    background: #ececec;
    padding: 8px 20px;
    border-radius: 5px;
}

.tab.list-tab ul li.current a {
    background: #0D3E83 !important;
    color: #FFF !important;
}

/* about list  */

.about-list ul li {
    display: block !important;
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 24px;
    color: #505050;
    font-weight: 400;
}

/* about bottom */

.about-bottom {
    display: flex;
    align-items: center;
    margin-top: 37px;
}

.about-us-icon i {
    width: 56px;
    height: 56px;
    border-radius: 28px;
    border: 1px solid #ececec;
    display: inline-block;
    text-align: center;
    line-height: 56px;
    margin-left: 27px;
    color: #0D3E83;
}

.about-us-phone {
    margin-left: 26px;
}

.about-us-phone h5 {
    font-size: 16px;
    line-height: 28px;
    color: #505050;
    font-weight: 400;
}

.about-us-phone h5 span {
    display: block;
    font-size: 18px;
    font-weight: 500;
    color: #0D3E83;
}


/*==================================================
 <-- Lifesafe Service Area Css-->
===================================================*/

.service-area {
    background: #f5fdff;
    padding: 120px 0 150px;
}

.service-single-box {
    position: relative;
}

.service-thumb {
    position: relative;
    z-index: 1;
}

.service-thumb::before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 0;
    content: "";
    background-color: rgba(37, 130, 106, 0.30);
    transition: all 500ms ease;
    z-index: 1;
}

.service-single-box:hover .service-thumb::before {
    height: 100%;
}

.service-thumb img {
    width: 100%;
}

.service-icon {
    position: absolute;
    bottom: -17px;
    right: 20px;
    width: 98px;
    height: 88px;
    border-radius: 5px;
    filter: drop-shadow(0px 1px 25.5px rgba(0, 0, 0, 0.11));
    background-color: #ffffff;
    text-align: center;
    line-height: 83px;
    z-index: 1;
}

.service-icon::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 3px;
    background: #0D3E83;
    bottom: 0;
    left: 0;
    border-radius: 5px 5px 0 0;
    transition: all 700ms ease;
}

.service-single-box:hover .service-icon::before {
    height: 100%;
}

.service-icon img {
    width: auto;
    -webkit-transition: all 500ms linear;
    transition: all 500ms linear;
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.service-single-box:hover .service-icon img {
    transform: scale(.9);
    filter: brightness(0)invert(1);
}

.service-content {
    background-color: #ffffff;
    border: 1px solid #ececec;
    padding: 55px 40px 0;
}

.service-content h4 a {
    font-size: 24px;
    line-height: 24px;
    color: #23222a;
    font-weight: 700;
    text-decoration: none;
    transition: all 500ms linear;
}

.service-single-box:hover .service-content h4 a {
    color: #0D3E83;
}

.service-content p {
    font-size: 16px;
    line-height: 24px;
    color: #505050;
    font-weight: 400;
    margin: 20px 0 55px;
}

/* service btn */

.Lifesafe-btn.service {
    position: absolute;
    bottom: -35px;
    left: 50%;
    transform: translateX(-50%);
}

.Lifesafe-btn.service a {
    width: 185px;
    height: 52px;
    border-radius: 5px;
    padding: 0;
    line-height: 52px;
    text-align: center;
}

.service-single-box:hover .Lifesafe-btn.service a::before {
    width: 100%;
}


/*==================================================
 <-- Lifesafe Protection Area Css-->
===================================================*/

/* .protection-area {
    background: url(../images/resource/protection-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 278px;
    padding: 112px 0 0;
} */

/* .protection-area {
    background: linear-gradient(to bottom, #258169, #258169);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 278px;
    padding: 112px 0 0;
} */


.protection-area {
    background: linear-gradient(to bottom, #0d3d81, #258169), 
    url(../images/resource/woman.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 278px;
    padding: 112px 0 0;
}



.protection-content h4 {
    font-size: 42px;
    line-height: 52px;
    color: #f5fdff;
    font-weight: 700;
}

/* protection btn */

.Lifesafe-btn.protection {
    display: block;
    text-align: right;
}

.Lifesafe-btn.protection a {
    background: #f5fdff;
    color: #0D3E83;
}

.Lifesafe-btn.protection a:hover {
    color: #FFF;
}


/*==================================================
 <-- Lifesafe Choose us Area Css-->
===================================================*/

.choose-us-area {
    padding: 120px 0 120px;
}

.choose-discription p {
    font-size: 16px;
    line-height: 24px;
    color: #505050;
    font-weight: 400;
    margin-bottom: 30px;
}

.row.choose {
    border-bottom: 1px solid #ebebeb;
    padding: 0px 0 25px;
    margin-bottom: 46px;
}

.choose-list span {
    display: block;
    margin-bottom: 28px;
    font-size: 18px;
    line-height: 24px;
    color: #23222a;
    font-weight: 600;
}

.choose-list span i {
    color: #0D3E83;
    font-weight: 800;
}

.choose-thumb-items {
    position: relative;
}

.choose-thumb {
    margin-bottom: 30px;
    position: relative;
}

.choose-thumb.three {
    position: absolute;
    right: -40px;
    top: 50%;
    transform: translateY(-50%);
}

/*==================================================
 <-- Lifesafe Insurance Area Css-->
===================================================*/

.insurance-area {
    padding: 0 0 120px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.insurance-area::before {
    position: absolute;
    content: "";
    width: 62%;
    height: 92%;
    z-index: 99;
    bottom: -71px;
    left: -107px;
    transform: skewX(-15deg);
    background: linear-gradient(90deg, rgba(108,107,131,1) 0%, rgba(11,11,201,1) 35%, rgba(6,165,198,1) 100%);
}

/* insurance tab */

.tab.insurance-list-tab {
    margin-top: 65px;
    position: relative;
    z-index: 1111;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
}

.tab.insurance-list-tab ul li {
    list-style: none;
    display: inline-block;
    margin-right: 10px;
}

.tab.insurance-list-tab ul li a {
    display: inline-block;
    text-decoration: none;
    background: #23222a;
    color: #FFF;
    padding: 11px 25px;
    border-radius: 7px;
    font-size: 17px;
    line-height: 24px;
    color: #ffffff;
    font-weight: 500;
}


/* insurance form */

.insurance-form-box label {
    font-size: 18px;
    line-height: 24px;
    color: #ffffff;
    font-weight: 500;
    margin-bottom: 20px;
}

.insurance-form-box input {
    width: 278px;
    height: 51px;
    border-radius: 3px;
    border: 0;
    outline: 0;
    padding: 0 20px;
    color: #000;
    margin-bottom: 25px;
    border: 1px solid #B0B8D1;
    background: #F0F4FF;
}
.insurance-form-box input:focus {
    border-color: #4A90E2; /* Blue border on focus */
    outline: none;
}

.insurance-form-box input::placeholder {
    font-size: 16px;
    line-height: 24px;
    color: #b0c9c2;
    font-weight: 500;
}

.limit-title h4 {
    font-size: 18px;
    color: #feffff;
    font-weight: 500;
    margin-bottom: 22px;
}

.limit-baclance {
    position: relative;
}

.limit-baclance::before {
    position: absolute;
    content: "";
    width: 96%;
    height: 12px;
    border-radius: 3px;
    background-color: #309178;
}

.limit-baclance::after {
    position: absolute;
    content: "";
    width: 398px;
    height: 12px;
    border-radius: 3px;
    background-color: #FFF;
}

.limit-value {
    margin: 70px 0 22px;
}

.limit-value h4 {
    font-size: 18px;
    color: #feffff;
    font-weight: 500;
}

.insurance-form-box-button button {
    font-size: 20px;
    color: #0D3E83;
    font-weight: 500;
    font-family: "Raleway";
    padding: 16px 27px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    border: none;
    outline: 0;
    width: 584px;
    height: 56px;
    border-radius: 5px;
    background-color: #ffffff;
    transition: 0.5s;
}

.insurance-form-box-button button:hover {
    color: #FFF;
}

.insurance-form-box-button button::before {
    position: absolute;
    content: '';
    top: 0;
    left: -30px;
    width: 0;
    height: 100%;
    background: #212529;
    transition: .5s;
    transform: skew(35deg, 0deg) scale(1.7);
    z-index: -1;
    transition: 0.5s;
}

.insurance-form-box-button button:hover:before {
    width: 100%;
}

/* google map */

.google-map {
    position: absolute;
    bottom: -16px;
}


/*==================================================
 <-- Lifesafe Testimonial Area Css-->
===================================================*/

.testimonial-area {
    padding: 120px 0 90px;
}

.testi-single-box {
    filter: drop-shadow(0px 1px 25.5px rgba(0, 0, 0, 0.11));
    background-color: #ffffff;
    position: relative;
    padding: 32px 40px 40px;
    margin-bottom: 30px;
    position: relative;
}

.testi-single-box::before,
.testi-single-box::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
}

.testi-single-box::before {
    left: 0px;
    bottom: 0px;
    border-bottom: 1px solid transparent;
    border-left: 1px solid transparent;
    transition: all 0.6s linear;
}

.testi-single-box::after {
    right: 0px;
    top: 0px;
    border-top: 1px solid transparent;
    border-right: 1px solid transparent;
    transition: all 0.6s linear;
}

.testi-single-box:hover::before,
.testi-single-box:hover::after {
    border-color: #0D3E83;
    width: 100%;
    height: 100%;
}

.testi-title {
    margin-bottom: 7px;
}

.testi-title h4 {
    font-size: 24px;
    line-height: 28px;
    color: #23222a;
    font-weight: 700;
}

.testi-title span {
    font-size: 16px;
    line-height: 37px;
    color: #505050;
    font-weight: 400;
}

.testi-icon i {
    color: #0D3E83;
    font-size: 18px;
}

.testi-discription {
    position: relative;
}

.testi-discription::before {
    position: absolute;
    content: "";
    width: 1px;
    height: 58px;
    background-color: #0D3E83;
    left: 0;
    top: -7px;
}

.testi-discription p {
    font-size: 16px;
    line-height: 24px;
    color: #505050;
    font-weight: 400;
    margin: 27px 22px 0;
}

.testi-qouet {
    position: absolute;
    top: 0;
    right: 0;
}

.testi-qouet i {
    font-size: 100px;
    color: #0D3E83;
    opacity: 0.071;
}

.testi-qouet {
    position: absolute;
    top: 20px;
    right: 20px;
}

/* testi thumb */

.testi-thumb {
    position: relative;
}


/* testi counter */

.testi-counter {
    position: absolute;
    top: 20px;
    right: -130px;
    width: 184px;
    height: 91px;
    background-color: #0D3E83;
    padding: 14px 8px 0;
    z-index: 1;
}

.testi-counter::before {
    position: absolute;
    content: "";
    height: 35px;
    width: 40px;
    background: #0D3E83;
    bottom: -19px;
    right: 20px;
    clip-path: polygon(82% 41%, 106% 40%, 50% 100%, 0% 42%);
    z-index: -1;
    transition: .5s;
}

.testi-counter h4 {
    font-size: 24px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 600;
    display: inline-block;
}

.testi-counter span {
    font-size: 22px;
    color: #ffffff;
    font-weight: 600;
    display: inline-block;
}

.testi-counter p {
    font-size: 20px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 400;
}


/*==================================================
 <-- Lifesafe Blog Area Css-->
===================================================*/

.blog-area {
    padding: 0 0 120px;
}


.blog-content {
    border: 1px solid #0D3E83;
    padding: 30px 16px 0px;
    background: rgba(245, 253, 255, 0.180);
    z-index: 1;
    position: relative;
    overflow: hidden;
}

.blog-content::before {
    position: absolute;
    content: '';
    top: 0;
    left: -58px;
    width: 0;
    height: 100%;
    background: #0D3E83;
    transition: .5s;
    transform: skew(35deg, 0deg) scale(1.7);
    z-index: -1;
    transition: 0.5s;
}

.blog-single-box:hover .blog-content::before {
    width: 100%;
}

.blog-month {
    float: left;
    margin-right: 19px;
    margin-bottom: 31px;
    width: 93px;
    height: 91px;
    background-color: #0D3E83;
    padding: 18px 0 0;
    text-align: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.blog-month::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: #FFF;
    transition: ease all 500ms;
    transform: skew(35deg, 0deg) scale(1.7);
    z-index: -1;
}

.blog-single-box:hover .blog-month::before {
    width: 100%;
}


.blog-month h4 {
    font-size: 40px;
    line-height: 24px;
    color: #ffffff;
    font-weight: 500;
    transition: ease all 500ms;
}

.blog-single-box:hover .blog-month h4 {
    color: #0D3E83;
}

.blog-month span {
    font-size: 16px;
    line-height: 42px;
    color: #ffffff;
    font-weight: 500;
    transition: ease all 500ms;
}

.blog-single-box:hover .blog-month span {
    color: #0D3E83;
}

.blog-text h4 a {
    font-size: 20px;
    line-height: 24px;
    color: #0D3E83;
    font-weight: 600;
    text-decoration: none;
    transition: ease all 500ms;
}

.blog-single-box:hover .blog-text h4 a {
    color: #FFFFFF;
}

.blog-text p {
    font-size: 14px;
    line-height: 24px;
    color: #505050;
    font-weight: 500;
    margin: 14px 0 0;
    transition: ease all 500ms;
}

.blog-single-box:hover .blog-text p {
    color: #FFFFFF;
}

.blog-thumb {
    position: relative;
    overflow: hidden;
}

.blog-thumb::before {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    content: '';
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    z-index: 1;
}

.blog-single-box:hover .blog-thumb::before {
    -webkit-animation: circle .75s;
    animation: circle .75s;
    opacity: 1;
}

.blog-thumb img {
    width: 100%;
    position: relative;
    display: block;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.7s ease 0s;
    transition: all 0.7s ease 0s;
}

.blog-single-box:hover .blog-thumb img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}




/*==================================================
 <-- Lifesafe Footer Area Css-->
===================================================*/

.footer-area {
    padding: 100px 0 80px;
    background: #171717;
    position: relative;
    z-index: 1;
}

.footer-area .container {
    max-width: 1450px;
}

/* footer widget */

.footer-wiget-title h4 {
    color: #FFF;
    font-size: 24px;
    font-style: normal;
    line-height: 34px;
    font-weight: 600;
    padding: 0 0 18px;
    transition: .5s;
}

.footer-wiget-title h4 {
    color: #FFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 34px;
    padding: 0 20px 27px;
    position: relative;
}

.footer-wiget-title h4::before {
    position: absolute;
    content: "";
    bottom: 17px;
    width: 3px;
    height: 30px;
    background-color: #21c8a9;
    top: 0;
    left: 0;
}

.footer-socilal-title h4 {
    opacity: 0.800;
    font-size: 22px;
    line-height: 34px;
    color: #ffffff;
    font-weight: 500;
    margin-bottom: 16px;
    padding: 0 20px;
    position: relative;
}

.footer-socilal-title h4::before {
    position: absolute;
    content: "";
    width: 3px;
    height: 30px;
    background: #0D3E83;
    left: 0px;
}

/* footer widget inner */

.footer-wiget.inner {
    text-align: center;
    position: relative;
    z-index: 1;
    left: -100px;
}

.footer-wiget.inner::before {
    position: absolute;
    content: "";
    width: 436px;
    height: 500px;
    left: -42px;
    top: -100px;
    z-index: -1;
    background: rgb(52,47,156);
    background: linear-gradient(90deg, rgba(52,47,156,1) 0%, rgba(21,91,191,0.40798326166404064) 35%, rgba(6,165,198,1) 100%);
}

.footer-wiget-logo {
    position: relative;
    top: -50px;
}

.footer-wiget-text h4 {
    margin: 0px 0 22px;
    font-size: 16px;
    line-height: 28px;
    color: #ffffff;
    font-weight: 400;
}

/* footer social */

.footer-social ul li {
    list-style: none;
    display: inline-block;
    margin-right: 15px;
}

.footer-social ul li a i {
    width: 56px;
    height: 56px;
    line-height: 56px;
    text-align: center;
    display: inline-block;
    border: 1px dashed #1a3851;
    font-size: 24px;
    color: #FFF;
    transition: .5s;
    position: relative;
    z-index: 1;
}

.footer-social ul li a:hover i {
    color: #0D3E83;
    border: 1px dashed #0D3E83;
}

.footer-social ul li a i::after {
    position: absolute;
    top: 0;
    right: 0;
    width: 0px;
    height: 100%;
    content: "";
    bottom: 0;
    background: #FFF;
    z-index: -1;
    transition: .5s;
    margin: auto;
}

.footer-social ul li a i:hover::after {
    width: 100%;
    left: 0;
}


.footer-wiget-menu ul {
    list-style: none;
}

.footer-wiget-menu ul li {
    list-style: none;
    margin-top: 0px;
}

.footer-wiget-menu ul li a {
    display: inline-block;
    text-decoration: none;
    font-size: 18px;
    font-weight: 400;
    transition: .5s;
    margin: 0;
    line-height: 50px;
    color: #ffffff;
}

.footer-wiget-menu ul li a:hover {
    color: #0D3E83;
    margin-left: 10px;
}

.footer-wiget-menu ul li a i {
    color: #0D3E83;
}

/* company work */

.company-work-hour ul li {
    display: block;
    list-style: none;
    color: #f8f8f8;
    opacity: .8;
    font-size: 18px;
    font-weight: 400;
    padding: 0 0 14px;
    margin-bottom: 20px;
    border-bottom: 1px solid #0D3E83;
}

.company-work-hour ul li span {
    float: right;
}

li.table-brb {
    border: inherit !important;
}

li.table-brb span.style {
    background: #0D3E83;
    padding: 2px 4px;
    font-size: 14px;
    border-radius: 5px;
}


/*==================================================
 <-- Lifesafe Home page two All  Css-->
===================================================*/


/* header area */

.header-area.style-two::before {
    background: #01bdb2;
    height: 100%;
}

.header-area.style-two::after {
    display: none;
}

.header-menu.style-two ul li a {
    padding: 40px 0;
    color: #01bdb2;
}

.header-menu.style-two ul .sub-menu ul li a {
    color: #01bdb2;
}

.header-menu.style-two ul .sub-menu ul li a:hover {
    color: #ffffff;
}

.header-menu.style-two ul .sub-menu ul li a:hover::before {
    background: #01bdb2;
}

.header-menu.style-two ul .sub-menu ul li a:hover::after {
    background: #01bdb2;
}


.Lifesafe-btn.style-two a {
    background: #01bdb2;
}

/* slider area */

.slide-item.one {
    height: 810px;
    top: 0;
}

.slider-content.style-two {
    left: 9%;
}

.slider-sub-title.style-two h4 {
    color: #01bdb2;
}

.slider-main-title.style-two h1 {
    color: #ffffff;
}

.slider-discription.style-two p {
    color: #d1d1d1;
}

.Lifesafe-btn.slider1.style-two a {
    background: #01bdb2;
}

.video-icon.style-two {
    position: absolute;
    right: -50%;
    top: 50%;
    transform: translateY(-50%);
}

.video-icon.style-two a {
    background: #01bdb2;
    width: 80px;
    height: 80px;
    line-height: 80px;
}

.video-icon.style-two a i {
    font-size: 60px;
}

/* ABOUT AREA STYLE TWO */

.about-area.style-two {
    background: url(../images/about/about-bg.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 120px 0 120px;
}

p.about2 {
    margin-bottom: 55px;
}

.Lifesafe-btn.about1 {
    margin-right: 30px;
}

.Lifesafe-btn.about1 a {
    background: #0bbeb4;
    border: 1px solid #0bbeb4;
}

.Lifesafe-btn.about2 a {
    background: none;
    border: 1px solid #0bbeb4;
    color: #0bbeb4;
}

/* COUNTER AREA */

.row.number-count {
    text-align: center;
    border-top: 1px solid;
    border-bottom: 1px solid #505050;
    padding: 60px 0 60px;
}

.counter-single-box {
    position: relative;
}

.counter-single-box::before {
    position: absolute;
    content: "";
    width: 1px;
    height: 192px;
    background-color: #505050;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.counter-single-box.inner::before {
    display: none;
}

.counter-number {
    display: inline-flex;
    align-items: center;
    margin-right: 20px;
}

.counter-number h4 {
    font-size: 60px;
    color: #23222a;
    font-weight: 700;
    font-family: "Rubik";
}

.counter-number span {
    font-size: 60px;
    color: #23222a;
    font-weight: 700;
    font-family: "Rubik";
}

.counter-content {
    display: inline-block;
    text-align: left;
}

.counter-content h4 {
    font-size: 18px;
    line-height: 24px;
    color: #505050;
    font-weight: 500;
    font-family: "Raleway";
}


/* PROJECT AREA */

.project-area {
    padding: 120px 0 0;
}

.project-single-box {
    overflow: hidden;
}

.project-thumb {
    position: relative;
}

.project-thumb::before {
    position: absolute;
    left: 0;
    content: "";
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 186, 235, 0.56);
    z-index: 1;
    opacity: 0.5;
    -webkit-transform: scaleY(0) translateZ(100px);
    -ms-transform: scaleY(0) translateZ(100px);
    transform: scaleY(0) translateZ(100px);
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease, -webkit-transform 700ms ease;
    transition: opacity 500ms ease, visibility 500ms ease, transform 700ms ease, -webkit-transform 700ms ease;
    visibility: hidden;
}

.project-single-box:hover .project-thumb::before {
    -webkit-transform: scaleY(1) translateZ(0px);
    -ms-transform: scaleY(1) translateZ(0px);
    transform: scaleY(1) translateZ(0px);
    visibility: visible;
}

.project-thumb img {
    transition: all 2s ease;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.project-single-box:hover .project-thumb img {
    -ms-transform: scale(1.15);
    transform: scale(1.15);
}

.project-icon {
    position: absolute;
    top: 30px;
    right: -56px;
    opacity: 0;
    transition: 0.3s cubic-bezier(0.5, 1, 0.89, 1);
}

.project-single-box:hover .project-icon {
    right: 30px;
    opacity: 1;
}

.project-icon a {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #0bbeb4;
    color: #ffff;
    display: inline-block;
    text-align: center;
    line-height: 60px;
    font-size: 18px;
    position: relative;
    z-index: 1;
    transform: scale(1);
    transition: transform 500ms ease;
}

.project-icon a:hover {
    transform: scale(0.9);
}

.project-icon a::before {
    content: "";
    position: absolute;
    height: 0px;
    width: 0px;
    top: 50%;
    left: 50%;
    border-radius: 500px;
    background: #23222a;
    transition: all 0.4s ease-in-out 0s;
    z-index: -1;
}

.project-icon a:hover::before {
    height: 100%;
    width: 100%;
    top: 0%;
    left: 0%;
}

.project-content {
    position: absolute;
    bottom: -70px;
    width: 367px;
    height: 116px;
    background-color: #0bbeb4;
    padding: 26px 30px 0;
    z-index: 1;
    overflow: hidden;
    opacity: 0;
    transition: all 0.4s ease-in-out;
}

.project-single-box:hover .project-content {
    bottom: 0;
    opacity: 1;
}

.project-content::before {
    position: absolute;
    content: '';
    top: 0;
    left: -30px;
    width: 0;
    height: 100%;
    background: #212529;
    transition: .5s;
    transform: skew(35deg, 0deg) scale(1.7);
    z-index: -1;
    transition: 0.5s;
}

.project-content:hover:before {
    width: 100%;
}

.project-content span {
    font-size: 20px;
    color: #ffffff;
    font-weight: 500;
}

.project-content h4 a {
    font-size: 26px;
    line-height: 50px;
    color: #ffffff;
    font-weight: 600;
    text-decoration: none;
}

/* CHOOSE US AREA */

.choose-us-area.style-two {
    background: url(../images/resource/choose-us-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.section-main-title.choose h2 {
    color: #ffff;
}

.choose-discription.style-two p {
    color: #c9c9c9;
}

.insurance-list ul li {
    list-style: none;
    font-size: 24px;
    line-height: 24px;
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 30px;
    border-bottom: 1px solid #201b1c;
    padding: 0px 0 39px;
}

.insurance-list ul li.line-two {
    border: none !important;
}

.Lifesafe-btn.choose.style-two a {
    background: #0bbeb4;
}

.choose-text {
    position: absolute;
    bottom: 0;
    width: 345px;
    height: 235px;
    background-color: #0bbeb4;
    right: 0;
    padding: 40px 40px 0;
}

.choose-text h4 {
    font-size: 40px;
    line-height: 52px;
    color: #ffffff;
    font-weight: 600;
}

/* PRICING AREA */

.pricing-area {
    padding: 120px 0 120px;
}

.pricing-single-box {
    filter: drop-shadow(0px 1px 25.5px rgba(2, 91, 86, 0.09));
    background-color: #ffffff;
    padding: 35px 40px 30px;
}

.pricing-single-box::before,
.pricing-single-box::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
}

.pricing-single-box::before {
    left: 0px;
    bottom: 0px;
    border-bottom: 2px solid transparent;
    border-left: 2px solid transparent;
    transition: all 0.6s linear;
}

.pricing-single-box::after {
    right: 0px;
    top: 0px;
    border-top: 2px solid transparent;
    border-right: 2px solid transparent;
    transition: all 0.6s linear;
}

.pricing-single-box:hover::before,
.pricing-single-box:hover::after {
    border-color: #01bdb2;
    width: 100%;
    height: 100%;
}

.pricing-icon {
    float: left;
    margin-right: 32px;
    margin-top: 24px;
    margin-bottom: 29px;
}

.pricing-content {
    position: relative;
    margin-bottom: 56px;
}

.pricing-content::before {
    position: absolute;
    content: "";
    width: 416px;
    height: 2px;
    background-color: #0bbeb4;
    left: -40px;
    bottom: -20px;
}

.pricing-content h4 {
    font-size: 24px;
    line-height: 54px;
    color: #23222a;
    font-weight: 600;
}

.pricing-content h2 {
    font-size: 48px;
    line-height: 54px;
    color: #23222a;
    font-weight: 800;
}

.pricing-content h2 span {
    font-size: 24px;
    color: #23222a;
    font-weight: 400;
}

.pricing-content p {
    font-size: 16px;
    line-height: 54px;
    color: #23222a;
    font-weight: 400;
}

.pricing-list ul li {
    list-style: none;
    font-size: 18px;
    line-height: 28px;
    color: #525459;
    font-weight: 500;
    display: block;
    border-bottom: 1px solid #f2f2f2;
    padding: 0 20px 14px;
    position: relative;
    margin: 0 0px 12px;
}

.pricing-list ul li::before {
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    background-color: #01bdb2;
    left: 2px;
    top: 27%;
}

.pricing-list ul li::after {
    position: absolute;
    content: "";
    width: 12px;
    height: 12px;
    border: 1px solid #01bdb2;
    left: 0;
    top: 22%;
}

.Lifesafe-btn.pricing {
    margin-top: 27px;
}

.Lifesafe-btn.pricing a {
    background: #01bdb2;
    padding: 16px 50px;
}

/* GET IN TOUCH AREA */

.get-in-touch-area {
    background: url(../images/resource/get-ng.jpg);
    background-position: center ceneter;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 120px 0 120px;
}

.get-in-contact {
    filter: drop-shadow(0px 1px 25.5px rgba(2, 91, 86, 0.09));
    background-color: #ffffff;
    padding: 50px 60px 68px;
    margin-top: 55px;
}

.form-box.inner input {
    border-bottom: 1px solid #eaeaea;
}

.form-box.inner input::placeholder {
    font-size: 20px;
    line-height: 60px;
    color: #757575;
    font-weight: 400;
}

.form-box.inner textarea {
    height: 50px;
    border-bottom: 1px solid #eaeaea;
}

.form-box.inner textarea::placeholder {
    font-size: 20px;
    line-height: 60px;
    color: #757575;
    font-weight: 400;
}


/* BLOG AREA STYLE TWO */

.blog-area.style-two {
    padding: 120px 0 20px;
}

.blog-content.style-two {
    width: 587px;
    filter: drop-shadow(0 0 10px rgba(2, 108, 102, 0.09));
    background-color: #ffffff;
    border: none;
    padding: 30px 30px 40px;
    top: -100px;
}

h4.blog-two a {
    font-size: 32px;
    line-height: 44px;
    color: #23222a;
    font-weight: 700;
    text-decoration: none;
    transition: 0.5s;
}

.blog-single-box:hover h4.blog-two a {
    color: #ffffff;
}

p.blog-two-discription {
    font-size: 16px;
    line-height: 24px;
    color: #505050;
    font-weight: 400;
    margin: 24px 0 35px;
    transition: .5s;
}

.blog-single-box:hover p.blog-two-discription {
    color: #ffffff;
}


.blog-meta {
    border: 1px solid #eaeaea;
    padding: 12px 30px;
}

.blog-meta span {
    font-size: 20px;
    color: #525459;
    font-weight: 600;
    margin-right: 42px;
    position: relative;
    transition: 0.5s;
}

.blog-single-box:hover .blog-meta span {
    color: #ffffff;
}

.blog-meta span::before {
    position: absolute;
    content: "";
    width: 1px;
    height: 52px;
    background: #eaeaea;
    top: -14px;
    left: -31px;
}

.blog-meta span i {
    color: #01bdb2;
    font-size: 18px;
    margin-right: 3px;
    transition: 0.5s;
}

.blog-single-box:hover .blog-meta span i {
    color: #ffffff;
}


/* SOLUTION AREA */

.solution-area {
    background: #01bdb2;
    padding: 90px 0 90px;
}

.section-main-title.solution h2 {
    color: #ffff;
    margin-bottom: 0;
}

.Lifesafe-btn.solution {
    text-align: right;
    display: block;
}

.Lifesafe-btn.solution a {
    background: #ffff;
    color: #01bdb2;
    padding: 16px 42px;
}

.Lifesafe-btn.solution a:hover {
    color: #ffff;
}



/*==================================================
 <-- Lifesafe Home page Three All  Css-->
===================================================*/

/* TOPBAR AREA */

.topbar-area.style-three {
    background: #406aff;
}

/* HEADER AREA */

.header-area.style-three::before {
    background: url(../images/resource/header-shape3.png);
}

.header-area.style-three::after {
    display: none;
}

.header-menu.style-three ul li a {
    color: #406aff;
}

.Lifesafe-btn.style-three a {
    background: #406aff;
}

.header-sidebar.style-three a {
    color: #406aff;
}

.header-menu.style-three ul .sub-menu ul li a {
    color: #406aff;
}

.header-menu.style-three ul .sub-menu ul li a:hover {
    color: #ffffff;
}

.header-menu.style-three ul .sub-menu ul li a:hover::before {
    background: #406aff;
}

.header-menu.style-three ul .sub-menu ul li a:hover::after {
    background: #406aff;
}


/* SLIDER AREA */

.slide-item.style-three {
    height: 814px;
    top: 0;
}

.banner-carousel .slide-item.style-three .image-layer:before {
    background-color: #020f0c;
    opacity: 0.00;
}

svg {
    width: 100%;
    height: 814px;
    position: absolute;
    top: 0;
}

circle {
    stroke: #020f0c;
    fill: none;
    transition: 0.5s;
}

.steap {
    stroke-width: 0;
}

#svg2 circle {
    transition-timing-function: linear;
}

.circle1 {
    transition-delay: 0.05s;
}

.circle2 {
    transition-delay: 0.1s;
}

.circle3 {
    transition-delay: 0.15s;
}

.circle4 {
    transition-delay: 0.2s;
}

.circle5 {
    transition-delay: 0.25s;
}

.circle6 {
    transition-delay: 0.3s;
}

.circle7 {
    transition-delay: 0.35s;
}

.circle8 {
    transition-delay: 0.4s;
}

.circle9 {
    transition-delay: 0.45s;
}

.active .steap {
    animation: dash 0.5s linear;
}

@keyframes dash {
    0% {
        stroke-width: 0;
    }

    100% {
        stroke-width: 200px;
    }
}

.slider-content.style-three {
    text-align: center;
    left: 0;
    right: 0;
    margin: auto;
    width: 50%;
}

.slider-main-title.style-three h1 {
    color: #ffff;
    font-size: 82px;
    line-height: 92px;
}

.slider-discription.style-three p {
    color: #ffffff;
    left: 0;
    right: 0;
    margin: auto;
    padding: 22px 0 50px;
}

.video-icon.style-three a {
    background: #406aff;
    line-height: 54px;
}

.video-icon.style-three a i {
    font-size: 30px;
}

/* FEATURE AREA */

.section-sub-title.style-three h4 {
    color: #406aff;
}

.section-sub-title.style-three h4::before {
    background: #406aff;
}

.feature-discription p {
    font-size: 16px;
    line-height: 24px;
    color: #23222a;
    font-weight: 400;
}

.feature-single-box.style-three {
    padding: 45px 20px 28px;
}

.feature-single-box.style-three::before {
    background: #406aff;
}

.feature-icon2 {
    position: absolute;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: 0.5s;
}

.feature-single-box:hover .feature-icon2 {
    opacity: 1;
}

.feature-icon2 a {
    width: 66px;
    height: 53px;
    background-color: #406aff;
    display: inline-block;
    text-align: center;
    line-height: 53px;
    color: #ffff;
    font-size: 26px;
    transition: 0.5s;
}

.feature-single-box:hover .feature-icon2 a {
    background: #ffff;
    color: #406aff;
}


/* ABOUT AREA */

.about-area.style-three {
    background: url(../images/resource/get-ng.jpg);
    padding: 110px 0 120px;
}

.about-thumb.style-three {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.about-thumb1 {
    margin-right: 20px;
}

.about-thumb2 {
    margin-top: 46px;
}


/* SERVICE AREA*/

.service-single-item {
    margin: 0 0 0px 20px;
}

.service-items-thumb {
    position: relative;
    overflow: hidden;
}

.service-items-thumb::before {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    content: '';
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    z-index: 1;
}

.service-single-item:hover .service-items-thumb::before {
    -webkit-animation: circle .75s;
    animation: circle .75s;
    opacity: 1;
}

.service-items-thumb img {
    width: 100%;
    position: relative;
    display: block;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.7s ease 0s;
    transition: all 0.7s ease 0s;
}

.service-single-item:hover .service-items-thumb img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}


.service-items-content {
    position: absolute;
    bottom: 0;
    width: 60px;
    height: 100%;
    background-color: #f3f3f3;
    right: 0;
    z-index: 1;
}

.service-items-content::before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    height: 0;
    background: #406aff;
    z-index: -1;
    transition: 0.5s;
}

.service-single-item:hover .service-items-content::before {
    height: 100%;
}

.service-items-icon {
    position: absolute;
    top: 40px;
    left: 0;
    right: 0;
    text-align: center;
}

.service-items-icon a i {
    color: #406aff;
    font-size: 20px;
    transition: 0.5s;
}

.service-single-item:hover .service-items-icon a i {
    color: #ffffff;
}

.service-items-btn {
    position: absolute;
    bottom: 40px;
    right: 0;
    left: 0;
    text-align: center;
    transform: rotate(180deg);
}

.service-items-btn a {
    writing-mode: vertical-lr;
    text-decoration: none;
    font-size: 20px;
    line-height: 24px;
    color: #406aff;
    font-weight: 500;
    transition: 0.5s;
}

.service-single-item:hover .service-items-btn a {
    color: #ffffff;
}

/* owl nav css */

.service-area .owl-nav {
    position: absolute;
    top: -30%;
    right: 10%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.service-area .owl-next i {
    width: 55px;
    height: 50px;
    border-radius: 3px;
    border: 1px solid #e8e8e8;
    color: #406aff;
    display: inline-block;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    margin-left: 20px;
    transition: 0.5s;
    position: relative;
}

.service-area .owl-next:hover i {
    color: #ffffff;
}

.service-area .owl-next i::after {
    position: absolute;
    top: 0;
    right: 0;
    width: 0px;
    height: 100%;
    content: "";
    bottom: 0;
    background: #406aff;
    z-index: -1;
    transition: .5s;
    margin: auto;
}

.service-area .owl-next i:hover::after {
    width: 100%;
    left: 0;
}

.service-area .owl-prev i {
    width: 55px;
    height: 50px;
    border-radius: 3px;
    border: 1px solid #e8e8e8;
    color: #406aff;
    display: inline-block;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    transition: 0.5s;
    position: relative;
}

.service-area .owl-prev:hover i {
    color: #ffffff;
}

.service-area .owl-prev i::after {
    position: absolute;
    top: 0;
    right: 0;
    width: 0px;
    height: 100%;
    content: "";
    bottom: 0;
    background: #406aff;
    z-index: -1;
    transition: .5s;
    margin: auto;
}

.service-area .owl-prev i:hover::after {
    width: 100%;
    left: 0;
}


/* CHOOSE US AREA */

.choose-us-area.style-three {
    background: url(../images/resource/choose-bg.png);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 120px 0 50px;
    position: relative;
}

.choose-us-area.style-three::before {
    position: absolute;
    content: "";
    width: 40%;
    height: 100%;
    background: url(../images/resource/choose-bg2.png);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    top: 0;
    right: 0;
}

.section-sub-title.style-three.inner h4 {
    color: #ffffff;
}

.section-sub-title.style-three.inner h4::before {
    background: #ffffff;
}

.section-main-title.style-three.inner h2 {
    color: #ffffff;
    font-weight: 700;
}

.choose-discription.style-three p {
    color: #f7f7f7;
}

.row.choose.style-three {
    border-top: 1px solid #ebebeb;
    border-bottom: inherit;
    padding: 40px 0 0;
}

.choose-list.style-three span {
    color: #ffffff;
}

.choose-list.style-three span i {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: #ffffff;
    display: inline-block;
    text-align: center;
    line-height: 32px;
    font-size: 18px;
    color: #406aff;
    font-weight: 800;
    margin-right: 10px;
}

/* PROJECT AREA */

.project-area.style-three {
    padding: 120px 0 90px;
}

.project-discription {
    margin-left: 140px;
    position: relative;
}

.project-discription::before {
    position: absolute;
    content: "";
    width: 4px;
    height: 80px;
    background-color: #406aff;
    top: 50%;
    left: -24px;
    transform: translate(50%, -50%);
}

.project-discription p {
    font-size: 16px;
    line-height: 30px;
    color: #505050;
    font-weight: 400;
}

.project-itmes-thumb {
    position: relative;
    overflow: hidden;
}

.project-itmes-thumb::before {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    content: '';
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    z-index: 1;
}

.project-items-box:hover .project-itmes-thumb::before {
    -webkit-animation: circle .75s;
    animation: circle .75s;
    opacity: 1;
}

.project-itmes-thumb img {
    width: 100%;
    position: relative;
    display: block;
    overflow: hidden;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 2s ease;
    transition: all 2s ease;
}

.project-items-box:hover .project-itmes-thumb img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}


.project-btn {
    position: absolute;
    left: 23%;
    right: 50%;
    top: 50%;
    transform: translate(50%, -50%);
    text-align: center;
}

.project-btn a {
    width: 114px;
    height: 114px;
    border-radius: 57px;
    background-color: #406aff;
    display: inline-block;
    line-height: 114px;
    font-size: 18px;
    text-decoration: underline;
    color: #ffffff;
    font-weight: 600;
    transform: scale(0);
    transition: 0.5s;
}

.project-items-box:hover .project-btn a {
    transform: scale(1.1);

}

.project-itmes-content {
    margin: 35px 0 0;
}

.project-itmes-content h4 a {
    font-size: 24px;
    line-height: 30px;
    color: #23222a;
    font-weight: 700;
    text-decoration: none;
    position: relative;
    background: linear-gradient(to right, currentcolor 0%, currentcolor 100%) 0px 95%/0px 2px no-repeat;
    transition: all 2s ease;
}

.project-items-box:hover .project-itmes-content h4 a {
    color: #406aff;
    background-size: 100% 2px;
}

.project-itmes-content p {
    font-size: 16px;
    line-height: 42px;
    color: #406aff;
    font-weight: 500;
}


/* CALL DO ACTION AREA */

.call-do-action-area {
    background: url(../images/resource/call-do-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    height: 602px;
    background-position: center center;
    background-attachment: fixed;
}

.video-icon.style-three.inner a {
    height: 108px;
    width: 108px;
    background: #406aff;
    text-align: center;
    display: inline-block;
    line-height: 110px;
    border-radius: 100%;
    -webkit-animation: ripple-white 1s linear infinite;
    animation: ripple-blue 1s linear infinite;
    -webkit-transition: .5s;
}

.video-icon a i {
    color: #ffffff;
    font-size: 36px;
}

.call-do-title {
    margin: 40px 0 0;
}

.call-do-title h2 {
    text-align: center;
    font-size: 48px;
    line-height: 60px;
    color: #ffffff;
    font-weight: 700;
}


/* FAQ AREA */

.faq-items-box {
    filter: drop-shadow(0px 1px 20px rgba(0, 61, 77, 0.11));
    background-color: #ffffff;
    padding: 30px 30px 30px;
}


/* BLOG AREA */

.blog-content.style-three {
    border: 1px solid #406aff;
}

.blog-content.style-three::before {
    background: #406aff;
}

.blog-month.style-three {
    background: #406aff;
}

.blog-month.style-three::before {
    background: #ffffff;
}

.blog-single-box:hover .blog-month.style-three h4 {
    color: #406aff;
}

.blog-single-box:hover .blog-month.style-three span {
    color: #406aff;
}

.blog-text.style-three h4 a {
    color: #406aff;
}

/* FOOTER AREA */

.footer-area.style-three {
    background: #1d2c60;
}

.footer-wiget.inner.style-three::before {
    background: #406aff;
}

.footer-social.style-three ul li a i {
    border: 1px solid #ffff;
}

.footer-social.style-three ul li a:hover i {
    color: #406aff;
}

.footer-wiget-title.style-three h4::before {
    background: #406aff;
}

.footer-wiget-menu.style-three ul li a:hover {
    color: #406aff;
}

.company-work-hour.style-three ul li {
    border-bottom: 1px solid #406aff;
}

.company-work-hour.style-three ul li.table-brb span.style {
    background: #406aff;
}

/*===============================================================
<-- All Inner Page Css-->
=================================================================*/
/* breatcome area css */


.breatcome-area {
    background: url(../images/about/bn.jpg) no-repeat center center;
    background-size: cover;
    background-attachment: fixed; /* Creates a parallax effect */
    padding: 154px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white; /* Ensures text remains readable */
    min-height: 300px; /* Adjust based on your needs */
    width: 100%;
    position: relative;
}

.breatcome-area::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); /* Adds a dark overlay for better contrast */
    z-index: 1;
}

.breatcome-area * {
    position: relative;
    z-index: 2;
}


.breatcome-content {
    position: relative;
}

.breatcome-discription p {
    text-align: center;
    font-size: 28px;
    line-height: 27px;
    color: #ffffff;
    font-weight: 400;
}

.breatcome-title h1 {
    color: #fff;
    font-size: 60px;
    font-weight: 700;
    margin-bottom: 19px;
    text-align: center;
}

.bratcome-text {
    position: absolute;
    left: 0;
    bottom: -173px;
    background: #0D3E83;
    padding: 23px 35px;
    border-radius: 5px 5px 0 0;
}

.bratcome-text ul {
    list-style: none;
}

.bratcome-text ul li {
    display: inline-block;
    margin-right: 12px;
    font-size: 22px;
    color: #ffffff;
    font-weight: 500;
    line-height: 27px;
    font-weight: 500;
}

.bratcome-text ul li a {
    display: inline-block;
    font-size: 22px;
    line-height: 27px;
    color: #ffffff;
    font-weight: 500;
    text-decoration: none;
    position: relative;
    transition: .5s;
}

.bratcome-text ul li a:hover {
    color: #0D3E83;
}

.bratcome-text ul li a::before {
    position: absolute;
    content: "/";
    left: 62px;
}

/*==================================================
 <-- About Inner Page Css-->
===================================================*/

/* about area */

.about-area.inner-page {
    padding: 146px 0 123px;
}

/*==================================================
 <-- Service Inner Page Css-->
===================================================*/

/* feature area */

.feature-area.inner-page {
    padding: 120px 0 120px;
}


/*==================================================
 <--  Team Area Inner Page Css-->
===================================================*/

.team-area {
    padding: 120px 0 200px;
}

.team-single-box {
    background: #f1f1f1;
    padding: 0 15px 28px;
    position: relative;
    top: 75px;
}

.team-thumb {
    position: relative;
    top: -68px;
    margin-bottom: -55px;
}

.team-social-icon {
    position: absolute;
    top: 30px;
    right: 30px;
}

.team-social-icon ul {
    list-style: none;
    background: #f3efec;
    padding: 7px 8px 9px;
}

.team-social-icon ul li {
    margin-top: 2px;
}

.team-social-icon ul li a {
    width: 40px;
    height: 40px;
    background-color: #ffffff;
    display: block;
    text-align: center;
    font-size: 20px;
    line-height: 45px;
    color: #003a37;
    position: relative;
    transition: 0.5s;
    z-index: 1;
}

.team-social-icon ul li a:hover {
    color: #ffff;
}

.team-social-icon ul li a::before {
    position: absolute;
    content: "";
    height: 0;
    width: 100%;
    background: #003a37;
    right: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: -1;
    transition: 0.5s;
}

.team-social-icon ul li a:hover::before {
    height: 100%;
    top: 0;
}

.team-content h4 a {
    font-size: 28px;
    line-height: 63px;
    color: #003a37;
    font-weight: 700;
    text-decoration: none;
}

.team-content p {
    font-size: 16px;
    color: #3c3531;
    font-weight: 400;
}

/*==================================================
 <-- Team Details Inner Page Css-->
===================================================*/

.team-details-area {
    padding: 122px 0 0;
}

.team-author-thumb img {
    width: 100%;
}

/* progress bar  */

.team-details-area .process-ber-plugin {
    margin: 50px 60px 0;
}

.team-details-area .barfiller {
    margin-bottom: 40px;
}


/* progress bar */


.barfiller {
    width: 368px;
    height: 8px;
    position: relative;
    margin-bottom: 16px;
    margin-top: 21px;
    background-color: #f2f2f2;
}

.barfiller .fill {
    display: block;
    position: relative;
    width: 0px;
    height: 100%;
    z-index: 1;
}

.barfiller .tip {
    font-size: 18px;
    color: #252638;
    font-weight: 500;
    top: -42px;
    padding: 1px 6px;
    left: 0px;
    position: absolute;
}

.stat-bar:nth-of-type(1) .stat-bar-rating {
    animation-delay: 0.25s;
    -webkit-animation-delay: 0.25s;
}

span.fill {
    background: #0D3E83 !important;
    border-radius: 0px 15px 15px 0px;
}


/* author info */

.row.author-info {
    background: #f8f6f1;
    padding: 35px 40px 25px;
    margin-top: -200px;
}

.team-author-exprience ul li {
    list-style: none;
    margin-bottom: 17px;
}

.team-author-exprience ul li span {
    font-size: 20px;
    color: #888888;
    font-weight: 400;
    line-height: 45px;
}

.team-author-exprience ul li h4 {
    font-size: 24px;
    color: #3c3531;
    font-weight: 600;
}

.team-author-socila {
    text-align: center;
    margin-right: -76px;
    margin-top: 24px;
}

.team-author-socila ul li {
    list-style: none;
    margin: 17px 0px 0;
}

.team-author-socila ul li a {
    display: inline-block;
    height: 40px;
    width: 40px;
    background: #ffffff;
    line-height: 44px;
    text-align: center;
    border-radius: 50%;
    position: relative;
    z-index: 1;
}

.team-author-socila ul li a::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0D3E83;
    border-radius: 50%;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
}

.team-author-socila ul li a:hover::before {
    transform: scale(1);
}

.team-author-socila ul li a {
    transition: .5s;
}

.team-author-socila ul li a:hover i {
    color: #ffffff;
}

/*==================================================
 <--  Blog Area Inner Page Css-->
===================================================*/

.blog-area.inner-page {
    padding: 120px 0 120px;
}


/*==================================================
 <-- Service Details Inner Page Css-->
===================================================*/
.service-details-area {
    padding: 120px 0 72px;
}

/* widget catagories box */

.widget-categories-box {
    margin-bottom: 30px;
}

.widget-categories-menu ul li {
    list-style: none;
    padding: 15px;
    position: relative;
    margin-bottom: 17px;
    background: #f8f6f1;
    position: relative;
    z-index: 1;
    transition: .5s;
}

.widget-categories-menu ul li::after {
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 0%;
    height: 100%;
    left: 0;
    right: 0;
    margin: auto;
    transition: all 0.5s linear 0s;
    background-color: #0D3E83;
    content: "";
    z-index: -1;
}

.widget-categories-menu ul li:hover::after {
    width: 100%;
}

.widget-categories-menu ul li a {
    display: block;
    overflow: hidden;
    text-decoration: none;
    font-size: 22px;
    line-height: 27px;
    color: #003d4d;
    font-weight: 500;
    transition: .5s;
}

.widget-categories-menu ul li:hover a {
    color: #fff;
}

.widget-categories-menu ul li a span {
    float: right;
}

/* widget contact box */

.widget-contact-box {
    background: #0D3E83;
    text-align: center;
    padding: 63px 30px 57px;
    margin-bottom: 40px;
}

.widget-contact-title h4 {
    font-size: 36px;
    line-height: 48px;
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 27px;
}

.widget-contact-icon {
    width: 81px;
    height: 81px;
    display: inline-block;
    background: #fff;
    line-height: 75px;
    text-align: center;
    border-radius: 50%;
    margin-bottom: 34px;
}

.widget-contact-content h6 {
    font-size: 16px;
    line-height: 48px;
    color: #ededed;
    font-weight: 400;
}

.widget-contact-content h4 {
    font-size: 30px;
    line-height: 48px;
    color: #ededed;
    font-weight: 600;
}

/* widget pdf btn */

.widget-download-btn a {
    font-size: 24px;
    color: #ffffff;
    font-weight: 600;
    background: #0D3E83;
    text-decoration: none;
    padding: 22px 76px;
    transition: .5s;
}

.widget-download-btn a:hover {
    background: #003d4d;
}

.widget-download-btn a i {
    font-size: 38px;
    position: relative;
    top: 4px;
}

/* service details right bar */

.service-details-thumb {
    overflow: hidden;
    margin-bottom: 33px;
}

.service-details-thumb img {
    width: 100%;
    transition: all 2s ease;
}

.service-details-thumb img:hover {
    transform: scale(1.15);
}

.service-details-title h4 {
    font-size: 40px;
    color: #3c3531;
    font-weight: 600;
    margin-bottom: 12px;
}

.service-detials-discription {
    margin-bottom: 32px;
}

.service-detials-discription p {
    font-size: 16px;
    line-height: 24px;
    color: #3c3531;
    font-weight: 400;
}

.service-list-title h4 {
    font-size: 24px;
    color: #3c3531;
    font-weight: 600;
    margin-bottom: 12px;
    border-bottom: 1px solid #d5d5d5;
    padding: 0px 0 19px;
}

.service-detials-list span {
    font-size: 16px;
    line-height: 32px;
    color: #3c3531;
    font-weight: 500;
    padding: 0 28px 0;
    display: block;
    position: relative;
}

.service-detials-list span::before {
    position: absolute;
    content: "";
    width: 14px;
    height: 14px;
    background-color: #0D3E83;
    left: 0;
    top: 9px;
}


/*==================================================
 <-- Project Grid Inner Page Css-->
===================================================*/
.project-grid-area {
    padding: 120px 0 94px;
}

.project-grid-thumb {
    position: relative;
    overflow: hidden;
    margin-bottom: 29px;
}

.project-grid-thumb img {
    transition: all 2s ease;
}

.project-grid-thumb img:hover {
    transform: scale(1.15);
}

.project-grid-content {
    position: absolute;
    bottom: -100px;
    width: 554px;
    height: 128px;
    background-color: #ebebeb;
    padding: 20px 28px 0;
    left: 16px;
    border-radius: 0px 30px 0px 0px;
    opacity: 0;
    transition: .5s;
}

.project-grid-thumb:hover .project-grid-content {
    bottom: 10px;
    opacity: 1;
}

.project-grid-content h4 a {
    font-size: 26px;
    line-height: 52px;
    color: #3c3531;
    font-weight: 600;
    text-decoration: none;
    transition: .5s;
}

.project-grid-content h4 a:hover {
    color: #0D3E83;
}

.project-grid-content p {
    font-size: 18px;
    font-weight: 400;
}

.project-grid-icon {
    position: absolute;
    top: -50px;
    right: 20px;
    opacity: 0;
    transition: all 2s ease;
}

.project-grid-thumb:hover .project-grid-icon {
    top: 20px;
    opacity: 1;
}

.project-grid-icon a {
    color: #fff;
    font-size: 32px;
    width: 90px;
    height: 90px;
    background-color: #0D3E83;
    line-height: 90px;
    text-align: center;
    border-radius: 30px 0px 0px 0px;
    transition: .5s;
    display: inline-block;
}

.project-grid-icon a:hover {
    background: #fff;
    color: #0D3E83;
}

/*==================================================
 <-- Project Details Inner Page Css-->
===================================================*/

.project-detials-area {
    padding: 120px 0 100px;
}

.project-details-thumb {
    margin-bottom: 55px;
    overflow: hidden;
}

.project-details-thumb img {
    width: 100%;
    transition: all 2s ease;
}

.project-details-thumb img:hover {
    transform: scale(1.15);
}

.project-details-title h4 {
    font-size: 30px;
    color: #3c3531;
    font-weight: 600;
}

.porject-detials-discription {
    margin: 25px 0 57px;
}

.porject-detials-discription p {
    font-size: 16px;
    line-height: 24px;
    color: #434141;
    font-weight: 400;
}

.porject-detials-discription.inner {
    margin: -14px 0 0;
}

/*===============================================================
<-- Blog Details Inner page Css-->
=================================================================*/

.blog-details-area {
    padding: 122px 0 120px;
}

.blog-details-thumb img {
    width: 100%;
}

.blog-details-meta {
    margin: 29px 0 26px;
}

.blog-details-meta span {
    opacity: 0.902;
    font-size: 16px;
    line-height: 34px;
    color: #4d4e4f;
    font-weight: 400;
    margin-right: 27px;
}

.blog-details-meta span i {
    font-size: 22px;
    position: relative;
    top: 4px;
    margin-right: 12px;
}

.blog-details-content {
    margin-bottom: 42px;
}

.blog-details-content h4 {
    font-size: 40px;
    line-height: 28px;
    color: #3c3531;
    font-weight: 600;
    margin-bottom: 35px;
}

.blog-details-content p {
    font-size: 16px;
    line-height: 28px;
    color: #3c3531;
    font-weight: 400;
}

.blog-details-tag h6 {
    font-size: 24px;
    color: #3c3531;
    font-weight: 500;
    display: inline-block;
    margin-right: 60px;
}

.blog-details-tag {
    border: 1px solid #0D3E83;
    padding: 24px 38px;
    margin-bottom: 55px;
}

.blog-details-tag h6 {
    font-size: 24px;
    color: #3c3531;
    font-weight: 500;
    display: inline-block;
    margin-right: 32px;
}

.blog-details-tag a {
    font-size: 16px;
    color: #0D3E83;
    font-weight: 500;
    text-decoration: none;
    display: inline-block;
    margin-right: 10px;
    border: 1px solid #eceae5;
    padding: 4px 22px;
    position: relative;
    z-index: 1;
    transition: .5s;
}

.blog-details-tag a:hover {
    color: #FFf;
}

.blog-details-tag a:before {
    position: absolute;
    content: "";
    left: -2px;
    top: 0px;
    height: 102%;
    width: 0%;
    right: 0;
    margin: auto;
    background: #0D3E83;
    z-index: -1;
    border-radius: 3px;
    transition: .5s;
}

.blog-details-tag a:hover::before {
    width: 100%;
}

.blog-team-thumb {
    float: left;
    margin-right: 30px;
}

.blog-team-content h4 a {
    font-size: 24px;
    color: #3c3531;
    font-weight: 600;
    text-decoration: none;
}

.blog-team-content p {
    font-size: 20px;
    line-height: 30px;
    color: #3c3531;
    font-weight: 400;
    margin: 15px 0 9px;
}

.ba-blog-details-social-icons.two h6 {
    font-size: 18px;
    color: #3c3531;
    font-weight: 400;
    display: inline-block;
    margin-right: 14px;
}

.ba-blog-details-social-icons.two a {
    font-size: 16px;
    margin-right: 10px;
}

.blog-team-thumb {
    float: left;
    margin-right: 30px;
    margin-top: -12px;
}

.row.blog-item {
    padding: 20px 68px 20px;
    border-top: 1px solid #0D3E83;
    border-bottom: 1px solid #0D3E83;
}

.blog-item-content h4 {
    font-size: 20px;
    color: #0D3E83;
    font-weight: 500;
}

.blog-details-item.two {
    margin-left: 90px;
}

.blog-details-area .owl-nav {
    display: none;
}

/* blog details comment */

.blog-details-comment {
    margin-top: 36px;
}

.blog-details-comment h5 {
    font-size: 30px;
    line-height: 28px;
    color: #292930;
    font-weight: 500;
    position: relative;
    margin-bottom: 36px;
}

.blog-details-comment h5::after {
    position: absolute;
    bottom: -10px;
    width: 70px;
    height: 3px;
    background: #0D3E83;
    content: "";
    left: 0;
}

.blog-comment-list ul li {
    list-style: none;
    margin-bottom: 0;
}

.blog-comment-box {
    position: relative;
}

.blog-comment-box::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background: #E4E4E4;
    bottom: -30px;
}

.blog-comment-box.inner {
    margin-left: 50px;
}

.blog-comment-box.inner::before {
    display: none;
}

.blog-comment-thumb {
    float: left;
    margin-right: 24px;
    margin-top: 12px;
}

.blog-comment-thumb img {
    border-radius: 4px;
}

.blog-comment-list .title {
    margin-bottom: 5px;
    margin-left: -12px;
}

.blog-comment-list h6.title {
    color: #18191D;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
}

.blog-comment-list span.date {
    margin-left: -13px;
}

.content-main p {
    color: #747474;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin: 10px 0 0;
}

.text-sm-end a {
    display: inline-block;
    text-decoration: none;
    padding: 7px 13px;
    background: #EFEFEF;
    border-radius: 3px;
    color: #102039;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    position: relative;
    transition: .5s;
    z-index: 1;
}

.text-sm-end a:hover {
    color: #fff;
}

.text-sm-end a::before {
    position: absolute;
    content: "";
    left: -2px;
    top: 0px;
    height: 102%;
    width: 0%;
    right: 0;
    margin: auto;
    background: #0D3E83;
    z-index: -1;
    border-radius: 3px;
    transition: .5s;
}

.text-sm-end a:hover::before {
    width: 100%;
}

/* blog contact box */

.blog-contact-box {
    background: #eff5f4;
    padding: 20px 30px 20px;
}

.blog-contact-title h4 {
    color: #18191D;
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 54px;
    position: relative;
}

.blog-contact-title h4::before {
    position: absolute;
    bottom: -10px;
    width: 70px;
    height: 3px;
    background: #0D3E83;
    content: "";
    left: 0;
}

/* contact form */

.form-box input {
    width: 100%;
    height: 64px;
    background: #ffffff;
    border: none;
    border-radius: 10px;
    padding: 0 17px;
    margin-bottom: 25px;
}

.form-box input::placeholder {
    color: #525459;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    border-radius: 10px !important;
}

.form-box textarea {
    width: 100%;
    height: 145px;
    background: #ffff;
    border: none;
    border-radius: 3px;
    padding: 5px 17px;
    margin-bottom: 25px;
}

.form-box textarea::placeholder {
    color: #525459;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
}

.form-box-button button {
    width: 210px;
    height: 60px;
    border-radius: 3px;
    background-color: #0D3E83;
    border: 0;
    outline: 0;
    font-size: 19px;
    font-weight: 500;
    color: #fff;
    position: relative;
    z-index: 1;
    transition: .5s;
    border-radius: 10px;
}

.form-box-button button::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    bottom: 0;
    transform: scale(0.0, 1);
    opacity: 0;
    border-radius: 3px;
    z-index: -1;
    transition: .5s;
}

.form-box-button button:hover::before {
    background: #18191D;
    opacity: 1;
    transform: scale(1, 1);
}

.form-box-button.inner {
    text-align: center;
}

/* widget search box */

.widget_search.box {
    margin-bottom: 30px;
}

.widget_search form {
    position: relative;
}

.widget_search input {
    border-radius: 4px;
    padding-left: 20px;
    height: 60px;
    width: 100%;
    position: relative;
    color: #606060;
    font-weight: 400;
    background: #f8f6f1;
    border: none;
    outline: 0;
}

.widget_search input::placeholder {
    font-size: 16px;
    line-height: 28px;
    color: #868686;
    font-weight: 400;
}

button.icons {
    border: 0;
    font-size: 18px;
    color: #fff;
    padding: 1px 15px;
    position: absolute;
    right: 0;
    top: 0;
    height: 60px;
    width: 60px;
    background: #0D3E83;
    border-radius: 0 3px 3px 0;
}

/* widget recent box */

.widget-recent-box {
    background: #f8f6f1;
    padding: 50px 35px 55px;
    margin-bottom: 30px;
}

.widget-recent-title h4 {
    font-size: 30px;
    color: #0D3E83;
    font-weight: 600;
    margin-bottom: 40px;
    border-bottom: 1px solid #ece6e6;
    padding: 0 0 14px;
}

.sidber-widget-recent-post {
    background: #ffffff;
    border-radius: 5px;
    padding: 16px 20px;
}

.recent-widget-thumb {
    float: left;
    margin-right: 20px;
    margin-top: 0px;
    overflow: hidden;
}

.recent-widget-thumb img {
    transition: all 2s ease;
}

.sidber-widget-recent-post:hover .recent-widget-thumb img {
    transform: scale(1.15);
}

.recent-widget-meta span {
    font-size: 14px;
    color: #4d4e4f;
    font-weight: 400;
}

.recent-widget-meta span i {
    color: #0D3E83;
    font-size: 12px;
    margin-right: 8px;
}

.recent-widget-title h4 a {
    font-size: 20px;
    color: #3c3531;
    font-weight: 600;
    text-decoration: none;
    transition: .5s;
}

.sidber-widget-recent-post:hover .recent-widget-title h4 a {
    color: #0D3E83;
}

/* widget recent menu */
.widget-recent-menu ul li {
    list-style: none;
    margin-bottom: 26px;
    position: relative;
    z-index: 1;
    transition: .5s;
    border-bottom: 1px solid #dddddd;
    padding: 0px 0 10px;
}

.widget-recent-menu ul li::before {
    position: absolute;
    right: 0;
    bottom: -1px;
    width: 0;
    height: 1px;
    transition: all 0.5s linear 0s;
    background-color: #0D3E83;
    content: "";
    z-index: -1;
}

.widget-recent-menu ul li:hover::before {
    width: 100%;
    right: auto;
    left: 0;
}

.widget-recent-menu ul li a {
    display: block;
    overflow: hidden;
    font-size: 16px;
    color: #4d4e4f;
    font-weight: 400;
    text-decoration: none;
    transition: .5s;
}

.widget-recent-menu ul li a:hover {
    color: #0D3E83;
}

.widget-recent-menu ul li a span {
    float: right;
}

/* widget tags */

.widget-tags a {
    display: inline-block;
    text-decoration: none;
    padding: 7px 13px;
    background: #fff;
    border-radius: 3px;
    font-size: 17px;
    color: #4d4e4f;
    font-style: normal;
    margin: 11px 5px;
    font-weight: 400;
    position: relative;
    transition: .5s;
    z-index: 1;
}

.widget-tags a:hover {
    color: #fff;
}

.widget-tags a:before {
    position: absolute;
    content: "";
    left: -2px;
    top: 0px;
    height: 102%;
    width: 0%;
    right: 0;
    margin: auto;
    background: #0D3E83;
    z-index: -1;
    border-radius: 3px;
    transition: .5s;
}

.widget-tags a:hover:before {
    width: 104%;
}

/*===============================================================
<-- Contact Area Css-->
=================================================================*/
.contact-area {
    padding: 120px 0 110px;
}

.row.contact {
    filter: drop-shadow(0px 1px 25.5px rgba(0, 0, 0, 0.15));
    background-color: #eff5f4;
    padding: 110px 35px 70px;
}

.contact-single-box {
    background: #0D3E83;
    padding: 60px 18px 30px;
    border-radius: 10px;
}

.contact-title h4 {
    font-size: 36px;
    line-height: 60px;
    color: #ffffff;
    font-weight: 600;
    border-bottom: 1px solid #0D3E83;
    padding: 0 0 7px;
    margin-bottom: 30px;
}

.contact-items {
    margin-bottom: 30px;
    background: #fff;
    padding: 26px 15px;
    border-radius: 10px;
}

.contact-icon {
    float: left;
    margin-right: 20px;
    width: 55px;
    height: 59px;
    background-color: #43655a;
    display: inline-block;
    text-align: center;
    line-height: 59px;
    align-content: center;
    border-radius: 10px;
}

.contact-icon i {
    color: #fff;
    font-size: 26px;
}

.contact-content h4 {
    font-size: 24px;
    color: #0D3E83;
    font-weight: 500;
}

.contact-content h6 {
    font-size: 15px;
    line-height: 34px;
    color: #757575;
    font-weight: 400;
}

/* contact box title */

.contact-box-title h4 {
    font-size: 48px;
    line-height: 60px;
    color: #0D3E83;
    font-weight: 600;
    margin-bottom: 35px;
}

/*===============================================================
<-- Faq Area Css-->
=================================================================*/

.faq-area {
    padding: 120px 0 100px;
}


/* accrodion css */

.accordion li {
    list-style: none;
    position: relative;
    z-index: 1;
    margin-bottom: -7px;
    border-radius: 3px;
}

.accordion li a {
    display: block;
    cursor: pointer;
    padding: 12px 16px 12px;
    text-decoration: none;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f4f4f9;
}

.accordion li a span {
    font-size: 18px;
    color: #23222a;
    font-weight: 600;
}

.accordion li a i {
    width: 36px;
    height: 36px;
    background: #406aff;
    display: inline-block;
    text-align: center;
    line-height: 38px;
    color: #fff;
}

.accordion li a.inner i {
    background: #0D3E83;
}

.accordion a.active {
    background: #f4f4f9;
    border: none;
}

.accordion a.active i {
    color: #fff;
    background: #406aff;
    border: none;
    margin-bottom: 0;
    transform: rotate(90deg);
}

.accordion li p {
    display: none;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: #434141;
    background: #f4f4f9;
    padding: 11px 32px 28px;
    width: 100%;
    margin: 0;
    position: relative;
    top: -24px;
}

.accordion a.active:before {
    display: none;
}

a.active {
    color: #1c1632;
}

ul.accordion ul li a span {
    color: #fff;
}

/*===============================================================
<-- Error Area Css-->
=================================================================*/

.error-area {
    padding: 120px 0 110px;
}

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

.Lifesafe-btn.error {
    margin-left: 160px;
}

/*===============================================================
<-- Lifesafe Sidebar Css-->
=================================================================*/

.sidebar-textwidget .contact-info ul {
    padding: 0;
}

.sidebar-group .widget-heading {
    position: absolute;
    top: 55px;
    right: 32px;
}

.sidebar-group .sidebar-widget {
    position: fixed;
    right: -100%;
    top: 0;
    bottom: 0;
    width: 100%;
    max-width: 480px;
    z-index: 999999;
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background-color: #171717;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.sidebar-group.isActive .sidebar-widget {
    opacity: 1;
    visibility: visible;
    right: 0;
}

.sidebar-textwidget {
    padding: 40px 32px;
}

.close-side-widget i {
    color: #fff;
    font-size: 30px;
    display: block;
}

.sidebar-widget-container {
    position: relative;
    top: 150px;
    opacity: 0;
    visibility: hidden;
    /*-webkit-transition: all 0.3s ease-in 0.3s;
    -o-transition: all 0.3s ease-in 0.3s;
    transition: all 0.3s ease-in 0.3s;*/
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.sidebar-group.isActive .sidebar-widget-container {
    top: 0px;
    opacity: 1;
    visibility: visible;
    /*-webkit-transition: all 1s ease-out 1.2s;
    -o-transition: all 1s ease-out 1.2s;
    transition: all 1s ease-out 1.2s;*/
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.sidebar-logo {
    margin: 0 0 50px;
}

.sidebar-textwidget .sidebar-logo a img {
    width: 50%;
}

.sidebar-group .about-box h2 {
    color: #fff;
    font-size: 26px;
    font-weight: 600;
}

.sidebar-group .about-box p {
    display: inline-block;
    color: #fff;
    padding: 15px 0 0;
}

.sidebar-group .contact-info {
    margin-top: 60px;
}

.sidebar-group .contact-info h2 {
    color: #fff;
    font-size: 26px;
    margin-bottom: 15px;
    font-weight: 600;
}

.sidebar-group ul.list-style-one li {
    display: block;
    list-style: none;
    color: #fff;
    margin-top: 8px;
    overflow: hidden;
}

.sidebar-group ul.list-style-one li i {
    font-size: 20px;
    font-weight: 600;
    color: #0D3E83;
    margin: 0 10px 0 0px;
}

.sidebar-group ul.social-box {
    margin: 58px 0 0;
    padding: 0;
}

.sidebar-group ul.social-box li {
    display: inline-block;
    list-style: none;
    margin: 0 6px 0 0;
}

.sidebar-group ul.social-box li a {
    display: inline-block;
    width: 35px;
    height: 35px;
    line-height: 36px;
    text-align: center;
    background: #fff;
    color: var(--primary-color);
    text-decoration: none;
    transition: .5s;
    font-size: 18px;
    border-radius: 3px;
}

.sidebar-group ul.social-box li a:hover {
    background: var(--primary-color);
    color: #0D3E83;
}


/* sidebar menu */

.sidebar-menu {
    position: absolute;
    right: 27px;
    top: 23px;
    display: none;
}

.sidebar-menu a {
    width: 52px;
    height: 52px;
    line-height: 52px;
    display: inline-block;
    text-align: center;
    color: #fff;
    font-size: 26px;
}

.sidebar-widget-menu {
    position: relative;
}

.sidebar-widget-menu ul li {
    list-style: none;
    margin-top: 10px;
    padding: 0 0 14px;
}

.sidebar-widget-menu ul li .home-menu-title h4 {
    text-align: center;
    margin-top: 10px;
}

.sidebar-widget-menu ul li .home-menu-title h4 a {
    font-size: 20px;
    padding: 0px 0;
    font-weight: 500;
    color: #171717;
}

.sidebar-widget-menu ul li .home-menu-title h4 a:hover {
    color: #0D3E83;
}

.sidebar-widget-menu ul li .home-menu-title h4 a::before {
    display: none;
}

/*** 
====================================================================
    Search Popup
====================================================================
***/
.search-popup {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
    margin-top: -540px;
    transform: translateY(-100%);
    background-color: rgba(0, 0, 0, 0.90);
    -webkit-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition: all 1500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    /* easeInOutQuint */
    -webkit-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    /* easeInOutQuint */
}

.search-popup {
    width: 100%;
}

.search-active .search-popup {
    transform: translateY(0%);
    margin-top: 0;
}

.search-popup .close-search {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    margin-top: -200px;
    border-radius: 50%;
    text-align: center;
    background-color: #003a37;
    width: 70px;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    border-bottom: 3px solid #ffffff;
    -webkit-transition: all 500ms ease;
    height: 70px;
    line-height: 70px;
    text-align: center;
}

.search-active .search-popup .close-search {
    visibility: visible;
    opacity: 1;
    top: 50%;
    -webkit-transition-delay: 1500ms;
    -moz-transition-delay: 1500ms;
    -ms-transition-delay: 1500ms;
    -o-transition-delay: 1500ms;
    transition-delay: 1500ms;
}

.search-popup form {
    position: absolute;
    max-width: 700px;
    top: 50%;
    left: 15px;
    right: 15px;
    margin: -35px auto 0;
    transform: scaleX(0);
    transform-origin: center;
    background-color: #111111;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.search-active .search-popup form {
    transform: scaleX(1);
    -webkit-transition-delay: 1200ms;
    -moz-transition-delay: 1200ms;
    -ms-transition-delay: 1200ms;
    -o-transition-delay: 1200ms;
    transition-delay: 1200ms;
}

.search-popup .form-group {
    position: relative;
    margin: 0px;
    overflow: hidden;
}

.search-popup .form-group input[type="text"],
.search-popup .form-group input[type="search"] {
    position: relative;
    display: block;
    font-size: 18px;
    line-height: 50px;
    color: #000000;
    height: 70px;
    width: 100%;
    padding: 10px 30px;
    background-color: #ffffff;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    font-weight: 500;
    text-transform: capitalize;
}

.search-popup .form-group input[type="submit"],
.search-popup .form-group button {
    position: absolute;
    right: 30px;
    top: 0px;
    height: 70px;
    line-height: 70px;
    background: transparent;
    text-align: center;
    font-size: 24px;
    color: #003a37;
    padding: 0;
    cursor: pointer;
    -webkit-transition: all 500ms ease;
    border: none;
}

.search-popup .form-group input[type="submit"]:hover,
.search-popup .form-group button:hover {
    color: #000000;
}

.search-popup input::placeholder,
.search-popup textarea::placeholder {
    color: #000000;
}

.search-popup .close-search.style-two {
    position: absolute;
    right: 25px;
    left: auto;
    color: #ffffff;
    width: auto;
    height: auto;
    top: 25px;
    margin: 0px;
    border: none;
    background: none !important;
    box-shadow: none !important;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.flaticon-multiply:before {
    content: inherit;
}

button.close-search i {
    font-size: 25px;
    color: #fff;
    display: inline-block;
}

span.flaticon-multiply i {
    display: inline-block;
    color: #003a37;
}



/*
<!-- ============================================================== -->
<!-- Lifesafe Scrollup Section -->
<!-- ============================================================== -->*/
.prgoress_scrollup {
    position: fixed;
    right: 55px;
    bottom: 80px;
    height: 48px;
    width: 48px;
    cursor: pointer;
    display: block;
    border-radius: 50px;
    box-shadow: inset 0 0 0 2px rgba(0, 119, 249, 0.2);
    z-index: 2;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transform: translateY(15px) !important;
    transition: all 200ms linear !important;
}

.prgoress_scrollup.active-progress {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) !important;
}

.prgoress_scrollup::after {
    position: absolute;
    content: "\F286";
    font-family: bootstrap-icons;
    text-align: center;
    line-height: 46px;
    font-size: 16px;
    color: #0D3E83;
    left: 0;
    top: 0;
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    font-weight: 900;
    z-index: 1;
    transition: all 200ms linear !important;
}

.prgoress_scrollup:hover::after {
    color: #0D3E83;
}

.prgoress_scrollup svg path {
    fill: none;
}

.prgoress_scrollup svg.progress-circle path {
    stroke: #0D3E83;
    stroke-width: 4;
    box-sizing: border-box;
    transition: all 200ms linear !important;
}




@-webkit-keyframes ripple-blue {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3)
    }

    100% {
        -webkit-box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0)
    }
}

@keyframes ripple-blue {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3)
    }

    100% {
        -webkit-box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0)
    }
}


@keyframes loader {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 0;
    }
}

/*===========================
<-- Lifesafe Loader Css -->
=============================*/
.loader-wrapper {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    transition: 0.7s 1s ease;
    z-index: 666;
}

.loader-wrapper .loder-section {
    position: fixed;
    top: 0;
    width: 50%;
    height: 100%;
    background: #212529;
    z-index: 999;
}

.loader-wrapper .loder-section.left-section {
    left: 0;
    transition: 3s 1.5s ease;
}

.loader-wrapper .loder-section.right-section {
    right: 0;
    transition: 3s 1.5s ease;
}

/*/ When page loaded /*/
.loaded .loder-section.left-section {
    left: -100%;
}

.loaded .loder-section.right-section {
    right: -100%;
}

.loaded .loader-wrapper {
    visibility: hidden;
}

.loaded .loader {
    top: -100%;
    opacity: 0;
} 

.shifa-preloader {
    align-items: center;
    -webkit-align-items: center;
    display: flex;
    display: -ms-flexbox;
    height: 100%;
    justify-content: center;
    -webkit-justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 99999999999;
  }
  
   /* .preloader-close{
    position: fixed;
    z-index: 999999999999999999;
    font-size: 18px;
    background: #fff;
    width: 30px;
    height: 30px;
    line-height: 26px;
    text-align: center;
    cursor: pointer;
    right: 15px;
    top: 15px;
    border-radius: 50%;
  } */
  
  .shifa-preloader .animation-preloader {
    position: absolute;
    /* z-index: 100; */
  } 
  
  .shifa-preloader .animation-preloader .txt-loading {
    text-align: center;
    user-select: none;
  }
  
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:before{
    animation: letters-loading 7s infinite;
    content: attr(data-text-preloader);
    left: 0;
    opacity: 0;
    top:0;
    position: absolute;
  }
  
  .shifa-preloader .animation-preloader .txt-loading .letters-loading{
    font-weight: 500;
    letter-spacing: 12px;
    display: inline-block;
    position: relative;
    font-size: 100px;
    line-height: 70px;
    text-transform: uppercase;
    color: transparent;
    -webkit-text-stroke-width: 1px;
    /* -webkit-text-stroke-color: rgba(255, 255, 255, 0.30);  */
  }
  
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {animation-delay: 0.2s;}
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {animation-delay: 0.4s;}
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {animation-delay: 0.6s;}
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {animation-delay: 0.8s;}
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before { animation-delay: 1s;}
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before { animation-delay: 1.2s;}
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before { animation-delay: 1.4s;}
  .shifa-preloader .loader-section {
    background-color: #ffffff;
    height: 100%;
    position: fixed;
    top: 0;
    width: calc(50% + 1px);
  }
  
  .preloader .loaded .animation-preloader {
    opacity: 0;
    transition: 0.5s ease-out;
  }
  
  .handle-preloader .animation-preloader .txt-loading .letters-loading{
    
  }
  
  .shifa-preloader .animation-preloader .txt-loading .letters-loading:before{
     color: #0D3E83; 
  }

  .shifa-preloader.style-two .animation-preloader .txt-loading .letters-loading:before{
    color: #01bdb2;
  }

  .shifa-preloader.style-three .animation-preloader .txt-loading .letters-loading:before{
    color: #406aff;
  }
  
  @keyframes letters-loading {
    0%,
    75%,
    100% {
      opacity: 0;
      transform: rotateY(-90deg);
    }
  
    25%,
    50% {
      opacity: 1;
      transform: rotateY(0deg);
    }
  }