/* ----------- */

*,
::before,
::after {
	box-sizing: border-box;
	margin: 0;
}


html, body {
  height: 100%;
  color: #ffffdd;
}

body {
  font-family: sans-serif;
  background-color: #000;
  /*overflow: hidden;*/
}

/*body > .scroll-box {
    position: relative;
    left: 0;
    right: 0;
    height: 100%;
    max-height: 100vh;
    overflow-y: auto;
}
*/

.page-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
}

header {
  width: 100%;
}

.content {
	width: 100%;
	line-height: 1.4em;
	padding: 15px;
	font-size: 0.8em;
}
@media screen and (max-width: 481px) {
  .content {
    line-height: 1.4em;
  }
}

@media (min-width: 1200px) {
	.content {
    width: 1170px;
	margin-right: auto;
    margin-left: auto;
	line-height: 1.4em;
	padding: 15px;
	font-size: 0.8em;
	}
}



.header1 {
	position: relative;
	text-align: center;
	overflow: hidden;
    /*position: fixed; /* Set the navbar to fixed position */
    /*top: 0; /* Position the navbar at the top of the page */
	z-index: 30;
	width: 100%;
	margin: 0 auto 10px;
	padding: 5px 0 5px 15px;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	box-sizing: border-box;
}


.h20 {
	background: rgba(112, 128, 144, 1);
}

.h21 {
	background: rgba(128, 0, 128, 1);
}
.h22 {
	background: rgba(0, 128, 128, 1);
}
.h23 {
	background: rgba(0, 128, 0, 1);
}
/* цвет хедер ДОКУМЕНТЫ  */
.h24 {
	background: rgba(255, 215, 0, 1);
	color: #000000;
}
/* цвет хедер КОНТАКТЫ */
.h25 {
	background: rgba(24, 128, 255, 1);
}
/* цвет хедер О НАС  */
.h31 {
	background: rgba(128, 0, 0, 1);
}

/* цвет хедер СПЕЦПРЕДЛОЖЕНИЯ  */
.h32 {
	background: #0000CD;
}

/* цвет хедер ВАКАНСИИ  */
.h33 {
	background: #006400;
}

/* цвет хедер ЗАКАЗЧИКИ */
.h34 {
	background: #FFFF00;
	color: #000000;
}

/* цвет хедер НОВОСТИ  */
.h35 {
	background: #ADFF2F;
	color: #000000;
}



/* слоган */
header .slogan {
  position: relative;
  z-index: 30;
  text-align: center;
  padding: 0px;
  color: #fff;
  font-size: 1.8em;
  font-weight: 700;
  width: 100%;
}

/*footer {
	position: relative;
	z-index: 30;
	padding: 0px;
	color: #fff;
	width:100%;
}
*/
  footer {
	z-index: 30;
	margin: 0;
    position: absolute;
    left: 0;
    bottom: 20px;
	width: 100%;
	color: #fff;
    /*-webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);*/
  }


.footeritem1 {
	width:150px;
	padding-left: 15px;
	font-size: 0.7em;
	text-align: left;
}
.footeritem2 {
	width:1%;
	padding: 0;
	font-size: 1.1em;
	text-align: center;
}
.footeritem3 {
	width:100px;
	padding-right: 15px;
	font-size: 0.7em;
	text-align: left;
	line-height: 1.6em;
}

header .brand {
  position: relative;
  z-index: 30;
  text-align: center;
  /*border: 5px solid #fff;*/
  border-radius: 5px;
  padding: 5px 15px 0px 10px;
  color: #fff;
  font-size: 2em;
  font-weight: 700;
  /*text-transform: uppercase;*/
  margin: 10px;
  background: rgba(0, 0, 0, 0.8);
}

