@font-face {
    font-family: menlo;
    src: url(menlo.ttc);
}

body {
    font-family: "menlo", "Courier New", sans-serif;
    background-color: #E5E4DC;
}

#nav ul {
    list-style: none
}

#nav a {
    text-decoration: none;
    color: black;
}

#left {
    background-image: url(img/lines.jpg);
    background-repeat: repeat-y;
    background-position: center center;
    width: 30%;
    height: 100%;
    position: fixed;
    float: left;
}


#right {
    width: 70%;
    height: 97%;
    position: relative;
    float: right;
    margin-bottom: 2%;
}


#resume {
    margin-left: 3%;
    margin-bottom: 3%;
}


#about {
    margin-left: 3%;
    margin-bottom: 3%;
}


#portfolio {
    margin-left: 3%;
    margin-bottom: 3%;
}

#himg {
    width: 200px;
    margin-left: 30px;
    margin-bottom: 3%;
    margin-top: 2%;
}

#himg2 {
    width: 200px;
    margin-bottom: 3%;
    margin-top: 2%;
}


#himg4 {
    width: 150px;
    margin-bottom: 3%;
    margin-top: 0%;
}

.text {
}

.portimg {
    width: 98%;
}


#abtext {
    width: 70%;
}

#butext {
    width: 60%;
}

@media screen and (max-width:600px){
    
    body {
        font-size: 80%;
        background-image: url(img/lines2.jpg);
        background-repeat: repeat-y;
        background-position: center center;
        background-color: #E5E4DC;
    }


    #left {
        opacity: 0;
        width: 0%;
    }


    #right {
        width: 92%;
        height: 97%;
        position: relative;
        float: left;
        margin-bottom: 2%;
    }


    #resume {
        margin-left: 10%;
        margin-bottom: 3%;
    }


    #about {
        margin-left: 10%;
        margin-bottom: 3%;
    }


    #portfolio {
        margin-left: 10%;
        margin-bottom: 3%;
    }

    #himg {
        width: 200px;
        margin-left: 30px;
        margin-bottom: 3%;
        margin-top: 2%;
    }

    #himg2 {
        width: 200px;
        margin-bottom: 3%;
        margin-top: 2%;
    }

    
    #himg4 {
    width: 100%;
    margin-bottom: 3%;
    margin-top: 5%;
    }
    
    
    .text {
    }

    .portimg {
        width: 98%;
    }
    
    #abtext {
        width: 98%;
    }

    #butext {
        width: 98%;
    }
}