/* body */

body
{
	margin: 0px;
	min-width: 720px;
	background-color: #333;
}

/* divs */

.logo_div
{
	display: block;
	margin: 0px;
	padding: 10px 0px 4px 0px;
	background-color: #222;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#111), to(#444));
}

.menubar_div
{
	display: block;
	margin: 0px;
	padding: 0px;
	background-color: #ccc;
	//background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#777), color-stop(0.5, #ccc), color-stop(0.5, #eee), color-stop(0.95, #ccc), to(#fff));
	background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#888), color-stop(0.95, #ccc), to(#fff));
}

.shadow_div
{
	display: block;
	margin: 0px;
	padding: 0px;
	height: 7px;
	background-color: #222;
	background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#111), to(#333));
}

.content_div
{
	display: block;
	width: 700px;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	background-color: #333;
}

.full_div,
{
	width: 646px; // 700-16*2-10*2-1*2
}

.main_div
{
	float: left;
	width: 396px; // 450-16*2-10*2-1*2
}

.sidebar_div
{
	float: left;
	width: 196px; // 250-16*2-10*2-1*2
}

.full_div,
.main_div,
.sidebar_div
{
	position: relative;
	margin: 10px;
	padding: 16px;
	background-color: #181818;
	//background-image: -webkit-gradient(linear, 0 2, 0 0, from(#181818), to(#555));
	//border: 1px solid #181818;
	-webkit-border-radius: 8px;
}

.line_div
{
	padding: 16px;
}

.footer_div
{
	height: 30px;
	clear: left;
	text-align: center;
	font:bold 10px lucida grande, helvetica;
	color:#888;
}

.overlay_div
{
	display: none;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	padding-top: 40px;
	background-color: rgba(0,0,0,0.8);
	z-index: 400;
}

/* buttons */

.full_div a.button,
.main_div a.button,
.sidebar_div a.button
{
	//margin: 0px;
	padding: 2px 12px;
	text-decoration: none;
	text-align: center;
	text-shadow:#ddd 0px 1px 1px;
	background-color: #aaa;
	background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#888), color-stop(0.95, #ddd), to(#fff));
	-webkit-border-radius: 4px;
	color: #000;
}

.full_div a.button:active,
.main_div a.button:active,
.sidebar_div a.button:active
{
	text-shadow:none;
	background-color: #666;
	background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#444), color-stop(0.95, #999), to(#bbb));
	color: #fff;
}

a.floatright
{
	float: right;
}

a.buttonlist
{
	margin-left: 10px;
}

.full_div b
{
	font: bold 12px lucida grande, helvetica;
	color: #ffe037;
}

/* menubar */

.menubar_div table
{
	border-collapse: collapse;
	margin-left: auto;
	margin-right: auto;
}

.menubar_div table td
{
	padding: 0px;
}

.menubar
{
	margin:0px;
	padding:0px;
	border:0px;
	list-style:none;
	font:normal 13px lucida grande, helvetica;
	color:#111;
}

.menubar li:hover
{
	background-color: #004af8;
	background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#004af8), color-stop(0.95, #6c8efb), to(#accefb));
//	background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#202020), color-stop(0.95, #a0a0a0), to(#d0d0d0));
}

.menubar li.menutitle
{
	display:block;
	float:left;
}

.menubar li a.menutitle
{
	padding:0 8px 0 8px;
	display:block;
	float:left;
	height:28px;
	line-height:28px;
	color:#000;
	text-shadow:#ddd 0px 1px 1px;
	text-decoration:none;
}

.menubar li a.menutitle b
{
	font-weight:bold;
}

.menubar li:hover a.menutitle
{
	text-shadow:none;
	color:#fff;
}

.menubar li:hover
{
	position: relative;
	z-index: 200;
}

.menubar ul
{
	position: absolute;
	left: -200px;
	top: -9999px;
	width: auto;
	height: auto;
	margin: 0;
	padding: 4px;
	list-style: none;

	background: #000;
	border:2px solid #aaa;
	-webkit-border-radius: 7px;

	font-size: 12px;
	font-weight: bold;
	text-shadow: none;

	-webkit-box-shadow: 0px 5px 5px 2px rgba(0,0,0,0.6);
}

.menubar :hover ul
{
	left: 0px;
	top: 28px;
}

.menubar ul.menu li
{
	background: #000;
}

.menubar ul.menu li:hover
{
	background-color: #004af8;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#6c8efb), to(#004af8));
	-webkit-border-radius: 3px;
}

.menubar ul.menu li a
{
	display: block;
	padding: 0 7px;
	width: 200px;
	display: block;
	line-height: 20px;
	text-decoration: none;
	color: #fff;
}

.menubar ul.menu li a span.menuright
{
	float: right;
	color: #888;
}

.menubar ul.menu li a:hover span.menuright
{
	color: #fff;
}

.menubar ul.menu li.separator
{
	margin: 4px 0 4px 0;
	height: 1px;
	background: #444;
}

/* images */

img.screenshot
{
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.floatleft
{
	float: left;
	padding-right: 12px;
}

img.floatright
{
	float: right;
	padding-left: 12px;
}

img.toprightcorner
{
	position: absolute;
	right: -1px;
	top: 0px;
}

/* text */

span.productname
{
	font:bold 22px lucida grande, helvetica;
	color:#fff;
}

span.productdetail
{
	font:bold 12px lucida grande, helvetica;
	color:#888;
}

span.universal
{
	font:bold 12px lucida grande, helvetica;
	color:#376cf9;
}

span.intelonly
{
	font:bold 12px lucida grande, helvetica;
	color: #ffcb5e;
}

span.price
{
	font:bold 12px lucida grande, helvetica;
	color: #ffffff;
}

span.sectiontitle
{
	display: block;
	padding-bottom: 10px;
	font: bold 12px lucida grande, helvetica;
	color: #ffcb5e;
}

span.title
{
	display: block;
	padding-bottom: 5px;
	font: bold 12px lucida grande, helvetica;
	color: #999;
}

span.title b
{
	color: #ffcb5e;
}

span.article
{
	font: normal 12px lucida grande, helvetica;
	color: #fff;
}

span.question
{
	display: block;
	padding-bottom: 5px;
	font: bold 12px lucida grande, helvetica;
	color: #ffcb5e;
}

span.answer
{
	font: normal 12px lucida grande, helvetica;
	color: #fff;
	padding-bottom: 40px;
}

span.exampleHTML,
span.exampleURL
{
	font: normal 12px lucida grande, helvetica;
	color: #fff;
}

span.cameraModels
{
	font: normal 12px lucida grande, helvetica;
	color: #fff;
}

span.cameraSupported
{
	font: normal 12px lucida grande, helvetica;
	color: #0f0;
}

span.cameraUnsupported
{
	font: normal 12px lucida grande, helvetica;
	color: #f00;
}

span.ptzSupported
{
	font: normal 12px lucida grande, helvetica;
	color: #999;
}

span.free
{
	font: bold 12px lucida grande, helvetica;
	color: #ffcb5e;
}

span.recommended
{
	font: bold 12px lucida grande, helvetica;
	color: #f90;
}

span.important
{
	font: bold 12px lucida grande, helvetica;
	color: #fc0;
}

/* normal link */

a.normallink
{
	font: bold 12px lucida grande, helvetica;
	text-decoration: none;
	color: #999;
}

a.normallink:hover
{
	font: bold 12px lucida grande, helvetica;
	text-decoration: none;
	color: #fff;
}

/* end */

