.my_grid{
        display: grid;
        grid-gap: 10px;
        grid-template-columns: 100px 100px 100px;
        grid-auto-columns: 100px;
        background-color: #fff;
        color: #444;
    }
    .box {
        background-color: #444;
        color: #fff;
        border-radius: 5px;
        padding: 20px;
        font-size: 150%;
        display: none;

      }
    .a {
        grid-column: 1 / 3;
        grid-row: 1;
    }
  .b {

    }
    body{
    /* set margin to 0 and overflow to hidden, to use the
    complete page*/

    overflow: hidden;
    margin: 0;
    }
    



    .bt_side{

       padding-top: 50px;



    }
    #info {
        position: absolute;
        top: 100px;
        width: 100%;
        text-align: center;
        z-index: 100;
        display:block;
        color: green;
    }
    #canvas {
             background-color: #FFF;

              }
    .accroche{
            width: 550px;
    }
    #canvas2 {

        //border: 0px none black;
        //width: 800px;
        //height: 600px;
        /*margin: 50px;*/
        //padding: 0px;
        /*position: static; fixed or static */
        /* top: 50px;
        left: 50x; */
    }
    .rightSide{

        color: white;
        width: 420px;
        height: 600px;
        font-size: large;
        /*margin-top: 50px;*/
        padding-left: 20px;
        padding-right: 20px;
        background-color: #A4A4A4
    }
    /* .blocContenu{*/
       /*  margin-left: 80px; */
       /* width: 800px;*/
        /* background: rgb(233, 233, 233); */
         /* margin-left: 50px;*/
        /* max-width: 1000px; */
     /* }*/
    .deuxBloc{
        float:left; /* the default for span */
    }
    .shadow{
    /* offset-x | offset-y | blur-radius | spread-radius | color */
    box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
    }
    .article {
    float: left;
    padding: 20px;
    width: 70%;
    background-color: #f1f1f1;
     /*height: 300px; only for demonstration, should be removed */
    }
    .test {
    float: left;
    width: 30%;
    /*height: 300px;*/ /* only for demonstration, should be removed */
    background: #ccc;
    padding: 20px;
    }

    .loader {
      margin-top:-30px;
      margin-left:-30px;
      border: 16px solid #f3f3f3;
      border-radius: 50%;
      border-top: 16px solid #DF0101;/*#3498db*/
      width: 60px;
      height: 60px;
      -webkit-animation: spin 2s linear infinite; /* Safari */
      animation: spin 2s linear infinite;
      float:left;
      position:absolute;
        z-index: 2;


    }

.my_loader{
    position:relative;
    //margin-top: 0px;
    //margin-left: 0px;
    float: left;
    top: 50%;
    left: 50%;

}

.my_loader_text{
    padding: 0px;
    margin: 0px;
    z-index: 25;
}



 /*
 style pour l'animation des markers de référence
 */
     .myPict{
        margin:0px 0px 0px 0px;
        /*background-color: #92AD40;*/
        /*color: #AEF123;*/

        position: relative;
        }

        .tag {
       float: left;
       position: absolute;
       left: 50px;
       top: 50px;
       z-index: 1000;
       /*background-color: #92AD40;*/
       padding: 5px;
       /*color: #FFFFFF;*/
       font-weight: bold;
    }
    .placeC{
        position: relative;
    }
    .circle {

        position: absolute;
        width: 25px;
        height: 25px;
        line-height: 25px;
        border-radius: 50%;
        font-size: 20px;
        color: #fff;
        text-align: center;
        background: #000;
        visibility: hidden;

    }
    ._1{
    float: left;
       left: 345px;
        top: 105px;
    }
    ._2{
    float: left;
       left: 320px;
        top: 90px;
    }
    ._3{
    float: left;
       left: 295px;
        top: 87px;
    }
    ._4{
    float: left;
       left: 268px;
        top: 95px;
    }
     ._5{
        left: 245px;
        top: 140px;
    }
    ._7{
        left: 330px;
        top: 205px;
    }
    ._10{
        left: 105px;
        top: 175px;
    }
    ._11{
        left: 75px;
        top: 180px;
    }
    ._8{
        left: 228px;/*258px;*/
        top: 235px; /*245px;*/
        }
    ._9{
        left: 228px; /*255px;*/
        top: 415px; /*360px;*/
    }
    ._6{
        left: 205px;
        top: 95px;
        }
    ._12{
        left: 35px;
        top: 115px;
    }

    .lm_ready{
        background: #184;
    }

    .lm_next{
        background: #184;
    }
    .lm_other{
        background: #999;
    }
/*
fin
*/