.biblioguides-header {
  position: relative;
  z-index: 999;
  top: 0;
  height:90px;
  margin-top:10px;
  box-shadow: 0 10px 12px -3px rgb(0 0 0 / 25%);
  background-color: rgba(255,255,255,0.95);
  font-size:10px;
}
.biblioguides-header::before {
  /* never visible - used in JS to check mq */
  content: 'mobile';
  display: none;
}
.biblioguides-header #search {
    width: min(300px, calc(65% + 10px)); 
    position:absolute;
    top: 5px;
    right: 10px;
}
.biblioguides-header .logo {
   float:left;
   width:80px;
   margin:0px 20px 5px 10px;
}
.biblioguides-header .logo img {
   width:80px;
}
.biblioguides-header .search-nav {
   display:flex;
   flex-direction:row;
   border:1px solid #198286;
}
.biblioguides-header #search select {
   background-color:#efefef;
   color:#000000;
   border:none;
   border-right: 3px solid #efefef;
   border-radius:0;
   width: 110px;
   font-size:1.4rem;
}
.biblioguides-header #search input {
   font-size:1.6rem;
   flex-grow:2;
   border:none;
   width:88px;
   margin:0 4px;
}
.biblioguides-header #search button {
   background-color:#198286;
   border: none;
   padding: 5px
}
.biblioguides-header .login {
   width:110px;
   min-width:110px;
   position:absolute;
   top:55px;
   right:75px;
}
.biblioguides-header .nav-trigger {
  /* menu icon - visible on small screens only */
  position: absolute;
  top: 35px;
  right: 0;
  height: 60px;
  width: 60px;
  /* replace text with icon */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  color: transparent;
  z-index:3000;
}
.biblioguides-header .nav-trigger span, .biblioguides-header .nav-trigger span::after, .biblioguides-header .nav-trigger span::before {
  /* these are the 3 lines of the menu icon */
  position: absolute;
  background-color: #804B73;
  height: 3px;
  width: 26px;
}
.biblioguides-header .nav-trigger span {
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
      -ms-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
}
.biblioguides-header .nav-trigger span::after, .biblioguides-header .nav-trigger span::before {
  content: '';
  left: 0;
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
}
.biblioguides-header .nav-trigger span::before {
  -webkit-transform: translateY(-9px);
      -ms-transform: translateY(-9px);
          transform: translateY(-9px);
}
.biblioguides-header .nav-trigger span::after {
  -webkit-transform: translateY(9px);
      -ms-transform: translateY(9px);
          transform: translateY(9px);
}
.biblioguides-header.nav-open .nav-trigger span {
  background-color: transparent;
}
.biblioguides-header.nav-open .nav-trigger span::before {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.biblioguides-header.nav-open .nav-trigger span::after {
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
nav { display:none; }
.menu-item .menu-text a {
    font-family: Eczar;
}
.biblioguides-header nav {
  display: none;
}
.biblioguides-header.nav-open nav {
  display: block;
  z-index:500;
  position: absolute;
  top: 38px;
  right: 2%;
  left: 2%;
  width: 88%;
  padding: 10px;
  background-color: #efefef;
  border:1px solid #dddddd;
  border-radius:10px;
}
.biblioguides-header.nav-open .menu-text {
  display:none;
}
.biblioguides-header.nav-open .sub-menu.browse {
  width:46%;
  margin-right:10px;
  float:left;
}
.biblioguides-header.nav-open .sub-menu.search,.biblioguides-header.nav-open .sub-menu.resources,.biblioguides-header.nav-open .sub-menu.account {
  margin-left: calc(46% + 5px);
}
.menu-item .links-list a, .searchoptions a {
  display: block;
  line-height: 1.6;
  color:#000000;
  white-space: normal;
  font-weight:normal;
}
.menu-item .links-list a:hover, .searchoptions a:hover {
  display: block;
  line-height: 1.6;
  color:#198286;
}
.menu-item .links-list, .menu-item p, .searchoptions {
    margin-left:34px;
}
.menu-item .links-list a, .menu-item h6, .menu-item p {
    font-size: 1.6em;
}
.menu-item p {
    font-size:1.5em;
    line-height:1.5;
    margin-bottom:10px;
}
.menu-item .iconsm { max-height:22px;vertical-align:middle;margin-right:10px; }
.menu-item h6 { font-weight:bold; }
.subyouraccount {
  margin:28px 0 0 0;
}
.menu-item .sub-menu.search p, .searchoptions img {
    display:none;
}
.menu-item { 
    z-index:3000;
}
#app-back { float:left;width: 15px;margin: 26px 0 0 5px; }
#app-back { display:none; }
@media only screen and (max-width: 390px) {
	#searchtype {display:none;}
	.biblioguides-header #search {
    		width: min(200px, calc(60% + 10px));
	}
}
@media only screen and (min-width: 1100px) {
.biblioguides-header {
  position: -webkit-sticky;
  position:sticky;
}
  .biblioguides-header {
    left: 0;
    width: 100%;
    padding: 0;
    text-align: right;
  }
  .biblioguides-header .logo { margin-left:20px; }
  .biblioguides-header .nav-trigger {
    display: none;
    overflow: visible;
  }
  .biblioguides-header .login {
     width:110px;
     top:28px;
     right:10px;
  }
  .biblioguides-header #search {
      width: 310px;
      top: 20px;
      left: 130px;
  }
  .biblioguides-header #search input {
      width:125px;
   }
