html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
blockquote,
pre,
p,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
}

html,
div,
article,
section,
main,
footer,
header,
form,
fieldset,
pre,
p,
code,
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="url"],
input[type="password"] {
	-ms-box-sizing:content-box;
	-moz-box-sizing:content-box;
	-webkit-box-sizing:content-box;
	box-sizing:content-box;
}

a:active,
a:hover {
	outline: 0;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

blockquote,
q {
	quotes: none;
}

q:before,
q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption,
th,
td {
	text-align: left;
	vertical-align: top;
}

thead th,
thead td {
	font-weight: bold;
	vertical-align: bottom;
}

a img,
th img,
td img {
	vertical-align: top;
}

button,
input,
select,
textarea {
	margin: 0;
}

textarea {
	overflow: auto;
	vertical-align: top;
	resize: vertical;
}

button {
	width: auto;
	overflow: visible;
}

input[type="reset"],
input[type="submit"],
input[type="file"],
input[type="radio"],
input[type="checkbox"],
select,
button,
a {
	cursor: pointer;
}

button:active,
button:focus {
	outline: none;
}

input::-moz-focus-inner,
button::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input[type="radio"],
input[type="checkbox"] {
	font-size: 110%;
	position: relative;
	margin-right: 3px;
	padding: 0;
}

input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
	-webkit-appearance: none;
}

hr {
	display: block;
	box-sizing: content-box;
	height: 1px;
	border: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}

img,
video,
audio,
embed,
object {
	max-width: 100%;
}

img,
video,
embed,
object {
	height: auto;
}

embed,
object {
	height: 100%;
}

img {
	vertical-align: middle;
	-ms-interpolation-mode: bicubic;
}

/* End of Reset */
h1 {
	font-size: 6vw;
	
	letter-spacing: 0.3vw;
	font-family: 'Playfair Display', serif;
	font-weight:700;

}
h2 {
	font-size: 2.1vw;
	letter-spacing: 0.4vw;
	margin-bottom: 0.5vw;
}

h3 {
	font-size: 1.4vw;
	letter-spacing: 0.4vw;
}
.fakeh2 {
	font-size: 2.1vw;
	letter-spacing: 0.4vw;
	margin-bottom: 0.5vw;
	font-weight:700;
}
.fakeh3 {
	font-size:1.4vw;
	letter-spacing:0.4vw;
	font-weight:700;
}
html {
	min-height:100%;
	width:100%;
}
body {
	font-family: 'Roboto', sans-serif;
	letter-spacing: 0.06vw;
	background-color:white;
	color:black;
	min-height: 100vh;
	color:#2f3a2f;
	color:black;
	font-size:1.1vw;
	width:100%;
}

#container {
	display:flex;
	align-items:center;
	flex-direction:column;
	width:100%;
	min-width:512px;
	min-height:100vh;
	justify-content:flex-start;
}

#content-container {
	display:flex;
	justify-content:flex-start;
	flex-direction:column;
	width:75%;
	min-width:512px;
	min-height:100vh;
	box-shadow:0px 0px 30px 2px #dad8d8;
	background-color:white;
	padding-left:2vw;
	padding-right:2vw;
	
}

#navbar {
	width: 100%;
	padding-bottom:1vw;
	padding-top:1vw;
}

#navbar ul {
	
	display: flex;
	overflow: hidden;
	
}

#navbar li {
	display:flex;
	list-style: none;
	width:100%;
	text-align:center;
}

#navbar a {
	flex-grow:1;
	padding-top: 0.6vw;
	padding-bottom: 0.6vw;
	font-size: 1vw;
	text-decoration:none;
	letter-spacing: 0.15vw;
	font-weight: 900;
	color:#2f3a2f;
	color:black;
}

#navbar a:hover {
	
	color:grey;

}

#header {
	text-align:center;
	padding-bottom:1vw;
	padding-top:2.2vw;
}
.content {
	width:100%;
}
.flex {
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
}
.roundedcorners {
	border-radius: 2px;
}

.mainpicture {
	 background:white url("/images/jandv_banner.jpg") no-repeat center;
	 
	 background-size: cover;
	 width: 100%;
	 min-height: calc(90vw / 3);
	
	 margin:0;
	 padding:0;
}
#largecontainer {
	visibility:hidden;
	
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, 0.815);

	display: flex;
	justify-content: center;
	flex-direction:column;
	align-items: center;
	position: fixed;
	left: 0;
	top: 0;
}
#largeengagementphoto {
	background:rgba(0, 0, 0, 0.815);
	visibility:hidden;
	width:92%;
	height:92%;
}
.taptoclose {
	
	
	color:white;
}
.infocentre {
	padding-top:2.4vw;
	padding-bottom:1.4vw;
	text-align:center;
}
.rsvp {
	border:solid 1px #dad8d8;
	width:50%;
	height:100%;
	border-radius:50px;
	letter-spacing:0.3vw;
	margin:0 auto;
	margin-top:1vw;
	margin-bottom:1.4vw;
	text-align:center;
	font-weight:900;
	font-size:180%;
	display:flex;
	background:#efefef;
}
.rsvp a {
	color:black;
	text-decoration:none;
	flex-grow:1;
	padding-top:1.4vw;
	padding-bottom:1.4vw;
}
.rsvp a:hover {
	color:grey;

}
.padding {
	padding-top:1.4vw;
	padding-bottom:1.4vw;
}

.photographer {
	font-size:80%;
	text-align: center;
}

