/* Estilo para monitores muy grandes */
@media (min-width: 1800px) {
body {
font-size: 1rem;
font-family: Arial, sans-serif;
background-color: #333333;
margin: 0;
padding: 0;
display:flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
#div_logo{
margin-top: 2rem;
margin-bottom: 4rem;
}
#svg_logo:hover #g_svg_alegre {
fill: #00FFFF;
}
#svg_logo {
width: 20rem;
height: 5rem;
}
.nobots{
display: flex;
flex-direction: column;
align-items: center;
}
.nobots img {
width: 4rem;
height: auto;
}
.container {
width: 30rem;
background-color: #FFFDEA;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
padding: 1rem;
text-align: left;
}
form {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 1.2rem;
}
h1, h3 {
margin-bottom: 3rem;
}
label {
font-size: 1rem;
margin-bottom: 0.2rem;
text-align: left;
display: block;
width: 100%;
}
input,
textarea {
width: 90%;
padding: .5rem;
margin-bottom: 2.4rem;
font-size: 1rem;
}
.submit-button {
background-color: #007BFF;
color: #fff;
padding: .6rem 1.2rem;
border: none;
border-radius: 5px;
font-size: 1.2rem;
cursor: pointer;
margin-top: 1rem;
margin-bottom: 1rem;
}
.submit-button:hover {
background-color: #0056b3;
}
a {
color: black;
}
a:hover {
color: blue;
font-weight: bold;
}
#div_volver_mas_enviar{
width: 100%;
display: inline-block;
}
#div_volver{
margin-top: 2rem;
float: left;
font-size: .8em;
}
#div_enviar{
float: right;
}
#inicio {
font-size: 1em;
margin: .5em 1em .5em 1em;
}
.info_datos {
font-size: .8em;
color: midnightblue;
}
.circle-icon {
color: blue;
font-weight: bold;
}
}

/* Estilo para monitores intermedios */
@media (max-width: 1800px) and (min-width: 768px) {
body {
font-size: 1rem;
font-family: Arial, sans-serif;
background-color: #333333;
margin: 0;
padding: 0;
display:flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
#div_logo{
margin-top: 1rem;
margin-bottom: 2rem;
}
#svg_logo:hover #g_svg_alegre {
fill: #00FFFF;
}
#svg_logo {
width: 20rem;
height: 5rem;
}
.nobots{
display: flex;
flex-direction: column;
align-items: center;
}
.nobots img {
width: 3.6rem;
height: auto;
}
.container {
width: 30rem;
background-color: #FFFDEA;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
padding: 1rem;
text-align: left;
}
form {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 1rem;
}
h2, h3 {
margin-bottom: 2rem;
}
label {
font-size: 1rem;
margin-bottom: 0.2rem;
text-align: left;
display: block;
width: 100%;
}
input,
textarea {
width: 90%;
padding: .5rem;
margin-bottom: 1.8rem;
font-size: 1rem;
}
.submit-button {
background-color: #007BFF;
color: #fff;
padding: .6rem 1.2rem;
border: none;
border-radius: 5px;
font-size: 1.2rem;
cursor: pointer;
margin-top: 1rem;
margin-bottom: 1rem;
}
.submit-button:hover {
background-color: #0056b3;
}
a {
color: black;
}
a:hover {
color: blue;
font-weight: bold;
}
#div_volver_mas_enviar{
width: 100%;
display: inline-block;
}
#div_volver{
margin-top: 2rem;
float: left;
font-size: .8em;
}
#div_enviar{
float: right;
}
#inicio {
font-size: 1em;
margin: .5em 1em .5em 1em;
}
.info_datos {
font-size: .8em;
color: midnightblue;
}
.circle-icon {
color: blue;
font-weight: bold;
}
}

/* Estilo para dispositivos móviles */
@media (max-width: 768px) {
body {
font-size: 1rem;
font-family: Arial, sans-serif;
background-color: #333333;
margin: 0;
padding: 0;
display:flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
#div_logo{
margin-top: 2rem;
margin-bottom: 4rem;
}
#svg_logo:hover #g_svg_alegre {
fill: #00FFFF;
}
#svg_logo {
width: 20rem;
height: 5rem;
}
.nobots{
display: flex;
flex-direction: column;
align-items: center;
}
.nobots img {
width: 4rem;
height: auto;
}
.container {
width: 18rem;
background-color: #FFFDEA;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
padding: 1rem;
text-align: left;
}
form {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 1.2rem;
}
h1, h3 {
margin-bottom: 3rem;
}
label {
font-size: 1rem;
margin-bottom: 0.2rem;
text-align: left;
display: block;
width: 100%;
}
input,
textarea {
width: 90%;
padding: .5rem;
margin-bottom: 2.4rem;
font-size: 1rem;
}
.submit-button {
background-color: #007BFF;
color: #fff;
padding: .6rem 1.2rem;
border: none;
border-radius: 5px;
font-size: 1.2rem;
cursor: pointer;
margin-top: 1rem;
margin-bottom: 1rem;
}
.submit-button:hover {
background-color: #0056b3;
}
a {
color: black;
}
a:hover {
color: blue;
font-weight: bold;
}
#div_volver_mas_enviar{
width: 100%;
display: inline-block;
}
#div_volver{
margin-top: 2rem;
float: left;
font-size: .8em;
}
#div_enviar{
float: right;
}
#inicio {
font-size: 1em;
margin: .5em 1em .5em 1em;
}
.info_datos {
font-size: .8em;
color: midnightblue;
}
.circle-icon {
color: blue;
font-weight: bold;
}
}