* {
       padding: 0;
       margin: 0;
   }
    body { font-family: Arial, sans-serif; background:#000; color:#fff; padding: 0;
    margin: 0; }
    .container { max-width: 480px; margin:0 auto;}
    .highlight { color: #cc0000; font-weight: bold; }
    .btn { background: #ffcc00; color: #000; text-decoration: none; display: inline-block; }
	.btn:hover { background: #fbab00; color: #000; text-decoration: none; display: inline-block; }
    .small { font-size: 0.85em; color: #666; margin-top: 20px; }
	.box{margin:1em; border-radius:1em; background:#fff; overflow:hidden; color:#aaaaba; position:relative; z-index:2;}
	.box h2{background:#ffcc00; color:#000; margin:0; text-align:center; padding:0.5em; font-size:0.8em}
	.box-inner{padding:0.5em}
	.text-center{text-align:center;}
	
	.small1{font-size:0.6em}
	.h3{font-size:0.8em}
	#form-suscription {margin:0.1em 1em; display:flex; flex-direction:column; gap:0.4em}
	#form-suscription input{padding:0.2em; font-size:1em; text-align:center; border:1px solid #cdcdcd; border-radius:0.5em;height:2em}
	.btn{border:0;border-radius:0.5em; height:40px; cursor:pointer; min-width: 280px;}
	#box-checkbox {display:flex; flex-direction:row; font-size:0.5em; color:#999;text-align: left;gap: 1em; line-height:1.5em}
	#box-checkbox a{color:#58a7ff}
	.box-hero{display:flex; flex-direction:column; gap:0.5em; padding:1em; align-items: center;}
	.box-hero .h1{color:#ffcc00; font-size:1em}
	.box-hero p{font-size:0.8em}
	#box-info{margin:1em;background: #a6a6a6;
    border-radius: 0.5em;
    overflow: hidden;
	}
	#box-info h2{color:#fff;background:#2a2a2a; font-size:0.5em;padding:0.5em;display: flex;align-items: center;gap: 10px;}
	.table{display:flex; flex-direction:column;gap:1em;font-size:0.45em;margin: 1em; }
	.row{display:flex;gap:1em;}
	.left{text-align:center;width:30%}
	.table .row:first-child .right{flex-grow:inherit}
	.right{background:#fff;color:#000; border-radius:0.5em; padding:0.2em 0.5em;width: 70%;
    text-align: start;}
	.radius{border-radius:20px; }
	@media (max-width:778px){
	.vh-100{    
	height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
	}
	}
	@media (min-width:992px){
		.container { max-width: 880px; margin:0 auto;}
		.table{ flex-wrap: wrap; flex-direction: row;}
		.right, .left{width:auto;}
		.box{max-width:440px; margin:auto; margin-top:-80px; position:relative; z-index:2}
		.box-hero .h1{font-size:1.3em}
		.box-hero p{font-size:1em}
		#form-suscription {gap:0.8em}
	}