body{

margin:0;

font-family:Arial,sans-serif;

background-image:url('fondo5.jpg');

background-size:cover;

background-position:center;

background-repeat:no-repeat;

background-attachment:fixed;

color:white;

display:flex;

justify-content:center;

align-items:flex-start;

min-height:100vh;

padding:30px 15px;

}


.box{

width:100%;

max-width:450px;

padding:25px;

border-radius:15px;

background:rgba(255,255,255,0.10);

backdrop-filter:blur(15px);

border:1px solid rgba(255,255,255,0.20);

box-shadow:0 8px 32px rgba(0,0,0,0.30);

}


h2{

text-align:center;

margin-bottom:20px;

}


input,

select{

width:100%;

box-sizing:border-box;

padding:12px;

margin-top:10px;

border-radius:8px;

border:none;

outline:none;

background:rgba(255,255,255,0.20);

color:white;

font-size:16px;

}


input::placeholder{

color:rgba(255,255,255,0.7);

}


select{

appearance:none;

-webkit-appearance:none;

-moz-appearance:none;

}


select option{

background:#5a3d4f;

color:white;

}


.resultado{

margin-top:15px;

padding:15px;

border-radius:10px;

background:rgba(255,255,255,0.15);

font-size:14px;

line-height:1.7;

}


#trabajador{

border-left:4px solid #198754;

}


#empresa{

border-left:4px solid #0d6efd;

}


#brutoCalculado{

border-left:4px solid #dc3545;

}



strong{

font-size:15px;

}



hr{

border:none;

border-top:1px solid rgba(255,255,255,0.25);

margin:15px 0;

}


@media(max-width:480px){

body{

padding-top:20px;

}

.box{

padding:20px;

}

}