body{
	background: url(images/main-fon.png) repeat center top;
	font-family: 'Open Sans',arial;
	color:#666;
	font-size: 1.1rem;
	line-height: 135%;
}
* { 
	margin: 0;
	padding: 0;
}
/*  ------------------------------ DIV ------------------------------  */
#searchform {
	margin: 0.2rem;
}
div.mobile{
    display: none;
}
div.compik{
    display: block;
}
#wrapper {
	width: 100%;
	word-wrap: break-word;
    max-width: 1280px; /* Максимальная ширина страницы в пикселах */
	margin:0 auto;
}
#header,#container,#footer {
    width: 96%;
	margin:0 auto;
}
#animate{    /* ожидание выполнения запроса */
    background:url(images/animate.gif) no-repeat;
	background-size: cover;
	width: 4rem;
	height: 4rem;
	left: 50%;
	top: 50%;
	margin-left: -2rem;  /* поправка на ширину блока */
	margin-top: -2rem;
	position: fixed;
	display: none; 
	z-index: 2;
}
/* новый div  	align-items: center;*/
div.f_box_main {
    display: flex;
    flex-direction: row; 
	margin: 0 auto;
    width: 100%;
	padding: 0.5rem;
	box-sizing:border-box; 
    justify-content: center;	
} 
div .f_box_main .item{
	flex: 1 0;	
	padding: 0.5rem 1rem;
	text-align: justify;
}	
#footer div.f_box_main {
	align-items: center;
}
#f_box_anons {   /* зеленый анонс flex-direction: row; */
    display: flex;
	margin: 2rem auto 2rem auto;
    width: 100%;
	padding: 0.5em;
	flex-wrap: wrap;  
	box-sizing:border-box;
} 
div.f_column2 {
    display: flex;
	flex: 1 0 50%;  /* растягиваться,сжиматься,изначальное место */
	box-sizing:border-box; 
}
div.f_anons3 {
    display: flex;
	align-items: center;
	flex: 1 0 50%;
	box-sizing:border-box;
}
div.f_column3 {
	flex: 1 0 33%;  
	box-sizing:border-box;
	display: flex;
	align-items: center;
	padding: 0.1rem 1rem;
	justify-content: center;
	white-space: nowrap;
}
#sidebar_col {    /* столбец для бокового меню--  */  	
	flex: 0 1; 
	min-width: 12em;
	padding: 0.5rem 1.5rem;
}	
#f_zayavka, #f_footer {   /* --  полоса оформить заявку --  */
    display: flex;
	margin: 0 auto;
    width: 96%;
	flex-wrap: wrap; 
	box-sizing:border-box;
	align-items: center;
}
#f_zayavka_fix {  /* фикс дубль полоса оформить заявку*/
    display: flex;
    max-width: 1230px; /* Максимальная ширина страницы в пикселах */
	flex-wrap: wrap;  
	box-sizing:border-box;
	align-items: center;
	top: 0%;
	position: fixed;
	z-index:2;
	background: #fff;
} 
div.column1 {		/* вывод в один столбец     padding: 1rem 2rem 0 2rem; */ 
  text-align: justify;
  clear: both;
  width:96%;
  margin: 0 auto;
  box-sizing: border-box; /* размер учитываем рамки */ 
}
div#naity,div#telefon,div#beripoxod{/* вывод в три столбца  */
  text-align: center;
  max-width:33.333%;
  min-width:33.33%;
  padding: 0.5rem 2%;
  box-sizing: border-box; /* размер учитываем рамки */ 
}
div#telefon{		/* телефон */
	padding: 2em 1em!important;
}
div#beripoxod{		/* эмблема сайта */
	background: url(images/bp.svg) center no-repeat;
	background-size:  contain;
}
div.column3{		/* вывод в три столбца  */
  text-align: center;
  width:31%;
  float: left;
  margin: 1%;
  position: relative;
}
div.column4 {	/* вывод в 4 столбца  */
  text-align: justify;
  float: left;
  width:22%;
  overflow: hidden;
  display: block;
  margin: 0.5%;
  padding: 1%;
}
div.column0,div.column_end {/*столбцы без размера+последний на оставшуюся ширину */
  text-align: right;
  overflow: hidden;
  display: block;
  margin: 0.4em;
  padding: 0.1em;
  min-height: 100%;
}
#modal_content div.column0 {
  text-align: left;
}
div.column0 {  
	float: left;
}
div.stop {   		/* отмена обтекания  */	
	clear: both;
	margin: 1rem 0;
	text-align: center;
	color:#0000ff;
	font-size: 120%;
}

