.footer-title {
    font-size: 15px;
}

.right-column {
    font-size: 50%;
}

.header-image img,
.body-image img {
    width: 100%;
    height: auto;
}

.body-container,
.footer-container,
.footer-column {
    /*font-size: 80%;*/
}

.image-disclaimer {
    font-size: 60% !important;
}

.body-container {
    display: flex;
    text-align: left;
    margin: 0 auto;
}

.body-left-column {
    width: 20%;
}

.body-middle-column {
    width: 60%;
}

hr {
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 1px;
}

.question {
    margin-bottom: 2em;
    color: #a8a8a8;
}

.answer {
    margin-bottom: 2em;
}

.answer-end {
    margin-bottom: 3em;
}

.studies-grid .study {
    padding: 0px;
}

.header-image {
    text-align: center;
}

.header-image img {
    max-width: 100%;
    height: auto;
}

.body-image img {
    max-width: 100%;
    height: auto;
    border: 1px solid #000;
    box-sizing: border-box;
    margin-top: 1em;
	/*padding-left: 20%;
	padding-right: 20%;*/
}

.body-image-collage-2, .body-image-collage-3 {
	border: 1px solid #000;
    box-sizing: border-box;
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    width: 100%;

}

.body-image-collage-2, .body-image-collage-3 img {
    flex: 1 1 auto;
    height: auto;
    width: auto;
}

.body-image-collage-2 img {
    max-width: calc(100% / 2);
}

.body-image-collage-3 img {
    max-width: calc(100% / 3);
}

.image-disclaimer {
    color: #666;
    font-style: italic;
    text-align: center;
    font-size: 80%;
    margin-top: 0.5em;
    margin-bottom: 3em;
}

.header-content {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    margin-bottom: 40px;
    align-items: flex-start;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    padding-top: 50px;
    padding-bottom: 50px;
    text-transform: uppercase;
}

.left-column {
    text-align: left;
    font-size: 13px;
    width: 15%;
    overflow-wrap: break-word;
}

.middle-column {
    text-align: left;
    font-size: 30px;
    width: 60%;
    padding-left: 10px;
    padding-right: 10px;
}

.middle-column p {
    line-height: 1;
}

.right-column {
    text-align: right;
    font-size: 13px;
    width: 15%;
    overflow-wrap: break-word;
}

.footer-container {
    margin-top: 50px;
    padding-top: 20px;
    padding-bottom: 40px;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
}

.footer-title {
    text-align: left;
    margin-bottom: 20px;
}

.footer-columns {
    display: flex;
    justify-content: space-around;
}

.footer-column {
    flex: 1;
    text-align: left;
    font-size: 13px;
}

.footer-column:nth-child(1) {
    margin-right: 20px;
}

.footer-column:nth-child(2) {
    margin-right: 20px;
}

.footer-image {
    width: 100%;
    height: auto;
}

.footer-text {
    margin-top: 10px;
}

.subtitle {
    font-family: "Raleway", sans-serif;
    margin-bottom: 2em;
    font-size: 15px;
	font-weight: 600;
}

@media only screen and (min-width: 480px) {
    .studies-grid .study .hover-set:hover .caption {
        opacity: 1;
    }
}

@media only screen and (max-width: 768px) {
    .left-column {
        width: 20%;
    }

    .middle-column {
        width: 50%;
    }

    .right-column {
        width: 20%;
    }

    .footer-container {
        padding-top: 0px;
        padding-bottom: 20px;
    }

    .body-left-column {
        width: 25%;
    }

    .body-middle-column {
        width: 75%;
    }
}

@media only screen and (max-width: 480px) {
    .left-column {
        font-size: 50%;
    }

    .middle-column p {
        font-size: 20px;
    }

    .right-column {
        font-size: 50%;
    }

    .header-image img {
        margin-top: 20px;
    }

    .body-container {
        width: 100%;
    }

    .body-left-column {
        width: 25%;
    }

    .body-middle-column {
        width: 75%;
    }
}

#english-content .middle-column {
    text-align: center;
}

#chinese-content .middle-column {
    text-align: center;
}

#chinese-content #interview-title {
    font-family: "Noto Sans", sans-serif;
    font-weight: 500;
}

.outline-en,
.outline-cn {
    position: sticky;
    top: 130px;
    padding-left: 10px;
    padding-right: 30px;
    border-left: 1px solid #333;
}

.outline-en ul,
.outline-cn ul {
    list-style: none;
    padding: 0;
}

.outline-en li,
.outline-cn li {
    color: white;
    margin-bottom: 10px;
}

.outline-en a,
.outline-cn a {
    text-decoration: none;
}

