@import url(https://fonts.googleapis.com/css?family=Open+Sans:300&subset=latin,cyrillic);

@font-face {
    font-family: 'Myriad Set Pro';
    font-style: normal;
    font-weight: 200;
    src: url("../fonts/myriad-set-pro_thin.woff") format("woff"), url("../fonts/myriad-set-pro_thin.ttf") format("truetype");
}

@font-face {
    font-family: 'Myriad Set Pro';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/myriad-set-pro_text.woff") format("woff"), url("../fonts/myriad-set-pro_text.ttf") format("truetype");
}

@font-face {
    font-family: 'Myriad Set Pro';
    font-style: normal;
    font-weight: 600;
    src: url("../fonts/myriad-set-pro_semibold.woff") format("woff"), url("../fonts/myriad-set-pro_semibold.ttf") format("truetype");
}

@font-face {
    font-family: 'Myriad Set Pro';
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/myriad-set-pro_bold.woff") format("woff"), url("../fonts/myriad-set-pro_bold.ttf") format("truetype");
}

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    font-family: 'Myriad Set Pro', sans-serif;
    font-weight: 600 !important;
    font-size: 24px;
    position: relative;
    background-color: #2c2c2c !important;
    z-index: 0;
}

img {
    border: 0 !important;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
}

section, nav, header, footer, main, aside, figure, figcaption {
    display: block;
}

input {
    font-family: 'H_Thin', sans-serif;
    outline: 0;
}

a, a:visited, a:link {
    text-decoration: none;
    color: inherit;
}

.footer-yandex {
    border: none;
}

.left_head_main .d-css-h2 {
    color: white;
    margin: 0;
    padding: 0 10px 0 0;
    font-size: 80px;
    text-align: left;
    background: #2c2c2c;
    display: inline-block;

}

.anim {
    transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
}

.anim_line {
    transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
}

.anim_middle {
    transition: all 0.35s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    -webkit-transition: all 0.35s ease-in-out;
    -o-transition: all 0.35s ease-in-out;
}

.anim_long {
    transition: all 0.7s ease-in-out;
    -moz-transition: all 0.7s ease-in-out;
    -webkit-transition: all 0.7s ease-in-out;
    -o-transition: all 0.7s ease-in-out;
}

.anim_longer {
    transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
}

.anim_mobile {
    -webkit-transition: -webkit-transform 0.3s linear;
    -moz-transition: -webkit-transform 0.3s linear;
    -o-transition: -webkit-transform 0.3s linear;
    transition: -webkit-transform 0.3s linear;
}

@media (max-width: 767px) {

    .main-bonuses .bonuses__bonus {
        margin-right: 0 !important;
    }
}

body {
    padding-top: 135px;
}

@media (max-width: 986px) {
    body {
        padding-top: 150px;
    }
}
@media (max-width: 865px) {
    body {
        padding-top: 170px;
    }
}


/* ///////////////////// шапка */

.header {
    width: 100%;
    display: block;
    z-index: 1001;
    position: fixed;
    left: 0;
    top: 0;
    background-color: #2c2c2c;
}

.logotype {
    padding: 10px 8% 10px 4%;
    display: inline-block;
    vertical-align: middle;
}

.logotype img {
    height: 50px;
    vertical-align: middle;
}

.logotype p {
    margin: 0;
    font-size: 14px;
    color: white;
    margin-top: 5px;
}

.header_wrapper {
    display: flex;
    align-items: center;
}

.header_wrapper > * {
    flex: 1;
}

.header_bottom_mobile {
    display: none;
    align-items: center;
    justify-content: space-between;
    padding: 15px 4%;
}

.header_bottom_block_title {
    font-size: 11px;
    color: #ffff;
    margin: 0;
    padding: 0;
}

.header_bottom_block_subtitle {
    font-size: 14px;
    font-weight: bold;
    color: #ffc000;
    margin: 0;
    padding: 0;
}

.header_bottom_block {
}

.header_contact_block {
    padding: 15px 1%;
    display: flex;
    vertical-align: middle;
    text-align: left;
}

.header_contact_icon {
    width: 40px;
    height: 40px;
    margin-right: 5px;
    display: inline-block;
    vertical-align: middle;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.header_contact_text {
    display: inline-block;
    vertical-align: middle;
}

.header_contact_text p:first-child {
    color: white;
    margin: 0;
    padding: 0;
    font-size: 18px;
}

.header_contact_text p:last-child {
    color: #ffc000;
    margin: 0;
    padding: 0;
    font-size: 22px;
}

.design_rest {
    width: 21%;
    padding: 15px 0 15px 2%;
    display: inline-block;
    vertical-align: middle;
    text-align: right;
    cursor: pointer;
}

.design_rest:hover .small_arrow {
    width: 30px !important;
}

.design_background {
    background: #ffc000;
    padding: 0 2%;
    display: inline-block;
    text-align: center;
    position: relative;
    white-space: nowrap;
}

.design_background:before {
    content: '';
    position: absolute;
    right: 100%;
    border-top: 50px solid transparent;
    border-right: 30px solid #ffc000;
}

.design_rest p {
    color: black;
    margin: 0;
    line-height: 50px;
    padding: 0;
    font-size: 20px;
    background: #ffc000;
    display: inline-block;
    vertical-align: middle;
}

nav {
    width: 90%;
    padding: 0 5%;
    background: black;
    text-align: left;
    top: 0;
    left: 0;
    z-index: 999;

    vertical-align: middle;
    position: relative;
}

.small_menu_logo {
    width: 0;
    display: inline-block;
    vertical-align: middle;
    height: 0;
    background-size: contain;
    background-position: left;
    left: 0;
    top: 50%;
    background-repeat: no-repeat;
    background-image: url(/images/static/small_menu_logo.png);
}

nav.small_menu {
    width: 100%;
    padding: 0;
    position: relative;
    overflow: hidden;
    vertical-align: middle;
    box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.7);
}

nav.small_menu a {
    font-size: 15px !important;
    padding: 15px 0;
    width: 100%;
}

.important_link {
    color: black !important;
    background: #ffc000;
    font-size: 16px;
    width: 0;
    margin-left: 20%;
    right: 0;
    display: none;
    vertical-align: top;
    overflow: hidden;
    white-space: nowrap;
}

nav.small_menu .important_link {
    width: 20%;
    margin-left: 0;
    display: inline-block;
}

nav.small_menu .small_menu_logo {
    width: 5%;
    height: 49px;
    top: 0;
    float: left;
}

nav ul {
    margin: 0px;
    float: left;
    width: 95%;
    padding: 0px;
    display: flex;
    justify-content: space-between;
}

nav li {
    display: inline-block;
    width: 13%;
    text-align: center;
}

nav li:last-child {
    display: none;
}

nav li ul {
    display: none;
    position: absolute;
    background-color: #000000;
    width: auto;
    min-width: 12%;
    padding: 10px 0px;
    z-index: 9999;
}

nav li ul li {
    display: block;
    float: none;
    width: 100%;
    text-align: left;

}

nav li ul li a {
    width: 100%;
    text-align: left;
    padding-left: 10px;
}

nav li:hover ul {
    display: block;

}

nav a {
    text-align: center;
    padding: 10px 0;
    width: 100%;
    color: white !important;
    font-size: 18px;
    display: inline-block;
}

nav a:hover {
    background: #ffc000;
    color: black !important;
}

/* //////////////////////// главная	 */

section.main {
    width: 100%;
    background-image: url(/images/static/image1preview.jpg);
    background-size: cover;
    background-position: right;
    background-repeat: no-repeat;
    position: relative;
}

section.main_2 {
    width: 100%;
    background-image: url(/images/static/image2preview.jpg);
    background-size: cover;
    background-position: left;
    background-repeat: no-repeat;
    position: relative;
}

.main_text {
    width: 40%;
    padding: 50px 5% 100px 5%;
    position: relative;
}

.main_text_2 {
    max-width: 40%;
    margin-left: 50%;
    padding: 100px 7% 150px 7%;
    position: relative;
    text-align: right;
}

.header_contact_block {
    width: 21%;
}

.main_text h1, .main_text_2 h2, .main_text .d-css-h1, .main_text_2 .d-css-h2 {
    color: white;
    margin: 0;
    padding: 0;
    font-size: 50px;
    text-align: left;
}

.main_text .d-css-h1 span, .main_text_2 .d-css-h2 span {
    color: #ffc000;
    font-size: 30px;
    width: 100%;
    display: block;
}

.main_text p, .main_text_2 p {
    color: white;
    margin: 30px 0 0 0;
    padding: 0;
    font-size: 20px;
    text-align: left;
}

.absolute_corner {
    width: 70%;
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    background-image: url(/images/static/left_corner.png);
    background-size: cover;
    background-position: -91px center;
    background-repeat: no-repeat;
    opacity: 1;
}

.absolute_corner_2 {
    width: 70%;
    position: absolute;
    height: 100%;
    left: 30%;
    top: 0;
    background-image: url(/images/static/right_corner.png);
    background-size: cover;
    background-position: 138px center;
    background-repeat: no-repeat;
    opacity: 1;
}

.main_btn {
    display: inline-block;
    vertical-align: middle;
    padding: 10px;
    border: 1px solid white;
    margin-top: 40px;
    border-radius: 5px;
    cursor: pointer;
}

.main_btn:hover {
    background: #ffc000;
    border-color: #ffc000;
}

.main_btn:hover p {
    color: black;
}

.main_btn p {
    margin: 0;
    padding: 0;
    display: inline-block;
    vertical-align: middle;
    font-size: 18px;
    color: white;
}

