added spacebar

Короче баг был, который при отсылании миллиарда символов чат схлопывал.
Бл, Рафаелло постоянно просил переделывать, наконец то сделал то, что он принял и залил, всем спасибо за внимание

.gitignore

@@ -0,0 +1,363 @@
+## Ignore Visual Studio temporary files, build results, and
+## files generated by popular Visual Studio add-ons.
+##
+## Get latest from https://github.com/github/gitignore/blob/master/VisualStudio.gitignore
+
+# User-specific files
+*.rsuser
+*.suo
+*.user
+*.userosscache
+*.sln.docstates
+
+# User-specific files (MonoDevelop/Xamarin Studio)
+*.userprefs
+
+# Mono auto generated files
+mono_crash.*
+
+# Build results
+[Dd]ebug/
+[Dd]ebugPublic/
+[Rr]elease/
+[Rr]eleases/
+x64/
+x86/
+[Ww][Ii][Nn]32/
+[Aa][Rr][Mm]/
+[Aa][Rr][Mm]64/
+bld/
+[Bb]in/
+[Oo]bj/
+[Oo]ut/
+[Ll]og/
+[Ll]ogs/
+
+# Visual Studio 2015/2017 cache/options directory
+.vs/
+# Uncomment if you have tasks that create the project's static files in wwwroot
+#wwwroot/
+
+# Visual Studio 2017 auto generated files
+Generated\ Files/
+
+# MSTest test Results
+[Tt]est[Rr]esult*/
+[Bb]uild[Ll]og.*
+
+# NUnit
+*.VisualState.xml
+TestResult.xml
+nunit-*.xml
+
+# Build Results of an ATL Project
+[Dd]ebugPS/
+[Rr]eleasePS/
+dlldata.c
+
+# Benchmark Results
+BenchmarkDotNet.Artifacts/
+
+# .NET Core
+project.lock.json
+project.fragment.lock.json
+artifacts/
+
+# ASP.NET Scaffolding
+ScaffoldingReadMe.txt
+
+# StyleCop
+StyleCopReport.xml
+
+# Files built by Visual Studio
+*_i.c
+*_p.c
+*_h.h
+*.ilk
+*.meta
+*.obj
+*.iobj
+*.pch
+*.pdb
+*.ipdb
+*.pgc
+*.pgd
+*.rsp
+*.sbr
+*.tlb
+*.tli
+*.tlh
+*.tmp
+*.tmp_proj
+*_wpftmp.csproj
+*.log
+*.vspscc
+*.vssscc
+.builds
+*.pidb
+*.svclog
+*.scc
+
+# Chutzpah Test files
+_Chutzpah*
+
+# Visual C++ cache files
+ipch/
+*.aps
+*.ncb
+*.opendb
+*.opensdf
+*.sdf
+*.cachefile
+*.VC.db
+*.VC.VC.opendb
+
+# Visual Studio profiler
+*.psess
+*.vsp
+*.vspx
+*.sap
+
+# Visual Studio Trace Files
+*.e2e
+
+# TFS 2012 Local Workspace
+$tf/
+
+# Guidance Automation Toolkit
+*.gpState
+
+# ReSharper is a .NET coding add-in
+_ReSharper*/
+*.[Rr]e[Ss]harper
+*.DotSettings.user
+
+# TeamCity is a build add-in
+_TeamCity*
+
+# DotCover is a Code Coverage Tool
+*.dotCover
+
+# AxoCover is a Code Coverage Tool
+.axoCover/*
+!.axoCover/settings.json
+
+# Coverlet is a free, cross platform Code Coverage Tool
+coverage*.json
+coverage*.xml
+coverage*.info
+
+# Visual Studio code coverage results
+*.coverage
+*.coveragexml
+
+# NCrunch
+_NCrunch_*
+.*crunch*.local.xml
+nCrunchTemp_*
+
+# MightyMoose
+*.mm.*
+AutoTest.Net/
+
+# Web workbench (sass)
+.sass-cache/
+
+# Installshield output folder
+[Ee]xpress/
+
+# DocProject is a documentation generator add-in
+DocProject/buildhelp/
+DocProject/Help/*.HxT
+DocProject/Help/*.HxC
+DocProject/Help/*.hhc
+DocProject/Help/*.hhk
+DocProject/Help/*.hhp
+DocProject/Help/Html2
+DocProject/Help/html
+
+# Click-Once directory
+publish/
+
+# Publish Web Output
+*.[Pp]ublish.xml
+*.azurePubxml
+# Note: Comment the next line if you want to checkin your web deploy settings,
+# but database connection strings (with potential passwords) will be unencrypted
+*.pubxml
+*.publishproj
+
+# Microsoft Azure Web App publish settings. Comment the next line if you want to
+# checkin your Azure Web App publish settings, but sensitive information contained
+# in these scripts will be unencrypted
+PublishScripts/
+
+# NuGet Packages
+*.nupkg
+# NuGet Symbol Packages
+*.snupkg
+# The packages folder can be ignored because of Package Restore
+**/[Pp]ackages/*
+# except build/, which is used as an MSBuild target.
+!**/[Pp]ackages/build/
+# Uncomment if necessary however generally it will be regenerated when needed
+#!**/[Pp]ackages/repositories.config
+# NuGet v3's project.json files produces more ignorable files
+*.nuget.props
+*.nuget.targets
+
+# Microsoft Azure Build Output
+csx/
+*.build.csdef
+
+# Microsoft Azure Emulator
+ecf/
+rcf/
+
+# Windows Store app package directories and files
+AppPackages/
+BundleArtifacts/
+Package.StoreAssociation.xml
+_pkginfo.txt
+*.appx
+*.appxbundle
+*.appxupload
+
+# Visual Studio cache files
+# files ending in .cache can be ignored
+*.[Cc]ache
+# but keep track of directories ending in .cache
+!?*.[Cc]ache/
+
+# Others
+ClientBin/
+~$*
+*~
+*.dbmdl
+*.dbproj.schemaview
+*.jfm
+*.pfx
+*.publishsettings
+orleans.codegen.cs
+
+# Including strong name files can present a security risk
+# (https://github.com/github/gitignore/pull/2483#issue-259490424)
+#*.snk
+
+# Since there are multiple workflows, uncomment next line to ignore bower_components
+# (https://github.com/github/gitignore/pull/1529#issuecomment-104372622)
+#bower_components/
+
+# RIA/Silverlight projects
+Generated_Code/
+
+# Backup & report files from converting an old project file
+# to a newer Visual Studio version. Backup files are not needed,
+# because we have git ;-)
+_UpgradeReport_Files/
+Backup*/
+UpgradeLog*.XML
+UpgradeLog*.htm
+ServiceFabricBackup/
+*.rptproj.bak
+
+# SQL Server files
+*.mdf
+*.ldf
+*.ndf
+
+# Business Intelligence projects
+*.rdl.data
+*.bim.layout
+*.bim_*.settings
+*.rptproj.rsuser
+*- [Bb]ackup.rdl
+*- [Bb]ackup ([0-9]).rdl
+*- [Bb]ackup ([0-9][0-9]).rdl
+
+# Microsoft Fakes
+FakesAssemblies/
+
+# GhostDoc plugin setting file
+*.GhostDoc.xml
+
+# Node.js Tools for Visual Studio
+.ntvs_analysis.dat
+node_modules/
+
+# Visual Studio 6 build log
+*.plg
+
+# Visual Studio 6 workspace options file
+*.opt
+
+# Visual Studio 6 auto-generated workspace file (contains which files were open etc.)
+*.vbw
+
+# Visual Studio LightSwitch build output
+**/*.HTMLClient/GeneratedArtifacts
+**/*.DesktopClient/GeneratedArtifacts
+**/*.DesktopClient/ModelManifest.xml
+**/*.Server/GeneratedArtifacts
+**/*.Server/ModelManifest.xml
+_Pvt_Extensions
+
+# Paket dependency manager
+.paket/paket.exe
+paket-files/
+
+# FAKE - F# Make
+.fake/
+
+# CodeRush personal settings
+.cr/personal
+
+# Python Tools for Visual Studio (PTVS)
+__pycache__/
+*.pyc
+
+# Cake - Uncomment if you are using it
+# tools/**
+# !tools/packages.config
+
+# Tabs Studio
+*.tss
+
+# Telerik's JustMock configuration file
+*.jmconfig
+
+# BizTalk build output
+*.btp.cs
+*.btm.cs
+*.odx.cs
+*.xsd.cs
+
+# OpenCover UI analysis results
+OpenCover/
+
+# Azure Stream Analytics local run output
+ASALocalRun/
+
+# MSBuild Binary and Structured Log
+*.binlog
+
+# NVidia Nsight GPU debugger configuration file
+*.nvuser
+
+# MFractors (Xamarin productivity tool) working folder
+.mfractor/
+
+# Local History for Visual Studio
+.localhistory/
+
+# BeatPulse healthcheck temp database
+healthchecksdb
+
+# Backup folder for Package Reference Convert tool in Visual Studio 2017
+MigrationBackup/
+
+# Ionide (cross platform F# VS Code tools) working folder
+.ionide/
+
+# Fody - auto-generated XML schema
+FodyWeavers.xsd

README.md

@@ -1,31 +1,45 @@
+![Lucky Diamond](https://github.com/danilt2000/LuckyDiamond/assets/96600211/26167263-51c4-4ae6-96e9-c941943c913f)
+# Проект "Lucky Diamond Casino"
+
+Сайт Онлайн-Казино на игровую валюту Майнкрафт сервера СПМ.
+
+## Вклад и Разработка
+
+Если вы хотите дополнить или улучшить визуал нашего сайта, то сделайте pull запрос к этому репозиторию.
+
+### Запуск Проекта
+
+- Переход к папке проекта:
+`cd LuckyDiamond/luckydiamond`
+
+- Установка всех зависимостей проекта:
+`npm i`
+
+- Запуск локального сервера:
+`npm run serve`
+
+### Добавление Куки-Файлов для локального сервера
+
+- Зайти на vercel страницу
+- Нажать сочетание клавиш ctrl + shift + i
+- Перейти в Application(Приложение)
+- Кликнуть на файлы Куки
+- Нажать на нашу ссылку и скопировать AUTHTOKEN, SearchToken, SpUserName
+- Вставить значения и названия на Локальный хост
+- Обновить страницу
 
 
+## Важные ссылки
+
+[Документация SPWorlds](https://github.com/sp-worlds/api-docs)
+
+[DiscordAPI](https://discord.com/developers/docs/topics/oauth2#oauth2)
+
+[Отображение Скинов](https://visage.surgeplay.com/index.html)
+
+[Вдохновление](https://cs.fail/en/)
 
 
+## Наша Команда
 
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="UTF-8">
-  
-</head>
-<body>
-
-  
-<h1>Важные ссылки</h1> 
-<h2>Отображение головы</h2>
-https://visage.surgeplay.com/index.html
-
-   ![image](https://visage.surgeplay.com/head/512/Hepatir.png)
-<h2>Sp api</h2>
-https://github.com/sp-worlds/api-docs
-<h2>Discord api </h2>
-     https://discord.com/developers/docs/topics/oauth2#oauth2
-
-
-<h2>Bootstrap 5 Tutorial </h2>
- <p>Если получится то использовать его для фронта</p>
-     https://www.w3schools.com/bootstrap5/
-</body>
-</html>
- 
+![Group 65](https://github.com/danilt2000/LuckyDiamond/assets/96600211/fb41b4fa-24d4-4372-8b58-089d1c9d4ca4)

luckydiamond/deploy.sh

@@ -2,26 +2,26 @@
 
 # abort on errors
 set -e
-
 # build
 npm run build
 
 # navigate into the build output directory
 cd dist
+# git checkout main
 
 # if you are deploying to a custom domain
 # echo 'www.example.com' > CNAME
 
-git init
+# git init
 git add -A
 git commit -m 'deploy'
 
 # if you are deploying to https://<USERNAME>.github.io
-# git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git main
+git push -f git@github.com:danilt2000/danilt2000.github.io.git main
 
 # if you are deploying to https://<USERNAME>.github.io/<REPO>
 # git pull origin
-git push -f git@github.com:danilt2000/LuckyDiamond.git main:gh-pages
+# git push -f git@github.com:danilt2000/LuckyDiamond.git main:gh-pages
 # git subtree push --prefix dist origin gh-pages
 
 cd -

luckydiamond/dist/index.html

@@ -1 +1 @@
-<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/LuckyDiamond/favicon.ico"><link href="https://fonts.googleapis.com/css2?family=Montserrat+Alternates:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet"><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Poppins:wght@400;600&family=Press+Start+2P&display=swap" rel="stylesheet"><title>luckydiamond</title><script defer="defer" src="/LuckyDiamond/js/chunk-vendors.9ebc3acb.js"></script><script defer="defer" src="/LuckyDiamond/js/app.d5fdf871.js"></script><link href="/LuckyDiamond/css/app.bc469998.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but luckydiamond doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
+<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><link href="https://fonts.googleapis.com/css2?family=Montserrat+Alternates:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet"><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Poppins:wght@400;600&family=Press+Start+2P&display=swap" rel="stylesheet"><title>luckydiamond</title><script defer="defer" src="/js/chunk-vendors.9ebc3acb.js"></script><script defer="defer" src="/js/app.f8938cd1.js"></script><link href="/css/app.bc469998.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but luckydiamond doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>

luckydiamond/package.json

@@ -9,9 +9,22 @@
     "deploy": "sh deploy.sh"
   },
   "dependencies": {
+    "@popperjs/core": "^2.11.8",
+    "@vuelidate/core": "^2.0.3",
+    "@vuelidate/validators": "^2.0.4",
+    "axios": "^1.6.7",
+    "bootstrap": "^5.3.2",
     "core-js": "^3.8.3",
+    "howler": "^2.2.4",
+    "mitt": "^3.0.1",
+    "save": "^2.9.0",
+    "swiper": "^11.0.5",
     "vue": "^3.2.13",
-    "vue-router": "^4.2.5"
+    "vue-chart-3": "^3.1.8",
+    "vue-recaptcha": "^3.0.0-alpha.6",
+    "vue-router": "^4.2.5",
+    "vue3-carousel": "^0.3.1",
+    "vue3-recaptcha2": "^1.8.0"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",

luckydiamond/public/index.html

@@ -1,21 +1,42 @@
 <!DOCTYPE html>
 <html lang="">
-  <head>
+
+<head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-      <link href="https://fonts.googleapis.com/css2?family=Montserrat+Alternates:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
+  <link rel="icon" href="<%= BASE_URL %>ldicon.png">
+  <link
+    href="https://fonts.googleapis.com/css2?family=Montserrat+Alternates:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
+    rel="stylesheet">
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-      <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Poppins:wght@400;600&family=Press+Start+2P&display=swap" rel="stylesheet">
-    <title><%= htmlWebpackPlugin.options.title %></title>
-  </head>
-  <body>
+  <link
+    href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&family=Poppins:wght@400;600&family=Press+Start+2P&display=swap"
+    rel="stylesheet">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@700&display=swap" rel="stylesheet">
+  <!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> -->
+  <link rel="stylesheet" href="dist/css/bootstrap-grid.min.css" />
+  <link rel="stylesheet" href="//cdn.jsdelivr.net/gh/dmhendricks/bootstrap-grid-css@4.1.3/dist/css/bootstrap-grid.min.css" />
+  <title>LuckyDiamond</title>
+</head>
+
+<body>
   <noscript>
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
+        Please enable it to continue.</strong>
   </noscript>
+<!--  <div class="g-recaptcha" id="rcaptcha" data-callback="get_action" data-sitekey="6LcuUDQpAAAAAPz8007pFD2FigaSh6InnUq_MEd8"></div>-->
   <div id="app"></div>
+
   <!-- built files will be auto injected -->
-  </body>
+</body>
+<script src='https://www.google.com/recaptcha/api.js'></script>
+<script src="https://cdn.jsdelivr.net/npm/vue@3"></script>
+<script src="https://cdn.jsdelivr.net/npm/vue-demi"></script>
+<script src="https://cdn.jsdelivr.net/npm/@vuelidate/core"></script>
+<script src="https://cdn.jsdelivr.net/npm/@vuelidate/validators"></script>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
 </html>

luckydiamond/src/assets/css/ComponentsStyles/AdaptiveStyles/headermobile.css

@@ -0,0 +1,88 @@
+/* Header */
+
+.header-mobile {
+    grid-area: header-mobile;
+    border-radius: 20px;
+    background: #17181C;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    height: 45%;
+}
+
+.header-mobile__content {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.header-mobile__logo {
+    padding: 6% 0 2.5% 4%;
+}
+
+.header-mobile__logo img {
+    width: 85%;
+}
+
+.header-mobile__end {
+    display: flex;
+    align-items: center;
+}
+
+.header-mobile__balance--content {
+    display: flex;
+    align-items: center;
+}
+
+.header-mobile__card {
+    border-radius: 7px;
+    background: #22252F;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+}
+
+.card-display h2 {
+    display: flex;
+    align-items: flex-end;
+    padding: 13% 15px 13% 6%;
+}
+
+.card-img img {
+    width: 35%;
+    height: 100%;
+}
+
+.card-text {
+    color: #FFF;
+    font-weight: 700;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 13px;
+}
+
+.btn-card {
+    border-radius: 13px;
+    background: #EF4444;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    text-align: center;
+    padding: 4px;
+}
+
+.btn-card img {
+
+    width: 90%;
+    height: 40px;
+}
+
+.btn-card__margin {
+    margin-left: -1%;
+}
+
+.header-mobile__user-icon {
+    display: flex;
+    align-items: center;
+}
+
+.user-icon img {
+    width: 70%;
+    margin-left: 15px;
+}
+
+/* /Header */

luckydiamond/src/assets/css/ComponentsStyles/AdaptiveStyles/menumobile.css

@@ -0,0 +1,41 @@
+/* Footer */
+
+.footer-mobile {
+    grid-area: footer-mobile;
+    width: 100%;
+    height: 10%;
+    background: #17181C;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    position: fixed;
+    bottom: 0;
+}
+
+.footer-mobile__content {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-top: 2%;
+}
+
+.icons-size img {
+    width: 10%;
+}
+
+.footer-mobile__icons  {
+    margin: 2% 0;
+    width: 100%;
+}
+
+.icon-start {
+    margin-left: 8%;
+}
+
+.icon-end {
+    margin-left: 9%;
+}
+
+.icon-center {
+    margin-left: 9%;
+}
+
+/* /Footer */

luckydiamond/src/assets/css/ComponentsStyles/AdaptiveStyles/payments-modalmobile.css

@@ -0,0 +1,200 @@
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+}
+
+input:focus {
+    outline: none;
+}
+
+.root-mobile {
+    position: absolute;
+    top: 15%;
+    left: 10%;
+    background: #22252F;
+    border-radius: 25px;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 80%;
+    height: 455px;
+    max-width: 400px;
+}
+
+.margin-mobile___payments {
+    margin-left: 10px;
+}
+
+.payments-modal-mobile {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.text-style-mobile h1 {
+    font-size: 22px;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-weight: 700;
+}
+
+.padding-elements__mobile h1,
+.padding-elements__mobile img {
+    padding: 3% 3%;
+}
+
+.icon-close__mobile {
+    margin-top: 2%;
+}
+
+.payments-modal-mobile__content h2 {
+    color: #44C6EF54;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    line-height: 31px;
+    font-weight: 700;
+    font-size: 18px;
+}
+
+.payments-modal-mobile__content {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+}
+
+.payments-modal__btns-mobile ul {
+    display: flex;
+}
+
+.input-style__mobile input {
+    border-radius: 15px;
+    border: 2px solid #2B3458;
+    background: #22252F;
+    width: 250px;
+}
+
+.input-mobile__number {
+    padding-left: 15px;
+    font-family: Montserrat Alternates;
+    font-weight: 700;
+}
+
+.img-style img {
+    position: absolute;
+    width: 22px;
+    height: 22px;
+}
+
+.button-style__mobile li button {
+    padding: 6px 12px;
+    background: #252C47;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    border-radius: 6px;
+    border: none;
+    margin: 5px 0 5px 5px;
+    font-weight: 700;
+    font-family: Montserrat Alternates;
+}
+
+.payments-modal__agree {
+    display: flex;
+}
+
+.payments-modal__agree h3 {
+    color: #44C6EF54;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    line-height: 31px;
+    font-weight: 700;
+    font-size: 9px;
+    margin-left: 5px;
+    line-height: unset;
+}
+
+.payments-modal__submit {
+    display: flex;
+    width: 95%;
+    margin: 0 auto;
+    flex-direction: column;
+    justify-content: center;
+    text-align: center;
+    margin-top: 20%;
+}
+
+.payments-modal__submit p {
+    color: #949494F2;
+    font-family: Montserrat Alternates;
+    font-size: 8px;
+    font-weight: 700;
+}
+
+.payments-modal__submit button {
+    margin-top: 10px;
+    border-radius: 10px;
+    background: #EF4444;
+    border: none;
+    padding: 20px 20px;
+    font-family: Montserrat Alternates;
+    font-weight: 700;
+    font-size: 18px;
+}
+
+.payments-modal__promocode {
+    margin-top: 10px;
+}
+
+.payments-modal__promocode input {
+    height: 25px;
+    width: 250px;
+}
+
+.payments-modal__promocode input[placeholder] {
+    color: rgba(148, 148, 148, 0.95);
+    font-family: Montserrat Alternates;
+    font-weight: 700;
+    padding-left: 10px;
+}
+
+.payments-modal__agree {
+    margin-top: 6px;
+    display: flex;
+    align-items: center;
+}
+
+.captcha-mobile {
+    top: 25px;
+    left: -10px;
+}
+
+/* Media */
+
+@media screen and (max-width: 600px) and (min-width: 420px) {
+    .root-mobile {
+        left: 12%;
+    }
+    .input-style__mobile input {
+        width: 300px !important;
+    }
+    .button-style__mobile li button {
+        padding: 8px 14px;
+    }
+    .payments-modal__agree h3 {
+        font-size: 10.5px;
+    }
+}
+
+@media screen and (max-width: 340px) {
+    .input-style__mobile input {
+        width: 225px;
+    }
+    .button-style__mobile li button {
+        padding: 6px 8px;
+    }
+    .checkbox-styles input[type="checkbox"] {
+        width: 15px;
+        height: 15px;
+    }
+    input[type="checkbox"]:checked::before {
+        font-size: 10px;
+        line-height: unset;
+    }
+}

luckydiamond/src/assets/css/ComponentsStyles/Help.css

@@ -0,0 +1,109 @@
+.box_help {
+    margin-left: 36px;
+    margin-top: 35px;
+}
+.Heading_p1 {
+    font-size: 18px ;
+    font-family: Montserrat Alternates;
+    text-decoration: none;
+}
+.heding2 {
+
+}
+.heding2_text {
+    width: 949px;
+    height: 132px;
+    margin-top: 17px;
+    margin-bottom: 17px;
+}
+.Heading_p1 a {
+    color: #5865F2 ;
+    font-family: Montserrat Alternates;
+    text-decoration: none;
+}
+.questions {
+    font-size: 18px ;
+    font-family: Montserrat Alternates;
+    text-decoration: none;
+}
+.questions1  {
+    font-size: 18px ;
+    font-family: Montserrat Alternates;
+    text-decoration: none;
+    background-color:#3f3f3f;
+    width: 426px;
+    height: 30px;
+    border-radius: 8px ;
+    justify-content: center;
+    align-content: center;
+    display: flex;
+}
+.questions1 b {
+    margin-top: 4.3px;
+}
+.questions1 img {
+   margin-left: 30px;
+   width: 16px;
+   margin-top: 6px;
+}
+.text_questions {
+    width: 840px;
+    height: 132px;
+    font-size: 18px ;
+    font-family: Montserrat Alternates;
+    text-decoration: none;
+    
+}
+.text_questions p {
+    font-size: 18px ;
+    font-family: Montserrat Alternates;
+    text-decoration: none;
+}
+.questions2 {
+    font-size: 18px ;
+    font-family: Montserrat Alternates;
+    text-decoration: none;
+    width: 544px;
+    height: 27px;
+    
+    
+    align-items: flex-start;
+    display: flex;
+}
+.questions2 img {
+margin-left: 10px;
+width: 16px;
+margin-top: 3.5px;
+
+}
+.Social1text  {
+    margin-top: 0.5vh;
+    font-family: Montserrat Alternates;
+}
+.Social1where {
+    flex-direction: row;
+    width: 400px;
+    display: flex;
+    justify-content: space-around;
+    align-content: center;
+    margin-top: 3vh;
+}
+
+@media (max-height: 879px) {
+    .Social1where {
+        margin-top: 0; 
+    }
+}
+.questions_box {
+    margin-bottom: 24px;
+}
+.text_questions {
+    margin-left: 110px;
+}
+.questions1 {
+    margin-bottom: 20px;
+}
+.questions2 {
+    margin-top: 25px;
+    margin-right:40px ;
+}

luckydiamond/src/assets/css/ComponentsStyles/asidebar.css

@@ -9,6 +9,33 @@
     display: flex;
     align-items: center;
     flex-direction: column;
+    margin-top: 12%;
+}
+
+.menu__content--jackpot-icon{
+    margin-left: -5px;
+    transition: 250ms;
+    width: 125%;
+    height: 125%;
+}
+
+.menu__content--jackpot-icon:hover {
+    margin-left: -15px;
+    width: 175%;
+    height: 175%;
+}
+
+.menu__content--chest-icon {
+    margin-left: -1px;
+    transition: 250ms;
+    width: 80px;
+    height: 80px;
+}
+
+.menu__content--chest-icon:hover {
+    margin-left: -2px;
+    height: 100px;
+    width: 100px;
 }
 
 .menu__btn--home {
@@ -19,8 +46,22 @@
     display: flex;
     align-items: center;
     height: 100%;
+    width: 100%;
+}
+.fotosloti {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-left: 0.1vh;
+}
+.fotosloti a img {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    max-width: 100%;
+    max-height: 100%;
 }
-
 .menu__content--gamemodes {
     background: rgba(217, 217, 217, 0.12);
     filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.25));
