.cmplz-video.cmplz-iframe-styles{background-color:transparent}.cmplz-video.cmplz-hidden{visibility:hidden !important}.cmplz-blocked-content-notice{display:none}.cmplz-placeholder-parent{height:inherit}.cmplz-optin .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optin .cmplz-wp-video .cmplz-blocked-content-notice,.cmplz-optout .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optout .cmplz-wp-video .cmplz-blocked-content-notice{display:block}.cmplz-blocked-content-container,.cmplz-wp-video{animation-name:cmplz-fadein;animation-duration:600ms;background:#FFF;border:0;border-radius:3px;box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15);display:flex;justify-content:center;align-items:center;background-repeat:no-repeat !important;background-size:cover !important;height:inherit;position:relative}.cmplz-blocked-content-container.gmw-map-cover,.cmplz-wp-video.gmw-map-cover{max-height:100%;position:absolute}.cmplz-blocked-content-container.cmplz-video-placeholder,.cmplz-wp-video.cmplz-video-placeholder{padding-bottom:initial}.cmplz-blocked-content-container iframe,.cmplz-wp-video iframe{visibility:hidden;max-height:100%;border:0 !important}.cmplz-blocked-content-container .cmplz-custom-accept-btn,.cmplz-wp-video .cmplz-custom-accept-btn{white-space:normal;text-transform:initial;cursor:pointer;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:200px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-custom-accept-btn:focus,.cmplz-wp-video .cmplz-custom-accept-btn:focus{border:1px dotted #cecece}.cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-wp-video .cmplz-blocked-content-notice{white-space:normal;text-transform:initial;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:300px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links{display:block;margin-bottom:10px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links a,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links a{color:#fff}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body{display:block}.cmplz-blocked-content-container div div{display:none}.cmplz-wp-video .cmplz-placeholder-element{width:100%;height:inherit}@keyframes cmplz-fadein{from{opacity:0}to{opacity:1}}@import url("https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap");
* {
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
}
html,
body {
height: 100%;
font-family: 'Nunito Sans', 'Playfair Display', sans-serif;
scroll-behavior: smooth;
}
body {
background-color: #F8EFE8;
}
img {
max-width: 100%;
}
.container {
max-width: 1180px;
margin: 0 auto;
padding: 0 20px;
}
.button {
font-family: 'Nunito Sans', sans-serif;
display: flex;
align-items: center;
justify-content: center;
height: 50px;
padding: 0 30px;
color: #fff;
text-decoration: none;
text-transform: uppercase;
background-color: #9F6C41;
border-radius: 5px;
transition: all .2s ease;
}
.button:active {
background-color: #7d5330;
transform: scale(0.98);
}
.button:hover {
background-color: #8a5d38;
transform: translateY(-3px);
box-shadow: 0 10px 20px rgba(159, 108, 65, 0.4);
}
.page-header {
background-color: #F8EFE8;
text-align: center;
}
.page-header__wrapper {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px;
}
.page-navigation {
display: flex;
align-items: center;
gap: 30px;
}
.page-navigation__menu,
.page-navigation__socials {
display: flex;
gap: 20px;
align-items: center;
list-style: none;
}
.page-navigation__menu>li a,
.page-navigation__socials>li a {
text-decoration: none;
color: #848484;
font-weight: 400;
font-size: 16px;
text-transform: uppercase;
transition: .2s ease;
}
.page-navigation__menu>li a:hover {
color: #9f6c41;
}
.page-navigation__socials>li a {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
background-color: #f6e6d6;
color: #9f6c41;
border-radius: 5px;
transition: .2s ease;
}
.page-navigation__socials>li a:hover {
background-color: #9f6c41;
color: #fff;
}
.hero {
background-color: #F8EFE8;
text-align: center;
}
.hero__wrapper {
min-height: 504px;
width: 100%;
background-image: url(//mb-nails-studio.pl/assets/homepage-banner.webp);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-family: 'Playfair Display', serif;
gap: 10px;
border-radius: 10px;
}
.hero__wrapper--subpage {
min-height: 300px;
}
.hero__wrapper hr {
max-width: 530px;
width: 100%;
border: 2px solid #fff;
margin: 10px 0;
}
.hero__title,
.hero__subtitle {
color: #fff;
font-weight: 500;
letter-spacing: .02em;
}
.hero__title,
.hero__subtitle,
.heading--large,
.wp-block-heading {
font-size: clamp(2rem, 1.5rem + 2.5vw, 3rem);
}
.hero__cta {
margin-top: 20px;
}
#loader-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #f6e6d6;
display: flex;
justify-content: center;
align-items: center;
z-index: 9999;
transition:
opacity 0.5s ease,
visibility 0.5s;
}
.description {
padding: 60px 0;
}
.description__wrapper {
display: flex;
align-items: center;
justify-content: space-evenly;
flex-wrap: wrap;
gap: 50px;
}
.description__content {
display: flex;
flex-direction: column;
gap: 40px;
max-width: 600px;
width: 100%;
align-items: center;
text-align: center;
}
.description__image {
border-radius: 10px;
max-width: 400px;
width: 100%;
height: auto;
}
.heading--large {
font-size: 48px;
letter-spacing: 0.02em;
font-family: 'Playfair Display';
color: #9F6C41;
font-weight: 400;
}
.basic-typography,
.page__content p,
.wp-block-list {
font-size: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
color: #848484;
line-height: 175%;
}
.wp-block-list {
padding-left: 20px;
}
.loader {
width: 50px;
height: 50px;
border: 5px solid #f8efe8;
border-top: 5px solid #9f6c41;
border-radius: 50%;
animation: spin 1s linear infinite;
}
.why-me {
padding: 60px 0;
background-color: #f6e6d6;
}
.why-me__header {
display: flex;
flex-direction: column;
gap: 20px;
max-width: 520px;
text-align: center;
}
.why-me__wrapper {
background-color: #F8EFE8;
border-radius: 10px;
display: grid;
grid-template-columns: 350px 1fr;
margin-top: 40px;
position: relative;
min-height: 570px;
padding: 50px;
justify-items: center;
}
.sidebar__content {
max-width: 300px;
display: flex;
flex-direction: column;
gap: 15px;
text-align: center;
position: relative;
z-index: 1;
}
.sidebar__title {
margin-top: 40px;
color: #9F6C41;
font-size: clamp(1.75rem, 1.4rem + 1.8vw, 2.25rem);
}
.sidebar__text {
font-size: 16px;
}
.sidebar__image {
position: absolute;
bottom: 20px;
left: 0;
z-index: 0;
}
.brand-values {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
gap: 40px;
}
.brand-values__item {
display: flex;
flex-direction: column;
width: 256px;
gap: 10px;
}
.brand-values__title {
font-size: 20px;
font-family: 'Playfair Display', sans-serif;
color: #9F6C41;
}
.brand-values__text {
font-size: 16px;
}
.services {
padding: 60px 0;
}
.services__header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 40px;
}
.services__all {
color: #9f6c41;
font-size: 18px;
text-decoration: none;
text-transform: uppercase;
}
.services__wrapper {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
}
.services__item {
text-align: center;
display: flex;
flex-direction: column;
gap: 25px;
max-width: 350px;
}
.services__item-title {
color: #9F6C41;
font-weight: 400;
}
.pricelist {
min-height: 870px;
padding: 60px 0;
background-color: #F6E6D6;
}
.pricelist__wrapper {
max-width: 620px;
}
.pricelist__title {
margin-bottom: 40px;
}
.pricelist__card {
display: flex;
flex-direction: column;
gap: 24px;
margin-bottom: 40px;
}
.pricelist__item {
display: flex;
flex-direction: column;
gap: 14px;
}
.pricelist__item-main {
display: flex;
align-items: center;
justify-content: space-between;
color: #9F6C41;
font-size: 24px;
}
.pricelist__remark {
font-size: 18px;
color: #848484;
}
.pricelist__extra-info {
margin-top: 40px;
}
.pricelist__extra-text {
text-align: center;
}
.services__item-title,
.pricelist__item-main,
.footer__wrapper-title {
font-size: clamp(1.25rem, 1.1rem + 0.8vw, 1.5rem);
}
.pricelist__cta {
max-width: fit-content;
margin: auto;
}
.footer {
padding-top: 60px;
border-top: 1px solid #E0D3C7;
background: #f6e6d6;
}
.footer__wrapper {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
padding-top: 20px;
padding-bottom: 60px;
}
.footer__wrapper-column {
align-self: self-start;
color: #848484;
}
.footer__wrapper-column>ul {
list-style: none;
display: flex;
flex-direction: column;
gap: 10px;
}
.footer__wrapper-column>ul li a,
.footer__wrapper-column>p>a {
text-decoration: none;
color: #848484;
font-size: 16px;
transition: .2s ease;
}
.footer__wrapper-column>p {
height: 40px;
display: flex;
align-items: center;
margin-bottom: 10px;
}
.footer__wrapper-column>p>i {
color: #8a5d38;
font-size: 120%;
}
.footer__wrapper-column>ul li a:hover,
.footer__wrapper-column>p>a:hover {
color: #9f6c41;
}
.footer__wrapper-title {
font-size: 24px;
color: #7d5330;
margin-bottom: 20px;
}
.footer__bottom {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px 0;
}
.footer__bottom a {
color: #333;
}
.burger-menu {
display: none;
cursor: pointer;
}
.page__content {
margin: 60px auto;
}
.page__content p,
.page__content ul,
.page__content ol,
.page__content h1,
.page__content h2,
.page__content h3,
.page__content h4,
.page__content h5,
.page__content h6 {
margin-bottom: 20px !important;
}
.error-404__content {
display: flex;
flex-direction: column;
align-items: center;
gap: 20px;
text-align: center;
min-height: 500px;
}
.error-404-main {
width: 100%;
height: 100%;
justify-content: center;
align-items: center;
display: flex;
}
@media screen and (max-width: 768px) {
.burger-menu {
display: flex;
width: 50px;
height: 50px;
font-size: 30px;
background-color: #f6e6d6;
color: #9F6C41;
border: 1px solid #E0D3C7;
border-radius: 5px;
align-items: center;
justify-content: center;
}
.page-navigation {
position: fixed;
bottom: 0;
left: 0;
background-color: #F8EFE8;
width: 100vw;
height: 40vh;
z-index: 999;
border-top-left-radius: 30px;
border-top-right-radius: 30px;
border-top: 1px solid #E0D3C7;
flex-direction: column;
padding: 40px 20px;
justify-content: center;
box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
transform: translateY(100%);
transition: transform 0.3s ease-in-out;
}
.page-navigation--show {
transform: translateY(0);
}
.footer__wrapper,
.footer__bottom {
flex-direction: column;
gap: 20px;
text-align: center;
}
.hero__wrapper {
border-radius: 20px;
background-image: url(//mb-nails-studio.pl/assets/banner-mobile.png);
}
.why-me__wrapper {
grid-template-columns: 1fr;
}
.brand-values {
justify-content: center;
margin-top: 40px;
}
.sidebar__image {
display: none;
}
.footer__wrapper-column,
.footer__wrapper-column>ul>li>a {
align-self: self-start;
color: #848484;
text-align: left;
margin-bottom: 20px;
font-size: 1.2rem;
}
section {
padding: 40px 20px !important;
}
.services__wrapper {
justify-content: center;
gap: 30px;
}
.services__all {
display: none;
}
.services__header { justify-content: center; }
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.loader-hidden {
opacity: 0;
visibility: hidden;
}
.heading--large {
font-size: clamp(2rem, 5vw, 4rem);
}