@font-face {
    font-family: 'Inter';
    src: url('Inter-Regular.woff2') format('woff2'),
        url('Inter-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter-Bold';
    src: url('Inter-Bold.woff2') format('woff2'),
        url('Inter-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {font-family: "Helvetica Neue Medium Extended";
  src: url("365834cfa7beb7ca64c00476397ddc32.eot"); /* IE9*/
  src: url("365834cfa7beb7ca64c00476397ddc32.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("365834cfa7beb7ca64c00476397ddc32.woff2") format("woff2"), /* chrome、firefox */
  url("365834cfa7beb7ca64c00476397ddc32.woff") format("woff"), /* chrome、firefox */
  url("365834cfa7beb7ca64c00476397ddc32.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("365834cfa7beb7ca64c00476397ddc32.svg#Helvetica Neue Medium Extended") format("svg"); /* iOS 4.1- */
}

@font-face {font-family: "Helvetica Neue Medium Extended";
  src: url("365834cfa7beb7ca64c00476397ddc32.eot"); /* IE9*/
  src: url("365834cfa7beb7ca64c00476397ddc32.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("365834cfa7beb7ca64c00476397ddc32.woff2") format("woff2"), /* chrome、firefox */
  url("365834cfa7beb7ca64c00476397ddc32.woff") format("woff"), /* chrome、firefox */
  url("365834cfa7beb7ca64c00476397ddc32.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("365834cfa7beb7ca64c00476397ddc32.svg#Helvetica Neue Medium Extended") format("svg"); /* iOS 4.1- */
}

@font-face {font-family: "Pari-Match Regular";
  src: url("c03740f2ffb689fef4bbb9c26116c4c1.eot"); /* IE9*/
  src: url("c03740f2ffb689fef4bbb9c26116c4c1.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("c03740f2ffb689fef4bbb9c26116c4c1.woff2") format("woff2"), /* chrome、firefox */
  url("c03740f2ffb689fef4bbb9c26116c4c1.woff") format("woff"), /* chrome、firefox */
  url("c03740f2ffb689fef4bbb9c26116c4c1.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("c03740f2ffb689fef4bbb9c26116c4c1.svg#Pari-Match Regular") format("svg"); /* iOS 4.1- */
}

@font-face {
    font-family: 'cocogoose_proregular';
    src: url('cocogoose-pro.regular-webfont.woff2') format('woff2'),
         url('cocogoose-pro.regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

html, body {
	min-height: 100%;
    width: 100%;
}

* {
	box-sizing: border-box;
}

body{
	background: linear-gradient(0deg, #131310, #131310), radial-gradient(50.02% 98.92% at 62.94% 53.11%, #2894AC 0%, #002953 100%);
    color: #FFF;
    font-weight: normal;
    font-size: 14px;
    margin: 0;
    padding: 0;
	background-color: #000;
	font-family: 'Inter';
}

a {
	color:#fff;
	text-decoration: none;
	cursor: pointer;
	
	-webkit-transition: color 0.1s linear 0s;	
	   -moz-transition: color 0.1s linear 0s;
		 -o-transition: color 0.1s linear 0s;
		    transition: color 0.1s linear 0s;
}

a:hover,
a:active,
a:focus{
	outline: 0;
	color:#000;
	text-decoration:none;
}

.main_wrapper {
	width: 100%;
	height: 100vh;
    display: flex;
	flex-direction: column;
    align-items: center;
    justify-content: space-between;
	position: relative;
	background-image: url(images/dektopBg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
	background-position: center;
	overflow: auto;
}
.main_wrapper img {
	max-width: 100%;
}

header {
	width: 100%;
    padding: 1rem 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(177.7deg, #0B0B0B 1.93%, rgba(11, 11, 11, 0) 205.17%);
}

.brand {
	width: 235px;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    color: #fff;
	font-size: 21px;
    font-weight: bolder;
    text-transform: uppercase; 
    padding-top: 5px;
}

/*.brand img {
	width: 250px;
}*/

.brand:hover {
    color: #fff;    
}

.header_right {
    display: flex;
    align-items: center;
    gap: 15px;
}

.social_media_wrpr {
    display: flex;
    align-items: center;
}

.container {
	width: 100%;
	height: 100%;
    display: flex;
	align-items: center;
	justify-content: flex-start;
	text-align: center;
	position: relative;
	padding: 1rem 4rem;
	padding-left: 5rem;
}

 .block {
 	width: 41%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
} 

.hero-title-text {
	font-size: 84px;
    line-height: 76px;
	margin: 0;
    font-family: "Pari-Match Regular";
    font-style: italic;
	font-weight: 400;
	text-transform: uppercase;
    background: linear-gradient(90.55deg, #a6a6a6 2.89%, #a6a6a6 52.11%, #D5D5D5 99.8%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    text-shadow: 1px -3px 0px #fff;
}

.textBg {
	background: #6C0100;
    border: 1.1625px solid #DFC261;
    border-radius: 4.65px;
    padding: 0.5rem;
    transform: skew(-15deg);
}

.title-text-h4 {
	font-size: 28px;
	line-height: normal;
	padding: 0 3px;
	text-align: center;
	margin: 0;
	font-family: 'Inter-Bold';
	letter-spacing: 0.11em;
	text-transform: uppercase;
	background: linear-gradient(0deg, #FFFFFF, #FFFFFF), linear-gradient(90.55deg, #D1AD46 2.89%, #FCF19E 52.11%, #D0AB44 99.8%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	text-fill-color: transparent;
}

.banner_ul {
	padding-left: 3rem;
}

.text-color {
    color: #fff;
}

.normal_text {
	width: 60%;
	color: #717171;
	font-size: 15px;
	line-height: 20px;
	padding-left: 0;
	margin-top: 2rem;
}

.buttons-grid {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding-bottom: 1rem;
    font-family: 'Inter-Bold';
}

.long_btn {
    display: flex;
    padding: 0.5rem 1rem;
    align-items: center;
	color: #000000;
    justify-content: center;
    font-weight: 500;
    font-size: 1rem;
	background: linear-gradient(0deg, #FFFFFF, #FFFFFF), #EF4123;
	border: 1.50866px solid #030151;
	box-shadow: 0px 5px 10px #000000;
	border-radius: 29.2571px;
	letter-spacing: 0.01em;
	text-transform: uppercase;
}

.long_btn:hover {
    color: #fff;
    background: linear-gradient(180deg, #efde85, #000000);
}

.small_font {
	font-size: 11px;
	margin: 0 5px 0;
}

footer {
    width: 100%;
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
	background: #000000;
    border-top: 1px solid #FFFFFF;
    /*position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;*/
}

footer p {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	text-align: center;
	margin: 0;
    margin-bottom: 0;
    gap: 8px;
}

center p {
	margin: 0;
    padding-bottom: 1rem;
}

.mobile_image {
	display: none;
}

.desktop_image {
	display: flex;
	flex-direction: column;
	align-items: center;
    gap: 10px;
}

.buttons-grid.mobile {
	display: none;
}

.rightImg {
	width: 100%;
}

.leftImg {
	width: 100%;
}

.rightImgMob {
	display: none;
}

/* ==================================================
   Responsive Code
================================================== */

@media (max-width: 1500px) {
.rightImg {
	width: 90%;
}

.leftImg {
	width: 90%;
}
}

@media (min-width: 1000px) {

}

@media (max-width: 999px) {
	.container {
		width: 100%;
		flex-direction: column;
		justify-content: center;
	    height: auto;
	    padding: 0;
	    padding-top: 1rem;
	}

	header {
		justify-content: center;
		padding: 10px;
	}

	.main_wrapper {
		align-items: center;
		justify-content: flex-start;
		background-image: url(images/mobileBg.png);
		/*background-position: right bottom;*/
    	background-position: center;
	}

	.brand {
    	width: 100px;
		font-size: 16px;
		padding-top: 0px;
	}

	.block {
	    width: 100%;
	}

	.mobile_image {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding-bottom: 2rem;
		gap: 10px;
	}

	.mobile_image img {
		max-width: 70%;
	}

	.desktop_image {
		display: none;
	}

	.hero-title-text {
	    font-size: 48px;
	    line-height: 43px;
	}

	.title-text-h4 {
		font-size: 15px;
	    font-weight: normal;
		margin: 0;
    	padding: 0;
	}

	.discountFtd {
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    gap: 2px;
	}

	.banner_ul {
		width: 70%;
		margin: 10px auto;
	}

	.long_btn {
	    padding: 0.4rem;
	    font-size: 0.8rem;
	    line-height: 24px;
	    font-size: 12px;
	}

	.rightImg {
		display: none;
	}

	.rightImgMob {
		display: flex;
	}

	.weburl {
		width: 100%;
	    display: flex;
	    align-items: center;
	    justify-content: center;
	    padding: 5px;
	    margin: 10px 0;
	    background: linear-gradient(90.67deg, rgba(217, 217, 217, 0.29) 3.51%, rgba(255, 255, 255, 0.29) 63.22%, rgba(208, 208, 208, 0.29) 121.09%);
	    box-shadow: -0.464798px 1.39439px 0px rgb(255 255 255 / 46%);
	    color: #fff;
	    font-family: 'Inter-Bold';
	    font-size: 12px;
	    font-style: italic;
	}

	footer {
	    display: flex;
	    align-items: center;
	    justify-content: center;
	    flex-direction: column;
	    position: absolute;
    	bottom: 0;
	}

	.normal_text {
		width: 90%;
		color: #aeaeae;
	    font-size: 12px;
	    margin-top: 10px;
	    padding: 0 5px;
	    margin-bottom: 0;
	    padding-left: 0;
	}

	.buttons-grid {
	    flex-direction: column;
	    gap: 10px;
	    padding-left: 0rem;
	}
		
	footer p {
		line-height: 15px;
		font-size: 10px;
	}
}