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

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




/*==================================================
 <-- Medway Header Top Menu Area Css-->
===================================================*/

.topbar-area {
    padding: 20px 0;
}

.topbar-items {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.medical-service {
    display: flex;
    align-items: center;
    position: relative;
}

.medical-service::before {
    position: absolute;
    content: "";
    height: 128px;
    width: 1px;
    background: #fff;
    right: -20px;
}

.medical-items-box {
    text-align: center;
    margin-left: 50px;
    position: relative;
}

.medical-items-box::before {
    position: absolute;
    content: "";
    height: 128px;
    width: 1px;
    background: #fff;
    left: -25px;
    top: -20px;
}

.medical-icon {
    position: relative;
    transition: .5s;
    top: 0;
}

.medical-items-box:hover .medical-icon {
    top: -5px;
}

.medical-content h4 {
    color: #002935;
    font-size: 24px;
    font-weight: 500;
    margin-top: 8px;
}

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

.header-area {
    background: #0957DE;
    position: relative;
}

.header-menu-items {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
}

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

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

.header-menu ul li a {
    color: #FFF;
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    text-decoration: none;
    position: relative;
    padding: 30px 0;
}

.header-menu ul li a::before {
    position: absolute;
    content: "";
    height: 3px;
    width: 0;
    background: #84abef;
    bottom: 0px;
    right: 0;
    transition: .5s;
}

.header-menu ul li a:hover:before {
    width: 100%;
    left: 0;
}

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

.header-search a {
    font-size: 30px;
    color: #fff;
    font-weight: 800;
}

.header-call {
    display: flex;
    align-items: center;
    margin-left: 53px;
}

.header-call-icon i {
    font-size: 30px;
    color: #fff;
    font-weight: 800;
}

.header-call-title {
    margin-left: 20px;
}

.header-call-title a {
    display: block;
    color: #FFF;
    font-family: Barlow;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 26px;
    text-decoration: none;
}

/* 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: #0957DE!important;
    z-index: 9999 !important;
    animation-name: slideInDown;
    padding: 0 30px;
}


/* sub menu */

.header-menu ul .sub-menu {
    background: #fff;
    position: absolute;
    top: 125%;
    border-radius: 5px;
    width: 250px;
    text-align: left;
    margin: 0;
    -webkit-box-shadow: 0px 1px 3px rgb(0 0 0 / 30%);
    transition: .5s;
    visibility: hidden;
    border-top: 2px solid #0154F7;
    opacity: 0;
    z-index: 11;
}

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

.header-menu ul .sub-menu ul li a {
    padding: 5px 12px;
    text-align: left;
    width: 100%;
    display: inline-block;
    visibility: inherit !important;
    color: #141422;
    margin: 0;
    font-size: 16px;
}

.header-menu ul .sub-menu ul li a:hover {
    margin-left: 7px !important;
    color: #0154F7;
}

.header-menu ul .sub-menu ul li a::before {
    display: none;
}

.header-menu ul li:hover .sub-menu {
    visibility: visible;
    opacity: 1;
    top: 99%;
}


/* mobile menu */

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


/*==================================================
 <-- Medway Banner Area Css-->
===================================================*/

.banner-area {
    border-bottom: 1px solid #fff;
    height: 750px;
}

.banner-items {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.banner-title {
    display: flex;
    align-items: center;
    margin-bottom: 29px;
}

.banner-sub-title h4 {
    color: #0957DE;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    margin-left: 12px;
}

.banner-main-title {
    margin-bottom: 50px;
}

.banner-main-title h1 {
    color: #0957DE;
    font-family: Barlow;
    font-size: 65px;
    font-weight: 600;
    line-height: 75px;
}

.banner-main-title h1 span {
    color: #00BAEB;
    font-size: 65px;
    font-weight: 400;
    line-height: 75px;
}

.banner-thumb {
    position: relative;
    z-index: 1;
    top: 29px;
}

.banner-shape {
    position: absolute;
    bottom: 0;
    z-index: -1;
    right: 0;
}

/* slider video */

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


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

.medical-btn a {
    color: #FFF;
    font-size: 24px;
    font-weight: 500;
    padding: 14px 33px;
    text-transform: uppercase;
    text-decoration: none;
    background: #00BAEB;
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    height: 57px;
    max-width: 161px;
    text-transform: uppercase;
    z-index: 1;
}

.medical-btn a::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    border-bottom: 80px solid #0957DE;
    right: -50px;
    border-right: 50px solid transparent;
    transform: translateX(-100%);
    transition: .5s;
    width: 0;
    z-index: -1;
}

.medical-btn a::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    border-bottom: 80px solid #0957DE;
    right: -98px;
    border-left: 50px solid transparent;
    transform: translateX(-100%);
    transition: .5s;
    width: 0;
    z-index: -1;
}

.medical-btn a:hover::before {
    transform: translateX(-10%);
    right: 0;
    width: 100%;
}

.medical-btn a:hover::after {
    transform: translateX(19%);
    right: 0;
    width: 100%;
}

/* about btn */

.medical-btn.about a {
    padding: 14px 23px;
    background: #0957DE;
}

.medical-btn.about a::before,
.medical-btn.about a::after {
    border-bottom: 80px solid #00BAEB;
}

/* project area btn */

.medical-btn.about.project a {
    padding: 14px 17px;
    font-size: 18px;
}

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

.service-area {
    padding: 121px 0 120px;
}

.service-thumb {
    position: relative;
}

