@charset "utf-8";
/* CSS Document */

* {margin: 0; padding: 0;}
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;}

/*-------------------------- ПЕРЕОПРЕДЕЛЯЕМ ЭЛЕМЕНТЫ HTML --------------------------------------*/
body {	background: #F9F9F9;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		color: #001100; font-size:16px;
		text-align: justify;
		word-wrap: break-word; /* перенос длинных слов */
	padding: 0 2%;
		}
h1 {
	font-family: Georgia, "Times New Roman", Times, serif; color:#004D40;
	font-size: 210%;  font-weight: bold;
	text-align: center; vertical-align: middle;
	padding: 5px; margin: 0;
	}
h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 150%;  font-weight: 100;
	text-align: center; vertical-align: middle;
	padding: 5px 15px; margin: 0;
	}
h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 110%; font-weight: 100;
	vertical-align: top;
	margin: 25px 0 10px 0;
	}
table {
		width: 100%;
		margin: auto;				/*выравниваем таблицу по середине html*/
		border-collapse: collapse;	/* Убираем двойные границы между ячейками (cellspacing="0")значение атрибута cellspacing тега <table> игнорируется*/
		border: 0;		/* Рамка вокруг таблицы */
		table-layout: fixed; /* Ячейки фиксированной ширины для ускорения постраения таблиц*/
		}		
		TH {
			padding: 5px;			/* Поля вокруг текста действие атрибута cellpadding тега <table> игнорируется. */
			border: 1px solid #000;	/* Рамка вокруг ячеек */
			text-align:center;
			word-wrap: break-word; /* перенос длинных слов */
   			}
		TD {
			padding: 5px;			/* Поля вокруг текста действие атрибута cellpadding тега <table> игнорируется. */
			border: 1px solid #000;	/* Рамка вокруг ячеек */
			word-wrap: break-word; /* перенос длинных слов */
   			}

