h2.reed-eliot-society {
    width: 600px;
    height: 158px;
    background-image: url("https://www.reed.edu/givingtoreed/assets/images/eliot-society.png");
    background-repeat: no-repeat;
    background-size: 600px 158px;
    margin: 0 0 40px 0;
    text-indent: -9999px;
}
h2.reed-parent-society {
    width: 600px;
    height: 173px;
    background-image: url("https://www.reed.edu/givingtoreed/assets/images/reed-parent-family-giving-society.png");
    background-repeat: no-repeat;
    background-size: 600px 173px;
    margin: 0 0 40px 0;
    text-indent: -9999px;
}
.donate-wrapper {
    margin: 40px 0;
}
.donate-grid {
    display:grid;
    grid-gap:40px 25px;
    grid-template-columns: 1fr 3fr;
    margin-bottom: 0px;
    margin-top:60px;
}
.donate-grid:last-child {
    border-bottom:none;
}

.donate-grid img {
    min-width:100%;
}
.donate-grid p {}
.donate-grid h4 {
    margin-top:0;
}
.donate-wrapper h3 {
    color: #888;
    font-size: 1.8em;
    border-top: solid 4px #ddd;
    border-bottom: none;
    padding-top: 14px;
    padding-bottom: 0;
    margin-top: 90px;
    margin-bottom: 5px;
}
.donate-buttons {
    display:flex;
    gap: 6%;
    margin-top: 25px;
    justify-content: left;
}

.donate-buttons a.callout {
    padding: 6px 10px 7px;
    width: 25%;
    margin: 5px 0 6px 0;
}

.contact {
    display:grid;
    grid-template-areas: "img description";
    grid-template-columns: 1fr 5fr;
    grid-gap: 0px;
    margin-top:30px;
}
.contact img {
    max-width:100px;
    grid-area: img;
    grid-row-start: 1;
    grid-row-end: 5;
    padding-right:17px;
}
.contact div {
    grid-area:description;
}
.contact div h4 {
    margin:0;
    padding:0 0 7px 0;
    text-decoration: none;
    border: none;
    font-size: 1.3em;
    line-height: 1em;
    font-weight:normal;
}
.contact div p {
    margin:0;
    padding:0;
    font-size: 0.9em;
}
.contact div p:nth-child(2) {
     text-transform: uppercase;
     letter-spacing: 1px;
     font-weight:normal;
     line-height:1.3em;
     padding-bottom:5px;
}

 
.two-column-list  {
   -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
    -webkit-column-gap: 10px; /* Chrome, Safari, Opera */
    -moz-column-gap: 10px; /* Firefox */
    column-gap: 10px;
    -webkit-column-rule: none; /* Chrome, Safari, Opera */
    -moz-column-rule: none; /* Firefox */
    column-rule: none;
}

.two-column-list ul {
    list-style-type:none;
    padding:0;
    margin:0 0 20px 0;
}

.callout#example {
width: 79%;
background-color: #FFF793;
border: 1px solid #BBB;
padding: 0px 25px 5px 25px;
margin: 30px auto;
}


.callout#example-small {
width: 45%;
background-color: #FFF793;
border: 1px solid #BBB;
padding: 20px 25px 5px 25px;
margin: 30px auto;
}

ul.staff-list {
    list-style-type:none;
    margin:0;
	padding:0;
}
ul.staff-list li {
	overflow:auto;
	margin-left:0;
	padding-left:0;
}
ul.staff-list img {
	float:left;
	padding:0 10px 15px 0;
}

/* CALLOUT ****/
ul.image-list {
    list-style-type:none;
    /*-webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 15px;
    column-gap: 15px;
    -moz-column-gap: 15px; */
    padding:0;
}

ul.image-list img {
    display:block;
    padding-bottom:5px;
}

ul.image-list li {
    float:left;
    width:240px;
    padding:0 0 15px 0;
    margin:0;
}

ul.image-list li:nth-child(odd) {
    padding-right:10px;
}

ul.image-list li strong {
    display:block;
}

