html, body {
	margin: 0;
	padding: 0;
	height:100%;
	background-color: #FFFFFF;
}
.titlefont {
	font-family: 'lobster', calibri;
	font-size:32px;
	text-shadow: #000 0 0 0;
}
.headingfont {
	font-family: 'lobster', calibri;
	font-size:24px;
	text-shadow: #000 0 0 0;
}
.titleontopof{
	position:absolute; 
	top:0; left:0; 
	width:100%;
}
body {
	font-family: 'Raleway', calibri;
	font-weight: 400;
	font-size:1.2em;
	line-height:1.3;
}
.centered {
	display: block;
	text-align: center;
}


/* body divs */
.page {
	position:relative; 
    height:100%;
    margin:0px;
    padding:0px;
}
.frame {
	border-radius: 8px;
	padding: 8px;
  	position:absolute; 
	top: 0; left: 0; bottom: 0; right: 0;
	margin-left: auto;
	margin-right: auto;
	margin-top: 90px;
	margin-bottom: 45px;
	width:1050px;
}
.matting {
	border-radius: 8px;
	padding: 8px;
  	position:absolute; 
	top: 0; left: 0; bottom: 0; right: 0;
	margin: 15px;
}
.content {
	display:none;
	background-color:#fffbf8; 
	border-radius: 8px;
	padding: 8px;
  	position:absolute; 
	top: 0; left: 0; bottom: 0; right: 0;
	margin: 15px;
    overflow:auto;
}
.content.arrows {
	padding-left:  58px;
	padding-right: 58px;
}
.arrow {
    display:block;
	padding:0px;
	margin:15px;
	opacity:0.4;
    background-position: center center; 
    background-repeat: no-repeat;
    background-size:contain; 
    width:30px;
	cursor: pointer; 
}  
.arrow:hover {
    display:block;
	padding:0px;
	margin:15px;
	opacity:1.0;
    background-position: center center; 
    background-repeat: no-repeat;
    background-size:contain; 
    width:30px;
	cursor: pointer; 
}
.arrow.left {
	position:absolute; 
	top: 0; left: 20px; bottom: 0; right: auto;
	background-image:url('http://cdn.coryrangeun.com/images/double-chevron-left.png');
} 
.arrow.right {
	position:absolute; 
	top: 0; left: auto; bottom: 0; right: 20px;
	background-image:url('http://cdn.coryrangeun.com/images/double-chevron-right.png');
}
.clickme {
	display:block;
	padding:0px;
	margin:15px;
	opacity:1.0;
    background-position: center center; 
    background-repeat: no-repeat;
    background-size:contain; 
    width:61px;
    position:absolute;
}
.clickme.left {	
	top: 0; left: 50px; bottom: 0; right: auto;
	background-image:url('http://cdn.coryrangeun.com/images/clickme3.png');
}
.clickme.right {	 
	top: 0; left: auto; bottom: 0; right: 50px;
	background-image:url('http://cdn.coryrangeun.com/images/clickme2.png');
}
.content img {
	position:relative; 
	height:100%; 
	max-width:100%; 
	max-height:100%; 
	display:block; 
	margin-left:auto; 
	margin-right:auto;	
}
.messages {
	position:relative;
}
.message {
	display:none;
	position:absolute; 
	top: 0; left: 0; bottom: 0; right: 0;
}

/* REGISTRY TABLE */
.logotable {
	border: 0;
}
.logotable td {
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
}
.logo {
	vertical-align: middle;
	width: 120px;
}
.logo img {
	width: auto;
	height: auto;
	max-width: 120px;
	max-height: 50px;
	/*width: 120px;
	height: auto;*/
}
.description{
	display: table-cell;
	width: 850px;
}

/* RSVP */
#rsvp-page input,
#msg-page input {
	width: 215px;
	height: 24px;
  font-size:24px;
	color: hsla(14, 85%, 76%, 1);
}
#rsvp-page textarea,
#msg-page textarea {
	width: 440px;
	height: 66px;
  font-family: 'Raleway', calibri;
  font-weight: 400;
  font-size:24px;
	color: hsla(14, 85%, 76%, 1);	
}
#rsvp-page .submit,
#msg-page .submit {
  width: 456px;
  height: 38px;
  font-family: 'Raleway', calibri;
  font-weight: 400;
  font-size:24px;
  border-style: ridge;
  border-width: 5px;
  color: hsla(12, 55%, 64%, 1);
  border-color: hsla(14, 85%, 76%, 1);
  background-color: hsla(14, 85%, 76%, 1);	
}
#contact-page input {
	width: 310px;
	height: 28px;
	font-family: 'Raleway', calibri;
	font-weight: 400;
	font-size:1em;
	line-height:1.2;
	color: hsla(150, 20%, 47%, 1);
}
#contact-page textarea {
	width: 306px;
	height: 44px;
	font-family: 'Raleway', calibri;
	font-weight: 400;
	font-size:1em;
	line-height:1.2;
	color: hsla(150, 20%, 47%, 1);	
}
#contact-page .submit {
  width: 320px;
  height: 38px;
  font-size: 28px;
  border-style: ridge;
  border-width: 5px;
  color: hsla(150, 20%, 47%, 1);
	border-color: hsla(102, 38%, 80%, 1);
	background-color: hsla(102, 38%, 80%, 1);
}

