/*
Theme Name:   Hydropeptide Child
Theme URI:    https://hydropeptide.ua/
Description:  Дочірня тема для Flatsome. Уся кастомізація магазину живе тут, тому батьківську тему можна оновлювати без втрати правок.
Author:       Hydropeptide
Template:     flatsome
Version:      1.3.0
Text Domain:  hydropeptide-child
*/

/* ==================================================================
   ЧАСТИНА 1 — з flatsome/assets/css/flatsome.css

   Був дописаний у кінець файлу самої Flatsome і зник при оновленні
   теми до 3.20.9: модальне вікно підписки, форма eSputnik, іконки
   оплати, кнопка подарунка.
   ================================================================== */

.btn_load {
	font-size: .85em;
    font-weight: bold;
    text-transform: uppercase;
    background-color: #e47d80;
    color: #f1f1f1;
}
/*.mb-0{
	width:85%;
}*/
.payment-icons {
	width: 125px;
}
@media screen and (min-width:850px) {
	.payment-icons {
	margin-right: 50px;
}
}


.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 99;
  padding: 30px;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  visibility: hidden;
  transition: visibility 0s linear 0.1s,opacity 0.3s ease;
}

.modal.open {
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
}

.modal__overlay {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 21;
  background-color: rgba(0, 0, 0, 0.7);
}

.modal__close {
	position: absolute;
	top: 0;
	right: 0;
	padding: 0;
	border: none;
	outline: none;
	background: none;
	font-size: 24px;
	font-weight: 100;
	color: #ffffff;
	z-index: 1;
}

.modal__close:hover {
  color: #000;
}

.modal__container {
  position: relative;
  z-index: 22;
	width: 100%;
  max-width: 1134px;
  height: 538px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0 auto;
	padding: 0;
  background-color: #fff;
  text-align: center;
}

.modal__container .row {
	height: 100%;
}

.modal__col {
	max-width: 50%;
	justify-content: center;
	align-items: center;
	display: flex;
	flex-direction: column;
	padding: 30px 4%;
	position: relative;
}

.subscribe_title {
	font-style: normal;
	font-weight: 900;
	font-size: 32px;
	line-height: 38px;
	text-align: center;
	color: #000000;
	margin-bottom: 24px;
}

.subscribe_title span {
	color: #60BEC1;
}

.modal__col img {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
	object-fit: cover;
	object-position: center;
  top: 0;
  left: 0;
}

form#subscribe_esputnik_form {
	width: 100%;
	margin: 0;
}

form#subscribe_esputnik_form .checkbox {
	text-align: left;
	margin-bottom: 15px;
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	line-height: 14px;
}

form#subscribe_esputnik_form .checkbox input {
	margin-top: 0;
	margin-right: 3px;
	transform: translateY(2px);
}

form#subscribe_esputnik_form button.button {
	margin: 0!important;
	width: 100%;
	background: #000;
	height: 51px;
	text-transform: none;
}

form#subscribe_esputnik_form input[type="email"] {
	border: 1px solid #DBDBDB;
	box-shadow: none;
	height: 51px;
	line-height: 51px;
	margin-bottom: 24px;
	color: #8B8B8B;
	font-size: 14px;
}

form#subscribe_esputnik_form button.button {
	position: relative;
}

form#subscribe_esputnik_form button.button:before {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	content: '';
	width: 24px;
	height: 24px;
	background: url(./loading.gif);
	background-size: contain;
	background-position: center;
	transition: .3s ease;
	opacity: 0;
}

form#subscribe_esputnik_form.loading button.button:before {
	opacity: 1;
}

button.button span {
	transition: .3s ease;
	opacity: 1;
}

.loading button.button span {
	opacity: 0;
}

ul.subscribe_errors {
	list-style: none;
	margin-top: 15px;
	left: 0;
}

.subscribe_success {
	display: none;
	color: green;
	font-weight: 600;
}

.subscribe_success.show {
	display: block;
}

ul.subscribe_errors li {
	color: red;
	display: none;
	font-weight: 600;
}

ul.subscribe_errors li.show {
	display: block;
}