/*  ------------------------------ ТЕСТ ------------------------------  */
div.column1_poisk {	/* вывод в один столбец в поиске */ 
  text-align: justify;
  clear: both;
  width:100%;
  margin: 0 auto;
  overflow: hidden;
  box-sizing: border-box; /* размер учитываем рамки */ 
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:space-evenly;
  align-items: stretch;
}
div.column3_poisk{		/* вывод в три столбца  */
  text-align: center;
  max-width:50%;
  min-width:50%;
  padding: 1em 2%;
  box-sizing: border-box; /* размер учитываем рамки */ 
}

img.ar_image3 { /*мини вывод похода*/
	width: 100%;
	border-radius: 0.5rem;	
}


/*  ------------------------------ МЕНЮ ------------------------------  */

#menu {
    width: 80%;
    height: 2.7em;
    margin: 0 auto;
	text-align: center;
	min-width: 40em;
}
#navbar > li {
	background: url(images/menu-border.png) right no-repeat;
}
#navbar > li:last-child {
    background: none;
}
#navbar li {
  position: relative;
  list-style-type: none;
  display: inline-block;
  padding: 0.8em 0.9em;
}
#navbar li a {
    font-weight: 500;
	color:#000;
	text-decoration: none;
}
#navbar li:hover>ul { display: block; }

#navbar ul  {
  display: none;
  background-color: #f5f5f5;
  position: absolute;
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
  border-radius: 0.4rem;
  white-space: nowrap;
  top: 95%;
  left: 0;
  z-index: 13;
}
#navbar ul li  {     /* выпадающее меню */
  float: none; 
  padding: 0.3em 0.9em !important;
  display: block !important;
  border-bottom: 1px dashed #C1C1C1;
}
#navbar ul li a {     /* выпадающее меню */
	color:#000!important;
	z-index: 13;
}
/* --------------------- МОБИЛЬНОЕ МЕНЮ --------------------------------- */
nav{
	display: none;		
}
/* --------------  боковое меню ---------------------  */
.sidebar_menu {
	padding: 0.5rem;
    border: 0px solid #666;
	min-width: 12em; 
	box-sizing: content-box;
	color: #000;
} 
.sidebar_menu li {
	display: block;
	padding: 6px 10px;
}	
.sidebar_menu li a{
	color: #266fe8;
	font-weight: 400;
}
.sidebar_menu li:before,.mobile li:before {
  float: left;
  font-size: 1.4rem;
  padding-right: 0.3em;
  color: #ffa500;
  content: "\21A9";
}
.mobile li {
  list-style-type: none;
}
/* --------------------- ШРИФТЫ ----------------------------------------- */
h1,h2,h4{
    clear: both; 
	width: 96%;
	text-align: center;
	padding: 0.5rem;
	margin: 1rem;
}
h1{
	font-size: 1.5rem;	
}
h2{
	font-size: 1.2rem;	
}
#modal_content h2,h4{
	color:  green;
}

p {
	margin: 0.2em 0 1em 0em;
}
a {
	text-decoration: none;
	font-weight: 500;
}
span.bold { /* */
	text-align: center;	
	font-weight: bold; 
}
span.podpis { /*описание похода */
	text-align: center;	
	font-style: italic; 
	color:#707000;
	font-size: 85%;	
	margin: 0.5rem;
}
span.big2{
	font-size: 1.5rem;
	color: green;
	margin: 0 1rem;
}
div.title{
	font-size: 1.3rem;
}	
span.kroshki, span.kroshki a{
	font-size: 0.9rem;
	color: #8d8d8d; 
}


/* ------------------------------ КАРТИНКИ -------------------------------*/
img.preview{
	height: 16vw;
	max-height: 180px;
	width: 100%;
	border-radius: 0.5rem;
    margin: 0.5%;
    float: left;
}

/* ---------------- ЭЛЕМЕНТЫ ФОРМ ----------- */

li {
	list-style-position: inside;
	text-align: left;
	padding:0.2rem 0;
}

/* --------------------  .nicEdit-panel --------------------------------------*/
.nicEdit-main ul,ol{ 
	list-style-position: inside; 
}
.nicEdit-main table { 
	 border: 1px solid grey;
}
.nicEdit-main td { 
	 border: 1px solid grey;
	 min-width: 5em;
	 height: 2em;
}
textarea,.nicEdit-main {
	width: 90%;
}
/* -----------------------------------  КНОПКИ --------------------------------------*/
button.zayavka, #but_app { /* кнопки заявки ,отправить заявку  --*/
	color: #fff;
	background-color: #269fe8;
	padding: 0.5rem 1rem;
	font-size: 1.4rem;
}
#but_app:before {		 /* отправить заявку- */
  float: left;
  content: "\2709";
  font-size: 1.4rem;
  padding-right: 0.3em;
} 
.delete{    /* кнопка удаления фото */
    display:block;
    float:right;
    width:40px;
    height:40px;
    background:url(images/delete.png);
	background-size: cover;
	position:relative;
    top:20px;
    right: -10px;
}

