* {
    color : black;
    font-family: 'Roboto Mono', monospace;
    font-weight : 500;
}

header{
    background-color : #F2F2F2;
}

nav{
    display : inline-block;
}

main{
    margin : auto;
    width : 55%;
}

p{
    font-weight : 300;
}

h3{
    margin-top : 50px;
    text-align : center;
}

ul{
    font-size : 14px;
    display : inline-block;
    list-style: none;
    margin: 0;
    padding: 0;
}

a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

li:hover{
    border-bottom : 2px solid black;
}

button:focus {
    outline:0;
}

.logo{
    font-weight : 900;
    display : inline-block;
    width : 70%;
    margin : 1em;
}

.back-logo{
    color : #E3E85E;
    background-color : black;
    display : inline-block;
    width : 7em;
    text-align : center;
}

.nav-item{
    color : #b3b3b3 !important;
    display : inline-block;
    margin : 0.5em;
}

.nav-color{
    color : #6D6D6D !important;
}

.night{
    background-color : #F2F2F2;
    font-size : 13px;
    font-weight : 900;
    display : inline-block;
    color : #BABABA;
    margin : 0.5em;
    padding : 5px;
    border : solid;
    border-width : 3px;
    border-radius : 12px;
    border-color: #BABABA;
}

.night:hover{
    color : white;
    background-color : black;
    border-color : black;
}

.card{
    margin-top : 50px;
    margin-bottom : 20px;
    text-align : justify;
    padding : 30px;
    box-shadow : 0 6px 12px 0 rgba(0, 0, 0, 0.01), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
    border-radius : 20px;
}

.welcome-image{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width : 100%;
}