/* RESET */
/* ----------------------------------------- */

/* Global reset */
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ul { list-style:none }
caption, th { text-align:left }
/*h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal }*/
q:before, q:after { content:''}

/* Global reset-RESET */
/* The below restores some sensible defaults */
strong { font-weight:bold }
em { font-style:italic }
a img { border:none } /* Gets rid of IE's blue borders */
@charset "UTF-8";

/* =============================================================================
   General
   ========================================================================== */

::selection {
	background: #77be70; /* Safari */
	}
::-moz-selection {
	background: #77be70; /* Firefox */
}

html {
	background: #ee3c2b;
	-webkit-font-smoothing:	antialiased;
}

body {
	font: 1em/1.5 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
	color: #311d09;
}

img {
	width: 100%;
	border: 0;
	-ms-interpolation-mode: bicubic;
}

.spacer {
	display: block;
	height: 10px;
}

@media screen and (max-width: 960px) {
	body {
		min-width: 100%;
		font-size: 1em;
		line-height: 1.5;
		-webkit-text-size-adjust: none;
	}
	img {
		max-width: 100%;
		height: auto;
		margin: auto;
	}
}

@media screen and (max-width: 760px) {
	body {
		min-width: 100%;
		font-size: 0.900em;
	}
}

@media screen and (max-width: 550px) {
	body {
		min-width: 100%;
		font-size: 0.800em;
	}
	img {
		max-width: 100%;
	}
}

/* =============================================================================
   Fonts
   ========================================================================== */

h1, h2, h3, h4, h5 { 
	line-height: 1em;
	font-weight: 400;
	color: #000;
	text-align: center;
	text-transform: uppercase;
}

h1 { 
	font-size: 1.850em;
	font-family: SinzanoDisplaySansRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#open-page h1 { 
	font-size: 2.750em;
	font-family: SinzanoDisplaySans-Ligatures, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-shadow: 1px 2px 0 #ee3c2b, 3px 5px 0 #d73527;
}

h2 { 
	font-size: 1.5em;
	font-family: SinzanoDisplaySans-Ligatures , "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.diary-content h3 { 
	font-size: 2.250em;
	font-family: Sinzano-Regular, "Helvetica Neue", Helvetica, Arial, sans-serif;
	margin-bottom: 14px;
	text-align: left;
}

.diary-content h4 { 
	font-size: 1.250em;
	font-family: SinzanoDisplaySansRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
	margin: 9px 0 0 0;
	text-align: left;
}

h4.diary-right { 
	margin-left: 14px;
}

p {
	margin-top: 20px;
	/*font-size: 1.250em;*/
	text-align: center;
}

.diary-content p {
	text-align: left;
	font-size: 0.900em;
	margin-top: 12px;
}

p a {
	font-weight: 600;
	color:#ee3c2b;
	text-decoration:none;
	border-bottom: 1px dotted #d42066;
	/* Transition */
	transition: color .3s ease-in-out;
	-o-transition: color .3s ease-in-out;
	-ms-transition: color .3s ease-in-out;
	-moz-transition: color .3s ease-in-out;
	-webkit-transition: color .3s ease-in-out;
}

p a:focus, p a:hover {
  color: #000000;
	border-bottom: 1px dotted #000000;
	cursor:pointer;
}

#scene-footer a {
  color: #ee3c2b;
  cursor: pointer;
  text-decoration: none;
	/* Transition */
	-webkit-transition: 0.3s color;
  -moz-transition: 0.3s color;
  -ms-transition: 0.3s color;
  -o-transition: 0.3s color;
	transition: 0.3s color;
}

#scene-footer a:focus, #scene-footer a:hover {
  color: #000000;
}

@media screen and (max-width: 550px) {
	.diary-content h4 { 
		font-size: 1.500em;
	}
	.details-left h4 {
		margin-top: 10px;
	}
	.details-right h4 {
		margin-top: 12px;
	}
	h4.diary-right { 
		margin-left: 0;
	}
	.diary-content p {
		font-size: 1em;
	}
}

/* =============================================================================
   Buttons
   ========================================================================== */

a.btn {
	font: 1.250em SinzanoDisplaySans-Ligatures, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-align: center;
	font-weight: 400;
	color: #fff5da;
	text-transform: uppercase;
	text-decoration: none;
	padding: 8px 20px 9px 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	border-radius: 8px;
	/* Transition */
	-webkit-transition: All 0.3s ease;
	-moz-transition: All 0.3s ease;
	-ms-transition: All 0.3s ease;
	-o-transition: All 0.3s ease;
	transition: All 0.3s ease;
}

/* Generic Button */
a.btn {
	background-color: #fbf3dc;
}
a.btn:hover {
	background-color: #ffdd3f;
}
a.btn:active {
	background-color: #f7e8be;
}

/* Button - Facebook */
.facebook-button {
	margin: 30px auto 15px;
	text-align: center;
}
a.btn.facebook {
	background-color: #395d95;
}
a.btn.facebook:hover {
	background-color: #284168;
}
a.btn.facebook:active {
	background-color: #4c3928;
}

/* Button - Diary */
.diary-buttons {
	margin: 30px auto 25px;
	text-align: center;
	clear: both;
}

a.btn-diary {
	font: 1.250em SinzanoDisplaySans-Ligatures, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-align: center;
	font-weight: 400;
	color: #fff5da;
	text-transform: uppercase;
	text-decoration: none;
	padding: 8px 20px 9px 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	/* Transition */
	-webkit-transition: All 0.3s ease;
	-moz-transition: All 0.3s ease;
	-ms-transition: All 0.3s ease;
	-o-transition: All 0.3s ease;
	transition: All 0.3s ease;
}
a.btn-diary.regular {
	background-color: #ed3c2c;
	border-radius: 8px 0 0 8px;
	-moz-border-radius: 8px 0 0 8px; 
	-webkit-border-radius: 8px 0 0 8px;
}
a.btn-diary.regular:hover {
	background-color: #c1120d;
}
a.btn-diary.regular:active {
	background-color: #4c3928;
}
a.btn-diary.special {
	background-color: #72a82e;
	border-radius: 0 8px 8px 0;
	-moz-border-radius: 0 8px 8px 0; 
	-webkit-border-radius: 0 8px 8px 0;
}
a.btn-diary.special:hover {
	background-color: #318321;
}
a.btn-diary.special:active {
	background-color: #4c3928;
}

@media screen and (max-width: 980px) {
	a.btn {
		font-size: 0.850em;
	}
}

@media screen and (max-width: 550px) {
	a.btn {
		font-size: 1em;
		font-weight: 700;
		padding: 16px 40px 15px 40px;
		width: 100%;
	}
	a.btn-diary {
		padding: 8px 16px 9px 16px;
	}
}

/* =============================================================================
   Spritely Code
   ========================================================================== */

