@import url("https://fonts.googleapis.com/css?family=Lato:400,700");
html {
  background-color: #111111; }

body {
  display: block;
  min-width: 1260px; }

.otstup {
  height: 40vh; }

header {
  display: flex !important;
  background-image: url(../img/background1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh; }
  header #link {
    font-weight: 300;
    position: absolute;
    color: white;
    font-family: 'Montserrat';
    text-decoration: none;
    right: 2%;
    top: 1%;
    font-size: 14pt;
    transition: 0.7s ease-in-out; }
    header #link:hover {
      color: white;
      text-decoration: none;
      transform: scale(1.1); }

.name_xl {
  color: white;
  font-size: 5rem;
  display: block;
  position: absolute;
  line-height: 92%;
  top: 72vh;
  left: 8rem;
  font-family: 'Montserrat', sans-serif;
  font-weight: 200; }
.name_sm {
  color: white;
  display: block;
  font-family: 'Oswald', sans-serif;
  font-size: 1.5rem;
  transform: rotate(270deg) !important;
  left: -8rem;
  top: 68vh;
  letter-spacing: 8px;
  font-weight: 300;
  position: absolute; }

.right_line {
  background-color: #ab301f;
  box-shadow: -5px -5px 40px #0000007a;
  overflow: hidden; }

.container {
  width: 400px;
  position: absolute;
  width: 300px;
  bottom: 12vh;
  right: 8vw; }

header a {
  text-transform: uppercase;
  text-decoration: none;
  font-weight: 700; }

@keyframes top {
  from {
    transform: translate(0rem, 0); }
  to {
    transform: translate(0rem, 3.5rem); } }
@keyframes bottom {
  from {
    transform: translate(-11.5rem, 0); }
  to {
    transform: translate(0rem, 0); } }
.btn {
  position: relative;
  letter-spacing: 0.15em;
  margin: 0 auto;
  padding: 1rem 2.5rem;
  background: transparent;
  outline: none;
  font-size: 35px;
  color: #ececec;
  transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.15s;
  text-transform: uppercase;
  cursor: pointer; }
  .btn span {
    z-index: 999; }
  .btn::after, .btn::before {
    content: "";
    position: absolute;
    height: 40%;
    width: 12%;
    transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    border-radius: 50%; }
  .btn::before {
    background-color: #ab301f;
    top: -0.75rem;
    left: 0.5rem;
    animation: top 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.25s infinite alternate; }
  .btn::after {
    background-color: #e74c3c;
    top: 3rem;
    left: 13rem;
    animation: bottom 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.5s infinite alternate; }
  .btn:hover {
    color: white;
    cursor: pointer; }
    .btn:hover::before, .btn:hover::after {
      top: 0;
      z-index: -1;
      height: 100%;
      width: 100%;
      border-radius: 0;
      animation: none; }
    .btn:hover::after {
      left: 0rem; }
    .btn:hover::before {
      top: 0.5rem;
      left: 0.35rem; }

.aos-all {
  margin: 10vh auto 0 auto; }

.aos-item {
  display: inline-block;
  float: left;
  width: 33.3333%;
  height: 300px;
  padding: 20px; }

.aos-item__inner {
  position: relative;
  width: 100%;
  height: 100%;
  float: left;
  background: #1da4e2;
  line-height: 260px;
  text-align: center;
  color: #fff; }

@media screen and (max-width: 800px) {
  .aos-item {
    width: 50%; } }
.headfoto {
  width: 100%;
  height: 35vh;
  position: absolute; }
  .headfoto_img {
    width: 100%;
    margin: 0;
    display: block;
    position: relative;
    box-shadow: 2px 2px 20px #00000040; }
  .headfoto_text {
    position: absolute;
    font-family: 'Montserrat';
    font-size: 32pt;
    top: 50%;
    left: 25%;
    text-shadow: 2px 2px 0px white;
    color: #e74c3c;
    width: 50%;
    text-align: end; }
    .headfoto_text span {
      font-size: 20pt;
      margin: 0% 0 0 35%;
      line-height: 200%;
      font-weight: 300; }

@media screen and (max-width: 1900px) {
  .headfoto_text {
    font-size: 22pt;
    top: 40%; }

  #wrap {
    top: 28%; } }
@media screen and (max-width: 1550px) {
  .headfoto_text {
    font-size: 16pt;
    top: 35%; }

  #wrap {
    top: 20%; } }
