﻿/* Revised style sheet for all andrewj.com pages */
/* Revised style sheet for all andrewj.com pages */
/* Includes css reset and support for fluid grids */
/*------------------------------------------------*/

/* css reset - set to a sensible default for all browsers */
/*--------------------------------------------------------*/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	/* margin: 0;
	padding: 0;
	border: 0; */
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

p {
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid;
}

.break, .break p {
	break-before: column;
}
/* Note re colours:
	Older "pink" color : #-DE12FF;

 */

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
	}
	
/* body {
	line-height: 1;
	} */
	
/* ol, ul {
	list-style: none;
	} */
	
blockquote, q {
	quotes: none;
	}
	
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
	}
	
table {
	border-collapse: collapse;
	border-spacing: 0;
	}

/* Basic text styles */
/*-------------------*/
p{
	Font-Family : 'Book Antiqua', 'Times New Roman', Serif;
	font-size : 1.0em;
	font-style : normal;
	font-variant : normal;
	font-weight : normal;
	}


Body{
	Font-Family : 'Book Antiqua', 'Times New Roman', Serif;
	Font-Size : 1.0em;
	Font-Style : normal;
	Font-Variant : normal;
	Font-Weight : normal;
	}


li{
	Font-Family : 'Book Antiqua', 'Times New Roman', Serif;
	Font-Size : 1.0em;
	Font-Style : normal;
	Font-Variant : normal;
	Font-Weight : normal;
	margin-bottom: 0.5em;
	}

ul{
	Font-Family : 'Book Antiqua', 'Times New Roman', Serif;
	Font-Size : 1.0em;
	Font-Style : normal;
	Font-Variant : normal;
	Font-Weight : normal;
	}

td{
	Font-Family : 'Book Antiqua', 'Times New Roman', Serif;
	Font-Size : 1.0em;
	Font-Style : normal;
	Font-Variant : normal;
	Font-Weight : normal;
	}

i, em {
	color : #404040;
	Font-Family : 'Book Antiqua', 'Times New Roman', Serif;
	font-style : italic;
	font-variant : normal;
	font-weight : bold;
	}


a, a:visited {
	color: #808080;
	text-decoration:underline;
	font-style: oblique;
	font-weight: bold;
}


a:hover, a:focus {
	color: #830eff;
}


strong, .strong a, a.strong {
	color : #00F529;
	Font-Family: 'Book Antiqua', 'Times New Roman', Serif;
	font-style: normal;
	font-variant: normal;
	font-weight: bold;
	text-decoration: none;
	}

sub {
	vertical-align: sub;
	font-size: smaller;
}

sup { 
  vertical-align: super;
  font-size: smaller;
}

h1 {
	font-size : 1.4em;
}

#headingkeep { /* Keep headings and key paragraphs together */
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
}

ul {
	break-inside: auto;
	-webkit-column-break-inside: auto;
}

#headingkeep ul {
	margin-bottom: -0.5em;
	padding-bottom: -0.5em;
}

#ticklist ul {
	list-style-image: url("/images/greentick.gif");
}

li, tr, td {
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
}

h1, h1 a, h1 a:link, h1 a:visited,
#zone h1, #zone h1.link, #zone h1.visited {
	border-bottom : 3px solid #00F529;
	/* color : #830EFF; */
	background-color: rgba(131, 14, 255, 0.82);
	color: white;
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	text-decoration : none;
	}

#zonetop h1, #zonetop h1.link, #zonetop h1.visited {
	border-bottom : 3px solid #00F529;
	/* color : #830EFF; */
	color: white;
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 1em;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	text-decoration : none;
	}

h2 {
	font-size : 1.2em;
}

h2, h2 a, h2 a:link, h2 a:visited {
	border-bottom : 1px solid #00F529;
	color : #830EFF;
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	}

h3, h3 a, h3 a:link, h3 a:visited, #SeeMore {
	/* color: #00F529; Green */
	color: #830EFF;
	Font-Family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 1.1em;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	}

h1 a:hover, h2 a:hover, h3 a:hover {
	color: #AAAAAA;
}

#contentblock h3 {
	margin-top: 0em;
}

dfn{
	color : #00F529;
	Font-Family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 0.9em;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	text-align: center;
	}


TABLE{
	Font-Family : 'Arial', Sans-Serif;
	}


CODE{
	COLOR : green;
	Font-Family : "Courier New";
	}


FORM{
	FONT : medium Arial, Sans-Serif;
	}

BLOCKQUOTE, q {
	Font-Family : 'Book Antiqua';
	font-size : 1.0em;
	font-style : italic;
	font-variant : normal;
	border-bottom : 1px solid #830EFF;
	border-top : 1px solid #830EFF;
	border-left : 1px solid #830EFF;
	border-right : 1px solid #830EFF;
}


HR{
	color : #830EFF;
}