@media (max-width: 767px) {
	.row-reverse-mobile {
		flex-direction: column-reverse;
	}

	.modal__close {
		margin-right: 16px;
		min-height: unset;
	}

	.modal__col {
		max-width: 100%;
		padding: 20px 16px;
	}

	.subscribe_decore {
		min-height: 196px;
	}

	.subscribe_title {
    font-size: 20px;
		line-height: 1.3;
	}

	.modal__container {
    height: auto;
		max-width: calc(100% - 30px);
	}

}
.single-product .gift-inline {
    display: inline-block;
    margin-left: 15px;
    vertical-align: middle;
}
/* Розовая кнопка под Add to cart в Flatsome */
.cf7-gift-btn {
    background-color: #ffffff !important; /* нежно-розовый */
    color: #000000 !important;            /* белые буквы */
    border: none !important;
    padding: 12px 20px !important;
    width: 100%; /* как у Flatsome, широкая */
    border-radius: 4px; /* мягкие углы */
    transition: 0.25s ease-in-out;
    display: inline-flex;
    align-items: center;
    justify-content: left;
    gap: 7px; /* расстояние между текстом и иконкой */
}

.cf7-gift-btn i {
    color:  #000000 !important;
    font-size: 16px;
}

/* Hover эффект */
.cf7-gift-btn:hover {
    background-color:  #000000 !important; /* чуть темнее розовый */
    color:  #000000 !important;
}


/* ==================================================================
   ЧАСТИНА 2 — з flatsome/style.css бойового сайту

   Другий шар власного CSS, який лежав у корені теки теми. Саме тут:
     .products { width: 85% }         сітка каталогу
     .row.row-small { max-width }     ширина рядків
     .stuck .header-main              липке меню
     .breadcrumbs { display: none }   сховані крихти Flatsome
     .woocommerce-result-count        схований лічильник товарів
   плюс кнопки, навігація, банери категорій і адаптив.

   ЩО ВАРТО ПЕРЕВІРИТИ:
     .category-100 .bg.bg-loaded  посилається на new.hydropeptide.com.ua
     .top-img3                    посилається на hydropeptide.com.ua
     #row-1339312084              привʼязка до конкретного ID рядка;
                                  якщо той рядок перезберегти в UX Builder,
                                  ID зміниться й правило перестане діяти
   ================================================================== */