@media only screen and (min-width: 769px) {
	
	header .brand {
	/*width:100%;*/
    margin: 0;
	font-size: 1.62em;
	font-weight: 700;
    position: absolute;
    left: 50%;
    top: 51%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
    header .slogan {
    margin: 0;
    position: absolute;
    left: 50%;
    top: 5%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }

}


@media only screen and (min-width: 481px) and  (max-width: 768px) {
  header .brand {
	/*width:100%;*/
    margin: 0;
	font-size: 1.2em;
	font-weight: 700;
    position: absolute;
    left: 50%;
    top: 51%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  header .slogan {
	font-size: 1.2em;
    margin: 0;
    position: absolute;
    left: 50%;
    top: 5%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }

}

@media only screen and (max-width: 480px) {
	header .slogan {
		visibility: hidden;
		display: none;
	}
	
}





main {
  width: 100%;
  height: 100%;
}
@media only screen and (min-width: 481px) {
  main {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: flex-start;
  }
}



.pages {
	position: relative;
	height: 100vh;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
	display: flex;
	flex-wrap: wrap;
	/*align-items: center;*/
	/*justify-content: center;*/
}

.nav {
  position: relative;
  height: 15%;
  /*min-width:300px;*/
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 50%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.nav:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 10;
  opacity: .6;
  transition: opacity 250ms ease-out;
}
.nav:hover:after {
  opacity: .15;
}
@media only screen and (min-width: 481px) {
  .nav {
    height: 50%;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 33%;
  }
    .pages {
    height: 100%;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 33%;
  }
  
}

/*div .content {
	padding: 15px;
	font-size: 0.8em;
}*/


div .nav1{
	width: 100%;
	position: relative;
	z-index: 20;
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: 80%;
	text-align: center;
	color: #fffc;
	font-size: 1em;
	font-weight: 700;
	text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
	transition: font-size 250ms ease-out;
}

@media only screen and (min-width: 769px) {
div .nav1 {
    font-size: 180%;
  }
  
}

/* ------------- Vovix --------------------------- */


.flex {
	display: flex;
	/*flex-flow: row wrap;*/
	justify-content:space-between;
	}
	
.flex2 {
	display: flex;
	flex-flow: row wrap;
	justify-content:center;
	} 
.item_flex2 {
	margin: 0 10px 20px 10px;
}

.item {
	padding: 10px 10px 10px 10px;
}

.text-justify {
	text-align: justify;
}
.text-center {
	text-align: center;
}

.text-left {
	text-align: left;
	padding-left: 10px; 
}
.text-right {
	text-align: right;
}

.hr-dotted {
	margin: 10px 0;
	padding: 0;
	height: 0;
	border: none;
	border-top: 2px dotted #aaa;
}


/* элемент ul li */

.list6b {
    padding:0;
    list-style: none;
	
}

.list6b li{
    padding:2px;
}
.list6b li:before {
    padding-right:10px;
    font-weight: bold;
    color: #C0C0C0;
    content: "\2714";
    transition-duration: 0.5s;
}
.list6b li:hover:before {
    color: #337AB7;
    content: "\2714";
}
	
/* обтекание картинки */

.leftimg {
    float:left; /* Выравнивание по левому краю */
    margin: 5px 7px 7px 0; /* Отступы вокруг картинки */
   }
.rightimg  {
    float: right; /* Выравнивание по правому краю  */ 
    margin: 5px 0 7px 7px; /* Отступы вокруг картинки */
   }
.centerimg  {
    float: center; /* Выравнивание по центру  */ 
    margin: 5px 7px 5px 7px; /* Отступы вокруг картинки */
   }


/* не видим для мобильных */
@media screen and (max-width: 419px) {
  .hidemobile {
    visibility: hidden;
    display: none;
  }
}
/* видим тока на мобильном */
.showmobile { display: none; }
@media only screen and (min-width : 319px) and (max-width : 420px) {
	.showmobile {
		display: inline; 
	}
}



/* основные элементы главного меню */
.w100 {
	width: 100%;
}

/* Отменяем подчеркивание у ссылки */
a { 
    text-decoration: none;
	color: inherit;
   }

/* два гравных цвета */   
.color_y {
	/*color: #dd5;*/
	color: #ffd700;
}
.color_b {
	/*color: #1E90FF;*/
	color: #1880ff;
}

/* треугольник */

#triangle-down {
	width: 0;
	height: 0; 
	background-color: #1880ff;
	border-left: 50px solid transparent;
	border-right: 50px solid transparent;
	border-top: 100px solid red;
}

/* кнопка */

.button {
    background-color: #1880ff; /* мой */
    border: none;
    color: white;
    padding: 14px 12px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
}

.button1:hover {
    background-color: white; 
    color: black; 
    /*border: 2px solid #1880ff;*/
}

.button1 {
    background-color: #1880ff;
    color: white;
}

.button2 {
    background-color: white; 
    color: black; 
    /*border: 2px solid #1880ff;*/
}

.button2:hover {
    background-color: #1880ff;
    color: white;
}



/* --------------   таблица складывается */
.rwd-table {
  margin: 1em 0;
  min-width: 300px;
  padding: 1em;
  opacity: .8;
}
.rwd-table tr {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.rwd-table th {
  display: none;
}
.rwd-table td {
  display: block;
}
.rwd-table td:first-child {
  padding-top: .5em;
}
.rwd-table td:last-child {
  padding-bottom: .5em;
}
.rwd-table td:before {
  content: attr(data-th) ": ";
  font-weight: bold;
  width: 6.5em;
  display: inline-block;
}
@media (min-width: 350px) {
  .rwd-table td:before {
    display: none;
  }
}
.rwd-table th, .rwd-table td {
  text-align: left;
}
@media (min-width: 350px) {
  .rwd-table th, .rwd-table td {
    display: table-cell;
    padding: .25em .5em;
  }
  .rwd-table th:first-child, .rwd-table td:first-child {
    padding-left: 0;
  }
  .rwd-table th:last-child, .rwd-table td:last-child {
    padding-right: 0;
  }
}

/*#1D1E22; #252F48;*/

.rwd-table {
  background: #312D3C;
  color: #fff;
  border-radius: .4em;
  overflow: hidden;
}
.rwd-table tr {
  border-color: #46637f;
}
.rwd-table th, .rwd-table td {
  margin: .5em 1em;
}
@media (min-width: 480px) {
  .rwd-table th, .rwd-table td {
    padding: 1em !important;
  }
}
.rwd-table th, .rwd-table td:before {
  color: #ffd700;
}

/*CSS-свойства для заднего фона*/
.iw-modal {
	opacity: 0; /*изначально этот блок должен быть прозрачным*/ 
	background: rgba(0,0,0,0.7); /*задаём цвет фона*/
	pointer-events: none; /*делаем чтобы по элементу нельзя было кликнуть когда он прозрачный*/
	position: fixed; 
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9999;
	transition: all 0.5s ease;
	margin: 0;
	padding: 0;
}
.iw-modal:target {
	opacity: 1; /*при клике блок становится видимым*/
	pointer-events: auto; /*теперь по блоку можно кликать мышкой*/
	overflow-y: auto; /*прокрутка по вертикли страницы*/
}
.iw-modal-wrapper {
	margin:auto; /*выравниваем модальное окно по центру по горизонтали*/
	margin-top:25vh; /*отступ сверху можно задавать в px, % или vh*/
}
/*CSS-свойства для блока, содержащего контент модального окна */ 
.iw-CSS-modal-inner {
	position: relative;
	background: #fff; /*цвет фона*/
	border: 1px solid #ccc; /*цвет и толщина рамки*/
	border-radius: 0px; /*радиус скругления углов*/
}
/*CSS-свойства заголовка модального окна */
.iw-modal-header {
	padding: 15px;/*внутренний отступ*/
	background:#f1f1f1;/*цвет фона*/
	position:relative;
	text-align: center;
}
.iw-modal-title {
	font-size: 18px; /*размер шрифта*/
	color:#555; /*цвет шрифта*/
	font-weight:bold; /*жирность шрифта*/
	line-height: 1.5; /*высота строки*/
	margin-top: 0;
	margin-bottom: 0;
}
/*CSS для кнопки закрытия*/
.iw-close {
	position:absolute;
	top:15px; /*отступ сверху*/
	right:10px; /*отступ справа*/
	font-size: 24px; /*размер шрифта*/
	color: #555; /*цвет шрифта*/
	text-decoration: none;
}
.iw-close:hover, .iw-close:focus {
	color: #000; /*цвет шрифта при наведении*/
	cursor: pointer;
}
/*CSS для блока с текстом*/
.iw-modal-text {
	padding: 15px 20px; /*внутренний отступ*/
	color: #111;
}
/**MEDIA**/
@media (min-width: 550px) {
	.iw-modal-wrapper {
		max-width: 280px;
	}
}

.iw-CSS-modal-inner .iw-modal-text form input {
  color: #000;
  padding: 15px;
  border: none;
  margin-bottom: 15px;
  box-shadow: 0px 1px 3px 1px #e9e9e9;
  font-size: 15px;
  width:100%;
}

/* другой вариант */
.modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.7);
    z-index: 1000;
 
}
.modal .modal_content {
    background-color: #ffd700;
    margin: 15% auto;
    padding: 10px;
    border: 1px solid #888;
    width: 80%;
	max-width: 300px;
    z-index: 99999;
	color:#111;
       border-radius: 10px;
}
.modal .modal_content .close_modal_window {
    color: #111;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}


.modal .modal_content form input {

  padding: 15px;
  border: none;
  margin-bottom: 15px;
  box-shadow: 0px 1px 3px 1px #e9e9e9;
  font-size: 15px;
  width:100%;
}

/* сердечко */
			.heart {
			  position: relative;
			  display: inline-block;
			  color: #1E90FF;
			  animation: hearts 0.6s cubic-bezier(0.18, 0.89, 0.29, 1.05) infinite;
			}

			@-moz-keyframes hearts {
			  50% {
				transform: scale(1.4);
			  }
			}
			@-webkit-keyframes hearts {
			  50% {
				transform: scale(1.4);
			  }
			}
			@-o-keyframes hearts {
			  50% {
				transform: scale(1.4);
			  }
			}
			@keyframes hearts {
			  50% {
				transform: scale(1.4);
			  }
			}

/* всплывающие подсказки */

.tooltip {
    z-index: 9999;
	position: absolute;
	display: none;
	top: 0px;
	left: 0px;
	background-color: #1880ff;;
	padding: 5px 10px 5px 10px;
	opacity: 0.8;
	border-radius: 5px;
	color: #111;
  }
.tooltip::after{
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border: 10px solid;
	border-color: transparent transparent #1880ff; transparent;
	bottom: 100%;
	left: 90%;
	margin-left: -10px;
}

/* отключение выделения при фокусе */
:active,:hover,:focus{outline:0;outline-offset:0}

/* очистка от будет переполнения */
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}