@@ -31,6 +72,36 @@
     border-radius: 20px;
 }
 
+.menu__content--slots-icon {
+    margin-left: 5px
+}
+
+.menu__content--cruch-icon {
+    margin-left: 6px;
+    transition: 250ms;
+    width: 100%;
+    height: 100%;
+}
+
+.menu__content--cruch-icon:hover {
+    margin-left: 0px;
+    width: 125%;
+    height: 125%;
+}
+
+.menu__content--bomb-icon {
+    margin-left: 6px;
+    width: 100%;
+    height: 100%;
+    transition: 250ms;
+}
+
+.menu__content--bomb-icon:hover {
+    margin-left: 0px;
+    width: 125%;
+    height: 125%;
+}
+
 .menu__content--gamemodes {
     display: flex;
     text-align: center;
@@ -46,8 +117,6 @@
     justify-content: center;
     align-items: center;
     text-align: center;
-    max-width: 100%;
-    max-height: 100%;
 }
 
 .menu__btn--settings {

luckydiamond/src/assets/css/ComponentsStyles/chat.css

@@ -1,5 +1,24 @@
+::-webkit-scrollbar {
+    width: 10px;
+}
+
+::-webkit-scrollbar-track {
+    background: #121212;
+    border-radius: 10px;
+}
+
+::-webkit-scrollbar-thumb {
+    background: #EF4444;
+    border-radius: 10px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: #b30000;
+}
+
 .chat {
-    margin: 1% 1.2% 0 0;
+    margin: 1% 3.2% 0 0;
+    word-break: break-all;
 }
 
 .chat__content {
@@ -22,15 +41,39 @@
     font-size: 18px;
     font-weight: 700;
 }
-
-.content p {
+.chat__mute-button {
+    position: absolute;
+    bottom: 10px;
+    right: 10px;
+  }
+/* .content p {
     width: 80%;
     word-wrap: break-word;
     margin: 0 auto;
+} */
+
+.content p {
+    display: block;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+    overflow: hidden;
 }
 
 .chat__content--users {
-    height: 70%;
+    /* height: 590px; */
+    height: 70vh;
+    width: auto;
+    overflow-y: auto;
+    overflow-x: auto;
+}
+
+.chat__content,
+.chat__content--users {
+    box-sizing: border-box;
+}
+
+.chat__content--users {
+    margin: 0;
 }
 
 .card__user {
@@ -38,10 +81,13 @@
     display: flex;
 }
 
-.fade-enter-active, .fade-leave-active {
-    transition: opacity 0.5s, transform 0.5s;
+.fade-enter-active,
+.fade-leave-active {
+    transition: opacity 0.1s, transform 0.1s;
 }
-.fade-enter, .fade-leave-to {
+
+.fade-enter,
+.fade-leave-to {
     opacity: 0;
     transform: translateY(20px);
 }
@@ -72,7 +118,8 @@
     bottom: 0;
     margin: 24% 87% 6% 6%;
     user-select: none;
-    width: 50%;
+    /* width: 50%; */
+    width: 90%;
 }
 
 .write__content {
@@ -81,13 +128,46 @@
 }
 
 .write__content input {
-    padding: 14px 35% 14px 12px;
+    padding: 14px 25% 14px 12px;
     border-radius: 13px;
     background: #22252F;
     color: #A9A99D;
     border: none;
 }
 
+/* .write__content textarea {
+    padding: 14px 25% 14px 12px;
+    border-radius: 13px;
+    background: #22252F;
+    color: #A9A99D;
+    border: none;
+} */
+/* .write__content textarea {
+    padding: 14px 12px;
+    border-radius: 13px;
+    background: #22252F;
+    color: #A9A99D;
+    border: none;
+    width: 600px;
+    box-sizing: border-box;
+    resize: vertical;
+} */
+
+.write__content textarea {
+    padding: 14px 12px;
+    border-radius: 13px;
+    background: #22252F;
+    color: #A9A99D;
+    border: none;
+    width: 600px;
+    box-sizing: border-box;
+    resize: none;
+}
+
+.write__content textarea:focus {
+    outline: none;
+}
+
 .write__content input::placeholder {
     color: #A9A99D;
     font-weight: 800;
@@ -97,7 +177,8 @@
 
 .write__content button {
     padding: 8px 9px;
-    margin-left: -15%;
+    /* margin-left: -20%; */
+    margin-right: -5%;
     border-radius: 6px;
     background: #3D3F48;
     border: none;
@@ -107,3 +188,11 @@
 .write__content button:disabled {
     cursor: not-allowed;
 }
+
+.system-message {
+    background-color: rgb(1, 56, 74);
+}
+
+.mention-message {
+    background-color: rgb(169, 113, 0);
+}

luckydiamond/src/assets/css/ComponentsStyles/developer.css

@@ -0,0 +1,840 @@
+
+.info {
+    flex-direction: column;
+    align-items: center;
+    display: flex;
+    justify-content: center;
+    width: 100%;
+    height: 732px;
+    margin-top: 10px;
+   
+}
+.bottom_card {
+    width: 1332px;
+    height: 269px;
+    display: flex;
+    justify-content: space-between;
+    margin-top: 20px;
+    margin-left: 295px;
+}
+.top_card {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    margin-left: 287px;
+    
+}
+
+
+/*beginning Hepatir_card-2 2*/
+
+.Hepatir_card {
+    width: 250px;
+    height: 443px;
+    background-color: #413C3B;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    border-radius: 22px;
+}
+.text_2 {
+    width: 244px;
+    height: 220px;
+    display: inline-block;
+    flex-flow: column-reverse;
+    
+}
+
+.aboutinfo_2 {
+    margin-top: 30px;
+    margin-left: 19px;
+    
+}
+.aboutinfo_2 p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 79px;
+    height: 19px;
+    margin-left: 4px;
+}
+.aboutinfo_2 h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    width: 177px;
+    height: 37px;
+    line-height: 30px;
+}
+.whatjob_2 p {
+    margin-left: 3px;
+}
+.whatjob2_2 p {
+    margin-left: 3px;
+}
+.whatjob_2 {
+    display: flex;
+    width: 206px;
+    height: 16px;
+    margin-left: 22px;
+    font-family: 'Montserrat';
+    margin-top: 30px;
+}
+.whatjob_2 img {
+    width: 21px;
+    height: 21px;
+}
+.whatjob2_2 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 22px;
+    
+    font-family: 'Montserrat';
+    margin-top: 10px;
+}
+.whatjob2_2 img {
+    width: 21px;
+    height: 21px;
+}
+.skin_2 {
+    width: 244px;
+    height: 221.5px;
+    display: inline-block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.skin_2_skin {
+    width: 212px;
+    height: 212px;
+    background-image: url(https://avatar.spworlds.ru/front/212/Hepatir.png);
+    justify-content: space-around;
+    display: flex;
+    align-items: flex-end;
+}
+.skinicons1 {
+   justify-content: space-around;
+    display: flex;
+}
+ 
+/*the and Hepatir_card 1*/
+
+
+/*beginning Rafael1209_card 2*/
+.Rafael1209_card {
+    width: 250px;
+    height: 443px;
+    background-color: #636363;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    border-radius: 22px;
+}
+.Rafael1209_text_2 {
+    width: 244px;
+    height: 220px;
+    display: inline-block;
+    flex-flow: column-reverse;
+    
+}
+
+.Rafael1209_aboutinfo_2 {
+    margin-top: 30px;
+    margin-left: 19px;
+    
+}
+.Rafael1209_aboutinfo_2 p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 79px;
+    height: 19px;
+    margin-left: 4px;
+}
+.Rafael1209_aboutinfo_2 h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    width: 177px;
+    height: 37px;
+    line-height: 30px;
+}
+.Rafael1209_whatjob_2 {
+    display: flex;
+    width: 206px;
+    height: 16px;
+    margin-left: 22px;
+    font-family: 'Montserrat';
+    margin-top: 30px;
+}
+.Rafael1209_whatjob_2 img {
+    width: 21px;
+    height: 21px;
+}
+.Rafael1209_whatjob_2 p {
+    margin-left: 3px;
+}
+.Rafael1209_whatjob2_2 p {
+    margin-left: 3px;
+}
+.Rafael1209_whatjob2_2 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 19px;
+    
+    font-family: 'Montserrat';
+    margin-top: 10px;
+}
+.Rafael1209_whatjob2_2 img {
+    width: 25px;
+    height: 24px;
+}
+.Rafael1209_skin_2 {
+    width: 244px;
+    height: 221.5px;
+    display: inline-block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.Rafael1209_skin_2_skin {
+    width: 212px;
+    height: 212px;
+    background-image: url(https://avatar.spworlds.ru/front/212/rafael1209.png);
+    justify-content: space-around;
+    display: flex;
+    align-items: flex-end;
+}
+.Rafael1209_skinicons1 {
+   justify-content: space-around;
+    display: flex;
+}
+/*the and Rafael1209_card 1*/
+
+
+/*beginning Ckutls_card 2*/
+.Ckutls__card {
+    width: 250px;
+    height: 443px;
+    background-color: #B88484;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    border-radius: 22px;
+}
+.Ckutls__text_2 {
+    width: 244px;
+    height: 219.7px;
+    display: inline-block;
+    flex-flow: column-reverse;
+   
+}
+
+.Ckutls__aboutinfo_2 {
+    margin-top: 30px;
+    margin-left: 19px;
+    
+}
+.Ckutls__aboutinfo_2 p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 79px;
+    height: 19px;
+    margin-left: 4px;
+}
+.Ckutls__aboutinfo_2 h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    width: 177px;
+    height: 37px;
+    line-height: 30px;
+}
+.Ckutls__whatjob_1 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 19px;
+    font-family: 'Montserrat';
+    margin-top: 30px;
+}
+.Ckutls__whatjob_1 img {
+    width: 15px;
+    height: 17px;
+}
+.Ckutls__whatjob_1 p {
+    margin-left: 3px;
+}
+.Ckutls__whatjob_2 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 19px;
+    font-family: 'Montserrat';
+    margin-top: 10px;
+}
+.Ckutls__whatjob_2 img {
+    width: 15px;
+    height: 17px;
+}
+.Ckutls__whatjob_2 p {
+    margin-left: 3px;
+}
+.Ckutls__whatjob_3 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 19px;
+    font-family: 'Montserrat';
+    margin-top: 9px;
+}
+.Ckutls__whatjob_3 img {
+    width: 17px;
+    height: 15px;
+}
+.Ckutls__whatjob_3 p {
+    margin-left: 3px;
+}
+.Ckutls__skin_2 {
+    width: 244px;
+    height: 221px;
+    display: inline-block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 3px;
+}
+.Ckutls__skin_2_skin {
+    width: 212px;
+    height: 212px;
+    background-image: url(https://avatar.spworlds.ru/front/212/Ckutls_.png);
+    justify-content: space-around;
+    display: flex;
+    align-items: flex-end;
+}
+.Ckutls__skinicons1 {
+   justify-content: space-around;
+    display: flex;
+}
+/*the and Ckutls_card 1*/
+
+/*beginning FUpir_card 2*/
+.FUpir_card {
+    width: 250px;
+    height: 443px;
+    background-color: #C58E74;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    border-radius: 22px;
+}
+.FUpir_text_2 {
+    width: 244px;
+    height: 221.5px;
+    display: inline-block;
+    flex-flow: column-reverse;
+    
+}
+
+.FUpir_aboutinfo_2 {
+    margin-top: 30px;
+    margin-left: 19px;
+    
+}
+.FUpir_aboutinfo_2 p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 79px;
+    height: 19px;
+    margin-left: 4px;
+}
+.FUpir_aboutinfo_2 h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    width: 177px;
+    height: 37px;
+    line-height: 30px;
+}
+.FUpir_whatjob_1 {
+    display: flex;
+    width: 206px;
+    height: 24px;
+    margin-left: 19px;
+    font-family: 'Montserrat';
+    margin-top: 24px;
+    
+}
+.FUpir_whatjob_1 img {
+    width: 25px;
+    height: 24px;
+}
+.FUpir_whatjob_1 p {
+    margin-left: 3px;
+    margin-top: 4px;
+}
+
+.FUpir_skin_2 {
+    width: 244px;
+    height: 221.5px;
+    display: inline-block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.FUpir_skin_2_skin {
+    width: 212px;
+    height: 212px;
+    background-image: url(https://avatar.spworlds.ru/front/212/FUpir.png);
+    justify-content: space-around;
+    display: flex;
+    align-items: flex-end;
+    margin-bottom: 3px;
+}
+.FUpir_skinicons1 {
+   justify-content: space-around;
+    display: flex;
+}
+/*the and FUpir_card 1*/
+/*beginning Swino4ka_card 1*/
+.Swino4ka_card {
+    width: 250px;
+    height: 443px;
+    background-color: #6b4d3f;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    border-radius: 22px;
+}
+.Swino4ka_text_2 {
+    width: 244px;
+    height: 219.7px;
+    display: inline-block;
+    flex-flow: column-reverse;
+    
+}
+
+.Swino4ka_aboutinfo_2 {
+    margin-top: 30px;
+    margin-left: 19px;
+    
+}
+.Swino4ka_aboutinfo_2 p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 79px;
+    height: 19px;
+    margin-left: 4px;
+}
+.Swino4ka_aboutinfo_2 h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    width: 177px;
+    height: 37px;
+    line-height: 30px;
+}
+.Swino4ka_whatjob_1 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 19px;
+    font-family: 'Montserrat';
+    margin-top: 30px;
+    
+}
+.Swino4ka_whatjob_1 img {
+    width: 15px;
+    height: 17px;
+}
+.Swino4ka_whatjob_1 p {
+    margin-left: 3px;
+    
+}
+.Swino4ka__whatjob_2 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 19px;
+    font-family: 'Montserrat';
+    margin-top: 10px;
+}
+.Swino4ka__whatjob_2 img {
+    width: 15px;
+    height: 17px;
+}
+.Swino4ka__whatjob_2 p {
+    margin-left: 3px;
+}
+.Swino4ka__whatjob_3 {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    margin-left: 19px;
+    font-family: 'Montserrat';
+    margin-top: 9px;
+}
+.Swino4ka__whatjob_3 img {
+    width: 17px;
+    height: 15px;
+}
+.Swino4ka__whatjob_3 p {
+    margin-left: 3px;
+}
+
+.Swino4ka_skin_2 {
+    width: 244px;
+    height: 221.5px;
+    display: inline-block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.Swino4ka_skin_2_skin {
+    width: 212px;
+    height: 212px;
+    background-image: url(https://avatar.spworlds.ru/front/212/Swino4ka.png);
+    justify-content: space-around;
+    display: flex;
+    align-items: flex-end;
+    margin-bottom: 3px;
+}
+.Swino4ka_skinicons1 {
+   justify-content: space-around;
+    display: flex;
+}
+/*the and Swino4ka_card 1*/
+/*beginning busha888_card 1*/
+.busha888_card {
+    width: 422px;
+    height: 269px;
+    flex-shrink: 0;
+    border-radius: 22px;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    background-color: #742271;
+    display: flex;
+    flex-direction: row;
+    
+}
+
+.text {
+    width: 211px;
+    height: 269px;
+
+ 
+}
+.aboutinfo {
+    margin-top: 30px;
+    margin-left: 15px;
+    
+    
+}
+.aboutinfo p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 97px;
+    height: 16px;
+}
+.aboutinfo h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    
+}
+.whatjob {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    
+    margin-left: 15px;
+    font-family: 'Montserrat';
+   
+    margin-top: 30px;
+}
+.whatjob p {
+    margin-left: 3px;
+}
+.whatjob img {
+    width: 15px;
+    height: 17px;
+}
+.icons {
+    width: 162px;
+    height: 36px; 
+    justify-content: space-around;
+    display: flex;
+    
+    margin-top: 95px;
+    margin-left: 27px;
+    margin-bottom: 11px;
+    
+}
+.icons img {
+    width: 36px;
+    height: 36px;
+    border-radius: 10px;
+    
+    
+}
+.skin {
+    margin-right: 13px;
+    margin-top: 51px;
+    margin-bottom: 3px;
+    
+    
+}
+.skin img {
+    width: 212px;
+    height: 212px;
+}
+/*the and busha888_card 1*/
+
+/*beginning GEDPOOL31_card 1*/
+.GEDPOOL31_card {
+    width: 422px;
+    height: 269px;
+    flex-direction: row;
+    border-radius: 22px;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    background-color: #393A3A;
+    display: flex;
+  
+
+}
+
+.GEDPOOL31_text {
+    width: 200px;
+    height: 269px;
+
+ 
+}
+.GEDPOOL31_aboutinfo {
+    margin-top: 30px;
+    margin-left: 15px;
+    
+    
+}
+.GEDPOOL31_aboutinfo p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 200px;
+    height: 16px;
+   
+}
+.GEDPOOL31_aboutinfo h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    
+}
+.GEDPOOL31_whatjob {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    
+    margin-left: 15px;
+    font-family: 'Montserrat';
+   
+    margin-top: 30px;
+}
+.GEDPOOL31_whatjob p {
+    margin-left: 3px;
+    margin-top: 3px;
+}
+.GEDPOOL31_whatjob img {
+    width: 25px;
+    height: 25px;
+}
+.GEDPOOL31_icons {
+    width: 79px;
+    height: 36px; 
+    justify-content: space-around;
+    display: flex;
+    margin-top: 95px;
+    margin-left: 72px;
+    margin-bottom: 11px;
+}
+.GEDPOOL31_icons img {
+    display: flex;
+    width: 36px;
+    height: 36px;
+}
+.GEDPOOL31_skin {   
+    margin-top: 51px;
+    margin-bottom: 3px;
+    display: flex;
+    width: 212px;
+    height: 212px;
+}
+.GEDPOOL31_skin img {
+    width: 212px;
+    height: 212px;
+}
+/*the and GEDPOOL31_card 1*/
+
+/*beginning CLARFFY_card 1*/
+.CLARFFY_card {
+    width: 422px;
+    height: 269px;
+    flex-direction: row;
+    border-radius: 22px;
+    border: 3px solid #595959 ;
+    border-color: #595959;
+    background-color: #E2B374;
+    display: flex;
+  
+
+}
+
+.CLARFFY_text {
+    width: 211px;
+    height: 269px;
+
+ 
+}
+.CLARFFY_aboutinfo {
+    margin-top: 30px;
+    margin-left: 15px;
+    
+    
+}
+.CLARFFY_aboutinfo p {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 14px;
+    width: 97px;
+    height: 16px;
+}
+.CLARFFY_aboutinfo h1 {
+    font-family: 'Montserrat';
+    color: white;
+    font-size: 32px;
+    
+}
+.CLARFFY_whatjob {
+    display: flex;
+    width: 183px;
+    height: 16px;
+    
+    margin-left: 15px;
+    font-family: 'Montserrat';
+   
+    margin-top: 30px;
+}
+.CLARFFY_whatjob p {
+    margin-left: 3px;
+    margin-top: 3px;
+}
+.CLARFFY_whatjob img {
+    width: 25px;
+    height: 24px;
+}
+.CLARFFY_icons {
+    width: 79px;
+    height: 36px; 
+    justify-content: space-around;
+    display: flex;
+    margin-top: 95px;
+    margin-left: 72px;
+    margin-bottom: 11px;
+}
+.CLARFFY_icons img {
+    width: 36px;
+    height: 36px;
+}
+.CLARFFY_skin {
+    margin-right: 13px;
+    margin-top: 51px;
+    margin-bottom: 3px;
+    display: flex;
+    width: 212px;
+    height: 212px;
+}
+.CLARFFY_skin img {
+    width: 212px;
+    height: 212px;
+}
+/*the and CLARFFY_card 1*/
+ 
+@media only screen and (min-width: 2048px) { 
+
+    .info {
+        flex-direction: column;
+        align-items: center;
+        display: flex;
+        justify-content: center;
+        width: 100%;
+        height: 732px;
+        margin-top: 80px;
+       
+        
+        
+    }
+    .top_card {
+        width: 90%;
+    }
+}
+
+@media (max-width: 1700px) {
+    .info {
+        flex-direction: column;
+        align-items: center;
+        display: flex;
+        justify-content: center;
+        width: 1332px;
+        height: 732px;
+        margin-top: 10px;
+        margin-left: 1px;
+        /* overflow-y: auto; */
+    }
+    .bottom_card {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: center;
+        align-items: center;
+        width: 865px;
+        margin-right: 470px;
+        }
+        
+        .megatntmega_card {
+        margin: 0 auto;
+        }
+        
+        .busha888_card {
+        margin: 0 auto;
+        }
+        
+        .CLARFFY_card {
+        margin: 0 auto;
+        margin-top: 15px;
+        }
+        
+    .top_card {
+        width: 1200px;
+        height: 443px;
+        display: flex;
+        justify-content: center;
+        margin-right: 450px;
+        
+    }
+    .Hepatir_card {
+        margin-left: 10px;
+        margin-right: 10px;
+    }
+    .FUpir_card {
+        margin-left: 10px;
+        margin-right: 10px;
+    }
+    
+    }
+
+
+
+
+
+
+

