@font-face {
    font-family: 'FuturaBT-Bold';
    src: url('../fonts/FuturaBT-Bold.otf') format('opentype');
}

@font-face {
    font-family: 'FuturaBQMedium';
    src: url('../fonts/FuturaBQMedium.otf') format('opentype');
}
@font-face {
    font-family: 'UberMove-Regular';
    src: url('../fonts/UberMove-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'FuturaBtMedium';
    src: url('../fonts/FuturaBtMedium.ttf') format('truetype');
}

* {
  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 - Start */
* {
    -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 */
}

/*To prevent highlight of the selection - end*/
body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    font-family: 'FuturaBQMedium', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.header {
    text-align: center;
    padding: 10px 10px 0 10px;
}
.logo {
    width: 100%;
}
.container {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
}

.background-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.bg-white {
    padding: 20px 20px 10px 20px;
}

.description {
		font-family: 'FuturaBT-Bold', sans-serif;
		font-size: 1.8em;
		margin: 10% 0 30px 0;
		color:#1b5279;
}

.offer {
		font-family: 'FuturaBQMedium', sans-serif;
		font-size: 1.8em;
		margin: 10% 0 0 0;
		color:#1b5279;
}

.instruction{
		font-family: 'FuturaBT-Bold', sans-serif;
		font-size: 1.2em;
		margin: 20% 0 5px 0;
		color:#1b5279;
}

.wallet-buttons {
    display: flex;
    justify-content: center;
	font-family: 'FuturaBQMedium', sans-serif;
	font-size: 1.4em;
    margin: 5px 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: 'FuturaBtMedium', sans-serif;
	font-size: 0.8em;
	color:#1b5279;
	margin: 5% 0 5px 0;
}
.bottom-content {  
    position: fixed; /* Makes the element stick in place */
    bottom: 0; /* Aligns it to the bottom of the viewport */
    width: 100%; /* Ensures it stretches across the screen width */
    text-align: center; /* Centers the content within the element */
    background-color: hsl(0deg 0% 0% / 0%); /* Optional: Apply a background color to ensure visibility */
    padding: 10px;  /* Adjusts spacing around the content */
}
.btm {
	/* media Query */
	display: flex;
    justify-content: space-between;
    font-size: 1em;
    padding: 10px; /* Add padding to prevent cropping */
    flex-wrap: nowrap;
    align-items: flex-start;
    align-content: space-around;
    flex-direction: row;
    width: 90%;
	color: white;
    font-family: 'UberMove-Regular', sans-serif;
    text-decoration: underline;
}

.btm a {
	color: white;
    font-family: 'UberMove-Regular', sans-serif;
    text-decoration: underline;
}

.btm a:hover {
    text-decoration: underline;
}

/* Xiaomi Mi 11, Nord 2*/
@media only screen 
  and (min-device-width: 320px) 
  and (min-device-height: 568px)
  and (-webkit-device-pixel-ratio: 2){
	  .description {
			font-family: 'FuturaBT-Bold', sans-serif;
			font-size: 1.8em;
			margin: 20% 0 30px 0;
			color:#1b5279;
	}

	.offer {
			font-family: 'FuturaBQMedium', sans-serif;
			font-size: 1.8em;
			margin: 10% 0 0 0;
			color:#1b5279;
	}

	.instruction{
			font-family: 'FuturaBT-Bold', sans-serif;
			font-size: 1.2em;
			margin: 15% 0 5px 0;
			color:#1b5279;
	}
	.note{
		font-family: 'FuturaBtMedium', sans-serif;
		font-size: 0.8em;
		color:#1b5279;
		margin: 5% 0 5px 0;
	}
	  
  }
  

/* Styles for most iPhones */
  @media only screen 
  and (min-device-width: 320px) 
  and (min-device-height: 568px) 
  and (-webkit-device-pixel-ratio: 3) {
	  .description {
			font-family: 'FuturaBT-Bold', sans-serif;
			font-size: 1.6em;
			margin: 10% 0 30px 0;
			color:#1b5279;
	}

	.offer {
			font-family: 'FuturaBQMedium', sans-serif;
			font-size: 1.4em;
			margin: 10% 0 0 0;
			color:#1b5279;
	}

	.instruction{
			font-family: 'FuturaBT-Bold', sans-serif;
			font-size: 1.2em;
			margin: 5% 0 5px 0;
			color:#1b5279;
	}
  
	  
  }
/* Styles for most iPhones */
/*
@media only screen 
  and (min-device-width: 320px) 
  and (min-device-height: 568px)
  and (-webkit-device-pixel-ratio: 2), 
  only screen 
  and (min-device-width: 320px) 
  and (min-device-height: 568px) 
  and (-webkit-device-pixel-ratio: 3) {

	.description {
			font-family: 'FuturaBT-Bold', sans-serif;
			font-size: 1.6em;
			margin: 10% 0 30px 0;
			color:#1b5279;
	}

	.offer {
			font-family: 'FuturaBQMedium', sans-serif;
			font-size: 1.4em;
			margin: 10% 0 0 0;
			color:#1b5279;
	}

	.instruction{
			font-family: 'FuturaBT-Bold', sans-serif;
			font-size: 1.2em;
			margin: 5% 0 5px 0;
			color:#1b5279;
	}
  
 }*/

/*
iphone 15 pro max
iphone 14 pro max
iphone 13 pro max
iphone 12 pro max
iphone 11 pro max
iphone 11*/
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 430px) 
  and (min-device-height: 896px) 
  and (max-device-height: 932px) 
  and (-webkit-device-pixel-ratio: 2), 
  only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 430px) 
  and (min-device-height: 896px) 
  and (max-device-height: 932px) 
  and (-webkit-device-pixel-ratio: 3) {
  /* Combined styles for the specified devices */
    .description {
		font-family: 'FuturaBT-Bold', sans-serif;
		font-size: 1.6em;
		margin: 8% 0 30px 0;
		color:#1b5279;
	}

	.offer {
		font-family: 'FuturaBQMedium', sans-serif;
		font-size: 1.55em;
		margin: 10% 0 0 0;
		color:#1b5279;
	}

	.instruction{
		font-family: 'FuturaBT-Bold', sans-serif;
		font-size: 1.2em;
		margin: 10% 0 5px 0;
		color:#1b5279;
	}
}

