/* ==========================================================================
   PT. Maharaja Aditama Sakti - brand layer on top of the Voltra template.
   Only additions and overrides live here; voltra/css/custom.css is untouched
   so the template can be updated independently.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Palette
   Both brand colours are sampled straight out of the Maharaja logo:

     orange  #F08000  the tiger, matched by --main-color below
     navy    #093957  the MAHARAJA wordmark

   --primary-color takes the wordmark navy a shade deeper, to #07324B, so the
   orange highlights that sit on dark sections clear 4.5:1 instead of landing
   right on the line. It replaces the warm near-black the old flame mark used.
   --text-color follows it as a desaturated blue grey, and --secondary-color
   stays a warm tint of the orange, which navy and cream carry well together.
   -------------------------------------------------------------------------- */
:root {
   --main-color: #F0800F;
   --primary-color: #07324B;
   --secondary-color: #FDF5EC;
   --text-color: #465561;
   --accent-color: #07324B;
   --mhas-line: rgba(7, 50, 75, 0.12);
}

/* The template tints the hero with its own dark green. Repointed at the brand
   navy so the slider matches the rest of the site. */
.sisf-e-home-slider .hero-slider-layout .hero-slide::before {
   background: linear-gradient(90deg, var(--primary-color) 0%, rgba(7, 50, 75, 0.4) 74.84%);
}

/* --------------------------------------------------------------------------
   2. Logo
   The Maharaja lockup is wide (roughly 9:4) and carries the wordmark beneath
   the tiger, so it is sized taller than a plain wordmark would be: below about
   50px the word MAHARAJA stops being readable.
   -------------------------------------------------------------------------- */
/* The template sizes its logo from an SVG's intrinsic box, so the lockup needs
   an explicit height that outranks the .sisf-header-logo-link rules. */
.sisf-header-logo-link.navbar-brand.mhas-brand img,
.mhas-brand img {
   height: 52px !important;
   width: auto !important;
   max-width: 260px;
}

.footer-logo img { height: 96px; width: auto; }

/* The lockup sits at the head of the nav row. The template only flexes that
   container below 1025px, so the desktop half is added here and the menu
   wrapper is told to take the space that is left. */
@media only screen and (min-width: 992px) {
   #sisf-page-header-inner > .container {
      display: flex;
      align-items: center;
      gap: 30px;
   }

   #sisf-page-header-inner > .container > .sisf-centered-header-wrapper {
      flex: 1 1 auto;
      min-width: 0;
   }
}

@media (max-width: 991px) {
   .sisf-header-logo-link.navbar-brand.mhas-brand img,
   .mhas-brand img { height: 40px !important; max-width: 200px; }
   .footer-logo img { height: 72px; }
}

/* --------------------------------------------------------------------------
   3. Language switcher
   Two flags, English and Indonesian, rendered twice: once in the orange top
   bar for desktop and once in the header row for phones, because the top bar
   is hidden below 768px. The active language stays fully opaque and boxed;
   the other one sits back until hovered.
   -------------------------------------------------------------------------- */
.mhas-lang {
   display: flex;
   align-items: center;
   gap: 4px;
}

.mhas-lang-option {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   padding: 4px 10px;
   border: 1px solid transparent;
   border-radius: 50px;
   font-family: var(--default-font);
   font-size: 13px;
   font-weight: 700;
   line-height: 1;
   color: var(--primary-color);
   opacity: 0.6;
   transition: all 0.3s ease;
}

/* The two flag files are drawn on different canvases, so they are cropped to
   one box and framed; the border also keeps the white halves of both flags
   from bleeding into whatever sits behind them. */
.mhas-lang-option img {
   width: 20px;
   height: 14px;
   object-fit: cover;
   border: 1px solid rgba(7, 50, 75, 0.25);
   border-radius: 2px;
   display: block;
}

.mhas-lang-option:hover,
.mhas-lang-option:focus-visible {
   color: var(--primary-color);
   opacity: 1;
}

.mhas-lang-option.is-active {
   opacity: 1;
   background-color: rgba(255, 255, 255, 0.75);
   border-color: rgba(7, 50, 75, 0.3);
}

