@import "owl.carousel.css";

@import "slider.css";

@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,500,700&subset=latin,cyrillic);
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}
.clearfix:after {
  clear: both;
}
.input-block-level {
  display: block;
  width: 100%;
  min-height: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.sp-social {
  background-image: url('images/social.png');
  background-repeat: no-repeat;
  display: block;
}
.sp-social-android {
  background-position: -3px -3px;
  width: 48px;
  height: 48px;
}
.sp-social-android-hover {
  background-position: -57px -3px;
  width: 48px;
  height: 48px;
}
.sp-social-apple {
  background-position: -111px -3px;
  width: 48px;
  height: 48px;
}
.sp-social-apple-hover {
  background-position: -3px -57px;
  width: 48px;
  height: 48px;
}
.sp-social-fb {
  background-position: -57px -57px;
  width: 48px;
  height: 48px;
}
.sp-social-fb-hover {
  background-position: -111px -57px;
  width: 48px;
  height: 48px;
}
.sp-social-kong {
  background-position: -3px -111px;
  width: 48px;
  height: 48px;
}
.sp-social-kong-hover {
  background-position: -57px -111px;
  width: 48px;
  height: 48px;
}
.sp-social-ok {
  background-position: -111px -111px;
  width: 48px;
  height: 48px;
}
.sp-social-ok-hover {
  background-position: -165px -3px;
  width: 48px;
  height: 48px;
}
.sp-social-sa {
  background-position: -165px -57px;
  width: 48px;
  height: 48px;
}
.sp-social-sa-hover {
  background-position: -165px -111px;
  width: 48px;
  height: 48px;
}
.sp-social-vk {
  background-position: -3px -165px;
  width: 48px;
  height: 48px;
}
.sp-social-vk-hover {
  background-position: -57px -165px;
  width: 48px;
  height: 48px;
}
.social-small {
  background-image: url('images/social-small.png');
  background-repeat: no-repeat;
  display: block;
}
.social-small-android-small {
  background-position: -3px -3px;
  width: 27px;
  height: 28px;
}
.social-small-android-small-hover {
  background-position: -36px -3px;
  width: 27px;
  height: 28px;
}
.social-small-apple-small {
  background-position: -69px -3px;
  width: 27px;
  height: 28px;
}
.social-small-apple-small-hover {
  background-position: -3px -37px;
  width: 27px;
  height: 28px;
}
.social-small-fb-small {
  background-position: -36px -37px;
  width: 28px;
  height: 28px;
}
.social-small-fb-small-hover {
  background-position: -70px -37px;
  width: 28px;
  height: 28px;
}
.social-small-kong-small {
  background-position: -3px -71px;
  width: 28px;
  height: 28px;
}
.social-small-kong-small-hover {
  background-position: -37px -71px;
  width: 28px;
  height: 28px;
}
.social-small-ok-small {
  background-position: -71px -71px;
  width: 28px;
  height: 28px;
}
.social-small-ok-small-hover {
  background-position: -102px -3px;
  width: 28px;
  height: 28px;
}
.social-small-sa-small {
  background-position: -104px -37px;
  width: 27px;
  height: 28px;
}
.social-small-sa-small-hover {
  background-position: -105px -71px;
  width: 27px;
  height: 28px;
}
.social-small-vk-small {
  background-position: -3px -105px;
  width: 27px;
  height: 28px;
}
.social-small-vk-small-hover {
  background-position: -36px -105px;
  width: 27px;
  height: 28px;
}
body {
  margin: 0;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  line-height: 1;
  color: #000000;
  background: url("images/main-bacgr.png");
}
#header {
  background-image: url("images/main-bacgr-black.png");
  line-height: 65px;
  color: #ffffff;
  position: relative;
}
#header:after {
  position: absolute;
  bottom: -11px;
  right: 0;
  background: url("images/triangel-header-red.png");
  background-repeat: no-repeat;
  height: 20px;
  width: 1243px;
  z-index: 3;
  content: "";
}
#header:before {
  position: absolute;
  bottom: -3px;
  left: 0;
  background: url("images/tringel-header-black.png");
  background-repeat: no-repeat;
  height: 4px;
  width: 635px;
  z-index: 2;
  content: "";
}
.container-header {
  width: 1171px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.main-menu {
  margin-left: 100px;
  float: left;
}
.main-menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.main-menu ul li {
  padding: 0;
  float: left;
  width: 163px;
  text-align: center;
  -webkit-transform: skewX(-10deg);
  -moz-transform: skewX(-10deg);
  transform: skewX(-10deg);
}
.main-menu ul li a {
  text-decoration: none;
  outline: 0;
  font-size: 16px;
  font-weight: 500;
  color: #ffffff;
  text-transform: uppercase;
}
.main-menu ul li a span {
  transform: skewX(10deg);
  -webkit-transform: skewX(10deg);
  -moz-transform: skewX(10deg);
  display: block;
  display: block;
}
.main-menu ul li:hover {
  background-color: #3b3b3b;
  opacity: 60%;
}
.main-menu ul li.current_page_item {
  background-color: #bf0000;
}
#footer {
  height: 100%;
  background-image: url("images/tile-black.png");
  padding: 44px 0 0 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: 10em;
  position: relative;
}
#footer:before {
  position: absolute;
  top: -18px;
  left: 0;
  background: url("images/tringel-footer-red.png");
  background-repeat: no-repeat;
  height: 31px;
  width: 1201px;
  z-index: 3;
  content: "";
}
#footer:after {
  position: absolute;
  top: -32px;
  right: 0;
  background: url("images/tringel-footer-black.png");
  background-repeat: no-repeat;
  height: 34px;
  width: 700px;
  z-index: 2;
  content: "";
}
#footer .footer-menu {
  margin: auto;
  width: 945px;
  padding: 0;
  list-style: none;
  text-align: justify;
}
#footer .footer-menu:after {
  display: inline-block;
  vertical-align: top;
  content: "";
  width: 100%;
}
#footer .footer-menu > li {
  width: 312px;
  display: inline-block;
  text-align: left;
  vertical-align: top;
}
#footer .footer-menu > li h4 {
  color: #e60000;
  font-size: 20px;
  font-weight: 300;
  text-transform: uppercase;
  margin: 0 0 39px 0;
  letter-spacing: 3px;
}
#footer .footer-menu > li ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#footer .footer-menu > li ul li {
  margin-bottom: 13px;
}
#footer .footer-menu > li ul li a {
  color: #ffffff;
  font-size: 17px;
  font-weight: 300;
  letter-spacing: 1px;
  text-decoration: none;
  outline: 0;
  -webkit-transition: 0.5s ease all;
  -moz-transition: 0.5s ease all;
  -o-transition: 0.5s ease all;
  transition: 0.5s ease all;
}
#footer .footer-menu > li ul li a:hover {
  text-decoration: underline;
}
#footer .footer-menu > li ul li p {
  margin: 0 0 20px 0;
  color: #9b9b9b;
  font-size: 16px;
  line-height: 18px;
  font-weight: 300;
}
#footer .footer-menu > li ul.game-list {
  margin-top: 60px;
  margin-right: 38px;
}
.copy-lang {
  margin: 40px 0 0 0;
  text-align: center;
  color: #9b9b9b;
  font-size: 16px;
  line-height: 18px;
  letter-spacing: 1px;
  font-weight: 300;
}
#main {
  min-height: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#main-slider {
  position: relative;
}
#main-slider .owl-item.active .item_inner {
  -webkit-animation: slideIn 0.9s 0.9s forwards;
  -moz-animation: slideIn 0.9s 0.9s forwards;
  -o-animation: slideIn 0.9s 0.9s forwards;
  -ms-animation: slideIn 0.9s 0.9s forwards;
  animation: slideIn 0.9s 0.9s forwards;
}
#main-slider .item img {
  width: 100%;
}
#main-slider .item_inner {
  position: absolute;
  background: url("images/shadow.png");
  bottom: 48px;
  left: 100px;
  width: 517px;
  height: 212px;
  padding: 33px 35px 0 52px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  opacity: 0;
  filter: alpha(opacity=0);
}
#main-slider .item_inner h4 {
  color: #FFF;
  font-size: 30px;
  font-weight: 500;
  margin: 0px 0 29px 0;
  letter-spacing: 4px;
}
#main-slider .item_inner p {
  color: #FFF;
  font-size: 16px;
  font-weight: 500;
  margin: 0;
  line-height: 20px;
  letter-spacing: 2px;
  word-spacing: 11px;
  margin-left: 4px;
}
#main-slider .owl-pagination {
  display: none;
}
#main-slider .owl-buttons div {
  text-indent: -9999999px;
  overflow: hidden;
  width: 21px;
  height: 50px;
  position: absolute;
  top: 40%;
}
#main-slider .owl-buttons div:hover {
  top: 38%;
  width: 31px;
  height: 72px;
}
#main-slider .owl-buttons div:hover.owl-next {
  background: url("images/next-hover.png");
  right: 55px;
}
#main-slider .owl-buttons div:hover.owl-prev {
  background: url("images/prev-hover.png");
  left: 47px;
}
#main-slider .owl-buttons div.owl-next {
  background: url("images/next-normal.png");
  right: 66px;
}
#main-slider .owl-buttons div.owl-prev {
  background: url("images/prev-normal.png");
  left: 58px;
}
.main-section {
  width: 990px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.contact-us {
  text-align: center;
  margin-top: 86px;
  margin-right: 137px;
  display: inline-block;
  vertical-align: top;
  width: 170px;
}
.contact-us i {
  display: block;
  width: 65px;
  height: 42px;
  background: url("images/contact-us.png");
  margin: auto;
}
.contact-us span {
  display: block;
  color: #ff0000;
  font-size: 23px;
  font-weight: 400;
  margin: 24px 0 9px 0;
}
.contact-us a {
  outline: 0;
  color: #000000;
  font-size: 20px;
  margin-left: 0px;
  font-weight: 400;
  letter-spacing: 2px;
}
.contact-us a:hover {
  text-decoration: none;
}
.about-company {
  margin-top: 69px;
  display: inline-block;
  vertical-align: top;
  width: 679px;
}
.about-company span {
  color: #ff0000;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 1px;
  word-spacing: 2px;
  margin-bottom: 10px;
}
.about-company p {
  font-size: 16px;
  font-weight: 400;
  margin: 18px 0 0 0;
  letter-spacing: 2px;
  line-height: 19px;
  word-spacing: 2px;
}
.main-container {
  width: 1171px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.arena {
  margin-top: 30px;
}
.arena figure {
  width: 269px;
  line-height: 256px;
  height: 270px;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 6.5px;
  background: url("images/main-bacgr-red.png");
  text-align: center;
  float: left;
}
.arena .text-container {
  width: auto;
  margin-left: 306px;
}
.arena .text-container .title-red {
  margin: 27px 0 16px 0;
}
.arena .text-container p {
  margin: 0;
  color: #1e1e1e;
  font-size: 18px;
  font-weight: 300;
  line-height: 21px;
}
.arena .text-container .social {
  margin: 15px 0 17px 0;
}
.title-red {
  vertical-align: top;
  margin: 0;
  line-height: 18px;
  color: #d40000;
  font-size: 24px;
  font-weight: 500;
  margin-right: 7px;
}
.title-red span {
  display: inline-block;
  width: 17px;
  height: 18px;
  margin-right: 7px;
  background: url("images/duble-slash.png");
}
.social {
  margin: 0;
  padding: 0;
  list-style: none;
  height: 48px;
}
.social li {
  float: left;
  margin-right: 4px;
}
.social li a {
  background-image: url('images/social.png');
  background-repeat: no-repeat;
  display: block;
}
.social li a.vk {
  background-position: -3px -165px;
  width: 48px;
  height: 48px;
}
.social li a.fb {
  background-position: -57px -57px;
  width: 48px;
  height: 48px;
}
.social li a.sa {
  background-position: -165px -57px;
  width: 48px;
  height: 48px;
}
.social li a.kong {
  background-position: -3px -111px;
  width: 48px;
  height: 48px;
}
.social li a.ok {
  background-position: -111px -111px;
  width: 48px;
  height: 48px;
}
.social li a.apple {
  background-position: -111px -3px;
  width: 48px;
  height: 48px;
}
.social li a.android {
  background-position: -3px -3px;
  width: 48px;
  height: 48px;
}
.social li a:hover.vk {
  background-position: -57px -165px;
  width: 48px;
  height: 48px;
}
.social li a:hover.fb {
  background-position: -111px -57px;
  width: 48px;
  height: 48px;
}
.social li a:hover.sa {
  background-position: -165px -111px;
  width: 48px;
  height: 48px;
}
.social li a:hover.kong {
  background-position: -57px -111px;
  width: 48px;
  height: 48px;
}
.social li a:hover.ok {
  background-position: -165px -3px;
  width: 48px;
  height: 48px;
}
.social li a:hover.apple {
  background-position: -3px -57px;
  width: 48px;
  height: 48px;
}
.social li a:hover.android {
  background-position: -57px -3px;
  width: 48px;
  height: 48px;
}
.arena-title {
  color: #1e1e1e;
  font-size: 18px;
  margin: 24px 0 24px 4px;
}
.list-arena {
  margin: 0 0 0 18px;
  padding: 0;
  font-size: 18px;
  color: #1e1e1e;
  line-height: 22px;
}
.img-list {
  margin: 38px -8px 50px 0;
  padding: 0;
  list-style: none;
}
.img-list li {
  float: left;
  width: 385px;
  margin-right: 5px;
  margin-bottom: 8px;
  position: relative;
}
.img-list li .play {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  background: url("images/play.png");
  width: 62px;
  height: 62px;
}
.img-list li:hover .play {
  background: url("images/play-hover.png");
}
.games {
  margin-top: 42px;
  margin-bottom: 125px;
}
.games .title-red {
  margin: 0 0 0 2px;
}
.games .description {
  color: #1e1e1e;
  font-size: 18px;
  font-weight: 400;
  margin: 23px 0 0 6px;
  line-height: 22px;
}
.game-list {
  margin: 35px 0 27px 0;
  padding: 0;
  list-style: none;
  text-align: justify;
}
.game-list:after {
  display: inline-block;
  vertical-align: top;
  content: "";
  width: 100%;
}
.game-list > li {
  display: inline-block;
  text-align: left;
  vertical-align: top;
  width: 285px;
  margin-bottom: 11px;
  position: relative;
  z-index: 1;
}
.game-list > li:hover .inner {
  opacity: 1;
  filter: alpha(opacity=100);
}
.game-list > li .inner {
  position: absolute;
  z-index: 2;
  width: 285px;
  height: 285px;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  background: url('images/bacg-hover.png');
  color: #ffffff;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: 0.6s ease all;
  -moz-transition: 0.6s ease all;
  -o-transition: 0.6s ease all;
  transition: 0.6s ease all;
}
.game-list > li .inner h4 {
  margin: 42px 0 0 0;
  text-align: center;
  font-size: 22px;
  font-weight: 500;
}
.game-list > li .inner p {
  font-size: 16px;
  font-weight: 300;
  margin: 16px 25px 42px 36px;
  line-height: 19px;
  word-spacing: 6px;
  height: 4em;
}
.game-list > li .inner .more {
  text-decoration: none;
  outline: 0;
  text-transform: uppercase;
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  vertical-align: top;
  line-height: 16px;
  float: right;
  margin-top: 1.2em;
  margin-right: 20px;
}
.game-list > li .inner .more i {
  width: 12px;
  height: 16px;
  background: url("images/arrow-more.png");
  background-repeat: no-repeat;
  display: inline-block;
  margin-left: 25px;
}
@media screen and (max-width: 1480px) {
  #header:after {
    width: 60%;
  }
  #footer:after {
    width: 30%;
  }
}