/*
Базові листи стилів CSS для використання та підключення на сайті
Набір стилів спрощує багато технічних операцій зі стилями які 
дуже часто використовуються для розробки сайтів.
Автори: Студія дизайну SOLASS
Сайт розробників: https://solass.com.ua/
Версія: 1.0
*/


/* Установки для адаптива */
@media (min-width: 1023px) { }
@media (max-width: 767px) { }

/* ---------------------------------------------------------- */
/* ------------------------Загальні стилі-------------------- */
/* ---------------------------------------------------------- */

@media (max-width: 1023px) {
.tablet-100 { width: 100% !important; }
.tablet-font-80 { font-size: 80%; }
.tablet-font-90 { font-size: 90%; }
}
@media (max-width: 767px) {
.mob-100 { width: 100% !important; }
.mob-font-80 { font-size: 80%; }
.mob-font-90 { font-size: 90%; }
.mob-text-center { 
--content-align: center;
  --text-align: center;
  text-align: var(--text-align);
}
}
:root { 
/*--wd-form-brd-radius: 20px !important;*/ 
--white-hover-color: #fff;
}
.height-100 { height: 100%; } 
.all-div-height-100, .all-div-height-100 > div, .all-div-height-100 > div > div, .all-div-height-100 > div > div > div { height: 100%; } 
.width-100 { width: 100%; } 
.left-0 { left: 0 }
.right-0 { right: 0 }
.top-0 { top: 0 }
.all-width-100, .all-width-100 div, .all-width-100 figure, .all-width-100 a { width: 100%; } 
.width-inherit { width: inherit !important; } 
p:empty { margin: inherit; } /*, p:not([class]):not([style])*/
.z-index--1 { z-index: -1; }
.z-index-0 { z-index: 0; }
.z-index-1 { z-index: 1; }
.z-index-10 { z-index: 10; }
.z-index-100 { z-index: 100; }
.z-index-888 { z-index: 888; }

