/* =====================================================================================================================
 ** Defaults
 */
*,*:before,*:after{ box-sizing:border-box; }
html { min-width:1024px; height: 500%; min-height: 3840px; max-height: 5400px; font-size: 10px; }
body {
    font-family: 'HelveticaNeueCyr', sans-serif; height: 100%; font-size: 1.4rem; background-color: #fff;
    line-height: 1.3; color: #1b1b1b; }
a { color:inherit }
hr { border:0; border-top:1px solid #eee; margin:20px 0; }

/* =====================================================================================================================
 ** Preloader
 */
#preloader {
    position: fixed; z-index: 3000; top: 0; right: 0; width: 100%; height: 100%; overflow: hidden; background-color: #fff; }
#preloader img { position: absolute; right: 50%; top: 50%; display: block; margin: -30px -42px 0 0; z-index: 1; }
#preloader .yellow-line {
    position: absolute; left: 0; top: 0; bottom: 0; width: 0; background-color: #ffd23f; z-index: 2;
    -webkit-transition: width 0.6s; transition: width 0.6s;}
#preloader.close .yellow-line { width: 300px; }

/* =====================================================================================================================
 ** Sidebar
 */
.sidebar {
    position: fixed; z-index: 1001; top: 0; left: 0; bottom: 0; width: 140px; overflow: hidden; padding-top: 120px;
    background-color: transparent; border-right: 1px solid #eee; }
.sidebar .burg-btn {
    border: none; background: transparent url('/resources/img/vacancy_designer/burg.png') no-repeat center; outline: 0; cursor: pointer;
    position: absolute; z-index: 2; top: 50%; left: 50%; width: 26px; height: 26px; margin-left: -13px; margin-top: -13px;
    -webkit-transition: left .25s; transition: left .25s; }
.sidebar.show-menu .burg-btn { left: -50%; }

.sidebar nav {
    line-height: 1; font-size: 1.2rem; color: #2e2e2e; height: 100%; position: relative; z-index: 1;
    right: -100%; -webkit-transition: right .25s; transition: right .25s; }
.sidebar.show-menu nav { right: 0; }
.sidebar nav ul { margin: 0; padding: 0;list-style: none; height: 100%; }
.sidebar nav ul li { display: block; height: 33.333333%; border-bottom: 1px solid #eee; }
.sidebar nav ul li:last-child { border-bottom: none; }

.sidebar nav ul li .soon,
.sidebar nav ul li a {
    text-decoration: none; width: 100%; height: 100%; text-align: center; display: flex; align-items: center;
    -webkit-align-items: center; justify-content: center; -webkit-justify-content: center; }
.sidebar nav ul li .soon span,
.sidebar nav ul li a span {
    display: block; min-width: 200px; padding: 5px; -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }
.sidebar nav ul li .soon span { color: #cccccc; }

@media screen and (max-width: 1365px) {
    .sidebar {  width: 120px; }
}

/* =====================================================================================================================
 ** Header
 */
header {
    position: fixed; z-index: 1002; top: 0; left: 0; right: 0; height: 120px; background-color: transparent; border-bottom: 1px solid #eee;
    -webkit-transition: background-color .3s, -webkit-filter 300ms linear;
    transition: background-color .3s, filter 300ms linear; }
header.fill { background-color: #fff; }
header > .row { height: 100%; }

header .logo { display: block; width: 140px; text-align: center; }
header .logo a {
    text-decoration: none; height: 119px; display: block; border-right: 1px solid #eee;
    background: url('/resources/img/vacancy_designer/logo_black.png') no-repeat center; }

header nav { line-height: 1; font-size: 1.6rem; text-align: right; }
header nav ul {
    margin: 0; width: 400px; padding: 0; list-style: none; -webkit-transition: width .3s ease-in-out;
    transition: width .3s ease-in-out; }
header nav ul.left { width: 100%; }
header nav ul li { display: inline-block; margin: 0 15px; }
header nav ul li a { display: block; padding: 5px; text-decoration: none; position: relative; }
header nav ul li a::after {
    content: ''; display: block; position: absolute; bottom: 12px; left: -3px; height: 3px; background-color: #ffd23f;
    width: 0; -webkit-transition: width .25s; transition: width .25s; }
header nav ul li a.active::after { width: 15px; }

header .send { display: block; width: 120px; text-align: center; }
header .send span {
    text-decoration: none; height: 119px; display: block; border-left: 1px solid #eee; cursor: pointer;
    background: url('/resources/img/vacancy_designer/send.png') no-repeat center; }

@media screen and (max-width: 1365px) {
    header .logo { width: 120px; }
}

/* =====================================================================================================================
 ** Modal
 */
.modal {
    position: fixed; z-index: 2001; top: 0; right: -100%; bottom: 0; width: 100%; overflow: hidden; padding-left: 140px }
.modal .left-bar {
    position: absolute; z-index: 1; top: 0; left: 0; bottom: 0; width: 140px; overflow: hidden;
    background-color: #fff; border-right: 1px solid #eee }
.modal .left-bar .logo {
    height: 120px; display: block; border-bottom: 1px solid #eee;
    background: url(/resources/img/vacancy_designer/logo_black.png) no-repeat center }
.modal .right-bar {
    position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; width: 120px; overflow: hidden;
    background: url(/resources/img/vacancy_designer/modal_bg.jpg) no-repeat center; background-size: cover }
.modal .close-modal {
    position: absolute; z-index: 2; top: 0; right: 0; width: 120px; height: 120px; cursor: pointer;
    background: url(/resources/img/vacancy_designer/modal_close.png) no-repeat center }

.modal form { height: 100%; padding-right: 120px; background-color: #fff }
.modal form .heading {
    height: 28%; padding: 0 40px 0 60px; display: -webkit-box; display: -ms-flexbox; display: flex;
    align-items: center; -webkit-align-items: center; border-bottom: 1px solid #eee }
.modal form .heading h1 {
    font-size: 7.8rem; line-height: 1; color: #fff; font-weight: 600; margin: 0 0 30px;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black }
@supports(-webkit-text-stroke: 1px black){
    .modal form .heading h1 { color: transparent; -webkit-text-stroke: 1px #000; text-shadow: none }}
.modal form .heading .lead { margin: 0; font-size: 2.5rem; font-weight: 600; padding-left: 60px }
.modal form .heading .lead > span { color: #cccccc; text-decoration: line-through; font-weight: 500 }
.modal form .element {
    height: 12%; border-bottom: 1px solid #eee;display: -webkit-box; display: -ms-flexbox; display: flex;
    align-items: center; -webkit-align-items: center; padding: 0 40px 0 60px }
.modal form .element.btn-wrap {
    -webkit-justify-content: flex-end; justify-content: flex-end; padding-right: 60px; position: relative }

.modal form .element.btn-wrap .progress {
    position: absolute; left: 0; top: 0; width: 100%; height: 5px; background-color: #eee; overflow: hidden }
.modal form .element.btn-wrap .progress:before{
    display: block; position: absolute; content: ""; left: -200px; width: 200px; height: 4px;
    background-color: #ffd23f; animation: loading 2s linear infinite }
@keyframes loading {
    from {left: -30%; width: 30%;}
    50% {width: 30%;}
    70% {width: 70%;}
    80% { left: 50%;}
    95% {left: 120%;}
    to {left: 100%;}
}

.modal form ::-webkit-input-placeholder { color: #cccccc; font-weight: 500 }
.modal form ::-moz-placeholder { color: #cccccc; font-weight: 500 }
.modal form :-ms-input-placeholder { color: #cccccc; font-weight: 500 }
.modal form :-moz-placeholder { color: #cccccc; font-weight: 500 }
.modal form input.input { font-size: 2.5rem; width: 100%; height: 50px; outline: 0; border: none }

.modal form input.inputfile { display: none }
.modal form .inputfile-label {
    display: inline-block; height: 50px; line-height: 50px; font-size: 2.5rem; cursor: pointer;
    color: #cccccc; font-weight: 500; width: 100% }
.modal form .inputfile-label.active { color: inherit; font-weight: 400 }

.modal form .error-message { font-size: 1.4rem; line-height: 1.2; text-align: left; display: block; color: #da2d2d }
.modal form input.submit-btn {
    cursor: pointer; font-weight: 500; font-size: 1.4rem; border: none; outline: 0; padding: 5px 43px 5px 8px;
    margin: 0; background: url(/resources/img/vacancy_designer/arrow_yellow.png) transparent no-repeat right 10px }

/* Success block */
.modal .success-block {
    height: 100%; padding: 40px 80px; font-size: 2.5rem; font-weight: 600; overflow-y: auto;
    background-color: rgba(255, 255, 255, .6) }
.modal .success-block .max-width { max-width: 1000px }

.modal .success-block .three {
    font-size: 25.0rem; line-height: 1; color: #fff; font-weight: 600;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black }
@supports(-webkit-text-stroke: 1px black){
    .modal .success-block .three { color: transparent; -webkit-text-stroke: 1px #000; text-shadow: none }}
.modal .success-block .caption {
    font-size: 7.8rem; line-height: 1; color: #1b1b1b; font-weight: 600; margin: 0 0 65px; text-align: center }
.modal .success-block .caption > span { display: inline-block; position: relative; padding-bottom: 25px }
.modal .success-block .caption > span:after {
    content: ""; display: block; position: absolute; bottom: 0; left: -21px; height: 8px; width: 430px; background-color: #ffd23f }
.modal .success-block .lead { margin: 0 0 45px; line-height: 1.6 }
.modal .success-block .lead > span { color: #ffd23f }

.modal .success-block ol { margin: 0; counter-reset: item; padding: 0 0 0 25px }
.modal .success-block ol li { display: block; margin-bottom: 25px }
.modal .success-block ol li:before {
    content: counter(item) ". "; counter-increment: item; color: #ffd23f }

/* Blur animation */
.sidebar, .block { -webkit-transition: -webkit-filter 300ms linear; transition: filter 300ms linear }
body.blur header,
body.blur .sidebar,
body.blur .block { -webkit-filter: blur(16px); filter: blur(16px) }

@media screen and (max-width: 1365px) {
    .modal form .heading h1 { font-size: 5.4rem; margin: 0 0 20px }
    .modal form .heading .lead { font-size: 2.0rem; padding-left: 0 }

    .modal .success-block { padding: 30px 60px; font-size: 2.0rem }
    .modal .success-block .three { font-size: 20.0rem }
    .modal .success-block .caption { font-size: 6.0rem; margin: 0 0 45px }
    .modal .success-block .lead { margin: 0 0 30px }
    .modal .success-block ol li { margin-bottom: 20px }
}

/* =====================================================================================================================
 ** All blocks
 */
.block { height: 20%; min-height: 768px; max-height: 1080px; position: relative; overflow: hidden; }

/* =====================================================================================================================
 ** Block 1
 */
#block-1 { padding-left: 140px; }
#block-1 > .row { height: 100%; align-items: stretch; -webkit-align-items: stretch; }

#block-1 .main-text {
    text-shadow: #FFF 0 0 20px, #FFF 0 0 10px; position: relative;
    -webkit-justify-content: center; justify-content: center; align-items: center; -webkit-align-items: center; }
#block-1 .main-text > .col-auto { max-width: 750px; position: relative; z-index: 4; }
#block-1 .main-text h1 { font-size: 7.8rem; line-height: 1; color: #1b1b1b; margin: 0 0 90px; font-weight: 600; }
#block-1 .main-text h1 .border-text {
    display: block; font-weight: 700; color: #fff; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    margin-bottom: 20px; }
@supports(-webkit-text-stroke: 1px black){
    #block-1 .main-text h1 .border-text { -webkit-text-stroke: 1px #000; text-shadow: none; }}
#block-1 .main-text h1 .yellow-underline { display: block; text-align: right; }
#block-1 .main-text h1 .yellow-underline > span {
    display: inline-block; position: relative; padding: 0 0 25px 25px; width: 555px; height: 103px;
    white-space: nowrap; vertical-align: bottom; }
#block-1 .main-text h1 .yellow-underline > span:after {
    content: ""; display: block; position: absolute; bottom: 0; left: 0; height: 8px; width: 428px; background-color: #ffd23f; }
#block-1 .main-text h1 .yellow-underline > span > span { display: block; position: absolute; left: 25px; top: 0; }
#block-1 .main-text .lead { margin: 0; font-size: 2.5rem; font-weight: 600; line-height: 1.8; }

#block-1 .main-text .send {
    position: absolute; z-index: 1; bottom: 0; left: 0; right: 0; height: 120px; border-top: 1px solid #eee;
    line-height: 1; font-weight: 500; }
#block-1 .main-text .send > span {
    display: block; width: 200px; padding: 5px; position: absolute; left: 50%; top: 50%; margin-left: -100px;
    margin-top: -12px; cursor: pointer; }
#block-1 .main-text .send > span:after {
    content: ""; display: block; position: absolute; right: 5px; top: 10px; width: 26px; height: 6px;
    background: url(/resources/img/vacancy_designer/arrow_yellow.png) no-repeat;}

#block-1 .right-part { background: url('/resources/img/vacancy_designer/yellow_bg.jpg') #fff no-repeat center; position: relative; }
#block-1 .right-part .ceasar {
    width: 599px; height: 813px; background: url("/resources/img/vacancy_designer/cesar.png") no-repeat left top;
    position: absolute; z-index: 2; bottom: 0; right: 120px; }
#block-1 .right-part .ceasar .line {
    position: absolute; transition: transform .2s linear; -webkit-transition: -webkit-transform .2s linear; }
#block-1 .right-part .ceasar .line.line-1 {
    background: url("/resources/img/vacancy_designer/ceasar_line_1.png") no-repeat; width: 9px; height: 564px; left: 146px; top: 249px; }
#block-1 .right-part .ceasar .line.line-2 {
    background: url("/resources/img/vacancy_designer/ceasar_line_2.png") no-repeat; width: 7px; height: 589px; left: 214px; top: 224px; }
#block-1 .right-part .ceasar .line.line-3 {
    background: url("/resources/img/vacancy_designer/ceasar_line_3.png") no-repeat; width: 7px; height: 805px; left: 308px; top: 8px; }
#block-1 .right-part .ceasar .line.line-4 {
    background: url("/resources/img/vacancy_designer/ceasar_line_4.png") no-repeat; width: 9px; height: 812px; left: 351px; top: 1px; }
#block-1 .right-part .ceasar .line.line-5 {
    background: url("/resources/img/vacancy_designer/ceasar_line_5.png") no-repeat; width: 7px; height: 523px; left: 388px; top: 290px; }
#block-1 .right-part .ceasar .line.line-6 {
    background: url("/resources/img/vacancy_designer/ceasar_line_6.png") no-repeat; width: 10px; height: 336px; left: 452px; top: 477px; }
#block-1 .right-part img.keys { position: absolute; z-index: 3; bottom: 533px; left: -152px; }

#block-1 .right-line { position: absolute; z-index: 5; top: 0; right: 119px; bottom: 0; width: 1px; background-color: #eee; }

@media screen and (max-width: 1599px) {
    #block-1 .right-part .ceasar { right: 0; }
}

@media screen and (max-width: 1365px) {
    #block-1 { padding-left: 120px; }
    #block-1 .main-text h1 { font-size: 6.0rem; margin: 0 0 60px; }
    #block-1 .main-text h1 .border-text { margin-bottom: 10px; font-size: 5.4rem; }
    #block-1 .main-text h1 .yellow-underline > span { width: 435px; height: 85px; }
    #block-1 .main-text h1 .yellow-underline > span:after {  width: 335px; }
    #block-1 .main-text .lead { font-size: 2.0rem; }
}

@media screen and (max-height: 899px) {
    #block-1 .right-part .ceasar { width: 500px; height: 678px; /*background-size: 500px auto;*/ }
    #block-1 .right-part img.keys { bottom: 485px; }
}

/* =====================================================================================================================
 ** Block 2
 */
#block-2 { border-top: 1px solid #eee; padding-left: 140px; }
#block-2 > .row { height: 60%; align-items: center; -webkit-align-items: center; padding-top: 120px; padding-right: 120px; }
#block-2 h1 {
    font-size: 7.8rem; line-height: 1; color: #fff; font-weight: 600; margin: 0 0 60px; padding-left: 40px;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; }
@supports(-webkit-text-stroke: 1px black){
    #block-2 h1 { color: transparent; -webkit-text-stroke: 1px #000; text-shadow: none; }}
#block-2 .lead { margin: 0; font-size: 2.5rem; font-weight: 600; line-height: 1.8; padding-left: 150px; }
#block-2 .lead strong { font-weight: 600; color: #ffd23f; }

#block-2 .projects { height: 40%; }
#block-2 .projects .swiper-container { width: 100%; height: 100%; }
#block-2 .projects .swiper-button-next,
#block-2 .projects .swiper-button-prev {
    width: 100%; height: 120px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; margin-top: 0;
    top: auto; background-size: 5px 9px; }
#block-2 .projects .swiper-button-next { right: 0; bottom: 0; background-image: url("/resources/img/vacancy_designer/next_right.png"); }
#block-2 .projects .swiper-button-prev { left: 0; bottom: 120px; background-image: url("/resources/img/vacancy_designer/prev_left.png"); }

#block-2 .projects .swiper-slide .project {
    overflow: hidden; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat;
    background-size: cover; background-color: #999; color: #fff; line-height: 1; }
#block-2 .projects .swiper-slide .project.umag { background-image: url('/resources/img/vacancy_designer/slider_umag_bg.jpg'); }
#block-2 .projects .swiper-slide .project.btc { background-image: url('/resources/img/vacancy_designer/slider_btc_bg.jpg'); }
#block-2 .projects .swiper-slide .project.zapis { background-image: url('/resources/img/vacancy_designer/slider_zapis_bg.jpg'); }
#block-2 .projects .swiper-slide .project.khan { background-image: url('/resources/img/vacancy_designer/slider_khan_bg.jpg'); }

#block-2 .projects .swiper-slide .project .wrapper {
    height: 200%; position: relative; top: 0; -webkit-transition: top .4s .2s ease-in-out; transition: top .4s .2s ease-in-out; }
#block-2 .projects .swiper-slide .project .wrapper .logo,
#block-2 .projects .swiper-slide .project .wrapper .description {
    height: 50%; 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; }
#block-2 .projects .swiper-slide .project .wrapper .description { line-height: 1.6; padding: 30px; }
#block-2 .projects .swiper-slide .project .wrapper .description p { max-width: 400px; }
#block-2 .projects .swiper-slide .project .wrapper .description p span { display: block; text-align: right; margin-top: 35px; line-height: 1; }
#block-2 .projects .swiper-slide .project .wrapper .description p a {
    padding-right: 40px; text-decoration: none; display: inline-block; background: url(/resources/img/vacancy_designer/arrow.png) no-repeat right 5px; }
#block-2 .projects .swiper-slide .project .wrapper .description p a:hover { text-decoration: underline; }
#block-2 .projects .swiper-slide .project:hover .wrapper { top: -100%; }
#block-2 .projects .swiper-slide .project .count {
    position: absolute; top: 28px; left: 28px; z-index: 1; font-size: 12px; font-weight: 600; }

#block-2 .projects .right-bar {
    position: absolute; z-index: 1; top: 0; right: 0; height: 60%; width: 120px; overflow: hidden;
    background-color: transparent; border-left: 1px solid #eee; }

@media screen and (max-width: 1599px) {
    #block-2 .lead br { display: none; }
}

@media screen and (max-width: 1365px) {
    #block-2 { padding-left: 120px; }
    #block-2 h1 { font-size: 5.4rem; padding-left: 20px; margin: 0 0 40px; }
    #block-2 .lead { font-size: 2.0rem; padding-left: 80px; }
}

/* =====================================================================================================================
 ** Block 3
 */
#block-3 { border-top: 1px solid #eee; padding-left: 140px; }
#block-3 > .row { height: 60%; align-items: center; -webkit-align-items: center; padding-top: 120px; padding-right: 120px; }
#block-3 h1 {
    font-size: 7.8rem; line-height: 1; color: #fff; font-weight: 600; margin: 0 0 60px; padding-left: 40px;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; }
@supports(-webkit-text-stroke: 1px black){
    #block-3 h1 { color: transparent; -webkit-text-stroke: 1px #000; text-shadow: none; }}
#block-3 .lead { margin: 0; font-size: 2.5rem; font-weight: 600; line-height: 1.8; padding-left: 150px; }
#block-3 .lead span { color: #ffd23f; }

#block-3 .vacancy { height: 40%; border-top: 1px solid #eee; border-bottom: 1px solid #eee; }
#block-3 .vacancy .swiper-container { width: 100%; height: 100%; }
#block-3 .vacancy .swiper-button-next,
#block-3 .vacancy .swiper-button-prev {
    width: 100%; height: 120px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; margin-top: 0;
    top: auto; background-size: 5px 9px; }
#block-3 .vacancy .swiper-button-next { right: 0; bottom: 0; background-image: url("/resources/img/vacancy_designer/next_right.png"); }
#block-3 .vacancy .swiper-button-prev { left: 0; bottom: 120px; background-image: url("/resources/img/vacancy_designer/prev_left.png"); }

#block-3 .vacancy .swiper-slide {
    padding: 50px 60px 0; line-height: 1.2; background-color: #fff; font-size: 1.4rem; color: #1b1b1b;  border-right: 1px solid #eee;  }
#block-3 .vacancy .swiper-slide h2 { color: #1b1b1b; font-size: 2.5rem; font-weight: 600; margin: 0 0 30px; line-height: 1.1; }
#block-3 .vacancy .swiper-slide h2 > span { color: #ffd23f; }
#block-3 .vacancy .swiper-slide ul { padding: 0; margin: 0; list-style: none; }
#block-3 .vacancy .swiper-slide ul li {
    background: url('/resources/img/vacancy_designer/dot.png') no-repeat 0 6px; display: block; padding-left: 25px; margin-bottom: 20px; }
#block-3 .vacancy .swiper-slide ul li > span { color: #cccccc; }
#block-3 .vacancy .swiper-slide ul li > span.lt { text-decoration: line-through; }

#block-3 .vacancy .swiper-slide.quote { font-size: 3.5rem; font-weight: 600; line-height: 1.3; padding: 0; }
#block-3 .vacancy .swiper-slide.quote > p { background: url('/resources/img/vacancy_designer/quote.png') no-repeat 42px 32px; padding: 60px 60px 0; }
#block-3 .vacancy .swiper-slide.quote > p > .highlight { color: #ffd23f; }

#block-3 .vacancy .swiper-slide.send { padding: 0; line-height: 1; border: none; width: 120px;  }
#block-3 .vacancy .swiper-slide.send > span {
    display: block; width: 100%; height: 100%; position: relative; background-color: #ffd23f; color: #fff; cursor: pointer;
    font-weight: 500; -webkit-transition:  background-color .25s; transition:  background-color .25s; }
#block-3 .vacancy .swiper-slide.send > span:hover { background-color: #f9bf00; }
#block-3 .vacancy .swiper-slide.send > span > span {
    display: block; width: 190px; position: absolute; left: 50%; top: 50%; margin-left: -95px; margin-top: -7px; z-index: 1;
    -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }
#block-3 .vacancy .swiper-slide.send > span > span:after {
    content: ""; display: block; position: absolute; z-index: 1; right: 0; top: 5px; width: 26px; height: 6px;
    background: url('/resources/img/vacancy_designer/arrow.png') no-repeat; }

#block-3 .vacancy .right-bar {
    position: absolute; z-index: 1; top: 0; right: 0; height: 60%; width: 120px; overflow: hidden;
    background-color: transparent; border-left: 1px solid #eee; }

@media screen and (max-width: 1599px) {
    #block-3 .lead br { display: none; }
    #block-3 .vacancy .swiper-slide br { display: none; }

    #block-3 .vacancy .swiper-slide.quote { font-size: 2.8rem; }
}

@media screen and (max-width: 1365px) {
    #block-3 { padding-left: 120px; }
    #block-3 h1 { font-size: 5.4rem; padding-left: 20px; margin: 0 0 40px; }
    #block-3 .lead { font-size: 2.0rem; padding-left: 80px; }

    #block-3 .vacancy .swiper-slide { padding: 20px 20px 0; }
    #block-3 .vacancy .swiper-slide h2 { font-size: 2.2rem; margin: 0 0 15px; }
    #block-3 .vacancy .swiper-slide ul li { margin-bottom: 10px; }

    #block-3 .vacancy .swiper-slide.quote { font-size: 2.2rem; }
    #block-3 .vacancy .swiper-slide.quote > p { padding: 40px 40px 0; background-position: 20px 10px; }
}

/* =====================================================================================================================
 ** Block 4
 */
#block-4 > .row { height: 100%; align-items: stretch; -webkit-align-items: stretch; }
#block-4 .left-part { background: url('/resources/img/vacancy_designer/yellow_bg.jpg') #fff no-repeat center; }
#block-4 h1 {
    display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; -webkit-align-items: center;
    padding-top: 120px; padding-left: 180px; position: absolute; top: 0; left: 0; width: 100%; z-index: 1; height: 40%;
    font-size: 7.8rem; line-height: 1.1; color: #fff; font-weight: 600; margin: 0;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; }
@supports(-webkit-text-stroke: 1px black){
    #block-4 h1 { color: transparent; -webkit-text-stroke: 1px #000; text-shadow: none; }}

#block-4 .empty { height: 40%; }

#block-4 .faq { height: 60%; border-top: 1px solid #eee; padding-right: 120px; }
#block-4 .faq .swiper-container { width: 100%; height: 100%; }
#block-4 .faq .swiper-button-next,
#block-4 .faq .swiper-button-prev {
    width: 100%; height: 10%; border-top: 1px solid #eee; border-bottom: 1px solid #eee; margin-top: 0;
    bottom: auto; background-size: 9px 5px; }
#block-4 .faq .swiper-button-next { right: 0; top: 50%; background-image: url("/resources/img/vacancy_designer/next_bottom.png"); }
#block-4 .faq .swiper-button-prev { left: 0; top: 40%; background-image: url("/resources/img/vacancy_designer/prev_top.png"); }

#block-4 .faq .swiper-slide {
    padding: 20px 20px 20px 0; line-height: 1.2; background-color: #fff; font-size: 1.4rem; color: #666666; border-bottom: 1px solid #eee;
    display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-align: center;
    -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
#block-4 .faq .swiper-slide .paddin-1-level h2 { padding-left: 7%; }
#block-4 .faq .swiper-slide .paddin-1-level p { padding-left: 14%; }
#block-4 .faq .swiper-slide .paddin-2-level h2 { padding-left: 14%; }
#block-4 .faq .swiper-slide .paddin-2-level p { padding-left: 28%; }
#block-4 .faq .swiper-slide .paddin-3-level h2 { padding-left: 21%; }
#block-4 .faq .swiper-slide .paddin-3-level p { padding-left: 42%; }
#block-4 .faq .swiper-slide h2 { color: #1b1b1b; font-size: 2.5rem; font-weight: 600; line-height: 1.1; margin: 0 0 30px; }

#block-4 .faq .right-bar {
    position: absolute; z-index: 2; top: 0; right: 0; height: 100%; width: 120px; overflow: hidden;
    background-color: transparent; border-left: 1px solid #eee; }

@media screen and (max-width: 1365px) {
    #block-4 h1 { font-size: 5.4rem; padding-left: 160px; }
    #block-4 .faq .swiper-slide h2 { font-size: 2.2rem; margin: 0 0 15px; }
}

/* =====================================================================================================================
 ** Block 5
 */
#block-5 { border-top: 1px solid #eee; padding-left: 140px; padding-top: 120px; }
#block-5 > .row { height: 100%; align-items: stretch; -webkit-align-items: stretch; }
#block-5 h1 {
    display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; -webkit-align-items: center;
    justify-content: center; -webkit-justify-content: center; padding: 0 40px; height: 40%; font-size: 7.8rem;
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; border-bottom: 1px solid #eee;
    line-height: 1; color: #fff; font-weight: 600; margin: 0; }
@supports(-webkit-text-stroke: 1px black){
    #block-5 h1 { color: transparent; -webkit-text-stroke: 1px #000; text-shadow: none; }}

#block-5 .contact {
    height: 30%; border-bottom: 1px solid #eee; color: #1b1b1b; font-size: 2.5rem; font-weight: 600; line-height: 1.6;
    display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; -webkit-align-items: center;
    justify-content: center; -webkit-justify-content: center; }
#block-5 .contact > p {
    width: 375px; white-space: nowrap; padding-left: 35px; background: url('/resources/img/vacancy_designer/dot_big.png') no-repeat 0 16px; }

#block-5 #map { background-color: #ffd23f; width: 100%; height: 100%; }

@media screen and (max-width: 1365px) {
    #block-5 { padding-left: 120px; }
    #block-5 h1 { font-size: 5.4rem; }
}

/* =====================================================================================================================
 ** Animations
 */
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; }

@-webkit-keyframes fadeInDown {
    from { opacity: 0; -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0); }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0); }
}
@keyframes fadeInDown {
    from { opacity: 0; -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0); }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0); }
}
.fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; }

