@font-face {                  
font-family: 'Barecast';
src: url(https://humantooth.neocities.org/fonts/Barecast-Regular.woff2) format('woff2');
} 

@font-face {                  
font-family: 'Lucette';
src: url(https://humantooth.neocities.org/fonts/Lucette-Regular.woff2) format('woff2');
} 

@font-face {                  
font-family: 'Xanh-Italic';
src: url(https://humantooth.neocities.org/fonts/XanhMono-Italic.woff) format('woff');
} 

@font-face {                  
font-family: 'JacquardaBastarda-9';
src: url(https://humantooth.neocities.org/fonts/JacquardaBastarda9.woff2) format('woff2');
} 

h1 {
font-family: 'JacquardaBastarda-9';
font-size:45px;
}
h4{
  font-family: 'Xanh-Italic';!important;
  font-size:14px;
  margin-top:5px;
  margin-bottom:0;
  color:#43495C;
}
body {
font-family: 'Lucette';
background-image: url(https://www.dropbox.com/scl/fi/k4yvvljop47nakha8xfm7/SB090.JPG?rlkey=ajqhwqjri3bynk4a2d2o1qp0g&st=d75bl1ek&raw=1);
background-repeat: repeat;
background-size: 400px;
}
p {
  font-size: 14px;
}
.container {
   display: flex;
   flex-wrap:wrap;
  grid-template-columns:1fr 1fr 1fr;
  grid-gap: 10px;
  
}
.header {
  display:flex;
  justify-content: flex-end;
  height:120px;
  align-items:flex-end;
  padding:15px;
  width:100%;
  background-image: url(https://www.dropbox.com/scl/fi/qylc8s0gs3el5cc31e0cc/download.png?rlkey=uvk1tshsa2kd0xqemazbsiua1&st=0bc1348c&raw=1);
  background-position:center;
}
.title{
 right:0;
 bottom:0;
 margin-bottom:-40px;
}
.left {
  width: 160px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  margin-right: 20px;
}
.label {
  background-image: url(https://www.dropbox.com/scl/fi/mbcq42k05upcu3v4f7gm9/ba-li-flow01.gif?rlkey=eu2ippbxtemomohof0q2orbmu&st=o55qq2wa&raw=1);
  background-repeat: no-repeat;
  background-size: cover;
   height:31px;
   width: 105px;
   display:block;
           margin: -5px -5px 5px -5px;
        padding: 5px 5px 5px 5px;
  justify-content:center;
  text-align:center;
}
.nav {
  padding:10px;
  display:flex;
  flex-direction:column;
  text-align:right;
}
.main{
display:flex;
flex-direction:column;
width:300px;
justify-content:flex-start;
position:relative;
}
.apple{
  height:50px;
  width:50px;
  float:left;
}
.summary{
 display:block;
  }
.right{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  margin-left: 20px;
}
.outer {
      width:700px;
      background-color: #F0EDE6;
      padding: 20px;
      background-clip: padding-box;
      border: 20px solid transparent;
      border-image: url(/border/whitelace.png) 34 round;
    }
.top {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
}
.slideshow {
            box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
            border: 1px solid rgba(0, 0, 0, .15);
            background-color: #ffffff;
            overflow: hidden;
            position: relative;
            height: 31px;
            width: 100%;
            font-size:0;
        }

        .marquee {
            position: absolute;
            white-space: nowrap;
            margin: 0;
            line-height: 31px;
            transform: translateX(100%);
            animation: scroll-left 20s linear infinite;
        }
        .marquee img{
          height:31px;
          width:auto;
          margin:0;
        }
        @keyframes scroll-left {
             0% {
      transform: translate(0, 0);
  }
  100% {
      transform: translate(-64.7%, 0);
            }
        }
.music{
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content: center;
  align-items: center;
  padding:10px 20px 0px 20px;
  background-image:url(https://www.dropbox.com/scl/fi/bn47eg0feysywvxswj5p0/bord-1-mokume02.gif?rlkey=iyrp8uwfpxue6ob3v23lm6ihf&st=2m0lttun&raw=1);
  background-size:100% 100%;
  background-repeat:no-repeat;
  width:105px;
}



