Ampier

<m-body bgcolor="#1A1D29" font-family="Arial, sans-serif" color="#ffffff">
	<m-head preheader="let us know what you like or DONT LIKE about our horoscope project"></m-head>
	<m-padding size="15"></m-padding>
	<m-wrap width="600" align="center" background-image="https://img.ampier.io/22-04-12_horoscope/bg.jpg" border-radius="15px">
		<m-padding size="20"></m-padding>
		<m-wrap width="560" align="left" padding="0px 15px">
			<m-img src="https://img.ampier.io/22-04-12_horoscope/logo.png" alt="EverydayHorpscope" width="199" height="41"></m-img>
		</m-wrap>
		<m-padding size="20"></m-padding>
		<m-wrap width="500" height="160" align="center" padding="0px 15px">
			<div data-amp-hidden="confirmed">
				<m-text font-size="32px" bold>
					Get personalized horoscopes to feel better — confirm now
				</m-text>
				<m-padding size="30"></m-padding>
				<m-button m-if="!isAmp" bgcolor="#C259F2" width="280" height="50" border-radius="5px" font-size="20px" bold>Confirm email</m-button>

<m-form action="https://ampier.io/amp/post/570?key=a3be7e705ff94ed958126f6f791cfbf1&format=json" on="submit-success: AMP.setState({ confirmed: 1 })">
					<m-button m-if="isAmp" bgcolor="#C259F2" width="280" height="50" border-radius="5px" font-size="20px" bold>Confirm email</m-button>
					<input type="hidden" name="link" value="*[confirm_link]*" />
				</m-form>
			</div>
			<div m-if="isAmp" hidden data-amp-hidden="!confirmed">
				<m-text font-size="32px" bold>
					Thank you for joining us!
				</m-text>
				<m-padding size="20"></m-padding>
				<m-text font-size="16px">
					You have successfully confirmed your subscription to EverydayHoroscopes!
				</m-text>
			</div>

</m-wrap>
		<m-padding size="20"></m-padding>
	</m-wrap>

<m-padding size="20"></m-padding>

<m-wrap width="600" align="left" bgcolor="#222536" padding="20px 20px 0 20px" border-radius="15px">
		<div data-amp-hidden="confirmed">
			<m-text font-size="16px" line-height="22px">
				Life is getting crazier for all of us every day, and it may be hard to stay sane. You’re probably anxious, scared, and even depressed.
			</m-text>
			<m-padding size="15"></m-padding>
			<m-text font-size="16px" line-height="22px">
				There may be issues in your career, love life, everyday life… and you don’t know where to ask for help.
			</m-text>
			<m-padding size="15"></m-padding>
			<m-text font-size="16px" line-height="22px">
				With EverydayHoroscopes, you can receive detailed predictions that will make you feel at least a bit better, give you some tips, and relieve your anxiety. To get started, just confirm your email!
			</m-text>
			<m-padding size="20"></m-padding>
			<m-wrap align="center">
				<m-button m-if="!isAmp" bgcolor="#C259F2" width="280" height="50" border-radius="5px" font-size="20px" bold>Confirm email</m-button>

<m-form action="https://ampier.io/amp/post/570?key=a3be7e705ff94ed958126f6f791cfbf1&format=json" on="submit-success: AMP.setState({ confirmed: 1 })">
					<m-button m-if="isAmp" bgcolor="#C259F2" width="280" height="50" border-radius="5px" font-size="20px" bold>Confirm email</m-button>
					<input type="hidden" name="link" value="*[confirm_link]*" />
				</m-form>
			</m-wrap>
			<m-padding size="20"></m-padding>
		</div>
		<div m-if="isAmp" hidden data-amp-hidden="!confirmed">
			<m-wrap align="center">
				<m-wrap align="center" width="520">
					<m-text font-size="30px" bold>
						Improve your life with quick text horoscopes
					</m-text>
					<m-padding size="20"></m-padding>
					<m-text font-size="16px" line-height="22px" data-amp-hidden="setphone">
						Just enter your phone to get texts with predictions that will relieve your anxiety & help you rebuild your relationship!
					</m-text>
					<m-padding size="30"></m-padding>

<m-boxes>
						<m-box width="260">
							<m-style>
								.input_wrap{
									width:100%;
									overflow: hidden;
									background: #FFFFFF;
									display: flex;
									border-radius: 5px;
									margin-bottom: 20px;
								}
								.input_wrap span{
									background: #8F909B;
									width: 50px;
									height: 50px;
									text-align:center;
									font-weight: bold;
									font-size: 16px;
									line-height: 50px;
								}
								.input_wrap input{
									box-sizing: border-box;
									width: 100%;
									border: 0px none;
									padding:  10px 12px;
									height: 50px;
									font-size: 16px;
								}
							</m-style>
							<m-form action="https://ampier.io/amp/post/571?key=c850ec484c698fb8cf1987c9b3622cc0&format=json" on="submit-success: AMP.setState({ setphone: 1 })" data-amp-hidden="setphone">
								<div class="input_wrap">
									<span>+1</span>
									<input type="text" required name="phone">
								</div>
								<m-button bgcolor="#C259F2" height="50" border-radius="5px" font-size="20px" bold>Get text Predictions</m-button>
								<m-padding size="25"></m-padding>
								<m-text href="#" text-decoration="underline" color="#C561FD" font-size="14px">See your horoscope</m-text>
								<input type="hidden" name="email" value="*[email]*">
							</m-form>

<m-wrap align="left" hidden data-amp-hidden="!setphone">
								<m-text color="#29B6EB" font-size="16px">Thank you!<br />
									You have successfully signed up. Now, you can receive your predictions via text.</m-text>
								<m-padding size="25"></m-padding>
								<m-button href="#" bgcolor="#C259F2" height="50" border-radius="5px" font-size="20px" bold>See Your Horoscope</m-button>
							</m-wrap>
							<m-padding size="25"></m-padding>
						</m-box>
						<m-box width="260" align="right">
							<m-img src="https://img.ampier.io/22-04-12_horoscope/phone.png" width="250" height="221"></m-img>
						</m-box>
					</m-boxes>
				</m-wrap>
			</m-wrap>
		</div>
	</m-wrap>

<m-padding size="20"></m-padding>

<m-wrap width="600" align="center" bgcolor="#222536" padding="20px" border-radius="15px">
		<m-padding size="20"></m-padding>
		<m-wrap width="570" align="left" padding="0px 15px">
			<m-text font-size="18px" line-height="30px">
				Astrologically Yours,<br />
				EverydayHoroscopes Team
			</m-text>
			<m-padding size="15"></m-padding>

<m-text font-size="12px" color="#5D6178">You received this email because you had subscribed to EverydayHoroscopes newsletter.</m-text>
			<m-padding size="6"></m-padding>
			<m-text font-size="12px" color="#5D6178">If you don’t want to receive emails from us in the future, click to <a href="#" target="_blank" style="color:#C561FD;text-decoration: underline">unsubscribe</a>.</m-text>
			<m-padding size="6"></m-padding>
			<m-text font-size="12px" color="#5D6178">If you have any questions, please contact us <a href="#" target="_blank" style="color:#C561FD;text-decoration: underline">here</a>.</m-text>
			<m-padding size="18"></m-padding>
			<m-text font-size="12px" color="#5D6178">EverydayHoroscopes, 207 E Ohio, # 158 Chicago, IL 60611</m-text>

</m-wrap>
		<m-padding size="20"></m-padding>
	</m-wrap>

<m-padding size="20"></m-padding>

</m-body>