/* ================= general ================= */

html,body {
	margin:0;
	padding:0;
	}
	
body {
	background-image: url(tile3.jpg);
	background-position: top;
	background-repeat: repeat-x;
	background-color: #ffffff;
	font-size: 12px;
	/*font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;   */

	font: 80% Verdana, Geneva, sans-serif;
}



/* Styles for Accordian Content */
.technology{ 
cursor: hand;
cursor: pointer;
font: bold 13px Verdana;
margin: 10px 0;
}


.openlanguage{
color: green;
}

.closedlanguage{
color: red;
}
/*  End of Accordian styles */


/* STYLES FOR FORM VALIDATION */

input.disabled {
	border: 1px solid #F2F2F2;
	background-color: #F2F2F2;
}

input.required, textarea.required {
	border: 1px solid #00A8E6;
}
input.validation-failed, textarea.validation-failed {
	border: 1px solid #FF3300;
	color : #FF3300;
}
input.validation-passed, textarea.validation-passed {
	border: 1px solid #00CC00;
	color : #000;
}

.validation-advice {
	margin: 5px 0;
	padding: 5px;
	background-color: #FF3300;
	color : #FFF;
	font-weight: bold;
}

.custom-advice {
	margin: 5px 0;
	padding: 5px;
	background-color: #C8AA00;
	color : #FFF;
	font-weight: bold;
}


fieldset {
	padding: 1em;
}

label {
	font-weight: bold;
}

legend {
	font-weight: bold;
}
/* END OF FORM VALIDATION STYLES */




/* STYLES FOR FORMS */


/* NEW FORM STYLE */

form.newform fieldset
{
background-image: url(formtile.jpg); 
background-position: top;
background-repeat: repeat-x;
border: #5674b9 solid 1px;


float: left;    
clear: left;    
width: 100%;    
margin: 0 0 1.5em 0;    
padding: 0;
}

form.newform legend
{
color: #fff;
background: #036;
font-weight: bold;
border: #5674b9 solid 1px;
padding: 2px 6px;
margin-left: 1em;
} 

form.newform fieldset ol {  
padding: 1em 1em 0 1em;  
list-style: none;  
}  

form.newform fieldset li {  
padding-bottom: 1em;  
float: left;    
clear: left;    
width: 100%;    
}  

form.newform fieldset.submit {  
background-image: none;
float: none;    
width: auto;    
border: 0 none #FFF;    
padding-left: 16em;
}

form.newform label
{
float: left;    
width: 14em;    
margin-right: 1em; 

text-align: right;
font-weight: 100;
/*margin-left: 2em; */
display: block
}

form.newform input
{

}

form.newform select
{


}

form.newform textarea
{


}

form.newform input[type="submit"]
{


}


/* END OF NEW FORM STYLE */




/* BLUE FORM STYLES

form.blueform label
{
/*width: 4em;*/
float: left;
text-align: right;
margin-right: 0.5em;
/*margin-left: 2em; */
font-weight: bold;
display: block
}

form.blueform input
{
color: #781351;
background: #fee3ad;
border: 1px solid #781351;
font-weight: bold;
}

form.blueform select
{
color: #781351;
background: #fee3ad;
border: 1px solid #781351;
font-weight: bold;
}

form.blueform textarea
{
color: #781351;
background: #fee3ad;
border: 1px solid #781351;
font-weight: bold;
}

form.blueform input[type="submit"]
{
color: #fff;
background: #036;
border: 2px outset #d7b9c9;
}

form.blueform fieldset
{
border: 1px solid #781351;
}

form.blueform legend
{
color: #fff;
background: #036;
font-weight: bold;
border: 1px solid #781351;
padding: 2px 6px;
} 

/*  END OF BLUE FORM STYLES */

/* END OF FORM STYLING  */




/*	FOR PLAN COMPARISON TABLE  */

.plancompare table {
	width:90%;
	border-top:1px solid #e3f1fe;
	border-right:1px solid #e3f1fe;
	margin:1em auto;
	border-collapse:collapse;
	font:100%/160% "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;

	}
.plancompare caption {
	color: #9ba9b4;
	font-size: 1.3em;
	letter-spacing:.1em;
	padding:0;
	margin:1em 0 0 0;
	margin-bottom:0;
	caption-side:top;
	text-align:center;
	}	
.plancompare tr.odd td,
tr.odd .column1 {
	background:#f4f9fe url(background.gif) no-repeat;
	}	
.plancompare .column1	{
	background:#f9fcfe;
	}
.plancompare td {
	color:#678197;
	border-bottom: 1px solid #e3f1fe;
	border-left:1px solid #e5eff8;
	padding:.3em 1em;
	text-align:center;
	}				
