/*Root is currently WIP*/

:root {
 --maintext:#ccc6c7;
 --body-bg: url('https://i.pinimg.com/736x/3e/bc/95/3ebc9592ca68e07daf6f7ad1181a31dc.jpg');
 --header-bg:url("https://i.pinimg.com/736x/3f/a4/4a/3fa44ad2111ac9415e6db1f94e49d10d.jpg");
 --mystamps-bg:url("https://i.pinimg.com/736x/04/3a/7c/043a7c127dd0b8c2d9f2b8d5cf494766.jpg");
 --featured-bg-1:url("https://i.pinimg.com/736x/04/3a/7c/043a7c127dd0b8c2d9f2b8d5cf494766.jpg"); 
 --featured-bg-2:url("https://i.pinimg.com/236x/42/e1/9c/42e19c17edfbd50b76ee778aa2c670c5.jpg"); 
 --to-do-list:url("https://i.pinimg.com/736x/cd/c7/c7/cdc7c7775fbc31daf41dedf6ff2ba12e.jpg");
  --div-frill-one:url("/img/boarder1.png");
  --div-frill-two:url("/img/borderfrillsblue.png");
 --color-1:#d1645c;
 --color-2: #a3a398;
 --color-3: #d9b0ad;
 --color-4: #faf0e6;
}

 

