/*	===================================
	IMAGE CLASSES
======================================= */
/* Templates for administration
======================================= */
.templateTableImgLeft-60,
.templateTableImgLeft-40,
.templateTableImgTop {clear: both; table-layout: fixed; overflow: hidden; width: 100%; margin: 15px 0;}

.templateTableImgLeft-60 td:first-child {vertical-align: top; width: 60%; padding: 10px 5px 5px 0;}
.templateTableImgLeft-60 td:last-child {vertical-align: top; width: 40%; padding: 10px 0 10px 5px;}
.templateTableImgLeft-40 td:first-child {vertical-align: top; width: 40%; padding: 10px 5px 10px 0;}
.templateTableImgLeft-40 td:last-child {vertical-align: top; width: 60%; padding: 10px 0 10px 5px;}

.templateTableImgLeft-40 img,
.templateTableImgLeft-60 img,
.templateTableImgTop img {
	max-width: 100%;
	height: auto;
} 
.templateTableImgTop img {margin: 10px auto; max-width: 100%} 

/* Replace all image containers with Figure
======================================= */
figure {margin: 0; padding: 0; text-align: center;}
figcaption {
	font-size:0.9em; 
	line-height: 125%;
	text-align: left; 
	padding: 4px 0;
}
figcaption p {padding: 0; margin: 0}
figure img {
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}
video,
audio {width: 100%; height: auto; border:1px black solid}

/* Image styles to be replaced by the above ones
======================================= */
.imageLeft {
	float: left; 
	margin: 4px 12px 2px 0; 
	width: 50%;
	display: table; 
	table-layout: fixed;
}
.imageRight {
	float: right; 
	margin: 4px 0 2px 12px;
	width: 32%;
	display: table; 
	table-layout: fixed; 
}

.imageLeft img,
.imageRight img {
	max-width: 100%;
	height:auto;
}
.imageLeft object, .imageLeft embed,
.imageLeft video, .imageLeft audio,
.imageLeft iFrame,
.imageRight object, .imageRight embed,
.imageRight video, .imageRight audio,
.imageRight iFrame {
	width: 100%; min-height: 192px;
}

.imageCenter {
	position: relative;
	clear:both; 
	display: table; 
	table-layout: fixed;
	width: 100%; 
	border: 0;
	text-align: center; 
	margin: 0;
	padding: 0;
}
.imageCenter img {max-width: 100%;}
.imageCenter object,
.imageCenter embed,
.imageCenter video,
.imageCenter iFrame {
	width: 100%;
	min-height:380px;
	border: 0;
	margin: 0;
	padding: 0;
}

/* For simple photo slider within texts 
=========================================== */
.moreImages {position: relative; clear: both; height: 380px; margin-bottom: 45px; background: #000;}
.moreImages ul {
	position: absolute;
	bottom: -25px;
	left: 0;
	right: 0;
	margin: 0;
	padding:0;
	list-style: none;
	text-align: center;
	background: transparent;
	cursor: pointer;
	line-height: 100%;
	z-index: 1;
}
.moreImages li {
	display: inline-block;
	font-size: 0.85em;
	padding: 0 3px;
	margin: 0 0 0 -5px;
	background: #fff; 
	color: #999;
	border: 1px solid #fff;
}
.moreImages li:hover,
.moreImages li.selected {
	background: #fff; 
	color: #000;
}
.moreImages div {
	position: absolute; 
	bottom: 0;
	cursor: pointer;
	opacity: 0.6;
	padding:0;
	margin:0;
}
.moreImages div:hover {
	opacity: 1;
}
.moreImages div img {display: block;}
.moreImages div#more-next {right: 0; z-index: 100}
.moreImages div#more-prev {left: 0; z-index: 100}

.moreImages figure {position: absolute; top:0; left:0; right:0; bottom: 0;
	padding: 0; margin: 0; text-align: center; vertical-align: middle; overflow: hidden;}
.moreImages figure img {max-width: 100%; max-height: 100%; margin: 0 auto;}

.imageText {font-size: 0.9em; font-style: italic; text-align: center; 
	line-height: 125%; background-color: #fff; padding: 2px 5px;}
.imageMargin-20	{margin: -20px 0 25px 0;}

/* For Images in Tables, Lists and Floats
******************************************* */
.imgCell {
	width: 30%;
	padding-left: 0;
}
.imgBlock img {display:block;}
.alignBottom img {vertical-align: bottom;}


/* For Transparent Link-Images
******************************************* */
a.transparentBG img {display:inline-block; background: #96706A; background-image:linear-gradient(rgba(255,255,255,0.6), #96706A 100%); padding: 0;}

/* For YouTub - classes withn P
******************************************* */
.embed-container 
	{position: relative; padding: 0; margin: 0; max-width: 100%; height: auto; overflow: hidden;} 
.embed-container iframe, .embed-container object, .embed-container embed 
	{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/* END
***********/