#rsvp-page .submit:hover,
#msg-page .submit:hover {
  color: hsla(14, 85%, 76%, 1);
  border-color: hsla(12, 55%, 64%, 1);
  background-color: hsla(12, 55%, 64%, 1);	
}
#contact-page .submit:hover {
  color: hsla(102, 38%, 80%, 1);
  border-color: hsla(150, 20%, 47%, 1);
  background-color: hsla(150, 20%, 47%, 1);
}
#rsvp-page table,
#msg-page table,
#contact-page table {
	margin-top:10px;
	margin-left: auto;
	margin-right: auto;
}
#msg-page td {
	width: 225px;
}
#rsvp-page td {
	width: 225px;
}
.rsvplabel {
	text-align: right;
}
/*
.rsvpinput {
	width: 390px;
}
*/
.contactlabel {
	width: 200px;
	text-align: right;
}
.contactinput {
	width: 330px;
}
.help {
    visibility:hidden;
    font-size:85%;
}
input:focus + .help,
textarea:focus + .help {
    visibility:visible;
    display:inline-block;
}

#rsvp-page input,
#rsvp-page textarea,
#msg-page input,
#msg-page textarea {
  border-width: 5px;
  border-style: ridge;
  border-color: hsla(14, 85%, 76%, 1);
}

#contact-page input,
#contact-page textarea {
  border-width: 5px;
  border-style: ridge;
  border-color: hsla(102, 38%, 80%, 1);
}

#contact-page .frame {
	margin-top: 15px;
	margin-bottom: 15px;
}

/* NAVIGATION */

#header{
	position: fixed; 
	top: 0; left: 0; 
	width: 100%; 
	height: 75px;
	margin:0;
	padding: 0;
	background-color:white;
	opacity:0.7;
	//filter:alpha(opacity=70);
	/* CSS3 standard */
	z-index: 100;
}
ul#navigation {
	display:block;
	padding:0px;
	text-align:center;
	cursor: pointer;
	margin:0px;
    height: 75px;
}
ul#navigation li {  
    display:inline-block;
	padding:0px;
	margin:0px;
    opacity:0.7;
    background-position: center top; 
    background-repeat: no-repeat;
    background-size:contain; 
    width:75px; 
    height:75px; 
}  
#photo {background-image:url('http://cdn.coryrangeun.com/images/photo.jpg');}
#love {background-image:url('http://cdn.coryrangeun.com/images/love.jpg');}
#story {background-image:url('http://cdn.coryrangeun.com/images/story.jpg');}
#gift {background-image:url('http://cdn.coryrangeun.com/images/gift.jpg');}
#rsvp {background-image:url('http://cdn.coryrangeun.com/images/rsvp.jpg');}
#msg {background-image:url('http://cdn.coryrangeun.com/images/msg.jpg');}
#more {background-image:url('http://cdn.coryrangeun.com/images/more.jpg');}
ul#navigation li:hover, ul#navigation li.viewing {
	background-image:url('http://cdn.coryrangeun.com/images/heart.jpg'); 
}

/* Footer */

#footer{
	position: fixed; 
	bottom: 0; left: 0; 
	width: 100%; 
	height: 30px;
	margin:0px;
	padding:0px;
	z-index: 100;
	background-color:hsla(352, 100%, 80%, 0.3); /*pink hidden*/
	text-align:center;
	cursor: pointer;
}
#footer img{
	opacity: 0.3;
}
#footer:hover {
	background-color:hsla(352, 100%, 80%, 0.9); /*pink*/
}
#footer img:hover {
	opacity: 0.9;
}

/* Colors */
.green-dark1-bg  { background-color:hsla(150, 20%, 47%, 1); }
.green-dark1     {            color:hsla(150, 20%, 47%, 1); }
.green-light1-bg { background-color:hsla(102, 38%, 80%, 1); }
.green-light1    {            color:hsla(102, 38%, 80%, 1); }
.pink-dark-bg    { background-color:hsla(355, 96%, 66%, 1); }
.pink-dark       {            color:hsla(355, 96%, 66%, 1); }
.pink-light-bg   { background-color:hsla(353, 98%, 80%, 1); }
.yellow-dark-bg  { background-color:hsla(44, 92%, 81%, 1); }
.yellow-dark     {            color:hsla(44, 92%, 81%, 1); }
.yellow-light-bg { background-color:hsla(53, 94%, 87%, 1); }
.green-dark2-bg  { background-color:hsla(81, 44%, 43%, 1); }
.green-dark2     {            color:hsla(81, 44%, 43%, 1); }
.green-light2-bg { background-color:hsla(84, 36%, 59%, 1); }
.peach-dark-bg   { background-color:hsla(12, 55%, 64%, 1); }
.peach-dark      {            color:hsla(12, 55%, 64%, 1); }
.peach-light-bg  { background-color:hsla(14, 85%, 76%, 1); }
.purple-dark-bg  { background-color:hsla(335, 22%, 23%, 1); }
.purple-dark     {            color:hsla(335, 22%, 23%, 1); }
.purple-light-bg { background-color:hsla(335, 52%, 43%, 1); }

/* construction */
div#header .construction, div.page.construction {
	display: none;
}

/*
.skyblue {
	color:hsla(214,35%,77%,0.4);
}
.blue {
	color:hsla(214,31%,69%,1);
}
.purple {
	color:hsl(274,35%,77%);
}
.red {
	color:hsl(334,35%,77%);
}
.green {
	color:hsl(94,35%,77%);
}
.teal {
	color:hsl(154,35%,77%);
}
*/