@font-face {
    font-family: 'Bebas Neue';
    src: url(./fonts/bebasneueregular.ttf);
}

@font-face {
    font-family: 'Druk Text Wide Cyr';
    src: url(./fonts/druktextwidecyr-medium.otf);
}

@font-face {
    font-family: 'SF UI Display';
    src: url(./fonts/SFUIDisplay-Regular.ttf);
}

@font-face {
    font-family: 'Basis Grotesque Pro';
    src: url(./fonts/BasisGrotesquePro-Regular.ttf);
}

body {
    margin-top: 0;
    padding-top: 0;
    max-width: 1920px;
    background-color: #000000;
}

.header {
    background-image: url('./media/headerBack.png');
}

.dates {
    padding-top: 45px;
    width: 576px;
    margin: 0 auto 0 auto;
    display: flex;
    justify-content: space-between;
    margin-bottom: 380px ;
}

#dateSubtitle1, #dateTitle1 {
    text-align: right;
}

#dateSubtitle1, #dateSubtitle2 {
    color: #FFF;
    text-align: right;
    font-family: SF UI Display;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 0;
    padding-bottom: 0;
}

#dateTitle1, #dateTitle2 {
    margin-top: 0;
    padding-top: 0;
    color: #FFF;
    text-align: right;
    font-family: 'Bebas Neue';
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
}

#headerTag {
    color: #FFFFFF;
    text-align: center;
    font-family: 'Bebas Neue';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 106.8%;
}

#bigTitle{
    color: #FFFFFF;
    text-align: center;
    font-family: 'Druk Text Wide Cyr';
    font-size: 80px;
    font-style: normal;
    font-weight: 500;
    margin: auto;
}

#titleLable {
    margin-left: 530px;
    margin-top: -85px;
    padding-top: 65px;
    padding-left: 0;
    padding-right: 175px;
    display: block;
    width: 852px;
    height: 160px;
    background: url('./media/a.png') no-repeat;
    background-position: left;
    letter-spacing: 1.5px;
    background-size: 56%;
}

.tablet {
    display: flex;
    justify-content: space-between;
    width: 900px;
    height: 98px;
    margin-left: 480px;
    border-radius: 20px;
    border: 1px solid rgba(158, 153, 149, 0.45);
    background: rgba(43, 41, 41, 0.45);
    backdrop-filter: blur(9.5px);
    padding-top: 16px;
    padding-right: 34px;
    padding-left: 26px;
}

.tablet > p {
    margin-top: 0;
    padding-top: 0;
    width: 461px;
    color: #FFF;
    font-family: SF UI Display;
    font-size: 25px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}

.tablet > button {
    background: url('./media/mainButton.png'), lightgray 0px 0px / 100% 100% no-repeat;
    width: 348px;
    height: 72px;
    background-color: #000;
    border: none;
}

.instagramMain {
    margin-left: 885px;
    width: 166px;
    height: 78px;
    margin-top: 46px;
    padding-top: 30px;
    background: url('./media/instaBack.png') no-repeat;
    background-size: cover;
}

#instagramMain {
    width: 151px;
    height: 36px;
    border-radius: 13px;
    background-color: #FFFFFF;
    display: flex;
    width: 127px;
    height: 25px;
    padding: 13px 14px 10px 10px;
}

#instagramMain > a {
    display: block;
    margin-bottom: 10px;
    padding-left: 4px;
    text-transform: uppercase;
    text-align: center;
    color: #363636;
    text-align: center;
    font-family: 'Bebas Neue';
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    
}

.table {
    min-height: 820px;
    padding-top: 170px;
    padding-left: 380px;
    padding-right: 380px;
    padding-bottom: 167px;
    background: url('./media/tableBack.png') no-repeat;
    background-color: #000000;
}

.table > h1 {
    color: #363636;
    text-align: left;
    font-family: 'Bebas Neue';
    font-size: 58px;
    font-weight: 700;
    line-height: 41px;
    text-transform: uppercase;
}

