@import "variables.css";
/* Fixes program box at top or research student page **/
select[multiple], select[size] {
    height: auto;
    max-height: 100px;
}
@media (max-width: 768px){
  select[multiple], select[size] {
      height: auto;
      max-height: 60px;
    }
}
.form-item{
  padding: 5px;
}

/*Blog Biobox from drupal 7*/
.biobox {
	width:35%;
	background:#F2F2F3;
	padding:1.6em 1.6em 1.8em;
	margin: 0 0 1em 1em;
	float:right;
	clear:right;
}
.biobox h3 {
	border-top:1px solid #DDD2BF;
	margin: .1em 0;
  padding: .8em 0 .2em;
}
.biobox h4 {
	font-family: "Uni sans", Arial, Helvetica, sans-serif;
  color: #917b4c;
  text-transform: none;
  font-weight: 500;
  font-size: 1.4em;
  line-height: 1.1em;
  margin: 0 0 .5em;
}
.biobox h5 {
	color:#000;
	font-weight: 700;
  text-transform: uppercase;
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  margin: .7em 0 0;
}
.biobox p {
	margin:.2em 0;
	line-height: 1.3em;
}
.biobox p.biobox-quote {
	font-family:"Uni sans", Arial, Helvetica, sans-serif;
	color:#917b4c;
	font-style:italic;
	text-align:center;
	border-top:1px solid #DDD2BF;
	margin: 1.6em 0 0;
  padding: 1.6em 0 .4em;
	font-size:1.1em;
}
.biobox p.biobox-attribution {
	font-family:"Uni sans", Arial, Helvetica, sans-serif;
	color:#917b4c;
	text-transform:uppercase;
	text-align:center;
	font-size:1.1em;
}
@media (max-width: 768px) {
.biobox {
		width:100%;
		margin: 0 0 2em 1em;
	}
}

/** Blog pullquote from drupal 7**/
p.hsm-pullquote-1 {
	font-family: 'Uni Sans','Open Sans',sans serif;
    font-size: 1.4em;
    color: #917b4c;
    width: 75%;
    line-height: 1.5em;
    margin: 1.5em 0 .5em 1.5em;
}
p.hsm-pullquote-1-name {
	font-family:'Uni Sans','Open Sans',sans serif;
	font-size: 1em;
	color:var(--gold);
	text-transform:uppercase;
	margin: 0 0 1.5em 2em;
}
/*Style nav*/
/*Fix ugly dropshadow around nav*/
#navbar {
  box-shadow: none;
  border-radius: 0px;
}
/* #block-mainmenu-4*/ .sf-style-none,
.multi-site .sf-style-none {
  float: left;
  margin: 7px 0px 0px 0px;
  padding: 0;
}
/* #block-mainmenu-4*/ .sf-style-none.sf-navbar,
.multi-site .sf-style-none.sf-navbar {
  width: 100%;
}

/* #block-mainmenu-4*/ .sf-depth-1 a.menuparent::after,
.multi-site .sf-depth-1 a.menuparent::after {
  content: "\2002\276F\00A0\002f";
  left: 0;
  line-height: 1;
  position: inline;
  text-indent: 0;
  top: 0;
  color: var(--purple);
}
/* #block-mainmenu-4*/ .sf-depth-1.sf-no-children a::after,
.multi-site .sf-depth-1.sf-no-children a::after {
  content: "\00A0\002f";
  left: 0;
  line-height: 1;
  position: inline;
  text-indent: 0;
  top: 0;
  color: var(--purple);
}

/* #block-mainmenu-4 */ .sf-depth-2 a.menuparent::after,
.multi-site .sf-depth-2 a.menuparent::after {
  content: "\2002\276F";
  left: 0;
  line-height: 1;
  position: inline;
  text-indent: 0;
  top: 0;
  color: var(--purple);
}
ul.sf-menu a:hover,
li.sf-menu a:hover {
  color: var(--purple) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 7px;
}
ul.sf-menu.sf-style-default li,
ul.sf-menu.sf-style-default.sf-navbar {
    background-color: #ffffff;
}
ul.sf-menu.sf-style-default a:hover{
  background-color: #ffffff;
  color: var(--purple) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 7px;
}
ul.sf-menu a{
  color: var(--purple) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 7px;
}
li.sf-depth-2 a{
  background-color: #ffffff;
  color: var(--purple) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 20px;
}
li.sf-depth-3 a{
  background-color: #ffffff;
  color: var(--purple) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 28px;
}
.integrated-site li.sf-depth-2 a{
  background-color: var(--ltgrey);
  color: var(--purple) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 20px;
}
.integrated-site li.sf-depth-3 a{
  background-color: var(--ltgrey);
  color: var(--purple) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 28px;
}
#main-menu-link-contentde7f607e-7fdd-41eb-94cf-ad7485527866 a{
  background-color: #ffffff;
  color: var(--gold) !important;
  font-family: "Encode Sans Compressed";
  font-weight: 900;
  text-transform: uppercase;
  float:right;
  padding-left: 20px;
}
#main-menu-link-contentde7f607e-7fdd-41eb-94cf-ad7485527866 a::after{
  content: "\2002\276F\00A0\002f";
  left: 0;
  line-height: 1;
  position: inline;
  text-indent: 0;
  top: 0;
  color: var(--gold);
}
div#block-searchform, .block-views-exposed-filter-blocksearch-content-page-1 {
  margin-top: 40px;
  position:absolute;
  z-index: 1;
}

#block-searchform .input-group:hover .form-control {
  padding: 0px 10px;
}

@media only screen and (max-width: 992px){
  div#block-searchform, .block-views-exposed-filter-blocksearch-content-page-1 {
    margin-top: -60px;
    position:absolute;
    z-index: 1;
  }
}
.block-superfish {
  padding-left: 5px;
}
@media only screen and (min-width: 1200px){
.block-superfish {
  padding-left: 40px;
}
}
/* Mobile Menu */
@media only screen and (max-width: 992px){
  .region-sidebar-second{
    margin-top: 20px;
  }
}
@media only screen and (min-width: 768px){
  #main-menu-link-content392f84f2-59b1-48f0-ad9a-f8d82f7caaea {
    display: none;
  }
}
a#superfish-main-toggle,
a#superfish-pnash-main-toggle,
a#superfish-pehsu-main-toggle,
a#superfish-cohr-main-toggle,
a#superfish-srp-main-toggle,
a#superfish-edge-main-toggle,
a#superfish-nwcohs-main-toggle,
a#superfish-oem-menu-main-toggle {
  background-color: #ffffff;
  color: var(--purple) !important;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  font-size: 18px;
  padding: 0px 0px 0px 10px;
}
a#superfish-main-toggle:hover,
a#superfish-pnash-main-toggle:hover,
a#superfish-pehsu-main-toggle:hover,
a#superfish-cohr-main-toggle:hover,
a#superfish-srp-main-toggle:hover,
a#superfish-edge-main-toggle:hover,
a#superfish-nwcohs-main-toggle:hover,
a#superfish-oem-menu-main-toggle:hover {
  background-color: var(--ltgrey);
  color: var(--purple) !important;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  font-size: 18px;
  padding: 0px 0px 0px 10px;
}

a#superfish-main-toggle::after,
a#superfish-pnash-main-toggle::after,
a#superfish-pehsu-main-toggle::after,
a#superfish-cohr-main-toggle::after,
a#superfish-srp-main-toggle::after,
a#superfish-edge-main-toggle::after,
a#superfish-nwcohs-main-toggle::after,
a#superfish-oem-menu-main-toggle::after {
  content: "\2002\276F" !important;
  font-size: 18px;
}

/*------Integrated site menus----*/
/*Fix ugly dropshadow around nav*/
body.integrated-site #navbar {
 border: 0px 0px 0px 0px;
 box-shadow: none;
}
body.integrated-site div.highlight{
 background-color: var(--purple);
}
/*Style main nav integrated site*/

body.integrated-site header#navbar{
  background-color: var(--ltgrey);
  border-radius: 0px;
}
body.integrated-site #block-mainmenu-4 .sf-style-none {
  float: left;
  margin: 7px 0px 0px 100px;
  padding: 0;
}
@media only screen and (max-width: 768px){
body.integrated-site #block-mainmenu-4 .sf-style-none {
  float: left;
  margin: 7px 0px 0px 15px;
  padding: 0;
}
}
body.integrated-site #block-mainmenu-4 .sf-style-none.sf-navbar {
  width: 100%;
}

body.integrated-site #block-mainmenu-4 .sf-depth-1 a.menuparent::after{
  content: "\2002\276F\00A0\002f";
  left: 0;
  line-height: 1;
  position: inline;
  text-indent: 0;
  top: 0;
  color: var(--dkgrey);
}

body.integrated-site #block-mainmenu-4 .sf-depth-2 a.menuparent::after{
  content: "\2002\276F";
  left: 0;
  line-height: 1;
  position: inline;
  text-indent: 0;
  top: 0;
  color: var(--dkgrey);
}
body.integrated-site #block-mainmenu-4 ul.sf-menu a:hover{
  background-color: var(--ltgrey);
  color: var(--dkgrey) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 7px;
}
body.integrated-site #block-mainmenu-4 ul.sf-menu a{
  background-color: var(--ltgrey);
  color: var(--dkgrey) !important;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  padding: 14px 8px 14px 7px;
}
body.integrated-site #block-mainmenu-4 #main-menu-link-contentde7f607e-7fdd-41eb-94cf-ad7485527866 a{
  background-color: var(--ltgrey);
  color: var(--dkgrey) !important;
  font-family: "Encode Sans Compressed";
  font-weight: 900;
  text-transform: uppercase;
  float:right;
  padding-left: 20px;
}
body.integrated-site  #block-mainmenu-4 #main-menu-link-contentde7f607e-7fdd-41eb-94cf-ad7485527866 a::after{
  content: "\2002\276F\00A0\002f";
  left: 0;
  line-height: 1;
  position: inline;
  text-indent: 0;
  top: 0;
  color: var(--dkgrey);
}
body.integrated-site #block-mainmenu-4 div#block-searchform, .block-views-exposed-filter-blocksearch-content-page-1 {
  margin-top: 40px;
  position:absolute;
  z-index: 1;
}
@media only screen and (max-width: 992px){
.navbar {
    position: relative;
    min-height: 20px;
    padding-bottom: 10px;
    border: 1px solid transparent;
    margin-bottom: 0px;
}
}

