@font-face {
	font-family: 'Singulier';
	src: url('../fonts/Singulier-Regular.ttf') format('truetype');
}

@font-face {
	font-family: 'Singulier-Regular';
	src: url('../fonts/Singulier-Regular.otf') format('opentype');
}

@font-face {
	font-family: 'Singulier-thin';
	src: url('../fonts/Singulier-Thin.otf') format('opentype');
}

@font-face {
	font-family: 'Singulier-demi';
	src: url('../fonts/Singulier-Demi.otf') format('opentype');
}

@font-face {
	font-family: 'Singulier-bold';
	src: url('../fonts/Singulier-Bold.otf') format('opentype');
}

@font-face {
	font-family: 'Singulier-heavy';
	src: url('../fonts/Singulier-Heavy.otf') format('opentype');
}

@font-face {
	font-family: 'Singulier-light';
	src: url('../fonts/Singulier-Light.otf') format('opentype');
}

body {
	margin: 0;
	font-family: 'Singulier', Arial, sans-serif;
	background: url('../images/bg.png') no-repeat center center fixed;
	background-size: cover;
	color: #fff;
	text-align: center;
}

* {
	margin: 0;
	padding: 0;
}

.ios-button,
.android-button {
	display: none;
	background-color: rgba(255, 255, 255, 0.0);
	/* Transparent background */
	border: none;
	height: 30%;
	width: 60%;
}

.ios-system .ios-button,
.android-system .android-button {
	display: block;
	-webkit-user-select: none;
	/* Chrome all / Safari all */
	-moz-user-select: none;
	/* Firefox all */
	-ms-user-select: none;
	/* IE 10+ */
	user-select: none;
}

/* To prevent highlight of the selection */
* {
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
	-webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
	outline: none !important;
	-webkit-user-select: none;
	/* Safari */
	-ms-user-select: none;
	/* IE 10 and IE 11 */
	user-select: none;
	/* Standard syntax */
}

body,
html {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-family: 'Singulier', sans-serif;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}

.container {
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
}

.header {
	text-align: center;
	padding: 10% 0 0 0;
}

.logo {
	width: 65%;
}

.title {
	font-family: 'Singulier-light', sans-serif;
	font-size: 1.05em;
	margin: 2.3% 0 1% 0;
}

.title b {
	font-family: 'Singulier-bold', sans-serif;
}

.subtitle {
	font-family: 'Singulier-light', sans-serif;
	font-size: 0.86em;
	text-shadow: 2px 2px 5px black;
	margin: 0;
	line-height: 1.35em;
	padding: 8px 6%;
}

.footer {
	font-family: 'Singulier', serif;
	font-size: 1.5rem;
}

.footer a {
	color: #fff;
	text-decoration: none;
}

.background-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -1;
}

.wallet-buttons {
	display: flex;
	justify-content: center;
	font-family: 'Singulier', sans-serif;
	font-size: calc(1.4rem + 0.5vw);
	margin: -4px 0 5px 0;
	color: #1b5279;
	text-align: center;
}

.coupon {
	margin: 0 10px;
	text-align: center;
	color: #1b5279;
}

.wallet-buttons button img {
	width: 150px;
	height: auto;
	margin-top: 10px;
}

.note {
	font-family: 'Singulier', sans-serif;
	font-size: calc(1rem + 0.2vw);
	color: white;
	margin: 1% 0 5px 0;
}

.privacy-policy {
	font-family: 'UberMove-Regular', sans-serif;
	color: white;
	margin: 0.1% 0 0 0;
}

.bottom-content {
	position: fixed;
	bottom: 0;
	width: 100%;
	text-align: center;
	background-color: hsl(0deg 0% 0% / 0%);
}

.btm {
	display: flex;
	justify-content: center;
	font-size: calc(1rem + 0.2vw);
	flex-wrap: nowrap;
	align-items: stretch;
	align-content: space-around;
	flex-direction: column;
	width: 100%;
	color: white;
	font-family: 'UberMove-Regular', sans-serif;
}

.btm a {
	color: white;
	font-family: 'UberMove-Regular', sans-serif;
	text-decoration: underline;
}

.btm a:hover {
	text-decoration: underline;
}

.btm-links {
	display: flex;
	justify-content: space-between;
	font-size: calc(1rem + 0.2vw);
	flex-wrap: nowrap;
	align-items: center;
	align-content: space-around;
	flex-direction: column;
	width: 100%;
	color: white;
	font-family: 'UberMove-Regular', sans-serif;
	margin: 0 0 6% 0;
}

.btm-links a {
	font-size: calc(1rem + 0.2vw);
	color: white;
	font-family: 'UberMove-Regular', sans-serif;
	text-decoration: underline;
}

