@import url('https://fonts.googleapis.com/css2?family=Glory:wght@700&family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
body {
font-family: 'Inter', sans-serif;
color: #2C364E;
font-size: 16px;
line-height: 1.5;
}
a {
color: #2C364E;
text-decoration: none;
}
a:hover {
color: inherit;
}
h2 {
color: #0E1830;
text-align: center;
font-size: 31px;
font-style: normal;
font-weight: 400;
line-height: 1.2;
margin-bottom: 35px;
}
h2 strong {
font-weight: 600;
}
img {
max-width: 100%;
height: auto;
}
.wrapper {
padding-top: 65px;
padding-bottom: 65px;
}
#block-explainervideo-ourportfolio p a,
#solutions p a,
#highlighted .block-block-content .field a,
#research p a {
display: flex;
align-items: center;
border-radius: 12px;
background: #04A771;
border: 0px;
color: #FFF;
font-size: 17px;
font-style: normal;
font-weight: 500;
line-height: 1.17;
text-transform: uppercase;
padding: 19px 30px;
transition: all 0.2s ease;
}
#block-explainervideo-ourportfolio p a:after,
#solutions p a:after,
#highlighted .block-block-content .field a:after,
#research p a:after {
position: relative;
right: 0px;
display: block;
content: '';
background: url('data:image/svg+xml,') center center no-repeat;
width: 28px;
height: 22px;
margin-left: 10px;
transition: all 0.2s ease;
}
#research p a:hover,
#block-explainervideo-ourportfolio p a:hover,
#solutions p a:hover,
#highlighted .block-block-content .field a:hover {
opacity: 0.8;
}
#research p a:hover:after,
#block-explainervideo-ourportfolio p a:hover:after,
#solutions p a:hover:after,
#highlighted .block-block-content .field a:hover:after {
right: -10px;
}
.field--type-image img, .field--name-field-user-picture img {
margin: 0px;
}
#page-wrapper {
overflow: hidden;
}
#leaderboard {
width: 100%;
padding: 10px 0px;
background: #E2E2E2;
}
#leaderboard .block {
width: auto;
}
#leaderboard .row {
justify-content: space-between;
align-items: center;
}
#block-explainervideo-verkhniekontakty .field--name-field-contact,
#leaderboard .field--name-field-contact {
display: flex;
justify-content: center;
align-items: center;
}
#block-explainervideo-verkhniekontakty .field--name-field-contact {
justify-content: flex-start;
padding-top: 10px;
}
#block-explainervideo-verkhniekontakty .field--name-field-contact a,
#leaderboard .field--name-field-contact a {
display: block;
margin: 0px 9px;
}
#leaderboard .block:last-child p {
margin: 0px;
}
#leaderboard .block:last-child p a {
color: #000;
font-size: 14px;
text-decoration: underline;
}
#leaderboard .block:last-child p a:hover {
text-decoration: none;
}
#leaderboard .nav-link {
padding: 0px;
margin: 0px 12px;
font-size: 13px;
color: #666;
text-decoration: underline;
}
#leaderboard .nav-link:hover {
text-decoration: none;
}
#leaderboard .block-language .nav-link {
text-decoration: none;
}
#leaderboard .block-language .nav-link a {
color: #000;
font-size: 14px;
text-decoration: underline;
}
#leaderboard .block-language .nav-link a:hover,
#leaderboard .block-language .nav-link.is-active a {
text-decoration: none;
}
#header {
width: 100%;
background: #0E1830;
color: rgba(255, 255, 255, 0.70);
padding: 25px 0px;
}
#header .navbar {
padding: 0px;
}
#header .block p {
margin: 0px;
}
#block-explainervideo-headerabout {
max-width: 203px;
font-weight: 300;
font-size: 14px;
}
#block-explainervideo-headerabout strong {
font-weight: 600;
}
#block-explainervideo-headercontact .field ul,
#block-explainervideo-headercontact .field ul li {
padding: 0px;
margin: 0px;
list-style: none;
list-style-image: none;
}
#block-explainervideo-headercontact .field ul li {
display: flex;
align-items: center;
margin-bottom: 4px;
font-size: 15px;
}
#block-explainervideo-headercontact .field ul li:before {
display: block;
content: '';
width: 14px;
height: 16px;
margin-right: 11px;
}
#block-explainervideo-headercontact .field ul li:first-child:before {
background: url('data:image/svg+xml,') center center no-repeat;
}
#block-explainervideo-headercontact .field ul li:nth-child(2):before {
background: url('data:image/svg+xml,') center center no-repeat;
}
#block-explainervideo-headercontact .field ul li:last-child {
margin-bottom: 0px;
}
#block-explainervideo-headercontact .field ul li a {
color: rgba(255, 255, 255, 0.70);
text-decoration: underline;
}
#block-explainervideo-headercontact .field ul li a:hover {
text-decoration: none;
}
#block-explainervideo-getintouch p {
margin: 0px;
}
#block-explainervideo-getintouch p a {
display: block;
padding: 15px 27px;
border-radius: 7px;
background: #FFF;
text-decoration: none;
color: #0E1830;
font-size: 12px;
font-style: normal;
font-weight: 500;
letter-spacing: 2px;
text-transform: uppercase;
transition: all 0.2s ease;
}
#block-explainervideo-getintouch p a:hover {
opacity: 0.8;
}
.navbar-toggler {
padding: 0px;
margin: 0px;
border: 0px;
box-shadow: unset !important;
outline: none !important;
}
.navbar-toggler-icon {
position: relative;
background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") center center no-repeat;
width: 60px;
height: 60px;
background: none;
}
@font-face {
font-family: 'Gilroy';
src: url(../includes/font/Gilroy-Bold.ttf);
}
.navbar-toggler-icon__icon-open {
font-size: 16px;
letter-spacing: 1px;
color: #fff;
position: absolute;
top: 47px;
font-family: 'Gilroy';
line-height: 14px;
font-weight: 700;
}
.navbar-toggler-icon__icon-open {
font-size: 16px;
letter-spacing: 1px;
color: #fff;
position: absolute;
top: 39px;
font-family: 'Gilroy';
line-height: 14px;
font-weight: 700;
left: 0;
}
.navbar-toggler-icon__icon-open:hover {
/* color: #0A253E; */
}
.navbar-toggler-icon__icon-open span {
width: 55px;
height: 2px;
display: block;
background-color: #fff;
position: absolute;
}
.navbar-toggler-icon__icon-open span:nth-child(1) {
top: -30px;
}
.navbar-toggler-icon__icon-open span:nth-child(2) {
top: -11px;
}
.navbar-toggler-icon:after {
/* display: block;
content: 'Menu';
color: #fff;
position: absolute;
bottom: -15px;
left: 0px;
width: 100%;
text-align: center;
font-size: 12px;
font-weight: 500; */
}
html[lang="ru"] .navbar-toggler-icon:after {
/* content: 'Меню'; */
}
.offcanvas-body .nav {
padding: 0px 10px;
}
.offcanvas-header {
justify-content: flex-end;
}
#highlighted {
position: relative;
width: 100%;
height: 785px;
}
#highlighted .video-wrapper {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
}
#highlighted:after {
display: block;
content: '';
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
}
#highlighted .video-wrapper video {
border-radius: 0px;
width: 100%;
height: 100%;
object-fit: cover;
}
#highlighted .video-wrapper button {
z-index: 10;
}
#highlighted .container {
position: relative;
z-index: 10;
}
#block-explainervideo-firstscreenvideo {
position: unset;
}
#highlighted .nav {
padding: 0px;
display: flex;
justify-content: space-between;
flex-direction: row;
align-items: center;
}
#highlighted .nav li a {
padding: 15px;
color: #FFF;
text-align: center;
font-size: 13px;
font-style: normal;
font-weight: 400;
line-height: 1;
letter-spacing: 0.65px;
text-decoration: underline;
}
#highlighted .nav li a:hover {
text-decoration: none;
}
#highlighted .nav:after {
display: none;
}
#highlighted .block-block-content .field {
display: flex;
flex-direction: column;
align-items: center;
color: #FFF;
text-align: center;
font-size: 22px;
font-style: normal;
font-weight: 300;
line-height: 1.2;
padding-top: 150px;
}
#highlighted h1 {
color: #FFF;
font-size: 47px;
font-style: normal;
font-weight: 500;
line-height: 1.1;
margin: 0px;
}
#highlighted .block-block-content .field p {
margin-top: 20px;
}
#featured-top {
width: 100%;
background: #0E1830;
color: #959FB8;
font-size: 15px;
padding: 15px 0px;
}
#featured-top h2 {
margin: 0px;
color: #959FB8;
text-align: center;
font-size: 15px;
font-style: normal;
font-weight: 400;
}
.field--name-field-partners {
display: flex;
justify-content: space-between;
align-items: center;
}
.field--name-field-partners img {
max-height: 76px;
width: auto;
}
#solutions {
width: 100%;
background: #0E1830;
color: rgba(255, 255, 255, 0.70);
padding: 35px 0px;
}
#solutions .row {
align-items: center;
}
#solutions .row > .block {
width: 50%;
}
#solutions h2 {
margin-bottom: 10px;
text-align: left;
font-size: 36px;
color: #FFF;
}
#solutions .row > .block:first-child h2,
#solutions .row > .block:first-child p {
max-width: 460px;
}
#solutions .row > .block:first-child p:last-child {
display: flex;
margin-bottom: 0px;
margin-top: 58px;
}
#stat {
width: 100%;
}
#stat .field ul,
#stat .field ul li {
padding: 0px;
margin: 0px;
list-style: none;
list-style-image: none;
}
#stat .field ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#stat .field ul li {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 24px;
background: #E8ECFB;
padding: 30px;
text-align: center;
color: #0E1830;
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 1.3;
margin: 8px 0px;
width: calc(50% - 8px);
}
#stat .field ul li strong {
display: block;
color: #0E1830;
font-size: 58px;
font-style: normal;
font-weight: 500;
line-height: 1;
}
#faq {
width: 100%;
background: #E8ECFB;
}
.accordion-item {
border: 0px !important;
padding: 15px 0px;
border-radius: 0px !important;
border-bottom: 1px solid rgba(0, 0, 0, 0.07) !important;
background: none;
}
.accordion-button {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0px;
border: 0px;
border-radius: 0px;
color: #0E1830 !important;
font-size: 17px;
font-style: normal;
font-weight: 600;
line-height: 1.5;
letter-spacing: -0.6px;
box-shadow: unset !important;
outline: none !important;
background: none !important;
}
#block-explainervideo-views-block-faq-block-1 {
max-width: 800px;
margin: 0 auto;
}
.accordion-body {
padding-bottom: 0px;
}
.accordion-body p {
margin: 0px;
}
.accordion-button::after {
background: url(../images/plus.svg) center center no-repeat !important;
background-size: contain;
width: 63px;
height: 64px;
}
.accordion-button:not(.collapsed):after {
transform: rotate(0deg);
}
.accordion-button[aria-expanded="true"]:after {
transform: rotate(45deg);
}
#portfolio {
width: 100%;
background: #E8ECFB;
}
#block-explainervideo-ourportfolio p {
display: flex;
justify-content: center;
margin: 60px 0px 0px 0px;
}
.field--type-entity-reference {
margin: 0px;
}
.field--name-field-industry {
color: #333;
font-size: 11px;
font-style: normal;
font-weight: 400;
margin-bottom: 6px;
}
.portfolio-name {
color: #333;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 1.4;
}
#about .block {
width: 50%;
}
#about .block h2 {
text-align: left;
font-weight: 600;
}
#about .row {
align-items: center;
}
@media (min-width: 961px) {
#about .row {
display: block;
}
#about .block {
width: 100%;
}
#block-explainervideo-aboutvideo {
float: right;
display: inline-block;
width: 50%!important;
margin-top: 5em;
margin-left: 20px;
}
}
.video-wrapper {
position: relative;
}
.video-wrapper video {
width: 100%;
height: auto;
border-radius: 10px;
}
.video-wrapper button {
padding: 0px;
border: 0px;
background: none;
position: absolute;
bottom: 14px;
right: 14px;
}
.video-wrapper button span:first-child {
display: none;
}
.video-wrapper button.playing span:first-child {
display: block;
}
.video-wrapper button.playing span:nth-child(2) {
display: none;
}
#reviews {
width: 100%;
background: #E8ECFB;
position: relative;
padding: 44px 0px;
}
#reviews:after {
display: block;
content: '';
width: 100%;
height: 120px;
background: #fff;
position: absolute;
bottom: 0px;
left: 0px;
}
#reviews .container {
position: relative;
z-index: 10;
}
.rev-wrapper {
width: 100%;
background: #fff;
padding: 30px;
text-align: center;
border-radius: 10px;
}
.rev-text {
margin-bottom: 30px;
font-size: 18px;
}
.rev-text p {
margin: 0px;
}
.field--name-field-foto {
padding-bottom: 10px;
display: flex;
justify-content: center;
}
.field--name-field-foto img {
max-width: 100px;
border-radius: 50%;
margin: 0px;
}
.rev-name {
padding-bottom: 5px;
font-weight: bold;
}
.view-reviews .view-content {
margin: 0px -15px;
padding: 0px;
}
.view-reviews .slick-list {
padding: 0px;
}
.view-reviews .views-row {
padding: 0px 15px;
}
#footer {
width: 100%;
background: #0E1830;
padding-top: 72px;
}
#block-explainervideo-explainervideo-2 {
margin-bottom: 30px;
}
#block-explainervideo-explainervideo p,
#block-explainervideo-explainervideo-2 p {
margin: 0px;
}
#block-explainervideo-explainervideo p:first-child,
#block-explainervideo-explainervideo-2 p:first-child {
color: rgba(255, 255, 255, 0.90);
font-family: Glory;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 1;
text-transform: uppercase;
margin-bottom: 5px;
}
#block-explainervideo-explainervideo p:first-child a,
#block-explainervideo-explainervideo-2 p:first-child a {
color: rgba(255, 255, 255, 0.90);
}
#block-explainervideo-explainervideo p:last-child,
#block-explainervideo-explainervideo-2 p:last-child {
display: flex;
align-items: center;
color: rgba(255, 255, 255, 0.70);
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 1.6;
}
#block-explainervideo-explainervideo p:last-child em,
#block-explainervideo-explainervideo-2 p:last-child em {
border-bottom: 1px dotted;
font-style: normal;
}
#block-explainervideo-explainervideo p:last-child:before,
#block-explainervideo-explainervideo-2 p:last-child:before {
display: block;
content: '';
margin-right: 6px;
background: url('data:image/svg+xml,') center center no-repeat;
width: 14px;
height: 18px;
}
#footer h2 {
padding: 0px;
margin-bottom: 14px;
color: #FFF;
font-size: 17px;
font-style: normal;
font-weight: 800;
line-height: 1.4;
text-align: left;
}
#footer .nav {
flex-direction: column;
}
#footer .nav-link {
padding: 0px;
margin-bottom: 7px;
color: #8D98B5;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 1.6;
transition: all 0.2s ease;
}
#block-explainervideo-devlogo p a {
color: #8D98B5;
}
#footer .nav-link:hover {
color: #fff;
}
.region-footer-third .block p {
margin: 0px;
}
.region-footer-third .block p a {
color: #8D98B6;
font-size: 14px;
}
.search-form {
position: relative;
display: flex;
margin-top: 50px;
}
.search-form > div {
margin: 0px !important;
}
#footer .search-form .form-control {
background: none;
border: 0px;
border-radius: 0px;
border-bottom: 2px solid #fff;
height: 35px;
color: #fff;
box-shadow: unset;
outline: none;
padding: 0px 50px 0px 0px;
}
#footer .search-form .btn {
position: absolute;
top: 0px;
right: 0px;
background: url('data:image/svg+xml,') center center no-repeat;
width: 25px;
height: 25px;
border: 0px;
border-radius: 0px;
box-shadow: unset;
outline: unset;
overflow: hidden;
text-indent: -1000px;
}
.footer-line {
padding: 15px 0px;
border-top: 1px solid #596789;
margin-top: 35px;
}
.region-footer {
justify-content: space-between;
}
.region-footer > .block {
width: auto;
font-weight: 500;
font-size: 13px;
color: #fff;
}
.region-footer > .block p {
margin: 0px;
}
.region-footer > .block:first-child {
font-size: 12px;
}
.region-footer > .block:nth-child(2) p a {
color: #8D98B5;
}
.region-footer > .block:nth-child(3) p a {
color: #fff;
text-decoration: underline;
}
.region-footer > .block:nth-child(3) p a:hover {
text-decoration: none;
}
.footer-4 .field--name-field-contact {
display: flex;
flex-wrap: wrap;
margin-bottom: 40px;
}
.footer-4 .field--name-field-contact > div {
margin: 0px 10px 10px 0px;
}
.field--name-field-media-oembed-video {
position: relative;
padding-bottom: 56.25%;
margin-bottom: 15px;
}
.field--name-field-media-oembed-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.offcanvas-body h2 {
color: #212529;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 1.5;
text-align: left;
margin-bottom: 20px;
}
.offcanvas {
color: #111;
background: #F6F6F7;
}
.offcanvas .block {
margin-bottom: 30px;
}
.btn-primary {
border-radius: 6px;
background: #04A771;
border-color: #04A771;
}
.btn-primary:hover {
background: #04A771;
border-color: #04A771;
opacity: 0.8;
}
.webform-flex--1 {
flex: unset !important;
max-width: 250px;
}
.form-check {
font-size: 13px;
}
.webform-flexbox {
justify-content: space-between;
}
.offcanvas .content {
width: 100%;
}
.offcanvas .search-form {
margin-top: 0px;
}
/*.offcanvas .search-form .form-control {
border-color: #111;
color: #111;
}
.offcanvas .search-form .form-control::placeholder {
color: #111;
opacity: 1;
}
.offcanvas .search-form svg path {
fill: #111;
}
header .offcanvas #search-block-form {
padding: 0px;
}
.offcanvas .search-form > div {
width: 100%;
}
.offcanvas .search-form .btn {
position: absolute;
top: 0px;
right: 0px;
background: url('data:image/svg+xml,') center center no-repeat;
width: 25px;
height: 25px;
border: 0px;
border-radius: 0px;
box-shadow: unset;
outline: unset;
overflow: hidden;
text-indent: -1000px;
}
*/
header #search-block-form {
padding: 0px;
flex-flow: row nowrap;
justify-content: space-between;
}
header #search-block-form > div:first-child {
width: 100%;
padding-right: 16px;
}
#main-wrapper {
padding: 45px 0px;
}
#block-explainervideo-devlogo p {
color: rgba(255,255,255,0.70);
font-size: 14px;
margin: 0px;
padding-top: 10px;
}
.offcanvas-header .btn-close {
background: url('data:image/svg+xml,') center center no-repeat;
opacity: 1;
padding: 0px;
width: 28px;
height: 29px;
margin: 0px;
}
#block-explainervideo-menyu {
margin: 0px;
width: auto;
color: #212529;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 1.5;
text-transform: uppercase;
}
.offcanvas-header {
justify-content: space-between;
}
.offcanvas .nav-link {
color: #111;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 1.5;
padding: 0px;
margin: 3px 0px;
}
.offcanvas-body {
position: relative;
}
#block-explainervideo-kontaktvmenyu {
position: absolute;
top: 15px;
right: 15px;
width: auto;
color: #111;
font-weight: 500;
z-index: 10;
font-size: 13px;
}
#block-explainervideo-kontaktvmenyu .field ul,
#block-explainervideo-kontaktvmenyu .field ul li {
padding: 0px;
margin: 0px;
list-style: none;
list-style-image: none;
}
#block-explainervideo-kontaktvmenyu .field ul li {
margin-bottom: 4px;
}
#block-explainervideo-kontaktvmenyu .field ul li:last-child a {
text-decoration: underline;
}
#block-explainervideo-kontaktvmenyu .field ul li:last-child a:hover {
text-decoration: none;
}
.offcanvas-body .nav {
padding: 0px;
}
.nl {
display: none !important;
}
#research {
width: 100%;
background: #0CC07F;
color: #fff;
text-align: center;
}
#research h2 {
color: #fff;
margin-bottom: 30px;
}
#research p {
margin-bottom: 30px;
}
#research p:last-child {
display: flex;
justify-content: center;
}
#research p:last-child {
margin-bottom: 0px;
}
#research p a {
background: #0E1830;
}
#benefits {
width: 100%;
background: #E8ECFB;
padding: 23px 0px;
}
#benefits .field {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#benefits p {
width: 33.333%;
text-align: center;
color: #0E1830;
text-align: center;
font-size: 19.25px;
font-style: normal;
font-weight: 500;
line-height: 1.3;
margin: 25px 0px;
}
#benefits p:before {
display: block;
content: '';
background: url('data:image/svg+xml,') center center no-repeat;
width: 46px;
height: 46px;
margin: 0px auto 25px auto;
}
#team {
width: 100%;
background: #EEF2FF;
}
.field--name-field-komanda {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 0px -15px;
}
.field--name-field-komanda > div {
width: 261px;
text-align: center;
padding: 15px;
color: #333;
font-size: 16px;
}
.field--name-field-teamfoto img {
border-radius: 20px;
margin-bottom: 10px;
}
.field--name-field-teamname {
font-weight: 700;
}
.field--name-field-whybest {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 700px;
margin: 0px auto;
}
.field--name-field-whybest > div {
width: 330px;
}
.field--name-field-whybest > div:nth-child(1),
.field--name-field-whybest > div:nth-child(2) {
margin-bottom: 60px;
}
.field--name-field-whybest .paragraph {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.field--name-field-besttext {
font-size: 15px;
color: #2C364E;
margin-top: 15px;
}
.field--name-field-best-icon {
width: 56px;
min-width: 56px;
margin-right: 15px;
}
.field--name-field-best-title {
color: #0E1830;
font-size: 20px;
font-style: normal;
font-weight: 500;
line-height: 1.2;
max-width: 200px;
}
#smart .field--name-field-best-title {
max-width: 195px;
}
#steps {
width: 100%;
background: #EEF2FF;
}
.field--name-field-steps {
display: flex;
flex-wrap: wrap;
margin: 0px -15px;
}
.field--name-field-steps > div {
width: 33.333%;
padding: 0px 15px;
}
.field--name-field-step-text {
margin-top: 20px;
}
.field--name-field-step-text p {
margin: 0px;
color: #2C364E;
font-size: 18px;
}
.field--name-field-step-text p:first-child {
color: #0E1830;
font-size: 23px;
font-style: normal;
font-weight: 600;
line-height: 1.64;
margin-bottom: 20px;
margin-top: -61px;
padding-left: 70px;
}
.step-pic {
width: 100%;
height: 18em;
background-position: 50%;
background-size: 165%;
flex: none;
font-size: 1vw;
margin-bottom: 20px;
mix-blend-mode: darken;
}
.field--name-field-steps > div:nth-child(3) .step-pic {
background-position: 50%;
background-size: 135%;
}
.field--name-field-step-pic2,
.field--name-field-step-text {
padding: 0px 15px;
}