.u, u.wingding {
	font-family: 'Heydings';
	font-style : normal;
	font-variant : normal;
	text-decoration: none;
}

.aside {
	background-color: #DDDDDD;
}

/*----------------------------------------------*/
/* Flexible grid division styles                */
/*----------------------------------------------*/

#page {
	/* margin: 36px auto;
	width: 95%; */
	}
	
#sidenav {
	width: 16%;
	float:left;
	font-size: 0.8em;
	margin: 0;
	padding: 1%;
	border: solid #830EFF;
	border-width: 1%;
	overflow:hidden;
}

#contentblock {
	margin: 1%;
	/* width: 100%; */
	float: left;
}

#logo {
	width: 16%;
	float: left;
	padding-left: 1%;
	padding-right: 1%;
}

#logo img {
	max-width: 80%;
	min-width: 60%;
	height: auto;
	width: 80%;
	margin: 0;
}

#topbar {
	width: 100%;
	float: left;
	position: relative;
	background-color: #DDDDDD;
	border-bottom: solid #830EFF;
	border-width: 0.2em;
	max-height: 5em;
	overflow: hidden;
}

#topbar img {
	max-height: 2.4em;
	width: auto\9; /* IE */
	margin: 0 auto;
	padding: 0;
	border: 0;
}

#masthead {
	width: 82%;
	/* min-height: 14em; */
	float: left;
	padding: 0;
	margin:0;
	/* border-left: solid #830EFF;
	border-right: solid #830EFF; 
	border-width:1%; */
	background-color: #830EFF;
}

#masthead img {
	max-width: 99.7%;
	/* min-width: 100%;	*/
	max-height: 12em;
	width: auto\9; /* IE */
	margin: 0 auto;
	padding: 0;
	border: 0;
}

#mastimage {
	max-width: 99.7%;
	min-width: 99.7%;	
	margin: 0;
	padding: 0;
	border-left: solid #830EFF; 
	border-width: 1%;
	background-color: #f8f8f8;
	text-align:center;
}

#masthead h1 {
	background-color: #830EFF;
	color : #FFFFFF;
	Font-Family : 'Lydian BT', Arial, Sans-Serif;
	Font-Size : 2.0em;
	padding:1%;
	margin: 0;
}

#CurrentZone {
	color : #830EFF;
	padding: 0.5em 0.5em;
	margin-bottom: 0.5em;
	margin-right: 2em;
	float: both;
	text-decoration:none;
	display: inline-block;
	position: relative;
	vertical-align: top;
	white-space: nowrap;
}

#CurrentZone span {
	background-color: #830EFF;
	color : #FFFFFF;
	Font-Family : 'Lydian BT', Arial, Sans-Serif;
	Font-Size : 1em;
	Font-weight: bold;
	padding: 0.5em 0.5em;
}

#CurrentZoneBr {
	font-size : 0.5em;
	horiz-align: left;
	height : 1em;
	margin-top: -2.5em;
}

#CurrentZoneDesc {
	color : green ; /* #00F529; */
	Font-Family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 1em;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	text-align: center;
	display: inline-block;
	position: relative;
	vertical-align: top;
	horiz-align: left;
	padding-left: 0.5em;
	margin-top: 0.2em;
}

#OtherZone {
	padding: 0.5em 0.5em;
	margin-bottom: 0.5em;
	margin-right: 0;
	float: both;
	text-decoration:none;
	display: inline-block;
	position: relative;
	vertical-align: top;
	white-space: nowrap;
}

#ServiceLink {
	padding: 0.5em 0.5em;
	margin-right: 0;
	float: both;
	text-decoration:none;
	display: inline-block;
	position: relative;
	white-space: nowrap;
}

#topbar a, #topbar a.visited {
	color : #830EFF;
	Font-Family : 'Lydian BT', Arial, Sans-Serif;
	Font-Size : 1em;
	Font-style : normal;
	border-bottom: none;
	padding:1%;
	margin: 0;
	text-decoration:none;
}

#topbar a:hover, #topnav a:hover {
	Font-style : italic;
	text-decoration: underline;
}

#topnav {
	float:right;
	position: fixed;
	top: 0.5em;
	right: 2.5%;
	padding: 0;
	margin:0;
	z-index: 99999;
	overflow: visible;
}

#rightimage {
	padding: 0;
	margin: 0;
	display: flex;
	float: right;
	position: relative;
	vertical-align: top;
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
	align-items: flex-start; /* For Safari */
	}

#rightimage img {
	height: auto;
	min-height: 20%;
}

#floatimage, #floatimage img {
	padding: 0;
	margin: 0;
	display: flex;
	float: top;
	position: relative;
	vertical-align: top;
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
	max-width: 95%;
}

#darker {
	background-image: url("/images/notepaper.gif");
	background-color: #e0e0e0;
}