/* The template hides the whole top bar below 1025px, which would take the
   switcher with it. Below that width the nav-row copy takes over, sitting
   beside the menu button; above it the top bar copy is the only one shown. */
.mhas-lang--inline { display: none; }

@media only screen and (max-width: 1024px) {
   .mhas-lang--inline {
      display: flex;
      margin-left: auto;
      margin-right: 14px;
   }
}

/* --------------------------------------------------------------------------
   4. Header top bar
   -------------------------------------------------------------------------- */
.sis-header-top .sisf-top-our-service span { color: var(--primary-color); }
.sis-header-top .sisf-top-our-service { font-weight: 700; }

@media (max-width: 1199px) {
   .sis-header-top .sisf-top-bar-widget .sisf-top-our-service { display: none; }
}

/* --------------------------------------------------------------------------
   5. Customer logo grid
   Client marks arrive as flat JPEG artwork on white, so each sits on a white
   card rather than being knocked out of the page background.
   -------------------------------------------------------------------------- */
.mhas-customer-card {
   background: #FFFFFF;
   border: 1px solid var(--mhas-line);
   padding: 24px 18px 18px;
   min-height: 168px;
   margin-bottom: 24px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   gap: 14px;
   transition: all 0.3s ease-in-out;
}

.mhas-customer-card:hover {
   border-color: var(--main-color);
   transform: translateY(-4px);
}

