/*****size is set to 12px default - don't have to use em less than 0 - bug fixed in IE******/
/*1em = 12px when browser is set to 16px, navigation uses 12px not to destroy outline*/
body {
	font-family:Arial,Verdana,Helvetica,sans-serif;
	font-size: 76%;
}

a {
	font-weight: bold;
	color: #4d4d4d;
	text-decoration: none;
}

img {
	border: 0;
}

h4 {
	color: #333333;
	font-size: 1.3em;
	margin: 0;
	font-weight: bold;
}

h2.rightcol, h3.rightcol {
	color: #333333;
	text-decoration: none;
	margin: 0 4px 4px 4px;
	font-size: 1.3em;
}

h3.listText {
	display: inline;
	position: relative;
	top: -4px;
	margin-left: 5px;
	font-size: 1em;
}

h3.strong {
	display: inline;
	font-weight: bold;
	text-decoration: none;
	margin: 0;
	font-size: 1.2em;
}

ol li {
	margin: 10px 0;
}

p {
	font-size: 1.1em;
	font-weight: normal;
}

/*use span not div to apply this heading  inside thin boxes*/
/* delete if it doesn't affect anything ********************
.heading1 {
	font-weight: bold;
	color: #005291;
	font-size: 14px;
}
*/
.headingDiv {
	float: left;
}

.headingText {
	font-size:1.5em;
	margin: 15px 0 0 8px;
	font-weight: bold;
	color: #333333;
	float: left;
}

.inlineheading {
	color: #333333;
	font-size: 1.3em;
	margin: 0;
	font-weight: normal;
}

.strong {
	font-weight: bold;
	text-decoration: none;
}

.strongLinks {
	color: #4d4d4d;
	text-decoration: none;
}

.highlight {
	color: #4992a2;
	font-weight: bold;
	text-decoration: none;
}
/*************main containers**************/

.boldhighlight {
	font-weight: bold;
	text-decoration: none;
	font-size: 1.2em;
	color: #4d4d4d;
}

#page {
	font-size: 1em;
	left:0px;
	position:absolute;
	top:0px;
	width:100%;
	line-height: 1.2;
}

#wrapper {
	margin: 0 auto 0 auto;
	width:980px;
}

/***************************************/

#header {
	background: #006092 url(../images/bannerbgr.jpg) top left repeat-x;
	height:145px;
	width:100%;
	font-size: 14px;
}

#logo {
	float: left;
}

#logo a {
	color: #ffffff;
}

#links {
	background:transparent url(../images/banner.jpg) no-repeat scroll right top;
	float:right;
	height:100%;
	width:625px;
}

#links .links {
	float: right;
	margin: 10px 20px 0px 0px;
	color: #fdfdfd;
    text-align: right;
}

/***************upper links in header******************/

.links a:link {
	text-decoration: none;
	margin-right: 10px;
	color: #fdfdfd;
	font-weight: normal;
}

.links a:visited {
	text-decoration: none;
	margin-right: 10px;
	color: #fdfdfd;
	font-weight: normal;	
}

.links a:focus {
	text-decoration: none;
	margin-right: 10px;
	color: #E96A12;	
	font-weight: normal;
}

.links a:hover {
	text-decoration: none;
	margin-right: 10px;
	color: #E96A12;
	font-weight: normal;
}

.links a:active {
	text-decoration: none;
	margin-right: 10px;
	color: #fdfdfd;
	font-weight: normal;	
}
/***********************************************/

#navigation {
	width: 100%;
	height: 30px;
	margin-top: 15px;
	font-size: 14px;
	position:relative;
	z-index: 10;
}

/************this centers links thta are on one line*************/

#navigation .middle {
	display: block;
	margin-top: 7px; /*centers the text inside the tab - need to change if you change font size*/
}

#navigation .middleLong { /*this is for text that goes in two lines in the main navigation - for example french*/
	display: block;
	margin-top: 1px;
	line-height: 1;
	overflow: visible;
}

/********************************************************/

.navigation {
	background: url(../images/linkbutton.png) top left no-repeat;
	width: 137px;
	height: 30px;
	float: left;
	font-weight: bold;
	text-align: center;
	color: #005291;
	margin-right: 2px;
}

