body { 
	margin: 20px;
	font-size: 0.9em;
	line-height: 14px;
	font-family: Tahoma, Arial;
	font-size: 11px;
	background: url(images/bckg.jpg) repeat-x scroll #fff;
	border-radius: 0 0 8px 8px;
	box-shadow: 0.4em 0.4em 30px rgba(122,122,122,0.5); 
	border-top: 1px solid #C5C5C5; border-bottom: 1px solid #C5C5C5; border-left: 1px solid #C5C5C5; border-right: 1px solid #C5C5C5; }
	@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
	body {
	margin: 20px; }
	}
a {
	color: #10639a;
	text-decoration: none; }
a:hover {
	color: #DF7401;
	text-decoration: underline; }
p { 
	padding: 5px 20px 5px 20px;
	line-height: 25px;
	font-size: 15px; }
h1 {
	font-family: Helvetica;
	margin: 0;
	padding: 10px 0 0 10px;
	text-transform: uppercase;
	font-size: 8px;
	color: #DF7401; }
h2 {
	font-family: Helvetica;
	margin: 0;
	padding: 10px 0 0 10px;
	text-transform: uppercase;
	font-size: 18px;
	color: #DF7401; }
h3 {
	font-family: Helvetica;
	margin: 0;
	padding: 5px 0 0 10px;
	font-size: 16px; 
	color: #DF7401;
	list-style: none;
	padding-left: 20px;
	background: url(images/li.gif) no-repeat 0px 4px }
kbd {
  position: relative;
  display: inline-block;
  color: #777674;
  font-weight: bold;
  text-decoration: none;
  text-shadow: rgba(255,255,255,.5) 1px 1px, rgba(100,100,100,.3) 3px 7px 3px;
  user-select: none;
  padding: 1em 2em;
  outline: none;
  border-radius: 3px / 100%;
  background-image:
   linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%),
   linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
   linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
   linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
   linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5)),
   linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5));
  background-repeat: no-repeat;
  background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
  background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
  box-shadow: rgba(0,0,0,.5) 3px 10px 10px -10px;
}
kbd:hover {
  transition: .5s linear;
  background-position: -200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
}
kbd:active {
  top: 1px;
}
abbr {
	cursor: help; }
#header {
	padding: 50px 60px 0 40px;
	height: 130px;
	background: url(images/head_bckg.jpg) no-repeat #fff; }
	@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
	#header {
	padding: 38px 46px 0 31px;
	height: 100px;
	background: url('images/head_bckg_mobile.jpg') no-repeat; }
	}
#header a {
	font-family: "Myriad Pro", "Trebuchet MS", Arial;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 20px;
	text-shadow: #000 0px -1px 7px, #fff 0px -1px 7px; }	
#logo {
	float: right;
	width: 190px;
	font-size: 20px;
	line-height: 20px;
	padding-top: 15px; }
	@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
	#logo {
	padding-top: 0px; }
	}
#menu {
	background: url(images/menu_bckg.gif) repeat-x #fff;
	height: 40px;
	padding-top: 1px;
	}
#menu_list {
	width: 600px;
	margin: 0 auto; }
#menu a {	
	text-decoration: none;
	position: relative;
	display: block;
	color: #000;
	float: left;
	font-size: 14px;
	text-transform: uppercase; 
	font-weight: bold;
	text-decoration: none;
	margin: 0 20px;
	padding-top: 12px;
	font-family: Helvetica }
#menu a:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	bottom: 0;
	left: 0;
	background-color: #DF7401;
	visibility: hidden;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s; }
#menu a:hover:before {
	visibility: visible;
	-webkit-transform: scaleX(1);
	transform: scaleX(1); } 
#text {
	margin: 0 292px 0 0;
	background: url(images/content.gif);
	padding: 40px; }
	@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
	#text {
	margin: 0; }
	}
#text li {
	list-style-image:url(images/li.gif);
	padding-left: 5px;	
	line-height: 18px;
	font-size: 13px; }
#sidebar {
	float: right;
	width: 245px;
	padding: 20px 20px 0 30px;
	font-size: 10px; }
	@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
	#sidebar {
	display: none; }
	}
#sidebar a{
	font-weight: bold; }
