<% 'styles.css %>


 body {
            
            min-height: 94vh; /* Ensures full height */
            margin: 0;
           
            
           
  margin: 0;
  padding: 0;
  width: 100%;
  overflow-x: hidden; /* Prevent accidental horizontal scroll */
}

            
        




.xsh1 /* logo */
{
	position:fixed;
	top:1:5vw;	
	
	width: calc(7vw + 15px);
	height: calc(7vw + 15px);
	
	margin-top: 0px;
	margin-bottom: 20px;

        -moz-border-radius: 6px;
  	-webkit-border-radius: 6px; 
  	border-radius: 6px; 

  	-webkit-box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);
	-moz-box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);
	box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);
	
	 transition: 1s;
}


 .xsh1:hover {
           width:calc(7vw + 0px);
           height:calc(7vw + 0px);
}

@media (max-width: 768px) {
.xsh1 /* logo */
{
	position:fixed;
	top:25px;
        left:30px;
	
	width: calc(7vw + 15px);
	height: calc(7vw + 15px);
	
	margin-top: 0px;
	margin-bottom: 20px;

        -moz-border-radius: 6px;
  	-webkit-border-radius: 6px; 
  	border-radius: 6px; 

  	-webkit-box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);
	-moz-box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);
	box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);
	
	 transition: 1s;
}

}

	



/* Ensures the body takes up the full height of the viewport */
       

        /* Main content takes up available space pushing textarea to the bottom */
        .content {
           
            padding: 20px;
        }

        /* The textarea container */
        .xtextarea-container {
            position:absolute;
            width:10vw;
            left:calc(50vw - 15vw );
            bottom:70px;            
            padding: 0px;
            
            -moz-border-radius: 6px;
  	    -webkit-border-radius: 6px; 
  	    border-radius: 6px; 
  			
  	   -webkit-box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);
	   -moz-box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);
	   box-shadow: 3px 5px 25px -1px rgba(68,68,85,0.76);"          
          
        }
        
        
        /* The textarea container reserve */
        .ytextarea-container {
           
            
            padding: 10px;
        }
        

        xtextarea {
            font-size:calc(10px + 0.5vw);
            width: 99%; /* Adjust width */
            max-width: 600px; /* Limit max width */
            height: 100%; /* Adjust height */
            resize: vertical; /* Allow vertical resizing */
            -moz-border-radius: 6px;
  	    -webkit-border-radius: 6px; 
  	    border-radius: 6px; 
        }