
@import url("type.css");

body {
	background: #fff url(/Images/bg.jpg) repeat-x 50% top;
	text-align: center;
	margin: 0;
	padding: 0;
}

	body.spinner {
		background-image: url(/Images/bg_spinner.jpg);
	}

* {
	margin: 0;
	padding: 0;
}

#cd {
	width: 960px;
	margin: 10px auto;
	text-align: left;
	position: relative;
}

#pWizard {
	width: 960px;
	margin: 10px auto;
	text-align: left;
	position: relative;
}

/* top menu */

#top {
	position: relative;
	width: 960px;
	height: 135px;
	background: url(/Images/Menu/bg.png) no-repeat;
}

#logo {
	position: absolute;
	top: 20px;
	left: 25px;
}

#Chat_Icon
{
	position: relative;
	top: 10px;
}

#Chat_Links
{
	position: absolute;
	top: 18px;
	right: 255px;
}
#Chat_Links a
{
	margin-right: 3px;
	padding-right: 5px;
	border-right: 1px solid #ddd;
	color: #e86c1f;
}

#login {
	position: absolute;
	top: 109px;
	right: 10px;
	text-align: left;
	background: url(/Images/my_page_tab_left.gif) no-repeat top left;
	height: 50px;
	padding: 0 0 0 13px;
	color: #fff;
}

	#login div {
		background: url(/Images/my_page_tab_right.gif) no-repeat top right;
		padding: 8px 13px 9px 0;
	}

	#login .info {
		background: url(/Images/my_page_tab_right.gif) no-repeat top right;
		padding: 9px 7px 9px 0;
		height: 32px;
		float: left;
	}

	#login .info p {
		float: left;
	}

	#login .info .button {
		margin-left: 10px;
		margin-top: 5px;
	}

	#login input {
		float: left;
	}

	#login .input_txt {
		margin-right: 5px;
		width: 88px;
		font-size: 0.94em;
	}

	#login .button, #login .button input, #login .button span {
		background-image: url(/Images/button/button_on_orange.png);
	}

	#login .button:hover, #login .button:hover input, #login .button:hover span, #cd #login span.hover, #cd #login span.hover input {
		background-image: url(/Images/button/button_on_orange_hover.png);
	}
	
	#login .user_links, #login .user_links a {
		color: #fff;
		clear: left;
		text-align: left;
		line-height: 1;
		margin: 0;
		text-decoration: none;
		font-size: 0.94em;
		padding-top: 3px;
	}
	
	#login .user_links a {
		padding: 1px 3px 0;
	}
	
	#login .user_links a:hover {
		text-decoration: underline;
	}

#frmlogin {
	text-align: left;
	height: 30px;
	padding: 0 0 0 13px;
	margin-top: 8px;
	color: #fff;
}

	#frmlogin div 
	{
		background: url(/Images/my_page_tab_right.gif) no-repeat top right;
		padding: 8px 13px 9px 0;
	}

	#frmlogin .info {
		background: url(/Images/my_page_tab_right.gif) no-repeat top right;
		padding: 9px 7px 9px 0;
		height: 32px;
		float: left;
	}

	#frmlogin .info p {
		float: left;
	}

	#frmlogin .info .button {
		margin-left: 10px;
		margin-top: 5px;
	}

	#frmlogin input {
		float: left;
	}

	#frmlogin .input_txt {
		margin-right: 5px;
		width: 88px;
		font-size: 0.94em;
	}

	#frmlogin .button, #frmlogin .button input, #login .button input, #login .button span {
		background-image: url(/Images/button/button_on_orange.png);
	}

	#frmlogin .button:hover, #frmlogin .button:hover input, #frmlogin span.hover, #frmlogin span.hover input,
	#login .button:hover input, #login .button:hover span, #cd #login span.hover, #cd #login span.hover input {
		background-image: url(/Images/button/button_on_orange_hover.png);
	}
	#frmlogin .button:hover, #frmlogin .button:hover input, #frmlogin span.hover, #frmlogin span.hover input {
		background-image: url(/Images/button/button_on_orange_hover.png) !important;
	}
	
	#frmlogin .user_links, #login .user_links a {
		color: #fff;
		clear: left;
		text-align: left;
		line-height: 1;
		margin: 0;
		text-decoration: none;
		font-size: 0.94em;
		padding-top: 3px;
	}
	
	#frmlogin .user_links a {
		padding: 1px 3px 0;
	}
	
	#frmlogin .user_links a:hover {
		text-decoration: underline;
	}


