body {
    font-family: 'Muli', sans-serif;
    font-weight:300;
    font-size:14px;
}

p {
    margin-bottom:20px;
    line-height:160%;
}
h1 {
    font-weight:400;
    font-size:2.5em;
    margin:20px 0 30px 0;
}

.clear {
    clear:both;
}

a.btn {
    background:url('/_assets/img/icon-beaker.png') no-repeat 18px #e96234;
    padding:10px 15px 10px 50px;
    text-decoration:none;
    color:#FFFFFF;
    font-weight:400;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}


header {
    padding:20px 5%;
}
    .logo {
        max-width:371px;
        float:left;
    }
    .logo img {
        width:100%;
    }
    .social {
        float:right;
        padding-top:45px;
    }

    .social a {
        margin-left:15px;
        display:block;
        float:left;
        width:51px;
        height:51px;
        position:relative;
    }
        .social a img {
            position:absolute;
            left:0;
            -webkit-transition: opacity .5s ease-in-out;
            -moz-transition: opacity .5s ease-in-out;
            -o-transition: opacity .5s ease-in-out;
            transition: opacity .5s ease-in-out;
        }
            .social a img.top:hover {
                opacity:0;
            }

section#chalkboard {
    background:url('/_assets/img/chalkboard.jpg');
    -webkit-box-shadow:inset 0 0 30px 0 rgba(0,0,0,100);
    box-shadow:inset 0 0 30px 0 rgba(0,0,0,100);
    color:#ffffff;

}
    section#chalkboard .left {
        padding:41px 0 0 0;
        float:left;
        width:50%;
        text-align:right;
    }
        section#chalkboard .left img {
            width:100%;
            max-width:641px;
        }

    section#chalkboard .right {
        padding:35px 7% 20px 0;
        float:right;
        width:47%;
    }

    section#chalkboard h2 {
        color:#e96234;
        font-weight:400;
        font-size:24px;
        padding-bottom:10px;
    }

section#about {
    padding-top:63px;
}
    section#about .left {
        float:left;
        width:40%;
        text-align:center;
    }
        section#about .left .me {
            display:inline-block;
            border-radius: 50%;
            max-width: 371px;
            max-height: 371px;
            overflow:hidden;
        }
            section#about .left .me img {
                width:100%;
            }
    section#about .right {
        float:right;
        width:55%;
        padding-right:7%
    }
        section#about .right p {
            font-size:1.1em;
        }

section#projects {
    padding-top:63px;
    clear:both;
    text-align:center;
}
    section#projects h2 {
        font-weight:400;
        font-size:2.5em;
        margin:20px 0 30px 0;
    }
        .project-list {
           text-align:center;
        }

            .project {
                display:inline-block;
                vertical-align: top;
                max-width:323px;
                height:406px;
                padding:50px 30px;
                background:url('/_assets/img/proj-bg-paper.png');
            }
                .project a {
                    display:block;
                    height:170px;
                 }
                .project a span {
                    display: inline-block;
                    height: 100%;
                    vertical-align: middle;
                }
                    .project a img {
                        vertical-align: middle;
                    }
                .project p {
                    color:#e96234;
                    font-size:1.3em;
                    line-height:130%;
                    padding:27px 10px 0 10px;
                }


section#contact {
    background:#000000;
    margin-top:63px;
    padding:13px 0 80px 0;
    color:#FFFFFF;
}
    section#contact a {
        color:#FFFFFF;
        text-decoration:none;
    }
    section#contact h2 {
        font-weight:400;
        font-size:2.5em;
        margin:20px 0 30px 0;
        text-align:center;
    }
        section#contact .by {
            text-align:center;
        }
            section#contact .by div {
                padding:5px 0 5px 70px;
                font-size:1.6em;
                display:inline-block;
                vertical-align: middle;

            }
               .phone {
                   background:url('/_assets/img/icon-phone.png') no-repeat center left;
               }

               .email {
                   background:url('/_assets/img/icon-email.png') no-repeat center left;
                   margin-left:60px;
               }