@charset "utf-8";
/* На сайт подключается такой же CSS, но без камментариев, тк IE8 глючит на русских камментах, см каменты к idangerous.swiper_.css*/
/* Шрифты можно взять в стандартной библиотеке шрифтов от Google, там это все описано*/
/* http://frontender.info/writing-efficient-css-selectors/
ID:									#header 
Класс:								.promo 
Тип:								div 
Соседний элемент того же уровня:	h2 + p 
Дочерний элемент:					li > ul 
Вложенный элемент:					ul a 
Общий селектор:						* 
Атрибут:							[type="text"] 
Псевдоклассы/-элементы:				a:hover

мультикласс: оба класса присутствуют одновременно  .slide.restore	*/

/*========== минимально обнуляем стили ==========*/
* {
  margin: 0; padding: 0;					/*сброс отступов у всех элементов с помощью универсального селектора */
	/*box-sizing: border-box позволит сохранить фиксированную ширину элементов, даже при использовании внутренних отступов и границ */
  -webkit-box-sizing: border-box;			/*for Safari & Chrome */
  -moz-box-sizing: border-box;				/*for Firefox */
  box-sizing: border-box;
  }


/*========== если браузер не понимает тэги HTML5 ==========*/
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }

header:before,
header:after { content: ""; display: table; }/*clearfix http: //nicolasgallagher.com/micro-clearfix-hack/ */
header:after { clear: both; }
header		 { zoom: 1; }					/*for IE 6/7*/


img {
  -moz-user-select: none;					/*запрет выделения картинки (ссылку вокруг картинки надо бы тоже, но она может перестать кликаться) */
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /*pointer-events: none; */				/*убрать из меню пункта "Сохранить изображение как...", но при этом картинка перестанет реагировать на onClick */
  }

