/*------------------------------------------------------------------------------------------- */
/*-------------------------------- 4fresh brand detail page --------------------------------- */
/*-------------------------------- br - brand item classs ----------------------------------- */
/*------------------------------------------------------------------------------------------- */
/* #External styles updates
================================================== */
a.ci-btn--middle,
.ci-btn--middle {
line-height: 48px;
box-sizing: border-box;
padding-top: 0;
}
.container-fluid--wide {
max-width: 1230px;
}
/* #Common styles
================================================== */
h1 {
text-align: center;
}
.br-page h1 {
text-align: center;
}
.br-page .br-subtitle {
text-align: center;
}
.br-subtitle {
text-align: center;
font-size: 14px;
max-width: 700px;
margin: 0 auto;
}
.br-bottom-border {
border-bottom: 6px solid;
border-image: url(/img/svg/brand/new.svg) 10 repeat;
}
/* #Brand page head elements
================================================== */
.br-title {
text-align: center;
font-size: 14px;
color: #646464;
position: relative;
}
@media (max-width: 991px) {
.br-title {
padding-top: 34px;
}
}
.br-title h1 {
margin-bottom: 20px;
padding: 0 85px;
}
@media (max-width: 550px) {
.br-title h1 {
padding: 0;
margin: 0 auto 22px;
}
}
.br-title .br-desc {
max-width: 560px;
margin: 0 auto 30px;
padding: 0 85px;
}
@media (max-width: 550px) {
.br-title .br-desc {
padding: 0;
margin: 0 auto 22px;
}
}
.br-title .country-with-flag {
margin-bottom: 15px;
display: inline-block;
}
.br-title .br-nature {
position: absolute;
right: 30px;
top: 50%;
transform: translateY(-50%);
}
@media (max-width: 991px) {
.br-title .br-nature {
right: 15px;
}
}
@media (max-width: 768px) {
.br-title .br-nature {
right: 5px;
}
}
@media (max-width: 550px) {
.br-title .br-nature {
display: none;
}
}
.br-desc {
font-size: 14px;
line-height: 1.5;
}
.br-head-nav {
margin-bottom: 32px;
}
@media (max-width: 768px) {
.br-head-nav {
margin-bottom: 25px;
}
}
@media (max-width: 550px) {
.br-head-nav {
white-space: nowrap;
overflow-x: scroll;
display: block;
margin: 0 -15px 22px;
padding: 0 15px;
}
}
.br-head-nav a {
margin: 0 25px;
font-size: 14px;
font-weight: bold;
color: #6b998f;
line-height: 0.9;
text-transform: uppercase;
border: none;
}
@media (max-width: 768px) {
.br-head-nav a {
margin: 0 8px;
padding: 10px 20px 7px;
border-radius: 16px;
background-color: #f0f5f4;
}
}
@media (max-width: 550px) {
.br-head-nav a {
margin: 0 5px;
display: inline-block;
}
}
.br-head-nav a .link {
border-bottom: 1px dotted #c8d9d5;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
@media (max-width: 768px) {
.br-head-nav a .link {
border-bottom: none;
}
}
.br-head-nav a .value {
color: #cccccc;
}
.br-head-nav a:hover .link {
border-bottom-color: transparent;
}
.br-nature {
cursor: pointer;
background-image: url(/img/svg/brand/rating-nature.svg);
background-position: center;
background-repeat: no-repeat;
background-size: contain;
width: 64px;
height: 64px;
font-size: 24px;
color: #ee6b3f;
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 768px) {
.br-nature {
width: 50px;
height: 50px;
font-size: 18px;
}
}
@media (max-width: 550px) {
.br-nature {
width: 40px;
height: 40px;
}
}
/* #Brend main info block
================================================== */
.br-head-block {
border-radius: 5px;
overflow: hidden;
}
.br-head-block__content {
position: relative;
height: 420px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
padding: 90px 20px 100px;
box-sizing: border-box;
}
.br-head-block__content:before {
display: block;
content: "";
position: absolute;
/*background-color: rgba(0, 0, 0, 0.2);*/
left: 0;
right: 0;
top: 0;
bottom: 0;
}
@media (max-width: 768px) {
.br-head-block__content {
height: 380px;
padding: 70px 20px;
}
}
@media (max-width: 550px) {
.br-head-block__content {
height: auto;
padding: 20px 15px 28px;
}
}
@media (max-width: 768px) {
.br-head-block {
margin-left: -15px;
margin-right: -15px;
border-radius: 0;
}
}
.br-head-sertificates {
position: absolute;
}
/*.br-head-sertificates .img {*/
/*height: 40px;*/
/*}*/
@media (min-width: 551px) {
.br-head-sertificates {
left: 29px;
top: 22px;
}
}
@media (max-width: 550px) {
.br-head-sertificates {
position: relative;
margin-bottom: 30px;
left: -32px;
max-width: calc(100vw - 75px);
}
}
.br-head-sertificates a {
height: 40px;
margin: 0 4px;
}
.br-head-sertificates a:hover img {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
.br-head-sertificates a img {
height: 40px;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.br-head-rating {
position: relative;
display: flex;
align-items: end;
}
@media (min-width: 551px) {
.br-head-rating {
position: absolute;
top: 36px;
right: 40px;
}
}
@media (max-width: 550px) {
.br-head-rating {
margin-bottom: 20px;
}
}
.br-head-rating .ci-mess {
padding-left: 0.5em;
color: #000;
}
.br-head-logo {
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 550px) {
.br-head-logo {
height: 140px;
margin-bottom: 20px;
}
}
.br-head-logo img {
width: 195px;
max-width: 100%;
max-height: 100%;
}
.br-head-control {
position: relative;
display: flex;
margin-bottom: -60px;
}
@media (max-width: 550px) {
.br-head-control {
white-space: nowrap;
overflow-x: scroll;
display: block;
margin: 0 -15px;
padding: 0 15px;
max-width: 100%;
}
}
.br-head-control .br-btn-action {
margin: 0 10px;
}
@media (max-width: 550px) {
.br-head-control .br-btn-action {
margin: 0 5px;
display: inline-block;
}
}
.br-head-btm {
background-color: #ee6b3f;
line-height: 1.2;
padding: 22px 20px 20px;
color: #ffffff;
bottom: 0;
left: 0;
right: 0;
font-size: 16px;
text-align: center;
font-weight: bold;
}
@media (max-width: 768px) {
.br-head-btm {
padding: 18px 20px 16px;
}
}
@media (max-width: 550px) {
.br-head-btm {
padding: 12px 15px 10px;
}
}
.br-head-block .br-nature {
position: absolute;
top: 20px;
right: 20px;
color: #000000;
}
.br-nature.top-rating {
background-image: url(/img/rating-border-green.png) !important;
}
.br-head-block .br-nature.top-rating span{
font-size: 22px;
}
.br-nature.top-rating span{
color: #3a3f46;
position: absolute;
/*right: 8px;*/
padding-bottom: 6px;
bottom: 45px;
font-weight: bold;
font-size: 30px;
width: 40px;
text-align: center;
}
.br-head-block .br-nature span {
position: relative;
top: 2px;
}
@media (min-width: 551px) {
.br-head-block .br-nature {
display: none;
}
}
.br-head-block--catalog .br-head-block__content {
height: 150px;
padding: 20px;
}
.br-head-block--catalog .br-head-logo {
height: 100%;
}
.br-head-block--catalog .br-head-logo img {
height: 100%;
}
.br-head-block--catalog .br-btn-action--favourite {
bottom: 13px;
right: 13px;
background: transparent;
position: absolute;
color: #ffffff;
border: 1px solid rgba(255, 255, 255, 0.25);
}
.br-btn-action {
padding: 13px 30px 10px 45px;
border-radius: 25px;
background-color: rgba(255, 255, 255, 0.9);
color: #000000;
font-size: 14px;
position: relative;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
cursor: pointer;
line-height: 1.3;
}
.br-btn-action:hover {
color: #000000;
background-color: #ffffff;
}
.br-btn-action:before {
content: "";
display: block;
position: absolute;
left: 23px;
width: 15px;
height: 15px;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.br-btn-action--favourite:before {
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
background-image: url(/img/svg/catalog/heart.svg);
}
.br-btn-action--favourite.active:before {
background-image: url(/img/svg/catalog/heart-fill.svg);
}
.br-btn-action--sertificates:before {
background-image: url(/img/svg/icons/sert.svg);
}
.br-btn-action--video:before {
background-image: url(/img/svg/icons/video-play-green-outline.svg);
}
.br-head-reasons {
display: flex;
justify-content: space-between;
padding: 40px 20px;
}
@media (max-width: 768px) {
.br-head-reasons {
padding: 30px 5px;
}
}
@media (max-width: 550px) {
.br-head-reasons {
flex-direction: column;
align-items: center;
padding: 10px 0 15px;
}
}
.br-head-reason {
max-width: 270px;
line-height: normal;
text-align: center;
margin: 0 20px;
}
@media (max-width: 768px) {
.br-head-reason {
margin: 0 15px;
}
}
@media (max-width: 550px) {
.br-head-reason {
margin: 10px 0;
max-width: 300px;
}
}
.br-head-reason__title {
margin-bottom: 0.8em;
font-weight: bold;
font-size: 16px;
}
@media (max-width: 768px) {
.br-head-reason__title {
margin-bottom: 10px;
}
}
.br-head-reason__text {
font-size: 14px;
color: #646464;
}
/* #Brand catalog
================================================== */
.br-catalog {
padding-top: 40px;
padding-bottom: 50px;
}
@media (max-width: 768px) {
.br-catalog {
padding-top: 30px;
padding-bottom: 40px;
}
}
@media (max-width: 550px) {
.br-catalog {
padding-top: 20px;
padding-bottom: 32px;
}
}
.br-catalog h1 {
text-align: center;
}
.br-catalog .new-filter-sidebar > .sidebar-new-filter > li > a {
text-transform: uppercase;
}
@media (max-width: 991px) {
.br-catalog .filter-nav_aside {
margin-left: -15px;
margin-right: -15px;
}
}
@media (max-width: 991px) {
.br-catalog .catalog-items-list,
.br-catalog .new-sorting-block-wrapper {
display: none;
}
}
@media (max-width: 991px) {
.br-catalog.br-bottom-border {
border-bottom: none;
padding-bottom: 5px;
}
}
.br-catalog-page h1 {
text-align: left;
}
@media (min-width: 992px) {
.new-filter-sidebar--brand {
padding-left: 15px;
padding-right: 15px;
}
}
@media (max-width: 991px) {
.new-filter-sidebar--brand > .sidebar-new-filter > li > a {
padding: 17px 15px 13px!important;
border-bottom: 1px solid #dddddd !important;
position: relative;
}
.new-filter-sidebar--brand > .sidebar-new-filter > li > a:after {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/brand/select-list-arrow.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
top: 50%;
transform: translateY(-50%);
color: #474243 !important;
display: block!important;
right: 15px;
}
.new-filter-sidebar--brand > .sidebar-new-filter > li > a.active:after {
transform: rotate(180deg);
}
}
@media (max-width: 991px) {
.new-filter-sidebar--brand > .sidebar-new-filter > li.show > .sidebar-new-filter {
border-top: 0!important;
}
}
@media (max-width: 991px) {
.new-filter-sidebar--brand > .sidebar-new-filter > li:first-child > a {
border-top: 1px solid #dddddd !important;
}
}
@media (min-width: 991px) {
.sidebar-new-filter .bestseller {
border-bottom: 1px solid #dddddd;
margin-bottom: 8px;
}
}
.sidebar-new-filter .bestseller a {
padding-bottom: 14px;
border-bottom: 1px solid #dddddd;
}
/* #Brand questions block
================================================== */
.br-questions {
padding-top: 70px;
padding-bottom: 70px;
}
@media (max-width: 768px) {
.br-questions {
padding-top: 50px;
padding-bottom: 50px;
}
}
@media (max-width: 550px) {
.br-questions {
padding-top: 35px;
padding-bottom: 35px;
}
}
.br-quest-block {
border-radius: 5px;
background-color: #f8f4ef;
padding: 42px 35px 45px;
line-height: normal;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 25px;
max-width: 970px;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
}
@media (max-width: 768px) {
.br-quest-block {
margin-left: -15px;
margin-right: -15px;
padding: 32px 25px ;
}
}
@media (max-width: 550px) {
.br-quest-block {
padding: 20px 15px 15px;
}
}
.br-quest-block__title {
font-size: 24px;
letter-spacing: -0.5px;
text-align: center;
margin-bottom: 1.2em;
}
@media (max-width: 550px) {
.br-quest-block__title {
line-height: 1.38;
font-size: 16px;
}
}
.br-quest-block__actor {
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 768px) {
.br-quest-block__actor {
flex-wrap: wrap;
}
}
.br-quest-block__actor__img {
width: 130px;
height: 130px;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
border-radius: 50%;
margin-right: 40px;
flex-shrink: 0;
}
@media (max-width: 768px) {
.br-quest-block__actor__img {
width: 115px;
height: 115px;
margin-right: 30px;
}
}
@media (max-width: 550px) {
.br-quest-block__actor__img {
width: 80px;
height: 80px;
margin-right: 15px;
}
}
.br-quest-block__actor__img img {
width: 100%;
max-width: 100%;
max-height: 100%;
}
.br-quest-block__actor__content {
margin-right: 50px;
}
@media (max-width: 768px) {
.br-quest-block__actor__content {
/*margin-right: 0;*/
max-width: calc(100% - 145px);
}
}
@media (max-width: 550px) {
.br-quest-block__actor__content {
margin-right: 0;
max-width: calc(100% - 100px);
}
}
.br-quest-block__actor__mess-t {
color: #999999;
margin-bottom: 4px;
}
.br-quest-block__actor__name {
font-size: 30px;
font-weight: bold;
margin-bottom: 2px;
}
@media (max-width: 768px) {
.br-quest-block__actor__name {
font-size: 28px;
}
}
@media (max-width: 550px) {
.br-quest-block__actor__name {
font-size: 24px;
}
}
@media (max-width: 400px) {
.br-quest-block__actor__name {
font-size: 20px;
}
}
.br-quest-block__actor__sign {
margin-top: 14px;
color: #999999;
}
.br-quest-block__btn {
width: 200px;
padding-left: 10px;
padding-right: 10px;
cursor: pointer;
}
.br-quest-block__btn:disabled,
.br-quest-block__btn[disabled] {
background: transparent!important;
color: #cccccc !important;
border: 1px solid #cccccc;
box-shadow: none;
ccursor: default;
pointer-events: none;
}
@media (max-width: 768px) {
.br-quest-block__btn {
margin-top: 20px;
}
}
@media (max-width: 550px) {
.br-quest-block__btn {
font-size: 16px;
}
}
.br-quest-add {
margin-top: 2px;
border-radius: 5px;
background-color: #f8f4ef;
padding: 35px 35px 35px;
max-width: 970px;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
}
@media (max-width: 768px) {
.br-quest-add {
margin-left: -15px;
margin-right: -15px;
padding: 32px 25px ;
}
}
@media (max-width: 550px) {
.br-quest-add {
padding: 26px 15px 15px;
}
}
@media (max-width: 550px) {
.br-quest-add .ci-btn[type=submit] {
font-size: 16px;
}
}
.br-questions-list .questions__wrap {
max-width: 640px;
margin: 70px auto 0;
}
@media (max-width: 768px) {
.br-questions-list .questions__wrap {
margin: 46px auto 0;
max-width: 500px;
}
}
@media (max-width: 550px) {
.br-questions-list .questions__wrap {
max-width: 400px;
margin: 34px auto 0;
}
}
.questions__item::before {
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
/* #Brand advantages block
================================================== */
.br-advantages {
padding-top: 70px;
}
/* #Brand history block
================================================== */
.br-history {
padding-top: 70px;
margin-bottom: 52px;
border-bottom: 1px solid #dddddd;
padding-bottom: 30px;
}
.br-history h1 {
margin-bottom: 0.75em;
}
.br-history .br-subtitle {
text-align: center;
margin-bottom: 40px;
}
@media (max-width: 550px) {
.br-history .br-subtitle {
margin-bottom: 30px;
}
}
@media (max-width: 768px) {
.br-history {
padding-top: 50px;
padding-bottom: 20px;
}
}
@media (max-width: 550px) {
.br-history {
padding-top: 35px;
padding-bottom: 0;
border-bottom: none;
}
}
.br-history-line {
display: flex;
justify-content: space-between;
margin: 0 0 40px;
position: relative;
}
@media (max-width: 768px) {
.br-history-line {
margin-bottom: 32px;
}
}
@media (max-width: 550px) {
.br-history-line {
display: none;
}
}
.br-history-line:before {
content: "";
position: absolute;
display: block;
height: 6px;
border-radius: 3px;
background-color: #e1ebe9;
left: 50px;
right: 0;
top: 34px;
}
@media (max-width: 991px) {
.br-history-line:before {
left: 30px;
}
}
.br-history-line__item {
display: flex;
align-items: center;
flex-direction: column;
text-align: center;
max-width: 140px;
margin-right: 20px;
color: #474243;
}
@media (max-width: 768px) {
.br-history-line__item {
margin-right: 6px;
}
}
.br-history-line__item:not(:first-child) {
margin-left: 20px;
}
@media (max-width: 768px) {
.br-history-line__item:not(:first-child) {
margin-left: 6px;
}
}
.br-history-line__item__year {
font-size: 18px;
position: relative;
margin-bottom: 32px;
line-height: 19px;
font-weight: bold;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.br-history-line__item__year:after {
content: "";
position: absolute;
display: block;
width: 14px;
height: 14px;
border-radius: 50%;
border: 4px solid #fff;
top: 26px;
background-color: #e1ebe9;
left: 50%;
transform: translateX(-50%);
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.br-history-line__item__title {
font-size: 14px;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.br-history-line__item:hover {
color: #ee6b3f;
}
.br-history-line__item:hover .br-history-line__item__year:after {
background-color: #acccc5;
}
.br-history-line__item:first-child .br-history-line__item__year:before {
content: "";
display: block;
position: absolute;
height: 6px;
background-color: #fff;
left: -40px;
width: 60px;
top: 34px;
}
.br-history-grid {
display: flex;
flex-wrap: wrap;
}
/* #Brand history stage block
================================================== */
.br-history-block {
display: flex;
width: 100%;
margin-bottom: 10px;
flex-direction: column;
padding: 35px 25px;
box-sizing: border-box;
justify-content: space-between;
line-height: 1.1;
}
@media (max-width: 768px) {
.br-history-block {
padding: 25px 20px;
}
}
@media (max-width: 550px) {
.br-history-block {
padding: 0;
margin-bottom: 25px;
align-items: flex-start !important;
}
}
.br-history-block__content {
border-radius: 5px;
background-color: #ffffff;
}
@media (max-width: 550px) {
.br-history-block__content {
order: 2;
padding: 0!important;
}
}
.br-history-block__year {
font-size: 24px;
color: #ee6b3f;
margin-bottom: 8px;
}
@media (max-width: 550px) {
.br-history-block__year {
margin-bottom: 5px;
}
}
.br-history-block__title {
font-size: 24px;
font-weight: 900;
letter-spacing: -0.5px;
margin-bottom: 10px;
color: #474243;
}
@media (max-width: 550px) {
.br-history-block__title {
margin-bottom: 8px;
}
}
.br-history-block__text {
max-width: 700px;
font-size: 14px;
}
.br-history-block__text p:not(:last-child) {
margin-bottom: 0.8em;
}
.br-history-block__img {
width: 100%;
max-height: 420px;
border-radius: 5px;
overflow: hidden;
}
@media (max-width: 991px) {
.br-history-block__img {
max-height: 380px;
}
}
.br-history-block__img img {
width: 100%;
max-width: 100%;
max-height: 100%;
object-fit: cover;
}
@media (max-width: 550px) {
.br-history-block__img img {
margin: 0;
}
}
@media (min-width: 551px) {
.br-history-block__img--mobile {
display: none;
}
}
@media (max-width: 550px) {
.br-history-block__img {
order: 1;
margin-left: -15px;
margin-right: -15px;
border-radius: 0;
width: calc(100% + 30px);
max-height: 230px;
margin-bottom: 18px;
}
}
.br-history-block--half {
width: 50%;
}
@media (max-width: 550px) {
.br-history-block--half {
width: 100%;
}
}
@media (min-width: 551px) {
.br-history-block--half .br-history-block__content {
max-width: 435px;
}
.br-history-block--half--left {
align-items: flex-end;
padding-left: 0;
}
.br-history-block--half--right {
align-items: flex-start;
padding-right: 0;
}
}
.br-history-block--bg {
min-height: 420px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
align-items: flex-end;
border-radius: 5px;
justify-content: flex-end;
}
@media (max-width: 768px) {
.br-history-block--bg {
min-height: 360px;
}
}
@media (max-width: 550px) {
.br-history-block--bg {
background: none!important;
padding-left: 0!important;
padding-right: 0!important;
min-height: 0;
}
}
.br-history-block--bg .br-history-block__content {
padding: 25px;
max-width: 500px;
border-radius: 5px;
background-color: #ffffff;
}
@media (max-width: 768px) {
.br-history-block--bg .br-history-block__content {
padding: 20px;
}
}
.br-history-block--bg--left {
padding-right: 50%;
align-items: flex-end;
}
@media (max-width: 768px) {
.br-history-block--bg--left {
padding-right: 30%;
}
}
.br-history-block--bg--right {
padding-left: 50%;
align-items: flex-start;
}
@media (max-width: 768px) {
.br-history-block--bg--right {
padding-left: 30%;
}
}
@media (min-width: 551px) {
.br-history-block--align-center {
text-align: center;
}
.br-history-block--align-center .br-history-block__content {
margin: auto;
}
}
.br-subscribe-form {
max-width: 800px;
margin: 0 auto 50px;
line-height: 1.1;
text-align: center;
padding: 40px 40px 15px;
}
@media (max-width: 768px) {
.br-subscribe-form {
margin-left: -15px;
margin-right: -15px;
padding: 30px 25px;
}
}
@media (max-width: 550px) {
.br-subscribe-form {
padding: 25px 15px;
}
}
.br-subscribe-form .ci-form__subtitle .smile {
background-image: url(/img/brand/brand_smile.svg);
background-position: center;
background-repeat: no-repeat;
margin: auto;
width: 26px;
height: 26px;
margin-top: 15px;
}
.br-subscribe-form .ci-form__subtitle {
margin-bottom: 0;
}
.br-subscribe-form .form-title {
font-size: 24px;
font-weight: 900;
letter-spacing: -0.5px;
margin-bottom: 0.5em;
}
.br-subscribe-form .form-row {
display: flex;
max-width: 660px;
margin: 25px auto 5px;
}
@media (max-width: 550px) {
.br-subscribe-form .form-row {
flex-direction: column;
align-items: center;
margin: 20px auto 0;
}
}
.br-subscribe-form .form-row .fluid-field {
width: 59%;
margin-right: 20px;
}
@media (max-width: 550px) {
.br-subscribe-form .form-row .fluid-field {
margin-right: 0;
margin-bottom: 10px;
width: 100%;
}
}
.br-subscribe-form input[type="submit"] {
width: calc(41% - 20px);
min-height: 39px;
border: none;
padding-top: 4px;
min-width: 120px;
}
@media (max-width: 550px) {
.br-subscribe-form button[type="submit"] {
font-size: 16px;
width: 200px;
}
}
.br-title .br-nature span {
top: 3px;
position: relative
}
.form-messages {
margin-top: 20px;
}
/*------------------------------------------------------------------------------------------- */
/*-------------------------------- 4fresh catalog detail page ------------------------------- */
/*-------------------------------- ci - catalog item classs --------------------------------- */
/*------------------------------------------------------------------------------------------- */
/* #Common styles
================================================== */
a {
border-bottom: none;
}
.stars {
width: 97px;
height: 20px;
background-image: url(/img/svg/catalog/stars-white.svg);
background-repeat: no-repeat;
}
.stars span {
height: 17px;
background-image: url(/img/svg/catalog/stars-yellow.svg);
background-repeat: no-repeat;
}
.stars--min {
width: 70px;
height: 12px;
background-size: auto 12px;
cursor: default;
}
.stars--min span {
height: 12px;
background-size: auto 12px;
}
.ci-page {
font-size: 15px;
color: #474243;
line-height: 1;
}
.ci-page a {
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-page p {
margin-bottom: 1em;
line-height: 1.4;
}
@media (max-width: 550px) {
.ci-page--crumbs {
display: none;
}
}
@media (max-width: 550px) {
.ci-page--crumbs + .ci-page {
padding-top: 22px;
}
}
.ci-title {
font-size: 43px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1;
letter-spacing: -0.5px;
text-transform: none;
margin-bottom: 0.2em;
}
@media (max-width: 968px) {
.ci-title {
font-size: 36px;
}
}
@media (max-width: 550px) {
.ci-title {
font-size: 28px;
text-align: center;
font-weight: 400;
}
}
@media (max-width: 400px) {
.ci-title {
font-size: 22px;
letter-spacing: -0.3px;
}
}
@media (min-width: 769px) {
.ci-title + .ci-row--head {
padding-top: 15px;
}
}
@media (max-width: 550px) {
.ci-title + .ci-row--head {
padding-top: 7px;
}
}
.ci-row {
display: flex;
align-items: center;
}
.ci-row--sb {
justify-content: space-between;
}
.ci-row--afs {
align-items: flex-start;
}
.ci-row--afe {
align-items: flex-end;
}
.ci-row--abl {
align-items: baseline;
}
.ci-row--wrap {
flex-wrap: wrap;
}
.ci-row--astretch {
align-items: stretch;
}
.ci-row--head {
padding: 23px 0 22px;
border-bottom: 1px solid #e5e5e5;
font-size: 15px;
}
@media (max-width: 968px) {
.ci-row--head {
padding: 22px 0 20px;
}
}
@media (max-width: 768px) {
.ci-row--head {
padding: 10px 0;
}
.ci-row--head .ci-producer {
display: none;
}
}
.ci-row--head .ci-rating {
padding-bottom: 2px;
display: inline-block;
margin-right: 10px;
vertical-align: bottom;
}
@media (min-width: 769px) {
.ci-row--head .ci-control-head {
padding-top: 4px;
}
}
.ci-row_main {
border-bottom: 1px solid #e5e5e5;
padding: 4px 0;
}
@media (max-width: 768px) {
.ci-row_main {
flex-direction: column;
align-items: center;
padding: 0;
}
}
@media (max-width: 550px) {
.ci-row_main {
border-bottom: none;
}
}
.ci-col {
display: flex;
flex-direction: column;
}
.ci-col--aic {
align-items: center;
}
@media (max-width: 968px) {
.ci-col--tabl {
flex-direction: column;
align-items: flex-start;
}
}
@media (max-width: 968px) {
.ci-col--tabl-center {
flex-direction: column;
align-items: center;
}
}
@media (max-width: 968px) {
.ci-row--tabl {
flex-direction: row;
}
}
.ci-mess--min {
font-size: 13px;
line-height: 1.16;
}
.ci-mess--red {
color: #ee6b3f;
}
.ci-mess--grey {
color: #a3a0a1;
}
.ci-section--narrow {
max-width: 768px;
margin-left: auto;
margin-right: auto;
}
.ci-section h2,
.ci-form h2 {
font-size: 24px;
margin: 1.3em 0 0.7em;
text-transform: uppercase;
}
@media (max-width: 550px) {
.ci-section h2,
.ci-form h2 {
font-size: 20px;
}
}
@media (max-width: 400px) {
.ci-section h2,
.ci-form h2 {
font-size: 18px;
}
}
[class^="link"] {
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.link--dotted {
border-bottom: 1px dotted #c8d9d5;
line-height: 0.9;
display: inline-block;
}
.link--dotted:hover {
border-bottom-color: transparent!important;
}
.link--solid {
border-bottom: 1px solid;
display: inline-block;
line-height: 0.9;
}
.link--solid:hover {
border-bottom-color: transparent!important;
}
.link--dotted-wrap span {
border-bottom: 1px dotted #c8d9d5;
}
.link--dotted-wrap:hover span {
border-bottom-color: transparent!important;
}
.link--solid-wrap span {
border-bottom: 1px solid;
}
.link--solid-wrap:hover span {
border-bottom-color: transparent!important;
}
@media (max-width: 768px) {
.ci-section--roll {
margin-left: -25px;
margin-right: -25px;
padding-left: 25px;
padding-right: 25px;
border-bottom: 1px solid #e5e5e5;
}
.ci-section--roll .ci-block__title {
font-size: 20px;
font-weight: normal;
margin: 0;
padding: 1.2em 30px 0.9em 0;
position: relative;
}
.ci-section--roll .ci-block__title:before {
content: "";
display: block;
position: absolute;
width: 20px;
height: 0;
border-bottom: solid 2px #827d7f;
top: 50%;
transform: translateY(-50%);
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transform: rotate(-90deg);
right: 0;
opacity: 0.6;
}
.ci-section--roll .ci-block__title:after {
content: "";
display: block;
position: absolute;
width: 20px;
height: 0;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
border-bottom: solid 2px #827d7f;
top: 50%;
transform: translateY(-50%);
right: 0;
transform: rotate(-180deg);
opacity: 0.6;
}
.ci-section--roll .ci-block__content {
display: none;
padding-bottom: 20px;
}
.ci-section--roll--open .ci-block__title:before {
transform: rotate(0);
}
.ci-section--roll--open .ci-block__title:after {
transform: rotate(0);
}
.ci-section--roll--open .ci-block__content {
display: block;
}
.ci-section--roll:hover .ci-block__title:before,
.ci-section--roll:hover .ci-block__title:after {
opacity: 1;
}
}
@media (max-width: 768px) and (max-width: 550px) {
.ci-section--roll .ci-block__title {
font-size: 18px;
}
}
@media (max-width: 768px) and (max-width: 400px) {
.ci-section--roll .ci-block__title {
font-size: 16px;
}
}
@media (max-width: 768px) and (max-width: 550px) {
.ci-section--roll .ci-block__title:before {
width: 16px;
height: 0;
}
.ci-section--roll .ci-block__title:after {
width: 16px;
height: 0;
}
}
.ci-section--roll .ci-block-text.ci-block__content p:last-child {
margin-bottom: 0;
}
.ci-section--roll--rating {
display: inline-flex;
margin-left: 18px;
opacity: 1;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
@media (min-width: 769px) {
.ci-section--roll--rating {
display: none;
}
}
.ci-section--roll--rating .ci-reviews-count {
margin-bottom: -1px;
margin-left: 10px;
}
.ci-section--roll--open .ci-section--roll--rating {
opacity: 0;
}
.ci-section--roll--open .ci-block__title {
font-weight: bold;
}
/* #User labels
================================================== */
.ci-user-label {
width: 16px;
height: 16px;
margin: 0 1px;
display: inline-block;
}
/* #Props styles
================================================== */
.ci-prop {
line-height: 1.2;
}
.ci-prop__name {
padding-right: 0.4em;
}
.ci-prop__value {
font-weight: 400;
}
.ci-article {
color: #a3a0a1;
}
@media (max-width: 768px) {
.ci-article {
width: 100%;
text-align: center;
}
}
@media (max-width: 550px) {
.ci-article {
font-size: 13px;
}
}
.ci-producer__value {
margin-right: 20px;
}
/* #Head rows styles
================================================== */
.ci-head-counters {
white-space: nowrap;
}
.ci-head-counters a {
cursor: pointer;
white-space: nowrap;
}
@media (max-width: 768px) {
.ci-head-counters a {
font-weight: 400;
}
}
.ci-head-counters > a:not(:first-child) {
margin-left: 1.5em;
position: relative;
}
.ci-head-counters > a:not(:first-child):before {
display: inline-block;
content: "|";
padding: 0 0.8em;
left: -1.8em;
position: absolute;
color: #689a8f;
}
@media (max-width: 550px) {
.ci-head-counters > a:not(:first-child) {
display: none;
}
}
.ci-control-head .ci-action--share {
margin-left: 30px;
}
@media (max-width: 968px) {
.ci-control-head .ci-action:last-child {
margin-right: 0!important;
}
}
.ci-action {
position: relative;
cursor: pointer;
line-height: 0.9;
}
@media (min-width: 769px) {
.ci-action {
padding-left: 25px;
}
}
.ci-action span {
border-bottom: 1px dotted #c8d9d5;
display: inline-block;
}
.ci-action:hover span {
border-bottom: 1px solid transparent;
}
@media (max-width: 768px) {
.ci-action:not(.ci-action--min) {
width: 36px;
height: 36px;
border: solid 1px #e5e5e5 !important;
border-radius: 50%;
margin: 0 6px !important;
display: flex;
align-items: center;
justify-content: center;
}
.ci-action:not(.ci-action--min):before {
position: relative;
}
.ci-action:not(.ci-action--min) span {
display: none;
}
}
@media (max-width: 400px) {
.ci-action {
width: 34px;
height: 34px;
}
}
.ci-action:before {
width: 18px;
height: 16px;
}
@media (min-width: 769px) {
.ci-action:before {
top: 50%;
transform: translateY(-50%);
top: calc(50% - 1px);
left: 0;
}
}
.ci-action--favourite:before {
width: 20px;
height: 20px;
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/heart.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-size: 16px;
}
@media (min-width: 769px) {
}
.ci-action--favourite--active:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/heart-fill.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-size: 16px;
box-shadow: 0 0 0 rgba(204, 169, 44, 0);
animation: pulse 1.5s;
animation-timing-function: ease-out;
border-radius: 50%;
background-color: transparent;
}
@media (max-width: 768px) {
.ci-action--favourite--active:not(.ci-action--min) {
background-color: #fff0cb;
border-color: #fff0cb !important;
animation: pulseBackCircle 1.3s;
}
}
.ci-action--share:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/share-symbol.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
@media (min-width: 769px) {
.ci-action--share:before {
left: 2px;
}
}
.ci-action--reply:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/reply.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-size: 100%;
}
@media (max-width: 768px) {
.ci-action--reply:before {
background-image: url('/img/svg/catalog/reply-dark-grey.svg');
}
}
.ci-action--reply:hover:before {
background-image: url('/img/svg/catalog/reply-orange.svg');
}
@keyframes pulse {
0% {
-moz-box-shadow: 0 0 0 0 #fff0cb;
box-shadow: 0 0 0 0 #fff0cb;
background-color: rgba(255, 240, 203, 0.8);
}
80% {
box-shadow: 0 0 0 8px rgba(255, 240, 203, 0);
background-color: transparent;
}
100% {
box-shadow: 0 0 0 0 rgba(255, 240, 203, 0);
background-color: transparent;
}
}
@media (max-width: 768px) {
@keyframes pulse {
0% {
-moz-box-shadow: 0 0 0 0 #fff0cb;
box-shadow: 0 0 0 0 #fff0cb;
background-color: rgba(255, 240, 203, 0.8);
}
80% {
box-shadow: 0 0 0 15px rgba(255, 240, 203, 0);
background-color: transparent;
}
100% {
box-shadow: 0 0 0 0 rgba(255, 240, 203, 0);
background-color: transparent;
}
}
}
@keyframes pulseBackCircle {
0% {
border-color: transparent;
background-color: transparent;
}
20% {
border-color: transparent;
background-color: transparent;
}
55% {
background-color: #fff0cb;
}
}
/* #Main block styles
================================================== */
.ci-col_visual {
padding: 20px 0;
width: 440px;
margin-right: 40px;
flex-shrink: 0;
position: relative;
}
@media (max-width: 968px) {
.ci-col_visual {
width: 380px;
margin-right: 25px;
}
}
@media (max-width: 768px) {
.ci-col_visual {
max-width: 100%;
width: 100%;
margin-right: 0;
padding-bottom: 0;
}
}
.ci-col_main {
width: 60%;
ffont-size: 15px;
}
.ci-col_main > .ci-col {
padding: 22px 0;
}
.ci-col_main > .ci-col:not(:last-child) {
border-bottom: 1px solid #e5e5e5;
}
@media (max-width: 968px) {
.ci-col_main > .ci-col {
padding: 16px 0;
}
}
@media (max-width: 768px) {
.ci-col_main > .ci-col {
align-items: center;
}
.ci-col_main > .ci-col:first-child {
border-bottom: none;
padding-bottom: 4px;
}
}
@media (max-width: 768px) {
.ci-col_main {
width: 100%;
}
}
@media (max-width: 768px) {
.ci-col_main .ci-col--tabl {
align-items: center;
}
}
.ci-col_price > .ci-row:not(:last-child),
.ci-col_price .ci-prod-price > .ci-row {
margin-bottom: 20px;
}
@media (max-width: 968px) {
.ci-col_price > .ci-row:not(:last-child),
.ci-col_price .ci-prod-price > .ci-row {
margin-bottom: 16px;
}
}
@media (max-width: 768px) {
.ci-col_price > .ci-row:not(:last-child),
.ci-col_price .ci-prod-price > .ci-row {
justify-content: center;
margin-bottom: 14px;
text-align: center;
}
}
@media (max-width: 550px) {
.ci-col_price > .ci-row:not(:last-child),
.ci-col_price .ci-prod-price > .ci-row {
flex-direction: column;
align-items: center;
}
}
@media (min-width: 769px) {
.ci-col_price .ci-btn--big {
margin-right: 18px;
padding-top: 4px;
}
}
.ci-labels {
display: flex;
margin-bottom: 25px;
}
@media (max-width: 968px) {
.ci-labels {
margin-bottom: 15px;
}
}
.ci-labels .ci-label {
margin-right: 10px;
}
.ci-label {
font-size: 11px;
font-weight: 900;
letter-spacing: 0.9px;
color: #ffffff;
text-transform: uppercase;
padding: 0px 15px 0px 9px;
background-color: #ddd;
position: relative;
height: 18px;
line-height: 19px;
}
.ci-label:before {
content: '';
display: inline-block;
position: absolute;
width: 0;
height: 0;
right: 0;
border-top: 9px solid transparent;
border-bottom: 9px solid transparent;
border-right: 5px solid white;
}
.ci-label--bestseller {
background-color: #f5a623;
}
.ci-label--new {
background-color: #949a45;
}
.ci-label--sale {
background-color: #ee6b3f;
}
.ci-label--effective {
background-color: #f4c445;
}
.ci-buble-label {
background: url(/img/svg/catalog/korzinaPlus.svg) center no-repeat;
background-size: contain;
width: 66px;
height: 66px;
font-size: 8px;
font-weight: bold;
line-height: 1.25;
display: flex;
align-items: center;
justify-content: center;
padding: 12px 6px 8px;
text-align: center;
text-transform: uppercase;
box-sizing: border-box;
border-radius: 50%;
}
.ci-buble-label__list {
position: absolute;
z-index: 2;
}
@media (min-width: 550px) and (max-width: 768px) {
.ci-buble-label__list {
left: calc(50vw - 380px/2);
}
}
@media (min-width: 400px) and (max-width: 550px) {
.ci-buble-label__list {
left: 30px;
}
}
@media (max-width: 768px) {
}
@media (max-width: 550px) {
.ci-buble-label {
width: 60px;
height: 60px;
font-size: 7px;
}
}
.ci-price-choice__list {
display: flex;
flex-flow: row wrap;
}
@media (max-width: 768px) {
.ci-price-choice__list {
justify-content: center;
}
}
.ci-price-choice__item {
padding: 10px 9px 7px;
border-radius: 3px;
border: solid 1px #e5e5e5;
margin: 5px 10px 5px 0;
transition: all 0.1s ease;
-moz-transition: all 0.1s ease;
-webkit-transition: all 0.1s ease;
-ms-transition: all 0.1s ease;
-o-transition: all 0.1s ease;
cursor: pointer;
}
@media (max-width: 968px) {
.ci-price-choice__item {
padding: 7px 7px 5px;
}
}
.ci-price-choice__item__size {
color: #6b998f;
font-weight: 400;
border-bottom: solid 1px #c8d9d5;
line-height: 0.9;
display: inline-block;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-price-choice__item__price {
color: #a3a0a1;
}
.ci-price-choice__item:hover .ci-price-choice__item__size {
color: #ee6b3f;
border-bottom-color: transparent;
}
.ci-price-choice--min .ci-price-choice__item {
padding: 4px 7px 3px;
border: solid 1px #cccccc;
margin: 2px 3px;
line-height: 1;
}
.ci-price-choice--min .ci-price-choice__item__size {
font-size: 12px;
color: #646464;
font-weight: normal;
border-bottom: none;
}
.ci-price-choice--min .ci-price-choice__list {
justify-content: flex-start !important;
}
.ci-price-choice--main .ci-price-choice__item {
box-sizing: border-box;
}
@media (min-width: 968px) {
.ci-price-choice--main .ci-price-choice__item {
min-height: 34px;
}
}
.ci-price-choice input:nth-of-type(1):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(1),
.ci-price-choice input:nth-of-type(2):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(2),
.ci-price-choice input:nth-of-type(3):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(3),
.ci-price-choice input:nth-of-type(4):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(4),
.ci-price-choice input:nth-of-type(5):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(5),
.ci-price-choice input:nth-of-type(6):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(6) {
background-color: #e1ebe9;
border-color: #6b998f;
}
.ci-price-choice input:nth-of-type(1):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(1) .ci-price-choice__item__size,
.ci-price-choice input:nth-of-type(2):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(2) .ci-price-choice__item__size,
.ci-price-choice input:nth-of-type(3):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(3) .ci-price-choice__item__size,
.ci-price-choice input:nth-of-type(4):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(4) .ci-price-choice__item__size,
.ci-price-choice input:nth-of-type(5):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(5) .ci-price-choice__item__size,
.ci-price-choice input:nth-of-type(6):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(6) .ci-price-choice__item__size {
border-bottom: none;
color: #6b998f;
}
.ci-price-choice input:nth-of-type(1):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(1) .ci-price-choice__item__price,
.ci-price-choice input:nth-of-type(2):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(2) .ci-price-choice__item__price,
.ci-price-choice input:nth-of-type(3):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(3) .ci-price-choice__item__price,
.ci-price-choice input:nth-of-type(4):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(4) .ci-price-choice__item__price,
.ci-price-choice input:nth-of-type(5):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(5) .ci-price-choice__item__price,
.ci-price-choice input:nth-of-type(6):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(6) .ci-price-choice__item__price {
color: #474243;
}
.ci-price-choice--min input:nth-of-type(1):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(1) .ci-price-choice__item__size,
.ci-price-choice--min input:nth-of-type(2):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(2) .ci-price-choice__item__size,
.ci-price-choice--min input:nth-of-type(3):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(3) .ci-price-choice__item__size,
.ci-price-choice--min input:nth-of-type(4):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(4) .ci-price-choice__item__size,
.ci-price-choice--min input:nth-of-type(5):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(5) .ci-price-choice__item__size,
.ci-price-choice--min input:nth-of-type(6):checked ~ .ci-price-choice__list .ci-price-choice__item:nth-of-type(6) .ci-price-choice__item__size {
font-weight: bold;
color: #646464;
}
.ci-waiting {
align-items: flex-end;
}
@media (max-width: 968px) {
.ci-waiting {
margin-top: 0.8em;
}
}
.ci-waiting__animation {
margin-right: 12px;
padding-top: 1px;
}
.ci-waiting__animation .loader {
--size: 24px;
}
.ci-waiting__title {
padding-top: 5px;
}
@media (max-width: 968px) {
.ci-waiting__title {
margin-right: 15px;
}
}
.ci-waiting__term {
margin-top: 8px;
font-size: 13px;
color: #ee6b3f;
white-space: nowrap;
}
.ci-waiting--empty .ci-waiting__title {
color: #ee6b3f;
}
.ci-waiting--empty .loader > .circle {
background: #ee6b3f;
}
.ci-waiting__link {
margin-top: 5px;
white-space: nowrap;
}
.ci-prod-price {
display: none;
}
.ci-prod-price--active {
display: block;
}
.ci-prod-price .ci-actual-price {
margin-bottom: 5px;
}
@media (min-width: 769px) {
.ci-prod-price .ci-actual-price {
margin-right: 24px;
}
}
@media (max-width: 768px) {
.ci-prod-price .ci-actual-price {
font-size: 36px;
margin: 2px 0 5px;
}
}
@media (max-width: 550px) {
.ci-prod-price .ci-old-price {
margin-right: 0;
margin-bottom: 6px;
}
}
.ci-old-price {
margin-right: 16px;
font-size: 18px;
color: #474243;
position: relative;
}
.ci-old-price:before {
content: "";
display: block;
position: absolute;
border-top: 1px solid #ee6b3f;
left: 0;
right: 0;
top: 42%;
transform: rotate(-8deg);
}
.ci-old-price--min {
color: #9b9b9b;
font-size: 12px;
}
.ci-old-price--min:before {
top: 46%;
}
.ci-old-price--md {
font-size: 14px;
color: #9b9b9b;
}
.ci-sale-value {
color: #ee6b3f;
font-weight: 400;
}
.ci-actual-price {
font-weight: bold;
font-size: 40px;
white-space: nowrap;
}
@media (max-width: 550px) {
.ci-actual-price {
font-size: 36px;
}
}
.ci-actual-price--md {
font-size: 22px;
}
.ci-actual-price--min {
font-size: 18px;
margin-right: 2px;
}
.ci-size {
color: #646464;
white-space: nowrap;
}
.ci-prod-btns--mobile {
align-items: center;
max-width: 100%;
}
@media (min-width: 551px) {
.ci-prod-btns--mobile {
display: none;
}
}
.ci-prod-btns--desc {
margin-bottom: 0!important;
}
@media (max-width: 550px) {
.ci-prod-btns--desc {
display: none;
}
}
.ci-sale-by-code {
border-radius: 33px;
background-color: #ffede7;
width: 100%;
position: relative;
box-sizing: border-box;
padding: 9px 20px 7px 40px;
margin-bottom: 20px;
cursor: pointer;
}
@media (max-width: 968px) {
.ci-sale-by-code {
padding-left: 48px;
font-size: 14px;
line-height: 1.2;
}
}
@media (max-width: 768px) {
.ci-sale-by-code {
width: auto;
}
}
.ci-sale-by-code:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/clock-2.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
width: 16px;
height: 16px;
left: 13px;
top: 48%;
transform: translateY(-50%);
}
@media (max-width: 968px) {
.ci-sale-by-code:before {
width: 24px;
height: 24px;
}
}
.ci-sale-by-code__mess,
.ci-sale-by-code__link {
font-size: 14px;
font-weight: 400;
color: #ee6b3f;
}
.ci-sale-by-code__link {
border-color: #f1b5a1;
}
.tooltip_sale-by-code {
padding: 4px 2px;
min-width: 270px;
}
.tooltip_sale-by-code b {
font-weight: bold;
}
.tooltip_sale-by-code p {
margin-bottom: 0.8em;
}
.tooltip_sale-by-code .ci-actual-price {
color: #949a45;
font-size: 30px;
margin: 0.3em 0 0.6em;
}
.tooltip_sale-by-code__code {
width: 100%;
text-align: center;
border-radius: 33px;
background-color: #ee6b3f;
padding: 8px 0 6px;
margin-bottom: 16px;
font-size: 16px;
color: #fff;
}
.tooltip_sale-by-code .link--solid {
font-size: 13px;
font-weight: 400;
}
.ci-timer-icon {
position: relative;
color: #ee6b3f;
}
.ci-timer-icon:before {
content: "";
display: block;
position: relative;
background-image: url('/img/svg/catalog/clock-2.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
width: 16px;
height: 16px;
margin: 0 5px -2px 3px;
display: inline-block;
}
.ci-ohana {
position: relative;
padding-left: 31px;
}
.ci-ohana:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/ohana-icon.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
width: 21px;
height: 21px;
left: 0;
}
@media (max-width: 550px) {
.ci-ohana:before {
top: -1px;
}
}
.ci-ohana__mess {
font-size: 16px;
font-weight: bold;
padding-top: 3px;
}
@media (max-width: 550px) {
.ci-ohana__mess {
text-align: left;
}
}
a.ci-btn,
.ci-btn {
background-image: none;
}
a.ci-btn--big,
.ci-btn--big {
border-radius: 5px;
min-height: 60px;
width: 305px;
flex-shrink: 0;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
font-size: 20px;
box-sizing: border-box;
background-image: none;
}
a.ci-btn--big span,
.ci-btn--big span {
line-height: 1;
margin: 1px 0;
}
a.ci-btn--big span.min,
.ci-btn--big span.min {
font-size: 14px;
font-weight: normal;
text-transform: none;
}
a.ci-btn--big--pt,
.ci-btn--big--pt {
padding-top: 5px;
}
a.ci-btn--middle,
.ci-btn--middle {
min-height: 44px;
min-width: 190px;
flex-shrink: 0;
text-align: center;
display: flex;
border-radius: 5px;
justify-content: center;
font-size: 18px;
font-weight: 900;
padding: 5px 35px 0;
}
a.ci-btn--min,
.ci-btn--min {
font-size: 13px;
padding-top: 1px;
height: 29px;
}
a.ci-btn--orange,
.ci-btn--orange {
background-color: #ee6b3f;
box-shadow: 0 2px 0 0 #c55029;
color: #fff;
border: none;
}
a.ci-btn--orange.ci-btn--middle,
.ci-btn--orange.ci-btn--middle,
a.ci-btn--orange.ci-btn--min,
.ci-btn--orange.ci-btn--min {
box-shadow: 0 1px 0 0 #c55029;
}
a.ci-btn--catalog,
.ci-btn--catalog,
a.ci-btn--catalog.btn.to-cart,
.ci-btn--catalog.btn.to-cart {
letter-spacing: 0.5px;
text-transform: uppercase;
background-color: #949a45;
box-shadow: 0 2px 0 0 #6d7328;
font-weight: bold;
width: 150px;
text-align: center;
font-size: 16px;
box-sizing: border-box;
}
a.ci-btn--catalog.ci-btn--middle,
.ci-btn--catalog.ci-btn--middle,
a.ci-btn--catalog.btn.to-cart.ci-btn--middle,
.ci-btn--catalog.btn.to-cart.ci-btn--middle,
a.ci-btn--catalog.ci-btn--min,
.ci-btn--catalog.ci-btn--min,
a.ci-btn--catalog.btn.to-cart.ci-btn--min,
.ci-btn--catalog.btn.to-cart.ci-btn--min {
box-shadow: 0 1px 0 0 #6d7328;
line-height: 30px;
}
a.ci-btn_quick-order,
.ci-btn_quick-order {
height: 62px;
border-radius: 5px;
border: solid 1px #e5e5e5 !important;
padding: 14px 20px 12px;
line-height: 1.2;
box-sizing: border-box;
}
@media (max-width: 968px) {
a.ci-btn_quick-order,
.ci-btn_quick-order {
height: auto;
padding: 0;
margin: 20px 0 5px;
border: none!important;
}
}
a.ci-btn_quick-order > span,
.ci-btn_quick-order > span {
color: #6b998f;
border-bottom: 1px solid #c8d9d5;
line-height: 1.2;
text-transform: none;
font-weight: normal;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
@media (min-width: 551px) {
a.ci-btn_quick-order > span,
.ci-btn_quick-order > span {
font-size: 12px;
}
}
a.ci-btn_quick-order > span > span,
.ci-btn_quick-order > span > span {
font-size: 15px;
border-bottom: none;
}
a.ci-btn_quick-order:hover span,
.ci-btn_quick-order:hover span {
border-bottom-color: transparent;
}
a.ci-btn_order-mobile,
.ci-btn_order-mobile {
display: flex;
flex-direction: row;
width: 350px;
max-width: 100%;
padding: 0;
}
a.ci-btn_order-mobile__basket,
.ci-btn_order-mobile__basket {
color: #fff;
background-color: #949a45;
box-shadow: 0 2px 0 0 #6d7328;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 68%;
padding-top: 2px;
text-transform: initial;
font-weight: bold;
border-radius: 5px 0 0 5px;
}
a.ci-btn_order-mobile__basket span,
.ci-btn_order-mobile__basket span {
margin: 2px 0;
}
a.ci-btn_order-mobile__basket span.min,
.ci-btn_order-mobile__basket span.min {
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
font-size: 15px;
border-bottom: 1px solid #b9bc8e;
line-height: 0.8;
margin-top: 4px;
}
a.ci-btn_order-mobile__basket:hover span.min,
.ci-btn_order-mobile__basket:hover span.min {
border-bottom-color: transparent;
}
a.ci-btn_order-mobile__add-one,
.ci-btn_order-mobile__add-one {
width: 32%;
background-color: #ffbb00;
box-shadow: 0 2px 0 0 #dca614;
display: flex;
align-items: center;
justify-content: center;
border-radius: 0 5px 5px 0;
text-transform: initial;
font-weight: bold;
padding-top: 3px;
color: #000;
}
@media (max-width: 550px) {
.ci-props {
border-bottom: none!important;
}
}
.ci-props .ci-prop:not(:last-child) {
margin-bottom: 0.8em;
}
.ci-props .ci-prop__name,
.ci-props .ci-prop__value {
display: inline;
}
@media (max-width: 768px) {
.ci-props .ci-prop {
width: 100%;
max-width: 90%;
}
}
@media (max-width: 550px) {
.ci-props .ci-prop {
max-width: 100%;
}
}
.ci-payment-info {
flex-direction: row;
align-items: center;
}
@media (max-width: 968px) {
.ci-payment-info {
flex-direction: column;
align-items: flex-start;
}
}
@media (max-width: 768px) {
.ci-payment-info {
display: none;
}
}
.ci-payment-info__mess {
margin-right: 14px;
}
@media (max-width: 968px) {
.ci-payment-info__mess {
margin-bottom: 8px;
}
}
.ci-payment-info__options img {
margin: 0 4px;
}
@media (max-width: 550px) {
.ci-delivery-info {
border-top: 1px solid #e5e5e5;
border-bottom: none!important;
}
}
@media (max-width: 768px) {
.ci-delivery-info__item {
width: 100%;
max-width: 90%;
}
}
@media (max-width: 550px) {
.ci-delivery-info__item {
max-width: 100%;
}
}
.ci-delivery-info__item + .ci-delivery-info__item {
margin-top: 18px;
}
@media (max-width: 550px) {
.ci-delivery-info__item + .ci-delivery-info__item {
margin-top: 15px;
}
}
.ci-delivery-info__title {
font-weight: 400;
margin-bottom: 0.3em;
}
.ci-delivery-info__content {
line-height: 1.5;
}
@media (max-width: 550px) {
.ci-delivery-info__content {
line-height: 1.4;
}
}
/* #CI photo gallery block
================================================== */
.ci-photo-gall {
display: none;
}
@media (max-width: 768px) {
.ci-photo-gall__block {
width: 350px;
margin: 0 auto;
}
}
@media (max-width: 550px) {
.ci-photo-gall__block {
width: 300px;
}
}
.ci-photo-gall--active {
display: block;
}
.ci-photo-gall .fotorama__nav {
top: initial;
}
.ci-photo-gall .fotorama__thumb-border {
border-radius: 5px;
border: solid 3px #949a45;
background: none;
}
.ci-photo-gall .fotorama__thumb {
border: solid 1px #e5e5e5;
border-radius: 5px;
box-sizing: border-box;
transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-webkit-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
}
.ci-photo-gall .fotorama__nav__frame--thumb:not(.fotorama__active) .fotorama__thumb:hover {
border-color: #EE6B3F;
}
.ci-photo-gall .gallery-thumb {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
.ci-photo-gall .gallery-thumb__text {
line-height: 1.29;
font-size: 14px;
color: #646464;
}
.ci-photo-gall .fotorama__nav__frame--thumb--video .fotorama__thumb,
.ci-photo-gall .fotorama__nav__frame--thumb--360 .fotorama__thumb {
padding-top: 9px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
font-size: 14px;
color: #646464;
line-height: 1.3;
box-sizing: border-box;
}
.ci-photo-gall .fotorama__nav__frame--thumb--video .gallery-thumb__icon,
.ci-photo-gall .fotorama__nav__frame--thumb--360 .gallery-thumb__icon {
margin-bottom: 10px;
}
@media (max-width: 968px) {
.ci-photo-gall .fotorama__stage {
margin-bottom: 15px;
}
}
@media (max-width: 768px) {
.ci-photo-gall .fotorama__stage {
margin-bottom: 10px;
}
}
.ci-photo-gall .sprite.zoomInPhoto {
position: absolute;
}
.ci-photo-gall .fotorama__nav--dots .fotorama__nav__frame {
width: 25px;
height: 25px;
}
.ci-photo-gall .fotorama__nav__frame .fotorama__dot {
width: 8px;
height: 8px;
background-color: #e5e5e5;
}
.ci-photo-gall .fotorama__nav__frame.fotorama__active .fotorama__dot {
width: 8px;
height: 8px;
background-color: #646464;
}
.ci-photo-gall .fotorama__nav:before,
.ci-photo-gall .fotorama__stage:before,
.ci-photo-gall .fotorama__nav:after,
.ci-photo-gall .fotorama__stage:after {
display: none;
}
.ci-photo-gall .fotorama__arr {
background-position: center;
}
.ci-photo-gall .fotorama__arr:not(.fotorama__arr--disabled) {
opacity: 0.75;
}
.ci-photo-gall .fotorama__arr:not(.fotorama__arr--disabled):hover {
opacity: 1;
}
.ci-photo-gall .fotorama__arr--next {
background-image: url(/img/svg/catalog/slider-next.svg);
}
.ci-photo-gall .fotorama__arr--prev {
background-image: url(/img/svg/catalog/slider-prev.svg);
}
@media (min-width: 769px) and (max-width: 968px) {
.ci-item-certificates + .ci-photo-gall__block .fotorama__stage {
margin-bottom: 70px;
}
}
.ci-item-certificates {
z-index: 2;
position: absolute;
bottom: 140px;
left: 0;
display: flex;
flex-direction: column-reverse;
}
@media (min-width: 769px) and (max-width: 968px) {
.ci-item-certificates {
flex-direction: row;
left: 50%;
transform: translateX(-50%);
top: 400px;
}
}
@media (max-width: 768px) {
.ci-item-certificates {
display: none;
flex-direction: row;
order: 1;
position: relative;
padding: 8px;
top: 0;
left: initial;
border-bottom: 1px solid #e5e5e5;
width: 100%;
box-sizing: border-box;
justify-content: center;
text-align: center;
}
}
.ci-item-certificates a {
display: block;
margin: 5px 0;
width: 40px;
height: 40px;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-item-certificates a img {
width: 100%;
}
.ci-item-certificates a:hover {
transform: scale(1.25);
}
@media (max-width: 968px) {
.ci-item-certificates a {
margin: 0 10px;
}
}
@media (max-width: 768px) {
.ci-item-certificates a {
display: inline-block;
}
}
.ci-item-certificates a.unvisible {
opacity: 0;
position: relative;
z-index: -1;
height: 0;
margin: 0;
}
.ci-item-certificates .ci-item-certificates__show {
border-radius: 50%;
background-color: #f7f7f7;
font-size: 20px;
cursor: pointer;
margin-bottom: -10px;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.ci-item-certificates .ci-item-certificates__show:hover {
color: #689a8f;
transform: none;
background-color: #eeeeee;
}
.tooltip_templates {
display: none;
}
.ci-visual-tabs {
margin: 20px -15px 0;
display: flex;
border-top: 1px solid #e5e5e5;
border-bottom: 1px solid #e5e5e5;
}
@media (min-width: 769px) {
.ci-visual-tabs {
display: none;
}
}
.ci-visual-tab {
justify-content: center;
width: 100%;
padding: 14px;
}
.ci-visual-tab + .ci-visual-tab {
border-left: 1px solid #e5e5e5;
}
.ci-visual-tab__icon {
margin-right: 12px;
}
.ci-visual-tab__name {
color: #474243;
font-size: 13px;
font-weight: bold;
text-transform: uppercase;
padding-top: 3px;
}
/* #CI related items
================================================== */
.ci-slider {
margin: 10px -10px;
display: flex;
}
.ci-slider .slick-arrow {
width: 32px;
height: 32px;
position: absolute;
top: -34px;
left: initial;
opacity: 0.75;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
background-image: url(/img/svg/catalog/slider-next.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.ci-slider .slick-arrow:hover:not(.slick-disabled) {
opacity: 1;
}
.ci-slider .slick-arrow:before {
display: none;
}
.ci-slider .slick-arrow.slick-disabled {
background-image: url(/img/svg/catalog/slider-next--inactive.svg);
}
.ci-slider .slick-prev {
transform: scale(-1, 1) translate(0, -50%);
right: 54px;
}
.ci-slider .slick-next {
right: 10px;
}
@media (min-width: 601px) {
.ci-slider .slick-track {
display: flex;
}
}
.ci-slider.ci-recipes__slider .slick-track {
display: flex;
}
.ci-slider .slick-dots {
margin-top: 12px;
bottom: -34px;
}
.ci-slider .slick-dots li {
margin: 0 1px;
}
.ci-slider .slick-dots li button:before {
font-size: 8px;
color: #646464;
}
.ci-section_related-items {
position: relative;
z-index: 10;
}
.ci-section_related-items h2 {
padding-right: 50px;
}
@media (max-width: 550px) {
.ci-section_related-items h2 {
text-align: center;
padding-right: 0;
margin-top: 0;
}
}
@media (max-width: 550px) {
.ci-section_related-items--mob-bg {
background-color: #f8f4ef;
border-bottom: 3px solid #ede7e0;
padding: 20px 15px 15px;
margin: 0 -15px;
}
.ci-section_related-items--mob-bg .ci-related-item {
border-color: #fff;
}
}
@media (min-width: 551px) and (max-width: 600px) {
.ci-section_related-items--mob-bg .slick-dotted.slick-slider {
margin-bottom: 50px;
}
}
.ci-related-items {
overflow-y: visible;
}
.ci-related-items .slick-list {
padding: 15px 10px 40px;
margin: -10px -10px -15px;
}
@media (max-width: 768px) {
.ci-related-items .slick-list {
margin: 0;
padding: 0 0 10px;
}
}
@media (max-width: 600px) {
.ci-related-items .slick-list {
padding: 0;
}
}
.ci-related-item__wrapper {
padding: 0 10px;
width: 33.333%;
height: auto;
}
.ci-related-item {
display: flex;
height: 100%;
box-sizing: border-box;
border-radius: 5px;
border: solid 1px #e5e5e5;
padding: 8px 5px ;
position: relative;
background: #fff;
align-items: flex-start;
}
@media (max-width: 550px) {
.ci-related-item {
padding: 10px 5px 10px;
}
}
.ci-related-item__img {
flex-shrink: 0;
margin-right: 7px;
position: relative;
}
.ci-related-item__img__item {
display: flex;
align-items: center;
justify-content: center;
width: 60px;
height: 60px;
}
.ci-related-item__img__item:not(.active) {
display: none;
}
.ci-related-item__img img {
width: 100%;
max-width: 100%;
max-height: 100%;
}
.ci-related-item__content {
padding-top: 4px;
align-items: flex-start;
position: relative;
width: 100%;
}
.ci-related-item__rating {
margin-bottom: 2px;
}
.ci-related-item__stars {
margin-right: 7px;
}
.ci-related-item__reviews-count {
color: #a3a0a1;
color: #646464;
}
.ci-related-item__price {
margin-right: 4px;
align-items: flex-start;
display: none;
}
.ci-related-item__price--active {
display: flex;
}
.ci-related-item__price .ci-actual-price {
margin-top: 5px;
margin-bottom: 2px;
}
.ci-related-item__size__value {
font-size: 12px;
}
.ci-related-item__name {
font-size: 15px;
line-height: 0.9;
padding-top: 2px;
margin-bottom: 8px;
white-space: nowrap;
max-width: 190px;
text-overflow: ellipsis;
overflow: hidden;
border-bottom-color: #c8d9d5;
}
.ci-related-item__labels {
position: absolute;
top: 0;
right: 5px;
}
.ci-related-item__empty-mess {
font-size: 13px;
color: #ee6b3f;
margin-top: 6px;
}
.ci-related-item__hover {
display: none;
border-radius: 5px;
box-shadow: 0 2px 13px 0 rgba(0, 0, 0, 0.1);
background-color: #ffffff;
top: -10px;
left: -10px;
width: calc(100% + 20px);
height: calc(100% + 40px);
box-sizing: border-box;
position: absolute;
padding: 15px 10px 12px;
}
.ci-related-item__hover__content {
box-sizing: border-box;
left: 0;
padding-top: 12px;
top: 100%;
}
@media (min-width: 769px) {
.ci-related-item__hover__content {
position: absolute;
}
}
@media (max-width: 968px) {
.ci-related-item__hover__content {
padding-top: 9px;
}
}
.ci-related-item__hover__content .ci-mess {
font-size: 14px;
font-weight: bold;
letter-spacing: -0.5px;
padding-top: 8px;
}
@media (min-width: 769px) {
.ci-related-item:not(:hover) .ci-related-item__hover__content,
.ci-related-item:not(:hover) .ci-related-item__hover {
display: none;
}
.ci-related-item:not(:hover) .ci-action--favourite:not(.ci-action--favourite--active) {
display: none;
}
.ci-related-item:hover .ci-related-item__hover {
display: flex;
align-items: flex-end;
}
}
.ci-related-item .ci-btn--catalog {
width: 105px;
white-space: nowrap;
margin-right: 15px;
font-size: 13px;
}
.ci-related-item .ci-waiting__link {
margin-top: 0;
font-size: 14px;
}
.ci-related-item .ci-action {
border-bottom: 0;
margin-left: 2px;
padding-left: 0;
}
.ci-related-item .ci-action--favourite:before {
width: 16px;
height: 16px;
background-size: 14px;
left: 0;
}
/* #Catalog item detail - advantages section
================================================== */
.ci-section_advantages {
margin-top: 10px;
padding: 18px 0;
background-color: #f8f4ef;
position: relative;
}
@media (max-width: 968px) {
.ci-section_advantages {
border-bottom: 4px solid #ede7e0;
margin: 10px -15px 0;
padding: 10px 15px 5px;
}
}
@media (min-width: 969px) {
.ci-section_advantages:before,
.ci-section_advantages:after {
content: "";
display: block;
position: absolute;
width: 200%;
top: 0;
bottom: 0;
background-color: #f8f4ef;
}
.ci-section_advantages:before {
right: 100%;
}
.ci-section_advantages:after {
left: 100%;
}
}
@media (max-width: 550px) {
.ci-section_advantages {
display: none;
}
}
.ci-advantages-list {
display: flex;
}
@media (max-width: 968px) {
.ci-advantages-list {
flex-wrap: wrap;
justify-content: space-between;
}
}
.ci-advantage {
display: flex;
}
@media (min-width: 969px) {
.ci-advantage + .ci-advantage {
margin-left: 30px;
}
}
@media (max-width: 968px) {
.ci-advantage {
width: calc(50% - 10px);
margin: 0;
padding: 15px 5px;
box-sizing: border-box;
}
}
.ci-advantage__img {
width: 35px;
height: 38px;
margin-right: 10px;
flex-shrink: 0;
display: flex;
align-items: center;
}
.ci-advantage__img img {
width: 100%;
max-width: 100%;
max-height: 100%;
}
.ci-advantage__title {
font-size: 18px;
font-weight: bold;
color: #474243;
padding: 10px 0;
line-height: 1;
}
@media (max-width: 968px) {
.ci-advantage__title {
padding: 5px 0;
font-size: 16px;
}
}
.ci-advantage__text {
font-size: 13px;
color: #646464;
line-height: 1.4;
}
/* #Catalog item detail - about product
================================================== */
/* #CI - Exper block
================================================== */
.ci-expert-block {
display: flex;
}
@media (min-width: 769px) {
.ci-expert-block {
border-radius: 5px;
background-color: #f8f4ef;
padding: 15px 0;
margin-top: 24px;
}
.ci-expert-block .ci-expert-item {
width: 290px;
}
}
@media (max-width: 768px) {
.ci-expert-block {
border-bottom: 1px solid #e5e5e5;
padding: 0 15px;
margin-left: -15px;
margin-right: -15px;
}
}
@media (max-width: 700px) {
.ci-expert-block {
padding: 0;
flex-wrap: wrap;
}
.ci-expert-block .ci-expert-item {
justify-content: center;
width: 100%;
border-bottom: 1px solid #ede7e0;
}
}
@media (max-width: 550px) {
.ci-expert-block {
display: none;
}
}
.ci-expert-item {
display: flex;
line-height: 1.1;
padding: 0 20px;
}
@media (max-width: 768px) {
.ci-expert-item {
padding: 10px 15px 10px 0;
align-items: center;
}
}
.ci-expert-item__img {
width: 50px;
height: 50px;
margin-right: 16px;
position: relative;
flex-shrink: 0;
}
.ci-expert-item__img img {
width: 100%;
border-radius: 50%;
}
.ci-expert-item__img:after {
width: 12px;
height: 12px;
content: "";
display: block;
position: absolute;
top: -3px;
left: -3px;
background-color: #76bb2c;
border-radius: 50%;
border: 3px solid #f8f4ef;
}
.ci-expert-item__name {
font-size: 22px;
font-weight: bold;
margin-bottom: 4px;
padding-top: 2px;
}
@media (max-width: 768px) {
.ci-expert-item__name {
font-size: 20px;
color: #474243;
}
}
.ci-expert-item__role {
font-size: 14px;
color: #a3a0a1;
padding-bottom: 5px;
}
@media (max-width: 968px) {
.ci-expert-item__role {
color: #949a45;
padding-bottom: 0;
}
}
.ci-expert-contact {
padding: 0 20px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
border-left: 1px solid #ede7e0;
padding-top: 7px;
}
.ci-expert-contact .ci-mess {
font-size: 14px;
white-space: nowrap;
}
@media (min-width: 968px) {
.ci-expert-contact .ci-mess {
padding: 5px 0;
}
}
@media (max-width: 968px) {
.ci-expert-contact {
justify-content: center;
padding-top: 0;
}
}
@media (max-width: 700px) {
.ci-expert-contact {
width: 50%!important;
padding: 10px;
justify-content: center;
box-sizing: border-box;
}
}
.ci-expert-phone {
width: 320px;
}
@media (max-width: 700px) {
.ci-expert-phone {
border-left: none;
}
}
.ci-expert-phone__value {
font-size: 28px;
font-weight: 900;
color: #ee6b3f;
white-space: nowrap;
margin-top: 6px;
}
@media (max-width: 968px) {
.ci-expert-phone__value {
font-size: 24px;
margin-top: 2px;
line-height: 1.3;
}
}
.ci-expert-write {
width: 170px;
}
@media (max-width: 968px) {
.ci-expert-write {
flex-direction: row;
padding: 10px 0 10px 25px;
}
.ci-expert-write .ci-mess {
white-space: initial;
font-weight: bold;
line-height: 1.2;
padding-top: 4px;
color: #474243;
}
}
@media (max-width: 700px) {
.ci-expert-write {
padding: 10px;
}
}
.ci-expert-write__img {
width: 34px;
height: 34px;
cursor: pointer;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
opacity: 0.8;
flex-shrink: 0;
}
@media (max-width: 968px) {
.ci-expert-write__img {
margin-right: 10px;
}
}
.ci-expert-write__img img {
width: 100%;
}
.ci-expert-write__img:hover {
opacity: 1;
}
/* #CI - Composition
================================================== */
.ci-compose {
list-style: none;
}
@media (max-width: 550px) {
.ci-compose {
padding-left: 14px;
padding-bottom: 0!important;
}
}
.ci-compose li {
display: inline;
line-height: 1.6;
}
@media (min-width: 769px) {
.ci-compose li:not(:last-child):after {
content: " • ";
}
}
@media (max-width: 768px) {
.ci-compose li {
display: block;
padding: 9px 0 6px;
}
}
@media (max-width: 550px) {
.ci-compose li {
border-top: 1px solid #e5e5e5;
}
}
.ci-compose li.active .ci-compose-item__name {
font-weight: bold;
letter-spacing: normal;
color: #474243;
}
.ci-compose-item__name {
cursor: help;
transition: all 0.1s ease-in !important;
}
@media (max-width: 768px) {
.ci-compose-item__name {
display: block;
letter-spacing: 0.08px;
}
.ci-compose-item__name span {
border-bottom: none!important;
}
}
@media (min-width: 551px) and (max-width: 768px) {
.ci-compose-item__name {
font-weight: bold;
color: #474243;
}
}
@media (max-width: 550px) {
.ci-compose-item__desc {
font-size: 13px;
margin-top: 4px;
margin-bottom: 5px;
line-height: 1.2;
}
}
.ci-compose-item__desc__wrap {
display: none;
}
@media (min-width: 550px) and (max-width: 768px) {
.ci-compose-item__desc__wrap {
display: block;
}
}
/* #CI - Making
================================================== */
/* #CI - Recipes
================================================== */
.ci-recipes__list {
margin: 5px -7px 15px;
}
@media (max-width: 600px) {
.ci-recipes__list {
max-width: 340px;
margin-left: auto;
margin-right: auto;
}
}
@media (max-width: 768px) {
.ci-recipes__all-link__wrap {
width: 100%;
text-align: center;
padding: 15px 0 5px;
}
}
.ci-recipes__item {
padding: 10px;
}
.ci-recipes__item .recipe_catalog__item {
height: auto;
margin-bottom: 10px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
}
@media (max-width: 550px) {
.ci-recipes__item .recipe_catalog__item {
margin-bottom: 6px;
}
}
.ci-recipes__item .recipe_catalog__thumbnail-small {
height: 150px;
}
.ci-recipes__item .recipe_catalog__content .name a {
min-height: 44px;
margin: 6px 0;
}
.ci-recipes__item .recipe_catalog__content .name a > span > span {
font-size: 15px;
line-height: 1;
}
.ci-recipes__item .recipe_catalog_inline__bottom img {
display: inline;
}
/* #CI - Feddback section - Reviews / Questions
================================================== */
.ci-feedback {
margin: 45px auto 40px;
border-bottom: 5px solid #f4f4f4;
}
@media (max-width: 768px) {
.ci-feedback {
margin-top: 0;
border-bottom: none;
margin-bottom: 35px;
}
}
.ci-feedback__head {
text-align: center;
background-color: #f4f4f4;
position: relative;
margin-bottom: 35px;
}
@media (max-width: 768px) {
.ci-feedback__head {
display: none;
}
}
.ci-feedback__head:before,
.ci-feedback__head:after {
content: "";
display: block;
position: absolute;
background-color: #f4f4f4;
top: 0;
bottom: 0;
width: 150%;
}
.ci-feedback__head:before {
right: 100%;
}
.ci-feedback__head:after {
left: 100%;
}
.ci-feedback__switcher {
display: inline-block;
}
.ci-feedback__switcher label {
cursor: pointer;
font-size: 18px;
height: 60px;
line-height: 60px;
margin: 0 20px;
}
.ci-feedback__switcher label.active {
font-size: 18px;
font-weight: bold;
}
.ci-feedback__switcher label span {
padding: 0 5px;
}
@media (min-width: 769px) {
.ci-feedback__tab {
padding-bottom: 35px;
}
}
@media (max-width: 768px) {
.ci-feedback__tab:last-child {
border-bottom: 4px solid #e5e5e5;
}
}
.ci-feedback__tab__title {
font-size: 30px;
font-weight: 300;
line-height: 1.2;
text-align: center;
color: #a3a0a1;
margin-bottom: 45px;
}
@media (max-width: 768px) {
.ci-feedback__tab__title {
display: none;
}
}
@media (min-width: 769px) {
.ci-feedback__tab {
display: none;
}
.ci-feedback__tab--active {
display: block;
}
}
@media (min-width: 769px) {
.ci-feedback__tab .ci-block__title {
display: none;
}
}
.ci-reviews-count {
font-size: 15px;
color: #a3a0a1;
}
.ci-rating.stars + .ci-reviews-count {
padding-top: 3px;
}
.ci-reviews__head-tabs {
margin: 0 -10px 35px;
align-items: stretch;
width: calc(100% + 20px);
}
@media (max-width: 968px) {
.ci-reviews__head-tabs {
width: calc(50% - 16px);
display: inline-block;
margin: 0;
}
}
@media (max-width: 768px) {
.ci-reviews__head-tabs {
width: calc(50% - 8px);
}
}
@media (max-width: 640px) {
.ci-reviews__head-tabs {
width: 100%;
margin-bottom: 20px;
}
}
@media (max-width: 968px) {
.ci-reviews__head-tabs .ci-review--min {
display: none;
}
}
.ci-reviews__head-tab {
margin: 0 10px;
width: calc(100% / 3);
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 5px 15px;
border-radius: 5px;
border: solid 1px #cccccc;
}
.ci-reviews__head-tab.ci-review--min {
cursor: pointer;
}
@media (max-width: 968px) {
.ci-reviews__head-tab {
width: 100%;
margin: 0;
box-sizing: border-box;
height: 100%;
}
}
.ci-reviews__head-tab .ci-review__total {
margin-right: 14px;
}
.ci-reviews__head-tab .ci-rating {
margin-right: 10px;
}
.ci-reviews__head-tab .ci-review__text {
margin-bottom: 0.6em;
}
.ci-reviews__head-tab .ci-reviews-tab__content,
.ci-reviews__head-tab .ci-reviews-tab__bottom {
border-top: 1px solid #cccccc;
}
.ci-reviews__head-tab .ci-reviews-tab__bottom,
.ci-reviews__head-tab .ci-reviews-tab__head {
padding: 12px 0;
}
.ci-reviews__head-tab .ci-reviews-tab__content {
padding: 14px 0 12px;
}
.ci-reviews__head-tab .ci-go-to-review-link {
color: #f15722;
font-size: 14px;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-reviews__head-tab:not(:hover) .ci-go-to-review-link {
opacity: 0;
}
.ci-reviews-tab__title {
text-transform: uppercase;
margin-bottom: 8px;
font-weight: 900;
}
@media (max-width: 640px) {
.ci-reviews-tab_total .ci-reviews-tab__content {
display: none;
}
.ci-reviews-tab_total .ci-reviews-tab__head {
position: relative;
}
.ci-reviews-tab_total .ci-reviews-tab__head:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/arrow-down-grey.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
top: 50%;
transform: translateY(-50%);
width: 15px;
height: 15px;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
right: 0;
opacity: 0.5;
}
.ci-reviews-tab_total .ci-reviews-tab__head:hover:before {
opacity: 0.8;
}
.ci-reviews-tab_total .ci-reviews-tab__head.active:before {
transform: rotate(-180deg) translateY(50%);
}
}
.tooltip_reviews_total {
padding: 0 5px 0;
width: 380px;
max-width: 100%;
}
@media (max-width: 550px) {
.tooltip_reviews_total {
width: 285px;
box-sizing: border-box;
}
}
.tooltip_reviews_total .ci-reviews-tab__content {
padding: 0 0 12px;
border-bottom: 1px solid #e5e5e5;
margin-bottom: 15px;
}
@media (min-width: 550px) {
.tooltip_reviews_total .ci-rating-line {
width: 210px;
}
}
.tooltip_reviews_total .ci-rating-mark {
padding: 7px 0;
}
/* Review item styles / answer
*******************************/
.ci-feedback__list .ci-feedback-item {
margin: 15px 0;
}
@media (max-width: 768px) {
.ci-feedback__list .ci-feedback-item {
margin: 10px 0;
}
}
.ci-feedback__list .ci-feedback-item:first-child {
margin-top: 5px;
}
.ci-feedback-item {
border-radius: 5px;
border: dotted 1px #ddd;
line-height: 1;
padding: 20px 25px 0;
position: relative;
}
@media (max-width: 768px) {
.ci-feedback-item {
padding: 0;
}
}
@media (max-width: 768px) {
.ci-feedback-item > .ci-review-item {
padding: 20px 0 0;
margin-left: 20px;
margin-right: 20px;
width: calc(100% - 40px);
}
}
@media (max-width: 550px) {
.ci-feedback-item > .ci-review-item {
padding: 18px 0 0;
margin-left: 15px;
margin-right: 15px;
width: calc(100% - 30px);
}
}
.ci-feedback-item .ci-rating {
margin-right: 15px;
}
@media (max-width: 400px) {
.ci-feedback-item .ci-rating {
margin-bottom: 10px;
}
}
@media (min-width: 769px) {
.ci-feedback-item .ci-action:before {
width: 15px;
height: 15px;
left: 3px;
}
}
@media (max-width: 550px) {
.ci-feedback-item .ci-action {
margin: 0!important;
}
.ci-feedback-item .ci-action + .ci-action {
margin-left: 9px!important;
}
}
.ci-feedback-item .ci-action--show-answer {
margin-left: 0;
}
.ci-feedback-item .ci-action--show-answer--mobile {
border-color: #c8d9d5;
color: #689a8f;
}
.ci-feedback-item .ci-action--show-answer--mobile__wrap {
width: 100%;
text-align: center;
border-top: 1px solid #e5e5e5;
padding: 12px 0 10px;
}
@media (min-width: 769px) {
.ci-feedback-item .ci-action--show-answer--mobile__wrap {
display: none;
}
}
@media (max-width: 768px) {
.ci-feedback-item .ci-review__control .ci-action--show-answer {
display: none;
}
}
.ci-feedback-item .ci-action:not(.ci-action--reply--hidden) + .ci-action--show-answer {
margin-left: 25px;
padding-left: 2px;
}
.ci-feedback-item .ci-action:not(.ci-action--reply--hidden) + .ci-action--show-answer:before {
content: "|";
color: #e5e5e5;
display: block;
position: absolute;
left: -14px;
}
.ci-feedback-item .ci-action--share {
margin-left: 32px;
}
.ci-feedback-item .ci-action--share:before {
background-image: url(/img/svg/catalog/share-symbol--grey.svg);
}
@media (max-width: 768px) {
.ci-feedback-item .ci-action--share:before {
background-image: url(/img/svg/catalog/share-symbol--dark-grey.svg);
}
}
@media (max-width: 768px) {
.ci-feedback-item .ci-action--share.active {
background-color: #f4f4f4;
border-color: #f4f4f4 !important;
}
}
.ci-feedback-item .ci-action--share.active:before {
background-image: url(/img/svg/catalog/share-symbol.svg);
}
@media (max-width: 768px) {
.ci-feedback-item .ci-action--share.active:before {
background-image: url(/img/svg/catalog/close.svg);
background-size: 13px;
}
}
.ci-feedback-item .ci-review__likes__count {
font-weight: bold;
}
.ci-question-answer .ci-review-reply {
padding-bottom: 0;
}
.ci-question-answer .ci-review-replies {
padding-bottom: 0;
}
@media (min-width: 769px) {
.ci-question-answer .ci-action--share {
padding-left: 25px;
margin-left: 5px;
}
}
.ci-review__head {
margin-bottom: 18px;
}
.ci-review__head > .ci-col > .ci-row {
padding: 2px 0;
}
.ci-review__head > .ci-col > .ci-row:first-child {
display: block;
}
.ci-review__head > .ci-col {
align-items: flex-start;
}
@media (max-width: 400px) {
.ci-review__head__row {
flex-direction: column;
align-items: flex-start;
}
}
@media (max-width: 550px) {
.ci-review__head {
border-bottom: 1px solid #e5e5e5;
padding-bottom: 12px;
align-items: flex-start;
margin-bottom: 14px;
}
}
.ci-review__content {
margin-bottom: 15px;
}
.ci-review__total {
font-size: 24px;
font-weight: 900;
color: #474243;
}
.ci-review__title {
font-weight: bold;
font-size: 18px;
margin-bottom: 7px;
}
.ci-review__date {
color: #a3a0a1;
font-size: 14px;
padding-top: 5px;
}
.ci-review__date + .ci-review__copy {
margin-left: 10px;
}
.ci-review__text {
color: #646464;
line-height: 1.4;
margin-bottom: 1.2em;
}
@media (max-width: 550px) {
.ci-review__text {
margin-bottom: 1em;
}
}
.ci-review__text p:last-child {
margin-bottom: 0;
}
.ci-review__text a {
border-bottom: 1px solid;
max-width: 100%;
overflow: hidden;
display: inline-block;
text-overflow: ellipsis;
vertical-align: middle;
line-height: 1;
}
.ci-review__text a:hover {
border-bottom-color: transparent;
}
.ci-review__photo {
display: flex;
flex-wrap: wrap;
}
.ci-review__photo__item {
margin: 0 20px 20px 0;
width: 80px;
height: 80px;
border: solid 1px #e5e5e5;
}
.ci-review__photo__item:hover {
border: 1px solid #b9b9b9;
}
@media (max-width: 768px) {
.ci-review__photo__item {
width: 70px;
height: 70px;
margin: 0 15px 15px 0;
}
}
@media (max-width: 550px) {
.ci-review__photo__item {
width: 60px;
height: 60px;
margin: 0 10px 10px 0;
}
}
.ci-review__photo__item img {
width: 100%;
object-fit: cover;
object-position: center;
height: 100%;
}
.ci-review__author {
display: flex;
align-items: center;
}
.ci-review__author__photo {
width: 50px;
height: 50px;
margin-right: 15px;
flex-shrink: 0;
}
.ci-review__author__photo img {
width: 100%;
border-radius: 50%;
}
@media (max-width: 550px) {
.ci-review__author__photo {
margin-top: 2px;
margin-right: 12px;
}
}
.ci-review__author__photo--club {
position: relative;
}
.ci-review__author__photo--club:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/crown.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
width: 14px;
height: 9px;
transform: rotate(-18deg);
left: 8px;
top: -9px;
}
.ci-review__author__name {
color: #474243;
font-size: 18px;
font-weight: bold;
margin-right: 5px;
line-height: 1.2;
display: inline;
}
.ci-review__author__name--reply-to:before {
content: "";
display: block;
position: static;
background-image: url('/img/svg/catalog/arrow-right.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
width: 16px;
height: 12px;
display: inline-block;
margin-right: 9px;
}
.ci-review__author__status {
color: #949a45;
font-size: 14px;
}
.ci-review__control {
padding: 18px 0px;
border-top: 1px solid #e5e5e5;
font-size: 14px;
-ms-align-items: baseline;
align-items: baseline;
}
@media (max-width: 768px) {
.ci-review__control {
padding: 15px 0 20px;
align-items: center;
}
}
@media (max-width: 550px) {
.ci-review__control {
padding: 10px 0 15px;
}
}
.ci-review__copy {
cursor: pointer;
}
@media (max-width: 550px) {
.ci-review__copy {
display: none;
}
}
.ci-review__copy__icon {
background: url('/img/svg/catalog/permalink.svg') center no-repeat;
background-size: contain;
width: 19px;
height: 19px;
margin-right: 5px;
box-sizing: border-box;
transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-webkit-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
}
.ci-review__copy__mess {
opacity: 0;
color: #ee6b3f;
transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-webkit-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
border-color: #f1b5a1;
padding-top: 4px;
}
.ci-review__copy:hover .ci-review__copy__icon,
.ci-review__copy.ci-review__copy--active .ci-review__copy__icon {
background-image: url('/img/svg/catalog/permalink_hover.svg');
}
.ci-review__copy:hover .ci-review__copy__mess,
.ci-review__copy.ci-review__copy--active .ci-review__copy__mess {
opacity: 1;
}
.ci-review__usefull {
color: #646464;
}
.ci-review__usefull .ci-review__likes {
margin-left: 16px;
position: relative;
}
@media (min-width: 768px) {
.ci-review__usefull .ci-review__likes {
top: -3px;
}
}
@media (max-width: 550px) {
.ci-review__usefull .ci-review__likes {
margin-left: 10px;
}
}
@media (max-width: 550px) {
.ci-review__usefull__mess {
display: none;
}
}
.ci-review__label {
border-radius: 5px;
background-color: #f3f4e4;
font-size: 14px;
color: #949a45;
font-weight: bold;
padding: 7px 10px 5px;
position: absolute;
right: 13px;
top: 15px;
display: none;
}
@media (max-width: 550px) {
.ci-review__label {
position: relative;
right: initial;
top: initial;
margin: 8px 0 4px;
}
}
.ci-review--min {
padding: 5px 15px;
}
.ci-review--min .ci-review__title {
font-size: 16px;
margin-bottom: 6px;
}
.ci-review--min .ci-review__text {
font-size: 14px;
line-height: 1.3;
}
.ci-review--min .ci-review__author__photo {
margin-right: 11px;
width: 27px;
height: 27px;
}
.ci-review--min .ci-review__author__name {
padding-top: 2px;
font-size: 16px;
}
.ci-review-replies {
border-top: 1px solid #e5e5e5;
padding-bottom: 10px;
display: none;
}
@media (max-width: 768px) {
.ci-review-replies {
padding-bottom: 0;
}
}
.ci-review-replies--open {
display: block;
}
.ci-review-reply {
padding: 22px 0 16px;
}
.ci-review-reply:not(:last-child) {
border-bottom: 1px solid #e5e5e5;
}
@media (min-width: 769px) {
.ci-review-reply--level-1 {
margin-left: 50px;
}
.ci-review-reply--level-2 {
margin-left: 90px;
}
.ci-review-reply--level-3 {
margin-left: 130px;
}
.ci-review-reply--level-4 {
margin-left: 170px;
}
}
@media (max-width: 768px) {
.ci-review-reply {
margin-top: -8px;
padding: 33px 20px 10px;
box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.05);
border-radius: 5px;
}
.ci-review-reply:not(:last-child) {
border-bottom: solid 1px #cccccc;
}
}
@media (max-width: 550px) {
.ci-review-reply {
padding: 30px 15px 10px;
}
}
.ci-review-reply__actions {
font-size: 14px;
}
@media (max-width: 768px) {
.ci-review-reply__actions {
padding: 10px 0 0;
border-top: 1px solid #e5e5e5;
display: flex;
justify-content: center;
}
}
/* Rating elements
************************/
.ci-rating-mark {
color: #6b998f;
display: flex;
justify-content: space-between;
padding: 9px 0;
line-height: 0.9;
align-items: baseline;
}
.ci-rating-mark__name {
font-weight: bold;
cursor: pointer;
width: 66px;
}
.ci-rating-mark__name span {
border-bottom: solid 1px #c8d9d5;
display: inline-block;
}
.ci-rating-mark__name:hover span {
border-bottom-color: transparent;
}
.ci-rating-mark .ci-rating-line {
top: 4px;
}
.ci-rating-mark__value {
width: 30px;
cursor: pointer;
}
.ci-rating-mark__value span {
border-bottom: solid 1px #c8d9d5;
display: inline-block;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-rating-mark__value:hover span {
border-bottom-color: transparent;
}
.ci-rating-mark__count {
width: 30px;
}
.ci-rating-line {
width: 120px;
height: 18px;
background-color: #fff0cb;
position: relative;
}
.ci-rating-line span {
height: 18px;
background-color: #ffbb00;
width: 100%;
position: absolute;
}
.ci-rating-parted-line {
width: 200px;
height: 12px;
background-image: url(/img/svg/catalog/rating_bg.svg);
position: relative;
}
.ci-rating-parted-line span {
height: 12px;
background-image: url(/img/svg/catalog/rating_select.svg);
width: 100%;
position: absolute;
}
.ci-review__likes {
display: flex;
align-items: center;
cursor: pointer;
}
@media (max-width: 768px) {
.ci-review__likes {
width: 70px;
height: 36px;
border: solid 1px #e5e5e5;
border-radius: 30px;
justify-content: center;
}
}
.ci-review__likes__icon {
margin-right: 7px;
}
.ci-review__likes__count {
padding-top: 6px;
}
.ci-review__likes--diss .icon-like:before {
transform: rotate(180deg);
top: 4px;
}
.ci-review__likes.voted .icon-like:before {
background-image: url('/img/svg/catalog/like-red.svg');
}
.ci-reviews__factors {
padding: 35px 20px;
border-radius: 5px;
background-color: #f0f5f4;
display: flex;
justify-content: space-between;
width: 100%;
box-sizing: border-box;
}
@media (max-width: 968px) {
.ci-reviews__factors {
flex-direction: column;
display: inline-flex;
width: calc(50% - 16px);
align-items: center;
padding: 30px 20px;
}
}
@media (max-width: 768px) {
.ci-reviews__factors {
width: calc(50% - 8px);
}
}
@media (max-width: 640px) {
.ci-reviews__factors {
width: 100%;
}
}
.ci-reviews__factors .ci-review-factor {
min-width: 260px;
padding: 0 15px;
}
@media (max-width: 968px) {
.ci-reviews__factors .ci-review-factor:not(:last-child) {
margin-bottom: 30px;
}
}
.ci-review-factor__name {
font-weight: bold;
font-size: 18px;
margin-bottom: 15px;
}
@media (max-width: 968px) {
.ci-review-factor__name {
margin-bottom: 12px;
}
}
.ci-review-factor__rating {
display: flex;
}
.ci-review-factor__rating .ci-rating-parted-line {
margin-right: 12px;
}
.ci-review-factor__rating__value {
font-size: 13px;
color: #474243;
line-height: 1;
}
.ci-feedback__control {
padding: 15px 0;
}
@media (max-width: 768px) {
.ci-feedback__control {
padding: 25px 0 15px;
}
}
@media (max-width: 550px) {
.ci-feedback__control {
padding: 20px 0 10px;
}
}
.ci-feedback__control .ci-btn--orange {
margin-left: 10px;
}
@media (max-width: 768px) {
.ci-feedback__control .ci-btn--orange {
order: 1;
margin-bottom: 30px;
width: 100%;
margin-left: 0;
}
}
@media (max-width: 550px) {
.ci-feedback__control .ci-btn--orange {
margin-bottom: 20px;
}
}
@media (max-width: 768px) {
.ci-feedback__control {
align-items: center;
flex-wrap: wrap;
justify-content: space-between;
}
}
.ci-feedback__control__nav--mobile {
order: 3;
margin: 8px 0;
}
@media (max-width: 700px) {
.ci-feedback__control__nav--mobile {
margin: 12px auto 0;
}
}
@media (min-width: 769px) {
.ci-feedback__control__nav--mobile {
display: none;
}
}
.ci-feedback__control--bottom {
margin: 30px 0 0;
}
@media (max-width: 768px) {
.ci-feedback__control--bottom {
align-items: center;
margin: 0;
}
}
@media (max-width: 700px) {
.ci-feedback__control--bottom {
flex-direction: column;
padding: 15px 0 5px;
}
}
@media (max-width: 550px) {
.ci-feedback__control--bottom {
padding: 5px 0 0;
}
}
.ci-feedback__control--bottom .pagination {
margin-right: 28px;
}
@media (max-width: 768px) {
.ci-feedback__control--bottom .pagination {
display: none;
}
}
.ci-feedback__control--bottom > a.ci-btn--orange {
order: 4;
}
@media (min-width: 769px) {
.ci-feedback__control--bottom > a.ci-btn--orange {
margin-left: 20px;
}
}
@media (max-width: 768px) {
.ci-feedback__control--bottom > a.ci-btn--orange {
margin: 16px 0 0;
}
}
.ci-feedback__filter {
margin-right: 25px;
}
@media (max-width: 768px) {
.ci-feedback__filter {
margin-right: 15px;
}
}
@media (max-width: 550px) {
.ci-feedback__filter {
width: 100%;
margin-right: 0;
}
}
.ci-feedback__filter__mess {
margin-right: 12px;
}
@media (max-width: 550px) {
.ci-feedback__filter__mess {
display: none;
}
}
@media (max-width: 768px) {
.ci-feedback__filter__wrap {
order: 2;
}
}
@media (max-width: 550px) {
.ci-feedback__filter__wrap {
width: 100%;
flex-direction: column;
align-items: center;
}
}
@media (max-width: 550px) {
.ci-feedback__filter .selectric-ci-feedback__filter__select {
width: 100%;
margin-bottom: 12px;
}
}
@media (max-width: 550px) {
.ci-feedback__filter-result {
font-size: 13px;
}
}
.ci-feedback__empty {
padding: 15px;
}
@media (max-width: 768px) {
.ci-feedback__empty {
padding: 10px;
}
}
.ci-feedback__empty__img {
width: 80px;
margin-bottom: 20px;
}
@media (max-width: 768px) {
.ci-feedback__empty__img {
width: 60px;
}
}
.ci-feedback__empty__mess {
font-size: 1.2em;
}
@media (max-width: 768px) {
.ci-feedback__empty__mess {
font-size: 1em;
}
}
/* CI Form common styles
************************/
.ci-form__container {
background: #f8f4ef;
position: relative;
border-radius: 5px;
padding: 25px;
}
@media (max-width: 550px) {
.ci-form__container {
padding: 25px 20px 20px;
}
}
@media (max-width: 400px) {
.ci-form__container {
padding: 25px 15px 20px;
}
}
.ci-form__file__area {
border-radius: 2px;
border: dashed 1px #bbad9b;
padding: 18px 25px;
width: 100%;
box-sizing: border-box;
position: relative;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
@media (max-width: 768px) {
.ci-form__file__area {
width: 50px;
height: 50px;
display: inline-block;
border: dashed 2px #ede7e0;
padding: 0;
border-radius: 5px;
}
.ci-form__file__area:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/plus-grey.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
width: 16px;
height: 16px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
opacity: 0.5;
}
.ci-form__file__area:hover:before {
opacity: 0.7;
}
}
@media (max-width: 550px) {
.ci-form__file__area {
width: 40px;
height: 40px;
}
}
.ci-form__file__area__icon {
width: 45px;
margin-right: 30px;
flex-shrink: 0;
}
.ci-form__file__area__icon img {
width: 100%;
}
@media (max-width: 768px) {
.ci-form__file__area__icon {
display: none;
}
}
.ci-form__file__area__content {
color: #bbad9b;
}
@media (max-width: 768px) {
.ci-form__file__area__content {
display: none;
}
}
.ci-form__file__area__title {
font-size: 16px;
font-weight: bold;
margin-bottom: 5px;
line-height: 0.9;
}
.ci-form__file__area__title label {
display: inline-block;
border-bottom: 1px solid;
}
.ci-form__file__area__subtitle {
font-size: 13px;
}
.ci-form__file__area input {
position: absolute;
cursor: pointer;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
opacity: 0;
}
.ci-form .add-comment-files button {
width: 72px;
height: 72px;
border-radius: 5px;
border: solid 1px #cccccc;
position: relative;
margin-bottom: 20px;
margin-right: 10px;
}
@media (max-width: 768px) {
.ci-form .add-comment-files button {
width: 50px;
height: 50px;
}
}
@media (max-width: 650px) {
.ci-form .add-comment-files button {
margin-bottom: 10px;
}
}
@media (max-width: 550px) {
.ci-form .add-comment-files button {
width: 40px;
height: 40px;
}
}
.ci-form .add-comment-files button.file-uploading {
background-color: #fff;
background-image: url('/img/svg/catalog/upload-file-loader.svg');
background-size: 24px;
background-position: center;
background-repeat: no-repeat;
}
@media (max-width: 768px) {
.ci-form .add-comment-files button.file-uploading {
background-size: 16px;
}
}
.ci-form .add-comment-files button.file-uploaded {
cursor: pointer;
}
.ci-form .add-comment-files button.file-uploaded:before {
content: "";
display: block;
position: absolute;
background-image: url('/img/svg/catalog/close.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
width: 20px;
height: 20px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 10;
}
@media (max-width: 768px) {
.ci-form .add-comment-files button.file-uploaded:before {
width: 14px;
height: 14px;
}
}
.ci-form .add-comment-files button.file-uploaded img {
vertical-align: top;
width: 100%;
height: 100%;
}
.ci-form__subtitle {
margin-bottom: 1em;
}
@media (max-width: 550px) {
.ci-form__subtitle {
text-align: center;
}
}
@media (max-width: 768px) {
.ci-form .ci-btn[type=submit] {
margin-left: auto;
/*margin-right: auto;*/
}
}
.ci-form label.error {
color: #f2571d;
font-size: 13px;
display: block;
margin: 8px 0 -10px;
}
.ci-form .form-captcha-input + label.error {
margin: 0 15px;
}
.ci-form .fluid-field .valid,
.ci-form .field .valid {
display: block;
position: relative;
top: initial;
right: initial;
}
.ci-form__success {
color: #939c3e;
display: none;
}
.ci-form__factor {
padding: 23px 0 26px;
}
@media (max-width: 650px) {
.ci-form__factor {
padding: 16px 0 20px;
}
}
.ci-form__factor:not(:last-child) {
border-bottom: 1px solid #ede7e0;
}
@media (max-width: 768px) {
.ci-form__factor:not(:last-child) {
border-bottom-color: #cccccc;
}
}
.ci-form__factor__name {
margin-bottom: 27px;
font-weight: bold;
}
@media (max-width: 768px) {
.ci-form__factor__name {
margin-bottom: 20px;
}
}
@media (max-width: 650px) {
.ci-form__factor__name {
margin-bottom: 18px;
text-transform: uppercase;
}
}
@media (max-width: 400px) {
.ci-form__factor__name {
font-size: 13px;
}
}
.ci-form__factor-value {
display: flex;
position: relative;
width: 208px;
}
@media (max-width: 650px) {
.ci-form__factor-value {
margin: auto;
}
}
.ci-form__factor-value:before {
content: "";
display: block;
position: absolute;
height: 5px;
width: calc(100% - 16px);
left: 8px;
top: 50%;
transform: translateY(-50%);
background-color: #97bbb3;
}
.ci-form__factor-value__mark {
display: flex;
align-items: center;
justify-content: center;
background-color: #97bbb3;
border: solid 1px #f8f4ef;
width: 16px;
height: 16px;
border-radius: 50%;
box-sizing: border-box;
padding-top: 2px;
position: relative;
cursor: pointer;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-form__factor-value__mark:not(:last-child) {
margin-right: 32px;
}
.ci-form__factor-value__mark span {
font-size: 10px;
color: #fff;
font-weight: 400;
}
.ci-form__factor-value__mark:hover,
.ci-form__factor-value__mark.ci-form__factor-value__mark--selected {
transform: scale(2);
background-color: #ffbb00;
}
.ci-form__close {
position: absolute;
top: 12px;
right: 12px;
width: 12px;
height: 12px;
background: url(/img/svg/catalog/close.svg) center no-repeat;
background-size: contain;
opacity: 0.4;
cursor: pointer;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-form__close:hover {
opacity: 0.6;
}
.add-comment-block.main {
padding: 10px 10px 5px;
border-radius: 5px;
box-shadow: none;
}
@media (max-width: 768px) {
.add-comment-block.main {
padding: 5px 0 5px;
}
}
.ci-review-reply-form__container {
margin-bottom: 15px;
}
.ci-form .fluid-field input {
height: 40px;
padding: 6px 20px 2px;
box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, 0.1);
border: solid 1px #e5e5e5;
}
.ci-form .fluid-field textarea {
box-shadow: inset 0 2px 2px 0 rgba(0, 0, 0, 0.1);
border: solid 1px #e5e5e5;
padding: 14px 11px;
min-height: 100px;
margin-bottom: 0;
}
.ci-form .form-row {
padding-bottom: 20px;
width: 100%;
}
.ci-form .form-captcha {
margin-bottom: 4px;
}
.ci-form .fluid-field .form-captcha-reset {
margin-right: 18px;
}
.ci-form .fluid-field .form-captcha-input {
width: 180px;
}
@media (max-width: 550px) {
.ci-form .fluid-field .form-captcha-input {
width: 126px;
}
}
@media (max-width: 550px) {
.ci-form .fluid-field .form-captcha-pic {
margin: 8px 0;
}
}
@media (min-width: 550px) {
.form-row-double {
display: flex;
}
}
.form-row-double .fluid-field {
width: calc(50% - 10px);
display: inline-block;
}
@media (max-width: 550px) {
.form-row-double .fluid-field {
width: 100%;
}
.form-row-double .fluid-field + .fluid-field {
margin-top: 20px;
}
}
@media (min-width: 550px) {
.form-row-double .fluid-field + .fluid-field {
margin-left: 20px;
}
}
.checkbox-field {
position: relative;
}
.checkbox-field input[type=checkbox] {
display: none;
}
.checkbox-field input[type=checkbox] + .pseudo-checkbox {
display: inline-block;
left: 0;
position: absolute;
width: 18px;
height: 18px;
border-radius: 2px;
box-shadow: inset 0 2px 0 0 rgba(0, 0, 0, 0.04);
border: solid 1px #e5e5e5;
background-color: #fff;
margin: 0 !important;
box-sizing: border-box;
top: 0;
}
.checkbox-field input[type=checkbox]:checked + .pseudo-checkbox {
background-image: url('/img/svg/catalog/check.svg');
background-position: 50% 50%;
background-repeat: no-repeat;
}
.checkbox-field input[type=checkbox] ~ label {
margin-left: 30px;
padding-top: 4px;
font-size: 13px;
cursor: pointer;
color: #7b7676;
letter-spacing: -0.3px;
line-height: normal;
}
/* Add new review form
*********************/
.ci-add-review-form h2 {
margin: 0 0 0.5em;
line-height: 1.3;
}
@media (max-width: 650px) {
.ci-add-review-form h2 {
text-align: center;
}
}
.ci-add-review-form__container {
margin-top: 15px;
border-radius: 5px;
position: relative;
}
@media (max-width: 550px) {
.ci-add-review-form__container {
margin-bottom: 10px;
}
}
.ci-add-review-form__content {
margin-top: 20px;
border-top: 1px solid #ede7e0;
border-bottom: 1px solid #ede7e0;
align-items: stretch;
margin-bottom: 30px;
}
@media (max-width: 650px) {
.ci-add-review-form__content {
flex-direction: column;
align-items: flex-start;
margin-bottom: 20px;
border-color: #cccccc;
}
}
.ci-add-review-form__main {
padding: 25px 30px 0 0;
border-right: 1px solid #ede7e0;
width: 590px;
}
@media (max-width: 768px) {
.ci-add-review-form__main {
padding-right: 25px;
}
}
@media (max-width: 650px) {
.ci-add-review-form__main {
box-sizing: border-box;
width: 100%;
padding: 20px 0 4px;
border-right: none;
border-top: 1px solid #ede7e0;
}
}
.ci-add-review-form__opinion {
padding: 25px 30px;
box-sizing: border-box;
}
@media (max-width: 768px) {
.ci-add-review-form__opinion {
padding: 25px 25px 5px;
}
}
@media (max-width: 650px) {
.ci-add-review-form__opinion {
padding: 0 0 5px;
width: 100%;
text-align: center;
border-top: 1px solid #ccc;
}
}
.ci-add-review-form__opinion__title {
text-transform: uppercase;
font-size: 18px;
line-height: 1.5;
font-weight: bold;
}
@media (max-width: 650px) {
.ci-add-review-form__opinion__title {
display: none;
}
}
.ci-add-review-form__bottom .checkbox-field {
margin-right: 15px;
}
@media (max-width: 650px) {
.ci-add-review-form__bottom {
flex-direction: column;
align-items: flex-start;
}
.ci-add-review-form__bottom .checkbox-field {
margin-bottom: 20px;
margin-left: auto;
margin-right: auto;
}
}
@media (max-width: 650px) {
.ci-add-review-form__rating {
text-align: center;
}
}
@media (max-width: 400px) {
.ci-add-review-form__rating {
display: flex;
flex-direction: column-reverse;
align-items: center;
}
}
.ci-add-review-form__rating .stars {
display: inline-block;
}
.ci-add-review-form__rating > label {
line-height: 24px;
display: inline;
}
.ci-add-review-form__rating > label:after {
content: " *";
color: #ee6b3f;
}
.ci-add-review-form__rating .rating-stars-input {
display: block!important;
position: absolute;
z-index: -1;
opacity: 0;
}
.ci-add-review-form__rating .br-wrapper {
display: inline-block;
margin-right: 10px;
vertical-align: middle;
}
@media (max-width: 400px) {
.ci-add-review-form__rating .br-wrapper {
margin: 8px 0 2px;
}
}
.ci-add-review-form__rating + label.error {
margin: -12px 0 12px;
}
@media (max-width: 650px) {
.ci-add-review-form__rating + label.error {
text-align: center;
margin: -14px 0 12px;
}
}
@media (max-width: 650px) {
.ci-add-review-form .ci-form__ohana {
text-align: center;
}
}
.ci-add-review-form .ci-form__ohana > span {
padding-top: 3px;
}
.ci-add-review-form .ci-form__ohana .ci-ohana {
display: inline-block;
margin-left: 6px;
}
.ci-add-review-form .ci-form__ohana .ci-ohana__mess {
font-size: 15px;
font-weight: normal;
}
@media (max-width: 768px) {
.ci-add-review-form .ci-form__file {
padding-bottom: 0;
}
}
@media (max-width: 650px) {
.ci-add-review-form .ci-form__file {
padding-top: 16px;
border-top: 1px solid #ccc;
}
}
.ci-add-review-form .ci-form__file__title {
text-transform: uppercase;
font-weight: bold;
margin-bottom: 10px;
text-align: center;
}
@media (min-width: 651px) {
.ci-add-review-form .ci-form__file__title {
display: none;
}
}
@media (max-width: 400px) {
.ci-add-review-form .ci-form__file__title {
font-style: 13px;
}
}
@media (max-width: 768px) {
.ci-add-review-form .add-comment-files {
margin: 0;
}
}
@media (max-width: 650px) {
.ci-add-review-form .add-comment-files {
text-align: center;
}
}
.ci-add-review-form__close-mobile {
margin: 20px auto 0;
line-height: 1.1;
}
@media (min-width: 550px) {
.ci-add-review-form__close-mobile {
display: none;
}
}
@media (max-width: 550px) {
.ci-add-review-form button[type=submit] {
margin: 0 auto 4px;
}
}
.ci-report-form {
width: 100%;
}
.ci-report-form__container {
display: none;
margin-top: 14px;
}
.ci-report-form .ci-btn {
min-height: 40px;
width: 150px;
margin-left: 23px;
}
.ci-report-form .fluid-field {
width: calc(100% - 170px);
}
.ci-select {
min-height: 200px;
}
.selectric-ci-select .selectric {
min-width: 200px;
border-radius: 3px;
box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.04);
border: solid 1px #e5e5e5;
background: #fff;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.selectric-ci-select .selectric .label {
height: 37px;
line-height: 35px;
font-weight: 400;
color: #474243;
padding: 3px 15px 2px;
box-sizing: border-box;
}
.selectric-ci-select .selectric .label.rating {
display: flex;
align-items: center;
}
.selectric-ci-select .selectric .button:after {
border-top-color: #474243 !important;
}
.selectric-ci-select .selectric-items ul,
.selectric-ci-select .selectric-items li {
font-size: 15px;
}
.selectric-ci-select .selectric-items {
box-shadow: 0 0 12px -6px #000;
border: none;
background: #fff;
}
.selectric-ci-select .selectric-items li:hover,
.selectric-ci-select .selectric-items li.highlighted {
background: #f7f7f7bf;
}
.ci-section_bottom {
margin: 46px auto 10px;
}
@media (max-width: 768px) {
.ci-section_bottom {
margin-top: 38px;
}
}
.ci-section_bottom .botSub {
margin-bottom: 62px;
}
@media (max-width: 768px) {
.ci-section_bottom .botSub {
margin-bottom: 38px;
}
}
@media (max-width: 550px) {
.ci-section_bottom .botSub {
margin-bottom: 28px;
}
}
.ci-section_bottom .bsTxt p {
margin-bottom: 0;
}
/*********Running slider line for active item of menu************/
.magic-slider-line {
left: 0;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
-webkit-transform-origin: left;
-webkit-transition: -webkit-transform 0.4s;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform-style: preserve-3d;
height: 4px;
background: #ffbb00;
transition: transform 0.4s, -webkit-transform 0.4s;
width: 1px !important;
position: absolute;
-ms-transform-origin: left;
transform-origin: left;
transform-style: preserve-3d;
will-change: transform;
bottom: 0;
right: 0;
}
.icon-like {
cursor: pointer;
}
.icon-like:before {
content: "";
display: block;
position: relative;
background-image: url('/img/svg/catalog/like-gray.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
width: 16px;
height: 20px;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.icon-like:hover:before,
.icon-like--active:before {
background-image: url('/img/svg/catalog/like-red.svg');
}
/* share block
***************/
.ci-share-block--modal {
border-radius: 28.5px;
box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.2);
background-color: #ffffff;
border: solid 1px #e5e5e5;
padding: 12px 7px;
}
.ci-share-list {
display: flex;
}
.ci-share-item {
width: 36px;
height: 36px;
background-size: contain;
background-position: center;
margin: 0 6px;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-share-item:hover {
opacity: 0.85;
}
.ci-share-item--vk {
background-image: url('/img/svg/catalog/vkontakte.svg');
}
.ci-share-item--fb {
background-image: url('/img/svg/catalog/facebook.svg');
}
.ci-share-item--twitter {
background-image: url('/img/svg/catalog/twitter.svg');
}
.ci-share-item--google {
background-image: url('/img/svg/catalog/google.svg');
}
.ci-share-item--ok {
background-image: url('/img/svg/catalog/odnoklassniki.svg');
}
.ci-share-item--telegram {
background-image: url('/img/svg/catalog/telegram.svg');
}
/*------------------------------------------------------------------------------------------- */
/*-------------------------------- 4fresh catalog list item ------------------------------- */
/*------------------------------------------------------------------------------------------- */
.ci-list-item {
display: flex;
flex-direction: column;
align-items: center;
}
.ci-list-item__name {
font-size: 18px;
line-height: 1.33;
text-align: center;
margin-bottom: 24px;
}
.ci-list-item__name span {
border-bottom: 1px solid #e5e5e5;
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.ci-list-item__name:hover {
color: #f15722;
}
.ci-list-item__name:hover span {
border-bottom: 1px solid #ee6b3f;
}
.ci-list-item .ci-action--favourite {
width: 30px;
height: 30px;
border: solid 1px #e5e5e5 !important;
border-radius: 50%;
margin-left: 0;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
@media (min-width: 769px) {
.ci-list-item .ci-action--favourite {
position: absolute;
left: -45px;
}
.ci-list-item .ci-action--favourite:not(.ci-action--favourite--active) {
opacity: 0;
}
}
.ci-list-item .ci-action--favourite:before {
position: relative;
left: initial;
transform: none;
top: initial;
width: 16px;
height: 20px;
}
.ci-list-item .ci-action--favourite--active {
background-color: #fff0cb;
border-color: #fff0cb !important;
animation: pulseBackCircle 1.3s;
}
.ci-list-item:hover .ci-action--favourite {
opacity: 1;
}
.ci-list-item > * {
position: relative;
}
.ci-list-item .ci-size {
position: absolute;
left: 100%;
margin-left: 10px;
padding-top: 2px;
}
.ci-list-item__price {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 10px;
}
.ci-list-item__price:not(.active) {
display: none;
}
.ci-list-item__price-row {
display: flex;
align-items: baseline;
position: relative;
}
.ci-list-item__sign {
font-size: 14px;
text-align: center;
letter-spacing: -0.5px;
color: #474243;
font-weight: bold;
margin-top: 12px;
position: absolute;
bottom: -25px;
}
@media (min-width: 769px) {
.ci-list-item__sign {
position: absolute;
bottom: -25px;
}
}
.ci-list-item__rating {
position: relative;
}
.ci-list-item .ci-related-item__reviews-count {
position: absolute;
right: -20px;
top: 0;
}
.ci-list-item .ci-actual-price {
margin-right: 0;
margin-bottom: 10px;
}
.ci-list-item .ci-old-price {
margin-right: 0;
}
.ci-list-item__rating-row {
margin-bottom: 15px;
}
.ci-list-item__photo {
height: 200px;
margin-bottom: 12px;
}
.ci-list-item__photo > a {
width: 100%;
height: 100%;
}
.ci-list-item__photo__item:not(.active) {
display: none;
}
@media (min-width: 992px) {
.ci-list-item .hover-bg {
border-radius: 3px;
box-shadow: 0 2px 13px 0 rgba(0, 0, 0, 0.1);
top: -20px;
}
}
.ci-list-item .ci-waiting {
align-items: center;
}
.ci-list-item .ci-waiting__title {
font-size: 14px;
}
.ci-list-item .ci-waiting__term {
margin-top: 0;
}
.ci-list-item .ci-price-choice + .ci-list-item__price-info .ci-waiting {
margin-top: 6px;
}
.ci-list-item .ci-waiting__link {
margin-bottom: 5px;
}
.ci-list-item__main {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
}
.ci-list-item__control--mob {
order: 5;
width: 100%;
}
@media (min-width: 769px) {
.ci-list-item__control--mob {
display: none;
}
}
.ci-list-item .ci-price-choice--min .ci-price-choice__item {
padding: 6px 7px 3px;
border-width: 0;
}
.ci-list-item .ci-price-choice--min .ci-price-choice__item__size {
font-size: 14px;
border-bottom: dashed 1px #c8d9d5;
color: #6b998f;
}
.ci-list-item__price-info {
width: 100%;
}
@media (min-width: 769px) {
.ci-list-item__price-info {
display: flex;
flex-direction: column;
align-items: center;
}
}
.ci-list-item__price-info__item {
display: flex;
flex-direction: column;
align-items: center;
}
@media (min-width: 769px) {
.ci-list-item__price-info__item {
display: flex;
flex-direction: column;
align-items: center;
}
}
.ci-list-item__price-info__item:not(.active) {
display: none;
}
.ci-list-item__rating__reviews-link {
color: #949a45;
}
@media (min-width: 769px) {
.ci-list-item__rating__reviews-link {
display: none;
}
}
.ci-list-item__control-hover {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 16px;
}
@media (min-width: 769px) {
.ci-list-item__control-hover {
position: absolute;
top: 100%;
}
}
@media (min-width: 769px) {
.ci-list-item__control-hover .ci-action--favourite {
display: none;
}
}
.ci-list-item__control-hover .ci-waiting__link {
margin-top: 4px;
}
@media (min-width: 769px) {
.ci-list-item:not(:hover) .ci-list-item__control-hover {
display: none;
}
}
@media (max-width: 768px) {
.ci-list-item {
width: calc(50% - 20px);
margin-left: 10px!important;
margin-right: 10px!important;
padding-left: 5px!important;
padding-right: 5px!important;
flex-direction: row;
flex-wrap: wrap;
align-content: flex-start;
-ms-align-items: flex-start;
align-items: flex-start;
padding-bottom: 10px!important;
margin-bottom: 20px!important;
justify-content: flex-start;
border-bottom: 1px solid #eeeeee;
}
.ci-list-item .hover-bg {
display: none!important;
}
.ci-list-item__name {
order: 1;
width: 100%;
font-weight: 400;
text-align: left;
margin-bottom: 0.3em;
}
.ci-list-item__name span {
border-bottom: none;
}
.ci-list-item__rating {
display: flex;
width: 155px;
}
.ci-list-item__rating-row {
order: 2;
width: 100%;
}
.ci-list-item__rating-row .ci-action--favourite {
display: none;
}
.ci-list-item__rating-row .ci-related-item__reviews-count {
position: relative;
right: 0;
}
.ci-list-item__photo {
order: 3;
width: 50%;
border: solid 1px #f4f4f4;
width: 135px !important;
height: 135px !important;
margin-right: 20px;
box-sizing: border-box;
}
.ci-list-item__sign {
color: #8b8b8b;
font-size: 12px;
margin-top: 8px;
position: relative;
bottom: initial;
display: inline-block;
}
.ci-list-item .ci-price-choice {
order: 1;
margin-bottom: 14px;
}
.ci-list-item .ci-action--favourite {
margin: 0!important;
flex-shrink: 0;
}
.ci-list-item .ci-waiting {
margin-top: 0;
margin-bottom: 12px;
text-align: left;
-ms-align-items: flex-start;
align-items: flex-start;
}
.ci-list-item .ci-size {
position: relative;
margin-left: 0;
margin-bottom: 10px;
align-items: flex-start;
left: initial;
}
.ci-list-item__price-row {
flex-direction: column-reverse;
}
.ci-list-item__price-info {
order: 3;
}
.ci-list-item__price {
order: 2;
-ms-align-items: flex-start;
align-items: flex-start;
}
.ci-list-item__main {
order: 5;
width: calc(100% - 155px);
align-items: flex-start;
}
.ci-list-item__control-hover {
margin-top: 8px;
-ms-align-items: flex-start;
align-items: flex-start;
}
.ci-list-item__price-info__item {
-ms-align-items: flex-start;
align-items: flex-start;
}
.ci-list-item .ci-price-choice__item:first-child {
margin-left: 0;
}
.ci-list-item .ci-price-choice--min .ci-price-choice__item {
border-width: 0!important;
}
.ci-list-item .ci-price-choice--min .ci-price-choice__item__size {
font-weight: 400;
}
.ci-list-item a.ci-btn--catalog,
.ci-list-item .ci-btn--catalog {
width: calc(100% - 42px);
margin-right: 16px;
height: 36px;
line-height: 36px;
box-sizing: border-box;
white-space: nowrap;
font-size: 14px;
font-weight: 900;
padding: 2px 0 0;
max-width: 150px;
min-width: 90px;
}
.ci-waiting__link {
white-space: normal;
margin-right: 12px;
}
}
@media (max-width: 768px) and (max-width: 600px) {
.ci-list-item {
width: 100%;
}
}
@media (max-width: 768px) and (max-width: 650px) {
.ci-list-item__rating {
width: 134px;
}
}
@media (max-width: 768px) and (max-width: 650px) {
.ci-list-item__photo {
width: 130px !important;
height: 130px !important;
margin-right: 14px;
}
}
@media (max-width: 768px) and (max-width: 650px) {
.ci-list-item__main {
width: calc(100% - 145px);
}
}
@media (max-width: 600px) {
.ci-list-item__name {
margin-bottom: 0.5em;
}
}
.ci-list {
display: flex;
flex-wrap: wrap;
}
.m-input--br,
.typical-form .m-input--br {
border-radius: 3px;
box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.1) !important;
background-color: #ffffff;
border: none!important;
}
.m-input--br,
.typical-form .m-input--br::placeholder{
color: #999999;
opacity: 1; /* Firefox */
}
.m-input--br,
.typical-form .m-input--br:-ms-input-placeholder{
color: #999999;
}
.m-input--br,
.typical-form .m-input--br::-ms-input-placeholder{
color: #999999;
}
.m-input--wh,
.typical-form .m-input--wh {
border-radius: 3px;
box-shadow: inset 0 2px 0 0 rgba(0, 0, 0, 0.04) !important;
border: solid 1px #e5e5e5 !important;
background-color: #ffffff;
}
.typical-form input.m-input--wh,
input.m-input--wh,
.typical-form input.m-input--br,
input.m-input--br {
height: 40px;
padding: 7px 15px 2px;
}
.typical-form textarea.m-input--wh,
textarea.m-input--wh,
.typical-form textarea.m-input--br,
textarea.m-input--br {
padding: 15px 15px 12px;
}
.search-results-form {
padding: 0 20px;
margin-bottom: 30px;
}
.search-results-form .btn-red-with-coner {
margin: 0;
width: 100%;
}
.search-results-form .example {
padding: 0;
margin: 15px 0;
}
.search-results-form .example a {
border-bottom-style: solid;
}
#topBigSearchField {
padding: 7px 10px 7px 30px;
width: 100%;
height: 100%;
box-sizing: border-box;
background: #fff url(/img/search-top-panel.png) no-repeat 8px 50%;
}
#topBigSearchPopup {
box-sizing: border-box;
position: absolute;
left: 15px;
right: 15px;
top: 30px;
background: #fff;
z-index: 60;
line-height: 18px;
border-radius: 0px 0px 3px 3px;
}
#topBigSearchPopup .svgLoader {
height: 60px;
display: block;
position: relative;
width: 100%;
}
#topBigSearchPopup section {
margin: 0px 0px 15px;
}
#topBigSearchPopup .title {
line-height: 18px;
font-weight: bold;
color: #f26a36;
text-transform: uppercase;
padding: 0px 0px 10px;
}
#topBigSearchPopup .tbl {
display: table;
width: 100%;
border-collapse: collapse;
}
#topBigSearchPopup .tbl-row {
display: table-row;
}
#topBigSearchPopup .tbl-cell {
display: table-cell;
vertical-align: top;
padding: 0px 0px 8px;
}
#topBigSearchPopup .lbl {
font-weight: bold;
padding-right: 10px;
color: #000;
}
#topBigSearchPopup a > span {
font-size: 9px;
}
#topBigSearchPopup a > span > span {
font-size: 14px;
}
#topBigSearchPopup .link a > span {
color: #646464;
border-bottom: 1px solid #dcdcdc;
}
#topBigSearchPopup a:hover > span {
border-bottom: none;
}
#topBigSearchPopup .banner {
margin: 0px 0px 20px;
}
#topBigSearchPopup .banner img {
display: block;
margin: 0 auto;
}
#topBigSearchPopup .recomended {
border-bottom: solid 1px #cbcbcb;
width: 204px;
margin-bottom: 25px !important;
}
#topBigSearchPopup .recomended .title {
padding-bottom: 0px;
}
#topBigSearchPopup .recomended .item {
border-top: solid 1px #e5e5e5;
padding: 15px 0px;
}
#topBigSearchPopup .recomended .item:first-child {
border: none;
}
#topBigSearchPopup .recomended .name {
padding: 0px 0px 5px;
}
#topBigSearchPopup .recomended .price {
float: left;
font-size: 15px;
font-weight: bold;
color: #000;
margin: 0px 5px 0px 0px;
}
#topBigSearchPopup .recomended .vol {
position: relative;
top: 3px;
float: left;
font-size: 10px;
color: #000;
line-height: 12px;
padding: 0px 0px 0px 12px;
background: url(../img/crumbs-bullet.png) no-repeat 0% 50%;
margin: 0px 3px 0px 0px;
}
#topBigSearchPopup .recomended .art {
float: right;
font-size: 11px;
}
.title-page .addl-links .link a:hover span {
border-color: transparent;
}
.title-page {
padding-top: 10px;
}
.brand-card-block .title-page.fixationobject.fixed {
position: fixed;
top: 0;
background: #fff;
z-index: 13;
padding: 15px 0 15px;
margin-left: 0;
width: 968px;
box-shadow: 0px -11px 20px -15px #888;
border-radius: 3px;
}
@media (max-width: 991px) {
.brand-card-block .title-page.fixationobject.fixed {
top: 40px;
}
}
@media (max-width: 767px) {
.search-results-form .btn-red-with-coner, #topBigSearchField {
margin-bottom: 20px;
}
.brand-card-block .title-page.fixationobject.fixed {
position: relative;
}
}
.title-page .subcaption {
display: inline-block;
margin-right: 20px;
}
.expanded-tabs-block .col {
width: auto;
}
.galcolumn {
padding-bottom: 30px !important;
}
.promo_block {
margin-top: 20px;
}
.promo_block .brand-head-img {
width: 100%;
height: auto;
}
@media (max-width: 550px) {
.promo_block .brand-head-img {
margin: 0 auto 14px;
}
}
.brand-card-video__wrap {
border-bottom: solid 1px #cbcbcb;
padding: 0 15px 30px;
margin: -15px 0 40px;
}
.brand-card-video__container {
max-width: 800px;
margin: 0 auto;
}
.brand-card-video__container > div {
padding: 56.25% 0 0 0;
position: relative;
}
.brand-card-video__container > div > iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media (max-width: 550px) {
.brand-card-video__wrap {
margin: -20px 0 35px;
padding: 0 0 25px;
}
}
/* brand-page-history */
.brand-page-history {
margin-bottom: 52px;
border-bottom: 1px solid #dddddd;
padding-bottom: 30px;
}
.brand-page-history h2 {
margin-bottom: 0.75em;
}
.brand-page-history > .brand-description {
font-size: 14px;
max-width: 700px;
margin: 0 auto;
text-align: center;
margin-bottom: 40px;
}
.brand-page-history .timeline {
display: flex;
justify-content: space-between;
margin: 0 auto 40px;
position: relative;
}
.brand-page-history .timeline:before {
content: "";
position: absolute;
display: block;
height: 6px;
border-radius: 3px;
background-color: #e1ebe9;
left: 50px;
right: 0;
top: 34px;
}
.brand-page-history .timeline > .point {
cursor: pointer;
display: flex;
align-items: center;
flex-direction: column;
text-align: center;
max-width: 140px;
margin-right: 20px;
color: #474243;
}
.brand-page-history .timeline > .point:hover {
color: #ee6b3f;
}
.brand-page-history .timeline > .point > .year {
font-size: 18px;
position: relative;
margin-bottom: 32px;
line-height: 19px;
font-weight: bold;
}
.brand-page-history .timeline > .point:first-child > .year:before {
content: "";
display: block;
position: absolute;
height: 6px;
background-color: #fff;
left: -40px;
width: 60px;
top: 34px;
}
.brand-page-history .timeline > .point > .year:after {
content: "";
position: absolute;
display: block;
width: 14px;
height: 14px;
border-radius: 50%;
border: 4px solid #fff;
top: 26px;
background-color: #e1ebe9;
left: 50%;
transform: translateX(-50%);
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
}
.brand-page-history h5 {
font-size: 24px;
font-weight: 900;
letter-spacing: -0.5px;
margin-bottom: 10px;
margin-top: 10px;
color: #474243;
}
.brand-page-history .block-img .year,
.brand-page-history .block-img-half .year,
.brand-page-history .block-text .year {
font-size: 24px;
color: #ee6b3f;
margin-bottom: 8px;
}
.brand-page-history .block-img .text {
max-width: 700px;
font-size: 14px;
}
.brand-page-history .block-img .content {
padding: 25px;
max-width: 500px;
width: 50%;
border-radius: 5px;
background-color: #ffffff;
z-index: 1;
position: absolute;
bottom: 40px;
left: 50px;
/*margin-bottom: 35px;*/
}
.brand-page-history .block-img .content.right {
bottom: 40px;
right: 50px;
left: auto;
}
.brand-page-history .block-img .content p:not(:last-child) {
margin-bottom: 0.8em;
}
.brand-page-history .history-grid {
display: flex;
flex-wrap: wrap;
}
.brand-page-history .block-img {
align-items: flex-end;
display: flex;
width: 100%;
/* margin-bottom: 10px; */
/* flex-direction: column; */
/*padding: 35px 25px;*/
box-sizing: border-box;
justify-content: space-between;
line-height: 1.1;
min-height: 420px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
border-radius: 5px;
/* justify-content: flex-end; */
overflow: hidden;
position: relative;
border-radius: 5px;
margin-bottom: 35px;
}
.brand-page-history p:not(:last-child) {
margin-bottom: 0.8em;
}
.brand-page-history .block-text .content {
margin: auto;
}
.brand-page-history .content {
font-size: 14px;
width: 700px;
}
.brand-page-history .block-text {
width: 100%;
text-align: center;
margin: 0 auto 35px;
font-size: 14px;
/*padding: 35px 25px;*/
line-height: 1.1;
}
.brand-page-history .block-img img,
.brand-page-history .block-img-half img {
display: block;
border-radius: 5px;
}
.brand-page-history .block-img img {
width: 100vw;
min-height: 420px;
height: 420px;
object-fit: cover;
}
.brand-page-history .block-img-half img {
width: 100%;
/*min-height: 420px;*/
/*height: 420px;*/
object-fit: cover;
}
.brand-page-history .block-img-half {
width: 50%;
overflow: hidden;
border-radius: 5px;
}
.brand-page-history .block-img-half {
display: flex;
width: 100%;
margin-bottom: 35px;
flex-direction: column;
padding: 0 25px;
box-sizing: border-box;
justify-content: space-between;
line-height: 1.1;
align-items: flex-end;
padding-left: 0;
flex: 1;
}
.brand-page-history .block-img-half.right {
align-items: flex-start;
padding-right: 0;
padding-left: 25px;
}
.brand-page-history .block-img-half .content {
max-width: 435px;
padding-bottom: 20px;
}
.br-quest-add .success-message {
color: #090;
display: none;
}
@media (max-width: 950px) {
.brand-page-history .content {
width: 100%;
}
}
@media (max-width: 768px) {
.brand-page-history .block-img {
padding-right: 30%;
min-height: 360px;
}
.brand-page-history .block-img img {
min-width: 100vw;
min-height: 360px;
height: 360px;
}
.brand-page-history .block-img .content {
padding: 20px;
width: 65%;
padding-left: 15px;
bottom: 25px;
left: 25px;
}
.brand-page-history .block-img .content.right {
bottom: 25px;
left: auto;
right: 25px;
}
}
@media (max-width: 550px) {
.brand-page-history .timeline {
display: none;
}
.brand-page-history .block-img {
display: block;
width: auto;
margin-left: -15px;
overflow: visible;
border-radius: 0;
padding-top: 0;
margin-top: 10px;
}
.brand-page-history .block-img img {
min-height: 230px;
max-height: 230px;
height: 230px;
position: static;
border-radius: 0;
}
.brand-page-history .block-img-half img {
min-height: 230px;
max-height: 230px;
height: 230px;
position: static;
border-radius: 0;
}
.brand-page-history .block-img .content {
position: static;
width: calc(100% - 30px);
}
.brand-page-history .block-text {
text-align: left;
padding: 0;
}
.brand-page-history .block-img-half {
flex: none;
margin-left: -15px;
padding: 10px 0;
width: calc(100vw);
align-items: flex-start;
}
.brand-page-history .block-img-half .content {
padding-left: 10px;
padding-right: 10px;
}
.brand-page-history .block-img-half.right {
padding-left: 0;
}
}
/* /brand-page-history */
.brand-page .br-catalog header.title-page {
margin-bottom: 20px;
}
.brand-page .br-catalog {
padding-bottom: 0;
}
/* Фильтр каталога */
.sorting-item--brand.dropdown.active {
border: 1px solid #acccc5 !important;
background-color: #e1ebe9 !important;
pointer-events: none;
}
.sorting-item.active {
font-weight: bold !important;
}