/**********main navigation links*******************/
#navigation a:link {
	background: url(../images/linkbutton.png) -137px 0 no-repeat;
	text-decoration: none;
	margin-right: 2px;
	color: #4d4d4d;
	font-weight: normal;
	display: block;
	width: 137px;
	height: 30px;
}

#navigation a:visited {
	background: url(../images/linkbutton.png) -137px 0 no-repeat;
	text-decoration: none;
	margin-right: 2px;
	color: #4d4d4d;
	font-weight: normal;
	display: block;	
	width: 137px;
	height: 30px;
}

#navigation a:focus {
	background: url(../images/linkbutton.png) top left no-repeat;
	text-decoration: none;
	margin-right: 2px;
	color: #005291;
	font-weight: bold;
	display: block;	
	width: 137px;
	height: 30px;
}

#navigation a:hover {
	background: url(../images/linkbutton.png) top left no-repeat;
	text-decoration: none;
	margin-right: 2px;
	color: #005291;
	font-weight: bold;
	display: block;
	width: 137px;
	height: 30px;
}

#navigation a:active {
	background: url(../images/linkbutton.png) -137px 0 no-repeat;
	text-decoration: none;
	margin-right: 2px;
	color: #4d4d4d;
	font-weight: bold;
	display: block;	
	width: 137px;
	height: 30px;
}
/***********************************************/

#subnavigation {
	margin-bottom: 20px;
	font-size: 12px;
	position: relative;
}

.subnavigation {
	color: #4d4d4d;
	margin: 0pt 15px;
	text-decoration: none;	
	font-weight: normal;
}

/**********sign up button*******************/
.signup {
	background: #E96A12 url(../images/button1.png) top left no-repeat;
	width: 90px;
	height: 30px;
	float: left;
	font-weight: bold;
	font-size: 13px;
	text-align: center;
	color: #ececec;
}

.signupright {
	background: #E96A12 url(../images/button1.png) top left no-repeat;
	width: 90px;
	height: 30px;
	float: right;
	font-weight: bold;
	font-size: 13px;
	text-align: center;
	color: #ececec;
}

/***********used before - keep to check if it affects anything - later delete***************************
td .signup, td .signupright {
	background: #E96A12 url(../images/button1.png) top left no-repeat;
	width: 90px;
	height: 30px;
	font-weight: bold;
	font-size: 13px;
	text-align: center;
	color: #ececec;
}
*/
.signup a:link, .signupright a:link {
	background: url(../images/button1.png) top left no-repeat;
	text-decoration: none;
	color: #ececec;
	display: block;
	width: 90px;
	height: 25px;
	padding-top: 5px;
}

.signup a:visited, .signupright a:visited {
	background: url(../images/button1.png) top left no-repeat;
	text-decoration: none;
	color: #ececec;
	display: block;	
	width: 90px;
	height: 25px;
	padding-top: 5px;
}

.signup a:focus, .signupright a:focus {
	background: url(../images/button1.png) -90px 0 no-repeat;
	text-decoration: none;
	color: #ffffff;
	display: block;	
	width: 90px;
	height: 25px;
	padding-top: 5px;
}

.signup a:hover, .signupright a:hover {
	background: url(../images/button1.png) -90px 0 no-repeat;
	text-decoration: none;
	color: #ffffff;
	display: block;
	width: 90px;
	height: 25px;
	padding-top: 5px;
}

.signup a:active, .signupright a:active {
	background: url(../images/button1.png) -90px 0 no-repeat;
	text-decoration: none;
	color: #ffffff;
	display: block;
	width: 90px;
	height: 25px;
	padding-top: 5px;
}
/***********************************************/

/****************round corners********************/
/*************sub menu navigation*****************/
.roundcont {
	background-color: #cccccc;
	color: #fdfdfd;
}

.roundcont p {
	margin: 0 4px;
}

.roundtop { 
	background: url(../images/tr.png) no-repeat top right; 
}

.roundbottom {
	background: url(../images/br.png) no-repeat top right; 
}

img.corner {
   width: 4px;
   height: 4px;
   border: none;
   display: block !important;
}

/***********************************************/

/****************round corners********************/
/********grey thin boxes **************************/

.thinroundtopup {
	background: url(../images/thinbgr.png) repeat-x top left;
	width: 65%; /*width of tab for heading. together with .spacer has to be 100%*/
}

