@charset "UTF-8";




html {
 
 font-size:18px;
 background-color:black;
 color:#333;
 margin:0;
 font-family: "proxima-nova", sans-serif;
}




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

h1 {
 
 font-size:3rem;
 font-weight:600;
 font-family: "proxima-nova", sans-serif;
 line-height:1.5;
}

h2 {
 
 font-size:2.25rem;
 font-weight:600;
 font-family: "proxima-nova", sans-serif;
 line-height:1.5;
 text-align: center;
 text-transform: uppercase;
 margin-bottom: 0;
 margin-top:8rem;
 
 
}


h3 {
 
 
 font-size:2.25rem;
 font-weight:600;
 font-family: "proxima-nova", sans-serif;
 line-height:1.1;
 text-transform: uppercase;
 color:#194872 !important;
 
}

h4 {
 

 font-size:1.33rem;
 font-weight:600;
 font-family: "proxima-nova", sans-serif;
 line-height:1.5;
 text-align:center;
 margin:0.25rem auto 2rem 0;
 text-transform: uppercase;
 
 
}

h5 {
 
 
 font-size:1.25rem;
 font-weight:600;
 font-family: "proxima-nova", sans-serif;
 line-height:1.5;
 margin:0.25rem 2.7rem -0.5rem;


}




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

.small {
 
 font-size:0.7rem;
}

.subhead {
 
 
  font-size:1.2rem;
 font-weight:400;
 font-family: "proxima-nova", sans-serif;
 line-height:1.5;
 text-align:center;
 margin:0 auto 2rem auto;
 text-transform: uppercase;
 
}

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

p , ul {
 
 font-size:1rem;
 font-weight:400;
 font-family: "proxima-nova", sans-serif;
 line-height:1.7;
 
}

ul {
 
 margin:0;
}

a {
 
 color:#fff;
}

blockquote {
 
 
 font-size:1.25rem;
 font-weight:400;
 font-family: "proxima-nova", sans-serif;
 line-height:1.8;
 padding:8% 8% 0 8%;
 text-transform: uppercase;
 margin:7.5rem auto;
 width:40%;
 background-color:#222;
 color:white;
 position: relative;
 z-index: 1;
 
 
 
}




blockquote::before {
 
 content:'\201C';
 font-size:12rem;
 opacity: 0.1;
 position: absolute;
 top:-4rem;
 left:1.5rem;
 font-weight: 800;
 z-index: -1; /**** keep quote mark below quote ****/
 
 
 
}

blockquote::after {
 
 content: '\201D';
 font-size:12rem;
 opacity: 0.1;
 position: absolute;
 bottom:-8.5rem;
 right:1.5rem;
 font-weight: 800;
 z-index: -1; /**** keep quote mark below quote ****/
 
 
}

blockquote footer {
 
 
 font-size:0.8rem;
 margin:2rem 0 4rem 0;
 float:right;
 text-transform: none;
 
 
}







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;
 
}

.clearfix {
  overflow: auto;
}

.full {
 
 width:100%;
}

.half {
 
 width:50% !important;
}

.quarter {
 
 width:25%;
}



.bottomMargin2rem {
 
 margin-bottom: 2rem;
}


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


.blue1 {
 
 color:#1fb4ff;
}

.blue2 {
 
 color:#3172ae;
}

.blue3 {
 
 color:#3e8ede;
}

.red1 { 
 
 color:#FF8F94;

}

.green1 { 
 
 color:#00EDFA;

}

.purple1 { 
 
 color:#D691FF;

}



.white {
 
 /* color:white; */
}

.blueBG {
 
 background-color:#004365;
 
}


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

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

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


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

.yellowBG {
 
 background-color:#F1C400;

}

.purpleBG {
 
 background-color:#500778;

}

.lightBG {
 
 background-color:#e5f2f3;
}



#quoteBG {
 
 background-image: url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/9/ea515cc3-b16f-4430-b8e6-36369174564e.jpg);
 background-repeat: no-repeat;
 background-size: cover;
 border-top:10px solid white;
 position:relative;
 
 
}

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

#coverBG{
 
 background-image: url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/9/026873f4-3318-49fe-906c-74991898c350.jpg);
 background-repeat: no-repeat;
 background-size: cover;
 
}

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

#letterBG {
 
 
 background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
 background-color:white;
}




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


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


 
}

.wrap {
 
  padding: 0 2.7rem 1.5rem;
  background-color: white;
}



#profiles{
 
 


}

#giving h2 {

 background-color:transparent;
 margin-bottom:0;
 
}



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

section {
 
 width:100%;
 
}
article {

overflow:auto;
 margin-top:1.5rem;
}


 article + article {
  display:none

}



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

 
}

.profileArticle {
 
 width:100%;
 background-image:url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/310315ea-6b6a-481a-b66e-4843ea97d291.png); 
 padding:0;
 background-repeat: no-repeat;
 background-position:bottom;
 background-size:contain;
 display: table;
 margin:1rem 0 0 0;
 position: relative;
 max-width: 52rem;
 padding-right:2rem;
 padding-left:0;
 
