/*
	MyDevTeam Boilerplate
*/
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

body {
  margin: 0; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
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 {
  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;
  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; }

/* ---------- */
/* set colors */
/* ---------- */
/* any hex must be named above */
/* custom pixels */
.grid:before, .timeline li:before, .timeline .bubble-wrap:before, .popup:before, .grid:after, .timeline li:after, .timeline .bubble-wrap:after, .popup:after {
  content: " ";
  display: table; }
.grid:after, .timeline li:after, .timeline .bubble-wrap:after, .popup:after {
  clear: both; }

@keyframes blink {
  50% {
    opacity: 0.0; } }
@-webkit-keyframes blink {
  50% {
    opacity: 0.0; } }
.blink {
  -webkit-animation: blink 1s step-start 0s infinite;
  -moz-animation: blink 1s step-start 0s infinite;
  animation: blink 1s step-start 0s infinite; }

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: none; }

a {
  color: #df104b;
  border-bottom: 1px solid #df104b;
  text-decoration: none; }
  a:visited {
    color: #df104b; }
  a:hover, a:focus, a:active {
    color: #df104b;
    border-color: #df104b; }
  a:focus, a:hover, a:active {
    outline: 0; }

html, body {
  min-height: 100%; }

body {
  margin: 0;
  padding: 0;
  background: #FFF;
  color: #000; }

hr {
  background-color: #999;
  border: 0;
  height: 1px;
  margin-bottom: 1.5em; }

/* headings */
h1, h2, h3, h4, h5, h6 {
  clear: both;
  margin-top: 0; }

h2, h3, h4, h5, h6 {
  padding: 0 0 0.5em 0; }

img {
  display: block;
  height: auto;
  width: 100%; }

/* lists */
ul, ol {
  margin: 0 0 1.5em 0; }
  ul li, ol li {
    margin-bottom: 1.5rem; }

ul {
  list-style: disc; }

ol {
  list-style: decimal; }

li > ul, li > ol {
  margin-bottom: 0;
  margin-left: 1.5em; }

dt {
  font-weight: bold; }

dd {
  margin: 0 1.5em 1.5em; }

/* table */
table {
  margin: 0 0 1.5em;
  width: 100%; }

/* copy */
p {
  margin: 0 0 1.5em 0; }

dfn, cite, em, i {
  font-style: italic; }

blockquote {
  margin: 0 1.5em 1.5em; }

address {
  margin: 0 0 1.5em; }

mark, ins {
  background: #999;
  text-decoration: none; }

big {
  font-size: 125%; }

small, small p {
  font-size: 85%; }

@font-face {
  font-family: 'GothamHTF-Medium';
  src: url("../fonts/GothamHTF-Medium.eot");
  src: url("../fonts/GothamHTF-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/GothamHTF-Medium.woff") format("woff"), url("../fonts/GothamHTF-Medium.ttf") format("truetype"), url("../fonts/GothamHTF-Medium.svg#GothamHTF-Medium") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'GothamHTF-Bold';
  src: url("../fonts/GothamHTF-Bold.eot");
  src: url("../fonts/GothamHTF-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/GothamHTF-Bold.woff") format("woff"), url("../fonts/GothamHTF-Bold.ttf") format("truetype"), url("../fonts/GothamHTF-Bold.svg#GothamHTF-Bold") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'GothamHTF-Light';
  src: url("../fonts/GothamHTF-Light.eot");
  src: url("../fonts/GothamHTF-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/GothamHTF-Light.woff") format("woff"), url("../fonts/GothamHTF-Light.ttf") format("truetype"), url("../fonts/GothamHTF-Light.svg#GothamHTF-Light") format("svg");
  font-weight: normal;
  font-style: normal; }
em, i, body, p, .gallery span, .gallery .caption, p.image span, p.image .caption, .rslides li span, .rslides li .caption {
  font-family: "GothamHTF-Light", Helvetica, Verdana, Arial, sans-serif;
  font-weight: normal;
  font-style: normal; }

strong, b, strong em, em strong, b i, i b, .intro, .intro p {
  font-family: "GothamHTF-Medium", Helvetica, Verdana, Arial, sans-serif;
  font-weight: normal;
  font-style: normal; }

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, .section h2, nav, #nav {
  font-family: "GothamHTF-Bold", Helvetica, Verdana, Arial, sans-serif;
  font-weight: normal;
  font-style: normal; }

html {
  font-size: 1.4vw; }
  @media only screen and (max-width: 480px) {
    html {
      font-size: 1.8vw; } }
  @media only screen and (min-width: 768px) {
    html {
      font-size: 1.4vw; } }
  @media only screen and (min-width: 1080px) {
    html {
      font-size: 1.1vw; } }
  @media only screen and (min-width: 1680px) {
    html {
      font-size: 1vw; } }

body, p {
  font-size: 25px;
  font-size: 2.5rem;
  line-height: 175%; }
  @media only screen and (min-width: 768px) {
    body, p {
      font-size: 15px;
      font-size: 1.5rem;
      line-height: 175%; } }
  @media only screen and (min-width: 1680px) {
    body, p {
      font-size: 12px;
      font-size: 1.2rem;
      line-height: 175%; } }

h1, h2, h3, h4, h5, h6 {
  text-transform: uppercase; }

h1, .h1 {
  font-size: 25px;
  font-size: 2.5rem;
  line-height: 150%; }

h2, .h2 {
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 125%; }

h3, .h3 {
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 135%; }

h4, .h4 {
  font-size: 10px;
  font-size: 1rem;
  line-height: 1.4em;
  color: #999;
  letter-spacing: 0.1em; }

h5, .h5 {
  font-size: 7px;
  font-size: 0.7rem;
  line-height: 1.5em;
  letter-spacing: 0.05em; }

blockquote {
  font-size: 130%;
  font-family: Georgia, Times New Roman, serif;
  font-style: italic; }

.entries h3, .services h3 {
  font-size: 0.9em; }
  .entries h3 a, .services h3 a {
    border-bottom: none; }
.entries article p, .services article p {
  font-size: 0.9em;
  line-height: 150%; }
@media only screen and (min-width: 1680px) {
  .entries h3, .entries article p, .services h3, .services article p {
    font-size: 0.8em; } }

.timeline h3 {
  font-size: 28px;
  font-size: 2.8rem;
  line-height: 150%;
  margin-bottom: 1rem; }
  @media only screen and (min-width: 768px) {
    .timeline h3 {
      font-size: 15px;
      font-size: 1.5rem;
      line-height: 150%; } }

#hero h1 {
  font-size: 40px;
  font-size: 4rem;
  line-height: 125%; }
#hero p {
  font-size: 28px;
  font-size: 2.8rem;
  line-height: 125%; }