/* -------------------   СЛОЖНОСТЬ ПОХОДА --------------------*/
.difficulty,.difficulty-fill {
    display: inline-block;
    width: 0.8em;
    height: 0.8em;
    border-radius: 2px;
    border: 1px solid currentcolor;
    margin-left: 0.1em;
}
.difficulty-fill {
    background: #74a707;
}

 /* ----------------------------   ИКОНКИ ---------------------------*/       
.house, .sauna, .tent, .velotury, .splavy, .kid, .animal,.price,.road,.wc,.shower,.heart
,.like,.food,.peaple,.bonfire,.camp,.carabin,.mountain,.camera,.paper,.rope,.ukazatel,.auto,.coin
{
  height: 4rem;
  width: 4rem;
  background-color: orange;
  display: inline-block;
  margin: 0.5rem 0.5rem;
  mask-repeat: no-repeat;
  mask-size: auto 100%;
  mask-position: center;
 } 
div.calendar {
  -webkit-mask-image: url('images/calendar.svg');
  mask-image:url('images/calendar.svg');
  min-height: 4rem;
  min-width: 4rem;
  background-color: #269fe8;
  display: inline-block;
  margin: 0.5rem 0.2rem;
} 
div.coin {
  -webkit-mask-image: url('images/coin.svg');
  mask-image:url('images/coin.svg');
}
div.auto {
  -webkit-mask-image: url('images/auto.svg');
  mask-image:url('images/auto.svg');
}
div.ukazatel {
  -webkit-mask-image: url('images/ukazatel.svg');
  mask-image:url('images/ukazatel.svg');
}

div.rope {
  -webkit-mask-image: url('images/rope.svg');
  mask-image:url('images/rope.svg');
}
div.paper {
  -webkit-mask-image: url('images/paper.svg');
  mask-image:url('images/paper.svg');
}
div.camera {
  -webkit-mask-image: url('images/camera.svg');
  mask-image:url('images/camera.svg');
}
div.mountain {
  -webkit-mask-image: url('images/mountain.svg');
  mask-image:url('images/mountain.svg');
}
div.carabin {
  -webkit-mask-image: url('images/carabin.svg');
  mask-image:url('images/carabin.svg');
}
div.camp {
  -webkit-mask-image: url('images/camp.svg');
  mask-image:url('images/camp.svg');
}
div.bonfire {
  -webkit-mask-image: url('images/bonfire.svg');
  mask-image:url('images/bonfire.svg');
}
div.peaple {
  -webkit-mask-image: url('images/peaple.svg');
  mask-image:url('images/peaple.svg');
}
div.food {
  -webkit-mask-image: url('images/food.svg');
  mask-image:url('images/food.svg');
}
div.like {
  -webkit-mask-image: url('images/like.svg');
  mask-image:url('images/like.svg');
}
div.heart {
  -webkit-mask-image: url('images/heart.svg');
  mask-image:url('images/heart.svg');
}
div.shower {
  -webkit-mask-image: url('images/shower.svg');
  mask-image:url('images/shower.svg');
}
div.wc {
  -webkit-mask-image: url('images/wc.svg');
  mask-image:url('images/wc.svg');
}
div.road {
  -webkit-mask-image: url('images/road.svg');
  mask-image:url('images/road.svg');
}
div.price {
  -webkit-mask-image: url('images/price.svg');
  mask-image:url('images/price.svg');
}
div.house {
  -webkit-mask-image: url('images/house.svg');
  mask-image:url('images/house.svg');
}
div.sauna {
 -webkit-mask-image: url('images/sauna.svg');
  mask-image: url('images/sauna.svg'); 
}
div.tent {
 -webkit-mask-image: url('images/tent.svg');
  mask-image: url('images/tent.svg'); 
}
div.velotury {
  -webkit-mask-image: url('images/velotury.svg');
   mask-image:  url('images/velotury.svg');
}
div.splavy {
 -webkit-mask-image: url('images/splavy.svg');
  mask-image: url('images/splavy.svg'); 
}
div.kid {
  -webkit-mask-image: url('images/kid.svg');
  mask-image: url('images/kid.svg'); 
}
div.animal {
  -webkit-mask-image: url('images/animal.svg');
  mask-image: url('images/animal.svg'); 
}

 
/* ---------------------------- МОДАЛЬНОЕ ОКНО -------------------------- */ 
#my_modal input[type="text"],#my_modal textarea {
	width: 100%;
}

