:root {
      --tan: #f9f7f5;
      --darktan: #f1ebe7;
      --darkertan: #eae1db;
      --brown: #b49d81;
      --pink: #ff99cc;
      --red: #ef8a85;
      --yellow: #f8e268;
      --blue: #00b2c5;
      --green: #a4d07a;
      --darktext: #675A4A;
}
  
* {
  cursor: url(/archive/july2023/cursor.png), auto !important;
}

@font-face {
font-family: monster; 
src: url(https://dl.dropbox.com/s/130c77g5yd5z1do/MonsterFriendFore.otf);
}

#float {
  float: left;
  margin-right:7px;
  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, 7px); }
  100%   { transform: translate(0, -0px); }    
}

h1 {
  margin-top:0px;
  margin-bottom:14px;
  font-weight: normal;
  font-size: 23px;
  text-align:left;
  color:white;
  text-shadow: -1.5px 0 var(--darktext), 0 1.5px var(--darktext), 1.5px 0 var(--darktext), 0 -1.5px var(--darktext);
  font-family: "monster";
}

h2 {
  margin-top:0px;
  margin-bottom:14px;
  font-weight: normal;
  font-size: 13px;
  text-align:left;
  color:white;
  text-shadow: -1.5px 0 var(--darktext), 0 1.5px var(--darktext), 1.5px 0 var(--darktext), 0 -1.5px var(--darktext);
  font-family: "monster";
}

h3 {
  margin-top:2px;
  margin-bottom:4px;
  border-bottom: var(--darktext) 1.5px solid;
  padding:2px;
  font-size:11px;
  color:white;
  text-shadow: -1.5px 0 var(--darktext), 0 1.5px var(--darktext), 1.5px 0 var(--darktext), 0 -1.5px var(--darktext);
  font-family: "monster";
}

a, a:visited {
  font-weight:bold;
  color:#6661d0;
  text-decoration:none;
  font-size:13px;
}

a:hover {
  color:#f598b8;
  text-decoration:underline;
}

   /* . . . . . . . . . . . . . . . . */ 
    ::-webkit-scrollbar {
        width: 10px;
        height: 10px;}

    
    ::-webkit-scrollbar-thumb:vertical{
        background:#b0e2ff;}

    /* . . . . . . . . . . . . . . . . */ 
    
    ::-webkit-scrollbar-track {
        background-color:#dbf2ff;}

    /* . . . . . . . . . . . . . . . . */ 
    
    
    ::-webkit-scrollbar-button:vertical:increment {
        background-image: url('https://64.media.tumblr.com/4b98937f4c8275d8f359c72d48077d63/82cc59cca13b4819-87/s75x75_c1/b2c4a5d8166d1899fc057334849fe6a9ee78cb04.png');
        background-size:contain;
        width: 9px;
        height: 11px;
        background-color:#b0e2ff;}

    /* . . . . . . . . . . . . . . . . */ 
    
    ::-webkit-scrollbar-button:vertical:decrement {
        background-image:url(https://64.media.tumblr.com/3978da85f100af80be9c640f7143153f/82cc59cca13b4819-9b/s75x75_c1/d8319cafbf5809a089281996c8436cbabf28341c.png);
        background-size:contain;
        background-color:#b0e2ff;
        width: 9px;
        height: 11px;}  
  
    /* . . . . . . . . . . . . . . . . */
    
    @font-face {
font-family: monster; 
src: url(https://dl.dropbox.com/s/130c77g5yd5z1do/MonsterFriendFore.otf);
}

body {
  font-family:"MS PGothic";
  background:url("/archive/july2023/pink_03.png");
  height:100%;
  margin:0px;
  font-size:14px;
  overflow:hidden;
}

#parent {
  border:transparent 10px solid;
  border-image:url("/archive/july2023/blue05.png") 10 fill round;
  width:62%;
  margin:0 auto;
}

#header {
  height:13%;
  width:100%;
  margin-top:0px;
  margin:0 auto;
  background:url("/archive/july2023/sharks0.jpg");
  background-position:10% 30%;
  background-size:cover;
  border-left:#75d7f0 2px solid;
  border-right:#75d7f0 2px solid;
}

#container {
  border-left:#75d7f0 2px solid;
  border-right:#75d7f0 2px solid;
  border-bottom:#75d7f0 2px solid;
  display:grid;
  grid-template-columns: 18% 65% 17%;
  width:100%;
  height:596px;
  background:white;
  margin:0 auto;
  color:var(--darktext);
  overflow:hidden;
}

#left {
  height:596px;
  float:left;
  border-right:#75d7f0 1px solid;
  padding-left:5px;
  padding-right:5px;
  overflow-y:auto;
  overflow-x:hidden;
}

#center {
  height:596px;
  overflow-y:auto;
  overflow-x:hidden;
  border-right:#75d7f0 1px solid;
}

#center .box {
  padding:5px;
  height:auto;
  border-bottom:#75d7f0 1px solid;
}

#center .two {
  display:grid;
  grid-template-columns: 54% 46%;
  height:auto;
  width:100%;
  height:260px;
}
  

#right {
  height:596px;
  padding:3px;
  overflow-y:auto;
  overflow-x:hidden;
  float:right;
}
