/*--------------------------------------------------------------------------------------
Theme Name: Carries
Theme URI: http://devitfamily.com
Author URI: http://devitfamily.com
Description: 100% Responsive, Highly Customizable, SEO Friendly transportation and Agency Based Template using Twitter Bootstrap Latest, Search Engine Friendly.
Author: OCREATES
Version: 1.0
----------------------------------------------------------------------------------------
   1. BASE CSS
    2. TOP AREA
        2.1. SEARCH AND LANGUAGE
        2.2 MAINMENU AREA
        2.3 WELCOME TEXT AREA
        2.4 WELCOME SLIDER AREA
    3. BLOG AREA
    4. ABOUT AREA
    5. SERVICE AREA
    6. SERVIE BOTTOM AREA
    7. PROMO AREA
    8. PROMO BOTTOM AREA
    9. TESTMONIAL AREA
    10. FOOTER AREA
    11. FAQS AREA
    12. ABOUT DETAILS CONTENT AREA
    13. REPORT AREA
    14. TEAM AERA
    15. SERVICE TWO 
    16. SERVICE THREE
    17. CONTACT AREA
    18. FOOTER AREA
    19. SCROLL TO TOP
    20. WELCOME SLIDER AREA
    21. BLOG PAGE
    22. SERVICE PAGE
    23. 404 ERROR PAGE
----------------------------------------------------------------------------------------*/

/*--------------------
   1. BASE CSS
----------------------*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
    /* Modern Gradient Colors */
    --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --secondary-gradient: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    --accent-gradient: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    
    /* Solid Colors */
    --primary-color: #667eea;
    --secondary-color: #764ba2;
    --accent-color: #f5576c;
    --text-dark: #1a202c;
    --text-light: #4a5568;
    --text-muted: #718096;
    --bg-light: #f7fafc;
    --bg-white: #ffffff;
    
    /* Glassmorphism */
    --glass-bg: rgba(255, 255, 255, 0.7);
    --glass-border: rgba(255, 255, 255, 0.3);
    --glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
    
    /* Spacing */
    --section-padding: 120px 0;
    --card-radius: 16px;
    --button-radius: 12px;
}
html,
body {
    height: 100%;
    /* font-family: 'Crimson Text', serif; */
}

body {
    font-family: 'Inter', sans-serif !important;
    font-size: 16px;
    line-height: 1.6;
    font-weight: 400;
    color: #4a5568;
    background: linear-gradient(180deg, #f6f8ff 0%, #f8fafc 100%);
}

:root {
    --faxton-blue: #0d6efd;
    --faxton-blue-2: #1f5eff;
    --faxton-red: #d03326;
    --faxton-red-soft: #ff5d5d;
    --faxton-navy: #091a34;
    --faxton-slate: #324158;
    --faxton-soft: #eef4ff;
    --faxton-shadow: 0 22px 55px rgba(15, 23, 42, 0.12);
}

/* Fix Bootstrap 5 tab visibility while keeping the legacy theme styles intact */
.tab-content > .tab-pane {
    display: none !important;
}

.tab-content > .tab-pane.active,
.tab-content > .tab-pane.show {
    display: block !important;
    opacity: 1 !important;
}

.tab-pane.fade,
.tab-pane.fade.show,
.tab-pane.active {
    opacity: 1 !important;
    transition: opacity 0.15s linear;
}

.fade.show,
.show {
    opacity: 1 !important;
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes glowFloat {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }
    50% {
        transform: translate3d(28px, -18px, 0) scale(1.08);
    }
    100% {
        transform: translate3d(-16px, 18px, 0) scale(1.04);
    }
}

@keyframes pulseGlow {
    0%, 100% {
        box-shadow: 0 0 0 rgba(208, 51, 38, 0.2);
    }
    50% {
        box-shadow: 0 0 25px rgba(208, 51, 38, 0.25);
    }
}

.reveal-on-scroll {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.7s ease, transform 0.7s ease, box-shadow 0.35s ease;
}

.reveal-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.alignleft {
    float: left;
    margin-right: 15px;
}

.alignright {
    float: right;
    margin-left: 15px;
}

.aligncenter {
    display: block;
    margin: 0 auto 15px;
}

a {
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

a:focus,
a:hover {
    outline: 0 solid;
    text-decoration: none;
}

ul,
ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

button:focus {
    outline: 0;
}

img {
    max-width: 100%;
    height: auto;
}


h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Space Grotesk', sans-serif !important;
    color: #1a202c;
    margin: 0 0 20px;
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
    position: relative;
}

h2 {
    font-size: 36px;
}

.section-title span {
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 700;
}

.section-title h2 {
    position: relative;
    display: inline-block;
}

.section-title h2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -12px;
    width: 72px;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--faxton-red), var(--faxton-blue));
}


a:hover,
a:focus {
    text-decoration: none;
    outline: 0;
}

a {
    color: #5d6b82;
}

.hero-slider-item {
    overflow: hidden;
}

.hero-slider-item::before,
.hero-slider-item::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(50px);
    opacity: 0.48;
    animation: glowFloat 12s ease-in-out infinite alternate;
}

.hero-slider-item::before {
    width: 300px;
    height: 300px;
    right: 10%;
    top: 12%;
    background: rgba(255, 255, 255, 0.18);
}

.hero-slider-item::after {
    width: 250px;
    height: 250px;
    left: 8%;
    bottom: 10%;
    background: rgba(208, 51, 38, 0.2);
    animation-delay: 1.2s;
}

.banner-content {
    position: relative;
    z-index: 2;
    animation: fadeUp 0.8s ease both;
}

.banner-content h1 {
    text-shadow: 0 8px 30px rgba(9, 26, 52, 0.18);
}

.banner-content span {
    display: inline-block;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(8px);
    border-radius: 999px;
    padding: 0.55rem 1rem;
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 1rem;
}

.default-btn-one,
.default-btn-two {
    position: relative;
    overflow: hidden;
    transition: all 0.35s ease;
    transform: translateY(0);
}

.default-btn-one::before,
.default-btn-two::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.35), transparent);
    transform: translateX(-120%);
    transition: transform 0.7s ease;
}

.default-btn-one:hover::before,
.default-btn-two:hover::before {
    transform: translateX(120%);
}

.default-btn-one:hover,
.default-btn-two:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 30px rgba(208, 51, 38, 0.22);
}

.service-card,
.choose-card,
.speciality-card,
.testimonials-card,
.contact-card,
.single-blog,
.partner-slider-item,
.features-area article {
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
    border: 1px solid rgba(15, 23, 42, 0.04);
}

.service-card:hover,
.choose-card:hover,
.speciality-card:hover,
.testimonials-card:hover,
.contact-card:hover,
.single-blog:hover,
.partner-slider-item:hover,
.features-area article:hover {
    transform: translateY(-8px);
    box-shadow: var(--faxton-shadow);
    border-color: rgba(31, 94, 255, 0.15);
}

.service-card,
.choose-card,
.contact-card,
.single-blog {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(8px);
}

.service-card i,
.choose-card i,
.contact-card i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.12), rgba(208, 51, 38, 0.13));
    color: var(--faxton-blue-2);
    font-size: 28px;
    margin-bottom: 18px;
    transition: all 0.35s ease;
}

.service-card:hover i,
.choose-card:hover i,
.contact-card:hover i {
    transform: scale(1.08) rotate(8deg);
    background: linear-gradient(135deg, var(--faxton-blue-2), var(--faxton-red));
    color: #fff;
    animation: pulseGlow 1.6s ease-in-out infinite;
}

.speciality-card img,
.single-blog img,
.features-area img {
    transition: transform 0.5s ease, filter 0.5s ease;
}

.speciality-card:hover img,
.single-blog:hover img,
.features-area article:hover img {
    transform: scale(1.05);
    filter: saturate(1.08);
}

.partner-slider-item {
    background: rgba(255,255,255,0.8);
    border-radius: 16px;
    padding: 18px 12px;
}

.contact-area {
    position: relative;
    z-index: 1;
}

