/*
  [CSS Index]
  
  ---
  
  Template Name: Yesex - Creative One Page Portfolio Template
  Author:  ex-nihilo
  Version: 1.0
*/

/*
  1. TEMPLATE BACKGROUNDS
    1.1. single IMG BACKGROUND
    1.2. slick fullscreen - ken burns slideshow ZOOM/FADE IMG BACKGROUND
    1.3. swiper parallax IMG BACKGROUND
    1.4. page title IMG BACKGROUND
    1.5. about IMG BACKGROUND
    1.6. works IMG BACKGROUND
    1.7. news IMG BACKGROUND
    1.8. panel left contact bg IMG BACKGROUND
    1.9. panel left instagram feed bg IMG BACKGROUND
  2. reset
  3. layout
  4. borders
  5. center container
  6. link underline
  7. preloader
  8. menu
  9. menu mobile
  10. lifting
  11. post
  12. page title
  13. icon hover
  14. Magnific Popup v1.1.0 CUSTOM
  15. contact
    15.1. contact content
    15.2. panel contact
      15.2.1. panel left contact
      15.2.2. panel left contact bg
      15.2.3. panel right contact
  16. instagram feed
    16.1. instagram feed content
    16.2. panel instagram feed
      16.2.1. panel left instagram feed
      16.2.2. panel left instagram feed bg
      16.2.3. panel right instagram feed
    16.3. instagram feed photos
    16.4. instagram feed mobile launcher
  17. news modal
    17.1. news modal video container
  18. Owl Carousel v2.2.0 CUSTOM
  19. button the
  20. upper page left
  21. upper page right
  22. center container
  23. hero container
  24. video play button
  25. page title home
  26. videos
    26.1. Vimeo video
    26.2. YouTube video
    26.3. HTML5 video
  27. ken burns slideshow
  28. Slick v1.6.0 CUSTOM
  29. swiper parallax
  30. elements
  31. overline
  32. section intro
  33. quote
  34. logo
  35. section headings
  36. overlay
  37. post txt
  38. contact form
  39. divider
*/

/* @font-face {
  font-family: anton;
  src: url(../fonts/Anton-Regular.ttf);
} */

/* 1. TEMPLATE BACKGROUNDS */
/* 1.1. single IMG BACKGROUND */
.bg-img-SINGLE {
  background-image: url(../images/slide-2.jpg);
}


/* 1.2. slick fullscreen - ken burns slideshow ZOOM/FADE IMG BACKGROUND */
.bg-img-1,
.kenburns-slide-1 {
  background-image: url(../images/slide-2.jpg);
}

.bg-img-2,
.kenburns-slide-2 {
  background-image: url(../images/slide-3.jpg);
}

.bg-img-3,
.kenburns-slide-3 {
  background-image: url(../images/slide-4.jpg);
}

.bg-img-4,
.kenburns-slide-4 {
  background-image: url(../images/slide-5.jpg);
}


/* 1.3. swiper parallax IMG BACKGROUND */
.swiper-slide-parallax-bg {
  background-image: url(../images/slide-1.jpg);
}



.page-title.page-title-contact {
  background-image: url(../images/slide-3.jpg);
}

.panel-left-contact.panel-left-bg-contact {
  background-image: url(../images/slide-3.jpg);
}

/* 1.9. panel left instagram feed bg IMG BACKGROUND */
.panel-left-instagram-feed.panel-left-bg-instagram-feed {
  background-image: url(../images/slide-3.jpg);
}


/* 2. reset */
/* 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,
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;
} */

html,
body {
  height: 100%;
}

body {
  line-height: 1;
}

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

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

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

*:focus {
  outline: none;
}

a:focus,
a:active,
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner {
  border: 0;
  outline: 0;
}


/* 3. layout */
body {
  font-family: 'anton';
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
  text-align: left;
  color: #2e2e2e;
  background: #000;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  margin: 0;
  padding: 0;
  line-height: 1.5;
}

a {
  color: blue;
  text-decoration: none;
  outline: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

a:hover,
a:visited,
a:active,
a:focus {
  color: blue;
  text-decoration: none;
  outline: none;
  font-weight: 600;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

p {
  text-align: left;
  font-size: 15px;
  font-weight: 500;
  /* letter-spacing: 0.05em; */
  color: #2e2e2e;
  line-height: 2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

@media only screen and (max-width: 880px) {
  p {
    font-size: 14px;
  }
}

p a,
p a:hover {
  color: #ff264a;
  text-decoration: none;
  outline: none;
  font-weight: 600;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

strong {
  font-weight: bold;
}

::-moz-selection {
  background: #ff264a;
  color: #fff;
}

::selection {
  background: #ff264a;
  color: #fff;
}

.nopadding {
  padding: 0 !important;
  margin: 0 !important;
}

.section-light {
  background: #fff;
}

.section-dark {
  color: #fff;
  background: #000;
  mix-blend-mode: darken;
}


/* 4. borders */
.border-top,
.border-bottom,
.border-bottom-menu {
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  -ms-transition: all 1.5s ease;
  -o-transition: all 1.5s ease;
  transition: all 1.5s ease;
}

.border-top.top-position {
  -webkit-transform: translateY(-200px);
  -moz-transform: translateY(-200px);
  -ms-transform: translateY(-200px);
  -o-transform: translateY(-200px);
  transform: translateY(-200px);
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  -ms-transition: all 1.5s ease;
  -o-transition: all 1.5s ease;
  transition: all 1.5s ease;
}

.border-bottom-menu.bottom-position,
.border-bottom.bottom-position {
  -webkit-transform: translateY(200px);
  -moz-transform: translateY(200px);
  -ms-transform: translateY(200px);
  -o-transform: translateY(200px);
  transform: translateY(200px);
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  -ms-transition: all 1.5s ease;
  -o-transition: all 1.5s ease;
  transition: all 1.5s ease;
}

.border-top {
  position: fixed;
  width: 100%;
  height: 75px;
  left: 0;
  top: 0;
  background: none;
  z-index: 1;
}

.border-bottom {
  position: fixed;
  width: 100%;
  height: 40px;
  right: 0;
  bottom: 0;
  background: none;
  z-index: 9;
}

@media only screen and (max-width: 640px) {
  .border-bottom {
    bottom: 0;
    background: #000;
  }
}

.border-bottom-menu {
  position: fixed;
  width: 100%;
  height: 40px;
  right: 0;
  bottom: 0;
  background: none;
  z-index: 10;
}

@media only screen and (max-width: 640px) {
  .border-bottom-menu {
    display: none;
    visibility: hidden;
  }
}


/* 5. center container */
.center-container {
  position: absolute;
  display: table;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  background: none;
}

.center-block {
  display: table-cell;
  vertical-align: middle;
}


/* 6. link underline */
.link-underline {
  position: relative;
  display: inline-block;
}

.link-underline::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: #ff264a;
  -webkit-transform-origin: right center;
  -moz-transform-origin: right center;
  -ms-transform-origin: right center;
  transform-origin: right center;
  -webkit-transform: scale(0, 1);
  -moz-transform: scale(0, 1);
  -ms-transform: scale(0, 1);
  -o-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: -moz-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  -ms-transition: -ms-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  -o-transition: -o-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.link-underline:hover::before {
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -ms-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
}


/* 7. preloader */
.preloader-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #000;
  z-index: 999999;
}

.preloader-bg.preloader-bg-light {
  background: #fff;
}

#preloader {
  position: fixed;
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #000;
  z-index: 999999;
}

#preloader.preloader-light {
  background: #fff;
}

#preloader-status {
  display: table-cell;
  vertical-align: middle;
}

.preloader-position {
  position: relative;
  margin: 0 auto;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

.loader {
  position: relative;
  width: 45px;
  height: 45px;
  left: 50%;
  top: 50%;
  margin-left: -22px;
  margin-top: 2px;
  -webkit-animation: rotate 1s infinite linear;
  -moz-animation: rotate 1s infinite linear;
  -ms-animation: rotate 1s infinite linear;
  -o-animation: rotate 1s infinite linear;
  animation: rotate 1s infinite linear;
  border: 3px solid rgba(255, 255, 255, .15);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
}

.loader.loader-light {
  border: 3px solid rgba(0, 0, 0, .15);
}

.loader span {
  position: absolute;
  width: 45px;
  height: 45px;
  top: -3px;
  left: -3px;
  border: 3px solid transparent;
  border-top: 3px solid rgba(255, 255, 255, .75);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
}

.loader.loader-light span {
  border-top: 3px solid rgba(0, 0, 0, .75);
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}


/* 8. menu */
.menu-wrapper {
  width: 100%;
  height: 40px;
  background: #000;
}

#menu {
  position: absolute;
  top: 4px;
  left: 24px;
  font-family: anton;
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  font-weight: 400;
  /* letter-spacing: 1px; */
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  -ms-transition: all 1.5s ease;
  -o-transition: all 1.5s ease;
  transition: all 1.5s ease;
}

