/*------------------------------------------------------------------
[ STYLE.CSS ] Main Stylesheet
--------------------------------------------------------------------

[Table of contents]

1.	RESET

2.	MAIN STYLES
2.a  Tags defaults
2.b  Base layout
2.c  Navigations
2.d  Elements, ID's & Classes

3.	FORMS
3.a  General form styles
3.b  Individual forms

4.	PLUGINS

5.	PRINT


/*------------------------------------------------------------------

1.	RESET
	Global reset for all HTML elements

------------------------------------------------------------------*/

@media handheld, projection, screen, print {

* { font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline }
html { height: 100% }
body { background: #fff; color: #000; font-size: 100.01%; min-height: 101%; text-align: left }
img, fieldset, abbr, acronym { border: 0 }
ul, ol { list-style: none; list-style-position: outside }
table { border-collapse: collapse; border-spacing: 0; width: 100% }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal }
caption, th { text-align: left }
q:before, q:after, blockquote:before, blockquote:after { content: '' }
input, select, textarea, button { font-size: 1em; line-height: normal; width: auto; vertical-align: middle }
textarea { height: auto; overflow: auto }
option { padding-left: 0.6em }
button { background: none; border: 0; cursor: pointer; text-align: center }
h1, h2, h3, h4, h5, h6 { font-weight: normal; line-height: normal }


} @media handheld, projection, screen {


/*------------------------------------------------------------------

2.	MAIN STYLES
	General definitions

--------------------------------------------------------------------

/*-------------------------------
2.a Tags defaults
---------------------------------
[?] Tags only. No classes or ID's here.
*/
	
body {
	background-color: #000;
	color: #404040;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	line-height: 1.33em;
	text-align: center;
}

p, ul, ol, table, dl, dd, pre { margin: 0 0 1.33em }

strong { font-weight: bold }
em { font-style: italic }
code, pre { font-family: "Courier New", Courier, monospace }
dt { font-weight: bold }
dd { font-style: italic }
cite { font-style: italic }
q { font-style: italic }
blockquote { font-style: italic; padding: 0 2.67em }

abbr, acronym { border-bottom: 1px dotted; cursor: help }


/* Headlines
-------------------------------
[?] Always define: font-size - line-height - margin
*/

h1 {
	font-size: 3em;
	margin: 1em 0 .4em;
}
h2 {
	font-size: 2em;
	margin: 1em 0 .4em;
}
h3 {
	font-size: 1.5em;
	margin: 1em 0 .4em;
}
h4 {
	font-size: 1.33em;
	margin: 1em 0 .4em;
}
h5 {
	font-size: 1em;
	font-weight: bold;
	margin: 1em 0 .4em;
}
h6 {
	font-size: .92em;
	margin: 1em 0 .4em;
}


/* Anchors
-------------------------------*/

a, a:link, a:link:visited {
	color: #f08923;
	cursor: pointer;
	text-decoration: underline;
}
a:link:hover, a:link:active, a:link:focus {
	text-decoration: none;
}


/*-------------------------------
2.b Base layout
---------------------------------
[?] Mostly ID's. Classes & tags allowed.
*/

#wrap {
	margin: auto;
	text-align: left;
	width: 979px;
	position: relative;
}
	#header, #content, #footer {
		float: left; display: inline;
		clear: both;
		position: relative;
	}
	#header {
		background: url(../img/bg-header.jpg) no-repeat;
		height: 207px; width: 100%;
		margin: 22px 0 0;
	}
	#home #header { height: 445px }

		#logo { margin: 0 }

			#logo a {
				background: url(../img/logo.gif) no-repeat;
				height: 85px; width: 225px;
				position: absolute;
				top: 47px; left: 8px;
			}
		
		#tagline { display: none }

	#content {
		background-color: #fff;
		padding: 0 0 1em 18px;
		width: 961px;
	}
		#main {
			float: right;
			background: url(../img/bg-main.gif) repeat-y;
			margin: 12px 0 0;
			padding: 0 8px 0 0;
			width: 733px;
		}
		#sidebar {
			float: left;
			background-color: #404040;
			margin: 12px 0 0;
			padding: 45px 3px;
			width: 194px;
		}

	#footer {
		background: url(../img/bg-footer.gif) no-repeat;
		color: #fff;
		font-size: .83em;
		height: 50px; width: 100%;
	}
		#footer a { color: #fff; text-decoration: none }
		#footer a:hover { text-decoration: underline }


/*-------------------------------
2.c Navigations
-------------------------------*/

ul.nav { margin: 0 }


/* Main navigation
-------------------------------*/