.contact-area .contact-content {
    background: linear-gradient(135deg, rgba(9, 26, 52, 0.96), rgba(18, 38, 68, 0.96));
    border: 1px solid rgba(143, 170, 255, 0.18);
    border-radius: 28px;
    padding: 34px 26px 18px;
    box-shadow: 0 25px 60px rgba(9, 26, 52, 0.26);
}

.contact-area .contact-content .contact-card {
    position: relative;
    margin-bottom: 20px;
    padding: 24px 16px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 18px;
    min-height: 118px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.contact-area .contact-content .contact-card.text-center {
    text-align: center;
}

.contact-area .contact-content .contact-card i {
    display: none;
}

.contact-area .contact-content .contact-card h4 {
    color: #ffffff;
    margin-bottom: 8px;
    padding-top: 0;
    font-size: 18px;
    letter-spacing: 0.02em;
}

.contact-area .contact-content .contact-card p,
.contact-area .contact-content .contact-card a {
    color: rgba(226, 232, 240, 0.9) !important;
    line-height: 1.7;
    margin: 0;
    font-size: 15px;
}

.contact-area .contact-content .contact-card a:hover {
    color: #8ec5ff !important;
}

.transportation-form,
.about-contant,
.choose-text,
.blog-details {
    position: relative;
    z-index: 1;
}

.go-top {
    box-shadow: 0 14px 30px rgba(31, 94, 255, 0.28);
}

@media (max-width: 768px) {
    .banner-content h1 {
        font-size: 2.4rem;
    }

    .section-title h2 {
        font-size: 30px;
    }
}

.fix {
    overflow: hidden;
}

.relative {
    position: relative;
    overflow: hidden;
}

.absulute {
    position: absolute;
}

.v-center {
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.content-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.flex-v-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.social-bookmark li {
    display: inline;
}

.social-bookmark li a {
    background: #d7d7d7 none repeat scroll 0 0;
    border-radius: 50%;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    height: 40px;
    margin: 0 2px;
    padding-top: 9px;
    text-align: center;
    width: 40px;
}

.social-bookmark li a:hover {
    background: #f39c12 none repeat scroll 0 0;
    color: #fff;
}

.inline li {
    display: inline;
}

.inline-block li {
    display: inline-block;
    padding: 5px 15px;
}

.navbar-toggle {
    border: 2px solid #f39c12;
    border-radius: 0;
}

.navbar-toggle .icon-bar {
    background: #f39c12 none repeat scroll 0 0;
}

.no-margin {
    margin: 0;
}

.no-padding {
    padding: 0;
}

.border {
    border: 1px solid #ddd;
}

.border-left {
    border-left: 1px solid #ddd;
}

.border-right {
    border-right: 1px solid #ddd;
}

.border-top {
    border-top: 1px solid #ddd;
}

.border-bottom {
    border-bottom: 1px solid #ddd;
}




/* Remove Chrome Input Field's Unwanted Yellow Background Color */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}

.area-title {
    margin-bottom: 50px;
    position: relative;
}

.area-title h2 {
    display: inline-block;
    font-size: 40px;
    letter-spacing: 2px;
    line-height: 1;
    margin-bottom: 30px;
    padding-bottom: 20px;
    position: relative;
    text-transform: uppercase;
}

.area-title h2::before,
.area-title h2::after {
    background: rgba(0, 0, 0, 0) url("img/title-border.png") repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 2px;
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100px;
}

.area-title h2::after {
    background: #f39c12 none repeat scroll 0 0;
    height: 4px;
    width: 20px;
}

.section-padding {
    padding: 50px 0;
}

.padding-top {
    padding-top: 100px;
}

.padding-bottom {
    padding-bottom: 100px;
}

.padding-100-70 {
    padding-top: 100px;
    padding-bottom: 70px;
}

.padding-100-50 {
    padding-top: 100px;
    padding-bottom: 50px;
}

.gray-bg {
    background: #f7f9fc;
}

.deep-gray-bg {
    background: #eff1ff;
}

.dark-bg {
    background: #5d6b82;
    color: #ffffff;
}

.red-bg {
    background: #f39c12;
    color: #ffffff;
}

.blue-bg {
    background: #0083ff;
    color: #ffffff;
}

.soft-blue-bg {
    background: #7db9e8;
    color: #ffffff;
}

.dark-bg .area-title h2 {
    color: #ffffff;
}

/*--------------------------
    2. TOP AREA
---------------------------*/

.top-area {
    height: 100%;
    position: relative;
    width: 100%;
}

.top-area-bg {
    background: rgba(0, 0, 0, 0) url("img/slider/slide_2.jpg") no-repeat scroll center center / cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.top-area-bg::after {
    background: #3c4147;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.3;
    position: absolute;
    top: 0;
    width: 100%;
}


/*---------------------------------
    2.1. SEARCH AND LANGUAGE
----------------------------------*/

.search-and-language-bar {
    margin-left: 20px;
    margin-top: 30px;
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;

}

.is-sticky .search-and-language-bar {
    margin-top: 10px;
}

.search-and-language-bar ul li {
    color: #fff;
    cursor: pointer;
    display: inline-block;
    line-height: 1;
    padding: 10px;
}

.search-and-language-bar ul li a {
    color: #fff;
    display: block;
}

.search-box {
    position: relative;
}

.search-form {
    background: #fff none repeat scroll 0 0;
    border-radius: 5px;
    top: 72px;
    height: 60px;
    position: absolute;
    right: 0;
    width: 280px;
    display: none;
}

.is-sticky .search-form {
    top: 50px;
}

.search-form input {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 center;
    border: 1px solid #f39c12;
    color: #333;
    height: 40px;
    left: 11px;
    padding: 10px;
    position: absolute;
    top: 10px;
    width: 77%;
}

.search-form button {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #f39c12;
    color: #f39c12;
    font-size: 20px;
    height: 40px;
    padding: 7px 12px;
    position: absolute;
    right: 10px;
    top: 10px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.search-form button:hover {
    background: #f39c12 none repeat scroll 0 0;
    color: #fff;
}

.select-language select {
    background: #fff;
    border: 0 none;
    color: #333;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
}

/*---------------------------------
    2.2 MAINMENU AREA
-----------------------------------*/

.header-top-area {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 999;
}

.mainmenu-area {
    /* border-bottom: 1px solid rgba(243, 156, 18, .4); */
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    z-index: 9999;
}

.navbar-header {
    margin-top: 14px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.navbar {
    border-bottom: 0 none;
    border-top: 0 none;
    margin-bottom: 0;
}

.navbar-brand > img {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

/* Consistent logo sizing across all pages */
.main-logo,
.white-logo {
    max-height: 45px;
    max-width: 120px;
    width: auto;
    height: auto;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

/* Responsive logo sizing for mobile */
@media (max-width: 768px) {
    .main-logo,
    .white-logo {
        max-height: 35px;
        max-width: 100px;
    }
}

/* Sticky header logo sizing */
.is-sticky .navbar-brand > img,
.is-sticky .main-logo,
.is-sticky .white-logo {
    max-height: 40px;
    max-width: 110px;
}

@media (max-width: 768px) {
    .is-sticky .main-logo,
    .is-sticky .white-logo {
        max-height: 30px;
        max-width: 90px;
    }
}

ul#nav {
    float: right;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}



ul#nav li a {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #ffffff;
    letter-spacing: 0.5px;
    padding: 40px 15px;
    text-transform: none;
    font-weight: 500;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    text-shadow: none;
}

ul#nav li a:hover,
ul#nav li.active a {
    color: var(--primary-color);
}

.is-sticky ul#nav li a {
    padding: 20px 15px;
    color: #ffffff;
}

.is-sticky ul#nav li a:hover,
.is-sticky ul#nav li.active a {
    color: var(--primary-color);
}


.set-drop-bg{
    background-color: #f39c12 !important;
    color: gray;
}

.dropdown-menu .dropdown-item:last-child{
    border: 1px solid #fff !important;
}

.dropdown-menu .dropdown-item:hover{
    color: #000 !important;
}
.is-sticky .navbar-header {
    margin-top: -2px;
}

.is-sticky .mainmenu-area {
    background: var(--glass-bg);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--glass-border);
    -webkit-box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    z-index: 99999;
}

