body,
html {
overflow-x: hidden;
}
body {
font-family: Roboto, sans-serif;
font-weight: 400;
color: #142d44;
font-size: 16px;
}
body.change-font.font-17 {
font-size: 17px;
}
body.change-font.font-18 {
font-size: 18px;
}
body.change-font.font-19 {
font-size: 19px;
}
body.change-font.font-20 {
font-size: 20px;
}
body.change-font.font-21 {
font-size: 21px;
}
body.change-font.font-22 {
font-size: 22px;
}
body.change-font.font-23 {
font-size: 23px;
}
body.change-font.font-24 {
font-size: 24px;
}
body.change-font.font-25 {
font-size: 25px;
}
body.change-font.font-26 {
font-size: 26px;
}
body.change-font.font-27 {
font-size: 27px;
}
body.change-font.font-28 {
font-size: 28px;
}
body.change-font.font-29 {
font-size: 29px;
}
body.change-font.font-30 {
font-size: 30px;
}
.container {
display: block;
width: 100%;
max-width: 1290px;
margin: auto;
padding: 0 15px;
box-sizing: border-box;
}
.container.sm {
max-width: 1130px;
}
.container.lg {
max-width: 1660px;
}
section.pt {
padding-top: 120px;
}
section.mb {
margin-bottom: 80px;
}
@media only screen and (max-width: 480px) {
section.pt {
padding-top: 60px;
}
section.mb {
margin-bottom: 40px;
}
}
section.blue {
background: #007eff;
}
.visible-mobile {
display: none;
}
@media only screen and (max-width: 992px) {
.visible-mobile {
display: block;
margin: auto;
max-width: 100%;
}
}
.header-top {
padding: 15px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.header-top ul {
display: inline-block;
}
.header-top ul li {
display: inherit;
}
.header-top .phone,
.header-top .socials {
font-size: 14px;
}
.header-top .socials ul {
margin-left: 10px;
}
.header-top .socials ul li {
margin-right: 5px;
}
.header-top .socials ul li:last-child {
margin-right: 0;
}
.header-top .socials ul li img {
max-width: 14px;
}
.header-top .phone {
display: flex;
align-items: center;
}
.header-top .phone a {
font-size: 20px;
color: #007eff;
font-weight: 500;
margin-left: 10px;
}
.header-top .lang-switcher ul li {
margin-right: 10px;
}
.header-top .lang-switcher ul li:last-child {
margin-right: 0;
}
.header-top .lang-switcher ul li a {
font-weight: 500;
text-transform: uppercase;
position: relative;
}
.header-top .lang-switcher ul li a.active,
.header-top .lang-switcher ul li a:hover {
color: #007eff;
}
.header-top .lang-switcher ul li a.active::after {
content: '';
height: 2px;
width: 100%;
background: #007eff;
position: absolute;
left: 0;
bottom: -5px;
}
.header-top .personal-cabinet {
line-height: 1;
overflow: initial;
}
.header-top .personal-cabinet a {
font-weight: 700;
transition: 0.5s;
}
.header-top .personal-cabinet a:hover {
color: #007eff;
transition: 0.5s;
}
.header-top .personal-cabinet .dropdown {
position: relative;
display: inline-block;
}
.header-top .personal-cabinet .dropdown span {
color: #142d44;
font-weight: 500;
cursor: pointer;
padding: 0 25px 15px 0;
background-image: url(../img/icons/arrow-down.svg);
background-position: right top 6px;
background-repeat: no-repeat;
}
.header-top .personal-cabinet .dropdown-content {
display: none;
position: absolute;
right: 0;
top: 30px;
background-color: #fff;
min-width: 215px;
box-shadow: 0 4px 10px rgba(151, 157, 182, 0.25);
padding: 25px;
z-index: 1;
}
.header-top .personal-cabinet .dropdown-content li {
display: block;
}
.header-top .personal-cabinet .dropdown-content a {
font-weight: 500;
padding: 10px 0;
display: block;
}
.header-top .personal-cabinet .dropdown:hover .dropdown-content {
display: block;
}
@media only screen and (min-width: 992px) {
.header-top .lang-switcher .active-language {
font-weight: 500;
text-transform: uppercase;
color: #007eff;
}
.header-top .lang-switcher .active-language img {
max-height: 16px;
margin-right: 5px;
margin-bottom: 2px;
}
.header-top .lang-switcher ul {
position: absolute;
visibility: hidden;
opacity: 0;
background: #fff;
padding: 15px;
border-bottom: 3px solid #007eff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
-webkit-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
}
.header-top .lang-switcher:hover {
cursor: pointer;
}
.header-top .lang-switcher:hover ul {
visibility: visible;
opacity: 1;
z-index: 3;
}
}
.header-main {
display: flex;
justify-content: space-between;
align-items: center;
padding: 25px 0;
position: relative;
}
.header-main nav ul {
display: inline-block;
}
.header-main nav ul li {
display: inherit;
margin-right: 25px;
position: relative;
}
.header-main nav ul li:last-child {
margin-right: 0;
}
.header-main nav ul li a {
font-weight: 500;
position: relative;
transition: 0.5s;
padding: 0 0 30px;
color: #142d44;
}
.header-main nav ul li a.active,
.header-main nav ul li a:hover {
color: #007eff;
transition: 0.5s;
}
.header-main nav ul li a.active::after {
content: '';
height: 2px;
width: 100%;
background: #007eff;
position: absolute;
left: 0;
bottom: 16px;
}
.header-main nav ul.submenu {
visibility: hidden;
opacity: 0;
transition: 0.5s;
position: absolute;
width: 300px;
left: 0;
text-align: center;
top: 34px;
padding: 30px 0 50px;
background: #fff;
border-bottom: 3px solid #007eff;
z-index: 2;
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.header-main nav ul.submenu .submenu {
top: 0;
left: 300px;
}
.header-main nav ul.submenu li {
display: block;
vertical-align: middle;
margin: 0;
padding: 6px 30px;
text-align: left;
}
.header-main nav ul.submenu li a {
padding: 0;
}
.header-main nav ul.submenu li a.active:after {
bottom: -16px;
}
.header-main nav ul > li:hover > .submenu {
visibility: visible;
opacity: 1;
transition: 0.5s;
}
.header-mobile {
display: none;
justify-content: space-between;
align-items: center;
padding: 30px 0;
}
.mobile-nav {
display: none;
height: 100%;
width: 0;
position: fixed;
z-index: 1;
left: 0;
top: 0;
background-color: #fff;
overflow-x: hidden;
transition: 0.5s;
}
.mobile-nav .wrapper {
position: relative;
width: 100vw;
padding: 30px;
box-sizing: border-box;
}
.mobile-nav .wrapper .mobile-nav-header {
position: relative;
text-align: right;
height: 50px;
margin-bottom: 30px;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet {
padding-top: 9px;
overflow: visible;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet a {
font-size: 22px;
font-weight: 500;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet .dropdown {
position: relative;
display: inline-block;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet .dropdown span {
font-weight: 500;
cursor: pointer;
padding: 0 25px 15px 0;
background-image: url(../img/icons/arrow-down.svg);
background-position: right top 6px;
background-repeat: no-repeat;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet .dropdown-content {
display: none;
position: absolute;
right: 0;
top: 30px;
background-color: #fff;
min-width: 215px;
box-shadow: 0 4px 10px rgba(151, 157, 182, 0.25);
padding: 20px;
z-index: 1;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet .dropdown-content nav {
margin: 0;
padding: 0;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet .dropdown-content li {
display: block;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet .dropdown-content a {
font-weight: 500;
padding: 10px 0;
display: block;
font-size: 18px;
}
.mobile-nav .wrapper .mobile-nav-header .personal-cabinet .dropdown:hover .dropdown-content {
display: block;
}
.mobile-nav .wrapper .mobile-nav-header .btn {
position: absolute;
left: -15px;
top: 0;
}
.mobile-nav .wrapper nav {
padding-left: 15px;
margin-bottom: 30px;
}
.mobile-nav .wrapper nav ul li a {
padding: 7px 0;
display: block;
font-weight: 500;
font-size: 22px;
color: #979db6;
transition: 0.5s;
position: relative;
}
.mobile-nav .wrapper nav ul li a.has-submenu {
background-image: url(../img/icons/arrow-down.svg);
background-repeat: no-repeat;
background-position: center right;
}
.mobile-nav .wrapper nav ul li a.has-submenu.active {
background-image: url(../img/icons/arrow-up.svg);
}
.mobile-nav .wrapper nav ul li a:hover {
color: #007eff;
transition: 0.5s;
}
.mobile-nav .wrapper nav ul li a.active {
color: #007eff;
}
.mobile-nav .wrapper nav ul li a.active:after {
content: '';
position: absolute;
bottom: 2px;
left: 0;
width: 100%;
height: 2px;
background: #007eff;
}
.mobile-nav .wrapper nav ul.submenu {
display: none;
border-bottom: 2px solid #007eff;
}
.mobile-nav .wrapper nav ul.submenu.active {
display: block;
}
.mobile-nav .wrapper nav ul.submenu li a {
font-size: 18px;
}
.mobile-nav .wrapper .mobile-nav-footer {
text-align: center;
}
.mobile-nav .wrapper .mobile-nav-footer .btn {
width: 100%;
box-sizing: border-box;
max-width: 400px;
margin-bottom: 30px;
}
.mobile-nav .wrapper .mobile-nav-footer .lang-switcher ul li {
display: inline-block;
}
.mobile-nav .wrapper .mobile-nav-footer .lang-switcher ul li a {
padding: 0 2px;
margin: 0 5px;
font-size: 20px;
font-weight: 500;
color: #979db6;
position: relative;
text-transform: uppercase;
}
.mobile-nav .wrapper .mobile-nav-footer .lang-switcher ul li a.active {
color: #007eff;
}
.mobile-nav .wrapper .mobile-nav-footer .lang-switcher ul li a.active:after {
content: '';
position: absolute;
bottom: -4px;
left: 0;
width: 100%;
height: 2px;
background: #007eff;
}
@media only screen and (max-width: 992px) {
.mobile-nav .mobile-nav-footer .lang-switcher .active-language {
display: none;
}
}
.mobile-contacts {
display: none;
height: 100%;
width: 0;
position: fixed;
z-index: 1;
right: 0;
top: 0;
background-color: #fff;
overflow-x: hidden;
transition: 0.5s;
}
.mobile-contacts .wrapper {
position: relative;
width: 100vw;
padding: 30px;
box-sizing: border-box;
text-align: center;
}
.mobile-contacts .wrapper .btn {
position: absolute;
right: 15px;
}
.mobile-contacts .wrapper .phone {
margin-top: 120px;
margin-bottom: 60px;
}
.mobile-contacts .wrapper .phone a {
display: block;
font-size: 30px;
font-weight: 500;
color: #007eff;
padding-top: 15px;
}
.mobile-contacts .wrapper .socials ul {
padding-top: 15px;
}
.mobile-contacts .wrapper .socials ul li {
display: inline-block;
}
.mobile-contacts .wrapper .socials ul li a img {
height: 26px;
margin: 0 10px;
}
@media only screen and (max-width: 992px) {
.header-mobile {
display: flex;
}
.mobile-contacts,
.mobile-nav {
display: block;
}
.header-main,
.header-top,
header .divider {
display: none;
}
}
@media only screen and (max-width: 480px) {
.header-mobile > a > img {
max-width: 190px;
}
}
.divider {
background: #142d44;
height: 1px;
opacity: 0.5;
margin: 0;
width: 100%;
border: none;
}
.divider.white {
background: #fff;
}
h1,
h2,
h3,
h4,
h5 {
color: #142d44;
line-height: 1.2;
margin-top: 0;
}
h1 {
font-size: 60px;
font-weight: 700;
}
h2 {
font-size: 50px;
font-weight: 700;
}
h2.section-title {
text-align: center;
margin-bottom: 80px;
}
h2.section-title.text-left {
text-align: left;
}
.text-after-sct {
text-align: center;
color: #142d44;
font-size: 18px;
margin-bottom: 70px;
}
h2.section-title.sct-no-marg {
margin-bottom: 10px;
}
@media only screen and (max-width: 768px) {
h2.section-title {
font-size: 40px;
}
}
@media only screen and (max-width: 480px) {
h2.section-title {
font-size: 26px;
}
}
.btn {
display: inline-block;
border-radius: 5px;
height: 50px;
line-height: 50px;
font-weight: 700;
padding: 0 20px;
border: none;
text-align: center;
transition: 0.5s;
}
.btn.btn-rounded {
border-radius: 50%;
padding: 0;
width: 50px;
}
.btn.btn-blue {
background: #007eff;
color: #fff;
-webkit-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
}
.btn.btn-blue:hover {
background: #0071e6;
-webkit-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.4);
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.4);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.4);
transition: 0.5s;
}
.btn.btn-green {
background: #2ecc71;
color: #fff;
transition: 0.5s;
}
.btn.btn-green:hover {
background: #29b765;
transition: 0.5s;
}
.btn.btn-gray {
background: #f1f2f6;
}
.btn.btn-gray:hover {
background: #e1e4ec;
transition: 0.5s;
}
.btn.btn-white {
background: #fff;
color: #007eff;
-webkit-box-shadow: 0 5px 10px 0 rgba(255, 255, 255, 0.3);
-moz-box-shadow: 0 5px 10px 0 rgba(255, 255, 255, 0.3);
box-shadow: 0 5px 10px 0 rgba(255, 255, 255, 0.3);
}
.btn.btn-white:hover {
background: #f2f2f2;
-webkit-box-shadow: 0 5px 10px 0 rgba(255, 255, 255, 0.4);
-moz-box-shadow: 0 5px 10px 0 rgba(255, 255, 255, 0.4);
box-shadow: 0 5px 10px 0 rgba(255, 255, 255, 0.4);
transition: 0.5s;
}
.btn.btn-sm {
display: inline-block;
width: auto;
height: 36px;
line-height: 36px;
font-size: 16px;
margin: 0 !important;
}
#trackingButtonMobile {
display: none;
margin: 0 0 30px;
}
@media only screen and (max-width: 992px) {
#trackingButtonMobile {
display: block;
}
}
form input,
form textarea {
display: block;
width: 100%;
box-sizing: border-box;
background: #f1f2f6;
border-radius: 5px;
border: none;
height: 60px;
line-height: 60px;
padding: 0 25px;
margin-bottom: 20px;
color: #142d44;
}
form input:focus,
form textarea:focus {
border: none;
outline: 0;
}
form input[type='checkbox'] {
height: 20px;
line-height: 20px;
display: inline-block;
width: 20px;
vertical-align: middle;
margin: 0 5px 0 0;
}
form textarea {
height: 120px;
line-height: 1.5;
padding: 25px;
}
form .btn,
form button {
width: 100%;
height: 60px;
cursor: pointer;
}
@media only screen and (max-width: 480px) {
form input,
form textarea {
height: 50px;
line-height: 50px;
}
form textarea {
height: 100px;
line-height: 1.2;
}
form .btn,
form button {
height: 50px;
line-height: 50px;
}
}
.splide .splide__slide a {
color: #142d44;
transition: 0.5s;
}
.splide .splide__slide a:hover {
color: #007eff;
transition: 0.5s;
}
.order-form {
position: relative;
margin-bottom: 3em;
}
.order-form .container {
position: relative;
}
.order-form h1 {
max-width: 684px;
margin-top: 0;
padding-top: 0.5em;
}
.order-form .form-title {
font-size: 22px;
font-weight: 500;
margin: 0 0 20px;
}
.order-form form {
max-width: 684px;
}
.order-form form input:nth-child(1),
.order-form form input:nth-child(2),
.order-form form input:nth-child(3),
.order-form form input:nth-child(4) {
width: calc(50% - 10px);
float: left;
}
.order-form form input:nth-child(1),
.order-form form input:nth-child(3) {
margin-right: 10px;
}
.order-form form input:nth-child(2),
.order-form form input:nth-child(4) {
margin-left: 10px;
}
.order-form form .error {
display: none;
background-color: #f1f2f6;
color: #ea1600;
font-weight: 500;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 20px;
border-radius: 5px;
}
.order-form form .error.active {
display: block;
}
.order-form form .error img {
margin-right: 5px;
}
.order-form form .success {
display: none;
background-color: #f1f2f6;
color: #2ecc71;
font-weight: 500;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 20px;
border-radius: 5px;
}
.order-form form .success.active {
display: block;
}
.order-form form .success img {
margin-right: 5px;
max-width: 14px;
}
.order-form .form-bg {
position: absolute;
right: 0;
top: 0;
width: 54%;
padding: 40px 0;
overflow: hidden;
}
.order-form .form-bg .bg-dark {
display: none;
position: absolute;
right: 0;
top: 0;
background: #142d44;
width: 78%;
height: 100%;
z-index: -1;
}
.order-form .form-bg button,
.order-form .form-bg h1 {
display: none;
}
@media only screen and (max-width: 480px) {
.order-form form input:nth-child(1),
.order-form form input:nth-child(2),
.order-form form input:nth-child(3),
.order-form form input:nth-child(4) {
width: 100%;
float: none;
margin-left: 0;
margin-right: 0;
}
}
.globe,
.globe-container {
width: 200px;
height: 200px;
}
.globe-container {
margin: 0 15px;
position: absolute;
display: block;
top: 50%;
right: 0;
transform-origin: right;
transform: translateY(-50%) scale(2.5);
-webkit-transform: translateY(-50%) scale(2.5);
-moz-transform: translateY(-50%) scale(2.5);
-ms-transform: translateY(-50%) scale(2.5);
}
@media only screen and (max-width: 1400px) {
.globe-container {
transform: translateY(-50%) scale(2.2);
-webkit-transform: translateY(-50%) scale(2.2);
-moz-transform: translateY(-50%) scale(2.2);
-ms-transform: translateY(-50%) scale(2.2);
}
}
@media only screen and (max-width: 1200px) {
.globe-container {
transform: translateY(-50%) scale(2);
-webkit-transform: translateY(-50%) scale(2);
-moz-transform: translateY(-50%) scale(2);
-ms-transform: translateY(-50%) scale(2);
}
}
@media only screen and (max-width: 992px) {
.globe-container {
margin: 0;
z-index: -1;
transform-origin: center;
right: auto;
left: 50%;
transform: translate(-50%, -50%) scale(2);
-webkit-transform: translate(-50%, -50%) scale(2);
-moz-transform: translate(-50%, -50%) scale(2);
-ms-transform: translate(-50%, -50%) scale(2);
}
}
@media only screen and (max-width: 480px) {
.globe-container {
transform: translate(-50%, -50%) scale(1.8);
-webkit-transform: translate(-50%, -50%) scale(1.8);
-moz-transform: translate(-50%, -50%) scale(1.8);
-ms-transform: translate(-50%, -50%) scale(1.8);
}
}
@media only screen and (max-width: 400px) {
.globe-container {
transform: translate(-50%, -50%) scale(1.5);
-webkit-transform: translate(-50%, -50%) scale(1.5);
-moz-transform: translate(-50%, -50%) scale(1.5);
-ms-transform: translate(-50%, -50%) scale(1.5);
}
}
.globe {
position: relative;
display: block;
margin: 0;
padding: 0;
top: 0;
left: 0;
}
.globe-inner-shadow,
.globe-outer-shadow,
.globe-sphere,
.globe-worldmap,
.globe-worldmap-back,
.globe-worldmap-front {
position: absolute;
display: block;
margin: 0;
}
.globe-inner-shadow,
.globe-outer-shadow,
.globe-sphere {
left: 0;
top: 0;
width: 200px;
height: 200px;
background-position: 0 0;
background-repeat: no-repeat;
}
.globe-worldmap {
left: 0;
top: 0;
width: 200px;
height: 200px;
overflow: hidden;
border-radius: 50%;
}
.globe-worldmap-back,
.globe-worldmap-front {
left: 0;
top: 0;
width: 1000px;
height: 200px;
overflow: visible;
background-image: url(../img/worldmap.svg);
background-repeat: no-repeat;
}
.globe-outer-shadow {
left: 0;
top: 186px;
width: 200px;
height: 30px;
background-image: url(../img/outer_shadow.svg);
}
.globe-inner-shadow {
background-image: url(../img/inner_shadow.svg);
}
.globe-worldmap-front {
background-position: 0 0;
animation: textureSpinreverse 12s linear infinite;
}
.globe-worldmap-back {
background-position: 0 -220px;
animation: textureSpin 12s linear infinite;
}
@keyframes textureSpin {
from {
transform: translateX(0);
}
to {
transform: translateX(-47.5%);
}
}
@keyframes textureSpinreverse {
from {
transform: translateX(-47.5%);
}
to {
transform: translateX(0);
}
}
@media only screen and (max-width: 1200px) {
.order-form h1 {
max-width: 506px;
font-size: 50px;
}
.order-form form {
max-width: 506px;
}
}
@media only screen and (max-width: 992px) {
.order-form {
margin-bottom: 60px;
}
.order-form form {
max-width: initial;
}
.order-form .form-bg {
display: none;
}
}
@media only screen and (max-width: 480px) {
.order-form h1 {
font-size: 36px;
}
.order-form .form-bg .group h1 {
font-size: 36px;
}
}
.steps {
position: relative;
}
.steps ul {
display: flex;
justify-content: space-between;
align-items: center;
background: #142d44;
}
.steps ul::after {
display: none;
content: '';
position: absolute;
background: #142d44;
width: 50%;
height: 100%;
z-index: -1;
right: 0;
top: 0;
}
.steps ul li {
width: 20%;
}
.steps ul li a {
color: #fff;
text-align: center;
width: 100%;
display: inline-block;
padding: 35px 0;
box-sizing: border-box;
white-space: nowrap;
}
.steps ul li a:hover {
background: #007eff;
}
.steps ul li a img {
display: block;
margin: auto auto 20px;
}
@media only screen and (max-width: 992px) {
.steps ul li a {
font-size: 14px;
}
}
@media only screen and (max-width: 768px) {
.steps {
background: #142d44;
padding: 40px 0 20px;
}
.steps ul {
display: block;
}
.steps ul li {
width: 100%;
}
.steps ul li a {
text-align: left;
padding: 20px 0;
font-size: 16px;
white-space: initial;
text-indent: 60px;
}
.steps ul li a img {
display: inline-block;
vertical-align: middle;
margin: 0 10px 0 0;
}
.steps ul li a br {
display: none;
}
}
@media only screen and (max-width: 480px) {
.steps ul li a {
text-indent: 30px;
}
}
.features .f-row {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 80px;
}
.features .f-row:last-child {
margin-bottom: 0;
}
.features .f-row .feature {
text-align: center;
color: #142d44;
font-size: 18px;
padding: 0 40px;
width: 33.33%;
}
.features .f-row .feature img {
display: block;
margin: auto auto 30px;
}
.features .f-row.sm {
display: none;
}
.features .f-row.sm .feature {
width: 50%;
}
@media only screen and (max-width: 900px) {
.features .f-row {
display: none;
}
.features .f-row.sm {
display: flex;
}
}
@media only screen and (max-width: 768px) {
.features .f-row .feature {
padding: 0 15px;
font-size: 16px;
}
.features .f-row .feature img {
max-width: 100%;
}
}
@media only screen and (max-width: 480px) {
.features .f-row .feature {
font-size: 13px;
}
}
.tracking-wrapper {
position: relative;
}
.tracking-wrapper .tracking-infographics {
width: auto;
max-width: 100%;
margin: auto;
display: block;
}
.tracking-wrapper .tracking-infographics-mob {
width: auto;
max-width: 100%;
margin: auto;
display: none;
}
.tracking-wrapper .way {
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;
}
.tracking-wrapper .way img {
position: absolute;
left: 0;
top: 0;
width: 100vw;
height: 84px;
}
.tracking-wrapper .way img.plane {
width: auto;
right: -6px;
left: auto;
top: 30px;
}
.tracking-wrapper .way.passed {
width: 42%;
}
.tracking-wrapper.sm {
margin-bottom: 0;
}
.tracking-wrapper.sm .way img {
width: 844px;
}
.tracking-wrapper.sm .way img.plane {
width: auto;
right: -6px;
left: auto;
top: 30px;
}
.tracking-wrapper .container {
display: flex;
justify-content: space-between;
align-items: center;
}
.tracking-wrapper .container .tracking-point {
display: inline-block;
width: calc(100% / 7);
}
.tracking-wrapper .container .tracking-point .marker {
position: relative;
display: block;
margin-bottom: 20px;
height: 26px;
}
.tracking-wrapper .container .tracking-point .marker:after {
content: '';
position: absolute;
width: 100%;
height: 1px;
border-top: 1px dashed #979db6;
top: 12px;
}
.tracking-wrapper .container .tracking-point .marker img {
position: absolute;
z-index: 1;
left: calc(50% - 13px);
}
.tracking-wrapper .container .tracking-point .marker img:nth-child(2) {
display: none;
}
.tracking-wrapper .container .tracking-point .marker .plane {
left: calc(50% - 48px);
top: -36px;
transform: rotate(-4deg);
}
.tracking-wrapper .container .tracking-point.passed .marker:after {
border-top: 1px dashed #007eff;
}
.tracking-wrapper .container .tracking-point.passed .marker img:nth-child(2) {
display: block;
}
.tracking-wrapper .container .tracking-point.passed.current .marker:after {
border-top: 1px dashed #979db6;
}
.tracking-wrapper .container .tracking-point .label {
height: 50px;
display: block;
font-size: 14px;
color: #142d44;
}
.tracking-wrapper .container .tracking-label {
display: block;
width: 100%;
}
.tracking-wrapper .container .tracking-label ul {
padding-top: 20px;
}
.tracking-wrapper .container .tracking-label ul li .error {
background-color: #f1f2f6;
color: #ea1600;
font-weight: 500;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 20px;
border-radius: 5px;
}
.tracking-wrapper .container .tracking-label ul li .error img {
margin-right: 5px;
}
.tracking-wrapper .container .tracking-label ul li .success {
background-color: #f1f2f6;
color: #2ecc71;
font-weight: 500;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 20px;
border-radius: 5px;
}
.tracking-wrapper .container .tracking-label ul li .success img {
margin-right: 5px;
max-width: 14px;
}
.tracking-wrapper .container .tracking-label ul li:last-child .error,
.tracking-wrapper .container .tracking-label ul li:last-child .success {
margin-bottom: 50px;
}
@media only screen and (max-width: 992px) {
.tracking-wrapper .container {
display: block;
}
.tracking-wrapper .container .tracking-point {
display: block;
width: 100%;
position: relative;
}
.tracking-wrapper .container .tracking-point .marker {
position: relative;
display: block;
margin: 0;
padding-bottom: 30px;
}
.tracking-wrapper .container .tracking-point .marker img:nth-child(2) {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
.tracking-wrapper .container .tracking-point .marker:after {
width: 1px;
height: 100%;
border-top: none;
border-left: 1px dashed #979db6;
top: 0;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
.tracking-wrapper .container .tracking-point .marker .plane {
left: calc(50% - 40px);
top: -38px;
transform: rotate(86deg);
}
.tracking-wrapper .container .tracking-point .label {
position: absolute;
text-align: center;
width: 100%;
top: 30px;
}
.tracking-wrapper .container .tracking-point.current .label {
top: 40px;
}
}
@media only screen and (max-width: 480px) {
.tracking-wrapper .tracking-infographics {
display: none;
}
.tracking-wrapper .tracking-infographics-mob {
display: block;
}
}
.slider-wrapper {
position: relative;
margin-bottom: 100px;
overflow-x: hidden;
}
.slider-wrapper > img {
position: relative;
z-index: 1;
}
.slider-wrapper .slider-bg {
background: #142d44;
position: absolute;
width: 80%;
height: 90%;
right: 0;
bottom: 0;
}
.slider-wrapper .slider-bg .owl-carousel {
position: absolute;
right: 0;
width: 50%;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}
.slider-wrapper .slider-bg .owl-carousel .slide {
padding: 0 30px;
}
.slider-wrapper .slider-bg .owl-carousel .slide h3 {
color: #007eff;
font-weight: 700;
margin-bottom: 10px;
}
.slider-wrapper .slider-bg .owl-carousel .slide h3.fs-50 {
font-size: 50px;
}
.slider-wrapper .slider-bg .owl-carousel .slide h3.fs-70 {
font-size: 70px;
}
.slider-wrapper .slider-bg .owl-carousel .slide h4 {
color: #fff;
font-size: 32px;
font-weight: 400;
margin-bottom: 10px;
}
.slider-wrapper .slider-bg .owl-carousel .slide h4 span {
color: #007eff;
font-weight: 700;
}
.slider-wrapper .slider-bg .owl-carousel .slide .btn {
margin-top: 50px;
}
@media only screen and (max-width: 768px) {
.slider > .container {
padding: 0;
}
.slider-wrapper .slider-bg {
width: 95%;
}
.slider-wrapper .slider-bg .owl-carousel {
width: 60%;
}
.slider-wrapper .slider-bg .owl-carousel .slide h3.fs-50 {
font-size: 30px;
}
.slider-wrapper .slider-bg .owl-carousel .slide h3.fs-70 {
font-size: 40px;
}
.slider-wrapper .slider-bg .owl-carousel .slide h4 {
font-size: 20px;
}
.slider-wrapper > img {
transform: translateX(-60%);
-webkit-transform: translateX(-60%);
-moz-transform: translateX(-60%);
-ms-transform: translateX(-60%);
}
}
@media only screen and (max-width: 600px) {
.slider-wrapper .slider-bg .owl-carousel {
width: 85%;
}
}
.info {
padding: 60px 0;
}
.info .container {
display: flex;
justify-content: space-between;
align-items: center;
}
.info .container h2 {
width: 40%;
}
.info .container .block {
width: 30%;
color: #fff;
}
.info .container .block img {
display: block;
}
.info .container .block p {
font-size: 22px;
font-weight: 700;
margin: 15px 0 25px;
}
.info .section-title {
margin: 0;
color: #fff;
}
@media only screen and (max-width: 768px) {
.info .container {
display: block;
}
.info .container .block,
.info .container h2 {
width: 100%;
margin-bottom: 40px;
text-align: center;
}
.info .container .block img {
margin: auto;
}
.info .container .block:last-child {
margin-bottom: 0;
}
}
.presentation .video-placeholder {
display: block;
margin: auto;
max-width: 100%;
}
.presentation iframe {
display: block;
margin: auto;
width: 100%;
max-width: 1060px;
height: 640px;
border: none;
}
.presentation .video-wrapper {
position: relative;
}
.presentation .video-wrapper .video-bg {
background: #007eff;
opacity: 0.2;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
width: 100%;
height: 70%;
z-index: -1;
}
.presentation .video-wrapper .video-bg-icon-1 {
position: absolute;
left: -20px;
top: 10%;
}
.presentation .video-wrapper .video-bg-icon-2 {
position: absolute;
right: 40px;
bottom: 0;
}
@media only screen and (max-width: 768px) {
.presentation iframe {
height: 480px;
}
.presentation .video-wrapper .video-bg-icon-1,
.presentation .video-wrapper .video-bg-icon-2 {
display: none;
}
}
@media only screen and (max-width: 480px) {
.presentation iframe {
height: 320px;
}
}
#gmap {
width: 100%;
height: 475px;
margin-bottom: 80px;
}
footer {
background: #133c97;
}
footer .container {
display: flex;
justify-content: space-between;
align-items: center;
}
footer .footer-main {
padding: 60px 0 100px;
}
footer .footer-main .container {
align-items: initial;
}
footer .footer-main .block {
color: #fff;
}
footer .footer-main .block .divider {
margin: 20px 0;
}
footer .footer-main .block:nth-child(1) {
max-width: 300px;
font-size: 15px;
}
footer .footer-main .block:nth-child(1) p {
margin: 0 0 15px;
}
footer .footer-main .block:nth-child(1) p img {
margin-right: 5px;
}
footer .footer-main .block:nth-child(3) {
max-width: 290px;
}
footer .footer-main .block .section-title {
font-size: 14px;
height: 32px;
margin-bottom: 15px;
}
footer .footer-main .block .phone {
display: block;
font-size: 26px;
font-weight: 500;
margin-bottom: 30px;
}
footer .footer-main .block nav li a {
line-height: 24px;
}
footer .footer-main .block nav li a:hover {
text-decoration: underline;
}
footer .footer-bottom {
padding: 20px 0;
color: #fff;
font-size: 14px;
}
footer .footer-bottom a:hover {
text-decoration: underline;
}
footer .footer-bottom .socials ul li {
display: inline-block;
margin-left: 5px;
}
footer .footer-bottom .socials ul li img {
max-width: 19px;
}
@media only screen and (max-width: 1200px) {
footer .footer-main {
overflow: hidden;
}
footer .footer-main > .container {
display: block;
}
footer .footer-main .block {
float: left;
width: 50%;
padding-right: 60px;
box-sizing: border-box;
}
footer .footer-main .block:nth-child(2n) {
padding-right: 0;
}
footer .footer-main .block:nth-child(1),
footer .footer-main .block:nth-child(3) {
max-width: none;
}
}
@media only screen and (max-width: 768px) {
footer .footer-main {
padding: 60px 0 20px;
}
footer .footer-main .block {
float: none;
width: 100%;
padding: 0;
text-align: center;
}
footer .footer-main .block .section-title {
height: auto;
margin-bottom: 5px;
}
footer .footer-main .block nav {
display: none;
}
footer .footer-bottom {
padding-top: 60px;
position: relative;
}
footer .footer-bottom .copyright {
text-align: center;
}
footer .footer-bottom .socials {
position: absolute;
top: 20px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
footer .footer-bottom .socials img {
height: 26px;
}
}
.confirmation,
.login,
.registration,
.restoration {
display: flex;
justify-content: space-between;
align-items: center;
background: #fff;
height: 100vh;
width: 0;
position: fixed;
left: 0;
top: 0;
transition: 0.5s;
overflow: hidden;
}
.confirmation.static,
.login.static,
.registration.static,
.restoration.static {
position: static;
width: 100%;
}
.confirmation .form-bg,
.confirmation .form-wrapper,
.login .form-bg,
.login .form-wrapper,
.registration .form-bg,
.registration .form-wrapper,
.restoration .form-bg,
.restoration .form-wrapper {
width: 50vw;
height: 100%;
box-sizing: border-box;
}
.confirmation .form-bg,
.login .form-bg,
.registration .form-bg,
.restoration .form-bg {
background: url(../img/form-bg.png);
background-color: #007eff;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.confirmation .form-wrapper,
.login .form-wrapper,
.registration .form-wrapper,
.restoration .form-wrapper {
padding: 100px 60px;
}
.confirmation .form-wrapper form .close,
.login .form-wrapper form .close,
.registration .form-wrapper form .close,
.restoration .form-wrapper form .close {
display: inline-block;
margin-bottom: 60px;
}
.confirmation .form-wrapper form button,
.confirmation .form-wrapper form input,
.login .form-wrapper form button,
.login .form-wrapper form input,
.registration .form-wrapper form button,
.registration .form-wrapper form input,
.restoration .form-wrapper form button,
.restoration .form-wrapper form input {
max-width: 540px;
margin-bottom: 30px;
}
.confirmation .form-wrapper form .form-title,
.confirmation .form-wrapper form label,
.confirmation .form-wrapper form p,
.login .form-wrapper form .form-title,
.login .form-wrapper form label,
.login .form-wrapper form p,
.registration .form-wrapper form .form-title,
.registration .form-wrapper form label,
.registration .form-wrapper form p,
.restoration .form-wrapper form .form-title,
.restoration .form-wrapper form label,
.restoration .form-wrapper form p {
color: #142d44;
}
.confirmation .form-wrapper form .form-title,
.login .form-wrapper form .form-title,
.registration .form-wrapper form .form-title,
.restoration .form-wrapper form .form-title {
font-size: 50px;
margin-bottom: 30px;
font-weight: bold;
}
.page-main-banner {
width: 100%;
max-width: 300px;
float: left;
margin: 0 30px 20px 0 !important;
}
@media only screen and (max-width: 768px) {
.page-main-banner {
display: block;
float: none;
margin: 0 auto 20px !important;
}
}
.page > .container > .page-content h2 {
font-size: 16px;
}
.confirmation .form-wrapper form p,
.login .form-wrapper form p,
.registration .form-wrapper form p,
.restoration .form-wrapper form p {
max-width: 540px;
text-align: center;
font-weight: 700;
margin: 20px 0;
}
.confirmation .form-wrapper form .group,
.login .form-wrapper form .group,
.registration .form-wrapper form .group,
.restoration .form-wrapper form .group {
display: flex;
justify-content: space-between;
align-items: center;
max-width: 540px;
margin-bottom: 30px;
}
.confirmation .form-wrapper form input[type='checkbox'],
.login .form-wrapper form input[type='checkbox'],
.registration .form-wrapper form input[type='checkbox'],
.restoration .form-wrapper form input[type='checkbox'] {
width: 18px;
height: 18px;
display: initial;
margin: 0;
vertical-align: middle;
margin-bottom: 2px;
margin-right: 5px;
}
.confirmation .form-wrapper form a,
.login .form-wrapper form a,
.registration .form-wrapper form a,
.restoration .form-wrapper form a {
color: #007eff;
}
.confirmation .form-wrapper form a:hover,
.login .form-wrapper form a:hover,
.registration .form-wrapper form a:hover,
.restoration .form-wrapper form a:hover {
text-decoration: underline;
}
.confirmation .form-wrapper .info-block,
.login .form-wrapper .info-block,
.registration .form-wrapper .info-block,
.restoration .form-wrapper .info-block {
max-width: 540px;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 30px;
}
.confirmation .form-wrapper .info-block .block-title,
.login .form-wrapper .info-block .block-title,
.registration .form-wrapper .info-block .block-title,
.restoration .form-wrapper .info-block .block-title {
background-image: url(../img/icons/important-blue.svg);
margin: 10px 0;
}
.confirmation .form-wrapper .info-block .block-title.important,
.login .form-wrapper .info-block .block-title.important,
.registration .form-wrapper .info-block .block-title.important,
.restoration .form-wrapper .info-block .block-title.important {
color: #007eff;
}
.confirmation .form-wrapper .info-block p,
.login .form-wrapper .info-block p,
.registration .form-wrapper .info-block p,
.restoration .form-wrapper .info-block p {
max-width: initial;
text-align: left;
font-weight: 400;
margin: 10px 0;
}
.confirmation .form-wrapper .error,
.login .form-wrapper .error,
.registration .form-wrapper .error,
.restoration .form-wrapper .error {
display: none;
background-color: #f1f2f6;
color: #ea1600;
font-weight: 500;
max-width: 540px;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 30px;
border-radius: 5px;
}
.confirmation .form-wrapper .error.active,
.login .form-wrapper .error.active,
.registration .form-wrapper .error.active,
.restoration .form-wrapper .error.active {
display: block;
}
.confirmation .form-wrapper .error img,
.login .form-wrapper .error img,
.registration .form-wrapper .error img,
.restoration .form-wrapper .error img {
margin-right: 5px;
}
.confirmation .form-wrapper .success,
.login .form-wrapper .success,
.registration .form-wrapper .success,
.restoration .form-wrapper .success {
display: none;
background-color: #f1f2f6;
color: #2ecc71;
font-weight: 500;
max-width: 540px;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 30px;
border-radius: 5px;
}
.confirmation .form-wrapper .success.active,
.login .form-wrapper .success.active,
.registration .form-wrapper .success.active,
.restoration .form-wrapper .success.active {
display: block;
}
.confirmation .form-wrapper .success img,
.login .form-wrapper .success img,
.registration .form-wrapper .success img,
.restoration .form-wrapper .success img {
margin-right: 5px;
max-width: 14px;
}
@media only screen and (max-width: 768px) {
.confirmation .form-bg,
.login .form-bg,
.registration .form-bg,
.restoration .form-bg {
display: none;
}
.confirmation .form-wrapper,
.login .form-wrapper,
.registration .form-wrapper,
.restoration .form-wrapper {
width: 100vw;
}
.confirmation .form-wrapper form .form-title,
.login .form-wrapper form .form-title,
.registration .form-wrapper form .form-title,
.restoration .form-wrapper form .form-title {
font-size: 35px;
}
.confirmation .form-wrapper form .group,
.confirmation .form-wrapper form button,
.confirmation .form-wrapper form input,
.confirmation .form-wrapper form p,
.login .form-wrapper form .group,
.login .form-wrapper form button,
.login .form-wrapper form input,
.login .form-wrapper form p,
.registration .form-wrapper form .group,
.registration .form-wrapper form button,
.registration .form-wrapper form input,
.registration .form-wrapper form p,
.restoration .form-wrapper form .group,
.restoration .form-wrapper form button,
.restoration .form-wrapper form input,
.restoration .form-wrapper form p {
display: block;
margin-left: auto;
margin-right: auto;
}
}
@media only screen and (max-width: 480px) {
.confirmation .form-wrapper,
.login .form-wrapper,
.registration .form-wrapper,
.restoration .form-wrapper {
padding: 100px 30px;
}
.confirmation .form-wrapper form .form-title,
.login .form-wrapper form .form-title,
.registration .form-wrapper form .form-title,
.restoration .form-wrapper form .form-title {
font-size: 30px;
}
}
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: #000;
background-color: rgba(0, 0, 0, 0.4);
}
.invoice .modal-content,
.new-address .modal-content,
.new-consignee .modal-content,
.tracking .modal-content {
background: #fff;
width: 100%;
max-width: 844px;
margin: 100px auto;
box-sizing: border-box;
padding-bottom: 50px;
position: relative;
}
.invoice .modal-content .close-modal,
.new-address .modal-content .close-modal,
.new-consignee .modal-content .close-modal,
.tracking .modal-content .close-modal {
position: absolute;
right: 25px;
top: 25px;
transition: 0.5s;
}
.invoice .modal-content .close-modal:hover path,
.new-address .modal-content .close-modal:hover path,
.new-consignee .modal-content .close-modal:hover path,
.tracking .modal-content .close-modal:hover path {
fill: #007eff;
transition: 0.5s;
}
.invoice form,
.new-address form,
.new-consignee form,
.tracking form {
padding: 100px 80px 50px;
}
.invoice form .form-title,
.new-address form .form-title,
.new-consignee form .form-title,
.tracking form .form-title {
font-size: 40px;
font-weight: 700;
text-align: center;
margin-bottom: 40px;
}
@media only screen and (max-width: 480px) {
.tracking form {
padding: 80px 15px 20px;
}
.tracking form .form-title {
font-size: 30px;
}
}
.new-address .select2 {
width: 100% !important;
margin: 0 0 20px;
}
.new-address .select2-container .select2-selection--single {
background: #f1f2f6;
height: 60px;
border: none;
border-radius: 5px;
}
.new-address .select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: 60px;
padding: 0 25px;
color: #142d44;
}
.invoice form input {
height: 44px;
line-height: 44px;
font-size: 14px;
}
.invoice form input[type='checkbox'] {
height: 20px !important;
line-height: 20px !important;
}
.invoice .blank .labels-block li {
height: 44px;
}
.invoice .blank .labels-block li span {
font-size: 14px;
}
.invoice .blank .grid li ul li:nth-child(1) {
height: 44px;
line-height: 44px;
}
.invoice .blank .grid li .grid-header li {
font-size: 14px;
}
.invoice .blank .form-group {
text-align: left !important;
}
.invoice .blank .form-group input {
margin-left: 0;
width: 80%;
}
.invoice .blank .form-group label:first-child {
display: block;
text-align: left;
margin-bottom: 5px;
}
.invoice .blank .signature .signature-trigger {
height: 44px;
line-height: 44px;
}
.invoice .blank .passport .upload {
max-width: none;
width: auto;
height: 44px;
line-height: 44px;
}
.invoice .blank .btn {
margin: 0 auto;
}
.personal-cabinet {
overflow: hidden;
}
.personal-cabinet .sidebar {
display: inline-block;
width: 320px;
padding: 60px 30px;
margin-bottom: 80px;
box-sizing: border-box;
background-color: #f1f2f6;
}
.personal-cabinet .sidebar nav li a {
padding: 25px 0;
display: inline-block;
position: relative;
font-weight: 500;
transition: 0.4s;
}
.personal-cabinet .sidebar nav li a:hover {
color: #007eff;
transition: 0.4s;
}
.personal-cabinet .sidebar nav li a:first-child {
padding-top: 0;
}
.personal-cabinet .sidebar nav li a.active {
color: #007eff;
}
.personal-cabinet .sidebar nav li a.active:after {
content: '';
position: absolute;
border-bottom: 2px solid #007eff;
left: 0;
bottom: 20px;
width: 100%;
}
.personal-cabinet .sidebar nav li:last-child a {
padding-bottom: 0;
}
.personal-cabinet .sidebar nav li:last-child a.active:after {
bottom: -5px;
}
.personal-cabinet .sidebar.left {
float: left;
}
.personal-cabinet .page-content {
width: calc(100% - 320px);
float: left;
padding-left: 30px;
box-sizing: border-box;
}
.personal-cabinet .page-content h1 {
font-size: 30px;
margin-bottom: 30px;
}
.personal-cabinet .page-content .history .shipment {
overflow: hidden;
margin-bottom: 30px;
}
.personal-cabinet .page-content .history .shipment.header {
background-color: rgba(0, 126, 255, 0.1);
padding: 20px 0;
border-radius: 3px;
}
.personal-cabinet .page-content .history .shipment div {
display: inline-block;
text-align: center;
box-sizing: border-box;
}
.personal-cabinet .page-content .history .shipment div label {
display: none;
}
.personal-cabinet .page-content .history .shipment div:nth-child(1) {
width: 30%;
}
.personal-cabinet .page-content .history .shipment div:nth-child(2) {
width: 30%;
}
.personal-cabinet .page-content .history .shipment div:nth-child(3) {
width: 30%;
}
.personal-cabinet .page-content .history .shipment div:nth-child(4) {
width: 20%;
}
.personal-cabinet .page-content .history .shipment div:nth-child(5) {
width: 20%;
}
.personal-cabinet .page-content .history .shipment .status {
display: inline-block;
color: #fff;
padding: 2px 12px;
border-radius: 3px;
}
.personal-cabinet .page-content .history .shipment .status-1 {
background: #95afc0;
}
.personal-cabinet .page-content .history .shipment .status-2 {
background: #48dbfb;
}
.personal-cabinet .page-content .history .shipment .status-3 {
background: #00a8ff;
}
.personal-cabinet .page-content .history .shipment .status-4 {
background: #4cd137;
}
.personal-cabinet .page-content .history .shipment .status-5 {
background: #4cd137;
}
.personal-cabinet .page-content .history .shipment .status-6 {
background: #f1c40f;
}
.personal-cabinet .page-content .history .shipment .status-7 {
background: #c0392b;
}
.personal-cabinet .page-content .addresses h2 {
font-size: 20px;
margin-bottom: 20px;
}
.personal-cabinet .page-content .addresses h2 a.btn {
float: right;
box-shadow: none;
}
.personal-cabinet .page-content .addresses .btn {
margin-bottom: 20px;
}
.personal-cabinet .page-content .addresses .address-group {
margin-right: -10px;
margin-left: -10px;
margin-bottom: 20px;
}
.personal-cabinet .page-content .addresses .address {
display: inline-block;
box-sizing: border-box;
background: #f1f2f6;
border: 1px solid #007eff;
padding: 30px;
border-radius: 5px;
margin: 0 10px 25px;
width: calc(33% - 20px);
}
.personal-cabinet .page-content .addresses .address p {
margin: 0 0 10px;
color: #142d44;
}
.personal-cabinet .page-content .addresses .address .action-group {
padding-top: 15px;
}
.personal-cabinet .page-content .addresses .address .action-group li {
display: inline-block;
}
.personal-cabinet .page-content .addresses .address .action-group li:nth-child(2) {
float: right;
}
.personal-cabinet .page-content .addresses .address .action-group li a {
font-weight: 500;
}
.personal-cabinet .page-content .addresses .address .action-group li a:hover {
color: #007eff;
transition: 0.4s;
}
.personal-cabinet .page-content .address-form,
.personal-cabinet .page-content .pickup-address-form {
margin-bottom: 80px;
overflow: hidden;
}
.personal-cabinet .page-content .address-form .input-container,
.personal-cabinet .page-content .pickup-address-form .input-container {
margin-left: -10px;
margin-right: -10px;
}
.personal-cabinet .page-content .address-form .select2,
.personal-cabinet .page-content .pickup-address-form .select2 {
width: calc(50% - 20px) !important;
float: left;
margin: 0 10px 20px;
}
.personal-cabinet .page-content .address-form .select2-container .select2-selection--single,
.personal-cabinet .page-content .pickup-address-form .select2-container .select2-selection--single {
background: #f1f2f6;
height: 60px;
border: none;
border-radius: 5px;
}
.personal-cabinet .page-content .address-form .select2-container--default .select2-selection--single .select2-selection__rendered,
.personal-cabinet .page-content .pickup-address-form .select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: 60px;
padding: 0 25px;
color: #142d44;
}
.personal-cabinet .page-content .address-form input.half-width,
.personal-cabinet .page-content .pickup-address-form input.half-width {
width: calc(50% - 20px);
float: left;
margin: 0 10px 20px;
}
.personal-cabinet .page-content .address-form .group.half-width,
.personal-cabinet .page-content .pickup-address-form .group.half-width {
width: calc(50% - 20px);
float: left;
margin: 0 10px;
}
.personal-cabinet .page-content .address-form .group.half-width input.half-width,
.personal-cabinet .page-content .pickup-address-form .group.half-width input.half-width {
width: calc(50% - 10px);
float: left;
}
.personal-cabinet .page-content .address-form .group.half-width input.half-width:nth-child(1),
.personal-cabinet .page-content .pickup-address-form .group.half-width input.half-width:nth-child(1) {
margin-left: 0;
margin-right: 10px;
margin-bottom: 20px;
}
.personal-cabinet .page-content .address-form .group.half-width input.half-width:nth-child(2),
.personal-cabinet .page-content .pickup-address-form .group.half-width input.half-width:nth-child(2) {
margin-left: 10px;
margin-right: 0;
margin-bottom: 20px;
}
.personal-cabinet .page-content .pickup-address-form {
width: calc(45% - 20px);
margin-right: 20px;
float: left;
}
.personal-cabinet .page-content .pickup-address-form input {
height: 50px;
line-height: 50px;
}
.personal-cabinet .page-content .autocomplete-map {
float: right;
width: 55%;
height: 400px;
margin-bottom: 20px;
}
.personal-cabinet .page-content .consignees h2 {
font-size: 20px;
margin-bottom: 20px;
}
.personal-cabinet .page-content .consignees h2 a.btn {
float: right;
box-shadow: none;
}
.personal-cabinet .page-content .consignees .btn {
margin-bottom: 20px;
}
.personal-cabinet .page-content .consignees .consignee-group {
margin-right: -10px;
margin-left: -10px;
margin-bottom: 20px;
}
.personal-cabinet .page-content .consignees .consignee {
display: inline-block;
box-sizing: border-box;
background: #f1f2f6;
border: 1px solid #007eff;
padding: 30px;
border-radius: 5px;
margin: 0 10px 25px;
width: calc(33% - 20px);
}
.personal-cabinet .page-content .consignees .consignee p {
margin: 0 0 10px;
color: #142d44;
}
.personal-cabinet .page-content .consignees .consignee .action-group {
padding-top: 15px;
}
.personal-cabinet .page-content .consignees .consignee .action-group li {
display: inline-block;
}
.personal-cabinet .page-content .consignees .consignee .action-group li:nth-child(2) {
float: right;
}
.personal-cabinet .page-content .consignees .consignee .action-group li a {
font-weight: 500;
}
.personal-cabinet .page-content .consignees .consignee .action-group li a:hover {
color: #007eff;
transition: 0.4s;
}
.personal-cabinet .page-content .shipment h2 {
font-size: 20px;
overflow: hidden;
margin-bottom: 25px;
}
.personal-cabinet .page-content .shipment h2 a.btn {
float: right;
box-shadow: none;
}
.personal-cabinet .page-content .shipment h2 a.view-invoice-link {
margin-left: 10px;
}
.personal-cabinet .page-content .shipment h2 .switch {
float: right;
}
.shipment-group.addresses {
display: flex;
flex-wrap: wrap;
}
.invoice .modal-content {
width: 95%;
max-width: 100% !important;
}
.change-name-form-wrapper {
display: none;
}
.personal-cabinet .page-content .shipment .shipment-group {
margin-left: -10px;
margin-right: -10px;
}
.personal-cabinet .page-content .shipment .switch {
position: relative;
display: inline-block;
width: 60px;
height: 30px;
margin: 5px 0 0 0;
}
.personal-cabinet .page-content .shipment .switch input {
opacity: 0;
width: 0;
height: 0;
}
.personal-cabinet .page-content .shipment .slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #f1f2f6;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.personal-cabinet .page-content .shipment .slider:before {
position: absolute;
content: '';
height: 22px;
width: 22px;
left: 4px;
bottom: 4px;
background-color: #fff;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.personal-cabinet .page-content .shipment input:checked + .slider {
background-color: #007eff;
}
.personal-cabinet .page-content .shipment input:focus + .slider {
box-shadow: 0 0 1px #007eff;
}
.personal-cabinet .page-content .shipment input:checked + .slider:before {
-webkit-transform: translateX(30px);
-ms-transform: translateX(30px);
transform: translateX(30px);
}
.personal-cabinet .page-content .shipment .slider.round {
border-radius: 34px;
}
.personal-cabinet .page-content .shipment .slider.round:before {
border-radius: 50%;
}
.personal-cabinet .page-content .shipment .half-width {
display: inline-block;
width: calc(50% - 20px);
float: left;
margin: 0 10px;
}
.personal-cabinet .page-content .shipment .box-container {
display: block;
width: 100%;
overflow: hidden;
}
.personal-cabinet .page-content .shipment .box-container .divider {
margin-bottom: 15px;
}
.personal-cabinet .page-content .shipment .container {
display: inline-block;
box-sizing: border-box;
background: #f1f2f6;
border: 1px solid #007eff;
color: #142d44;
padding: 30px;
border-radius: 5px;
margin: 0 10px 25px;
width: calc(33% - 20px);
position: relative;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.personal-cabinet .page-content .shipment .container p {
margin: 0 0 10px;
}
.personal-cabinet .page-content .shipment .container.btn {
background: #007eff;
color: #fff;
transition: 0.5s;
}
.personal-cabinet .page-content .shipment .container.btn:hover {
background: #0071e6;
transition: 0.5s;
}
.personal-cabinet .page-content .shipment .half-width .container {
width: 100%;
margin: 0 0 25px;
}
.personal-cabinet .page-content .shipment .container input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.personal-cabinet .page-content .shipment .checkmark {
position: absolute;
top: 10px;
right: 10px;
height: 24px;
width: 24px;
background-image: url(../img/icons/radio-unchecked.svg);
background-position: center;
background-repeat: no-repeat;
border-radius: 50%;
}
.personal-cabinet .page-content .shipment .container:hover input ~ .checkmark {
background-image: url(../img/icons/radio-checked.svg);
}
.personal-cabinet .page-content .shipment .container input:checked ~ .checkmark {
background-image: url(../img/icons/radio-checked.svg);
}
.personal-cabinet .page-content .shipment .btn.btn-blue {
margin-bottom: 80px;
}
.personal-cabinet .page-content .personal-data {
overflow: hidden;
}
.personal-cabinet .page-content .personal-data .data {
display: inline-block;
float: left;
margin-right: 50px;
}
.personal-cabinet .page-content .personal-data .data p a {
color: #007eff;
}
.personal-cabinet .page-content .personal-data .data .change-email-form-wrapper {
visibility: hidden;
opacity: 0;
transition: 0.4s;
}
.personal-cabinet .page-content .personal-data .data .change-email-form-wrapper.show {
visibility: visible;
opacity: 1;
transition: 0.4s;
}
.personal-cabinet .page-content .personal-data .passport {
float: right;
}
.personal-cabinet .page-content .personal-data .passport .preview {
margin-bottom: 20px;
}
.personal-cabinet .page-content .personal-data .passport .preview img {
display: block;
margin-bottom: 20px;
}
.personal-cabinet .page-content .personal-data .passport .preview img:last-child {
margin-bottom: 0;
}
.personal-cabinet .page-content .personal-data .passport .upload {
margin-bottom: 60px;
}
.personal-cabinet .page-content .personal-data .passport .upload input[type='file'] {
display: none;
}
@media only screen and (max-width: 992px) {
.personal-cabinet .sidebar {
background-color: #007eff;
width: 100%;
float: none !important;
padding: 20px;
margin-bottom: 30px;
overflow-x: auto;
}
.personal-cabinet .sidebar nav {
white-space: nowrap;
}
.personal-cabinet .sidebar nav li {
display: inline-block;
}
.personal-cabinet .sidebar nav li:last-child {
margin-right: 0;
}
.personal-cabinet .sidebar nav li a {
color: #fff;
padding: 0 15px;
}
.personal-cabinet .sidebar nav li a.active {
color: #fff;
}
.personal-cabinet .sidebar nav li a.active:after {
border-bottom: 2px solid #fff;
bottom: -10px;
}
.personal-cabinet .page-content {
width: 100%;
padding: 0;
}
.personal-cabinet .page-content .addresses .address {
width: calc(49.7% - 20px);
}
.personal-cabinet .page-content .consignees .consignee {
width: calc(49.7% - 20px);
}
.personal-cabinet .page-content .shipment .container {
width: calc(49.7% - 20px);
}
}
@media only screen and (max-width: 768px) {
.personal-cabinet .page-content .history .shipment {
border-bottom: 2px solid rgba(0, 126, 255, 0.6);
padding-bottom: 30px;
}
.personal-cabinet .page-content .history .shipment.header {
display: none;
}
.personal-cabinet .page-content .history .shipment div {
margin-bottom: 10px;
color: #142d44;
}
.personal-cabinet .page-content .history .shipment div:last-child {
margin-bottom: 0;
}
.personal-cabinet .page-content .history .shipment div label {
display: inline-block;
float: left;
font-weight: 500;
margin-right: 10px;
}
.personal-cabinet .page-content .history .shipment div:nth-child(1),
.personal-cabinet .page-content .history .shipment div:nth-child(2),
.personal-cabinet .page-content .history .shipment div:nth-child(3),
.personal-cabinet .page-content .history .shipment div:nth-child(4),
.personal-cabinet .page-content .history .shipment div:nth-child(5) {
width: 100%;
text-align: right;
}
.personal-cabinet .page-content .addresses .address-group {
margin-right: 0;
margin-left: 0;
}
.personal-cabinet .page-content .addresses .address {
width: 100%;
margin-right: 0;
margin-left: 0;
}
.personal-cabinet .page-content .consignees .consignee-group {
margin-right: 0;
margin-left: 0;
}
.personal-cabinet .page-content .consignees .consignee {
width: 100%;
margin-right: 0;
margin-left: 0;
}
.personal-cabinet .page-content .shipment .shipment-group {
margin-right: 0;
margin-left: 0;
}
.personal-cabinet .page-content .shipment .half-width {
width: 100%;
margin: 0;
}
.personal-cabinet .page-content .shipment .container {
width: 100%;
margin-right: 0;
margin-left: 0;
}
.personal-cabinet .page-content .pickup-address-form {
width: 100%;
float: none;
}
.personal-cabinet .page-content .autocomplete-map {
width: 100%;
float: none;
}
}
h1.page-title {
color: #007eff;
font-size: 40px;
margin: 0 0 50px;
}
@media only screen and (max-width: 480px) {
h1.page-title {
font-size: 24px;
margin: 0 0 20px;
}
}
ul.breadcrumb {
padding: 25px 0 0;
font-size: 0;
}
ul.breadcrumb li {
display: inline-block;
}
ul.breadcrumb li a {
font-size: 16px;
}
ul.breadcrumb li:after {
content: '>';
margin: 0 10px;
font-size: 16px;
}
ul.breadcrumb li a:hover {
color: #007eff;
}
ul.breadcrumb li.active {
color: #007eff;
font-size: 16px;
}
ul.breadcrumb li.active:after {
display: none;
}
@media only screen and (max-width: 768px) {
ul.breadcrumb {
display: none;
}
}
.services .form-title {
font-size: 22px;
margin-bottom: 20px;
}
.services form {
width: 100%;
max-width: 684px;
}
.services form input {
width: calc(50% - 10px);
float: left;
}
.services form input:nth-child(1),
.services form input:nth-child(3) {
margin-right: 10px;
}
.services form input:nth-child(2),
.services form input:nth-child(4) {
margin-left: 10px;
}
.services .wrapper {
background: url(../img/courier-1.png);
background-position: right center;
background-repeat: no-repeat;
background-size: contain;
padding: 40px 0;
}
.services .page-content {
padding-top: 100px;
}
.services .page-content h3 {
font-size: 35px;
margin-bottom: 40px;
font-weight: 700;
text-align: center;
}
@media only screen and (max-width: 992px) {
.services form {
max-width: initial;
}
.services .wrapper {
background: 0 0;
}
}
@media only screen and (max-width: 480px) {
.services form input {
width: 100%;
float: none;
margin-left: 0 !important;
margin-right: 0 !important;
}
}
.about .about-group {
width: 55%;
float: left;
}
.about .container > img {
width: 45%;
display: inline-block;
}
.about .short-content {
width: 100%;
max-width: 684px;
}
.about .short-content .page-subtitle {
font-size: 22px;
margin-bottom: 30px;
}
.about .short-content p {
color: #142d44;
margin: 0 0 25px;
}
.about .wrapper {
background-position: right center;
background-repeat: no-repeat;
background-size: contain;
padding: 40px 0;
}
.about .presentation h2 {
color: #142d44;
font-size: 30px;
margin-bottom: 30px;
}
.about .page-content {
padding-top: 100px;
}
.about .page-content h3 {
font-size: 35px;
margin-bottom: 40px;
font-weight: 700;
text-align: center;
}
@media only screen and (max-width: 992px) {
.about .about-group {
width: 100%;
float: none;
}
.about .container > img {
display: block;
margin: auto;
width: auto;
max-width: 100%;
}
.about .short-content {
max-width: initial;
}
.about .wrapper {
background: 0 0;
}
}
.contacts .contacts-formgroup {
max-width: calc(55% - 60px);
margin-right: 60px;
float: left;
}
.contacts .form-title {
font-size: 22px;
margin-bottom: 20px;
}
.contacts form {
width: 100%;
}
.contacts form input {
width: calc(50% - 10px);
float: left;
}
.contacts form input:nth-child(1),
.contacts form input:nth-child(3) {
margin-right: 10px;
}
.contacts form input:nth-child(2),
.contacts form input:nth-child(4) {
margin-left: 10px;
}
.contacts form .error {
display: none;
background-color: #f1f2f6;
color: #ea1600;
font-weight: 500;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 20px;
border-radius: 5px;
}
.contacts form .error.active {
display: block;
}
.contacts form .error img {
margin-right: 5px;
}
.contacts form .success {
display: none;
background-color: #f1f2f6;
color: #2ecc71;
font-weight: 500;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 20px;
border-radius: 5px;
}
.contacts form .success.active {
display: block;
}
.contacts form .success img {
margin-right: 5px;
max-width: 14px;
}
.contacts .contacts-data {
box-sizing: border-box;
display: inline-block;
padding: 35px 40px;
background-color: #007eff;
color: #fff;
width: 45%;
height: 100%;
right: 0;
top: 0;
}
.contacts .contacts-data p {
margin: 0 0 20px;
}
.contacts .contacts-data p img {
margin-right: 10px;
}
.contacts .contacts-data p span {
margin-right: 30px;
vertical-align: middle;
}
.contacts .contacts-data .group {
display: inline-block;
margin-right: 15px;
}
.contacts .contacts-data .group a {
font-size: 26px;
display: block;
}
.contacts .contacts-data ul {
padding: 20px 0 20px 40px;
background-image: url(../img/icons/email-light.svg);
background-repeat: no-repeat;
background-position: left top 20px;
}
.contacts .contacts-data ul li {
line-height: 1;
margin-bottom: 15px;
}
.contacts .contacts-data ul li:last-child {
margin-bottom: 0;
}
.contacts .contacts-data ul.separate {
border-top: 1px solid rgba(255, 255, 255, 0.5);
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
background-image: url(../img/icons/phone-light.svg);
background-position: left top 26px;
max-width: 450px;
}
.contacts .contacts-data ul.separate li {
margin-bottom: 10px;
}
.contacts .contacts-data ul.separate a {
font-size: 26px;
vertical-align: middle;
padding-left: 15px;
}
.contacts .contacts-data ul a {
padding-left: 5px;
}
.contacts .contacts-data div.separate {
border-top: 1px solid rgba(255, 255, 255, 0.5);
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
padding: 20px 0 0 40px;
}
.contacts .wrapper {
overflow: hidden;
padding: 40px 0;
position: relative;
}
.contacts .page-content {
padding-top: 100px;
}
.contacts .page-content h3 {
font-size: 35px;
margin-bottom: 40px;
font-weight: 700;
text-align: center;
}
@media only screen and (max-width: 992px) {
.contacts form {
max-width: none;
float: none;
margin-bottom: 40px;
}
.contacts .contacts-data {
position: relative;
width: 100%;
}
.contacts .contacts-formgroup {
float: none;
max-width: none;
margin-right: 0;
}
}
@media only screen and (max-width: 666px) {
.contacts .contacts-data ul.separate a {
font-size: 24px;
display: block;
padding: 0;
}
}
@media only screen and (max-width: 480px) {
.contacts form input {
width: 100%;
float: none;
margin-right: 0 !important;
margin-left: 0 !important;
}
.contacts .contacts-data {
padding: 30px 20px;
}
}
.calculate .form-title {
font-size: 22px;
margin-bottom: 20px;
}
.calculate form {
width: 100%;
max-width: 684px;
}
.calculate form .dimensions {
overflow: hidden;
}
.calculate form .dimensions input {
width: calc(33.3% - 13.33px);
float: left;
margin-right: 20px;
}
.calculate form .dimensions input:last-child {
margin-right: 0;
}
.calculate form .select2 {
width: 100% !important;
margin-bottom: 20px;
}
.calculate form .select2-container .select2-selection--single {
background: #f1f2f6;
height: 60px;
border: none;
border-radius: 5px;
}
.calculate form .select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: 60px;
padding: 0 25px;
color: #142d44;
}
.calculate .wrapper {
background: url(../img/calculator.png);
background-position: right center;
background-repeat: no-repeat;
background-size: contain;
padding: 40px 0;
}
.calculate .page-content {
padding-top: 100px;
}
.calculate .page-content h3 {
font-size: 35px;
margin-bottom: 40px;
font-weight: 700;
text-align: center;
}
.calculate .success {
background-color: #f1f2f6;
color: #2ecc71;
font-weight: 500;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 20px;
border-radius: 5px;
}
.calculate .success img {
margin-right: 5px;
max-width: 14px;
}
.calculate .error {
background-color: #f1f2f6;
color: #ea1600;
font-weight: 500;
box-sizing: border-box;
padding: 15px 25px;
margin-bottom: 20px;
border-radius: 5px;
}
.calculate .error img {
margin-right: 5px;
}
@media only screen and (max-width: 992px) {
.calculate form {
max-width: initial;
}
.calculate .wrapper {
background: 0 0;
}
}
.page .page-content {
padding-top: 40px;
padding-bottom: 80px;
color: #142d44;
overflow: hidden;
}
.page .page-content img {
margin: 20px;
}
.page .page-content img.fleft {
margin-left: 0;
}
.page .page-content img.fright {
margin-right: 0;
}
.page .page-content .fleft {
float: left;
}
.page .page-content .fright {
float: right;
}
.page .page-content h3 {
font-size: 35px;
margin-bottom: 40px;
font-weight: 700;
text-align: center;
}
.page .page-content p {
color: #142d44;
font-size: 16px;
font-weight: 400;
}
.page .page-content ul {
list-style: circle inside url(../img/icons/disc.svg);
margin-bottom: 15px;
}
.page .page-content ul li {
margin-bottom: 5px;
color: #142d44;
}
.page .page-content .post-banner {
height: 300px;
background-position: center !important;
background-size: cover !important;
background-repeat: no-repeat !important;
margin-bottom: 40px;
}
.page .page-content .date img {
margin: 0;
vertical-align: middle;
}
.page .page-content .date span {
vertical-align: middle;
font-size: 13px;
color: #979db6;
}
.page .page-content .post-content h3,
.page .page-content .post-content h4 {
margin-bottom: 20px;
}
@media only screen and (max-width: 768px) {
.page .page-content {
padding-top: 20px;
}
.page .page-content .post-banner {
margin-bottom: 20px;
}
}
@media only screen and (max-width: 480px) {
.page .page-content img.fleft,
.page .page-content img.fright {
float: none;
display: block;
margin: 20px auto;
}
}
.blank::after {
content: '';
clear: both;
display: block;
}
.blank h4 {
font-size: 22px;
}
.blank .consignee-block,
.blank .labels-block,
.blank .shipper-block {
float: left;
display: inline-block;
}
.blank ul {
list-style: none !important;
}
.blank .labels-block {
width: 30%;
padding-top: 35px;
margin-bottom: 0 !important;
}
.blank .labels-block li {
height: 60px;
font-weight: 500;
margin-bottom: 20px !important;
position: relative;
}
.blank .labels-block li span {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}
.blank .consignee-block,
.blank .shipper-block {
width: 35%;
box-sizing: border-box;
}
.blank .consignee-block label,
.blank .shipper-block label {
display: none;
}
.blank .consignee-block h4,
.blank .shipper-block h4 {
font-weight: 400;
text-align: center;
font-size: 14px;
}
.blank .shipper-block {
padding-right: 10px;
}
.blank .consignee-block {
padding-left: 10px;
}
.blank .divider {
margin: 30px 0;
}
.blank .grid li {
overflow: hidden;
margin-left: -10px;
margin-right: -10px;
}
.blank .grid li .grid-header {
margin-bottom: 20px;
}
.blank .grid li .grid-header li {
text-align: center;
}
.blank .grid li .grid-header li:first-child {
text-align: left;
height: initial !important;
line-height: initial !important;
}
.blank .grid li ul {
overflow: hidden;
margin-bottom: 0;
}
.blank .grid li ul li {
display: inline-block;
float: left;
margin: 0 10px;
}
.blank .grid li ul li label {
display: none;
}
.blank .grid li ul li:nth-child(1) {
width: calc(5% - 20px);
height: 60px;
line-height: 60px;
}
/* .blank .grid li ul li:nth-child(2) {
width: calc(50% - 20px);
} */
.blank .grid li ul li:nth-child(4),
.blank .grid li ul li:nth-child(5),
.blank .grid li ul li:nth-child(6) {
width: calc(10% - 20px);
}
.blank .info {
padding: 0;
text-align: center;
color: #979db6 !important;
font-size: 14px !important;
margin: 0;
}
.blank .form-group {
width: 50%;
float: left;
box-sizing: border-box;
}
.blank .form-group:nth-child(odd) {
padding-right: 10px;
}
.blank .form-group:nth-child(even) {
padding-left: 10px;
text-align: right;
}
.blank .form-group:last-child {
padding-left: 10px;
text-align: right;
float: right;
padding-right: 0;
}
.blank .form-group input {
width: 60%;
display: inline-block;
margin-left: 10px;
margin-right: 10px;
}
.blank .form-group label {
vertical-align: middle;
font-weight: 500;
}
.blank .checkbox-label {
display: block;
margin-bottom: 10px;
}
.blank .checkbox-label a {
color: #007eff;
}
.blank .checkbox-label a:hover {
text-decoration: underline;
}
.blank .checkbox-label:last-child {
margin-bottom: 30px;
}
.blank .name,
.blank .passport,
.blank .signature {
width: 50%;
float: left;
}
.blank .name label,
.blank .passport label,
.blank .signature label {
display: inline-block;
vertical-align: middle;
font-weight: 500;
margin-right: 15px;
}
.blank .name input,
.blank .passport input,
.blank .signature input {
width: 60%;
display: inline-block;
}
.blank .passport .upload {
background: #007eff;
color: #fff;
line-height: 60px;
}
.blank .passport .upload input[type='file'] {
display: none;
}
.blank .passport .preview {
width: 100px;
display: none;
border: 5px solid #2ecc71;
}
.blank .passport .preview img {
max-width: 100%;
max-height: 100%;
display: block;
margin: auto;
}
.blank .passport .preview.show {
display: block;
}
.blank .signature {
text-align: right;
position: relative;
margin-bottom: 20px;
}
.blank .signature .signature-canvas {
display: none;
position: absolute;
right: 0;
top: 60px;
-webkit-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
}
.blank .signature .signature-canvas.show {
display: block;
}
.blank .signature .signature-canvas canvas {
background: #f1f2f6;
border-radius: 5px;
}
.blank .signature .signature-canvas .clear,
.blank .signature .signature-canvas .close,
.blank .signature .signature-canvas .save {
position: absolute;
bottom: 10px;
right: 10px;
width: auto;
height: auto;
border: none;
border-radius: 3px;
padding: 8px 16px;
background: #007eff;
color: #fff;
-webkit-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
}
.blank .signature .signature-canvas .clear {
right: 180px;
}
.blank .signature .signature-canvas .close {
top: 10px;
bottom: auto;
}
.blank .signature .signature-trigger {
display: inline-block;
width: 60%;
height: 60px;
background: #f1f2f6;
vertical-align: middle;
border-radius: 5px;
cursor: pointer;
text-align: center;
line-height: 60px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.blank .btn {
display: block;
max-width: 400px;
margin: 0 0 30px auto;
}
.blank-nav {
text-align: center;
}
.blank-nav a {
display: inline-block;
width: auto;
height: auto;
}
.blank-nav a img {
-webkit-box-shadow: 0 5px 10px 0 #007eff;
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
border-radius: 3px;
}
.blank-nav a h2 {
font-size: 20px;
}
@media only screen and (max-width: 768px) {
.blank .labels-block {
display: none;
}
.blank .shipper-block {
margin-bottom: 30px;
}
.blank .consignee-block,
.blank .shipper-block {
padding-right: 0;
padding-left: 0;
width: 100%;
float: none;
}
.blank .consignee-block label,
.blank .shipper-block label {
display: block;
font-weight: 500;
margin-bottom: 5px;
}
.blank .form-group {
text-align: right;
width: 100%;
float: none;
padding-right: 0 !important;
padding-left: 0 !important;
}
.blank .name,
.blank .signature {
width: 100%;
float: none;
text-align: right;
}
.blank .grid li .grid-header {
display: none;
}
.blank .grid li ul li label {
text-align: center;
display: block;
font-size: 12px;
font-weight: 500;
margin-bottom: 5px;
line-height: 1;
}
.blank .grid li ul li:nth-child(1) {
width: calc(10% - 20px);
}
.blank .grid li ul li:nth-child(2) {
width: calc(90% - 20px);
}
.blank .grid li ul li:nth-child(3),
.blank .grid li ul li:nth-child(4),
.blank .grid li ul li:nth-child(5) {
width: calc(33.3% - 20px);
}
}
@media only screen and (max-width: 480px) {
.blank .grid li ul li:nth-child(1) {
height: 50px;
line-height: 50px;
}
}
h2.accordion-title {
color: #142d44;
font-size: 30px;
margin-bottom: 50px;
text-align: center;
}
.accordion {
border: 1px solid #cbcedb;
border-radius: 3px;
margin-bottom: 40px;
padding: 20px 40px;
color: #142d44;
}
.accordion .spoiler {
cursor: pointer;
background-color: #fff;
background-image: url(../img/icons/arrow-down.svg);
background-position: right center;
background-repeat: no-repeat;
padding: 20px 0;
width: 100%;
text-align: left;
border: none;
border-bottom: 1px solid #cbcedb;
outline: 0;
}
.accordion .spoiler:nth-last-child(-n + 2) {
border-bottom: none;
}
.accordion .spoiler.active {
background-image: url(../img/icons/arrow-up.svg);
border-bottom: none;
padding-bottom: 0;
}
.accordion .panel {
padding: 20px 0;
background: #fff;
display: none;
overflow: hidden;
border-bottom: 1px solid #cbcedb;
}
.accordion .panel ul {
list-style: circle inside url(../img/icons/disc.svg);
}
.accordion .panel ul li {
margin-bottom: 5px;
}
.info-block {
background: #f1f2f6;
border-radius: 3px;
padding: 25px 40px;
margin-bottom: 100px;
color: #142d44;
}
.info-block.mb-20 {
margin-bottom: 20px;
}
.info-block .important {
color: #ea1600;
}
.info-block .block-title.important {
text-indent: 20px;
background-image: url(../img/icons/important.svg);
background-position: left center;
background-repeat: no-repeat;
margin: 0;
}
.info-block p:last-child {
margin: 0;
}
@media only screen and (max-width: 768px) {
.info-block {
padding: 20px;
}
}
.select-box {
position: relative;
color: #142d44;
margin-bottom: 20px;
}
.select-box select {
display: none;
}
.select-selected {
background-color: #f1f2f6;
height: 60px;
line-height: 60px;
border-radius: 5px;
padding: 0 25px;
}
.select-selected:after {
position: absolute;
content: '';
top: 26px;
right: 25px;
background-image: url(../img/icons/arrow-down.svg);
width: 16px;
height: 10px;
background-position: center;
background-repeat: no-repeat;
}
.select-selected.select-arrow-active {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom: 1px solid #cbcedb;
}
.select-selected.select-arrow-active:after {
background-image: url(../img/icons/arrow-up.svg);
}
@media only screen and (max-width: 480px) {
.select-selected {
height: 50px;
line-height: 50px;
}
}
.select-items div,
.select-selected {
cursor: pointer;
}
.select-items {
position: absolute;
background-color: #f1f2f6;
top: 100%;
left: 0;
right: 0;
z-index: 99;
}
.select-items div {
height: 40px;
line-height: 40px;
padding: 0 25px;
border-bottom: 1px solid #cbcedb;
}
.select-items div:last-child {
border: none;
}
.select-hide {
display: none;
}
.same-as-selected,
.select-items div:hover {
background-color: rgba(0, 0, 0, 0.1);
}
.news-wrapper {
overflow: hidden;
margin: 0 -20px;
}
.news-wrapper .item {
display: inline-block;
width: calc(33.3% - 40px);
margin: 0 20px 50px;
float: left;
}
.news-wrapper .item a {
text-decoration: none;
}
.news-wrapper .item .image img {
margin: 0;
width: 100%;
}
.news-wrapper .item .category {
position: relative;
text-align: center;
padding: 20px 0;
}
.news-wrapper .item .category:after {
content: '';
position: absolute;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
width: 62px;
height: 2px;
background-color: #007eff;
}
.news-wrapper .item h2.title {
font-size: 26px;
text-align: center;
margin-bottom: 25px;
min-height: 64px;
}
.news-wrapper .item .date {
text-align: center;
font-size: 13px;
color: #979db6;
}
.news-wrapper .item .date img {
margin: 0;
vertical-align: middle;
}
.news-wrapper .item .date span {
vertical-align: middle;
}
@media only screen and (max-width: 992px) {
.news-wrapper .item {
width: calc(50% - 40px);
}
}
@media only screen and (max-width: 768px) {
.news-wrapper .item h2.title {
font-size: 22px;
}
}
@media only screen and (max-width: 480px) {
.news-wrapper {
margin: 0;
}
.news-wrapper .item {
width: 100%;
float: none;
margin: 0 0 50px;
}
.news-wrapper .item h2.title {
min-height: initial;
}
}
.tracking-code-scheme {
font-size: 30px;
}
.tracking-code-scheme > div {
display: inline-block;
}
.tracking-code-scheme > div > div:first-child {
text-align: center;
font-size: 16px;
color: #007eff;
}
.tracking-code-scheme > div > div:last-child {
border: 1px solid #007eff;
padding: 5px 10px;
line-height: 30px;
margin-bottom: 10px;
}
.lds-ellipsis {
display: inline-block;
position: relative;
width: 80px;
height: 60px;
}
.lds-ellipsis div {
position: absolute;
top: 25px;
width: 12px;
height: 12px;
border-radius: 50%;
background: #fff;
animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
left: 8px;
animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
left: 8px;
animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
left: 32px;
animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
left: 56px;
animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
0% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
@keyframes lds-ellipsis3 {
0% {
transform: scale(1);
}
100% {
transform: scale(0);
}
}
@keyframes lds-ellipsis2 {
0% {
transform: translate(0, 0);
}
100% {
transform: translate(24px, 0);
}
}
#disabilitiesSettings {
position: fixed;
right: -150px;
top: 80px;
transition: 0.5s;
width: 200px;
text-decoration: none;
color: #fff;
border-radius: 5px 0 0 5px;
}
#disabilitiesSettings .label {
display: block;
width: 50px;
height: 50px;
background-color: #007eff;
background-image: url(../img/icons/disabled.svg);
background-position: center;
background-repeat: no-repeat;
background-size: 60%;
color: #fff;
border-radius: 5px 0 0 5px;
-webkit-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
transition: 0.5s;
}
#disabilitiesSettings .label:hover {
background-color: #0071e6;
-webkit-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.4);
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.4);
box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.4);
transition: 0.5s;
}
#disabilitiesSettings .settings {
background: #007eff;
color: #fff;
margin-left: 50px;
padding: 15px;
transition: 0.5s;
width: 100%;
box-sizing: border-box;
}
#disabilitiesSettings .settings li {
margin-bottom: 10px;
border-bottom: 1px solid #fff;
padding-bottom: 10px;
}
#disabilitiesSettings .settings li:last-child {
margin-bottom: 0;
padding-bottom: 0;
border: none;
}
#disabilitiesSettings .settings .switch {
position: relative;
display: inline-block;
width: 170px;
height: 30px;
margin: 5px 0 0 0;
}
#disabilitiesSettings .settings .switch input {
opacity: 0;
width: 0;
height: 0;
}
#disabilitiesSettings .settings .slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #f1f2f6;
-webkit-transition: 0.4s;
transition: 0.4s;
}
#disabilitiesSettings .settings .slider:before {
position: absolute;
content: '';
height: 22px;
width: 22px;
left: 4px;
bottom: 4px;
background-color: #fff;
-webkit-transition: 0.4s;
transition: 0.4s;
}
#disabilitiesSettings .settings input:checked + .slider {
background-color: #2ecc71;
}
#disabilitiesSettings .settings input:focus + .slider {
box-shadow: 0 0 1px #2ecc71;
}
#disabilitiesSettings .settings input:checked + .slider:before {
-webkit-transform: translateX(140px);
-ms-transform: translateX(140px);
transform: translateX(140px);
}
#disabilitiesSettings .settings .slider.round {
border-radius: 34px;
}
#disabilitiesSettings .settings .slider.round:before {
border-radius: 50%;
}
#disabilitiesSettings .settings .btn-group {
padding-top: 10px;
text-align: center;
}
#disabilitiesSettings .settings a.decrease-font {
margin-right: 10px;
}
#disabilitiesSettings .settings a.decrease-font,
#disabilitiesSettings .settings a.increase-font {
display: inline-block;
width: calc(50% - 10px);
background: #f1f2f6;
color: #142d44;
text-align: center;
height: 26px;
line-height: 26px;
font-size: 30px;
border-radius: 3px;
transition: 0.5s;
}
#disabilitiesSettings .settings a.decrease-font:hover,
#disabilitiesSettings .settings a.increase-font:hover {
background: #d2d5e2;
transition: 0.5s;
}
#disabilitiesSettings.show {
right: 0;
transition: 0.5s;
}
#disabilitiesSettings.show .label {
border-radius: 5px 5px 0 0;
}
#disabilitiesSettings.show .settings {
margin-left: 0;
border-radius: 0 0 0 5px;
transition: 0.5s;
-webkit-box-shadow: 0 5px 10px 0 #007eff;
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 #007eff;
}
.magnifying-glass {
position: absolute;
z-index: 1000;
border: 2px solid #007eff;
padding: 15px 25px;
font-size: 40px;
text-transform: uppercase;
background: #fff;
color: #142d44;
border-radius: 5px;
font-weight: bolder;
-webkit-box-shadow: 0 5px 10px 0 #007eff;
-moz-box-shadow: 0 5px 10px 0 rgba(0, 126, 255, 0.3);
box-shadow: 0 5px 10px 0 #007eff;
}
.like-input {
display: block;
width: 100%;
max-width: 400px !important;
box-sizing: border-box;
background: #f1f2f6;
border-radius: 5px;
border: none;
line-height: 40px;
padding: 0 25px;
margin-bottom: 15px !important;
color: #142d44;
min-height: 60px;
}
.like-input label {
display: block !important;
}
.like-input .checkbox-label:last-child {
margin-bottom: 0;
}
.grid-header li:nth-child(2) {
width: 100%;
max-width: 400px;
}
.blank .grid .added-desc {
max-width: 330px;
width: 100%;
}
.inp-reasons {
height: 16px;
width: 16px !important;
display: flex !important;
line-height: 16px;
margin-left: 0 !important;
margin-right: 6px !important;
margin-bottom: 0 !important;
}
.group-inp-reason {
display: flex;
flex-direction: row;
padding-top: 6px;
align-items: center;
}
.group-inp-reason > label {
line-height: 1;
}
.ta-left {
text-align: left !important;
display: flex;
}
.bottom-blank-group {
display: flex;
flex-wrap: wrap;
justify-content: right;
}
.bottom-blank-group > div {
width: fit-content !important;
max-width: 425px;
display: flex;
align-items: center;
text-align: left;
}
.bottom-blank-group input {
margin-bottom: 0 !important;
}
.bottom-blank-group .like-input {
margin-bottom: 0 !important;
}
.not-so-big {
width: 80% !important;
}
.block-kg-orno > label {
min-width: 25px;
}
@media (max-width: 768px) {
.blank .signature {
display: flex;
justify-content: right;
align-items: center;
}
.blank .signature .signature-trigger {
line-height: 1;
display: flex;
padding: 0 4px;
align-items: center;
justify-content: center;
}
.passport {
width: 100% !important;
display: flex;
}
.blank .passport .upload {
line-height: 1;
margin-right: 0;
display: flex;
align-items: center;
}
.block-kg-orno {
display: flex;
justify-content: right;
}
.block-kg-orno > input {
padding: 0 4px;
}
.block-kg-orno > label {
min-width: 25px;
}
.mw-100 {
max-width: 100% !important;
}
.bottom-blank-group > div {
margin-bottom: 8px;
}
.containers-of-li {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
justify-content: center;
}
.containers-of-li > li:nth-child(1) {
text-align: center !important;
margin-bottom: 20px !important;
height: 45px !important;
line-height: 25px !important;
}
.containers-of-li > li:nth-child(6) {
display: none !important;
}
.like-input {
margin-bottom: 20px !important;
display: flex !important;
align-items: flex-start;
justify-content: center;
flex-direction: column;
}
.like-input > .checkbox-label {
text-align: left !important;
}
}
@media (max-width: 760px) {
.containers-of-li > li:nth-child(6) {
width: auto !important;
max-width: 100px;
}
}
@media (max-width: 320px) {
.containers-of-li > li:nth-child(1) {
overflow: visible;
}
}
@media (max-width: 430px) {
.containers-of-li {
justify-content: flex-end;
}
}
.flag-links {
margin-top: 200px;
margin-bottom: 100px;
}
.flag-links > h2 {
text-align: center;
}
.flag-links-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
}
.flag-link-container {
display: flex;
flex-direction: column;
transition: 0.3s;
align-items: center;
margin: 0 5px;
}
.flag-link-container:hover {
opacity: 0.8;
}
.flag-link {
display: flex;
justify-content: center;
align-items: center;
width: 77px;
height: 58.25px;
border-radius: 8px;
overflow: hidden;
padding: 2px;
background-color: #007eff;
}
.flag-link img {
width: 75px;
height: auto;
border-radius: 8px;
}
.text-under-flag-link {
max-width: 120px;
text-align: center;
}
.t-imgs {
width: 100%;
}
.attorney {
width: 100%;
display: flex;
flex-direction: column;
font-size: 16px;
}
.attorney * {
box-sizing: border-box;
}
.pa-1 {
margin-top: 20px;
margin-bottom: 80px;
}
.pa-2 {
font-size: 18px;
font-weight: bold;
}
.pa-3 {
margin-bottom: 30px;
font-weight: bold;
}
.pa-def {
display: flex;
flex-direction: row;
}
.pa-d-1 {
width: 68%;
margin-right: 35px;
}
.pa-d-2 {
width: 30%;
margin-top: 15px;
}
.pa-inp-text {
width: 100%;
border: 1px solid #4b7fa1;
padding: 6px;
border-radius: 3px;
}
.pa-d-c-h {
display: flex;
justify-content: space-between;
margin-top: 50px;
}
.pa-d-h {
width: 45%;
}
.pa-4 {
margin-top: 35px;
}
.mr-20 {
margin-right: 25px;
}
.pa-rbtns-c {
display: flex;
}
.pa-rbtns-c > div:first-of-type {
margin-right: 20px;
}
.mt-35 {
margin-top: 35px;
}
.no-margin {
margin: 0 !important;
}
.pa-hz-text {
margin: 70px 0;
}
.pa-checkbox {
display: flex;
margin-bottom: 55px;
}
.pa-cb-point {
margin-right: 30px;
}
.pa-cb-c {
margin-right: 30px;
}
.pa-link-bttm {
font-size: 14px;
}
.mt-70 {
margin-top: 70px;
}
.bold {
font-weight: bold;
}
.mb-70 {
margin-bottom: 60px;
}
.ml-70 {
margin-left: 70px;
}
.mt-25 {
margin-top: 25px;
}
.mb-35 {
margin-bottom: 35px;
}
.pa-d-t {
width: 30%;
}
.mt-10 {
margin-top: 10px;
}
.pa-signa {
margin-top: 90px;
margin-left: 30px;
}
.pa-signa > span {
border: 1px solid #0071e6;
transition: 0.3s;
cursor: pointer;
color: #0071e6;
padding: 2px 40px;
border-radius: 3px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
margin-left: 5px;
}
.pa-signa > span:hover {
border-color: #0163cd;
opacity: 0.75;
}
.pa-signa > button {
display: none;
background-color: #00a65a;
border: 1px solid #008d4c;
transition: 0.3s;
cursor: pointer;
color: white;
padding: 2px 40px;
border-radius: 3px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
margin-left: 5px;
}
.pa-signa > button:hover {
border-color: #028347;
background-color: #028347;
}
.pagination {
display: block;
list-style: none;
text-align: right;
clear: both;
}
.pagination li {
display: inline-block;
width: 40px;
height: 40px;
line-height: 40px;
background-color: #007eff;
transition: 0.4s;
color: #fff !important;
border-radius: 3px;
margin: 0 5px;
text-align: center;
}
.pagination li:hover,
.pagination li.active {
cursor: pointer;
background-color: #133c97;
transition: 0.4s;
}
.pagination li a {
display: inline-block;
width: 100%;
text-align: center;
color: #fff;
line-height: 40px;
}