ul.callout-list {
    list-style-type:none;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 15px;
    column-gap: 15px;
    -moz-column-gap: 15px;
    padding:0;
}

ul.callout-list li {
    margin-top:0;
}

p.callout, a.callout {
    background-color:#fff;
    border: 1px solid #bbb;
    padding:8px 18px 9px 18px;
    font-size:13px;
    line-height:1.4em;
    text-align:center;
    color:#a70e16;
    display:block;
    margin: 20px auto 40px auto;
    width: 80%;
    font-weight:bold;
    /*border-radius:4px;*/
    text-transform: uppercase;
    letter-spacing: .02em;
}

ul.callout-list a.callout {
    background-color:#fff;
    border: 1px solid #bbb;
    padding:8px 18px 9px 18px;
    font-size:12px;
    line-height:1.4em;
    text-align:center;
    color:#a70e16;
    display:inline-block;
    margin: 0px auto 15px auto;
    width: 85%;
    font-weight:bold;
    /*border-radius:4px;*/
    text-transform: uppercase;
    letter-spacing: .02em;
}

a.callout:hover, li a.callout:hover {
    background-color:#a70e16;
    border-color:#a70e16;
    color:#fff;
    text-decoration:none;
    /*border: 1px solid #333;
    border-bottom-width:1px;
    border-right-width:1px;
    box-shadow: 1px 1px 0px #bbb;*/
}


p.callout span {
    display:block;
    padding:4px 0 0 8px;
    color:#000;
    font-size:.9em;
}


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

    h2.reed-eliot-society {
        width: 400px;
        height: 105px;
        background-size: 400px 105px;
    }
    .donate-grid {
        grid-gap:25px;
        grid-template-columns: 1fr;
        padding-bottom:0;
    }
    .donate-grid div {
        padding-bottom:25px;
    }
    .donate-buttons {
        display:block;
}
    .donate-buttons a.callout {
        padding: 8px 10px 9px;
        width: 55%;
        margin: 5px auto 20px auto;
    }

    ul.callout-list {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
        -webkit-column-gap: 0;
        column-gap: 0;
        -moz-column-gap: 0;
    }
    
    ul.callout-list a.callout {
        display:block;
        width:80%;
    }
}
   


.icon-list {
    width:100%;
    text-align:center;
    font-weight:normal;
    display:table;
    margin:30px 0;
}

.icon-list ul {
    list-style-type:none;
    display:table-row;
    padding:15px 0;
    margin:0;
    width:100%;
}

.icon-list li {
    width:149px;
    height:95px;
    padding:10px;
    margin:15px 0 20px 0;
    display:table-cell;
    text-align:center;
    vertical-align:top;
    text-transform:uppercase;
    letter-spacing:1px;
    line-height:15px;
    font-size:13px;
}

.icon-list ul.two-icons li {
    width:180px;
}

.icon-list ul li:first-child {
    padding-left:0;
}

.icon-list ul li:last-child {
    padding-right:0;
    border-right:none;
}

.icon-list li strong, .icon-list li span {
    display:block;
    padding:0 0 10px 0;
    text-align:center;
}

.icon-list li img {
    display:block;
    padding-bottom:12px;
    margin: 0 auto;
}

.icon-list strong, .icon-list span {
    text-transform:uppercase;
    padding: 5px 15px 5px 0;
}

.icon-list strong {
    font-weight:normal;
    font-size:26px;
    line-height:23px;
    margin:0;
}

.icon-list span {
    letter-spacing:1px;
    margin:0;
    line-height:15px;
}

.icon-list a {
    text-decoration: none;
}

.icon-list p {
    border-bottom:1px dotted #000;
    margin-bottom:10px;
    padding-bottom:10px;
}

.icon-list p.last {
    border-bottom:none;
    padding-bottom:0;
}




.callout#text-only {
    display:block;
}

.callout#text-only p {
    text-align:center;
    font-size:12px;
    margin:7px 0;
}

.callout#text-only p a {
    /*font-weight:normal;*/
}

.callout#text-only p.short {
    /* text-align:center;
    text-transform:uppercase;
    letter-spacing:1px;
    line-height:15px; */
}

