@font-face {
	font-family: "Xolonium-Bold";
	src: url("../fonts/XOLONIUM-BOLD.OTF") format("opentype");
	;
	font-weight: bold;
	font-style: normal;
}
@font-face {
	font-family: "Xolonium-Regular";
	src: url("../fonts/XOLONIUM-REGULAR.OTF") format("opentype");
	;
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "ROGFont-Regular";
	src: url("../fonts/ROGFontsv1.6-Regular.otf") format("opentype");
	;
	font-weight: normal;
	font-style: normal;
}
html {
	font-size: 100%;
	height: 100%;
	width: 100%;
	overflow-x: hidden;
	margin: 0px;
	padding: 0px;
	touch-action: manipulation;
}
body {
	font-size: 16px;
	font-family: 'Open Sans', sans-serif;
	width: 100%;
	height: 100%;
	margin: 0;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	word-wrap: break-word;
	overflow-x: hidden;
	color: #333;
	background-image: url(../images/countdown-5-1600x900.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
}
h1, h2, h3, h4, h5, h6, p, a, ul, span, li, img, inpot, button {
	margin: 0;
	padding: 0;
}
h1, h2, h3, h4, h5, h6 {
	line-height: 1.5;
	font-weight: inherit;
}
p {
	line-height: 1.6;
	font-size: 1.05em;
	font-weight: 400;
	color: #555;
}
h1 {
	font-size: 2.5em;
	line-height: 1;
}
h2 {
	font-size: 2em;
	line-height: 1.1;
}
h3 {
	font-size: 1.5em;
	font-family: "Xolonium-Regular";
}
h4 {
	font-size: 1.2em;
}
h5 {
	font-size: .9em;
}
a, button {
	display: inline-block;
	text-decoration: none;
	color: inherit;
	transition: all .3s;
	line-height: 1;
}
a:focus, a:active, a:hover, button:focus, button:active, button:hover, a b.light-color:hover {
	text-decoration: none;
	color: #000;
}
b {
	font-weight: 500;
}
/*
img {
	width: 100%;
}*/
span {
	display: inline-block;
}
button {
	outline: 0;
	border: 0;
	background: lightgray;
	cursor: pointer;
	margin: 5px;
	padding: 10px;
	border-radius: 5px;
	color: #000;
	font-weight: 700;
	font-family: "Xolonium-Regular";
}
b.light-color {
	color: #444;
}
.icon {
	font-size: 1.1em;
	display: inline-block;
	line-height: inherit;
}
[class^="icon-"]:before, [class*=" icon-"]:before {
	line-height: inherit;
}
html {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
*, *::before, *::after {
	-webkit-box-sizing: inherit;
	box-sizing: inherit;
}
/* ---------------------------------
2. COMMONS FOR PAGE DESIGN
--------------------------------- */

.center-text {
	text-align: center;
}
.display-table {
	display: table;
	height: 100%;
	width: 100%;
}
.display-table-cell {
	display: table-cell;
	vertical-align: middle;
}



::-webkit-input-placeholder {
font-size: .9em;
letter-spacing: 1px;
}

::-moz-placeholder {
font-size: .9em;
letter-spacing: 1px;
}

:-ms-input-placeholder {
font-size: .9em;
letter-spacing: 1px;
}

:-moz-placeholder {
font-size: .9em;
letter-spacing: 1px;
}
.full-height {
	height: 100%;
}
.position-static {
	position: static;
}
.font-white {
	color: #fff;
}
.desc {
	margin: 20px auto;
	max-width: 550px;
	text-align: center;
}
/*Youtube section*/
.youtube-video-section {
	position: relative;
	width: 100%;
	margin: 0 auto;
	max-width: 2560px;
	text-align: center;
}
.youtube-video-section img {
	width: 100%;
	height: auto;
}
.youtube-video-section .iframe-content {
	position: absolute;
    top: 12%;
    left: 43%;
    width: 52%;
	height: 0;
	margin-left: -35%;
	padding-bottom: 27.25%;
}
.youtube-video-section .iframe-content iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media (max-width: 768px) {
.video-play-btn {
	width: 65px;
	height: 65px;
}
.youtube-video-section .iframe-content {
	position: absolute;
	top: 55%;
	left: 50%;
	width: 80%;
	height: 0;
	margin-left: -40%;
	padding-bottom: 53.25%;
}
}

@media only screen and (max-width: 767px) {
p {
	line-height: 1.4;
}
h1 {
	font-size: 2em;
	line-height: 1;
}
h2 {
	font-size: 1em;
	line-height: 1.1;
}
}
.igchallenge {
}
.igchallenge .notify-btn {
	margin: 20px 0 50px;
	padding: 13px 35px;
	border-radius: 50px;
	border: 2px solid #185A56;
	color: yellow;
	background: #185A56;
}
.igchallenge .notify-btn:hover {
	background: none;
}
#pagewrapper {
	margin: 0 8%;
	color: #FFFFFF;
	font-size: 1.05em;
	font-weight: 100 !important;
	line-height: 1.5;
}
.row {
	//padding: 8px;
	/*border: 1px white solid;*/
}
.column-half {
	padding: 4%;
	
	background-color: #222222;
}
td {
	padding: 5px;
	;
}
.title {
	font-family: "Xolonium-Regular";
	color: white;
	text-align: center;
}

@media (min-width: 768px) {
.row {
	display: table;
	table-layout: fixed;
	width: 100%;
}
.column-half {
	display: table-cell;
	width: 50%;
	vertical-align: middle;
}
td {
	padding: 10px;
}
}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.flex-wrap2 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
section.step {
	position: relative;
	padding: 0 5%;
}
section.step h2 {
	text-shadow: 1px 1px 0px #000, 1px 2px 0px #000, 1px 3px 0px #000, 1px 4px 0px #000;
}
section.step .flex-wrap2 {
	width: 100%;
	max-width: 1680px;
	margin: 0 auto;
}

@media (max-width: 992px) {
section.step .flex-wrap2 {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}
}
section.step .item {
	position: relative;
	width: calc(100% / 3);
	padding: 3em 3em;
	margin: 0px 8px;
	background: -o-linear-gradient(334deg, #AAB3BC 14%, #D8DDE0 69%);
	background: linear-gradient(116deg, #AAB3BC 14%, #D8DDE0 69%);
	-webkit-box-shadow: 5px 5px 8px #000000;
	box-shadow: 5px 5px 8px #000000;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	cursor: default;
}
section.step .item.flex-wrap2 {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
section.step .item.flex-wrap2 p.small {
	font-size: 14px;
	margin: 0;
	color: #f00;
	line-height: 1;
}

@media (max-width: 992px) {
section.step .item {
	width: 100%;
	margin: 8px 0;
	padding: 16px 24px;
}
}
section.step .item:nth-of-type(2) {
	background: -o-linear-gradient(334deg, #AAB3BC 14%, #D8DDE0 69%);
	background: linear-gradient(116deg, #AAB3BC 14%, #D8DDE0 69%);
}
section.step .item::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: calc(100% - 4px);
	height: calc(100% - 4px);
	margin: auto;
	background: -o-linear-gradient(50deg, #D3D8DB 77%, rgba(17, 17, 17, 0.3) 100%);
	background: linear-gradient(40deg, #D3D8DB 77%, rgba(17, 17, 17, 0.3) 100%);
}
section.step .item > * {
	position: relative;
	z-index: 5;
}
section.step .item h3 {
	font-weight: 600;
	color: #ff0000;
}
section.step .item h3 i {
	font-size: 50%;
	margin-left: 0.2em;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
section.step .item p {
	font-size: 1.05em;
}
section.step .item a {
	color: #f00;
}
section.step .item a:hover {
	font-weight: 600;
}
section.step .item:hover {
	-webkit-transform: translateY(-8px);
	-ms-transform: translateY(-8px);
	transform: translateY(-8px);
	-webkit-box-shadow: 5px 13px 8px #000000;
	box-shadow: 5px 13px 8px #000000;
}
section.step .item:hover h3 i {
	margin-left: 1em;
}
.post-wrap {
	padding: 4%;
	max-width: 1600px;
	background: #222222;
}
.post-wrap p {
	font-size: 1.05em;
	text-align: left;
	margin: 0 5%;
}
.post-wrap ul {
	font-size: 1.05em;
	text-align: left;
	margin: 0 4.5%;
}
.buttonclaim {
	margin: 20px 0;
	padding: 8px 35px 20px;
	border-radius: 50px;
	border: 2px solid #F2171F;
	color: white;
	background: #F2171F;
	box-shadow: 5px 13px 8px #000000;
	font-family: "ROGFont-Regular";
	font-size: 1.5em;
}
.buttonclaim:hover {
	background: none;
	color: #F2171F;
}
.bg-4 {
	background-color: black;
	color: white;
}
.container-fluid {
	padding-top: 50px;
	padding-bottom: 30px;
}
.space {
	margin: 0px 0;
}

@media (max-width: 768px) {
.space {
	margin: 0px 0;
}
}


.column22 {
float: left;
width: 25%;
margin-bottom: 16px;
padding: 0 8px;
}
@media screen and (max-width: 768px) {
.column22 {
width: 100%;
display: block;
}
}
.card22 {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
.container22 {
padding: 0 16px;
}
.h4 {
font-size: 17px;
}
.container22::after, .row::after {
content: "";
clear: both;
display: table;
}
.title2222 {
color: grey;
}
.button22 {
border: none;
outline: 0;
display: inline-block;
padding: 8px;
color: white;
background-color: #0094f2;
text-align: center;
cursor: pointer;
width: 100%;
}
.button22:hover {
background-color: #4B576C;
}
a.button22:hover {
color: white;
}
a.button22 {
color: white;
}

.wrap-ecomm {
		   overflow: hidden;
		   margin: 10px;
}
.box-ecomm {
   float: left;
   position: relative;
   width: 25%;
   padding-bottom: 160px;
}
.boxInner-ecomm {
   position: absolute;
   left: 15%;
   right: 10px;
   top: 10px;
   bottom: 10px;
   overflow: hidden;
}
.boxInner-ecomm img {
   width: 100%;
}
.boxInner-ecomm .titleBox {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   margin-bottom: -50px;
   background: #000;
   background: rgba(0, 0, 0, 0.5);
   color: #FFF;
   padding: 10px;
   text-align: center;
   -webkit-transition: all 0.3s ease-out;
   -moz-transition: all 0.3s ease-out;
   -o-transition: all 0.3s ease-out;
   transition: all 0.3s ease-out;
}
body.no-touch .boxInner-ecomm:hover .titleBox, body.touch .boxInner-ecomm.touchFocus .titleBox {
   margin-bottom: 0;
}

@media only screen and (max-width : 480px) {
   /* Smartphone view: 1 tile */
   .box-ecomm {
	  width: 50%;
	  padding-bottom: 30%;
   }
}
@media only screen and (max-width : 650px) and (min-width : 481px) {
   /* Tablet view: 2 tiles */
   .box-ecomm {
	  width: 50%;
	  padding-bottom: 140px;
   }
}
@media only screen and (max-width : 1050px) and (min-width : 651px) {
   /* Small desktop / ipad view: 3 tiles */
   .box-ecomm {
	  width: 33.3%;
	  padding-bottom: 130px%;
   }
}
@media only screen and (max-width : 1290px) and (min-width : 1051px) {
   /* Medium desktop: 4 tiles */
   .box-ecomm {
	  width: 25%;
	  padding-bottom: 170px;
   }
}