.responsive_page_frame {
  position: relative;
}

body.movescrolltocontent .responsive_page_frame {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
}

body.overflow_hidden,
body.overflow_hidden .responsive_page_frame {
  overflow: hidden;
  position: relative;
}

html.responsive {
  height: 100%;
}

html.responsive body {
  min-height: 100%;
  height: auto;
  position: relative;
}

html.responsive body.movescrolltocontent {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.responsive_page_content {
}

.partner_events .responsive_page_content {
  height: 100vh;
}

.responsive_page_menu_ctn {
  display: none;
  position: fixed;
  top: 0;
  bottom: 0;
  overflow: hidden;

  background: black;

  z-index: 30;
  width: 280px;
}

.responsive_page_frame:not(.in_menu_drag) .responsive_page_menu_ctn {
  transition: left 0.5s, right 0.5s;
}

.responsive_page_menu_ctn.mainmenu {
  inset-inline-start: -280px;
}

.responsive_page_menu_ctn.localmenu {
  inset-inline-end: -280px;
}

.responsive_page_frame.mainmenu_active .responsive_page_menu_ctn.mainmenu,
.responsive_page_frame.localmenu_active .responsive_page_menu_ctn.localmenu {
  box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.75);
}

.responsive_page_frame.mainmenu_active .responsive_page_menu_ctn.mainmenu {
  inset-inline-start: 0;
}

.responsive_page_frame.localmenu_active .responsive_page_menu_ctn.localmenu {
  inset-inline-end: 0;
}

.responsive_page_content_overlay {
  visibility: hidden;
  opacity: 0;
  background: rgba(0, 0, 0, 0.4);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 25; /* on top of page and header */

  transition: visibility 0.5s, opacity 0.5s;
}

.responsive_page_frame.mainmenu_active .responsive_page_content_overlay,
.responsive_page_frame.localmenu_active .responsive_page_content_overlay {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s, opacity 0.5s;
}

