@charset "UTF-8";
/*
WORDPRESS THEME HEADER
Theme Name: redesign
Theme URI: N/A
Author: The YDN Tech Team
Author URI: N/A
Description: A theme by the Yale Daily News, for the Yale Daily News.
Version: 2.0
Text Domain: redesign
*/
/*a, html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	background: transparent;
	position: relative;
	box-sizing: border-box;
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box;
}**/
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
  position: relative;
}

/*body {
  line-height: 1;
}

ul {
  list-style: none;
}

ol {
  list-style: decimal;
}

blockquote, q {
	quotes: none;
	&:before, &:after {
		content: '';
		content: none;
	}
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

del {
	text-decoration: line-through;
}

abbr[title], dfn[title], acronym[title] {
	border-bottom: 1px dotted;
	cursor: help;
}

input, select {
	vertical-align: middle;
}

i, em {
	font-style: oblique;
	i, em {
	font-style: normal;
	}
}

b, strong {
	font-weight: bold;
}

a:focus {
	outline: 1px dotted;
}*/
a {
  text-decoration: none;
  color: inherit;
}

/*COLORS OF THE HEADERS OF EACH SECTION/CATEGORY PAGE*/
.University-heading {
  color: #1a6075;
}

.Opinion-heading {
  color: #df9100;
}

.City-heading {
  color: #8e0012;
}

.Sci-Tech-heading {
  color: #145141;
}

.Sports-heading {
  color: #1a317c;
}

.Weekend-heading {
  color: #3593b7;
}

.Arts-heading {
  color: #9f4482;
}

.Multimedia-heading {
  color: #781788;
}

.Magazine-heading {
  color: #C33C1F;
}

/* STYLING TO MAKE ADS RESPONSIVE */
.mid-banner span {
  display: inline-block;
  width: 100%;
  height: auto;
}

.mid-banner a {
  display: inline-block;
  width: 100% !important;
  height: auto !important;
}

.mid-banner img {
  width: 100%;
  height: auto !important;
}

.mid-banner {
  width: 100%;
  height: 100% !important;
  display: flex;
  justify-content: center;
  margin: 0 auto;
  flex-direction: column;
}

#middle-ad-mobile img {
  width: 100%;
  height: auto !important;
}

.section-title {
  margin-bottom: 1rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  .section-title {
    padding-top: 0.6rem;
  }
}

/* GENERAL STYLING FOR ALL AUTHORS AND TITLES */
.title {
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  color: black;
}

.article-author {
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
  font-weight: normal;
  color: #656565;
}
@media screen and (max-width: 768px) {
  .article-author {
    margin-top: 2% !important;
  }
}

.element {
  background-clip: content-box;
  /* for testing purposes
  to make it easier to see padding and margins*/
  padding: 1.5vw;
}

/* GENERAL STYLING FOR ALL ARTICLE IMGS AND CAPTIONS */
[class$=-frame] > img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

[id$=-frame] > img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

figcaption {
  text-align: right;
  font-size: 0.6rem;
  color: #656565;
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
}

/*.article-div {
    color: black;
}*/
/* STYLE FOR GRID 1 */
#a1 {
  padding: 1vh 2.5vw;
  height: max-content;
}

#grid1 {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 2fr 0.9fr;
  grid-template-columns: repeat(14, 1fr);
}
@media screen and (max-width: 768px) {
  #grid1 {
    display: flex;
    flex-direction: column;
  }
}

/* STYLE FOR MAIN ARTICLE IN GRID 1*/
#main-feature {
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 1;
  grid-row-end: 3;
  border-right: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #main-feature {
    grid-column: 1;
    grid-row: 1;
    border-bottom: 1px solid #707070;
    border-right: 0;
  }
}

#featured-imgbox {
  margin-bottom: 10%;
}

.featured-frame {
  width: 35vw;
  margin: 0 auto;
  height: 21.2vw;
}
@media screen and (max-width: 768px) {
  .featured-frame {
    width: 90vw;
    height: 50vw;
  }
}

#featured-textbox {
  margin: 5% 0%;
  max-width: 90%;
  padding: 1vh 3vw;
  text-align: center;
}

#featured-section-and-author {
  font-size: 1em;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  color: black;
}

#main-feature-author {
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
  color: #656565;
}

#featured-section-and-author > #divider {
  color: black;
}

#featured-title {
  font-family: "ModernoFBCond-Regular";
  font-weight: 900;
  font-size: 1.8em;
}

#featured-blurb {
  font-family: "ModernoFB-Regular", "Times New Roman", Times, serif;
  color: #656565;
  font-size: 1.2em;
}

/* END OF STYLE FOR MAIN ARTICLE IN GRID 1*/
/* STYLE FOR LIST OF SUB-MAIN ARTICLES IN GRID 1*/
#sub-main-list {
  display: flex;
  justify-content: space-evenly;
  flex-direction: column;
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 1;
  grid-row-end: 3;
}
@media screen and (max-width: 768px) {
  #sub-main-list {
    grid-column: 1;
    grid-row: 2;
    min-height: 50vh;
  }
}

.sub-main-section-name {
  font-size: 0.8em;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  color: black;
  margin-bottom: 2%;
}

.sub-main-blurb {
  font-family: "ModernoFB-Regular", "Times New Roman", Times, serif;
  font-size: 0.9em;
}
@media screen and (min-width: 2000px) {
  .sub-main-blurb {
    font-size: 1.3rem;
  }
}

.right-img-article {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 100%;
  flex-direction: row;
  padding-left: 0;
  margin-left: 0;
  padding-right: 0%;
}

.right-img-article-textbox {
  padding-left: 0%;
  padding-right: 6%;
  max-width: 94%;
  width: 100%;
  /*remaining space-img box*/
  height: auto;
}

.sub-main-imgbox {
  width: 10vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .sub-main-imgbox {
    width: 42vw;
  }
}

.sub-main-frame {
  width: 10vw;
  height: 10vw;
  border: 0.5px solid #707070;
}
@media screen and (max-width: 768px) {
  .sub-main-frame {
    width: 42vw;
    height: 28vw;
  }
}

.sub-main-imgbox > img {
  max-width: 100%;
  height: auto;
  border: 0.5px solid #707070;
}

.article-author.sub-main {
  margin-bottom: 2%;
  font-size: 0.8rem;
}

.title.sub-main {
  margin-bottom: 2%;
  font-size: 1.1rem;
}

.right-img-article figcaption {
  font-size: 0.6em;
}

/* END OF STYLE FOR LIST OF SUB-MAIN ARTICLES IN GRID 1*/
/* START OF STYLE FOR OPINION SECTION */
#opinion-section {
  color: #df9100;
  border-left: 2px solid #707070;
  grid-column-start: 12;
  grid-column-end: 15;
  grid-row-start: 1;
  grid-row-end: 3;
}
@media screen and (max-width: 768px) {
  #opinion-section {
    border-left: 0;
    min-height: auto;
    border-top: 2px solid #707070;
  }
}

#opinion-list {
  /* calculate height by subtracting section title (1.1rem font, 1rem padding) 
  and padding from element (1.5vw top and bottom) */
  height: calc(100% - 2.2rem - 3vw);
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}

.opinion-article {
  margin-bottom: 0.3em;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .opinion-article {
    border-top: 0.5px solid #cbcbcb;
    padding: 1rem 0rem;
    align-items: center;
  }
}

#opinion-with-photo {
  display: flex;
  flex-direction: row;
}

.opinion-text-no-photo {
  color: black;
}

.opinion-text-with-photo {
  margin-right: 3%;
  text-align: left;
  width: 97%;
  color: black;
  display: inline-block;
}

.opinion-role {
  font-size: 0.8rem;
  color: #656565;
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
}

.opinion-author,
.opinion-title {
  width: 100%;
  font-size: 1.15rem;
  font-family: "ModernoFB-RegularItalic", "Times New Roman", Times, serif;
}

.opinion-imgbox {
  position: relative;
  right: 0;
  width: 22%;
  min-width: 22%;
  max-width: 22%;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .opinion-imgbox {
    width: 18%;
    min-width: 18%;
    max-width: 18%;
  }
}

#opinion-section a {
  min-width: 78%;
  max-width: 78%;
  width: 78%;
}
@media screen and (max-width: 768px) {
  #opinion-section a {
    min-width: 82%;
    max-width: 82%;
    width: 82%;
  }
}

.opinion-imgbox > img {
  max-width: 100%;
  height: auto;
  border: 0.5px solid #707070;
  /*img must be square for it to be cropped into circle*/
  border-radius: 50%;
}

/* END OF STYLE FOR OPINION SECTION */
/* START OF STYLE FOR COVID SECTION */
#covid {
  display: flex;
  flex-direction: row;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  border-top: 2px solid #707070;
  grid-column-start: 7;
  grid-column-end: 15;
  grid-row-start: 2;
  padding: 0.3rem;
}
@media screen and (max-width: 768px) {
  #covid {
    grid-column: 1;
    grid-row: 4;
    flex-direction: column;
    flex-flow: column-reverse;
    max-height: none;
  }
}

#covid-header {
  margin-bottom: 0.3rem;
  color: #A34D03;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}

#covid-subhead {
  margin-bottom: 0.6rem;
  text-transform: uppercase;
  color: #656565;
  font-family: "BentonSans-Regular", Arial;
  font-size: 0.9rem;
}

#covid-info {
  width: 60%;
  margin: 0 auto;
  padding: 0 0 0 1rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  #covid-info {
    width: 100%;
    padding: 1rem 0rem 0 0rem;
  }
}

#covid-graph {
  width: 40%;
}
@media screen and (max-width: 768px) {
  #covid-graph {
    width: 100%;
  }
}

/* END OF STYLE FOR COVID SECTION */
/* STYLE FOR GRID 2 */
#a2 {
  padding: 1vh 2.5vw;
  height: max-content;
}

#grid2 {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 0.5fr 2fr;
  grid-template-columns: repeat(14, 1fr);
  border-bottom: 2px solid #707070;
}
@media screen and (max-width: 768px) {
  #grid2 {
    border-bottom: 0;
    display: flex;
    flex-direction: column;
  }
}

#top-ad {
  grid-column-start: 1;
  grid-column-end: 9;
  grid-row-start: 1;
  margin-bottom: 0.1em;
  overflow-wrap: break-word;
}
@media screen and (max-width: 768px) {
  #top-ad {
    height: auto;
  }
}

/* START OF STYLE FOR UNIVERSITY SECTION */
#university-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-columns: repeat(3, 1fr);
  height: max-content;
  /*@media screen and (min-width: 769px) and (max-width: 1100px){
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: 1fr .5fr;
  }*/
}
@media screen and (max-width: 768px) {
  #university-grid {
    display: flex;
    flex-direction: column;
  }
}

#university-section {
  grid-column-start: 1;
  grid-column-end: 9;
  grid-row-start: 2;
  grid-row-end: 4;
  color: #004e66;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
}
@media screen and (max-width: 768px) {
  #university-section {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    border-bottom: 2px solid #707070;
  }
}

@media screen and (min-width: 769px) and (max-width: 1100px) {
  #final-university-article {
    display: none;
  }
}

#left-university,
#middle-university,
#right-university {
  padding-bottom: 0.1em;
}

#left-university {
  grid-column-start: 1;
  grid-column-end: 2;
}

#middle-university {
  grid-column-start: 2;
  grid-column-end: 3;
  border-right: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #middle-university {
    border-right: none;
  }
}

#right-university {
  margin-left: calc(8% - 0.5em);
  grid-column-start: 3;
  grid-column-end: 4;
  /*@media screen and (min-width: 769px) and (max-width: 1100px){
      grid-column-start: 1;
      grid-column-end: 3;
      grid-row-start: 2;
  }*/
}
@media screen and (max-width: 768px) {
  #right-university {
    margin-left: 0;
  }
}

#university-list {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  /*@media screen and (min-width: 769px) and (max-width: 1100px){
      flex-direction: row;
  }*/
}

/* END OF STYLE FOR UNIVERSITY SECTION */
/* START OF STYLE FOR MULTIMEDIA SECTION */
#multimedia-section {
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #712e6e;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  border-left: 2px solid #707070;
  grid-column-start: 9;
  grid-column-end: 15;
  grid-row-start: 1;
  grid-row-end: 4;
  overflow-y: auto;
  height: auto;
  /*fix this for line*/
  /*background-color: #71ff64;*/
}
@media screen and (max-width: 768px) {
  #multimedia-section {
    min-height: auto;
    width: 100%;
    border-left: 0;
  }
}

#podcast-section {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin: 0;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #podcast-section {
    align-self: center;
  }
}

#ytv-section {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  #ytv-section {
    align-self: center;
  }
}

#ytv-title {
  font-size: 1.2rem;
  color: black;
  text-align: center;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  width: 80%;
  margin: 3% auto;
  padding: 1% 0;
  border-top: 0.5px solid black;
  border-bottom: 0.5px solid black;
}
@media screen and (max-width: 768px) {
  #ytv-title {
    width: 80vw;
    align-self: center;
  }
}

#homepage-video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
}

#homepage-video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*#ytv-blurb {
    font-size: .9rem;
    color: black;
    font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
}*/
/* END OF STYLE FOR MULTIMEDIA SECTION */
/* END OF STYLE FOR GRID 2 */
/* STYLE FOR GRID 3 */
#a3 {
  height: max-content;
  padding: 1vh 2.5vw;
}

#grid3,
.section-page-grid1 {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5em;
  grid-template-rows: repeat(14, 1fr);
  grid-template-columns: repeat(16, 1fr);
}
@media screen and (max-width: 768px) {
  #grid3,
.section-page-grid1 {
    border-top: none;
    display: flex;
    flex-direction: column;
  }
}

/* START OF SCITECH TOPIC 2 STYLE */
#scitech-section,
.top2-section {
  padding-left: 0.5vw;
  padding-right: 0.5vw;
  color: #0e7037;
  border-right: 2px solid #707070;
  display: flex;
  flex-direction: column;
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 1;
  grid-row-end: 12;
}
@media screen and (max-width: 768px) {
  #scitech-section,
.top2-section {
    grid-column: 1;
    grid-row: 3;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: auto;
  }
}

#scitech-list,
.top2-list {
  margin: 0%;
  text-transform: none;
  overflow-y: auto;
  /*get overflow to expand*/
  height: 100%;
  justify-content: space-between;
  display: flex;
  flex-direction: column;
}
#scitech-list article,
.top2-list article {
  margin-bottom: 1em;
}

/* END OF SCITECH STYLE */
#middle-ad-desktop {
  border-top: 2px solid #707070;
  grid-column-start: 7;
  grid-column-end: 17;
  grid-row-start: 12;
  grid-row-end: 15;
}
@media screen and (max-width: 768px) {
  #middle-ad-desktop {
    display: none;
  }
}

#middle-ad-mobile {
  display: none;
}
@media screen and (max-width: 768px) {
  #middle-ad-mobile {
    display: flex;
  }
}

/* START OF STYLE FOR CITY SECTION */
.city-grid,
.top1-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 0.8fr 1fr;
  grid-template-columns: 1fr 1.2fr;
}
@media screen and (max-width: 768px) {
  .city-grid,
.top1-grid {
    display: flex;
    flex-direction: column;
  }
}

#city-section,
.top1-section {
  color: #b40017;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 1;
  grid-row-end: 15;
  border-right: 2px solid #707070;
}
@media screen and (max-width: 768px) {
  #city-section,
.top1-section {
    grid-column: 1;
    grid-row: 2;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: auto;
  }
}

@media screen and (max-width: 768px) {
  #city-section {
    border-top: 2px solid #707070;
  }
}

#top-city,
.top-topic1 {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #707070;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
}
@media screen and (max-width: 768px) {
  #top-city,
.top-topic1 {
    /* grid-column: 1; //with respect to city sub-grid
    grid-row: 1; */
    border-bottom: none;
  }
}

#bottom-left-city,
.bottom-left-top1 {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 2;
  /* .5em right padding here rather than the full 1em 
      (like the bottom-right-section)
      because .5 em grid gap falls on 
      this side*/
  padding-right: 0.5em;
}
@media screen and (max-width: 768px) {
  #bottom-left-city,
.bottom-left-top1 {
    /* grid-column: 1;
    grid-row: 2;*/
  }
}

#city-list,
.top1-list {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#bottom-right-city,
.bottom-right-top1 {
  border-left: 1px solid #707070;
  padding-left: 1em;
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 2;
}
@media screen and (max-width: 768px) {
  #bottom-right-city,
.bottom-right-top1 {
    grid-column: 1;
    grid-row: 3;
    border-left: none;
    padding-left: 0;
    border-top: 0.5px solid #cbcbcb;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

/* END OF STYLE FOR CITY SECTION */
/* START OF STYLE FOR SPORTS SECTION */
.sports-grid,
.top3-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 1.5fr 1fr;
  grid-template-columns: 1fr 1fr;
}
@media screen and (max-width: 768px) {
  .sports-grid,
.top3-grid {
    display: flex;
    flex-direction: column;
    grid-template-rows: repeat(3, 1fr);
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 768px) {
  #sports-section .article-no-picture, #city-section .article-no-picture, #university-section .article-no-picture, #scitech-section .article-no-picture, .top2-list .article-no-picture {
    border-top: 0.5px solid #cbcbcb;
  }
}

#sports-section,
.top3-section {
  color: #1a317c;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  display: flex;
  justify-content: start;
  flex-direction: column;
  grid-column-start: 12;
  grid-column-end: 17;
  grid-row-start: 1;
  grid-row-end: 12;
  padding-left: 0.5vw;
}
@media screen and (max-width: 768px) {
  #sports-section,
.top3-section {
    grid-column: 1;
    grid-row: 4;
    padding: 0;
    min-height: auto;
    padding: 0.5rem;
  }
}

#top-left-sports,
.top-left-top3 {
  grid-column-start: 1;
  grid-row-start: 1;
}

#top-right-sports,
.top-right-top3 {
  grid-column-start: 2;
  grid-row-start: 1;
}
@media screen and (max-width: 768px) {
  #top-right-sports,
.top-right-top3 {
    grid-column: 1;
    grid-row: 2;
    border-top: 0.5px solid #cbcbcb;
    padding-top: 1rem;
  }
}

#bottom-sports,
.bottom-top3 {
  border-top: 1px solid #707070;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 2;
}
@media screen and (max-width: 768px) {
  #bottom-sports,
.bottom-top3 {
    grid-column: 1;
    grid-row: 3;
    border-top: none;
  }
}

#sports-list,
.top3-list {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}

/* END OF STYLE FOR SPORTS SECTION */
/* STYLE FOR GRID 4 */
#a4 {
  padding: 1vh 2.5vw;
  height: auto;
}
@media screen and (max-width: 768px) {
  #a4 {
    height: min-content;
    /* so that footer apears all the way at bottom on mobile */
  }
  #a4 .home-grid-corner {
    padding-bottom: 0;
  }
}

.mag-grid,
.wknd-or-arts-grid,
.top4-or-top5-grid {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 768px) {
  .mag-grid,
.wknd-or-arts-grid,
.top4-or-top5-grid {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, 1fr);
    display: flex;
    flex-direction: column;
    padding-bottom: 1rem;
    border-right: 0;
  }
}

#wknd-grid, #top5-grid {
  justify-content: start;
}

#grid4,
.section-page-grid2 {
  display: grid;
  width: 100%;
  height: auto;
  grid-gap: 0.5rem;
  grid-template-rows: 1fr;
  grid-template-columns: repeat(5, 1fr);
}
@media screen and (max-width: 768px) {
  #grid4,
.section-page-grid2 {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(5, 1fr);
    display: flex;
    flex-direction: column;
  }
}

#mag-section {
  grid-column-start: 1;
  grid-column-end: 2;
  border-right: 2px solid #707070;
  padding: 0 1em 0 0;
}
@media screen and (max-width: 768px) {
  #mag-section {
    grid-column: 1;
    grid-row: 1;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: 25vh;
    padding-right: 0;
    padding-bottom: 1rem;
  }
}
@media screen and (min-width: 769px) {
  #mag-section {
    max-width: 18vw;
  }
}

#mag-section,
#arts-section,
#wknd-section,
.top4-section,
.top5-section {
  display: flex;
  flex-direction: column;
  margin-bottom: 0.1em;
  overflow-wrap: break-word;
  grid-row-start: 1;
}

.top4-section {
  padding-right: 0%;
  border-right: 2px solid #707070;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .top4-section {
    border-right: none;
  }
}

.top5-section {
  padding: 0;
}

#arts-section {
  color: #9f4482;
  padding-right: 0%;
  border-right: 2px solid #707070;
  /*take away extra padding for bottom row*/
  padding: 0;
}
@media screen and (max-width: 768px) {
  #arts-section {
    border-right: none;
  }
}

#wknd-section {
  color: #3593b7;
  /*take away extra padding for bottom row*/
  padding: 0;
}

#mag-section {
  color: #C33C1F;
  padding: 0;
}

.mag-section-head,
.arts-wknd-section-head, .topic-4-5-section-head {
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 768px) {
  .mag-section-head,
.arts-wknd-section-head, .topic-4-5-section-head {
    padding: 0.8rem 0 1rem 0.5rem;
  }
}

#mag-section {
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 1;
  grid-column-end: 2;
}
@media screen and (max-width: 768px) {
  #mag-section {
    grid-column: 1;
    grid-row-start: 1;
    grid-row-end: 2;
  }
}

#arts-section,
.top4-section {
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 2;
  grid-column-end: 4;
}
@media screen and (max-width: 768px) {
  #arts-section,
.top4-section {
    grid-column: 1;
    grid-row-start: 2;
    grid-row-end: 4;
  }
}

#wknd-section,
.top5-section {
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 4;
  grid-column-end: 6;
}
@media screen and (max-width: 768px) {
  #wknd-section,
.top5-section {
    grid-column: 1;
    grid-row-start: 4;
    grid-row-end: 6;
  }
}

#left-arts,
.left-top4 {
  grid-column-start: 1;
  grid-column-end: 2;
}
@media screen and (max-width: 768px) {
  #left-arts,
.left-top4 {
    grid-column: 1;
    grid-row: 1;
  }
}

#right-arts,
.right-top4 {
  grid-column-start: 2;
  grid-column-end: 3;
}
@media screen and (max-width: 768px) {
  #right-arts,
.right-top4 {
    grid-column: 1;
    grid-row: 2;
    border-right: none;
    border-bottom: 2px solid #707070;
    padding-bottom: 1rem;
  }
}

