/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
html {
  font-family:sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  width:100%;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block; }

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,
strong {
  font-weight: bold; }

dfn {
  font-style: italic; }

h1 {
  font-size: 2em;
  margin: 0.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: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  border: 0; }

svg:not(:root) {
  overflow: hidden; }

figure {
  margin: 1em 40px; }

hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

pre {
  overflow: auto; }

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;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

legend {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto; }

optgroup {
  font-weight: bold; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }

body {
  /*background-color: white;*/
  font-size: 14px;
  line-height: 1.6;
  font-family: filson-soft, tbchibirgothicplusk-pro, sans-serif;
  color: #9e9e9e;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
  width:100%;
  /*background: linear-gradient(3deg, #ffffff, #3fcff6, #9339e1);
  background-size: 600% 600%;
  -webkit-animation: AnimationName 30s ease infinite;
  -moz-animation: AnimationName 30s ease infinite;
  animation: AnimationName 30s ease infinite;*/ }
 
#particles_bg { width:100%; height:100%; position:fixed; top:0; left:0; z-index:1;}

.gigantic, .huge, .large, .bigger, .big,
h1, h2, h3, h4, h5, h6 {
  color: #222;
  font-weight: bold; }

.gigantic {
  font-size: 110px;
  line-height: 1.09;
  letter-spacing: -2px; }

.huge, h1 {
  font-size: 68px;
  line-height: 1.05;
  letter-spacing: -1px; }

.large, h2 {
  font-size: 42px;
  line-height: 1.14; }

.bigger, h3 {
  font-size: 26px;
  line-height: 1.38; }

.big, h4 {
  font-size: 22px;
  line-height: 1.38; }

.small, small {
  font-size: 10px;
  line-height: 1.2; }

p {margin: 0 0 20px 0; font-size: 90%; }

em {
  font-style: italic; }

strong {
  font-weight: bold; }

hr {
  border: solid #ddd;
  border-width: 1px 0 0;
  clear: both;
  margin: 10px 0 30px;
  height: 0; }

::selection {
  background: #FFF498; }

img::selection {
  background: transparent; }

body {
  -webkit-tap-highlight-color: #FFF498; }

.no-margin {
  margin: 0; }

.no-padding {
  padding: 0; }

a {
  display: inline-block;
  color: #2046f2;
  text-decoration: none; }

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none; }

input,
textarea {
  outline: none; }

.bold {
  font-weight: 700; }

.italic {
  font-style: italic; }
.t-center { text-align: center; }

.mt-1 { margin-top:1em}
.mt-2 { margin-top:2em}
.mt-3 { margin-top:3em}
.mt-4 { margin-top:4em}
.mt-5 { margin-top:5em}

.wrapper, .wrapper--small, .wrapper--large {
  position: relative;
  max-width: 90%;
  height: 90%;
  margin: 0 auto; }
  .wrapper--small {
    width: 980px; }
  .wrapper--large {
    width: 1170px; }

.splashscreen {
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  z-index: 100;
  transition: opacity 0.4s 0.4s; }
  .splashscreen--is-hidden {
    opacity: 0; }
    .splashscreen--is-hidden .preloader {
      opacity: 0; }


.preloader  {
  text-transform:uppercase;
  width:150px;
  text-align:center;
  line-height:50px;
  position:absolute;
  left:0;right:0;top:50%;
  margin:auto;
  transform:translateY(-50%);
}

	.preloader span {
	  position:relative;
	  z-index:999;
	  color:#fff;
	}
	.preloader:before {
	  content:"";
	  background:#61bdb6;
	  width:128px;
	  height:36px;
	  display:block;
	  position:absolute;
	  top:0;left:0;right:0;bottom:0;
	  margin:auto;
	  animation:2s loadingBefore infinite ease-in-out;
	}

@keyframes loadingBefore {
  0%   {transform:translateX(-14px);}
  50%  {transform:translateX(14px);}
  100% {transform:translateX(-14px);}
}

	.preloader:after {
	  content:"";
	  background:#ff3600;
	  width:14px;
	  height:60px;
	  display:block;
	  position:absolute;
	  top:0;left:0;right:0;bottom:0;
	  margin:auto;
	  opacity:.5;
	  animation:2s loadingAfter infinite ease-in-out;
	}

@keyframes loadingAfter {
  0%   {transform:translateX(-50px);}
  50%  {transform:translateX(50px);}
  100% {transform:translateX(-50px);}
}

.logo {
  text-transform: uppercase;z-index:100;
}

.logo img { width:100px;height:auto; }

.transform-link {
  font-weight: 700; }
  .transform-link::after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #2046f2;
    transition: transform 0.2s ease-out; }
  .transform-link:hover::after {
    transform: translateY(3px) scaleY(3); }

