/*
Theme Name: ALO789 Flatsome Child
Description: Local Flatsome implementation of the mdsslot.co reference.
Author: Local Development
Template: flatsome
Version: 1.0.0
*/

:root {
  --alo-orange: #ff8818;
  --alo-yellow: #ffc107;
  --alo-footer: #233547;
}

body {
  background: #ebebeb;
  color: #000;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif !important;
  font-size: 17px;
}

.container-width,
.full-width .ubermenu-nav,
.container,
.row {
  max-width: 1210px;
}

#logo { margin: 0; }
.header-bg-color,
.header-bottom { background: #000 !important; }
.header-main .header-inner { align-items: center; }
.header-main .header-nav,
.header-main .header-block,
.header-main .header-block > div { width: 100%; }
.header-main .header-block { margin: 0; }

.mds-header-promo {
  position: relative;
  width: 100%;
  padding-top: 10px;
  text-align: center;
}
.mds-header-actions {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: 12px;
}
#header .mds-header-actions .button {
  min-width: 150px;
  margin: 0 0 12px;
  padding: 10px 20px;
  border: 0;
  border-radius: 5px;
  color: #000 !important;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
  text-transform: none;
}
.mds-header-actions .button.primary { background: var(--alo-yellow); }
.mds-header-actions .button.white { background: #fff; }
.mds-header-promo img {
  display: block;
  width: 100%;
  height: 176px;
  object-fit: cover;
  object-position: center;
}

.header-bottom-nav > li > a {
  color: #fff !important;
  font-size: 16px;
  font-weight: 700;
  line-height: 16px;
  text-transform: uppercase;
}
.header-bottom-nav > li > a:hover,
.header-bottom-nav > li.active > a { color: #eeee22 !important; }

.page-hero img {
  display: block;
  width: 100%;
  height: auto;
  border: 0;
}
.marquee {
  overflow: hidden;
  background: #fff;
  white-space: nowrap;
}
.marquee-content {
  display: inline-block;
  padding: 9px 0 9px 100%;
  animation: alo-scroll 50s linear infinite;
}
.marquee-content:hover { animation-play-state: paused; }
@keyframes alo-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

.page-wrapper { padding-bottom: 0 !important; }
.page-right-sidebar > .row { padding-top: 30px; }
.page-right-sidebar #content {
  padding-right: 15px;
}
.page-inner {
  background: #fff;
  padding: 30px;
}
.page-inner h1 {
  color: var(--alo-orange);
  font-size: 35px;
  text-align: center;
}
.page-inner h2 {
  color: var(--alo-orange);
  font-size: 30px;
}
.page-inner h3 { color: var(--alo-orange); }
.page-inner blockquote {
  border-left: 3px solid var(--alo-orange);
  background: #fff9f1;
}
.page-inner a { text-decoration: underline; }
.page-inner ul { margin: 0 0 1.5em 3em; }
.page-inner figure { max-width: 100%; }
.page-inner .wp-caption-text {
  background: #f2f2f2;
  color: #555;
  font-size: 14px;
  font-style: italic;
  padding: 7px 10px;
  text-align: center;
}
.page-inner .accordion-title {
  color: #222;
  font-weight: 700;
}

.widget-area {
  background: #fff;
  padding: 40px;
}
.widget-area .widget-title {
  display: block;
  margin-bottom: 20px;
  color: var(--alo-orange);
  font-size: 30px;
  font-weight: 700;
}
.widget-area .is-divider { display: none; }
.recent-blog-posts-li { border: 0 !important; font-size: 15px; }
.recent-blog-posts { padding: 5px 0 0; }
.recent-blog-posts .mr-half .badge { width: 70px; height: 70px; }
.recent-blog-posts a { text-decoration: underline; }

.footer-1 { background: var(--alo-footer) !important; padding: 40px 0; }
#footer .widget-title {
  display: block;
  margin-bottom: 30px;
  font-weight: 700;
}
#footer .is-divider { display: none; }
#footer a { color: #ffc800; text-decoration: underline; }
#footer li { border: 0; }
#footer .footer-logo { width: 185px; margin-bottom: 20px; }
.absolute-footer { background: #fff !important; }
.copyright-footer,
.copyright-footer strong { color: #000; font-weight: 400; }

.alo-floating {
  position: fixed;
  right: 4%;
  z-index: 999;
  display: block;
  width: 100px;
}
.alo-floating.gift { bottom: 165px; }
.alo-floating.games { bottom: 55px; }
.alo-floating img { width: 100%; height: auto; }

@media (max-width: 849px) {
  .header-wrapper { padding: 15px 20px 0; }
  #logo { width: 150px !important; }
  .header-main .header-inner { min-height: 80px; }
  .header-bottom { min-height: 190px; }
  .header-bottom .header-block { width: 100%; }
  .mds-header-promo { padding-top: 0; }
  .mds-header-promo img { height: auto; max-height: 135px; object-fit: cover; }
  .mds-header-actions .button { min-width: 135px !important; padding: 8px 10px !important; }
  .page-right-sidebar > .row { padding-top: 15px; }
  .page-right-sidebar #content,
  .home .page-wrapper .large-4.col { padding-left: 0; padding-right: 0; }
  .page-inner { padding: 20px 18px; }
  .page-inner h1 { font-size: 28px; }
  .page-inner h2 { font-size: 25px; }
  .widget-area { padding: 25px 20px; }
  .alo-floating { width: 72px; right: 8px; }
  .alo-floating.gift { bottom: 112px; }
  .alo-floating.games { bottom: 32px; }
}

@media (max-width: 549px) {
  body { font-size: 16px; }
  .header-wrapper { padding: 10px 12px 0; }
  .mds-header-actions { gap: 7px; }
  #header .mds-header-actions .button { min-width: 120px !important; font-size: 13px; }
}