.callout#text-only p.short-series {
    /* text-align:center;
    text-transform:uppercase;
    letter-spacing:1px;
    line-height:15px; */
    padding-bottom:10px;
    border-bottom:dotted 1px #000;
}

.callout#text-only ul.short-series {
    list-style-type:none;
    margin-left:0;
    padding-left:0;
    text-align:center;
}

.callout#text-only ul.short-series li {
    margin-left:0;
}
    
.callout#text-only .paragraph {
    margin:15px auto;
}

.callout#text-only p.paragraph {
    margin:10px 0;
}

.callout#text-only p.second-paragraph {
    padding-top:10px;
    border-top:dotted 1px #000;
}

.callout#quote {
    font-weight:normal;
    margin:0 0 15px 10px;
}

.callout#quote {
    margin:10px 0;
}

.callout#quote span {
    display:block;
    padding-left:12px;
    color:#000;
}

.callout#profile {
    padding:15px 18px;
    border:solid 1px #ccc;
    margin-bottom:20px;
}

.callout#profile p {}

.callout#profile h3 {
    border-bottom:none;
    color:#a70e16;
    margin:0 0 10px 0;
    font-size:13px;
    font-weight:bold;
    line-height:1.4em;
    text-transform:uppercase;
    letter-spacing: .02em;
}

.callout#profile img {
    padding:0;
    width:100%;
    height:100%;
}

p.quote {
    padding:10px 29px 10px 30px;
    font-size:1.5em;
    line-height:1.8em;
    text-align:left;
    color:#328085;
    text-indent: -8px;
}

p.quote strong {
    font-size:.9em;
    line-height:1.6em;
    font-weight:normal;
    color:#328085;
}

p.quote span {
    display:block;
    color:#000;
    font-size:.65em;
    line-height:2.5;
    text-indent:1px;
}

dl.callout, dl.callout#align-left {
    width:79%;
    background-color:#fff793;
    border:1px solid #bbb;
    padding:30px 20px 40px 20px;
    margin:20px auto;
    text-align:center;
}

dl.callout#align-left {
    text-align:left;
}

dl.callout dt, dl.callout#align-left dt {
    color:#a70e16;
    font-weight:bold;
    font-size:16px;
    padding-bottom:2px;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-align:center;
    margin-top:25px;
}
    

dl.callout dd, dl.callout#align-left dd {
    color:#000;
    font-weight:normal;
    margin:0px;
    padding-left:0;
    font-size:1em;
    padding-top:5px;
}

dl.callout#align-left dd {
    padding-left:0px;
    margin:0 0 10px 0;
}

dl.callout dd:last-child {
    margin-bottom:10px;
} 

dl.callout dd ul {
    -webkit-column-count: 4; /* Chrome, Safari, Opera */
    -moz-column-count: 4; /* Firefox */
    column-count: 4;
    -webkit-column-gap: 0px; /* Chrome, Safari, Opera */
    -moz-column-gap: 0px; /* Firefox */
    column-gap: 0px;
    list-style-type:none;
    margin:10px auto;
    padding:0px 0px 0px 20px;
}

dl.callout dd ul li {
    text-align:left;
}

.callout#app-status {
    margin:20px 0;
    text-align:center;
    display:table;
    width:100%;
    border-spacing:10px;
    border-collapse:separate;
}

.callout#app-status ul {
    list-style-type:none;
    width:100%;
    padding:0;
    margin:0 auto;
    display:table-row;
    border:none;
}

.callout#app-status li {
    display:table-cell;
    width:122px;
    height:65px;
    background-color:#328085;
    vertical-align:middle;
    text-align:center;
    padding:15px;
    margin:0 10px 0 0;
}

.callout#app-status li a {    
    color:#fff;
    font-weight:bold;
    font-size:13px;
    line-height:1.2;
    letter-spacing:.04em;
    /*border:#333;
    border-radius:3px;*/
    text-transform:uppercase;
}

.callout#app-status ul li.transfer {
    background-color:#005267;
}

.callout#app-status ul li.special {
    background-color:#07883d;
    margin-right:0;
}