#nav {
	background: url(../img/bg-nav.jpg) no-repeat;
	height: 50px; width: 960px;
	padding: 0 0 0 19px;
	position: absolute;
	top: 169px; left: 0;
	z-index: 9998;
}
#home #nav { background: url(../img/bg-nav-home.jpg) no-repeat }

	#nav li {
		float: left;
		padding: 0 7px;
		position: relative;
	}
		#nav li a {
			float: left;
			background: url(../img/nav.gif) no-repeat 0 0;
			display: block;
			height: 24px;
			margin: 8px 0 0;
		}
		#nav li#nav1 a { background-position: 0 0; width: 50px }
		#nav li#nav1 a:hover { background-position: 0 -26px }
		#nav li#nav1 a.active { background-position: 0 -50px }
		
		#nav li#nav2 a { background-position: -50px 0; width: 78px }
		#nav li#nav2 a:hover { background-position: -50px -26px }
		#nav li#nav2 a.active { background-position: -50px -50px }
		
		#nav li#nav3 a { background-position: -128px 0; width: 47px }
		#nav li#nav3 a:hover { background-position: -128px -26px }
		#nav li#nav3 a.active { background-position: -128px -50px }
		
		#nav li#nav4 a { background-position: -175px 0; width: 78px }
		#nav li#nav4 a:hover { background-position: -175px -26px }
		#nav li#nav4 a.active { background-position: -175px -50px }
		
		#nav li#nav5 a { background-position: -253px 0; width: 99px }
		#nav li#nav5 a:hover { background-position: -253px -26px }
		#nav li#nav5 a.active { background-position: -253px -50px }
		
		#nav li#nav6 a { background-position: -352px 0; width: 73px }
		#nav li#nav6 a:hover { background-position: -352px -26px }
		#nav li#nav6 a.active { background-position: -352px -50px }
		
		#nav li#nav7 a { background-position: -425px 0; width: 66px }
		#nav li#nav7 a:hover { background-position: -425px -26px }
		#nav li#nav7 a.active { background-position: -425px -50px }
		
		#nav li#nav8 a { background-position: -491px 0; width: 77px }
		#nav li#nav8 a:hover { background-position: -491px -26px }
		#nav li#nav8 a.active { background-position: -491px -50px }

		#nav li ul {
			background-color: #404040;
			display: none;
			padding: 3px;
			position: absolute;
			top: 32px; left: 0;
			z-index: 19998;
		}
		#nav li:hover ul, #nav li.hover ul { display: block }

			#nav li ul li {
				float: none;
				background-color: #6d6e71;
				margin: 2px 0 0;
				padding: 0;
			}
				#nav li ul li a {
					float: none;
					background: url(../img/bullet-sidebar-nav.gif) no-repeat 5px !important;
					color: #fff;
					text-decoration: none;
					display: block;
					height: auto;
					margin: 0;
					padding: 2px 0 2px 20px;
				}
				#nav li ul li a:hover { color: #f08923 }

#sidebar ul.nav { margin: 0 0 1.33em }

	#sidebar ul.nav li {
		background-color: #6d6e71;
		margin: 0 0 2px;
	}
		#sidebar ul.nav li a, #sidebar ul.nav li a.active {
			background: url(../img/bullet-sidebar-nav.gif) no-repeat 5px;
			color: #fff;
			text-decoration: none;
			display: block;
			padding: 2px 0 2px 20px;
		}
		#sidebar ul.nav li a:hover, #sidebar ul.nav li a.active { color: #f08923 }


/*-------------------------------
2.d Elements, ID's & Classes
-------------------------------*/

/* Default lists
-------------------------------*/

#main ul { padding-left: 2em }

	#main ul li {
		background: url(../img/bullet.gif) no-repeat 0 7px;
		padding-left: 9px;
	}
	
	#main ul ul, #main ul ol, #main ol ul, #main ol ol { margin: 0 }

#main ol {
	list-style: decimal inside;
	padding-left: 2em;
}

#main ul.void, #main ol.void, #main ol.fieldset, #main ul.void li, #main ol.fieldset li {
	background: none repeat left top;
	list-style: none;
	list-style-position: outside;
	padding: 0;
}


/* General elements
-------------------------------*/

#footer #copy { position: absolute; top: 13px; left: 27px }

#footer #sitemap { position: absolute; top: 13px; left: 325px }

#footer #oasisDesign { position: absolute; top: 13px; right: 27px }

div#banner {
	position: absolute;
	top: 207px; left: 0;
}

div#news {
	float: left;
	border-top: 2px dotted #dcdddf;
	border-bottom: 2px dotted #dcdddf;
	line-height: normal;
	margin: 12px 0 0;
	width: 244px;
}
	div#news h3 {
		font-size: 1.17em;
		font-weight: bold;
	}
	div#news ul { margin: 0	}

		div#news ul li h4 {
			font-size: 1em;
			font-weight: bold;
			margin: 0;
		}
		p.more { text-align: right }

