html,
body {
  margin: 0px;
  padding: 0px;
  background-color: whitesmoke;
  height: 100%;
  font-family: Arial, Helvetica, sans-serif;
}

main{
  padding-top: 10px;
}

.container {
  padding: 0px 50px 0px 50px;
}

a:link {
  text-decoration: none;
}

/* PAGE */
.page-image-cover{
  width: 100%;
  text-align: center;
}

.page-image {    
  width: 100%;
  object-fit: cover;
  /* width: 90%; */
  /* max-width: 900px; */
  /* height: 500px; */
}

@media only screen and (max-width: 768px) {
  .page-image-cover{
    width: 100%;
    text-align: center;
  }
  
  .page-image {    
    width: 100%;
    object-fit: cover;
    /* height: 400px; */
  }
}

/* LIST */
.card {
  /* border: 1px solid grey; */
  border-radius: 5px;
  background-color: white;
}

.card:hover {
  box-shadow: 0.1px 0.1px 2px #a59999;
}

.card-image {
  width: 100%;
}

.card-content {
  margin: 10px;
  min-height: 100px;
}

.list-title{
  display: block;
  text-align: center;
  font-size: 20px;
  color: #242424;
}

.list-item-title, .content-title {
  font-size: 18px;
  color: #242424;
}

.list-item-subtitle {
  font-size: 14px;
  color: #4e4e4e;
}

/* HEADER */
.header{
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: #ffffff;
}

.header .nav > a{
  color: rgba(0, 0, 0, 0.6);
  font-weight: bold;
}

.nav{
  float: right;
  display: flex;
  align-items: center;
  height: 32px;
}

.brand{
  float: left;
}

.clear{
  clear: both;
}

/* FOOTER */
.footer {
  position: sticky;
  top: 100vh;
  background-color: white;
}

.footer .container {
  padding-top: 20px;
  padding-bottom: 20px;
  text-align: right;
  color: grey;
}

.pagination {
  text-align: center;
  margin: 10px;
}

/* TAGS */
ul.tag-list {
  list-style: none;
  padding-left: 0;
  margin: 1rem 0 1rem 0;
}

ul.tag-list li {
  display: inline-block;
  font-size: 0.9rem;
  margin-bottom: 1em;
}

ul.tag-list li a {
  background: rgba(0, 0, 0, 0.05);
  color: rgba(0, 0, 0, 0.6);
  border-radius: 3px;
  padding: 5px 10px;
}

.tag-card-label{
  text-align: center;
  padding: 10px;
}

/* HOME */
.home-img-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 150px;
}

.home-img {
  width: 100%;
  max-width: 500px;
}

.home-slogan {
  display: block;
  text-align: center;
  color: #242424;
  margin: 20px 0px;
}

.home-content-container{
  text-align: center;
  margin: 20px 0px;
}

.home-game-container{
  display: flex;
  justify-content: center;
  margin: 20px 0px;
}

.home-button-game{
  text-align: center;
  font-size: 2em;
  padding: 20px 60px;
  font-weight: bold;
  background-color: #00abe6;
  color: rgb(241, 241, 241);
}

.home-button-game:hover{
  background-color: #305672;
}