/* display inline block allows the cards to be adjacent */
.flipcard-item {
    background: rgb(138, 198, 233);
    color: rgb(46, 46, 46);
    border: 1px solid black;
	border-radius: 0.3rem;
    width: 250px;
    height: 300px;

    margin: 5px;

    text-align: center;
    overflow: hidden;

display: inline-block;
 }

 .flipcard-item:hover {
    background: rgb(179, 222, 247);
 }


 .flipcard-item h3 {
    font-size: 20px;
    margin: 0;
    margin-top: 10px;
 }

 .flipcard-item p {
    font-size: 16px;
    padding: 10px;
    margin: 10px;
    line-height: 2rem;
 }


 /* back and front side need to show depending on hover */
 .flip-back {
    width: 250px;
    height: 300px;
    z-index: 1;
	border-radius: 0.3rem;
 }

 .flip-front {
    z-index: 2;
    width: 250px;
    height: 300px;
	border-radius: 0.3rem;
 }

 //.flip-front:hover {
 //   display: none;
 //}

.flipcard-item:hover .flip-front {
	display: none;
}