.plancompare th {
	font-weight:normal;
	color: #678197;
	text-align:left;
	border-bottom: 1px solid #e3f1fe;
	border-left:1px solid #e5eff8;
	padding:.3em 1em;
	}	
.plancompare thead th {
	background:#f4f9fe;
	text-align:center;
	font:bold 1.2em/2em "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	color:#66a3d3
	}				
.plancompare tfoot th {
	background:#f4f9fe;
	text-align:center;
	}	
.plancompare tfoot th strong {
	font:bold 1.2em "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	margin:.5em .5em .5em 0;
	color:#66a3d3;
		}		
.plancompare tfoot th em {
	color:#f03b58;
	font-weight: bold;
	font-size: 2em;
	font-style: normal;
	}	

/* END OF PLAN COMPARISON STYLES */



/* use this for search engine optimization to do H1s, etc */
.normal {
	font-size: 14px;
	color: #000;
	background-color: #FFF;
	font-weight: 100;
}


/* 2 class for image floating */
img.imgright {
	float: right;
	margin-left: 1em;
}

img.imgleft {
	float: left;
	margin-right: 1em;
}

a { color: #333366; font-weight: bold; text-decoration: none; text-transform:capitalize; }
a:hover {text-decoration: underline; color: #666;}

/* ================= header ================= */
div#header {
	height: 100px;
	font-family: sans serif;
	font-variant: small-caps;
	padding-left:30px;
}

div#header h1 {
	padding-left: 1em;
	color: #fff;
}

div#header h1 a {
	color: #fff;
	text-decoration: none;
}


/* TEXT Clasees */
.bigboy {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: 800;
	font-size: 32px;
	color: #000;	
}

.lighttext {
	font-family: Tahoma, Geneva, sans-serif;
	font-weight: 500;
	font-size: 18px;
	color: #999;
}

.mediumtext {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 22px;
	color: #000;
	font-weight: 800;
}

.boldtext {
	font-size: 16px;	
	font-weight: bold;
}

.smallbold {
	font-size: 14px;
	font-weight: 800;
	font-family: Verdana, Geneva, sans-serif;
}

.mylist {
	margin-top: -5px;
	font-weight: 400;
	font-size: 14px;
	color: #000;	
	line-height: 150%;
}

.medlist {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 600;
	font-size: 16px;
	color: #000;	
	line-height: 170%;
	margin-top: -7px;
	margin-left: -20px;
}

.smalllist {
	font-family: Verdana, Geneva, sans-serif;
	font-weight: normal;
	font-size: 12px;
	color: #333;	
	line-height: 150%;
	margin-top: -3px;
	margin-left: -20px;
}

.smalllist li {
padding-top: 7px;
}


.headlogo {
margin-top: -8px;
}


.headtext {
  padding: 0px;
	font-size: 3em;
	font-weight: bold;
	color: #143D55;
	font-family: "Arial Black", Gadget, sans-serif;
}

.headtext2 {
  padding: 0;
	font-size: 20px;
	font-weight: bold;
	color: #143D55;
	font-family: "Arial Black", Gadget, sans-serif;
}

.headsubtext {
  padding: 0;
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
}

.spacer {
height: 8px;	
}

.quotebg {
	padding:0;
	margin:1.3em 0;
	background-image: url(../images/quotebg.jpg);
	background-position: top;
	height: 205px;
	width: 225px;
	background-color: #FFF;
}


.topback {
	background-image: url(tile2.jpg);
	background-position: top;
	background-repeat: repeat-x;
	background-color: #FFF;
	height: 105px;
}


.menubar {
	width: 100%;
	/*height: 35px;
	background-color:#336;

	border-top-style: solid;
	border-bottom-style: solid;
	border-width: 1px;
	border-color: #FFF; */
	text-align: center;
}


/* this is for sticky footer */
body > #wrap {height: auto; min-height: 100%;}
html, body, #wrap {height: 100%;}
#main {padding-bottom: 82px;}

.footer {
	/* background-image: url(footergrad.jpg);
	background-position: top;
	background-repeat: repeat-x; */
	border-top-style:solid;
	border-top-width:medium;
	border-top-color:#336699;
	background-color: #ccccff;	
	width: 100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color: #666;
	text-align:center;
	
	/* below is for sticky footer */
	position: relative;
	margin-top: -82px; /* negative value of footer height */
	height: 80px;
	padding-top: 2px;
	clear:both;
	
	
}


/* TOOLTIP STYLES  */


#dhtmltooltip{
position: absolute;
left: -300px;
width: 150px;
border: 1px solid darkblue;
padding: 2px;
background-color: lightblue;
visibility: hidden;
z-index: 1000;
/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
}

#dhtmlpointer{
position:absolute;
left: -300px;
z-index: 1001;
visibility: hidden;
}


