
body {margin: 0; background: #150425;} .flex {display: flex;justify-content: center;}

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: transparent; border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #9c9cc1;border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #e24081; cursor: url("img/pointer.png"), default;
}


#border {
  width: 901px; height: 901px; left: 0px;position: absolute; z-index: 99; pointer-events: none; background: url('img/border/splash_border.png');
}

#container { background: 
  url('img/splash_border.png'), 
  url('img/bg/splash_tube_2.png'), 
  url('img/bg/grass.png'), 
  url('img/bg/swirly.png');
  background-repeat: no-repeat; border: 1px solid transparent ; width: 900px; height: 900px;margin: auto; position: relative; margin-top: 0px;}

#logo {transform: rotate(-3deg); position: absolute; top: 105px; left: 120px; transition: 0.4s; pointer-events: auto;z-index: 99;}
#logo:hover {animation: gelatine 0.5s infinite;}

@keyframes gelatine {
from, to { transform: scale(1, 1); }
  25% { transform: scale(0.9, 1.1); }
  50% { transform: scale(1.1, 0.9); }
  75% { transform: scale(0.95, 1.05); }
}
#sub { pointer-events: auto; transform: rotate(-1deg); position: absolute; top: 245px; left: 130px; color: #ffe2ee; 
  font-family: 'Fredoka One', sans-serif; font-size: 27px; -webkit-text-stroke: 1px #4a1f74; 
  text-shadow: -2px 3px 1px #4a1f74,  0px 2px 1px #4a1f74, 1px 0px 1px #4a1f74,  -1px 1px 1px #4a1f74, 
  0px -1px 1px #4a1f74 ; pointer-events: auto;z-index: 97;}  
#sub::selection { color: hotpink;}

#main { margin: auto; width: 660px; height: 420px; border: 5px solid #2e0b4f; border-radius: 10px; margin-top:170px; background: url('img/bg/splash_tex.png'); pointer-events: auto;position: relative;}
#left {width: 270px;margin-left: 5px;} #right{margin-left: 5px;}
#visit{color: lime; height: 1px;font-family: ms pgothic;float:right; margin-top: 10px;}
#webring { width: 265px;  margin: auto; margin-top: 100px; overflow-y: auto; height: 268px; background:  #2e0b4f; border-radius: 10px;}
#warning { background-image: url('img/bg/splash_bg.png');
  text-align: center; font-family: fingerlinger; color: #2e0b4f;position: relative; 
  border: 3px solid; margin-top: 14px; width: 370px; height: 349px; border-radius: 10px;overflow: hidden; }
#c { background: #F7D960; width: 600px; font-size: 20px; position: absolute;left: -46px; top: 10px; 
  transform: rotate(1deg);  font-family: Tahoma, sans-serif; font-weight: bold; color:  #150425;height: 25px;}
#p-1 { color: #150425;text-align: center;margin-top: 38px;} #p-2 {font-size: 15px; margin-top: 16px;}
#w-i {margin: auto;  margin-top: -13px;}
.icon { text-align: center; width: 70px; margin: 1px; height: 90px;}
.icon img {border: 2px solid #4a1f74; width: 60px; height: 60px; border-radius: 10px;}
.icon p { color: #150425; font-family: fingerlinger; margin-top: 0px; font-size: 14px; font-weight: bold;}
.icon:hover {cursor: url("/img/pointer.png"), default;}


#enter, #leave { text-align: center;
  color: #ffe2ee; font-family: 'Fredoka One', sans-serif; -webkit-text-stroke: 1px #4a1f74; 
  text-shadow: -2px 3px 1px #4a1f74,  0px 2px 1px #4a1f74, 1px 0px 1px #4a1f74,  -1px 1px 1px #4a1f74, 0px -1px 1px #4a1f74 ;
}
#e-l {margin: auto; margin-top: 10px;width: 318px; height: 110px;}

#counter {margin-top: 10px; margin-left: 40px;}
#butts {margin: auto; margin-top: 10px;} #butts img { width: 88px; height: 31px;}

#foot {text-align: center; position: absolute;z-index: 120;left: 320px;bottom: 140px; color: #6a279c;font-family: fingerlinger;} #foot:hover {color: hotpink;}


