/*-------------colors type formatting-------------*/
//#000000; /*black*/
//#ffffff; /*white*/
//#88898c; /*warm grey*/
//#582C83; /*Sewanee Purple*/
//#00aeef; /*light blue*/
//#f2a03d; /*orange*/
//
//#36383e; /*dark grey*/
//
//rgba(88, 44, 131, 0.31); /*Sewanee Purple 50%*/
//rgba(88, 44, 131, 0.15); /*Sewanee Purple 25%*/
//#56d1ff; /*light blue, 10% lightened*/
//

/*-------------fonts-------------*/
body, button, input, select, optgroup, textarea {
color: #000000; /*black*/
font-family: myriad-variable, Myriad, "Open Sans", sans-serif;
//font-variation-settings: "wght" 300, "wdth" 110;
font-style: normal;
}

body, button, input, select, optgroup, textarea {
font-size: 1.1rem;
}

h1, h2, h3, h4, h5, h6 {
	font-family: Myriad, "Open Sans", sans-serif;
	text-transform: uppercase;
}

h1 {
	font-size: 34px;
	font-weight: 700;
	color: #000000; /*black*/
}

h2 {
	font-size:30px;
	font-weight:400;
	color: #00aeef; /*light blue*/
}

h3 {
	font-size: 28px;
	font-weight: 400;
	color: #88898c; /*warm grey*/
}

h4 {
	font-size: 26px;
	font-weight: 400;
	color: #f2a03d; /*orange*/
}

h5 {
	font-size: 24px;
	color: #000000; /*black*/
}

h6 {
//	background-color:  #00000050; /*black 50%*/
	font-size: 24px;
	font-weight: 400;
	line-height: normal;
	color: #f2a03d; /*orange*/
}

a {
	color: #000000; /*black*/
	background-color: unset;
}

//a:link, a:visited {
//	color:#88898c; /*warm grey*/
//}

a:hover {
	color:#00aeef; /*light blue*/
}


/*-------------header and navigation-------------*/
.main-header__top-bar.container {
display: none;
} /*takes off advanced search bar at top of page*/

.main-header__main-bar.container {
background:  #582C83;
background-image: url("https://omeka-s.sewanee.edu/files/asset/d77c573ec8e65b504007a279b81746cf1503d137.png") ;
background-size: cover;
padding: 10px 0 0;
} /*lets header go all the way to the edge of the screen, but still separates from the top a little*/

@media (min-width: 768px)
.main-header__main-bar.container {
background-color: #582C83; /*Sewanee Purple*/
padding: 10px 0 0;
} /*lets header go all the way to the edge of the screen, but still separates from the top a little*/

.main-header__site-title a img {
max-height: 175px;
margin: 10px;
box-shadow: 0px 0px 6px 2px rgba(0,0,0,0.5); /*black 50%*/
} /*logo height, background color, shadow, margin*/

.main-header--center .main-navigation .navigation>li>a {
margin: 10px 15px;
} /*margin around text part of navigation buttons that affects spacing between, as well as around*/

.main-navigation {
display: inline-flex;
//justify-content: left; /*if inline logo & menu*/
//margin-left: 50px; /*if inline logo & menu*/
justify-content: center;
background-color: #000000; /*black*/
width: 100%;
} /*adds color to navigation bar, stretches across screen, brings everything back to center*/

.main-navigation .navigation {
font-size: 1.2rem;
font-weight: bold;
letter-spacing: 1px;
} /*reduces size of navigation button font*/

.main-navigation .navigation>li>a {
margin: 15px;
color: #ffffff; /*white*/
} /*changes color of navigation menu text*/

.main-navigation .navigation>li.active>a {
font-weight: unset;
} /*should keep the font weight the same, even when active*/

.main-navigation .navigation a:hover, .main-navigation .navigation>li.active>a {
color: #00aeef; /*light blue*/
} /*makes active/hover navigation text turn blue*/

