a:link {
		    color: #0000FF;
	        text-decoration: none;
	}
	
	        a:visited {
	        color: #00FFFF;
	        text-decoration: none;
	}
	
	        a:active {
	        color: #FF00A6;
	        text-decoration: none;
	}
	
	html {
	            justify-content: center;
	            align-items: center;
	            &user-select: none;
	        }
	
	body {
	            font-family: Arial, sans-serif;
	            display: flex;
	            justify-content: center;
	            align-items: center;
	            height: 100vh;
	            margin: 60px; 
                    background-color: #f0f0f0;
        }

s1 {
           color: #406BCD; 
           width:640px; 
           font-size: 48px; 
           font-weight: 500;
           font-family:arial; 
           text-align:center; 
           text-shadow: 2px 1px 1px #000000;
           display: inline-block;
         }

s2{
	 color: #406BCD;
         width:640px; 
         font-size: 36px; 
         font-weight: 600;
         font-family:arial; 
         display:block; 
         text-align:center; 
         text-shadow: 2px 1px 1px #DEDEDE; 
         font-family: arial;
       }         

s3 {
    	left:320px; 
        color: #000000; 
        width:640px; 
        font-size: 23px; 
        font-weight: 380;
        font-family: arial;
        text-align: justify; 
        text-shadow: 2px 1px 1px #B9B9B9; 
        display: inline-block;
       }
 
 sf {
	width:640px; 
	color: #FF1100; 
	font-size: 26px; 
	font-weight: 450;
	font-family: arial;
	text-align: center; 
	text-shadow: 2px 1px 1px #B9B9B9; 
	display:block; 
  }
      
sh {
	 position:absolute; 
	 left: 38px; 
         color: #FF8800;
         width:640px; 
         font-size: 32px; 
         font-weight: 500;
         font-family:arial; 
         text-align:center; 
         text-shadow: 2px 1px 1px #DEDEDE; 
       }      
       
.rotating-square {
      width: 168px;
      height: 168px;
      background: #3498DB;
      border-radius: 8px;
      display: flex;
      justify-content: center;
      align-items: center;
      color: white;
      font-weight: 500;
      font-family: Arial, sans-serif;
      position: relative;
      transition: transform 0.5s;
    }

    .rotating-square::before {
      content: attr(data-letter);
    }       

@font-face { font-family: snail monospace; src: url('../../fonts/snails.ttf'); } 
     
 h5{
         color: #2A0000; 
         font-size:   26px; 
         font-weight:350;
         font-family: snail monospace; 
         text-align: left; 
         text-shadow: 1px 1px 1px #BBBBBB; 
         animation-name: fly1; 
         transform-origin: 70% 70%;  
         animation-duration: 5s;
         animation-iteration-count: 3;
         animation-direction: alternate;
         animation-timing-function: linear;
         display: inline-block;
      }
               
 @font-face { font-family: snail monospace; src: url('../../fonts/lips.ttf'); } 
     
 h6{
         color: #FF0000; 
         font-size: 60px; 
         font-weight:500;
         font-family: snail monospace; 
         background: linear-gradient(to left, violet,
            indigo, blue, green, yellow, orange, red);
   	   -webkit-background-clip: text;
           -webkit-animation-name: shimmer;     
           -webkit-animation-duration: 2s;
           -webkit-animation-iteration-count: 10;
              background-repeat: no-repeat;
              background-position: 0 0;
              background-color: #222;
    	      color: transparent;")
         text-shadow: 3px 2px 1px #000000, 3px 2px 110px #FF00FF; 
         animation-name: fly1; 
         transform-origin: 70% 70%;  
         animation-duration: 5s;
         animation-iteration-count: 3;
         animation-direction: alternate;
         animation-timing-function: linear;
         display: inline-block;
      }

      
@font-face { font-family: sev monospace; src: url('../../fonts/71.ttf'); } 
     
 h7 {
         color: #FF0000; 
         font-size: 60px; 
         font-weight:600;
         font-family: sev monospace; 
         background: linear-gradient(to left,violet,
            indigo, blue, green, yellow, orange, red);
   	   -webkit-background-clip: text;
           -webkit-animation-name: shimmer;     
           -webkit-animation-duration: 2s;
           -webkit-animation-iteration-count: 10;
              background-repeat: no-repeat;
              background-position: 0 0;
              background-color: #222;
    	      color: transparent;")
         text-shadow: 3px 2px 1px #000000, 3px 2px 110px #FF00FF; 
         animation-name: fly1; 
         transform-origin: 70% 70%;  
         animation-duration: 5s;
         animation-iteration-count: 3;
         animation-direction: alternate;
         animation-timing-function: linear;
         display: inline-block;
      }      
            
 .bck {
            position:absolute; 
            left:-50px; 
            width :720px; 
            font-weight: bold;
            background-color: #FFFFFF; 
            padding: 40px; 
            border-left: 4px solid #E74C3C;
            border-right: 4px solid #E74C3C;
            margin-top: 2em;
          }