/*style.css*/


html, body {
}

body {
	margin: 0em;
	padding: 0em;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #877850;
}

body, #skel-panels-pageWrapper {
	background: #FFF2CF url(images/img01.png) repeat;
}

h1, h2, h3, h4 {
	margin: 0em;
	padding: 0em;
	text-transform: none;
	font-family: 'Bookman Old Style', sans-serif;
	font-weight: 400;
	color: #887644;
}

h2 {
	font-size: 1.75em;
}
h4 {
	font-size: 3.0em;
}
p {
	line-height: 170%;
	font-size: 1.5em;
}

a {
	color: #706443;
}

strong {
	font-weight: 700;
	color: #675830;
}



.red {color: #FF0000; }

.black {color: #415A74; }

.blue {color: #0000E6; }

.green {color: #009933; }

.maroon {color: #730000; }

.crimson {color: #e0011c; }

.pink {color: #c63f8e; }


/* Button Style */

.button-style1 a {
	display: block;
	padding: 1em 0em 1em 1em;
	background: #000000 url(images/img03.jpg) no-repeat right 50%;
	text-decoration: none;
	text-shadow: none;
	text-transform: none;
	font-family: 'Bookman Old Style', sans-serif;
	font-size: 1em;
	font-weight: 200;
	color: #FFFFFF;
}

/* Button Style 2 */

.button-style2 a {
	display: inline-block;
	height: 2.60em;
	margin-top: 1.25em;
	padding: 0em 1.25em 0em 1.25em;
	background: #766946;
	border-radius: 5px;
	line-height: 2.60em;
	text-shadow: none;
	text-decoration: none;
	text-transform: none;
	font-size: 0.90em;
	color: #FFFFFF;
}


/** LIST STYLE 1 */

ul.style1 {
	margin: 0em;
	list-style: none;
}

ul.style1 li {
	padding: 0.94em 0em;
	background: url(images/img02.jpg) repeat-x left top;
}

ul.style1 a {
	display: block;
	padding: 0em 0em 0em 1.87em;
/*	background: url(images/img05.png) no-repeat left 3px;
*/	text-shadow: 1px 1px 0px #FFFFFF;
	text-decoration: none;
	color: #443c27;
	font-size: 1.5em;
}

ul.style1 a:hover {
	text-decoration: underline;
		font-size: 1.5em;
}

ul.style1 .first {
	background: none;
}

/** LIST STYLE 2 */

ul.style2 {
	margin: 0em;
	padding: 0em;
	list-style: none;
}

ul.style2 li {
	padding: 1.25em 0em 1.25em 0em;
	background: url(images/img02.jpg) repeat-x left top;
}

ul.style2 a {
	text-decoration: none;
	color: #443c27;
}

ul.style2 a:hover {
	text-decoration: underline;
}

ul.style2 .date {
	display: inline-block;
	margin: 0em 0em 1.56em 0em;
	padding: 0.35em 0.35em;
	background: url(images/img02.jpg) repeat-x left top;
	border-radius: 5px;
	letter-spacing: 0.06em;
	line-height: none;
	text-transform: none;
	font-family: 'Bookman Old Style', sans-serif;
	font-weight: 200;
	color: #FFFFFF;
}

ul.style2 .date a {
	color: #FFFFFF;
}

ul.style2 img {
	float: left;
	margin-right: 1.5em;
}

ul.style2 .first {
	background: none;
}

/** LIST STYLE 3 */

ul.style3 {
	margin: 0em;
	padding: 0em;
	list-style: none;
}

ul.style3 li {
	padding: 1.25em 0em 1.56em 0em;
}

ul.style3 a {
	display: block;
	text-decoration: none;
	color: #C18062;
}

ul.style3 a:hover {
	text-decoration: underline;
}

ul.style3 .date {
}

ul.style3 .date b {
}

ul.style3 .date a {
	color: #FFFFFF;
}

ul.style3 .date a:hover {
	text-decoration: none;
}

ul.style3 .first {
	padding-top: 0em;
	background: none;
}

/** LIST STYLE 4 */

ul.style4 {
	margin: 0em;
	padding: 0em;
	list-style: none;
}

ul.style4 li {
	padding: 0.94em 0em 0.94em 0em;
	background: url(images/img02.jpg) repeat-x left top;
}

ul.style4 a {
	display: block;
	padding: 0em 0em 0em 1.87em;
	text-decoration: none;
	color: #C18062;
}

ul.style4 a:hover {
	text-decoration: underline;
}

ul.style4 li {
	border-top: 0;
}

/** LIST STYLE 5 */

ul.style5 {
	overflow: hidden;
	margin: 0em 0em 1em 0em;
	padding: 0em;
	list-style: none;
}

ul.style5 li {
	float: left;
	padding: 0.25em 0.25em;
	line-height: 0;
}

ul.style5 a {
}



/** LIST STYLE 6 */

ul.style6 {
	margin: 0em;
	padding: 0em;
	list-style: none;
}


ul.style6 h3 {
	margin: 0em;
	padding: 0em 0em 0.63em 0em;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 1em;
	color: #7D6F4B;
}

ul.style6 p {
	font-style: italic;
	font-size: 0.87em;
}

ul.style6 li {
	background: url(images/img02.jpg) repeat-x left top;
	padding: 1.25em 0em 1.25em 0em;
	line-height: 170%;
}

ul.style6 a {
	display: block;
	padding: 0em;
	text-decoration: none;
	color: #A29574;
}

ul.style6 a:hover {
	text-decoration: underline;
}

ul.style6 .first {
	padding-top: 0em;
	background: none;
}

	ul.style9, ul.style9-dates
	{
	}

		ul.style9 a
		{ font-size: 1.5em;
		  font-style: bold;
		  text-decoration: none;}

		ul.style9 span
		{ font-size: 2.5em;
		  font-style: bold;
		  text-decoration: none;}

		ul.style9 li, ul.style9-dates li
		{
			border-bottom: solid 1px rgba(0,0,0,0.15);
			border-top: solid 1px rgba(255,255,255,0.75);
			padding: 1em 0 1em 0;
		}

		ul.style9-dates li
		{
			padding: 0.375em 0 0.375em 0;
		}

		ul.style9 li:first-child, ul.style9-dates li:first-child
		{
			border-top: 0;
			padding-top: 0;
		}
		
		ul.style9 li:last-child, ul.style9-dates li:last-child
		{
			border-bottom: 0;
		}

		ul.style9-dates li .date
		{
			display: inline-block;
			background: url('images/img06.jpg') bottom left;
			padding: 0.5em 0.5em 0.6em 0.5em;
			min-width: 3em;
			border-radius: 3px;
			color: #fff;
			font-style: italic;
			text-shadow: -1px -1px 0px rgba(0,0,0,0.25);
			text-align: center;
			box-shadow: 1px 1px 0px 0px rgba(255,255,255,0.5);
			margin-right: 0.75em;
		}
	

		ul.style9-dates li .date2
		{
			display: inline-block;
			background: url('images/img16.jpg') bottom left;
			padding: 0.5em 0.5em 0.6em 0.5em;
			min-width: 3em;
			border-radius: 3px;
			color: #fff;
			font-style: italic;
			text-shadow: -1px -1px 0px rgba(0,0,0,0.25);
			text-align: center;
			box-shadow: 1px 1px 0px 0px rgba(255,255,255,0.5);
			margin-right: 0.75em;
		}

.balloon {
	padding: 1.87em;
	background: url(images/img08.jpg) repeat left top;
	border-radius: 5px;
	line-height: 180%;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.2em;
	font-style: italic;
}

.ballon-bgbtm {
	height: 1.87em;
	background: url(images/img09.png) no-repeat right top;
}

/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/
	
	#copyright
	{
		position: relative;
		padding: 3em 0em;
		text-align: center;
		color: #877850;
		background: #62573b;
	}
	
	#copyright .container
	{
	}
	
	#copyright a
	{
		text-decoration: none;
		color: #877850;
	}

/* Roster */

	#content .roster {
		padding: 2.5em 0em 2em 0em;
		font-size: 2em;
		line-height: 1.5em;
	}

	#content .roster h2{
		padding: 1em 0em 0em 0em;
		font-size: 2em;
		line-height: 1em;
		color: #6c2020;
	}

	#content .roster h2.red{
		color: #e71d1d;
		font-size: 1.25em;
	}

	#content p.blue{
		color: #0000ff;
		font-size: 1,5em;
	}

/* Thumbnails */

	.thumbnails {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-direction: row;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		position: relative;
		margin: 0 0 2em -2em;
	}

		.thumbnails a {
			-moz-transition: all 0.2s ease;
			-webkit-transition: all 0.2s ease;
			-ms-transition: all 0.2s ease;
			transition: all 0.2s ease;
			border-bottom: none;
			display: block;
			width: 100%;
			margin: 0 0 2em 0;
			text-align: center;
			border-radius: 4px;
			box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
			background-color: rgba(255, 255, 255, 0.075);
			cursor: pointer;
			outline: 0;
			overflow: hidden;
		}

			.thumbnails a img {
				display: block;
				width: 100%;
				border-top-left-radius: 4px;
				border-top-right-radius: 4px;
			}

			.thumbnails a h3 {
				margin: 1em;
			}

			.thumbnails a:hover {
				background-color: rgba(255, 255, 255, 0.25);
				box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25), 0 0 0.5em 0 #FF6382;
			}

		.thumbnails > div {
			display: -moz-flex;
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
			-moz-flex-direction: column;
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
			width: calc(100% / 3);
			padding-left: 2em;
		}

			.thumbnails > div > :last-child {
				margin-bottom: 0;
			}

		@media screen and (max-width: 1280px) {

			.thumbnails {
				margin: 0 0 2em -1.5em;
			}

				.thumbnails a {
					margin: 0 0 1.5em 0;
				}

				.thumbnails > div {
					padding-left: 1.5em;
				}

		}

		@media screen and (max-width: 980px) {

			.thumbnails h3 {
				font-size: 0.8em;
			}

		}

		@media screen and (max-width: 480px) {

			.thumbnails {
				display: block;
			}

				.thumbnails a {
					margin: 0 0 2em 0 !important;
				}

				.thumbnails > div {
					display: block;
					width: 100%;
				}

					.thumbnails > div:last-child > :last-child {
						margin-bottom: 0 !important;
					}

				.thumbnails h3 {
					font-size: 1em;
				}

		}



/* Avatar */


		#header .avatar {
			border-radius: 100%;
			display: inline-block;
			margin: 0 0 2em 0;
			padding: 0.5em;
			border: solid 1px rgba(255, 255, 255, 0.25);
			background-color: rgba(255, 255, 255, 0.075);
		}

			#header .avatar img {
				border-radius: 100%;
				display: block;
				width: 10em;
			}