.responsive_page_menu {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.mainmenu_contents {
  background: #171a21;
  font-size: 18px;
  position: relative;
  min-height: 100%;
}

.mainmenu_contents_items {
  font-family: "Motiva Sans", Sans-serif;
  font-weight: normal; /* normal */

  font-weight: 700;
}

.responsive_page_menu_ctn.localmenu .responsive_page_menu {
  background: #171a21;
}

.responsive_page_menu_ctn.localmenu .localmenu_subarea {
  background: #192533;
  border-radius: 3px;
  padding: 10px;
  color: #bdbdbd;
  margin-bottom: 16px;
}

.responsive_page_menu_ctn.localmenu .localmenu_subarea .subheader {
  font-size: 1.2em;
  margin-bottom: 8px;
}

.submenuitem {
  font-weight: 400;
}

.mainmenu_contents .menuitem,
.mainmenu_contents .submenuitem,
.notification_submenu .popup_menu_item {
  display: block;
  padding: 0 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 3em;

  text-decoration: none;

  cursor: pointer;
}

.mainmenu_contents .menuitem {
  position: relative;
  color: #bdbdbd;
  background: #171a21;
  transition: background 0.25s, color 0.25s;
  font-size: 1em;

  &:hover {
    color: white;
    background: #30353f;
  }
}

.mainmenu_contents .menuitem.username {
  max-width: none;
}

.mainmenu_contents .menuitem,
.menuitem_submenu_wrapper .inner_borders,
.mainmenu .minor_menu_items {
  border-top: 1px solid #2f3138;
  border-bottom: 1px solid #000000;
}
.mainmenu .minor_menu_items {
  border-bottom: none;
  padding-top: 6px;
}

.menuitem_submenu_wrapper.active .submenuitem {
  color: #dcdedf;
}

.mainmenu_contents .menuitem.submenu_active {
  background-color: #3d4450;
  color: #ffffff;
  border-bottom: none;
}

.mainmenu_contents .menuitem .chevron {
  /* background-image: url( 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAAAwCAYAAACG5f33AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABFxJREFUeNrkmg9klGEcx5/dMY4Y44hjxIgxRpSy7NwspSmNWZayGGmKFJGylCJSmlJMKctiylKa5aZpSmmMMWIcY4xxjGPEmPX72ffN23Z7732f3/Pe+97tx9dtd/e87/N+7n1+/563Ym1tTbmx8fHxLnq5QzqYSqXmbO+rMrMoaZDUz5dX6MsRl/A66OU5KUFK0/9xVb42QOLr/UTaLwZIsI7hoFG8VUsapferyhDeI1In/o7xdZL2Og2ocFrCBKkFv0Rlvo9JR0grZQKvl3Qrz/tLpCRpxhNAgteEXyDmcNL3pHbSaonDu0B67PB5ln0/adYVQILHt+0X0g4XJ39G6ilheJ0IGoVsAXdixhEgwWugl68kLz7uHulaCcJj/z5s8++FbJ50ADA3AyR4dYCnE2Uvkp6UELwU/HvM47gMlvPifwAJXi3gJQSTOkV6UwLw9sBF6WYSvwFxKbJhjc8LJ/aSdDjk8HYjOErSMAaYy7eE+aDpQrlPAfsDZzsZQni8un4JV9kIqc1K3/IFkWos5XrBSRxzp4CM/foPFAK6NkZqtee+W6UxcUCsE5yMXcI+e8QK0KpwPQ2CY3wnHcIKc5VIJ3BSyS+WQdjPBggvBrfUKDjGJODlvJZyNfTyjVQjPHkzaTkAeFyCvkW+p2vTcEc5z7WwwfQmqLp50NYc0I22SacVVOGmHyhMsC0bQp5YrLr5Kem80P38S5hFAG0lHief1YJJFatu5sbvdcH4TSWbGKCtyZAWJqG3STd9hHeZ9ECYPfCdN+fmy54AAmIjIMYEk+zB3WjaulAN6dqWbStjAAFRtxD3s24+gYgbFcBr9pr8awEExKNoBVVqTngFWf2Yoc7KqGAuOcCb8jpQGyAgSn91E3Wzl+bvVnNgeD91BosAAiLnWQPCpZNEzuXV6gEvLoDH+emE7vVHDCwf9mPdwiI/rZGo78KyjQtcSJsEnimAbK/Uekda1xKA6BbGTk3odngnSZ+lF24KIBu3868Ixte5jOxWz1K3ycGV0Bm1vqOowgSQ7aEwSeaA8MEhmlqdFUmvshtlpQojQKvSuC8Y34JkOJqnszKsZN3yc3A3KswA2a6S+gTjObLbN7qjiPSS/RZ2L/2mL9QvgGyXSC8E47mT0mvrrHQIjnUD7sW4mcgDnT6OYjmeFpyC04wmwfi7AOiL+XkHWhHvLOmd4BgSeH1+wisGQAsiNw5GVHGtH25ElTpAe9Y/VqTzvUbEVeUC0IJ4XK1vD/ppQ3AbqtwA2ot3v55a+IgqY7VcAbLx9ibvsU4bPi7Xte2qyDt/QQBkywGiqUc/JpTteZXtAJAtC4gZ4XG4EdqqNjxysR0AsvGea1LpP1Y3BZ+6HNQFBA2QzXr22OtDSDOAlwty8mEAyMZ7sM3K/UNIs1j+2aAnHhaAFhQ3EC3Yi2GYdJgAulmWC4C3EJYJhw2gU2CwAs5cmCYbRoD5UhNTKc+2AWhPjrOGk26j9leAAQDu6F3rDzHr6wAAAABJRU5ErkJggg==' ); */
  background-image: url("data:image/svg+xml,%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.5316 18.0962L9.43544 10L5.8999 13.5355L17.5316 25.1673L29.1633 13.5355L25.6278 10L17.5316 18.0962Z' fill='%23bdbdbd'/%3E%3C/svg%3E%0A");
  background-size: 100% 100%;
  width: 18px;
  height: 18px;

  position: absolute;
  inset-inline-end: 12px;
  top: calc(50% - 9px);

  transition: transform 0.25s;
}

.mainmenu_contents .menuitem.submenu_active .chevron {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  color: white;
}

.menuitem_submenu_wrapper {
  overflow: hidden;
  background: #171a21;

  transition: height 0.5s, background 0.25s, color 0.25s;
}

.menuitem_submenu_wrapper.active {
  background: #30353f;

  .inner_borders {
    padding-bottom: 10px;
  }
}

.menuitem_submenu_wrapper .submenuitem,
.notification_submenu .popup_menu_item {
  display: block;
  font-size: 0.75em;
  color: #ffffff;
  padding-inline-start: 28px;
}

.menuitem.notifications_item .notification_count_total_ctn.no_notifications {
  font-weight: 400;
  color: #8a8a8a;
}

.notifications_item .notification_count_total_ctn {
  display: inline-block;
  color: #ffffff;
  vertical-align: middle;
  line-height: 140%;
  padding: 2px 8px;
  font-size: 0.75em;
  margin-inline-start: 0.4em;
}

.notifications_item .notification_envelope {
  display: none;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAA0CAYAAAAzMZ5zAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAvRJREFUeNrsWu2RmzAQXd+kAJVACaQDroNzB6QDXEFIBXYHXAe+VGB3AB34OiAdKNJlmVN8YD2BBBi8Mzv84UO8/XirXW2klPSQT/mm9PSA4VM28uEi/8mT0sMDhg95V/pdA7JTulX6Z8VgvGowlFYbI2JipQVf1yLaCX4ofTNDppFK6TOjtQap2CvernNIG2K7hYNxYDDe21im66GYKVksLER2t6JgY2FdDcZRabIQFtlyqHT+rw6ZFwuizwug5nPDIjfu0RFRkvwnufYUi74oreX9yR74t7S5mYwHT0qF5cFYaXknQNRsRBsYhfkQXb3kwj996wXi+iUzlBL8jy/GpQ5kUwDZbKZgHEFPbw1/Ghh7yczySjbUkGT5AJJXxAzySs3GGRzqBHwMySvEHjWFIEaLUKORgwWQvJKOHELew5oCLGAMakYp1TnxUyAXDUnNQb9PPReF5hXf1JyH9lAa6LYpuMDLQCBQAwzeXpAHqxXAQgUXTH0Tp5AjsRx5cuWSqQ3J+CcHoJF3RtJjEieP8Y0URyYwRUsolWzpCHyP9x14iLnML6X5CD2OvdLsXgZV58CjDT0dSEMNqkLI78Bznl2o6YBvD6m4a1+N1BpMOXTEHD3kAPQtXUQAQ7NXz98kHyxzAdlFGMyyZ4aIWtgn5ZqldqhOie+bnHaPYNGUDKxWXeqcSSpVdLfpzXIOW4UhVXHv3S5irVBtgAL0ymwMQNB4zgI3itDNnrNRyCGGY9BdT3I8ySWezL0Bgu42p5rsnXyujzxs1sSEDWbXJG/dGdNAOvXR/PHddEbWnaOA1OCwxyed+hY037XWLNSj+PHakAkYQpnsUbO4HIcYg059Cxr6mQlILANXfzPwlgTMh6XtSBXxCaNiAWfNoE7eLUA0AD9DtOkmPoq5bTt9aAMk5sN20UIP63Z23NoaRPnH4bNlgtF4ftGVBkwPifimhNYjX45qPhm9yXJlYDROUJrJVntIbDmruhbRo5MzQrurkr8CDACZX+ZRUnCU8wAAAABJRU5ErkJggg==");
  background-size: 100% 100%;
  background-position: top left;
  width: 17px;
  height: 13px;
  vertical-align: middle;
}

.notifications_item .notification_count {
  vertical-align: middle;
}

.notifications_item .notification_count_total_ctn.has_notifications {
  color: #ffffff;
  background-color: #5c7e10;
}

.notifications_item
  .notification_count_total_ctn.has_notifications
  .notification_envelope {
  display: inline-block;
}

.mainmenu .notification_submenu .notification_icon,
.mainmenu .notification_submenu .header_notification_dropdown_seperator {
  display: none;
}

.mainmenu .minor_menu_items .menuitem {
  color: #8a8a8a;
  border: none;
  font-size: 14px;
  font-weight: 400;

  &:hover {
    background: none;
    color: #ffffff;
  }
}

.mainmenu_footer_spacer {
  height: 160px;
}

.mainmenu_footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  font-size: 10px;
  white-space: normal;
  color: #8a8a8a;
  padding: 0 12px 24px 12px;
}