.menu-toggle.full {
    border: 1px solid var(--primary-color);
    height: 40px;
    letter-spacing: 0.5px;
    padding-top: 8px;
    position: absolute;
    right: 15px;
    text-align: center;
    top: 20px;
    width: 110px;
    color: var(--primary-color) !important;
    border-radius: var(--button-radius);
    font-weight: 500;
}

.is-sticky .menu-toggle.full {
    top: 8px;
}

ul#nav li ul a,
.is-sticky ul#nav li ul a {
    border-bottom: 1px solid #1a1a1a;
    padding: 10px;
    padding-left: 15px;
}



@media (max-width: 768px){
    #gwx_logo{
        width: 150px;
        height: 50px;
    }
}

_nav-header.gwx {
    /* background-color: rgba(243, 156, 18, 0.9); */
    /* overflow: hidden; */
}

.gwx_nav-header.navbar-brand img{
    /* background-color: rgba(255, 255, 255, 0.85);
    padding: 8px;
    border-radius: 8%;
    -moz-box-shadow: -10px 5px 17px #8f8f8f;
    -webkit-box-shadow: -10px 5px 17px #8f8f8f;
    box-shadow: -10px 5px 17px #8f8f8f; */
}
/*-----------------------------------
    2.3 WELCOME TEXT AREA
-------------------------------------*/

.welcome-area {
    color: #ffffff;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-top: 100px;
    width: 100%;
}

.welcome-text h1 {
    color: #ffffff;
    font-size: 56px;
    letter-spacing: 1px;
    line-height: 1.2;
    margin-bottom: 30px;
    text-transform: none;
    font-weight: 700;
    text-shadow: none;
    background: linear-gradient(135deg, #ffffff 0%, #e0e7ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.welcome-text p{
    color: #e0e7ff;
    font-size: 18px;
    text-shadow: none;
    line-height: 1.6;
}

.welcome-text h4 {
    font-size: 18px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--primary-color);
    font-weight: 600;
}

.home-button {
    height: auto !important;
    position: relative;
    /* padding-top: 20px  !important;
    padding-bottom: 5px !important; */
}


.home-button a {
    border: none;
    border-radius: var(--button-radius);
    color: #fff;
    background: var(--primary-gradient) !important;
    letter-spacing: 0.5px;
    padding: 12px 28px !important;
    text-align: center !important;
    text-transform: none;
    position: fixed;
    top: 32px;
    font-size: 14px !important;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
    transition: all 0.3s ease;
    /* z-index: 1000; */
}

/* .home-button a:last-child {
    margin-left: 20px;
} */

.home-button a:hover {
    background: var(--secondary-gradient) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(118, 75, 162, 0.5);
    color: #ffffff !important;
}

.home-button input[type=text]{
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.home-button input[type=text]:focus{
    color: #15223a;
}
.home-button input[type=text]::placeholder{
    color: #dab376;
    font-style: italic;
    opacity: .9;
}

.home-button input[type=submit]{
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-color: #f39c12;
    margin-left: -6px;
    text-transform: uppercase;
}




.home-mockup > img {
    max-width: 50%;
}

.gwx_home_margin {
    margin-top: 10px;
}

/*------------------------------
    2.4 WELCOME SLIDER AREA
--------------------------------*/

.welcome-slider-area {
    height: 100%;
    position: relative;
    z-index: 9;
}

.welcome-slider-area.owl-carousel div:not(.owl-controls) {
    height: 100%;
}

gle-slide {
    z-index: 9;
    position: relative;
}


.welcome-single-slide:before {
    /* background: #3c4147; */
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.2;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 5;
    background-color: orange !important;
}

.welcome-slider-area .welcome-text {
    color: #FFFFFF;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-top: 100px;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 100;
}

.welcome-text h4 {
    margin-bottom: 30px;
}

.welcome-text h2 {
    color: #fff;
    line-height: 1.2;
    margin-bottom: 30px;
    font-weight: 600;
    text-shadow: none;
}

.welcome-slider-area.home-button {
    height: auto !important;
}

.owl-item.active .welcome-single-slide .welcome-text h1 {
    -webkit-animation: 1s ease 0.5s normal both 1 running fadeInUp;
    animation: 1s ease 0.5s normal both 1 running fadeInUp;
}

.owl-item.active .welcome-single-slide .welcome-text p {
    -webkit-animation: 1s ease 0.8s normal both 1 running fadeInUp;
    animation: 1s ease 0.8s normal both 1 running fadeInUp;
}

.owl-item.active .welcome-single-slide .home-button {
    -webkit-animation: 1s ease 1s normal both 1 running fadeInUp;
    animation: 1s ease 1s normal both 1 running fadeInUp;
}

.slider-bg-one {
    background: url(img/slider/1.jpg) no-repeat scroll center center / cover;
}

.slider-bg-two {
    background: url(img/slider/4.jpg) no-repeat scroll center center / cover;
}

.slider-bg-three {
    background: url(img/slider/2.jpg) no-repeat scroll center center / cover;
}

.slider-bg-four {
    /* background: url(img/slider/slide_9.jpg) no-repeat scroll center center / cover; */
}

.slider-bg-five {
    background: url(img/slider/3.jpg) no-repeat scroll center center / cover;
}
.slider-bg-six {
    background: url(img/slider/6.jpg) no-repeat  top center / cover;
}

.welcome-slider-area.owl-carousel .owl-nav > div {
    background: #fff none repeat scroll 0 0;
    display: inline-block;
    font-size: 30px;
    height: 40px;
    margin: 0 5px;
    padding-top: 5px;
    text-align: center;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 40px;
}

.welcome-slider-area.owl-carousel .owl-controls {
    bottom: 7%;
    position: absolute;
    right: 8.4%;
}

.welcome-slider-area.owl-carousel .owl-nav > div:hover {
    background: #f39c12 none repeat scroll 0 0;
    color: #fff;
}

#gwx_slider p {
   font-size: 18px;
}

/* ----------------------------
    3. BLOG AREA
------------------------------ */

.single-blog {
    border-radius: var(--card-radius);
    -webkit-box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: all 0.3s ease;
}

.single-blog:hover {
    transform: translateY(-5px);
    -webkit-box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
}

.blog-details {
    background: var(--glass-bg);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--glass-border);
    padding: 30px 20px;
    position: relative;
}

.blog-meta {
    background: var(--primary-gradient);
    border-radius: 0 50px 50px 0;
    font-size: 24px;
    height: 50px;
    left: 0;
    position: absolute;
    text-align: center;
    top: -25px;
    width: 70px;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
}

.blog-meta a {
    color: #fff;
    display: block;
    height: 100%;
    padding-top: 13px;
    width: 100%;
}

.blog-details h3 {
    font-size: 18px;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.read-more {
    background: var(--primary-gradient);
    border-radius: var(--button-radius);
    color: #fff;
    display: inline-block;
    height: auto;
    margin-top: 15px;
    padding: 12px 28px;
    text-align: center;
    width: auto;
    font-weight: 600;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
    transition: all 0.3s ease;
}

.read-more:hover,
.read-more:focus {
    background: var(--secondary-gradient);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(118, 75, 162, 0.4);
    color: #fff;
}

.blog-details h3 a {
    color: #3c4a62;
}

.blog-details h3 a:hover,
.blog-details h3 a:focus {
    color: var(--primary-color);
}

/* ----------------------------
    4. ABOUT AREA
------------------------------ */

.quote-form-area {
    background: var(--glass-bg);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--glass-border);
    border-radius: var(--card-radius);
    padding: 30px 20px;
    box-shadow: var(--glass-shadow);
}

.quote-form input {
    margin-bottom: 10px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px 16px;
    transition: all 0.3s ease;
}

.quote-form input:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    outline: none;
}

.quote-form .width-full input {
    border: 1px solid #e2e8f0;
    padding: 12px 16px;
    width: 100%;
}

.quote-form .width-half input {
    border: 1px solid #e2e8f0;
    padding: 12px 16px;
    width: 47%;
}

.quote-form textarea {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    height: 120px;
    margin-bottom: 10px;
    padding: 12px 16px;
    width: 100%;
    transition: all 0.3s ease;
}

.quote-form textarea:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    outline: none;
}