#left-wknd,
.left-top5 {
  padding: 0.5em;
  /*.5em padding bc grid gap is .5em, together 1em of spacing*/
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  grid-column-start: 1;
  grid-column-end: 2;
  border-right: 1px solid #707070;
  min-width: 50%;
}
@media screen and (max-width: 768px) {
  #left-wknd,
.left-top5 {
    grid-column: 1;
    grid-row: 1;
    border-right: none;
    min-width: 0;
  }
}
@media screen and (max-width: 768px) {
  #left-wknd .article-no-picture,
.left-top5 .article-no-picture {
    border-top: 0.5px solid #cbcbcb;
  }
}

#right-wknd,
.right-top5 {
  grid-column-start: 2;
  grid-column-end: 3;
}
@media screen and (max-width: 768px) {
  #right-wknd,
.right-top5 {
    grid-column: 1;
    grid-row: 2;
  }
}

.frame {
  width: 13vw;
  height: 13vw;
  margin: 0;
}

/* GENERAL STYLE FOR ARTICLE WITH IMG ON LEFT */
.left-img-article {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  flex-direction: row;
  padding-left: 0;
  margin-left: 0;
  padding-right: 0%;
}
@media screen and (max-width: 768px) {
  .left-img-article {
    justify-content: start;
  }
}

.left-img-article-textbox {
  padding-left: 6%;
  padding-right: 0%;
  max-width: 94%;
  width: auto;
  height: auto;
}

.top-rect-img-article {
  display: flex;
  flex-direction: column;
  width: 13vw;
  padding-left: 0;
  margin-left: 0;
  max-width: 90%;
}
@media screen and (max-width: 768px) {
  .top-rect-img-article {
    width: 58vw;
  }
}

.top-rect-img-textbox {
  margin: 1vh 0 0 0vw;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .top-rect-img-textbox {
    margin: 0;
    padding-left: 0%;
    padding-right: 0%;
    max-width: 94%;
    width: auto;
    height: auto;
  }
}

#city-section .top-rect-img-textbox {
  padding-left: 6%;
}

.top-rect-img-textbox figcaption {
  font-size: 0.6em;
}

/*#city-img-article > a, .sports-img-article  > a,
.top3-img-article > a  #top1-img-article > a {
    @media screen and (max-width: 768px) {
        display: flex; 
        flex-direction: row;
    }
}*/
@media screen and (max-width: 768px) {
  #top-right-sports figure {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  #top-right-sports .sports-img-article {
    width: 100%;
    margin-right: 0 !important;
    border-bottom: none;
  }
}
#top-right-sports a {
  width: 100%;
}

@media screen and (max-width: 768px) {
  #bottom-right-city #city-img-article {
    width: 100%;
    margin-right: 0 !important;
  }
  #bottom-right-city #city-img-article a {
    flex-direction: row;
    display: flex;
    width: 100%;
  }
}

#city-img-article,
.top1-img-article {
  margin-top: 15%;
}
@media screen and (max-width: 768px) {
  #city-img-article,
.top1-img-article {
    margin: 0%;
    width: 100%;
    max-width: 100%;
  }
}

#city-main-article,
.top1-main-article {
  margin: 2vh 0;
}
@media screen and (max-width: 768px) {
  #city-main-article,
.top1-main-article {
    margin-top: 0;
    margin-bottom: 1rem;
  }
}

#city-main-imgbox,
.top1-main-imgbox {
  width: 18vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  #city-main-imgbox,
.top1-main-imgbox {
    width: 42vw;
  }
}

.city-main-frame,
.top1-main-frame {
  width: 18vw;
  height: 13vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .city-main-frame,
.top1-main-frame {
    width: 42vw;
    height: 28vw;
  }
}

#city-main-textbox {
  padding-left: 8%;
  padding-right: 0%;
}

.sports-frame,
.top3-frame {
  height: 7.8vw;
  width: 13vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .sports-frame,
.top3-frame {
    width: 100%;
    height: 60vw;
  }
}

.sports-imgbox,
.top3-imgbox {
  width: 13vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .sports-imgbox,
.top3-imgbox {
    width: 100%;
  }
}

.sports-img-article,
.top3-img-article {
  width: 13vw;
}
@media screen and (max-width: 768px) {
  .sports-img-article,
.top3-img-article {
    width: 100%;
    max-width: 100%;
  }
}

#city-img-article,
#top1-img-article {
  padding-right: 8%;
  width: 15vw;
}

#second-top4-article {
  margin-right: 0.5em;
}

.mag-img-article,
.wknd-arts-img-article,
.top5-top4-img-article {
  width: 15vw;
  padding-right: 0.5em;
  padding-left: 0.5em;
}
@media screen and (max-width: 768px) {
  .mag-img-article,
.wknd-arts-img-article,
.top5-top4-img-article {
    width: 90vw;
  }
}

.wknd-arts-frame,
.top5-top4-frame {
  height: 9vw;
  width: 15vw;
}
@media screen and (max-width: 768px) {
  .wknd-arts-frame,
.top5-top4-frame {
    width: 90vw;
    height: 50vw;
  }
}

.mag-imgbox,
.wknd-arts-imgbox,
.top5-top4-imgbox {
  width: 15vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .mag-imgbox,
.wknd-arts-imgbox,
.top5-top4-imgbox {
    width: 90vw;
  }
}

.city-frame,
.scitech-frame,
.top1-frame,
.top2-frame {
  height: 9vw;
  width: 15vw;
}
@media screen and (max-width: 768px) {
  .city-frame,
.scitech-frame,
.top1-frame,
.top2-frame {
    width: 42vw;
    height: 28vw;
  }
}

@media screen and (max-width: 768px) {
  .top1-frame, .top1-imgbox {
    width: 90vw !important;
    height: 50vw !important;
  }
}

.scitech-imgbox,
.city-imgbox,
.top1-imgbox,
.top2-imgbox {
  width: 15vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .scitech-imgbox,
.city-imgbox,
.top1-imgbox,
.top2-imgbox {
    width: 42vw;
  }
}

.university-frame {
  width: 14vw;
  height: 14vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .university-frame {
    width: 90vw;
    height: 50vw;
  }
}

.university-imgbox {
  width: 14vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .university-imgbox {
    width: 90vw;
    height: 50vw;
    padding-bottom: 0.5rem;
  }
}

.university-article {
  padding-left: 0;
  width: 14vw;
  margin-left: 0;
  padding-right: 1em;
  max-width: 90%;
}
@media screen and (max-width: 768px) {
  .university-article {
    width: 100%;
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
}
.university-article a {
  width: 100%;
}

.article-author.university-author {
  margin: 8% 0 2% 0;
  font-size: 0.8rem;
}
@media screen and (max-width: 768px) {
  .article-author.university-author {
    margin-top: 0%;
  }
}

.title.university-title {
  margin: 2% 0;
  font-size: 1.1rem;
}

#scitech-list .title,
.top2-list .title {
  font-size: 1em;
}

#scitech-list .article-author,
.top2-list .article-author {
  font-size: 0.8em;
}

@media screen and (max-width: 768px) {
  .article-no-picture {
    padding: 1rem 0;
    border-top: 0.5px solid #cbcbcb;
  }
}

/* END OF GENERAL STYLE FOR ARTICLES WITH IMG ON THE LEFT */
/* MEDIA QUERIES FOR DIFFERENT SECTION TITLES AND COMPONENTS */
@media screen and (max-width: 768px) {
  .title {
    font-size: 1.15rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .section-title, #ytv-title, #editors-picks-title, .category-list-heading, #multimedia-sub-title, #covid-header {
    font-size: 1.9rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .title {
    font-size: 1.9rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .opinion-title {
    font-size: 1.7rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #featured-title {
    font-size: 2.4rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #featured-blurb {
    font-size: 1.5rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .article-author, .opinion-role, #covid-subhead {
    font-size: 1rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #covid-article-list, #covid-student-cases {
    font-size: 1.3rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .covid-section-desc {
    font-size: 1.8rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .category-article-title {
    font-size: 2.4rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .category-article-blurb, #category-description {
    font-size: 1.4rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .category-article-date {
    font-size: 1.1rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #section-page-header {
    font-size: 3rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #read-rest-header {
    font-size: 2.2rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .general-wkndmag-article-title {
    font-size: 2.8rem !important;
    margin-top: 2%;
    margin-bottom: 1%;
  }
}

@media screen and (min-width: 2000px) {
  #photo-main-article-textbox {
    padding-top: 0%;
  }
}

@media screen and (min-width: 2000px) {
  .data-main-articles, .data-sub-article {
    border-top: 0.5px solid #707070;
    padding-top: 3%;
  }
}

/* END OF MEDIA QUERIES */
/* START OF STYLE FOR COMMENCEMENT PAGES (2022+) */
#comm-lower {
  height: max-content;
  padding: 1vh 2.5vw;
}

#comm-lower-grid {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5em;
  grid-template-rows: repeat(14, 1fr);
  grid-template-columns: repeat(16, 1fr);
}
@media screen and (max-width: 768px) {
  #comm-lower-grid {
    border-top: none;
    display: flex;
    flex-direction: column;
  }
}

#comm-sports {
  color: #b40017;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 1;
  grid-row-end: 15;
  border-right: 2px solid #707070;
}
@media screen and (max-width: 768px) {
  #comm-sports {
    grid-column: 1;
    grid-row: 2;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: auto;
  }
}

#comm-sports-grid {
  display: grid;
  width: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 1.2fr 2fr;
  grid-template-columns: 1fr 1.2fr;
}
@media screen and (max-width: 768px) {
  #comm-sports-grid {
    display: flex;
    flex-direction: column;
  }
}

#comm-opinion {
  padding-left: 0.5vw;
  padding-right: 0.5vw;
  color: #0e7037;
  border-right: 2px solid #707070;
  display: flex;
  flex-direction: column;
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 1;
  grid-row-end: 12;
}
@media screen and (max-width: 768px) {
  #comm-opinion {
    grid-column: 1;
    grid-row: 3;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: auto;
  }
}

#comm-wknd {
  color: #1a317c;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  display: flex;
  justify-content: start;
  flex-direction: column;
  grid-column-start: 12;
  grid-column-end: 17;
  grid-row-start: 1;
  grid-row-end: 12;
  padding-left: 0.5vw;
}
@media screen and (max-width: 768px) {
  #comm-wknd {
    grid-column: 1;
    grid-row: 4;
    padding: 0;
    min-height: auto;
    padding: 0.5rem;
  }
}

#comm-sports-title {
  margin-bottom: 3.5rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  #comm-sports-title {
    padding-top: 0.6rem;
  }
}

#comm-opinion-title {
  margin-bottom: 3.5rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  #comm-opinion-title {
    padding-top: 0.6rem;
  }
}

#comm-wknd-title {
  margin-bottom: 3.5rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  #comm-wknd-title {
    padding-top: 0.6rem;
  }
}

#comm-opinion-list {
  margin: 0%;
  text-transform: none;
  overflow-y: auto;
  /*get overflow to expand*/
  height: 100%;
  justify-content: space-between;
  display: flex;
  flex-direction: column;
}
#comm-opinion-list article {
  margin-bottom: 1em;
}

.comm-opinion-imgbox {
  width: 12vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .comm-opinion-imgbox {
    width: 42vw;
  }
}

.comm-opinion-frame {
  height: 7vw;
  width: 12vw;
}
@media screen and (max-width: 768px) {
  .comm-opinion-frame {
    width: 42vw;
    height: 28vw;
  }
}

#comm-wknd-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 1.5fr 1fr;
  grid-template-columns: 1fr 1fr;
}
@media screen and (max-width: 768px) {
  #comm-wknd-grid {
    display: flex;
    flex-direction: column;
    grid-template-rows: repeat(3, 1fr);
    grid-template-columns: 1fr;
  }
}

.comm-wknd-imgbox {
  width: 9.5vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .comm-wknd-imgbox {
    width: 100%;
  }
}

.comm-wknd-frame {
  height: 7.8vw;
  width: 9.5vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .comm-wknd-frame {
    width: 100%;
    height: 60vw;
  }
}

.comm-wknd-img-article {
  width: 9.5vw;
}
@media screen and (max-width: 768px) {
  .comm-wknd-img-article {
    width: 100%;
    max-width: 100%;
  }
}

#comm-sports-top {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #707070;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
}
@media screen and (max-width: 768px) {
  #comm-sports-top {
    /* grid-column: 1; //with respect to city sub-grid
    grid-row: 1; */
    border-bottom: none;
  }
}

#comm-sports-top-article {
  margin: 0 0;
}
@media screen and (max-width: 768px) {
  #comm-sports-top-article {
    margin-top: 0;
    margin-bottom: 1rem;
  }
}

#comm-sports-top-frame {
  width: 14vw;
  height: 9vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  #comm-sports-top-frame {
    width: 42vw;
    height: 28vw;
  }
}

#comm-sports-top-imgbox {
  width: 14vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  #comm-sports-top-imgbox {
    width: 42vw;
  }
}

#comm-sports-btrt-frame {
  height: 7vw;
  width: 12vw;
}
@media screen and (max-width: 768px) {
  #comm-sports-btrt-frame {
    width: 90vw;
    height: 50vw;
  }
}

#comm-sports-btrt-imgbox {
  width: 12vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  #comm-sports-btrt-imgbox {
    width: 90vw;
    height: 50vw;
  }
}

#comm-sports-btrt-article {
  margin-top: 0.5em;
}
@media screen and (max-width: 768px) {
  #comm-sports-btrt-article {
    margin: 0%;
    width: 100%;
    max-width: 100%;
  }
}

/* END OF STYLE FOR COMMENCEMENT PAGES (2022+) */
@font-face {
  font-family: "Avenir-Light";
  src: url(../ttf/avenir-light.ttf) format("woff");
  src: url(../woff/avenir-light.woff) format("truetype");
}
@font-face {
  font-family: "Avenir-Thin";
  src: url(../avenir-thin.html) format("woff");
  src: url(../avenir-thin-2.html) format("truetype");
}
@font-face {
  font-family: "Avenir-Regular";
  src: url(../avenir-regular.html) format("woff");
  src: url(../avenir-regular-2.html) format("truetype");
}
@font-face {
  font-family: "Avenir-Medium";
  src: url(../ttf/avenir-medium.ttf) format("woff");
  src: url(../woff/avenir-medium.woff) format("truetype");
}
@font-face {
  font-family: "Avenir-Roman";
  src: url(../ttf/avenir-roman.ttf) format("woff");
  src: url(../woff/avenir-roman.woff) format("truetype");
}
@font-face {
  font-family: "Avenir-Bold";
  src: url(../avenir-bold.html) format("woff");
  src: url(../avenir-bold-2.html) format("truetype");
}
@font-face {
  font-family: "Avenir-Heavy";
  src: url(../ttf/avenir-heavy.ttf) format("woff");
  src: url(../woff/avenir-heavy.woff) format("truetype");
}
@font-face {
  font-family: "Avenir-Black";
  src: url(../ttf/avenir-black.ttf) format("woff");
  src: url(../woff/avenir-black.woff) format("truetype");
}
@font-face {
  font-family: "Avenir-LightOblique";
  src: url(../ttf/avenir-lightoblique.ttf) format("woff");
  src: url(../woff/avenir-lightoblique.woff) format("truetype");
}
@font-face {
  font-family: "Avenir-MediumOblique";
  src: url(../ttf/avenir-mediumoblique.ttf) format("woff");
  src: url(../woff/avenir-mediumoblique.woff) format("truetype");
}
@font-face {
  font-family: "Avenir-HeavyOblique";
  src: url(../ttf/avenir-heavyoblique.ttf) format("woff");
  src: url(../woff/avenir-heavyoblique.woff) format("truetype");
}
@font-face {
  font-family: "Avenir-BlackOblique";
  src: url(../ttf/avenir-blackoblique.ttf) format("woff");
  src: url(../woff/avenir-blackoblique.woff) format("truetype");
}
@font-face {
  font-family: "BentonSans-Light";
  src: url(../otf/bentonsans-light.otf) format("opentype");
}
@font-face {
  font-family: "BentonSans-Thin";
  src: url(../otf/bentonsans-thin.otf) format("opentype");
}
@font-face {
  font-family: "BentonSans-Regular";
  src: url(../otf/bentonsans-regular.otf) format("opentype");
}
@font-face {
  font-family: "BentonSans-Medium";
  src: url(../otf/bentonsans-medium.otf) format("opentype");
}
@font-face {
  font-family: "BentonSans-Roman";
  src: url(../bentonsans-roman.html) format("opentype");
}
@font-face {
  font-family: "BentonSans-Bold";
  src: url(../otf/bentonsans-bold.otf) format("opentype");
}
@font-face {
  font-family: "BentonSans-Heavy";
  src: url(../bentonsans-heavy.html) format("opentype");
}
@font-face {
  font-family: "BentonSans-Black";
  src: url(../otf/bentonsans-black.otf) format("opentype");
}
@font-face {
  font-family: "BentonSans-LightOblique";
  src: url(../bentonsans-lightoblique.html) format("opentype");
}
@font-face {
  font-family: "BentonSans-MediumOblique";
  src: url(../bentonsans-mediumoblique.html) format("opentype");
}
@font-face {
  font-family: "BentonSans-HeavyOblique";
  src: url(../bentonsans-heavyoblique.html) format("opentype");
}
@font-face {
  font-family: "BentonSans-BlackOblique";
  src: url(../bentonsans-blackoblique.html) format("opentype");
}
@font-face {
  font-family: "ModernoFB-Light";
  src: url(../otf/modernofb-light.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFB-Regular";
  src: url(../otf/modernofb-regular.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFB-Semibold";
  src: url(../otf/modernofb-semibold.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFB-BoldItalic";
  src: url(../otf/modernofb-bolditalic.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFB-RegularItalic";
  src: url(../otf/modernofb-regularitalic.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFB-LightItalic";
  src: url(../otf/modernofb-lightitalic.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFBCond-Light";
  src: url(../otf/modernofbcond-light.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFBCond-Regular";
  src: url(../otf/modernofbcond-regular.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFBCond-Semibold";
  src: url(../otf/modernofbcond-semibold.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFBCond-BoldItalic";
  src: url(../otf/modernofbcond-bolditalic.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFBCond-RegularItalic";
  src: url(../otf/modernofbcond-regularitalic.otf) format("opentype");
}
@font-face {
  font-family: "ModernoFBCond-LightItalic";
  src: url(../otf/modernofbcond-lightitalic.otf) format("opentype");
}
/*%face-sans {
  font-family: "Avenir", "Open Sans", "Helvetica-Neue", "Arial", "Helvetica",
    sans-serif;
  font-weight: 600;
}*/
body {
  background-color: white;
  margin: 0;
  /*@extend %face-sans;
  -webkit-font-smoothing: subpixel-antialiased;*/
}
body a {
  text-decoration: none;
}

p {
  font-size: 0.9em;
}

a {
  outline: none !important;
}

#loading {
  background-color: white;
  position: fixed;
  width: 100%;
  height: 100%;
  overflow-y: hidden;
}

#loader {
  top: calc(50% - 5em);
  display: block;
  margin-left: auto;
  margin-right: auto;
}

#mobile-header {
  height: 50px;
  background-color: white;
  padding: 25px 0px 10px 10px;
  display: none;
  position: fixed;
  z-index: 6;
  width: 100%;
  top: 0;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15), 0 -5px 3px -10px #fff;
}
#mobile-header img {
  height: 35px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: -18px;
}
#mobile-header #mobile-xc {
  /*@extend %face-sans;*/
  text-decoration: none;
  height: 30px;
  width: 30px;
  margin-top: -28px;
  margin-right: 12.5px;
  display: inline-block;
  vertical-align: bottom;
  float: right;
  text-align: center;
  font-size: 22px;
  font-style: italic;
  font-weight: 800;
  letter-spacing: 0;
  color: #191919;
}
#mobile-header .menu-link {
  position: absolute;
  color: #191919;
  margin-top: -7px;
  margin-left: 10px;
  text-decoration: none;
  cursor: pointer;
}

#mobile-navigation {
  overflow-y: auto;
  height: 100%;
  background-color: white;
  opacity: 0.975;
  z-index: 4;
  left: -200px;
  /*left or right and the width of your navigation panel*/
  width: 200px;
  /*should match the above value*/
  /*#tag-data, #tag-ytv, #tag-photo, #tag-podcasts {
    padding-left: 2em;
  }*/
}
#mobile-navigation #nav-search-left {
  display: none;
  margin-bottom: 10px;
  margin-left: 7px;
}
#mobile-navigation i.first-row {
  display: inline;
  float: right;
  margin-top: -35px;
  margin-right: 10px;
}
#mobile-navigation a {
  color: #aaa;
  text-decoration: none;
  display: block;
  font-family: "BentonSans-Bold", "Helvetica-Neue", "Arial", "Helvetica";
  padding: 0.9em 1em 0.9em 1em;
  outline: none;
  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.05);
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-weight: 500;
  transition: border-left 0.25s ease;
  overflow-y: visible;
}
#mobile-navigation a.fa-times {
  padding: 0.8em;
}
#mobile-navigation a:hover {
  transition: border-left 0.25s ease;
}
#mobile-navigation #nav-close-button {
  color: #191919;
}
#mobile-navigation #nav-close-button:hover {
  background-color: white;
  cursor: pointer;
}
#mobile-navigation #tag-home {
  border-left: 5px solid #191919;
}
#mobile-navigation #tag-covid19 {
  border-left: 5px solid #a34d03;
}
#mobile-navigation #tag-university {
  border-left: 5px solid #1a6075;
}
#mobile-navigation #tag-opinion {
  border-left: 5px solid #df9100;
}
#mobile-navigation #tag-city {
  border-left: 5px solid #8e0012;
}
#mobile-navigation #tag-scitech {
  border-left: 5px solid #145141;
}
#mobile-navigation #tag-sports {
  border-left: 5px solid #1a317c;
}
#mobile-navigation #tag-weekend {
  border-left: 5px solid #3593b7;
}
#mobile-navigation #tag-arts {
  border-left: 5px solid #9f4482;
}
#mobile-navigation #tag-multimedia {
  border-left: 5px solid #781788;
}
#mobile-navigation #tag-magazine {
  border-left: 5px solid #c33c1f;
}
#mobile-navigation #tag-ytv {
  border-left: 5px solid #ffffff;
}
#mobile-navigation #tag-podcasts {
  border-left: 5px solid #ffffff;
}
#mobile-navigation #tag-photo {
  border-left: 5px solid #ffffff;
}
#mobile-navigation #tag-data {
  border-left: 5px solid #ffffff;
}

.responsive-head a {
  padding-left: 11px !important;
  padding-right: 11px !important;
}

footer#site-footer {
  margin-top: 30px;
  background-color: #f6f4f4;
  text-align: center;
  z-index: 5;
}
footer#site-footer a {
  text-decoration: none;
  font-family: "Avenir-Roman", "Helvetica", "Arial";
  font-size: 11px;
  color: #aaa;
  padding: 20px 0px;
  line-height: 50px;
  text-transform: uppercase;
  margin: 0px 10px 0px 10px;
  transition: all 0.25s ease;
}
footer#site-footer a:hover {
  color: #191919;
  transition: all 0.25s ease;
}

.article-footer {
  background-color: #ccc !important;
}

/*.card {
  &.slider-container {
    background-color: #0b549b !important;
    width: 100%;
    height: 0.8 * $card-height;
    opacity: 1;
    background-color: #0b549b;
  }

  #slider {
    height: 100%;
    h1 {
      font-size: 1.5em;
    }

    h3 {
      margin-left: 20px;
    }

    h1,
    h3,
    p,
    time {
      color: white;
    }

    div {
      cursor: pointer;
      height: 100%;
      .magazine {
        border-bottom: 30px solid map-get($colors, 'magazine');
      }
      .weekend {
        border-bottom: 30px solid map-get($colors, 'weekend');
      }
      .sports {
        height: 100%;
        border-bottom: 30px solid map-get($colors, 'sports');
      }
    }
  }
}*/
/*.inside-news {
  width: 100%;
  height: 100% !important;
  cursor: default;
  border-bottom: none;
  padding-bottom: 15px;

  .scroll-down {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    padding: 10px 0px;
    color: #083665;
    font-family: "Avenir", "Helvetica-Neue", "Arial", "Helvetica", sans-serif;
    text-transform: uppercase;
    @include bg-gradienter (( to bottom,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 1) 25%,
      rgba(225, 225, 225, 1) 100% ));
    z-index: 3;
    font-size: 0.9em;
    letter-spacing: 0.05em;
  }

  .xc-content {
    height: 100%;
    overflow-y: auto;
    padding: 15px 15px 15px 15px;

    a {
      color: black;
    }

    h2 {
      padding: 4px;
      letter-spacing: 1px;

      &.category-header {
        @extend %face-serif;
        font-weight: bold;
        font-style: italic;
        font-size: 1.4em;
        padding-top: 14px;
        color: #0c3764;
      }

      &.title-header {
        @extend %face-serif;
        font-weight: bold;
        color: black;
        font-size: 1.1em;
        line-height: 1.1;
      }

      &.author-header {
        color: $dove-gray;
        font-size: 0.8em;
        font-weight: 600;
        text-transform: uppercase;
        font-family: "Avenir", "Helvetica-Neue", "Arial", "Helvetica",
          sans-serif;
      }

      &.link-header {
        font-size: 0.8em;

        a {
          color: $dove-gray;
        }
      }
    }
  }

  h1,
  p {
    color: $dove-gray;
  }

  time {
    display: none;
  }

  &:hover {
    box-shadow: none;
  }

  #xc {
    margin-left: 401px;
    margin-top: -60px;
    background-color: #2a9dea;
    overflow: hidden;
    height: 60px;
    letter-spacing: 0;
    color: white;
    font-size: 1.7em;
    font-weight: 600;
    @extend %face-sans;

    width: 100%;
    text-align: center;
    text-transform: uppercase;
    font-style: normal;
    font-family: "Avenir", "Helvetica-Neue", "Arial", "Helvetica", sans-serif;
  }

  #xc-close-button {
    display: inline;
    float: right;
    margin-top: -40px;
    margin-right: 5px;
    cursor: pointer;
  }

  #xc p {
    padding: 24px 20px 20px 20px;
    letter-spacing: 2px;
    color: white;
    opacity: 0.9;
    margin-top: -5px;
  }

  h1 {
    text-align: center;
    color: white;
    font-family: "Avenir", "Helvetica-Neue", "Arial", "Helvetica", sans-serif;
    text-transform: uppercase;
    background-color: #083665;
    width: 100%;
    margin: 0;
    padding: 15px 0 13px 0;
    letter-spacing: 0.15em;
    font-size: 1.1em;

    @media (max-width: 1000px) {
      font-size: 1em;
    }
  }

  p.category {
    color: #bbb;
  }

  p.card-preview,
  p.date {
    width: 100%;
    margin: 0 auto 20px auto;
    font-size: 1em;
  }

  p.date {
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #083665;
    font-weight: 800;
    margin-bottom: 15px;
  }

  .intro {
    font-weight: 700;
  }

  @extend .six, .columns;

  h1,
  p {
    z-index: 2;
    @extend .six, .columns;
  }

  p {
    width: 100%;
    margin-bottom: 14px;
    line-height: 1.3;
    font-size: 1em;
    font-weight: normal;
    letter-spacing: 0.03em;
  }
  &::after {
    @include bg-gradienter (( to bottom, rgba(255, 255, 255, 0) 0%, rgba(25, 25, 25, 0) 100% ));
  }
}

.most-read {
  height: 312px !important;
  width: 100%;
  cursor: default;
  border-bottom: none;
  padding-bottom: 45px;

  .scroll-down {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    padding: 10px 0px;
    color: #083665;
    font-family: "Avenir", "Helvetica-Neue", "Arial", "Helvetica", sans-serif;
    text-transform: uppercase;
    @include bg-gradienter (( to bottom,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 1) 25%,
      rgba(225, 225, 225, 1) 100% ));
    z-index: 3;
    font-size: 0.6em;
    letter-spacing: 0.05em;
  }

  .mr-content {
    height: 100%;
    overflow-y: auto;
    padding: 5px;
    letter-spacing: 1px;
  }

  .mr-entry {
    padding: 10px;

    .title-header {
      margin-bottom: 10px;
      font-size: 1.1em;
    }

    .author-header {
      color: $dove-gray;
      font-family: "Avenir", "Helvetica-Neue", "Arial", "Helvetica", sans-serif;
      text-transform: uppercase;
      font-size: 0.8em;
    }
  }

  h1,
  p {
    color: $dove-gray;
  }

  h2 {
    margin: 5px;
  }

  time {
    display: none;
  }

  a {
    color: #033163;
    text-decoration: none;
    transition: background 0.15s cubic-bezier(0.33, 0.66, 0.66, 1);
  }

  a:hover {
    transition: background 0.15s cubic-bezier(0.33, 0.66, 0.66, 1);
  }

  &:hover {
    box-shadow: none;
  }

  #mr {
    margin-left: 401px;
    margin-top: -60px;
    background-color: #2a9dea;
    overflow: hidden;
    letter-spacing: 0;
    font-style: italic;
    @extend %face-sans;

    width: 100%;
    text-align: center;
    height: 50px;

    font-size: 1.25em;
    font-weight: 600;
    text-transform: uppercase;
    font-style: normal;
    font-family: "Avenir", "Helvetica-Neue", "Arial", "Helvetica", sans-serif;
  }

  #mr p {
    padding: 10px 20px 20px 20px;
    letter-spacing: 2px;
    color: white;
    opacity: 0.9;
    margin-top: -5px;
  }
  #mr-close-button {
    display: inline;
    float: right;
    margin-top: -40px;
    margin-right: 5px;
    cursor: pointer;
  }

  h1 {
    text-align: center;
    color: white;
    font-family: "Avenir", "Helvetica-Neue", "Arial", "Helvetica", sans-serif;
    text-transform: uppercase;
    background-color: #083665;
    width: 100%;
    margin: 0;
    padding: 15px 0 13px 0;
    letter-spacing: 0.15em;
    font-size: 1.1em;

    @media (max-width: 1000px) {
      font-size: 1em;
    }
  }

  h1,
  p {
    z-index: 2;
    @extend .six, .columns;
  }

  h2 {
    @extend %face-serif;
    font-size: 1em;
    font-weight: bold;
  }

  p {
    width: 100%;
    margin-bottom: 14px;
    line-height: 1.3;
    font-size: 1em;
    font-weight: normal;
    letter-spacing: 0.03em;
  }

  p.category {
    color: #bbb;
  }

  p.card-preview,
  p.date {
    width: 100%;
    margin: 0 auto 20px auto;
    font-size: 1em;
  }

  p.date {
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #083665;
    font-weight: 800;
    margin-bottom: 15px;
  }

  td {
    padding: 15px;
  }

  td span {
    display: block;
    margin: 0 auto;
  }

  span.rank-number {
    font-size: 0.8em;
  }

  &::after {
    @include bg-gradienter (( to bottom, rgba(255, 255, 255, 0) 0%, rgba(25, 25, 25, 0) 100% ));
  }
}

.card {
  // Specific styles for the story-major card in the A1 section (main story)
  &.story-major.a1 {
    width: 100%;
    height: 1.8 * $card-height;

    h1,
    p,
    time {
      color: #083665;
      @extend .eleven, .columns;
    }

    time {
      position: relative;
    }

    p.category {
      position: relative;
      bottom: 5px;
    }

    .byline {
      position: relative;
    }

    .card-preview {
      color: black;
    }

    h1 {
      font-size: 1.5em;
    }

    .card-preview {
    }
    div.story-major-container {
      height: auto;
      position: absolute;
      bottom: 0;
      right: 0;
      left: 0;
      margin: 0 auto;
    }

    div.story-major-content {
      background-color: white;
      height: auto;
      position: absolute;
      bottom: 0;
      right: 0;
      left: 0;
      margin: 0 auto;
    }

    &::after {
      // @include bg-gradienter (( to left, rgba(6, 55, 105, 0) 0%, rgba(8, 57, 106, 1) 100%));
      top: 0;
      left: 0;
      width: 150%;
      height: 100%;
      content: "";
      position: absolute;
    }
  }

  // styles for minor stories on A1
  &.story-preview.a1 {
    width: 100%;
    height: 0.6 * $card-height;
    opacity: 1;

    &:not(.nophoto) {
      height: 1.135 * $card-height;

      .byline {
      }
    }

    .byline,
    time {
      color: #083665;
      margin-left: 0px;
    }

    h1 {
      font-size: 1.2em;
      @extend .eleven, .columns;
      color: #083665;
      margin-left: 0px;
    }

    .story-info {
      bottom: 10px;
    }

    .author-info {
      //bottom: 0px;
      line-height: 1.3;
    }

    p.card-preview {
      height: auto;
      color: black;
      margin-left: 0px;
    }

    div.preview-card-left {
      width: 40%;
      height: 100%;
      float: left;
    }

    div.preview-card-right {
      padding-top: 10px;
      padding-left: 15px;
      margin-left: 40%;
      height: 100%;
      background: white;
    }
  }
}

.a1-wrapper {
  margin: 0 auto;
  width: 100%;
  max-width: 1100px;
  display: flex;
  flex-direction: column;
  padding: 0 20px 20px;

  .a1-stories-wrapper {
    display: flex;
    flex-direction: row;
    .inside-news-col {
      flex: 1;
      display: flex;
      flex-direction: column;
    }

    .main-stories-col {
      padding: 0 20px;
      flex: 2;
      display: flex;
      flex-direction: column;

      .story-major-a1-wrapper {
        padding-top: 20px;
      }
    }

    .most-read-col {
      flex: 2;
      display: flex;
      flex-direction: column;
      flex-flow: column;

      .story-minor-a1-wrapper {
        padding-top: 20px;
      }
    }
  }

  .a1-footer-wrapper {
    display: flex;
    flex-direction: row;
    padding-top: 20px;

    .subscribe-wrapper {
      flex: 1;
      // subscribe bar at bottom
      .subscribe {
        box-shadow: none;
        width: 100%;
        height: 0.296 * $card-height;
        background-color: #0c3764;
        h1 {
          font-family: "Playfair Display", "Avenir", "Helvetica-Neue", "Arial",
            "Helvetica", sans-serif;
          color: white;
          text-align: center;
          vertical-align: middle;
          height: auto;
          padding-top: 5px;
          padding-bottom: 10px;
        }
      }
    }

    .tip-wrapper {
      flex: 1;
      padding-left: 20px;
      .tips {
        box-shadow: none;
        width: 100%;
        height: 0.296 * $card-height;
        background-color: #0c3764;
        h1 {
          font-family: "Playfair Display", "Avenir", "Helvetica-Neue", "Arial",
            "Helvetica", sans-serif;
          color: white;
          text-align: center;
          vertical-align: middle;
          height: auto;
          padding-top: 5px;
          padding-bottom: 10px;
        }
      }
    }

    .subscribe-link-wrapper {
      flex: 1;
      padding-top: 0;
      .subscribe-link {
        box-shadow: none;
        width: 100%;
        height: 0.296 * $card-height;
        background-color: #0c3764;
        h1 {
          font-family: "Playfair Display", "Avenir", "Helvetica-Neue", "Arial",
            "Helvetica", sans-serif;
          color: white;
          text-align: center;
          vertical-align: middle;
          height: auto;
          padding-top: 5px;
          padding-bottom: 10px;
        }
      }
    }
  }
}
*/
/*// PHONE SIZE
@media (max-width: 725px) {
  .a1-wrapper {
    .a1-stories-wrapper {
      flex-direction: column;
      .main-stories-col {
        padding: 0px;
      }
    }
  }
}*/
/* section-card-wrapper {
  display: flex;
  flex-flow: row wrap;

  @media (max-width: 480px) {
    flex-flow: column;
  }

  a {
    width: 25%;
    padding: 1em;
  }

  article {
    width: 100%;
  }

  & .card {
    height: 100%;
    padding-bottom: 15px;
  }
}*/
#commencement-announcement {
  background-color: #9e9e9e;
  text-align: center;
  z-index: 100;
  margin-top: -10px;
  margin-bottom: 3vh;
  padding: 0.5em;
  font-size: 1.2em;
  letter-spacing: 1.3px;
  text-decoration: none;
  font-family: "BentonSans-Regular", sans-serif;
  font-weight: normal;
  color: white;
  cursor: pointer;
  transition: color 0.2s ease-in-out;
}
@media screen and (min-width: 2000px) {
  #commencement-announcement {
    font-size: 1.4em;
  }
}

.container {
  margin-top: 0%;
  display: table;
}

.container {
  position: relative;
  width: 100%;
  max-width: 1150px;
  margin: 0 auto;
  box-sizing: border-box;
}

.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box;
}

/* For devices larger than 400px */
@media (min-width: 400px) {
  .container {
    width: 85%;
    padding: 0;
  }
}
/* For devices larger than 550px */
@media (min-width: 550px) {
  .container {
    width: 80%;
  }
}
header#site-header {
  background-color: white;
  padding: 10px 0 0;
}
header#site-header .fa-times:before {
  content: "\f00d";
  font-weight: 900;
}
header#site-header #dropdown-list {
  display: none;
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  width: 100%;
}
header#site-header a {
  text-decoration: none;
}
header#site-header h1.masthead-logo {
  background: no-repeat url("../gif/ydn_nameplate_big.gif");
  background-size: 390px 85px;
  color: transparent;
  width: 390px;
  height: 85px;
  display: block;
  margin: 0 auto 10px;
}
header#site-header nav#site-navigation {
  background-color: white;
  text-align: center;
  z-index: 100;
  margin-top: 1vh;
  border-top: 1px solid #707070;
  border-bottom: 1px solid #707070;
}
header#site-header nav#site-navigation a {
  /*@extend %face-sans; */
  line-height: 1.2;
  padding: 10px;
  display: inline-block;
  font-size: 0.8em;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  text-decoration: none;
  font-family: "BentonSans-Regular", sans-serif;
  font-weight: normal;
  color: #707070;
  cursor: pointer;
  transition: color 0.2s ease-in-out;
}
@media screen and (min-width: 2000px) {
  header#site-header nav#site-navigation a {
    font-size: 1.2em;
  }
}
header#site-header nav#site-navigation a:hover#small-logo {
  box-shadow: none;
}
header#site-header nav#site-navigation a:hover#tag-covid19 {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-university {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-opinion {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-city {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-scitech {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-sports {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-weekend {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-arts {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-multimedia {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-magazine {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-ytv {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-podcasts {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-photo {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a:hover#tag-data {
  color: #181817;
  transition: color 0.2s ease-in-out;
}
header#site-header nav#site-navigation a#small-logo {
  display: none;
  vertical-align: middle;
  padding: 0;
}
header#site-header nav#site-navigation a#small-logo h1.small-logo {
  background: no-repeat url("../png/blue%20y%20no%20background.png");
  background-size: 25px auto;
  color: transparent;
  background-position: center;
  height: 35px;
}
header#site-header nav#site-navigation #nav-search {
  color: #707070 !important;
  line-height: 1.2;
  padding: 10px 15px;
  position: relative;
  display: inline-block;
}
header#site-header nav#site-navigation #nav-search .search-box {
  display: none;
  background-color: #bbb;
  width: 300px;
  position: absolute;
  right: 0px;
  top: 45px;
}
header#site-header nav#site-navigation #nav-search:hover {
  cursor: pointer;
}
header#site-header nav#site-navigation #nav-search input:focus {
  outline: none;
}

.hvr-shutter-out-horizontal {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  background: #e1e1e1;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.hvr-shutter-out-horizontal:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #1862af;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.hvr-shutter-out-horizontal:hover,
.hvr-shutter-out-horizontal:focus,
.hvr-shutter-out-horizontal:active {
  color: white;
}

.hvr-shutter-out-horizontal:hover:before,
.hvr-shutter-out-horizontal:focus:before,
.hvr-shutter-out-horizontal:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

/* Navbar container */
.navbar {
  overflow: hidden;
  background-color: #333;
  font-family: Arial;
}

/* Links inside the navbar */
.navbar a {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

/* The dropdown container */
.dropdown {
  display: inline;
  overflow: hidden;
}

/* Dropdown button */
.dropdown .dropbtn {
  font-size: 0.8em;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  outline: none;
  color: #707070;
  background-color: inherit;
  font-family: "BentonSans-Regular", sans-serif;
  margin: 0;
  /* Important for vertical align on mobile phones */
}

/* Add a red background color to navbar links on hover 
.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: red;
} */
/* Dropdown content (hidden by default) */
/*.dropdown-content {
  display: none;
  position: absolute;
  background-color: #433f3f;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
} */
/* Links inside the dropdown */
/*.dropdown-content a {
  //position: relative;
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  //text-align: left;
}*/
/* Add a grey background color to dropdown links on hover */
/*.dropdown-content a:hover {
  background-color: #ddd;
}*/
/* Show the dropdown menu on hover */
/*.dropdown:hover .dropdown-content {
  display: block;
} */
/* Source: DesignCise */
#infobox {
  list-style: none;
  width: 100%;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
}

#infobox > li {
  display: inline-block;
  width: 33%;
  text-align: center;
  font-family: "BentonSans", sans-serif;
  font-size: 0.8em;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  text-decoration: none;
}

#infobox > li:nth-child(even) {
  background-color: white;
}

#top-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#left-info {
  font-family: "BentonSans-Regular", sans-serif;
  display: block;
  font-size: 0.7em;
  margin-left: 50px;
  margin-right: 0px;
  color: #707070;
}
@media screen and (min-width: 2000px) {
  #left-info {
    font-size: 1.1em;
  }
}

#middle-info {
  display: flex;
  font-family: "BentonSans-Regular", sans-serif;
  font-size: 0.7em;
  text-transform: uppercase;
  color: #707070;
}
@media screen and (min-width: 2000px) {
  #middle-info {
    font-size: 1.1em;
  }
}

#right-info {
  font-family: "BentonSans-Regular", sans-serif;
  font-size: 0.6em;
  margin-right: 50px;
  color: #707070;
}

#date-info {
  font-family: "BentonSans-Bold", sans-serif;
}

.social-icon {
  width: 25px;
  height: auto;
  margin: 0px 3px;
}

body.page .top-image h1 {
  position: fixed;
  color: white;
  font-size: 50px;
  text-align: center;
  width: 100%;
  background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.9) 100%), no-repeat;
  bottom: 0;
  padding-top: 89px;
  padding-bottom: 140px;
  z-index: 1;
}
body.page .top-image .tech-team {
  width: 100%;
  height: auto;
  background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.9) 100%), no-repeat;
}
body.page .top-image .photo-text {
  position: fixed;
}
body.page .top-image .stay {
  position: absolute;
}
@media (max-width: 810px) {
  body.page .top-image h1 {
    position: relative;
    color: black;
    font-size: 2rem;
    margin-top: 35px;
  }
}
body.page .about-the-site {
  z-index: 4;
  background-color: #f6f4f4;
}
body.page .about-the-site .box {
  margin-right: 3%;
  margin-left: 3%;
  width: 94%;
}
body.page .about-the-site .article-header, body.page .about-the-site h1 {
  margin-bottom: 20px;
  width: 100%;
}
body.page .about-the-site#article-content {
  min-height: 0;
}
body.page .about-the-site .people {
  margin-bottom: 40px;
}
body.page .about-the-site .people .person {
  width: 16%;
  display: inline-block;
  margin-right: 4%;
}
body.page .about-the-site .people .person .image {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  transition: all 1s ease;
}
body.page .about-the-site .people .person .image:hover {
  transition: all 1s ease;
  filter: grayscale(0%);
  -webkit-filter: grayscale(0%);
}
body.page .about-the-site .people .person img {
  width: 100%;
}
body.page .about-the-site .people .person:nth-child(5) {
  margin-right: 0;
}
@media (max-width: 1170px) {
  body.page .about-the-site .people .person {
    margin-right: 3%;
    width: 17%;
  }
}
@media (max-width: 985px) {
  body.page .about-the-site .people .person {
    margin-right: 2%;
    width: 20%;
  }
  body.page .about-the-site .people .person:nth-child(1), body.page .about-the-site .people .person:nth-child(2) {
    margin-bottom: 25px;
  }
  body.page .about-the-site .people .person:nth-child(1) {
    margin-left: 30%;
  }
  body.page .about-the-site .people .person:nth-child(3) {
    margin-left: 19%;
  }
}
@media (max-width: 840px) {
  body.page .about-the-site .people .person {
    margin-right: 1%;
    width: 25%;
  }
  body.page .about-the-site .people .person:nth-child(1), body.page .about-the-site .people .person:nth-child(2) {
    margin-bottom: 25px;
  }
  body.page .about-the-site .people .person:nth-child(1) {
    margin-left: 25%;
  }
  body.page .about-the-site .people .person:nth-child(3) {
    margin-left: 11%;
  }
}
@media (max-width: 840px) {
  body.page .about-the-site .people .person {
    margin-right: 1%;
    width: 29%;
  }
  body.page .about-the-site .people .person:nth-child(1), body.page .about-the-site .people .person:nth-child(2) {
    margin-bottom: 25px;
  }
  body.page .about-the-site .people .person:nth-child(1) {
    margin-left: 20%;
  }
  body.page .about-the-site .people .person:nth-child(3) {
    margin-left: 5%;
  }
}
@media (max-width: 580px) {
  body.page .about-the-site .people .person, body.page .about-the-site .people .person:nth-child(1), body.page .about-the-site .people .person:nth-child(2), body.page .about-the-site .people .person:nth-child(3) {
    width: 90%;
    margin-left: 5%;
    margin-bottom: 32px;
    text-align: center;
  }
}
body.page .about-the-site .people p:nth-child(1) {
  text-transform: uppercase;
  margin-top: 8px;
}
body.page .about-the-site .people p:nth-child(2) {
  line-height: 1.8em;
  color: #8C8C8C;
  font-weight: 500;
  letter-spacing: 0.06em;
}
body.page .about-the-site .people p:nth-child(3) {
  color: #8C8C8C;
  font-weight: 500;
  letter-spacing: 0.06em;
}
body.page .about-the-site .article-text {
  max-width: 600px;
  margin: 0 auto 40px auto;
}
body.page .about-the-site .article-text h3 {
  font-size: 30px;
}
@media (max-width: 580px) {
  body.page .about-the-site .article-text {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    padding-top: 0 !important;
  }
}