/* iPhone X */
@media only screen 
  and (device-width: 375px) 
  and (device-height: 812px) 
  and (-webkit-device-pixel-ratio: 3) {
  /* Styles for iPhone X */
  .description {
		font-family: 'FuturaBT-Bold', sans-serif;
		font-size: 1.3em;
		margin: 10% 0 30px 0;
		color:#1b5279;
	}

	.offer {
			font-family: 'FuturaBQMedium', sans-serif;
			font-size: 1.3em;
			margin: 10% 0 0 0;
			color:#1b5279;
	}

	.instruction{
			font-family: 'FuturaBT-Bold', sans-serif;
			font-size: 1em;
			margin: 10% 0 5px 0;
			color:#1b5279;
	}
  
}

/* Pixel 7 */
@media only screen 
  and (device-width: 412px) 
  and (device-height: 915px) 
   {
  /* Styles for Pixel 7 */
   .description {
		font-family: 'FuturaBT-Bold', sans-serif;
		font-size: 1.55em;
		margin: 10% 0 30px 0;
		color:#1b5279;
	}

	.offer {
		font-family: 'FuturaBQMedium', sans-serif;
		font-size: 1.5em;
		margin: 20% 0 0 0;
		color:#1b5279;
	}

	.instruction{
		font-family: 'FuturaBT-Bold', sans-serif;
		font-size: 1.2em;
		margin: 15% 0 5px 0;
		color:#1b5279;
	}
	.note{
		font-family: 'FuturaBtMedium', sans-serif;
		font-size: 0.8em;
		color:#1b5279;
		margin: 5% 0 5px 0;
	}

}