/*
 Theme Name:     Ursus
 Theme URI:      https://www.rorockett.com
 Description:    The custom theme for Ursus.
 Author:         JHCHOI Studio
 Author URI:     https://jhchoistudio.com
 Template:       Divi
*/

/* =Theme customization starts here
------------------------------------------------------- */

body.mobile-menu-open {
  overflow: hidden;
}

/* Swap icon from hamburger to X on mobile menu open */
.mobile_nav.opened .mobile_menu_bar:before {
  content: "M";
}

.et_pb_module .mobile_menu_bar:before {
  top: 0;
}
#mobile_menu1,
.et-db #et-boc .et-l #mobile_menu1 {
  background: #23313f;
  border: none;
  height: 100vh;
  left: 0;
  overflow-y: scroll;
  padding: 6rem 2rem 0;
  position: fixed;
  top: 0;
  width: 100vw;
}
.admin-bar .et_pb_section:not(.et_pb_sticky) #mobile_menu1 {
  top: 32px;
}
.et_pb_menu__wrap .mobile_menu_bar {
  z-index: 99999;
}
#mobile_menu1 li a,
.et-db #et-boc .et-l #mobile_menu1 li a {
  border: none;
  color: #F7F7F7;
  padding: 1rem;
  text-align: center;
  font-size: 1.25rem;
}
#mobile_menu1 li a:hover,
.et-db #et-boc .et-l #mobile_menu1 li a:hover {
  background: none;
  color: #F7F7F7;
  opacity: 1;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links > a {
  display: none;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul {
  display: flex !important;
  justify-content: center;
  margin-top: 1.5rem;
  padding: 0;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul li {
  padding: 0 !important;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul a {
  color: transparent;
  display: inline-block;
  font-size: 0;
  height: 32px;
  position: relative;
  width: 32px;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul a:before {
  color: #F7F7F7;
  direction: ltr;
  display: block;
  font-family: ETmodules;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-variant: normal;
  font-weight: 400;
  height: 32px;
  left: 0;
  line-height: 32px;
  position: absolute;
  speak: none;
  text-shadow: 0 0;
  text-transform: none;
  top: 0;
  transition: color 0.3s;
  width: 32px;
  z-index: 10;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links .instagram a:before {
  content: "\E09D";
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links .linkedin a:before {
  content: "";
}
.et_pb_menu__logo-wrap {
  z-index: 3 !important;
}
.et_pb_menu__wrap {
  z-index: 1;
}

.et-db #et-boc .et-l #menu-primary-menu li.social-links > a {
  display: none;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul {
  display: flex !important;
  justify-content: center;
  margin-top: 1.5rem;
  padding: 0;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul li {
  padding: 0 !important;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul a {
  color: transparent;
  display: inline-block;
  font-size: 0;
  height: 32px;
  position: relative;
  width: 32px;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul a:before {
  color: #FFF;
  direction: ltr;
  display: block;
  font-family: ETmodules;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-variant: normal;
  font-weight: 400;
  height: 32px;
  left: 0;
  line-height: 32px;
  position: absolute;
  speak: none;
  text-shadow: 0 0;
  text-transform: none;
  top: 0;
  transition: color 0.3s;
  width: 32px;
  z-index: 10;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links .instagram a:before {
  content: "";
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links .linkedin a:before {
  content: "";
}

.et-db #et-boc .et-l #mobile_menu1 li.social-links .youtube a:before {
  content: "";
}

.et-db #et-boc .et-l #mobile_menu1 li.social-links .houzz a:before {
  font-family: FontAwesome;
  content: "\F27C";
}

/* Opaque header, driven by the `ursus-solid-header` body class (see
   functions.php): single posts always, plus any page with the ACF
   "heading_color_background" toggle switched on. */
body.ursus-solid-header .et_pb_row_0_tb_header {
  background-color: var(--gcid-primary-color);
}

/* The header row is absolutely positioned so it overlays the content. Where the
   header is opaque, push the content clear of it instead. */
body.ursus-solid-header #main-content {
  padding-top: 96px;
}
@media (max-width: 980px) {
  body.ursus-solid-header #main-content {
    padding-top: 56px;
  }
}