.mhas-customer-card figure {
   margin: 0;
   height: 76px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.mhas-customer-card figure img {
   max-height: 76px;
   max-width: 100%;
   width: auto;
   object-fit: contain;
   mix-blend-mode: multiply;
}

.mhas-customer-name {
   font-size: 13px;
   line-height: 18px;
   font-weight: 700;
   text-align: center;
   color: var(--primary-color);
}

/* --------------------------------------------------------------------------
   6. Capability cards
   -------------------------------------------------------------------------- */
.mhas-capability {
   background: var(--secondary-color);
   border: 1px solid var(--mhas-line);
   padding: 30px 26px;
   height: calc(100% - 24px);
   margin-bottom: 24px;
   transition: all 0.3s ease-in-out;
}

.mhas-capability:hover {
   background: var(--primary-color);
   border-color: var(--primary-color);
}

.mhas-capability:hover h3 { color: #FFFFFF; }

.mhas-capability figure { margin: 0; }
.mhas-capability figure img { height: 44px; width: auto; }

.mhas-capability h3 {
   font-size: 20px;
   line-height: 28px;
   margin: 0;
   transition: all 0.3s ease-in-out;
}

/* --------------------------------------------------------------------------
   7. Project work experiences
   Laid out to echo the company profile: photo strip, an orange description
   bar, then the labelled description table.
   -------------------------------------------------------------------------- */
.mhas-project-entry { margin-bottom: 70px; }
.mhas-project-entry.is-last { margin-bottom: 0; }

.mhas-project-gallery { margin-bottom: 26px; }

.mhas-project-gallery figure {
   margin: 0 0 24px;
   overflow: hidden;
   height: 260px;
}

.mhas-project-gallery figure img {
   height: 100%;
   width: 100%;
   object-fit: cover;
}

.mhas-project-bar {
   background: var(--main-color);
   padding: 10px 22px;
   border-radius: 6px 6px 0 0;
}

.mhas-project-bar span {
   font-family: var(--heading-font);
   font-size: 15px;
   font-weight: 800;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   color: var(--primary-color);
}

.mhas-project-table {
   margin: 0;
   border: 1px solid var(--mhas-line);
   border-top: none;
   border-radius: 0 0 6px 6px;
   background: #FFFFFF;
   overflow: hidden;
}

.mhas-project-table > div {
   display: flex;
   gap: 0;
   border-bottom: 1px solid var(--mhas-line);
}

.mhas-project-table > div:last-child { border-bottom: none; }

.mhas-project-table dt,
.mhas-project-table dd {
   margin: 0;
   padding: 14px 22px;
   font-size: 16px;
   line-height: 26px;
}

.mhas-project-table dt {
   flex: 0 0 220px;
   font-weight: 700;
   color: var(--primary-color);
   background: var(--secondary-color);
}

.mhas-project-table dd { flex: 1 1 auto; color: var(--text-color); }

@media (max-width: 767px) {
   .mhas-project-table > div { flex-direction: column; }
   .mhas-project-table dt { flex: 1 1 auto; padding-bottom: 4px; }
   .mhas-project-table dd { padding-top: 4px; }
   .mhas-project-gallery figure { height: 210px; }
}

.mhas-project-meta {
   font-size: 14px;
   font-weight: 700;
   color: var(--text-color);
}

/* --------------------------------------------------------------------------
   8. Core business list (about page)
   -------------------------------------------------------------------------- */
.mhas-core-list {
   list-style: none;
   margin: 0;
   padding: 0;
   counter-reset: none;
}

.mhas-core-list li {
   display: flex;
   align-items: flex-start;
   gap: 20px;
   padding: 22px 24px;
   background: #FFFFFF;
   border: 1px solid var(--mhas-line);
   border-radius: 8px;
   margin-bottom: 14px;
   transition: all 0.3s ease-in-out;
}

.mhas-core-list li:hover {
   border-color: var(--main-color);
   transform: translateX(6px);
}

.mhas-core-index {
   font-family: var(--heading-font);
   font-size: 22px;
   font-weight: 800;
   line-height: 30px;
}

.mhas-core-text {
   font-size: 17px;
   line-height: 30px;
   font-weight: 600;
   color: var(--primary-color);
}

/* --------------------------------------------------------------------------
   9. Mission quote
   -------------------------------------------------------------------------- */
.mhas-quote {
   position: relative;
   background: var(--primary-color);
   padding: 26px 28px 26px 64px;
}

.mhas-quote i {
   position: absolute;
   left: 26px;
   top: 28px;
   font-size: 22px;
   color: var(--main-color);
}

.mhas-quote p {
   font-family: var(--heading-font);
   font-size: 20px;
   line-height: 30px;
   font-weight: 700;
   color: #FFFFFF;
}

/* --------------------------------------------------------------------------
   10. Contact form and map
   -------------------------------------------------------------------------- */
.mhas-form-note {
   font-size: 13px;
   line-height: 20px;
   color: var(--text-color);
}

.sisf-bottom-contact-image figure { overflow: hidden; }

.mhas-map {
   overflow: hidden;
   border: 1px solid var(--mhas-line);
   line-height: 0;
}

.mhas-map iframe {
   width: 100%;
   height: 440px;
   border: 0;
   display: block;
}

@media (max-width: 767px) {
   .mhas-map iframe { height: 320px; }
}

/* --------------------------------------------------------------------------
   11. Counters strip
   -------------------------------------------------------------------------- */
.mhas-counters .sis-counter-item { margin-bottom: 20px; }
.mhas-counters .sis-counter-title h2 { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   12. Misc
   -------------------------------------------------------------------------- */
.sis-project-list-item .sis-status-title .sisf-m-status {
   display: inline-block;
   background: var(--main-color);
   color: var(--primary-color);
   font-weight: 800;
   font-size: 14px;
   padding: 6px 16px;
   border-radius: 50px;
}

.sisf-sis-contact-information .sisf-icon i {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 46px;
   height: 46px;
   border-radius: 50%;
   background: var(--main-color);
   color: var(--primary-color);
}

.sis-e-about-counter-bottom .sis-counter { font-size: 42px; }

/* --------------------------------------------------------------------------
   13. Contrast fixes introduced by the warmer accent colour
   The template pairs --main-color panels with --text-color body copy, which
   held up against its pale gold but not against MHAS orange.
   -------------------------------------------------------------------------- */
.sisf-e-about-bottom-content .sisf-e-inner h3,
.sisf-e-about-bottom-content .sisf-e-inner p,
.sisf-e-about-bottom-content .sisf-e-inner .sis-e-top-count span {
   color: var(--primary-color) !important;
}

.sis-e-about-counter-bottom .sisf-content,
.sis-e-about-counter-bottom .sis-counter,
.sis-e-about-counter-bottom .sisf-digit-label {
   color: var(--primary-color) !important;
}

/* --------------------------------------------------------------------------
   14. Template decoration removed
   The rotating badge artwork carries the template's own "Get Free Quote"
   wording, so it is dropped rather than shown with copy that is not ours.
   -------------------------------------------------------------------------- */
.sis-e-icon-spin { display: none !important; }

/* --------------------------------------------------------------------------
   15. Even card heights
   Project photographs come from the field at mixed aspect ratios, so the card
   images are cropped to one ratio rather than letting each card set its own
   height.
   -------------------------------------------------------------------------- */
.sis-project-grid-item .sis-project-image figure {
   margin: 0;
   aspect-ratio: 16 / 10;
   overflow: hidden;
}

.sis-project-grid-item .sis-project-image figure img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.sis-project-grid-item {
   height: 100%;
}

.sis-project-grid-item .sisf-e-inner {
   height: calc(100% - 30px);
   display: flex;
   flex-direction: column;
}

.sis-project-grid-item .sis-project-content { flex: 1 1 auto; display: flex; flex-direction: column; }
.sis-project-grid-item .sis-content--bottom { margin-top: auto !important; }

@supports not (aspect-ratio: 1) {
   .sis-project-grid-item .sis-project-image figure { height: 280px; }
}

/* --------------------------------------------------------------------------
   16. Judul slide hero kedua dan ketiga
   Hanya slide pertama yang memakai <h1> supaya setiap halaman punya satu h1.
   Slide berikutnya memakai <h2> dengan gaya h1 yang sama persis, mengikuti
   tiga breakpoint yang dipakai .sis-section-title h1 pada template.
   -------------------------------------------------------------------------- */
.sis-section-title h2.mhas-hero-title {
   color: var(--primary-color);
   font-size: 64px;
   font-weight: 800;
   line-height: 80px;
   text-transform: none;
   letter-spacing: -1%;
   margin-bottom: 30px;
}

.sis-section-title h2.mhas-hero-title.text-white { color: var(--white-color); }

@media only screen and (max-width: 1199px) {
   .sis-section-title h2.mhas-hero-title {
      font-size: 30px;
      line-height: normal;
   }
}

@media only screen and (max-width: 991px) {
   .sis-section-title h2.mhas-hero-title {
      font-size: 25px;
      line-height: 35px;
      margin-bottom: 25px;
   }
}

/* --------------------------------------------------------------------------
   17. Kartu layanan
   Foto lapangan datang dengan komposisi yang berbeda-beda, sehingga gambar
   kartu dipotong ke satu rasio lanskap agar tinggi kartu seragam dan bagian
   foto tidak mendominasi seluruh kartu.
   -------------------------------------------------------------------------- */
.sisf-sis-e-service-list.sisf-e-page-list {
   height: 100%;
}

.sisf-sis-e-service-list.sisf-e-page-list .sisf-e-inner {
   height: calc(100% - 30px);
   display: flex;
   flex-direction: column;
}

/* Mendorong gambar ke dasar kartu supaya seluruh foto satu baris sejajar
   walaupun panjang teksnya berbeda. */
.sisf-sis-e-service-list.sisf-e-page-list .sisf-e-content-bottom {
   flex: 1 1 auto;
}

.sisf-sis-e-service-list.sisf-e-page-list .sisf-service-icon-image {
   margin-top: 24px;
}

.sisf-sis-e-service-list.sisf-e-page-list .sisf-service-icon-image figure {
   margin: 0;
   aspect-ratio: 16 / 9;
   border-radius: 8px;
   overflow: hidden;
}

.sisf-sis-e-service-list.sisf-e-page-list .sisf-service-icon-image figure img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
}

@supports not (aspect-ratio: 1) {
   .sisf-sis-e-service-list.sisf-e-page-list .sisf-service-icon-image figure { height: 220px; }
}

/* --------------------------------------------------------------------------
   18. Lapisan gelap banner halaman
   Foto banner terang dan berwarna-warni, sehingga menu putih di atasnya dan
   judul halaman ikut tenggelam. Lapisan .sisf-page-title sudah menutup satu
   banner penuh dan berada di bawah header, jadi gradasi dipasang di situ:
   paling pekat di tepi atas untuk melindungi menu, lalu melandai dan tetap
   cukup gelap di area judul dan breadcrumb.
   -------------------------------------------------------------------------- */
.sisf-banner .sisf-page-title {
   background: linear-gradient(180deg,
      rgba(7, 50, 75, 0.82) 0%,
      rgba(7, 50, 75, 0.55) 22%,
      rgba(7, 50, 75, 0.45) 100%);
}

/* --------------------------------------------------------------------------
   19. Main menu density
   The menu carries seven items next to the contact button, and the Indonesian
   labels are the longer pair. Below the 1400px container the spacing is
   tightened so the row never wraps under the logo.
   -------------------------------------------------------------------------- */
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
   .sis-main-menu ul li a { padding: 0 11px !important; font-size: 15px; }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
   .sis-main-menu ul li a { padding: 0 8px !important; font-size: 14px; }
   .sisf-widget-holder.sisf--two .header-btn .sis-btn-default { padding: 12px 18px; font-size: 14px; }
}

/* --------------------------------------------------------------------------
   20. Why Choose Us centre photo
   The field photo is far taller than the two text columns it sits between, and
   its subject sits low in the frame, so the middle column read as pushed down
   even though the row centres all three. The photo is cropped to a fixed
   portrait box, its default figure margin removed so the box centres exactly,
   and the crop is anchored on the engineer rather than on the sky above him.
   -------------------------------------------------------------------------- */
.sis-why-choose-us-image-center figure {
   margin: 0;
   aspect-ratio: 2 / 3;
   overflow: hidden;
}

.sis-why-choose-us-image-center figure img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center 25%;
}