.mainmenu_footer_logo {
  padding-bottom: 10px;

  img {
    width: 100px;
    opacity: 50%;
  }
}

.mainmenu_footer .mainmenu_valve_links > a {
  color: #8a8a8a;
}

.responsive_menu_notifications .popup_menu_item {
  font-size: 16px;
}

.responsive_menu_notifications .popup_menu_item.active_inbox_item {
  color: #70ba24;
}

.responsive_local_menu_tab {
  display: none;
}

.responsive_local_menu_tab.active {
  display: block;
  background-color: rgba(104, 157, 221, 0.6);
  position: fixed;
  right: 0;
  top: 6px;
  border-top-left-radius: 80px;
  border-bottom-left-radius: 80px;
  width: 30px;
  height: 50px;
  z-index: 12; /* behind overlay, on top of page content */

  background-image: url("../p/fhtb-mrgw/nwjrmgwv/images/local_menu_hamburger.png");
  background-repeat: no-repeat;
  background-position: 2px center;
  background-size: 110%;

  transition: opacity 0.5s;
  box-shadow: 0 0 30px 0 #6799e2;

  cursor: pointer;
}

.responsive_page_frame.with_header {
  --global-header-height: 104px;
}

.responsive_page_frame.with_header .responsive_local_menu_tab {
  top: 68px;
}

