body { font-family:Arial; font-size:11px; color:#77787b; background-image:url(../Images/bg_img.jpg); background-repeat:repeat-x; background-color:#98b0ba; margin:0; padding:20px 0 20px 0; }
img { border-width:0; }
h1 { color:#8491b2; font-size:17px; margin:0 0 10px 0; font-weight:normal; }

.mainDivStyle { width:1008px; height:600px; position:absolute; top:50%; left:50%; margin:-300px 0 0 -504px; background-image:url(../Images/bg_img_body.jpg); background-repeat:repeat-y; }
.lineHeight { line-height:17px; }
.borderLeftA { border-left:1px solid #616164; }
.textA { color:#9dafb9; }
.textHome { font-family:Chalet LondonNineteenEighty, Arial; font-size:13px; letter-spacing:5px; color:#9dafb9; }

.linkA A { color:#77787b; text-decoration:none; border-bottom:1px dotted #77787b; }
.linkA A:visited { color:#77787b; text-decoration:none; border-bottom:1px dotted #77787b; }
.linkA A:hover { color:#231f20; text-decoration:none; border-bottom:1px solid #231f20; }
.linkA A:active { color:#231f20; text-decoration:none; border-bottom:1px solid #231f20; }








/* MENU STYLE  */
.mainMenu ul { margin:0; padding:0; font-size:12px; font-family:Chalet LondonNineteenEighty, Arial; letter-spacing:2px;  }
.mainMenu ul li { list-style-type:none; }

/* *** first level *** */
.mainMenu ul.level1 > li { background-color:transparent; padding:0 15px 0 15px; text-align:center; white-space:nowrap; font-size:11px; border-right:1px solid #383a3d; float:left; }
.mainMenu ul.level1 > li:visited { background-color:transparent; }
.mainMenu ul.level1 > li:hover { background-color:transparent; }
.mainMenu ul.level1 > li:active { background-color:transparent; }
.mainMenu ul.level1 > li:last-child { border-right:0px; }

.mainMenu ul.level1 > li > a { color:#fff; text-decoration:none; }
.mainMenu ul.level1 > li:visited > a { color:#fff; }
.mainMenu ul.level1 > li:hover > a { color:#231f20; }
.mainMenu ul.level1 > li:active > a { color:#231f20; }
.mainMenu ul.level1 > li > a.selected { color:#231f20; }


/* *** second level *** NOT IN USE */
.mainMenu ul.level2 > li { background-color:#fff; padding:10px 0 10px 20px; text-align:left; width:150px; white-space:nowrap; font-size:11px; }
.mainMenu ul.level2 > li:visited { background-color:#fff; }
.mainMenu ul.level2 > li:hover { background-color:#efefef; }
.mainMenu ul.level2 > li:active { background-color:#efefef; }

.mainMenu ul.level2 > li > a { color:#666; text-decoration:none; }
.mainMenu ul.level2 > li:visited > a { color:#666; }
.mainMenu ul.level2 > li:hover > a { color:#af0b1c; }
.mainMenu ul.level2 > li:active > a { color:#af0b1c; }
.mainMenu ul.level2 > li > a.selected { color:#000; font-weight:bold; }
/* END - MENU STYLE  */




/* SCROLLABLE STYLE */

/* root element for the scrollable. When scrolling occurs this element stays still. */
.scrollable { position:relative; overflow:hidden; width:1008px; height:600px; }

/*
	root element for scrollable items. Must be absolutely positioned and it should have a extremely large width to accomodate scrollable items.	
    It's enough that you set the width and height for the root element and not for this element.
*/

/* this cannot be too large */
.scrollable .items { width:20000em; position:absolute; clear:both; }

.items div { float:left; width:1008px; }
.scrollable img { float:left; height:600px; }
.scrollable .active { position:relative; cursor:default; }

/* END - SCROLLABLE STYLE */