#my_modal select,#my_modal input,#my_modal textarea {
	padding: 0.5rem;
	border: 1px solid #A9A9A9;
	margin: 0.5rem 0;
	box-sizing: border-box;
	background: #fff;
}

.modal {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.6);
    z-index: 30;
}
.modal_dop {     /* дополнительный блок - чтобы модальное окно было по центру */
  position: relative;
  float: right;
  right: 50%;
  max-width:100%;
}
#title_image {     /* название фото в модальном окне */
	border: 0px solid #f0f;
	background-color: rgba(0,0,0,0.6);
	position: absolute; 
	bottom: 0; 
	width: 100%;
	color: #fff;
	padding: 0.5em;
}
#title_image a{
	color: #fff;
}

#modal_image {			/* фото */
    z-index: 10;
	position: relative;  /* связка с доп.блоком - чтобы модальное окно было по центру */
	border: 1px solid #fff;
	overflow: hidden;
	left: 50%;
}
#modal_content {			/* для заявки */
    z-index: 10;
	position: relative;  /* связка с доп.блоком - чтобы модальное окно было по центру */
	display: inline-block;
	box-shadow: 0px 0px 2px 2px #808080 inset;
    background-color: #fefefe;
    padding: 0.5em;
	left: 50%;
	max-width:40rem;
}
#photo_left,#photo_right {	/* стрелочики перемещения по фото */	
	position: absolute;
	top: 50%;
	z-index: 20;
	cursor: pointer;
	font-size: 2em;
	color: #fff;
	text-shadow: black 1px 1px 0, black -1px -1px 0, 
                 black -1px 1px 0, black 1px -1px 0;
                 
}
#photo_left { left: 5%;}
#photo_right { right: 5% } 

.close_modal_window {
    color: #aaa;
    cursor: pointer;
	font-size: 1.2em;
	position: absolute;
	top: 1px;
	right: 1px;
	z-index: 20;
}
.post_title {
    color: #fff;
	background-color: rgba(0,0,0,0.3);
 	font-size: 1.2em;
	position: absolute;
	z-index: 20;
	width: 100%;
	padding: 0.2em 0;
	border-radius: 0.5rem 0.5rem 0 0;
}

/* ---------------------------- СКРЫТЬ/ПОКАЗАТЬ ТЕКСТ ---------------------------*/ 
input[type="checkbox"] { 
	display: none;
}
#more_opis+label,#more_prog+label,#more_incl+label,#more_excl+label{
	cursor: pointer;
    display: none;
	color: #269fe8;
}
#more_opis+label+div, #more_prog+label+div,
#more_incl+label+div, #more_excl+label+div{  /* по щелчку скрываем  // display: none; */
     display: block;   
}
#more_opis:checked + label + div, #more_prog:checked + label + div,
#more_incl:checked+label+div, #more_excl:checked+label+div{ /* по щелчку показываем  */
    display: block;
}
#more_opis+label:before,#more_prog+label:before,
#more_incl+label:before,#more_excl+label:before{          
	content: 'Читать далее...'; 
}
#more_opis:checked+label:before,#more_prog:checked+label:before,
#more_incl:checked+label:before,#more_excl:checked+label:before{  
  content: 'Скрыть';
}


/* ------------------------ SLICK SLAIDER карусель ------------- */
.slider {
  margin: 1rem auto;
  width: 100%;
  visibility: hidden; /* -появляется только после загрузки фото */
}

.slick-slider{
   min-width: 0;
}
.slick-track{
    display: flex;
    align-items: center; /* flex-start */
} 
.slick-list {
    overflow: hidden;
}
.slider__item {
    padding: 0 0.4em;
}
.slider__item img{
    max-width: 100%;
}    

.slick-arrow.slick-prev {
    left: 10px;
    position: absolute;
	z-index: 10;
}
.slick-arrow.slick-next {
    right: 10px;
    position: absolute;
	z-index: 10;
}
 
.slick-prev:before {
  content: "\276E" !important;
  font-size: 40px  !important;
  color: #f00 !important;
  text-shadow: white 2px 1px 0, white -2px -1px 0, 
               white -2px 1px 0, white 2px -1px 0 !important;
}