@media all and (min-width: 1920px) {
  #menu {
    left: 34px;
  }
}

@media only screen and (max-width: 1200px) {
  #menu {
    left: 24px;
  }
}

@media only screen and (max-width: 995px) {
  #menu {
    left: 14px;
  }
}

#menu a:hover,
#menu a:visited,
#menu a:active,
#menu a:focus {
  font-family: 'anton';
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  font-weight: 400;
  /* letter-spacing: 1px; */
}

@media only screen and (max-width: 640px) {
  #menu {
    display: none;
    visibility: hidden;
  }
}

#menu a {
  color: #fff;
}

#menu.menu-dark a {
  color: #000;
}

#menu a:hover {
  color: #000;
}

#menu.menu-dark a:hover {
  color: #fff;
}

#menu ul,
li {
  margin: 0;
  padding: 0;
}

#menu nav ul,
li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu {
  float: left;
  margin: 0;
  padding: 0;
}

.menu li a,
.menu li {
  float: left;
  text-transform: uppercase;
}

.menu li {
  position: relative;
  padding: 5px 18px 0 0;
}

@media all and (min-width: 1920px) {
  .menu li {
    padding: 5px 28px 0 0;
  }
}

@media only screen and (max-width: 1200px) {
  .menu li {
    padding: 5px 18px 0 0;
  }
}

@media only screen and (max-width: 995px) {
  .menu li {
    padding: 5px 8px 0 0;
  }
}

.menu li a {
  padding: 3px 5px;
  text-decoration: none;
  color: #fff;
  -webkit-transition: 0.3s ease-in;
  -moz-transition: 0.3s ease-in;
  -ms-transition: 0.3s ease-in;
  -o-transition: 0.3s ease-in;
  transition: 0.3s ease-in;
}

.menu li a:hover {
  background: #fff;
}

.menu.menu-dark li a:hover {
  background: #000;
}


/* 9. menu mobile */
.menu-mobile a.menu-trigger {
  display: none;
  visibility: hidden;
  width: 30px;
  height: 30px;
  margin: 5px 0 0 10px;
  padding: 0;
  font-size: 35px;
  color: #fff;
}

@media only screen and (max-width: 640px) {
  .menu-mobile a.menu-trigger {
    display: block;
    visibility: visible;
  }
}

.menu-mobile a.menu-trigger:hover {
  background: none;
  color: #fff;
}

.menu-mobile {
  position: absolute;
  left: 5px;
  bottom: 25px;
  z-index: 999;
}

.menu-mobile ul,
li {
  margin: 0;
  padding: 0;
}

.menu-mobile .lifting {
  margin: 0 0 7px 0;
  height: 25px;
}

.menu-mobile .lifting-first {
  margin: 0 0 4px 0;
  height: 25px;
}

.menu-mobile li,
.menu-mobile li a {
  float: left;
  text-transform: uppercase;
  height: 25px;
}

.menu-mobile li {
  position: relative;
  margin: 7px 0 0 0;
  padding: 0 0 10px 0;
  background: none;
}

.menu-mobile li a {
  padding: 0 5px 10px 5px;
  text-decoration: none;
  -webkit-transition: 0.3s ease-in;
  -moz-transition: 0.3s ease-in;
  -ms-transition: 0.3s ease-in;
  -o-transition: 0.3s ease-in;
  transition: 0.3s ease-in;
}

.menu-mobile li ul {
  position: absolute;
  display: none;
  left: 0;
  bottom: 100%;
}

.menu-mobile li:hover ul {
  display: block;
  width: auto;
  max-width: 100px;
  background: none;
}

.menu-mobile li ul a {
  white-space: nowrap;
  font-family: 'anton';
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  font-weight: 300;
  /* letter-spacing: 1px; */
  background: #000;
  padding: 5px 10px 0 10px;
}

.menu-mobile li ul a:hover {
  color: #000;
  background: #fff;
}


/* 10. lifting */
#containerOT {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0 auto;
  background: none;
  z-index: 2;
}

#news-lifting,
#about-lifting,
#services-lifting,
#works-lifting {
  position: absolute;
  display: none;
  width: 100%;
  height: 337px;
  overflow: hidden;
  padding: 0;
  background: #fff;
  left: 0;
  bottom: 40px;
  -webkit-box-shadow: 0 0 75px rgba(0, 0, 0, .85);
  -moz-box-shadow: 0 0 75px rgba(0, 0, 0, .85);
  box-shadow: 0 0 75px rgba(0, 0, 0, .85);
  z-index: 3;
}

@media only screen and (max-width: 995px) {

  #about-lifting,
  #services-lifting,
  #works-lifting,
  #news-lifting {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
  }
}

.all-lifting-inner {
  position: relative;
  width: -webkit-calc(100% - 30px);
  width: -moz-calc(100% - 30px);
  width: calc(100% - 30px);
  height: -webkit-calc(100% - 80px);
  height: -moz-calc(100% - 80px);
  height: calc(100% - 80px);
  top: 40px;
  right: 15px;
  bottom: 40px;
  left: 15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #fff;
  overflow-x: hidden;
  overflow-y: hidden;
}

@media only screen and (max-width: 995px) {
  .all-lifting-inner {
    width: 100%;
    height: auto;
    right: 0;
    left: 0;
    overflow-y: auto;
  }
}


/* 11. post */
.post-inner {
  margin: 0;
}

.post-content {
  position: relative;
  overflow: hidden;
  margin: 0 0 0 0;
  width: 100%;
  height: auto;
  text-align: left;
}

@media only screen and (max-width: 995px) {
  .post-content-correction-about {
    position: relative;
    top: 1px;
  }

  .the-first-lift {
    position: relative;
    top: -45px;
  }
}

.post-content p {
  padding: 0;
}

.page-title-content.page-title-all {
  font-size: 145px;
  margin: -16px auto -3px auto;
}

@media all and (min-width: 1920px) {
  .page-title-content.page-title-all {
    font-size: 160px;
    margin: -19px auto -5px auto;
  }
}

@media only screen and (max-width: 1200px) {
  .page-title-content.page-title-all {
    font-size: 85px;
    margin: 25px auto 0 auto;
  }
}

@media only screen and (max-width: 995px) {
  .page-title-content.page-title-all {
    letter-spacing: -0.04em;
  }
}

@media only screen and (max-width: 880px) {
  .page-title-content.page-title-all {
    font-size: 65px;
    margin: 0 auto;
  }
}


/* 12. page title */
.page-title {
  position: relative;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  border: none;
  z-index: 1;
}

.page-title-content {
  position: relative;
  background: #fff;
  mix-blend-mode: lighten;
  overflow: hidden;
}

.page-title-content.page-title-content-dark {
  color: #fff;
  background: #000;
  mix-blend-mode: darken;
}

h1.post-title {
  font-family: 'anton';
  font-size: 100px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: left;
  font-weight: 700;
  /* letter-spacing: -0.05em; */
  color: #000;
}

@media all and (min-width: 1920px) {
  h1.post-title {
    font-size: 160px;
  }
}

@media only screen and (max-width: 1200px) {
  h1.post-title {
    font-size: 80px;
  }
}

@media only screen and (max-width: 995px) {
  h1.post-title {
    font-size: 60px;
  }
}

h1.post-title.post-title-about-main-title {
  margin: 4px 0 1px 20px;
}

@media all and (min-width: 1920px) {
  h1.post-title.post-title-about-main-title {
    margin: -1px 0 -1px 22px;
  }
}

@media only screen and (max-width: 995px) {
  h1.post-title.post-title-about-main-title {
    margin: -1px 0 -1px 15px;
  }
}