.quote-form button {
    background: var(--primary-gradient);
    border: none;
    border-radius: var(--button-radius);
    color: #fff;
    letter-spacing: 0.5px;
    padding: 12px 24px;
    text-transform: none;
    font-weight: 600;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
}

.quote-form button:hover {
    background: var(--secondary-gradient);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(118, 75, 162, 0.4);
    color: #fff;
}

.about-content h2 {
    margin-bottom: 30px;
}

.about-content a {
    display: inline-block;
    margin-top: 20px;
}

.about-content a:hover {
    color: var(--primary-color);
}

.about-content a i {
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.about-content a:hover i {
    padding-left: 10px;
}

.about-count {
    margin-top: 80px;
}

.single-about-count {
    background: var(--glass-bg);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--glass-border);
    border-radius: var(--card-radius);
    float: left;
    padding: 30px 20px 20px;
    text-align: center;
    text-transform: capitalize;
    width: 33.33%;
    box-shadow: var(--glass-shadow);
    transition: all 0.3s ease;
}

.single-about-count:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
}

.single-about-count h4{
    color: var(--primary-color);
    font-size: 24px;
    font-weight: 700;
}

.single-about-count h4:not(.counter){
    margin-bottom: 3px ;
}

.gwx_about_count {
    display: flex;
    /* flex-wrap: wrap; */
}

.counter{
    margin:0 !important;
}

@media (max-width: 768px){
    .gwx_about_count {
        /* display: flex; */
        flex-wrap: wrap;
        flex-direction: column;
        align-items: center;
    }
}

.gwx_about-area {
    background: url(img/slider/slide_6.jpg) no-repeat scroll center center / cover;  
    margin-top: 30px; 
}

.gwx_about-area .about-content h2, .gwx_about-area .about-content p, .gwx_about-area .about-content a {
    color: white;
}

.about-gwx{
    padding: 10px;
}

.about-gwx-bg {
    padding: 10px;
    background-color: white;
}

.about-history-content p {
    /* font-family: 'Crimson Text', serif; */
    /* font-family: 'Inconsolata', monospace; */
    font-family: 'Lato', sans-serif;
    /* font-family: 'Montserrat', sans-serif; */
    font-size: 15px;
    margin-top: 0px;
    /* color: white; */
}


.gwx_about_border {
    border: 1px solid var(--primary-color);
    padding: 0px; 
    background: var(--glass-bg) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    margin-bottom: 10px !important;
    border-radius: var(--card-radius);
}

.gwx_about_fixed_1 {
    background: url(img/slider/5.jpg) no-repeat fixed center center / cover;
    height: 500px;
    margin-bottom: 100px;
}

.gwx_about_fixed_2 {
    background: url(img/slider/slide_6.jpg) no-repeat fixed center center / cover;
    height: 500px;
    margin-bottom: 100px;
}

.gwx_drips{
    color: var(--primary-color);
    font-weight: bold;
}

/* -----------------------------
    5. SERVICE AREA
------------------------------- */

.service-content h2 {
    font-size: 32px;
    margin-bottom: 30px;
    padding-bottom: 15px;
    position: relative;
}

.service-content h2::after {
    border-bottom: 2px solid var(--primary-color);
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 50px;
}

.service-catalouge-content-area {
    background: rgba(0, 0, 0, 0) url("img/service/service-cargo-bg.png") no-repeat scroll center center / contain;
    position: relative;
}

.catalouge-content {
    background: var(--primary-gradient);
    color: #fff;
    padding: 30px;
    border-radius: var(--card-radius);
    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.3);
}

.catalouge-content h3 {
    color: #fff;
    margin-bottom: 30px;
    padding-bottom: 15px;
    position: relative;
}

.catalouge-content h3::after {
    border-bottom: 1px dashed;
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    width: 50px;
}

.catalouge-content .read-more:hover,
.catalouge-content .read-more:focus {
    background: var(--secondary-gradient);
    transform: translateY(-2px);
    color: #fff;
}

.catalouge-content ul {
    margin-top: 40px;
}

.catalouge-content ul li {
    margin-bottom: 15px;
}

.catalouge-content ul li i {
    margin-right: 15px;
}

.gwx_service_display {
    display: none;
}

.gwx_service_active {
    background: var(--primary-gradient);
}

.gwx_service_active a{
    color: #fff !important;
}

/* ---------------------------
    6. SERVIE BOTTOM AREA
----------------------------- */

.service-bottom-area {
    position: relative;
}