luckydiamond/src/assets/css/ComponentsStyles/header.css

@@ -14,17 +14,26 @@
     padding: 1.8% 0 1.2% 2.6%;
 }
 
+.header__logo img {
+    cursor: pointer;
+}
+
 .header__nav nav a {
-    margin-right: 30%;
     text-decoration: none;
     font-family: Montserrat Alternates;
     font-weight: 700;
+    font-size: 18px;
+    margin-right: 3em;
+    transition: 250ms;
+}
+
+.header__nav nav a:hover {
+    color: #EF4444;
 }
 
 .header__nav--now {
     color: #EF4444;
     text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-    font-size: 18px;
     position: relative;
 }
 
@@ -40,6 +49,10 @@
     z-index: 1;
 }
 
+.header__balance {
+    width: 120px;
+}
+
 .header__content--balance {
     display: flex;
     align-items: center;
@@ -76,6 +89,7 @@
     padding: 20px 23px 20px 23px;
     text-decoration: none;
     margin-left: -15%;
+    transition: 200ms;
 }
 
 .header__auth--discord {
@@ -111,6 +125,7 @@
     background: #30323E;
     text-decoration: none;
     padding: 6px 2px 6px 2px;
+    width: 75px;
 }
 
 .discord__card--name a span img {
@@ -131,9 +146,9 @@
     display: flex;
     align-items: center;
     border-radius: 13px;
-    background: #5865F2;
+    background: #5865f2;
     box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
-    color: #000;
+    color: #fff;
     font-size: 16px;
     font-weight: 600;
     font-family: Montserrat;
@@ -143,5 +158,5 @@
 }
 
 .auth__card--content a span img {
-    margin-right: 5px;
+    margin: 8% 5px 0 0;
 }

luckydiamond/src/assets/css/ComponentsStyles/notification.css

@@ -2,10 +2,12 @@
     position: absolute;
     top: 0%;
     left: 34%;
-    background: #000;
+    background: #232630;
     width: 20%;
     height: 5%;
     z-index: 1000;
+    border-radius: 10px;
+    font-family: Montserrat Alternates;
 }
 
 .notification__content  {

luckydiamond/src/assets/css/ComponentsStyles/payments-modal.css

@@ -0,0 +1,299 @@
+.payment-modal {
+    position: absolute;
+    top: 20%;
+    left: 35%;
+    border-radius: 25px;
+    background: #22252F;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 390px;
+    height: 420px;
+}
+
+.payments-modal__content {
+    text-align: center;
+    display: flex;
+    justify-content: space-between;
+}
+
+.close-modal__icon img {
+    margin: 21px 22px 0 0;
+    cursor: pointer;
+    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
+}
+
+.text-styles__margin h1 {
+    margin: 16px 0 0 26px;
+}
+
+.payments-modal__content h1 {
+    color: #fff;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-weight: 700;
+    font-family: Montserrat Alternates;
+    font-size: 20px;
+}
+
+.payments-modal__deposit {
+    margin-left: 26px;
+}
+
+.deposit-text h3 {
+    color: rgba(68, 198, 239, 0.33);
+    font-weight: 700;
+    line-height: 31px;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 12px;
+    margin-top: -10px;
+}
+
+.deposit-icon-diamond img {
+    position: absolute;
+    top: 16%;
+    left: 10%;
+}
+
+.referal-icon-diamond img {
+    position: absolute;
+    top: 35.5%;
+    left: 10%;
+}
+
+.deposit-icon__input .promo-input,
+.deposit-icon__input .deposit-amount__input,
+.withdraw-input .with-input{
+    width: 350px;
+    height: 44px;
+    border-radius: 15px;
+    border: 2px solid #2B3458;
+    background: #22252F;
+    color: rgba(148, 148, 148, 0.95);
+    font-weight: 700;
+    font-family: Montserrat Alternates;
+    font-size: 12px;
+    padding-left: 40px;
+}
+.promo-input {
+    width: 284px;
+    height: 44px;
+    border-radius: 15px;
+    border: 2px solid #2B3458;
+    background: #22252F;
+    color: rgba(148, 148, 148, 0.95);
+    font-weight: 700;
+    font-family: Montserrat Alternates;
+    font-size: 12px;
+    padding-left: 40px;
+    flex: 3.5;
+    font-weight: 700px;
+}
+.vvod_promocoda {
+    flex: 1;
+    width: 52px;
+    height: 44px;
+    background-color: #EF4444;
+    margin-left: 10px;
+    margin-right: 16px;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+    border-radius: 10px;
+    font-family: Montserrat Alternates;
+    font-weight: 600;
+    font-size: 19px;
+    color: #fff;
+    border: none;
+}
+.promokods {
+    display: flex;
+    flex-wrap: nowrap;
+}
+.display-btns {
+    display: flex;
+    margin-top: 10px;
+}
+
+.btns-style-diamonds button {
+    border-radius: 10px;
+    background: #252C47;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    color: #FFF;
+    font-weight: 700;
+    line-height: 31px;
+    font-family: Montserrat Alternates;
+    font-size: 12px;
+    border: none;
+    margin-right: 6px;
+    padding: 4px 19px;
+    
+}
+
+.deposit-promocode {
+    margin-top: 15px;
+}
+
+.deposit-promocode__padding--input input {
+    padding-left: 15px;
+}
+
+.deposit-checkbox {
+    display: flex;
+    margin-top: 11px;
+}
+
+.withdraw-checkbox {
+    display: flex;
+    align-items: center;
+    margin-top: 11px;
+}
+
+.withdraw-checkbox h3 {
+    margin: 0 0 0 5px;
+}
+
+.checkbox-styles input[type="checkbox"] {
+    background: #22252F;
+    border-radius: 8px;
+    border: 2px solid #2B3458;
+    width: 25px;
+    height: 25px;
+    outline: none;
+    cursor: pointer;
+    -webkit-appearance: none;
+}
+
+input[type="checkbox"]:checked::before {
+    content: '\2713';
+    font-weight: 700;
+    font-size: 16px;
+    display: block;
+    text-align: center;
+    line-height: 22px;
+    color: #fff;
+}
+
+.deposit-checkbox h3 {
+    margin: 0 0 0 10px;
+}
+
+.btn-deposit,
+.btn-withdraw {
+    display: flex;
+    text-align: center;
+    align-items: center;
+    justify-content: center;
+    margin: 10% 6% 0 0;
+}
+
+.btn-display-deposit {
+    display: flex;
+    flex-direction: column;
+}
+
+.btn-text-style p {
+    color: #949494F2;
+    font-weight: 700;
+    font-family: Montserrat Alternates;
+    font-size: 7.5px;
+    margin: 5px 0;
+}
+
+.btn-style-payments button {
+    border-radius: 10px;
+    background: #EF4444;
+    Font-family: Montserrat Alternates;
+    font-size: 16px;
+    color: #fff;
+    font-weight: 700;
+    line-height: 19px;
+    padding: 22px 120px;
+    border: none;
+}
+
+.btn-style-payments button:disabled {
+    background: #3d3a3a;
+}
+
+.btn-click {
+    border-radius: 10px !important;
+    background: #EF4444 !important;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25) !important;
+}
+
+/* Withdraw */
+
+.withdraw-modal {
+    height: 520px;
+}
+
+.payments-modal__withdraw {
+    margin-left: 26px;
+}
+
+.error-checkbox {
+    position: absolute;
+}
+
+.error-checkbox h2 {
+    font-size: 13px;
+    font-weight: 700;
+    color: #BA3636;
+    font-family: "Montserrat Alternates";
+}
+
+.error-promocode {
+    position: absolute;
+    left: 49%;
+    top: 35%;
+}
+
+.error-promocode .error-text__promocode {
+    font-size: 11px;
+    font-weight: 700;
+    color: #BA3636;
+    font-family: "Montserrat Alternates";
+    margin-left: 55px;
+}
+
+.error-promocode .correct-text__promocode {
+    font-size: 11px;
+    font-weight: 700;
+    color: #3BA44C;
+    font-family: "Montserrat Alternates";
+}
+
+.checkbox-styles input:disabled:hover {
+    animation: shake 0.6s cubic-bezier(.36, .07, .19, .97);
+}
+
+@keyframes shake {
+    0%, 100% {
+        transform: translateX(0);
+    }
+    10%, 30%, 50%, 70%, 90% {
+        transform: translateX(-4px);
+    }
+    20%, 40%, 60%, 80% {
+        transform: translateX(4px);
+    }
+}
+
+.number-card {
+    margin-top: 15px;
+}
+
+.btn-withdraw {
+    margin-top: 15%;
+}
+
+/* /Withdraw */
+
+/* Captcha Styles */
+
+.captcha-withdraw {
+    position: relative;
+    left: 20px;
+    top: 15px;
+}
+
+/* /Captcha Styles */

luckydiamond/src/assets/css/PagesStyles/BanPage.css

@@ -0,0 +1,29 @@
+.banpage--body {
+    background-color: rgb(17, 14, 32);
+    background-image: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1));
+    padding: 0px;
+    margin: 0;
+    color: #fff;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size:25px;
+    font-weight: 700;
+    text-transform: uppercase;
+    text-align: center;
+}
+.banpage--video {
+    border-radius: 10px;
+}
+
+.banpage--block {
+    width: 50%;
+    height: 100%;
+    display: block;
+    background-color: #ef4444;
+    margin: auto;
+    margin-top: 100px;
+    padding-top: 50px;
+    padding-bottom: 100px;
+    border-radius: 10px;
+    box-shadow: 12px 12px 2px 1px rgba(92, 12, 12, 0.2);
+}

luckydiamond/src/assets/css/PagesStyles/adaptive-pages/homemobile.css

@@ -0,0 +1,96 @@
+body {
+    overflow-y: scroll;
+}
+
+.content-grid__mobile-home {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: repeat(4, 1fr);
+    grid-template-rows: repeat(7, 1fr);
+    grid-template-areas:
+    "header-mobile header-mobile header-mobile header-mobile"
+    "main-mobile main-mobile main-mobile main-mobile"
+    "main-mobile main-mobile main-mobile main-mobile"
+    "footer-mobile footer-mobile footer-mobile footer-mobile";
+    height: 100%;
+    width: 100%;
+}
+
+.main-mobile {
+    grid-area: main-mobile;
+    width: 100%;
+    height: 100%;
+}
+
+/* Main */
+
+.main-mobile__content {
+    margin-top: 6%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+}
+
+.bg-mobile {
+    border-radius: 10px;
+    background: #EF4444;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 100%;
+    height: 10em;
+}
+
+.main-mobile__first-line {
+    display: flex;
+    width: 100%;
+}
+
+.main-mobile__two-line {
+    display: flex;
+    width: 100%;
+}
+
+.card-mobile__content { /* text display */
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+    align-items: center;
+}
+
+.card-first {
+    margin: 0 2.5% 0 3%;
+}
+
+.card-game__text h2 {
+    color: #FFF;
+    font-weight: 700;
+    font-size: 41px;
+    text-align: center;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    text-transform: uppercase;
+}
+
+.card-two {
+    margin: 5.1% 2.5% 0 3%;
+}
+
+.card-mobile__btn a {
+    text-decoration: none;
+    color: #000;
+    font-weight: 700;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 30px;
+    border-radius: 21px;
+    background: #FFF;
+    padding: 6px 11px;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+}
+
+.card-mobile__btn span {
+    font-size: 29px;
+    color: #000;
+}
+
+/* /Main */

luckydiamond/src/assets/css/PagesStyles/adaptive-pages/profilemobile.css