.biblioguides-header nav {
    width: 500px;
    display: flex;
    transform-style: preserve-3d;
    justify-content: space-evenly;
    position: relative;
    z-index: 2;
    perspective: 2000px;
    flex-wrap: wrap;
    top:18px;
    margin-left: auto;
    margin-right: 125px;
}

nav .menu-item {
    color: #804B73;
    transform-style: preserve-3d;
    flex-grow: 1;
    display: flex;
    flex-basis: 125px;
    box-sizing: border-box;
    padding: 1em 0;
    justify-content: center;
    perspective: 200px;
    min-height: 1em;
    white-space: nowrap;
}

nav .menu-text a {
    font-size: 1.8em;
    color: #804B73;
    font-weight:500;
    -webkit-font-smoothing: antialiased;
    text-decoration: none;
    text-shadow: 0 1px 5px rgba(0,0,0,0.1);
    //transition: color 0.1s ease-out;
    text-align: center;
}

nav .menu-text a:hover {
    color: rgba(50.2,29.4,45.1,0.8);
}

#sub-menu-holder {
    pointer-events: none;
    color: rgba(0,0,0,0.5);
    font-weight: normal;
    padding: 1em;
    position: absolute;
    //transition: opacity 2 ease-out;
    //transform: rotateX(-25deg) scale(1);
    //transform-origin: 75% 14em 0em;
    opacity: 0;
    box-shadow: 0 2px 7px rgba(0,0,0,0.2), 0 2px 20px rgba(0,0,0,0.3);
    box-sizing: border-box;
    top: 3rem;
    border:1px solid #ddd;
    border-radius: 10px;
    background: #efefef;
    display: block;
    width: 610px;
}

#sub-menu-container {
    position: absolute;
    z-index: -1;
    min-width: 100%;
    top: 3.3em;
    width: 100%;
}

nav .menu-item:hover ~ #sub-menu-container #sub-menu-holder {
    animation: clipPath 0.25s ease-out 1 forwards;        
    transition: clip-path 0.25s ease-out, left 0.15s ease-out, height 0.15s ease-out;
    opacity: 1;
    right: auto;
}
nav .menu-item:nth-of-type(1):hover ~ #sub-menu-container #sub-menu-holder {
    clip-path: inset(0 5.75em 0 0 round 10px);
    height: 400px;
}
nav .menu-item:nth-of-type(2):hover ~ #sub-menu-container #sub-menu-holder {
    clip-path: inset(0 15em 0 0 round 10px);
    height: 300px;
}
nav .menu-item:nth-of-type(3):hover ~ #sub-menu-container #sub-menu-holder {
    clip-path: inset(0 12em 0 0 round 10px);
    height:300px;
}

nav .menu-item:nth-of-type(4):hover ~ #sub-menu-container #sub-menu-holder {
    clip-path: inset(0 23em 0 0 round 10px);
    height: 320px;
}

