@charset "UTF-8";

html {
  font-size: 18px;
  background-color: #111;
  color: #000000;
  margin: 0;
}

body {
  margin: 0;
}

/******* headings **********/

h1 {
  font-size: 3rem;
  font-weight: 600;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.5;
}

h2 {
  font-size: 3rem;
  font-weight: 500;
  font-family: "anzeigen-grotesk", "sans-serif";
  line-height: 1;
  text-align: center;
  margin-bottom: 0;
  margin-top: 4rem;
  text-transform: uppercase;
}

h3 {
  font-size: 2.25rem;
  font-weight: 600;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.1;
}

h4 {
  font-size: 1.33rem;
  font-weight: 600;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.5;
  text-align: center;
  margin: 0.25rem auto 2rem 0;
}

h5 {
  font-size: 1.25rem;
  font-weight: 600;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.5;
  margin: 0.25rem 2.7rem -0.5rem;
}

h6 {
  font-size: 1rem;
  font-weight: 600;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1rem;
  margin: 0 0 1rem;
  color: #3172ae;
  text-transform: capitalize;
}

h7 {
  font-size: 1.33rem;
  font-weight: 600;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.5;
  text-align: center;
  margin: 0.25rem auto 2rem 0;
}

.small {
  font-size: 0.7rem;
}

.subhead {
  font-size: 1.2rem;
  font-weight: 400;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.5;
  text-align: center;
  margin: 0 auto 2rem auto;
}

/********* other text styles *********/

p,
ul,
ol,
a,
span {
  font-size: 1rem;
  font-weight: 400;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.7;
}

.center {
 text-align: center;
}

strong {
  font-weight: 600;
}

h1 > a,
h2 > a,
h3 > a,
h4 > a,
h5 > a,
h6 > a {
  font-size: inherit;
}

ul,
ol {
  margin: 0;
}

a {
  /* color: #3172ae; */
  color: #000;
}

footer a {
  color: #ffffff;
}


#openingBlockQuote blockquote {
  margin-top: 5rem;
}
blockquote {
  font-size: 1rem;
  font-weight: 400;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.5;
  padding: 2rem 3rem;
  margin: 7.5rem auto 1rem;
  width: 80%;
  background-color: #222;
  color: white;
  position: relative;
  z-index: 1;
  box-sizing: border-box;

  background-image: url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/9/7568f31b-95eb-4db3-ba55-02a28abf76b8.svg);
  background-repeat: no-repeat;
  background-position: right;
  background-size: contain;
  border-top: 12px solid transparent;
  border-image-source: linear-gradient(
    -90deg,
    rgba(236, 150, 0, 1) 0%,
    rgba(212, 93, 0, 1) 100%
  );
  border-image-slice: 1;
}

blockquote img {
  padding: 0 1rem 0 0;
  width: 3rem;
  display: block;
  float: left;
}

blockquote div {
  font-size: 0.8rem;
  padding: 2rem 0 1rem 0;
  text-align: right;
  text-transform: none;
}

.container#learnmore div.footer-content {
  padding: 0 2rem 4.25rem;
}

.footer-flex-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

.container#learnmore div.social-icons {
  padding: 3rem 0 0 0;
}

.fletcher-footer-logo {
  padding: 3rem 1rem 0 0 !important;
}

.container#learnmore .social-icons img {
  width: 32px;
  margin-right: 0.5rem;
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.container#learnmore .social-icons a:last-child img {
  width: 90px;
  margin-right: 0;
}

button img {
  display: block;
}

.light {
  font-weight: 300;
}

.normal {
  font-weight: 400;
}

.semi {
  font-weight: 500;
}

.bold {
  font-weight: 600;
}

.italic {
  font-style: italic;
}

/******* floats and sizes *******/

.left {
  float: left;
}

.right {
  float: right;
}

@media (min-width: 701px) {
  .set2 .profileArticle.right {
    align-items: center;
  }
}

.set2 .profileArticle.right {
  display: flex;
}

.set2 .profileArticle.right .copy {
  width: 60%;
  order: 2;
}

.set2 .profileArticle.right .imgContainer {
  order: 1;
}

.set2 .profileArticle.right .readMore span {
  margin-right: 2.7rem;
  position: absolute;
  right: 0;
  bottom: -1px;
  left: unset;
}

.clearfix {
  overflow: auto;
}

.full {
  width: 100%;
}

.half {
  width: 50% !important;
}

.quarter {
  width: 25%;
}

.bottomMargin2rem {
  margin-bottom: 2rem;
}

/********* colors and backgrounds *********/

