/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
/* line 18, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
/* line 28, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

/* line 31, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
body {
  line-height: 1; }

/* line 34, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
ol, ul {
  list-style: none; }

/* line 37, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
blockquote, q {
  quotes: none; }

/* line 41, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

/* line 45, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
table {
  border-collapse: collapse;
  border-spacing: 0; }

@font-face {
  font-family: 'open_sansregular';
  src: url("typo/open/OpenSans-Regular-webfont.eot");
  src: url("typo/open/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("typo/open/OpenSans-Regular-webfont.woff") format("woff"), url("typo/open/OpenSans-Regular-webfont.ttf") format("truetype"), url("typo/open/OpenSans-Regular-webfont.svg#open_sansregular") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'bebas_neueregular';
  src: url("typo/bebas/BebasNeue-webfont.eot");
  src: url("typo/bebas/BebasNeue-webfont.eot?#iefix") format("embedded-opentype"), url("typo/bebas/BebasNeue-webfont.woff") format("woff"), url("typo/bebas/BebasNeue-webfont.ttf") format("truetype"), url("typo/bebas/BebasNeue-webfont.svg#bebas_neueregular") format("svg");
  font-weight: normal;
  font-style: normal; }

/* line 66, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
h1, h2, h3, nav li {
  font-family: 'bebas_neueregular', Arial, sans-serif; }

/* line 70, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
p {
  font-family: 'open_sansregular', Arial, sans-serif; }

/* CHART TYPO*/
/* line 75, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
html {
  font-size: 62.5%; }

/* line 79, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
body {
  font-size: 14px;
  font-size: 1.4rem; }

/* line 84, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
h1 {
  font-size: 8em; }

/* line 88, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
h2 {
  font-size: 6em;
  color: white;
  margin: 35px 20px;
  padding: 0px;
  text-align: center; }

/* line 96, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
h3 {
  font-size: 3em;
  margin: 1rem 0; }

/* line 101, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
p {
  font-size: 1.6rem;
  font-size: 16px;
  margin-bottom: 0.8rem;
  line-height: 2.5rem;
  text-align: justify; }

/* line 108, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
.xlarge-block h2 {
  font-size: 4em;
  margin: 20px 10px 10px; }

/* line 112, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
.xlarge-block .para2 {
  font-family: 'bebas_neueregular', Arial, sans-serif;
  text-align: center;
  color: white;
  font-size: 2em;
  margin: 0 0 20px; }

/* line 119, /Users/Paul/Desktop/portfolio_2016/www/scss/_01_typo.scss */
.xlarge-block .para3 {
  font-family: 'bebas_neueregular', Arial, sans-serif;
  text-align: center;
  color: white;
  font-size: 3em;
  margin: 0 0 30px; }

/* BASE */
/* line 2, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.clear {
  clear: both;
  height: 0px; }

/* line 17, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
html, body {
  height: 100%; }

/* line 20, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.testimony {
  width: 25%;
  height: 100%;
  float: left;
  background: black; }

/* line 26, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.contenu {
  width: 75%;
  height: 100%;
  float: left;
  display: flex; }

/* line 32, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.diag {
  width: 20%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  transition: width 0.2s ease-out; }

/* HEADER*/
/* line 41, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
header {
  height: 40em;
  width: 100%;
  background: #06153e; }

/* line 46, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#cover {
  height: 40em;
  width: 100%; }

/* line 53, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#about, #portfolio, #contact {
  width: 960px;
  height: auto;
  margin: 20px auto 40px auto; }

/* line 58, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#title h1 {
  padding-top: 2em; }

/* line 61, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#title h3 {
  font-size: 3em; }

/* line 64, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#title h1, #title h3 {
  width: auto;
  height: auto;
  margin: 0em auto 0em auto;
  color: white;
  text-align: center;
  text-shadow: 0.05em 0.05em 0 #06153e;
  position: relative; }

/* line 73, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#bato {
  width: 100%;
  position: absolute;
  max-height: 40em; }
  /* line 83, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g1_bato_jaune {
    transform: rotate(-4deg);
    animation: tossing 15s ease-in-out 1s infinite alternate; }
  /* line 87, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g2_bato_jaune {
    animation: leftright 15s ease-in-out 1s infinite alternate; }
  /* line 90, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g3_bato_jaune {
    animation: floating 15s ease-in-out 1s infinite alternate; }
  /* line 93, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g1_bato_rouge {
    animation: floating 15s ease-in-out 2s infinite alternate; }
  /* line 96, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g2_bato_rouge {
    transform: rotate(-4deg);
    animation: tossing 15s ease-in-out 2s infinite alternate; }
  /* line 100, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g3_bato_rouge {
    animation: floating 15s ease-in-out 2s infinite alternate; }
  /* line 103, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g1_bato_bleu {
    animation: leftright 15s ease-in-out 0s infinite alternate; }
  /* line 106, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g2_bato_bleu {
    animation: floating 15s ease-in-out 0s infinite alternate; }
  /* line 109, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
  #bato #g3_bato_bleu {
    transform: rotate(-4deg);
    animation: tossing 15s ease-in-out 0s infinite alternate; }

/* line 114, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.wrapper {
  position: relative;
  margin: 0 auto;
  padding: 0;
  background: fixed no-repeat url(../img/cover/02.jpg); }

/* line 120, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.nav-container {
  width: 100%; }

/* NAVIGATION */
/* line 125, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
nav {
  z-index: 42;
  padding: 1em 3em;
  background: rgba(239, 197, 48, 0.7);
  position: relative;
  width: auto; }

/* line 133, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
nav li {
  display: inline;
  list-style: none; }

/* line 138, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
nav li a {
  text-decoration: none;
  font-size: 1.4em;
  text-transform: uppercase;
  color: #06153e;
  font-weight: bold;
  display: inline-block;
  width: 5em;
  text-align: center;
  padding: 0.5em 1em;
  /*-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;*/
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  transition: background 0.5s; }

