body{
    font-size: x-large;
}

.avatar {
    vertical-align: middle;
    width: 120px;
    height: 120px;
    border-radius: 50%;
  }

@media (min-device-width:700px) {
    sidebar{
        height: 100%; /* Full-height: remove this if you want "auto" height */
        width: 20%; /* Set the width of the sidebar */
        position: fixed; /* Fixed Sidebar (stay in place on scroll) */
        z-index: 1; /* Stay on top */
        top: 0; /* Stay at the top */
        left: 0;
        background-color: rgb(56, 50, 68); /* Black */
        overflow-x: hidden; /* Disable horizontal scroll */
        padding-top: 20px;
        text-align: center;
    }
}



sidebar h2{
    color: rgb(255, 255, 255);
}

.networks ul{
    padding-left:0px;
    display:block;
}

.networks ul li{
    list-style-type: none;
    display:inline-block;
    padding: 0px 2px;
}

.links ul{
    padding-left:0px;
    list-style-type: none;
}

sidebar a{
    color: whitesmoke;
    text-decoration:none;
}



@media (min-device-width:700px) {
    .content {
        margin-left: 20%; /* Same as the width of the sidebar */
        padding: 0px 10px;
        text-align: justify;
        font-size: x-large;
    }
}


body{
    background-color: whitesmoke;
    
}

.work{
    border: 1px dashed gray;
    padding: 10px;
    padding-top: 0px;
    margin-top: 0px;
}
h5{
    margin-top: 10px;
}

@media (max-width:700px) {
    .avatar{
        display: none;
    }
    sidebar{
        height: 125px; /* Full-height: remove this if you want "auto" height */
        width: 100%; /* Set the width of the sidebar */
        top: 0; /* Stay at the top */
        left: 0;
        position:absolute; 
        z-index: 0; 
       
        background-color: rgb(56, 50, 68); /* Black */
        padding-top: 0px;
        text-align: center;
    }

    .content {
        margin-left: 0%;
        margin-top:130px;
        text-align: justify;
        font-size: x-large;
    }

    h2{
        margin-bottom: 1px;
        margin-top: 10px;
    }

    .networks ul{
        padding-left:0px;
        margin-top: 0px;;
        display:inline;
    }

    .links ul{
        padding-left:0px;
        display:inline;
        list-style-type: none;
    }
    .links li{
        display: inline-block;
        padding: 2px 2px;
    }

}