.slick-next:before {
  content: "\276F" !important;
  font-size: 40px !important;
  color: #F00 !important;
  text-shadow: white 2px 1px 0, white -2px -1px 0, 
               white -2px 1px 0, white 2px -1px 0 !important;
}
/* ---------------------------- СОЦ СЕТИ ---------------------------*/ 
div.telegram, div.youtube, div.vk, div.email {
	width: 2rem;
	height: 2rem;
	background-size: cover;
	margin: 0.1rem;
}
div.vk {background-image: url("images/vk.svg");}	
div.youtube {background-image: url("images/youtube.svg");}	
div.telegram {background-image: url("images/telegram.svg");}	
div.email {	background-image: url("images/email.svg");}
/* ---------------------------- ТАБЛИЦА ---------------------------*/ 
div#programma pre {
	color: #266fe8;
	display: inline;
	padding: 0.5rem 1rem;
	font-size: 1.5rem;
	font-weight: 600;
}	
div#programma table {
	border-collapse: collapse;
	margin: 1rem 0 2rem 0;
	display: table;
	word-break: break-word;
}	
div#programma td {
	border: 1px solid #d8d8d8;
	padding: 0.8rem;
}	
div#programma td:first-child {
	font-size: 1.2rem;
	font-weight: 600;
	word-break: normal!important;	
}

 /* ---------------------------- АДАПТИВНАЯ ВЕРСТКА ---------------------------*/ 
@media all and (max-width:800px) {   /*по горизонтале меньше 800 */
	body {font-size: 1rem;}
	div.mobile{display: block;}
	div.compik,#photo_left,#photo_right {display: none;}
	/*header */
	#header .f_box_main {flex-direction: column;}
	div#naity,div#telefon {
		max-width: 98%;
		min-width: 98%;
	}
	#f_zayavka,#f_zayavka_fix {  /* фикс дубль полоса оформить заявку*/
		width: 98%;
		border: 1px solid #000;
		border-radius: 6px;
	}
	#f_box_anons {   /* зеленый анонс flex-direction: row; */
		margin: 1rem auto 1rem auto;
	}
	#header, #container,#footer,#menu {width: 98%;}
	div .f_box_main .item{padding: 1rem 0.2rem;}	
	#s {					/* строка поиска */
		margin: 1rem auto;
	}
	div#telefon{		/* телефон */
		margin: 0.1rem!important;
		padding: 0.1rem!important;
	}
	div.title,button.zayavka, #but_app, #but_app:before {font-size: 1.2rem;} /* кнопки заявки ,отправить заявку  --*/
	#menu {display: none;}
	/*мобильное меню */
	nav{								
	  display: block;
	  font-size: 1.1rem;
	  background:  #0bda51; 
	}
	#btn-menu + label{
		  display: inline-block;
		  position: relative;
		  color: #fff; 
		  z-index: 1;
		  cursor: pointer;
		  padding: 0.3em 1em;
	   }
	#btn-menu + label + a{  /* логотип меню  */
		float: right;
		padding: 0.3em 1em;
    }   
    #btn-menu + label + a + #list-menu{  /* по щелчку скрываем  */
		display: none;
    }
    #btn-menu:checked + label + a + #list-menu{ /* по щелчку показываем  */
		display: block;
    }
	#list-menu{
	  display: flex;
	  list-style: none;
	  background:  #3caa3c; 
	  margin: 0!important;
	}
	#list-menu > li > a{
	  color: #fff;
	  display: block;
	  padding: 0.2em 1em;
	}
	#list-menu > li > a:hover{            /* выделяем актиное меню  */
		background: rgb(96,145,172);
	}
	#btn-menu + label:before{            /* пиктограмма для открытия  */
	  content: '\2630';  
	}
	#btn-menu:checked + label:before{    /* пиктограмма для закрытия  */
	  content: '\00AB';
	}
	#f_zayavka>div.f_column3 {
		flex: 1 0 100%;
		min-height: 3.5rem;
	}	
}
@media all and (max-width:600px) {   /*по горизонтале меньше 600 */
	div.f_column2, div.f_anons3 { flex: 1 0 100%;flex-wrap: wrap;}
	div.f_anons3 {	border-bottom: 1px dashed #fff;}
	.slider__item { padding: 0;}
	.slider__item img{ min-width: 100%;}  
	div.column3_poisk{		/* вывод в три столбца  */
		max-width:96%;
		min-width:96%;
		border-bottom: 1px dashed #C1C1C1;  /* размер и цвет границы блока */
	}
	/* стрелочки на слайдере
	.slick-arrow.slick-prev, .slick-arrow.slick-next {
		display:none!important;
	}	*/
}