@media only screen and (min-width: 1080px) {
  #hero h1 {
    font-size: 35px;
    font-size: 3.5rem;
    line-height: 100%; }
  #hero p {
    font-size: 25px;
    font-size: 2.5rem;
    line-height: 150%; } }

.section h2 {
  font-size: 20px;
  font-size: 2rem;
  line-height: 150%;
  letter-spacing: 0.1em; }
  @media only screen and (min-width: 768px) {
    .section h2 {
      font-size: 12px;
      font-size: 1.2rem;
      line-height: 150%; } }

nav, #nav {
  font-size: 30px;
  font-size: 3rem;
  line-height: 110%;
  text-transform: uppercase; }
  @media only screen and (min-width: 768px) {
    nav, #nav {
      font-size: 20px;
      font-size: 2rem;
      line-height: 100%; } }

.intro, .intro p {
  font-size: 125%; }

.gallery span, .gallery .caption, p.image span, p.image .caption, .rslides li span, .rslides li .caption {
  display: block;
  font-size: 80%; }

footer p {
  font-size: 80%; }

/* Mobile */
@media only screen and (max-width: 480px) {
  h1, .h1 {
    font-size: 30px;
    font-size: 3rem;
    line-height: 125%; }

  h2, .h2 {
    font-size: 28px;
    font-size: 2.8rem;
    line-height: 125%; }

  h3, .h3 {
    font-size: 22.5px;
    font-size: 2.25rem;
    line-height: 125%; }

  h4, .h4 {
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 1.4em; }

  h5, .h5 {
    font-size: 9px;
    font-size: 0.9rem;
    line-height: 1.5em; } }
.has-text-centered {
  text-align: center; }

form .form-row {
  position: relative;
  margin-bottom: 1.5rem; }
  form .form-row i {
    z-index: 15;
    position: absolute;
    top: 50%;
    right: 5%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    transform: translate(0, -50%);
    -o-transform: translate(0, -50%); }

label {
  text-transform: uppercase;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 150%; }