.callout#app-status ul li:hover, .callout#app-status ul li a:hover, .callout#app-status ul li.special:hover, .callout#app-status ul li.transfer:hover {
    background-color:#a70e16;
    color:#fff;
    text-decoration:none;
}


p.profile-caption {
    font-size:10px;
}

p.quote {
    line-height: 1.6em;
    color: #5e0501;
    padding: 10px 0;
    font-size: 1.5em;
    line-height: 1.8em;
    text-align: left;
}

h5.profile-message {
    font-size:15px;
    font-weight:normal;
    margin:0 0 15px 0;
}



.thousands-button {
    text-transform:uppercase;
    font-weight:normal;
    font-family:Arial, Helvetica, sans-serif;
    color:#a70d16;
    font-size:14px;
    letter-spacing:1px;
    text-align:center;
    line-height:15px;
    margin-bottom:10px;
    padding:0 0 0 0;
}

.thousands-button span {
    display:block;
    font-size:45px;
    line-height:42px;
    font-weight:bold;
    letter-spacing:3px;
    padding-left:3px;
}

ul.nostyle {list-style:none; padding:0 0 8px 0;}
ul.nostyle li {padding:0 0 1px 0; margin:0;}

.SubheadCaps {
    
    font-size: .90em;
    line-height: 110%;
    color: #745D51;
    font-weight: bold;
    text-transform: uppercase;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #745d51}
.Caption {
font-size: .95em;
color: #993300;
line-height: 110%;
}

.small {
font-size: .95em;
line-height: 110%;
margin: 10px 0 20px 0;
}

#siteNav p {
line-height: 110%;
margin:0; padding:0
}

#siteNav ul ul {
margin: 0;
padding: 0 0 0 15px;
}

#siteNav img {  
margin-bottom: 0px;
margin-top: 10px;
display:inline
}

.PageOn{background-image: url(https://www.reed.edu/givingtoreed/assets/images/info-icon.gif);
background-repeat: no-repeat;
background-position: top left;
padding: 0 0 0 15px;
}

#PageOnNav{
background-image: url(https://www.reed.edu/givingtoreed/assets/images/info-icon.gif);
background-repeat: no-repeat;
background-position: top left;
padding: 0 0 0 15px;
}


/* LIGHTBOX BEGINS HERE */

#lightbox{
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 100;
    text-align: center;
    line-height: 0;
    }

#lightbox a img{ border: none; }

#outerImageContainer{
    position: relative;
    background-color: #fff;
    width: 250px;
    height: 250px;
    margin: 0 auto;
    }

#imageContainer{
    padding: 10px;
    }

#loading{
    position: absolute;
    top: 40%;
    left: 0%;
    height: 25%;
    width: 100%;
    text-align: center;
    line-height: 0;
    }
#hoverNav{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10;
    }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#imageDataContainer{
    font: 10px Verdana, Helvetica, sans-serif;
    background-color: #fff;
    margin: 0 auto;
    line-height: 1.4em;
    /*overflow: auto;*/
    width: 100% 
    }

#imageData{ padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }  
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;  }           
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;  }   
        
#overlay{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    width: 100%;
    height: 500px;
    background-color: #000;
    }

/* END LIGHTBOX */


/* BEGIN GIVING TO REED BOX */

#giftBox {
height:38px;
width: 490px;
background: #fff url() no-repeat top left;
margin:20px auto;
}

#giftBox a:link, #giftBox a:visited {
height:38px;
display:block;
text-indent:-9999px;
}

#giftBox a:hover {
height:38px;
display:block;
background: #fff url() no-repeat bottom left;
}

/* END GIVING TO REED BOX */

/* BEGIN GIVING NEWS LIST OF PHOTOS */

#givingNewsBox {
width:490px;
margin: 20px 0 20px 0;
}

#givingNewsBox ul {
list-style:none;
margin:0;
padding:0;
}

#givingNewsBox li {
display: inline;
float:left;
margin: 0 0 28px 10px;
padding:0;
}

#givingNewsBox img {
background-color:#fff;
border:none;
float:left;
margin:0 10px 0 0;
}