.wrap {
  -webkit-perspective: 500px;
  -ms-perspective: 500px;
  perspective: 500px;
  -webkit-perspective-origin: 50% 50%;
  -ms-perspective-origin: 50% 50%;
  perspective-origin: 50% 50%;
  float: left;
  position: absolute;
  top: 33%;
  right: 7%; }

.cube {
  position: relative;
  width: 10vw;
  height: 10vw;
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d; }

.face {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 10vw;
  height: 10vw;
  color: #1F0405;
  font-size: 16px;
  text-align: center;
  line-height: 70px;
  border-radius: 4px;
  box-shadow: inset 0 0 0 2px #705E5F; }

.front {
  -webkit-transform: translateZ(5vw);
  -ms-transform: translateZ(5vw);
  transform: translateZ(5vw);
  background: #fff; }

.back {
  -webkit-transform: translateZ(-5vw) rotateY(-180deg);
  -ms-transform: translateZ(-5vw) rotateY(-180deg);
  transform: translateZ(-5vw) rotateY(-180deg);
  background: #fff; }

.left {
  -webkit-transform: translateX(-5vw) rotateY(-90deg);
  -ms-transform: translateX(-5vw) rotateY(-90deg);
  transform: translateX(-5vw) rotateY(-90deg);
  background: #fff; }

.rght {
  -webkit-transform: translateX(5vw) rotateY(90deg);
  -ms-transform: translateX(5vw) rotateY(90deg);
  transform: translateX(5vw) rotateY(90deg);
  background: #fff; }

.rotate-y {
  -webkit-animation: spinY 20s infinite linear;
  -ms-animation: spinY 20s infinite linear;
  animation: spinY 20s infinite linear; }

@-webkit-keyframes spinY {
  from {
    -webkit-transform: rotateY(0);
    -ms-transform: rotateY(0);
    transform: rotateY(0); }
  to {
    -webkit-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    transform: rotateY(360deg); } }
@keyframes spinY {
  from {
    -webkit-transform: rotateY(0);
    -ms-transform: rotateY(0);
    transform: rotateY(0); }
  to {
    -webkit-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    transform: rotateY(360deg); } }
.preview {
  width: 30vw;
  position: relative;
  display: inline-block;
  margin: 25% auto 2%;
  text-align: center; }
  .preview img {
    position: relative;
    display: block;
    width: 30%;
    margin: 2% auto;
    opacity: 0.4;
    transition: 0.7s ease-in-out; }
    .preview img:hover {
      opacity: 0.7; }
  .preview P {
    font-size: 1.5rem;
    font-family: 'Montserrat';
    margin: 2% 2%; }
    .preview P span {
      font-size: 2rem;
      color: #e74c3c;
      font-weight: 700;
      line-height: 2; }

.container_foto {
  display: flex;
  position: relative;
  width: 100%;
  padding: 4% 2%;
  box-sizing: border-box;
  font-family: 'Oswald', sans-serif; }

.box {
  flex: 1;
  overflow: hidden;
  transition: .5s;
  margin: 0 2%;
  box-shadow: 0px 15px 10px rgba(0, 0, 0, 0.1);
  line-height: 0;
  filter: saturate(0.4); }

.box > img {
  height: 30vh;
  width: 150%;
  object-fit: cover;
  transition: .5s; }

.box > span {
  font-size: 1.5vh;
  display: block;
  text-align: center;
  height: 10vh;
  line-height: 1.2;
  margin: 2% 3%;
  font-weight: 300;
  text-decoration: none;
  font-family: monospace; }
  .box > span:hover {
    text-decoration: none; }

.razdel_text {
  margin: 0 4%;
  text-align: justify;
  font-size: 16pt;
  font-family: 'Montserrat';
  font-weight: 300;
  line-height: 150%;
  color: #3c3c3c; }
  .razdel_text p {
    margin: 2% 0; }
    .razdel_text p::first-letter {
      font-size: 25pt;
      font-weight: 800;
      color: #e74c3c; }

#p_prldr {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: #d6d6d6;
  z-index: 100; }

.contpre small {
  font-size: 25px; }

.contpre {
  font-family: 'Montserrat', sans-serif;
  position: absolute;
  left: 42%;
  top: 38%;
  color: #fff;
  font-size: 40px;
  letter-spacing: -2px;
  text-align: center;
  line-height: 35px; }

#p_prldr .svg_anm {
  position: absolute;
  width: 25vh;
  height: 25vh;
  background: url(../img/preloader.gif) center center no-repeat;
  background-size: 25vh; }

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