body {
    background-color: #FFFFFF;
}

.ui.menu .item img.logo {
    margin-right: 1.5em;
}

.main.container {
    margin-top: 7em;
}

.wireframe {
    margin-top: 2em;
}

.ui.footer.segment {
    margin: 5em 0em 0em;
    padding: 5em 0em;
}

*.hidden {
    display: none;
  }
  
  #bodyid .no-border{
    border:none;
  }

/**************************table ***************************************/
#table1 thead tr th,
#table1 tfoot tr th,
#table1 tbody tr td {
    padding: 2px;
    padding-left: 8px;
    padding-right: 8px;
    font-size: small;
}

#table1 tbody tr td button {
    padding: 5px;
    margin-top: 1px;
    margin-bottom: 1px;
    border: 0.005rem;
    opacity:0.75;

}

#table1 tbody tr td .icon {
margin-left: 2px;

}

#table2 thead tr th,
#table2 tfoot tr th,
#table2 tbody tr td {
    padding: 1px;
    padding-left: 8px;
    padding-right: 8px;
    font-size:small;
}

#table2 tbody tr td button {
    padding: 2px;
    margin-top: 1px;
    margin-bottom: 1px;
    border: 0.005rem;
    opacity:0.75;
    background: none;
}

#table1 tbody td img {
    display: block;
    width: 80px;
    height: 60px;
    margin: auto;
    margin-top: 3%;
    margin-bottom: 3%;
  }

  
/* Padding */

#bodyid .pl-0{
    padding-left:0% ;
  }
  #bodyid .pl-1{
    padding-left:1% ;
  }
  #bodyid .pl-2{
    padding-left:2% ;
  }
  #bodyid .pl-3{
    padding-left:3% ;
  }

  #bodyid .pl-4{
    padding-left:4% ;
  }

  #bodyid .pr-0{
    padding-right:0% ;
  }
  #bodyid .pr-1{
    padding-right:1% ;
  }
  #bodyid .pr-2{
    padding-right:2% ;
  }
  #bodyid .pr-3{
    padding-right:3% ;
  }

  #bodyid .pr-4{
    padding-right:4% ;
  }

  #bodyid .pt-0{
    padding-top:0% ;
  }
  #bodyid .pt-1{
    padding-top:1% ;
  }
  #bodyid .pt-2{
    padding-top:2% ;
  }
  #bodyid .pt-3{
    padding-top:3% ;
  }

  #bodyid .pt-4{
    padding-top:4% ;
  }

  #bodyid .pb-0{
    padding-bottom:0% ;
  }
  #bodyid .pb-1{
    padding-bottom:1% ;
  }
  #bodyid .pb-2{
    padding-bottom:2% ;
  }
  #bodyid .pb-3{
    padding-bottom:3% ;
  }

  #bodyid .pb-4{
    padding-bottom:4% ;
  }

  #bodyid .px-0{
    padding-left:0% ;
    padding-right:0% ;
  }
  #bodyid .px-1{
    padding-left:1% ;
    padding-right:1% ;
  }
  #bodyid .px-2{
    padding-left:2% ;
    padding-right:2% ;
  }
  #bodyid .px-3{
    padding-left:3% ;
    padding-right:3% ;
  }

  #bodyid .px-4{
    padding-left:4% ;
    padding-right:4% ;
  }

  #bodyid .py-0{
    padding-top:0% ;
    padding-bottom:0% ;
  }
  #bodyid .py-1{
    padding-top:1% ;
    padding-bottom:1% ;
  }
  #bodyid .py-2{
    padding-top:2% ;
    padding-bottom:2% ;
  }
  #bodyid .py-3{
    padding-top:3% ;
    padding-bottom:3% ;
  }

  #bodyid .py-4{
    padding-top:4% ;
    padding-bottom:4% ;
  }

  /* Margin */

  #bodyid .ml-0{
    margin-left:0% ;
  }
  #bodyid .ml-1{
    margin-left:1% ;
  }
  #bodyid .ml-2{
    margin-left:2% ;
  }
  #bodyid .ml-3{
    margin-left:3% ;
  }

  #bodyid .ml-4{
    margin-left:4% ;
  }

  #bodyid .mr-0{
    margin-right:0% ;
  }
  #bodyid .mr-1{
    margin-right:1% ;
  }
  #bodyid .mr-2{
    margin-right:2% ;
  }
  #bodyid .mr-3{
    margin-right:3% ;
  }

  #bodyid .mr-4{
    margin-right:4% ;
  }

  #bodyid .mt-0{
    margin-top:0% ;
  }
  #bodyid .mt-1{
    margin-top:1% ;
  }
  #bodyid .mt-2{
    margin-top:2% ;
  }
  #bodyid .mt-3{
    margin-top:3% ;
  }

  #bodyid .mt-4{
    margin-top:4% ;
  }

  #bodyid .mb-0{
    margin-bottom:0% ;
  }
  #bodyid .mb-1{
    margin-bottom:1% ;
  }
  #bodyid .mb-2{
    margin-bottom:2% ;
  }
  #bodyid .mb-3{
    margin-bottom:3% ;
  }

  #bodyid .mb-4{
    margin-bottom:4% ;
  }


  #bodyid .mx-0{
    margin-left:0% ;
    margin-right:0% ;
  }
  #bodyid .mx-1{
    margin-left:1% ;
    margin-right:1% ;
  }
  #bodyid .mx-2{
    margin-left:2% ;
    margin-right:2% ;
  }
  #bodyid .mx-3{
    margin-left:3% ;
    margin-right:3% ;
  }
  
  #bodyid .mx-4{
    margin-left:4% ;
    margin-right:4% ;
  }
  
  #bodyid .my-0{
    margin-top:0% ;
    margin-bottom:0% ;
  }
  #bodyid .my-1{
    margin-top:1% ;
    margin-bottom:1% ;
  }
  #bodyid .my-2{
    margin-top:2% ;
    margin-bottom:2% ;
  }
  #bodyid .my-3{
    margin-top:3% ;
    margin-bottom:3% ;
  }
  
  #bodyid .my-4{
    margin-top:4% ;
    margin-bottom:4% ;
  }
  
  

  /* Font */
