*{
	outline: none;
}
html {
    scroll-behavior: smooth;
}
header{
	border-bottom: 1px solid #CCC;
	border-top: 3px solid #fe5000;
	padding: 1.2em 0;
}
h1,h2,h3,h4,h5,h6,p,a,button,span{
	font-family: 'Open Sans', sans-serif;
}
.primary-menu li a{
	color: #292929;
	font-size: 18px;
	font-weight: 600;
-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;	
  border-bottom: 2px solid transparent;
}
.primary-menu li a:hover{color: #fe5000;}
.primary-menu li a:hover::after{width:100%;}
.primary-menu li a::after{content:'';display:block;width:0;height:2px;background:#fe5000;transition:width .5s;top: 3px;position: relative;}
.contact-us:hover::after{display: none;}
.custom-container{
	max-width: 85%;
}
#hero{
background-color: #fe5000;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='%23ff9666' fill-opacity='0.31'%3E%3Cpath fill-rule='evenodd' d='M0 0h40v40H0V0zm40 40h40v40H40V40zm0-40h2l-2 2V0zm0 4l4-4h2l-6 6V4zm0 4l8-8h2L40 10V8zm0 4L52 0h2L40 14v-2zm0 4L56 0h2L40 18v-2zm0 4L60 0h2L40 22v-2zm0 4L64 0h2L40 26v-2zm0 4L68 0h2L40 30v-2zm0 4L72 0h2L40 34v-2zm0 4L76 0h2L40 38v-2zm0 4L80 0v2L42 40h-2zm4 0L80 4v2L46 40h-2zm4 0L80 8v2L50 40h-2zm4 0l28-28v2L54 40h-2zm4 0l24-24v2L58 40h-2zm4 0l20-20v2L62 40h-2zm4 0l16-16v2L66 40h-2zm4 0l12-12v2L70 40h-2zm4 0l8-8v2l-6 6h-2zm4 0l4-4v2l-2 2h-2z'/%3E%3C/g%3E%3C/svg%3E");
	padding: 2em 0;
	    animation: slide 50s linear infinite;
}
@keyframes slide {
    0% {
        background-position-x: 0;
        background-position-y: 0;
    }
    100% {
        background-position-x: -1950px;
    }
}
#hero h1{
	font-weight: bold;
	color: #FFF;
	text-shadow: 1px 1px 1px #c60f13;
}
#hero img{
	max-height: 70px;
}
.contact-us{
    background: #007ec6;
    color: #FFF !important;
    border-radius: 4px;
    margin-left: 1em;
}
.contact-us:hover, .contact-us:focus, .contact-us:active{
	background: #089cf1;
}
.title-common{
	color: #007ec6;
	font-size: 2.3em;
	font-weight: 600;
}
.title-common img{
    height: 50px;
    display: inline-block;
}
.sub-title{
	font-size: 18px;
    color: rgba(3,27,78,.7);	
}
.card-game{
	position: relative;
	border-radius: 5px;
	overflow: hidden;
-webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;			
}
.card-game:hover{
	transform: scale(1.03);
    box-shadow: 1px 1px 21px 3px #abababd9;	
}
.card-game-name{
    background: #fe5000;
    padding: 0.5em;
}
.thumb-game{
	background: #000;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
}
.thumb-game img{
-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;		
  width: 100%;
}
.thumb-game:hover img{
  opacity: 0.3;
  
}
.card-game-name h2{
    margin: 0;
    font-size: 1em;
    color: #FFF;
    text-align: center;	
    font-weight: bold;
}
.card-game-view-more{
	position: absolute;
	z-index: 9;
	color: #FFF;
	bottom: -100px;
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
}
.card-game:hover .card-game-view-more{
	bottom: 120px;
}
.button-custom{
	background: #fe5000;
	margin:0;
}
.button-custom:hover, .button-custom:active, .button-custom:focus{
	background: #e64900;
}
.branding-services{
	background: #f3f5f9;
	padding: 3em 0;
}
.feature-box{
	background: #FFF;
    padding: 1em;
    border: 1px solid #edf1f9;
    border-radius: 6px;
-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;	    
}
.feature-box:hover{
    box-shadow: 4px 7px 75px 1px #d4dcea;
}
.feature-box h3{
    color: #031b4e;
    font-weight: bold;
    font-size: 1.3em;
}
.feature-box p{
    color: rgba(3,27,78,.7);
    margin-bottom: 0;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
}
.faq-box p{
	margin-bottom: 1em;
	border-bottom: 1px solid #EAEAEA;
	padding-bottom: 1em;
}
#page-content p{
    color: rgba(3,27,78,.7);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;	
}
#page-content ul, #page-content ol, #page-content ol li, #page-content ul li{
    color: rgba(3,27,78,.7);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;		
}