/* line 157, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
nav li a:hover, nav li a.selected {
  color: #fff;
  background: #40bfe8;
  -webkit-transition: background 0.5s;
  -moz-transition: background 0.5s;
  transition: background 0.5s; }

/*clearfix*/
/* line 166, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.wrapper:before, .wrapper:after {
  content: '';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
  clear: both; }

/* line 176, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.sticky {
  position: fixed;
  top: 15px;
  width: 100%;
  animation: thedrop 1s 1;
  -moz-animation: thedrop 1s 1;
  -webkit-animation: thedrop 1s 1; }

/* line 185, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.sticky .nav-above {
  position: absolute;
  top: -15px;
  left: 1em;
  right: 1em;
  height: 15px; }

/* A PROPOS */
/* line 193, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.block, .large-block, .xlarge-block, .full-block {
  height: 240px;
  float: left;
  visibility: hidden; }

/* line 198, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.block a img, .large-block a img, .xlarge-block a img, .full-block a img {
  width: 240px;
  height: 240px;
  opacity: 0.8;
  -webkit-transition: opacity 0.2s linear;
  -moz-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear; }

/* line 206, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.block a img:hover, .large-block a img:hover, .xlarge-block a img:hover, .full-block a img:hover {
  opacity: 1;
  -webkit-transition: opacity 0.2s linear;
  -moz-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear; }

/* line 212, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.large-block, .large-bloc img {
  width: 480px;
  background-image: url(../img/icon/icon_magenta.gif); }

/* line 216, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.xlarge-block, .xlarge-block img {
  width: 720px;
  background-image: url(../img/icon/icon_cyan.gif); }

/* line 220, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.full-block, .full-block img {
  width: 960px;
  background-image: url(../img/icon/icon_magenta.gif); }

/* line 224, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.block, .block img {
  width: 240px;
  background-image: url(../img/icon/icon_font.png);
  background-size: 100%;
  background-repeat: no-repeat; }

/* line 230, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.skills {
  font-family: 'bebas_neueregular', Arial, sans-serif;
  color: black;
  margin: 0 auto;
  font-size: 2em;
  margin: 30px 0px; }

/* line 240, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.skillblock {
  width: 240px;
  float: left;
  margin: 0 40px; }

/* line 245, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.skill {
  float: left;
  margin: 0 20px 10px; }

/* PORTFOLIO */
/* line 250, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.blockhide {
  background: lightgrey;
  box-sizing: border-box;
  overflow: hidden;
  max-height: 2000px;
  -webkit-transition: max-height 0.5s ease-in-out;
  -moz-transition: max-height 0.5s ease-in-out;
  transition: max-height 0.5s ease-in-out; }

/* CONTACT */
/* line 260, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.wrap {
  visibility: hidden;
  width: 50%;
  float: left;
  margin-bottom: 50px; }

/* FORMULAIRES */
/* line 267, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input {
  height: 2.5em;
  font-size: 1em;
  text-align: center;
  color: white;
  border: none;
  outline: none; }

/* line 274, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input.clear, input.validate {
  height: 2.5em;
  font-size: 1em;
  text-align: center;
  color: #fff;
  background-color: #EF3063;
  border-bottom: solid 5px #871D3D;
  cursor: pointer; }

/* line 283, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input.validate:active {
  border-bottom: solid 2px #871D3D;
  padding-top: 3px; }

/* line 287, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input.clear:active {
  border-bottom: solid 2px #871D3D;
  padding-top: 3px; }

/* line 291, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input.validate:hover, input.clear:hover {
  background-color: #D82A4E; }

/* line 294, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
textarea {
  font-size: 1em;
  color: #fff;
  border: none;
  padding: 10px;
  background-color: #30B5EF;
  margin: 10px 0px;
  outline: none;
  width: 100%; }

/* line 304, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input button {
  height: 2em; }

/* line 307, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input.name {
  background-color: #30B5EF; }

/* line 310, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input.mail {
  background-color: #EF3063; }

/* line 313, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
input.subject {
  background-color: #EFC530; }

/* FOOTER */
/* line 317, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
.linkedin, .twitter, .viadeo {
  width: 50px; }

/* line 320, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#img_foot {
  padding: 0px;
  float: left;
  width: 50%;
  text-align: center;
  margin: 0px; }

/* line 327, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#img_foot img {
  width: 50%; }

/* line 330, /Users/Paul/Desktop/portfolio_2016/www/scss/_02_home.scss */
#credits {
  text-align: center;
  font-size: 1.2em;
  font-size: 12px; }