#scene-container  {
	/*min-width:900px;*/
	/*padding-top:359px;*/
	position:relative;
	width:100%;
	padding-top: 40px;
}
#scene-background {
	position:relative;
	width: 100%;
	height: 620px;
	z-index: 1000;
}
.scene-background {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	/*min-width: 900px;*/
	height: 100%;
	overflow: hidden;
}
#clouds-01 {
	background: transparent url("../../assets/img/universal/bg-scene-clouds-01.png") 300px 0 repeat-x;
}
#clouds-02 {
	background: transparent url("../../assets/img/universal/bg-scene-clouds-02.png") 300px 0 repeat-x;
}
#clouds {
	background: transparent url("../../assets/img/universal/bg-scene-cloud.png") 0 214px repeat-x;
}
#water {
	background: url("../../assets/img/universal/bg-scene-water.gif") 0 280px repeat-x;
}
#sand {
	background: url("../../assets/img/universal/bg-scene-sand.png") center 340px repeat-x;
}

@media screen and (max-width: 768px) {
	#scene-background {
		position:relative;
		width: 100%;
		/*height: 850px; HOME PAGE */
		height: 400px;
		z-index: 1000;
	}
}

/* =============================================================================
   New Scene Code
   ========================================================================== */

#scene-midground {
	position: absolute;
	top: 50px;
    z-index: 2000;
    width: 100%;
    height: auto;
    /*background: #000;*/
    overflow: hidden;
}

#scene-midground-island {
	position: absolute;
	top: 248px;
    z-index: 2500;
    width: 100%;
    height: 350px;
    background: transparent url('../../assets/img/universal/bg-scene-island.png') center top no-repeat;
    background-size: 1550px 101px;
}




#scene-newsletter {
	position: absolute;
	top: 0;
    z-index: 3000;
    width: 100%;
    height: auto;
    text-align: center;
}
#scene-newsletter-inner {
	margin: 20px auto 6px;
	width: 260px;
	height: 200px;
	/*background: #aaa;*/
}
#scene-newsletter-divider {
	margin: 0 auto;
	width: 100%;
	height: 68px;
}

@media screen and (max-width: 768px) {
	#scene-newsletter-inner {
		width: 90%;
	}
}




#scene-foreground {
	position: absolute;
	top: 50px;
    z-index: 3000;
    width: 100%;
    height: auto;
    /*background: #000;*/
    overflow: hidden;
}

#scene-parchment-footer {
	position: absolute;
	top: 0;
    z-index: 3000;
    width: 100%;
    height: 420px;
    /*background: transparent url('../../assets/img/universal/parchment-bottom.png') center top no-repeat;*/
}

.scene-foreground {
	margin: 40px auto 0;
	max-width: 960px;
}

/*---------- TIKI GUY / GIRL ----------*/
#tiki-girl {
	float: left;
	background: transparent url('../../assets/img/universal/bg-scene-tiki-girl.png') 0 0 no-repeat;
	width: 316px;
	height: 380px;
}
#tiki-guy {
	margin-right: 40px;
	float: right;
	background: transparent url('../../assets/img/universal/bg-scene-tiki-guy.png') 0 0 no-repeat;
	width: 182px;
	height: 388px;
}

/*---------- SHADOW ----------*/
#scene-foreground-shadow {
	position: absolute;
	top: 50px;
    z-index: 2000;
    width: 100%;
    height: auto;
    overflow: hidden;
}
.scene-foreground-shadow {
	margin: 400px auto 0;
	max-width: 960px;
}
#tiki-girl-shadow {
	float: left;
	margin-left: 50px;
	background: url("../../assets/img/universal/bg-scene-shadow-01.png") 0 0 no-repeat;
	width: 214px;
	height: 34px;
}
#tiki-guy-shadow {
	float: right;
	background: url("../../assets/img/universal/bg-scene-shadow-02.png") 0 0 no-repeat;
	width: 200px;
	height: 34px;
}

/*---------- FLAMES ----------*/
#widthincrease-flame-outer {
    min-width: 960px;
    /*overflow-x: hidden;*/
    overflow: hidden;
}

#widthincrease-flame-container {
	/*background: gray; ACTIVATE COLOUR FOR TESTING */
    width: 960px;
    margin: 0px auto;
    height: 470px;    
}

.widthincrease-flame-row {
	/*background: blue; ACTIVATE COLOUR FOR TESTING */
    width: 1240px;
    margin-left: -140px;
}

.widthincrease-flame-inner {
	position:relative;
    /*background: yellow; ACTIVATE COLOUR FOR TESTING */
    margin-left: 140px;
    width: 960px;
    height: 100px;
}

.scene-flame {
	position: absolute;
	top: 0;
	overflow: hidden;
}

#flame-l {
	background: transparent url('../../assets/img/universal/bg-scene-flame-l.png') no-repeat;
	top: 23px;
	left: -69px;
	width: 66px;
	height: 152px;
	/*z-index: 2000;*/
	float: left;
}
#torch-l {
	background: transparent url('../../assets/img/universal/bg-scene-torch-l-shadow.png') 0 0 no-repeat;
	background-size: 115px 303px;
	top: 160px;
	left: -60px;
	width: 115px;
	height: 303px;
	/*z-index: 2000;*/
	float: left;
}
#flame-r {
	background: transparent url('../../assets/img/universal/bg-scene-flame-l.png') 0 0 no-repeat;
	top: 23px;
	right: -78px;
	width: 66px;
	height: 152px;
	/*z-index: 2000;*/
	float: right;
}
#torch-r {
	background: transparent url('../../assets/img/universal/bg-scene-torch-r-shadow.png') 0 0 no-repeat;
	background-size: 100px 303px;
	top: 160px;
	right: -120px;
	width: 100px;
	height: 303px;
	/*z-index: 2000;*/
	float: right;
}

/*---------- FOOTER ----------*/
#scene-footer {
	position: absolute;
	top: 510px;
    z-index: 4000;
    width: 100%;
    height: auto;
}
#footer {
	margin: 10px auto;
	max-width: 900px;
	width: 100%;
	min-height: 84px;
  	background: transparent url('../../assets/img/universal/footer-icon.png') top center no-repeat;
	background-size: 84px 84px;
}
#footer-level-01 {
	padding-top: 8px;
	height: 28px;
	/*background: #eee;*/
}
#footer-level-02 {
	height: 14px;
	/*background: #ddd;*/
}
#footer-level-03 {
	height: 28px;
	/*background: #ccc;*/
}
.footer-facebook {
	float: right;
	margin: 4px 0 0 5px;
	max-width: 16px;
}
.footer-instagram {
	float: left;
	margin: 4px 5px 0 0;
	max-width: 16px;
}
.contact-social-links {
	float: inherit;
	margin: 0 10px 0 0;
	max-width: 32px;
}
img.contact-social-links {
	vertical-align: middle;
  }

/*---------- FOOTER - COLUMNS ----------*/
#footer .column-left {
	height: 10px;
	float: left;
	width: 44%;
	text-align: right;
}
#footer #footer-level-02 .column-left {
	background: url('../../assets/img/universal/footer-pattern-l.png') repeat-x right 5px;
	background-size: 8px 4px;
}
#footer .column-centre {
	height: 10px;
	float: left;
	width: 12%;
	text-align: center;
}
#footer .column-right {
	height: 10px;
	float: left;
	width: 44%;
	text-align: left;
}
#footer #footer-level-02 .column-right {
	background: url('../../assets/img/universal/footer-pattern-r.png') repeat-x left 6px;
	background-size: 8px 4px;
}