.tableItems {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.tableItems > div {
    max-width: 500px;
    min-height: 180px;
    margin-bottom: 42px;
    border: solid 1px #1C1C1C;
    padding: 29px;
    padding-top: 0;
    color: #1C1C1C;
    font-family: Basis Grotesque Pro;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 23px;
}

.emojiBlock {
    margin-top: 55px;
    padding-left: 380px;
    padding-right: 380px;
    padding-bottom: 100px;
    background-color: #000000;
}

.emojiBlock > h1 { 
    color: #FFF;
    text-align: left;
    font-family: 'Bebas Neue';
    font-size: 55px;
    font-style: normal;
    font-weight: 700;
    line-height: 41px; /* 41% */
    text-transform: uppercase;
}

.emojiList {
    display: flex;
    justify-content: space-between;
}

.emogiCard {
    width: 210px;
    color: #FFFFFF;
}

.emogiCard > img {
    width: 139px;
    height: 139px;
    display: flex;
    margin-left: -30px;
    border: 4px solid lightgray;
}

.emogiCard > h2 {
    height: 60px;
    font-family: Montserrat;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}

.emogiCard > p {
    height: 185px;
    font-family: Montserrat;
    font-size: 15px;
    font-style: normal;
    font-weight: 300;
    line-height: 25px;
}

.emogiCard > button {
    border-radius: 12px;
    background: radial-gradient(21.44% 50% at 50.00% 50.00%, #FFCE6A 0%, #FFD28E 94.79%);
    box-shadow: 0px 0px 35px -9px #FFCE70;
    width: 210px;
    height: 50px;
}


.results {
    padding-left: 323px;
    padding-right: 323px;
}

.results > h1 {
    color: #FFF;
    text-align: center;
    font-family: 'Bebas Neue';
    font-size: 70px;
    font-style: normal;
    font-weight: 700;
    line-height: 76px;
}



.results > h2 {
    text-align: center;
    width: 815px;
    color: #FFF;
    text-align: center;
    font-family: Montserrat;
    font-size: 35px;
    font-style: normal;
    font-weight: 700;
    line-height: 44.5px;
    margin: auto;
}

.results > button {
    border: none;
    width: 403.2px;
    height: 96px;
    border-radius: 12px;
    background: radial-gradient(21.44% 50% at 50.00% 50.00%, #7B5794 0%, #8A39C3 94.79%);
    box-shadow: 0px 0px 35px -9px #832BC0;
    color: #FFF;
    text-align: center;
    font-family: 'Bebas Neue';
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: 41px;
    margin-left: 435px;
    margin-top: 27px;
}

.bigCard {
    display: flex;
}

.centralPhoto {
    width: 308px;
    position: relative;
    z-index: 2;
    margin-left: -154px;
    margin-top: -50px;
}

.centralPhoto > img {
    position: relative;
    width: 308px;
    border-radius: 100%;
    z-index: 2;
    border: 4px solid lightgray;
}

.centralPhoto > p {
    position: relative;
    z-index: 3;
    border-radius: 5px;
    background: #FFFFF0;
    color: #8120C3;
    text-align: center;
    font-family: Arial;
    font-size: 18.356px;
    font-style: normal;
    font-weight: 700;
    line-height: 29.37px;
    text-transform: uppercase;
    margin-top: -70px;
}

.left {
    padding-left: 103px;
    padding-right: 160px;
    width: 374px;
    height: 231px;
    border-radius: 24px;
    background: linear-gradient(90deg, #1A1A1A 0%, #2F2F2F 100%);
    z-index: 1;
    margin-bottom: 131px;
}

.right {
    padding-left: 175px;
    width: 462px;
    height: 231px;
    border-radius: 24px;
    background: linear-gradient(90deg, #7618B7 0%, #8421C7 100%);
    margin-bottom: 131px;
    margin-left: -154px;
}

.left > h1, .right > h1 {
    margin: 0;
    padding-top: 30px;
    padding-bottom: 10px;
    color: #FFF;
    font-family: Montserrat;
    font-size: 25px;
    font-style: normal;
    font-weight: 700;
}

.left > li, .right > li {
    margin-top: 0;
    padding-top: 0;
    color: #FFF;
    font-family: Montserrat;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 37.5px;
}




.stdCards {
    display: flex;
    justify-content: space-between;
    margin-bottom: 49px;
}

.stdCard {
    width: 207px;
    border-radius: 8px;
    height: 232px;
    background: radial-gradient(70.71% 70.71% at 50% 50%, rgba(255, 255, 255, 0.11) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(70.71% 70.71% at 50% 50%, rgba(255, 255, 255, 0.11) 0%, rgba(255, 255, 255, 0.00) 100%), linear-gradient(180deg, rgba(255, 255, 255, 0.11) 0%, rgba(255, 255, 255, 0.00) 100%), #0C0C0C;

}

.avatar {
    margin-top: -45px;
    margin-left: 50px;
}

.avatar > img {
    border-radius: 100%;
    background: url('./media/std1.png');
    width: 106px;
    height: 106px;
    border: 4px solid lightgray;
    z-index: 1;
}

.stdCard > p {
    color: #1A974C;
    text-align: center;
    font-family: Arial;
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px;
    width: 114px;
    height: 16px;
    border-radius: 3px;
    background: #FFFFF0;
    margin-left: 50px;
    margin-top: -20px;
    position: relative;
    z-index: 3;
}

.stdCard > h1 {
    color: #FFF;
    text-align: center;
    font-family: SF UI Display;
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    text-transform: uppercase;
}

.stdCard > h2 {
    color: #FFF;
    text-align: center;
    font-family: SF UI Display;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 17.5px;
}

.stdCard > h3 {
    color: #FFF;
    text-align: center;
    font-family: SF UI Display;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 22px;
}

#saves {
    width: 186px;
    height: 45px;
    margin: auto;
    margin-bottom: 22px;
    color: #FFF;
    text-align: center;
    font-family: SF UI Display;
    font-size: 28px;
    font-style: normal;
    font-weight: 600;
    line-height: 47px;
    border-radius: 7px;
    background: radial-gradient(70.71% 70.71% at 50% 50%, rgba(255, 255, 255, 0.11) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(70.71% 70.71% at 50% 50%, rgba(255, 255, 255, 0.11) 0%, rgba(255, 255, 255, 0.00) 100%), linear-gradient(180deg, rgba(255, 255, 255, 0.11) 0%, rgba(255, 255, 255, 0.00) 100%), #791BBB;
}




.haftaList {
    padding-left: 265px;
    padding-right: 265px;
}


.haftaList > h1 {
    color: #FFF;
    text-align: left;
    font-family: 'Bebas Neue';
    font-size: 60px;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 0;
    padding-bottom: 0;
    text-transform: uppercase;
}

.haftaList > h2 {
    margin-top: 0;
    padding-top: 0;
    color: #FFF;
    text-align: left;
    font-family: SF UI Display;
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
}

.haftaItems {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.haftaItems > div {
    width: 630px;
}

#haftaItem1 {
    border-radius: 24px;
    background-color: #FFFFFF;
    min-height: 183px;
    color: #060606;
    font-family: Montserrat;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 29px;
    padding-left: 35px;
    margin-bottom: 70x;
}

#haftaItem2 {
    border-radius: 24px;
    background: linear-gradient(90deg, #7618B7 0%, #8421C7 100%);
    color: #FFF;
    font-family: Montserrat;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 29px;
    padding: 31px, auto, 22px, 32px;
    margin-bottom: 70x;
    padding-right: 20px;
    margin-left: 15px;
}

#haftaItem2 > p {
    margin-left: 32px;
}

#haftaItem {
    border-radius: 21px;
    min-height: 295px;
    background-color: #FFFFFF;
    padding-left: 20px;
    padding-right: 15px;
    margin-top: 59px;
}

#haftaItem > div {
    display: flex;
    justify-content: space-between;
}

#haftaItem > div > img {
    display: block;
    margin-top: -28px;
    margin-left: -52px;
}

#haftaItem > div > a {
    width: 40px;
    height: 40px;
    margin-top: 20px;
}

.tarifs {
    background: url('./media/tarifsBack.png') no-repeat;
    height: 1905px;
}

#tarifItemNo1{
    height: 1008px;
}

