/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
#head-wrapper p,#nav li,h1{font-size:2em}
hr,img{border:0}
article,aside,details,figcaption,figure,footer,header,hgroup,hr,main,menu,nav,section,summary{display:block}
pre,textarea{overflow:auto}
body,fieldset{margin:0}
fieldset,hr,legend,td,th{padding:0}
#head-wrapper #email,html{font-size:1em}
#skills-circle,audio,canvas,iframe,img,svg,video{vertical-align:middle}
audio,canvas,progress,video{display:inline-block;vertical-align:baseline}
audio:not([controls]){display:none;height:0}
[hidden],template{display:none}
a{background-color:transparent}
a:active,a:hover{outline:0}
abbr[title]{border-bottom:1px dotted}
b,optgroup,strong{font-weight:700}
dfn{font-style:italic}
h1{margin:.67em 0}
mark{background:#ff0;color:#000}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-.5em}
sub{bottom:-.25em}
svg:not(:root){overflow:hidden}
figure{margin:1em 40px}
hr{box-sizing:content-box;height:1px;border-top:1px solid #ccc;margin:1em 0}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}
button{overflow:visible}
button,select{text-transform:none}
button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input{line-height:normal}
input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}
input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
legend{border:0}
textarea{resize:vertical}
table{border-collapse:collapse;border-spacing:0}
/*! HTML5 Boilerplate v5.2.0 | MIT License | https://html5boilerplate.com/ */
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#222;line-height:1.4}
::-moz-selection{background:#b3d4fc;text-shadow:none}
::selection{background:#b3d4fc;text-shadow:none}
fieldset{border:0}
.browserupgrade{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}
.hidden{display:none!important}
.visuallyhidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}
.invisible{visibility:hidden}
.clearfix:after,.clearfix:before{content:" ";display:table}
.clearfix:after{clear:both}
@media print{blockquote,img,pre,tr{page-break-inside:avoid}
*,:after,:before{background:0 0!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}
a,a:visited{text-decoration:underline}
a[href]:after{content:" (" attr(href) ")"}
abbr[title]:after{content:" (" attr(title) ")"}
a[href^="#"]:after,a[href^="javascript:"]:after{content:""}
blockquote,pre{border:1px solid #999}
thead{display:table-header-group}
img{max-width:100%!important}
h2,h3,p{orphans:3;widows:3}
h2,h3{page-break-after:avoid}
}
body,html{width:100%;height:100%;font-family:Oswald,sans-serif;background-color:#3a3435}
a{text-decoration:none}
#pageWrapper{width:82%;height:100%;margin:0 auto}
#nav{width:100%;z-index:100;padding:0;position:fixed;margin:0;border-bottom:2px solid #fff}
#nav li{display:inline-block;width:33.33%;text-align:center;color:rgba(255,255,255,.8);background-color:#ed9f9c}
#nav li a{text-decoration:none;color:rgba(255,255,255,.7);transition:all .4s ease-out}
#nav li:nth-child(2){background-color:#3a3435}
#nav li:nth-child(3){background-color:#f0544f}
#nav li a:hover{color:#fff}
#head-wrapper{width:100%;height:28em;overflow-y:hidden;background-color:#3a3435}
#head-wrapper h1{margin:0;padding-top:2em;font-size:4em}
#head-wrapper p{margin-top:0;font-weight:lighter;letter-spacing:.2em}
#head-wrapper a{color:#fff;text-decoration:none}
#head-wrapper .mobileContact{display:none}
#head-wrapper h1,#head-wrapper p{text-align:center;color:#f8f8f8;text-shadow:1px 1px 2px rgba(0,0,0,.8)}
#cartoon-head{margin-top:3.5em;display:inline-block;float:left;height:87%}
#projects-wrapper{width:100%;background-color:#f0544f;border-radius:10px 10px 0 0}
#projects-wrapper h2{margin-top:0;padding-top:1em;text-align:center;color:#fff;font-weight:lighter}
#projects-wrapper ul{width:100%;list-style-type:none;padding:0;text-align:center;margin-bottom:0}
#projects-wrapper ul li{width:30.5%;display:inline-block;background-color:#ed9f9c;border:2px solid #fff;border-radius:10px;margin-bottom:1em;position:relative;overflow-x:hidden;overflow-y:hidden}
#skills-wrapper,.top-skillwrap{width:100%;background-color:#f8f8f8}
#projects-wrapper ul li a{text-decoration:none}
#projects-wrapper ul li img{width:100%}
#skills-wrapper{text-align:center;border-radius:0 0 10px 10px;padding-bottom:8em}
#skills-wrapper h2,#skills-wrapper h3,#skills-wrapper p{color:#3a3435;text-align:center}
#skills-wrapper h3{font-size:2em;margin:0}
.top-skillwrap{height:10em;overflow:hidden;margin-top:-1px}
.top-skillwrap .half-circle{width:10em;height:98%;background-color:#f0544f;margin:0 auto;border-radius:0 0 50% 50%;border-top:1px solid #f0544f}
.top-skillwrap .half-circle .smallface{width:80%}
#basic,#proficient,#soft{display:inline-block;width:40%;vertical-align:middle}
#skills-circle{width:8em;height:8em;background:#f0544f;border-radius:50%;display:inline-block}
#skills-circle h2{font-size:2.1em;margin-top:1.2em;color:#fff}
.mask p {color:#fff; background-color: #3a3435;}
footer{background-color:#3a3435;font-size:.9em;font-weight:lighter;color:#fff;height:3.2em}
footer p{margin:0;padding:1em}
.mask{position:absolute;left:0;padding-bottom:5%;bottom:-75pt;background-color:rgba(255,255,255,.8);width:100%;overflow:hidden;margin:0;border-radius:0 0 10px 10px;transition:all .3s ease-out;opacity:0}
#projects-wrapper .view h2{color:#3a3435;padding-top:.6em}
.view:hover img+.mask{position:absolute;bottom:0;opacity:1}
.effect1{box-shadow:0 6px 9px -6px #000}
@media screen and (max-width:1032px){#head-wrapper h1{padding-top:20%}
#head-wrapper p{font-size:1.3em}
}
@media screen and (max-width:768px){#head-wrapper{height:40%}
#head-wrapper #cartoon-head{height:75%}
#head-wrapper h1{padding-top:20%;font-size:3em}
#head-wrapper p{font-size:1.2em}
#head-wrapper .mobileContact{display:block}
#head-wrapper .desktopContact{display:none}
#projects-wrapper ul li{width:40.5%}
#basic,#proficient,#soft{width:25%}
#skills-wrapper h3{font-size:1.8em}
#projects-wrapper ul li {
	width: 90%;
}
}
@media screen and (max-width:736px){#head-wrapper{height:85%}
}
@media screen and (max-width:667px){#head-wrapper{height:95%}
}
@media screen and (max-width:480px){#head-wrapper h1{padding-top:28%;font-size:2em}
#head-wrapper p{font-size:.9em}
}
@media screen and (max-width:414px){#nav li{font-size:1.5em;padding:.3em 0}
#pageWrapper{width:98%}
#head-wrapper #cartoon-head{height:70%}
#basic,#proficient,#soft{width:100%}
#skills-circle{display:none}
footer{font-size:.7em}
}
@media screen and (max-width:375px){#pageWrapper{width:98%}
#head-wrapper{height:100%}
#head-wrapper #cartoon-head{height:55%;display:block;margin:3.5em auto 0;float:none}
#head-wrapper h1{padding-top:0;font-size:3em}
#head-wrapper p{font-size:1em}
#basic,#proficient,#soft{width:100%}
footer{font-size:.5em}
}