Commit 206a8c20 by Ian Gustavo
parents 0a09a4cd 498b00b5
/* RESET */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* BODY - sensação de natureza */
body {
font-family: 'Segoe UI', sans-serif;
background: linear-gradient(to bottom, #e9f5db, #d8f3dc);
color: #333;
}
/* HEADER - madeira/campo */
.topo {
background: #6b4226; /* marrom terra */
color: #fff;
padding: 20px;
text-align: center;
border-bottom: 5px solid #a3b18a;
}
.topo h1 {
margin-bottom: 10px;
}
/* NAV */
nav a {
color: #fefae0;
margin: 0 10px;
text-decoration: none;
font-weight: bold;
padding: 6px 10px;
border-radius: 6px;
transition: 0.3s;
}
nav a:hover {
background: #a3b18a; /* verde claro */
color: #333;
}
/* CONTAINER */
.container {
width: 80%;
margin: 30px auto;
background: #fefae0; /* cor de palha clara */
padding: 25px;
border-radius: 12px;
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
/* TÍTULOS */
h2 {
text-align: center;
margin-bottom: 20px;
color: #6b4226;
}
/* TABELA */
table {
width: 100%;
border-collapse: collapse;
border-radius: 10px;
overflow: hidden;
}
/* CABEÇALHO */
th {
background: #588157; /* verde escuro */
color: white;
padding: 12px;
}
/* CÉLULAS */
td {
padding: 10px;
text-align: center;
}
/* LINHAS */
tr:nth-child(even) {
background: #e9edc9;
}
tr:hover {
background: #ccd5ae;
transition: 0.2s;
}
/* LINKS */
td a {
text-decoration: none;
font-weight: bold;
color: #6b4226;
}
td a:hover {
color: #344e41;
}
/* FORM */
form {
display: flex;
flex-direction: column;
align-items: center;
}
/* INPUTS */
input {
width: 60%;
padding: 10px;
margin: 8px 0;
border-radius: 6px;
border: 1px solid #a3b18a;
background: #fefae0;
transition: 0.3s;
}
/* FOCUS */
input:focus {
border-color: #588157;
outline: none;
box-shadow: 0 0 5px rgba(88,129,87,0.5);
}
/* BOTÃO */
button {
background: #6b4226;
color: white;
border: none;
padding: 12px 18px;
border-radius: 8px;
cursor: pointer;
transition: 0.3s;
}
/* HOVER BOTÃO */
button:hover {
background: #4a2c1a;
transform: scale(1.05);
}
/* TEXTO VAZIO */
p {
text-align: center;
margin-top: 20px;
font-size: 18px;
color: #6b4226;
}
/* ALERTA */
.alert {
background: #ccd5ae;
padding: 10px;
margin-bottom: 15px;
border-radius: 6px;
text-align: center;
color: #344e41;
font-weight: bold;
}
/* RESPONSIVO */
@media (max-width: 768px) {
.container {
width: 95%;
}
input {
width: 90%;
}
table {
font-size: 12px;
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment