/* CSS skeleton by Orveldv */
/* Aiming to a robust/simple structure which should work even with old IE6 without hacks */
/* If I had known IE6 was so sadly and terribly broken I would have written a simple text page. */

/* NOTES:
-  the columns enclosed into a wrapper table;
-  "clear: both;" after the columns becomes unnecessary;
-  don't let text hang around without surrounding it by <p></p>;
-  don't let any class in the css file to start with a simple dot;
-  background and border properties do not apply to <p> so enclose them in a div before; 
-  when having 2 columns inside a table specify the width for both, in % and not px; 
-  the width for a column should be specified to the td and not to a div inside it; (to be verified)
-  dotted and dashed lines are displayed as solid.
-  for underlining a title use a styled <hr> instead of a border-bottom for a div;
-  using height for divs or line-height confuses IE.
-  the width for a table should be specified in px and for td in %; (to be verified)
*/


p.hft-paras {
	color: #222222;
}

p.hft-blockcode {
	color: #000000;
}


a {
	color: #003da1;
	text-decoration: none;
}

a:hover {
	color: #a30080;
	text-decoration: underline;
}


a.nodecor {
	text-decoration: none;
	color: #fcfcff;
	background: #fcfcff;
}

img.shade {
	border: 0px solid #bbd8eb;

}

img {
	border: 0px;
}

h1 {	
	font-family: Verdana, "bitstream vera sans", "bitstream vera serif", Georgia; 
/*	font-family: "Liberation Sans", Arial, sans-serif;	*/
	text-align: left;
	font-size: 13px;
	font-weight: bold;
	color: #444444;
	padding-top: 0px;	
/*	text-transform: uppercase; */

}

h2 {
	font-family: Verdana, "bitstream vera sans", "bitstream vera serif", Georgia;
	font-size: 14px;	
	color: #2e7eb2;    
	text-align: left;
	text-decoration: none;
	padding: 1px 10px 1px 1px;
	margin-bottom: 20px;
	margin-top: 60px;
	border-bottom: 1px solid #cdd0eb;
}

h3 {
	font-family: Verdana, "bitstream vera sans", "bitstream vera serif", Georgia;
	font-size: 13px;
	color: #2e7eb2;
	text-align: left;
	text-decoration: none;
	padding: 20px 0px 0px 0px;
	margin-bottom: 10px;
	margin-top: 30px;
}

h4 {
	font-family: Verdana, "bitstream vera sans", "bitstream vera serif", Georgia;
	font-size: 13px;
	color: #2e7eb2;
	text-align: left;
	text-decoration: none;
	padding: 20px 0px 0px 0px;
	margin-bottom: 0px;
	margin-top: 0px;
}

p.DarkTitle {
	font-family: Verdana, "bitstream vera sans", "bitstream vera serif", Georgia;
	font-size: 12px;
	font-weight: bold;
	color: #666666;
	text-align: center;
	text-decoration: none;
	padding: 0px 0px 0px 0px;
	margin-bottom: 0px;
	margin-top: 0px;
}

q1 {
	padding: 0px 0px 0px 0px;
}

q2 {
	padding: 0px 0px 0px 40px;
}

q3 {
	padding: 0px 0px 0px 80px;
}

q4 {
	padding: 0px 0px 0px 120px;
}

pre {
	padding: 0px 0px 0px 0px;
	color: #a30080;
}


/*ul {
	list-style-type: none;
}
*/



hr {
	border: 0;
	color: #8fb7d1;
	background-color: #8fb7d1;
	height: 1px;
	width: 100%;
	text-align: left;
}




body, code, p {
/*	THIS CONTROLS ALL THE FONTS EXCEPT FOR SITENAME, SLOGAN, MENU, h1, h2 ... hn */
/*
	color: #000000;
	font-family: Verdana, "Bitstream Vera Sans", Sans,  Arial, sans-serif;  
*/
	font-size: 13px;
	color: #000000;
	font-family: "Liberation Sans", Arial, sans-serif;	
}

