#navbar {
margin-bottom: 0px;
}

#participant-banner {
z-index: 500;
position: relative;
margin-bottom: 20px;
background-color: #c9d66d;
color: #333333;
padding-top: 10px;
padding-bottom: 10px;
font-size: 18px;
text-align:center;
}


#participant-banner a,
#participant-banner a:hover {
color: #333333;
}



.landing-full-screen-background {
width: 100%;
height: 100%;
z-index:-2; /* needed to keep in the background */
border: none;
background-image: url(../images/researchers-about-background-tall.jpg);
background-repeat: no-repeat;
background-size: cover;
background-color: transparent;
background-position: center;
padding-bottom: 130%
}

.landing-full-screen-background .page-links ul li:hover, 
.landing-full-screen-background .page-links a.list-group-item:hover {
background-color: transparent;
}


.page-links-container {
    background-color: #ffffff;
}


.page-links-container {
    background-color: rgba(255,255,255,1);
    border-top: 2px solid #eeeeee;
    margin-bottom: -45px;
    padding-top: 0px;
    padding-bottom: 75px;
    margin-top: 0px;
}



.page-intro.about {
background: none;
border: none;
padding-bottom: 15px;
padding-top: 20px;
}


.page-intro.about h1 {
margin-top: 35px;
}


.page-intro #landing-about {
max-width: 50em;
margin-left: 15px;
}

.screen {
background: linear-gradient(180deg, rgba(255,255,255,0) 30%,rgba(255,255,255,.9) 75%, rgba(255,255,255,0) 100%);
z-index:-1; 
}

.page-links-container {
padding-top: 15px;
}




@media only screen and (min-width: 350px) {
.landing-full-screen-background {
padding-bottom: 105%;
background-position: -100px 0px;
}
}


@media only screen and (min-width: 385px) {
.landing-full-screen-background {
padding-bottom: 90%;
background-position: center;
}
}


/*
@media only screen and (min-width: 720px) and (max-height: 540px) {
.landing-full-screen-background {
background-position: top;
padding-bottom: 0px;
}
}
*/



@media only screen and (min-width: 600px) {

.landing-full-screen-background {
background-image: url(../images/researchers-about-background.jpg);
background-repeat: no-repeat;
background-size: cover;
background-color: transparent;
background-position: 0px 0px;
padding-bottom: 0px;
}


.page-intro.about h1 {
margin-top: 35px;
}


.page-intro.about {
padding-bottom: 15px;
padding-top: 20px;
}


.page-intro #landing-about {
max-width: 50em;
margin-left: 15px;
}


.page-links h2.block-title {
font-size: 21px;
}


}


@media only screen and (min-width: 600px)  and (min-height: 800px) {

.landing-full-screen-background {
min-height: 500px;
margin-bottom: -45px;
}


}




@media only screen and (min-width: 600px) and (max-height: 799px) {

.landing-full-screen-background {
background-position: top;
}


}




@media only screen and (min-width: 600px) and (max-width: 767px) {

.landing-full-screen-background {
background-position: -100px 0px;
background-size: 1200px;
}

.landing-full-screen-background {					
min-height: 700px;
}

.page-links-container {
padding-top: 0px;
}

}



@media only screen and (min-width: 768px) and (max-width: 991px) and (max-height: 799px) {

.landing-full-screen-background {
background-position: 0px 0px;
background-size: 992px;
}

.landing-full-screen-background {					
min-height: 575px;
}

.page-links-container {
padding-top: 0px;
}

}


/* Medium Devices, Desktops */
@media only screen and (min-width: 768px) and (min-height: 800px) {
.landing-full-screen-background {
background-position: 0px 0px;
height: 80vh;
}


}


/* Medium Devices, Desktops */
@media only screen and (min-width: 992px){

.page-links h2.block-title {
    font-size: 29px;
}


.screen {
mask-image: linear-gradient(to right, black 80%, transparent 100%);
-webkit-mask-image: linear-gradient(to right, black 80%, transparent 100%);
}


}


@media only screen and (min-width: 992px) and (max-width: 1199px) and (max-height: 799px) {

.landing-full-screen-background {
background-position: 0px -100px;
background-size: 1200px;
}

.landing-full-screen-background {					
min-height: 600px;
}

.page-links-container {
padding-top: 0px;
}

}


@media only screen and (min-width: 1200px) {

.landing-full-screen-background {
background-position: center;
}

.screen {
mask-image: linear-gradient(to right, black 80%, transparent 100%);
-webkit-mask-image: linear-gradient(to right, black 65%, transparent 100%);
}


}

/* LOWER RES LAPTOPS */

@media only screen and (min-width: 1200px) and (max-height: 799px) {

.landing-full-screen-background {
min-height: 600px;
}

.page-links-container {
padding-top: 0px;
}

.page-intro.about h1 {
margin-top: 35px;
font-size: 36px;
}

.page-intro p {
font-size: 17px;
line-height: 1.7;
}




}

@media only screen and (min-width: 1200px) and (min-height: 800px) {

.page-links-container {
padding-top: 30px;
}

.page-links h2.block-title {
    font-size: 30px;
}

.landing-full-screen-background {
height: 80vh;
}

}



/* special for 912x1386, 1024x1366  (surface pro 7, ipad pro)*/

@media only screen and (min-width: 912px)  and (min-height: 1366px) and (max-width: 1024px)  and (max-height: 1368px) {
.landing-full-screen-background {
background-position: -90px 0px;
}