.responsive_page_frame.mainmenu_active .responsive_local_menu_tab,
.responsive_page_frame.localmenu_active .responsive_local_menu_tab {
  opacity: 0;
}

.responsive_header {
  display: none;
  background: #171a21;

  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 20;
  box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.75);

  overflow: hidden;

  padding: 13px 8px;
}

@media screen and (max-height: 360px) {
  .responsive_header {
    position: absolute;
  }
}

.responsive_header_content {
  display: flex;
  flex-direction: row;
  align-items: center;
}

#responsive_menu_logo,
#responsive_header_search_btn {
  position: relative;
  cursor: pointer;
  width: 36px;
  height: 31px;
}

.responsive_header_notification_badge_ctn {
  position: absolute;
  text-align: center;
  inset-inline-end: -26px;
  width: 60px;
  top: -4px;
}

.responsive_header_notification_badge {
  display: inline-block;
  background: #ca2842;
  color: #ffffff;
  padding: 0 4px;
  font-size: 11px;
  line-height: 17px;
  border-radius: 8px;
}

.responsive_header_notification_badge.no_notifications {
  display: none;
}

.responsive_header_logo {
  flex: 1;
}

.responsive_header_react_target {
  display: contents;
}

.responsive_header_react_placeholder {
  width: 34px;
}

.responsive_header .responsive_header_logo img {
  vertical-align: middle;
}

.responsive_header .responsive_header_logo a {
  display: inline-block;
}

.localmenu_content {
  padding: 16px;
}

/* China Mobile Footer */

.mainmenu_socials_china {
  display: flex;
  align-items: center;
}

.mainmenu_social_box {
  margin-right: 25px;
  display: flex;
  align-items: center;
}

.mainmenu_line {
  height: 1px;
  background: #2f3138;
  margin: 15px 0;
}

.mainmenu_links_china {
  margin: 10px 0;
  line-height: 17px;
}

.mainmenu_footer a {
  color: #8a8a8a;
}

.mainmenu_footer a:hover {
  color: #ffffff;
}

.mainmenu_legal_china {
  font-size: 9px;
}

.mainmenu_legal_pwlegal {
  margin-top: 15px;
}

.mainmenu_logos_china {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}

.mainmenu_china_wechat_logo {
  width: 31px;
  height: 27px;
}

.mainmenu_china_weibo_logo {
  width: 30px;
  height: 26px;
}

.mainmenu_china_pw_logo {
  width: 68px;
  height: 23px;
  margin-right: 10px;
}

.mainmenu_china_valve_logo {
  width: 64px;
  height: 19px;
}

.mainmenu_footer_spacer.china_spacer {
  height: 330px;
}

/* reduce the event share dialog body's bottom margin */
.EventDisplay_Share_Dialog .DialogBodyText {
  margin-bottom: 10px;
}

@media screen and (max-width: 910px) {
  /* these elements end up getting moved, but hide them in the main page while content is loading */
  html.responsive .responsive_page_content .responsive_local_menu {
    display: none;
  }
}

.responsive_menu_user_area {
  padding: 20px 20px 12px 14px;
  z-index: 1;
  position: relative;
}

.responsive_menu_user_persona {
  line-height: 36px;
  padding-bottom: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: flex;
  flex-direction: row;
  gap: 8px;
}

.responsive_menu_user_persona {
  .persona a,
  .persona.online a,
  .persona.offline a {
    color: #dcdedf;
  }
}

.responsive_menu_user_persona .playerAvatar {
  display: inline-block;
  vertical-align: middle;
  margin-right: 2px;
  height: 64px;
  width: 64px;
  padding: 0px;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);

  img {
    width: 64px;
    height: 64px;
  }
}