/*.title-wrapper{
	height:80px;
	display:block;
}*/
.product-main{
	padding-left:7%;
    padding-right:7%;
}
.product_best_sel{
	padding-right:7%;
	padding-left:7%;
}
.row_restor{
	margin-right:0px;
	margin-left:0px;
}
.buttongreen{
	background-color: #62ae5b;
}
span .buttongreen:hover{
 color: #fff;
}
.buttonred{
	background-color:#711e30;
}
.buttonblu{
	background-color:#39AEC2;
}
.buttonrose{
	background-color: #b57b81;
}
span.buttongreen {
	margin-right: 30px;
    margin-left: 30px;
    letter-spacing: 0.2em;
}
.bunnerbutton{
	padding-right:20px;
	padding-left:20px;
	background-color: #711e30
}
.woocommerce-tabs{
	width:85%;
}
.nav-dropdown.nav-dropdown-bold>li.nav-dropdown-col, .nav-dropdown.nav-dropdown-simple>li.nav-dropdown-col {
    border-color: #fff;
}
small{
	margin-bottom: 50px;
}
.bestsel_row{
	padding-right:7%;
	padding-left:7%;
}
@media screen and (max-width: 768px){
	.bestsel_row{
	padding-right:5%;
	padding-left:5%;
	}
}
@media screen and (max-width: 850px){
	a.menu-item-has-children{
		margin-left:50px;
	}
}
@media screen and (max-width: 768px){
	.comment_row{
		width:85%;
	}
}
#row-1339312084{
	width:85%;
}
/*.row .row-small:not(.row-collapse){
	margin-left: 0px;
    margin-right: 0px;
}*/
.category-page-row {
    max-width: 100%;
}
.products {
	width:85%;
}
/*.row .row:not(.row-collapse){
	margin-left: 7%;
    margin-right: 7%;
}*/
/*.has-equal-box-heights{
	padding-top:110px;
}*/
.woocommerce-notices-wrapper{
	position:relative;
}
.woocommerce-ordering{
    position: relative;
    left: 8%;
}
.blogs_post{
	width:85%;
}
.collecton_row{
	width:85%;
}
@media screen and (max-width: 850px){
.collecton_row{
	width:90%;
}
}
.rowacc{
	width:85%;
}
.row_ekspert{
	width:85%;
}
.breadcrumbs {
    display: none;
}
.page-title-inner {
    width: 85%;
}
span.widget-title {
    font-size: 13px;
    font-weight: 800;
    line-height: 25px;
    text-transform: uppercase;
    color: #FFFFFF;
}
a p.textwidget{
color: #4e657b;
    color: #393939;
    font-size: 13px;
    line-height: 20px;
    font-weight: 600;
}
.btn_hollyday{
	color: #ffffff;
    background-color: #e47d80;
    border-color: #e47d80;
}
.row_restorecollection{
	width:95%;
	margin-top:40px;
}
.dark, .dark p, .dark td {
    color: #000;
}
.row.row-small {
    max-width: 100%;
}
.nav-dropdown-default .nav-column li>a, .nav-dropdown.nav-dropdown-default>li>a {
    border-bottom: none;
}
.flex-col .hide-for-medium .flex-left .flex-grow{
	margin-right:200px;
}
.nav>li {
    position: static;
}
.nav-dropdown {
    position: fixed;
    width: 100%;
}
.nav-small.nav>li.html {
    font-size: .65em;
    text-align: center;
}
#logo {
    max-width: calc(100% - 180px);
}
.off-canvas-center .nav-vertical>li>a {
    font-size: 1em;
}
.nav-uppercase>li>a {
     text-transform: none;
}
.off-canvas .nav-vertical>li>a {
     padding-top: 5px;
     padding-bottom: 5px;
}
.dark .is-divider {
    display:none;
}
.dark p, .dark td {
    color: #ffffff;
	font-size: 13px;
}
.large-columns-2{
	max-width:85%;
}
.large-columns-6{
	max-width:85%;
}
.item-language-ru{
	text-align:center;
}
.wc-tabs-wrapper{
	margin-right: 7%;
    margin-left: 7%;
}
@media screen and (max-width: 849px){
	.footer-2 {
    text-align: center;
}
	.footer-1 {
    text-align: center;
}
}
@media screen and (max-width: 767px){
 .banner h2 {
    font-size: 2em;
}
}
@media screen and (max-width: 1390px){
 .banner h5 {
    /*display:none;*/
	 display:none;
}
}
@media screen and (max-width: 767px){
 .banner h2 {
    font-size: 2.5em;
}
}
@media (max-width: 549px){
.is-xxlarge {
    font-size: 1.5em;
}
}
.star-rating span:before {
    color: #94c2e8;
}

@media screen and (min-width: 1325px){
	.nav{
		margin-right:200px;
	}
}
.stuck .header-main .nav > li > a {
	line-height: 30px;}