.service-text {
    position: absolute;
    bottom: 77px;
    text-align: center;
    left: 0;
    right: 0;
    margin: auto;
}

.service-text h4 {
    color: #FFF;
    font-size: 26px;
    font-weight: 500;
    text-decoration: none;
    margin-bottom: 40px;
}

.service-text a {
    color: #0957DE;
    font-size: 24px;
    font-weight: 600;
    background: #fff;
    text-decoration: none;
    padding: 13px 70px;
    border-radius: 4px;
    transition: .5s;
}

.service-text a:hover {
    background: #0957DE;
    color: #fff;
}

/* servce items box */

.service-items-box {
    background: #FFF;
    border-radius: 4px;
    padding: 52px 26px 54px;
}

.service-items-content h4 a {
    color: #002935;
    font-size: 26px;
    font-weight: 500;
    text-decoration: none;
    transition: .5s;
}

.service-items-box:hover .service-items-content h4 a {
    color: #0957DE;
}

.service-items-content p {
    color: #747474;
    font-size: 16px;
    font-weight: 400;
    width: 83%;
    margin: 13px 0 18px;
}

.service-items-content i {
    width: 35px;
    height: 31px;
    border-radius: 2px;
    background: #FFF;
    box-shadow: 0px 4px 55px 2px rgba(0, 0, 0, 0.30);
    display: inline-block;
    line-height: 31px;
    text-align: center;
    color: #0957DE;
    font-size: 12px;
    transition: .5s;
    margin-left: 0;
}

.service-items-box:hover .service-items-content i {
    margin-left: 10px;
}

/* service single box */

.service-single-box {
    background: #0957DE;
    text-align: center;
    border-radius: 4px;
    padding: 88px 0 60px;
    position: relative;
    transition: .5s;
}

.service-single-box:hover {
    background: #00BAEB;
}

.service-single-box::before {
    position: absolute;
    content: "";
    width: 1px;
    height: 65px;
    background: #D9D9D9;
    top: 0;
}

.service-single-box::after {
    position: absolute;
    content: "";
    width: 65px;
    height: 1px;
    background: rgba(255, 255, 255, 0.40);
    left: 0;
    right: 0;
    margin: auto;
    bottom: 32px;
}

.service-icon {
    margin-bottom: 20px;
    transition: .5s;
    top: 0;
    position: relative;
}

.service-single-box:hover .service-icon {
    top: -5px;
}

.service-content h4 a {
    color: #FFF;
    font-size: 24px;
    font-weight: 600;
    text-decoration: none;
}

.service-content p {
    color: #FFF;
    font-size: 18px;
    font-weight: 400;
    margin: 13px 0 0;
}

/*==================================================
 <-- Medway Section Title Css-->
===================================================*/

.section-sub-title h4 {
    color: #0957DE;
    font-size: 22px;
    font-weight: 500;
    text-transform: uppercase;
    margin-bottom: 11px;
}

.section-main-title {
    margin-bottom: 42px;
}

.section-main-title h2 {
    color: #010212;
    font-size: 45px;
    font-weight: 600;
    line-height: 55px;
}

/* about section title */

.section-sub-title.about h4 {
    margin-bottom: 27px;
}

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

/* pricing section title */

.section-main-title.pricing {
    margin-bottom: 50px;
}

/* appoinment section title  */

.section-sub-title.appoinment h4 {
    color: #fff;
}

.section-main-title.appoinment h2 {
    color: #fff;
    margin-bottom: 50px;
}

/* testi section title */

.section-main-title.testi h2 {
    color: #fff;
}

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

.about-discription p {
    color: #747474;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    width: 90%;
    margin-bottom: 23px;
}

.about-list {
    margin-bottom: 37px;
}

.about-list span {
    display: block;
    margin-bottom: 10px;
    color: #002935;
    font-family: Barlow;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
}

.about-list span i {
    color: #00BAEB;
    margin-right: 3px;
}

.about-thumb {
    position: relative;
    z-index: 1;
    text-align: right;
}

.about-shape1 {
    position: absolute;
    bottom: 0;
    left: 50px;
}

.about-shape2 {
    position: absolute;
    top: 66px;
    right: 120px;
    z-index: -1;
}

/*==================================================
 <-- Medway Counter Area Css-->
===================================================*/

.counter-area {
    background: url(../images/resource/counter-bg.png);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 105px 0 120px;
}

.counter-single-box {
    text-align: center;
}

.counter-numbar h4 {
    color: #FFF;
    font-size: 64px;
    font-weight: 600;
    display: inline-block;
}

.counter-numbar span {
    color: #FFF;
    font-size: 64px;
    font-weight: 600;
    display: inline-block;
}

.counter-content h4 {
    color: #FFF;
    font-size: 24px;
    font-weight: 600;
    margin: 20px 0 0;
}

/*==================================================
 <-- Medway Team Area Css-->
===================================================*/

.team-area {
    padding: 115px 0 100px;
}

.team-items {
    margin: 10px;
}

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

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

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

.team-main-icon {
    position: absolute;
    top: 25px;
    right: 26px;
    z-index: 99;
}

.team-main-icon a {
    height: 60px;
    width: 60px;
    background: #00BAEB;
    display: inline-block;
    text-align: center;
    line-height: 60px;
    color: #fff;
    border-radius: 50%;
    font-size: 30px;
    position: relative;
    z-index: 1;
}

.team-main-icon a::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0957DE;
    border-radius: 50%;
    transform: scale(0);
    z-index: -1;
    transition: .5s;
}

