* {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

@font-face {
    font-family: 'freebooter';
    src: url('freebooterscript-webfont.eot');
    src: url('freebooterscript-webfont.eot?#iefix') format('embedded-opentype'),
         url('freebooterscript-webfont.woff') format('woff'),
         url('freebooterscript-webfont.ttf') format('truetype'),
         url('freebooterscript-webfont.svg#freebooter_scriptregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

html,
body,
.wrapper
.col
 {
	max-width: 100%;
}

body {
	
	margin: 0 auto;
	background:url(../img/seamless_paper_texture.png);
	
	}


a {
  text-decoration:none;
}





.wrapper {
	
	max-width: 90%;
	padding: 4%;
	margin: 0 auto;
	}



nav,
header {
	display: table-cell;
	vertical-align: middle;
}

/*===================MEDIA STYLES==========*/

.embed-container 

{ position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; } 


.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

img {
	max-width: 100%;
}


/*===================HEADER===============*/
header {
	
  
 
  padding: 5px 5% 20px 0px;
  width: 100%;
  display:table;
}


header h2 {
	margin-left: 20px;
	margin-top: -64px;
	margin-bottom: -40px;
	font-size: 2.4em;
}

header h1 {
	font-size: 3.8em;
	
}

.profile-photo {
	vertical-align: middle;
	display: inline-block;
	margin-left: 164px;
	margin-bottom: -40px;
	opacity:0.78;
	
}
/*****************NAVIGATION*****************/

nav {
	display: inline-block;
  text-align: right;
  
  padding-top: 2%;
  
  
  
}

nav ul {
	
  list-style: none;
  
  }

nav li   {
	
  display: inline-block;
  

}

nav a {
	 
	opactiy:0.4;
	padding: 8px;
	border-radius: 2px;
	border: dotted 1px;
	margin: 0 auto;
  font-weight: bold;
  font-size: 16px;
  color: #333;
  font-family: 'Cinzel Decorative', cursive;
  
}

nav a, nav a:visited {
  color: #000;
}

nav a.selected, nav a:hover{
  color:#930;
}

.social-button {
	float:right;
  width: 40px;
  height: 40px;
  margin: 0 5px;
}


/********************TEXT***********/
p { 
text-align:center;
   margin: 1.2em 0;
   font-family: 'Oswald', sans-serif;
}

h1 {
	font-family: 'freebooter', cursive;
	
}

h2 {
	font-family: 'Cinzel Decorative', cursive;
}
	
	h3 {
	
	font-size: 2em;
	
	font-family: 'freebooter', cursive;
	font-weight:400;
	border-bottom:thin dotted;
	}


/*********************boxes ***********/


col {
	
	height:100%;
	display:inline-block;
	
	
}


 .primary 	{
    width: 48%;
    float: left;
	
  }
  
  .secondary 	{
	 
    width: 42%;
    float: right;
	
	
  }
  
/*=====================	INDEX PAGE ===================*/
.events{
	padding:0;
	list-style: none;
	text-align:center;
}
.events a{
	text-decoration:underline;
	color: #000;
}

.events p { 
margin: 0.2%;
font-size: 16px;
}

.events h1 {
	font-family: 'Cinzel Decorative', cursive;
	font-size:24px;
	margin: 0.2%;
}


/*====================INDEX STYLE===========*/	
.title {
	text-align:center;
	font-weight:400;
	font-size: 4em;
	margin-bottom:-40px;
}


/*======================FOOTER==============*/
	
.main-footer {
	padding: 20px;
	clear: all;
	height:80	px;
	width: 80px;
	text-align: center;
	position:relative
	
}
.main-footer p {
	color:#CCC;
	font-size: 0.75em;
}

	
/*===============MEDIA SCREEN============*/	
	
	
	@media (max-width: 768px) {
	.embed-container 

	.logo,
	.nav, 
	.nav li,
	.col {
       display: block;
       width: initial;
       height: initial;
	   margin: initial;
	}
	.nav {
		padding-left: initial;
	}
	.nav li {
	   margin-top: 15px;
	}
	
	
}
