@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');

    body {
            font-family: Roboto, sans-serif;
            background-color: #f4f7f6;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 95vh;
            margin: 0;
            color: #333;
        }
		
    a {
	 font-size:13px;
	 color:#79c;
	  text-decoration: none;
	  text-transform: uppercase;
	}

        .container {
			position: relative;
            text-align: center;
            padding: 40px;
            background: white;
            border-radius: 12px;
            box-shadow: 0 10px 25px rgba(0,0,0,0.1);
            max-width: 400px;
            width: 90%;
			height: 320px;
        }

	.site_name {
	position: absolute;
	 top: 10px;
	 left: 10px;
	font-size: 8px;
	color:#ccc;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  font-weight: bold;
  }

        h1 { color: #2c3e50; margin-top: 0; }
        #demo { height: 100px; font-size: 1.25rem; font-weight: 600; color: #e67e22; margin-top: 20px; }
        .spinner {
            border: 4px solid #f3f3f3;
            border-top: 4px solid #3498db;
            border-radius: 50%;
            width: 40px;
            height: 40px;
            animation: spin .5s linear infinite;
            margin: 20px auto;
        }
        @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }