*{
    font-family: 'roboto';
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

h1{
    color: white;
}

.title{
    text-decoration: underline;
    color: white;
    font-style: italic;
    font-weight: bold;
}

.row{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 10px;
}

body{
    background-color: rgb(17, 42, 68);
}

label{
    color: white;
    margin-top: 10px;
}

.button_container{
    display: flex;
}

h1{
    margin: 10px;
    text-align: center;
}

label{
    text-transform: uppercase;
    /* font-weight: bold; */
}

button:active{
    box-shadow:none;
    transform:translateY(5px)
}

.small_button {
    width: 94px;
    height: 89px;
    /* position: absolute; */
    background: url(../img/btn_img.png) no-repeat;
    background-position: -5px -5px;
    border: 0;
    /* display: block; */
    -webkit-tap-highlight-color: transparent;
    /* margin-bottom: 10px; */
}

.div_button{
    display: flex;
    flex-direction: column;
    position: relative;
    vertical-align: top;
    width: 150px;
    text-align: center;
    word-wrap: break-word;
    margin: 10px;
    align-items: center;
}

.green {
    background-color: green;
    border-radius: 50%;
}

.red {
    background-color: red;
    border-radius: 50%;
}

.white{
    background-color: #b1b1b1;
    border-radius: 50%;
}

.blue{
    background-color: #0c629b;
    border-radius: 50%;
}

.yellow{
    background-color: yellow;
    border-radius: 50%;
}

.container{
    display: flex;
    flex-direction: column;
}