.responsive_menu_user_persona.persona.offline,
.responsive_menu_cartwallet_area.persona.offline {
  color: #bdbdbd;

  a {
    color: #bdbdbd;
  }
}

.responsive_menu_user_container {
  background: -webkit-linear-gradient(343deg, #24313f 0%, #171a21 33%);
  background: linear-gradient(107deg, #24313f 0%, #171a21 33%);
}

.responsive_menu_user_bg {
  position: absolute;
  top: 0;
  overflow: clip;
  max-height: 145px;

  img {
    width: 280px;
    filter: blur(20px);
    opacity: 0.5;
  }
}

.playerProfile_area {
  display: flex;
  flex-direction: column;
}

.playerProfile_area_profilebtn {
  display: flex;
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 2px;
  padding: 5px 10px;
  color: white;
  font-size: 11px;
  font-weight: 500;
  line-height: 20px;
  width: fit-content;
  transition: background-color 0.25s, color 0.25s, box-shadow 0.25s;

  &:hover {
    background-color: rgba(255, 255, 255, 0.4);
    color: white;
    box-shadow: 3px 3px 2px rgb(54 54 54 / 20%);

    a {
      color: white;
    }
  }
}

.responsive_change_language_select {
  font-size: 24px;
}

.responsive_menu_cartwallet_area {
  font-size: 0.75em;
  line-height: normal;
  margin-top: 12px;
  font-weight: 400;
  display: flex;
  color: #dcdedf;
  gap: 10px;
}

.responsive_menu_user_wallet {
}

/*overriding the global styles for links, avatar and persona name are more directly styled*/

.responsive_menu_cartwidget {
  display: contents;
}

@media screen and (max-width: 910px) {
  html.responsive .responsive_page_frame.with_header {
    --responsive-menu-floating-height: 62px;
  }

  html.responsive div#global_header {
    display: none;
  }

  html.responsive .responsive_page_frame.with_header {
    --global-header-height: 0px;
  }

  html.responsive .responsive_page_menu_ctn {
    display: block;
  }

  html.responsive div.responsive_header {
    display: block;
  }

  html.responsive div.responsive_page_content {
    position: relative;
    z-index: 10;
  }

  html.responsive
    .responsive_page_frame.with_header
    div.responsive_page_content {
    padding-top: var(
      --responsive-menu-floating-height,
      0px
    ); /* the header overlaps this area */
  }

  /* we show a footer in the menu itself */
  html.responsive div#footer,
  html.responsive div#footer_spacer {
    display: none;
  }

  html.responsive .responsive_page_template_content {
    padding-bottom: 120px;
    min-height: calc(
      100vh - 120px - var(--responsive-menu-floating-height, 0px) -
        var(--store-menu-overlap-height, 0px)
    );
  }

  html.responsive .perf_timing_area {
    margin-top: -22px;
    position: relative;
    z-index: 30;
  }

  html.responsive .responsive_hidden {
    display: none;
  }

  html.responsive h2.nonresponsive_hidden {
    display: block;
  }

  html.responsive div.nonresponsive_hidden {
    display: block;
  }
}

html.responsive.touch .responsive_page_frame.with_header {
  --responsive-menu-floating-height: 62px;
}

html.responsive.touch div#global_header {
  display: none;
}

html.responsive.touch .responsive_page_frame.with_header {
  --global-header-height: 0px;
}

html.responsive.touch .responsive_page_menu_ctn {
  display: block;
}

html.responsive.touch div.responsive_header {
  display: block;
}

html.responsive.touch div.responsive_page_content {
  position: relative;
  z-index: 10;
}

html.responsive.touch
  .responsive_page_frame.with_header
  div.responsive_page_content {
  padding-top: var(
    --responsive-menu-floating-height,
    0px
  ); /* the header overlaps this area */
}

/* we show a footer in the menu itself */
html.responsive.touch div#footer,
html.responsive.touch div#footer_spacer {
  display: none;
}

html.responsive.touch .responsive_page_template_content {
  padding-bottom: 120px;
  min-height: calc(
    100vh - 120px - var(--responsive-menu-floating-height, 0px) -
      var(--store-menu-overlap-height, 0px)
  );
}

html.responsive.touch .perf_timing_area {
  margin-top: -22px;
  position: relative;
  z-index: 30;
}