/*-----------------------------------*/
/* Footer block and contents   		 */
/*-----------------------------------*/

footer { 				/* Default footer tag */
	font-size: 0.7em;
	clear:both;
}

#footer {				/* Footer div */
	width: 100%;
	float: left;
	position: relative;
	background-color: #CCCCCC;
	border-top: solid #830EFF;
	border-width:2%;
}

#FooterBlock {
	padding: 0.5em 0.5em;
	margin-bottom: 0.5em;
	margin-right: 0;
	float: both;
	text-decoration:none;
	display: inline-block;
	position: relative;
	vertical-align: top;
	white-space: nowrap;
}

#FooterBlock p, #FooterBlock li {
	padding:1%;
	margin: 0;
	line-height: 100%;
}

#footer a, #FooterBlock a {
	color : #616161;
	Font-Family : 'Lydian BT', Arial, Sans-Serif;
	Font-Size : 1em;
	Font-style : normal;
	border-bottom: none;
	padding:1%;
	margin: 0;
	text-decoration:none;
	line-height: 100%;
}

#footer a:hover {
	color : #830EFF;
	Font-style : italic;
	text-decoration: underline;
}

.widget-container, .widget-container label, .widget-container select {
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 1em;
	font-style : normal;
	font-variant : normal;
	font-weight : normal;
}

/* In blog, side headings are h3 not h2 */
#sidenav h2,  h3.widget-title, .widget-container h3 {
	background-color: #CCCCCC;
	font-size : 1em;
	color : #830EFF;
	padding: 0;
	line-height: 60%;
}

/*-----------------------------------*/
/* Styles for drop-down navigation   */
/*-----------------------------------*/

/* Main Styles */	
	
#nav {
	position:relative;
	float:left;
	width: 100%;
	margin: 0;
	padding: 0;
}

ul#navigation {
	margin:0;
	padding: 0;
	position:relative;
	float:right;
	/* border-left:1px solid #c4dbe7;
	border-right:1px solid #c4dbe7; */
}

ul#navigation li {
	/* display:inline; */
	font-family:Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	font-weight:bold;
	margin:0;
	padding:0;
	float:left;
	position:relative;
	border: 1px solid #830EFF;
	list-style: none;
}

ul#navigation img {
	max-height: 2em;
}

ul#navigation li a {
	padding: 0.3em 0.3em;
	color:#616161;
	text-shadow:1px 1px 0px #fff;
	text-decoration:none;
	font-style:normal;
	display:inline-block;
/*	border-right:1px solid #fff;
	border-left:1px solid #C2C2C2;
	border-top:1px solid #fff; */
	border-bottom:1px solid #830EFF;
	background: #f5f5f5;
	
	-webkit-transition:color 0.2s linear, background 0.2s linear;	
	-moz-transition:color 0.2s linear, background 0.2s linear;	
	-o-transition:color 0.2s linear, background 0.2s linear;	
	transition:color 0.2s linear, background 0.2s linear;	
}

ul#navigation li a:hover {
	background:#f8f8f8;
	color:#282828;
}

/* Changes colour of selected item to pure white from off-white */
ul#navigation li:hover > a {  
	background:#fff;
}

/* Actually displays the drop-down */
ul#navigation li:hover > ul   
{
	visibility:visible;
	opacity:1;
}

/* Formats the drop-down in inital mode */
ul#navigation ul, ul#navigation ul li ul { 
	list-style: none;
    margin: 0;
    padding: 0;    
	visibility:hidden;
	float: left;
	right: 0px;
    position: absolute;
    z-index: 99999;
	background:#f8f8f8;
	box-shadow:1px 1px 3px #ccc;
	opacity:0;
	-webkit-transition:opacity 0.2s linear, visibility 0.2s linear; 
	-moz-transition:opacity 0.2s linear, visibility 0.2s linear; 
	-o-transition:opacity 0.2s linear, visibility 0.2s linear; 
	transition:opacity 0.2s linear, visibility 0.2s linear; 	
}

ul#navigation ul li a {
	background:none;
	color:#616161;
	text-shadow:1px 1px 0px #fff;
	text-decoration:none;
	border:0 none;
	width: 13em;
    z-index: 99999;
	/* float:right;
    position: relative;
	clear:both; 
	display:inline-block;
	padding:7px 15px; */
}

ul#navigation li a.first {
	border-left: 0 none;
}

ul#navigation li a.last {
	border-right: 0 none;
}

/*-----------------------------------*/
/* Blog-specific styles   			 */
/*-----------------------------------*/