body {	
/*	background-image:  url("images/tiles/misc218.jpg");	*/

	/* THE BELOW IS FOR CENTERING THE PAGE */
	text-align: center;
	background-color: #ffffff;	
	margin: 0px;
}



div.whole {
/*	background: #ffffff;		*/
/*	background: #5aa1d0;		*/
/*	width: 778px;	*/
	width: 788px;		/* Uncomment when using shadows */
		position: relative;	/*The container must be positioned
					in order to contain positioned elements*/
		text-align: left;	
		margin: 0px auto; /*This is the proper way to center an element*/
	margin-top: 0px;	
	margin-bottom: 30px;	

	border: 1px solid #ffffff;	
/*
	border-left: 1px dashed #5aa1d0;	
	border-right: 1px dashed #5aa1d0;	
*/

/*	background-image:  url("images/tiles/misc046.jpg");	*/

/*	background-image:  url("images/tiles/misc218.jpg");	*/

}

div.whole2 {

	border: 1px solid #ffffff;	
	background: #ffffff;		
	margin: 4px;
	margin-top: 0px;	
}

div.whole3 {
	border: 0px solid #ffffff;	
	background: #ffffff;		
	margin: 0px;	
}

div.whole4 {
	border: 0px solid #ffffff;	
	background: #ffffff;		
	margin: 0px;	
}

div.whole5 {
	border: 0px solid #ffffff;	
	background: #ffffff;		
	margin: 0px;	
}


div.header {
	padding: 10px 0px 0px 0px;	
	margin-right: 60px;
	margin-left: 60px;
	margin-top: 15px;		
/*	background: #5aa1d0;	*/	
/*	background: #bbd8eb;	*/
/*	background: #0f7dc6;	*/
/*	background-image:  url("images/tiles/sky-crop2.png");	*/
/*	border-top: 8px solid #5aa1d0;	*/

/*	background-image:  url("images/tiles/misc046.jpg");	*/

/*	background-image:  url("images/tiles/misc218.jpg");	*/


}

div.section {
	text-align: justify;
	margin-left: 60px;
	margin-right: 60px;
/*	margin-top: 60px;	*/
	margin-top: 40px;	
}


div.index {
	line-height: 18px;
	border: 1px solid #bbd8eb;
	border-top: 8px solid #bbd8eb;
	padding: 5px 20px 5px 20px;
/*	color: #777777;	*/
	background: #ffffff;
}

div.index ul {
	list-style-type: none;

}

div.faq {
	line-height: 21px;
	border: 1px solid #bbd8eb;
	border-top: 8px solid #bbd8eb;
/*	padding: 5 20 5 0;	*/
	padding: 5 20 5 20;
/*	color: #777777;	*/
	background: #ffffff;
}

div.faq ul {
	list-style-type: none;
	
}

/*
div.faq a {
	font-weight: bold;	
	font-size: 13px;
	color: #2e7eb2;
}
*/

div.note {
	border-left: 4px dotted #bbd8eb;
	padding: 0px 20px 5px 20px;
	margin-top: 30px;
	margin-bottom: 30px;
	margin-left: 40px;	
}





div.mocscreenshot {
	margin-top: 25px;
	list-style-type: none;
	border: 1px solid #bbd8eb;
	border-top: 8px solid #bbd8eb;
	padding: 10px 20px 10px 20px;
	background: #fafafa;
}


p.thin {
/*	font-size: 12px;	*/
	color: #555555;
	text-align: left;
	font-family: Helvetica, "Liberation Sans", Arial, "bitstream vera sans", Verdana;	
}

div.feedback {

	border: 1px solid #dddddd;
/*	border-top: 8px solid #dddddd;	*/
/*	background: #fdfdfd;	*/
	padding: 15px 20px 15px 20px;
}

table.wrapper  {
	width: 658px;
	border: 0px;
	margin: 0px;
}	
	
table.wrapper td {
	vertical-align: top;
	padding: 0px 0px 0px 0px;
}

div.column1 {
/*	float: left;
*/
	text-align: left;
}

div.column2 {
	padding: 0px 0px 0px 25px;
	text-align: left;

}


