/*
Syracuse University Libraries 
*/

/*
Global rules
*/

:root {
    --content-max-width: 1200px;
    --content-width: 768px;
    --menu-background: #f1f1f2;
    --suorange: #f76900;
    --white: #ffffff;
    --primaryblue: #000e54;
    --mediumorange: #ff431b;
    --lightorange: #ff8e00;
    --mediumblue: #203299;
    --lightblue: #2b72d7;
    --black: #000000;
    --mediumgray: #707780;
    --darkgray: #404040;
    --lightgray: #adb3b8;
	--lightgray-30: #e6e8ea;
    --darkorange: #d74100;
    --verylightgray: #dde4e9;

	--chat-height: 10rem;
	--chat-width: 2.5rem;

	--mega-menu-height: 3.25rem;

	--horizontal-body-padding: 1rem;
	--min-body-width: 320px;
	--responsive-width: 768px;
	--max-content-width: 1200px;
}
* {
    box-sizing: border-box;
}

*:focus {
    z-index: 1000;
    outline: solid white 2px;
    outline-offset: 2px;
}

a {
    text-decoration: underline;
    color: #000E54;
    background-color: transparent;
}
a:hover {
  color:#d74100;
}


[hidden] {
    display: none;
}
.hidden {
  display:none;
}

li > * {
	vertical-align: top;
}
html, body {
    height: 100%;
	margin: 0;
}

body {
	font-family: ShermanSans, Verdana, Tahoma, sans-serif;
	color: var(--primaryblue);
	font-size: 1rem;
	line-height: 1.5;
	/* below is for forcing the footer always to the bottom */
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-content: stretch;
	align-items: stretch;
	background-color: var(--white);
	-webkit-font-smoothing: antialiased;
}
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
.flex {
    display: flex !important;
}
main {
	flex: 1;
}
.navbar-brand{
    display:none;
}
.nav-item:hover{
  background-color: #203299;
}
.navbar{
  height:44px !important;
}
.navbar-dark .navbar-nav a.nav-link {
  color: #ffffff;
  font-size: 1em;
  margin-right:20px;
  
}
.navbar-toggler:focus {
  border:dotted blue 2px;
}
.dropdown-menu {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  border: none;
  border-radius: 0;
  padding: 0.7em;
  background-color: #f2f2f2 !important;
}
.dropdown-menu-left {
    right: auto;
    left: 25%;
    -webkit-transform: translate(-25%, 0);
    -o-transform: translate(-25%, 0);
    transform: translate(-25%, 0);
}
.dropdown-menu-center {
  right: auto;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
.dropdown-menu:hover {
    --bs-dropdown-link-hover-bg:none !important;
}
.d-flex {
  height:30px;
}
.btn{
  --bs-btn-padding-y: 0.1rem;
}
#sul_skipnav_container {
      position: absolute;
      left: 1rem;
      top: 1rem;
      background-color: var(--menu-background);
      z-index: 2000;
      font-size: 1.125rem;
      font-weight: 600;
  }
  #sul_skipnav_container:focus-within {
      overflow: auto;
      clip: auto;
      width: auto;
      height: auto;
      box-shadow: 4px 4px 4px 0 rgba(0,0,0,0.5);
  }
  #sul_skipnav_container a {
      display: block;
      padding: 0.625rem 0.75rem;
  }
  #sul_skipnav_container a:focus {
      outline-offset: -6px;
      outline-color: var(--white);
      background: var(--lightblue);
      color: var(--white);
      text-decoration: none;
  }
  #sul_skipnav_container a + a {
      border-top: solid 2px var(--darkgray);
  }
.sul-screen-reader-text,
#lh3-proactive-instructions {
    position: absolute;
	clip: rect(1px 1px 1px 1px);
	clip: rect(1px, 1px, 1px, 1px);
	padding: 0;
	border: 0;
	height: 1px;
	width: 1px;
	overflow: hidden;
}
.sul-page-centered-content {
    max-width: var(--content-max-width);
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
#sul_page_header {
      position: relative;
      --logo-height: 4.5rem;
      --logo-vertical-padding: 0.5rem;
      margin-bottom:0px;
  }
.sul-main-block-left {
  width:70% !important;
}
.sul_main_right_aside {
    width: 20%;
    padding-left: 50px;
}
.sul-right-aside{
  font-size:smaller;
  margin-left:70px;
}
  /****NAV MENU*****/
