::-webkit-scrollbar {
  width: 12px;
  height: 12px; 
}
::-webkit-scrollbar-thumb {
  background: var(--scrollbar-foreground);
  background-color:#949494;
  background:linear-gradient(#ff5500,#d12a00);
  border-radius: 999px;
  border: 3px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-track {
  background: var(--scrollbar-background);
  background: transparent;
}
::selection {
  background:rgba(255,240,0,0.3)
}
@keyframes scroll {
  0% {
  background-position:0px 0px;
}
100% {
  background-position:500px -500px;
}
}body {
  background-color:#FFCB00;
}
.blogbox .sized {
  width:40%;
}
#sidebar {
  position:fixed;
  height:100%;
  text-align:center;
  width:15%;
  padding:2em 1em;
  margin-left:20px;
  z-index:99;
  border-left:3px dashed #FFCB00;
  border-right:3px dashed #FFCB00;
  border-top:none;
  border-bottom:none;
  outline:4px solid rgba(250,92,0,0.4);
  filter:drop-shadow(8px 0px 0px rgba(201,21,0,0.20));
  background-color:rgba(250,92,0,0.45);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  font-family:"Comic Relief";
  color:#ffff00;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
#sidebar a {
  display:block;
  text-overflow:clip;
  overflow:hidden;
  white-space:nowrap;
  transition:0.3s;
}
#sidebar a {
  text-decoration:none;
}
#sidebar img {
  margin:.5em;
  width:95%;
}
#rside {
  transition: left 0.3s ease;
  position:fixed;
  left:81%;
  top:0;
  height:100%;
  text-align:center;
  width:15%;
  padding:2em 1em;
  margin-left:20px;
  z-index:99;
  border-left:3px dashed #FFCB00;
  border-right:3px dashed #FFCB00;
  border-top:none;
  border-bottom:none;
  outline:4px solid rgba(250,92,0,0.4);
  filter:drop-shadow(-8px 0px 0px rgba(201,21,0,0.20));
  background-color:rgba(250,92,0,0.45);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  font-family:"Comic Relief";
  color:#ffff00;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  opacity:1;
  visibility:visible;
}
#rside a {
  display:block;
  text-overflow:clip;
  overflow:hidden;
  white-space:nowrap;
  transition:0.3s;
}
#rside a {
  text-decoration:none;
}
#rside img {
  margin:.5em;
}
.imgside1 {
  width:68%;
}
.imgside2 {
  width:83%;
}
hr {
  border:2px dashed #FFCB00;
  width:100%;
}

