/*
        Erik Quick-Warner
        http://www.quickproductions.net
        
        
font-family: 'Poiret One', cursive;
font-family: 'Quicksand', sans-serif;
font-family: 'Raleway', cursive;

        
*/


/*
    Custom fonts
*/

/* 
	Resets defualt browser settings
	reset.css
*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
:focus { outline:0; }
a:active { outline:none; }
body { line-height:1; background:white; }
ol,ul { list-style:none; }
table { border-collapse:separate; border-spacing:0; }
caption,th,td { text-align:left; font-weight:normal; }
blockquote:before,blockquote:after,q:before,q:after { content:""; }
blockquote,q { quotes:"" ""; }

/*

    
}


.edwardian	{font-family: "edwardian"; color: white ; font-size: 14pt; }
.date		{font-size: 30pt;}

/*
    RESET
*/

*                       { margin:0px; }
html                    { overflow-y: scroll; height: 100%; width: 100%; }
body                    { min-width: 1024px; height: 100%; margin:0 auto; color: #000000; font-size: 100%; font-weight: 800; font-family: 'Quicksand', sans-serif;  ; font-weight: 400; font-size: 16pt; height: 100%; }
ol                      { list-style: none }
p 						{ text-align: left; padding-bottom: .5em; }
a                       { outline: none; text-decoration: none; }
a img                   { border: none; }
img                     { text-align: center; display: block;}
table                   { border-collapse: collapse; }
a:link {
	color: #000;
}
a:visited {
	color: #000;
}
a:hover {
	color: #ff7777;
}
a:active {
	color: #ff7777;
}

/*
    UTILITY
*/

h1	{font-family: 'Quicksand', sans-serif; font-size: 54px; font-weight: 400; padding: 30px; text-align: center;}
h1 .white {color: #f7f8f3; font-family: 'Quicksand', sans-serif; font-size: 54px; font-weight: 400; padding: 30px; text-align: center;}
h2	{font-family: 'raleway', cursive; font-size: 34px; font-weight: 400; text-align: center; text-decoration: underline; font-weight: bold; margin-bottom: 30px; }
h50	{font-size: 24px;}

.details	{font-size: 24px; padding-bottom: 0px;}


.floatleft              { float: left; }
.floatright             { float: right; }
.clear                  { clear: both; }
.button                { border: 2px solid #272727; background: #1492d4;
                          padding: 3px 8px;
                          -moz-border-radius: 8px; -webkit-border-radius: 5px ;
                          color: white; display: block; }
.button:hover        {background: #932893; color: black; }

.updates				{ font-weight: 800; font-size: 130%; text-align: center}

.white					{ color: white; font-weight: 100}

.c						{font-family: "Arial"; font-weight: 100}

.small					{font-size: small; font-style: italic}

.recent-post			{ font-size: 90%; }

.pushaway				{}

.strong					{font-weight: 500}

.strong2				{font-weight: 400; }

.readmore				{font-style: italic}

.pages ul				{list-style: none; }

.pages ul li			{list-style: none; }

.pages ul li li			{list-style: none; }

.pages li				{list-style: none; }

.copyright				{margin-bottom: .1em;}

.mint					{color: #b3f2dd}

.coral					{color: #fa6760}

.cream					{color: #f6f9f2}

.card					{padding-top: 200px; }

.underline a:link, a:hover, a:active, a:visited {text-decoration: underline;}

.medium					{font-size: medium}


.padding-top			{padding-top: 15px;}

.bigday-image			{padding: 0 10px 10px 0;}

.by {font-size: 18px; font-weight: bold;}	

.center	{text-align: center; margin: 0 auto;}

.bold	{font-size: 22px;font-weight: bold;}

.poem	{text-align: center;}

.poem a:link {color: #ff7777;}
.poem a:visited {color: #ff7777;}
.poem a:hover{color: #81c5b6}
.poem a:active {color: #81c5b6}

.poem2 a:link {color: #51504F; text-decoration: underline;}
.poem2 a:visited {color: #51504F;}
.poem2 a:hover{color: #ff7777}
.poem2 a:active {color: #ff7777}

#portfolio_list ul li	{display: inline; list-style-type: none; padding-right: 20px; }


/* Use for images. Margins work top, right, bottom, left */

.imgright 				{ float: right; margin: 0 0 2px 10px; display: inline; }
.imgleft 				{ float: left; margin: 0 0px 0; vertical-align: top;border: solid black 1px; }

#save-the-date	{ padding-top: 20px; background-image:url(images/texture-chevron.png); background-repeat: repeat; margin: 0 auto; width: 100%; text-align: center;

min-height: 100%; 
    height: auto !important; /*Cause footer to stick to bottom in IE 6*/
    height: 100%; 
    
 }

#wrap		{ width: 100%; height:100%; margin:0 auto;    } /* "auto" makes the left and right margins center the wrapper */

#nav		{ margin: 0 auto; width: 900px; height: 128px; padding: 10px 0;  }


#content	{  width: 800px; height: 100%; margin: 0 auto; font-size: 18px; text-align: left; background-image: url(images/content-bg.png); padding: 40px 60px 40px 60px; -moz-box-shadow: 0 0 25px -2px #000; -webkit-box-shadow: 0 0 25px -2px #000;
box-shadow: 0 0 25px -2px #000; border-radius: 10px; border: dashed inside;
}

#content-top	{ width: 800px; margin: 0 auto; font-size: 18px; text-align: left; padding: 10px 60px 0px 60px;}
#content-rsvp	{  width: 800px; height: 525px; margin: 0 auto; font-size: 18px; text-align: center; background-image: url(images/content-bg.png); padding: 40px 60px 40px 60px; -moz-box-shadow: 0 0 25px -2px #000; -webkit-box-shadow: 0 0 25px -2px #000;
box-shadow: 0 0 25px -2px #000; border-radius: 10px; border: dashed inside;
}

#content-reg	{  width: 800px; height: 400px; margin: 0 auto; font-size: 18px; text-align: center; background-image: url(images/content-bg.png); padding: 40px 60px 40px 60px; -moz-box-shadow: 0 0 25px -2px #000; -webkit-box-shadow: 0 0 25px -2px #000;
box-shadow: 0 0 25px -2px #000; border-radius: 10px; border: dashed inside;
}

#content-crew	{  width: 800px; margin: 0 auto; font-size: 18px; text-align: center; background-image: url(images/content-bg.png); padding: 40px 60px 40px 60px; -moz-box-shadow: 0 0 25px -2px #000; -webkit-box-shadow: 0 0 25px -2px #000;
box-shadow: 0 0 25px -2px #000; border-radius: 10px; border: dashed inside; overflow: hidden; 
}

#photo-container	{width: 360px; float: left;  }
#photo-wrap	{width: 720px; margin: 0 auto; clear: both;}

#path		 {margin: 0 auto; height: 1000px; width: 300px; background-image: url(images/travel-path-wide.png); background-repeat: repeat-y; }


#info	{margin: 10px 0px 5px 0px; float: none; overflow: hidden;}

#info-ot	{margin: 10px 0px 5px 0px; float: none; height: 200px; overflow: hidden;}

#bg			{background-image: url(images/texture-chevron.png.jpg); background-repeat: repeat; height: 100%; width: 100%; }

#welcome	{ background-image: url(images/texture-chevron.png); background-repeat: repeat; margin: 0 auto; width: 100%; margin:0 auto; text-align: center; overflow: hidden;}

#our-story { width: 100%; background-image:url(images/charcoal-hatch.jpg) ; background-repeat: repeat; margin: 0 auto; }

#the-big-day { width: 100%; background-image:url(images/coral-bg.jpg) ; background-repeat: repeat; margin: 0 auto; }

#the-crew { width: 100%; height: 100%; background-image:url(images/mint-bg.jpg) ; background-repeat: repeat; margin: 0 auto; }

#photos { width: 100%; background-image:url(images/charcoal-hatch.jpg) ; background-repeat: repeat; margin: 0 auto; }

#gifts { width: 100%; background-image:url(images/coral-bg.jpg) ; background-repeat: repeat; margin: 0 auto; }

#rsvp { width: 100%; background-image: url(images/mint-floral-bg.jpg) ; background-repeat: repeat; margin: 0 auto; }

#thumb	{ float: left;  }

#detail { padding-left: 20px; float: left; overflow: auto; font-size: 14px; width: 700px;}

#floatclear	{float: none;}

#divide	{ width: 700px; height: 40px; background-position: center; background-image: url(images/divider-2.png); margin: 0 auto; background-repeat: no-repeat; }

#californos-detail	{float: left; width: 400px; padding-left: 20px;}
#hotel-detail {float: left; width: 550px; padding-left: 20px;}

#center	{margin: 0 auto;}

#clear {clear: both;}

#rsvp-form {float: left;}
#polaroid-paint {float: right; vertical-align: middle; }


#navlist {position:relative; vertical-align: middle;}
#navlist li {margin:0;padding:0;list-style:none;position:absolute;top:0; vertical-align: middle;}
#navlist li, #navlist a {height: 110px; display: block; vertical-align: middle; }

#a { left:0px; width: 120px; background: url(images/nav.png) 0 0;}
#b { left:142px; width: 116px; background: url(images/nav.png) -120px 0;}
#c { left:279px; width: 141px; background: url(images/nav.png) -237px 0;}
#d { left:442px; width: 117px; background: url(images/nav.png) -379px 0;}
#e { left:581px; width: 79px; background: url(images/nav.png) -497px 0;}
#f { left:682px; width: 95px; background: url(images/nav.png) -577px 0;}
#g { left:799px; width: 97px; background: url(images/nav.png) -673px 0;}

#a a:hover{background: url(images/nav.png)  0 -110px;}
#b a:hover{background: url(images/nav.png) -120px -110px;}
#c a:hover{background: url(images/nav.png) -237px -110px;}
#d a:hover{background: url(images/nav.png) -379px -110px;}
#e a:hover{background: url(images/nav.png) -497px -110px;}
#f a:hover{background: url(images/nav.png) -577px -110px;}
#g a:hover{background: url(images/nav.png) -673px -110px;}

#a-mint { left:0px; width: 120px; background: url(images/nav-mint.png) 0 0;}
#b-mint { left:142px; width: 116px; background: url(images/nav-mint.png) -120px 0;}
#c-mint { left:279px; width: 141px; background: url(images/nav-mint.png) -237px 0;}
#d-mint { left:442px; width: 117px; background: url(images/nav-mint.png) -379px 0;}
#e-mint { left:581px; width: 79px; background: url(images/nav-mint.png) -497px 0;}
#f-mint { left:682px; width: 95px; background: url(images/nav-mint.png) -577px 0;}
#g-mint { left:799px; width: 97px; background: url(images/nav-mint.png) -673px 0;}

#a-mint a:hover{background: url(images/nav.png)  0 -110px;}
#b-mint a:hover{background: url(images/nav.png) -120px -110px;}
#c-mint a:hover{background: url(images/nav.png) -237px -110px;}
#d-mint a:hover{background: url(images/nav.png) -379px -110px;}
#e-mint a:hover{background: url(images/nav.png) -497px -110px;}
#f-mint a:hover{background: url(images/nav.png) -577px -110px;}
#g-mint a:hover{background: url(images/nav.png) -673px -110px;}


/* SLIDER */

#container {
	width:778px;
	padding:10px;
	margin:0 auto;
	position:relative;
	z-index:0;
}

#example {
	width:778px;
	height:512px;
	position:relative;
}

#ribbon {
	position:absolute;
	top:-3px;
	left:-15px;
	z-index:500;
}

#frame {
	position:absolute;
	z-index:0;
	width:1000px;
	height:640px;
	top:-12px;
	left:-112px;
}

/*
	Slideshow
*/

#slides {
	position:absolute;
	top:15px;
	left:4px;
	z-index:100;
	width: 768;
}

/*
	Slides container
	Important:
	Set the width of your slides container
	Set to display none, prevents content flash
*/

.slides_container {
	width:768px;
	overflow:hidden;
	position:relative;
	display:none;
}

/*
	Each slide
	Important:
	Set the width of your slides
	If height not specified height will be set by the slide content
	Set to display block
*/

.slides_container a {
	width:768px;
	height:512px;
	display:block;
}

.slides_container a img {
	display:block;
}

/*
	Next/prev buttons
*/

#slides .next,#slides .prev {
	position:absolute;
	top:225px;
	left:-48px;
	width:24px;
	height:43px;
	display:block;
	z-index:101;
}

#slides .next {
	left:790px;
}

/*
	Pagination
*/

.pagination {
	margin:40px auto 0;
	width:220px;
}

.pagination li {
	float:left;
	margin:0 1px;
	list-style:none;
}

.pagination li a {
	display:block;
	width:12px;
	height:0;
	padding-top:12px;
	background-image:url(../img/pagination.png);
	background-position:0 0;
	float:left;
	overflow:hidden;
}

.pagination li.current a {
	background-position:0 -12px;
}

.noflow	{}


/*SLIDES TWO*/


#slides_two .slides_container {
			width:250px;
			display:none;
		}

		/*
			Each slide
			Important:
			Set the width of your slides
			If height not specified height will be set by the slide content
			Set to display block
		*/
		
		#slides_two .slides_container div {
			width:300px;
			height:250px;
			display:block;
		}

            
            
