body{
    background-color:#fff8ec;
    
}

.title{
    color: #284395;
    font-family: "Special Gothic Expanded One", sans-serif;
    font-weight: 200;
    font-style: normal;
    font-size: 80;
    margin-top: 50px;
    margin-left: 50px;
    
}

.subtitle{
    color: #284395;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: medium;
    font-size: 30;
    margin-top: -50px;
    margin-left: 50px;
}

.separator{
  height: 5px;
  background: #284395;
  background: linear-gradient(57deg, rgba(40, 67, 149, 1) 0%, rgba(91, 203, 240, 1) 36%, rgba(255, 248, 236, 1) 73%);
}

.tabcontent .game{
  
    padding-top:4%;
  padding-bottom: 4%;;
  padding-left: 3%;
  padding-right: 3%;

}
@media (max-width: 480px){
  .tabcontent .game .game-elems{
  display: flex;
  flex-direction: column;
  }
}
@media (min-width: 1025px){

.tabcontent .game .game-elems{
  display: flex;
  flex-direction: row;
  object-fit: contain;
}
}

.tabcontent .game .game-elems .description{
  display: inline-block;
    color: #272932;
    font-family: "Poppins", sans-serif;
    font-weight: medium;
    font-style: medium;
    font-size: 20;
  
    margin-left: 70px;
}


.tabcontent .game .game-elems img{
    display: inline-block;
    object-fit:contain;

    border: 5px;
    border-color:#284395;
    border-radius: 10px;
}

.tabcontent .game .game-elems video{
    display: inline-block;
    width: 45%;
    object-fit: contain;

    border: 5px;
    border-color:#284395;
    border-radius: 10px;
}

.tabcontent .game .mini-title{
  color: #284395;
    font-family: "Special Gothic Expanded One", sans-serif;
    font-weight: 200;
    font-style: normal;
    font-size: 35;
}



/* Style the tab */
.tab {
  
  display: flex;
  justify-content: space-evenly;
}

.tab .tablinks{
  color: #284395;
    font-family: "Special Gothic Expanded One", sans-serif;
    font-weight: 200;
    font-style: normal;
    font-size: 40;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  float:left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: inherit;
  font-size : 45
}

/* Create an active/current tablink class */
.tab button.active {
  color: #284395;
  text-decoration: underline #284395;

}

.aboutme{
  color: #272932;
    font-family: "Poppins", sans-serif;
    font-weight: medium;
    font-style: normal;
    font-size: 25;
  
    padding-left: 4%;
    padding-right: 4%;
    padding-top:5%;
    padding-bottom:5%;
}

/* Style the tab content */
.tabcontent {
  display: none;
  border-top: none;
  height:100%;
  background: #FFF8EC;
}

.tabcontent .art-content{
  display:flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  padding-top:4%;
  padding-bottom: 4%;;
  padding-left: 3%;
  padding-right: 3%;
}

.tabcontent .art-row img{
  padding: 15px;
}

.tabcontent .art-row video{
  padding: 15px;
}

.tabcontent .art-row{
  padding-top:4%;
  padding-bottom: 4%;;
  padding-left: 3%;
  padding-right: 3%;

  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content:space-evenly
}

.tabcontent .art-row .fishes{
  height:200%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content:space-between
}