#search {
	position: absolute;
	top: 28px;
	right: 22px;
	text-align: right;
}
	#search .input_txt {
		width: 153px;
		float: left;
	}

	#search .button {
		margin-left: 7px;
	}

/* main navigation */

div#nav {
    color: #7b7a7a;
    height: 62px;
    top: 71px;
    margin-top: 0;
    width: 960px;
    position: absolute;
    font-size: 1.09em;
}

div#nav ul {
    position: relative;
    display: block;
    margin: 0;
    left: 10px;
    top: 5px;
    padding: 0;
    width: 950px;
}

div#nav ul li {
    display: block;
    float: left;
    padding: 0;
    margin: 0;
	background: transparent url(/Images/seperator.png) no-repeat right top;
}

div#nav .current a span, div#nav .current .current a span {
    background: transparent url(/Images/Menu/nav_arrow.gif) no-repeat 50% 0%;
    padding-bottom: 11px;
}

div#nav .current li span {
    background: none;
    padding-bottom: 0;
}

div#nav ul li.current {
    background: transparent url(/Images/Menu/level1_current_left.png) no-repeat left top;
}

div#nav ul li a, div#nav ul li a:link, div#nav ul li a:active, div#nav ul li a:visited {
    color: #7b7a7a;
    text-decoration: none;
    display: block;
    float: left;
    padding: 11px 16px 7px 15px;
    outline-style: none;
}

div#nav ul li a:hover {
    background: transparent url(/Images/Menu/hover.gif) repeat-x left top;
}

div#nav ul li.current a, div#nav ul li.current a:link, div#nav ul li.current a:active, div#nav ul li.current a:visited {
    color: #2b2b2b;
    padding: 11px 16px 23px 15px;
    background: transparent url(/Images/Menu/level1_current_right.png) no-repeat right top;
	display: inline;
}

/* second level */

	div#nav ul li ul {
		position: absolute;
		left: -10px;
		top: 33px;
		margin: 0;
		padding: 11px 0 0 10px;
		width: 950px;
		background: url(/Images/bg_topsub.png) no-repeat left top;
	}

	#cd #nav ul li ul li a, #cd #nav ul li ul li a:link, #cd #nav ul li ul li a:active, #cd #nav ul li ul li a:visited {
		color: #7b7a7a;
	}
	
	div#nav ul li.current ul li a, div#nav ul li.current ul li a:link, div#nav ul li.current ul li a:active, div#nav ul li.current ul li a:visited {
		background-image: none;
	}

	div#nav ul li ul li.current {
		background: transparent url(/Images/Menu/level2_current_left.gif) no-repeat left top;
		margin: 1px 0 0 -1px;
	}

	div#nav ul li.current ul li a:hover {
		background: transparent url(/Images/Menu/hover.gif) repeat-x left top;
	}

	#cd #nav ul li ul li.current a , #cd #nav ul li ul li.current a:link, #cd #nav ul li ul li.current a:active,
	 #cd #nav ul li ul li.current a:visited, #cd #nav ul li ul li.current a:hover {
		color: #2b2b2b;
		padding: 10px 16px 13px 11px;
		margin-left: 4px;
		background: transparent url(/Images/Menu/level2_current_right.gif) no-repeat right top;
	}

/* my page */

#nav .my_page {
	margin: 5px 10px 0 0;
	padding: 0;
	display: inline;
	background: url(/Images/bg_topsub.png) no-repeat;
	position: absolute;
	top: 33px;
	left: 0;
	width: 950px;
}