html.responsive.touch .responsive_hidden {
  display: none;
}

html.responsive.touch h2.nonresponsive_hidden {
  display: block;
}

html.responsive.touch div.nonresponsive_hidden {
  display: block;
}

.perf_timing_area {
  /*display: none;*/
  margin-bottom: 0;
}

.perf_timing_data {
  width: auto;
}

.responsive_page_menu div.responsive_menu_only {
  display: block;
}

.responsive_page_menu span.responsive_menu_only {
  display: inline;
}

@media screen and (max-width: 910px) {
  html.responsive span.nonresponsive_hidden {
    display: inline;
  }

  html.responsive img.nonresponsive_hidden {
    display: block;
  }

  html.responsive a.nonresponsive_hidden {
    display: block;
  }
}

.responsive_tab_control select {
  color: #ffffff;
  background: rgba(0, 0, 0, 0.3);
  /*background: #3a6d8b;*/
  padding: unset;
  border: none;
  font-size: 16px;
  height: 24px;
  max-width: 98%;
  min-width: 250px;
  font-family: "Motiva Sans", Sans-serif;
  font-weight: 200; /* thin */
}

.responsive_tab_control select option {
  background: #3a6d8b;
}

/* If the user has opted to "view desktop site", we add a button to the bottom of the footer
	to opt back in to the mobile site.  This is button repsonds to device width
	so that it's bigger on smaller screens and easier to tap when zoomed out */

html.force_desktop body #footer .responsive_optin_link {
  display: block;
  text-align: center;
  padding: 20px 0;
}

html.force_desktop body #footer_responsive_optin_spacer {
  height: 64px;
}

.responsive_optin_link .btn_medium > span {
  line-height: 150%;
}

@media screen and (max-device-width: 640px) {
  .responsive_optin_link .btn_medium > span {
    font-size: 22px;
  }

  html.force_desktop body #footer_responsive_optin_spacer {
    height: 75px;
  }
}

@media screen and (max-device-width: 500px) {
  .responsive_optin_link .btn_medium > span {
    font-size: 26px;
  }

  html.force_desktop body #footer .responsive_optin_link {
    padding: 25px 0;
  }

  html.force_desktop body #footer_responsive_optin_spacer {
    height: 91px;
  }
}

@media screen and (max-device-width: 400px) {
  .responsive_optin_link .btn_medium > span {
    font-size: 34px;
  }

  html.force_desktop body #footer .responsive_optin_link {
    padding: 40px 0;
  }

  html.force_desktop body #footer_responsive_optin_spacer {
    height: 133px;
  }
}

@media print {
  html .responsive_page_menu_ctn.mainmenu,
  html .responsive_local_menu_tab,
  html .responsive_page_menu_ctn.localmenu,
  html .responsive_header {
    display: none;
  }
}

.responsive_fixonscroll_ctn {
  position: fixed;
  left: 0;
  right: 0;
  background: #171a21;
  box-shadow: 0 2px 4px 0 #000000;
  z-index: 15;
}

.responsive_app_menu {
  display: flex;
  flex-direction: row;
  cursor: pointer;
}

.responsive_app_menu .menu_ellipses {
  width: 6px;
  height: 6px;
  background: #8a97a0;
  border-radius: 3px;
  margin-right: 3px;
}

@media screen and (max-width: 910px) {
  html.responsive:not(.legacy_mobile) .responsive_scroll_snap_start {
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  html.responsive:not(.legacy_mobile) .responsive_scroll_snap_ctn {
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  html.responsive div.responsive_tab_baseline {
    display: none;
  }
}

html.responsive.tablet:not(.legacy_mobile) .responsive_scroll_snap_start {
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

html.responsive.tablet:not(.legacy_mobile) .responsive_scroll_snap_ctn {
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

html.responsive.tablet div.responsive_tab_baseline {
  display: none;
}

@media screen and (max-width: 910px) {
}

html.responsive body.OverlayWindowPinned div.responsive_header {
  display: none;
}
html.responsive
  body.OverlayWindowPinned.responsive_page
  .responsive_page_frame.with_header
  div.responsive_page_content {
  padding-top: 0px;
}

html.responsive body.OverlayWindowPinnedView div.responsive_local_menu_tab {
  display: none;
}
html.responsive body.OverlayWindowPinnedView.responsive_page {
  overflow: hidden;
  background: none;
}
