@import url('https://fonts.googleapis.com/css2?family=Yeseva+One&display=swap');
@keyframes pulse {
	0% {
		background-color: pink;
	}
	50% {
		background-color: #81b4ca;
	}
	100% {
		background-color: pink;
	}
}

body {
	position: relative;
}
body:not(.bg-pink){
	animation: pulse 10s infinite;
}
*{
	font-family: 'Yeseva One', cursive;
	user-select: none;
	color: white;
}

h2{
	font-size: 50px;
}
h1{
	font-size: 150px;
}
main {
	height: 100%;
	height: 100vh;
  overflow-y: hidden;
}
.btn-primary{
	background-color: #81b4ca !important;
	border-color: #81b4ca !important;

}
.btn-pink {
	background-color: pink !important;
}
.bg-pink {
	background-color: pink !important;
}
.btn-jake {
	position: absolute;
  z-index: 1000;
	top: -220px;
	width: 100px;
	height: 100px;
	border-radius: 50% !important;
}
#gender_reveal {
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
@media only screen
    and (min-device-width : 414px)
    and (max-device-width : 736px)
    and (device-width : 414px)
    and (device-height : 736px)
    and (orientation : portrait)
    and (-webkit-min-device-pixel-ratio : 3)
    and (-webkit-device-pixel-ratio : 3)
{
	#right_outer {
		right: 20%;
	}
	#right_inner {
		right: 3%;
	}
	#left_inner {
		right: 1%;
	}
}