.blue1 {
  color: #3e5295;
}

.blue2 {
  color: #d25d12;
}

.blue3 {
  color: #3172ae;
}

.black1 {
  color: #000;
}

.red1 {
  color: #cc0112;
}

.green1 {
  color: #00edfa;
}

.purple1 {
  color: #500778;
}

.orange1 {
  color: #d45d00;
}

.white {
  color: white;
}

.blueBG {
  background-color: #004365;
}

.blueBG2 {
  background-color: #00517b;
}

.grayBG4 {
  background-color: #999999;
}

.grayBG5 {
  background-color: #dddddd;
}

.redBG {
  background-color: #78262a;
}

.redBG2 {
  background-color: #8c2f35;
}

.greenBG {
  background-color: #00666b;
}

.greenBG2 {
  background-color: #016e73;
}

.yellowBG {
  background-color: #f1c400;
}

.yellowBG2 {
  background-color: #f6c800;
}

.purpleBG {
  background-color: #500778;
}

.orangeBG {
  background-color: #c96f2a;
}

.orangeBG2 {
  background-color: #c1492d;
}

.orangeBG3 {
  background-color: #d25d12;
}

.darkBG {
  background-color: #303030;
}

.fletcherOrgBG {
  background-color: #d25d12;
}

.darkBG2 {
  background-color: #212121;
}

.grayBG {
  background: linear-gradient(
    180deg,
    rgba(245, 245, 245, 1) 0%,
    rgba(245, 245, 245, 1) 40%,
    rgba(255, 255, 255, 1) 40%,
    rgba(255, 255, 255, 1) 100%
  ) !important;
}

.grayBG2 {
  background-color: #efefef;
}

.grayBG3 {
  background-color: #f5f5f5;
}

.grayBG3:first-of-type {
  background-color: #f5f5f5;
  background-image: url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/9/382a296d-93e1-4576-8827-ba42183ab89a.svg);

  background-size: 100% auto;
  background-position: center top;
}

.whiteBG {
  background-color: #ffffff !important;
}

.redCircleBorder {
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%23CB333B' stroke-width='16' stroke-dasharray='13' stroke-dashoffset='86' stroke-linecap='butt'/%3e%3c/svg%3e");
}

.blueCircleBorder {
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%233E5295' stroke-width='16' stroke-dasharray='13' stroke-dashoffset='86' stroke-linecap='butt'/%3e%3c/svg%3e");
}

.blue2CircleBorder {
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%233e8ede' stroke-width='16' stroke-dasharray='13' stroke-dashoffset='86' stroke-linecap='butt'/%3e%3c/svg%3e");
}

.orangeCircleBorder {
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%23d45d00' stroke-width='16' stroke-dasharray='13' stroke-dashoffset='86' stroke-linecap='butt'/%3e%3c/svg%3e");
}

.purpleCircleBorder {
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%23500778' stroke-width='16' stroke-dasharray='13' stroke-dashoffset='86' stroke-linecap='butt'/%3e%3c/svg%3e");
}

.yellowCircleBorder {
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%23F1C400' stroke-width='16' stroke-dasharray='13' stroke-dashoffset='86' stroke-linecap='butt'/%3e%3c/svg%3e");
}

.quoteBG {
  background-repeat: no-repeat;
  background-size: cover;
  border-top: 10px solid white;
  position: relative;
}

.quoteBG img {
  margin: 8rem auto;
  max-width: 532px;
}

.container.top-image {
  background-color: #000000;
  padding: 1.5em 0;
}

#coverBG {
  background: linear-gradient(0deg, rgba(0, 0, 0, 1) 22%, rgba(0, 0, 0, 0) 50%)
      bottom,
    url(https://image.e.tufts.edu/lib/fe9e13727664067f74/m/1/ba62eaaa-ebc1-43fe-bf1d-edcca63e03cf.jpg)
      bottom;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 0 0;
}

.title {
  width: 50%;
  position: absolute;
  bottom: -1.1rem;
  right: 25%;
}

.title {
  width: 100%;
  left: 0;
  text-align: center;
  line-height: 1.125;
  bottom: -9px;
  letter-spacing: 1px;
  font-weight: bolder;
}
.title span {
 line-height: 1.125;
}
.title .top {
  display: block;
  font-size: 2.25rem;
}
.title .bottom {
  display: block;
  font-size: 6rem;
}

#coverBG h2 {
  position: absolute;
  top: 0;
  margin-top: 1rem;
  display: flex;
  font-size: 2rem;
  justify-content: center;
  width: 100%;
  color: #fff;
}