.service-bottom-area-bg {
    background: rgba(0, 0, 0, 0) url("img/service/service-area-bg.jpg") repeat scroll 0 0;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.service-bottom-area-bg::after {
    background: #f5f7f9 none repeat scroll 0 0;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
}

.single-service {
    margin-bottom: 50px;
    padding-left: 80px;
    position: relative;
}

.service-list .single-service:last-child {
    margin-bottom: 0;
}

.service-icon-hexagon {
    left: -43px;
    position: absolute;
    top: -25px;
}

.hex {
    background: #f5f7f9 none repeat scroll 0 0;
    border-radius: 1em / 3.5em;
    display: inline-block;
    height: 5.2em;
    margin: 1em 4.61538em 1em auto;
    position: relative;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition: all 150ms ease-in-out 0s;
    transition: all 150ms ease-in-out 0s;
    width: 4em;
}

.hex:before,
.hex:after {
    position: absolute;
    width: inherit;
    height: inherit;
    border-radius: inherit;
    background: inherit;
    content: '';
}

.hex:before {
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
}

.hex:after {
    -webkit-transform: rotate(-60deg);
    transform: rotate(-60deg);
}

.service-icon {
    background: var(--primary-color) none repeat scroll 0 0;
    bottom: 7px;
    color: #fff;
    font-size: 24px;
    height: 60px;
    padding-top: 18px;
    position: absolute;
    right: 11px;
    text-align: center;
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 34px;
    z-index: 1;
}

.service-icon::before,
.service-icon::after {
    background: var(--primary-color) none repeat scroll 0 0;
    content: "";
    height: 100%;
    position: absolute;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
    z-index: -1;
}

.service-icon::before {
    bottom: 0;
    right: 0;
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
}

.service-icon::after {
    bottom: 0;
    right: 0;
    -webkit-transform: rotate(-60deg);
    transform: rotate(-60deg);
}

.service-icon i {
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
}

.service-details h4 {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.single-service:hover .service-details h4 {
    color: var(--primary-color);
}

.single-service:hover .service-icon,
.single-service:hover .service-icon::before,
.single-service:hover .service-icon::after {
    background: var(--secondary-color) none repeat scroll 0 0;
}

/* ----------------------------
    7. PROMO AREA
----------------------------- */

.promo-top-area {
    background: rgba(0, 0, 0, 0) url("img/promo/promo_top_bg.png") no-repeat scroll right 5% bottom 50% / 40% auto;
}

.single-promo {
    margin-bottom: 50px;
    padding: 20px 20px 20px 80px;
    position: relative;
}

.promo-area .row > div.col-lg-4 .single-promo:last-child {
    margin-bottom: 0;
}

.promo-icon {
    background: var(--glass-bg);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--glass-border);
    border-radius: 50%;
    color: var(--primary-color);
    font-size: 24px;
    height: 65px;
    left: 0;
    padding-top: 21px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 65px;
    box-shadow: var(--glass-shadow);
}

/* -----------------------------
    8. PROMO BOTTOM AREA
----------------------------- */

.promo-bottom-area {
    position: relative;
}

.promo-botton-area-bg {
    background: rgba(0, 0, 0, 0) url("img/promo/promo_bottom_bg.jpg") no-repeat scroll center center / cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.promo-botton-area-bg::after {
    background: #3c4a62 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.9;
    position: absolute;
    top: 0;
    width: 100%;
}

.promo-bottom-area h2 {
    color: #fff;
    font-size: 26px;
}

.promo-bottom-content .read-more {
    background: #f39c12 none repeat scroll 0 0;
    font-weight: bold;
    height: auto;
    letter-spacing: 1px;
    padding: 14px;
    text-transform: uppercase;
    width: 180px;
}

.promo-bottom-area .read-more:hover,
.promo-bottom-area .read-more:focus {
    background: #fff none repeat scroll 0 0;
    color: #f39c12;
}

/*-----------------------------
    9. TESTMONIAL AREA
-------------------------------*/


.client-photo-list .item {
    border-radius: 50%;
    overflow: hidden;
    margin: 10px 0;
    width: 200px;
    margin: auto;
}



.client-photo-list .owl-carousel .owl-item.active.center .item {
    -webkit-box-shadow: 0 0 0 5px #f39c12;
    box-shadow: 0 0 0 5px #f39c12;
    position: relative;
    z-index: 999;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    width: 200px;
    margin: auto;
}

.client-photo-list {
    margin-bottom: 40px;
}

.client-details-content .item {
    padding-top: 70px;
    position: relative;
}

.client-details-content .item::after {
    color: #5d6b82;
    content: "\f10d";
    font-family: fontawesome;
    font-size: 60px;
    height: 60px;
    left: 50%;
    line-height: 1;
    opacity: 0.5;
    position: absolute;
    top: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 60px;
}

.client-details-content .item q {
    display: block;
    font-size: 16px;
    font-style: italic;
    font-weight: 500;
    line-height: 1.5em;
    margin-bottom: 37px;
}

.client-details-content .item h3 {
    margin-bottom: 10px;
}

.client_nav span {
    background: #5d6b82 none repeat scroll 0 0;
    border-radius: 5px;
    color: #fff;
    display: inline-block;
    font-size: 30px;
    height: 40px;
    left: 50px;
    opacity: 0;
    padding-top: 3px;
    position: absolute;
    text-align: center;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 50px;
    cursor: pointer;
}

.client_nav span:hover {
    background: #f39c12;
}

.client_nav span.fa.testi_next {
    left: auto;
    right: 50px;
}

.testmonial-area:hover .client_nav span {
    left: 0;
    opacity: 1;
}

.testmonial-area:hover .client_nav span.testi_next {
    left: auto;
    right: 0;
}

.gwx_testmonial-area{

    background: url(img/slider/slide_8.jpg) no-repeat scroll center center / cover;  
    /* margin-top: 30px;  */
}

.gwx_testmonial-area .client_details q, .gwx_testmonial-area .client_details h3, .gwx_testmonial-area .client_details p, .gwx_testmonial-area .area-title h2 {

   color: white;
}


.client-list .single-client img{
    width: 120px;
}

/* -----------------------------
    10. FOOTER AREA
------------------------------- */
.footer-area p, .footer-area a{
    font-family: 'Inter', sans-serif !important;
}

.footer-top-area {
    padding: 3px 0;
}

.footer-area h2,
.footer-area h3 {
    color: #fff;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 0.02em;
}

.subscribe-content h2 {
    line-height: 1;
    margin-bottom: 14px;
}

.subsriber-form {
    height: 60px;
    position: relative;
}

.subsriber-form input {
    background: #fff none repeat scroll 0 0;
    border: 0 none;
    border-radius: 5px;
    color: #363;
    height: 100%;
    left: 0;
    padding: 10px;
    position: absolute;
    top: 0;
    width: 70%;
}

.subsriber-form button {
    background: #f39c12 none repeat scroll 0 0;
    border: 0 none;
    border-radius: 5px;
    color: #fff;
    font-weight: 500;
    height: 100%;
    letter-spacing: 1px;
    position: absolute;
    right: 0;
    text-transform: uppercase;
    top: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 27%;
}

.subsriber-form button:hover {
    background: #fff none repeat scroll 0 0;
    color: #f39c12;
}

/* ----------------------------
    11. FAQS AREA
------------------------------- */

.accordion-item{
    margin-bottom: 15px !important;
}

.accordion-item p{
    cursor: pointer;
}

#collapseOne, #collapseTwo, #collapseThree, #collapseFour, #collapseFive, #collapseSix, #collapseSeven, #collapseEight, #collapseNine, #collapseTen{
    background-color: #ebebeb !important;
    padding: 10px;
}

.faqs-list h3 {
    margin-bottom: 30px;
}

.faqs-list h3 span {
    color: #f39c12;
}

.faqs-list #accordion .panel-title {
    padding-left: 50px;
    position: relative;
    text-transform: capitalize;
}

.faqs-list #accordion .panel-title i {
    background: #f39c12 none repeat scroll 0 0;
    color: #fff;
    height: 30px;
    left: 0;
    padding-top: 8px;
    position: absolute;
    text-align: center;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 30px;
}

.faqs-list #accordion .panel-title i::after {
    background: #fff none repeat scroll 0 0;
    content: "";
    height: 12px;
    left: 50%;
    margin-left: -1.5px;
    margin-top: -6px;
    opacity: 0;
    position: absolute;
    top: 50%;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 3px;
}

.faqs-list #accordion .active .panel-title i::after {
    opacity: 1;
    ;
}

.faqs-list #accordion .panel,
.faqs-list #accordion .panel.active {
    border-bottom: 0 none;
    -webkit-box-shadow: 0 0 0 #fff;
    box-shadow: 0 0 0 #fff;
}

.panel-body {
    border: 0 none !important;
}

.panel-heading,
.panel-body {
    padding-left: 0;
}

/* -----------------------------
    12. ABOUT DETAILS CONTENT AREA
-------------------------------- */
.about-details-area{
  /* background: url(img/about/about-detail.jpg) no-repeat scroll center center / cover; */
}

.about-details-area.set-bg .container{
    position: relative;
    z-index: 210;
}

.about-details-menu {
    margin-bottom: 50px;
    text-align: center;
}

.about-details-menu li {
    display: inline-block;
    margin: 0 5px;
}

.about-details-menu li a {
    border: 1px solid #efefef;
    display: block;
    font-size: 18px;
    padding: 12px 20px;
    text-transform: uppercase;
}

.about-details-menu li.active a {
    background: #f39c12 none repeat scroll 0 0;
    border-color: #f39c12;
    color: #fff;
}

.about-history-content {
    margin-bottom: 20px;
}

.about-history-content h3 {
    margin-top: 15px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    color:#f39c12;
}

.about-history-content h3::after {
    border-bottom: 1px dashed #f39c12;
    bottom: 5px;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 120px;
}

.about-history-content ul {
    margin-top: 20px;
}

.about-history-content ul li {
    margin-bottom: 5px;
}

.about-history-content.history-list {
    position: relative;
}

.about-history-content.history-list::after {
    background: #e4e4e4;
    content: "";
    height: 100%;
    left: 80px;
    position: absolute;
    top: 0;
    width: 5px;
}

.single-history {
    margin-bottom: 50px;
    padding-left: 125px;
    position: relative;
}

.single-history .history-year {
    font-size: 18px;
    font-weight: 700;
    left: 0;
    position: absolute;
    top: 0;
    width: 85px;
}

.single-history .history-year::before,
.single-history .history-year::after {
    background: #fff none repeat scroll 0 0;
    border-radius: 50%;
    content: "";
    height: 30px;
    position: absolute;
    right: -12px;
    top: 0;
    width: 30px;
    z-index: 9;
}

.single-history .history-year::after {
    background: #f39c12;
    height: 10px;
    right: -2px;
    top: 9px;
    width: 10px;
}

/* ------------------------------
    13. REPORT AREA
------------------------------ */

.annual-reports > div {
    margin-bottom: 50px;
}

.annual-reports > div:last-child {
    margin-bottom: 0px;
}

.annual-reports-content h4 {
    margin-bottom: 30px;
}

.annual-reports-content ul {
    margin-top: 30px;
}

.annual-reports-content ul li {
    margin-bottom: 10px;
}

.annual-reports-content ul li i {
    color: #f39c12;
    margin-right: 10px;
}

/* ----------------------------
    14. TEAM AERA
-------------------------------- */

.single-team {
    text-align: center;
    margin-bottom: 30px;
    padding: 1px;
    max-width: 320px;
    transition: all .9s ease-out;
}

.team-list div > .col-lg-4:last-child .single-team {
    margin-bottom: 0;
}

.single-team .member-image img {
    width: 320px;
    height: auto;
    max-width: 100%;
}

.member-details {
    -webkit-box-shadow: 0 0 1px;
    box-shadow: 0 0 1px #f39c12;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 30px 15px;
    transition: all .6s ease-out;
    
}