.team-items:hover .team-main-icon a::before {
    transform: scale(1);
}

.team-icon {
    position: absolute;
    top: 28px;
    right: 25px;
    opacity: 0;
    transition: .5s;
}

.team-items:hover .team-icon {
    opacity: 1;
}

.team-icon ul {
    list-style: none;
    background: #0957DE;
    padding: 0px 24px 20px;
    display: inline-block;
    border-radius: 30px;
    transition: .5s;
}

.team-items:hover .team-icon ul {
    padding: 62px 24px 20px;
}

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

.team-icon ul li a i {
    font-size: 14px;
    color: #fff;
}

.team-content {
    position: absolute;
    bottom: 0;
}

.team-content h4 {
    color: #FFF;
    font-size: 14px;
    font-weight: 400;
    border-radius: 3px 3px 0px 0px;
    background: #00BAEB;
    display: inline-block;
    padding: 8px 68px 8px 10px;
    position: relative;
    z-index: 1;
}

.team-content h4::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 0;
    background: #0957DE;
    top: 0;
    border-radius: 3px 3px 0px 0px;
    left: 0;
    z-index: -1;
    transition: .5s;
}

.team-items:hover .team-content h4::before {
    width: 100%;
}

.team-content h2 {
    color: #010212;
    font-size: 24px;
    font-weight: 500;
    background: #FFF;
    padding: 10px 40px 10px 8px;
}

.team-content h2 a {
    text-decoration: none;
}

/* owl nav */

.owl-nav {
    position: absolute;
    top: -92px;
    right: 20px;
    display: inline-flex;
}

.owl-prev i {
    width: 50px;
    height: 50px;
    border: 1px solid #0957DE;
    display: inline-block;
    line-height: 50px;
    text-align: center;
    border-radius: 50%;
    color: #0957DE;
    font-size: 23px;
    transition: .5s;
}

.owl-prev:hover i {
    background: #0957DE;
    color: #fff;
}

.owl-next i {
    width: 50px;
    height: 50px;
    border: 1px solid #0957DE;
    display: inline-block;
    line-height: 50px;
    text-align: center;
    border-radius: 50%;
    color: #0957DE;
    margin-left: 20px;
    font-size: 23px;
    transition: .5s;
}

.owl-next:hover i {
    background: #0957DE;
    color: #fff;
}

/*==================================================
 <-- Medway Project Area Css-->
===================================================*/

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

/* project item box */

.project-item-box {
    background: #00BAEB;
    padding: 82px 64px 72px;
}

.project-item-content h3 a {
    color: #FFF;
    font-size: 45px;
    font-weight: 600;
    text-decoration: none;
}

.project-item-content p {
    color: #FFF;
    font-size: 17px;
    font-weight: 400;
    line-height: 26px;
    width: 74%;
    margin: 24px 0 34px;
}

/* project single box */

.project-single-box {
    overflow: hidden;
    margin-bottom: 30px;
}

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

.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-text {
    width: 386px;
    height: 117px;
    background: #0957DE;
    padding: 21px 33px 0;
    position: absolute;
    bottom: -120px;
    left: 0;
    opacity: 0;
    transition: all 0.4s ease-in-out;
    z-index: 1;
}

.project-single-box:hover .project-text {
    bottom: 0;
    opacity: 1;
    transition-delay: 0.5s;
}

.project-text h4 a {
    color: #FFF;
    font-size: 22px;
    font-weight: 600;
    line-height: 40px;
    text-decoration: none;
}

.project-text span {
    color: #FFF;
    font-size: 16px;
    font-weight: 500;
}

.project-icon {
    position: absolute;
    right: -50px;
    bottom: 20px;
    transition: .5s;
    opacity: 0;
    transition: 0.3s cubic-bezier(0.5, 1, 0.89, 1);
    z-index: 1;
}

.project-single-box:hover .project-icon {
    right: 16px;
    opacity: 1;
    transition-delay: 0.9s;
}

.project-icon a {
    width: 63px;
    height: 63px;
    display: inline-block;
    background: #0957DE;
    border: 1px solid #0957DE;
    line-height: 58px;
    text-align: center;
    border-radius: 50%;
    color: #fff;
    font-size: 30px;
    transition: .5s;
}

.project-icon a:hover {
    background: inherit;
    border: 1px solid #0957DE;
}

/*==================================================
 <-- Medway Pricing Area Css-->
===================================================*/

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

/* toggle bar css */

div#toggle-bar {
    text-align: right;
    margin-top: 20px;
}

#toggle-bar>.tb-labels {
    vertical-align: 50%;
    color: #002935;
    font-size: 18px;
    font-weight: 500;
}

#toggle-bar>#annually {
    margin-right: 1rem;
}

#toggle-bar>#monthly {
    margin-left: 1rem;
}

#toggle-bar>#toggle-container {
    display: inline-block;
    cursor: pointer;
    border-radius: 45px;
    border: 1px solid #0957DE;
    background: #FFF;
    width: 134px;
    height: 50px;
}

#toggle-container>#toggle {
    border-radius: 45px;
    background: #0957DE;
    width: 78px;
    height: 50px;
}


/* pricing single box */

.pricing-single-box {
    background: #FFF;
    box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.10);
    padding: 50px 70px 0;
    position: relative;
    z-index: 1;
    transition: all 2s ease;
}

