﻿/*
 * Styles for Jigsaw Puzzles list
 */

/* Body */
body {
	background-image: url(../images/jigsaws3.jpg);
	background-size: cover;
/*	opacity: .2; */
/*	background: url(../images/jigsaws.jpg); */
/*	background-size: 200px 200px; */
/*	background-repeat: repeat; */
}

/* Images */
img {
}
img.gray {
/*	opacity: .4; */
}
img.toggle {
	vertical-align: middle;
}
img.preview {
 	border: 5px solid yellow;
/* 	padding: 5px 20px 5px 5px; */
 	font-size: 12pt;
	display: inline;
	z-index: 70;
/* 	background: url('../images/invisbl.gif') LightGoldenRodYellow no-repeat 100% 5%; */
 	top: 240px;
 	left: 780px;
 	margin: 8x;
 	width: 300px;
	position: absolute;
 	text-decoration: none;
	visibility: hidden;
}

/* Span */
span.toggletext {
/*	text-shadow: 0 0 2px green, 0 0 2px green; */
/*	text-shadow: 2px 2px 2px green; */
	font-weight: bold;
	font-family: Arial;
 	font-size: 12pt;
	font-weight: bold;
	color: gray;
}

/* Tables */
table {
	background-color: #FEFFFE;
	padding: 5px;
}
table.main {
	padding-bottom: 25px;
	border-style: ridge;
	border-width: 10px;
	border-spacing: 0px;
	border-top-color: lightgray;
	border-left-color: lightgray;
	border-right-color: gray;
	border-bottom-color: gray;
	position: relative;
	top: 0;
	left: 0;
}
table.title {
	border-bottom: none;
	padding-top: 0px;
	padding-bottom: 4px;
}
table.header {
	border-top: none;
	border-collapse: collapse;
	display: table;
	width: 100%;
	height: 20px;
}
table.jigsaws {
	border-top: none;
	border-collapse: collapse;
	display: table;
	width: 100%;
    height: 640px;
    left: 0;
}

/* Table divisions */
thead.jigsaws {
	display: block;
	width: 100%;
}
tbody.jigsaws {
	display: block;
	width: 100%;
    height: 600px;
    overflow-y: scroll;
    overflow-x: hidden;
}

/* Table Rows */ 
tr {
	height: 20px;	
	color: darkblue;
}
tr.shade {
	background-color: #E2E2E2;
/*	background-color: Gainsboro; */
}

/* Table Headings */
th {
	padding-left: 4px;
	padding-right: 6px;
	font-weight: bold;
	font-family: Arial;
	font-size: 11pt;
	color: darkblue;
	text-align: left;
	border: none;
}

/* Table Cells */
td {
	height: 20px;
	white-space: nowrap;
	padding-left: 4px;
	padding-right: 4px;
	font-weight: normal;
	font-family: Arial;
	font-size: 11pt;
/*	color: darkblue; */
	text-align: left;
	border: none;
}
td.heading {
	border-bottom: none;
}
td.sort {
	font-weight: bold;
}
td.title
{
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 19pt;
	border-bottom: none;
	text-align: center;
}
td.subtitle
{
	font-size: 10pt;
	text-align: center;
	border-bottom: none;
	padding-bottom: 4px;
}
td.toggle
{
	font-size: 11pt;
	text-align: center;
	vertical-align: middle;
	border-bottom: none;
	padding-bottom: 4px;
}

/* Anchors */
a {
}
a:link {
    color:darkblue;
    text-decoration: underline;
}
a:visited {
    color: darkblue;
}
a:active {
    color: darkblue;
}
a.tip {
	border: 0px solid ghostwhite;
	text-decoration: none;
	font-size: 12pt;
}
a.tip:hover {
	position: relative;
	border: 0px solid ghostwhite;
}
a.tip span {
	display: none;
	border: 1px solid black;
	color: darkblue;
	font-size: 12pt;
}
a.tip:hover span {
	border: 1px solid black;
	padding: 5px 20px 5px 5px;
	font-size: 12pt;
	display: inline;
	z-index: 70;
	background: url('/images/invisbl.gif') LightGoldenRodYellow no-repeat 100% 5%;
	top: 34px;
	left: 10px;
	margin: 8x;
	width: 300px;
	position: absolute;
	text-decoration: none;
}