.category-100 .bg.bg-loaded {
    background-image: url(https://new.hydropeptide.com.ua/wp-content/uploads/2019/12/kyiv2-scaled.jpg);
}
.wishlist-button{
	color:#fff;
}
.category_banner_image{
	position:relative;
}
.term-description{
	position: absolute;
    top: 450px;
    color: #fff;
    font-size: 1.7em;
    line-height: 1.3;
    font-weight: bold;
    padding-left: 12%;
}
@media screen and (min-width: 850px){
	.term-description{
    font-size: 2.4em;
}
}
.woocommerce-result-count{
	display:none;
}
.blog_a{
	color:#7cbbed;
}
.blog_a:hover{
	color:blue;
}
@media screen and (min-width: 1520px){
.top-img2 h1 {
    font-size: 1em;
}
}
@media screen and (min-width: 1100px){
.top-img2 h1 {
    font-size: 1em;
}
}
@media screen and (max-width: 850px){
.top-img2 h1 {
    font-size: 1em;
}
}
@media screen and (max-width: 560px){
.top-img2 h1 {
    font-size: 0.8em;
}
}
.top-img2 h1 {
    color:#fff;
    text-align:center;
	vertical-align:middle;
	line-height:2.5;
}
.top-img3{
	background:url("https://hydropeptide.com.ua/wp-content/uploads/2022/03/ua-glag-1.jpg");
	width:100%;
	height:50px;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
}
@media screen and (max-width: 1260px){
.top-img3 {
  height: 40px;
}
}
@media screen and (max-width: 560px){
.top-img3 {
  height: 33px;
}
}
@media screen and (min-width: 850px) and (max-width: 1260px) {
    .top-img2 h1 {
  line-height:1.5;
}
}
@media screen and (min-width: 768px) and (max-width: 1160px) {
	.comment_row{
		padding-left: 5%;
        padding-right: 5%;
	}
}
/*@media screen and (max-width: 600px) {
	table {width:100%;border-color: #fff;}
	thead {display: none;}
	tr:nth-of-type(2n) {background-color: inherit;}
	tr td:first-child {background: #f0f0f0; font-weight:bold;}
	tr th:first-child {font-weight:bold;}
	tbody td, tbody th {display: block; text-align:center;}
	tbody td, tbody th:before { content: attr(data-th); display: block; text-align:center; }
}*/
@media screen and (max-width: 600px) {
 .table_components tbody td, .table_components tbody th {display: block; text-align:center;}
 .table_components 	tbody td , .table_components tbody th:before { content: attr(data-th); display: block; text-align:center; }
}
.button.alt{
	background-color:#393939;
	border-color: #393939;
}
.button.alt:hover {
    background-color: #008fbe !important;
    border-color: #008fbe;
}
.product-title {
    font-size: 17.76px;
    color: #2e3234;
}
@media screen and (max-width: 767px){
	.product-title{
    text-align: center;
    font-size: 15.6px;
}
	.product-info{
    text-align: center;
    margin-left: 7%;
    margin-right: 7%;
}
	.is-divider{
		display:none;
	}

}
#wpsl-result-list ul {
    margin-left: 7%;
}
.term-description{
text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
             0px 8px 13px rgba(0,0,0,0.1),
             0px 18px 23px rgba(0,0,0,0.1);

}
/*.col-inner{
	padding-right:5px;
}*/
.copyright-footer{
	color:#393939;
}
@media screen and (max-width: 850px){
.row.row-large {
    max-width: 85%;
}
}
.woocommerce-MyAccount-content{
	margin-right:7%;
	margin-left:7%;
}
@media screen and (min-width: 995px) and (max-width: 1120px) {
	.nav>li>a {
    font-size: .8em;
}
.nav-spacing-small>li {
    margin: 0 3.5px;
}
}
@media screen and (min-width: 918px) and (max-width: 995px) {
	.nav>li>a {
    font-size: .7em;
}
.nav-spacing-small>li {
    margin: 0 3.5px;
}
}
@media screen and (min-width: 850px) and (max-width: 918px) {
	.nav>li>a {
    font-size: .6em;
}
.nav-spacing-small>li {
    margin: 0 3.5px;
}
}
.seo-text{
	margin-bottom: 15px;
}
.seo-text h1, .seo-text h2{
	padding-top:10px;
}
.seo-text ul{
    margin-left: 20px;
    padding: 20px 0 0px;
}


/* ==================================================================
   ЧАСТИНА 3 — місце для нових стилів

   Додавайте нижче. Тепер вони переживуть будь-яке оновлення Flatsome.
   ================================================================== */
/*
 * Липке меню: у прилиплому стані Flatsome 3.20.9 не задає фон,
 * і шапка стає прозорою при прокрутці.
 */
.header.has-sticky.stuck .header-wrapper,
.stuck .header-main,
.stuck .header-wrapper {
    background-color: #fff;
}

/*
 * Мегаменю на всю ширину.
 * Було position: fixed — у 3.10 давало випадайку на всю ширину вікна.
 * У 3.20.9 fixed відлічується інакше, і меню зсувається до центру.
 */
.nav > li {
    position: static;
}

.nav-dropdown {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    transform: none;
}   
/*
 * Прелоадер BEAF не ховається після ініціалізації й накриває
 * готовий віджет білим шаром із z-index 9999.
 * Конфлікт відкладеного завантаження зображень.
 */
.bafg-preloader {
    display: none !important;
}