html, body{ 
 margin:0; 
 padding:0; 
 background-image: url(images/bg.jpg);
 background-position: top center;
 background-repeat: repeat-x;
 font:11px Tahoma, Arial, Helvetica, sans-serif;
 color:#354A77;
 background-color:#C2D4E0;
}
.mediumText{
font-size:14px;
line-height: normal;
}

a{
 color:#354A77;
 text-decoration:none;
}

a:hover{
 text-decoration:underline;
}

h2{
	margin:8px;
	font-size:18px;
	color:#354A77;
	background-color:inherit;
	text-transform:capitalize;
	font-family:"Trebuchet MS";
}

h3{
 margin:0px;
 font-size:15px;
 color:#354A77;
 background-color:inherit;
 text-transform:capitalize;
 font-family:"Trebuchet MS";
}
.h3LARGE{
 font-size: 14pt;
 line-height:normal;
 color:#354A77;
 background-color:inherit;
 font-family:"Trebuchet MS";
}

input, select, textarea{
 font:11px Tahoma, Arial, Helvetica, sans-serif;
}
.bodyText {
	font:11px Verdana, Arial, Helvetica, sans-serif;
	color:#003366;
	line-height: 14px;
	margin-top:0px;
	}
.bodyText-back {
	font:11px Verdana, Arial, Helvetica, sans-serif;
	color:#003366;
	line-height: 14px;
	margin-top:0px;
	background-color:#E5EAF0;
	}

/*********************************** LAYOUT COMPONENTS ***********************************/
#pagewidth{ 
 width:978px; 
 text-align:left;  
 margin-left:auto; 
 margin-right:auto;  
 clip:      rect(   )
} 
 
#headernavigation{
 position:relative; 
 height:61px; 
 background-image: url(images/top-nav.jpg);
 width:100%;
}
 
#header{
 position:relative; 
 height:202px;
 background-image: url(images/header.jpg);
 width:100%;
}

#contentwrapper{
 background-image: url(images/contentbg.jpg);
 background-position : top center;
 background-repeat:repeat-y;
}
 
#leftcol{
 width:230px; 
 float:left;
 position:relative;
 }
 
#twocols{
 width:748px; 
 float:right; 
 position:relative; 
 }
 
#rightcol{
 width:230px;
 float:right; 
 position:relative; 
 }
 
#maincol{
 float: left; 
 display:inline; 
 position: relative; 
 width:518px;
 line-height:15px;
 }

#maincol p{margin:1em;}
 
 
#footer{
 height:40px; 
 clear:both;
 background-image: url(images/footer.jpg);
 }
 
 
#footernotes{
 margin-left : 25px;
 margin-right : 25px;
 margin-top : 10px;
 height:40px;
 font:11px Tahoma, Arial, Helvetica, sans-serif;
 float:right;
 text-align:right;
 width:400px;
 display:inline;
 }
 
#designcode{
 margin-left : 25px;
 margin-right : 25px;
 height:40px; 
 font:11px Tahoma, Arial, Helvetica, sans-serif;
 float:left;
 text-align:left;
 width:200px;
 display:inline;
 }

.footertextlinks{
 text-align:center;
 padding-top:5px;
}


/*********************************** LAYOUT COMPONENTS ***********************************/








/*********************************** RIGHT COL ELEMENTS ***********************************/
#rightnavcontainer{
 padding-left: 10px;
 padding-right: 27px;
 padding-top: 10px;
 }
/*********************************** RIGHT COL ELEMENTS ***********************************/








/*********************************** LEFT COL ELEMENTS ***********************************/
a.boldlinks{
 font-weight:bold;
}

a.boldlinks:hover{
 text-decoration:none;
}

.leftcolitemcontainer{
 padding-left: 30px;
 padding-right: 10px;
 padding-top: 5px;
 }

.customimage{
 padding-left: 24px;
}
 
.featuredimage{
 padding-left: 30px;
}

.categoryholder {
 padding-left : 5px;
 padding-bottom : 25px;
 }