/* -------------- меню с секурити ------------------------*/

@keyframes checked-anim {
    50% {
        width: 100%;
        height: 100%;
    }
    100% {
        width: 100%;
        height: 100%;
        border-radius: 0;
    }
}
@keyframes not-checked-anim {
    0% {
        width: 3000px;
        height: 3000px;
    }
}
#menu li, .aaa {
    margin: 15px 0 -23px 7%;
    color: #fff;
    font: 14pt "Roboto", sans-serif;
    font-weight: 700;
    line-height: 1.8;
    text-decoration: none;
    text-transform: none;
    list-style: none;
    outline: 0;
    display: none;
	padding: 10px;
    width:100%;
	
}
#menu li {
    width: 270px;
    text-indent: 10px;
}


#trigger, #burger, #burger:before, #burger:after {
    position: absolute;
    top: 15px;
    left: 15px;
    background: #eee;
    width: 30px;
    height: 5px;
    transition: .2s ease;
    cursor: pointer;
    z-index: 40;
}
#trigger {
    height: 25px;
    background: none;
}
#burger:before {
    content: " ";
    top: 10px;
    left: 0;
}
#burger:after {
    content: " ";
    top: 20px;
    left: 0;
}
#menu-toggle:checked + #trigger + #burger {
    top: 25px;
    transform: rotate(180deg);
    transition: transform .2s ease;
}