#sidebar h1 {
	font-family: "Myriad Pro", "Trebuchet MS", Arial;
	margin: 0;
	padding: 0 0 20px 0;
	text-transform: uppercase;
	color: #DF7401; }
#main {
	float: left;
	width: auto;
	background: url(images/sidebar_bckg.gif) no-repeat top right #fff; }
#footer {
	font-family: Helvetica;
	background: url(images/footer_bckg.gif) repeat-x #000;
	border-radius: 0 0 8px 8px;
	height: 55px;
	clear: both; }
#left_footer {
	float: left;
	padding: 20px 0 0 30px; 
	color: #fff;
	font-size: 12px; }
#left_footer a {
	color: #fff; }
#left_footer a:hover {
	text-decoration: none;
	color: #DF7401; }
#center_footer {
	float: center;
	padding: 20px 30px 0 0;
	color: #DF7401;
	font-size: 12px;
	text-align: center; }
#center_footer a {
	color: #fff; }
#fon {
	height: auto; /* задаем произвольную высоту и ширину блока */
	width: 100%;
	background-image: url('images/back-table.jpg');
	animation: animatedBackground 60s linear infinite;
	-moz-animation: animatedBackground 60s linear infinite;
	-webkit-animation: animatedBackground 60s linear infinite;
 	-o-animation: animatedBackground 60s linear infinite; 
	/* так же, как и с @keyframes, префикс -ms тут ни к чему */ }	

.card1  {
	margin: auto; }
.front1 {
	padding: 5px 0 5px 0; }
.back1 {
	padding: 5px 0 5px 0; }
.card2  {
	margin: auto; }
.front2 {
	padding: 5px 0 5px 0; }
.back2 {
	padding: 5px 0 5px 0; }
.card3  {
	margin: auto; }
.front3 {
	padding: 5px 0 5px 0; }
.back3 {
	padding: 5px 0 5px 0; }
.card4  {
	margin: auto; }
.front4 {
	padding: 5px 0 5px 0; }
.back4 {
	padding: 5px 0 5px 0; }
.splitter {
	display: block;
	float: left; }
