*{margin: 0;
  padding: 0;}

#BodyConnexion, #BodyModification{background-color:rgb(255, 255, 255);
              background: url(./Images/figure-reine.PNG) center/cover;
               text-align: center;}
h1{margin-top: 10vh;}
#FormConnexion{margin: 5vh auto 5vh auto;
     padding: 10px 0 10px 0;
     background-color: white;
     height: 100%;
     width: 30vw;
     border-radius: 10px;
     box-shadow: 0 0 50px rgb(1, 1, 19);}
p input{width: 90%;
        margin: 10px 0 10px 0;
        min-height: 40px;} 
#Soumettre{background-color: rgb(231, 141, 179);
           cursor: pointer; 
           transition: 0.2s;}
#Soumettre:hover{background-color: rgb(248, 208, 105);}
#InscrivezVous{height: 50px;
               width: 30vw;
               border-radius: 4px;
               margin-bottom: 30px;
               background-color: rgb(119, 209, 206);
               font-size: large;}
#InscrivezVous:hover{background-color: grey;}
@media(max-width:800px)
{#FormConnexion, #InscrivezVous{width: 70vw;}
 #BodyConnexion{background: url(./Images/figure-reine2.PNG) center/cover;} 
}
/*------------------------------------------------------------------------*/
#BodyVoirUnProfil{background-color:rgb(223, 186, 220);}
#UnProfilVu{width: 95%;
            padding: 20px 0 20px 0;
            background-color: rgb(235, 202, 207);
            margin: 30px auto 210px auto;
            display: grid;
            grid-template-columns: 50% 50%;
            text-align: center;}
#InfoUnProfilVu, #InterActionProfilVu{margin: 0 10px 0 10px;
                                      background-color: rgba(194, 173, 173, 0.575);}
#InfoUnProfilVu img{width: 100%;}
#TxtProfilsVu p{font-size:xx-large;
                color: rgb(145, 59, 93);}
#Fil_Actualiser, #Discuter, #Photos{background-color: rgb(216, 124, 204);
                                  height: 30px;
                                  margin-bottom: 3px;
                                  display: flex;
                                  justify-content: center;
                                  align-items: center;
                                  color: rgb(0, 0, 0);}
#Fil_Actualiser:hover, #Discuter:hover, #Photos:hover{background-color: rgb(197, 197, 197);
                                                     cursor: pointer;}
@media(max-width:500px)
{#UnProfilVu{grid-template-columns: auto;}
}
/*------------------------------------------------------------------------*/
#BodyDiscussion{background-color:rgb(223, 186, 220);}
#DiscussionAvec{width: 95%;
                padding: 20px 0 20px 0;
                background-color: rgb(235, 202, 207);
                margin: 30px auto 210px auto;}
#DiscussionAvec #TxtDiscussionAvec{width:  calc(100% - 30px);
                                    height: 60px;
                                    font-size:xx-large;
                                    text-align: end;}
#DiscussionAvec img{width: 60px; 
                      height: 60px;
                      border-radius: 30px;
                      margin: 20px 0 0 10px;
                      position: absolute;
                      right: 20px;
                      top: 65px}
#NomDeLaPersonne{margin: 20px 100px 0 10px;
                  position: absolute;
                  right: 20px;
                  top: 105px}
#ZoneDiscussion{display: flex;
                justify-content: space-between;
                text-align: center;}
#Discussion{background-color: rgba(194, 173, 173);
            overflow-x: hidden;
            overflow-y: scroll;
            scroll-behavior: 100%;
            width: 60%;
            height: 95vh;}
#Discussion p{max-width: max-content;
              background-color: white;
              padding: 5px;
              margin: 5px 5px 5px 0;
              border-radius: 10px;}
#LesPhrases1, #LesPhrases2{width: 40%;
                           height: max-content;}
#LesPhrases1 p, #LesPhrases2 p, #EspaceVide1, #EspaceVide2{border: 3px solid rgb(214, 214, 214);
                                padding: 3px;
                                margin-bottom: 3px;
                                background-color: white;}
#EspaceVide1, #EspaceVide2{background-color: rgba(238, 130, 238, 0);  height: 15px; border: none;} 
#LesPhrases1 p:hover, #LesPhrases2 p:hover{background-color: rgb(214, 214, 214);
                                           cursor: pointer;}
@media(max-width:500px)
{#DiscussionAvec{width: 95%;
                 min-height: 110vh;}
  #ZoneDiscussion{display: grid;
                  justify-content:space-between;
                  position: relative;
                  text-align: center;}
  #Discussion{width: 100%;
              height: 50vh;
              position: absolute;
              top: 0;}
  #LesPhrases1{width: 50%;
                height: max-content;
                position: absolute;
                top: 50vh;
                left: 0;}
  #LesPhrases2{width: 50%;
                height: max-content;
                position: absolute;
                top: 50vh;
                right: 0;}
  #EspaceVide1, #EspaceVide2{background-color: rgba(238, 130, 238, 0);  height: 15px; border: none;} 
}