/*REGISTRY*/


#reg {position:relative; vertical-align: middle; margin: 0 auto;}
#reg li {margin:0;padding:0;list-style:none;position:absolute;top:0; vertical-align: middle;}
#reg li, #reg a {height: 124px; display: block; vertical-align: middle; }

#macys { left:20px; width: 200px; background: url(images/registries.png) 0 -500px;}
#bbb { left:280px; width: 200px; background: url(images/registries.png) 0 0px;}
#mr { left:540px; width: 200px; background: url(images/registries.png) 0 -250px;}

#macys a:hover { background: url(images/registries.png) 0 -625px;}
#bbb a:hover { background: url(images/registries.png) 0 -125px;}
#mr a:hover { background: url(images/registries.png) 0 -375px;}






div#reg
{width: 900px; height: 150px;
padding:5px;
float: left;}



#reg li{
height:124px;
width: 200px;
list-style-type:none;
display:block;
margin:3px 0 3px 0px;
font-size: 46px;
}
li.macys a{
background:url('images/registries.png') no-repeat;
background-position:0px -500px;
padding-left:58px;
}
li.macys a:hover {
background:url('images/registries.png') no-repeat 0 -625px;
color:#F3AE08;
}
li.bbb a  {
background:url('images/registries.png') no-repeat 0px -0px;
padding-left:58px;
}
li.bbb a:hover {
background:url('images/registries.png') no-repeat 0px -125px;
color:#F3AE08;
}
li.hd a  {
background:url('images/registries.png') no-repeat 0px -250px;
padding-left:58px;
}
li.hd a:hover {
background:url('images/registries.png') no-repeat 0px -375px;
color:#F3AE08;
}