#tarifItemNo2{
    height: 1303px;
}

#tarifItemNo3{
    height: 1405px;
}

.tarifs > h1 {
    color: #FFFFFF;
    font-family: Cinematografica;
    font-size: 60px;
    font-style: normal;
    font-weight: 300;
    line-height: 76px; /* 38% */
    text-transform: uppercase;
    text-align: center;
    padding-top: 103px;
}

.tarifs > h1 > a {
    color: #BC0A03;
    font-family: Cinematografica;
    font-size: 60px;
    font-style: normal;
    font-weight: 300;
    line-height: 76px;
    text-transform: uppercase;
}

.tarifsList {
    display: flex;
    justify-content: space-between;
    padding-left: 355px;
    padding-right: 355px;
}

.tarifItem {
    width: 345px;
    border-radius: 15px;
    background-color: #FFFFFF;
    padding-left: 20px;
    padding-right: 20px;
}

.tarifHeader{
    color: #FFFFFF;
    text-align: center;
    font-family: SF UI Display;
    font-size: 19px;
    font-style: normal;
    font-weight: 700;
    line-height: 25px; /* 131.579% */
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border-radius: 5px;
    width: 183px;
    height: 30px;
    padding-top: 7px;
    margin-top: -25px;
    margin-left: 80px;
}

