@font-face {
  font-family: 'SuisseWorks';
  src:
       url('../fonts/SuisseWorks-Regular-WebXL.woff') format('woff'),
       url('../fonts/SuisseWorks-Regular-WebXL.ttf')  format('truetype');
}

@font-face {
  font-family: 'SuisseWorks-Italic';
  src:
       url('../fonts/SuisseWorks-RegularItalic-WebS.woff') format('woff'),
       url('../fonts/SuisseWorks-RegularItalic-WebS.ttf')  format('truetype');
}

@font-face {
	font-family: 'SuisseIntl';
	src:
       url('../fonts/SuisseIntl-Regular-WebXL.woff') format('woff'),
       url('../fonts/SuisseIntl-Regular-WebXL.ttf')  format('truetype');
}


*,
*:after, 
*:before {
	margin: 0;
	box-sizing: border-box;
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
	font-weight: normal;
	text-decoration: none;
	color: inherit;
	font-kerning: auto;
}

*::selection {
  background: transparent;
  color: #C97761;
}

body {
	font-family: 'SuisseWorks', 'Times New Roman', Times, serif;
	font-size: 3vw;
}

/* PRELOADER */

#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#000;
    z-index:99;
}

#status {
    width:500px;
    height:500px;
    position:absolute;
    left:50%;
    top:42%;
    background-image:url(../links/loading.gif);
    background-repeat:no-repeat;
    background-position:center;
    margin:-250px 0 0 -250px; /* is width and height divided by two */
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
		#status {
		    background-image:url(../links/loading@2x.gif);
		    background-size: 500px 500px;
		}
}

.half-spacer {
	padding-bottom: 2.5em;
}

.spacer {
	padding-bottom: 5em;
}

/* TYPOGRAPHY */

h1 {
	font-size: 8.25vw;
    line-height: 1.2em;
    letter-spacing: -.018em;
    padding-bottom: 0.65em;
    font-weight: normal;
}

h2 {
	font-size: 5.5vw;
    line-height: 1.25em;
    letter-spacing: -.018em;
    padding-bottom: 0.55em;
    font-weight: normal;
}

p {
	font-size: 2.85vw;
    line-height: 1.4em;
    letter-spacing: -.015em;

}

a {
	border-bottom: 2px solid #000;
	color: #000;
	font-family: 'SuisseIntl', arial, sans-serif;
}

p a {
	font-size: 2.75vw;
	letter-spacing: 0em;
}

#small,
#small a {
	font-size: 1.85vw;
    line-height: 1.45em;
    letter-spacing: -.015em;
}

a:hover {
	color: #C97761;
	border-bottom: 2px solid #C97761;
}

i {
	font-family: 'SuisseWorks-Italic', 'Times New Roman', Times, serif;
	font-style: normal;
}

p i a {
	font-family: 'SuisseIntl', arial, sans-serif;
	font-style: italic;
}

.heading {
	text-align: center;
	padding-bottom: 1.2em;
	text-transform: uppercase;
}

.text-block {
	padding: 0 4em;
}

.indent {
	text-indent: 7.2rem;
}

.center {
	text-align: center;
}

#full-height {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	text-align: center;
	padding-bottom: 3em;
	width: 100vw;
	height: 100vh;
	border-top: 2px solid #000;
}

.half {
	width: 46.9%;
	display: inline-block;
	vertical-align: top;
}

.half:nth-child(odd) {
	margin-right: 5%;
}

.half img {
	width: 100%;
	padding: 2rem 0;
}

.popup {
	text-decoration: none;
	border-bottom-style: dotted; 
}

.popup a:hover {
	color: #C97761;
	border-bottom: 2px dotted #C97761;
}

.popup span {
	display: none;
}

.popup:hover span {
/*	display: block !important;*/
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	width: 65%;
	z-index: 99;
}

.popup span img {
	width: 100%;
}

.box {
	border: 2px solid #000;
	padding: 0 0.5rem;
}

.wrapper {
	transition: background .2s ease;
}

input {
	display: none;
	visibility: hidden;
}

label {
	display: inline-block;
	font-size: 1.85vw;
	line-height: 1.45em;
	letter-spacing: -.015em;
	margin-bottom: 3.5rem;
	border-bottom: 2px solid #000;
	color: #000;
	font-family: 'SuisseIntl', arial, sans-serif;
}

label:hover {
	color: #000;
}

label::before {
	content: "↑ View less ideas";
}

#expand {
	display: block;
	height: auto;
	overflow: hidden;
	transition: height 0.5s;
}

#expand section {
}

#toggle:checked ~ #expand {
  display: none;
}

#toggle:checked ~ label::before {
  content: "↓ View more ideas";
}

