@charset "UTF-8";

@import "reset.css";

/* global */
.inner {
	margin: 0 auto;
	width: 960px;
	position: relative;
}

body {
	font-family: 'Quicksand', Arial, serif;
}

a {
	color: #b52763;
	text-decoration: none;
	outline: none;
}
.title {
	text-align: center;
	text-transform: uppercase;
	font-weight: 700;
	color: #fff;
	line-height: inherit;
	font-size: 2.1em;
	letter-spacing: -2px;
	position: absolute;
}
.title h2 {
	line-height: 52px;
}
.section484 {
	position: absolute;
	width: 484px;
	left: 238px;
}
.subtitle {
	padding-top: 3px;
	background: url(../images/dotsHorzPurple.png) repeat-x 6px 0;
}
.subtitle h5 {
	line-height: 44px;
	background: url(../images/dotsHorzPurple.png) repeat-x 6px 100%;
	padding-bottom: 3px;
	font-size: 1.4em;
	text-transform: uppercase;
	text-align: center;
}


/* header */
#header {
	background: url(../images/bgHeader.png) repeat-x 0 0;
	overflow: hidden;
	position: fixed;
	width: 100%;
	z-index: 9999;
}
#header ul {
	background: url(../images/dotsHorzPurple.png) repeat-x 1px 100%;
	height: 80px;
}
#header li {
	float: left;
	line-height: 77px;
	text-align: center;
	width: 90px;
	margin-right: 16px;
	text-transform: uppercase;
	display: inline;
}
#header li:hover {
	background: #dbeef9;
}
#header li.logo {
	width: 324px;
	text-indent: -9999px;
	background: url(../images/Logo.png) no-repeat 50% 0;
}
#header li.logo:hover {
	background: #dbeef9 url(../images/Logo.png) no-repeat 50% 0;
}
#header li.rsvp {
	margin-right: 0;
	font-weight: 700;
}
#header li a {
	display: block;
	text-decoration: none;
	font-size: 1.1em;
}

/* banner */
#banner {
	background: #e7f8ff url(../images/bgBanner.png) repeat-x 0 80px;
	overflow: hidden;
	width: 100%;
}
#banner .inner {
	margin: 80px auto 0;
	background: url(../images/Banner.png) no-repeat 50% 0;
	height: 361px;
}
#banner h1 {
	text-align: center;
	text-transform: uppercase;
	padding-top: 20px;
}
#banner h1 span {
	display: block;
	font-weight: 400;
}
#banner h1 span.line1 {
	display: none;
}
span.line2 {
	font-size: 14px;
	letter-spacing: 6px;
	margin-bottom: 4px;
}
span.line3 {
	font-size: 20px;
	margin-bottom: 4px;
}
span.line4 {
	font-size: 14px;
}
span.line5 {
	font-size: 82px;
}
span.line7 {
	text-transform: lowercase;
	margin-top: 20px;
}

/* story */
#story .inner {
	background: url(../images/Story.png) no-repeat 50% 0;
	height: 1846px;
}
#story span {
	position: absolute;
	line-height: 77px;
	font-size: 0.8em;
}
#story span blockquote {
	line-height: 1em;
	padding-top: 24px;
}
#story span em {
	font-style: italic;
	color: #658f55;
	font-size: 0.7em;
}
#story span strong {
	font-size: 0.7em;
}
#story .story {
	top: 50px;
	left: 297px;
	width: 366px;
	font-size: 3em;
	letter-spacing: -4px;
}
#story .story h2 {
	line-height: 60px;
}
#story .story strong {
	padding: 0 8px 0 26px;
	font-size: 1em;
}

#story .met {
	top: 1010px;
	left: 382px;
	font-size: 1.6em;
	letter-spacing: -2px;
	width: 196px;
	line-height: 42px;
}
#story .date {
	top: 1023px;
	right: 610px;
	line-height: 22px;
}
#story .location {
	top: 1023px;
	left: 610px;
	line-height: 22px;
}
#story .later {
	top: 1141px;
	left: 330px;
	width: 300px;
	text-align: center;	
	line-height: 22px;
	padding-left: 3px;
	font-size: 1em;
}
#story .later strong {
	padding: 0 0 0 12px;
	font-size: 1em;
}