/********** dean's letter ***********/

.container#letter h2 {
  margin-top: 0;
  line-height: 1;
}

.container#letter .sig {
  vertical-align: bottom;
}

.container#letter .sig.right-item {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 100%;
}

@media screen and (max-width: 700px) {
  .container#learnmore .learn-more-cta:last-of-type {
    margin-bottom: 1rem !important;
  }
  .container#letter .sig.right-item {
    margin-left: 10%;
    margin-right: 10%;
  }
  .container#letter .sig.right-item p {
    margin-left: 0;
    margin-right: 0;
  }
  .container#letter .sig.right-item .signature-digital {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }
}

.container#letter #letterBox {
  padding: 3rem 10% 0;
}

.container#letter .sig.left img {
  display: block;
  max-width: 325px;
  margin: 2rem 2rem 0 4rem;
}

#sigContainer {
  overflow: auto;
}

/*** End of Dean's Letter ***/

#letter {
  background-color: #f5f5f5;
  border-bottom: 4px solid black;
}

#letterImg {
  width: 100%;
  margin: 0 auto 3rem;
  display: block;
}

#deanSig {
  width: 10rem;
}

.arrow img {
  width: 100%;
  margin-bottom: 3rem;
}

button {
  cursor: pointer;
}

/* Article Image Component */

.article-image-grid-container {
  max-width: calc(927px - 2.7rem);
  padding: 2.7rem;
  margin-bottom: 2.7rem;
}

.article-image-grid-container h3 {
  text-transform: none;
  margin-top: 0;
  margin-bottom: 1.5rem;
}

.article-image-grid-container .desc {
  text-transform: none;
  margin: 1.5rem 0;
}

.article-image-grid-top {
  display: flex;
  flex-direction: row;
  margin-bottom: 1.5rem;
}

.image-grid-caption {
  margin-top: 0.5rem;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  font-size: 1rem;
  line-height: 1.5;
}

.caption-name {
 font-size: 1.125rem;
}

.article-image-grid,
.article-image-grid-top {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1.5rem;
}

.article-image-grid > *,
.article-image-grid-top > * {
  /* padding: 1rem; */
  width: calc(50% - 0.75rem);
  box-sizing: border-box;
  object-fit: cover;
}

.article-image-grid > div img {
  width: 100%;
}

.article-image-grid-top p {
  margin: 0;
}

.profileArticleContainer a {
  color: #fff;
}

.profileArticleContainer .imgContainer {
  padding-top: 0;
}

#profiles h2 {
  display: block;
  width: 100%;
  background-color: white;
}

#profiles .col a {
  margin: 2rem auto 0;
  padding-right: 1.5rem;

  color: #ffffff;
  font-weight: 600;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  font-size: 0.8rem;
  line-height: 1.7;
  text-align: right;
  border-radius: 0;
  border: 0;
  display: inherit;
  text-decoration: none;
  background-image: url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/9/6b72d052-cca3-41e1-b4c4-caf1d4e1e79c.svg);
  background-repeat: no-repeat;
  background-position: right;
  background-size: 1rem;
}

#profiles #wrap {
  background-color: white;
  padding: 0;
}

#giving h2,
#giving2 h2 {
  background-color: transparent;
  margin: 2.3rem auto 1rem;
}

#updates h2 {
  margin-bottom: 1rem;
}

/********** articles ***********/

section {
  width: 100%;
}
article {
  overflow: hidden;
}

.container {
  width: 100%;
  max-width: 56.88rem;
  margin: 0 auto;
  background-color: white;
  display: grid;
}

/* .profileArticle {
 
 width:100%; 
 padding:0;
 margin:1rem 0 0 0;
 position: relative;
 max-width: 100%;
 padding-right:2rem;
 padding-left:0;

 clip-path: polygon(
    0 2rem,
    100% 0,
    100% 100%,
 0 100%) ;
} */

.imgContainer div {
  /* fixes unwanted application of the above to article images */

  padding-bottom: 16px !important;
}

/* .profileArticle.left {
 
 
 clip-path: polygon(
    0 0,
    100% 2rem,
    100% 100%,  
  0 100%  ) ;
 
   background-color:white !important;
} */

/* .profileArticle .copy {
 
 padding:2.7rem;
 display: table-cell;
 
}


.profileArticle.left .copy {
 

 padding:2.7rem;
 
 
} */

.imgContainer {
  width: 20%;
  display: table-cell;
  vertical-align: top;
  padding-top: 5rem;
}

.imgContainer img {
  width: 100%;

  display: block;
  margin: 0;
  justify-content: center;
  align-items: center;
}

