
.base-content{
  padding-block: 1rem;
  padding-inline: 1rem;
  background-color: white;
  border-radius: 0.8rem;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.dark .base-content{
  padding-block: 1rem;
  padding-inline: 1rem;
  background-color: #252525;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  border-radius: 0.8rem;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.header-base-content{
  display: flex;
  align-items: center;
  width: 100%;
}

.header-base-content > div.icon-base-content{
  display: flex;
  align-items: center;
}

.icon-base-content{
  color: black;
}

.header-base-content > div.icon-base-content > i{
  font-size: 24px;
}

.justify-center{
  justify-content: center;
}
.justify-left{
  justify-content: left;
}
.justify-right{
  justify-content: right;
}

h2{
  color: black;
}

.line-title-content{
  width: 100%;
}

.header-base-content > div .small{
  font-size: 1rem;
}
.header-base-content > div .medium{
  font-size: 1.5rem;
}
.header-base-content > div .large{
  font-size: 2rem;
}



@media only screen and (max-width: 767px) {
  .header-base-content{
    align-items: center;
  }

  .header-base-content > div > h2{
    padding-bottom: 0rem;
  }
}

@media only screen and (min-width: 170px) and (max-width: 319px) {
  .header-base-content{
    align-items: center;
  }

  .header-base-content > div > h2{
    padding-bottom: 0rem;
  }
}
