*{
    margin: 0px;
    padding: 0px;
    border: none;
    outline: none;
}
body{
    background: #f5f5f5;
    position: relative;
    min-width: 1130px;
    overflow-x: hidden;
}
a{
    text-decoration: none;
}
    header, h1{
        color: #f74f33;
        margin-top: 70px;
        font: bold 70px/90px "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
        opacity: 0;
        -webkit-animation: headerFade 2s ease-in-out 0s;
        -moz-animation: headerFade 2s ease-in-out 0s;
        animation: headerFade 2s ease-in-out 0s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }
        @-webkit-keyframes headerFade{
        	from{opacity: 0;}
        	to{opacity: 1;}
        }
        @-moz-keyframes headerFade{
        	from{opacity: 0;}
        	to{opacity: 1;}
        }
        @keyframes headerFade{
        	from{opacity: 0;}
        	to{opacity: 1;}
        }
        h1{
            margin-right: 20px;
            color: #484848;
            display: inline;
        }
        ul{
            list-style: none;
        }
        header ul{
            position: absolute;
            right: 0px;
            top: 62px;
        }
            header li{
                float: left;
                margin-right: 15px;
                font: 0.2em/0.5em "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
            }
                header li a{
                    text-decoration: none;
                    color: #f5f5f5;
                    font-weight: bold;
                    padding: 5px 10px;
                    -webkit-transition: all 0.2s ease-in-out 0s;
                    -moz-transition: all 0.2s ease-in-out 0s;
                    transition: all 0.2s ease-in-out 0s;
                }
                header li.dribbble, header li.dribbble a{
                    background-color: #ea4c88;
                }
                    header li.dribbble:hover, header li.dribbble a:hover{
                        color: #ea4c88;
                        background: #f5f5f5;
                    }
                header li.twitter, header li.twitter a{
                    background-color: #38cdff;
                }
                    header li.twitter:hover, header li.twitter a:hover{
                        color: #38cdff;
                        background: #f5f5f5;
                    }
                header li.email, header li.email a{
                    background-color: #484848;
                }
                    header li.email:hover, header li.email a:hover{
                        color: #484848;
                        background: #f5f5f5;
                    }
    #slider{
        width: 100%;
        height: 374px;
        overflow-x: scroll;
        background: #f74f33;
        margin-top: 70px;
        -webkit-animation: dribbbleSlide 1s ease-in-out 1s;
    	-moz-animation: dribbbleSlide 1s ease-in-out 1s;
    	animation: dribbbleSlide 1s ease-in-out 1s;
    	-webkit-animation-fill-mode: forwards;
    	-moz-animation-fill-mode: forwards;
    	animation-fill-mode: forwards;
    	position: relative;
    	left: 3000px;
    }
        @-webkit-keyframes dribbbleSlide{
        	from{left: 3000px;}
        	to{left: 0px;}
        }
        @-moz-keyframes dribbbleSlide{
        	from{left: 3000px;}
        	to{left: 0px;}
        }
        @keyframes dribbbleSlide{
        	from{left: 3000px;}
        	to{left: 0px;}
        }
        #slider span#swipe-title{
            display: none;
        }
        #slider ul{
            width: 4900px !important;
            padding-left: 50px;
        }
            #slider li{
                float: left;
                height: 300px !important;
                margin: 37px 100px 0px 0px;
                position: relative;
                overflow: hidden;
                -webkit-transition: all 0.3s ease-in-out 0.1s;
            }
                #slider li:hover{
                    -webkit-box-shadow: 0px 0px 10px #900000;
                }
                #slider li:last-child{
                    margin-right: 0px;
                }
                #slider li div.card{
                    width: 400px;
                    height: 300px;
                    background: #f5f5f5;
                    position: absolute;
                    left: -400px;
                    -webkit-transition: all 0.5s ease-in-out;
                }
                    #slider li:hover div.card{
                        left: 0px;
                    }
                    #slider li div.card span{
                        display: block;
                        color: #f74f33;
                        font: bold 2em/1.5em "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
                        margin: 20px;
                    }
                        #slider li div.card span a{
                            text-decoration: none;
                            text-transform: uppercase;
                        }
                #slider li span.shot-title{
                    display: none;
                }
    h2{
        color: #484848;
        margin-top: 70px;
        font: bold 70px/90px "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
        opacity: 0;
        -webkit-animation: otherFade 1s ease-in-out 2s;
        -moz-animation: otherFade 1s ease-in-out 2s;
        animation: otherFade 1s ease-in-out 2s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }
    #skills{
        margin-top: 70px;
        width: 100%;
        text-align: center;
        height: 300px;
        opacity: 0;
        -webkit-animation: otherFade 1s ease-in-out 2s;
        -moz-animation: otherFade 1s ease-in-out 2s;
        animation: otherFade 1s ease-in-out 2s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }
        #skills ul{
            margin: 0px auto;
        }
        #skills ul li{
            float: left;
            width: 16%;
            text-align: center;
            margin-right: 4%;
            position: relative;
        }
            #skills ul li div{
                width: 70%;
                height: 250px;
                margin: 0 auto;
            }
                #skills ul li.photoshop div{
                    background-color: #467bc8;
                }
                #skills ul li.illustrator div{
                    background-color: #ed6015;
                }
                #skills ul li.HTML5 div{
                    background-color: #777777;
                }
                #skills ul li.CSS3 div{
                    background-color: #aed95f;
                }
                #skills ul li.photography div{
                    background-color: #a87dd7;
                }
                #skills ul li div div{
                    text-indent: -9999px;
                }
                #skills ul li.photoshop div div{
                    width: 100%;
                    height: 0%;
                    background: #f5f5f5;
                }
                #skills ul li.illustrator div div{
                    width: 100%;
                    height: 30%;
                    background: #f5f5f5;
                }
                #skills ul li.HTML5 div div{
                    width: 100%;
                    height: 20%;
                    background: #f5f5f5;
                }
                #skills ul li.CSS3 div div{
                    width: 100%;
                    height: 10%;
                    background: #f5f5f5;
                }
                #skills ul li.photography div div{
                    width: 100%;
                    height: 35%;
                    background: #f5f5f5;
                }
            #skills ul li strong{
                font: bold 1.4em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
                color: #f5f5f5;
                position: relative;
                bottom: 21px;
            }
    #twitter, #bio{
        margin: 0px auto;
        margin-bottom: 100px;
        width: 90%;
        padding: 20px;
        text-align: center;
        font: bold 2em/1.5em "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
        color: #545454;
        position: relative;
        opacity: 0;
        -webkit-animation: otherFade 1s ease-in-out 2s;
        -moz-animation: otherFade 1s ease-in-out 2s;
        animation: otherFade 1s ease-in-out 2s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }
        #twitter::before{
            content: "\201C";
            font: bold 6em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
            color: rgba(0,0,0,0.1);
            position: absolute;
            top: -50px;
            left: 0px;
        }
        #twitter::after{
            content: "\201D";
            font: bold 6em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
            color: rgba(0,0,0,0.1);
            position: absolute;
            top: -50px;
            right: 0px;
        }
        #twitter a{
            color: #f74f33;
        }
            #twitter a.time{
                font-size: 16px !important;
                text-decoration: none;
            }
    #bio{
        text-align: left;
    }
        #bio img{
            float: left;
            margin: 15px 15px 0px 0px;
            border: 5px solid #fff;
            -webkit-box-shadow: 0 2px 5px #8e8e8e;
            -moz-box-shadow: 0 2px 5px #8e8e8e;
            box-shadow: 0 2px 5px #8e8e8e;
        }
    @-webkit-keyframes otherFade{
    	from{opacity: 0;}
    	to{opacity: 1;}
    }
    @-moz-keyframes otherFade{
    	from{opacity: 0;}
    	to{opacity: 1;}
    }
    @keyframes otherFade{
    	from{opacity: 0;}
    	to{opacity: 1;}
    }
    footer{
        width: 100%;
        display: block;
        margin: 0px;
        padding: 0px;
        position: relative;
    }
        footer a{
            position: absolute;
            display: block;
            right: 10%;
            bottom: 0px;
            width: 50px;
            height: 60px;
            text-align: center;
            line-height: 60px;
            background: #f74f33;
            color: #f5f5f5;
            font: bold 1.5em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
        }