.button,
button{
  display: inline-block;
  padding: 5px 25px;
  color: #000000;
  font-weight: 700;
  text-decoration: none;
  background-color: #ffffff;
  border-radius: 25px;
  border: 2px solid #ffffff;
  cursor: pointer;
  transition: 0.2s all ease-in-out; }
  .button:hover, .button:active, .button:focus,
  button:hover,
  button:active,
  button:focus,
  input[type="submit"]:hover,
  input[type="submit"]:active,
  input[type="submit"]:focus,
  input[type="reset"]:hover,
  input[type="reset"]:active,
  input[type="reset"]:focus,
  input[type="button"]:hover,
  input[type="button"]:active,
  input[type="button"]:focus {
	color: #666666;
	border-color: #eeeeee;
}
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  padding: 5px 25px;
  color: #FFFFFF;
  font-weight: 700;
  text-decoration: none;
  background-color: #3fcff6;
  border-radius: 25px;
  border: 2px solid #3fcff6;
  cursor: pointer;
  transition: 0.2s all ease-in-out; }
  .button:hover, .button:active, .button:focus,
  button:hover,
  button:active,
  button:focus {
	color: #666666;
	border-color: #eeeeee;
}
input[type="submit"]:hover,
  input[type="submit"]:active,
  input[type="submit"]:focus,
  input[type="reset"]:hover,
  input[type="reset"]:active,
  input[type="reset"]:focus,
  input[type="button"]:hover,
  input[type="button"]:active,
  input[type="button"]:focus {
	color: #EFEFEF;
	border-color: #bcf3ff;
}