/*Added Classes and IS's*/

	#hcenter 
	{		
		text-align: center;
	}


		
	.button
	{
		position: relative;
		display: inline-block;
		color: #fff;
		text-decoration: none;
		padding: 0.6em 2em 0.6em 1em;
		border-radius: 5px;
		background: url('images/bg5.jpg') center left repeat-x;
		box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.75), inset 0px 0px 0px 2px rgba(255,255,255,0.25), 0px 2px 3px 0px rgba(0,0,0,0.3);
		font-size: 1.5em;
		text-shadow: -1px -1px 0px rgba(0,0,0,0.75);
		font-family: 'Oleo Script', cursive;
		width: 375px;
 		height: 150px;
	}
		
	.buttonlong
	{
		position: relative;
		display: inline-block;
		color: #fff;
		text-decoration: none;
		padding: 0.6em 2em 0.6em 1em;
		border-radius: 5px;
		background: url('images/bg5.jpg') center left repeat-x;
		box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.75), inset 0px 0px 0px 2px rgba(255,255,255,0.25), 0px 2px 3px 0px rgba(0,0,0,0.3);
		font-size: 1.5em;
		text-shadow: -1px -1px 0px rgba(0,0,0,0.75);
		font-family: 'Oleo Script', cursive;
		width: 375px;
 		height: 200px;
	}


	.button2
	{

		display: inline-block;
		color: #fff;
		text-decoration: none;
		padding: 0.6em 2em 0.6em 1em;
		border-radius: 5px;
		background: url('images/bg5A.jpg') center left repeat-x;
		box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.75), inset 0px 0px 0px 2px rgba(255,255,255,0.25), 0px 2px 3px 0px rgba(0,0,0,0.3);
		font-size: 1.5em;
		text-shadow: -1px -1px 0px rgba(0,0,0,0.75);
		font-family: 'Oleo Script', cursive;
		width: 375px;
 		height: 150px;
