@charset "UTF-8";

/* ESTILOS GERAIS */
* {
    color: #25282E;
}

a, i {
    transition: .5s;
    text-decoration: none;
}

.secondary-color {
    color: #555;
}

.center-image {
    background-size: cover;
    background-position: center;
}

.btn {
    text-decoration: none;
    background-color: #25282E;
    color: white;
    padding: 7px 18px;
    border-radius: 0;
}

.btn:hover {
    background-color: #333;
    color: white;
}

/* HEADER */
#header {
    text-align: center;
    padding: 20px;
    border-bottom: 1px solid #ccc;
}

#header p {
    margin-bottom: 0;
}

#title-container {
    justify-content: center;
}

/* MODAL */
#modal i {
    margin-left: 60px;
    font-size: 35px;
}

/* NAVBAR */
#navbar {
    padding: 10px;
    margin: 10px auto;
}

#navbar a {
    width: 80px;
    color: #444;
}

#navbar a:hover {
    color: #c1b696;
}

/* MAIN ABOUT */
#about {
    margin-top: 50px;
    margin-bottom: 50px;
}

#img1 {
    background-image: url(../imagens/foto-perfil-linkedin.svg);
    border-radius: 10px;
}

.small-image-container1 {
    height: 450px;
    margin-bottom: 20px;
}

#about h3 {
    margin-top: 80px;
}

/* PROJECTS */
#img2 {
    background-image: url(../imagens/login-page.svg);
    border-radius: 10px;
}

#img3 {
    background-image: url(../imagens/projet-red.svg);
    border-radius: 10px;
}

#img4 {
    background-image: url(../imagens/sitedroid.svg);
    border-radius: 10px;
}

#img5 {
    background-image: url(../imagens/port1.svg);
    border-radius: 10px;
}

#img6 {
    background-image: url(../imagens/cordel.svg);
    border-radius: 10px;
}

#img7 {
    background-image: url(../imagens/jogo-velha.svg);
    border-radius: 10px;
}

#projects-container h1 {
    text-align: center;
}

#projects-container h1,
#projects-container .col-md-6,
#projects-container .col-12 {
    margin-bottom: 50px;
}

.small-image-container {
    height: 250px;
    margin-bottom: 20px;
}

.links-projects {
    text-decoration: none;
}

/* FOOTER */
footer {
    border-top: 1px solid #ccc;
    height: 250px;
    padding: 30px;
}

footer i {
    font-size: 20px;
}

#social-icons-container {
    padding: 25px;
}

#social-icons-container div {
    text-align: center;
}

footer p {
    text-align: center;
    margin: 20px;
}

a:hover i {
    color: #c1b696;
}