/* Main Body Styling Start*/
body.single-post,
body.page {
  /* Image  Styling*/
  /* Article Styling */
}
body.single-post article,
body.page article {
  margin-top: 0px;
}
body.single-post h1,
body.page h1 {
  font-family: "ModernoFB-Light", "Georgia", serif;
  letter-spacing: 1.2px;
}
body.single-post #mobile-header,
body.page #mobile-header {
  height: 50px;
}
body.single-post .wp-block-image img,
body.page .wp-block-image img {
  margin: 10px 0 !important;
}
body.single-post .box,
body.page .box {
  margin: 0 auto;
  margin-top: 50px;
  transition: all 0.25s ease;
}
@media (min-width: 970px) {
  body.single-post .box,
body.page .box {
    width: 960px;
  }
}
@media (max-width: 1030px) {
  body.single-post .box,
body.page .box {
    transition: all 0.25s ease;
  }
}
@media (max-width: 1000px) and (min-width: 781px) {
  body.single-post .box,
body.page .box {
    margin-left: 2rem;
  }
}
@media (max-width: 780px) {
  body.single-post .box,
body.page .box {
    width: 80%;
    margin: 40px auto 0;
  }
}
@media (max-width: 600px) {
  body.single-post .box,
body.page .box {
    width: 90%;
  }
}
body.single-post .card,
body.page .card {
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12);
}
body.single-post .image-credit,
body.page .image-credit {
  text-align: right;
  font-size: 0.55em;
  letter-spacing: 1.5px;
  color: #aaa;
  background-color: transparent;
}
body.single-post .image-credit .image-link,
body.page .image-credit .image-link {
  text-decoration: none;
  box-shadow: none;
  color: #2882c8 !important;
  border-bottom: none;
}
body.single-post .image-credit .image-link:hover,
body.page .image-credit .image-link:hover {
  color: #2882c8 !important;
  text-decoration: none;
  background-color: transparent;
}
body.single-post .card-image,
body.page .card-image {
  width: 100%;
  height: auto;
}
body.single-post .author-info,
body.page .author-info {
  font-family: "BentonSans-Light", "Times New Roman", Times, serif;
  color: #aaa;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 1.2px;
}
@media (max-width: 480px) {
  body.single-post .author-info,
body.page .author-info {
    display: none;
  }
}
body.single-post #bottom-bar-signal,
body.page #bottom-bar-signal {
  padding-top: 12px;
}
body.single-post .byline,
body.page .byline {
  font-family: "BentonSans-Regular", "Times New Roman", Times, serif;
  text-transform: uppercase;
  font-size: 0.8em;
  letter-spacing: 1.5px;
  margin-left: 0;
  z-index: 2;
  color: #aaa;
  min-width: 100%;
  max-width: 100%;
  width: 100%;
}
body.single-post .byline a,
body.page .byline a {
  color: #1a6075;
  text-decoration: none;
}
body.single-post .byline date,
body.single-post .byline time,
body.page .byline date,
body.page .byline time {
  color: #aaa;
}
@media (max-width: 480px) {
  body.single-post .byline,
body.page .byline {
    text-align: center;
  }
  body.single-post .byline a,
body.single-post .byline date,
body.single-post .byline time,
body.page .byline a,
body.page .byline date,
body.page .byline time {
    display: block;
    letter-spacing: 0.05em;
  }
}
@media (min-width: 481px) {
  body.single-post .byline date:before,
body.page .byline date:before {
    content: "|";
    margin-right: 10px;
    color: #ccc;
  }
}
@media (max-width: 480px) {
  body.single-post .byline a,
body.single-post .byline date,
body.single-post .byline time,
body.page .byline a,
body.page .byline date,
body.page .byline time {
    display: block;
    letter-spacing: 0.05em;
    text-align: center;
  }
}
body.single-post .date,
body.page .date {
  font-weight: normal !important;
}
body.single-post .article-header,
body.page .article-header {
  width: 100%;
}
body.single-post .article-header h1,
body.page .article-header h1 {
  margin-bottom: -12.5px;
  width: 80%;
  margin-top: 20px !important;
}
@media (max-width: 1000px) {
  body.single-post .article-header h1,
body.page .article-header h1 {
    font-size: 2.75em;
    line-height: 1.2;
  }
}
@media (max-width: 480px) {
  body.single-post .article-header h1,
body.page .article-header h1 {
    margin-top: 30px !important;
  }
}
body.single-post .article-header p,
body.page .article-header p {
  width: 65%;
}
body.single-post .article-header h1,
body.single-post .article-header .subtitle,
body.page .article-header h1,
body.page .article-header .subtitle {
  margin-top: 30px;
  z-index: 2;
  font-size: 2.7em;
  letter-spacing: 1px;
  font-weight: 800;
}
@media (max-width: 970px) {
  body.single-post .article-header h1,
body.single-post .article-header .subtitle,
body.page .article-header h1,
body.page .article-header .subtitle {
    width: 60%;
  }
}
@media (max-width: 820px) {
  body.single-post .article-header h1,
body.single-post .article-header .subtitle,
body.page .article-header h1,
body.page .article-header .subtitle {
    width: 55%;
  }
}
@media (max-width: 780px) {
  body.single-post .article-header h1,
body.single-post .article-header .subtitle,
body.page .article-header h1,
body.page .article-header .subtitle {
    width: 100%;
  }
}
@media (max-width: 600px) {
  body.single-post .article-header h1,
body.single-post .article-header .subtitle,
body.page .article-header h1,
body.page .article-header .subtitle {
    font-size: 1.9375rem;
  }
}
@media (max-width: 480px) {
  body.single-post .article-header h1,
body.single-post .article-header .subtitle,
body.page .article-header h1,
body.page .article-header .subtitle {
    text-align: center;
  }
}
@media (max-width: 480px) {
  body.single-post .article-header .byline,
body.page .article-header .byline {
    width: 100%;
    font-size: 0.8125rem;
    line-height: 1.5rem;
    margin-top: -8%;
  }
}
body.single-post .article-header .subtitle,
body.page .article-header .subtitle {
  font-family: "BentonSans-Light", "Times New Roman", Times, serif;
  font-size: 1em;
  font-style: italic;
  color: #888;
  line-height: 1.4;
  font-weight: 300;
  letter-spacing: 0.02em;
}
@media (max-width: 480px) {
  body.single-post .article-header .subtitle,
body.page .article-header .subtitle {
    font-weight: 800;
    letter-spacing: 0.01em;
  }
}
body.single-post .article-text,
body.page .article-text {
  font-family: "Georgia", serif;
  color: #191919;
  width: 65%;
  font-size: 1.3em;
  line-height: 1.35em;
  margin-top: 35px;
  margin-bottom: 40px;
  margin-right: 100px;
}
body.single-post .article-text img,
body.page .article-text img {
  float: left;
  border: 1px solid #ddd;
  border-radius: 2px;
  margin: 0px 10px 0 0;
  max-width: 100%;
  height: auto;
}
body.single-post .article-text p.caption,
body.page .article-text p.caption {
  font-style: italic;
  color: #999;
  margin-top: 5px;
  line-height: 1.3;
  font-size: 0.7em;
}
body.single-post .article-text iframe,
body.page .article-text iframe {
  margin-top: 0px;
  width: 100%;
}
body.single-post .article-text a,
body.page .article-text a {
  color: #191919;
  text-decoration: none;
  box-shadow: inset 0 -2px 0 #5ea6df;
  border-bottom: 0.5px solid #5ea6df;
  transition: background 0.15s cubic-bezier(0.33, 0.66, 0.66, 1);
}
body.single-post .article-text a:hover,
body.page .article-text a:hover {
  color: white;
  background-color: #5ea6df;
  transition: background 0.15s cubic-bezier(0.33, 0.66, 0.66, 1);
}
body.single-post .article-text h2,
body.page .article-text h2 {
  font-weight: 600;
  letter-spacing: normal;
  font-size: 1.95em;
  margin-top: 0.83em;
  margin-bottom: 0.83em;
  line-height: 1.4;
}
body.single-post .article-text h3,
body.page .article-text h3 {
  font-size: 1.56em;
  margin-top: 1em;
  margin-bottom: 1em;
  letter-spacing: normal;
  font-weight: 600;
  line-height: 1.4;
}
body.single-post .article-text h4,
body.page .article-text h4 {
  font-size: 1.25em;
  margin-top: 1.33em;
  margin-bottom: 1.33em;
  letter-spacing: normal;
  font-weight: 600;
  line-height: 1.4;
}
body.single-post .article-text p,
body.page .article-text p {
  margin-top: 20px;
  letter-spacing: 0.01em;
  font-weight: normal;
}
@media (max-width: 480px) {
  body.single-post .article-text p,
body.page .article-text p {
    font-size: 0.8em;
  }
}
body.single-post .article-text ul,
body.page .article-text ul {
  list-style: disc;
  margin-top: 20px;
  margin-left: 20px;
  letter-spacing: 0.01em;
  font-weight: normal;
  font-size: 0.9em;
}
body.single-post .article-text ol,
body.page .article-text ol {
  list-style: decimal;
  margin-top: 20px;
  margin-left: 20px;
  letter-spacing: 0.01em;
  font-weight: normal;
  font-size: 0.9em;
}
body.single-post .article-text p:first-child,
body.page .article-text p:first-child {
  margin-top: 0px;
}
@media (max-width: 970px) {
  body.single-post .article-text,
body.page .article-text {
    width: 60%;
  }
}
@media (max-width: 820px) {
  body.single-post .article-text,
body.page .article-text {
    width: 55%;
  }
}
@media (max-width: 780px) {
  body.single-post .article-text,
body.page .article-text {
    width: 100%;
  }
}
@media (max-width: 480px) {
  body.single-post .article-text,
body.page .article-text {
    margin-top: 25px;
  }
}
body.single-post .unhide,
body.page .unhide {
  display: block;
}
body.single-post .social-top,
body.page .social-top {
  position: absolute;
  display: inline-block;
  list-style: none;
  padding-top: 10px;
  padding-inline-start: 0px !important;
}
body.single-post .social-top img,
body.page .social-top img {
  margin-top: -3px;
  width: 50px;
  height: 50px;
}
body.single-post .social-top a,
body.page .social-top a {
  opacity: 1;
}
body.single-post .social-top a:hover, body.single-post .social-top a:active, body.single-post .social-top a:focus,
body.page .social-top a:hover,
body.page .social-top a:active,
body.page .social-top a:focus {
  opacity: 0.75;
}
@media (max-width: 1100px) {
  body.single-post .social-top,
body.page .social-top {
    display: none;
  }
}

/*/// ytv section/////
  // display: inline !important;*/
.card.story-ytv {
  padding-bottom: 17.5px;
  margin: 0px;
  background-color: white;
  /*position: absolute; */
  position: relative;
  left: 720px;
  top: 0px;
}
@media (min-width: 981px) {
  .card.story-ytv {
    height: 405px;
    width: 240px;
  }
}
.card.story-ytv .card-image {
  position: absolute;
  /*position: relative;*/
  left: -42%;
  top: 0;
  width: auto;
  height: 243px;
}
.card.story-ytv p.category {
  color: #bbb;
}
.card.story-ytv::after {
  /*background-color: rgba(25, 25, 25, 0.6);*/
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
}
.card.story-ytv .byline {
  display: none;
}
.card.story-ytv:hover:after {
  background-position: center;
  background-repeat: no-repeat;
}

.ytv-latest {
  width: 253px;
  height: 240px;
  display: inline-block;
  background-color: black;
  margin-bottom: 20px;
}
.ytv-latest .ytv-gradient {
  /*background: linear-gradient(to bottom, rgba(25, 25, 25, 0.3) 0%, #191919 100%), no-repeat;*/
}
.ytv-latest .ytv-gradient::after {
  background-color: rgba(25, 25, 25, 0.4) !important;
}
.ytv-latest .ytv-card-title {
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  color: #ffffff;
  font-size: 1.125rem;
  font-family: "Playfair Display", bold;
  margin: 0;
  text-align: center;
  bottom: 5px;
  position: absolute;
}

/*END MAIN BODY STYLING*/
.item {
  position: absolute;
  left: 0px;
  top: 0px;
}
.item .ytv-title {
  color: #433f3f;
  font-weight: 600;
  letter-spacing: 0.025em;
  line-height: 1.2;
  font-size: 2rem;
  margin-bottom: 7px !important;
  display: inline-block;
}
.item .ytv-author {
  text-transform: uppercase;
  font-family: "Avenir-Roman", "Helvetica", "Arial";
  font-size: 0.9em;
  display: block;
}
.item .ytv-author a {
  color: #2882c8;
  font-size: 0.8em;
  font-family: "BentonSans-Regular", "Times New Roman", Times, serif;
}
.item .ytv-author date {
  color: #aaa;
  font-size: 0.8em;
  font-family: "BentonSans-Regular", "Times New Roman", Times, serif;
}

#article-content {
  min-height: 1550px;
}

.latest {
  font-style: italic;
  font-weight: 800;
  color: #433f3f;
  font-size: 2em;
  font-family: "Playfair Display", "Georgia", serif;
  letter-spacing: -0.2px;
  margin-top: 80px;
  margin-bottom: 40px;
}

.vid-wrapper {
  max-width: 720px;
  margin: 0 auto;
}

.sec-tag {
  display: inline-block;
  margin-top: 50px;
  font-weight: bold;
  background-color: #999;
}
.sec-tag:after {
  content: none;
}
@media (max-width: 480px) {
  .sec-tag {
    display: table;
    margin-top: 70px;
  }
}

.social-bottom-ytv {
  padding-left: 0;
}
@media (max-width: 980px) {
  .social-bottom-ytv {
    bottom: 8px;
  }
}
@media (min-width: 981px) {
  .social-bottom-ytv {
    bottom: 15px;
  }
}
.social-bottom-ytv li {
  display: inline;
}
.social-bottom-ytv img {
  width: 24px;
}

#ytv-article-info {
  margin: 0 auto;
  position: relative;
  font-family: "ModernoFB-Light", Arial, Helvetica, sans-serif;
}

#ytv-article-blurb {
  font-family: "Georgia", serif;
  font-size: 1rem;
  line-height: 1.4rem;
}

#ytv-article-text {
  padding: 0.8rem 1.5rem;
}

/* Mini author bios @ end of articles */
.mini-author-image {
  padding-right: 1rem;
  display: inline-block !important;
  margin: 0 auto !important;
  width: 10% !important;
  max-width: 10% !important;
}

#mini-author-bios {
  margin-bottom: 1rem !important;
  display: flex;
  align-items: center;
}

.mini-author-info {
  width: 90%;
  max-width: 90%;
}

.mini-author-name {
  font-family: "ModernoFB-Light", "Georgia", serif;
  font-size: 0.9rem;
  font-weight: bold;
}

.mini-author-email,
.mini-author-bio {
  font-family: "Georgia", serif;
  font-size: 0.9rem;
}

.mini-author-bio {
  margin-top: 0.3rem !important;
  line-height: 1.3rem;
}

.author.url.fn {
  /* Put authors on the same line for tablet/mobile */
  display: inline-block;
}

.no-hyperlink {
  border-bottom: none !important;
  box-shadow: none !important;
}

/*
#author.container{
    margin-bottom: 2%;
}

.card{
  &.author-card {
    height: 2 * ($card-height) + $gutter-size;
    width:  2 * ($card-height + 13px) + $gutter-size;
    border-bottom: none;
    top: 32px;
    padding: 0px 20px;
    background-color: #4DC293;

    @media (max-width: 725px){
      margin-top: 50px;
    }
    @media(max-width: 480px){
      width: 100%;
      height: 90vw;
      margin-top: 20px;
    }

    h1{
      font-family: 'Playfair Display', serif;
      font-weight: bolder;
      color: white;
      font-size: 50px;
      letter-spacing: 2px;
      margin-top: 40px;
    }

    h3{
      display: inline-block;
      color: #AFF7DD;
      letter-spacing: 1.2px;
      font-size: 18px;
    }
    i {
      margin-top: 3%;
      border-radius: 50%;


      width: 36px;
      height: 36px;
      padding: 9.5px;

      background: #7DF2C4;
      color: white;
      text-align: center;
    }
    a{
      text-decoration: none;
    }
    .author-email{
      top: 15px;
      left: 11px;
    }
    .author-twitter, .author-email{
      display: block;
      // h3{
      //   @media(max-width: 480px){
      //   display: none;
      // }
      //}
    }
    .author-title{
      bottom: 60px;
      color: white;
      @extend %time-category-style;
       @media(max-width: 880px){
         margin: 0px 355px 0px 0px;
       }
    }
    .archive{
      bottom: 52px;

      color:#AFF7DD;
      @extend %time-category-style;
      @media(max-width: 880px){
        margin: 0px 355px 0px 0px;
      }
    }
    :not(.card-image) {
      z-index: 2;
    }
  }

  &.author-photo{
    .card-image {
      height: 100%;
      width: auto;
      position: absolute;
      left: 0;
      z-index: 0;
      top:0;
      //height: 2 * $card-height + $gutter-size + $card-border-width;
    }

    &::after {
      @include bg-gradienter (( to right top, rgba(77,194,147, 0.95) 30%, rgba(77,194,147, 0.2) 100% ));
      top: 0;
      left: 0;
      width:100%;
      height:100%;
      content: "";
      position: absolute;
    }
  }
}

@media(max-width: 480px) {
  .fa-envelope, .fa-twitter {
    display: none !important;
  }

  .author-twitter, .author-email {
    padding-left: 15px;
  }
}

p.category {
  padding: 5px 0 0 0;
}
/*

/* NEW AUTHOR PAGE */
#author-info-header {
  text-align: center;
  display: block;
  margin: 0 auto;
  margin-bottom: 2%;
  font-family: "ModernoFB-Light", Arial, Helvetica, sans-serif;
}

.author-page-name, .author-contact-info, .author-page-title {
  margin-bottom: 1%;
}

.author-page-name {
  padding-top: 0.5rem;
  font-size: 3rem;
}

.author-contact-info {
  font-size: 1rem;
}

.author-page-bio {
  font-size: 1rem;
  width: 65%;
  margin: 0 auto 3% auto;
}

.author-page-title {
  font-size: 1.2rem;
}

.author-archive-header {
  text-align: left !important;
  padding-left: 5% !important;
  padding-right: 5% !important;
}

.author-page-img-box {
  /* Will need to add media query for mobile/tablets */
  border-radius: 50% !important;
  width: 100% !important;
  height: auto !important;
}

.author-page-image {
  margin: 0 auto;
  width: 12%;
  max-width: 12%;
}

@media (max-width: 1024px) {
  .author-page-bio {
    width: 80%;
  }

  .author-page-image {
    width: 16%;
    max-width: 16%;
  }
}
@media (max-width: 500px) {
  .author-page-bio {
    margin: 4% auto 10% auto;
    font-size: 0.7rem;
  }

  .author-contact-info {
    font-size: 0.8rem;
    margin-top: 4%;
  }

  .article-list-imgbox, .article-list-frame {
    display: none;
  }

  .author-page-image {
    width: 30%;
    max-width: 30%;
  }
}
/* If no author image (DEFAULT URL), then don't display it */
html {
  overflow-x: hidden;
}

#category-description {
  font-family: "ModernoFB-Light", "Times New Roman", Times, serif;
  font-size: 1.2rem;
  margin-bottom: 2%;
}

/* MULTIMEDIA PAGE */
#bottom-photo {
  display: flex;
  justify-content: space-between;
  border-top: 0.5px solid #707070;
  padding-top: 1em;
}
@media screen and (max-width: 768px) {
  #bottom-photo {
    flex-direction: column;
  }
}

#spotify-embed-container iframe {
  position: absolute;
  bottom: 5%;
  left: 50%;
  /* position the left edge of the element at the middle of the parent */
  transform: translateX(-50%);
  width: 80%;
  height: 80%;
}
@media screen and (max-width: 768px) {
  #spotify-embed-container iframe {
    bottom: 2%;
  }
}

#podcast-options {
  width: 40%;
}

#video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
}
#video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#youtube-video {
  max-width: 700;
  max-height: 394;
  margin-top: 0.75em;
}

#multimedia-page-wrapper {
  margin-top: 5vh;
  /*all category pages have 5vh top margin*/
  padding: 1vh 2.5vw;
  height: max-content;
}

#multimedia-ad {
  grid-row-start: 1;
  grid-row-end: 2;
  grid-column-start: 2;
  margin-bottom: 0.1em;
  border-bottom: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #multimedia-ad {
    grid-column: 1;
    grid-row: 1;
    border-bottom: 0vw;
    height: auto;
  }
}

.multimedia-grid {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  height: max-content;
}
@media screen and (max-width: 768px) {
  .multimedia-grid {
    border-bottom: 0vw;
    height: auto;
  }
}

#multimedia-grid-1 {
  grid-template-columns: 2fr 1.3fr;
}
@media screen and (max-width: 768px) {
  #multimedia-grid-1 {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, 1fr);
  }
}

#multimedia-grid-2 {
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 2fr);
  grid-template-rows: 0.25fr 1fr;
  margin-top: 0.5em;
}
@media screen and (max-width: 768px) {
  #multimedia-grid-2 {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, 1fr);
    border-bottom: 1px solid #707070;
    border-top: 1px solid #707070;
    border-right: 0vw;
    border-left: 0vw;
    display: flex;
    flex-direction: column;
    height: auto;
  }
}

#multimedia-ytv-section {
  padding: 1rem;
  padding-right: 1.5rem;
  grid-column-start: 1;
  border-right: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #multimedia-ytv-section {
    grid-column: 1;
    grid-row: 1;
    border-right: 0;
    border-bottom: 1px solid #707070;
  }
}

