body {
    background-color: darkgreen;
}
.dices-count {
    background-color: darkgreen;
}

#sendmessage-text {
    display: block;
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
}

p#dices-count {
    color: white;
    text-align: center;
}

div.gamer {
    color: white;
}

.my-dice > img {
    vertical-align: unset;
    height: 100%;
}

.my-dice.active img {
    animation: 500ms infinite alternate jumping;
    animation-timing-function: ease-in;
}

#chat-buttons {
    margin-bottom: 5px;
}

#inputMessage {
    margin-bottom: 5px;
}

#messages {

}

@keyframes jumping {
    from {
        padding: 0px;
    }

    to {
        padding: 10px;
    }

}


.action-dice-separator {
    height: 5px;
}

.img-last-dice.disabled {
    opacity: 0.7;
}

.action-gamer-name {
    color: white;
    text-align: center;
    margin: 0px;
}

.gamer-dice-number {
    font-weight: bold;
}

.btn.btn-primary, .btn.btn-secondary {
    margin: 4px;
}


div.dice.active {
    display: inline-block;
    border: solid red 3px;
    padding: 4px;
}

div.scroll {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}


/*=======================================*/



@keyframes example {
    0%   {background-color: red;}
    25%  {background-color: yellow;}
    50%  {background-color: blue;}
    100% {background-color: green;}
}


.dice-last-action > img {
    animation: last-action-animation 1s 3;
}

@keyframes last-action-animation {
    50% {opacity: 0.5;}
}

img {
    width: 100%;
    height: 100%;
}


#gamer-winner {
    color: orangered;
    font-size: 2em;
    font-weight: bold;
}

#top-row {
    height: 40px;
}

div.empty-dice {
    width: 70px;
    height: 140px;
    background-color: darkgreen;
    border: solid 2px red;
    border-radius: 10px;
}

.my-dice {
    width: 110px;
    height: 200px;
    display: inline-block;
    border-width: 0px;
    margin-left: 4px;
    margin-right: 4px;
    margin-bottom: 20px;
}

.btn.btn-primary.actions-button {
    width: 100%;
    height: 85px;
    margin: 0px;
    margin-bottom: 15px;
}

p#dices-count {
    font-size: 2em;
}

.dice {
    width: 140px;
    margin: 4px;
    border: 0px;
}

.img-last-dice {
    width: 140px;
    margin: 4px;

}

#last-dice {
    margin-left: 25px;
}

.img-dice-cover {
    width: 140px;
    margin: 4px;
    transform: rotate(90deg);
    position: relative;
    top: -120px;
}

.action-dice {
    width: 140px;
    height: 200px;
    margin: 0px;
    /*margin-bottom: 10px;*/
}

.action-dice-container-h {
    width: 140px;
    height: 140px;
    display: inline-block;
}

.action-dice-h {
    width: 70px;
    height: 140px;
    margin-right: 35px;
    margin-left: 35px;
}

.rotate-left {
    transform: rotate(-90deg);
}

.rotate-right {
    transform: rotate(90deg);
}

img {
    width: 100%;
    height: 100%;
}
.action-dice-container-v {
    width: 70px;
    height: 140px;
    margin-top: -35px;
    display: inline-block;
}
.action-dice-v {
    width: 70px;
    height: 140px;
    /*border: solid red 1px;*/
}

#mydice-div {
    margin-top: 50px;
}

#action-container {
    padding-bottom: 40px;
}

.last-action-gamer {
    margin-top: 30px;
    font-weight: bold;
}