.tarifHeader#tarif1 {
    background: linear-gradient(285deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.33) 43.57%, rgba(255, 255, 255, 0.33) 51.72%, rgba(255, 255, 255, 0.03) 94.93%, rgba(255, 255, 255, 0.00) 99.19%), #FE4949;
}

.tarifHeader#tarif2 {
    background: radial-gradient(70.71% 70.71% at 50% 50%, rgba(75, 229, 137, 0.55) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(70.71% 70.71% at 50% 50%, rgba(75, 230, 137, 0.55) 0%, rgba(255, 255, 255, 0.00) 100%), linear-gradient(285deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.33) 43.57%, rgba(255, 255, 255, 0.33) 51.72%, rgba(255, 255, 255, 0.03) 94.93%, rgba(255, 255, 255, 0.00) 99.19%), #33AD64;
}

.tarifHeader#tarif3 {
    background: linear-gradient(285deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.20) 43.57%, rgba(255, 255, 255, 0.20) 51.72%, rgba(255, 255, 255, 0.00) 99.19%), linear-gradient(180deg, #FFD6A4 0%, #F0C188 100%);
}

.tarifItem > img {
    margin-top: 16px;
    margin-left: 2px;
    margin-right: 2px;
    border-radius: 15px;
}

.tarifItem > h1 {
    color: #000;
    text-align: center;
    font-family: SF UI Display;
    font-size: 20px;
    font-style: normal;
    font-weight: 800;
    line-height: 22px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.tarifItem > h6 {
    text-align: center;
    font-family: SF UI Display;
    font-size: 8px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.tarifItem > p, .tableItems > li {
    font-family: SF UI Display;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 16.5px;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

.tarifItem > h2 {
    color: #053D18;
    font-family: SF UI Display;
    font-size: 18px;
    font-style: normal;
    font-weight: 800;
    line-height: 16.5px;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

.prices > p {
    color: #7A7A7A;
    text-align: center;
    font-family: SF UI Display;
    font-size: 25px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px;
    margin: 0;
    padding: 0;
}

.currentPrce {
    color: #000 !important;
    text-align: center;
    font-family: SF UI Display;
    font-size: 55px !important;
    font-style: normal;
    font-weight: 700;
    line-height: 61px;
    margin-top: 5px !important;
}

.tarifItem > button {
    width: 332px;
    height: 104px;
    border: none;
    background: url(./media/sumbutton.png), lightgray 0px 0px / 100% 100% no-repeat;background-color: #FFFFFF;
    color: #5C5C5C;
    text-align: center;
    font-family: SF UI Display;
    font-size: 17px;
    font-style: normal;
    font-weight: 300;
    line-height: 26px; /* 152.941% */
    letter-spacing: 3.5px;
    text-transform: uppercase;
    margin-top: 17px;
}

.tarifFooter {
    width: 263px;
    height: 30px;
    padding-top: 7px;
    margin-top: 22px;
    margin-bottom: 18px;
    border-radius: 5px;
    margin-left: 40px;
    background: linear-gradient(291deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.33) 43.57%, rgba(255, 255, 255, 0.33) 51.72%, rgba(255, 255, 255, 0.03) 94.93%, rgba(255, 255, 255, 0.00) 99.19%), #FE4949;
    color: #FFF;
    text-align: center;
    font-family: SF UI Display;
    font-size: 19px;
    font-style: normal;
    font-weight: 700;
    line-height: 25px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.bottomListTarif > div > div {
    font-weight: bold;
}

.bottomListTarif > .listPoint {
    margin-bottom: 17px;
}


.photoAccess {
    display: flex;
    color: #FFFFFF;
    background-image: url('media/photoBack2.png');
    max-width: 1920px;
    max-height: 1080px;
}

.expert {
    width: 155px;
    margin-top: 360px;
    margin-left: 180px;
    margin-bottom: 610px;
    margin-right: 626px;
}

.expert > p {
    color: #FFFFFF;
    font-family: SF UI Display;
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 1.5px;
    margin-bottom: 8px;
    text-transform: uppercase;
}

#verified {
    padding-bottom: 0;
}

#expertsinst {
    display: block;
    padding: 5px;
    padding-left: 10px;
    width: 142px;
    height: 32px;
    border-radius: 6px;
    background: linear-gradient(279deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.33) 43.57%, rgba(255, 255, 255, 0.33) 51.72%, rgba(255, 255, 255, 0.03) 94.93%, rgba(255, 255, 255, 0.00) 99.19%), #FFDCAF;
    color: #8A5923;
    font-family: 'SF UI Display';
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 31px;
}

#elem {
    display: block;
    margin-left: -180px;
    margin-top: -180px;
}