.pricing-single-box:hover {
    background: url(../images/resource/pricing-hover.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.pricing-single-box::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 70px;
    background: #00BAEB;
    left: 0;
    bottom: 0;
    z-index: -1;
}

.pricing-single-box::after {
    position: absolute;
    content: "";
    height: 70px;
    background:#0957DE;
    width: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: -1;
    transition: .5s;
}

.pricing-single-box:hover::after{
    width: 100%;
}


.pricing-title h3 {
    color: #002935;
    text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.25);
    font-size: 24px;
    font-weight: 600;
    line-height: 30px;
    margin-bottom: 18px;
    transition: .5s;
}

.pricing-single-box:hover .pricing-title h3{
    color: #fff;
}

.pricing-rate {
    margin-bottom: 24px;
}

.pricing-rate h3 {
    color: #0957DE;
    text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.25);
    font-size: 48px;
    font-weight: 600;
    transition: .5s;
    display: inline-block;
    transition: .5s;
}

.pricing-single-box:hover .pricing-rate h3{
    color: #fff;
}

.pricing-rate span {
    color: #747474;
    font-size: 20px;
    font-weight: 600;
    transition: .5s;
}

.pricing-single-box:hover .pricing-rate span{
    color: #fff;
}

.pricing-list {
    margin-bottom: 57px;
}

.pricing-list span {
    display: block;
    color: #747474;
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 15px;
    transition: .5s;
}

.pricing-single-box:hover .pricing-list span{
    color: #fff;
}

.pricing-list span i {
    height: 15px;
    width: 15px;
    line-height: 17px;
    background: #747474;
    display: inline-block;
    border-radius: 50%;
    color: #fff;
    font-size: 14px;
    text-align: center;
    margin-right: 7px;
}

.pricing-single-box:hover .pricing-list span i{
    background: #fff;
    color:#0957DE;
}

.pricing-list span.active i {
    background: #0957DE;
}

.pircing-btn a {
    display: inline-block;
    color: #FFF;
    font-size: 22px;
    font-weight: 600;
    text-decoration: none;
    padding: 22px 40px 22px;
}



/*==================================================
 <-- Medway Appoinment Area Css-->
===================================================*/
.appoinmnet-area {
    background: url(../images/resource/appoinment-bg.png);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 25px 0 300px;
    margin-bottom: -205px;
}

/* form css */

.appoinment-form {
    background: url(../images/resource/appoinment.png);
    background-size: cover;
    padding: 100px 30px 20px 30px;
    margin-top: -204px;
}

.form_group {
    position: relative;
    margin-bottom: 20px;
    text-align: left;
}

.form_group input {
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 3px;
    padding: 12px 12px 12px 15px;
    width: 270px;
    height: 52px;
    color: #fff;
}

.form_group input::-webkit-input-placeholder{
    color: #fff;
}

.form_group input::placeholder {
    color: rgba(255, 255, 255, 0.90);
    font-size: 15px;
    font-weight: 500;
}

.form_group i {
    position: absolute;
    right: 20px;
    top: 13px;
    color: rgba(255, 255, 255, 0.90);
    font-size: 16px;
}

.form_group textarea {
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 3px;
    padding: 12px 30px 12px 15px;
    width: 100%;
    height: 134px;
}

.form_group textarea::placeholder {
    color: rgba(255, 255, 255, 0.90);
    font-size: 15px;
    font-weight: 500;
}

.form_group button {
    width: 195px;
    height: 64.641px;
    border: none;
    color: #0355F7;
    font-size: 18px;
    font-weight: 600;
    transition: .5s;
}

.form_group button:hover{
    background:#0355F7;
    color: #fff;
}

/* testimonial css */

.testimonial-item {
    margin-left: 50px;
}

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

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

.testi-thumb img {
    border-radius: 50%;
}

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

.testi-title h4 {
    color: #FFF;
    font-size: 22px;
    font-weight: 700;
    line-height: 32px;
}

.testi-title span {
    color: #FFF;
    font-size: 16px;
    font-weight: 500;
}

.testi-review i {
    color: #FFC107;
    margin-right: 5px;
    font-size: 17px;
}

.testi-content p {
    color: #FFF;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    margin: 34px 0 0;
}

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


/*==================================================
 <-- Medway Brand Area Css-->
===================================================*/

.brand-area {
    padding: 55px 0 55px;
    background: #00BAEB;
}

.brand-thumb {
    margin: 30px;
}

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

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

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

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

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

.blog-meta-date {
    width: 60px;
    height: 53px;
    border-radius: 3px 0px 0px 3px;
    background: #00BAEB;
    line-height: 0px;
    position: absolute;
    z-index: 1;
    padding: 7px 0px 0px;
    bottom: 0;
    right: 0;
}

.blog-meta-date::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 0;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #0154F7;
    border-radius: 3px 0px 0px 3px;
    margin: auto;
    z-index: -1;
    transition: .5s;
}

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

.blog-meta-date h5 {
    color: #FFF;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 8px;
}

.blog-meta-date span {
    color: #FFF;
    font-size: 16px;
    text-align: center;
    margin-left: 16px;
}

.blog-content {
    padding: 24px 24px 25px;
    background: #FFF;
    box-shadow: 0px 4px 30px 0px #E3E3E2;
}

.blog-meta {
    margin-bottom: 10px;
}

.blog-meta span {
    margin-right: 28px;
    font-size: 16px;
}

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

.blog-meta span i{
    margin-right:5px ;
}


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

.blog-title {
    margin-bottom: 20px;
}