/*---------- FOOTER - LARGE TEXT ----------*/
#footer .lge-text ul li {
	display: inline;
	padding: 0 2px 0 14px;
 	border-left: 0;
 	list-style: none;
 	font-size: 1.100em;
	font-family:SinzanoDisplaySansRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
 	color: #451512;
}
#footer .lge-text li {
	background: url('../../assets/img/universal/footer-star.png') no-repeat 0 5px;
	background-size: 8px 8px;
}
#footer .lge-text li:first-child {
	background: none;
}
#footer .column-right .lge-text li:first-child {
	padding-left: 0;
}
#footer .column-left .lge-text li:last-child {
	padding-right: 0;
}

/*---------- FOOTER - SMALL TEXT ----------*/
#footer .sml-text ul li {
	display: inline;
	padding: 0 6px 0 10px;
 	border-left: 1px solid #937214;
 	list-style: none;
	font-size: 0.700em;
 	color: #451512;
}
#footer .sml-text ul li:first-child {
	border-left: 0;
}
#footer .column-right .sml-text ul li:first-child {
	border-left: 0;
	padding-left: 0;
}
#footer .column-left .sml-text ul li:last-child {
	padding-right: 0;
}

/*---------- FOOTER - NOTICE ----------*/
#notice {
	clear: both;
	margin: 0 auto;
	padding: 10px 0;
	max-width: 768px;
	text-align: center;
}
#notice ul li {
	display: inline;
	padding: 0 8px;
 	list-style: none;
}
#notice p,
#notice li {
	margin: 0;
	font-size: 0.700em;
	line-height: 1.650em;
	color: #937214;
}

@media screen and (max-width: 960px) {
	/*#scene-midground {
		display: none;
	}*/
	#torch-l {
		display: none
	}
	.scene-foreground,
	.scene-foreground-shadow {
		width: 95%;
	}
	#footer {
		width: 90%;
	}
	#footer .column-left {
		width: 43%;
	}
	#footer .column-centre {
		width: 14%;
	}
	#footer .column-right {
		width: 43%;
	}
	#footer .column-left .lge-text ul li:last-child {
		display: none;
	}
	#footer .column-right .lge-text ul li:last-child {
		display: none;
	}
	#footer .column-left .sml-text ul li:last-child {
		display: none;
	}
	#footer .column-right .sml-text ul li:first-child {
		display: none;
	}
	#footer .sml-text ul li {
		padding: 0;
		border: none;
		line-height: 5px;
	}
}
	#scene-background,
	#scene-midground,
	#scene-foreground,
	#scene-foreground-shadow,
	#scene-midground-island,
	#scene-footer {
		/*padding-top:50px; HOME PAGE*/
		padding-top:40px;
	}

@media screen and (max-width: 768px) {
	#scene-container {
		/*padding-top:50px; HOME PAGE*/
		padding-top:340px;
	}
	/*#clouds-01,
	#clouds-02 {
		display: none;
	}*/
	#scene-background,
	#scene-midground,
	#scene-foreground,
	#scene-foreground-shadow,
	#scene-midground-island,
	#scene-footer {
		/*padding-top:50px; HOME PAGE*/
		padding-top:280px;
	}
	/*a.btn {
		width: 90%;
	}*/
	#footer .column-left,
	#footer .column-centre,
	#footer .column-right {
		width: 100%;
		text-align: center;
	}
	#footer-level-01 {
		padding: 100px 0 35px;
	}
	#footer-level-02 {
		display: none;
	}
	#footer-level-03 {
		margin: 0;
	}
	#footer .column-right .sml-text {
		display: none;
	}
	#footer .lge-text ul li {
		font-size: 1.100em;
	}
	#footer .lge-text li {
		background-position: 0 5px;
	}
	#notice {
		padding: 0;
		width: 90%;
		height: auto;
	}
	#notice ul li {
		display: block;
	}
}

@media screen and (max-width: 550px) {
	#footer .lge-text ul li {
		font-size: 1.500em;
	}
	#footer .lge-text li {
		background-position: 0 5px;
	}
}

/*---------- ODD SIZE TO REMOVE TIKI GUY (AS HE HAS EXTRA WIDTH) ----------*/
@media screen and (max-width: 600px) {
	#tiki-girl {
		float: none;
		margin: 0 auto;
	}
	#tiki-girl-shadow {
		float: none;
		margin: 0 auto;
	}
	#tiki-guy,
	#tiki-guy-shadow {
		display: none;
	}
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	#flame-l {
		background-image: url('../../assets/img/universal/bg-scene-flame-l@2x.png');
		background-size: 1584px 152px;
	}
	#flame-r {
		background-image: url('../../assets/img/universal/bg-scene-flame-r@2x.png');
		background-size: 1584px 152px;
	}
	#tiki-girl {
		background-image: url('../../assets/img/universal/bg-scene-tiki-girl@2x.png');
		background-size: 12640px 380px;
	}
	#tiki-guy {
		background-image: url('../../assets/img/universal/bg-scene-tiki-guy@2x.png');
		background-size: 10920px 388px;
	}
	#clouds {
		background-image: url('../../assets/img/universal/bg-scene-cloud@2x.png');
		background-size: 570px 66px;
	}
	#clouds-01 {
		background-image: url('../../assets/img/universal/bg-scene-clouds-01@2x.png');
		background-size: 1440px 170px;
	}
	#clouds-02 {
		background-image: url('../../assets/img/universal/bg-scene-clouds-02@2x.png');
		background-size: 1440px 170px;
	}
	#tiki-girl-shadow {
		background: url("../../assets/img/universal/bg-scene-shadow-01@2x.png") 0 0 no-repeat;
		background-size: 214px 34px;
	}
	#tiki-guy-shadow {
		background: url("../../assets/img/universal/bg-scene-shadow-02@2x.png") 0 0 no-repeat;
		background-size: 200px 34px;
	}
	#footer .lge-text li {
		background: url('../../assets/img/universal/footer-star@2x.png') no-repeat 0 5px;
		background-size: 8px 8px;
	}
}

/* =============================================================================
   Form
   ========================================================================== */
	 
/* Form Fields */
form input,
form textarea {
	font: 1.100em/1 SinzanoDisplaySansRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-align: center;
	width: 90%;
	color: #fff5da;
	background: #4c3928;
	border: 3px solid #4c3928;
	border-radius: 4px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 6px 8px;
	margin-bottom: 4px;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
	-webkit-appearance: none;
}
form input:focus,
form textarea:focus {
	border-color: #4c3928;
	outline: none;
}
/* Button */
form input.btn {
	border: none;
	cursor: pointer;
	padding: 8px 20px 8px 20px;
	width: 50%;
	text-align: center;
	font: 1.250em SinzanoDisplaySansRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #fff5da;
	text-transform: uppercase;
	text-decoration: none;
	background: #ed3c2c;
}
form input.btn:hover {
	background: #b22d21;
}
/* General Form Markup */
input,
textarea,
select {
	font-size: 1.250em;
	border: 1px solid;
	padding: 6px 5px;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 3px;
	-webkit-appearance: none;
	vertical-align: middle;
}
select {
	padding: 3px;
}
label,input[type="button"],
input[type="submit"],
input[type="image"],
button {
	cursor: pointer;
}

@media screen and (max-width: 760px) {
	form input,
	form textarea {
		width: 80%;
		font-size: 1.250em;
	}
	form input.btn {
		width: 40%;
		margin-top: 3px;
	}
}


