blackJ.css

*{
    margin: 0;
    padding: 0;
}

html{
    font-size: 62.5%;
    /* 10px and default 1rem=16px */
}

.title{
    text-align: center;
    background: rgb(232,224,117);
    background: linear-gradient(0deg, rgba(232,224,117,1) 0%, rgba(1,1,1,1) 15%);
    color: gold;
    /* font-family: 'Lobster', cursive; */
    font-family: 'Pushster', cursive;
    /* font-family: 'Ubuntu', sans-serif; */
    padding: .5rem;
    font-size: 8rem;
    word-spacing: 2rem;
    letter-spacing: .3rem;
}

#command {
    font-family: 'Vujahday Script', cursive;
    font-weight: 800;
    font-size: 3.5rem;
    word-spacing: 1rem;
    animation: blinker 2s step-start infinite;
}
@keyframes blinker {
    25% {
      opacity: 0;
    }
}

.main{
    margin: auto;
    text-align: center;
}

.row1{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-around;
    padding: 1rem;
    border-bottom: black solid .1rem;
    height: 50rem;
}

.row1 ,.row2{
    background: url('./static/table.jpg') no-repeat center center/cover;
    width: auto;
    color: whitesmoke;
}

.row1 div{
    padding: 1rem;
    text-align: center;
    flex: 1;
}

.row1 h2{
    font-family: 'Lobster', cursive;
    font-size: 4rem;
}

#your-box{
    border-right: black solid 1px;
}

#your-box img, #dealer-box img{
    height: 20rem;
    width: 13rem;
    padding: 1rem;
}

.row2{
    display: flex;
    justify-content: space-around;
    margin-bottom: 3rem;
}

.buttons{
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-around;
    width: 55%;
}

.buttons button{
    font-size: 2.2rem;
    font-weight: 700;
    font-family: 'Lobster', cursive;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: .2rem;
    padding-bottom: .2rem;
    margin: 1.5rem;
}

.buttons button:hover{
    cursor: pointer;
    box-shadow: black 0px 0px 5px 2px;
}

.row3 h3{
    font-family: 'Teko', sans-serif;
    font-size: 4rem;
}

.row3{
    margin: auto;
}

table, th, td{
    padding: .5rem;
    border: solid 2px black;
    font-size: 3rem;
    font-family: 'Teko', sans-serif;
    font-weight: 400;
    padding-left: 3rem;
    padding-right: 3rem;
}

table{
    margin: auto;
    margin-bottom: 5rem;
}

@media screen and (max-width:740px){
    html{
        font-size: 40%;
    }
}
@media screen and (max-width:420px){
    html{
        font-size: 30%;
    }
}