.blog-title h4 a {
    font-size: 24px;
    padding: 0px 0 17px;
    margin-bottom: 20px;
    font-weight: 600;
    line-height: 34px;
    text-decoration: none;
}

.blog-single-box:hover .blog-title h4 a {
    color: #0154F7;
}

.blog-single-box:hover .blog-btn a {
    color: #0154F7;
}

.blog-btn a {
    color: #010212;
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
    text-decoration: none;
    transition: .5s;
}

.blog-btn a i{
    color: #0154F7;
}


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

.footer-area {
    background: url(../images/footer/footer-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    padding: 0px 0 0px;
    position: relative;
}

/* footer contact */

.footer-contact {
    border-radius: 0px 0px 14px 14px;
    background: #0957DE;
    padding: 32px 30px 32px;
    margin-bottom: 110px;
}

.contact-icon {
    float: left;
    margin-right: 15px;
    margin-top: 10px;
}

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

.contact-text h4 {
    color: #FFF;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
}

.contact-text a {
    color: #FFF;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-decoration: none;
}

.form-field {
    position: relative;
}

.form-field input {
    background: inherit;
    outline: 0;
    border: 0;
    border-bottom: 1px solid #fff;
    width: 289px;
    height: 38px;
    padding: 25px 0px 24px;
}

.form-field input::placeholder {
    color: #FFF;
    font-size: 17px;
    font-weight: 500;
}

button.newsletter-button {
    top: 5px;
    position: absolute;
    right: 7px;
}

button.newsletter-button i {
    width: 34px;
    height: 30px;
    display: inline-block;
    border: none;
    outline: 0;
    line-height: 30px;
    color: #0957DE;
    background: #fff;
}

/* footer social */

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

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

.footer-social ul li a i {
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: #fff;
    text-align: center;
    display: inline-block;
    border-radius: 50%;
    font-size: 16px;
    color: #0957DE;
    transition: .5s;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
}

.footer-social ul li a:hover i{
    color: #fff;
}

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

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


/* footer widget */

.footer-wiget-text h4 {
    margin: 28px 0 24px;
    color: #FFF;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
}

.footer-shape-title h3 {
    color: #FFF;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    margin-bottom: 23px;
}

.footer-wiget-shape {
    display: inline-block;
    margin-right: 10px;
}

.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: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: 34px;
    padding: 0 0 18px;
}

.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;
    color: #FFF;
    font-size: 18px;
    font-weight: 400;
    line-height: 36px;
    transition: .5s;
    margin: 0;
}

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

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

.footer-widget-contct-menu ul li.line {
    margin-bottom: 20px;
    border-bottom: 1px solid #252424;
    padding: 0px 0 13px;
}

.footer-widget-contct-menu ul li a {
    display: block;
    color: #FFF;
    font-size: 18px;
    line-height: 32px;
    font-weight: 400;
    margin: 5px 0 4px;
    transition: .5s;
    text-decoration: none;
}

.row.line {
    border-top: 1px solid rgba(255, 255, 255, 0.30);
    padding: 12px 0 0px;
}

.copyright-text {
    margin-top: 15px;
}

.copyright-text p {
    color: #FFF;
    font-size: 18px;
    font-weight: 400;
}

.copyright-text p a {
    color: #fff;
}

.footer-condition {
    text-align: right;
}

.footer-condition ul {
    list-style: none;
}

.footer-condition ul li {
    display: inline-block;
}

.footer-condition ul li a {
    display: inline-block;
    margin-right: 28px;
    color: #FFF;
    font-size: 18px;
    line-height: 34px;
    font-weight: 400;
    text-decoration: none;
    transition: .5s;
}

.footer-condition ul li a:hover{
    color: #0957DE;
}

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


.breatcome-area {
    background: url(../images/resource/breatcome-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 154px 0;
}

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

.breatcome-title h1 {
    color: #FFF;
    font-size: 45px;
    font-weight: 700;
    margin-bottom: 16px;
}

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

.bratcome-text ul li {
    display: inline-block;
    margin-right: 15px;
    color: #fff;
    font-weight: 600;
    transition: .5s;
}

.bratcome-text ul li a {
    display: inline-block;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    text-decoration: none;
    position: relative;
}

.bratcome-text ul li a::before {
    position: absolute;
    content: "/";
    left: 54px;
    font-size: 25px;
}

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

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


.service-details-content h4 {
    margin: 28px 0 20px;
}

.service-details-content h4 a {
    color: #18191D;
    font-size: 30px;
    font-weight: 500;
    line-height: 45px;
    text-decoration: none;
    transition: .5s;
}

.service-details-content h4 a:hover{
    color: #0957DE;
}

/* widget search box */

.widget_search.box {
    padding: 29px 22px 30px;
    border-radius: 4px;
    margin-bottom: 30px;
    background: #F5F5F5;
}

.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;
    border: 1px solid #0957DE;
}

.widget_search input::placeholder {
    color: #0957DE;
    font-size: 16px;
    font-weight: 500;
}

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

/* widget catagories box */

.widget-categories-box {
    padding: 29px 30px 40px;
    margin-bottom: 30px;
    background: #F8F8F8;
}

.widget-catagories-title h4 {
    color: #18191D;
    font-family: Rubik;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 26px;
    margin-bottom: 45px;
    position: relative;
}

.widget-catagories-title h4::before {
    position: absolute;
    content: "";
    height: 2px;
    width: 58px;
    background:#0957DE;
    left: 0;
    bottom: -10px;
}