button, .button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  border-style: none;
  background: #df104b;
  color: #FFF;
  padding: 13px 25px 11px 25px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  text-decoration: none;
  transition: all .1s linear;
  -o-transition: all .1s linear;
  -moz-transition: all .1s linear;
  -webkit-transition: all .1s linear; }
  button:hover, .button:hover,
  input[type="button"]:hover,
  input[type="reset"]:hover,
  input[type="submit"]:hover {
    opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$opac)";
    filter: alpha(opacity=80); }

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  /*border: 1px solid $border-input;*/
  color: #000;
  width: 100%;
  padding: 1rem 10px 0.9rem 10px;
  background: #eeeeee;
  border: 0; }
  input[type="text"]:focus,
  input[type="email"]:focus,
  input[type="url"]:focus,
  input[type="password"]:focus,
  input[type="search"]:focus,
  textarea:focus {
    color: #df104b; }

textarea {
  padding: 0.8rem 10px 0.5rem 10px;
  max-width: 100%;
  height: 220px; }

.form-error {
  margin-top: 1em;
  font-size: 80%;
  color: #df104b;
  display: none; }

::-webkit-input-placeholder {
  color: #999; }

::-moz-placeholder {
  color: #999; }

:-ms-input-placeholder {
  color: #999; }

input:-moz-placeholder {
  color: #999; }

.container, header {
  width: 100%;
  padding: 15px 3%;
  overflow: hidden;
  max-width: 1680px;
  margin: 0 auto; }

.grid {
  width: 100%;
  margin: 0;
  padding: 0; }
  @media only screen and (min-width: 1080px) {
    .grid .col25 {
      width: 25%; }
    .grid .col33 {
      width: 33.333333%; }
    .grid .col35 {
      width: 35%; }
    .grid .col50 {
      width: 50%; }
    .grid .col65 {
      width: 65%; }
    .grid .col70 {
      width: 70%; }
    .grid .col75 {
      width: 75%; }
    .grid .col100 {
      width: 100%; } }
  .grid .image img {
    padding: 10px 0; }
    @media only screen and (min-width: 1080px) {
      .grid .image img {
        padding: 15px 0; } }
  .grid .col-profile.centered {
    float: none;
    margin-left: auto;
    margin-right: auto; }

[class*='col'] {
  float: left;
  width: 100%;
  padding: 15px; }
  @media only screen and (min-width: 1080px) {
    [class*='col'] {
      padding: 45px 15px; }
      [class*='col'] p:last-child, [class*='col'] ul:last-child, [class*='col'] h1:last-child, [class*='col'] .image:last-child {
        padding-bottom: 0;
        margin-bottom: 0; }
      [class*='col'].centered {
        float: none;
        margin-left: auto;
        margin-right: auto; } }
  @media only screen and (min-width: 1680px) {
    [class*='col'] {
      padding: 60px 30px; } }

#instagramImages [class*='col'] {
  padding: 0; }

.gallery [class*='col'] {
  padding: 10px; }

.gallery-item img {
  border-radius: 8px; }

.col-profile {
  width: 60%; }
  @media only screen and (min-width: 1080px) {
    .col-profile {
      width: 40%; } }
  @media only screen and (min-width: 1680px) {
    .col-profile {
      width: 30%; } }

@media only screen and (min-width: 768px) {
  .extra-hpad {
    padding-left: 15px;
    padding-right: 15px; } }
@media only screen and (min-width: 1080px) {
  .extra-hpad {
    padding-left: 60px;
    padding-right: 60px; } }

@media only screen and (min-width: 768px) {
  .extra-vpad {
    padding-top: 15px;
    padding-bottom: 15px; } }
@media only screen and (min-width: 1080px) {
  .extra-vpad {
    padding-top: 60px;
    padding-bottom: 60px; } }

.iframe, .video {
  margin-bottom: 3%;
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 2.381rem;
  height: 0; }
  .iframe iframe, .iframe embed, .iframe object, .video iframe, .video embed, .video object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.rslides {
  width: 100%;
  padding: 0;
  margin: 0;
  position: relative;
  list-style: none;
  overflow: hidden; }
  .rslides li {
    -webkit-backface-visibility: hidden;
    position: absolute;
    display: none;
    width: 100%;
    left: 0;
    top: 0; }
    .rslides li:first-child {
      position: relative;
      display: block;
      float: left; }

#main img {
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out; }

#main .shrinked {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$opac)";
  filter: alpha(opacity=0);
  -webkit-transform: scale(0.97);
  -moz-transform: scale(0.97);
  transform: scale(0.97);
  -o-transform: scale(0.97); }

.text-left {
  text-align: left; }

.text-center {
  text-align: center; }

.text-right {
  text-align: right; }

.pointer {
  cursor: pointer; }

#vid {
  width: 100%;
  border-radius: 8px; }

.vid-caption {
  margin-top: 1rem; }

.site-loader {
  position: fixed;
  width: 100%;
  height: 100vh;
  background: #FFF;
  z-index: 99999; }

/* any preloader goes here */
/*
* Infinite Loader 
*
* Author: Jonathan Silva
* Url: http://portfolio.jonathansilva.com.br
*
*/
/* ----- Base ----- */
/* ----- Loader ----- */
.loader-wrapper {
  width: 148px;
  height: 100px;
  position: absolute;
  margin: -50px 0 0 -74px;
  left: 50%;
  top: 50%; }

.loader {
  width: 148px;
  height: 100px;
  top: 0;
  left: 0;
  position: absolute; }

.loader:after {
  content: "";
  top: auto;
  position: absolute;
  display: block;
  -webkit-animation: shadow 1.2s infinite linear;
  -moz-animation: shadow 1.2s infinite linear;
  animation: shadow 1.2s infinite linear;
  bottom: 0em;
  left: 0;
  height: .25em;
  width: 1em;
  border-radius: 50%;
  background-color: #034466;
  opacity: 0.3; }

.roller,
.roller:last-child {
  width: 70px;
  height: 70px;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-animation: rollercoaster 1.2s infinite linear;
  -webkit-transform: rotate(135deg);
  -moz-animation: rollercoaster 1.2s infinite linear;
  -moz-transform: rotate(135deg);
  animation: rollercoaster 1.2s infinite linear;
  transform: rotate(135deg); }

.roller:last-child {
  left: auto;
  right: 0;
  -webkit-transform: rotate(-45deg);
  -webkit-animation: rollercoaster2 1.2s infinite linear;
  -moz-transform: rotate(-45deg);
  -moz-animation: rollercoaster2 1.2s infinite linear;
  transform: rotate(-45deg);
  animation: rollercoaster2 1.2s infinite linear; }

.roller:before,
.roller:last-child:before {
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  background: #df104b;
  border-radius: 50%; }

@-webkit-keyframes rollercoaster {
  0% {
    -webkit-transform: rotate(135deg); }
  8% {
    -webkit-transform: rotate(240deg); }
  20% {
    -webkit-transform: rotate(300deg); }
  40% {
    -webkit-transform: rotate(380deg); }
  45% {
    -webkit-transform: rotate(440deg); }
  50% {
    -webkit-transform: rotate(495deg);
    opacity: 1; }
  50.1% {
    -webkit-transform: rotate(495deg);
    opacity: 0; }
  100% {
    -webkit-transform: rotate(495deg);
    opacity: 0; } }
@-webkit-keyframes rollercoaster2 {
  0% {
    opacity: 0; }
  49.9% {
    opacity: 0; }
  50% {
    opacity: 1;
    -webkit-transform: rotate(-45deg); }
  58% {
    -webkit-transform: rotate(-160deg); }
  70% {
    -webkit-transform: rotate(-240deg); }
  80% {
    -webkit-transform: rotate(-300deg); }
  90% {
    -webkit-transform: rotate(-340deg); }
  100% {
    -webkit-transform: rotate(-405deg); } }
@-webkit-keyframes shadow {
  0% {
    opacity: .3;
    -webkit-transform: translateX(65px) scale(0.5, 0.5); }
  8% {
    -webkit-transform: translateX(30px) scale(2, 2); }
  13% {
    -webkit-transform: translateX(0px) scale(1.3, 1.3); }
  30% {
    -webkit-transform: translateX(-15px) scale(0.5, 0.5);
    opacity: 0.1; }
  50% {
    -webkit-transform: translateX(60px) scale(1.2, 1.2);
    opacity: 0.3; }
  60% {
    -webkit-transform: translateX(130px) scale(2, 2);
    opacity: 0.05; }
  65% {
    -webkit-transform: translateX(145px) scale(1.2, 1.2); }
  80% {
    -webkit-transform: translateX(120px) scale(0.5, 0.5);
    opacity: 0.1; }
  90% {
    -webkit-transform: translateX(80px) scale(0.8, 0.8); }
  100% {
    -webkit-transform: translateX(60px);
    opacity: 0.3; } }
/* Moz */
@-moz-keyframes rollercoaster {
  0% {
    -moz-transform: rotate(135deg); }
  8% {
    -moz-transform: rotate(240deg); }
  20% {
    -moz-transform: rotate(300deg); }
  40% {
    -moz-transform: rotate(380deg); }
  45% {
    -moz-transform: rotate(440deg); }
  50% {
    -moz-transform: rotate(495deg);
    opacity: 1; }
  50.1% {
    -moz-transform: rotate(495deg);
    opacity: 0; }
  100% {
    -moz-transform: rotate(495deg);
    opacity: 0; } }
@-moz-keyframes rollercoaster2 {
  0% {
    opacity: 0; }
  49.9% {
    opacity: 0; }
  50% {
    opacity: 1;
    -moz-transform: rotate(-45deg); }
  58% {
    -moz-transform: rotate(-160deg); }
  70% {
    -moz-transform: rotate(-240deg); }
  80% {
    -moz-transform: rotate(-300deg); }
  90% {
    -moz-transform: rotate(-340deg); }
  100% {
    -moz-transform: rotate(-405deg); } }
@-moz-keyframes shadow {
  0% {
    opacity: .3;
    -moz-transform: translateX(65px) scale(0.5, 0.5); }
  8% {
    -moz-transform: translateX(30px) scale(2, 2); }
  13% {
    -moz-transform: translateX(0px) scale(1.3, 1.3); }
  30% {
    -moz-transform: translateX(-15px) scale(0.5, 0.5);
    opacity: 0.1; }
  50% {
    -moz-transform: translateX(60px) scale(1.2, 1.2);
    opacity: 0.3; }
  60% {
    -moz-transform: translateX(130px) scale(2, 2);
    opacity: 0.05; }
  65% {
    -moz-transform: translateX(145px) scale(1.2, 1.2); }
  80% {
    -moz-transform: translateX(120px) scale(0.5, 0.5);
    opacity: 0.1; }
  90% {
    -moz-transform: translateX(80px) scale(0.8, 0.8); }
  100% {
    -moz-transform: translateX(60px);
    opacity: 0.3; } }
/* No-prefix */
@keyframes rollercoaster {
  0% {
    transform: rotate(135deg); }
  8% {
    transform: rotate(240deg); }
  20% {
    transform: rotate(300deg); }
  40% {
    transform: rotate(380deg); }
  45% {
    transform: rotate(440deg); }
  50% {
    transform: rotate(495deg);
    opacity: 1; }
  50.1% {
    transform: rotate(495deg);
    opacity: 0; }
  100% {
    transform: rotate(495deg);
    opacity: 0; } }
@keyframes rollercoaster2 {
  0% {
    opacity: 0; }
  49.9% {
    opacity: 0; }
  50% {
    opacity: 1;
    transform: rotate(-45deg); }
  58% {
    transform: rotate(-160deg); }
  70% {
    transform: rotate(-240deg); }
  80% {
    transform: rotate(-300deg); }
  90% {
    transform: rotate(-340deg); }
  100% {
    transform: rotate(-405deg); } }
@keyframes shadow {
  0% {
    opacity: .3;
    transform: translateX(65px) scale(0.5, 0.5); }
  8% {
    transform: translateX(30px) scale(2, 2); }
  13% {
    transform: translateX(0px) scale(1.3, 1.3); }
  30% {
    transform: translateX(-15px) scale(0.5, 0.5);
    opacity: 0.1; }
  50% {
    transform: translateX(60px) scale(1.2, 1.2);
    opacity: 0.3; }
  60% {
    transform: translateX(130px) scale(2, 2);
    opacity: 0.05; }
  65% {
    transform: translateX(145px) scale(1.2, 1.2); }
  80% {
    transform: translateX(120px) scale(0.5, 0.5);
    opacity: 0.1; }
  90% {
    transform: translateX(80px) scale(0.8, 0.8); }
  100% {
    transform: translateX(60px);
    opacity: 0.3; } }
#loader2:after {
  -webkit-animation-delay: 0.15s;
  animation-delay: 0.15s; }

