/* Responsive */

#nav-respv-btn-open, #nav-respv-btn-close{
    visibility: hidden;
    position: absolute;
    top: 20px;
    right: 20px;
    height: 30px;
    cursor: pointer;
    z-index: 8;
}

.nav-respv{
    visibility: hidden;
    position: absolute;
    z-index: 12; /* !! */
    width:100%;
    height:100%;
    top:0; left: 0;
    text-align: right
}

.nav-respv-overlay{
    z-index: 11;
    visibility: hidden;}
.nav-respv-overlay ul{
    position: absolute;
    right: 0px;
    padding: 0;
    margin-top: 80px;
    list-style: none;
}
.nav-respv-overlay ul li a{
    display: block;
    margin-right: 20px;
    margin-bottom: 22px;
    color: #808285;
	font-weight:bolder;
	font-size: 22pt;
    opacity: 1;
}
.nav-respv-overlay ul .small-li a{
	font-size:16pt;
    margin-bottom: 14px;
    opacity: 0.7;
}

.nav-respv-fond{ /*  Fond overlay  */
    visibility: hidden;
    position: fixed;
    z-index: 9;
    width:100%;
    height:100%;
    top:0; left: 0; bottom: 0;
    background-color:#BCBDC0;
}



@media screen and (max-width: 768px){
    /* Menu */
    #nav-respv-btn-open{
        visibility: visible;
    }
    nav{
        visibility: hidden;
    }
    footer{
        visibility: hidden;
    }
    
    /* General : Responsive */
    section{
        width: 100%;
        margin-top: 80px; /* Défini par la hauteur du menu déroulant de About */
    }
    
    /* Biography : Responsive */
    .chrono-list{
        position:inherit;
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
        margin-bottom: 120px;
	}
	
    .chrono-list h1, .chrono-list h2, .chrono-list h3{margin: 0px; padding: 0;}
    .chrono-list h3{margin-top: 50px; margin-bottom: 30px;}
    .chrono-list li{padding-right: 40px;}
    .bio-entree{width: 100%;}
    .bio-year{margin-bottom: 7px;}
    
    .languageBox{float: inherit;z-index: 12;}
    
    
    /* Texts/Statement : Responsive */
    /* Pages de sommaires : Responsive */ 
    /* Sommaire video : Responsive */ 
    /* Contact/credits : Responsive */ 
     .text-element, .summary-list, .videos-container, .contact-element{
        width: initial;
        padding-left: 20px;
        padding-right: 20px;
    }

    /* ##### RASSEMBLER TOUT LES CONTAINERS */
    
    
    #diaporama-container h1 br, #diaporama-container h2 p br{
        display: none;
    }
    
    /* Pages de Home : Responsive */ 
    #diaporama-container h1, #diaporama-container h1 p{
        font-size: 50px;
        line-height: 50px;
    }
    #diaporama-container h2, #diaporama-container h2 p{
        visibility: hidden;
    }
    
    
    /* Diaporama : Responsive */ 
    footer{
        z-index:12;
        top: 90px;
    }
    footer ul{
        float: clear;
    }

    #wie{
        visibility: hidden;
        display: none
    }
    .clicTimeline{ /* AND , nav ul li */
        display:block;
        bottom: 0;
        margin-bottom: 20px;
		clear:left;
	}

	/* Actu : Responsive */ 
	#actualite-ul-container,#actualite-ul,#actualite-ul li ,.actu-gauche,.actu-droite,.actu-droite img{
		margin:0;
		padding:0;
		width:100%;
		display:inline-block!important;
		float:left;
		height:auto;
		position:relative;
		opacity:1!important;
		overflow:hidden;
	}
	#actualite-ul-container{
		box-sizing:border-box;
		padding-left:10px;
		padding-right:10px;
		padding-top:60px;
	}
	
	.actu-gauche{
		margin-top:40px;
	}
	
	.actu-droite img{
		margin-top:10px!important;
	}
	.actu-gauche h1,.actu-gauche h2{
		font-size: 35px;
		line-height: 35px;
    }
	
	#exhibitions{
		width: auto;
		display: inline;
		position: relative;
		float: left;
		margin: 0;
		height:auto;
		padding: 0;
		left: 0;
		left:0;
	}
	
	#exhibtions-container, #exhibtions-content{
		position:relative;
		height:auto;
		margin:0;
		padding:0;
		width:auto;
		left:auto;
		top:auto;
		overflow:auto;
	}
}



@media screen and  (min-width: 768px) and (max-width: 1200px){
    #diaporama-container h1, #diaporama-container h1 p{
        font-size: 80px;
        line-height: 80px;
    }
    #diaporama-container h1 br, #diaporama-container h2 p br{
        display: none;
    }
}