.member-details p:first-of-type{
    font-weight: bold !important;
}

.member-details p:last-child{
    font-size: 13px;
}


/* .member-details .hides{
    display: none;
} */
.remove-hide{
    /* float: right; */
    text-decoration: underline;
    cursor: pointer;
    text-transform: capitalize;
    margin-top: 10px;
    color: #f39c12;
    
}

.b-overlay{
    height: 100vh;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0,.65);
    z-index: 1000;
    place-items: center;
    display: none;
    padding-top: 30px;
    opacity: 0;
    transition: all 2s ease-in;
}

 .overlay-inner{
    width: 60vmin;
    background-color: #fff;
    border: 1px solid #f39c12;
    border-radius: 4px;
    
}

.overlay-inner div img{
    width: 100%;
}
.overlay-inner .member-social-bookmark{
    display: flex;
    justify-content: center;
}


.overlay-inner .member-detail {
    -webkit-box-shadow: 0 0 1px;
    box-shadow: 0 0 1px var(--primary-color);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 30px 20px;
    transition: all .6s ease-out;
    text-align: left;
}


  .sub-title, .title{
      margin: 0;
  }
  .title{
      margin-bottom: 3px;
  }

.close-overlay{
    appearance: none;
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
}
.close-overlay:hover{
    border: 1px solid var(--primary-color);
    background: var(--primary-gradient);
    color: #fff;
}

.u-text{
    font-size: 16px;
}

.bio_gwx {
    margin-top: 5px;
    font-size: 12px;
    text-align:left;
    /* min-height: 650px; */
}

.bio_gwx p {
    /* color: white; */
}

.member-social-bookmark {
    background: #5d6b82 none repeat scroll 0 0;
    border-radius: 5px;
    margin-top: 25px;
    padding: 15px 0;
}

.member-social-bookmark .social-bookmark li a {
    background: rgba(255, 255, 255, 0.2) none repeat scroll 0 0;
    padding-top: 8px;
    color: var(--primary-color) !important;
}

.member-social-bookmark .social-bookmark li a:hover {
    background: var(--primary-gradient) none repeat scroll 0 0;
    color: #fff !important;
}