@@ -0,0 +1,95 @@
+body {
+    overflow-y: scroll;
+}
+
+.header-mobile {
+    height: 70%;
+}
+
+.profile-mobile {
+    grid-area: profile-mobile;
+    width: 100%;
+    height: 100%;
+}
+
+.profile-mobile__btns-payments {
+    display: flex;
+    flex-direction: column;
+}
+
+.profile-mobile__btns-payments a {
+    color: #17181C;
+    border-radius: 10px;
+    font-family: Montserrat Alternates;
+    font-size: 18px;
+    font-weight: 700;
+    text-decoration: none;
+    padding: 20px 20px;
+    margin: 0 0 2% 0
+}
+
+.profile-mobile__btns-payments .deposit-button {
+    background: #62D4B2;
+    margin-top: 4%;
+}
+
+.withdraw-button {
+    background: #EF4444;
+}
+
+.text-default-mobile h2, h3 {
+    font-weight: 700;
+    color: #fff;
+}
+
+.macroinfo-profile {
+    margin: 5% 10% 0 10%;
+    text-align: center;
+}
+
+.macroinfo-profile img {
+    width: 45%;
+    height: 100%;
+}
+
+.img-margin img {
+    margin-top: 15px;
+}
+
+.macroinfo-profile h2 {
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.00);
+    font-family: Montserrat Alternates;
+    font-size: 33px;
+}
+
+.header-off {
+    pointer-events: none !important;
+    filter: blur(15px) !important;
+}
+
+.info-profile {
+    margin: 6% 10% 0 10%;
+    text-align: center;
+}
+
+.info-profile .text-nickname-user {
+    font-family: Montserrat;
+    font-size: 2em;
+}
+
+.info-profile .balance-border {
+    border-radius: 20px;
+    width: 100%;
+    background: #22252F;
+}
+
+.info-profile .balance-display {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.info-profile .balance-text {
+    font-family: Montserrat Alternates;
+    font-size: 28px;
+}

luckydiamond/src/assets/css/PagesStyles/games-pages/crash.css

@@ -0,0 +1,474 @@
+.classMenegerCrash {
+    display: flex;
+   
+   flex-direction: row;
+  }
+  .classNoMenegerCrash {
+    margin-top: 7.4vh;
+    margin-left: 1vh;
+  }
+.crash-content {
+    display: grid;
+    grid-template-columns: repeat(6, 1fr);
+    grid-template-rows: repeat(5, 1fr);
+    gap: 0.625rem; /* 10px в рем */
+    grid-auto-flow: row;
+    grid-template-areas:
+    "crashgame crashgame crashgame crashgame crashgame crashgame"
+    "crashgame crashgame crashgame crashgame crashgame crashgame"
+    "crashgame crashgame crashgame crashgame crashgame crashgame"
+    "crashplayers crashplayers crashplayers crashplayers crashplayers crashplayers"
+    "crashplayers crashplayers crashplayers crashplayers crashplayers crashplayers";
+    background: #17181C;
+    box-shadow: 0 0.25rem #00000040;
+    border-radius: 1.25rem;
+
+.grid-crash .chat {
+    height: 96.8%;
+}
+
+.crash-game {
+    background: #22252F;
+    border-radius: 1.25rem;
+    box-shadow: 0.25rem 0.25rem 0.25rem 0px #00000040;
+    width: 95%;
+    height: 29.6875rem;
+    margin: 2.5625rem auto 0 auto;
+}
+
+.crash-game__content {
+    display: flex;
+}
+
+/* Crash-Window */
+
+.crash-game__start-window {
+    margin-left: 30px;
+    height: 0;
+}
+
+.crash-game__start-window .crash__game-name {
+    margin: 62px 0 2px 0;
+    font-family: 'Montserrat Alternates';
+    font-weight: 700;
+    font-size: 26px;
+    color: #fff;
+    box-shadow: 1px 1px 1px 0px #00000001;
+}
+
+.crash-game__start-window p {
+    font-family: 'Montserrat Alternates';
+    font-weight: 700;
+    font-size: 14px;
+    color: #FFFFFF85;
+}
+
+.crash-game-window__inputs {
+    margin-top: 29px;
+}
+
+.crash-label {
+    font-family: 'Montserrat Alternates';
+    font-weight: 700;
+    font-size: 13px;
+    color: #44C6EF54;
+    margin: 0 0 4px 4px;
+}
+
+.input-style-crash {
+    width: 347px;
+    height: 40px;
+    border: 2px solid #2B3458;
+    border-radius: 15px;
+    background: #22252F;
+}
+
+.diamond-input-crash {
+    margin-left: -25px;
+}
+
+.input-style-crash__text {
+    font-family: 'Montserrat Alternates';
+    font-weight: 700;
+    font-size: 12px;
+    color: #fff;
+    padding-left: 35px;
+}
+
+.crash-input-deposit .diamonds-btns__display {
+    margin: 8px 0 19px -22px;
+}
+
+.crash-input-deposit #max-button {
+    padding: 4px 10px;
+}
+
+.crash-input-deposit .diamond-icon {
+    left: 12px;
+}
+
+.crash-game-window__btn-start {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin-top: 23px;
+}
+
+.crash-game-window__btn-start button {
+    margin-bottom: 5px;
+    background: #EF4444;
+    border: unset;
+    border-radius: 10px;
+    width: 300px;
+    height: 60px;
+    font-family: 'Inter';
+    font-weight: 700;
+    font-size: 18px;
+}
+
+.claim-btn-crash__prize {
+    background: #4E5EF2 !important;
+}
+
+.waiting-btn-crash {
+    background: #3D3F48 !important;
+}
+
+.crash-window__line {
+    display: flex;
+    flex-direction: row-reverse;
+}
+
+.line-crash {
+    width: 2px;
+    height: 474px;
+    background: #30364F;
+    position: relative;
+    top: -342px;
+    left: 10%;
+    z-index: 1;
+}
+
+.crash-game__content .error-block {
+    top: 425px;
+}
+
+/* /Crash-Window */
+
+/* Crash-Graph */
+
+.crash-game__graph {
+    width: 800px;
+    top: 200px;
+    left: 600px;
+    position: fixed;
+}
+
+
+.chart-container canvas {
+    background-color: transparent !important;
+    width: 800px !important;
+    height: 400px !important;
+    transition: .3s ease;
+}
+
+.lost-ratio {
+    color: #EF4444;
+    font-weight: 700;
+}
+
+/* /Crash-History */
+
+.crash__history {
+    background: linear-gradient(90deg, rgba(34, 37, 47, 0.8) -0.54%, rgba(34, 37, 47, 0.8) 83.03%, rgba(73, 59, 74, 0.64) 103.54%);
+    width: 66%;
+    height: 50px;
+    border-radius: 18px;
+    margin-left: 455px;
+    display: grid;
+    grid-template-columns: auto auto auto;
+    gap: 10px;
+}
+
+.grid-item {
+    background-color: rgba(255, 255, 255, 0.8);
+    border: 1px solid rgba(0, 0, 0, 0.8);
+    text-align: center;
+  }
+
+.crash-history__element {
+    height: 80%;
+    border-radius: 18px;
+    background: rgba(34, 37, 47, 0.8);
+}
+
+/* Crash-Players */
+
+.user-crash {
+    display: flex;
+    justify-content: end;
+    margin-left: 400px;
+}
+
+.user-list {
+    overflow-y: auto;
+    height: 300px;
+}
+
+.user-crash-content {
+    background: linear-gradient(90deg, rgba(34, 37, 47, 0.8) -0.54%, rgba(34, 37, 47, 0.8) 83.03%, rgba(73, 59, 74, 0.64) 103.54%);
+    display: grid;
+    justify-content: space-between;
+    grid-template-columns: repeat(5, 50px) 100px;
+    gap: 0px 0px;
+    grid-auto-flow: row;
+    grid-template-areas:
+    "username username bid bid ... status";
+    margin: 10px auto;
+    width: 90%;
+    height: 70px;
+    border-radius: 18px;
+}
+
+.user-crash-content__lose {
+    background: linear-gradient(90deg, #22252F -0.54%, #322733 83.25%, #B53938 103.54%) !important;
+}
+
+.user-crash-content__win {
+    background: linear-gradient(90deg, #22252F -0.54%, #22252F 84.17%, rgba(42, 110, 57, 0.87) 103.54%);
+}
+
+.user-name-crash {
+    display: flex;
+    align-items: center;
+    margin: 10px;
+    grid: 'username';
+}
+
+.user-name-crash h2 {
+    margin-left: 8px;
+    color: #61647F;
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-size: 20px;
+}
+
+.user-name-crash img {
+    width: 50px;
+}
+
+.user-bid-crash {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    grid-area: bid;
+}
+
+.user-bid-crash h2 {
+    color: #848484;
+    font-weight: 700;
+    font-family: 'Montserrat';
+    font-size: 24px;
+}
+
+.user-bid-crash img {
+    margin: 5px 0 0 5px;
+}
+
+.user-game-status-crash {
+    display: flex;
+    align-items: center;
+    grid-area: status;
+}
+
+.user-game-status-crash h2 {
+    font-size: 20px;
+}
+
+.wingame__win-bid-crash {
+    color: #28BD49 !important;
+}
+
+.ingame-crash {
+    color: #61647F;
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-size: 12px;
+    background: #22252F;
+    box-shadow: 0px 4px 4px 0px #00000040;
+    border-radius: 5px;
+    width: 70px;
+    height: 24px;
+}
+
+.lostgame-crash {
+    color: #fff;
+    font-weight: 700;
+    font-family: 'Montserrat';
+    background: #EF4847;
+    box-shadow: 0px 4px 4px 0px #00000040;
+    border-radius: 5px;
+    margin-left: -26px;
+    padding: 4px;
+}
+
+.wingame-crash {
+    box-shadow: 0px 4px 4px 0px #00000040;
+    font-family: 'Montserrat';
+    font-weight: 700;
+    color: #28BD49;
+    border: 1px solid #28BD49;
+    border-radius: 5px;
+    padding: 6px;
+}
+
+.ratio {
+    position: relative;
+    left: 50%;
+    top: -390px;
+    font-size: 34px;
+    font-weight: 700;
+    font-family: 'Montserrat';
+}
+
+.time {
+    position: relative;
+    left: 50%;
+    font-size: 34px;
+    font-weight: 700;
+    font-family: 'Montserrat';
+}
+
+/* /Crash-Players */
+
+/* Notification */
+
+.notification-crash {
+    text-align: center;
+    top: 20%;
+    left: 50%;
+    position: absolute;
+    background: #000;
+    width: 200px;
+    height: 40px;
+}
+
+/* /Notification */
+
+/* Media */
+
+@media screen and (max-width: 1740px) and (min-width: 1400px) {
+    .crash-game__content .error-block{
+        top: 407px !important;
+    }
+    .crash-game__graph {
+        width: 500px;
+        height: 500px;
+        top: 190px;
+        left: 570px;
+    }
+    .crash-input-deposit .btn-style__diamonds button {
+        padding: 4px 18px !important;
+    }
+    .chart-container {
+        width: 500px !important;
+        height: 500px !important;
+    }
+}
+
+@media screen and (max-width: 1400px) and (min-width: 1200px) {
+    .header__nav nav a {
+        font-size: 16px;
+    }
+    .crash-game__content .error-block{
+        top: 405px !important;
+    }
+    .crash-game__graph {
+        width: 400px;
+        height: 400px;
+        top: 180px;
+        left: 550px;
+    }
+    .chart-container {
+        width: 400px !important;
+        height: 400px !important;
+    }
+    .crash-input-deposit .btn-style__diamonds button {
+        padding: 4px 18px !important;
+    }
+}
+
+@media screen and (max-height: 950px) and (min-height: 915px) {
+    .grid-crash .chat {
+        height: 92.5%;
+    }
+    .crash-game__players {
+        height: 270px;
+    }
+    .crash-game-players__content {
+        height: 230px;
+    }
+    .ratio {
+        top: -380px;
+    }
+    .time {
+        left: 45%;
+    }
+}
+
+@media screen and (max-height: 915px) and (min-height: 890px) {
+    .grid-crash .chat {
+        height: 100%;
+    }
+    .chat__content--users {
+        height: 58vh;
+    }
+    .crash-game {
+        height: 40vh;
+    }
+    .crash-game__players {
+        height: 290px;
+    }
+    .crash-game-players__content {
+        height: 250px;
+    }
+    .crash-game__graph {
+        height: 100px !important;
+        top: 200px;
+    }
+    #line-chart {
+        height: 300px !important;
+    }
+    .ratio {
+        top: -320px;
+    }
+    .time {
+        left: 40%;
+    }
+    .line-crash {
+        height: 366px;
+    }
+}}
+
+@media screen and (min-height: 950px) {
+  .chat {
+    height: 88vh !important;
+  }
+}
+
+/*.crash-game__graph {*/
+/*    width: 800px;*/
+/*    top: 200px;*/
+/*    left: 600px;*/
+/*    position: fixed;*/
+/*}*/
+
+
+/*.chart-container canvas {*/
+/*    background-color: transparent !important;*/
+/*    width: 800px !important;*/
+/*    height: 400px !important;*/
+/*    transition: .3s ease;*/
+/*}*/
+
+/* /Media */

luckydiamond/src/assets/css/PagesStyles/games-pages/double.css

@@ -0,0 +1,325 @@
+.bet-button {
+    border: none;
+    padding: 10px 20px;
+    margin: 5px;
+    border-radius: 10px;
+    color: white;
+    font-weight: bold;
+    cursor: pointer;
+    transition: transform 0.1s ease;
+    outline: none;
+}
+
+/* Цвета для кнопок */
+.bet-button.red {
+    background-color: #863443;
+}
+
+.bet-button.green {
+    background-color: #2D4940;
+}
+
+.bet-button.black {
+    background-color: #202333;
+}
+
+/* Стили для нажатой кнопки */
+.bet-button:active {
+    transform: scale(0.95);
+    /* Уменьшение при нажатии */
+}
+
+.bet-button.active {
+    opacity: 0.7;
+    /* Пример изменения стиля активной кнопки */
+}
+
+/* Можно добавить тени для кнопок, чтобы они выглядели объемнее */
+.bet-button {
+    margin: 1.2% 0 0 5.8%;
+    margin-bottom: 1vh;
+    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
+}
+
+/* Стиль для тени при нажатии (опционально) */
+.bet-button:active {
+    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
+}
+
+.double-start {
+    z-index: 1;
+    border-radius: 20px;
+    background: #1D223E;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 42vh;
+    height: 37vh;
+    border: 1px solid #262C55;
+    margin: 2.6%;
+    margin-top: 0px;
+}
+
+.double-game {
+    z-index: 1;
+    border-radius: 20px;
+    width: 69%;
+    height: 94%;
+}
+
+.double-ui-component {
+    display: flex;
+    align-items: center;
+    background-color: #25325A;
+    border-radius: 15px;
+    /* padding: 10px 20px; */
+    padding-right: 2vh;
+    padding-bottom: 1vh;
+    padding-top: 1vh;
+    padding-left: 2vh;
+    margin-bottom: 1vh;
+    max-width: 300px;
+    color: white;
+    font-family: Arial, sans-serif;
+    /* background: linear-gradient(to right, #1C213390 50%, #2F5139); */
+}
+
+.double-ui-component-gradient {
+    background: linear-gradient(to right, #1C213390 50%, #2F5139);
+}
+
+/* .double-ui-component img {} */
+
+.double-ui-component .double-username {
+    flex-grow: 1;
+    text-align: left;
+    margin-left: 1vh;
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #515D83;
+}
+
+.double-ui-component .double-score {
+    display: flex;
+    align-items: center;
+}
+
+.double-score {
+    font-size: 20px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #748985;
+}
+
+.double-img-user {
+    margin-top: 6px;
+}
+
+.double-ui-component .double-score img {
+    width: 3vh;
+    height: 3vh;
+    margin-left: 10px;
+}
+
+.double-members-ingame-red {
+    overflow-y: auto;
+    background: linear-gradient(to bottom right,
+            #A9373C,
+            #1C2133 20%);
+    z-index: 1;
+    border: 2px solid #3B4260;
+    border-radius: 15px;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    margin-top: 1vh;
+    width: 100%;
+    height: 49vh;
+    /* height: 94%; */
+    padding: 2vh;
+}
+
+.double-members-ingame-green {
+    overflow-y: auto;
+    background: linear-gradient(to bottom right,
+            #345D3B,
+            #1C2133 20%);
+    z-index: 1;
+    border: 2px solid #3B4260;
+    border-radius: 15px;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    margin-top: 1vh;
+    width: 100%;
+    height: 49vh;
+    /* height: 94%; */
+    padding: 2vh;
+}
+
+.double-members-ingame-black {
+    overflow-y: auto;
+    background: linear-gradient(to bottom right,
+            #1B1A1A,
+            #1C2133 26%);
+    z-index: 1;
+    border: 2px solid #3B4260;
+    border-radius: 15px;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    margin-top: 1vh;
+    margin-top: 1vh;
+    width: 100%;
+    /* height: 94%; */
+    height: 49vh;
+    padding: 2vh;
+}
+
+.double-members-flex-container {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    color: white;
+    margin-bottom: 2vh;
+}
+
+.double-red-box {
+    display: flex;
+    align-items: baseline;
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #B64848;
+}
+
+.double-white-box {
+    display: flex;
+    align-items: baseline;
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: FEEBEB;
+}
+
+.double-green-box {
+    display: flex;
+    align-items: baseline;
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #5EA25C;
+}
+
+.double-number-color {
+    color: #56629A;
+    font-weight: bold;
+    font-size: 18px;
+    font-family: Montserrat;
+}
+
+.double-red-box span {
+    font-size: larger;
+    /* Or any specific size */
+    margin-left: 5px;
+    /* Spacing between RED and X2 */
+}
+
+.double-user-icon {
+    display: flex;
+    align-items: center;
+}
+
+.double-user-icon .double-user-icon-span {
+    background-image: url('../../../icons-games/double-game/MembersInGame.png');
+    width: 20px;
+    height: 20px;
+    margin-right: 5px;
+}
+
+.double-game {
+    z-index: 1;
+    border-radius: 20px;
+    width: 69%;
+    height: 94%;
+}
+
+.double-game-main-box {
+    border-radius: 10px;
+    border: 1px solid #262C55;
+    padding-top: 4vh;
+    padding-bottom: 4vh;
+    padding-left: 0vh !important;
+    padding-right: 0vh !important;
+    background: #1A1F37;
+    margin-bottom: 1vh !important;
+}
+
+.double-carousel {
+    z-index: 1;
+    position: relative;
+    background: #2E2D37;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 100%;
+    margin-top: 1px;
+    border: 1vh solid #2E2D37;
+    border-right: 0vh !important;
+    border-left: 0vh !important;
+    height: 95%;
+}
+
+.container-double-history-text {
+    display: flex;
+}
+
+.double-history-text {
+    background-color: #728DF8;
+    border: none;
+    color: #0E1220;
+    padding-right: 1vh;
+    padding-left: 1vh;
+    font-size: 16px;
+    margin: 4px 2px;
+    border-radius: 5px;
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+    font-size: 18px;
+    font-family: Montserrat;
+    font-weight: bold;
+}
+
+.double-carousel-arrow {
+    position: absolute;
+    bottom: -3vh;
+    left: 50%;
+    transform: translateX(-50%);
+    color: #728DF8;
+    font-size: 24px;
+}
+
+.double-carousel-arrow-animate {
+    animation: blink 1s infinite;
+}
+
+@keyframes blink {
+
+    0%,
+    100% {
+        opacity: 1;
+    }
+
+    50% {
+        opacity: 0;
+    }
+}
+
+.double-carousel-arrow-upper {
+    position: absolute;
+    top: -3vh;
+    left: 50%;
+    transform: translateX(-50%) rotate(180deg);
+    color: #728DF8;
+    font-size: 24px;
+}
+
+.double-game-history-main-box {
+    border-radius: 20px;
+    border: 1px solid #262C55;
+    padding-top: 1vh;
+    padding-bottom: 0vh;
+    padding-left: 1vh;
+    padding-right: 0vh;
+    background: #1A1F37;
+}

luckydiamond/src/assets/css/PagesStyles/games-pages/jackpot.css

@@ -0,0 +1,390 @@
+.jackpot-start {
+    z-index: 1;
+    /* margin-left: 5%; */
+    border-radius: 20px;
+    background: #1D223E;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 42vh;
+    /* height: 480px; */
+    height: 32vh;
+    border: 1px solid #262C55;
+    /* margin-top: 2.6%; */
+    margin: 2.6%;
+}
+.classMeneger {
+    display: flex;
+   
+   flex-direction: row;
+  }
+  .classNoMeneger {
+    margin-left: 1vh;
+    margin-top: 2.4vh;
+  }
+
+.jackpot-loading-bar {
+    z-index: 1;
+    /* margin-left: 5%; */
+    border-radius: 20px;
+    background: #1D223E;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 100%;
+
+    /* height: 480px; */
+    /* height: 100%; */
+    border: 1px solid #262C55;
+    height: 100%;
+    /* margin-top: 2.6%; */
+    /* margin: 2.6%; */
+}
+
+.jackpot-carousel {
+    z-index: 1;
+    position: relative;
+    /* margin-left: 5%; */
+    border-radius: 10px;
+    background: #1D223E;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 100%;
+    margin-top: 1%;
+
+    /* height: 480px; */
+    /* height: 100%; */
+    border: 1px solid #262C55;
+    height: 95%;
+}
+
+.carousel-arrow {
+    position: absolute;
+    bottom: -20px;
+    left: 50%;
+    transform: translateX(-50%);
+    color: #728DF8;
+    font-size: 24px;
+}
+
+.jackpot-useringame-list{
+    margin-top: 3.5%;
+    overflow-y: auto;
+    height: 62vh
+}
+.jackpot-carousel-user {
+    z-index: 1;
+    position: relative;
+    /* margin-left: 5%; */
+    border-radius: 10px;
+    background: #1F2543;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 100%;
+    margin-bottom: 1%;
+
+    /* height: 480px; */
+    /* height: 100%; */
+    border: 1px solid #262C55;
+}
+
+
+.jackpot-game {
+    z-index: 1;
+    /* margin-left: 5%; */
+    border-radius: 20px;
+    /* background: #1D223E; */
+    /* box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25); */
+    width: 69%;
+    /* height: 480px; */
+    height: 94%;
+    /* border: 1px solid #262C55; */
+    margin-top: 2.6%;
+}
+
+.jackpot-main-elements {
+    z-index: 1;
+}
+
+.jackpot-start__content p {
+    color: #FFFFFF84;
+    font-weight: 700;
+    line-height: 31px;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 13px;
+}
+
+.padding-elements-jackpot {
+    padding-left: 1vh;
+    padding-right: 1vh;
+}
+
+.jackpot-start__btns {
+    margin-top: 5%;
+    display: flex;
+    flex-direction: column;
+}
+
+.jackpot-start__btns button {
+    width: 100%;
+    padding: 12px;
+    margin-bottom: 5px;
+    border: none;
+    color: #FFF;
+    font-weight: 700;
+    line-height: 19px;
+    font-style: normal;
+    font-family: Inter;
+    font-size: 16px;
+}
+
+.bank-container {
+    display: flex;
+    align-items: center;
+    /* background-color: #000066; */
+    color: white;
+    padding: 10px;
+    border-radius: 5px;
+    font-family: Arial, sans-serif;
+    /* Choose your font */
+}
+
+.shield img {
+    width: 35px;
+    /* Adjust based on your shield size */
+    height: auto;
+    margin-left: 10px;
+    margin-bottom: -10px;
+}
+
+.bank-info {
+    display: flex;
+    flex-direction: column;
+    text-align: left;
+}
+
+.jackpot-last-game-bar-container {
+    /* margin-bottom: 3%; */
+    padding-top: 10px;
+}
+
+.jackpot-last-game-bar-container img {
+    /* margin-bottom: 3%; */
+    width: 3vh;
+    height: 3vh;
+}
+
+.jackpot-last-game-bar-container-text {
+    padding: 0px 0 5px 0;
+    color: #FFF;
+    font-weight: 200;
+    line-height: 15px;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.00);
+    font-family: Montserrat Alternates;
+    font-size: 8px;
+}
+
+.jackpot-last-game-bar {
+    z-index: 1;
+    /* margin-left: 5%; */
+    border-radius: 20px;
+    background: #1D223E;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 100%;
+
+    /* height: 480px; */
+    /* height: 100%; */
+    border: 1px solid #262C55;
+    height: 100%;
+    /* margin-top: 2.6%; */
+    /* margin: 2.6%; */
+
+}
+
+.bank-value {
+    font-size: 24px;
+    /* Large text size */
+    font-weight: bold;
+    margin-left: 1%;
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #FFFFFF84;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    /* Make the number bold */
+}
+
+.bank-name {
+    font-size: 24px;
+
+    font-family: Montserrat;
+    font-weight: bold;
+    /* Smaller text size for 'БАНК' */
+}
+
+.progress-text {
+    transition: opacity 0.5s ease;
+    opacity: 1;
+}
+
+.progress-bar {
+    width: 95%;
+    background-color: #D9D9D9;
+    /* Navy blue background */
+    border-radius: 10px;
+    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
+    margin-left: 2vh;
+    margin-bottom: 3%;
+}
+
+.progress {
+    height: 40px;
+    background-color: #E13F3F;
+    /* Red for the progress */
+    border-radius: 10px;
+    /* Rounded corners on the left side */
+    line-height: 40px;
+    /* Same as height to vertically center text */
+    color: white;
+    text-align: start;
+    text-indent: 20px;
+    padding-right: 10px;
+    /* Add some padding to the right of the text */
+    transition: width 0.25s ease-in-out;
+}
+
+.no-pointer-events {
+    pointer-events: none;
+}
+
+.jackpot-player-info {
+    display: flex;
+    align-items: center;
+    padding-left: 5px;
+    padding-right: 5px;
+    border-radius: 5px;
+    color: white;
+    font-family: Arial, sans-serif;
+}
+
+.jackpot-player-avatar img {
+    width: 48px;
+    /* Adjust size as needed */
+    height: 48px;
+    margin-right: 10px;
+    margin-left: 1vh;
+}
+
+.jackpot-player-data {
+    display: flex;
+    flex-direction: column;
+}
+
+.jackpot-player-name {
+    font-size: 16px;
+    /* Adjust font size as needed */
+    font-weight: bold;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat;
+    font-weight: bold;
+    color: #515D83;
+}
+
+.jackpot-player-gems {
+    font-size: 15px;
+    /* Adjust font size as needed */
+    display: flex;
+    align-items: start;
+    color: #FFFFFF84;
+    /* font-weight: 700; */
+    /* line-height: 31px; */
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-weight: bold;
+    /* font-size: 13px; */
+}
+
+
+.jackpot-gems-icon {
+   
+    margin-left: 5px;
+    height: 1vh;
+}
+
+.jackpot-gems-icon-extension{
+    margin-bottom: -10px !important;
+}
+
+.jackpot-player-chance {
+    background-color: #27345C;
+    /* Adjust background color as needed */
+    border-radius: 5px;
+    font-size: 14px;
+    /* Adjust font size as needed */
+    padding-left: 5px !important;
+    padding-right: 5px;
+    padding-bottom: 5px;
+    padding-top: 5px;
+    border-radius: 5px;
+    margin-left: 10%;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat;
+    font-weight: bold;
+}
+.jackpot-chance-value {
+    color: #EF4444; /* Или любой другой оттенок красного, который вам нужен */
+  }
+  
+  .jackpot-banner {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background-color: #1e2749; /* Dark blue background */
+    padding: 5px;
+    border-radius: 5px;
+    color: white;
+    font-family: Montserrat;
+    font-weight: bold;
+
+  }
+  
+  .jackpot-content {
+    display: flex;
+    align-items: center;
+  }
+  
+  .jackpot-avatar {
+    width: 48px; /* Adjust based on your preference */
+    height: 48px;
+    margin-right: 10px;
+  }
+  
+  .jackpot-info {
+    display: flex;
+    flex-direction: column;
+  }
+  
+  .jackpot-name {
+    font-size: 16px;
+    font-weight: bold;
+    color: #515D83;
+  }
+  
+  .jackpot-gems {
+    font-size: 14px;
+    color: #FFFFFF84;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-weight: bold;
+  }
+  
+  .jackpot-chance {
+    font-size: 16px;
+    background-color: transparent; /* Adjust if you want a different background */
+  }
+  
+  .jackpot-percentage {
+    color: #EF4444; /* Adjust if you want a different color */
+  }
+  
+
+@media (max-width: 1415px) {
+    .padding-elements-jackpot {
+        padding-left: 0;
+        padding-right: 0;
+    }
+}

luckydiamond/src/assets/css/PagesStyles/games-pages/saper.css

@@ -0,0 +1,705 @@
+.saper {
+    display: flex;
+    padding-top: 10%;
+    border-radius: 20px;
+    background: #17181C;
+    backdrop-filter: blur(100px);
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+}
+.classMenegerSaper {
+    display: flex;
+   
+   flex-direction: row;
+  }
+  .classNoMenegerSaper {
+    margin-left: 1vh;
+    margin-top: 2.4vh;
+  }
+.bg {
+    background: #293561;
+    filter: blur(120px);
+    position: absolute;
+    top: 250px;
+    transform: rotate(180deg);
+    left: 200px;
+    width: 40%;
+    height: 55%;
+    z-index: -1;
+}
+
+.bg-two {
+    background: #293561;
+    filter: blur(120px);
+    position: absolute;
+    top: 220px;
+    transform: rotate(330deg);
+    left: 600px;
+    width: 60%;
+    height: 35%;
+    z-index: -1;
+}
+
+.saper-start {
+    z-index: 1;
+    margin-left: 5%;
+    border-radius: 20px;
+    background: #22252F;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 27%;
+    height: 480px;
+    margin-top: 2.6%;
+}
+
+.padding-elements {
+    padding-left: 5%;
+}
+
+.title-saper h2 {
+    padding: 16px 0 5px 0;
+    color: #FFF;
+    font-weight: 700;
+    line-height: 31px;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.00);
+    font-family: Montserrat Alternates;
+    font-size: 26px;
+}
+
+.saper-start__content p {
+    color: #FFFFFF84;
+    font-weight: 700;
+    line-height: 31px;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 13px;
+}
+
+.crystals h3,
+.diamonds h3 {
+    color: #44C6EF54;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 12px;
+    font-weight: 700;
+    line-height: 31px;
+}
+
+.crystals .crystals__choises input,
+.diamonds .diamonds__choises input {
+    width: 110px;
+    height: 38px;
+    color: #FFF;
+    font-weight: 700;
+    line-height: 31px;
+    font-family: Montserrat Alternates;
+    font-size: 12px;
+    border-radius: 10px;
+    padding-left: 25px;
+    border: 2px solid #2B3458;
+    background: #22252F;
+}
+
+.crystals__choises {
+    display: flex;
+    align-items: center;
+}
+
+.crystals .crystals__choises input:focus,
+.diamonds .diamonds__choises input:focus {
+    outline: none;
+}
+
+.crystals-input__margin {
+    margin-left: -5.5%;
+}
+
+.btn-click {
+    border-radius: 10px !important;
+    background: #EF4444 !important;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25) !important;
+}
+
+.crystals-btns__choices button,
+.btn-style__diamonds button {
+    margin-left: 5px;
+    border-radius: 10px;
+    background: #252C47;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    border: none;
+    color: #FFF;
+    font-weight: 700;
+    line-height: 31px;
+    font-family: Montserrat Alternates;
+    font-size: 12px;
+    padding: 4px 23px;
+}
+
+.crystal-icon,
+.diamond-icon {
+    position: relative;
+    left: 25px;
+    top: 2px;
+}
+
+.crystals-btns__display {
+    display: flex;
+}
+
+#diamonds-input-saper {
+    width: 37vh;
+    height: 4vh;
+}
+
+@media (max-width: 1630px) {
+    #diamonds-input-saper {
+        width: 30vh !important;
+    }
+}
+
+#diamonds-input {
+    /* width: 347px;
+    height: 38px; */
+    /* width: 37vh; */
+    width: 36vh;
+    height: 4vh;
+}
+
+.diamonds h3 {
+    margin: 1.2% 0 0 5.8%;
+}
+
+.diamonds-input__margin {
+    margin-left: -5.6%;
+}
+
+.diamonds .diamonds__choises input {
+    padding-left: 35px;
+}
+
+.diamond-icon {
+    top: 12px;
+    left: 35px;
+}
+
+.diamonds__btns {
+    margin: 2.5% 0 0 5.5%;
+}
+
+.diamonds-btns__display {
+    display: flex;
+    margin-left: -1%;
+}
+
+.btn-style__diamonds button {
+    padding: 4px 20px;
+}
+
+#max-button {
+    text-transform: uppercase;
+    font-family: Inter;
+    font-size: 16px;
+    font-weight: 700;
+    padding: 4px 13px;
+}
+
+.saper-start__btns {
+    margin: 3.7% 2.7% 0 0;
+    display: flex;
+    flex-direction: column;
+}
+
+.saper-start__btns button {
+    width: 100%;
+    padding: 12px;
+    margin-bottom: 5px;
+    border: none;
+    color: #FFF;
+    font-weight: 700;
+    line-height: 19px;
+    font-style: normal;
+    font-family: Inter;
+    font-size: 16px;
+
+}
+
+.btn-start {
+    border-radius: 10px;
+    background: #EF4444;
+}
+
+.btn-claim {
+    border-radius: 10px;
+    background: #252C47;
+}
+
+.saper-start__steps {
+    margin-top: 1%;
+}
+
+.steps-btns__display span {
+    display: flex;
+    justify-content: center;
+    font-size: 10px;
+    color: #adadad;
+}
+
+.steps-btns__display {
+    display: flex;
+}
+
+.btns-style__steps button {
+    border-radius: 10px;
+    background: #252C47;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    border: none;
+    color: #FFF;
+    font-weight: 700;
+    font-family: Montserrat Alternates;
+    font-size: 12px;
+    width: 100px;
+    height: 40px;
+}
+
+.error-block {
+    position: absolute;
+    top: 445px;
+}
+
+.error-block h2 {
+    color: #982f2f;
+    font-weight: 700;
+    font-family: Montserrat Alternates;
+    font-size: 10px;
+}
+
+.animate-start-btn {
+    animation: shake 0.6s cubic-bezier(.36, .07, .19, .97);
+    opacity: 50%;
+}
+
+/* Saper Game */
+
+.start-game {
+    position: absolute;
+    top: 15%;
+    left: 45%;
+    background: #262C48;
+    padding: 20px;
+    border-radius: 10px;
+}
+
+.saper-game {
+    margin: -2.75% 0 0 5.1%;
+}
+
+.saper-game__content {
+    display: flex;
+    border-radius: 20px;
+    background: #22252F;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 85%;
+    height: 580px;
+}
+
+.square {
+    border-radius: 10px;
+    background: #252C47;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 95px;
+    height: 95px;
+    cursor: pointer;
+    transition: transform 0.6s;
+    transform-style: preserve-3d;
+}
+
+.square-fliper {
+    transform: rotateY(180deg);
+}
+
+.square h2 {
+    transition: .2s;
+    opacity: 1;
+    user-select: none;
+}
+
+.square-text {
+    color: #303751;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.00);
+    font-family: Montserrat Alternates;
+    font-size: 33px;
+    font-weight: 700;
+    text-transform: uppercase;
+    text-align: center;
+    padding-top: 25px;
+}
+
+.game {
+    pointer-events: none;
+}
+
+.game-end {
+    pointer-events: none;
+    user-select: none;
+    filter: blur(5px);
+}
+
+.img-style-click {
+    position: relative;
+    width: 110px;
+    height: 110px;
+    top: -70px;
+    user-select: none;
+}
+
+.crystal-img {
+    left: -5px;
+}
+
+.game-start {
+    pointer-events: unset !important;
+}
+
+.game-start__menu-off .crystals,
+.game-start__menu-off .diamonds,
+.game-start__menu-off .saper-start__btns .btn-start {
+    pointer-events: none;
+}
+
+.hidden {
+    opacity: 0 !important;
+}
+
+.display-lines {
+    display: flex;
+}
+
+.margin-lines .firstline {
+    margin-top: 5%;
+}
+
+.margin-lines {
+    padding-left: 4%;
+}
+
+.margin-lines li {
+    margin: 2% 10px 1% 0;
+}
+
+.info-emeralds {
+    margin: 13.5% 0 0 10.5%;
+}
+
+.info-crystals__count {
+    position: relative;
+}
+
+.card-style-count {
+    width: 40%;
+    text-align: center;
+    font-family: "Montserrat Alternates";
+    font-size: 18px;
+    font-weight: 700;
+    padding: 1% 1%;
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    border-radius: 25px;
+    opacity: 0;
+}
+
+.on-element-card {
+    opacity: 1 !important;
+    transition: opacity .4s ease;
+}
+
+.emeralds-bg {
+    background: #6BC884;
+    top: -22%;
+    left: 12%;
+}
+
+.crystals-bg {
+    background: #EF4444;
+    top: -20%;
+    left: 12%;
+}
+
+.card-info {
+    border-radius: 15px;
+    border: 1px solid #2B4D6C;
+    background: linear-gradient(180deg, #252C47 0%, #252C47 8.33%, rgba(37, 44, 71, 0.00) 100%);
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 85%;
+    height: 250px;
+}
+
+.text-style__subtitle h2 {
+    margin: 8% 0 6px 6.3%;
+    color: #FFF;
+    font-weight: 800;
+    line-height: 18px;
+    text-transform: uppercase;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.00);
+    font-family: Montserrat Alternates;
+    font-size: 17px;
+}
+
+.text-style__comment p {
+    margin-left: 6.3%;
+    color: #9CA5C7;
+    font-weight: 400;
+    line-height: 13px;
+    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.00);
+    font-family: Montserrat Alternates;
+    font-size: 13px;
+}
+
+.info-crystals {
+    margin: 13.5% 0 0 10.5%;
+}
+
+.circles__content {
+    user-select: none;
+    display: flex;
+    justify-content: center;
+    position: relative;
+    left: 17px;
+}
+
+.circles {
+    position: absolute;
+}
+
+.circles-1 {
+    top: 125px;
+}
+
+.circles-2 {
+    top: 235px;
+}
+
+.circles-3 {
+    top: 345px;
+}
+
+.circles-4 {
+    top: 455px;
+}
+
+/* /Saper Game */
+
+/* Media */
+
+@media screen and (min-device-width: 1400px) and (max-device-width: 1600px) {
+    .saper-game__content {
+        width: auto;
+    }
+
+    .error-block {
+        top: 425px;
+    }
+
+    .saper-start {
+        width: 30%;
+        height: 500px;
+    }
+
+    .btns-style__steps button {
+        width: 60px;
+        height: 50px;
+    }
+
+    .swiper-slide {
+        margin-right: 29px !important;
+    }
+
+    .steps-btns__display {
+        justify-content: center;
+    }
+
+    .margin-lines .firstline {
+        margin-top: 2%;
+    }
+
+    .info-emeralds {
+        margin-top: 6.5%;
+    }
+
+    .info-crystals {
+        margin-top: 6.5%;
+    }
+
+    .crystals-btns__choices button,
+    .btn-style__diamonds button {
+        padding: 4px 13px;
+    }
+
+    .diamond-icon {
+        top: 12px;
+        left: 35px;
+    }
+
+    #diamonds-input {
+        width: 60%;
+    }
+
+    .btns-style__steps button {
+        padding: 6px 9px;
+    }
+
+    .emeralds-bg {
+        top: -23%;
+    }
+
+    .crystals-bg {
+        top: -21%;
+    }
+
+    .card-info img {
+        width: 100%;
+    }
+
+    .circles-1 {
+        top: 110px;
+    }
+
+    .circles-2 {
+        top: 220px;
+    }
+
+    .circles-3 {
+        top: 330px;
+    }
+
+    .circles-4 {
+        top: 440px;
+    }
+}
+
+@media screen and (min-device-width: 1200px) and (max-device-width: 1399px) {
+    .bg-two {
+        left: 300px;
+    }
+
+    .error-block {
+        top: 410px;
+    }
+
+    .saper-game__content {
+        width: auto;
+    }
+
+    .saper-start {
+        width: 30%;
+        height: 510px;
+    }
+
+    .steps-btns__display {
+        justify-content: center;
+    }
+
+    .btns-style__steps button {
+        width: 60px;
+        height: 50px;
+    }
+
+    .swiper-slide {
+        margin-right: 30px !important;
+    }
+
+    .margin-lines .firstline {
+        margin-top: 2%;
+    }
+
+    .square {
+        width: 75px;
+    }
+
+    .img-style-click {
+        left: -15px;
+    }
+
+    .info-emeralds {
+        margin-top: 6.5%;
+    }
+
+    .info-crystals {
+        margin-top: 6.5%;
+    }
+
+    .text-style__subtitle h2 {
+        font-size: 11px;
+    }
+
+    .text-style__comment p {
+        font-size: 11px;
+    }
+
+    .crystals-btns__choices button,
+    .btn-style__diamonds button {
+        padding: 4px 7px;
+    }
+
+    .diamonds-btns__display {
+        margin-left: 3%;
+    }
+
+    .diamond-icon {
+        top: 12px;
+        left: 35px;
+    }
+
+    #diamonds-input {
+        width: 60%;
+    }
+
+    .btns-style__steps button {
+        padding: 6px 4px;
+    }
+
+    .emeralds-bg {
+        top: -24%;
+    }
+
+    .crystals-bg {
+        top: -22%;
+    }
+
+    .card-info img {
+        width: 100%;
+    }
+
+    .circles__content {
+        display: none;
+    }
+}
+
+/* /Media */
+
+/* Swiper */
+
+.swiper {
+    user-select: none;
+    width: 100%;
+    height: 100%;
+    margin-top: 18px;
+}
+
+.swiper-slide {
+    text-align: center;
+    font-size: 18px;
+    display: flex;
+    align-items: center;
+}
+
+.swiper-slide img {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.swiper-button-prev:after,
+.swiper-button-next:after {
+    font-size: 30px;
+    color: rgb(210 31 31 / 62%);
+}
+
+/* /Swiper */

luckydiamond/src/assets/css/PagesStyles/home.css

@@ -37,6 +37,7 @@
     text-transform: uppercase;
 }
 