.caticon{
 margin: 0px 5px -6px 0px;
 }

.category {
 background-color : inherit;
 font-size : 12px;
 color : #2181BE;
 font-weight : bold;
 padding-top : 10px;
 cursor : pointer;
 }
 

.subcategory {
 background-color : inherit;
 color : #354A77;
 }
 

.subcategory ul{
 /*list-style-type: square;*/
 list-style-type: none;
 margin : 0px;
 padding-top : 5px;
 padding-bottom : 0px;
 padding-left : 0px;
 padding-right : 0px;
 }
 
.subcategory li{
 padding-top : 3px;
 padding-bottom : 0px;
 padding-left : 15px;
 margin-left : 0px;
 background-image : url(images/arrow.jpg);
 background-position:top left;
 background-repeat : no-repeat;
 }

.subcategory li a{
 background-color : inherit;
 color : #354A77;
 }

.subcategory li a:hover{
 text-decoration : underline;
 }
/*********************************** LEFT COL ELEMENTS ***********************************/








/*********************************** RIGHT COL ELEMENTS ***********************************/
.rightcolitemcontainer{
 padding-left: 10px;
 padding-right: 30px;
 padding-top: 5px;
 }
/*********************************** RIGHT COL ELEMENTS ***********************************/








/*********************************** HEADINGS AND TITLES ***********************************/
.welcometext{
height:75px;
text-align:center;
background:url(images/welcome-sa.jpg) no-repeat top left;
vertical-align:top;
width:auto;
margin-left:auto;
margin-right:auto;
}

.welcometext{
height:75px;
text-align:center;
background:url(images/welcome-sa.jpg) no-repeat top left;
vertical-align:top;
width:auto;
margin-left:auto;
margin-right:auto;
}

.welcometext-fl{
height:75px;
text-align:center;
vertical-align:top;
width:auto;
margin-left:auto;
margin-right:auto;
background-image: url(images/welcome-sa.jpg); background-repeat: no-repeat; background-position: left top
}

.welcome-ph{
height:75px;
text-align:center;
vertical-align:top;
width:auto;
margin-left:auto;
margin-right:auto;
background-image: url(images/welcome-sa.jpg); background-repeat: no-repeat; background-position: left top
}

.welcomefws{
height:75px;
text-align:center;
vertical-align:top;
width:auto;
margin-left:auto;
margin-right:auto;
background-image: url(images/welcome-sa.jpg); background-repeat: no-repeat; background-position: left top
}

.welcomedl{
height:75px;
text-align:center;
vertical-align:top;
width:auto;
margin-left:auto;
margin-right:auto;
background-image: url(images/welcome-sa.jpg); background-repeat: no-repeat; background-position: left top
}

.freeoffer{
text-align:left;
vertical-align:baseline;
width:auto;
margin-left:auto;
margin-right:auto;
background-image: url(images/Originals/free-offer.png); background-repeat: no-repeat; background-position: 10px center
; clip:   rect(   )
; padding-left: 10px
}

.headings{
 font-size:12px;
 color:#354A77;
 background-color:inherit;
 font-weight:bold;
 text-transform:uppercase;
 font-family:"Trebuchet MS";
 text-decoration:underline;
 padding-bottom:5px;
}

.headings2{
 font-size:13px;
 color:#354A77;
 background-color:inherit;
 font-weight:bold;
 font-family:"Trebuchet MS";
 padding-bottom:5px;
}

.headings3{
 font-size:11px;
 color:#6D87BE;
 background-color:inherit;
 font-weight:bold;
 padding-bottom:5px;
}

.quotationtop{
 background-image: url(images/quote_marks.gif);
 background-position: 0px -20px;
 background-repeat: no-repeat;
 text-align:justify;
}

.quotationbottom{
 background-image: url(images/quote_marks.gif);
 background-position: top right;
 background-repeat: no-repeat;
 height: 20px;
}

.inlinequotes{
 padding:10px;
 background:#E5EAF0 url(images/pen1.jpg) no-repeat right 75px;
 border:3px #354A77 solid;
}

