/**
 * Responsive menu styles.
 *
 * Mixins provide the basic structure and a base style (not much), the rest
 * is up to you, add colors, borders, padding and so on. Icons such as
 * the hamburger and arrows are set in variables in _variables.scss, and you
 * use the color variables for menus from there also.
 *
 * Menu styles are set in Appearance settings using the Responsive Menus extension.
 * There you select a block, breakpoint, a default style and a responsive style.
 * You can safely remove mixins from this file if you not going to use them later
 * on, and want to save a few bytes in stylesheet size.
 *
 * Each mixin takes one or more parameters. Use these to customize the basic
 * structure of the menu, or call options, for example you can place the
 * offcanvas menu on the left or right.
 *
 * Do not import into breakpoints unless you are not using the Responsive Menu
 * settings in Appearance Extensions, in which case you will need to load the
 * at_core/at.responsivemenus library and provide it's required drupalSettings.
 *
 * Breakpoints are handled in matchMedia using Enquire.
 *
 * Responsive styles are a combination of three things:
 *  1. Sass/CSS defined here (with breakpoints etc).
 *  2. jQuery: at.responsiveMenus.js which adds/toggles classes etc.
 *  3. Theme settings as set in your themes extension settings.
 ============================================================================ */
.contextual button.trigger {
  background-color: initial !important;
  border-color: initial !important;
}
button:focus,
button:active,
button:hover,
.button:focus,
.button:active,
.button:hover {
  background-color: rgba(221, 165, 38, 1) !important;
  border-color: rgba(221, 165, 38, 1) !important;
  color: #3D3D3D;
}
#block-hamburgermenu,
.rm-is-open #rid-leaderboard {
  display: none;
}
#rid-leaderboard,
.rm-is-open #block-hamburgermenu {
  display: grid;
}
.rm-is-open #rid-header-top,
.resources-is-open #rid-header-top {
  display: none;
}
.rm-is-open #rid-header-first,
.resources-is-open #rid-header-first {

}
.rm-is-open div.l-leaderboard {
  position: relative;
  background-color: white;
  z-index: 12;
  margin: auto;
  max-width: 1800px;
}
div#rid-leaderboard {
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: 1fr 750px;
  align-items: center;
}
.menu-name--main .menu-item.donate:after {
  display: none;
}
.menu-name--main .menu-item.new:after,
.menu-name--main .menu-item.about:after,
.menu-name--main .menu-item.resources:after {
  content: '';
  border: solid #006679;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  position: relative;
  float: right;
  margin-top: -30px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.menu-name--main .menu-item.resources.active:after,
.menu-name--main .menu-item.about.active:after,
.menu-name--main .menu-item.new.active:after {
  border-color: #3D3D3D;
  margin-top: -26px;
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}
.menu-name--main .resources .menu-link-contentmain li:after,
.menu-name--main .menu-item ul li:after {
  display: none !important;
}
#rm-toggle__icon--open {
  display: block;
}
#rm-toggle__icon--close {
  display: none;
  margin-top: 10px;
}
.rm-is-open #rm-toggle__icon--open {
  display: none;
}
.rm-is-open #rm-toggle__icon--close {
  display: block;
  width: 60px;
  z-index: 100;
}
.rm-is-open #rm-toggle__icon--close svg {
  width: 20px;
}
.rm-row {
  z-index: 100;
  padding: 0 1em;
}

.l-leaderboard:before {
  top: 0;
  bottom: 0;
  left: -4000px;
  content: "";
  background: #fff;
  z-index: 13;
  position: absolute;
}
@media screen and (max-width: 450px) {
  #leaderboard .rm-row {
    padding: 0;
  }
}

@media screen and (min-width: 60.0625em) {
  .theme-name--inner-compass .rm-row {
    padding: 0 2em;
  }
  .theme-name--inner-compass .l-leaderboard .rm-row {
    padding: 0;
  }
}