.widget-categories-menu ul li {
    list-style: none;
    padding: 15px;
    position: relative;
    margin-bottom: 17px;
    background: #fff;
    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: #0957DE;
    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;
    color: #18191D;
    font-size: 17px;
    transition: .5s;
    font-weight: 500;
}

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

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

/* widget tag */

.widget-tags a {
    display: inline-block;
    text-decoration: none;
    padding: 7px 13px;
    background: #fff;
    border-radius: 3px;
    color: #0957DE;
    font-size: 15px;
    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: #0957DE;
    z-index: -1;
    border-radius: 3px;
    transition: .5s;
}

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



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

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

.ba-team-details-author-skill-area {
    margin-bottom: 30px;
}

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

.team-details-author-name {
    margin-bottom: 14px;
}

.team-details-author-name h4 {
    font-size: 24px;
    line-height: 60px;
    color: #292930;
    font-weight: 600;
}

.team-details-author-name span {
    font-size: 16px;
    line-height: 36px;
    color: #434141;
    font-weight: 400;
}

.team-details-author-experience ul li {
    list-style: none;
    margin-bottom: 25px;
}

.team-details-author-experience ul li .label {
    min-width: 152px;
    float: left;
    font-size: 16px;
    color: #434141;
    font-weight: 500;
}

.team-details-author-experience ul li .value {
    overflow: hidden;
    display: block;
}

.team-details-author-experience ul li .value {
    overflow: hidden;
    display: block;
    text-decoration: none;
    font-size: 16px;
    color: #434141;
}

.team-card-box-social a {
    display: inline-block;
    margin-right: 15px;
    height: 40px;
    width: 40px;
    background: #f3f3f3;
    line-height: 40px;
    text-align: center;
    border-radius: 50%;
    position: relative;
    z-index: 1;
}

.team-card-box-social a::before{
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0957DE;
    border-radius: 50%;
    transform: scale(0);
    transition: .5s;
    z-index: -1;
}

.team-card-box-social a:hover::before{
    transform: scale(1);
}

.team-card-box-social a i{
    transition: .5s;
}

.team-card-box-social a:hover i{
    color: #ffffff;
}

/* progressbar css */

.team-details-area .process-ber-plugin {
    padding: 36px 0 0;
}

.team-details-area span.process-bar {
    font-size: 16px;
    color: #1c1632;
    font-weight: 500;
    position: relative;
}

.team-details-area .barfiller {
    width: 100%;
    height: 10px;
    position: relative;
    margin-bottom: 25px;
    margin-top: 11px;
    border-radius: 3px;
    background-color: #c9ccd2;
}

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

.team-details-area .barfiller .tipWrap {
    display: none;
}

.team-details-area .barfiller .tip {
    font-size: 16px;
    color: #1c1632;
    font-weight: 500;
    top: -37px;
    padding: 1px 6px;
    left: 0px;
    position: absolute;
}

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

.team-details-area span.fill {
    background: #0957DE!important;
    border-radius: 3px;
}

.team-details-content {
    margin-top: 30px;
}

.team-details-title h4 {
    font-size: 35px;
    margin-bottom: 20px;
}

/* form box css */

.contact-box.inner.team {
    margin-top: 30px;
}

.contact-title.inner.team h4 {
    border-bottom: 1px solid  #dddddd;
    padding: 0px 0 13px;
    margin-bottom: 28px;
}

.form-box.team input {
    width: 100%;
    height: 58px;
    border-radius: 5px;
    background: #F6F6F6;
    outline: 0;
    border: 0;
    margin-bottom: 15px;
    padding: 0 20px;
}

.form-box.team textarea {
    width: 100%;
    height: 141px;
    border-radius: 5px;
    background: #F6F6F6;
    outline: 0;
    border: 0;
    margin-bottom: 15px;
    padding: 15px 20px;
}

.form-box-button.team {
    margin-left: 0;
}

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

.project-area.inner-page {
    padding: 120px 110px;
}


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

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

.projetct-details-image {
    margin-bottom: 30px;
}

.project-details-title h5 {
    font-size: 35px;
    font-weight: 500;
    line-height: 45px;
}

.project-detials-discriopton p {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    margin: 17px 0 25px;
}

.project-details-area .info li {
    display: flex;
    padding: 6px 0;
}

.project-details-area .info li h6 {
    font-weight: 700;
    text-transform: capitalize;
    width: 30%;
}

.project-details-area .info li h6 span {
    margin-left: 50px;
}

.project-details-area .info li p {
    position: relative;
    top: 10px;
}

.project-rating {
    margin-top: 11px;
    margin-bottom: 39px;
}

.project-rating i {
    margin: 12px 5px 30px;
    color: #0957DE;
}

.project-details-area .title h4 {
    font-size: 29px;
    line-height: 44px;
    text-transform: capitalize;
    font-weight: 700;
}

.project-details-area .desc-list {
    padding-top: 20px;
}

.project-details-area .desc-list li {
    position: relative;
    padding: 5px 0 5px 30px;
    list-style: none;
}

.project-details-area .desc-list li:before {
    content: '';
    position: absolute;
    top: 10px;
    left: 0;
    height: 15px;
    width: 15px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background: #0957DE;
}


.project-btn a {
    display: inline-block;
    text-decoration: none;
    color: #FFF;
    font-size: 18px;
    font-weight: 500;
    background: #0957DE;
    padding: 14px 28px;
    border-radius: 3px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: .5s;
}

.project-btn a:hover{
    color: #0957DE;
}

