#PLOTVIEW {
	position:adsolute;
	display:none;
  border: 1px solid #ccc;
	background-color:#FFF;	
	border: 35px;
	top:55px;
	left:0;	
	right:0;
	bottom:0;	
}
#BASEFRAME {
	position:fixed;
	display:none;
	background-color:transparent;
	top:3px;
	left:3px;	
	right:3px;
	bottom:3px;		
}
#SRCFRAME {
	position:absolute;
	display:block;
	//background-color:white;	
	border: 0px solid #ccc;
	top:0px;
	left:0;	
	width:100%;
	height:100%;		
}


/********************************************************************
LIST BASE 
********************************************************************/
div.LISTBASE {
	//left: 80px;
	//padding: 3px;
	margin-top: 5px;
	display: block;
	visibility: visible;
	width: 100%;	
	background-color: #FFFFFF;
	//border: 1px solid black;
	//border-bottom: 1px solid black;	
	//border-left: 1px solid black;	
	//border-right: 1px solid black;		
	overflow:hidden; 	
}



/********************************************************************
TITLE BANNER
********************************************************************/
div.TITLE-LIST {
	position:relative;
	width:100%;
	height:32px;
	background-color:#486181;
	border-top: 1px solid black;	
	border-left: 1px solid black;	
	border-right: 1px solid black;	
	color:#FFF;
}
div.TITLE-BANNER {
	position:absolute;	
	top: 5px;
	left:5px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 22px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}
table.TITLE-MODES{
	position:absolute;	
	cursor:pointer;	
	border: 0px solid black;
	top:0;
	right:0;
	width:300px;
	height:32px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
	
}
td.TITLE-MODES {
	padding: 3px;
	text-align: center;
	font-size:12px;	
	color: white;	
	background-repeat: no-repeat;
	background-position: center;	
}



/********************************************************************
COMPACT VIEW 
*********************************************************************/
div.COMPACT-VIEW {
  //margin: 3px;
  //padding: 3px;
  border: 0px solid #D3E3FF;
  background-color: #FFFFFF;
  color: black;
  float: left;
  width: 12.5%;
  margin-top: 1px solid black;
  height: 150px; 
}
div.COMPACT-VIEW:hover {
  border: 0px solid #777;
  color: white;
  background-color: #FFFFFF;
  opacity: 1.0;
}
div.COMPACT-VIEW img {
  width: 100%;
  height: 90%;
  opacity: 0.4;
  height: auto;
}
div.COMPACT-VIEW:hover img {
  opacity: 1.0;
}
div.COMPACT-VIEW-CONTROLS {
	position: relative;
	margin-left: 0px;
	margin-top: 0%;	
	padding: 0px;
  //background-color: #FFFFFF;	
	border: 0px solid #ADADAD;
	border-radius: 0px;
	opacity: 0.6;
	width: 100%;
	height: 90%;
}
div.COMPACT-VIEW-CONTROLS:hover {
  border: 0px solid #CECECE;
  color: white;
  background-color: #DADADA;
  border-radius: 0px;
  opacity: 1.0;
}
table.COMPACT-VIEW{
	position:absolute;	
	cursor:pointer;	
	border: 0px solid yellow;
	left:0;
	bottom: 0;
	width:100%;	
	height:32px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
}
td.COMPACT-VIEW {
	padding: 3px;
	text-align: center;
	color: white;		
	background-repeat: no-repeat;
	background-position: center;		
}
h1.COMPACT-VIEW {
	position:absolute;
	padding:2px;
	top:0px;
	left:5px;
	right:5px;
	height:20px;
	text-align: center;
	background-color: #FFE1A6;
	//border-radius: 8px;
	text-transform: uppercase;
	color: #18305D;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px white;
}	
p.COMPACT-VIEW {	
	position:absolute;
	top:25px;
	left:0px;
	padding: 2px;
	word-wrap: break-word;
	right:0px;
	//height:25px;
	text-align: center;
	//background-color: #E7FFBD;
	//text-transform: uppercase;
	color: #761B31;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: bold;	
	//text-shadow: 1px 1px black;
}



/********************************************************************
LIST VIEW
*********************************************************************/
div.LIST-VIEW {
  //margin: 3px;
  //padding: 3px;
  border: 0px solid #D3E3FF;
  background-color: #FFFFFF;
  color: white;
  float: left;
  width: 100%;
  height: 50px; 
}
div.LIST-VIEW:hover {
  border: 0px solid #777;
  color: white;
  background-color: #FFFFFF;
  opacity: 1.0;
}
div.LIST-VIEW img {
  width: 100%;
  height: 90%;
  opacity: 0.4;
  height: auto;
}
div.LIST-VIEW:hover img {
  opacity: 1.0;
}
div.LIST-VIEW-CONTROLS {
	position: relative;
	margin-left: 0;
	margin-top: 0;	
	padding: 0px;
	border: 2px solid #FFFFFF;
	border-radius: 8px;
	width: 99.5%;
	height: 90%;
}
div.LIST-VIEW-CONTROLS:hover {
  border: 0px solid #777;
  color: white;
  background-color: #FFFFFF;
  border: 2px solid #63855A;
  border-radius: 0px;
  opacity: 1.0;
}
table.LIST-VIEW{
	position:absolute;	
	cursor:pointer;	
	top:5px;
	left:1%;
	width:125px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}