h1.post-title.post-title-services-main-title {
  margin: 4px 0 1px 20px;
}

@media all and (min-width: 1920px) {
  h1.post-title.post-title-services-main-title {
    margin: -1px 0 -1px 18px;
  }
}

@media only screen and (max-width: 995px) {
  h1.post-title.post-title-services-main-title {
    margin: -1px 0 -1px 13px;
  }
}

h1.post-title.post-title-works-main-title {
  margin: 4px 0 1px 20px;
}

@media all and (min-width: 1920px) {
  h1.post-title.post-title-works-main-title {
    margin: -1px 0 -1px 20px;
  }
}

@media only screen and (max-width: 995px) {
  h1.post-title.post-title-works-main-title {
    margin: -1px 0 -1px 15px;
  }
}

h1.post-title.post-title-news-main-title {
  margin: 4px 0 1px 20px;
}

@media all and (min-width: 1920px) {
  h1.post-title.post-title-news-main-title {
    margin: -1px 0 -1px 15px;
  }
}

@media only screen and (max-width: 995px) {
  h1.post-title.post-title-news-main-title {
    margin: -1px 0 -1px 12px;
  }
}

h1.post-title.post-title-contact-main-title {
  margin: -1px 0 -1px -4px;
}

@media all and (min-width: 1920px) {
  h1.post-title.post-title-contact-main-title {
    margin: -1px 0 -1px -7px;
  }
}

@media only screen and (max-width: 995px) {
  h1.post-title.post-title-contact-main-title {
    margin: -1px 0 -1px -2px;
  }
}

.post-block {
  position: relative;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: hidden;
  height: 240px;
}

@media all and (min-width: 1920px) {
  .post-block {
    height: 250px;
  }
}

@media only screen and (max-width: 1200px) {
  .post-block {
    height: 240px;
    margin: 0 0 50px 0;
    top: -38px;
  }
}

@media only screen and (max-width: 995px) {
  .post-block {
    height: 250px;
    top: 0;
  }
}

@media only screen and (max-width: 880px) {
  .post-block {
    height: 230px;
  }
}

@media only screen and (max-width: 640px) {
  .post-block {
    height: 215px;
  }
}

.post-block-second {
  position: relative;
  margin-left: 0;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  height: 255px;
}

@media only screen and (max-width: 995px) {
  .post-block-second {
    height: auto;
    overflow: hidden;
  }
}

.post-block-correction {
  margin: 0;
  padding: 0 10px;
}

@media only screen and (max-width: 995px) {
  .post-block-correction {
    padding: 0;
  }
}

.post-box {
  position: relative;
  width: 100%;
}