.sm_arrow {
    display: inline-block;
    vertical-align: middle;
    background-image: url(/images/static/arrow_white.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    margin-left: 5px;
}

.head_main {
    width: 90%;
    margin: 3% 5%;
    position: relative;
}

.left_head_main {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    text-align: left;
    position: relative;
    z-index: 10;
}

.left_head_main h2 {
    color: white;
    margin: 0;
    padding: 0 10px 0 0;
    font-size: 80px;
    text-align: left;
    background: #2c2c2c;
    display: inline-block;
}

.left_head_main h2 span,
.left_head_main .d-css-h2 span {
    color: #ffc000;
    font-size: 30px;
    width: 100%;
    display: block;
}

.right_head_main {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    text-align: right;
    position: relative;
    z-index: 10;
}

.right_head_main a {
    display: inline-block;
    padding: 10px;
    background: #2c2c2c;
    color: white;
}

.right_head_main a:hover {
    color: #ffc000;
}

.center_head_main {
    position: absolute;
    top: 49%;
    height: 1px;
    background: #ffc000;
    width: 100%;
    left: 0;
    z-index: 1;
}

.line_trigger {
    width: 100%;
    padding: 50px 0;
    background: url(/images/static/pat_main_black.jpg);
    text-align: center;
}

.trigger_item {
    width: 16%;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}

.trigger_item:hover .trigger_icon {
    transform: scale(1.1) rotate(30deg);
}

.trigger_icon {
    width: 100%;
    height: 100px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.trigger_item p {
    color: white;
    margin: 0;
    padding: 10px 0;
    font-size: 16px;
}

.main_review {
    width: 90%;
    margin: 50px 5%;
}

.main_review_item {
    width: 29%;
    padding: 2% 4% 2% 0;
    display: inline-block;
    vertical-align: top;
}

.main_review_item h3 {
    margin: 0;
    padding: 0;
    color: #ffc000;
    font-size: 30px;
}

.main_review_item p:nth-child(2) {
    margin: 5px 0 10px 0;
    padding: 0;
    color: white;
    font-size: 14px;
}

.main_review_item p:last-child {
    margin: 0;
    padding: 0;
    color: white;
    font-size: 18px;
}

.main_review_btn {
    width: 100%;
    text-align: center;
    margin: 50px 0;
}

.new_main_review {
    display: inline-block;
    vertical-align: middle;
    padding: 10px;
    cursor: pointer;
}

.new_main_review:first-child:hover, .new_main_review:last-child:hover {
    background: #ffc000;
    border-color: #ffc000;
}

.new_main_review:hover p {
    color: black;
}

.new_main_review:hover + .new_main_review {
    border-left: 1px solid #ffc000;
}

.new_main_review:first-child {
    border: 1px solid white;
    border-right: 0;
    border-radius: 5px 0 0 5px;
}

.new_main_review:last-child {
    border: 1px solid white;
    border-radius: 0 5px 5px 0;
}

.new_main_review p {
    color: white;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    font-size: 18px;
}

.new_main_review_icon {
    width: 30px;
    height: 20px;
    margin: 0 5px 0 0;
    display: inline-block;
    vertical-align: middle;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

section.action_block {
    width: 100%;
    padding: 50px 0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(/images/static/bottom_prev.jpg);
}

.white_logo {
    width: 100%;
    margin: 0;
    height: 70px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(/images/static/white_logo.png);
}

section.action_block h4 {
    font-size: 50px;
    color: white;
    text-align: center;
    margin: 0;
    padding: 0;
}

section.action_block p {
    font-size: 20px;
    color: white;
    text-align: center;
    margin: 0;
    padding: 0;
}

.action_block_btn {
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    margin-top: 50px;
    text-align: center;
}

.action_btn {
    display: inline-block;
    vertical-align: middle;
    padding: 10px;
    border: 1px solid white;
    border-radius: 5px;
    cursor: pointer;
}

.action_btn:hover {
    background: #ffc000;
    border-color: #ffc000;
}

.action_btn:hover p {
    color: black;
}

.action_btn p {
    color: white;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    padding: 0;
}

/* ////////////////////////////////////здесь начинается портфолио */

.top_block, .top_block_contacts {
    width: 100%;
    height: auto;
    text-align: center;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 50px;

    box-shadow: inset 0 0 10px 3px rgba(0, 0, 0, 0.4);
    background-image: url(/images/static/top_prev.jpg) !important;
}

.top_block p, .top_block h1 {
    font-size: 30px;
    margin: 30px 0 0 0;
    padding: 0;
    color: white;
    display: inline-block;
    width: 100%;
}

.top_block p:last-child, .top_block h1:last-child {
    font-size: 30px;
    margin: 50px 0;
    padding: 0;
    color: white;
}

.new_link {
    display: inline-block;
    color: black;
    padding: 10px;
    font-size: 18px;
    border: 1px solid #ffc000;
    margin-top: 15px;
    border-radius: 5px;
    margin-bottom: 30px;
    cursor: pointer;
    background: #ffc000;
    transition: 0.2s linear;
}

.new_link:hover {
    padding-left: 12px;
    padding-right: 12px;
}

/*.new_link:hover
	{
		background: #ffc000;
		color: black;
		border-color: #ffc000;
	}*/

.top_block a:nth-child(3) .new_link, .top_block a:nth-child(4) .new_link {
    margin-left: 15px;
}

section.work_desc a.nav_links .new_link {
    border: 1px solid white;
    border-right: 0;
    border-radius: 0;
}

section.work_desc p + a.nav_links .new_link {
    border-radius: 5px 0 0 5px !important;
}

section.work_desc a.nav_links:last-child .new_link {
    border-right: 1px solid white;
    border-radius: 0 5px 5px 0;
}


aside {
    width: 25%;
    position: relative;
    display: inline-block;
    vertical-align: top;
    left: 0;
    z-index: 3;
    box-shadow: 0 3px 10px 3px black;
}

.aside_over {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: #181818;
    border-bottom: 3px solid #ffc000;
}

.open_btn {
    position: absolute;
    top: 10px;
    right: -20px;
    width: 50px;
    height: 50px;
    background-image: url(/images/static/round_arrow.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}

.open_btn:hover {
    cursor: pointer;
    right: -20px;
}

.rotate {
    transform: rotate(180deg);
}

.rotate_back {
    transform: rotate(-180deg);
}

.content_part {
    width: 100%;
    padding-top: 30px;
    position: relative;
    background: url(/images/static/pat_main_black.jpg);
}

.portfolio_preview {
    /*width: 32%;
    margin: 0 0 0.5% 0.5%;
    display: inline-block;
    vertical-align: top;
    position: relative;
    cursor: pointer;*/
}

/*.portfolio_preview a:first-child {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 10;
}*/

.portfolio_preview a:last-child {
    position: relative;
    z-index: 0;
}

.portfolio_preview_text {
    width: 90%;
    padding: 5%;
    background: #181818;
    z-index: 3;
}

.portfolio_preview_text h2, .portfolio_preview_text .d-css-h2 {
    color: #ffcc00 !important;
    margin: 0 0 5px 0 !important;
    padding: 0 !important;
    font-size: 20px !important;
}

.portfolio_preview_text p {
    color: white !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 16px !important;
}

.portfolio_img_overflow {
    width: 100%;
    height: 200px;
    position: relative;
    z-index: 3;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.portfolio_img_overflow img {
    width: 100%;
    opacity: 0;
}

.page_portfolio {
    margin-top: 20px;
}

/*.page_portfolio .portfolio_preview {
    width: 31%;
}*/

.page_portfolio .portfolio_preview h2 {
    border-left: none !important;
}

.type_portfolio_content {
    width: 100%;
    margin: 20px 0 0 0;
}

.type_portfolio_content p {
    margin: 10px;
    padding: 0;
    font-size: 24px;
    color: #ffc000;
    text-align: center;
}

.btn_choose_type {
    color: silver;
    text-align: center;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 50%;
    font-size: 18px;
    display: inline-block;
    padding: 10px 0;
    border-top: 1px solid #2c2c2c;
}

.type_portfolio_content:nth-child(3) .btn_choose_type:first-child, .type_portfolio_content:nth-child(3) .btn_choose_type:last-child {
    width: 100%;
}

.btn_choose_type:first-child {
    border-left: 0 !important;
}

.btn_choose_type_2 {
    color: silver;
    text-align: center;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 33%;
    font-size: 20px;
    display: inline-block;
    padding: 10px 0;
    border-top: 1px solid #2c2c2c;
    border-bottom: 1px solid #2c2c2c;
}

.btn_choose_type_2:nth-child(2) {
    width: 34%;
}

.btn_choose_type:nth-child(2) {
    border-left: 1px solid #2c2c2c;
}

.type_portfolio_content:nth-child(3) .btn_choose_type:nth-child(2) {
    border-left: 0;
}

.btn_choose_type:nth-child(2n+1), .btn_choose_type_2:nth-child(2), .btn_choose_type_2:last-child {
    border-left: 1px solid #2c2c2c;
}

.btn_choose_type:nth-last-child(2), .btn_choose_type:last-child {
    border-bottom: 1px solid #2c2c2c;
}

.btn_choose_type:hover, .btn_choose_type_2:hover {
    background: #2c2c2c;
    cursor: pointer;
}

.portfolio {
    height: 100%;
    text-align: center;
    /*padding: 0 2% 0 2%;*/
    /*min-height: 800px;*/
    

}
.portfolio_preview {
    flex: 0 0 33.333%;
    box-sizing: border-box;
    padding: 5px;
}

.portfolio_content {
    right: 0;
    top: 30px;
    position: absolute;
    vertical-align: top;
    min-height: 800px;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 0 15px;
}

.portfolio__card {
    position: relative;
    display: flex;
    flex-direction: column;
    color: #eeeeee;
    overflow: hidden;
    padding: 25px;
    height: 40vh;
    
}

.portfolio__card-content {
    position: absolute;
    z-index: 3;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    transition: all 200ms;
    padding: 0 15px;
    box-sizing: border-box;
    opacity: 0;
    text-align: center;
}

.portfolio__hover {
    position: absolute;
    visibility: hidden;
    display: block;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    transition: visibility 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    opacity 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    opacity: 0;
    z-index: 2;
}

.portfolio__title {
    color: rgb(255, 255, 255);
    font-size: 28px;
    margin-bottom: 15px;
}

.portfolio__discription {
    color: rgb(255, 255, 255);
    font-size: 14px;
}

.portfolio__card-img {
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    transform: scale(1.01);
    transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: -1;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    will-change: transform;
}

.portfolio__card:hover .portfolio__card-img {
    transform: scale(1.2);
}

.portfolio__card:hover .portfolio__card-content{
    transform: translate(-50%, -50%);
    opacity: 1;
}

.portfolio__card:hover .portfolio__hover{
    visibility: visible;
    opacity: 1;
}
@media (max-width: 1024px) {
    .portfolio__title {
        font-size: 20px;
    }

}

@media (max-width: 768px) {

    .portfolio__card {
      flex: 0 0 50%;
      height: 300px;
    }
    .portfolio_preview {
        flex: 0 0 50%;
    }
}

@media (max-width: 530px) {

    .portfolio_preview {
        flex: 0 0 100%;
    }
}

/* //////////////////////// здесь начинается страница услуг */

.work_links {
    width: 100%;
    display: inline-block;
    position: relative;
    background: rgba(0, 0, 0, 0.1);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.work_link {
    width: 16%;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    border-top: 2px solid transparent;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.work_link:last-child {

}

.work_link:hover {
    background: rgba(0, 0, 0, 0.5);
}

.work_link_icon {
    height: 40px;
    width: 100%;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: 10px;
}

.work_link p {
    margin: 10px 0 !important;
    padding: 0;
    color: white;
    font-weight: normal;
    font-size: 16px !important;
    text-align: center;
}

.main_content {
    width: 69%;
    display: inline-block;
    vertical-align: top;
    padding: 2% 3% 0 3%;
}

.main_content h1 {
    color: white;
    font-size: 40px;
    margin: 20px 0 0 0;
    padding: 0;
    margin-right: 20%;
}
.main_content__title {
    display: block;
    color: white;
    font-size: 40px;
    margin: 0 !important;
    padding: 0;
}
.main_content__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}
@media (max-width: 770px) {
    .main_content__top {
        flex-direction: column;
    }
    .main_content__btn {
        align-self: flex-start;
        margin: 0;
    }
}

.main_content h2 {
    /*color: white;*/
}

.main_content table, .in_page_text_content table {
    width: 100%;
    color: #fff;
}

.main_content p, .in_page_text_content p {
    color: white;
    font-size: 20px;
    font-weight: normal;
    margin: 15px 0;
    padding: 0;
}

.in_page_text_content a {
    text-decoration: underline;
}

.in_page_text_content a:hover {
    text-decoration: none;
}

.reviews {
    width: 25%;
    display: inline-block;
    vertical-align: top;
    color: white;
    top: 50px;
    right: 0;
    background: #191919;
}

.head_review {
    padding: 4%;
    width: 92%;
    text-align: left;
    position: relative;
}

.head_review h3, .head_review .h3 {
    margin: 0;
    padding: 0;
    font-size: 24px;
    color: white;
}

.new_review {
    position: absolute;
    right: 0;
    height: 100%;
    width: 65px;
    background-image: url(/images/static/write_review.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    top: 0;
    cursor: pointer;
}

.new_review:hover {
    background-color: #414141;
}

.scroll_review {
    height: 100%;
    overflow-y: scroll;
    width: 110%;

}

.review_overflow {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

.review_item {
    width: 90%;
    padding: 4% 6% 4% 4%;
    border-top: 1px solid #414141;
}

.review_item h4, .review_item .h4 {
    color: #ffc000;
    margin: 5px 0 0 0;
    padding: 0;
    font-size: 20px;
}

.review_item span {
    color: grey;
    margin: 0;
    padding: 0;
    font-size: 14px;
}

.review_item p {
    color: white;
    margin: 5px 0;
    padding: 0;
    font-weight: normal;
    font-size: 16px;
}

.order_block {
    width: 100%;
    display: inline-block;
    padding: 30px 0;
}

.order_trigger {
    padding: 0 30px 0 0;
    display: inline-block;
    vertical-align: middle;
}

.order_trigger_icon {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    height: 40px;
    margin-right: 10px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.order_trigger p {
    display: inline-block;
    vertical-align: middle;
    color: white;
    font-size: 18px;
    margin: 0;
    padding: 0;
}

.order_trigger p span {
    color: #ffc000;
    font-size: 30px;
}

.new_order {
    padding: 0 15px;
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    cursor: pointer;
    width: 215px;
    height: 65px;
    transition: 0.2s linear;
    background: #ffc000;
    border-color: #ffc000;
}

.new_order:hover {
    width: 220px;
    height: 70px;
}

.new_order p {
    text-align: right;
    padding: 10px !important;
    display: inline-block;
    margin: 0;
    font-size: 18px;
}

.new_order p {
    color: black !important;
}

.content_links {
    width: 100%;
    display: inline-block;
    margin-top: 10px;
    border-top: 1px solid #414141;
}

.content_link {
    width: 29%;
    padding: 2% 4% 2% 0;
    display: inline-block;
    vertical-align: mdidle;
    cursor: pointer;
}

.content_link:hover p {
    color: #ffc000;
}

.content_link_icon {
    width: 18%;
    margin-right: 2%;
    height: 40px;
    display: inline-block;
    vertical-align: middle;
    background-size: contain;
    background-position: left;
    background-repeat: no-repeat;
}

.content_link p {
    color: white;
    width: 80%;
    text-align: left;
    font-size: 18px;
    margin: 10px 0;
    padding: 0;
    display: inline-block;
    vertical-align: middle;
}

section.free_order {
    background-image: url(/images/static/free_back.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 90%;
    padding: 2% 5%;
    position: relative;
    border-top: 1px solid #ffc000;
    border-bottom: 1px solid #ffc000;
}

.free_order_content {
    width: 55%;
    margin-left: 10%;
    display: inline-block;
    vertical-align: middle;
    text-align: left;
}

.free_order_content h5, .free_order_content .h5 {
    font-size: 40px;
    color: white;
    margin: 0 0 15px 0;
    padding: 0;
    text-align: left;
}

.free_order_icon {
    width: 60px;
    height: 60px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    background-image: url(/images/static/free_complect.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.free_order_content p {
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
    color: white;
    margin: 0;
    padding: 0;
    text-align: left;
}

.free_order_btn_block {
    display: inline-block;
    vertical-align: middle;
}

.free_order_btn_block p {
    display: inline-block;
    padding: 10px;
    border-radius: 5px;
    color: #ffc000;
    margin: 0;
    cursor: pointer;
    border: 1px solid #ffc000;
}

.free_order_btn_block p:hover {
    background: #ffc000;
    color: black;
}

/* /////////////////////////////// порядок работы */

.work_content {
    width: 70%;
    display: inline-block;
    vertical-align: top;
    position: relative;
    z-index: 1;
}

.work_content h1 {
    color: white;
    width: 90%;
    margin: 15px 5%;
    font-size: 24px;
    padding: 0;
    text-align: left;
}

.last_portfolio {
    width: 30%;
    display: inline-block;
    vertical-align: top;
    top: 0;
    right: 0;
    height: 100%;
}

.last_portfolio p {
    color: white;
    width: 90%;
    margin: 15px 5%;
    font-size: 24px;
    padding: 0;
    text-align: center;
}

.work_content_line {
    width: 100%;
    background: #ffc000;
    padding: 15px 0;
}

.work_content_line_icon {
    display: inline-block;
    vertical-align: middle;
    width: 50px;
    height: 30px;
    margin-right: 10px;
    margin-left: 4%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.work_content_line h2 {
    font-size: 30px;
    color: black;
    text-align: left;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    padding: 0;
}

.work_content_step {
    width: 90%;
    margin: 0 5%;
}

.work_content_step span {
    display: inline-block;
    width: 100%;
    color: white;
    font-size: 18px;
    margin: 15px 0;
}

.work_content_step h3 {
    color: #ffc000;
    font-size: 30px;
    margin: 0 0 20px 0;
    padding: 0;
}

.work_content_step p {
    color: white;
    font-size: 16px;
    margin: 10px 0 20px 0;
    padding: 0;
}

.work_content_step p a {
    color: #ffc000;
    text-decoration: underline;
}

.last_portfolio_overflow {
    width: 100%;
    overflow: hidden;
    background: #121212;
    position: relative;
    height: 100%;
}

.last_portfolio_item {
    width: 100%;
    margin-bottom: 0px;
    height: 250px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    z-index: 5;
    cursor: pointer;
    right: 0;
}

.last_portfolio_item:hover {
    box-shadow: 0 0 10px 5px black;
    z-index: 10;
    right: -10px;
}

.last_portfolio_item:active {
    box-shadow: 0 0 0 0 black;
    z-index: 10;
    right: 0;
}

.last_portfolio_scroll {
    width: 110%;
    overflow-y: scroll;
    overflow-x: hidden;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 999;
    -webkit-overflow-scrolling: touch;
}

/* /////////////////////// о компании */

.about_text {
    width: 44%;
    padding: 2% 0 0 4%;
    display: inline-block;
    vertical-align: top;
}

.about_text h1, .about_text h2 {
    color: #ffc000;
    font-size: 30px;
    margin: 15px 0;
    padding: 0;
}

.about_text p {
    color: white;
    font-size: 14px;
    margin: 10px 0;
    padding: 0;
}

.about_text p a {
    color: #ffc000;
    border-bottom: 1px solid #ffc000;
}

.about_text p a:hover {
    opacity: 0.8;
}

.persons {
    width: 100%;
    margin-toP: 30px;
    padding-bottom: 4%;
}

.head_persons {
    background: #ffc000;
    display: inline-block;
    width: 100%;
}

.head_persons h3 {
    width: 66%;
    display: inline-block;
    vertical-align: middle;
    color: black;
    padding: 15px 0 15px 4%;
    margin: 0;
    font-size: 30px;
}

.new_person {
    width: 30%;
    display: inline-block;
    vertical-align: middle;
    color: white;
    padding: 15px 0;
    background: black;
    font-size: 30px;
    text-align: center;
    cursor: pointer;
}

.new_person:hover {
    background: #ffc000;
    color: black;
}

.person {
    width: 29%;
    margin-left: 4%;
    display: inline-block;
    vertical-align: middle;
    margin-top: 4%;
}

.person_foto {
    width: 35%;
    margin-right: 5%;
    height: 180px;
    display: inline-block;
    vertical-align: middle;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.person_name {
    width: 60%;
    display: inline-block;
    vertical-align: middle;
}

.person_name h4 {
    color: #ffc000;
    font-size: 24px;
    margin: 0;
    padding: 0;
}

.person_name p {
    color: white;
    font-size: 18px;
    margin: 15px 0 0 0;
    padding: 0;
}

/* //////////////////////////// контакты */

.contact_info_item {
    width: 29%;
    padding-left: 4%;
    display: inline-block;
    vertical-align: middle;
    text-align: left;
}

.contact_info_item p:first-child, .contact_info_item p:last-child {
    color: white;
    margin: 0;
    padding: 0;
    font-size: 20px;
}

.contact_info_item p:nth-child(2) {
    color: #ffc000;
    margin: 5px 0;
    padding: 0;
    font-size: 36px;
}

.contact_block {
    width: 94%;
    padding: 3% 3% 0 3%;
    display: inline-block;
    vertical-align: top;
}

.contact_block h1, .contact_block h2 {
    color: white;
    font-size: 30px;
    margin: 0 0 10px 0;
    padding: 0;
}

.contact_block p {
    color: white;
    font-size: 18px;
    margin: 0;
    padding: 0;
}

.left_contact {
    width: 36%;
    padding-left: 3%;
    padding-right: 3%;
    padding-top: 2%;
    display: inline-block;
    vertical-align: top;
    box-shadow: 0 0 10px 3px black;
    position: relative;
}

.feedback_static {
    width: 94%;
    padding: 1% 3% 3% 3%;
}

.feedback_static h3 {
    color: white;
    font-size: 30px;
    margin: 10px 0;
    padding: 0;
}

.feedback_static input:nth-child(2) {
    border: 1px solid white;
    border-bottom: 0;
    padding: 2%;
    width: 96%;
    color: white;
    background: transparent;
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
    margin-top: 10px;
}

.feedback_static input:nth-child(3) {
    border: 1px solid white;
    border-bottom: 0;
    padding: 2%;
    width: 96%;
    color: white;
    background: transparent;
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    font-weight: bold;
}

.feedback_static textarea {
    border-left: 1px solid white;
    border-right: 1px solid white;
    border-bottom: 0;
    border-top: 1px solid white;
    padding: 2%;
    width: 96%;
    max-width: 96%;
    height: 150px;
    max-height: 150px;
    color: white;
    background: transparent;
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    font-weight: bold;
    overflow: hidden;
    margin: 0;
    resize: none;
    vertical-align: top;
    outline: 0;
}

.feedback_static input:focus, .feedback_static textarea:focus {
    border-color: #ffc000;
}

.feedback_static input:focus + input, .feedback_static input:focus + textarea, .feedback_static textarea:focus + .send_feedback_static {
    border-top: 1px solid #ffc000;
}

.send_feedback_static {
    border: 1px solid white;
    display: inline-block;
    padding: 2%;
    color: white;
    text-align: center;
    font-size: 20px;
    width: 96%;
    border-radius: 0 0 5px 5px;
    margin-bottom: 30px;
    cursor: pointer;
}

.send_feedback_static:hover {
    background: #ffc000;
    color: black;
    border-color: #ffc000;
}

.right_map {
    width: 57%;
    display: inline-block;
    vertical-align: top;
    position: relative;
    box-shadow: 5px 0 10px 3px black;
}

.brand_custom {
    padding: 0 40px;
    margin-bottom: 20px;
}
.brand_custom p{
    color: #fff;
}
.brand_custom li{
    text-align: left;
}
@media (max-width: 768px) {
    .brand_custom p{
        font-size: 16px;
    }
}

section.brand {
    width: 100%;
    padding: 150px 0;
    background-size: cover;
    background-position: bottom;
    background-repeat: no-repeat;
    background-image: url(/images/static/lava.jpg);
}

.brand_logo {
    width: 100%;
    height: 70px;
    margin-bottom: 20px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/logotype.png);
}

section.brand h1 {
    color: #ffc000;
    font-size: 70px;
    text-align: center;
    margin: 0;
    padding: 0;
}

section.brand p {
    color: white;
    font-size: 30px;
    text-align: center;
    margin: 15px 0;
    padding: 0;
}

.brand_text {
    width: 100%;
    padding: 50px;
    text-align: center;
    color: white;
}

.brand_text h2 {
    width: 70%;
    margin: 0 15%;
    padding: 0;
    color: white;
    font-size: 24px;
    text-align: center;
}

.brand_btn {
    display: inline-block;
    margin-top: 50px;
    border-radius: 5px;
    border: 1px solid #ffc000;
    cursor: pointer;
}

.brand_btn:hover {
    background: #ffc000;
}

.brand_btn:hover p {
    color: black !important;
}

.brand_btn p {
    margin: 0 !important;
    padding: 10px !important;
    color: #ffc000 !important;
    font-size: 24px !important;
    text-align: center !important;
}

section.brand_process {
    width: 100%;
    padding: 50px 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/brand_back_process.jpg);
}

section.brand_process h2 {
    margin: 0;
    padding: 0;
    color: #ffc000;
    font-size: 50px;
    text-align: center;
}

section.brand_process p {
    margin: 0;
    padding: 10px 0;
    color: white;
    font-size: 18px;
    text-align: center;
}

.brand_process_item {
    width: 20%;
    margin-top: 40px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}

.brand_process_icon {
    width: 100%;
    height: 70px;
    margin-bottom: 10px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}

.brand_process_icon_active {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    animation: round 4s infinite linear;
    -webkit-animation: round 4s infinite linear;
    -moz-animation: round 4s infinite linear;
    -o-animation: round 4s infinite linear;
}

.brand_process_icon_active2 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    animation: round 2s infinite linear;
    -webkit-animation: round 2s infinite linear;
    -moz-animation: round 2s infinite linear;
    -o-animation: round 2s infinite linear;
}

.brand_process_icon_active3 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    animation: round2 3s infinite linear;
    -webkit-animation: round2 3s infinite linear;
    -o-animation: round2 3s infinite linear;
    -moz-animation: round2 3s infinite linear;
}

.brand_process_icon_active_size {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    animation: size 0.5s infinite linear;
    -webkit-animation: size 0.5s infinite linear;
    -moz-animation: size 0.5s infinite linear;
    -o-animation: size 0.5s infinite linear;
}

.brand_process_icon_active_slide {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    animation: slide 1.5s infinite linear;
    -webkit-animation: slide 1.5s infinite linear;
    -o-animation: slide 1.5s infinite linear;
    -moz-animation: slide 1.5s infinite linear;
}

.brand_process_icon_active_slide1 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    animation: slide2 1.7s infinite linear;
    -webkit-animation: slide2 1.7s infinite linear;
    -moz-animation: slide2 1.7s infinite linear;
    -o-animation: slide2 1.7s infinite linear;
}

.brand_process_icon_active_slide2 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    animation: slide3 2s 2s infinite linear;
    -webkit-animation: slide3 2s 2s infinite linear;
    -moz-animation: slide3 2s 2s infinite linear;
    -o-animation: slide3 2s 2s infinite linear;
}

@-webkit-keyframes size {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
    }
    30% {
        -webkit-transform: scale(1.07);
        transform: scale(1.07);
        -moz-transform: scale(1.07);
        -o-transform: scale(1.07);
    }
    100% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        -moz-transform: scale(0.9);
        -o-transform: scale(0.9);
    }
}

@-o-keyframes size {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
    }
    30% {
        -webkit-transform: scale(1.07);
        transform: scale(1.07);
        -moz-transform: scale(1.07);
        -o-transform: scale(1.07);
        -ms-transform: scale(1.07);
    }
    100% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        -moz-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
    }
}

@-moz-keyframes size {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
    }
    30% {
        -webkit-transform: scale(1.07);
        transform: scale(1.07);
        -moz-transform: scale(1.07);
        -o-transform: scale(1.07);
        -ms-transform: scale(1.07);
    }
    100% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        -moz-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
    }
}

@-ms-keyframes size {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
    }
    30% {
        -webkit-transform: scale(1.07);
        transform: scale(1.07);
        -moz-transform: scale(1.07);
        -o-transform: scale(1.07);
        -ms-transform: scale(1.07);
    }
    100% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        -moz-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
    }
}

@keyframes size {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
    }
    30% {
        -webkit-transform: scale(1.07);
        transform: scale(1.07);
        -moz-transform: scale(1.07);
        -o-transform: scale(1.07);
        -ms-transform: scale(1.07);
    }
    100% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
        -moz-transform: scale(0.9);
        -o-transform: scale(0.9);
        -ms-transform: scale(0.9);
    }
}

@-webkit-keyframes round {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}

@-o-keyframes round {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}

@-ms-keyframes round {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}

@-moz-keyframes round {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}

@keyframes round {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
    }
}

@-webkit-keyframes round2 {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
    }
}

@-o-keyframes round2 {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
    }
}

@-ms-keyframes round2 {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
    }
}

@-moz-keyframes round2 {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
    }
}

@keyframes round2 {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -moz-transform: rotate(0);
        -o-transform: rotate(0);
        -ms-transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
    }
}