@media only screen and (max-width : 768px) {

	body,
	p,
	#small {
		font-size: 3.5vw;
	}

	h1 {
		font-size: 10.25vw;
	}

	h2,
	h2 a {
		font-size: 6.75vw;
	}

	a,
	p a,
	#small a,
	label {
		font-size: 3.4vw;	
	}

	.indent {
		text-indent: 5.2rem;
	}

	.half {
		width: 100%;
	}

	.text-block {
		padding: 0 2em;
	}

	#registry {
		height: 100vh;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.hide-tablet {
		display: none;
	}

}

@media only screen and (max-width : 550px) {

	body,
	p,
	#small {
		font-size: 5.1vw;
	}

	h1 {
		font-size: 15.0vw;
    	padding: 0 1.5rem 3.5rem;
	}

	h2 {
		font-size: 9.75vw;
		line-height: 1.3em;
	}

	h2 a {
		font-size: 9.5vw;
	}

	a,
	p a,
	#small a,
	label {
		font-size: 4.8vw;
		border-bottom: 1px solid;	
	}

	a.popup {
		border-bottom: 2px dotted !important;	
	}

	.indent {
		text-indent: 2.5rem;
	}

	.text-block {
		padding: 0 1em;
	}

	.hide-mobile {
		display: none;
	}

	.popup:hover span {
		width: 90%;
	}

	.box {
		border: 1px solid #000;
	}
}


/* NAV */

.navigation {
	width: 100%;
	position: fixed;
	bottom: 0;
	padding: 0.5em;
	text-align: center;
    font-family: 'SuisseWorks', 'Times New Roman', Times, serif;
    letter-spacing: -.01em;
    z-index: 98;
}

.navigation a {
	color: #000;
	border-bottom: 0;
	font-family: 'SuisseWorks', 'Times New Roman', Times, serif;
	padding-bottom: 2px;
    transition: color 0.3s ease;
}

.navigation a:hover {
	color: #C97761;
	border-bottom: 2px solid #C97761;
}

@media only screen and (max-width : 768px) {

	.navigation {
		padding: 1em;
	}
}

@media only screen and (max-width : 550px) {

	.navigation {
		padding: 0 1em 1em;
    	font-size: 2.1vw;
	}

}

/* INTRO */

.intro {
	width: 100vw;
	height: 100vh;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

#img-1 {
	position: absolute;
	top: -8%;
	left: -8%;
	width: 70%;
	opacity: 0.8;
	-ms-transform: rotate(10deg);
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
}

#img-2 {
	position: absolute;
	top: 50%;
	right: 0;
	width: 55%;
	opacity: 0.8;
}


#img-3 {
	position: absolute;
	top: 50%;
	left: -5%;
	width: 55%;
	opacity: 0.8;
}

#img-4 {
	position: absolute;
	top: 20%;
	right: 16%;
	width: 70%;
	opacity: 0.8;
}

#img-5 {
	position: absolute;
	top: -9%;
	right: 3%;
	width: 55%;
	opacity: 0.8;
	-ms-transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
}

@media only screen and (max-width : 768px) {

	#img-1 {
		top: 3%;
		width: 85%;
	}

	#img-2 {
		top: 54%;
		width: 75%;
	}


	#img-3 {
		top: 66%;
		width: 76%;
	}

	#img-4 {
		top: 35%;
		width: 75%;
	}

	#img-5 {
		top: 0%;
		width: 75%;
	}

}

@media only screen and (max-width : 550px) {
	#img-1 ,
	#img-2,
	#img-3,
	#img-4,
	#img-5 {
		width: 88%;
	}
}

/* RSVP */

#rsvp {
	border-bottom: 2px solid #000;
}


/* REGISTRY */

#registry h2 {
	text-align: center;
}


/* CAROUSEL */

#full-height-photos {
	text-align: center;
	width: 100vw;
	height: 100vh;
	border-top: 2px solid #000;
	overflow: hidden;
	color: #fff;
}

#photo-intro {
	display: flex;
	position: absolute;
	width: 100vw;
	height: 99vh;
	text-align: center;
	align-items: center;
	justify-content: center;
	z-index: 999;
	cursor: pointer;
}

#photo-intro h1 {
	padding-bottom: 0;
}

.carousel { 
	height: 100%;
}

.main-carousel {
	height: 100vh;
}

.carousel-cell-image,
.carousel-cell-image img {
  display: block;
  opacity: 0;
  -webkit-transition: opacity 1s;
          transition: opacity 1s;
}

.carousel-cell-image.flickity-lazyloaded,
.carousel-cell-image.flickity-lazyerror {
  opacity: 1;
}

.carousel-cell {
	width: 100%;
	height: 100vh;
}

.carousel img {
	width: 100%;
	margin: 0 2px;
	height: auto;
	top: 50%;
	transform: translateY(-50%);
}