td.LIST-VIEW {
	border: 0px solid black;	
	width: 32px;
	height:32px;
	text-align: center;
	color: white;		
	background-repeat: no-repeat;
	background-position: center;	
}
h1.LIST-VIEW {
	position:absolute;
	padding:2px;
	top:0px;
	left:150px;
	height:25px;
	width:60px;
	text-align: center;
	background-color: #245E93;
	border-radius: 8px;
	//text-transform: uppercase;
	color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}	
p.LIST-VIEW {	
	position:absolute;
	top:0px;
	left:260px;
	padding: 8px;
	word-wrap: break-word;
	right:0px;
	//height:25px;
	text-align: left;
	//background-color: #E7FFBD;
	//text-transform: uppercase;
	color: #761B31;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;	
	//text-shadow: 1px 1px black;
}






/********************************************************************
GALERY VIEW
*********************************************************************/
div.GALLERY {
  //margin: 3px;
  //padding: 3px;
  border: 0px solid #D3E3FF;
  background-color: #FFFFFF;
  color: white;
  float: left;
  width: 25%;
  height: 250px; 
}
div.GALLERY:hover {
  border: 0px solid #777;
  color: white;
  background-color: #FFFFFF;
  opacity: 1.0;
}
div.GALLERY img {
  width: 100%;
  height: 90%;
  opacity: 0.4;
  height: auto;
}
div.GALLERY:hover img {
  opacity: 1.0;
}
div.GALLERY-CONTROLS {
	position: relative;
	margin-left: 5%;
	margin-top: 2%;	
	padding: 0px;
	border: 2px solid #FFE7D2;
	border-radius: 8px;
	width: 90%;
	height: 90%;
}
div.GALLERY-CONTROLS:hover {
  border: 0px solid #777;
  color: white;
  background-color: #FFF8EC;
  border: 2px solid #A8764A;
  border-radius: 8px;
  opacity: 1.0;
}
table.GALLERY{
	position:absolute;	
	cursor:pointer;	
	bottom:5px;
	border: 1px solid #D5BE48;
	left:1%;
	right:1%;
	width:98%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}
td.GALLERY {
	border: 0px solid black;	
	width: 32px;
	height:32px;
	text-align: center;
	color: white;		
	background-repeat: no-repeat;
	background-position: center;	
}
h1.GALLERY {
	position:absolute;
	padding:2px;
	top:5px;
	left:5px;
	right:5px;
	height:25px;
	text-align: center;
	background-color: #245E93;
	border-radius: 8px;
	//text-transform: uppercase;
	color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}	
p.GALLERY {	
	position:absolute;
	top:35px;
	left:0px;
	padding: 8px;
	word-wrap: break-word;
	right:0px;
	//height:25px;
	text-align: center;
	//background-color: #E7FFBD;
	//text-transform: uppercase;
	color: #761B31;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;	
	//text-shadow: 1px 1px black;
}





/********************************************************************
ICONS IMAGES
*********************************************************************/
#DELETE {
	background-image: url("sys/rm.png");
}
#INFO {
	background-image: url("sys/info.png");
}
#PLAY {
	background-image: url("sys/play.png");
}
#ASK {
	background-image: url("sys/ask.png");
}



/********************************************************************
CONTROLS POSTITON
*********************************************************************/
div.CONTROLS {
	position: relative;
	margin-left: 5%;
	margin-top: 2%;	
	padding: 0px;
	border: 2px solid #FFE7D2;
	border-radius: 8px;
	width: 90%;
	height: 90%;
}
div.CONTROLS:hover {
  border: 0px solid #777;
  color: white;
  background-color: #FFF8EC;
  border: 2px solid #A8764A;
  border-radius: 8px;
  opacity: 1.0;
}
/********************************************************************/



/********************************************************************
VIEWS POSTITON
*********************************************************************/
h1.FILETYPE {
	position:absolute;
	padding:2px;
	top:5px;
	left:5px;
	right:5px;
	height:25px;
	text-align: center;
	background-color: #245E93;
	border-radius: 8px;
	//text-transform: uppercase;
	color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}	
h2.LISTITEM {	
	position:absolute;
	top:35px;
	left:0px;
	padding: 8px;
	word-wrap: break-word;
	right:0px;
	//height:25px;
	text-align: center;
	//background-color: #E7FFBD;
	//text-transform: uppercase;
	color: #761B31;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;	
	//text-shadow: 1px 1px black;
}





div.REMOVE {
	position:absolute;	
	cursor:pointer;	
	//border: 1px solid black;
	//background-color: #A95925;	
	background-image: url("sys/rm.png");	
	bottom:10px;
	left: 10px;
	width:32px;
	height:32px;
	text-align: center;
	color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}
div.PLAY {
	position:absolute;	
	cursor:pointer;	
	//border: 1px solid black;
	//background-color: #A95925;	
	background-image: url("sys/play.png");	
	bottom:10px;
	right: 10px;
	width:32px;
	height:32px;
	text-align: center;
	color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}
div.VIEW {
	position:absolute;	
	cursor:pointer;	
	//border: 1px solid black;
	//background-color: #FF9AE8;	
	background-image: url("sys/info.png");	
	bottom:10px;
	right: 52px;
	width:32px;
	height:32px;
	text-align: center;
	color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}
div.INFO {
	position:absolute;	
	cursor:pointer;
	//border: 1px solid black;
	background-image: url("sys/ask.png");
	bottom:10px;
	right: 94px;
	width:32px;
	height:32px;
	text-align: center;
	//background-color: #FFD48A;
	color: white;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;	
	text-shadow: 1px 1px black;
}