#story .love {
	top: 1241px;
	left: 357px;
	font-size: 2.1em;
	letter-spacing: -2px;
	width: 246px;
	line-height: 52px;
}

#story span.born {
	top: 164px;
	line-height: 18px;
	font-size: 1.2em;
}
.storyKatie .born {
	left: 208px;
}
.storyDan .born {
	right: 208px;
	text-align: right;
}
.storyKatie .section1 {
	top: 286px;
	left: 234px;
}
.storyDan .section1 {
	top: 249px;
	right: 237px;
}
.storyKatie .section2 {
	top: 435px;
	left: 180px;
}
.storyDan .section2 {
	top: 358px;
	right: 121px;
}
.storyKatie .section3 {
	top: 529px;
	left: 324px;
}
.storyDan .section3 {
	top: 424px;
	left: 681px;
}
#story span em.sinceProposal {
	font-size: 1em;
	color: #000;
	font-style: normal;	
}
.storyKatie .section4 {
	top: 664px;
	left: 278px;
}
.storyDan .section4 {
	top: 536px;
	right: 198px;
}
.storyKatie .section5 {
	top: 799px;
	right: 530px;
	text-align: right;
}
.storyDan .section5 {
	top: 702px;
	left: 530px;
}
.storyMore .section1 {
	top: 1389px;
	left: 529px;
}
.storyMore .section2 {
	top: 1489px;
	right: 529px;
}
.storyMore .section3 {
	top: 1589px;
	left: 529px;
}

a.watch {
	text-align: center;
	width: 135px;
	height: 84px;
	padding: 88px 18px 0 18px;
	font-size: 0.85em;
	line-height: 12px;
	position: absolute;
	cursor: pointer;
	color: #000;
	text-decoration: none;
}
a.proposal {
	top: 1532px;
	left: 62px;
	background: url(../images/speechRightWatch.png) no-repeat 50% 0;
}
a.proposal:hover {
	background: url(../images/speechRightWatch.png) no-repeat 50% -172px;
}
a.kittens {
	top: 1622px;
	right: 0;
	background: url(../images/speechLeftWatch.png) no-repeat 50% 0;
}
a.kittens:hover {
	background: url(../images/speechLeftWatch.png) no-repeat 50% -172px;
}


/* flag */
.flag {
	background: url(../images/bgFlag.png) no-repeat 50% 50%;
	width: 210px;
	height: 168px;
	position: absolute;
	top: -10px;
	left: 375px;
	text-align: center;
	text-transform: uppercase;
}
.flag strong {
	display: block;
	font-weight: 700;
	font-size: 4em;	
	margin: 30px 0 6px 0
}
.flag em {
	display: block;
	font-size: 0.9em;
}


/* circle */
.circle {
	height: 200px;
	width: 200px;
	position: absolute;	
	background: url(../images/circleLightPurple.png) no-repeat 50% 0;
	text-align: center;
	cursor: pointer;
}
.circle:hover {
	background: url(../images/circleLightPurple.png) no-repeat 50% -200px;
}
a.circleLink {
	color: #000;
}
.circle h4 {
	text-transform: uppercase;
	font-weight: 700;
	font-size: 1.2em;
	padding: 58px 30px 8px 30px;
}
.circle p {
	padding: 0 30px;
	font-size: 0.9em;
}
.circleHotels {
	top: 140px;
	left: 50px;
}
.circleDirections {
	top: 306px;
	right: 50px;
}

/* venue */
#venue {
	background: #f6f0ff;
}
#venue .inner {
	background: url(../images/Venue.png) no-repeat 50% 0;
	height: 894px;
}
#venue span {
	position: absolute;
}
#venue .title {
	top: 457px;
	left: 357px;
	width: 246px;
}
#venue .details {
	top: 548px;
	text-transform: uppercase;
	text-align: center;
}
#venue .details h3 {
	line-height: 51px;
	font-size: 2.1em;
	letter-spacing: 8px;
	padding-bottom: 3px;
	margin-bottom: 8px;
	background: url(../images/dotsHorzPurple.png) repeat-x 6px 100%;
	font-weight: 700;
}
#venue .details p {
	line-height: 28px;
	font-size: 1.48em;
	letter-spacing: -1px;
}
#venue .details em {
	line-height: 22px;
	letter-spacing: 1px;
}