background: rgb(59,147,228);
background: -moz-linear-gradient(90deg, rgba(59,147,228,1) 0%, rgba(103,240,240,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(59,147,228,1) 0%, rgba(103,240,240,1) 100%);
background: linear-gradient(90deg, rgba(59,147,228,1) 0%, rgba(103,240,240,1) 100%);


}






.profileArticle.right {
 
 
 background-image:url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/9045850c-8873-4fc7-b675-ce7a88ad3e46.png); 
  padding-right:0;
 padding-left:2rem;
 
 
background: rgb(59,147,228);
background: -moz-linear-gradient(-90deg, rgba(59,147,228,1) 0%, rgba(103,240,240,1) 100%);
background: -webkit-linear-gradient(-90deg, rgba(59,147,228,1) 0%, rgba(103,240,240,1) 100%);
background: linear-gradient(-90deg, rgba(59,147,228,1) 0%, rgba(103,240,240,1) 100%);
 

}

.darkHex {
 
 /*
 background-image:url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/7e1e3f45-3f89-44d8-9107-255d32d9dd2b.png) !important; 
 */
}

.darkHexRight {
 /*
 background-image:url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/7a5d06d1-e927-41e3-94f3-f6d52d41c764.png) !important;
 */
 
}

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


.profileArticle.right .copy {
 

 padding:2.7rem;
 
 
}

.profileArticle .imgContainer {
 
 
 width:40%;
 display: table-cell;
 vertical-align: middle;
 /* background-image:url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/9/75c96973-499d-4238-a7d2-f6be6abb647b.svg); */
background-repeat: no-repeat;
 background-position: center;
 background-size:contain;
 
 
 
}

.dark {
 
 
/*
   background-image:url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/a8608b2b-d632-4e29-a09b-68c2da60f932.svg) !important;

 */
 
}


.transparent {
 
 /*
   background-image:url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/0dba0009-7c02-4f1e-9576-75e5f9155462.svg) !important;
 */
}


.noBG {
 
   background-image: none !important;
 
}



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

-webkit-mask-image: url("https://multimedia.web.tufts.edu/salesforce/masks/circle_mask.png");



  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position:center;
-webkit-mask-size:95%;
 

 
}

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

 
}


.noMask {
 
 -webkit-mask-image:none !important;
}

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



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

 
}


.readMore2 {
 
margin:2rem auto;
 width:12rem;
 display: block;
 padding:0.5rem 2rem;
 color:#fff;
 font-weight:400;
 font-family: "proxima-nova", sans-serif;
 font-size:1rem;
  line-height:1.7;
 text-align: center;
 border-radius: 0;
 background-color:#333;
 border:0;
 outline:none;
 
}



.readMore2 span {
  

 
}



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

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

 
}


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

.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%;
}




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

.btnContainer {
 
 text-align: center;
}

.sectionButton {
 
 margin:2rem auto 0;
 width:12rem;
 
 padding:0.5rem 2rem;
 color:#fff;
 font-weight:400;
 font-family: "proxima-nova", sans-serif;
 font-size:1rem;
  line-height:1.7;
 text-align: center;
 border-radius: 0;
 background-color:#333;
 border:0;
 
 
}

.previous{
 

 margin-right:0.5rem;
 
}



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

.container#coverBG{
 
 position: relative;
 height:29.7rem; /* 535px */
 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,0.85);
padding:2rem;
/* display:table-cell; */
width:20%;
min-width:11rem;

}



nav a {
 
 font-size:1rem;
 font-weight:400;
 font-family: "proxima-nova", sans-serif;
 line-height:1.5;
 display:inline-block;
 margin-top:0.8rem;
 color:#333;
}

nav a:last-of-type {
 
 margin-bottom:2.5rem;
}



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





.container#letterBG p {
 
 
}

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


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

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


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

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

 #sigContainer {
  

overflow:auto;
  
 }
 




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

.container#giving {
 
 background-color: transparent;
 
}

.infographicOuter {
 
 height:16rem;
 margin:2rem 0 0 0;
 
}

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

.infographicInner img {
 
 
 display: none;
 
 
}

.infographicInner img { 
 
 width:80%;
 
}


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




#infographicLeft, #infographicRight {
 
 position: absolute;
bottom:0;
 margin:0 0 -2rem 0;
 padding:0;
 border:0;
 z-index: 1;
 
 
}


#infographicLeft {
 
 left:0;
 
}

#infographicRight {
 
 right:0;
 
}



/********** donors ***********/


  
    
.container#donors {
 
 padding-top: 390.844px; /*** set initial value ***/
}


.container#donors h2 {
 
 margin:3rem auto;

}

.container#donors h4, .container#facilities h4:not(:first-of-type), .articleGridcol h4 {
 
font-size:1rem;
color:#3172ae;
text-align: left;
margin:3rem auto 1rem;

}

.container#donors li, .container#facilities li {
 