#nav .my_page a {
	background: #e86c1f url(/Images/Menu/my_page_left.gif) no-repeat left top;
	color: #fff;
	position: absolute;
	right: 0;
	top: -33px;
	text-decoration: none;
	white-space: nowrap;
}

#nav .my_page a span {
	background: url(/Images/Menu/my_page_right.gif) no-repeat right top;
	padding: 11px 24px 6px;
	display: block;
	height: 16px;
	cursor: pointer;
}

#nav .my_page a:hover {
	background: #fff url(/Images/Menu/hover_my_page.gif) repeat-x left bottom;
	color: #e86c1f;
}

#nav .my_page a:hover span {
    background: none;
}

/* second level */
	#nav .my_page ul {
		width: auto;
		height: 34px;
		position: relative;
		left: 0;
		top: 11px;
		float: right;
		padding: 0 250px 0 0;
		margin-bottom: 11px;
	}

	#nav .my_page ul li a, #nav .my_page ul li a:link, #nav .my_page ul li a:active, #nav .my_page ul li a:visited {
		background: none;
		color: #e86c1f;
		padding: 11px 16px 6px 11px;
		position: relative;
		top: 0;
		left: 0;
	}
	
	#nav .my_page li a span {
		padding: 0;
		background: none;
	}

	#nav .my_page ul li a:hover {
	    background: transparent url(/Images/Menu/hover_my_page.gif) repeat-x left bottom;
	}

	#nav .my_page ul li.current {
		background: url(/Images/Menu/level2_current_left_my_page.gif) no-repeat left top;
		margin: 0;
	}

	#nav .my_page ul li.current a, #nav .my_page ul li.current a:link, #nav .my_page ul li.current a:active, #nav .my_page ul li.current a:visited {
		background: url(/Images/Menu/level2_current_right_my_page.gif) no-repeat right top;
		color: #fff;
		padding: 11px 16px 2px 11px;
		left: 5px;
		margin-right: 5px;
	}

	#nav .my_page ul li.current a span {
    	background: transparent url(/Images/Menu/nav_arrow.gif) no-repeat 50% 0%;
    	padding-bottom: 11px;
	}

/* footer */

#footer {
	background: url(/Images/Boxes/bg_footer.png) no-repeat top left;
	margin: 10px 5px;
	padding: 17px 25px;
	color: #999;
	font-size: 0.91em;
}
	#footer span {
		margin-right: 20px;
	}
	
	#footer a, #footer a:link, #footer a:active, #footer a:visited {
		color: #999;
	}

/* flash content */

#flash {
	width: 1000px;
	position: relative;
	left: -20px;
	margin-top: 4px;
	text-align: center;
	line-height: 0;
}

/* main page structure */

#content {
	margin: 0 5px;
}

#main_content {
	float: left;
	width: 715px;
}

#side_column {
	float: right;
	width: 235px;
}

/* main section types */
.box {
	background: url(/Images/Boxes/box.png) no-repeat top left;
	width: 309px;
	padding: 24px;
}
.halfPromoBox {
	width: 309px !important;
	padding: 24px !important;
}

.box h1 {
	margin: 0;
}

.box img.left {
	padding-right: 20px;
}

.box .button {
	float: right;
}

.wide {
	background-image: url(/Images/Boxes/wide_box.png);
	width: 665px;
	min-height: 106px;
}

.narrow {
	background-image: url(/Images/Boxes/narrow_box.png);
	width: 201px;
	padding: 17px;
	float: left;
}

.normal {
	background-image: url(/Images/Boxes/normal_box.png);
	width: 422px;
	padding: 24px;
	float: left;
}

.campaign {
	margin: 5px;
	clear: left;
	display: inline;
}

.wrapper div {
	margin-left: 2px;
}

.no_boxes div {
	background: none;
}

.no_boxes {
	background: url(/Images/line.png) no-repeat center top;
	float: left;
	width: 100%;
}

/* side column content */

#side_column .box img.left {
	padding-right: 0;
}