.rm-row .rm-region {
/*  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between; */
  position: relative;
  padding: 0;
}

.rm-row .rm-region .rm-block {
  width: 100%;
}

@media screen and (max-width: 1150px) {
  .rm-row .rm-region .rm-block {
    font-size: 0.875rem;
  }
}

.rm-row .rm-region .rm-block,
.rm-row .rm-region .block {
  margin: 0;
}

.path-frontpage .rm-row .rm-region .rm-block,
.path-frontpage .rm-row .rm-region .block {
  border-bottom: 0;
}

.rm-row .rm-region .rm-block ul,
.rm-row .rm-region .block ul {
  margin: 0;
}
.menu-name--main .menu-item:not(.resources) {
  display: block;
  position: relative;
}

.menu-name--main .menu-item:not(.resources) > li > a {
  display: block;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
}

div#rid-leaderboard .menu-name--main .menu-item:not(.resources)  ul {
  transition: all .5s ease;
  opacity: 0;
  background: #FAF8F4;
  height: 0;
  left: 0;
  position: absolute;
  top: 35px;
  left: -35px;
  height: fit-content;
  width: fit-content;
  display: flex;
  flex-direction: column;
  white-space: nowrap;
  padding: 0;
  display: none;
}
div#rid-leaderboard .menu-name--main .menu-item.new  ul {
/*  left: -140px; */
  top: 52px;
}
div#rid-leaderboard .menu-name--main .menu-item.about  ul {
  left: 0;
  top: 52px;
}
div#rid-leaderboard .menu-name--main .menu-item.about.active ul,
div#rid-leaderboard .menu-name--main .menu-item.new.active ul {
  transform: translateY(0);
  opacity: 1;
  display: block;
}
div#rid-leaderboard .menu-name--main .menu-item:not(.resources) ul li {
  border-bottom: 0.5px solid #3D3D3D;
  padding: 10px;
}
div#rid-leaderboard .menu-name--main .menu-item:not(.resources) ul li:last-child {
  border-bottom: 0 solid #3D3D3D;
}
div#rid-leaderboard .menu-name--main .menu-item:not(.resources) li ul:last-child {
  left: -40px;
}
div#rid-leaderboard .menu-name--main .menu-item:not(.resources) ul a {
  color: #000;
  display: block;
  padding: 5px 20px;
}
.resources-is-open .menu-name--main .resources ul.menu.odd.menu-level-1 li > div ul {
  position: absolute;
  left: 10vw;
}
.rm-region {
  margin: 0;
}

.rm-region .contextual-region {
  position: static;
}

.rm-region .contextual-region .contextual {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  height: 1px;
  width: 1px;
  padding: 0;
  word-wrap: normal;
  font: 0/0 a;
}

#rid-leaderboard .rm-toggle {
  font-size: 1rem;
  padding: 0.3125rem 0;
  margin: 0;
}

.rm-toggle__link, .rm-toggle__link:hover, .rm-toggle__link:focus, .rm-toggle__link:active {
  padding: 0.5rem 1rem 0.25rem 0.75rem;
  height: auto;
  border-radius: 0;
  cursor: pointer;
  left: 0.25em;
}

.rm-toggle__icon {
  position: relative;
  height: 2rem;
  width: 2rem;
}

.rm-toggle__label {
  top: -0.125rem;
  position: relative;
}

.rm-block {
  line-height: 1;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: start;
      justify-content: flex-start;
  -ms-flex-align: center;
      align-items: center;
  height: 100%;
}

.rm-block__inner {
  width: 100%;
}

.rm-block__content .menu {
  position: relative;
}

.rm-block__content .menu > .menu__item {
  z-index: 110;
  position: relative;
}

.rm-block__content__item {
  position: relative;
  font-size: 1rem;
}

.rm-block__content__item:first-child a {
  border-top: 0;
}

