html { height: 100%; }

body {
	position: relative;
	margin: 0px; padding: 0px;
	height: 100%; width: 100%;
	color: #000000;
	font-size: 0.8em;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #FFFFFF;
	background-image: url('../images/ui/page-bg.png');
	background-repeat: repeat-x;
	min-height: 650px !important;
	min-width: 1000px !important;
	max-height: 100% !important;
}

form { margin: 0px; }
img { border: none; }

#page {
	position: relative;
	height: 100%; min-height: 650px;
	background-image: url('../images/ui/page-overlay.png');
	background-repeat: no-repeat;
	background-position: top center;
}


#tablet {
	position: relative; top: 35px;
	width: 800px; height: 483px;
	margin: 0px auto; padding: 34px 30px 45px 34px;
	background-image: url('../images/ui/tablet-bg.png');
	background-repeat: no-repeat;
}

#tab_area {
	position: relative; 
	width: 615px; height: 480px; 
}

#tabs       { position: relative; margin: 0px 0px 20px 0px; }
#tabs ul    { list-style-type: none; height: 30px; margin: 10px 20px; padding: 0px; }
#tabs li    { position: relative; float: left; width: 21px; height: 21px; overflow: hidden; background-color: #FFFFFF; margin: 0px 1px 0px 0px; padding: 3px; white-space: nowrap; }
#tabs li h4 { position: absolute; top: 3px; left: 0px; margin: 0px 28px; padding: 0px; white-space: nowrap; font-weight: normal; font-size: 0.8em; line-height: 21px; }
#tabs li .tab { 
	float: left; cursor: pointer;
	width: 21px; height: 21px; 
	line-height: 21px; text-align: center;
	color: #7D7D7D; font-weight: bold; 
	text-decoration: none;
	background-color: #DADADA;
}
#tabs li .tab:hover  { color: #FFFFFF; background-color: #27A9E6; text-decoration: none; font-weight: bold; }
#tabs li.active .tab { color: #FFFFFF; background-color: #27A9E6; text-decoration: none; font-weight: bold; }
#tabs li.active h4   { display: block; }

#tab_content { 
	position: relative; clear: both;
	width: 550px; height: 400px;
	margin: 0px 20px;
	overflow: hidden;
}
#tab_content p { 
	color: #DAE5EE;
}
#tab_content ul         { list-style-type: disc; margin: 10px 0px 0px 0px; padding: 0px 0px; }
#tab_content ul li      { color: #FFFFFF; font-size: 1.2em; margin-left: 1em; }
#tab_content ul li p    { color: #DAE5EE; font-size: 0.8em; } 
#tab_content ul ul      { list-style-type: disc; padding: 0px 25px; }
#tab_content ul ul li   { color: #A5BDD1; }

#tab_content_1 { position: absolute; top: 0px; left: 2px; width: 550px; height: 360px; display: block; }
#tab_content_2 { position: absolute; top: 0px; left: 2px; width: 550px; height: 360px; display: none; }
#tab_content_3 { position: absolute; top: 0px; left: 2px; width: 550px; height: 360px; display: none; }
#tab_content_4 { position: absolute; top: 0px; left: 2px; width: 550px; height: 360px; display: none; }
#tab_content_5 { position: absolute; top: 0px; left: 2px; width: 550px; height: 360px; display: none; }
#proscape_logo { position: absolute; bottom: 0px; right: 0px; }

#contact_area {
	position: absolute;
	top: 30px; right: 35px;
	width: 170px; height: 475px;
}

#contact_area h2 { color: #555555; font-size: 0.9em; font-weight: normal; }
#contact_area h3 { color: #555555; font-size: 1.0em; font-weight: bold; margin-bottom: 0px; }
#contact_area p  { color: #555555; font-size: 0.85em; font-weight: normal; margin: 0px 0px 10px 0px; }
#contact_area label { display: block; color: #555555; font-size: 0.9em; font-weight: bold; margin: 5px 0px 0px 0px; }
#contact_area input { width: 160px; font-size: 0.9em; }
#contact_area textarea { 
	width: 164px; height: 45px;
	min-width: 164px; min-height: 45px;
	max-width: 164px; max-height: 45px;
	margin: 0px; padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.9em;
}

#contact_area #connecttech_logo { display: block; width: 156px; height: 73px; margin: 0px auto 20px auto; }
#contact_area #submit { width: 71px; height: 22px; margin: 5px 0px 15px 0px; }

#stylus {
	position: absolute; bottom: -10px; left: -25px;
}

#footer {
	position: absolute;
	bottom: 0px; left: 0px;
	width: 100%; height: 40px;
	background-image: url('../images/ui/footer-bg.png');
	background-repeat: repeat-x;
	text-align: right;
}

#footer img#leaves { 
	position: absolute; 
	top: -44px; right: 26px; 
	height: 56px; width: 39px;
}

#footer p { 
	margin: 0px;
	padding: 20px 10px 0px 10px;
}

div#notification_bg {
	position: absolute;
	top: 0px; left: 0px;
	width: 170px; height: 480px;
	background-color: #FFFFFF;
	opacity: 0.6; filter: alpha(opacity=60);
}

div#notification {
	position: absolute;
	top: 0px; left: 0px;
	padding: 200px 10px 0px 10px;
	width: 150px; height: 200px;
}

div#notification img {
	display: block; cursor: pointer; margin: 10px auto;
}