.entry-meta, .entry-meta img {
	color: #888;
	font-size: small;
	vertical-align: bottom;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.entry-utility {
	color: #888;
	font-size: small;
	clear: both;
	padding-bottom: 2em;
}

.entry-meta a,
.entry-utility a {
	color: #888;
}

.entry-meta a:hover,
.entry-utility a:hover {
	color: #830EFF;
}

.entry-content section {
	padding-top: 2em;
}

.widget-title {
	font-size: 0.8em;
}

.page-link a:link,
.page-link a:visited {
	background: #f1f1f1;
	color:#444;
	font-weight:normal;
	padding:0.5em 0.75em;
	text-decoration:underline;
}

/* "More content" links */
.meta-nav, .nav-next,
.nav-previous, .nav-views  {
	background-color: #CCCCCC;
	color : #616161;
	display: inline-block;
	white-space: nowrap;
	margin: 0;
	padding: 0.5%;
	border: 1px solid #830EFF;
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 1.0em;
	font-style : normal;
	font-variant : normal;
	font-weight : normal;
	text-decoration:none;
	}
	
.meta-nav, .nav-next {
	float: right;
}
	
.nav-previous {
	clear: right;
	float: both;
	}

.nav-views {
	}

.nav-views img,
.nav-previous img,
.nav-next img {
	vertical-align:bottom;
}

.meta-nav a:link, 
.meta-nav a:visited, 
.nav-previous a:link,
.nav-previous a:visited,
.nav-views a:link,
.nav-views a:visited,
.nav-next a:link,
.nav-next a:visited {
	color : #616161;
	text-decoration: none;
	}

#content img,
#blogphoto img,
#rightimage img {
	margin-left: 2%;
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

#content img.wlEmoticon,	/* Fix problems with LiveWriter emoticons */
#content img.wp-smiley { 	/* Fix problems with WordPress emoticons */
	margin: 0% auto;
}

#blogphoto {
	vertical-align: top;
}

#blogphoto img {
	border: 0.5em #CCCCCC inset;
}

.widget-container {
  	list-style-position:outside;
	list-style: none;
	}

/* Comments form */
input[type=submit] {
	color: #333;
}
#respond {
	margin-top: 1.0em;
	border-top: 1px solid #e7e7e7;
	overflow: hidden;
	position: relative;
}
#respond p {
	margin: 0;
}
#respond .comment-notes {
	margin-bottom: 1em;
}
.form-allowed-tags {
	line-height: 1em;
}
.children #respond {
	margin: 0 2em 0 0;
}
h3#reply-title {
	margin: 1.5em 0;
}
#comments-list #respond {
	margin: 0 0 1.5em 0;
}
#comments-list ul #respond {
	margin: 0;
}
#cancel-comment-reply-link {
	font-size: 0.8em;
	line-height: 1.5em;
	font-weight: normal;
}
#respond .required {
	color:#FF4B33;
	font-weight:bold;
}
#respond label {
	color: #888;
	font-size: 0.8em;
}
#respond input {
	margin:0 0 9px;
	width:98%;
}
#respond textarea {
	width:98%;
}
#respond .form-allowed-tags {
	color: #888;
	font-size: 0.8em;
	line-height: 1.5em;
}
#respond .form-allowed-tags code {
	font-size: 0.8em;
}
#respond .form-submit {
	margin: 0 0 2em;
}
#respond .form-submit input {
	width: auto;
	font-size: 1.0em;
}
#respond dl {
	margin: 0 0 1em;
}
#respond dt {
	 display: inline;
	font-weight: normal;
}
#respond dd {
	display: inline;
}

#sidenav select {
	max-width: 100%;
}

.widget-area ul li {
  	list-style-position:outside;
	list-style: none;
}

/* Styles required for "currents-style" view */
#abstract {
	padding: 0.3em 0.3em;
	margin-top: 0.3em;
	margin-bottom: 0.3em;
	text-decoration:none;
	display: inline-block;
	position: relative;
	background: #f5f5f5;
	width: 31.8%;
	height: auto;
	max-height: 37em;
	min-height: 20em;
	overflow: hidden;
	vertical-align: top;
	}

#abstract h2, #abstract h2.link {
	border-bottom : none;
	color : #830EFF;
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 1.2em;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	}
	
#abstract a:hover,
#abstract a:visited {
	color : #616161;
	}

#abstract img {
	margin: 0 auto;
	max-height: 20em;
	max-width: 95%;
	height: auto;
	width: auto\9; /* ie8 */
}

#abstract .entry-utility {
	padding-bottom: 0em;
}

#addthis, #addthis img {
	vertical-align: bottom;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 2px;
}

#bookreviewsummary {
	margin: 1%;
	display: block;
	width: 100%;
}

#bookreview, #bookreview tr, .bookreview {
	vertical-align: top;
	float: initial;
	border: 0;
	border-collapse: collapse;
	padding: 5px;
}

#bookreview td {
	vertical-align: top;
	text-align: center;
	border: 0;
	border-collapse: collapse;
	padding: 5px;
	width: 33%;
}