/*
==============================================
CSS3 ANIMATION CHEAT SHEET
==============================================

Made by Justin Aguilar

www.justinaguilar.com/animations/

Questions, comments, concerns, love letters:
justin@justinaguilar.com
==============================================
*/
/*
==============================================
slideDown
==============================================
*/
/* line 22, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.slideDown {
  animation-name: slideDown;
  -webkit-animation-name: slideDown;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-timing-function: ease;
  -webkit-animation-timing-function: ease;
  visibility: visible !important; }

@keyframes slideDown {
  0% {
    transform: translateY(-100%); }
  100% {
    transform: translateY(0%); } }

@-webkit-keyframes slideDown {
  0% {
    -webkit-transform: translateY(-100%); }
  100% {
    -webkit-transform: translateY(0%); } }

/*
==============================================
slideUp
==============================================
*/
/* line 84, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.slideUp {
  animation-name: slideUp;
  -webkit-animation-name: slideUp;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-timing-function: ease;
  -webkit-animation-timing-function: ease;
  visibility: visible !important; }

@keyframes slideUp {
  0% {
    transform: translateY(100%); }
  100% {
    transform: translateY(0%); } }

@-webkit-keyframes slideUp {
  0% {
    -webkit-transform: translateY(100%); }
  100% {
    -webkit-transform: translateY(0%); } }

/*
==============================================
slideLeft
==============================================
*/
/* line 146, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.slideLeft {
  animation-name: slideLeft;
  -webkit-animation-name: slideLeft;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  visibility: visible !important; }

@keyframes slideLeft {
  0% {
    transform: translateX(400%); }
  100% {
    transform: translateX(0%); } }

@-webkit-keyframes slideLeft {
  0% {
    -webkit-transform: translateX(400%); }
  100% {
    -webkit-transform: translateX(0%); } }

/*
==============================================
slideRight
==============================================
*/
/* line 208, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.slideRight {
  animation-name: slideRight;
  -webkit-animation-name: slideRight;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  visibility: visible !important; }

@keyframes slideRight {
  0% {
    transform: translateX(-400%); }
  100% {
    transform: translateX(0%); } }

@-webkit-keyframes slideRight {
  0% {
    -webkit-transform: translateX(-400%); }
  100% {
    -webkit-transform: translateX(0%); } }

/*
==============================================
slideExpandUp
==============================================
*/
/* line 270, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.slideExpandUp {
  animation-name: slideExpandUp;
  -webkit-animation-name: slideExpandUp;
  animation-duration: 1.6s;
  -webkit-animation-duration: 1.6s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease -out;
  visibility: visible !important; }

@keyframes slideExpandUp {
  0% {
    transform: translateY(100%) scaleX(0.5); }
  30% {
    transform: translateY(-8%) scaleX(0.5); }
  40% {
    transform: translateY(2%) scaleX(0.5); }
  50% {
    transform: translateY(0%) scaleX(1.1); }
  60% {
    transform: translateY(0%) scaleX(0.9); }
  70% {
    transform: translateY(0%) scaleX(1.05); }
  80% {
    transform: translateY(0%) scaleX(0.95); }
  90% {
    transform: translateY(0%) scaleX(1.02); }
  100% {
    transform: translateY(0%) scaleX(1); } }

@-webkit-keyframes slideExpandUp {
  0% {
    -webkit-transform: translateY(100%) scaleX(0.5); }
  30% {
    -webkit-transform: translateY(-8%) scaleX(0.5); }
  40% {
    -webkit-transform: translateY(2%) scaleX(0.5); }
  50% {
    -webkit-transform: translateY(0%) scaleX(1.1); }
  60% {
    -webkit-transform: translateY(0%) scaleX(0.9); }
  70% {
    -webkit-transform: translateY(0%) scaleX(1.05); }
  80% {
    -webkit-transform: translateY(0%) scaleX(0.95); }
  90% {
    -webkit-transform: translateY(0%) scaleX(1.02); }
  100% {
    -webkit-transform: translateY(0%) scaleX(1); } }

/*
==============================================
expandUp
==============================================
*/
/* line 350, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.expandUp {
  animation-name: expandUp;
  -webkit-animation-name: expandUp;
  animation-duration: 0.7s;
  -webkit-animation-duration: 0.7s;
  animation-timing-function: ease;
  -webkit-animation-timing-function: ease;
  visibility: visible !important; }

@keyframes expandUp {
  0% {
    transform: translateY(100%) scale(0.6) scaleY(0.5); }
  60% {
    transform: translateY(-7%) scaleY(1.12); }
  75% {
    transform: translateY(3%); }
  100% {
    transform: translateY(0%) scale(1) scaleY(1); } }

@-webkit-keyframes expandUp {
  0% {
    -webkit-transform: translateY(100%) scale(0.6) scaleY(0.5); }
  60% {
    -webkit-transform: translateY(-7%) scaleY(1.12); }
  75% {
    -webkit-transform: translateY(3%); }
  100% {
    -webkit-transform: translateY(0%) scale(1) scaleY(1); } }

/*
==============================================
fadeIn
==============================================
*/
/* line 399, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.fadeIn {
  animation-name: fadeIn;
  -webkit-animation-name: fadeIn;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  visibility: visible !important; }

@keyframes fadeIn {
  0% {
    transform: scale(0);
    opacity: 0.0; }
  100% {
    transform: scale(1);
    opacity: 1; } }

@-webkit-keyframes fadeIn {
  0% {
    -webkit-transform: scale(0);
    opacity: 0.0; }
  100% {
    -webkit-transform: scale(1);
    opacity: 1; } }

/*
==============================================
expandOpen
==============================================
*/
/* line 455, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.expandOpen {
  animation-name: expandOpen;
  -webkit-animation-name: expandOpen;
  animation-duration: 1.2s;
  -webkit-animation-duration: 1.2s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  visibility: visible !important; }

@keyframes expandOpen {
  0% {
    transform: scale(1.8); }
  50% {
    transform: scale(0.95); }
  80% {
    transform: scale(1.05); }
  90% {
    transform: scale(0.98); }
  100% {
    transform: scale(1); } }

@-webkit-keyframes expandOpen {
  0% {
    -webkit-transform: scale(1.8); }
  50% {
    -webkit-transform: scale(0.95); }
  80% {
    -webkit-transform: scale(1.05); }
  90% {
    -webkit-transform: scale(0.98); }
  100% {
    -webkit-transform: scale(1); } }

/*
==============================================
bigEntrance
==============================================
*/
/* line 511, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.bigEntrance {
  animation-name: bigEntrance;
  -webkit-animation-name: bigEntrance;
  animation-duration: 1.6s;
  -webkit-animation-duration: 1.6s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  visibility: visible !important; }

@keyframes bigEntrance {
  0% {
    transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%);
    opacity: 0.2; }
  30% {
    transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);
    opacity: 1; }
  45% {
    transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
    opacity: 1; }
  60% {
    transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);
    opacity: 1; }
  75% {
    transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
    opacity: 1; }
  90% {
    transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%);
    opacity: 1; }
  100% {
    transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
    opacity: 1; } }

@-webkit-keyframes bigEntrance {
  0% {
    -webkit-transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%);
    opacity: 0.2; }
  30% {
    -webkit-transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);
    opacity: 1; }
  45% {
    -webkit-transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
    opacity: 1; }
  60% {
    -webkit-transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);
    opacity: 1; }
  75% {
    -webkit-transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
    opacity: 1; }
  90% {
    -webkit-transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%);
    opacity: 1; }
  100% {
    -webkit-transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
    opacity: 1; } }

/*
==============================================
hatch
==============================================
*/
/* line 592, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.hatch {
  animation-name: hatch;
  -webkit-animation-name: hatch;
  animation-duration: 2s;
  -webkit-animation-duration: 2s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -webkit-transform-origin: 50% 100%;
  visibility: visible !important; }

@keyframes hatch {
  0% {
    transform: rotate(0deg) scaleY(0.6); }
  20% {
    transform: rotate(-2deg) scaleY(1.05); }
  35% {
    transform: rotate(2deg) scaleY(1); }
  50% {
    transform: rotate(-2deg); }
  65% {
    transform: rotate(1deg); }
  80% {
    transform: rotate(-1deg); }
  100% {
    transform: rotate(0deg); } }

@-webkit-keyframes hatch {
  0% {
    -webkit-transform: rotate(0deg) scaleY(0.6); }
  20% {
    -webkit-transform: rotate(-2deg) scaleY(1.05); }
  35% {
    -webkit-transform: rotate(2deg) scaleY(1); }
  50% {
    -webkit-transform: rotate(-2deg); }
  65% {
    -webkit-transform: rotate(1deg); }
  80% {
    -webkit-transform: rotate(-1deg); }
  100% {
    -webkit-transform: rotate(0deg); } }

/*
==============================================
bounce
==============================================
*/
/* line 665, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.bounce {
  animation-name: bounce;
  -webkit-animation-name: bounce;
  animation-duration: 1.6s;
  -webkit-animation-duration: 1.6s;
  animation-timing-function: ease;
  -webkit-animation-timing-function: ease;
  transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -webkit-transform-origin: 50% 100%; }

@keyframes bounce {
  0% {
    transform: translateY(0%) scaleY(0.6); }
  60% {
    transform: translateY(-100%) scaleY(1.1); }
  70% {
    transform: translateY(0%) scaleY(0.95) scaleX(1.05); }
  80% {
    transform: translateY(0%) scaleY(1.05) scaleX(1); }
  90% {
    transform: translateY(0%) scaleY(0.95) scaleX(1); }
  100% {
    transform: translateY(0%) scaleY(1) scaleX(1); } }

@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translateY(0%) scaleY(0.6); }
  60% {
    -webkit-transform: translateY(-100%) scaleY(1.1); }
  70% {
    -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1.05); }
  80% {
    -webkit-transform: translateY(0%) scaleY(1.05) scaleX(1); }
  90% {
    -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1); }
  100% {
    -webkit-transform: translateY(0%) scaleY(1) scaleX(1); } }

/*
==============================================
pulse
==============================================
*/
/* line 729, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.pulse {
  animation-name: pulse;
  -webkit-animation-name: pulse;
  animation-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite; }

@keyframes pulse {
  0% {
    transform: scale(0.9);
    opacity: 0.7; }
  50% {
    transform: scale(1);
    opacity: 1; }
  100% {
    transform: scale(0.9);
    opacity: 0.7; } }

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(0.95);
    opacity: 0.7; }
  50% {
    -webkit-transform: scale(1);
    opacity: 1; }
  100% {
    -webkit-transform: scale(0.95);
    opacity: 0.7; } }

/*
==============================================
floating
==============================================
*/
/* line 776, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.floating {
  animation-name: floating;
  -webkit-animation-name: floating;
  animation-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite; }

@keyframes floating {
  0% {
    transform: translateY(0%); }
  50% {
    transform: translateY(8%); }
  100% {
    transform: translateY(0%); } }

@-webkit-keyframes floating {
  0% {
    -webkit-transform: translateY(0%); }
  50% {
    -webkit-transform: translateY(8%); }
  100% {
    -webkit-transform: translateY(0%); } }

/*
==============================================
leftright
==============================================
*/
/* line 817, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.leftright {
  animation-name: leftright;
  -webkit-animation-name: leftright;
  animation-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite; }

@keyframes leftright {
  0% {
    transform: translateX(0%); }
  50% {
    transform: translateX(8%); }
  100% {
    transform: translateX(0%); } }

@-webkit-keyframes leftright {
  0% {
    -webkit-transform: translateX(0%); }
  50% {
    -webkit-transform: translateX(8%); }
  100% {
    -webkit-transform: translateX(0%); } }

/*
==============================================
tossing
==============================================
*/
/* line 858, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.tossing {
  animation-name: tossing;
  -webkit-animation-name: tossing;
  animation-duration: 2.5s;
  -webkit-animation-duration: 2.5s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite; }

@keyframes tossing {
  0% {
    transform: rotate(-4deg); }
  50% {
    transform: rotate(4deg); }
  100% {
    transform: rotate(-4deg); } }

@-webkit-keyframes tossing {
  0% {
    -webkit-transform: rotate(-4deg); }
  50% {
    -webkit-transform: rotate(4deg); }
  100% {
    -webkit-transform: rotate(-4deg); } }

/*
==============================================
pullUp
==============================================
*/
/* line 899, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.pullUp {
  animation-name: pullUp;
  -webkit-animation-name: pullUp;
  animation-duration: 1.1s;
  -webkit-animation-duration: 1.1s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -webkit-transform-origin: 50% 100%; }

@keyframes pullUp {
  0% {
    transform: scaleY(0.1); }
  40% {
    transform: scaleY(1.02); }
  60% {
    transform: scaleY(0.98); }
  80% {
    transform: scaleY(1.01); }
  100% {
    transform: scaleY(0.98); }
  80% {
    transform: scaleY(1.01); }
  100% {
    transform: scaleY(1); } }

@-webkit-keyframes pullUp {
  0% {
    -webkit-transform: scaleY(0.1); }
  40% {
    -webkit-transform: scaleY(1.02); }
  60% {
    -webkit-transform: scaleY(0.98); }
  80% {
    -webkit-transform: scaleY(1.01); }
  100% {
    -webkit-transform: scaleY(0.98); }
  80% {
    -webkit-transform: scaleY(1.01); }
  100% {
    -webkit-transform: scaleY(1); } }

/*
==============================================
pullDown
==============================================
*/
/* line 968, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.pullDown {
  animation-name: pullDown;
  -webkit-animation-name: pullDown;
  animation-duration: 1.1s;
  -webkit-animation-duration: 1.1s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  transform-origin: 50% 0%;
  -ms-transform-origin: 50% 0%;
  -webkit-transform-origin: 50% 0%; }

@keyframes pullDown {
  0% {
    transform: scaleY(0.1); }
  40% {
    transform: scaleY(1.02); }
  60% {
    transform: scaleY(0.98); }
  80% {
    transform: scaleY(1.01); }
  100% {
    transform: scaleY(0.98); }
  80% {
    transform: scaleY(1.01); }
  100% {
    transform: scaleY(1); } }

@-webkit-keyframes pullDown {
  0% {
    -webkit-transform: scaleY(0.1); }
  40% {
    -webkit-transform: scaleY(1.02); }
  60% {
    -webkit-transform: scaleY(0.98); }
  80% {
    -webkit-transform: scaleY(1.01); }
  100% {
    -webkit-transform: scaleY(0.98); }
  80% {
    -webkit-transform: scaleY(1.01); }
  100% {
    -webkit-transform: scaleY(1); } }

/*
==============================================
stretchLeft
==============================================
*/
/* line 1037, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.stretchLeft {
  animation-name: stretchLeft;
  -webkit-animation-name: stretchLeft;
  animation-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  transform-origin: 100% 0%;
  -ms-transform-origin: 100% 0%;
  -webkit-transform-origin: 100% 0%; }

@keyframes stretchLeft {
  0% {
    transform: scaleX(0.3); }
  40% {
    transform: scaleX(1.02); }
  60% {
    transform: scaleX(0.98); }
  80% {
    transform: scaleX(1.01); }
  100% {
    transform: scaleX(0.98); }
  80% {
    transform: scaleX(1.01); }
  100% {
    transform: scaleX(1); } }

@-webkit-keyframes stretchLeft {
  0% {
    -webkit-transform: scaleX(0.3); }
  40% {
    -webkit-transform: scaleX(1.02); }
  60% {
    -webkit-transform: scaleX(0.98); }
  80% {
    -webkit-transform: scaleX(1.01); }
  100% {
    -webkit-transform: scaleX(0.98); }
  80% {
    -webkit-transform: scaleX(1.01); }
  100% {
    -webkit-transform: scaleX(1); } }

/*
==============================================
stretchRight
==============================================
*/
/* line 1106, /Users/Paul/Desktop/portfolio_2016/www/scss/_03_animations.scss */
.stretchRight {
  animation-name: stretchRight;
  -webkit-animation-name: stretchRight;
  animation-duration: 1.5s;
  -webkit-animation-duration: 1.5s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  transform-origin: 0% 0%;
  -ms-transform-origin: 0% 0%;
  -webkit-transform-origin: 0% 0%; }

