.handheld {display:none;}
.notpc {display:none;}



.MainPictureSearch{
	text-align:center;
	width:auto;
	margin-left:auto;
	margin-right:auto;
	margin-top:2px;
	margin-bottom:2px;
	padding:2px;
	background-color: #D8E9FD;
	/*-moz-border-radius: 3px;*/
	border-radius: 0.4em;
}


.Last5Groups {/*clear:both;*/}
.MainPictureListBlock  div{/*clear:both;*/margin:0;padding:0;}
.MainPictureList ol {/*float: left;*//*width: 15em;*/margin:0;padding:0;border-left-width:0;/*list-style: none;*/}
.MainPictureList li {list-style-type: none;/*float: left;*//*width: 20%;*/ /*6em;*/margin:0;padding:0;border:0px;/*border-bottom-width: 1px; border-bottom-style: solid;border-bottom-color: #B4C6DB;*/}
.GroupPictureList ol {float: left;/*width: 20%;*/margin:0;padding:0;list-style: none;}
.GroupPictureList li {list-style-type: none;float: left;width: 25%;margin:0;padding:0;border-bottom-width: 0; border-top-style: none;border-bottom-color: #B4C6DB;}

/*.MainPictureList a {text-decoration:none;}*/

.single-image {
	vertical-align: middle;
	padding: 0;
	margin: 0;
	border-color: #B4C6DB;
	border-width: 2px;
	border-style: inset;

	min-width: 60px;
	/*min-height: 60px;*/
}
/*
.single-image img {
	min-width: 60px;
	min-height: 60px;
}
*/




.back {
	height: 100%;
	/*background-color: lightcoral;*/
	position: relative;
	/*border: 1px solid black;*/
}

.back-text {
	position: absolute;
	width: 60px;
	height: 140px;

	top: 50%;
	margin-top: -70px;
	left: 50%;
	margin-left: -30px;

	background-color: #ccc;
	border: 3px solid #aaa;
	border-radius: 15px;
	z-index: -100;
}


.anchor {
	height: 100%;
	position: relative;

}

.anchor-text {
	position: absolute;
	width: 60px;
	height: 60px;
	line-height: 60px;

	top: 50%;
	margin-top: -30px;
	left: 50%;
	margin-left: -30px;

	font-size: 2.5em;
	color: white;
	opacity: 0.5;

	z-index: 100;
}





.ThumbNailImage{padding:0;margin:4px;border-color: #B4C6DB;border-width:2px;border-style:inset;}
.GalleryNav {font-family: sans-serif;text-decoration:none;color:black;font-weight:bold;}
.center{text-align:center;margin-left:auto;margin-right:auto;}
table.scrtab {margin-left:auto;margin-right:auto;}
td.scrtab2 {border-width:0px;border-style:solid;border-bottom-width:1px;border-color:gray;}




/*------------------------------------------------*//* ID */
/* CLASS */
/*
.warn { color:#32CD32; text-align:left; }
.err { color:#DC143C; text-align:left; }
*/
/*------------------------------------------------*/
/* -- form buttons --*/
/*
input.btn {  color:#050;  font: bold 84% 'trebuchet ms',helvetica,sans-serif;  background-color:#fed;  border: 1px solid;  border-color: #696 #363 #363 #696;}
*/

/*
input.btnr {color:#600;}
*/

/* -- new stuff!! --*/


img {
	max-height: 100%;
	width: auto;
}


.thumbnail-frame {
	display: inline-block;
	height: 18vw;
	min-height: 100px;
	max-height: 204px;
/*	border: 2px solid red;*/
}


/* leftSmallImage - used front page random picture */
.leftSmallImage {
	float: left;
	margin: 1em;
	width: 45%;
	max-width: 500px;
}
.leftSmallImage img {
	width: 100%;
	max-width: 500px;
}

/* picResize - resize an image contained within a div of class picResize. used: newsletters/index.php */
.picResize {
	display: inline-block;
	padding: 0 1em;
}

.picResize img {
	width: 100%;
}


/* onepage stuff here */

.image-area {
	display: block;
	background-color: black;
	text-align: center;
	position: relative;
}


.image-centered {
	max-width: 100%;
	display: inline-block;
	position: relative;
	z-index: 10;
}

.image-centered img {
	width: 100%;
}


.prev-back { /* not used! */
	/*border: 1px solid red;*/
	/*background-color: red;*/
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 8%;
	min-width: 80px;
	z-index: 0;
}

.prev-front {
	/*border: 1px solid red;*/
	/*background-color: red;*/
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 8%;
	min-width: 80px;
	z-index: 55;
}


.next-back { /* not used! */
	/*border: 1px solid red;*/
	/*background-color: red;*/
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 8%;
	min-width: 80px;
	z-index: 0;
}

.next-front {
	/*border: 1px solid red;*/
	/*background-color: red;*/
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 8%;
	min-width: 80px;
	z-index: 55;
}

#ribbon {
	display: block;
	/*background-color: red;*/

	text-align: center;
	margin-top: 3em;
	margin-bottom: 2em;
}

#ribbon-pics {
	display: inline-block;

	/* see media conditions below */
	max-width: 200px;

	text-align: left;
}


.thumbFrame {
	display: inline-block;
	vertical-align: middle;
	padding: 0;
	height: 100px;
	width: 100px;
	border: 2px solid black;
}
.thumbFrame img {
	margin: 0;
}

/*
.link img {
	width: 100px;
	height: 100px;
	margin: 0;
	padding: 0;

}
*/
.imgDiv {
	background-color: green;
}

.highlight {
	/*opacity: 0.7;*/
	border: 2px solid white;
}


.oneline {
	display: inline-block;
	padding-top: 2em;
	padding-left: 1em;
	color: #bfb;
}

@media screen and (max-width: 900px) {
	.oneline {
		font-size: 1em;
		padding-top: 1em;
	}

}

@media screen and (min-width: 400px) {
	#ribbon-pics {
		max-width: 300px;
	}
}
@media screen and (min-width: 500px) {
	#ribbon-pics {
		max-width: 400px;
	}
}
@media screen and (min-width: 600px) {
	#ribbon-pics {
		max-width: 300px;
	}
}
@media screen and (min-width: 700px) {
	#ribbon-pics {
		max-width: 400px;
	}
}
@media screen and (min-width: 800px) {
	#ribbon-pics {
		max-width: 500px;
	}
}
@media screen and (min-width: 900px) {
	#ribbon-pics {
		max-width: 600px;
	}
}
@media screen and (min-width: 1000px) {
	#ribbon-pics {
		max-width: 700px;
	}
}
@media screen and (min-width: 1100px) {
	#ribbon-pics {
		max-width: 800px;
	}
}
@media screen and (min-width: 1200px) {
	#ribbon-pics {
		max-width: 900px;
	}
}
@media screen and (min-width: 1300px) {
	#ribbon-pics {
		max-width: 1000px;
	}
}

/* END OF onepage stuff */