#givingNewsBox p {
background-color:#fff;
border:none;
width:136px;
float:left;
margin:0;
padding:0;
font-size:.9em;
}

.clearing { clear:both; }

/* END GIVING NEWS LIST OF PHOTOS */


/* BEGIN DONOR SOCIETY BOX */

#donorSocietyBox {
width: 260px;
padding: 10px 10px 5px 10px;
background-color: #ddd;
font-weight: bold;
border: 2px solid #000;
text-align: left;
float:right;
margin: 0 0 15px 15px;
}

#donorSocietyBox h3{
color: #5e0501;
text-align:center;
}

#donorSocietyBox li{
margin:0 0 5px 0;
padding:0;
}

#donorSocietyBox ul{
font-size: .9em;
margin-left:0;
}

ul.donors {
float:left;
list-style:none;
padding-left:15px;
}

ul.gifts {
float:left;
list-style:none;
margin:0;
padding-top:10px;
padding-left:17px;
}

ol.QA {
margin-left:0;
padding-left:0;
}

ol.QA dt {
margin: 0;
font-style:italic;
font-size:1.1em;
}

ol.QA dd {
margin: 2px 0 15px 0;
}

#faqBox h4 {
font-weight: bold;
color: #000;
}

/* BEGIN SCREENSAVER LIST OF PHOTOS */

.screensaverBox {
margin: 0 13px 20px 0;
float:left;
}

.screensaverBox ul {
list-style:none;
margin:0;
padding:0;
}

.screensaverBox li{
margin:0;
padding:0;
font-size:.92em;
}

.screensaverBox img {
background-color:#fff;
border:none;
margin:0;
}

/* END SCREENSAVER LIST OF PHOTOS */

/* BEGIN CONNECTION BOX */

#connectionBox {
padding:10px 0px 10px 0px;
width:340px;
margin-bottom:25px;
background-color: #fcf8e0;
margin-top:7px;
}

#connectionBox blockquote {
margin: 0px;
padding: 10px 10px 0px 15px;
}

#connectionBox span {
float:right;
padding-right:10px;
}

#connectionBox h2 {
font-size:19px;
padding-left:15px;
color:#5e0501;
font-family:Georgia, "Times New Roman", Times, serif;
letter-spacing:.04em;
font-weight:normal;
margin:0 0 5px 0;
}

#connectionBox h3 {
font-size:18px;
padding-left:15px;
color:#5e0501;
font-family:Georgia, "Times New Roman", Times, serif;
letter-spacing:.04em;
font-weight:normal;
padding-top:0px;
margin:0px;
line-height:21px;
}


#connectionBox p {
padding-left:15px;
padding-right:10px;
margin-top:0px;
}

/* END CONNECTION BOX */


/* BEGIN PHONE-A-THON BOX */

#rightSidebarBox ul {
list-style:none;
padding:0;
margin-top:5px;
}

#rightSidebarBox li {
margin:0;
padding:0 0 4px 0;
font-size:.92em;
}

#rightSidebarBox li span {
font-weight:bold;
text-transform:uppercase;
}

/* END PHONE-A-THON BOX */

/* BEGIN PHONE-A-THON BUTTON */

#rightSidebarBox div.phoneButton a:link, #rightSidebarBox div.phoneButton a:visited {
height:73px;
width:121px;
margin:0 0 17px 0;
padding:0;
display:block;
text-indent:-9999px;
background: #fff url() no-repeat top left;
}

#rightSidebarBox div.phoneButton a:hover {
margin:0 0 17px 0;
padding:0;
height:73px;
display:block;
background: #fff url() no-repeat bottom left;
}

/* END PHONE-A-THON BUTTON */


.clearfix:after, ul.gifts:after, .doubleBox:after, .screensaverBox:after, #slideshowBox:after, #classWrapper:after, ul.image-list:after, ul.icon-list:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden; 
}

.required {
	 font-weight:bold;
	 color: #EB0000;
}

.hide-element {
    border: 0;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip; rect(1px, 1px, 1px, 1px);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px; 
}