div.featured {
	float: left;
	background: url(../img/bg-featured.gif) no-repeat;
	margin: 20px 0 0 6px;
	padding: 0 25px;
	width: 300px; height: 229px;
}
div.products-featured {
	float: left;
	background: url(../img/bg-featured1.gif) no-repeat;
	margin: 20px 0 0 0;
	padding: 0 10px;
	width: 195px; height: 229px;
}
div.products-featured p{
text-align:center;
}
	div.featured h2#cameraSolutions, div.featured h2#technology {
		background: url(../img/h2-camera-solutions.jpg) no-repeat;
		margin: -14px auto 0;
		width: 209px; height: 57px;
		position: relative;
		z-index: 9999;
	}
	
	div.products-featured h2 {
		position: relative;
		z-index: 9999;
	}
	
	div.featured h2#technology { background: url(../img/h2-technology.jpg) no-repeat }
	
	div.featured p {
		font-size: .92em;
		margin: 15px 0 0;
	}
	div.products-featured p.indent {
		font-size: .92em;
		margin: 15px 0 0;
		text-align:center;
		width:100%;
	}
	div.products-featured p.indent p {
		text-align:center;
		width:100%;
	}
	div.products-featured p {
		font-size: .92em;
		margin:0;
	}
		div.featured p img {
			float: right;
			margin: 0 7px 0 28px;
		}

