/*
  Chegg ad styles.
  Goal is to keep the ad containers fixed sizes to avoid things jumping around
  as the page loads. The ad containers are fixed to the maximum size of the
  different types of ads.
*/

/* All ad containers */
#top_ad, #side_ad {overflow: hidden; display: flex; justify-content: center; align-items: center;}

/* Top ad; max size is 728x90 on desktop, 320x50 on mobile */
#top_ad {height: 90px; margin: 1rem 0 0 0;}

/* Side ad; max size is 401x292 on desktop, 300x250 on mobile */
#side_ad {width: 401px; height: 292px; justify-content: flex-start;}
@media only screen and (max-width: 767px) {
  #side_ad {width: 100%;}
}


/* Layout alterations */

/* Icon styling */
img.icon {display: inline-block; width: 1em; height: 1em; position: relative; top: 0.15em;}
.content__side-nav>ul>li .side-nav:before {
 content: url('/images/icons/dropdown.svg');
 width: 0.75rem;
 height: 0.75rem;
 position: absolute;
 top: 1rem;
 right: 0;
}

/* Top navigation */
.header__mainNav {opacity: 1.0;}
.header__mainNav .header__mainNav--main {transition: height 0.3s ease-out;}
.header__mainNav .header__mainNav--tabs .is-active-tab span {padding-right: 0.3em;}
@media (max-width: 990px) {
    /* On mobile, don't show menu icon on active tab, there is already a mobile menu button */
    .header__mainNav .header__mainNav--tabs .is-active-tab span {display: none;}
}

/* Container for sidebar and content box */
.content__content .row {justify-content: flex-start;column-gap: 1rem;}

/* Sidebar */
.content__aside {width: 401px; flex: 1 0 auto;}
@media only screen and (max-width: 767px) {
  .content__aside {width: 100%;}
}

