@charset "UTF-8";
/* CSS Document */
/*-------------- Header and Main Content -------------*/
#wrapper-main {
	background-image:url(../img/bg_xo.jpg);
	background-repeat:repeat;
	overflow:hidden;
	padding-bottom:80px;
}

#header {
	height: 200px;
	background-image:url(../img/bg_header.png);
	overflow:hidden;
	position:relative;
}

#masthead {
	position:relative;
	width:960px;
}

#logo {
	position:absolute;
	width:880px;
	height:200px;
	margin-top:-120px;
}

#main {
	margin:auto;
	margin-top:-26px;
	width:960px;
	background-image:url(../img/bg_main.png);
	background-repeat:repeat-y;
	}
	
.main-header{
	margin:auto;
	width:600px;
}

.main-content{
	margin:auto;
	width:600px;
	padding:50px 0px 60px 0px;	
}

.main-end {
	margin:auto;
	width:960px;
	height:60px;
	background-image:url(../img/bg_main-end.png);
	background-repeat:no-repeat;
}

#slideshow {
	outline: none; /*get rid of dotted line in Firefox*/
	padding:0px 0px 60px 0px;
}
	
/*-------------- Navigation -------------*/
#navigation {
	height: 600px;
	background-image:url(../img/bg_navigation.png);
	margin-top:-26px;
}
	

.nav-content {
	margin:auto;
	width:880px;
	padding:80px 20px;
	position:relative;
	overflow:visible;
}

#nav-logo {
	position:relative;
	width:60px;
	height:60px;
	margin:-80px 410px 0px 410px;
	background-image:url(../img/logo-xo.png);
}

/*-------------- Story Button -------------*/
.nav-story {
	width:260px;
	padding:25px 20px 20px 10px;
	float:left;
}

.nav-story a {
	outline: none; /*get rid of dotted line in Firefox*/
	text-indent: -9999px; /*moves text outside of screen area*/
	display:block;
	position:absolute;
	width:260px;
	height:180px;
	background:url(../img/story-btn.png) 0 0 no-repeat;
}

.nav-story a:hover {
	background-position:0 -179px;
}
	
.nav-story a:active {
	background-position:0 -360px;
}

/*-------------- Registry Button -------------*/
.nav-registry {
	width:260px;
	padding:205px 20px 20px 10px;
	float:left;
}

.nav-registry a {
	outline: none; /*get rid of dotted line in Firefox*/
	text-indent: -9999px; /*moves text outside of screen area*/
	display:block;
	position:absolute;
	width:260px;
	height:180px;
	background:url(../img/registry-btn.png) 0 0 no-repeat;
}

.nav-registry a:hover {
	background-position:0 -180px;
}
	
.nav-registry a:active {
	background-position:0 -360px;
}

/*-------------- Guest Info Button -------------*/
.nav-info {
	width:260px;
	padding:25px 20px 20px 20px;
	float:left;
}

.nav-info a {
	outline: none; /*get rid of dotted line in Firefox*/
	text-indent: -9999px; /*moves text outside of screen area*/
	display:block;
	position:absolute;
	width:260px;
	height:180px;
	background:url(../img/info-btn.png) 0 0 no-repeat;
}

.nav-info a:hover {
	background-position:0 -179px;
}
	
.nav-info a:active {
	background-position:0 -360px;
}

/*-------------- Store Button -------------*/
.nav-store {
	width:260px;
	padding:205px 20px 20px 20px;
	float:left;
}

.nav-store a {
	outline: none; /*get rid of dotted line in Firefox*/
	text-indent: -9999px; /*moves text outside of screen area*/
	display:block;
	position:absolute;
	width:260px;
	height:180px;
	background:url(../img/store-btn.png) 0 0 no-repeat;
}

.nav-store a:hover {
	background-position:0 -180px;
}
	
.nav-store a:active {
	background-position:0 -360px;
}

/*-------------- Wedding Party Button -------------*/
.nav-party {
	width:260px;
	padding:25px 10px 20px 20px;
	float:left;
}

.nav-party a {
	outline: none; /*get rid of dotted line in Firefox*/
	text-indent: -9999px; /*moves text outside of screen area*/
	display:block;
	position:absolute;
	width:260px;
	height:180px;
	background:url(../img/party-btn.png) 0 0 no-repeat;
}

.nav-party a:hover {
	background-position:0 -180px;
}
	
.nav-party a:active {
	background-position:0 -360px;
}

/*-------------- Photos Button -------------*/
.nav-photos {
	width:260px;
	padding:205px 10px 20px 20px;
	float:left;
}

.nav-photos a {
	outline: none; /*get rid of dotted line in Firefox*/
	text-indent: -9999px; /*moves text outside of screen area*/
	display:block;
	position:absolute;
	width:260px;
	height:180px;
	background:url(../img/photos-btn.png) 0 0 no-repeat;
}

.nav-photos a:hover {
	background-position:0 -179px;
}
	
.nav-photos a:active {
	background-position:0 -360px;
}

/*-------------- Footer -------------*/
#footer {
	background:#002386;
	height:160px;
}

.footer-content {
	margin:auto;
	width:880px;
	position:relative;
}

.footer-box {
	width:230px;
	padding:40px 30px 0px 30px;
	float:left;
}

.footer-logo {
	width:60px;
	padding:50px 120px 0px 120px;
	float:left;
}

/*-------------- Text -------------*/
body { 
	font-family: BrandonGrotesque-Medium; 
	font-size:19px;
	letter-spacing:.5px;
}

a {
	text-decoration:none;
	color:#002386;
}

a:hover {
	color:#ffb1b9;
}

p.italic {
	font-style:italic
}

.red {
	color:#ff0d21;
}

.small-blue {
	font-size:14px;
	color:#0139aa;
}

.dropcap { 
	float: left; 
	color: #002386; 
	font-size: 58px; 
	line-height: 50px; 
	padding: 3px 5px 0 0; 
}

h1 {
	text-indent:-9999px;
}

h2 {
	font-size:22px;
	color:#0139aa;
	letter-spacing:1px;
	text-transform:uppercase;
}

h3 {
	font-size:22px;
	color:#FFF;
	letter-spacing:2px;
	text-transform:uppercase;
}

h3 a {
	text-decoration:none;
	color:#FFF;
}

.align-right {
	text-align:right;
}

hr {
	border:none;
	height:30px;
	width:600px;
	background:url(../img/hr.png) 0 0 repeat;
}

/*-------------- Images -------------*/
.margins {
	margin-top:50px;
	margin-bottom:50px;
}