body { 
	font-family:Arial;
	background-image:url('../img/frankiezafe.logo.jpg');
	background-position:10px -1px;
	background-attachment: scroll;
	background-repeat: no-repeat;
}

/*z-index*/
#header { z-index:10; }
#gridRoot { z-index:1; }
#frames { z-index:5; }

/*styles*/
#header { position:absolute; top:10px; left:0; font-size:11px; }
	
	.menuItem { cursor:pointer; }
	
	.button { width:200px; height:20px; background-color:#dbdbdb; color:#333; }
	.button p { margin:0; padding:4px; }
	.buttonComment { float:right; font-size:11px; }

	.menuOver { background-color:#fff; color:#000; }

	#siteName  { position:absolute; top:0px; left:0px; width:190px; font-size:10px; text-align:left; }
		#siteName a { text-decoration:none; color:#666; }
		#siteName a:hover,
		#siteName a:hover b { background-color:#ff0; color:#000; }
		#siteName b { font-size:20px; text-transform:uppercase; font-weight:normal; color:#bbb; }
		#generalMessage { display:none; font-size:12px; font-style: italic; color:#888; padding:2px 2px 2px 5px; background-color:#ff0; margin:5px 0 0 0;  }

	#rssPro,
	#rssResearch { position:absolute; top:6px; left:155px; width:30px; }
	#rssResearch { left:193px; }
	#rssPro a, #rssResearch a { color:#666; text-decoration:none; }
	#rssPro a img, #rssResearch a img { border:0; margin:0 1px 0 0; }
	#rssPro a:hover, #rssResearch a:hover { background-color:#ff0; color:#000; }

	#catSelection  { position:absolute; top:0; left:270px; width:200px; }
		
		#catList { position:absolute; top:20px; left:0; width:200px; display:none; }
		#catList p { margin:0; padding:4px; }
			
			.catListItem { width:200px; background-color:#ddd; opacity:0.8; }
			.catListItemOver { background-color:#fff; opacity:1; }
			.catListItemSelected { background-color:#000; color:#fff; opacity:0.9; }
			
			.catListRuler { width:200px; background-color:#aaa; opacity:0.8; text-align:right; }
			
			.selectionMode { width:100px; font-size:11px; }
			
		#catReminder { position:absolute; top:20px; left:0; width:200px; background-color:#eee; display:none; }
		#catReminder p { margin:0; padding:4px; }
	
	#map  { position:absolute; top:0; left:480px; /*do not forget to change verifyMapPosition also!*/ width:50px; }
	
		#mapContent { position:absolute; top:20px; left:0; display:none; }
		#mapBg { position:absolute; top:0; left:0; background-color:#ddd; opacity:0.8; }
		#mapWindow { position:absolute; top:5px; left:0; border:1px solid #f00; }
		.mapBox { position:absolute; background-color:#000; opacity:0.7; overflow:hidden; }
		.mapBoxHidden { background-color:#aaa; }
	
	#search  { position:absolute; top:0; left:690px; width:50px; display:none; }

	#fpages { position:absolute; top:0; left:690px; width:50px; }
		#fpages img { position:absolute; top:0; top:3px; left:3px; }
		#fpages .button { width:110px; } 

/*position of the menu elements*/
	#siteName { left:10px; }
	#catSelection { left:240px; }
	#map { left:445px; }
	#fpages { left:650px; }

#gridRoot { position:absolute; top:0; left:0; overflow:hidden; z-index:1; }
.imgBox { position:absolute; overflow:hidden; font-size:11px; color:#ccc; }
	.imgBox .imgWrapper { border:1px solid #ccc; }
	.imgBox img { border:0; }
	/*.imgBox img { display:none; }*//*to avoid the default img icon while loading*/
	.imgBox.BoxHidden img { background-color:#fff; opacity:0.1; }
	.imgBox.imgBoxOver { position:absolute; overflow:hidden; font-size:11px; color:#000; }
	.imgBox.imgBoxOver img { opacity:1; }
.imgBoxComment {
	display:none;
	position:absolute; overflow:hidden; 
	font-size:11px; color:#000; 
	background-color:#fff; opacity:0.85; }
	.imgBoxCommentReverse { text-align:right; }
	.comment { padding:5px; }
	.comment h2 { font-size:14px; font-weight:normal; padding:0; margin:0; }
	
.textBox { position:absolute; overflow:hidden; font-size:11px; color:#555; background-color:#fff; cursor:pointer; }
	.textBox div { padding:5px; }
	.textBox a { text-decoration:none; display:block; width:100%; color:#555; }
	.textBox b { font-size:12px; display:block; margin:0; }
	
	.textBox.BoxHidden a { color:#bbb; }
	.textBox.textBoxOver { color:#000; background-color:#eee; }
	.textBox.textBoxOver a { color:#000; }


#cellMarker { position:absolute; width:5px; height:5px; overflow:hidden; background-color:#f00; display:none; }

#frames { position:absolute; top:0; left:0; }
#frames iframe { position:absolute; top:0; left:0; display:none; }
	.floatingPage { position:absolute; background-color:#eee; width:300px; /* !if change this, adapt fpageWidth in grid.js! */ display:none; opacity:0.9; }
	.floatingPageOver { 
		background-color:#fff; 
		background-image:url('../img/animated.gradient.bg.gif');
		opacity:1; border-bottom:1px solid #aaa;
	}
	.floatingPageClose { 
		position:absolute; top:4px; left:281px; width:15px; height:15px; overflow:hidden; background-color:#000; color:#fff;
		background-image:url('../img/icon.close.jpg'); background-position:top left; background-repeat:no-repeat;
	}
	.floatingPageTitle { padding:4px; font-size:12px; color:#fff; background-color:#000; }
	.floatingPageTitle h1 { margin:0; padding:0; font-weight:normal; font-size:12px;  }
	.floatingPageTitle .buttonComment { font-size:10px; padding-right:20px; }
	.floatingPageContent { margin:7px; font-size:11px; color:#555; }
	
	.floatingPageOver .floatingPageTitle { color:#000; padding:3px 4px 4px 4px; background:none; border-top:1px solid #aaa; }
	
	/*content layout*/
	.floatingPage p a,
	.floatingPage li a,
	.floatingPage .relatedLinks a { text-decoration:none; background-color:#000; color:#fff; padding:0 2px 0 2px; }
	.floatingPage p a:visited, 
	.floatingPage li a:visited, 
	.floatingPage .relatedLinks a:visited { background-color:#777; color:#fff; }
	.floatingPage p a:hover,
	.floatingPage li a:hover,
	.floatingPage .relatedLinks a:hover,
	.floatingPage p a:visited:hover,
	.floatingPage li a:visited:hover,
	.floatingPage .relatedLinks a:visited:hover { background-color:#ff0; color:#000; }
	
	.floatingPage .bodytext { padding:0; margin:0 0 5px 0; line-height:14px; }
	.floatingPage .floatingPageContent h1,
	.floatingPage .floatingPageContent h2,
	.floatingPage .floatingPageContent h3,
	.floatingPage .floatingPageContent h4,
	.floatingPage .floatingPageContent h5,
	.floatingPage .floatingPageContent h6 { margin:10px 0 10px 0; padding:0; font-size:12px; font-weight:normal; }
	
	.floatingPage .floatingPageContent h6 { margin-top:5px; text-transform:uppercase; font-size:10px; }
	.floatingPage .floatingPageContent h6 a { text-decoration:none; background-color:#ff0; color:#000; padding:0 2px 0 2px; }
	.floatingPage .floatingPageContent h6 a:hover { background-color:#000; color:#fff; }
	
	.floatingPage .floatingPageContent h1,
	.floatingPage .floatingPageContent h2 { border-top: 1px dashed #aaa; padding-top:5px; color:#000; }
	
	
	.floatingPage .imageDressing { float:left; display:block; margin:0 5px 5px 0; }
	.floatingPage .imageGallery { float:left; display:block; width:290px; margin:0 0 10px 0; }
		.floatingPage .imageGallery img { float:left; display:block; margin:0 1px 1px 0; }
	
	.floatingPage .imageGallery a { text-decoration:none; }
	.floatingPage .imageDressing span,
	.floatingPage .imageGallery span { display:none; }
	.floatingPage .imageGallery span.imageGalleryLaunch { 
		float:left; display:block; clear:both;
		background-color:#ff0; padding:0 2px 0 2px; margin-top:5px;
		color:#000; text-transform:uppercase; font-size:10px;
	}
	
	.floatingPage .news_date { text-align:right; margin-bottom:2px; font-size:10px; color:#000; }
	
	.floatingPage h2.relatedLinksTitle { margin-bottom:5px; }
	.floatingPage .relatedLinks { float:left; display:block; width:290px; padding-bottom:5px; }
	.floatingPage .relatedLinks p { margin:0; padding:0; }
	.floatingPage .relatedLinks .link,
	.floatingPage .relatedLinks .comment { float:left; display:block; width:290px; clear:both; }
	.floatingPage .relatedLinks .link a {}
	
	/*forms*/
	.floatingPage .csc-form-labelcell { font-size:11px; color:#555; vertical-align:top; }
	.floatingPage .mailform_required { color:#000; }
	.floatingPage .mailform_required b { color:#c50; padding:0 0 0 5px; }
	.floatingPage .mailform_input,
	.floatingPage .mailform_textarea,
	.floatingPage .mailform_select { border:1px solid #ccc; font-size:11px; color:#555; }
	
	.floatingPage .mailform_required_field .mailform_input,
	.floatingPage .mailform_required_field .mailform_textarea,
	.floatingPage .mailform_required_field .mailform_select { border:1px solid #aaa; }
	
	
#gallery { position:absolute; top:0; left:0; height:90%; overflow:hidden; z-index:3000; display:none; }
#galleryBg { position:absolute; top:0; left:0; width:100%; height:100%; background-color:#000; opacity:0.8; z-index:1; }
#galleryContentWrapper { position:absolute; top:0; left:0; width:100px; height:100px; z-index:2; }

	#controls { width:100%; height:25px; background-color:#000; }
	#controls .close { 
		float:right; display:block; margin:5px 5px 0 0; width:15px; height:15px; overflow:hidden; background-color:#000; color:#fff;
		background-image:url('../img/icon.close.jpg'); background-position:top left; background-repeat:no-repeat;
	}
	#galleryTitle { float:left; display:block; margin:5px 0 0 5px; height:15px; overflow:hidden; color:#ddd; font-size:12px; }
	
	#galleryTable { width:100%; height:100%; overflow:auto; }
	#galleryContentWrapper table, #galleryContentWrapper td { margin:0; padding:0; width:100%; height:95%; }
	
	/*layout of the content within the gallery*/
	#galleryContent .big { text-align:center; }
	#galleryContent .big img { margin:10px 0 0 0; }
	#galleryContent .comment { width:100%; text-align:center; margin:5px 0 10px 0; font-size:10px; color:#ccc; }
	#galleryContent .thumbs { text-align:center; width:100%; height:1px; padding:0 0 10px 0; }
	#galleryContent .thumbs img { border:1px solid #000; padding:1px; margin:0 1px 0 0 ; }
	#galleryContent .thumbs img.imgOver { border:1px solid #fff; }
	#galleryContent .thumbs textarea { display:none; }