@charset "utf-8";

/*
	LavenderCAM global layout
	- One shared sidebar for all pages
	- CSS Grid layout
	- No float hacks
	- No page-specific painted sidebar fixes required for normal pages
*/

* {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	background: #333;
	margin: 0;
	padding: 0;
	color: #000;
}

ul, ol, dl {
	padding: 0;
	margin: 0;
}

h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
	padding-right: 15px;
	padding-left: 15px;
	margin-bottom: 5px;
}

h1 {
	font-size: 1.15em;
	line-height: 1.3;
}

p {
	margin-top: 0;
	padding-right: 15px;
	padding-left: 15px;
	font-size: 12px;
}

a img {
	border: none;
}

a:link {
	color: #000;
	text-decoration: underline;
}

.bb a:link {
	color: #000;
	text-decoration: underline;
}

a:visited {
	color: #6E6C64;
	text-decoration: underline;
}

a:hover,
a:active,
a:focus {
	text-decoration: none;
}

/* Main site frame */
.container {
	width: 960px;
	max-width: 100%;
	margin: 0 auto;
	background: #000;
	display: grid;
	grid-template-columns: 260px 700px;
	grid-template-areas:
		"header header"
		"sidebar content"
		"footer footer";
	align-items: stretch;
}

/* Header */
.header {
	grid-area: header;
	background: #000;
}

.header img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* Sidebar */
.sidebar1 {
	grid-area: sidebar;
	width: 260px;
	background: #000;
	padding-bottom: 30px;
	min-height: 100%;
	float: none;
}

/* Content */
.content {
	grid-area: content;
	width: 700px;
	max-width: 100%;
	padding: 10px 0;
	background: #FFF;
	float: none;
}

/* Footer */
.footer {
	grid-area: footer;
	padding: 5px 1px 1px 1px;
	background: #333;
	text-align: center;
	position: relative;
	font-size: 28px;
	clear: none;
}

/* Existing helpers */
.videosize {
	padding-left: 30px;
	height: 360px;
	width: 640px;
	max-width: 100%;
}

.centre {
	text-align: center;
	margin-top: 0;
	margin-bottom: 0;
	padding: 0;
}

.historycentre {
	text-align: center;
	margin-top: 0;
	margin-bottom: 0;
	padding: 0;
	color: #000;
	background: #FFF;
}

.content ul,
.content ol {
	padding: 0 15px 15px 40px;
}

/* Navigation */
ul.nav {
	list-style: none;
	border-top: 1px solid #666;
	margin-bottom: 15px;
}

ul.nav li {
	border-bottom: 1px solid #666;
}

ul.nav a,
ul.nav a:visited {
	display: block;
	width: 100%;
	padding: 6px 8px 6px 15px;
	text-decoration: none;
	background: #000;
	color: #FFF;
	font-size: 13px;
	line-height: 1.3;
}

ul.nav a:hover,
ul.nav a:active,
ul.nav a:focus,
ul.nav a.active {
	background: #333;
	color: #FFF;
}

/* Sidebar group headings */
.sidebar-section-title {
	display: block !important;
	margin: 14px 8px 8px 8px !important;
	padding: 7px 10px !important;
	background: rgba(126,166,217,0.12) !important;
	color: #8db8f0 !important;
	text-align: center !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 1.2px !important;
	text-transform: uppercase !important;
	border: 1px solid rgba(126,166,217,0.20) !important;
	border-radius: 999px !important;
	line-height: 1.4 !important;
	width: auto !important;
}

/* Sidebar widget area */
.sidebar-widgets {
	margin-top: 18px;
	padding-top: 14px;
	border-top: 1px solid #333;
}

.sidebar-widgets-title {
	margin: 0 15px 12px 15px;
	padding: 6px 8px;
	background: #111;
	border: 1px solid #333;
	color: #bbb;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-align: center;
}

.sidebar-widgets p {
	margin: 0 0 16px 0;
	padding: 0 10px;
	text-align: center;
}

/* Media and embeds */
img,
iframe,
object,
embed {
	max-width: 100%;
}

.content iframe,
.content img,
.content table {
	max-width: 100%;
}

/* Utility classes */
.fltrt {
	float: right;
	margin-left: 8px;
}

.fltlft {
	float: left;
	margin-right: 8px;
}

.clearfloat {
	clear: both;
	height: 0;
	font-size: 1px;
	line-height: 0;
}

.red {
	color: #F00;
}

.small {
	font-size: 0.5em;
}

.medium {
	font-size: 0.65em;
}

.italic {
	font-style: italic;
}

/* Mobile layout */
@media screen and (max-width: 760px) {
	.container {
		width: 100%;
		grid-template-columns: 1fr;
		grid-template-areas:
			"header"
			"content"
			"sidebar"
			"footer";
	}

	.sidebar1,
	.content {
		width: 100%;
	}

	.sidebar1 {
		padding-bottom: 20px;
	}

	ul.nav a,
	ul.nav a:visited {
		width: 100%;
	}

	.videosize {
		padding-left: 0;
		width: 100%;
		height: auto;
	}
}