html {     scroll-behavior: smooth;   } body {     margin: 0;     background: #f9f9f7;     font: 300 15px / 22px Roboto, Helvetica, Arial, sans-serif;     -webkit-text-size-adjust: 100%;     -ms-text-size-adjust: 100%;     color: #666; } * {     -moz-box-sizing: border-box;     box-sizing: border-box; } a {     color: #668cc6;     text-decoration: none;     cursor: pointer; } a:hover {     color: #546b8e;     text-decoration: underline; } img {     max-width: 100%;     height: auto;     vertical-align: middle; } h1, h2, h3, h4, h5, h6 {     margin: 0 0 25px;     font-family: Roboto, Helvetica, Arial, sans-serif;     font-weight: 300;     color: #333;     text-transform: none; } .wrapper__pages {     display: flex; } .sidebar {     width: 30%;     padding-left: 0;     background: url(/shared/3410/bg-right-sidebar.webp) no-repeat #3d3e50;     position: fixed;     text-align: center;     z-index: 1000;     height: 100%;     right: 0; }  .sticky-placeholder {     margin: 0px; }  .sticky-placeholder__inner {     margin: 0px; }  .sidebar-menu {     padding: 40px 0;     text-align: center;     z-index: 1002; }  .sidebar-logo {     display: inline-block;     margin: 0 auto 40px; }  .sidebar-logo img {     width: 100%;     height: auto; }  .sidebar-nav {     margin-bottom: 40px;     display: block; }  .nav {     max-width: 240px;     margin: 0 auto;     list-style: none;     padding: 0; }  .nav-item {     margin: 0;     background: rgba(190, 190, 190, .6);     position: relative; }  .nav-item a {     display: block;     font-size: 15px;     font-family: Roboto, Helvetica, Arial, sans-serif;     height: 50px;     padding: 0;     border: none;     border-bottom: 1px solid rgba(255, 255, 255, .2);     background-color: rgba(0, 0, 0, 0);     color: rgba(255, 255, 255, .85);     line-height: 50px;     font-weight: 400;     position: relative;     overflow: hidden;     z-index: 0;     -webkit-transition: all .2s ease;     transition: all .2s ease;     -webkit-transform-style: preserve-3d;     text-transform: uppercase;     text-decoration: none; } .nav-item > a::before {     content: "";     position: absolute;     bottom: 0;     left: 0;     right: 0;     margin-left: auto;     margin-right: auto;     height: 1px;     width: 15px;     background: rgba(255, 255, 255, .4);     -webkit-transition: all .1s linear;     transition: all .1s linear; } .nav-item > a:hover {     color: #fff; } .nav-item > a:hover::before {     height: 2px;     width: 30px;     background: #fff; } .dropdown {     display: none;     position: absolute;     top: 100%;     left: 0;     z-index: 1020;     -moz-box-sizing: border-box;     box-sizing: border-box;     width: 200px;     padding: 15px 0;     font-size: 1rem;     vertical-align: top;     border-radius: 1px;     margin-top: 12px;     background: #fafafa;     color: #666; } .nav-item:hover .dropdown {     display: block;     transform-origin: 0 0;     top: 0;     left: auto;     right: -200px;     background: #fafafa;     box-shadow: 1px 1px 1px rgba(0, 0, 0, .1);     -webkit-animation: slide-right .2s ease-in-out;     animation: slide-right .2s ease-in-out; } @keyframes slide-right {     0% {         transform: translateX(100%);     }          100% {         transform: translateX(0);     } } .grid {     display: -ms-flexbox;     display: -webkit-flex;     display: flex;     -ms-flex-wrap: wrap;     -webkit-flex-wrap: wrap;     flex-wrap: wrap;     margin: 0;     padding: 0; }  .nav-list {     list-style: none;     padding: 0; }  .nav-list li > a {     position: relative;     overflow: hidden;     z-index: 0;     -webkit-transition: all .2s ease;     transition: all .2s ease;     -webkit-transform-style: preserve-3d;     color: #666;     padding: 5px 25px;     display: block;     text-decoration: none;     text-align: left;     text-transform: none;     line-height: 1;     height: auto; } .dropdown:before {     z-index: -1;     display: block;     content: "";     position: absolute;     top: 12px;     left: -6px;     background: #fafafa;     width: 12px;     height: 12px;     -webkit-transform: rotate(45deg);     -ms-transform: rotate(45deg);     transform: rotate(45deg);     border-radius: 1px; }  .play-now {     background: rgba(92, 165, 32, .9); }  .play-now a:hover {     background: rgba(250, 21, 2, .85) !important; }  .play-now-ar {     float: none;     max-width: 240px;     margin: 0 auto;     width: 45px;     height: 55px;     background-image: url(/shared/3410/letsplay-ar.png);     background-repeat: no-repeat;     position: relative;     margin-top: -52px !important;     animation: mymove 1s;     animation-iteration-count: infinite; }  @keyframes mymove {     0%, 100%, 25%, 75% {         left: 28%;     }          50% {         left: 30%;     } }  .sidebar-widgets {     position: absolute;     right: 0;     bottom: 0;     left: 0; }  .sidebar-main {     position: absolute;     right: 0;     bottom: 76px;     left: 0; }  .panel {     display: block;     position: relative;     max-width: 70%;     margin: 40px auto;     text-align: left;     text-decoration: none; }   .panel-title {     margin-top: 0;     font-size: 20px;     line-height: 24px;     color: #333;     margin-bottom: 25px;     text-transform: none;     font-weight: 300; }  .half {     width: 100%; }  .grid > * > :last-child {     margin-bottom: 0; }  .sidebar-social {     position: absolute;     right: 0;     bottom: 0;     left: 0;     height: 26px;     padding: 20px;     border-top: 1px solid rgba(42, 52, 68, .8);     background: rgba(42, 52, 68, .8);     overflow: hidden;     display: flex;     align-items: center;     justify-content: center; }  .content-wrapper {     width: 50%;     padding-left: 0;     position: relative;     border-right: 1px solid rgba(0, 0, 0, .05);     background: #fff; }  .navbar {     padding: 30px 60px;     background: #fafafa;     border-bottom: 1px solid rgba(0, 0, 0, .05);     display: none;     color: #666;     justify-content: space-between;     align-items: center; }  .navbar-toggle {     display: block;     width: 25px;     height: 25px; }  .navbar-center {     text-align: center;     max-width: 50%;     margin-left: auto;     margin-right: auto;     display: block;     height: 35px;     padding: 0 12px; }  .content-container { padding: 60px 15px; } .content-top .panel {     display: block;     position: relative;     max-width: 100%;     margin: 0 auto; } * + h1, * + h2, * + h3, * + h4, * + h5, * + h6 {     margin-top: 40px; } h1 {     font-size: 34px;     line-height: 44px; } * + address, * + blockquote, * + dl, * + fieldset, * + figure, * + ol, * + p, * + pre, * + ul {     margin-top: 25px; }  p::first-letter {     font-size: 2em;     color: rgb(0, 0, 0);     font-family: 'Times New Roman', Times, serif; }  h2 {     font-size: 28px;     line-height: 32px; } h3 {     font-size: 20px;     line-height: 24px; } .responsive-grid {     gap: 10px;     justify-content: center;     background: #fafafa; } .game-gallery {     margin: 60px 0; }  .grid-item {     width: 31%;     padding: 25px  0;     color: #444;     border: 1px solid transparent;     border-radius: 1px; }  .cover-link {     position: absolute;     top: 0;     bottom: 0;     left: 0;     right: 0; }  .divider {     margin: 0;     border-top: none; } hr {     height: 0;     margin: 25px 0;     border-top: 1px solid rgba(0, 0, 0, .05); } hr, img {     border: 0; }  .bottom-content-block {     padding: 60px;     background: #fafafa;     border-top: 1px solid rgba(0, 0, 0, .05); }  .content-bottom {     justify-content: center; }  .footer {     display: flex;     justify-content: space-between;     align-items: center;     border-top: 1px solid rgba(0, 0, 0, .05);     text-align: center;     padding: 20px;     overflow: hidden; } .scroll-top {     display: block;     z-index: 1000;     width: 20px;     height: 20px;     -webkit-transition: all linear 50ms;     transition: all linear 50ms; }  .scroll-top svg {     width: 100%;     height: 100%; }  .right {     width: 20%; }  .sb_casns {     padding: 0 0 6px 0;     margin: 0 0 24px 0;     background: #F3F3F3;     border-radius: 32px 32px 5px 5px;     width: 100%;     position: sticky;     top: 10px; }  .sb_casns_t {     padding: 15px 32px;     margin: 0 0 34px 0;     background: radial-gradient(436.76% 436.76% at 50% 0%, #206CBA 0%, #14125E 100%);     border-radius: 32px 32px 0px 0px;     font-size: 20px;     line-height: 22px;     color: #FFFF00;     font-weight: bold; } .sb_casns_t {     padding: 15px 22px;     text-align: center; }  .sb_cas {     padding: 0 23px 28px 23px;     display: flex;     align-items: center;     justify-content: space-between;     gap: 10px; } .sb_cas_img {     width: 62px;     height: auto; } .sb_cas_img img {     vertical-align: bottom;     border-radius: 50%;     width: 100%; } .sb_cas_c {     width: 150px; } .sb_cas_t {     padding: 0 0 1px 0;     color: #070707;     font-size: 16px;     line-height: 20px; } .sb_cas_t a {     color: #070707; } .sb_cas_d {     padding: 0 0 10px 0;     color: #808080;     font-size: 12px;     line-height: 15px; } .sb_cas_rat {     line-height: 14px; } .sb_cas_rat span.active {     display: inline-block;     width: 15px;     height: 14px;     margin: 0 2px 0 1px;     background: url(/shared/3410/star3.svg) no-repeat;     vertical-align: bottom; } .sb_cas_rat span {     display: inline-block;     width: 15px;     height: 14px;     margin: 0 2px 0 1px;     background: url(/shared/3410/star4.svg) no-repeat;     vertical-align: bottom; } .sb_cas_go a {     display: block;     width: 42px;     height: 42px;     background: url(/shared/3410/sb_cas_go.svg) no-repeat; }  .offcanvas {     display: none;     right: 0;     z-index: 1000;     touch-action: none;     background: rgba(51, 51, 51, .3);     position: fixed;     left: 0;     top: 0;     bottom: 0; } .cross {     position: absolute;     right: 20px;     top: 20px;     width: 20px;     height: 20px; } .offcanvas.active {     display: block; } .offcanvas-bar {     position: fixed;     left: 0;     top: 0;     bottom: 0;     -webkit-transform: translateX(-100%);     transform: translateX(-100%);     z-index: 1001;     width: 240px;     max-width: 100%;     background: #333;     overflow-y: auto;     -webkit-overflow-scrolling: touch;     -webkit-transition: -webkit-transform .3s ease-in-out;     transition: transform .3s ease-in-out;     -ms-scroll-chaining: none; } .active .offcanvas-bar {     -webkit-transform: translateX(0);     transform: translateX(0); } .menu {     list-style: none;     margin: 0;     padding: 0; } .menu-item > a {     text-transform: uppercase;     display: block;     padding: 10px 15px;     border-top: 1px solid rgba(255, 255, 255, .03);     border-bottom: 1px solid #2b2b2b;     background: #3b3b3b;     box-shadow: 0 1px 3px #2e2e2e;     font-size: 14px;     position: relative;     overflow: hidden;     z-index: 0;     -webkit-transition: all .2s ease;     transition: all .2s ease;     -webkit-transform-style: preserve-3d;     background: #1a1a1a;     color: #fff; } .offcanvas ul a {     color: rgba(255, 255, 255, .7); } .submenu {     padding: 20px 0 20px 25px;     font-size: 13px;     margin: 0;     list-style: none; } @media only screen and (max-width: 1280px) {     .right {         display: none;     }     .content-wrapper {         width: 60%;     }     .sidebar {         width: 40%;     }     .sidebar-menu {         width: 40%;     }     .nav-item {         margin: 0;         background: rgb(63 63 63 / 80%);     } }  @media only screen and (max-width: 1024px) {     .sidebar {         display: none;     }     .content-wrapper {         width: 100%;     }     .navbar {         display: flex;     } }  @media only screen and (max-width: 767px) {     .grid-item {         width: 45%;     }     .image-block {         text-align: center;     } }  @media only screen and (max-width: 540px) {     .grid-item {         width: 100%;     }     .content-container {         padding: 60px 10px;     }     .navbar {         padding: 30px 10px;     } }