/* Author: HM */

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,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;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

/* Style starts */

body {
  background: url('../images/brick-bg.jpg') repeat;
  background-attachment: fixed;
  font-family: Georgia, serif;
  font-size: 12pt;
  color: #333333;
  line-height: 150%;
}

* html body {
	text-align: center;
}

p {
	margin: 0px 0px 30px 0px;
}

.note {
	font-size: 10pt;
	color: #666;
	font-style: italic;
}
.subnote {
	font-size: 80%; 
	color: #666; 
	line-height: 135%; 
	font-style: italic;
}

h1, h2, h3 {
	font-weight: normal;
	letter-spacing: -1px;
	border-bottom: 4px double #333;
	color: #333;
	margin: 20px 0;
	padding-bottom: 10px;
	text-transform: uppercase;
}

h2 {
	padding-top: 100px;
}

h3 {
	margin: 0;
	padding: 0;
	border-bottom: 0px;
	font-weight: bold;
	font-family: Garamond;
	font-size: 17pt;
	letter-spacing: 0;
	text-transform: none;
}

h3 span, h4 span {
	color: #666; 
	font-size: 85%;
	font-weight: normal;
}

.subsection {
	margin-bottom: 20px;
	border-bottom: 1px dotted #7D746C;
	margin-top: 30px;
}

a {
  color: #96462C;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* Header and navigation */

#header {
  background-color: rgba(33,33,33,.70);  
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  box-shadow: 0px 0px 10px #333;
  z-index: 1000;
}

* html #header {
	position: absolute;
	top: expression(eval(document.body.scrollTop));
	background-color: #212121;
	filter: alpha(opacity = 70);
}

#navigation {
  text-align: center;
  padding: 17px 0;
}

#navigation ul {
  border-top: 4px double #CCC;
  border-bottom: 4px double #CCC;
  width: 100%;
  padding: 5px 0px;
  min-width: 850px;
}

#navigation ul li {
  display: inline;
  text-align: center;
  margin-right: 20px;  
}

#navigation ul li:last-child {
  margin-right: 0;
}

#navigation ul li a {
  color: #D3BF9D;
  font-size: 12pt;
  text-decoration: none;  
  text-transform: uppercase;
  
  -moz-transition-duration: .3s;
  -moz-transition-timing-function: ease-in;
  -webkit-transition-duration: .3s;
  -webkit-transition-timing-function: ease-in;
  transition-duration: .3s;
  transition-timing-function: ease-in;
}

#navigation ul li a:hover {
	text-shadow: 1px 1px 5px #666;
	color: #F9F2E5;
}

#navigation ul li a#home {
	background: url('../images/icon-home.png') no-repeat;
	width: 30px;
	height: 16px;
	text-indent: -9999px;
	display: inline-block;
	vertical-align: text-top;
	
	-moz-transition-duration: 0s;
	-webkit-transition-duration: 0s;
	transition-duration: 0s;
}

* html #navigation ul li a#home {
	text-indent: 0;
	background: url('');
	width: auto;
	height: auto;
	display: inline;
	vertical-align: middle;
}

#navigation ul li a#home:hover {
	background-position: bottom;
}

#spotlight {
  background: url('../images/spotlight.jpg') no-repeat;
  position: fixed;
  top: 0;
  left: 50%; 
  width: 1024px;
  height: 824px;
  z-index: -1;
  margin-left: -495px;
}

* html #spotlight {
	position: absolute;
	top: expression(eval(document.body.scrollTop));
}

/* Content areas */

#content {
  width: 900px;
  margin: 80px auto 100px;  
  text-align: left;
}

* html #content {
	position: relative;
	float: left;
	margin-bottom: 200px;
	left: 50%;
	margin-left: -450px;
}

#top-content, #bottom-content {
  background: url('../images/top-bg.png') no-repeat;
  width: 899px;
  height: 210px;
}
#bottom-content {
  background: url('../images/bottom-bg.png') no-repeat;
  position: relative;
  margin-top: -1px;
}

#main-content {
  background: url('../images/content-bg.png') repeat-y;
  width: 750px;
  padding: 20px 40px 0px;
  position: relative;
}

* html #main-content {
	width: 840px;
}

#main-content, #bottom-content {
  margin-left: 55px;
}

#save-the-date {
	padding: 80px 0;
}

* html #save-the-date {
	margin-top: -100px;
}

#save-the-date img {
  position: absolute;
  top: -185px;
  right: 55px;
} 

#save-the-date #headline {
	background: url('../images/headline.png');
	width: 329px;
	height: 132px;
	text-indent: -9999px;
	margin-top: -150px;
}

#save-the-date #date {
	background: url('../images/date.png');
	width: 357px;
	height: 50px;
	text-indent: -9999px;
}

#save-the-date #arrow {
	background: url('../images/arrow.png');
	width: 192px;
	height: 87px;
	display: block;
	margin-left: 170px;
}

.left-aligned {
	float: left;
	margin: 0px 20px 0px 0px;
	clear: left;
}

img.reception-img {
	width: 500px;
}

#hotel-info {
	float: left;
	width: 60%;
}

#stuff-to-do {
	float: right;
	width: 40%;
}

ul.random-list {
	margin-bottom: 20px;
	margin-top: 5px;
	float: left;
	width: 100%;
}

