@import url('https://fonts.googleapis.com/css?family=Nunito|Raleway|Source+Serif+Pro');

body {
    font-family: "Raleway", sans-serif;
}


/*CUSTOM SETTINGS FOR NON-MOBILE SCREENS*/

@media screen and (min-width: 480px){
    .twitter {
        max-width: 700px;
        margin: auto;
    }
}

/*NAVBAR-----------------------------------------------*/


header {
    background-image: url("../images/banner-image-merged-2.png");
    width: 100%;
    background-size: cover;
}

#logo-container img {
    width: 100%;
    height: auto;
}

#main {
    padding-top:70px;
}

.navbar {
    border-radius: 0;
    transition: all 0.3s ease-out;
    background-color: black;
}

.affix {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
}

/* fixed to top styles */
.affix.navbar {
    background-color: #000;
}
.affix.navbar .nav-item>a,
.affix.navbar .navbar-brand {
    color: #fff;
}

/*GENERAL TEXT FORMATTING-------------------------------*/

h1 {
    color: #ac2fe0;
    font-family: "Nunito", sans-serif;
    font-weight: bold;
}

h2 {
    color: #ac2fe0;
    font-family: "Nunito", sans-serif;
    font-size:  xx-large;
    text-align: left;
    padding-top: 2em;
    padding-bottom: 1em;
}

h3 {
    color: #ac2fe0;
    font-family: "Nunito", sans-serif;
    font-weight: large;
    text-align: left;
    padding-top: 10px;
    padding-bottom: 10px;
}

h4 {
    color: darkslategray;
    font-family: "Nunito", sans-serif;
    font-weight: large;
    text-align: left;
    padding-top: 20px;
    padding-bottom: 15px;
}
h5 {
    color: darkslategray;
    font-family: "Nunito", sans-serif;
    font-size: medium;
    font-weight: normal;
    text-align: left;
}

.h-space {
    padding-top: 2em;
}

.centred {
    text-align: center
}

footer {
    font-family: "Nunito", sans-serif;
    font-size: small;
    background-color: lavender;
    padding-bottom: 10px;
    text-align: center;
    width: 100%;
}

/*CONTENT CLASSES-------------------------------------*/





/*HOME PAGE------------------------------------------*/


.group-photo {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    height: auto;
    padding: 10px;
}

div.scroll {
    height: 40em;
    overflow: scroll;
}


/*RESEARCH--------------------------------------------*/

.research_themes {
    position: relative;
    width: 50%;
}

.research_theme_image {
    display: block;
    width: 100%;
    height: auto;
    position: center;
}

.research_overlay {
    position: absolute;
    padding: 0;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .5s ease;
    background-color: rgba(0,0,0,0.75);
    -webkit-border-radius: 15px;
    border-radius: 15px;
}

.research_themes:hover .research_overlay {
    opacity: 1;
}

.research_overlay_text {
    color: white;
    font-size: 22px;
    font-family: "Nunito", sans-serif;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.research_image {
    width:100%;
}

a.anchor{
    display: block;
    position:relative;
    top: -1em;
    visibility: hidden;
}

.row.logos {
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-avatar {
    padding: 10px;
}

.logo {
    width: 60%;
}

/*PEOPLE---------------------------------------------*/


/*ABOUT----------------------------------------------*/

.responsive_landscape {
    width: 100%;
    height: auto;
}

/*GROUP PAGE*/


.group_avatar {
    padding: 10px;
}

.group_desc {
    padding: 10px;
}

.button-container {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
}

.button-container img {
    width: 100%;
    height: auto;
}

.btn_alumni {
    border: none;
    border-radius: 16px;
    cursor: pointer;
    background-color: #ac2fe0;
    color: white;
    font-size: 16px;
    padding: 10px 20px;
    margin: 4px 2px;
    text-align: center;
    display: inline-block;
    position: absolute;
    top: 92%;
    left: 90%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);

}
.container .btn_alumni:hover {background-color: #5d197a;}
.btn_alumni:hover {background: #5d197a;}

#member-cards {
    text-align: center;
    padding: 20px;
}
.portrait {
    display: block;
    width: 12em;
    height: auto;
    border-radius: 50%;
    margin-left: auto;
    margin-right: auto;
}

ul.no-bullets {
    list-style-type: none; /* Remove bullets */
    padding: 0; /* Remove padding */
    margin: 0; /* Remove margins */
}

.alumni_box {
    position: relative;
    width: 50%;
    height: 8em;
    margin: 0.5em;
    background-color: #5d197a;
    -webkit-border-radius: 15px;
    border-radius: 15px;
}

.alumni_grads {
    background-color: #5d197a;
}

.alumni_undergrads {
    background-color: #ac2fe0;
}

.alumni_photos {
    background-color: indigo;
}

.alumni_box_text {
    color: white;
    font-size: 22px;
    font-family: "Nunito", sans-serif;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.alumni_overlay {
    position: absolute;
    padding: 0;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    transition: .5s ease;
    background-color: rgba(0,0,0,0.75);
    -webkit-border-radius: 15px;
    border-radius: 15px;
}

/*PUBLICATIONS---------------------------------------*/

ol.pubsList {
}

li.pubsEntry {
    margin-bottom: 15px;
    padding-left: 1em;
}

ul.nav-pills {
    top:
}

.main {
}

.sidebar {
    z-index: 2;
}

:target:before {
    content:"";
    display:block;
    height:4.5em; /* fixed header height*/
    margin:-4.5em 0 0; /* negative fixed header height */
}

.btn_pubs {
    border: none;
    border-radius: 16px;
    cursor: pointer;
    background-color: #ac2fe0;
    color: white;
    font-size: 16px;
    padding: 10px 20px;
    margin: 4px 2px;
    text-align: center;
    display: inline-block;
    position: absolute;
}

.container .btn_pubs:hover {background-color: #5d197a;}
.btn_pubs:hover {background: #5d197a;}

@media only screen and (min-width: 768px) {
    .wrapper {
        display: flex;
        justify-content: space-between;
    }
    .sidebar {
        height: 10vh;
        position: -webkit-sticky;
        position: sticky;
        top: 5em;
        z-index: 2;
    }
}