body {
                            font-family: 'MS Gothic', sans-serif;
                            background-image: url(eyebg.jpg);
                            background-repeat: repeat;
                              background-size: 20%;
                        }

  .bio{
                            height: 400px;
                            width: 300px;
                            margin: 8px;
                            padding: 4px;
                            border: solid 2px blue;
                            text-align: center;
                        }
a:link {
  color: #FFE033;
}

/* visited link */
a:visited {
  color: #93FF33;
}

/* mouse over link */
a:hover {
  color: #FFC300;
}

/* selected link */
a:active {
  color: #FF7133;
}

/* Start https://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/smilies/smi-3/smi211.cur), auto !important;} /* End https://www.cursors-4u.com */




.banner {
display: flex;
justify-content: center;
}

.box{
display: flex;
justify-content: center;
font-family: 'Venice', sans-serif;
}

.rotate img{
transition: 1s ease;
}

.rotate img:hover{
-webkit-transform: rotateZ(-10deg);
-ms-transform: rotateZ(-10deg);
transform: rotateZ(-10deg);
transition: 1s ease;
}

.grow img{
transition: 1s ease;
}

.grow img:hover{
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
transition: 1s ease;
}
  
  .brighten img {
-webkit-filter: brightness(50%);
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}

.brighten img:hover {
-webkit-filter: brightness(100%);
}

.icons  {
  display: flex;
justify-content: center;
background-image: url("https://sadgrl.online/webmastery/downloads/tiledbgs/background038.gif");
}

.split {
  height: 100%;
  width: 50%;
  position: fixed;
  z-index: 1;
  top: 0;
  overflow-x: hidden;
  padding-top: 20px;
    }
    
.center {
  border: 5px solid;
  margin: auto;
  width: 30%;
  padding: 10px;
}

.leftblogbox{
  height:100%;
  width:20%;
  justify-content: center;
  float: left;
  padding:10px;
}

.rightblogbox{
  border: 5px solid;
  justify-content: center;
  float: right;
  height: 100%;
  width:60%;
  padding:10px;
}

  img { 
  max-width: 100%;
}
/***
EZ Gallery by netfriend - https://netfriend.neocities.org/ez-gallery/
Released under the Unlicense - https://unlicense.org/
***/

.ezgallery.montage { 
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.ezgallery.montage img {
  flex: auto;
  margin: 0 5px 5px 0;
  object-fit: contain;
  object-position: bottom;
}

.ezgallery.horizontal { 
  display: grid;
  grid-gap: 5px;
  gap: 5px;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  grid-auto-rows: minmax(100px, auto);
}

.ezgallery.horizontal a {
  text-align: center;
}

.ezgallery.horizontal img {
  text-align: center;
  vertical-align: middle;
  margin: 0 5px 5px 0;
  max-width: 100px;
  max-height: 100px;
  object-fit: contain;
  object-position: bottom;
}

#statuscafe {
    padding: .9em;
    background-color: black;
    border: 1px solid midnightblue;
}
#statuscafe-username {
    margin-bottom: .5em;
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
}

.floating {  
    animation-name: floating;
    animation-duration: 12s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 30px;
    margin-top: 5px;
}


@keyframes floating {
    0% { transform: translatey(0,  0px); }
    50%  { transform: translatey(0, 15px); }
    100%   { transform: translatey(0, -0px); }    
}


.spin {
 animation: spin 10s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.fade {
    animation: fade ease 2s; /* 3s, of course, signifies 3 seconds, the duration of the fade - change this if you wish! */
    
    }
    @keyframes fade {
    0% {opacity:0;}
    100% {opacity:1;}
    }

 .slide {
      animation: slide ease 2s; /* 3s, of course, signifies 3 seconds, how long the slide takes - change this if you wish. */
    }
    @keyframes slide {
      0% {
        transform: translateX(-100%);
      }
      100% {
        transform: translateX(0%);
      }
    }

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}