@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Hi+Melody&display=swap');
@import url(fonts.css);

html{
     scrollbar-color: pink #391219;
}

header {
    width: 100%;
    height: 100px;
    background-image: url('/patterns/palette.png');
    background-size: 30%;
    display: flex;
    border: #391219 2px dashed;
    border-radius: 10px;

}

header p {
    font-family: "basic", sans-serif;
    align-content: end;
    margin-left: 70%;
}

body {
    background-color: rgb(59, 15, 22);



}

main {
    width: 1500px;
    height: 1500px;
    margin-left: auto;
    margin-right: auto;
    background-color: #391219;
    margin-top: 20px;
    display: flex;
    border-radius: 20px;
}

#left-aside {
    width: 433px;
    height: 100%;
    background-color: #f1b4b4;
    border-radius: 20px 0px 0px 20px;

}

#right-aside {
    width: 433px;
    height: 100%;
    background-color: #f1b4b4;
    border-radius: 0px 20px 20px 0px;
}

#main-content {
    position: relative;
    width: 910px;
    height: 100%;
    background-color: #f1e4b4;
}

.main-top {
    width: 910px;
    height: 450px;
    max-height: 450px;
    background-color: #f1e4b4;

}

.main-bottom {
    background-color: #f1e4b4;
    width: 910px;

    height: 950px;
}

.flex {
    display: flex;
}



.talking {
    width: 530px;
    height: 200px;
    background: #ffdfdf;
    overflow: auto;
    scrollbar-color: pink #391219;
    border: #391219 1px dashed;
    border-radius: 10px;
    scrollbar-width: thin;
    font-family: "Special Elite", system-ui;
    position: relative;
    right: -70px;
    top: 30px;


}

.talking h1 {
    font-family: "Jua", sans-serif;
    color: #f1b4b4;
    margin-left: 8px;
}

.talking p {
    word-spacing: 5px;
    color: #391219;
    margin-left: 8px;


}

.strawberry {
    background-image: url('https://adriansblinkiecollection.neocities.org/dividers/glitterstrawberries.gif');
    height: 28px;

    width: 100%;
    background-repeat: repeat;

}


.lace {
    background-image: url('https://64.media.tumblr.com/7147f8ddaff9b6b3add772f06a008e01/90ca71cfbe30b8ed-5f/s250x400/9e60ea9536f67ea4ea9838cf91efd09d2913b350.pnj');
    height: 8px;

    width: 100%;
    background-repeat: repeat;
}

.lace2 {
    background-image: url('https://gifcity.carrd.co/assets/images/gallery46/3f95c264.gif?v=e3c0bc0f');
    width: 98%;
    height: 25px;


}


#left-aside nav {
    text-decoration: none;
}

#left-aside ul {

    text-decoration: none;
    list-style: none;
}

#left-aside li {
    margin-left: -20px;
    margin-top: 10px;
    font-family: "Jua", sans-serif;
    font-weight: 400;
    font-size: 35px;


}

li a {
    text-decoration: none;
    color: #391219;
}

li a:hover {
    color: #662b35;
}

.kobato {
    height: 250px;
    width: 180px;
    margin-left: 4px;
}

.favorites {
    margin-left: -20px;
    margin-top: -10px;
    font-family: "Jua", sans-serif;
    font-weight: 400;
    font-size: 35px;
    color: #391219;
}

.favorites-ul li {
    font-family: "virale", sans-serif;
    font-size: 22px;
    position: relative;
    top: -25px;
    margin-left: -20px;

}

.favorites-ul {
    list-style: none;
}

.flex2 {
    display: flex;
}

.header-kobato {
    position: relative;
    top: 20px;
    margin-left: 80px;
}

.spotify {
    margin-left: 50px;

}


.spotifytit {
    margin-left: 20px;

    font-family: "Jua", sans-serif;

    font-size: 35px;
    color: #391219;
}

iframe {
    border: #391219 1px dashed;
    border-radius: 2%;
    margin: 10px;
    font-family: "basic";
    background-color: #f1e4b4;
}

.time {
    font-family: 'basic';
    margin-left: 13px;
    margin-bottom: -5px;
}
.marquee{
    width: 100%;
}

 #statuscafe {
    padding: .5em;
    margin: 10px;
    width: 80%;
    background-color: rgb(255, 225, 244);
    border: 2px dashed #391219;
    font-family: 'basic';
}
#statuscafe-username {
    margin-bottom: .5em;
    font-family: virale;
    color: #391219;
}
#statuscafe-username a {
    margin-bottom: .5em;
    font-family: virale;
    color: #e09a9a;
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
    
} 
footer{
    background-image: url(/patterns/footer.jpg);
    height: 150px;
   display: flex;
    text-align: center;
    margin-top: 70px;
    border: #f1e4b4 5px solid;
    border-radius: 10px;
    align-content: center;
    justify-content: center;
}
footer p{

 font-family: basic;
    color: #391219;
    font-size: 30px;
}