.outline-en p,
.outline-cn p {
    word-wrap: break-word;
    hyphens: auto;
}

#outliner-en-0,
#outliner-cn-0 {
	position: relative;
    margin-bottom: 2em;
}

/*#outliner-en-0,*/
#outliner-en-1,
#outliner-en-2,
#outliner-en-3,
#outliner-en-4,
#outliner-en-5,
#outliner-en-6,
/*#outliner-cn-0,*/
#outliner-cn-1,
#outliner-cn-2,
#outliner-cn-3,
#outliner-cn-4,
#outliner-cn-5,
#outliner-cn-6 {
    padding-top: 130px;
    margin-top: -100px;
    position: relative;
    margin-bottom: 2em;
}

#outliner-en-1,
#outliner-en-2,
#outliner-en-3,
#outliner-en-4,
#outliner-en-5,
#outliner-en-6,
/*#outliner-cn-0,*/
#outliner-cn-1,
#outliner-cn-2,
#outliner-cn-3,
#outliner-cn-4,
#outliner-cn-5,
#outliner-cn-6 {
    padding-top: 130px;
    margin-top: -100px;
    position: relative;
    margin-bottom: 2em;
}

#outliner-en-0,
#outliner-en-1,
#outliner-en-2,
#outliner-en-3,
#outliner-en-4,
#outliner-en-5,
#outliner-en-6 {
    font-family: "Raleway", sans-serif;
    text-decoration: underline;
    text-transform: uppercase;
	font-weight: 600;
}

#outliner-cn-0,
#outliner-cn-1,
#outliner-cn-2,
#outliner-cn-3,
#outliner-cn-4,
#outliner-cn-5,
#outliner-cn-6 {
    font-family: "Noto Sans", sans-serif;
    font-weight: 600;
    text-decoration: underline;
}

.wrap {
    overflow: visible;
}

@media only screen and (min-width: 960px) and (max-width: 1180px) {
    /*#outliner-en-0,*/
    #outliner-en-1,
    #outliner-en-2,
    #outliner-en-3,
    #outliner-en-4,
    #outliner-en-5,
    #outliner-en-6,
    /*#outliner-cn-0,*/
    #outliner-cn-1,
    #outliner-cn-2,
    #outliner-cn-3,
    #outliner-cn-4,
    #outliner-cn-5,
    #outliner-cn-6 {
        padding-top: 110px;
    }
}

@media only screen and (min-width: 907px) and (max-width: 959px) {
    /*#outliner-en-0,*/
    #outliner-en-1,
    #outliner-en-2,
    #outliner-en-3,
    #outliner-en-4,
    #outliner-en-5,
    #outliner-en-6,
    /*#outliner-cn-0,*/
    #outliner-cn-1,
    #outliner-cn-2,
    #outliner-cn-3,
    #outliner-cn-4,
    #outliner-cn-5,
    #outliner-cn-6 {
        padding-top: 155px;
    }
}

@media only screen and (min-width: 894px) and (max-width: 906px) {
    /*#outliner-en-0,*/
    #outliner-en-1,
    #outliner-en-2,
    #outliner-en-3,
    #outliner-en-4,
    #outliner-en-5,
    #outliner-en-6,
    /*#outliner-cn-0,*/
    #outliner-cn-1,
    #outliner-cn-2,
    #outliner-cn-3,
    #outliner-cn-4,
    #outliner-cn-5,
    #outliner-cn-6 {
        padding-top: 180px;
    }
}

@media only screen and (max-width: 893px) {
    /*#outliner-en-0,*/
    #outliner-en-1,
	#outliner-en-2,
	#outliner-en-3,
	#outliner-en-4,
	#outliner-en-5,
	#outliner-en-6,
	/*#outliner-cn-0,*/
	#outliner-cn-1,
	#outliner-cn-2,
	#outliner-cn-3,
	#outliner-cn-4,
	#outliner-cn-5,
	#outliner-cn-6 {
	        padding-top: 200px;
	    }
}

@media only screen and (min-width: 960px) and (max-width: 1180px) {
    .outline-en,
    .outline-cn {
        top: 110px;
        padding-right: 15px;
    }
}

@media only screen and (min-width: 907px) and (max-width: 959px) {
    .outline-en,
    .outline-cn {
        top: 155px;
        padding-right: 15px;
    }
}

@media only screen and (min-width: 894px) and (max-width: 906px) {
    .outline-en,
    .outline-cn {
        top: 180px;
        padding-right: 15px;
    }
}

@media only screen and (max-width: 893px) {
    .outline-en,
    .outline-cn {
        top: 200px;
        padding-right: 15px;
    }
}