.post-box-photo-about {
  position: relative;
  width: 100%;
  min-width: 250px;
  height: 175px;
  margin: 1px 0 0 0;
  padding: 0;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

@media all and (min-width: 1920px) {
  .post-box-photo-about {
    min-width: 450px;
    height: 185px;
  }
}

@media only screen and (max-width: 995px) {
  .post-box-photo-about {
    height: 250px;
  }
}

.post-block-services {
  min-height: 250px;
}

@media only screen and (max-width: 880px) {
  .post-block-services {
    min-height: inherit;
  }
}

.post-box-photo-works {
  position: relative;
  width: 100%;
  min-width: 250px;
  height: 175px;
  margin: 1px 0 0 0;
  padding: 0;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

@media all and (min-width: 1920px) {
  .post-box-photo-works {
    min-width: 450px;
    height: 185px;
  }
}

@media only screen and (max-width: 995px) {
  .post-box-photo-works {
    height: 250px;
  }
}

.post-box-photo-news {
  position: relative;
  width: 100%;
  min-width: 250px;
  height: 240px;
  margin: 1px 0 0 0;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

@media all and (min-width: 1920px) {
  .post-box-photo-news {
    min-width: 450px;
    height: 250px;
  }
}

@media only screen and (max-width: 995px) {
  .post-box-photo-news {
    height: 250px;
  }
}


/* 13. icon hover */
.icon-works {
  position: absolute;
  width: 100%;
  top: 50%;
  text-align: center;
  opacity: 0;
  -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-transition: all 0.35s ease-out;
  -moz-transition: all 0.35s ease-out;
  -ms-transition: all 0.35s ease-out;
  -o-transition: all 0.35s ease-out;
  transition: all 0.35s ease-out;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  z-index: 1;
}

.icon-works a {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
  width: 44px;
  height: 44px;
  line-height: 44px;
  margin: 0 2px;
  font-size: 20px;
  background: #000;
  border: 1px solid #000;
  color: #fff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.icon-works a,
.icon-works a:hover,
.icon-works a:visited,
.icon-works a:active,
.icon-works a:focus {
  -webkit-transition: all 0.35s ease-out;
  -moz-transition: all 0.35s ease-out;
  -ms-transition: all 0.35s ease-out;
  -o-transition: all 0.35s ease-out;
  transition: all 0.35s ease-out;
  -webkit-transform: scale(0.75);
  -moz-transform: scale(0.75);
  -ms-transform: scale(0.75);
  -o-transform: scale(0.75);
  transform: scale(0.75);
  color: #fff;
}

.icon-works a.iw-slide-left {
  -webkit-transform: translate3d(-60px, 0, 0);
  -moz-transform: translate3d(-60px, 0, 0);
  -ms-transform: translate3d(-60px, 0, 0);
  -o-transform: translate3d(-60px, 0, 0);
  transform: translate3d(-60px, 0, 0);
}

.icon-works a.iw-slide-right {
  -webkit-transform: translate3d(60px, 0, 0);
  -moz-transform: translate3d(60px, 0, 0);
  -ms-transform: translate3d(60px, 0, 0);
  -o-transform: translate3d(60px, 0, 0);
  transform: translate3d(60px, 0, 0);
}

.image-works:hover .icon-works a {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

.icon-works a:hover {
  background: blue;
  border: 1px solid blue;
  color: #fff;
}

.icon-works a:hover:after {
  background: blue;
}

.image-works:hover .icon-works {
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.icon-works a:before {
  position: relative;
  z-index: 1;
}

.icon-works a i {
  position: relative;
  z-index: 1;
}

.image-works {
  position: relative;
  z-index: 5 !important;
}

.image-works>.hover-effect {
  position: absolute;
  background: #fff;
  opacity: 0;
  -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-transition: opacity 0.35s ease-out;
  -moz-transition: opacity 0.35s ease-out;
  -ms-transition: opacity 0.35s ease-out;
  -o-transition: opacity 0.35s ease-out;
  transition: opacity 0.35s ease-out;
  width: -webkit-calc(100% - 20px);
  width: -moz-calc(100% - 20px);
  width: calc(100% - 20px);
  height: -webkit-calc(100% - 20px);
  height: -moz-calc(100% - 20px);
  height: calc(100% - 20px);
  top: 10px;
  left: 10px;
  bottom: 10px;
  right: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.image-works:hover .hover-effect {
  opacity: 0.85;
  -moz-opacity: 0.85;
  -webkit-opacity: 0.85;
  filter: alpha(opacity=85);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
}


/* 14. Magnific Popup v1.1.0 CUSTOM */
.mfp-arrow-left:after {
  font-family: "Ionicons";
  content: "\f124";
  font-size: 18px;
  color: #fff;
  margin-top: 22px;
}

.mfp-arrow-right:after {
  font-family: "Ionicons";
  content: "\f125";
  font-size: 18px;
  color: #fff;
  margin-top: 22px;
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: crosshair;
}

.mfp-arrow-left:after,
.mfp-arrow-left:before {
  border-right: none;
}

.mfp-arrow-right:after,
.mfp-arrow-right:before {
  border-left: none;
}

.mfp-title {
  font-family: 'anton';
  font-size: 13px;
  line-height: 1.5;
  font-style: normal;
  font-weight: 400;
  /* letter-spacing: 0.05em; */
}


/* 15. contact */
.contact {
  position: absolute;
  top: 12px;
  right: 161px;
  font-family: 'anton';
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  font-weight: 300;
  /* letter-spacing: 1px; */
  cursor: pointer;
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  -ms-transition: all 1.5s ease;
  -o-transition: all 1.5s ease;
  transition: all 1.5s ease;
}

@media all and (min-width: 1920px) {
  .contact {
    right: 181px;
  }
}

@media only screen and (max-width: 1200px) {
  .contact {
    right: 161px;
  }
}

@media only screen and (max-width: 995px) {
  .contact {
    right: 141px;
  }
}

@media only screen and (max-width: 640px) {
  .contact {
    display: none;
    visibility: hidden;
  }
}

.contact a {
  color: #fff;
  padding: 0 5px;
}

.contact a:hover {
  color: #000;
  background: #fff;
}

.contact.contact-dark a {
  color: #000;
}

.contact.contact-dark a:hover {
  color: #fff;
  background: #000;
}

.contact a,
.contact a:hover,
.contact a:visited,
.contact a:active,
.contact a:focus {
  font-family: 'anton';
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  font-weight: 400;
  /* letter-spacing: 1px; */
}


/* 15.1. contact content */
.contact-content a,
.contact-content a:hover {
  color: blue;
}

.contact-content {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center !important;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}

@media only screen and (max-width: 880px) {
  .contact-content {
    position: relative;
    padding: 121px 0 135px 0;
  }
}

@media only screen and (max-width: 640px) {
  .contact-content {
    padding: 121px 0 115px 0;
  }
}

.contact-content .contact-content-inner {
  position: relative;
  width: 100%;
  padding: 0 100px;
  text-align: center;
}

@media all and (min-width: 1920px) {
  .contact-content .contact-content-inner {
    padding: 0 200px;
  }
}

@media only screen and (max-width: 1200px) {
  .contact-content .contact-content-inner {
    padding: 0 40px;
  }
}

@media only screen and (max-width: 880px) {
  .contact-content .contact-content-inner {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 480px) {

  .contact-pt,
  .contact-pb {
    position: relative;
    width: 100%;
    margin: 0 auto;
    background: none;
    z-index: -1;
  }

  .contact-pt {
    height: 40px;
  }

  .contact-pb {
    height: 100px;
  }
}

.height-correction {
  position: relative;
  width: 100%;
  height: auto;
  margin-top: -40px;
}

@media only screen and (max-width: 995px) {
  .height-correction {
    margin-top: -60px;
  }
}


/* 15.2. panel contact */
/* 15.2.1. panel left contact */
.panel-left-contact {
  position: absolute;
  width: 45%;
  height: 100vh;
  overflow: hidden;
  top: 0;
  left: -100%;
  background: #000;
  -webkit-transition: all .8s ease-out;
  -moz-transition: all .8s ease-out;
  -ms-transition: all .8s ease-out;
  -o-transition: all .8s ease-out;
  transition: all .8s ease-out;
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  z-index: 99;
}

@media all and (min-width: 1920px) {
  .panel-left-contact {
    width: 40%;
  }
}

@media only screen and (max-width: 640px) {
  .panel-left-contact {
    display: none;
    visibility: hidden;
  }
}

.panel-left-contact.open {
  left: 0;
}

.panel-left-contact.close {
  left: -100%;
  -webkit-transition: all 1s ease-out;
  -moz-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  transition: all 1s ease-out;
  opacity: 0.7;
  -moz-opacity: 0.7;
  -webkit-opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}


/* 15.2.2. panel left contact bg */
.panel-left-bg-contact {
  position: absolute;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.toggle-contact-content {
  cursor: pointer;
}


/* 15.2.3. panel right contact */
.panel-right-contact {
  position: absolute;
  width: 60%;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  top: 0;
  right: -100%;
  background: #fff;
  -webkit-transition: all .8s ease-out;
  -moz-transition: all .8s ease-out;
  -ms-transition: all .8s ease-out;
  -o-transition: all .8s ease-out;
  transition: all .8s ease-out;
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  z-index: 99;
}

@media all and (min-width: 1920px) {
  .panel-right-contact {
    width: 60%;
  }
}

@media only screen and (max-width: 640px) {
  .panel-right-contact {
    width: 100%;
  }
}

.panel-right-contact.open {
  right: 0;
}

.panel-right-contact.close {
  right: -100%;
  -webkit-transition: all 1s ease-out;
  -moz-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  transition: all 1s ease-out;
  opacity: 0.7;
  -moz-opacity: 0.7;
  -webkit-opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}


/* 16. instagram feed */
.instagram-feed {
  position: absolute;
  top: 12px;
  right: 24px;
  font-family: 'anton';
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  font-weight: 300;
  /* letter-spacing: 1px; */
  cursor: pointer;
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  -ms-transition: all 1.5s ease;
  -o-transition: all 1.5s ease;
  transition: all 1.5s ease;
}

@media all and (min-width: 1920px) {
  .instagram-feed {
    right: 34px;
  }
}

@media only screen and (max-width: 1200px) {
  .instagram-feed {
    right: 24px;
  }
}

@media only screen and (max-width: 995px) {
  .instagram-feed {
    right: 14px;
  }
}

@media only screen and (max-width: 640px) {
  .instagram-feed {
    display: none;
    visibility: hidden;
  }
}

.instagram-feed a {
  color: #fff;
  padding: 0 5px;
}

.instagram-feed a:hover {
  color: #000;
  background: #fff;
}

.instagram-feed.instagram-feed-dark a {
  color: #000;
}

.instagram-feed.instagram-feed-dark a:hover {
  color: #fff;
  background: #000;
}

.instagram-feed a,
.instagram-feed a:hover,
.instagram-feed a:visited,
.instagram-feed a:active,
.instagram-feed a:focus {
  font-family: 'anton';
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  font-weight: 400;
  /* letter-spacing: 1px; */
}


/* 16.1. instagram feed content */
.instagram-feed-content a,
.instagram-feed-content a:hover {
  color: #ff264a;
}

.instagram-feed-content {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center !important;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}

@media only screen and (max-width: 880px) {
  .instagram-feed-content {
    position: relative;
    padding: 121px 0 135px 0;
  }
}

@media only screen and (max-width: 640px) {
  .instagram-feed-content {
    padding: 121px 0 125px 0;
  }
}

.instagram-feed-content .instagram-feed-content-inner {
  position: relative;
  width: 100%;
  padding: 0 100px;
  text-align: center;
}

@media all and (min-width: 1920px) {
  .instagram-feed-content .instagram-feed-content-inner {
    padding: 0 200px;
  }
}

@media only screen and (max-width: 1200px) {
  .instagram-feed-content .instagram-feed-content-inner {
    padding: 0 40px;
  }
}

@media only screen and (max-width: 880px) {
  .instagram-feed-content .instagram-feed-content-inner {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 480px) {

  .instagram-pt,
  .instagram-pb {
    position: relative;
    width: 100%;
    margin: 0 auto;
    background: none;
    z-index: -1;
  }

  .instagram-pt {
    height: 20px;
  }

  .instagram-pb {
    height: 70px;
  }
}


/* 16.2. panel instagram feed */
/* 16.2.1. panel left instagram feed */
.panel-left-instagram-feed {
  position: absolute;
  width: 40%;
  height: 100vh;
  overflow: hidden;
  top: 0;
  left: -100%;
  background: #000;
  -webkit-transition: all .8s ease-out;
  -moz-transition: all .8s ease-out;
  -ms-transition: all .8s ease-out;
  -o-transition: all .8s ease-out;
  transition: all .8s ease-out;
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  z-index: 99;
}

@media all and (min-width: 1920px) {
  .panel-left-instagram-feed {
    width: 40%;
  }
}

@media only screen and (max-width: 640px) {
  .panel-left-instagram-feed {
    display: none;
    visibility: hidden;
  }
}

.panel-left-instagram-feed.open {
  left: 0;
}

.panel-left-instagram-feed.close {
  left: -100%;
  -webkit-transition: all 1s ease-out;
  -moz-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  transition: all 1s ease-out;
  opacity: 0.7;
  -moz-opacity: 0.7;
  -webkit-opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}


/* 16.2.2. panel left instagram feed bg */
.panel-left-bg-instagram-feed {
  position: absolute;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.toggle-instagram-feed-content {
  cursor: pointer;
}


/* 16.2.3. panel right instagram feed */
.panel-right-instagram-feed {
  position: absolute;
  width: 55%;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  top: 0;
  right: -100%;
  background: #fff;
  -webkit-transition: all .8s ease-out;
  -moz-transition: all .8s ease-out;
  -ms-transition: all .8s ease-out;
  -o-transition: all .8s ease-out;
  transition: all .8s ease-out;
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  z-index: 99;
}

@media all and (min-width: 1920px) {
  .panel-right-instagram-feed {
    width: 60%;
  }
}

@media only screen and (max-width: 640px) {
  .panel-right-instagram-feed {
    width: 100%;
  }
}

.panel-right-instagram-feed.open {
  right: 0;
}

.panel-right-instagram-feed.close {
  right: -100%;
  -webkit-transition: all 1s ease-out;
  -moz-transition: all 1s ease-out;
  -ms-transition: all 1s ease-out;
  -o-transition: all 1s ease-out;
  transition: all 1s ease-out;
  opacity: 0.7;
  -moz-opacity: 0.7;
  -webkit-opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}


/* 16.3. instagram feed photos */
#instafeed-wrapper {
  position: relative;
  width: auto;
  min-height: 100px;
  background: none;
  margin: 0;
}

@media only screen and (max-width: 880px) {
  #instafeed-wrapper {
    margin: 30px auto 0 auto;
  }
}

@media only screen and (max-width: 640px) {
  #instafeed-wrapper {
    margin: 20px auto 0 auto;
  }
}

.photos {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -webkit-align-content: stretch;
  align-content: stretch;
  padding: 0;
}

.photos img {
  display: block;
  width: 100%;
  height: 100%;
  padding: 5px;
}

.photos a {
  position: relative;
  display: block;
  float: left;
  flex: 0 0 auto;
}

@media screen and (min-width: 1024px) {
  .photos a {
    width: calc(100%/5);
    height: calc(100%/5);
  }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
  .photos a {
    width: calc(100%/3);
    height: calc(100%/3);
  }
}

@media screen and (min-width: 481px) and (max-width: 768px) {
  .photos a {
    width: calc(100%/2);
    height: calc(100%/2);
  }
}

@media screen and (min-width: 321px) and (max-width: 480px) {
  .photos a {
    width: 100%;
    height: 100%;
  }
}

@media screen and (max-width: 320px) {
  .photos a {
    width: 100%;
    height: 100%;
  }
}

#instafeed a,
#instafeed:hover a {
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

#instafeed:hover a:hover {
  opacity: 0.5;
  -moz-opacity: 0.5;
  -webkit-opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}


/* 16.4. instagram feed mobile launcher */
.instagram-feed-mobile-launcher {
  position: absolute;
  right: 15px;
  top: 5px;
  font-size: 20px;
  z-index: 100;
}

.instagram-feed-mobile-launcher a,
.instagram-feed-mobile-launcher a:hover {
  color: #fff;
}


/* 17. news modal */
.news-modal {
  left: -20px;
}

@media only screen and (max-width: 640px) {
  .news-modal {
    left: 0;
  }
}

.news-modal .modal-content {
  padding: 70px 0;
  min-height: 100%;
  border: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  text-align: center;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.news-modal .modal-content img {
  margin: 1px 0;
}

.modal-body p {
  position: relative;
  bottom: 1px;
  margin: -7px 0 0 0;
}

@media only screen and (max-width: 995px) {
  .modal-body p {
    margin: -5px 0 0 0;
  }
}


/* 17.1. news modal video container */
.news-modal-video-container {
  position: relative;
  height: 0;
  padding-top: 30px;
  padding-bottom: 56.25%;
  margin: 1px 0;
  overflow: hidden;
  border: none;
}

.news-modal-video-container iframe,
.news-modal-video-container object,
.news-modal-video-container embed {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border: none;
}


/* 18. Owl Carousel v2.2.0 CUSTOM */
.news-carousel-divider {
  position: relative;
  width: 100%;
  height: 55px;
  background: none;
}

.owl-nav-custom-about,
.owl-nav-custom-services,
.owl-nav-custom-works,
.owl-nav-custom-news {
  position: absolute;
  width: 86px;
  height: 56px;
  bottom: -10px;
  left: 25px;
}

@media all and (min-width: 1920px) {

  .owl-nav-custom-about,
  .owl-nav-custom-services,
  .owl-nav-custom-works,
  .owl-nav-custom-news {
    bottom: -10px;
    left: 25px;
  }
}

@media only screen and (max-width: 1200px) {

  .owl-nav-custom-about,
  .owl-nav-custom-services,
  .owl-nav-custom-works,
  .owl-nav-custom-news {
    left: 25px;
  }
}

@media only screen and (max-width: 995px) {

  .owl-nav-custom-about,
  .owl-nav-custom-services,
  .owl-nav-custom-works,
  .owl-nav-custom-news {
    left: 15px;
  }
}

.owl-buttons {
  position: static;
}

.owl-prev,
.owl-next {
  position: absolute;
  display: block;
  bottom: 0;
  width: 56px;
  height: 56px;
  line-height: 56px;
  font-size: 14px;
  color: #000;
  text-align: center;
  -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  cursor: pointer;
}

.owl-prev {
  left: -45px;
}

.owl-next {
  right: -45px;
}

.owl-prev:before,
.owl-next:before {
  content: "";
  display: block;
  width: 66%;
  height: 66%;
  position: absolute;
  background: none;
  border: 1px solid #000;
  -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

.owl-prev:before {
  left: 45px;
  top: 9px;
}

.owl-next:before {
  right: 45px;
  top: 9px;
}

.owl-prev .owl-custom,
.owl-next .owl-custom {
  position: relative;
}

.owl-prev .owl-custom {
  position: relative;
  left: 34px;
}

.owl-next .owl-custom {
  position: relative;
  right: 34px;
}

.owl-prev:hover,
.owl-next:hover {
  -webkit-transition: 0 none;
  -moz-transition: 0 none;
  -ms-transition: 0 none;
  -o-transition: 0 none;
  transition: 0 none;
}

.owl-prev:hover,
.owl-next:hover,
.owl-prev:hover:before,
.owl-next:hover:before,
.owl-prev:active:before,
.owl-next:active:before,
.owl-carousel:hover .owl-prev,
.owl-carousel:hover .owl-next {
  opacity: 0.5;
  -moz-opacity: 0.5;
  -webkit-opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}

.owl-carousel:hover .owl-prev {
  left: -35px;
}

.owl-carousel:hover .owl-next {
  right: -35px;
}


/* 19. button the */
.button-the {
  position: relative;
  display: inline-block;
  text-transform: uppercase;
  text-align: left;
  color: #2e2e2e;
  background: none;
  padding: 5px 30px 5px 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.button-the.button-the-submit {
  border: none;
  left: 15px;
  top: 25px;
}

.button-the:before {
  position: absolute;
  content: "";
  top: 50%;
  right: -20px;
  width: 40px;
  height: 1px;
  background: #2e2e2e;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.button-the:hover {
  background: none;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.button-the:hover:before {
  right: -41px;
}

.button-the-wrapper,
.button-the-wrapper a,
.button-the-wrapper a:hover,
.button-the-wrapper a:visited,
.button-the-wrapper a:active,
.button-the-wrapper a:focus {
  font-family: 'anton';
  font-size: 15px;
  line-height: 1;
  font-style: normal;
  text-transform: uppercase;
  text-align: left;
  font-weight: 400;
  /* letter-spacing: 1px; */
  color: #2e2e2e;
}

@media only screen and (max-width: 995px) {
  .button-the-wrapper {
    margin: 1px 0;
  }

  .button-the-wrapper.button-the-wrapper-modal {
    margin: 1px 0 0 0;
  }
}


/* 20. upper page left */
.upper-page-left {
  position: relative;
  width: 55%;
  height: 100%;
  overflow: hidden;
  left: 0;
  top: 0;
  margin: 0;
}

@media all and (min-width: 1920px) {
  .upper-page-left {
    width: 40%;
  }
}

@media only screen and (max-width: 1200px) {
  .upper-page-left {
    width: 45%;
  }
}

@media only screen and (max-width: 995px) {
  .upper-page-left {
    width: 55%;
  }
}


/* 21. upper page right */
.upper-page-right {
  position: absolute;
  width: 45%;
  height: 100%;
  overflow: hidden;
  left: auto;
  right: 0;
  top: 0;
  margin: 0;
  z-index: 0;
}

@media all and (min-width: 1920px) {
  .upper-page-right {
    width: 60%;
  }
}

@media only screen and (max-width: 1200px) {
  .upper-page-right {
    width: 55%;
  }
}

@media only screen and (max-width: 995px) {
  .upper-page-right {
    width: 45%;
  }
}


/* 22. center container */
.center-container-home {
  position: absolute;
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 100%;
  background: none;
  z-index: 1;
}

.center-block-home {
  display: table-cell;
  vertical-align: middle;
  background: rgba(255, 255, 255, 0.7);
}

.center-container {
  position: relative;
}

@media only screen and (max-width: 995px) {
  .center-container {
    position: absolute;
    display: table;
    table-layout: fixed;
    width: 100%;
    height: 100%;
    background: none;
    z-index: 1;
  }
}

@media only screen and (max-width: 995px) {
  .center-block {
    display: table-cell;
    vertical-align: middle;
  }
}


/* 23. hero container */
.hero-fullscreen {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
}

.hero-bg {
  position: relative;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.hero-fullscreen-FIX {
  width: 100%;
  height: 100%;
}


/* 24. video play button */
.video-play-btn-wrapper {
  width: 100%;
  height: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: -o-flex;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}

.icon-play {
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-left: 22px solid blue;
  border-bottom: 15px solid transparent;
  margin-left: 8px;
  -webkit-transition: all 0.25s ease;
  -moz-transition: all 0.25s ease;
  -ms-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
}

.video-play-btn {
  width: 80px;
  height: 80px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: -o-flex;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 2px solid blue;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  position: relative;
  -webkit-transition: all 0.25s ease;
  -moz-transition: all 0.25s ease;
  -ms-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
  cursor: pointer;
}

.video-play-btn:hover {
  border-color: #fff;
}

.video-play-btn.video-play-btn-dark:hover {
  border-color: #2e2e2e;
}

.video-play-btn:hover:before,
.video-play-btn:hover:after {
  border-color: #fff;
  background-color: #fff;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.video-play-btn.video-play-btn-dark:hover:before,
.video-play-btn.video-play-btn-dark:hover:after {
  border-color: #2e2e2e;
  background-color: #2e2e2e;
}

.video-play-btn:hover .icon-play {
  border-left-color: #fff;
}

.video-play-btn.video-play-btn-dark:hover .icon-play {
  border-left-color: #2e2e2e;
}

.video-play-btn:before {
  content: "";
  position: absolute;
  width: 60px;
  height: 60px;
  left: 50%;
  top: 50%;
  border: 1px solid blue;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-animation: 3s pulse infinite;
  animation: 3s pulse infinite;
  -webkit-pointer-events: none;
  -moz-pointer-events: none;
  pointer-events: none;
}

.video-play-btn:after {
  content: "";
  position: absolute;
  width: 60px;
  height: 60px;
  left: 50%;
  top: 50%;
  border: 1px solid blue;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-animation: 3s pulse infinite;
  animation: 3s pulse infinite;
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
  -webkit-pointer-events: none;
  -moz-pointer-events: none;
  pointer-events: none;
}

.apple-download-btn {
  width: 150px;
  right: 10%;
  position: absolute;
  bottom: 20%;
}

@-webkit-keyframes pulse {
  0% {
    width: 80px;
    height: 80px;
    opacity: .6;
    background: rgba(255, 38, 74, .2);
  }

  100% {
    width: 160px;
    height: 160px;
    opacity: 0;
  }
}

@keyframes pulse {
  0% {
    width: 80px;
    height: 80px;
    opacity: .6;
    background: rgba(255, 38, 74, .2);
  }

  100% {
    width: 160px;
    height: 160px;
    opacity: 0;
  }
}


/* 25. page title home */
.page-title-content {
  position: relative;
  font-family: 'anton';
  font-weight: 700;
  font-size: 180px;
  text-align: center;
  text-transform: uppercase;
  line-height: 1;
  color: #2e2e2e;
  background: #fff;
  mix-blend-mode: lighten;
  overflow: hidden;
  margin: -20px auto 0 auto;
  font-family: anton;
  /* letter-spacing: 0.001px; */
}

.page-title-content.page-title-content-dark {
  color: #fff;
  background: #000;
  mix-blend-mode: darken;
}

@media all and (min-width: 1920px) {
  .page-title-content {
    font-size: 240px;
  }
}

@media only screen and (max-width: 1200px) {
  .page-title-content {
    font-size: 140px;
  }
}

@media only screen and (max-width: 995px) {
  .page-title-content {
    font-size: 115px;
    letter-spacing: -0.04em;
  }
}

@media only screen and (max-width: 880px) {
  .page-title-content {
    font-size: 85px;
  }
}

@media only screen and (max-width: 640px) {
  .page-title-content {
    font-size: 65px;
  }
}

.page-title {
  position: relative;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  border: none;
  z-index: 1;
}


/* 26. videos */
/* 26.1. Vimeo video */
.vimeo-bg {
  display: none;
}

@media only screen and (max-width: 880px) {
  .vimeo-bg {
    position: relative;
    height: 100%;
    background-image: url(../images/slide-1.jpg);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /* uncomment the following to show an image for mobile devices */
    /* display: block; */
  }

  #vimeo-videoContainment {
    display: none;
  }
}

#vimeo-videoContainment {
  position: absolute;
  display: block;
  width: 100% !important;
  height: 100% !important;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background: #000;
  z-index: 0;
}

#vimeo-videoContainment iframe,
#vimeo-videoContainment object,
#vimeo-videoContainment embed {
  border: none;
}


/* 26.2. YouTube video */
.YT-bg {
  display: none;
}

@media only screen and (max-width: 880px) {
  .YT-bg {
    position: relative;
    height: 100%;
    background-image: url(../images/slide-1.jpg);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /* uncomment the following to show an image for mobile devices */
    /* display: block; */
  }
}

#videoContainment {
  position: absolute;
  display: block;
  width: 100% !important;
  height: 100% !important;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background: #000;
  z-index: 0;
}


/* 26.3. HTML5 video */
.html5-bg {
  display: none;
}

@media only screen and (max-width: 880px) {
  .html5-bg {
    position: relative;
    height: 100%;
    background-image: url(../images/slide-1.jpg);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /* uncomment the following to show an image for mobile devices */
    /* display: block; */
  }
}

.html5-videoContainment {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  min-width: 100%;
  height: auto;
  min-height: 100%;
  background: #000;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 0;
}


/* 27. ken burns slideshow */
.kenburns-slide-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
  z-index: 0;
}

.kenburns-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  -moz-opacity: 0;
  -webkit-opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-animation: KenBurnsSlideShow 24s linear infinite 0s;
  -moz-animation: KenBurnsSlideShow 24s linear infinite 0s;
  -ms-animation: KenBurnsSlideShow 24s linear infinite 0s;
  -o-animation: KenBurnsSlideShow 24s linear infinite 0s;
  animation: KenBurnsSlideShow 24s linear infinite 0s;
}

.kenburns-slide-1,
.kenburns-slide-2,
.kenburns-slide-3,
.kenburns-slide-4 {
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.kenburns-slide-1 {
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.kenburns-slide-2 {
  -webkit-animation-delay: 6s;
  -moz-animation-delay: 6s;
  -ms-animation-delay: 6s;
  -o-animation-delay: 6s;
  animation-delay: 6s;
}

.kenburns-slide-3 {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -ms-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
}

.kenburns-slide-4 {
  -webkit-animation-delay: 18s;
  -moz-animation-delay: 18s;
  -ms-animation-delay: 18s;
  -o-animation-delay: 18s;
  animation-delay: 18s;
}

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

  5% {
    opacity: 1
  }

  25% {
    opacity: 1;
  }

  30% {
    opacity: 0;
    -webkit-transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transformm: scale(1);
  }
}

@-moz-keyframes KenBurnsSlideShow {
  0% {
    opacity: 0;
    -moz-transform: scale(1);
  }

  5% {
    opacity: 1
  }

  25% {
    opacity: 1;
  }

  30% {
    opacity: 0;
    -moz-transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -moz-transform: scale(1);
  }
}

@-o-keyframes KenBurnsSlideShow {
  0% {
    opacity: 0;
    -o-transform: scale(1);
  }

  5% {
    opacity: 1
  }

  25% {
    opacity: 1;
  }

  30% {
    opacity: 0;
    -o-transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -o-transform: scale(1);
  }
}

@keyframes KenBurnsSlideShow {
  0% {
    opacity: 0;
    transform: scale(1);
    -ms-transform: scale(1);
  }

  5% {
    opacity: 1
  }

  25% {
    opacity: 1;
  }

  30% {
    opacity: 0;
    transform: scale(1.1);
    -ms-transform: scale(1.1);
  }

  100% {
    opacity: 0;
    transform: scale(1);
    -ms-transform: scale(1);
  }
}


/* 28. Slick v1.6.0 CUSTOM */
.slick-slide {
  height: 100vh;
  background: none;
}

.slick-slider {
  margin-bottom: 0;
  margin-top: 0;
  cursor: auto;
}

.slick-track,
.slick-list {
  -webkit-perspective: 2000;
  perspective: 2000;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.slick-fullscreen-img-fill {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  text-align: center;
}

.slick-fullscreen-img-fill img {
  position: relative;
  display: inline-block;
  min-width: 100%;
  max-width: none;
  min-height: 100%;
}

.slick-fullscreen-slideshow-zoom-fade .slick-fullscreen-item .slick-fullscreen-img-fill {
  height: 100vh;
  background: none;
}

.slick-fullscreen-slideshow-zoom-fade .slick-fullscreen-item .slick-fullscreen-img-fill .bg-img {
  position: relative;
  width: auto;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.slick-fullscreen-slideshow-zoom-fade .slick-dots {
  position: absolute;
  width: 100%;
  height: 5px;
  left: 0;
  bottom: 0;
  margin: 0;
  padding: 0;
  background: rgba(255, 255, 255, .25);
  list-style-type: none;
}

.slick-fullscreen-slideshow-zoom-fade .slick-dots li button {
  display: none;
}

.slick-fullscreen-slideshow-zoom-fade .slick-dots li {
  position: absolute;
  float: left;
  width: 0;
  height: 5px;
  left: -5px;
  background: #fff;
}

.slick-fullscreen-slideshow-zoom-fade .slick-dots li.slick-active {
  width: 100%;
  -webkit-animation: progressDots 4s both;
  -moz-animation: progressDots 4s both;
  -ms-animation: progressDots 4s both;
  -o-animation: progressDots 4s both;
  animation: progressDots 4s both;
}

@-webkit-keyframes progressDots {
  from {
    width: 0;
  }

  to {
    width: 100%;
  }
}

@keyframes progressDots {
  from {
    width: 0;
  }

  to {
    width: 100%;
  }
}

.slick-fullscreen-slideshow-zoom-fade {
  background: none;
}

.slick-fullscreen-slideshow-zoom-fade .slick-slide {
  display: none;
  float: left;
  height: 100%;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-fullscreen-slideshow-zoom-fade .slick-fullscreen-item .bg-img {
  -webkit-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
  -moz-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
  -ms-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
  -o-transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
  transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
  -webkit-transform: scale(1.3);
  -moz-transform: scale(1.3);
  -ms-transform: scale(1.3);
  -o-transform: scale(1.3);
  transform: scale(1.3);
}

.slick-fullscreen-slideshow-zoom-fade .slick-fullscreen-item.slick-active .bg-img {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}


/* 29. swiper parallax */
.parallax .swiper-button-next,
.parallax .swiper-button-prev {
  display: block;
  visibility: visible;
  width: 20px;
  height: 20px;
  background-size: 20px 20px;
  display: none;
  visibility: hidden;
}

.parallax a,
.parallax a:hover {
  color: #fff;
}

.parallax .swiper-container {
  width: 100%;
  height: 100%;
  background: #000;
  left: 0;
  top: 0;
}

.parallax .swiper-slide {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.parallax .parallax-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 130%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


/* 30. elements */
.left-element {
  position: fixed;
  font-family: 'anton';
  font-size: 15px;
  font-weight: 400;
  /* letter-spacing: 0.05em; */
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
  color: #999;
  background: none;
  border: none;
  width: auto;
  height: 48px;
  line-height: 48px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  z-index: 2;
  z-index: 1;
}

@media only screen and (max-width: 640px) {
  .left-element {
    font-size: 13px;
    display: none;
    visibility: hidden;
  }
}

.left-element a,
.left-element a:hover {
  outline: none;
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

.left-element {
  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  -ms-transition: all 1.5s ease;
  -o-transition: all 1.5s ease;
  transition: all 1.5s ease;
}

.left-element {
  margin-top: -10px;
  left: -130px;
  top: 50%;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

@media all and (min-width: 1920px) {
  .left-element {
    left: -120px;
  }
}

@media only screen and (max-width: 1200px) {
  .left-element {
    left: -130px;
  }
}

@media only screen and (max-width: 995px) {
  .left-element {
    left: -126px;
  }
}

@media only screen and (max-width: 640px) {
  .left-element {
    left: -129px;
  }
}

.left-element.left-position {
  -webkit-transform: translateX(-200px) rotate(-90deg);
  -moz-transform: translateX(-200px) rotate(-90deg);
  -ms-transform: translateX(-200px) rotate(-90deg);
  -o-transform: translateX(-200px) rotate(-90deg);
  transform: translateX(-200px) rotate(-90deg);
}

.left-element li a,
.left-element li a:hover,
.left-element li a:visited,
.left-element li a:active,
.left-element li a:focus {
  font-family: 'anton';
  font-size: 15px;
  font-weight: 400;
  /* letter-spacing: 0.05em; */
  font-style: normal;
  text-transform: uppercase;
  text-align: center;
}

@media only screen and (max-width: 995px) {

  .left-element li a,
  .left-element li a:hover,
  .left-element li a:visited,
  .left-element li a:active,
  .left-element li a:focus {
    font-size: 13px;
  }
}

.left-element li {
  display: inline;
  padding-left: 10px;
}

.left-element li span {
  color: #999;
  padding-left: 10px;
}


/* 31. overline */
.the-overline {
  position: relative;
  width: 90px;
  height: 9px;
  text-align: left;
  background: #2e2e2e;
  margin: 1px 0 1px 0;
  z-index: 10;
}

@media all and (min-width: 1920px) {
  .the-overline {
    width: 110px;
  }
}

@media only screen and (max-width: 995px) {
  .the-overline {
    width: 90px;
    height: 7px;
  }
}

@media only screen and (max-width: 640px) {
  .the-overline {
    width: 45px;
    height: 5px;
  }
}


/* 32. section intro */
.section-intro p {
  font-family: 'anton';
  font-size: 26px;
  font-style: italic;
  font-weight: 500;
  text-transform: none;
  text-align: left;
  /* letter-spacing: 0.05em; */
  line-height: 1.5;
  margin: -9px 0 -4px 0;
}

@media only screen and (max-width: 1200px) {
  .section-intro p {
    font-size: 23px;
    margin: -6px 0 -2px 0;
  }
}

@media only screen and (max-width: 995px) {
  .section-intro p {
    font-size: 20px;
  }
}

@media only screen and (max-width: 880px) {
  .section-intro p {
    font-size: 18px;
    font-weight: 400;
    margin: -5px 0 -2px 0;
  }
}

.section-intro p a,
.section-intro p a:hover {
  text-decoration: none;
}


/* 33. quote */
.intro-quote-wrapper {
  position: absolute;
  left: 0;
  top: 0;
  margin: -68px 0 0 0;
  z-index: -1;
}

@media only screen and (max-width: 1200px) {
  .intro-quote-wrapper {
    margin: -50px 0 0 0;
  }
}

@media only screen and (max-width: 640px) {
  .intro-quote-wrapper {
    margin: -33px 0 0 0;
  }
}

.intro-quote {
  position: relative;
  color: rgba(255, 38, 74, 1);
  font-size: 200px;
}

@media only screen and (max-width: 1200px) {
  .intro-quote {
    font-size: 150px;
  }
}

@media only screen and (max-width: 640px) {
  .intro-quote {
    font-size: 100px;
  }
}


/* 34. logo */
.logo {
  position: absolute;
  display: block;
  top: 44px;
  left: 55px;

  -webkit-transition: all 1.5s ease;
  -moz-transition: all 1.5s ease;
  -ms-transition: all 1.5s ease;
  -o-transition: all 1.5s ease;
  transition: all 1.5s ease;
}

@media all and (min-width: 1920px) {
  .logo {
    top: 40px;
    left: 40px;
  }
}

@media only screen and (max-width: 1200px) {
  .logo {
    top: 30px;
    left: 30px;
  }
}

@media only screen and (max-width: 995px) {
  .logo {
    top: 20px;
    left: 20px;
  }
}

@media only screen and (max-width: 640px) {
  .logo {
    top: 15px;
    left: 15px;
  }
}


/* 35. section headings */
h2.section-heading {
  position: relative;
  font-family: 'anton';
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
  text-align: left;
  /* letter-spacing: -0.02em; */
  color: #fff;
  margin: -1px 0 0 24px;
  padding: 0;
  z-index: 10;
}

h2.section-heading.section-heading-dark {
  color: #000;
}

@media all and (min-width: 1920px) {
  h2.section-heading {
    font-size: 18px;
    margin: -1px 0 0 24px;
  }
}

@media only screen and (max-width: 995px) {
  h2.section-heading {
    font-size: 16px;
    margin: 1px 0 0 14px;
  }
}

h2.section-heading.section-heading-contact {
  margin: -1px 0 0 0;
}

h2.section-heading span {
  position: relative;
  display: inline-block;
  padding-right: 75px;
  margin-right: 25px;
  line-height: 1;
  color: #fff;
}

h2.section-heading.section-heading-dark span {
  color: #000;
}

@media all and (min-width: 1920px) {
  h2.section-heading span {
    padding-right: 90px;
    margin-right: 30px;
  }
}

@media only screen and (max-width: 995px) {
  h2.section-heading span {
    padding-right: 60px;
    margin-right: 20px;
  }
}

h2.section-heading span:before {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
  right: 0;
  width: 50px;
  height: 0;
  margin-top: -1px;
  border-top: 1px solid #fff;
}

h2.section-heading.section-heading-dark span:before {
  border-top: 1px solid #000;
}

@media all and (min-width: 1920px) {
  h2.section-heading span:before {
    width: 60px;
  }
}

@media only screen and (max-width: 995px) {
  h2.section-heading span:before {
    width: 40px;
  }
}

h2.section-heading.section-heading-all {
  padding: 0;
}


/* 36. overlay */
.overlay:before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 1;
}

.overlay-dark-20:before {
  background: rgba(0, 0, 0, .2);
  -webkit-pointer-events: none;
  -moz-pointer-events: none;
  pointer-events: none;
}

.overlay-dark-20-video:before {
  background: rgba(0, 0, 0, .2);
  -webkit-pointer-events: auto;
  -moz-pointer-events: auto;
  pointer-events: auto;
}

#overlay {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: rgba(0, 0, 0, .75);
  display: none;
  cursor: crosshair;
  z-index: 1;
}


/* 37. post txt */
.post-txt {
  position: relative;
  display: block;
  margin: 0;
  text-align: left;
}

.post-txt p {
  margin: -7px auto 0 auto;
}

.post-heading,
.post-heading-all {
  font-family: 'anton';
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
  padding: 0;
  text-align: left;
  /* letter-spacing: 0.05em; */
  color: #2e2e2e;
}

.post-heading,
.post-heading-all {
  margin: -2px auto 0 auto;
}

.post-title {
  position: relative;
  top: 0;
  font-family: 'anton';
  font-size: 55px;
  font-weight: 700;
  text-transform: uppercase;
  text-align: left;
  /* letter-spacing: -0.04em; */
  color: #2e2e2e;
  line-height: 1;
  z-index: 10;
}

.post-title.post-title-news {
  font-size: 30px;
  margin: -2px auto -1px auto;
}

@media all and (min-width: 1920px) {
  .post-title.post-title-news {
    font-size: 40px;
    margin: -4px auto -1px auto;
  }
}

.post-title.post-title-works {
  font-size: 20px;
  margin: -1px 0 0 0;
}

@media all and (min-width: 1920px) {
  .post-title.post-title-works {
    font-size: 20px;
    margin: -1px 0 0 0;
  }
}

.post-title-color {
  color: blue;
}

.post-title {
  margin: -7px auto -2px auto;
}

@media all and (min-width: 1920px) {
  .post-title {
    font-size: 65px;
    margin: -9px auto -1px auto;
  }
}

@media only screen and (max-width: 640px) {
  .post-title {
    font-size: 40px;
    margin: -4px auto -1px auto;
  }
}

.post-title a,
.post-title a:hover {
  line-height: 1.5;
  color: #fff;
}


/* 38. contact form */
#contact-form {
  width: 100%;
  margin: -20px 0 0 -15px;
  padding: 0;
}

form {
  margin: 0;
  padding: 0;
}

#form input {
  position: relative;
  width: 100%;
  height: 40px;
  border-bottom: 1px solid #000;
  border-left: none;
  border-right: none;
  border-top: none;
  padding: 5px 5px;
  background: none;
  margin: 10px 0 10px 0;
  font-family: 'anton';
  font-size: 14px;
  /* letter-spacing: 0.05em; */
  line-height: 1.5;
  font-style: normal;
  font-weight: normal;
  text-align: left;
  color: #000;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}

textarea {
  position: relative;
  width: 100%;
  height: 100px;
  border-bottom: 1px solid #000;
  border-left: none;
  border-right: none;
  border-top: none;
  padding: 5px 5px;
  background: none;
  margin: 5px;
  font-family: 'anton';
  font-size: 14px;
  /* letter-spacing: 0.05em; */
  line-height: 1.5;
  font-style: normal;
  font-weight: normal;
  text-align: left;
  color: #000;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}

#form textarea {
  margin: 10px 0 10px 0;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}

#form input:hover,
#form textarea:hover {
  border-color: rgba(255, 38, 74, .5);
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}

#form input:focus,
#form textarea:focus {
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear;
}

.success {
  font-family: 'anton';
  font-size: 10px;
  font-style: normal;
  font-weight: 500;
  /* letter-spacing: 0.15em; */
  text-transform: uppercase;
  text-align: left;
  color: #000;
  margin: 0 auto;
  padding: 25px 0 0 0;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#form .error {
  position: absolute;
  display: block;
  font-size: 9px;
  text-transform: uppercase;
  font-weight: 600;
  color: #ff264a;
  margin: 0 0 0 5px;
  padding: 0;
  /* letter-spacing: 0.15em; */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.make-space {
  margin-left: 15px;
  margin-right: 15px;
}

::-webkit-input-placeholder {
  font-size: 14px;
  color: #000;
}

:-ms-input-placeholder {
  font-size: 14px;
  color: #000;
}

::-moz-placeholder {
  font-size: 14px;
  color: #000;
}

input:-moz-placeholder {
  font-size: 14px;
  color: #000;
}

input:focus::-webkit-input-placeholder {
  color: transparent;
}

input:focus:-ms-input-placeholder {
  color: transparent;
}

input:focus::-moz-placeholder {
  color: transparent;
}

input:focus:-moz-placeholder {
  color: transparent;
}

textarea:focus::-webkit-input-placeholder {
  color: transparent;
}

textarea:focus:-ms-input-placeholder {
  color: transparent;
}

textarea:focus::-moz-placeholder {
  color: transparent;
}

textarea:focus:-moz-placeholder {
  color: transparent;
}


/* 39. divider */
.inner-divider,
.inner-divider-large,
.inner-divider-half,
.inner-divider-ultra-half,
.inner-divider-mobile {
  position: relative;
  width: 100%;
  margin: 0 auto;
  background: none;
  z-index: -1;
}

.inner-divider {
  height: 100px;
}

@media all and (min-width: 1920px) {
  .inner-divider {
    height: 50px;
  }
}

@media only screen and (max-width: 995px) {
  .inner-divider {
    height: 100px;
  }
}

@media only screen and (max-width: 640px) {
  .inner-divider {
    height: 80px;
  }
}

.inner-divider-large {
  height: 80px;
}

.inner-divider-half {
  height: 25px;
}

.inner-divider-ultra-half {
  height: 20px;
}

@media all and (min-width: 1920px) {
  .inner-divider-ultra-half {
    height: 15px;
  }
}

.inner-divider-mobile {
  display: none;
  visibility: hidden;
  height: 100px;
}

@media only screen and (max-width: 995px) {
  .inner-divider-mobile {
    display: block;
    visibility: visible;
  }
}

@media only screen and (max-width: 640px) {
  .inner-divider-mobile {
    height: 80px;
  }
}