.integrated-site a#superfish-main-toggle{
  color: var(--dkgrey) ;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  font-size: 18px;
  padding: 0px 0px 0px 10px;
  background-color: var(--ltgrey);
}

.integrated-site a#superfish-main-toggle:hover{
  background-color: var(--ltgrey);
  color:  var(--dkgrey);
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  font-size: 18px;
  padding: 0px 0px 0px 10px;
}

.integrated-site a#superfish-main-toggle::after{
  content: "\2002\276F" !important;
  font-size: 18px;
}
.integrated-site a#superfish-main-toggle::before{
  content: "DEOHS "
}

/** Add OEM ? **/
a#superfish-menu-eohml-navigation-toggle,
a#superfish-menu-occepi-sub-site-menu-toggle,
a#superfish-menu-ptc-navgation-toggle,
a#superfish-menu-field-group-navigation-toggle,
a#superfish-menu-nwcohs-nav-toggle,
a#superfish-menu-mesa-air-navigation-toggle,
a#superfish-menu-eh-lab-navigation-toggle,
a#superfish-menu-pehsu-sub-site-menu-toggle {
  color: var(--purple) ;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;
  font-size: 18px;
  padding: 0px 0px 0px 10px;
}
a#superfish-menu-eohml-navigation-toggle::after,
a#superfish-menu-occepi-sub-site-menu-toggle::after,
a#superfish-menu-ptc-navgation-toggle::after,
a#superfish-menu-field-group-navigation-toggle::after,
a#superfish-menu-nwcohs-nav-toggle::after,
a#superfish-menu-mesa-air-navigation-toggle::after,
a#superfish-menu-eh-lab-navigation-toggle::after,
a#superfish-menu-pehsu-sub-site-menu-toggle::after {
  content: "\2002\276F" !important;
  font-size: 18px;
}
/*---end integrated sites menu styles---*/
/* Styles for the SPH link in the header */
section#block-sphlink,
section#block-deohslink,
section#block-deohslinkppl {
  float:right;
  margin-right: -15px;
}
.sphheader{
  float: right;
  margin-top: -5px;
  position: relative;
}
.sphheader a{
  color: #ffffff;
  position: absolute;
  left: 15px;
  top: 25%;
  text-align: left;
  font-family: 'Uni Sans Normal','Open Sans',sans serif;
  text-transform: uppercase;
  font-size: 14px;
  line-height: 1.42857;
  font-weight: 700;
}
.sphheader img{
  width: 300px;
  height: 30px;

}
@media (max-width: 992px) {
  .sphheader{
    display:none;
  }
}
/** full width images above content **/
div.highlighted{
  position: relative;
}
h1.page-header,
h1.profile-name {
  margin-top: -170px;
  position: absolute;
  left: 17px;
  color: #ffffff;
  font-size: 40px;
  text-shadow: 1px 2px 4px rgb(0 0 0 / .6);
}
body.long-title h1.page-header,
body.long-title h1.profile-name {
  margin-top: -195px;
}
.integrated-site h1.page-header{
  margin-top: 0px;
  position: relative;
  left: 0px;
  color: var(--purple);
  font-size: 40px;
}
@media (max-width: 992px) {
  h1.page-header{
    margin-top: -170px;
    position: absolute;
    left: 17px;
    color: #ffffff;
    font-size: 30px;
  }
  .integrated-site h1.page-header{
    margin-top: 0px;
    position: relative;
    left: 0px;
    color: var(--purple);
    font-size: 30px;
  }
}

body.path-frontpage.frcg h1.page-header,
body.path-frontpage.nwcohs h1.page-header,
body.path-frontpage.pehsu h1.page-header
{
  display:block;
}
body.path-frontpage.deohs-front h1.page-header{
  display: none;
}
.integrated-site div.highlight.container-fluid {
  background-color: #ffffff;
}


/* Default fallback for page title background */
div.title-image{
  background-image: url(/sites/default/files/2020-10/cherry-blossoms-7.jpg);
  background-size: cover;
  background-position: 80%;
}
/* Reset background-position to initial default value (add/remove classes here as needed) */
.about div.title-image, .undergrad div.title-image, .grad div.title-image, .research div.title-image, .faculty div.title-image, .faculty1 div.title-image, .faculty2 div.title-image, .sresearch div.title-image, .service div.title-image, .xia div.title-image, .frcg div.title-image, .pehsu div.title-image, .ehlab div.title-image, .ptc div.title-image, .mesa div.title-image, .nwcohs div.title-image, .occepi div.title-image, .alumni-employers div.title-image, .alumni div.title-image, .employers div.title-image, .news div.title-image, .air div.title-image, .water div.title-image, .food div.title-image, .workplaces div.title-image, .communities div.title-image, .kenya div.title-image, .landscape div.title-image, .fields div.title-image, .blueberry div.title-image, .blue-cherry div.title-image, .nets div.title-image, .flower div.title-image, .water-ripple div.title-image, .samples div.title-image, .trees div.title-image, .greenery div.title-image, .measure div.title-image, .whiteboard div.title-image, .sample div.title-image, .droplet div.title-image, .tech div.title-image, .corona div.title-image, .teris div.title-image, .fish-banner div.title-image {
  background-position: unset;
}
/* Set individual page title background images and any overrides */
.about div.title-image{
  background-image: url(/sites/default/files/images/ranier.jpg);
}
.prospective div.title-image{
  background-image: url(/sites/default/files/2020-11/prospective-students-7.jpg);
  background-position: 65%;
}
.undergrad div.title-image{
  background-image: url(/sites/default/files/images/_MG_2691_Undergrad.jpg);
}
.grad div.title-image{
  background-image: url(/sites/default/files/images/_MG_2691_Undergrad.jpg);
}
.research div.title-image{
  background-image: url(/sites/default/files/images/Burke_Whale-2179_StudentResearch.jpg);
}
.faculty div.title-image{
  background-image: url(/sites/default/files/images/_MG_0257_FacultyDirectory.jpg);
}
.faculty1 div.title-image{
  background-image: url(/sites/default/files/images/FallCampus_25.png);
}
.faculty2 div.title-image{
  background-image: url(/sites/default/files/images/img_0961.png);
}
.sresearch div.title-image{
  background-image: url(/sites/default/files/images/Burke_Whale-2179_StudentResearch.jpg);
}
.service div.title-image{
  background-image: url(/sites/default/files/woman-3187087_1920-bp.jpg);
}
.xia div.title-image{
  background-image: url(/sites/default/files/woman-3187087_1920-bp.jpg);
}
.frcg div.title-image{
  background-image: url(/sites/default/files/images/_WM_6908_FRCG.jpg);
}
.pehsu div.title-image{
  background-image: url(/sites/default/files/images/_MG_0218_PEHSU.jpg);
}
.ehlab div.title-image{
  background-image: url(/sites/default/files/images/_MG_0286_EHLab.jpg);
}
.ptc div.title-image{
  background-image: url(/sites/default/files/images/NW_Outdoor-1021-PTC.jpg);
}
.mesa div.title-image{
  background-image: url(/sites/default/files/images/20266874044_dd270b33ec_o-MESA.jpg);
}
.nwcohs div.title-image{
  background-image: url(/sites/default/files/images/IMG_3581-4K-NWCOHS.jpg);
}
.occepi div.title-image{
  background-image: url(/sites/default/files/images/enrico-mantegazza-709349-unsplash.jpg);
}
.alumni-employers div.title-image{
  background-image: url(/sites/default/files/images/american-public-power-association-423204-unsplash-alumni-employers.jpg);
}
.alumni div.title-image{
  background-image: url(/sites/default/files/images/abigail-lynn-472194-unsplash-alumni.jpg);
}
.employers div.title-image{
  background-image: url(/sites/default/files/images/_WM_7031-employers.jpg);
}
.news div.title-image{
  background-image: url(/sites/default/files/roman-kraft-260082-unsplash-reading.jpg);
}
.air div.title-image{
  background-image: url(/sites/default/files/images/patrick-hendry-431197-unsplash-air2.jpg);
}
.water div.title-image{
  background-image: url(/sites/default/files/images/anastasia-taioglou-214774-unsplash-water2.jpg);
}
.food div.title-image{
  background-image: url(/sites/default/files/images/NatureDetails_5-news-events.jpg);
}
.workplaces div.title-image{
  background-image: url(/sites/default/files/images/todd-quackenbush-701-unsplash-work2.jpg);
}
.communities div.title-image{
  background-image: url(/sites/default/files/images/rawpixel-792222-unsplash.jpg);
}
.hsmblog div.title-image{
  background-image: url(/sites/default/files/images/drone_cherry.jpg);
  background-position: center;
}
.kenya div.title-image{
  background-image: url(/sites/default/files/images/kenya.jpg);
}
.landscape div.title-image{
  background-image: url("/sites/default/files/images/20170601_Friday Harbor Labs_0739.jpg");
}
.fields div.title-image{
  background-image: url("/sites/default/files/images/20170711_BURKE T REX_04042.jpg");
}
.blueberry div.title-image{
  background-image: url(/sites/default/files/images/blueberries-markus-spiske-752466-unsplash.jpg);
}
.blue-cherry div.title-image{
  background-image: url(/sites/default/files/images/CherryBlossoms_MG_9643.jpg);
}
.nets div.title-image{
  background-image: url(/sites/default/files/images/fishing-net-557250.jpg);
}
.flower div.title-image{
  background-image: url(/sites/default/files/images/Flower32017-1181.jpg);
}
.water-ripple div.title-image{
  background-image: url(/sites/default/files/images/lake-2063957.jpg);
}
.samples div.title-image{
  background-image: url(/sites/default/files/images/mcb2-1432.jpg);
}
.trees div.title-image{
  background-image: url(/sites/default/files/images/Mount_Rainier-1337.jpg);
}
.greenery div.title-image{
  background-image: url(/sites/default/files/images/NatureDetails_6.jpg);
}
.measure div.title-image{
  background-image: url(/sites/default/files/images/numbers_WM_7101.jpg);
}
.whiteboard div.title-image{
  background-image: url(/sites/default/files/images/PathobiologyLab44.jpg);
}
.sample div.title-image{
  background-image: url(/sites/default/files/images/PathobiologyLab43.jpg);
}
.droplet div.title-image{
  background-image: url(/sites/default/files/images/splashing-275950.jpg);
}
.tech div.title-image{
  background-image: url(/sites/default/files/images/Wearable_sensor_1077.jpg);
}
.corona div.title-image{
  background-image: url(/sites/default/files/images/covid19-banner%20-%20Sarah%20Fish.png);
}
.teris div.title-image{
  background-image: url(/sites/default/files/Suzzallo3.jpg);
}
.fish-banner div.title-image{
  background-image: url(/sites/default/files/images/FishBanner.png);
}
.cohr-farm-infection-training div.title-image{
  background-image: url(/sites/default/files/2020-12/cohr-farm-infection-training-banner.jpg);
}
.ceer div.title-image{
  background-image: url(/sites/default/files/images/Mount_Rainier-1337.jpg);
}
/* Default fallback for gray tint overlay */
div.title-image img{
  height: 250px;
  max-width: inherit;
  opacity: .1;
  width: 100%;
}
/* Reset opacity to full (add/remove classes here as needed) */
.about div.title-image img, .undergrad div.title-image img, .grad div.title-image img, .research div.title-image img, .faculty div.title-image img, .faculty1 div.title-image img, .faculty2 div.title-image img, .sresearch div.title-image img, .service div.title-image img, .xia div.title-image img, .frcg div.title-image img, .pehsu div.title-image img, .ehlab div.title-image img, .ptc div.title-image img, .mesa div.title-image img, .nwcohs div.title-image img, .occepi div.title-image img, .alumni-employers div.title-image img, .alumni div.title-image img, .employers div.title-image img, .news div.title-image img, .air div.title-image img, .water div.title-image img, .food div.title-image img, .workplaces div.title-image img, .communities div.title-image img, .kenya div.title-image img, .landscape div.title-image img, .fields div.title-image img, .blueberry div.title-image img, .blue-cherry div.title-image img, .nets div.title-image img, .flower div.title-image img, .water-ripple div.title-image img, .samples div.title-image img, .trees div.title-image img, .greenery div.title-image img, .measure div.title-image img, .whiteboard div.title-image img, .sample div.title-image img, .droplet div.title-image img, .tech div.title-image img, .corona div.title-image img, .teris div.title-image img, .fish-banner div.title-image img {
  opacity: 1;
}
/* Set individual page title background overlays and any overrides */
.hsmblog div.title-image img{
  opacity: .1;
  background: linear-gradient(0deg, black, transparent);
}
.prospective div.title-image img{
  opacity: 0;
}
.cohr-farm-infection-training div.title-image img{
  opacity: .5;
}
.psps div.title-image{
  background-image: url(/sites/default/files/images/uwfarm_sarah_fish.jpg);
  background-size: cover;
}