.btm-links a:hover {
	text-decoration: underline;
}

.black-strip {
	background-color: black;
	font-size: calc(0.8rem + 0.9vw);
	padding: 3px 0 4px;
}
@media only screen and (min-device-width: 320px) and (min-device-height: 568px) and (-webkit-device-pixel-ratio: 2){
	.header {
		text-align: center;
		padding: 7% 0 0 0;
	}
	.title {
		font-family: 'Singulier-light', sans-serif;
		font-size: 0.8em;
		margin: 2.6% 0 1% 0;
	}
	.subtitle {
		font-family: 'Singulier-light', sans-serif;
		font-size: 0.65em;
		text-shadow: 2px 2px 5px black;
		margin: 0;
		line-height: 1.35em;
		padding: 10px 6%;
	}
	.black-strip {
		background-color: black;
		font-size: 0.7em;
		padding: 3px 0 4px;
	}
	.btm-links a {
		font-size: 1.4em;
	}
}
/* Device-specific media queries */
@media only screen and (min-device-width: 320px) and (min-device-height: 568px) and (-webkit-device-pixel-ratio: 3) {
	.header {
		text-align: center;
		padding: 5% 0 0 0;
	}

	.title {
		font-size: calc(1rem + 0.3vw);
		margin: 3% 0 1% 0;
	}

	.subtitle {
		font-size: calc(0.82rem + 0.3vw);
		margin: 0;
		line-height: 1.35em;
		padding: 3% 6% 0 6%;
	}

	.black-strip {
		font-size: calc(0.9rem + 0.3vw);
		padding: 5px 0 6px;
	}

	.btm-links a {
		font-size: calc(0.8rem + 0.3vw);
		margin: 0;
	}
}

@media only screen and (min-device-width: 440px) and (max-device-height: 956px) and (-webkit-device-pixel-ratio: 2),
only screen and (min-device-width: 440px) and (max-device-height: 956px) and (-webkit-device-pixel-ratio: 3) {
	.header {
		padding: 9% 0 0 0;
	}

	.title {
		font-size: 1em;
		margin: 4.5% 0 1% 0;
	}

	.subtitle {
		font-size: 0.82em;
		padding: 20px 6% 0 6%;
	}

	.black-strip {
		font-size: 0.85em;
	}

	.btm-links a {
		font-size: 0.8em;
	}
}
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (-webkit-device-pixel-ratio: 3){
	.logo {
		width: 60%;
	}
	.title {
        font-size: 1rem;
	}
	.subtitle {
        font-size: 0.82rem;
	}
	.black-strip {
        font-size: 0.9rem;
	}
}