/*========== устанавливаем общие стили тэгов ==========*/
[hidden] { display: none; }

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { font-family: sans-serif; color: #222; }

body { margin: 0; font-size: 1em; line-height: 1.4; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }

::selection { background: #fe57a1; color: #fff; text-shadow: none; }

a			{ color: #00e; }
a:visited	{ color: #551a8b; }
a:hover		{ color: #06e; }
/*a:focus	{ outline: thin dotted; }*/		/*make dotted borders arround pressed hrefs */
a:focus		{ outline: none; }				/*delete dotted borders arround pressed hrefs */
a:hover,
a:active	{ outline: 0; }

b, strong	{ font-weight: bold; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

small		{ font-size: 85%; }

sub, sup	{ font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup			{ top: -0.5em; }
sub			{ bottom: -0.25em; }

ul, ol		{ margin: 1em 0; padding: 0; }

dd			{ margin: 0 0 0 40px; }

nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img			{ border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

form		{ margin: 0; }

label		{ cursor: pointer; }

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

button, input { line-height: normal; }

button,
input[type="button"],
input[type="reset"],
input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }

button[disabled], input[disabled] { cursor: default; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  }

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

textarea	{ overflow: auto; vertical-align: top; resize: vertical; }

input:invalid, textarea:invalid { background-color: #f0dddd; }

table		{ border-collapse: collapse; border-spacing: 0; }
td			{ vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }

/*========== основной CSS ==========*/
/*::-moz-selection { background: #ffe39c; color: #333; text-shadow: none; }*/	/*was - выделяло бледно-жёлтым*/
::-moz-selection { background: #fbb913; color: #333; text-shadow: none; }

/*::selection { background: #ffe39c; color: #333; text-shadow: none; }*/		/*was - выделяло бледно-жёлтым*/
::selection { background: #fbb913; color: #333; text-shadow: none; }

a {	/* Плавное перетекание цвета(color) ссыллок при наведении и убирании мышки: от цвета a(#d2ae63) <-> цвету a:hover(#06e),
	 а после посещения ссылки получается уже оригинальное трёхцветное переливание к конечному цвету a:visited(#551a8b),
	 см пример <div id='filter-nav'><ul><li><a href='/77/'>еуые</a></li></ul></div> для $FILTER_NAV в filterNav.php
	 Работает(наследуется) для ВСЕХ ссылок сайта если у них есть :hover (если у них другой color - будет работать с ним) */
  color: #d2ae63;
/*  -moz-transition-property: color;
  -webkit-transition-property: color;
  -o-transition-property: color;
  transition-property: color;
  делаем плавную трансформацию ВСЕХ свойств, указанных в :hover, а не только color:*/
  -moz-transition-property: all;
  -webkit-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -moz-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -moz-transition-timing-function: ease-in-out;
  -webkit-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  word-wrap: break-word;
  text-decoration: none; }

a:visited	{ color:#551a8b; }

a:hover		{ color:#06e; }

#noscript-warning {
  position: fixed;
  top: 0px;
  padding: 7px;
  z-index: 9999;
  width: 100%;
  text-align: center;
  color: #000;
  background-color: #fbb913;
  font-size: 0.9em; }

body { font-family: Verdana, sans-serif; font-style: normal; font-weight: 400; background: #616970; }
  body a		{ text-decoration: none; }
  body a:active	{  position: relative; bottom: -1px; }


/*========== Home & Main Nav styles ==========*/
#logo {
  margin: 5px 0 0 5px;
  float: left;
  width: 63px;
  height: 38px;
  cursor: pointer;												/*тк делаем его кликабельной ссылкой на J S*/
  /*background: transparent url("/images/camera.gif") no-repeat center center;*/
  /*background: transparent url("/images/fotocamera.png") no-repeat center center;*/
  background: transparent url("/images/logo.png") no-repeat center center;
  opacity: 1;
  -webkit-transition: opacity 0.3s ease-in-out;
  -moz-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out; }
  #logo:hover { opacity: 0.8; }
  #logo a { display: block; width: 63px; height: 38px; zoom: 1; }

#setup:hover { opacity: 0.7; }

#static-nav { /*width: 920px;*/ width: 95%; margin: 30px auto 40px auto; }	/*static block for main navigation menu */
  #static-nav #main-nav { position: static; margin: 0; float: right; }

#main-nav { margin: 40px 40px 0px 0px; float: right; vertical-align:top; }	/*main navigation menu */
  #main-nav #login { display: inline-block; *display: inline; vertical-align: middle; *vertical-align: auto; color:#fbb913; }
	#main-nav #login span { color:#777; }
	#main-nav #login input[type="password"],
	#main-nav #login input[type="text"] {
	  width: 150px;
	  border: 1px solid #bbb;
	  -webkit-border-radius: 3px;
	  border-radius: 3px; }
	#main-nav #login input[type="image"] { margin-left: 4px; vertical-align:text-bottom; }

#main-nav-ul {}													/*UL верхнего уровня навигации */
#main-nav-ul > li {
  display: inline-block;
  vertical-align: middle;
  zoom: 1;
  margin-left: 20px;
  color: #fff;
  *display: inline;
  *vertical-align: auto;  }
  #main-nav-ul > li > a {
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
	font-weight: 500;
	-webkit-transition: color 0.3s ease-in-out;
	-moz-transition: color 0.3s ease-in-out;
	-o-transition: color 0.3s ease-in-out;
	transition: color 0.3s ease-in-out;  }
	#main-nav-ul > li > a.current { color: #fbb913; }
	#main-nav-ul > li > a:hover   { color: #fbb913; }

#filter-nav {												/*filter navigation menu */
	margin: 50px 0px 0px 0px;								/*44px - высота #main-nav(тк растягивается на высоту .dropdown), получаем щель 6px */
	vertical-align: top;
	text-align: center; }
  #filter-nav ul { margin: 0; }
  #filter-nav > ul > li {
	display: inline-block;
	vertical-align: middle;
	/*border:1px solid red;*/								/*отладка позиционирования в filter-nav */
	zoom: 1;
	margin: 0px!important;
	margin-left: 20px;
	color: #fff;
	*display: inline;
	*vertical-align: auto;  }
	#filter-nav > ul > li img.reset { height: 20px; margin-right: 5px; float: left; }	/*картинка сброса фильтра */

  #filter-nav #search { display: inline-block; float: left; }/*все элементы в <li> - влево, чтобы не прыгали по высоте */
	#filter-nav #search input[type="text"] {
	  width: 250px;											/*под самое длинное */
	  border: 1px solid #bbb;
	  float: left;											/*все элементы в <form> - влево, чтобы не прыгали по высоте */
	  margin-top: 7px;
	  margin-left: 4px;
	  padding: 5px;
	  -webkit-border-radius: 3px;
	  border-radius: 3px; }
	#filter-nav #search input[type="image"] { margin-left: 4px; float: left; }/*клик на картинку передаёт по get координаты клика -*/
	#filter-nav #search input[type="submit"] {				/*они нам мешают, поэтому делаем картинкой нормальный sumbit*/
	  margin-left: 4px;
	  float: left;											/*все элементы в <form> - влево, чтобы не прыгали по высоте */
      background: url(/images/search.gif);
      border: 0;
      display: block;
      min-height: 44px;										/*надо явно задать высоту/ширину по подкладываемому рисунку, */
	  min-width: 45px;										/*без min- новый FF не прорисовывает */
	  }
input[type="submit"],										/*остальные submit кроме #search submit*/
input[type="button"] {
  text-decoration:none; cursor:pointer; outline:none;
  color:#444;
  font-family:"Lucida Grande","Lucida Sans","Lucida Sans Unicode","Segoe UI",Verdana,sans-serif; font-size:12px; font-weight:bold;
  display:inline-block;
  vertical-align:top; text-align:center;
  position:relative;
  padding:3px; margin-top:-2px;
  background-color:#aaa;
  text-decoration:none;
  border:1px solid #444;
  -webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0,0, 0, 0.05);
  box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);
  -moz-user-select:none; -webkit-user-select:none;			/*Make the text unselectable*/
  -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; border-width:1px; border-style:solid;
  }
input[type="submit"][disabled] {opacity:0.3;}				/*затенять задизабленную кнопку*/
#log-output {												/*поле процесса авторизации*/
  position:absolute;
  font-size:10px;
  padding:2px;
  color:#555;
  background-color:#eee;
  z-index:99999;											/*поверх меню*/
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  -khtml-border-radius:3px;
  border-radius:3px;
  }

#slogan {													/*H2 header on Foto/Video */
  position:fixed;
  position:absolute;
  pointer-events:none;										/*убрать событие hover, чтобы оно передавалось на управление видео*/
  left:25px;
  bottom:30px;
  z-index:9996;
  margin:0px 40px 20px 0;
  color:#fff;
  text-transform:uppercase;
  text-shadow:1px 1px 1px #444;
  font-size:1.75em;
  letter-spacing:4px; }
  #slogan span { font-weight:normal; color:#fbb913; }

/*========== Content ==========*/
#wrapper { width:96%; position:relative; margin:0 auto; background:#e5e5e5; }