#loader2 .roller {
  -webkit-animation-delay: 0.15s;
  animation-delay: 0.15s; }

#loader3:after {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s; }

#loader3 .roller {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s; }

.corners {
  border: 0;
  margin: 0;
  padding: 0;
  display: block;
  position: fixed;
  z-index: 100;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer; }

#mydevteam {
  top: 15px;
  left: 0;
  margin-left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 40px;
  background: url("../img/logo_new.png") top left no-repeat;
  z-index: 1000 !important;
  background-size: cover; }
  @media only screen and (min-width: 768px) {
    #mydevteam {
      top: 30px;
      width: 70px;
      height: 70px; } }

#about {
  bottom: 20px;
  left: 5%;
  width: 31px;
  height: 30px;
  background: url("../img/ico-about.png") top left no-repeat;
  background-size: cover; }
  @media only screen and (min-width: 768px) {
    #about {
      bottom: 30px;
      width: 51px;
      height: 50px; } }
  @media only screen and (min-width: 1080px) {
    #about {
      bottom: 45px; } }

#connect {
  bottom: 20px;
  right: 5%;
  width: 29px;
  height: 30px;
  background: url("../img/ico-connect.png") top left no-repeat;
  background-size: cover; }
  @media only screen and (min-width: 768px) {
    #connect {
      bottom: 30px;
      width: 49px;
      height: 51px; } }
  @media only screen and (min-width: 1080px) {
    #connect {
      bottom: 45px; } }

main {
  position: relative; }

