/**
 * @file
 * Skin based on safe CSS file name: ultimenu--htb-tabs.
 */
.ultimenu--dbr .block:first-child {
  float: left;
  width: 45%;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12), 0 6px 6px rgba(0, 0, 0, 0.18);
}

.ultimenu--dbr .block:nth-child(2) {
  margin-left: 48%;
}

.ultimenu--dbr .ultimenu__flyout {
  background-color: #e5e9ef;
  border-radius: 0 !important;
  padding-top:0 !important;
  transition: visibility 0s linear 0.2s, opacity .5s linear, margin .1s ease, max-height .1s ease .1s;
}



.ultimenu--dbr .ultimenu__region{
  border-right:16px #e5e9ef solid;
}

.ultimenu--dbr .region {
  background:   #e5e9ef;
  font-size: 13px;
  padding: 20px;
}

.ultimenu--dbr .block {
  display: block;
  padding: 1em;
}

.ultimenu--dbr .ultimenu__link {
  border-top: 0px solid transparent;
  font-size: 16px;
  font-weight: 500;
  padding: 8px 16px 12px;
  position: relative;
  z-index: 103; /*Above the flyout z-index: 102*/
}

.ultimenu--dbr .ultimenu__link > small {
  font-weight: 400;
}

.ultimenu--dbr .ultimenu__item>a:hover, .ultimenu--dbr  .ultimenu__item>a.ultimenu__link.is-active,
.ultimenu--dbr .ultimenu__item.has-ultimenu:hover>a.ultimenu__link
{  background-color: #e5e9ef; color:#3c5176 !important;}

.ultimenu--dbr > li:hover > a,
.ultimenu--dbr .ultimenu__link.is-active {
  color: #fff;
}

.ultimenu--dbr .ultimenu__link.is-active {
}

.ultimenu--dbr > li.has-ultimenu:hover > a {
}

.ultimenu--dbr > li:hover .ultimenu__flyout {
  margin-top: -6px;
}

.ultimenu--dbr .ultimenu__flyout {

}

/**
 * Bartik header has links white
 */
.ultimenu--dbr .ultimenu__flyout a:link,
.ultimenu--dbr .ultimenu__flyout a:visited {
  color: #3c5176;
}

.ultimenu--dbr .ultimenu__flyout a:hover,
.ultimenu--dbr .ultimenu__flyout a:active {
  color: #3c5176;
}

.button.button--ultimenu {
    background: none;
    border:none;
    border-radius: 0;
    height: 32px;
    margin: 0;
    padding: 0px;
    position: fixed;
    right: 10px;
    text-align: center;
    top: 35px;
    width: 42px;
    z-index: 9999;
}

.adminimal-admin-toolbar .button.button--ultimenu {    top: 80px;}


.button.button--ultimenu:hover, .button.button--ultimenu:active, .button.button--ultimenu.js-ultimenu-button-active {background-color:#303f5a;}

/**
 * Smaller medium.
 */
@media all and (max-width: 1023px) {
  /* Ultimenu flyout. Mobile version has no :hover, so safe to display: none,
  and relies on click events via jQuery. */

  /* Ultimenu flyout. Mobile version has no :hover, so safe to display: none,
  and relies on click events via jQuery. */
  .ultimenu {
    overflow: hidden;
  }

  .ultimenu__flyout {
    display: none;
  }

  .ultimenu > li,
  .ultimenu .ultimenu__link {
    min-width: 100%;
    width: 100%;
  }

  .ultimenu--main {
    background: #222;
    display: none; /* We use jQuery to toggle this on smaller device */
  }

  /* Mobile needs a handler for click event. */
  .ultimenu--main  .ultimenu__link {
    color: #fff;
    padding: 1em 1.75em;
    min-height: 42px;
  }

  .ultimenu--main  .ultimenu__link:hover,
  .ultimenu--main  .ultimenu__link:active {
    background: #000;
  }
  /* @todo is-active https://www.drupal.org/node/2281785 */
  .ultimenu--main  .ultimenu__link.is-active {
    background: #111;
  }

  .has-ultimenu .caret {
    background-color: rgba(0,0,0, .2);
    display: block;
    height: 100%;
    min-height: 34px;
    position: absolute;
    right: 10px; /* LTR */
    top: 0;
    width: 42px;
  }

  [dir="rtl"] .has-ultimenu .caret {
    left: 10px;
    right: auto;
  }

  .has-ultimenu .caret::before {
    border: 8px solid transparent;
    border-top: 12px solid #fff;
    content: '';
    display: block;
    height: 0;
    margin-top: -6px;
    position: absolute;
    right: 10px; /* LTR */
    top: 50%;
    width: 0;
    z-index: 2;
  }

  .has-ultimenu  .js-ultimenu-active .caret::before {
    border-bottom: 12px solid #fff;
    border-top: 0;
  }

  [dir="rtl"] .has-ultimenu .caret::before {
    left: 10px;
    right: auto;
  }

  .ultimenu__flyout,
  .ultimenu--vtl .ultimenu__flyout,
  .ultimenu--vtr .ultimenu__flyout,
  .ultimenu--htt .ultimenu__flyout {
    bottom: auto;
    height: auto;
    left: auto;
    margin: 0;
    right: auto;
    top: auto;
    width: 100%;
  }

  /* Button for main menu. */
  .button.button--ultimenu {
    cursor: pointer;
    display: block;
  }



  .ultimenu {
    overflow: hidden;
    padding-left: 0!important;
  }

  .ultimenu__flyout {
    display: none;
  }

  .ultimenu > li,
  .ultimenu .ultimenu__link {
    min-width: 100%;
    width: 100%;
  }

  .ultimenu--main {
    background: #3c5176;
    display: none; /* We use jQuery to toggle this on smaller device */
  }

  /* Mobile needs a handler for click event. */
  .ultimenu--main  .ultimenu__link {
    color: #fff;
    padding: 1em 1.75em;
    min-height: 42px;
  }

  .ultimenu--main  .ultimenu__link:hover,
  .ultimenu--main  .ultimenu__link:active {
    background: #3c5176;
  }
  /* @todo is-active https://www.drupal.org/node/2281785 */
  .ultimenu--main  .ultimenu__link.is-active {
  background: #3c5176;
  }

    .has-ultimenu .caret {
      background-color: transparent !important;
      display: block;
      height: 100%;
      min-height: 34px;
      min-width: 34px;
      position: absolute;
      right: 10px; /* LTR */
      top: 0;
      width: 42px;
    }

    .ultimenusub .dropdown .caret {display: none !important;}

    [dir="rtl"] .has-ultimenu .caret {
      left: 10px;
      right: auto;
    }

    .has-ultimenu .caret::before {
      border: 6px solid transparent;
      border-top: 8px solid #fff;
      content: '';
      display: block;
      height: 0;
      margin-top: 0px;
      position: absolute;
      right: 10px; /* LTR */
      top: 50%;
      width: 0;
      z-index: 2;
    }

    .has-ultimenu  .js-ultimenu-active .caret::before {
      border-bottom: 8px solid #fff;
      border-top: 0;
    }

    [dir="rtl"] .has-ultimenu .caret::before {
      left: 10px;
      right: auto;
    }

    .ultimenu__flyout,
    .ultimenu--vtl .ultimenu__flyout,
    .ultimenu--vtr .ultimenu__flyout,
    .ultimenu--htt .ultimenu__flyout {
      bottom: auto;
      height: auto;
      left: auto;
      margin: 0;
      right: auto;
      top: auto;
      width: 100%;
    }

    /* Button for main menu. */
    .button.button--ultimenu {
      cursor: pointer;
      display: block;
    }

#ultimenu-main {padding-right: 0 !important;}

}