#side_column .login {
	background: url(/Images/Boxes/login_box.png) no-repeat left bottom;
	width: 200px;
	padding: 20px 17px 7px;
	float: left;
	min-height: 278px;
	margin-bottom:7px;
	margin-top: 20px;
}

.login h3 {
	color: #fff;
	background: url(/Images/Boxes/login_box_head_tall.png) no-repeat left top;
	margin: -40px -17px 10px -17px;
	padding: 20px 17px 10px 16px;
}

.login label, .login input {
	display: block;
}

.login a {
	margin: 6px 0;
	display: block;
}

#side_column .login div {
	margin-top: 35px;
	border-top: 1px solid #ddd;
	padding: 10px 0;
}

.login div h3 {
	background-image:none;
	color: #404040;
	margin:0pt 0pt 8px;
	padding:0;
}

.login ul {
	margin: 0 0 10px;
}

.login ul li {
	background: url(/Images/Icons/check.gif) no-repeat left 2px;
	list-style: none;
	padding-left: 16px;
}

#side_column .customerservice p {
	margin-bottom:0;
}
#side_column .customerservice img.left {
	margin-left:-12px;
}
#side_column .customerservice h3 {
	margin-bottom: 3px;
}	
/* core stuff */

img {
	border: none;
}

.clr {
	clear: both;
}
	hr.clr {
		clear: both;
		border: none;
		visibility: hidden;
	}

ul {
	margin: 0px 0px 0px 30px;
}

ol {
	margin: 0px 0px 0px 30px;
}

ul.linklist {
	list-style: none;
	margin: 0;
}

ul.linklist li {
	padding: 3px 0;
}

.right, #main_content .right  {
	float: right;
}

.left {
	float: left;
}

.HiddenElement {
	display: none;
}

hr {
	border-color: #e4e4e4;
	border-style: solid;
	border-width: 1px 0 0 0;
	margin: 5px 0;
	height: 0px;
}

.active {
	color: #555;
}

/* link based buttons */
a.button {
	display: block;
	background: url(/Images/button/button.png) no-repeat left top;
	position: relative;
	padding: 0 0 0 14px;
	line-height: 0;
	height: 23px;
	color: #fff;
	text-decoration: none;
	float: left;
}

	a.button:link, a.button:active, a.button:visited {
		color: #fff;
		text-decoration: none;
	}
	
	a.button span {
		background: url(/Images/button/button.png) no-repeat right top;
		padding: 0 15px 0 0;
		line-height: 22px !important;
		height: 23px;
		display: block;
		float: left;
		cursor: pointer;
	}
	
	a.button:hover, a.button:hover span {
		background-image: url(/Images/button/button_hover.png);
	}

/* input based buttons */
span.button {
	background: url(/Images/button/button.png) no-repeat left top;
	float: left;
}
	.button input {
		background: url(/Images/button/button.png) no-repeat right top;
		border: none;
		color: #fff;
		height: 23px;
		cursor: pointer;
		padding: 0 10px 3px 0;
		margin-left: 10px;
		font-size: 1.09em;
	}
	span.button:hover, span.button:hover input, #cd span.hover, #cd span.hover input, .frontLoginButton-hover, .frontLoginButton-hover input {
		background-image: url(/Images/button/button_hover.png);
	}

/* product buttons (both types) */
span.action, a.action, span.action input, a.action span {
		background-image: url(/Images/button/button_orange.png);
	}
	
	span.action:hover, a.action:hover, span.action:hover input, a.action:hover span, #cd span.action_hover, #cd span.action_hover input {
		background-image: url(/Images/button/button_orange_hover.png);
	}

/* big buttons (both types) */
span.big, a.big {
	background-image: url(/Images/button/big_button.png);
	height: 31px;
}

	span.big input, a.big span {
		background-image: url(/Images/button/big_button.png);
		height: 31px;
		line-height: 31px !important;
	}
	
	span.big:hover, a.big:hover, span.big:hover input, a.big:hover span, #cd span.big_hover, #cd span.big_hover input {
		background-image: url(/Images/button/big_button_hover.png);
	}