@-webkit-keyframes fadeOutDown {
    from { opacity: 1; }
    to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0); }
}
@keyframes fadeOutDown {
    from { opacity: 1; }
    to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0); }
}
.fadeOutDown {-webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; }

/* =====================================================================================================================
 ** Fonts
 */
@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-Medium.eot');
    src: local('HelveticaNeueCyr-Medium'),
    url('/resources/fonts/HelveticaNeueCyr-Medium.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-Medium.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-Heavy.eot');
    src: local('HelveticaNeueCyr-Heavy'),
    url('/resources/fonts/HelveticaNeueCyr-Heavy.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-Heavy.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-Heavy.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-HeavyItalic.eot');
    src: local('HelveticaNeueCyr-HeavyItalic'),
    url('/resources/fonts/HelveticaNeueCyr-HeavyItalic.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-HeavyItalic.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-HeavyItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-Black.eot');
    src: local('HelveticaNeueCyr-Black'),
    url('/resources/fonts/HelveticaNeueCyr-Black.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-Black.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-UltraLightItalic.eot');
    src: local('HelveticaNeueCyr-UltraLightItalic'),
    url('/resources/fonts/HelveticaNeueCyr-UltraLightItalic.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-UltraLightItalic.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-UltraLightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-BlackItalic.eot');
    src: local('HelveticaNeueCyr-BlackItalic'),
    url('/resources/fonts/HelveticaNeueCyr-BlackItalic.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-BlackItalic.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-ThinItalic.eot');
    src: local('HelveticaNeueCyr-ThinItalic'),
    url('/resources/fonts/HelveticaNeueCyr-ThinItalic.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-ThinItalic.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-MediumItalic.eot');
    src: local('HelveticaNeueCyr-MediumItalic'),
    url('/resources/fonts/HelveticaNeueCyr-MediumItalic.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-MediumItalic.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-LightItalic.eot');
    src: local('HelveticaNeueCyr-LightItalic'),
    url('/resources/fonts/HelveticaNeueCyr-LightItalic.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-LightItalic.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-UltraLight.eot');
    src: local('HelveticaNeueCyr-UltraLight'),
    url('/resources/fonts/HelveticaNeueCyr-UltraLight.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-UltraLight.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-UltraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-BoldItalic.eot');
    src: local('HelveticaNeueCyr-BoldItalic'),
    url('/resources/fonts/HelveticaNeueCyr-BoldItalic.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-BoldItalic.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-Italic.eot');
    src: local('HelveticaNeueCyr-Italic'),
    url('/resources/fonts/HelveticaNeueCyr-Italic.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-Italic.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-Italic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-Roman.eot');
    src: local('HelveticaNeueCyr-Roman'),
    url('/resources/fonts/HelveticaNeueCyr-Roman.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-Roman.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-Roman.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-Bold.eot');
    src: local('HelveticaNeueCyr-Bold'),
    url('/resources/fonts/HelveticaNeueCyr-Bold.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-Bold.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-Light.eot');
    src: local('HelveticaNeueCyr-Light'),
    url('/resources/fonts/HelveticaNeueCyr-Light.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-Light.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'HelveticaNeueCyr';
    src: url('/resources/fonts/HelveticaNeueCyr-Thin.eot');
    src: local('HelveticaNeueCyr-Thin'),
    url('/resources/fonts/HelveticaNeueCyr-Thin.eot?#iefix') format('embedded-opentype'),
    url('/resources/fonts/HelveticaNeueCyr-Thin.woff') format('woff'),
    url('/resources/fonts/HelveticaNeueCyr-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}