/* crafty letterpress-style buttons, in the site's mint & coral palette */
.crafty-btn {
  font-family: 'Raleway', cursive;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: 3px;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-block;
  padding: 14px 34px;
  border-radius: 3px;
  border: none;
  position: relative;
  top: 0;
  transition: top 0.08s ease, box-shadow 0.08s ease;
}
.crafty-btn-mint {
  background: #5fc3af;
  color: rgba(255,255,255,0.92);
  text-shadow: 0 -1px 1px rgba(0,0,0,0.38), 0 1px 0 rgba(255,255,255,0.22);
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.3), inset 0 -1px 0 rgba(255,255,255,0.2), 0 1px 1px rgba(0,0,0,0.2);
}
.crafty-btn-mint:hover { background: #4fae9a; }
.crafty-btn-coral {
  background: #e8695f;
  color: rgba(255,255,255,0.92);
  text-shadow: 0 -1px 1px rgba(0,0,0,0.38), 0 1px 0 rgba(255,255,255,0.22);
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.3), inset 0 -1px 0 rgba(255,255,255,0.2), 0 1px 1px rgba(0,0,0,0.2);
}
.crafty-btn-coral:hover { background: #d9564c; }
.crafty-btn:active {
  top: 1px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.35), inset 0 -1px 0 rgba(255,255,255,0.15);
}

/* custom video poster + play button (positioned lower to clear title text baked into the thumbnail) */
.video-frame { position: relative; cursor: pointer; }
.video-poster-overlay {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 8%;
  box-sizing: border-box;
}
.video-play-btn {
  width: 74px;
  height: 74px;
  border-radius: 50%;
  background: rgba(232,105,95,0.92);
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.3), inset 0 -1px 0 rgba(255,255,255,0.2), 0 2px 10px rgba(0,0,0,0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.15s ease, background 0.15s ease;
}
.video-poster-overlay:hover .video-play-btn { transform: scale(1.08); background: rgba(217,86,76,0.95); }
.video-play-btn::after {
  content: "";
  border-style: solid;
  border-width: 13px 0 13px 21px;
  border-color: transparent transparent transparent rgba(255,255,255,0.92);
  margin-left: 6px;
}