style.css

body{
    margin: 0;
    padding:0;
    background-color: lavender;
}

#container{
    height:550px;
    margin-left:25px;
}

.card_outer{
    height:160px; 
    width:120px;
    background:transparent; 
    perspective:1200px; 
    float:left; 
    margin-left:40px;
    margin-top:20px;
}

.card_inner{
    position:absolute; 
    height:100%; 
    width:100%; 
    transform-style:preserve-3d;  
    transition:all 0.75s ease;
}  

.front,.back{ 
    position:absolute; 
    height:100%; 
    width:100%; 
    background: linear-gradient(45deg, rgba(2,0,36,1) 0%, rgba(40,40,121,1) 35%, rgba(0,212,255,1) 100%);
    backface-visibility:hidden; 
    border-radius:10px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.back{
    transform:rotateY(180deg); 
}

#board{
    height:85px; 
    width:450px;
    border:4px solid black;
    margin:auto;
    text-align:center;
    margin-top:15px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

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