font-size:1rem;
color:#333;
font-weight: 500;
list-style-type: circle;
padding-left:1rem;


 
}



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


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

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

.container#BW div {
 
 padding:0 3rem 2rem;
 margin:0.5rem auto;
 
}


.container#facilities div {
 
 padding:0 3rem 2rem;
 margin:0 auto;
}


 .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 div:first-child {
 
 padding:3rem 10% 4.25rem;
 margin-top:5rem;
 
}

.footerImg {
 
 padding:8rem 0 0;

 
}

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

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

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

.container#learnmore h4 {

 text-align: left;
 font-weight:400;
 
}

.container#learnmore h2 {

 margin-top:2rem;
 
}




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

#profiles h4 {
 
 
}

#giving h4 {

margin-top:0;
 margin-bottom:0.5rem;
font-weight:600;
}


.container#profiles {
 
 
 background-image: url(http://image.e.tufts.edu/lib/fe9e13727664067f74/m/6/77ea783d-1065-4ab8-9524-b6bd2eb2143b.jpg);
 background-repeat: no-repeat;
 background-size: cover;
 background-position: 0;
}


.flex-grid {
 
  display: flex;
  position: relative;
  padding:2rem 2rem 0;
  margin-bottom:4rem;
  
}

.col {
  flex: 1;
  padding:0; 
  clear:both;
  margin:0.5rem 0.26rem;
  position: relative;
  font-size:1rem;
  font-weight:400;
  font-family: "proxima-nova", sans-serif;
  line-height:1.5;
  background-color:#f0f0f0;

  
}

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

.col p:last-of-type {
 
 margin-bottom:1rem;
 
}


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



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

.col div{  /*** names ***/
 
 
 margin:-3rem auto 1rem;
 position: absolute;
 top:0;
 text-align: center;
 width:100%;
 font-size:1.3rem;
 font-weight:600;
 
 
 
  
}

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

#tripytchLeft, #mobileTripytchLeft {
 
 left:0;
 
}

#tripytchRight,  #mobileTripytchRight {
 
 right:0;
 
}

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


#mobileTripytchLeft, #mobileTripytchRight {
 
 display:none;
 
}

.container#giving {
 
 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;
 
}



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



@media screen and (max-device-width: 700px)  {
 
 .container {
  
  display: block;
 }
 
 body {
  
  width:100%;
  background-color:#fff;
  
 }
 
 article, section {
  
 width:100%;
  
 }
 
 .articleGridwrapper2 {
  
 display: block;

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

 
 
 .container#donors div, .container#facilities div {
  
  padding:5%;
 }
 

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

 .profileArticle .imgContainer {


display:block;
  margin:2rem auto;
  width:75%;
    order: 2;
}
 

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

  padding:1rem 2rem 1rem
 }
 


 
 #coverBG {
  
  background-position-x:center;
 }

 h1 { 
  font-size:2rem
 }
 
 #coverBG h2 {
  
  font-size:1.2rem
 }
 
 .sectionButton {
  
  margin:0.25rem auto;
 }
 .previous {
  
  margin-right:0;
 }




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

.infographicOuter {

height:5rem;

}
 
.infographicInner {

margin:1rem auto 0;
width:80%;
 
}
 
 .infographicInner img:first-child {
  
  max-width:70% !important;
 }
 
 .infographicInner img {
  
  max-width:90% !important;
 }

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

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

blockquote {

width:80%;
padding:5rem 1.5rem 1rem;

}

.col p {

padding-bottom:3rem;

}
 
.longBottom {
 
 margin-bottom:3rem;

 }
 
 #quoteBG {
  text-align: center
 }
 #quoteBG img {
  
  max-width: 70%;
 }
 
  h2 {
 
 font-size:1.8rem;
 margin:3rem 0.25rem 0;
 
}
 
 h3 {
  
  font-size:1.5rem;
  line-height:1.4;
  
 }
 
 .container#letterBG .sig p {
  
  margin-top:1rem;
 }
 
 .sig img {
  
  width:80%;
 }
 
 .readMore span {
  
  font-size:1rem;
  display:block;
  width:6rem;
  text-align:center;
  padding:0.5rem;
 }
 
 .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#giving {
  
  
 }
 
  nav {
  
  margin-top:2rem;
 }
 
 .articleGridwrapper2 .articleGridcol {
  
  padding-top:1rem !important;
 }
 
 
 .container#facilities h4:not(:first-of-type), .articleGridcol h4 {
 

margin:1.5rem auto 1rem;

}
 
 
.flex-grid {
  
  flex-direction:column;
 }
 
}



@media screen and (max-device-width: 1024px) and (orientation : landscape)  {


 
 
.infographicInner img {

 margin:0 auto;

 
}

.infographicOuter {

height:9rem;

}
 
.infographicInner {

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:6rem 0.5rem 3rem;

}

.col img {

 width:33%;
 float:left;
clear:both;
margin-right:1rem;

}

.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;
 
 }


 

}