/* Side navigation */
.content__side-nav > ul > li a {padding-left: 1rem;}
.content__side-nav a.current {background: #eee; color: #000;}

/* Content box */
.content__main {width: auto; flex: 1 1 auto; margin-bottom: 1rem;}
.content__group {font-size: 1.1875rem; line-height: 30px;}

/* Breadcrumbs */
.content__main .content__breadcrumb {display: flex; justify-content: flex-start; background: none; padding: 0 0 1rem 0; opacity: 0.7;}
.content__main .content__breadcrumb ul {display: flex; flex-flow: row wrap;}
.content__main .content__breadcrumb ul li {font-size: 1rem;}

/* Sidebar search box */
.content__aside #owl_search_container {height: 2.5rem; overflow: hidden;}
.content__aside #owl_search_container table {margin: 0;}
.content__aside .gsc-control-searchbox-only td, .content__aside .gsc-control-searchbox-only form {border: none; padding: 0 !important;}
.content__aside .gsc-control-searchbox-only td {line-height: 1.0; background: #fff;}
.content__aside .gsc-control-searchbox-only input, .content__aside .gsc-control-searchbox-only button {width: 100% !important; font-size: 1rem !important; padding: 0.5rem !important;}
.content__aside .gsc-control-searchbox-only input {background-image: none !important;}
.content__aside .gsc-control-searchbox-only button {padding: 0.5rem 1rem !important; border: none !important; margin: 0 !important; background: #000; border-radius: 0; cursor: pointer;}
.content__aside td.gsc-search-button {background: #000;}
.gssb_c td {background: #fff;}


/* Special content groups */

/* Info banners (e.g. on-campus writing lab reminder) */
.owl_info_banner {background-color: #ebd99f; padding: 1rem; margin-bottom: 1rem;}
.owl_info_banner p:last-child {margin-bottom: 0;}

/* Tile links */
.tile-links ul {margin: 2rem 0; padding: 0; display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: stretch; gap: 1.5rem;}
li.tile-link {display: block; box-sizing: border-box; width: 30%; min-width: 200px; padding: 1rem; box-shadow: 5px 5px 1rem #888; transition: box-shadow 0.2s;}
li.tile-link:hover {box-shadow: 0px 0px 0.7rem #ccc;}
li.tile-link a {display: block; width: 100%; height: 100%; font-weight: normal; text-decoration: none;}
h3.tile-title {color: #8e6f3e; font-size: 1.5rem; font-weight: bold; font-family: acumin-pro-semi-condensed, "Franklin Gothic", sans-serif; margin: 0 0 1rem 0;}
p.tile-description {font-size: 0.9rem; line-height: normal;}


/* Random stuff on pages */

/* Styling for Chegg widgets */
/* This is needed because the widgets try to use Bootstrap, which we can't use anymore (it breaks the new templates) */
/* TODO: remove this if Chegg ever updates their script to not use Bootstrap */
.CM-widget-container .container-fluid {padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto;}
.CM-widget-container .row {width: auto; margin-right: -15px; margin-left: -15px;}
.CM-widget-container .col-md-12 {position: relative; width: 100%; float: left; padding-right: 15px; padding-left: 15px;}
.CM-widget-container h3 {font-weight: 500;}
.CM-widget-container form {width: 100%;}
.CM-widget-container .col-md-3 {position: relative; width: 25%; float: left;}
.CM-widget-container .col-md-6 {position: relative;width: 50%;float: left;}
.CM-widget-container .form-control {display: inline-block; vertical-align: middle; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc;}
.CM-widget-container .input-lg {height: 46px; padding: 10px 16px; font-size: 18px; line-height: 1.3333333;}
.CM-widget-container .btn[disabled], .CM-widget-container fieldset[disabled] .btn {cursor: not-allowed; filter: alpha(opacity=65); box-shadow: none; opacity: .65;}
.CM-widget-container .btn-lg {padding: 10px 16px; font-size: 18px; line-height: 1.3333333; border-radius: 6px;}
.CM-widget-container .btn {display: inline-block; margin-bottom: 0; font-weight: 400; text-align: center; white-space: nowrap; vertical-align: middle; touch-action: manipulation; cursor: pointer; user-select: none; border: 1px solid transparent;}
.CM-widget-container .cm_widget_footer_right img {display: inline;}
.CM-widget-container .cm_widget_footer_right > * {vertical-align: middle;}


/* Styling for embeds (e.g. Powerpoints) */
.embed-responsive-4by3 {
    aspect-ratio: 4/3;
}
.embed-responsive iframe {
  width: 100% !important;
  height: 100% !important;
  box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.35);
}
.content__main iframe{/*lazy failsafe*/
    min-height: 750px;
}

/* Images with captions use the .thumbnail class */
.thumbnail {margin: 1rem 0;}
.thumbnail img {display: block !important; margin: 0 auto !important;}
.thumbnail .caption {font-size: 1rem; text-align: center;}
.thumbnail .caption p {font-size: inherit;}


/* Legacy styles (pre-2022 update) */
.example{
  padding: 25px 0px 25px 50px;
  font-family: "source-serif-pro", Georgia, Courier, serif;
}
.subsection{
 /*alternative to the example class*/
  margin-left: 25px;
  margin-top: 15px;
  margin-bottom: 15px;
}
.citation{
  text-indent: -25px;
  padding-left: 25px !important;
 /* so the citation doesn't overflow past its border */
}
.indent1{
  text-indent: 25px;
}
.indent2{
  text-indent: 50px;
}
.example-paper, .samplepaper{
  padding: 5em;
  width: 100%;
  max-width: 8.5in;
 /*standard page width*/
 /*color taken from original OWL*/
  background-color: #FEFFF2;
  box-shadow: 0px 10px 6px -6px #777;
  border: 1px solid #b7b7b7;
  border-radius: 2px;
 /* make it look a little less digital */
 /*at least standard page height (change or eliminate this if it causes ugly web pages)*/
  font-family: "Times New Roman", Times, serif;
}
/*this CSS is far from perfect, but this query here tries to make sure that example papers appear properly sized on smaller screens*/
@media screen and (max-width: 600px){
  .example-paper, .samplepaper{
    padding: 2em;
 }
  .example-paper *, .samplepaper *{
    font-size: .75em;
    line-height: 1.42857143;
 }
}
/*flexbox is a convenient way to set up columns and stuff inside example papers*/
/*hooray for flexbox*/
.flexbox-row{
  display: flex;
}
.flexbox-cell{
  flex: 1;
}
.flexbox-gallery{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
}
.flexbox-item{
  max-width: 50%;
}
/*this specifically targets the summary boxes at the top of every page, because they look a bit too much like a warning*/
/*hidden indefinitely*/
.content__main .alert.alert-warning{
  display: none;
  border: 2px solid #dedede;
  background-color: white;
  border-radius: 2px;
}
/*color styles*/
 .blue{
   font-weight: bold;
   color: #3300CC;
}
 .red{
   font-weight: bold;
   color: #ae0000;
}
 .green{
   font-weight: bold;
   color: #2e5c00;
}
 .orange{
   font-weight: bold;
   color: #7a4901;
}
/*Print styling */
 .printinfo{
   display:none;
}
 @media print {
   .printinfo {
     display: block;
  }
   .right {
     float:none;
  }
}
/*****************/
/*news section*/
 .bio{
   color: #4f4e4e;
   font-style: italic;
}
/**************/
/*newsletter*/
 #weekly-writer-title{
   display: flex;
   align-items: center;
}
 #weekly-writer-title h1{
   margin-left: .5em;
}
 #hours-of-operation{
   color: black;
}
 #hours-of-operation p{
   padding: 0px 0px 0px 0px;
}