button{
    height: 30px;
    width: 90px;
    background-color: #ffd6d6;
    border: #523f29 2px solid;
    border-radius: 5px;
    font-family: basic;
    color: #e08080;
}

button:hover{
    height: 30px;
    width: 90px;
    background-color: #ffa9a9;
    border: #523f29 2px solid;
    border-radius: 5px;
    font-family: basic;
    color: #e66666;
}
.button{
    margin-top: 50px;
margin-left: 45%;
}
button a{
    text-decoration: none;
    color: #e08080;
}
button a:hover{
    color: #e66666;
}

#warning{
    color: #391219;
    font-family: alagard;
    width: 100px;
    background-color: #e08080;
    padding: 10px;
    border-radius: 8px;
    margin: 20px;
}
.warning a:hover{
    
    border-radius: 5px;
    background-color: #ae5e6d6b;
}
.warningsign:hover{
transform: scale(1.05);
}
small{
    position: absolute;
    margin-top: -40px;
    margin-left: 170px;
    width: 100px;
    font-family: rainy;
    color: #391219;
}
/* -----------------------spotify------------------- */
.box21 {
    margin: 10px;
    /*altere 0 para auto para centralizar*/
    width: 80%;
    /* largura */
}

.u01 {
    background: url(/border1/f-ue.gif) repeat-x;
    height: 23px;
    margin: 0 23px
}

.s01 {
    background: url(/border1/f-sita.gif) repeat-x;
    height: 23px;
    margin: 0 23px
}

.box-top {
    background-image: url(/border1/f-kado1.gif), url(/border1/f-kado2.gif);
    background-position: top left, top right;
    background-repeat: no-repeat, no-repeat;
    height: 23px;
}

.box-center {
    background-image: url(/border1/f-migi.gif), url(/border1/f-hidari.gif);
    background-position: top right, top left;
    background-repeat: repeat-y, repeat-y
}

.box-inner {
    background: #cebe8c;
    /* cor de fundo */
    margin: 0 23px;
    display: flex;
}

.box-inner nav {
    background: #cebe8c;
    color: #a59669;

}

.box-inner ul {
    background: #cebe8c;
    color: #391219;

}

.box-inner li {
    background: #cebe8c;
    font-family: 'virale';
    font-weight: 800;
    font-size: 25px;


}

.box-inner p {
    background: #cebe8c;
    font-family: "basic", sans-serif;


}

.box-bottom {
    background-image: url(/border1/f-kado3.gif), url(/border1/f-kado4.gif);
    background-position: top left, top right;
    background-repeat: no-repeat, no-repeat;
    height: 23px;
}

.box-dir {
    margin-left: 30px;
}

.singer {
    margin-top: -9px;
}


/* ------------------------- STICKERS------------------------- */
.stickers{
 
     position: absolute;
    inset: 0;
    height: 0;
  
}
.house {
    position: relative;
    top: 260px;
    margin-left: 180px;
}

.brwnbow {
    position: relative;
    top: -200px;
    margin-left: 820px;
}

.cuteflowers {
    position: relative;
    top: -250px;
    margin-left: 245px;
}

.kobatoneve {
    position: relative;
    top: 608px;
    margin-left: 560px;
    

}

.puppy {
    position: relative;
    top: -400px;
    margin-left: 350px;
    transform: rotate(13deg) smooth;
    transition-delay: 20ms;
}

.puppy:hover {
    transform: rotate(20deg);

}

.chibi {
    position: relative;
    top: -520px;
    margin-left: 550px;

}

.goldstars1 {
    position: relative;
    top: -400px;
    margin-left: 700px;
}

.goldstars2 {
    position: relative;
    top: -750px;
    margin-left: 750px;
    transform: rotateY(180deg);
}

.shotting {
    position: relative;
    top: -1170px;
    margin-left: 750px;
    transform: rotateY(180deg);
    
}
.bear{
    position: relative;
    top: -555px;
    margin-left: 720px;
}
.kitty{
    position: relative;
     bottom: px;
    margin-left: -190px;
}
/* --------------------TEXTO--------------------- */
.box19 {
margin:10px; /* 中央寄せは0をautoに変更 */
width:90% /* 幅 */
}
.u012 {
background:url(border2/f-ue.gif) repeat-x;
height:32px;
margin:0 32px
}
.s012 {
background:url(/border2/f-sita.gif) repeat-x;
height:32px;
margin:0 32px
}
.box-top2 {
background-image:url(border2/f-kado1.gif), url(border2/f-kado2.gif);
background-position:top left, top right;
background-repeat:no-repeat, no-repeat;
height:32px
}
.box-center2 {
background-image:url(border2/f-migi.gif), url(border2/f-hidari.gif);
background-position:top right, top left;
background-repeat:repeat-y, repeat-y
}
.box-inner2 {
background:#fff;
margin:0 32px;
padding:10px;
font-family: web;
}
.box-bottom2 {
background-image:url(border2/f-kado3.gif), url(border2/f-kado4.gif);
background-position:top left, top right;
background-repeat:no-repeat, no-repeat;
height:32px
}