/* Base Styles */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        body {
            font-family: 'Times New Roman', Times, serif;
            font-size: 18px;
            line-height: 1.6;
            color: #333;
            background-color: #f8f8f8;
            padding-top: 70px; 
        }
        
        a {
            text-decoration: none;
            color: inherit;
        }
        
        :root {
            --primary-color: #4682B4; 
            --secondary-color: #97bebf; 
            --accent-color: #B0C4DE; 
            --dark-color: #2F4F4F; 
            --light-color: #F0F8FF; 
        }
        
        .main-content {
            background-color: #f5f5f5;
            margin-bottom: 50px;
        }

        .welcome-principal-container {
            background: white;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            margin: 20px auto;
            max-width: 1200px;
        }

        .welcome-section {
            flex: 1;
            padding: 10px;
            text-align: center;
        }

        .welcome-title {
            background: radial-gradient(circle, white 20%,rgb(58, 121, 172) 90%); 
            padding: 10px 15px;
            border-radius: 30px; 
            text-align: center;
            font-size: 27px;
            font-weight: bold;
            color: #002020; 
            font-family: Arial, sans-serif;
            display: inline-block; 
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); 
            box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.3); 
            margin-bottom: 20px;
        }

        .welcome-text {
            font-size: 16px;
            line-height: 1.6;
            color: #333;
            text-align: justify;
            padding: 0 10px;
        }

       
        
        /* Responsive Design */
        @media (max-width: 1024px) {
            body {
                padding-top: 70px;
            }
            
            .welcome-title {
                font-size: 24px;
            }
        }
        
        @media (max-width: 768px) {
            body {
                padding-top: 50px;
            }
        
            .welcome-principal-container {
                padding: 15px;
                margin: 10px;
            }
            
            .welcome-title {
                font-size: 20px;
                padding: 8px 12px;
            }
            
            .welcome-text {
                font-size: 15px;
                padding: 0 5px;
            }
        }
        
        @media (max-width: 480px) {
            body {
                padding-top: 70px;
            }   
        }
        
        @media (max-width: 360px) {
            body {
                padding-top: 50px;
            }
        }