/************
 * Couleurs *
 ************/
.couleur_a {
    background: #4892af; /* Fond */
}
.couleur_b {
    background: #9eb2c8;
}
.couleur_c, .couleur_h2, .couleur_h3 {
    background: #c3cfde;
}
.couleur_oraison {
    background: #9eb2c8;
}

body {
    font-weight: bold;
    margin: 0;
/*
    -webkit-filter: blur(0.2px);
    filter: blur(0.2px);
*/
}
h1, h2, h3 {
    text-align: center;
    border-radius: 10px;
    padding: 20px;
}
p {
    text-indent: 1em;
    padding: 20px;
    border-radius: 10px;
}
/************************
 * Questions & Réponses *
 ************************/
.question {
    float: left;
    margin: 6vmin 0;
    width: 60%;
}
.reponse {
    float: right;
    width: 60%;
    
    /* transition: 0.5s; */
    
    -webkit-filter: blur(5px);
    filter: blur(5px);

    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.reponse:hover {
    cursor: pointer;
}
.nette {
    /* transition: 0.3s; */

    -webkit-filter: blur(0px);
    filter: blur(0px);
}
.chapitre {
    margin-top: 40%;
}
.page {
    padding: 0 20%;
}
@media (orientation: portrait) {
    .page {
	padding: 0 4%;
    }
}
.cache {
    display: none;
}
.clear {
    clear: both;
}
/********
 * Menu *
 ********/
nav {
    position: fixed;
    
    height: 95%;

    border: solid 1px;
    border-radius: 5px;
    margin: 5px;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    z-index: 100;
}
#bouton_menu {
    position: fixed;
    top: 0px;
    font-size: xx-large;
    margin: 5px;
    padding: 5px;
    border-radius: 5px;
    opacity: 0.9;
}
#bouton_menu:hover {
    cursor: pointer;
}
/**********
 * Header *
 **********/
header {
    margin: 0 20%;
}
@media (orientation: portrait) {
    header {
	margin: 0 4%;
    }
}
main > header, article > header {
    height: 100vh;
    padding: 30vh 0 0 0;
}
/************
 * Oraisons *
 ************/
.oraison {
    height: 100%;
}
.oraison header {
    margin-top: 40%;
}
.oraison p {
    margin-left: 20%;
    margin-right: 20%;
}
@media (orientation: portrait) {
    .oraison p {
	margin-left: 4%;
	margin-right: 4%;
    }
}
/**********
 * Footer *
 **********/
footer {
    display: none;
    position: fixed;
    left: 0px;
    bottom: 100px;
    width: 100px;
    height: 100px;
    background: black;
    color: white;
}
/***********
 * display *
 ***********/
.display_none {
    display: none;
}
