body {
	background-color: #000;
	background-image: url('/img/background.jpg'); 
	background-size: cover;
	margin-bottom: 10px;
}

p {
	font-family: 'Raleway', sans-serif;
	font-size: 14px;
}

h4, h5 {
	font-family: 'Montserrat', sans-serif;
	color:#788334;
}

a, a:hover, a:focus {
	color:#788334;
	font-weight: 600;
}

.cover {
	position: absolute;
	width:100%;
	overflow: hidden;
	z-index: 1;
}

.page {
	position: relative;
	z-index: 10;
	overflow: hidden;
}

#logo {
	background-image: url('/img/logo.svg'); 
	width:500px;
	height: 358px;
	background-size: 500px 358px;
	text-indent: -9999px;
	margin: 140px auto 100px;
}

@media all and (max-width:650px) {
	#logo {
		background-image: url('/img/logo.svg'); 
		width:275px;
		height: 196px;
		background-size: 275px 196px;
		margin: 70px auto 100px;
	}
}

p.lead {
	font-family: 'AmorieModella-Bold';	
	text-transform: uppercase;
	font-size: 40px;
	line-height: 40px;
}


/* Fonts */

.Asterism-Regular { 
	font-family: Asterism-Regular;
	font-weight: normal;
	font-style: normal;
}
.AmorieModella-Bold { 
	font-family: AmorieModella-Bold;
	font-weight: normal;
	font-style: normal;
}
.LuloCleanOne { 
	font-family: LuloCleanOne;
	font-weight: normal;
	font-style: normal;
}
.LuloCleanOne-Bold { 
	font-family: LuloCleanOne-Bold;
	font-weight: normal;
	font-style: normal;
}


/* Buttons */

button, .button {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
	background-color:#636e2a;
	color: white;
	font-weight: 600;
	padding: 0.7rem 1rem;
	font-size: .8rem;
    border-color:none;
    border-radius: 2px;
}

.button:hover, .button:focus {
	background-color:#788334; 
}


/* Top Bar */

.top-bar {
    background:url('/img/wood-bg-crop.jpg');
    height: 4.813rem;
	line-height: 4.813rem;
}

.top-bar.expanded .title-area {
    background:url('/img/wood-bg-crop.jpg');
}

.top-bar .name {
    height: 4.813rem;
}

.top-bar-section ul li {
    background: transparent;
}

.top-bar-section li:not(.has-form) a:not(.button) {
    background: transparent;
    line-height: 5rem;
    font-size: 29px;
	text-transform: uppercase;
	padding: 0 40px;
}

.top-bar-section li:not(.has-form) a:hover:not(.button) {
    background: transparent;
}

.top-bar-section ul li > a {
	font-family: 'AmorieModella-Bold';
}

.top-bar .toggle-topbar.menu-icon a {
    font-family: 'AmorieModella-Bold';
    font-size: 29px;
    font-weight: normal;
    line-height: 40px;
    color: white;
}

.top-bar.expanded .toggle-topbar a span::after {
    box-shadow: 0px 0px 0px 1px #fff, 0px 7px 0px 1px #fff, 0px 14px 0px 1px #fff;
}

@media all and (max-width:1016px) {
	.top-bar-section li:not(.has-form) a:not(.button) {
	    font-size: 25px;
		padding: 0 20px;
	}	
}

@media all and (max-width:768px) {
	.top-bar-section li:not(.has-form) a:not(.button) {
		padding: 0 15px;
	}	
}

@media all and (max-width:640px) {
	.top-bar-section ul li {
    	background-color: #373737;
    	border-bottom: 1px solid #000;
	}
	
	.top-bar-section li:not(.has-form) a:not(.button) {
		line-height: 3rem;
	}
}

/* Modals */

#modalTitle {
	font-family: 'Asterism-Regular';
	font-size: 75px;
	text-transform: lowercase;
	text-align: center;	
	background:url('/img/header-bg.jpg');
	background-position: left top;
	background-repeat: no-repeat;
	padding:50px;
	color: white;
	background-size: cover;
}

#modalTitle .small {
	font-size: 30px;
}

.reveal-modal {
	padding:0px;
}

.modalBody {
	padding: 1.5rem;
}

.reveal-modal .close-reveal-modal, dialog .close-reveal-modal {
    font-size: 1rem;
    background-color:#788334;
    padding:2px 8px 7px;
    border-radius: 50%;
    top: -0.325rem;
	right: -0.325rem;
	color: white;
}

@media all and (max-width:640px) {
	#modalTitle {
		font-size: 50px;
		line-height: 60px;
		padding:20px;
	}
	.reveal-modal .close-reveal-modal, dialog .close-reveal-modal {
    	background-color:white;
		color: #788334;
	    top: 0.325rem;
		right: 0.325rem;
	}
	body {
		background-image: url('/img/background-tall.jpg'); 
		overflow: auto;
	}	
} 

 
 
/* RSVP Form */

@media all and (min-width:500px) {
	.mobile-iframe-wrapper {
		display: none;
	}
}


@media all and (max-width:500px) {
	.iframe-wrapper {
		display: none;
	}
	
	.mobile-iframe-wrapper {
		width:100vw;
        overflow: hidden;
        margin: 0 -15px;
	}
}