:root {
     --dk-color:#FF84B2;
     --dkmid-color:#FEB2CE;
     --mid-color:#FFEDFB;
     --lt-color:#fff;
     --dkest-color:#888;
     --accent:#6ca2e0;
     --lt-blue:#bbebf6;
}
html, * {
  cursor: url("cursors_favicons/mew.gif"), auto;
}

a:hover, button:hover{
  cursor: url("cursors_favicons/mews.gif"), auto;
} 
html, body {
     margin:0;
     /* padding-top:25px;
     padding:0; */
     height:100%;
     font-family:'pixelify sans';
     font-size:11px;
     background-image:url(img/7vLl.gif);
     background-repeat:repeat;
     color:var(--dkest-color);
     padding:1px;
     overflow-y:hidden;
     /* scrollbar-color: var(--dkest-color) #ffffff;
     scrollbar-width: auto; */
}
hr {
    display: none;
}


body a {
  color:var(--accent);
  font-weight:bold;
  }
 #container {
     max-width:900px;
     margin:0 auto;
     margin-top:15px;
     height:100%;
}
a:link, a:visited, a:active { 
color:#6ca2e0;text-decoration:none;}
a:hover {
color:#FEB2CE;}

b {color:#6ca2e0;font-weight:bold;}
i {color:#FF84B2;font-style:normal;}
 h1, h3, h5 {
     color:var(--dk-color);
}
 h2, h4, h6 {
     color:var(--accent);
  }
 #header {
     max-width:350px;
     height:60px;
     margin-left:5px;
     margin-right:5px;
     margin:0 auto;
     /* background-color:var(--dkmid-color);
     border:1px solid var(--dk-color); */
     /* border-radius:15px; */
}
 .title {
     font-size:40px;
     text-align:center;
     font-style:italic;
     color:var(--accent);
}
 #wrapper {
     margin:0 auto;
     max-width:860px;
}
.content {
  padding-right:10px;
  padding-left:10px;

  }
 #two-boxes {
     display:flex;
     flex-wrap:wrap;
     max-width:900px;
     
}
 .box-one, .box-two, .box-three, .box-four, .box-five, .box-six {
     border:1px solid var(--dk-color);
     background-color:transparent;
     border-width:10px;
     border-style:solid;
     border-image: url("pink_border.png") 8 fill round;
    /* overflow-y:auto; */
     overflow:auto;
}
 .box-one, .box-two {
     height:200px;
     width:400px;
     margin-left:5px;
    /* border-width:10px;
     border-style:solid;
    border-image: url("pink_border.png") 8 fill round;
    overflow-y:auto; */
}
 .box-one {
     margin-top:5px;
     margin-right:5px;
     border-top-left-radius:15px;
}
 .box-two {
     margin-top:5px;
     margin-right:5px;
     border-top-right-radius:15px;
}

 .box-three, .box-four {
     height:300px;
 }

 .box-three {
     margin-left:5px;
     margin-top:5px;
     width:225px;
     /* height:250px; */
     border-bottom-left-radius:15px;
     /* border-width:10px;
     border-style:solid;
     border-image: url("pink_border.png") 8 fill round;
     overflow-y:auto; */
     
}
 .box-four {
     margin-top:5px;
     margin-left:5px;
     width:579px;
     /* border-width:10px;
     border-style:solid;
     border-image: url("pink_border.png") 8 fill round;
     overflow-y:auto; */
     /* border-bottom-right-radius:15px; */
}
 .box-five, .box-six {
     /* height:500px; */
     width:100%;
     margin-left:5px;
     /* border-radius:15px; */
}
 .box-five {
     margin-top:5px;
     margin-right:5px;
     /* border-width:10px;
     border-style:solid;
     border-image: url("pink_border.png") 8 fill round;
     overflow-y:auto; */
}
 .box-six {
    margin-top:5px;
    /* border-width:10px;
    border-style:solid;
    border-image: url("pink_border.png") 8 fill round;
    overflow-y:auto; */  
}
 .section-title {
     margin-top:5px;
     margin-right:5px;
     margin-left:5px;
     text-align:center;
     font-weight:bold;
     padding-top:5px;
     padding-bottom:5px;
     background-color:var(--mid-color);
     color:var(--dk-color);
     font-size:14px;
     border-bottom:4px solid #FEB2CE;
     border-radius:15px;

}
/* .contenttitle {
    background:#FFEDFB;
    font:26px 'pixelify sans', arial;
    color:#6ca2e0;
    border-radius:15px;
    text-align:center;
    border-bottom:4px solid #FEB2CE;
    margin-bottom:4px;} */

 .nav-wrapper {
     display:flex;
     flex-wrap:wrap;
     width:400px;
     height:50px;
     margin:0 auto;
     justify-content:space-evenly;
     /* margin-top:5px; */
}
 button {
     width:150px;
     height:35px;
     background-color:var(--lt-blue);
     color:var(--dkest-color);
     font:normal 12px 'pixelify sans';
     font-weight:bold;
     border:none;
     margin-top:5px;
     margin-right:5px;
     border-radius:15px;
     border-bottom:4px solid var(--accent);
     border-radius:15px;
}
  button a {
    color:var(--lt-color);
    font-weight:bold;
  }
  p {
     padding:5px;
}
 p a {
  color:var(--dkest-color);
  font-weight:bold;
  }
 .scroll::-webkit-scrollbar-track {
     background-color: var(--lt-color);
}
 .scroll::-webkit-scrollbar {
     width: 10px;
     background-color: #f2b1a4;
}
 .scroll::-webkit-scrollbar-thumb {
     background-color: var(--dk-color);
}
.marquee-wrap {
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
}

.marquee-inner-b4 {
  display: inline-flex;
  animation: marquee 10s linear infinite alternate;
  align-items: center;
}

.marquee-small-b4 {
  animation: marquee-small 1s linear infinite alternate;
}

@keyframes marquee-small {
  from { transform: translateX(25%); }
  to   { transform: translateX(2%); }
}


@keyframes marquee {
  from { transform: translateX(50%); }
  to   { transform: translateX(-92%); }
}

 #footer {
     text-align:center;
     padding-top:5px;
     margin-bottom:5px;
}
 #footer p {
     /* background-color:white; */
     display:block;
     width:160px;
     margin:0 auto;
     /* margin-top:5px;
     margin-bottom:5px; */
     /* padding:5px; */
     border-width:10px;
     border-style:solid;
     border-image: url("pink_border.png") 8 fill round;
     overflow-y:auto;
}
textarea {
  background-color:var(--dk-color);
  color:var(--lt-color);
  font-size:10px;
  }
 @media only screen and (max-width: 860px) {
     html, body {
         overflow:visible;
    }
    #header {
      width:97.6%;
    }
     #container {
         width:100%;
    }
     .box-one, .box-two, .box-three, .box-four, .box-five, .box-six {
         width:100%;
    }
    .box-two {
      order:1;
    }
    .box-one {
      order:2;
    }
     .box-three {
         width:98%;
    }
     .three-boxes {
         width:98%;
    }
     .two-boxes {
         width:100%;
    }
     .wrapper {
         width:100%;
    }
}