/* party */
#party .inner {
	background: url(../images/Party.png) no-repeat 50% 0;
	height: 1020px;
}
#party .title {
	top: 57px;
	left: 287px;
	width: 386px;
}
#party .names {
}
#party .names li {
	position: absolute;
	text-align: center;
	width: 168px;
	line-height: 36px;
	text-transform: uppercase;
	color: #fff;
	font-weight: 700;
	font-size: 1.4em;
	letter-spacing: -1px;
}
#party .row1 li {
	top: 355px;
}
#party .row2 li {
	top: 625px;
}
#party .row3 li {
	top: 895px;
}
#party .col4 li.one {
	left: 21px;
}
#party .col4 li.two {
	left: 271px;
}
#party .col4 li.three {
	left: 521px;
}
#party .col4 li.four {
	left: 771px;
}
#party .names .row3 li {
	width: 126px;
}
#party .col5 li.one {
	left: 21px;
}
#party .col5 li.two {
	left: 219px;
}
#party .col5 li.three {
	left: 417px;
}
#party .col5 li.four {
	left: 615px;
}
#party .col5 li.five {
	left: 813px;
}

/* times */
#times .inner {
	background: url(../images/Times.png) no-repeat 50% 0;
	height: 818px;
}
#times .title {
	top: 188px;
	left: 287px;
	width: 386px;
}
#times .details {
	top: 279px;
}
#times .details p {
	line-height: 44px;
	font-size: 1.3em;
	font-weight: 700;
	background: url(../images/dotsHorzLightPurple.png) repeat-x 6px 100%;
	padding-bottom: 3px;
	text-align: center;
}
#times .details li {
	line-height: 44px;
	height: 44px;
	background: url(../images/dotsHorzLightPurple.png) repeat-x 6px 100%;
	padding-bottom: 3px;
}
#times .details li span {
	display: none;
}
#times .details li em {
	float: left;
}
#times .details li strong {
	float: right;
	font-weight: 700;
}

/* hotels */
#hotels .inner {
	background: url(../images/Hotels.png) no-repeat 50% 0;
	height: 1020px;
}
#hotels .title {
	top: 175px;
	left: 262px;
	width: 436px;
}
.loc {
	width: 212px;
	height: 141px;
	position: absolute;	
	background: url(../images/bgLoc.png) no-repeat 50% 50%;
	padding: 30px 10px 0 30px;
	font-size: 0.9em;
}
.loc h6 {
	font-weight: 700;
	line-height: 30px;
	font-size: 1.05em;
}
.loc span.address {
	line-height: 16px;
}
.loc span.telephone {
	line-height: 30px;
}
a.locLink span.address, a.locLink span.telephone {
	color: #000;
}
.loc1 {
	top: 305px;
	left: 0;
}
.loc2 {
	top: 305px;
	left: 354px;
}
.loc3 {
	top: 305px;
	right: 0;
}
.loc4 {
	top: 555px;
	left: 0;
}
.loc5 {
	top: 555px;
	right: 0;
}
.loc6 {
	top: 805px;
	left: 0;
}
.loc7 {
	top: 805px;
	left: 354px;
}
.loc8 {
	top: 805px;
	right: 0;
}

/* gifts */
#gifts .inner {
	background: url(../images/Gifts.png) no-repeat 50% 0;
	height: 580px;
}
#gifts .title {
	top: 196px;
	left: 307px;
	width: 346px;
}
#gifts .details {
	top: 287px;
}
#gifts .details p {
	line-height: 24px;
	font-size: 1em;
	font-weight: 700;
	background: url(../images/dotsHorzPurple.png) repeat-x 6px 100%;
	padding-bottom: 10px;
	text-align: center;
	margin-top: 9px;
	letter-spacing: -0.5px;
}

/* rsvp */
#rsvp {
	background: #e7f8ff;
}
#rsvp .inner {
	background: url(../images/RSVP.png) no-repeat 50% 0;
	height: 1100px;
}
#rsvp .title {
	width: 196px;
	top: 0;
	font-size: 1.7em;
}
#rsvp .title h2 {
	line-height: 42px;
}
div.info .title {
	left: 140px;
}
div.rsvp .title {
	right: 140px;
}
div.info, div.rsvp {
	position: absolute;
	top: 196px;
	width: 400px;
	padding: 84px 39px 0;
	text-align: center;
}
div.rsvp div.info {
	top: 280px;
	line-height: 22px;
}
div.rsvp div.info strong {
	font-weight: 700;
}