div#blockContainer {
	background: url(../img/bg-block-container.gif) no-repeat 0 bottom;
}
	div#block {
		background: url(../img/bg-block.gif) no-repeat;
		padding: 0 38px 15px 25px;
		width: 670px;
	}
		div#block h2 {
			border-bottom: 1px solid #f08923;
			font-size: 1.5em;
			margin: 0 0 20px;
			padding: 15px 0;
		}
		div#block h3 {
			border-bottom: 1px solid #f08923;
			font-size: 1.33em;
			margin: 0 0 10px;
			padding: 3px 0;
		}
		div#block h4 {
			font-size: 1em;
			font-weight: bold;
			margin: 0 0 3px;
		}
		ul.info { width: 200px }
		
		ul.email li { position: relative }
		
		ul.email li span {
			position: absolute;
			top: 0; left: 67px
		}
			ul.email li span a {
				color: #404040;
				font-weight: bold;
				text-decoration: none
			}
			ul.email li span a:hover { color: #f08923 }

p.big-link a {
	background: url(../img/bullet-big-link.gif) no-repeat 0 center;
	color: #404040 !important;
	font-size: 1.67em;
	font-weight: bold;
	text-decoration: none !important;
	padding: 0 0 0 23px;
}
p.big-link a:hover { color: #f08923 !important }

#sidebar h3 {
	color: #fff;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	margin: 0 0 10px;
	padding: 0 0 0 20px;
}

p.subscribe {
	padding: 0 21px;
	width: 150px;
}
	p.subscribe a {
		color: #fff !important;
		font-size: .83em;
		line-height: normal;
		text-decoration: none !important;
	}
	p.subscribe a:hover { color: #f08923 !important }



/*------------------------------------------------------------------

3.	FORMS
	Styles for forms only

--------------------------------------------------------------------

/*-------------------------------
3.a General form styles
-------------------------------*/

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

input.text, select.select, textarea.textarea
{
	border: 1px solid #a0a0a0;
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	padding: 2px;
}
input.text { width: 144px }
select.select { width: 200px }
textarea.textarea { height: 10em; width: 195px }

select.select.free { width: auto }

button.button {
	color: #000;
	height: auto; width: auto;
	line-height: normal;
	white-space: nowrap;
}

input.submit {
	color: #000;
	cursor: pointer;
	padding: 5px 10px;
	text-indent: -10000px;
}


/* General forms
-------------------------------*/

form.form ol.fieldset {	/* nothing here */ }

	form.form ol.fieldset li.field {
		margin: 0 0 1em;
		position: relative;
	}
		form.form ol.fieldset li.field label {
			font-weight: bold;
			display: block;
			margin-bottom: 5px;
		}
			
	form.form p.submit { /* nothing here */ }


/* Search Forms
-------------------------------*/

form.search { margin-bottom: 1.33em; position: absolute; top: 175px; right: 18px; z-index: 9999 }

	form.search p.fields { margin: 0 }

		form.search p.fields input, form.search p.fields button {
			display: inline;
			vertical-align: middle;
		}
		
		form.search p.fields input.submit {
			background: url(../img/search.gif) no-repeat;
			border: 0;
			margin: 0 5px 0 0;
			width: 69px; height: 24px;
		}

		
/*-------------------------------
3.b Individual forms
-------------------------------*/


/* Form Elements */
#contactForm li{background-image:none}
#contactForm{margin:0px;}
#contactForm ul{margin:0; padding:0;}
#contactForm li {list-style:none;}
input.input-text, select, textarea { border:1px solid #b6b6b6; font:12px; }
option, optgroup { font:12px; }
optgroup { font-weight:bold; }
textarea { overflow:auto; }
input.input-text, textarea { padding:2px; }
input.form-radio,
input.form-checkbox { margin-right:3px; }
.qty { width:2.5em; }
.group-select label, .form-list label, .payment-methods label { font-weight:bold;}
.input-text:focus, select:focus, textarea:focus { background:#E8E8E8; }
.button-set { /* Container for form buttons*/
    clear:both;
    margin-top:10px;
    padding-top:8px;
    text-align:right;
	margin-bottom:0px;
	width:400px;
    }
.form-button, .form-button-alt {
    overflow:visible;
    width:auto;
    border:0;
    padding:1px 8px;
    background:#404041;
    color:#fff;
    border:0px;
    font:bold 12px arial, sans-serif !important;
    cursor:pointer;
    text-align:center;
    vertical-align:middle;
    }
.form-button span, .form-button-alt span {
    white-space:nowrap;
    }
.form-button-alt {
    border:0;
    background-color:#721101;
    }
a.form-button-alt { padding: 2px 9px; text-decoration:none; }
.form-button-alt:hover { color:#fff; text-decoration:none; }

/* Form lists */
.form-list li { margin-bottom:6px; background-image: none; }
.form-list li .input-box .input-text, .form-list li .input-box textarea { width:250px; }
.form-list li .input-box select { width:256px;}
.form-list li.addElement { border-top:1px solid #DDD; padding-top:10px;}

.group-select {
    margin:28px 0;
    border:1px solid #bbafa0;
    padding:22px 25px 12px 25px;
    background:none;
	width:350px;
    }
.group-select .legend {
    margin-top:-33px;
    float:left;
    border:1px solid #721101;
    background:#721101;
    padding:0 8px;
    color:#ffffff;
    font-weight:bold;
    font-size:1.1em;
    }
.group-select li { padding:4px 8px; }
.group-select li .input-box { float:left; width:275px; }
.group-select li .input-text, .group-select li select, .group-select li textarea { width:300px; }
.group-select li .input-box .input-text, .group-select li .input-box textarea { width:180px; }
.group-select li .input-box select { width:256px;}


/* Form Messages */
.validation-advice, .required { color:#EB340A; }
.validation-advice {
    clear:both;
    min-height:15px;
    margin-top:3px;
    background:url(../img/validation_advice_bg.gif) no-repeat 2px 1px;
    padding-left:17px;
    font-size:.95em;
    font-weight:bold;
    line-height:1.25em;
    }
.validation-failed {
    border:1px dashed #EB340A !important;
    background:#faebe7 !important;
    }
label.required {
    font-weight:bold;
    }
p.required {
    font-size:.95em;
    text-align:right;
    }
span.required {
text-align:left;
}
.group-select h4 span{padding-right:0; margin-right:0;}
	
.clear{clear:both;}


/*------------------------------------------------------------------

4.	PLUGINS
	Predefined utilities

--------------------------------------------------------------------

/*-------------------------------
Utility classes
-------------------------------*/

.clear { clear: both }
.hide, .hidden, .skip { display: none }
.noborder { border: 0 !important }
.top { margin-top: 0 !important; padding-top: 0 !important; }
.bottom { margin-bottom: 0 !important; padding-bottom: 0 !important; }

.hr { background: #ccc; display: block; height: 1px; margin: 1.5em 0; }
.hr hr { display: none }

.replace, .br, #logo a { display: block; font-size: 1%; line-height: 0; text-align: left; text-indent: -10000px; }

.clearfix:after { clear: both; content: "."; display: block; height: 0; visibility: hidden }


} @media print {

/*------------------------------------------------------------------

5.	PRINT
	Styles for print

------------------------------------------------------------------*/

body { background: none; color: #000; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 10pt }
code, pre { font-family: "Courier New", Courier, mono }
img { float: left; clear: left; page-break-inside: avoid; page-break-after: avoid }

a, a:link, a:visited { color: blue; text-decoration: underline }

blockquote, table, pre { page-break-inside: avoid }
ul, ol, dl  { page-break-before: avoid }
h1, h2, h3, h4, h5, h6 { display: block; font-weight: bold; page-break-after: avoid }

#footer, .ad, #nav, .nav, form, .skip { display: none }

h1 { font-size: 3em; margin: .67em 0; }
h2 { font-size: 2em; margin: .83em 0; }
h3 { font-size: 1.5em; margin: 1em 0; }
h4 { font-size: 1em; margin: 1.33em 0; }
h5 { font-size: 0.92em; margin: 1.67em 0; }
h6 { font-size: 0.83em; margin: 2.33em 0; }


/*------------------------------------------------------------------
	END CSS
------------------------------------------------------------------*/

}/* end @media */