@charset "UTF-8";

/* cardViewer3.css */

#controls{
	height:60px;
	background-color:rgb(102,130,140);
	}

#navBarTable{
	margin:0px auto;
	background-image:linear-gradient(180deg, rgb(102,130,140), rgb(0,48,66));
	border:1px solid rgb(102,130,140);
	border-top:2px solid rgb(102,130,140);
	}


#navBarTable>tbody>tr>td, #navBarTable>tfoot>tr>td{
	padding:0px;
	margin:0px;
	}

#navBarTable>tbody>tr>td{}

#navBarTable>tfoot>tr>td{}

#navBarTable>tbody>tr>td>strong{
	display:inline-block;
	background-color:#FFFFFF;
	padding:2px 6px;
	margin:1px 2px;
	text-align:center;
	width:4em;
	border:1px solid #808080;
	color:#A00000;
	border-radius:3px;
	font-family:Consolas,Courier,Nimbus Mono L,Courier New,monospace;
	}

#navBarTable>tbody>tr>td.prevPrev{border-left:1px solid rgb(102,130,140);}
#navBarTable>tbody>tr>td.prev{}
#navBarTable>tbody>tr>td.curr{}
#navBarTable>tbody>tr>td.next{}
#navBarTable>tbody>tr>td.nextNext{border-right:1px solid rgb(102,130,140);}
#navBarTable tr>td.spacer{
	background-color:rgb(102,130,140);
	border-left:1px solid rgb(102,130,140);
	border-right:1px solid rgb(102,130,140);
	}

#navBarTable tr>td.viewToggle>img{
	background-color:#EEEEEE;
	margin:2px 8px;
	padding:2px;
	width:21px;
	height:21px;
	opacity:0.8;
	cursor:pointer;
	}
#navBarTable tr>td.viewToggle>img:hover{opacity:1.0;}
	
#navBarTable tr>td.viewToggle_grid>img#cardLayout_single{display:none;}
#navBarTable tr>td.viewToggle_grid>img#cardLayout_grid{display:block;}
#navBarTable tr>td.viewToggle_single>img#cardLayout_single{display:block;}
#navBarTable tr>td.viewToggle_single>img#cardLayout_grid{display:none;}


#navBarTable>tbody>tr>td>input{
	margin:1px 2px;
	padding:2px;
	padding-top:0px;
	padding-bottom:4px;
	border-radius:50%;
	display:block;
	overflow:hidden;
	width:24px;
	height:24px;
	background-color:#EEEEEE;
	background-image:linear-gradient(0deg, #EEEEEE, #FFFFFF);
	border:2px solid #DDDDDD;
	color:#404040;
	opacity:0.9;
	cursor:pointer;
	font-weight:bold;
	font-size:15px;
	}

#navBarTable>tbody>tr>td>input:hover{
	color:#FFFFFF;
	border:2px solid #FFFFFF;
	background-color:#808080;
	background-image:linear-gradient(0deg, rgb(102,130,140), rgb(0,48,66));
	opacity:1.0;
	}

#navBarTable>tbody>tr>td>input:disabled{
	opacity:0.2;
	}

#navBarTable>tbody>tr>td>input#nextFolder{margin-right:40px;}
#navBarTable>tbody>tr>td>input#prevFolder{margin-left:40px;}

#navBarTable>tbody>tr>td>input.prevPrev{margin-left:10px;}
#navBarTable>tbody>tr>td>input.prev{}
#navBarTable>tbody>tr>td>input.next{}
#navBarTable>tbody>tr>td>input.nextNext{margin-right:10px;}

#navBarTable>tfoot>tr>td{
	border-left:1px solid rgb(102,130,140);
	border-right:1px solid rgb(102,130,140);
	color:#FFFFFF;
	}
#navBarTable>tfoot>tr>td.drawerLabel{}
#navBarTable>tfoot>tr>td>strong{font-size:100%;display:inline-block;padding:5px 8px;padding-right:2px;}
#navBarTable>tfoot>tr>td>em{display:inline-block;padding:5px 8px;padding-left:2px;font-size:80%;}

#controls > p > input.indexType{width:auto;border-radius:5px;font-weight:normal;font-size:100%;}

#cardViewer>div{margin:10px;height:200px;}
 #cardViewer>div.active{}
#cardViewer>div.preload{}
 #cardViewer>div.loaded{}

#cardViewer>div{height:auto;}

#cardViewer>div>em{
	background-color:rgba(0,0,0,0.5);
	color:#FFFFFF;
	font-weight:bold;
	font-size:12px;
	position:relative;
	left:0px;
	top:0px;
	display:block;
	width:50px;
	height:12px;
	overflow:hidden;
	border:2px solid #000000;
	padding:4px;
	float:right;
	opacity:0;
	}
#cardViewer>div:hover>em{background-color:rgba(0,0,0,0.8);border:2px solid #FFFFFF;opacity:0;}
#cardViewer>div.active>em{background-color:rgba(0,0,0,1);border:2px solid #FFFF00;opacity:0;}

#cardViewer.single>div.active>em{
	background-color:#FFFFFF;
	color:#C00000;
	border:2px solid #000000;
	left:48%;
	height:16px;
	border-top:none;
	float:none;
	border-bottom-left-radius:4px;
	border-bottom-right-radius:4px;
	}


#cardViewer>div>img{margin-top:-24px;border:2px solid #000000;}
#cardViewer.single>div.active>img{border:2px solid #000000;margin-top:-0px;}

div.prevNextOverlay{
	display:block;
	position:absolute;
	background-color:#202020;
	border:5px solid #EEEEEE;
	color:#FFFFFF;
	top:220px;
	height:40px;
	width:24px;
	z-index:99999;
	padding:5px;
	padding-top:0px;
	padding-bottom:10px;
	margin:0px;
	text-align:center;
	font-size:36px;
	font-weight:bold;
	opacity:0.5;
	overflow:hidden;
	cursor:pointer;
	}
div.prevNextOverlay:hover{
	border:5px solid #000000;
	background-color:#FFFFFF;
	opacity:0.9;
	color:#000000;
	}	

#prevOverlay{left:0px;border-left:none;border-top-right-radius:50%;border-bottom-right-radius:50%;}
#nextOverlay{right:0px;border-right:none;border-bottom-left-radius:50%;border-top-left-radius:50%;}

header>article.logo{float:left;margin:4px;}
header>article.nav{float:right;margin:4px;}

#indexLink{
	background-color:rgb(102,130,140);
	display:inline-block;
	padding:4px 8px;
	border:1px solid #202020;
	border-radius:3px;
	color:#FFFFFF;
	text-decoration:none;
	}
	
#indexLink:hover{	
	border:1px solid rgb(102,130,140);
	background-color:rgb(0,48,66);
	text-decoration:underline;
	}