.nowrap, .no-br { white-space: nowrap; }
.uppercase, .upercase, .text-uppercase { text-transform: uppercase; } 
.position-absolute, .absolute { position: absolute; }
.position-relative, .relative { position: relative; }
.display-none { display: none !important; }
.inline-block { display: inline-block; } 
.table-cell {display: table-cell; }
.title-none h1, .title-none h2, .title-none h3, .title-none h4, .title-none h5, .title-none h6 { display: none !important; }
.display-flex { display: flex; flex-wrap: wrap; } 
.flex-content-center, .flex-content-center .wd-carousel-wrap { justify-content: center; align-items: center; }
.display-initial { display: initial; }
.text-align-center { text-align: center; }
.text-align-center .tagcloud { display: inherit !important; } 
.border-radius-off, .border-radius-off .wpb_video_wrapper, .border-radius-off img, .not-border-radius img, .no-border-radius img, .none-border-radius img { border-radius: 0 !important; } 
.img-border-radius-50 img { border-radius: 50% !important; }
.text-white, .white-text { color: #fff; }
.text-white a, .white-text a, a.text-white, a.white-text { color: #fff; } 
.text-white a:hover, .white-text a:hover, a:hover.text-white, a:hover.white-text { color: var(--white-hover-color); } 
.all-text-white, .all-white-text { color: #fff !important; }
.all-text-white a, .all-white-text a, a.all-text-white, a.all-white-text { color: #fff !important; } 
.icon-text-white a .socials-item-icon, .icon-white-text a .socials-item-icon { color: #fff !important; } 
.overflow-hidden { overflow: hidden; } 
.overflow-y-hidden { overflow-y: hidden; }
.overflow-y { overflow: inherit !important; overflow-y: auto !important; }
.overflow-x, .overflow-x > .vc_tta-panel-body { overflow: inherit !important; overflow-x: auto !important; }
@media (max-width: 767px) {
.overflow-mob-x, .overflow-mob-x > .vc_tta-panel-body { overflow: inherit !important; overflow-x: auto !important; }
}
.tri-tochki {
display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
/*  line-height: 1.2; */
  position: relative;
  top: -0.1em; /*коригування висоти*/
}
.white-vert-gradient { 
	background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); 
}

.all-text-white h1, .all-text-white .title-h1, 
.all-text-white h2, .all-text-white .title-h2, 
.all-text-white h3, .all-text-white .title-h3, 
.all-text-white h4, .all-text-white .title-h4, 
.all-text-white h5, .all-text-white .title-h5, 
.all-white-text h1, .all-white-text .title-h1, 
.all-white-text h2, .all-white-text .title-h2, 
.all-white-text h3, .all-white-text .title-h3, 
.all-white-text h4, .all-white-text .title-h4, 
.all-white-text h5, .all-white-text .title-h5 
{ color: #fff !important; }

.all-text-white .wpcf7 input[type=submit], 
.all-white-text .wpcf7 input[type=submit] {
    color: #fff !important;
    background: transparent;
    border: 3px solid #fff !important;
}
.all-text-white .wpcf7 input[type=submit]:hover, 
.all-white-text .wpcf7 input[type=submit]:hover {
    color: #000 !important;
    background: #fff !important;
}

.text-white-40, .text-white-40 p, .text-white-40 a { color: rgba(256,256,256,0.4); } 
.text-white-50, .text-white-50 p, .text-white-50 a { color: rgba(256,256,256,0.5); } 
.text-white-60, .text-white-60 p, .text-white-60 a { color: rgba(256,256,256,0.6); } 
.text-white-80, .text-white-80 p, .text-white-80 a { color: rgba(256,256,256,0.8); } 
.text-white-40 a:hover, .text-white-50 a:hover, .text-white-60 a:hover, .text-white-80 a:hover { color:  #fff; } 

.luminosity, .lumi, .luminositi { mix-blend-mode: luminosity; } 
.multiply, .multiplay, .maltiplay, .multi { mix-blend-mode: multiply; } 
.opacity-0-3 { opacity: 0.3 }
.opacity-0-5 { opacity: 0.5 }
.opacity-0-7 { opacity: 0.7 } 
.opacity-0-8 { opacity: 0.8 }

.big-font, .big-text, .big-fonts, .font-big, .font-size-big { font-size: 1.2em; }
.small, .font-size-90 { font-size: 90%; }
.font-size-80 { font-size: 80%; }
.font-size-70 { font-size: 70%; }

.margin-top-0 {  margin-top: 0px !important; }
.margin-bottom-0 {  margin-bottom: 0px !important; }
.margin-0 {  margin: 0px !important; }
.margin-auto { margin: 0 auto; }
.margin-left-auto { margin-left: auto; }
.margin-right-auto { margin-right: auto; }
.padding-top-0 {  padding-top: 0px !important; }
.padding-bottom-0 {  padding-bottom: 0px !important; }
.padding-0 {  padding: 0px !important; }
.border-radius-0, .border-radius-0 .vc_single_image-img { border-radius: 0px !important; }
.img-padding-10 img { padding: 10px; }
.img-padding-20 img { padding: 20px; }
.img-padding-30 img { padding: 30px; } 
.height-100px { height: 100px; }
.height-120px { height: 120px; }
.height-150px { height: 150px; }
.height-200px { height: 200px; }
.img-height-100 img { height: 100px; width: auto; }
.img-height-120 img { height: 120px; width: auto; }
.img-height-150 img { height: 150px; width: auto; }
.img-height-200 img { height: 200px; width: auto; }
.max-height-100 *, .max-height-120 *, .max-height-150 *, .max-height-200 * { height: 100%; }
.max-height-100 { height: 100px; }
.max-height-120 { height: 120px; }
.max-height-150 { height: 150px; }
.max-height-200 { height: 200px; }

.margin-top-10 {  margin-top: 10px !important; }
.margin-top-20 {  margin-top: 20px !important; }
.margin-top-30 {  margin-top: 30px !important; }
.margin-top-40 {  margin-top: 40px !important; }
.margin-top-50 {  margin-top: 50px !important; }
.margin-top-70 {  margin-top: 70px !important; }
.margin-bottom-10 {  margin-bottom: 10px !important; }
.margin-bottom-20 {  margin-bottom: 20px !important; }
.margin-bottom-30 {  margin-bottom: 30px !important; }
.margin-bottom-40 {  margin-bottom: 40px !important; }
.margin-bottom-50 {  margin-bottom: 50px !important; }
.margin-bottom-70 {  margin-bottom: 70px !important; }

.max-height-200px, .max-height-200px canvas { max-height: 200px; }
.max-height-300px, .max-height-300px canvas { max-height: 400px; }
.max-height-400px, .max-height-400px canvas { max-height: 400px; }
.max-height-500px, .max-height-500px canvas { max-height: 400px; }

.align-items-baseline, .align-items-baseline li { align-items: baseline !important; }
.align-items-center, .align-items-center li { align-items: center !important; }
.align-center-center {
  align-items: center;
  justify-content: center;
  display: flex;
}
.align-center-left {
  align-items: center;
  display: flex;
}

.img_gray img, .img_gray picture { /*, .img_gray .image*/
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);/**/
filter: grayscale(100%);
filter: gray; /* IE 6-9 */
} 

.box-center-img, .box-center-img-cover { overflow: hidden; display: flex; align-items: center; justify-content: center; }
.box-center-img > img, .box-center-img-cover > img { max-width: 100%; max-height: 100%; object-fit: cover; }
.img-center-contain img { 
	overflow: hidden; 
	display: flex; 
	align-items: center; 
	justify-content: center;
	max-width: 100%; 
	max-height: 100%; 
	object-fit: contain; 
	width: inherit;
}

/* плашка що виділяє текст, можливо для розділів у списку */
.plashka-text {
  background-color: #bbb;
  position: relative;
  padding: 1px 15px 2px 15px;
  border-radius: 5px;
  border-radius: calc(var(--wd-brd-radius));
  color: rgba(256,256,256,1); 
  overflow: hidden;
  z-index: 0;
}
a.plashka-text::after { 
  content: "";
  position: absolute;
  width: 100%; height: 100%;
  top: 0; left: 0;
  background-color: rgba(0,0,0,0.0);
  mix-blend-mode: multiply;
  z-index: -1;
}
a.plashka-text:hover {  color: rgba(256,256,256,1); }
a.plashka-text:hover::after { background-color: rgba(0,0,0,0.1); }

/* ------------------------------------------------ */
/* ---------------- Стилі таблиць ----------------- */
/* ------------------------------------------------ */

.my_table .this-min-width { min-width: 340px; } 
.my_table { margin-bottom: 50px; }
@media (max-width: 768.98px) {
.my_table { margin-bottom: 30px; }
}

body .table-title > .vc_column-inner, 
body .my_table .vc_column-inner { /*, .my-table > .vc_column-inner*/
  border: 2px solid transparent !important;
  padding: 12px 8px;
  background-color: #eeeeee !important;
  border-radius: 10px;
  overflow: hidden;
}
.my_table .vc_column-inner {
  margin: 0px;  /*відступи між ячейками таблиці. Параметр у .my-table table потрібно в 2 рази більше робити */
  display: flex;
  justify-content: center;
}
.my_table .vc_column-inner h6, 
.my_table .vc_row:first-of-type .vc_column-inner {
  font-size: 1em;
  color: var(--wd-title-color);
  font-weight: var(--wd-title-font-weight);
  font-family: var(--wd-title-font);
  line-height: 1.4;
}
.my_table .vc_row:first-of-type .vc_column-inner::before, 
.my_table .vc_row:first-of-type .vc_column-inner::after { 
  content: "" !important;
}
.my_table table, 
.my_table .vc_column-inner {
  /*border-collapse: separate; /* Щоб border-spacing спрацював */
  border-spacing: 0px; /* відступи між ячейками таблиці */ 
}
.my_table th, 
.my_table td { 
  border: 2px solid transparent !important;
  padding: 12px 10px !important;
  background-color: #eeeeee !important;
  border-radius: 0px; 
	
  border-bottom: 4px solid #F16A21 !important;

}
.my_table th, 
.my_table tr:first-of-type td, 
.my_table .vc_row:first-of-type .vc_column-inner {
  color: #000;
}
.my_table th, 
.my_table tr:first-of-type td:not(:last-of-type), 
.my_table .vc_row:first-of-type .vc_column-inner:not(:first-of-type) {
  /*border-left-color: #fff !important;*/
  border-right-color: #fff !important;
}
.my_table th:first-of-type, 
.my_table td:first-of-type {
  border-top-left-radius: 10px; 
}
.my_table th:last-of-type, 
.my_table td:last-of-type {
  border-top-right-radius: 10px;
}

.table-title, .table-title h6, .my_table th {
  font-size: 1em;
  color: var(--wd-title-color);
  font-weight: var(--wd-title-font-weight);
  font-family: var(--wd-title-font);
  line-height: 1.4;
}
body.table-info > .vc_column-inner, 
.my_table- td, 
.my_table tr:not(:first-of-type) td, 
.my_table .vc_row:not(:first-of-type) .vc_column-inner {
  border: 2px dotted #e1e1e1 !important;
  padding: 12px 10px;
  background-color: transparent !important;
  border-radius: 10px !important;
} 
@media (max-width: 768.98px) {
.my_table .vc_column-inner h6, 
.my_table .vc_row:first-of-type .vc_column-inner {
  font-size: 0.9em;
  line-height: 1.2;
}
body.table-info > .vc_column-inner, 
.my_table td, .my_table tr:not(:first-of-type) td, 
.my_table .vc_row:not(:first-of-type) .vc_column-inner {
  font-size: 0.9em;
}
}