/* =============================================================================
   DIVIDER
   ========================================================================== */

.divider {
	width: 100%;
	background: url('../../assets/img/universal/divider-bg.png') repeat-x center;
}
.divider-img {
	margin: 0 auto;
	max-width: 225px;
	height: 68px;
	padding-top: 14px;
	text-align: center;
	background: url('../../assets/img/universal/divider-img01.png') no-repeat 0 12px;
}
.divider-title {
	margin: 0 auto;
	height: 68px;
	width: 450px;
}
.divider-title-left {
	float: left;
	width: 111px;
	height: 68px;
	background: url('../../assets/img/universal/divider-img02-left.png') no-repeat 0 9px;
}
.divider-title-centre {
	text-align: center;
	float: left;
	width: 228px;
	height: 50px;
	background: #fff5da;
}
.divider-title-centre h2 {
	font-size: 1.800em;
	font-family: SinzanoDisplaySans-Ligatures, "Helvetica Neue", Helvetica, Arial, sans-serif; 
	margin-top: 18px;
}
.divider-title-right {
	float: left;
	width: 111px;
	height: 68px;
	background: url('../../assets/img/universal/divider-img02-right.png') no-repeat 0 9px;
}

@media screen and (max-width: 550px) {
	.divider-title {
		width: 300px;
	}
	.divider-title-left {
		width: 71px;
		background: url('../../assets/img/universal/divider-img02-left-sml.png') no-repeat 0 9px;
	}
	.divider-title-centre {
		width: 158px;
	}
	.divider-title-centre h2 {
		font-size: 2.250em;
		margin-top: 6px;
	}
	.divider-title-right {
		width: 71px;
		background: url('../../assets/img/universal/divider-img02-right-sml.png') no-repeat 0 9px;
	}
}

@media screen and (max-width: 400px) {
	.divider-title {
		width: 230px;
	}
	.divider-title-left {
		width: 50px;
		background: url('../../assets/img/universal/divider-img02-left-smlr.png') no-repeat 0 9px;
	}
	.divider-title-centre {
		width: 130px;
	}
	.divider-title-centre h2 {
		font-size: 2.250em;
		margin-top: 6px;
	}
	.divider-title-right {
		width: 50px;
		background: url('../../assets/img/universal/divider-img02-right-smlr.png') no-repeat 0 9px;
	}
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.divider {
		background: url('../../assets/img/universal/divider-bg@2x.png') repeat-x center;
		background-size: 63px 20px;
	}
	.divider-img {
		background: url('../../assets/img/universal/divider-img01@2x.png') no-repeat 0 12px;
		background-size: 225px 68px;
	}
	.divider-title-left {
		background: url('../../assets/img/universal/divider-img02-left@2x.png') no-repeat 0 9px;
		background-size: 111px 50px;
	}
	.divider-title-right {
		background: url('../../assets/img/universal/divider-img02-right@2x.png') no-repeat 0 9px;
		background-size: 111px 50px;
	}
}

@media screen and (max-width: 550px) and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.divider-title-left {
		background: url('../../assets/img/universal/divider-img02-left-sml@2x.png') no-repeat 0 9px;
		background-size: 71px 50px;
	}
	.divider-title-right {
		background: url('../../assets/img/universal/divider-img02-right-sml@2x.png') no-repeat 0 9px;
		background-size: 71px 50px;
	}
}

@media screen and (max-width: 400px) and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.divider-title-left {
		background: url('../../assets/img/universal/divider-img02-left-smlr@2x.png') no-repeat 0 9px;
		background-size: 50px 50px;
	}
	.divider-title-right {
		background: url('../../assets/img/universal/divider-img02-right-smlr@2x.png') no-repeat 0 9px;
		background-size: 50px 50px;
	}
}

/* =============================================================================
   Content Area
   ========================================================================== */

.content-container {
	margin: 0 auto;
	max-width: 960px;
	height: auto !important;
	/*background: #fff;*/
}

.content-container-inner {
	position: relative;
	margin: 0 auto;
	/*padding: 0 57px;*/
	height: auto;
	max-width: 914px; /* 800px */	
	border-left: 3px solid #000;
	border-right: 3px solid #000;
	background: #fff5da;
}
.content-content-area {
	margin: 0 auto;
	max-width: 800px;
	/*background: #7b22c5;*/
}

.content-cnr-left {
	position: absolute;
	top: 0;
	left: -23px;
	width: 55px;
	height: 300px;
	background: url('../../assets/img/header/header-content-left.png') no-repeat;
}
.content-cnr-right {
	position: absolute;
	top: 0;
	right: -23px;
	width: 55px;
	height: 300px;
	background: url('../../assets/img/header/header-content-right.png') no-repeat;
}

@media screen and (max-width: 960px) {
	.content-container {
		max-width: none;
    	width: 100%;
	}
	.content-container-inner {
		max-width: none;
		width: 100%;
		border-left: none;
		border-right: none;
	}
	.content-content-area {
		width: 90%;
		/*max-width: none;*/
	}
	.content-cnr-left,
	.content-cnr-right {
		display: none;
	}
	/*.content-constrain {
		margin: 0 auto;
		width: 90%;
	}*/
}

@media screen and (max-width: 760px) {
	.content-content-area {
		width: 100%;
	}
	.content-constrain {
		margin: 0 auto;
		width: 90%;
	}
	.content-constrain-diary {
		margin: 0 auto;
		width: 90%;
	}
}
@media screen and (max-width: 550px) {
	.content-container-inner {
		width: 100%;
	}
	.content-constrain-diary {
		width: 100%;
	}
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.content-cnr-left {
		background: url('../../assets/img/header/header-content-left@2x.png') no-repeat;
		background-size: 55px 320px;
	}
	.content-cnr-right {
		background: url('../../assets/img/header/header-content-right@2x.png') no-repeat;
		background-size: 55px 320px;
	}
}

/* =============================================================================
   Borders
   ========================================================================== */
	 
.border-yellow-t {
    background: url('../img/frame/yellow-t.png') repeat-x;
    position:absolute;
    top:-12px; left:0;
    width:100%;
    height:12px;
}
.border-yellow-b {
    background: url('../img/frame/yellow-b.png') repeat-x;
    position:absolute;
    bottom:-12px; left:0;
    width:100%;
    height:12px;
}
.border-yellow-l {
    background: url('../img/frame/yellow-l.png') repeat-y;
    position:absolute;
    top:0; left:-12px;
    width:12px;
    height:100%;
}
.border-yellow-r {
    background: url('../img/frame/yellow-r.png') repeat-y;
    position:absolute;
    top:0; right:-12px;
    width:12px;
    height:100%;
}
.border-yellow-br {
    background: url('../img/frame/yellow-br.png');
    position:absolute;
    bottom:-20px; right:-20px;
    width:20px;
    height:20px;
}
.border-yellow-bl {
    background: url('../img/frame/yellow-bl.png');
    position:absolute;
    bottom:-20px; left:-20px;
    width:20px;
    height:20px;
}
.border-yellow-tr {
    background: url('../img/frame/yellow-tr.png');
    position:absolute;
    top:-20px; right:-20px;
    width:20px;
    height:20px;
}
.border-yellow-tl {
    background: url('../img/frame/yellow-tl.png');
    position:absolute;
    top:-20px; left:-20px;
    width:20px;
    height:20px;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.border-yellow-t {
    background: url('../img/frame/yellow-t@2x.png') repeat-x;
		background-size: 120px 12px;
}
.border-yellow-b {
    background: url('../img/frame/yellow-b@2x.png') repeat-x;
		background-size: 120px 12px;
}
.border-yellow-l {
    background: url('../img/frame/yellow-l@2x.png') repeat-y;
		background-size: 12px 60px;
}
.border-yellow-r {
    background: url('../img/frame/yellow-r@2x.png') repeat-y;
		background-size: 12px 60px;
}
.border-yellow-br {
    background: url('../img/frame/yellow-br@2x.png');
		background-size: 20px 20px;
}
.border-yellow-bl {
    background: url('../img/frame/yellow-bl@2x.png');
		background-size: 20px 20px;
}
.border-yellow-tr {
    background: url('../img/frame/yellow-tr@2x.png');
		background-size: 20px 20px;
}
.border-yellow-tl {
    background: url('../img/frame/yellow-tl@2x.png');
		background-size: 20px 20px;
}
}