@media only screen and (min-device-width: 414px) and (max-device-width: 430px) and (min-device-width: 440px) and (min-device-height: 896px) and (max-device-height: 956px) and (-webkit-device-pixel-ratio: 2),
only screen and (min-device-width: 414px) and (max-device-width: 430px) and (min-device-width: 440px) and  (max-device-height: 956px) and (-webkit-device-pixel-ratio: 3) {
			.logo {
				width: 96%;
			}

			.header {
				text-align: center;
				padding: 7% 15% 0 15%;
			}

			.title {
				font-size: calc(1.05rem + 0.5vw);
				margin: 3% 0 1% 0;
			}

			.subtitle {
				font-size: calc(0.86rem + 0.3vw);
				margin: 0;
				line-height: 1.35em;
				padding: 10px 6% 0 6%;
			}

			.bottom-content {
				position: fixed;
				bottom: 0;
				width: 100%;
				text-align: center;
				background-color: hsl(0deg 0% 0% / 0%);
				padding: 5px 0 5px 0;
			}

			.btm {
				display: flex;
				justify-content: center;
				font-size: 0.6em;
				flex-wrap: nowrap;
				align-items: stretch;
				align-content: space-around;
				flex-direction: column;
				width: 100%;
				color: white;
				font-family: 'UberMove-Regular', sans-serif;
			}

			.btm-links {
				display: flex;
				justify-content: space-between;
				font-size: 1.5em;
				padding: 0 20px;
				flex-wrap: nowrap;
				align-items: center;
				align-content: space-around;
				flex-direction: column;
				width: 90%;
				margin-top: 2%;
				color: white;
				font-family: 'UberMove-Regular', sans-serif;
			}

			.btm-links a {
				font-size: 0.9em;
				margin: 0 0 0 0;
			}

			.wallet-buttons {
				display: flex;
				justify-content: center;
				font-family: 'Singulier', sans-serif;
				font-size: 1.4em;
				color: #1b5279;
				text-align: center;
			}

			.footer {
				font-family: 'Singulier', serif;
				font-size: 2.3em;
			}

			.note {
				font-family: 'Singulier', sans-serif;
				font-size: 1.5em;
				color: white;
				margin: 0.1% 0 0 0;
			}

			.privacy-policy {
				font-family: 'UberMove-Regular', sans-serif;
				color: white;
				margin: 0.1% 0 0 0;
			}

			.black-strip {
				background-color: black;
				font-size: 1.3em;
				padding: 6px 0 6px;
			}
		}

		/* iPhone X */
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
    .header {
        text-align: center;
        padding: 5% 15% 0 15%;
    }

    .title {
        font-family: 'Singulier-light', sans-serif;
        font-size: 0.9em;
        margin: 3% 0 1% 0;
    }

    .subtitle {
        font-family: 'Singulier-light', sans-serif;
        font-size: 0.75em;
        text-shadow: 2px 2px 5px black;
        margin: 0;
        line-height: 1.35em;
        padding: 10px 6% 0 6%;
    }

    .bottom-content {
        position: fixed;
        bottom: 0;
        width: 100%;
        text-align: center;
        background-color: hsl(0deg 0% 0% / 0%);
        padding: 5px 0 5px 0;
    }

    .btm {
        display: flex;
        justify-content: center;
        font-size: 0.6em;
        flex-wrap: nowrap;
        align-items: stretch;
        align-content: space-around;
        flex-direction: column;
        width: 100%;
        color: white;
        font-family: 'UberMove-Regular', sans-serif;
    }

    .wallet-buttons {
        display: flex;
        justify-content: center;
        font-family: 'Singulier', sans-serif;
        font-size: 1.4em;
        color: #1b5279;
        text-align: center;
    }

    .footer {
        font-family: 'Singulier', serif;
        font-size: 1.6em;
    }

    .note {
        font-family: 'Singulier', sans-serif;
        font-size: 1.2em;
        color: white;
        margin: 0.1% 0 0 0;
    }

    .privacy-policy {
        font-family: 'UberMove-Regular', sans-serif;
        color: white;
        margin: 0.1% 0 0 0;
    }
}

/* iPhone SE */
@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) {
    .header {
        text-align: center;
        padding: 4% 0 2% 0;
    }

    .tag-line {
        font-family: 'Singulier-light', sans-serif;
        font-size: 0.5em;
        margin: 1% 0 1% 0;
        letter-spacing: 1.4px;
    }

    .title {
        font-family: 'Singulier-light', sans-serif;
        font-size: 0.92em;
        margin: 2.5% 0 1% 0;
    }

    .subtitle {
        font-family: 'Singulier-light', sans-serif;
        font-size: 0.754em;
        text-shadow: 2px 2px 5px black;
        margin: 0;
        padding: 2% 6% 0 6%;
    }

    .bottom-content {
        position: fixed;
        bottom: 0;
        width: 100%;
        text-align: center;
        background-color: hsl(0deg 0% 0% / 0%);
        padding: 5px 0 5px 0;
    }

    .btm {
        display: flex;
        justify-content: center;
        font-size: 1em;
        flex-wrap: nowrap;
        align-items: stretch;
        align-content: space-around;
        flex-direction: column;
        width: 100%;
        color: white;
        font-family: 'UberMove-Regular', sans-serif;
    }

    .wallet-buttons {
        display: flex;
        justify-content: center;
        font-family: 'Singulier', sans-serif;
        font-size: 1.4em;
        color: #1b5279;
        text-align: center;
    }

    .footer {
        font-family: 'Singulier', serif;
        font-size: 1.6em;
    }

    .note {
        font-family: 'Singulier', sans-serif;
        font-size: 1.2em;
        color: white;
        margin: 0.1% 0 0 0;
    }

    .privacy-policy {
        font-family: 'UberMove-Regular', sans-serif;
        color: white;
        margin: 0.1% 0 0 0;
    }
}

/* Pixel 7 */
@media only screen and (device-width: 412px) and (device-height: 915px) {
    .header {
        text-align: center;
        padding: 10% 0 0 0;
    }

    .title {
        font-family: 'Singulier-light', sans-serif;
        font-size: 1.1em;
        margin: 3.5% 0 1% 0;
    }

    .subtitle {
        font-family: 'Singulier-light', sans-serif;
        font-size: 0.89em;
        text-shadow: 2px 2px 5px black;
        margin: 0;
        line-height: 1.35em;
        padding: 15px 6% 0 6%;
    }

    .black-strip {
        background-color: black;
        font-size: 1em;
        padding: 3px 0 4px;
    }

    .btm-links a {
        font-size: 1em;
        margin: 0;
    }
}