nav {
    width: 50%;
    height: 30px;
    background-color: lightcyan;
}

ul li { /*element selector*/
    list-style: none;
    display: inline-block;
    line-height: 30px; /* center the content in the nav bar  height same to nav*/
}

    ul li a {
        display: block;
        text-decoration: none;
        color: lightcoral;
        padding: 0 30px;
    }

        ul li a :hover {
            color: darkviolet;
        }

h1 {
    text-align: center;
    font-family: cursive;
    font-stretch: expanded;
    font-style:italic;
    font-size:56px;
    color:darkturquoise;
   
}

#main {
    position: relative;
    top: 600px;
    left: 800px;
}

#picA {
    position: relative;
    top: 50px;
    left: 100px;
}

#aboutMe {
    position: relative;
    top: -250px;
    left: 700px;
}

h2 {
    color: darkslategray;
    font-style: oblique;
    text-shadow: 3px 3px 3px mediumpurple;
}

#projectsInfo {
    position: relative;
    left: 200px;
    top: -150px;
}

#footer {
    position: relative;
    left: 1200px;
    top: -350px;
}

h3 {
    text-shadow: 5px 5px 5px lightcoral;
    text-align: right;
    position: relative;
    top: -350px;
    left: -200px;
}

#pLanguages {
    position: relative;
    top: -350px;
    left: 800px;
}

.projects {
    background-color: aliceblue;
    border: 3px solid aquamarine;
    padding: 5px;
    margin-left: 50px;
    margin-right: 50px;
    border-radius: 25px;
    margin: 50px;
    float: left;
    width: 25%;
    height: 400px;
}
#titleP {
    font-size:48px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color:slategray;
    position:relative;
    left:380px;

}
h4 {
    color: mediumpurple;
    font-style: oblique;
    text-shadow: 3px 3px 3px lightcoral;
}
h5 {
    color: mediumpurple;
    font-style: oblique;
    text-shadow: 3px 3px 3px lightcoral;
}
.description {

    font-family:Arial;
    color:chocolate;
    font-style:italic;
}
.intro {
    font-family:'Comic Sans MS';
    font-size:medium;
}
#id {
    -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 4s;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
    from {
        background-color: red;
    }

    to {
        background-color: yellow;
    }
}