Aida figueiredo

aida-figueiredo/exercicio-de-casa/aida-fig/css/style.css

@@ -0,0 +1,329 @@
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-size: 16px;
+    font-family: 'Nunito Sans', sans-serif;
+}
+
+.cabecalho{
+    width: 100%;
+    height: 80vh;
+    background: linear-gradient(rgba(170, 134, 100, 0.5), rgba(194, 92, 61, 0.7)), url(./../img/background-1.jpeg) no-repeat;
+    background-size: cover;
+}
+
+.menu{
+    width: 100%;
+    background-color: #A52A2A;
+    display: flex; 
+    justify-content:space-between; 
+    height: 60px;
+    align-items: center;
+    padding: 0 20px;
+    position: fixed;
+
+} 
+.banner{
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center; 
+}
+
+.menu__logo{
+    width: 45px;
+    height: 45px;
+}
+
+.menu-navegacao{
+    display: flex;
+    list-style: none;
+}
+
+.menu-navegacao__link{
+    color: #FFD700;
+    text-decoration: none;
+    font-size: 20px;
+    padding: 10px;
+    transition: 0.5s all;
+}
+
+.menu-navegacao__link:hover {
+    background-color: #FF7F50;
+    border-radius: 5px;
+    color: #ffffff;
+}
+
+.banner__titulo{
+    color: #FFD700;
+    font-size: 30px;
+    margin-bottom: 15px;
+}
+
+.banner__subtitulo{
+    color: #FFD700;
+    font-size: 20px;
+}
+
+main{
+    margin: 3% auto;
+    width: 90%;
+    background: linear-gradient(rgba(170, 134, 100, 0.5), rgba(194, 92, 61, 0.7));
+    border-radius: 10px;
+    box-shadow:0px 0px 10px #cccccccc;
+
+}
+
+.card-introducao, .container-trajetoria, .card-gostos{
+    padding: 4%;
+}
+
+.card-introducao__titulo{
+    color: #A52A2A;
+    font-size: 30px;
+    margin-bottom: 20px;
+    text-align: center;
+
+}
+
+.container-texto{
+    display: flex;
+    align-items: center;
+}
+
+.container-texto__paragrafos{
+    width: 60%;
+    margin-right: 10%;
+}
+
+.container-texto__paragrafos p, .container-trajetoria__paragrafo p{
+    color: #502f4c;
+    font-size: 17px;
+    margin-bottom: 17px;
+    text-align: justify; 
+}
+
+.container-texto__imagem{
+    width: 30%;
+}
+
+.container-trajetoria__titulo{
+    font-size: 25px;
+    margin-bottom: 30px;
+    color: #A52A2A;
+    text-align: center;
+
+}
+
+.card-gostos__titulo{
+    font-size: 25px;
+    color: #A52A2A;
+    margin-bottom: 30px;
+    text-align: center;
+}
+
+.container-listas{
+    display: flex;
+    justify-content: space-between; 
+}
+
+.lista{
+    width: 30%;
+    background-color: #A52A2A;
+    border-radius: 10px;
+    padding: 16px;
+    box-shadow: 5px 5px 9px #cccccc;
+    transition: 0.5s all;
+
+}
+
+.lista:hover {
+    transform: scale(1.1);
+}
+
+.lista h3{
+    color: #ffffff;
+    font-size: 17px;
+    text-align: center;
+    margin-bottom: 20px;
+}
+.lista__item li{
+    color: #FFD700;
+    margin-bottom: 10px;
+    list-style: none;
+}
+
+.lista__item li::before{
+    content: "❤";
+    margin-right: 10px;
+}
+
+footer{
+    text-align: center;
+    padding: 20px;
+    background-color: #A52A2A;
+    color: #ffffff;
+}
+
+.campo-form{
+    display: flex;
+    flex-direction: column;
+}
+.card-form {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+}
+form{
+    width: 40%;
+    border: 2px solid #502f4c;
+    padding: 20px;
+    border-radius: 10px;
+    margin-bottom: 20px;
+}
+
+label, input{
+    margin-bottom: 10px;
+}
+
+.checkbox {
+    margin-top: 20px;
+}
+.form-botao{
+    display: flex;
+    justify-content: center;
+}
+
+.form-botao input{
+    margin-top: 20px;
+    border: 2px solid #ffffff;
+    background-color: #502f4c;
+    color: #ffffff;
+    border-radius: 10px;
+    padding: 10px;
+
+}
+
+.form-botao input:hover{
+    border: 2px solid #FFD700;
+    background-color: brown;
+    color: #FFD700;
+    border-radius: 10px;
+    padding: 10px;
+
+}
+
+.card-fale-conosco{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.card-fale-conosco h2{
+    font-size: 25px;
+    color: #86477e;
+    margin-bottom: 20px;
+}
+/* .display-inline div{
+    display: inline;
+    background-color: blue;
+    width: 100px;
+    height: 100px;
+}
+
+.display-block div{
+    display: block;
+    width: 100px;
+    background-color: brown;
+    margin-bottom: 20px;
+    height: 100px;
+}
+
+.display-inline-block div{
+    display: inline-block;
+    width: 100px;
+    background-color: rgb(17, 85, 102);
+    margin-bottom: 20px;
+    height: 100px;
+} */
+
+@media (max-width: 780px) {
+    .menu{
+
+        justify-content:space-between; 
+        padding: 0 10px;
+
+    } 
+
+    .banner__titulo{
+        font-size: 20px;
+        text-align: center;
+    }
+
+    .banner__subtitulo{
+        color: #FFD700;
+        font-size: 16px;
+        text-align: center;
+    }
+
+    .menu-navegacao__link{
+        font-size: 14px;
+        padding: 6px;
+
+    }
+
+    .card-introducao__titulo{
+        color: #A52A2A;
+        font-size: 20px;
+    }
+    .container-texto{
+        flex-direction: column;
+    }
+
+    .container-texto__paragrafos{
+        width: 90%;
+        margin-right: 0;
+    }
+
+    .container-texto__imagem{
+        width: 60%;
+
+    }
+    .container-trajetoria__titulo{
+        font-size: 20px;
+
+    }
+
+    .card-gostos__titulo{
+        font-size: 20px;
+
+    }
+    .container-listas{
+        flex-direction: column;
+        justify-content: center; 
+        align-items: center;
+        gap: 20px;
+    }
+    .lista h3{
+        font-size: 14px;
+
+    }
+    .lista{
+        width: 80%;
+
+
+    }
+
+    form{
+        width: 70%;
+
+    }
+
+    footer p{
+        font-size: 12px;
+    }
+}
+