/* Base */
html { scroll-behavior: smooth; }
body {}

.scroll-downs {
    bottom: 25px;
    color: #3555ff;
    display: block;
    justify-content: center;
    height: auto;
    left: 46%;
    right: auto;
    opacity: 1;
    position: absolute;
    width: 45px;
    z-index: 100;
    margin-bottom: 150px !important;
    /* removed redundant scroll-behavior */
}

.mousey {
    width: 3px;
    padding: 10px 15px;
    height: 35px;
    border: 2px solid #27310a;
    border-radius: 25px;
    opacity: 0.75;
    box-sizing: content-box;
}
.scroller {
    width: 3px;
    height: 12px;
    border-radius: 25%;
    background-color: #27310a;
    animation: scroll 2.2s cubic-bezier(.15,.41,.69,.94) infinite;
}
@keyframes scroll {
    0% { opacity: 0; }
    10% { transform: translateY(0); opacity: 1; }
    100% { transform: translateY(15px); opacity: 0; }
}

/* Slider / Swiper */
.slider .swiper-slide a {
    display: inline-block;
    color: #213154;
    padding: 0 44px;
    font-weight: 600;
    border: 1px solid #fdbe01 !important;
}
.slider .swiper-slide h6 { font-weight: 400 !important; }

.second-image { background-color: #405089 !important; opacity: 0.5 !important; }
.member figcaption { background: #405089; opacity: 0.9 !important; }

/* Flip boxes */
.flip-box-front {
    background-image: linear-gradient(to right top, #46b431, #7bbc1a, #a9c200, #d4c600, #ffc810);
    border: 1px solid #95bf0b !important;
}
.flip-box .flip-box-back {
    background-image: linear-gradient(to right top, #46b431, #7bbc1a, #a9c200, #d4c600, #ffc810);
    border: 1px solid #95bf0b !important;
}

/* Branding / header */
.top-logo a img { height: 58px !important; }

.swiper-slide-calc { color: #fff; }
.swiper-slide-calc p { max-width: 600px; display: inline-block; margin-bottom: 40px; }
.swiper-slide-calc a {
    display: inline-block;
    height: 60px !important;
    line-height: 58px;
    border: 1px solid #fff;
    color: #fff;
    padding: 0 44px !important;
    font-weight: 600;
}
.swiper-slide-calc a span {
    width: 18px; height: 48px; float: right; margin-left: -10px; margin-top: 5px;
    background: #282f4a; transform: skewX(-20deg); position: relative; z-index: -1;
}
.swiper-slide-calc a:hover {
    color: #fff !important; text-decoration: none; border-color: orange; background: #161c32 !important;
}

/* Content colors */
.featured-services .content-wrapper .container .content-box p { color: #0a144a !important; }
.home-title-tagline { margin-top: 30px; color: #ffffff; }

.page-header { padding-top: 90px; padding-bottom: 10px; }

.video-size { height: 105%; }
.side-image-content .video video { margin-left: -10% !important; opacity: 1 !important; }

/* Buttons */
.btn-group-lg > .btn-lg { border: 0 !important; }
.btn-custom-dark { background-color: #fff !important; }

.button_slide {
    color: #24355a !important;
    border: 0;
    display: inline-block;
    letter-spacing: 1px;
    box-shadow: inset 0 0 0 0 #ffc810;
    transition: ease-out 0.4s;
}
.slide_right:hover,
.slide_right:active {
    box-shadow: inset 400px 0 0 0 #ffc810;
    color: #27310b !important;
}
.btn-custom {
    background-color: #fff !important;
    color: #0a1954 !important;
    height: 60px !important;
    padding: 0 40px;
    font-weight: 600;
    -webkit-appearance: button;
    overflow: visible;
    margin: 5px 0 !important;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    border: 1px solid #262d57 !important; /* keep one border color */
}

/* Headings */
.container h3 { color: #27310a !important; }

.icon-content-box .content-box span,
.flip-box-back h4,
.flip-box-back p { color: #27310a; }
.flip-box-back h4 { color: #27310a !important; }

/* Footer */
.footer { background: #ffc810; margin-top: 10px; }
.footer .content-wrapper { margin-top: 30px; }
.footer .content-wrapper p,
.footer .content-wrapper .footer-menu li a,
.footer .content-wrapper .contact-box,
.footer .content-wrapper .contact-box ul li a,
.footer .sub-footer { color: #24355a; }

/* Nav & z-index layering */
.sandwich-menu { position: fixed; z-index: 900; } /* below navbar */
.header, .navbar { position: relative; z-index: 1000; }
.navbar .dropdown, .navbar .dropdown-menu { position: absolute; z-index: 1050; }
.content-box, .card { position: relative; z-index: 1; }
.navbar .container { overflow: visible; }

/* Tables */
.tableFixHead { overflow: auto; height: 500px; }
.tableFixHead thead th { position: sticky; top: 0; z-index: 1; }
table { border-collapse: collapse; width: 100%; }
th, td { padding: 8px 16px; }
th { background: #fff; }

/* Hero title */
.hero-title span {
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}
.hero-title .easy { color: #ffc000 !important; }
.hero-title .ops { color: #48b62f !important; }

/* Cards & images */
.image-content-box .col-12 { padding: 10px !important; }
.content-box.card { transition: transform .15s ease, box-shadow .15s ease !important; }
.content-box.card:hover { transform: translateY(-2px) !important; }
.content-box .card-img-top img { transition: transform .25s ease; }
.content-box.card:hover .card-img-top img { transform: scale(1.02); }

/* Sections / overlays */
.dtr-section { position: relative; }
.dtr-section-with-bg { background-position: center center; background-repeat: no-repeat; background-size: cover; }
.dtr-overlay { position: absolute; inset: 0; z-index: 1; }
.dtr-overlay-green { background-color: rgba(252,196,4,.9); }
.dtr-overlay-content { position: relative; z-index: 10; }
.hero-section-top-padding { padding-top: 95px; }
.hero-svg-bg-absolute { position: absolute; left: 0; bottom: 0; z-index: 9; }

.header .topbar { width: 100%; height: 70px; }
.header .navbar { width: 100%; max-width: 2000px; margin: 0 auto; }

/* Brand utilities */
.brand-easy { color: #ffc000; }
.brand-ops { color: #48b62f; }

/* Accessibility (if not using Bootstrap’s helper) */
.visually-hidden {
    position: absolute !important; width: 1px !important; height: 1px !important;
    padding: 0 !important; margin: -1px !important; overflow: hidden !important;
    clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important;
}

/* Calendly tweak */
.calendly-badge-widget { bottom: 70px !important; }
.calendly-badge-widget .calendly-badge-content { border-radius: 5px !important; }

/* Responsive */
@media (max-width: 991px) {
    .video-size { width: 100%; height: auto; }
    .side-image-content .video video { margin-left: 0 !important; }
    .sandwich-menu .nav-menu { margin-bottom: 300px; }
    .hero-section-top-padding { padding-top: 130px; }
}

@media (max-width: 767px) {
    .home-title-tagline { margin-top: 250px; }
    .bg-image { background-position: 40% !important; }
    .slide-inner1 {
        background-image: linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.8)), url("../images/s1easyops-01ec5ed9f10aefe29540350c6a781b12.png") !important;
    }
    .slide-inner2 {
        background-image: linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.8)), url("../images/s3easyops-d11e49db26d4b1f6175396ec8987543b.png") !important;
    }
    .slide-inner3 {
        background-image: linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.8)), url("../images/s2easyops-90b9afe66442d81e6699bfe90c409063.png") !important;
    }
    .slider .swiper-slide a {
        background-image: linear-gradient(to right, rgba(255,255,255,.3), rgba(255,255,255,.5)) !important;
    }
    .mousey, .scroller { display: none; }
}

@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
    .sandwich-menu {
        width: 40vw;
    }
}

.sandwich-menu {
    z-index: 1050;
}