ul.random-list li {
	float: left;
	width: auto;
	margin-right: 10px;
	margin-bottom: 10px;
}

ul.random-list li a {
	background-color: #976B48;
	color: #F3E8D2;
	padding: 2px 5px;
	
	-moz-transition-duration: .2s;
	-moz-transition-timing-function: ease-in;
	-webkit-transition-duration: .2s;
	-webkit-transition-timing-function: ease-in;
	transition-duration: .2s;
	transition-timing-function: ease-in;
}

ul.random-list li a:hover {
	background-color: #725037;
	text-decoration: none;
}

ul.wedding-party {
	float: left;
	width: 48%;
}

ul.wedding-party.bride {
	float: right;
}

.wedding-party.groom {
	border-right: 5px dotted #D8CEBA;
}

ul.wedding-party li {
	float: left;
	position: relative;
	margin: 0px 0px 20px 0;
	height: 100px;
	width: 33%;
}

ul.wedding-party img {
	opacity: 0.85;
	filter:alpha(opacity=85);
	
	-moz-transition-duration: .3s;
	-moz-transition-timing-function: ease-in;
	-webkit-transition-duration: .3s;
	-webkit-transition-timing-function: ease-in;
	transition-duration: .3s;
	transition-timing-function: ease-in;
}

ul.wedding-party img.on-hover {
	display: none;
}


/* Use colored images on IE */
* html ul.wedding-party img {
	display: none;
}
* html ul.wedding-party img.on-hover {
	display: block;
}


/* Lightbox styles */
.lightbox-content {
	width: 520px;
	height: 300px;
	background: url('../images/card-bg.png') no-repeat;
	overflow: auto;
	padding: 35px;
	text-align: center;
}

* html .lightbox-content {
   width: 590px;
   height: 400px;
}

.lightbox-content img {
	height: 300px;
	width: 200px;
	float: left;
	margin-right: 20px;
}

.lightbox-content h3 {
	border: 0;
	padding-top: 15%;
	padding-bottom: 15px;
	font-family: Georgia, serif;
	font-weight: normal;
}

.lightbox-content h3 span {
	display: block;
	font-style: italic;
	color: #666;
	font-size: 11pt;
	font-weight: normal;
}

/*ul.wedding-party img {
	width: 200px;
	clip:rect(0px,100px,100px,0px);
	position: absolute;
}

#party-1 img { clip:rect(0px, 150px, 100px, 50px); left: -50px; }
#party-2 img { clip:rect(10px, 100px, 110px, 0px); top: -10px; }
#party-3 img { clip:rect(0px, 140px, 100px, 40px); left: -40px; }
#party-4 img { clip:rect(30px, 100px, 130px, 0px); width: 100px; top: -30px; }
#party-5 img { clip:rect(15px, 150px, 115px, 50px); width: 300px; top: -15px; left: -50px; }

#party-6 img { clip:rect(10px, 200px, 110px, 100px); left: -100px; top: -10px; }
#party-7 img { clip:rect(40px, 110px, 140px, 10px); top: -40px; left: -10px; width: 285px; }
#party-8 img { clip:rect(15px, 135px, 115px, 35px); left: -35px; top: -15px; width: 150px; }
#party-9 img { clip:rect(20px, 100px, 120px, 0px); width: 110px; top: -20px; }
#party-10 img { clip:rect(30px, 150px, 130px, 50px); width: 150px; top: -30px; left: -50px; }*/

/* Tooltip */
.tooltip {
	display:none;
	background:transparent url('../images/black_arrow.png');
	font-size:12px;
	height:70px;
	width:160px;
	padding:25px;
	color:#fff;	
	
	font-family: Helvetica, sans-serif;
}

* html .tooltip {
	width: 210px;
	height: 120px;
}

h2#weddingparty {
	padding-top: 140px;
}

.facts .count-1,
.facts .count-2,
.facts .count-3,
.facts .count-4,
.facts .count-5 {
	background: url('../images/1.png') no-repeat;
	width: 41px;
	height: 35px;
	display: inline-block;
	text-indent: -9999px;
	
	margin-right: 20px;
	margin-top: 5px;
	margin-bottom: 20px;
	float: left;
}

.facts .count-2 { background: url('../images/2.png') no-repeat; }
.facts .count-3 { background: url('../images/3.png') no-repeat; }
.facts .count-4 { background: url('../images/4.png') no-repeat; }
.facts .count-5 { background: url('../images/5.png') no-repeat; }

ul#registries {
	text-align: center;
}

ul#registries li {
	display: inline-block;
	margin-right: 17px;
	margin-left: 17px;
	margin-bottom: 35px;
	width: 200px;
}

* html ul#registries li {
	display: inline;
}

ul#registries li:last-child {
	margin-right: 0;
	margin-left: 0;
}

#bottom-content p#thankyou {
	position: absolute;
	top: 45%;
	left: 50%;
	color: #7E756D;
	font-size: 7pt;
	text-transform: uppercase;
	margin-left: -145px;
	letter-spacing: 1px;
}

#bottom-content p#signature {
	position: absolute;
	bottom: 40px;
	left: 30px;
	font-size: 7pt;
	color: #BAAEA3;
	font-style: italic;
}

.clear {
	clear: both;
	margin: 0;
	padding: 0;
	height: 0;
}