.blurb--framed {
  padding: 15px 0;
  background-color: #fafafa; }
.blurb__heading {
  margin: 0 0 15px 0;
  color: #585858;
  font-size: 58px;
  font-weight: 800; }
.blurb__copy {
  font-weight: 700; }
  .blurb__copy--tight {
    max-width: 300px; }

.title {
  margin: 0 0 45px 0;
  color: #585858;
  font-size: 58px;
  font-weight: 800;
  text-align: center; }

@keyframes fadeInOut {
  0% {
    opacity: 1; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 1; } }
@keyframes scrollDown {
  0% {
    transform: translate(-12px, 0px);
    opacity: 0; }
  75% {
    transform: translate(-12px, 45px);
    opacity: 1; }
  100% {
    transform: translate(-12px, 45px);
    opacity: 0; } }
@keyframes scaleUp {
  0% {
    transform: scale(0.95); }
  100% {
    transform: scale(1); } }
.navigation {
  position: fixed;
  width: 100%;
  height: 80px;
  z-index: 10;
  background-color:rgba(255,255,255,0);
	}
  .navigation__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between; }
  .navigation__container {
    position: absolute;
    top: 50%;
    left: 35%;
    transform: translate(-50%, -50%);
    width: 45%; }
  .navigation__list {
    display: flex;
    justify-content: space-between; }
    .navigation__list > li a {
      color: #333333;
      text-transform: uppercase;
      transition: color 0.2s ease-in-out; }
	.navigation__list > li a.navigation__cta.button {
      display:none; }
      .navigation__list > li a:hover {
        color: #000000; }
  .navigation__burger {
    display: none; }
  @media (max-width: 991px) {
	  .pc-only { display:none; }
    .navigation__cta {
      display: none; }
    .navigation__container {
      position: fixed;
      top: 0;
      left: 0;
      transform: translate(0, 0);
      display: flex;
      width: 100%;
      height: 100%;
      align-items: center;
      justify-content: center;
      background-color: #fff;
      opacity: 0;
      visibility: hidden;
      transition: visibility 0s 0.4s, opacity 0.4s; }
      .navigation__container--is-open {
        opacity: 1;
        visibility: visible;
        transition: visibility 0s, opacity 0.4s; }
        .navigation__container--is-open .navigation__list > li:nth-child(1) a {
          transition: transform 0.2s 0.4s, color 0.2s ease-in-out; }
        .navigation__container--is-open .navigation__list > li:nth-child(2) a {
          transition: transform 0.2s 0.6s, color 0.2s ease-in-out; }
        .navigation__container--is-open .navigation__list > li:nth-child(3) a {
          transition: transform 0.2s 0.8s, color 0.2s ease-in-out; }
        .navigation__container--is-open .navigation__list > li:nth-child(4) a {
          transition: transform 0.2s 1s, color 0.2s ease-in-out; }
	  	.navigation__list > li:nth-child(5) a.navigation__cta.button {
      	  display:block;transition: transform 0.2s 1.2s, color 0.2s ease-in-out; color:#d0e500;}
        .navigation__container--is-open .navigation__list > li a {
          transform: translateY(0); }
          .navigation__container--is-open .navigation__list > li a:hover {
            color: #c4c4c4; }
    .navigation__list {
      height: 250px;
      flex-direction: column;
      align-items: center; }
      .navigation__list > li {
        overflow: hidden; }
        .navigation__list > li a {
          transform: translateY(100%);
          color: #585858;
          font-weight: 700;
          transition: transform 0s 0.4s; }
    .navigation__burger {
      position: relative;
      display: flex;
      width: 35px;
      height: 27px;
      flex-direction: column;
      justify-content: space-between;
      cursor: pointer; }
      .navigation__burger--is-open .navigation__burger-el {
        transition: transform 0.4s, opacity 0.2s; }
        .navigation__burger--is-open .navigation__burger-el--top {
          transform: rotate(45deg); }
        .navigation__burger--is-open .navigation__burger-el--bottom {
          transform: rotate(-45deg); }
        .navigation__burger--is-open .navigation__burger-el--middle {
          opacity: 0; }
      .navigation__burger-el {
        display: block;
        width: 100%;
        height: 3px;
        background-color: #585858;
        transition: transform 0.4s, opacity 0.2s 0.2s; }
        .navigation__burger-el--top {
          transform-origin: left top; }
        .navigation__burger-el--bottom {
          transform-origin: left bottom; } 
          }

.scroll-lock {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden; }

/************************* Introduction ************************ */
.introduction {
  position: relative;
  display: flex;
  width: 100%;
  height: 100vh;
  align-items: center;
  justify-content: center;
  /*background: url( ../img/main01.jpg) 0 80px no-repeat;
	background-size:cover;
	padding-top: 80px;*/
	background: linear-gradient(3deg, #ffffff, #3fcff6, #9339e1);
  background-size: 600% 600%;
  -webkit-animation: AnimationName 30s ease infinite;
  -moz-animation: AnimationName 30s ease infinite;
  animation: AnimationName 30s ease infinite;
}
.introduction #introduction-bg { 
	width:100%;
	height: 100%;
	position:absolute;
	top:0;left:0;
	
	
}

@-webkit-keyframes AnimationName {
    0%{background-position:51% 0%}
    50%{background-position:50% 100%}
    100%{background-position:51% 0%}
}
@-moz-keyframes AnimationName {
    0%{background-position:51% 0%}
    50%{background-position:50% 100%}
    100%{background-position:51% 0%}
}
@keyframes AnimationName { 
    0%{background-position:51% 0%}
    50%{background-position:50% 100%}
    100%{background-position:51% 0%}
}


  .introduction__content {
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 800;
	max-width: 90%;
	position:fixed;
	margin:auto;
	}
    .introduction__content-el {
      display: block; }
      .introduction__content-el--name {
        transform: translateX(0);
        opacity: 1; }
      .introduction__content-el--description {
        transform: matrix(1.01107, 0, 0, 1.01107, 0, 0);
        margin: 20px 0;
        color: #FFFFFF;
        font-size: 10vw;
        text-align: center;
        }
      .introduction__content-el--job {
        transform: translateX(0);
        text-align: right;
        opacity: 1; }
  .introduction__arrow {
    position: absolute;
    bottom: 10%;
    left: 50%;
    transform: translate(-12px, 0px);
    width: 24px;
    fill: #d0e500;
    animation: scrollDown 1.6s infinite; }
  @media (min-width: 1440px) {
   /* .introduction::before {
      font-size: 576px; }
    .introduction__content-el--description {
      font-size: 230px; }*/ }
  @media (max-width: 990px) {
    .introduction__content {
    top:40vh;
	position: static;
	margin:auto;
	}
	  }
  @media (max-height: 540px) {
    .introduction__arrow {
      animation: none; } 
	  }

/************************* About ************************ */
.about {
  position: relative;
  width: 100%;height: 100vh;
  padding:100px 0; 
  background: #fafafa;
}
  .about__wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end; }

  .about__visual {
    position: absolute;
    left: 45px;
    bottom: 0;
    z-index: 2; }
  .about__content {
    position: relative;
    z-index: 1;
	width:45%;
	}
  .about__content * { color:#FFFFFF;}
 
  .about__txt-box{
	position: relative;
    z-index: 1;
	width:50%;
	padding:24px;
	box-sizing:border-box;
	background-color:#FFFFFF;
	box-shadow: 5px 8px 30px 1px rgba(0, 0, 0, 0.21);
	}
	.about__txt-box table {
	margin-top:20px;
	font-size: 80%;
	}
		.about__txt-box table td,.about__txt-box table th {
		text-align: left;
		padding:10px;
		}
.about__txt-box table th { width:6em;}
.about__txt-box table td li { margin-bottom:10px; }
.about__txt-box table td li:before { content:"▼ "}
    
  @media (max-width: 991px) {
    .about {
      padding: 90px 0; }
      .about__wrapper {
    display: block;}
    .about__visual {
    position: static;
    width:90%;
    margin:auto;
    left: auto;
    bottom: 0;
    z-index: 2; }
  .about__content {
    position: relative;
    z-index: 1;
	width:90%;
	margin:auto;
	}
 .about__txt-box { 
    width: 90%;
    margin:auto;
}       
      
        .about__content-blurb {
          padding: 0 15px; }
          .about__content-blurb h2 {
            font-size: 48px; }
          .about__content-blurb p {
            margin-bottom: 10px; }
        .about__content-signature {
          position: static;
          font-size: 24px; } }
  @media (max-width: 767px) {
    .about {
      height: auto; }
      .about__visual {
        width: 335px; }
      .about__content-blurb h2 {
        font-size: 32px; } }
  @media (max-width: 480px) {
    .about {
      height: auto; }
      .about__wrapper::before {
        display: none; }
      .about__visual {
        width: 290px;
        max-width: 100%; } }

/************************* service ************************ */
.service {
  position: relative;
  width: 100%;
  padding: 100px 0;
  overflow: hidden;
  background: linear-gradient(3deg, #ffffff, #3fcff6, #9339e1);
  background-size: 600% 600%;
  -webkit-animation: AnimationName 30s ease infinite;
  -moz-animation: AnimationName 30s ease infinite;
  animation: AnimationName 30s ease infinite;
  
   }
  .service__wrapper {
    /*display: flex;
    align-items: center;
    justify-content: flex-end;*/
	z-index:2; }
  .service__content {
	 width:40%; 
	 float:right;
  }
  .service__content h2, .service__content .blurb__copy { color:#FFFFFF;}
  .service__content dl { color:#FFFFFF; font-size:90%;}
  .service__content dl dt { border:1px solid #FFFFFF; padding:0.2em 0.5em; margin-bottom:1em; display:inline-block; width:6em; text-align:center;}
  .service__content dl dd { margin-bottom:2em; letter-spacing:1px} 
  .service__box {
    position: relative;
    z-index: 1;
	width: 52%;
	box-sizing:border-box;
	}
	.service__box dl{ width:100%; display:table;}
	.service__box dl dt{width:160px;}
	.service__box dl dt, .service__box dd { display:table-cell; font-size:90%; vertical-align:top;} 
	.service__box dd { padding-left:1em; width:auto;}
	.triangle{
		position: relative;
		display: inline-block;
		text-align: center;
		padding-top:1em;
		color:#333333;
		width: 160px;
    	height: 100px;
		font-size:90%;
	}
	.triangle:after {
		content: "";
		position: absolute;
		width: 0;
		height: 0;
		border-top: 100px solid #fdfd90;
		border-right: 80px solid transparent;
		border-bottom: 0 solid transparent;
		border-left: 80px solid transparent;
		z-index: -1;
		left: 0;
		top: 0;
	}
	.fukidashi{
		position: relative;
	display: block;
	padding: 10px 15px;
	width: 100%;
	height: auto;
	line-height: 1.6;
	text-align: left;
	background: #FFFFFF;
	border: 2px solid #fdfd90;
	z-index: 0;
	border-radius:10px;
	  }
	  .fukidashi:before{
		content: "";
	position: absolute;
	top: 50%; left: -14px;
	margin-top: -16px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 15px 15px 15px 0;
	border-color: transparent #FFFFFF transparent transparent;
	z-index: 0;
	  }
	  .fukidashi:after{
		content: "";
	position: absolute;
	top: 50%; left: -16px;
	margin-top: -17px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 16px 16px 16px 0;
	border-color: transparent #fdfd90 transparent transparent;
	z-index: -1;
	  }


  @media (max-width: 991px) {
    .service__content h2 {
      font-size: 48px; }
    .service__visual {
      width: 922px;
      height: auto; } 
    .service__content {
	 width:90%; 
	 float:none;
	 margin:auto;
  }
  .service__box {
    margin:auto;
	width: 90%;
	box-sizing:border-box;
	}
      
      }
  @media (max-width: 767px) {
    .service {
      padding: 90px 0; }
      .service__content {
        text-align: center; }
        .service__content h2 {
          font-size: 32px; }
          .service__content h2 br {
            display: none; }
        .service__content p {
          margin: 0 auto 20px auto; }
      
    .service__box dl{ width:100%; display:block; margin-bottom:1em;}
	.service__box dl dt{width:160px;}
	.service__box dl dt, .service__box dd { display:block; font-size:90%; } 
	.service__box dd { padding-left:0; width:90%; margin:auto;}
	.triangle{
		position: relative;
		display: inline-block;
		text-align: center;
		    padding-top: 0.25em;
		color:#333333;
		width: 160px;
    	height: auto;
		font-size:90%;
		
		background-color: #fdfd90;
	}
	.triangle:after,.fukidashi:before {
		display:none;
	}
	.fukidashi{
	position: relative;
	display: block;
	padding: 10px 15px;
	width: 100%;
	height: auto;
	line-height: 1.6;
	text-align: left;
	background: #FFFFFF;
	border: 2px solid #fdfd90;
	z-index: 0;
	border-radius:10px;
	  }
	  .fukidashi:before{
		  
		content: "";
	position: absolute;
	top: 0; left: -14px;
	margin-top: -16px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 15px 15px 15px;
	border-color: transparent #FFFFFF transparent transparent;
	z-index: 0;
	display:none; 
	  }
	  .fukidashi:after{
		  
		content: "";
	position: absolute;
	top: 0; left: -16px;
	margin-top: -17px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 16px 16px 16px;
	border-color: transparent #fdfd90 transparent transparent;
	z-index: -1;
	display:none; 
	  }
      
      
       }
  @media (max-width: 480px) {
    .service__visual {
      bottom: -100px;
      width: 576px;
      height: 366px; } }


/************************* Work ************************ */
.work {
  position: relative;
  width: 100%;
  padding: 120px 0;
  background-color: #fafafa;
  height:100vh;}
  
  #work h2, #work p {color:#FFFFFF; z-index: 2; position: relative;} 
  
  .work__content {
    position: relative;
    width: 42.5%;
    z-index: 1; }
    .swiper-wrapper {
    height: 35vh;
    }
	 .swiper-container {
        width: 100%;
        height: 100%;
    }
     .swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0;
    width: 100%;
    height: 30vh;
    position: relative;
	}
    .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
   
	.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
    top: 35vh;
    left: 0;
    width: 100%;
	z-index:20;
	}
	
	
	.swiper-pagination-bullet {
	    width: 8px;
	    height: 8px;
	    display: inline-block;
	    border-radius: 100%;
	    background: #FFF;
	    opacity: .2;
	}
	.swiper-pagination-bullet-active {
    opacity: 1;
    background: #d0e500;
}
	
	
  @media (max-width: 991px) {
    .work {
      padding: 90px 0 ; height:100%; }
      .work__heading {
        font-size: 48px; }
      .work__list {
        padding: 0; }
        .work__list::before {
          top: 45px;
          left: 0;
          right: 0;
          bottom: 45px; }
        .work__list-el--is-active {
          flex-direction: column; }
      .work__content {
        width: auto;
        max-width: 100%;
        margin-bottom: 45px;
        text-align: center; }
        .work__content-blurb {
          padding: 0 15px; }
          .work__content-blurb h3 {
            font-size: 42px; }
          .work__content-blurb p {
            max-width: 300px; }
      .work__visual {
        width: 600px;
        max-width: 75%; } }
  @media (max-width: 767px) {
    .work__heading {
      font-size: 32px; }
    .work__content-blurb h3 {
      font-size: 30px; } }
  @media (max-width: 480px) {
    .work__list::before {
      display: none; }
    .work__visual {
      max-width: 100%; } }



/************************* Contact ************************ */
.contact {
  position: relative;
  padding: 100px 0;
  background-color: #fafafa;
  height:72vh;
  }


.contact{
  background-color: #e74c3c;
  animation: bg-color 20s infinite;
  -webkit-animation: bg-color 20s infinite;
}
@-webkit-keyframes bg-color {
  0% { background-color: rgb(135,207,233); }
  20% { background-color: rgb(145,201,121); }
  40% { background-color: rgb(220,226,47); }
  60% { background-color: rgb(218,135,171); }
  80% { background-color: rgb(139,122,183); }
  100% { background-color: rgb(135,207,233); }
}
@keyframes bg-color {
  0% { background-color: rgb(135,207,233); }
  20% { background-color: rgb(145,201,121); }
  40% { background-color: rgb(220,226,47); }
  60% { background-color: rgb(218,135,171); }
  80% { background-color: rgb(139,122,183); }
  100% { background-color: rgb(135,207,233); }
}

  .contact__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 60px 0;
    height:auto;
    }
    .contact__wrapper::before {
      content: "";
      position: absolute;
      top: 0;
      left: 75px;
      right: 75px;
      bottom: 0;
      background-color: #fafafa;
      box-shadow: 5px 8px 30px 1px rgba(0, 0, 0, 0.21);
     }

  .contact__form {
    position: relative;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 15px 120px;
    z-index: 1;
    box-sizing: border-box;
}
.contact__form p {width:100%;}
    .contact__form-el {
      padding: 0 0 0 15px;
      font-size: 16px;
      font-weight: 700;
      background-color: transparent;
      border: 1px solid #9e9e9e;
      border-radius: 3px; }
      .contact__form-el--name, .contact__form-el--email {
        width: 47%;
        height: 50px; }
      .contact__form-el--message {
        width: 100%;
        height: 150px;
        margin: 20px 0 30px 0;
        padding-top: 15px;
        resize: none; }
    .contact__form input[type="submit"] {
      margin-left: auto;
      padding: 10px 50px; }
  @media (max-width: 991px) {
    .contact__heading {
      font-size: 48px; }
    .contact__wrapper {
      flex-direction: column;
      padding: 0;
      margin-top:90px; }
      .contact__wrapper::before {
        top: -45px;
        left: 0;
        right: 0;
        bottom: -45px; }
    .contact__visual {
      width: 600px;
      max-width: 75%;
      order: 2; }
    .contact__form {
      width: 600px;
      max-width: 75%;
      margin-bottom: 45px;
      padding: 0 15px; } }
  @media (max-width: 767px) {
    .contact__heading {
      font-size: 32px; }
    .contact__form-el--name, .contact__form-el--email {
      width: 100%; }
    .contact__form-el--name {
      margin-bottom: 10px; }
    .contact__form-el--message {
      margin: 10px 0 20px 0; } }
  @media (max-width: 480px) {
    /*.contact__wrapper::before {
      display: none; }*/
    .contact__visual {
      max-width: 90%; }
    .contact__form {
      max-width: 90%;
      padding: 0; }
      .contact__form-el--name, .contact__form-el--email {
        height: 40px; }
      .contact__form-el--message {
        height: 90px; } }

/************************* Footer ************************ */
.footer {
  position: relative;
  width: 100%;
  height: 100px;
  z-index:2; }
  .footer__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between; }
  .footer__logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
    .footer__logo img { width:80px; height:auto;}
  .footer__arrow {
    display: flex;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;color:#000000;  }
    .footer__arrow-el {
      width: 24px;
      fill: #000000;
      }
  @media (max-width: 767px) {
    .footer {
      height: 150px;
      padding: 30px 0; }
      .footer__wrapper {
        flex-direction: column; }
      .footer__copyright {
        order: 3; }
      .footer__logo {
        position: static;
        transform: translate(0, 0);
        order: 2; } }
		
/************************* Paralax ************************ */

#about > .parallax:nth-of-type(1) { background:url(/assets/img/bg_about.jpg) no-repeat fixed;

	margin: 0;
	/*background-size:cover;*/
	opacity:0.8;
    height: 100%;
    position:absolute;
    top:0px;left:0;
    width:100%;
}
#work .parallax { background:url(/assets/img/bg_work.jpg) no-repeat fixed;

	margin: 0;
	background-size:cover;
	opacity:0.8;
    height: 100%;
    position:absolute;
    top:0px;left:0;
    width:100%;
}

@media (max-width: 767px) {
	#about > .parallax:nth-of-type(1), #work .parallax {background-size:auto;}
	
}
		
@charset "UTF-8";
/* CSS Document */