.container-fixed {
    bottom: 0;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
}

.container-fixed .col {
    height: 100%;
    overflow: auto;
}

.row-xs-12 { height: 100%; }
.row-xs-11 { height: 91.66666666666666%; }
.row-xs-10 { height: 83.33333333333334%; }
.row-xs-9 { height: 75%; }
.row-xs-8 { height: 66.66666666666666%; }
.row-xs-7 { height: 58.333333333333336%; }
.row-xs-6 { height: 50%; }
.row-xs-5 { height: 41.66666666666667%;}
.row-xs-4 { height: 33.33333333333333%;}
.row-xs-3 { height: calc(25% - 0.25rem); }/*fix*/
.row-xs-2 { height: 16.666666666666664%; }
.row-xs-1 { height: 8.333333333333332%; }

.col{
    padding: 0;
    padding-right: 1em;
    margin: 0;
    text-align:center;
    background-color: #553a7c;
    color: #FFF;
    opacity: 0.85;
    transition: 0.3s;
    cursor: pointer;

    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */
}
.col:hover{
    background-color: #2d1e42;
    opacity: 1;
}

.color-down{
  background-color: #7a53b4;
}
.color-dark{
  background-color: #0b0811;
}

.unit {
    display: inline-block;
    font-size: 1em;
    color: #DDD;
}

#leu{
  margin-right: 1em;
}

.noneCel{
    cursor: default;
    background-color: #e9ecef;
}
.noneCel:hover{
    background-color: #e9ecef;
}

.progress-bar {
      background-color: #553a7c;
}

.coin{
  font-size: 0.8em;
}

.alert{
  display:none;
}