@import "reset.css";

/* All
---------------------------------------*/
HTML,
BODY {
	height:100%;
	width:100%;
	}
BODY {
	background:#f6f5ed url('bg.top.gif') 0 0 repeat-x;
	font:12px/20px Arial, sans-serif;
	}
A {color:#000;}
A:hover {text-decoration:none;}
A.flashLink {
	border-bottom:1px dashed;
	text-decoration:none;
	}
	A.flashLink:hover {border-bottom:none;}
.none {display:none;}
.clear {clear:both;}
.clear-left {clear:left;}
.f-left {float:left;}
.f-right {float:right;}
INPUT[type=text].error,
INPUT[type=text].error:focus,
TEXTAREA.error,
TEXTAREA.error:focus {
	background:#fff0f0;
	border:1px solid #f99;
	}

/* Container
---------------------------------------*/
#container {
	min-height:100%;
	position:relative;
	margin:0 auto;
	width:990px;
	}
	#container .empty {
		clear:both;
		height:167px;
		}

/* Глобальные блоки
---------------------------------------*/
/* Content */
#content {
	clear:both;
	padding:0 25px;
	}
	.content-without-Bg {
		height:1%;
		overflow:hidden;
		padding:12px 30px 22px 30px;
		}
		.content-without-Bg #sidebar {
			padding-right:0;
			width:290px;
			}
	.content-with-Bg {
		background:#fff;
		height:1%;
		overflow:hidden;
		padding:26px 0 26px 30px;
		margin-bottom:63px;
		}
		.content-with-Bg A {color:#1180de;}
			.content-with-Bg A:hover {color:#c34500;}

/* Main */
#main {
	float:left;
	width:100%;
	margin-right:-320px;
	}
	#main-inner {
		padding-right:35px;
		margin-right:320px;
		}

/* Sidebar */
#sidebar {
	float:right;
	padding-right:30px;
	width:290px;
	}

/* Footer */
#footer {
	background:url('bg.footer.gif') 0 0 repeat-x;
	clear:both;
	margin-top:-167px;
	overflow:hidden;
	position:relative;
	height:167px;
	width:100%;
	}
	#footer A {color:#1180de;}
	#footer .footer-inner {
		padding:25px 55px;
		margin:0 auto;
		width:880px;
		}
	#footer .copyright {
		color:#6e6e6e;
		padding-top:4px;
		float:left;
		width:270px;
		}
	#footer a#schoolart-vk, .blog-post a#schoolart-vk {
		background:url(sa.vk.gif) no-repeat;
		display:block;
		height:21px;
		margin-top:34px;
		width:110px;
		}
		#footer a#schoolart-vk:hover, .blog-post a#schoolart-vk:hover {background-position:0 -21px;}
		#footer a#schoolart-vk:active, .blog-post a#schoolart-vk:active {background-position:0 -42px;}
	#footer .contacts {
		color:#6e6e6e;
		line-height:24px;
		float:left;
		width:320px;
		}
		#footer .contacts BIG {font-size:20px;}
		#footer .contacts P {padding:0 0 11px;}
		#footer .contacts UL LI {line-height:22px;}
	.made-web-studio-kiwi {
		float:left;
		line-height:18px;
		padding:5px 0 0;
		width:280px;
		}
		.made-web-studio-kiwi IMG {
			float:left;
			margin:4px 20px 0 0;
			}

/* Кнопки */
A.button {
	background:url(button-bg.png) repeat-x;
	color:#7f3600;
	display:inline-block;
	font-size:15px;
	line-height:35px;
	overflow:hidden;
	padding:0 15px;
	position:relative;
	text-align:center;
	text-decoration:none;
	}
	A.button:hover {
		background-position:0 -33px;
		color:#c34500;
		}
	A.button:focus {
		background-position:0 -66px;
		color:#e55100;
		}
	A.button.inactive {
		background-position:0 -99px;
		color:#d8bc8c;
		cursor:default;
		}
	A.button.process {
		background:url(button-process.gif) repeat-x;
		color:#d8bc8c;
		cursor:default;
		}
	A.button .cn {
		background:url(button-mask.png) repeat-x;
		display:block;
		height:80px;
		left:-11px;
		position:absolute;
		top:0;
		width:100%;
		}
		a.button .cn.tr {margin-left:100%;}