@supports not (aspect-ratio: 1) {
   .sis-why-choose-us-image-center figure { height: 620px; }
}

/* --------------------------------------------------------------------------
   21. About page: director message, values, leadership
   The two leadership photos are designed cards that already carry the name
   and title, so they are cropped as little as possible; the names are still
   repeated as real text underneath for screen readers and search engines.
   -------------------------------------------------------------------------- */
.mhas-message-photo figure {
   margin: 0;
   aspect-ratio: 4 / 5;
   overflow: hidden;
}

.mhas-message-photo figure img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
}

.mhas-signature {
   margin-top: 28px;
   padding-top: 22px;
   border-top: 1px solid var(--mhas-line);
}

.mhas-signature-name {
   display: block;
   font-family: var(--heading-font);
   font-size: 22px;
   font-weight: 800;
   line-height: 30px;
   color: var(--primary-color);
}

.mhas-signature-role {
   display: block;
   font-weight: 600;
   color: var(--text-color);
}

.mhas-value {
   background: var(--secondary-color);
   border: 1px solid var(--mhas-line);
   padding: 30px 26px;
   height: calc(100% - 24px);
   margin-bottom: 24px;
   transition: all 0.3s ease-in-out;
}

.mhas-value:hover {
   border-color: var(--main-color);
   transform: translateY(-6px);
}