/*Cards - Front page*/
#block-views-block-cards-block-1 div.view-header{
 text-align: center;
}
#block-views-block-cards-block-1 div.view-footer{
 text-align: center;
}
#block-views-block-cards-block-1 h4{
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
#block-views-block-cards-block-1 p{
    padding-left: 15px;
    padding-right: 15px;
}
#block-views-block-cards-block-1 a.link {
    padding-left: 10px;
    padding-right: 15px;
}

#block-views-block-cards-block-1 div.view-content{
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
  }

#block-views-block-cards-block-1 div.view-header > h2:nth-child(1){
  padding-top: 55px;
}

  @media only screen and (min-width: 1080px){
      #block-views-block-cards-block-1 div.row-4{
          display:none;
      }
      #block-views-block-cards-block-1 [class*='row-']{
          margin: .5%;
          max-width: 32%;
          min-width: 350px;
          background-color: #ffffff;
          padding-bottom: 10px;
        }
  }
  @media only screen and (max-width: 1080px){
    #block-views-block-cards-block-1 div.view-content{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: stretch;
        flex-wrap: wrap;
      }
    #block-views-block-cards-block-1 div.row-4{
          display:block;
      }
    #block-views-block-cards-block-1 [class*='row-']{
          margin: .5%;
          max-width: 45%;
          background-color: #ffffff;
          padding-bottom: 10px;
          padding-bottom: 10px;
        }
  }
  @media only screen and (max-width: 768px){
    #block-views-block-cards-block-1 div.row-4{
          display:none;
  }
  #block-views-block-cards-block-1 [class*='row-']{
      margin: 2%;
      max-width: 480px;
      background-color: #ffffff;
      padding-bottom: 10px;
    }
  }
  /** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up #block-views-block-cards-block-1 img{
  width: 346px;
  height: 194px;
}
@media screen\0 {
  #block-views-block-cards-block-1 img{
    width: 346px;
    height: 194px;
  }
}
@media screen\9{
  #block-views-block-cards-block-1 img{
    width: 346px;
    height: 194px;
  }
}
/* frontpage cards */
section#block-views-block-cards-block-1{
  margin-top:20px;
  max-width: 1200px;
  margin:auto;
  margin-bottom: 40px;
}
@media only screen and (min-width: 1200px) {
  section#block-views-block-cards-block-1{
    padding-top:60px;
    max-width: 1200px;
    margin:auto;
    margin-bottom: 40px;
    }
}

 /** Cards Alumni Profiles **/

.view-alumni-profiles div.view-header{
 text-align: center;
}
.view-alumni-profiles div.view-footer{
 text-align: center;
}
.view-alumni-profiles h4{
  /* padding-left: 15px;
  padding-right: 15px; */
  color: var(--purple);
}
/*
.view-alumni-profiles p{
    padding-left: 15px;
    padding-right: 15px;
}*/

.view-alumni-profiles a.smbtn{
    padding: 15px;
}

.view-alumni-profiles div.view-content{
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
  }

.view-alumni-profiles div.views-row {
  margin: 5px 5px 5px 5px;
  max-width: 364px;
  background-color: var(--ltgrey);
  }

.view-alumni-profiles span.Student.Profile{
  display: none;
}

/** this makes ie struggle less - can't we all agree not to use it anymore?!? **/

_:-ms-lang(x), .ie10up .view-alumni-profiles img{
  width: 346px;
  height: 194px;
}
@media screen\0 {
  .view-alumni-profiles img{
    width: 346px;
    height: 194px;
  }
}
@media screen\9{
  .view-alumni-profiles img{
    width: 346px;
    height: 194px;
  }
}
/*Cards - Research pages*/
#block-views-block-cards-block-2 div.view-header{
 text-align: left;
}
#block-views-block-cards-block-2 div.view-footer{
 text-align: left;
}
#block-views-block-cards-block-2 h4{
  padding-left: 15px;
  /* padding-right: 15px; */
  color: var(--purple);
}

#block-views-block-cards-block-2 p{
    padding-left: 15px;
    padding-right: 15px;
}
#block-views-block-cards-block-2 a.link{
    padding-left: 10px;
    padding-right: 15px;
}

#block-views-block-cards-block-2 div.view-content{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
/* #block-views-block-cards-block-2 div.row-4{
    display:none;
  } */

#block-views-block-cards-block-2 [class*='row-']{
  margin: .5%;
  max-width: 32%;
  min-width: 250px;
  background-color: var(--ltgrey);
  padding-bottom: 10px;
}
@media only screen and (min-width: 1097px){
    #block-views-block-cards-block-2 div.row-4{
        display:none;
    }
}
@media only screen and (max-width: 1097px){
    #block-views-block-cards-block-2 div.row-4{
        display:block;
    }
}
@media only screen and (max-width: 971px){
    #block-views-block-cards-block-2 div.row-4{
        display:none;
}
}
@media only screen and (max-width: 992px) {
  #block-views-block-cards-block-2 div.view-content{
      display: flex;
      flex-direction: row;
      justify-content: center;
      flex-wrap: wrap;
    }
}
@media only screen and (max-width: 768px) {
  #block-views-block-cards-block-2 [class*='row-']{
    margin: .5%;
    max-width: 480px;
    min-width: 250px;
    background-color: var(--ltgrey);
    padding-bottom: 10px;
  }
}

  /** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up #block-views-block-cards-block-2 img{
  width: 346px;
  height: 194px;
}
@media screen\0 {
  #block-views-block-cards-block-2 img{
    width: 346px;
    height: 194px;
  }
}
@media screen\9 {
  #block-views-block-cards-block-2 img{
    width: 346px;
    height: 194px;
  }
}

/*Cards - blog home*/
#block-views-block-cards-block-3 div.view-header{
 text-align: center;
}
#block-views-block-cards-block-3 div.view-footer{
 text-align: left;
}
#block-views-block-cards-block-3 h4{
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
#block-views-block-cards-block-3 p{
    padding-left: 15px;
    padding-right: 15px;
}
#block-views-block-cards-block-3 a.link{
    padding-left: 10px;
    padding-right: 15px;
}