#chernoff {
	float:right;
	width: 100%;
	vertical-align: top;
	border: 0;
	border-collapse: collapse;
	padding: 5px;
}

#reviewimage {
	float:left;
	width: 100%;
	vertical-align: top;
	border: 0;
	border-collapse: collapse;
	padding: 5px;
}

/*-----------------------------------*/
/* Case study styles     			 */
/*-----------------------------------*/

#CaseStudyInd {
	color : green ; /* #00F529; */
	Font-Family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 1em;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	text-align: center;
	display: inline-block;
	position: relative;
	vertical-align: top;
	horiz-align: left;
	padding-top: 0;
	margin-top: -0.8em;
}

#CSSummaryAbstract {
	color : #830EFF;
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-size : 1em;
	font-style : normal;
	font-variant : normal;
	font-weight : bold;
	display: inline-block;
}

#CSFeaturedImage, #CSFeaturedImage img {
	align-content: center;
	max-width: 98%;
	horiz-align: center;
	display: inline-block;
	margin: auto;
}

#CSIconImage {
	display: flex;
	float: right;
	position: relative;
	vertical-align: top;
	align-items: flex-start; /* For Safari */
	min-width: 20%;
	max-width: 20%;
	margin-right: 0;
}

#CSIconImage img {
	height: auto;
	horiz-align: right;
}

/*-----------------------------------*/
/* Styles for home pages   			 */
/*-----------------------------------*/

#zone {
	padding: 0.5em 0.5em;
	margin-bottom: 0.5em;
	margin-right: 0;
	border-left: 0.1em solid #830EFF;
	border-top: 0.1em solid #830EFF;
	border-right: 0.2em solid #830EFF;
	border-bottom: 0.2em solid #830EFF;
	float: both;
	text-decoration:none;
	display: inline-block;
	position: relative;
	background: #f5f5f5;
	max-width: 47%;
	vertical-align: top;
}

#zone img {
	margin: 0 auto;
	max-width: 95%;
	height: 15em;
	width: auto\9; /* ie8 */
}

#zone img.noresize {
	margin: 0 auto;
	height: auto;
	width: auto; /* ie8 */
}

#zonetop {
	margin-right: 0;
	border-left: 0.1em solid #830EFF;
	border-top: 0.1em solid #830EFF;
	border-right: 0.2em solid #830EFF;
	border-bottom: 0.2em solid #830EFF;
	float: both;
	text-decoration:none;
	display: inline-block;
	position: relative;
	background: #f5f5f5;
	max-width: 47%;
	min-width: 32%;
	vertical-align: top;
	visibility: hidden;
}

#randomimage {
	padding: 0.3em 0.3em;
	clear:right;
	text-decoration:none;
	display: inline-block;
	position: relative;
	background: #f5f5f5;
	max-width: 46%;
	height: 15em;
	vertical-align: top;
	align-items: flex-start; /* For Safari */
}

#randomimage img {
	margin: 0 auto;
	max-height: 95%;
	min-height: 95%;
	max-width: 95%;
	height: auto;
	width: auto\9; /* ie8 */
}

img.footimg {
	max-width: 98%;
	border: 0;
	height: auto\9;
}

#travel {
	margin: 0.3em 0em 0.3em 0em;
	text-decoration:none;
	display: inline-block;
	vertical-align: top;
	float: right;
}

#traveltext {
	float:left;
	max-width: 49%;
	margin-top: 0em;
	vertical-align: top;
}

#travelimg {
	float: right;
	max-width: 49%;
	vertical-align: top;
	align-items: flex-start; /* For Safari */
}

#travelimg img {
	margin: 0 auto;
	max-height: 25em;
	max-width: 95%;
	height: auto;
	width: auto\9; /* ie8 */
	vertical-align:top;
}

#mugshot {
	padding: 0;
	padding-right: 1em;
	margin: 0;
	display: inline-flex;
	float: left;
	right: 0;
	position: relative;
	vertical-align: bottom;
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
	max-width: 50%;
	align-items: flex-start; /* For Safari */
}

#mugshot img {
	height:auto;
}

#aftermugshot {
	margin-top: -0.0em;
}

#tenset {
	padding: 0.5em 0.5em;
	margin-top: 0.3em;
	margin-bottom: 0.3em;
	text-decoration:none;
	display: inline-block;
	position: relative;
	background: #f5f5f5;
	max-width: 24%;
	height: auto;
	overflow: hidden;
	vertical-align: top;
}

#tenset img {
	margin: 0 auto;
	height: 15em;
	max-width: 98%;
	width: auto\9; /* ie8 */
	vertical-align:top;
}

#tenset-caption {
	display: table;
	width: 50%;
}

/*----------------------------------------------*/
/* Tree Menu Styles 							*/
/*----------------------------------------------*/