#page-content h1,#page-content h2,#page-content h3,#page-content h4,#page-content h5,#page-content h6{
    font-weight: bold;
    color: #007ec6;	
}

.feature-box img{
	height: 100px;
	margin-bottom: 1em;
}
.required{
	color: red;
}
footer{
    background: #353739;
    padding: 1.4em 0 0 0;
    margin-top: 1em;
    border-top: 3px solid #56595d;
}
footer p{
    color: #FFF;
    font-size: 14px;
    margin: 1em 0 0 0;
    text-align: center;
    border-top: 1px solid #4e5154;
    padding: 1em 0;
}
.wrapper-logo-client{
    border: 1px solid #e6e6e6;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.swiper-button-next,.swiper-button-prev{
	background: none;
}
.relative{
	position: relative;
}
.swiper-button-next1, .swiper-button-next2{
	top: -40px;
	right: 0;
}
.swiper-button-prev1, .swiper-button-prev2{
    top: -40px;
    right: 35px;
    left: auto;
}
.breadcrumbs {
    margin: 0 0 1rem 0;
    list-style: none;
    background: #f3f5f9;
    padding: 0.5em;
    border-radius: 2px;
    border: 1px solid #cccccc36;
}
.game-description h3{
	font-weight: bold;
	color: #007ec6;
	font-size: 2em;
}
.game-description h4{
	font-weight: bold;
	color: #fe5000;
	font-size: 1.4em;
}
.game-description p, .game-description ul li, .game-description ul li a{
    font-size: 18px;
    color: rgba(3,27,78,.7);	
    line-height: 1.4;
}
footer ul{
	margin: 0;
	list-style: none;
}
footer ul li, footer ul li a{
	color: #FFF;
	font-size: 14px;
	line-height: 1.8;
}	
footer ul li a:hover{
	color: #fe5000;
}

#mobile-menu{
	height: 40px;
	margin-right: 1em;
}
#gameplay{
	padding: 3em;
background-color: #222222;
background-image: url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M81.28 88H68.413l19.298 19.298L81.28 88zm2.107 0h13.226L90 107.838 83.387 88zm15.334 0h12.866l-19.298 19.298L98.72 88zm-32.927-2.207L73.586 78h32.827l.5.5 7.294 7.293L115.414 87l-24.707 24.707-.707.707L64.586 87l1.207-1.207zm2.62.207L74 80.414 79.586 86H68.414zm16 0L90 80.414 95.586 86H84.414zm16 0L106 80.414 111.586 86h-11.172zm-8-6h11.173L98 85.586 92.414 80zM82 85.586L87.586 80H76.414L82 85.586zM17.414 0L.707 16.707 0 17.414V0h17.414zM4.28 0L0 12.838V0h4.28zm10.306 0L2.288 12.298 6.388 0h8.198zM180 17.414L162.586 0H180v17.414zM165.414 0l12.298 12.298L173.612 0h-8.198zM180 12.838L175.72 0H180v12.838zM0 163h16.413l.5.5 7.294 7.293L25.414 172l-8 8H0v-17zm0 10h6.613l-2.334 7H0v-7zm14.586 7l7-7H8.72l-2.333 7h8.2zM0 165.414L5.586 171H0v-5.586zM10.414 171L16 165.414 21.586 171H10.414zm-8-6h11.172L8 170.586 2.414 165zM180 163h-16.413l-7.794 7.793-1.207 1.207 8 8H180v-17zm-14.586 17l-7-7h12.865l2.333 7h-8.2zM180 173h-6.613l2.334 7H180v-7zm-21.586-2l5.586-5.586 5.586 5.586h-11.172zM180 165.414L174.414 171H180v-5.586zm-8 5.172l5.586-5.586h-11.172l5.586 5.586zM152.933 25.653l1.414 1.414-33.94 33.942-1.416-1.416 33.943-33.94zm1.414 127.28l-1.414 1.414-33.942-33.94 1.416-1.416 33.94 33.943zm-127.28 1.414l-1.414-1.414 33.94-33.942 1.416 1.416-33.943 33.94zm-1.414-127.28l1.414-1.414 33.942 33.94-1.416 1.416-33.94-33.943zM0 85c2.21 0 4 1.79 4 4s-1.79 4-4 4v-8zm180 0c-2.21 0-4 1.79-4 4s1.79 4 4 4v-8zM94 0c0 2.21-1.79 4-4 4s-4-1.79-4-4h8zm0 180c0-2.21-1.79-4-4-4s-4 1.79-4 4h8z' fill='%232f2f2f' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
}
.responsive-embed iframe{
	border: 0;
}
.preview-game{
	position: relative;
}
#game-preview{
    opacity: 0.4;
    margin: 0 auto;
    left: 0;
    right: 0;
    display: flex;
}

#play-button-game:hover{
	cursor: pointer;
}

#play-button-game{
	position: absolute;
	z-index: 10;
	width: 100px;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin:auto auto;
}
@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}
.call-action {
    background-image: radial-gradient( circle farthest-corner at 7.9% 16.1%, rgba(245,129,90,1) 1.3%, rgba(242,80,80,1) 100.2% );
    display: inline-block;
    padding: 0.5em 1em;
    border-radius: 7px;
    position: fixed;
    bottom: 2%;
    right: 2%;
    z-index: 5;
    box-shadow: 2px 2px 14px 4px #1f060626;
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;  
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;      
  -webkit-animation-delay: 2s;
  animation-delay: 2s;  
  animation-iteration-count: 1 !important;
}
.call-action strong{
	color: #FFF;
    font-size: 1em;
    text-transform: uppercase;
    position: relative;
    top: 2px;
    text-shadow: 2px 2px 4px #ce3936;
}
.call-action img {
    height: 30px;
    padding-right: 7px;
}
.box-portfolio{
    padding: 1em;	
}


/* Small only */
@media screen and (max-width: 39.9375em) {
	.preview-game{
		display: none;
	}
	#gameplay{
		padding: 1em 0 2em 0;
	}
	#hero h1{
		font-size: 2em;
	}
	#hero img {
	    max-height: 50px;
	}	
	.primary-menu{
		display: block;
		margin-top: 1em;
		border: 1px solid #EAEAEA;
		border-radius: 3px;
	}
	.primary-menu li a{
		width: 100%;
		border-bottom: 1px solid #EAEAEA;
	}
	.contact-us{
		background: none;
		margin-left: 0;
		color: #292929 !important;
	}
	.contact-us:hover, .contact-us:active, .contact-us:focus{
		background: none;
		color: #fe5000 !important;
	}
	.primary-menu li a:hover::after{
		display: none;
	}
	.toggle-menu{
		display: none;
	}
	.thumb-game img{
		width: 100%;
	}
	.thumb-game:hover img{
		opacity: 1;
	}
	.card-game-view-more{
		display: none;
	}
	.feature-box{
		margin-bottom: 1em;
	}
	.swiper-button-next1 {
	    top: 90px;
	    right: -13px;
	}
	.swiper-button-next2{
		display: none;
	}
	.swiper-button-prev1{
	    top: 90px;
	    left: -13px;
	}		
	.swiper-button-prev2 {
		display: none;
	}
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	#hero h1{
		font-size: 2em;
	}
	#hero img {
	    max-height: 50px;
	}	
	.primary-menu{
		display: block;
		margin-top: 1em;
		border: 1px solid #EAEAEA;
		border-radius: 3px;
	}
	.primary-menu li a{
		width: 100%;
		border-bottom: 1px solid #EAEAEA;
	}
	.contact-us{
		background: none;
		margin-left: 0;
		color: #292929 !important;
	}
	.contact-us:hover, .contact-us:active, .contact-us:focus{
		background: none;
		color: #fe5000 !important;
	}
	.primary-menu li a:hover::after{
		display: none;
	}
	.toggle-menu{
		display: none;
	}
}


/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {
	.toggle-menu{
		display: flex !important;
	}
}
/* Large up */
@media screen and (min-width: 74.9376em) {
	.toggle-menu{
		display: flex !important;
	}	
}