/*fills the space to the left with bottom 1px line, change width (width of the whole box - left corner image - width .thinroundtopup)*/
.spacer {
border-top: solid 1px #cccccc;
float:right;
height:1px;
position:relative;
left: -1px;
right:4px;
width: 35%; /*hast to be 100% if you add width of .thinroundtopup*/
}

.thinroundcont {
	background-color: #ffffff;
	color: #000000;
}

img.rightfloat {
	float: right;
	padding: 0 4px;
}

a.more {
	clear: both;
}

.thinroundtop { 
	background: url(../images/thintr.png) no-repeat top right; 
}

.thinroundbottom {
	background: url(../images/thinbgr.png) repeat-x bottom left; 
}

.headerthinborder {
	border-left: solid 1px #cccccc;
	border-right: solid 1px #cccccc;
	border-bottom: solid 1px #cccccc;
	margin: 0;
	padding: 0 4px;
}

.thinborder {
	border-left: solid 1px #cccccc;
	border-right: solid 1px #cccccc;
	margin: 0;		/*change to center or move text inside the tab*/
	padding: 0;
}

img.thincorner {
   width: 4px;
   height: 4px;
   border: none;
   display: block !important;
}

.listins {
	border-left: solid 1px  #cccccc;
	border-right: solid 1px  #cccccc;
	margin: 0; 
	padding: 5px;
	font-size: 1em;
	color: #333333;
}
/*wider space on left and right - used for service page*/
.listinsService {
	border-left: solid 1px  #cccccc;
	border-right: solid 1px  #cccccc;
	border-top: solid 1px #cccccc;
	margin: 0; 
	padding: 0 15px;
	font-size: 1em;
	color: #333333;
}

.tabs {
	height: 30px;
	position: relative;
	top: 1px;
}

#changeText {
	height: 285px; /*visible only on services page - it is turned on in rightcolumn.php*/
}
/***********************************************/

.dblcolumn {
	width: 615px;
	float: right;
	margin: 0 0 10px 0;
}

.leftcolumn {
	float: right;
	width: 300px;
	margin: 0 0 10px 0px;
}

.middlecolumn {
	float: right;
	width: 300px;
	margin: 0 0 10px 15px;
}
/*float changed to left - fixes IE5 and less*/
.leftcolumnBorder {
	float: left;
	width: 300px;
	margin: 0px 15px 10px 0px;
}

.middlecolumnBorder {
	float: left;
	width: 300px;
	margin: 0 0 10px 0;
}

.rightcolumn {
	float: right;
	width:350px;
	margin: 0 0 10px 15px;
}

/****************round corners********************/
/*************right column background**************/
.rightroundcont {
	background-color: #c9e4fa;
	color: #fdfdfd;
}

.rightroundcont p {
	margin: 0 4px;
}

.rightroundtop { 
	background: url(../images/rbgrtr.png) no-repeat top right; 
}

.rightroundbottom {
	background: url(../images/rbgrbr.png) no-repeat top right; 
}

img.rightcorner {
   width: 4px;
   height: 4px;
   border: none;
   display: block !important;
}
/***********************************************/

/*cells inside right column*/

/*pushes images to ther right - makes second column */
/****!image has to be on the left side in the code****/
.secondcol {
	float: right;
}

/*margins has to be set to make side borders when width is 100%*/
/*first and last cell has top and bottom margin -4px because of round corners*/
#frstins {
	margin: 11px 15px 15px 15px;
}

#middleins {
	margin: 0 15px 15px 15px;
}

#lastins {
	margin: 0 15px 11px 15px;
}

/*******************************************/

/****************round corners********************/
/********right column inside white background*******/
.insroundcont {
	background-color: #ffffff;
	color: #000000;
}

.center {
	text-align: center /*use to center images and text inside white round corners - cannot be in .insroundcont coz centers top left and right corner in IE*/
}

.insroundcont p, .insroundcont h3 {
	margin: 0 4px 4px 4px;
}

.insroundtop { 
	background: url(../images/instr.png) no-repeat top right; 
}

.insroundbottom {
	background: url(../images/insbr.png) no-repeat top right; 
}

img.inscorner {
   width: 4px;
   height: 4px;
   border: none;
   display: block !important;
}