@-webkit-keyframes slide {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -5px);
        -moz-transform: translate(0, -5px);
        transform: translate(0, -5px);
        -o-transform: translate(0, -5px);
        -ms-transform: translate(0, -5px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 5px);
        -moz-transform: translate(0, 5px);
        transform: translate(0, 5px);
        -o-transform: translate(0, 5px);
        -ms-transform: translate(0, 5px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@keyframes slide {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -5px);
        -moz-transform: translate(0, -5px);
        transform: translate(0, -5px);
        -o-transform: translate(0, -5px);
        -ms-transform: translate(0, -5px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 5px);
        -moz-transform: translate(0, 5px);
        transform: translate(0, 5px);
        -o-transform: translate(0, 5px);
        -ms-transform: translate(0, 5px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-ms-keyframes slide {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -5px);
        -moz-transform: translate(0, -5px);
        transform: translate(0, -5px);
        -o-transform: translate(0, -5px);
        -ms-transform: translate(0, -5px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 5px);
        -moz-transform: translate(0, 5px);
        transform: translate(0, 5px);
        -o-transform: translate(0, 5px);
        -ms-transform: translate(0, 5px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-moz-keyframes slide {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -5px);
        -moz-transform: translate(0, -5px);
        transform: translate(0, -5px);
        -o-transform: translate(0, -5px);
        -ms-transform: translate(0, -5px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 5px);
        -moz-transform: translate(0, 5px);
        transform: translate(0, 5px);
        -o-transform: translate(0, 5px);
        -ms-transform: translate(0, 5px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-o-keyframes slide {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -5px);
        -moz-transform: translate(0, -5px);
        transform: translate(0, -5px);
        -o-transform: translate(0, -5px);
        -ms-transform: translate(0, -5px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 5px);
        -moz-transform: translate(0, 5px);
        transform: translate(0, 5px);
        -o-transform: translate(0, 5px);
        -ms-transform: translate(0, 5px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-webkit-keyframes slide2 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -8px);
        -moz-transform: translate(0, -8px);
        transform: translate(0, -8px);
        -o-transform: translate(0, -8px);
        -ms-transform: translate(0, -8px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 8px);
        -moz-transform: translate(0, 8px);
        transform: translate(0, 8px);
        -o-transform: translate(0, 8px);
        -ms-transform: translate(0, 8px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-moz-keyframes slide2 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -8px);
        -moz-transform: translate(0, -8px);
        transform: translate(0, -8px);
        -o-transform: translate(0, -8px);
        -ms-transform: translate(0, -8px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 8px);
        -moz-transform: translate(0, 8px);
        transform: translate(0, 8px);
        -o-transform: translate(0, 8px);
        -ms-transform: translate(0, 8px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-ms-keyframes slide2 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -8px);
        -moz-transform: translate(0, -8px);
        transform: translate(0, -8px);
        -o-transform: translate(0, -8px);
        -ms-transform: translate(0, -8px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 8px);
        -moz-transform: translate(0, 8px);
        transform: translate(0, 8px);
        -o-transform: translate(0, 8px);
        -ms-transform: translate(0, 8px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-o-keyframes slide2 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -8px);
        -moz-transform: translate(0, -8px);
        transform: translate(0, -8px);
        -o-transform: translate(0, -8px);
        -ms-transform: translate(0, -8px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 8px);
        -moz-transform: translate(0, 8px);
        transform: translate(0, 8px);
        -o-transform: translate(0, 8px);
        -ms-transform: translate(0, 8px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@keyframes slide2 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -8px);
        -moz-transform: translate(0, -8px);
        transform: translate(0, -8px);
        -o-transform: translate(0, -8px);
        -ms-transform: translate(0, -8px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 8px);
        -moz-transform: translate(0, 8px);
        transform: translate(0, 8px);
        -o-transform: translate(0, 8px);
        -ms-transform: translate(0, 8px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@keyframes slide3 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -3px);
        -moz-transform: translate(0, -3px);
        transform: translate(0, -3px);
        -o-transform: translate(0, -3px);
        -ms-transform: translate(0, -3px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 3px);
        -moz-transform: translate(0, 3px);
        transform: translate(0, 3px);
        -o-transform: translate(0, 3px);
        -ms-transform: translate(0, 3px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-webkit-keyframes slide3 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -3px);
        -moz-transform: translate(0, -3px);
        transform: translate(0, -3px);
        -o-transform: translate(0, -3px);
        -ms-transform: translate(0, -3px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 3px);
        -moz-transform: translate(0, 3px);
        transform: translate(0, 3px);
        -o-transform: translate(0, 3px);
        -ms-transform: translate(0, 3px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-moz-keyframes slide3 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -3px);
        -moz-transform: translate(0, -3px);
        transform: translate(0, -3px);
        -o-transform: translate(0, -3px);
        -ms-transform: translate(0, -3px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 3px);
        -moz-transform: translate(0, 3px);
        transform: translate(0, 3px);
        -o-transform: translate(0, 3px);
        -ms-transform: translate(0, 3px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-o-keyframes slide3 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -3px);
        -moz-transform: translate(0, -3px);
        transform: translate(0, -3px);
        -o-transform: translate(0, -3px);
        -ms-transform: translate(0, -3px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 3px);
        -moz-transform: translate(0, 3px);
        transform: translate(0, 3px);
        -o-transform: translate(0, 3px);
        -ms-transform: translate(0, 3px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

@-ms-keyframes slide3 {
    0% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate(0, -3px);
        -moz-transform: translate(0, -3px);
        transform: translate(0, -3px);
        -o-transform: translate(0, -3px);
        -ms-transform: translate(0, -3px);
        opacity: 0;
    }
    70% {
        -webkit-transform: translate(0, 3px);
        -moz-transform: translate(0, 3px);
        transform: translate(0, 3px);
        -o-transform: translate(0, 3px);
        -ms-transform: translate(0, 3px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        transform: translate(0, 0);
        -o-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        opacity: 1;
    }
}

.brand_process_item h3 {
    color: white;
    margin: 0;
    padding: 0;
    font-size: 20px;
}

.brand_process_text {
    width: 100%;
    text-align: center;
    margin: 50px 0;
}

.brand_process_text p {
    margin: 0 0 0 3% !important;
    padding: 0;
    font-size: 20px;
    color: white;
    text-align: left !important;
    width: 42%;
    display: inline-block;
    vertical-align: top;
}

.brand_process_portfolio {
    background: #ffc000;
    width: 100%;
    text-align: center;
}

.brand_process_portfolio h2 {
    font-size: 36px;
    color: black;
    margin: 0;
    padding: 10px 0;
    text-align: center;
}

.bpp_left, .bpp_right {
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    text-align: left;
    box-sizing: border-box;
}

.bpp_right {
    width: 49%;
}

.bpp_item_small {
    width: 50%;
    display: inline-block;
    vertical-align: top;
    height: 220px;
    position: relative;
    overflow: hidden;
}

.pinetrest-image-button {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 10;
}

.bpp_item_small span {
    left: 10px;
    top: 10px;
    opacity: 0;
    transition: all 0.4s ease;
    z-index: 10;
}

.bpp_item_small:hover span {
    opacity: 1;
}

.bpp_item_big {
    width: 100%;
    display: inline-block;
    vertical-align: top;
    height: 440px;
    position: relative;
    overflow: hidden;
}

.cover_img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: black;
    opacity: 0;
    cursor: pointer;
}

.bpp_left p {
    display: inline-block;
    position: absolute;
    top: 40%;
    left: 0;
    width: 100%;
    text-align: center;
    color: #ffffff;
    margin: 0 0 5px 0;
    padding: 0 0 5px 0;
    font-size: 24px;
    cursor: pointer;
    opacity: 0;
}

.bpp_right p {
    display: inline-block;
    position: absolute;
    top: 40%;
    left: 0;
    width: 100%;
    text-align: center;
    color: #ffc000;
    margin: 0 0 5px 0;
    padding: 0 0 5px 0;
    font-size: 30px;
    cursor: pointer;
    opacity: 0;
}

.bpp_left p span {
    display: inline-block;
    width: 100%;
    color: white;
    font-size: 18px;
}

.bpp_right p span {
    display: inline-block;
    width: 100%;
    color: white;
    font-size: 24px;
}

.bpp_item {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.bpp_item_small:hover .cover_img, .bpp_item_big:hover .cover_img {
    opacity: 0.6;
}

/*.bpp_item_small:hover  .bpp_item, .bpp_item_big:hover  .bpp_item*/
/*	{*/
/*		\*/
/*	}*/

.bpp_item_small:hover p, .bpp_item_big:hover p {
    opacity: 1;
}

.special_text {
    width: 42%;
    display: inline-block;
    vertical-align: top;
    padding: 40px 4%;
    text-align: left;
}

.special_text h2 {
    margin: 0;
    padding: 0;
    font-size: 36px;
    color: #ffc000;
}

.special_text p {
    margin: 10px 0;
    padding: 0;
    font-size: 18px;
    color: white;
}

.links_line {
    width: 92%;
    margin: 10px 4% 30px 4%;
    padding-top: 30px;
    border-top: 1px solid grey;
}

.link_line {
    text-align: left;
    width: 25%;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
}

.link_line:hover p {
    color: #ffc000;
}

.link_line_icon {
    width: 40px;
    height: 40px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin-right: 10px;
    display: inline-block;
    vertical-align: middle;
}

.link_line p {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    font-size: 18px;
    color: white;
}

.prev_work {
    position: absolute;
    top: 40%;
    left: 0;
    z-index: 199;
    padding-left: 4%;
    text-align: left;
}

.next_work {
    position: absolute;
    top: 40%;
    right: 0;
    z-index: 199;
    padding-right: 4%;
    text-align: right;
}

.prev_work p, .next_work p {
    color: white;
    font-size: 16px !important;
    margin: 0;
    padding: 0;
    text-align: left !important;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}

.prev_work p:hover, .next_work p:hover {
    color: #ffc000;
}

.next_work p {
    text-align: right !important;
}

.prev_work_icon {
    width: 30px;
    height: 30px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: middle;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/arrow_prev.png);
}

.next_work_icon {
    width: 30px;
    height: 30px;
    margin-left: 10px;
    display: inline-block;
    vertical-align: middle;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/arrow_next.png);
}

section.work_desc {
    /*width: 100%;*/
    position: relative;
    padding: 100px 200px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/brand_back.jpg);
}

section.work_desc h1 {
    color: #ffc000;
    font-size: 55px;
    text-align: center;
    margin: 0;
    padding: 0;
    position: relative;
}

section.work_desc p {
    color: white;
    font-size: 30px;
    text-align: center;
    margin: 15px 0;
    padding: 0;
    position: relative;
}

footer {
    background: black;
    width: 96%;
    padding: 2%;
    border-top: 1px solid #ffc000;
    position: relative;
    z-index: 5;
}
.short_footer {
    width: 30%;
    display: inline-block;
    vertical-align: top;
    text-align: left;
    border-right: 1px solid white;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.long_footer {
    width: 40%;
    display: inline-block;
    vertical-align: top;
    text-align: center;
}

.footer_logo {
    width: 100%;
    height: 40px;
    margin-bottom: 5px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/logo_small.png);
}

.short_footer p, .long_footer p {
    color: white;
    margin: 0;
    padding: 0;
    font-size: 18px;
}

.short_footer:last-child {
    text-align: right;
    border-right: 0;
    border-left: 1px solid white;
}

.footer_link_contact {
    margin-top: 15px;
    display: inline-block;
    vertical-align: middle;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid white;
    cursor: pointer;
}

.footer_link_contact:hover {
    border-color: #ffc000;
}

.footer_link_contact:hover p {
    color: #ffc000;
    margin-right: 15px;
}

.footer_link_contact:hover .small_arrow {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
}

.footer_link_contact p {
    color: white;
    margin: 0;
    padding: 0;
    line-height: 30px;
    display: inline-block;
    vertical-align: middle;
}

.small_arrow {
    width: 20px;
    height: 30px;
    display: inline-block;
    vertical-align: middle;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/small_arrow.png);
}

.social_link {
    width: 40px;
    height: 40px;
    display: inline-block;
    vertical-align: middle;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
}

.div26 {
    width: 60px;
    height: 30px;
    display: inline-block;
    vertical-align: bottom;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/div26.png);
}

.mobile_menu {
    width: 80px;
    height: 80px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/mm.jpg);
    display: none;
    vertical-align: bottom;
    user-select: none;
}

.mobile_mail {
    width: 80px;
    height: 80px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/mmail.jpg);
    display: none;
    vertical-align: bottom;
}

.mobile_call {
    width: 80px;
    height: 80px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/mcall.jpg);
    display: none;
    vertical-align: bottom;
}

.mobile_map {
    width: 80px;
    height: 80px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/mwhatsapp.png);
    display: none;
    vertical-align: bottom;
}

.translate {
    transform: translate(-100%, 0);
    -webkit-transform: translate(-100%, 0);
    -o-transform: translate(-100%, 0);
    -ms-transform: translate(-100%, 0);
    -moz-transform: translate(-100%, 0);
}

.slide_arrow {
    position: absolute;
    right: 0;
    top: 0;
    width: 25px;
    height: 100%;
    background-size: contain;
    background-position: right;
    z-index: 99;
    background-repeat: no-repeat;
    background-image: url(/images/static/slide_arrow.jpg);
}

.finger {
    position: absolute;
    right: 20%;
    bottom: 0;
    height: 100%;
    opacity: 0;
    width: 40px;
    background-size: contain;
    background-position: bottom;
    z-index: 99;
    background-repeat: no-repeat;
    background-image: url(/images/static/finger.png);
    animation: slidefinger 2.7s 1s 1 ease-in-out;
    -webkit-animation: slidefinger 2.7s 1s 1 ease-in-out;
    -moz-animation: slidefinger 2.7s 1s 1 ease-in-out;
    -o-animation: slidefinger 2.7s 1s 1 ease-in-out;
    display: none;
}

@-webkit-keyframes slidefinger {
    0% {
        right: 20%;
        opacity: 1;
    }
    80% {
        right: 80%;
        opacity: 1;
    }
    100% {
        right: 80%;
        opacity: 0;
    }
}

@-ms-keyframes slidefinger {
    0% {
        right: 20%;
        opacity: 1;
    }
    80% {
        right: 80%;
        opacity: 1;
    }
    100% {
        right: 80%;
        opacity: 0;
    }
}

@-moz-keyframes slidefinger {
    0% {
        right: 20%;
        opacity: 1;
    }
    80% {
        right: 80%;
        opacity: 1;
    }
    100% {
        right: 80%;
        opacity: 0;
    }
}

@-o-keyframes slidefinger {
    0% {
        right: 20%;
        opacity: 1;
    }
    80% {
        right: 80%;
        opacity: 1;
    }
    100% {
        right: 80%;
        opacity: 0;
    }
}

@keyframes slidefinger {
    0% {
        right: 20%;
        opacity: 1;
    }
    80% {
        right: 80%;
        opacity: 1;
    }
    100% {
        right: 80%;
        opacity: 0;
    }
}

.overlay {
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    z-index: 9998;
    display: none;
}

.modal_style {
    position: fixed;
    left: 100%;
    width: 40%;
    top: 100px;
    background: black;
    z-index: 9999;
    border-radius: 5px;
    border: 1px solid #ffc000;
}

.modal_style h3 {
    color: white;
    margin: 0;
    font-size: 24px;
    text-align: center;
    padding: 25px 0;
}

.modal_style input {
    width: 100% !important;
    padding: 2%;
    box-sizing: border-box;
    font-size: 18px;
    color: #ffc000;
    border: 0;
    margin: 0;
    vertical-align: top;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    font-family: 'Open Sans', sans-serif;
    border-radius: 0;
    box-shadow: none;
    background: white;
    text-align: center;
    background: rgba(255, 255, 255, 0.1);
}

.modal_style textarea {
    width: 96%;
    max-width: 96%;
    overflow: hidden;
    height: 150px;
    max-height: 150px;
    vertical-align: top;
    resize: none;
    outline: 0;
    padding: 2%;
    margin: 0;
    font-size: 18px;
    color: #ffc000;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    font-family: 'Open Sans', sans-serif;
    border-radius: 0;
    box-shadow: none;
    background: white;
    text-align: center;
    background: rgba(255, 255, 255, 0.1);
}

.modal_style input:nth-child(3) {
    border-top: 1px solid rgba(255, 255, 255, 0);
}

.modal_style p {
    color: grey;
    font-size: 14px;
    margin: 25px 15%;
    width: 70%;
    padding: 0;
    text-align: center;
}
.modal_style select {
    width: 100%;
    padding: 2%;
    font-size: 18px;
    color: #ffc000;
    border: 0;
    margin: 0;
    font-family: 'Open Sans', sans-serif;
    box-shadow: none;
    background: rgba(255, 255, 255, 0.1);
    width: 100%;
    text-align: center;
}
.modal_style option {
    font-size: 18px;
    color: #ffc000;
    background: rgb(56, 56, 56);
    margin: 0;
    padding-right: 30px;
    transition: all 200ms;
    padding: 2%;
}
.modal_style option:hover {
    opacity: 0.8;
}

.modal_style select::-ms-expand { display: none;} 
.modal_style select:hover { border-color: none;  } 
.modal_style select:focus { 
outline: none; 
} 

.modal_style input[type="number"] {
	-moz-appearance: textfield;
	-webkit-appearance: textfield;
	appearance: textfield;
}
 
.modal_style input[type="number"]::-webkit-outer-spin-button,
.modal_style input[type="number"]::-webkit-inner-spin-button {
	display: none;
}
.modal_window_application p {
    color: grey;
    font-size: 14px;
    margin: 20px 15% 5px 15%;
    width: 70%;
    padding: 0;
    text-align: center;
}


.send_it {
    text-align: center;
    font-size: 20px;
    padding: 10px 0;
    margin: 0;
    color: black;
    background: #ffc000;
    border-radius: 0 0 5px 5px;
    cursor: pointer;
}

.close_modal {
    position: absolute;
    top: 30px;
    right: 30px;
    width: 30px;
    height: 30px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/images/static/close.png);
    cursor: pointer;
}

.close_modal:hover {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
}

.translate_right {
    transform: translate(-175%, 0);
    -webkit-transform: translate(-175%, 0);
    -moz-transform: translate(-175%, 0);
    -ms-transform: translate(-175%, 0);
    -o-transform: translate(-175%, 0);
}

.lines_down {
    width: 100%;
    height: 100px;
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-image: url(/images/static/lines.png);
}

.view_3d {
    width: 100%;
    text-align: center;
}

.view_3d a {
    display: inline-block;
    vertical-align: middle;
    padding: 10px;
    margin-toP: 50px;
    color: white;
    border: 1px solid white;
    border-radius: 5px;
    font-size: 18px;
}

.view_3d a:hover {
    background: #ffc000;
    color: black;
    border-color: #ffc000;
}

.main_content figure {
    width: 100%;
    margin: 0;
    display: inline-block;
    vertical-align: top;
}

.main_content figure img {
    width: 100%;
}

.main_content figcaption {
    margin: 0 0 20px 0;
    padding: 3%;
    width: 100%;
    color: white;
    text-align: left;
    font-size: 18px;
    border: 1px solid grey;
    border-top: 0;
    box-sizing: border-box;
}

.usluga_img_pre {
    width: 100%;
    height: 200px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: black;
}

.esk_img {
    width: 19%;
    margin-right: 1%;
    margin-bottom: 1%;
    display: inline-block;
    vertical-align: top;
    height: 250px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.esk_big {
    width: 99%;
    height: 400px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.main_content p ul {
    color: white;
}

ul li,
ol li {
    color: white;
    font-size: 18px;
}

.in_page_text_header {
    text-align: left;
    padding: 25px 0;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(/images/static/top_prev.jpg);
}

.in_page_text_content {
    width: 60%;
    display: inline-block;
    vertical-align: top;
    margin: 0 5% 60px 0;
}

.in_page_text_content.ex {
    width: 47%;
}

.in_page_text_content.ex h1 {
    color: #fff;
}

aside.in_page_aside {
    width: 12%;
    margin-right: 10%;
    display: inline-block;
    vertical-align: top;
    box-shadow: none;
}

.aside_item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    padding: 20px 0;
    text-align: center;
    box-sizing: border-box;
}

.aside_item:hover {
    background: rgba(0, 0, 0, 0.3);
    box-shadow: inset 3px 0 7px 2px rgba(0, 0, 0, 0.5);
}

.aside_item_icon {
    width: 100%;
    height: 60px;
    margin-bottom: 10px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.aside_item a {
    color: white;
    margin: 0;
    font-size: 30px;
    padding: 0;
    border-bottom: 1px solid grey;
}

.aside_item a:hover {
    color: #ffc000;
    border-color: #ffc000;
}

.aside_item span {
    color: white;
    margin: 10px 0 0 0;
    font-size: 16px;
    padding: 10px 0 0 0;
    width: 100%;
    display: inline-block;
    font-weight: normal;
}

.aside_item span > span {
    border: 0;
    margin: 0;
    padding: 0;
    font-size: 18px;
    width: auto;
    font-weight: bold;
}

.in_page_text_content p /*, .in_page_text_content table*/
{
    color: white;
    font-size: 20px;
    margin: 0 3% 0 0;
    padding: 0 0 20px 0;
    font-weight: normal;
}

/*.in_page_text_content table{
	width: 100%;
}

.in_page_text_content table td{
	padding: 10px;
}
	*/
.in_page_text_header .link_back a, .top_block .link_back a {
    display: inline-block;
    vertical-align: middle;
    color: white;
    background: rgba(0, 0, 0, 0.3);
    padding: 10px;
    border-radius: 5px;
    font-size: 18px;
    cursor: pointer;
}

.top_block .link_back {
    position: relative;
    top: 80px;
}

.in_page_text_header .link_back a:hover, .top_block .link_back a:hover {
    background: #ffc000;
    color: black;
}

.text_content_left {
    width: 50%;
    display: inline-block;
    vertical-align: top;
    text-align: left;
    color: white;
    font-size: 36px;
    border-bottom: 1px solid grey;
    padding: 20px 0;
    margin-bottom: 20px;
}

.text_content_left span, .text_content_right span {
    color: #ffc000;
}

.text_content_right {
    width: 47%;
    margin-right: 3%;
    display: inline-block;
    vertical-align: top;
    text-align: right;
    color: white;
    font-size: 36px;
    border-bottom: 1px solid grey;
    padding: 20px 0;
    margin-bottom: 20px;
}

.link_back {
    width: 12%;
    margin-right: 10%;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
}

.in_page_img {
    width: 100%;
    max-width: 600px;
    height: 400px;
    display: block;
    vertical-align: top;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin: 20px 0;
}

@media (max-width: 768px) {
    .in_page_text_content h1 {
        font-size: 28px;
    }
    .in_page_img {
        height: 200px;
    }
}

.in_page_text_header h1 {
    display: inline-block;
    vertical-align: middle;
    color: white;
    font-size: 60px;
    margin: 30px 0;
}

/*.in_page_text_content h2,
.in_page_text_content .h2
	{
		display: inline-block;
		vertical-align: middle;
		color: white;
		font-size: 30px;
		margin: 50px 0;
		border-left: 5px solid #ffc000;
		padding-left: 20px;
	}*/

.in_page_text_content img {
    width: 31%;
    margin-right: 2%;
    padding: 5px 0 15px 0;
    display: inline-block;
}

.in_page_new_order {
    padding: 15px;
    color: black;
    background: #ffc000;
    font-size: 20px;
    display: inline-block;
    vertical-align: middle;
    border-radius: 7px;
    cursor: pointer;
}

.in_page_new_order + span {
    color: silver;
    display: inline-block;
    vertical-align: middle;
    margin-left: 20px;
    font-size: 16px;
    font-weight: normal;
}

.news_content {
    width: 60%;
    padding: 50px 20%;
    background: url(/images/static/pat_main_black.jpg);
}

.article_content {
    width: 90%;
    padding: 50px 5%;
    text-align: center;
    background: url(/images/static/pat_main_black.jpg);
}

.news_block {
    margin: 0 0 60px 0;
    width: 100%;
    position: relative;
    text-align: left;
}

.news_item {
    width: 70%;
    margin-left: 30%;
    display: inline-block;
    vertical-align: top;
    background: #222222;
    box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.5);
    cursor: pointer;
}

.article_item {
    width: 30%;
    margin-right: 3%;
    display: inline-block;
    vertical-align: top;
    background: #222222;
    box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.5);
    cursor: pointer;
    text-align: left;
}