/* 		position:;
*/	}

	.button3
	{
		position:;
		display: inline-block;
		color: #fff;
		text-decoration: none;
		padding: 0.6em 2em 0.6em 1em;
		border-radius: 5px;
		background: url('images/bg5B.jpg') center left repeat-x;
		box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.75), inset 0px 0px 0px 2px rgba(255,255,255,0.25), 0px 2px 3px 0px rgba(0,0,0,0.3);
		font-size: 1.5em;
		text-shadow: -1px -1px 0px rgba(0,0,0,0.75);
		font-family: 'Oleo Script', cursive;
	}

	.button4
	{
		position:;
		display: inline-block;
		color: #fff;
		text-decoration: none;
		padding: 0.6em 2em 0.6em 1em;
		border-radius: 5px;
		background: url('images/bg5C.jpg') center left repeat-x;
		box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.75), inset 0px 0px 0px 2px rgba(255,255,255,0.25), 0px 2px 3px 0px rgba(0,0,0,0.3);
		font-size: 1.5em;
		text-shadow: -1px -1px 0px rgba(0,0,0,0.75);
		font-family: 'Oleo Script', cursive;
	}

		.button:hover
		{
			background-position: 0px -40px;
		}
	
		.button:active
		{
			background-position: 0px -100px;
		}
	
		.button:before, .button:after
		{
			content: '';
			position: absolute;
			border-top: solid 7px transparent;
			border-bottom: solid 7px transparent;
			border-left: solid 7px;
			top: 0.85em;
			right: 0.8em;
		}
		
		.button:after
		{
			border-left-color: rgba(0,0,0,0.65);
		}
		
		.button:before
		{
			top: 0.95em;
			border-left-color: rgba(255,255,255,0.35);
		}
	
	.button-big
	{
		position: relative;
		display: inline-block;
		color: #fff;
		text-decoration: none;
		padding: 0.55em 1.9em 0.55em 1em;
		border-radius: 5px;
		background: url('images/bg5.jpg') center left repeat-x;
		box-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.75), inset 0px 0px 0px 2px rgba(255,255,255,0.25), 0px 2px 3px 0px rgba(0,0,0,0.3);
		font-size: 2em;
		text-shadow: -1px -1px 0px rgba(0,0,0,0.75);
		font-family: 'Oleo Script', cursive;
	}

		.button-big:hover
		{
			background-position: 0px -40px;
		}
	
		.button-big:active
		{
			background-position: 0px -100px;
		}
	
		.button-big:before, .button-big:after
		{
			content: '';
			position: absolute;
			border-top: solid 10px transparent;
			border-bottom: solid 10px transparent;
			border-left: solid 10px;
			top: 0.75em;
			right: 0.8em;
		}
		
		.button-big:after
		{
			border-left-color: rgba(0,0,0,0.65);
		}
		
		.button-big:before
		{
			top: 0.8em;
			border-left-color: rgba(255,255,255,0.35);
		}