nav .menu-item:nth-of-type(1):hover ~ #sub-menu-container #sub-menu-holder {
    left: calc(-10em + -1px);
}
nav .menu-item:nth-of-type(2):hover ~ #sub-menu-container #sub-menu-holder {
    left: calc(-6em + -1.5px);
}
nav .menu-item:nth-of-type(3):hover ~ #sub-menu-container #sub-menu-holder {
    left: calc(5em + 1px);
}
nav .menu-item:nth-of-type(4):hover ~ #sub-menu-container #sub-menu-holder {
    left: calc(20.5em + 1px);
}

.menu-item .sub-menu {
    position: absolute;
    top: 3.3em;
    color:#000000;
    border-radius: 10px;
    min-width: 40em;
    pointer-events: none;
    box-sizing: border-box;
    z-index: 999;
    margin-left: -5em;
    clip-path: inset(0 10em 10em 15em);
    opacity: 0;
    font-weight: initial;
    padding: 1.5em;
    transition: all 0.25s ease-out, opacity 0.25s ease-in, margin-left 0.25s ease-out, clip-path 0.15s ease-out;
}
.menu-item .sub-menu.browse {
    min-width: 600px;
    height: 400px;
    display: grid;
    margin-left:120px;
}
.menu-item .sub-menu.account {
    min-width:420px;
    height: 310px;
    display: grid;
    margin-left: -54px;
}
.menu-item .sub-menu.resources {
    min-width:480px;
    height: 350px;
    display: grid;
}
.menu-item .sub-menu.search {
    min-width:450px;
    height:350px;
    display: grid;
}
.menu-item .sub-menu.browse > ul, .menu-item .sub-menu.account < ul {
    margin-top: 1.5em;
}
.menu-item .sub-menu.browse > ul > li  {
    width: 30%;
}
.menu-item .sub-menu.account > ul > li, .menu-item .sub-menu.resources > ul > li {
    width: 45%;
}
.menu-item .sub-menu.search p {
    display:block;
    white-space: normal;
}
.menu-item:hover .sub-menu {
    pointer-events: all;
    clip-path: inset(0 0 0 0);
}

.menu-text:after {
    transition: bottom 0.25s ease-out, opacity 0.01s ease-out 0.01s;
    opacity: 0;
    content: '';
    position: absolute;
    pointer-events: none;
    bottom: -1em;
    left: calc(50% - 10px);
    border-color: transparent transparent #efefef transparent;
    border-width: 10px;
    border-style: solid;
}
.menu-item:hover .menu-text:after {
    bottom: 0;
    opacity: 1;
    transition: bottom 0.25s ease-out, opacity 0.01s ease-out 0.15s;
}
.menu-item:hover .sub-menu {
    opacity: 1;
    padding: 2.5em 0 0 2.5em;
}
/*.menu-item:hover .sub-menu.browse {
   margin-left: 400px;
    margin-left:170px;
}*/

.menu-item:hover ~ #sub-menu-container #sub-menu-holder  {
    transition: transform 0.25s ease-out, opacity 0.25s ease-out, clip-path 0.25s ease-out;
}

@keyframes clipPath {
    0% {
        opacity: 0;
    }
    100% {
        transform: rotateX(0deg) scale(1);
        top: 0.5em;
        opacity: 1;        
    }
}
/* subnav */
.menu-item .sub-menu {
    display: inline-block;
}
.menu-item:hover .sub-menu.browse {
    margin-right:-125px;
}
.menu-item .sub-menu > ul > li {
    display: inline-block;
    float: left;
    text-align: left;
}
.menu-item .sub-menu > ul > li > a {
    display: block;
    padding: 0 1.8em;
    height: 70px;
    line-height: 70px;
    color: #804B73;
    font-size:1.8em;
    font-weight:500;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
}
.menu-item .sub-menu.browse .links-list, .menu-item .sub-menu.account .links-list {
    margin-left:34px;
}
.subyouraccount { margin-top: -120px; }
#searchmobile { display:none; }
.searchoptions { margin:0; }
.searchoptions img, .searchoptions a, .searchoptions a:hover { display: inline-block;font-weight:bold; }
}
@media all and (display-mode: standalone) {
    #app-back { display:block; } 
}