/* END OF TOOLTIP STYLES  */




/* START OF ROUND CORNERS DIVS STYLES */



/* CSS for the box starts here
================================================*/
/* Default styling. Used when JavaScript is unsupported */
.cbb {
	padding:0 10px;
	margin:1em 0;
	background:#fff;
	border:1px solid #666;
	}
 .cbb h1 {
	margin:0 -10px;
	padding:0.3em 10px;
	background:#efece6;
	font:bold;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	}   /* //Good looking header with background, disabled for SEO */
.cbb h2,h2 {
	margin-top: -5px;
	padding:0.3em 10px;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
}
.cbb h3,h3 {
	margin:0 -10px; 
	padding:0.3em 10px;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	/*background-color: #09F;
	border: 1px solid #033;
	border-right: 0px;
	border-left: 0px;
	border-top: 0px;*/
}
.cbb h4 {
	margin:0 -10px;
	padding:0.3em 10px;
}
/* Insert the custom corners and borders for browsers with sufficient JavaScript support */
 
/* Two of the boxes are floated just for this demo. Adjust to your needs. */
.cb {
	margin:0.5em 0;
	}
.two {
	width:45%;
	float:left;
	}
.three {

	float:right;
	}
/* Rules for the top corners and border */
.bt {
	background:url(box.png) no-repeat 100% 0;
	margin:0 0 0 18px;
	height:17px;
	}
.bt div {
	height:17px;
	width:18px;
	position:relative;
	left:-18px;
	background:url(box.png) no-repeat 0 0;
	}
 
/* Rules for the bottom corners and border */
.bb {
	background:url(box.png) no-repeat 100% 100%;
	margin:0 0 0 12px;
	height:14px;
	}
.bb div {
	height:14px;
	width:12px;
	position:relative;
	left:-12px;
	background:url(box.png) no-repeat 0 100%;
	}
 
/* Insert the left border */
.i1 {
	padding:0 0 0 12px;
	background:url(borders.png) repeat-y 0 0;
	}
/* Insert the right border */
.i2 {
	padding:0 12px 0 0;
	background:url(borders.png) repeat-y 100% 0;
	}
/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
.i3 {
	background:#fff;
	border:1px solid #fff;
	border-width:1px 0;
	padding:0 10px;
	}
/* CSS for the box ends here */
 
/* You can use different borders for different boxes on the same page. Just adjust the CSS. The following is an example that uses the GIF images instead of the PNG images. Note that you can also adjust borders, heights and paddings this way. Remember to adjust the IE CSS as well. */
.three .i1,
.three .i2 {
	background-image:url(borders.gif);
	}
.three .bt,
.three .bt div,
.three .bb,
.three .bb div {
	background-image:url(box.gif);
	}
 
/* Just a bit of styling for this example. Adjust as you wish. */
.cb h1 {
	margin:0 -10px;
	padding:0.3em 10px;
	background:#efece6;
	font:bold 1.2em/1 Arial, Helvetica, sans-serif;
	}



/* END OF ROUND CORNERS STYLES */


/* START OF MATTE MENU */
 
.preload16 {background: url(menu/pro16_2.gif);}
.preload16a {background: url(menu/pro16_2a.gif);}
 
 .centermen { text-align:center; }
 
.pro16 {padding:0 0 0 200px; margin:0; list-style:none; height:43px; position:relative; background:transparent url(menu/pro16_back.gif) repeat-x left top; font-size:14px;}
.pro16 ul { text-align:center; }
.pro16 li {float:left; height:43px;}
.pro16 li a {display:block; float:left; height:40px; line-height:35px; color:#888; text-decoration:none; font-family:arial, verdana, sans-serif; font-weight:bold; text-align:center; padding:0 0 0 10px; cursor:pointer; background:url(menu/pro16_0a.gif) no-repeat;}
.pro16 li a b {float:left; display:block; padding:0 60px 0 0; background:url(menu/pro16_0.gif) no-repeat right top;}
.pro16 li.current a {color:#000; background:url(menu/pro16_2a.gif) no-repeat;}
.pro16 li.current a b {color:#000; background:url(menu/pro16_2.gif) no-repeat right top;}
.pro16 li a:hover {color:#000; background: url(menu/pro16_2a.gif) no-repeat;}
.pro16 li a:hover b {color:#000; background:url(menu/pro16_2.gif) no-repeat right top;}
.pro16 li.current a:hover {color:#000; cursor:default;}
 
 
 <!--[if IE]>
<style type="text/css">

 
#pro16 ul {display:inline-block;}
#pro16 ul {display:inline;}
#pro16 ul li {float:left;}
#pro16 {text-align:center;}

</style>
<![endif]-->


/* END OF MATTE MENU */