@charset "UTF-8";
/* CSS Document */

html, body {
	font-family: 'Playfair Display SC', serif;
}
a, a:active, a:visited {
	color: black;
}
p {
	font-family:Montserrat
}

#topBorder {
	width:100%;
	height:60px;
	background-image:url(../images/border.png);
	position: absolute;
	top:0px;
	left:0px;
}
#leftBorder {
	width:60px;
	height:calc(100% - 120px);
	background-image: url(../images/border_v.png);
	position:absolute;
	top:60px;
	left:0px;
}
#rightBorder {
	width:60px;
	height:calc(100% - 120px);
	background-image: url(../images/border_v.png);
	position:absolute;
	top:60px;
	right:0px;
}
#bottomBorder {
	width:100%;
	height:60px;
	background-image: url(../images/border.png);
	position:absolute;
	bottom:0px;
	left:0px;
}
#frontispiece {
	width:500px;
	height:375px;
	text-align: center;
	font-size:40px;
	position:absolute;
	top:calc(50% - 188px);
	left:calc(50% - 250px);
	font-family: 'Playfair Display SC', serif;
	font-stretch: expanded;
	letter-spacing: 4px;
}
#fp-photo{
	width:100%;
	height:100%;
	position: absolute;
	background-image: url(../images/frontispiece_photo_lr.jpg);
	z-index: 10;
}
nav {
	position: absolute;
	top: 45px;
	width:680px;
	left:calc(50% - 340px);
	text-align: center;
}

nav.wtw {
	top: 105px;
}

nav ul {
	padding: 0px;
}
nav ul li {
	display: inline-block;
	padding:10px;
}
		
#countdown {
	position: absolute;
	width:500px;
	text-align: center;
	left:calc(50% - 250px);
	bottom:100px;
}
.seconds {
	display: inline-block;
	width:20px;
}
#kateSashaMap{
	height:100%;
	width:50%;
	float:left;
}
#mapInfoWrapper{
	width:calc(50% - 30px);
	height:100%;
	overflow: auto;
	float:left;
	padding:0px 15px;
}
#intro p {
	font-family: Montserrat;
}
#intro p:first-child {
	margin-top: 0px;
}
h1.subpage{
	position: absolute;
	top:70px;
	text-align: center;
	width:100%;
}
span.hideLink, span.showLink {
	text-decoration: underline;
	cursor: pointer;
}
span.hideLink {
	display: none;
}
div#main {
	position: absolute;
	left:60px;
	right:60px;
	top:140px;
	bottom:60px;
	overflow: auto;
}
#checklist h2 {
	margin-bottom: 0px;
	text-transform: capitalize;
	display: inline;
	margin-top:10px;
}
#checklist h3.locTitle {
	margin: 0px;
	cursor:pointer;
}
#checklist p.content {
	display: none;
	margin-top: 0px;
	margin-left: 25px;
}
#checklist ul {
	margin-top:0px;
}
p.showHideDescriptions {
	margin-top: 0px;
	display:inline;
}
h1.markerTitle{
	font-family: 'Playfair Display SC', serif;
	font-size: 18px;
	max-width: 300px;
}
p.markerContent{
	max-width:300px;
}
div.category{
	margin-top:10px;
}
#quote {
	border: 1px solid black;
	background:lightgrey;
	padding:10px;
	float:left;
	width: calc(30% - 22px);
}
#registryIntro {
	margin-left:20px;
	width:calc(70% - 20px);
	float:left;
	min-height:200px;
}
#quoteText {
	font-size:20px;
	font-family: Macondo;
}
table#registryTable{
	clear:both;
}
#storyImg {
	float:left;
	margin-right:20px;
}

h2.toast, h2.vows {
	margin-top:0px;
}

@media only screen and (max-width: 768px) {
    /* For mobile phones: */
	
	#kateSashaMap, #mapInfoWrapper, #storyImg, #storyContent{
		float:none;
	}
	#kateSashaMap, #mapInfoWrapper {
		width:100%;
	}
	#kateSashaMap {
		height:400px;
		margin-bottom:15px;
	}
	#topBorder, #leftBorder, #rightBorder, #bottomBorder{
		display: none;
	}
	div#main {
		position: static;
		left:inherit;
		right:inherit;
		top:inherit;
		bottom:inherit;
		overflow: inherit;
	}
	h1.subpage {
		position: static;
	}
	nav, #frontispiece, #countdown {
		position: relative;
		top:0px;
	}
	h1, h2, h3, h4 {
		font-weight: normal;
	}
	
	h2.toast, h2.vows {
		margin-top:inherit;
	}
}