.tmenu0text {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 9pt;
  font-weight: bold;
}
.tmenu1text {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 9pt;
}
.tmenu2text {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 8pt;
  font-style: italic;
}
.tmenu3text {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 7.5pt;
}

/* Since all menu items are links, the following is equally important 
 * to your menu appearance.  
 * The main thing you may want to change are the A:link and A:visited colors.
 */
*.tmenu0text A:link,*.tmenu1text A:link,*.tmenu2text A:link,*.tmenu3text A:link 
  { text-decoration:none; color:#505080 }
*.tmenu0text A:visited,*.tmenu1text A:visited,*.tmenu2text A:visited,*.tmenu3text A:visited 
  { text-decoration:none; color:#505080 }
*.tmenu0text A:active,*.tmenu1text A:active,*.tmenu2text A:active,*.tmenu3text A:active 
  { text-decoration:none; color:#830EFF }
*.tmenu0text A:hover,*.tmenu1text A:hover,*.tmenu2text A:hover,*.tmenu3text A:hover 
  { text-decoration:underline; color:#808080 }

/* .tmlistbox controls the appearance of Listbox menus */
.tmlistbox {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;  /* match 'smalltext' value */
  font-size-adjust: 0.58; /* Verdana */
  margin-bottom: 0px;
}

/* .tmenuSelected is used with linkSelectKey to highlight selected items */
.tmenuSelected { 
  background-color: yellow;
}
*.tmenuSelected A:link    { text-decoration:none; color:#2020ff }
*.tmenuSelected A:visited { text-decoration:none; color:#2020ff }
*.tmenuSelected A:active  { text-decoration:none; color:#ff2020 }
*.tmenuSelected A:hover   { text-decoration:underline; color:#FF0000 }


/*----------------------------------------------*/
/* styles needed to include album in blog pages */
/*----------------------------------------------*/

#photodata {
	background: #f5f5f5;
	max-width: 70%;
	margin-bottom: -1.5em;
}

#photodatawide {
	max-width: 100%;
	-webkit-column-break-inside: avoid; 
	page-break-inside: avoid; 
	break-inside: avoid;
}

.infotable {
	border: 1px dotted #AAAAAA;
	border-collapse: collapse;
	font-family : 'Abadi MT Condensed', Arial, Helvetica, sans-serif;
	font-size : 0.9em;
}

.infotable td {
	border: 1px dotted #AAAAAA;
}

.infotable table {
	border-collapse: separate;
}

.infotable table td {
	border: 0px;
}

.smalltxt, .smalltxt tr, .smalltxt tr td {
	font-family : 'Abadi MT Condensed', Arial, Helvetica, sans-serif;
	font-size : 0.9em;
	align-content: center;
	horiz-align: center;
}

.smalltxt b {
	font-family : 'Abadi MT Condensed Extra Bold', Arial, Helvetica, sans-serif;
	font-size : 0.9em;
}

.slideImage { 
	border-width: 8px; 
	border: 8px solid; 
	border-color: #ffffff;
	}

/*-------------------------------*/
/* ChameleonAJ Styles for albums */
/*-------------------------------*/

.title td,
.title, td.title,
.title a:link,
.title h2 a:link,
.title a:visited {
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-style : normal;
	font-variant : normal;
	font-weight: bold;
	text-decoration: none;
}

.title a:hover {
	text-decoration: none;
	color : #808080;
}

#albumthumb {
	padding: 0.5%;
	margin: 0.5%;
	text-decoration:none;
	display: inline-block;
	position: relative;
	background: #f5f5f5;
	width: 15.5%;
	height: 14em;
	overflow: hidden;
	vertical-align: top;
	border: 0.2em #830EFF outset;
	}

#albumimg {
	height: 7em;
	}

#albumlink {
	background-image: url('images/folder.png');
	background-repeat: no-repeat;
	background-position: right bottom;
	height: 7em;
	vertical-align: bottom;
	}

#albumthumb a,
#albumlink a {
	text-decoration:none;
	font-size: 0.9em;
	}

#albumthumb a:hover,
#albumthumb a:visited {
	color : #616161;
	}

#albumthumb img {
	max-height: 14em;
	max-width: 90%;
	height: auto;
	width: auto\9; /* ie8 */
	border: 0.5em #CCCCCC inset;
}

#albumthumb .imagedir {
	max-height: 7em;
	max-width: 90%;
	height: auto;
	width: auto\9; /* ie8 */
	border: 0.5em #CCCCCC inset;
}

#albumphoto img {
	margin: 2% auto;
	max-width: 75%;
	height: auto;
	width: auto\9; /* ie8 */
	vertical-align: top;
	border: 0.5em #CCCCCC inset;
}

#thumblist {
	width: 9%;
	float: left;
}

#thumblistright {
	width: 9%;
	float: right;
}