/* alternate */
.section.alternate {
  background: #91af82;
  color: #FFF; }
  .section.alternate a {
    color: #FFF;
    border-color: #FFF; }

.swiper-container,
.cont {
  height: 700px;
  width: 100%; }
  .swiper-container .swiper-slide,
  .cont .swiper-slide {
    width: auto;
    margin-right: 1.5rem; }
  .swiper-container img,
  .swiper-container video,
  .cont img,
  .cont video {
    height: 550px;
    width: auto;
    border-radius: 8px; }
    @media only screen and (max-width: 959px) {
      .swiper-container img,
      .swiper-container video,
      .cont img,
      .cont video {
        padding: 0 1rem; } }

.caption {
  width: 0;
  min-width: 100%;
  height: 150px;
  margin-top: 1rem;
  color: black; }
  .caption p {
    font-size: 16.63px;
    line-height: 150%; }

.swiper-container-square,
.cont-square {
  height: 65%;
  width: 100%; }
  .swiper-container-square img,
  .swiper-container-square video,
  .cont-square img,
  .cont-square video {
    height: 330px;
    width: 100%;
    border-radius: 8px;
    object-fit: cover; }

.swiper-container-landscape,
.cont-landscape {
  height: 65%; }
  .swiper-container-landscape img,
  .swiper-container-landscape video,
  .cont-landscape img,
  .cont-landscape video {
    height: 300px;
    width: 100%;
    border-radius: 8px;
    object-fit: cover; }

.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-button-prev:after,
.swiper-button-next:after {
  content: ''; }

.square-img {
  height: 250px;
  text-align: center; }
  .square-img h3, .square-img .h3 {
    line-height: 2;
    margin-bottom: 0; }
  @media only screen and (min-width: 768px) {
    .square-img {
      height: auto; } }
  .square-img img {
    max-height: 500px;
    max-width: 500px;
    margin: 0 auto;
    border-radius: 8px;
    object-fit: cover; }

.right-icon {
  position: absolute;
  right: 0;
  margin-top: 1rem;
  margin-right: 1rem; }

.marquee {
  height: 100px;
  width: 100%;
  overflow: hidden;
  position: relative; }

.marquee div {
  display: block;
  width: 200%;
  height: 100px;
  position: absolute;
  overflow: hidden;
  animation: marquee 20s linear infinite; }
  @media only screen and (max-width: 900px) {
    .marquee div {
      height: 50px; } }

.marquee span {
  float: left;
  width: auto;
  color: #df104b;
  font-size: 40px;
  font-size: 4rem;
  line-height: 125%; }
  .marquee span h2 {
    color: #df104b; }
  .marquee span h2 {
    font-size: 40px;
    font-size: 4rem;
    line-height: 125%; }

@media only screen and (max-width: 900px) {
  .marquee-mobile {
    height: 100px;
    width: 100%;
    overflow: hidden;
    position: relative; } }
.marquee-mobile button, .marquee-mobile span, .marquee-mobile h2, .marquee-mobile a {
  background: none;
  text-decoration: none;
  border: none;
  color: #df104b;
  font-size: 40px;
  font-size: 4rem;
  line-height: 125%;
  font-family: "GothamHTF-Bold", Helvetica, Verdana, Arial, sans-serif;
  text-transform: uppercase; }
.marquee-mobile span {
  margin: 0 1rem; }

@media only screen and (max-width: 900px) {
  .marquee-mobile div {
    display: block;
    width: 200%;
    height: 50px;
    position: absolute;
    overflow: hidden;
    animation: marquee 20s linear infinite; } }

@keyframes marquee {
  0% {
    left: 0; }
  100% {
    left: -100%; } }
@media only screen and (max-width: 480px) {
  .blocks .entry.col25 {
    width: 50%;
    text-align: center;
    padding: 5px !important; } }
@media only screen and (min-width: 768px) {
  .blocks .entry.col25 {
    width: 25%;
    text-align: center; } }

@media only screen and (max-width: 480px) {
  .team .entry.col50 {
    width: 50%;
    text-align: center;
    padding: 5px !important; } }
@media only screen and (min-width: 768px) {
  .team .entry.col50 {
    width: 50%;
    text-align: center;
    min-height: 820px; } }
@media only screen and (max-width: 480px) {
  .team .square-img {
    min-height: 300px; } }

.height0 {
  height: 0 !important; }

.filter-div {
  text-align: center;
  margin: 0 auto 4rem;
  display: flex; }
  @media only screen and (min-width: 900px) {
    .filter-div {
      width: fit-content; } }
  .filter-div button, .filter-div span, .filter-div h2, .filter-div a {
    background: none;
    text-decoration: none;
    border: none;
    color: #df104b;
    font-size: 40px;
    font-size: 4rem;
    line-height: 125%;
    font-family: "GothamHTF-Bold", Helvetica, Verdana, Arial, sans-serif;
    text-transform: uppercase; }
  .filter-div span {
    margin: 0 1rem; }

@media only screen and (min-width: 900px) {
  .sticky {
    position: fixed;
    z-index: 90;
    top: 0;
    left: 0;
    width: 100%;
    margin-top: 2.3rem;
    transition: top 2s linear; }
    .sticky div {
      margin: auto; }
    .sticky a, .sticky span {
      font-size: 2.5rem; } }

.role {
  height: 100px; }
  @media only screen and (max-width: 480px) {
    .role {
      height: 70px;
      font-size: 1.5rem; } }

.mb-5 {
  margin-bottom: 1.5rem !important; }

.mt-75 {
  margin-top: 0.8rem; }

.extra-pd-1 {
  padding: 0 1rem; }
  @media only screen and (min-width: 768px) {
    .extra-pd-1 {
      margin-top: 10%; } }
  @media only screen and (min-width: 1080px) {
    .extra-pd-1 {
      margin-top: 12.5%; } }
  .extra-pd-1 p {
    font-size: 2.25rem; }
    @media only screen and (min-width: 768px) {
      .extra-pd-1 p {
        font-size: 1.125rem; } }

.title-absolute {
  position: fixed;
  left: 0;
  top: 0;
  margin-left: 17.5%;
  transform: translateX(-50%);
  margin-top: 4.5rem;
  font-size: 2rem;
  color: #e13354;
  margin-top: 25px;
  z-index: 100; }
  @media only screen and (min-width: 768px) {
    .title-absolute {
      margin-left: 12.5%;
      margin-top: 40px; } }
  @media only screen and (min-width: 1680px) {
    .title-absolute {
      margin-left: 13.5%; } }

.magenta {
  color: #e13354; }

.swiper-wrapper.overflow-x-auto {
  width: 100%;
  display: flex;
  overflow-x: auto;
  overflow-y: hidden; }
  .swiper-wrapper.overflow-x-auto .col33 {
    flex: none;
    width: 91.66667%; }
  @media only screen and (min-width: 768px) {
    .swiper-wrapper.overflow-x-auto .col33 {
      flex: none;
      width: 33.3333%; } }

.post-content {
  cursor: url("../../assets/img/news.png"), pointer; }

a[target="_blank"] {
  cursor: url("../../assets/img/door.png"), pointer; }

a {
  cursor: url("../../assets/img/eye.png"), pointer; }

.swiper-slide {
  cursor: url("../../assets/img/leftright.png"), auto; }

/* width */
::-webkit-scrollbar {
  width: 5px;
  height: 10px; }

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; }

/* Handle */
::-webkit-scrollbar-thumb {
  background: #e13354; }

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #c01f3d; }

.testi-container {
  background-image: url("https://images.ctfassets.net/x0jjbiyv191q/1vzZWHAdYx0RoNCJyvqlWU/60c3e2c93b791c555ae56f0f24741d0b/mdt_logo_2020-03_transparent.png");
  background-size: 33%;
  background-position: center center;
  background-repeat: no-repeat; }

#testi {
  display: none; }
  @media only screen and (min-width: 768px) {
    #testi {
      display: block; } }

.mobile-testi {
  display: block; }
  @media only screen and (min-width: 768px) {
    .mobile-testi {
      display: none; } }
  .mobile-testi li {
    height: 200px;
    padding-top: 8rem; }

.mb-6 {
  margin-bottom: 6rem; }

.clients .col33.client-img {
  text-align: center; }
  @media only screen and (max-width: 480px) {
    .clients .col33.client-img {
      width: 50%; } }
.clients .col33 .image {
  margin-bottom: 1rem;
  background-color: #fff;
  box-shadow: 3px 3px 11px -5px rgba(158, 158, 158, 0.35);
  -webkit-box-shadow: 3px 3px 11px -5px rgba(158, 158, 158, 0.35);
  -moz-box-shadow: 3px 3px 11px -5px rgba(158, 158, 158, 0.35); }

footer {
  margin-top: 0;
  text-align: center;
  color: #000;
  transition: all .1s linear;
  -o-transition: all .1s linear;
  -moz-transition: all .1s linear;
  -webkit-transition: all .1s linear;
  opacity: 0.7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$opac)";
  filter: alpha(opacity=70); }
  footer:hover {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$opac)";
    filter: alpha(opacity=100); }

