/* ================================================================================================

     CSS  Coded bij :  Erwin Warps
	 
===================================================================================================*/
/* ========== added =====================*/

	.fadeThis {
		position:relative; 
		display:block;
		height: 289px;
		width: 202px;
		background:url(../img/beagent.jpg) 0 0 no-repeat;
	}
	
	.fadeThis * {
	  display: none;
	}
	
	.fadeThis span.hover {
		position: absolute; 
		top: 0;
		left: 0; 
		display: block;
		height: 289px;
		width: 202px;
		background:url(../img/beagent.jpg) 0 -289px no-repeat;
	}

	.fadeThis2 {
		position:relative; 
		display:block;
		height: 289px;
		width: 202px;
		background:url(../img/orbitprepaid.jpg) 0 0 no-repeat;
	}
	
	.fadeThis2 * {
	  display: none;
	}
	
	.fadeThis2 span.hover {
		position: absolute; 
		top: 0;
		left: 0; 
		display: block;
		height: 289px;
		width: 202px;
		background:url(../img/orbitprepaid.jpg) 0 -289px no-repeat;
	}
	
	.fadeThis1 {
		position:relative; 
		display:block;
		height: 289px;
		width: 202px;
		background:url(../img/orbitflatrate.jpg) 0 0 no-repeat;
	}
	
	.fadeThis1 * {
	  display: none;
	}
	
	.fadeThis1 span.hover {
		position: absolute; 
		top: 0;
		left: 0; 
		display: block;
		height: 289px;
		width: 202px;
		background:url(../img/orbitflatrate.jpg) 0 -289px no-repeat;
	}
	
	.fadeThis3 {
		position:relative; 
		display:block;
		height: 69px;
		width: 900px;
		background:url(../img/rate.jpg) 0 0 no-repeat;
	}
	
	.fadeThis3 * {
	  display: none;
	}
	
	.fadeThis3 span.hover {
		position:relative; 
		top:0;
		left:0; 
		display: block;
		height: 69px;
		width: 900px;
		background:url(../img/rate.jpg) 0 -70px no-repeat;
	}
	
#box {
display: none;
}
/* ========== added tot hier=====================*/
/* ==========  main site container =====================*/
.container {
	width: 1000px;
	height:800px;
	margin-left:auto;
	margin-right:auto;
}
/* ===================== menu ==========================*/
.menucontainer{
	width: 200px;
	height:auto;
	float:left;
	display:inline;
	text-align: left;
	background-image: url(../img/menumain.gif);
	background-repeat: repeat-y;
	z-index:2;
}
.menu{
	width: auto; /* do not set width > IE6 will add padding tp with and it will screwup layout of site ( becomes wider then 200px)*/
	height:400px;
	text-align: left;
	padding-left: 55px;
	color: #ff6400;
}
.menu a:link{
	text-decoration:none;
	color: #ff6400;
}
.menu a:active{
	text-decoration:none;
	color: #ff6400;
}
.menu a:visited{
	text-decoration:none;
	color: #ff6400;
}
.menu a:hover{
	padding-left:5px;
	font-weight: bold;
	text-decoration:none;
	color: #000;
}
.topmenu{
	width: 200px;
	height:224px;
	background-image: url(../img/menutop.gif);
	background-repeat: no-repeat;
}

.botmenu{
	width: 200px;
	height:267px;
	background-image: url(../img/menubot.gif);
	background-repeat: no-repeat;
}

/* ============= promobuttons ======================*/
.promo a:link{
	color: #fff;	
	text-decoration:none;
}
.promo a:active{
	color: #fff;	
	text-decoration:none;
}
.promo a:visited{
	color: #fff;	
	text-decoration:none;
}
.promo a:hover{
	color: #fff;	
	text-decoration:none;
}
/* ============= Supportbuttons ======================
.support a:link{
	color: #ff6400;	
	text-decoration:none;
	width: 70px;
	height:70px;
	background-image: url(../img/Download-orange.png);
}
.support a:active{
	color: #ff6400;
	text-decoration:none;
}
.support a:visited{
	color: #ff6400;
	text-decoration:none;
}
.support a:hover{
	color: #ff6400;	
	text-decoration:none;
	width: 70px;
	height:70px;
	background-image: url(../img/Download-orange.png);
}
*/
.rollover a {
		display:block;
		width: 600px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/Download-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rollover a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rollover a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}
.test2{
		padding-left:80px;
		}

.rolloverWorld a {
		display:block;
		width: 600px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/World-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverWorld a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverWorld a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}

.rolloverPhone a {
		display:block;
		width: 600px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/phone-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverPhone a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverPhone a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}

.rolloverGSM a {
		display:block;
		width: 600px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/gsm-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverGSM a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverGSM a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}

.rolloverXlite a {
		display:block;
		width: 600px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/xlite-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverXlite a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverXlite a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}
.rolloverAsterisk a {
		display:block;
		width: 600px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/asterisk-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverAsterisk a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverAsterisk a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}
.rolloverFring a {
		display:block;
		width: 600px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/fring-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverFring a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverFring a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}