#multimedia-podcast-section {
  padding: 1rem;
  padding-left: 0.5rem;
  grid-column-start: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #multimedia-podcast-section {
    grid-column: 1;
    grid-row: 2;
  }
}

#multimedia-sub-title {
  align-self: flex-start;
  font-family: "BentonSans-Bold", Arial, sans-serif;
}

#podcast-dropdown {
  margin: 0.75em 1%;
  width: 100%;
  text-align: center;
  text-align-last: center;
  font-family: "ModernoFB-LightItalic", Times, serif;
}

#multimedia-data-section,
#multimedia-photo-section {
  margin: 0%;
  justify-content: flex-start;
  display: flex;
  flex-direction: column;
}

#photo-content,
#data-content {
  margin-top: 1.5rem;
  justify-content: space-between;
  display: flex;
  flex-direction: column;
  grid-row-start: 1;
  grid-column-start: 1;
}

#multimedia-photo-section {
  padding: 1rem;
  padding-left: 1rem;
  grid-row-start: 2;
  justify-content: flex-start;
  grid-column-start: 2;
  height: calc(100% - 2rem);
  /* subtract 2 rem to account for top and bottom padding) */
}
@media screen and (max-width: 768px) {
  #multimedia-photo-section {
    grid-column: 1;
    grid-row: 3;
  }
}

#data-content {
  height: 100%;
  display: flex;
}
@media screen and (max-width: 768px) {
  #data-content {
    padding-bottom: 0vw;
    /* white-space: nowrap; */
  }
}
@media screen and (max-width: 768px) and (max-width: 768px) {
  #data-content .left-img-article {
    flex-direction: column;
  }
}
@media screen and (max-width: 768px) {
  #data-content .top2-frame,
#data-content .top2-imgbox {
    width: 84vw;
    height: 56vw;
  }
}
@media screen and (max-width: 768px) {
  #data-content .left-img-article-textbox {
    text-align: center !important;
    margin-top: 1.2rem;
    padding-left: 0% !important;
  }
}
@media screen and (max-width: 768px) {
  #data-content .data-sub-article .category-article-blurb {
    text-align: left !important;
  }
}

#multimedia-data-section {
  grid-row-start: 1;
  grid-row-end: 3;
  border-right: 1px solid #707070;
  padding: 1rem;
  height: calc(100% - 2rem);
  /* subtract 2 rem to account for top and bottom padding) */
}
@media screen and (max-width: 768px) {
  #multimedia-data-section {
    display: flex;
    flex-direction: column;
    height: auto;
    grid-column: 1;
    grid-row: 2;
    border-right: 0;
    border-bottom: 1px solid #707070;
  }
}

@media screen and (max-width: 768px) {
  .top1-list-article {
    border-top: 0.5px solid #cbcbcb;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

.data-main-articles {
  margin-bottom: 1rem;
}

.data-sub-article {
  margin-bottom: 1rem;
}

#photo-main-article {
  margin-bottom: 1rem;
}
@media screen and (max-width: 768px) {
  #photo-main-article {
    flex-direction: column;
    padding-top: 0vw;
  }
}
@media screen and (max-width: 768px) {
  #photo-main-article .title {
    text-align: center;
    font-weight: bold;
  }
}

#photo-main-imgbox {
  width: 35vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  #photo-main-imgbox {
    align-content: center;
    margin-left: 0vw;
    margin-right: 0vw;
    max-width: 100%;
    width: 100%;
  }
}

#photo-main-frame {
  width: 35vw;
  height: 23vw;
}
@media screen and (max-width: 768px) {
  #photo-main-frame {
    align-content: center;
    width: 100%;
    height: 40vw;
    margin-left: 0vw;
    margin-right: 0vw;
    padding-left: 0vw;
  }
}

#photo-main-article-textbox {
  padding-top: 20%;
  padding-right: 2%;
}
@media screen and (max-width: 768px) {
  #photo-main-article-textbox {
    padding-top: 5%;
    padding-left: 2%;
  }
}

#photo-article-textbox {
  padding-right: 2%;
}

@media screen and (max-width: 768px) {
  .category-article-blurb {
    font-family: "ModernoFBCond-Regular";
  }
  .category-article-blurb #data-content {
    text-align: center;
  }
}

/*END OF MULTIMEDIA */
/* WKND AND MAG */
#wknd-cover-image {
  margin-top: 5%;
  margin-bottom: 1%;
  width: 100%;
  height: calc(19vw + 2vh);
}

#mag-cover-article {
  width: 100%;
}

#wkndmag-header-and-arrow {
  height: 9vh;
  margin-bottom: 1vh;
}

#read-rest-header {
  text-align: center;
  text-transform: uppercase;
  font-family: "BentonSans-Thin";
  color: gray;
  font-size: 1.5rem;
  font-weight: normal;
  margin-top: 1.5%;
  margin-bottom: 0%;
}
@media screen and (max-width: 768px) {
  #read-rest-header {
    margin-top: 3%;
    font-size: 1.15rem;
  }
}
@media screen and (max-width: 360px) {
  #read-rest-header {
    font-size: 0.9rem;
  }
}

#wkndmag-grid-2-per-row {
  /* width: 43vw; */
  width: 38.64vw;
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
  height: auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 6vw;
  grid-row-gap: 4.8vh;
}
@media screen and (max-width: 768px) {
  #wkndmag-grid-2-per-row {
    grid-template-columns: none;
  }
}

.wkndmag-article-box {
  display: flex;
  flex-direction: column;
  /* height: 30vw; */
}

.general-wkndmag-article-title {
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  font-size: 2rem;
  margin-top: 1%;
}
@media screen and (max-width: 768px) {
  .general-wkndmag-article-title {
    font-size: 1.6rem;
    margin-top: 3.5%;
  }
}

.general-wkndmag-article-author {
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
  color: #707070;
  font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
  .general-wkndmag-article-author {
    font-size: 1.2rem;
  }
}

.wkndmag-width-2-per-row {
  width: 38.64vw;
  max-width: 38.64vw;
}
@media screen and (max-width: 768px) {
  .wkndmag-width-2-per-row {
    width: 80vw;
    max-width: 80vw;
  }
}

.mag-image-prevent-stretching {
  object-fit: cover;
}

.wkndmag-width-3-per-row {
  width: 25.76vw;
}

.wkndmag-height-2-per-row {
  height: 28vw;
  max-height: 28vw;
}
@media screen and (max-width: 768px) {
  .wkndmag-height-2-per-row {
    height: 56vw;
    max-height: 56vw;
  }
}

.wkndmag-height-3-per-row {
  height: 18.67vw;
}

/*styling for 3 per row version for pagination by issue in future */
#wkndmag-grid-3-per-row {
  width: 25.76vw;
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
  height: 175vh;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-column-gap: 4vw;
  grid-row-gap: 4.8vh;
}

/* SPORTS AND OPINION */
#section-header {
  margin-top: 5vh;
  /*all category pages have 5vh top margin*/
  padding: 1vh 2.5vw;
  height: max-content;
}
@media screen and (max-width: 768px) {
  #section-header {
    margin-top: 0;
  }
}

#section-page-header {
  margin-bottom: 1rem;
  font-size: 2rem;
  font-family: "BentonSans-Bold";
  padding: 1vh 6vw;
}
@media screen and (max-width: 768px) {
  #section-page-header {
    grid-column: 1;
    grid-row: 1;
    padding: 0 3vw;
  }
}

#section-grid {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 768px) {
  #section-grid {
    display: flex;
    flex-direction: column;
    border-bottom: none;
  }
}

#section-feature {
  grid-column-start: 1;
  grid-column-end: 2;
  border-right: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #section-feature {
    grid-column: 1;
    grid-row: 2;
    border-right: none;
    border-bottom: 0.5px solid #cbcbcb;
    margin-bottom: 1rem;
  }
}

#sports-section-feature {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 3;
  border-right: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #sports-section-feature {
    grid-column: 1;
    grid-row: 2;
    border-right: none;
    border-bottom: 0.5px solid #cbcbcb;
    margin-bottom: 1rem;
  }
}

#sports-ims-embed-container {
  border-top: 1px solid #707070;
}

#sports-ims-embed-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

#sports-ims-embed-title {
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
  margin-bottom: 1rem;
}

#sports-ims-embed-season {
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  font-size: 1rem;
  margin-bottom: 0.8rem;
  color: #707070;
}

#sports-ims-embed-scoreboard {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: stretch;
}

.sports-ims-embed-winner-container {
  display: flex;
  flex-direction: row;
}

.sports-ims-embed-winner-container-right {
  margin-left: 0.5em;
  margin-top: 0.5em;
}

.sports-ims-embed-number {
  color: #1A317C;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  font-size: 5rem;
  font-weight: bolder;
}

.sports-ims-embed-label {
  color: #1A317C;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
}

#sports-ims-embed-button {
  border: 0.1rem solid #707070;
  text-align: right;
  font-size: 0.7rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  background-color: white;
  padding: 0.4rem;
  color: #707070;
}

#sports-ims-embed-button-container {
  text-align: right;
}

#editors-picks {
  grid-column-start: 2;
  grid-column-end: 3;
  flex-direction: column;
  display: flex;
}
@media screen and (max-width: 768px) {
  #editors-picks {
    grid-column: 1;
    grid-row: 3;
    border-bottom: 0.5px solid #cbcbcb;
  }
}

#sports-editors-picks {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row: 1;
  flex-direction: column;
  display: flex;
}
@media screen and (max-width: 768px) {
  #sports-editors-picks {
    grid-column: 1;
    grid-row: 3;
    border-bottom: 0.5px solid #cbcbcb;
  }
}

#editors-picks-list {
  justify-content: space-evenly;
  flex-direction: column;
  display: flex;
  height: 100%;
}

#editors-picks-title {
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
  margin-bottom: 1rem;
}

#editors-picks-articles {
  /*border-bottom: 1px solid #dfdede;*/
  margin-bottom: 1rem;
}

#section-latest {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
}

.section-feature-img {
  margin-bottom: 0% !important;
}

/* Generating list of articles in category page (GENERIC) */
#generic-category-page {
  margin-top: 5vh;
  /*all category pages have 5vh top margin*/
}

.category-article-list {
  display: flex;
  flex-flow: column wrap;
  padding-left: 5%;
  padding-right: 5%;
}

.category-list-heading {
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
  padding: 0;
  margin: 1rem 0 2rem 0;
}

.category-article-title {
  font-family: "ModernoFB-LightItalic", times, serif;
  font-size: 1.4rem;
}

.category-article-author,
.category-article-role,
.category-article-date,
.category-article-divider {
  font-family: "BentonSans-Book", Arial, Helvetica, sans-serif;
  font-size: 0.9rem;
  color: #938f8f;
  margin-bottom: 2%;
}

.category-article-blurb {
  font-family: "ModernoFB-Light", "Times New Roman", Times, serif;
  font-size: 1rem;
}

.article-list-imgbox {
  width: 15vw;
  margin: 0;
  padding: 0;
}

.article-list-frame {
  width: 15vw;
  height: 10vw;
  border: 0.5px solid #707070;
}

.article-list-imgbox > img {
  max-width: 100%;
  height: auto;
  border: 0.5px solid #707070;
}

/* END OF SPORTS AND OPINION */
/* COVID PAGE */
.covid-section-title {
  font-family: "BentonSans-Bold", Arial, sans-serif;
}

.covid-section-desc {
  font-family: "ModernoFBCond-Regular", Times, serif;
  font-size: 1.1rem;
}

.covid-section-subtitle {
  font-family: "BentonSans-Bold", Arial, sans-serif;
  font-size: 1.5rem;
}

/* ARCHIVES */
@media screen and (max-width: 768px) {
  #archives-section {
    padding-right: 0 !important;
  }
}
.University-archives-box {
  background-color: #1a6075;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .University-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.University-archives-link {
  color: #1a6075;
  text-decoration: underline;
}

.Opinion-archives-box {
  background-color: #df9100;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .Opinion-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.Opinion-archives-link {
  color: #df9100;
  text-decoration: underline;
}

.City-archives-box {
  background-color: #8e0012;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .City-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.City-archives-link {
  color: #8e0012;
  text-decoration: underline;
}

.Sci-Tech-archives-box {
  background-color: #145141;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .Sci-Tech-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.Sci-Tech-archives-link {
  color: #145141;
  text-decoration: underline;
}

.Sports-archives-box {
  background-color: #1a317c;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .Sports-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.Sports-archives-link {
  color: #1a317c;
  text-decoration: underline;
}

.Weekend-archives-box {
  background-color: #3593b7;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .Weekend-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.Weekend-archives-link {
  color: #3593b7;
  text-decoration: underline;
}

.Arts-archives-box {
  background-color: #9f4482;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .Arts-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.Arts-archives-link {
  color: #9f4482;
  text-decoration: underline;
}

.Multimedia-archives-box {
  background-color: #781788;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .Multimedia-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.Multimedia-archives-link {
  color: #781788;
  text-decoration: underline;
}

.Magazine-archives-box {
  background-color: #c33c1f;
  overflow-y: hidden;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  padding: 5%;
  min-width: 13.4vw;
  max-width: 13.4vw;
  height: 12.7vw;
  text-align: center;
  margin-right: 3vw;
  font-size: 1.65vw;
  color: white;
}
@media screen and (max-width: 768px) {
  .Magazine-archives-box {
    max-width: 40vw;
    max-height: 37vw;
    margin-right: 5vw;
    width: 40vw;
    height: 37vw;
    padding: 5vw;
    font-size: 5.1vw;
    text-align: center;
    vertical-align: middle;
    padding-top: 5vw;
  }
}

.Magazine-archives-link {
  color: #c33c1f;
  text-decoration: underline;
}

#date_picker {
  width: 15%;
}

.archives-wrapper {
  height: auto;
  border: 0vw solid #ddd;
  display: flex;
  overflow-x: auto;
  vertical-align: middle;
  padding: 1vw 0;
}

.archives-wrapper::-webkit-scrollbar {
  width: 1vw;
}

.archives-wrapper::-webkit-scrollbar-track {
  border: 7vw #8b8cc1;
}

.archives-wrapper::-webkit-scrollbar-thumb {
  background: linear-gradient(0deg, #707070, #707070);
  border-radius: 3vw;
  width: 1vw;
}

/* COMMENCEMENT 2021 */
.c21-page-wrapper {
  margin-top: 5vh;
  /*all category pages have 5vh top margin*/
  padding: 1vh 2.5vw;
  height: max-content;
}
@media screen and (max-width: 768px) {
  .c21-page-wrapper {
    padding: 1vh 1vw;
  }
}

.c22-page-wrapper {
  max-width: 1300px;
  margin-left: auto;
  margin-right: auto;
  height: max-content;
}
@media screen and (max-width: 725px) {
  .c22-page-wrapper {
    padding: 9vh 1vw 1vh 1vw;
  }
}

.c21-page-header {
  margin-bottom: 1rem;
  font-family: "BentonSans-Bold";
  padding: 1vh 6vw;
  padding-left: 1rem;
  color: black;
  text-align: center;
  font-weight: bold;
  font-size: 3.3rem;
}
@media screen and (max-width: 768px) {
  .c21-page-header {
    grid-column: 1;
    grid-row: 1;
    padding: 0 0;
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 320px) {
  .c21-page-header {
    font-size: 1.85rem;
  }
}

#c21-main-page-header {
  margin-bottom: 1rem;
  padding: 1vh 6vw;
  color: black;
  font-weight: bold;
  font-size: 3.6rem;
  font-family: "ModernoFB-Regular", "Times New Roman", Times, serif;
}
@media screen and (max-width: 768px) {
  #c21-main-page-header {
    grid-column: 1;
    grid-row: 1;
    padding: 0 3vw;
    font-size: 2.4rem;
    text-align: center;
  }
}
@media screen and (max-width: 320px) {
  #c21-main-page-header {
    font-size: 1.85rem;
  }
}

#c22-main-page-header {
  margin-bottom: 1rem;
  border-bottom: 2px solid #707070;
  padding-left: 2em;
  padding-right: 2em;
}
@media screen and (max-width: 725px) {
  #c22-main-page-header {
    grid-column: 1;
    grid-row: 1;
    padding: 0 3vw;
  }
}
@media screen and (max-width: 725px) {
  #c22-main-page-header {
    text-align: center;
  }
}

.c-nav-tag {
  margin-right: 20px;
}

#tag-joinus {
  float: right;
}

#commencement-navbar {
  color: #707070;
  font-size: 1.4rem;
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
  padding-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #commencement-navbar {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 320px) {
  #commencement-navbar {
    font-size: 1rem;
  }
}

.title-container {
  display: flex;
  align-items: left;
  justify-content: space-between;
  position: absolute;
}

#commencement-main-page-title {
  color: black;
  font-weight: bold;
  font-size: 4.5rem;
  font-family: "ModernoFB-Regular", "Times New Roman", Times, serif;
}
@media screen and (max-width: 725px) {
  #commencement-main-page-title {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 320px) {
  #commencement-main-page-title {
    font-size: 1.85rem;
  }
}

#commencement-main-page-subtitle {
  font-size: 1.4rem;
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
}

.commencement-section-header {
  font-size: 1.8rem;
}
@media screen and (max-width: 725px) {
  .commencement-section-header {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 320px) {
  .commencement-section-header {
    font-size: 1.2rem;
  }
}

#commencement-news-features {
  grid-column-start: 2;
  grid-column-end: 3;
  flex-direction: column;
  display: flex;
}
@media screen and (max-width: 768px) {
  #commencement-news-features {
    grid-column: 1;
    grid-row: 3;
    border-bottom: 0.5px solid #cbcbcb;
  }
}

#commencement-news-features-list {
  justify-content: space-evenly;
  flex-direction: column;
  display: flex;
  height: 100%;
}

#commencement-news-features-title {
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
  margin-bottom: 3.5rem;
}

#commencement-news-features-articles {
  /*border-bottom: 1px solid #dfdede;*/
  margin-bottom: 1rem;
}

#about-c21 {
  margin-top: 10px;
  height: 20px;
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
  text-align: right;
  border-bottom: black;
  color: #656565;
  font-size: 1rem;
}

.fy22-news-title {
  margin-bottom: 1rem;
  font-size: 2rem;
  font-family: "BentonSans-Bold";
  padding-top: 1vh;
  color: black;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .fy22-news-title {
    grid-column: 1;
    grid-row: 1;
    padding: 0 3vw;
  }
}

.fy22-news-subtitle {
  text-align: center;
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
  padding-bottom: 2em;
  font-weight: bold;
}

/* COMMENCEMENT 2021: WEEKEND */
.c21-wknd-grid {
  border-bottom: 2px solid #707070;
  display: grid;
  grid-gap: 0.5rem;
  height: max-content;
  min-height: 570px;
}
@media screen and (max-width: 768px) {
  .c21-wknd-grid {
    border-bottom: 0vw;
    height: auto;
    min-height: none;
  }
}

#c21-wknd-grid-1 {
  grid-template-columns: 2fr 1.3fr;
}
@media screen and (max-width: 768px) {
  #c21-wknd-grid-1 {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, 1fr);
    border-bottom: 1px solid #707070;
    border-top: 1px solid #707070;
    border-right: 0vw;
    border-left: 0vw;
    display: flex;
    flex-direction: column;
    height: auto;
  }
}

#seniors-2021 {
  margin-top: 0%;
  margin-bottom: 1%;
  width: 100%;
  height: 100%;
}

#c21-wknd-senior-section {
  padding: 1rem;
  padding-right: 1.5rem;
  grid-column-start: 1;
  border-right: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #c21-wknd-senior-section {
    grid-column: 1;
    grid-row: 1;
    border-right: 0;
    border-bottom: 1px solid #707070;
  }
}

@media screen and (max-width: 768px) {
  #c21-wknd-podcast-section {
    min-height: 600px;
  }
}

#c21-wknd-playlist-wrapper {
  grid-row-start: 2;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 768px) {
  #c21-wknd-playlist-wrapper {
    grid-column: 1;
    grid-row: 3;
  }
}

#c21-wknd-articles-1 {
  margin-bottom: -1%;
  width: 100%;
}
@media screen and (max-width: 768px) {
  #c21-wknd-articles-1 {
    padding-left: 5%;
    padding-right: 5%;
    grid-column: 1;
    grid-row: 2;
  }
}

#spotify-embed-container-c21 iframe {
  position: absolute;
  margin-top: 2.9%;
  bottom: 4%;
  left: 50%;
  /* position the left edge of the element at the middle of the parent */
  transform: translateX(-50%);
  width: 90%;
  height: calc(84% - 198px);
}
@media screen and (max-width: 768px) {
  #spotify-embed-container-c21 iframe {
    height: 48.5%;
    margin-top: 2%;
    bottom: 4%;
    grid-row: 3;
  }
}
@media screen and (max-width: 768px) and (min-width: 540px) {
  #spotify-embed-container-c21 iframe {
    height: 45%;
  }
}
@media screen and (max-width: 768px) and (width: 768px) {
  #spotify-embed-container-c21 iframe {
    height: 44%;
  }
}

#alignment-2021 {
  display: block;
  margin: 0% auto 1% auto;
  width: 50%;
}
@media screen and (max-width: 768px) {
  #alignment-2021 {
    width: 90%;
  }
}

#c21-wknd-quiz {
  height: 60vh;
}

/* COMMENCEMENT 2021: NEWS */
.new-year {
  margin-bottom: 1rem;
  font-size: 2rem;
  font-family: "BentonSans-Bold";
  padding: 1vh 6vw;
  padding-left: 1rem;
  color: black;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .new-year {
    grid-column: 1;
    grid-row: 1;
    padding: 0 3vw;
  }
}

/* FIRST-YEAR ISSUE 2021 */
/* FY 2021: WKND/LETTERS */
.collapsible {
  background-color: #919191;
  color: white;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  font-family: "ModernoFB-LightItalic", times, serif;
  text-align: left;
  outline: none;
  font-size: 1.4rem;
}

.active,
.collapsible:hover {
  background-color: #858585;
}

.collapsible:after {
  content: "+";
  color: white;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "−";
}

.letter-content {
  font-family: "Georgia", serif;
  font-size: 1.2rem;
  padding: 0 18px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  background-color: #efefef;
  margin-bottom: 1.5%;
}

#letter-section {
  margin: 5% 0%;
  max-width: 90%;
  padding: 1vh 7vw;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
@media screen and (max-width: 768px) {
  #letter-section {
    margin: 0%;
  }
}

#letter-text {
  font-size: 1.2em;
  display: flex;
  justify-content: space-between;
}

#letters-button {
  font-family: "ModernoFB-LightItalic", times, serif;
  font-size: 1.5rem;
  background-color: #656565;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  display: inline-block;
  margin-top: 2%;
  margin-bottom: 5%;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  #letters-button {
    margin-bottom: 7%;
  }
}