.mhas-value-icon {
   width: 52px;
   height: 52px;
   border-radius: 10px;
   background-color: var(--main-color);
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 20px;
}

.mhas-value-icon figure { margin: 0; line-height: 0; }
.mhas-value-icon img { width: 28px; height: auto; }

.mhas-value h3 {
   font-size: 20px;
   line-height: 28px;
   margin: 0 0 10px;
}

.mhas-value p { margin: 0; }

.mhas-leader-card {
   text-align: center;
   margin-bottom: 30px;
}

.mhas-leader-card figure {
   margin: 0 0 18px;
   aspect-ratio: 4 / 5;
   overflow: hidden;
}

.mhas-leader-card figure img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center top;
}

.mhas-leader-name {
   font-family: var(--heading-font);
   font-size: 24px;
   font-weight: 800;
   line-height: 32px;
   color: var(--primary-color);
   margin: 0;
}

.mhas-leader-role {
   display: block;
   margin-top: 4px;
   font-weight: 600;
   color: var(--main-color);
}

@supports not (aspect-ratio: 1) {
   .mhas-message-photo figure { height: 520px; }
   .mhas-leader-card figure { height: 520px; }
}

/* --------------------------------------------------------------------------
   22. Build credit
   Runs on after the client's copyright on the same line, kept a shade quieter
   than it so the company's own notice still leads.
   -------------------------------------------------------------------------- */
