.VXcard{
    position:absolute;
    top: 25px;
    right: 25px;
    z-index: 10;
}

.mdl-button {
    margin-top: 10px;
    margin-bottom: 10px;
    margin-right: 10px;
}

.mdl-grid {
    max-width: 600px;
}
.mdl-card__media {
    margin: 0;
}
.mdl-card__media > img {
    max-width: 100%;
}
.mdl-card__actions {
    display: flex;
    box-sizing:border-box;
    align-items: center;
}
.mdl-card__actions > .mdl-button--icon {
    margin-right: 3px;
    margin-left: 3px;
}


.closeCard{
    position: absolute;
    right: 5px;
    bottom:5px;
}





#card {
    z-index: 9;
  }
  
  #cardheader {
    padding: 10px;
    cursor: move;
    z-index: 10;
    background-color: rgb(50,168,82);
    color: #fff;
  }

/* label max */
.max{
    position: absolute;
    top: 20px;
    right: -20px;
}
  
  /*label min */
  .min{
    position: absolute;
    top: 20px;
    left: -20px;
  }

  #closeCardMeasurement{
    position: absolute;
    top: 3px;
    right: 5px;
  }
  





  /* label max */
  #colorcard .max{
    position: absolute;
    top: -5px;
    right: -30px;
    font-size: small;
}
  
  /*label min */
#colorcard .min{
    position: absolute;
    top: -5px;
    left: -30px;
    font-size: small;
}

#colorcard .text{
    padding: 10px 10px 10px 10px;
    font-size: small;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}

#colorcardheader {
    padding: 10px;
    cursor: move;
    z-index: 10;
    background-color: rgb(50,168,82);
    color: #fff;
}



#cardIAInfo {
    z-index: 90;
}

#cardIAInfoheader {
    padding: 10px;
    cursor: move;
    z-index: 10;
    background-color: rgb(50,168,82);
    color: #fff;
}