.rm-block__content a {
  transition: all, 225ms, ease-in-out;
  font-weight: 500;
  margin: 0;
  border: 0;
}
.menu-name--main li.menu-item {
  padding: 0 10px;
}
.menu-name--main li.menu-item.donate {
  background-color: rgba(221, 165, 38, 0.9);
  font-size: 16px;
  width: unset;
  margin: 0 5px;
  display: flex;
  align-self: baseline;
}
.menu-name--main li.menu-item.search {
  background-image: url("/themes/custom/inner_compass/images/icons/search-icon.svg");
  background-repeat: no-repeat;
  background-position: center;
}
.menu-name--main li.menu-item.search a {
  color: transparent;
}
.menu-name--main li.menu-item.donate:hover {
  background-color: rgba(221, 165, 38, 1);
}
.path-page-support-us .menu-name--main li.menu-item.donate {
  display: none;
}
#edit-submit-ici-search.button:hover,
#edit-submit-ici-search.button:focus,
#edit-submit-ici-search.button:active,
#edit-submit-ici-hamburger-search.button:hover,
#edit-submit-ici-hamburger-search.button:focus,
#edit-submit-ici-hamburger-search.button:active {
  background-color: rgba(221, 165, 38, 1);
  text-transform: uppercase;
  color: white;
  font-family: inherit;
  font-weight: bold;
  font-size: 16px;
}
#edit-submit-ici-search.button,
#edit-submit-ici-hamburger-search.button {
  background-color: rgba(221, 165, 38, 0.9);
  text-transform: uppercase;
  color: white;
  font-family: inherit;
  font-weight: bold;
  font-size: 16px;
}
.menu-name--main li.menu-item.donate a {
  background-color: transparent;
  text-transform: uppercase;
  color: white;
  font-family: inherit;
  font-weight: bold;
  font-size: 16px;
}
.menu-name--main li.menu-item.donate a:focus,
.menu-name--main li.menu-item.donate a:active,
.menu-name--main li.menu-item.donate a:hover {
  color: #3D3D3D;
}
#edit-submit-ici-search.button,
#edit-submit-ici-hamburger-search.button {
  background-color: rgba(221, 165, 38, 0.9);
}
#edit-submit-ici-search.button:hover,
#edit-submit-ici-search.button:focus,
#edit-submit-ici-search.button:active,
#edit-submit-ici-hamburger-search.button:hover,
#edit-submit-ici-hamburger-search.button:focus,
#edit-submit-ici-hamburger-search.button:active {
  background-color: rgba(221, 165, 38, 1);
  color: #3D3D3D;
}
#edit-submit-ici-search.button,
#edit-submit-ici-hamburger-search.button {
  background-color: rgba(221, 165, 38, 0.9);
}
#edit-submit-ici-search.button:hover,
#edit-submit-ici-search.button:focus,
#edit-submit-ici-search.button:active,
#edit-submit-ici-hamburger-search.button:hover,
#edit-submit-ici-hamburger-search.button:focus,
#edit-submit-ici-hamburger-search.button:active,
.menu-name--main li.menu-item.donate a:hover {
  background-color: rgba(221, 165, 38, 1);
}
.rm-block__content a:hover, .rm-block__content a:focus {
  text-decoration: none;
}

.no-js .rm-block a {
  padding: 0.5rem;
  margin: 0.0625rem 0;
}

.rm-row .rm-block {
  margin: 0;
  padding: 0;
}
#rid-leaderboard .rm-toggle,
#mobile-donate,
#sidebar-donate {
  display: none;
}
@media all and (max-width: 960px) {
  #mobile-donate,
  #rid-leaderboard .rm-toggle {
    display: block;
  }
  div#rid-leaderboard {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr 130px 60px;
	align-items: center;
  }
   
 /* settings where rm-is-open is present are in slidedown.css */
  #block-inner-compass-main-menu,
  .search-toggle {
    display: none;
  }
  .rm-is-open #block-inner-compass-main-menu {
    display: inherit;
  }
}