/* other form elements */
.frm, select, .input_txt {
	font: 100% arial, sans-serif;
	color: #000000;
	padding: 2px 1px;
}

input.small, select.small {
	width: 85px;
}

input.date, select.date {
	width: 45px;
}

input.x-small, select.x-small {
	width: 40px;
}

input.large, select.large {
	width: 155px;
}

input.x-large, select.x-large {
	width: 260px;
}

label {
	margin-top: 4px;
}

textarea {
	font: 100% arial, sans-serif;
	border: 1px solid #999;
	color: #111;
}

/* tables */

table {
	font-size: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	margin: 0 0 16px 0;
}

th {
	text-align: left;
}

/* for lightboxes */
#overlay {
	background-color: #666;
	opacity: 0.7;
}

/* Alerts and error messages */
.info_message {
	background: url(/Images/Icons/30x21/green.gif) no-repeat left center;
	margin-top: 20px;
	padding: 5px 5px 5px 35px;
	clear: both;
	border-top: 1px solid #e7e7e7;
	border-bottom: 1px solid #e7e7e7;
	font-weight: bold;
}

.warning_message {
	background: url(/Images/Icons/30x21/orange.gif) no-repeat left center;
	margin-top: 20px;
	padding: 5px 5px 5px 35px;
	clear: both;
	border-top: 1px solid #e7e7e7;
	border-bottom: 1px solid #e7e7e7;
	font-weight: bold;
}

.error_message {
	background: url(/Images/Icons/30x21/red.gif) no-repeat left center;
	margin-top: 20px;
	padding: 5px 5px 5px 35px;
	clear: both;
	border-top: 1px solid #e7e7e7;
	border-bottom: 1px solid #e7e7e7;
	font-weight: bold;
	color:#E86C1F;
}

.no_message {
	background: none;
	margin-top: 20px;
	padding: 5px;
	clear: both;
	border-top: 1px solid #e7e7e7;
	border-bottom: 1px solid #e7e7e7;
	font-weight: bold;
}

/* 
-------------------------------------------------
STEP-NAVIGATION, WITH ONE OR TWO BUTTONS
-------------------------------------------------
 */
#main_content .step-navigation {
	background:transparent url(/Images/customer-reg-line-bg-buttons.gif) repeat-x scroll  0% 50%;
	clear:both;
	height:31px;
	top:10px;
	margin-right:40px;
	position:relative;
	padding-right:0;
}
.step-navigation .previous {
	float:left;
	margin-top:5px;
}
.step-navigation a.button {
	left:0px;
}

.step-navigation a.action, .step-navigation span.action, .step-navigation a.action span, .step-navigation span.action input {
	background-image: url(/Images/button/big_button_orange.png);
}

.step-navigation a.action:hover, .step-navigation span.action:hover, .step-navigation a.action:hover span, .step-navigation span.action:hover input, 
#cd .step-navigation span.action_hover, #cd .step-navigation span.action_hover input {
	background-image:url(/Images/button/big_button_orange_hover.png);
}
	
.step-navigation .action input, .step-navigation a.action span {
	line-height:28px !important;
}

/* 
-------------------------------------------------
PROGRESS INDICATOR, 1,2,3 ...
-------------------------------------------------
 */

ul.progress  {
	list-style-type:none;
	margin:0;
	padding:0;
	padding-bottom:24px;
	background:transparent url(/Images/customer-reg-progress-bg.gif) repeat-x 0px 10px;
	height:2em;
	display:block;
}
.progress li {
	float:left;
	background:transparent url(/Images/customer-reg-progress-passive.gif) no-repeat left top;
	padding:2px 0 4px 7px;
}
.progress li span {
	background-color:white;
	margin: 0 30px 0 4px;
	padding:0 6px 0 6px;
}
.progress li.active {
	background-image: url(/Images/customer-reg-progress-active.gif);
	font-weight:bold;
	color:#000;
}

