/* ===== 'styles.css' ===== */

/*	--- --- --- --- ---
[project info]
	name - BZMP - main page.
	date - 22.12.2009.
	
	styles:
	--- --- --- --- --- --- --- --- --- ---
	http://www.???.??/img/default.css (6 kb)
	http://www.???.??/img/main.css (15 kb)
	http://www.???.??/img/main_ie.css (4 kb)
	--- --- --- --- --- --- --- --- --- ---
	total: (25 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;
					
	2. text (base):					#222;
				 (extra):					#4e4e4e; #7e7d7d; #fff;
				 
	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;
}
/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */

/* =site wrapper
--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
.wrapper {
	width: 960px;	/* - original: 1000px; - */
	min-height: 100%;
	height: auto !important;
	height: 100%;
	padding: 0px 20px;
	margin: 0px auto;
	background: #d5eda7 url(wrapper_bg.jpg) no-repeat;
	position: relative;
}
	
	/* =site header
	--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
	.header {
		height: 375px;
		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;
				margin-top: 3px;
				border: none;
				background: url(title_bg.png) no-repeat;
			}
				.search fieldset .text {
					width: 215px;	/* - original: 225px; - */
					height: 18px;	/* - original: 22px; - */
					padding: 4px 5px 0px 5px;
					margin: -3px 0px 5px 0px;
					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;	/* - original: 105px; - */
			height: 150px;	/* - original: 220px; - */
			padding: 70px 15px 0px 15px;
			background: url(auth_bg.png);
			font-size: 1.1em;
			text-align: center;
			position: absolute;
			bottom: 65px;
			right: 5px;
			clip: rect(0px, 105px, 110px, 0px);
		}
		.auth-link:hover {
			height: 40px;	/* - original: 220px; - */
			padding-top: 180px;
			text-decoration: underline;
			bottom: 175px;
			clip: rect(110px, 105px, 220px, 0px);
		}
		/* --- // link to authorization // --- */
		/* --- link to electronic order --- */
		.order-link {
			width: 75px;	/* - original: 105px; - */
			height: 145px;	/* - original: 220px; - */
			padding: 75px 15px 0px 15px;			
			background: url(order_bg.png);
			font-size: 1.1em;
			text-align: center;
			line-height: 1.2;
			position: absolute;
			bottom: -40px;
			right: 5px;
			clip: rect(0px, 105px, 110px, 0px);
		}
		.order-link:hover {
			height: 35px;	/* - original: 220px; - */
			padding-top: 185px;
			text-decoration: underline;
			bottom: 70px;
			clip: rect(110px, 105px, 220px, 0px);
		}
		/* --- // link to electronic order // --- */
	/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
	
	/* =site contents
	--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
	.content {
		padding: 1px 240px 125px 275px;
	}
		.content:after {
			display: block;
			height: 0px;
			clear: both;
			content: "";
			visibility: hidden;
		}
		
		/* =left column
		--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
		.left-col {
			display: inline;
			width: 275px;
			margin: -155px 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 // --- */
			/* --- news & product blocks --- */
			.news-box {
				margin: 5.5em 5em 0em 1em;
			}
				/* --- !!! --- */
				.box-title {
					padding: 0.3em 0em 1em 2em;
					margin: 0em 0em 0em -0.3em;
					background: url(title_bg.png) no-repeat;
					font-size: 2.2em;
					line-height: 1;
					letter-spacing: -1px;
				}
				.box-name {
					margin: 0em;
					font-size: 1.2em;
					line-height: 1.1;
				}
					/* --- !!! --- */
					.box-name a {
						text-decoration: none;
					}
					/* --- !!! --- */
				.box-date {
					color: #7e7d7d;
				}
				.box-image {
					margin: 1em 0em 0.5em 0em;
					border: none;
				}
				.details {
					height: 26px;
					padding-right: 15px;
					margin: -2.5em -4em 0em 0em;
					background: url(details_right_bg.png) no-repeat right;
				}
					.details span {
						display: block;
						padding-left: 15px;
						background: url(details_bg.png);
						float: right;
					}
						/* --- !!! --- */
						.details span a {
							display: block;
							font-size: 1.1em;
							line-height: 26px;
						}					
						.details span a:hover {
							text-decoration: underline;
						}
				/* --- !!! --- */	
			.news-box p,
			.prod-box p {
				margin: 0.4em 0em;
				font-size: 0.85em;
			}
			.prod-box .details {
				margin: -3em -2em 3em 0em;
			}
			/* --- // news & product blocks // --- */	
		/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
		
		/* =right column
		--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
		.right-col {
			display: inline;
			width: 170px;	/* - original: 240px; - */
			padding: 1em 2em 0em 5em;
			margin-right: -240px;
			float: right;
		}
		/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
				
		/* =center column
		--- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- */
		.center-col {
			margin-left: 2em;
			overflow: hidden;
		}
		/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
	/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
	
	/* =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: -1em;
		padding: 0.6em;
		font-size: 1.4em;
		overflow: hidden;
		position: relative;
	}
		.login fieldset {
			display: inline;			
			padding: 0em;
			margin-left: 0.5em;
			border: none;
			float: left;
		}		
			.login fieldset input {
				display: block;
				width: 195px;	/* - original: 205px; - */
				height: 21px;	/* - original: 25px; - */
				padding: 4px 5px 0px 5px;
				margin: 0.2em 0em;
				border: none;
				background: #f5f5f5 url(login_input_bg.gif);
				font-size: 1em;
				color: #7e7d7d;
			}
			.login div.main_field {
				width: 205px;
				padding-left:7px;
				float:left;
			}
			.login fieldset input.submit {
				width: 89px;
				height: 27px;
				padding: 0px;
				margin-top: 1.4em;
				border: none;
				background: #b3dfff url(login_submit_bg.gif);
				font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
				color: #222;
				cursor: pointer;
			}
		/* --- !!! --- */
		.login-link {
			width: 50px;
			height: 25px;	/* - original: 90px; - */
			padding-top: 65px;
			background-image: url(login_bg.gif);
			font-size: 0.8em;
			text-align: center;
			position: absolute;
			top: 0px;
			right: 10px;
		}
		.login-link:hover {
			background-position: 0px -90px;
			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: 570px;
		position: absolute;
		top: 74px;
		right: 25px;	
	}
	/* --- // pop-up login block // --- */
/* --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */

/* --- © Tarik, 2009 --- */

/* ===== // 'styles.css' // ===== */