.mhas-credit {
   margin-left: 8px;
   color: rgba(255, 255, 255, 0.55);
}

.mhas-credit a {
   color: rgba(255, 255, 255, 0.8);
   transition: color 0.3s ease-in-out;
}

.mhas-credit a:hover,
.mhas-credit a:focus-visible {
   color: var(--main-color);
}

/* --------------------------------------------------------------------------
   23. Page banner box
   The banner photo is 16:9, but the title band was designed around a 2.5:1
   strip. Left to its own ratio the banner would grow from roughly 770px to
   1080px tall on a full screen and swallow the viewport, so the box is pinned
   and the photo cropped into it instead.
   -------------------------------------------------------------------------- */
.sisf-banner .banner-img figure {
   margin: 0;
   aspect-ratio: 5 / 2;
   overflow: hidden;
}

.sisf-banner .banner-img figure img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
}

@media only screen and (max-width: 767px) {
   .sisf-banner .banner-img figure { aspect-ratio: 2 / 1; }
}

@supports not (aspect-ratio: 1) {
   .sisf-banner .banner-img figure { height: 500px; }
}

/* --------------------------------------------------------------------------
   24. Footer top row
   The social links are a horizontal row, but the template still carries the
   stacked-list margin under each one, which left a gap below the logo block.
   -------------------------------------------------------------------------- */
.footer-social-icons-link.page li a {
   margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   25. Footer bottom row
   The scrolling band that used to sit under the copyright is gone, so the
   copyright line now closes the page and carries the bottom spacing itself.
   -------------------------------------------------------------------------- */
.sisf-page-footer-bottom-area .footer-copyright {
   padding-bottom: 30px;
}

@media only screen and (max-width: 991px) {
   .sisf-page-footer-bottom-area .footer-copyright {
      padding-bottom: 24px;
   }
}

/* --------------------------------------------------------------------------
   26. Footer brand block
   The template renders the social links as bare 16px glyphs sitting almost on
   top of each other, which is both cramped and far too small a tap target.
   They become 42px outlined circles that fill with the brand orange on hover.
   -------------------------------------------------------------------------- */
.footer-social-icons-link.page ul {
   gap: 12px;
}

.footer-social-icons-link.page li a {
   width: 42px;
   height: 42px;
   gap: 0;
   margin-bottom: 0;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   border: 1px solid rgba(255, 255, 255, 0.22);
   border-radius: 50%;
   transition: all 0.3s ease-in-out;
}

.footer-social-icons-link.page li a:hover,
.footer-social-icons-link.page li a:focus-visible {
   background-color: var(--main-color);
   border-color: var(--main-color);
}

/* The template forces the glyph orange on hover, which would vanish against
   the orange fill. */
.footer-social-icons-link.page li a i,
.footer-social-icons-link.page li a:hover i {
   font-size: 17px;
   color: var(--white-color) !important;
}

/* --------------------------------------------------------------------------
   27. Hero height on small screens
   The template drops the hero to 550-700px on phones, but every one of those
   rules is keyed to .home-page or .sisf-home-page, classes this build never
   uses. So .sisf-e-home-slider kept its 800px desktop minimum at every width,
   and since the slide aligns its content to the bottom, the leftover height
   piled up as empty photo between the header and the first line of text.
   -------------------------------------------------------------------------- */
@media only screen and (max-width: 991px) {
   .sisf-e-home-slider .hero-slider-layout .hero-slide {
      min-height: 620px;
   }
}

/* Below 768px the slide is left to take the height of its own content, so the
   gap cannot come back when a slide or a translation runs longer. */
@media only screen and (max-width: 767px) {
   .sisf-e-home-slider .hero-slider-layout .hero-slide {
      min-height: 0;
      padding-top: 40px;
      padding-bottom: 40px;
   }
}