@import "http://www.slavsky.com/css/reset.css";

body {
	min-width: 900px;
	background: #D7E0E0 url(http://www.slavsky.com/img/bg.gif) repeat-x 0 0;
	color: #222;
	font: normal 1em/1.3 'Helvetica Neue', Arial, Helvetica, sans-serif;
}

h1 {
	margin: .6em 0 .4em;
	font-size: 1.5em;
}
h2 {
	margin: 1.2em 0 .4em;
	border-bottom: 1px solid #000;
	color: #000;
	font-size: 1.75em;
}
h3 {
	margin: 1.5em 0 .5em;
	font-size: 1.25em;
}
h4 {
	margin: 1em 0 .2em;
	font-size: 1em;
}
p {
	margin: .2em 0 1em;
}
ul, ol {
	margin: .2em 0 1em 2.1em;
}
	ul li,
	ol li {
		margin-bottom: .75em;
	}
	ul li { list-style: disc; }
	ol li { list-style-type: decimal; }

table {
	margin: 1em 0;
	border-collapse: collapse;
	border: 1px solid #CDD8D8;
}
	table th,
	table td {
		border-bottom: 1px solid #CDD8D8;
		padding: .75em 1em;
		vertical-align: top;
	}
	table thead th {
		padding: .75em;
		background-color: #D7E0E0;
		color: #000;
	}


/* Misc
------------------------------ */

.sep {
	margin: 0 .5em;
	color: #999;
}
.meta {
	color: #999;
	font-weight: normal;
	font-size: .85em;
}
.highlight {
	padding: .1em .2em 0;
	background-color: #FE9;
}



/* Header
------------------------------ */

