.diente {
    position: relative;
    width: 0px;
    height: auto;
    margin-left: 10%;
    display: inline-block;
}

.cuadro {

    background-color: #FFFFFF;
    border: 1px solid #7F7F7F;
    position: relative;
    width: 25px;
    height: 15px;
    left: 45px;
    -webkit-border-radius: 80px 80px 0px 15px;
    -moz-border-radius: 80px 80px 0px 15px;
    border-radius: 80px 80px 0px 15px;
}

.cuadro:hover {
    /*background: rgba(117, 198, 243, 0.4);*/
    
    cursor: pointer;
}

.border-label{
    border: 1px solid #242729;
}
.izquierdo {
    top: 1px !important;
    left: 28px !important;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg);
}

.debajo {
    top: 2px !important;
    left: 45px !important;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.derecha {
    top: -29px !important;
    left: 61px !important;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.centro {
    background: #F3F3F3;
    border: 1px solid #7F7F7F;
    width: 25px;
    height: 25px;
    top: -49px;
    left: 45px;
    position: relative;
}

.centro:hover {
    border: 1px solid rgba(117, 198, 243, 0.4);
    /*background-color: rgba(117, 198, 243, 0.4);*/
    
    cursor: pointer;
}

#tlr {
    margin-left: 0%;
}
#tr {
    margin-bottom: -2%;
    margin-left: 0%;
    padding-left: -10%;
}
#tll {
    margin-left: 0%;
    padding-left: 5.5%;
}
#tl {
    margin-bottom: -2%;
    margin-left: 0%;
}

#blr {

}
#br {
    margin-top: -2%;
    padding-left: -10%;
}
#bl {
    margin-top: -2%;
    margin-left: 0%;
}
#bll {
    margin-left: 0%;
    padding-left: 5.5%;
}
.click-red {
    background-color: red !important;
}

.click-blue {
    background-color: blue;
}

.click-delete {
    background-color: #747F7D !important;
}


.kill {
    background-color: green;
}

.diente-leche {
    position: relative;
    width: 0px;
    height: auto;
    margin-left: 8%;
    display: inline-block;
}

.cuadro-leche {
    border: 1px solid #7F7F7F;
    position: relative;
    width: 13px;
    height: 13px;
    left: 45px;
    -webkit-border-radius: 80px 80px 0px 15px;
    -moz-border-radius: 80px 80px 0px 15px;
    border-radius: 80px 80px 0px 15px;
}

.cuadro-leche:hover {
    /*background: rgba(117, 198, 243, 0.4);*/
    
    cursor: pointer;
}

.izquierdo-leche {
    top: -4px !important;
    left: 37px !important;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg);
}

.top-leche {
    width: 15px;
    left: 47px;
}

.debajo-leche {
    width: 15px;
    top: -8px !important;
    left: 47px !important;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.derecha-leche {
    top: -30px !important;
    left: 58px !important;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.centro-leche {
    background: #F3F3F3;
    border: 1px solid #7F7F7F;
    width: 15px;
    height: 13px;
    top: -43px;
    left: 47px;
    position: relative;
}

.centro-leche:hover {
    border: 1px solid rgba(117, 198, 243, 0.4);
    /*background-color: rgba(117, 198, 243, 0.4);*/
    
    cursor: pointer;
}
.borda-finalizado{
    border: 3px inset #000000;
}