/* =============================================================================
   Contact
   ========================================================================== */
	 
#map-canvas-container {
		position: relative;
    margin: 40px auto;
    padding: 0;
    width:100%;
		height: 300px;
		background: #eae6dd;
}
#map-canvas {
	width: 100%;
	height: 300px;
}

@media screen and (max-width: 550px) {
	#map-canvas-container {
		width: 90%;
		background: none;
		/*width: 160px;*/
	}
}





/* =============================================================================
   Responsive Grid
   ========================================================================== */

article {
  clear: both;
  display: block;
  zoom: 1;
}

article:after {
  content: "";
  clear: both;
  display: block;
}

.col-contact-55 {
	float: left;
	width: 50%;
	margin-right: 2.5%;
}

.col-contact-45 {
	position: relative;
	float: right;
	width: 47.5%;
}

/* Menu Page Columns */
.col-menu-image-left {
	float: left;
	width: 30%;
	text-align: center;
}

.col-menu-content-left {
	float: left;
	width: 66%;
	margin-right: 4%;
}

.col-menu-image-right {
	float: right;
	width: 30%;
	text-align: center;
}

.col-menu-content-right {
	float: right;
	width: 66%;
	margin-left: 4%;
}

.generic {
	padding: 20px 0 30px;
	height: auto;
}

article p {
	text-align: left;
}
article h2 {
	text-align: left;
  font-size: 1.750em;
}
article ul {
	margin-top: 20px;
}


article ul span {
	position: absolute;
	left: 0;
	padding-left: 36%;
}

@media only screen and (max-width: 550px) {
	article ul span {
		padding-left: 50%;
	}
}


@media screen and (max-width: 768px) {
	.col-contact-55 {
		width: 100%;
		margin-right: 0;
		padding-bottom: 30px;
		text-align: left;
	}
	.col-contact-45 {
		width: 100%;
	}
	.col-menu-image-left,
	.col-menu-image-right {
		width: 100%;
	}
	.col-menu-content-left,
	.col-menu-content-right {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	article p,
	article h2 {
		text-align: center;
	}
}




/* =============================================================================
   Menu
   ========================================================================== */

/* OPTION #1 CODE FROM http://css-tricks.com/fade-image-within-sprite/ */
.download-menu-container {
	margin: 20px auto;
	width:240px;
}
.download-menu {
	display: inline-block;
	position: relative;
	/*text-indent: -9999px;*/
	width: 240px;
	height: 205px;
	background: url('../img/menu/button.png') no-repeat top;
	text-decoration: none;
}
.download-menu span {
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	background: url('../img/menu/button.png') no-repeat;
	background-position: 0 -205px;
	opacity: 0;
	-webkit-transition: opacity 0.3s;
	-moz-transition:    opacity 0.3s;
	-o-transition:      opacity 0.3s;
}
.download-menu:hover span {
	opacity: 1;
}
.download-menu h2 {
	font-size: 28px;
	text-align: center;
	margin-top: 128px;
	text-decoration: none;
	border: none;
}

/* Images */
img.menu-cocktails {
	max-width: 225px;
	max-height: 202px;
}
img.menu-rhum {
	max-width: 220px;
	max-height: 182px;
	margin: 30px auto 0;
}
img.menu-beer {
	max-width: 225px;
	max-height: 202px;
}
img.menu-functions {
	max-width: 220px;
	max-height: 150px;
}

@media screen and (max-width: 768px) {
	/* Images */
	img.menu-cocktails,
	img.menu-rhum,
	img.menu-beer,
	img.menu-functions {
		margin-top: 0;
		padding-bottom: 20px;
	}
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.download-menu {
		background: url('../img/menu/button@2x.png') no-repeat top;
		background-size: 240px 410px;
	}
	.download-menu span {
		background: url('../img/menu/button@2x.png') no-repeat;
		background-size: 240px 410px;
		background-position: 0 -410px;
	}
}

/* =============================================================================
   FAQ
   ========================================================================== */

#faq {
    overflow: hidden;
    margin: 10px 0 0 0;
}

#faq p {
	text-align: left;
	margin: 0 0 20px 0;
	}

#faq #question {
    margin: 0 0 0 0;
}

#faq-left,
#faq-right {
	margin-top: 8px;
}

#faq #question #faq-left, #faq #answer #faq-left {
    width: 40px;
    font-family: SinzanoDisplaySansRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #000;
		font-size: 1.900em;
		line-height: 1em;
}

#faq #answer #faq-left {
    color: #311d09;
}

#faq #question #faq-right {
    float: left;
    font-family: SinzanoDisplaySansRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #000;
    font-size: 1.900em;
		line-height: 1em;
    width: 92%;
    padding: 0 0 0 1.5%;
}

#faq #answer #faq-right {
    float: left;
    width: 92%;
    padding: 0 0 0 1.5%;
}

.clear {
    clear: both;
}

#faq-left {
    float: left;
}

#faq-right {
    float: right;
}

@media screen and (max-width: 650px) {
    #faq #question #faq-left, #faq #answer #faq-left {
        display: none;
    }

    #faq {
        text-align: center;
    }
		#faq p {
			text-align: center;
			}
    #faq #question #faq-right {
				 width: 100%;
				 padding: 0;
    }
		#faq #answer #faq-right {
				width: 100%;
				padding: 0;
		}
}

















/* =============================================================================
   Header - New
   ========================================================================== */
.parchment-header-container {
	position: relative;
	margin: 0 auto;
	max-width: 960px;
	height: 80px;
}

.parchment-header-inner {
	margin: 0 auto;
	padding-top: 40px;
	height: 40px;
	max-width: 914px;
	border-left: 3px solid #000;
	border-right: 3px solid #000;
}
.parchment-header-inner-bg {
	width: 100%;
	height: 40px;
	background: #fff5da;
}

.parchment-header-overlay {
	position: absolute;
	top: 0;
	Left: 0;
	width: 100%;
}