.circle {
  height: 212px;
  width: 212px;
  display: flex;
  padding: 16px;
  margin: 0 0 0 -2rem;
  box-sizing: border-box;
  border-radius: 100px;
}

.circleRight {
  margin: 0 -2rem 0 2rem;
}

/* .profileArticle.right .imgContainer img {
 
width:100%;

 display: block;
 margin: 0 auto;
justify-content: center;
align-items: center;
 
} */

.smallImg {
  width: 6rem;
}

.readMore {
  width: 100%;
  background-color: transparent;
  border: 0;
  border-bottom: 5px solid #000;
  margin: 0;
  text-align: left;
  position: absolute;
  bottom: 0;
  left: 0;
  outline: none;
  float: left;
}

.readMore span {
  background-color: #000;
  padding: 0.5rem 2rem 0.25rem;
  font-size: 1.25rem;
  color: #fff;
  margin-left: 2.7rem;
}

.readMore2 {
  margin: 2rem auto 0;
  width: 12rem;
  display: block;
  padding: 0.5rem 2rem;
  color: #333;
  font-weight: 600;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  font-size: 1rem;
  line-height: 1.7;
  text-align: center;
  border-radius: 0;
  background-color: #000;
  border: 0;
  outline: none;
  float: left;
}

.readMore2 span {
  background-color: #000;
  padding: 0.5rem 2rem 0.25rem;
  font-size: 1.25rem;
  color: #fff;
  margin-left: 2.7rem;
}

.RMright {
  text-align: right;
  right: 0;
}

.RMright span {
  margin-right: 2.7rem;
}

.RMdark {
  border-color: #333;
}

.RMdark span {
  background-color: #333;
  color: #fff;
}

.open::before {
  content: "Read More";
}

.close::before {
  content: "Close";
}

/* .expand {
 
 width: 100%;
 padding: 0 3rem 2rem;
 margin:0;
 display:none;
 box-sizing: border-box;
 
 
} */

.expand {
  width: 100%;
  padding: 1.5rem 2.9rem;
  margin: 0;
  max-width: 54rem;
  display: none;
  box-sizing: border-box;
}

/* .expand2 {
 
 width: 100%;
 
padding: 2rem 3rem 2rem;
 display:none;
 box-sizing: border-box;
border-top:3px solid #fff;
 
 
} */

.expand2 {
  width: 100%;

  max-width: 54rem;
  display: none;
  box-sizing: border-box;
}

.expand2 p:first-of-type {
  margin-top: 0;
}
.expandR {
  padding-left: 4.6rem;
}

.expand p {
  margin: 1rem 0;
}

.sm {
  height: 100px;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: white;
  z-index: 1;
}

.articleGridwrapper {
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  grid-gap: 1.5%;
}

.sub-articleGridwrapper {
  display: inline-grid;
  grid-template-columns: 25% 75%;
  grid-gap: 1rem;
  margin: 1rem 0;
}

.articleGridcol img {
  width: 100%;
}

.link-button {
  background: white;
  outline: 3px solid #d25d12;
  color: #000;
  padding: 0.6rem 2rem;
  text-decoration: none;
  font-weight: 600;
  display: inline-block;
}

.link-button:hover {
  background: #dddddd;
  padding: 0.6rem 2rem;
}

.ninety-image {
  display: block;
  margin: 3rem auto 2rem auto;
  text-align: center;
}

.ninety-image img {
  margin-bottom: 1rem;
}

/********** article buttons ***********/

#AlumniArticles,
#scholarshipArticles,
#academicProgramArticles,
#innovationArticles {
  display: none;
}

.btnContainer {
  text-align: center;
}

.sectionButton {
  margin: 2rem auto 0;
  width: 12rem;

  padding: 0.5rem 2rem;
  color: #fff;
  font-weight: 400;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  font-size: 1rem;
  line-height: 1.7;
  text-align: center;
  border-radius: 0;
  background-color: #000;
  border: 0;
}

.previous {
  margin-right: 0.5rem;
}

/********** hero and navigation ***********/

.container#coverBG {
  position: relative;
  height: 39rem;
  display: table;
  border-collapse: separate;
  /* border-spacing: 0 5rem; */
  overflow: hidden; /* keep the pipe character from showing below the section */
}

.container#coverBG h1 {
  /* bottom: 0; */
  right: 1rem;
  position: absolute;
  color: #fff;
  /* line-height: 0.7; */
  margin: 0;
  text-shadow: 0 0 5rem rgba(0, 0, 0, 0.75);
}