.main-navigation .navigation>li.active>a::after, .main-navigation .navigation>li>a::after {
height: 2px;
background: #00aeef; /*light blue*/
} /*creates the underline on :active or :hover*/

.main-navigation .navigation>li>ul {
width: unset;
left: unset;
box-shadow: inset 0px 3px 0px 0px #f2a03d; /*orange*/
} /*changes width of dropdown navigation, brings it underneath parent, changes the color of the bar at the top*/

.main-navigation .navigation>li>ul a {
color: #ffffff; /*white*/
text-transform: uppercase;
} /*changes text on dropdown navigation*/

.main-navigation .navigation>li:hover>ul, .main-navigation .navigation>li:focus-within>ul {
background-color:  #000000; /*black*/
padding: 15px;
} /*changes background and padding of dropdown navigation*/

ul li {
margin-bottom: unset;
} /*reduces margin under nav buttons*/

//.banner__description {
//white-space: break-spaces;
//font-size: 1.5rem;
//max-width: unset;
//} /*enables "content" on banner to obey line breaks*/

//.banner__heading {
//font-size: unset;
//} /*brings banner "content" down to "normal" size*/

nav.sub-menu {
display: none;
}


/*-------------footer-------------*/
.main-footer__top {
background-color: #88898c; /*warm grey*/
padding: 20px 0;
} /*colors top part of footer*/

@media (min-width: 1024px)
.main-footer__top {
padding: 20px 0;
} /*lessens the margins around top part of footer*/

.main-footer__bottom {
background-color: #000000; /*black*/
} /*colors bottom part of footer*/

.main-footer__col1 {
text-align: center;
} /*aligns logo in footer to center*/

.main-footer__col1 img {
margin-bottom: 0;
} /*lessens margins on bottom part of footer*/

@media (min-width: 1024px)
.main-footer__col1, .main-footer__col3 {
text-align: center;
} /*aligns logo in footer to center*/

@media (min-width: 1024px)
.main-footer__bottom-container {
text-align: center;
} /*aligns copyright in footer to center*/


/*-------------body-------------*/
.assets {
margin-bottom: unset;
} /*lessens the margin under an asset block*/

.container {
max-width: unset;
} /*lets everything stretch from side to side, no matter the size of the window*/

#main-content {
padding-left: 5%;
padding-right: 5%;
background-image: unset;
background-blend-mode: unset;
//background-image: linear-gradient(to right, black, white 10%, white 90%, black), url("https://omeka-s.sewanee.edu/files/asset/e99d169fa285eb6c06488e71c757f6c1d557e0ff.png");
//background-blend-mode: screen;
background-color: #88898c15;
background-size: contain;
background-repeat: repeat;
} /*adds the background image with white gradient overlay, gives some whitespace in the main body*/

@media (min-width: 768px)
.metadata dl>.property dd:not (.sidebar-region .metadata dl>.property dd) {
margin-left: 175px;
}

@media (min-width: 1024px)
#main-content {
padding-left: 100px;
padding-right: 100px;
} /*gives some whitespace around the main body*/


/*-------------Home, About & Browse pages only-------------*/
//body.page.site-page-home .main-header {
//position: fixed;
//top: 0;
//z-index: 9999;
//}

//.site-page-home #main-content {
//padding-left: 20%;
//padding-right: 20%;
//background-image: linear-gradient(to right, black, white 10%, white 90%, black), url("https://omeka-s.sewanee.edu/files/asset/e99d169fa285eb6c06488e71c757f6c1d557e0ff.png");
//background-blend-mode: screen;
//}

//.site-page-about #main-content {
//padding-left: 20%;
//padding-right: 20%;
//background-image: linear-gradient(to right, black, white 10%, white 90%, black), url("https://omeka-s.sewanee.edu/files/asset/e99d169fa285eb6c06488e71c757f6c1d557e0ff.png");
//background-blend-mode: screen;
//}