#letters-button:hover {
  background-color: #303030;
}

/* FY 2021: NEWS */
.fy21-news-subcat {
  margin-bottom: 1rem;
  font-size: 1.8rem;
  font-family: "BentonSans-Bold";
  color: black;
  text-align: center;
  font-style: italic;
}
@media screen and (max-width: 768px) {
  .fy21-news-subcat {
    grid-column: 1;
    grid-row: 1;
    padding: 0 3vw;
  }
}

/* INTRAMURALS PAGE */
#sports-section-grid {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: 3fr 1fr;
}
@media screen and (max-width: 768px) {
  #sports-section-grid {
    display: flex;
    flex-direction: column;
    border-bottom: none;
  }
}

#section-full-page-IM {
  padding: 1vh 6vw;
}

#section-header-IM {
  margin-top: 5vh;
  /*all category pages have 5vh top margin*/
  padding: 1vh 2.5vw;
  height: max-content;
}
@media screen and (max-width: 768px) {
  #section-header-IM {
    margin-top: 0;
  }
}

#section-page-header-IM {
  margin-bottom: 1rem;
  font-size: 2rem;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  #section-page-header-IM {
    grid-column: 1;
    grid-row: 1;
  }
}

#subheading-im {
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
  margin-bottom: 1rem;
}

.dropdown-im {
  font-size: 0.8rem;
  font-weight: bold;
  background-color: white;
  padding: 0.25rem;
  border-radius: 0.25rem;
  border-color: #1A317C;
  color: #1A317C;
}

/* END OF INTRAMURALS PAGE */
#comm-wknd-top-img {
  margin-top: 0%;
  margin-bottom: 1%;
  width: 100%;
  height: 100%;
  object-fit: scale-down;
}

/*Styling for nav bar on about pages */
.about-nav {
  list-style-type: none !important;
  margin: 0 0 1.8% 0;
  padding: 0;
  overflow: hidden;
  background-color: white;
  justify-content: center;
  display: flex;
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
}

.about-nav li {
  float: left;
}

.active-about-nav {
  color: black !important;
}

.active-about-nav:hover {
  color: white !important;
}

.mobile-only-subnav {
  display: none;
}

.about-nav li a {
  display: block;
  color: #707070;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-family: "BentonSans-Bold", sans-serif;
  text-transform: uppercase;
}

.about-nav li a:hover {
  background-color: #111;
  color: white;
}

@media (max-width: 500px) {
  .standard-page-header {
    font-size: 2.8rem;
  }
}
@media screen and (max-width: 750px) {
  .desktop-only-subnav {
    display: none;
  }

  .mobile-only-subnav {
    font-size: 0.85rem;
    display: block;
  }
}
@media screen and (min-width: 700px) and (max-width: 800px) {
  .desktop-only-subnav li a {
    font-size: 0.7rem;
  }
}
.standard-page-box {
  padding: 1vh 5vw;
}

.standard-page-header {
  margin-top: 5vh;
  margin-bottom: 1rem;
  font-size: 4rem;
  color: black;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
}

/* Styling for all pages created in wp dashboard */
#standard-page-content {
  padding: 1vh 5vw;
  height: max-content;
  font-family: "Georgia", serif;
}

.standard-page-text h1,
.standard-page-text h2,
.standard-page-text h3,
.standard-page-text h4,
.standard-page-text h5,
.standard-page-text h6 {
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
}
.standard-page-text div, .standard-page-text p, .standard-page-text span {
  letter-spacing: 0.01em;
  line-height: 1.35em;
}
.standard-page-text p {
  font-size: 1rem;
}
.standard-page-text a {
  color: #191919;
  text-decoration: none;
  box-shadow: inset 0 -2px 0 #5ea6df;
  border-bottom: 0.5px solid #5ea6df;
  transition: background 0.15s cubic-bezier(0.33, 0.66, 0.66, 1);
}
.standard-page-text a:hover {
  color: white;
  background-color: #5ea6df;
  transition: background 0.15s cubic-bezier(0.33, 0.66, 0.66, 1);
}
.standard-page-text h1 {
  font-size: 2rem;
  line-height: 1.25;
}
.standard-page-text h2 {
  font-size: 1.625rem;
  line-height: 1.15384615;
}
.standard-page-text h3 {
  font-size: 1.375rem;
  line-height: 1.13636364;
}
.standard-page-text h4 {
  font-size: 1.125rem;
  line-height: 1.11111111;
}
.standard-page-text h5 {
  font-size: 1rem;
  line-height: 1.25;
}
.standard-page-text h6 {
  font-size: 0.75rem;
  line-height: 1.25;
}
@media (min-width: 900px) {
  .standard-page-text h1 {
    font-size: 2rem;
    line-height: 1.05;
  }
  .standard-page-text h2 {
    font-size: 1.7rem;
    line-height: 1.125;
  }
  .standard-page-text h3 {
    font-size: 1.5rem;
    line-height: 1.25;
  }
}

a {
  text-decoration: none;
  color: inherit;
}

/*COLORS OF THE HEADERS OF EACH SECTION/CATEGORY PAGE*/
.University-heading {
  color: #1a6075;
}

.Opinion-heading {
  color: #df9100;
}

.City-heading {
  color: #8e0012;
}

.Sci-Tech-heading {
  color: #145141;
}

.Sports-heading {
  color: #1a317c;
}

.Weekend-heading {
  color: #3593b7;
}

.Arts-heading {
  color: #9f4482;
}

.Multimedia-heading {
  color: #781788;
}

.Magazine-heading {
  color: #C33C1F;
}

/* STYLING TO MAKE ADS RESPONSIVE */
.mid-banner span {
  display: inline-block;
  width: 100%;
  height: auto;
}

.mid-banner a {
  display: inline-block;
  width: 100% !important;
  height: auto !important;
}

.mid-banner img {
  width: 100%;
  height: auto !important;
}

.mid-banner {
  width: 100%;
  height: 100% !important;
  display: flex;
  justify-content: center;
  margin: 0 auto;
  flex-direction: column;
}

#middle-ad-mobile img {
  width: 100%;
  height: auto !important;
}

.section-title {
  margin-bottom: 1rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  .section-title {
    padding-top: 0.6rem;
  }
}

/* GENERAL STYLING FOR ALL AUTHORS AND TITLES */
.title {
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  color: black;
}

.article-author {
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
  font-weight: normal;
  color: #656565;
}
@media screen and (max-width: 768px) {
  .article-author {
    margin-top: 2% !important;
  }
}

.element {
  background-clip: content-box;
  /* for testing purposes
  to make it easier to see padding and margins*/
  padding: 1.5vw;
}

/* GENERAL STYLING FOR ALL ARTICLE IMGS AND CAPTIONS */
[class$=-frame] > img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

[id$=-frame] > img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

figcaption {
  text-align: right;
  font-size: 0.6rem;
  color: #656565;
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
}

/*.article-div {
    color: black;
}*/
/* STYLE FOR GRID 1 */
#a1 {
  padding: 1vh 2.5vw;
  height: max-content;
}

#grid1 {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 2fr 0.9fr;
  grid-template-columns: repeat(14, 1fr);
}
@media screen and (max-width: 768px) {
  #grid1 {
    display: flex;
    flex-direction: column;
  }
}

/* STYLE FOR MAIN ARTICLE IN GRID 1*/
#main-feature {
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 1;
  grid-row-end: 3;
  border-right: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #main-feature {
    grid-column: 1;
    grid-row: 1;
    border-bottom: 1px solid #707070;
    border-right: 0;
  }
}

#featured-imgbox {
  margin-bottom: 10%;
}

.featured-frame {
  width: 35vw;
  margin: 0 auto;
  height: 21.2vw;
}
@media screen and (max-width: 768px) {
  .featured-frame {
    width: 90vw;
    height: 50vw;
  }
}

#featured-textbox {
  margin: 5% 0%;
  max-width: 90%;
  padding: 1vh 3vw;
  text-align: center;
}

#featured-section-and-author {
  font-size: 1em;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  color: black;
}

#main-feature-author {
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
  color: #656565;
}

#featured-section-and-author > #divider {
  color: black;
}

#featured-title {
  font-family: "ModernoFBCond-Regular";
  font-weight: 900;
  font-size: 1.8em;
}

#featured-blurb {
  font-family: "ModernoFB-Regular", "Times New Roman", Times, serif;
  color: #656565;
  font-size: 1.2em;
}

/* END OF STYLE FOR MAIN ARTICLE IN GRID 1*/
/* STYLE FOR LIST OF SUB-MAIN ARTICLES IN GRID 1*/
#sub-main-list {
  display: flex;
  justify-content: space-evenly;
  flex-direction: column;
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 1;
  grid-row-end: 3;
}
@media screen and (max-width: 768px) {
  #sub-main-list {
    grid-column: 1;
    grid-row: 2;
    min-height: 50vh;
  }
}

.sub-main-section-name {
  font-size: 0.8em;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  color: black;
  margin-bottom: 2%;
}

.sub-main-blurb {
  font-family: "ModernoFB-Regular", "Times New Roman", Times, serif;
  font-size: 0.9em;
}
@media screen and (min-width: 2000px) {
  .sub-main-blurb {
    font-size: 1.3rem;
  }
}

.right-img-article {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 100%;
  flex-direction: row;
  padding-left: 0;
  margin-left: 0;
  padding-right: 0%;
}

.right-img-article-textbox {
  padding-left: 0%;
  padding-right: 6%;
  max-width: 94%;
  width: 100%;
  /*remaining space-img box*/
  height: auto;
}

.sub-main-imgbox {
  width: 10vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .sub-main-imgbox {
    width: 42vw;
  }
}

.sub-main-frame {
  width: 10vw;
  height: 10vw;
  border: 0.5px solid #707070;
}
@media screen and (max-width: 768px) {
  .sub-main-frame {
    width: 42vw;
    height: 28vw;
  }
}

.sub-main-imgbox > img {
  max-width: 100%;
  height: auto;
  border: 0.5px solid #707070;
}

.article-author.sub-main {
  margin-bottom: 2%;
  font-size: 0.8rem;
}

.title.sub-main {
  margin-bottom: 2%;
  font-size: 1.1rem;
}

.right-img-article figcaption {
  font-size: 0.6em;
}

/* END OF STYLE FOR LIST OF SUB-MAIN ARTICLES IN GRID 1*/
/* START OF STYLE FOR OPINION SECTION */
#opinion-section {
  color: #df9100;
  border-left: 2px solid #707070;
  grid-column-start: 12;
  grid-column-end: 15;
  grid-row-start: 1;
  grid-row-end: 3;
}
@media screen and (max-width: 768px) {
  #opinion-section {
    border-left: 0;
    min-height: auto;
    border-top: 2px solid #707070;
  }
}

#opinion-list {
  /* calculate height by subtracting section title (1.1rem font, 1rem padding) 
  and padding from element (1.5vw top and bottom) */
  height: calc(100% - 2.2rem - 3vw);
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}

.opinion-article {
  margin-bottom: 0.3em;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .opinion-article {
    border-top: 0.5px solid #cbcbcb;
    padding: 1rem 0rem;
    align-items: center;
  }
}

#opinion-with-photo {
  display: flex;
  flex-direction: row;
}

.opinion-text-no-photo {
  color: black;
}

.opinion-text-with-photo {
  margin-right: 3%;
  text-align: left;
  width: 97%;
  color: black;
  display: inline-block;
}

.opinion-role {
  font-size: 0.8rem;
  color: #656565;
  font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
}

.opinion-author,
.opinion-title {
  width: 100%;
  font-size: 1.15rem;
  font-family: "ModernoFB-RegularItalic", "Times New Roman", Times, serif;
}

.opinion-imgbox {
  position: relative;
  right: 0;
  width: 22%;
  min-width: 22%;
  max-width: 22%;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .opinion-imgbox {
    width: 18%;
    min-width: 18%;
    max-width: 18%;
  }
}

#opinion-section a {
  min-width: 78%;
  max-width: 78%;
  width: 78%;
}
@media screen and (max-width: 768px) {
  #opinion-section a {
    min-width: 82%;
    max-width: 82%;
    width: 82%;
  }
}

.opinion-imgbox > img {
  max-width: 100%;
  height: auto;
  border: 0.5px solid #707070;
  /*img must be square for it to be cropped into circle*/
  border-radius: 50%;
}

/* END OF STYLE FOR OPINION SECTION */
/* START OF STYLE FOR COVID SECTION */
#covid {
  display: flex;
  flex-direction: row;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  border-top: 2px solid #707070;
  grid-column-start: 7;
  grid-column-end: 15;
  grid-row-start: 2;
  padding: 0.3rem;
}
@media screen and (max-width: 768px) {
  #covid {
    grid-column: 1;
    grid-row: 4;
    flex-direction: column;
    flex-flow: column-reverse;
    max-height: none;
  }
}

#covid-header {
  margin-bottom: 0.3rem;
  color: #A34D03;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}

#covid-subhead {
  margin-bottom: 0.6rem;
  text-transform: uppercase;
  color: #656565;
  font-family: "BentonSans-Regular", Arial;
  font-size: 0.9rem;
}

#covid-info {
  width: 60%;
  margin: 0 auto;
  padding: 0 0 0 1rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  #covid-info {
    width: 100%;
    padding: 1rem 0rem 0 0rem;
  }
}

#covid-graph {
  width: 40%;
}
@media screen and (max-width: 768px) {
  #covid-graph {
    width: 100%;
  }
}

/* END OF STYLE FOR COVID SECTION */
/* STYLE FOR GRID 2 */
#a2 {
  padding: 1vh 2.5vw;
  height: max-content;
}

#grid2 {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 0.5fr 2fr;
  grid-template-columns: repeat(14, 1fr);
  border-bottom: 2px solid #707070;
}
@media screen and (max-width: 768px) {
  #grid2 {
    border-bottom: 0;
    display: flex;
    flex-direction: column;
  }
}

#top-ad {
  grid-column-start: 1;
  grid-column-end: 9;
  grid-row-start: 1;
  margin-bottom: 0.1em;
  overflow-wrap: break-word;
}
@media screen and (max-width: 768px) {
  #top-ad {
    height: auto;
  }
}

/* START OF STYLE FOR UNIVERSITY SECTION */
#university-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-columns: repeat(3, 1fr);
  height: max-content;
  /*@media screen and (min-width: 769px) and (max-width: 1100px){
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: 1fr .5fr;
  }*/
}
@media screen and (max-width: 768px) {
  #university-grid {
    display: flex;
    flex-direction: column;
  }
}

#university-section {
  grid-column-start: 1;
  grid-column-end: 9;
  grid-row-start: 2;
  grid-row-end: 4;
  color: #004e66;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
}
@media screen and (max-width: 768px) {
  #university-section {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    border-bottom: 2px solid #707070;
  }
}

@media screen and (min-width: 769px) and (max-width: 1100px) {
  #final-university-article {
    display: none;
  }
}

#left-university,
#middle-university,
#right-university {
  padding-bottom: 0.1em;
}

#left-university {
  grid-column-start: 1;
  grid-column-end: 2;
}

#middle-university {
  grid-column-start: 2;
  grid-column-end: 3;
  border-right: 1px solid #707070;
}
@media screen and (max-width: 768px) {
  #middle-university {
    border-right: none;
  }
}

#right-university {
  margin-left: calc(8% - 0.5em);
  grid-column-start: 3;
  grid-column-end: 4;
  /*@media screen and (min-width: 769px) and (max-width: 1100px){
      grid-column-start: 1;
      grid-column-end: 3;
      grid-row-start: 2;
  }*/
}
@media screen and (max-width: 768px) {
  #right-university {
    margin-left: 0;
  }
}

#university-list {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  /*@media screen and (min-width: 769px) and (max-width: 1100px){
      flex-direction: row;
  }*/
}

/* END OF STYLE FOR UNIVERSITY SECTION */
/* START OF STYLE FOR MULTIMEDIA SECTION */
#multimedia-section {
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #712e6e;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  border-left: 2px solid #707070;
  grid-column-start: 9;
  grid-column-end: 15;
  grid-row-start: 1;
  grid-row-end: 4;
  overflow-y: auto;
  height: auto;
  /*fix this for line*/
  /*background-color: #71ff64;*/
}
@media screen and (max-width: 768px) {
  #multimedia-section {
    min-height: auto;
    width: 100%;
    border-left: 0;
  }
}

#podcast-section {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin: 0;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #podcast-section {
    align-self: center;
  }
}

#ytv-section {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 768px) {
  #ytv-section {
    align-self: center;
  }
}

#ytv-title {
  font-size: 1.2rem;
  color: black;
  text-align: center;
  font-family: "ModernoFBCond-Regular", "Times New Roman", Times, serif;
  width: 80%;
  margin: 3% auto;
  padding: 1% 0;
  border-top: 0.5px solid black;
  border-bottom: 0.5px solid black;
}
@media screen and (max-width: 768px) {
  #ytv-title {
    width: 80vw;
    align-self: center;
  }
}

#homepage-video-wrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
}

#homepage-video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*#ytv-blurb {
    font-size: .9rem;
    color: black;
    font-family: "BentonSans-Regular", Arial, Helvetica, sans-serif;
}*/
/* END OF STYLE FOR MULTIMEDIA SECTION */
/* END OF STYLE FOR GRID 2 */
/* STYLE FOR GRID 3 */
#a3 {
  height: max-content;
  padding: 1vh 2.5vw;
}

#grid3,
.section-page-grid1 {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5em;
  grid-template-rows: repeat(14, 1fr);
  grid-template-columns: repeat(16, 1fr);
}
@media screen and (max-width: 768px) {
  #grid3,
.section-page-grid1 {
    border-top: none;
    display: flex;
    flex-direction: column;
  }
}

/* START OF SCITECH TOPIC 2 STYLE */
#scitech-section,
.top2-section {
  padding-left: 0.5vw;
  padding-right: 0.5vw;
  color: #0e7037;
  border-right: 2px solid #707070;
  display: flex;
  flex-direction: column;
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 1;
  grid-row-end: 12;
}
@media screen and (max-width: 768px) {
  #scitech-section,
.top2-section {
    grid-column: 1;
    grid-row: 3;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: auto;
  }
}

#scitech-list,
.top2-list {
  margin: 0%;
  text-transform: none;
  overflow-y: auto;
  /*get overflow to expand*/
  height: 100%;
  justify-content: space-between;
  display: flex;
  flex-direction: column;
}
#scitech-list article,
.top2-list article {
  margin-bottom: 1em;
}

/* END OF SCITECH STYLE */
#middle-ad-desktop {
  border-top: 2px solid #707070;
  grid-column-start: 7;
  grid-column-end: 17;
  grid-row-start: 12;
  grid-row-end: 15;
}
@media screen and (max-width: 768px) {
  #middle-ad-desktop {
    display: none;
  }
}

#middle-ad-mobile {
  display: none;
}
@media screen and (max-width: 768px) {
  #middle-ad-mobile {
    display: flex;
  }
}

/* START OF STYLE FOR CITY SECTION */
.city-grid,
.top1-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 0.8fr 1fr;
  grid-template-columns: 1fr 1.2fr;
}
@media screen and (max-width: 768px) {
  .city-grid,
.top1-grid {
    display: flex;
    flex-direction: column;
  }
}

#city-section,
.top1-section {
  color: #b40017;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 1;
  grid-row-end: 15;
  border-right: 2px solid #707070;
}
@media screen and (max-width: 768px) {
  #city-section,
.top1-section {
    grid-column: 1;
    grid-row: 2;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: auto;
  }
}

@media screen and (max-width: 768px) {
  #city-section {
    border-top: 2px solid #707070;
  }
}

#top-city,
.top-topic1 {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #707070;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
}
@media screen and (max-width: 768px) {
  #top-city,
.top-topic1 {
    /* grid-column: 1; //with respect to city sub-grid
    grid-row: 1; */
    border-bottom: none;
  }
}

#bottom-left-city,
.bottom-left-top1 {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 2;
  /* .5em right padding here rather than the full 1em 
      (like the bottom-right-section)
      because .5 em grid gap falls on 
      this side*/
  padding-right: 0.5em;
}
@media screen and (max-width: 768px) {
  #bottom-left-city,
.bottom-left-top1 {
    /* grid-column: 1;
    grid-row: 2;*/
  }
}

#city-list,
.top1-list {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#bottom-right-city,
.bottom-right-top1 {
  border-left: 1px solid #707070;
  padding-left: 1em;
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 2;
}
@media screen and (max-width: 768px) {
  #bottom-right-city,
.bottom-right-top1 {
    grid-column: 1;
    grid-row: 3;
    border-left: none;
    padding-left: 0;
    border-top: 0.5px solid #cbcbcb;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

/* END OF STYLE FOR CITY SECTION */
/* START OF STYLE FOR SPORTS SECTION */
.sports-grid,
.top3-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 1.5fr 1fr;
  grid-template-columns: 1fr 1fr;
}
@media screen and (max-width: 768px) {
  .sports-grid,
.top3-grid {
    display: flex;
    flex-direction: column;
    grid-template-rows: repeat(3, 1fr);
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 768px) {
  #sports-section .article-no-picture, #city-section .article-no-picture, #university-section .article-no-picture, #scitech-section .article-no-picture, .top2-list .article-no-picture {
    border-top: 0.5px solid #cbcbcb;
  }
}

#sports-section,
.top3-section {
  color: #1a317c;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  display: flex;
  justify-content: start;
  flex-direction: column;
  grid-column-start: 12;
  grid-column-end: 17;
  grid-row-start: 1;
  grid-row-end: 12;
  padding-left: 0.5vw;
}
@media screen and (max-width: 768px) {
  #sports-section,
.top3-section {
    grid-column: 1;
    grid-row: 4;
    padding: 0;
    min-height: auto;
    padding: 0.5rem;
  }
}

#top-left-sports,
.top-left-top3 {
  grid-column-start: 1;
  grid-row-start: 1;
}

#top-right-sports,
.top-right-top3 {
  grid-column-start: 2;
  grid-row-start: 1;
}
@media screen and (max-width: 768px) {
  #top-right-sports,
.top-right-top3 {
    grid-column: 1;
    grid-row: 2;
    border-top: 0.5px solid #cbcbcb;
    padding-top: 1rem;
  }
}

#bottom-sports,
.bottom-top3 {
  border-top: 1px solid #707070;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 2;
}
@media screen and (max-width: 768px) {
  #bottom-sports,
.bottom-top3 {
    grid-column: 1;
    grid-row: 3;
    border-top: none;
  }
}

#sports-list,
.top3-list {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}

/* END OF STYLE FOR SPORTS SECTION */
/* STYLE FOR GRID 4 */
#a4 {
  padding: 1vh 2.5vw;
  height: auto;
}
@media screen and (max-width: 768px) {
  #a4 {
    height: min-content;
    /* so that footer apears all the way at bottom on mobile */
  }
  #a4 .home-grid-corner {
    padding-bottom: 0;
  }
}

