@charset "UTF-8";
.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
word-wrap: normal !important;
}
.wpcf7 form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #00a0d2; }
.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
display: none;
}
.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
border-color: #dc3232; }
.wpcf7 form.spam .wpcf7-response-output {
border-color: #f56e28; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: #ffb900; }
.wpcf7-form-control-wrap {
position: relative;
}
.wpcf7-not-valid-tip {
color: #dc3232; font-size: 1em;
font-weight: normal;
display: block;
}
.use-floating-validation-tip .wpcf7-not-valid-tip {
position: relative;
top: -2ex;
left: 1em;
z-index: 100;
border: 1px solid #dc3232;
background: #fff;
padding: .2em .8em;
width: 24em;
}
.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
}
.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
content: " ";
}
.wpcf7-spinner {
visibility: hidden;
display: inline-block;
background-color: #23282d; opacity: 0.75;
width: 24px;
height: 24px;
border: none;
border-radius: 100%;
padding: 0;
margin: 0 24px;
position: relative;
}
form.submitting .wpcf7-spinner {
visibility: visible;
}
.wpcf7-spinner::before {
content: '';
position: absolute;
background-color: #fbfbfc; top: 4px;
left: 4px;
width: 6px;
height: 6px;
border: none;
border-radius: 100%;
transform-origin: 8px 8px;
animation-name: spin;
animation-duration: 1000ms;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@media (prefers-reduced-motion: reduce) {
.wpcf7-spinner::before {
animation-name: blink;
animation-duration: 2000ms;
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes blink {
from {
opacity: 0;
}
50% {
opacity: 1;
}
to {
opacity: 0;
}
}
.wpcf7 [inert] {
opacity: 0.5;
}
.wpcf7 input[type="file"] {
cursor: pointer;
}
.wpcf7 input[type="file"]:disabled {
cursor: default;
}
.wpcf7 .wpcf7-submit:disabled {
cursor: not-allowed;
}
.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
direction: ltr;
}
.wpcf7-reflection > output {
display: list-item;
list-style: none;
}
.wpcf7-reflection > output[hidden] {
display: none;
}#cookie-notice,#cookie-notice .cn-button:not(.cn-button-custom){font-family:-apple-system,BlinkMacSystemFont,Arial,Roboto,"Helvetica Neue",sans-serif;font-weight:400;font-size:13px;text-align:center}#cookie-notice{position:fixed;min-width:100%;height:auto;z-index:100000;letter-spacing:0;line-height:20px;left:0}#cookie-notice,#cookie-notice *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}#cookie-notice.cn-animated{-webkit-animation-duration:.5s!important;animation-duration:.5s!important;-webkit-animation-fill-mode:both;animation-fill-mode:both}#cookie-notice.cn-animated.cn-effect-none{-webkit-animation-duration:1ms!important;animation-duration:1ms!important}#cookie-notice .cookie-notice-container,#cookie-notice .cookie-revoke-container{display:block}#cookie-notice.cookie-notice-hidden .cookie-notice-container,#cookie-notice.cookie-revoke-hidden .cookie-revoke-container{display:none}.cn-position-top{top:0}.cn-position-bottom{bottom:0}.cookie-notice-container{padding:15px 30px;text-align:center;width:100%;z-index:2}.cookie-revoke-container{padding:15px 30px;width:100%;z-index:1}.cn-close-icon{position:absolute;right:15px;top:50%;margin-top:-10px;width:15px;height:15px;opacity:.5;padding:10px;outline:0;cursor:pointer}.cn-close-icon:hover{opacity:1}.cn-close-icon:after,.cn-close-icon:before{position:absolute;content:' ';height:15px;width:2px;top:3px;background-color:grey}.cn-close-icon:before{transform:rotate(45deg)}.cn-close-icon:after{transform:rotate(-45deg)}#cookie-notice .cn-revoke-cookie{margin:0}#cookie-notice .cn-button{margin:0 0 0 10px;display:inline-block}#cookie-notice .cn-button:not(.cn-button-custom){letter-spacing:.25px;margin:0 0 0 10px;text-transform:none;display:inline-block;cursor:pointer;touch-action:manipulation;white-space:nowrap;outline:0;box-shadow:none;text-shadow:none;border:none;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;text-decoration:none;padding:8.5px 10px;line-height:1;color:inherit}.cn-text-container{margin:0 0 6px}.cn-buttons-container,.cn-text-container{display:inline-block}#cookie-notice.cookie-notice-visible.cn-effect-fade,#cookie-notice.cookie-notice-visible.cn-effect-none,#cookie-notice.cookie-revoke-visible.cn-effect-fade,#cookie-notice.cookie-revoke-visible.cn-effect-none{-webkit-animation-name:fadeIn;animation-name:fadeIn}#cookie-notice.cn-effect-fade,#cookie-notice.cn-effect-none{-webkit-animation-name:fadeOut;animation-name:fadeOut}#cookie-notice.cookie-notice-visible.cn-effect-slide,#cookie-notice.cookie-revoke-visible.cn-effect-slide{-webkit-animation-name:slideInUp;animation-name:slideInUp}#cookie-notice.cn-effect-slide{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}#cookie-notice.cookie-notice-visible.cn-position-top.cn-effect-slide,#cookie-notice.cookie-revoke-visible.cn-position-top.cn-effect-slide{-webkit-animation-name:slideInDown;animation-name:slideInDown}#cookie-notice.cn-position-top.cn-effect-slide{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@-webkit-keyframes fadeOut{from{opacity:1}to{opacity:0}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}@-webkit-keyframes slideInUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@-webkit-keyframes slideOutDown{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideOutDown{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@-webkit-keyframes slideInDown{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInDown{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@-webkit-keyframes slideOutUp{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideOutUp{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@media all and (max-width:900px){.cookie-notice-container #cn-notice-buttons,.cookie-notice-container #cn-notice-text{display:block}#cookie-notice .cn-button{margin:0 5px 5px}}@media all and (max-width:480px){.cookie-notice-container,.cookie-revoke-container{padding:15px 25px}}.popup-template .modal {
opacity: 0;
-webkit-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}
.popup-template .modal.is-open {
opacity: 1;
-webkit-transition: all 250ms ease;
-o-transition: all 250ms ease;
transition: all 250ms ease;
}html.has-scroll-smooth {
overflow: hidden; }
html.has-scroll-dragging {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none; }
.has-scroll-smooth body {
overflow: hidden; }
.has-scroll-smooth [data-scroll-container] {
min-height: 100vh; }
[data-scroll-direction="horizontal"] [data-scroll-container] {
height: 100vh;
display: inline-block;
white-space: nowrap; }
[data-scroll-direction="horizontal"] [data-scroll-section] {
display: inline-block;
vertical-align: top;
white-space: nowrap;
height: 100%; }
.c-scrollbar {
position: absolute;
right: 0;
top: 0;
width: 11px;
height: 100%;
transform-origin: center right;
transition: transform 0.3s, opacity 0.3s;
opacity: 0; }
.c-scrollbar:hover {
transform: scaleX(1.45); }
.c-scrollbar:hover, .has-scroll-scrolling .c-scrollbar, .has-scroll-dragging .c-scrollbar {
opacity: 1; }
[data-scroll-direction="horizontal"] .c-scrollbar {
width: 100%;
height: 10px;
top: auto;
bottom: 0;
transform: scaleY(1); }
[data-scroll-direction="horizontal"] .c-scrollbar:hover {
transform: scaleY(1.3); }
.c-scrollbar_thumb {
position: absolute;
top: 0;
right: 0;
background-color: black;
opacity: 0.5;
width: 7px;
border-radius: 10px;
margin: 2px;
cursor: -webkit-grab;
cursor: grab; }
.has-scroll-dragging .c-scrollbar_thumb {
cursor: -webkit-grabbing;
cursor: grabbing; }
[data-scroll-direction="horizontal"] .c-scrollbar_thumb {
right: auto;
bottom: 0; }

* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
-webkit-text-size-adjust: auto;
-ms-text-size-adjust: auto;
-webkit-font-smoothing: antialiased;
}
input {
-webkit-appearance: none;
-webkit-border-radius: 0;
}
.preloader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background-color: #0c0a0b;
overflow: hidden;
z-index: 10000000000;
}
.preloader .text-container {
display: flex;
flex-direction: row;
gap: 1em;
overflow: hidden;
color: white;
opacity: 0;
}
.preloader .text-container .counter {
font-family: 'HelveticaNeueCyr', serif;
font-size: 1.3em;
font-weight: 600;
}
.nav-menu__bg_open {
opacity: .5;
pointer-events: all;
}
.nav-menu__bg {
background: #000;
height: 100vh;
left: 0;
opacity: 0;
pointer-events: none;
position: fixed;
top: 0;
transition: opacity .25s linear;
width: 100vw;
z-index: 1200;
}
body {
-webkit-text-size-adjust: auto;
-ms-text-size-adjust: auto;
-webkit-font-smoothing: antialiased;
font-size: 16px; background-color: rgba(9, 9, 9, 0.93);
color: #e5dfe0;
font-family: 'HelveticaNeueCyr', serif;
animation: fadeInAnimation ease 3s;
animation-iteration-count: 1;
animation-fill-mode: forwards;
}
@keyframes fadeInAnimation {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
header {
height: 80px;
width: calc(100% - 50px);
max-width: 1920px;
background-color: rgba(2, 2, 2, 0.5);
color: #ffffff;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
position: fixed;
top: 25px;
left: 50%;
transform: translateX(-50%);
margin: 0 auto;
border-radius: 25px;
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
padding: 25px;
z-index: 111;
}
header .rheader {
display: flex;
max-width: 500px;
width: 100%;
justify-content: space-between;
}
header .rheader .timeline {
white-space: nowrap;
display: flex;
align-items: center;
padding: 0 25px;
}
header .rheader .timeline > div {
margin-right: 6px;
}
header .rheader .timeline > div:last-of-type {
margin-right: 0;
}
header .rheader .timeline #timezone {
color: #ffef6a;
}
.logo img {
width: 40px;
height: auto;
display: block;
object-fit: contain;
}
.btn {
width: 40px;
}
.btn .btnMenu {
width: 40px;
height: 40px;
background-color: #fff;
display: flex;
border-radius: 50%;
justify-content: center;
align-items: center;
cursor: pointer;
}
.btn .btnMenu svg {
width: 18px;
height: 18px;
}
.btnOpenedMenu {
position: absolute;
top: 22px;
right: 25px;
}
.btnOpenedMenu .btnMenu {
background-color: #020202;
}
.btnOpenedMenu .btnMenu svg {
fill: #fff;
}
.btnMenu {
position: relative;
}
.overlaymenu {
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100%;
z-index: 112;
background-color: rgba(11, 11, 11, 0.6);
display: none;
}
.menuwrapper {
width: 100%;
height: auto;
max-height: 500px;
max-width: 500px;
position: absolute;
top: 25px;
right: 25px;
background-color: #ffffff;
display: flex;
border-radius: 25px;
padding: 45px;
z-index: 1;
}
.menuwrapper .menucontent {
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between;
padding: 10px;
font-size: 1.15em;
}
.menuwrapper .menucontent .soon {
font-size: 0.53em;
line-height: 0.53em;
font-weight: 500;
margin-left: 10px;
border: 1.5px solid #a4a4a4;
padding: 1px 4px;
border-radius: 15px;
text-transform: uppercase;
color: #020202;
transform: translateY(-10px);
display: inline-flex;
margin: 1px 0;
padding: 4px 6px;
}
.menuwrapper .menucontent .menu {
margin-bottom: 191px;
}
.menuwrapper .menucontent .menu ul {
padding: 0;
margin: 0;
list-style-type: none;
}
.menuwrapper .menucontent .menu ul li {
margin-bottom: 15px;
}
.menuwrapper .menucontent .menu ul li a {
color: #020202;
text-decoration: none;
transition: color 0.2s ease;
display: inline;
font-weight: 500;
}
.menuwrapper .menucontent .menufooter {
width: 100%;
height: auto;
}
.menuwrapper .menucontent .menufooter ul {
padding: 0;
margin: 0;
list-style-type: none;
}
.menuwrapper .menucontent .menufooter ul li a {
color: #020202;
text-decoration: none;
transition: color 0.2s ease;
display: inline;
font-size: 0.85em;
font-weight: 500;
}
.menuwrapper .menucontent .menufooter ul .disable {
color: #e4e4e4;
}
.menuwrapper .menucontent .menufooter .lang {
display: flex;
flex-direction: row;
padding: 10px 0px;
padding-bottom: 0;
}
.menuwrapper .menucontent .menufooter .lang li {
margin-right: 20px;
}
.menuwrapper .menucontent .menufooter .lang li a {
font-size: 0.75em;
font-weight: 600;
}
.flex {
width: 100%;
display: flex;
}
.menu-btn {
align-items: center;
color: #fff;
display: flex;
justify-content: center;
background-color: transparent;
outline: none;
border: none;
cursor: pointer;
}
.menu-btn:active .menu-btn__mask-icon,
.menu-btn:focus .menu-btn__mask-icon,
.menu-btn:hover .menu-btn__mask-icon {
clip-path: circle(100%);
}
.menu-btn_dark {
color: #000;
}
.menu-btn_dark .menu-btn__base-icon rect {
fill: #000;
}
.menu-btn_dark .menu-btn__base-icon line {
stroke: #000;
}
.menu-btn_dark .menu-btn__mask-icon circle {
fill: #000;
}
.menu-btn_dark .menu-btn__mask-icon rect {
fill: #fff;
}
.menu-btn_dark .menu-btn__mask-icon line {
stroke: #fff;
}
.menu-btn__icon-wrapper {
margin-left: 12px;
position: relative;
}
@media (min-width: 36rem) {
.menu-btn__icon-wrapper {
height: 2.5vw;
margin-left: 1vw;
width: 2.5vw;
}
.menu-btn__icon-wrapper svg {
height: 100%;
width: 100%;
}
}
.menu-btn_with-mask .menu-btn__mask-icon {
clip-path: circle(100%);
}
.menu-btn__mask-icon {
clip-path: circle(0);
height: 100%;
left: 0;
position: absolute;
top: 0;
transition: clip-path 0.45s cubic-bezier(0.33, 1, 0.68, 1);
width: 100%;
}
.menu-btn__rect-el {
will-change: transform;
}
.menu-btn__rect-el:first-of-type {
transform: translate(3.3px, 3.3px);
}
.menu-btn__rect-el:nth-of-type(2) {
transform: translate(-3.3px, -3.3px);
}
.menu-btn__rect-el:nth-of-type(3) {
transform: translate(-3.3px, 3.3px);
}
.menu-btn__rect-el:nth-of-type(4) {
transform: translate(3.3px, -3.3px);
}
.container {
padding: 0 calc(1rem + 2vw);
width: 100%;
}
.location {
color: rgba(255, 255, 255, 0.5);
}
.location_dark {
color: rgba(0, 0, 0, 0.5);
}
.current-time {
color: #fff;
}
.current-time__meridiem {
color: rgba(255, 255, 255, 0.5);
}
.current-time_dark {
color: #000;
}
.current-time_dark .current-time__meridiem {
color: rgba(0, 0, 0, 0.5);
}
.logo {
height: auto;
width: 40px;
}
@media (min-width: 48rem) {
.logo {
height: auto;
width: 50px;
}
}
.logo__svg {
height: 100%;
width: 100%;
}
.link-ladder {
--shadow-size: 1.2em;
transform: translateZ(0);
}
.link-ladder:hover .link-ladder__letter {
--m: calc(var(--shadow-size))
;
}
.link-ladder_light .link-ladder__word {
text-shadow: 0 calc(var(--shadow-size)*-1) 0 #fff;
}
.link-ladder_dark .link-ladder__word {
text-shadow: 0 calc(var(--shadow-size)*-1) 0 #000;
}
.link-ladder__word {
display: flex;
line-height: 1.1em;
overflow: hidden;
}
.link-ladder__letter {
backface-visibility: hidden;
display: block;
font-style: normal;
transform: translateY(var(--m)) translateZ(0);
transition: transform .4s ease;
}
.link-ladder__letter:first-child {
transition-delay: .05s;
}
.link-ladder__letter:nth-child(2) {
transition-delay: .1s;
}
.link-ladder__letter:nth-child(3) {
transition-delay: .15s;
}
.link-ladder__letter:nth-child(4) {
transition-delay: .2s;
}
.link-ladder__letter:nth-child(5) {
transition-delay: .25s;
}
.link-ladder__letter:nth-child(6) {
transition-delay: .3s;
}
.link-ladder__letter:nth-child(7) {
transition-delay: .35s;
}
.link-ladder__letter:nth-child(8) {
transition-delay: .4s;
}
.link-ladder__letter:nth-child(9) {
transition-delay: .45s;
}
.link-ladder__letter:nth-child(10) {
transition-delay: .5s;
}
.link-ladder__letter:nth-child(11) {
transition-delay: .55s;
}
.link {
align-items: center;
display: flex;
justify-content: space-between;
}
.link:focus .link__arrow,
.link:focus .link__arrow_clone,
.link:hover .link__arrow,
.link:hover .link__arrow_clone,
.link_hovered .link__arrow,
.link_hovered .link__arrow_clone {
transform: translate(100%, -100%) rotate(-45deg);
}
.link__text {
display: inline-block;
margin-right: 12px;
}
.link__icon {
display: inline-block;
display: flex;
height: 100%;
overflow: hidden;
position: relative;
}
@media (min-width: 36rem) {
.link__icon {
margin-left: .4vw;
}
}
.link__arrow {
display: inline-flex;
transform: rotate(-45deg);
transition: transform .35s ease;
}
@media (min-width: 36rem) {
.link__arrow {
height: 1vw;
width: 1vw;
}
.link__arrow svg {
height: 100%;
width: 100%;
}
}
.link__arrow_clone {
bottom: -100%;
left: -100%;
position: absolute;
transform: translate(0) rotate(-45deg);
z-index: 2;
}
.nav-menu {
display: none;
position: fixed;
right: 10px;
top: 10px;
width: calc(100% - 20px);
z-index: 1500;
}
@media (min-width: 36rem) {
.nav-menu {
right: calc(1rem + 2vw);
width: 40vw;
}
}
@media (min-width: 64rem) {
.nav-menu {
width: 40vw;
}
}
@media (min-width: 80rem) {
.nav-menu {
right: calc(1rem + 2vw);
top: .5vw;
width: 30vw;
}
}
.nav-menu__header-wrapper {
position: relative;
right: 0;
top: 0;
white-space: nowrap;
width: 100%;
z-index: 1900;
}
.nav-menu__header {
align-items: center;
display: flex;
justify-content: space-between;
position: absolute;
right: calc(1rem + 2vw);
top: 20px;
width: calc(100% - 2rem - 4vw);
}
@media (min-width: 36rem) {
.nav-menu__header {
right: 2vw;
width: calc(100% - 5.2vw);
}
}
@media (min-width: 120rem) {
.nav-menu__header {
right: 2vw;
width: calc(100% - 4vw);
}
}
.nav-menu__wrapper {
backdrop-filter: blur(40px);
background: #ffffff;
border-radius: 30px;
padding: 88px calc(1rem + 2vw) 44px;
transform-origin: top right;
will-change: transform;
}
@media (min-width: 36rem) {
.nav-menu__wrapper {
border-radius: 2vw;
padding: calc(16px + 5vw) 3.2vw 4vw;
}
}
@media (min-width: 120rem) {
.nav-menu__wrapper {
padding: calc(16px + 4vw) 2vw 2vw;
}
}
.nav-menu_light .nav-menu__main-link {
color: #000;
}
.nav-menu_light .nav-menu__main-link_disabled {
color: rgba(0, 0, 0, 0.3);
}
.nav-menu__list {
align-items: flex-end;
flex-direction: column;
list-style: none;
margin-left: auto;
margin-right: 0;
}
.nav-menu__list li {
display: flex;
}
.nav-menu__main-link {
color: #000;
padding: 6px 0;
}
@media (min-width: 36rem) {
.nav-menu__main-link {
padding: .4vw 0;
}
}
.nav-menu__main-link_disabled {
color: rgba(67, 67, 67, 0.3);
pointer-events: none;
}
.nav-menu__social-link {
padding: 8px 0;
width: 100%;
}
@media (min-width: 36rem) {
.nav-menu__social-link {
padding: .4vw 0;
}
}
.nav-menu__footer {
display: flex;
width: 100%;
}
.nav-menu__email {
align-self: flex-end;
}
.navbar {
align-items: center;
background-color: transparent;
color: #fff;
display: flex;
height: 80px;
left: 0;
position: fixed;
top: 0;
transition: all .25s ease;
width: 100%;
z-index: 1000;
}
@media (min-width: 36rem) {
.navbar {
height: clamp(50px, 4vw, 200px);
}
}
@media (min-width: 48rem) {
.navbar {
height: clamp(70px, 4vw, 200px);
}
}
@media (min-width: 120rem) {
.navbar {
height: 4vw;
}
}
.navbar_light {
backdrop-filter: blur(20px);
background: rgba(255, 255, 255, 0.5);
}
.navbar_light .navbar__button {
color: #000;
}
.navbar_light .navbar__button rect {
fill: #000;
}
.navbar_light .navbar__location,
.navbar_light .navbar__meridiem {
color: rgba(0, 0, 0, 0.5);
}
.navbar_light .navbar__time {
color: #000;
}
.navbar__container {
align-items: center;
display: flex;
justify-content: space-between;
width: 100%;
}
.navbar__content {
align-items: center;
display: flex;
justify-content: flex-end;
width: calc(100% - 20px);
}
@media (min-width: 36rem) {
.navbar__content {
justify-content: space-between;
padding-left: 32px;
width: 40vw;
}
}
@media (min-width: 90rem) {
.navbar__content {
width: 30vw;
}
}
.navbar__info {
align-items: center;
display: flex;
white-space: nowrap;
}
@media (max-width: 36rem) {
.navbar__info {
display: none;
}
}
.navbar__location,
.navbar__meridiem {
color: rgba(255, 255, 255, 0.5);
}
.navbar__time {
color: #fff;
}
.button {
border-radius: 100px;
display: inline-block;
position: relative;
width: fit-content;
}
.button:disabled {
color: initial;
}
.button_primary_dark:focus .button__mask,
.button_primary_dark:hover .button__mask {
clip-path: inset(0 0 0 100% round 100px);
}
.button_primary_light .button__mask {
clip-path: inset(0 100% 0 0 round 100px);
}
.button_primary_light:focus .button__mask,
.button_primary_light:hover .button__mask {
clip-path: inset(0 0 0 0 round 100px);
}
@media (min-width: 36rem) {
.button_primary_light .button__content,
.button_primary_light .button__mask {
padding: .75vw 1.2vw .8vw 2vw;
}
.button_primary_light .button__icon {
height: .8vw;
width: .8vw;
}
.button_primary_light .button__icon svg {
height: 100%;
width: 100%;
}
}
.button_secondary .button__content {
background-color: transparent;
border: none;
color: #fff;
padding: 12px 16px 12px 24px;
}
@media (min-width: 36rem) {
.button_secondary .button__content {
padding: .8vw .8vw .85vw 2vw;
}
}
.button_secondary .button__mask {
background-color: #fff;
border: none;
clip-path: inset(0 0 0 calc(100% - 36px) round 100px);
color: #000;
padding: 12px 10px 12px 24px;
}
@media (min-width: 36rem) {
.button_secondary .button__mask {
clip-path: inset(0 0 0 calc(100% - 2.4vw) round 100px);
padding: .8vw .8vw .85vw 2vw;
}
}
.button_secondary .button__icon {
margin-left: 24px;
}
@media (min-width: 36rem) {
.button_secondary .button__icon {
height: .8vw;
margin-left: 2vw;
width: .8vw;
}
.button_secondary .button__icon svg {
height: 100%;
width: 100%;
}
}
.button_secondary:focus .button__mask,
.button_secondary:hover .button__mask {
clip-path: inset(0 0 0 0 round 100px);
}
.button_iconless .button__content,
.button_iconless .button__mask {
padding: 12px 24px;
}
@media (min-width: 36rem) {
.button_iconless .button__content,
.button_iconless .button__mask {
padding: .75vw 2vw .8vw;
}
}
.button__content {
align-items: center;
background-color: #fff;
border: 1px solid #000;
border-radius: 100px;
display: inline-flex;
justify-content: center;
overflow: hidden;
padding: 12px 16px 12px 24px;
}
@media (min-width: 36rem) {
.button__content {
padding: 1vw 1.4vw 1vw 2vw;
}
}
.button__mask {
align-items: center;
background-color: #000;
border: 1px solid #000;
border-radius: 100px;
clip-path: inset(0 0 0 0 round 100px);
color: #fff;
display: inline-flex;
height: 100%;
justify-content: center;
left: 0;
overflow: hidden;
padding: 12px 16px 12px 24px;
position: absolute;
top: 0;
transition: clip-path 0.48s cubic-bezier(0.65, 0, 0.35, 1);
width: 100%;
}
@media (min-width: 36rem) {
.button__mask {
padding: 1vw 1.4vw 1vw 2vw;
}
}
.button__icon {
align-items: center;
display: flex;
height: 12px;
margin-left: 10px;
width: 12px;
}
@media (min-width: 36rem) {
.button__icon {
height: 1vw;
margin-left: .8vw;
width: 1vw;
}
.button__icon svg {
height: 100%;
width: 100%;
}
}
.button__error,
.button__loader,
.button__success {
left: 0;
margin: auto;
opacity: 0;
position: absolute;
right: 0;
}
.red {
display: block !important;
}
.wrap {
overflow: hidden;
}
section {
position: relative;
}
.main {
height: 500px;
background-color: #202020;
color: #fff;
}
.secone {
height: 470px;
background-color: #202020;
color: #fff;
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.secone .letspro {
font-size: 3.5em;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: #fff;
text-transform: uppercase;
font-weight: 900;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
font-family: 'HelveticaNeueCyr', serif;
transition: .23s ease-in-out;
}
.secone .letspro a {
text-decoration: none;
text-align: center;
color: #fff;
}
.secone .letspro a:hover {
text-decoration: underline;
}
.secone .letspro .letsprofirst,
.secone .letspro .letsprolast {
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
.secone .letspro .letsprofirst ion-icon,
.secone .letspro .letsprolast ion-icon {
margin-right: 10px;
}
.secone .letspro .letsprofirst .circlesend,
.secone .letspro .letsprolast .circlesend {
transition: .2s ease-in-out;
cursor: pointer;
position: absolute;
right: 25%;
top: 50%;
background-color: yellow;
color: #000;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border-radius: 50%;
z-index: 1;
padding: 25px;
text-align: center;
font-size: 18px;
letter-spacing: 4px;
width: 150px;
height: 150px;
font-weight: 400;
top: 70%;
font-size: 15px;
width: 140px;
height: auto;
font-weight: 500;
border-top-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 55px;
border-bottom-right-radius: 55px;
transform: rotate(10deg);
position: absolute;
}
.secone .letspro .letsprofirst .circlesend:hover,
.secone .letspro .letsprolast .circlesend:hover {
background-color: #000;
color: yellow;
}
.secone .letspro .splitting .word {
display: inline-flex;
position: relative;
overflow: hidden;
}
.secone .letspro .splitting .wordWrap {
position: relative;
display: inline-flex;
}
.sectwo {
overflow: hidden;
height: 150vh;
background-color: #010101;
color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.sectwo .letspro {
font-size: 10em;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: #fff;
text-transform: uppercase;
font-weight: 900;
position: relative;
left: 50%;
top: 0%;
transform: translate(-50%, -50%);
font-family: 'HelveticaNeueCyr', serif;
}
.nextproject {
min-height: 90vh;
background-color: #cdea68;
color: #212121;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.tstimg {
height: 100%;
background-color: #0a0a0a;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
overflow: hidden;
}
.tstimg img {
height: 100%;
width: 100%;
display: block;
object-fit: contain;
transform: translateY(-20%);
}
.c-scrollbar {
visibility: hidden;
}
.pfolio {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 3vw;
padding: 4vw 0 6vw 0vw;
max-width: 1920px;
margin: 0 auto;
}
.pfolio .pfolio_col {
border-radius: 25px;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);
text-decoration: none;
transform-style: preserve-3d;
max-height: 580px;
height: 100%;
}
.pfolio .pfolio_col img {
width: 100%;
height: 100%;
display: inline-block;
object-fit: cover;
vertical-align: middle;
}
.pfolio .pfolio_col video {
object-fit: cover;
display: inline-block;
width: 100%;
height: 100%;
vertical-align: middle;
}
.pfolio .pfolio_col .case_gradient {
position: absolute;
background-color: transparent;
background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.8));
width: 100%;
left: 0;
bottom: 0;
padding: 25px;
}
.pfolio .pfolio_col .case_gradient .case_name {
color: #fff;
font-weight: 500;
font-size: 1em;
margin-bottom: 10px;
}
.pfolio .pfolio_col .case_gradient .case_desc {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
color: #c8c8c8;
}
.pfolio .pfolio_col .case_gradient .case_desc .casecat-list {
display: flex;
}
.pfolio .pfolio_col .case_gradient .case_desc .casecat-list .case_cat {
font-size: 0.8em;
font-weight: 400;
padding: 6.6px 10px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 25px;
margin-right: 15px;
}
.pfolio .pfolio_col .case_gradient .case_desc .casecat-list .case_cat:last-of-type {
margin-right: 0;
}
.pfolio .pfolio_col .case_gradient .case_desc .case_company {
font-size: 0.8em;
font-weight: 400;
white-space: nowrap;
}
.pfolio .pfolio_col:hover {
transform: scale(1.02);
box-shadow: 0 40px 30px -15px rgba(0, 0, 0, 0.3);
}
.pfolio .casebottom {
width: 100%;
position: relative;
left: 0;
bottom: 0;
padding: 25px;
}
.pfolio .casebottom .case_name {
color: #fff;
font-weight: 500;
font-size: 1em;
margin-bottom: 10px;
}
.pfolio .casebottom .case_desc {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
color: #c8c8c8;
}
.pfolio .casebottom .case_desc .casecat-list {
display: flex;
}
.pfolio .casebottom .case_desc .casecat-list .case_cat {
font-size: 0.8em;
font-weight: 400;
padding: 6.6px 10px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 25px;
margin-right: 15px;
}
.pfolio .casebottom .case_desc .casecat-list .case_cat:last-of-type {
margin-right: 0;
}
.pfolio .casebottom .case_desc .case_company {
font-size: 0.8em;
font-weight: 400;
white-space: nowrap;
}
.pfolio .pfolio_wild {
grid-column: span 2;
}
.pfolio .pfolio_wild .casebottom {
position: absolute;
}
.pfolio .pfolio_wild img {
width: 100%;
height: 100%;
display: inline-block;
object-fit: cover;
vertical-align: middle;
}
.pg {
display: grid;
grid-template-columns: repeat(12, 1fr);
grid-gap: 4vw;
padding: 6vw 0;
}
.pg .pitem {
display: flex;
flex-direction: column;
border-radius: 25px;
position: relative;
grid-column: span 7;
}
.pg .pitem:nth-of-type(2) {
grid-column: span 5;
}
.pg .pitem:nth-of-type(2) .pthumb {
justify-content: flex-end;
align-items: flex-end;
}
.pg .pitem:nth-of-type(2) .pthumb img {
max-width: 370px;
}
.pg .pitem:nth-of-type(2) .pname {
justify-content: flex-end;
align-items: flex-end;
}
.pg .pitem:nth-of-type(3) {
grid-column: 4 / 10;
}
.pg .pitem:nth-of-type(3) .pthumb img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
max-width: unset;
}
.pg .pthumb {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
position: relative;
}
.pg .pthumb img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
}
.pg .pthumb .popen {
position: absolute;
bottom: 5%;
right: 5%;
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 1;
background-color: #fff;
color: #212121;
border-radius: 50%;
}
.pg .pthumb .popen ion-icon {
transform: rotate(-45deg);
}
.pg .pname {
padding-top: 25px;
display: flex;
flex-direction: column;
}
.pg .pname h3 {
color: #212121;
font-size: 0.85em;
font-weight: 400;
text-transform: uppercase;
} .g2col-more-projects {
opacity: 0;
max-height: 0;
visibility: hidden;
overflow: hidden;
transition: max-height 0.5s ease, opacity 0.5s ease; }
.show-more-projects {
height: auto;
display: flex;
justify-content: center;
align-items: center;
padding: 0 0 4vw 0;
}
.btn-more-projects {
font-family: 'HelveticaNeueCyr', serif;
display: inline-flex;
align-items: center;
justify-content: center;
position: relative;
cursor: pointer;
line-height: 1;
border-radius: 35px;
background-color: #0a0a0a;
text-decoration: none;
color: #fff;
font-weight: 500;
text-transform: uppercase;
padding: 16px 20px;
font-size: .9em;
border: none;
}
.btn-more-projects .lproj {
display: inline-flex;
justify-content: center;
align-items: center;
position: relative;
cursor: pointer;
line-height: 1;
color: #fff;
font-weight: 500;
text-transform: uppercase;
font-size: .9em;
}
.btn-more-projects .lproj .lprojc {
width: 10px;
height: 10px;
margin-left: 15px;
background-color: #b9fc01;
position: relative;
border-radius: 50%;
}
.secg2 {
display: flex;
flex-direction: column;
justify-content: center;
width: 100%;
padding: 0 0 70px 0;
background-color: #f5f5f5;
}
.secg2 .g2 {
grid-gap: 25px;
}
.secg2 .g2 .g2col {
display: flex;
flex-direction: column;
}
.secg2 .plist {
width: 100%;
padding: 0;
}
.secg2 .plist .plistitem {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 25px;
color: #212121;
align-items: center;
text-transform: uppercase;
font-family: 'HelveticaNeueCyr', serif;
border-bottom: 1px solid #e4e4e4;
padding: 20px 180px;
font-weight: 400;
font-size: .85em;
position: relative;
overflow: hidden;
z-index: 1;
transition: opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.secg2 .plist .plistitem:before {
overflow: hidden;
background-color: #fff;
bottom: 0;
content: '';
left: 0;
position: absolute;
right: 0;
top: 0;
transform: scaleY(0);
transform-origin: center bottom;
transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
z-index: -1;
}
.secg2 .plist .plistitem .namepro {
display: flex;
flex-direction: column;
color: #000;
font-weight: 400;
position: relative;
z-index: 2;
}
.secg2 .plist .plistitem .namepro .npro {
transition: .2s linear;
}
.secg2 .plist .plistitem .nameyear {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
z-index: 2;
}
.secg2 .plist .plistitem .openpro {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-end;
position: relative;
z-index: 2;
}
.secg2 .plist .plistitem .popen {
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 2;
background-color: #fff;
color: #212121;
border-radius: 50%;
position: relative;
transition: .2s linear;
}
.secg2 .plist .plistitem .popen ion-icon {
transform: rotate(-45deg);
}
.secg2 .plist .plistitem:hover .namepro .npro {
padding-left: 7px;
}
.secg2 .plist .plistitem:hover .openpro .popen {
background-color: #212121;
color: #fff;
margin-right: 7px;
}
.secg2 .plist .plistitem:hover::before {
transform: scaleY(1);
transform-origin: center top;
}
.secg2 .plist .listheader {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 25px;
color: #878787;
align-items: center;
text-transform: normal;
font-family: 'HelveticaNeueCyr', serif;
border-bottom: 1px solid #e4e4e4;
padding: 20px 180px;
font-weight: 400;
font-size: .75em;
position: relative;
overflow: hidden;
z-index: 1;
}
.secg2 .plist .listheader .namepro {
display: flex;
flex-direction: column;
position: relative;
z-index: 2;
}
.secg2 .plist .listheader .nameyear {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
z-index: 2;
}
.secg2 .plist .listheader .openpro {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-end;
position: relative;
z-index: 2;
}
.secg2 .plist .listheader .popen {
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 2;
background-color: #fff;
color: #212121;
border-radius: 50%;
position: relative;
transition: .2s linear;
}
.secg2 .plist .listheader .popen ion-icon {
transform: rotate(-45deg);
}
.advantures {
width: 100%;
padding: 6vw 0vw;
}
.box-ribbons {
position: absolute;
left: 0;
top: 37.2em;
right: 0;
bottom: auto;
display: flex;
width: 100%;
flex-direction: column;
justify-content: center;
align-items: center;
}
.box-ribbons.up {
top: -4em;
display: flex;
}
.box-ribbons.bottom {
left: 0;
top: auto;
right: 0;
bottom: -1.7em;
z-index: 1;
display: flex;
}
.box-ribbons.bottom-copy,
.box-ribbons.new {
position: relative;
left: 0;
top: auto;
right: 0;
bottom: 0;
z-index: 1;
display: flex;
}
.section--ase {
display: flex;
padding-top: 12.7em;
padding-bottom: 0;
flex-direction: column;
align-items: flex-start;
}
.max-w-304-copy {
max-width: 30.5em;
margin-left: 3em;
color: #fff;
}
.img-bg-1920 {
position: absolute;
left: -12.1em;
top: 12.2em;
right: auto;
bottom: auto;
width: 30.9em;
}
.span-h1-case {
display: flex;
margin-left: 1.2em;
font-size: 1.131578947368421em;
line-height: 84%;
}
.span-h1-case.small {
font-size: .96em;
}
.section-description {
padding-top: 5.1em;
padding-bottom: 7.7em;
color: #f2f2f2;
}
.container-description {
position: relative;
display: flex;
width: 100%;
max-width: 107.6em;
margin-right: auto;
margin-left: auto;
flex-direction: column;
grid-row-gap: 5em;
}
.container-description.max-w-1152 {
max-width: 107.6em;
grid-row-gap: 5.75em;
text-decoration: none;
}
.container-text {
display: grid;
justify-content: space-between;
grid-auto-columns: 1fr;
grid-column-gap: 0px;
grid-row-gap: 3.2em;
grid-template-areas: ". Area";
grid-template-columns: 34.8em minmax(auto, 63.8em);
grid-template-rows: auto;
color: #f2f2f2;
}
.container-text.review {
grid-row-gap: 1.75em;
grid-template-columns: 34.8em minmax(auto, 69.5em);
}
.box-img4 {
display: grid;
justify-content: space-between;
grid-auto-columns: 1fr;
grid-column-gap: 3.2em;
grid-row-gap: 3.2em;
grid-template-columns: 41.5em 18.2em 41.5em;
grid-template-rows: 34.2em;
}
.rich-case {
display: flex;
flex-direction: column;
}
.rich-case p {
font-size: 2em;
}
.rich-case.style-numbers li {
margin-bottom: 1.3em;
list-style-type: square;
}
.rich-case.style-numbers ul {
margin-bottom: -1.3em;
font-size: 2em;
line-height: 140%;
}
.rich-case li {
margin-bottom: .4em;
}
.rich-case em {
color: #e5ff00;
font-style: normal;
}
.rich-case ul {
font-size: 2em;
line-height: 140%;
}
.section-review {
padding-bottom: 2em;
}
.section-review.hide {
display: none;
}
.line-case {
width: 100%;
height: .4em;
max-width: 107.6em;
margin-right: auto;
margin-bottom: 5.3em;
margin-left: auto;
background-color: #fff;
}
.line-case.max-w-1152 {
max-width: 107.6em;
margin-bottom: 6.9em;
}
.line-case._w-100 {
max-width: none;
margin-top: -24.3em;
margin-bottom: 0;
}
.line-case.max-w-1296 {
max-width: 129.6em;
margin-bottom: 9.2em;
}
.h2-112 {
margin-top: -.06em;
font-size: 11.2em;
font-weight: 800;
}
.box-h2-next {
display: flex;
align-items: flex-start;
grid-column-gap: 2.4em;
color: #fff;
}
.img-next {
width: 100%;
height: 44.7em;
margin-bottom: -3em;
border-radius: 3.2em;
object-fit: cover;
object-position: 50% 0%;
}
.h2-72-44 {
color: #fff;
font-size: 7.2em;
}
.div-block-21 {
display: flex;
flex-direction: column;
grid-row-gap: 3.2em;
}
.wrapper-ribbon {
position: relative;
display: flex;
overflow: hidden;
padding-top: 25px;
padding-bottom: 25px;
background-color: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(5px);
transform: rotate(4deg);
}
.wrapper-ribbon.ribbon-graphic-2 {
position: absolute;
left: 0;
top: auto;
right: 0;
bottom: .3em;
width: 101%;
transform: rotate(-2deg);
}
.wrapper-ribbon.ribbon-graphic-2.z-index {
bottom: -.3em;
z-index: 2;
}
.wrapper-ribbon.ribbon-graphic-2.z-index2 {
bottom: -2.7em;
z-index: 2;
}
.wrapper-ribbon.ribbon-latest-2 {
position: relative;
z-index: 1;
width: 101%;
transform: rotate(4deg);
box-shadow: 0 40px 30px -15px rgba(0, 0, 0, 0.04);
}
.wrapper-ribbon.ribbon-latest-2.rotate-2deg {
transform: rotate(2deg);
}
.wrapper-ribbon._2deg {
position: relative;
z-index: 1;
width: 101%;
transform: rotate(2deg);
}
.wrapper-ribbon._2deg.rotate-2deg {
transform: rotate(2deg);
}
.wrapper-ribbon._2deg-copy {
transform: rotate(-2deg);
}
.wrapper-ribbon.no-deg {
padding-top: 0;
background-color: #202020;
transform: none;
}
.image-9 {
width: 3.3em;
margin-right: 5.2em;
flex: 0 0 auto;
}
.box-ribbon {
max-width: 15em;
margin-right: 5.2em;
flex: 0 0 auto;
font-family: 'HelveticaNeueCyr', serif;
color: #111216;
line-height: 1.5em;
font-weight: 600;
text-align: center;
text-transform: uppercase;
}
.ribbon {
position: relative;
z-index: 3;
display: flex;
justify-content: flex-start;
align-items: center;
flex: 0 0 auto;
}
.box-ribbons {
position: absolute;
z-index: 1;
left: 0;
top: 37.2em;
right: 0;
bottom: auto;
display: flex;
width: 100%;
flex-direction: column;
justify-content: center;
align-items: center;
}
.box-ribbons.up {
top: -3.8em;
display: flex;
}
.box-ribbons.bottom {
left: 0;
top: auto;
right: 0;
bottom: -1.7em;
z-index: 1;
display: flex;
}
.box-ribbons.bottom-copy,
.box-ribbons.new {
position: relative;
left: 0;
top: auto;
right: 0;
bottom: 0;
z-index: 1;
display: flex;
}
.section--ase {
display: flex;
padding-top: 12.7em;
padding-bottom: 0;
flex-direction: column;
align-items: flex-start;
}
.max-w-304-copy {
max-width: 30.5em;
margin-left: 3em;
color: #fff;
}
.img-bg-1920 {
position: absolute;
left: -12.1em;
top: 12.2em;
right: auto;
bottom: auto;
width: 30.9em;
}
.span-h1-case {
display: flex;
margin-left: 1.2em;
font-size: 1.131578947368421em;
line-height: 84%;
}
.ribbon {
animation: moving 12s linear infinite;
}
@keyframes moving {
from {
transform: translate(0%);
}
to {
transform: translate(-50%);
}
}
.creative {
position: relative;
display: grid;
grid-auto-columns: 1fr;
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto;
}
.creative .creative_sec {
position: relative;
padding: 8vw 80px;
color: #fff;
padding: 8em 9em 8em 3.2em;
}
.creative .creative_sec .creative_block {
display: flex;
flex-direction: column;
margin-bottom: 45px;
}
.creative .creative_sec .creative_block p {
line-height: 1.57em;
padding-left: 63px;
}
.creative .creative_sec .creative_block .creative_title {
display: flex;
flex-direction: row;
margin-bottom: 10px;
align-items: center;
}
.creative .creative_sec .creative_block .creative_title .creative_icon {
border: 0;
vertical-align: middle;
display: inline-block;
max-width: 100%;
width: 38px;
height: 38px;
margin-right: 25px;
}
.creative .creative_sec .creative_block .creative_title h3 {
font-family: 'Bigshouldersdisplay', sans-serif;
font-size: 2em;
font-weight: 900;
text-transform: uppercase;
}
.creative .creative_sec .creative_block:last-of-type {
margin-bottom: 0;
}
.creative .creative_sec .creative_header {
margin-bottom: 45px;
}
.creative .creative_sec .creative_header h2 {
font-size: 3em;
font-family: "HelveticaNeueCyr", serif;
font-weight: 700;
}
.creative_design {
background-image: url(//lyachartem.com/wp-content/themes/la/assets/images/creative-bg.svg);
background-position: 100% 50%;
background-size: cover;
background-repeat: no-repeat;
}
.creative_design h3,
.creative_design h2,
.creative_design p {
color: #111216;
}
.secnow {
display: flex;
flex-direction: column;
justify-content: center;
width: 100%;
padding: 0;
background-color: #f5f5f5;
overflow: hidden;
}
.secnow .nowrap {
width: 100%;
display: flex;
flex-wrap: nowrap;
font-size: 4em;
color: #212121;
padding: 15px 0vw;
width: 1000%;
flex-direction: column;
font-family: 'HelveticaNeueCyr', serif;
text-transform: uppercase;
font-weight: 900;
left: -40%;
position: relative;
}
.ribbonsfirst {
top: 70px !important;
}
.ribbonsfirst .wrapper-ribbon {
background-color: rgba(255, 255, 255, 0.95);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
}
.ribbonsfirst .wrapper-ribbon.ribbon-graphic-2 {
bottom: 1.5em;
}
.splitsec {
padding: 6vw 180px 180px 180px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
z-index: 1;
}
.split-text,
.anim {
font-weight: 500;
color: #fff;
display: inline;
}
.split-text .ltitlemain,
.anim .ltitlemain {
font-size: .75em;
color: #fff;
font-weight: 300;
font-family: 'Oswald', sans-serif;
text-transform: uppercase;
letter-spacing: 10px;
display: inline-flex;
align-items: center;
position: relative;
width: 35%;
position: relative;
bottom: 15px;
}
.split-text .splitting,
.split-text .anim,
.anim .splitting,
.anim .anim {
display: inline;
font-size: 2.5em;
overflow: hidden;
max-width: 875px;
margin: 0 auto;
}
.split-text .splitting .word,
.split-text .anim .word,
.anim .splitting .word,
.anim .anim .word {
display: inline-flex;
position: relative;
font-family: 'HelveticaNeueCyr', serif;
font-weight: 700;
overflow: hidden;
}
.split-text .splitting .wordWrap,
.split-text .anim .wordWrap,
.anim .splitting .wordWrap,
.anim .anim .wordWrap {
position: relative;
display: inline-flex;
}
.split-text .splitting a,
.split-text .anim a,
.anim .splitting a,
.anim .anim a {
display: inline-flex;
}
.split-text .splitting a:hover,
.split-text .anim a:hover,
.anim .splitting a:hover,
.anim .anim a:hover {
color: inherit;
}
.split-text .splitting a:hover:after, .split-text .splitting a:hover:before,
.split-text .anim a:hover:after,
.split-text .anim a:hover:before,
.anim .splitting a:hover:after,
.anim .splitting a:hover:before,
.anim .anim a:hover:after,
.anim .anim a:hover:before {
background-color: #fff;
background-position: 0 100%;
}
.split-text .splitting a .whitespace,
.split-text .anim a .whitespace,
.anim .splitting a .whitespace,
.anim .anim a .whitespace {
display: inline;
height: 1em;
}
.split-text .splitting a:after,
.split-text .splitting a:before,
.split-text .anim a:after,
.split-text .anim a:before,
.anim .splitting a:after,
.anim .splitting a:before,
.anim .anim a:after,
.anim .anim a:before {
transition: .1s linear;
content: "";
display: inline-block;
width: 26px;
height: 26px;
border-radius: 24px;
background: #f5f5f5 url(https://videinfra.com/assets/images/common/link-icon-xl.svg) 0 0 no-repeat;
margin: 15px 8px 6px 6px;
transition-property: background-color;
}
.split-text .splitting a:before,
.split-text .anim a:before,
.anim .splitting a:before,
.anim .anim a:before {
display: none;
margin: 0 0 8px 9px;
}
.split-text .splitmain,
.anim .splitmain {
font-size: 3em;
}
.whitespace {
display: inline;
height: 1em;
}
.bigparallax {
width: 100%;
height: auto;
display: block;
object-fit: cover;
}
.gtypesec {
z-index: 1;
min-height: 100vh;
padding: 8vw 80px 4vw 80px;
position: relative;
}
.gtypesec .theme .ltitle {
color: #fff;
}
.gtypesec .theme h2 {
color: #fff;
}
.whattosay {
min-height: auto;
}
.pt0 {
padding-top: 0 !important;
}
.gtype {
padding: 8vw 80px;
display: grid;
grid-template-columns: repeat(12, 1fr);
grid-gap: 3vw;
padding: 4vw 0vw;
width: 100%;
max-width: 1920px;
margin: 0 auto;
}
.gtype .gtypecol {
border-radius: 25px;
position: relative;
display: flex;
flex-direction: column;
justify-content: flex-start;
transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);
transform-style: preserve-3d;
background-color: rgba(46, 46, 51, 0.9);
grid-column: span 6;
padding: 6vw 0px;
text-decoration: none;
color: inherit;
}
.gtype .gtypecol:hover {
transform: scale(1.02);
box-shadow: 0 40px 30px -15px rgba(0, 0, 0, 0.3);
}
.gtype .gtypecol:hover .gtypecallback ion-icon {
transform: rotate(0);
}
.gtype .gtypecol:hover .gtypecallback::before {
animation: grow 1s ease-in-out infinite;
}
.gtype .gtypecol .point {
background-color: #b9fc01;
position: absolute;
left: 25px;
top: 25px;
width: 25px;
height: 9px;
border-top-left-radius: 25px;
border-top-right-radius: 0;
border-bottom-left-radius: 0;
border-bottom-right-radius: 25px;
}
.gtype .gtypecol .gtypename {
padding: 20px 45px;
}
.gtype .gtypecol .gtypename h2 {
color: #fff;
font-size: 2em;
font-family: "Bigshouldersdisplay", sans-serif;
font-size: 2em;
font-weight: 900;
text-transform: uppercase;
}
.gtype .gtypecol .gtypedesc {
padding: 20px 45px;
}
.gtype .gtypecol .gtypedesc p {
color: #fff;
font-size: 1.35em;
line-height: 1.35em;
font-weight: 300;
}
.gtype .gtypecol .oh {
overflow: hidden;
position: absolute;
bottom: 0;
right: 0%;
}
.gtype .gtypecol .oh .gtypeprice {
padding: 10px 25px;
font-weight: 700;
display: inline-flex;
flex-direction: column;
border-radius: 15px;
background-color: #212121;
color: #fff;
border-top-left-radius: 25px;
border-top-right-radius: 0;
border-bottom-left-radius: 0;
border-bottom-right-radius: 25px;
font-size: .85em;
letter-spacing: 0;
}
.gtype .gtypecol .gtypecallback {
background-color: #fff;
display: inline-flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: absolute;
border-radius: 50%;
box-shadow: 0px 10px 50px -6px rgba(0, 0, 0, 0.15);
z-index: 2;
bottom: 25px;
right: 5%;
width: 40px;
height: 40px;
}
.gtype .gtypecol .gtypecallback ion-icon {
transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);
transform-style: preserve-3d;
transform: rotate(-45deg);
padding: 4px;
color: #212121;
font-size: 1em;
position: relative;
z-index: 3;
}
.gtype .gtypecol .gtypecallback::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #fff;
border-radius: 50%;
z-index: 1;
background: #fff;
animation-delay: -0.5s;
}
@keyframes grow {
0% {
transform: scale(1, 1);
opacity: 1;
}
100% {
transform: scale(1.8, 1.8);
opacity: 0;
}
}
#gradient-canvas {
width: 100%;
min-height: 100%;
position: absolute;
left: 0;
top: 0;
--gradient-color-1: #1a1a1a;
--gradient-color-2: #1a1a1a;
--gradient-color-3: #1a1a1a;
--gradient-color-4: #b9fc01;
z-index: 1;
}
.wave {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 0;
}
.wave svg,
.wave img {
width: 100%;
height: 100%;
display: block;
object-fit: contain;
}
.blurback {
background-color: #b9fc01;
background-image: linear-gradient(160deg, #b9fc01 0%, #9cfc01 100%);
filter: blur(150px);
position: absolute;
top: -5%;
right: -10%;
width: 1000px;
height: 1000px;
border-radius: 50%;
animation: blurred 10s linear infinite;
}
.blurback2 {
background-color: #1a1a1a;
filter: blur(50px);
position: absolute;
top: -5%;
left: -10%;
width: 1000px;
height: 1000px;
border-radius: 50%;
animation: blurred2 10s linear infinite;
z-index: 1;
}
@keyframes blurred {
25% {
top: 0;
right: 10%;
}
50% {
top: 5%;
right: 20%;
width: 600px;
height: 600px;
}
75% {
top: 0%;
right: 0%;
width: 800px;
height: 800px;
}
100% {
top: -5%;
right: -10%;
width: 1000px;
height: 1000px;
}
}
@keyframes blurred2 {
25% {
top: 0;
left: 10%;
}
50% {
top: 5%;
left: 20%;
width: 600px;
height: 600px;
}
75% {
top: 0%;
left: 0%;
width: 800px;
height: 800px;
}
100% {
top: -5%;
left: -10%;
width: 1000px;
height: 1000px;
}
}
.bwebssec {
position: relative;
padding: 8vw 80px;
background-color: #f5f5f5;
}
.bwebssec .theme .ltitle {
color: #212121;
}
.bwebssec .theme h2 {
color: rgba(18, 18, 18, 0.8);
}
.buywebs {
display: grid;
grid-template-columns: repeat(12, 1fr);
grid-gap: 2vw;
padding: 4vw 0vw;
}
.buywebs .bwebs {
grid-column: span 2;
display: flex;
flex-direction: column;
}
.buywebs .bwebs .bwebspic img {
width: 100%;
display: block;
object-fit: contain;
border-radius: 7px;
}
.buywebs .bwebs:nth-of-type(1) {
justify-content: baseline;
}
.buywebs .bwebs:nth-of-type(2) {
justify-content: center;
}
.buywebs .bwebs:nth-of-type(4) {
justify-content: center;
padding-bottom: 25%;
}
.buywebs .bwebs:nth-of-type(5) {
justify-content: flex-end;
padding-bottom: 20%;
}
.buywebs .bwebswild {
grid-column: span 4;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.buywebs .bwebswild .bwebspic {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
}
.buywebs .bwebswild .bwebspic img {
border-radius: 0;
width: 100%;
max-width: 370px;
object-fit: contain;
}
@keyframes undrline {
to {
opacity: 1;
}
}
.theme {
width: 100%;
max-width: 1200px;
padding-left: 25px;
padding-right: 25px;
margin: 0 auto;
text-align: center;
padding: 4vw 0vw;
margin-bottom: 45px;
flex-direction: column;
display: flex;
}
.theme .ltitle {
color: #fff;
font-weight: 300;
font-family: 'Oswald', sans-serif;
text-transform: uppercase;
letter-spacing: 10px;
margin-bottom: 15px;
display: flex;
justify-content: center;
align-items: center;
font-size: 1em;
}
.theme h2 {
font-size: 2.3em;
font-weight: 900;
color: #fff;
font-family: 'HelveticaNeueCyr', serif;
}
.circle {
width: 2000px;
height: 1301px;
border-radius: 50%;
top: -2%;
right: -42%;
border: 1px solid #121212;
z-index: -1;
position: absolute;
display: none;
filter: blur(250px);
background: #000;
mix-blend-mode: multiply;
opacity: .2;
}
.hero_sec {
display: flex;
flex-direction: column;
justify-content: center;
min-height: 100vh;
position: relative;
}
.hero_sec .hero_textW {
color: #fff;
font-size: 4em;
line-height: 1.5em;
max-width: 1200px;
width: 100%;
min-height: 100vh;
padding: 0 4vw;
margin: 0 auto;
display: flex;
flex-direction: column;
justify-content: center;
}
.hero_sec .hero_textW .hero_text {
width: 100%;
max-width: 950px;
margin-bottom: 45px;
}
.hero_sec .hero_textW .hero_text span {
border-bottom: 4px solid #61db56;
}
.hero_sec .hero_textW .hero_text .glitch-wrapper {
font-size: 1.5em;
margin-bottom: 25px;
font-family: 'HelveticaNeueCyr', serif;
font-weight: 900;
text-transform: uppercase;
line-height: 1.5em;
}
.hero_sec .msec {
display: none;
}
.hero_sec .getInTouch {
display: none;
flex-direction: row;
max-width: 1200px;
width: 100%;
padding: 0 4vw;
margin: 0 auto;
}
.hero_sec .getInTouch .getInTouchBtn {
display: inline-flex;
flex-direction: row;
color: #121212;
font-size: 1em;
border-radius: 13px;
background-color: #61db56;
align-items: center;
justify-content: center;
padding: 14px 34px;
transition: .2s ease;
cursor: pointer;
}
.hero_sec .getInTouch .getInTouchBtn ion-icon {
padding-left: 6px;
color: #fff;
font-size: 1em;
transition: .2s ease;
}
.hero_sec .getInTouch .getInTouchBtn:hover {
background-color: #fff;
color: #121212;
}
.hero_sec .getInTouch .getInTouchBtn:hover ion-icon {
color: #121212;
font-size: 1em;
}
.hero_sec .mcircle {
width: 1200px;
height: 900px;
border-radius: 50%;
filter: blur(1200px);
left: -22%;
top: -10%;
z-index: 0;
background-color: #2a345187;
opacity: 0.1;
position: absolute;
mix-blend-mode: multiply;
display: none;
}
.reveal {
position: relative;
display: inline-block;
transform-origin: left;
transform: scaleX(0);
transition: .5s;
transition-delay: .6s;
}
.reveal.active {
transform: scaleX(1);
transition-delay: 0s;
}
.reveal.active:before {
transform: scaleX(0);
transition-delay: .6s;
z-index: 100;
}
.reveal:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #f5f5f5 !important;
transform-origin: right;
transition: .5s;
transition-delay: 0s;
z-index: 100;
}
.webdesignagency {
font-family: 'HelveticaNeueCyr', serif;
font-weight: 900;
text-transform: uppercase;
line-height: 1em;
font-size: 12vw;
}
.webdesignagency .fword {
padding-left: 250px;
}
.webdesignagency .web {
display: inline-flex;
flex-direction: row;
align-items: center;
}
.webdesignagency .web #one {
position: absolute;
z-index: 2;
width: 200px;
height: 200px;
background-color: #020202;
border-radius: 50%;
padding: 45px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: #005bbb;
background: linear-gradient(180deg, #005bbb 0%, #005bbb 50%, #ffd500 50%, #ffd500 100%);
}
.webdesignagency .design {
padding-left: 20%;
}
.webdesignagency .agency {
padding-left: 30%;
}
.webdesignagency .agency .lproj {
position: absolute;
font-size: 14px;
background: #181818;
display: inline-flex;
right: 10%;
height: auto;
line-height: 1;
top: 45%;
padding: 14px 24px;
height: 40px;
border-top-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 55px;
border-bottom-right-radius: 55px;
background: #fff;
right: 76%;
top: 35%;
color: #181818;
font-weight: 500;
cursor: pointer;
height: 50px;
min-width: 200px;
align-items: center;
justify-content: center;
padding: 0 45px;
text-decoration: none;
}
.webdesignagency .agency .lproj .lprojc {
background: #1efc2c;
width: 10px;
height: 10px;
position: absolute;
right: 20px;
border-radius: 50%;
top: 50%;
transform: translate(-50%, -50%);
border-top-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 55px;
border-bottom-right-radius: 55px;
}
.thankstext {
font-size: 10vw;
}
.desktop .folder img {
width: 32px;
height: 32px;
display: block;
object-fit: contain;
}
.types {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 15px;
width: 100%;
padding: 4vw 80px;
position: relative;
z-index: 1;
}
.types .tcol {
min-height: 450px;
border-radius: 4px;
padding: 65px 25px;
display: flex;
flex-direction: column;
background-color: rgba(18, 18, 18, 0.8);
}
.types .header .hbt h3 {
margin-bottom: 45px;
text-transform: uppercase;
font-size: 1.4em;
}
.types .header .hbt h3 span {
color: #61db56;
}
.types .header .hbt p {
display: inline-flex;
}
.types .header .take {
display: grid;
grid-template-columns: 65% calc(35% - 8px);
column-gap: 8px;
overflow: hidden;
}
.types .header .take .msg {
overflow: hidden;
padding: 10px 10px;
display: flex;
flex-direction: column;
border-radius: 4px;
align-items: center;
justify-content: center;
font-size: 0.75em;
text-transform: uppercase;
font-weight: 700;
background-color: #fff;
color: #121212;
transition: .2s ease-in-out;
cursor: pointer;
}
.types .header .take .msg:hover {
background-color: #f9d13f;
}
.types .header .take .prc {
overflow: hidden;
padding: 10px 10px;
display: flex;
flex-direction: column;
border-radius: 4px;
align-items: center;
justify-content: center;
font-weight: 900;
font-size: 0.85em;
background-color: #61db56;
color: #121212;
font-family: 'Oswald', serif;
}
.aboutg {
display: grid;
grid-template-columns: 65% 35%;
width: 100%;
padding: 8vw 80px;
}
.aboutg .abcoll {
position: relative;
display: flex;
justify-content: center;
align-items: center;
padding: 4vw;
}
.aboutg .abcoll .gradient {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
width: 65vw;
height: 65vw;
max-height: 900px;
max-width: 900px;
margin: auto;
filter: blur(530px);
background-color: #c8c8c8;
border-radius: 50%;
opacity: .1;
mix-blend-mode: multiply;
}
.aboutg .abcoll h2 {
font-size: 10em;
position: relative;
z-index: 1;
color: #fff;
text-shadow: 0 0 100px #000;
font-family: 'Nunito', serif;
}
.aboutg .abcoll img {
width: 330px;
display: block;
object-fit: contain;
position: absolute;
z-index: 0;
}
.aboutg .abcoll img:nth-of-type(1) {
left: 15%;
top: 20%;
}
.aboutg .abcoll img:nth-of-type(2) {
right: 10%;
top: -15%;
}
.aboutg .abcolr {
padding: 2vw;
}
.aboutg .abcolr h2 {
color: #fff;
margin-bottom: 25px;
font-weight: 600;
font-family: 'Nunito', serif;
}
.aboutg .abcolr p {
color: #e5dfe0;
line-height: 1.75em;
margin-bottom: 25px;
}
.splittitle {
display: inline-block !important;
font-size: 2em;
overflow: hidden;
text-transform: none;
letter-spacing: normal;
text-align: center;
width: 100%;
}
.splittitle .word {
display: inline-flex;
position: relative;
font-family: 'HelveticaNeueCyr', serif;
font-weight: 700;
overflow: hidden;
}
.splittitle .wordWrap {
position: relative;
display: inline-flex;
}
.backwhite {
position: absolute;
top: -2px;
left: 0;
width: 100%;
height: 3px;
background-color: #f5f5f5;
} #small-dialog {
overflow: hidden;
text-align: left;
position: relative;
max-width: 915px;
margin: 25px auto;
min-height: 90vh;
border-radius: 25px;
background-color: rgba(255, 255, 255, 0.81);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
color: rgba(18, 18, 18, 0.8);
display: flex;
flex-direction: column;
height: auto;
justify-content: space-between;
}
#small-dialog .x {
height: 500px;
position: absolute;
left: -20%;
background-color: rgba(28, 25, 25, 0.26);
border-radius: 50%;
filter: blur(500px);
z-index: 0;
width: 700px;
bottom: -50%;
opacity: 0.55;
}
.rsmalldialog {
min-height: 0 !important;
}
.popupheader {
position: relative;
z-index: 1;
margin-bottom: 45px;
}
.popupheader .popuptitle {
font-family: "Bigshouldersdisplay", sans-serif;
font-size: 2.5em;
font-weight: 900;
text-transform: uppercase;
}
.popupcontent {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
width: 100%;
}
.popupcontent .popupg {
display: grid;
grid-template-columns: repeat(1, 1fr);
width: 100%;
font-size: 2.5em;
margin-bottom: 25px;
}
.popupcontent .popupline {
display: flex;
justify-content: space-between;
padding: 6px 0px;
}
.popupcontent .popupline .line {
flex-shrink: 0;
}
.popupcontent .popupline p {
color: rgba(18, 18, 18, 0.8);
}
.popupcontent .popupline span {
flex-grow: 1;
display: flex;
}
.popupcontent .popupline span input {
width: 100%;
outline: none;
border: 0;
border-bottom: 2px solid rgba(18, 18, 18, 0.4);
display: inline-flex;
width: 100%;
background-color: transparent;
text-align: center;
margin: 0px 10px;
font-size: 20px;
font-weight: 500;
font-family: 'HelveticaNeueCyr', serif;
color: #181818;
transition: .2s ease;
}
.popupcontent .popupline span input:active, .popupcontent .popupline span input:hover {
border-color: rgba(18, 18, 18, 0.8);
}
.popupbtnW {
position: relative;
z-index: 1;
margin-bottom: 25px;
}
.popupbtnW input {
position: relative;
font-size: 14px;
background: #181818;
display: inline-flex;
height: auto;
line-height: 1;
padding: 14px 24px;
height: 40px;
border-top-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 55px;
border-bottom-right-radius: 55px;
background: #fff;
color: #181818;
font-weight: 500;
cursor: pointer;
height: 50px;
min-width: 200px;
align-items: center;
justify-content: center;
padding: 0 45px;
text-decoration: none;
transition: .2s ease;
border: none;
outline: none;
}
.popupbtnW input .lprojc {
display: none;
background: #1efc2c;
width: 10px;
height: 10px;
position: absolute;
right: 20px;
border-radius: 50%;
top: 50%;
transform: translate(-50%, -50%);
border-top-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 55px;
border-bottom-right-radius: 55px;
}
.popupbtnW input:hover {
background-color: #181818;
color: #fff;
}
.accordion {
max-width: 800px;
margin: 0 auto;
}
.accordion .accordion-item {
border: 1px solid #e4e4e4;
padding: 0;
margin-bottom: 25px;
border-radius: 25px;
}
.accordion button {
position: relative;
display: block;
text-align: left;
width: 100%;
padding: 0;
color: #121212;
font-size: 1.2em;
font-weight: 400;
border: none;
background: none;
outline: none;
font-family: 'HelveticaNeueCyr', serif;
}
.accordion button:hover, .accordion button:focus {
cursor: pointer;
color: #121212;
}
.accordion button:hover::after, .accordion button:focus::after {
cursor: pointer;
color: #121212;
border: 1px solid #d4d4d4;
}
.accordion button .accordion-title {
padding: 25px;
width: calc(100% - 50px);
}
.accordion button .icon {
display: inline-block;
position: absolute;
width: 22px;
height: 22px;
border: 1px solid;
border-radius: 22px;
top: 50%;
right: 25px;
transform: translateY(-12.5px);
}
.accordion button .icon::before {
display: block;
position: absolute;
content: '';
top: 9px;
left: 5px;
width: 10px;
height: 2px;
background: currentColor;
}
.accordion button .icon::after {
display: block;
position: absolute;
content: '';
top: 5px;
left: 9px;
width: 2px;
height: 10px;
background: currentColor;
}
.accordion button[aria-expanded='true'] {
color: #121212;
}
.accordion button[aria-expanded='true'] .icon::after {
width: 0;
}
.accordion button[aria-expanded='true'] + .accordion-content {
opacity: 1;
max-height: 9em;
transition: all 200ms linear;
will-change: opacity, max-height;
}
.accordion .accordion-content {
opacity: 0;
max-height: 0;
overflow: hidden;
transition: opacity 200ms linear, max-height 200ms linear;
will-change: opacity, max-height;
}
.accordion .accordion-content p {
font-size: 1.1em;
font-weight: 400;
line-height: 1.57em;
margin: 0px 25px 25px 25px;
color: #121212;
}
.refreshmain {
position: relative;
padding: 8vw 80px;
display: flex;
flex-direction: column;
height: 88vh;
min-height: 800px;
justify-content: center;
padding-top: 120px;
z-index: 2;
width: 100%;
margin: 0 auto;
max-width: 2080px;
}
.refreshmain h1 {
font-size: 5em;
color: #fff;
}
.refreshmain .rmainline {
display: flex;
}
.refreshmain .rdesc {
padding: 65px 0;
font-size: 1.35em;
max-width: 560px;
font-weight: 300;
line-height: 1.35em;
}
.lime {
color: #b9fc01;
}
.rlink .mlpbtn {
display: inline-flex;
align-items: center;
justify-content: center;
position: relative;
cursor: pointer;
line-height: 1;
border-radius: 35px;
background-color: #fff;
text-decoration: none;
color: #212121;
font-weight: 500;
text-transform: uppercase;
padding: 16px 20px;
font-size: .9em;
}
.rlink .mlpbtn .mlp {
display: inline-flex;
justify-content: center;
align-items: center;
position: relative;
}
.rlink .mlpbtn .mlp .lprojc {
width: 10px;
height: 10px;
margin-left: 15px;
background-color: #b9fc01;
position: relative;
border-radius: 50%;
}
.rlinkform .mlpbtn .mlp {
position: relative;
}
.rlinkform .mlpbtn .mlp input {
display: inline-flex;
align-items: center;
justify-content: center;
position: relative;
cursor: pointer;
line-height: 1;
border-radius: 35px;
background-color: #fff;
text-decoration: none;
color: #212121;
font-weight: 500;
text-transform: uppercase;
padding: 16px 20px;
font-size: .9em;
border: none;
outline: none;
font-family: "HelveticaNeueCyr", serif;
width: 100%;
}
.swiper-button-next::after,
.swiper-rtl .swiper-button-prev::after {
content: '' !important;
}
.swiper-button-prev::after,
.swiper-rtl .swiper-button-next::after {
content: '' !important;
}
.pointbtnsec {
width: 100%;
display: flex;
justify-content: flex-start;
flex-direction: column;
align-items: flex-end;
height: 80px;
}
.pointbtnsec .point_buttons {
width: 120px;
display: flex;
justify-content: space-between;
height: 40px;
}
.pointbtnsec .point_buttons .point_left,
.pointbtnsec .point_buttons .point_right {
width: 40px;
height: 40px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 2;
background-color: #fff;
color: #212121;
border-radius: 50%;
position: relative;
transition: 0.3s ease;
}
.pointsg {
width: 100%;
height: 100%;
display: block;
overflow: visible !important;
cursor: grab;
}
.pointsg .swiper-wrapper {
overflow: visible !important;
}
.pointsg .point_block {
display: flex;
flex-direction: column;
background-color: rgba(46, 46, 51, 0.9);
border-radius: 25px;
height: 320px;
width: 100%;
justify-content: space-between;
padding: 50px 25px;
}
.pointsg .point_block .point_title {
display: flex;
flex-direction: row;
margin-bottom: 10px;
color: #fff;
align-items: center;
}
.pointsg .point_block .point_title img {
border: 0;
vertical-align: middle;
display: inline-block;
max-width: 100%;
width: 1.5em;
height: 1.5em;
margin-right: 25px;
}
.pointsg .point_block .point_title h4 {
font-family: "Bigshouldersdisplay", sans-serif;
font-size: 1.5em;
font-weight: 900;
text-transform: uppercase;
}
.pointsg .point_block .point_desc {
display: flex;
flex-direction: column;
padding-top: 20%;
height: 100%;
justify-content: flex-start;
}
.pointsg .point_block .point_desc p {
line-height: 1.35em;
font-size: 1.15em;
color: #fff;
font-weight: 300;
}
.pb0 {
padding-bottom: 0;
}
.reviewlinebtn {
width: 100%;
max-width: 1000px;
margin: 0 auto;
}
.commentslider {
padding: 4vw 0vw;
width: 100%;
max-width: 1000px;
margin: 0 auto;
}
.commentslider .comment-slide {
cursor: default;
}
.commentslider .comment-slide .commentblock {
font-weight: 600;
line-height: 1.35em;
font-size: 2em;
background-image: radial-gradient(circle at 20% -10%, #FFB377, #FD6E6F 60%, #BD70DD 92%);
background-clip: border-box;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}
.commentslider .comment-slide .commentauthor {
display: flex;
width: 100%;
padding: 35px 0px;
align-items: center;
}
.commentslider .comment-slide .commentauthor .authorphoto {
margin-right: 25px;
}
.commentslider .comment-slide .commentauthor .authorphoto img {
width: 60px;
height: 60px;
display: block;
object-fit: cover;
border-radius: 50%;
}
.commentslider .comment-slide .commentauthor .authorname {
font-size: 1.1em;
color: rgba(18, 18, 18, 0.8);
font-weight: 500;
}
.refreshform {
position: relative;
z-index: 2;
}
.refreshform .rformg2 {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 0;
}
.refreshform .rformg2 .rformcol {
padding: 65px 55px;
}
.refreshform .rformg2 .rformcol .rformconline {
margin-bottom: 25px;
}
.refreshform .rformg2 .rformcol .rformconline:last-of-type {
margin-bottom: 0;
}
.refreshform .rformg2 .rformcol .rformconline label {
width: 100%;
display: none;
position: absolute;
}
.refreshform .rformg2 .rformcol .rformconline input {
width: 100%;
background-color: transparent;
border: 0;
outline: none;
border: 1px solid rgba(18, 18, 18, 0.8);
border-radius: 25px;
font-size: 1.25em;
padding: 10px 15px;
font-weight: 500;
font-family: 'HelveticaNeueCyr', sans-serif;
}
.refreshform .rformg2 .rformcol .rformconline textarea {
background-color: transparent;
border: 0;
outline: none;
border: 1px solid rgba(18, 18, 18, 0.8);
padding: 15px;
border-radius: 25px;
resize: none;
min-height: 120px;
width: 100%;
font-size: 1.25em;
display: flex;
font-weight: 500;
font-family: 'HelveticaNeueCyr', sans-serif;
padding-bottom: 15px;
}
.refreshform .rformg2 .rformcol .rformadditional {
display: flex;
height: auto;
}
.refreshform .rformg2 .rformcol .connectmenu {
list-style-type: none;
list-style-position: inside;
display: flex;
flex-direction: column;
}
.refreshform .rformg2 .rformcol .connectmenu li {
margin-bottom: 15px;
}
.refreshform .rformg2 .rformcol .connectmenu li a {
display: inline-flex;
color: #1a1a1a;
font-size: 1.25em;
align-items: center;
}
.refreshform .rformg2 .rformcol .connectmenu li a .gtypecallback {
background-color: #fff;
display: inline-flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
border-radius: 50%;
margin-right: 10px;
box-shadow: 0px 10px 50px -6px rgba(0, 0, 0, 0.15);
z-index: 2;
width: 30px;
height: 30px;
}
.refreshform .rformg2 .rformcol .connectmenu li a .gtypecallback ion-icon {
transition: 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);
transform-style: preserve-3d;
transform: rotate(-45deg);
padding: 4px;
color: #212121;
font-size: 16px;
position: relative;
z-index: 3;
}
.refreshform .rformg2 .rformcol .connectmenu li a .gtypecallback::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #fff;
border-radius: 50%;
z-index: 1;
background: #fff;
animation-delay: -0.5s;
}
.refreshform .rformg2 .rformcolright {
border-radius: 25px;
background-color: rgba(255, 253, 253, 0.31);
}  .my-mfp-zoom-in .zoom-anim-dialog {
opacity: 0;
transition: all 0.2s ease-in-out;
transform: scale(0.8);
} .my-mfp-zoom-in.mfp-ready .zoom-anim-dialog {
opacity: 1;
transform: scale(1);
} .my-mfp-zoom-in.mfp-removing .zoom-anim-dialog {
transform: scale(0.8);
opacity: 0;
} .my-mfp-zoom-in.mfp-bg {
opacity: 0;
transition: opacity 0.3s ease-out;
} .my-mfp-zoom-in.mfp-ready.mfp-bg {
opacity: 0.8;
} .my-mfp-zoom-in.mfp-removing.mfp-bg {
opacity: 0;
}
.mfp-container {
padding: 0;
}  .my-mfp-slide-bottom .zoom-anim-dialog {
opacity: 0;
transition: all 0.2s ease-out;
transform: translateY(-20px) perspective(600px) rotateX(10deg);
} .my-mfp-slide-bottom.mfp-ready .zoom-anim-dialog {
opacity: 1;
transform: translateY(0) perspective(600px) rotateX(0);
} .my-mfp-slide-bottom.mfp-removing .zoom-anim-dialog {
opacity: 0;
transform: translateY(-10px) perspective(600px) rotateX(10deg);
} .my-mfp-slide-bottom.mfp-bg {
opacity: 0;
transition: opacity 0.3s ease-out;
} .my-mfp-slide-bottom.mfp-ready.mfp-bg {
opacity: 0.8;
} .my-mfp-slide-bottom.mfp-removing.mfp-bg {
opacity: 0;
}
.scale-up-ver-center {
animation: scale-up-ver-center 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;
}
.my-mfp-slide-bottom.mfp-removing .scale-up-ver-center {
animation: scale-up-ver-center-reverse 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;
}
.slide-in-blurred-top {
animation: slide-in-blurred-top 0.6s cubic-bezier(0.23, 1, 0.32, 1) both;
}  @keyframes slide-in-blurred-top {
0% {
transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
transform-origin: 50% 0%;
filter: blur(40px);
opacity: 0;
}
100% {
transform: translateY(0) scaleY(1) scaleX(1);
transform-origin: 50% 50%;
filter: blur(0);
opacity: 1;
}
} @keyframes scale-up-ver-center {
0% {
transform: scaleY(0.4);
}
100% {
transform: scaleY(1);
}
}
@keyframes scale-up-ver-center-reverse {
0% {
transform: scaleY(1);
}
40% {
opacity: 0;
}
100% {
opacity: 0;
transform: scaleY(0.4);
}
}
.mfp-close-btn-in .mfp-close {
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #fff;
right: 15px;
top: 15px !important;
}
.mfp-close {
line-height: 40px !important;
font-size: 20px !important;
}
.wpcf7-not-valid-tip {
display: none !important;
}
.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required.wpcf7-not-valid {
border-bottom-color: #f35;
color: #f35;
}
.wpcf7 form .wpcf7-response-output {
border: 0px solid #00a0d2;
font-size: 12px;
display: inline-flex;
z-index: 1;
position: relative;
border-radius: 25px;
padding: 6px 6px;
margin: 0 auto;
text-align: center;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: none;
background-color: #ffb900;
}
.wpcf7-spinner {
display: inline-block;
background-color: transparent;
opacity: 1;
width: 100%;
height: 4px;
border: none;
padding: 0;
margin: 4px 0;
position: relative;
overflow: hidden;
border-radius: 25px;
}
.wpcf7-spinner:before {
display: none;
}
.wpcf7-spinner::after {
content: '';
position: absolute;
background-color: #ececec; top: 0;
left: -100%;
width: 100%;
height: 100%;
animation: progress 2s linear infinite;
}
@keyframes progress {
0% {
left: -100%;
}
100% {
left: 100%;
}
}
.sent .wpcf7-response-output {
border-bottom: 4px solid #1cdd31 !important;
border-radius: 0 !important;
padding-left: 0 !important;
padding-right: 0 !important;
font-weight: 600;
}
.wpcf7-not-valid {
color: red !important;
border: 1px solid red !important;
}
section.horizontal {
overflow-x: hidden;
}
section.horizontal .pin-wrap,
section.horizontal .animation-wrap {
display: flex;
position: relative;
z-index: 1;
height: 100vh;
}
section.horizontal .item {
position: relative;
padding: 150px 80px;
flex: 0 0 700px;
height: calc(100vh - 300px);
display: flex;
align-items: center;
line-height: 1.7;
user-select: none;
border-right: 1px solid rgba(0, 0, 0, 0.06);
background-color: transparent;
}
section.horizontal .item:before {
position: absolute;
font-size: 100px;
opacity: .13;
font-weight: bold;
z-index: -1;
transform: translate(-30px, -50px);
line-height: 1;
}
section.horizontal .animation-wrap.to-right {
counter-reset: item;
float: left;
}
section.horizontal .animation-wrap.to-left {
counter-reset: item 11;
float: right;
}
section.horizontal .animation-wrap.to-right .item:before {
counter-increment: item;
content: counter(item);
}
section.horizontal .animation-wrap.to-left .item:before {
counter-increment: item -1;
content: counter(item);
}
section.horizontal .animation-wrap .item:nth-child(2n+2) {
align-items: flex-start;
}
section.horizontal .animation-wrap .item:nth-child(4n+4) {
align-items: flex-end;
}
.gradient-title, .gradient-title span {
background: linear-gradient(90deg, #e1ff00, #1cc574, #00bd84);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}
#cookie-notice {
max-width: 380px;
}
.cookie-notice-container {
background-color: #fff;
border-radius: 45px;
color: #020202 !important;
}
#cookie-notice {
background-color: transparent !important;
justify-content: flex-end;
min-width: unset !important;
width: 370px;
right: 25px;
bottom: 25px;
left: unset !important;
}
#cn-accept-cookie {
border-radius: 35px !important;
color: #fff !important;
font-family: 'HelveticaNeueCyr', serif !important;
padding: 12px 27px !important;
font-weight: 600 !important;
margin-left: 15px !important;
}
.cookie-notice-container {
font-family: 'HelveticaNeueCyr', serif;
font-weight: 600;
}
#cn-close-notice {
right: 25px;
}
.cookie-notice-container {
display: flex !important;
align-items: center !important;
}
#cn-notice-text {
margin-bottom: 0;
}
.cookie-notice-container {
max-width: 380px;
}
.cookie-notice-container {
padding: 10px 30px;
}
.cookie-notice-hidden {
display: none;
}
.cookie-notice-visible {
display: flex;
}
@media (min-width: 1400px) {
.splitsec {
max-width: 1920px;
margin: 0 auto;
padding: 6vw 80px 180px 80px;
}
.gtype .gtypecol {
grid-column: span 3;
padding: 3vw 0vw;
}
.bwebssec {
padding: 4vw 80px;
}
.theme {
padding: 2vw 0vw;
margin-bottom: 0;
}
}
@media (max-width: 1250.98px) {
.point_title h4 {
font-size: 1.35em !important;
}
.refreshmain {
padding: 8vw 25px;
min-height: 750px;
}
.refreshmain .rdesc {
padding: 45px 0;
}
.wrapper-ribbon {
padding-top: 12px;
padding-bottom: 12px;
}
.popupcontent .popupg {
font-size: 2.2em;
}
}
@media (max-width: 1200.98px) {
.show-more-projects {
margin-top: 45px;
}
.splitsec { padding: 6vw 80px;
}
.secg2 .plist .listheader { padding: 20px 80px;
}
.secg2 .plist .plistitem { padding: 20px 80px;
}
.secg2 .plist .listheader { grid-template-columns: 1fr 1fr 80px 1fr;
}
.secg2 .plist .plistitem { grid-template-columns: 1fr 1fr 80px 1fr;
}
.secone .letspro { font-size: 2em;
width: 100%;
}
.popupcontent .popupg {
font-size: 1.5em;
}
}
@media (max-width: 1024px) {
.mfp-container {
padding-left: 0;
padding-right: 0;
}
.popupcontent .popupg {
font-size: 1.3em;
}
.popupheader .popuptitle {
font-size: 2.5em;
}
.theme h2 { font-size: 2em;
}
.split-text .splitting { font-size: 2em;
}
.bwebssec,
.gtypesec { padding: 8vw 25px;
}
.splitsec {
padding-left: 25px;
padding-right: 25px;
margin-bottom: 60px;
}
.gtype .gtypecol { grid-column: span 6;
}
.gtype .gtypecol .gtypedesc {
padding-top: 0;
}
.gtype { grid-gap: 3vw;
}
.secg2 .plist .listheader { padding: 20px 25px;
}
.secg2 .plist .plistitem { padding: 20px 25px;
}
.secnow .nowrap { font-size: 3em;
}
.secone .letspro {
font-size: 2em;
}
.secone .letsprouk {
font-size: 8vw;
}
.webdesignagency .design { padding-left: 30%;
}
.webdesignagency .agency { padding-left: 37%;
}
.webdesignagency .agency .lproj { right: 72%;
}
.refreshform .rformg2 {
grid-gap: 0;
}
.refreshform .rformg2 .rformcol .rformconline {
margin-bottom: 15px;
}
.secone .letspro {
font-size: 2em;
}
}
@media (max-width: 900.98px) {
.show-more-projects {
margin-top: 25px;
}
.menuwrapper {
right: 25px;
}
header .rheader {
max-width: unset;
}
header .rheader .timeline {
width: 100%;
justify-content: center;
}
.refreshmain h1 {
font-size: 3.5em;
}
.refreshmain .rdesc {
font-size: 1.3em;
padding: 25px 0 35px 0;
max-width: 65%;
}
.refreshmain {
padding: 8vw 25px;
}
.gtypesec {
padding: 8vw 25px 4vw 25px;
}
.gtype {
grid-gap: 15px;
padding: 25px 0;
}
.gtype .gtypecol {
padding: 45px 0;
}
.gtype .gtypecol .gtypename {
padding: 20px 25px;
}
.gtype .gtypecol .gtypedesc {
padding: 20px 25px;
}
.gtype .gtypecol .gtypedesc p {
font-size: 1em;
}
.pfolio {
grid-template-columns: repeat(2, 1fr);
}
#small-dialog {
padding: 0;
}
.popupcontent .popupline span input { font-size: 1em;
}
.popupcontent .popupg { font-size: 1em;
}
.webdesignagency .design { padding-left: 0;
right: 5%;
position: relative;
display: flex;
justify-content: flex-end;
}
.webdesignagency .agency .lproj {   top: 120px;
right: 25%;
}
.rlone {
left: -5%;
position: relative;
}
.rltwo {
left: -5%;
position: relative;
}
.rlthree {
left: 0%;
position: relative;
}
.popupheader .popuptitle { font-size: 2.5em;
}
}
@media (max-width: 768px) {
#cookie-notice {
left: 25px !important;
width: calc(100% - 50px) !important;
}
.cookie-notice-container {
max-width: unset !important;
padding: 15px 20px 15px 15px !important;
}
#cn-close-notice {
right: 12px;
}
#cn-accept-cookie {
margin-left: 10px !important;
}
.image-9 {
width: 1.85em;
}
.pfolio .casebottom .case_desc .casecat-list .case_cat,
.pfolio .pfolio_col .case_gradient .case_desc .casecat-list .case_cat {
margin-right: 8px;
font-size: 0.7em;
line-height: 0.7em;
}
.pfolio .casebottom {
padding: 15px;
}
.pfolio .casebottom .case_name {
margin-bottom: 6px;
}
.pfolio .pfolio_col .case_gradient {
padding: 15px;
}
.accordion .accordion-item {
margin-bottom: 15px;
}
.preloader .text-container h1 {
font-size: 1.1em;
}
.show-more-projects {
margin-top: 15px;
}
.casecat-list {
flex-wrap: nowrap;
overflow-x: scroll;
width: 100%;
}
.case_company {
display: none;
}
.overlaymenu {
width: 100%;
}
.menuwrapper {
padding: 25px;
top: 0;
right: 0;
margin: 15px;
width: calc(100% - 30px);
}
.logo img {
width: 30px;
}
header {
background-color: rgba(2, 2, 2, 0.3);
height: 70px;
width: calc(100% - 25px);
top: 15px;
}
header .rheader .timeline {
justify-content: flex-end;
font-size: .8em;
max-width: 80%;
padding-right: 0;
}
.theme .ltitle {
font-size: 0.75em;
}
.accordion button .accordion-title {
font-size: .85em;
width: calc(100% - 50px);
padding: 18px 25px;
}
.gtypesec {
padding: 8vw 80px 4vw 80px;
}
.theme {
margin-bottom: 0;
margin-top: 45px;
}
.refreshform .rformg2 {
grid-template-columns: repeat(1, 1fr);
}
.refreshmain h1 {
font-size: 1.95em;
}
.refreshmain .rdesc {
max-width: 93%;
font-size: 1em;
}
.refreshmain {
padding: 8vw 25px;
}
.pfolio {
grid-gap: 25px;
}
.pfolio .pfolio_col {
grid-column: span 2;
}
.pfolio .pfolio_col:hover {
transform: unset;
box-shadow: unset;
}
.bwebs.bwebsone,
.bwebs.bwebsfour {
display: none;
}
.bwebs.bwebstwo,
.bwebs.bwebsthree {
grid-column: span 3;
}
.buywebs .bwebswild {
grid-column: span 6;
}
#small-dialog { padding: 0;
margin: 15px;
}
.popupheader {
margin-bottom: 25px;
}
.popupheader .popuptitle { font-size: 2em;
}
.refreshform .rformg2 .rformcol {
padding: 25px;
}
.refreshform .rformg2 .rformcol .connectmenu li {
margin-bottom: 10px;
}
.refreshform .rformg2 .rformcol .connectmenu li:last-of-type {
margin-bottom: 0;
}
.refreshform .rformg2 .rformcol .connectmenu li a {
font-size: .9em;
font-weight: 500;
}
.popupcontent .popupg { font-size: 1em;
}
.popupcontent .popupg input {
font-size: 1em;
}
.popupcontent .popupline {
flex-direction: column;
}
.popupcontent .popupline span input {   text-align: left;
font-size: 16px;
font-weight: 400;
padding: 8px 0px;
margin-left: 0;
margin-right: 0;
border-bottom: 2px solid rgba(18, 18, 18, 0.8);
}
.popupcontent .popupline span {
margin-bottom: 15px;
}
.pg {
padding: 45px 0px;
}
.secnow {
min-height: unset;
}
.secnow .nowrap {
font-size: 2em;
}
.hero_sec .hero_textW {
display: none;
}
.hero_sec .msec {
display: none;
flex-direction: column;
}
.hero_sec .msec .mtw {
font-size: 4em;
font-family: 'HelveticaNeueCyr', serif;
font-weight: 700;
text-transform: uppercase;
padding-left: 25px;
padding-right: 25px;
height: 87vh;
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
color: #fff;
position: relative;
font-size: 3.5em;
font-weight: 800;
min-height: 500px;
}
.hero_sec .msec .mtw .mlpbtnW {
display: flex;
flex-direction: row;
}
.hero_sec .msec .mtw .mlpbtnW .mlpbtn {
position: relative;
display: flex;
text-decoration: none;
margin-top: 20px;
border-radius: 50px;
}
.hero_sec .msec .mtw .mlpbtnW .mlpbtn .lprojc {
background: #1efc2c;
width: 10px;
height: 10px;
position: absolute;
right: 20px;
border-radius: 55px;
top: 50%;
transform: translate(-50%, -50%);
}
.hero_sec .msec .mtw .mlpbtnW .mlpbtn .mlp {
position: relative;
font-size: 14px;
background: #181818;
display: inline-flex;
height: auto;
line-height: 1;
padding: 14px 24px;
height: 40px;
border-top-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 55px;
border-bottom-right-radius: 55px;
background: #fff;
color: #181818;
font-weight: 500;
cursor: pointer;
height: 50px;
min-width: 200px;
align-items: center;
justify-content: center;
padding: 0 45px;
}
.hero_sec .msec .mtw .mlpbtnW .mlpbtn .mlp .lprojc {
background: #1efc2c;
width: 10px;
height: 10px;
position: absolute;
right: 20px;
border-radius: 50%;
top: 50%;
transform: translate(-50%, -50%);
border-top-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 55px;
border-bottom-right-radius: 55px;
}
.hero_sec .msec .mtw .mlpbtnW .mlpbtn .mlp a {
color: inherit;
}
.pg .pname {
padding-top: 10px;
}
.split-text .splitting {
font-size: 1.1em;
line-height: 1.35em;
}
.webdesignagency {
font-size: 0.7em;
}
.webdesignagency .design {
padding-right: 5%;
}
.webdesignagency .fword {
right: 0;
position: relative;
}
.webdesignagency .agency {
padding-left: 35%;
}
.pg { grid-gap: 45px 4vw;
}
.split-text .ltitlemain {  width: 100%;
bottom: 45px;
}
.webdesignagency .web #one {  width: 140px;
height: 140px;
left: 25px;
}
.secg2 .plist .plistitem:hover .namepro { padding-left: 0;
}
.gtypesec { padding: 8vw 25px 4vw 25px;
}
.secg2 .plist .listheader .nameyear,
.secg2 .plist .plistitem .nameyear {
display: none;
}
.secg2 .plist .listheader,
.secg2 .plist .plistitem {
grid-template-columns: 1fr 1fr 47px;
}
.secg2 .plist .plistitem {
font-size: 0.7em;
}
.secone .letspro .letsprofirst .circlesend,
.secone .letspro .letsprolast .circlesend {
transition: .2s ease-in-out;
cursor: pointer;
position: absolute;
right: 8%;
background-color: yellow;
color: #000;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 1;
padding: 14px 10px;
text-align: center;
font-size: 10px;
letter-spacing: 4px;
font-weight: 500;
transform: rotate(10deg);
top: 40%;
border-radius: 50%;
width: 80px;
height: 80px;
border: unset;
border-top-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 55px;
border-bottom-right-radius: 55px;
}
.secone .letspro {
font-size: 1.2em;
}
.accordion .accordion-content p {
font-size: 1em;
line-height: 1.35em;
}
.commentslider .comment-slide .commentblock {
font-size: 1.1em;
line-height: 1.35em;
}
.commentslider .comment-slide .commentauthor { padding: 15px 0px;
}
.commentslider .comment-slide .commentauthor .authorphoto img {  width: 40px;
height: 40px;
}
.commentslider .comment-slide .commentauthor .authorname { font-size: .85em;
}
.gtypesec {
min-height: auto;
}
.pointbtnsec {
height: auto;
margin-bottom: 15px;
}
.mmt0 {
margin-top: 0;
}
.mpt0 {
padding-top: 0;
}
.mpb0 {
padding-bottom: 0;
}
.whattosay {
padding-top: 0;
}
}
@media (max-width: 576px) {
.gtype .gtypecol {
grid-column: span 12;
}
}@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Medium.eot);
src: local('HelveticaNeueCyr-Medium'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Medium.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Medium.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Medium.ttf) format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Heavy.eot);
src: local('HelveticaNeueCyr-Heavy'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Heavy.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Heavy.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Heavy.ttf) format('truetype');
font-weight: 900;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-HeavyItalic.eot);
src: local('HelveticaNeueCyr-HeavyItalic'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-HeavyItalic.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-HeavyItalic.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-HeavyItalic.ttf) format('truetype');
font-weight: 900;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Black.eot);
src: local('HelveticaNeueCyr-Black'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Black.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Black.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Black.ttf) format('truetype');
font-weight: 900;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-UltraLightItalic.eot);
src: local('HelveticaNeueCyr-UltraLightItalic'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-UltraLightItalic.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-UltraLightItalic.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-UltraLightItalic.ttf) format('truetype');
font-weight: 200;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-BlackItalic.eot);
src: local('HelveticaNeueCyr-BlackItalic'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-BlackItalic.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-BlackItalic.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-BlackItalic.ttf) format('truetype');
font-weight: 900;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-ThinItalic.eot);
src: local('HelveticaNeueCyr-ThinItalic'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-ThinItalic.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-ThinItalic.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-ThinItalic.ttf) format('truetype');
font-weight: 100;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-MediumItalic.eot);
src: local('HelveticaNeueCyr-MediumItalic'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-MediumItalic.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-MediumItalic.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-MediumItalic.ttf) format('truetype');
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-LightItalic.eot);
src: local('HelveticaNeueCyr-LightItalic'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-LightItalic.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-LightItalic.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-LightItalic.ttf) format('truetype');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-UltraLight.eot);
src: local('HelveticaNeueCyr-UltraLight'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-UltraLight.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-UltraLight.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-UltraLight.ttf) format('truetype');
font-weight: 200;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-BoldItalic.eot);
src: local('HelveticaNeueCyr-BoldItalic'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-BoldItalic.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-BoldItalic.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-BoldItalic.ttf) format('truetype');
font-weight: bold;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Italic.eot);
src: local('HelveticaNeueCyr-Italic'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Italic.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Italic.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Italic.ttf) format('truetype');
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Roman.eot);
src: local('HelveticaNeueCyr-Roman'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Roman.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Roman.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Roman.ttf) format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Bold.eot);
src: local('HelveticaNeueCyr-Bold'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Bold.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Bold.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Bold.ttf) format('truetype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Light.eot);
src: local('HelveticaNeueCyr-Light'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Light.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Light.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Light.ttf) format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'HelveticaNeueCyr';
src: url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Thin.eot);
src: local('HelveticaNeueCyr-Thin'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Thin.eot?#iefix) format('embedded-opentype'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Thin.woff) format('woff'),
url(//lyachartem.com/wp-content/themes/la/assets/fonts/HelveticaNeueCyr-Thin.ttf) format('truetype');
font-weight: 100;
font-style: normal;
} @font-face {
font-family: 'Bigshouldersdisplay';
src: url(https://uploads-ssl.webflow.com/62987ef69f2e0a0ca1db9ac4/6298844e3cd8b95d14dea900_BigShouldersDisplay-Bold.ttf) format('truetype');
font-weight: 700;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Bigshouldersdisplay';
src: url(https://uploads-ssl.webflow.com/62987ef69f2e0a0ca1db9ac4/6298844e9f2e0a6c7fdbbb83_BigShouldersDisplay-Light.ttf) format('truetype');
font-weight: 300;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Bigshouldersdisplay';
src: url(https://uploads-ssl.webflow.com/62987ef69f2e0a0ca1db9ac4/6298844e727920e079802337_BigShouldersDisplay-ExtraBold.ttf) format('truetype');
font-weight: 800;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Bigshouldersdisplay';
src: url(https://uploads-ssl.webflow.com/62987ef69f2e0a0ca1db9ac4/6298844e223b0332bcc1c3ca_BigShouldersDisplay-Medium.ttf) format('truetype');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Bigshouldersdisplay';
src: url(https://uploads-ssl.webflow.com/62987ef69f2e0a0ca1db9ac4/6298844e72792060d1802338_BigShouldersDisplay-ExtraLight.ttf) format('truetype');
font-weight: 200;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Bigshouldersdisplay';
src: url(https://uploads-ssl.webflow.com/62987ef69f2e0a0ca1db9ac4/6298844e57578825e8439de0_BigShouldersDisplay-Black.ttf) format('truetype');
font-weight: 900;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Bigshouldersdisplay';
src: url(https://uploads-ssl.webflow.com/62987ef69f2e0a0ca1db9ac4/6298844f1a67fcd64535b087_BigShouldersDisplay-SemiBold.ttf) format('truetype');
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Bigshouldersdisplay';
src: url(https://uploads-ssl.webflow.com/62987ef69f2e0a0ca1db9ac4/6298844f5a6e944f8ed9f857_BigShouldersDisplay-Regular.ttf) format('truetype');
font-weight: 400;
font-style: normal;
font-display: swap;
}