.rolloverPDF a {
		display:block;
		width: 450px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/pdf-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverPDF a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverPDF a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}
.rolloverS a {
		display:block;
		width: 600px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/siemens-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverS a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverS a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}
.rolloverL a {
		display:block;
		width: 300px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/Link-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverL a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverL a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}
.rolloverG a {
		display:block;
		width: 300px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/Grandstream-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverG a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverG a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}
.rollovernl a {
		display:block;
		width: 52px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/n-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rollovernl a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rollovernl a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}		
.rolloverde a {
		display:block;
		width: 52px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/d-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverde a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverde a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}		
.rolloverfr a {
		display:block;
		width: 52px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/f-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloverfr a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloverfr a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}		
.rolloveren a {
		display:block;
		width: 52px;
		Height: 17px;
		padding:25px 10px 10px 7px;
		font: bold 13px Arial;
		color:#333;
		background: url("../img/e-switch.png") 0 0 no-repeat;
		text-decoration: none;
		}
.rolloveren a:hover {	
		background-position: 0 -51px;
		color: #ff6600;
		}
.rolloveren a:active {
		background-position: 0 -51px;
		color:#ff6600;
		}				
/* ============= top banner ======================*/
.topbanner{
	margin-top:20px;
	width:1000px;
	height: 100px;
	float: right;
	background-image: url(../img/top-banner.gif);
	background-repeat: no-repeat;
	background-position: right;	/*background-color:#FF0000;*/
}
/* =================  footer =======================*/
.footer{
	width:1000px;
	height: 100px;
	float:right;
	margin-top: 15px;
	padding-top: 40px;
	background-image: url(../img/footer.gif);
	background-repeat: no-repeat;
	background-position: right top;	
	/*background-color:#0066CC;*/
}
.footer a:link{
	color: #000;
	font-weight:bold;	
	text-decoration:none;
}
.footer a:active{
	color: #000;
	font-weight:bold;		
	text-decoration:none;
}
.footer a:visited{
	color: #000;	
	font-weight:bold;	
	text-decoration:none;
}
.footer a:hover{
	color: #ff6400;	
	font-weight:bold;	
	text-decoration:none;
}
.footer h6{
 	padding-top:5px;
	font-size: 12px;
	color: #999999;	
}
.footer h6 a:link{
	color: #999999;	
	text-decoration:none;
}
.footer h6 a:active{
	color: #999999;	
	text-decoration:none;
}
.footer h6 a:visited{
	color: #999999;	
	text-decoration:none;
}
.footer h6 a:hover{
	color: #ff6400;	
	text-decoration:none;
}
/* ========================= content =========================*/
.content{
	float:right;
	text-align: left;
	width:970px;
	height:auto;
	padding: 5px;
	padding-left: 20px;
	color:#000000;
	min-height:300px;
	/*background-color:#00ff00;*/
}
.content H1{
	font-size: 18px;
	font-weight: bold;
	color: #ff6400;
	margin-bottom:-10px;
}
.form_textfield{
padding-left: 5px;
	/*font-weight: bold;*/
	font-size: 11px;	
	color: #000;	
	font-family: Arial, Helvetica, sans-serif;
	background-color: #fff;
	border-right: #ff6400 1px solid;
	border-top: #ff6400 1px solid;
	border-left: #ff6400 1px solid;
	border-bottom: #ff6400 1px solid;
	}
.form_textfield_disable{
padding-left: 5px;
	/*font-weight: bold;*/
	font-size: 11px;	
	color: #000;	
	font-family: Arial, Helvetica, sans-serif;
	background-color: #CCCCCC;
	border-right: #ff6400 1px solid;
	border-top: #ff6400 1px solid;
	border-left: #ff6400 1px solid;
	border-bottom: #ff6400 1px solid;
	}
.form_name{
font-family:Arial, Helvetica, sans-serif;
font-weight: bold;
color:#ff6400;
}
/* -------  error class form name / field ------------ */
.form_textfield_error{
	padding-left: 5px;
	/*font-weight: bold;*/
	font-size: 11px;	
	color: #000;	
	font-family: Arial, Helvetica, sans-serif;
	background-color: #F0AAAA;
	border-right: #ff0000 1px solid;
	border-top: #ff0000 1px solid;
	border-left: #ff0000 1px solid;
	border-bottom: #ff0000 1px solid;
	}
.form_name_error{
font-family:Arial, Helvetica, sans-serif;
font-weight: bold;
color:#ff0000;
}
/* =================================== */
.cssbutton {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	
	border-right: #ff6400 2px solid ;
	border-top: #ff6400 2px solid;
	border-left: #ff6400 2px solid ;	
	border-bottom: #ff6400 2px solid;
	padding: 0px 3px 0px 3px;
	text-align: center;
}



/* ==============  other tags ===============================*/
body{
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
}

/* ==============  added by R.Warps for form buttons =================*/
input.SubmitButton {
  color:#ff6400;
  font: bold 84% 'trebuchet ms',helvetica,sans-serif;
  background-color:#fed;
  border:2px solid;
  border-color: #ff6400;
}