#enquiry {
  margin-top: 1.5rem; }
  #enquiry form {
    margin-top: 1.5rem; }

#btn-nav, .btn-close {
  cursor: pointer;
  display: block;
  position: fixed;
  top: 25px;
  right: 5%;
  border: 0;
  width: 30px;
  height: 20px;
  text-align: center;
  z-index: 100;
  outline: none; }
  @media only screen and (min-width: 1080px) {
    #btn-nav, .btn-close {
      top: 65px; } }
  #btn-nav span, .btn-close span {
    background: #df104b;
    display: block;
    width: 100%;
    height: 4px;
    margin-bottom: 4px;
    -webkit-transition: all 0.5s linear;
    transition: all 0.3s linear; }
  #btn-nav .half, .btn-close .half {
    width: 50%;
    margin-right: 0;
    margin-left: auto; }
  #btn-nav .three-quarter, .btn-close .three-quarter {
    width: 75%;
    margin-right: 0;
    margin-left: auto; }
  @media only screen and (min-width: 768px) {
    #btn-nav, .btn-close {
      top: 50px;
      width: 40px;
      height: 30px; }
      #btn-nav span, .btn-close span {
        height: 5px;
        margin-bottom: 5px; } }
  #btn-nav.open span:nth-child(1), #btn-nav.open span:nth-child(3), .btn-close.open span:nth-child(1), .btn-close.open span:nth-child(3) {
    transform: translate(0px, 13px) rotate(-45deg) scalex(1.3);
    margin: 0;
    width: 100%; }
  #btn-nav.open span:nth-child(2), .btn-close.open span:nth-child(2) {
    height: 0;
    margin: 0; }
  #btn-nav.open span:nth-child(3), .btn-close.open span:nth-child(3) {
    transform: translate(0px, 9px) rotate(45deg) scalex(1.3); }

#nav-wrap {
  overflow-y: scroll;
  position: fixed;
  z-index: 80;
  background: #FFF;
  width: 100%;
  height: 100vh;
  text-align: center;
  -moz-animation-fill-mode: forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -moz-transform-origin: 50% 0;
  -ms-transform-origin: 50% 0;
  -webkit-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -moz-transform: translate3d(0, -100%, 0);
  -ms-transform: translate3d(0, -100%, 0);
  -webkit-transform: translate3d(0, -100%, 0);
  transform: translate3d(0, -100%, 0);
  -moz-transition: 0.4s;
  -o-transition: 0.4s;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -moz-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out; }
  #nav-wrap.in {
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -moz-transform-origin: 50% 0;
    -ms-transform-origin: 50% 0;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
  #nav-wrap nav, #nav-wrap #nav {
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%); }
    #nav-wrap nav li, #nav-wrap #nav li {
      margin-bottom: 0.8em; }
    #nav-wrap nav a, #nav-wrap #nav a {
      border: 0;
      display: inline-block;
      color: #000; }
      #nav-wrap nav a:hover, #nav-wrap #nav a:hover {
        color: #df104b; }
    #nav-wrap nav .socials, #nav-wrap #nav .socials {
      padding-top: 2rem; }

.socials a {
  display: inline-block;
  margin-left: 0.3em;
  border-bottom: 0; }

/* custom */
body {
  -webkit-transition: background-color 0.8s ease;
  -moz-transition: background-color 0.8s ease;
  transition: background-color 0.8s ease;
  -o-transition: background-color 0.8s ease;
  height: 100%; }

body.night {
  background-color: #0a0a32;
  color: #FFF; }
  body.night .timeline .bubble {
    background: rgba(0, 0, 0, 0.3) !important; }

/* partials */
#hero {
  width: 100%;
  height: 100vh;
  text-align: center;
  overflow: hidden; }
  #hero .container {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%); }
  @media only screen and (min-width: 1080px) {
    #hero .col65 {
      width: 85%; } }
  @media only screen and (min-width: 1680px) {
    #hero .col65 {
      width: 65%; } }
  #hero h1 {
    color: #df104b; }

.section {
  text-align: center; }

