.projects{
    text-align: center;
    margin-left: 10%;
    margin-right: 10%;
}
.projects a{
    text-decoration: none;
    color: black;
    border-style: solid;
    border-color: black;
    border-width: 2px;
    border-radius: 5px;
    padding: 10px;
    display:block;
    margin-top: 5px;
    padding: 10px;
    margin-left: 20px;
    margin-right: 20px;
    transition:
    box-shadow 0.2s,
    margin-top 1s,
    maring-bottom 1s,
    transform 1s;
}
.projects a:hover{
    background-color: rgb(231, 231, 231);
    box-shadow: 0px 0px 10px rgb(88, 88, 88);
    margin-top: 10px;
    margin-bottom: 10px;
    transform: scale(1.1);
}

.menu{
    position: absolute;
    margin-left: 0px;
    margin-top: -3.5px;
}

.menu-image{
    width: 40px;
    height: 40px;
    border-width: 2px;
    border-color: black;
    border-style: solid;
    background-color: rgb(240, 240, 240);
    border-radius: 8px;
    box-shadow: 2px 2px 4px rgb(155, 155, 155);
}
.menu-image:hover{
    background-color: rgb(211, 211, 211);
}
.menu:hover .menu-options{
    display: block;
}

.menu-options{
    display: none;
    position: absolute;
    background-color: rgb(194, 194, 194);
    border-radius: 10px;
}
.menu-options a{
    display: block;
    text-decoration: none;
    color: black;
    padding: 7px;
    padding-left: 13px;
    padding-right: 13px;
}
.menu-options a:hover{
    background-color: rgb(161, 161, 161);
    border-radius: 10px;
}