@font-face {
font-family: 'Sangha';
src: url('../fonts/sangha.ttf');
}
@font-face {
font-family: 'Nasalization';
src: url('../fonts/Nasalization.woff2');
}
@font-face {
font-family: 'AmadeusAP';
src: url('../fonts/AmadeusAP.ttf');
}
@font-face {
font-family: 'Hooskai Chamfered Square';
src: url('../fonts/HooskaiChamferedSquare.ttf');
}
/* HooskaiChamferedSquare */
@font-face {
font-family: 'HooskaiChamferedSquare';
src: url('https://api.rus2design.ru/files/fonts/HooskaiChamferedSquare.ttf');
}
/* Gotham Pro */
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-BoldItalic.ttf');
font-weight: bold;
font-style: italic;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-Italic.ttf');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-Medium.ttf');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-BlackItalic.ttf');
font-weight: 900;
font-style: italic;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-Bold.ttf');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Gotham Pro Narrow';
src: url('https://api.rus2design.ru/files/fonts/GothamProNarrow-Bold.ttf');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Gotham Pro Narrow';
src: url('https://api.rus2design.ru/files/fonts/GothamProNarrow-Medium.ttf');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-LightItalic.ttf');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-Light.ttf');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-Black.ttf');
font-weight: 900;
font-style: normal;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Gotham Pro';
src: url('https://api.rus2design.ru/files/fonts/GothamPro-MediumItalic.ttf');
font-weight: 500;
font-style: italic;
}
* {
padding: 0;
margin: 0;
box-sizing: border-box;
scroll-behavior: smooth;
}
body {
font-family: 'Gotham Pro', sans-serif;
font-size: 14px;
line-height: 140%;
color: #FFF;
overflow-x: hidden;
background: #171422;
}
body::-webkit-scrollbar {
display: none;
}
a {
color: unset;
text-decoration: none !important;
}
li {
list-style-type: none;
}
img {
object-fit: cover;
vertical-align: middle;
border-style: none;
}
input[type=checkbox] {
visibility: hidden;
}
.eapps-instagram-feed-content{
.eapps-instagram-feed-header.es-header{
background: transparent!important;
color: white!important;
a {
color: white!important;
}
}
}
.container {
max-width: 1470px;
padding: 0 25px;
width: 100%;
position: relative;
margin: 0px auto;
@media(max-width:480px){
padding: 0 12px;
}
}
// drop-down
.dropbtn {
background-color: transparent;
color: white;
transition: .25s ease all;
// padding: 16px;
font-size: 16px;
border: none;
cursor: pointer;
display: flex;
align-items: center;
gap: 12px;
svg {
transition: .25s ease all;
}
}
/* The container
- needed to position the dropdown content */
.dropdown {
position: relative;
display: inline-block;
}
/* Dropdown Content (Hidden by Default) */
.dropdown-content {
display: none;
position: absolute;
background: linear-gradient(90deg, #9E0B37 0.98%, #FFC531 72.22%, #9E0B37 99.95%);;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
border-radius: 12PX;
overflow: hidden;
}
/* Links inside the dropdown */
.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
/* Change color of dropdown links on hover */
// .dropdown-content a:hover {background-color: #f1f1f1;}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}
/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn svg {
transform: rotate(45deg);
}
// header
.header {
position: relative;
width: 100%;
z-index: 150;
transition: .25s ease all;
backdrop-filter: blur(0);
background: linear-gradient(90deg, #9E0B37 0.98%, #FFC531 72.22%, #9E0B37 99.95%);
top: 0;
&.scrolled {
// backdrop-filter: blur(5px);
// box-shadow: 0px 8px 8px rgba(162, 160, 160, 0.1);
}
@media(max-width:992px){
background: transparent;
position: fixed;
}
}
.header__inner {
display: flex;
align-items: center;
justify-content: space-between;
padding: 12px 0;
transition: 0.25s ease all;
&.scrolled2 {
// padding:12px 0 ;
}
.header-links {
display: flex;
// align-items: center;
justify-content: space-between;
width: 100%;
gap: 12px;
@media (max-width: 992px) {
display: none;
}
._item {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
max-width: 110px;
.pic {
display: flex;
position: relative;
box-shadow: 4px 4px 14px 0px rgba(0, 0, 0, 0.1);
border-radius: 12px;
overflow: hidden;
width: 100%;
img {
width: 100%;
}
}
p {
border-radius: 8px;
background: linear-gradient(
272deg,
rgba(255, 255, 255, 0.5) -65.15%,
rgba(255, 255, 255, 0) 86.4%
);
box-shadow: 4px 4px 14px 0px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(35px);
text-align: center;
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 110%;
text-transform: uppercase;
width: 100%;
height: 2.33em;
display: flex;
justify-content: center;
align-items: center;
color: white;
}
}
.header-socials {
display: flex;
flex-direction: column;
gap: 12px;
a {
display: flex;
align-items: center;
justify-content: center;
width: 50px;
// filter: drop-shadow(12px 5px 27px rgba(0, 0, 0, 0.19)) drop-shadow(46px 18px 50px rgba(0, 0, 0, 0.17)) drop-shadow(105px 41px 67px rgba(0, 0, 0, 0.10)) drop-shadow(186px 73px 80px rgba(0, 0, 0, 0.03)) drop-shadow(291px 113px 87px rgba(0, 0, 0, 0.00));
img {
width: 100%;
}
}
}
}
.__right {
justify-content: space-between;
align-items: center;
width: 100%;
display: none;
.regictration-btn {
color: #fff;
font-family: Gotham Pro;
font-size: clamp(13px, 0.8vw, 17px);
font-style: normal;
font-weight: 400;
line-height: normal;
display: flex;
width: 160px;
height: 49px;
padding: 24px 72px;
justify-content: center;
align-items: center;
border-radius: 40px;
border-radius: 40px;
background: rgba(158, 11, 55, 0.7);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.5) inset,
4px 4px 20px 0px rgba(223, 80, 23, 0.8);
@media (max-width: 992px) {
width: auto;
height: auto;
padding: 12px 32px;
}
&.hide {
@media (max-width: 480px) {
display: none;
}
}
}
.header-socials {
display: flex;
align-items: center;
gap: 20px;
a {
width: 60px;
img {
width: 100%;
}
}
}
@media (max-width: 992px) {
justify-content: space-between;
display: flex;
}
@media (max-width: 480px) {
justify-content: space-between;
width: 100%;
}
}
@media (max-width: 992px) {
justify-content: flex-end;
}
@media (max-width: 480px) {
justify-content: space-between;
}
}
/* BURGER */
.burger-block {
display: none;
@media (max-width:992px){
display: flex;
width: 50px;
height: 50px;
background: linear-gradient(90deg, #9E0B37 -9.67%, #FFC531 115.9%);
border-radius: 18px;
padding: 11px 10px;
}
}
#nav-icon {
display: flex;
width: 60px;
position: relative;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
// box-shadow: 4px 4px 10px 0px;
cursor: pointer;
z-index: 1000;
span {
display: block;
position: absolute;
height: 2px;
width: 100%;
background: white;
opacity: 1;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-o-transition: .2s ease-in-out;
transition: .2s ease-in-out;
}
}
// #nav-icon:hover span{
// background: #FD4D00!important;
// }
#nav-icon span:nth-child(1) {
top: 2px;
}
#nav-icon span:nth-child(2),#nav-icon span:nth-child(3) {
top: 13px;
}
#nav-icon span:nth-child(4) {
top: 24px;
}
#nav-icon.open span:nth-child(1) {
top: 2px;
width: 0%;
right: 1%;
}
#nav-icon.open span:nth-child(2) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
#nav-icon.open span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
#nav-icon.open span:nth-child(4) {
top: 14px;
width: 0%;
right: 1%;
}
/* ______ */
/* burger menu */
.burger__menu__container {
position: fixed;
top: 0;
width: 100%;
right: 0;
height: 100vh;
overflow: hidden;
padding: 0 6px 12px;
// background: rgba(34, 33, 33, 1);
background: linear-gradient(90deg, #9E0B37 0.98%, #FFC531 72.22%, #9E0B37 99.95%);
backdrop-filter: blur(2px)!important;
-webkit-backdrop-filter: blur(2px);
box-shadow: 8px 8px 20px rgb(0 0 0 / 7%);
background-size: 200% 200%;
transition: all .7s ease;
z-index: 114;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
transform: translateY(-100vh);
padding-top: 10vh;
// div {
// display: flex;
// flex-direction: column;
// align-items: center;
// justify-content: flex-start;
// gap:24px;
// }
}
.header-links {
display: flex;
flex-wrap:wrap;
// align-items: center;
justify-content: space-evenly;
width: 100%;
gap: 6px;
// @media(max-width:992px){
// display: none;
// }
._item {
display: flex;
flex-direction: column;
align-items: center;
gap:8px;
max-width: 135px;
@media(max-width:380px){
max-width: 105px;
}
.pic {
display: flex;
position: relative;
box-shadow: 4px 4px 14px 0px rgba(0, 0, 0, 0.10);
border-radius: 24px;
overflow: hidden;
width: 100%;
img {
width: 100%;
}
}
p {
border-radius: 14px;
background: linear-gradient(272deg, rgba(255, 255, 255, 0.50) -65.15%, rgba(255, 255, 255, 0.00) 86.4%);
box-shadow: 4px 4px 14px 0px rgba(0, 0, 0, 0.10);
backdrop-filter: blur(35px);
text-align: center;
font-size: clamp(16px,1.2vw,20px);
font-style: normal;
font-weight: 400;
line-height: 22px; /* 110% */
text-transform: uppercase;
width: 100%;
height: 38px;
display: flex;
justify-content: center;
align-items: center;
}
}
.header-socials {
display: flex;
flex-direction: column;
gap: 16px;
a {
display: flex;
align-items: center;
justify-content: center;
filter: drop-shadow(12px 5px 27px rgba(0, 0, 0, 0.19)) drop-shadow(46px 18px 50px rgba(0, 0, 0, 0.17)) drop-shadow(105px 41px 67px rgba(0, 0, 0, 0.10)) drop-shadow(186px 73px 80px rgba(0, 0, 0, 0.03)) drop-shadow(291px 113px 87px rgba(0, 0, 0, 0.00));
}
}
}
.row {
flex-direction: row!important;
}
.top__contacts {
display: flex;
justify-content: center;
width: 100%;
ul {
display: flex;
flex-direction: column;
gap: 1rem;
align-items: center;
width: 80%;
font-style: normal;
font-size: 20px;
line-height: 24px;
text-align: center;
li a {
display: flex;
align-items: center;
gap: 12px;
svg path{
fill: #333333;
}
p {
font-style: normal;
font-weight: 400;
font-size: 20px;
line-height: 23px;
white-space: nowrap;
}
}
}
}
._open_up {
transform: translateY(0);
}
.top__navigation__hidden {
display: flex;
flex-direction: column;
align-items: center;
}
.toplink_h {
padding: 8px;
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 21px;
letter-spacing: 0.2em;
text-transform: uppercase;
}
.hidden_catalog {
display: flex;
flex-direction: column;
align-items: center;
}
.hidden_catalog a {
padding: 8px;
font-style: normal;
font-weight: 400;
font-size: 18px;
line-height: 21px;
letter-spacing: 0.2em;
text-transform: uppercase;
display: flex;
align-items: center;
gap: 1rem;
}
/* */
// keyframes
@keyframes toTheLeft {
0% {
transform: translateX(0);
}
50% {
transform: translateX(-18%);
}
100% {
transform: translateX(0);
}
}
@keyframes toTheBottom {
0% {
transform: translateY(0);
}
50% {
transform: translateY(15%);
}
100% {
transform: translateY(0);
}
}
@keyframes toTheRight {
0% {
transform: translateX(0);
}
50% {
transform: translateX(16%);
}
100% {
transform: translateX(0);
}
}
@keyframes postsMove {
0% {
object-position: 0;
}
50% {
object-position: 100%;
}
100% {
object-position: 0;
}
}
@keyframes postsMoveRev {
0% {
object-position: 100%;
}
50% {
object-position: 0;
}
100% {
object-position: 100%;
}
}
@keyframes shadowChange {
0% {
box-shadow: 2px 2px 16px 0px #3ED7FF;
}
100% {
box-shadow: 2px 2px 16px 0px #BD485B;
}
}
@media (max-width:480px){
.section-desctop__video {
display:none;
}
}
@media (min-width:480px){
.section-mobile__video {
display:none;
}
}
.main-banner {
position: relative;
z-index: 1;
overflow: hidden;
.main-banner-element {
position: absolute;
display: none;
img {
width: 100%;
height: 100%;
}
&.insta-left {
left: 0;
top: 15%;
transform: translateY(-15%);
width: calc(95% - 88vw);
img {
animation: toTheLeft 4s linear infinite;
}
}
&.insta-bottom {
bottom: 0;
left: 35%;
transform: translateX(-35%);
width: calc(95% - 80vw);
img {
animation: toTheBottom 5s linear infinite;
}
}
&.insta-right {
right: 0;
top: 50%;
transform: translateY(-50%);
width: calc(95% - 88vw);
img {
animation: toTheRight 3s linear infinite;
}
}
&.main-banner-lady{
bottom: 0;
right: 0;
z-index: 2;
height: 100%;
img {
width: unset!important;
object-fit: cover;
}
@media(max-width:1450px){
right: -35vh;
}
}
}
.main-banner-vd {
position: absolute;
width:100%;
height:100%;
top: 0;
left: 0;
video {
object-fit: cover;
width: 100%;
height: 100%;
// @media(max-width:480px){
// object-position: -100vh;
// }
}
}
.main-banner-wrap {
position: relative;
display: flex;
justify-content: space-between;
align-items: flex-end;
z-index: 3;
width: 100%;
min-height: 100vh;
max-height: 1000px;
padding-bottom: 100px;
.main-banner_left{
display: flex;
width: 53%;
height: 80%;
@media(max-width:480px) {
height: 90%;
padding-top: 65px;
}
@media(max-width:380px) {
height: 85%;
}
.main-banner_left_text {
display: flex;
flex-direction: column;
transition: .3s ease all;
.top-part {
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between;
transition: .3s ease all;
gap: 12px;
.main-title {
display: flex;
gap: 4px;
flex-direction: column;
h1 {
color: #FFF;
font-family: Gotham Pro;
font-size:clamp(50px,3.8vw,72px);
font-style: normal;
font-weight: 400;
line-height: 110%; /* 79.2px */
text-transform: uppercase;
}
h2 {
color: #FFF;
font-family: Gotham Pro;
font-size:clamp(43px,3.6vw,72px);
font-style: italic;
font-weight: 100;
line-height: 110%; /* 79.2px */
text-transform: uppercase;
min-height: 79.5px;
}
@media(max-width:480px){
align-items: center;
}
}
}
.title-block {
position: relative;
display: flex;
padding-left: 24px;
margin-bottom: 155px;
&::before{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='90' viewBox='0 0 8 90' fill='none'%3E%3Cpath d='M4 0.0816948L0.0816948 4L4 7.91831L7.91831 4L4 0.0816948ZM4 89.9183L7.9183 86L4 82.0817L0.0816913 86L4 89.9183ZM3.32133 4L3.32133 86L4.67867 86L4.67867 4L3.32133 4Z' fill='white'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-size: contain;
top: 0;
left: 0;
position: absolute;
display: flex;
content: '';
width: 100%;
height: 100%;
}
p {
color: #FFF;
font-family: Gotham Pro;
font-size: 18px;
font-style: normal;
font-weight: 100;
line-height: 140%;
span {
font-size: 24px;
font-weight: 700;
text-transform: uppercase;
}
}
@media(max-width:768px){
display: none;
}
}
.percents-block {
display: flex;
justify-content: space-between;
margin-top: clamp(24px,3.6vw,72px);
width: fit-content;
.percents-block-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
h3 {
color: #FFF;
font-size: clamp(22px, 1.8vw, 30px);
font-style: normal;
font-weight: 500;
line-height: 120%;
}
p {
color: #FFF;
text-align: center;
font-size: clamp(12px,.7vw,16px);
font-style: normal;
font-weight: 100;
line-height: 120%; /* 19.2px */
@media(max-width:480px){
br {
display: none;
}
}
}
}
span {
position: relative;
width: 1px;
// height: 100%;
background-color: white;
margin-left: 42px;
margin-right: 42px;
@media(max-width:480px){
margin-left: 12px;
margin-right: 12px;
display: none;
}
}
@media(max-width:480px){
gap: 10px;
}
}
.main-button-block {margin-top: clamp(24px, 4vw, 70px);}
@media(max-width:480px){
justify-content: space-between;
.bottom-part {
display: flex;
flex-direction: column-reverse;
align-items: center;
}
}
}
@media(max-width:1024px){
width: 100%;
}
}
@media(max-width:480px){
align-items:flex-end;
padding-bottom: 5%;
}
.small-banner {
position: absolute;
width: 100%;
max-width: 406px;
padding: 24px 43px;
border-radius: 28.333px;
background: linear-gradient(263deg, rgba(254, 192, 83, 0.14) 1.73%, rgba(254, 192, 83, 0.00) 83.84%), #343140;
right: 0;
bottom: 10%;
display: flex;
flex-direction: column;
gap: 16px;
h3 {
color: #FFF;
font-family: Gotham Pro;
font-size: 23.333px;
font-style: normal;
font-weight: 100;
line-height: 120%; /* 28px */
letter-spacing: -0.467px;
span {
font-style: italic;
font-weight: 700;
}
}
a{
display: flex;
align-items: center;
justify-content: space-between;
border-radius: 16.667px;
background: #FFF;
padding: 10px 26px;
p{
color: #343140;
font-family: Gotham Pro;
font-size: 16.667px;
font-style: normal;
font-weight: 100;
line-height: 120%;
span {
font-weight: 700;
}
}
}
@media(max-width: 1024px){
display: none;
}
}
}
}
.button-block {
display: flex;
align-items: center;
.btn-get-style {
display: flex;
align-items: center;
gap: 42px;
max-width: 381px;
white-space:nowrap;
color: #FFF;
font-family: Gotham Pro;
font-size: clamp(15px,1.6vw,24px);
font-style: normal;
font-weight: 400;
line-height: normal;
display: flex;
padding: 24px 52px;
justify-content: center;
align-items: center;
border-radius: 51px;
background: var(--Linear, linear-gradient(91deg, #DF5017 -4.25%, #F9CB74 108.11%));
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px #DF5017;
svg{transition: .25s ease all;}
&:hover > svg{
transform: translateX(5px);
}
}
@media(max-width:480px){
justify-content: center;
.btn-get-style {
padding: 16px 11px;
gap: 20px;
width: 220px;
svg {
width:32px;
}
}
}
}
.section-mini {
position: relative;
padding: 35px 0;
@media(max-width:480px) {
padding: 16px 0;
}
}
.slider_menu_wrapper {
position: relative;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
min-width: 0px;
overflow-x: hidden;
margin: 0 auto;
}
.slider_menu {
width: 100%;
max-width: 500px;
padding-top: 50px;
padding-bottom: 50px;
min-width: 0px;
overflow: visible!important;
@media(max-width:1400px){
max-width: 350px;
}
@media(max-width:480px){
max-width: 300px;
}
.swiper-slide {
// width: fit-content!important;
// img {
// width: 100%;
// }
.item {
position: relative;
border-radius: 30px;
overflow: hidden;
width: 100%;
height: 900px;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: center;
padding-bottom: 40px;
z-index: 1;
@media(max-width:1400px){height: 650px;}
@media(max-width:480px){height: 553px;}
.pseudoit {
position: absolute;
content: '';
width: 100%;
height: 100%;
top: 0;
left: 0;
background: linear-gradient(270deg, rgba(23, 20, 34, 0.40) 0%, rgba(23, 20, 34, 0.70) 100%);
// background: rgba(23, 20, 34, 0.80);
opacity: 1;
transition: .3s ease all;
}
.image-bckg {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
img {
width: 100%;
}
}
.stuff {
display: flex;
flex-direction: column;
gap: 8px;
z-index: 1;
h2 {
color: #FFF;
text-align: center;
font-size: clamp(30px,3vw,60px);
font-style: normal;
font-weight: 700;
line-height: 110%; /* 66px */
text-transform: uppercase;
}
.stuff-button {
display: flex;
align-items: center;
justify-content: center;
a {
display: flex;
align-items: center;
gap: 20px;
border-radius: 50px;
padding: 24px;
width: 100%;
max-width: 259px;
font-family: Gotham Pro;
font-size: clamp(15px,1.2vw,20px);
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: uppercase;
@media(max-width:480px){
padding: 14px;
max-width: 220px;
svg {
width: 30px;
}
}
}
}
}
}
}
}
// .swiper-slide-prev .pseudoit {
// background: linear-gradient(270deg, rgba(23, 20, 34, 0.20) 0%, rgba(23, 20, 34, 0.60) 100%)!important;
// }
// .swiper-slide-next .pseudoit {
// background: linear-gradient(270deg, rgba(23, 20, 34, 0.20) 0%, rgba(23, 20, 34, 0.60) 100%)!important;
// }
.activeSlide .item .pseudoit {
opacity: 0!important;
}
.insta-colors{
background: linear-gradient(91deg, #8D00FF 0.18%, #CF3DFF 99.84%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px rgba(89, 0, 164, 0.80);
color: #FFF;
}
.vk-colors {
background: linear-gradient(267deg, #007BD5 -7.12%, #1961B5 61.68%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px #1961B5;
}
.banners-header {
font-family: Hooskai Chamfered Square;
background: linear-gradient(96deg, #00A1C9 0%, #78D1FF 48.01%, #E8F7FF 99.11%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
-webkit-mask-image: linear-gradient(96deg, #00A1C9 0%, #78D1FF 48.01%, #E8F7FF 99.11%);
mask-composite: exclude;
color: transparent;
}
.banners-colors{
color: #061827;
background: linear-gradient(96deg, #67D1F2 0%, #ADE3FF 48.01%, #E8F7FF 99.11%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px rgba(255, 255, 255, 0.80);
svg path {
fill:#061827;
}
}
.polyg {
font-family: Hooskai Chamfered Square;
font-size: clamp(30px,2.5vw,47px)!important;
}
.polyg-colors{
background: linear-gradient(91deg, #8D00FF 0.18%, #CF3DFF 99.84%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px rgba(89, 0, 164, 0.80);
}
.package {
font-family: 'Sangha';
background: linear-gradient(93deg, #FF7286 2.67%, #FFF 81.43%);
font-size: clamp(32px,4.2vw,80px)!important;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-transform: none!important;
}
.package-colors {
background: linear-gradient(93deg, #FF7286 2.67%, #FFF 81.43%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px rgba(255, 255, 255, 0.80);
color: #061827;
svg path {
fill:#061827;
}
}
.websites {
font-family: 'Nasalization';
}
.websites-colors {
background: linear-gradient(135deg, #fc377e 0%, #0a154e 100%);
box-shadow: inset 4px 4px 6px 0 rgba(255, 255, 255, 0.5), 4px 4px 20px 0 rgba(252, 55, 126, 0.5);
color: #fff;
svg path {
fill:#fff;
}
}
.presentations {
color: #FFF;
text-align: center;
font-family: Gotham Pro;
font-size: 60px;
font-style: normal;
font-weight: 700;
line-height: 110%; /* 66px */
text-transform: uppercase;
}
.presentations-colors {
background: linear-gradient(91deg, #DF5017 -4.25%, #F9CB74 108.11%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px rgba(255, 255, 255, 0.80);
color: white;
svg path {
fill:white;
}
}
.swiper-button-prev.slider_menu-prev {
width: 110px;
height: 110px;
left: -10%!important;
&::after{
content: ''!important;
width: 110px!important;
height: 110px!important;
background-image: url(../src/slides/ar-left.png);
background-size: cover;
}
@media(max-width:1400px){
width: 90px;
height: 90px;
&::after{
width: 90px!important;
height: 90px!important;
}
}
@media(max-width:480px){
width: 60px;
height: 60px;
&::after{
width: 60px!important;
height: 60px!important;
}
}
}
.swiper-button-next.slider_menu-next {
width: 110px;
height: 110px;
right: -10%!important;
&::after{
content: ''!important;
width: 110px!important;
height: 110px!important;
background-image: url(../src/slides/ar-right.png);
background-size: cover;
}
@media(max-width:1400px){
width: 90px;
height: 90px;
&::after{
width: 90px!important;
height: 90px!important;
}
}
@media(max-width:480px){
width: 60px;
height: 60px;
&::after{
width: 60px!important;
height: 60px!important;
}
}
}
// new
.section-about {
position: relative;
}
.in-block-header {
display: flex;
align-items: center;
h2 {
color: #FFF;
font-family: Gotham Pro;
font-size: clamp(32px,2.6vw,50px);
font-style: normal;
font-weight: 700;
line-height: 110%;
text-transform: uppercase;
@media(max-width:480px){
text-align: center;
}
@media(min-width:481px){
br {
display: none;
}
}
}
}
.about-block{
position: relative;
display: flex;
padding: 50px;
border-radius: 30px;
background: linear-gradient(90deg, #8A2645 0%, #291725 75.74%, rgba(41, 23, 37, 0.00) 100.35%);
overflow: hidden;
height: 515px;
.about-block-bckg{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
content: '';
display: flex;
img {
width: 100%;
height: 100%;
@media(max-width:480px){
object-fit: contain;
object-position: bottom right;
}
}
}
.about-wrap{
display: flex;
z-index: 1;
.about-wrap-text {
display: flex;
flex-direction: column;
gap:42px;
width: 75%;
.text-block {
display: flex;
flex-direction: column;
gap: 1rem;
position: relative;
padding-left: 24px;
p {
color: #FFF;
font-family: Gotham Pro;
font-size:clamp(16px,1.4vw,22px);
font-style: normal;
font-weight: 400;
line-height: 140%; /* 30.8px */
}
&::before{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='142' viewBox='0 0 8 142' fill='none'%3E%3Cpath d='M4 0.0816948L0.0816948 4L4 7.91831L7.91831 4L4 0.0816948ZM3.99999 141.918L7.9183 138L3.99999 134.082L0.081689 138L3.99999 141.918ZM3.32133 4L3.32132 138L4.67866 138L4.67867 4L3.32133 4Z' fill='white'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-size: contain;
top: 0;
left: 0;
position: absolute;
display: flex;
content: '';
width: 100%;
height: 100%;
}
}
.text-button {
display: flex;
align-items: center;
a {
display: flex;
align-items: center;
position: relative;
width: 100%;
max-width: 263px;
padding: 10px 30px;
border-radius: 50px;
border: 2px solid #FFF;
box-shadow: 4px 4px 10px 0px rgba(255, 255, 255, 0.20);
p {
color: #FFF;
text-align: center;
font-family: Gotham Pro;
font-size:clamp(14px,1vw,19px);
font-style: normal;
font-weight: 700;
line-height: 140%; /* 26.6px */
text-transform: uppercase;
}
i {
position: absolute;
right:0;
width: 75px;
height: 75px;
border-radius: 50px;
background: linear-gradient(91deg, #DF5017 -4.25%, #F9CB74 108.11%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px #DF5017;
display: flex;
align-items: center;
justify-content: center;
transition: 0.3s ease-in-out all;
@media(max-width:480px){
width: 63px;
height: 63px;
}
}
&:hover >i {
transform: translateX(5px);
}
}
}
}
}
@media(max-width:480px){
height: fit-content;
padding: 20px;
.about-wrap{
.about-wrap-text{
width: 100%;
}
}
}
}
// new
// marquee
.section-marquee {
display: flex;
flex-direction: column;
gap: 12px;
z-index: 1;
.sectionn-marquee-banner {
z-index: 3;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
max-width: 590px;
padding: 32px 12px;
border-radius: 20px;
background: linear-gradient(123deg, #8A2645 4.42%, rgba(138, 38, 69, 0.19) 32.59%, rgba(138, 38, 69, 0.00) 52.74%), #282533;
box-shadow: 12px 7px 25px 0px rgba(0, 0, 0, 0.43);
display: flex;
align-items: center;
justify-content: center;
.wrap {
display: flex;
flex-direction: column;
gap: clamp(8px,1.6vw,32px);
h3 {
color: white;
text-align: center;
// font-family: Inter;
font-size: clamp(25px,2.2vw,40px);
font-style: normal;
font-weight: 500;
line-height: 37.968px; /* 94.921% */
}
}
@media(max-width:480px){
width: 100%;
max-width: 260px;
padding: 26px 20px;
.wrap{
width: 100%;
}
}
}
}
.marquee-block{
display: flex;
width: 100%;
align-items: center;
min-width: 0;
z-index: 2;
.marquee-slider-one{
display: flex;
.swiper-slide {
width: fit-content!important;
// max-height:315px;
border-radius:20px;
overflow: hidden;
picture {
display: block;
img {
width: 100%;
@media(max-width:480px){
height:50vw;
}
}
}
@media(max-width:480px){
max-height:280px;
}
}
}
.marquee-slider-two{
display: flex;
.swiper-slide {
width: fit-content!important;
// max-height:315px;
border-radius:20px;
overflow: hidden;
picture {
display: block;
img {
width: 100%;
@media(max-width:480px){
height:50vw;
}
}
}
@media(max-width:480px){
max-height:280px;
}
}
}
.item {
display: flex;
width: fit-content;
flex: 1 0 auto;
img {
width: 100%;
}
}
}
// marquee
// contact us
.contact-us-block {
display: flex;
position: relative;
background: linear-gradient(90deg, #FFA462 0%, #B55550 13.08%, #8A2645 27.38%, #291725 84.9%, rgba(41, 23, 37, 0.00) 100%);
border-radius: 30px;
overflow: hidden;
padding: 50px;
.contact-us-block-bckg{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
display: flex;
img {
width: 100%;
height: 100%;
}
}
.contact-us-wrap {
z-index: 1;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
width: 55%;
gap:60px;
margin-bottom: 50px;
.contact-us-buttons {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
gap: 24px;
.contact-us-button {
display: flex;
align-items: center;
a{
border-radius: 50px;
border: 2px solid #FFF;
box-shadow: 4px 4px 20px 0px rgba(255, 255, 255, 0.20);
padding: 10px 40px;
display: flex;
align-items: center;
width: 327px;
position: relative;
transition: 0.1s ease-in-out all;
p {
color: #FFF;
text-align: center;
font-family: Gotham Pro;
font-size: clamp(14px, 1vw, 19px);
font-style: normal;
font-weight: 700;
line-height: 140%;
text-transform: uppercase;
}
i {
position: absolute;
right: 0;
width: 75px;
height: 75px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
transition: 0.3s ease-in-out all;
&.wu {
background: linear-gradient(0deg, #20B038 0%, #60D66A 100%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px #60D66A;
}
&.tg {
background: linear-gradient(60deg, #006EAC 18.07%, #41B4F2 98.77%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px #41B4F2;
}
@media(max-width:480px){
width: 63px;
height: 63px;
svg {
width: 56%;
}
}
}
&.w-u:hover {
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.20) inset, 4px 4px 12px 0px #60D66A;
border: 2px solid #60D66A;
}
&.t-g:hover {
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.20) inset, 4px 4px 12px 0px #41B4F2;
border: 2px solid #41B4F2;
}
&:hover >i {
transform: translateX(5px);
}
}
}
}
@media(max-width:991px){
width: 100%;
.contact-us-buttons {
flex-direction: column;
gap: 32px;
}
}
}
}
// contact us
// promo
.section-promos-phone {
position:absolute;
width: 55vw;
left: 0;
z-index: 2;
max-width: 1020px;
img {
width: 100%;
}
@media(max-width:1440px){
left: -10%;
bottom: 0;
}
@media(max-width:1300px){
display: none;
}
@media(max-width:480px){
display:block;
width: 77vw;
left: -15%;
bottom: 26%;
}
}
.section-promos-header{
display: flex;
align-items: center;
margin-bottom: clamp(32px, 2.6vw, 50px);
h2 {
font-family: Gotham Pro;
font-size: clamp(32px, 2.6vw, 50px);
font-style: normal;
font-weight: 700;
line-height: 110%; /* 55px */
text-transform: uppercase;
background: linear-gradient(91deg, #DF5017 0%, #F9CB74 73.52%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
}
.promos-wrap {
position: relative;
display: flex;
flex-direction: column;
z-index: 1;
.promos-wrap-header{
display: flex;
flex-direction: column;
width: 76%;
align-items: flex-end;
margin-bottom: clamp(24px,2.4vw,42px);
.header-wrap {
display: flex;
flex-direction: column;
align-items: flex-end;
width: fit-content;
p {
font-family: Gotham Pro;
font-size: clamp(36px,4vw,80px);
font-style: normal;
font-weight: 500;
line-height: 110%; /* 88px */
text-transform: uppercase;
background: linear-gradient(91deg, #DF5017 0%, #F9CB74 73.52%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
h2 {
color: #FFF;
font-family: AmadeusAP;
font-size: clamp(52px, 7vw, 135px);
font-style: normal;
font-weight: 400;
line-height: 78%;
margin-top: clamp(-22px, 2.6vw, -52px);
margin-right: -60px;
@media(max-width:480px){
margin-right: 0;
line-height: 121%;
}
}
}
@media(max-width:480px){
width: 85%;
}
}
}
.promo-text-line-col {
display: flex;
flex-direction: column;
gap: clamp(24px,2.4vw,42px);
}
.promo-text-line{
display: flex;
align-items: center;
gap: 20px;
width: 85%;
p {
color: #FFF;
font-family: Gotham Pro;
font-size: clamp(16px,1.6vw,30px);
font-style: normal;
font-weight: 400;
line-height: 110%; /* 33px */
text-transform: uppercase;
white-space: nowrap;
position: relative;
}
.text-box {
width: 425px;
flex: 1 0 auto;
}
.text-box-1 {
width: 166px;
flex: 1 0 auto;
&:before {
position: absolute;
content: '';
width: 24%;
right: -13%;
top: 50%;
transform: translateY(-50%);
height: 3px;
background: #F9CB74;
border-radius: 25px;
}
}
.text-box-2{
width: 166px;
flex: 1 0 auto;
}
.short-line {
width: 100%;
max-width: 187px;
height: 3px;
background: #F9CB74;
border-radius: 25px;
}
.endless-line {
height: 3px;
border-radius: 25px;
background: linear-gradient(to right, #DF5017, #F9CB74);
width: 100%;
left: 0;
}
@media(max-width:480px){
display: none;
}
}
.promo-text-line-col-mobile {
display: flex;
flex-direction: column;
gap: 10px;
align-items: flex-end;
p {
color: #FFF;
font-family: Gotham Pro;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 110%; /* 33px */
text-transform: uppercase;
white-space: nowrap;
position: relative;
display: flex;
align-items: center;
gap:12px;
width: 100%;
padding-right: 12px;
text-align: end;
span {
height: 2px;
border-radius: 25px;
background: linear-gradient(to right, #DF5017, #F9CB74);
width: 100%;
left: 0;
}
}
@media(min-width:481px){
display: none;
}
}
.promo-slider-block{
display: flex;
width: 100%;
align-items: center;
min-width: 0;
z-index: 2;
padding: 42px 0;
.promo-slider{
display: flex;
.swiper-slide {
width: fit-content!important;
max-width: 290px;
// max-height:315px;
border-radius:20px;
overflow: hidden;
picture {
display: block;
img {
width: 100%;
@media(max-width:480px){
height:20vw;
}
}
}
@media(max-width:480px){
max-height:280px;
}
@media(max-width:480px){
border-radius: 6.414px;
}
}
}
@media(max-width:480px){
padding: 12px 0;
}
}
.promo-bottom {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 32px;
@media(max-width:1300px){
flex-direction: column;
}
@media(max-width:1300px){
gap: unset;
margin-top:20px;
}
.promo-bottom-price {
display: flex;
align-items: center;
p {
color: #FFF;
font-family: AmadeusAP;
font-size: clamp(42px,4.5vw,84px);
font-style: normal;
font-weight: 400;
line-height: 110%;
span {
font-size: clamp(62px,6.2vw,119px);
}
}
}
}
//promo
// promo2
.section-promo-2 {
position: relative;
}
.promo-2-header {
display: flex;
align-items: center;
justify-content: center;
h2 {
text-align: center;
font-size: clamp(29px,2.1vw,40px);
font-style: normal;
font-weight: 700;
line-height: 110%; /* 44px */
text-transform: uppercase;
}
}
.promo-2-wrap {
display: flex;
justify-content: space-between;
margin-top: clamp(28px,1.8vw,35px);
._buttons {
display: flex;
flex-direction: column;
width: 33%;
gap: 40px;
}
._pictures {
display: flex;
width: 65%;
.__item__pic{
display: none;
width: 100%;
&.active {
display: flex;
}
img {
width: 100%;
object-fit:contain;
}
}
}
@media(max-width:1024px){
flex-direction: column;
._buttons {
width: 100%;
}
._pictures{
width: 100%;
}
}
@media(max-width:480px){
._pictures {
display: none;
}
}
}
.down-descr {
display: flex;
p {
color: #FFF;
font-family: Gotham Pro;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 140%;
}
}
/* ACCORDEON______________________________________*/
.section-faq-wrap {
display: flex;
flex-direction: column;
gap: 12px;
}
span {
cursor: pointer;
}
i {
cursor: pointer;
}
button {
background: transparent;
outline: none;
border: none;
transition: .3s ease;
}
.para-hide {
display: none;
}
button i {
font-size: 1rem;
transition: .3s ease;
}
.accordion {
border-radius: 30px;
transition: all .3s ease!important;
&._spec {
background: linear-gradient(154deg, #FFA462 0%, #B45350 21.79%, #8A2645 48.93%, #291725 84.55%);
}
&.shadow {
box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.10);
// background: linear-gradient(154deg, #FFA462 0%, #B45350 21.79%, #8A2645 48.93%, #291725 84.55%);
transition: .3s ease all;
background: linear-gradient(90deg, #8A2645 0%, #291725 73.92%);
}
&.shadow._spec{
background: linear-gradient(154deg, #FFA462 0%, #B45350 21.79%, #8A2645 48.93%, #291725 84.55%)!important;
}
}
button.btn-toggle-show-2 {
display: flex;
align-items: center;
// justify-content: space-between;
width: 100%;
// background: linear-gradient(94deg, #D9E1FF 0%, #F3F7FF 100%);
background: linear-gradient(90deg, #8A2645 0%, #291725 73.92%);
border-radius: 10px;
transition: .3s ease all;
gap: 0 12px;
.icon__accordeon {
position: relative;
width: 40px;
height: 40px;
border-radius: 50%;
background: linear-gradient(148deg, #FFF 30.8%, #C1C0C4 57.13%, #86848D 72.92%, #343140 82.7%), #004294;
box-shadow: -4px -4px 6px 0px rgba(255, 255, 255, 0.50) inset;
filter: drop-shadow(-3px -3px 18px rgba(255, 255, 255, 0.78)) drop-shadow(7px 7px 20px rgba(0, 0, 0, 0.60));
display: flex;
align-items: center;
justify-content: center;
&:before {
position: absolute;
width: 16px;
height: 16px;
display: flex;
background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 18L10 2' stroke='%23282828' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M18 10L2 10' stroke='%23282828' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
content: '';
}
&.rotate {
&:before {
background-image: url("data:image/svg+xml,%3Csvg width='20' height='4' viewBox='0 0 20 4' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 2.00024L2 2.00025' stroke='%23282828' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
}
}
}
&.active {
background: transparent !important;
transition: .3s ease all;
span {
text-shadow: 0px 0px 0.85px currentColor;
// color: #343434;
}
}
@media(max-width:480px){
height: 68px;
}
&._spec {
background: linear-gradient(154deg, #FFA462 0%, #B45350 21.79%, #8A2645 48.93%, #291725 84.55%);
}
}
button.btn-toggle-show-2 span {
color: #FFF;
font-family: Gotham Pro;
font-size: clamp(25px,1.6vw,30px);
font-style: normal;
font-weight: 700;
line-height: 110%; /* 33px */
text-transform: uppercase;
transition: .3s ease all;
@media(max-width:480px){
// max-width: 250px;
// text-align: left;
}
}
.p-1 {
padding: 32px 50px;
@media(max-width:480px){
padding: 40px 20px;
}
}
.accordion:last-child {
margin: 0;
}
.inner-content p {
color: #000;
font-size: clamp(15px,.9vw,17px);
font-style: normal;
font-weight: 400;
line-height: 140%;
@media(max-width:480px){
font-weight: 100;
}
}
.inner-content ul {
display: flex;
flex-direction: column;
gap: 16px;
li {
color: #FFF;
font-family: Gotham Pro;
font-size: clamp(17px,1.2vw,22px);
font-style: normal;
font-weight: 400;
line-height: 120%; /* 26.4px */
list-style-type:disc;
span {
font-size: 16px;
font-weight: 100;
}
}
}
.promo-btn {
display: flex;
width: 260px;
padding: 15px 17px;
justify-content: center;
align-items: center;
gap: 15px;
border-radius: 30px;
background: linear-gradient(91deg, #DF5017 -4.25%, #F9CB74 108.11%);
margin-top: clamp(40px,3.8vw,70px);
p {
color: #FFF;
font-family: Gotham Pro;
font-size: 24px;
font-style: normal;
font-weight: 400;
line-height: normal;
white-space: nowrap;
span {
color: #FFF;
font-family: Gotham Pro;
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
}
&.promo-btn-premium{
background: linear-gradient(139deg, #FFF 35.28%, #C1C0C4 65.97%, #86848D 84.39%, #343140 95.79%);
box-shadow: -4px -4px 6px 0px rgba(255, 255, 255, 0.50) inset, -3px -3px 18px 0px rgba(255, 255, 255, 0.78), 10px 10px 25px 0px rgba(0, 0, 0, 0.50);
p {
color:#282828;
span {
color: #282828;
}
}
svg path {
fill: #282828;
}
}
@media(max-width:480px){
margin-left: auto;
margin-right: auto;
}
}
.promo-2-mobile-picture {
display: none;
img {width: 100%;}
@media(min-width:480px){
display: none!important;
}
&.active {
display: flex;
}
}
.promo-2-button-block {
justify-content: center;
margin-top: 42px;
@media(max-width:480px){
margin-top: 30px;
}
}
// promo2
// promo3
.section-promo-3-wrap {
display: flex;
flex-direction: column;
}
.promo-3-top-pic{
width: 100%;
img {
width: 100%;
}
@media(max-width:480px) {
display: none;
}
}
.promo-3-top-pic-mob {
width: 100%;
img {
width: 100%;
}
@media(min-width:481px) {
display: none;
}
}
.promo-slider-block-3 {
display: flex;
width: 100%;
align-items: center;
min-width: 0;
z-index: 2;
padding: 42px 0;
.promo-slider-3{
display: flex;
.swiper-slide {
width: fit-content!important;
// max-height:315px;
border-radius:20px;
overflow: hidden;
picture {
display: block;
img {
width: 100%;
@media(max-width:480px){
height:50vw;
}
}
}
@media(max-width:480px){
max-height:280px;
}
}
}
}
// promo3
//order
.section-header-bottom {
display: flex;
align-items: center;
justify-content: center;
.section-header-bottom-wrap {
display: flex;
flex-direction: column;
align-items: center;
h2 {
text-align: center;
font-family: Gotham Pro;
font-size: clamp(24px,2.7vw,50px);
font-style: normal;
font-weight: 700;
line-height: 110%;
text-transform: uppercase;
background: linear-gradient(91deg, #DF5017 0%, #F9CB74 73.52%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
h3 {
color: #FFF;
text-align: center;
font-size: clamp(23px,1.5vw,30px);
font-style: normal;
font-weight: 400;
line-height: normal;
text-transform: uppercase;
}
}
}
.process-block {
display: flex;
align-items: center;
height: 800px;
.left {
display: flex;
width: 50%;
flex: 1 0 auto;
max-width: 715px;
img {
width: 100%;
height: 100%;
}
@media(max-width:480px){
width: 100%;
}
}
.right {
display: flex;
flex-direction: column;
gap: 28px;
position: relative;
margin-top: -9%;
.process-item {
display: flex;
gap: 32px;
&:nth-child(1){transform: translateX(-17%);}
&:nth-child(2){transform: translateX(-3%);}
&:nth-child(3){transform: translateX(3%);}
&:nth-child(4){transform: translateX(3%);}
&:nth-child(5){transform: translateX(-2%);}
&:nth-child(6){transform: translateX(-17%);}
.icon {
width: 100%;
max-width: clamp(40px,4.8vw,90px);
height: clamp(40px,4.8vw,90px);
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(204deg, #FFA462 6.62%, #B45350 45.17%, #8A2645 70.56%, #291725 91.85%); ;
box-shadow: 0px 0px 3px 6px rgba(255, 255, 255, 0.26) inset;
filter: drop-shadow(7px 7px 13px rgba(0, 0, 0, 0.15));
border-radius: 50%;
svg {
width: 50%;
}
}
.text {
display: flex;
flex-direction: column;
h4 {
font-size:clamp(16px,1.6vw,26px);
font-style: normal;
font-weight: 700;
line-height: 140%;
text-transform: uppercase;
background:white;
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
p {
color: #FFF;
font-family: Gotham Pro;
font-size: clamp(15px,0.9vw,17px);
font-style: normal;
font-weight: 100;
line-height: 120%;
}
}
}
@media(max-width:1440px){
gap: 40px;
}
}
@media(max-width:1200px){
height: 100%;
flex-direction: column;
.right {
gap: 20px;
margin-top: unset;
.process-item {
gap: 20px;
&:nth-child(1){transform: unset;}
&:nth-child(2){transform: unset;}
&:nth-child(3){transform: unset;}
&:nth-child(4){transform: unset;}
&:nth-child(5){transform: unset;}
&:nth-child(6){transform: unset;}
}
}
}
@media(max-width:480px){
margin-top: 24px;
}
}
.gadget-girl-desc{
@media(max-width: 480px){
display: none;
}
}
.gadget-girl-mob{
@media(min-width: 481px){
display: none;
}
}
//order
//articles
.articles-block{
display: flex;
gap: 20px;
justify-content: space-between;
.articles-col{
display: flex;
flex-direction: column;
gap: 20px;
justify-content: space-between;
width: 100%;
max-width: 460px;
.section-promos-header{
margin-bottom: unset;
}
.article {
position: relative;
border-radius: 30px;
overflow: hidden;
padding: 30px 13px;
display: flex;
flex-direction: column;
z-index: 1;
height: 416px;
justify-content: flex-end;
._bckg{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left:0;
z-index: -1;
img {
width: 100%;
height: 100%;
}
}
.article-button {
display: flex;
align-items: center;
a{
border-radius: 50px;
border: 2px solid #FFF;
box-shadow: 4px 4px 20px 0px rgba(255, 255, 255, 0.20);
padding: 10px 40px;
display: flex;
align-items: center;
width: 100%;
position: relative;
transition: 0.1s ease-in-out all;
h4 {
color: #FFF;
text-align: center;
font-family: Gotham Pro;
font-size: clamp(12px, 1vw, 19px);
font-style: normal;
font-weight: 700;
line-height: 140%;
text-transform: uppercase;
span {
color: #FFF;
text-align: center;
font-family: Gotham Pro;
font-size: clamp(17px, 1.4vw, 28px);
font-style: normal;
font-weight: 700;
line-height: 140%; /* 39.2px */
text-transform: none;
}
}
i {
position: absolute;
right: 0;
width: 75px;
height: 75px;
border-radius: 50px;
display: flex;
align-items: center;
justify-content: center;
transition: 0.3s ease-in-out all;
&.u {
background: linear-gradient(91deg, #DF5017 -4.25%, #F9CB74 108.11%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px #DF5017;
}
@media(max-width:480px){
width: 63px;
height: 63px;
svg {
width: 56%;
}
}
}
&:hover >i {
transform: translateX(5px);
}
}
}
}
.article-small {
position: relative;
border-radius: 30px;
overflow: hidden;
padding: 30px 13px;
display: flex;
flex-direction: column;
z-index: 1;
height: 256px;
justify-content: flex-end;
._bckg{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left:0;
z-index: -1;
img {
width: 100%;
height: 100%;
}
}
.article-button {
display: flex;
align-items: center;
a{
border-radius: 50px;
padding: 10px 40px;
display: flex;
align-items: center;
flex-direction: column;
width: 100%;
position: relative;
transition: 0.1s ease-in-out all;
h4 {
color: #FFF;
text-align: center;
font-family: Gotham Pro;
font-size: clamp(12px, 1vw, 19px);
font-style: normal;
font-weight: 700;
line-height: 140%;
text-transform: uppercase;
}
i {
position: relative;
// width: 75px;
display: flex;
align-items: center;
justify-content: center;
transition: 0.3s ease-in-out all;
@media(max-width:480px){
// width: 63px;
// height: 63px;
svg {
width: 56%;
}
}
}
&:hover >i {
transform: scale(1.1);
}
}
}
}
}
@media(max-width:1200px){
flex-direction: column;
align-items: center;
.articles-col{
max-width: 760px;
}
}
}
//articles
// seo
.slider_seo-next.swiper-button-next,
.slider_seo-prev.swiper-button-prev{
color: white!important;
&::after{
font-size: 18px!important;
}
}
.slider_seo-prev.swiper-button-prev{
left: 0!important;
}
.slider_seo-next.swiper-button-next{
right: 0!important;
}
.seo-slider-block {
display: flex;
width: 100%;
align-items: center;
min-width: 0;
z-index: 2;
padding: 42px 0;
position: relative;
.seo-slider {
display: flex;
align-items: center;
width: 96%;
a {
display: flex;
flex-direction: column;
align-items: center;
padding: 10px 26px 20px;
border-radius: 16px;
border: 1px solid #FFF;
h3 {
color: #FFF;
text-align: center;
font-family: Gotham Pro;
font-size: clamp(12px, 1vw, 19px);
font-style: normal;
font-weight: 400;
line-height: 140%; /* 26.6px */
}
}
@media(max-width:1200px){
width: 85%;
}
}
}
// seo
.footer-map {
display: flex;
align-items: center;
margin-bottom: 1.5rem;
nav {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
flex-wrap: wrap;
gap: 8px;
a {
text-align: center;
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 20px;
text-transform: uppercase;
}
}
}
footer {
padding: 12px 0;
.copyright {
display: flex;
align-items: center;
gap: 22px;
justify-content: center;
p {
// color: #000;
font-family: Gotham Pro;
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
}
.pagelinks {
display: flex;
align-items: center;
justify-content: center;
.pagelink {
color: #000;
font-family: Gotham Pro;
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
}
@media(max-width:1024px){
padding: 24px 0;
}
}
// promotions
.promotion-banner{
margin-top:-3px;
position: relative;
background: linear-gradient(123deg, #8A2645 4.42%, rgba(138, 38, 69, 0.19) 32.59%, rgba(138, 38, 69, 0) 52.74%), linear-gradient(90deg, #282533 67.64%, rgba(40, 37, 51, 0) 100%);
}
.promotion-banner-bckg {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 0;
img {
width: 100%;
height: 100%;
@media(max-width: 480px){
object-position: 60%;
}
}
}
.promotion-banner-wrap {
position: relative;
width: 100%;
height: 100vh;
max-height: 601px;
display: flex;
align-items: center;
z-index: 2;
.promotion-banner-title {
display: flex;
flex-direction: column;
width: 340px;
gap: 7px;
h1 {
font-size: clamp(42px, 3.7vw, 72px);
font-style: normal;
font-weight: 500;
line-height: 110%;
text-transform: uppercase;
}
.line {
position: relative;
width: 100%;
height: 2px;
background: rgba(255, 255, 255, 0.8);
display: flex;
// flex: 1;
&:before {
position: absolute;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M5 4.3L0 0.958548V9.04145L5 4.3Z' fill='white'/%3E%3C/svg%3E ");
width: 10px;
height: 10px;
top: 50%;
transform: translateY(-50%);
left: 0;
content: '';
display: flex;
}
}
@media(max-width:480px){
width: fit-content;
}
}
}
.promo-icons-wrap {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 20px;
padding-right: 9%;
margin-top: clamp(12px,1.8vw,30px);
.promo-icon {
display: flex;
align-items: center;
width: 100%;
max-width: 100px;
img {
width: 100%;
}
}
@media(max-width:480px){
gap:4px;
padding-right: unset;
.promo-icon {
max-width: 35px;
}
}
}
.promo-pictures-wrap {
display: flex;
align-items: center;
gap: 10px;
margin-top: clamp(12px,1.2vw,20px);
.promo-pic {
display: flex;
align-items: center;
img {
width: 100%;
}
}
@media(max-width:480px){
gap: 5px;
}
}
.promo-bottom-margin {
margin-top:clamp(32px,2.6vw,48px);
gap: 32px!important;
}
.promo-bottom-element {
display: flex;
align-items: center;
width: 340px;
padding: 9px 31px;
position: relative;
border-radius: 50px;
border: 2px solid #FFF;
// box-shadow: 4px 4px 20px 0px rgba(255, 255, 255, 0.80);
.__left {
display: flex;
flex-direction: column;
align-items: center;
h2 {
color: #FFF;
text-align: center;
font-family: "Gotham Pro";
font-size: 30px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 42px */
text-transform: uppercase;
}
p {
color: #FFF;
font-family: "Gotham Pro";
font-size: 19px;
font-style: normal;
font-weight: 400;
line-height: 140%;
text-transform: uppercase;
}
}
.__right {
position: absolute;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
right: -4px;
// gap:12px;
// top: 50%;
// transform: translateY(-50%);
width: 89px;
height: 89px;
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset;
background: linear-gradient(91deg, #DF5017 -4.25%, #F9CB74 108.11%);
border-radius: 50%;
padding-top: 15px;
filter: drop-shadow(4px 4px 20px #DF5017);
p {
span {
text-align: center;
font-family: "Gotham Pro";
font-size: 62px;
font-style: normal;
font-weight: 400;
// line-height: 140%;
text-transform: uppercase;
}
color: #FFF;
text-align: center;
font-family: "Gotham Pro";
font-size: 16px;
font-style: normal;
font-weight: 400;
// line-height: 140%; /* 22.4px */
text-transform: uppercase;
}
}
}
.section-posts-pictures {
position: relative;
display: flex;
width: 100%;
padding: 32px 0 0 0;
.__item__pic {
align-items: center;
width: 100%;
display: none;
position: relative;
&.visible {
display: flex;
}
img {
width: 100%;
height: 100%;
}
video {
object-fit: cover;
width: 100%;
height: 100%;
}
@media(max-width:480px){
height: 520px;
img{
object-position: 0;
transition: 0.25s ease all;
animation: postsMove 23s linear infinite;
&.reverse {
object-position: 100%;
animation: postsMoveRev 23s linear infinite;
}
}
video {
object-position: 0;
transition: 0.25s ease all;
animation: postsMove 23s linear infinite;
}
}
}
}
.val-block {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: clamp(24px,3.3vw,62px);
gap:20px;
@media(max-width:768px) {
flex-direction: column;
gap:25px
}
}
.validity-wrap {
display: flex;
align-items: center;
width: 460px;
padding: 13px 23px;
position: relative;
border-radius: 50px;
border: 2px solid #FFF;
flex: 1 0 auto;
.validity-wrap-title {
display: flex;
align-items: center;
p{
color: #FFF;
font-family: "Gotham Pro";
font-size: 19px;
font-style: normal;
font-weight: 400;
line-height: 140%;
text-transform: uppercase;
text-align: center;
span {
font-size: 30px;
}
}
}
.date {
position: absolute;
right: -1%;
width: 230px;
height: 89px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 50px;
background: linear-gradient(92deg, #8A2645 0%, #291725 100%);
box-shadow: 4px 4px 6px 0px rgba(255, 255, 255, 0.50) inset, 4px 4px 20px 0px #8A2645;
padding-top: 15px;
p {
span {
font-size: 62px;
}
color: #FFF;
text-align: center;
font-family: "Gotham Pro";
font-size: 19px;
font-style: normal;
font-weight: 400;
line-height: 140%;
text-transform: uppercase;
}
}
@media(max-width:480px){
width: 300px;
align-self: center;
.validity-wrap-title p {
font-size: 13px;
span {
font-size: 22px;
}
}
.date {
width: 140px;
height: 70px;
p span {
font-size: 32px;
}
}
}
&.validity-wrap-right{
align-self: flex-end;
}
}
.validity-desc {
display: flex;
align-items: center;
max-width: 940px;
p {
color: #FFF;
font-family: "Gotham Pro";
font-size: clamp(15px,1.3vw,21px);
font-style: normal;
font-weight: 400;
line-height: 140%;
@media(max-width:480px){
text-align:center;
}
}
}
.promo-btn-block {
justify-content: center;
}
.section-promotion1-phone {
bottom: unset!importnant;
top: 10%;
}
.section-faq-wrap-promo {
gap:30px;
}
// promotions
// single-article-seo
.single-hero{
margin-top: -3px;
position: relative;
background: linear-gradient(123deg, #8A2645 4.42%, rgba(138, 38, 69, 0.19) 32.59%, rgba(138, 38, 69, 0) 52.74%), linear-gradient(90deg, #282533 67.64%, rgba(40, 37, 51, 0) 100%);
}
.hero-image-block {
position:absolute;
width:100%;
height:100%;
display:flex;
.promotion-banner-bckg {
position:absolute;
display: flex;
width:100%;
top:0;
left:0;
height:100%;
z-index:2;
img {
width:100%;
height:100%;
}
}
.promotion-banner-picture{
position:relative;
display: flex;
width:57%;
margin-left:auto;
margin-right:0;
img {
width:100%;
height:100%;
position:absolute;
}
@media(max-width:480px){
display:none;
}
}
}
.single-hero-wrap {
position: relative;
width: 100%;
height: 100vh;
max-height: 601px;
display: flex;
align-items: center;
z-index: 3;
.single-hero-title{
display: flex;
flex-direction: column;
width: 60%;
gap: 7px;
h1 {
font-size: clamp(24px, 2.7vw, 52px);
font-style: normal;
font-weight: 500;
line-height: 110%;
text-transform: uppercase;
}
.line {
position: relative;
width: 100%;
height: 2px;
background: rgba(255, 255, 255, 0.8);
display: flex;
&:before{
position: absolute;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M5 4.3L0 0.958548V9.04145L5 4.3Z' fill='white'/%3E%3C/svg%3E ");
width: 10px;
height: 10px;
top: 50%;
transform: translateY(-50%);
left: 0;
content: '';
display: flex;
}
}
@media(max-width:1400px){
width: 50%;
}
@media(max-width:480px){
width: 100%;
}
}
@media(max-width:480px){
max-height:301px;
}
}
.single-content {
position: relative;
}
.single-contetn-wrap {
display:flex;
flex-direction: column;
margin: clamp(32px,5.2vw,102px) auto;
p {
padding: clamp(7px,1.2vw,21px) 0;
font-size:clamp(16px,1.2vw,22px);
font-weight:100;
line-height:140%;
}
ul {
padding-inline-start: 40px!important;
li {
list-style-type: inherit;
font-size:clamp(16px,1.2vw,22px);
font-weight:100;
line-height:140%;
}
}
ol {
padding-inline-start: 40px!important;
li {
list-style-type: inherit;
font-size:clamp(16px,1.2vw,22px);
margin-bottom:clamp(6px,.6vw,12px);
font-weight:100;
line-height:140%;
&:last-child{
margin-bottom: unset;
}
}
}
}
.single-button {
margin-top:clamp(1rem,2vw,2.5rem);
justify-content: center;
}
// single-article-seo
/* promotion */
.promotion__section {
position: relative;
height: 601px;
padding: 0;
}
.promotion__title {
position: relative;
top: -360px;
padding-left: 250px;
text-transform: uppercase;
font-size: 72px;
font-weight: 500;
line-height: 79.2px;
}
.promotion__title::after {
position: absolute;
content: url(../images/Line1.svg);
left: 250px;
bottom: -41px;
}
/* presentation */
.presentation__section {
padding: 100px 0 28px;
}
.presentation__container {
position: relative;
display: flex;
flex-direction: column;
}
.presentation__title_main {
width: fit-content;
background: rgb(223, 80, 23);
background: linear-gradient(
100deg,
rgba(223, 80, 23, 1) 0%,
rgba(249, 203, 116, 1) 50%
);
margin-bottom: 10px;
font-size: 80px;
line-height: 88px;
letter-spacing: 0.8px;
font-weight: 500;
text-transform: uppercase;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.presentation__descr {
padding-left: 240px;
margin-bottom: 30px;
font-size: 40px;
font-weight: 400;
line-height: 44px;
letter-spacing: 4.6px;
text-transform: uppercase;
background-image: url(../promotion-3/Line2.svg);
background-repeat: no-repeat;
background-position: left center;
}
.presentation__descr_bold {
font-weight: 700;
}
.presentation__descr_cost {
position: absolute;
top: 49px;
padding-left: 20px;
font-family: AmadeusAP;
font-size: 83.99px;
line-height: 92.39px;
letter-spacing: -0.4px;
text-transform: lowercase;
}
.presentation__descr_cost-big {
font-size: 119.27px;
line-height: 131.2px;
}
.presentation__date {
position: relative;
align-self: flex-end;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 459px;
height: 92px;
padding: 0 244px 7px 26px;
color: var(--white);
border: 2px solid var(--white);
border-radius: 50px;
font-size: 19px;
text-transform: uppercase;
}
.presentation__date_left-top {
font-size: 30px;
}
.presentation__date_right {
position: absolute;
display: flex;
gap: 10px;
align-items: baseline;
padding-top: 37px;
padding-left: 35px;
width: 268px;
height: 140px;
right: -26px;
top: -22px;
background-image: url(../images/button-background.webp);
background-repeat: no-repeat;
background-position: center center;
background-size: 101%;
}
.presentation__date_right-big {
font-size: 62px;
font-weight: 500;
line-height: 68px;
}
.presentation__block {
position: relative;
display: flex;
justify-content: flex-end;
height: 555px;
}
.presentation__figure {
position: absolute;
left: 0;
width: 1180px;
}
.presentation__title {
position: relative;
left: 0;
width: 340px;
margin-right: 120px;
padding-top: 182px;
text-align: right;
font-size: 40px;
font-weight: 500;
line-height: 120%;
text-transform: uppercase;
}
.presentation__title::after {
position: absolute;
content: url(../images/Line3.svg);
right: -370px;
top: 185px;
}
@media (max-width: 940px) {
.presentation__title_main {
font-size: 35px;
line-height: 50px;
margin-bottom: 20px;
}
.presentation__descr {
font-size: 20px;
margin-bottom: 25px;
padding-left: 145px;
line-height: 12px;
letter-spacing: 2.6px;
}
}
@media (max-width: 765px) {
.presentation__title_main {
font-size: 30px;
align-self: center;
}
.presentation__descr {
padding-left: 0;
margin-bottom: 70px;
align-self: center;
background-image: none;
font-size: 16px;
letter-spacing: 0.5px;
}
.presentation__descr_cost {
display: block;
width: 103px;
font-size: 17px;
top: 55px;
right: auto;
left: auto;
padding: 0;
margin-left: 76px;
}
.presentation__descr_cost-big {
font-size: 30px;
}
}
@media (max-width: 480px) {
.presentation__title {
position: static;
}
}
.desctop {
@media(max-width:480px){
display: none!important;
}
}
.mobile {
@media(min-width:481px){
display: none!important;
}
}
.promo-3-single-pic {
display:flex;
justify-content: flex-end;
margin-bottom: -6%;
img {
width: 100%;
max-width: 1670px;
}
}
.promo-3-single-big-pic img{
width: 100%;
}