.timeline {
  list-style: none; }
  .timeline .image {
    margin-bottom: 2em;
    width: 100%;
    float: left;
    clear: both; }
    .timeline .image.double img {
      width: 48%;
      float: left; }
      .timeline .image.double img:first-child {
        margin-right: 2%; }
      .timeline .image.double img:last-child {
        margin-left: 2%; }
  .timeline .bubble-wrap {
    clear: both;
    float: left;
    width: 100%; }
  .timeline .bubble {
    position: relative;
    background: rgba(238, 238, 238, 0.8) !important;
    background: #fff;
    /* ie */
    width: 95%;
    padding: 30px;
    margin: 15px auto;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    /* fade animation */
    opacity: 0;
    -webkit-transition: opacity 1.5s, transform 1s ease;
    -o-transition: opacity 1.5s, transform 1s ease;
    transition: opacity 1.5s, transform 1s ease;
    -webkit-transform-style: preserve-3d;
    -webkit-transform: translate(0, 60px);
    -moz-transform: translate(0, 60px);
    transform: translate(0, 60px);
    -o-transform: translate(0, 60px); }
    @media only screen and (min-width: 768px) {
      .timeline .bubble {
        width: 75%;
        padding: 30px 45px;
        margin: 30px auto; } }
    @media only screen and (min-width: 1080px) {
      .timeline .bubble {
        width: 80%;
        padding: 60px 80px;
        margin: 45px auto; } }
    @media only screen and (min-width: 1680px) {
      .timeline .bubble {
        width: 85%;
        margin: 60px auto; } }
    @media only screen and (max-width: 480px) {
      .timeline .bubble {
        font-size: 80%; } }
    .timeline .bubble::before {
      position: absolute;
      bottom: 15px;
      left: -20px;
      width: 20px;
      height: 17px;
      content: '';
      background: url("../img/bubble-arrow-left.png") top right no-repeat;
      background-size: cover;
      z-index: 2;
      opacity: 0.8;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$opac)";
      filter: alpha(opacity=80); }
      @media only screen and (min-width: 1080px) {
        .timeline .bubble::before {
          left: -45px;
          width: 45px;
          height: 38px; } }
    .timeline .bubble.animate-this {
      opacity: 1;
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      transform: translate(0, 0);
      -o-transform: translate(0, 0); }
  .timeline .breadcrumb {
    width: 100%;
    margin-bottom: 1em; }
    .timeline .breadcrumb a {
      color: #000;
      border-color: #000; }
  .timeline .float-left {
    float: left; }
  .timeline .float-right {
    float: right;
    text-align: right; }
  .timeline .float-middle {
    text-align: center; }
  .timeline .bubble.float-middle {
    background: transparent !important; }
    .timeline .bubble.float-middle::before {
      background: none; }
  .timeline .bubble.float-right::before {
    left: auto;
    right: -20px;
    background-image: url("../img/bubble-arrow-right.png"); }
    @media only screen and (min-width: 1080px) {
      .timeline .bubble.float-right::before {
        right: -45px;
        width: 45px; } }

main .image, article .image, .entry .image {
  margin-bottom: 1rem; }
@media only screen and (min-width: 1080px) {
  main .image, article .image, .entry .image {
    margin-bottom: 6rem; } }
main .back, article .back, .entry .back {
  border-bottom: none; }

@media only screen and (min-width: 1080px) {
  .entries article .image {
    margin-bottom: 1rem; } }
.entries .info {
  padding: 0.5em 5% 0 5%; }
@media only screen and (min-width: 1080px) {
  .entries .info {
    padding: 0 5%; } }

.single article {
  padding-top: 3.5em; }
  .single article h2, .single article h3, .single article h4, .single article h5, .single article h6 {
    padding-bottom: 0; }
  .single article h2, .single article h3 {
    margin-top: 4rem; }
  .single article h2:first-child {
    margin-top: 0; }
  @media only screen and (min-width: 768px) {
    .single article {
      padding-top: 5em; }
      .single article h2 {
        padding-left: 5%;
        padding-right: 5%;
        margin-bottom: 1.5em; }
      .single article p, .single article h3 {
        padding-left: 10%;
        padding-right: 5%; }
      .single article ul, .single article ol {
        margin-left: 0;
        padding-left: 10%;
        padding-right: 5%; }
      .single article h2, .single article h3 {
        margin-top: 5rem; }
      .single article .intro p, .single article .roles p, .single article h3 {
        padding-left: 0;
        max-width: 100%; } }

.popup {
  display: none;
  background: rgba(224, 224, 224, 0.95) !important;
  background: white;
  border: 2px solid #df104b;
  padding: 30px;
  position: fixed;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 150; }
  .popup .popup-content {
    padding-top: 2em; }
  .popup .popup-close {
    position: absolute;
    top: 1%;
    right: 5%;
    font-size: 50px;
    font-size: 5rem;
    line-height: 1.2em;
    font-family: Garamond;
    border-bottom: none; }
  @media only screen and (min-width: 768px) {
    .popup {
      bottom: 60px;
      right: 60px;
      max-width: 480px;
      height: auto;
      padding: 45px 60px 30px 60px; }
      .popup .popup-close {
        top: 3%; } }

#popup-enquiry {
  bottom: 0;
  right: 0; }
  @media only screen and (min-width: 768px) {
    #popup-enquiry {
      bottom: 30px;
      right: 60px; } }

.imlost {
  padding: 5rem 0; }
  .imlost h1 {
    font-size: 12vw; }

/* layouts */
#home-preview {
  display: none; }
  @media only screen and (min-width: 1080px) {
    #home-preview {
      display: block; } }
  #home-preview .imac {
    position: relative; }
    #home-preview .imac .image img {
      padding: 0 !important; }
  #home-preview .iframe {
    position: absolute;
    top: 9.2%;
    left: 5%;
    width: 90%;
    padding-bottom: 48.75%; }
    @media only screen and (min-width: 1680px) {
      #home-preview .iframe {
        top: 9.5%;
        padding-bottom: 48%; } }

.services .entry.col33 {
  width: 50%;
  text-align: center; }
  .services .entry.col33 .image {
    margin-bottom: 1rem; }
  @media only screen and (min-width: 768px) {
    .services .entry.col33 {
      min-height: 12em; } }
  @media only screen and (min-width: 1080px) {
    .services .entry.col33 {
      width: 33.333333%; } }
  .services .entry.col33 .info h3 {
    height: 2em; }
  .services .entry.col33 .info p {
    height: 3em;
    font-size: 0.7em;
    line-height: 150%; }

.overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100vh;
  background: white;
  overflow: hidden;
  z-index: 50; }

.entries.project .post-item .btn-close, .entries.post .post-item .btn-close {
  display: none; }
.entries.project .post-item .post-content, .entries.post .post-item .post-content {
  overflow: hidden; }
.entries.project .post-item .post-description, .entries.post .post-item .post-description {
  display: none; }
.entries.project .post-item .featured-image, .entries.post .post-item .featured-image {
  text-align: center;
  position: relative; }