#content {
  width: 100%;
  min-height: 550px;
  float: left;
  padding: 0 0 10px 0;
  font-family: Georgia, serif;
  font-style: normal;
  background-color: #fff;				/*не отрабатывает */
  font-weight: 500; }
  #content h1 { font-family: "Lobster", cursive, sans-serif; color:#666; }
  #content h2, #content h3 { margin-bottom: 10px; }
  #content h2, #content h3, #content small { font-family: Verdana, sans-serif; font-style: normal; }
  #content p {
	font-size: 1.063em;
	line-height: 1.4em;
	color: #333;						/*#555; */
	margin-bottom: 0.5em;
	text-align: justify;
	text-indent: 20px; }
  #content small			{ text-transform: uppercase; color: #888; font-size: 0.75em; }
	#content small span		{ color: #444; }
	#content small a		{ color: #444; }
	#content small a:hover	{ background-color: #fbb913; color: #000; }
  #content a {
	color: #888;
	border-bottom: 1px dotted #888;
	/*-webkit-transition: background-color 0.3s ease-in-out;
	-moz-transition: background-color 0.3s ease-in-out;
	-o-transition: background-color 0.3s ease-in-out;
	-ms-transition: background-color 0.3s ease-in-out;
	transition: background-color 0.3s ease-in-out;*/  }
  #content a:hover			{ /*background-color: #fbb913;*/ color: #000; }
  #content .info-wrapper	{ line-height: 1px; }			/*для работы маргинов в .info; line-height убирает отступы вокруг вложенной картинки-распорки */
  #content .info-strut		{ width: 450px; height: 1px; }	/*распорка для сдвигания .info вниз при широких экранах */
  #content .info-wrapper .info {
	line-height: normal;									/*вернуть нормальную после .info-wrapper */
	background-color: #e2e2e2;
	border: 1px solid #333;
	display: block;
	overflow: auto;
	margin: 5px;
	padding: 4px;
	box-shadow: 0px 0px 5px #000;							/*тень вокруг */
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-khtml-border-radius: 6px;
	border-radius: 6px; }
	@media screen and (max-width: 480px) {
	  #content .info-strut { width:0; }				/*распорка для сдвигания .info вниз при узких экранах */
	  }

#sitemap_nav { 					/*выпадающее меню аккордеон от menuPlace, выводимая на морде раздела карты сайта, меняем его стиль*/
  position: static;											/*отменяем абсолютное позиционирование*/
  max-width: 98%;											/*take full width of parent`s div*/
  width: 98%;
  font-size: 1.06em;
  margin-bottom: 1%; }
  #sitemap_nav > ul > li > ul	{ height: auto!important; }	/*делаем всё меню сразу раскрытым*/
  #sitemap_nav > ul > li > ul:after { background: #555; }
  #sitemap_nav > ul > li > a	{
	color: #fff;
	background: #555;
	background-image: linear-gradient(#666, #555);
	background-image: -ms-linear-gradient(#666, #555); }
	#sitemap_nav > ul > li > a:hover { color: #f2bd00; }
  #sitemap_nav > ul > li > ul > li {						/*уваличиваем строку под Город*/
	font-size: 1.06em; height: 36px; }
	#sitemap_nav > ul > li > ul > li > a > img		{		/*картинка флага Города в меню*/
	  display: inline;
	  height: 26px;											/*флаги Городов имеют стандартные пропорции, но гербы - нет*/
	  float: right;
	  vertical-align: middle; }



/*========== Modal window ==========*/
#lean_overlay {					/*overlay block style for Modal window */
  position: fixed;
  z-index: 10901;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  background: #000;
  display: none; }