.project-btn a::before{
    position: absolute;
    content: "";
    transition-duration: 800ms;
    position: absolute;
    width: 200%;
    height: 200%;
    background: #fff;
    content: "";
    top: 110%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-radius: 50%;
    z-index: -1;
}

.project-btn a:hover::before{
    top: -40%;
}

.project-btn a i {
    margin-left: 4px;
    font-size: 17px;
}

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

.pricing-area.inner-page {
    padding: 116px 0 124px;
}


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

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

/* blog quote css */

.blog-quote-box {
    border-radius: 4px;
    background: #FFF;
    box-shadow: 0px 0px 45px 0px rgba(0, 0, 0, 0.10);
    padding: 42px 40px 37px;
}

.blog-quote-conent i {
    font-size: 30px;
    color:  #0957DE;
}

.blog-quote-conent p {
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    margin: 10px 0 15px;
}

.blog-quote-conent h4 {
    color:#0957DE;
    font-size: 24px;
    font-weight: 500;
    position: relative;
    margin-left: 50px;
}

.blog-quote-conent h4::before {
    position: absolute;
    content: "";
    height: 3px;
    width: 40px;
    background:#0957DE;
    top: 14px;
    left: -50px;
}


/* blog standard box css */

.blog-standard-thumb {
    position: relative;
}

.blog-single-video {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    transform: translateY(-50%);
}

.blog-video-icon a {
    height: 90px;
    width: 90px;
    background: #fff;
    color: #0957DE;
    text-align: center;
    font-size: 50px;
    display: inline-block;
    line-height: 94px;
    border-radius: 100%;
    -webkit-animation: ripple-white 1s linear infinite;
    animation: ripple-blue 1s linear infinite;
    -webkit-transition: .5s;
}

.blog-standard-meta {
    margin: 30px 0 24px;
} 

.blog-standard-meta span {
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    margin-right: 30px;
    position: relative;
    transition: .5s;
}

.blog-standard-meta span:hover{
    color: #0957DE;
}

.blog-standard-meta span::before {
    position: absolute;
    content: "/";
    right: -20px;
}

.blog-standard-meta span.meta::before {
    display: none;
}

.blog-standard-content h4 a {
    font-size: 35px;
    font-weight: 500;
    display: inline-block;
    text-decoration: none;
    transition: .5s;
}

.blog-standard-content h4 a:hover{
    color: #0957DE;
}

.blog-standard-content p {
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    margin: 20px 0 30px;
}


/* blog standard owl carousel */

.blog-standard-area .owl-nav {
    top: 50%;
    left: 0;
}

.blog-standard-area .owl-prev {
    position: absolute;
    left: 0;
}

.blog-standard-area .owl-next {
    position: absolute;
    right: 0;
}

.blog-standard-area .owl-prev i {
    background: inherit;
    font-size: 70px;
    color: #0957DE;
    border: none;
}

.blog-standard-area .owl-prev i::after{
    display: none;
}

.blog-standard-area .owl-next i {
    background: inherit;
    font-size: 70px;
    color: #0957DE;
    border: none;
}

.blog-standard-area .owl-next i::after{
    display: none;
}

/* pagination css */

.as-pagination {
    margin-top: 18px;
}

.as-pagination ul {
    list-style: none;
}

.as-pagination ul li {
    display: inline-block;
}

.as-pagination ul li a {
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    border:  1px solid #C8C8C8;;
    height: 41px;
    width: 41px;
    line-height: 41px;
    text-align: center;
    border-radius: 50%;
    margin-left: 5px;
    transition: .5s;
    text-decoration: none;
    position: relative;
    transition: .5s;
}

.as-pagination ul li a:hover {
    color: #ffffff;
}

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

.as-pagination ul li a:hover::before {
    transform: scale(1);
}

/* recent post css */

.recent-widget-thumb {
    float: left;
    margin-right: 22px;
}

.recent-widget-thumb img {
    border-radius: 50%;
}

.recent-widget-meta span {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    margin-right: 30px;
}

.recent-widget-meta span i {
    margin-right: 5px;
    color: #0957DE;
}

.recent-widget-title h4 a {
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    text-decoration: none;
    transition: .5s;
}

.recent-widget-title h4 a:hover{
    color: #0957DE;
}


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

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

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

.blog-detaile-title h4 {
    margin: 35px 0 33px;
}

.blog-detaile-title h4 a {
    font-size: 35px;
    font-weight: 500;
    text-decoration: none;
}

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

.blog-details-meta span {
    font-size: 16px;
    font-weight: 400;
    margin-right: 20px;
}

.blog-details-meta span i{
    color: #0154F7;
    margin-right: 5px;
}

.blog-details-discription p {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
}

/* blog list css */

.blog-details-list ul li {
    list-style: none;
    margin-bottom: 23px;
    font-size: 18px;
    font-style: normal;
    line-height: 26px;
    font-weight: 600;
    transition: .5s;
}

.blog-details-list ul li:hover{
    color: #0154F7;
}

.blog-details-list ul li.active {
    color:#0154F7;
}

.blog-details-list ul li i {
    font-size: 22px;
    padding-right: 8px;
}


.row.line {
    border-top: 1px solid rgba(227, 227, 227, 1);
    border-bottom: 1px solid rgba(227, 227, 227, 1);
    padding: 36px 0 37px;
}

.blog-details-tag h6 {
    font-size: 24px;
    font-weight: 500;
    display: inline-block;
    margin-right: 36px;
}