#bodyid .f-13 {
    font-size: 13px;
}

#bodyid .f-16 {
    font-size: 16px;
}

#bodyid .f-15 {
    font-size: 15px;
}

#bodyid .f-14 {
    font-size: 14px;
}

#bodyid .f-12 {
    font-size: 12px;
}

#bodyid .f-b {
    font-weight: bold;
}

#bodyid .text-red {
    color: red;
}

#bodyid .text-blue {
    color: blue;
}

#bodyid .text-green {
    color: green;
}

#bodyid .text-gri {
    color: #aab7b8;
}

#bodyid .text-bluedark2 {
    color: #6756c8;
}

#bodyid .text-bluedark1 {
    color: #9e96cb;
}

/* mise en page */
#bodyid  .w-0 {
    width: 0%;
}

#bodyid  .w-5 {
    width: 5%;
}

#bodyid  .w-8 {
    width: 8%;
}

#bodyid  .w-10 {
    width: 10%;
}

#bodyid  .w-15 {
    width: 15%;
}

#bodyid  .w-20 {
    width: 20%;
}

#bodyid  .w-25 {
    width: 25%;
}

#bodyid  .w-35 {
    width: 35%;
}

#bodyid  .w-40 {
    width: 40%;
}

#bodyid  .w-45 {
    width: 45%;
}

#bodyid  .w-50 {
    width: 50%;
}

#bodyid  .w-55 {
    width: 55%;
}

#bodyid  .w-60 {
    width: 60%;
}

#bodyid  .w-65 {
    width: 65%;
}

#bodyid  .w-70 {
    width: 70%;
}

#bodyid  .w-75 {
    width: 75%;
}

#bodyid  .w-80 {
    width: 80%;
}

#bodyid  .w-85 {
    width: 85%;
}

#bodyid  .w-90 {
    width: 90%;
}

#bodyid  .w-95 {
    width: 95%;
}


#bodyid  .wpx-0 {
    width: 0px;
  }
  
  #bodyid  .wpx-5 {
    width: 5px;
  }
  
  #bodyid  .wpx-8 {
    width: 8px;
  }
  
  #bodyid  .wpx-10 {
    width: 10px;
  }
  
  #bodyid  .wpx-15 {
    width: 15px;
  }
  
  #bodyid  .wpx-20 {
    width: 20px;
  }
  
  #bodyid  .wpx-25 {
    width: 25px;
  }
  
  #bodyid  .wpx-35 {
    width: 35px;
  }
  
  #bodyid  .wpx-40 {
    width: 40px;
  }
  
  #bodyid  .wpx-45 {
    width: 45px;
  }
  
  #bodyid  .wpx-50 {
    width: 50px;
  }
  
  #bodyid  .wpx-55 {
    width: 55px;
  }
  
  #bodyid  .wpx-60 {
    width: 60px;
  }
  
  #bodyid  .wpx-65 {
    width: 65px;
  }
  
  #bodyid  .wpx-70 {
    width: 70px;
  }
  
  #bodyid  .wpx-75 {
    width: 75px;
  }
  
  #bodyid  .wpx-80 {
    width: 80px;
  }
  
  #bodyid  .wpx-85 {
    width: 85px;
  }
  
  #bodyid  .wpx-90 {
    width: 90px;
  }
  
  #bodyid  .wpx-95 {
    width: 95px;
  }

  #bodyid  .wpx-100 {
    width: 100px;
  }

  #bodyid  .wpx-105 {
    width: 105px;
  }

  #bodyid  .wpx-110 {
    width: 110px;
  }

  #bodyid  .wpx-115 {
    width: 115px;
  }

  #bodyid  .wpx-120 {
    width: 120px;
  }

  #bodyid  .wpx-125 {
    width: 125px;
  }

  #bodyid  .wpx-130 {
    width: 130px;
  }

  #bodyid  .wpx-135 {
    width: 135px;
  }

  #bodyid  .wpx-140 {
    width: 140px;
  }

  #bodyid  .wpx-145 {
    width: 145px;
  }

  #bodyid  .wpx-150 {
    width: 150px;
  }


