:root {
--hauteur-menu : 5%;
}

.a:onclick {
clear : both;
overflow : hidden;
color:darkmagenta;
}
.affichage {
height : 90%;
}
.bloc {
min-height : 100vh;
margin : 0;
}
.bloq {
width : 100%;
border : blue solid 3px;
clear : both;
text-align : justify;
margin : auto;
overflow : hidden;
}

body 
{
background-color: white; 
font-family: "Arial Narrow", 
Arial, sans-serif;
color:#6868f1;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 15px;
} 

#box {
content : "";
display : table;
clear : both;
}
.border {
margin : 5%;
border :2px blue solid ;
border-bottom-style:hidden ;
border-right-style:hidden ;
box-shadow : 3px 3px 3px 3px rgb(0, 0, 0, 0.5);
padding-left:3%;
text-align: center;
/*position: absolute;*/
bottom: 0%;
}
.border img
{
width : 40%;    
}    
.bouton_connecter {
width : 30%;
height : 10%;
background : linear-gradient(blue, 30%, white);
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
font-weight : bold;
border-radius: 5%;
}
.bouton_enregistrer {
width : 30%;
height : 15%;
background : linear-gradient(blue, 30%, white);
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
font-weight : bold;
border-radius: 5%;
}
.bouton_inscrire {
margin-left:8%;    
width : 35%;
height : 10%;
background : linear-gradient(blue, 30%, white);
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
font-weight : bold;
border-radius: 5%;
}
.bouton_troquer {
width : 15%;
height : 10%;
background : linear-gradient(blue, 30%, white);
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
font-weight : bold;
border-radius: 5%;
}
.button {
position: absolute;
height: 8.5%;
right: 38.5%;
top: 9.5%;
}

