.od-logout-account-section {
  width: auto;
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;

  a.od-header-navigation-link {
    color: #FFFFFF !important;
    font-weight: 700;
    font-size: 16px !important;
  }
}

.opensite-login-text,
.opensite-login-text a {
  color: #FFFFFF !important;
}

/*.opensite-login-arrow {
  display: block;
}*/

#headerAccountMenuListDesktop {
  position: absolute;
  z-index: 10500;
  width: 310px !important;
  top: 45px !important;
  padding: 0 !important;
  left: -240px !important;
  padding: 0;
  background-color: #FFF;
  border: none;
}

#headerAccountMenuListDesktop > ul {
  display: none;
}

.od-header-flyout-link {
  text-align: center;
}
.od-header-flyout-link span button{
  background: transparent;
  border: none;
  color: #1E5A99;
}
.od-header-account-menu-flyout {
  position: absolute;
  right: 0;
  top: 0;
  min-width: 315px;
  list-style: none;
  border: 1px solid #D1D2D4;
  border-radius: 3px;
  background-color: #FFFFFF;
  text-align: left;
  z-index: 9900;
  display: contents;
}

.is-fluid .arrow-box:after {
  border-color: transparent;
  border-bottom-color: #F1F1F1;
  border-width: 10px;
  margin-left: -1px !important;
}

.is-fluid .arrow-box:before {
  border-color: transparent;
  border-bottom-color: #F1F1F1;
  border-width: 10px;
  margin-left: -1px !important;
}

#logoutMenuHeaderFlyout {
  visibility: visible;
  position: absolute;
  right: 0;
  min-width: 315px;
  list-style: none;
  border: 1px solid #D1D2D4;
  border-radius: 3px;
  background-color: #FFFFFF;
  text-align: left;
  z-index: 9900;
}

#headerFlyoutContent {
  padding: 10px 17px;
  border-bottom: 1px solid #D1D2D4;
}

.is-fluid .arrow-box {
  position: absolute;
  background: #FFFFFF;
  border: 1px solid #FFFFFF;
}

.od-header-account-menu-flyout {
  .od-header-flyout-text {
    margin-bottom: 20px;
  }
  .od-header-flyout-btn {
    margin-bottom: 20px;

    .login-btn {
      width: 100%;
      border-radius: 1rem;
      text-decoration: none;
      box-sizing: border-box;
      -webkit-font-smoothing: inherit;
      -moz-osx-font-smoothing: inherit;
      margin: 0px;
      padding: 6px !important;
      overflow: visible;
      position: relative;
      display: inline-block;
      align-items: center;
      line-height: 1;
      justify-content: center;
      text-align: center;
      vertical-align: middle;
      border: 1px solid #1e5a99;
      color: #fff !important;
      background-color: #1e5a99;
      font-weight: 700;
      font-size: 15px;
    }
    .login-btn:hover {
      text-decoration:none;
      color: #fff !important;
      background-color: #194a7e !important;
      border-color: #194a7e !important;
    }
  }
}

.od-header-mobile-account-menu-flyout {
  .od-header-flyout-text {
    font-weight: bold;
  }

  .od-header-flyout-content {
    padding: 40px;
  }

  .od-header-flyout-btn {
    margin: 20px 0px;

    .login-btn {
      width: 100%;
      height: 44px;
      border-radius: 22px;
      text-decoration: none;
      box-sizing: border-box;
      -webkit-font-smoothing: inherit;
      -moz-osx-font-smoothing: inherit;
      margin: 0px;
      padding: 6px !important;
      overflow: visible;
      position: relative;
      display: flex;
      align-items: center;
      line-height: 1;
      justify-content: center;
      text-align: center;
      vertical-align: middle;
      border: 1px solid #1e5a99;
      color: #fff !important;
      background-color: #1e5a99;
      font-weight: 700;
      font-size: 15px;
    }
    .login-btn:hover {
      text-decoration:none;
      color: #fff !important;
      background-color: #194a7e !important;
      border-color: #194a7e !important;
    }

    .register-btn-msite {
      padding: 0.25rem;
    }
  }
}

header.refresh.header-responsive.is-fluid .dropdown-arrow.main-nav-arrow.opensite-login-arrow {
  top: 4px !important;
  border-color: #FFFFFF !important;
}

#opensiteLoginMobile {
  display: none;
}
#opensiteLoginDesktop {
  display: block;
  font-size: 16px;
  font-weight: 600;
  line-height: 16px;
}

header.refresh.header-responsive .header-menu-item.cart-menu-item .menu-item:after {
  width: auto;
}

@media only screen and (max-width: 767px) {
  #headerAccountMenuListDesktop {
    display: none !important;
  }
  header.refresh.header-responsive.is-fluid .dropdown-arrow.main-nav-arrow.opensite-login-arrow {
    display: none !important;
    top: 2px !important;
  }
  .od-header-account-menu-flyout .od-header-flyout-btn .login-btn {
    padding: 14px !important;
    max-width: 300px !important;
    border-radius: 2rem;
  }
  #opensiteLoginMobile {
    display: block;
  }
  #opensiteLoginDesktop {
    display: none;
  }
  #headerFlyoutContent {
    text-align: center;
    border-bottom: none;
    font-weight: 500;
    color: #172B4B;
    padding: 0px;
  }
}

// msite popup is moved into the shared .modal; the ID wins over modal/link color rules
#msiteHeaderFlyoutContent .login-btn {
  background-color: #1e5a99 !important;
  border-color: #1e5a99 !important;
  color: #fff !important;

  &:hover {
    background-color: #194a7e !important;
    border-color: #194a7e !important;
  }
}

.logout-msite-popup {
  top: auto !important;
  bottom: 0;
  height: auto !important;
  width: 94% !important;
  background: transparent !important;
  margin: 12px;

  .modal {
    box-shadow: 0 0 2px 2px #d9d9d9;
  }
}

body {
  overflow: auto !important;
}

header.refresh.header-responsive.is-fluid.big-index .selected .dropdown-arrow.main-nav-arrow.opensite-login-arrow {
  top: 9px !important;
  transform: rotateZ(225deg);
}