html{
    background-color: white;
    color: #2333ad;
    font-size: .7vmax;
}
body{
    margin: 0;
    padding: 0;
}
a{
    font-size: .6vmax;
	color: #2333ad;
	text-decoration: none;
}
a:link {
    font-size: .6vmax;
	color: #2333ad;
	text-decoration: none;
}
a:visited {
    font-size: .6vmax;
	color: #2333ad;
	text-decoration: none;
}
a:focus {
    font-size: .6vmax;
	color: #2333ad;
	text-decoration: none;
}
a:hover{
	cursor: alias;
}
a:active {
    font-size: .6vmax;
	color: #2333ad;
    text-decoration: none;
}
#container-alpes{
    width: 100%;
    height: 92vh;
    display: flex;
    flex-direction: row;
    justify-content: space-between;

}
#container-alpes-left{
    margin-top: 4vh;
    margin-left: 4vh;
    margin-bottom: 4vh;
    width: 35%;
    height: 92vh;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    letter-spacing: 1px;
}
#container-alpes-left-content{
    width: 70%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
    #alpes-content-list-left{
        width: 45%;
        display: flex;
        flex-direction: column;
    }
    #alpes-content-list-right{
        width: 45%;
        display: flex;
        flex-direction: column;
    }
            #alpes-logo {
                width: 100%;
                height: auto;
            }
#alpes-content-help{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    font-family: GTFlexa_light;
    font-size: .6vmax;
    line-height: 120%;
}
    #alpes-french-part-help{
        width: 45%;
    }
    #alpes-english-part-help{
        width: 45%;
    }
    #alpes-french-part-help-mobile{
        width: 45%;
        display: none;
    }
    #alpes-english-part-help-mobile{
        width: 45%;
        display: none;
    }
#alpes-content-list{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.photo-alpes{
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 5%;
}
.photo-alpes-title{
    font-family: GTFlexa_light;
    line-height: 100%;
}
.photo-alpes-description{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    line-height: 95%;
}
    .photo-alpes-description-left{
        width: 50%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text-align: left;
        font-family: GTFlexa_light;
        font-size: .5vmax;
    }
    .photo-alpes-description-right{
        width: 50%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text-align: right;
        font-family: GTFlexa_light;
        font-size: .5vmax;
    }
#container-alpes-left-links{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-family: GTFlexa_regular;
    line-height: 130%;
    font-size: .6vmax;
}




.square-border{
    border: 2px solid #2333ad;
	height: .30vw;
	width: .30vw;
	display: inline-flex;
	margin-right: 2vw;
}
.square-fill{
    background-color: #2333ad;
	height: .30vw;
	width: .30vw;
    border: 2px solid #2333ad;
	outline: none;
	display: inline-flex;
	margin-right: 2vw;   
}
.selected-image{
    object-fit: contain;
    max-width: 100%;
    max-height: 100%;
}


/* people */
#alpes-content-people{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
.row-people{
    display: flex;
    justify-content: space-between;
    width: 100%;
}
#first-row-people{
    margin-bottom: 5%;
}
.content-people{
    width: 45%;
    display: flex;
    flex-direction: column;
    display: inline-flex;
    line-height: 95%;
}
.name-people{
    font-family: GTFlexa_light;
    font-size: .7vmax;
}
.under-name-people{
    font-family: GTFlexa_light;
    font-size: .6vmax;
}
/*
.website-people{
}
.instagram-people{ 
}
.job-people{
}
*/
#container-alpes-right{
    padding-top: 4vh;
    padding-right: 4vh;
    padding-bottom: 4vh;
    width: 55%;
    height: 92vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
}



@media screen and (max-width: 767px) {
    html{
        font-size: 1.5vmax;
    }
    #container-alpes{
        width: 100%;
        height: 100vh;
        display: flex;
        flex-direction: column-reverse;
        justify-content: space-between;
        letter-spacing: 1px;
    }
    #container-alpes-left{
        margin: 4%;
        width: 92%;
        height: 60vh;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        letter-spacing: 1px;
    }
    #container-alpes-left-content{
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;

    }
    #alpes-content-list{
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        height: 50%;
        overflow: scroll;
        -ms-overflow-style: none;  /* Internet Explorer 10+ */
        scrollbar-width: none;
    }
    #alpes-content-help{
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        font-family: GTFlexa_light;
        font-size: 1.5vmax;
        line-height: 120%;
    }

        #alpes-content-list-left{
            width: 45%;
            display: flex;
            flex-direction: column;
        }
        #alpes-content-list-right{
            width: 45%;
            display: flex;
            flex-direction: column;

        }
                #alpes-logo {
                    width: 100%;
                    height: auto;
                }
    #container-alpes-right{
        width: 100%;
        height: 40vh;
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        letter-spacing: 1px;
    }
    #container-alpes-left-links{
        display: none;
    }
    .photo-alpes-description{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        line-height: 80%;
        letter-spacing: 2px;
    }
    .photo-alpes-description-left{
        width: 50%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text-align: left;
        font-family: GTFlexa_light;
        font-size: 1vmax;
    }
    .photo-alpes-description-right{
        width: 40%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text-align: right;
        font-family: GTFlexa_light;
        font-size: 1vmax;
    }
    .name-people{
        font-family: GTFlexa_light;
        font-size: 1.5vmax;
    }
    .under-name-people{
        font-family: GTFlexa_light;
        font-size: 1vmax;
        line-height: 125%;
    }
    a{
        font-size: 1.2vmax;
        color: #2333ad;
        text-decoration: none;
    }
    a:link {
        font-size: 1.2vmax;
        color: #2333ad;
        text-decoration: none;
    }
    a:visited {
        font-size: 1.2vmax;
        color: #2333ad;
        text-decoration: none;
    }
    a:focus {
        font-size: 1.2vmax;
        color: #2333ad;
        text-decoration: none;
    }
    a:hover{
        cursor: alias;
    }
    a:active {
        font-size: 1.2vmax;
        color: #2333ad;
        text-decoration: none;
    }
    #alpes-french-part-help{
        width: 45%;
        display: none;
    }
    #alpes-english-part-help{
        width: 45%;
        display: none;
    }
    #alpes-french-part-help-mobile{
        width: 45%;
        display: block;
    }
    #alpes-english-part-help-mobile{
        width: 45%;
        display: block;
        text-align: right;
    }

}