.blogbox {
  text-align:center;
  width:65%;
  padding:5px;
  z-index:99;
  border:3px dashed #FFCB00;
  border-radius:50px;
  box-sizing:border-box;
  outline:4px solid rgba(250,92,0,0.4);
  filter:drop-shadow(8px 8px 0px rgba(201,21,0,0.20));
  background-color:rgba(250,92,0,0.45);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  margin:0 auto;
  max-width:60em;
  font-family:"Comic Relief";
  color:#ffff00;
}
.minipadding {
  padding:12px;
}
img {
  transition:0.5s;
}
.blogbox img {
  width:85%;
  border-radius:20px;
  padding:2px;
  border:2px dashed #FFCB00;
  text-align:center;
}
.blogbox img:hover {
  rotate:0deg;
  transform:scale(103%);
  filter:hue-rotate(-0.15turn);
  cursor:grab;
}
.blogbox img:active {
  cursor:grabbing;
  transform:scale(96%);
}
video {
  transition:0.3s;
}
.blogbox video {
  width:85%;
  border-radius:20px;
  padding:2px;
  border:2px dashed #FFCB00;
  text-align:center;
}
.blogbox video:hover {
  rotate:0deg;
  transform:scale(103%);
  filter:hue-rotate(-0.15turn);
  cursor:grab;
}
.blogbox video:active {
  cursor:grabbing;
  transform:scale(96%);
}
.pop {
  -webkit-animation:pop 1.5s ease-in-out infinite;
  animation:pop 1.5s ease-in-out infinite;
  -moz-animation:pop 1.5s ease-in-out infinite;
}
@keyframes pop {
  from {
  -webkit-transform:scale3d(1,1,1);
  transform:scale3d(1,1,1);
}
30% {
  -webkit-transform:scale3d(1.25,0.75,1);
  transform:scale3d(1.25,0.75,1);
}
40% {
  -webkit-transform:scale3d(0.75,1.25,1);
  transform:scale3d(0.75,1.25,1);
}
50% {
  -webkit-transform:scale3d(1.15,0.85,1);
  transform:scale3d(1.15,0.85,1);
}
65% {
  -webkit-transform:scale3d(0.95,1.05,1);
  transform:scale3d(0.95,1.05,1);
}
75% {
  -webkit-transform:scale3d(1.05,0.95,1);
  transform:scale3d(1.05,0.95,1);
}
to {
  -webkit-transform:scale3d(1,1,1);
  transform:scale3d(1,1,1);
}
}@-webkit-keyframes pop {
  from {
  -webkit-transform:scale3d(1,1,1);
  transform:scale3d(1,1,1);
}
30% {
  -webkit-transform:scale3d(1.25,0.75,1);
  transform:scale3d(1.25,0.75,1);
}
40% {
  -webkit-transform:scale3d(0.75,1.25,1);
  transform:scale3d(0.75,1.25,1);
}
50% {
  -webkit-transform:scale3d(1.15,0.85,1);
  transform:scale3d(1.15,0.85,1);
}
65% {
  -webkit-transform:scale3d(0.95,1.05,1);
  transform:scale3d(0.95,1.05,1);
}
75% {
  -webkit-transform:scale3d(1.05,0.95,1);
  transform:scale3d(1.05,0.95,1);
}
to {
  -webkit-transform:scale3d(1,1,1);
  transform:scale3d(1,1,1);
}
}p {
  filter:drop-shadow(0px 0px 3px rgba(255,240,0,0.7));
}
.logo {
  margin:0 auto;
  height:100px;
  transition:0.3s;
  filter:drop-shadow(0px 0px 5px rgba(163,11,0,0.8));
}
.logo:hover {
  filter:drop-shadow(7px 7px 5px rgba(255,240,0,0.7)) brightness(2);
  rotate:5deg;
}
.textblog {
  margin-top:20px;
  margin-bottom:20px;
  margin-right:100px;
  margin-left:100px;
  display:inline-block;
  font-size:20px;
}
.float {
  animation-name:floating;
  animation-duration:3s;
  animation-iteration-count:infinite;
  animation-timing-function:ease-in-out;
  transition:0.3s;
}
.float:hover {
  filter:brightness(2);
}
@keyframes floating {
  0% {
  transform:translate(0,0px);
}
50% {
  transform:translate(0,15px);
}
100% {
  transform:translate(0,-0px);
}
}@media screen and (max-width:1624px) {
  #sidebar {
  display:none;
}
}@media screen and (max-width:1624px) {
  #rside {
  display:none;
}
}/* Responsive layout */ @media screen and (max-width:600px) {
  .textblog {
  margin-top:10px;
  margin-bottom:20px;
  margin-right:10px;
  margin-left:10px;
  display:inline-block;
  font-size:14px;
}
.blogbox {
  width:85%;
}
}/* Responsive layout */ @media screen and (max-width:900px) {
  .logo {
  height:65%;
  width:65%;
}
}/* Responsive layout */ @media screen and (max-width:1300px) {
  .logo {
  height:55%;
  width:55%;
}
}/* Responsive layout */ @media screen and (max-width:1050px) {
  .logo {
  height:65%;
  width:65%;
}
}/* Responsive layout */ @media screen and (max-width:1200px) {
  .logo {
  height:65%;
  width:65%;
}
}.footersentence {
  border-radius:50px;
  max-width:60em;
  width:45%;
  padding:5px;
  color:#fff000;
  font-family:Comic Relief;
  text-align:center;
  border-color:none;
  font-size:14px;
  margin:0 auto;
  background-color:rgba(250,92,0,0.45);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  border:3px dashed #FFCB00;
  outline:4px solid rgba(250,92,0,0.4);
}
@media screen and (max-width:1150px) {
  .footersentence {
  display:none;
}
}@media screen and (min-width:1151px) {
  .footersentence {
  display:block;
  width:55%;
}
}@media screen and (min-width:1550px) {
  .footersentence {
  width:40%;
}
}.shake {
  animation:shake 0.5s;
  animation-iteration-count:infinite;
  transition:0.3s;
}
@keyframes shake {
  0% {
  transform:translate(1px,1px) rotate(0deg);
}
10% {
  transform:translate(-1px,-2px) rotate(-1deg);
}
20% {
  transform:translate(-3px,0px) rotate(1deg);
}
30% {
  transform:translate(3px,2px) rotate(0deg);
}
40% {
  transform:translate(1px,-1px) rotate(1deg);
}
50% {
  transform:translate(-1px,2px) rotate(-1deg);
}
60% {
  transform:translate(-3px,1px) rotate(0deg);
}
70% {
  transform:translate(3px,1px) rotate(-1deg);
}
80% {
  transform:translate(-1px,-1px) rotate(1deg);
}
90% {
  transform:translate(1px,2px) rotate(0deg);
}
100% {
  transform:translate(1px,-2px) rotate(-1deg);
}
}.button {
  background-color:#fff000;
  font-family:Comic Relief;
  color:#ff5500;
  border-bottom:5px solid #bf2d00;
  padding:10px;
  font-size:20px;
  border-right:transparent;
  border-top:transparent;
  border-left:transparent;
  border-radius:13px;
  cursor:pointer;
}
.button:active {
  border:none;
  transform:translate(0px,5px);
}