.topnav {
  overflow: hidden;
  background-color: #D74100;
  line-height: 1;
  padding:0;
  max-width: var(--content-max-width);
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  
}


.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  
}
.sul-padding-y-3 {
      padding: 16px 0 !important;
  }
  
  .flex-justify-space-between {
      justify-content: space-between !important;
  }
  
  .flex-wrap {
      flex-wrap: wrap !important;
  }
  
  .padding-2 {
      padding: 8px !important;
  
  }

  .margin-bottom-2 {
      margin-bottom: 8px !important;
  }
  .margin-bottom-3 {
      margin-bottom: 16px !important;
  }
  .margin-bottom-4 {
      margin-bottom: 24px !important;
  }
  .margin-top-3 {
      margin-top: 16px !important;
  }
  .margin-top-6 {
      margin-top: 40px !important;
  }
  .margin-right-4 {
      margin-right: 24px !important;
  }
  
  .margin-bottom-6 {
      margin-bottom: 40px !important;
  }
  .background-blue-primary {
      background-color: #000E54 !important;
  }
  
  .background-orange-dark {
      background-color: #D74100 !important;
  }
  .display-inline-block {
      display: inline-block !important;
  }
  h1 {
      font-size: 2.25rem;
      font-family: ShermanSans,Verdana,sans-serif;
      font-weight: 700;
      letter-spacing: .03rem;
      line-height: 3rem;
      margin-bottom: 32px;
  }
  h2 {
      font-size: 2rem;
      font-family: ShermanSans,Verdana,sans-serif;
      font-weight: 500;
      line-height: 2.75rem;
      margin-bottom: 24px;
  }
  h4 {
    font-size: 1.25rem;
    font-family: ShermanSans,Verdana,sans-serif;
    font-weight: 500;
    line-height: 2rem;
    margin-bottom: 16px;
}
  h1, h2, h3, h4, h5, h6 {
      margin-top: 0;
      margin-bottom: 0;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
  }
  .font-size-10 {
    
    line-height: 1.4rem;
}
.widget-text p {
  font-size:.875rem;
}
  p {
      margin-top: 0;
     /* font-size: 0.875rem;*/
      font-size: 1rem;
      line-height: 1.5rem;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
  }
  .flex-wrap {
      flex-wrap: wrap !important;
      display: flex;
  }
  .flex-justify-space-between {
      justify-content: space-between !important;
  }
  .flex-justify-start {
      justify-content: flex-start !important;
  }
  main {
    padding: 1.2em;
    transition: margin-left .4s linear;
    position: relative;
  }
  .background-orange-dark {
    background-color: #D74100 !important;
}
.background-blue-primary {
      background-color: #000E54 !important;
  }
  
  .background-orange-dark {
      background-color: #D74100 !important;
  }
  
  .main-right {
    padding-left: 4em;  
  }
.column {
  float: left;
  padding: 10px;
}
.right {
  width: 25%;
}

.left {
  width: 75%;
}
/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
#sul-user-nav a{
  text-decoration: none !important;
}
svg.sul-alert {
    width: 1.25rem;
    height: 1.25rem;
    top: 0px;
    right: 0;
    margin-bottom: 4px;
}
svg.sul-hours {
  width: 1.12rem;
  height: 1.12rem;
  top: 0px;
  right: 0;
  margin-bottom: 4px;
}
svg.sul-help {
    width: 1.25rem;
    height: 1.25rem;
    top: 0px;
    right: 0;
    margin-bottom: 4px;
}
svg.sul-feedback {
    width: 1.25rem;
    height: 1.25rem;
    top: 0px;
    right: 0;
    margin-bottom: 4px;
}
svg.sul-accounts {
    width: 1.25rem;
    height: 1.25rem;
    top: 0px;
    right: 0;
    margin-bottom: 4px;
}
#sul-icon-nav-help{
  display:none;
}
#sul-hours-toggle{
  color:#000E54 ;
  background-color: white;
  font-size:.875em;
  font-weight: bolder;
  height:32px;
  width:170;

}
#sul-hours-toggle:hover{
  background-color:#000E54 ;
  color: white;

}
/*
Footer
*/
footer {
	background: var(--primaryblue);
	color: var(--white);
	padding: 1rem 0;
	font-size: 0.875rem;
}

footer a {
	color: var(--white);
	display: inline-block;
}

footer address {
	font-style: normal;
	line-height: 1.75;
}