table.download {
/*    	width: 658px;	*/
    	width: 660px;	
	padding: 0px;
}

table.download td  {
	border: 1px solid #bbd8eb;
	border-top: 8px solid #bbd8eb;
	text-align: left;
	padding: 3px 0px 3px 5px;
	background: #ffffff;	
}

table.download table td {
	border: 0px;
	padding: 3px 0px 3px 8px;
}

table.download td.emptycell {
	border: 0px;
	background: #ffffff;
}	

table.download td {
	border: 1px solid #bbd8eb;
	border-top: 8px solid #bbd8eb;

}

td.left {
	width: 65%;
	
}

td.right {
	width: 35%;
	
}



/*	It seems the most robust headers are still the table ones	*/

table.header-row {
	clear:both;	
	width: 658px;	
	border: 0px;
	background: #5aa1d0;	
	border-collapse: collapse;
	line-height: 17px;	
	border-top: 1px solid #ffffff;
}

/*
table.header-row p {
	color: #bbbbbb;	
}
*/
table.header-row td {
	border: 0px ;
	text-align: center;
	width: 14%;
	background: #5aa1d0;		
	vertical-align: top;
}

/* table.header-row td:hover {	
	border: 0px;
	text-align: center;
	width: 14%;
	background:#2e7eb2;  

}
*/

a.menuitem {
	display:block;
	width:100%;

	background: #5aa1d0;
	color: #ffffff;

	text-decoration:none;
	font-family: Verdana, "bitstream vera sans", sans, sans-serif, "Liberation Sans", Arial, Helvetica;
	font-size: 12px;
	font-weight: bold;
}

	
a.menuitem:hover {
	display:block;
	width:100%;

	background:#2e7eb2;     
	color: #ffffff;

	text-decoration:none;
	font-family: Verdana, "bitstream vera sans", sans, sans-serif, "Liberation Sans", Arial, Helvetica;
	font-size: 12px;
	font-weight: bold;
	
}

#title a {
        color:#438fc0;	
/*        color:#ffffff;	*/
/*        color:#222222;	*/
/*	color: #0f7dc6;	*/

        font-size: 28px;
        font-weight: normal;
	margin-top: 5px;	
	margin-bottom: 10px;	
/*	margin-left: 15px;	*/
	margin-left: 0px;	
	float:left;	
	font-family: "Liberation Sans", Arial, sans-serif;	
/*	text-shadow: #cccccc -1px 2px 4px;	*/
}


#title a:hover {
	text-decoration: none;
}


#slogan {
	color:#438fc0; 
/*	color:#ffffff;	*/

	font-size:13px;
/*	font-weight: bold;	*/
/*	font-style: italic; */
	padding: 20px 0px 0px 50px;	
	float:right;
/*	font-family: Verdana, "bitstream vera sans", sans, sans-serif, Arial, Helvetica; */
	font-family: "Liberation Sans", Arial, sans-serif;	
/*	margin-right: 20px;	*/
	margin-right: 0px;	

}

#footer {
	color:#222222;
	border-top:1px solid #0f7dc6;
/*	font-size:12px;	*/
/*	width: 651px;	*/
	clear:both;
	margin-top: 20px;
	margin-left: 60px;
	margin-bottom: 50px;	
	margin-right: 60px;
}

#copyright {
	color:#222222;

	padding:10px 20px 5px 0px;
	float:left;
}


.image_paragraph_right {
	float: right;
	margin-top:0px;
	margin-left:20px;
	margin-bottom:5px;
}

.image_paragraph_left {
	float: left;
	margin-top:0px;
	margin-right:60px;
	margin-bottom:10px;

}

.image_section_right {
	float: right;
	margin-top: 30px;
	margin-left:60px;
	margin-bottom:20px;
	margin-right: 0px;

	border: 2px solid #5aa1d0;	
	border-top: 16px solid #5aa1d0;

        padding: 1px;	
	background: #bbd8eb;	
}

.image_section_left {
	float: left;
	margin-top:20px;
	margin-right:20px;
	margin-bottom:10px;
}