@charset "utf-8";



/* CSS Document */



html,

body {
	padding: 0;
	margin: 0;
	background-color:#ffffff;
}

body {
    font-family: 'raleway', sans-serif;
	background-color:#ffffff;
}

a,
a:hover {
    text-decoration: none;
    color: #1b9ffe;
}

h3 {
    font-size: 3em;

}

a:focus {
	outline: 0;
    text-decoration: none;
}

.container-fluid {
    padding: 0;
    margin-right: 2vw;
}

.boutonretour {
    display: block;
    width: 200px;
    height: 40px;
    line-height: 40px;
    background-color:#1b9ffe;
    color:rgba(255, 255, 255, 1);
    margin: auto;
}


#remplissage {
   position: relative; 
}



#remplissage, #zoneform, #titre-article {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; 
 }

 #remplissage, .orange {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row; 
 } 



 #zoneform {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; 
 } 



 #remplissage, .orange {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start; 
 }

 #remplissage, .orange {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; 

 }

 #remplissage, .orange {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; 
 } 

 #titre-article {
    text-align: center;
}

#remplissage, .orange {
    margin: 0;   
}

#remplissage { 
    background: url(../images/deuxlunes-op-deg.jpg) no-repeat fixed;
    background-position: 5% 100px;
    width: 1080px;
    /* width: 100%; */
    height: 1920px;
    top: 0;
    left: 0;
}

#zoneform {
    position: relative;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 10px;
    -webkit-box-shadow: 10px 10px 10px 0px #8d8d8d;
            box-shadow: 10px 10px 10px 0px #8d8d8d;
    width: 80%;
    height: 1210px;
    margin: 250px 0 20px 2vw;
    }

#titre-article {
    width: 90%;
    height: 60px;
    margin: 5px auto;
    text-transform : uppercase;
}

#texte-article {
    width: 95%;
    margin: auto;
}

.texte-article {
    width: 95%;
    margin: auto;
}

#texte-article>p, #texte-article>ul, #boitedeuxtier>p, .texte-article>p {
    text-align: justify;
    color: #141f6f;
}

#texte-article>ul>li {
    margin-top: 10px;
}

#texte-article>h1, .texte-article>h1 {
    color: coral;
    font-weight: bold;
}



#texte-article>h2, #texte-article>h5, .texte-article>h2, .texte-article>h5 {
    color: green;
    font-weight: bold;
}




fieldset {
    width: 100%;
    color: #1D3C64;
    margin: 15px auto 40px auto;
    font-size: 1.1em;
}

legend {
    font-size: 15px;
    line-height: inherit;
    color: #333;
}

label {
    font-weight: normal;
    width: 100%;
     display: flex;
    /*flex-direction: row; */
    align-items: center;


}

.souligne {
    font-size: 2.0em;
    font-weight: bold;
    font-style: italic;
}

#titre-article p {
    /* margin: auto; */
    font-weight: bold;
    font-size: 2.8em;
    color: #141f6f;
    /* font-family: 'Arial Black', sans-serif; */
}

.civ5 input {
    margin: auto 0.5em;
}

.repform {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
            justify-content: center;
    width: 100%;
    margin: auto;
    /* text-align: center; */
}

.alignequest {
    width: 100%;
    /* height: 40px; */
    margin: 5px auto;
}

.lignecentre {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: start;
        align-content: flex-start;
        align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin: 20px;
    width: 95%;
    /* height: 120px; */
    /* border-bottom: 1px solid salmon; */
}

.blocsmiley {
    display: flex;
   align-items: center;    
    width: 90%;
    height: 100px;
    cursor: pointer;
    padding: 20px;
    font-weight: bold;
    font-size: 1.9em;
    margin: auto;
    
    /* background-image: url(../images/vert.png) no-repeat ; */

}

.col1 {
    background-color:rgba(102, 187, 247, 0.5);
    
}

.col2 {
    background-color:rgba(85, 194, 233, 0.5);
}

.col3 {
    background-color:rgba(112, 217, 240, 0.5);
}

.col4 {
    background-color:rgba(85, 233, 194, 0.5);
}

.col5 {
    background-color:rgba(112, 240, 112, 0.5);
}

.col6 {
    background-color:rgba(240, 236, 112, 0.5);
}

.col7 {
    background-color:rgba(240, 148, 112, 0.5);
}

.margeradio {
  margin:0;padding:0;
    -webkit-appearance:none;
       -moz-appearance:none;
            appearance:none;  
}

.textform {
    margin-bottom: 70px;
    height: 100px;
}

#merci {
    margin: auto;
    font-weight: bold;
    font-size: 2.0em;
    color: #141f6f;
    font-family: 'Arial Black', sans-serif;
}

.pouce {
    position: absolute;
    top: 60px;
    left: 40px;
}

input[type="radio"], input[type="checkbox"] {
    margin: 0 20px 0 0;
}

.orange {
    display: flex;
    background: url(../images/question.jpg)  fixed;
    background-position: 1px 1px;
    width: 1080px;
    height: 100vh;
}

.orange2 {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-evenly;
    /* background: url(../images/question2.jpg)  fixed; */
    background: url(../images/question2.jpg);
    background-repeat: repeat-x;
    background-size: 100% 100%;
    /* background-position: 1px 1px; */
    width: 100%;
    height: 1920px;
}



.titrequest {
    font-family: 'arial', sans-serif;
    font-size: 3.0em;
    font-weight: bolder;
    text-align: center;
    margin: auto;
    color: #ffffff;
    text-shadow: 2px 2px 4px #000000;
}

.titrequest2 {
    position: relative;
    display: block;
    font-family: 'arial', sans-serif;
    font-size: 2.0em;
    font-weight: bolder;
    text-align: center;
    margin: auto;
    color: #ffffff;
    text-shadow: 2px 2px 4px #000000;
}

.zone1 {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 900px;
    /* border: 1px solid #000000; */
}

.zonesepare {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%; 
}

#countdown {
    position: absolute;
    bottom: 5px;
    left: 200px;
    width: 600px;
    height: 38px;
    font-size: 1.2em;
    /* margin: 30px auto; */
}

.anton {
    font-family: 'anton', sans-serif;
}

.cabin {
    display: inline-block;
    margin-top: 50px;
    font-family: 'cabin', sans-serif;
}

#margeform {
    margin-top: 200px;
}

#sousform {
    display: none;
}

.boutonsuite {
    position: relative;
    display: block;
    width: 200px;
    height: 40px;
    line-height: 40px;
    color: white;
    background-color:#0bd9fd;
    border-radius:10px;
    margin: 30px 0 0 200px;
    text-align: center; 
    cursor: pointer;
 }