nav {
  background-color: rgba(255, 255, 255, 1);
  padding: 1rem;
  width: 12%;
  min-width: 8rem;
  position: absolute;
  z-index: 1;
  top: 0;
}

.header-container {
  display: flex;
  position: relative;
  flex-direction: column;
  max-width: 56.88rem;
  width: 100%;
  margin: 0 auto;
}

nav a {
  font-size: 1rem;
  font-weight: 400;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.5;
  display: inline-block;
  color: #333;
  margin-bottom: 0.5rem;
}

nav img {
  width: 100%;
}

nav a:last-of-type {
  /** margin-bottom:2rem; **/
}

/********** dean's letter ***********/

/*** Commented Out for Engineering Styling ***/

/* .container#letter p {
 
 
}

.container#letter h2 {
 
 margin-top:0;
 
 
}


.container#letter .sig {
 
vertical-align: bottom;
 
}

.container#letter .sig p{
 
margin-top:8rem;
 
}


.container#letter #letterBox  {
 
 
 padding:4rem 5% 0;
 
}

.container#letter .sig img {
 
 display: block;
margin:2rem 3rem;
 
 
}

 #sigContainer {
  

overflow:auto;
  
 }
 
#selectContainer {
 
 text-align: center;
 background-color:#f5f5f5;
 background-image:url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/9/382a296d-93e1-4576-8827-ba42183ab89a.svg);
 
    background-size: 100% auto;
    background-position: center bottom;

 
}


select {
 
 width:60%;
 font-size:1.2rem;
 font-weight:400;
  font-family: "neue-haas-grotesk-display", "sans-serif";
 color:#333;
 border:5px solid #d45d00;
 padding:0.6rem;
 margin:0 auto;
}

#selectIcon {
 
 margin:0 auto;
 height:5rem;
}

#selectIcon img {
 
 display: block;
 margin:1rem auto;
 width:3.2rem;
}
 */

/********** giving by the numbers ***********/

.container#giving,
.container#giving2 {
  background-color: transparent;
  border-bottom: #000 4px solid;
}

.infographicOuter,
.infographicOuter2 {
  height: auto;
  margin: 0;
}

.infographic-intro {
  margin: 0 3rem 1rem 3rem;
  text-align: center;
}

.infographic-intro > :first-child {
  margin-top: 0;
}

.infographic-intro h3 {
  margin-bottom: 0;
}

.infographicInner,
.infographicInner2,
.infographicInner3 {
  margin: 0;
  width: 100%;
  text-align: center;
  /* padding-bottom: 1rem; */
  /* background-image: linear-gradient(to bottom, transparent 42%, white 42%); */
}

.infographicInner2,
.infographicInner3 {
  margin: 0 0 0rem 0;
}

.infographicInner img,
.infographicInner2 img,
.infographicInner3 img {
  display: none;
  max-width: 750px;
  margin: 0 auto;
}

.infographicInner img:nth-child(n + 2),
.infographicInner2
  img:nth-child(n + 2).
  .infographicInner3
  img:nth-child(n + 2) {
  width: auto;
}

#infographicLeft,
#infographicRight,
#infographicLeft2,
#infographicRight2,
#infographicLeft3,
#infographicRight3 {
  position: absolute;
  top: 50%;
  margin: 0 0 -37px 0;
  padding: 0;
  border: 0;
  z-index: 1;
  transform: translateY(-50%);
}

#infographicLeft,
#infographicLeft2,
#infographicLeft3 {
  left: 0;
}

#infographicRight,
#infographicRight2,
#infographicRight3 {
  right: 0;
}

.infographicStandAlone {
  width: 60%;
  margin: 3rem auto 4rem;
}

/********** donor wall ***********/

#video,
#video2,
#infographic2,
#infographic3,
#donors {
  /* border-bottom: 1px solid #efefef; */
}

#video,
#video2 {
  padding-bottom: 4rem;
  border-bottom: #000 4px solid;
}

.container#donors {
  /* padding-top:4rem; */
  border-top: #000 4px solid;
}

.container#donors h4 {
  font-size: 1rem;
  color: #3172ae;
  text-align: left;
  margin: 3rem auto 1rem;
}

.container#donors li {
  font-size: 1rem;
  color: #333;
  font-weight: 500;
  list-style-image: url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/561c7ce6-080d-4151-896e-b1cce2a37d52.svg);
  padding-left: 1rem;
}

.paragraph_indent {
  margin-left: 3.25rem;
  margin-top: 0.5rem;
}

.container#donors img {
  margin: 2rem auto 0;
  display: block;
  width: 100%;
}

