
/**************************************************/
/*                                   Body and Wrapper                             */
/**************************************************/

body {
background: #70d6ff url(https://sord.neocities.org/kandi/back.png) top center repeat-x; 
margin: 0;
padding: 0;
font: normal 16pt "Text Me One", sans-serif;
}

#wrapper {
margin: 0 auto;
width: 800px;
padding: 0;
text-align: left;
}

/**************************************************/
/*                                       Top Piece                                        */
/**************************************************/

#top {
background: url(https://sord.neocities.org/kandi/bgtop.png) top center no-repeat; 
width: 800px;
height: 78px;
}

/**************************************************/
/*                                       Content                                             
another wrapper that holds all the content                              */
/**************************************************/

#content {
background: url(https://sord.neocities.org/kandi/bgmiddle.png) center repeat-y; 
width: 766px;
height: auto;
padding: 0px 17px 0px 17px;
}

/**************************************************/
/*                               All the content                                        */
/**************************************************/

#header {
background: url(https://sord.neocities.org/kandi/headercutes.png) top center no-repeat; 
width: 746px;
height: 106px;
margin: 0px 0px 10px 0px;
padding: 60px 0px 0px 20px;
color: #1982c4;
font: normal 50pt "Silkscreen", sans-serif;
text-align: start
}
/*                    Menu                   */
#menu {
width: 200px;
height: 100%;
margin-left: 10px;
float: left;
text-align: left;
}

#menu li a {
height: 37px;
voice-family: "\"}\""; 
voice-family: inherit;
height: 29px;
text-decoration: none;
text-align: left;
}	
	
#menu li a:link, #menu li a:visited {
color: navy;
display: block;
background:  url(https://sord.neocities.org/kandi/off.png) top center no-repeat;
padding: 8px 0 0 10px;
height: 29px;
text-align: left;
}
	
#menu li a:hover {
color: blue;
background:  url(https://sord.neocities.org/kandi/on.png) top center no-repeat;
padding: 8px 0 0 10px;
height: 29px;
text-align: left;
}	

ul {
list-style: none;
margin: 0;
padding: 0;
text-align: left;
}

#stuff {
background:  url(https://sord.neocities.org/kandi/texttop.png) top left no-repeat;
width: 520px;
margin: 0px 0px 0px 220px;
padding-top: 55px;
border: 2px navy;
}

img {
border: none;
} 

/**************************************************/
/*                                       Bottom                                             */
/**************************************************/

#bottom {
background: url(https://sord.neocities.org/kandi/bgbottom.png) bottom center no-repeat; 
width: 800px;
height: 50px;
}

.scroller {
  width: 300px;
  height: 100px;
  overflow-y: scroll;
  scrollbar-color: #7bdff2 #b2f7ef;
}  



.silkscreen-regular {
  font-family: "Silkscreen", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.silkscreen-bold {
  font-family: "Silkscreen", sans-serif;
  font-weight: 700;
  font-style: normal;
}


.text-me-one-regular {
  font-family: "Text Me One", sans-serif;
  font-weight: 400;
  font-style: normal;
}

::-moz-selection { /* Code for Firefox */
  color: #540d6e;
  background: #b2f7ef;
}

::selection {
  color: #540d6e;
  background: #b2f7ef;
}


  .bouncyyy {
                                  font-family:"Silkscreen", sans-serif;
                                    font-size: 70px;
                                    z-index: 99;
                                    color: #00bbf9;    
                                    filter: drop-shadow(1px 1px 0 #1982c4) drop-shadow(-1px 1px 0 #1982c4) drop-shadow(0 -1px 0 #1982c4) drop-shadow(2px 0 #1982c4);
                                    animation: bounce 2s infinite;
                                    animation-timing-function: cubic-bezier(0.25, 0.85, 0.4, 1);
                                  }
                                
                                  .letterone {
                                   
                                    animation-delay: 0s;
                                    display: inline-block;
                                  }
                                
                                  .lettertwo {
                                   
                                    animation-delay: 0.1s;
                                    display: inline-block;
                                  }
                                
                                  .letterthree {
                                    
                                    animation-delay: 0.15s;
                                    display: inline-block;
                                  }
                                
                                  .letterfour {
                                    
                                    animation-delay: 0.2s;
                                    display: inline-block;
                                  }
                                  
                                  .letterfive {
                                    
                                    animation-delay: 0.25s;
                                    display: inline-block;
                                  }
                                  
                                  .lettersix {
                                    
                                    animation-delay: 0.3s;
                                    display: inline-block;
                                  }
                                  
                                  .letterseven {
                                    
                                    animation-delay: 0.35s;
                                    display: inline-block;
                                  }
                                
                                  @keyframes bounce {
                                    0% {
                                      transform: scale(1, 1) translateY(0);
                                    }
                                
                                    10% {
                                      transform: scale(1.1, .9) translateY(0);
                                
                                    }
                                
                                    30% {
                                      transform: scale(.9, 1.1) translateY(-30px);
                                      transform: rotate(-10deg);
                                    }
                                
                                    50% {
                                      transform: scale(1.05, .95) translateY(0);
                                      transform: rotate(10deg);
                                    }
                                
                                    60% {
                                      transform: scale(1, 1) translateY(-4px);
                                      transform: rotate(-10deg);
                                    }
                                
                                    100% {
                                      transform: scale(1, 1) translateY(0);
                                    }
                                  }
                                
                                
                                
                                /***
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;
}
  