.item img {
	background-color: #fff;
	padding: 6px;
	border: 1px solid #d0d0d0; }
.item a {
	display: block;
	float: left;
	font-size: 12px;
	color: #bd131d; }
.description {
	display: block;
	float: right;
	width: 220px;
	padding: 10px 20px 30px 0;
	line-height: 12px; }
.scrollup {
	width: 40px;
	height: 40px;
	opacity: 0.3;
	position: fixed;
	bottom: 50px;
	right: 162px;
	display: none;
	text-indent: -9999px;
	background: url('images/icon_top.png') no-repeat; }
p.additional {
	margin: 0 10px;
	color: #9c9c9c;
	font-size: 10px;
	line-height: 12px;
	border-top: 1px solid #bdbdbd;
	padding: 10px 0;
	font-weight: normal; }
p.blockquote {
	font-family: Helvetica;
    background: #f5f5f5;
    border-left: none;
	text-align: center;
    font-style: normal;
	font-size: 15px;
	line-height: 20px;
	color: #000;
    margin: 2.5em 40px;
    padding: 0.5em 10px;
	border-radius: 0px;
    box-shadow: 3px 3px 10px rgba(0,0,0,0.3); /* Параметры тени */ }
.blockquote:before {
    color: #bbb;
    content: "\201C"; /* Непечатаемый символ слева */
    font-size: 2em;
    line-height: 0.1em;
    margin-right: 0.2em;
    vertical-align: -.4em; } 
.blockquote:after {
    color: #bbb;
    content: "\201D"; /* Непечатаемый символ справа */
    font-size: 2em;
    line-height: 0.1em;
    vertical-align: -.45em; } 
.blockquote > p:first-child {
    display: inline; }
	
window.onload = function () { window.print(); }

a.tooltip {
	position: relative;
	display: inline; }
a.tooltip:after {
	display: block;
	visibility: hidden;
	position: absolute;
	bottom: 0;
	left: 20%;
	opacity: 0;
	content: attr(data-tool); /* might also use attr(title) */
	height: auto;
	min-width: 305px;
	padding: 5px 8px;
	z-index: 999;
	color: #000;
	text-decoration: none;
	text-align: center;
	font-weight: 500;
	background: rgba(0,0,0,0.85);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; }
a.tooltip:before {
	position: absolute;
	visibility: hidden;
	width: 0;
	height: 0;
	left: 50%;
	bottom: 0px;
	opacity: 0;
	content: "";
	border-style: solid;
	border-width: 6px 6px 0 6px;
	border-color: rgba(0,0,0,0.85) transparent transparent transparent; }
a.tooltip:hover:after {
	visibility: visible;
	opacity: 1; bottom: 20px; }
a.tooltip:hover:before {
	visibility: visible;
	opacity: 1;
	bottom: 14px; }
/* tips on the right */
a.tooltip.right:after {
	left: 100%;
	bottom: -45%; }
a.tooltip.right:hover:after {
	left: 110%;
	bottom: -45%; }
a.tooltip.right:before {
	border-width: 5px 10px 5px 0;
	border-color: transparent rgba(0,0,0,0.85) transparent transparent;
	left: 90%;
	bottom: 2%; }
a.tooltip.right:hover:before { left: 100%; bottom: 2%; }
/* tips on the left */
a.tooltip.left:after {
	left: auto;
	right: 100%;
	bottom: -45%; }
a.tooltip.left:hover:after {
	right: 110%;
	bottom: -45%; }
a.tooltip.left:before {
	border-width: 5px 0 5px 10px;
	border-color: transparent transparent transparent rgba(0,0,0,0.85);
	left: auto;
	right: 90%;
	bottom: 2%; }
a.tooltip.left:hover:before {
	right: 100%;
	bottom: 2%; }
a.tooltip.bottom:after {
	bottom: auto;
	top: 0; }
a.tooltip.bottom:hover:after {
	top: 28px; }
a.tooltip.bottom:before {
	border-width: 0 5px 8.7px 5px;
	border-color: transparent transparent rgba(0,0,0,0.85) transparent;
	top: 0px }
a.tooltip.bottom:hover:before {
	top: 20px; }
/* tooltip colors */
a.tooltip.blue:after {
	background: radial-gradient(#FFEA61, #FFEA61); }
a.tooltip.blue:before {
	border-color: #FFB70F transparent transparent transparent; }
a.tooltip.right.blue:before {
	border-color: transparent #FFB70F transparent transparent; }
a.tooltip.animate:after, a.tooltip.animate:before {
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out; }
ul.selected {
	width: auto; height: auto; /* Размеры */
	padding: .1em .6em; /* Отступы */
    background: transparent; /* Цвет фона */
    border: 1px solid #fff; /* Белая рамка */
    border-radius: 1px; /* Радиус скругления */
    display: inline-block;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease; }
ul.selected:hover {
	background: radial-gradient(#fff, #fff); /* Цвет фона */
    border: 1px solid #fff; /* Белая рамка */
    border-radius: 1px; /* Радиус скругления */
    display: inline-block;
	font-size: 12px;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease; }

@keyframes animatedBackground {
    0 { background-position: 0 0 
    }
    100% { background-position: -600px 600px /* анимируем свойство background-position */
    }
}
/* Mozilla Firefox 5.0+ */
@-moz-keyframes animatedBackground {
    0 { background-position: 0 0
    }
    100% { background-position: -600px 600px
    }
}
/* Safari 4.0+, Chrome 4.0+ */
@-webkit-keyframes animatedBackground {
    0 { background-position: 0 0
    }
    100% { background-position: -600px 600px
    }
}
/* Opera 12.0+ */
@-o-keyframes animatedBackground {
    0 { background-position: 0 0
    }
    100% { background-position: -600px 250px
    }
}
/* не нужно использовать префикс -ms, так как свойства keyframes и animation поддерживаются с версии IE10 без префикса */

/* Эффект для sidebar */
.view {
    width: 224px;
    height: 224px;
    margin: 0px;
    float: center;
    padding: 6px;
	border: 1px solid #d0d0d0;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;
	box-shadow: 0 0 5px rgba(0,0,0,0.5); 
}
.view .mask, .view .content {
    width: 236px;
    height: 236px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
}
.view img {
    display: block;
    position: relative;
}
.view h2 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    position: relative;
    font-size: 17px;
    padding: 10px;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0
}
.view p {
    font-family: Georgia, serif;
    font-style: italic;
    font-size: 14px;
    position: relative;
    color: #fff;
    padding: 10px 20px 20px;
    text-align: center
}
.view a.info {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: #000;
    color: #fff;
    text-transform: uppercase;
    box-shadow: 0 0 1px #000
}
.view a.info:hover {
    box-shadow: 0 0 5px #000
}
.view-first img {
    transition: all 0.2s linear;
}
.view-first .mask {
    opacity: 0;
    background-color: #DF7401;
    transition: all 0.4s ease-in-out;
}
.view-first h2 {
    transform: translateY(-100px);
    opacity: 0;
    transition: all 0.2s ease-in-out;
}
.view-first p {
    transform: translateY(100px);
    opacity: 0;
	transition: all 0.2s linear;
}
.view-first a.info{
    opacity: 0;
	transition: all 0.2s ease-in-out;
}
.view-first:hover img {
	transform: scale(1.1);
}
.view-first:hover .mask {
	opacity: 1;
}
.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
    opacity: 1;
    transform: translateY(0px);
}
.view-first:hover p {
    transition-delay: 0.1s;
}
.view-first:hover a.info {
    transition-delay: 0.2s;
}

.form label{
	width: 180px;
	float: left;
	color: #999;
}
.form input{
	width: 400px;
}
.form textarea{
	width: 400px;
}
.form textarea{
	width: 400px;
	max-width: 400px;
	min-width: 400px;
	line-height: 150%;
}
.confirm{
	float: none !important;
}
.form input[type="checkbox"]{
	width: auto;
}
.form input, .form textarea, .form select{
	padding: 9px;
	border: 1px solid #E5E5E5;
	border-radius: 5px;
}
.form input, .form textarea, .form select{
	padding: 9px;
	border: 1px solid #E5E5E5;
	border-radius: 5px;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	background: #FFF url('bg.jpg') left top repeat-x;
}
.form input:hover, .form textarea:hover, .form select:hover,
.form input:focus, .form textarea:focus, .form select:focus{
	border-color: #C9C9C9;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
}
.form p{
	margin-bottom: 20px;
}
.form label{
	width: 180px;
	float: left;
	color: #999;
	padding-top: 5px;
}
.form .submit input{
	width: auto;
	background: #617798;
	color: #FFF;
	padding: 9px 15px;
	border: 0;
	font-size: 14px;
	cursor: pointer;
}
.form .submit input:hover{
	background: #2B415E;
}
.formTextRed{
	color: red !important;
}
.formError{
	border: 1px solid red !important;
}
#messenger{
	width: 100%;
	border: gray dashed 1px;
	padding: 5px;
	background: #FFEDED;
	color: #7F5354;
	display:none;
}
.answerError{
	width: 99%;
	padding: 5px;
	border: gray dashed 1px;
	background: #FFEDED;
	color: #7F5354;
}
.answerOk{
	width: 99%;
	padding: 5px;
	border: 1px solid #ADC092;
	background: #F0FAF1;
	color: #58715E;
}

.reviews{
	float: right;
	width: 80px;
	height: 80px;
	-moz-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out; 
	transition: all 0.5s ease-in-out;
}
.reviews:hover{
	-moz-transform: rotate(-360deg);
	-webkit-transform: rotate(-360deg);
	-o-transform: rotate(-360deg);
	-ms-transform: rotate(-360deg);
	transform: rotate(-360deg);
}
.kbd:hover{
	box-shadow: 0 0 30px rgba(0,0,0,0.3); /* Параметры тени */
}
.payment-form{
	-moz-transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out; 
	transition: all 1s ease-in-out;
}
.payment-form:hover{
	-moz-transform: rotate(10deg);
	-webkit-transform: rotate(10deg);
	-o-transform: rotate(10deg);
	-ms-transform: rotate(10deg);
	transform: rotate(10deg);
}
.rise img{
 -moz-transition: all 1s ease-out;
 -o-transition: all 1s ease-out;
 -webkit-transition: all 1s ease-out;
} 
.rise img:hover{
 -webkit-transform: scale(1.1);
 -moz-transform: scale(1.1);
 -o-transform: scale(1.1);
}