//.site-page-people #main-content {
//padding-left: 20%;
//padding-right: 20%;
//background-image: linear-gradient(to right, black, white 10%, white 90%, black), url("https://omeka-s.sewanee.edu/files/asset/e99d169fa285eb6c06488e71c757f6c1d557e0ff.png");
//background-blend-mode: screen;
//}

//.site-page-stories #main-content {
//padding-left: 20%;
//padding-right: 20%;
//background-image: linear-gradient(to right, black, white 10%, white 90%, black), url("https://omeka-s.sewanee.edu/files/asset/e99d169fa285eb6c06488e71c757f6c1d557e0ff.png");
//background-blend-mode: screen;
//}


/*-------------item page only-------------*/
body.item.resource.show .main-header {
position: sticky;
top: -210px !important;
z-index: 999;
} /*makes header sticky*/

body.item.resource.show.main-header--center {
padding-top: 0 !important;
} /*keeps header at top when sticky*/

body.item.resource.show .regions-container {
gap: 20px;
}

body.item.resource.show .regions-container .sidebar-region {
width: 50%;
height: 500px;
overflow: auto;
position: unset;
background-color: white;
border-top: 10px solid white;
padding: 15px;
}

body.item.resource.show .title {
border-bottom: 1px solid #88898c50;
}

.item.resource.show #main-content.container {
padding-left: 5%;
padding-right: 5%;
} /*adjusts padding so that the content can have more horizontal space*/

.item.resource.show .regions-container {
background-color: white;
padding: 10px;
}

.item.resource.show .item-sets {
display: none;
} /*removes Item Sets list*/

.item.resource.show .media-embeds {
clear: left;
width: 50%;
}

.item.resource.show .media-render.youtube {
//text-align: center;
display: none;
} /*removes video media from page*/

.item.resource.show .media-list {
//display: none;
//float: left;
float: right;
clear: right;
width: 50%
} /*affects media list*/

//.item.resource.show a.resource-link :not(img[alt*="Black Lives Matter"]) {
//display: none;
//} /*hides links that don't have alt that contains "Black Lives Matters"*/

//.item.resource.show .media-list .property dt {
//display: none;
//}

.item.resource.show #resources-linked.resources-linked {
display: none;
}

.item.resource.show p.media-parent-item.textcenter {
display: none;
} /*removes "Part of..."*/

.item.resource.show #uv-1 {
display: none;
} /*Universal Viewer at the bottom of the item page*/

.item.resource.show .metadata > dl >div  {
clear: both;
}

.item.resource.show .metadata dl {
display: flex;
flex-direction: column;
}

.item.resource.show .metadata dl>.property dt {
//padding-right: unset;
}

@media (min-width: 768px)
 .item.resource.show .metadata dl>.property dd:not(.sidebar-region .metadata dl>.property dd) {
margin-left: 10px;
}


/*-------------media page only-------------*/
body.media.resource.show .main-header {
position: sticky;
top: -210px !important;
z-index: 9999;
} /*makes header sticky*/

body.media.resource.show.main-header--center {
padding-top: 0 !important;
} /*keeps header at top when sticky*/

body.media.resource.show .metadata dl>.property dd {
margin: 0 10px 1rem;
} /*margin around metadata on media page*/

body.media.resource.show .metadata dl>.property:first-child {
display: none;
} /*hides title since it's already at the top of the page*/

body.media.resource.show .metadata dl>.property:nth-child(4) {
display: none;
} /*hides description*/

body.media.resource.show .regions-container {
gap: 20px;
} /*space between the viewer and the transcript*/

body.media.resource.show .regions-container .sidebar-region {
width: 50%;
height: 500px;
overflow: auto;
position: unset;
background-color: white;
border-top: 10px solid white;
padding: 15px;
} /*affects the two columns of the media page*/

body.media.resource.show .title {
border-bottom: 1px solid #88898c50;
} /*the line under the title*/

body.media.resource.show #main-content {
background-color: #88898c15;
} /*super light grey background*/

body.media.resource.show h1 {
margin-bottom: 1.5rem;
} /*space below title*/


