body {
	font-family: arial, sans-serif;
	font-size: 10pt;
	color: #444;
	margin-top: 10px;
	margin-bottom: 400px;
}

h1,h2,h3,h4 { color: #444; font-weight: bold; }
h1.head { color: black; text-shadow: #444 0em 0em 1em; }
p { margin-top: 0px; }

code { display: block; padding: 3px; background: #eee; }

table { width: 100%; }
table tr td { vertical-align:top; }
table tr th { vertical-align:top; }

table.data tr th { border-bottom: 1px solid #aaa; text-align:left; padding: 5px; }
table.data tr td { border-bottom: 1px solid #ccc; text-align:left; padding: 5px; }
table.data.dense tr th { font-size: 95%; font-family: monospace; }
table.data.dense tr td { font-size: 95%; font-family: monospace; }
table.data.vertical tr th { width: 30%; }

table.tablesorter tr th { cursor: pointer; }
table tr th.headerSortDown::after { content: " \f063"; font-family: FontAwesome; font-size: 9px; }
table tr th.headerSortUp::after { content: " \f062"; font-family: FontAwesome; font-size: 9px; }

table.nav { width: auto; float:right; }
table.nav tr td { padding: 10px; }

/* form record preview */
table.form_submission { margin-bottom: 20px;  }
table.form_submission td.key { width: 200px;  }
table.form_submission td.value { }
table.form_submission tr th { border-bottom: 1px solid #aaa; text-align:left; padding: 5px 5px; background: #eee; font-size: 1.2em; }
table.form_submission tr td { border-bottom: 1px solid #eee; text-align:left; padding: 5px 5px; background: #fff; font-size: 0.9em; }


body.admin table.data tr th { font-family: Monospace; }
body.admin table.data tr td { font-family: Monospace; }

#onlineStatus { background: #222; padding: 5px; text-align: center; }
#onlineStatus.online { display: none; }
#onlineStatus.offline { display: block; background: #222; }

div.notice { border-radius: 10px; margin: 10px 0 10px 0; padding: 10px; text-align: center; }
div.notice.success { background: #aea; color: #222; border: 1px solid #0c0; }
div.notice.failed { background: #eaa; color: white; border: 1px solid #c00; }

p,address,blockquote {  }
pre.break, pre.debug { font-family: monospace; font-size: 9px; word-wrap: break-word; }

a { color: #f4364c; text-decoration: none; }
a:visited { color: #444; text-decoration: none; }
a:hover { color: #f00; text-decoration: none; }

#article a { color: #f4364c; text-decoration: underline; }
#article a:visited { color: #f4364c; text-decoration: underline; }
#article a:hover { color: #1B426C; text-decoration: underline; }

#article a.btn { color: #1B426C; text-decoration: none; font-weight: normal; }
#article a.btn:visited { color: #1B426C; text-decoration: none; }
#article a.btn:hover { color: #f4364c; text-decoration: none; }

#article a.btn.selected { background: #fff; color: #222; }
#article a.btn.selected:visited {  }
#article a.btn.selected:hover {  }



#wrapper { padding: 20px; margin: 0px auto; max-width: 1100px;}
#debug { border: 1px solid #222; padding: 10px; overflow: hidden; }
#debug pre { font-size: 12px; margin: 0px; padding: 0px;}

#canvas { max-width: 724px; margin: 0px auto; }
#header { min-height:163px; }
div.logo img { 
width: auto;
    float:right;
}

#canvas_inner {
	padding: 0px;
	background: white;
	line-height: 1.5;
}

#article { box-shadow: 0px 15px 35px #ccc; padding: 30px; }
#footer { font-size: 10pt; padding: 10px 20px; }

#venue_col1 { width: 500px; float: left; }
#venue_col2 { width: 250px; float: right; font-size: 10pt; }
#map_canvas { width: 100%; height: 400px; }



table.agenda { margin-bottom: 25px; width: 100%; }
table.agenda th { padding: 5px; }
table.agenda td { padding: 5px; vertical-align: top;}
table.agenda th { background: #92D050; font-size: 14pt; }
table.agenda td.date { font-weight: bold; width: 200px; }
table.agenda td.time { font-weight: normal; width: 100px; }
table.agenda td.details { font-weight: bold; }
table.agenda td.info {  }

table.faq { margin-bottom: 25px; width: 100%; }
table.faq th { padding: 10px; }
table.faq td { padding: 10px; }
table.faq th { background: #92D050; font-size: 14pt; }
table.faq td.col1 { background: #eee; width: 300px; }
table.faq td.msg {  }
#content table.faq td.msg a:link { color: #222; }

table.smalltext td { font-size: 8pt; }


/* CSS3 COLUMNS */
.cols {
	-webkit-column-count: 2; /* Chrome, Safari, Opera */
	-moz-column-count: 2; /* Firefox */
	column-count: 2;
}


/* FROM STYLES */
.ui-widget { font-size: 1em; }


.btn {
	padding: 4px;
	display: inline-block;
	border-radius: 5px;
	border: 1px solid #ccc;
	background: #eee;
	font-size: 9pt;
	margin: 4px 0px;
}

#form_menu {
	padding: 0px;
	text-align: center;
	border-top: 0px solid #ccc;
	border-bottom: 0px solid #ccc;
	margin: 10px 0px;
}
#form_menu .btn.errors { background: #eee; color: red; }
#form_menu .btn.complete { background: #eee; color: green; }
#form_menu .btn.selected { background: yellow; color: #222; }

#eventFrm  {
	padding: 10px; margin-bottom: 0px;
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
	page-break-inside: avoid; /* Firefox */
	break-inside: avoid; /* IE 10+ */
}

#form_menu .circle {
	display: inline-block;
	background: #fff;
	border-radius: 50%;
	border: 2px solid #f4364c;
	width: 10px;
	height: 10px;
	margin: 0px 20px;
}

#form_menu .circle.errors { background: #fff; }
#form_menu .circle.complete { background: #1B426C; border-color: #1B426C; }
#form_menu .circle.selected { background: #f4364c; border-color: #f4364c; }

#confirm_preview {
	background:#eee;
	padding:20px;
	margin-top:30px;
}

/* revert to floats if css columns unsupported */
html.no-csscolumns .form { float: left; max-width: 500px; }

form fieldset {
	margin-bottom: 2em;
	border: none;
	border-top: 2px dotted #888;
	border-radius: 0;
}

form legend {
	font-size: 1.2em; font-weight: bold;
	padding: 5px; color: black;
	text-align: center;
	background: white;
}
form label { font-size: 1em; font-family: Monospace; }

.form_row { clear: both; padding: 4px 0; }
.form_row.header { border-bottom: 1px solid #ccc; margin-bottom: 10px; }
.form_message { padding: 10px 3px 4px 3px; font-weight: bold; }
.form_error { padding: 3px; color: grey; clear: both; }
.form_caption { float: left; width: 12em; padding: 3px; }
.form_caption .error { color: #c00; }
.form_caption .mandatory.error { color: red; }
.form_caption .mandatory::after { content: "*"; }
.form_caption .disabled { text-decoration: line-through; color: #888; }
.form_field .input { background: #efefef; border: 1px solid #ccc; font-family: Monospace; padding: 3px; }
.form_field .input:focus { background: #fff; }
.form_field .input:disabled { text-decoration: line-through; color: #ccc; }
.form_field .input.error { border: 1px solid #f00; background: #fff; }
.form_field .input.error:focus { border: 1px solid #ccc; }
.form_field textarea.input { width: 50%; }
.form_field ul.radio { display: inline; margin: 0px; padding: 0px; list-style: none; }
.form_field ul.radio li { display: inline; margin: 0px; padding: 0px; }
.form_field ul.checkbox { display: inline; margin: 0px; padding: 0px; list-style: none; }
.form_field ul.checkbox li { display: inline; margin: 0px; padding: 0px; }
.form_field .ui-checkboxradio-label { margin-bottom: 5px; }

.form_message.submit { text-align: right; }

input.submitbtn { padding: 20px; border: none; margin: 0 auto; }

/* COMMON SWITCHES */

.box { border: 1px solid #ccc; }
.capitalize { text-transform: capitalize; }
.red { color: red; }
.pad { padding: 10px; }
.scroll { overflow: auto; }
.left { float:left; margin-right:10px; }
.right { float:right; margin-left:10px; }
.hidden { display: none; }
.shadow { box-shadow: 1px 1px 5px #888; }
.clear { clear: both; }
.dragOver { background: #cfc; }
.crumb.dropzone.state-hover { background: #0f0; }
.dir.dropzone.state-hover { border-left: 10px solid #0f0; color: green; }


.desktopview { display: block; }
.mobileview { display: none; }


/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 721px)
{

}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 720px)
{

}

/* stack form caption and field */
@media only screen and (max-width : 915px)
{
	form textarea.input { width: 150px; }

	form .form_caption { float: none; }
	form .form_field { float: none; }
	form .form_field input[type=text] { width: 90%; }
	form .form_field input[type=time] { width: 90%; }
	form .form_field input[type=date] { width: 90%; }
	form .form_field select.input { width: 90%; }
	form .form_field textarea.input { width:90%; }

	#wrapper { padding: 20px 20px; }
	body { font-size: 85%; }
	body { margin: 0px; }

	table.data.vertical tr th { width: 50%; }


	/* elements with the trim class can be hidden */
	.trim { display: none; }

	#form_menu { padding: 10px; }
	fieldset.form { box-shadow: none; }

	#form_menu .circle { margin: 0px 10px; }

	.desktopview { display: none; }
	.mobileview { display: block; }
	.mobileview .logo { text-align: left; }
	.mobileview .logo img { width: 130px; }
	.mobileview .banner {
		padding: 0px;
		height: 220px;
		background-size: 110%;
		box-shadow: 0px -5px 35px #222 inset;
	}

	.left { float:none; margin-right:0px; }
	.right { float:none; margin-left:0px; }

	#article { box-shadow: none; padding: 15px; }
	#venue_col1 { width: 100%; float: none; }
	#venue_col2 { width: 100%; float: none; }
	#map_canvas { width: 100%; height: 300px; }
	#canvas_inner { margin: 0; background: none; }
	#canvas_inner.index { font-size: 10pt; }

	table.form_submission td.key { width: 150px;  }

	div.exhibitorBox { margin: 2px; width: 130px; height: 110px; }
	div.exhibitorBox img { width: 130px; }
}

/* revert to single column */
@media only screen and (max-width : 500px)
{
	.cols {
		-webkit-column-count: 1; /* Chrome, Safari, Opera */
		-moz-column-count: 1; /* Firefox */
		column-count: 1;
	}
}

@media print {
   .desktopview { display: none; }
   .mobileview { display: none; }
   body { margin-bottom: 0px; }
   #confirm_preview {
		background:#fff;
		padding:0px;
		margin-top:30px;
   }
}