#footer {
	text-align:center;
	min-width:512px;
	width:100%;
	font-style:italic;
	font-weight:700;
	padding-top:4vw;
	padding-bottom:4vw;
}
#backtotop {
	position:fixed;
	right:0;
	bottom:0;
	padding-right:3vw;
	padding-bottom:1vw;
	font-weight:500;
	
}
#backtotop a {
	color:black;
	text-decoration:none;
}
#google {
	width:100%;
	height:100%;
}
.spacer {
	height:900px;
}

.section {
	margin-top:8vw;
}
.sectiontitle {
	width:100%;
	margin-bottom:3vw;
	letter-spacing:0.2vw;
	font-weight:700;
	font-size:4vw;
	text-align:center;
	font-family: 'Playfair Display',
	serif;
}

.wraphorizontal {
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	justify-content:space-around;

}

.nojustify {
	justify-content:space-between;
}
.squish {
	padding-left:5vw;
	padding-right:5vw;
}
.nodecoration {
	text-decoration:none;
	color:black;
	font-weight:500;
}

.engagementphoto {
	width:20%;
	margin-right:0.3vw;
	margin-left:0.3vw;
	margin-bottom:2vw;
	border:solid 1px grey;
	cursor: pointer;
}
.faqbox {
	
	width:31%;
	margin-bottom:2vw;
	text-align:left;
}
.spaceevenly {
	justify-content:space-evenly;
	width:100%;
}
.bold {
	font-weight:700;
	margin-bottom:0.3vw;
}
.locBoxes {
	width: 48%;
	overflow:hidden;
}

.scheduleBoxes {
	width:31%;
	
	height:100%;
	text-align:center;
}

.twolinespacer {
	margin-bottom:4vw;
}

.faqWrapper {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	width:100%;
	flex-wrap:wrap;
}

.rsvpform {
	display:flex;
	flex-direction:column;
	align-items:center;
	width:100%;
	
	
}

.forms_as_columns {
	display:flex;
	flex-direction:column;
	list-style: none;
	
	width:60%;
	gap:1.5vw;
}

.forms_as_rows {
	display:flex;
	flex-direction:row;
	list-style:none;
	
}

label {
	display:block;
	padding-bottom:0.5vw;
}

.formhalf {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	flex-grow:1;
	
}

#liright {
	width:48%;

}
#lileft {
	width:48%;
}

.center {
	display:block;
	margin:0 auto;
}
li input[type="number"], li input[type="text"], li input[type="email"], li input[type='tel'] {
	width:100%;
	height:2vw;
	font-size:inherit;
	padding-left:0.3vw;
	border-radius:0.3vw;
	border:solid 1px rgb(0, 0, 0);
}

li input[type="checkbox"] {
		transform: scale(2);
		font-size:inherit;
		padding-left:0.3vw;
		border-radius:0.3vw;
		border:solid 1px rgb(0, 0, 0);
}

.submit
{
	background-color:rgb(139,195,74);
	border:0;
	border-radius:3px 3px 3px 3px;
	height:2.5vw;
	width:6vw;
	font-size:inherit;
	letter-spacing:0.05vw;
}
.formstatussuccess
{
	color:rgb(98, 139, 51);
	font-weight:600;
	text-align:center;
}
.formstatusfailure
{
	color:rgb(207, 81, 81);
	font-weight:600;
	text-align:Center;
}
#firstandlasts
{
	display:flex;
	flex-direction:column;
	gap: 1.5vw;
}

@media only screen and (max-width:1279px) {
	body {
		font-size:4vw;
	}
	#content-container {
		width:98%;
		padding:0;
	}

	

	h1 {
		font-size: 12vw;
		margin-bottom:4vw;
		margin-top:6vw;
	}

	#navbar {
		margin-top:3vw;
		margin-bottom:3vw;
	}

	#navbar a {
		font-size:3.5vw;
	}

	.mainpicture {
		min-height: calc(90vw / 1.2);
	}

	.fakeh2 {
		font-size:6.5vw;
		margin-top:3vw;
		margin-bottom:2vw;
	}

	.fakeh3 {
		font-size:5.3vw;
		margin-top:2vw;
		margin-bottom:3vw;
	}

	.rsvp {
		width:70%;
		font-size:8vw;
		margin-top:3vw;
	}

	.section {
		margin-top:19vw;
	}

	.sectiontitle {
		font-size:9vw;
	}

	.faqWrapper {
		display:flex;
		flex-direction:column;
		align-items:center;

	}
	.faqbox {
		width:85%;
		margin-top:5vw;
		margin-bottom:5vw;
	}

	#footer {
		padding-top:12vw;
	}

	.bold {
		margin-bottom:1.2vw;
		font-size:110%;
	}

	.scheduleBoxes {
		width:85%;
		margin-top:10vw;
	}

	.twolinespacer {
		margin-bottom:4.5vw;
	}
	
	.forms_as_columns {
		width:90%;
	}

	li input[type="number"],
	li input[type="text"],
	li input[type="email"],
	li input[type='tel'] {
		border-radius:0.9vw;
		height: 7vw;
		padding-left:1.2vw;
	}

	.submit
	{
		width:20vw;
		height:6.5vw;
		margin-top:3vw;
	}

	label {
		padding-bottom:0.8vw;
		padding-top:2vw;
		font-weight:700;
	}
	.taptoclose {
	
		
		font-size:70%;
	}

	.locBoxes
	{
		width:95%;
		min-height:50vw;
	}
} 