/*-------------Meet the People-------------*/
body.page.site-page-people .resource-list .resource {
display: inline-flex;
transform: unset;
width: 22% !important;
flex-wrap: wrap;
justify-content: center;
margin: 10px;
padding: 10px;
box-sizing: border-box;
flex-direction: column;
align-items: center;
height: 400px;
}

body.page.site-page-people .resource.item h4 {
text-align: center;
font-size: 20px;
height: 60px;
margin: 0;
overflow: auto;
}

body.page.site-page-people .resource.item .description {
text-align: center;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
margin-bottom: 10px;
height: 52px;
white-space: break-spaces;
}

body.page.site-page-people .resource.item .item-buttons {
display: inline-flex;
position: relative;
bottom: auto;
gap: 10px;
flex-direction: row-reverse;
} /*lines up buttons*/

body.page.site-page-people .resource.item a img {
//object-fit: contain;
//object-position: bottom;
//border: 1px solid rgba(51,51,51,.25);
box-shadow: 0px 1px 6px rgba(51,51,51,.25);
}

body.page.site-page-people .resource.item .item-thumbnail {
height: 200px;
width: 150px;
object-fit: cover;
object-position: top;
}

body.page.site-page-people .resource-list .resource__thumbnail {
margin: auto 15px auto;
order: 0; /*moves thumbnail from left to right of content*/
} /*affects spacing around LIST thumbnails on People page*/

body.page.site-page-people .resource-grid .resource__thumbnail {
text-align: center;
} /*affects spacing around GRID thumbnails on People page*/

body.page.site-page-people .resource-grid .resource__thumbnail img {
padding: 15px 15px 0;
aspect-ratio: 1; /*makes thumbnails all the same size reguardless of orientation, therefore the resource boxes will all be the same size*/
} /*affects spacing around GRID thumbnails on People page*/



//.description.ellipsis {
//display: none;
//display: inline-flex;
//flex-wrap: wrap;
//justify-content: space-evenly;
//}


/*-------------Hear the Stories-------------*/
body.page.site-page-stories .item-thumbnail {
height: 150px;
width: 200px;
object-fit: contain;
object-position: center;
background-color: #36383e; /*dark grey*/
padding: 5px;
float: left;
max-width: unset;
}

body.page.site-page-stories .item-title h4 {
font-size: 23px;
font-weight: 600;
text-transform: unset;
}

body.page.site-page-stories .resource.media > div {

} /*the created div containing the title and description*/ 

body.page.site-page-stories .item-info {
padding-left: 10px;
}

body.page.site-page-stories .resource-list .resource {
padding: 10px;
margin: 15px;
}


/*-------------modal-------------*/
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 9999; /* Sit on top */
  left: 10%;
  top: -12%;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color--Black w/ no opacity */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  margin-top: 15%;
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  width: 80%; /* Could be more or less, depending on screen size */
  height: 75%; /* Could be more or less, depending on screen size */
  max-width: 1250px;
  background-color: #ffffff; /*white*/
  border: 1px solid#00aeef; /*light blue*/
  outline: 5px solid #00aeef; /*light blue*/ /*ridge instead of solid?*/
  outline-offset: 5px;
  box-shadow: 0px 0px 15px 15px #00000050; /*Black 50%*/
}

.modal.modal-content section.col-container {
display: flex;
}

.modal.modal-content .col-single:nth-child(odd) {
padding-right:10px;
}

.modal.modal-content .col-single:nth-child(even) {
padding-left: 10px;
}

/* The Close Button */
.close {
  float: right;
  font-size: 30px;
  font-weight: bold;
  padding: 0px 10px;
  color: #f2a03d; /*orange*/
  border: 2px solid #f2a03d; /*orange*/
  border-radius: 4px;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 0 5px 0px #f2a03d inset, 0px 0px 2px 2px #00000050; /*change the inset to white? change the black 50% to inset?*/
  //border: 2px solid #000000; /*Black*/
  //background-color: #00000025; /*Black 25%*/
}