:root {
--grid-gap:               3rem;
--content-width:          126.6rem;
--content-padding:        2rem;
--post-content-gap:       1.5rem;
--header-height:          14rem;
--color-dark:             87,64,14; --color-accent:           241,180,52; --color-accent-dark:      226,158,16; --color-accent-mute:      179,125,12; --color-accent-light:     244,198,100; --color-light:            251,233,195; --content-col-width:      calc((var(--content-width) - (11* (var(--grid-gap))))/12);
--border-radius-big:      5rem;
--border-radius-small:    3rem;
--transition-main:        all .15s ease 0s;
--transition-long:        all .3s ease 0s;
} @font-face {
font-family: 'Helvetica';
src: url(//kbpfast.ru/wp-content/themes/makaroni/fonts/Helvetica/Helvetica-Light.woff2) format('woff2'),
url(//kbpfast.ru/wp-content/themes/makaroni/fonts/Helvetica/Helvetica-Light.woff) format('woff'),
url(//kbpfast.ru/wp-content/themes/makaroni/fonts/Helvetica/Helvetica-Light.ttf) format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'BIPsNormal';
src: url(//kbpfast.ru/wp-content/themes/makaroni/fonts/BIPs/BIPsNormal.woff2) format('woff2'),
url(//kbpfast.ru/wp-content/themes/makaroni/fonts/BIPs/BIPsNormal.woff) format('woff'),
url(//kbpfast.ru/wp-content/themes/makaroni/fonts/BIPs/BIPsNormal.ttf) format('truetype');
} html {
box-sizing: border-box;
-ms-overflow-style: scrollbar;
font-size: 62.5%;
line-height: 1.5;
}
*,
*:before,
*:after {
box-sizing: inherit;
}
html, body {
height: 100%;
}
body {
position: relative;
min-width: 36rem;
font-weight: 300;
font-style: normal;
font-size: 1.7rem;
line-height: 3rem;
font-family: 'Helvetica', sans-serif;
color: rgba(var(--color-dark), 1);
background: #fff;
}
main, div, section, header, footer, aside, nav, ul, ol, li {
position: relative;
}
input, textarea, button {
outline: 0 none;
}
ul, ol {
margin: 0;
padding: 0;
}
li {
position: relative;
list-style: none;
}
a {
cursor: pointer;
text-decoration: underline;
transition: var(--transition-main);
}
@media (any-hover: hover) {
a:hover {
text-decoration: none;
}
}
table {
width: 100%;
} .container {
width: min(var(--content-width), 100% - (var(--content-padding))*2);
margin-inline: auto;
}
.container_overflow_hidden {
overflow: hidden;
}
.grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
grid-gap: var(--grid-gap);
}
.col-1 {
grid-column: span 1 / auto;
}
.col-2 {
grid-column: span 2 / auto;
}
.col-3 {
grid-column: span 3 / auto;
}
.col-4 {
grid-column: span 4 / auto;
}
.col-5 {
grid-column: span 5 / auto;
}
.col-6 {
grid-column: span 6 / auto;
}
.col-7 {
grid-column: span 7 / auto;
}
.col-8 {
grid-column: span 8 / auto;
}
.col-9 {
grid-column: span 9 / auto;
}
.col-10 {
grid-column: span 10 / auto;
}
.col-11 {
grid-column: span 11 / auto;
}
.col-12 {
grid-column: span 12 / auto;
}
.offset-2 {
margin-left: calc(2*(var(--content-col-width) + var(--grid-gap)));
}
.wrapper {
display: flex;
flex-direction: column;
min-height: 100vh;
}
.body {
padding-top: var(--header-height);
padding-bottom: 9rem;
}
.top-grad,
.bottom-grad {
position: absolute;
left: 0;
width: 100%;
height: 40rem;
z-index: -1;
}
.top-grad {
top: 0;
background: linear-gradient(180deg, #FBE9C3 0%, #FFFFFF 77.75%);
opacity: 0.2;
}
.bottom-grad {
bottom: 0;
background: linear-gradient(180deg, #FBE9C3 0%, #FFFFFF 77.75%);
opacity: 0.2;
transform: matrix(1, 0, 0, -1, 0, 0);
} .btn {
display: inline-flex;
justify-content: center;
align-items: center;
padding: 1.3rem 2.2rem 1.6rem;
font: 2.1rem/1 'BIPsNormal', sans-serif;
text-align: center;
text-decoration: none;
color: rgba(var(--color-dark), 1);
border-width: 0.3rem;
border-style: solid;
border-radius: 5rem;
}
.btn_fill {
background: rgba(var(--color-accent-light), 1);
border-color: transparent;
}
.btn_empty {
border-color: rgba(var(--color-accent-light), 1);
}
@media (any-hover: hover) {
.btn:hover {
transform: scale(1.08);
}
} .post-content {
letter-spacing: 0.02em;
}
.post-content p {
margin: 0;
}
.post-content p:not(:last-child) {
margin-bottom: var(--post-content-gap);
}
.post-content h2,
.post-content h3,
.post-content h4,
.post-content h5,
.post-content h6 {
margin: 0;
font-weight: 700;
font-family: 'Montserrat', sans-serif;
}
.post-content h2:not(:last-child),
.post-content h3:not(:last-child),
.post-content h4:not(:last-child),
.post-content h5:not(:last-child),
.post-content h6:not(:last-child) {
margin-bottom: var(--post-content-gap);
}
.post-content h2 {
font-size: 2.5rem;
line-height: 1.32;
}
.post-content h3 {
font-size: 2.3rem;
line-height: 1.32;
}
.post-content h4 {
font-size: 2rem;
line-height: 1.4;
}
.post-content h5 {
font-size: 1.8rem;
line-height: 1.5;
}
.post-content h6 {
font-size: 1.6rem;
line-height: 1.5;
}
.post-content a {
color: rgba(var(--color-dark), 1);
text-decoration: underline;
}
.post-content table {
border-collapse: collapse;
}
.post-content table:not(:last-child) {
margin-bottom: var(--post-content-gap);
}
.post-content table th:nth-child(1),
.post-content table td:nth-child(1) {
width: 50% !important;
text-align: left;
}
.post-content table th:nth-child(2),
.post-content table th:nth-child(3),
.post-content table td:nth-child(2),
.post-content table td:nth-child(3) {
width: 25% !important;
text-align: right;
}
.post-content table th,
.post-content table td {
padding: 1rem 0;
}
.post-content table th {
border-bottom: 0.2rem solid rgba(var(--color-dark), 0.2);
}
.post-content table tr:not(:last-child) td {
border-bottom: 0.1rem solid rgba(var(--color-dark), 0.1);
}
@media (any-hover: hover) {
.post-content a:hover {
color: rgba(var(--color-dark), 1);
text-decoration: none;
}
}
.big-text {
font-size: 2.4rem;
line-height: 1.5;
text-align: center;
letter-spacing: 0.02em;
}
.big-text:not(:last-child) {
margin-bottom: 4rem;
}
.btn-wrp {
display: flex;
justify-content: center;
} .hidden-fields-container {
display: none !important;
}
.form-fields {
display: flex;
flex-direction: column;
gap: 2rem;
}
.text-field,
.textarea-field {
display: block;
width: 100%;
font-size: 2rem;
line-height: 1;
letter-spacing: 0.02em;
color: rgba(var(--color-dark), 1);
border: 0.2rem solid rgba(var(--color-accent-light), 1);
background: #fff;
box-shadow: 0 0 3rem 0 rgba(var(--color-dark), 0.05);
border-radius: 4rem;
transition: var(--transition-main);
}
.text-field {
height: 7rem;
padding: 2.4rem 2.8rem 2.6rem;
}
.textarea-field {
height: 20rem;
padding: 2.2rem 2.8rem;
resize: none;
}
.text-field:focus,
.textarea-field:focus {
border-color: rgba(var(--color-accent-dark), 1);
box-shadow: none;
}
.submit-wrp {
display: flex;
justify-content: center;
}
.submit-field {
transition: var(--transition-main);
cursor: pointer;
}
.accept-field {
font-size: 1.5rem;
line-height: 1.8;
text-align: center;
letter-spacing: 0.02em;
}
.accept-field a {
color: rgba(var(--color-dark), 1);
text-decoration: underline;
}
@media (any-hover: hover) {
.accept-field a:hover {
color: rgba(var(--color-dark), 1);
text-decoration: none;
}
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: rgba(var(--color-dark), 0.5);
opacity: 1;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
color: rgba(var(--color-dark), 0.5);
opacity: 1;
}
input:-moz-placeholder,
textarea:-moz-placeholder {
color: rgba(var(--color-dark), 0.5);
opacity: 1;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
color: rgba(var(--color-dark), 0.5);
opacity: 1;
}
.error-field {
border-color: red !important;
}
.hide-block {
display: none !important;
}
.hidden-fields-container,
.wpcf7-response-output,
.screen-reader-response,
.wpcf7-not-valid-tip {
display: none !important;
}
.wpcf7-spinner {
position: absolute;
top: calc(50% - 1.2rem);
right: calc(50% - 17.5rem);
width: 2.4rem;
height: 2.4rem;
visibility: hidden;
}
.wpcf7-spinner:after {
position: absolute;
top: 0;
left: 0;
width: 2.4rem;
height: 2.4rem;
content: '';
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48cGF0aCBkPSdNMTIgNC44QzEzLjMyNTUgNC44IDE0LjQgMy43MjU0OCAxNC40IDIuNEMxNC40IDEuMDc0NTIgMTMuMzI1NSAwIDEyIDBDMTAuNjc0NSAwIDkuNiAxLjA3NDUyIDkuNiAyLjRDOS42IDMuNzI1NDggMTAuNjc0NSA0LjggMTIgNC44WicgZmlsbD0nI0UyOUUxMCcvPjxwYXRoIGQ9J002LjkwOTM3IDMuNTE1NjJDNy44NDY4NyA0LjQ1MzEyIDcuODQ2ODcgNS45NzE4NyA2LjkwOTM3IDYuOTA5MzdDNS45NzE4NyA3Ljg0Njg3IDQuNDUzMTIgNy44NDY4NyAzLjUxNTYyIDYuOTA5MzdDMi41NzgxMiA1Ljk3MTg3IDIuNTc4MTIgNC40NTMxMiAzLjUxNTYyIDMuNTE1NjJDNC40NTMxMiAyLjU3ODEyIDUuOTcxODcgMi41NzgxMiA2LjkwOTM3IDMuNTE1NjJaTTIuNCA5LjZDMy43MjY1NiA5LjYgNC44IDEwLjY3MzQgNC44IDEyQzQuOCAxMy4zMjY2IDMuNzI2NTYgMTQuNCAyLjQgMTQuNEMxLjA3MzQ0IDE0LjQgMCAxMy4zMjY2IDAgMTJDMCAxMC42NzM0IDEuMDczNDQgOS42IDIuNCA5LjZaTTMuNTE1NjIgMTcuMDkwNkM0LjQ1MzEyIDE2LjE1MzEgNS45NzE4NyAxNi4xNTMxIDYuOTA5MzcgMTcuMDkwNkM3Ljg0Njg3IDE4LjAyODEgNy44NDY4NyAxOS41NDY5IDYuOTA5MzcgMjAuNDg0NEM1Ljk3MTg3IDIxLjQyMTkgNC40NTMxMiAyMS40MjE5IDMuNTE1NjIgMjAuNDg0NEMyLjU3ODEyIDE5LjU0NjkgMi41NzgxMiAxOC4wMjgxIDMuNTE1NjIgMTcuMDkwNlpNOS42IDIxLjZDOS42IDIwLjI3MzQgMTAuNjczNCAxOS4yIDEyIDE5LjJDMTMuMzI2NiAxOS4yIDE0LjQgMjAuMjczNCAxNC40IDIxLjZDMTQuNCAyMi45MjY2IDEzLjMyNjYgMjQgMTIgMjRDMTAuNjczNCAyNCA5LjYgMjIuOTI2NiA5LjYgMjEuNlpNMTcuMDkwNiAyMC40ODQ0QzE2LjE1MzEgMTkuNTQ2OSAxNi4xNTMxIDE4LjAyODEgMTcuMDkwNiAxNy4wOTA2QzE4LjAyODEgMTYuMTUzMSAxOS41NDY5IDE2LjE1MzEgMjAuNDg0NCAxNy4wOTA2QzIxLjQyMTkgMTguMDI4MSAyMS40MjE5IDE5LjU0NjkgMjAuNDg0NCAyMC40ODQ0QzE5LjU0NjkgMjEuNDIxOSAxOC4wMjgxIDIxLjQyMTkgMTcuMDkwNiAyMC40ODQ0Wk0yMS42IDE0LjRDMjAuMjczNCAxNC40IDE5LjIgMTMuMzI2NiAxOS4yIDEyQzE5LjIgMTAuNjczNCAyMC4yNzM0IDkuNiAyMS42IDkuNkMyMi45MjY2IDkuNiAyNCAxMC42NzM0IDI0IDEyQzI0IDEzLjMyNjYgMjIuOTI2NiAxNC40IDIxLjYgMTQuNFpNMjAuNDg0NCA2LjkwOTM3QzE5LjU0NjkgNy44NDY4NyAxOC4wMjgxIDcuODQ2ODcgMTcuMDkwNiA2LjkwOTM3QzE2LjE1MzEgNS45NzE4NyAxNi4xNTMxIDQuNDUzMTIgMTcuMDkwNiAzLjUxNTYyQzE4LjAyODEgMi41NzgxMiAxOS41NDY5IDIuNTc4MTIgMjAuNDg0NCAzLjUxNTYyQzIxLjQyMTkgNC40NTMxMiAyMS40MjE5IDUuOTcxODcgMjAuNDg0NCA2LjkwOTM3WicgZmlsbD0nI0UyOUUxMCcvPjwvc3ZnPgo=") no-repeat center / 2.4rem 2.4rem;
animation: spinZ linear 1s infinite forwards;
}
.wpcf7 .submitting .wpcf7-spinner {
visibility: visible;
}
@keyframes spinZ {
from {
-webkit-transform: rotateZ(0deg);
transform: rotateZ(0deg);
}
to {
-webkit-transform: rotateZ(360deg);
transform: rotateZ(360deg);
}
}
@-webkit-keyframes spinZ {
from {
-webkit-transform: rotateZ(0deg);
transform: rotateZ(0deg);
}
to {
-webkit-transform: rotateZ(360deg);
transform: rotateZ(360deg);
}
}
.form-note {
padding: 3rem;
font-size: 2.4rem;
line-height: 1.5;
text-align: center;
background: rgba(var(--color-light), 1);
border-radius: var(--border-radius-big);
} .fancybox-bg {
background: rgba(0,0,0,.8);
}
.fancybox-navigation {
position: static;
} .swiper-wrapper {
box-sizing: border-box;
}
.swiper {
border-radius: var(--border-radius-big);
overflow: hidden;
}
.swiper img {
display: block;
width: 100%;
height: auto;
}
.swiper-nav {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.swiper-nav__btn-wrp {
position: absolute;
top: calc(50% - 4rem);
width: 8rem;
height: 8rem;
padding: 1rem;
background: #fff;
border-radius: 50%;
overflow: hidden;
z-index: 1;
}
.swiper-nav__btn-wrp-prev {
left: -4rem;
}
.swiper-nav__btn-wrp-next {
right: -4rem;
}
.swiper-nav__btn {
display: flex;
justify-content: center;
align-items: center;
width: 6rem;
height: 6rem;
border-radius: 50%;
background: rgba(var(--color-light), 1);
transition: var(--transition-main);
cursor: pointer;
}
.swiper-button-disabled {
cursor: not-allowed;
}
.swiper-nav__btn-icon {
width: 2.4rem;
height: 1.4rem;
fill: rgba(var(--color-dark), 1);
transform: translateX(-0.1rem) rotate(-90deg);
transition: var(--transition-main);
}
.swiper-button-disabled .swiper-nav__btn-icon {
opacity: .25;
}
.swiper-nav__btn-icon_reverse {
transform: scaleX(-1) translateX(-0.1rem) rotate(-90deg);
}
@media (any-hover: hover) {
.swiper-nav__btn:not(.swiper-button-disabled):hover {
transform: scale(1.1);
}
} .logo {
display: block;
width: 20rem;
aspect-ratio: 200 / 92;
transition: var(--transition-long);
} .social {
display: flex;
align-items: center;
gap: 2rem;
}
.social__link {
display: block;
line-height: 0;
}
.social__icon {
width: 3.2rem;
height: 3.2rem;
fill: rgba(var(--color-accent), 1);
transition: var(--transition-main);
}
@media (any-hover: hover) {
.social__link:hover .social__icon {
transform: scale(1.15);
}
} .header {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1001;
background: transparent;
transition: var(--transition-long);
}
.header_active {
background: #fff;
box-shadow: 0 1rem 5rem 0 rgba(var(--color-dark), 0.05);
}
.header_open {
height: 100%;
overflow: scroll; background: #fff;
}
.header__inner {
height: var(--header-height);
display: flex;
justify-content: space-between;
align-items: center;
transition: var(--transition-long);
}
.header_active .header__inner {
height: 10rem;
}
.header_active .logo {
width: 16rem;
}
.header__logo {
width: 20rem;
}
.header__social {
width: 20rem;
display: flex;
justify-content: flex-end;
}
.header__menu {
display: flex;
gap: 4rem;
align-items: center;
}
.header__menu .menu-item a {
position: relative;
color: var(--color-dark);
text-decoration: none;
z-index: 1;
}
.header__menu .menu-item a:after {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 0;
content: '';
background: rgba(var(--color-light), 1);
z-index: -1;
transition: var(--transition-main);
}
.header__menu .current-menu-item a:after {
height: 0.8rem;
}
@media (any-hover: hover) {
.header__menu .menu-item a:hover:after {
height: 0.8rem;
}
} .main-slider:not(:last-child) {
margin-bottom: 9rem;
}
.ms-slider__img {
aspect-ratio: 1266 / 500;
}
.section:not(:last-child) {
margin-bottom: 9rem;
}
.section__head {
text-align: center;
letter-spacing: -0.02em;
margin-bottom: 7.5rem;
}
.section-suptitle {
font: normal 400 3rem/1 'Montserrat', sans-serif;
color: rgba(var(--color-accent-dark), 1);
}
.section-suptitle:not(:last-child) {
margin-bottom: 1rem;
}
.section-title {
position: relative;
margin: 0;
font: normal 800 5rem/1.2 'Montserrat', sans-serif;
color: #000;
}
.section-title:after {
position: absolute;
bottom: -2.5rem;
left: calc(50% - 6.6rem);
width: 13.2rem;
height: 1rem;
content: '';
background: url(//kbpfast.ru/wp-content/themes/makaroni/img/line.png) no-repeat center / 13.2rem 1rem;
}
.mp-about__content {
text-align: center;
}
.mp-about__btn-wrp {
display: flex;
justify-content: center;
margin-top: 4rem;
}
.place-grid {
display: flex;
flex-wrap: wrap;
gap: var(--grid-gap);
}
.place-grid__item {
display: flex;
flex-direction: column;
width: calc((100% - 3* var(--grid-gap))/4);
border-radius: var(--border-radius-small);
overflow: hidden;
box-shadow: 0 0.4rem 4rem 0 rgba(var(--color-dark), 0.05);
}
.place-item__preview {
width: 100%;
aspect-ratio: 294 / 220;
}
.place-item__info {
height: 100%;
padding: 2.5rem 3rem;
background: rgba(var(--color-light), 1);
}
.place-item__title {
margin: 0 0 1rem;
font: normal 700 2.5rem/1.32 'Montserrat', sans-serif;
color: rgba(var(--color-dark), 1);
}
.place-item__descr {
letter-spacing: 0.02em;
}
.place-item__descr-icon {
width: 1.2rem;
height: 1.4rem;
margin-right: 0.2rem;
fill: rgba(var(--color-accent), 1);
}
.mp-news__inner {
--mp-news-inner-padding: 6.7rem;
width: calc(100% + 2* var(--mp-news-inner-padding));
left: calc(-1* var(--mp-news-inner-padding));
padding: var(--mp-news-inner-padding);
background: rgba(var(--color-light));
border-radius: var(--border-radius-big);
overflow: hidden;
z-index: 1;
}
.mp-news__inner:after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: '';
background: url(//kbpfast.ru/wp-content/themes/makaroni/img/pattern.jpg) repeat top left / 79.4rem 59.4rem;
opacity: 0.05;
z-index: -1;
}
.news-grid {
display: flex;
flex-wrap: wrap;
gap: var(--grid-gap);
}
.news-grid__item {
display: flex;
flex-direction: column;
width: calc((100% - 2* var(--grid-gap))/3);
border-radius: var(--border-radius-big);
overflow: hidden;
box-shadow: 0 0.4rem 4rem 0 rgba(var(--color-dark), 0.05);
}
.news-item__preview-link {
position: relative;
display: block;
}
.news-item__preview-link:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: '';
background: #000;
opacity: 0;
transition: var(--transition-long);
z-index: 1;
}
.news-item__preview-link:after {
position: absolute;
top: calc(50% - 1.6rem);
left: calc(50% - 1.6rem);
width: 3.2rem;
height: 3.2rem;
content: '';
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMzInIGhlaWdodD0nMzInIHZpZXdCb3g9JzAgMCAzMiAzMicgZmlsbD0nbm9uZScgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48cGF0aCBkPSdNMTguMDA1MSAyNy45OTk5QzEwLjI3NTkgMjcuOTk5OSA0LjAxMDE1IDIxLjczMiA0LjAxMDE1IDEzLjk5OTlDNC4wMTAxNSA2LjI2NzkxIDEwLjI3NTkgMCAxOC4wMDUxIDBDMjUuNzM0MyAwIDMyIDYuMjY3OTggMzIgMTRDMzIgMjEuNzMyIDI1LjczNDIgMjcuOTk5OSAxOC4wMDUxIDI3Ljk5OTlaTTE4LjAwNTEgNC4wMDAwMkMxMi40ODQyIDQuMDAwMDIgOC4wMDg3MiA4LjQ3NzE0IDguMDA4NzIgMTRDOC4wMDg3MiAxOS41MjI5IDEyLjQ4NDIgMjQgMTguMDA1MSAyNEMyMy41MjU5IDI0IDI4LjAwMTQgMTkuNTIyOSAyOC4wMDE0IDE0QzI4LjAwMTQgOC40NzcxNCAyMy41MjU5IDQuMDAwMDIgMTguMDA1MSA0LjAwMDAyWicgZmlsbD0nI0ZCRTlDMycvPjxwYXRoIGQ9J00yLjAxMDg3IDMyQzEuNzQ3NzUgMzIuMDAxNSAxLjQ4NjkyIDMxLjk1MSAxLjI0MzMzIDMxLjg1MTVDMC45OTk3NDUgMzEuNzUyIDAuNzc4MTk3IDMxLjYwNTMgMC41OTEzOTQgMzEuNDE5OUMtMC4xOTI1OTUgMzAuNjQyMSAtMC4xOTc3NjMgMjkuMzc1OCAwLjU3OTgxNyAyOC41OTE1TDguMTA4NjQgMjEuMDZDOC45MjAyIDIwLjI3NTcgMTAuMjEzNiAyMC4yOTgxIDEwLjk5NzYgMjEuMTFDMTEuNzgxNiAyMS45MjE4IDExLjc1OTIgMjMuMjE1NyAxMC45NDc3IDI0TDMuNDMwMzUgMzEuNDE5OUMzLjI0MzU0IDMxLjYwNTMgMy4wMjE5OSAzMS43NTIgMi43Nzg0MSAzMS44NTE1QzIuNTM0ODIgMzEuOTUxIDIuMjczOTkgMzIuMDAxNSAyLjAxMDg3IDMyWicgZmlsbD0nI0ZCRTlDMycvPjwvc3ZnPgo=") no-repeat center / 3.2rem 3.2rem;
opacity: 0;
transform: translateY(-3rem);
transition: var(--transition-long);
z-index: 2;
}
.news-item__preview-img {
display: block;
width: 100%;
aspect-ratio: 402 / 220;
border-radius: var(--border-radius-big) var(--border-radius-big) 0 0;
}
@media (any-hover: hover) {
.news-item__preview-link:hover:before {
opacity: 0.5;
}
.news-item__preview-link:hover:after {
opacity: 1;
transform: translateY(0);
}
}
.news-item__descr {
height: 100%;
padding: 3rem;
background: #fff;
}
.news-item__date {
margin-bottom: 1rem;
font: normal 700 1.6rem/1 'Montserrat', sans-serif;
color: rgba(var(--color-accent-light), 1);
}
.news-item__title {
margin: 0 0 1.5rem;
height: 6.6rem;
font: normal 700 2.5rem/1.32 'Montserrat', sans-serif;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
text-overflow: ellipsis;
overflow: hidden;
}
.news-item__title-link {
color: rgba(var(--color-dark), 1);
text-decoration: none;
}
@media (any-hover: hover) {
.news-item__title-link:hover {
color: rgba(var(--color-accent-mute), 1);
text-decoration: none;
}
}
.news-item__excerpt {
margin: 0 0 1.5rem;
letter-spacing: 0.02em;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
text-overflow: ellipsis;
overflow: hidden;
}
.mp-news__btn-wrp {
display: flex;
justify-content: center;
margin-top: 4rem;
}
.mp-vacancy__descr {
font-size: 2.4rem;
line-height: 1.5;
text-align: center;
letter-spacing: 0.02em;
}
.mp-vacancy__btn-wrp {
display: flex;
justify-content: center;
margin-top: 4rem;
} .footer {
margin-top: auto;
padding-bottom: 6rem;
}
.footer__inner {
font-size: 1.5rem;
line-height: 1.8;
text-align: center;
}
.footer__inner p {
margin: 0;
}
.footer__inner p+p {
margin-top: 1rem;
}
.footer__inner a {
color: rgba(var(--color-dark), 1);
text-decoration: underline;
}
@media (any-hover: hover) {
.footer__inner a:hover {
color: rgba(var(--color-dark), 1);
text-decoration: none;
}
} .to-top {
position: fixed;
right: 6rem;
bottom: 6rem;
display: flex;
justify-content: center;
align-items: center;
width: 6rem;
height: 6rem;
border-radius: 50%;
background: rgba(var(--color-light), 1);
transition: var(--transition-main);
cursor: pointer;
opacity: 0;
z-index: 1000;
}
.to-top__icon {
width: 2.4rem;
height: 1.4rem;
fill: rgba(var(--color-dark), 1);
transition: var(--transition-main);
}
@media (any-hover: hover) {
.to-top:hover {
transform: scale(1.1);
}
}
.to-top_active {
opacity: 1;
} .breadcrumbs {
margin-bottom: 2rem;
font-size: 1.2rem;
line-height: 1.75;
text-align: center;
text-transform: uppercase;
}
.breadcrumbs a {
color: rgba(var(--color-accent-dark), 1);
text-decoration: none;
}
@media (any-hover: hover) {
.breadcrumbs a:hover {
color: rgba(var(--color-dark), 1);
text-decoration: none;
}
}
.breadcrumbs__sep {
display: inline-block;
margin-left: 0.3rem;
}
.main-title {
position: relative;
margin: 0 0 7.5rem;
font: normal 800 5rem/1.2 'Montserrat', sans-serif;
text-align: center;
letter-spacing: -0.02em;
color: #000;
}
.main-title:after {
position: absolute;
bottom: -2.5rem;
left: calc(50% - 6.6rem);
width: 13.2rem;
height: 1rem;
content: '';
background: url(//kbpfast.ru/wp-content/themes/makaroni/img/line.png) no-repeat center / 13.2rem 1rem;
}
.menu-filter {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 1.5rem;
margin-bottom: 4rem;
}
.menu-filter__item-btn {
display: block;
padding: 1.5rem 2rem 1.7rem;
font: 1.6rem/1 'BIPsNormal', sans-serif;
text-align: center;
text-decoration: none;
color: rgba(var(--color-dark), 1);
border-radius: 5rem;
background: rgba(var(--color-light), 1);
border-color: transparent;
}
@media (any-hover: hover) {
.menu-filter__item-btn:hover {
transform: scale(1.08);
}
}
.menu-filter__item-btn.active {
background: rgba(var(--color-accent-light), 1);
}
.menu-grid {
display: flex;
flex-wrap: wrap;
gap: var(--grid-gap);
}
.menu-grid__item {
display: flex;
flex-direction: column;
width: calc((100% - 3* var(--grid-gap))/4);
background: #fff;
border-radius: var(--border-radius-small);
box-shadow: 0 0.4rem 4rem 0 rgba(var(--color-dark), 0.05);
overflow: hidden;
text-decoration: none;
transition: var(--transition-long);
}
.menu-item__preview {
padding: 1rem 1rem 0;
}
.menu-item__preview-img {
display: block;
width: 100%;
aspect-ratio: 294 / 250;
border-radius: 2rem 2rem 0 0;
}
.menu-item__info {
padding: 2.5rem 2.5rem 3rem;
}
.menu-item__title {
margin: 0;
font: normal 700 2.2rem/1.27 'Montserrat', sans-serif;
text-align: center;
color: rgba(var(--color-dark), 1);
}
@media (any-hover: hover) {
.menu-grid__item:hover {
transform: translateY(-1rem);
box-shadow: 0 1rem 5rem 0 rgba(var(--color-dark), 0.15);	
}
.menu-grid__item:hover .menu-item__title {
text-decoration: none;
}
}
.dish-slider__slide {
position: relative;
display: block;
}
.dish-slider__slide:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: '';
background: #000;
opacity: 0;
transition: var(--transition-long);
z-index: 1;
}
.dish-slider__slide:after {
position: absolute;
top: calc(50% - 1.6rem);
left: calc(50% - 1.6rem);
width: 3.2rem;
height: 3.2rem;
content: '';
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMzInIGhlaWdodD0nMzInIHZpZXdCb3g9JzAgMCAzMiAzMicgZmlsbD0nbm9uZScgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48cGF0aCBkPSdNMTguMDA1MSAyNy45OTk5QzEwLjI3NTkgMjcuOTk5OSA0LjAxMDE1IDIxLjczMiA0LjAxMDE1IDEzLjk5OTlDNC4wMTAxNSA2LjI2NzkxIDEwLjI3NTkgMCAxOC4wMDUxIDBDMjUuNzM0MyAwIDMyIDYuMjY3OTggMzIgMTRDMzIgMjEuNzMyIDI1LjczNDIgMjcuOTk5OSAxOC4wMDUxIDI3Ljk5OTlaTTE4LjAwNTEgNC4wMDAwMkMxMi40ODQyIDQuMDAwMDIgOC4wMDg3MiA4LjQ3NzE0IDguMDA4NzIgMTRDOC4wMDg3MiAxOS41MjI5IDEyLjQ4NDIgMjQgMTguMDA1MSAyNEMyMy41MjU5IDI0IDI4LjAwMTQgMTkuNTIyOSAyOC4wMDE0IDE0QzI4LjAwMTQgOC40NzcxNCAyMy41MjU5IDQuMDAwMDIgMTguMDA1MSA0LjAwMDAyWicgZmlsbD0nI0ZCRTlDMycvPjxwYXRoIGQ9J00yLjAxMDg3IDMyQzEuNzQ3NzUgMzIuMDAxNSAxLjQ4NjkyIDMxLjk1MSAxLjI0MzMzIDMxLjg1MTVDMC45OTk3NDUgMzEuNzUyIDAuNzc4MTk3IDMxLjYwNTMgMC41OTEzOTQgMzEuNDE5OUMtMC4xOTI1OTUgMzAuNjQyMSAtMC4xOTc3NjMgMjkuMzc1OCAwLjU3OTgxNyAyOC41OTE1TDguMTA4NjQgMjEuMDZDOC45MjAyIDIwLjI3NTcgMTAuMjEzNiAyMC4yOTgxIDEwLjk5NzYgMjEuMTFDMTEuNzgxNiAyMS45MjE4IDExLjc1OTIgMjMuMjE1NyAxMC45NDc3IDI0TDMuNDMwMzUgMzEuNDE5OUMzLjI0MzU0IDMxLjYwNTMgMy4wMjE5OSAzMS43NTIgMi43Nzg0MSAzMS44NTE1QzIuNTM0ODIgMzEuOTUxIDIuMjczOTkgMzIuMDAxNSAyLjAxMDg3IDMyWicgZmlsbD0nI0ZCRTlDMycvPjwvc3ZnPgo=") no-repeat center / 3.2rem 3.2rem;
opacity: 0;
transform: translateY(-3rem);
transition: var(--transition-long);
z-index: 2;
}
.dish-slider__img,
.dish-preview {
display: block;
width: 100%;
aspect-ratio: 1 / 1;
}
.dish-preview {
border-radius: var(--border-radius-big);
}
@media (any-hover: hover) {
.dish-slider__slide:hover:before {
opacity: 0.5;
}
.dish-slider__slide:hover:after {
opacity: 1;
transform: translateY(0);
}
}
.dish-info {
padding-top: 1rem;
padding-left: 5rem;
}
.pages {
display: flex;
flex-wrap: wrap;
gap: 1rem;
justify-content: center;
margin-top: 4rem;
}
.pages a,
.pages__current {
min-width: 4.8rem;
height: 4.8rem;
padding: 0 1rem;
font: normal 400 1.6rem/4.8rem 'BIPsNormal', sans-serif;
color: rgba(var(--color-dark), 1);
text-align: center;
border-radius: 50%;
}
.pages__current {
background: rgba(var(--color-accent-light), 1);
}
.pages a {
position: relative;
color: rgba(var(--color-dark), 1);
text-decoration: none;
background: rgba(var(--color-light), 1);
}
@media (any-hover: hover) {
.pages a:hover {
color: rgba(var(--color-dark), 1);
text-decoration: none;
transform: scale(1.1);
}
}
.pages__prev,
.pages__next {
width: 4.8rem;
font-size: 0 !important;
}
.pages__prev:after,
.pages__next:after {
position: absolute;
top: calc(50% - .8rem);
width: 1rem;
height: 1.6rem;
content: '';
background: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMTInIGhlaWdodD0nMjAnIHZpZXdCb3g9JzAgMCAxMiAyMCcgZmlsbD0nbm9uZScgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48cGF0aCBkPSdNMTEuMzc4NCA4LjQ3Njc5TDMuNjM1OTIgMC42MzI5MTFDMi44MDI5NSAtMC4yMTA5NyAxLjQ1NzcgLTAuMjEwOTcgMC42MjQ3MjkgMC42MzI5MTFDLTAuMjA4MjQzIDEuNDc2NzkgLTAuMjA4MjQzIDIuODM5NjYgMC42MjQ3MjkgMy42ODM1NEw2Ljg2MzY5IDEwTDAuNjI0NzI5IDE2LjMxNjVDLTAuMjA4MjQzIDE3LjE2MDMgLTAuMjA4MjQzIDE4LjUyMzIgMC42MjQ3MjkgMTkuMzY3MUMxLjQ1NzcgMjAuMjExIDIuODAyOTUgMjAuMjExIDMuNjM1OTIgMTkuMzY3MUwxMS4zNzg0IDExLjUyMzJDMTIuMjA3MiAxMC42ODM1IDEyLjIwNzIgOS4zMTY0NiAxMS4zNzg0IDguNDc2NzlaJyBmaWxsPScjNTc0MDBFJy8+PC9zdmc+Cg==") no-repeat center / 1rem 1.6rem;
}
.pages__prev:after {
left: calc(50% - .6rem);
transform: scale(-1);
}
.pages__next:after {
left: calc(50% - .4rem);
}
.post-preview {
display: block;
width: 100%;
margin-bottom: 4rem;
aspect-ratio: 834 / 510;
border-radius: var(--border-radius-big);
}
.post-date {
margin-bottom: 2rem;
font: normal 700 1.6rem/1 'Montserrat', sans-serif;
color: rgba(var(--color-accent-light), 1);
} .burger {
position: absolute;
top: calc(50% - 1rem);
right: 0;
width: 2.4rem;
height: 2rem;
display: none;
}
.burger__icon {
width: 2.4rem;
height: 2rem;
fill: rgba(var(--color-dark), 1);
}
.mobile-box {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #fefbf4;
display: flex;
justify-content: center;
align-items: center;
transform: scale(0);
opacity: 0;
transition: var(--transition-long);
z-index: 1001;
padding: var(--content-padding);
}
.mobile-box_open {
transform: scale(1);
opacity: 1;
}
.mobile-box__close {
position: absolute;
top: 2rem;
right: 2rem;
width: 2rem;
height: 2rem;
border: 0;
padding: 0;
background: none;
}
.mobile-box__close-icon {
width: 2rem;
height: 2rem;
fill: rgba(var(--color-dark), 1);
}
.mobile-menu {
display: inline-flex;
flex-direction: column;
align-items: center;
gap: 2rem;
}
.mobile-menu .menu-item a {
position: relative;
font-size: 2.2rem;
line-height: 1.5;
color: rgba(var(--color-dark), 1);
text-decoration: none;
z-index: 1;
}
.mobile-menu .menu-item a:after {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 0;
content: '';
background: rgba(var(--color-light), 1);
z-index: -1;
transition: var(--transition-main);
}
.mobile-menu .current-menu-item a:after {
height: 0.8rem;
} @media (max-width: 1419px) {
.mp-news {
--mp-news-padding: 6.7rem;
padding: var(--mp-news-padding) 0;
background: rgba(var(--color-light));
overflow: hidden;
z-index: 1;
}
.mp-news:after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
content: '';
background: url(//kbpfast.ru/wp-content/themes/makaroni/img/pattern.jpg) repeat top left / 79.4rem 59.4rem;
opacity: 0.05;
z-index: -1;
}
.mp-news__inner {
width: auto;
left: 0;
padding: 0;
background: none;
border-radius: 0;
}
.mp-news__inner:after {
display: none;
}
}
@media (max-width: 1359px) {
.swiper-nav {
top: auto;
bottom: -4rem;
left: calc(50% - 8.5rem);
width: 17rem;
height: 8rem;
}
.swiper-nav__btn-wrp-prev {
left: 0;
}
.swiper-nav__btn-wrp-next {
right: 0;
}
.dish-info {
padding-left: 2rem;
}
}
@media (max-width: 1299px) {
.logo {
width: 18rem;
}
.header__menu {
gap: 3rem;
}
}
@media (max-width: 1199px) {
:root {
--header-height: 12rem;
}
.header__nav {
display: none;
}
.burger {
display: block;
}
.header__inner {
padding-right: 5rem;
}
.main-slider:not(:last-child),
.section:not(:last-child) {
margin-bottom: 7rem;
}
.body {
padding-bottom: 7rem;
}
.footer {
padding-bottom: 4rem;
}
.section-title,
.main-title {
font-size: 4.5rem;
}
}
@media (max-width: 991px) {
:root {
--grid-gap: 2rem;
--header-height: 10rem;
--border-radius-big: 3rem;
}
.logo {
width: 16rem;
}
.swiper-nav__btn-wrp {
top: calc(50% - 3rem);
width: 6rem;
height: 6rem;
padding: 0.5rem;
}
.swiper-nav {
bottom: -3rem;
left: calc(50% - 6.5rem);
width: 13rem;
height: 6rem;
}
.swiper-nav__btn {
width: 5rem;
height: 5rem;
}
.swiper-nav__btn-icon {
width: 2rem;
height: 1.2rem;
}
.main-slider:not(:last-child),
.section:not(:last-child) {
margin-bottom: 6rem;
}
.section__head,
.main-title {
margin-bottom: 5.5rem;
}
.section-suptitle {
font-size: 2.5rem;
}
.section-suptitle:not(:last-child) {
margin-bottom: 0.5rem;
}
.section-title,
.main-title {
font-size: 4rem;
}
.mp-about__btn-wrp,
.mp-news__btn-wrp,
.mp-vacancy__btn-wrp,
.pages {
margin-top: 3rem;
}
.place-grid__item {
width: calc((100% - var(--grid-gap)) / 2);
}
.mp-news {
--mp-news-padding: 5rem;
}
.mp-news__inner {
overflow: inherit;
}
.news-grid_mp {
flex-wrap: nowrap;
overflow: scroll;
width: calc(100% + 2* var(--content-padding));
left: calc(-1* var(--content-padding));
padding: 0 var(--content-padding);
scrollbar-width: none;
}
.news-grid_mp .news-grid__item {
width: calc(100vw / 3 + 4rem);
flex-shrink: 0;
}
.to-top {
right: 2rem;
bottom: 2rem;
width: 5rem;
height: 5rem;
}
.to-top__icon {
width: 2rem;
height: 1.2rem;
}
.mp-vacancy__descr {
font-size: 2rem;
}
.body {
padding-bottom: 6rem;
}
.breadcrumbs {
margin-bottom: 1rem;
}
.narrow-page .offset-2 {
margin-left: 0;
}
.narrow-page .col-10 {
grid-column: span 12 / auto !important;
}
.menu-grid__item {
width: calc((100% - var(--grid-gap))/2);
}
.dish-info {
padding-left: 0;
}
.news-grid__item {
width: calc((100% - var(--grid-gap)) / 2);
}
.post-preview {
margin-bottom: 3rem;
}
.post-date {
margin-bottom: 1.5rem;
}
.big-text:not(:last-child) {
margin-bottom: 3rem;
}
.big-text {
font-size: 2rem;
}
.text-field {
height: 6rem;
}
.form-fields {
gap: 1.5rem;
}
.form-note {
padding: 2rem;
font-size: 2rem;
}
}
@media (max-width: 767px) {
.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
grid-column: span 12 / auto !important;
}
.offset-2 {
margin-left: 0;
}
.main-slider:not(:last-child),
.section:not(:last-child) {
margin-bottom: 5rem;
}
.body {
padding-bottom: 5rem;
}
.footer {
padding-bottom: 3rem;
}
.section-suptitle {
font-size: 2rem;
}
.section-title,
.main-title {
font-size: 3.5rem;
}
.section__head,
.main-title {
margin-bottom: 5rem;
}
.place-item__info,
.news-item__descr {
padding: 2rem;
}
.place-item__title {
font-size: 2rem;
}
.news-item__title {
margin-bottom: 1rem;
height: 5.3rem;
font-size: 2rem;
}
.btn {
padding: 1.1rem 2.2rem 1.4rem;
font-size: 1.8rem;
}
.menu-item__info {
padding: 2rem;
}
.menu-item__title {
font-size: 2rem;
}
.wpcf7-spinner {
right: calc(50% - 15rem);
}
}
@media (max-width: 575px) {
:root {
--header-height: 7rem;
}
.logo,
.header_active .logo {
width: 11rem;
}
.header_active .header__inner {
height: var(--header-height);
}
.header__inner {
padding-right: 4rem;
}
.social {
gap: 1.5rem;
}
.mobile-menu .menu-item a {
font-size: 2rem;
}
.mobile-menu {
gap: 1rem;
}
.swiper-nav__btn-wrp {
top: calc(50% - 2.5rem);
width: 5rem;
height: 5rem;
}
.swiper-nav {
bottom: -2.5rem;
left: calc(50% - 5.5rem);
width: 11rem;
height: 5rem;
}
.swiper-nav__btn {
width: 4rem;
height: 4rem;
}
.swiper-nav__btn-icon {
width: 1.8rem;
height: 1rem;
}
.main-slider:not(:last-child),
.section:not(:last-child) {
margin-bottom: 4rem;
}
.body {
padding-bottom: 4rem;
}
.footer {
padding-bottom: 2rem;
}
.section-title,
.main-title {
font-size: 3rem;
}
.section__head,
.main-title {
margin-bottom: 3rem;
}
.section-title:after,
.main-title:after {
bottom: -1.5rem;
left: calc(50% - 4rem);
width: 8rem;
height: .6rem;
background-size: 8rem .6rem;
}
.mp-about__btn-wrp,
.mp-news__btn-wrp,
.mp-vacancy__btn-wrp,
.pages {
margin-top: 2rem;
}
.place-grid__item,
.menu-grid__item,
.news-grid__item {
width: 100%;
}
.mp-news {
--mp-news-padding: 3rem;
}
.news-grid_mp .news-grid__item {
width: calc(100vw / 2 + 6rem);
}
.to-top {
width: 4rem;
height: 4rem;
}
.to-top__icon {
width: 1.8rem;
height: 1rem;
}
.mp-vacancy__descr,
.big-text {
font-size: 1.8rem;
}
.mp-vacancy__descr br,
.big-text br {
display: none;
}
.big-text:not(:last-child) {
margin-bottom: 2rem;
}
.form-fields {
gap: 1rem;
}
.text-field {
height: 5rem;
}
.textarea-field {
padding-top: 1.6rem;
padding-bottom: 1.6rem;
}
.text-field,
.textarea-field {
padding-left: 2.4rem;
padding-right: 2.4rem;
font-size: 1.8rem;
border-radius: 3rem;
}
.form-note {
padding: 1.2rem 2rem 1.5rem;
font-size: 1.8rem;
}
}