/* CSS Document */
/* Mobile First */



	

/* ........... FONT & TYPOGRAPHY............*/


body,
html {
	font-family: Book;
	font-size: 1em;
	color: #666;
  	-webkit-font-smoothing: antialiased;
  	-moz-osx-font-smoothing: grayscale;
  	-webkit-font-smoothing: antialiased;
  	font-smoothing: antialiased;
  	font-weight: 400;
	}
  	/* Firefox specific rule */
	@-moz-document url-prefix() {
		body {
		font-weight: lighter !important;
		}
		}

/* Keep stext size consitent on iPhoone */
	@media screen and (max-device-width: 480px){
	  body{
	    -webkit-text-size-adjust: none;
	  	}
		}



/* .........  H E A D S ..........*/

h1,h2,h3,h4,h5,h6 {
	font-weight: normal;
	margin-top: 0;
	margin-bottom: 0;
	line-height: 1.15em;
	}

h1,h2,h3 {
	font-family: "Oceania_Bold";
	letter-spacing: -.09em;
	color: black;
	}
	
	
h4,h5,h6 {
	font-family: "Bold";
	letter-spacing: -.025em;
	color: #51504a;
	}	



     
h1 {
	font-size: 2em;
	line-height: .95em;
	}
	@media (min-width: 480px) {
		h1 {
			font-size: 2.6em;
			}
			}	
	@media (min-width: 640px) {
		h1 {
			font-size: 4em;
			}
			}
	@media (min-width: 1024px) {
		h1 {
			font-size: 5em;
			}
			}	

h2 {
	font-size: 1.8em;
	margin-top: 0;
	margin-bottom: 0.25em;
	text-align: center;
	}
	@media (min-width: 480px) {
		h2 {
			font-size: 2.1em;
			margin-top: 0.75em;
			margin-bottom: 0.5em;
			}
			}
	@media (min-width: 640px) {
		h2 {
			font-size: 2.5em;
			}
			}
	@media (min-width: 1024px) {
		h2 {
			font-size: 3em;
			}
			}














h3 {
	margin-bottom: .5em;
	font-size: 1.3em;
	line-height: 1.1em;
	}
	@media (min-width: 480px) {
		h3 {
			font-size: 1.5em;
			margin-top: 0em;
			}
			}
	
	h3:nth-child(n+2) {
		margin-top: 1em;
		}
	

h4 {
	margin-bottom: .75em;
	font-size: 0.95em;
	line-height: 1.1em;
	}
	@media (min-width: 480px) {
		h4 {		
			font-size: 1.1em;
			}
			}
	
	p + h4 {
		margin-top: 1em;
		}


/* .........  C O N T E N T ..........*/


p, ul, li {
	font-size: .9em; /* Don't change this, that was a bad call, but it will be a mess to fix. See template.css under "ALL(ish)" */
	margin-top: 0px;
	margin-bottom: 0.5em;
	line-height: 1.3em;
	clear: left;
	color: #64635e;
	}
	@media (min-width: 480px) {
		p, ul, li {
		font-size: 1em;	
		}
		}

sup,
sub {
	font-size: .5em;
	line-height: 1.1em;
	}
	

/* Strong */


strong {
	color: black;
	letter-spacing: -0.04em;
	}

.Reverse strong {
	color: white;
	}







/* ......... P A R A G R A P H   O V E R R I D E S ...............*/


[class*='Template'] p.Note,
[class*='Template'] span.Note,
p.Note,
span.Note {
	font-size: .8em;
	}


/* ......... P O S I T I O N   O V E R R I D E S ...............*/


[class*='Template'] .Center,
[class*='Template'] .Center > *:not(div),
.Center,
.Center > *:not(div)
	{
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	}
	
.Rag,
p.Intro.Rag,
[class*='Template'] .Rag,
[class*='Template'] .Rag > *:not(div),
[class*='Template'] > p.Rag:first-child,
[class*='Template'] > h1 + p.Rag,
[class*='Template'] > h2 + p.Rag,
.TemplateHead h1 + p.Rag
[class*='Template'] > h2.Rag,
[class*='Template'] > h3.Rag, 
[class*='Template'] > p.Rag {
	text-align: left;
	padding-left: 0;
	}