div.info {
	left: 0;
}
div.rsvp {
	right: 0;
}
p.intro {
	font-size: 1.2em;
	padding: 0 60px 5px;
	text-align: center;
}
.info h5 {
	font-size: 1.1em;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 30px;
	margin-top: 8px;
}
.rsvp input {
	position: absolute;
}
.rsvp input.code {
	border: none;
	font-size: 2em;
	font-family: 'Quicksand', Arial, serif;
	height: 58px;
	left: 96px;
	text-align: center;
	top: 145px;
	width: 288px;
	background: transparent;
}
.rsvp input.button {
	background: url(../images/buttonGo.png) no-repeat 50% 0;
	border: solid 0 #000;
	width: 88px;
	height: 92px;
	cursor: pointer;
	top: 220px;
	left: 195px;
}
.rsvp input.button:hover {
	background: url(../images/buttonGo.png) no-repeat 50% -92px;
}

/* extra */
body.extra {
	background: #bbdeac;
}
.extra #header ul {
	width: 324px;
	margin: 0 auto;
}
.extra #header li {
	margin-right: 0;
}
.extra #header li:hover {
	background-color: transparent;
}
.extra #banner {
    background: url(../images/bgExtra.png) repeat-x 0 0;
}

/* error */
.error #banner .inner {
    height: 832px;
    background: url(../images/extraOops.png) no-repeat 50% 0;
}
.error div.rsvp {
	top: 173px;
	left: 241px;
}
.error div.rsvp .title {
	width: 196px;
	top: 0;
	font-size: 1.7em;
}
.error div.rsvp .title h2 {
	line-height: 42px;
}
.error p.intro {
	padding: 0 30px 5px;
	font-size: 1em;
	line-height: 1.2em;
}

/* thanks */
.thanks #banner .inner {
    height: 832px;
    background: url(../images/extraThanks.png) no-repeat 50% 0;
}

/* sky */
body.sky {
	background: #bddeef;
}
.sky #banner {
    background: url(../images/bgSky.png) repeat-x 0 0;
}

/* sky rsvp */
.sky #banner h1 {
    padding-top: 50px;
}
.sky #banner .inner {
    min-height: 920px;
	height: auto;
    background: url(../images/skyRSVP.png) no-repeat 50% 0;
	margin: 0 auto;
}
.sky div.rsvpForm {
	position: absolute;
	top: 173px;
	left: 0;
	width: 960px;
	padding-top: 84px;
}
.sky div.rsvpForm .title {
	width: 196px;
	top: 0;
	font-size: 1.7em;
	left: 382px;
}
.sky div.rsvpForm .title h2 {
	line-height: 42px;
}
.person {
	height: 63px;
	line-height: 63px;
	padding: 0 20px 3px;
	position: relative;
	background: url(../images/dotsHorzPurple.png) repeat-x 6px 100%;
}
.person h4 {
	text-transform: uppercase;
	font-size: 2.5em;
}
.person span {
	position: absolute;
	top: 0;
	display: block;
	text-indent: -9999px;
	height: 63px;
}
.person span.attending {
	left: 472px;
	width: 113px;
	background: url(../images/rsvpformSprite.png) no-repeat 0 0;
}
.person span.attending em {
	cursor: pointer;
	display: block;
	width: 46px;
	height: 63px;
}
.person span.attending em.yes {
	float: left;
}
.person span.attending em.no {
	float: right;
}
.person span.vegetarian {
	left: 660px;
	width: 43px;
	background: url(../images/rsvpformSprite.png) no-repeat -113px 0;
	cursor: pointer;
}
.person span.gluten {
	left: 739px;
	width: 43px;
	background: url(../images/rsvpformSprite.png) no-repeat -156px 0;
	cursor: pointer;
}
.person span.wine {
	left: 862px;
	width: 50px;
	background: url(../images/rsvpformSprite.png) no-repeat -200px 0;
}
.person span.wine em {
	cursor: pointer;
	display: block;
	width: 24px;
	height: 23px;
	position: absolute;
}
.person span.wine em.white {
	bottom: 10px;
	left: 1px;
}
.person span.wine em.rose {
	top: 9px;
	left: 14px;
}
.person span.wine em.red {
	bottom: 10px;
	right: -1px;
}
.person1 {
	margin-top: 100px;
}
.sky div.rsvpForm h3 {
	margin-bottom: 10px;
	font-size: 1.2em;
	font-weight: bold;
}
.sky div.rsvpForm .comments, .sky div.rsvpForm .email {
	margin: 20px 0 0 20px;
}
.sky div.rsvpForm input {
	border: 1px solid #c7c3e8;
	line-height: 40px;
	height: 40px;
	font-size: 1.2em;
	font-family: 'Quicksand', Arial, serif;
	padding: 0 5px;
	background: #effdff;
	width: 400px;
}
.sky div.rsvpForm textarea {
	border: 1px solid #c7c3e8;
	font-size: 1.2em;
	font-family: 'Quicksand', Arial, serif;
	padding: 0 5px;
	width: 400px;
	height: 100px;
	background: #effdff;
}
.sky div.rsvpForm input.button {
	position: absolute;
	right: 0;
	bottom: 0;
	border: none;
	background: #c7c3e8;
	font-size: 2.2em;
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
	padding: 0 20px;
	line-height: 63px;
	height: 63px;
	cursor: pointer;
	width: auto;
}
.sky div.rsvpForm input.button:hover {
	background: #000;
}
.sky div.rsvpForm strong.error {
	position: absolute;
	right: 0;
	bottom: 76px;
	font-size: 0.9em;
	color: #B52763;
	font-weight: bold;
	display: none;
}