A.button.done {background-image:url(button-done-bg.png);}
A.add {
	background:url(add.png) no-repeat;
	color:#5cad00;
	display:inline-block;
	font:12px Arial, Helvetica, Sans-Serif;
	margin:0 0 25px 20px;
	padding:0 13px 1px 24px;
	}
	A.add:hover {
		background:url(add.png) 0 -16px no-repeat;
		color:#68c400;
		}

/* Заголовки
---------------------------------------*/
.content-with-Bg H1 {
	font:20px Arial;
	margin:0 0 21px;
	}
.content-with-Bg H2 {
	font:18px Arial;
	margin:0 0 7px;
	}

/* Блоки контента
---------------------------------------*/
/* Logo */
#logo {
	display:block;
	color:#333;
	font:34px Tahoma;
	position:absolute;
	letter-spacing:1px;
	text-decoration:none;
	height:53px;
	width:157px;
	top:42px;
	left:54px;
	}
	#logo A {
		cursor:pointer;
		}
	#logo B {
		background:url('logotype.gif') 0 0 no-repeat;
		display:block;
		height:53px;
		position:absolute;
		left:0;
		top:0;
		width:157px;
		}

/* Навигация */
.navigation {
	color:#c34500;
	font:bold 14px Arial;
	padding:16px 0 61px 245px;
	}
	.navigation A.login {
		font-size:12px;
		font-weight:normal;
		margin:1px 24px 0 0;
		float:right;
		}
	#switcher {
		font-size:12px;
		font-weight:normal;
		margin-left:20px;
		}
	#user-menu {
		float:right;
		padding-right:25px;
		padding-top:1px;
		}
		#user-menu LI {
			font-size:12px;
			font-weight:normal;
			float:left;
			padding-left:14px;
			}
			#user-menu LI#logout {padding-left:30px;}
		#user-menu A {color:#000;}
	.navigation LI A.active {
		color:#c34500;
		text-decoration:none;
		}
	.navigation .navigation-sub LI A.active {font-weight:bold;}
	.navigation LI A:hover {color:#ff8a00;}
	.navigation .navigation-main {
		height:1%;
		overflow:hidden;
		padding-top:19px;
		}
		.navigation .navigation-main LI {
			float:left;
			padding:3px 0 5px 20px;
			}
		.navigation .navigation-main LI.navigation-ico-home {margin:-3px -4px 0 0;}
	.navigation .navigation-sub {
		clear:both;
		font:12px Arial;
		height:1%;
		overflow:hidden;
		margin:0 0 -26px 61px;
		position:relative;
		}
		.navigation .navigation-sub LI {
			font-weight:bold;
			float:left;
			padding:11px 18px 0 0;
			}
			.navigation .navigation-sub LI A {font-weight:normal;}

/* Блок на главной */
.mainBox {
	padding:29px 35px 0 560px;
	position:relative;
	margin:-9px 0 43px;
	}
	.mainBox H1 {
		font:bold 25px Arial;
		margin:0 0 11px;
		}
	.mainBox P {padding:0 0 20px;}
	.mainBox P A {text-decoration:none;}
	.mainBox .mainIllustration {
		position:absolute;
		top:0;
		left:-25px;
		height:600px;
		width:620px;
		z-index:-1;
		}
	.mainBox .mainBox-albumIllustration {
		background:url('main.albumIllustration.png') 0 0 no-repeat;
		position:absolute;
		top:-25px;
		left:205px;
		height:330px;
		width:390px;
		z-index:-1;
		}
	.mainBox .quote {margin:36px 0 0 -160px;}
	.mainBox .quote-autor {margin-left:-160px;}

/* Цитата */
.quote {
	font-size:13px;
	position:relative;
	width:510px;
	}
	.quote P {padding:0 !important;}
	.quote .quote-topBg {
		background:url('quote.topBg.png') 0 0 no-repeat;
		height:18px;
		overflow:hidden;
		}
	.quote .quote-inner {
		background:#fff;
		padding:0 23px 3px 25px;
		}
	.quote .quote-bottomBg {
		background:url('quote.bottomBg.png') 0 0 no-repeat;
		height:18px;
		overflow:hidden;
		}
	.quote .quote-corner {
		background:url('quote.corner.png') 0 0 no-repeat;
		position:absolute;
		top:30px;
		left:-46px;
		height:20px;
		width:46px;
		z-index:-1;
		}
.quote-autor {
	color:#5a5856;
	line-height:22px;
	padding:10px 0 10px 25px;
	}

/* Интересное */
#cat-int {
	background:#fff url(catalog-bg.png) repeat-y;
	margin-bottom:40px;
	position:relative;
	}

