.logo {
        position: absolute;
        top:10px;
        
        animation: gelatine 2s infinite;
        }

        #factDisplay {
        font-size:15px;
        font-family: 'Comic Sans MS';
        color:white;
        }

        .home:hover{
            
          animation: gelatine .5s;
        }

        
        
        .about:hover{
            
            animation: gelatine .5s;
        }

        
    
        .art:hover{
            
            animation: gelatine .5s;
        }

    
        .network:hover{
            
            animation: gelatine .5s;
        }

        
        .ask:hover{
            
            animation: gelatine .5s;
        }

        
        .mail:hover{
            
            animation: gelatine .5s;
        }

    
        
        .menubar {
            display: flex;
            justify-content:center;
            flex-direction: row;
            flex-shrink:100%;
            z-index: -1;
        }
        
        .menubar img {
            width: 100%;
            object-fit:contain;
            
        }




.box2:hover{
            
           animation: gelatine .5s;
        }

        
        
        .box3:hover{
            
           animation: gelatine .5s;
        }
.box4:hover{
            
            animation: gelatine .5s;
        }
        
        @keyframes gelatine {

            from,
            to {
                transform: scale(1, 1);
            }

            25% {
                transform: scale(.9, 1.1);
            }

            50% {
                transform: scale(1.1, .9);
            }

            75% {
                transform: scale(.95, 1.05);
            }
        }
        
        @keyframes float {
	0% {
		box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
		transform: translatey(0px);
	}
	50% {
		box-shadow: 0 25px 15px 0px rgba(0,0,0,0.2);
		transform: translatey(-10px);
	}
	100% {
		box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
		transform: translatey(0px);
	}
}
        
       .container1 {
            display: flex;
            align-items:center;
            justify-content: center;
            position: relative;
            top:-110px;
            gap:2em;
        }
        
        .container1 img {
            width: 130%;
            object-fit:contain;
          
        }

         
        
        .container2 {
            
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: top;
        position: relative;
        top:-60;  
        gap: 50px;
        width:100%;
        border-radius: 200px;
        border-style:solid;
        border-color:#0141FF;
        background: linear-gradient(180deg, #9DC7FF, #0141FF);
        font-family: 'Comic Sans MS';
        font-size: 25;
        text-align: center;
        color:white;
        animation: float 5s infinite ;
        }
    
        .box1 {
    position: relative;
    left:-200px;
    
    height: 500px;
    width: 400px;
        }
        
        .box2 {
    border-radius:100px;
    border-width: 5px;
    border-style:groove;
    border-color: 42AEFF;
    background-image: url(img/art/2026/thumb/anim.png);
    background-size: cover;
    height: 700px;
    width: 800px;
    font-size: 40px;
        }
        
        .box2 img {
border-radius: 20px;
max-width: 100%;
height: 100%;
display: flex;
}
        
      .container3 {
            
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            position: relative;
            top:-60;
            gap: 50px;
            width:100%;
            border-radius: 200px;
        border-style:solid;
        border-color:#0141FF;
        background: linear-gradient(180deg, #9DC7FF, #0141FF);
        animation: float 4.5s infinite ;
        }  
        
        
        .box3 {
    position: relative;
    top:8px;
    border-radius:30px;
    border-width: 5px;
    border-style:groove;
    border-color: 42AEFF;
    background-image: url(img/Illustration.png);
    background-size: cover;
    height: 80px;
    width: 250px;
    
    
        }
    
    
    .box4 {
    border-radius:30px;
    border-width: 5px;
    border-style:groove;
    border-color: 42AEFF;
    background-image: url(img/sallydressupthumb.png);
    background-size: cover;
    height: 80px;
    width: 250px;
        }
       
        .myBox {
    transform: rotate(-7deg);
    padding-left: 30px;
    position: relative;
    top:240px;
    left:60px;
    font-family: 'Comic Sans MS';
    font-size: 20px;
    width: 230px;
    height: 180px;
    overflow: auto;
        }
     
        #pc {
            
           
            position: absolute;

            
        }
        
  ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
            
        
  ::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #2a4cff;
    box-shadow: inset 0 0 6px rgba(19, 34, 117);
}    
        
        
  ::-webkit-scrollbar-track {
    box-shadow: inset 0 0 10px #00a0ff;
    border-radius: 10px;
}