﻿
/* BASIC PAGE SETUP ============================================================================= */

body { 
margin : 0px;
padding : 0;
font : 100%/1.4 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 	
color : #000; 
text-align: center;
background:#F0E2C6

}


/*  HEADINGS  ============================================================================= */

h1, h2, h3, h4, h5, h6 {
font-family:  MuseoSlab300, 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif;
font-weight : normal;
margin-top: 0px;
letter-spacing: 1px;
}

h1 { 
font-family:  LeagueGothicRegular, 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif;
color: #000;
margin-bottom : 0.2em;
font-size : 6em; /* 96 / 16 */
line-height : 1.4;
}


h2 { 
color: #222;
margin-bottom : .5em;
margin-top : .5em;
font-size : 2.75em; /* 40 / 16 */
line-height : 1.2;
}

h3 { 
color:#cc1122;
margin-bottom : -0.05em;
margin-top : -1em;
font-size : 1.75em; /* 28 / 16 */
line-height : 1.3; }


h4 { 
color: #cc1122;
margin-top: -0.15em;
margin-bottom : -0.05em;
font-size : 1.5em; /* 24 / 16  */
line-height : 1.15; }

	footer h4 { 
		color: #ccc;
	}

h5 { 
color: #cc1122;
margin-top:.25em;
font-size : 1em; /* 20 / 16 */ 
margin-bottom :0.5em;
}

h6 { 
color:#8F2140;
font-size : 1em; /* 16 / 16  */ }



/*  ALERT MESSAGE  ============================================================================= */