.entries.project .post-item:hover, .entries.post .post-item:hover {
  cursor: pointer; }
  .entries.project .post-item:hover .read-more, .entries.post .post-item:hover .read-more {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=$opac)";
    filter: alpha(opacity=100); }
  .entries.project .post-item:hover h2, .entries.project .post-item:hover h3, .entries.post .post-item:hover h2, .entries.post .post-item:hover h3 {
    color: #df104b; }
.entries.project .post-item.active, .entries.post .post-item.active {
  cursor: default; }
  .entries.project .post-item.active h3, .entries.post .post-item.active h3 {
    font-size: 120%;
    margin-top: 2rem; }
  .entries.project .post-item.active .post-head p, .entries.post .post-item.active .post-head p {
    font-size: 110%;
    padding: 4rem 1rem;
    text-align: left; }
  .entries.project .post-item.active ol li, .entries.project .post-item.active ul li, .entries.post .post-item.active ol li, .entries.post .post-item.active ul li {
    font-size: 80%;
    margin-bottom: 2rem; }
  .entries.project .post-item.active .post-head, .entries.project .post-item.active .post-description, .entries.project .post-item.active .featured-image, .entries.post .post-item.active .post-head, .entries.post .post-item.active .post-description, .entries.post .post-item.active .featured-image {
    width: 100%;
    margin-left: 50%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0); }
  .entries.project .post-item.active .btn-close, .entries.post .post-item.active .btn-close {
    display: block; }
  .entries.project .post-item.active .post-description, .entries.post .post-item.active .post-description {
    display: block; }
    .entries.project .post-item.active .post-description p, .entries.post .post-item.active .post-description p {
      text-align: left; }
  .entries.project .post-item.active .extra-vpad, .entries.post .post-item.active .extra-vpad {
    padding-top: 0;
    padding-bottom: 0; }
  .entries.project .post-item.active .post-content, .entries.post .post-item.active .post-content {
    width: 100%;
    padding: 8rem 4rem;
    overflow-y: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0; }
  @media only screen and (min-width: 768px) {
    .entries.project .post-item.active .featured-image, .entries.post .post-item.active .featured-image {
      width: 85%; }
    .entries.project .post-item.active .post-head, .entries.project .post-item.active .post-description, .entries.post .post-item.active .post-head, .entries.post .post-item.active .post-description {
      width: 75%; } }
  @media only screen and (min-width: 1080px) {
    .entries.project .post-item.active .featured-image, .entries.post .post-item.active .featured-image {
      width: 75%; }
    .entries.project .post-item.active .post-head, .entries.project .post-item.active .post-description, .entries.post .post-item.active .post-head, .entries.post .post-item.active .post-description {
      width: 65%; } }
  @media only screen and (min-width: 1680px) {
    .entries.project .post-item.active .featured-image, .entries.post .post-item.active .featured-image {
      width: 65%; }
    .entries.project .post-item.active .post-head, .entries.project .post-item.active .post-description, .entries.post .post-item.active .post-head, .entries.post .post-item.active .post-description {
      width: 50%; } }
.entries.project [class*='col'].post-item, .entries.post [class*='col'].post-item {
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  transition: all 1.5s ease;
  -o-transition: all 1.5s ease; }
.entries.project .project-item, .entries.project .post-item, .entries.post .project-item, .entries.post .post-item {
  /* fade animation */
  opacity: 0;
  -webkit-transition: opacity 1.5s, transform 1.5s ease;
  -o-transition: opacity 1.5s, transform 1.5s ease;
  transition: opacity 1.5s, transform 1.5s ease;
  -webkit-transform-style: preserve-3d;
  -webkit-transform: scale(0.8, 0.8);
  -moz-transform: scale(0.8, 0.8);
  transform: scale(0.8, 0.8);
  -o-transform: scale(0.8, 0.8); }
  .entries.project .project-item h2, .entries.project .project-item h3, .entries.project .post-item h2, .entries.project .post-item h3, .entries.post .project-item h2, .entries.post .project-item h3, .entries.post .post-item h2, .entries.post .post-item h3 {
    padding: 1.5rem;
    text-align: center; }
  .entries.project .project-item.col50 h2, .entries.project .project-item.col50 h3, .entries.project .post-item.col50 h2, .entries.project .post-item.col50 h3, .entries.post .project-item.col50 h2, .entries.post .project-item.col50 h3, .entries.post .post-item.col50 h2, .entries.post .post-item.col50 h3 {
    font-size: 90%; }
  .entries.project .project-item.col35 h2, .entries.project .project-item.col50 h3, .entries.project .post-item.col35 h2, .entries.project .post-item.col50 h3, .entries.post .project-item.col35 h2, .entries.post .project-item.col50 h3, .entries.post .post-item.col35 h2, .entries.post .post-item.col50 h3 {
    font-size: 80%; }
  .entries.project .project-item p, .entries.project .post-item p, .entries.post .project-item p, .entries.post .post-item p {
    padding: 1rem;
    text-align: center;
    font-size: 80%;
    line-height: 180%; }
  .entries.project .project-item.animate-this, .entries.project .post-item.animate-this, .entries.post .project-item.animate-this, .entries.post .post-item.animate-this {
    opacity: 1;
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    transform: scale(1, 1);
    -o-transform: scale(1, 1); }
.entries.project .post-item h2, .entries.project .post-item h3, .entries.post .post-item h2, .entries.post .post-item h3 {
  margin-bottom: 0;
  padding-bottom: 1rem !important; }
.entries.project main .grid, .entries.post main .grid {
  position: relative; }
  .entries.project main .grid .col25, .entries.post main .grid .col25 {
    width: 25%; }
  .entries.project main .grid .col33, .entries.post main .grid .col33 {
    width: 33.333333%; }
  .entries.project main .grid .col35, .entries.post main .grid .col35 {
    width: 35%; }
  .entries.project main .grid .col50, .entries.post main .grid .col50 {
    width: 50%; }
  .entries.project main .grid .col65, .entries.post main .grid .col65 {
    width: 65%; }
  .entries.project main .grid .col75, .entries.post main .grid .col75 {
    width: 75%; }
  .entries.project main .grid [class*='col'].active, .entries.post main .grid [class*='col'].active {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: white;
    z-index: 101; }
  @media only screen and (min-width: 768px) {
    .entries.project main .grid [class*='col'], .entries.post main .grid [class*='col'] {
      padding: 60px 45px; } }
  .entries.project main .grid [class*='col'].centered, .entries.post main .grid [class*='col'].centered {
    float: left;
    margin-left: 50%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0); }
  .entries.project main .grid .extra-vpad, .entries.post main .grid .extra-vpad {
    padding-top: 4rem;
    padding-bottom: 4rem; }
    @media only screen and (max-width: 480px) {
      .entries.project main .grid .extra-vpad, .entries.post main .grid .extra-vpad {
        padding-top: 0;
        padding-bottom: 0; } }
    @media only screen and (min-width: 1080px) {
      .entries.project main .grid .extra-vpad, .entries.post main .grid .extra-vpad {
        padding-top: 6rem;
        padding-bottom: 6rem; } }
  @media only screen and (max-width: 480px) {
    .entries.project main .grid .col25, .entries.project main .grid .col33, .entries.project main .grid .col35, .entries.project main .grid .col50, .entries.project main .grid .col65, .entries.project main .grid .col75, .entries.post main .grid .col25, .entries.post main .grid .col33, .entries.post main .grid .col35, .entries.post main .grid .col50, .entries.post main .grid .col65, .entries.post main .grid .col75 {
      width: 100%; } }

body.post-active {
  overflow: hidden;
  height: 100vw; }

/*# sourceMappingURL=app.css.map */