.news_item_img {
    width: 30%;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    display: inline-block;
    vertical-align: top;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.article_item_img {
    width: 100%;
    height: 300px;
    display: inline-block;
    vertical-align: top;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.news_item h2, .article_item h2 {
    font-size: 30px;
    margin: 20px;
    padding: 0;
    color: #ffc000;
}

.news_item p, .article_item p {
    margin: 0;
    padding: 0 20px;
    font-size: 18px;
    font-weight: normal;
    color: white;
}

.news_item datetime, .article_item datetime {
    font-size: 14px;
    padding: 20px;
    margin-top: 20px;
    display: inline-block;
    vertical-align: top;
    text-align: left;
    width: 50%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    color: #ffc000;
    background: #111111;
}

.news_item span, .article_item span {
    font-size: 14px;
    padding: 20px;
    margin-top: 20px;
    display: inline-block;
    vertical-align: top;
    text-align: right;
    width: 50%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    color: #ffc000;
    background: #111111;
}

.news_page {
    width: 70%;
    margin: 0 15%;
}

.news_page h1 {
    color: white;
    margin: 50px 0 0 0;
}

.news_page h1 + datetime {
    color: silver;
    font-size: 16px;
}

.nav_news {
    width: 100%;
    margin: 0 0 40px 0;
    padding-top: 20px;
}

.nav_news_prev {
    width: 50%;
    text-align: left;
    display: inline-block;
    vertical-align: top;
}

.nav_news_next {
    width: 50%;
    text-align: right;
    display: inline-block;
    vertical-align: top;

}

.nav_news_next:hover a, .nav_news_prev:hover a {
    color: white;
}

.nav_news_next:hover datetime, .nav_news_prev:hover datetime {
    color: #ffc000;
}

.nav_news a {
    font-size: 18px;
    color: silver;
    margin-bottom: 15px;
    text-decoration: underline;
}

.nav_news datetime {
    font-size: 16px;
    color: silver;
    width: 100%;
    display: inline-block;
}

/******************** Языки *************************/

.lang_but {
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 9999;
}

.lang_button {
    background: black;
    color: white;
    display: inline-block;
    padding: 4px;
    height: 35px;
    width: 35px;
    text-align: center;
    cursor: pointer;
    font-size: 18px;
}

.lang_button:first-child {
    margin-right: 10px;
}

.lang_button > p {
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    margin: 0;
}

.lang_button_a {
    color: black;
    background: #ffc000;
}

.helper {
    display: inline-block;
    vertical-align: middle;
    width: 0;
    position: relative;
    height: 100%;
}

.m_lang_but {
    display: none;
    vertical-align: top;
    width: 100%;
    text-align: center !important;
    font-size: 20px;
    position: relative;
    border-bottom: 1px solid grey;
}

a.m_lang_button {
    text-align: center !important;
}

.m_lang_button {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    color: white;
    position: relative;
    height: 63px;
    border-left: 1px solid grey;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

.m_lang_button_a {
    color: black;
    background: #ffc000;
}


.bloki {
    /*height: 200px;*/
    margin-top: 22px;
    margin-bottom: 22px;
}


.bloki div {
    /*float: left;*/
    display: inline-block;
    width: 31%;
    color: #fff;
    text-align: center;
    font-size: 16px;
    box-sizing: border-box;
    padding-top: 15px;
    background-repeat: no-repeat;
    background-size: cover;
    height: 300px;
    margin: 0px;
    margin-left: 10px;
    margin-bottom: 10px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.bloki div span {
    background: rgba(0, 0, 0, 0.5);
    padding: 10px;
}

.bloki div:hover span {
    background: rgba(0, 0, 0, 1);
}

.blocki__1 {
    background-image: url(/images/static/il6k864w61do096n36b63ikexm9kb1w6.jpg);
}

.blocki__2 {
    background-image: url(/images/static/gkqd1kfhfbo01kw419j12598h126cf5j.jpg);
}

.blocki__3 {
    background-image: url(/images/static/9949f1282ynl9522f9o8875s9cbf1mgw.jpg);
}

.blocki__4 {
    background-image: url(/images/static/76v2wdg5d06ma4y4rw7w4j9a1x25e1fx.jpg);
}

.blocki__5 {
    background-image: url(/images/static/sfdgsdfgsdfgsdfgdrthndfds.png);
    background-size: contain;
}

.blocki__6 {
    background-image: url(/images/static/r30osq9p6por81o3q9s1o08r0no23son.jpg);
}

.top_block .dariya {
    background-image: url(/images/static/dariya.jpg);
    /*background-position: center;*/
    background-size: auto 100%;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    margin: auto;
    border: 3px solid #ffc000;
}


.dkb {
    float: left;
    width: 31%;
    font-size: 18px;
    margin-right: 2%;
    margin-bottom: 10px;
    background-color: #181818
}

.dkb__title {
    background-color: #ffc000;
    padding: 0.7em;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}


.dkb__img {
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100%;
    height: 170px;
    position: relative;
}


.dkb__arr {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100%;
    background-image: url(/images/static/arr.png);
    display: inline-block;
    position: absolute;
    width: 42px;
    height: 42px;
    right: -30px;
    top: 55px;
    z-index: 10;
}


.dkb__body {
    color: #fff;
    padding: 0.7em;
    min-height: 40px;
    text-align: center;
}


@media screen and (min-width: 1200px) {
    nav {
        height: 40px;
    }

    nav a {
        font-size: 16px;
    }

    nav li {
        width: 12%;
    }
}

@media screen and (min-width: 1920px) {
    .main_text {
        padding: 100px 5% 150px 5%
    }

    .main_text_2 {
        padding: 150px 7% 180px 7%
    }

    .absolute_corner_2 {
        left: 35%;
        width: 65%;
    }

    .main_text h1, .main_text_2 h2, .main_text .d-css-h1, .main_text_2 .d-css-h2 {
        font-size: 80px;
    }

    .portfolio_img_overflow {
        height: 300px;
    }

    .bpp_item_small {
        height: 320px;
    }

    .bpp_item_big {
        height: 640px;
    }

    .in_page_new_order {
        font-size: 24px;
    }

    /*work_link_icon {height: 60px;}*/
    .work_link p {
        font-size: 20px !important;
    }

    .top_block p {
        font-size: 50px;
        margin-bottom: 20px;
    }

    nav {
        height: 40px;
    }
}

@media screen and (max-width: 1600px) {
    .absolute_corner_2 {
        left: 34%;
        width: 66%;
    }

    .in_page_text_content p {
        font-size: 20px;
    }

    .in_page_text_content {
        width: 70%;
    }

    .in_page_text_content.ex {
        width: 47%;
    }

    .in_page_text_content h2, .in_page_text_content .d-css-h2 {
        font-size: 24px;
    }

    aside.in_page_aside, .link_back {
        width: 17%;
        margin-right: 5%;
    }

    nav a {
        font-size: 16px;
    }

    nav li {
        width: 12%;
    }
}

@media screen and (max-width: 1400px) {
    .news_content {
        width: 80%;
        padding: 50px 10%;
    }

    .article_item {
        width: 48%;
        margin-right: 2%;
    }

    .main_text_2 p {
        font-size: 18px;
    }

}

@media screen and (max-width: 1300px) {
    .header_contact_icon {
        display: none;
    }

    .btn_choose_type {
        font-size: 18px;
    }

    .btn_choose_type_2 {
        font-size: 18px;
    }

    .text_content_left, .text_content_right {
        font-size: 30px;
    }

}

@media screen and (max-width: 1200px) {
    .main_text h1, .main_text_2 h2, .main_text .d-css-h1, .main_text_2 .d-css-h2 {
        font-size: 40px;
    }

    .main_text p, .main_text_2 p {
        font-size: 16px;
    }

    .main_text_2 {
        width: 35%;
        margin-left: 50%;
        padding: 77px 7% 150px 12%;
    }

    .free_order_content {
        width: 65%;
        margin-left: 0;
    }

    .content_link_icon {
        width: 30px;
    }

    .content_link p {
        font-size: 14px;
    }

    .type_portfolio_content {
        margin: 0;
    }

    .type_portfolio_content p {
        font-size: 20px;
    }

    .in_page_text_content, .in_page_text_content.ex {
        width: 76%;
        margin-right: 2%;
    }

    aside.in_page_aside, .link_back {
        width: 19%;
        margin-right: 2%;
    }

    .in_page_text_header h1, .in_page_text_header .d-css-h1 {
        font-size: 40px;
    }

    .in_page_text_content.ex + .reviews {
        display: none;
    }

}

@media screen and (max-width: 1100px) {
    .header_contact_text p:first-child {
        font-size: 14px;
    }

    .header_contact_text p:last-child {
        font-size: 20px;
    }

    nav .small_menu a {
        font-size: 16px !important;
    }

    .small_arrow {
        display: none;
    }

    .btn_choose_type {
        font-size: 16px;
    }

    .btn_choose_type_2 {
        font-size: 16px;
    }
}

@media screen and (max-width: 1024px) {
    .logotype p {
        font-size: 14px;
    }

    aside.in_page_aside {
        white-space: nowrap;
        width: 100%;
        overflow-x: scroll;
        margin: 0;
        -webkit-overflow-scrolling: touch;
    }

    .in_page_text_content, .in_page_text_content.ex {
        margin: 0 5% 40px 5%;
        width: 90%;
    }

    .aside_item {
        width: 200px;
        white-space: normal;
        display: inline-block;
        padding: 10px 0;
    }

    .aside_item:hover {
        background: none;
        box-shadow: none;
    }

    .aside_item_icon {
        height: 40px;
    }

    .aside_item a {
        font-size: 24px;
    }

    .link_back {
        width: 100%;
        margin: 0;
    }

    .in_page_text_header h1, .in_page_text_header .d-css-h1 {
        width: 90%;
        padding: 0 5%;
        margin: 15px 0 0 0;
        text-align: center;
    }

    .reviews {
        display: none;
    }

    .esk_img {
        height: 250px;
    }

    .esk_big {
        height: 350px;
    }

    .main_content {
        width: 94%;
    }

    .portfolio_preview_text p {
        font-size: 14px;
    }

    .about_text p {
        font-size: 12px;
    }

    .new_person {
        font-size: 24px;
    }

    .link_line p {
        width: 70%;
    }

    .modal_style {
        width: 50%;
    }

    .logotype img {
        height: 50px;
    }

    .last_portfolio {
        display: none;
    }

    .work_content {
        width: 100%;
    }

    .contact_info_item:last-child {
        display: none;
    }

    section.main_2 {
        background-image: url(/images/static/clothes_prev.jpg);
        background-size: cover;
    }

    section.main {
        background-size: cover;
    }

    .translate_right {
        transform: translate(-150%, 0);
        -webkit-transform: translate(-150%, 0);
        -moz-transform: translate(-150%, 0);
        -ms-transform: translate(-150%, 0);
        -o-transform: translate(-150%, 0);
    }

    .absolute_corner {
        width: 70%;
        position: absolute;
        height: 100%;
        left: 0;
        top: 0;
        background-image: url(/images/static/left_corner.png);
        background-size: cover;
        background-position: right center;
        background-repeat: no-repeat;
        opacity: 1;
    }

    .absolute_corner_2 {
        width: 70%;
        position: absolute;
        height: 100%;
        left: 30%;
        top: 0;
        background-image: url(/images/static/right_corner.png);
        background-size: cover;
        background-position: left center;
        background-repeat: no-repeat;
        opacity: 1;
    }

    table.bordered td {
        font-size: 15px;
    }

    .top_block .link_back {
        top: 30px;
    }
}

@media screen and (max-width: 980px) {
    .trigger_item {
        width: 33%;
        margin: 20px 0;
    }

    .main_review_item p:last-child {
        font-size: 14px;
    }

    .short_footer p, .long_footer p {
        font-size: 14px;
    }

    .social_link {
        width: 30px;
        height: 30px;
    }

    .main_text p, .main_text_2 p {
        font-size: 16px;
    }

    .main_text h1, .main_text_2 h2, .main_text .d-css-h1, .main_text_2 .d-css-h2 {
        font-size: 32px;
    }

    .design_rest p {
        font-size: 16px;
    }

    nav a {
        font-size: 16px;
    }

    .m_lang_but {
        font-size: 16px;
    }

    nav.small_menu a {
        font-size: 16px !important;
    }

    nav.small_menu .small_menu_logo {
        height: 49px;
        float: left;
    }

    .type_portfolio_content:last-child {
        display: none;
    }

    .btn_choose_type {
        width: 100%;
        border-top: 1px solid silver !important;
        border-bottom: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
    }

    .btn_choose_type:last-child {
        border-bottom: 1px solid silver !important;
    }

    .person {
        width: 46%;
    }

    .brand_process_item h3, .brand_process_item .d-css-h3 {
        font-size: 18px;
    }

    .contact_info_item p:first-child, .contact_info_item p:last-child {
        font-size: 16px;
    }

    .contact_info_item p:nth-child(2) {
        font-size: 24px;
    }

    .contact_block p {
        font-size: 14px;
    }

    .contact_block h1, .contact_block h2, .feedback_static h3, .contact_block .d-css-h1, .contact_block .d-css-h2, .feedback_static .d-css-h3 {
        font-size: 24px;
    }

    .feedback_static input, .feedback_static textarea {
        font-size: 16px !important;
    }

    .prev_work, .next_work {
        top: 50%;
    }

    aside {
        display: none;
    }

    .portfolio_content {
        position: relative;
        width: 96%;
        padding: 0 2% 50px 2%;
    }

    .dkb {
        width: 100%;
        font-size: 18px;
        margin-right: 0;
    }

    .dkb__title {
    }


    .dkb__img {
    }


    .dkb__arr {
        display: none;
    }


    .dkb__body {
        min-height: 0;
    }
}

@media (max-width: 965px) {
    .bloki {
        /*height: 200px;*/
    }

    .bloki div {
        width: 50%;
    }
}

@media screen and (max-width: 920px) {
    .header_contact_text p:last-child {
        font-size: 17px;
    }
}

@media screen and (max-width: 850px) {
    .logotype img {
        height: 50px;
    }

    .absolute_corner, .absolute_corner_2 {
        display: none;
    }

    .main_text, .main_text_2 {
        background: #2c2c2c;
    }

    .main_text_2 {
        padding-bottom: 50px;
    }

    nav.small_menu a {
        font-size: 15px !important;
    }

    .brand_text h2, .brand_text .d-css-h2 {
        font-size: 20px;
    }

    .link_line {
        width: 50%;
        margin: 10px 0;
    }

    .link_line p {
        white-space: nowrap;
    }
}

@media screen and (max-width: 870px) {
    .absolute_corner, .absolute_corner_2 {
        display: none;
    }

    .main_text, .main_text_2 {
        background: #2c2c2c;
    }

    .main_text_2 {
        padding-bottom: 50px;
    }

    nav.small_menu a {
        font-size: 15px !important;
    }

    .brand_text h2, .brand_text .d-css-h2 {
        font-size: 20px;
    }

    .link_line {
        width: 50%;
        margin: 10px 0;
    }

    .link_line p {
        white-space: nowrap;
    }
}

@media (max-width: 770px) {
    .bloki div {
        width: 100%;
        margin-bottom: 0;
        margin-left: 0;
    }

    nav ul {
        flex-direction: column;
    }

    nav li:last-child {
        display: block;
    }

    .sm-hide {
        display: none;
    }
}


.header__call-btn {
    display: flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 10px;
    cursor: pointer;
}

.header__call-btn-ico {
    width: 40px;
    height: 40px;
    background: url(/images/static/call-center-ico.svg) 0 0 / cover no-repeat;
    margin-right: 5px;
    flex-shrink: 0;
}

.header__call-btn-text {
    font-size: 16px;
    color: #ffc000;
}

@media (max-width: 1024px) {
    .header__call-btn-text {
        font-size: 14px;
    }
}




@media (max-width: 480px) {
    .header__call-btn-ico {
        width: 25px;
        height: 25px;
    }
    .header__call-btn-text {
        font-size: 8px;
        text-transform: uppercase;
    }
}




@media screen and (max-width: 768px) {
    .header_contact_block_whatsapp {
        display: none;
    }

    .header_bottom_mobile {
        display: flex;
    }

    .main-title {
        font-size: 25px;
    }

    .new_link {
        margin-top: 10px;
    }

    .logotype {
        padding: 15px 8% 15px 4%;
    }

    .logotype p {
        display: none;
    }

    .article_item {
        width: 100%;
        margin-right: 0;
    }

    .news_item_img {
        height: 300px;
        width: 100%;
        position: relative;
    }

    .news_item {
        margin: 0;
        width: 100%;
        position: relative;
    }

    .news_item_img {
        background-size: cover !important;
    }

    .esk_img {
        height: 200px;
    }

    .esk_big {
        height: 300px;
    }

    .main, .main_2 {
        padding-top: 200px;
    }

    .main_content p {
        font-size: 16px;
    }

    .main_text, .main_text_2 {
        width: 90%;
        max-width: none;
        margin: 0;
        padding: 30px 5%;
        background: rgba(0, 0, 0, 0.7);
        text-align: left;
    }

    .main_text h1 span, .main_text_2 h2 span, .main_text .d-css-h1 span, .main_text_2 .d-css-h2 span {
        display: inline;
    }

    .main_text h1, .main_text_2 h2, .main_text .d-css-h1, .main_text_2 .d-css-h2 {
        display: inline;
        color: #ffc000;
    }

    .main_review_item {
        width: 92%;
    }

    .mobile_menu, .mobile_mail, .mobile_call, .mobile_map {
        display: inline-block;
    }
    
    .header__mobile {
        display: none;
    }

    .header_contact_block:nth-child(2) {
        display: flex;
        align-items: center;
        padding: 0;
        position: absolute;
        right: 160px;
        top: 0;
        height: 80px;
        flex-shrink: 0;
        width: 180px;
    }

    .header_contact_block:nth-child(3) {
        width: 160px;
        padding: 0;
        position: absolute;
        /*right: 80px;*/
        right: 0;
        top: 0;
    }

    .header_contact_block:nth-child(5) {
        padding: 0;
        width: 80px;
        position: absolute;
        right: 0;
        top: 0;
        -khtml-user-select: none;
        user-select: none;
    }

    .design_rest a, .header_contact_text {
        display: none;
    }

    .design_rest {
        display: none;
        margin: 0;
        padding: 0;
        width: 80px;
        position: absolute;
        right: 0;
        top: 0;
    }

    nav {
        position: fixed;
        top: 80px;
        bottom: 0;
        overflow-y: scroll;
        left: 100%;
        width: 100%;
        z-index: 999;
        padding: 0;
    }

    nav li {
        width: 100%;
        float: left;
        text-align: left;
    }

    nav a {
        border-bottom: 1px solid grey;
        text-align: left;
        padding: 20px 3%;
        font-size: 20px;
    }

    nav li ul {
        display: block;
        position: static;
        background-color: #000000;
        width: 100%;
        min-width: 12%;
        padding: 10px 0;
        z-index: 9999;
    }

    .m_lang_but {
        display: inline-block;
        font-size: 20px;
    }

    .small_menu {
        display: none;
    }

    header {
        position: absolute;
        top: 0;
        width: 100%;
        left: 0;
        background: #2c2c2c;
        box-shadow: 0 0 2px 1px black;
    }

    body {
        padding-top: 137px;
        position: relative;
        z-index: 1;
        overflow-x: hidden;
    }

    .finger {
        display: block;
    }

    ul li {
        font-size: 16px;
    }

    .lines_down {
        display: none;
    }

    .work_links_lay {
        z-index: 999;
        position: relative;
        overflow: hidden;
        height: 90px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        animation: slideblock 0.7s 1s 1 linear;
        -webkit-animation: slideblock 0.7s 1s 1 linear;
        -ms-animation: slideblock 0.7s 1s 1 linear;
        -o-animation: slideblock 0.7s 1s 1 linear;
        -moz-animation: slideblock 0.7s 1s 1 linear;
    }

    @-webkit-keyframes slideblock {
        0% {
            box-shadow: 0 0 0 0 #ffc000;
        }
        50% {
            box-shadow: 0 0 10px 3px #ffc000;
        }
        100% {
            box-shadow: 0 0 0 0 #ffc000;
        }
    }
    @-o-keyframes slideblock {
        0% {
            box-shadow: 0 0 0 0 #ffc000;
        }
        50% {
            box-shadow: 0 0 10px 3px #ffc000;
        }
        100% {
            box-shadow: 0 0 0 0 #ffc000;
        }
    }
    @-moz-keyframes slideblock {
        0% {
            box-shadow: 0 0 0 0 #ffc000;
        }
        50% {
            box-shadow: 0 0 10px 3px #ffc000;
        }
        100% {
            box-shadow: 0 0 0 0 #ffc000;
        }
    }
    @-ms-keyframes slideblock {
        0% {
            box-shadow: 0 0 0 0 #ffc000;
        }
        50% {
            box-shadow: 0 0 10px 3px #ffc000;
        }
        100% {
            box-shadow: 0 0 0 0 #ffc000;
        }
    }
    @keyframes slideblock {
        0% {
            box-shadow: 0 0 0 0 #ffc000;
        }
        50% {
            box-shadow: 0 0 10px 3px #ffc000;
        }
        100% {
            box-shadow: 0 0 0 0 #ffc000;
        }
    }
    .work_links {
        overflow-x: scroll;
        -webkit-overflow-x: scroll;
    }

    .work_links_overflow {
        width: 1200px;
    }

    .free_order_content {
        width: 100%;
    }

    .free_order, .free_order_content {
        text-align: center;
    }

    .free_order_content h5, .free_order_content .d-css-h5 {
        text-align: center;
        font-size: 24px;
    }

    .free_order_content p {
        font-size: 16px;
    }

    .free_order_icon {
        width: 40px;
        height: 40px;
    }

    .free_order_btn_block {
        display: none;
    }

    .work_link:hover {
        background: transparent;
    }

    .work_links {
        -webkit-overflow-scrolling: touch;
    }

    .about_text {
        width: 92%;
    }

    .brand_text h2, .brand_text .d-css-h2 {
        width: 90%;
        margin: 0 5%;
    }

    .rand_process_item h3, .rand_process_item .d-css-h3 {
        font-size: 14px;
    }

    .brand_process_text p {
        font-size: 18px;
        width: 46%;
    }

    .brand_process_portfolio h2, .brand_process_portfolio .d-css-h2 {
        font-size: 24px;
    }

    .bpp_left, .bpp_right {
        width: 100%;
    }

    .brand_process_item {
        width: 33%;
    }

    .important_link a {
        display: block;
        left: 0;
        background: transparent;
        color: white;
        font-size: 20px !important;
    }

    .important_link {
        display: inline-block;
        width: 44%;
        left: 0;
        margin: 0;
        background: transparent;
        color: white !important;
        padding: 20px 3%;
        font-size: 20px !important;
        height: auto !important;
        line-height: normal;
        vertical-align: bottom;
    }

    .left_contact {
        width: 94%;
    }

    .contact_block {
        width: 44%;
    }

    .right_map {
        width: 100%;
        height: 300px !important;
    }

    .special_text {
        width: 92%;
        padding: 25px 0 0 0;
    }

    .work_desc h1, .work_desc .d-css-h1 {
        font-size: 36px !important;
    }

    .bpp_item_small {
        width: 50% !important;
    }

    /*.bpp_item_small p, .bpp_item_bit p, .bpp_right p {
        opacity: 1 !important;
        top: 45%;
        color: white;
    }*/

    .cover_img {
        opacity: 0 !important;
    }

    .portfolio_preview {
        /*width: 48% !important;*/
        /*margin: 1% !important;*/
    }

    .modal_style {
        width: 60%;
        top: 20px;
    }

    .cover_img + p {
        display: none;
    }

    .translate_right {
        transform: translate(-133%, 0);
        -webkit-transform: translate(-133%, 0);
        -moz-transform: translate(-133%, 0);
        -ms-transform: translate(-133%, 0);
        -o-transform: translate(-133%, 0);
    }

    .aside_item a {
        font-size: 18px;
    }

    .aside_item span {
        font-size: 14px;
        margin: 0;
    }

    .aside_item span > span {
        font-size: 16px;
    }

    .aside_item_icon {
        margin: 0;
    }

    .in_page_text_content p {
        font-size: 18px;
    }

    .text_content_left, .text_content_right {
        font-size: 24px;
    }

    .lang_button {
        display: none;
    }
}

@media screen and (max-width: 750px) {
    .short_footer:first-child {
        display: none;
    }

    .short_footer {
        width: 50%;
        text-align: center !important;
        border-left: 0 !important;
    }

    .long_footer {
        width: 50%;
    }
}

@media screen and (max-width: 700px) {
    .new_order {
        display: none;
    }

    .content_link {
        width: 92% !important;
    }

    .person_foto {
        height: 130px;
    }

    .brand_process_text p {
        margin: 10px 0 0 0 !important;
        width: 94%;
    }

    .contact_info_item:last-child {
        display: none;
    }

    .contact_info_item {
        width: 46%;
    }

    .link_line {
        width: 100%;
    }

    .link_line p {
        font-size: 16px;
    }

    .text_content_left, .text_content_right {
        width: 100%;
        text-align: left;
    }

    .text_content_left {
        margin-bottom: 0;
    }
}

@media screen and (max-width: 600px) {
    .left_head_main {
        width: 100%;
        text-align: center
    }

    .left_head_main h2, .left_head_main h2 span, .left_head_main .d-css-h2, .left_head_main .d-css-h2 span {
        font-size: 40px;
        color: white;
        width: auto;
    }

    .left_head_main h2 span, .left_head_main .d-css-h2 span {
        display: inline;
    }

    .center_head_main, .right_head_main {
        display: none;
    }

    .main_review {
        margin: 20px 5%;
    }

    .main_review_item {
        padding: 15px 4%;
        border-bottom: 1px solid grey;
        text-align: center;
    }

    .new_main_review:last-child {
        display: none;
    }

    .new_main_review:first-child {
        border-right: 1px solid white;
        border-radius: 5px;
    }

    .long_footer {
        width: 100%;
    }

    .short_footer {
        width: 100%;
        margin-top: 20px;
    }

    .trigger_icon {
        height: 70px;
    }

    .trigger_item {
        width: 100%;
    }

    .action_block_btn {
        width: 100%;
    }

    .main .main_btn {
        display: none;
    }

    .main_2 {
        border-top: 1px solid #ffc000;
    }

    .new_person {
        font-size: 18px;
    }

    .head_persons h3, .head_persons .d-css-h3 {
        font-size: 18px;
    }

    .person_name h4, .person_name .d-css-h4 {
        font-size: 20px;
    }

    .person_name p {
        font-size: 14px;
    }

    section.brand {
        padding: 50px 0;
    }

    section.brand h1, section.brand .d-css-h1 {
        font-size: 50px;
    }

    .brand_text h2, .brand_text .h2 {
        font-size: 18px;
    }

    section.brand_process h2, section.brand_process .d-css-h2 {
        font-size: 36px;
    }

    .contact_block {
        width: 94%;
    }

    .work_content_step h3, .work_content_step .d-css-h3 {
        font-size: 24px;
    }

    .work_content_step p {
        font-size: 16px;
    }

    .work_desc h1, .work_desc .d-css-h1 {
        font-size: 24px !important;
    }

    .work_desc p {
        font-size: 16px !important;
    }

    .prev_work p, .next_work p {
        display: none;
    }

    .prev_work, .next_work {
        top: 40%;
    }

    section.work_desc {
        padding: 30px 0;
    }

    .modal_style {
        width: 90%;
        top: 20px;
    }

    .modal_style h3, .modal_style .d-css-h3 {
        font-size: 18px;
    }

    nav a {
        padding: 10px 3%;
        font-size: 14px;
    }

    .m_lang_but {
        font-size: 14px;
    }

    .m_lang_button {
        height: 37px;
    }

    a.important_link {
        padding: 10px 3%;
        font-size: 14px !important;
    }

    .close_modal {
        right: 10px;
        width: 25px;
        top: 25px;
    }

    .translate_right {
        transform: translate(-105%, 0);
        -webkit-transform: translate(-105%, 0);
        -moz-transform: translate(-105%, 0);
        -ms-transform: translate(-105%, 0);
        -o-transform: translate(-105%, 0);
    }

    .esk_img {
        height: 150px;
    }

    .esk_big {
        height: 250px;
    }

    .priceTable {
        width: 100%;
        overflow-x: scroll;
        font-size: 11px;
    }


    .advantages_main > ul {
        margin-left: 0;
        padding-left: 0;
    }
}

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

    .header_contact_block:nth-child(2) {
        right: 160px;
        top: 0;
        height: 80px;
        flex-shrink: 0;
        width: 120px;
    }


    .order_trigger:first-child {
        margin-bottom: 30px;
    }

    .order_trigger {
        width: 100%;
        padding: 0;
    }

    section.brand h1, section.brand .d-css-h1 {
        font-size: 36px;
    }

    .brand_text h2, .brand_text .d-css-h2 {
        font-size: 16px;
    }

    section.brand_process h2, section.brand_process .d-css-h2 {
        font-size: 26px;
    }

    section.brand_process p {
        font-size: 14px;
        width: 80%;
        margin: 0 10%;
    }

    .brand_process_text {
        margin: 15px 0;
    }

    .brand_process_text p {
        font-size: 16px;
    }

    .modal_style textarea {
        height: 70px;
        font-size: 15px;
    }

    .modal_style input {
        font-size: 15px;
    }
}

@media screen and (max-width: 480px) {
    .nav_news_prev, .nav_news_next {
        width: 100%;
        margin-bottom: 30px;
        text-align: center;
    }

    .news_content, .article_content {
        padding: 30px 0;
        width: 100%;
    }

    .news_block {
        width: 100%;
        margin: 0 0 50px 0;
        padding: 0;
        border-bottom: 2px solid #ffc000;
    }

    .news_item_img, .article_item_img {
        height: 200px;
    }

    .news_item h2, .article_item h2, .news_item .d-css-h2, .article_item .d-css-h2 {
        font-size: 18px;
    }

    .news_item p, .article_item p {
        font-size: 14px;
    }

    .mobile_call, .mobile_mail, .mobile_map, .mobile_menu {
        width: 50px;
        height: 50px;
    }

    .header_contact_block:nth-child(2) {
        display: flex;
        align-items: center;
        padding: 0;
        position: absolute;
        right: 84px;
        top: 0;
        height: 50px;
        flex-shrink: 0;
        width: 120px;
    }

    .header_contact_block:nth-child(3) {
        padding: 0;
        width: 100px;
        position: absolute;
        /*right: 50px;*/
        right: 0;
        top: 0;
    }

    .header_contact_block:nth-child(5) {
        padding: 0;
        width: 50px;
        position: absolute;
        right: 0;
        top: 0;
    }

    .logotype {
        padding: 10px 0 10px 10px;
    }

    .header_bottom_mobile {
        padding: 10px;
    }

    .logotype img {
        height: 30px;
        float: left;
    }

    .main, .main_2 {
        padding-top: 0;
    }

    .left_head_main h2, .left_head_main h2 span, .left_head_main .d-css-h2, .left_head_main .d-css-h2 span {
        font-size: 20px;
        color: black;
        width: auto;
        background: none;
    }

    .head_main {
        width: 94%;
        margin: 0;
        padding: 2% 3% 4% 3%;
        background: #ffc000;
    }

    section.action_block h4, section.action_block .d-css-h4 {
        font-size: 30px;
    }

    section.action_block p {
        font-size: 16px;
    }

    .white_logo {
        height: 50px;
    }

    .action_btn {
        width: 90%;
        margin: 10px 2%;
        padding: 2px 0 8px 0;
        box-sizing: border-box;
    }

    .action_block_btn {
        width: 50%;
        margin-top: 10px;
    }

    .action_btn > .new_main_review_icon {
        display: none;
    }

    nav {
        top: 50px;
    }

    body {
        padding-top: 107px;
    }

    .top_block p {
        line-height: 100px;
        font-size: 24px;
    }

    .work_link_icon {
        height: 30px;
    }

    .work_link p {
        font-size: 14px;
        line-height: normal;
    }

    .work_links_lay {
        height: 90px;
    }

    .main_content h1, .main_content .d-css-h1 {
        font-size: 24px;
        margin-top: 20px;
    }

    .work_links_overflow {
        width: 900px;
    }

    .order_trigger p {
        font-size: 12px;
    }

    .order_trigger p span {
        font-size: 18px;
    }

    .order_trigger_icon {
        width: 20px;
        height: 20px;
    }

    .order_trigger:first-child {
        margin-bottom: 0;
    }

    .order_trigger {
        width: 50%;
        padding: 0;
    }

    .order_block {
        padding: 4px 0 10px 0;
        margin: 10px 0;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .free_order_content h5 {
        font-size: 20px;
    }

    .person_foto {
        height: 100px;
    }

    .person_name h4, .person_name .d-css-h4 {
        font-size: 18px;
    }

    .person_name p {
        font-size: 12px;
    }

    .new_person {
        display: none;
    }

    .head_persons {
        text-align: center;
    }

    .bpp_item_small {
        height: 150px;
    }

    .bpp_item_big {
        height: 220px;
    }

    .bpp_left p {
        font-size: 14px;
    }

    .bpp_right p {
        font-size: 20px;
    }

    section.brand h1, section.brand .d-css-h1 {
        font-size: 28px;
    }

    section.brand p {
        font-size: 18px;
    }

    .brand_process_item {
        width: 50%;
    }

    .brand_process_item h3, .brand_process_item .d-css-h3 {
        font-size: 16px;
    }

    .brand_btn p {
        font-size: 18px !important;
    }

    .contact_info_item:nth-child(2) {
        display: none;
    }

    .contact_info_item {
        width: 93%;
        padding-left: 5%;
    }

    .work_content_line_icon {
        height: 20px;
    }

    .work_content_line h2, .work_content_line .d-css-h2 {
        font-size: 20px;
    }

    .work_content_line {
        padding: 5px 0 9px 0;
    }

    .about_text h2, .about_text .d-css-h2 {
        font-size: 24px;
    }

    .brand_text {
        padding: 25px 0;
    }

    .special_text h2, .special_text .d-css-h2 {
        font-size: 24px;
    }

    .special_text p {
        font-size: 14px;
    }

    .portfolio_preview_text p {
        display: none;
    }

    .portfolio_img_overflow {
        height: 120px;
    }

    .portfolio_preview_text h2 {
        font-size: 14px !important;
    }

    .modal_style {
        width: 100%;
        bottom: 0;
        top: auto;
        border: 0;
        height: 100%;
        border-radius: 0;
    }

    .modal_style h3, .modal_style .d-css-h3 {
        font-size: 18px;
    }

    .modal_style p {
        font-size: 14px;
        width: 80%;
        margin: 25px 10%;
    }

    .close_modal {
        right: 10px;
        width: 25px;
        top: 23px;
    }

    .send_it {
        border-radius: 0;
    }

    .translate_right {
        transform: translate(-100%, 0);
        -webkit-transform: translate(-100%, 0);
        -moz-transform: translate(-100%, 0);
        -ms-transform: translate(-100%, 0);
        -o-transform: translate(-100%, 0);
    }

    .new_link {
        font-size: 14px;
    }

    ul li {
        font-size: 14px;
    }

    .esk_img {
        height: 100px;
    }

    .esk_big {
        height: 200px;
    }

    .in_page_text_header h1 {
        font-size: 24px;
    }

    .link_back {
        font-size: 16px;
    }

    .aside_item {
        width: auto !important;
        padding: 10px;
    }

    .aside_item_icon {
        height: 30px;
    }

    .aside_item a {
        font-size: 14px;
    }

    .in_page_text_content h2, .in_page_text_content .d-css-h2 {
        margin: 20px 0;
        font-size: 18px;
    }

    .text_content_left, .text_content_right {
        font-size: 20px;
    }

    .text_content_left {
        border-top: 1px solid grey;
    }

    .center_button {
        text-align: center;
    }

    .in_page_new_order + span {
        margin: 20px 0 0 0;
    }

    .in_page_text_content img {
        width: 100%;
        margin: 5px 0;
    }

    .new_link {
        margin-top: 0;
        margin-bottom: 15px;
    }

    .m_lang_button {
        height: 35px;
    }
}

@media screen and (max-width: 320px) {
    .brand_logo {
        display: none;
    }

    .brand_btn {
        margin-top: 20px;
    }

    .brand_text h2, .brand_text .d-css-h2, .brand_process_text p {
        font-weight: normal;
        text-align: left;
    }

    section.brand h1, section.brand .d-css-h1 {
        color: white;
        font-size: 50px;
        text-shadow: 0 0 3px black;
    }

    .work_content h1 {
        display: none;
    }

    .person {
        width: 100%;
        margin: 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    }

    .person_foto {
        height: 150px;
    }

    .persons {
        padding-bottom: 0;
    }

    .feedback_static input, .feedback_static textarea {
        font-size: 16px !important;
        border-radius: 0 !important;
        font-family: 'Open Sans', sans-serif !important;
    }
}

/* hide prices */
.in_page_text_content .text_content_left:not(.must_show), /* http://academstudio.ru/design_kvartir/dizayn-vannoy/ рядом со сроком */
.order_trigger:not(.must_show), /* http://academstudio.ru/jeskiznyj_dizajn_proekt/ рядом с кнопкой заказа */
.aside_item span:not(.must_show), /* http://academstudio.ru/design_kvartir/ слева */
div[itemtype="http://schema.org/Offer"]:not(.must_show) /* http://academstudio.ru/design_kvartir/ внизу */
{
    display: none;
}


.main_text .d-css-h1 span {
    color: #ffc000;
    font-size: 30px;
    width: 100%;
    display: block;

}


.left_head_main .d-css-h2 span {
    color: #ffc000;
    font-size: 30px;
    width: 100%;
    display: block;

}

.main_review_item .d-css-h3, h2.d-css-h3, h2 {
    margin: 0;
    padding: 0;
    color: #ffc000;
    font-size: 30px;
    border: none;
    margin-bottom: 20px;
}

section.action_block .d-css-h4 {
    font-size: 50px;
    color: white;
    text-align: center;
    margin: 0;
    padding: 0;

}

.portfolio_preview_text .d-css-h2 {
    color: #ffcc00;
    margin: 0 0 5px 0;
    padding: 0;
    font-size: 20px;

}

.main_content .d-css-h1 {
    color: white;
    font-size: 40px;
    margin: 20px 0 0 0;
    padding: 0;

}

.head_review .d-css-h3 {
    margin: 0;
    padding: 0;
    font-size: 24px;
    color: white;

}

.review_item .d-css-h4 {
    color: #ffc000;
    margin: 5px 0 0 0;
    padding: 0;
    font-size: 20px;

}

.free_order_content .d-css-h5 {
    font-size: 40px;
    color: white;
    margin: 0 0 15px 0;
    padding: 0;
    text-align: left;

}

.work_content .d-css-h1 {
    color: white;
    width: 90%;
    margin: 15px 5%;
    font-size: 24px;
    padding: 0;
    text-align: left;

}

.work_content_line .d-css-h2 {
    font-size: 30px;
    color: black;
    text-align: left;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    padding: 0;

}

.work_content_step .d-css-h3 {
    color: #ffc000;
    font-size: 30px;
    margin: 0 0 20px 0;
    padding: 0;

}

.head_persons .d-css-h3 {
    width: 66%;
    display: inline-block;
    vertical-align: middle;
    color: black;
    padding: 15px 0 15px 4%;
    margin: 0;
    font-size: 30px;

}

.person_name .d-css-h4 {
    color: #ffc000;
    font-size: 24px;
    margin: 0;
    padding: 0;

}

.feedback_static .d-css-h3 {
    color: white;
    font-size: 30px;
    margin: 10px 0;
    padding: 0;

}

section.brand .d-css-h1 {
    color: #ffc000;
    font-size: 70px;
    text-align: center;
    margin: 0;
    padding: 0;

}

.brand_text .d-css-h2 {
    width: 70%;
    margin: 0 15%;
    padding: 0;
    color: white;
    font-size: 24px;
    text-align: center;

}

section.brand_process .d-css-h2 {
    margin: 0;
    padding: 0;
    color: #ffc000;
    font-size: 50px;
    text-align: center;

}

.brand_process_item .d-css-h3 {
    color: white;
    margin: 0;
    padding: 0;
    font-size: 20px;

}

.brand_process_portfolio .d-css-h2 {
    font-size: 36px;
    color: black;
    margin: 0;
    padding: 10px 0;
    text-align: center;

}

.special_text .d-css-h2 {
    margin: 0;
    padding: 0;
    font-size: 36px;
    color: #ffc000;

}

section.work_desc .d-css-h1 {
    color: #ffc000;
    font-size: 55px;
    text-align: center;
    margin: 0;
    padding: 0;
    position: relative;

}

.modal_style .d-css-h3 {
    color: white;
    margin: 0;
    font-size: 24px;
    text-align: center;
    padding: 25px 0;

}

.in_page_text_header .d-css-h1 {
    display: inline-block;
    vertical-align: middle;
    color: white;
    font-size: 60px;
    margin: 30px 0;

}

.article_item .d-css-h2 {
    font-size: 30px;
    margin: 20px;
    padding: 0;
    color: #ffc000;

}

.news_page .d-css-h1 {
    color: white;
    margin: 50px 0 0 0;

}

.news_page .d-css-h1 + datetime {
    color: silver;
    font-size: 16px;

}

.in_page_text_content .d-css-h2 {
    font-size: 24px;

}

table.bordered {
    margin: 10px auto;
    border-collapse: collapse;
}

table.bordered td {
    border: 1px solid white;
    padding: 5px;
}

.old-price {
    text-decoration: line-through;
    font-size: 70%;
}

.new-price {
    color: #ffc000;
}

.extra_trigg {
    padding-left: 0px
}

.extra_trigg .trigger_item {
    border-top: 3px solid #ffc000;
    font-size: 19px;
    font-weight: normal;
    margin-right: 2%;
    padding-top: 10px;
    text-align: left !important;
}

.advantages_main .trigger_item > div {
    height: 123px;
}

.advantages_main li.trigger_item {
    font-weight: normal;
    font-size: 17px;
}

.advantages_main img {
    width: auto;
}

.galki tr td {
    text-align: center;
}

.galki tr:first-child td:first-child {
    text-align: center;
}

.galki tr:first-child {
    color: #ffc000;
}

.galki tr td:first-child {
    text-align: left;
}

.icon-list li {
    list-style: none;
    padding-left: 20px;
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: 0 center;
}

.icon-list li:nth-child(1) {
    background-image: url(/images/static/3864201_3863030_planning_3485045_3486325.png);
}

.icon-list li:nth-child(2) {
    background-image: url(/images/static/3864202_3863029_pen_3485045_3486325.png);
}

.icon-list li:nth-child(3) {
    background-image: url(/images/static/3864199_3863027_complect_3485045_3486325.png);
}

.icon-list li:nth-child(4) {
    background-image: url(/images/static/3864204_3863032_Vip_3485045_3486325.png);
}

.ceny-list li {
    color: #ffc000;
}

.ceny-list > li > span, .ceny-list ul li {
    color: #fff;
}

.yborder {
    border-left: 3px solid #ffc000;
    color: #fff;
    padding-left: 10px;
    margin: 20px 0px;
}


.spoiler {
    margin-bottom: 10px;
}

.spoiler .body {
    display: none;
}

.spoiler .title {
    cursor: pointer;
    background: #ffc000;
    color: #fff;
    padding: 5px 10px;
    margin-bottom: 5px;
}


p.h2 {
    font-size: 30px;
}

p.bold {
    font-weight: bold;
}

#zoom_block_img {
    display: block;
    text-align: center;
    margin: 0 auto;
}

#zoom_block_img img {
    height: 250px;
}

.new_order_new {
    width: 100%;
    text-align: center;
    padding: 10px;
    height: auto;
    border-radius: 5px;
}

.new_order_new:hover {
    width: 100%;
    height: auto;
}

.brand_process_portfolio .d-css-h3 {
    color: #000;
    padding: 10px 0;
}

.button-price-services {
    display: inline-block;
    vertical-align: middle;
    background: #ffc000;
    border-radius: 999px;
    color: black !important;
    padding: 15px 24px;

}

.button-price-services:hover {
    background: #e7ae04;
}

/* gray #2c2c2c */
/* yellow #ffc000 */

/* *,
:after,
:before {
	box-sizing: inherit
}


html {
	background-color: #2c2c2c;
	font-size: 16px;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	min-width: 300px;
	overflow-x: hidden;
	overflow-y: scroll;
	text-rendering: optimizeLegibility;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%
}
body{
	margin: 0;
	padding: 0;
} */


a {
    color: #ffc000;
    cursor: pointer;
    text-decoration: none
}

a strong {
    color: currentColor
}

a:hover {
    color: #363636
}

code {
    background-color: #f5f5f5;
    color: #ff3860;
    font-size: .875em;
    font-weight: 400;
    padding: .25em .5em
}

hr {
    background-color: #dbdbdb;
    border: none;
    display: block;
    height: 1px;
    margin: 1.5rem 0
}

img {
    height: auto;
    max-width: 100%
}

input[type=checkbox],
input[type=radio] {
    vertical-align: baseline
}


.quiz__lead-form {
    display: none;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 999;
    background-color: black;
}

@media (max-height: 768px) {
    .final-page {
        padding-bottom: 3rem !important;
    }
}

.quiz__lead-form_active {
    display: block;
}

.is-clearfix:after {
    clear: both;
    content: " ";
    display: table
}

.is-pulled-left {
    float: left !important
}

.is-pulled-right {
    float: right !important
}

.is-clipped {
    overflow: hidden !important
}

.button {
    -moz-appearance: none;
    -webkit-appearance: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid transparent;
    border-radius: 3px;
    box-shadow: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 1rem;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    line-height: 1.5;
    position: relative;
    vertical-align: top;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #fff;
    /* border-color: #dbdbdb; */
    color: #363636;
    cursor: pointer;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0.4rem 1.8rem;
    text-align: center;
    white-space: nowrap;
    border-radius: 3rem;
}

.button.is-active,
.button.is-focused,
.button:active,
.button:focus {
    outline: none
}

.button[disabled] {
    cursor: not-allowed
}

.button strong {
    color: inherit
}

.button .icon,
.button .icon.is-large,
.button .icon.is-medium,
.button .icon.is-small {
    height: 1.5em;
    width: 1.5em
}

.button .icon:first-child:not(:last-child) {
    margin-left: calc(-.375em - 1px);
    margin-right: .1875em
}

.button .icon:last-child:not(:first-child) {
    margin-left: .1875em;
    margin-right: calc(-.375em - 1px)
}

.button .icon:first-child:last-child {
    margin-left: calc(-.375em - 1px);
    margin-right: calc(-.375em - 1px)
}

/* .button.is-focused,
.button:focus {
	border-color: #ffc000;
	color: #363636
} */

.button.is-focused:not(:active),
.button:focus:not(:active) {
    box-shadow: 0 0 0 .125em rgba(121, 87, 213, .25)
}

/* .button.is-active,
.button:active {
	border-color: #4a4a4a;
	color: #363636
} */


.button.is-link {
    background-color: #ffc000;
    border-color: transparent;
    color: #fff
}

.button.is-link.is-hovered,
.button.is-link:hover {
    background-color: #714dd2;
    border-color: transparent;
    color: #fff
}

.button.is-link.is-focused,
.button.is-link:focus {
    border-color: transparent;
    color: #fff
}

.button.is-link.is-focused:not(:active),
.button.is-link:focus:not(:active) {
    box-shadow: 0 0 0 .125em rgba(121, 87, 213, .25)
}

.button.is-link.is-active,
.button.is-link:active {
    background-color: #6943d0;
    border-color: transparent;
    color: #fff
}

.button.is-link[disabled] {
    background-color: #ffc000;
    border-color: transparent;
    box-shadow: none
}

.button.is-link.is-inverted {
    background-color: #fff;
    color: #ffc000
}

.button.is-link.is-inverted:hover {
    background-color: #f2f2f2
}

.button.is-link.is-inverted[disabled] {
    background-color: #fff;
    border-color: transparent;
    box-shadow: none;
    color: #ffc000
}

.button.is-link.is-loading:after {
    border-color: transparent transparent #fff #fff !important
}

.button.is-link.is-outlined {
    background-color: transparent;
    border-color: #ffc000;
    color: #ffc000
}

.button.is-link.is-outlined:focus,
.button.is-link.is-outlined:hover {
    background-color: #ffc000;
    border-color: #ffc000;
    color: #fff
}

.button.is-link.is-outlined.is-loading:after {
    border-color: transparent transparent #ffc000 #ffc000 !important
}

.button.is-link.is-outlined[disabled] {
    background-color: transparent;
    border-color: #ffc000;
    box-shadow: none;
    color: #ffc000
}

.button.is-link.is-inverted.is-outlined {
    background-color: transparent;
    border-color: #fff;
    color: #fff
}

.button.is-link.is-inverted.is-outlined:focus,
.button.is-link.is-inverted.is-outlined:hover {
    background-color: #fff;
    color: #ffc000
}

.button.is-link.is-inverted.is-outlined[disabled] {
    background-color: transparent;
    border-color: #fff;
    box-shadow: none;
    color: #fff
}


.button.is-danger {
    background-color: #ff3860;
    border-color: transparent;
    color: #fff
}

.button.is-danger.is-hovered,
.button.is-danger:hover {
    background-color: #ff2b56;
    border-color: transparent;
    color: #fff
}

.button.is-danger.is-focused,
.button.is-danger:focus {
    border-color: transparent;
    color: #fff
}

.button.is-danger.is-focused:not(:active),
.button.is-danger:focus:not(:active) {
    box-shadow: 0 0 0 .125em rgba(255, 56, 96, .25)
}

.button.is-danger.is-active,
.button.is-danger:active {
    background-color: #ff1f4b;
    border-color: transparent;
    color: #fff
}

.button.is-danger[disabled] {
    background-color: #ff3860;
    border-color: transparent;
    box-shadow: none
}


.button.is-medium {
    font-size: .9rem;
    border-radius: 3px;
    width: 100%;
    background-color: #ffc000 !important;
}

.button.is-large {
    font-size: 1.5rem
}

.button[disabled] {
    background-color: #fff;
    border-color: #dbdbdb;
    box-shadow: none;
    opacity: .5
}

.button.is-fullwidth {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.button.is-loading {
    color: transparent !important;
    pointer-events: none
}

.button.is-loading:after {
    -webkit-animation: spinAround .5s infinite linear;
    animation: spinAround .5s infinite linear;
    border: 2px solid #dbdbdb;
    border-radius: 290486px;
    border-right-color: transparent;
    border-top-color: transparent;
    content: "";
    display: block;
    height: 1em;
    position: relative;
    width: 1em;
    position: absolute;
    left: calc(50% - .5em);
    top: calc(50% - .5em);
    position: absolute !important
}

.button.is-static {
    background-color: #f5f5f5;
    border-color: #dbdbdb;
    color: #7a7a7a;
    box-shadow: none;
    pointer-events: none
}

.buttons {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.buttons .button {
    margin-bottom: .5rem
}

.buttons .button:not(:last-child) {
    margin-right: .5rem
}

.buttons:last-child {
    margin-bottom: -.5rem
}

.buttons:not(:last-child) {
    margin-bottom: 1rem
}


.buttons.is-centered {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.buttons.is-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}


.input,
.textarea {
    -moz-appearance: none;
    -webkit-appearance: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid transparent;
    border-radius: 3px;
    box-shadow: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 1rem;
    height: 2.25em;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    line-height: 1.5;
    padding: calc(.375em - 1px) calc(.625em - 1px);
    position: relative;
    vertical-align: top;
    background-color: #fff;
    border-color: #dbdbdb;
    color: #363636;
    box-shadow: inset 0 1px 2px hsla(0, 0%, 4%, .1);
    max-width: 100%;
    width: 100%;
    font-family: 'Myriad Set Pro' !important;
}

.lead-form__agreement {
    margin-top: 20px;
    color: white;
    line-height: 1.25;
    font-size: 12px;
    text-align: left;
}

.lead-form__agreement .b-checkbox.checkbox input[type=checkbox]:checked + .check {
    background-size: .7rem !important
}

.lead-form__agreement .b-checkbox.checkbox input[type=checkbox]:checked + .check {
    background-size: .7rem !important;
}

.b-checkbox.checkbox input[type=checkbox]:checked + .check {
    background-color: #ffc000;
    background-size: .9rem;
    box-shadow: none;
}

.b-checkbox.checkbox input[type=checkbox]:checked + .check {
    border-color: white;
}

.b-checkbox.checkbox:hover {
    color: white;
    opacity: .8;
}

.b-checkbox.checkbox a {
    text-decoration: underline;
    color: white;
}

.help.is-danger {
    color: red;
    display: none;
}

.step-fields .field .label {
    text-transform: uppercase;
    padding-left: 3px;
    font-size: 12px;
    font-weight: 700;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: 1.2px;
    text-align: left;
    color: white;
}

.progress-bar__field-label {
    position: absolute;
    font-size: 12px;
    right: calc(5% - 13px);
    bottom: 12px;
    font-weight: 700;
    color: #ffc000;
}

.input.is-active,
.input.is-focused,
.input:active,
.input:focus,
.textarea.is-active,
.textarea.is-focused,
.textarea:active,
.textarea:focus {
    outline: none
}

.input[disabled],
.textarea[disabled] {
    cursor: not-allowed
}

.input::-moz-placeholder,
.textarea::-moz-placeholder {
    color: rgba(54, 54, 54, .3)
}

.input::-webkit-input-placeholder,
.textarea::-webkit-input-placeholder {
    color: rgba(54, 54, 54, .3)
}

.input:-moz-placeholder,
.textarea:-moz-placeholder {
    color: rgba(54, 54, 54, .3)
}

.input:-ms-input-placeholder,
.textarea:-ms-input-placeholder {
    color: rgba(54, 54, 54, .3)
}

.input.is-hovered,
.input:hover,
.textarea.is-hovered,
.textarea:hover {
    border-color: #b5b5b5
}

.input.is-active,
.input.is-focused,
.input:active,
.input:focus,
.textarea.is-active,
.textarea.is-focused,
.textarea:active,
.textarea:focus {
    border-color: #ffc000;
    box-shadow: 0 0 0 0.125em rgba(255, 236, 115, 0.25);
}

.input-question {
    width: 100%;
}

.input[disabled],
.textarea[disabled] {
    background-color: #f5f5f5;
    border-color: #f5f5f5;
    box-shadow: none;
    color: #7a7a7a
}

.input[disabled]::-moz-placeholder,
.textarea[disabled]::-moz-placeholder {
    color: hsla(0, 0%, 48%, .3)
}

.input[disabled]::-webkit-input-placeholder,
.textarea[disabled]::-webkit-input-placeholder {
    color: hsla(0, 0%, 48%, .3)
}

.input[disabled]:-moz-placeholder,
.textarea[disabled]:-moz-placeholder {
    color: hsla(0, 0%, 48%, .3)
}

.input[disabled]:-ms-input-placeholder,
.textarea[disabled]:-ms-input-placeholder {
    color: hsla(0, 0%, 48%, .3)
}

.input[type=search],
.textarea[type=search] {
    border-radius: 290486px
}

.input[readonly],
.textarea[readonly] {
    box-shadow: none
}

.input.is-white,
.textarea.is-white {
    border-color: #fff
}

.input.is-white.is-active,
.input.is-white.is-focused,
.input.is-white:active,
.input.is-white:focus,
.textarea.is-white.is-active,
.textarea.is-white.is-focused,
.textarea.is-white:active,
.textarea.is-white:focus {
    box-shadow: 0 0 0 .125em hsla(0, 0%, 100%, .25)
}

.input.is-black,
.textarea.is-black {
    border-color: #0a0a0a
}

.input.is-black.is-active,
.input.is-black.is-focused,
.input.is-black:active,
.input.is-black:focus,
.textarea.is-black.is-active,
.textarea.is-black.is-focused,
.textarea.is-black:active,
.textarea.is-black:focus {
    box-shadow: 0 0 0 .125em hsla(0, 0%, 4%, .25)
}

.input.is-light,
.textarea.is-light {
    border-color: #f5f5f5
}

.input.is-light.is-active,
.input.is-light.is-focused,
.input.is-light:active,
.input.is-light:focus,
.textarea.is-light.is-active,
.textarea.is-light.is-focused,
.textarea.is-light:active,
.textarea.is-light:focus {
    box-shadow: 0 0 0 .125em hsla(0, 0%, 96%, .25)
}

.input.is-dark,
.textarea.is-dark {
    border-color: #363636
}

.input.is-dark.is-active,
.input.is-dark.is-focused,
.input.is-dark:active,
.input.is-dark:focus,
.textarea.is-dark.is-active,
.textarea.is-dark.is-focused,
.textarea.is-dark:active,
.textarea.is-dark:focus {
    box-shadow: 0 0 0 .125em rgba(54, 54, 54, .25)
}

.input.is-primary,
.textarea.is-primary {
    border-color: #ffc000
}

.input.is-primary.is-active,
.input.is-primary.is-focused,
.input.is-primary:active,
.input.is-primary:focus,
.textarea.is-primary.is-active,
.textarea.is-primary.is-focused,
.textarea.is-primary:active,
.textarea.is-primary:focus {
    box-shadow: 0 0 0 .125em rgba(121, 87, 213, .25)
}

.input.is-link,
.textarea.is-link {
    border-color: #ffc000
}

.input.is-link.is-active,
.input.is-link.is-focused,
.input.is-link:active,
.input.is-link:focus,
.textarea.is-link.is-active,
.textarea.is-link.is-focused,
.textarea.is-link:active,
.textarea.is-link:focus {
    box-shadow: 0 0 0 .125em rgba(121, 87, 213, .25)
}

.input.is-info,
.textarea.is-info {
    border-color: #167df0
}

.input.is-info.is-active,
.input.is-info.is-focused,
.input.is-info:active,
.input.is-info:focus,
.textarea.is-info.is-active,
.textarea.is-info.is-focused,
.textarea.is-info:active,
.textarea.is-info:focus {
    box-shadow: 0 0 0 .125em rgba(22, 125, 240, .25)
}

.input.is-success,
.textarea.is-success {
    border-color: #23d160
}

.input.is-success.is-active,
.input.is-success.is-focused,
.input.is-success:active,
.input.is-success:focus,
.textarea.is-success.is-active,
.textarea.is-success.is-focused,
.textarea.is-success:active,
.textarea.is-success:focus {
    box-shadow: 0 0 0 .125em rgba(35, 209, 96, .25)
}

.input.is-warning,
.textarea.is-warning {
    border-color: #ffdd57
}

.input.is-warning.is-active,
.input.is-warning.is-focused,
.input.is-warning:active,
.input.is-warning:focus,
.textarea.is-warning.is-active,
.textarea.is-warning.is-focused,
.textarea.is-warning:active,
.textarea.is-warning:focus {
    box-shadow: 0 0 0 .125em rgba(255, 221, 87, .25)
}

.input.is-danger,
.textarea.is-danger {
    border-color: #ffc000;
}

.input.is-danger.is-active,
.input.is-danger.is-focused,
.input.is-danger:active,
.input.is-danger:focus,
.textarea.is-danger.is-active,
.textarea.is-danger.is-focused,
.textarea.is-danger:active,
.textarea.is-danger:focus {
    box-shadow: 0 0 0 0.125em rgba(245, 220, 67, 0.25);
}

.input.is-small,
.textarea.is-small {
    border-radius: 2px;
    font-size: .75rem
}

.input.is-medium,
.textarea.is-medium {
    font-size: 1.25rem
}

.input.is-large,
.textarea.is-large {
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.input.is-fullwidth,
.textarea.is-fullwidth {
    display: block;
    width: 100%
}

.input.is-inline,
.textarea.is-inline {
    display: inline;
    width: auto
}

.input.is-static {
background-color: transparent;
border-color: transparent;
box-shadow: none;
padding-left: 0;
padding-right:0;
}

.textarea {
    display: block;
    max-width: 100%;
    min-width: 100%;
    padding: .625em;
    resize: vertical
}

.textarea:not([rows]) {
    max-height: 600px;
    min-height: 120px
}

.textarea[rows] {
    height: unset
}

.textarea.has-fixed-size {
    resize: none
}

.checkbox,
.radio {
    cursor: pointer;
    display: inline-block;
    line-height: 1.25;
    position: relative
}

.checkbox input,
.radio input {
    cursor: pointer
}

.checkbox:hover,
.radio:hover {
    color: #363636
}

.checkbox[disabled],
.radio[disabled] {
    color: #7a7a7a;
    cursor: not-allowed
}

.radio + .radio {
    margin-left: .5em
}


.panel .panel-heading.is-collapsible {
    cursor: pointer
}

.panel .panel-content {
    width: 100%
}

.b-radio.radio {
    outline: none;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: white;
    box-sizing: border-box;
}

.b-radio.radio + .radio {
    margin-left: .5em
}

.b-radio.radio input[type=radio] {
    display: none
}

.b-radio.radio input[type=radio] + .check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border: 2px solid #7a7a7a;
    border-radius: 50%;
    transition: background .15s ease-out
}

.b-radio.radio input[type=radio] + .check:before {
    content: "";
    border-radius: 50%;
    width: .625rem;
    height: .625rem;
    background: #ffc000;
    -webkit-transform: scale(0);
    transform: scale(0);
    transition: -webkit-transform .15s ease-out;
    transition: transform .15s ease-out;
    transition: transform .15s ease-out, -webkit-transform .15s ease-out
}

.b-radio.radio input[type=radio]:checked + .check {
    border-color: #ffc000
}

.b-radio.radio input[type=radio]:checked + .check:before {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.b-radio.radio .control-label {
    padding-left: .5em
}

.b-radio.radio[disabled] {
    opacity: .5
}

.b-radio.radio:hover input[type=radio] + .check {
    border-color: #ffc000
}

.b-radio.radio:focus input[type=radio] + .check {
    box-shadow: 0 0 .5em hsla(0, 0%, 48%, .8)
}

.b-radio.radio:focus input[type=radio]:checked + .check {
    box-shadow: 0 0 .5em rgba(253, 230, 24, 0.8)
}

.b-radio.radio.is-small {
    border-radius: 2px;
    font-size: .75rem
}

.b-radio.radio.is-medium {
    font-size: 1.25rem
}

.b-radio.radio.is-large {
    font-size: 1.5rem
}

@media (min-width: 819px) {
    .columns.is-desktop-modal {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}


h1 {
    font-size: 2em
}

h2 {
    font-size: 1.5em
}

h3 {
    font-size: 1.17em
}

.quiz {
    max-height: 75vh;
    position: relative;
}

.quiz,
.result {
    margin: 0 auto;
    max-width: 1024px;
    background: #fff;
    /* border: 5px solid #e6e6e6; */
    box-sizing: border-box;
    height: auto !important;
    min-height: 570px !important;
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important
}

@media (min-width: 1201px) {
    .layout {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        height: 100vh;
        background: #f8f8f8
    }

    /* .final-page,
	.quiz,
	.result {
		margin: 0 auto;
		max-width: 1024px;
		background: #fff;
		border: 5px solid #e6e6e6;
		box-sizing: border-box;
		height: auto!important;
		min-height: 570px!important;
		-ms-flex-wrap: nowrap!important;
		flex-wrap: nowrap!important
	} */
    .quiz__questions,
    .quiz__sidebar {
        min-height: 0 !important;
        height: auto !important
    }

    .quiz__questions {
        max-height: 90vh
    }
}

.layout__footer {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 1.5rem 1rem 1rem
}

@media (max-width: 767px) {
    .layout__footer {
        position: static
    }
}

.loading-overlay .loading-background {
    background: transparent
}

.quiz {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100vw;
    height: 100vh;
    background: black;
}

@media (max-width: 767px) {
    .quiz {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        height: 100%
    }
}

.quiz__question-title {
    font-size: 28px;
    text-align: left;
    margin: 12px 0 16px !important;
    line-height: 1.2;
    font-weight: 500;
    opacity: 0;
    transition: all .3s ease;
    color: white;
}

.quiz__question-title_active {
    opacity: 1;
    transition: all .3s ease;
}

@media (max-width: 818px) {
    .quiz__question-title {
        font-size: 22px
    }
}

.quiz__question-title_can-many {
    font-size: 12px
}

.quiz__tags {
    margin-top: 5px
}

.quiz__tag {
    font-size: 11px !important;
    margin-left: 5px;
    padding: 12px;
    border-radius: 4px !important
}

@media (max-width: 767px) {
    .quiz__tag {
        font-size: 10px !important;
        line-height: 12px !important
    }

    .quiz__question-title {
        margin: 12px 0 0px !important;
        font-size: 19px !important;
    }

    .answer-variants__textVariant {
        margin-bottom: 0.2rem !important;
    }

    .answer-variants__textVariant label {
        padding: 0.1rem 0.2rem !important;
    }

    .b-radio.radio input[type=radio] + .check {
        transform: scale(0.6) !important;
    }

    .answer-variants__textVariant .control-label {
        padding-left: 0 !important;
    }

    .answer__title {
        font-size: 0.7rem !important;
    }

    .quiz-buttons__button_prev, .quiz-buttons__button_next {
        font-size: 0.7rem !important;
    }

    .input.is-large, .textarea.is-large {
        font-size: 0.9rem !important;
    }
}

.quiz__tag:first-child {
    margin-left: 0
}

.quiz__tag_many {
    background: var(--color-alpha2) !important;
    border: solid 1px var(--color)
}

.quiz__tag_skip {
    background: #f7f7f7 !important;
    border: 1px solid #e5e5e5
}

.quiz__tag-icon {
    height: 12px;
    margin-right: 5px
}

@media (max-width: 818px) {
    .quiz__progress {
        display: none
    }
}

@media (min-width: 819px) {
    .quiz__progress {
        padding-bottom: 10px
    }
}

@media (min-width: 819px) {
    .quiz__sidebar-mobile {
        display: none
    }
}

.quiz__bonuses {
    -webkit-box-flex: 50%;
    -ms-flex: 50%;
    flex: 50%;
    margin-bottom: 10px;
    -webkit-box-align: self-start !important;
    -ms-flex-align: self-start !important;
    align-items: self-start !important;
    padding: 10px 30px
}

@media (max-width: 818px) {
    .quiz__bonuses {
        padding: 12px 0 12px 80px;
        -webkit-box-flex: 100%;
        -ms-flex: 100%;
        flex: 100%
    }
}

@media (max-width: 350px) {
    .quiz__bonuses {
        padding-left: 10px
    }
}

.quiz__questions {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 4;
    -ms-flex: 4 1 69%;
    flex: 4 1 69%;
    width: 100%;
    -webkit-overflow-scrolling: touch;
    padding: 30px;
    overflow: hidden;
    background-color: black;
}

@media (max-width: 818px) {
    .quiz__questions {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 15px;
        padding-bottom: 60px
    }
}

.quiz__sidebar {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 246px;
    flex: 1 1 246px;
    background: black;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media (max-width: 818px) {
    .quiz__sidebar {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        height: auto;
        display: none
    }
}

/*
@media (min-width:819px) {
	.quiz__sidebar {
		height: 100vh
	}
} */

@media (min-width: 819px) {
    .quiz__sidebar-inner {
        display: none
    }
}

.quiz__title {
    font-size: 16px;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    line-height: 1.2;
    color: white;
    font-weight: 500;
    margin-bottom: 16px;
}

.quiz__title-separator {
    background: #f3f3f3;
    margin: auto -30px
}

.quiz__title-icon {
    color: var(--color);
    margin-right: 10px
}

/* @media (max-width:767px) {
	.quiz__title-icon {
		display: none
	}
} */

.quiz__buttons {
    padding: 0;
    padding-top: 1rem
}

@media (max-width: 818px) {
    .quiz__buttons {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 60px;
        padding: 6px 10px;
        background-color: rgba(0, 0, 0, .4);
        z-index: 100
    }
}

@media (min-width: 819px) {
    .quiz__buttons {
        padding: 20px;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%
    }
}

.quiz__question {
    -webkit-box-flex: 100%;
    -ms-flex: 100%;
    flex: 100%;
    padding-top: 10px
}

@media (min-width: 768px) {
    .quiz__question {
        overflow-y: auto
    }
}

@media (max-width: 818px) {
    .quiz__question {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
}

@media (min-width: 819px) {
    .quiz__question {
        margin-bottom: 50px
    }
}

@media (min-width: 1119px) {
    .quiz__question {
        padding: 5px 0 0
    }
}

@media (max-width: 818px) {
    .quiz__whitelabel {
        display: none
    }
}

.quiz__whitelabel_mobile {
    display: block
}

@media (min-width: 819px) {
    .quiz__whitelabel_mobile {
        display: none
    }
}

.quiz__whitelabel_fixed-bottom {
    position: absolute;
    bottom: 20px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

@media (max-width: 818px) {
    .quiz__whitelabel_fixed-bottom {
        display: none !important
    }
}

.quiz__discount {
    margin: 1rem 1.2rem 0;
    margin-bottom: 15px
}

.quiz__discount.is-increasing {
    margin: .1rem .1rem 0
}

@media (max-width: 818px) {
    .quiz__discount {
        display: none !important
    }
}

.quiz__empty-result,
.quiz__result-loader {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100vh
}

.cls-1[data-v-14468613] {
    opacity: .54
}

.bonuses {
    display: -ms-grid;
    display: grid;
    grid-gap: 15px;
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
    -ms-grid-rows: var(--bonus-height) var(--bonus-height);
    grid-template-rows: var(--bonus-height) var(--bonus-height);
    width: 100%
}

.bonuses.bonuses_count_1 {
    -ms-grid-rows: var(--bonus-height);
    grid-template-rows: var(--bonus-height)
}

.bonuses_direction_row {
    height: var(--bonus-height);
    grid-gap: 10px;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: var(--bonus-height);
    grid-template-rows: var(--bonus-height)
}

.bonuses_direction_row.bonuses_count_1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.bonuses_direction_row.bonuses_count_1 .bonuses__bonus {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 200px;
    flex: 0 1 200px
}

@media (max-width: 767px) {
    .bonuses_direction_row-mobile {
        grid-gap: 10px;
        -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
        -ms-grid-rows: var(--bonus-height);
        grid-template-rows: var(--bonus-height)
    }
}

.bonus {
    width: 100%;
    background: #2c2c2c;
    line-height: 1.2
}

.bonus,
.bonus__wrapper {
    position: relative;
    height: 100%;
    border-radius: 5px
}

.bonus__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: 10% 10px;
    box-shadow: 1.9px 6.7px 7px 0 var(--color-alpha2)
}

.quiz__sidebar .bonus__wrapper {
    background-size: 40px;
    background-position: 10px center;
}

.bonus__layer {
    background: #000;
    opacity: .1;
    transition: opacity .2s ease-out
}

.bonus__layer,
.bonus__lock {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.bonus__lock {
    height: 100%;
    width: 100%;
    z-index: 2;
    transition: all 1s ease
}

.bonus__lock-icon {
    position: absolute;
    right: 0;
    top: 0;
    left: unset;
    z-index: 2;
    -webkit-transform: translate(40%, -40%);
    transform: translate(40%, -40%);
    height: 25px !important
}

.bonus__unlock svg {
    position: absolute;
    top: 50%;
    left: 20%;
    transition: all .3s ease;
    -webkit-animation: pulse 1s ease 0s infinite;
    animation: pulse 1s ease 0s infinite
}

.bonus__unlock:hover svg {
    fill: var(--color-lighten)
}

.bonus__text {
    position: absolute;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
    right: 9%;
    max-width: 66%;
    text-align: right
}

.bonus_locked {
    cursor: not-allowed
}

.bonus_locked .bonus__layer {
    opacity: .4
}

.bonus_unlocked {
    cursor: pointer
}

.bonus_type_custom .bonus__wrapper {
    background-size: 100% auto;
    background-position: 0 50%
}

.bonus_type_custom .bonus__text {
    background: rgba(0, 0, 0, .271);
    padding: 4px 8px
}

.bonus_type_custom.bonus_locked .bonus__layer {
    opacity: .3
}

.bonus_type_custom.bonus_unlocked .bonus__layer {
    opacity: 0
}

svg[data-v-6d74ce7d] {
    padding: 0;
    background: #fff;
    fill: var(--color);
    border: 4px solid #6f6f6f;
    border-radius: 50px;
    height: 30px;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .28)
}

svg[data-v-b9f29472] {
    height: 33px;
    border-radius: 50px;
    background: #fff;
    fill: var(--color);
    padding: 8px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.question::-webkit-scrollbar {
    width: 10px
}

.question::-webkit-scrollbar-track {
    border-left: 8px solid transparent;
    box-shadow: inset 0 0 10px 10px #eae9f1
}

.question::-webkit-scrollbar-thumb {
    border-left: 8px solid transparent;
    box-shadow: inset 0 0 10px 10px var(--color)
}

@media (min-width: 768px) {
    .question_date {
        overflow-y: visible
    }
}

.answer-variants {
    position: relative;
    width: 100%;
    overflow-x: hidden;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

@media (max-width: 768px) {
    .answer-variants {
        min-height: 30rem;
    }
}

.answer-variants::-webkit-scrollbar {
    width: 10px
}

.answer-variants::-webkit-scrollbar-track {
    border-left: 8px solid transparent;
    box-shadow: inset 0 0 10px 10px #eae9f1
}

.answer-variants::-webkit-scrollbar-thumb {
    border-left: 8px solid transparent;
    box-shadow: inset 0 0 10px 10px var(--color)
}

.answer-variants__other {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.answer-variants__other label {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 52px;
    flex: 1 1 52px;
    width: 52px !important
}

.answer-variants__other .field {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 100%;
    flex: 1 1 100%
}

.answer-variants__other input {
    border: none !important;
    background: #f7f7f7;
    font-family: 'Myriad Set Pro';
}

.answer-variants__other .control,
.answer-variants__other .field,
.answer-variants__other input {
    height: 100% !important;
}

.answer-variants__group {
    position: absolute;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    transition: .3s;
    opacity: 0;
    z-index: -1;
}

.answer-variants__group_active {
    transition: .3s;
    opacity: 1;
    z-index: 9;
}

.answer-variants__answerContainer {
    text-align: left
}

.answer-variants__textVariant {
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 49%;
    flex: 0 1 49%;
    margin-bottom: 1rem;
    border-radius: 5px;
    border: 1px solid rgba(217, 216, 230, .55);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

/*
.answer-variants__textVariant_clickarea{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: none;
} */

.answer-variants__textVariant_active .check:before {
    transform: scale(1.2) !important;
    transition: .3s !important;
}

@media (max-width: 767px) {
    .answer-variants__textVariant {
        -webkit-box-flex: 0;
        -ms-flex: 0 1 100%;
        flex: 0 1 100%
    }
}

.answer-variants__textVariant .control-label {
    padding-left: 1rem !important
}

.answer-variants__textVariant label {
    padding: .8rem 1rem;
    width: 100%;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}


.answer-variants__textVariant_selected {
    border: solid 1px #ffc000;
    box-shadow: 1.7px 5.8px 21px 0 rgba(0, 0, 0, .07)
}

.answer-variants__gradient {
    display: none
}

.answer-variants .check {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 1.25rem;
    flex: 0 0 1.25rem
}


@media (max-width: 650px) {
    .final-page_v2__form {
        background: black;
    }

    .final-page_v2 {
        padding: 20px 20px 40px
    }
}

.final-page_v2__content {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 300px 1fr;
    grid-template-columns: 300px 1fr;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.final-page_v2__container {
    width: 100%;
}

.final-page_v2__content.is-empty {
    -ms-grid-columns: 500px;
    grid-template-columns: 500px;
    max-width: 100%;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (max-width: 650px) {
    .final-page_v2__content {
        -ms-grid-columns: 1fr !important;
        grid-template-columns: 1fr !important;
        margin-top: 25px;
        width: 100% !important;
    }
}

.final-page_v2__bonuses {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.final-page_v2__bonuses-title {
    color: white;
    font-weight: 700;
    text-align: left;
    margin-bottom: 8px
}

.final-page_v2__bonuses-sidebar {
    width: 100%;
    position: relative
}

@media (min-width: 651px) {
    .final-page_v2__bonuses-sidebar {
        box-shadow: 0 0 13px 0 rgba(0, 0, 0, .11);
        padding: 20px 70px 20px 30px;
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        -ms-grid-rows: 20px (minmax(30px, 1fr)) [ auto-fit ];
        grid-template-rows: 20px repeat(auto-fit, minmax(30px, 1fr));
        border-left: solid 3px var(--color);
        max-width: 620px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: start;
        margin: auto 0
    }
}

.final-page_v2__header {
    margin-bottom: 3rem
}

@media (max-width: 650px) {
    .final-page_v2__header {
        margin-bottom: .5rem
    }
}

.final-page_v2__progress {
    margin-bottom: 10px
}

.final-page_v2__icon {
    color: var(--color);
    margin-bottom: 20px;
    height: 45px;
    width: 45px
}

.final-page_v2__icon i:before {
    font-size: 60px !important
}

.final-page_v2__info {
    font-size: 14px;
    font-weight: 500;
    color: #7e8ca8;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

@media (max-width: 650px) {
    .final-page_v2__info {
        width: 100%;
        font-size: 12px;
        text-align: left;
        left: auto;
        -webkit-transform: none;
        transform: none
    }
}

.final-page_v2__title {
    margin-bottom: .5rem !important;
    font-size: 14px;
    font-weight: 500;
    color: white;
    width: 90%;
    line-height: 1;
    padding-left: 10%;
    text-align: center;
}

@media (max-width: 650px) {
    .final-page_v2__title {
        text-align: left;
        padding-left: 0
    }
}

.final-page_v2__extra {
    margin: 10px auto 0;
    color: white;
    font-weight: 500;
    line-height: 1.5;
    font-size: 16px;
    max-width: 650px
}

@media (max-width: 650px) {
    .final-page_v2__extra {
        padding: 10px;
        text-align: left
    }
}

.final-page_v2__extra b {
    color: #2e2e54;
    margin-right: .6rem
}

.final-page_v2__extra ol,
.final-page_v2__extra ul {
    text-align: left
}

.final-page_v2__extra .final-page__icon-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 1rem
}

.final-page_v2__extra .icon {
    height: 30px
}

@media (max-width: 767px) {
    .final-page_v2__extra {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .final-page_v2__extra .final-page__icon-container {
        margin-right: 0;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.final-page_v2__text {
    text-align: center;
    color: white;
    font-weight: 500;
    line-height: 1;
    font-size: 26px
}

.final-page_v2__text ol,
.final-page_v2__text ul {
    text-align: left
}

@media (max-width: 650px) {
    .final-page_v2__text {
        text-align: left;
        line-height: 1.25;
        font-size: 24px
    }
}

@media (max-width: 400px) {
    .final-page_v2__text {
        font-size: 22px
    }
}

.final-page_v2__form {
    padding: 20px 45px;
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
    box-shadow: 2.5px 8.7px 40px 0 rgba(0, 0, 0, .11);
    border: 1.2px solid #484848;
    display: -ms-grid;
    display: grid;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 260px;
    background: #2c2c2c;
}

@media (max-width: 650px) {
    .final-page_v2__form {
        box-shadow: none;
        border: none;
        padding: 10px 0 25px;
        -webkit-transform: none;
        transform: none
    }
}

.final-page_v2__share {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    overflow: hidden;
    height: 45px;
    right: 10px;
    bottom: 5px;
    -webkit-transform: scaleX(-1) rotate(180deg);
    transform: scaleX(-1) rotate(180deg)
}

@media (max-width: 650px) {
    .final-page_v2__share {
        display: none
    }
}

.final-page_v2__discount {
    margin-bottom: 15px
}

.final-page {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 60vh;
    padding: 40px 20px
}

@media (max-height: 500px) {
    .final-page {
        padding: 20px
    }
}

.final-page__container {
    width: 100%;
    max-width: 800px
}

.final-page__header {
    margin-bottom: 3rem
}

.final-page__icon {
    color: var(--color);
    margin-bottom: 20px;
    height: 45px;
    width: 45px
}

.final-page__icon i:before {
    font-size: 60px !important
}

.final-page__icon-container {
    width: 46px;
    color: var(--color);
    font-size: 29px
}

.final-page__title {
    margin-bottom: 2.1rem !important;
    font-weight: 500;
    line-height: 1;
    font-size: 28px !important
}

@media (max-width: 400px) {
    .final-page__title {
        font-size: 24px !important
    }
}

.final-page__extra {
    background: #f5f7f9;
    padding: 20px;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #67748c;
    font-weight: 500;
    font-size: 18px
}

.final-page__extra b {
    color: #2e2e54;
    margin-right: .6rem
}

.final-page__extra .final-page__icon-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 1rem
}

.final-page__extra .icon {
    height: 30px
}

@media (max-width: 767px) {
    .final-page__extra {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .final-page__extra .final-page__icon-container {
        margin-right: 0;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.final-page__text {
    color: #2e2e54;
    text-align: left;
    line-height: 1;
    font-size: 16px !important
}

@media (max-width: 400px) {
    .final-page__text {
        font-size: 24px !important
    }
}

.final-page__text ol,
.final-page__text ul {
    text-align: left
}

.final-page__contacts {
    width: 100%
}

.final-page__discount {
    font-size: 18px;
    font-weight: 600;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    max-width: 350px;
    margin: 0 auto 1.5rem;
    color: #2e2e54
}

.final-page__discount-sep {
    font-weight: 400;
    color: #eae9f1
}

.final-page__discount-value {
    color: #03a646;
    font-size: 24px
}

.lead-form__fields {
    margin-bottom: 10px
}

.lead-form__fields .input {
    font-size: .9rem;
}

.lead-form__fields .field {
    display: block
}

.lead-form .icon i:before {
    font-size: 25px
}

.lead-form__messengers-link {
    background: #f5f7f9;
    font-size: 14px;
    color: #2c3039;
    padding: .7rem 1rem;
    margin-top: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.lead-form__messengers-link:focus,
.lead-form__messengers-link:hover {
    color: #2c3039
}

.final-discount {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 60px;
    width: 100%;
    border-radius: 5px;
    position: relative
}

.final-discount__bg {
    position: absolute;
    border-radius: 5px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(/images/static/money.png);
    background-size: 100%;
    opacity: .3;
    z-index: 10
}

.final-discount__text {
    text-align: center;
    position: relative;
    color: white;
    width: 100%;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    z-index: 20
}

.final-discount__discount {
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
    color: white;
    z-index: 20
}


.progress-bar_mobile {
    display: block;
    margin-left: 10px;
    line-height: 1.2;
    padding-right: 10%;
    padding-top: 10px;
    -ms-flex: 100%;
    flex: 100%
}

@media (min-width: 819px) {
    .progress-bar_mobile {
        display: none
    }
}

@media (max-width: 767px) {
    .progress-bar_mobile {
        padding-right: 10%;
        display: none
    }
}

.progress-bar_mobile .progress-bar__label {
    color: #fff;
    margin-bottom: 0
}

.progress-bar__label {
    font-size: 12px;
    text-align: left;
    font-weight: 500;
    color: white;
    margin-bottom: 8px;
    height: 18px;
    position: relative
}

.progress-bar__label span {
    font-size: 14px;
    color: #ffc000;
    font-weight: 700;
    margin-left: 10px
}

@media (max-width: 818px) {
    .progress-bar__label span {
        color: #fff
    }
}

.progress-bar__label span.is-finish {
    position: absolute;
    margin-left: 0;
    left: 95%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%)
}

.progress-bar__field {
    height: 6px;
    position: relative;
    background: #dbdbdb;
    border-radius: 25px;
    box-shadow: inset 0 -1px 1px hsla(0, 0%, 100%, .3)
}

.progress-bar__field span {
    display: block;
    height: 100%;
    border-radius: 20px;
    background-image: linear-gradient(90deg, #ffc000, #ffc000);
    box-shadow: inset 0 2px 9px hsla(0, 0%, 100%, .3), inset 0 -2px 6px rgba(0, 0, 0, .4), .6px 1.9px 7px 0 var(--color-alpha);
    position: relative;
    overflow: hidden;
    transition: all .3s ease
}

.progress-bar__field span:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: linear-gradient(-45deg, hsla(0, 0%, 100%, .08) 25%, transparent 0, transparent 50%, hsla(0, 0%, 100%, .08) 0, hsla(0, 0%, 100%, .08) 75%, transparent 0, transparent);
    z-index: 1;
    background-size: 20px 20px;
    -webkit-animation: move 1.5s linear infinite;
    animation: move 1.5s linear infinite;
    border-radius: 20px;
    overflow: hidden
}

@-webkit-keyframes move {
    0% {
        background-position: 0 0
    }
    to {
        background-position: 20px 20px
    }
}

@keyframes move {
    0% {
        background-position: 0 0
    }
    to {
        background-position: 20px 20px
    }
}

.progress-bar__field-mark {
    bottom: 2px;
    right: 0
}

.progress-bar__field-mark:after {
    content: "";
    position: absolute;
    right: calc(5% - 2px);
    bottom: 4px;
    border: 3px solid transparent;
    border-top: 7px solid var(--color)
}

.discount {
    padding: 20px .5rem 20px 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    font-weight: 700;
    color: #2e2e54;
    border-radius: 3px;
    box-shadow: 0 3px 10px 0 rgba(255, 221, 111, .36);
    background-color: #fdd24e;
    border: 1px solid #ffc000
}

@media (max-width: 818px) {
    .discount {
        box-shadow: 0 3px 6px 0 #f4cf5b;
        padding: 17px .5rem 17px 15px
    }
}

.discount.is-unexpanded .discount__icon {
    margin-right: 100px;
    transition: margin .3s ease;
    -webkit-animation-name: slide-right-icon;
    animation-name: slide-right-icon;
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    opacity: 1
}

.discount__label-text {
    color: black;
    font-size: .9rem;
}

.discount__value {
    display: inline-block;
    font-size: .9rem;
}

.discount__symbol {
    display: inline-block;
    font-size: .9rem;
}

.discount.is-unexpanded .discount__label-text {
    opacity: 0
}

.discount:not(.is-unexpanded) .discount__icon {
    -webkit-animation-name: slide-icon-left;
    animation-name: slide-icon-left;
    margin-right: 0;
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
    opacity: 0;
    width: 0
}

.discount__icon {
    font-size: 18px;
    -webkit-animation-name: slide-right-icon;
    animation-name: slide-right-icon;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    font-weight: 700;
    transition: all .3s ease;
    opacity: 1
}

@media (min-width: 819px) {
    .quiz-buttons {
        padding: 20px;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
    }
}

@media (max-width: 818px) {
    .quiz-buttons {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 60px;
        padding: 6px 10px;
        z-index: 100;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
}

.quiz-buttons__button_next {
    color: black;
    background-color: #ffc000 !important;
    box-shadow: 0 6px 21px 0 black;
    border: none;
    border-radius: 4rem;
    overflow: hidden;
    font-size: .9rem;
    line-height: 1;
}

.quiz-buttons__button_prev {
    text-decoration: none !important;
    color: black !important;
    background: #b1b1b1 !important;
    box-shadow: 0 3px 13px 0 rgba(0, 0, 0, .13) !important;
    overflow: hidden;
    font-size: .9rem;
    line-height: 1;
}

svg[data-v-e31301d4] {
    height: 18px;
    fill: black;
    margin-top: 0.4rem;
    margin-right: 0.4rem;
}

svg.is-back[data-v-d80b7794] {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

svg[data-v-d80b7794] {
    fill: #4a505e;
    width: 20px;
    height: 15px;
}

.quiz-buttons__arrow {
    padding-right: 5px;
    padding-top: 3px;
}

svg[data-v-6d74ce7d] {
    padding: 0;
    background: #fff;
    fill: #ffc000;
    border: 4px solid #fff;
    border-radius: 50px;
    height: 30px;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .28);
}

.quiz-buttons__button.is-blicked:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    height: 100%;
    background: linear-gradient(90deg, hsla(0, 0%, 100%, .1) 10%, hsla(0, 0%, 100%, .2) 20%, hsla(0, 0%, 100%, .6));
    width: 20px;
    -webkit-transform: skewX(-45deg);
    transform: skewX(-45deg);
    left: -20%;
    transition: all .6s ease;
    -webkit-animation-name: blick;
    animation-name: blick;
    -webkit-animation-duration: 6s;
    animation-duration: 6s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}


@-webkit-keyframes blick {
    15%,
    to {
        left: 110%
    }
}

@keyframes blick {
    15%,
    to {
        left: 110%
    }
}

svg[data-v-34d1be05] {
    height: 1.2rem;
    fill: #ffc000;
}

.quiz__wrapper {
    position: fixed;
    top: 0;
    z-index: 9999;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    transform: translateX(100%);
    transition: .3s;
    background: rgba(0, 0, 0, 0);
    overflow: scroll;
}

@media (min-height: 700px) {
    .quiz__wrapper {
        padding-top: 5%;
    }
}

.quiz__wrapper_active {
    transform: translateX(0%);
    transition: .3s;
}

@media (max-width: 768px) {
    .quiz__wrapper {
        padding: 0;
        background-color: black;
    }

    .final-page_v2__form {
        background: black;
    }
}

.quiz__open-wrapper {
    width: auto;
    text-align: center;
    padding: 1rem;
}

.quiz__close {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0);
    transition: .1s;
}

.quiz__close_show {
    background: rgba(0, 0, 0, .7);
    transition: .4s;
}

.quiz__wrapper-success {
    display: none;
    position: absolute;
    z-index: 999;
    width: 100%;
    height: 100%;
    background: black;
    text-align: center;
    padding-top: 5%;
}

@media (max-width: 818px) {
    .quiz__wrapper-success {
        padding: 0.5rem;
        box-sizing: border-box;
        position: fixed;
    }

    .quiz__wrapper-success .bonus__lock-icon {
        height: 20px !important;
    }
}

@media (max-width: 767px) {
    .quiz {
        background: black;
    }
}

.quiz__buttons, .quiz-buttons {
    box-sizing: border-box;
}

.bonuses {
    box-sizing: border-box;
}

.quiz__wrapper-success_show {
    display: block;
}

.quiz__icon-close {
    position: absolute;
    right: 0;
    top: 0;
    width: 2rem;
    height: 2rem;
    background-color: white;
    border-radius: 50%;
}

.quiz__wrapper-success .final-page_v2__bonuses-sidebar {
    max-width: 20rem;
    margin-left: auto;
    margin-right: auto;
}

.quiz__icon-close-palk-1, .quiz__icon-close-palk-2 {
    width: 1.6rem;
    height: 3px;
    background-color: black;
    border-radius: 6px;
    position: absolute;
    top: 0.99rem;
    left: 0.2rem;
}

.quiz__icon-close-palk-1 {
    transform: rotate(45deg);
}

.quiz__icon-close-palk-2 {
    transform: rotate(-45deg);
}

.quiz__questions {
    box-sizing: border-box;
}

@media (max-width: 818px) {
    .quiz-buttons {
        bottom: 4rem;
    }
}

@media (max-width: 767px) {
    .quiz__wrapper-success .final-page_v2__text {
        text-align: center !important;
    }

    .quiz__wrapper-success .final-page_v2__extra {
        text-align: center !important;
    }

    .quiz__wrapper-success .final-page_v2__bonuses-title {
        text-align: center !important;
    }

    .quiz__icon-close {
        top: 0.5rem;
        right: 0.5rem;
        width: 2rem;
        height: 2rem;
    }

    .quiz__icon-close-palk-1, .quiz__icon-close-palk-2 {
        width: 1.7rem;
        top: 1rem;
        left: 0.15rem;
    }

    .quiz {
        height: 100% !important;
        overflow: scroll;
    }
}

.quiz__container input {
    box-sizing: border-box;
}

.answer__title {
    font-size: .9rem;
}

.li-title {
    color: #ffc000 !important;
    margin-bottom: -15px !important;
}

.link-hover-underline:hover {
    color: inherit !important;
    text-decoration: underline !important;
}

.main-social {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 900px;
    margin: 0 auto;
}
.main-social-box {
    padding: 0 15px 15px 15px;
}
.main-social__link {
    color: #ffc000;
    display: flex;
    align-items: center;
    transition: all 200ms;
    flex-shrink: 0;
    color: #000;
}

.main-social__link_orange {
    background: #ffc000;
    padding: 5px 15px;
    border-radius: 5px;
    color: #000;
}

.main-social__link_orange .main-social__link-text {
    color: #000;
    font-size: 16px;
}

.main-social__link-ico {
    width: 50px;
    height: 50px;
    object-fit: contain;
    margin-right: 10px;    
}
.main-social__link-text {
    font-size: 14px !important;
    text-align: left;
    color: #ffc000;
    line-height: 110% !important;
    margin: 10px 0 !important;
}

.main-social__link-btn {
    display: inline-block;
    color: black;
    overflow: hidden;
    padding: 10px;
    font-size: 18px !important;
    border: 1px solid #ffc000;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
    background: #ffc000;
    transition: 0.2s linear;
    margin: 0 10px;
    flex-shrink: 1;
    color: #000 !important;
}
.main-social__link-btn_anim {
    position: relative;

}
.main-social__link-btn_anim span {
    position: relative;
    z-index: 5;
}
.main-social__link-btn_anim::after {
    content: '';
    position: absolute;
    top: 0;
    left: -30%;
    transform: skewX(-40deg);
    width: 15%;
    height: 100%;
    background: linear-gradient(90deg, rgba(250,223,180,0.5998774509803921) 0%, rgba(250,223,170,1) 50%, rgba(250,224,183,0.5802696078431373) 100%);    animation: anim-blick 4s infinite ease-in-out;
}

.vpn-warning {
    position: relative;
    z-index: 2;
    margin: 5px 0 0 5px;
    font-size: 16px;
    color: #fff;
}

.cases {}
.cases__wrapper{
    padding: 40px 15px;
}
.cases__cards{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin: -5px;
}
.cases__card{
    flex: 0 1 33.333%;
    padding: 5px;
    box-sizing: border-box;
    
}
.cases__card-item{
    display: block;
}
.cases__card-item:hover .cases__card-description{
    color: #ffc000;
}

.cases__card-img{
    max-height: 15.625vw;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin-bottom: 15px;
}
.cases__card-description {
    margin: 0;
    color: #fff;
    font-size: 1vw;
    text-align: center;
    transition: all 200ms ease;
}

@media (max-width: 965px) {
    .cases__card {
        flex: 0 1 50%;
    }
    .cases__card-img {
        max-height: 25vw;
    }
    .cases__card-description {
        font-size: 1.658vw;
    }
}

@media (max-width: 768px) {
    .vpn-warning {
        margin: 10px 0 0 0;
        text-align: center;
        padding: 0 25px;
    }
    .preview__links {
        flex-direction: column;
    }
    .preview__link {
        margin: 0 0 20px 0;
    }
    .swiper {
        width: 100%;
    }
    .preview__title_mobile {
        display: block;
    }
    .preview__title {
        font-size: 44px !important;
    }
    .preview__description {
        font-size: 22px !important;
    }
    .cases__card {
        flex: 0 1 100%;
    }
    .cases__card-img {
        max-height: 200px !important;
    }
    .cases__card-description {
        font-size: 16px;
    }
    .advantages_main p {
        text-align: center;
        margin: 0;
    }
    .cases__wrapper {
        padding: 35px 0;
    }
}

@-webkit-keyframes anim-blick { 
    40%, 100% {
        opacity: 0;
        left: 130%;
    }
    0% {
        opacity: 0;
    }
        30% {
        opacity: 1;
    }  
}

@-moz-keyframes anim-blick { 
    40%, 100% {
        opacity: 0;
        left: 130%;
    }
    0% {
        opacity: 0;
    }
    30% {
        opacity: 1;
    }  
}

@-o-keyframes anim-blick { 
    40%, 100% {
        opacity: 0;
        left: 130%;
    }
    0% {
        opacity: 0;
    }
    30% {
        opacity: 1;
    }  
}

@keyframes anim-blick {
    40%, 100% {
        opacity: 0;
        left: 130%;
    }
    0% {
        opacity: 0;
    }
    30% {
        opacity: 1;
    }
}
.main-social_mod {
    padding-top: 40px;
}

.main-social__link:hover {
    opacity: 0.8;
    color: #ffc000;
}
.main-social__link-btn:hover {
    color: black;
}

.main-social_contact {
    flex-direction: column;
    justify-content: stretch;
    align-items: stretch;
    max-width: 100%;
    
}
.main-social_contact .main-social__link-btn {
    margin: 0;
    order: 1;
}
.main-social__link-btn_full {
    display: block;
}
.pdf-title {
    color: #ffc000 !important;
    font-weight: 600 !important;
    font-size: 40px !important;
}
@media (max-width: 1024px) {
    .pdf-title {
        font-size: 28px !important;
    }
    .main-social__link-btn {
        font-size: 16px !important;
        padding: 5px 10px;
        
    }
}


@media (max-width: 765px) {
    .main-social__link_orange {
        width: 100%;
        margin: 0 10px;
        max-width: 270px;
        box-sizing: border-box;
        justify-content: space-around;
    }
    .main-social {
        flex-direction: column;
    }
    .main-social_mod  .main-social__link{
       margin-bottom: 25px;
    }
    .main-social__link-ico {
        width: 40px;
        height: 40px;   
    }
    .main-social__link-btn {
        margin: 10px;
    }
    .main-social-box {
        padding-bottom: 10px;
    }
    .pdf-title {
        font-size: 22px !important;
    }
}

.loading {
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 5px solid rgb(255 255 255 / 100%);
    border-radius: 50%;
    border-top-color: #ffc000;
    animation: spin 1s ease-in-out infinite;
    -webkit-animation: spin 1s ease-in-out infinite;
    position: relative;
    top: 50%;
    left: 50%;
  }
  .active {
      display: none !important;
  }
  
  @keyframes spin {
    to {
      -webkit-transform: rotate(360deg);
    }
  }
  
  @-webkit-keyframes spin {
    to {
      -webkit-transform: rotate(360deg);
    }
  }


.images-services {
    display: flex;
    justify-content: space-between;
    height: 100%;
}
.images-services__link {
    width: 32%; 
    height: 100%; 
    display: inline-block; 
    text-align: center; 
    color: #fff !important;
}
.images-services__img {
    width: 100%; 
    height: 100%;
}

@media (max-width: 575px) {
    .images-services__link {
        font-size: 16px;
    }
}

.pc-hidden {
    display: none;
}
@media (max-width: 765px) {
    .pc-hidden {
        display: block;
    }
}

@media (max-width: 765px) {
    .mobile-hidden {
        display: none;
    }
}

@media (max-width: 768px) {
    .d-css-h2 span {
        color: #000 !important;
        font-size: 20px !important;
    }
    .d-css-h2 {
        padding: 0 !important;
        text-align: center !important;
    }
    .head_main {
        padding: 2% 3% 2% 3% !important;
    }
}

@media (min-width: 768px) {
    .header_contact_block_hidden {
        display: none;
    }
}


.preview {
    position: relative;
}

.preview-shadow--bottom {
    position: absolute;
    bottom: 0;

    width: 100%;
    height: 308px;

    background: linear-gradient(180deg, rgba(44, 44, 44, 0) 0%, #2C2C2C 100%);
}

.preview__bg {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background: url('/images/static/bg-main.jpg') 0 0 / cover no-repeat;
}

.preview__container {
    padding: 0 25px;
    text-align: center;
}

.preview__container_top {
    max-width: 924px;

    margin-bottom: 32px;
}

.preview__wrapper {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 52px 0 32px 0;
}


.preview__title {
    text-align: center;

    font-weight: 700;
    font-size: 46px;
    line-height: 100%;
    color: #fff;

    margin: 0 auto;
}

.preview__description {
    color: #fff;
}

.preview__title_mobile {
    display: none;
}


.preview__title span {
    color: #ffc000;
}

.preview__links {
    display: flex;
    align-items: flex-start;
    height: 100%;
    max-width: 800px;
    margin: 0 -5px 30px -5px;
}


@media (max-width: 768px) {
    .preview__links {
        align-items: center;
    }
}

.preview__link {
    flex: 0 1 33.333%;
    font-size: 20px;
    text-align: center;
    transition: all 100ms ease;
    color: #ffc000 !important;
    margin-right: 15px;
}
.preview__link:last-child {
    margin: 0;
}

.preview__link:hover {
    opacity: 0.8;
}

.preview__button {
    width: 100%;
    max-width: 300px;
}

.preview__btn {
    display: block;
    background: #ffc000;
    padding: 15px;
    font-size: 18px;
    text-align: center;
    border-radius: 7px;
    transition: all 200ms ease-in-out;
    color: #000;
}

.preview__btn:hover {
    opacity: 0.9;
}

.range-input {
    padding: 0 30px;
}

.preview-card {
    display: flex;

    margin: 0 1%;
}

.card-calculate {
    margin-right: 21px;
}

.calculate-clock {
    position: relative;

    margin-bottom: 24px;
}

.calculate-clock-circle {
    --r: 170px;
    position: relative;

    width: 100%;
    min-width: 300px;
    height: 300px;

    border-radius: 50%;
}

#circle-inner {
    --per: 0;
    r: var(--r);
    stroke-dasharray: calc(2 * 3.14 * var(--r));
    stroke-dashoffset: calc((2 * 3.14 * var(--r)) * ((100 - var(--per)) / 100));
    transform: rotate(180deg);
    transform-origin: center;
    stroke-linecap: round;
}

#circle-wrapper {
    r: var(--r);
}
  
#circle-dot {
    transform-origin: center;
    transform: rotate(0deg);
    cursor: grab;
}

.circle-dot--flashing {
    animation: blinker 1s linear infinite;
    pointer-events: none;
}

@keyframes blinker {
    50% {
        opacity: 0.25;
    }
}

#circle-dot:active {
    cursor: grabbing;
}

.calculate-clock-clue {
    position: absolute;
    top: -78px;
    left: 0;

    transition: 0.2s;
}

.calculate-clock-clue__content {
    position: relative;
}

.calculate-clock-clue__text {
    position: absolute;
    top: 46%;
    left: 50%;

    display: flex;
    flex-direction: column;
    align-items: center;

    width: 100%;
    text-align: center;

    color: #FFC000;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 100%;

    transform: translate(-50%, -50%);
}

.calculate-clock__debug {
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    transform: translate(-50%, -50%);

    user-select: none;
}

.calculate-clock__title {
    text-align: center;

    width: 100%;
    max-width: 181px;

    font-weight: 500;
    font-size: 20px;
    line-height: 100%;

    color: #fff;

    opacity: 0.8;

    margin-bottom: 18px;
}

.calculate-clock__subtitle {
    display: flex;

    font-weight: 700;
    font-size: 60px;
    line-height: 100%;

    color: #fff;
}

.calculate-clock__subtitle > p {
    margin: 0;
    margin-left: 2px;
}

.calculate-discount {
    width: 100%;
    max-width: 180px;

    margin: 0 auto;
}

.calculate-discount__checkbox {
    position: absolute;
    z-index: -1;

    opacity: 0;
}

.calculate-discount__checkbox + .calculate-discount__text {
    display: inline-flex;
    align-items: center;
    user-select: none;
}

.calculate-discount__checkbox + .calculate-discount__text::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid #d9d9d9;
    margin-right: 16px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
}

.calculate-discount__checkbox:checked + .calculate-discount__text::before {
    border-color: #d9d9d9;
    background-color: #d9d9d9;
    background-image: url("/images/static/checked-ico.svg");
    background-size: 86% auto;
}

.calculate-discount__text {
    display: flex;
    align-items: normal !important;

    font-weight: 400;
    font-size: 20px;
    line-height: 100%;

    color: #fff;
    
    cursor: pointer;
}

.card-info {
    display: flex;

    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(12.5px); 

    padding: 32px 24px 32px 32px;
}

.card-info__photo {
    background: url('/images/static/preview-card-photo.jpg') 0 0 / cover no-repeat;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    width: 400px;
    
    margin-right: 20px;
}

.card-info__price {
    text-align: center;

    font-weight: 700;
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0.02em;
    color: #fff;

    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(5px);

    padding: 14px 0;
}

.card-info-stages__content {
    display: flex;
}

.card-info-stages__left {
    width: 100%;
    max-width: 235px;

    margin-right: 10px;
}

.card-info-stages__right {
    width: 100%;
    max-width: 340px;
}

.card-info-stages-stage-1 {
    margin-bottom: 24px;
}

.card-info-stages-stage-1 > .card-info-stages-stage__text:not(:last-child)  {
    margin-bottom: 4px;
}

.card-info-stages-stage-2 > .card-info-stages-stage__text:not(:last-child)  {
    margin-bottom: 4px;
}

.card-info-stages-stage-3 > .card-info-stages-stage__text:not(:last-child)  {
    margin-bottom: 4px;
}

.card-info-stages-stage__header {
    font-weight: 500;
    font-size: 20px;
    line-height: 100%;

    color: #fff;

    margin-bottom: 8px;
}

.card-info-stages-stage__text {
    font-weight: 400;
    font-size: 16px;
    line-height: 120%;

    color: #e2e2e2;

    opacity: 0.8;
}

.card-info-stages-stage__text::before {
    content: '—';

    margin-right: 6px;
}

.card-info-stages__buy {
    display: inline-flex;
    flex-direction: column;
    flex-grow: 1;
}

.card-info-stages__prices {
    font-weight: 700;
    font-size: 36px;
    line-height: 100%;

    color:#fff;

    margin-bottom: 12px;
}

.card-info-stages__btn {
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;

    background: #ffc000;

    padding: 12px 76px;

    cursor: pointer;

    color: black !important;
}

.swiper-button-prev,
.swiper-button-next {
    transform: scale(calc(100% / 0.3));
    top: calc(50% + 22px) !important;
}

.swiper-button-prev::after,
.swiper-button-next::after {
    content: '' !important;
}

.swiper-button-next {
    background: url('/images/static/btn-next.png') 0 0 / contain no-repeat;

    margin-right: 3%;
}
.swiper-button-prev {
    background: url('/images/static/btn-prev.png') 0 0 / contain no-repeat;

    margin-left: 3%;
}

.swiper {
    width: 100%;
    height: 504px;
}

.swiper-slide {
    display: block;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.development {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    margin: 0 19%;
    margin-top: 100px;
}

.development-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    margin-bottom: 66px;
}

.development-info__title {
    text-align: center;

    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 120%;
    color: #FFFFFF;

    opacity: 0.7;

    margin-bottom: 8px;
}

.development-info__subtitle {
    text-align: center;

    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 120%;
    color: #fff;

    opacity: 0.7;
}

.development__slider {
    width: 100%;
}

.development-links {
    display: flex;
    justify-content: center;

    width: 100%;

    margin-bottom: 24px;
}

.development-link {
    width: 416px;
    
    border-top: 1px solid #FFC000;

    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 120%;

    opacity: 0.7;

    color: #ffc000 !important;

    padding: 10px 0;
}

.development-link:not(:last-child) {
    margin-right: 15px;
}

.development-link:hover {
    opacity: 0.8;
}

@media (max-width: 768px) {
    .swiper {
        width: 100%;
        height: 220px;
    }

    .development {
        margin: 0 5%;
        margin-top: 70px;
    }
    .development__slider {
        width: 100%;
        
        margin-bottom: 0;
    }
    .development-links {
        flex-wrap: wrap;

        margin-bottom: 20px;
    }
    .development-link {
        width: 100%;
        padding: 10px 0;
        font-weight: 500;
        font-size: 20px;
        line-height: 120%;
        opacity: 1;
    }
    .development-link:not(:last-child) {
        margin-right: 0;
        margin-bottom: 15px;
    }    
    .swiper-button-prev,
    .swiper-button-next {
        top: calc(50% + 10px) !important;

        transform: scale(calc(100% / 0.6));
    }
}

@media (max-width: 1050px) {
    .calculate-clock-clue {
        width: 100%;
        top: -56px;
        left: -42px;
    }
    
    .calculate-clock-clue__frame {
        width: 100%;
    }

    .calculate-clock-clue__text {
        width: 100%;
        max-width: 164px;
    }

    .preview-shadow--bottom {
        bottom: -2px;
    }

    .preview__wrapper {
        padding: 17px 0 0 0;
        margin-bottom: 35px;
    }

    .preview__container {
        padding: 0 12px;
    }

    .preview__container_top {
        margin-bottom: 60px;
    }

    .preview-card {
        flex-direction: column;
        margin: 0 5%;
    }

    .preview__title {
        font-size: 33px !important;
        width: 100%;
    }

    .card-calculate {
        margin-right: 0;
        margin-bottom: 32px;
    }

    .card-info {
        padding: 20px 20px 24px 20px;
        flex-direction: column;
    }

    .card-info__photo {
        width: 100%;
        height: 430px;
        margin-right: 0;
        margin-bottom: 20px;
    }

    .card-info__price {
        font-weight: 700;
        font-size: 20px;
        line-height: 100%;
        padding: 12px 0;
    }

    .card-info-stages {
        position: relative;
    }

    .card-info-stages__content {
        flex-wrap: wrap;
        margin-top: 122px;
    }

    .card-info-stages__left {
        max-width: inherit;
        margin-right: 0;
    }

    .card-info-stages__right {
        max-width: inherit;
    }

    .card-info-stages-stage__header {
        margin-bottom: 8px;
    }

    .card-info-stages-stage-1 {
        margin-bottom: 16px;
    }

    .card-info-stages-stage-2 {
        margin-bottom: 16px;
    }

    .card-info-stages__buy {
        position: absolute;
        width: 100%;
        top: 0;
    }

    .card-info-stages__btn {
        width: 100%;
        padding: 16px 0;

        color: black !important;
    }

    .development-info__title {
        font-weight: 500;
        font-size: 20px;
        line-height: 120%;
        opacity: 1;
        color: rgba(255, 255, 255, 0.8);
    }

    .development-info__subtitle {
        font-weight: 500;
        font-size: 20px;
        line-height: 120%;
        opacity: 1;
        color: rgba(255, 255, 255, 0.8);
    }

    .development-info {
        margin-bottom: 24px;
    }
}