body {
	font-family: 'Lato', sans-serif;
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	margin: 0;
}

.invitation-container {
	background-color: transparent;
    padding: 0px 20px;
    margin-top: -20px;
    border-radius: 10px;
    text-align: center;
    z-index: 1;
    max-width: 400px;
}
body.home .invitation-container {
	margin-top:0;
}
h1 {
    color: #64a084;
    font-weight: 200;
    font-size: 54px;
    margin-top: 0rem;
    margin-bottom: 0.7rem;
}


p {
	color: #5a5a5a;
    text-transform: uppercase;
    line-height: 1.7;
    font-size: .8rem;
    letter-spacing: .02em;
    font-weight: 600;
}
p.top {
	margin-bottom:0;
}

a {
    text-decoration: none;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: #64a084;
}
a:hover {
    text-decoration: none;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: #44705c;
}

ul{
	list-style: none;
    padding-left: 0;
	margin-bottom:2rem;
}
ul li{
	margin-bottom:.4rem;
}
ul li:last-child{
	margin-bottom:1rem;
}
.btn-row{
	display:flex;
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
	gap:12px;
}
a.button, button {
    background-color: #64a084;
    color: #fff;
    border: none;
    padding: 5px 14px 7px;
    border-radius: 0px;
    cursor: pointer;
    margin-top: 1rem;
    display: inline-block;
    text-decoration: none;
}

a.button:hover,
button:hover {
	background-color: #44705c;
}
.rot-img-absolute{
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100vh;
		margin:0!important;
		pointer-events:none;
		z-index:0;
}
.rot-img-absolute img{
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		object-fit:cover;
		object-position:50% 28%;
}
@media(min-width:576px){
	p{
		font-size:.9rem;
	}
	h1{
		font-size:66px;
	}
}
@media(min-width:768px) and (orientation:landscape) and (min-height:800px){
	.invitation-container {
		max-width:450px;
	}

}
@media(min-width:1820px){
	.invitation-container {
		margin-top:5rem;
	}
}

.bg {
    /* overflow: hidden; */
    display: flex;
    justify-content: center;
    align-items: center;
}
/* .bg:before {
    content: '';
    width: 160%;
    position: absolute;
    padding-bottom: 160%;
    border-radius: 2000px;
    border: 100px solid #d2eed7;
    margin: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
} */

.rot-img-absolute.bg-img img{
	max-width: 1050px;
    transform: translateX(-50%);
    left: 50%;
    opacity: 0.6;
    z-index: 0;
}
body.engaged{
	/* align-items:flex-end; */
}
body.engaged .invitation-container {
    margin-bottom: -14.7rem;
}
body.engaged .invitation-container p{
	color: #ffffff;
	text-transform: uppercase;
	line-height: 1.2;
	font-size: 1.3rem;
	letter-spacing: .02em;
	font-weight: 600;
	text-shadow: 1px 1px 10px #00000054;
	max-width: 14em;
}
.rot-img-absolute:before{
	content:'';
	position:absolute;
	top:0;
	transform:translateX(-50%);
	left:50%;
	width:100%;
	height: 100%;
	background: white;
	max-width: 1200px;


}
body.engaged .rot-img-absolute:not(.bg-img):before{
	background:transparent;
}
@media(min-width:992px){
	body.engaged .invitation-container p{
		font-size:2.8vw;
	}
}
@media(min-width:1200px){
	body.engaged .invitation-container p{
		font-size:34px;
	}
	.rot-img-absolute:not(.bg-img) img {
		left: 50%;
		transform: translateX(-50%);
		width: 1200px;
		height: 100%;
	}
	body{
		background: #d2eed7;
	}
}