.photoAccess > div > h1 {
    width: 979px;
    height: 148px;
    padding-top: 106px;
    text-align: left;
    font-family: Cinematografica;
    font-size: 60px;
    font-weight: 300;
    line-height: 100%;
    text-transform: uppercase;
}

#moneyRoll {
    margin-left: 390px;
    margin-top: -190px;
}

#slogan {
    font-family: 'Bebas Neue';
    font-size: 40px;
    font-style: normal;
    font-weight: 300;
    line-height: 76px;
    text-transform: uppercase;
}

.summButton {
    display: flex;
}

#sum {
    width: 307px;
    height: 70px;
    font-family: 'Bebas Neue';
    font-size: 60px;
    font-style: normal;
    font-weight: 400;
    line-height: 61%;
    text-transform: uppercase;
}

.summButton > button {
    font-family: SF UI Display;
    font-size: 17px;
    font-style: normal;
    font-weight: 300;
    line-height: 26px; /* 152.941% */
    letter-spacing: 3.5px;
    text-transform: uppercase;
    width: 332px;
    height: 104px;
    background: url(./media/sumbutton.png), lightgray 0px 0px / 100% 100% no-repeat;
    border: none;
    background-color: black;
}

.sumList {
    font-family: SF UI Display;
    font-size: 21.741px;
    font-style: normal;
    font-weight: 400;
    line-height: 40.418px;
    text-transform: uppercase;
}


.list{
    margin-top: 0px;
    padding-top: 0px;
    color: #FFFFFF;
    background-color: #000000;
    padding-bottom: 800px;
}

.list > h1 {
    margin-top: 0;
    padding-top: 90px;
    text-align: center;
    font-family: 'Bebas Neue';
    font-size: 100px;
    font-weight: 400;
    line-height: 80px;
    text-transform: uppercase;
}

.list > div {
    padding-left: 0;
    max-width: 1442px;
    margin-left: 239px;
    margin-bottom: 47px;
    text-align: left;
    font-family: 'SF UI Display';
    font-size: 40px;
    font-weight: 500;
    line-height: 76px;
    text-transform: uppercase;
}

.listPoint {
    display: flex;
}

#dot {
    margin-right: 18px;
}

.list > p {
    max-width: 1334px;
    margin-left: 271px;
    margin-bottom: 123px;
    font-family: 'SF UI Display';
    font-size: 40px;
    font-weight: 300;
    line-height: 59px;
}