/* Free fonts used on this site */
/* css snippet from font-face "../fonts/" directory path added */
/* @media screen{} wrapper added to get rid of irritating warnings
 * no idea why!
 */

 /* first import any font factory type fonts */
/*@import url('http://fonts.googleapis.com/css?family=Amarante');*/
@import url(http://fonts.googleapis.com/css?family=Old+Standard+TT:400,400italic,700|Lobster+Two:400,400italic|Amarante);

@font-face {
	font-family: 'OpenBaskerville-0.0.53';
	src: url('../fonts/OpenBaskerville-0.0.53.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'NouveauFLF';
	src: url('../fonts/NouveauFLF.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/* set som site colours */
:root {
	--main-bkg-col: #FFFFEF;
	--emph-bkg-col: #FFFFCF;

	--main-txt-col: #0033FF;
	--head-txt-col: #CC33FF;
}

body {
	font-family: OpenBaskerville-0.0.53, 'Comic Sans MS', "Trebuchet MS", Helvetica, sans-serif;
	background-color: var(--main-bkg-col);
	color: var(--main-txt-col);
	padding: 20px;
	margin-top: 0px;
	overflow-y: scroll;
}
h1,h2, h3, h4, h5, h6 {
	font-family: 'Amarante', 'Comic Sans MS', Helvetica, sans-serif;
	background-color: var(--emph-bkg-col);
	color: var(--head-txt-col);
	text-align: center;
	padding: 5px;
	margin-top: 0px;
}
h1{
	border-style: solid;
	border-color: var(--main-bkg-col);
	border-left-color: var(--head-txt-col); 
	border-right-color: var(--head-txt-col);
}
h3, h4, h5, h6 {
	/*font-family: NouveauFLF, 'Comic Sans MS', Helvetica, sans-serif;*/
	background-color: var(--main-bkg-col);
	text-align: left;
}
h3 {
	background-color: #FFFFF0;
}
h4 {
	background-color: #FFFFF4;
}
h5 {
	background-color: #FFFFF8;
}
h6 {
	background-color: #FFFFFa;
}
article {
	background-color: #404040;
	color: #eeeeee;
	text-align: left;
	padding: 10px;
}
/* lists for navigation menus */
ul.nav {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
li.nav {
	display: inline;
	background-color: #808080;
	margin: 0;
	padding-left: 2px;
	padding-right: 2px;
	border-style: solid;
	border-width: 1px;
	border-color: #4F0099;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	/*float: left;*/

}
li.cur {
	display: inline;
	background-color: #4F0099;
	margin: 0;
	padding-left: 2px;
	padding-right: 2px;
	border-style: solid;
	border-width: 1px;
	border-color: #4F0099;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	/*float: left;*/
}
/* recolour links */
a, a:link {
	color: #00f0f0;
}
a:visited {
	color: #008f8f;
}
a:hover {
	color: #ff0000;
}
a:active {
	color: #008f8f;
}
/* links in navigation tabs */
a, a.tab:link {
	color: #ffffff;
	text-decoration: none;
}
a.tab:visited {
	color: #ffffff;
	text-decoration: none;
}
a.tab:hover {
	color: #ffffff;
	text-decoration: none;
}
a.tab:active {
	color: #ffffff;
	text-decoration: none;
}
p {

}
/* some style for iframes */

/* make iframe responsive */
.iframe-container-resp-16x9{
	overflow: hidden;
	padding-top: 56.25%; /* 235/560 from YouTube Embed code */
	position: relative;
}
.iframe-container-resp-16x9 iframe{
	border:0;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.iframe-container-resp-897x573{
	overflow: hidden;
	padding-top: 64.88%; /* 235/560 from YouTube Embed code */
	position: relative;
}
.iframe-container-resp-897x573 iframe{
	border:0;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
/* put boxes around content */
.boxed1{
	border: 2px solid red;
}
/* put boxes around content */

.boxed2, .boxed-red{
	border: 2px solid red;
	margin-left: 30px;
	margin-right: 30px;
	padding-left: 20px;
	padding-right: 20px;
}
.boxed-green{
	border: 2px solid green;
	margin-left: 30px;
	margin-right: 30px;
	padding-left: 20px;
	padding-right: 20px;
}
.boxed-blue{
	border: 2px solid blue;
	margin-left: 30px;
	margin-right: 30px;
	padding-left: 20px;
	padding-right: 20px;
}