/********service.php*****************************/
#package {
 width: 600px;
}

.package {
	background: url(../images/packbgr.png) 0 -45px no-repeat;
	clear: left;
	display: block;
	width: 550px;
	height: 42px;
	padding: 3px 10px 0 10px;
}

#package a:link {
	background: url(../images/packbgr.png) 0 -45px no-repeat;
	clear: left;
	display: block;
	width: 550px;
	height: 42px;
}

#package a:visited {
	background: url(../images/packbgr.png) 0 -45px no-repeat;
	clear: left;
	display: block;
	width: 550px;
	height: 42px;
}

#package a:focus {
	background: url(../images/packbgr.png) 0 0 no-repeat;
	clear: left;
	display: block;
	width: 550px;
	height: 42px;
}

#package a:hover {
	background: url(../images/packbgr.png) 0 0 no-repeat;
	clear: left;
	display: block;
	width: 550px;
	height: 42px;
}

#package a:active {
	background: url(../images/packbgr.png) 0 -45px no-repeat;
	clear: left;
	display: block;
	width: 550px;
	height: 42px;
}

.pacprice {
	float: right; 
	font-size: 18px; 
	text-align: right;
}

.pactext {
	font-size: 14px; 
}

.italics {
	font-style: italic;
}

.vat {
	font-size: 12px;
	font-weight: normal;
}

/*vertical align text with icon in features and benefits */

.features {
	display: inline;
	font-weight: bold;
	color: #005291;
	font-size: 14px;
	position: relative; 
	top: -7px;
}

/***********************************************/

/*used to float right if two columns*/
.right2 {
	float: right;
	width: 50%;
}

.box {
	margin: 10px 0;
	clear: both;
}

.left4 {
	float: left;
	width: 25%;
}

.left {
	float: left;
	width: 14%;
	text-align: center;
}

.justify {
	text-align: justify;
}

/*used to align free phone number on service.php*/
/*
.alignleft {
	padding-left:27px;
	text-align:left;
}
*/

.list {
	padding:5px 0pt 5px 30px;
}

.listText {
	position: relative;
	top: -4px;
	margin-left: 5px;
}

.button {
	text-align: center;
}

.free {
	color:#e96a12;
	font-size:1.2em;
	font-weight: bold;
}

/*background of links at the bottom on index page*/

.bgrlink {
	background: url(../images/linkbgr.png) 0 -45px no-repeat; 
	text-decoration: none;
	color: #ececec;
	width: 300px;
	height: 40px;
	display: block;
	text-align: center;
	padding-top: 5px;
	
}

a.bgrlink:link {
	background: url(../images/linkbgr.png) 0 -45px no-repeat;
	text-decoration: none;
	color: #ececec;
	width: 300px;
	height: 40px;
	display: block;
	text-align: center;
	padding-top: 5px;
}

a.bgrlink:visited {
	background: url(../images/linkbgr.png) 0 -45px no-repeat;
	text-decoration: none;
	color: #ececec;
	width: 300px;
	height: 40px;
	display: block;
	text-align: center;
	padding-top: 5px;
}

a.bgrlink:focus {
	background: url(../images/linkbgr.png) 0 0 no-repeat;
	text-decoration: none;
	color: #ececec;
	width: 300px;
	height: 40px;
	display: block;
	text-align: center;
	padding-top: 5px;
}

a.bgrlink:hover {
	background: url(../images/linkbgr.png) 0 0 no-repeat;
	text-decoration: none;
	color: #ececec;
	width: 300px;
	height: 40px;
	display: block;
	text-align: center;
	padding-top: 5px;
}

a.bgrlink:active {
	background: url(../images/linkbgr.png) 0 0 no-repeat;
	text-decoration: none;
	color: #ececec;
	width: 300px;
	height: 40px;
	display: block;
	text-align: center;
	padding-top: 5px;
}
/***********************************************/

.prebottom {
border: 1px solid white;
clear: both;
width:100%;
height:60px;
text-align: center;
margin-bottom: 10px;
background: url('../images/paypal.gif') no-repeat 50px;

}

.bottom {
border-top: dotted 1px #e96a12;
clear: both;
width:100%;
text-align: center;
padding-top: 10px;
margin-top: 10px;
margin-bottom: 10px;
}