#menu-toggle:checked + #trigger + #burger:before {
    width: 20px;
    top: -2px;
    left: 18px;
    transform: rotate(45deg) translateX(-5px);
    transition: transform .2s ease;
}
#menu-toggle:checked + #trigger + #burger:after {
    width: 20px;
    top: 2px;
    left: 18px;
    transform: rotate(-45deg) translateX(-5px);
    transition: transform .2s ease;
}

#menu {
		position: absolute;
		margin: 0; padding: 0;
		width: 0px;
		height: 0px;
		background:
			radial-gradient(#000 15%, transparent 16%) 0 0,
			radial-gradient(#000 15%, transparent 16%) 8px 8px,
			radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
			radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
		background-color:#282828;
		background-size:16px 16px;
		box-shadow: 0 2px 5px rgba(0,0,0,0.8);
		/*animation: not-checked-anim 3s both;*/
		transition: 0.6s;
		z-index: 35;
	}


@media only screen and (min-width: 481px) {
	#menu {
		position: absolute;
		margin: 0; padding: 0;
		width: 110px;
		height: 110px;
		background-image: url("/lk_img/Image_1.jpg");
		background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
		/*background-color: #fff;*/
		border-bottom-right-radius: 100%;
		box-shadow: 0 2px 5px rgba(0,0,0,0.8);
		/*animation: not-checked-anim .2s both;*/
		transition: .2s;
		z-index: 35;
	}
}
#menu-toggle:checked + #trigger + #burger + #menu {
   animation: checked-anim 1s ease both;
    
}
#menu-toggle:checked + #trigger ~ #menu > li, .aaa {
    display: block;
}
[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    display: none;
}