#thumblist img,
#thumblistright img {
	max-height: 9em;
	max-width: 95%;
	height: auto;
	width: auto\9; /* ie8 */
	border: 0.3em #CCCCCC outset;
}

#thumblistright img {
	vertical-align: bottom;
}


/*-------------------------------*/
/* Styles for news page          */
/*-------------------------------*/

#newsitem a:link,
#newsitem h3 a:link,
#newsitem a:visited {
	font-family : 'Lydian BT', Arial, Sans-Serif;
	font-style : normal;
	font-variant : normal;
	font-size: 0.8em;
	font-weight: bold;
	text-decoration: none;
}

#newsitem p{
	Font-Family : 'Book Antiqua', 'Times New Roman', Serif;
	font-size : 0.7em;
	font-style : normal;
	font-variant : normal;
	font-weight : normal;
	}


#newsitem img {
	max-height: 7em;
	max-width: 90%;
	height: auto;
	width: auto\9; /* ie8 */
	/* border: 0.5em #CCCCCC inset; */
}


/*-----------------------------------*/
/* Size-related variations           */
/*-----------------------------------*/

@media screen and (min-width: 1200px) {
	/* Wide screen options */
	/* Render block text as three columns */
	#contentblock section {
		-moz-column-count: 3;
		-moz-column-gap: 2%;
		-moz-column-rule: none;
		-webkit-column-count: 3;
		-webkit-column-gap: 2%;
		-webkit-column-rule: none;
		column-count: 3;
		column-gap: 2%;
		column-rule: none;
	}

	section > p:first-child {
		margin-top: -0.1em;
	}

	/* Three columns on home page */
	#zone, #zonetop {
		max-width: 30.8%;
	}

	#abstract {
		width: 23.8%;
	}
}

@media screen and (max-width: 1200px) {
	/* Moderate screen options */
	/* Render block text as three columns */
	#contentblock section {
		-moz-column-count: 2;
		-moz-column-gap: 2%;
		-moz-column-rule: none;
		-webkit-column-count: 2;
		-webkit-column-gap: 2%;
		-webkit-column-rule: none;
		column-count: 2;
		column-gap: 2%;
		column-rule: none;
	}

	section > p:first-child {
		margin-top: -0.1em;
	}

	/* Three columns on home page */
	#zone, #zonetop {
		max-width: 30.8%;
	}
}

@media screen and (max-width: 850px) {
/* Tablet Specifics - will work for Galaxy Note & iPad 1-2 */
/* Adjust relative size of left bar and topbar / content */

	#contentblock {
		font-size: 1.1em;
	}

	#contentblock section {
		-moz-column-count: 1;
		-moz-column-gap: 0%;
		-moz-column-rule: none;
		-webkit-column-count: 1;
		-webkit-column-gap: 0%;
		-webkit-column-rule: none;
		column-count: 0;
		column-gap: 1%;
		column-rule: none;
	}

	#logo {
		width: 23%;
	}

	#masthead {
		width: 75%;
	}

	#topnav {
		float: right;
	}

	#sidenav {
		width: 23%;
	}

	#abstract {
		width: 47.5%;
		height: auto;
		max-height: 36em;
		min-height: 20em;
		}

	#abstract h2, #abstract h2.link, #zone h1, #zone h1.link {
		font-size : 1.1em;
		}

	#photodata {
		max-width: 100%;
		font-size: 0.8em;
	}

	.nav-views img,
	.nav-previous img,
	.nav-next img {
		vertical-align:top;
	}

	.meta-nav, .nav-next,
	.nav-previous, .nav-views  {
		white-space: normal;
		}

	#zone {
		min-width: 98%;
		max-width: 99%;
	}

	#zonetop {
		min-width: 98%;
		max-width: 99%;
		padding: 0.5em 0.5em;
		margin-bottom: 0.5em;
		margin-right: 0;
		visibility: visible;
	}

	#traveltext {
		float: none;
		max-width: 100%;
		margin-top: 0em;
		vertical-align: top;
	}
	
	#travelimg {
		float: none;
		max-width: 100%;
		vertical-align: top;
	}
	
	#albumthumb {
		width: 28.8%;
		height: 12em;
		border: 0.2em #830EFF outset;
		}

	#albumthumb img {
		max-height: 12em;
		border: 0.3em #CCCCCC inset;
	}
	
	#albumthumb .imagedir {
		max-height: 5em;
		border: 0.3em #CCCCCC inset;
	}
	
	#albumthumb p {
		font-size: 0.9em;
	}

	#albumimg {
		height: 6em;
		}

	#albumlink {
		height: 6em;
		}

	#albumphoto img {
		max-width: 100%;
		border: 0.3em #CCCCCC inset;
	}
	
	#thumblist {
		width: 100%;
		float: none;
		align: left;
	}
	
	#thumblistright {
		width: 100%;
		float: none;
		align: right;
	}
	
	#thumblist img,
	#thumblistright img {
		max-height: 3.5em;
		border: 0.2em #CCCCCC outset;
	}

	#FooterBlock {
		max-width: 98%;
	}
}

