/home/bdqbpbxa/demo-subdomains/settlepay.goodface.com.ua/css/adaptive.css
@media screen and (min-width: 1600px) {
.--mob-display {
display: none;
}
.policy-navigate-dropdown {
display: none;
}
.--tablet-display {
display: none;
}
.business-ecosystem-section-image-wrapper-mobile {
display: none;
}
/* Page name | .block-class-name */
}
@media screen and (max-width: 1600px) {
.--mob-display {
display: none;
}
.--pc-display {
display: block;
}
.--tablet-display {
display: none;
}
.policy-navigate-dropdown {
display: none;
}
.home-page-get-wallet-wrapper.-sattlle-pay-wallet-section {
margin-bottom: 158px;
}
.business-ecosystem-section-image-wrapper-mobile {
display: none;
}
.businessAccount-blockchain-title.--pc-display {
display: flex;
}
/* Page name | .block-class-name */
}
@media screen and (max-width: 1550px) {
.--mob-display {
display: none;
}
.--pc-display {
display: block;
}
.--tablet-display {
display: none;
}
.policy-navigate-dropdown {
display: none;
}
.home-page-get-wallet-wrapper.-sattlle-pay-wallet-section {
margin-bottom: 158px;
}
.business-ecosystem-section-image-wrapper-mobile {
display: none;
}
.faq-wrapper-with-img {
padding: 54px 64px 40px 64px;
}
/* Page name | .block-class-name */
}
@media screen and (max-width: 1450px) {
/* Page name | .block-class-name */
.container {
width: 100%;
max-width: 1450px;
margin: 0 auto;
}
.container.-smaller {
padding: 0 60px 100px 60px;
}
.container.-smaller.-without-padding-bottom {
padding: 0 60px 0 60px;
}
.faq-wrapper-with-img {
padding: 54px 24px 40px 24px;
}
.business-cta-card-image-card img {
max-height: 240px;
position: relative;
margin-left: unset;
margin-top: 57px;
}
.home-page-card-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
grid-template-rows: auto;
justify-items: center;
padding-top: 86px;
}
.home-main-card {
width: 100%;
}
.card-info-button {
display: flex;
height: 46px;
width: 46px;
padding: 12px;
justify-content: center;
align-items: center;
border-radius: 8px;
border: 1px solid #dedfe0;
box-shadow: 0px 4px 16px 0px rgba(255, 255, 255, 0.3);
transition: background 0.5s;
}
.home-page-card {
display: flex;
width: auto;
height: auto;
padding: 26px;
}
.second-card-first-img {
left: 15px;
top: 56px;
width: 228px;
}
.second-card-arrow {
bottom: 145px;
right: 80px;
}
.home-page-card.--card-center {
width: 100%;
}
.home-page-qr-code-section {
width: 500px;
}
.walletCard1 {
width: 220px;
}
.walletCard2 {
width: 220px;
}
.walletCard3 {
width: 220px;
}
.footer-main-card {
width: 100%;
}
*/ .--footer-image-section-right {
padding-left: unset;
}
.settle-pay-benefits-wrapper {
display: flex;
justify-content: space-between;
padding: 60px 0px 23px 0px;
}
.settle-pay-benefits-title {
padding-right: auto;
}
.settle-pay-wallet-benefits {
padding-top: 115px;
}
.settle-pay-wallet-exchange-section {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
.settle-pay-wallet-benefits-card {
display: flex;
width: auto;
height: auto;
padding: 26px;
}
.settle-pay-wallet-benefits-card-img-wrapper {
width: auto;
max-width: unset;
}
.businessEcosystemSectionWrapper {
min-width: 580px;
width: 580px;
margin-left: 60px;
}
.business-ecosystem-card.first {
top: 62px;
left: 173px;
}
.business-ecosystem-card.second {
top: 570px;
left: 515px;
}
.business-ecosystem-card.third {
top: 456px;
left: -88px;
}
}
@media screen and (max-width: 1350px) {
.home-left-card-wrapper {
padding: 28px 32px 28px 28px;
width: 240px;
}
.faq-wrapper-with-img {
padding: 54px 0px 40px 0px;
}
.faq-item.--accordion.-business {
max-width: 90%;
width: auto;
}
.faq-item {
width: 100%;
}
.business-cta-card-image-card img {
max-height: 200px;
position: relative;
margin-left: unset;
margin-top: 57px;
}
.scrolling-cards-wrapper {
margin: 20px 91px 165px 20px;
}
.scrolling-card-header {
font-size: 44px;
}
.business-ecosystem-section-image-wrapper {
flex-direction: column;
}
.business-ecosystem-section-image-wrapper img {
margin-left: 0;
}
.business-ecosystem-card.third {
top: 550px;
left: -234px;
}
.business-ecosystem-card.second {
top: 564px;
left: 415px;
}
.business-ecosystem-section-image-wrapper-mobile {
display: none;
}
}
@media screen and (max-width: 1260px) {
.--tablet-display {
display: block;
}
/* Page name | .block-class-name */
.container {
width: 100%;
max-width: 1260px;
margin: 0 auto;
}
.container.-smaller {
padding: 0 60px 100px 60px;
}
.container.-smaller.-without-padding-bottom {
padding: 0 60px 0 60px;
}
.main-section.--black-section.business-account-mobile {
margin-top: 0;
}
.--home-card-title {
font-size: 28px;
}
.home-page-card-list {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
grid-template-rows: auto;
justify-items: center;
padding-top: 66px;
}
.home-main-card__img {
min-height: 260px;
height: 260px;
}
.--paragraph-grey-center.-business {
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
margin-bottom: 10px;
}
.title.-centered-title.title-3.-business {
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
margin-top: unset;
}
.yellow-frame3 {
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
margin-bottom: 17px;
}
.business-button-section {
gap: 16px;
margin-top: 8px;
}
.business-log-in-button {
display: flex;
width: 104px;
height: 40px;
padding: 8px 16px;
justify-content: center;
align-items: center;
gap: 8px;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px;
}
.home-page-get-wallet-wrapper {
gap: 60px;
height: 620px;
padding: 40px;
background-position: 90% 50%;
}
.home-page-qr-code-section {
width: 500px;
padding: 20px;
height: 540px;
}
.walletCard1 {
width: 230px;
margin-left: 22%;
}
.walletCard2 {
width: 230px;
margin-left: -28.2%;
margin-top: 0;
}
.walletCard3 {
width: 230px;
margin-left: 22%;
}
.home-page-qr-button {
min-width: 160px;
padding: 20px 10px;
}
.get-app-banner-left-section-yellow-frame span {
font-size: 20px;
}
.get-app-banner-left-section-text {
font-size: 20px;
}
.get-app-banner-button {
min-width: 180px;
font-size: 16px;
padding: 20px 10px;
}
.--arrow-button span {
font-size: 12px;
}
.footer-main-card {
height: 260px;
}
.--footer-image-section-right {
padding-left: unset;
padding-right: 10px;
}
.footer-right-card-wrapper {
gap: 14px;
padding: 16px;
}
.footer-left-card-wrapper {
padding: 16px;
gap: 19px;
}
.business-ecosystem-section-image-wrapper {
display: none;
}
.businessEcosystemSectionWrapper {
margin-left: 0px;
width: 100%;
min-width: unset;
flex-direction: column;
}
.business-ecosystem-section-image-wrapper-mobile {
width: 100%;
min-width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.business-ecosystem-section-image-wrapper-mobile img {
width: 100%;
min-width: 100%;
margin-top: 28px;
margin-left: 8px;
}
/* BUSINESS ACCOUNT */
.businessAccountFirstSectionWrapper {
flex-direction: column;
}
.business-cta-card-header {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
text-align: center;
font-size: 32px;
font-weight: 700;
line-height: 34px;
letter-spacing: -0.64px;
}
.business-cta-card-description {
color: var(--grey-50);
text-align: center;
font-feature-settings: "ss03" on, "liga" off;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
margin-bottom: 16px;
}
.business-cta-card-image-card img {
max-height: 140px;
position: relative;
margin-left: unset;
margin-top: 27px;
}
.businessAccount-first-section-image-wrapper img {
width: 100%;
min-width: 100%;
margin-right: 0;
margin-top: 32px;
}
/* SETTLE PAY WALLET */
.settle-pay-wallet-first-section-wrapper {
flex-direction: column;
padding-bottom: 50px;
}
.settle-pay-wallet-benefits-card-list {
grid-template-columns: repeat(2, 1fr);
gap: 20px;
grid-template-rows: auto;
justify-items: center;
}
}
@media screen and (max-width: 1024px) {
.header__nav-list {
display: none;
}
.--tablet-display {
display: block;
}
/* Page name | .block-class-name */
.yellow-frame2 {
padding: 4px 12px;
justify-content: center;
align-items: center;
font-size: 36px;
font-weight: 700;
line-height: 38px;
}
.home-card-section {
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
gap: 16px;
}
.home-main-card {
width: 100%;
border-radius: 20px;
background: #333;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
}
.home-main-card__left {
padding: 16px 16px 0 16px;
}
.home-main-card__left .--home-card-title {
margin-top: 16px;
}
.home-main-card__img {
min-height: auto;
height: auto;
width: 100%;
margin-top: 32px;
}
.home-main-card__img img {
width: 100%;
height: auto;
}
.home-page-get-wallet-wrapper {
margin-top: 80px;
width: 100%;
padding: 0 0 16px;
flex-direction: column-reverse;
height: 634px;
background-image: url("../images/homePage/backgroundMobileLogo.png");
background-repeat: no-repeat;
background-position: 50% 10%;
align-items: center;
gap: 0px;
}
.home-page-qr-code-section {
padding: 24px 0 32px;
gap: 14px;
height: 276px;
width: 90%;
}
.home-page-qr-code-top-section {
gap: 8px;
}
.home-page-qr-code-title {
font-size: 32px;
font-weight: 700;
line-height: 34px;
letter-spacing: -0.64px;
}
.home-page-qr-code-description {
font-size: 16px;
font-weight: 500;
line-height: 22px;
}
.home-page-qr-code-section img {
display: none;
}
.home-page-qr-buttons {
flex-direction: row;
align-items: center;
justify-content: center;
width: 100%;
padding: 0 16px;
}
.home-page-get-wallet-cards-wrapper .walletCard1 {
width: 180px;
border-radius: 10px;
margin-top: -70px;
margin-left: 10px;
}
.home-page-get-wallet-cards-wrapper .walletCard2 {
width: 180px;
border-radius: 10px;
margin-top: 30px;
margin-left: -210px;
}
.home-page-get-wallet-cards-wrapper .walletCard3 {
width: 180px;
margin-left: 220px;
margin-top: 30px;
}
/* BUSSINESS */
.tab-with-buttons .--tabs-container__menu-item {
display: flex;
height: 40px;
padding: 8px 18px;
align-items: center;
gap: 8px;
border-radius: 40px;
font-feature-settings: "ss03" on, "liga" off;
/* Button/[Mob] M */
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px; /* 100% */
}
.tab-with-buttons .--tabs-container__menu-item.-active {
height: 40px;
padding: 8px 16px;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px; /* 100% */
background: #3d3d3d;
}
.businessAccountFirstSectionTitle {
padding-top: 37px;
}
.businessFirstSectionWrapper {
flex-direction: column;
}
.title-3-start.--column.-business {
margin-top: 6px;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
}
.business-title-main {
margin-top: 6px;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
}
.business-first-section-image-wrapper {
width: 100%;
min-width: 100%;
}
.business-first-section-image-wrapper img {
width: 100%;
min-width: 100%;
margin-right: 0;
margin-top: 0;
}
.--black-section.-tab {
padding-top: 0;
margin-top: -68px;
}
.grey-business-ecosystem {
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
}
.business-ecosystem-card-wrapper {
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 20px;
}
.business-ecosystem-card-text {
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 20px;
}
.smallCardBusinessAccountBottomSection.-business {
gap: 12px;
}
.--black-section.-cta {
padding-top: 0;
margin-top: -104px;
}
.--black-section.-faq {
margin-top: -146px;
}
.scrollcards .nav-pag.-business {
margin-top: -39px;
}
.--black-section.-payment {
margin-top: -2px;
padding-top: 0;
}
/* BUSINESS ACCOUNT */
.businessAccount-first-section-image-wrapper {
width: 100%;
min-width: 100%;
}
.title-3-start {
font-feature-settings: "ss03" on, "liga" off;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px; /* 105.556% */
letter-spacing: -0.72px;
}
.yellow-frame2-margin-left {
padding: 4px 12px;
text-align: center;
font-feature-settings: "ss03" on, "liga" off;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px; /* 105.556% */
letter-spacing: -0.72px;
}
.businessAccount-blockchain-title {
gap: 15px;
}
.grey-businessAccount-account-blockchain {
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
}
.business-open-account-button {
display: flex;
height: 40px;
padding: 8px 16px;
align-items: center;
gap: 8px;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px;
}
.businessAccount-first-section-image-wrapper {
width: 100%;
min-width: 100%;
}
.businessAccount-blockchain-wrapper {
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 110px;
}
.businessAccount-blockchain-image-wrapper {
width: 100%;
min-width: 100%;
}
.businessAccount-blockchain-image-wrapper img {
width: 100%;
min-width: 100%;
margin-right: 0;
margin-top: 20px;
}
.smallCardBusinessAccountBottomSection {
gap: 16px;
padding: 16px;
}
.smallCardBusinessAccountBottomSection .title {
font-size: 20px;
font-weight: 600;
line-height: 24px;
}
.smallCardBusinessAccountBottomSection .subtitle {
font-size: 16px;
font-weight: 500;
line-height: 22px;
}
.slider-section-margin {
overflow: hidden;
margin-top: 119px;
padding: 40px 0 40px;
}
.business-cta-card-button {
height: 40px;
padding: 8px 16px;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px;
width: 100%;
}
/* EDITOR */
.editor {
gap: 16px;
}
.navigation-wrapper {
width: 240px;
min-width: 240px;
}
.left-navigation a.-active {
height: 28px;
padding: 3px 8px;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 120%;
}
.left-navigation ul li a {
padding: 5px 8px;
height: 28px;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 120%;
}
.policy-main-header {
color: var(--dark, #1b1b1b);
font-feature-settings: "ss03" on, "liga" off;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
margin-bottom: 41px;
}
.editor h5 {
color: var(--dark, #1b1b1b);
font-feature-settings: "ss03" on, "liga" off;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 20px;
}
.editor p {
color: var(--grey-60);
font-feature-settings: "ss03" on, "liga" off;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
}
.editor ol li {
color: var(--grey-60);
font-feature-settings: "ss03" on, "liga" off;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
}
.editor ul li {
color: var(--grey-60);
font-feature-settings: "ss03" on, "liga" off;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
}
.editor strong {
color: var(--dark);
font-feature-settings: "ss03" on, "liga" off;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 22px;
}
/* FAQ */
.faq-item-header {
font-size: 20px;
font-weight: 600;
line-height: 24px;
text-align: start;
}
.faq-item__content {
font-size: 16px;
font-weight: 500;
line-height: 22px;
}
.faq-item-header .--black {
font-size: 20px;
font-weight: 600;
line-height: 24px;
text-align: start;
}
.faq-item-content .--black {
font-size: 16px;
font-weight: 500;
line-height: 22px;
}
/* FOOTER */
.get-app-banner {
height: 224px;
width: 100%;
padding: 16px 16px 24px 16px;
flex-direction: column;
margin-bottom: 37px;
}
.get-app-banner-left-section {
flex-direction: column;
gap: 16px;
align-items: flex-start;
width: 100%;
}
.get-app-banner-left-section-text {
font-size: 20px;
font-weight: 600;
line-height: 24px;
}
.link-section-wrapper {
gap: 40px;
}
.get-app-banner-left-section-yellow-frame {
padding: 6px 0px;
justify-content: center;
align-items: center;
gap: 8px;
margin-top: -14px;
}
.get-app-banner-left-section-yellow-frame span {
font-size: 20px;
font-weight: 600;
line-height: 24px;
}
.get-app-banner-right-section {
width: 100%;
justify-content: center;
}
.get-app-banner-button {
display: flex;
height: 40px;
padding: 8px 16px;
justify-content: center;
align-items: center;
gap: 8px;
font-size: 12px;
font-weight: 600;
line-height: 12px;
width: 100%;
min-width: 140px;
}
.get-app-banner-button svg {
width: 16px;
height: 16px;
}
.business-cta-card {
align-self: center;
width: 100%;
padding: 24px 16px 32px 16px;
gap: 8px;
margin-top: auto;
}
.business-cta-card-image-card img {
position: relative;
max-height: 150px;
margin-left: 0px;
margin-top: 57px;
}
.business-cta {
display: flex;
flex-direction: column-reverse;
width: 100%;
border-radius: 20px;
align-items: center;
background: var(--yellow, #ffd21c);
height: 490px;
background-image: url("../images/Business/businessSmallLogo.png");
background-size: 272.653px 290px;
background-repeat: no-repeat;
background-position: 50% 8%;
width: 100%;
padding: 16px;
height: 676px;
}
.business-cta-wrapper {
padding-top: 20px;
}
.footer-main-card {
width: 100%;
border-radius: 20px;
background: #333;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
}
.footer-card-section {
display: flex;
flex-direction: column;
gap: 16px;
padding-bottom: 41px;
}
.footer-main-card {
height: auto;
gap: 0;
}
.footer-main-card__img-left {
min-height: auto;
height: auto;
width: 100%;
margin-top: 22.5px;
margin-bottom: 22.5px;
}
.footer-main-card__img-left img {
width: 100%;
height: auto;
}
.footer-main-card__img-right {
min-height: auto;
height: auto;
width: 100%;
margin-right: unset;
margin-top: 20px;
}
.footer-main-card__img-right img {
width: 100%;
height: auto;
}
/* SETTLE PAY WALLET */
.settle-pay-wallet-benefits {
padding-top: 0px;
}
.--paragraph-grey-center.--for-faq.--business {
margin-top: 16px;
}
.home-page-get-wallet-wrapper.-sattlle-pay-wallet-section {
margin-bottom: 81px;
margin-top: 59px;
}
.main-section.--wallet {
padding-top: 0;
padding-bottom: 38px;
}
.settle-pay-wallet-first-section-title {
padding-top: 17px;
}
.tab-home-page.--white {
height: 25px;
padding: 8px 12px;
justify-content: center;
align-items: center;
gap: 10px;
font-size: 13px;
font-style: normal;
font-weight: 500;
line-height: 14px;
}
.settle-pay-wallet-first-section-text {
gap: 24px;
padding-top: 0;
}
.settle-pay-wallet-first-section-button-section {
margin-top: 15px;
gap: 8px;
padding-bottom: 0px;
}
.settle-pay-wallet-first-section-button {
display: flex;
height: 40px;
padding: 8px 16px;
align-items: center;
gap: 8px;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px;
}
.settle-pay-wallet-first-section-button svg {
width: 16px;
height: 16px;
}
.settle-pay-wallet-first-section-image-wrapper {
width: 100%;
min-width: 100%;
}
.settle-pay-wallet-first-section-image-wrapper img {
width: 100%;
min-width: 100%;
margin-right: 0;
margin-top: 32px;
}
.settle-pay-wallet-exchange-section {
display: flex;
flex-direction: column;
padding-top: 20px;
gap: 16px;
}
.settle-pay-wallet-exchange-card {
padding: 16px;
gap: 5px;
}
.settle-pay-wallet-exchange-card-text h5 {
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 20px;
}
.settle-pay-wallet-exchange-section {
padding-bottom: 75px;
align-items: center;
}
.settle-pay-benefits-wrapper {
flex-direction: column;
padding: 0;
}
.settle-pay-benefits-title {
padding-right: 0;
gap: 20px;
}
.settle-pay-benefits-categories {
padding-top: 16px;
padding-bottom: 70px;
}
.settle-pay-benefits-category {
padding: 15px 16px 15px 16px;
margin-top: 0;
}
.settle-pay-benefits-category-title {
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 24px;
}
.settle-pay-benefits-category-description {
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 20px;
}
.settle-pay-wallet-benefits-title {
display: flex;
flex-direction: column;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
}
.settle-pay-wallet-benefits-card-list {
padding-top: 37px;
display: flex;
align-items: center;
flex-direction: column;
gap: 16px;
padding-bottom: 3px;
}
.settle-pay-wallet-benefits-card {
width: auto;
height: auto;
padding: 0;
gap: 0;
}
.info-settle-pay-wallet-benefits-card-container {
padding: 0 16px 16px 16px;
}
.settle-pay-wallet-page-card-description {
font-size: 16px;
font-weight: 500;
line-height: 22px;
margin-top: 8px;
}
.settle-pay-wallet-benefits-card-img-wrapper {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 16px 16px 10px 16px;
}
.main-section.--black-section.business-account-mobile {
margin-top: -83px;
}
.scrolling-cards-wrapper {
margin: 0 0 70px 0;
gap: 10px;
overflow: hidden;
}
.businessAccount-blockchain-title.-padding {
padding-left: 0;
}
.business-business-section h2 {
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
}
.--paragraph-grey-center.-business {
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
margin-bottom: 0;
margin-top: 6px;
}
.--paragraph-grey-center.-business-second {
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 22px;
margin-bottom: 0;
margin-top: 16px;
}
.scrolling-card-wrapper {
flex-direction: column-reverse;
gap: 12px;
align-items: flex-start;
}
.scrolling-card-header {
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
}
.scrolling-card-img-wrapper {
min-height: auto;
height: auto;
width: 100%;
padding-top: 31px;
}
.scrolling-card-img-wrapper img {
width: 100%;
min-width: 100%;
}
.scrollcards.-business-account {
padding-bottom: 0;
}
.scrollcards.--homePage {
margin-top: -42px;
}
.scrollcards__card-small {
gap: 0;
}
.faq-item.--accordion.-business {
width: 100%;
max-width: 100%;
}
.faq-list-img {
display: flex;
align-items: center;
justify-content: center;
}
.faq-wrapper-with-img {
flex-direction: column;
padding: 31px 0px 40px 0px;
}
}
@media screen and (max-width: 740px) {
.--tablet-display {
display: none;
}
.policy-navigate-dropdown {
display: flex;
}
.title-3,
.title-3 * {
margin-top: unset;
}
/*--*-- General --*--*/
.--first-section {
padding-top: 16px;
margin-top: -1px;
}
.container {
padding: 0 16px;
}
.container.-header.-mobile {
padding: 0 8px;
}
.container.-header {
padding: 0 16px;
}
.container.-smaller {
padding: 80px 16px;
}
.container.-smaller.-without-padding-bottom {
padding: 80px 16px 0 16px;
}
.container.-smaller.-without-padding-bottom.-small-padding {
padding: 8px 16px 0 16px;
}
.main-section-padding-top {
padding: 0;
}
.--pc-display {
display: none;
}
.--mob-display {
display: block;
}
.--home-page-section {
display: flex;
flex-direction: column;
justify-content: flex-start;
width: 100%;
margin-top: -7px;
}
.-title-padding {
padding-top: 5px;
padding-bottom: 20px;
}
.title-1 {
font-size: 36px;
font-weight: 700;
letter-spacing: -0.72px;
line-height: 38px;
}
.--paragraph-grey-center {
font-size: 16px;
font-weight: 500;
line-height: 22px;
}
/*--*-- Header --*--*/
.header-content {
width: 100%;
padding: 14px 8px;
height: 48px;
}
.main-logo img {
width: 105.308px;
height: 20px;
margin-left: -6px;
}
.header__right-block {
gap: 12px;
}
.header-gap {
display: flex;
flex-direction: column;
gap: 11px;
padding-top: 5px;
}
.header-get-wallet-button {
display: flex;
height: 32px;
padding: 8px 12px;
justify-content: center;
align-items: center;
gap: 8px;
flex-shrink: 0;
border-radius: 32px;
border: 1px solid var(--white);
background: #e8e9eb;
box-shadow: 0px 2px 12px 0px rgba(255, 255, 255, 0.3);
font-size: 12px;
}
.header-login-button {
color: var(--white);
font-size: 12px;
font-weight: 600;
line-height: 12px;
padding: 0;
}
/* FAQ */
.faq-list {
padding-bottom: 4px;
}
.--accordion__content-container {
margin-top: 0;
}
.--for-faq {
width: auto;
padding-bottom: 32px;
margin-top: 17px;
}
.faq-item {
width: 100%;
padding: 16px 16px 16px 16px;
}
/* HomePage */
.home-page-description {
font-size: 16px;
font-weight: 500;
line-height: 22px;
text-align: start;
width: auto;
padding-bottom: 31px;
}
/* HomePage Cards */
.main-section__flex {
flex-direction: column;
}
.home-page-card-list {
display: flex;
align-items: center;
flex-direction: column;
gap: 16px;
padding-top: 0;
}
.home-page-card {
width: auto;
height: auto;
padding: 0;
gap: 0;
}
.info-card-container {
padding: 16px 16px 0px 16px;
}
.home-page-card-header {
font-size: 20px;
font-weight: 600;
line-height: 24px;
}
.home-page-card-description {
font-size: 16px;
font-weight: 500;
line-height: 22px;
width: 240px;
margin-top: 8px;
}
.--card-header-limit {
width: 170px;
}
.home-page-card-button {
display: inline-flex;
height: 40px;
padding: 8px 16px;
align-items: center;
gap: 8px;
font-size: 12px;
font-weight: 600;
line-height: 12px;
margin-top: -1px;
}
.home-page-card-button svg {
width: 16px;
height: 16px;
}
.sixth-card-img img {
width: 230px;
}
.card-info-button {
display: flex;
width: 40px;
height: 40px;
padding: 0;
justify-content: center;
align-items: center;
gap: 8px;
border-radius: 6px;
border: 1px solid #dedfe0;
box-shadow: 0px 2px 12px 0px rgba(255, 255, 255, 0.3);
}
.card-info-button svg {
width: 16px;
height: 16px;
}
.title.-centered-title.title-3.-business {
display: flex;
flex-direction: column;
}
/* HomePage Get Wallet */
.home-page-get-wallet-wrapper {
margin-top: 77px;
width: 100%;
padding: 24px 16px 16px 16px;
flex-direction: column-reverse;
height: 634px;
background-image: url("../images/homePage/backgroundMobileLogo.png");
background-repeat: no-repeat;
background-position: 50% 10%;
align-items: center;
gap: 0px;
}
.home-page-qr-code-section {
padding: 24px 0 32px;
gap: 9px;
height: 276px;
width: 100%;
}
.home-page-qr-code-top-section {
gap: 8px;
}
.home-page-qr-code-title {
font-size: 32px;
font-weight: 700;
line-height: 34px;
letter-spacing: -0.64px;
}
.home-page-qr-code-description {
font-size: 16px;
font-weight: 500;
line-height: 22px;
width: 100%;
margin-bottom: 15px;
}
.home-page-qr-code-section img {
display: none;
}
.home-page-qr-buttons {
flex-direction: column;
width: 100%;
padding: 0 16px;
}
.home-page-get-wallet-cards-wrapper .walletCard1 {
width: 140px;
border-radius: 10px;
margin-top: -113px;
margin-left: 60px;
}
.home-page-get-wallet-cards-wrapper .walletCard2 {
margin-top: -16px;
margin-left: -72px;
width: 140px;
border-radius: 10px;
}
.home-page-get-wallet-cards-wrapper .walletCard3 {
margin-top: 79px;
margin-left: 76px;
width: 140px;
border-radius: 10px;
}
.home-page-qr-button {
display: flex;
width: 100%;
height: 40px;
padding: 8px 16px;
justify-content: center;
align-items: center;
gap: 8px;
font-size: 12px;
font-weight: 600;
line-height: 12px;
}
.home-page-qr-button svg {
width: 16px;
height: 16px;
}
/* HomePage First Section */
.home-card-section {
padding-top: 34px;
}
.home-left-card-wrapper {
width: auto;
padding: 16px;
gap: 16px;
}
.tab-home-page {
height: 25px;
padding: 8px 12px;
justify-content: center;
align-items: center;
gap: 10px;
font-size: 13px;
font-weight: 500;
}
.first-section2 {
display: flex;
align-items: center;
flex-direction: column;
}
.title-yellow-1 {
font-size: 36px;
font-weight: 700;
line-height: 38px;
letter-spacing: -0.72px;
}
.--home-card-title {
font-size: 32px;
font-weight: 700;
line-height: 34px;
}
.--arrow-button {
height: 40px;
padding: 8px 16px;
align-items: center;
font-size: 12px;
font-weight: 600;
margin-top: 30px;
gap: 8px;
}
.--arrow-button svg {
width: 16px;
height: 16px;
}
.--arrow-button::before {
color: var(--dark);
opacity: 1;
font-size: 12px;
}
.--image-section-right {
padding: 0 20px;
}
/* Footer */
.container.-footer {
padding: 40px 16px;
}
.footer-main-card {
width: 100%;
flex-direction: row;
}
.--arrow-button.-footer {
margin-top: 9px;
}
.social-icon {
width: 40px;
height: 40px;
}
.social-icon img {
width: 16px;
height: 16px;
}
.footer-title {
font-size: 16px;
font-weight: 600;
}
.telegram-button {
height: 40px;
font-size: 12px;
font-weight: 600;
gap: 8px;
padding: 14.286px 22.857px;
width: 196px;
}
.telegram-button img {
width: 14.286px;
height: 14.286px;
}
.link-section {
flex-direction: column;
gap: 16px;
}
.footer-mail {
font-size: 16px;
font-weight: 500;
line-height: 22px;
}
.footer-mail img {
width: 16px;
height: 16px;
}
.footer-language {
font-size: 16px;
font-weight: 500;
line-height: 22px;
margin-top: 41px;
}
.footer-language svg {
width: 16px;
height: 16px;
}
.mail-section-wrapper {
flex-direction: column;
align-items: flex-start;
}
.--footer-bottom-text {
font-size: 14px;
font-weight: 500;
}
.footer-divider {
margin-top: -17px;
}
.mail-section {
flex-direction: column;
gap: 16px;
}
.footer-bottom-section {
flex-direction: column;
gap: 16px;
align-items: flex-start;
}
.footer-policy {
gap: 16px;
}
/* POLICY */
.policy-page-wrapper {
flex-direction: column;
gap: 16px;
}
.policy-last-updated {
height: 25px;
display: flex;
padding: 8px 12px;
justify-content: center;
align-items: center;
gap: 10px;
font-size: 13px;
font-weight: 500;
line-height: 14px;
max-width: 227px;
}
/* Business Account */
.business-business-section {
gap: 8px;
}
.business-account-button-section {
margin-top: 15px;
padding-bottom: 0;
margin-right: 3px;
}
.businessAccountFirstSectionWrapper {
display: flex;
flex-direction: column;
padding-bottom: 0;
}
.title-3-start {
margin-top: 9px;
}
.yellow-frame2-margin-left {
margin-left: -4px;
margin-top: 5px;
}
.yellow-frame2-margin-left.-business {
margin-left: 0;
margin-top: 0;
margin-bottom: 15px;
}
.businessAccount-blockchain-title {
gap: 15px;
}
.business-account-button-first-section {
padding-top: 15px;
margin-left: 0px;
}
.business-cta-wrapper {
flex-direction: column;
padding: 0px;
padding-bottom: 67px;
}
/* SETTLE PAY WALLET */
.settle-pay-wallet-first-section-wrapper {
display: flex;
flex-direction: column;
}
.settle-pay-benefits-wrapper {
margin-top: -90px;
}
.settle-pay-wallet-benefits {
margin-top: -158px;
}
.home-page-get-wallet-wrapper.-sattlle-pay-wallet-section {
margin-bottom: 81px;
margin-top: -85px;
}
/* BUSINESS */
.accordion-item-with-image-img {
width: 100%;
min-width: 100%;
}
.accordion-with-image-wrapper {
display: flex;
flex-direction: column;
gap: 2px;
}
.accordion-item-with-image-img-mobile {
width: 100%;
display: none;
opacity: 0;
transition: opacity 0.4s;
}
.accordion-item-with-image-img-mobile.-active {
opacity: 1;
display: block;
transition: opacity 0.4s;
}
.businessEcosystemSectionWrapper {
margin-top: -117px;
}
.accordion-with-image-icon-wrapper {
display: flex;
width: 32px;
height: 32px;
padding: 6.4px 6.402px 6.4px 6.398px;
justify-content: center;
align-items: center;
border-radius: 80px;
}
.accordion-with-image-icon-wrapper img {
width: 19.2px;
height: 19.2px;
}
.faq-item-header.--black {
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 24px;
}
.faq-item.--accordion.-business {
padding: 16px;
}
.--accordion__content.divider {
margin-top: 10px;
}
.accordion-learn-more-btn {
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px;
gap: 16px;
}
.accordion-learn-more-btn svg {
width: 16px;
height: 16px;
}
.businessAccount-blockchain-title.--pc-display {
display: none;
}
}