.parchmennt-header-left {
	float: left;
	height: 80px;
	width: 142px;
	background: url('../img/universal/parchment-top-left.png') no-repeat;
}
.parchmennt-header-center {
	float: left;
	height: 80px;
	width: 676px;
	background: url('../img/universal/parchment-top-repeat.png') repeat center;
}
.parchmennt-header-right {
	float: right;
	height: 80px;
	width: 142px;
	background: url('../img/universal/parchment-top-right.png') no-repeat;
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.parchmennt-header-left {
		background: url('../img/universal/parchment-top-left@2x.png') no-repeat;
		background-size: 142px 80px;
	}
	.parchmennt-header-center {
		background: url('../img/universal/parchment-top-repeat@2x.png') repeat center;
		background-size: 676px 80px;
	}
	.parchmennt-header-right {
		background: url('../img/universal/parchment-top-right@2x.png') no-repeat;
		background-size: 142px 80px;
	}
}


/* =============================================================================
   Footer - New
   ========================================================================== */
.parchment-footer-container {
	position: relative;
	margin: 0 auto;
	max-width: 960px;
	height: 440px;
}

.parchment-footer-inner {
	margin: 0 auto;
	/*padding: 0 57px;*/
	height: 380px;
	max-width: 914px; /* 800px */	
	border-left: 3px solid #000;
	border-right: 3px solid #000;
}
.parchment-footer-inner-bg {
	width: 100%;
	height: 380px;
	background: #fff5da;
}

.parchment-footer-overlay {
	position: absolute;
	top: 0;
	Left: 0;
	width: 100%;
}

.parchmennt-footer-left {
	float: left;
	height: 440px;
	width: 142px;
	background: url('../img/universal/parchment-bottom-left.png') no-repeat;
}
.parchmennt-footer-center {
	float: left;
	height: 440px;
	width: 676px;
	background: url('../img/universal/parchment-bottom-repeat.png') repeat center;
}
.parchmennt-footer-right {
	float: right;
	height: 440px;
	width: 142px;
	background: url('../img/universal/parchment-bottom-right.png') no-repeat;
}





/* =============================================================================
   Newsletter
   ========================================================================== */

#newsletter-border-top {
	position: relative;
	height: 60px;
	background: url('../img/newsletter/bamboo-top.png') repeat-x center;
}
#newsletter-border-top .bamboo-l,
#newsletter-border-bottom .bamboo-l {
	position: absolute;
	left: 0;
	width: 10px;
	height: inherit;
	background: url('../img/newsletter/bamboo-left.png') no-repeat center;
}
#newsletter-border-top .bamboo-r,
#newsletter-border-bottom .bamboo-r {
	position: absolute;
	right: 0;
	width: 10px;
	height: inherit;
	background: url('../img/newsletter/bamboo-right.png') no-repeat center;
}
#newsletter-border-top #bamboo-header {
	position: relative;
	margin: 0 auto;
	height: 60px;
	width: 240px;
}
#newsletter-border-top #bamboo-header .hibiscus-l {
	position: absolute;
	left: 0;
	width: 52px;
	height: inherit;
	background: url('../img/newsletter/hibiscus-left.png') no-repeat center top;
}
#newsletter-border-top #bamboo-header .hibiscus-r {
	position: absolute;
	right: 0;
	width: 52px;
	height: 60px;
	background: url('../img/newsletter/hibiscus-right.png') no-repeat center top;
}
#newsletter-border-top .bamboo-leaf {
	position: relative;
	margin: 0 auto;
	height: 60px;
	width: 100px;
	background: url('../img/newsletter/leaf.png') no-repeat center;
}
#newsletter-title {
	height: 40px;
	background: url('../img/newsletter/newsletter.png') no-repeat center top;
}
#newsletter-border-bottom {
	position: relative;
	margin-top: 6px;
	height: 40px;
	background: url('../img/newsletter/bamboo-bottom.png') repeat-x center;
}

#newsletter-border-top h2 {
	font-size: 1.100em;
	color: #fff5da;
	padding-top: 20px;
}
#newsletter-title h2 {
	text-indent: -9000px;
}


@media screen and (max-width: 960px) {
	.parchment-header-inner {
		max-width: none;
		width: 100%;
		height: 40px;
		border-left: none;
		border-right: none;
		background: url('../img/universal/parchment-top-repeat.png') repeat-x center;
	}
	.parchment-header-inner-bg {
		width: 100%;
		height: 40px;
		background: none;
	}
	.parchment-footer-inner {
		max-width: none;
		width: 100%;
		height: 440px;
		border-left: none;
		border-right: none;
		background: url('../img/universal/parchment-bottom-repeat.png') repeat-x center;
	}
	.parchment-header-overlay,
	.parchment-footer-overlay {
		display: none;
	}
}

@media screen and (max-width: 550px) {
	#newsletter-border-top h2 {
		font-size: 1.500em;
	}
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	#newsletter-border-top {
		background: url('../img/newsletter/bamboo-top@2x.png') repeat-x center;
		background-size: 240px 14px;
	}
	#newsletter-border-top .bamboo-l,
	#newsletter-border-bottom .bamboo-l {
		background: url('../img/newsletter/bamboo-left@2x.png') no-repeat center;
		background-size: 10px 14px;
	}
	#newsletter-border-top .bamboo-r,
	#newsletter-border-bottom .bamboo-r {
		background: url('../img/newsletter/bamboo-right@2x.png') no-repeat center;
		background-size: 10px 14px;
	}
	#newsletter-border-top #bamboo-header .hibiscus-l {
		background: url('../img/newsletter/hibiscus-left@2x.png') no-repeat center top;
		background-size: 52px 48px;
	}
	#newsletter-border-top #bamboo-header .hibiscus-r {
		background: url('../img/newsletter/hibiscus-right@2x.png') no-repeat center top;
		background-size: 52px 48px;
	}
	#newsletter-border-top .bamboo-leaf {
		background: url('../img/newsletter/leaf@2x.png') no-repeat center;
		background-size: 100px 37px;
	}
	#newsletter-title {
		background: url('../img/newsletter/newsletter@2x.png') no-repeat center top;
		background-size: 239px 27px;
	}
	#newsletter-border-bottom {
		background: url('../img/newsletter/bamboo-bottom@2x.png') repeat-x center;
		background-size: 280px 14px;
	}
	
	.parchment-header-inner {
		background: url('../img/universal/parchment-top-repeat@2x.png') repeat-x center;
		background-size: 676px 80px;
	}
	
	.parchmennt-footer-left {
    background: url('../img/universal/parchment-bottom-left@2x.png') no-repeat;
		background-size: 142px 440px;
	}
	.parchmennt-footer-center {
		background: url('../img/universal/parchment-bottom-repeat@2x.png') repeat center;
		background-size: 676px 440px;
	}
	.parchmennt-footer-right {
		background: url('../img/universal/parchment-bottom-right@2x.png') no-repeat;
		background-size: 142px 440px;
	}
	.parchment-footer-inner {
		background: url('../img/universal/parchment-bottom-repeat@2x.png') repeat-x center;
		background-size: 676px 440px;
	}
}


/* =============================================================================
   Home: Diary Promotion
   ========================================================================== */

