body{
    background-color:#CCC;
    font-family:Georgia, "Times New Roman", Times, serif;   
}

#all{
    width:800px;
    height:700px;
    border:3px solid #039;
    border-radius:15px;
    margin:20px auto;
    box-shadow: 0 0 15px #333;
}

#top{
    width:770px;
    height:40px;
    padding:5px 15px 5px 15px;
    font-size:1.2em;
    border-bottom:1px solid black;
    border-top-left-radius:15px;
    border-top-right-radius:15px;
}
/** Added Gradiant **/
nav{
    background: linear-gradient(to right, #039, #66CCFF);
}
/** created class and modified font **/
.side{
    font-family: "Pacifico", cursive;
    font-size: 1.8em;
}

#left{
    width:150px;
    height:600px;
    border-right:2px solid black;
    padding:5px;
    background-color:green;
    float:left;
}

#right{
    width:auto;
    height:580px;
    padding-top:30px;
    text-align:center;
    background:#DDDDDD;
}

.clear{
    clear:both;
}

footer{
    width:800px;
    height:36px;
    background:#fff;
    text-align:center;
    border-bottom-left-radius:15px;
    border-bottom-right-radius:15px;
    padding-top:4px;
}
/** created class and modified the boat's image's attributes **/
.boat{
    transform: rotate(-5deg);
    filter: sepia(20%);
    transition: transform 0.3s ease;
}
/** class adding hover functionalily  **/
.boat:hover{
    transform: rotate(-5deg) scale(1.25);
}
/** class adding shadowing  **/
.contact{
    text-shadow: 2px 2px 3px #333;
}