/* @override 
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578070989
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578076112
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578142024
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578156792
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578183361
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578248067
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578252295
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578311307
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578319848
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578326997
	http://www.joeandcharlotte.wedding/themes/simple/css/menu.css?m=1578350375
	http://localhost:8888/wedding/themes/simple/css/menu.css?m=1578408665
*/

*, *::after, *::before {
	 margin: 0;
	 padding: 0;
	 box-sizing: inherit;
}
 html {
	 font-size: 62%;
}
 body {
	 box-sizing: border-box;
}
 .navigation__checkbox {
	 display: none;
}
 .navigation__button {
	 background-color: transparent;
	 height: 7rem;
	 width: 7rem;
	 border-radius: 50%;
	 position: fixed;
	 top: 3rem;
	 right: 3rem;
	 z-index: 2000;
	//box-shadow: 0 1rem 3rem rgba(0, 0, 0, .1);
	 text-align: center;
	 cursor: pointer;
}
 .navigation__background {
	 height: 6rem;
	 width: 6rem;
	 border-radius: 50%;
	 position: fixed;
	 top: 6.5rem;
	 right: 6.5rem;
	 background-size:200px;
	 z-index: -1000;
	 transition: all 0.8s cubic-bezier(.86, 0, 0.07, 1);
	 opacity: 0;
}
 .navigation__nav {
	 height: 0px;
	 overflow: hidden;
	 width: 100%;
	 position: fixed;
	 top: 0;
	 left: 0;
	 z-index: -1500;
	 opacity: 0;
	 width: 100vw;
	 transition: opacity .8s cubic-bezier(0.86, 0, 0.07, 1);
}
 .navigation__list {
	 position: absolute;
	 top: 0%;
	 left: 50%;
	 transform: translate(-50%);
	 list-style: none;
	 text-align: center;
	 width: 100%;
 background-size:contain;
	height: 100vh;
	padding: 0;
	background-image: url(../images/hearts_03.jpg);
}
li.first {
		padding: 10vh 0 0;
}
li.last {
		padding: 0 0 10vh;
}

.navigation li {
	background-color: white;
}

a.navigation__link {
	cursor: pointer;
}
.current a.navigation__link {
	color: #e4a3c5;
	background-image: none;
	transition: all ease 0.2s;
}
 .navigation__item {
	 margin: 1rem;
}
 .navigation__link:link, .navigation__link:visited {
	 display: inline-block;
	 padding: 1rem 0rem;
	 color: black;
	 text-decoration: none;
	 text-transform: uppercase;
	 background-image: linear-gradient(120deg, transparent 0%, transparent 50%, #fff 50%);
	 background-size: 220%;
	 transition: all 0.4s;
	font: 300 2.5vw GothamBold;
	text-align: justify;
}

a#m1.navigation__link {
	letter-spacing: 3.3vw;
	text-indent: 2.8vw;
}
a#m2.navigation__link {
	letter-spacing: 2.1vw;
	text-indent: 1.9vw;
}
a#m3.navigation__link {
	letter-spacing: .4vw;
	text-indent: 0vw;
}
a#m4.navigation__link {
	letter-spacing: 1.7vw;
	text-indent: 1.7vw;
}
a#m5.navigation__link {
	letter-spacing: 0.9vw;
	text-indent: 0.9vw;
}
 .navigation__link:link span, .navigation__link:visited span {
	 margin-right: 1rem;
	 display: inline-block;
}
 .navigation__link:hover, .navigation__link:active {
	 color: #e4a3c5;
	 transform: translateY(-1rem);
	 cursor: pointer;
	//background: url(../images/heart-menu.png) no-repeat left center;
	background-size:contain;
}
 .navigation__checkbox:checked ~ .navigation__background {
	width: 200vw;
	height: 200vh;
	//transform: scale(50);
	background-image: url(../images/hearts-clear.gif);
	background-size:cover;
	background-color: transparent;
	opacity: 1;
}
 .navigation__checkbox:checked ~ .navigation__nav {
	 opacity: 1;
	 z-index: 1399;
	 width: 100%;
	 height: 100vh;
}
 .navigation__icon {
	 position: relative;
	 margin-top: 3.5rem;
}
 .navigation__icon, .navigation__icon::before, .navigation__icon::after {
	 width: 3rem;
	 height: 3px;
	 background-color: black;
	 display: inline-block;
}
 .navigation__icon::before, .navigation__icon::after {
	 content: "";
	 position: absolute;
	 left: 0;
	 transition: all 0.2s;
}
 .navigation__icon::before {
	 top: -0.8rem;
}
 .navigation__icon::after {
	 top: 0.8rem;
}
 .navigation__button:hover .navigation__icon::before {
	 top: -1rem;
}
 .navigation__button:hover .navigation__icon::after {
	 top: 1rem;
}
 .navigation__checkbox:checked + .navigation__button .navigation__icon {
	 background-color: transparent;
}
 .navigation__checkbox:checked + .navigation__button .navigation__icon::before {
	 top: 0;
	 transform: rotate(135deg);
}
 .navigation__checkbox:checked + .navigation__button .navigation__icon::after {
	 top: 0;
	 transform: rotate(-135deg);
}