/* */
@font-face {
font-family: "NAMU";
src: url("../fonts/NAMU-Pro.otf") format("opentype");
src: url("../fonts/NAMU-Pro.ttf") format("truetype");
}
/* */
/* */
* {
font-family: 'NAMU', sans-serif;
font-weight: inherit;
border: 0;
vertical-align: baseline;
cursor: default;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
h1, h2, h3, h4, h5, h6 { margin: 0; }
a, a * {
color: #087DC1;
text-decoration: none;
cursor: pointer;
}
input, textarea {
outline: none;
cursor: text;
}
textarea { resize: none; }
strong, b { font-weight: 700; }
em { font-style: italic; }
ul {
margin: 0;
padding: 0;
}
p { margin: 0; }
img {
display: block;
width: 100%;
height: auto;
}
img.lazy {
opacity: 0;
transition: opacity .3s;
}
img.lazy.loaded { opacity: 1; }
/* */
/* */
html {
display: block;
height: 100%;
font-size: 10px;
}
body {
display: flex;
position: relative;
margin: 0;
height: 100%;
flex-direction: column;
color: #fff;
background: #191616;
font-size: 14px;
font-weight: 900;
line-height: 1.2;
}
main {
position: relative;
flex: 1 0 auto;
}
.container {
position: relative;
max-width: 1200px;
width: 100%;
margin: 0 auto;
}
.single-page { padding-top: 26px; }
@media (max-width: 1260px) {
.container { max-width: 960px; }
}
@media (max-width: 992px) {
.container { max-width: 720px; }
.container.-adaptive-max-width-992 { max-width: 100%; }
}
@media (max-width: 768px) {
.container { max-width: 540px; }
.container.-adaptive-max-width-768 { max-width: 100%; }
.single-page { padding-top: 20px; }
}
@media (max-width: 576px) {
.container {
padding-left: 15px;
padding-right: 15px;
}
.container.-adaptive-max-width-768,
.container.-adaptive-max-width-992 {
padding-left: 0;
padding-right: 0;
}
}
/* */
/* */
.t-80 {
font-size: 80px;
line-height: 0.85;
}
.t-56 {
font-size: 56px;
line-height: 1.2;
}
.t-40 {
font-size: 40px;
line-height: 1.2;
}
.t-32 {
font-size: 32px;
line-height: 1.2;
}
.t-28 {
font-size: 28px;
line-height: 1.2;
}
.t-24 {
font-size: 24px;
line-height: 1.2;
}
.t-20 {
font-size: 20px;
line-height: 1.2;
}
.t-18 {
font-size: 18px;
line-height: 1.3;
}
.t-16 {
font-size: 16px;
line-height: 1.2;
}
.t-12 {
font-size: 12px;
line-height: 1.2;
}
.t-10 {
font-size: 10px;
line-height: 1.2;
}
.-gray { opacity: .5; }
@media (max-width: 1260px) {
.t-80 { font-size: 60px; }
}
@media (max-width: 992px) {
.t-56 { font-size: 50px; }
.t-40 { font-size: 30px; }
.t-20 { font-size: 18px; }
}
@media (max-width: 768px) {
.t-80 { font-size: 48px; }
.t-56 { font-size: 36px; }
.t-40 { font-size: 20px; }
.t-32 { font-size: 24px; }
.t-28 { font-size: 18px; }
.t-24 { font-size: 18px; }
.t-18 { font-size: 14px; }
}
@media (max-width: 576px) {
.t-24 { font-size: 14px; }
.t-20 { font-size: 14px; }
.t-16 { font-size: 14px; }
}
/* */
/* */
.alignleft {
float: left;
margin: 0 15px 28px 0;
}
.alignright {
float: right;
margin: 0 0 28px 15px;
}
.aligncenter {
display: block;
margin: 0 auto 28px;
}
.centered {
margin-left: auto;
margin-right: auto;
text-align: center;
}
.highlight-rainbow {
background: linear-gradient(90.81deg, #8B08F8 25.36%, #F15934 74.3%, #FFAF02 97.66%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.content-block ul,
.content-block ol {
padding-left: 20px;
}
.content-block ul li:not(:last-child),
.content-block ol li:not(:last-child) {
margin-bottom: 24px;
}
.content-block p:not(:last-child) { margin-bottom: 24px; }
.content-block iframe { width: 100%; }
.content-block p.iframe-wrapper {
position: relative;
padding-bottom: 56.25%;
}
.content-block p.iframe-wrapper iframe {
position: absolute;
top: 0;
left: 0;
height: 100%;
}
/* */
/* */
body.admin-bar {
height: calc(100% - 32px);
margin-top: 32px;
}
@media (max-width: 782px) {
body.admin-bar {
height: calc(100% - 46px);
margin-top: 46px;
}
}
@media (max-width: 600px) { html #wpadminbar { top: -46px; } }
/* */
/* */
.btn {
display: inline-block;
padding: 11px 20px;
color: #191616;
background: #fff;
border: 1px solid #fff;
border-radius: 37px;
text-align: center;
transition: color .3s, background-color .3s;
line-height: 20px;
}
.btn:hover {
color: #fff;
background: transparent;
}
.btn-black {
color: #fff;
background: #000;
transition: color .3s, background-color .3s, border-color .3s;
}
.btn-black:hover {
color: #000;
border-color: #000;
}
.btn-border {
border-color: #191616;
transition: color .3s, background-color .3s;
}
.btn-border:hover {
color: #fff;
background: #191616;
opacity: 1;
}
.btn-border-transparent {
padding: 11px 34px;
color: #fff;
background: transparent;
}
.btn-border-transparent:hover {
color: #191616;
background: #fff;
}
.btn-arrow-left {
position: relative;
display: inline-block;
padding-left: 22px;
color: #fff;
transition: opacity .3s;
}
.btn-arrow-left:before {
content: "";
position: absolute;
top: 5px;
left: 6px;
width: 8px;
height: 8px;
border-bottom: 2px solid #fff;
border-left: 2px solid #fff;
transform: rotate(45deg);
transition: border 0.3s;
}
.btn-arrow-left:hover { opacity: .3; }
.circle-btn-24 {
position: relative;
display: block;
width: 24px;
height: 24px;
border: 1px solid #fff;
border-radius: 50%;
opacity: .5;
transition: all .3s;
}
.circle-btn-24:before {
content: "";
position: absolute;
top: 8px;
left: 7px;
width: 5px;
height: 5px;
border-bottom: 1px solid #fff;
border-left: 1px solid #fff;
transform: rotate(-135deg);
transition: border .3s;
}
.circle-btn-24:hover {
background: #191616;
border-color: #191616;
opacity: 1;
}
.circle-btn-32 {
display: block;
width: 32px;
height: 32px;
background: url(../images/global/circle-btn-32.svg) center center no-repeat;
background-size: contain;
transition: opacity .3s;
}
.circle-btn-32:hover { opacity: .7; }
.circle-btn-48 {
width: 48px;
height: 48px;
background: url(../images/global/circle-btn-48.svg) center center no-repeat;
background-size: contain;
transition: opacity .3s;
}
.circle-btn-48:hover { opacity: .7; }
.link-underline {
color: #fff;
text-decoration: underline;
}
/* */
/* */
input[type=text],
input[type=tel],
input[type=email],
input[type=date],
input[type=url],
textarea,
select {
position: relative;
width: 100%;
padding: 8px 0;
background: transparent;
color: #fff;
border-bottom: 1px solid #8c8a8a;
border-radius: 0;
font-size: 18px;
line-height: 1.5;
}
input[type=text]::placeholder,
input[type=tel]::placeholder,
input[type=email]::placeholder,
input[type=date]::placeholder,
input[type=url]::placeholder,
textarea::placeholder {
color: #8c8a8a;
}
input.error,
textarea.error {
border-color: #f84147;
}
.input-wrapper { position: relative; }
.input-wrapper .error-message {
display: none;
position: absolute;
bottom: -3px;
left: 0;
right: 0;
color: #f84147;
font-size: 10px;
}
.input-wrapper input.error ~ .error-message:not(.error-2, .error-3, .error-4) { display: block; }
.input-wrapper input.error.error-2 ~ .error-message { display: none; }
.input-wrapper input.error.error-2 ~ .error-message.error-2 { display: block; }
.input-wrapper input.error.error-3 ~ .error-message { display: none; }
.input-wrapper input.error.error-3 ~ .error-message.error-3 { display: block; }
.input-wrapper input.error.error-4 ~ .error-message { display: none; }
.input-wrapper input.error.error-4 ~ .error-message.error-4 { display: block; }
.input-wrapper select.error ~ .error-message { display: block; }
.file-wrapper .file-input-btn {
display: inline-flex;
align-items: center;
justify-content: left;
width: 210px;
margin: 0 auto;
padding: 11px 14px;
border: 1px solid #00000052;
border-radius: 20px;
line-height: 16px;
cursor: pointer;
}
.file-wrapper .file-input-btn svg {
flex-shrink: 0;
margin-right: 10px;
}
.file-wrapper .file-input-btn span {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.file-wrapper .file-input-btn * { cursor: pointer; }
.file-wrapper.error .file-input-btn { border-color: #f84147; }
.file-wrapper .error-message {
bottom: 20px;
text-align: center;
}
.file-wrapper.error .error-message:not(.error-2, .error-3, .error-4) { display: block; }
.file-wrapper.error.error-2 .error-message { display: none; }
.file-wrapper.error.error-2 .error-message.error-2 { display: block; }
.file-wrapper.error.error-3 .error-message { display: none; }
.file-wrapper.error.error-3 .error-message.error-3 { display: block; }
.checkbox-label {
display: block;
position: relative;
padding-left: 32px;
line-height: 20px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.checkbox-label input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkbox-label span { cursor: pointer; }
.checkbox-label .checkmark {
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
background-color: #fff;
border: 1px solid #e5e8ed;
border-radius: 3px;
}
.checkbox-label input:checked ~ .checkmark {
background-color: #191616;
border-color: #191616;
}
.checkbox-label .checkmark:after {
content: "";
position: absolute;
display: none;
}
.checkbox-label input:checked ~ .checkmark:after { display: block; }
.checkbox-label .checkmark:after {
top: 3px;
left: 6px;
width: 4px;
height: 8px;
border: solid #fff;
border-width: 0 2px 2px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.checkbox-label .checkbox-name { opacity: .5; }
/* */
/* */
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus { outline: none; }
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before,
.slick-track:after {
display: table;
content: '';
}
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide {
display: none;
float: left;
height: 100%;
min-height: 1px;
}
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden { display: none; }
.slick-slider.reverse .slick-list { transform: rotate(180deg); }
.slick-slider.reverse .slick-slide { transform:rotate(180deg); }
/* */
/* */
.-w-dots .slick-dots {
position: absolute;
bottom: -35px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
.-w-dots .slick-dots li {
position: relative;
display: inline-block;
width: 11px;
height: 20px;
margin: 0 2px;
padding: 0;
cursor: pointer;
}
.-w-dots .slick-dots li button {
font-size: 0;
line-height: 0;
display: block;
width: 11px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.-w-dots .slick-dots li button:before {
font-size: 26px;
line-height: 12px;
position: absolute;
top: 0;
left: 0;
width: 11px;
height: 20px;
content: '•';
text-align: center;
opacity: .3;
color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.-w-dots .slick-dots li.slick-active button:before { opacity: 1; }
@media (max-width: 768px) {
.-w-dots { margin-bottom: 40px; }
}
@media (min-width: 769px) {
.adaptive-var-768 { height: 100% !important; }
}
/* */
/* */
.slider-nav-container {
line-height: .7;
text-align: center;
}
.slider-nav-container .nav { display: inline-block; }
.slider-nav-container .nav-prev { transform: rotate(180deg); }
.slider-nav-container .nav-next { margin-left: 16px; }
.slider-nav-container .nav.disabled {
opacity: .5 !important;
cursor: default;
}
@media (max-width: 768px) {
.slider-nav-container .nav {
width: 40px;
height: 40px;
}
.slider-nav-container .nav-next { margin-left: 12px; }
}
/* */
/* */
.scroll-top-container {
display: none;
position: fixed;
top: 34px;
right: calc((100% - 1200px) / 2);
z-index: 97;
}
body.admin-bar .scroll-top-container { top: 66px; }
.scroll-top-container .scroll-top { transform: scaleY(-1); }
@media (max-width: 1260px) {
.scroll-top-container { right: calc((100% - 960px) / 2); }
}
@media (max-width: 992px) {
.scroll-top-container { display: none; }
}
/* */
/* */
@media (max-width: 768px) {
.back-btn { display: none; }
}
/* */
/* */
.overlay {
display: none;
position: fixed;
inset: 0;
background: #191616;
opacity: .4;
z-index: 98;
}
.popup {
display: none;
position: fixed;
top: 50%;
left: 50%;
max-width: 478px;
width: 478px;
min-width: 290px;
padding: 40px 64px;
background: #fff;
color: #000;
border-radius: 12px;
transform: translate(-50%, -50%);
overflow-y: auto;
z-index: 99;
}
.popup.active { display: block; }
.popup .popup-close {
position: absolute;
top: 10px;
right: 10px;
width: 26px;
height: 26px;
padding: 6px;
cursor: pointer;
}
.popup .popup-close * { cursor: pointer; }
.popup .popup-close svg {
width: 100%;
height: auto;
}
.popup .popup-container { width: 100%; }
.popup .popup-subtitle { padding-top: 16px; }
.popup .popup-content { padding-top: 32px; }
.popup .input-wrapper { padding-bottom: 8px; }
.popup .input-wrapper input,
.popup .input-wrapper select {
color: #000;
font-size: 14px;
}
.popup .input-wrapper input::placeholder { color: #bbb; }
.popup .input-wrapper select {
display: block;
color: #000;
outline: none;
-webkit-appearance: none;
}
.popup .input-wrapper.referrer:before {
content: "";
position: absolute;
top: 15px;
right: 2px;
width: 4px;
height: 4px;
border-bottom: 2px solid #000;
border-left: 2px solid #000;
transform: rotate(-45deg);
transition: transform 0.3s;
}
.popup .file-wrapper {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 24px;
padding-bottom: 32px;
}
.popup .file-wrapper .file-input { display: none; }
.popup .form-submit { width: 100%; }
.popup .cv-form { transition: opacity .3s; }
.popup .cv-form.processing { opacity: .5; }
.popup .cv-form.processing * { cursor: wait; }
.popup .cv-form .input-wrapper.referrer-text { display: none; }
.popup .cv-form .input-wrapper.referrer-text.show { display: block; }
.popup .cv-form.processing .form-submit {
background: transparent;
color: #000;
border-color: #000;
}
@media (max-width: 576px) {
.popup {
width: 95%;
padding: 40px 24px;
}
}
@media (max-height: 730px) {
.popup {
padding-top: 20px !important;
padding-bottom: 20px !important;
}
.popup .file-wrapper {
padding-top: 16px;
padding-bottom: 24px;
}
.file-wrapper .error-message { bottom: 13px; }
}
@media (max-height: 650px) {
.popup .popup-subtitle { padding-top: 8px; }
.popup .input-wrapper { padding-bottom: 6px; }
input[type=text],
input[type=tel],
input[type=email],
input[type=date],
input[type=url],
textarea,
select {
padding: 6px 0;
}
.popup .input-wrapper.referrer:before { top: 13px; }
.input-wrapper .error-message { bottom: -4px; }
.popup .file-wrapper {
padding-top: 8px;
padding-bottom: 16px;
}
.file-wrapper .error-message { bottom: 5px; }
}
/* */
/* */
.vacancy-tag {
display: inline-flex;
align-items: center;
flex-shrink: 0;
padding: 10px;
background: #ecf1f8;
border-radius: 5px;
}
.vacancy-tag .icon-wrapper {
flex-shrink: 0;
margin-right: 6px;
}
.vacancy-tag .icon-wrapper * { display: block; }
.vacancy-tag span { line-height: 1; }
/* */
/* */
.project-logo-wrapper {
padding-left: 15px;
padding-right: 15px;
}
.project-logo-wrapper img {
max-width: 1em;
margin: 0 auto;
}
/* */
/* */
.regular-page .hero .title { padding-top: 80px; }
.regular-page article { padding-top: 100px; }
/* */
/* */
.page-bottom-splashes { position: relative; }
.page-bottom-splashes:before {
content: "";
position: absolute;
top: 20px;
left: 0;
width: 179px;
height: 701px;
background: url(../images/single-vacancy/splash-left.svg) center center no-repeat;
background-size: contain;
}
.page-bottom-splashes:after {
content: "";
position: absolute;
top: 20px;
right: 0;
width: 195px;
height: 701px;
background: url(../images/single-vacancy/splash-right.svg) center center no-repeat;
background-size: contain;
}
@media (max-width: 768px) {
.page-bottom-splashes:before {
width: 87px;
height: 351px;
}
.page-bottom-splashes:after {
width: 100px;
height: 351px;
}
}
/* */
/* */
.tiles-block { padding-top: 180px; }
.tiles-block .title { padding-bottom: 56px; }
.tiles-block .tiles-container {
display: flex;
flex-wrap: wrap;
margin: -16px -8px;
}
.tiles-block .tile {
display: flex;
flex-direction: column;
width: calc((100% - 48px) / 3);
margin: 16px 8px;
background: #231f1f;
border-radius: 10px;
text-align: center;
overflow: hidden;
}
.tiles-block .tile .line {
height: 1px;
background: linear-gradient(92.14deg, #8B08F9 3.49%, #FFAF02 103.44%);
}
.tiles-block .tile .info-wrapper {
display: flex;
flex-direction: column;
height: 100%;
padding: 32px 24px 28px;
}
.tiles-block .tile .name { padding-bottom: 20px; }
.tiles-block .tile .desc { padding-bottom: 24px; }
.tiles-block .tile .more {
display: inline-block;
width: fit-content;
align-self: center;
margin-top: auto;
}
.tiles-block .bottom-btn-wrapper { padding-top: 40px; }
@media (max-width: 768px) {
.tiles-block { padding-top: 80px; }
.tiles-block .title { padding-bottom: 40px; }
.tiles-block .tiles-container { margin: 0 0 40px; }
.tiles-block .tile {
max-width: 389px;
margin: 0 8px;
}
.tiles-block .tile .info-wrapper { padding-top: 38px; }
.tiles-block .tile .name {
padding-bottom: 24px;
font-size: 20px !important;
}
.tiles-block .tile .desc { padding-bottom: 40px; }
.tiles-block .bottom-btn-wrapper { display: none; }
}
@media (max-width: 576px) {
.tiles-block .tile { width: calc(100vw - 47px); }
}
/* */
/* */
.vacancy-cat-subscription-block { padding-top: 195px; }
.vacancy-cat-subscription-block .title {
max-width: 600px;
margin: 0 auto;
}
.vacancy-cat-subscription-block .form-container {
max-width: 430px;
margin: 40px auto 0;
}
.vacancy-cat-subscription-block .form-container form { display: flex; }
.vacancy-cat-subscription-block .input-wrapper {
width: 100%;
margin-right: 16px;
}
.vacancy-cat-subscription-block .input-wrapper .error-message {
bottom: -13px;
text-align: left;
}
.vacancy-cat-subscription-block .disclaimer { padding-top: 20px; }
.vacancy-cat-subscription-block .disclaimer a {
color: inherit;
text-decoration: underline;
}
@media (max-width: 768px) {
.vacancy-cat-subscription-block { padding-top: 100px !important; }
.vacancy-cat-subscription-block .subscription-container { max-width: 450px; }
.vacancy-cat-subscription-block .title { font-size: 20px; }
.vacancy-cat-subscription-block .form-container { margin-top: 32px; }
}
@media (max-width: 576px) {
.vacancy-cat-subscription-block .subscription-container { max-width: 330px; }
.vacancy-cat-subscription-block .form-container form { display: block; }
.vacancy-cat-subscription-block .input-wrapper {
margin-right: 0;
padding-bottom: 32px;
}
.vacancy-cat-subscription-block .input-wrapper .error-message { bottom: 20px; }
}
/* */
/* */
.learning-and-caring-block {
padding-top: 190px;
padding-bottom: 35px;
}
.learning-and-caring-block .block-container {
display: flex;
justify-content: space-between;
}
.learning-and-caring-block .title {
max-width: 240px;
width: 100%;
}
.learning-and-caring-block .img-wrapper { position: absolute; }
.learning-and-caring-block .img-wrapper.top {
max-width: 144px;
top: -49px;
left: 245px;
}
.learning-and-caring-block .img-wrapper.bottom{
max-width: 211px;
top: 81px;
left: -42px;
}
.learning-and-caring-block .list-container {
display: flex;
flex-wrap: wrap;
max-width: 802px;
width: 100%;
margin: -8px;
list-style: none;
}
.learning-and-caring-block .item {
width: calc(50% - 16px);
flex-shrink: 0;
margin: 8px;
padding: 16px;
background: #231f1f;
border-radius: 10px;
}
.learning-and-caring-block .item .desc { padding-top: 16px; }
@media (max-width: 1260px) {
.learning-and-caring-block .img-wrapper.top { left: 225px; }
.learning-and-caring-block .list-container { max-width: 602px; }
}
@media (max-width: 992px) {
.learning-and-caring-block .block-container { display: block; }
.learning-and-caring-block .title {
margin: 0 auto;
text-align: center;
}
.learning-and-caring-block .img-wrapper.top {
left: -9px;
top: 60px;
max-width: 77px;
transform: rotate(10deg);
}
.learning-and-caring-block .img-wrapper.bottom {
top: unset;
left: unset;
right: -19px;
bottom: -55px;
max-width: 114px;
transform: scaleX(-1);
}
.learning-and-caring-block .list-container {
max-width: unset;
width: unset;
padding-top: 26px;
}
}
@media (max-width: 768px) {
.learning-and-caring-block {
padding-top: 90px;
padding-bottom: 40px;
}
.learning-and-caring-block .title {
max-width: 220px;
font-size: 24px;
}
.learning-and-caring-block .img-wrapper.top { top: 45px; }
.learning-and-caring-block .img-wrapper.bottom {
bottom: -60px;
right: -5px;
}
.learning-and-caring-block .item .name { font-size: 15px; }
.learning-and-caring-block .item .desc { font-size: 12px; }
}
@media (max-width: 576px) {
.learning-and-caring-block .img-wrapper.top { left: 8px; }
.learning-and-caring-block .img-wrapper.bottom { right: 0; }
.learning-and-caring-block .list-container { margin: 0; }
.learning-and-caring-block .item {
width: 100%;
margin: 5px 0;
}
}
/* */
/* */
.intern-banner-block {
padding-top: 140px;
padding-bottom: 100px;
}
.intern-banner-block .banner-container {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
padding: 45px 85px 45px 100px;
background: linear-gradient(92.14deg, #8B08F8 3.49%, #F15934 71.79%, #FFAF02 103.44%);
border-radius: 16px;
}
.intern-banner-block .desc-wrapper {
max-width: 400px;
width: 100%;
}
.intern-banner-block .desc-wrapper .title { line-height: 0.85; }
.intern-banner-block .desc-wrapper .desc { padding-top: 24px; }
.intern-banner-block .img-wrapper {
position: absolute;
top: 50%;
left: 560px;
max-width: 361px;
transform: translateY(-50%);
}
@media (max-width: 1260px) {
.intern-banner-block { padding-bottom: 70px; }
.intern-banner-block .banner-container { padding: 45px 85px 45px 30px; }
.intern-banner-block .img-wrapper {
left: 430px;
max-width: 300px;
}
}
@media (max-width: 992px) {
.intern-banner-block .banner-container {
display: block;
padding: 24px;
}
.intern-banner-block .img-wrapper {
left: unset;
right: 10px;
}
.intern-banner-block .btn-wrapper { padding-top: 40px; }
}
@media (max-width: 768px) {
.intern-banner-block {
padding-top: 40px;
padding-bottom: 110px;
}
.intern-banner-block.-has-image .banner-container { padding-bottom: 115px; }
.intern-banner-block .desc-wrapper .title { font-size: 24px; }
.intern-banner-block .img-wrapper {
top: unset;
bottom: -110px;
right: 50px;
max-width: 265px;
transform: none;
}
}
@media (max-width: 576px) {
.intern-banner-block .img-wrapper {
right: 0;
margin-left: 70px;
}
}
/* */
/* */
.opensource-block { padding-top: 130px; }
.opensource-block .block-container {
display: flex;
flex-wrap: wrap;
margin: -8px;
}
.opensource-block .title {
max-width: 240px;
width: 100%;
}
.opensource-block .item {
display: block;
width: calc(25% - 16px);
flex-shrink: 0;
margin: 8px;
padding: 20px;
background: #231f1f;
color: #fff;
border-radius: 10px;
transition: background-color .3s;
cursor: pointer;
}
.opensource-block .item.title-item {
padding: 0;
background: none;
cursor: default;
}
.opensource-block .item:not(.title-item) * { cursor: pointer; }
.opensource-block .item .name {
color: #fff;
cursor: pointer;
transition: color .3s;
}
.opensource-block .item .desc {
padding-top: 20px;
color: #fff;
cursor: pointer;
transition: color .3s;
}
.opensource-block .item .btn-wrapper { padding-top: 20px; }
.opensource-block .item:not(.title-item):hover { background: #fff; }
.opensource-block .item:not(.title-item):hover .name { color: #191616; }
.opensource-block .item:not(.title-item):hover .desc { color: #191616; }
.opensource-block .item:not(.title-item):hover .btn-wrapper .circle-btn-24 {
background: #191616;
border-color: #191616;
opacity: 1;
}
@media (max-width: 768px) {
.opensource-block { padding-top: 80px; }
.opensource-block .title {
max-width: 180px;
font-size: 24px;
}
.opensource-block .item {
display: flex;
flex-direction: column;
min-height: 135px;
width: calc(50% - 16px);
padding: 12px;
}
.opensource-block .item .desc { padding-top: 16px; }
.opensource-block .item .btn-wrapper {
margin-top: auto;
padding-top: 16px;
}
}
@media (max-width: 576px) {
.opensource-block .item { min-height: 151px; }
}
@media (max-width: 350px) {
.opensource-block .title { font-size: 20px; }
}
/* */
/* */
.photo-sliders-block { padding-top: 150px; }
.photo-sliders-block .title { padding-bottom: 56px; }
.photo-sliders-block .photo-slider .slide-wrapper {
width: 389px;
height: 240px;
margin: 0 16px;
border-radius: 10px;
overflow: hidden;
}
.photo-sliders-block .bottom-slider { padding-top: 32px; }
.photo-sliders-block .btn-wrapper { padding-top: 40px; }
@media (max-width: 992px) {
.photo-sliders-block .photo-slider .slide-wrapper { width: 240px; }
.photo-sliders-block .photo-slider .slide-wrapper img {
width: auto;
height: 240px;
transform: translateX(-74px);
}
}
@media (max-width: 768px) {
.photo-sliders-block { padding-top: 100px; }
}
@media (max-width: 576px) {
.photo-sliders-block .title { padding-bottom: 32px; }
.photo-sliders-block .title .highlight-rainbow {
display: table;
margin: 0 auto;
}
.photo-sliders-block .photo-slider .slide-wrapper {
width: 162px;
height: 162px;
margin: 0 8px;
}
.photo-sliders-block .photo-slider .slide-wrapper img {
height: 162px;
transform: translateX(-51px);
}
.photo-sliders-block .bottom-slider { padding-top: 16px; }
.photo-sliders-block .btn-wrapper { padding-top: 32px; }
}
/* */
/* */
.volunteer-block .block-title-container {
position: relative;
margin-top: 60px;
}
.volunteer-block .block-title-container .img-wrapper {
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -50%);
}
.volunteer-block .block-container {
display: flex;
padding-top: 100px;
padding-bottom: 100px;
}
.volunteer-block .block-container.-has-block-title { padding-top: 80px; }
.volunteer-block .block-container.-reverse { flex-direction: row-reverse; }
.volunteer-block .block-container.-add-dashes { border-bottom: 2px dashed #302d2d; }
.volunteer-block .block-container .desc-container {
display: flex;
flex-direction: column;
width: 50%;
}
.volunteer-block .block-container:not(.-reverse) .desc-container { padding-right: 9px; }
.volunteer-block .block-container.-reverse .desc-container { padding-left: 9px; }
.volunteer-block .block-container .general-desc {
position: relative;
display: inline-block;
width: fit-content;
margin-bottom: 24px;
padding: 8px 15px;
background: #191616;
background-clip: padding-box;
border: 1px solid transparent;
border-radius: 70px;
line-height: 1.5;
}
.volunteer-block .block-container .general-desc:before {
content: "";
position: absolute;
inset: 0;
margin: -1px;
background: linear-gradient(92.25deg, #8B08F8 4.54%, #F15934 113.62%);
border-radius: inherit;
z-index: -1;
}
.volunteer-block .block-container .title { margin-bottom: 32px; }
.volunteer-block .block-container .links-container {
margin-top: auto;
padding-top: 32px;
}
.volunteer-block .block-container .links-container .link-underline { margin-right: 40px; }
.volunteer-block .block-container .images-container {
position: relative;
width: 50%;
}
.volunteer-block .block-container:not(.-reverse) .images-container { padding-left: 9px; }
.volunteer-block .block-container.-reverse .images-container { padding-right: 9px; }
.volunteer-block .images-container .images-wrapper { margin: 0 -8px; }
.volunteer-block .images-container .image {
max-width: 591px;
margin: 0 8px;
border-radius: 12px;
overflow: hidden;
}
.volunteer-block .images-container .img-wrapper {
position: absolute;
top: -66px;
}
.volunteer-block .block-container:not(.-reverse) .images-container .img-wrapper.pos-left { left: -50px; }
.volunteer-block .block-container.-reverse .images-container .img-wrapper.pos-left { left: -20px; }
.volunteer-block .images-container .img-wrapper.pos-center {
left: 50%;
transform: translateX(-50%);
}
.volunteer-block .images-container .img-wrapper.pos-right { right: -20px; }
@media (max-width: 992px) {
.volunteer-block .block-container { flex-direction: column !important; }
.volunteer-block .block-container .desc-container,
.volunteer-block .block-container .images-container {
width: 100%;
padding: 0 !important;
}
.volunteer-block .block-container .images-container { margin-top: 32px; }
.volunteer-block .images-container .images-wrapper { margin: 0; }
.volunteer-block .images-container .images-wrapper.single-image .image { margin: 0 auto; }
.volunteer-block .block-container:not(.-reverse) .images-container .img-wrapper.pos-left,
.volunteer-block .block-container.-reverse .images-container .img-wrapper.pos-left,
.volunteer-block .images-container .img-wrapper.pos-center,
.volunteer-block .images-container .img-wrapper.pos-right {
left: unset;
right: calc(((100% - 960px) / 2) + 160px);
transform: rotate(12deg);
}
}
@media (max-width: 768px) {
.volunteer-block .block-title-container { margin-top: 80px; }
.volunteer-block .block-container,
.volunteer-block .block-container.-has-block-title {
padding-top: 48px;
padding-bottom: 80px;
overflow: hidden;
}
.volunteer-block .block-container .general-desc {
padding: 9px 11px;
line-height: 1;
}
.volunteer-block .block-container .title { margin-bottom: 16px; }
.volunteer-block .block-container .links-container { padding-top: 24px; }
.volunteer-block .block-container .links-container .link-underline { margin-right: 16px; }
.volunteer-block .images-container .image { max-width: 540px; }
.volunteer-block .block-container:not(.-reverse) .images-container .img-wrapper.pos-left,
.volunteer-block .block-container.-reverse .images-container .img-wrapper.pos-left,
.volunteer-block .images-container .img-wrapper.pos-center,
.volunteer-block .images-container .img-wrapper.pos-right {
top: -30px;
right: calc(((100% - 540px) / 2) - 15px);
max-width: 71px;
}
}
@media (max-width: 576px) {
.volunteer-block .block-container .desc-container {
padding-left: 15px !important;
padding-right: 15px !important;
}
.volunteer-block .images-container .image { margin: 0 4px; }
.volunteer-block .images-container .images-wrapper.single-image .image { margin: 0 13px; }
.volunteer-block .block-container:not(.-reverse) .images-container .img-wrapper.pos-left,
.volunteer-block .block-container.-reverse .images-container .img-wrapper.pos-left,
.volunteer-block .images-container .img-wrapper.pos-center,
.volunteer-block .images-container .img-wrapper.pos-right {
right: 0;
}
}
@media (max-width: 350px) {
.volunteer-block .block-title { font-size: 42px; }
}
/* */
/* */
.single-slide-block { padding-top: 50px; }
.single-slide-block .title { line-height: 1; }
.single-slide-block .slides-container {
position: relative;
padding-top: 56px;
}
.single-slide-block .slide-wrapper {
position: relative;
max-width: 1097px;
margin: 0 8px;
border-radius: 12px;
overflow: hidden;
}
.single-slide-block .slides-container .slick-track { margin-left: calc((100% - 1200px) / 2); }
.single-slide-block .slide-wrapper.has-label { border-bottom-right-radius: 6px; }
.single-slide-block .slide-wrapper .label {
position: absolute;
display: block;
bottom: 0;
right: 0;
padding: 7px 12px;
color: #191616;
background: #fff;
border-radius: 6px;
}
.single-slide-block .icon-bl-wrapper {
position: absolute;
bottom: -70px;
left: 0;
}
.single-slide-block .icon-tr-wrapper {
position: absolute;
top: -55px;
right: 0;
}
.single-slide-block .slider-nav-container { padding-top: 40px; }
@media (max-width: 1260px) {
.single-slide-block .slides-container .slick-track { margin-left: calc((100% - 960px) / 2); }
.single-slide-block .slide-wrapper { max-width: 900px; }
}
@media (max-width: 992px) {
.single-slide-block .slides-container .slick-track { margin-left: 0; }
.single-slide-block .slide-wrapper { max-width: 591px; }
.single-slide-block .slide-wrapper .label {
padding: 9px 12px;
line-height: 1;
}
}
@media (max-width: 768px) {
.single-slide-block { padding-top: 30px; }
.single-slide-block .slides-container { padding-top: 40px; }
.single-slide-block .slide-wrapper { max-width: 540px; }
.single-slide-block .icon-bl-wrapper {
max-width: 65px;
bottom: -25px;
}
.single-slide-block .icon-tr-wrapper {
max-width: 71px;
top: -15px;
}
.single-slide-block .slider-nav-container { display: none; }
}
@media (max-width: 576px) {
.single-slide-block .slide-wrapper { margin: 0 4px; }
.single-slide-block .slide-wrapper .label { padding: 8px 10px; }
}
@media (max-width: 340px) {
.single-slide-block .title { font-size: 42px; }
}
/* */
/* */
header { flex-shrink: 0; }
header .container { z-index: 2; }
header:before {
content: "";
position: absolute;
top: 300px;
left: 0;
width: 151px;
height: 501px;
background: url(../images/global/splash-left.svg) center center no-repeat;
background-size: contain;
z-index: -1;
}
header:after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 299px;
height: 280px;
background: url(../images/global/splash-right.svg) center center no-repeat;
background-size: contain;
z-index: -1;
}
header .header-container {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 24px;
}
header .header-logo {
display: block;
flex-shrink: 0;
max-width: 48px;
}
header .header-menu ul { list-style: none; }
header .header-menu ul li {
display: inline-block;
padding: 4px 16px 14px;
}
header .header-menu ul li a {
position: relative;
display: inline-block;
padding: 10px;
color: #fff;
line-height: 1;
opacity: .5;
transition: opacity .3s;
}
header .header-menu ul li.current-menu-item > a,
header .header-menu ul li.current-menu-parent > a {
opacity: 1;
}
header .header-menu ul li.current-menu-item > a:after,
header .header-menu ul li.current-menu-parent > a:after {
content: "";
position: absolute;
bottom: 2px;
left: 50%;
width: 16px;
height: 2px;
background: #fff;
border-radius: 18px;
transform: translateX(-50%);
}
header .header-menu ul li a:hover { opacity: 1; }
header .header-menu ul li.menu-item-has-children { position: relative; }
header .header-menu ul li.menu-item-has-children > a:before {
content: "";
position: absolute;
top: 15px;
right: -10px;
width: 4px;
height: 4px;
border-bottom: 2px solid #fff;
border-left: 2px solid #fff;
transform: rotate(-45deg);
transition: transform 0.3s;
}
header .header-menu ul li.menu-item-has-children.expand-sub-menu > a:before { transform: rotate(135deg); }
header .header-menu ul li .sub-menu {
display: none;
position: absolute;
top: 50px;
left: -10px;
width: 200px;
padding: 16px;
border: 1px solid #8c8b8b;
border-radius: 8px;
background: #191616;
box-shadow: 0 4px 19px 0 #293B5629;
}
header .header-menu ul li .sub-menu li {
display: block;
padding: 4px 10px;
}
header .header-menu .mobile-socials {
display: none;
padding-top: 50px;
}
header .header-menu .mobile-socials .social {
padding: 10px;
color: #fff;
}
header .header-menu .mobile-socials .social:not(:last-child) { margin-right: 12px; }
header .header-menu-collapse {
display: none;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
cursor: w-resize;
z-index: 8;
}
body.mobile-menu header .header-menu-collapse { display: block; }
header .header-btn-placeholder {
display: block;
width: 32px;
height: 32px;
}
body.disable-scroll { overflow: hidden; }
header .mobile-nav {
display: none;
position: relative;
padding: 8px;
cursor: pointer;
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
z-index: 2;
}
header .mobile-nav .nav-icon {
width: 22px;
height: 16px;
margin-left: auto;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-o-transform: rotate(0);
transform: rotate(0);
cursor: pointer;
}
header .mobile-nav .nav-icon span {
display: block;
position: absolute;
height: 2px;
width: 100%;
background: #fff;
border-radius: 2px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-o-transform: rotate(0);
transform: rotate(0);
cursor: pointer;
}
header .mobile-nav .nav-icon span:nth-child(1) { top: 0; }
header .mobile-nav .nav-icon span:nth-child(2) { top: 7px; }
header .mobile-nav .nav-icon span:nth-child(3) { top: 14px; }
header .mobile-nav.close {
position: absolute;
top: 32px;
right: 16px;
}
header .mobile-nav.close .nav-icon span:nth-child(1) {
top: 7px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
header .mobile-nav.close .nav-icon span:nth-child(2) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
header .header-buttons a:not(:first-child) { margin-left: 12px; }
@media (max-width: 992px) {
header .header-menu {
position: fixed;
top: 0;
right: -391px;
width: 391px;
height: 100%;
padding: 55px 14px;
background: url(../images/global/mobile-menu.png) center center no-repeat;
background-size: cover;
transition: right .3s;
overflow: auto;
z-index: 999;
}
body.mobile-menu main { z-index: -1; }
body.mobile-menu header .header-menu { right: 0; }
body.admin-bar header .header-menu {
top: 32px;
height: calc(100% - 32px);
}
header .header-menu ul li {
display: block;
padding: 10px 0;
}
header .header-menu ul li a {
font-size: 20px;
line-height: 1.2;
opacity: 1;
}
header .header-menu ul li.menu-item-has-children > a:before { top: 20px; }
header .header-menu ul li .sub-menu {
position: static;
top: 0;
left: 0;
width: unset;
padding: 0;
background: none;
border: none;
box-shadow: none;
}
header .header-menu ul li .sub-menu li { padding: 0 30px; }
header .header-menu .mobile-socials { display: block; }
header .header-btn-placeholder { display: none; }
header .mobile-nav.open,
header .mobile-nav.close {
display: block;
}
}
@media (max-width: 576px) {
header .header-menu {
right: -291px;
width: 291px;
}
}
@media (max-width: 782px) {
body.admin-bar header .header-menu {
top: 46px;
height: calc(100% - 46px);
}
}
/* */
/* */
footer {
position: relative;
padding-top: 100px;
padding-bottom: 32px;
}
footer .footer-container {
display: flex;
padding: 24px;
background: #231f1f;
border-radius: 10px;
}
footer .footer-logo {
width: 48px;
flex-shrink: 0;
margin-right: 32px;
}
footer .footer-block { max-width: 186px; }
footer .footer-block p:not(:first-child) { margin-top: 8px; }
footer .footer-block a {
color: #fff;
text-decoration: underline;
}
footer .address { margin-right: 220px; }
footer .socials {
margin-left: auto;
padding-right: 26px;
}
footer .socials .socials-container {
display: flex;
padding-top: 16px;
}
footer .socials a { display: block; }
footer .socials a:not(:last-child) { margin-right: 12px; }
footer .socials svg { display: block; }
footer .copyright { padding-top: 12px; }
@media (max-width: 1260px) {
footer .address { margin-right: auto; }
}
@media (max-width: 768px) {
footer { padding-top: 80px; }
footer .footer-container {
flex-direction: column;
padding: 24px 24px 24px 100px;
}
footer .footer-logo {
position: absolute;
top: 24px;
left: 24px;
margin: 0;
}
footer .footer-block {
max-width: unset;
margin-bottom: 48px;
margin-right: 0;
}
footer .socials {
margin: 0;
padding: 0;
}
footer .copyright {
padding-left: 100px;
padding-right: 16px;
text-align: left;
}
}
/* */
/* */
.front-page {
position: relative;
z-index: 1;
}
.front-page .about-block {
position: relative;
padding-top: 8px;
}
.front-page .about-block .title-container {
position: absolute;
top: 0;
left: 0;
right: 0;
}
.front-page .about-block .title {
position: relative;
display: flex;
align-items: end;
justify-content: space-between;
padding-top: 100px;
z-index: 4;
}
.front-page .about-block .subtitle {
position: relative;
max-width: 359px;
width: 100%;
margin-left: auto;
padding-top: 24px;
z-index: 4;
}
.front-page .about-block .logo-scroll-track {
position: relative;
max-width: 457px;
width: 100%;
height: 930px;
left: 411px;
z-index: 4;
}
.front-page .about-block .logo-wrapper {
position: sticky;
top: 80px;
transform-origin: 177px bottom;
opacity: 0;
transition: opacity 2s;
}
.front-page .about-block .logo-wrapper.ready { opacity: 1; }
body.admin-bar .front-page .about-block .logo-wrapper { top: 116px; }
.front-page .about-block .splash-wrapper {
position: absolute;
top: 130px;
left: 0;
width: 407px;
height: 342px;
background: url(../images/front-page/hero-splash.svg) center center no-repeat;
background-size: contain;
}
.front-page .about-block .projects-container {
position: absolute;
inset: 0;
overflow: hidden;
z-index: 5;
}
.front-page .about-block .projects-container .projects-list {
position: relative;
display: flex;
top: 525px;
margin-left: -10px;
margin-right: -10px;
padding: 6px 0;
background: linear-gradient(90.81deg, #1960FF -0.95%, #8B08F8 42.44%, #8B08F8 56.24%, #F15934 78.43%, #FFAF02 90.06%, #00B843 97.66%);
transform: rotate(-5deg);
list-style: none;
opacity: 0;
transition: opacity .8s 1s;
}
.front-page .about-block .projects-container .projects-list.show { opacity: 1; }
.front-page .about-block .projects-container .projects-list li .img-wrapper {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
height: 49px;
margin: 0 35px;
}
.front-page .about-block .projects-container .projects-list li.narrow .img-wrapper { width: 60px; }
.front-page .about-block .projects-container .projects-list li.wide .img-wrapper { width: 120px; }
.front-page .about-block .projects-container .projects-list li img {
max-height: 100%;
height: initial;
width: auto;
opacity: .75;
}
.front-page .about-block .desc {
max-width: 996px;
padding-top: 5px;
}
@media (max-width: 1260px) {
.front-page .about-block .subtitle { max-width: 259px; }
.front-page .about-block .subtitle br { display: none; }
.front-page .about-block .logo-wrapper { transform-origin: 167px bottom; }
.front-page .about-block .logo-scroll-track {
max-width: 430px;
left: 302px;
}
}
@media (max-width: 992px) {
.front-page .about-block .title {
display: block;
padding-top: 14px;
text-align: center;
}
.front-page .about-block .title span br { display: none; }
.front-page .about-block .subtitle {
position: absolute;
top: 370px;
left: 50%;
max-width: 500px;
transform: translateX(-50%);
text-align: center;
}
.front-page .about-block .subtitle br { display: block; }
.front-page .about-block .logo-scroll-track {
max-width: 340px;
left: unset;
height: 680px;
margin-left: auto;
margin-right: auto;
padding-top: 60px;
}
.front-page .about-block .logo-wrapper {
top: 140px;
transform-origin: 169px bottom;
}
body.admin-bar .front-page .about-block .logo-wrapper { top: 172px; }
.front-page .about-block .splash-wrapper { width: calc(100% - 23px); }
.front-page .about-block .projects-container .projects-list { top: 480px; }
.front-page .about-block .projects-container .projects-list li .img-wrapper {
height: 40px;
margin: 0 25px;
padding: 5px 0;
}
}
@media (max-width: 768px) {
.front-page .about-block .subtitle { top: 390px; }
.front-page .about-block .logo-scroll-track { padding-top: 80px; }
.front-page .about-block .logo-wrapper {
top: 160px;
transform-origin: 170px bottom;
}
body.admin-bar .front-page .about-block .logo-wrapper { top: 205px; }
.front-page .about-block .projects-container .projects-list { top: 500px; }
}
@media (max-width: 576px) {
.front-page .about-block .title span,
.front-page .about-block .title span br {
display: block;
}
.front-page .about-block .subtitle { top: 430px; }
.front-page .about-block .logo-scroll-track {
height: 740px;
padding-top: 120px;
}
.front-page .about-block .logo-wrapper {
top: 200px;
transform-origin: 49.9% bottom;
}
body.admin-bar .front-page .about-block .logo-wrapper { top: 245px; }
.front-page .about-block .projects-container .projects-list { top: 545px; }
.front-page .about-block .desc br { display: none; }
}
/* */
/* */
.front-page .projects-block { padding-top: 200px; }
.front-page .projects-block .projects-container { display: flex; }
.front-page .projects-block .tabs-switch {
flex-shrink: 0;
max-width: 389px;
min-width: 290px;
width: 35%;
margin-right: 16px;
}
.front-page .projects-block .tabs-switch .tab-switch {
position: relative;
padding: 10px 0;
border-bottom: 1px solid #fff;
opacity: .2;
transition: opacity .3s;
cursor: pointer;
}
.front-page .projects-block .tabs-switch .tab-switch:hover { opacity: 1; }
.front-page .projects-block .tabs-switch .tab-switch.active { opacity: 1; }
.front-page .projects-block .tabs-switch .tab-switch.active:after {
content: "";
position: absolute;
top: 37px;
right: 2px;
width: 8px;
height: 8px;
border-bottom: 3px solid #fff;
border-left: 3px solid #fff;
transform: rotate(-135deg);
transition: border 0.3s;
}
.front-page .projects-block .tabs-container {
position: relative;
width: 100%;
min-height: 526px;
}
.front-page .projects-block .tabs-container .tab {
position: absolute;
display: none;
inset: 0;
width: 100%;
padding: 40px 100px;
border-radius: 12px;
text-align: center;
}
.front-page .projects-block .tabs-container .tab.active { display: block; }
.front-page .projects-block .tabs-container .tab .project-container {
display: flex;
flex-direction: column;
justify-content: flex-end;
height: 100%;
}
.front-page .projects-block .tabs-container .tab .project-logo-wrapper { margin: 0 auto; }
.front-page .projects-block .tabs-container .tab .desc { padding-top: 32px; }
.front-page .projects-block .tabs-container .tab .links-container {
display: flex;
justify-content: center;
margin-top: 32px;
}
.front-page .projects-block .tabs-container .tab .links-container .btn { margin: 0 8px; }
.front-page .projects-block .tabs-container .tab .nav-container {
display: flex;
justify-content: center;
padding-top: 72px;
}
.front-page .projects-block .tabs-container .tab .nav-container .nav { margin: 0 8px; }
.front-page .projects-block .tabs-container .tab .nav-container .nav.disabled {
opacity: .5 !important;
cursor: default;
}
.front-page .projects-block .tabs-container .tab .nav-container .nav-prev { transform: rotate(180deg); }
@media (max-width: 1260px) {
.front-page .projects-block .tabs-container .tab { padding: 40px; }
}
@media (max-width: 992px) {
.front-page .projects-block .tabs-switch .tab-switch.active:after { top: 27px; }
.front-page .projects-block .tabs-container .tab { padding: 16px; }
.front-page .projects-block .tabs-container .tab .desc { padding-top: 20px; }
}
@media (max-width: 768px) {
.front-page .projects-block { padding-top: 70px; }
.front-page .projects-block .tabs-switch { display: none; }
.front-page .projects-block .tabs-container { min-height: unset; }
.front-page .projects-block .tabs-container .tab {
position: relative;
display: block;
margin: 0 12px;
padding: 40px;
text-align: left;
}
.front-page .projects-block .tabs-container .tab .project-container {
display: block;
margin-bottom: 82px;
}
.front-page .projects-block .tabs-container .tab .project-logo-wrapper { margin: 0; }
.front-page .projects-block .tabs-container .tab .links-container {
position: absolute;
bottom: 40px;
left: 12px;
right: 12px;
margin-top: 0;
}
.front-page .projects-block .tabs-container .tab .nav-container { display: none; }
}
@media (max-width: 576px) {
.front-page .projects-block .tabs-container .tab {
margin: 6px;
padding: 16px;
}
.front-page .projects-block .tabs-container .tab .project-logo-wrapper {
max-width: unset !important;
height: 24px;
padding: 0;
}
.front-page .projects-block .tabs-container .tab .project-logo-wrapper img {
height: 100%;
width: auto;
margin: 0;
}
.front-page .projects-block .tabs-container .tab .links-container { bottom: 16px; }
.front-page .projects-block .tabs-container .tab .links-container .btn {
margin: 0 4px;
padding: 11px 10px !important;
font-size: 12px;
}
.front-page .projects-block .tabs-container .tab .links-container .btn-wrapper {
bottom: 16px;
right: 16px;
}
}
/* */
/* */
.front-page .our-values-block {
position: relative;
margin-top: 270px;
padding-top: 90px;
}
.front-page .our-values-block:before {
content: "";
position: absolute;
top: 90px;
left: 0;
right: 0;
height: 200px;
background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(25,22,22,1) 90%);
z-index: 1;
}
.front-page .our-values-block .background-container {
position: relative;
min-height: calc((100vw - 17px) * 1.2636);
max-width: 2401px;
width: 100%;
margin: 0 auto;
background: #fff;
}
.front-page .our-values-block .container {
position: absolute;
inset: 0;
z-index: 2;
}
.front-page .our-values-block .inner-block {
display: flex;
max-width: 971px;
margin: calc((100vw - 17px)* 0.43 + 110px) auto 0;
padding: 36px 32px;
background: #191616;
border: 1px solid #fff;
border-radius: 12px;
}
.front-page .our-values-block .inner-block .l-col {
display: flex;
flex-direction: column;
width: 50%;
padding-right: 42px;
}
.front-page .our-values-block .inner-block .btn-wrapper {
margin-top: auto;
padding-top: 20px;
}
.front-page .our-values-block .inner-block .r-col { width: 50%; }
.front-page .our-values-block .inner-block .sm-block { padding-bottom: 48px; }
.front-page .our-values-block .inner-block .sm-block:last-child { padding-bottom: 0; }
.front-page .our-values-block .inner-block .sm-block .desc { padding-top: 12px; }
@media (min-width: 2400px) {
.front-page .our-values-block .background-container:before,
.front-page .our-values-block .background-container:after {
content: "";
position: absolute;
top: 0;
bottom: 0;
width: 400px;
z-index: 1;
}
.front-page .our-values-block .background-container:before {
left: 0;
background: linear-gradient(270deg, rgba(0,0,0,0) 0%, rgba(25,22,22,1) 90%);
}
.front-page .our-values-block .background-container:after {
right: 0;
background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(25,22,22,1) 90%);
}
}
@media (max-width: 992px) {
.front-page .our-values-block .inner-block { margin-top: calc((100vw - 17px)* 0.43) }
}
@media (max-width: 768px) {
.front-page .our-values-block { margin-top: 80px; }
.front-page .our-values-block:before { height: 100px; }
.front-page .our-values-block .background-container { opacity: .2 }
.front-page .our-values-block .inner-block {
display: block;
margin-top: 32px;
padding: 0;
background: none;
border: none;
border-radius: 0;
}
.front-page .our-values-block .inner-block .l-col,
.front-page .our-values-block .inner-block .r-col {
display: block;
width: 100%;
padding: 0;
}
.front-page .our-values-block .inner-block .inner-title {
max-width: 330px;
margin: 0 auto;
text-align: center;
}
.front-page .our-values-block .inner-block .btn-wrapper {
position: absolute;
bottom: 55px;
left: 0;
width: 100%;
margin-top: 0;
padding-top: 0;
text-align: center;
}
.front-page .our-values-block .inner-block .r-col { padding-top: calc((100vw - 17px)* 0.43 - 50px); }
.front-page .our-values-block .inner-block .sm-block {
position: relative;
margin: 0 auto;
padding: 16px !important;
max-width: 343px;
background: #231f1f;
border: 1px solid #fff;
border-radius: 10px;
}
.front-page .our-values-block .inner-block .sm-block:nth-child(odd) { transform: rotate(1.79deg); }
.front-page .our-values-block .inner-block .sm-block:nth-child(even) { transform: rotate(-1.11deg); }
.front-page .our-values-block .inner-block .sm-block:not(:last-child) {
margin-bottom: -24px;
padding-bottom: 40px !important;
}
}
@media (max-width: 576px) {
.front-page .our-values-block { overflow-x: hidden; }
.front-page .our-values-block .background-container {
position: relative;
left: 50%;
min-width: 430px;
transform: translateX(-50%);
}
.front-page .our-values-block .inner-block .r-col { padding-top: calc((100vw - 17px)* 0.43 - 100px); }
}
@media (max-width: 430px) {
.front-page .our-values-block .inner-block .r-col { padding-top: calc((100vw - 17px)* 0.43 - 115px); }
}
/* */
/* */
.front-page .video-block { padding-top: 180px; }
.front-page .video-block .video-container {
position: relative;
padding-bottom: 59.167%; /* 56.25% for 16:9, for 1:1 = 100% */
border-radius: 10px;
overflow: hidden;
}
.front-page .video-block video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.front-page .video-block .preview-wrapper {
position: absolute;
inset: 0;
}
.front-page .video-block .preview-wrapper * { cursor: pointer; }
.front-page .video-block .preview-wrapper .play-btn {
position: absolute;
top: 50%;
left: 50%;
width: 145px;
height: 145px;
transform: translate(-50%, -50%);
}
@media (max-width: 992px) {
.front-page .video-block .preview-wrapper .play-btn {
width: 110px;
height: 110px;
}
}
@media (max-width: 768px) {
.front-page .video-block { padding-top: 80px; }
.front-page .video-block .preview-wrapper .play-btn {
width: 80px;
height: 80px;
}
}
@media (max-width: 576px) {
.front-page .video-block .preview-wrapper .play-btn {
width: 60px;
height: 60px;
}
}
/* */
/* */
.front-page .career-block { padding-top: 220px; }
.front-page .career-block .career-container {
display: flex;
align-items: center;
}
.front-page .career-block .desc-wrapper {
flex-shrink: 0;
width: 42%;
}
.front-page .career-block .title { line-height: 72px; }
.front-page .career-block .subtitle { padding-top: 28px; }
.front-page .career-block .btn-wrapper { padding-top: 48px; }
.front-page .career-block .img-wrapper {
max-width: 660px;
margin-left: auto;
}
@media (max-width: 992px) {
.front-page .career-block .desc-wrapper { width: 370px; }
}
@media (max-width: 768px) {
.front-page .career-block { padding-top: 80px; }
.front-page .career-block .career-container {
position: relative;
display: block;
padding-bottom: 64px;
}
.front-page .career-block .desc-wrapper {
width: 100%;
text-align: center;
}
.front-page .career-block .title { line-height: .9; }
.front-page .career-block .subtitle { padding-top: 32px; }
.front-page .career-block .btn-wrapper {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding-top: 0;
}
.front-page .career-block .img-wrapper {
min-height: 522px;
padding-top: 22px;
}
}
@media (max-width: 576px) {
.front-page .career-block .img-wrapper { min-height: calc((100vw - 17px)* 0.9242); }
}
/* */
/* */
.vacancy-page .vacancy-head .title {
padding-top: 80px;
text-align: center;
}
.vacancy-page .vacancy-head .tags-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-top: 30px;
}
.vacancy-page .vacancy-head .vacancy-tag {
margin: 8px;
background: #231f1f;
border-radius: 4px;
}
.vacancy-page .vacancy-head .vacancy-tag .icon-wrapper { filter: invert(1); }
@media (max-width: 768px) {
.vacancy-page .vacancy-head .title { padding-top: 20px; }
.vacancy-page .vacancy-head .tags-container { padding-top: 16px; }
}
@media (max-width: 576px) {
.vacancy-page .vacancy-head .vacancy-tag {
margin: 4px;
padding: 6px;
background: #404040;
font-size: 10px;
}
.vacancy-page .vacancy-head .vacancy-tag .icon-wrapper {
width: 12px;
margin-right: 3px;
}
}
/* */
/* */
.vacancy-page .vacancy-body {
position: relative;
padding-top: 70px;
}
.vacancy-page .vacancy-body .project-wrap { padding: 100px 0; }
.vacancy-page .vacancy-body .project-summary {
max-width: 542px;
padding-bottom: 40px;
}
.vacancy-page .vacancy-body .project-summary .project-logo-wrapper { margin: 0 auto; }
.vacancy-page .vacancy-body .project-summary .project-desc { padding-top: 24px; }
.vacancy-page .vacancy-body .project-summary .btn-wrapper { padding-top: 24px; }
@media (max-width: 768px) {
.vacancy-page .vacancy-body .project-wrap {
padding-top: 32px;
padding-bottom: 24px;
}
.vacancy-page .vacancy-body .project-summary { padding-bottom: 32px; }
.vacancy-page .vacancy-body .project-summary .project-logo-wrapper img { max-width: .6em; }
.vacancy-page .vacancy-body .project-summary .project-desc { padding-top: 20px; }
.vacancy-page .vacancy-body .project-summary .btn-wrapper { padding-top: 20px; }
}
@media (max-width: 576px) {
.vacancy-page .vacancy-body .project-summary .project-logo-wrapper img { max-width: .5em; }
}
/* */
/* */
.vacancy-page .vacancy-body .vacancy-desc-container {
padding: 100px 100px 64px;
background: #fff;
color: #191616;
border-top-left-radius: 16px;
border-top-right-radius: 16px;
}
.vacancy-page .vacancy-body .recruiter-container {
float: right;
width: 200px;
margin-left: 90px;
}
.vacancy-page .vacancy-body .recruiter-container .recruiter-info {
position: relative;
border-radius: 8px;
overflow: hidden;
}
.vacancy-page .vacancy-body .recruiter-container .recruiter-info .name {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
min-height: 40px;
bottom: 0;
left: 0;
right: 0;
padding: 10px 5px;
background: #191616;
color: #fff;
text-align: center;
}
.vacancy-page .vacancy-body .recruiter-container .btn-wrapper.linkedin {
padding-top: 12px;
text-align: center;
}
.vacancy-page .vacancy-body .recruiter-container .btn-wrapper.linkedin a { color: #191616; }
.vacancy-page .vacancy-body .recruiter-container .btn-wrapper.btn-popup { padding-top: 53px; }
.vacancy-page .vacancy-body .recruiter-container .btn-wrapper.btn-popup .btn {
width: 100%;
padding: 11px 5px;
}
.vacancy-page .vacancy-body .block {
position: relative;
display: flex;
flex-direction: column;
padding-bottom: 32px;
}
.vacancy-page .vacancy-body .block:not(.first):before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
height: 1px;
background: linear-gradient(90deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 96.17%);
}
.vacancy-page .vacancy-body .block:not(.first) { padding-top: 32px; }
.vacancy-page .vacancy-body .block .block-title { padding-bottom: 32px; }
@media (max-width: 1260px) {
.vacancy-page .vacancy-body .vacancy-desc-container { padding: 50px 50px 64px; }
}
@media (max-width: 992px) {
.vacancy-page .vacancy-body .vacancy-desc-container { padding: 32px 32px 32px; }
.vacancy-page .vacancy-body .recruiter-container { width: 180px; }
.vacancy-page .vacancy-body .recruiter-container .btn-wrapper.btn-popup { padding-top: 16px; }
}
@media (max-width: 768px) {
.vacancy-page .vacancy-body .vacancy-desc-container { padding: 32px 16px 22px; }
.vacancy-page .vacancy-body .recruiter-container {
float: none;
margin: 0 auto;
padding-bottom: 52px;
}
.vacancy-page .vacancy-body .block:not(.first):before { background: #00000033; }
.vacancy-page .vacancy-body .block:last-of-type:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 1px;
background: #00000033;
}
.vacancy-page .vacancy-body .block .t-18 {
color: #5e5c5c;
font-size: 15px;
}
}
/* */
/* */
.vacancy-page .vacancy-body .selection-stages { padding-top: 75px; }
.vacancy-page .vacancy-body .selection-stages .selection-stages-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-left: -22px;
margin-right: -22px;
padding-top: 9px;
}
.vacancy-page .vacancy-body .selection-stages .stage {
position: relative;
width: 128px;
margin: 23px;
text-align: center;
}
.vacancy-page .vacancy-body .selection-stages .stage:not(:last-child):after {
content: "";
position: absolute;
top: 67px;
right: -25px;
width: 7px;
height: 7px;
border-bottom: 2px solid #d1d1d1;
border-left: 2px solid #d1d1d1;
transform: rotate(225deg);
}
.vacancy-page .vacancy-body .selection-stages .stage .icon-wrapper {
width: 100%;
height: auto;
padding: 27px;
background: #f7f7f7;
border-radius: 50%;
}
.vacancy-page .vacancy-body .selection-stages .stage .name { padding: 24px 5px 0; }
.vacancy-page .vacancy-body .vacancy-popup-btn { padding-top: 36px; }
@media (max-width: 768px) {
.vacancy-page .vacancy-body .selection-stages { padding-top: 32px; }
.vacancy-page .vacancy-body .selection-stages .selection-stages-container {
padding-top: 22px;
margin-left: -5px;
margin-right: -5px;
}
.vacancy-page .vacancy-body .selection-stages .stage {
width: 80px;
margin: 10px 20px;
padding: 0 4px;
}
.vacancy-page .vacancy-body .selection-stages .stage:not(:last-child):after {
top: 31px;
right: -23px;
}
.vacancy-page .vacancy-body .selection-stages .stage .icon-wrapper { padding: 20px; }
.vacancy-page .vacancy-body .selection-stages .stage .name {
padding: 12px 0 0;
font-size: 10px;
}
.vacancy-page .vacancy-body .vacancy-popup-btn { display: none; }
}
/* */
/* */
.vacancy-page .vacancy-body .socials-share {
padding: 32px;
background: #fff;
color: #191616;
border-top: 1px solid #00000033;
border-bottom-left-radius: 16px;
border-bottom-right-radius: 16px;
}
.vacancy-page .vacancy-body .socials-share .socials-container {
display: flex;
justify-content: center;
padding-top: 24px;
}
.vacancy-page .vacancy-body .socials-share .social {
display: block;
margin: 0 16px;
text-align: center;
}
.vacancy-page .vacancy-body .socials-share .social .icon-wrapper {
width: 72px;
height: 72px;
padding: 20px;
background: #f7f7f7;
border-radius: 50%;
}
.vacancy-page .vacancy-body .socials-share .social .icon-wrapper svg {
width: 100%;
height: auto;
}
.vacancy-page .vacancy-body .socials-share span {
display: block;
padding-top: 12px;
color: #191616;
}
@media (max-width: 768px) {
.vacancy-page .vacancy-body .socials-share .socials-container { padding-top: 16px; }
}
@media (max-width: 576px) {
.vacancy-page .vacancy-body .socials-share .title { font-size: 10px; }
.vacancy-page .vacancy-body .socials-share .social .icon-wrapper {
width: 40px;
height: 40px;
margin: 0 auto;
padding: 6px;
}
.vacancy-page .vacancy-body .socials-share span { font-size: 10px; }
}
/* */
/* */
.vacancies-archive .hero .hero-container {
display: flex;
justify-content: center;
padding-top: 28px;
}
.vacancies-archive .hero .title {
padding: 0 60px;
text-align: center;
}
.vacancies-archive .hero .img-wrapper {
max-width: 140px;
padding-top: 45px;
}
.vacancies-archive .hero .img-wrapper.mobile { display: none; }
@media (max-width: 768px) {
.vacancies-archive .hero .img-wrapper { max-width: 100px; }
.vacancies-archive .hero .title { padding: 0 30px; }
}
@media (max-width: 576px) {
.vacancies-archive .hero .hero-container {
display: block;
padding-top: 20px;
}
.vacancies-archive .hero .title { padding: 0; }
.vacancies-archive .hero .img-wrapper.left,
.vacancies-archive .hero .img-wrapper.right {
display: none;
}
.vacancies-archive .hero .img-wrapper.mobile {
display: block;
max-width: 118px;
padding-top: 24px;
}
}
/* */
/* */
.vacancies-archive .vacancies {
position: relative;
color: #191616;
background: #fff;
}
.vacancies-archive .vacancies .vacancies-container {
display: flex;
max-width: 996px;
margin: 0 auto;
padding-top: 80px;
}
@media (max-width: 768px) {
.vacancies-archive .vacancies { overflow: hidden; }
.vacancies-archive .vacancies:before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
height: 76px;
background: linear-gradient(92.14deg, #8B08F8 3.49%, #F15934 71.79%, #FFAF02 103.44%);
z-index: -1;
}
.vacancies-archive .vacancies .container { position: static; }
.vacancies-archive .vacancies .vacancies-container { padding-top: 0; }
}
/* */
/* */
.vacancies-archive .vacancies .sidebar {
width: 269px;
flex-shrink: 0;
margin-right: 35px;
padding-bottom: 100px;
}
.vacancies-archive .vacancies .sidebar .filter-wrapper .title { display: inline-block; }
.vacancies-archive .vacancies .sidebar .filter-wrapper .filter-list {
padding-top: 24px;
list-style: none;
}
.vacancies-archive .vacancies .sidebar .filter-wrapper .filter-list .item:not(:last-child) { margin-bottom: 10px; }
.vacancies-archive .vacancies .sidebar .active-filters .heading {
display: flex;
align-items: baseline;
}
.vacancies-archive .vacancies .sidebar .active-filters .clear-all {
display: none;
margin-left: auto;
color: #b1b7c0;
text-align: right;
transition: color .3s;
}
.vacancies-archive .vacancies .sidebar .active-filters .clear-all:hover { color: #8b08f9; }
.vacancies-archive .vacancies .sidebar .active-filters .wrapper {
margin-top: 24px;
overflow: hidden;
}
.vacancies-archive .vacancies .sidebar .active-filters .active-filters-container {
display: flex;
flex-wrap: wrap;
margin: -4px;
padding-top: 0 !important;
}
.vacancies-archive .vacancies .sidebar .active-filters .filter {
position: relative;
top: 0;
margin: 4px;
background: #ecf1f8;
border-radius: 46px;
transition: opacity .3s, top .3s;
}
.vacancies-archive .vacancies .sidebar .active-filters .filter * { cursor: pointer; }
.vacancies-archive .vacancies .sidebar .active-filters .filter a {
display: block;
padding: 6px 26px 6px 12px;
color: #191616;
line-height: 1;
opacity: .5;
transition: opacity .3s;
}
.vacancies-archive .vacancies .sidebar .active-filters .filter .close {
position: absolute;
top: 50%;
right: 12px;
width: 10px;
height: 9px;
transform: translateY(-50%);
}
.vacancies-archive .vacancies .sidebar .active-filters .filter .close:before {
content: "";
position: absolute;
top: 5px;
right: 0;
width: 10px;
height: 1px;
background: #191616;
opacity: .5;
transform: rotate(45deg);
transition: opacity .3s;
cursor: pointer;
}
.vacancies-archive .vacancies .sidebar .active-filters .filter .close:after {
content: "";
position: absolute;
top: 5px;
right: 0;
width: 10px;
height: 1px;
background: #191616;
opacity: .5;
transform: rotate(-45deg);
transition: opacity .3s;
cursor: pointer;
}
.vacancies-archive .vacancies .sidebar .active-filters .filter:hover .close:before,
.vacancies-archive .vacancies .sidebar .active-filters .filter:hover .close:after {
opacity: 1;
}
.vacancies-archive .vacancies .sidebar .active-filters .filter.faded {
top: 10px;
opacity: 0;
}
.vacancies-archive .vacancies .sidebar .active-filters .filter.fade-out {
top: -10px;
opacity: 0;
}
.vacancies-archive .vacancies .sidebar .filters-title { padding-top: 40px; }
.vacancies-archive .vacancies .sidebar .filter-categories { padding-top: 16px; }
.vacancies-archive .vacancies .sidebar .filter-projects { padding-top: 56px; }
.vacancies-archive .vacancies .sidebar-hide { display: none; }
@media (max-width: 992px) {
.vacancies-archive .vacancies .sidebar { width: 200px; }
.vacancies-archive .vacancies .sidebar .filter-wrapper .title { max-width: 120px; }
.vacancies-archive .vacancies .sidebar .active-filters .wrapper { margin-top: 16px; }
.vacancies-archive .vacancies .sidebar .filters-title { padding-top: 24px; }
.vacancies-archive .vacancies .sidebar .filter-categories { padding-top: 8px; }
.vacancies-archive .vacancies .sidebar .filter-projects { padding-top: 32px; }
.vacancies-archive .vacancies .sidebar .filter-wrapper .filter-list { padding-top: 16px; }
.vacancies-archive .vacancies .sidebar .filter-wrapper .filter-list .item:not(:last-child) { margin-bottom: 8px; }
}
@media (max-width: 768px) {
.vacancies-archive .vacancies .sidebar {
position: absolute;
top: 76px;
left: -300px;
width: 300px;
margin-right: 0;
padding: 16px;
background: #fff;
z-index: 9;
transition: left .3s;
}
.vacancies-archive .vacancies.filters-menu-expanded .sidebar { left: 0; }
.vacancies-archive .vacancies .sidebar .filter-wrapper .title { max-width: unset; }
.vacancies-archive .vacancies.filters-menu-expanded .sidebar-hide {
display: block;
position: absolute;
top: 76px;
bottom: 0;
left: 0;
right: 0;
cursor: w-resize;
z-index: 8;
}
}
@media (max-width: 350px) {
.vacancies-archive .vacancies .sidebar {
left: -250px;
width: 250px;
}
.vacancies-archive .vacancies .sidebar .filter-wrapper .title { max-width: 120px; }
}
/* */
/* */
.vacancies-archive .vacancies .main {
width: 100%;
padding-bottom: 80px;
}
.vacancies-archive .vacancies .main .search-container { position: relative; }
.vacancies-archive .vacancies .main .search-container .search-input {
width: 100%;
padding: 14px 160px 14px 56px;
border-radius: 42px;
border: 1px solid #e5e8ed;
}
.vacancies-archive .vacancies .main .search-container .search-input.error { border-color: #f84147; }
.vacancies-archive .vacancies .main .search-container .icon {
position: absolute;
top: 11px;
left: 16px;
}
.vacancies-archive .vacancies .main .search-container .search-input::placeholder { color: #b1b7c0; }
.vacancies-archive .vacancies .main .search-container .search-submit {
position: absolute;
top: 0;
right: 0;
padding-top: 12px;
padding-bottom: 12px;
}
.vacancies-archive .vacancies .main .search-container .filters-menu-expand {
display: none;
position: absolute;
top: 4px;
right: 6px;
width: 36px;
height: 36px;
padding: 10px;
}
.vacancies-archive .vacancies .main .vacancies-list-wrapper { margin-top: 40px; }
@media (max-width: 768px) {
.vacancies-archive .vacancies .main .search-container {
margin-top: 16px;
padding-bottom: 16px;
}
.vacancies-archive .vacancies .main .search-container .search-input { padding: 13px 48px; }
.vacancies-archive .vacancies .main .search-container .search-submit { display: none; }
.vacancies-archive .vacancies .main .search-container .filters-menu-expand {
display: block;
background: url(../images/archive-vacancy/icon-settings.svg) center center no-repeat;
}
.vacancies-archive .vacancies .main .vacancies-list-wrapper {
width: 100%;
margin-top: 24px;
transition: margin-left .3s;
}
.vacancies-archive .vacancies.filters-menu-expanded .main .vacancies-list-wrapper { margin-left: 300px; }
}
@media (max-width: 350px) {
.vacancies-archive .vacancies.filters-menu-expanded .main .vacancies-list-wrapper { margin-left: 250px; }
}
@media (min-width: 769px) {
.vacancies-archive .vacancies .main { min-height: unset !important; }
}
/* */
/* */
.vacancies-archive .vacancy-item {
position: relative;
display: block;
top: 0;
margin-top: 16px;
padding: 16px;
color: #191616;
border: 1px solid #ecf1f8;
border-radius: 8px;
transition: box-shadow .3s, opacity .3s, top .5s;
}
.vacancies-archive .vacancy-item:first-child { margin-top: 0; }
.vacancies-archive .vacancy-item.faded {
top: -30px;
opacity: 0;
}
.vacancies-archive .vacancy-item.fade-out {
top: 30px;
opacity: 0;
}
.vacancies-archive .vacancy-item:not(.nothing-found):hover { box-shadow: 0 4px 19px 0 #293B5629; }
.vacancies-archive .vacancy-item:not(.nothing-found) * { color: inherit; }
.vacancies-archive .vacancy-item .top-container { display: flex; }
.vacancies-archive .vacancy-item .logo-wrapper {
width: 48px;
flex-shrink: 0;
margin-right: 16px;
}
.vacancies-archive .vacancy-item .top-wrapper {
width: 100%;
margin-top: -3px;
}
.vacancies-archive .vacancy-item .title-wrapper {
display: flex;
align-items: baseline;
justify-content: space-between;
}
.vacancies-archive .vacancy-item .title {
padding-right: 16px;
line-height: 1.2;
}
.vacancies-archive .vacancy-item .date { white-space: nowrap; }
.vacancies-archive .vacancy-item .project-wrapper {
display: flex;
padding-top: 12px;
}
.vacancies-archive .vacancy-item .project-wrapper .vacancy-tag {
margin-left: 24px;
padding: 0;
background: none;
opacity: .5;
}
.vacancies-archive .vacancy-item .project-wrapper .vacancy-tag .icon-wrapper { margin-right: 4px; }
.vacancies-archive .vacancy-item .mobile-title {
display: none;
margin-top: 16px;
color: #191616;
font-size: 14px;
line-height: 1.2;
}
.vacancies-archive .vacancy-item .bottom-container {
display: flex;
align-items: flex-end;
padding-top: 25px;
}
.vacancies-archive .vacancy-item .bottom-container .vacancy-tag:not(:first-child) { margin-left: 16px; }
.vacancies-archive .vacancy-item .btn-wrapper { margin-left: auto; }
.vacancies-archive .vacancy-item:not(.nothing-found):hover .btn-wrapper .btn {
background: #191616;
color: #fff;
}
.vacancies-archive .vacancy-item.preloader { box-shadow: none !important; }
.vacancies-archive .vacancy-item.preloader .logo-wrapper { background: #b1b7c0; }
.vacancies-archive .vacancy-item.preloader .title {
width: 350px;
background: #b1b7c0;
}
.vacancies-archive .vacancy-item.preloader .date {
display: block;
width: 100px;
background: #b1b7c0;
opacity: 1;
}
.vacancies-archive .vacancy-item.preloader .project {
width: 40px;
background: #b1b7c0;
opacity: 1;
}
.vacancies-archive .vacancy-item.preloader .project-wrapper .vacancy-tag {
width: 160px;
background: #b1b7c0;
border-radius: 0;
opacity: 1;
}
.vacancies-archive .vacancy-item.preloader .mobile-title {
width: 250px;
background: #b1b7c0;
}
.vacancies-archive .vacancy-item.preloader .bottom-container .vacancy-tag:nth-child(1) { width: 110px; }
.vacancies-archive .vacancy-item.preloader .bottom-container .vacancy-tag:nth-child(2) { width: 160px; }
.vacancies-archive .vacancy-item.preloader .btn-wrapper .btn {
color: #fff !important;
background: none !important;
}
.vacancies-archive .vacancy-item.nothing-found .subtitle { padding-top: 18px; }
.vacancies-archive .vacancy-item.nothing-found .btn-wrapper { padding-top: 24px; }
@media (max-width: 992px) {
.vacancies-archive .vacancy-item {
margin-top: 10px;
padding: 12px;
font-size: 12px;
}
.vacancies-archive .vacancy-item:not(.nothing-found) .title { display: none; }
.vacancies-archive .vacancy-item .logo-wrapper {
width: 40px;
height: 40px;
margin-right: 8px;
}
.vacancies-archive .vacancy-item .top-wrapper {
display: flex;
flex-direction: row-reverse;
align-items: flex-start;
justify-content: space-between;
margin-top: 0;
}
.vacancies-archive .vacancy-item .title-wrapper {
display: block;
text-align: right;
}
.vacancies-archive .vacancy-item .date { white-space: normal; }
.vacancies-archive .vacancy-item .project-wrapper {
display: block;
padding-top: 2px;
padding-right: 8px;
}
.vacancies-archive .vacancy-item .project-wrapper .vacancy-tag {
margin-left: 0;
margin-top: 6px;
}
.vacancies-archive .vacancy-item .project-wrapper .vacancy-tag .icon-wrapper { margin-right: 2px; }
.vacancies-archive .vacancy-item .mobile-title { display: block; }
.vacancies-archive .vacancy-item .bottom-container {
flex-wrap: wrap;
margin: -4px;
padding-top: 16px;
}
.vacancies-archive .vacancy-item .bottom-container .vacancy-tag {
margin: 4px !important;
padding: 6px;
}
.vacancies-archive .vacancy-item:not(.nothing-found) .btn-wrapper { display: none; }
}
/* */
/* */
.vacancies-archive .vacancy-cat-subscription-block { padding-top: 120px; }
/* */
/* */
.project-page .hero .project-logo {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
min-height: 500px;
margin-top: 40px;
border-radius: 24px;
opacity: 0;
transition: opacity .8s;
}
.project-page .hero .project-logo .project-logo-wrapper {
width: 100%;
flex-shrink: 0;
opacity: 0;
transition: opacity .8s .8s;
}
.project-page .hero.show .project-logo,
.project-page .hero.show .project-logo .project-logo-wrapper {
opacity: 1;
}
@media (max-width: 992px) {
.project-page .hero .project-logo { min-height: 400px; }
}
@media (max-width: 768px) {
.project-page .hero .project-logo { min-height: 270px; }
.project-page .hero .project-logo .project-logo-wrapper img { max-width: .6em; }
}
@media (max-width: 576px) {
.project-page .hero .project-logo .project-logo-wrapper img { max-width: .5em; }
}
/* */
/* */
.project-page .details-block { padding-top: 140px; }
.project-page .details-block .details-container.with-details { display: flex; }
.project-page .details-block .title { line-height: 1.1; }
.project-page .details-block .details-container.with-details .title-wrapper {
width: 50%;
padding-right: 10px;
}
.project-page .details-block .title .highlight-rainbow {
position: relative;
background: none;
-webkit-background-clip: unset;
-webkit-text-fill-color: initial;
}
.project-page .details-block .title .highlight-rainbow:before {
content: "";
position: absolute;
top: 4px;
bottom: -1px;
left: -10px;
right: -7px;
border-radius: 40px;
z-index: -1;
}
.project-page .details-block .details-container.title-only .title-wrapper { max-width: 996px; }
.project-page .details-block .links-container {
display: flex;
padding-top: 74px;
margin: 0 -6px;
}
.project-page .details-block .details-container.title-only .links-container { justify-content: center; }
.project-page .details-block .links-container a {
display: block;
margin: 0 6px;
}
.project-page .details-block .links-container .project-link { white-space: nowrap; }
.project-page .details-block .links-container .social { line-height: .7; }
.project-page .details-block .details {
width: 50%;
padding-left: 10px;
list-style: none;
}
.project-page .details-block .detail {
position: relative;
padding-left: 22px;
}
.project-page .details-block .detail:not(:first-child) { margin-top: 40px; }
.project-page .details-block .detail:before {
content: "";
position: absolute;
top: 10px;
left: -7px;
width: 9px;
height: 9px;
border-bottom: 2px solid #fff;
border-left: 2px solid #fff;
transform: rotate(225deg);
}
@media (max-width: 992px) {
.project-page .details-block .detail:before { top: 8px; }
.project-page .details-block .detail p { font-size: 20px; }
}
@media (max-width: 768px) {
.project-page .details-block { padding-top: 64px; }
.project-page .details-block .details-container.with-details { display: block; }
.project-page .details-block .details-container.with-details .title-wrapper {
max-width: 400px;
width: 100%;
margin: 0 auto;
padding: 0;
text-align: center;
}
.project-page .details-block .links-container {
justify-content: center;
padding-top: 24px;
}
.project-page .details-block .details {
width: 100%;
padding: 40px 0 0;
}
.project-page .details-block .detail { padding-left: 20px; }
.project-page .details-block .detail:not(:first-child) { margin-top: 24px; }
.project-page .details-block .detail:before {
top: 5px;
left: -3px;
width: 7px;
height: 7px;
}
.project-page .details-block .detail p { font-size: 14px; }
}
@media (max-width: 576px) {
.project-page .details-block .links-container { margin: 0 -3px; }
.project-page .details-block .links-container a { margin: 0 3px; }
}
/* */
/* */
.project-page .features-block { padding-top: 180px; }
.project-page .features-block .title { max-width: 743px; }
.project-page .features-block .features-list {
display: flex;
flex-wrap: wrap;
margin: -8px;
padding-top: 56px;
}
.project-page .features-block .features-list.last-centered { justify-content: center; }
.project-page .features-block .feature {
position: relative;
width: calc((100% - 48px) / 3);
margin: 8px;
}
.project-page .features-block .tile-container {
min-height: 416px;
height: 100%;
padding: 16px;
background: #231f1f;
border-radius: 8px;
}
.project-page .features-block .tile-container .img-wrapper {
max-width: 357px;
border-radius: 12px;
overflow: hidden;
}
.project-page .features-block .tile-container .name { padding-top: 18px; }
.project-page .features-block .tile-container .desc {
padding-top: 4px;
line-height: 1.2;
}
.project-page .features-block .circle-container {
position: relative;
top: 50%;
left: 0;
width: 100%;
padding-bottom: 100%;
transform: translateY(-50%);
}
.project-page .features-block .circle {
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #fff;
border-radius: 50%;
text-align: center;
}
.project-page .features-block .circle-container .text { padding: 0 40px; }
@media (max-width: 1260px) {
.project-page .features-block .circle-container .text { padding: 0 25px; }
}
@media (max-width: 768px) {
.project-page .features-block { padding-top: 80px; }
.project-page .features-block .title {
max-width: 400px;
margin: 0 auto;
}
.project-page .features-block .features-list { padding-top: 32px; }
.project-page .features-block .feature { width: calc((100% - 32px) / 2); }
.project-page .features-block .tile-container { min-height: 322px; }
}
@media (max-width: 576px) {
.project-page .features-block .features-list { margin: -8px 0; }
.project-page .features-block .feature {
max-width: 389px;
width: 100%;
margin: 8px auto;
}
.project-page .features-block .tile-container { min-height: unset; }
}
/* */
/* */
.principles-page .page-title .title-container {
position: relative;
width: fit-content;
margin-top: 60px;
}
.principles-page .page-title .title-container:before,
.principles-page .page-title .title:before,
.principles-page .page-title .title:after {
content: "";
position: absolute;
background: url(../images/principles/title-sprites.png) no-repeat;
}
.principles-page .page-title .title-container:before {
top: 72px;
left: -61px;
width: 34px;
height: 65px;
background-position: 0 0;
}
.principles-page .page-title .title:before {
bottom: -63px;
right: -14px;
width: 64px;
height: 35px;
background-position: -34px 0;
}
.principles-page .page-title .title:after {
top: -44px;
right: 95px;
width: 63px;
height: 32px;
background-position: -98px 0;
}
@media (max-width: 1260px) {
.principles-page .page-title .title-container:before { top: 40px; }
}
@media (max-width: 768px) {
body.page-template-template_principles header:before { display: none; }
}
@media (max-width: 576px) {
.principles-page .page-title .title-container:before {
top: unset;
bottom: -61px;
left: 0;
transform: scale(0.6) rotate(-25deg);
}
.principles-page .page-title .title:before {
bottom: -50px;
right: -5px;
transform: scale(0.6);
}
.principles-page .page-title .title:after {
top: -34px;
right: 60px;
transform: scale(0.6) rotate(10deg);
}
}
/* */
/* */
.principles-page .block:not(:last-of-type) .block-container {
padding-bottom: 100px;
border-bottom: 2px dashed #302d2d;
}
@media (max-width: 768px) {
.principles-page .block:not(:last-of-type) .block-container { padding-bottom: 48px; }
}
/* */
/* */
.principles-page .about-mission .block-container {
display: flex;
padding-top: 156px;
}
.principles-page .about-mission .title {
width: 50%;
padding-right: 10px;
}
.principles-page .about-mission .desc {
width: 50%;
padding-top: 4px;
padding-left: 10px;
}
@media (max-width: 1260px) {
.principles-page .about-mission .title {
width: 40%;
font-size: 30px;
}
.principles-page .about-mission .desc { width: 60%; }
}
@media (max-width: 768px) {
.principles-page .about-mission .block-container {
display: block;
padding-top: 103px;
}
.principles-page .about-mission .title {
width: 100%;
padding-right: 0;
font-size: 20px;
}
.principles-page .about-mission .desc {
width: 100%;
padding-top: 16px;
padding-left: 0;
}
}
/* */
/* */
.principles-page .about-values { position: relative; }
.principles-page .about-values:after {
content: "";
position: absolute;
top: 0;
right: 0;
width: 160px;
height: 787px;
background: url(../images/principles/splash-right.svg) center center no-repeat;
background-size: contain;
z-index: -1;
}
.principles-page .about-values .block-container {
margin-right: -12px;
padding-top: 100px;
text-align: right;
}
.principles-page .about-values .desc.desktop {
max-width: 580px;
float: left;
margin-top: -5px;
text-align: left;
}
.principles-page .about-values .desc.mobile {
display: none;
max-width: unset;
padding-top: 14px;
}
.principles-page .about-values .value {
position: relative;
display: inline-block;
margin: 0 12px 12px 0;
padding: 6px 15px 12px;
background: #191616;
background-clip: padding-box;
border: 1px solid transparent;
border-radius: 70px;
text-align: center;
}
.principles-page .about-values .value:before {
content: "";
position: absolute;
inset: 0;
margin: -1px;
background: linear-gradient(92.25deg, #8B08F8 4.54%, #F15934 113.62%);
border-radius: inherit;
z-index: -1;
}
@media (max-width: 1260px) {
.principles-page .about-values .block-container { margin-right: -8px; }
.principles-page .about-values .desc.desktop { max-width: 500px; }
.principles-page .about-values .value {
margin: 0 10px 10px 0;
padding: 8px 15px 10px;
font-size: 28px;
}
}
@media (max-width: 992px) {
.principles-page .about-values .block-container {
margin-right: 0;
text-align: left;
}
.principles-page .about-values .desc.desktop { display: none; }
.principles-page .about-values .desc.mobile { display: block; }
}
@media (max-width: 768px) {
.principles-page .about-values:after { display: none; }
.principles-page .about-values .block-container { padding-top: 48px; }
.principles-page .about-values .value {
padding: 8px 15px 12px;
font-size: 20px;
}
}
/* */
/* */
.principles-page .about-principles .block-container {
display: flex;
padding-top: 48px;
}
.principles-page .about-principles .principles-container {
width: 607px;
margin-left: -8px;
margin-right: -8px;
}
.principles-page .about-principles .principle {
display: flex;
flex-direction: column;
height: 458px;
margin: 0 8px;
padding: 32px 32px 112px;
background: url(../images/principles/principle-background.svg) center center no-repeat;
background-size: cover;
border-radius: 16px;
overflow: hidden;
}
.principles-page .about-principles .principle .num {
width: 45px;
padding: 7px 0 9px;
border: 1px solid #fff;
border-radius: 50%;
line-height: 1.5;
text-align: center;
}
.principles-page .about-principles .principle .name { padding-top: 32px; }
.principles-page .about-principles .principle .desc { padding-top: 32px; }
.principles-page .about-principles .slider-nav-container {
position: absolute;
bottom: 32px;
left: 40px;
}
.principles-page .about-principles .block-desc {
margin-top: -5px;
padding-left: 17px;
}
@media (max-width: 1260px) {
.principles-page .about-principles .principles-container { width: 507px; }
.principles-page .about-principles .principle { height: 540px; }
}
@media (max-width: 992px) {
.principles-page .about-principles .block-container { flex-direction: column-reverse; }
.principles-page .about-principles .principles-container {
width: 100%;
margin-left: 0;
margin-right: 0;
}
.principles-page .about-principles .principle {
max-width: 591px;
width: 100%;
height: 458px;
}
.principles-page .about-principles .slider-nav-container { left: calc(((100% - 720px) / 2) + 97px); }
.principles-page .about-principles .block-desc {
margin-top: 0;
padding-left: 0;
padding-bottom: 24px;
}
}
@media (max-width: 768px) {
.principles-page .about-principles .principle {
max-width: 540px;
height: 340px;
}
.principles-page .about-principles .principle .num {
width: 41px;
padding: 13px 0 13px;
font-size: 13px;
line-height: 1;
}
.principles-page .about-principles .principle .name { padding-top: 24px; }
.principles-page .about-principles .principle .desc { padding-top: 24px; }
.principles-page .about-principles .slider-nav-container { left: calc(((100% - 540px) / 2) + 32px); }
}
@media (max-width: 576px) {
.principles-page .about-principles .principle {
width: calc(100vw - 47px);
height: 390px;
margin: 0 4px;
padding: 16px 16px 90px;
}
.principles-page .about-principles .slider-nav-container { left: 45px; }
}
/* */
/* */
.constructor-page .page-head .title { padding-top: 40px; }
.constructor-page .page-head .title-hidden { display: none; }
/* */
/* */
#volunteer-community.volunteer-block .block-title-container .img-wrapper {
top: -8px;
padding-right: 22px;
}
.constructor-page .photo-sliders-block { padding-top: 200px; }
@media (max-width: 1260px) {
#volunteer-community.volunteer-block .block-title-container .img-wrapper {
top: -16px;
padding-right: 18px;
}
}
@media (max-width: 768px) {
#volunteer-community.volunteer-block .block-title-container .img-wrapper {
top: 8px;
max-width: 170px;
padding: 0;
transform: translate(-50%, -100%);
}
.constructor-page .photo-sliders-block { padding-top: 80px; }
}
/* */
/* */
body.error404 {
overflow-x: hidden;
overflow-y: auto;
}
body.error404 header:before,
body.error404 header:after {
display: none;
}
.page-404 {
padding-top: 40px;
padding-bottom: 60px;
}
.page-404 .page-container {
position: relative;
display: flex;
align-items: center;
max-width: 1010px;
margin: 0 auto;
}
.page-404 .img-wrapper {
position: relative;
flex-shrink: 0;
width: 431px;
height: 550px;
}
.page-404 .img-wrapper img {
position: absolute;
left: -260px;
z-index: -1;
}
.page-404.regular .img-wrapper img {
top: -115px;
width: 800px;
}
.page-404 .desc-wrapper {
position: relative;
padding-left: 56px;
}
.page-404 .title {
font-size: 160px;
line-height: 0.85;
}
.page-404 .subtitle { padding-top: 24px; }
.page-404 .desc { padding-top: 26px; }
.page-404 .btn-wrapper { padding-top: 40px; }
.page-404 .splash-right {
position: absolute;
top: -170px;
right: -170px;
width: 719px;
z-index: -1;
}
.page-404.vacancy .img-wrapper img {
top: -120px;
width: 840px;
}
.page-404.vacancy .subtitle { padding-top: 40px; }
.page-404.vacancy .desc { padding-top: 16px; }
.page-404.vacancy .btn-wrapper { padding-top: 24px; }
@media (max-width: 992px) {
.page-404 { padding-bottom: 0; }
.page-404 .img-wrapper { width: 331px; }
.page-404.regular .img-wrapper img {
top: -35px;
width: 600px;
left: -170px;
}
.page-404 .title { font-size: 130px; }
.page-404.vacancy .img-wrapper img {
top: 0;
width: 570px;
left: -120px;
}
}
@media (max-width: 768px) {
.page-404 { padding-top: 0; }
.page-404 .page-container { display: block; }
.page-404 .img-wrapper {
width: 100%;
height: unset;
}
.page-404.regular .img-wrapper img {
position: static;
width: 100%;
max-width: 330px;
margin: 0 auto;
padding-right: 30px;
}
.page-404 .desc-wrapper {
padding-left: 0;
text-align: center;
}
.page-404 .title { font-size: 120px; }
.page-404 .splash-right {
top: -130px;
right: -130px;
width: 619px;
}
.page-404.vacancy .img-wrapper img {
position: relative;
top: -50px;
left: 0;
width: 100%;
max-width: 380px;
margin: 0 auto -50px;
padding-right: 30px;
}
}
@media (max-width: 576px) {
.page-404 .title { font-size: 90px; }
.page-404 .splash-right {
top: -130px;
right: unset;
left: 60%;
width: 500px;
transform: translateX(-50%);
}
.page-404.vacancy .img-wrapper img {
top: -30px;
margin: 0 auto -30px;
}
}
/* */