footer address a.sul-phone {
	margin-right: 0.75rem;
}

footer address .sul-fax:after {
	content: " fax";
}

footer nav {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-content: center;
	align-items: center;
}

footer nav ul {
	list-style: none;
	padding: 0;
	margin: 1rem 0 0;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-content: baseline;
	align-items: baseline;
	vertical-align: bottom;
	line-height: .8rem;
}

footer nav ul > li {
	margin-bottom: 0;
}

footer nav ul > li > a {
	display: inline-block;
	/*lvertical-align: bottom;
	ine-height: 50px;*/
	font-size: 0.875rem;;
}

footer nav ul li + li {
	margin-left: 1.5rem;
}

footer nav .sul-social-media ul li + li {
	margin-left: .5rem;
}

footer nav .sul-social-media ul > li > a span.icon-socialmedia {
	display: block;
	line-height: 1.125rem;
	padding: 0.125rem .5rem;
}

footer nav a {
	color: var(--white);
}

footer address a.sul-phone:hover,
footer address a.sul-email:hover,
footer nav .sul-footer-links a:hover {
	color: var(--white);
	text-decoration: none;
	outline: var(--white) solid 1px;
	outline-offset: 1px;
}

footer nav a svg {
	width: 1.5rem;
	height: 1.5rem;
}

footer nav a:hover svg {
	color: var(--suorange);
}

footer nav a.sul-tooltip {
	position: relative;
	text-decoration: none;
}

footer nav a.sul-tooltip:hover span,
footer nav a.sul-tooltip:focus span {
	clip: auto;
	height: auto;
	width: auto;
	overflow: auto;
	left: 62.5%;
	bottom: calc(100% + 0.5rem);
	background: var(--lightblue);
	color: var(--white);
	padding: 0.375rem 0.75rem;
	font-size: 0.875rem;
	border-radius: 6px;
	line-height: 1.25rem;
	z-index: 5;
}

footer .sul-copyright {
	text-align: right;
	font-size: 0.875rem;
	margin: 0 0 0 0;
}


@media only screen and (min-width: 992px) {
.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 35px;
    padding-left: var(--bs-navbar-nav-link-padding-x);
}
  .dropdown:hover .dropdown-menu {
    display: flex;
  }
  .dropdown-menu.show {
    display: flex;
  }
}
.dropdown-menu ul {
  list-style: none;
  padding: 0;
}
.dropdown-menu li .dropdown-item {
  font-size: 1em;
 /* padding: 0.5em 1em;*/
 
}

.dropdown-menu li .dropdown-item:hover {
  color:#d74100;
}
.dropdown-menu li:first-child a {
  font-weight: bold;
  font-size: 1.2em;
  text-transform: uppercase;
  color: #000000;
}
/*.dropdown-menu li:first-child a:hover {
  background-color: #f1f1f1;
}*/

ul#sul-user-nav.navbar li:hover  {
  text-decoration: underline;
  outline: 1px dotted var(--primaryblue);
}

/*mobile styles*/
@media only screen and (max-width: 992px) {
  .dropdown-menu-center {
    right: auto;
    left: 0;
    -webkit-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);}
    .sul-right-aside{
      font-size:smaller;
      margin-left:0px;
    }

  .dropdown-menu-left {
      right: auto;
      left: 0;
      -webkit-transform: translate(0, 0);
      -o-transform: translate(0, 0);
      transform: translate(0, 0);
  }
  .navbar {
    background-color: white !important;
  }
  .navbar-toggler{
    background-color:#d74100;
  }
  .dropdown-menu.show {
    flex-wrap: wrap;
    max-height: 350px;
    overflow-y: scroll;
  }
  #navbarSupportedContent {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  border: none;
  border-radius: 0;
  padding: 0.7em;
  background-color: #d74100!important;
  z-index: 9999;
  /*max-width: max-content;*/
  

}
  .navbar-brand{
    display:block;
  
  }
#sul-icon-nav-help{
  display:inline-block;
}
  .logo{
    display:none;
  }
  #logo {
    padding:0px;
    width:250px;
  }
  li.nav-item.dropdown{
  border-bottom: 1px solid navy;
}
.column {
    width: 100%;
  }

}
@media only screen and (min-width: 992px) and (max-width: 1140px) {
  .dropdown:hover .dropdown-menu {
    width: 40vw;
    flex-wrap: wrap;
  }
}