#block-views-block-cards-block-3 div.view-content{
    display: flex;
    flex-direction: row;
    justify-content: left;
    flex-wrap: wrap;
  }

#block-views-block-cards-block-3 [class*='row-']{
    margin: 10px 10px 10px 0px;
    min-width: 200px;
    background-color: var(--ltgrey);
    padding-bottom: 10px;
  }
  @media only screen and (max-width: 768px){
    #block-views-block-cards-block-3 [class*='row-']{
      margin-top: 10px;
      max-width: 80%;
      background-color: var(--ltgrey);
      padding-bottom: 10px;
      }
    }

  @media only screen and (max-width: 992px){
      #block-views-block-cards-block-3 div.view-content{
          display: flex;
          flex-direction: row;
          justify-content: center;
          flex-wrap: wrap;
        }
  }


  /** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up #block-views-block-cards-block-3 img {
  width: 230px;
  height: 131px;
}
@media screen\0 {
  #block-views-block-cards-block-3 img {
    width: 230px;
    height: 131px;
  }
}
@media screen\9 {
  #block-views-block-cards-block-3 img {
    width: 230px;
    height: 131px;
  }
}

/*Cards - individual blog pages*/
#block-views-block-cards-block-4 div.view-header{
 text-align: left;
}
#block-views-block-cards-block-4 div.view-footer{
 text-align: left;
 padding: 7px;
}

#block-views-block-cards-block-4 h4{
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
#block-views-block-cards-block-4 p{
    padding-left: 15px;
    padding-right: 15px;
}
#block-views-block-cards-block-4 a.link{
    padding-left: 10px;
    padding-right: 15px;
    padding-bottom: 15px;
}

#block-views-block-cards-block-4 div.view-content{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

#block-views-block-cards-block-4 [class*='row-']{
    max-width: 255px;
    min-width: 200px;
    margin: 5px;
    background-color: #ffffff;
    padding-bottom: 10px;
  }
@media only screen and (max-width: 992px){
    #block-views-block-cards-block-4 div.view-header{
     text-align: center;
    }
    #block-views-block-cards-block-4 div.view-footer{
     text-align: center;
     padding: 7px;
    }
    #block-views-block-cards-block-4 div.view-content{
        display: flex;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
      }
      #block-views-block-cards-block-4 [class*='row-']{
          max-width: 255px;
          min-width: 200px;
          margin: 5px;
          background-color: #ffffff;
          padding-bottom: 10px;
        }

}
@media only screen and (max-width: 768px) {
  #block-views-block-cards-block-4 [class*='row-']{
      max-width: 80%;
      min-width: 200px;
      margin: 5px;
      background-color: #ffffff;
      padding-bottom: 10px;
    }
}

.hsmblog div.content_bottom.container-fluid{
    background-color: var(--ltgrey);
    margin-top: 40px;
}

.hsmblog img,
.hsmblog figure,
.news img,
.news figure,
figure  {
  display: table;
}

.hsmblog img figcaption,
.hsmblog figure figcaption,
.news img figcaption,
.news figure figcaption{
  display:table-caption;
  caption-side:bottom;
}

.hsmblog footer.footer{
    margin-top: 0px;
}
/** Student research cards LIVE**/

div.view-filters.form-group{
  margin: 30px 0px;
}
[id^='block-views-block-student-research-block'] div.view-header{
 text-align: left;
}
[id^='block-views-block-student-research-block'] div.view-footer{
 text-align: left;
 padding: 7px;
}
section[id*='student-research'] .h6,
div[class*='student_research'] .h6{
  padding-left: 7px;
  padding-right: 5px;
  color: var(--purple);
  margin-top: 0;
  margin-bottom: 3px;
}
section[id*='student-research'] a,
div[class*='student_research'] a {
  color: var(--purple);
}
section[id*='student-research'] div.views-row a.link,
div[class*='student_research'] div.views-row a.link{
  color: var(--purple);
  margin-left: 10px;
}
section[id*='student-research'] div.views-row a:hover,
div[class*='student_research'] div.views-row a:hover{
  color: var(--purple);
  text-decoration: underline;
  transition-delay: .25s;
}
section[id*='student-research'] p,
div[class*='student_research'] p {
    padding-left: 7px;
    padding-right: 5px;
    margin:3px;
}
section[id*='student-research'] .smbtn,
div[class*='student_research'] .smbtn {
    margin:10px;
}

section[id*='student-research'] div.view-content,
div[class*='student_research'] div.view-content
{
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
}
body.sr-base section[id*='student-research'] div.views-row,
body.sr-base div[class*='student_research'] div.views-row {
    margin: 5px;
    max-width: 370px;
    background-color: var(--ltgrey);
    padding-bottom: 5px
  }
section[id*='block-views-block-student-research-indv'] div.views-row{
    max-width: 1200px;
}
body.sr-base section[id*='student-research'] div.views-row:hover,
body.sr-base div[class*='student_research'] div.views-row:focus,
body.sr-base section[id*='student-research'] div.views-row:hover,
body.sr-base div[class*='student_research'] div.views-row:focus{
  margin-top: -2px;
  box-shadow: 3px 3px 2px #d9d9d9;
  transition-delay: .25s;
}
/** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up #block-views-block-student-research-block-3 img{
  width: 255px;
  height: 143px;
}
@media screen\0 {
  #block-views-block-student-research-block-3 img{
    width: 255px !important;
    height: 143px !important;
  }
}

@media screen\9 {
  #block-views-block-student-research-block-3 img{
    width: 255px !important;
    height: 143px !important;
  }
}

/** Student research cards LIVE- conversion 7/1/2019**/

div.view-filters.form-group{
  margin: 30px 0px;
}

#block-views-block-student-research-cards-3 div.view-header{
 text-align: left;
}
#block-views-block-student-research-cards-3 div.view-footer{
 text-align: left;
 padding: 7px;
}
#block-views-block-student-research-cards-3 .h6{
  padding-left: 7px;
  padding-right: 5px;
  color: var(--purple);
  margin-top: 0;
  margin-bottom: 3px;
}
#block-views-block-student-research-cards-3 div.views-row a{
  color: var(--purple);
}
#block-views-block-student-research-cards-3 div.views-row a.link{
  color: var(--purple);
  margin-left: 10px;
}
#block-views-block-student-research-cards-3 div.views-row a:hover{
  color: var(--purple);
  text-decoration: underline;
  transition-delay: .25s;
}
#block-views-block-student-research-cards-3 p{
    padding-left: 7px;
    padding-right: 5px;
    margin:3px;
}
#block-views-block-student-research-cards-3 .smbtn{
    margin:10px;
}

#block-views-block-student-research-cards-3 div.view-content{
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
  }

#block-views-block-student-research-cards-3 div.views-row{
    margin: 5px;
    max-width: 370px;
    background-color: var(--ltgrey);
    padding-bottom: 5px
  }
#block-views-block-student-research-cards-3 div.views-row:hover,
#block-views-block-student-research-cards-3 div.views-row:focus {
  margin-top: -2px;
  box-shadow: 3px 3px 2px #d9d9d9;
  transition-delay: .25s;
}
/** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up #block-views-block-student-research-cards-3 img{
  width: 255px;
  height: 143px;
}
@media screen\0 {
  #block-views-block-student-research-cards-3 img{
    width: 255px !important;
    height: 143px !important;
  }
}

@media screen\9 {
  #block-views-block-student-research-cards-3 img{
    width: 255px !important;
    height: 143px !important;
  }
}

/** PNASH Research cards LIVE**/

div.view-filters.form-group{
  margin: 30px 0px;
}

#block-views-block-research-block-1 div.view-header{
 text-align: left;
}
#block-views-block-research-block-1 div.view-footer{
 text-align: left;
 padding: 7px;
}
#block-views-block-research-block-1 h6{
  padding-left: 7px;
  padding-right: 5px;
  color: var(--purple);
  margin-top: 7px;
  margin-bottom: 3px;
}
#block-views-block-research-block-1 div.views-row a{
  color: var(--purple);
}
#block-views-block-research-block-1 div.views-row a:hover{
  color: var(--purple);
  text-decoration: underline;
  transition-delay: .25s;
}
#block-views-block-research-block-1 p{
    padding-left: 7px;
    padding-right: 5px;
    margin:3px;
}
#block-views-block-research-block-1 .smbtn{
    margin:8px;
}


#block-views-block-research-block-1 div.view-content{
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
  }

#block-views-block-research-block-1 div.views-row{
    margin: 5px;
    max-width: 370px;
    background-color: var(--ltgrey);
    padding-bottom: 5px
  }
#block-views-block-research-block-1 div.views-row:hover,
#block-views-block-research-block-1 div.views-row:focus {
  margin-top: -2px;
  box-shadow: 3px 3px 2px #d9d9d9;
  transition-delay: .25s;
}
/** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up #block-views-block-research-block-1 img{
  width: 255px;
  height: 143px;
}
@media screen\0 {
  #block-views-block-research-block-1 img{
    width: 255px !important;
    height: 143px !important;
  }
}

@media screen\9 {
  #block-views-block-research-block-1 img{
    width: 255px !important;
    height: 143px !important;
  }
}
/*Cards - Generic Cards - 2 across*/
div.flex {
    display: flex;
    flex-direction: row;
    justify-content: left;
    flex-wrap: wrap;
  }