.error{
 color:#BE6DB0;
 font-weight:bold;
}

.pointers{
 font-weight:bold;
 color:#42B400;
}
.pointersRED{
 font-weight:bold;
 color: #FF0000;
}
.links{
 cursor:pointer;
}

.nolinks{
 border:none;
}

.strong{
 font-weight:bold;

}
/*********************************** RIGHT COL ELEMENTS ***********************************/








/*********************************** TOP MENU AND LOGO ***********************************/

#logocontainer{
 padding:0px 20px;
 float:left;
 width:340px;
}

#topnavcontainer{
 padding:0px 20px;
 float: right;
 text-align: right;
 margin: 0px;
}

#topnavcontainer ul{
padding: 10px 0px;
margin: 0px;
list-style-type: none;
text-align: left;
}

#topnavcontainer li{
display:inline;
margin:0;
padding:0px;
}

#topnavcontainer a {
float:left;
background:url(images/top-navleft.jpg) no-repeat left top;
margin-right:2px;
margin-left:0px;
margin-top:0px;
margin-bottom:0px;
padding:0 0 0 4px;
text-decoration:none;
background-color:#E5EAF0; 
color : #354A77;
}

#topnavcontainer a span {
float:left;
display:block;
background:url(images/top-navright.jpg) no-repeat right top;
padding: 5px 15px 6px 12px;
font-weight:bold;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#topnavcontainer a span {float:none;}
/* End IE5-Mac hack */

#topnavcontainer a:hover span {
background-color: inherit;
color: #ffffff;
}

#topnavcontainer #current a {
background-position:0 -24px;
margin-left:4px;
}

#topnavcontainer #current a span {
background-position:100% -24px;
background-color: inherit;
margin-right:4px;
color: #ffffff;
}

#topnavcontainer a:hover {
background-position:0% -24px;
}

#topnavcontainer a:hover span {
background-position:100% -24px;
}
/*********************************** TOP MENU ***********************************/