.blog-details-tag a {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: #F8F8F8;
    border-radius: 3px;
    color: #102039;
    font-size: 15px;
    font-style: normal;
    margin-right: 15px;
    font-weight: 500;
    position: relative;
    transition: .5s;
    z-index: 1;
}

.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:#0154F7;
    z-index: -1;
    border-radius: 3px;
    transition: .5s;
}

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

.ba-blog-details-social-icons {
    text-align: right;
}

.ba-blog-details-social-icons.two {
    text-align: left;
}

.ba-blog-details-social-icons a {
    margin-left: 6px;
    width: 45px;
    height: 45px;
    line-height: 45px;
    border: 1px solid #0154F7;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    color:#0154F7;
    position: relative;
    z-index: 1;
    transition: .5s;
}

.ba-blog-details-social-icons a:hover{
    color: #FFF;
}

.ba-blog-details-social-icons a::before{
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:#0154F7;
    border-radius: 50%;
    transform: scale(0);
    z-index: -1;
    transition: .5s;
}

.ba-blog-details-social-icons a:hover::before{
    transform: scale(1.1);
}

/* blog team css */

.blog-details-team-item {
    border-bottom: 1px solid rgba(227, 227, 227, 1);
    padding: 0px 0px 42px;
}

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

.blog-team-content h4 a {
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    text-decoration: none;
}

.blog-team-content p {
    margin: 18px 0 16px;
}

/* blog items css */

.blog-details-item {
    background: #F8F8F8;
    padding: 57px 30px 30px;
}

.blog-details-item.two {
    text-align: right;
}

.blog-item-thumb {
    float: left;
    margin-right: 24px;
    margin-top: -21px;
}

.blog-item-thumb.two {
    float: right;
    margin-left: 24px;
}

.blog-item-content h4 a {
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    text-decoration: none;
}

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

/* blog details comment */

.blog-details-comment h5 {
    font-size: 30px;
    font-style: normal;
    font-weight: 500;
    position: relative;
    margin-bottom: 36px;
}

.blog-details-comment h5::after {
    position: absolute;
    bottom: -10px;
    width: 70px;
    height: 3px;
    background:#0154F7;
    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 {
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
}

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

.content-main p {
    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:#0154F7;
    z-index: -1;
    border-radius: 3px;
    transition: .5s;
}

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

/* blog contact box */

.blog-contact-title h4 {
    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:#0154F7;
    content: "";
    left: 0;
}

/* contact form */

.form-box input {
    width: 100%;
    height: 55px;
    background: #F8F8F8;
    border: 1px solid #DDD;
    border-radius: 3px;
    padding: 0 17px;
    margin-bottom: 25px;
}

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

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

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

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

.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.details {
    margin-left: 0;
}


/*===============================================================
<-- Contact Css-->
=================================================================*/

.contact-inner-page {
    padding: 118px 0 0;
    margin-bottom: -250px;
    position: relative;
}

.contact-inner-box {
    text-align: center;
    position: relative;
}

.contact-inner-box::before{
    position: absolute;
    content: "";
    width: 1px;
    height: 201px;
    background: rgba(205, 205, 205, 0.45);
    right: 0;
}

.contact-inner-box.two::before {
    display: none;
}

.contact-inner-icon i {
    font-size: 40px;
    color: #0154F7;
}

.contact-content h4 {
    font-size: 24px;
    font-weight: 500;
    line-height: 26px;
    margin: 14px 0 13px;
}

.contact-content span {
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    display: block;
}

.contact-box.inner {
    margin-top: 0;
    border-radius: 10px;
    background: var(--white, #FFF);
    box-shadow: 0px 0px 45px 0px rgba(0, 0, 0, 0.10);
    padding: 63px 55px 82px;
}
.contact-title {
    margin-bottom: 63px;
}

.contact-title h2 {
    text-align: center;
    font-size: 45px;
    font-style: normal;
    font-weight: 500;
    line-height: 60px;
}

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














/*===============================================================
<-- Medway 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: #010212;
    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;
}

.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: #0154F7;
    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: #0154F7;
}


/* sidebar menu */

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

.sidebar-menu a {
    width: 52px;
    height: 52px;
    background: #0154F7;
    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: #141422;
}

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

.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: #0154F7;
    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: #0154F7;
    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: #0154F7;
}




/*
<!-- ============================================================== -->
<!-- Medway 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: #0154F7;
    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: #0154F7;
}
.prgoress_scrollup svg path {
	fill: none;
}
.prgoress_scrollup svg.progress-circle path {
    stroke: #0154F7;
    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;
    }
}

/*===========================
<-- Medway Loader Css -->
=============================*/

.loader_bg {
    position: fixed;
    z-index: 9999;
    background: #1f1f1f;
    width: 100%;
    height: 100%;
}

.loading-title {
    position: absolute;
    top: calc(50vh - 25px);
    left: calc(50vw - 40px);
    z-index: 1;
    font-size: 22px;
    color: #FFF;
    font-weight: 400;
    letter-spacing: 3px;
}

.loader {
    border-radius: 50%;
    width: 150px;
    height: 150px;
    position: absolute;
    top: calc(50vh - 75px);
    left: calc(50vw - 75px);
}

.loader:before,
.loader:after {
    content: '';
    border: 1em solid #0154F7;
    border-radius: 50%;
    width: inherit;
    height: inherit;
    position: absolute;
    top: 0;
    left: 0;
    animation: loader 2s linear infinite;
    opacity: 0;
}

.loader:before {
    animation-delay: .5s;
}