div.card-2 .h4, div.card-2 h4{
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
div.card-2 h3{
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
div.card-2 p, div.card-2 > div{
    padding-left: 15px;
    padding-right: 15px;
}
div.card-2 a.smbtn{
    padding-right: 15px;
    font-size: 15px;
}
div.card-2{
    margin: .5%;
    max-width: 49%;
    background-color: var(--ltgrey);
    padding-bottom: 10px;
  }
@media only screen and (max-width: 480px) {
  div.card-2{
      margin: .5%;
      max-width: 99%;
      background-color: var(--ltgrey);
      padding-bottom: 10px;
    }

}
/** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up div.card-2 img{
  width: 552px;
  height: 194px;
}
@media screen\0 {
  div.card-2 img{
    width: 552px;
    height: 194px;
  }
}
@media screen\9{
  div.card-2 img{
    width: 552px;
    height: 194px;
  }
}

/*Cards - Generic Cards - 3 across*/

div.card-3 h4{
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
div.card-3 p{
    padding-left: 15px;
    padding-right: 15px;
}
div.card-3 a.smbtn{
  padding: 0px 15px;
  font-size: 15px;
}
div.card-3{
  margin: .5%;
  max-width: 32%;
  min-width: 250px;
  background-color: var(--ltgrey);
  padding-bottom: 10px;
  }
.contact  div.card-3{
    margin: 5px 10px 5px 10px;
    width: 260px;
    background-color: var(--ltgrey);
    padding-bottom: 10px;
    }
/** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up div.card-3 img{
  width: 346px;
  height: 194px;
}
@media screen\0 {
  div.card-3 img{
    width: 346px;
    height: 194px;
  }
}
@media screen\9{
  div.card-3 img{
    width: 346px;
    height: 194px;
  }
}
/*Cards - Generic Cards - 4 across*/
div.card-4 h4{
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
div.card-4 p{
    padding-left: 15px;
    padding-right: 15px;

}
div.card-4 a.smbtn{
  padding-left: 15px;
  font-size: 15px;
}
div.card-4{
  margin: 5px 10px 5px 10px;
  max-width: 255px;
  background-color: var(--ltgrey);
  padding-bottom: 10px;
  }

  /*Cards - Generic Cards - 6 across*/
div.card-6 h4{
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
div.card-6 p{
	padding: 0px;
}
div.card-6 a.smbtn{
  padding-left: 0px;
  font-size: 15px;
}

div.card-6 img{
	max-height: 133px;
}

/** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up div.card-4 img{
  width: 255px;
  height: 194px;
}
@media screen\0 {
  div.card-4 img{
    width: 255px;
    height: 194px;
  }
}
@media screen\9{
  div.card-4 img{
    width: 255px;
    height: 194px;
  }
}
/*Cards - Generic Cards - 5 across*/
div.card-5{
  margin: .5%;
  max-width: 19%;
  background-color: var(--ltgrey);
  padding: 10px 5px 5px 5px;
  text-align: center;
  }
div.card-5 img {
  max-height:100px;
  max-width:100px;
  margin:5px;
}
@media only screen and (max-width: 480px) {
  div.card-5{
    margin: .5%;
    max-width: 48%;
    }
}
/** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up div.card-4 img{
  width: 255px;
  height: 194px;
}
@media screen\0 {
  div.card-4 img{
    width: 255px;
    height: 194px;
  }
}
@media screen\9{
  div.card-4 img{
    width: 255px;
    height: 194px;
  }
}

/** NWCOHS under blog cards **/
.nwcohs-erc div.region-content-bottom section[id*='card'] div.view-content div.views-row {
background-color: #ffffff;
}
/**Styling faculty directory + alumni profiles**//* */
.faculty-directory div.view-faculty-page div.views-row {
  min-height: 220px;
}

.faculty-directory .faculty-image {
 display: inline-block;
 float:left;
 margin-right: 20px;
 height: 200px;
}

.faculty-directory div.views-field.views-field-view-node{
    padding-top: 10px;
}
.faculty-directory h3{
    margin-top: 0px;
    margin-bottom: 5px;
}
/** Multi-site generics **/
section[id*='card'] div.view-content,
body.card div.view-content,
div[class*="view-display-id-card"] > div.view-content {
  display: flex;
  flex-direction: row;
  justify-content: left;
  flex-wrap: wrap;
}
section[id*='card'] div.views-row,
body.card div.views-row,
div.card-6,
div[class*="view-display-id-card"] div.views-row {
  margin: .5%;
  max-width: 32%;
  min-width: 250px;
  background-color: var(--ltgrey);
  padding-bottom: 10px;
}
body.edge.path-frontpage section[id*='card'] div.views-row{
  background-color: white;
}
body.card div.views-row p,
body.card div.views-row h4,
body.card div.views-row a.smbtn,
body.card div.views-row a.link,
section[id*='card'] div.views-row p,
section[id*='card'] div.views-row h4,
section[id*='card'] div.views-row a.smbtn,
section[id*='card'] div.views-row a.link,
div[class*="view-display-id-card"] div.views-row p,
div[class*="view-display-id-card"] div.views-row h4,
div[class*="view-display-id-card"] div.views-row a.smbtn,
div[class*="view-display-id-card"] div.views-row a.link {
  padding: 0px 10px;
}

section[id*='card'] div.views-row:hover,
section[id*='card'] div.views-row:focus,
body.card div.views-row:hover,
body.card div.views-row:focus,
div[class*="view-display-id-card"] div.views-row:hover,
div[class*="view-display-id-card"] div.views-row:focus {
  margin-top: -2px !important;
  box-shadow: 3px 3px 2px #d9d9d9;
  transition-delay: .25s;
}
body.card .smbtn a{
  color:var(--purple);
}

/*** Added 2024-05-01 for cards **/
body.card .link {
  margin: 10px 0px;
  }

body.card .link:hover{
  color: var(--purple);
  text-decoration: underline;
}
body.card .link::after{
  content: "\2002\276F";
}

@media only screen and (min-width: 1080px){
  section[id*='card'] [class*='row-'],
  body.card [class*='row-'],
  div[class*="view-display-id-card"] [class*='row-'] {
        margin: .5%;
        max-width: 32%;
        min-width: 350px;
        background-color: #ffffff;
        padding-bottom: 10px;
      }
}
@media only screen and (max-width: 1080px){
  section[id*='card'] div.view-content,
  body.card div.view-content,
  div[class*="view-display-id-card"] div.views-content {
      display: flex;
      flex-direction: row;
      justify-content: left;
      align-items: stretch;
      flex-wrap: wrap;
    }
  section[id*='card'] [class*='row-'],
  body.card [class*='row-'],
  div[class*="view-display-id-card"] [class*='row-'] {
        margin: .5%;
        max-width: 45%;
        background-color: #ffffff;
        padding-bottom: 10px;
        padding-bottom: 10px;
      }
}
@media only screen and (max-width: 768px){
  section[id*='card'] [class*='row-'],
  body.card [class*='row-'],
  div[class*="view-display-id-card"] [class*='row-']{
    margin: 2%;
    max-width: 480px;
    background-color: #ffffff;
    padding-bottom: 10px;
  }
}
/** Individual profiles on profile pages **/

#block-views-block-profile-page-cards-block-1 div.view-header,
#views_block__profile_page_cards_block_1 div.view-header{
 text-align: center;
}
#block-views-block-profile-page-cards-block-1 div.view-footer,
#views_block__profile_page_cards_block_1 div.view-footer{
 text-align: center;
}
#block-views-block-profile-page-cards-block-1 h4,
#views_block__profile_page_cards_block_1 h4 {
  padding-left: 15px;
  padding-right: 15px;
  color: var(--purple);
}
#block-views-block-profile-page-cards-block-1 p,
#views_block__profile_page_cards_block_1 p{
    padding-left: 15px;
    padding-right: 15px;
}
#block-views-block-profile-page-cards-block-1 a.link,
#views_block__profile_page_cards_block_1 a.link {
    padding-left: 10px;
    padding-right: 15px;
}

#block-views-block-profile-page-cards-block-1 div.view-content,
#views_block__profile_page_cards_block_1 div.view-content{
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
  }


  @media only screen and (min-width: 1080px){
      #block-views-block-profile-page-cards-block-1 [class*='row-'],
      #views_block__profile_page_cards_block_1 [class*='row-']{
          margin: .5%;
          max-width: 32%;
          min-width: 350px;
          background-color: var(--ltgrey);
          padding-bottom: 10px;
        }
  }
  @media only screen and (max-width: 1080px){
    #block-views-block-profile-page-cards-block-1 div.view-content,
    #views_block__profile_page_cards_block_1 div.view-content{
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: stretch;
        flex-wrap: wrap;
      }
    #block-views-block-profile-page-cards-block-1 [class*='row-'],
    #views_block__profile_page_cards_block_1 [class*='row-']{
          margin: .5%;
          max-width: 45%;
          background-color: var(--ltgrey);
          padding-bottom: 10px;
          padding-bottom: 10px;
        }
  }
  @media only screen and (max-width: 768px){
  #block-views-block-profile-page-cards-block-1 [class*='row-'],
  #views_block__profile_page_cards_block_1 [class*='row-']{
      margin: 2%;
      max-width: 480px;
      background-color: var(--ltgrey);
      padding-bottom: 10px;
    }
  }
  /** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up #block-views-block-profile-page-cards-block-1 img,
_:-ms-lang(x), .ie10up #views_block__profile_page_cards_block_1 img {
  width: 346px;
  height: 194px;
}
@media screen\0 {
  #block-views-block-profile-page-cards-block-1img,
  #views_block__profile_page_cards_block_1 {
    width: 346px;
    height: 194px;
  }
}
@media screen\9{
  #block-views-block-profile-page-cards-block-1 img,
  #views_block__profile_page_cards_block_1 img{
    width: 346px;
    height: 194px;
  }
}
/* Faculty Directory Home Page - 2019 */
section[id*='block-views-block-faculty-landing-page-2019-card-block'] div.views-row a.smbtn {
	padding-left: 0;
}