/* ------------------ слайд типа ------------ */

.mySlides {display: none}
/*img {vertical-align: middle;}*/

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 0px 12px;
  /*position: absolute;
  top: -16px;*/
  text-align: center;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

@media (max-width: 481px) {
	#dots {
		position: absolute;
		bottom: 150px;
		margin: auto;
		text-align:center;
		width: 100%;
	}
}


.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}


/* -----------------  карточки спецпредложений -----------------*/

.card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  max-width: 300px;
  min-width: 245px;
  margin: auto;
  text-align: center;
  font-family: arial;
  line-height: 1.6em;
	overflow: hidden;
	border-radius: 8px;
    -moz-border-radius: 8px;
	-webkit-border-radius: 8px;
}

.card_title {
  color: grey;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
}

.card_subtitle {
	text-align: center;
	font-size: 1.1em;
}

.card_body {
	padding-left: 8px;
}

.card_button {
  border: none;
  outline: 0;
  display: inline-block;
  padding: 8px;
  color: white;
  /*background-color: #1880ff;*/
  text-align: center;
  cursor: pointer;
  width: 100%;
  font-size: 18px;
}


.card_a {
  text-decoration: none;
  font-size: 22px;
  color: black;
}

.card_a:hover, .card_button:hover {
  opacity: 0.5;
}

/*-------------------- вкладки ------------------*/

.tablink {
    background-color: #555;
    color: white;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    font-size: 12px;
    width: 33.33%;
}

.tablink:hover {
    background-color: #777;
}

/* Style the tab content */
.tabcontent {
    color: white;
    display: none;
	
    padding: 50px 15px 15px 15px;
    /*text-align: center;*/
}

#LK1 {background-color:rgba(24, 128, 255, 0.5);}
#LK2 {background-color:rgba(255, 215, 0, 0.5);}
#LS {background-color:rgba(0, 128, 0, 0.5);}

/* ----------------- треугольник --------------------*/
.down_v {
  width: 0px;
  height: 0px;
  border-style: inset;
  border-width: 0px 150px 173.2px 150px;
  border-color: transparent transparent #000000 transparent;
  float: left;
  transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  /*opacity: 0.8;*/
}

.down_v p {
  color:#fff;
  text-align: center;
  top: 80px;
  left: -127px;
  position: relative;
  width: 250px;
  height: 93px;
  margin: 0px;
    transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}