#bodyid  .al-c {
    text-align: center
}

#bodyid  .al-g {
    text-align: left
}

#bodyid  .al-d {
    text-align: right
}

#bodyid  .f-8 {
    font-size: 8px
}

#bodyid  .f-10 {
    font-size: 10px
}

#bodyid  .f-9 {
    font-size: 9px
}

#bodyid  .f-10 {
    font-size: 10px
}

#bodyid  .f-11 {
    font-size: 11px
}

#bodyid  .f-18 {
    font-size: 18px
}

#bodyid  .f-20 {
    font-size: 20px
}

#bodyid  .f-24 {
    font-size: 24px
}

#bodyid  .f-28 {
    font-size: 28px
}

#bodyid  .f-32 {
    font-size: 32px
}

#bodyid  .fem-70 {
    font-size: 0.70em
}

#bodyid  .fem-75 {
    font-size: 0.75em
}

#bodyid  .fem-80 {
    font-size: 0.80em
}

#bodyid  .fem-85 {
    font-size: 0.85em
}

#bodyid  .fem-90 {
    font-size: 0.90em
}

#bodyid  .fem-95 {
    font-size: 0.95em
}

#bodyid  .fem-100 {
    font-size: 0.100em
}

#bodyid  .fem-105 {
    font-size: 0.105em
}

#bodyid  .fem-110 {
    font-size: 0.110em
}

#bodyid  .fem-115 {
    font-size: 0.115em
}

#bodyid  .fem-12 {
    font-size: 0.12em
}

#bodyid  .padd-x-30 {
    padding-left: 30%;
    padding-right: 30%;
}

#bodyid  .padd-x-15 {
    padding-left: 15%;
    padding-right: 15%;
}

#bodyid  .padd-x-10 {
    padding-left: 10%;
    padding-right: 10%;
}

#bodyid .btn:focus {
    outline: none;
    box-shadow: none;
}



#bodyid  .div-center {
    text-align: center;
    float: none;
}

#bodyid  .div-titre-encaiss {
    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;

}

#bodyid  .dot-red {
    height: 15px;
    width: 15px;
    background-color: red;
    border-radius: 50%;
    display: inline-block;
}

#bodyid  .dot-green {
    height: 15px;
    width: 15px;
    background-color: green;
    border-radius: 50%;
    display: inline-block;
}

/*   textarea     */
#bodyid textarea.textarea-autosize {
    height: 12.25rem;
    min-height: 12.25rem;
    resize: none;
    overflow-y: hidden;
}


#bodyid div.arrondi {
    background: #fff;
    padding: 0.5em 0;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    behavior: url(script/PIE.htc);
    border: solid 0.1em LightGray;
}


/* colors */
#bodyid  .txt-white {
    color: #FFFFFF;
  }
  #bodyid  .txt-grey {
    color: #CCCCCC;
  }
  #bodyid  .txt-black {
    color: #1B1C1D;
  }
  #bodyid  .txt-yellow {
    color: #F2C61F;
  }
  #bodyid  .txt-teal {
    color: #00B5AD;
  }
  #bodyid  .txt-red {
    color: #D95C5C;
  }
  #bodyid  .txt-purple {
    color: #564F8A;
  }
  #bodyid  .txt-pink {
    color: #D9499A;
  }
  #bodyid  .txt-orange {
    color: #E07B53;
  }
  #bodyid  .txt-green {
    color: #5BBD72;
  }
  #bodyid .txt-blue {
    color: #3B83C0;
  }

  #bodyid  .bg-gri5{
    background-color: darkslategrey;
  }
  #bodyid  .bg-gri5:hover{
    background-color: rgb(130, 133, 133);}

#bodyid .bg-blue1{
    background-color:  #d6eaf8 ;
  }

  #bodyid .bg-nav{
    background-color:  SteelBlue ;
    color:white !important;
  }

  #bodyid .bg-blueciel{
    background-color:  #F7F7FE ;
    border: solid 1px rgb(220, 218, 236);
  }

  #bodyid .bg-griciel{
    background-color:  #fafafa ;
    border: solid 1px rgb(220, 218, 236);
  }
  #bodyid .trans{
    background: transparent;
  }

  #bodyid .txt-header{
    color:  SteelBlue ;
  }