.gr {background-color:#C5C1BC;}
.gr1 {background-color:#F4F4F4;}
.gr2 {background-color:#EAEAEA;}

p {padding: 5px 1%;}
.txt {padding: 3% 1%;}
ol, ul {margin-left:5%; padding: 5px;}
li {padding: 0;}

.warnng {font-size: 110%; color: #394F36; margin: 3% 4%; padding: 2% 1%; background: #fff; text-align: center;}
.uper {text-transform: uppercase;}

hr {width: 92%; margin: auto;}
a {
	color:#00695C;
	text-decoration:none;	/*нет нижнего подчеркивания*/
	}
	a:hover {
		text-decoration:underline;	/*при наведении показываем нижнию черту*/
		}

img {display: inline-block; height:100%;}
img.right, img.right1
{
	width:290px; height:200px;
	border: 1px solid #ccc;
	float: right;
	margin-left: 15px;
	padding: 5px;
}

img.left
{
	width:290px; height:200px;
	border: 1px solid #ccc;
	float: left;
	margin-right: 15px;
	padding: 5px;
}
div.video
{
	padding:1% 2%;
}
	/*align
	-----------------------------------------------------------------------------*/
.align-cntr {text-align: center; vertical-align: middle;}
.align-lft {text-align: left; vertical-align: middle;}
.align-rght {text-align: right; vertical-align: middle;}

.ver-align200 {height:200px; display:table-cell; vertical-align:middle;}
.ver-align150 {height:150px; display:table-cell; vertical-align:middle; font-size:110%; padding:5px;}
.ver-align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%; min-height: 150px;
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
	text-align: center;
}

.float-lft {float: left;}
.float-lft-end {clear: left;}
.float-rght {float: right;}
.float-rght-end {clear: right;}

.clssOrng {color:#F00;}
.col20 {width:20%;} .col50 {width:50%;}

.otstup {margin-left:20%;}

.dyslay-non {display:none;}

.begn {width:100%; background-color:#EBF3EB; max-width: 1600px;}

/* Слой для колонок
-----------------------------------------------------------------------------------*/
.layout {overflow: hidden;}
.row150 {height: 150px; overflow: hidden;}

section {margin: 15px 0;}
article {padding: 10px 0;}

.but-katalog {background-color:#FFF; border:#FF0 1px solid; border-radius:15px;}

.polosa {display: inline-block; width:100%; padding: 10px 0; background-color:#394F36; color:#FFF;}

.imgPolosa {width:100%; min-width:290px; height:200px; border:#CCC 1px solid; overflow:hidden;}
.imgBlock {width:290px; height:200px;
	float: left;
	margin-right: 15px;
	padding: 5px;}

.block-border {
	border: 1px solid #7A6850;
	}
.block-right {width: 20%; min-width: 300px; float: right; margin: 10px;}
.block-img {width: 20%; margin: auto;}
/* оформление */
	/* анимация общая */
	.block-hover {overflow: hidden; transition: all 2s ease-out;}
		.block-hover:hover {transform: scale(1.5);}
	/*рамки  ------------------------*/
	.frame-hover {border: 1px solid #7A6850; }
		.frame-hover:hover {box-shadow: 0 0 10px rgba(0,0,0,0.6);}
	/* нижний бордюр */
	.hr-border {display:block; border-bottom:#666 1px solid; padding:5px;}
	.h3-border {padding: 5px 0 0 0; margin-bottom: 3px; border-bottom: 2px solid #7A6850; display: inline-block;}
	
.logokobak {width:30px;}

/* формы */
input {margin:2px; padding:1px 5px;}

	/* убрать кнопки на type="number" */
	.shest {-moz-appearance: textfield;}
	.shest::-webkit-inner-spin-button {display: none;}
/* карта */
	.map {width:80%; height:150px; margin:10px auto;}

/* скрываем часть новостей */
        .text-wrapper {
            max-height: 300px;
            overflow: hidden;
            position: relative;
            transition: max-height 0.5s ease;
        }
        .text-wrapper::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 150px;
            background: linear-gradient(transparent, white);
            pointer-events: none;
        }
        #expand-toggle, #expand-toggle2, #expand-toggle3, #expand-toggle4, #expand-toggle5, #expand-toggle6 {display: none;}
        .expand-btn {
            display: inline-block;
            margin: 10px;
            padding: 8px 16px;
            background: #394F36;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
			}
			.expand-btn:hover {background: #218838;}

	/* Когда чекбокс отмечен */
        #expand-toggle:checked ~ .text-wrapper {max-height: max-content;}
        #expand-toggle:checked ~ .text-wrapper::after {opacity: 0;}
        #expand-toggle:checked ~ .expand-btn::before {content: 'Скрыть раздел';}
        .expand-btn::before {content: 'Показать раздел';}

        #expand-toggle2:checked ~ .text-wrapper {max-height: max-content;}
        #expand-toggle2:checked ~ .text-wrapper::after {opacity: 0;}
        #expand-toggle2:checked ~ .expand-btn::before {content: 'Скрыть раздел';}
        .expand-btn::before {content: 'Показать раздел';}

        #expand-toggle3:checked ~ .text-wrapper {max-height: max-content;}
        #expand-toggle3:checked ~ .text-wrapper::after {opacity: 0;}
        #expand-toggle3:checked ~ .expand-btn::before {content: 'Скрыть раздел';}
        .expand-btn::before {content: 'Показать раздел';}

        #expand-toggle4:checked ~ .text-wrapper {max-height: max-content;}
        #expand-toggle4:checked ~ .text-wrapper::after {opacity: 0;}
        #expand-toggle4:checked ~ .expand-btn::before {content: 'Скрыть раздел';}
        .expand-btn::before {content: 'Показать раздел';}

        #expand-toggle5:checked ~ .text-wrapper {max-height: max-content;}
        #expand-toggle5:checked ~ .text-wrapper::after {opacity: 0;}
        #expand-toggle5:checked ~ .expand-btn::before {content: 'Скрыть раздел';}
        .expand-btn::before {content: 'Показать раздел';}

        #expand-toggle6:checked ~ .text-wrapper {max-height: max-content;}
        #expand-toggle6:checked ~ .text-wrapper::after {opacity: 0;}
        #expand-toggle6:checked ~ .expand-btn::before {content: 'Скрыть раздел';}
        .expand-btn::before {content: 'Показать раздел';}