.diary-promo-wrapper-01 {
	width: 73.8%;
	min-height: 368px;
}
.diary-promo-wrapper-02 {
	position: absolute;
	top: 0;
	right: 0;
	width: 200px;
	height: 370px;
	background: url('../../assets/img/diary/wood.png');
	border-left: 10px #fecc4a solid;
	min-height: 368px;
}
.diary-promo-title {
	background: url('../../assets/img/home/arrow.png');
	width: 200px;
	height: 98px;
}
.diary-promo-title h2 {
	font-size: 2em;
	font-family: SinzanoDisplaySans-Ligatures , "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #fff;
	text-align: center;
	padding-top: 20px;
}


@media screen and (max-width: 960px) {
	.diary-promo-wrapper-01 {
		position:relative;
		width: 100%;
		min-height: 0;
	}
	.diary-promo-wrapper-02 {
		display: none;
		min-height: 0;
	}
}

/* =============================================================================
   Home: Three Promo Tabs
   ========================================================================== */

.col-three {
	float: left;
	width: 30.3%;
	margin: 0 1.51666667%;
	padding: 30px 0;
}
.col-three p {
	font-size: 0.900em;
}

.home-promo {
	padding-top: 20px;
}
.home-promo-title {
	position: relative;
	height: 60px;
	width: 100%;
	border: 1 solid #fff5da;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-khtml-border-radius: 6px;
	-webkit-border-radius: 6px;
}
.home-promo-title.uno {
	background: #ee3c2b url('../img/home/tab01-bg.gif') repeat;
}
.home-promo-title.dos {
	background: #bbd9bd url('../img/home/tab02-bg.gif') repeat;
}
.home-promo-title.tre {
	background: #fbbd11 url('../img/home/tab03-bg.gif') repeat;
}

.home-promo-title h2 {
	font-size: 1.750em;
	text-align: left;
	padding: 14px 0 0 20px;
}
.home-promo-title.uno h2 {
	color: #fff;
}
.home-promo-title.dos h2 {
	color: #6e4848;
}
.home-promo-title.tre h2 {
	color: #c64b20;
}

.home-promo-img {
	position: absolute;
	right: 0;
	top: -20px;
	width: 120px;
	height: 80px;
}
.home-promo-img.uno {
	background: url('../img/home/tab01-icon.png') no-repeat center top;
}
.home-promo-img.dos {
	background: url('../img/home/tab02-icon.png') no-repeat center top;
}
.home-promo-img.tre {
	background: url('../img/home/tab03-icon.png') no-repeat center top;
}

@media screen and (max-width: 760px) {
	.col-three {
		width: 46%;
		margin: 0 2%;
	}
	.col-three.last{
		display: none;
	}
	.home-promo-title h2 {
		font-size: 2em;
	}
}

@media screen and (max-width: 550px) {
	.col-three {
		width: 100%;
		margin: 0 0;
		padding: 15px 0;
	}
	.col-three.last {
		width: 100%;
		margin: 0 0;
		display: inline;
	}
	.home-promo-title h2 {
		font-size: 2em;
	}
	.col-three p {
		font-size: 1em;
	}
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.home-promo-title.uno {
		background: url('../img/home/tab01-bg@2x.gif') repeat;
		background-size: 240px 60px;
	}
	.home-promo-title.dos {
		background: url('../img/home/tab02-bg@2x.gif') repeat;
		background-size: 240px 60px;
	}
	.home-promo-title.tre {
		background: url('../img/home/tab03-bg@2x.gif') repeat;
		background-size: 240px 60px;
	}
	.home-promo-img.uno {
		background: url('../img/home/tab01-icon@2x.png') no-repeat center top;
		background-size: 120px 100px;
	}
	.home-promo-img.dos {
		background: url('../img/home/tab02-icon@2x.png') no-repeat center top;
		background-size: 120px 100px;
	}
	.home-promo-img.tre {
		background: url('../img/home/tab03-icon@2x.png') no-repeat center top;
		background-size: 120px 100px;
	}
}

/* =============================================================================
   Newsletter Archive
   ========================================================================== */
   
#newsletter-archive-link {
	 margin: 0 auto;
}
#newsletter-archive-link p {
  	font-size: 0.900em;
}
@charset "UTF-8";

/* =============================================================================
   General Layout
   ========================================================================== */

/*No scrollbar for DIV wider than browser
http://stackoverflow.com/questions/2355170/no-scrollbar-for-div-wider-than-browser*/

#header-outer{
    min-width: 960px;
    overflow-x: hidden;
}
#header-container {
    width: 960px;
    margin: 0 auto;
    /*background: gray;*/
    height: 270px;
}
.header-row {
    width: 1140px;
    /*background: blue;*/
    margin-left: -90px;
}
.header-col-50 {
	float: left;
	width: 50%;
}

/* ---------- BACKGROUND ---------- */
#header-background {
	z-index: 1;
    margin-top: 40px;
}
.palmleaves-bg-l {
	height: 270px;
	background: url('../../assets/img/header/header-palmleaves-bg-l.png') no-repeat top left;
}
.palmleaves-bg-r {
	height: 270px;
	background: url('../../assets/img/header/header-palmleaves-bg-r.png') no-repeat top right;
}

/* ---------- MIDGROUND ---------- */
#header-midground-torch {
	z-index: 2;
	position: absolute;
	margin-left: 90px;
	margin-top: 48px;
	width: 960px;
	height: 40px;
}
.midground-torch-l {
	float: left;
	height: 140px;
	width: 120px;
	background: url('../../assets/img/universal/bg-scene-torch-l-shadow.png') no-repeat 44px 0;
	background-size: 115px 303px;
}
.midground-torch-r {
	float: right;
	height: 140px;
	width: 120px;
	background: url('../../assets/img/universal/bg-scene-torch-r-shadow.png') no-repeat 30px 0;
	background-size: 115px 303px;
}

#header-midground-flame {
	z-index: 3;
	position: absolute;
	margin-left: 90px;
	margin-top: -88px;
	width: 960px;
	height: 40px;
}
#midground-flame-l {
	margin-left: 35px;
}
.midground-flame-l {
	float: left;
	width: 66px;
	height: 152px;
	background: transparent url('../../assets/img/universal/bg-scene-flame-l.png') no-repeat;
}
#midground-flame-r {
	float: right;
	width: 60px;
	height: 152px;
	overflow: hidden;
	margin-right: 28px;
}
.midground-flame-r {
	width: 66px;
	height: 152px;
	background: transparent url('../../assets/img/universal/bg-scene-flame-r.png') no-repeat;
}

/* ---------- NAVIGATION ---------- */
.nav-container {
	z-index: 3;
	position: absolute;
    margin-left: 90px;
    margin-top: 130px;
    width: 960px;
    /*height: 40px;*/
}

/* ---------- FOREGROUND ---------- */
#header-foreground {
	z-index: 3;
	position: absolute;
    margin-left: 90px;
    margin-top: 104px;
    width: 960px;
    height: 40px;
}
.palmleaves-fg-l {
	float: left;
	height: 150px;
	width: 120px;
	background: url('../../assets/img/header/header-palmleaves-fg-l.png') no-repeat 12px 0;
}
.palmleaves-fg-r {
	float: right;
	height: 150px;
	width: 120px;
	background: url('../../assets/img/header/header-palmleaves-fg-r.png') no-repeat 0 0;
}

/* ---------- LOGO ---------- */
.logo-container {
	z-index: 2;
	top: 12px;
	position: absolute;
    margin-left: 90px;
    width: 960px;
}
.logo {
	margin: 0 auto;
	max-width: 305px;
	text-align: center;
}