.header {
	width: 820px;
	height: 100px;
	margin: 0 auto;
	font-size: .9em;
	overflow: hidden;
}

	/* Logo */

	.header h1 {
		float: left;
		margin: 20px 0 0;
		background-repeat: no-repeat;
		background-position: 0 0;
		text-indent: -9999em;
		overflow: hidden;
	}
	.header h1 a {
		display: block;
		height: 100%;
	}

	/* Contact Information */

	.header p {
		float: right;
		color: #3D5266;
	}
		.header p .tel,
		.header p .chat {
			padding-left: 18px;
			background-image: url(http://www.slavsky.com/img/i-contact.gif);
			background-repeat: no-repeat;
		}
		.header p .tel {
			background-position: 3px 0;
		}
		.header p .chat {
			margin-left: 1em;
			background-position: 0 -48px;
			font-weight: bold;
		}



/* Toolbar
------------------------------ */

.toolbar {
	height: 30px;
	background: #ACBCBF url(http://www.slavsky.com/img/bg-toolbar.gif) repeat-x 0 100%;
	overflow: hidden;
}
	.toolbar .wrap {
		width: 820px;
		margin: 0 auto;
	}
	.toolbar ul {
		float: left;
		margin: 0;
		color: #FFF;
	}
		.toolbar ul li {
			float: left;
			margin: .7em 20px 0 0;
			text-transform: uppercase;
			font-size: .65em;
			list-style: none;
		}
		.toolbar ul li a {
			color: #FFF;
		}

	.toolbar fieldset {
		float: right;
		margin: .1em 0 0;
		padding: 0;
	}
		.toolbar fieldset input {
			vertical-align: middle;
		}


/* Layout
------------------------------ */

.page {
	width: 870px;
	margin: 0 auto;
	padding: 0 0 15px;
	background: url(http://www.slavsky.com/img/bg-page-b.png) no-repeat 0 100%;
}


/* Tabs */

.page .tabs {
	height: 30px;
	padding: 3px 25px 0;
	background-repeat: no-repeat;
	background-position: 0 0;
}
	.tabs ul {
		float: left;
		width: 819px;
		height: 30px;
		margin: 0;
		border-left-width: 1px;
		border-left-style: solid;
	}
		.tabs ul li {
			position: relative;
			float: left;
			height: 30px;
			margin: 0;
			border-right-width: 1px;
			border-right-style: solid;
			list-style: none;
			font-size: .8em;
		}
			.tabs ul a {
				float: left;
				height: 24px;
				padding: 6px 15px 0;
				background-repeat: repeat-x;
				background-position: 0 0;
				color: #FFF;
				text-decoration: none;
			}
			.tabs ul a:hover {
				text-decoration: underline;
			}

			.tabs ul strong {
				float: left;
				height: 30px;
				padding: 0;
				background-image: none;
				font-weight: normal;
			}
			.tabs ul strong a {
				background: transparent none !important;
				color: #FFF !important;
			}


			/* Dropdown */

			.tabs ul li ul {
				display: none;
				position: absolute;
				top: 30px; left: -1px;
				float: none;
				width: 220px;
				height: auto;
				border: 1px solid #FFF;
				border-top: 0;
				z-index: 9999;
			}
			.tabs ul li:hover ul,
			.tabs ul li.over ul {
				display: block;
			}
				.tabs ul li ul li {
					display: block;
					float: none;
					height: auto;
					border: 0;
					border-top-width: 1px;
					border-top-style: solid;
					font-size: .85em;
				}
					.tabs ul li ul li a,
					.tabs ul li ul li strong {
						display: block;
						float: none;
						height: auto;
						background-image: none;
					}
					.tabs ul li ul li a {
						padding: .75em 20px;
					}
					.tabs ul li ul li a:hover {
						color: #FFF;
						text-decoration: none;
					}

/* Content */

.page .content {
	padding: 20px 25px;
	background: url(http://www.slavsky.com/img/bg-page.png) repeat-y 0 0;
	font-size: .8em;
}


/* Footer */

.footer {
	position: relative;
	width: 820px;
	margin: 20px auto;
	padding: 0 0 20px;
	color: #899;
	font-size: .7em;
	z-index: 1000;
	overflow: hidden;
}
	.footer p {
		width: 700px;
	}
		.footer a {
			color: #899 !important;
		}
		.footer .sep {
			color: #ABB;
		}
	.footer a.link-slavsky {
		position: absolute;
		top: 0; right: 0;
	}


/* Container */

.container {
	margin: 20px 0;
	overflow: hidden;
}



/* Columns
------------------------------ */

.two-columns {
	overflow: hidden;
}
	.two-columns .col-1 {
		float: left;
		width: 400px;
		margin-right: 20px;
	}
	.two-columns .col-2 {
		float: left;
		width: 400px;
	}


.three-columns {
	overflow: hidden;
}
	.three-columns .col-1 {
		float: left;
		width: 260px;
		margin-right: 20px;
	}
	.three-columns .col-2 {
		float: left;
		width: 260px;
		margin-right: 20px;
	}
	.three-columns .col-3 {
		float: left;
		width: 260px;
	}


.four-columns {
	overflow: hidden;
}
	.four-columns .col-1 {
		float: left;
		width: 190px;
		margin-right: 20px;
	}
	.four-columns .col-2 {
		float: left;
		width: 190px;
		margin-right: 20px;
	}
	.four-columns .col-3 {
		float: left;
		width: 190px;
		margin-right: 20px;
	}
	.four-columns .col-4 {
		float: left;
		width: 190px;
	}




/* Form
------------------------------ */

fieldset {
	margin: 20px 0 40px;
	padding-top: 19px;
}
	fieldset legend {
		font-weight: bold;
		font-size: 1.25em;
	}

	.form-row {
		margin: .4em 0 1.2em;
		overflow: hidden;
	}
		.form-row .form-label {
			float: left;
			width: 190px;
		}
		.form-row .form-field,
		.form-row .form-comment {
			margin-left: 210px;
		}
		.form-row .form-comment {
			color: #999;
			font-size: .85em;
		}
			.form-row .form-comment p {
				margin: .4em 0;
			}

	.form-submit {
		margin: 1.5em 0;
		border: 1px solid #E4EDED;
		border-top-color: #CED9D9;
		padding: 1em;
		background-color: #F5F7F7;
		text-align: center;
		overflow: hidden;
	}


/* Bordered */

fieldset.bordered {
	border: 1px solid #CED9D9;
	padding: 19px;
	background: #F5F7F7;
}

	fieldset.bordered legend {
		margin: 0 -10px;
		padding: 0 10px;
	}
	fieldset.bordered .form-submit {
		margin-bottom: 0;
		border: 0;
		padding: 0;
		background-color: transparent;
	}


/* Error handling */

.form-row.error {
	border: 1px solid #E0B2A8;
	padding: 9px;
	background-color: #FFF4F2;
}
	.form-row.error .form-label {
		width: 180px;
		color: #B00;
		font-weight: bold;
	}
	.form-row.error .form-field,
	.form-row.error .form-comment {
		margin-left: 200px;
	}

.bordered .form-row.error {
	margin-right: -20px;
	margin-left: -20px;
	border: 1px solid #E0B2A8;
	padding: 9px 19px;
	background-color: #FFF4F2;
}
	.bordered .form-row.error .form-label {
		width: 190px;
	}
	.bordered .form-row.error .form-field,
	.bordered .form-row.error .form-comment {
		margin-left: 210px;
	}


/* Messages */

.message {
	margin: 20px 0;
	border-style: solid;
	border-width: 1px;
	padding: .5em 20px;
}
	.message p {
		margin: .6em 0;
	}
	.message.warning {
		border-color: #E0B2A8;
		background-color: #F7DFDA;
		color: #622;
	}
	.message.success {
		border-color: #C2CC8F;
		background-color: #F1F5DC;
		color: #453;
	}
	.message.notice {
		border-color: #E5D195;
		background-color: #FAF7DC;
		color: #543;
	}


/* Useful styles */

.required {
	color: #A00;
	font-weight: bold;
}
.action {
	color: #A00 !important;
	font-weight: bold;
}



/* How It Works
------------------------------ */

.block-how-it-works {
}
	.block-how-it-works .three-columns {
		margin-top: 1.5em;
	}
	.block-how-it-works .three-columns .col-1,
	.block-how-it-works .three-columns .col-2,
	.block-how-it-works .three-columns .col-3 {
		width: 190px;
		padding-left: 70px;
		background: url(http://www.slavsky.com/img/bg-123.gif) no-repeat 0 3px;
	}
	.block-how-it-works .three-columns .col-2 { background-position: -260px 3px; }
	.block-how-it-works .three-columns .col-3 { background-position: -520px 3px; }



/* Featured Products
------------------------------ */

.block-products {
}
	.block-products p {
		font-size: .9em;
	}
	.block-products .three-columns .col-1,
	.block-products .three-columns .col-2,
	.block-products .three-columns .col-3 {
		width: 190px;
		padding-left: 70px;
		background-repeat: no-repeat;
	}



/* Search Results
------------------------------ */

.search-results {
	margin-top: 0;
	margin-right: 140px;
}



/* Pagination
------------------------------ */

.pagination {
	margin: 20px 0;
	border-top: 1px solid #CED9D9;
	padding-top: 20px;
	color: #999;
}
	.pagination ul {
		margin: 0;
		overflow: hidden;
	}
		.pagination ul li {
			float: left;
			margin: 0 1em 0 0;
			list-style: none;
		}

	.pagination ul.prev-next {
		margin-bottom: 1em;
	}

	.pagination ul.folios {
	}
		.pagination ul.folios a,
		.pagination ul.folios strong {
			float: left;
			border-width: 1px;
			border-style: solid;
			padding: .2em .6em;
		}
		.pagination ul.folios a {
			border-color: #CED9D9;
			background-color: #F5F7F7;
			text-decoration: none;
		}
		.pagination ul.folios strong {
			border-color: #CCC;
			background-color: #FFF;
			color: #333;
			font-weight: normal;
		}

		.pagination p {
			margin-top: 20px;
		}



/* Error Pages
------------------------------ */

.page-error .header {
	padding: 0 26px 15px;
	background: url(http://www.slavsky.com/img/bg-page-error.gif) no-repeat 0 100%;
}
.page-error .page .content {
	padding-top: 0;
	overflow: hidden;
}
	.page-error .content h2 {
		margin: 10px -20px 0;
		border: 0;
		padding: .4em 20px;
		background-color: #596C80;
		color: #FFF;
		text-transform: uppercase;
		text-align: center;
		font-size: 2em;
	}
	.page-error .content h3 {
		margin-bottom: 1.5em;
		line-height: 1.5;
	}



/* Need review
------------------------------ */

/* Form steps */

.steps {
	width: 821px;
	margin: 1em -1px 0 0;
	padding: 0;
	overflow: hidden;
}
.steps LI {
	float: left;
	width: 208px;
	margin: 0 2px 0 0;
	padding: 5px 0;
	/*background-color: #ebeef5;*/
	background-color: #D7DDE8;
	color: #334;
	list-style: none;
	text-align: center;
}

.steps LI A
{
	color:#888899 !important;
}

.steps LI.active {
	width: 209px;
	padding-bottom: 7px;
	background-color: #D7DDE8;
	font-weight: bold;
}

.steps-secondary {
	width: 820px;
	padding: 0;
	background-color: #D7DDE8;
	font-size: 85%;
	overflow: hidden;
	margin:0px;
}
.steps-secondary LI {
	float: left;
	/*width: 156px;*/
	width: auto;
	border-right: 1px solid #f2f5fa;
	padding: 4px 0;
	color: #334;
	list-style: none;
	text-align: center;
	margin:0px;
}
.steps-secondary LI.active {
	/*width: 158px;*/
	width: auto;
	background-color: #c3ccde;
	font-weight: bold;
}
.steps-secondary LI A {
	color: #889 !important;
}



/* Wizards */

ol.wizard-steps {
	margin: 1.5em 0 .5em;
	padding: 0;
	overflow: hidden;
}
	ol.wizard-steps li {
		float: left;
		padding: 0;
		background: url(http://www.slavsky.com/img/bg_wizard.gif) repeat-x 0 0;
		list-style: none;
		text-align: center;
	}
		ol.wizard-steps .step-number {
			display: block;
			height: 21px;
			padding: 6px 0 0;
			background: url(http://www.slavsky.com/img/bg_wizard_step.gif) no-repeat 50% 0;
			color: #5C8099;
			font-size: 90%;
		}
		ol.wizard-steps .step-name {
			display: block;
			margin: .5em;
			color: #70818C;
			font-size: 85%;
		}

		ol.wizard-steps strong .step-number {
			background-image: url(http://www.slavsky.com/img/bg_wizard_step-current.gif);
			color: #FFF;
		}
		ol.wizard-steps strong .step-name {
			color: #336080;
		}

	ol.wizard-steps.steps-3 li { width: 33%; }
	ol.wizard-steps.steps-4 li { width: 25%; }
	ol.wizard-steps.steps-5 li { width: 20%; }
	ol.wizard-steps.steps-6 li { width: 16%; }