section[id*='block-views-block-faculty-landing-page-2019-card-block'] .img-responsive {
	float: left;
	padding-right: 10px;
}
section[id*='block-views-block-faculty-landing-page-2019-card-block'] div.views-row {
  margin: .5%;
  min-width: 49%;
  background-color: var(--ltgrey);
  padding-bottom: 0px;
}
form[id*='views-exposed-form-faculty-landing-page-2019-block'] > div {
  padding: 0px 10px;
}


@media only screen and (max-width: 768px) {
  section[id*='block-views-block-faculty-landing-page-2019-card-block'] div.views-row a.smbtn {
    font-size: .8em;
    padding: 0px;
  }
  section[id*='block-views-block-faculty-landing-page-2019-card-block'] div.views-row {
      margin: .5%;
      margin-bottom: 20px;
      min-width: 99%;
      background-color: var(--ltgrey);

    }
  section[id*='block-views-block-faculty-landing-page-2019-card-block'] .img-responsive {
  	width: 150px;
  }
  form[id*='views-exposed-form-faculty-landing-page-2019-block'] > div {
    text-align: center;
  }

}
/***---------------Student Guide-------------------***/
.guide section[id*='student-research'] div.view-content,
body.card div.view-content {
  display: flex;
  flex-direction: row;
  justify-content: left;
  flex-wrap: wrap;
}
.guide section[id*='student-research'] div.views-row,
body.card div.views-row{
  margin: .5%;
  max-width: 24%;
  min-width: 250px;
  background-color: var(--ltgrey);
  padding-bottom: 10px;
}
.guide section[id*='student-research'] div.views-row:hover,
.guide section[id*='student-research'] div.views-row:focus {
  margin-top: -2px !important;
  box-shadow: 3px 3px 2px #d9d9d9;
  transition-delay: .25s;
}

@media only screen and (min-width: 1080px){
.guide section[id*='student-research'] [class*='row-'],
  body.card [class*='row-']{
        margin: .5%;
        max-width: 24%;
        min-width: 250px;
        background-color: #ffffff;
        padding-bottom: 10px;
      }
}
@media only screen and (max-width: 1080px){
.guide section[id*='student-research'] div.view-content,
  body.card div.view-content{
      display: flex;
      flex-direction: row;
      justify-content: left;
      align-items: stretch;
      flex-wrap: wrap;
    }
.guide section[id*='student-research'] [class*='row-'],
  body.card [class*='row-']{
        margin: .5%;
        max-width: 45%;
        background-color: #ffffff;
        padding-bottom: 10px;
        padding-bottom: 10px;
      }
}
@media only screen and (max-width: 768px){
.guide section[id*='student-research'] [class*='row-'],
  body.card [class*='row-']{
    margin: 2%;
    max-width: 480px;
    background-color: #ffffff;
    padding-bottom: 10px;
  }
}
/** this makes ie struggle less - can't we all agree not to use it anymore?!?**/
_:-ms-lang(x), .ie10up .guide section[id*='student-research'] div img{
  width: 255px;
  height: 194px;
}
@media screen\0 {
  .guide section[id*='student-research'] div img{
    width: 255px;
    height: 194px;
  }
}
@media screen\9{
  .guide section[id*='student-research'] div img{
    width: 255px;
    height: 194px;
  }
}
div.view-guides-faculty div.views-row a{
  padding:0px;
  margin:0px;
}

/***---------------Undergraduate Career Pathways tabs-------------------***/
#career-pathways-tabs {
  width: 1150px;
  max-width: 93vw;
}
#career-pathways-tabs .nav-tabs {
    border-bottom: solid 3px var(--purple);
    margin: 0px 5px;
}
#career-pathways-tabs .nav-tabs li {
    margin: 5px 15px 0px 0px;
    float: left;
    list-style: none;
}
#career-pathways-tabs .tab-content {
  margin-top: 1rem;
}
#career-pathways-tabs .tab-content h4 {
  margin-bottom: 1rem;
}
#career-pathways-tabs .tab-content ul li {
  padding: .125rem 0;
}
#career-pathways-tabs .tab-content .col-sm-6 > .card-2 {
  margin: unset;
  max-width: 100%;
}
#career-pathways-tabs .tab-content .col-sm-6 > .card-2 h4 {
  margin-bottom: 7px;
}

/* Blog styles*/
section#block-views-block-deohs-blog-block-3 div.date{
  color: #000;
  margin-top: -43px;
  font-weight: bold;
  background: var(--gold);
  width: fit-content;
  padding: .5rem .75rem;
}
section#block-views-block-deohs-blog-block-3 div.hero{
  margin-top: 50px;
}
section#block-views-block-deohs-blog-block-3 div.hero img{
  width:100% !important;
  height: auto;
}

section#block-views-block-deohs-blog-block-3 iframe{
  margin-top: 100PX;
  width:100% !important;
  margin-bottom: 30px;
}

section#block-views-block-deohs-blog-block-3 div.terms{
  font-weight: bold;
  text-transform: uppercase;
  font-size: small;
}

section#block-views-block-deohs-blog-block-3 div.byline{
  font-style: italic;
  margin-top: 10px;
  margin-bottom: 20px;
}
/***---------------Blog tags and byline-------------------***/
section#block-views-block-deohs-blog-block-4 .views-row br:first-child, section#block-views-block-deohs-blog-block-4 .views-row br:nth-child(2) {
  display: none;
}
section#block-views-block-deohs-blog-block-4 .terms {
  visibility: hidden;
}
section#block-views-block-deohs-blog-block-4 .terms a {
  visibility: visible;
  display: inline-block;
  margin: 5px 0px;
  padding: 6px 10px;
  background: var(--ltgrey);
  color: var(--purple);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  font-size: 80%;
  font-weight: bold;
  text-decoration: none;
  border-left: 3px;
  border-left-style: solid;
  border-left-color: var(--ltgrey);
  transition: all .2s ease-in-out;
}
section#block-views-block-deohs-blog-block-4 .terms a:hover {
  background: #fff;
  border-left-color: var(--purple);
}
section#block-views-block-deohs-blog-block-4 .byline {
  margin-top: 2rem;
  margin-bottom: 4rem;
  padding-top: 1rem;
  border-top: 2px solid var(--ltgrey);
}

div.col-sm-12{
  z-index: 1;
}
/* Hero / subtitle page styles*/
div.field--name-field-hero,
div.field--name-field-hero-image,
div.field--name-field-field-hero,
div.field--name-field-field-hero-image{
  margin-top: 20px;
}

div.field--name-field-hero img,
div.field--name-field-hero-image img{
  width:100% !important;
  height: auto;
}

div.field--name-field-subtitle,
div.field--name-field-field-subtitle{
      max-width: 90%;
      min-width: 400px;
      margin-top: -25px;
      background-color: #ffffff;
      padding: 10px 10px 10px 0px;
      opacity: .99;
}
div.field--name-field-subtitle p,
div.field--name-field-field-subtitle p{
  font-family:uni sans;
  font-size:21px;
  color:var(--gold);
  padding: 0px 15px 0px 0px;
}


@media only screen and (min-width: 992px){
  body > div > div > div > section > div > article > div.content > div.field--name-body{
    margin-top: 10px;
  }
}
@media only screen and (max-width: 992px){
  body > div > div > div > section > div > article > div.content > div.field--name-body{
    margin-top: 0px;
  }
  div.field--name-field-subtitle,
  div.field--name-field-field-subtitle{
    width: 100%;
    min-width: 0px;
    margin-top: 0px;
    background-color: rgba(255, 0, 0, 0);
    padding: 30px 0px 20px 0px;
    z-index: -1;
    position: relative;
  }
}
@media only screen and (max-width: 480px) {
  section#block-views-block-deohs-blog-block-3 div.date{
    color: #000000;
    font-weight: bold;
    margin-top: 0px;
  }
  section#block-views-block-deohs-blog-block-3 div.hero{
    margin-top: 20PX;
  }

}
/* Section page styles*/
.hero{
  width:100% !important;
  height: auto;
}

@media only screen and (max-width: 480px){
  div.hero{
    margin-top: 20PX;
  }

}
  div.research-body{
    margin-top: 40px;
  }

  /**** Main site blog styles ****/
  .underphoto {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .subtitle {
    background-color: white;
    padding: 10px 10px 10px 0px;
  }
  div.subtitle p{
    font-family:uni sans;
    font-size: 22px;
    color:var(--gold);
    padding: 0px 15px 0px 0px;
  }
.herocaption {
  padding: 5px;
}

.herocaption p {
  font-style: italic;
    font-size: .8em;
    color: var(--dkgrey);
    text-align: right;
}

@media only screen and (min-width: 768px){
        .subtitle {
        max-width: 60%;
        background-color: white;
        padding: 10px 10px 10px 0px;
        margin-top: -20px;
      }
      .herocaption {
      max-width: 35%;
      padding: 5px;}

      .underphoto {
      display: flex;
      flex-direction: row-reverse;
      justify-content: space-between;
      }
}
/*** Multi-site and field based subtitle hero display **/
.blog div.field--name-field-subtitle,
.pnash.psps div.field--name-field-subtitle{
  font-family:uni sans;
  font-size: 22px;
  color:var(--gold);
  padding: 10px 0px;
}
.pnash div.field--name-field-subtitle,
.pnash.psps div.field--name-field-subtitle{
  color:#609241;
}
.blog div.field--name-field-hero-caption,
.edge div.field--name-field-hero-caption p {
  padding: 5px 0px;
  font-style: italic;
  font-size: .8em;
  color: var(--dkgrey);
  text-align: right;
}

@media only screen and (min-width: 768px){
  .blog div.field--name-field-hero-caption,
  .edge div.field--name-field-hero-caption  {
  width: 35%;
  float: right;
  }
  .blog div.field--name-field-subtitle,
  .edge div.field--name-field-subtitle {
  width: 60%;
  margin-top: -25px;
  background-color: #ffffff;
  padding: 10px 10px 10px 0px;
  opacity: .99;
  min-width:20px;
  z-index:2;
  }
}


  /*** Edge blog styles
  .edge div.field--name-field-subtitle {
    max-width: 60%;
    min-width: 400px;
    margin-top: -25px;
    background-color: #ffffff;
    padding: 10px;
    opacity: .99;
    display: inline-block;
  }
  .edge div.field--name-field-subtitle p {
    font-family:uni sans;
    font-size: 22px;
    color:var(--gold);
    padding: 0px 15px 0px 0px;
  }
  .edge div.field--name-field-hero-caption {
    display: inline-block;
    vertical-align: top;
    float: right;
    max-width: 400px;
    margin-top: .5em;
  }
  .edge div.field--name-field-hero-caption p {
    font-style: italic;
    font-size: .8em;
    color: var(--dkgrey);
  }
  @media only screen and (max-width: 992px){
    .edge div.field--name-field-subtitle{
      width: 100%;
      min-width: 0px;
      margin-top: 0px;
      background-color: rgba(255, 0, 0, 0);
      padding: 30px 0px 20px 0px;
      z-index: -1;
      position: relative;
    }
  }
  /** Generic blog styling **/
  section[id*='featured-blog-story'] h2.block-title {
      color: var(--gold);
      font-size: 1.4em;
      padding: 0 2em .4em .1em;
      font-family: 'Encode Sans Normal';
      font-weight: 900;
      text-transform: uppercase;
      background: url(../images/featured-bg.svg) no-repeat;
      display: inline;
      background-size: 240px;
      margin: -2px 0 0 -.1em;
      position: absolute;
      z-index: 1;
  }
  section[id*='featured-blog-story'] {
    padding-top: 20px;
  }
/**
  .blog div.field--name-field-hero-caption {
      display: inline-block;
      float: right;
      max-width: 400px;
      margin-top: .5em;
      font-style: italic;
      font-size: .8em;
      color: var(--dkgrey);
  }
  .blog div.field--name-field-subtitle {
      width: 60%;
      min-width: 400px;
      margin-top: -25px;
      background-color: #ffffff;
      opacity: .99;
      display: inline-block;
      font-family: uni sans;
      font-size: 22px;
      color: var(--gold);
      padding: 10px 25px 10px 10px;
  }
  @media only screen and (max-width: 992px){
    .blog  div.field--name-field-hero-caption{
      display: inline-block;
      float: right;
      font-style: italic;
      font-size: smaller;
      color: var(--dkgrey);
      width: 100%;
      margin-top: .5em;
      margin-bottom: 1em
    }
    .blog  div.field--name-field-subtitle{
      width: 100%;
      min-width: 0px;
      margin-top: 0px;
      background-color: rgba(255, 0, 0, 0);
      padding: 50px 0px 20px 0px;
      z-index: -1;
      position: relative;
    }
  }
  @media only screen and (max-width: 480px) {
    .blog div.field--name-field-subtitle{
      padding: 20px 0px 20px 0px;
    }
  }
  */
  .multi-site.nwcohs-erc .sphheader {
      margin-top: -77px;
  }
  .multi-site div.region-sidebar-second ul.nav {
    margin-top: -80px;
    background-color: #ffffff;
    padding: 10px;
  }

  /***---------SRP Home Featured--------------***/
  .srp-module {
    position: relative;
    max-height: 35rem;
    overflow: hidden;
  }

  .home-featured-blocks-wrapper {
    position: relative;
    padding-top: 20rem;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul {
    display: block;
    list-style-type: none;
    padding: 0;
    margin: 0;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li {
    position: relative;
    height: 2.75rem;
    width: 100%;
    overflow: hidden;
    z-index: 3;
    background: #fff;
    color: black;
    transition: 0.2s background, 0.2s color, 0.2s padding;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li.home-featured-is-active {
    background: var(--purple) !important;
    color: #fff !important;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li a {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    height: 100%;
    text-decoration: none;
    color: inherit;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li a:focus {
    border: 3px dashed var(--purple);
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li a span {
    display: block;
    position: relative;
    text-decoration: none;
    padding: .75rem 1rem;
    font-family: "Encode Sans", sans-serif;
    text-align: left;
    line-height: 1.2;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li a span small {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li a span h3 {
    font-family: "Encode Sans", sans-serif;
    letter-spacing: 0.3px;
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li a span p {
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    margin-bottom: 1.5rem;
  }

  .home-featured-blocks-wrapper .home-featured-blocks ul li a span p,
  .home-featured-blocks-wrapper .home-featured-blocks ul li a span small.cta {
    opacity: 0;
  }

  @media screen and (min-width: 992px) {
    .srp-module {
      background: var(--purple);
    }


    .home-featured-blocks-wrapper {
      height: 100vh;
      position: unset;
      padding-top: 0;
    }

    .home-featured-blocks-wrapper .home-featured-blocks {
      position: absolute;
      bottom: 0;
      top: unset;
      width: 100%;
    }

    .home-featured-blocks-wrapper .home-featured-blocks ul {
      display: flex;
      align-items: flex-end;
    }

    .home-featured-blocks-wrapper .home-featured-blocks ul li {
      background: rgb(255 255 255 / 0.9);
    }

    .home-featured-blocks-wrapper .home-featured-blocks ul li a span {
      padding: .75rem;
      text-align: center;
    }

    .home-featured-blocks-wrapper .home-featured-blocks ul li a span p,
    .home-featured-blocks-wrapper .home-featured-blocks ul li a span small.cta {
      opacity: 0;
      transition: 0.2s opacity;
    }
    .home-featured-blocks-wrapper .home-featured-blocks ul li:hover a span p,
    .home-featured-blocks-wrapper .home-featured-blocks ul li a span small.cta {
      opacity: 1;
    }
  }

  @media screen and (min-width: 992px) and (max-width: 1200px) {
    .srp-module {
      font-size: 90%;
    }
    .home-featured-blocks-wrapper .home-featured-blocks ul li {
      height: 4rem;
    }
    .home-featured-blocks-wrapper .home-featured-blocks ul li:hover, .home-featured-blocks-wrapper .home-featured-blocks ul li a {
      padding-bottom: 6rem;
    }
    .home-featured-blocks-wrapper .home-featured-blocks ul li a span {
      padding: .75rem;
    }
  }

  @media screen and (min-width: 1200px) {
    .home-featured-blocks-wrapper .home-featured-blocks ul li {
      height: 2.75rem;
    }
    .home-featured-blocks-wrapper .home-featured-blocks ul li:hover, .home-featured-blocks-wrapper .home-featured-blocks ul li a {
      padding-bottom: 5rem;
    }
  }

  @media screen and (min-width: 992px) and (max-width: 1550px) {
    .srp-module span.home-featured-slide.angle-purple, .srp-module span.home-featured-slide.angle-white {
      background-size: contain;
      background-repeat: no-repeat;
      background-position-x: 100%;
      background-position-y: 100%;
    }
  }
  @media screen and (min-width: 1550px) {
    .srp-module span.home-featured-slide.angle-purple, .srp-module span.home-featured-slide.angle-white {
      background-size: 65%;
      background-position: 100%;
    }
  }
  /** --- popup styling-------- **/
  #spb-block-newsletterpopup .spb-popup-main-wrapper {
    background-color: #fff;
    box-shadow: -2px 1px 4px rgb(0 0 0 / .2);
    padding-right: 0;
    height: 14rem;
  }

  #block-newsletterpopup, #block-newsletterpopup * {
    padding: 0; /* removes padding created by .col-sm-12 on section tags */
  }

/** share on social styling **/
  .blog .pre-footer {
    background-color:  var(--dkgrey);
    margin-top: 45px;
  }
  .pnash.blog .footer {
    margin-top: 0px;
  }
  .hsm-blog .pre-footer {
    background-color:  var(--dkgrey);
  }

  div[class*='share-on-social-media'] span.field-content {
    display: flex;
    padding: 40px 0px 20px 0px;
    align-items: center;
  }
  div[class*='share-on-social-media'] span.field-content h3{
    color: white;
    padding-right: 20px;
  }
  div[class*='share-on-social-media'] span.field-content img{
    height: 35px;
    padding-right: 15px;
  }
  /* Image Box Hovers -- Click to learn more */

   .imageBox:hover button > span > span > span{
    color:white;
  }

.centerBox{
	display: flex;
	justify-content: center;
	align-items: center;
  margin: 20px 0px;
}

.imageBox{
	height: 310px;
	background: url("https://storage.googleapis.com/afs-prod/media/48a19e3e68ce4fe19b9c91c4a742937f/3000.jpeg") no-repeat center center;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
    background-size: cover;
    margin-left: 0.75em;
	text-align: center;
}

.imageBox:after{
	position: absolute;
	top:0;
	left: 0;
	right:0;
	bottom: 0;
/*  Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a29ca9+0,95909b+99 */
  background: #a29ca9; /* Old browsers */
background: -moz-linear-gradient(-45deg, #a29ca9 0%, #95909b 99%); /* FF3.6-15*/
background: -webkit-linear-gradient(-45deg, #a29ca9 0%,#95909b 99%); /* Chrome10-25,Safari5.1-6*/
background: linear-gradient(135deg, #a29ca9 0%,#95909b 99%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+*/
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a29ca9', endColorstr='#95909b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	content: '';
	opacity: 0;
		-webkit-transition: opacity 0.9s ease 0s;
}

.imageBox:hover:after{
	opacity: 0.25;
}

.imageBox .row{
  padding: none;
  padding-bottom: 15px;
}

.imageBox h4{
	color:white;
	/* font-size: 40px; */
	letter-spacing: 2px;
	-webkit-transition: all 0.08s ease 0s;
	position: relative;
	z-index: 10;
  text-shadow: 1px 2px 4px rgb(0 0 0 / 80%);
}

.imageBox:hover h4{
	transform: translateY(-10px);
}

.imageBox button{
	position: relative;
	-webkit-appearance: none;
	border: none;
	background: none;
	color:white;
	width: 250px;
	height:50px;
  font-size: 20px;
  font-family: uni sans;
	padding: 0;
	margin: 0;
	outline: none;
	z-index: 10;
}

.imageBox button span{
	display: block;
	position: relative;
	line-height: 50px;
	height: 50px;
	cursor: pointer;
}

.imageBox button > span:after{
	content:'';
	position: absolute;
	top:0;
	left: 50%;
	width: 20px;
	height: 0;

	border: 1px solid white;
	border-left: none;
	border-bottom: none;

	    transition: height 0.08s ease-out, width 0.08s ease-out 0.08s;
}

.imageBox:hover button > span:after{
	width: calc(50% - 1px);
	height: calc(100% - 2px);
	transition: width 0.08s ease-out, height 0.08s ease-out 0.08s;
}

.imageBox button > span:before{
	content:'';
	position: absolute;
	top:0;
	right: 50%;
	width: 20px;
	height: 0;

	border: 1px solid white;
	border-right: none;
	border-bottom: none;

	    transition: height 0.08s ease-out, width 0.08s ease-out 0.08s;
}

.imageBox:hover button > span:before{
	width: calc(50% - 1px);
	height: calc(100% - 2px);
	transition: width 0.08s ease-out, height 0.08s ease-out 0.08s;
}

.imageBox button > span > span:before{
	content:'';
	position: absolute;
	bottom:0;
	right: 0%;
	width: 1px;
	height: 1px;
	opacity: 0;

}

.imageBox:hover button > span > span:before{
	opacity: 1;
	border-bottom: 1px solid white;
	width: calc(50%);
	height: 1px;
	transition: opacity 0s ease-out 0.29s, width 0.08s ease-out 0.3s;
}

.imageBox button > span > span:after{
	content:'';
	position: absolute;
	bottom:0;
	left: 0%;
	width: 1px;
	height: 1px;
	opacity: 0;

}

.imageBox:hover button > span > span:after{
	opacity: 1;
	border-bottom: 1px solid white;
	width: calc(50%);
	height: 1px;
	transition: opacity 0s ease-out 0.29s, width 0.08s ease-out 0.3s;
}

.imageBox button > span > span > span{
	transition: color 0.08s ease-out 0.3s;
	color: transparent;
}

.imageBox:hover button > span > span > span{
	color:white;
}

.imageBox button > span > span > span:after{
	position: absolute;
	top:0;left:0;right:0;bottom:0;
	color: #4B2E83;
    content: attr(data-attr-span);
    width: 0%;
    height: 100%;
    background: white;
    opacity: .95;
    white-space: nowrap;
    text-align: center;
    margin: auto;
    overflow: hidden;
	display: flex;
	justify-content: center;
	transition: width 0.5s;
}

.imageBox button:hover > span > span > span:after{
	width: 100%;
}
p.modalImageText {
  padding: 5px;
  padding-left: 10px;
  padding-right: 10px;
  margin-left: calc(230px + 5vw);
  margin-top: -106px;
  color: white;
  font-size: 1.2em;
  font-weight: bold;
  background: rgb(0 0 0 / .6);
  z-index: 13;
  position: absolute;
  transform-origin: 0% 100%;
  transform: skew(-8deg);
}
p.modalImageText a {
  font-size: 1.05em;
  font-weight: bold;
}

@media only screen and (max-width: 800px) {
  .centerBox{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 0px;
    flex-direction: column;
  }

  .imageBox{
  	height: 310px;
  	background: url("https://storage.googleapis.com/afs-prod/media/48a19e3e68ce4fe19b9c91c4a742937f/3000.jpeg") no-repeat center center;
  	display: flex;
  	justify-content: center;
  	align-items: center;
  	position: relative;
      background-size: cover;
  	text-align: center;
    margin: 20px;
  }
}

/* Large Image Modal */
.transparentMask {
  width: 100%;
  height: 100%;
  background: #E5E5E5;
  opacity: 0.7;
  position: absolute;
  top: 0px;
  z-index: 10;
}
.smallModalBoxContainer {
  width: 100%;
  height: 600px;
  margin: auto;
}
.bigModalBoxContainer {
  max-width: calc(500px + 35vw);
  padding-top: 0px;
  position: absolute;
  z-index: 11;
}
.modalImageFull {
  padding-top: 25px;
  padding-left: 200px;
  margin-left: calc(10px + 5vw);
  z-index: 12;
  object-fit: fill;
  width: auto;
  max-height: 100%;
}
.closeModalX {
  position: absolute;
  font-size: 36px;
  margin-left: calc(70px + 5vw);
  margin-top: 15px;
  color: #444444;
}
.closeModalX:hover {
  cursor: pointer;
}

@media only screen and (max-width: 500px) {
  .modalImageFull {
    padding-left: 10%;
    padding-top: 70px;
    width: 90%;
  }

  p.modalImageText {
    font-size: 0.5em;
    width: 70%;
    margin-left: calc(60px + 5vw);
    margin-top: -55px;
  }

  .closeModalX {
    margin-left: 10%;
  }
}

#block-searchform .input-group .btn-primary svg{
  width: 19px;
  height: 19px;
}

#block-searchform .input-group .btn-primary {
  z-index: 5;
background-color: #4b2e83;
border-radius: 20px;
border: 2px solid #ffffff;
padding: 8px 8px 4px 8px;
position: absolute;
right:0;
top:0;
}

#block-searchform .input-group .form-control {
    float: right;
    border-color: transparent;
    background-color: transparent;
    margin-right: 5px;
    height: 40px;
    transition: width 400ms ease-in-out, background 400ms ease-in-out;
    width: 20px;
    position: absolute;
    right: 0;
    top:0;
    box-shadow: none;
    border-radius: 20px;
}
#block-searchform .input-group:hover .form-control,
#block-searchform .input-group:focus .form-control,
#block-searchform .input-group .form-control.open {
    width: 100%;
    background-color: #ffffff;
    border-radius: 20px;
    height: 40px;
    box-shadow: none;
}

#block-searchform div.input-group {
  width: 100%;
  height:100%;
}

.js-view-dom-id-1470a69e825611f0d5d61a02a390215ccfaa4d22239ae522aa6d379c00473067 [class*='row-']{
  margin: .5%;
  max-width: 32%;
  min-width: 250px;
  background-color: white;
  padding-bottom: 10px;
}
body.undergrad>div.dialog-off-canvas-main-canvas>div.main-container.container.js-quickedit-main-content>div>section>div>article>div.content>div>div>section.block.block-layout-builder.block-field-blocknodebuilder-pagefield-block-4.clearfix>div>div>div>div>div>section>div>div>div>div>div.view-content {
  max-width: 1150px;
}

.undergrad .block-field-blockparagraphbp-viewbp-view {
    width: 100vw;
    margin-left: -14.25vw;
    padding-left: 14.25vw;
    background: var(--ltgrey);
}

@media only screen and (max-width: 1400px) {
  .undergrad .block-field-blockparagraphbp-viewbp-view {
    width: 106.5vw;
    margin-left: -14.25vw;
    padding-left: 14.25vw;
  }
}

/* pagination issue on mobile and tablet on pnash blog */
@media only screen and (max-width: 1024px) {

  nav.pager-nav {
    padding: 20px 0px 50px 0px;
  }
}

/* images stretching vertically */
img {
  max-width: 100%;
  height: auto;
}

/** Adds language switcher styling. May not work if search is present **/
#block-deohs-boundless-languageswitcher {
  position: absolute;
  bottom: 0;
  right: 10px;
}

#block-deohs-boundless-languageswitcher>ul.links {
  list-style-type: none;
  display: flex;
}
#block-deohs-boundless-languageswitcher>ul.links li a {
  color: white;
  font-size: 17px;
  font-family: "Encode Sans Compressed";
  font-weight: bolder;
  text-transform: uppercase;

}
#block-deohs-boundless-languageswitcher>ul.links li:first-child a::after{
  content: "\00A0\002f\00A0";
  left: 0;
  line-height: 1;
  position: inline;
  text-indent: 0;
  top: 0;
  color: white;
}