body {
  font-family: 'Calibri';
  font-size: 20px;
  background-color: rgba(54, 57, 63, 1);
  color: white;
  margin: auto;



}


.material-icons.md-80 { font-size: 80px; }
.material-icons.md-48 { font-size: 48px; }
.material-icons.md-dark { color: rgba(0, 0, 0, 1); }
.material-icons.md-dark2 { color: rgba(0, 0, 0, 0.6); }

a, a:hover, a:focus, a:active {
  text-decoration: none;
  color: inherit;
}

.small{
  font-size: 15px;
}

.box-square-left{
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  float: left;
}


.box-square{
  height: 350px;
  width: 300px;
  background-color: rgba(47, 49, 54, 1);
  border: 1px solid rgba(32, 34, 37, 1);
  float: left;
  margin: 10px;


}

.thumb-square{
  width: 300px;
  height: 168px;
  background-size: cover;
  top: 0;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.title-square{
  border-bottom: 1px solid rgba(32, 34, 37, 1);
  border-top: 1px solid rgba(32, 34, 37, 1);
  width: 300px;
  height: 82px;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bottom-square{
  width: 300px;
  height: 120px;
}
.info-square-left{
  height: 100px;
  width: 99px;

  margin: auto;
  display: grid;
  justify-content: center;
  align-items: center;
  float:left;
}

.info-square-center{
  height: 100px;
  width: 99px;

  margin: auto;
  display: grid;
  justify-content: center;
  align-items: center;

}

.info-square-right{
  height: 100px;
  width: 99px;
  margin: auto;
  display: grid;
  justify-content: center;
  align-items: center;
  float:left;
}

.title-info-square{
  font-size: 15px;
}

.main-lyrics{
  background-color: rgba(47, 49, 54, 1);
  border: 1px solid rgba(32, 34, 37, 1);
  min-height: 50%;
  min-width: 50%;
  max-width: 50%;
  margin: auto;
  padding: 50px;
  display: grid;
  justify-content: center;
  align-items: center;
  
}