/* rsvp evening mods */
.evening #banner .inner {
    background: url(../images/skyRSVPevening.png) no-repeat 50% 0;
}
.evening span.vegetarian, .evening span.gluten, .evening span.wine {
	display: none;
}
.evening span.attending {
    left: 802px;
}

/* rsvp completed */
.completed .form {
	display: none;
}
p.already, .completed p.intro, .completed h1, .completed span.title {
	display: none;
}
.completed p.already {
	display: block;
	line-height: 1.4em;
}
.completed #banner {
    background: url(../images/bgExtra.png) repeat-x 0 0;
}
.completed #banner .inner {
	height: 832px;
    background: url(../images/extraThanks.png) no-repeat 50% 0;
	margin: 80px auto 0;
}
body.completed {
	background: #BBDEAC;
}

.completed div.rsvpForm {
    top: 0;
	padding: 0;
}

/* taxi popup */
.taxiList {
	background: #fff; 
	padding: 20px;
}
.taxiList h3 {
	font-size: 1.3em;
	font-weight: bold;
	margin-bottom: 10px;
}
.taxiList li {
	line-height: 1.6em;
}
.taxiList li em {
	font-weight: bold;
}







/* pretty photo */
div.light_square .pp_close { width: 17px; height: 17px; background: url(../images/prettyPhoto/close.jpg) center center no-repeat; right: -7px; top: 15px; }
div.light_rounded .pp_top .pp_middle,div.light_rounded .pp_content_container .pp_left,div.light_rounded .pp_content_container .pp_right,div.light_rounded .pp_bottom .pp_middle,div.light_square .pp_left,div.light_square .pp_middle,div.light_square .pp_right,div.light_square .pp_content,div.facebook .pp_content{ background: transparent; }





/* gallery */
/*
.screen-shots { position: relative; overflow: hidden; margin: 0px auto 50px; }
.screen-shots ul { margin: 0px 0px 50px; }
.screen-shots ul li { width: 240px; height: 300px; float: left; }
.screen-shots ul li img { max-width: 240px; max-height: 300px; }
.screen-shots ul li img.colored { display: none; }
.screen-shots ul li:hover img.colored { display: block; }
.screen-shots ul li:hover img.black-white { display: none; }
.screen-shots .arrows { position: absolute; top: 35px; right: 0px; }
.screen-shots .arrows a { float: left; display: block; width: 40px; height: 40px; background: url(../images/arrows.png) no-repeat; }
.screen-shots .arrows a.next { background-position: right center; }
.screen-shots .arrows a.prev { background-position: left center; margin-right: 4px; }
*/