@media screen and (max-width: 600px) {
/* Phone specifics */
/* Send sidebar to bottom as two columns, adjust text sizes  */

	#page {
		display: table;
	}
	
	#topbar {
		width: 94%;
	}
	
	#contentblock {
		float: left;
		clear: both;
		display: table-row-group;
		width: 94%;
	}

	#sidenav {
		float: right;
		width: 100%;
		display: table-footer-group;
	}

	#sidenavpart1 {
		float:left;
		margin: 1%;
		width: 48%;
	}

	#sidenavpart2 {
		float:right;
		margin: 1%;
		width: 48%;
	}

	/* Use Sidebar class to align sidebar styles between blog and main pages */
	.sidebar, h2.sidebar, #sidenav h2 {
		margin-left: 0%;
		margin-right: 0%;
		padding-left: 0%;
		padding-right: 0%;
		}

	/* Adjust drop-down menu positioning & formatting */
	#masthead {
		width: 75%;
	}

	#masthead h1 {
		font-size : 1.5em;
	}

	#topnav {
		float: right;
	}

	ul#navigation {
		font-size: 0.8em;
	}

	ul#navigation li a {
		font-size: 1.0em;
		padding: 4px;
	}

	ul#navigation .indexmenu { /* Progressively hide less important items */
		display: none;
	}

	ul#navigation .addmenu {
		display: none;
	}
	
	#abstract {
		width: 98%;
		height: auto;
		max-height: 36em;
		min-height: 5em;
		font-size: 0.9em;
		}

	#zone {
		margin-left: 0;
		max-width: 96%;
		min-width: 96%;
		font-size: 0.9em;
	}

	#zonetop {
		padding: 0.5em 0.5em;
		margin-bottom: 0.5em;
		margin-right: 0;
		margin-left: 0;
		max-width: 96%;
		min-width: 96%;
		font-size: 0.9em;
		visibility: visible;
	}

	#abstract h2, #abstract h2.link, 
	#zone h1, #zone h1.link,
	#zonetop h1, #zonetop h1.link  {
		font-size : 1.0em;
		}

	#randomimg, #zone img {
		height: 10em;
	}

	#albumthumb {
		width: 45%;
		height: 12em;
		border: 0.2em #830EFF outset;
		}

	#albumthumb img {
		max-height: 11em;
		border: 0.3em #CCCCCC inset;
	}
	
	#albumthumb .imagedir {
		max-height: 5em;
		border: 0.3em #CCCCCC inset;
	}
	
	#albumthumb p {
		font-size: 0.9em;
	}

	#albumimg {
		height: 5em;
		}

	#albumlink {
		height: 5em;
		}

	#FooterBlock {
		max-width: 98%;
	}
}

@media screen and (max-width: 300px) {
/* iPhone and other small device specifics */
/* Send sidebar to bottom as single column */

	#sidenavpart1 {
		float:left;
		margin: 1%;
		width: 95%;
	}

	#sidenavpart2 {
		float:right;
		margin: 1%;
		width: 95%;
	}

	#FooterBlock {
		max-width: 98%;
	}

}

/*-----------------------------------*/
/* Font embedding                    */
/*-----------------------------------*/
 @font-face {
    font-family: 'Book Antiqua';
    font-style:  normal;
    font-weight: normal;
    src: url(/fonts/BOOKANT2.eot);
    src: local('Book Antiqua'), url('/fonts/BKANT.TTF') format('opentype');
  } 
  @font-face {
    font-family: 'Book Antiqua';
    font-style:  oblique;
    font-weight: bold;
    src: url(/fonts/BOOKANT1.eot);
  }
  @font-face {
    font-family: 'Book Antiqua';
    font-style:  normal;
    font-weight: bold;
    src: url(/fonts/BOOKANT0.eot);
  } 
  @font-face {
	font-family: 'Lydian BT';
    src: url('/fonts/LYDIANB0.eot');
    src: local('Lydian BT'), url('/fonts/LYDIANB0.TTF') format('opentype');
	}
  @font-face {
	font-family: 'Abadi MT Condensed';
    font-style:  normal;
    font-weight: normal;
    src: local('Abadi MT Condensed'), url('/fonts/ABAC.TTF') format('opentype');
	}
  @font-face {
	font-family: 'Abadi MT Condensed Extra Bold';
    font-style:  normal;
    font-weight: bold;
    src: local('Abadi MT Condensed Extra Bold'), url('/fonts/ABAEXBC.TTF') format('opentype');
	}
  @font-face {
	font-family: 'Heydings';
    src: local('Heydings'), url('/fonts/HEYDINGS_ICONS.TTF') format('opentype');
	}