+
 @keyframes RaindowAnimate {
     from {
         color: #6EEB21;
@@ -69,7 +70,7 @@
 /* GameMode */
 
 .gamemode__content--text h2 {
-    margin: 2% 0 .5% 10%;
+    margin: 1.2% 0 .5% 8%;
     text-transform: uppercase;
     color: #FFF;
     text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
@@ -79,22 +80,30 @@
 }
 
 .gamemode__content--text div {
-    width: 80%;
-    margin: 0 auto;
+    width: 82%;
+    margin-left: 8%;
     border: 1px solid #fff;
 }
 
 .gamemode__content--card {
     display: flex;
-    margin-top: 1.8%;
+    margin-top: 1.2%;
 }
 
 .bg-card {
+   
     border-radius: 40px;
     background: #EF4444;
     box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
 }
 
+.bg-early{
+    border-radius: 40px;
+    background: #EF4444;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    height: 21.5vh;
+}
+
 .gamemode__main {
     width: 32%;
     height: 100%;
@@ -117,21 +126,38 @@
     color: #fff;
     text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
     font-family: Montserrat Alternates;
-    font-size: 91px;
+    font-size:91px;
     font-weight: 700;
     text-transform: uppercase;
     text-align: center;
 }
 
+.title-jackpot {
+    color: #fff;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size:80px;
+    font-weight: 700;
+    text-transform: uppercase;
+    text-align: center;
+    padding: 0px 0px 0px 28px;
+}
+
 .line__footer {
     display: flex;
     justify-content: center;
     align-items: center;
-    padding-top: 12%;
+    padding-top: 5.5%;
+}
+
+.line__content .line__btn--main .line__btn {
+    top: 2.5em;
+    left: -2em;
+    width: 100%;
 }
 
 .line__footer img {
-    width: 60%;
+    margin-bottom: 5%;
 }
 
 .gamemode__lines {
@@ -146,10 +172,42 @@
 }
 
 .line__img {
-    float: right;
+    display: flex;
     margin:  1% 6.6% 1% 4.7%;
 }
 
+.line__img__jackpot {
+    display: flex;
+    margin:  1% 6.6% 1% 0%;
+}
+
+.display-firstline {
+    display: flex;
+}
+
+.cumming_soon_btn {
+    border-radius: 21px;
+    background: #FFF;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    color: #000;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 36px;
+    font-weight: 700;
+    padding: 11px 0px 11px 11px;
+    text-decoration: none;
+    text-transform: uppercase;
+    position: relative;
+    bottom: 5%;
+    left: 2%;
+    transition: 250ms;
+    cursor: default;
+}
+
+.cumming_soon_btn:hover {
+    background-color: #525252;
+    opacity: 0.75;
+}
 
 .line__btn {
     border-radius: 21px;
@@ -160,17 +218,174 @@
     font-family: Montserrat Alternates;
     font-size: 36px;
     font-weight: 700;
-    padding: 11px 11px;
+    padding: 11px 0px 11px 11px;
     text-decoration: none;
     text-transform: uppercase;
     position: relative;
     bottom: 5%;
     left: 2%;
+    transition: 250ms;
 }
 
+.line__btn span:after {
+    content: '\00bb';
+    opacity: 0;
+    transition: 250ms;
+    right: 20;
+  }
+
+.line__btn:hover span:after {
+    opacity: 1;
+    right: 0;
+    padding-right: 0px;
+  }
+
+.line__btn:hover {
+    padding:11px 11px 11px 22px ;
+  }
+
+.line__btn:active {
+    left: 5%;
+  }
+
+.line__btn--crash {
+    border-radius: 21px;
+    background: #FFF;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    color: #000;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 36px;
+    font-weight: 700;
+    padding: 11px 0px 11px 11px;
+    text-decoration: none;
+    text-transform: uppercase;
+    position: relative;
+    bottom: 5%;
+    left: 2%;
+    transition: 250ms;  
+    height: 7vh; 
+    
+}
+
+
+.line__btn--doubl {
+    border-radius: 21px;
+    background: #FFF;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    color: #000;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 36px;
+    font-weight: 700;
+    padding: 11px 0px 11px 11px;
+    text-decoration: none;
+    text-transform: uppercase;
+    position: relative;
+    bottom: 5%;
+    left: 2%;
+    height: 7.4vh;
+    width: 16vh;
+    transition: 250ms;   
+}
+
+.line__btn--crash span:after {
+    content: '\00bb';
+    opacity: 0;
+    transition: 250ms;
+    right: 20;
+    
+  }
+
+.line__btn--crash:hover span:after {
+    opacity: 1;
+    right: 0;
+    padding-right: 0px;
+  }
+
+.line__btn--crash:hover {
+    padding:11px 11px 11px 22px ;
+  }
+
+.line__btn--crash:active {
+    left: 2%;
+  }
+  .line__btn--doubl span:after {
+    content: '\00bb';
+    opacity: 0;
+    transition: 250ms;
+    right: 0;
+  }
+
+.line__btn--doubl:hover span:after {
+    opacity: 1;
+    right: 0;
+    padding-right: 0px;
+  }
+
+.line__btn--doubl:hover {
+    padding:11px 11px 11px 22px ;
+    width: 20vh;
+  }
+
+.line__btn--doubl-:active {
+    left: 2%;
+  }
+
+.line__btn__jackpot {
+    border-radius: 21px;
+    background: #FFF;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    color: #000;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 36px;
+    font-weight: 700;
+    padding: 11px 0px 11px 11px;
+    text-decoration: none;
+    text-transform: uppercase;
+    position: relative;
+    bottom: 4%;
+    left: 6%;
+    transition: 250ms;
+}
+
+.line__btn__jackpot span:after {
+    content: '\00bb';
+    opacity: 0;
+    transition: 250ms;
+  }
+
+.line__btn__jackpot:hover span:after {
+    opacity: 1;
+    right: 0;
+    padding-right: 0px;
+  }
+
+.line__btn__jackpot:hover {
+    padding:11px 11px 11px 22px ;
+  }
+
+  .line__btn__jackpot:active {
+    left: 10%;
+  }
+
 .line__btn--elm {
     color: #000;
-    font-size: 38px;
+    font-size: 38px ;
+    
+}
+
+.line__btn--elm--saper {
+    color: #000;
+    font-size: 4vh !important;
+}
+
+@media (max-width: 1590px) {
+    .line__btn--elm--saper {
+        font-size: 2vh !important;
+        display: none;
+    }
 }
 
 .linecontent-2 {
@@ -190,8 +405,8 @@
 
 .gamemode__twoline--first__element {
     width: 100%;
-    margin: 3% 3.6% 0 5.5%;
-    min-height: 180px;
+    margin: 2% 3.6% 0 5.5%;
+    min-height: 209px;
 }
 
 .linecontent-3 {
@@ -204,35 +419,233 @@
     color: #fff;
     text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
     font-family: Montserrat Alternates;
-    font-size: 87px;
+    font-size: 60px;
     font-weight: 700;
     text-transform: uppercase;
+    padding: 4.5% 2.2%;
+}
+
+
+
+.gamemode__twoline--two__element {
+    margin-top: 2%;
+    width: 100%;
+    min-height: 180px;
+    height:22.3vh ;
+    
+}
+.container {}
+.gamemode__twoline--two__element .container {
+    display: flex;
+    justify-content: center;
+    
+   
+   
+}
+.linecontent-4 {
+    
+}
+.iconsGame {
+    bottom:  20px;
+    height: 20vh;
+}
+.ButtonPlayDouble {
+    width: 20vh;
+    margin-top: 1.6vh;
+}
+.gamemode__twoline--two__element .container a {
+    margin-right: 10%;
+}
+
+.cumming_soon--img {
+    margin-bottom: 4%;
+}
+.gamemode__twoline--two__element {
+    margin-top: 2%;
+    width: 100%;
+    min-height: 180px;
 }
 
 .gamemode__twoline--first__element .container {
     display: flex;
     justify-content: center;
-    align-items: center;
+    
 }
 
 .gamemode__twoline--first__element .container a {
     margin-right: 10%;
-    padding: 12px 10px;
-}
-
-.gamemode__twoline--two__element {
-    margin-top: 3%;
-    width: 100%;
-    min-height: 180px;
-}
-
-.gamemode__twoline--two__element .container {
-    display: flex;
-    justify-content: center;
-}
-
-.gamemode__twoline--two__element .container a {
-    margin-right: 10%;
 }
 
 /* /GameMode */
+
+/* Media */
+
+@media only screen and (max-width:1800px) {
+    .line__img__jackpot {
+        width: 150px;
+        height: 150px;
+    }
+
+    .line__footer img {
+        width: 55%;
+        margin-bottom: 5%;
+    }
+}
+
+@media only screen and (max-width:1700px) {
+    .title-jackpot {
+        font-size:60px;
+        padding: 0px 0px 0px 28px;
+    }
+
+    .title-twoline {
+        font-size: 40px;
+    }
+
+    .line__img__jackpot {
+        height: 150px;
+        width: 150px;
+    }
+
+    .line__footer img {
+        width: 40%;
+        margin-bottom: 5%;
+    }
+
+    .line__content {
+        width: 100%;
+        height: 100%;
+    }
+
+    .line__btn {
+        border-radius: 16px;
+        font-size: 30px;
+        padding: 11px 11px 11px 11px;
+    }
+
+    .main__content h1 {
+        font-size: 70px;
+    }
+
+    .title-firstline {
+        font-size:80px;
+    }
+
+    .cumming_soon_btn {
+        font-size: 30px;
+        border-radius: 16px;
+    }
+
+    .cumming_soon--img {
+        height: 40px;
+        width: 80px;
+    }
+
+    
+
+    .line__btn__jackpot {
+        border-radius: 16px;
+        font-size: 30px;
+    }
+
+    .line__btn--crash {
+        border-radius: 16px;
+        font-size: 30px;
+        padding: 7px 0px 11px 11px;
+    }
+
+    .crash--img {
+        height: 128px;
+        width: 128px;
+    }
+
+    .line__content {
+        height: 354px;
+    }
+}
+
+@media only screen and (max-width:1300px) {
+    .title-jackpot {
+        font-size:40px;
+        padding: 0px 0px 0px 28px;
+    }
+
+    .title-twoline {
+        font-size: 20px;
+    }
+
+    .line__img__jackpot {
+        height: 125px;
+        width: 125px;
+    }
+
+    .line__footer img {
+        width: 40%;
+        margin-bottom: 5%;
+    }
+
+    .line__content {
+        width: 100%;
+        height: 100%;
+    }
+
+    .line__btn {
+        border-radius: 10px;
+        font-size: 20px;
+        padding: 11px 11px 11px 11px;
+    }
+
+    .main__content h1 {
+        font-size: 40px;
+    }
+
+    .title-firstline {
+        font-size:60px;
+    }
+
+    .cumming_soon_btn {
+        font-size: 20px;
+        border-radius: 10px;
+        height: 50px;
+    }
+
+    .cumming_soon--img {
+        height: 40px;
+        width: 80px;
+    }
+
+    
+
+    .line__btn__jackpot {
+        border-radius: 10px;
+        font-size: 20px;
+    }
+
+    .line__btn--crash {
+        border-radius: 10px;
+        font-size: 20px;
+        padding: 0px 0px 0px 16px;
+    }
+
+    .crash--img {
+        height: 50px;
+        width: 50px;
+    }
+
+    .line__content {
+        height: 265px;
+    }
+
+    
+
+    .gamemode__twoline--two__element {
+        margin-top: 0;
+        width: 100%;
+        min-height: 60px;
+    }
+    .gamemode__twoline--first__element {
+        margin-top: 0;
+        width: 100%;
+        min-height: 60px;
+    }
+}

luckydiamond/src/assets/css/PagesStyles/jackpot-history.css

@@ -0,0 +1,67 @@
+.jackpot-history__content {
+    display: flex;
+    max-height: 800px;
+    overflow-y: auto;
+    margin: 0 auto;
+}
+
+.jackpot-history__element {
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+    margin: 15px;
+}
+
+.abc {
+
+}
+
+.element-info {
+    display: flex;
+    align-items: center;
+}
+
+.element-info .element-info__icon img {
+    height: 50px;
+}
+
+.element-info .element-info__user-info {
+    margin-left: 4px;
+}
+
+.element-info .element-info__user-info .username {
+    color: #515D83;
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-size: 20px;
+}
+
+.element-info .element-info__user-info .user-deposit {
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-size: 20px;
+
+}
+
+.element-info .element-info__user-info .img-width img {
+    width: 16px;
+    height: 16px;
+}
+
+.element-chance {
+    margin-top: 10px;
+}
+
+.element-chance h2 {
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-size: 18px;
+    text-align: center;
+    background: #27345C;
+    border-radius: 7px;
+}
+
+.element-chance .chance-style {
+    color: #EF4444;
+    margin-left: 2px;
+}

luckydiamond/src/assets/css/PagesStyles/profile.css

@@ -0,0 +1,411 @@
+.profile__content {
+    width: 30%;
+    margin-left: 3%;
+}
+.profile__content .profile__user--img {
+    margin: 17.6% 8.4% 1% 0;
+    background: #969C8D;
+    padding-top: 10px;
+    border-radius: 20px;
+}
+
+.profile__card {
+    display: flex;
+    flex-direction: column;
+}.hisorypaymond {
+     /* height: 590px; */
+     height: 70vh;
+     width: auto;
+     overflow-y: auto;
+     overflow-x: auto;
+     overflow-y: auto;
+}
+.profile__card h1 {
+    color: #FFF;
+    font-weight: 700;
+    font-family: Montserrat;
+    font-size: 40px;
+}
+.profile__card h2 {
+    border-radius: 20px;
+    background: #22252F;
+    width: 60%;
+    height: 60px;
+    display: flex;
+    align-items: center;
+    color: #FFF;
+    font-weight: 700;
+    font-family: Montserrat Alternates;
+    font-size: 28px;
+    padding-left: 11px;
+}
+.profile__card h2 img {
+    margin-right: 4.4%;
+}
+.profile__btns--payments {
+    margin-top: 7.9%;
+    display: flex;
+    flex-direction: column;
+}
+.icon-diamond h2 img {
+    width: 33px;
+    height: 33px;
+}
+.deposit-icon {
+    margin: 3px 0 0 10px;
+}
+.withdraw-icon {
+    margin-left: 33px;
+}
+.btn-bg {
+    border-radius: 10px;
+    background: rgba(255, 255, 255, 0.12);
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    width: 36%;
+}
+.btn-margin {
+    padding: 3.8% 46% 3% 14%;
+    margin-bottom: 11px;
+    background: #62D4B2;
+}
+.btn-display {
+    display: flex;
+}
+.text-btn {
+    text-decoration: none;
+    color: #000;
+    font-weight: 700;
+    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+    font-family: Montserrat Alternates;
+    font-size: 18px;
+    margin-left: 4px;
+}
+.icon-margin-deposit-withdraw {
+    margin-right: 4px;
+}
+.withdraw {
+    padding: 3.8% 46% 3% 14%;
+    background: #EF4444;
+}
+
+.referal {
+    padding: 3.8% 46% 3% 14%;
+    margin-top: 12px;
+    background: #2D6AE0;
+}
+
+.referal img {
+    height: 20px;
+    width: 22px;
+}
+
+.playerandvid {
+    margin-right: 10vh;
+}
+.data1 {
+    margin-right: 20vh;
+}
+.summa {
+    margin-right: 10vh;
+}
+
+.payments {
+    margin: 2% 0 0 -4.25%;
+}
+
+.types {
+    display: flex;
+    
+
+}
+
+.types-margin h3 {
+    margin-right: 7.813em;
+    
+}
+.types-text h3 {
+    color: #ABABB4;
+    font-weight: 600;
+    font-family: Montserrat;
+    font-size: 14px;
+}
+.types-line {
+    flex-grow: 1; /* Add this line */
+    margin-top: 2.1%;
+    background: #38383E;
+    height: 3px;
+    width: 100vh;
+}
+.payments__card {
+    margin-top: 4.9%;
+    display: flex;
+    align-items: center; /* Center vertically */
+    justify-content: space-between;
+}
+
+.user-info {
+    display: flex;
+    align-items: center; /* Center vertically */
+    margin-right: 1em; /* Add margin for spacing */
+    width: 15vh;
+}
+.user-name {
+    display: flex;
+    flex-direction: column;
+    margin-left: 0.625em;
+    align-items: center; /* Center horizontally */
+    margin-top: -0.5em; /* Adjust this value as needed */
+}
+.user-name__text h3 {
+    color: #FFF;
+    font-weight: 700;
+    font-family: Montserrat;
+    font-size: 20px;
+}
+
+.user-name1 {
+    display: flex;
+    flex-direction: column;
+    margin-left: 0.625em;
+    align-items: center; /* Center horizontally */
+    margin-top: -0.5em; /* Adjust this value as needed */
+}
+.user-name1__text h3 {
+    color: #FFF;
+    font-weight: 700;
+    font-family: Montserrat;
+    font-size: 20px;
+}
+.user-name__text p {
+    color: #A9A9A9;
+    font-weight: 400;
+    font-family: Montserrat;
+    font-size: 20px;
+}
+.data-info {
+    margin-left: 20vh; /* Push to the right */
+    margin-right: auto; /* Push to the left */
+}
+.data-info__text h3 {
+    color: #A9A9A9;
+    font-weight: 400;
+    font-family: Montserrat;
+    font-size: 17px;
+   
+}
+
+.transaction-info {
+    margin-right: 10em; /* Add margin for spacing */
+    margin-right: 6em; /* Add margin for spacing */
+    display: flex;
+    justify-content: center;
+    align-content: center;
+    width: 1vh;
+    margin-right: 13.5vh;
+}
+.transaction-info__text {
+    display: flex;
+    justify-content: center;
+    align-content: center;
+    width: 13vh;
+}
+
+.transaction-info__text h3 {
+    font-weight: 500;
+    font-family: Montserrat;
+    font-size: 22px;
+}
+.deposit-color h3 {
+    color: #32C966;
+}
+.withdraw-color h3 {
+    color: #EA3D38;
+    margin-right: 1vh;
+}
+.withdraw-color1 {
+    margin-left: 1.35em;
+}
+.error-deposit {
+    position: absolute;
+    left: 190px;
+    top: 52px;
+}
+.error-deposit h2 {
+    color: #BA3636;
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-size: 11px;
+}
+.error-card {
+    position: absolute;
+    top: 130px;
+    left: 210px;
+}
+.error-card h2 {
+    color: #BA3636;
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-size: 11px;
+}
+.error-checkbox h2 {
+    color: #BA3636;
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-size: 11px;
+}
+.error-captcha {
+    top: 235px;
+    left: 45px;
+    position: absolute;
+}
+.error-captcha h2 {
+    color: #BA3636;
+    font-family: "Montserrat Alternates";
+    font-weight: 700;
+    font-size: 13px;
+}
+/* Media */
+@media screen and (min-device-width: 1400px) and (max-device-width: 1600px) {
+    .profile__card h2 {
+        width: 72%;
+    }
+    .btn-margin {
+        padding-right: 56%;
+    }
+    .withdraw {
+        padding-right: 56%;
+    }
+    .withdraw-color h3 {
+        color: #EA3D38;
+        margin-right: 1vh;
+    }
+    .transaction-info {
+        margin-right: 10em; /* Add margin for spacing */
+        margin-right: 6em; /* Add margin for spacing */
+        display: flex;
+        justify-content: center;
+        align-content: center;
+        width: 1vh;
+        margin-right: 8.5vh;
+    }
+    .transaction-info__text {
+        display: flex;
+        justify-content: center;
+        align-content: center;
+        width: 13vh;
+    }
+    .user-name {
+        display: flex;
+        flex-direction: column;
+        margin-left: 0.625em;
+        align-items: center; /* Center horizontally */
+        margin-top: -0.5em; /* Adjust this value as needed */
+    }
+    .user-name__text h3 {
+        color: #FFF;
+        font-weight: 700;
+        font-family: Montserrat;
+        font-size: 20px;
+    }
+    .user-name1 {
+        display: flex;
+        flex-direction: column;
+        margin-left: 0.625em;
+        align-items: center; /* Center horizontally */
+        margin-top: -0.5em; /* Adjust this value as needed */
+    }
+    .user-name1__text h3 {
+        color: #FFF;
+        font-weight: 700;
+        font-family: Montserrat;
+        font-size: 20px;
+    }
+    .data-info {
+        margin-left: 22.5vh; /* Push to the right */
+        margin-right: auto; /* Push to the left */
+    }
+    .data-info__text h3 {
+        color: #A9A9A9;
+        font-weight: 400;
+        font-family: Montserrat;
+        font-size: 17px;
+       
+    }
+    .withdraw-color1 {
+        margin-left: 1.35em;
+    }
+}
+@media screen and (min-device-width: 1200px) and (max-device-width: 1399px) {
+    .profile__card h2 {
+        width: 80%;
+    }
+    .btn-margin {
+        padding-right: 66%;
+    }
+    .withdraw {
+        padding-right: 66%;
+    }
+    
+}
+@media screen and (min-device-width: 1921px) {
+    .withdraw-color h3 {
+        color: #EA3D38;
+        margin-right: 1vh;
+    }
+    .transaction-info {
+        margin-right: 10em; /* Add margin for spacing */
+        margin-right: 6em; /* Add margin for spacing */
+        display: flex;
+        justify-content: center;
+        align-content: center;
+        width: 1vh;
+        margin-right: 20vh;
+    }
+    .transaction-info__text {
+        display: flex;
+        justify-content: center;
+        align-content: center;
+        width: 13vh;
+    }
+    .user-name {
+        display: flex;
+        flex-direction: column;
+        margin-left: 0.625em;
+        align-items: center; /* Center horizontally */
+        margin-top: -0.5em; /* Adjust this value as needed */
+    }
+    .user-name__text h3 {
+        color: #FFF;
+        font-weight: 700;
+        font-family: Montserrat;
+        font-size: 20px;
+    }
+    .user-name1 {
+        display: flex;
+        flex-direction: column;
+        margin-left: 0.625em;
+        align-items: center; /* Center horizontally */
+        margin-top: -0.5em; /* Adjust this value as needed */
+    }
+    .user-name1__text h3 {
+        color: #FFF;
+        font-weight: 700;
+        font-family: Montserrat;
+        font-size: 20px;
+    }
+    .data-info {
+        margin-left: 17vh; /* Push to the right */
+        margin-right: auto; /* Push to the left */
+    }
+    .data-info__text h3 {
+        color: #A9A9A9;
+        font-weight: 400;
+        font-family: Montserrat;
+        font-size: 17px;
+       
+    }
+    .withdraw-color1 {
+        margin-left: 1.35em;
+    }
+}
+/* /Media */

luckydiamond/src/assets/css/PagesStyles/settings.css

@@ -0,0 +1,131 @@
+.settings {
+    /* display: flex; */
+    grid-area: profile;
+    /* height: 86vh; */
+    /* width: 86vh; */
+
+    border-radius: 50px;
+    background: #17181C;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    margin: 10px 39px 18px 13px;
+}
+
+#volume-control {
+  margin: 5vh;
+    /* display: flex; */
+    /* align-items: center; */
+    /* top: 0; 
+    left: 0; */
+    
+    /* z-index: 1000; */
+  }
+  .volume-section{
+  margin: 5vh;
+  }
+  .volume-text{
+
+    text-decoration: none;
+    font-family: Montserrat Alternates;
+    font-weight: 700;
+    font-size: 25px;
+  }
+  .volume-text--grey{
+
+    text-decoration: none;
+    font-family: Montserrat Alternates;
+    font-weight: 700;
+    font-size: 25px;
+    color: #3D3F48;
+  }
+
+/* Стилизация трека ползунка */
+#volumeControl {
+  -webkit-appearance: none; /* Убирает стандартный стиль для Webkit браузеров */
+  width: 40vh;
+
+  height: 8px; /* Можно изменить для изменения высоты трека */
+  background: #EF4444; /* Цвет фона трека */
+  outline: none; /* Убирает контур при выборе */
+  opacity: 1; /* Можно изменить для изменения прозрачности трека */
+  -webkit-transition: .2s; /* Плавное изменение для Webkit браузеров */
+  transition: opacity .2s;
+  border-radius: 10px;
+}
+
+/* Стилизация тумблера ползунка */
+#volumeControl::-webkit-slider-thumb {
+  -webkit-appearance: none; /* Убирает стандартный стиль для Webkit браузеров */
+  appearance: none;
+  width: 15px; /* Ширина тумблера */
+  height: 15px; /* Высота тумблера */
+  background: #fff; /* Цвет фона тумблера */
+  cursor: pointer; /* Курсор в виде указателя */
+  border-radius: 60%; /* Круглый тумблер */
+}
+
+#volumeControl::-moz-range-thumb {
+  width: 25px; /* Ширина тумблера */
+  height: 25px; /* Высота тумблера */
+  background: #fff; /* Цвет фона тумблера */
+  cursor: pointer; /* Курсор в виде указателя */
+  border-radius: 50%; /* Круглый тумблер */
+  border: 2px solid red; /* Граница тумблера */
+}
+
+#volumeControl::-moz-range-track {
+  background: red; /* Цвет фона трека для Firefox */
+  height: 8px; /* Высота трека для Firefox */
+}
+
+
+     
+/* toggle in label designing */
+.toggle {
+  position : relative ;
+  display : flex;
+  width : 60px;
+  height : 32px;
+  background-color: #000413;
+  border-radius: 5px;
+  justify-content: center;
+ align-items: center;
+ 
+  
+}
+     
+/* After slide changes */
+.toggle:after {
+  content: '';
+  position: absolute;
+  width: 22px;
+  height: 22px;
+  border-radius: 5px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ align-content: center;
+  background-color: #EF4444;
+  top: 5px; 
+  left: 6px;
+  transition:  all 0.5s;
+}
+     
+/* Toggle text */
+.toggle p {
+  font-family: Arial, Helvetica, sans-serif;
+  font-weight: bold;
+}
+     
+/* Checkbox checked effect */
+.checkbox:checked + .toggle::after {
+  
+  left : 34px; 
+}
+     
+/* Checkbox checked toggle label bg color */
+
+     
+/* Checkbox vanished */
+.checkbox { 
+  display : none;
+}

luckydiamond/src/assets/css/global.css

@@ -11,20 +11,39 @@ ul {
     list-style: none;
 }
 
-body, html {
+body,
+html {
     background: #121212;
     height: 100%;
     margin: 0;
     overflow-y: hidden;
 }
 
+input[type="number"] {
+    -moz-appearance: textfield;
+}
+
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+}
+
+button:focus {
+    outline: none;
+}
+
+button {
+    cursor: pointer;
+}
+
 /* /Global Settings */
 
 /* Content Grid */
 
 .content-grid {
     display: grid;
-    grid-template-columns: .35fr repeat(5, 1fr) 1.2fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
     grid-template-rows: auto 0fr repeat(4, 1fr);
     grid-auto-columns: 1fr;
     grid-auto-flow: row;
@@ -36,9 +55,108 @@ body, html {
         "menu gamemode gamemode gamemode gamemode gamemode chat"
         "menu gamemode gamemode gamemode gamemode gamemode chat";
     height: 100%;
-    grid-gap: 10px;
+    grid-gap: 0.625rem;
 }
 
+.content__grid-profile {
+    display: grid;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-auto-columns: 1fr;
+    grid-auto-flow: row;
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu profile profile profile profile profile chat"
+        "menu profile profile profile profile profile chat"
+        "menu profile profile profile profile profile chat"
+        "menu profile profile profile profile profile chat"
+        "menu profile profile profile profile profile chat"
+        "menu profile profile profile profile profile chat"
+        "menu profile profile profile profile profile chat";
+    grid-gap: 0.625rem;
+    height: 100%;
+}
+
+.content-grid--saper {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu saper saper saper saper saper chat"
+        "menu saper saper saper saper saper chat"
+        "menu saper saper saper saper saper chat"
+        "menu saper saper saper saper saper chat"
+        "menu saper saper saper saper saper chat"
+        "menu saper saper saper saper saper chat";
+    grid-gap: 0.625rem;
+}
+
+.content-grid--jackpot {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu jackpot jackpot jackpot jackpot jackpot chat"
+        "menu jackpot jackpot jackpot jackpot jackpot chat"
+        "menu jackpot jackpot jackpot jackpot jackpot chat"
+        "menu jackpot jackpot jackpot jackpot jackpot chat"
+        "menu jackpot jackpot jackpot jackpot jackpot chat"
+        "menu jackpot jackpot jackpot jackpot jackpot chat";
+    grid-gap: 0.625rem;
+}
+
+.content-grid--double {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu double double double double double chat"
+        "menu double double double double double chat"
+        "menu double double double double double chat"
+        "menu double double double double double chat"
+        "menu double double double double double chat"
+        "menu double double double double double chat";
+    grid-gap: 0.625rem;
+}
+
+.jackpot-history__content-grid {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
+        "menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat";
+    grid-gap: 0.625rem;
+}
+
+.grid-crash {
+    display: grid;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-auto-columns: 1fr;
+    gap: 0.625rem;
+    grid-auto-flow: row;
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu crash crash crash crash crash chat"
+        "menu crash crash crash crash crash chat"
+        "menu crash crash crash crash crash chat"
+        "menu crash crash crash crash crash chat"
+        "menu crash crash crash crash crash chat"
+        "menu crash crash crash crash crash chat";
+}
 
 /* /Content Grid */
 
@@ -46,9 +164,9 @@ body, html {
 
 .header {
     grid-area: header;
-    border-radius: 20px;
+    border-radius: 1.25rem;
     background: #17181C;
-    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    box-shadow: 0px 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25);
     align-self: start;
 }
 
@@ -59,8 +177,8 @@ body, html {
 .menu {
     grid-area: menu;
     background: #17181C;
-    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
-    border-radius: 20px;
+    box-shadow: 0px 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25);
+    border-radius: 1.25rem;
     align-self: start;
 }
 
@@ -71,11 +189,13 @@ body, html {
 .chat {
     grid-area: chat;
     background: #16171B;
-    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
-    border-radius: 20px;
-    height: 90%;
+    filter: drop-shadow(0px 0.25rem 0.25rem rgba(0, 0, 0, 0.25));
+    border-radius: 15px;
+    /* height: 100%; */
+    height: 86vh;
     position: relative;
     z-index: 3;
+
 }
 
 /* /Chat */
@@ -84,9 +204,9 @@ body, html {
 
 .main {
     grid-area: main;
-    width: 80%;
+    width: 82%;
     height: 90%;
-    margin: 2.7% auto 0;
+    margin: 2% auto 0 8%;
 }
 
 /* /Main */
@@ -100,3 +220,148 @@ body, html {
 }
 
 /* /GameMode */
+
+/* Profile */
+
+.profile {
+    display: flex;
+    grid-area: profile;
+    height: 95%;
+    border-radius: 3.125rem;
+    background: #17181C;
+    box-shadow: 0.25rem 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25);
+    margin: 0.625rem 2.438rem 1.125rem 1.125rem;
+}
+
+.jackpot {
+    display: flex;
+    grid-area: jackpot;
+    /* height: 95%;
+    border-radius: 3.125rem;
+    background: #17181C;
+    box-shadow: 0.25rem 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25);
+    margin: 0.625rem 2.438rem 1.125rem 1.125rem; */
+}
+
+.jackpot-history {
+    grid-area: jackpot-history;
+    background: #17181C;
+    border-radius: 20px;
+    height: 97%;
+}
+
+.double {
+    display: flex;
+    grid-area: double;
+   
+}
+
+.about {
+    grid-area: about;
+
+}
+
+
+/* /Profile */
+
+/* Saper */
+
+.saper {
+    grid-area: saper;
+    /*height: 96.2%;*/
+}
+
+/* /Saper */
+
+/* Crash */
+
+.crash-content {
+    grid-area: crash;
+}
+
+.crash-game {
+    grid-area: crashgame;
+}
+
+.crash-game__players {
+    grid-area: crashplayers;
+}
+
+
+.content-grid--about {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu about about about about about chat"
+        "menu about about about about about chat"
+        "menu about about about about about chat"
+        "menu about about about about about chat"
+        "menu about about about about about chat"
+        "menu about about about about about chat";
+    grid-gap: 0.625rem;
+}
+
+.content-grid--help {
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
+    grid-template-rows: auto 0fr repeat(4, 1fr);
+    grid-template-areas:
+        "menu header header header header header header"
+        "menu help help help help help chat"
+        "menu help help help help help chat"
+        "menu help help help help help chat"
+        "menu help help help help help chat"
+        "menu help help help help help chat"
+        "menu help help help help help chat";
+    grid-gap: 0.625rem;
+}
+
+.help {
+    grid-area: help;
+    display: flex;
+    /* height:99%; */
+    height: 86vh;
+    border-radius: 3.125rem;
+    background: #17181C;
+    box-shadow: 0.25rem 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25);
+    margin: 0.625rem 2.438rem 1.125rem 1.125rem;
+    /*height: 96.2%;*/
+    width: 1000px;
+    margin: 0 auto;
+
+}
+
+
+.bg-gradient-left {
+    background: #293561;
+    filter: blur(120px);
+    position: absolute;
+    top: 250px;
+    transform: rotate(180deg);
+    left: 200px;
+    width: 40%;
+    height: 55%;
+    z-index: 0;
+}
+
+.bg-two-gradient-right {
+    background: #293561;
+    filter: blur(120px);
+    position: absolute;
+    top: 220px;
+    transform: rotate(330deg);
+    left: 600px;
+    width: 60%;
+    height: 35%;
+    z-index: 0;
+}
+
+/* /Crash */
+
+/* Media */
+
+/* /Media */

luckydiamond/src/assets/icons-adaptive/home-adaptive/icon-wallet-menu.svg

@@ -0,0 +1,3 @@
+<svg width="45" height="45" viewBox="0 0 45 45" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path id="Vector" d="M40.5352 9.64286H7.03125C6.25781 9.64286 5.625 8.91964 5.625 8.03571C5.625 7.15179 6.25781 6.42857 7.03125 6.42857H40.7812C41.5547 6.42857 42.1875 5.70536 42.1875 4.82143C42.1875 2.1596 40.2979 0 37.9688 0H5.625C2.52246 0 0 2.88281 0 6.42857V38.5714C0 42.1272 2.52246 45 5.625 45H40.5352C42.9961 45 45 42.8404 45 40.1786V14.4643C45 11.8025 42.9961 9.64286 40.5352 9.64286ZM36.5625 30.5357C35.0068 30.5357 33.75 29.0993 33.75 27.3214C33.75 25.5435 35.0068 24.1071 36.5625 24.1071C38.1182 24.1071 39.375 25.5435 39.375 27.3214C39.375 29.0993 38.1182 30.5357 36.5625 30.5357Z" fill="white"/>
+</svg>

luckydiamond/src/assets/icons-adaptive/home-adaptive/icon-wallet.svg

@@ -0,0 +1,3 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path id="Vector" d="M36.0312 8.57143H6.25C5.5625 8.57143 5 7.92857 5 7.14286C5 6.35714 5.5625 5.71429 6.25 5.71429H36.25C36.9375 5.71429 37.5 5.07143 37.5 4.28571C37.5 1.91964 35.8203 0 33.75 0H5C2.24219 0 0 2.5625 0 5.71429V34.2857C0 37.4464 2.24219 40 5 40H36.0312C38.2188 40 40 38.0804 40 35.7143V12.8571C40 10.4911 38.2188 8.57143 36.0312 8.57143ZM32.5 27.1429C31.1172 27.1429 30 25.8661 30 24.2857C30 22.7054 31.1172 21.4286 32.5 21.4286C33.8828 21.4286 35 22.7054 35 24.2857C35 25.8661 33.8828 27.1429 32.5 27.1429Z" fill="white"/>
+</svg>

luckydiamond/src/assets/icons-games/double-game/info.svg

@@ -0,0 +1,9 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect width="20" height="20" fill="url(#pattern0_3764_2)"/>
+<defs>
+<pattern id="pattern0_3764_2" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_3764_2" transform="scale(0.0078125)"/>
+</pattern>
+<image id="image0_3764_2" width="128" height="128" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAACXBIWXMAAAsTAAALEwEAmpwYAAAHQklEQVR4nO1dS2xUVRhGBd8PLOLbrdG1iRtfRJuIBjRGgRgT1iaQYEw0gYXdYowLN0pBUUBdzKrOq7czNePCB9YRxYIuXbQ+VghLoFK/b3ponHY6M525Z/7/3PN/yZdBLNP7f9937z33nHPPWbPGYDAYDAaDwWAwGAwGg8FgMBgyg4mJiRuSJLkPfAB/fmh8fHwYfN5xmH/H/8ef4c9KH6+hR8DAIRj4DEx9HRzFf9fAv8D5VfJP928P8Lv4nfxu6foMS8Cz1Z3N+8E6TPq3B7O7Jb/7NIMFbqvVauul648SuVzuOhjwMswo4fOiR8PbEr/7Aj6L4A6E4VppXTIPnO2PQ/SPIPg5KdPbhOEsPg/h8zFpnTKF+fn5K2D8Vgh7XNrkVYThJ3zuHBkZuVJav2BB8Wg8hPxR2tA+gjDNIOD2sFZaz6AA45+EeL9JG5gi2XDcJK2rehSLxTsh1lGIdUmBaT6uCIVyuXyvtM7qwMs9xNmTKGzceQgBG4u72baR1l0FcEZshCjj0sYIcJJXPGn9RQHzn4D3fygwQ+pq8Dc7saR9GDh4yYcAb4Fz0iZIkx1Z4L5obgl8JELBh6WFV8hj9Xp9nbQ/XuH67csKxNbK6tjY2E3SPnkBihuC+d8oEFk7p/L5/G3SfqUKFoTCTisQNwiyB7FarW6Q9i0VwPzr7czvKQTfo710o7R/fYGNGrvn98VqLpe7WtrHnsDHGpj/iQIRgyY0/CzIUcVk4TlfXMAsECHYK+3nqsAevsQ6edIMwMVgJprgWf/2mLt3PXJG/eOhG9WbUCBWJskGter2gBvSFRcqy4TGu6R9bgkObbqxbnGRMs5z0Pkuab+XAQf2uQJxoiACcETa7yZwDp+0KF3wO77M0Q35swqOt10ALnGKvLTvDeRyuatwQL9Ki9IFc93WxJ9VcLydQjCtokGIg3lFWowYA+BCsN2ntx3hununpYWIOAA/i84kKpfLL0iLEHMASL4849PjTkJNSQsQewA4bOzT4xXBVqh08RaABeJK/KhPr1vCvaUrXrwFoHEVOOjT62Xgu/D4pf9IF24BWAzAWa6Z4NPzJrjFGcQLtwA0hWCbT8+bEOg0r6wHIO/T80WgwXGz5LIsxhUDcGEgk0jxy7ZIF2tckZsHEYB3FRRqbM23BxGAEwoKNbYgbgM/+DZ/KPG7Dp+xP84Vi8VbvQUADcBnFRRpbE9/7QAumaqgQGMbcl6mzwCMShdo7BiA970FAL/gK+kCjR0D8KXPAPSy6rZxsJz1Yj57mRQU1w9nkoUu3m44o+B4eyInjPKV/NQDwAUOpYvrk5keC1gSgvTfG6hUKg9KF2YB6I6lUun+1AOAL35YujALQHfk9jepByCQlz8sAEnjFrAp9QBwcyXpwiwAXQfgOQuABSBd2C0gHHq5BSTWCAyGXhqB9hgYDr08BlpHUDj00hGUga7gKALgrSvYCRPyYFAUAUh8DQY5YUIeDo4iAF6HgwOfEBJLAPxNCAl8SlgsAfA3JcxtoS5epAWgbQCe9haAJOxp4TEEwO+0cCdOqHv5xhCAKZ/eN4BLzDsKCrUAtCC82e/T+wYCfjkkhgD4u/9fBrc146vI0sVaAJbxPLfl8+n9/wUqKijYAtDMMZ+eLxVoh4KCLQDNfNGn502wRaJ0ceCLRDmRDkkXbgFY5AGfXrcENzFSULgFIGnMAHrEp9fthPpWuvjYA4AT8bhPj9sisJnCmQwAuMWnx23BpcpxAL8oECHKAIgvF08EtGpo5gKAe/9LPr3tCtwyJglja/isBeCkii1jCL6IwMmICkRpx0xtGiWyRHw74KA+lRYmIn4s7fcyTE5O3hFg72CIPMP9maX9bgkc3G4FAmWaOMlelfZ5RbhdxPLSImWYJfHHvk5A42QjDnRWgVhZo/7t4y+DG0rZngLpkVqK9ff3Chz0PmnhskJo+aa0n6uGaw8clhYvAzym/r6/Eur1+joUUFIgYpDECVSo1WprpX3sC5ypgkK+lhYzNHKYd2CTPH2jWq1uQFGnpEUNiBxhHZL2LVXwlSW7EnQmz/xgHvdWC65ckYQ5pXxQ5he8re6hBW74+ENpsbUR5h9ho1nan4HAPSLutc6ihU4e8I1gH/X6QbKw9uDv0iYIcia4Hr60wQZPEmFfAe/3fDqS1l8F3C1hVyTzCc5wSDfKS34n8IzgQlQBTC/r5YxnTUfVTubQBDeaOC1tWoo8qW4On3ZwxiuCsJX74SowsFeyR28nH32l9QwaCMFwonym7hKe4Oxiu8+nDF5GIexBpY1FNu5Go3+sGwTc+gTb+SglvFzNefALvqGDcF4jrUuUYN85bxFcIYuDTZ4DMYfvr+PzPV7i8dRyi3T9hiXgqCMM2gy+Bn7AxZOT3iapzrp/y+/YwxW4cOVZL12foUfwSlEoFO7hbhrcUgWX7Kf4ejvJP/Pv+P8qlcrdmR+RMxgMBoPBYDAYDAaDwWAwGAyR4T8v9J98K6ZdvgAAAABJRU5ErkJggg=="/>
+</defs>
+</svg>

luckydiamond/src/assets/icons-games/saper-game/icon-crystall-info-saper.svg

@@ -0,0 +1,92 @@
+<svg width="207" height="204" viewBox="0 0 207 204" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_dd_291_5)">
+<g filter="url(#filter1_d_291_5)">
+<rect x="45.7563" y="68.2073" width="88.9238" height="84.8552" rx="17" transform="rotate(-15 45.7563 68.2073)" stroke="url(#paint0_linear_291_5)" stroke-width="6" shape-rendering="crispEdges"/>
+</g>
+<g filter="url(#filter2_d_291_5)">
+<rect x="1.07377" y="4.00737" width="53.2329" height="53.2329" rx="9" transform="matrix(0.876765 0.480919 -0.518841 0.85487 91.295 58.1855)" stroke="#954DBB" stroke-width="6" shape-rendering="crispEdges"/>
+</g>
+<g filter="url(#filter3_d_291_5)">
+<rect x="-3.03331" y="3.03205" width="64.5948" height="67.324" rx="12" transform="matrix(-0.011161 0.999938 -0.999942 0.0107455 136.702 68.0248)" stroke="#5F277D" stroke-width="6" shape-rendering="crispEdges"/>
+</g>
+<g filter="url(#filter4_d_291_5)">
+<rect x="-1.08514" y="4.05317" width="52.7983" height="55.0715" rx="9" transform="matrix(0.509634 0.860391 -0.871348 0.490665 114.308 60.4024)" stroke="#BE95D4" stroke-width="6" shape-rendering="crispEdges"/>
+</g>
+<g filter="url(#filter5_d_291_5)">
+<rect width="14.6307" height="15.1963" rx="4" transform="matrix(0.509634 0.860391 -0.871348 0.490665 102.576 87.6599)" fill="#FF8D8D"/>
+<rect x="0.904284" y="-3.37764" width="19.6307" height="20.1963" rx="6.5" transform="matrix(0.509634 0.860391 -0.871348 0.490665 100.076 85.1615)" stroke="#CE0624" stroke-width="5"/>
+</g>
+</g>
+<defs>
+<filter id="filter0_dd_291_5" x="0.572021" y="0.0078125" width="206.224" height="203.348" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="4" dy="4"/>
+<feGaussianBlur stdDeviation="25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.372549 0 0 0 0 0.152941 0 0 0 0 0.490196 0 0 0 0.85 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_291_5"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="4" dy="4"/>
+<feGaussianBlur stdDeviation="22.5"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.584314 0 0 0 0 0.301961 0 0 0 0 0.733333 0 0 0 0.3 0"/>
+<feBlend mode="normal" in2="effect1_dropShadow_291_5" result="effect2_dropShadow_291_5"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_291_5" result="shape"/>
+</filter>
+<filter id="filter1_d_291_5" x="42.572" y="46.0078" width="114.224" height="111.348" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_291_5"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_291_5" result="shape"/>
+</filter>
+<filter id="filter2_d_291_5" x="58.8711" y="62.3774" width="81.6257" height="78.6085" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_291_5"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_291_5" result="shape"/>
+</filter>
+<filter id="filter3_d_291_5" x="58.7964" y="62.1525" width="81.7747" height="79.0577" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_291_5"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_291_5" result="shape"/>
+</filter>
+<filter id="filter4_d_291_5" x="58.5505" y="61.7294" width="82.2671" height="79.9052" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_291_5"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_291_5" result="shape"/>
+</filter>
+<filter id="filter5_d_291_5" x="81.7722" y="84.1483" width="35.8225" height="35.0674" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_291_5"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_291_5" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_291_5" x1="89.5439" y1="66.0859" x2="68.5897" y2="154.588" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="#B8B8B8"/>
+</linearGradient>
+</defs>
+</svg>

luckydiamond/src/assets/icons-games/saper-game/icon-crystall-saper.svg

@@ -0,0 +1,82 @@
+<svg width="35" height="35" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="&#208;&#186;&#209;&#128;&#208;&#184;&#209;&#129;&#209;&#130;&#208;&#176;&#208;&#187;">
+<g id="Rectangle 106" filter="url(#filter0_d_1028_3685)">
+<rect y="1.41421" width="18.6091" height="17.9178" rx="3" transform="matrix(0.707107 -0.707107 -0.707107 -0.707107 18.2559 27.4142)" stroke="url(#paint0_linear_1028_3685)" stroke-width="2" shape-rendering="crispEdges"/>
+</g>
+<g id="Rectangle 107" filter="url(#filter1_d_1028_3685)">
+<mask id="path-2-inside-1_1028_3685" fill="white">
+<rect width="10.3706" height="10.3706" rx="1" transform="matrix(0.021246 -0.999774 -0.999774 0.021246 22.574 18.574)"/>
+</mask>
+<rect width="10.3706" height="10.3706" rx="1" transform="matrix(0.021246 -0.999774 -0.999774 0.021246 22.574 18.574)" stroke="#954DBB" stroke-width="4" shape-rendering="crispEdges" mask="url(#path-2-inside-1_1028_3685)"/>
+</g>
+<g id="Rectangle 109" filter="url(#filter2_d_1028_3685)">
+<rect x="1.38039" y="-0.370165" width="12.8778" height="13.2856" rx="2" transform="matrix(-0.871387 -0.490597 -0.509008 0.860762 27.5064 11.937)" stroke="#5F277D" stroke-width="2" shape-rendering="crispEdges"/>
+</g>
+<g id="Rectangle 108" filter="url(#filter3_d_1028_3685)">
+<mask id="path-4-inside-2_1028_3685" fill="white">
+<rect width="7.47011" height="7.75018" rx="1" transform="matrix(-0.490597 -0.871387 -0.860762 0.509008 22.6675 14.7822)"/>
+</mask>
+<rect width="7.47011" height="7.75018" rx="1" transform="matrix(-0.490597 -0.871387 -0.860762 0.509008 22.6675 14.7822)" stroke="#BE95D4" stroke-width="4" shape-rendering="crispEdges" mask="url(#path-4-inside-2_1028_3685)"/>
+</g>
+<g id="Rectangle 110" filter="url(#filter4_d_1028_3685)">
+<rect width="1.11041" height="1.15204" rx="0.3" transform="matrix(-0.490597 -0.871387 -0.860762 0.509008 18.2681 13.6904)" fill="#FF8D8D"/>
+<rect x="0.675679" y="0.181189" width="2.11041" height="2.15204" rx="0.8" transform="matrix(-0.490597 -0.871387 -0.860762 0.509008 19.4312 14.3682)" stroke="#CE0624"/>
+</g>
+</g>
+<defs>
+<filter id="filter0_d_1028_3685" x="0.828613" y="0.828369" width="33.3433" height="33.3433" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1028_3685"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1028_3685" result="shape"/>
+</filter>
+<filter id="filter1_d_1028_3685" x="8.22681" y="8.22681" width="18.5464" height="18.5464" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1028_3685"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1028_3685" result="shape"/>
+</filter>
+<filter id="filter2_d_1028_3685" x="4.24084" y="4.35327" width="26.5182" height="26.2937" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1028_3685"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1028_3685" result="shape"/>
+</filter>
+<filter id="filter3_d_1028_3685" x="8.69214" y="8.64404" width="17.615" height="17.7119" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1028_3685"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1028_3685" result="shape"/>
+</filter>
+<filter id="filter4_d_1028_3685" x="11.8489" y="11.825" width="11.302" height="11.3499" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1028_3685"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1028_3685" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_1028_3685" x1="8.30453" y1="-2.28723e-07" x2="4.62908" y2="15.5034" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="#B8B8B8"/>
+</linearGradient>
+</defs>
+</svg>

luckydiamond/src/assets/icons-games/saper-game/icon-emeralds-saper.svg

@@ -0,0 +1,66 @@
+<svg width="208" height="198" viewBox="0 0 208 198" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_bddf_290_4)">
+<path d="M51.9315 77.9679L71.7926 53.7515C73.4352 51.7486 75.791 50.4613 78.3638 50.1606L83.7001 49.5369C86.3034 49.2327 88.922 49.9626 90.9925 51.5697L115.385 70.5021C117.543 72.1778 118.923 74.6642 119.201 77.3829L121.923 103.962C122.185 106.52 121.452 109.081 119.875 111.112L100.84 135.636C99.1944 137.756 96.7662 139.126 94.1009 139.437L88.9216 140.043C86.3178 140.347 83.6986 139.617 81.628 138.009L56.6139 118.587C54.4948 116.942 53.1257 114.514 52.8143 111.849L49.7312 85.4702C49.4162 82.7745 50.2104 80.0665 51.9315 77.9679Z" fill="url(#paint0_linear_290_4)"/>
+<path d="M51.9315 77.9679L71.7926 53.7515C73.4352 51.7486 75.791 50.4613 78.3638 50.1606L83.7001 49.5369C86.3034 49.2327 88.922 49.9626 90.9925 51.5697L115.385 70.5021C117.543 72.1778 118.923 74.6642 119.201 77.3829L121.923 103.962C122.185 106.52 121.452 109.081 119.875 111.112L100.84 135.636C99.1944 137.756 96.7662 139.126 94.1009 139.437L88.9216 140.043C86.3178 140.347 83.6986 139.617 81.628 138.009L56.6139 118.587C54.4948 116.942 53.1257 114.514 52.8143 111.849L49.7312 85.4702C49.4162 82.7745 50.2104 80.0665 51.9315 77.9679Z" stroke="url(#paint1_linear_290_4)" stroke-width="6"/>
+</g>
+<g filter="url(#filter1_bddf_290_4)">
+<path d="M103.594 84.5815L120.124 72.3178C122.206 70.7734 124.806 70.0976 127.376 70.433L129.065 70.6533C131.665 70.9926 134.028 72.34 135.645 74.4052L148.12 90.3416C149.804 92.4923 150.535 95.238 150.143 97.9409L147.667 115.01C147.298 117.553 145.964 119.857 143.942 121.443L127.886 134.037C125.774 135.694 123.083 136.432 120.421 136.085L118.889 135.885C116.288 135.546 113.924 134.198 112.308 132.132L99.4654 115.721C97.8131 113.61 97.0778 110.923 97.4247 108.265L99.6358 91.3189C99.9868 88.6293 101.415 86.1976 103.594 84.5815Z" fill="url(#paint2_linear_290_4)"/>
+<path d="M103.594 84.5815L120.124 72.3178C122.206 70.7734 124.806 70.0976 127.376 70.433L129.065 70.6533C131.665 70.9926 134.028 72.34 135.645 74.4052L148.12 90.3416C149.804 92.4923 150.535 95.238 150.143 97.9409L147.667 115.01C147.298 117.553 145.964 119.857 143.942 121.443L127.886 134.037C125.774 135.694 123.083 136.432 120.421 136.085L118.889 135.885C116.288 135.546 113.924 134.198 112.308 132.132L99.4654 115.721C97.8131 113.61 97.0778 110.923 97.4247 108.265L99.6358 91.3189C99.9868 88.6293 101.415 86.1976 103.594 84.5815Z" stroke="url(#paint3_linear_290_4)" stroke-width="6"/>
+</g>
+<defs>
+<filter id="filter0_bddf_290_4" x="0.663574" y="0.469299" width="178.312" height="196.641" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feGaussianBlur in="BackgroundImageFix" stdDeviation="2.5"/>
+<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_290_4"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="4" dy="4"/>
+<feGaussianBlur stdDeviation="25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.360784 0 0 0 0 0.745098 0 0 0 0 0.458824 0 0 0 0.6 0"/>
+<feBlend mode="normal" in2="effect1_backgroundBlur_290_4" result="effect2_dropShadow_290_4"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="4" dy="4"/>
+<feGaussianBlur stdDeviation="25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.00392157 0 0 0 0 0.262745 0 0 0 0 0.00392157 0 0 0 0.2 0"/>
+<feBlend mode="normal" in2="effect2_dropShadow_290_4" result="effect3_dropShadow_290_4"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect3_dropShadow_290_4" result="shape"/>
+<feGaussianBlur stdDeviation="0.15" result="effect4_foregroundBlur_290_4"/>
+</filter>
+<filter id="filter1_bddf_290_4" x="48.3406" y="21.3489" width="158.906" height="171.82" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feGaussianBlur in="BackgroundImageFix" stdDeviation="2.5"/>
+<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_290_4"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="4" dy="4"/>
+<feGaussianBlur stdDeviation="25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.360784 0 0 0 0 0.745098 0 0 0 0 0.458824 0 0 0 0.6 0"/>
+<feBlend mode="normal" in2="effect1_backgroundBlur_290_4" result="effect2_dropShadow_290_4"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="4" dy="4"/>
+<feGaussianBlur stdDeviation="25"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.00392157 0 0 0 0 0.262745 0 0 0 0 0.00392157 0 0 0 0.2 0"/>
+<feBlend mode="normal" in2="effect2_dropShadow_290_4" result="effect3_dropShadow_290_4"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect3_dropShadow_290_4" result="shape"/>
+<feGaussianBlur stdDeviation="0.15" result="effect4_foregroundBlur_290_4"/>
+</filter>
+<linearGradient id="paint0_linear_290_4" x1="58.8031" y1="64.025" x2="115.998" y2="139.899" gradientUnits="userSpaceOnUse">
+<stop stop-color="#B6FFD0"/>
+<stop offset="1" stop-color="#007B18"/>
+</linearGradient>
+<linearGradient id="paint1_linear_290_4" x1="80.8093" y1="49.8748" x2="91.3149" y2="139.763" gradientUnits="userSpaceOnUse">
+<stop stop-color="#458845"/>
+<stop offset="1" stop-color="#255125"/>
+</linearGradient>
+<linearGradient id="paint2_linear_290_4" x1="110.003" y1="76.6239" x2="136.997" y2="140.424" gradientUnits="userSpaceOnUse">
+<stop stop-color="#B6FFD0"/>
+<stop offset="1" stop-color="#007B18"/>
+</linearGradient>
+<linearGradient id="paint3_linear_290_4" x1="128.065" y1="70.5229" x2="119.526" y2="135.968" gradientUnits="userSpaceOnUse">
+<stop stop-color="#458845"/>
+<stop offset="1" stop-color="#255125"/>
+</linearGradient>
+</defs>
+</svg>

luckydiamond/src/assets/icons-header/discord-icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 127.14 96.36"><path fill="#fff" d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"/></svg>

luckydiamond/src/assets/icons-menu/jackpot-icon.svg

@@ -0,0 +1,21 @@
+<svg width="57" height="36" viewBox="0 0 57 36" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<g filter="url(#filter0_i_3187_2)">
+<rect width="56.8" height="36" fill="url(#pattern0)"/>
+</g>
+<defs>
+<filter id="filter0_i_3187_2" x="0" y="0" width="56.7998" height="40" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="shape" result="effect1_innerShadow_3187_2"/>
+</filter>
+<pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_3187_2" transform="matrix(0.00195312 0 0 0.0030816 0 -0.288889)"/>
+</pattern>
+<image id="image0_3187_2" width="512" height="512" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIAAQMAAADOtka5AAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAZQTFRFAAAA70RE4n0h2gAAAAJ0Uk5TAP9bkSK1AAAKQUlEQVR4nO2cPc7mthGARahgF14gAK+RKrxSyhQBKMPFlnsEH8XqXO4RVqlcRkYKC7AgRvwZckiR1N9nG3Y4wL58X4l6RA5nOORI+3VdkyZNmjRp0qRJkyZNmjRp0qRJkyZNmjRp0qRJk0TY9BIgt3fX90oNrwBUqekVgCu1vAIIpdZXAKnUOy2qXd5cTzRg+D0BvQaMLwD0QwDTCwD7EMD8AsA/BPDGGYTa5EvAyl950357/sqbpJrZK4DSgDfuuFsRfQMgFjC8AYyv5uXeAsbHAN188gGA6THADOEHAJ67ozFj+RYgXrij0J74GvDGn81k8g4w66F47s/qJYAZG6KPDaFXAHjoDS4u9k/XCAIDHgyEiWp6LjFrhAdqUDHgdif6cJn9Nt4EsBRwtw8mrFoTkupJiJUp4O44qHCVCKzrQg6Am8PgAKbj3I/oDemR6tmTcaT2ogl9fwQY9HeCYJeF4WvoU4AfenHfFFk8cPcBPNZa/wQQXcCuOgPdAJCYrl9vniiTu4bz9IZwoD9pCYRinnaZuQtPogSBrhYBou5VPQx+ESDrXkXB74uAE6egYD5FJZ7YNAMHOsR0t8wgJxbFA+BgB+a6M5P0FsxTZasAqBmCAABLlE0cgF4ATA4w4hM9AtQmeIkAEz5Bw/FTANwp9UYPqNmyQoCoqzwot2rLPhb0SUvFNQDxAJK0FFxA1EMMCVNpciP4KdQvNcDe8K/uzrHX+QZJDRhrgC+upkgn1dUBfqoBdt1/9u6IDcEPitKA6XhlqEcDABkCg1/71TUAM4DBfUWGAO0hBlB2x33GhH0mjQwBNKL3gLUtEDcAU7WPDAHGpDeAsjvuOxQS7hXHxs61a6htgfQWB3SELc6bgQWU3VG3DgASjbc3A72RrG2BNAB0JNBweTPQcamSEzFjL4PfeW2zMCNulUBNzWQgXH9xPTAD42qsFBqIXQgJ59E0Boy2VzuAljxaWAB3C6o+XiMNbq212CKjR+IWg9ydJzEA7rC4NeixCdQdtws802EE2Dq3/p7dnY5a4BFg0GOKACusfufiHkq4O1PXlU5gwIKWm8rPnJHICDBFAVrYLTAGHLVoDm+hpfsFMYBD06SrWQWYJiPAlAIOwYFAw/wXlgAEaNd/yQO6OqArAXzLcwCz5PJd933JACa4wVYA6EO0AtDtYh6wHAGT13cKQElwkQcE88lm3NHihxQBMPgiD/C2wYy2+REwdOEW0xEw+B8yDwjXpEsoCwg/+gRgehNdI+stoLo7RwBy4YMOeKQWt9mdk9/BhUnqj0RFauF5QLikT42ZRvVhw58Ctrj+hAA8bqHMA4KaWVzf3TK0UBUAvtE8rp9OMiQF0BQgovqHXJPLPkTBNXYgGfcIrhiS+hpAp+QA6qNvUJRuQF3W9fmCANAnkjQoTXJwBDAPbQEAeu+TBsEt4YAIABLCKtI7TZScWp4MAOqTmljvB9Pm8QEVAFyFsBj0zlOAiFoIZgBBBAGGXP1wYItUpAHEFugI7mMAQKcjFenqzsk8YIr6uB0AA6hoNgf9csUDZujjFq+Flc3iuxa6CU8DLHmvvAUwLJ9EBJjDzg6+7J9gcRbg1229+YIfgZlb+plW2L7sF4LBEAPoUWCZ42nY3JIigFXM6MZ7tS3w6zYK60C4nkAGGwAulTqBci2gQ4AxBQx2OxMDfgLlf4EjHmDrx4AuAFZbHcmGTrjeHwHSA5Y8gHvAlgUID5gDYJPBapkHrAdAdwRYB1k4BixVgMwBJnoHMHa2q7MtjHtYa1xiwFEHJcDmdBEB+msACF/cu+ETwIQDKb8MWGxPVXhEcgmgYkAP9qOVMKKmXQUQ0B2HuSoAjqZsAQMG+NQhSjJeA6D06eBOr9cB/8AJXDdvR6leXgf0Gx5uF+uYU46xcRstigBm/rk7C6gAv02ImEsA49TaI1m8BAwCJysAk5iuAvSMSzJTmvukNkFQASgbLkoAYzM1QG/DRBEg7RRSBpiUaBlg84m0lCSBSFEGGAfcKoB/21iZB+zds7PYpzLgBxsriwArP5YBX+0Ma/y2DCgmflGo+f0BVR08BZAPBBQs8RLgawUg9LlfigC7fCwlujxgMtW6EmAN6fWjcHNvUQWYfGINsPlHDLnQBsm4Qt6XKUjG5QFCQSZrKgMml5bMAbjPI415AFWQR1qyAL9KLz1AcAt0V+8IsAtQ3ZD89brxS+eXtEdAD5xi2ldCGmjIAjprQKQ0irpxpnNiw1ehr+7VYj6UAL0LmnMBcE8aoAEa4E8N+Bd86iX51JmS6vLvMCWjOTsDIG5q3Ce/fVGs5zc52mSaCzgTfnSeAVAz5enPfd7mmz6xL45XV5qwxF1gzAPsvoDpxfCyX2B3DHJzpQGYyDqWAZP91G+rSL39MKVu1GxjN34vKAPgNoOoAasBULWYIGBLHZdkiP5ZwBwANpEF5UIQYD0FUPfoFEoWA7YzwGwvnEsAdRGwdABKAcM9wPIUsHZQpoDxGmDroATA6gDTNYB6DRgABIDlJmAEEABmByitD0qAEQDjTcAEpQXoKjrPUgf8DQF8GQPCu00ZAFEIsOQBvAbYp6MAWAF0A8B0IhUAG4BiAKsBdl8+ArYbAKEZAFBQwjBOVwALAnxy5WdkSCcAqf/fiQf8kACWc8DeYQT40ZVfkDPVR0FnkjOA/0SAmiH9Nwb87EqFJpQRXpbMAn7ea30XACoHIDVf0PK1Dqh7o5VfHzBdA3zvAN8/BXx3AKyn03oE+OwA370FfPaA5TQyRYBPDvDJA+bT4BoBvnWAbz1gOg3vEeCbBKCrnAO+BMDgAN+kgMoSR5l0GwCk8qAIUFni2PamAHmnCwQBhPJlBKiNwoYi0h4hfBkDKnaAQ9oelCNACK5jGWBsDQBUeVBsSFMZYF4rA0CvPAjNyrw6H0yGkgB67EwjqwJGk6NxAKJ8iQDw4DMP0AtrD+iUL9Gk2p8AegSQOQCpAswPDxAehONCDWDfXzsAxOXAYjZasLgazAFbYkAttOkzIuxYmAHYpy4BUF3ixAC71YkBGluyA+b2TCNstnKbrsH8ygNotO0z+8bZlGHbxw12KgKGLmw8zTtq6caTGexYANitr/7ct7xMawpKMxJmG2bGqSsA9nWuln/u3dgLfZu/7Cd1q/5qU+/uaFcE3JIGaIAGqAN0gr23UxuS1Z2h8ylA6Pd0/AuvXvQZ/dx7PQXItXPTWSRDOHMCsP9DOXp259YUuh9SXQLIPGC7AiC2monSWKZw5gygOpc/OwBUeEehAX7VUXhtByeWKM4Br31B+9wrb2RjcT4YL80Hl+VPBxj+3wHdoz8v0EeA6T6ARoAHfyIhfs20+Ky6LPg/Rj36M0wy867uTXkNOLyv/JsDDu9s/+aAYDzsvHIdQM8r52TygP68ck5GDyDnlXMyBLN8Bojs+oFg/xFPANiDH40jnkMeDcOIAE+0GE8hD/rw5g94NWnSpEmTJk2aNGnSpEmTJk2aNGnSpEmTJk2a/LHlf/vs4b0MR/1wAAAAAElFTkSuQmCC"/>
+</defs>
+</svg>

luckydiamond/src/assets/icons-menu/slots-icon.svg

@@ -1,21 +0,0 @@
-<svg width="73" height="44" viewBox="0 0 73 44" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<g id="sadasdad 1" filter="url(#filter0_d_644_4)">
-<rect width="65" height="36" fill="url(#pattern0)" shape-rendering="crispEdges"/>
-</g>
-<defs>
-<filter id="filter0_d_644_4" x="0" y="0" width="73" height="44" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset dx="4" dy="4"/>
-<feGaussianBlur stdDeviation="2"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_644_4"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_644_4" result="shape"/>
-</filter>
-<pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
-<use xlink:href="#image0_644_4" transform="matrix(0.00193643 0 0 0.00354004 0 -0.40625)"/>
-</pattern>
-<image id="image0_644_4" width="512" height="512" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIAAQMAAADOtka5AAAAAXNSR0IB2cksfwAAAAlwSFlzAAAN1wAADdcBQiibeAAAAAZQTFRFAAAA70RE4n0h2gAAAAJ0Uk5TAP9bkSK1AAAET0lEQVR4nO3bTZKbMBAFYCgWLH2DcBQdDY7GUTgCSy8oFGP+W0J0q41xUu8tUnkV+qsZLH4mA0mCIAiCIAiCIAiCIAiCIAiCIAiCIAiC/JMpe918Zm2tAgprnyqgtFb1PaT2lUoB5APQKIDHALQKoBgAzV40A9ApgHIANB+DfSd+Ph2BKhrIRqCOBvIRaO4DHiMQv5LUQDEC8UtRDZgRiF/LaqAcgfiDYTihqU5qr+Em1wDDcZBpDsfhSEyVwPRHNNC/d8SdQPdeTQDuBe5fB+qlrAd0R6P6hPIC2ocS0J1U778uqIH7L67332Co75HUt3nqG001oL5X1t+tG91K/sBPLOofujLdMkjGj0EzP+xFzT58H06aHxvfe7EBAAAAAAAfB6bbHVYqD5AK5reXkgWQfAHbq+ECGBHQuoBofvM9zEAmA3oHyGXA+jnMQCEEagoYIdBQoBQCLQWE8+uN2QSI1uGQTgv0BBAuA7vemU2AdBk4gOxQGlJpgXoPFN8Hmj1gvg+0HwZKu79pp7fg+z6tGgK0xwNOL9fdsAJNYID24g10G8CSHx5PgMf6PaxAaID2aSdU0UC2roUF6EMDB0AbDUznn+cWCA4cAL0WsPcB81Wg0gK1FmhuB1ot8Lwd6H4OMMtBet7no2kHLCyrFw6QrQcpp+cOMN8kMPv4K7ItMF/jK15PD4Ga2R2gIBuc9fIIaJhdDRgKGHeDsw7gMqDm94uAit8vAgT9GqAXdAcYzlO9pDtAvjkLczo9H+w2OOte4EEGQt0D9MMGT253gAfZ4Kw7QD5er1pu9wBPMhDuDpC+/s0IugMkr78aQXeBP++LRc3tLpCQgZPuBcbDndcvAeZfxLP6VUCfcLsPyMhAsB8AXcLtPiAnA8F+CTAd7rw+n+Y/DbQJt/uAggwE+wHQJNzuAwwZCPYDoE64/RKgJAPBfgBUCbf7AEsGgv0ASBJuvwKYTzi8/jGgXjfIyEC4+4GODAT6DFQfBPL5v+1ZfQbYAwdArwW257zlcQZWN+uHEA0kc6YNiumEw+s/CcxnLF7/VaDidw9QkoFwvwgQdA9gyUC4XwP0gu4CKRk46dcAnaD/IpAtv4xldRcoyMBJdwFLFs5Jd4DN61Ws7gD5fLFn9s8Dm/ezWN0BiuVKx+s/CJhhg07U/zvg659CeTtgtceCAwiPxtQBNg/ucnq+/VVxzBnp4QCbV0453bpAIuh2XZb/NPC8HWgFA9cAjRaotUAVC6SfAiRfsg/o2QMHQLfdIPYxkjhg8yTMskHMszj1DqjkwG6D/WsQJ0BB96H0gSZDDiX3Df4w4Hl/prTy7B7iMrrxGKDZA8X3gXoPxD+fGA1UeyD/PrCflz9mSl+iin9Sdo4UeFKg1AJGCDQUKIRATQHpSqooIF0IdF76OTqfovRj8LzGVYgAZx8KF7P3bcBS9x0gCIIgCIIgCIIgCIIgCIIgCIIgCIIgt+UvVBu5EERv1u4AAAAASUVORK5CYII="/>
-</defs>
-</svg>

luckydiamond/src/assets/icons-other/icon-payments-modal-close.svg

@@ -0,0 +1,17 @@
+<svg width="30" height="29" viewBox="0 0 30 29" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="&#208;&#154;&#209;&#128;&#208;&#181;&#209;&#129;&#209;&#130;&#208;&#184;&#208;&#186;" filter="url(#filter0_d_1064_8)">
+<path id="Union" fill-rule="evenodd" clip-rule="evenodd" d="M6.853 0.617653C6.51189 0.276538 5.95883 0.276538 5.61772 0.617653C5.2766 0.958768 5.2766 1.51182 5.61772 1.85294L13.7647 9.99994L4.61765 19.147C4.27654 19.4881 4.27654 20.0412 4.61765 20.3823C4.95877 20.7234 5.51182 20.7234 5.85294 20.3823L15 11.2352L24.147 20.3822C24.4881 20.7233 25.0412 20.7233 25.3823 20.3822C25.7234 20.0411 25.7234 19.4881 25.3823 19.1469L16.2353 9.99994L24.3822 1.85301C24.7233 1.51189 24.7233 0.958835 24.3822 0.61772C24.0411 0.276605 23.4881 0.276605 23.1469 0.61772L15 8.76466L6.853 0.617653Z" fill="#30364F"/>
+</g>
+<defs>
+<filter id="filter0_d_1064_8" x="0.361816" y="0.361816" width="29.2764" height="28.2764" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1064_8"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1064_8" result="shape"/>
+</filter>
+</defs>
+</svg>

luckydiamond/src/assets/icons-profile/icon-deposit.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path id="Vector" d="M18.0156 4.28571H3.125C2.78125 4.28571 2.5 3.96429 2.5 3.57143C2.5 3.17857 2.78125 2.85714 3.125 2.85714H18.125C18.4688 2.85714 18.75 2.53571 18.75 2.14286C18.75 0.959821 17.9102 0 16.875 0H2.5C1.12109 0 0 1.28125 0 2.85714V17.1429C0 18.7232 1.12109 20 2.5 20H18.0156C19.1094 20 20 19.0402 20 17.8571V6.42857C20 5.24554 19.1094 4.28571 18.0156 4.28571ZM16.25 13.5714C15.5586 13.5714 15 12.933 15 12.1429C15 11.3527 15.5586 10.7143 16.25 10.7143C16.9414 10.7143 17.5 11.3527 17.5 12.1429C17.5 12.933 16.9414 13.5714 16.25 13.5714Z" fill="#17181C"/>
+</svg>