/* 
-------------------------------------------------
TERMS AND CONDITIONS, I ACCEPT THE TERMS
-------------------------------------------------
 */
 #main_content fieldset.terms {
	width:180px;
	padding-bottom:0;
	margin-bottom:0;
	display:block;
	border-width:0px;
	padding-bottom:0px;
	margin-bottom:0px;
}
.terms input {
	margin-top:1px;
	margin-right:2px;
}
.terms label {
	width:110px;
	margin-top:2px;
	margin-left:3px;
}
.terms a, .terms a:link {
	width:100px;
	clear:left;
	display:block;
	left:20px;
	position:relative;
}
.terms h4 {
	margin-top:5px;
	margin-bottom:2px;
}

/* 
----------------------------------------------------
OVERLAY, UPDATE PANEL, UserGuideWizard //By Dariusz
----------------------------------------------------
 */

.csContainer
{
	background:transparent url(/Images/Lightbox/lightbox_bg_top.png) no-repeat scroll left top;
	width:936px;
	height:465px;
	left:163px;
	top:40px;
	padding: 16px 0px 0px 0px;
	position:fixed;
	display: none;
	z-index:1;
}
.csContainer .innerContainer
{
	background:transparent url(/Images/Lightbox/lightbox_bg_bottom.png) no-repeat scroll left bottom;
	margin: 0px;
	padding: 12px 20px 40px 20px;
}

.modalPopupExtender .navigation .previous {
	float: left;
	top: -16px;
	left: 15px;
}

.modalPopupExtender .navigation .next {
	float: right;
	top: -20px;
	right: -15px;
}

.modalPopupExtender
{
	background:transparent url(/Images/Lightbox/lightbox_bg.png) no-repeat scroll left top;
	width:936px;
	height:465px;
	left:163px;
	top:40px;
	position:fixed;
	/*display:none;*/
	z-index:1;
}

.modalPopupExtenderBackground
{
	width:100%;
	height:100%;
	z-index:0;
	background-color:#666666;
	opacity:0.7;
	filter: alpha(opacity=60);
}

.modalPopupExtender .close {
	float: right;
	margin-top: 20px;
	margin-right: 15px;
}

.modalPopupExtender h1 {
	margin: 20px 0 0 25px;
}

.modalPopupExtender .description {
	width: 356px;
	float: left;
	margin-left: 25px;
	margin-top: 25px;
}

.modalPopupExtender .screen {
	float: right;
	width:538px;
	height:302px;
	margin-top:25px;
}

.modalPopupExtender .navigation {
	clear: both;
	background: url(/Images/line.png) no-repeat left top;
	/*border-bottom: 1px solid #cdcdcd;*/
	height: 10px;
	padding: 30px 10px 10px 10px;
	width: 916px;
	position: absolute;
	bottom: 0px;
}

.package {
	background: transparent url(/Images/line_full.gif) no-repeat scroll center bottom;
}
.package.last {
	background-image: url(/Images/line.png);
	margin-bottom: 10px;
	padding-bottom: 28px;
}

/* 
----------------------------------------------------------------
NEW SECURE LOGIN BOX
----------------------------------------------------------------
*/

.pageDiv
{
	width: 100%;	
}

.contentDiv
{
	position: relative; 
	margin: 0 auto; 
	width: 950px;
}

.loginDiv
{
	position: absolute; 
	width: 330px; 
	height: 30px;
	background-color: transparent;		
	left: 650px; 
	top: 110px; 
}
#btnLogin {
	width: 75px;
	overflow: hidden;
}
.frontLoginDiv
{
	text-align: left;
	position: absolute; 
	width: 200px; 
	background-color:Transparent;		
	top: 198px; 
	left: 737px; 
	height: 110px;
}

.frontLoginButton
{
	position: relative; 
	top: 30px;
	float: right !important;
}

#main_content #cregStep2 .terms {
	width: 320px !important;
}

#vda {
  position: absolute;
  vertical-align: middle;
  float: left;
  clear: left;
  top: 25px;
  left: 250px;
  width: 250px;
}
 
#assistant {
  width: auto;
}
 
#vdanew {
  padding-left: 0px;
}