.mag-grid,
.wknd-or-arts-grid,
.top4-or-top5-grid {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 768px) {
  .mag-grid,
.wknd-or-arts-grid,
.top4-or-top5-grid {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, 1fr);
    display: flex;
    flex-direction: column;
    padding-bottom: 1rem;
    border-right: 0;
  }
}

#wknd-grid, #top5-grid {
  justify-content: start;
}

#grid4,
.section-page-grid2 {
  display: grid;
  width: 100%;
  height: auto;
  grid-gap: 0.5rem;
  grid-template-rows: 1fr;
  grid-template-columns: repeat(5, 1fr);
}
@media screen and (max-width: 768px) {
  #grid4,
.section-page-grid2 {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(5, 1fr);
    display: flex;
    flex-direction: column;
  }
}

#mag-section {
  grid-column-start: 1;
  grid-column-end: 2;
  border-right: 2px solid #707070;
  padding: 0 1em 0 0;
}
@media screen and (max-width: 768px) {
  #mag-section {
    grid-column: 1;
    grid-row: 1;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: 25vh;
    padding-right: 0;
    padding-bottom: 1rem;
  }
}
@media screen and (min-width: 769px) {
  #mag-section {
    max-width: 18vw;
  }
}

#mag-section,
#arts-section,
#wknd-section,
.top4-section,
.top5-section {
  display: flex;
  flex-direction: column;
  margin-bottom: 0.1em;
  overflow-wrap: break-word;
  grid-row-start: 1;
}

.top4-section {
  padding-right: 0%;
  border-right: 2px solid #707070;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .top4-section {
    border-right: none;
  }
}

.top5-section {
  padding: 0;
}

#arts-section {
  color: #9f4482;
  padding-right: 0%;
  border-right: 2px solid #707070;
  /*take away extra padding for bottom row*/
  padding: 0;
}
@media screen and (max-width: 768px) {
  #arts-section {
    border-right: none;
  }
}

#wknd-section {
  color: #3593b7;
  /*take away extra padding for bottom row*/
  padding: 0;
}

#mag-section {
  color: #C33C1F;
  padding: 0;
}

.mag-section-head,
.arts-wknd-section-head, .topic-4-5-section-head {
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 768px) {
  .mag-section-head,
.arts-wknd-section-head, .topic-4-5-section-head {
    padding: 0.8rem 0 1rem 0.5rem;
  }
}

#mag-section {
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 1;
  grid-column-end: 2;
}
@media screen and (max-width: 768px) {
  #mag-section {
    grid-column: 1;
    grid-row-start: 1;
    grid-row-end: 2;
  }
}

#arts-section,
.top4-section {
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 2;
  grid-column-end: 4;
}
@media screen and (max-width: 768px) {
  #arts-section,
.top4-section {
    grid-column: 1;
    grid-row-start: 2;
    grid-row-end: 4;
  }
}

#wknd-section,
.top5-section {
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 4;
  grid-column-end: 6;
}
@media screen and (max-width: 768px) {
  #wknd-section,
.top5-section {
    grid-column: 1;
    grid-row-start: 4;
    grid-row-end: 6;
  }
}

#left-arts,
.left-top4 {
  grid-column-start: 1;
  grid-column-end: 2;
}
@media screen and (max-width: 768px) {
  #left-arts,
.left-top4 {
    grid-column: 1;
    grid-row: 1;
  }
}

#right-arts,
.right-top4 {
  grid-column-start: 2;
  grid-column-end: 3;
}
@media screen and (max-width: 768px) {
  #right-arts,
.right-top4 {
    grid-column: 1;
    grid-row: 2;
    border-right: none;
    border-bottom: 2px solid #707070;
    padding-bottom: 1rem;
  }
}

#left-wknd,
.left-top5 {
  padding: 0.5em;
  /*.5em padding bc grid gap is .5em, together 1em of spacing*/
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  grid-column-start: 1;
  grid-column-end: 2;
  border-right: 1px solid #707070;
  min-width: 50%;
}
@media screen and (max-width: 768px) {
  #left-wknd,
.left-top5 {
    grid-column: 1;
    grid-row: 1;
    border-right: none;
    min-width: 0;
  }
}
@media screen and (max-width: 768px) {
  #left-wknd .article-no-picture,
.left-top5 .article-no-picture {
    border-top: 0.5px solid #cbcbcb;
  }
}

#right-wknd,
.right-top5 {
  grid-column-start: 2;
  grid-column-end: 3;
}
@media screen and (max-width: 768px) {
  #right-wknd,
.right-top5 {
    grid-column: 1;
    grid-row: 2;
  }
}

.frame {
  width: 13vw;
  height: 13vw;
  margin: 0;
}

/* GENERAL STYLE FOR ARTICLE WITH IMG ON LEFT */
.left-img-article {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  flex-direction: row;
  padding-left: 0;
  margin-left: 0;
  padding-right: 0%;
}
@media screen and (max-width: 768px) {
  .left-img-article {
    justify-content: start;
  }
}

.left-img-article-textbox {
  padding-left: 6%;
  padding-right: 0%;
  max-width: 94%;
  width: auto;
  height: auto;
}

.top-rect-img-article {
  display: flex;
  flex-direction: column;
  width: 13vw;
  padding-left: 0;
  margin-left: 0;
  max-width: 90%;
}
@media screen and (max-width: 768px) {
  .top-rect-img-article {
    width: 58vw;
  }
}

.top-rect-img-textbox {
  margin: 1vh 0 0 0vw;
  text-align: left;
}
@media screen and (max-width: 768px) {
  .top-rect-img-textbox {
    margin: 0;
    padding-left: 0%;
    padding-right: 0%;
    max-width: 94%;
    width: auto;
    height: auto;
  }
}

#city-section .top-rect-img-textbox {
  padding-left: 6%;
}

.top-rect-img-textbox figcaption {
  font-size: 0.6em;
}

/*#city-img-article > a, .sports-img-article  > a,
.top3-img-article > a  #top1-img-article > a {
    @media screen and (max-width: 768px) {
        display: flex; 
        flex-direction: row;
    }
}*/
@media screen and (max-width: 768px) {
  #top-right-sports figure {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  #top-right-sports .sports-img-article {
    width: 100%;
    margin-right: 0 !important;
    border-bottom: none;
  }
}
#top-right-sports a {
  width: 100%;
}

@media screen and (max-width: 768px) {
  #bottom-right-city #city-img-article {
    width: 100%;
    margin-right: 0 !important;
  }
  #bottom-right-city #city-img-article a {
    flex-direction: row;
    display: flex;
    width: 100%;
  }
}

#city-img-article,
.top1-img-article {
  margin-top: 15%;
}
@media screen and (max-width: 768px) {
  #city-img-article,
.top1-img-article {
    margin: 0%;
    width: 100%;
    max-width: 100%;
  }
}

#city-main-article,
.top1-main-article {
  margin: 2vh 0;
}
@media screen and (max-width: 768px) {
  #city-main-article,
.top1-main-article {
    margin-top: 0;
    margin-bottom: 1rem;
  }
}

#city-main-imgbox,
.top1-main-imgbox {
  width: 18vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  #city-main-imgbox,
.top1-main-imgbox {
    width: 42vw;
  }
}

.city-main-frame,
.top1-main-frame {
  width: 18vw;
  height: 13vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .city-main-frame,
.top1-main-frame {
    width: 42vw;
    height: 28vw;
  }
}

#city-main-textbox {
  padding-left: 8%;
  padding-right: 0%;
}

.sports-frame,
.top3-frame {
  height: 7.8vw;
  width: 13vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .sports-frame,
.top3-frame {
    width: 100%;
    height: 60vw;
  }
}

.sports-imgbox,
.top3-imgbox {
  width: 13vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .sports-imgbox,
.top3-imgbox {
    width: 100%;
  }
}

.sports-img-article,
.top3-img-article {
  width: 13vw;
}
@media screen and (max-width: 768px) {
  .sports-img-article,
.top3-img-article {
    width: 100%;
    max-width: 100%;
  }
}

#city-img-article,
#top1-img-article {
  padding-right: 8%;
  width: 15vw;
}

#second-top4-article {
  margin-right: 0.5em;
}

.mag-img-article,
.wknd-arts-img-article,
.top5-top4-img-article {
  width: 15vw;
  padding-right: 0.5em;
  padding-left: 0.5em;
}
@media screen and (max-width: 768px) {
  .mag-img-article,
.wknd-arts-img-article,
.top5-top4-img-article {
    width: 90vw;
  }
}

.wknd-arts-frame,
.top5-top4-frame {
  height: 9vw;
  width: 15vw;
}
@media screen and (max-width: 768px) {
  .wknd-arts-frame,
.top5-top4-frame {
    width: 90vw;
    height: 50vw;
  }
}

.mag-imgbox,
.wknd-arts-imgbox,
.top5-top4-imgbox {
  width: 15vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .mag-imgbox,
.wknd-arts-imgbox,
.top5-top4-imgbox {
    width: 90vw;
  }
}

.city-frame,
.scitech-frame,
.top1-frame,
.top2-frame {
  height: 9vw;
  width: 15vw;
}
@media screen and (max-width: 768px) {
  .city-frame,
.scitech-frame,
.top1-frame,
.top2-frame {
    width: 42vw;
    height: 28vw;
  }
}

@media screen and (max-width: 768px) {
  .top1-frame, .top1-imgbox {
    width: 90vw !important;
    height: 50vw !important;
  }
}

.scitech-imgbox,
.city-imgbox,
.top1-imgbox,
.top2-imgbox {
  width: 15vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .scitech-imgbox,
.city-imgbox,
.top1-imgbox,
.top2-imgbox {
    width: 42vw;
  }
}

.university-frame {
  width: 14vw;
  height: 14vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .university-frame {
    width: 90vw;
    height: 50vw;
  }
}

.university-imgbox {
  width: 14vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .university-imgbox {
    width: 90vw;
    height: 50vw;
    padding-bottom: 0.5rem;
  }
}

.university-article {
  padding-left: 0;
  width: 14vw;
  margin-left: 0;
  padding-right: 1em;
  max-width: 90%;
}
@media screen and (max-width: 768px) {
  .university-article {
    width: 100%;
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
}
.university-article a {
  width: 100%;
}

.article-author.university-author {
  margin: 8% 0 2% 0;
  font-size: 0.8rem;
}
@media screen and (max-width: 768px) {
  .article-author.university-author {
    margin-top: 0%;
  }
}

.title.university-title {
  margin: 2% 0;
  font-size: 1.1rem;
}

#scitech-list .title,
.top2-list .title {
  font-size: 1em;
}

#scitech-list .article-author,
.top2-list .article-author {
  font-size: 0.8em;
}

@media screen and (max-width: 768px) {
  .article-no-picture {
    padding: 1rem 0;
    border-top: 0.5px solid #cbcbcb;
  }
}

/* END OF GENERAL STYLE FOR ARTICLES WITH IMG ON THE LEFT */
/* MEDIA QUERIES FOR DIFFERENT SECTION TITLES AND COMPONENTS */
@media screen and (max-width: 768px) {
  .title {
    font-size: 1.15rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .section-title, #ytv-title, #editors-picks-title, .category-list-heading, #multimedia-sub-title, #covid-header {
    font-size: 1.9rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .title {
    font-size: 1.9rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .opinion-title {
    font-size: 1.7rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #featured-title {
    font-size: 2.4rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #featured-blurb {
    font-size: 1.5rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .article-author, .opinion-role, #covid-subhead {
    font-size: 1rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #covid-article-list, #covid-student-cases {
    font-size: 1.3rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .covid-section-desc {
    font-size: 1.8rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .category-article-title {
    font-size: 2.4rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .category-article-blurb, #category-description {
    font-size: 1.4rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .category-article-date {
    font-size: 1.1rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #section-page-header {
    font-size: 3rem !important;
  }
}

@media screen and (min-width: 2000px) {
  #read-rest-header {
    font-size: 2.2rem !important;
  }
}

@media screen and (min-width: 2000px) {
  .general-wkndmag-article-title {
    font-size: 2.8rem !important;
    margin-top: 2%;
    margin-bottom: 1%;
  }
}

@media screen and (min-width: 2000px) {
  #photo-main-article-textbox {
    padding-top: 0%;
  }
}

@media screen and (min-width: 2000px) {
  .data-main-articles, .data-sub-article {
    border-top: 0.5px solid #707070;
    padding-top: 3%;
  }
}

/* END OF MEDIA QUERIES */
/* START OF STYLE FOR COMMENCEMENT PAGES (2022+) */
#comm-lower {
  height: max-content;
  padding: 1vh 2.5vw;
}

#comm-lower-grid {
  border-bottom: 2px solid #707070;
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5em;
  grid-template-rows: repeat(14, 1fr);
  grid-template-columns: repeat(16, 1fr);
}
@media screen and (max-width: 768px) {
  #comm-lower-grid {
    border-top: none;
    display: flex;
    flex-direction: column;
  }
}

#comm-sports {
  color: #b40017;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 1;
  grid-row-end: 15;
  border-right: 2px solid #707070;
}
@media screen and (max-width: 768px) {
  #comm-sports {
    grid-column: 1;
    grid-row: 2;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: auto;
  }
}

#comm-sports-grid {
  display: grid;
  width: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 1.2fr 2fr;
  grid-template-columns: 1fr 1.2fr;
}
@media screen and (max-width: 768px) {
  #comm-sports-grid {
    display: flex;
    flex-direction: column;
  }
}

#comm-opinion {
  padding-left: 0.5vw;
  padding-right: 0.5vw;
  color: #0e7037;
  border-right: 2px solid #707070;
  display: flex;
  flex-direction: column;
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 1;
  grid-row-end: 12;
}
@media screen and (max-width: 768px) {
  #comm-opinion {
    grid-column: 1;
    grid-row: 3;
    border-right: none;
    border-bottom: 2px solid #707070;
    min-height: auto;
  }
}

#comm-wknd {
  color: #1a317c;
  font-size: 1.2rem;
  font-family: "BentonSans-Bold", Arial, Helvetica, sans-serif;
  display: flex;
  justify-content: start;
  flex-direction: column;
  grid-column-start: 12;
  grid-column-end: 17;
  grid-row-start: 1;
  grid-row-end: 12;
  padding-left: 0.5vw;
}
@media screen and (max-width: 768px) {
  #comm-wknd {
    grid-column: 1;
    grid-row: 4;
    padding: 0;
    min-height: auto;
    padding: 0.5rem;
  }
}

#comm-sports-title {
  margin-bottom: 3.5rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  #comm-sports-title {
    padding-top: 0.6rem;
  }
}

#comm-opinion-title {
  margin-bottom: 3.5rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  #comm-opinion-title {
    padding-top: 0.6rem;
  }
}

#comm-wknd-title {
  margin-bottom: 3.5rem;
  font-size: 1.2rem;
  text-transform: uppercase;
  font-family: "BentonSans-Bold";
}
@media screen and (max-width: 768px) {
  #comm-wknd-title {
    padding-top: 0.6rem;
  }
}

#comm-opinion-list {
  margin: 0%;
  text-transform: none;
  overflow-y: auto;
  /*get overflow to expand*/
  height: 100%;
  justify-content: space-between;
  display: flex;
  flex-direction: column;
}
#comm-opinion-list article {
  margin-bottom: 1em;
}

.comm-opinion-imgbox {
  width: 12vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .comm-opinion-imgbox {
    width: 42vw;
  }
}

.comm-opinion-frame {
  height: 7vw;
  width: 12vw;
}
@media screen and (max-width: 768px) {
  .comm-opinion-frame {
    width: 42vw;
    height: 28vw;
  }
}

#comm-wknd-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-gap: 0.5rem;
  grid-template-rows: 1.5fr 1fr;
  grid-template-columns: 1fr 1fr;
}
@media screen and (max-width: 768px) {
  #comm-wknd-grid {
    display: flex;
    flex-direction: column;
    grid-template-rows: repeat(3, 1fr);
    grid-template-columns: 1fr;
  }
}

.comm-wknd-imgbox {
  width: 9.5vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .comm-wknd-imgbox {
    width: 100%;
  }
}

.comm-wknd-frame {
  height: 7.8vw;
  width: 9.5vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  .comm-wknd-frame {
    width: 100%;
    height: 60vw;
  }
}

.comm-wknd-img-article {
  width: 9.5vw;
}
@media screen and (max-width: 768px) {
  .comm-wknd-img-article {
    width: 100%;
    max-width: 100%;
  }
}

#comm-sports-top {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #707070;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
}
@media screen and (max-width: 768px) {
  #comm-sports-top {
    /* grid-column: 1; //with respect to city sub-grid
    grid-row: 1; */
    border-bottom: none;
  }
}

#comm-sports-top-article {
  margin: 0 0;
}
@media screen and (max-width: 768px) {
  #comm-sports-top-article {
    margin-top: 0;
    margin-bottom: 1rem;
  }
}

#comm-sports-top-frame {
  width: 14vw;
  height: 9vw;
  margin: 0;
}
@media screen and (max-width: 768px) {
  #comm-sports-top-frame {
    width: 42vw;
    height: 28vw;
  }
}

#comm-sports-top-imgbox {
  width: 14vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  #comm-sports-top-imgbox {
    width: 42vw;
  }
}

#comm-sports-btrt-frame {
  height: 7vw;
  width: 12vw;
}
@media screen and (max-width: 768px) {
  #comm-sports-btrt-frame {
    width: 90vw;
    height: 50vw;
  }
}

#comm-sports-btrt-imgbox {
  width: 12vw;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 768px) {
  #comm-sports-btrt-imgbox {
    width: 90vw;
    height: 50vw;
  }
}

#comm-sports-btrt-article {
  margin-top: 0.5em;
}
@media screen and (max-width: 768px) {
  #comm-sports-btrt-article {
    margin: 0%;
    width: 100%;
    max-width: 100%;
  }
}

/* END OF STYLE FOR COMMENCEMENT PAGES (2022+) */
@media (max-width: 1030px) {
  .is-sticky a {
    padding: 10px !important;
  }
}
@media (max-width: 1280px) {
  nav#site-navigation a {
    font-size: 12px !important;
    padding: 7px !important;
  }
  nav#site-navigation #nav-search {
    font-size: 12px;
    padding-left: 6px !important;
    padding-right: 6px !important;
  }

  #tag-divider, #tag-about, #tag-subscribe, #tag-donate {
    display: none !important;
  }
}
@media (max-width: 1000px) {
  nav#site-navigation a {
    font-size: 12px !important;
    padding: 7px !important;
  }
  nav#site-navigation #nav-search {
    font-size: 12px;
    padding-left: 6px !important;
    padding-right: 6px !important;
  }

  #tag-divider, #tag-about, #tag-subscribe, #tag-donate {
    display: none !important;
  }

  section.category {
    margin: 0 auto;
    margin-top: 0px;
    width: 710px;
  }

  section.front-page {
    margin-top: 40px;
  }

  section.magazine, section.weekend {
    width: 100%;
  }
  section.magazine h2, section.weekend h2 {
    margin-left: 10%;
  }

  .card {
    width: 240px;
  }
  .card.story {
    width: 240px;
  }
  .card.story-major {
    width: 518.5px;
  }
  .card.story-softcore .card-image {
    height: auto;
    width: 300%;
    left: -90%;
  }

  .top-headline-article .story-softcore-cover {
    height: 450px;
  }
  .top-headline-article .story-softcore-cover :not(.card-image) {
    margin-left: 10%;
  }
  .top-headline-article .story-softcore-cover h1 {
    font-size: 2em;
  }
  .top-headline-article .story-softcore-cover .subtitle {
    display: none;
  }

  .section-wrap {
    padding-top: 50px;
  }

  section.front-page {
    margin-top: 25px;
  }
  section.front-page p.category {
    display: block;
  }
}
@media (max-width: 880px) {
  a {
    text-decoration: none;
  }

  #mobile-xc {
    display: inline-block !important;
  }

  #xc-web {
    display: none;
  }

  #mr-web {
    display: none;
  }

  #subscribe {
    display: none;
  }

  .category-jump, .sec-tag {
    margin-bottom: 40px;
  }
  .category-jump:hover, .sec-tag:hover {
    padding: 7px;
  }

  section.opinion, section.university, section.city,
section.sports, section.culture,
section.scitech, section.ytv {
    border-bottom: 1px solid #ddd;
  }
  section.opinion .card, section.university .card, section.city .card,