.container#video {
}

.container#video h2,
.container#video2 h2 {
}

.iframe-container {
  position: relative;
  padding-top: 51%;
}

.container#video iframe,
.container#video2 iframe {
  margin: 0 auto 2rem;
  display: block;
  width: 90%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: 100%;
}

.container#ninety > div {
  padding: 0 10% 0;
}

.container#ninety {
  padding-bottom: 2rem;
}

.container#ninety h2 {
  margin-top: 4rem;
}

.container#video p,
.container#video2 p {
  margin: 1rem 3rem;
  text-align: center;
}

.container#donors div {
  padding: 0;
  margin: 0 auto;
}

.container#donors div p {
  margin: 1rem 3rem;
}

.articleGridwrapper2 {
  display: inline-grid;
  grid-template-columns: 50% 50%;
  grid-gap: 1.5%;
}

.articleGridwrapper2 .articleGridcol {
  padding-top: 0 !important;
  background-color: #f0f0f0;
  background-image: url("http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/5246a692-1412-473b-8088-7db8d2543444.png");
  background-repeat: no-repeat;
  background-position: bottom;
}

/********** footer ***********/

.container#learnmore .learn-more-cta:last-of-type {
  margin-bottom: 2rem;
}

#connect *:last-child {
  margin-bottom: 0;
}
#connect h3 {
  font-size: 1.33rem;
}

.container#learnmore div {
  padding: 0 10% 4.25rem;
}

.container#learnmore div img {
  padding: 4rem 0 0;
  width: 70%;
}

.container#learnmore p,
.container#learnmore ul {
  color: #fff;
}

.container#learnmore h4,
.container#learnmore h2 {
  color: #fff;
}

.container#learnmore h4:last-of-type {
  margin: 3rem 0 1rem 0;
}

.container#learnmore h4 {
  text-align: left;
  font-weight: 400;
}

/********** triptych ***********/

#profiles h4 {
}

#giving h4 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-weight: 600;
}

.flex-grid {
  display: flex;
  position: relative;
}

.col {
  flex: 1;
  padding: 0;
  clear: both;
  margin: 0 0 0.5rem;
  position: relative;
  font-size: 1rem;
  font-weight: 400;
  font-family: "neue-haas-grotesk-display", "sans-serif";
  line-height: 1.5;
  background-color: white;
}

.colWrap {
  padding: 3rem 2rem;
  margin: 0;
  position: relative;
  background-color: #e9e9e9;
  background-image: url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/9/6db87df6-3206-4017-a86c-87d4d341d21e.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.colWrap p {
  padding: 1rem 2rem;

  background-color: #3172ae;
  color: white;
}

.col h6 {
  margin-top: -3rem;
  padding: 0 2rem 0 2rem;
  line-height: 1.7;
}

.col img {
  width: 100%;
  display: block;
  margin: 0;
}

.colOverlay {
  /*** names ***/

  position: absolute;
  bottom: 0;
}

#tripytchLeft,
#tripytchRight,
#mobileTripytchLeft,
#mobileTripytchRight {
  position: absolute;
  top: 50%;
  margin: -2.083rem 0 0;
  padding: 0;
  border: 0;
  z-index: 4;
}

#tripytchLeft,
#mobileTripytchLeft {
  left: 0;
}

#tripytchRight,
#mobileTripytchRight {
  right: 0;
}

#tripytchLeft img,
#mobileTripytchLeft img,
#tripytchRight img,
#mobileTripytchRight img {
  display: block;
}

#mobileTripytchLeft,
#mobileTripytchRight {
  display: none;
}

.container#giving,
.container#giving2 {
  position: relative;
}

.col {
}

.hidden {
  opacity: 0;
  transition-timing-function: linear, step-end;
}

.longBottom {
  margin-bottom: 0;
}

#SM {
  display: grid;
  grid-template-columns: 20% 80%;
  background-color: #014365;
}

#SM div {
  padding: 2rem !important;
}

#SM div:last-child {
  text-align: right;
  padding-top: 3rem !important;
}

#SM div a:last-child img:last-child {
  width: 90px;
  margin-right: 0;
}

#SM div:last-child img {
  width: 32px;
  margin-right: 0.5rem;
}

/*** Profile Article ***/

.profileArticle {
  width: 100%;
  background-image: url();
  padding: 0;
  background-repeat: no-repeat;
  background-size: 65% auto;
  background-position: left -2rem bottom -6rem;
  display: table;
  margin: 1rem 0 0 0;
  position: relative;
  max-width: 52rem;
  padding-right: 2rem;
  padding-left: 0;
}

