Last active
July 1, 2021 21:29
-
-
Save csilverman/f9e25c6dfbcfddcc22bd0e184a628a7e to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
:root { | |
--burgundy-light: #951829; | |
--gray-light: #d7cfcc; | |
--gray-xxxlight: #f7f5f1; | |
--gray-xxxlight-border: 1px solid rgba(212, 204, 202, 0.3); | |
--gray-charcoal: #222; | |
--gold: #C6AA76; | |
--basic-transition: 0.2s all ease; | |
--sans-serif: "Source Sans Variable","Helvetica Neue","Helvetica","Arial",sans-serif; | |
--serif: "freight-big-pro","Georgia","Times","Times New Roman",serif; | |
} | |
@font-face{ | |
font-display:swap; | |
font-family:'Source Sans Variable'; | |
font-weight:200 900; | |
font-stretch:normal; | |
src:url(https://www.vassar.edu/admissions/assets/fonts/SourceSansVariable-Roman.ttf.woff2) format("woff2 supports variations"),url(https://www.vassar.edu/admissions/assets/fonts/SourceSansVariable-Roman.ttf.woff2) format("woff2-variations"),url(https://www.vassar.edu/admissions/assets/fonts/SourceSansVariable-Roman.ttf.woff) format("woff"),url(https://www.vassar.edu/admissions/assets/fonts/SourceSansVariable-Roman.ttf) format("truetype") | |
} | |
@font-face{ | |
font-display:swap; | |
font-family:'Source Sans Variable'; | |
font-weight:200 900; | |
font-style:italic; | |
font-stretch:normal; | |
src:url(https://www.vassar.edu/admissions/assets/fonts/SourceSansVariable-Italic.ttf.woff2) format("woff2 supports variations"),url(https://www.vassar.edu/admissions/assets/fonts/SourceSansVariable-Italic.ttf.woff2) format("woff2-variations"),url(https://www.vassar.edu/admissions/assets/fonts/SourceSansVariable-Italic.ttf.woff) format("woff"),url(https://www.vassar.edu/admissions/assets/fonts/SourceSansVariable-Italic.ttf) format("truetype") | |
} | |
/* BASIC STYLES | |
============ */ | |
a { | |
transition: 0.4s all ease; | |
} | |
p { | |
font-size: 1.3rem; | |
font-variation-settings: "wght" 360; | |
line-height: 1.3; | |
} | |
/* Standard links */ | |
p a:not(.btn):hover, | |
p a:visited:not(.btn):hover { | |
color: #fff !important; | |
background-color: #951829 !important; | |
text-decoration: none; | |
} | |
p a:focus, | |
p a:hover, | |
p a:visited:focus, | |
p a:visited:hover, | |
li a:focus, | |
li a:hover, | |
li a:visited:focus, | |
li a:visited:hover, | |
h2:not(.all-news-display-title):not(.news-headlines-display-title):not(.featured-news-display-title) a:focus, | |
h2:not(.all-news-display-title):not(.news-headlines-display-title):not(.featured-news-display-title) a:hover, | |
h2:not(.all-news-display-title):not(.news-headlines-display-title):not(.featured-news-display-title) a:visited:focus, | |
h2:not(.all-news-display-title):not(.news-headlines-display-title):not(.featured-news-display-title) a:visited:hover, | |
figcaption a:focus, | |
figcaption a:hover, | |
figcaption a:visited:focus, | |
figcaption a:visited:hover { | |
background-color: var(--burgundy-light) !important; | |
color: #fff !important; | |
} | |
p a:visited, | |
li a:visited { | |
color: #888; | |
} | |
.component--hero-slideshow a:visited, | |
.bg.dark a:visited { | |
color: #fff; | |
} | |
.footer-nav-outer a:hover, | |
.footer-nav-outer a:visited:hover, | |
.footer-nav-outer a:focus, | |
.footer-nav-outer a:visited:focus, | |
.component--hero-slideshow .carousel-caption a:focus, | |
.component--hero-slideshow .carousel-caption a:hover, | |
.component--hero-slideshow .carousel-caption a:visited:focus, | |
.component--hero-slideshow .carousel-caption a:visited:hover, | |
.site-footer a:focus, | |
.site-footer a:hover, | |
.site-footer a:visited:focus, | |
.site-footer a:visited:hover, | |
.bg.dark a:focus, | |
.bg.dark a:hover, | |
.bg.dark a:visited:focus, | |
.bg.dark a:visited:hover { | |
background: #fff !important; | |
color: #222 !important; | |
} | |
/* | |
.component--main-content .content h2.main-content-display-title, | |
.component--main-content .content h1.main-content-display-title, | |
.component--main-content-basic .content h2.main-content-display-title, | |
.component--main-content-basic .content h1.main-content-display-title { | |
font-size: 3rem; | |
} | |
*/ | |
/* Typography | |
---------- */ | |
/* Bugfix for Safari gradient h2s */ | |
h1 *, | |
h2 * { | |
display: inline; | |
} | |
h1, | |
.component--main-content .content h1.main-content-display-title, | |
.component--main-content-basic .content h1.main-content-display-title, | |
h1.main-content-display-title, | |
h1.all-news-display-title { | |
font-weight: normal !important; | |
/* This was making h1s disappear on inner pages */ | |
/* background: none !important; */ | |
font-size: 4rem !important; | |
background: -webkit-linear-gradient(315deg,#641A2B 0%,#ED1C24 70%); | |
background: -o-linear-gradient(315deg,#641A2B 0%,#ED1C24 70%); | |
background: linear-gradient(135deg,#641A2B 0%,#ED1C24 70%); | |
color: transparent; | |
-webkit-background-clip: text; | |
background-clip: text; | |
} | |
.bg.dark h1.main-content-display-title { | |
color: #fff !important; | |
} | |
/* | |
h2.main-content-display-title, | |
.field--name-field-main-content-body h2, | |
.featured-videos-display-title, | |
.two-column-display-title, | |
.component--social-with-imagery .content h2.display-title, | |
.component--facts-stats .content .vassar-stats-facts h2.Row__title, | |
.component--main-content .content h2.main-content-display-title, | |
.component--main-content-basic .content h2.main-content-display-title { | |
font-family: var(--sans-serif) !important; | |
font-size: 2.2rem !important; | |
font-variation-settings: "wght" 800 !important; | |
letter-spacing: -0.02rem !important; | |
margin-top: 2rem !important; | |
color: #641a2b !important; | |
background: -webkit-linear-gradient(315deg,#641A2B 0%,#ED1C24 70%); | |
background: -o-linear-gradient(315deg,#641A2B 0%,#ED1C24 70%); | |
background: linear-gradient(135deg,#641A2B 0%,#ED1C24 70%); | |
color: transparent; | |
-webkit-background-clip: text; | |
background-clip: text; | |
color: transparent !important; | |
line-height: 1.1 !important; | |
} | |
*/ | |
.component--social-with-imagery .content h2.display-title, | |
.component--facts-stats .content .vassar-stats-facts h2.Row__title, | |
.component--main-content .content h2.main-content-display-title, | |
.component--main-content-basic .content h2.main-content-display-title { | |
margin-top: 0 !important; | |
} | |
/* | |
.component--main-content.bg.dark .content h2.main-content-display-title, | |
.component--main-content-basic.bg.dark .content h2.main-content-display-title { | |
color: #aaa; | |
font-variation-settings: "wght" 680 !important; | |
} | |
*/ | |
.field--name-field-main-content-body h3 { | |
font-size: 1.4rem; | |
font-variation-settings: "wght" 700; | |
} | |
.field--name-field-main-content-body h4 { | |
font-size: 1.2rem; | |
text-transform: uppercase; | |
letter-spacing: 0.06rem; | |
} | |
strong, | |
b { | |
font-variation-settings: "wght" 660; | |
} | |
sup, sub { | |
font-size: 70%; | |
font-variation-settings: "wght" 460; | |
} | |
blockquote { | |
font-family: var(--sans-serif); | |
font-style: normal !important; | |
padding: 1.4rem; | |
background: var(--gray-xxxlight); | |
margin-bottom: 1.4rem; | |
font-size: 90%; | |
z-index: -1; /* makes sure it doesn't cover floated images */ | |
} | |
blockquote:before { | |
display: none; | |
} | |
.intro-text { | |
font-family: var(--serif); | |
font-size: 2.4rem !important; | |
line-height: 1.1 !important; | |
margin-bottom: 2rem; | |
margin-top: 0; | |
} | |
/* UNIVERSAL NAV | |
============= */ | |
.menu--actions a:visited, | |
.menu--roles a:visited, | |
.menu--main a:visited { | |
color: #fff !important; | |
} | |
.menu--actions a:visited, | |
.menu--roles a:visited { | |
background: transparent !important; | |
} | |
/* Actions | |
------- */ | |
.menu--actions a:hover, | |
.menu--actions a:visited:hover, | |
.menu--actions a:focus, | |
.menu--actions a:visited:focus { | |
background: #fff !important; | |
color: var(--gray-charcoal) !important; | |
} | |
.menu--actions a { | |
font-weight: 400 !important !important; | |
} | |
/* Roles | |
----- */ | |
.menu--roles .is-active { | |
background: none !important; | |
} | |
.menu--roles a { | |
font-variation-settings: "wght" 400 !important; | |
} | |
.menu--roles a:hover, | |
.menu--roles a:visited:hover, | |
.menu--roles a:focus, | |
.menu--roles a:visited:focus { | |
background: #fff !important; | |
color: #000 !important; | |
} | |
/* Main nav | |
-------- */ | |
header #navbar-main #CollapsingNavbar .menu--main a:hover, | |
header #navbar-main #CollapsingNavbar .menu--main a:visited:hover, | |
header #navbar-main #CollapsingNavbar .menu--main a:focus, | |
header #navbar-main #CollapsingNavbar .menu--main a:visited:focus { | |
background: var(--burgundy-light) !important; | |
background: #951829 !important; | |
} | |
/* UI elements | |
=========== */ | |
/* Buttons | |
------- */ | |
/* Square homepage buttons */ | |
.block-button { | |
border: 1px solid #951829 !important; | |
font-variation-settings: "wght" 400 !important; | |
} | |
.block-button:visited { | |
color: #fff !important; | |
} | |
.block-button:hover, | |
.block-button:focus, | |
.block-button:visited:hover, | |
.block-button:visited:focus { | |
background: #fff !important; | |
color: var(--burgundy-light) !important; | |
} | |
.bg.dark .block-button { | |
border: 1px solid #fff; | |
} | |
/* Regular buttons */ | |
.btn-primary:visited { | |
color: #fff !important; | |
} | |
.btn-primary:hover, | |
.btn-primary:visited:hover, | |
.btn-primary:focus, | |
.btn-primary:visited:focus { | |
background: #000 !important; | |
} | |
/* Tickers | |
------- */ | |
.view-display-id-news_headlines_carousel .custom-linked-title a:hover { | |
color: var(--gray-charcoal) !important; | |
text-decoration: underline !important; | |
text-decoration-color: #aaa; | |
} | |
.component--news-headlines.carousel .rendered-news-view .carousel .carousel-indicators li { | |
transition: 0.4s all ease; | |
} | |
.component--news-headlines.carousel .rendered-news-view .carousel .carousel-indicators li:hover { | |
background-color: var(--gold); | |
width: 1rem; | |
height: 1rem; | |
border-radius: 50%; | |
margin: 0 0.5rem; | |
opacity: 1; | |
} | |
/* Video embeds | |
------------ */ | |
.embed-responsive, | |
.ratio { | |
margin-bottom: 1.4rem; | |
} | |
/* Carousels | |
--------- */ | |
.carousel { | |
margin-bottom: 1em !important; | |
} | |
/* Facts and stats | |
--------------- */ | |
.Module__desc { | |
font-family: var(--serif) !important; | |
font-size: 3rem !important; | |
} | |
.component--facts-stats .content .vassar-stats-facts p { | |
font-family: inherit; | |
} | |
/* Clean lists | |
----------- */ | |
.clean-list { | |
padding: 0; | |
} | |
.clean-list li { | |
list-style: none; | |
} | |
/* NAVIGATION | |
========== */ | |
li.active.expanded.last ul { | |
margin: 0; | |
} | |
li.active.expanded.last ul li {padding-right: 0;} | |
/* Main nav | |
-------- */ | |
.component--secondary-navigation a, | |
.component--secondary-navigation a:visited { | |
color: var(--burgundy-light); | |
} | |
.component--secondary-navigation .is-active:visited { | |
color: #444; | |
} | |
.component--secondary-navigation a:hover, | |
.component--secondary-navigation a:visited:hover { | |
background: var(--burgundy-light) !important; | |
color: #fff !important; | |
} | |
/* Sidenav | |
------- */ | |
.component--side-navigation { | |
display: block; | |
padding: 0.8rem; | |
} | |
.component--side-navigation li { | |
margin: 0; | |
} | |
.component--side-navigation a { | |
padding: 0.2rem 0.4rem; | |
} | |
.component--side-navigation a.active:hover, | |
.component--side-navigation a:visited { | |
color: var(--burgundy-light) !important; | |
} | |
.component--side-navigation .expanded a.active:hover, | |
.component--side-navigation .expanded a.active:visited:hover { | |
color: #fff !important; | |
} | |
/* HOME | |
==== */ | |
.component--all-news.top-5 h1.all-news-display-title:hover, | |
.component--all-news.top-5 h2.all-news-display-title:hover, | |
.component--all-events.top-5 h1.all-news-display-title:hover, | |
.component--all-events.top-5 h2.all-news-display-title:hover, | |
.component--news-headlines.carousel h2.news-headlines-display-title:hover { | |
background: linear-gradient(135deg, #222 0%, #222 70%) !important; | |
color: transparent !important; | |
-webkit-background-clip: text !important; | |
} | |
.component--all-news.top-5 h1.all-news-display-title, | |
.component--all-news.top-5 h2.all-news-display-title, | |
.component--all-events.top-5 h1.all-news-display-title, | |
.component--all-events.top-5 h2.all-news-display-title, | |
.component--news-headlines.carousel h2.news-headlines-display-title { | |
transition: 0.4s all ease; | |
} | |
/* News | |
---- */ | |
h2.all-news-display-title { | |
margin: 0.7em 0 0.4em 0; | |
} | |
/* News tiles */ | |
.node--news--top-5-card { | |
padding: 1rem; | |
} | |
.node--news--top-5-card h3 { | |
line-height: 1.3; | |
} | |
.node--news--top-5-card h3 a:hover { | |
color: var(--burgundy-light); | |
} | |
.alias--vassar-college-home .node--news--top-5-card:hover, | |
.alias--vassar-college-home .node--news--top-5-card:focus, | |
.alias--vassar-college-home .node--news--top-5-card:visited:hover, | |
.alias--vassar-college-home .node--news--top-5-card:visited:focus { | |
background: #fff !important; | |
box-shadow: 0 0.4em 0.4em rgba(0, 0, 0, 0.1); | |
transform: scale(1.02); | |
z-index: 10; | |
border-color: #ddd !important; | |
border-color: #ddd !important; | |
border-left: 1px solid #ddd !important; | |
border-top-color: #951829 !important; | |
} | |
/* NEWS | |
==== */ | |
.u-ArticleGroup--newsSlider-top .u-ArticleFeature { | |
background-color: var(--gray-xxxlight); | |
border: var(--gray-xxxlight-border); | |
} | |
.rendered-news-view .views-row article:hover img, | |
.node--news--featured-news-teaser:hover .field--name-field-news-teaser-image img { | |
opacity: 1; | |
-webkit-filter: none; | |
filter: none; | |
} | |
.component--featured-news .content .field--name-field-featured-news-handpicked, | |
.component--featured-news .content .view-content { | |
grid-template-rows: auto auto 1fr; | |
} | |
@media (min-width: 62rem) { | |
.component--featured-news .content .field--name-field-featured-news-handpicked .field__item:nth-child(4), | |
.component--featured-news .content .field--name-field-featured-news-handpicked .views-row:nth-child(4), | |
.component--featured-news .content .view-content .field__item:nth-child(4), | |
.component--featured-news .content .view-content .views-row:nth-child(4) { | |
align-self: unset; | |
} | |
} | |
@media (min-width: 62rem) { | |
.component--featured-news .content .field--name-field-featured-news-handpicked, | |
.component--featured-news .content .view-content { | |
grid-gap: 0; | |
} | |
} | |
.field--name-field-news-teaser-image-square { | |
margin-bottom: 0 !important; | |
} | |
.news-title a:focus { | |
color: #fff !important; | |
background: var(--burgundy-light); | |
} | |
/* News items | |
---------- */ | |
.not-front .rendered-news-view .views-row article, | |
.not-front .component--featured-news .views-row article { | |
border: 1px solid transparent; | |
border-bottom: 1px solid #ddd !important; | |
padding: 1.4em; | |
transition: var(--basic-transition); | |
will-change: transform; | |
} | |
.node--news--featured-news-teaser:hover .field--name-field-news-teaser-copy { | |
color: var(--burgundy-light) !important; | |
} | |
.not-front .rendered-news-view .views-row:hover article, | |
.not-front .component--featured-news .views-row:hover article { | |
background: #fff !important; | |
box-shadow: 0 0.4em 0.4em rgba(0, 0, 0, 0.1); | |
transform: scale(1.02); | |
z-index: 10; | |
border-color: #ddd !important; | |
border-left-color: #951829 !important; | |
z-index: 2 !important; | |
position: relative; | |
} | |
.field--name-field-featured-news-handpicked .field__item .node--news--featured-news-teaser:hover .news-title h3 a, | |
.field--name-field-featured-news-handpicked .views-row .node--news--featured-news-teaser:hover .news-title h3 a, | |
.view-content .field__item .node--news--featured-news-teaser:hover .news-title h3 a, | |
.view-content .views-row .node--news--featured-news-teaser:hover .news-title h3 a { | |
color: var(--burgundy-light); | |
} | |
/* /news/all listing | |
----------------- */ | |
.node--news--teaser, | |
.alias--news-all .field--name-field-news-teaser-image-square { | |
margin-bottom: 0 !important; | |
} | |
.node--news--teaser:hover .custom-linked-title h2 a, | |
.node--news--teaser:hover .custom-linked-title h2 a:visited, | |
.node--news--teaser:focus .custom-linked-title h2 a, | |
.node--news--teaser:focus .custom-linked-title h2 a:visited, | |
.node--news--teaser:hover .field--name-field-news-teaser-copy, | |
.node--news--teaser:hover .field--name-field-news-publish-date, | |
.node--news--teaser:focus .field--name-field-news-teaser-copy, | |
.node--news--teaser:focus .field--name-field-news-publish-date { | |
color: var(--burgundy-light); | |
} | |
.node--news--teaser .custom-linked-title h2 { | |
font-size: 2rem; | |
} | |
.field--name-field-news-teaser-copy p { | |
font-size: 1.2rem; | |
} | |
.news-title a:focus { | |
color: #fff !important; | |
} | |
/* | |
.component--main-content .content h1.main-content-display-title, | |
.component--main-content-basic .content h1.main-content-display-title { | |
font-size: 4rem !important; | |
} | |
*/ | |
.main-content-display-title .field--type-text { | |
font-size: inherit !important; | |
} | |
@media screen and (min-width: 52.125rem) { | |
.component--hero-image .field--name-field-hero-image-display-title span { | |
font-size: 3rem; | |
} | |
} | |
.component--hero-image .field--name-field-hero-image-display-title span { | |
padding: 1rem 1.4rem; | |
} | |
h1.main-content-display-title { | |
border-bottom: 1px solid #ccc; | |
margin-bottom: 0.6em; | |
} | |
.component--facts-stats .content .vassar-stats-facts dl dt.Module__title { | |
font-family: var(--sans-serif); | |
} | |
.component--featured-news .content h2.featured-news-display-title:hover { | |
background: linear-gradient(135deg, #222 0%, #222 70%) !important; | |
color: transparent !important; | |
-webkit-background-clip: text !important; | |
} | |
.component--featured-videos .view-content .views-row button, | |
.component--featured-videos .view-content .field__item button, | |
.component--featured-videos .field--name-field-videos-handpicked .views-row button, | |
.component--featured-videos .field--name-field-videos-handpicked .field__item button { | |
border: 1px solid #ccc !important; | |
will-change: transform; | |
transition: var(--basic-transition) !important; | |
} | |
.component--featured-videos .view-content .views-row button:hover, | |
.component--featured-videos .view-content .field__item button:hover, | |
.component--featured-videos .field--name-field-videos-handpicked .views-row button:hover, | |
.component--featured-videos .field--name-field-videos-handpicked .field__item button:hover { | |
background: #fff !important; | |
border: 1px solid #ccc !important; | |
border-top: 1px solid #951829 !important; | |
box-shadow: 0 0.2em 0.8em 0.25em #ddd !important; | |
} | |
/* FOOTER | |
====== */ | |
.site-footer a { | |
font-family: var(--sans-serif) !important; | |
} | |
.site-footer a:visited { | |
color: #fff !important; | |
} | |
footer.site-footer.default #footer-nav-info .u-VCardContainer .u-VCard--site .org { | |
font: 600 2rem/1.1 "freight-big-pro","Georgia","Times","Times New Roman",serif !important; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment