        html {
	height: 100%;

	background-color: #201c19c4;
	}
body {
	font-family: arial, georgia, helvetica, "MS Sans Serif", sans-serif;
	font-size: 14px;
	position: relative;
	max-width:1400px;
	max-width: 100%;
	margin: 0 auto;
	margin-top: 15px;
	padding: 60px 15px 0px 15px;
	color: #e8ded5;
	background: #201c19c4;
	background-repeat: repeat;
}
input,
textarea,
select {
	outline: none;
}

.menu {
	margin-top: 15px;
}
.menu a:hover {
	background: #25a768;
}
.menu a {
	padding: 5px 10px;

	transition: 0.15s;
	text-decoration: none;

	color: #fff;
	border-radius: 5px;
	background: #257768;
}

h1 {
    font-size: 28px;
    font-weight: 700;
    color: #f9b242;
    text-align: center;
    letter-spacing: 2px;
 
}

h2 {
    margin-top: 30px;
    font-size: 24px;
    color: #f9b242;
}

h3 {
    margin-top: 25px;
    font-size: 20px;
    color: #f9b242;
}

a {
    display: inline-block;
    text-decoration: none;
    color: #24bb9d;
}

a.banner {
	display: block;
}

blockquote {
    margin: 20px 0 20px 45px;
    border-left: 5px solid #24bb9d;
    padding-left: 30px;
}

p {
	font-size: 16px;
	line-height: 1.5;
	padding: 10px;

}
.ul {
	padding: 25px 15px 15px 10px;

	list-style-type: circle;
}
img {
	max-width: 100%;
	height: auto;
	padding: 5px;
    display: block;
    margin: 0 auto;
}

table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: #1a1a1a;
    border-radius: 8px;
    overflow: hidden;
    color: #fff;
    font-family: Arial, sans-serif;
}

caption {
    font-size: 18px;
    font-weight: 700;
    padding: 12px;
    text-align: left;
    color: #000;
    background: linear-gradient(90deg, #f9b242, #ffcc70);
}

th {
    padding: 12px;
    text-align: left;
    background: #2a2a2a;
    color: #f9b242;
    border-bottom: 2px solid #f9b242;
}

td {
    padding: 12px;
    border-bottom: 1px solid #333;
}

tr:nth-child(even) {
    background: #222;
}

tr:hover {
    background: #2f2f2f;
    transition: 0.3s;
}

/* Контейнер отзыва */
.review {
    line-height: 1.5;
    position: relative;

    width: 95%;
    margin: 20px auto;
    padding: 20px;

    text-align: justify;

    background: #1c1c1c;
    border-radius: 8px;

    box-shadow: 0 5px 15px rgba(0,0,0,0.4);
    border-left: 4px solid #f9b242;

    transition: 0.3s;
}

/* Эффект при наведении */
.review:hover {
    background: #222;
    box-shadow: 0 8px 20px rgba(0,0,0,0.6);
}

/* Имя автора */
.review__name {
    font-size: 16px;
    font-weight: 600;
    padding: 0 0 8px 10px;
    color: #f9b242;
    letter-spacing: 0.5px;
}

/* Текст отзыва */
.review__text {
    font-size: 15px;
    color: #ddd;
}





@media screen and (max-width: 380px) {
	td {
		font-size: 12px;
	}
}



.faq__title {
    text-transform: uppercase;
    margin: 0 0 8px 0;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: 1px;
    color: #f9b242;
    text-shadow: 0 0 6px rgba(249,178,66,0.4);
}

/* Блок с вопросом */
.faq__item {
    margin: 0 0 20px 0;
    padding: 15px 20px;
    background: #1c1c1c;
    border-left: 3px solid #3daa45;
    border-radius: 6px;
    transition: 0.3s;
}

/* Ховер эффект */
.faq__item:hover {
    background: #252525;
    box-shadow: 0 0 10px rgba(61,170,69,0.2);
}

.container{padding-left:30px;padding-right:30px;width:100%;margin:0 auto;max-width:1060px}

.wrapper{
    padding-left:30px;
    padding-right:30px;
    width:100%;
    margin:0 auto;
    max-width:1060px;
}



@media (max-width:425px){.btn{padding:5px 10px}}

ol, ul {
font-size:16px;
line-height:1.5;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Общий контейнер */
.features {
    display: flex;
    gap: 20px;
    margin-top: 20px;
    flex-wrap: wrap;
}

/* Блоки */
.features__block {
    flex: 1 1 300px;
    background: #1c1c1c;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.4);
    border-top: 3px solid #f9b242;
    transition: 0.3s;
}

/* Ховер эффект */
.features__block:hover {
    background: #222;
    box-shadow: 0 8px 20px rgba(0,0,0,0.6);
}

/* Заголовки */
.features__block h3 {
    margin: 0 0 15px 0;
    font-size: 18px;
    color: #f9b242;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 0 6px rgba(249,178,66,0.3);
}

/* Списки */
.features__block ul {
    margin: 0;
    padding-left: 18px;
}

/* Элементы списка */
.features__block li {
    margin-bottom: 10px;
    line-height: 1.5;
    color: #ddd;
    position: relative;
}

/* Маркеры списка */
.features__block ul li::marker {
    color: #3daa45;
}



/* новое */

/* шапка */
.top-bar{
    position:fixed;
    top:0;
    left:0;

    width:100%;
    height:60px;

    z-index:9999;

    background:#121212;

    box-shadow:0 2px 15px rgba(0,0,0,.25);
}

/* контейнер */
.top-bar-container{
    max-width:1400px;
    width:100%;
    height:100%;

    margin:0 auto;

    display:flex;
    align-items:center;
    justify-content:space-between;
}

/* логотип */
.top-bar-logo img{
    display:block;
    max-height:38px;
    width:auto;
	padding: 0 20px;
}

/* кнопки */
.top-bar-right{
    padding: 0 20px;
}
 
.top-bar-buttons{
    display:flex;
    align-items:center;
    gap:12px;
}



/* кнопки */
.top-btn{
    display:flex;
    align-items:center;
    justify-content:center;

    min-width:120px;
    height:38px;

    padding:0 20px;

    border-radius:8px;

    text-decoration:none;
    font-size:14px;
    font-weight:600;

    transition:.3s;
}

.top-btn-login{
    background:#2c2c2c;
    color:#fff;
}

.top-btn-register{
    background:#ffc107;
    color:#111;
}

.top-btn:hover{
    transform:translateY(-2px);
}

/* мобильная версия */
@media(max-width:768px){

.top-bar{
    height:auto;
    padding:10px 0;
}

body{
    padding-top:100px;
}

.top-bar-container{
    flex-direction:column;
    gap:10px;
}

.top-btn{
    min-width:100px;
}

}


/* бок меню */

.page-layout{
    display:flex;
    gap:30px;

    max-width:1400px;
    margin:30px auto;

    padding:0 20px;
}

/* боковое меню */
.left-menu{
    width:260px;

    position:sticky;
    top:80px;

    height:fit-content;

    background:#181818;

    border-radius:15px;

    padding:20px;

    box-shadow:0 4px 15px rgba(0,0,0,.2);
}

.menu-title{
    color:#fff;
    font-size:20px;
    font-weight:700;

    margin-bottom:20px;
}

.menu-nav{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.menu-link{
    padding:14px 16px;

    border-radius:10px;

    background:#242424;

    color:#fff;
    text-decoration:none;

    transition:.3s;
}

.menu-link:hover{
    background:#ffc107;
    color:#111;

    transform:translateX(5px);
}

/* контент */
.page-content{
    flex:1;
    min-width:0;
}

.banner{
    position:relative;
    display:block;

    overflow:hidden;
    border-radius:16px;
}

.banner img{
    width:100%;
    display:block;
}


/* текст баннер */

.banner-text{
    position:absolute;

    top:50%;
    left:50px;

    transform:translateY(-50%);

    display:block;

    color:#fff;

    font-size:28px;
    font-weight:800;
    line-height:1.2;

    text-shadow:0 2px 10px rgba(0,0,0,.8);
}

.banner-text strong{
    color:#ffd600;
    font-size:30px;
    display:inline-block;
}

/* адаптив */
@media(max-width:768px){

.banner-text{
    left:20px;
    font-size:22px;
}

.banner-text strong{
    font-size:28px;
}

}



/* мобильная версия */
@media(max-width:900px){

.page-layout{
    flex-direction:column;
}

.left-menu{
    width:90%;
    position:relative;
    top:0;
}

}


/* slot */


.game-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
    gap:16px;
    margin-top:20px;
}

/* карточка */
.game-card{
    position:relative;

    display:block;
    overflow:hidden;

    border-radius:14px;
    background:transparent;

    text-decoration:none;

    transition:.3s;
}

.game-card:hover{
    transform:translateY(-6px);
}

/* картинка */
.game-card img{
    width:100%;
    height:auto;
    display:block;

    aspect-ratio:290 / 342;
    object-fit:cover;

    transition:.4s ease;
	border-radius:14px;
}

/* zoom при hover */
.game-card:hover img{
    transform:scale(1.08);
}

/* название */
.game-title{
    position:absolute;

    bottom:10px;
    left:10px;
    right:10px;

    padding:8px 10px;

    color:#fff;
    font-size:14px;
    text-align:center;

    background:rgba(0,0,0,.45);
    border-radius:8px;
}

/* overlay */
.game-overlay{
    position:absolute;
    inset:0;

    display:flex;
    align-items:center;
    justify-content:center;

    

    opacity:0;
    transition:.3s;
}

.game-card:hover .game-overlay{
    opacity:1;
}

/* кнопка */
.game-play{
    padding:10px 22px;

    background:#ffc107;
    color:#111;

    font-weight:700;
    border-radius:10px;

    transform:translateY(10px);
    transition:.3s;
}

.game-card:hover .game-play{
    transform:translateY(0);
}

/* бейдж */
.game-badge{
    position:absolute;
    top:10px;
    left:10px;

    padding:5px 10px;

    font-size:12px;
    font-weight:800;

    border-radius:8px;

    color:#fff;

    z-index:2;
}

/* типы бейджей */
.game-badge.hot{
    background:#ff3b30;
}

.game-badge.new{
    background:#34c759;
}

.game-badge.top{
    background:#007aff;
}

/* мобильная оптимизация */
@media(max-width:768px){

.game-title{
    font-size:12px;
}

.game-play{
    padding:8px 16px;
    font-size:14px;
}

}

.site-footer{
    margin-top:50px;

    background:#0f0f0f;
    color:#fff;

    padding:25px 20px;
}

.footer-inner{
    max-width:1400px;
    margin:0 auto;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:20px;
}

/* текст */
.footer-copy{
    font-size:14px;
    opacity:.8;
}

/* лицензии */
.footer-licenses{
    display:flex;
    align-items:center;
    gap:15px;
}

.footer-licenses img{
    width:45px;
    height:auto;

    opacity:.9;
    transition:.3s;
}

.footer-licenses img:hover{
    opacity:1;
    transform:translateY(-2px);
}

/* адаптив */
@media(max-width:768px){

.footer-inner{
    flex-direction:column;
    text-align:center;
}

.footer-licenses{
    justify-content:center;
}

}