.profileArticle.right {
  background-image: url();
  background-position: right -2rem bottom -6rem;
  padding-left: 2rem;
  padding-right: 0;
}

.profileArticle .copy {
  padding: 2.7rem;
  display: table-cell;
}

.profileArticle.right .copy {
  padding: 2.7rem;
}

.profileArticle .imgContainer {
  width: 40%;
  display: table-cell;
  vertical-align: middle;
}

.profileArticle .imgContainer img {
  width: 100%;
  max-width: 400px;
  display: block;
  margin: 0;
}

.profileArticle.right .imgContainer img {
  width: 100%;
  max-width: 400px;
  display: block;
  margin: 0;
}

/*********** MOBILE ************/

@media screen and (max-width: 500px) {

  .learn-more-cta {
    font-size: 5vw;
  }
  .link-button {
    font-size: 0.85rem;
    padding: 0.25rem 1rem;
  }
  .container.top-image img:first-child {
    width: 60%;
  }
  .container.top-image img:nth-child(2) {
    width: 23%;
  }

  .container#letter .sig.left img {
    margin: 2rem 2rem 0 2rem;
  }

  #connect h3 {
    font-size: 1rem;
  }
}

@media screen and (max-width: 800px) {
  .article-image-grid-top {
    flex-direction: column;
  }
  .article-image-grid-top > * {
    /* padding: 1rem; */
    width: 100%;
  }
  #coverBG {
    background: linear-gradient(
          0deg,
          rgba(0, 0, 0, 1) 22%,
          rgba(0, 0, 0, 0) 50%
        )
        bottom,
      url(https://image.e.tufts.edu/lib/fe9e13727664067f74/m/1/ba62eaaa-ebc1-43fe-bf1d-edcca63e03cf.jpg)
        bottom;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 25% 0;
  }
}