@font-face {
font-family:'handy';
src: url(https://dl.dropbox.com/s/kqvt2miu9r4y9ye/handy00.ttf);
}

@font-face {
font-family: 'starlight';
src: url(https://dl.dropbox.com/s/cfcp07kvx3qut4s/starlight.ttf);
}

@font-face {
font-family: 'rosalicious';
src: url('/font/rosalicious.ttf') format('OpenType');

} 
::selection {
 text-shadow: 0 0 8px #cce5ff;
 color:#b8cbde;
}
::-moz-selection {
 text-shadow: 0 0 8px #cce5ff;
 color:#b8cbde;
}

/* Scrollbar CSS by dakedres on Github*/

::-webkit-scrollbar {
  width: 16px;
  height: 16px;
  background: white;
}
::-webkit-scrollbar-thumb,::-webkit-scrollbar-button {
  width: 16px;
  height: 16px;
  background: silver;
  box-shadow: inset 1px 1px #dfdfdf, inset -1px -1px gray;
  border: 1px solid;
  border-color: silver #000 #000 silver;
}
::-webkit-scrollbar-track {
  image-rendering: optimizeSpeed;
  image-rendering: pixelated;
  image-rendering: optimize-contrast;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAyIDIiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyI+CjxtZXRhZGF0YT5NYWRlIHdpdGggUGl4ZWxzIHRvIFN2ZyBodHRwczovL2NvZGVwZW4uaW8vc2hzaGF3L3Blbi9YYnh2Tmo8L21ldGFkYXRhPgo8cGF0aCBzdHJva2U9IiNjMGMwYzAiIGQ9Ik0wIDBoMU0xIDFoMSIgLz4KPC9zdmc+");
  background-position: 0 0;
  background-repeat: repeat;
  background-size: 2px;
}

::-webkit-scrollbar-button {
  background-repeat: no-repeat;
  background-size: 16px;
}

::-webkit-scrollbar-button:single-button:vertical:decrement {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTcgNWgxTTYgNmgzTTUgN2g1TTQgOGg3IiAvPgo8L3N2Zz4=");
}

::-webkit-scrollbar-button:single-button:vertical:increment {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTQgNWg3TTUgNmg1TTYgN2gzTTcgOGgxIiAvPgo8L3N2Zz4=");
}

::-webkit-scrollbar-button:single-button:horizontal:decrement {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTggM2gxTTcgNGgyTTYgNWgzTTUgNmg0TTYgN2gzTTcgOGgyTTggOWgxIiAvPgo8L3N2Zz4=");
}

::-webkit-scrollbar-button:single-button:horizontal:increment {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTYgM2gxTTYgNGgyTTYgNWgzTTYgNmg0TTYgN2gzTTYgOGgyTTYgOWgxIiAvPgo8L3N2Zz4=");
}

::-webkit-scrollbar-corner {
  background: silver;
}



a:link {
  color:var(--color-2);
  background-color: transparent;
  text-decoration: none;
}

a:visited {
  color: var(--color-2);
  background-color: transparent;
  text-decoration: none;
}

a:hover {
  color: var(--color-1);
  background-color: transparent;
  text-decoration: none;
  font-style:italic;
}

ul {
 list-style-position: inside;
 list-style-image:url("/img/clover.gif");
 font-size:10px;

}

li { 
 margin-bottom: 5px;  
}

h1{
	font-family:'rosalicious';
	font-size:40px;
	text-shadow: 1px 0px var(--color-1), -1px 0px var(--color-1), 0px 1px var(--color-1), 0px -1px var(--color-1), 0 0;
	color:#ffff;
	margin-top: 10px;
     margin-bottom: 10px;;
}

h2, h3{
	font-family:'rosalicious';
	text-align: center;
	text-shadow: 1px 0px var(--color-1), -1px 0px var(--color-1), 0px 1px var(--color-1), 0px -1px var(--color-1), 0 0;
	color:#ffff;
	margin-top: 10px;
     margin-bottom: 10px;
     
}

h3{
	font-size:25px;
}

*{
margin: 0;
padding: 0;
box-sizing: border-box;
}

*{cursor: url(https://cur.cursors-4u.net/food/foo-3/foo261.ani), url(https://cur.cursors-4u.net/food/foo-3/foo261.png), auto !important;}


body {
	background-color: #ffff;
	color: var(--maintext);
	font-family: 'starlight';
	font-size:14px;
	background-image: var(--body-bg);
	background-repeat: repeat;
	background-size:300px;
	background-position: 0 0;
	animation: animatedBackground 1200s linear infinite;
	overflow-x:hidden;
     white-space: normal;
	word-break:normal;
            animation: fadeInAnimation ease 1.6s;
            animation-iteration-count: 1;
            animation-fill-mode: forwards;
        }

        @keyframes fadeInAnimation {
            0% {
                opacity: 0;
            }

            100% {
                opacity: 1;
            }
        }
}

@keyframes animatedBackground {
from {
	background-position: 0 0;
}
/*use negative width if you want it to flow right to left else and positive for left to right*/
to {
	background-position: 10000px 10000px;
 }

}

.wrapper{
	margin:auto;
}

.container{
    margin: 1rem auto;
    max-width:70rem;
    width: 100%;
    height: fit-content;
    padding: 5px;
    border-radius: 20px;
    border: 15px solid;
    border-image: url("https://files.catbox.moe/5a7vko.png") 8 fill round;
}


.header{
	width: 100%;
	background-color: #fff5f7;
	height: 120px;
	background-image:var(--header-bg);
	background-size:900px;
	background-clip: padding-box;
	background-position: center;
	box-shadow: rgba(255, 255, 255, 255) 1px 1px 15px 10px inset;

}

.footer{
    display:flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    margin:0 auto;
    background-color:white;
}

.headertext{
	text-align: left;
	padding-top:40px;
	padding-left:30px;
}

.float {
text-shadow: -1px 0 var(--color-1), 0 1px var(--color-1), 1px 0 var(--color-1), 0 -1px var(--color-1), 0 0;
 font-style: italic;
 font-size:4em;
 font-weight:bold; 
 color: #fff;
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

@keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 15px); }
    100%   { transform: translate(0, -0px); }    
}
.contents{
  display:flex;
  width:fit-content;
  height:100%;
  overflow-y:hidden;
  gap:10px;
  background-image:url(https://i.pinimg.com/736x/c7/3e/f5/c73ef53f097c19716702c1c0d15df591.jpg);
  background-size:cover;
  background-repeat:repeat;
  animation: animatedContents 5000s linear infinite;
  overflow-x:hidden;
  box-shadow: rgba(255, 255, 255, 255) 0 0 10px 10px inset;
}
@keyframes animatedContents {
from {
	background-position: 0 0;
}
	
to {
	background-position: 100000px 1000px;
 }

}

.float::after,.float::before{
	content: url(https://64.media.tumblr.com/d8ce80f3c1127816946e4174e13ebf3d/a4d63b7d566d7a23-84/s75x75_c1/11e612203dd54a5634adab3f7b445bf91015f8e5.gif);
}

iframe{
	border:0;
	border-radius:15px;
}

.alignright{
	text-align: right;
	
}

/*Div borders */
.frills {
 border-radius: 20px;
 border-style:solid;
 z-index:0;
}

/*blue border frills*/
.one{
 border-image: var(--div-frill-one) 8 fill round;	
 padding:1px;
 border-width:7px;
}

.two{
 border-image: var(--div-frill-two) 5 fill round;	
 padding:5px;
 border-width:6px;
}

/*h3 decoration header*/
.frills h3{
  background: #f5f5f0;
  margin: 0;
  padding: 0.35em 0.25em 0.3em 0.25em;
  text-align: center;
  border-top-right-radius: 15px;
  border-top-left-radius: 15px;
  border-color: var(--color-2);
  border-bottom:none;
  border-style: dashed;
}

.texttop {
position: relative;
margin-bottom:-2.5rem;
text-align: end;
z-index: 5; 
}

/*decorations on top of containers*/
.ribbontop{
  display: flex;
  flex-flow: column;
  z-index: 1;
}

.ribbon{
	background-image:url('/img/ribbonblue.png');
	background-repeat: no-repeat;
	background-size:cover;
	z-index:1;
	height:105px;
	width:100%;
	margin-bottom:-2.5rem;
	filter:hue-rotate(250deg);
}

.ribbontwo{
	background-image:url('/img/redcorner.png');
	background-repeat: no-repeat;
	background-size:230px;
	z-index:3;
	height:149px;
	width:100%;
	margin-bottom:-9.4rem;
	border-top-left-radius:15px;
}

.cinnamaroll{
	background-image:url("/img/applenote.png");
	background-repeat: no-repeat;
	background-size:110px;
	z-index:3;
	height:139px;
	width:100%;
	margin-bottom:-9.2rem;
    -webkit-transform: scaleX(-1);
     transform: scaleX(-1);
}


.bluefrills{
	background-image:url("https://64.media.tumblr.com/ad7da49140674add06d55611cb79fd0f/f3cd385f1302cdb5-6a/s250x400/07dfc790c4fa5c2490206915d3f695a680f5ccf7.png");
	height:58px;
	background-repeat:repeat-x;
	z-index:6;
	margin-bottom:-1.5rem;
	filter:hue-rotate(70deg) saturate(190%);
	
}

/*decorations end*/

/*Introduction*/
	
.welcome{
	line-height: 2rem;
	background-image:url("https://i.pinimg.com/736x/04/3a/7c/043a7c127dd0b8c2d9f2b8d5cf494766.jpg");
	background-size:250px;
	padding:8px;
	border:3px dashed var(--color-3);
	
}

/*chatbox*/

.chatbox{
	padding:20px;
	width:100%;
	margin-top:20px;
	height:fit-content;

	
}

.frillstwo{
 border-radius: 10px;
 border-width:10px;
 border-style:solid;
 border-image: url("https://files.catbox.moe/nijjx4.png") 20 fill round;
}

#frill-border-2{
  border-style:solid;
 border-image: url("https://files.catbox.moe/c1j58g") 10 fill round;
 border-width:15px;
}

/*chatbox end*/

.inner{
padding:10px;
background: #ffffff;
background: linear-gradient(180deg, rgba(255, 255, 255, 1) 60%, rgba(247, 240, 240, 1) 100%);
border-color: var(--color-2);
border-width:2px;
border-style:dashed;
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
text-align: center;	
}

.nav{
	border-color:var(--color-2);
	padding:0;
}

.inspobuttons{
overflow-y:scroll;
height:10rem;
width:100%;
}


.inspobuttons a:hover{
 filter:opacity(0.5);
 transition:0.3s;
}

/*leftsidee start*/

.leftside{
  display:flex;
  flex-flow:column;
  justify-content: space-evenly;
  width:20%;
  gap:5px;
}

.updates{
	height:100%;
	border:3px dashed var(--color-3);
	
}


.stats{
	font-size:0.7rem;
}

/*-------leftside end----------*/

/*-----middleside start--------*/

.middleside{
  display:flex;
  flex-flow:column;
  width:60%;
  justify-content: space-evenly;
	gap:5px;
}

.middlestack{
    width: 15.5rem;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

.middlebottom{
	display:flex;
	flex-direction:row;
	gap:10px;
	background-image:url("https://i.pinimg.com/736x/da/a2/69/daa269128fd7322f069425631fe516a4.jpg");
     background-size:300px;
	border-radius:10px;
	padding:5px;
     width:100%;
	
}

.middlebottominside{
  margin:0 auto;
  display:flex;
  gap:10px;
}

/*status Cafe*/
#statuscafe {
 border-radius: 20px;
 border-width:8px;
 border-style:solid;
 margin-top:3px;
 border-image: url("/img/boarder1.png") 8 fill round;
 width:100%;
}
#statuscafe-username {
    margin-bottom: 1em;
    text-align: center;
    font-size: 0.8em;
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
    text-align: center;
    font-size:0.7em;
}

/**status Cafe end**/
/*middleside end/*


/*rightside*/

.rightside{
  display:flex;
  flex-flow:column;		
  width:20%;
  gap:5px;
  justify-content: space-evenly;
}

.mobilestack{
	display: flex;
	flex-direction: column;
	gap:5px;
	justify-content: space-evenly;
}

.stamps{
	padding-top:6px;
	padding-bottom:6px;
	background-color:white;
	border:5px solid;
	border-image: var(--div-frill-two) 6 fill round;
}

.marquee-box{
	background-color:pink;
	height:46px
}

/*site button*/

.mybutton{
	border-radius:15px;
	height:18rem;
	width:100%;
	padding:10px;
	border:3px dashed var(--color-3);
	background-image:var(--mystamps-bg);
	background-size:100px;
	display:flex;
	flex-direction: column;
}

.buttonstack{
	display:flex;
	flex-direction: row;
	flex-wrap:wrap;
	background-color: #f7f7f5;
     background: linear-gradient(180deg, rgba(255, 255, 255, 1) 60%, rgba(247, 240, 240, 1) 100%);
	border-radius:15px;
	border:1px solid var(--color-3);
	height:20rem;
	padding:5px;
	align-items: center;
	overflow:auto;
	font-size: 0.85em;
     margin:0 auto;
}
textarea {
    width: 4.5rem;
    resize: none;
    overflow: hidden;
    font-size: 0.7em;
    color:ligh;
    height: 2.06rem;
    border: 1px dashed #a6d5ed;
    border-radius: 3px;
    margin:5px;

}

/**Sitebutton end**/

/*navigation start*/

.pagelinks{
	height:20rem;
	font-size: 0.8rem;
	overflow-y: auto;
}

.button{
	text-align: left;
	padding-top:5px;
	padding-bottom:4px;
	padding-left:10px;
	font-size:11px;
	border:2px #ffe3f1 ridge grey;
     background: rgb(255,255,255);
     background: linear-gradient(to bottom, #ffffff 0%, #ffffff 50%, #dbdbdb 51%, #fff5fa 100%);
	box-shadow: 3px 3px 2px inset white, -2px -2px 1px inset #dbdbdb;
	color:#bab5b5;
}

.button:hover{
     background: rgb(255,255,255);
     background: linear-gradient(to bottom, #f5fbff 0%, #fad1ca 50%, #f2b8ae 51%, #f0f9ff 100%);
     box-shadow: -3px -3px 2px inset white, 2px 2px 1px inset #e3998d;
	border-color:#d47d6e;
	color:#d47d6e;

}

.button p:hover{
		margin-left: 9px;
		transition: margin-left 0.5s;
}


.buttonhead{
	padding:5px;
	padding-top:10px;
	border:2px solid #dbf1ff;
     background: rgb(255,255,255);
      background: linear-gradient(to bottom, #fcfffc 0%, #e9f5e9 50%, #beedbe 51%, #ffffff 100%);
	font-family:'rosalicious';
	font-size:24px;
	color:white;
     text-shadow: -1px -1px 0 #94d678, 1px -1px 0 #94d678, -1px 1px 0 #94d678, 1px 1px 0 #94d678;
}

/**Nav end**/

/**music player start**/
    #musicplayer{
        background:#ffffff; /* background color of player */
        border:4px ridge white; /* border around player */
        width:98%; /* width of the player */
	   color:lightgrey;
    }
 
    .songtitle{
        padding:5px; /* padding around song title */
        border-bottom:2px ridge white; /* border under song title */
        background: linear-gradient(to bottom, #ffffff 0%, #ffd9d6 50%, #f0a19c 51%, #fcf0f2 100%);
	   background-color:white;
        display:block;
	   color:white;
        text-shadow: 1px 0px #b55951, -1px 0px #b55951, 0px 1px #b55951, 0px -1px #b55951, 0 0;
	   font-family:'handy'
    }
 
    .controls{
        font-size:18px !important; /* size of controls */
        background: rgb(255,255,255);
        background: linear-gradient(to bottom, #ffffff 0%, #ffffff 50%, #dbdbdb 51%, #ffffff 100%);
        text-align:center;
        width:100%;
    }
 
    .controls td{
        padding:8px 5px 0px 5px; /* padding around controls */
    }
 
    .seeking{
        display:flex;
        justify-content: space-evenly;
        padding:4px; /* padding around seeking bar */
    }
 
    .current-time{
        padding-right:5px;
    }
 
    .total-duration{
        padding-left:5px;
    }
 
    i.fas.fa-pause, i.fas.fa-play, i.fas.fa-forward, i.fas.fa-backward{
        color:#f0a19c; /* color of controls */
	   text-shadow: 1px 0px grey, -1px 0px grey, 0px 1px grey, 0px -1px grey, 0 0;
	   
    }
    
    input[type=range] {
        -webkit-appearance: none;
        width: 100%;
        background-color:transparent; /* background color of seeking bar - make the color same as .seeking background color */
    }
    
    input[type=range]:focus {
        outline: none;
    }
    
    /* settings for chrome browsers */
    input[type=range]::-webkit-slider-runnable-track {
        width: 100%;
        height: 6px; /* thickness of seeking track */
        cursor: help;
        background: white; /* color of seeking track */
	   border:3px ridge white;
    }
    
    input[type=range]::-webkit-slider-thumb {
        height: 10px; /* height of seeking square */
        width: 10px; /* width of seeking square */
        border-radius: 5px; /* change to 5px if you want a circle seeker */
        background: lightgray; /* color of seeker square */
        cursor: help;
        -webkit-appearance: none;
        margin-top: -4.5px; 
    }
    
    /* settings for firefox browsers */
    input[type=range]::-moz-range-track {
        width: 100%;
        height: 2px; /* thickness of seeking track */
        cursor: help;
        background: lightgray; /* color of seeking track */
    }
    
    input[type=range]::-moz-range-thumb {
        height: 10px; /* height of seeking square */
        width: 10px; /* width of seeking square */
        border-radius: 5px; /* change to 5px if you want a circle seeker */
        background: lightgray; /* color of seeker square */
        cursor: help;
        border:none;
    }

/*Beginning of row2*/

.row2{
 width:fit-content;
 height:fit-content;
 padding:10px;	
}

/*calender*/
.calender{
 height:12.7rem;
 width:12.5rem;
}

 .clock{
   border:2px dashed var(--color-3);
   border-radius:10px;
   height:fit-content;
   padding:10px;
   margin-top:8px;
   text-align:center;
   background-color:white;
   background: linear-gradient(180deg, rgba(255, 255, 255, 1) 60%, rgba(247, 240, 240, 1) 100%);
   text-shadow: 1px 0px #b55951, -1px 0px #b55951, 0px 1px #b55951, 0px -1px #b55951, 0 0;
   font-family:'starlight';
   font-size: 20px;
   letter-spacing: 5.3px;
   color:white;
   
}

/*neighborsection*/

.neighbors{
 background-color:white;
 padding:10px;
 height:100%;
 width:15rem;
 overflow: auto;
 text-align:center;
 color:lightgrey;
}

/*featured page*/
.featuredpage{
 background-image:var(--featured-bg-1);
 background-size:cover;
 padding:15px;
 width:100%;
 height:fit-content;
 border:2px dashed var(--color-3);
 border-radius:15px;
}

.featuredcontent{
 display:flex;
 gap:5px;
 border:1px solid;
 padding:5px;
 width:100%;
 height:100%;
 background-image:var(--featured-bg-2);
}

.featuredpics{
 border:3px dashed var(--color-2);	
 padding:10px;
 background-image:var(--featured-bg-3);;
 background-size:50px;
 
}

/*to do*/

.todolist{
 padding:5px;
 border:1px dashed;
 width:100%;
 color:whitesmoke;
 text-shadow: 1px 0px var(--color-1), -1px 0px var(--color-1), 0px 1px var(--color-1), 0px -1px var(--color-1), 0 0;
 background-image:var(--to-do-list);
 background-size:195px;
 overflow:auto
}

.mobilerow2{
	display:flex;
	gap:10px;
}

.mobilesrow{
   gap:10px
}

#washitape{
 position: absolute;
 transform: translate(21.5rem, -1.6rem) rotate(-6deg);
 z-index:30;
 width:140px
 
}
 

/*mobile adjustments*/

@media screen and (max-width: 1000px){
.container{
  display:flex;
  flex-direction:column;
  flex-wrap: wrap;
  max-width:30rem;
  width: 100%;
  height:auto;
   padding: 0px;
    border-radius: 20px;
    border: 10px solid;
    border-image: url("https://files.catbox.moe/5a7vko.png") 8 fill round;
  }

.contents{
   width:100%;
   height:auto;
   display:flex;
   flex-direction:column;
  
}
	
.rightside{
	order:1;
	display:flex;
	flex-direction: column;
	width:100%;
	}
	
.leftside{
	order:3;
	width:100%;
	display:flex;
	flex-direction:column;
	gap:10px;
	
	}
	
.middleside{
	order:2;
	width:98%;
	}

.three{
	width:100%;
	}	
	
.emotionalbih{
	width:100%;
	}

.mobilestack{
	flex-direction:column;
	width:100%;
		
	}
	
 .mobilerow2{
	flex-direction:column;
  }
	
.mobilerow{
	display:flex;
	flex-direction:column;
	gap:10px;
	margin:0 2rem 0 2rem;
	
	}
	.middlebottominside{
	 flex-direction:column;
	 width:100%;
	}
	
.pagelinks{
	width:100%;
	height:23.5rem;
	}

 .righttwo,.middletwo,.lefttwo{
	  width:100%;	
	}
	
	
	.featuredcontent{
		flex-flow:column;
	}
.todolist{
 width:auto;
 margin:0 auto;
overflow: auto; 
}
.calender{
 width:13rem;
 margin:0 auto;
}

	
	.neighbors{
		width:100%;
	}

#washitape{
 display:none;
}
	
.chatbox{
	max-width:20rem;
	}
.updates{
	height:26rem;
	order:2;
	}
	
.ribbontwo{
	background-size: 200px;
	}
	
.float{
	font-size:2rem;
	z-index:10;
	position:relative;
}
	
.footsies{
	font-size:0.4rem;
}
}