@keyframes stretchRight {
  0% {
    transform: scaleX(0.3); }
  40% {
    transform: scaleX(1.02); }
  60% {
    transform: scaleX(0.98); }
  80% {
    transform: scaleX(1.01); }
  100% {
    transform: scaleX(0.98); }
  80% {
    transform: scaleX(1.01); }
  100% {
    transform: scaleX(1); } }

@-webkit-keyframes stretchRight {
  0% {
    -webkit-transform: scaleX(0.3); }
  40% {
    -webkit-transform: scaleX(1.02); }
  60% {
    -webkit-transform: scaleX(0.98); }
  80% {
    -webkit-transform: scaleX(1.01); }
  100% {
    -webkit-transform: scaleX(0.98); }
  80% {
    -webkit-transform: scaleX(1.01); }
  100% {
    -webkit-transform: scaleX(1); } }

/* line 1, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-grid {
  list-style: none;
  padding: 0px 0;
  margin: 0 auto;
  text-align: center;
  width: 100%; }

/* line 9, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.divchild {
  display: inline-block;
  vertical-align: top;
  height: 240px;
  -webkit-transition: height 0.5s ease-in-out, width 0.5s ease-in-out;
  -moz-transition: height 0.5s ease-in-out, width 0.5s ease-in-out;
  transition: height 0.5s ease-in-out, width 0.5s ease-in-out;
  margin: 20px 40px; }

/* line 20, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.divchild > a,
.divchild > a img {
  border: none;
  outline: none;
  display: block;
  position: relative;
  -webkit-transition: height 0.5s ease-in-out, width 0.5s ease-in-out;
  -moz-transition: height 0.5s ease-in-out, width 0.5s ease-in-out;
  transition: height 0.5s ease-in-out, width 0.5s ease-in-out; }

/* line 30, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.divchild .og-expanded > a::after {
  top: auto;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-bottom-color: #ddd;
  border-width: 15px;
  left: 50%;
  margin: 6px 0 0 -15px; }

/* line 44, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-expander {
  position: absolute;
  background: #ddd;
  top: auto;
  left: 0;
  width: 100%;
  margin-top: -3px;
  text-align: left;
  height: 0;
  overflow: hidden;
  z-index: 9; }

/* line 57, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-expander-inner {
  padding: 50px 30px;
  height: 100%; }

/* line 62, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-close {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 20px;
  right: 20px;
  cursor: pointer; }

/* line 72, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-close::before,
.og-close::after {
  content: '';
  position: absolute;
  width: 100%;
  top: 50%;
  height: 1px;
  background: #888;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg); }

/* line 84, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-close::after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg); }

/* line 92, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-close:hover::before,
.og-close:hover::after {
  background: #333;
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg); }

/* line 101, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-fullimg,
.og-details {
  width: 50%;
  float: left;
  height: 100%;
  overflow: hidden;
  position: relative; }

/* line 109, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details {
  padding: 0 0 0 0;
  text-align: justify;
  overflow: auto; }

/* line 114, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details h4 {
  font-family: 'bebas_neueregular', Arial, sans-serif;
  font-size: 2em;
  margin: 10px 0;
  padding: 0px; }

/* line 120, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-fullfullimg {
  text-align: center; }

/* line 124, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-fullimg img {
  display: inline-block;
  max-height: 100%;
  max-width: 680px;
  margin-top: 25px;
  width: 100%; }

/* line 132, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details h3 {
  font-weight: 300;
  font-size: 52px;
  padding: 0 50px 0px;
  margin-bottom: 0px; }

/* line 138, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details ul {
  margin: 10px 0 0; }

/* line 141, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details p {
  padding-left: 50px;
  padding-right: 50px;
  padding-bottom: 60px;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #999; }

/* line 151, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details a {
  font-weight: 700;
  font-size: 16px;
  color: #333;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding: 10px 20px;
  border: 3px solid #333;
  display: inline-block;
  margin: 30px 0 0;
  outline: none; }

/* line 163, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details .mylink {
  font-weight: initial;
  font-size: initial;
  color: initial;
  text-transform: initial;
  letter-spacing: initial;
  padding: initial;
  border: initial;
  display: initial;
  margin: initial;
  outline: initial; }

/* line 175, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details .mylink::before {
  content: none;
  display: initial;
  margin-right: initial; }

/* line 180, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details .mylink:hover {
  border-color: initial;
  color: initial; }

/* line 184, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details a::before {
  content: '\2192';
  display: inline-block;
  margin-right: 10px; }

/* line 189, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-details a:hover {
  border-color: #999;
  color: #999; }

/* line 194, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
.og-loading {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ddd;
  box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ccc;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -25px 0 0 -25px;
  -webkit-animation: loader 0.5s infinite ease-in-out both;
  -moz-animation: loader 0.5s infinite ease-in-out both;
  animation: loader 0.5s infinite ease-in-out both; }

@-webkit-keyframes loader {
  0% {
    background: #ddd; }
  33% {
    background: #ccc;
    box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
  66% {
    background: #ccc;
    box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; } }

@-moz-keyframes loader {
  0% {
    background: #ddd; }
  33% {
    background: #ccc;
    box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
  66% {
    background: #ccc;
    box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; } }

@keyframes loader {
  0% {
    background: #ddd; }
  33% {
    background: #ccc;
    box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
  66% {
    background: #ccc;
    box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; } }

@media screen and (max-width: 830px) {
  /* line 229, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
  .og-expander h3 {
    font-size: 32px; }
  /* line 230, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
  .og-expander p {
    font-size: 13px; }
  /* line 231, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
  .og-expander a {
    font-size: 12px; } }

@media screen and (max-width: 650px) {
  /* line 237, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
  .og-fullimg {
    display: none; }
  /* line 238, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
  .og-details {
    float: none;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px; }
  /* line 239, /Users/Paul/Desktop/portfolio_2016/www/scss/_04_component.scss */
  .og-details, .og-details p {
    padding-left: 0px;
    padding-right: 0px; } }