section.sports .card, section.culture .card,
section.scitech .card, section.ytv .card {
    width: 100%;
  }

  section.kahuna.category {
    margin: 0 auto 0 auto;
    width: 100% !important;
  }

  section.category {
    margin: 30px auto 0 auto;
    width: 90%;
  }
  section.category h2 {
    font-size: 2em;
    text-align: center;
    margin: -50px 0px 25px 0px;
  }

  section.frontpage {
    margin-top: 0;
    margin-bottom: 0 !important;
  }

  section.magazine, section.weekend {
    width: 100%;
  }
  section.magazine h2, section.weekend h2 {
    text-align: left;
  }

  section.magazine .subtitle {
    display: none;
  }

  section.opinion .published-time {
    display: none;
  }
  section.opinion .category {
    line-height: 1.2;
  }

  section.weekend {
    margin-top: 50px;
    margin-bottom: 50px;
  }
  section.weekend > h2 {
    padding-left: 10%;
  }

  section.magazine h2, section.weekend h2 {
    padding-left: 10%;
  }

  .top-headline-article .story-softcore-cover {
    height: 260px !important;
  }
  .top-headline-article .story-softcore-cover :not(.card-image) {
    padding-left: 0;
  }
  .top-headline-article .story-softcore-cover h1 {
    font-size: 1.5em;
    margin-bottom: 15px;
    padding-top: 110px;
    width: 80%;
  }
  .top-headline-article .story-softcore-cover .byline {
    font-size: 0.7em;
  }

  section#weekend, section#magazine {
    padding-bottom: 25px;
  }

  section#opinion {
    margin-top: 50px;
  }

  .section-wrap {
    padding: 5px 0 30px 0;
  }

  footer#site-footer {
    margin-top: 20px;
  }
  footer#site-footer a.copy {
    display: block;
    padding: 0;
  }

  .card {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12);
    width: 100%;
    overflow: hidden;
  }
  .card .byline {
    opacity: 0.7;
  }
  .card:hover {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12);
  }
  .card.story {
    border-width: 2px !important;
    height: auto;
    width: 100%;
    background-color: white;
    padding-bottom: 17.5px;
  }
  .card.story.a1.story-preview {
    padding-bottom: 0px;
  }
  .card.story h1 {
    margin-bottom: 15px;
  }
  .card.story .category {
    display: block;
  }
  .card.story.ytv-latest {
    padding-bottom: 0px;
  }
  .card.story > time {
    position: relative;
    bottom: 0px;
    color: #aaa;
    font-weight: 600;
    font-size: 0.75em;
    letter-spacing: 0.025em;
  }
  .card.story-breaking .breaking {
    top: 0;
    right: 0;
    width: 100%;
    height: 35px;
    padding: 10px;
    position: relative;
    background-color: red;
    text-align: center;
  }
  .card.story-breaking .breaking h3 {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 0.8em;
    color: white;
    display: inline-block;
  }
  .card.story-breaking .breaking h3:after {
    content: " .";
    font-weight: 800;
    color: rgba(255, 255, 255, 0.75);
  }
  .card.story-breaking .breaking time {
    position: relative;
    font-size: 0.8em;
    bottom: auto;
    margin: 0;
    display: inline-block;
  }
  .card.story-softcore {
    width: 100%;
    min-height: 203px;
    background-color: white;
  }
  .card.story-softcore time {
    display: none;
  }
  .card.story-softcore .card-image {
    display: block;
    width: 100%;
    height: auto;
    left: 0;
  }
  .card.story-major {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    background-color: white;
  }
  .card.story-major p.card-preview {
    display: block;
  }
  .card.story-major h1 {
    font-size: 24px;
    font-weight: 600;
  }
  .card.story-major .card-image {
    display: block;
    width: 100%;
    height: 100%;
  }
  .card.story-kahuna {
    width: 100%;
    padding-bottom: 50%;
    background-color: white;
  }
  .card.story-kahuna .card-image {
    display: block;
    width: auto;
    height: 100%;
  }
  .card.story-kahuna h1 {
    margin-left: 0px;
    font-size: 24px;
  }
  .card.story-photo, .card.story-preview, .card.story-mag, .card.story-weekend, .card.story-opinion, .card.story-sports {
    width: 100%;
    background-color: white;
    height: auto;
    overflow: hidden;
  }
  .card.story-photo .card-image, .card.story-preview .card-image, .card.story-mag .card-image, .card.story-weekend .card-image, .card.story-opinion .card-image, .card.story-sports .card-image {
    width: auto;
    right: 0;
    left: auto;
    height: 100%;
  }
  .card.story-photo .card-preview, .card.story-photo .byline, .card.story-preview .card-preview, .card.story-preview .byline, .card.story-mag .card-preview, .card.story-mag .byline, .card.story-weekend .card-preview, .card.story-weekend .byline, .card.story-opinion .card-preview, .card.story-opinion .byline, .card.story-sports .card-preview, .card.story-sports .byline {
    display: block;
  }
  .card.story-preview div.preview-card-left {
    width: 90%;
    height: 100%;
    float: left;
  }
  .card.story-preview time {
    bottom: 0px;
  }
  .card.story-mag .byline, .card.story-weekend .byline, .card.story-sports .byline {
    display: block;
  }
  .card.story-opinion .time {
    display: none !important;
  }
  .card.story-opinion .category {
    display: block;
    position: relative;
    bottom: -5px;
    color: #aaa !important;
  }
  .card.story-photo .card-image, .card.story-mag .card-image, .card.story-weekend .card-image, .card.story-opinion .card-image, .card.story-sports .card-image {
    width: auto;
    right: 0;
    left: auto;
    height: 100%;
  }
  .card.story-photo::after, .card.story-mag::after, .card.story-weekend::after, .card.story-opinion::after, .card.story-sports::after {
    background: -moz-linear-gradient(to right, white 50%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    background: -webkit-linear-gradient(to right, white 50%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    background: -o-linear-gradient(to right, white 50%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    background: -ms-linear-gradient(to right, white 50%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    background: linear-gradient(to right, white 50%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
  }
  .card.story-major.a1 {
    width: 100%;
    height: 240px;
  }
  .card.story-preview.a1 {
    width: 48%;
  }

  .story-softcore-cover {
    margin-top: -125px;
  }
  .story-softcore-cover .card-image {
    top: 0;
    height: auto;
    width: auto;
  }
  .story-softcore-cover .weekend::after {
    background: -moz-linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    background: -webkit-linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    background: -o-linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    background: -ms-linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    background: linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
  }
}
@media (max-width: 860px) {
  nav#site-navigation a {
    font-size: 10px !important;
    padding: 2px !important;
  }

  #nav-search {
    font-size: 12px;
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
}
@media (max-width: 725px) {
  .inside-news {
    display: none;
  }

  .most-read {
    display: none;
  }

  .subscribe {
    display: none;
  }

  .tips {
    display: none;
  }

  .subscribe-link {
    display: none;
  }

  body.home {
    margin-top: 0px;
    overflow-x: hidden;
  }

  section.category {
    margin: 0 auto;
    width: 460px;
    margin-top: 0px;
  }

  section.kahuna {
    width: 100%;
    margin-top: 50px;
    height: 50%;
  }

  section.magazine,
section.weekend {
    width: 100%;
  }

  .card.story {
    width: 100%;
  }
  .card.story-major {
    width: 518.5px;
  }
  .card.story-kahuna {
    width: 100%;
    height: 0;
    padding-bottom: 50%;
  }
  .card.story-kahuna img.card-image {
    width: 100%;
    height: auto;
  }
  .card.story-kahuna h1 {
    font-size: 2.5em;
  }
  .card.story-breaking .breaking {
    top: 0;
    right: 0;
    width: 100%;
    min-height: 35px;
    padding: 10px;
    position: relative;
    background-color: red;
    text-align: center;
  }
  .card.story-breaking .breaking h3 {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 0.8em;
    color: white;
    display: inline-block;
  }
  .card.story-breaking .breaking h3:after {
    content: " .";
    font-weight: 800;
    color: rgba(255, 255, 255, 0.75);
  }
  .card.story-breaking .breaking time {
    position: relative;
    font-size: 0.8em;
    bottom: auto;
    margin: 0;
    display: inline-block;
  }
  .card.story-preview.a1 {
    width: 100%;
  }

  .top-headline-article .story-softcore-cover {
    min-height: 300px;
  }
  .top-headline-article .story-softcore-cover :not(.card-image) {
    margin-left: 10%;
  }
  .top-headline-article .story-softcore-cover h1 {
    font-size: 2em;
  }
  .top-headline-article .story-softcore-cover .subtitle {
    display: none;
  }
  .top-headline-article .story-softcore-cover.magazine {
    height: 300px;
  }

  .section-wrap {
    padding-top: 50px;
  }

  section.magazine,
section.weekend {
    width: 100%;
  }
  section.magazine h2,
section.weekend h2 {
    margin-left: 10%;
  }

  #site-header {
    display: none;
  }

  #mobile-header {
    display: block;
  }

  #mobile-xc {
    display: none !important;
  }

  #xc-web {
    display: none;
  }

  #mr-web {
    display: none;
  }

  #subscribe {
    display: none;
  }
}
@media (min-width: 480px) {
  section.front-page .card.story time {
    bottom: 10px !important;
  }
}
@media (max-width: 480px) {
  a {
    text-decoration: none;
  }

  #mobile-xc {
    display: inline-block !important;
  }

  .inside-news {
    display: none;
  }

  .most-read {
    display: none;
  }

  .subscribe {
    display: none;
  }

  .tips {
    display: none;
  }

  .subscribe-link {
    display: none;
  }

  .category-jump, .sec-tag {
    margin-bottom: 40px;
  }
  .category-jump:hover, .sec-tag:hover {
    padding: 7px;
  }

  section.opinion,
section.university,
section.city,
section.sports,
section.culture,
section.scitech,
section.ytv {
    padding-bottom: 25px;
    padding-top: 25px;
    border-bottom: 1px solid #ddd;
  }

  section.kahuna.category {
    margin: 0 auto 0 auto;
    width: 100% !important;
  }

  section.category {
    margin: 30px auto 0 auto;
    width: 90%;
  }
  section.category h2 {
    font-size: 2em;
    text-align: center;
    margin: -50px 0px 25px 0px;
  }

  section.frontpage {
    margin-top: 0;
    margin-bottom: 0 !important;
  }

  section.magazine,
section.weekend {
    width: 100%;
  }
  section.magazine h2,
section.weekend h2 {
    text-align: left;
  }

  section.magazine .subtitle {
    display: none;
  }

  section.opinion .published-time {
    display: none;
  }
  section.opinion .category {
    line-height: 1.2;
  }

  section.weekend {
    margin-top: 50px;
    margin-bottom: 50px;
  }
  section.weekend > h2 {
    padding-left: 10%;
  }

  section.magazine h2,
section.weekend h2 {
    padding-left: 10%;
  }

  .top-headline-article .story-softcore-cover {
    height: 260px !important;
  }
  .top-headline-article .story-softcore-cover :not(.card-image) {
    padding-left: 0;
  }
  .top-headline-article .story-softcore-cover h1 {
    font-size: 1.5em;
    margin-bottom: 15px;
    padding-top: 110px;
    width: 80%;
  }
  .top-headline-article .story-softcore-cover .byline {
    font-size: 0.7em;
  }

  section#weekend,
section#magazine {
    padding-bottom: 25px;
  }

  section#opinion {
    margin-top: 20px;
  }
  section#opinion .link-wrap {
    display: block;
    width: 100%;
  }

  section .link-wrap {
    display: block;
    width: 100%;
  }

  .section-wrap {
    padding: 5px 0 30px 0;
  }

  footer#site-footer {
    margin-top: 20px;
  }
  footer#site-footer a.copy {
    display: block;
    padding: 0;
  }

  .card {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12);
    margin-bottom: 20px;
    width: 100%;
    overflow: hidden;
  }
  .card .byline {
    opacity: 0.7;
  }
  .card:hover {
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12);
  }
  .card.story {
    border-width: 2px !important;
    height: auto;
    width: 100%;
    background-color: white;
    padding-bottom: 17.5px;
  }
  .card.story h1 {
    margin-bottom: 15px;
  }
  .card.story .category {
    display: none;
  }
  .card.story > time {
    position: relative;
    bottom: 0px;
    color: #aaa;
    font-weight: 600;
    font-size: 0.75em;
    letter-spacing: 0.025em;
  }
  .card.story-breaking .breaking {
    top: 0;
    right: 0;
    width: 100%;
    height: 35px;
    padding: 10px;
    position: relative;
    background-color: red;
    text-align: center;
  }
  .card.story-breaking .breaking h3 {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 0.8em;
    color: white;
    display: inline-block;
  }
  .card.story-breaking .breaking h3:after {
    content: " .";
    font-weight: 800;
    color: rgba(255, 255, 255, 0.75);
  }
  .card.story-breaking .breaking time {
    position: relative;
    font-size: 0.8em;
    bottom: auto;
    margin: 0;
    display: inline-block;
  }
  .card.story-softcore {
    width: 100%;
    min-height: 203px;
    background-color: white;
  }
  .card.story-softcore time {
    display: none;
  }
  .card.story-softcore .card-image {
    display: block;
    width: 100%;
    height: auto;
    left: 0;
  }
  .card.story-major {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    background-color: white;
  }
  .card.story-major p.card-preview {
    display: block;
  }
  .card.story-major h1 {
    font-size: 24px;
    font-weight: 600;
  }
  .card.story-major .card-image {
    display: block;
    width: 100%;
    height: 100%;
  }
  .card.story-kahuna {
    width: 100%;
    padding-bottom: 50%;
    background-color: white;
  }
  .card.story-kahuna .card-image {
    display: block;
    width: auto;
    height: 100%;
  }
  .card.story-kahuna h1 {
    margin-left: 0px;
    font-size: 24px;
  }
  .card.story-photo, .card.story-preview, .card.story-mag, .card.story-weekend, .card.story-opinion, .card.story-sports {
    width: 100%;
    background-color: white;
    height: auto;
    padding-bottom: 20px;
    overflow: hidden;
  }
  .card.story-photo .card-image, .card.story-preview .card-image, .card.story-mag .card-image, .card.story-weekend .card-image, .card.story-opinion .card-image, .card.story-sports .card-image {
    width: auto;
    height: 100%;
  }
  .card.story-photo .card-preview,
.card.story-photo .byline, .card.story-preview .card-preview,
.card.story-preview .byline, .card.story-mag .card-preview,
.card.story-mag .byline, .card.story-weekend .card-preview,
.card.story-weekend .byline, .card.story-opinion .card-preview,
.card.story-opinion .byline, .card.story-sports .card-preview,
.card.story-sports .byline {
    display: block;
  }
  .card.story-preview div.preview-card-left {
    width: 90%;
    height: 100%;
    float: left;
  }
  .card.story-preview time {
    bottom: 0px;
  }
  .card.story-mag .byline, .card.story-weekend .byline {
    display: inline;
  }
  .card.story-opinion .time {
    display: none !important;
  }
  .card.story-opinion .category {
    display: block;
    position: relative;
    color: #aaa !important;
  }
  .card.story-photo::after, .card.story-mag::after, .card.story-weekend::after, .card.story-opinion::after, .card.story-sports::after {
    background: -moz-linear-gradient(to right, white 60%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    background: -webkit-linear-gradient(to right, white 60%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    background: -o-linear-gradient(to right, white 60%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    background: -ms-linear-gradient(to right, white 60%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    background: linear-gradient(to right, white 60%, rgba(255, 255, 255, 0.5) 100%), no-repeat;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
  }

  .story-softcore-cover {
    margin-top: -125px;
  }
  .story-softcore-cover .card-image {
    top: 0;
    height: auto;
    width: auto;
  }
  .story-softcore-cover .weekend::after {
    background: -moz-linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    background: -webkit-linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    background: -o-linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    background: -ms-linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    background: linear-gradient(to bottom, rgba(25, 25, 25, 0.5) 0%, rgba(25, 25, 25, 0.5) 100%), no-repeat;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
  }
}
form input {
  background-color: #f6f4f4;
  padding: 5px;
  margin: 10px auto 10px auto;
  border: none;
  font-family: Avenir;
  font-style: italic;
  font-size: 0.9em;
}

.University .category {
  color: #1a6075;
}
.University .category-jump, .University .sec-tag {
  background-color: #1a6075;
  color: white;
}

.Opinion .category {
  color: #df9100;
}
.Opinion .category-jump, .Opinion .sec-tag {
  background-color: #df9100;
  color: white;
}

.City .category {
  color: #8e0012;
}
.City .category-jump, .City .sec-tag {
  background-color: #8e0012;
  color: white;
}

.Sci-Tech .category {
  color: #145141;
}
.Sci-Tech .category-jump, .Sci-Tech .sec-tag {
  background-color: #145141;
  color: white;
}

.Sports .category {
  color: #1a317c;
}
.Sports .category-jump, .Sports .sec-tag {
  background-color: #1a317c;
  color: white;
}

.Weekend .category {
  color: #3593b7;
}
.Weekend .category-jump, .Weekend .sec-tag {
  background-color: #3593b7;
  color: white;
}

.Arts .category {
  color: #9f4482;
}
.Arts .category-jump, .Arts .sec-tag {
  background-color: #9f4482;
  color: white;
}

.Multimedia .category {
  color: #781788;
}
.Multimedia .category-jump, .Multimedia .sec-tag {
  background-color: #781788;
  color: white;
}

.Magazine .category {
  color: #C33C1F;
}
.Magazine .category-jump, .Magazine .sec-tag {
  background-color: #C33C1F;
  color: white;
}

.University-color {
  color: #1a6075 !important;
}

.Opinion-color {
  color: #df9100 !important;
}

.City-color {
  color: #8e0012 !important;
}

.Sci-Tech-color {
  color: #145141 !important;
}

.Sports-color {
  color: #1a317c !important;
}

.Weekend-color {
  color: #3593b7 !important;
}

.Arts-color {
  color: #9f4482 !important;
}

.Multimedia-color {
  color: #781788 !important;
}

.Magazine-color {
  color: #C33C1F !important;
}

.banner-ads {
  width: 960px;
  margin-top: 18.5px;
  margin-bottom: 18.5px;
}
@media (max-width: 1000px) {
  .banner-ads {
    width: 728px;
  }
}
@media (max-width: 726px) {
  .banner-ads {
    width: 217px;
    height: 90px;
  }
}

.banner-big {
  width: 728px;
  height: 90px;
  margin-right: 8px;
  background: #f7f4f4;
  display: inline-block;
}
@media (max-width: 1000px) {
  .banner-big {
    display: block;
    margin: 0 auto;
  }
}
@media (max-width: 728px) {
  .banner-big {
    display: none !important;
  }
}
@media (max-width: 480px) {
  .banner-big {
    display: none;
  }
}

.banner-small {
  width: 217px;
  height: 90px;
  background: #f7f4f4;
  display: inline-block;
}
@media (max-width: 1000px) {
  .banner-small {
    display: none;
  }
}
@media (max-width: 726px) {
  .banner-small {
    display: block;
    margin: 60px auto 5px auto;
  }
}
@media (max-width: 480px) {
  .banner-small {
    display: block;
    margin: 0px auto;
    margin-bottom: 40px;
  }
}

.top-ad {
  margin: 0 auto;
}
@media (max-width: 480px) {
  .top-ad .banner-small {
    display: block;
    margin: 70px auto;
    margin-bottom: 25px;
  }
}

.article-sidebar {
  height: 100%;
  width: 300px;
  position: absolute;
  top: 150px;
  transform: translate(670px);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.article-sidebar .container {
  margin-bottom: 40px;
}

@media (max-width: 1000px) {
  .article-sidebar {
    display: none;
  }
}
.skyscraper {
  height: 600px;
  width: 160px;
  position: absolute;
  top: 150px;
  transform: translate(825px);
}
@media (max-width: 1000px) {
  .skyscraper {
    display: none;
  }
}

.most-read-title {
  margin-top: 5px;
  align-self: center;
  border-bottom: 2px solid #808080;
  width: 90%;
  padding-bottom: 5px;
  margin-bottom: 15px;
  text-align: center;
  line-height: 1.2;
  font-size: 0.9em;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  font-family: "BentonSans-Regular", sans-serif;
  font-weight: normal;
  color: #707070;
}

.most-read-container {
  border: 1px solid #b0b0b0;
  padding: 15px;
  padding-bottom: 20px;
}

.error-msg {
  text-align: center;
}
.error-msg h1 {
  margin-top: 4.5rem;
  margin-bottom: 3rem !important;
  display: block;
  font-size: 11rem;
  font-family: "BentonSans-Bold", "Helvetica-Neue", "Arial", "Helvetica", sans-serif;
  color: grey;
}
.error-msg h2 {
  font-size: 2.6rem;
  line-height: 3.4rem;
  font-family: "BentonSans-Bold", "Georgia", serif;
  font-weight: 500;
  width: 50%;
  letter-spacing: 0;
  margin: auto auto;
}
@media (max-width: 1024px) {
  .error-msg h1 {
    margin-bottom: 0.5rem !important;
  }
  .error-msg h2 {
    width: 85%;
  }
}
@media (max-width: 480px) {
  .error-msg {
    margin-top: 50px;
  }
  .error-msg h1 {
    font-size: 8rem;
  }
  .error-msg h2 {
    font-size: 1.9rem;
    line-height: 2.5rem;
  }
}

.search-title {
  margin-top: 50px !important;
  text-align: left !important;
  font-size: 2.5em;
  letter-spacing: 0.01em;
}

.gsc-input {
  padding-left: 12px;
}

.gsc-search-button {
  padding-right: 12px;
  padding-top: 6px;
}

.pagination {
  clear: both;
  padding: 20px 0;
  position: relative;
  font-size: 11px;
  line-height: 13px;
  text-align: center;
}
.pagination a {
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  border-width: 5px !important;
}
.pagination .current {
  padding: 6px 9px 5px 9px;
  background: #ddd;
  color: #fff;
}

.pagination span,
.pagination a {
  display: inline-block;
  margin: 2px 2px 2px 0;
  padding: 6px 9px 5px 9px;
  text-decoration: none;
  width: auto;
  color: #696565;
  background: #ffffff;
}

html,
body {
  height: 100%;
}

.sticky-footer-wrapper {
  opacity: 0;
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto;
  position: relative;
  background-color: #f6f4f4;
}

/** {
  margin: 0;
}*/
.bottom-foot-wrap {
  padding-top: 20px;
}

#disqus_thread {
  margin-top: 50px;
}

.photo-card {
  width: auto;
}

.notice1 {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding-top: 18.5px;
  padding-bottom: 18.5px;
  margin-bottom: 0px;
  max-width: 100%;
  height: auto;
  width: auto\9 ;
}

.notice2 {
  height: auto;
  display: block;
  width: auto\9 ;
  max-width: 100%;
  position: absolute;
  top: 150px;
  right: 60px;
}

@media (max-width: 1000px) {
  .notice2 {
    display: none;
  }
}
.wp-block-quote {
  margin: 28px 0;
}

iframe.spotx_surrogate_iframe {
  position: static;
}

.recruitment-banner {
  width: 100%;
  background-color: #083665;
  color: white;
  margin-top: 0;
  top: -10px;
  padding: 15px;
  text-align: center;
}

.recruitment-banner-link {
  color: white;
  width: 100%;
  letter-spacing: initial;
}

#comm-mobile-header {
  height: 20px;
  background-color: white;
  padding: 25px 0px 10px 10px;
  display: none;
  position: fixed;
  z-index: 6;
  width: 100%;
  top: 0;
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15), 0 -5px 3px -10px #fff;
}
@media (max-width: 725px) {
  #comm-mobile-header {
    display: block;
  }
}
#comm-mobile-header img {
  height: 35px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: -18px;
}
#comm-mobile-header #mobile-xc {
  /*@extend %face-sans;*/
  text-decoration: none;
  height: 30px;
  width: 30px;
  margin-top: -28px;
  margin-right: 12.5px;
  display: inline-block;
  vertical-align: bottom;
  float: right;
  text-align: center;
  font-size: 22px;
  font-style: italic;
  font-weight: 800;
  letter-spacing: 0;
  color: #191919;
}
#comm-mobile-header .menu-link {
  position: absolute;
  color: #191919;
  margin-top: -7px;
  margin-left: 10px;
  text-decoration: none;
  cursor: pointer;
}

.fy2022_navigation_label_selected {
  font-weight: bolder;
  color: black;
}

.fy2022_featured_container_top {
  height: max-content;
  padding: 1vh 2.5vw;
}

/*# sourceMappingURL=style.css.map */