.int {
	display:inline-block;
	zoom:1;
	*display:inline;
	height:1%;
	overflow:hidden;
	padding:24px 5px 24px 67px;
	position:relative;
	width: 375px;
	vertical-align: top;
	}
	.int H2 {
		font:20px Arial;
		margin:9px 0 28px;
		}
	.int H3 {
		font:bold 14px Arial;
		margin:4px 0 8px;
		line-height: 22px;
		}
	.int H3 A {color:#1180de;}

/* Каталог альбомов (на главной) */
.albumCatalog {
	display:inline-block;
	zoom:1;
	*display:inline;
	height:1%;
	overflow:hidden;
	padding:24px 5px 24px 30px;
	position:relative;
	width: 455px;
	vertical-align: top;
	}
	.albumCatalog H2 {
		font:30px Arial;
		margin:0 0 25px -25px;
		text-align:center;
		}
	.albumCatalog .box {
		color:#565656;
		float:left;
		margin-bottom:16px;
		width:225px;
		}
		.albumCatalog .box H3 {
			font:bold 14px Arial;
			margin:4px 0 8px;
			}
			.albumCatalog .box H3 A {color:#1180de;}
		.albumCatalog .box P {padding-right:20px;}

/* Каталог альбомов (на отдельной странице) */
.albumCatalogPage {
	background:#fff;
	height:1%;
	overflow:hidden;
	position:relative;
	}
	.albumCatalogPage H1 {margin-bottom:29px;}
	.albumCatalogPage .albumCatalogPage-description {padding:8px 50px 44px 0;}
		.albumCatalogPage .albumCatalogPage-description BIG {
			color:#565656;
			font:16px/24px Arial;
			}
	.albumCatalogPage .box {
		color:#565656;
		display:-moz-inline-stack;
		display:inline-block;
		vertical-align:top;
		margin:0 0 41px;
		}
		.albumCatalogPage .box H2 {display:block;margin:8px 0 7px;}
		.albumCatalogPage .box P {display:block;padding-right:10px;}
	.albumCatalogPage .box-50procent {width:447px;}
	.albumCatalogPage .box-25procent {width:222px;}

/* Подробно о альбоме */
.albumDetail {
	border-bottom:1px solid #e0e0e0;
	height:1%;
	overflow:hidden;
	padding:8px 0 16px;
	margin:0 30px 50px 0;
	}
	.albumDetail .albumDetail-images {
		float:left;
		padding-right:40px;
		margin:6px 0 0 0;
		}
		.albumDetail .big-img {
			background:url('loading.white.gif') 50% 50% no-repeat;
			}
		.albumDetail .small-images {
			overflow:hidden;
			padding:4px 0 25px;
			}
			.albumDetail .small-images A {
				float:left;
				margin:0 10px 0 0;
				overflow:hidden;
				position:relative;
				text-decoration:none;
				height:74px;
				}
				.albumDetail .small-images A:hover,
				.albumDetail .small-images A.active {
					border:3px solid #ffda93;
					height:68px;
					}
				.albumDetail .small-images A:hover IMG,
				.albumDetail .small-images A.active IMG {margin:-3px;}
	.albumDetail .albumDetail-info {
		height:1%;
		overflow:hidden;
		}
		.albumDetail .albumDetail-info P {padding:0 0 25px;}
			.albumDetail .albumDetail-info P BIG {
				color:#565656;
				font:16px/24px Arial;
				}
.albumDetail-buttons {padding:7px 0 25px;}
	.albumDetail-buttons LI {
		font:18px Arial;
		float:left;
		padding:0 36px 0 0;
		}
		.albumDetail-buttons .li-1 {padding-top:9px;}
		.albumDetail-buttons .li-2 A {
			background:url('button.touch.gif') 0 0 no-repeat;
			display:block;
			height:41px;
			text-indent:-9999px;
			width:169px;
			}

/* Фотогалерея */
.fotogallery H1 {margin-bottom:29px;}
.fotogallery .box {
	background:url('fotogallery.border.gif') 0 0 no-repeat;
	color:#565656;
	float:left;
	text-align:center;
	height:231px;
	overflow:hidden;
	padding-top:14px;
	margin:0 18px 47px 0;
	width:207px;
	}
	.fotogallery .box H2 {
		font:bold 12px/20px Arial;
		display:table-cell;
		width:207px;
		vertical-align:middle;
		height:38px;
		}

/* Наша команда */
.ourTeam {color:#565656;}
	.ourTeam H1 {
		color:#000;
		margin-bottom:29px;
		}
	.ourTeam P {
		font:16px/24px Arial;
		padding:0 0 24px;
		}
		.ourTeam P BIG {font:bold 20px/32px Arial;}
	.ourTeam .img-box {
		font:12px/19px Arial;
		padding:0 0 22px;
		}

/* Сотрудники */
.staffs {padding:0 0 35px;}
	.staffs H2 {font:20px Arial;margin-bottom:27px;}
	.staffs .box {
		clear:both;
		margin:0 0 8px;
		height:1%;
		overflow:hidden;
		}
		.staffs .box IMG {
			float:left;
			margin:2px 20px 0 0;
			}
		.staffs .box .info {
			height:1%;
			overflow:hidden;
			padding:0 0 0;
			}
			.staffs .box .info EM {color:#939393;}

/* Видео */
.video {padding:0 0 30px;}
	.video H2 {font:20px Arial;margin-bottom:29px;}
	.video .box {
		position:relative;
		margin:0 0 21px;
		}
		.video .box .play A {
			background:url('video.play.png') 0 0 no-repeat;
			cursor:pointer;
			display:block;
			position:absolute;
			top:47px;
			left:87px;
			text-indent:-9999px;
			height:67px;
			width:67px;
			}
		.video .box .video-text {
			background:url('video.external.gif') 0 3px no-repeat;
			color:#fff;
			font:15px Arial;
			position:absolute;
			padding:0 0 0 24px;
			top:145px;
			left:23px;
			z-index:10;
			}
			.video .box .video-text A {color:#fff;}
		.video .box .bottomShadow {
			background:url('video.shadow.png') 0 0 no-repeat;
			display:block;
			position:absolute;
			bottom:6px;
			left:0;
			text-indent:-9999px;
			height:72px;
			width:240px;
			}

/* Вопросы и ответы */
.faq H2 {
	border-bottom:1px solid #ccc;
	color: #565656;
	font:16px Arial;
	font-style: italic;
	padding-bottom: 7px;
	margin:30px 0 5px;
	}
.faq A {
	border-bottom:1px dashed;
	font-weight:bold;
	text-decoration:none;
	}
	.faq A:hover {border-bottom:none;}
.faq DT,
.faq DD {
	color:#565656;
	font:14px/20px Arial;
	padding:0 0 10px;
	}
.faq DT {padding-top:15px;}

/* Услуги */
.services {padding:17px 0 10px;}
	.services H2 {
		font:20px Arial;
		margin:0 0 21px;
		}
	.services .box {
		clear:both;
		margin:0 0 31px;
		height:1%;
		overflow:hidden;
		}
		.services .box IMG {
			float:left;
			margin:4px 20px 0 0;
			}
		.services .box .info {
			height:1%;
			overflow:hidden;
			padding:0 0 0;
			}
			.services .box .info H3 {
				font:18px Arial;
				margin:0 0 12px;
				}
				.services .box .info H3 A {color:#1180de;}

.service {color:#565656;}
	.service P {
		font:16px/24px Arial;
		padding:0 0 24px;
		}

/* Новые комментарии */
.newComments {padding:0 0 20px;}
	.newComments UL LI {padding:0 0 15px;}

/* Свежие записи блога */
.latestInTheBlog {padding:17px 0 5px;}
	.latestInTheBlog H2 {
		font:20px Arial;
		margin:0 0 21px;
		}
	.latestInTheBlog UL LI {
		color:#717171;
		padding:0 0 19px;
		}
		.latestInTheBlog UL LI A {color:#1180de;font-size:14px;}
		.latestInTheBlog UL LI EM {display:block;padding-top:1px;}

/* Блог */
.blog {padding:0 0 5px;}
	.blog H2 {margin-bottom:22px;}
	.blog P {padding:0 0 20px;}
	.blog .blog-description {padding:0 0 63px;}
		.blog .blog-description BIG {
			color:#565656;
			font:16px/24px Arial;
			}
	.blog .blog-post {padding:0 0 42px;}
		A.blog-post-category {color:#565656;}
		.blog .blog-post .info {color:#9a9a9a;}
		.blog .blog-post .img {margin-bottom:20px;}
		.blog .blog-post .blog-post-video {
			margin-bottom:20px;
			text-align:center;
			}

/* Контактные данные */
.contacts P {
	color:#565656;
	font:14px/20px Arial;
	padding:0 0 10px;
	}
	.contacts P BIG {font-size:20px;}
	.contacts A#schoolart-vk {
		background:url(vk-icon.png) no-repeat;
		padding:0 0 5px 25px;
		}

/* Навигация туда-сюда */
.nav-previous-next {
	background:#e8f4ff;
	height:1%;
	font:18px Arial;
	overflow:hidden;
	padding:12px 30px 15px;
	margin-bottom:20px;
	}

/* Галерея
---------------------------------------*/
#gallery {
	background:url('bg.png') 0 0 repeat;
	min-height:650px;
	height:100%;
	width:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:1;
	}
	#gallery .inner {min-height:100%;position:relative;}
		#gallery .inner .empty {
			clear:both;
			height:130px;
			}
	#gallery .close A {
		background:url('close.png') 0 0 no-repeat;
		display:block;
		height:46px;
		float:left;
		text-indent:-9999px;
		position:absolute;
		top:0;
		right:40px;
		width:46px;
		z-index:20;
		}
		#gallery .close A:hover {background:url('close.png') 0 -46px no-repeat;}
	#gallery .centerBox {
		position:fixed;
		top:50%;
		left:50%;
		margin:-300px auto 0;
		width:820px;
		}
		#gallery .centerBox .centerBoxInner {
			position:relative;
			left:-50%;
			}
		#gallery .centerBox .toPrevious A {
			background:url('arrow.left.png') 0 0 no-repeat;
			display:block;
			height:39px;
			text-indent:-9999px;
			overflow:hidden;
			position:absolute;
			top:210px;
			left:0px;
			width:40px;
			}
		#gallery .centerBox .toPrevious A:hover {background:url('arrow.left.png') 0 -39px no-repeat;}
		#gallery .centerBox .toNext A {
			background:url('arrow.right.png') 0 0 no-repeat;
			display:block;
			height:39px;
			text-indent:-9999px;
			overflow:hidden;
			position:absolute;
			top:210px;
			right:0px;
			width:40px;
			}
			#gallery .centerBox .toNext A:hover {background:url('arrow.right.png') 0 -39px no-repeat;}
		#gallery .bigImage {text-align:center;}
			#gallery .bigImage IMG {
			background:url('loading.black.gif') center 45% no-repeat;
			border:10px solid #fff;
			float:none;
			}

	#gallery .smallImages {
		clear:both;
		padding:0 30px;
		margin-top:-146px;
		position:relative;
		height:146px;
		}
		#gallery .smallImages UL {
			margin:0;
			overflow:auto;
			white-space:nowrap;
			text-align:center;
			height:136px;
			width:100%;
			}
			#gallery .smallImages UL LI {
				background:url('loading.black.gif') center 45px no-repeat;
				display:inline-block;
				display:-moz-inline-stack;
				vertical-align:top;
				padding-top:8px;
				padding-top:6px;
				margin:0 4px 0 0;
				}
				#gallery .smallImages UL LI A {
					display:block;
					min-height:70px;
					min-width:50px;
					}
				#gallery .smallImages UL LI A IMG {padding:1px;}
				#gallery .smallImages UL LI A:hover IMG {
					border:1px solid #e2a000;
					padding:0;
					}
			#gallery .smallImages UL LI.active {
				background:url('active.arrow.png') center 2px no-repeat;
				position:relative;
				top:-1px;
				}
			#gallery .smallImages UL LI.active A IMG {
				border:1px solid #fff !important;
				padding:0;
				margin-top:1px;
				}
			#gallery IMG {
				float:none;
				margin:0;
				}

/* Разное
---------------------------------------*/
/* Popup window */
.popup {
	background:url('popup.bg.png') 0 0 repeat;
	height:100%;
	width:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:15;
	}
	.popup .inner {min-height:100%;position:relative;}
		.popup .inner .empty {
			clear:both;
			height:130px;
			}
	.popup .close A {
		background:url('close.png') 0 0 no-repeat;
		display:block;
		height:46px;
		float:left;
		text-indent:-9999px;
		position:absolute;
		top:0;
		right:40px;
		width:46px;
		z-index:20;
		}
		.popup .close A:hover {background:url('close.png') 0 -46px no-repeat;}
	.popup .centerBox {
		position:fixed;
		top:50%;
		left:50%;
		margin:-298px auto 0;
		width:480px;
		}
		.popup .centerBox .centerBoxInner {
			background:#fff;
			position:relative;
			padding:25px 29px;
			left:-50%;
			}
	.popup H2 {
		color:#040303;
		font:20px Arial;
		padding:0 0 21px;
		}
#flash .centerBox {width:700px;}
#video-1 .centerBox, #video-2 .centerBox {width:560px;}
#options .centerBox {width:767px;}

/* Форма */
form DIV {padding:0 0 17px;}
form LABEL {
	display:block;
	font:12px Arial;
	padding:0 0 3px;
	}
	form LABEL SPAN, .form LABEL.error {color:#f51110;}
INPUT[type=text], INPUT.short {
	border:1px solid #d3d3d3;
	color:#333;
	font:18px Arial;
	padding:5px 10px 6px;
	width:300px;
	}
INPUT.short {width:50px;}
TEXTAREA {
	color:#333;
	border:1px solid #d3d3d3;
	font:12px Arial;
	height:102px;
	overflow:auto;
	padding:6px 10px;
	width:300px;
	}
INPUT[type=text]:focus, INPUT.short:focus, TEXTAREA:focus {
	background:#fffbe9;
	border-color:#ffce63;
	}
form INPUT.submit {
	font:18px Arial;
	margin:15px 0 4px 0;
	}

/* Вход и регистрация*/
#login .notice {
	background:#fff4c0;
	padding:10px 0 10px 15px;
	margin-bottom:25px;
	}
#login .centerBox {width:483px;}
#login A {color:#1180de;}
#login FIELDSET A {margin-left:10px;}
#login INPUT[type=text] {width:250px;}
#login #vk-login, #login #vk-login-2 {
	background:url(button.vk.gif) no-repeat;
	cursor:pointer;
	height:21px;
	padding:0;
	margin-left:5px;
	width:125px;
	display:inline-block;
	vertical-align:sub;
	}
	#login #vk-login:hover, #login #vk-login-2:hover {background:url(button.vk.gif) 0 -21px no-repeat;}
	#login #vk-login:active, #login #vk-login-2:active {background:url(button.vk.gif) 0 -42px no-repeat;}

/* Внешняя ссылка */
A.external-link {
	background:url('ico.external-link.gif') 0 3px no-repeat !important;
	padding-left:17px !important;
	margin-left:-17px !important;
	}

/* FAQ link */
.faq-link {
	background:url('ico.faq-link.gif') 0 3px no-repeat;
	float:right;
	padding:4px 30px 5px 34px;
	}

/* Баннер */
#banner {margin:0 0 46px -30px;}