/*MEDIA QUERIES*/
/* #Tablet (Portrait) width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {
  /* line 5, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .wrapper {
    width: 100%; }
  /* line 8, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  header, #cover, #bato {
    height: 30em; }
  /* line 11, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  #title h1 {
    padding-top: 1.3em; }
  /* line 14, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  #about, #portfolio, #contact {
    width: 720px;
    height: auto;
    margin: 20px auto 40px auto; }
  /* line 19, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .large-block, .large-bloc img {
    width: 240px; }
  /* line 22, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block, .xlarge-block img {
    width: 480px; }
  /* line 25, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block h2 {
    margin: 10px 10px 10px; }
  /* line 28, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block .para2, .xlarge-block .para3 {
    font-size: 2em;
    margin: 0 0 10px; }
  /* line 32, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .full-block, .full-block img {
    width: 480px;
    height: 100%; }
  /* line 36, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .skillblock {
    margin: 0px 60px 20px; }
  /* line 39, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  h2 {
    font-size: 4em; }
  /* line 42, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .divchild {
    margin: 30px 60px; } }

/* Mobile (Landscape) width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  /* line 49, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .wrapper {
    width: 100%; }
  /* line 52, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  header, #cover, #bato {
    height: 20em; }
  /* line 55, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  #title h1 {
    padding-top: 1.2em;
    font-size: 5.3em; }
  /* line 59, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  #title h3 {
    display: inherit; }
  /* line 62, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  #about, #portfolio, #contact {
    width: 480px;
    height: auto;
    margin: 20px auto 40px auto; }
  /* line 67, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .large-block, .large-bloc img {
    width: 240px; }
  /* line 70, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block, .xlarge-block img {
    width: 480px; }
  /* line 73, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block h2 {
    margin: 10px 10px 10px; }
  /* line 76, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block .para2, .xlarge-block .para3 {
    font-size: 2em;
    margin: 0 0 10px; }
  /* line 80, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .full-block, .full-block img {
    width: 480px;
    height: 100%; }
  /* line 84, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .large-block h2, .xlarge-block h2 {
    font-size: 4em; }
  /* line 87, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .divchild {
    margin: 0; }
  /* line 90, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .skillblock {
    margin: 0 0 20px; } }

/* #Mobile (Portrait) width of 320px */
@media only screen and (max-width: 479px) {
  /* line 96, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .wrapper {
    width: 100%; }
  /* line 99, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  header, #cover, #bato {
    height: 10em; }
  /* line 102, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  #title h1 {
    padding-top: 0.4em;
    font-size: 3.4em; }
  /* line 106, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  #title h3 {
    display: none; }
  /* line 109, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  nav li a {
    padding: 0.5em 0.1em;
    width: 4em; }
  /* line 113, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  #about, #portfolio, #contact {
    width: 240px;
    height: auto;
    margin: 20px auto 40px auto; }
  /* line 118, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .large-block, .large-bloc img {
    width: 240px; }
  /* line 121, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block, .xlarge-block img {
    width: 240px; }
  /* line 124, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block h2 {
    font-size: 2.5em;
    margin: 10px 10px 10px; }
  /* line 128, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .xlarge-block .para2, .xlarge-block .para3 {
    font-size: 1.5em;
    margin: 0 0 5px; }
  /* line 132, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .full-block, .full-block img {
    width: 240px;
    height: 100%; }
  /* line 136, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .large-block h2 {
    font-size: 4em; }
  /* line 139, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .divchild, .skillblock {
    margin: 0; }
  /* line 142, /Users/Paul/Desktop/portfolio_2016/www/scss/_99_responsive.scss */
  .skill {
    margin: 0 10px 10px; } }
#contact {
  min-height: 400px;
}


/*# sourceMappingURL=portfolio_2016-style.css.map */