@media screen and (max-width: 700px) {

.container#learnmore div.social-icons {
    padding: 1rem 0 0 0;
  }

  .fletcher-footer-logo {
    padding: 1.5rem 1rem 0 0 !important;
  }

  .container#learnmore div.footer-content {
    padding: 0 2rem 2.125rem;
  }

  .ninety-image img {
    width: 60vw;
  }
  .title {
    bottom: -2vw;
  }
  .title .top {
    font-size: 5.625vw;
  }
  .title .bottom {
    font-size: 15vw;
  }

  .container#learnmore div img {
    width: 100%;
  }

  .set2 .profileArticle.right {
    flex-direction: column;
  }

  .set2 .profileArticle.right .imgContainer {
    order: 2;
  }

  .profileArticle .copy,
  .profileArticle.right .copy {
    order: 1;
  }

  .profileArticle {
    display: block; /*** support for older phones ***/
    display: inline-grid;
  }

  .profileArticle .imgContainer {
    display: block;
    margin: 2rem auto 3rem auto;
    width: 75%;
    order: 2;
  }

  .profileArticle .copy,
  .profileArticle.right .copy {
    order: 1;

    padding: 1rem 2rem 1rem;
  }

  .profileArticle .imgContainer {
    width: 40%;
  }

  .article-image-grid-container {
    padding: 1rem;
  }

  .article-image-grid-container h3 {
    margin-bottom: 1rem;
  }

  .article-image-grid-container .desc {
    text-transform: none;
    margin: 1rem 0;
  }

  .article-image-grid-top {
    margin-bottom: 0.75rem;
  }

  .article-image-grid,
  .article-image-grid-top {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.75rem;
  }

  .article-image-grid > * {
    /* padding: 1rem; */
    width: calc(100%);
    box-sizing: border-box;
  }

  .image-grid-caption {
    font-size: 0.85rem;
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
  }

  .caption-name {
   font-size: .98rem;
  }

  body {
    width: 100%;
    background-color: #fff;
  }

  article,
  section {
    width: 100%;
  }

  .articleGridwrapper2 {
    display: block;
  }

  .articleGridcol {
  }

  .articleGridwrapper {
    grid-template-columns: 50% 50%;
  }

  .container#donors div:first-child {
    margin-bottom: 2rem;
  }

  .profileArticle {
    display: block; /*** support for older phones ***/
    display: inline-grid;
  }

  .profileArticle .imgContainer {
    display: block;
    margin: 2rem auto 3rem auto;
    width: 75%;
    order: 2;
  }

  .profileArticle .copy,
  .profileArticle.right .copy {
    padding: 1rem 2rem 1rem;
  }

  .flex-grid {
    display: block;
  }

  .container#coverBG {
    height: 19rem;
    background-position: center;
  }

  h1 {
    font-size: 2rem;
  }

  #coverBG h2 {
    font-size: 1.2rem;
  }

  .sectionButton {
    margin: 0.25rem auto;
  }
  .previous {
    margin-right: 0;
  }

  .col div {
    margin: 0 auto 1rem;
  }

  .colWrap {
    background-size: cover;
  }

  .subhead {
    margin: 0.5rem 2rem 2rem 2rem;
  }

  .infographicOuter {
    /*height:5rem;*/
  }

  .infographicOuter2 {
    margin-bottom: 3rem;
  }

  .infographicInner,
  .infographicInner2,
  .infographicInner3 {
    margin: 1rem auto 0;
    width: 80%;
    padding-bottom: 2rem;
  }

  .infographicInner img,
  .infographicInner2 img,
  .infographicInner3 img {
    max-width: 90% !important;
  }

  #sigContainer {
    display: flex;
    flex-flow: column-reverse;
  }

  .container#letter .sig p {
    margin: 0 2rem 1rem;
  }

  .container#letter .sig img {
    margin: 2rem auto;
  }

  .container#donors h4 {
    padding-top: 2.5rem;
    margin-top: 8rem;
  }

  blockquote {
    width: 80%;
    padding: 1rem;
    font-size: 1rem;
    text-align: left;
    margin: 4rem auto 2rem;
  }

  .col p {
    padding-bottom: 2rem;
  }

  #profiles .col a {
    font-size: 1.1rem;
  }

  .longBottom {
    margin-bottom: 3rem;
  }

  .quoteBG {
    text-align: center;
  }

  .quoteBG img {
    max-width: 50%;
  }

  h2 {
    font-size: 1.8rem;
    margin: 4rem 0.25rem 0;
  }

  h3 {
    font-size: 1.5rem;
    line-height: 1.4;
  }

  .container#letter .sig p {
    margin-top: 1rem;
  }

  .sig img {
    width: 80%;
  }

  .readMore span {
    font-size: 1rem;
    display: block;
    width: 6rem;
    text-align: center;
    padding: 0.5rem;
    margin-bottom: -2px;
  }

  .readMore,
  .readMore2 {
    margin: 2rem auto 0rem;
    padding-bottom: 0;
  }

  .expand {
    padding-left: 2rem;
  }

  .expandR {
    padding-left: 2.2rem;
  }

  #SM {
    grid-template-columns: 100%;
  }

  #SM div:last-child {
    text-align: left;
    padding-top: 0 !important;
  }

  .container#video {
    padding-top: 0;
  }

  #profiles h2 {
    width: auto;
  }

  .title {
    position: initial;
    margin: 2rem auto 0;
    display: block;
  }

  nav {
    width: 100%;
    box-sizing: border-box;
    padding: 2rem;
    position: relative;
    order: 2;
  }

  select {
    width: 80%;
  }

  .circle {
    margin: 0 auto;
  }

  #tripytchLeft,
  #tripytchRight {
    margin: 0;
  }

  .profileArticle.grayBG2 {
    padding: 3rem 0 0;
  }
}

@media screen and (max-width: 1024px) and (orientation: landscape) {
  .infographicInner img,
  .infographicInner2 img,
  .infographicInner3 img {
    margin: 0 auto;
  }

  .infographicOuter {
    height: 9rem;
  }

  .infographicInner,
  .infographicInner2,
  .infographicInner3 {
    margin: 1rem auto 0;
  }

  .container#donors {
    margin-top: 0;
  }

  .container#giving h4 {
    margin: 1rem 0.5rem 0;
    font-weight: 600;
  }

  #donors div h4:first-of-type {
    padding-top: 6rem;
  }

  .articleGridcol h4 {
    padding-top: 2rem !important;
  }

  .container#donors h2 {
    margin: 4rem 0.5rem 0rem;
  }

  .col img {
    width: 33%;
    float: left;
    clear: both;
    margin-right: 1rem;
  }

  .col img div {
    background-color: black;
  }

  .col p {
    padding: 2rem 1rem;
  }

  .col h6 {
    padding-top: 1rem;
    margin-top: 0;
  }

  .profileArticle .imgContainer {
    width: 40%;
  }

  .previous {
    margin-right: 0.5rem;
  }

  .articleGridwrapper {
    grid-template-columns: 25% 25% 25% 25%;
  }

  #SM {
    grid-template-columns: 20% 80%;
  }

  #SM div:last-child {
    text-align: right;
    padding-top: 3rem !important;
  }
}