﻿/* ===== 'styles.css' ===== */

/*	--- --- --- --- ---
[project info]
	name - BZMP - inner page.
	date - 28.12.2009.
	
	styles:
	--- --- --- --- --- --- --- --- --- ---
	http://www.???.??/img/default.css (6 kb)
	http://www.???.??/img/styles.css (13 kb)
	http://www.???.??/img/styles_ie.css (4 kb)
	--- --- --- --- --- --- --- --- --- ---
	total: (23 kb)
	
	developer	- OOO "КасперСистемс"
	reply-to	- http://www.kasper.by

[fonts]
	1. general (base):			"Trebuchet MS", Arial, Helvetica, sans-serif;
	2. monospace:						"Courier New", Courier, monospace;
	3. forms:								Arial, Helvetica, sans-serif;

[colors]
	1. links (base):				#0062bc;
					(extra):				#0085ff; #4e4e4e; #82bdef;
					
	2. text (base):					#222;
				 (extra):					#4e4e4e; #7e7d7d; #fff; #82bdef;
				 
	3. borders:							#808080;	
	4. background (base):		#bbd982;
							 (extra):		#d5eda7; #f5f5f5; #fff; #b3dfff;
							 
--- --- --- --- --- */

/* ='default.css'
--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
@import url(default.css);
/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */

/* =global
--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
html {
	font-size: 100.01%;
}
body {
	background: #bbd982 url(body_bg.png) repeat-y center;
	font-size: 62.5%;	/* - '1em' = '10px' - */
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #222;
}
/* --- !!! --- */
a {
	color: #0062bc;
	text-decoration: underline;
}
a:hover {
	color: #0085ff;
	text-decoration: none;
}
a.active {
	color:#0085FF;
	}
a:active {
	outline: none;	/* - removes outline from links - */
}
/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */

/* =site wrapper
--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
.wrapper {
	width: 960px;	/* - original: 1000px; - */
	min-height: 100%;
	height: auto !important;
	height: 100%;
	padding: 0px 20px;
	margin: 0px auto;
	background: #d5eda7 url(inner_wrapper_bg.jpg) no-repeat;
	position: relative;
}
	
	/* =site header
	--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
	.header {
		height: 225px;
		position: relative;
	}
		/* --- site logo --- */
		.logo {
			border: none;
			background: url(logo.png);
			font-size: 1.3em;
			position: absolute;
			top: 20px;
			left: 0px;
		}
		/* --- // site logo // --- */
		/* --- site slogan --- */
		.slogan {
			border: none;
			background: url(slogan.png);
			font-size: 1.3em;
			position: absolute;
			top: 110px;
			left: 120px;
		}
		/* --- // site slogan // --- */
		/* --- top navigation icons & language versions --- */
		.icons,
		.lang {
			margin: 0em 0em 0em 2em;
			text-align: center;
			list-style-type: none;
		}
			.icons li,
			.lang li {
				display: inline;
				margin: 0em 1em;
			}
				.icons li img,
				.lang li img {
					padding: 5px;
					border: none;
					font-size: 1.3em;
				}
		/* --- !!! --- */
		.icons {
			padding: 3em 0em 1em 0em;
		}
		.lang {
			padding: 0em;
		}
		/* --- top navigation icons & language versions --- */
		/* --- search block --- */
		.search {
			width: 265px;
			position: absolute;
			top: 30px;
			right: 65px;
		}
			.search fieldset {
				padding: 10px 0px 0px 40px;
				border: none;
				background: url(title_bg.png) no-repeat 0px 2px;
			}
				.search fieldset .text {
					width: 215px;	/* - original: 225px; - */
					height: 18px;	/* - original: 22px; - */
					padding: 4px 5px 0px 5px;
					margin-bottom: 5px;
					border: none;
					background: #f5f5f5 url(search_input_bg.gif);
					font-size: 1.1em;
					color: #7e7d7d;
				}
				/* --- !!! --- */
				.search fieldset .submit {
					width: 61px;
					height: 120px;
					border: none;
					background: url(search_submit_bg.png);
					position: absolute;
					top: -2px;
					right: -61px;
					clip: rect(0px, 61px, 60px, 0px);
					cursor: pointer;
				}
				.search fieldset .hover {
					top: -62px;
					clip: rect(60px, 61px, 120px, 0px);
				}
				/* --- !!! --- */
				.search fieldset input,
				.search fieldset label {
					vertical-align: middle;
				}
				.search fieldset label {
					font-size: 1.1em;
					color: #fff;
					cursor: pointer;
				}
		/* --- // search block // --- */
		/* --- link to authorization --- */
		.auth-link {
			width: 75px;
			height: 110px;	/* - original: 150px; - */
			padding-top: 40px;
			background: url(inner_auth_bg.png);
			font-size: 1.1em;
			text-align: center;
			position: absolute;
			bottom: -5px;
			right: 20px;
			clip: rect(0px, 75px, 75px, 0px);
		}
		.auth-link:hover {
			height: 35px;	/* - original: 150px; - */
			padding-top: 115px;
			text-decoration: underline;
			bottom: 70px;
			clip: rect(75px, 75px, 150px, 0px);
		}
		/* --- // link to authorization // --- */
		/* --- link to electronic order --- */
		.order-link {
			width: 75px;
			height: 105px;	/* - original: 150px; - */
			padding-top: 45px;
			background: url(inner_order_bg.png);
			font-size: 1.1em;
			text-align: center;
			line-height: 1.2;
			position: absolute;
			bottom: -70px;
			right: 20px;
			clip: rect(0px, 75px, 75px, 0px);
		}
		.order-link:hover {
			height: 30px;	/* - original: 150px; - */
			padding-top: 120px;
			text-decoration: underline;
			bottom: 5px;
			clip: rect(75px, 75px, 150px, 0px);
		}
		/* --- // link to electronic order // --- */	
	/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
	
	/* =site contents
	--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
	.content {
		padding: 0px 0px 125px 275px;
	}
		.content:after {
			display: block;
			height: 0px;
			clear: both;
			content: "";
			visibility: hidden;
		}
		
		/* =left column
		--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
		.left-col {
			display: inline;
			width: 275px;
			margin: 0px 0px 0px -275px;
			float: left;
		}
			/* --- left side bar --- */
			.side-bar {
				padding: 0em;
				margin: -0.5em 0em;
				list-style-type: none;
				position:relative;
			}
				.side-bar li {
					margin: 0.5em 0.2em;
					font-size: 2.2em;
					line-height: 1;
				}
					/* --- !!! --- */
					.side-bar li a {
						text-decoration: none;
					}
				/* --- // left side bar // --- */	
				/* --- left side bar - second level --- */
				.side-bar li ul {
					padding: 0em;
					margin: 0.5em 0em;
					list-style-type: none;
				}
					.side-bar li ul li {
						margin: 0.5em 0em;
						font-size: 0.6em;
						line-height: 1.2;
					}
						/* --- !!! --- */
						.side-bar li ul li a {
							display: block;
							_height: 1.2em;
							padding-left: 1em;
							background: url(cross_mark.gif) no-repeat;
							background-position: -990px 6px;
						}
						.side-bar li ul li a:hover {
							background-position: 6px 6px;
							color: #222;							
						}
						/* --- !!! --- */
						.side-bar li ul li span {
							display: block;
							padding-left: 1em;
							background: url(cross_mark.gif) no-repeat 6px 6px;
						}
				/* --- // left side bar - second level // --- */
				/* --- left side bar - third level --- */
				.side-bar li ul li ul {
					padding-top: 0.5em;
					margin: 0em 0em 0em 1.5em;
					list-style-type: none;
				}
					.side-bar li ul li ul li {
						font-size: 0.9em;
						line-height: 1;
					}
						/* --- !!! --- */
						.side-bar li ul li ul li a {
							background: url(square_mark.gif) no-repeat;
							background-position: -995px 6px;
						}
						.side-bar li ul li ul li a:hover {
							background-position: 2px 6px;
						}
						/* --- !!! --- */
						.side-bar li ul li ul li span {
							display: block;
							padding-left: 1em;
							background: url(square_mark.gif) no-repeat 2px 6px;
						}
				/* --- // left side bar - third level // --- */
		/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
		
		/* =right column
		--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
		.right-col {
			margin-left: 10px;
			overflow: hidden;
		}
			/* --- path of the page --- */
			.path {
				padding: 0em;
				margin: -0.5em 0em 0.5em 0em;
				list-style-type: none;
				position: relative;
			}
				.path li {
					display: inline;
					color: #82bdef;
				}
					/* --- !!! --- */
					.path li a,
					.path li a:hover {
						color: #82bdef;
					}
			/* --- // path of the page // --- */
			.page-title {
				margin: 0.4em 0em;
				font-size: 2.2em;
				font-weight: normal;
				letter-spacing: -1px;
			}
		/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
	/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
	
	/* =site footer
	--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
	.footer {
		width: 960px;	/* - original: 1000px; - */
		height: 100px;
		padding: 0px 20px;
		overflow: hidden;
		position: absolute;
		bottom: 0px;
		left: 0px;
	}
		/* --- bottom menu --- */
		.menu {
			padding: 0.6em 3em;
			margin: -1.5em;
			background: url(menu_bg.png) no-repeat 2px 2px;
			text-align: center;
			list-style-type: none;
			position: relative;
		}
			.menu li {
				display: inline;
				margin: 0em 1.1em;
				font-size: 1.3em;
			}
				/* --- !!! --- */
				.menu li a {
					text-decoration: none;
				}
		/* --- // bottom menu // --- */
		/* --- copyright, developers & counter blocks --- */		
		.copyright,
		.developers,
		.counter {
			margin: 1em 2.5em;
			font-size: 1.1em;
			color: #4e4e4e;
		}
		.copyright {
			display: inline;
			float: left;
		}
		.developers {
			display: inline;
			float: right;
		}
			/* --- !!! --- */
			.developers a {
				color: #4e4e4e;
				text-decoration: none;
			}
			/* --- !!! --- */
			.developers img {
				border: none;
				vertical-align: middle;
			}
			/* --- !!! --- */
		.counter {
			padding-top: 1em;
			margin: 0em auto;
			text-align: center;
		}
		/* --- // copyright, developers & counter blocks // --- */
	/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */

/* =extra styles
--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
	/* --- authorization form --- */
	.login {
		margin: -1.5em;
		padding: 0.5em;
		font-size: 1.1em;
		overflow: hidden;
		position: relative;
	}
		.login fieldset {
			display: inline;			
			padding: 0em;
			margin-left: 0.5em;
			border: none;
			float: left;
		}		
			.login fieldset input {
				display: block;
				width: 154px;	/* - original: 164px; - */
				height: 17px;	/* - original: 20px; - */
				padding: 3px 5px 0px 5px;
				border: none;
				background: #f5f5f5 url(inner_login_input_bg.gif);
				font-size: 1.1em;
				color: #7e7d7d;
			}
			.login div.main_field {
				width: 165px;
				padding-left:6px;
				float:left;				
			}			
			.login fieldset input.submit {
				width: 71px;
				height: 22px;
				padding: 0px;
				margin-top: 1.2em;
				border: none;
				background: #b3dfff url(inner_login_submit_bg.png);
				font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
				color: #222;
				cursor: pointer;
			}
		/* --- !!! --- */
		.login-link {
			width: 50px;
			height: 20px;	/* - original: 60px; - */
			padding-top: 40px;
			background-image: url(inner_login_bg.gif);
			text-align: center;
			position: absolute;
			top: 0px;
			right: 8px;
		}
		.login-link:hover {
			background-position: 0px -64px;
			text-decoration: underline;
		}	
	/* --- // authorization form // --- */
	
	/* =corners wrapper
	--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
	.corn-wrap {
		margin: 30px;	/* - half the size of the corners - */
		position: relative;
	}		
		/* --- location of corners & shadows --- */
		.corn-tl, .corn-tc, .corn-tr,
		.corn-cl, .corn-cr,
		.corn-bl, .corn-bc, .corn-br {
			position: absolute;
		}
		/* --- !!! --- */
		.corn-tl, .corn-tc, .corn-tr {
			top: -30px;
		}
		.corn-bl, .corn-bc, .corn-br {
			bottom: -30px;
		}
		.corn-tl, .corn-cl, .corn-bl {
			left: -30px;
		}
		.corn-tr, .corn-cr, .corn-br {
			right: -30px;
		}
		/* --- // location of corners & shadows // --- */
		/* --- corners --- */
		.corn-tl, .corn-tr,
		.corn-bl, .corn-br {
			width: 60px;
			height: 60px;
			background: url(corn.png);
		}
		/* --- !!! --- */
		.corn-tl {
			clip: rect(0px, 30px, 30px, 0px);
		}
		.corn-tr {
			clip: rect(0px, 60px, 30px, 30px);
		}
		.corn-bl {
			clip: rect(30px, 30px, 60px, 0px);
		}
		.corn-br {
			clip: rect(30px, 60px, 60px, 30px);
		}
		/* --- // corners // --- */
		/* --- horizontal shadows --- */
		.corn-tc,
		.corn-bc {
			width: 100%;
			height: 60px;
			background: url(corn_hor.png);
			left: 0px;
		}
		/* --- !!! --- */
		.corn-tc {
			clip: rect(0px, auto, 30px, 0px);
		}
		.corn-bc {
			clip: rect(30px, auto, 60px, auto);
		}
		/* --- // horizontal shadows // --- */
		/* --- vertical shadows --- */
		.corn-cl,
		.corn-cr {
			width: 60px;
			height: 100%;
			background: url(corn_ver.png);
			top: 0px;
		}
		/* --- !!! --- */
		.corn-cl {
			clip: rect(0px, 30px, auto, 0px);
		}
		.corn-cr {
			clip: rect(0px, 60px, auto, 30px);
		}
		/* --- // vertical shadows // --- */
		/* --- content from the corners --- */
		.corn-content {
			padding: 1px;
			background: #fff;
		}
		/* --- // content from the corners // --- */
	/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
	
	/* --- pop-up login block --- */
	.login-block {
		width: 460px;
		position: absolute;
		top: 65px;
		right: 30px;	
	}
	/* --- // pop-up login block // --- */
	/* --- alphabet, subitems & item blocks --- */
	.alphabet-block,
	.subitems-block,
	.item-block,
	.personal-block {
		margin: 30px 10px;
	}
	.subitems-block,
	.item-block {
		margin-bottom: 60px;
	}
	/* --- // alphabet, subitems & item blocks // --- */
/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */

/* --- © Tarik, 2009 --- */

/* ===== // 'styles.css' // ===== */
