#index-ground #latest-releases{
  width: calc(100% - 300px);
  margin-right: 2em;
  display: flex;
  flex-direction: column;
}

@media (max-width:35.5em) {
  #index-ground #latest-releases {
    width: 100%;
  }
}

#index-ground #ranking{
  width: 300px;
  border-radius: .5em;
  background-color: rgba(255, 255, 255, 0.8);
  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px;
  display: flex;
  flex-direction: column;
  height: 100%;
}


@media (max-width:35.5em) {
  #index-ground #ranking{
    width: 100%;
  }
}


#index-ground #ranking ul{
  margin: 0;
  padding: 0;
}

#index-ground #ranking li{
  display: flex;
}

#index-ground #ranking a{
  margin: auto 0 auto 0;
  text-decoration: none;
  color:rgba(0, 0, 0, 0.95);
  font-size: 1.2em;
  line-height: .7;
  /* font-weight: 700; */
  /* width: 100%; */
  margin-left: 2em;
  flex: 1;
}

#index-ground #ranking li::before {
  color: #ffffffaa;
  width: 50px;
  font-size: 3em;
  font-weight: 800;
  text-align: center;
  padding: .5em 0;
}

#index-ground #ranking #number1 a{
  font-size: 2em;
  margin-left: 2.5em;
  flex: 1;
}

#index-ground #ranking #number2 a{
  font-size: 1.8em;
  margin-left: 2.6em;
  flex: 1;
}

#index-ground #ranking #number3 a{
  font-size: 1.5em;
  margin-left: 2.8em;
  flex: 1;
}

#index-ground #ranking #number1::before{
  background-color: #1060aeee;
  content: '1';
  border-top-left-radius: .2em;
}

#index-ground #ranking #number2::before{
  background-color: #157ee3ee;
  content: '2';
}

#index-ground #ranking #number3::before{
  background-color: #6baef0ee;
  content: '3';
}

#index-ground #ranking #number4::before{
  background-color: #999999ee;
  content: '4';
  font-size: 1.5em;
}
#index-ground #ranking #number5::before{
  background-color: #959595ee;
  content: '5';
  font-size: 1.5em;
}
#index-ground #ranking #number6::before{
  background-color: #808080ee;
  content: '6';
  font-size: 1.5em;
}
#index-ground #ranking #number7::before{
  background-color: #858585ee;
  content: '7';
  font-size: 1.5em;
}
#index-ground #ranking #number8::before{
  background-color: #808080ee;
  content: '8';
  font-size: 1.5em;
}
#index-ground #ranking #number9::before{
  background-color: #757575ee;
  content: '9';
  font-size: 1.5em;
}
#index-ground #ranking #number10::before{
  background-color: #707070ee;
  content: '10';
  font-size: 1.5em;
  border-bottom-left-radius: .2em;
}

.os-ranking-pageviews {
  font-size: .5em;
}

.os-ranking-img {
  position: absolute;
  max-height: 40px;
  margin-left: 20px;
}

#index-ground .card{
  margin-bottom: 1em;
}

#index-ground .card p{
  margin: 0;
}

#index-ground .container {
  flex-direction: row;
}

@media (max-width:35.5em) {
  #index-ground .container {
    flex-direction: column;
  }
  #index-ground .button {
    margin-bottom: 3em;
    margin-left: auto;
  }
}


#latest-releases .button{
  margin-top: 1em;
}

#latest-releases h4 a{
  text-decoration: none;
  text-transform: uppercase;
  color: white;
  font-size: 1.2em;
}

#latest-releases-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1em;
}