/* -----------------------------
    15. SERVICE TWO 
------------------------------ */
.service-area-two.set-bg .container{
    position: relative;
    z-index: 210;
}
.single-service-two {
    padding: 30px 20px 30px 100px;
    position: relative;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.service-icon-two {
    border-right: 1px solid #ddd;
    color: var(--primary-color);
    font-size: 30px;
    left: 0;
    position: absolute;
    text-align: center;
    width: 80px;
}

.single-service-two:hover {
    background: var(--primary-gradient);
    color: #fff;
}

.single-service-two:hover .service-icon-two,
.single-service-two:hover h4 {
    color: inherit;
}

/* ----------------------------
    16. SERVICE THREE
------------------------------ */

.single-service-three {
    border: 1px solid #eef2f4;
    -webkit-box-shadow: 0 0 10px #eef2f4;
    box-shadow: 0 0 10px #eef2f4;
    margin-bottom: 30px;
    padding: 30px 20px 30px 80px;
    position: relative;
}

.single-service-three h4 {
    color: #f39c12;
}

.service-icon-three {
    border-right: 1px solid #ddd;
    color: #f39c12;
    font-size: 30px;
    left: 0;
    position: absolute;
    text-align: center;
    width: 60px;
}

/*------------------------------
    17. CONTACT AREA
-------------------------------*/

.contact-address {
    margin-bottom: 50px;
}

.contact-address a {
    color: #585858;
}

.contact-address a:hover {
    color: #f39c12;
}

.contact-area .form-control {
    border-radius: 0;
    margin-bottom: 30px;
    min-height: 40px;
}

.contact-area button {
    background: var(--primary-gradient);
    border: none;
    border-radius: var(--button-radius);
    color: #fff;
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 12px 40px;
    text-transform: none;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
}

.contact-area button:hover {
    background: var(--secondary-gradient);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(118, 75, 162, 0.4);
    color: #fff;
}

.float-rght{
    float: right !important;
}

._mb{
    margin-bottom: 0 !important;
}

/*------------------------------
    18. FOOTER AREA
-------------------------------*/

.footer-area a, .footer-area p, .footer-area li{
    color: #dfeafc !important;
    font-family: 'Inter', sans-serif !important;
    position: relative;
    z-index: 9;
}

.footer-area::after {
    background: rgba(0, 0, 0, 0) url("img/footer-map-bg.png") no-repeat scroll center center / 90% auto;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.1;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

.footer-area {
    background: radial-gradient(circle at top left, rgba(31,94,255,0.18), transparent 38%), radial-gradient(circle at bottom right, rgba(208,51,38,0.14), transparent 30%), linear-gradient(135deg, #091a34 0%, #132b47 45%, #0f1d31 100%);
    position: relative;
    border-top: 1px solid rgba(255,255,255,0.06);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}

.footer-border {
    background: rgba(0, 0, 0, 0) url("img/footer-border.png") repeat-x scroll center center;
    height: 1px;
    margin-top: 30px;
}

.single-footer-widget {
    margin-bottom: 15px;
    overflow: hidden;
}

.single-footer-widget,
.single-footer-widget a {
    color: rgba(226,232,240,0.9);
}

.single-footer-widget a:hover {
    color: #fff;
}

.single-footer-widget h3 {
    font-size: 18px;
    letter-spacing: 0.5px;
    margin-top: 5px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    position: relative;
    font-weight: 700;
    color: #ffffff;
    text-shadow: 0 0 1px rgba(255,255,255,0.4);
}

.single-footer-widget h3::after {
    border-bottom: 2px solid linear-gradient(90deg, #d03326, #1f5eff);
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    width: 52px;
    background: linear-gradient(90deg, #d03326, #1f5eff);
    border-radius: 999px;
}

.single-footer-widget.footer-about ul {
    margin-top: 30px;
}

.single-footer-widget.footer-about ul li {
    margin-bottom: 5px;
}

.single-footer-widget.footer-about ul li i {
    border-right: 1px solid;
    margin-right: 5px;
    width: 20px;
}

.single-footer-widget.twitter-widget ul li {
    margin-bottom: 5px;
    padding-left: 30px;
    position: relative;
}

.single-footer-widget.twitter-widget ul li .twitter-icon {
    color: var(--primary-color);
    left: 0;
    position: absolute;
}

.single-footer-widget.list-widget ul li {
    letter-spacing: 1px;
    margin-bottom: 8px;
    position: relative;
}

.single-footer-widget.list-widget ul li::before {
    content: "\f0a4";
    display: inline-block;
    font-family: fontawesome;
    margin-right: 15px;
    color: #8ec5ff;
}

.single-footer-widget.instafeed-widget li {
    float: left;
    margin-bottom: 2%;
    margin-right: 2%;
    width: 31.33%;
}

.footer-widget .footer-text li,
.footer-widget .info-list li {
    margin-bottom: 12px;
    color: rgba(226,232,240,0.92);
}

.footer-widget .footer-text a,
.footer-widget .info-list a {
    color: rgba(226,232,240,0.92) !important;
}

.footer-widget .footer-text a:hover,
.footer-widget .info-list a:hover {
    color: #ffffff !important;
}

.footer-widget .info-list i {
    color: #8ec5ff;
    margin-right: 10px;
    font-size: 18px;
    vertical-align: middle;
}

.footer-socials li a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
    color: #fff !important;
    transition: all 0.35s ease;
}

.footer-socials li a:hover {
    background: linear-gradient(135deg, #1f5eff, #d03326);
    transform: translateY(-3px);
    box-shadow: 0 12px 26px rgba(31,94,255,.25);
}

.footer-bottom-area .footer-border {
    margin: 0;
}

.footer-copyright-area {
    padding: 10px 0;
}

.footer-copyright p {
    margin-bottom: 0;
    margin-top: 10px;
}

.footer-copyright a.footer-logo {
    border-bottom: 2px solid;
    display: block;
    margin-bottom: 5px;
    margin-right: 10px;
    max-width: 300px;
    padding-bottom: 10px;
}

.footer-copyright a {
    color: #ffffff;
}

.footer-social-bookmark .social-bookmark li a {
    background: rgba(255, 255, 255, 0.1) none repeat scroll 0 0;
    border-radius: 50%;
    color: #fff;
    display: inline-block;
    font-size: 14px;
    height: 30px;
    margin: 0 2px;
    padding-top: 3px;
    text-align: center;
    width: 30px;
}

.footer-social-bookmark .social-bookmark li a:hover {
    background: var(--primary-gradient);
    color: #fff;
    transform: translateY(-2px);
}




/*------------------------------
    19. SCROLL TO TOP
-------------------------------*/

a.scrolltotop {
    background: var(--primary-gradient);
    bottom: 20px;
    -webkit-box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
    color: #ffffff;
    display: none;
    font-size: 20px;
    height: 45px;
    padding-top: 5px;
    position: fixed;
    right: 20px;
    text-align: center;
    width: 45px;
    z-index: 1099;
    border-radius: 50%;
    transition: all 0.3s ease;
}

a.scrolltotop:hover {
    background: var(--secondary-gradient);
    transform: translateY(-3px);
    -webkit-box-shadow: 0 6px 20px rgba(118, 75, 162, 0.5);
    box-shadow: 0 6px 20px rgba(118, 75, 162, 0.5);
}

/*-----------------------------------
    20. WELCOME SLIDER AREA
-------------------------------------*/

.home-two .single-blog {
    margin-top: -244px;
}

.home-two .welcome-area {
    padding-bottom: 200px;
}

.home-two .blog-area.blog-bottom .single-blog {
    margin-top: 0;
}

.home-four .about-area.section-padding {
    padding-bottom: 50px;
}

.home-four .promo-top-area.section-padding {
    background: inherit;
    padding-bottom: 50px;
}

.home-four .service-bottom-area-bg {
    background: rgba(0, 0, 0, 0) url("img/service/service-area-bg-2.jpg") repeat scroll 0 0;
}

.top-area.single-page {
    height: 150px;
}

.single-page .top-area-bg::after {
    opacity: 0.7;
}

.single-page .welcome-text h2 {
    margin-bottom: 10px;
}

.page-location li {
    display: inline-block;
}

.page-location li a {
    color: #fff;
    display: block;
    padding: 0 10px;
}

/* ----------------------------------
    21. BLOG PAGE
------------------------------------- */

.blog-page .single-blog {
    border-radius: 0;
    margin-bottom: 50px;
}

.blog-page .single-blog .post-date {
    margin-bottom: 20px;
    margin-top: -10px;
}

.blog-page .single-blog .post-date a i {
    margin-right: 10px;
}

.blog-page .single-blog .post-date a:hover {
    color: #f39c12;
}

.blog-page .blog-image img {
    width: 100%;
}

.pagination li a {
    border-radius: 0;
    color: #666;
    padding: 10px 20px;
}

.pagination li a:hover,
.pagination li.active a,
.pagination li a:focus {
    background: #f39c12 none repeat scroll 0 0;
    color: #fff;
    border-color: #f39c12;
}

.single-sidebar-widget {
    -webkit-box-shadow: 0 3px 7px #ddd;
    box-shadow: 0 3px 7px #ddd;
    margin-bottom: 50px;
    padding: 20px;
}

.single-sidebar-widget h4::after {
    border-bottom: 1px dashed #f39c12;
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 50px;
}

.single-sidebar-widget h4 {
    margin-bottom: 30px;
    padding-bottom: 10px;
}

.widget_search form {
    border: 1px solid #ddd;
    height: 40px;
    position: relative;
    width: 100%;
}

.widget_search form input {
    border: 0 none;
    height: 100%;
    left: 0;
    padding: 8px 40px 8px 8px;
    position: absolute;
    top: 0;
    width: 100%;
}

.widget_search form button {
    background: #5d6b82 none repeat scroll 0 0;
    border: 0 none;
    color: #fff;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 50px;
}

.widget_search form button:hover,
.tagcloud a:hover {
    background: #f39c12 none repeat scroll 0 0;
    color: #fff;
    border-color: #f39c12;
}

.widget_categories li {
    margin: 5px 0;
    position: relative;
}

.widget_categories li::before {
    content: "\f105";
    display: inline-block;
    font-family: fontawesome;
    margin-right: 10px;
}

.single-sidebar-widget li a:hover {
    color: #f39c12;
}

.single-sidebar-widget {
    -webkit-box-shadow: 0 3px 7px #ddd;
    box-shadow: 0 3px 7px #ddd;
    margin-bottom: 50px;
    padding: 20px;
}

.widget_recent_entries li {
    margin-bottom: 15px;
    overflow: hidden;
}

.tagcloud a {
    border: 1px solid #ddd;
    display: inline-block;
    margin-bottom: 9px;
    margin-right: 5px;
    padding: 5px 10px;
    text-transform: capitalize;
}

blockquote {
    background: #f1f1f1 none repeat scroll 0 0;
    border: 0 none;
    font-size: 16px;
    font-style: italic;
    line-height: 1.7em;
    position: relative;
    padding: 20px 30px;
    text-transform: capitalize;
    z-index: 1;
}

blockquote::after,
blockquote::before {
    content: "\f10d";
    font-family: fontawesome;
    font-size: 50px;
    height: 50px;
    left: 0;
    line-height: 1;
    opacity: 0.3;
    position: absolute;
    top: 0;
    width: 50px;
    z-index: -1;
}

blockquote::after {
    top: -22px;
}

blockquote::before {
    bottom: 0;
    content: "\f10e";
    left: auto;
    right: 8px;
    top: auto;
}

.share-button,
.comments-area,
.comments-form-area {
    -webkit-box-shadow: 0 3px 7px #ddd;
    box-shadow: 0 3px 7px #ddd;
    margin-bottom: 50px;
    padding: 20px;
}

.comments-area h4,
.comments-form-area h4 {
    margin-bottom: 30px;
}

.comments-area ul li {
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
    padding-bottom: 20px;
    padding-left: 90px;
    position: relative;
}

.comments-area ul li:nth-child(2n) {
    margin-left: 80px;
}

.comments-area ul li .comments-author-thumb {
    height: 80px;
    left: 0;
    position: absolute;
    top: 0;
    width: 80px;
}

.half-width input {
    border: 1px solid #ddd;
    margin-bottom: 14px;
    padding: 10px;
    width: calc(50% - 10px);
}

.comment-form textarea {
    border: 1px solid #ddd;
    margin-bottom: 15px;
    padding: 10px;
    width: 100%;
}

.comment-form button {
    background: #5d6b82 none repeat scroll 0 0;
    border: 0 none;
    color: #fff;
    padding: 10px 20px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.comment-form button:hover {
    background: #f39c12 none repeat scroll 0 0;
}

/*-------------------------------
    22. SERVICE PAGE
-------------------------------*/

.service-image {
    margin-bottom: 40px;
}

.service-image img {
    width: 100%;
    height:fit-content;
}

.service-details-text {
    margin-bottom: 50px;
}

.service-menu h4 {
    background: #f39c12 none repeat scroll 0 0;
    color: #fff;
    margin-bottom: 0;
    padding: 10px;
    text-align: center;
}

.service-menu ul {
    border: 1px solid #ddd;
}

.service-menu > ul li {
    border-top: 1px dashed #ddd;
    display: block;
    margin-top: -1px;
}

.service-menu ul li a {
    display: block;
    padding: 10px 20px;
}

.service-menu ul li a i {
    float: right;
}

.service-menu .gwx_service_active a:hover {
    color: white;
}

.service-menu ul li a:hover {
    color: #f39c12;
}

.service-details-text p {
    font-style: italic;
    font-size: 16px;
}

.service-details-text ul {
    list-style: initial;
    margin-bottom: 20px;
    padding-left: 40px;
}


/* -----------------------------
    .   CAREER PAGE
-------------------------------*/

.hj-container{
    width: 900px;
    max-width: 100%;
    padding-right: 35px !important;
    padding-left: 35px !important;
    padding-bottom: 35px;
    background-color: rgba(251, 252, 255, .9);
    border:1px solid #edeef0;
    border-radius: 4px;
    box-shadow: 3px 4px 4px #d2d4d6;
    margin: 0 auto;
    margin-bottom: 10px;
    position: relative;
    z-index: 210;
}

.hj-container:last-of-type{
    margin-bottom: 50px;
}
.hire-header{
    padding: 10px 0;
    border-bottom: 1px solid #585858;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.hire-header h3 span{
    color: #f39c12 ;
}

.hire-header span{
    align-self: center;
    color:#3c4a62;
}

.hire-header h3{
    margin-bottom: 0;
}


.hire-list li{
   letter-spacing: 1.2px;
   font-size: 14px;
   list-style-type: disc;
   margin-left: 15px !important;
}

.job-header{
    padding: 10px 0;
    border-bottom: 1px solid #3c4a62;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.job-header h3{
    margin-bottom: 0;
}

.job-header h3 span{
    color: #f39c12 ;
}

.job-header span{
    align-self: center;
    color:#3c4a62;
}

.job-text{
    font-size: 14px;
    letter-spacing: 1px;
}
.job-text:last-child{
    font-size: 13px;
    font-style: italic;
    letter-spacing: 0px;
}



/* -----------------------------
        contact page 
------------------------------*/
.set-bg{
    padding-top: 60px;
    /* */
    background: url('img/about/box1.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    position: relative;
}
.contact-section{
    /* margin-bottom: 30px; */
    /* height: 100vh; */
    padding: 50px 20px;
}

.overlay{ 
	background: rgba(250, 251, 252, 0.7) !important; 
	width:100% !important; 
	height:100% !important; 
	position:absolute !important; 
	top:0 !important; 
	left: 0 !important;
    z-index: 10 !important;
    backdrop-filter: blur(2px);
}
.address-container{
    width: 1150px;
    max-width: 100%;
    max-height: 100%;
    border: 1px solid #eff1ff;
    margin: 10px auto;
    padding: 10px 25px;
    /* margin-top: 10%; */
    box-shadow: 3px 3px 3px rgba(124, 122, 151,),  5px 5px 3px rgba(124, 122, 151);
    background-color: #fff;
    position: relative;
    z-index: 101 !important;
}

.contact-container{
    display: flex;
    width: 1150px;
    max-width: 100%;
    max-height: 100%;
    border: 1px solid #eff1ff;
    margin: 10px auto;
    /* margin-top: 10%; */
    box-shadow: 3px 3px 3px rgba(124, 122, 151,),  5px 5px 3px rgba(124, 122, 151);
    border-radius: 8px;
    background-color: #fff;
    position: relative;
    z-index: 100 !important;
}

.contact-img img{
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    height: 100%;
}


.contact-form{
    padding: 20px 40px;
    width: 600px;
    max-width: 100%;
}

.cont-adr{
    margin-top: 50px;
}

.mt{
    margin-top: 35px;
}

.cont-adr p i{
    color: var(--primary-color);
}

.contact-form input{
    width: 100%;
    border: 1px solid #dbdbdb !important;
    border-radius: 4px;
    padding: 8px 15px !important;
    margin-top: 10px;
    font-size: 17px;
    color: #2a2747 !important;
}

.contact-form input::placeholder, .contact-form textarea::placeholder{
    font-size: 13px;
    font-style: italic;
    letter-spacing: 1.3px;
}

.contact-form textarea{
    justify-self: center !important;
    width: 100%;
    height: 100px;
    margin-top: 15px;
    padding: 10px 15px;
    border: 1px solid #dbdbdb;
    background-color: transparent !important;
    font-size: 17px;
    color: #2a2747;
    border-radius: 4px;
}

.contact-form textarea:focus{
    outline: none;
}

.contact-section h3 span, .locate-section  h3 span{
    color: var(--primary-color);
}

.contact-form input[type=submit]{
    background: var(--primary-gradient) !important ;
    width: 120px !important;
    height: 40px !important;
    text-transform: none;
    padding: 0 !important;
    text-align: center !important;
    color: rgb(255, 255, 255) !important;
    float: right;
    font-size: 14px !important;
    font-weight: 600;
    transition: all .3s ease;
    border: none;
    border-radius: var(--button-radius);
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
}

.contact-form input[type=submit]:hover{
    background: var(--secondary-gradient) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(118, 75, 162, 0.4);
}

.adr-link{
    text-decoration: underline !important;
    color: var(--primary-color);
}

.table{
    color: var(--primary-color);
}

.locate-section h3{
    margin-bottom: 30px;
}

/*------------------------------
    23. 404 ERROR PAGE
-------------------------------*/

.error-content img {
    margin-bottom: 40px;
}

.error-content h3 {}

.error-content h2,
.error-content h3 {
    letter-spacing: 1px;
    text-transform: capitalize;
}

.error-area .read-more {
    width: auto;
}






/* Wayra */
 .button--wayra {
	overflow: hidden;
	width: 245px;
	-webkit-transition: border-color 0.3s, color 0.3s;
	transition: border-color 0.3s, color 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--wayra::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 150%;
	height: 100%;
	/* background: #37474f; */
	z-index: -1;
	-webkit-transform: rotate3d(0, 0, 1, -45deg) translate3d(0, -3em, 0);
	transform: rotate3d(0, 0, 1, -45deg) translate3d(0, -3em, 0);
	-webkit-transform-origin: 0% 100%;
	transform-origin: 0% 100%;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s, background-color 0.3s;
	transition: transform 0.3s, opacity 0.3s, background-color 0.3s;
}
.button--wayra:hover {
	color: #fff;
	border-color: #ffff;
}
.button--wayra.button--inverted:hover {
	color: #f39c12;;
	border-color: #fff;
}
.button--wayra:hover::before {
	opacity: 1;
	background-color: #f39c12;;
	-webkit-transform: rotate3d(0, 0, 1, 0deg);
	transform: rotate3d(0, 0, 1, 0deg);
	-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
	transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.button--wayra.button--inverted:hover::before {
	background-color: #fff;
}


/* Common button styles */
 .button {
	/* float: left; */
	min-width: 150px;
	max-width: 250px;
	display: block;
    margin-top: -5px;
	/* margin: 1em; */
	padding: 0.5em 0.5em;
	/* border: none; */
	background: #ffff;
	color: inherit;
	vertical-align: middle;
	position: relative;
	z-index: 1;
	-webkit-backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
}
.button:focus {
	outline: none;
}
.button > span {
	vertical-align: middle;
}


input[type=text],input[type=email] {
    /* width: 100%; */
    padding: 15px 40px;
    /* margin: 8px 0; */
    display: inline-block;
    box-sizing: border-box;
    border: 2px solid #ccc;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    /* background: transparent; */
    outline: none;
  }


  input[type=submit] {
    /* width: 100%; */
     /* margin-left: ; */
    padding: 15px 23px;
    border-radius: 5px;
    /* margin: 8px 0; */
   
    background: #f39c12;
    /* outline: none; */
  }
  
  input[type=text]:focus {
    /* border: 2px solid #555; */
    background: #fff;
    color: #ccc;
  }

  .dp {
    display: inline-block;  
  }

/* ========================track iframe styling ======================== */
  .trackframe{
      width: 100%;
      height: 90vh;
      overflow-y: hidden;
      border-style: none;
      position: absolute;
      top: 110px;
      left: 0;
      z-index: 900;
      background-color: #fff;
  }
  

@media screen and (min-width: 1100px ) {
    .thin-border{
        border-right: 1px dashed #f39c12;
        height: 270px;
    }
}

  @media screen and (max-width: 1010px ) {
      .home-button a{
          top: 0px !important;
      }
  }



  @media screen and (max-width: 768px) {
      .contact-img , .contact-img img{
          display: none;
      }
      .contact-form{
        width: 650px;
      }

      .single-team{
        margin: 0 auto;
        margin-bottom: 35px;
      }
  }
  @media screen and (min-width: 755px) {
    .home-button{
        margin-left: 30px !important;
    }
}


  @media screen and (max-width: 754px) {
    .home-button{
        margin-bottom: 30px !important;
    }
}

  @media screen and (max-width: 560px) {
    .cont-adr h4{
        margin-top: 40px;
    }
}