#alert {
  padding: 20px;
  background-color: #2196F3;
  color: #fff;
}
.alert.success {background-color: #4CAF50;}
.alert.info {background-color: #2196F3;}
.alert.warning {background-color: #ff9800;}
.closebtn {
  margin-left: 15px;
  color:#FF0000;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}

/*  TYPOGRAPHY  ============================================================================= */

p, ol, ul, dl, address { 
margin-bottom : 1.5em;
line-height: 1.3em;
font-size : 1.4em; /* 16 / 16 = 1 */ }

p {
hyphens : auto;  }


p.introtext {
font-family:  MuseoSlab100, 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif;
font-size : 2.5em; /* 40 / 16 */
color: #333;
line-height: 1.4em;
letter-spacing: -1px;
margin-bottom: 0.5em;
}


p.handwritten {
font-family:  HandSean, 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 
font-size: 1.375em; /* 24 / 16 */
line-height: 1.8em;
margin-bottom: 0.3em;
color: #666;
}

p.center {
text-align: center;
}


.and {
font-family: GoudyBookletter1911Regular, Georgia, Times New Roman, sans-serif;
font-size: 1.5em; /* 24 / 16 */
}

.heart {
font-size: 1.5em; /* 24 / 16 */
}

ul, 
ol { 
margin : 0 0 1.5em 0; 
padding : 0 0 0 24px; }

li ul, 
li ol { 
margin : 0;
font-size : 1em; /* 16 / 16 = 1 */ }

dl, 
dd { 
margin-bottom : 1.5em; }

dt { 
font-weight : normal; }

b, strong { 
font-weight : bold; }

hr { 
display : block; 
margin : 1em 0; 
padding : 0;
height : 1px; 
border : 0; 
border-top : 1px solid #ccc;
}

small { 
font-size : 1em; /* 16 / 16 = 1 */ }

sub, sup { 
font-size : 75%; 
line-height : 0; 
position : relative; 
vertical-align : baseline; }

sup { 
top : -.5em; }

sub { 
bottom : -.25em; }

.subtext {
	color: #666;
	}

/* LINKS =============================================================================  */

a { 
color : #cc1122;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
text-decoration: none;
}

a:visited { 
color : #ee3344; }

a:focus { 
outline : thin dotted; 
color : rgb(0,0,0); }

a:hover, 
a:active { 
outline : 0;
color : #dd2233;
}


footer a { 
color : #ffffff;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}

footer a:visited { 
color : #fff; }

footer a:focus { 
outline : thin dotted; 
color : rgb(0,0,0); }

footer a:hover, 
footer a:active { 
outline : 0;
color : #fff;
}


/* IMAGES ============================================================================= */
.logo {
	border:0px;
	width:100%;
	height:auto;
	min-width:100px;
	max-width:500px;
	margin:5px 10px 10px 10px;
}
img {
border : 0;
max-width: 100%;
min-width:100px;
height: auto;
width:100%
}
.img-1 {
border : 0;
max-width: 300px;
min-width:100px;
height: auto;
width:100%
}

#vert-center {
position:absolute;
vertical-align:middle;
}
.img-mid {
	max-width:300px;
	max-height:132px;
	width:100%;
	height:auto;
	border:0px;
}
.img-floatleft { float: left; margin: 0 10px 0 0; }
.img-floatright { float: right; margin-right:100px; vertical-align:middle; border-width:0px; }
.img-hide {
	display:block
}

/* TABLES ============================================================================= */

table { 
border-collapse : collapse;
border-spacing : 0;
margin-bottom : 1.4em; 
width : 100%; }

th, td, caption { 
padding : .25em 10px .25em 5px; }

tfoot { 
font-style : italic; }

caption { 
background-color : transparent; }
.auto-style12 {
	text-decoration: underline;
}
.auto-style13 {
	text-align: right;
	width:25px;
}

/*  MAIN LAYOUT	============================================================================= */


#wrapper {
	width: 100%;
	text-align: left;
	background:#F0E2C6
}

#menu-bar {
	width:100%;
	height:auto;
	background-color:#8aa47d;
} 
#menu {
display:inline-block;
height:100%;
vertical-align:middle;
	padding:0px 0px 25px 0px;
	width:100%;
	background-color:white;
	float:	left
}   
		

	#maincontentcontainer {
		width: 100%;
	}

		.standardcontainer {
			
		}
		
		.darkcontainer {
			background: rgba(102, 102, 102, 0.05);
		}

		.lightcontainer {
			background: rgba(255, 255, 255, 0.33);
		}
		
			#maincontent{
				clear: both;
				width: 90%; /* 1000px / 1250px */
				font-size: 0.8125em; /* 13 / 16 */
				max-width: 92.3em; /* 1200px / 13 */
				margin: 0 auto;
				padding: 1em 0px;
				color: #333;
				line-height: 1.5em;
				position: relative;
			}
		
			.maincontent{
				clear: both;
				width: 80%; /* 1000px / 1250px */
				font-size: 0.8125em; /* 13 / 16 */
				max-width: 92.3em; /* 1200px / 13 */
				margin: 0 auto;
				padding: 1em 0px;
				color: #333;
				line-height: 1.5em;
				position: relative;
			}

	#footercontainer {
		width: 100%;
		position:relative;
		bottom:0px;
		max-height:400px;
		border-top: 1px solid #000;
		background: #222;
	}
	
		footer {
			clear: both;
			text-align:left;
			width: 90%; /* 1000px / 1250px */
			font-size: 0.8125em; /* 13 / 16 */
			max-width: 92.3em; /* 1200px / 13 */
			margin: 0 auto;
			padding: 20px 0px 10px 0px;
			color: #999;
		}

		footer strong {
			font-size: 1.077em; /* 14 / 13 */
			color: #aaa;
		}



.col-container {
  display: table;
  width: 100%;
  max-width:2000px;
}
.col1{
display:table-cell;
vertical-align:middle;
width:33%;
}
.col2{
display:table-cell;
vertical-align:top;
width:50%;
}

.floatleft {
    float: left;
}

.floatright {
    float: right;
}
.auto-style1 {
	font-size: small;
}
.auto-style2 {
	font-size: x-small;
}
.auto-style3 {
	color: #336600;
}
.auto-style4 {
	border-style: solid;
	border-width: 1px;
}
.auto-style5 {
	font-weight: bold;
	border-style: solid;
	border-width: 1px;
}
.auto-style6 {
	border-collapse: collapse;
	border: 3px solid #668059;
	background-color: #FFFFFF;
}
.auto-style8 {
	left:100px;
	position:absolute;


}

@media only screen and (max-width: 800px) {

.col1{
    display: block;
    width: 100%;
    vertical-align:middle;
}
.col2{
    display: block;
    width: 100%;
    vertical-align:middle;
}
.img-1 {
border : 0;
max-width: 65%;
min-width:100px;
height: auto;
width:65%
}
.img-hide {
	display:none
}
}

}