#button-submit {
background : url(http://2.bp.blogspot.com/-4OxjMRukhCM/VD1gBscpzII/AAAAAAAAAhk/TUxMSv7bCzA/s1600/search-button.png) no-repeat;
width : 3%;
height : 3%;
border-width : 0;
cursor : pointer;
position : absolute;
border-radius:5%;
}
#button-submit:hover {
background : url(http://4.bp.blogspot.com/-GgNBTS_3FEA/VD1gBgm7RFI/AAAAAAAAAhg/flg6VijzW8E/s1600/search-button-hover.png) no-repeat;
}
#button-submit::-moz-focus-inner {
border : 0;
}
.c1 {
outline : 1px solid transparent;
height : 47%;
top : -10%;
overflow:hidden ;
}
.c2 {
outline : 1px solid transparent;
/*top : -5%;*/
/*justify-content : center;*/
height : 47%;
width: 100%;
}
.c2 img
{
background-position : center bottom;
width :100%;
height : 92%;
backface-visibility : hidden;   
}
.c3 {
padding-top: 1%;   
display:block;    
/*word-break: break-word;*/
/*overflow-wrap: break-word;*/    
/*outline : 1px solid transparent;*/
height : 10%;
margin-top : 0.05%;
text-align: left;
padding-left:5%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 18px; 
color: black;
font-weight: bold;
}
.c3 a {
padding-top: 1%;   
display:block;    
/*word-break: break-word;*/
/*overflow-wrap: break-word;*/    
/*outline : 1px solid transparent;*/
height : 10%;
margin-top : 0.05%;
text-align: left;
padding-left:5%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 18px; 
color: black;
font-weight: bold;
}
.c4 {
outline : 1px solid transparent;
width:100%;
height : 14%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 12px; 
color:#b5b2b2;
font-weight: bold;
margin-top : -2%;
display:flex;
text-align:center;
overflow-wrap:anywhere;
padding-left:5%;
}
.c4 a
{
margin-left: 12%;    
} 
.c4 img
{
/*width: 8%;*/  
height: 50%;
/*border-radius: 50%;*/
/*margin-right:3%;*/
}
.c5 {
display: flex;
outline : 1px solid transparent;
width:40%;
height : 8%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-weight: bold;
font-size : 15px; 
color:#b5b2b2;
/*font-weight: bold;*/
padding-left:5%;
}
.c5 img
{
width: 25%;  
height: 50%;
border-radius: 50%;
/*margin-right:3%;*/
}
.c5 a
{
padding-top: 1%;   
display:block;    
/*word-break: break-word;*/
/*overflow-wrap: break-word;*/    
/*outline : 1px solid transparent;*/
height : 10%;
margin-top : 0.05%;
text-align: left;
padding-left:5%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 18px; 
color: black;
font-weight: bold;  
}
.c6 {
outline : 1px solid transparent;
width:40%;
height : 8%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 12px; 
color:#b5b2b2;
font-weight: bold;
margin-top : -9%;
display:flex;
text-align:center;
overflow-wrap:anywhere;
padding-left:5%;
}
.c7 {
display: flex;
align-items: center;
flex-wrap: wrap;
flex-direction: column;
outline : 1px solid transparent;
width:100%;
height : 18%;
margin-top : -2%;
}
.c7 img
{
width: 38%;  
height: 54%;
border-radius: 50%;
margin-right:6%;
}
.c7 #dern_prod 
{
width:42%;    
height: 70%;    
background-color: dodgerblue;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px; 
margin-left:12%;
color:white;
display: flex;
align-items:center ;
justify-content: center;
border-radius: 10%;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.c7 a 
{ 

font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 13px; 
color: black;
}
.c8 {
outline : 1px solid transparent;
height : 18%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 12px; 
color:#b5b2b2;
font-weight: bold;
margin-top : -2%;
display:flex;
text-align:center;
overflow-wrap:anywhere;
padding-left:5%;
}
.cadre {
/*margin-top:7%;*/
width : 80%;
margin-left : 10%;
background: linear-gradient(white, 30%,#f6f6f6) no-repeat !important;
text-align : center;
border-radius :2%;
}
/*MENU DEROULANT CATEGORIES*/
 .dropdown nav {
      background-color: #333;
      padding: 10px;
    }

     .dropdown .menu {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-wrap: wrap;
    }

     .dropdown .menu > li {
      position: relative;
      margin-right: 15px;
    }

     .dropdown .menu > li > a {
      color: #fff;
      text-decoration: none;
      padding: 10px 15px;
      display: block;
    }

     .dropdown .menu > li:hover .submenu {
      display: flex;
    }

     .dropdown .submenu {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      background: #fff;
      padding: 10px;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
      flex-wrap: wrap;
      width: 600px;
      z-index: 100;
    }

     .dropdown .submenu form {
      width: 20%;
      margin: 5px 0;
    }

     .dropdown .submenu button {
      background: none;
      border: none;
      color: #333;
      text-align: left;
      cursor: pointer;
      padding: 5px;
      width: 100%;
    }

     .dropdown .submenu button:hover {
      color: #007bff;
      text-decoration: underline;
    }
/*CAROUSSEL*/
.caroussel {
display:flex;
flex-wrap: wrap;
align-items: baseline;
float: left;
text-align:center;
border-radius:5%;
backface-visibility : hidden;
background-color : white;
width : 21%;
height : 42%;
text-align : center;
min-width : 10%;
max-width : 30%;
min-height : 42%;
/*border :3px blue solid;*/
box-shadow : 3px 3px 3px 3px rgb(0, 0, 0, 0.5);
margin :2%;
overflow: hidden;
}
.carr {
border : blue solid 3px;
outline : 3px solid #42A5F5;
width : 10%;
height : 0%;
float : left;
text-align : center;
background-color : white;
margin : 0%;
}
* {
box-sizing : border-box;
}
.caroussel_content {
padding-top : 5%;
width : 100%;
}
.caroussel-image {
height : 100%;
width : 100%;
display : flex;
flex-wrap: wrap;
margin : 0.5%;
/*flex-wrap : nowrap;*/
/*position : relative;*/
/*animation : mysecond 40s -20s ease infinite;*/
}

.caroussel-image img:hover
{
/* position:absolute;*/
/*-ms-transform: scale(2); /* IE 9 */
/*webkit-transform: scale(2); /* Safari 3-8 */
/*transform: scale(2); */
/*translatey:150px;*/
}
/*CAROUSSEL TROC*/
Tc1
{
outline : 1px solid transparent;
height : 47%;
top : -10%;
overflow:hidden ;
}
.Tc2 {
outline : 1px solid transparent;
/*top : -5%;*/
/*justify-content : center;*/
height : 47%;
width: 100%;
}
.Tc2 img
{
background-position : center bottom;
width :100%;
height : 92%;
backface-visibility : hidden;   
}
.Tc3 {
padding-top: 1%;   
display:block;    
/*word-break: break-word;*/
/*overflow-wrap: break-word;*/    
/*outline : 1px solid transparent;*/
height : 10%;
margin-top : 0.05%;
text-align: left;
padding-left:5%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 18px; 
color: black;
font-weight: bold;
}
.tc3 a
{font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 18px; 
color: black;
}
.Tc4 {
outline : 1px solid transparent;
height : 13%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 12px; 
color:#b5b2b2;
font-weight: bold;
margin-top : -2%;
display:flex;
text-align:center;
overflow-wrap:anywhere;
padding-left:5%;
}
.Tc4 a
{
/*margin-left: 12%;*/    
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 14px; 
color:#b5b2b2;
} 
.Tc4 img
{
/*width: 8%;*/  
height: 50%;
/*border-radius: 50%;*/
/*margin-right:3%;*/
}

.Tc5 {
display: flex;
outline : 1px solid transparent;
height : 8%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-weight: bold;
font-size : 15px; 
color:#b5b2b2;
/*font-weight: bold;*/
padding-left:5%;
}
.Tc5 img
{
width: 8%;  
height: 50%;
border-radius: 50%;
/*margin-right:3%;*/
}
.Tc5 a
{
/*margin-left: 12%;*/    
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 14px; 
color:#2169ec;
} 
.Tc6 {
display: flex;
/*align-items:flex-start ;*/
outline : 1px solid transparent;
height : 10%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 15px; 
font-weight: bold;
padding-left:5%;
}
.Tc6 img
{
width: 50%;  
height: 70%;
border-radius: 50%;
margin-right:6%;
}
.Tc6 #dern_prod 
{
width:48%;    
height: 93%;    
background-color: dodgerblue;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px; 
margin-left:12%;
color:white;
display: flex;
align-items:center ;
justify-content: center;
border-radius: 10%;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.Tc6 a 
{ 
display:flex ;  
justify-content:center;
align-items: center;
cursor: pointer;    
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 13px; 
color: black;
}
.Tc7 {
outline : 1px solid transparent;
height : 18%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 12px; 
color:#b5b2b2;
font-weight: bold;
margin-top : -2%;
display:flex;
text-align:center;
overflow-wrap:anywhere;
padding-left:5%;
}
.Tc8 {
outline : 1px solid transparent;
height : 18%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 12px; 
color:#b5b2b2;
font-weight: bold;
margin-top : -2%;
display:flex;
text-align:center;
overflow-wrap:anywhere;
padding-left:5%;
}
.Tcontainer {
    overflow: hidden;
    /* Cache les éléments qui dépassent du container */
}
/* Définition du carousel */
.Tcarousel {
    position: relative;
    /* Le carousel est positionné relativement à son parent */
}
/* Définition de l'élément contenant les diapositives */
.Tcarousel-inner {
    /*display:flex;*/
   /* height: 150vh;*/
   /* flex-wrap: nowrap;*/
   /* align-items: baseline;*/
    float: left;
    width: 23%;
}
.Tcaroussel {
/*text-align:center;*/
border-radius:5%;
backface-visibility : hidden;
background-color : white;
/*width : 21%;*/
/*height : 100%;*/
text-align : center;
/*min-width : 10%;*/
/*max-width : 30%;*/
/*max-height : 70%;*/
/*border :3px blue solid;*/
box-shadow : 3px 3px 3px 3px rgb(0, 0, 0, 0.5);
margin :7%;
overflow: hidden;
}
.Tcarr {
border : blue solid 3px;
outline : 3px solid #42A5F5;
width : 10%;
height : 0%;
float : left;
text-align : center;
background-color : white;
margin : 0%;
}

.Tcaroussel_content {
padding-top : 5%;
width : 100%;
}
.Tcaroussel-image
{
/*height : 110%;*/
width : 100%;
/*display : flex;*/
/*flex-wrap: wrap;*/
margin : 0.5%;
/*flex-wrap : nowrap;*/
/*position : relative;*/
/*animation : mysecond 40s -20s ease infinite;*/
}
.Tcaroussel-image img:hover
{
/* position:absolute;*/
/*-ms-transform: scale(2); /* IE 9 */
/*webkit-transform: scale(2); /* Safari 3-8 */
/*transform: scale(2); */
/*translatey:150px;*/
}
.optgroup
{
width:30%;
display: flex;
}
.gen
{
width:300%; 
     display: flex; /* Utilisation de flexbox */
            justify-content: flex-start; /* Alignement horizontal des sous-menus */
            gap: 10px; /* Espacement entre les sous-menus */
            flex-wrap: wrap
}
.categorie
{
padding: 9px;
}
.categorie area
{
width:80%
}
.categorie_titre
{
width:80%;
height: 15%;
}
.categorie tr 
{
width: 40%;
margin: 5%;
padding: 9px;
}
.categorie_image
{
width:70%;
border-radius:50%;
}
.categories
{
width:80%;    
margin-left : 18%;
font-family : fantasy;
color:#6868f1;
font-size: 25px;    
position: absolute;
top: 108%;
}
.categories a 
{
color:#6868f1;
font-size: 15px;      
margin-left: 40%;
font-weight : bold;
font-family : "system-ui";
}
.categorie1
{
display: flex;
margin-top:7%;
/*position: absolute;   */ 
width:90%;
height: 30%;
border-radius :5%;
justify-content: center;
}
.categorie2
{
display: none;
margin-top:7%;
/*position: absolute;   */ 
width:90%;
height: 30%;
border-radius :5%;
justify-content: center;
}
.container .titre
{
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
font-weight : bold;  
}
.cp
{
display:flex;
align-items: center;
justify-content: center;
margin-left: 2%;
margin-right:2%; 
width:50%;
height: 70%;  
border-radius :5%;
border: 2px solid ;
margin-top:6%;
margin-left:5%;
}    
.cp img
{
display: flex; 
align-items: center;
justify-content: center;
margin-left: auto;
margin-right: auto;    
width:90%;
height:50%;   
max-width: 70%;
}

.clear {
display : block;
float : unset;
position : unset;
content : "";
}
#colonne1, #colonne2, #colonne3 {
float : left;
height : 470px;
width : 23%;
padding : 0 10px;
}
.comment
{
border : blue solid 3px;
background-color: #f9f9f9;
}
.conteneur
{
display:flex;
flex-wrap: nowrap; 
word-break: break-word;
overflow-wrap: break-word; 
}
.conteneur_profil
{
display:flex;
width: 100%;
/*flex-wrap: nowrap; */
word-break: break-word;
overflow-wrap: break-word; 
}
.conteneur_profil_wrap
{
display: flex;
flex-direction: column;
flex: 1    
}
.contenu_carou_auto {
width : 100%;
height : 52%;
overflow : hidden;
}
.connexion {
text-align : center;
}
.connexion-titre {
width:46%;
/*font-size : 18px;*/

/*background : linear-gradient(blue, 1%, white);*/
/*box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);*/
margin-left : 27%;
margin-right : 27%;
}
.connexion_content > form {
width : 100%;
text-align : center;
}
.connexion_content > .glabel {
font-weight : bold;
width : 200%;
height : 5%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
}
.connexion_content > .ginput {
border-radius : 10rem;
width : 80%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
background-color : #E5E5E5;
}
.connexion_input {
width : 37%;
border : none;
box-shadow : 3px 3px 0 rgb(0.5, 0.5, 0.5, 0.5);
margin-left : 38%;
padding-top : 2.5%;
height : 10%;
text-decoration : none;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
font-weight : bolder;
background : linear-gradient(blue, 30%, white);
}
#del
{
/*position: absolute;*/
/*width: 60%;*/
/*margin-right: -12%;*/
/*height: 1%;*/
/*top: 162%;*/
/*left: 72.7%;*/
}
#del_profil
{
/*position: absolute;*/
width: 22%;
margin-right: -12%;
height: 1%;
/*top: 162%;*/
/*left: 72.7%;*/
}
#delete
{
/*position: absolute;*/
width: 50%;
margin-right: -9%;
height: 10%;
/*top: 111%;*/
/*left: 72.8%;*/
}
.deroulant {
border-radius : 10rem;
width : 40%;
height : 90%;
background-color : #E5E5E5;
/*margin-left : 5%;*/
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 15px;
padding-left : 4%;
/*margin-top : 4.5%;*/
}
#ecrire
{
width: 20%;
height: 20%;
margin-right: 80%;
}
.empty_space
{
width:100%;   
position: absolute;
height: 9%;
top: 9%;
}
.erreur {
background : #ff0000;
padding : 5px;
margin : 5px;
color :white;
}
.etoile_content {
height : 10%;
}
.espace_pub
{
width : 80%;
overflow-wrap: break-word;
}
.etoile {
width : 20%;
left : 50%;
top : 50%;
margin-left : 34%;
float : none;
transform : translate(35%,0%);
}
.evaluation
{
/*width : 80%;*/
flex: 1;
}
.evaluation_titre
{
margin-top: 8%;
width : 80%;
text-decoration: none;
font-size: 20px;
font-family: "Amazon Ember", Arial, sans-serif;
color: #6868f1;
font-weight: bold;
}

.float_nul {
content : "";
}
.footer {
background : #000;
text-align : center;
padding : 7px;
display : block;
float : left;
width : 100%;
display : block;
}
.fiche_content {
margin-left : 5%;
text-align : center;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
/*float: left;*/
}

.fiche_box1 {
margin-left : 29%;
margin-top : 10%;
width : 30%;
font-size : 24px !important ;
font-family : "Amazon Ember", Arial, sans-serif;
text-align : center;
}
.fiche_content a {
font-size : 20px !important ;
font-family : "Amazon Ember", Arial, sans-serif;
text-decoration :solid;
}
.fiche_box2 {
flex : 1 1 0;
width : 30%;
float : left;
margin-top : 5%;
font-size : 24px !important ;
font-family : "Amazon Ember", Arial, sans-serif;
margin-left : 10%;
}
.fiche_box3 {
flex : 1 1 0;
width : 19%;
height : 45%;
float : left;
margin-top : 5%;
margin-left : 15%;
font-size : 24px !important ;
font-family : "Amazon Ember", Arial, sans-serif;
border : black blue 3px;
text-align : center;
text-decoration : none;
}
.fiche12, .fiche13, .fiche14, .fiche15, .fiche16, .fiche17, .fiche18, .fiche19, .fiche191, .fiche192, .fiche193 
{
overflow-wrap:anywhere;
font-size : 17px  ;
font-family : "Amazon Ember", Arial, sans-serif;
color: #6868f1;
}
.fiche12 a, .fiche13 a, .fiche14 a, .fiche15 a, .fiche16 a, .fiche17 a, .fiche18 a, .fiche19 a, .fiche191 a, .fiche192 a, .fiche193 a 
{
color: #6868f1;
}
.fiche10 {
font-size : 12px;
text-decoration : none;
margin-top : 5%;
flex-grow : 1;
}
.fiche10 img {
top: 19%;
left: 17%;
height: 28%;
width: 40%;
margin-left: 15%;
border-radius:50%;
}
.fiche11 {
margin-top : 5%;
flex-grow : 1;
}
.fiche14 img {
height : 1%;
}
.fiche14 img {
height : 2%;
width : 40%;
}
.fiche15 
{

}

.fiche17 
{
}
.fiche18 
{
}
.fiche18 img {
width: 6% ;   
text-align : center;
}
.fiche19 
{
text-decoration : none;
}
.fiche19 td
{
width: 30%;
border: 3px solid blue;
padding: 9px;
margin: 5%;    
}
.proposition img {
width: 45% ;   
}
.proposition table
{   
width: 95%;
margin-left:3%;
}
.proposition tr 
{
width:60%;    
color: #6868f1;
}
.proposition td
{
width: 30%;
border: 2px solid #6868f1;
padding: 9px;
margin: 5%;   
color: #6868f1;
}
 #acc
{
width: 98%;
border: 2px solid #6868f1;
padding: 16px;
margin: 5%;   
color: #6868f1;
/*display: flex;*/
/*justify-content: center;*/
}
 #acc form
{
display:flex
}
.fiche21 {
text-align : center;

font-size : 12px;
font-size : 20px;
}
.fiche22 {
text-align : center;

font-size : 12px;
text-decoration : none;
}
.fiche23 {
text-align : center;
font-size : 12px;
text-decoration : none;
}
.fiche24 {
text-align : center;

}
.fiche27 {
font-size : 10px;
text-decoration : none;
}
.fiche29 table {
border : 2px;
height : 9%;
}
.fiche29 th {
background-color : grey;
}
.fiche29 td {
font-weight : bold;
}
.fiche30 img {
height : 3%;
width : 30%;
margin-top : 10%;
}
.fiche_profil
{
display: flex;
flex-direction: column;
border-radius: 15%;
box-shadow: 0 0 15px black;    
font-weight : bold;
padding:5%;  
/*margin-left:3%;   */ 
text-align:left;    
width:30%;
height:50%;
background-color: #f1e1cbf2;
/*border:3px blue solid ;*/
word-break: break-word;
overflow-wrap: break-word; 
}
.fiche_profil2
{
font-weight : bold;
padding:5%;
margin-left:3%;     
width:30%;
height:50%;
word-break: break-word;
overflow-wrap: break-word; 
border:3px blue;
}
.fiche_profil3
{
font-weight : bold;
padding:5%;
margin-left:3%;         
width:30%;
height:50%;
word-break: break-word;
overflow-wrap: break-word; 
border:3px blue;
}
.fiche_produit
{
border:3px blue;
width:90%;
border: 3px blue;
width: 40%;
border-radius:5%;
background-color: #f1e1cbf2;
}
.fiche_produit tr
{
border:3px blue;
/*width:17%;*/
margin:2%;   
display: inline-table;
}
figure {
position : absolute;
height : 208px;
width : 127px;
}
.formulaire {
/*font-weight : bold;*/

}
.formulaire > .border
{
text-align : center;  
}
.formulaire h2 
{
  width : 40%;  
}
.formulaire nav {
width : 100%;
font-size : 18px;
position : sticky;
top : 0;
}
.formulaire > nav > ul {
display : flex;
text-align : center;
height : var(--hauteur-menu);
}
.formulaire nav > ul {
list-style-type : none;
}
.menu nav > ul > li {
background-color : white;
position : relative;
height : 100%;
flex : 1;
}
.menu1 img
{
width: 81%;
border-radius: 50%;   
box-shadow : 0 0 15px black;
}
.menu2 img
{
width: 81%;
border-radius: 50%;   
box-shadow : 0 0 15px black;
}
.menu3 img
{
width: 81%;
border-radius: 50%;   
box-shadow : 0 0 15px black;
}
#formulaire > nav > ul > li > .a {
position : absolute;
top : 50%;
left : 50%;
transform : translate(-50%,-50%);
}
#formulaire > nav > li .a 
{
text-decoration : none;
}
.Flabel {
width : 200%;
height : 5%;
font-family : "« Arial Narrow »", Arial, sans-serif;
}
.F-input {
text-align: left;
padding-left: 2%;   
width: 40%;   
height:7%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.F-input_area {
height : 10%;
width : 80%;
margin-left : 10%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
background-color:#cdddf2 ;
color:darkmagenta;   
}
h1
{
margin-left:10%;
color: #6868f1;
}
#pseudo {
height : 20%;
width: 40%;     
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#ville
{
width: 30%;
height : 20%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#code_postal
{
width: 20%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#adresse
{
height: 15%;
vertical-align: top;
padding-top: 2%;
padding-bottom: 6%;
width: 40%;     
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#adresse_area {
width : 80%;
height:20%;
margin-left : 10%;
padding-left: 2%;   

background-color:#cdddf2 ;
color:darkmagenta;   
}
.description1_area {
width : 80%;
height:20%;
margin-left : 10%;
padding-left: 2%;   
background-color:#cdddf2 ;
color:darkmagenta;   
}
.valeur_area {
width : 80%;
height:20%;
margin-left : 10%;
padding-left: 2%;   
background-color:#cdddf2 ;
color:darkmagenta;   
}
.echange_area {
width : 80%;
height:20%;
margin-left : 10%;
padding-left: 2%;   
background-color:#cdddf2 ;
color:darkmagenta;   
}
#pseudo
{
width: 40%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#mdp
{
width: 40%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#nom
{
width: 40%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#prenom
{
width: 40%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#email
{
width: 40%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#ville
{
width: 40%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#cp
{
width: 40%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}
#departement
{
width: 40%;
height : 5%;
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
padding-left: 2%;   
}

.footer {
display : block;
}
.Glabel {
width : 200%;
height : 5%;
font-family : "« Arial Narrow »", Arial, sans-serif;
}
.Ginput {
border-radius : 10rem;
width : 80%;
padding-left : 5%;
margin-left : 10%;
font-family : "« Arial Narrow »", Arial, sans-serif;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
border : none;
font-size : 20px;
background-color : #cdddf2 ;
}
h2 
{
color:#6868f1;
/*border: 3px blue solid;*/
width: 40%;
text-align:center;
margin-left: 30%;
font-size : 30px;
}
h3 {
color:#6868f1;
width:46%;
font-size : 30px;
margin-left : 27%;
margin-right : 27%;

}
header {
background : #42A5F5;
padding : 5px;
display : block;
}
header:after {
content : "";
display : block;
clear : both;
overflow : hidden;
}
header .conteneur {
margin : 0 auto;
height : 50%;
padding : 2%;
}
header .conteneur:after {
content : "";
display : block;
clear : both;
overflow : hidden;
}
header .a-haut {
text-decoration : none;
max-width : 10%;
position : inherit;
}
.hidden {
position : absolute;
top : -9999px;
left : -9999px;
}
.img-zoom-container {
  position: relative;
}
.img-zoom-container img{
  width:200px;  
  height: 200px;
   object-fit: cover;
  margin-top: -9.5%;
  min-width: 100%;
  min-height: 70%;
  border-radius:5%;
  cursor:pointer;
}
.img-zoom-container img:onclick{
 -ms-transform: scale(2); /* IE 9 */
 -webkit-transform: scale(2); /* Safari 3-8 */
  transform: scale(2); 
}
.img-zoom-lens {
  position: absolute;
  border:3px blue;
  width: 40px;
  height: 40px;
}
.img-zoom-lens:out {
 function:outImage()  
}
.img-zoom-result {
  border:3px blue;
  width: 300px;
  height: 300px;
  background-size:300%;
}
.img-logo {
width : 9%;
margin-top : 0%;
position : absolute;
top : 7%;
left:1%;
}
#interactive
{
max-height: 400px; /* ou ce que tu veux */
overflow-y: auto;    
 scrollTop : scrollHeight;
}

.myresult
{
background-size: 300%;    
}
.Flabel {
width : 200%;
height : 5%;
font-family : "« Arial Narrow »", Arial, sans-serif;
color: #6868f1;
}
.Finput .password-icon {
  display: flex;
  align-items: center;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  width: 20px;
  color: #f9f9f9;
  transition: all 0.2s;
}
.Finput .password-icon:hover {
  cursor: pointer;
  color: #ff4754;
}
.Finput .password-icon .feather-eye-off {
  display: none;
}
.Finput {
width : 40%;
border : none;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
background-color : #E5E5E5;
}
#img_01 {
left : 80%;
width : 76%;
height : 57%;
position : absolute;
background-color : white;
top : -68%;
margin-left : 44%;
}
.include {
text-align : center;
display : block;
}
.index_container
{
display: flex;    
flex-wrap: wrap;
width: 100%;
height: 100%;
margin-top: 3%;
}
.index_container a 
{
    width: 20%;
    height: 10%;
    background: linear-gradient(white, 30%,#0606f16b );
    margin-left: 40%;
    text-align: center;
    font-family: "bold font";
    font-size: 22px;
    font-weight: bold;
    border-radius: 5%;
    color: #6868f1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10%;
}
.index_container h2
{
height: fit-content;    
}
.index_container img
{
width: 60%;    
margin-bottom: 15%;
}
.index_container figcaption
{
/*width:fit-content;*/
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
font-weight:bold;
}
.index_container figure
{
width:25%;   
position: unset;
margin-bottom: 5%;
}
.information 
{
    flex: 1;
text-align : center;
width :100%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 17px;
/*border: 3px blue solid;*/
/*margin-left: 4%;*/
}
.information .titre_propose
{
width: 100%;
}
.information .carousel-inner
{
display: flex;
flex-direction:column;
 height: auto;  
}
.information .caroussel-image
{
display: block;
height: 150vh;
margin-bottom: 7%;
}
.information .c3
{
WIDTH:100%;
}
.information .c4
{
height: 15%;    
WIDTH:100%;
}
.information .c4 img
{
height: 90%;    
WIDTH:100%;
}
/*elargissement de .information si div en dessous*/

      .conteneur_profil_wrap[data-expand-c=true] .information {
        position: relative;
        left: -25%;
        width: 100%;
        top: auto;
        bottom: 0;
      } 
.information .c5
{
height: 16%; 
width:45%;  
}
.information .c6
{
height: 12%; 
width:45%;  
}
.information  table
{
width: 80%;
margin: 5%;  
}
.information tr {
width : 15%;
padding : 9px;
margin: 2%;
}
.information td {
padding : 9px;
text-align : center;

margin:5%
}
.information img {
right: 35%;
}
.information #info_image
{   
left: 27%;
width: 11%;
height: 23%;
border-radius: 50%;
}
.information > table > tr > td > a > .delete
{
width : 2%;
}
.inscription {
text-align : center;
margin-left : 5%;
width : 80%;
}
.inscription a {
width : 80%;
padding-left : 0%;
margin-left : 6%;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
height : 10%;
text-decoration : none;
}
#inscription > input[type="image"], .i {
height : 15%;
width : 20%;
background-repeat : no-repeat;
background-size : 100% 100%;
}
.intro-content {
text-align : center;
}
@keyframes rotationFleche {
0% {
transform : rotate(0deg);
}
50% {
transform : rotate(45deg);
}
100% {
transform : rotate(90deg);
}
}
@keyframes apparitionSousMenu {
0% {
box-shadow : 0 3px 3px 1px rgb(0, 0, 0, 0);
border-top : 3px solid #2169EC;
}
30% {
box-shadow : 0 3px 3px 1px rgb(0, 0, 0, 0.8);
}
100% {
max-height : 50em;
border-top : 3px solid #2169EC;
box-shadow : 0 3px 3px 1px rgb(0, 0, 0, 0.8);
}
}
@keyframes myAnim {
0% {
transform : scale(5);
}
100% {
transform : scale(6);
}
}
@keyframes mysecond {
0% {
left : 0%;
top : 0;
}
15% {
left : -15%;
top : 0;
}
30% {
left : -30%;
top : 0;
}
45% {
left : -45%;
top : 0;
}
60% {
left : -60%;
top : 0;
}
75% {
left : -75%;
top : 0;
}
90% {
left : -90%;
top : 0;
}
100% {
left : -105%;
top : 0;
}
}
.lien_table {
display : block;
width : 100%;
height : 100%;
}
.logo {
height : 12%;
WIDTH: 16%;
}
.menu_barre
{
width: 98%;
height:18%;
border-radius:2%;
background: linear-gradient(#0606f16b, 30%, white) no-repeat;
margin-left: 1%;
top: 2%;
z-index:4;
}
.menu1
{
align-self: center;    
z-index:2;
padding-top:5%;
margin-right: 12%;
}
.menu2
{
align-self: center;    
z-index:2;
padding-top:5%;
margin-right: 17%;
}
.menu3
{
align-self: center;    
z-index:2;
padding-top:5%;
margin-right: 16%;
}
.menu-deroulant_ajouter
{
display : block;
}
.menu-deroulant_ajouter .border {
margin : 5%;
border :2px blue solid ;
border-bottom-style:hidden ;
border-right-style:hidden ;
box-shadow : 3px 3px 3px 3px rgb(0, 0, 0, 0.5);
padding-left:3%;
text-align: center;
bottom: 0%;
position: relative;
}
.menu-deroulant 
{
display : block;
}
.menu-deroulant > .md:hover
{
background-color : antiquewhite;
}
.menu-deroulant > option > .md2 
{
font-weight : bolder;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 70px;
}
.hover > .md2:hover 
{
background-color : antiquewhite;
}
.menu-deroulant > a:after 
{
content : '❯';
font-size : 45px;
margin-left : 7px;
display : inline-block;
background-color : antiquewhite;
}
.menu-deroulant:hover > a:after 
{
animation : rotationFleche 0.2s linear forwards;
background-color : antiquewhite;
}
.menu-deroulant > nav
{
width : 30%;
font-size : 18px;
position : sticky;
top : 0;
margin-left : 12%;
background-color : antiquewhite;
}
.menu-deroulant > nav > ul
{
display : flex;
height : var(--hauteur-menu);
background-color : antiquewhite;
}
.menu-deroulant > nav > ul
{
list-style-type : none;
}
.menu-deroulant > .hover
{
display : contents;
max-height : 15%;
height : 22%;
font-weight : bolder;
}
.menu-deroulant > .hover:hover > .sous-menu
{
animation : apparitionSousMenu 1s forwards;
}
.menu-deroulant > .hover:after > .sous-menu
{
animation : apparitionSousMenu 1s forwards;
}
.menu_gras
{
font-weight : bolder;
background-color : red;
}
.menu_content 
{
height : 10%;
}
.menu_content_responsive
{
height : 20%;
position : relative;
margin-top : 5%;
}
.menuItems
{
width:40% ;
margin-top : -1%;
margin-left: 18%;
}
.menuItems nav ul li a 
{
text-decoration : none;
justify-content: center;
}
.menuItems nav 
{
font-size : 18px;
}
.menuItems nav > ul
{
display: flex;
margin-right:5%;
}
.menuItems nav > ul 
{
list-style-type : none;
}
.menuItems nav > ul > li
{
/*text-align : center;*/
}
.menuItems nav > ul > li > .a
{
position : absolute;
top : 50%;
left : 50%;
transform : translate(-50%,-50%);
display : table-cell;
vertical-align : middle;
}
.menuItems li .a 
{
text-decoration : none;
}
.menuItems3 {
width : 75%;
margin-top : 1%;
display:inline-flex;
margin-left: 25%;
}
.menuItems3 nav ul li a 
{
display : flex;
text-decoration : none;
justify-content: center;
}
.menuItems3 nav 
{
font-size : 18px;
}
.menuItems3 nav > ul
{
display: flex;
margin-right:5%;
}
.menuItems3 nav > ul
{
list-style-type : none;
width: 50%;
}
.menuItems3 nav > ul > li
{
font-weight : bold;
margin-left : 3%;
margin-right : 3%;
background : linear-gradient(0.25turn, white, 20%, orange);
}
.menuItems3 nav > ul > li > .a
{
position : absolute;
top : 50%;
left : 50%;
transform : translate(-50%,-50%);
display : table-cell;
vertical-align : middle;
}
.menuItems3 li .a
{
text-decoration : none;
}
.section
{
width:50%;
}
.messagerie {
text-align : center;
}
.messagerie table
{
height: 100%;
margin: 3%;
width: 93%;
}
.messagerie tr 
{
height : 80%;
width : 100%;
}
.messagerie td
{
height : 80%;
width : 100%;
border : blue solid 3px;
}
.messagerie tr td .Jinput 
{
border : none;
background-color : white;
height : 100%;
box-shadow : none;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
}
.messagerie img 
{
height : 5%;
width : 3%;
}
.miniature1 
{
margin-left : 49%;
height : 25.5%;
width : 33%;
background-color : white;
}
.fiche11 figcaption 
{
font-weight : bolder;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
}
.miniature1 a data-zoom-image
{
height : 300%;
background-color : white;
}
.miniature1 img, .miniature2 img, .miniature3 img, .miniature4 img, .miniature5 img, .miniature6 img {

}
.miniature1 img:hover, .miniature2 img:hover, .miniature3 img:hover, .miniature4 img:hover, .miniature5 img:hover, .miniature6 img:hover
{
z-index : 5;
transform : scale(1.55);
box-shadow : 0 0 10px black;
background-position : 15% 15%;
background-color : white;
}
.miniature5 span
{
font-size : 14px;
}
.miniature_content 
{
margin-top : 5%;
margin-left : 20%;
width : 30%;
}
.modif_mdp
{
text-align : center;
border : 2px;
}
.modif_mdp h2
{
width : 50%;
margin-left : 24%;
}
nav ul li:hover span .fiche11 
{
display : none;
}
nav ul li a:hover ~ #img_01
{
top : 194px;
}
.none {
display : none;
}
.nveau_msg  .nv_img
{
position: absolute;
top: 7%;
width: 7%; 
border-radius:50%;
margin-left:81%;
}
.menuItems nav > ul > .nveau_msg
{
background-color:white;
padding-left: 11%;
width:auto;
}
.menuItems nav > ul >  .nveau_msg img
{
width:220%;  
padding : 5px 0 5px 0;
border:3px blue;
}
.nveau_msg
{
margin-left: 1%;    
}
p1, p2, p3, p4 
{
position : absolute;
float : left;
display : block;
}
.optgroup label 
{
font-weight : bolder;
}
option > md {
background-color : green;
font-weight : bolder;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 40px;
}

.proposition
{
padding: 2%;
text-align : center;
background-color:#f1e1cbf2 ;
width: 80%;
height: auto;
margin-left: 5%;
border-radius: 2%;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
flex:1;
/*top: 38%;*/
/*position: relative;*/
/*left: 52%;*/
/*text-align: center;*/
/*display: flex;*/
/*flex-direction: column;*/
/*align-items: center;*/
}
.proposition h2
{
margin-left:0%
}
.prop_content
{
display: flex;
flex-wrap: wrap;   
width:40%;
margin-bottom:21% ;    
}
.proposition_container
{
display:flex;
flex-direction: column;   
width: 60%;
}
.prop1
{
width:32%;    
height: 12%;    
background-color: dodgerblue;
display: flex;
align-items:center ;
justify-content: center;
border-radius: 5%;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);    
margin-left: 30%;
margin-top:10%;
/*margin-bottom: 100%;*/
}
.prop1 button,.prop2 button {
width: 100%;
/*display: flex;*/
/*align-items:center ;*/
/*justify-content: center;*/
border-radius: 5%;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
/*position: absolute;*/
/*right: 22%;*/
/*top: 101%;*/
background-color: dodgerblue;
color:white;
font-weight : bolder; 
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px; 
}
.prop2 {
width:32%;    
height: 12%;    
margin-top: 5% ;
/*display: flex;*/
/*align-items:center ;*/
/*justify-content: center;*/
border-radius: 5%;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
margin-left: 30%;
margin-top:10%;
}
.prop2 a
{
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px; 
/*margin-left:12%;*/
color:white; 
font-weight : bolder;
}
#photo_proposition
{
right: 28%;
 width: 8%;
height: 20%;
position: absolute;
border-radius: 50%;
}
.searchbox
{
border: none;
text-align: center;
margin-left: 27%;
}
.searchbox:hover
{
left:0%;
}
#searchbox > deroulant
{
margin-left : 5%;
}
#searchbox > input[type="text"] 
{
border-radius : 10rem;
padding : 5px 0 5px 0;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 12px;
font-style : italic;
width : 90%;
display : inline-table;
vertical-align : top;
}
#searchbox input[type="»textarea"] 
{
background : transparent;
padding : 5px 0 5px 0;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 12px;
font-style : italic;
width : 77%;
display : inline-table;
vertical-align : top;
}
#searchbox > input[type="image"]
{
width : 30%;
height : 99%;
background-repeat : no-repeat;
background-size : 100% 100%;
margin-left : 5%;
}
select
{
height : 8%;
width : 36%;
background-color : #E5E5E5;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
}
.options 
{
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 30px;
}
.q 
{
width: 65%;    
margin-top:-5.5%;   
border-radius : 10rem;
height : 25%;
}
#searchbox > .select 
{
width : 30%;
margin-left : 5%;
}
.sous-menu {
text-align : left;
background-color : white;
overflow : hidden;
}
.sous-menu > table > tbody > tr > td > li
{
background-color : white;
position : relative;
height : 100%;
flex : 1;
margin-left : 25%;
}
.sous-menu > table > tbody > tr > td > li > .a 
{
position : absolute;
top : 50%;
left : 50%;
transform : translate(-50%,-50%);
}
.sous-menu > table > tbody > tr > td > .a 
{
text-decoration : none;
}
.sous-menu > table > tbody > tr > td > li > .a
{
height : 50px;
padding-left : 20px;
width : 100%;
align-items : center;
display : flex;
}
.sous-menu > table > tbody > tr > td > li:hover 
{
background-color : rgb(33, 105, 236, 0.3);
}
.sous-menu > li:hover > a 
{
margin-bottom : 5%;
}
.sous-menu > table
{
width : 100%;
}
.sous-menu1, .sous-menu2, .sous-menu3 
{
width : 100%;
text-align : left;
background-color : white;
border-radius : 2px;
overflow : hidden;
max-height : 0;
}
.sous-menu1 > li > .a, .sous-menu2 > li > .a, .sous-menu3 > li > .a 
{
height : 50px;
padding-left : 20px;
width : 100%;
align-items : center;
display : flex;
}
.sous-menu1 > li:hover, .sous-menu2 > li:hover, .sous-menu3 > li:hover
{
background-color : rgb(33, 105, 236, 0.3);
margin-top : 20%;
}
.sub {
width : 30%;
height : 15%;
background : linear-gradient(blue, 30%, white);
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
font-weight : bold;
}
#supprime
{
position: absolute;
width: 6%;
height: 15%;
top: 72%;
left: 72.5%;
}
#supprimme
{
position: absolute;
width: 6%;
height: 10%;
margin: -3%;
left: 61.5%;
}
.titre
{
margin-left : 60%;
font-family : fantasy;
color:#6868f1;
font-size: 25px;
}
.titre_content 
{
height : 5%;
}
td
{
width : 20%;
padding : 9px;
margin : 5%;
text-align : center;
}
.td1
{
width : 24%;    
height : 10%;
padding : 1.5%;
}
.td2
{
width : 22%;    
height : 20%;    
padding : 1.5%;

}
.td2 img
{
left: 25%;
width: 15%;
height: 8%;
border-radius: 50%;
position: unset;
}
.td3
{
width : 40%;    
height : 10%;    
padding : 1.5%;
}
.td4 {
width : 40%;    
height : 10%;    
padding : 1.5%;
}
.td4 img 
{
left: 25%;
width: 14%;
height: 24%;
border-radius: 50%;
position: unset;
}
.td5
{
padding : 1.5%;
}
.td6
{
padding : 1.5%;
}
.td6 img 
{
left: 25%;
width: 14%;
height: 24%;
border-radius: 50%;
position: unset;
}
.td_fp1
{
width : 70%;    
height : 26%;    
}
.td_fp1 img 
{
left: 85%;
width: 55%;
height: 8%;
border-radius: 50%;
position: unset;
}
.td_fp2 
{
width : 60%;    
height : 10%;
}
.tbody_profil
{
border-radius: 10%;
box-shadow: 0 0 15px black; 
background-color:white;   
}
.td_profil1 
{
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 17px;
color:black;
padding: 9px;
text-align: center; 
width : 2%;    
height : 5%;
padding : 1.5%;
font-weight: bold;
background-color:white;
}
.td_profil2
{
padding: 9px;
text-align: center;
width : 4%;    
height : 16%;    
padding : 1.5%;
background-color:white;
}
.td_profil2 img 
{
/*max-width: 15%;*/
left: 25%;
width: 57%;
height: 0%;
border-radius: 50%;
position: unset;
}
.td_profil3
{
padding: 9px;
text-align: center;    
width : 6%;    
height : 10%;    
padding : 1.5%;
background-color:white;
}
.td_profil3 img
{}
.tr_profil
{
/*width : 50%;
padding : 9px;
margin: 2%;  */ 
}
.th_profil
{
width : 50%;
padding : 9px;
margin: 2%;     
font-family: "« Arial Narrow »", Arial, sans-serif;
font-size: 17px;
}
.td_troc1
{
width : 24%;    
height : 10%;
padding : 1.5%;
}
.td_troc2
{
width : 22%;    
height : 20%;    
padding : 1.5%;
}
.td_troc2 img 
{
width: 65%;
height: 8%;
border-radius: 50%;
position: unset;
}
.td_troc3
{
width : 40%;    
height : 10%;    
padding : 1.5%;
}
._troc 
{
width : 40%;    
height : 10%;    
padding : 1.5%;
}
.td_troc4 img 
{
left: 25%;
width: 14%;
height: 24%;
border-radius: 50%;
position: unset;
}
.td_troc5 
{
padding : 1.5%;
}
.td_troc6 
{
padding : 1.5%;
}
.td_troc6 img
{
left: 25%;
width: 14%;
height: 24%;
border-radius: 50%;
position: unset;
}
.td_troc7
{
padding : 1.5%;
}
.tr_troc
{
width : 50%;
padding : 9px;
margin: 2%;   
}
.th_troc
{
width : 50%;
padding : 9px;
margin: 2%;     
}
table
{
width : 100%;
}
.table img
{
height : 60%;
vertical-align : top;
margin-left : auto;
margin-right : auto;
}
.table p1 
{
height : 10%;
}
#titre_ajouter 
{
width: 40%;
margin-left:30%;
text-align : center;
background : linear-gradient(blue, 1%, white);
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
margin-left : 5%;
margin-right : 5%;
font-weight : bold;
font-family : "« Arial Narrow »", Arial, sans-serif;
font-size : 20px;
}
.menu-deroulant_ajouter .name
{
color:darkmagenta;
padding-left: 5%;
border-radius:5%; 
width: 40%;
background-color:#cdddf2 ;
height:7%;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.menu-deroulant_ajouter .categorie
{
color:darkmagenta;    
width: 40%;    
border-radius:5%; 
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.menu-deroulant_ajouter .departement
{
color:darkmagenta;    
width: 40%;    
border-radius:5%;   
background-color:#cdddf2  ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.menu-deroulant_ajouter .description1
{
color:darkmagenta;    
padding-left: 2%;
padding-top: 2%;
width: 40%;   
height:20%;
border-radius:5%;   
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.menu-deroulant_ajouter .photo1
{
color:darkmagenta;    
width: 40%;    
border-radius:5%;   
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.menu-deroulant_ajouter .valeur
{
color:darkmagenta;    
padding-left: 1%;    
width: 10%;    
border-radius:5%;   
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.menu-deroulant_ajouter .divers
{
color:darkmagenta;    
padding-left: 5%;    
width: 40%;     
border-radius:5%;   
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.menu-deroulant_ajouter .echange
{
color:darkmagenta;    
padding-left: 5%;    
width: 40%;     
border-radius:5%;
background-color:#cdddf2 ;
box-shadow : 3px 3px 0 rgb(0, 0, 0, 0.5);
}
.titre-connexion {
text-align : center;
margin-left : 31%;
margin-right : 20%;
font-weight : bold;
font-family : "« Arial Narrow »", Arial, sans-serif;
}
.titre_content {
text-align : center;
}
tr {
width : 50%;
padding : 9px;
}
.ul1, .ul2, .ul3, .ul4, .ul5, .ul6, .ul7, .ul8, .ul9 
{
position : absolute;
float : left;
}
.users {
text-align : center;
}
.users table {
height : 100%;
}
.users_table_td1 {
width : 20%;
height : 80%;
border : black solid 3px;
}
.users_table_td2 {
width : 80%;
height : 80%;
border : black solid 3px;
}
.users tr {
height : 80%;
width : 100%;
}
.validation {
background : #669933;
color :white;
padding : 5px;
margin : 5px;
}
.wrap-container a
{
text-decoration: none;
font-size: 17px;
font-family: "Amazon Ember", Arial, sans-serif;
font-weight: bold;
color: #6868f1;    
margin-left: 72%;
}