/* --------------- объёмные кнопки ------------------*/
.button3 {
background: #000000;
padding: 7px 30px;
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
text-align: center;
border: solid 1px #73C8F0;
cursor: pointer;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
background: -moz-linear-gradient(0% 100% 90deg, #030E32, #73C2FD);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#73C2FD), to(#030E32));
box-shadow: inset 0 1px 0 0 #FFFFFF;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
border-bottom: 1px solid rgba(0,0,0,0.25); 
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
}
	
.button3:hover { 
background: #2E69E3; 
background: -moz-linear-gradient(0% 100% 90deg, #2E69E3, #59C2FF);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#59C2FF), 
to(#2E69E3));
}

.button3:active {
background: #2E69E3; 
background: -moz-linear-gradient(0% 100% 90deg, #2E69E3, #59C2FF);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#59C2FF), 
to(#2E69E3));
box-shadow: inset 1px 1px 0 0 #004A7F;
-moz-box-shadow: inset 1px 1px 0 0 #004A7F;
-webkit-box-shadow: inset 1px 1px 0 0 #004A7F;
padding: 8px 29px 6px 31px;
}


/* -------------------- еще кнопка --------------------------*/

.shiny-button {
  display: inline-block;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.1em;
  font-weight: normal;
  font-family: sans-serif;
  color: #FFFFFF;
  font-size: 12px;
  background-color: #0042BF;
  background-image: -webkit-linear-gradient(top, #0044c4 0%, #1757d1 48%, #0042BF 49%, #0042BF 82%, #004cdb 100%);
  background-image: -moz-linear-gradient(top, #0044c4 0%, #1757d1 48%, #0042BF 49%, #0042BF 82%, #004cdb 100%);
  background-image: -o-linear-gradient(top, #0044c4 0%, #1757d1 48%, #0042BF 49%, #0042BF 82%, #004cdb 100%);
  background-image: linear-gradient(top, #0044c4 0%, #1757d1 48%, #0042BF 49%, #0042BF 82%, #004cdb 100%);
  border-color: hsl(219, 36%, 37%);
  -webkit-box-shadow: inset 0 0 1px 1px #216eff, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 0 1px 1px #216eff, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 0 1px 1px #216eff, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  -webkit-text-shadow: 1px 1px 1px #001f59;
  -moz-text-shadow: 1px 1px 1px #001f59;
  -o-text-shadow: 1px 1px 1px #001f59;
  text-shadow: 1px 1px 1px #001f59;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 12px 12px 12px 12px;
  cursor: pointer;
}

.shiny-button strong {
  letter-spacing: 1px;
  font-size: 17px;
}

.shiny-button:hover {
  color: #FFFFFF;
  background-color: #0047ce;
  background-image: -webkit-linear-gradient(top, #0049d3 0%, #195dde 48%, #0047ce 49%, #0047ce 82%, #0051ea 100%);
  background-image: -moz-linear-gradient(top, #0049d3 0%, #195dde 48%, #0047ce 49%, #0047ce 82%, #0051ea 100%);
  background-image: -o-linear-gradient(top, #0049d3 0%, #195dde 48%, #0047ce 49%, #0047ce 82%, #0051ea 100%);
  background-image: linear-gradient(top, #0049d3 0%, #195dde 48%, #0047ce 49%, #0047ce 82%, #0051ea 100%);
  border-color: hsl(219, 37%, 40%);
  -webkit-box-shadow: inset 0 0 1px 1px #2b74ff, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 0 1px 1px #2b74ff, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 0 1px 1px #2b74ff, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  -webkit-text-shadow: 1px 1px 1px #002468;
  -moz-text-shadow: 1px 1px 1px #002468;
  -o-text-shadow: 1px 1px 1px #002468;
  text-shadow: 1px 1px 1px #002468;
}

.shiny-button:active {
  color: #FFFFFF;
  background-color: #003db0;
  background-image: -webkit-linear-gradient(top, #0039a6 0%, #0042BF 100%);
  background-image: -moz-linear-gradient(top, #0039a6 0%, #0042BF 100%);
  background-image: -o-linear-gradient(top, #0039a6 0%, #0042BF 100%);
  background-image: linear-gradient(top, #0039a6 0%, #0042BF 100%);
  padding: 12px 12px 12px 12px;
}


/* ----------- таже кнопка только желтая --------------*/

.shiny-button-y {
  display: inline-block;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.1em;
  font-weight: normal;
  font-family: sans-serif;
  color: #000;
  font-size: 12px;
  background-color: #ffd700;
  background-image: -webkit-linear-gradient(top, #ffd805 0%, #eacf3e 48%, #ffd700 49%, #ffd700 82%, #ffdb1c 100%);
  background-image: -moz-linear-gradient(top, #ffd805 0%, #eacf3e 48%, #ffd700 49%, #ffd700 82%, #ffdb1c 100%);
  background-image: -o-linear-gradient(top, #ffd805 0%, #eacf3e 48%, #ffd700 49%, #ffd700 82%, #ffdb1c 100%);
  background-image: linear-gradient(top, #ffd805 0%, #eacf3e 48%, #ffd700 49%, #ffd700 82%, #ffdb1c 100%);
  border-color: hsl(51, 36%, 32%);
  -webkit-box-shadow: inset 0 0 1px 1px #ffe661, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 0 1px 1px #ffe661, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 0 1px 1px #ffe661, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  -webkit-text-shadow: 1px 1px 1px #998100;
  -moz-text-shadow: 1px 1px 1px #998100;
  -o-text-shadow: 1px 1px 1px #998100;
  text-shadow: 1px 1px 1px #998100;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 12px 12px 12px 12px;
  cursor: pointer;
}

.shiny-button-y strong {
  letter-spacing: 1px;
  font-size: 17px;
}

.shiny-button-y:hover {
  color: #000;
  background-color: #ffd90f;
  background-image: -webkit-linear-gradient(top, #ffda14 0%, #ebd24c 48%, #ffd90f 49%, #ffd90f 82%, #ffdd2b 100%);
  background-image: -moz-linear-gradient(top, #ffda14 0%, #ebd24c 48%, #ffd90f 49%, #ffd90f 82%, #ffdd2b 100%);
  background-image: -o-linear-gradient(top, #ffda14 0%, #ebd24c 48%, #ffd90f 49%, #ffd90f 82%, #ffdd2b 100%);
  background-image: linear-gradient(top, #ffda14 0%, #ebd24c 48%, #ffd90f 49%, #ffd90f 82%, #ffdd2b 100%);
  border-color: hsl(51, 36%, 35%);
  -webkit-box-shadow: inset 0 0 1px 1px #ffe870, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 0 1px 1px #ffe870, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 0 1px 1px #ffe870, 0 0 1px 3px rgba(0, 0, 0, 0.15);
  -webkit-text-shadow: 1px 1px 1px #a88d00;
  -moz-text-shadow: 1px 1px 1px #a88d00;
  -o-text-shadow: 1px 1px 1px #a88d00;
  text-shadow: 1px 1px 1px #a88d00;
}

.shiny-button-y:active {
  color: #000;
  background-color: #f0ca00;
  background-image: -webkit-linear-gradient(top, #e6c100 0%, #ffd700 100%);
  background-image: -moz-linear-gradient(top, #e6c100 0%, #ffd700 100%);
  background-image: -o-linear-gradient(top, #e6c100 0%, #ffd700 100%);
  background-image: linear-gradient(top, #e6c100 0%, #ffd700 100%);
  padding: 12px 12px 12px 12px;
}


/* ----------- foto FLICR ------- */

.flickr_badge img {
    width: 47px;
    height: 47px;
    float: left;
	margin: 10px 5px 10px 5px;
}
 /*----------- эффект появления текста в слогане ------------*/
.sp-container {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 0;
	background: -webkit-radial-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3) 35%, rgba(0, 0, 0, 0.7));
	background: -moz-radial-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3) 35%, rgba(0, 0, 0, 0.7));
	background: -ms-radial-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3) 35%, rgba(0, 0, 0, 0.7));
	background: radial-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3) 35%, rgba(0, 0, 0, 0.7));
}
.sp-content {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	z-index: 1000;
}
.sp-container h2 {
	position: absolute;
	top: 50%;
	line-height: 3em;
	height: 90px;
	margin-top:-25px;
	font-size: 1em;
	width: 100%;
	text-align: center;
	color: transparent;
	-webkit-animation: blurFadeInOut 3s ease-in backwards;
	-moz-animation: blurFadeInOut 3s ease-in backwards;
	-ms-animation: blurFadeInOut 3s ease-in backwards;
	animation: blurFadeInOut 3s ease-in backwards;
}
.sp-container h2.frame-1 {
	-webkit-animation-delay: 0s;
	-moz-animation-delay: 0s;
	-ms-animation-delay: 0s;
	animation-delay: 0s;
}
.sp-container h2.frame-2 {
	-webkit-animation-delay: 3s;
	-moz-animation-delay: 3s;
	-ms-animation-delay: 3s;
	animation-delay: 3s;
}
.sp-container h2.frame-3 {
	-webkit-animation-delay: 6s;
	-moz-animation-delay: 6s;
	-ms-animation-delay: 6s;
	animation-delay: 6s;
}
.sp-container h2.frame-4 {
	/*font-size: 200px;*/
	-webkit-animation-delay: 9s;
	-moz-animation-delay: 9s;
	-ms-animation-delay: 9s;
	animation-delay: 9s;
}
.sp-container h2.frame-5 {
	-webkit-animation: none;
	-moz-animation: none;
	-ms-animation: none;
	animation: none;
	color: transparent;
	text-shadow: 0px 0px 1px #fff;
}
.sp-container h2.frame-5 span {
	-webkit-animation: blurFadeIn 3s ease-in 11s backwards;
	-moz-animation: blurFadeIn 3s ease-in 11s backwards;
	-ms-animation: blurFadeIn 3s ease-in 11s backwards;
	animation: blurFadeIn 3s ease-in 11s backwards;
	color: transparent;
	text-shadow: 0px 0px 1px #fff;
}
.sp-container h2.frame-5 span:nth-child(2) {
	-webkit-animation-delay: 12s;
	-moz-animation-delay: 12s;
	-ms-animation-delay: 12s;
	animation-delay: 12s;
}
.sp-container h2.frame-5 span:nth-child(3) {
	-webkit-animation-delay: 13s;
	-moz-animation-delay: 13s;
	-ms-animation-delay: 13s;
	animation-delay: 13s;
}
.sp-container h2.frame-5 span:nth-child(4) {
	-webkit-animation-delay: 14s;
	-moz-animation-delay: 14s;
	-ms-animation-delay: 14s;
	animation-delay: 14s;
}

.sp-circle-link {
	position: absolute;
	left: 50%;
	bottom: 100px;
	margin-left: -50px;
	text-align: center;
	line-height: 100px;
	width: 100px;
	height: 100px;
	background: #fff;
	color: #3f1616;
	font-size: 25px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	-webkit-animation: fadeInRotate 1s linear 16s backwards;
	-moz-animation: fadeInRotate 1s linear 16s backwards;
	-ms-animation: fadeInRotate 1s linear 16s backwards;
	animation: fadeInRotate 1s linear 16s backwards;
	-webkit-transform: scale(1) rotate(0deg);
	-moz-transform: scale(1) rotate(0deg);
	-o-transform: scale(1) rotate(0deg);
	-ms-transform: scale(1) rotate(0deg);
	transform: scale(1) rotate(0deg);
}
.sp-circle-link:hover {
	background: #85373b;
	color: #fff;
}
/**/

@-webkit-keyframes blurFadeInOut {
	0% {
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		/*-webkit-transform: scale(1.3);*/
	}
	20%, 75% {
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		/*-webkit-transform: scale(1);*/
	}
	100% {
		opacity: 0;
		text-shadow: 0px 0px 50px #fff;
		/*-webkit-transform: scale(0);*/
	}
}
@-webkit-keyframes blurFadeIn {
	0% {
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		/*-webkit-transform: scale(1.3);*/
	}
	50% {
		opacity: 0.5;
		text-shadow: 0px 0px 10px #fff;
		/*-webkit-transform: scale(1.1);*/
	}
	100% {
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		/*-webkit-transform: scale(1);*/
	}
}
@-webkit-keyframes fadeInBack {
	0% {
		opacity: 0;
		-webkit-transform: scale(0);
	}
	50% {
		opacity: 0.4;
		-webkit-transform: scale(2);
	}
	100% {
		opacity: 0.2;
		-webkit-transform: scale(5);
	}
}
@-webkit-keyframes fadeInRotate {
	0% {
		opacity: 0;
		-webkit-transform: scale(0) rotate(360deg);
	}
	100% {
		opacity: 1;
		-webkit-transform: scale(1) rotate(0deg);
	}
}
/**/

@-moz-keyframes blurFadeInOut {
	0% {
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		/*-moz-transform: scale(1.3);*/
	}
	20%, 75% {
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		/*-moz-transform: scale(1);*/
	}
	100% {
		opacity: 0;
		text-shadow: 0px 0px 50px #fff;
		/*-moz-transform: scale(0);*/
	}
}
@-moz-keyframes blurFadeIn {
	0% {
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		/*-moz-transform: scale(1.3);*/
	}
	100% {
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		/*-moz-transform: scale(1);*/
	}
}
@-moz-keyframes fadeInBack {
	0% {
		opacity: 0;
		-moz-transform: scale(0);
	}
	50% {
		opacity: 0.4;
		-moz-transform: scale(2);
	}
	100% {
		opacity: 0.2;
		-moz-transform: scale(5);
	}
}
@-moz-keyframes fadeInRotate {
	0% {
		opacity: 0;
		-moz-transform: scale(0) rotate(360deg);
	}
	100% {
		opacity: 1;
		-moz-transform: scale(1) rotate(0deg);
	}
}
/**/

@keyframes blurFadeInOut {
	0% {
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		/*transform: scale(1.3);*/
	}
	20%, 75% {
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		/*transform: scale(1);*/
	}
	100% {
		opacity: 0;
		text-shadow: 0px 0px 50px #fff;
		/*transform: scale(0);*/
	}
}
@keyframes blurFadeIn {
	0% {
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		/*transform: scale(1.3);*/
	}
	50% {
		opacity: 0.5;
		text-shadow: 0px 0px 10px #fff;
		/*transform: scale(1.1);*/
	}
	100% {
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		/*transform: scale(1);*/
	}
}
@keyframes fadeInBack {
	0% {
		opacity: 0;
		transform: scale(0);
	}
	50% {
		opacity: 0.4;
		transform: scale(2);
	}
	100% {
		opacity: 0.2;
		transform: scale(5);
	}
}
@keyframes fadeInRotate {
	0% {
		opacity: 0;
		transform: scale(0) rotate(360deg);
	}
	100% {
		opacity: 1;
		transform: scale(1) rotate(0deg);
	}
}