/*********************************** ROUND CORNER BOX ***********************************/
.roundcont {
	width: 518px;
	background-color: #F6FAFF;
	padding: 0px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.roundcont2 {
	width: 725px;
	background-color: #F6FAFF;
	padding: 0px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.roundtop { 
	background: url(images/tr.jpg) no-repeat top right; 
}

.roundbottom {
	background: url(images/br.jpg) no-repeat top right; 
}

img.corner {
   width: 15px;
   height: 15px;
   display: block !important;
}

.centercontentcontainer {
 padding:0px 15px;
}
/*********************************** ROUND CORNER BOX ***********************************/








/*********************************** CENTER COL ***********************************/
.features{
padding: 0px;
margin: 0px;
list-style-type: none;
text-align: left; 
}

.features li{
margin:0px;
padding-left:22px;
padding-bottom:8px;
background: url(images/green_tick.jpg) no-repeat top left;
}

.points{
margin: 0px;
list-style-type: none;
text-align: justify; 
padding:2px 15px;
list-style-image: url(bullets/rotated_square.jpg)
}

.points li{
margin:0px;
padding:7px 0px 7px 5px;
line-height:15px;
}

.templatecontainer{
background: url(images/thnbg.jpg) top center no-repeat;
width:200px;
height:176px;
padding:5px 20px;
display:block;
}

.templatecontainer p{
margin:0px;
padding:0px;
}

.templatebox{
padding:5px 13px;
width:210px;
}

.borderwrapper{
float:left;
border:3px #F6FAFF solid;
}

.templatelinkcontainer{
float:left;
width:33%;
text-align:center;
}

.iconlinks{
border:none;
vertical-align:middle;
margin-bottom:1px;
margin-top:1px;
}

a.templatelinks:hover{
 text-decoration: underline;
}

.separator{
 border:1px dotted #354A77;
 height:1px;
}

.templatedescription{
 margin-bottom:-3px;
 float:left;
 text-align:left;
 background:#E5EAF0;
 padding:5px 10px;
 width:217px;
}
/*********************************** CENTER COL ***********************************/








/*********************************** FLAOTERS AND CONTAINERS ***********************************/
.floatcontainer{
 float:left;
 width:100%;
}

.leftfloater{
 float:left;
 width:50%;
}

.leftfloaterr{
 float:left;
 text-align:right;
 width:50%;
 background-image: url(images/pen.png)
}

.leftfloaterc{
 float:left;
 text-align:center;
 margin-left:auto; 
 margin-right:auto; 
 width:50%;
}

.leftfloaterc2{
 float:left;
 margin-left:auto; 
 margin-right:auto; 
 width:50%;
}

.rightfloater{
 float:right;
 width:50%;
}

.rightfloaterr{
 float:right;
 text-align:right;
 width:50%;
}

.rightfloaterc{
 float:right;
 text-align:center;
 margin-left:auto; 
 margin-right:auto; 
 width:50%;
}

.center{
 text-align:center;
}
/*********************************** FLAOTERS AND CONTAINERS ***********************************/








/*********************************** FORM AND FORM ELEMENTS ***********************************/
.contactform{
 width:500px
}

.contactform label{
 clear:left;
 float:left;
 width:180px;
 padding-left:50px;
 margin-top:3px;
}

.contactform input, .contactform select, .contactform textarea{
 float:left;
 margin-bottom:15px;
 border:2px solid #354A77;
 padding:2px;
}
/*********************************** FORM AND FORM ELEMENTS ***********************************/








/*********************************** TUTORIAL ROWS ***********************************/
.tutrow1{
 background-color:#E5EAF0;
 float:left;
 display:block;
 width:467px;
 border-bottom:1px dotted #354A77;
 padding:10px;
}
.tutrow1B{
 background-color:#E5EAF0;
 font-family:Arial, Helvetica, sans-serif;
 font-size:14px;
 font-weight:900;
 float:left;
 display:block;
 border-bottom:1px dotted #354A77;
 padding:10px;
}
.tutrow2{
 float:left;
 display:block;
 width:467px;
 border-bottom:1px dotted #354A77;
 padding:10px;
}

.tuttnholder{
 float:left;
 width:65px;
}

.tutcontentholder{
 float:right;
 width:395px;
}

.tuttn{
 border:2px solid #BACEE6;
 width:55px;
 height:55px;
}

.stepbox{
 background:#354A77;
 padding:5px 7px;
 font-size:18px;
 color:#ffffff;
 text-transform:uppercase;
 font-family:"Trebuchet MS";
 float:left;
}
.HeadingNew{
 background:#354A77;
 padding:5px 7px;
 font-size:14px;
 color:#ffffff;
 text-transform:uppercase;
 font-family:"Trebuchet MS";
 float:left;
}
.stepbox2{
 background:#354A77;
 padding:3px 5px;
 font-size:10px;
 font-weight:bold;
 color:#64D060;
 text-transform:uppercase;
 font-family:Tahoma;
 margin-right:5px;
}

.tutorialarea{
 float:left;
 width:467px;
 padding:10px;
 border-bottom:1px dotted #BACEE6;
}

.tutimage{
 float:left;
 width:150px;
}

.tutcontent{
 float:right;
 width:300px;
}

.tutcontentfull{
 float:right;
 width:467px;
}

.tutimg{
 border:1px solid #BACEE6;
 width:150px;
 height:150px;
}
/*********************************** TUTORIAL ROWS ***********************************/








/*********************************** HACKS AND FIXES AND PRINT STYLES ***********************************/
 /* *** Float containers fix: *** */ 
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */


 
 /*printer styles*/ 
 @media print{ 
/*hide the left column when printing*/ 
#leftcol{display:none;} 

/*hide the right column when printing*/ 
#rightcol{display:none;} 
#twocols, #maincol{width:100%; float:none;}
}
.quotes {  font-style: italic; left: 150px; clip:   rect(   ); color: #68AA74; font-weight: normal; padding-bottom: 5px}
.inline-right {  float: right; padding-right: 80px}