:root {
    --primary-color: #009cfc;
    --btn-song-color: #ee6510;
    --gray-dark: #263a41;
    --gray-light: #434343;
    --ghi-nhat: #f5f5f5;
    --gray-line: #dbdbdb;
    --grayfooter: #6b6b6b;
    --gray-sang: #7c7c7c;
    --gray-999: #999999;
    --white: white;
    --black: black;
    --bg-block: #fff9f8;
    --primary-font: "Roboto";
    --secondary-font: "Rufina";
    --wrapper: 100%;
    --margin-section: 1.2rem;
    --button-up: 1rem;
    --padding-container: 1.6rem;
    --maintextsize: 1.8rem;
  }

  *,
  *:before,
  *:after {
    box-sizing: border-box;
  }
  *:focus {
    outline: none;
}
  html {
    font-size: 62.5%;
  }
  body {
    font-family: var(--primary-font);
    font-weight: 300;
    color: var(--gray-dark);
    background-color: var(--white);
    margin: auto;
  }
  img {
    display: block;
    max-width: 100%;
  }
  a {
    text-decoration: none;
  }
  .wrapper {
    max-width: var(--wrapper);
    margin-left: auto;
    margin-right: auto;
  }
  .container {
    max-width: cal(var(--wrapper) - 2*var(--padding-container));
    margin-left: auto;
    margin-right: auto;
  }
  .ksection {
    margin: var(--margin-section);
  }
@media only screen
  and (max-device-width: 320px)
 {
  .ksection {
    margin: 0;
  }
}
.ktext_link_b{color: var(--black);}
.ktext_link_w{color: var(--white);}
.zdex10 {z-index: 10;}
.padding3rem{margin:3rem 1rem 3rem 1rem}
.overflowscr {overflow: scroll;}
.brspace{height: 3rem;}
.txnobold{font-weight: normal !important;}
.roundavatar{
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    overflow: hidden;
    object-fit: cover;
    object-position: top;
}
.bder5px{
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
}
.bder10px{
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
}
.btn_modalpu{
  padding: 1.5rem 4.2rem 1.5rem 4.2rem;
  font-size: 1.5rem !important;
  font-weight: bold;
  border: 0.1rem var(--black) solid;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  color: var(--black);
}
.btn_cx {
    background-color: var(--btn-song-color);
    color: white;
    border-color: var(--btn-song-color);
}
.btn_ct {background-color: var(--white);}

[style*="--aspect-ratio"] > :first-child {
    width: 100%;
  }
  [style*="--aspect-ratio"] > img {
    height: auto;
  }
  @supports (--custom:property) {
    [style*="--aspect-ratio"] {
      position: relative;
    }
    [style*="--aspect-ratio"]::before {
      content: "";
      display: block;
      padding-bottom: calc(100% / (var(--aspect-ratio)));
    }
    [style*="--aspect-ratio"] > :first-child {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
    }
  }