/* ---------- PARCHMENT ---------- */
.parchment {
	z-index: 4;
	position: absolute;
    margin-left: 90px;
    margin-top: 190px;
    width: 960px;
    height: 80px;
}

@media screen and (max-width: 960px) {
	
	#header-outer {
		min-width: 840px;
	}
	#header-container,
	#header-foreground,
	#header-midground-torch,
	#header-midground-flame,
	.nav-container,
	.logo-container,
	.logo {
		width: 840px;
	}	
	.header-row {
		width: 1020px;
	}
	.parchment {
		display: none;
	}
	#parchment-adjust {
		position: absolute;
		margin-top: 230px;
		z-index: 200;
	    width: 100%;
	    height: 80px;
	    background: url('../img/universal/parchment-top-repeat.png') repeat center;
	}
}

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

  #header-outer {
		min-width: 720px;
	}
	#header-container,
	#header-foreground,
	#header-midground-torch,
	#header-midground-flame,
	.nav-container,
	.logo-container,
	.logo {
		width: 720px;
	}	
	.header-row {
		width: 900px;
	}
	
	.palmleaves-bg-l {
	background-position: left -20px top 0;
	}
	.palmleaves-bg-r {
		background-position: right -20px top 0;
	}

}


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

	#header-outer{
	min-width: 0;
	    width: 100%;
			background: #000; /* ADD BACKGROUND IMAGE OF LEAVES CENTERED */
			background: url('../../assets/img/header/header-palmleaves-bg.png') no-repeat top center;
	}
	
	#header-container {
    width: 100%;
    height: auto;
}

.header-row {
    width: 100%;
    margin-left: 0;
}

.logo-container  {
		width: 100%;
		margin-left: 0;
		z-index: 0;
	position: relative;
	}
	.nav-container  {
		width: 100%;
		margin-top: 20px;
		margin-left: 0;
		z-index: 0;
	position: relative;
	}
	
	#header-foreground,
	#header-background,
	#header-midground-torch,
	#header-midground-flame {
	    display: none;
	}
	
	.parchment {
		display: block;
	    width: 100%;
		margin-top: 12px;
		margin-left: 0;
		z-index: 0;
		position: relative;
	}
	#parchment-adjust {
		display: none;
	}
}

@media screen and (max-width: 550px) {
	#header-outer{
		background: url('../../assets/img/header/header-palmleaves-bg-sml.png') no-repeat top center;
	}
	.logo {
		width: 84%;	
	}
	.nav-container  {
		margin-top: 40px;
	}
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	#parchment-adjust {
		    background: url('../img/universal/parchment-top-repeat.png') repeat center;
		    background-size: 676px 80px;
		}
}

@media screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 760px), screen and (min-resolution: 192dpi) and (max-width: 760px) {
	#header-outer{
		background: url('../../assets/img/header/header-palmleaves-bg@2x.png') no-repeat top center;
		background-size: 960px 300px;
	}
}

@media screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 550px), screen and (min-resolution: 192dpi) and (max-width: 550px) {

	#header-outer{
		background: url('../../assets/img/header/header-palmleaves-bg-sml@2x.png') no-repeat top center;
		background-size: 960px 300px;
	}
}

/* =============================================================================
   Navigation
   ========================================================================== */
.nav {
	font: 1.400em/1.7 SinzanoDisplaySansRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 300;
	text-transform: uppercase;
	text-align: center;
	color: #f8f8f6;
	margin: 0 auto;
	padding-left: 20px;
	display: block;
	position: relative;
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	background: #fff5da;
	max-width: 740px;
}
.nav > ul {
  	margin: 0;
  	padding: 0;
  	list-style: none;
  	zoom: 1;
}
.nav > ul:after {
  	content: "";
  	clear: both;
  	display: block;
}
.nav li {
  	float: left;
}
.nav a {
	color: #000000;
	display: block;
	padding: 3px 0 0;
	height: 40px;
	width: 120px;
	background: url('../../assets/img/header/header-bg-nav.png') no-repeat 0 100%;
	text-decoration:none;
}
.nav a:focus, .nav a:hover {
	color: #ee3c2b;
}
#nav-home a {
	background-position: -140px 100%;
}
#nav-contact a {
	background-position: -260px 100%;
}

#page-home #nav-home > a,
#page-diary #nav-diary > a,
#page-menu #nav-menu > a,
#page-gallery #nav-gallery > a,
#page-faq #nav-faq > a,
#page-contact #nav-contact > a {
	color: #328e40;
}

#mobile-nav {
  background: rgba(254, 126, 0, 1) url('../../assets/img/header/header-mobile-nav.png') no-repeat center;
	background-size: 19px 14px;
  text-indent: -9999px;
  display: none;
  border: none;
  position: absolute;
  top: 197px;
  right: 70px;
  width: 20px;
  height: 12px;
  padding: 5px 3px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.active-page {
  display: none;
}

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

	.nav {
		font-size: 1.4em;
		padding-left: 18px;
		max-width: 620px;
	}
	.nav a {
		width: 100px;
		background: url('../../assets/img/header/header-bg-nav.png') no-repeat 0 100%;
	}

}

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

	.nav {
		font-size: 1.2em;
		line-height: 2em;
		padding-left: 5px;
		max-width: 500px;
	}
	.nav a {
		width: 82px;
		background: url('../../assets/img/header/header-bg-nav.png') no-repeat 0 100%;
	}

}

@media screen and (max-width: 760px) {
  .nav {
  	font-size: 1.5em;
		line-height: 1em;
    position: relative;
		max-width: none;
		padding-left: 0;
		border-bottom: 1px solid #000;
  }
  
  .nav a {
  	background: none;
		padding: 11px 0 0 0;
  }

  .nav > ul {
    height: 0;
    overflow: hidden;
    text-align: left;
		text-indent: 10px;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
  }

  .nav > .open {
    height: 252px;
  }

  .nav > ul > li {
    width: auto;
    display: block;
    float: none;
    border: none;
    margin: 0 !important;
  }

  .nav > ul > li > a {
    height: 30px;
    border: solid #000;
    border-width: 0 0 1px;
    width: auto;
		padding-left: 10px;
  }

  #mobile-nav {
    display: block;
    top: 10px;
    right: 10px;
    height: 19px;
    width: 30px;
  }

  .active-page {
    display: block;
    color: #000;
    text-align: left;
    padding: 16px 0 0 20px;
    border-bottom: 1px solid #000;
    height: 34px;
  }
	.active-page .home,
	.active-page .diary,
	.active-page .menu,
	.active-page .gallery,
	.active-page .faq,
	.active-page .contact,
	.active-page .newsletter,
	.active-page .thank-you {
		 display: none;
	}
	#page-home .active-page .home {
		display: block;
	}
	#page-diary .active-page .diary {
		display: block;
	}
	#page-menu .active-page .menu {
		display: block;
	}
	#page-gallery .active-page .gallery {
		display: block;
	}
	#page-faq .active-page .faq {
		display: block;
	}
	#page-contact .active-page .contact {
		display: block;
	}
	#page-newsletter .active-page .newsletter {
		display: block;
	}
	#page-thank-you .active-page .thank-you {
		display: block;
	}
}