/*========== Dropdown Menu ==========*/
.dropdown {
  position: relative;
  float: right;					/*without float: don`t work in Opera 10 */
  height: 44px;
  z-index: 10099;				/*> than in arrow-left/right to be over */
  opacity: 0.8;
  margin-right: 2px;			/*отступ от второго такого же */
  -webkit-transition: opacity 0.3s ease-in-out;
  -moz-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
  -webkit-transition: background-color 0.3s ease-in-out;
  -moz-transition: background-color 0.3s ease-in-out;
  -o-transition: background-color 0.3s ease-in-out;
  transition: background-color 0.3s ease-in-out; }
  .dropdown:hover { opacity: 0.99; background-color: #666;
	z-index: 10100!important; } /*> than simple .dropdown to be over the same ones in next line when dropped */
  .dropdown > a {
	display: block;
	margin: 13px 12px 12px 12px;
	text-transform: uppercase;
	font-size: 0.95em;
	font-weight: 600;
	color: #fff; }
  .dropdown > ul {
	position: absolute;
	top: -9999px;
	width: 100%;
	margin: 0!important; padding: 0!important;		/*margin: 0; without important don`t work because inherit from parent or @media */
	background-color: #666;
	opacity: 0.5;
	-webkit-box-shadow: 1px 1px 2px #444;
	-moz-box-shadow: 1px 1px 2px #444;
	box-shadow: 1px 1px 2px #444;
	-webkit-transition: opacity 0.3s ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	-ms-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out; }
	.dropdown > ul > li {
	  list-style-type: none;
	  width: 100%;
	  margin: 0!important; padding: 0!important;
	  display: block!important; }					/*without important don`t work because redefined in @media */
	  .dropdown > ul > li > a {
		display: block;
		margin: 13px 12px 12px 12px;
		width: 100%;
		color: #000;
		margin: 0!important;
		padding: 9px 12px 9px 12px;
		border-bottom: 1px solid #999; }
	  .dropdown > ul > li > a:hover	{ background-color:#999; }
	  .dropdown > ul > li > a:active{ position: relative; bottom: 0; }
  .dropdown:hover > ul			{ top: 44px; opacity: 1; }
  .dropdown > a > img,
  .dropdown > ul > li > a > img	{ width: 18px; height: 18px; display: inline; }		/*icons for Devs/Langs */
  .dropdown > a > span,
  .dropdown > ul > li > a > span{ font-weight: 400; color: #ccc; }

/*========== Lng Dropdown Menu modification of .dropdown ==========*/
#lng-dropdown		{ background: #444 url("/images/pointer-bottom.png") no-repeat 60px 19px; width: 80px; }

/*========== Mobile Dropdown Menu modification of .dropdown ==========*/
#mobile-dropdown	{ background: #444 url("/images/pointer-bottom.png") no-repeat 40px 19px; width: 60px; }/*выпадающее меню выбора типа устройства*/
#mobile-show		{ background-color: #444; width: 40px; }	/*кнопка отображения выбранного типа устройства*/

/*========== Tag`s Dropdown Menu modification of .dropdown ==========*/
#tag-dropdown		{ background: #444 url("/images/pointer-bottom.png") no-repeat 260px 19px;
  width: 280px;										/*to place the longest menu`s item */
  white-space: nowrap;								/*не переносить по словам на следующую строку(будет обрезаться) */
  z-index: 10097;									/*< that .dropdown to be under */
  float: left!important; }							/*to override .dropdown property */

/*========== Place`s Dropdown Menu modification of .dropdown ==========*/
#place-dropdown		{ background: #444 url("/images/pointer-bottom.png") no-repeat 165px 19px;	/*165 вместо 160, тк русское меню - не влазит */
  width: 180px;										/*to place longest menu`s item */
  white-space: nowrap;								/*не переносить по словам на следующую строку(будет обрезаться) */
  z-index: 10097;									/*< that .dropdown to be under */
  float: left!important; }							/*to override .dropdown property */

/*========== Tag`s HideShow(in sitemap.php) Dropdown Menu modification of .dropdown ==========*/
#tagshow-dropdown	{ background: #444 url("/images/pointer-up.png") no-repeat 70px 19px;	/*стрелка вверх по дефолту, тк Тэги показаны*/
  width: 90px;										/*to place the longest menu`s item */
  white-space: nowrap;								/*не переносить по словам на следующую строку(будет обрезаться) */
  z-index: 10097;									/*< that .dropdown to be under */
  float: left!important; }							/*to override .dropdown property */

/*========== Footer ==========*/
footer {
  /*position: fixed;									/*position:fixed - на планшете при вводе букв футер выталкивается вверх всплывающей снизу клавиатурой */
  position: static;
  bottom: 0;
  z-index: 9997;
  width: 100%;
  background-color: #000;
  padding-bottom: 10px;
  padding-top: 10px;
  text-align: center;
  color: #fbb913;
  font-size: 0.85em; }
  footer a {
	text-decoration: none;
	color: #fbb913;
	border-bottom: 1px dashed #fbb913;
	-webkit-transition: color 0.3s ease-in-out;
	-moz-transition: color 0.3s ease-in-out;
	-o-transition: color 0.3s ease-in-out;
	transition: color 0.3s ease-in-out; }
	footer a:visited{ color: #fbb913; }
	footer a:hover	{ color: #888; border-bottom: 1px dashed #888;}
  footer a.ico		{ margin-right: 10px; margin-left: 10px; text-decoration: none; border-bottom: 0px dashed #fbb913; }

footer #contact-info { float: right; padding-left: 10px; padding-right: 30px; }

footer #copyright { float: left;  padding-left: 30px; padding-right: 10px; }

.ss-social {
  display: inline-block;
  vertical-align: baseline;
  zoom: 1;
  *display: inline;
  *vertical-align: auto;
  margin-left: 20px; }
  .ss-social a {
	background-image: url("/images/social.png");
	background-repeat: no-repeat;
	display: inline-block;
	height: 20px;
	margin-left: 10px;
	text-indent: -9999px;
	border: 0px solid black;					/*отменить нижний бордюр у ссылок-картинок*/
	-moz-transition: all 0.2s ease-in-out 0s;
	-webkit-transition: all 0.2s ease-in-out 0s;
	-o-transition: all 0.2s ease-in-out 0s;
	transition: all 0.2s ease-in-out 0s; }
	.ss-social a.facebook		{ background-position: 0 0; width: 12px; }
	.ss-social a.facebook:hover	{ background-position: 0 -22px; width: 12px; border-bottom: 0px dashed #fbb913; }
	.ss-social a.twitter		{ background-position: -32px 0; width: 25px; }
	.ss-social a.twitter:hover	{ background-position: -32px -22px; width: 25px; border-bottom: 0px dashed #fbb913; }
	.ss-social a.googleplus		{ background-position: -77px 0; width: 25px; }
	.ss-social a.googleplus:hover{ background-position: -77px -22px; width: 25px; border-bottom: 0px dashed #fbb913; }
	.ss-social a.email			{ background-position: -122px 0; width: 26px; }
	.ss-social a.email:hover	{ background-position: -122px -22px; width: 26px; border-bottom: 0px dashed #fbb913; }
	.ss-social a.feed			{ background-position: -159px 0; width: 22px; }
	.ss-social a.feed:hover		{ background-position: -159px -22px; width: 22px; border-bottom: 0px dashed #fbb913; }
	.ss-social a.vkontakte		{ background-position: -188px 0; width: 30px; }
	.ss-social a.vkontakte:hover{ background-position: -188px -22px; width: 30px; border-bottom: 0px dashed #fbb913; }
	.ss-social a.youtube		{ background-position: -224px 0; width: 21px; }
	.ss-social a.youtube:hover	{ background-position: -224px -22px; width: 21px; border-bottom: 0px dashed #fbb913; }

#gradient-top {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -9999;
  width: 100%;
  height: 143px;
  background: transparent url(/images/gradient-top.png) repeat-x 0 0; }

#gradient-bottom {
  position: fixed;
  bottom: 0;
  left: 0; 
  width: 100%;
  height: 193px;
  background: transparent url(/images/gradient-bottom.png) repeat-x 0 0; }

#gradient-left {
  opacity: 0.5;
  width: 110px;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: transparent url(/images/gradient-left.png) repeat-y 0 0; }

#gradient-right {
  opacity: 0.5;
  width: 110px;
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
  background: transparent url(/images/gradient-right.png) repeat-y 0 0; }

/*========== my ===========*/
div.flag {
  background-position: center center;
  background-repeat: no-repeat;
  border: 1px solid #ccc;				/*чуть видимый бордюр, тк флаги бывают с белым полем, которое теряется на белом фоне */
  width: 48px;
  height: 32px;							/*обрезаем у background img 48х48 пустые поля сверху/снизу, сам флаг реально по высоте 32 */
  display: inline-block;
  vertical-align: middle;
  }
div.gerb {
  background-position: center center;
  background-repeat: no-repeat;
  width: 48px;
  height: 48px;							/*не обрезаем img 48х48, гербы бывают и 48x48 и у них нет пустых полей сверху/снизу */
  display: inline-block;
  }

img.lng { width: 18px; height: 18px; float: left; }

div.icon {								/*div под картинку-иконку из превью Фото на sitemap.php, чтобы зажать её высоту*/
  height: 25px; width: 33px;			 /*33x25 - типовые пропорции горизонтального Фото, а есть и вертикальные*/
  display: inline-block; text-align: center; }

div#edit,								/*Edit link */
div#index	{							/*to show noIndexed pages */
  position: absolute;
  top: 5px;
  right: 30px;
  background-color: #E2E2E2;
  border: 1px solid Silver;
  padding: 5px;
  margin-right: 10px;
  font-size: 11px; }
div#edit { right: 0px!important; }		/*specific for Edit link */

.colored { color: #FF6600; }
.gray	 { color: #888; }

.icon_clear {							/*значок очистки поля input, см menuKeys() в menus.php */
  position: absolute;
  right: 4px; 
  /*display: none;*/					/*делаем в style='' при загрузке страницы в зависимости пустое значение или нет */
  cursor: pointer;
  margin-top: 4px;
  font: normal 2em "Lucida Console";
  color: #666; }
  .icon_clear:hover { color: #fbb913; }

/* настройка стилей сообщения по закону TC о куках:
<div id="cookieChoiceInfo" style="position: fixed; width: 100%; background-color: rgb(238, 238, 238); margin: 0px; left: 0px; top: 0px; padding: 4px; z-index: 1000; text-align: center;">
  <span>Наше сообщение</span>
  <a style="margin-left: 8px;" target="_blank" href="/disclaimer/#cookies">посмотреть подробности</a>
  <a style="margin-left: 24px;" href="#" id="cookieChoiceDismiss">Разрешить cookie</a>
</div> */
#cookieChoiceInfo { font-stretch: condensed; font-size: 12px; font-weight: bold;
  z-index: 999999!important; padding-left: 20px!important; text-align: left!important; }	/*important to override above from JS*/
#cookieChoiceInfo a { color: #0066ff; }

 	/*========== my Страница показа Фото/Видео ==========*/
/*http://alistapart.com/article/creating-intrinsic-ratios-for-video (то же самое делает jquery.fitvids.js)
.Slider			- ширина самомаштабирующегося контейнера для показа Фото/Видео
.Slider-wrapper	- ресайзит высоту себя относительно ширины внешнего блока .Slider(по padding-bottom:56.25%) с
				заданным ratio: the ratio: 9/16 = 0.5625.
  При этом ТРЕТИЙ и ОСТАЛЬНЫЕ(!обязательно!) по вложенности DIV (.swiper-wrapper и .swiper-container, см idangerous.swiper.css)
растягивается по внешнему контейнеру стилями: position:absolute; top:0; left:0; width:100%; height:100%;, сохраняя постоянную
пропорцию ширина/высота при ресайзинге окна.
*/
.Slider {
  width: 60%;							/*будет пропорционально растягиваться при ресайзе окна */
  /*width: 640px;*/						/*будет сохранять размеры при ресайзе окна */
  border-radius: 3px;					/*скругление углов */
  background: #111;
  padding-bottom: 2px; padding-right: 2px;/*чтобы просвечивал бэкграунд #111 */
  /*box-shadow: 0px 0px 5px #000;*/		/*тень вокруг */
  box-shadow: 2px 2px 5px #000;			/*тень справа снизу */
  float: left;							/*на больщих экранах текст обтекает справа */
  margin-bottom: 8px;					/*отступ снизу для обтекающего текста */
  margin-right: 8px; }					/*отступ справа для обтекющего текста */
  .Slider .Slider-wrapper {
	position: relative;
	padding-bottom: 75%;				/*по сути: пересчёт высоты этого блока относительно ширины внешнего блока c ratio: 9/16 = 0.5625 */
	/*padding-top: 35px;*/				/*высота панели управления для Видео Ютуба, надо ТОЛЬКО для Видео! */
	height: 0; }						/*IE5 & IE6 need to swich layout */
 
table.props { font-size: small; 		/*photo/video properties */
  margin-top: 6px; margin-left: 6px; margin-right: 6px; display:inline-block; border:1px solid transparent; }
  table.props	td					{ padding: 2px; border:1px solid #ccc; background-color: #C5C5C5;/*#e2e2e2;*/ }
	table.props	td:nth-child(odd)	{ color: #666; }						/*first cell */
	table.props	td:nth-child(even)	{ font-weight: bold; text-align: right; }/*second cell */
  table.props	caption				{ text-align: right; }
	table.props	caption img.arrow	{ display: none; height: 14px; margin-right: 4px; margin-top: 2px; }/*don`t show right_arrow by default */
  table.props	a					{ border-bottom: 1px dotted #888; }
	table.props	a:hover, table.props a:focus, table.props a:active { border-bottom: 1px solid #888; }
table.highlight						{ border: 1px dotted #fbb913!important; }/*important to override default 'props' wher meet together */
  table.highlight	caption img.arrow{ display: inline!important; }			/*show right_arrow if highlighted */
  table.highlight	td				{ /*background-color:#e2dfcd!important;*/ }

table.about							{ font-size: small; margin-right:4px; }	/*photo/video description*/
  table.about	td					{ padding: 2px; border: 1px solid #ccc; vertical-align: middle; white-space: nowrap; }
  table.about	td:nth-child(odd)	{ color: #666; }						/*first cell */
  table.about	td:nth-child(even)	{ font-weight: bold; text-align: right;
	white-space: normal!important; }								/*second cell; white-space:normal для списка Тэгов и ФотоГалерей*/

table.links							{ font-size: small; margin-top: 20px;	/*ссылки по теме для photo/video*/
   margin-left: 10px; border: 1px solid #ccc; background-color: #ddd; }
  table.links	td					{ padding: 4px; white-space: normal; color: #666; line-height: normal; }/*Без line-height: normal сжимается в pages.php*/
  table.links	td:nth-child(odd)	{ color: #999; text-align: right; }		/*first cell */
  table.links	td:nth-child(even)	{ }										/*second cell*/
  table.links	caption				{ font-weight: bold; text-align:center; line-height: normal; }/*Без line-height: normal сжимается в pages.php*/
  table.links	a:target			{ font-weight: bold; color:#993300!important; }	/*выделение ссылки, на которую показывает ХЭШ в url #ekbru*/
  table.links	a:target:after		{ background: url(/images/check.png) no-repeat right top;	/*галочка после выделенной ссылки*/
	width: 22px; height: 14px;												/*место под иконку, она 18x14px*/
	display: inline-block; content: " "; position: relative; }				/*без content: " " может глючить*/

  h2:target, h3:target				{ color:#993300!important; }			/*выделение заголовка, на который показывает ХЭШ в url #cookie*/
  h2:target:after, h3:target:after	{ background: url(/images/check.png) no-repeat right top;	/*галочка после выделенного заголовка*/
	width: 22px; height: 14px;												/*место под иконку, она 18x14px*/
	display: inline-block; content: " "; position: relative; }				/*без content: " " может глючить*/

 	/*========== my Страница выборки Фото/Видео ==========*/
.fotoGrid_ul { text-align: center; padding: 0px; margin: auto; }	/*ul-li таблица с превью Фото */
.fotoGrid_li {
  display: inline-block;
  vertical-align: top;
  padding: 0px; margin: 4px; text-align: center;
  *display: inline;													/*для ie7, лучше вынести в отдельные стили */
  *zoom: 1;	}														/*для ie7, лучше вынести в отдельные стили */
  .fotoGrid_li DIV.radius { border: 1px solid #666; padding: 4px; border-radius: 5px 5px 5px 5px;	/*рамка со скруглёнными краями */
	background-color: #000; color: #ccc;}							/*color:#CCCCCC - белые надписи на тёмном фоне когда нет фото */
  .fotoGrid_li DIV.private{ border: 1px solid #ff4500!important; }	/*выделение рамкой приватных Фото */

table.nav_tags		{ border-collapse: collapse; margin-top: 5px; width: 95%; empty-cells: hide; }	/*empty-cells:hide скрывать границы и фон пустых ячеек*/
  table.nav_tags td	{
	font-size: 1em;
	padding: 2px;
	text-align: left;
	border: 1px solid #c5c5c5;
	background-color: #d2d2d2;
	white-space: nowrap; }
	table.nav_tags tr:first-child td:first-child {					/*спецСтиль для самой ПЕРВОЙ ячейки во ВСЕЙ таблице*/
	  background-color: transparent; color:#999999; border: none; font-style: italic; }
	table.nav_tags td:empty	{ background: transparent; border: none; }/*спецСтиль для ПУСТЫХ ячеек, если empty-cells: hide; не сработает*/
	/*table.nav_tags td:empty:after	{ content: "Тэги"; }*/			/*можно добить надпись в пустые ячейки*/
	table.nav_tags a.sel {text-decoration: none; color: #cc3300;}	/*кликнутая ссылка в страничной навигации по Тэгам*/
/*выводить в таблицу для разных разрешений экрана не комильфо, поэтому выводим навигацию по Тэгам в <ul>:*/
ul#nav_tags { text-align: center; padding: 0px; margin: auto; }		/*ul-li таблица с превью Фото */
  ul#nav_tags > li {
	display: inline-block;
	vertical-align: middle;
	padding: 3px; margin: 2px;
	text-align: center;
	border: 1px solid #c5c5c5;
	background-color: #d2d2d2;
	*display: inline;										/*для ie7, лучше вынести в отдельные стили */
	*zoom: 1;												/*для ie7, лучше вынести в отдельные стили */
	/*плавное изменение background-color до li:hover по наведению мыши:*/
	-moz-transition-property: background-color;
	-webkit-transition-property: background-color;
	-o-transition-property: background-color;
	transition-property: background-color;
	-moz-transition-duration: 0.3s;
	-webkit-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-moz-transition-timing-function: ease-in-out;
	-webkit-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out; }
  ul#nav_tags > li:target,									/*Тэг, совпавший с Хэш-ссылкой*/
  ul#nav_tags > li:hover	{ background-color: #c5c5c5; }	/*hovered Тэг*/
  ul#nav_tags > li:hover a,									/*ссылка hovered Тэга: так же как у ссылки #content a:hover, этот стиль работает и тут*/
  ul#nav_tags > li:target a	{ color: #000; border-bottom: none; }/*ссылка выбранного по Хэшу Тэга*/

ul.sitemap { margin-left: 20px; float: left; }				/*записи-ссылки на Фото с карты сайта*/
  ul.sitemap > li {
	display: block;
	color: #666666;
	font-size: 0.9em;										/*уменьшаем шрифт для Даты*/
	vertical-align: middle;
	padding: 3px; margin: 2px;
	*display: inline;										/*для ie7, лучше вынести в отдельные стили */
	*zoom: 1;	}											/*для ie7, лучше вынести в отдельные стили */
	ul.sitemap > li a			{ color: #333!important;	/*ссылки на Фото в карте сайта + плавное перетекание от a {transition-property) выше*/
	  padding: 3px; font-size: 1.1em; }						/*увеличиваем шрифт для ИмениФото*/
	ul.sitemap > li a:visited	{ color: #999!important; }
	ul.sitemap > li a:hover		{ color: Red!important; background-color: #ccc; }

div.addthis_sharing_toolbox		{display:inline-block; clear:none!important;}	/*кнопки AddThis, на JS стали добавлять clear:both*/

/* листалка по страницам */
#page_nav									{padding-top:10px; padding-bottom:20px; clear:left; text-align:center;}
  #page_nav ul								{display:inline-block; list-style:none;}
	#page_nav ul li 						{float:left;}
	  #page_nav li	span					{cursor:default;}
	  #page_nav li					> *		{
		font-weight:normal;
		position:relative;
		float:left;
		margin-left:-1px;
		-webkit-border-radius:0;
		-moz-border-radius:0;
		border-radius:0;
		display:inline-block;
		padding:6px 16px 6px;
		margin-bottom:0;
		font-size:13px;
		line-height:20px;
		color:#666;
		text-align:center;
		vertical-align:middle;
		cursor:pointer;
		background-color:#aaa;
		text-decoration:none;
		border:1px solid #444;
		-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);
		-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
		box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);
		}
		#page_nav li.next			> *		{-moz-border-radius:0px 4px 4px 0px; -webkit-border-radius:0px 4px 4px 0px; border-radius:0px 4px 4px 0px;}
		#page_nav li.prev			> *		{-moz-border-radius:4px 0px 0px 4px; -webkit-border-radius:4px 0px 0px 4px; border-radius:4px 0px 0px 4px;}
		#page_nav li.next			> *,
		#page_nav li.prev			> *		{background-color:#666; color:#fff; cursor:default; text-shadow:0 0 0;}
		  #page_nav li.next:hover	> a,
		  #page_nav li.prev:hover	> a		{background-color:#c6c6c6; color:#333;}
		#page_nav li.current		> span	{background-color:#639b3a; color:#fff; text-shadow:0 0 0;}
		#page_nav li:hover			> a		{background-color:#c6c6c6; color:#333; text-decoration:none;
		  background-position:0 -15px;
		  -webkit-transition:background-position 0.1s linear;
		  -moz-transition:background-position 0.1s linear;
		  -ms-transition:background-position 0.1s linear;
		  -o-transition:background-position 0.1s linear;
		  transition:background-position 0.1s linear;
		  }
/*========== /my ==========*/

/*========== Media Queries ==========*/
@media screen and (max-width: 480px) {
  #copyright, #gradient-top, #trade_mark { display: none; }	/*скрываем от показа */

  #logo { margin: 15px 0 0 5px; }

  #static-nav { width: 100%; margin: 0; background: #000; }	/*статический блок меню основной навигации */
	#static-nav #main-nav { position: static; margin: 0; float: none; }

  #main-nav {												/*меню основной навигации */
	  float: none;
	  margin: 0;
	  padding: 10px;
	  width: auto;
	  background: #444; }
  #main-nav-ul ul { margin: 0 auto; width: 100%; }
  /*#main-nav-ul > li	{ margin: 0 20px 0 0; display: inline; }*/	/*иначе не равняется по высоте с выпадающими списками .dropdown */
  #main-nav-ul > li > a { text-transform: none; }

  #filter-nav { margin: 6px 0px 0px 0px;					/*уменьшаем с 50 до 6, тк #main-nav становится с float:none, см камменты к #filter-nav выше */
	text-align: left; }
  #filter-nav > ul { background-color: #444; }				/*такой же фон как и у .dropdown > ul -webkit-box-shadow: #444444 */
  #filter-nav > ul > li {
	display: inline-table;
	width: 100%;
	text-align: left;
	margin-left: 5px;
	border-bottom: 1px solid black;
	*display: block; }
	#filter-nav > ul > li:last-child { border-bottom: none; }
	#filter-nav > ul > li.separator { display:none; }		/*скрываем разделители фильтров */

	/*Делаем одинаковыми по ширине, равной самому широкому: */
  #tag-dropdown		{ width: 280px; background-position: 260px 19px; }
  #place-dropdown	{ width: 280px; background-position: 260px 19px; }

  #wrapper {
	width: 100%;
	position: relative;
	margin: 10px auto;
	background: #e5e5e5; }

  #content {
	width: 100%;
	min-height: auto;
	float: none;
	padding: 0 0 70px 0;				/*60px - отступ на общую высоту footer*/
	font-family: Georgia, serif;
	font-style: normal;
	background-color: #fff;
	font-weight: 500; }
	#content h1, #content h2, #content h3, #content small { font-family: Verdana, sans-serif; font-style: normal; }
	#content p {
	  line-height: 1.4em;
	  color: #333;						/*#555;*/
	  margin-bottom: 0.5em;
	  text-align: justify;
	  text-indent: 15px; }
	#content small			 { text-transform: uppercase; color: #888; font-size: 0.75em; }
	  #content small span	 { color: #444; }
	  #content small a		 { color: #444; }
	  #content small a:hover { background-color: #fbb913; color: #000; }

  #slogan {
	display: block;
	width: 100% !important;
	height: auto;
	left: 0;
	bottom: 30px;
	margin: 0;
	padding: 8px 0;
	text-shadow: none;
	font-size: 1.1em;
	text-align: center;
	letter-spacing: 1px;
	color: #000;
	background: #fff;
	opacity: 0.6; }

  footer { background-color: #444; }
	footer #contact-info {
	  float: none;
	  padding: 10px 0;
	  margin: 0;
	  text-align: center; }
	footer a	{ color: #d2ae63; border-bottom: 1px dotted #d2ae63; }
	footer a:hover, footer a:focus, footer a:active{ border-bottom: 1px solid #d2ae63; }


  .Slider {
	padding: 2px!important;					/*отступы со всех сторон, чтобы проглядывал бэкграунд #111 */
	box-shadow: 0px 0px 5px #000!important;	/*тень вокруг */
	margin: 0 auto!important;				/*0 сверху/снизу, auto справа/слева */
	margin-bottom: 3px!important;			/*отступ снизу для обтекающего текста */
	float: none!important;					/*на мелких экранах обтекания текстом нет */
	width: 100%!important; }				/*на всю ширину */
  }

@media screen and (min-width: 481px) and (max-width: 960px) {
  #logo { margin: 15px 0 0 10px; }

  #slogan { font-size: 1em; }

  #static-nav { width: 92%; margin: 5px auto 10px auto!important; }

  #wrapper {
	width: 92%;
	position: relative;
	/*margin: 4% auto;*/
	margin: 10px auto;
	background: #e5e5e5; }

  #content {
	width: 100%;
	min-height: auto;
	float: none;
	background-color: #fff;
	padding: 2px 5% 50px 5%; }				/*50px - отступ на общую высоту footer*/

  .Slider {
  	min-width: 50%!important; 
	margin-bottom: 6px!important;			/*отступ снизу для обтекающего текста */
	margin-right: 6px!important; }			/*отступ справа для обтекющего текста */
  }

@media screen and (max-width: 700px) {
  #copyright { display: none; }

  #slogan { width: 60%; font-size: 1em; }

  #static-nav { width: 100%; margin: 0!important; background: #000; }
	#static-nav #main-nav { position: static; margin: 0; float: none; }

  #main-nav {
	float: none;
	margin: 0;
	padding: 10px;
	width: auto;
	background: #444; }
	#main-nav-ul ul { margin: 0 auto; width: 100%; }
	/*#main-nav-ul > li	{ margin: 0px 20px 0 0; display: inline; }*/ /*иначе не равняется по высоте с выпадающими списками .dropdown */
	#main-nav-ul > li > a { text-transform: none; }

  #filter-nav { margin: 6px 0px 6px 0px; }					/*уменьшаем с 50 до 6, тк #main-nav становится с float:none, см камменты к #filter-nav выше */

  .Slider {
	width: 100%!important;					/*на всю ширину окна */
	float: none!important;					/*на мелких экранах обтекания текстом нет */
	margin: 0 auto!important;				/*0 сверху/снизу, auto справа/слева */
	margin-bottom: 4px!important; }			/*отступ снизу для обтекающего текста */
  }
/*========== THE END ==========*/
.clearfix:before, .clearfix:after { content: ""; display: table; }

.clearfix:after { clear: both; }

.clearfix { *zoom: 1; }

@media print {
  * {
	background: transparent !important;
	color: black !important;
	box-shadow: none !important;
	text-shadow: none !important;
	filter: none !important;
	-ms-filter: none !important; }

  a, a:visited		{ text-decoration: underline; }

  a[href]:after		{ content: " (" attr(href) ")"; }

  abbr[title]:after	{ content: " (" attr(title) ")"; }

  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }

  pre, blockquote	{ border: 1px solid #999; page-break-inside: avoid; }

  thead				{ display: table-header-group; }

  tr, img			{ page-break-inside: avoid; }

  img				{ max-width: 100% !important; }

  @page				{ margin: 0.5cm; }

  p, h2, h3			{ orphans: 3; widows: 3; }

  h2, h3			{ page-break-after: avoid; }
  }