Later on [Picovoice Porcupine Wake Word Detection](https://picovoice.ai/platform/porcupine/) & [ChatGPT](https://chat.openai.com/) was added. - - - -`The code has NOT been polished and is provided "as is". There are a lot of code that are redundant and there are tons of improvements that can be made.` - -# Installation -First, install the requirements, the `requirements.txt` file is just an output of `pip freeze` from my test venv 'k.
-Second, check `config.py` and set required values (api key, device index).
-Next, run the `main.py` script and Voilà, as simple as that.
- -And don't forget to put models of Vosk to main folder.
-You can get the latest from the [official website.](https://alphacephei.com/vosk/models) -
The one I was using is `small`. -
p.s. If you don't understand how to install or where to put the Vosk model, I've made a [screenshot](https://i.imgur.com/N3bu2lC.png) for you. - -# Python version -I was using Python `3.8.3`, but it should work on any newer version. - -# ToDo -- Адекватная архитектура кода, собрать всё и переписать from the ground up. -- Задержка воспроизведения звука на основе реальной длительности .wav файла (прогружать при запуске?) -- Speech to intent? -- Отключать self listening protection во время воспроизведения с наушников. -- Указание из списка или по имени будет реализовано позже. - -# Author -(2022) Abraham Tugalov \ No newline at end of file diff --git a/commands.yaml b/commands.yaml deleted file mode 100644 index dc191dc..0000000 --- a/commands.yaml +++ /dev/null @@ -1,157 +0,0 @@ -gaming_mode_off: -- рабочий режим -- вернись в рабочий режим -- переключись на компьютер -- обратно на компьютер -- отключи игровой режим -- выйди из игрового режима -- вернись на компьютер -- выход с игрового режима -- рабочее пространство -- вернись в игровой режим -- выключи игровой режим -gaming_mode_on: -- включи игровой режим -- перейди в игровой режим -- я хочу поиграть -- переключись на телевизор -music: -- давай музыку -- музыка -- яндекс музыка -- включи музыку -- открой музыку -- послушаем музыку -- хочу музыку -- врубай музло -- включи что-то послушать -- давай что-то послушаем -music_next: -- следующий трек -- следующая мелодия -- следующая песня -- переключи трек -- переключи музыку -- переключи мелодию -- переключи песню -- следующая музыка -music_off: -- выключи музыку -- отруби музыку -- убери музыку -- отключи музыку -- закрой музыку -- останови музыку -- хватит музыки -music_prev: -- предыдущая музыка -- предыдущий трек -- предыдущая мелодия -- предыдущая песня -- верни трек -- верни мелодию -- верни песню -- верни прошлый трек -- верни прошлую мелодию -- верни прошлую песню -- верни прошлую музыку -- верни то что играло -- давай предыдущий трек -- переключи музыку обратно -- переключи на прошлый трек -- переключи на прошлую мелодию -- переключи на прошлую песню -music_save: -- сохрани трек -- мне нравится трек -- сохрани песню -- мне нравится песня -- добавь трек в избранное -- добавь песню в избранное -- запомни мелодию -- запомни трек -- запомни песню -- добавь мелодию в избранное -- сохрани то что сейчас играет -- добавь то что сейчас играет в избранное -- лайкни трек -- лайкни мелодию -- лайкни песню -'off': -- выключись -- вырубись -- завершить работу -- закройся -- отключись -- заверши свою работу -- на сегодня хватит -- выгрузи себя из памяти -- ты мне надоел -- пора спать -open_browser: -- открой браузер -- запусти браузер -- открой гугл хром -- гугл хром -open_google: -- открой гугл -- гугл -- запусти гугл -open_youtube: -- открой ютуб -- ютуб -- запусти ютуб -sound_off: -- выключи звук -- беззвучный режим -- режим без звука -- отключи звук -sound_on: -- включи звук -- режим со звуком -- верни звук -stupid: -- ты дурак -- ты дебил -- ты глупый -- ты тупой -switch_to_dynamics: -- переключи на динамики -- включи динамики -- перейди на динамики -- давай звук в динамики -- давай звук на динамики -- переключи звук в динамики -- переключи звук на динамики -- переключи на колонки -- включи колонки -- перейди на колонки -- давай звук в колонки -- давай звук на колонки -- переключи звук в колонки -- переключи звук на колонки -switch_to_headphones: -- переключи на наушники -- включи наушники -- перейди на наушники -- давай звук в наушники -- давай звук на наушники -- переключи звук в наушники -- переключи звук на наушники -- переключи на кракены -- включи кракены -- перейди на кракены -- давай звук в кракены -- давай звук на кракены -- переключи звук в кракены -- переключи звук на кракены -thanks: -- спасибо -- молодец -- респект -- ты супер -- отличная работа -- ты крут -- ты большой молодец -- ты реально крут -- ты афигенный \ No newline at end of file diff --git a/config.py b/config.py deleted file mode 100644 index cac005f..0000000 --- a/config.py +++ /dev/null @@ -1,24 +0,0 @@ -from dotenv import load_dotenv -import os - -# Find .env file with os variables -load_dotenv("dev.env") - -# Конфигурация -VA_NAME = 'Jarvis' -VA_VER = "3.0" -VA_ALIAS = ('джарвис',) -VA_TBR = ('скажи', 'покажи', 'ответь', 'произнеси', 'расскажи', 'сколько', 'слушай') - -# ID микрофона (можете просто менять ID пока при запуске не отобразится нужный) -# -1 это стандартное записывающее устройство -MICROPHONE_INDEX = -1 - -# Путь к браузеру Google Chrome -CHROME_PATH = 'C:/Program Files (x86)/Google/Chrome/Application/chrome.exe %s' - -# Токен Picovoice -PICOVOICE_TOKEN = os.getenv('PICOVOICE_TOKEN') - -# Токен OpenAI -OPENAI_TOKEN = os.getenv('OPENAI_TOKEN') diff --git a/custom-commands/Next music.ahk b/custom-commands/Next music.ahk deleted file mode 100644 index e0c9a12..0000000 --- a/custom-commands/Next music.ahk +++ /dev/null @@ -1,19 +0,0 @@ -#NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. -; #Warn ; Enable warnings to assist with detecting common errors. -SendMode Input ; Recommended for new scripts due to its superior speed and reliability. -SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. - -Process, Exist, Y.Music.exe -If ErrorLevel = 0 -{ -; APP IS NOT RUNNING -} -Else -{ -; APP IS RUNNING -;MsgBox, Already running -Run C:\Users\Abraham\Documents\WinStoreApps\YandexMusic -sleep 100 -Send, {Ctrl down}f{Ctrl up} -} -Return \ No newline at end of file diff --git a/custom-commands/Next music.exe b/custom-commands/Next music.exe deleted file mode 100644 index ceed05b..0000000 Binary files a/custom-commands/Next music.exe and /dev/null differ diff --git a/custom-commands/Prev music.ahk b/custom-commands/Prev music.ahk deleted file mode 100644 index f86c2c6..0000000 --- a/custom-commands/Prev music.ahk +++ /dev/null @@ -1,19 +0,0 @@ -#NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. -; #Warn ; Enable warnings to assist with detecting common errors. -SendMode Input ; Recommended for new scripts due to its superior speed and reliability. -SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. - -Process, Exist, Y.Music.exe -If ErrorLevel = 0 -{ -; APP IS NOT RUNNING -} -Else -{ -; APP IS RUNNING -;MsgBox, Already running -Run C:\Users\Abraham\Documents\WinStoreApps\YandexMusic -sleep 100 -Send, {Ctrl down}b{Ctrl up} -} -Return \ No newline at end of file diff --git a/custom-commands/Prev music.exe b/custom-commands/Prev music.exe deleted file mode 100644 index 420d246..0000000 Binary files a/custom-commands/Prev music.exe and /dev/null differ diff --git a/custom-commands/Run music.ahk b/custom-commands/Run music.ahk deleted file mode 100644 index 5b231a8..0000000 --- a/custom-commands/Run music.ahk +++ /dev/null @@ -1,41 +0,0 @@ -#NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. -; #Warn ; Enable warnings to assist with detecting common errors. -SendMode Input ; Recommended for new scripts due to its superior speed and reliability. -SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. - -Process, Exist, Y.Music.exe -If ErrorLevel = 0 -{ -; APP IS NOT RUNNING -; Run https://music.yandex.ru/home -Run C:\Users\Abraham\Documents\WinStoreApps\YandexMusic -; Autoplay -sleep 3000 -Send, {Ctrl down}p{Ctrl up} -sleep 10 - -; Open full -Loop, 4 -{ -Send, {Tab} -sleep 10 -} - -Send, {Enter} -sleep 1500 - -Loop, 7 -{ -Send, {Down} -sleep 50 -} - -sleep 1000 -Send, {Enter} -} -Else -{ -; APP IS RUNNING -;MsgBox, Already running -} -Return \ No newline at end of file diff --git a/custom-commands/Run music.exe b/custom-commands/Run music.exe deleted file mode 100644 index e021034..0000000 Binary files a/custom-commands/Run music.exe and /dev/null differ diff --git a/custom-commands/Save music.ahk b/custom-commands/Save music.ahk deleted file mode 100644 index 3cb0e6d..0000000 --- a/custom-commands/Save music.ahk +++ /dev/null @@ -1,19 +0,0 @@ -#NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. -; #Warn ; Enable warnings to assist with detecting common errors. -SendMode Input ; Recommended for new scripts due to its superior speed and reliability. -SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. - -Process, Exist, Y.Music.exe -If ErrorLevel = 0 -{ -; APP IS NOT RUNNING -} -Else -{ -; APP IS RUNNING -;MsgBox, Already running -Run C:\Users\Abraham\Documents\WinStoreApps\YandexMusic -sleep 100 -Send, {Ctrl down}l{Ctrl up} -} -Return \ No newline at end of file diff --git a/custom-commands/Save music.exe b/custom-commands/Save music.exe deleted file mode 100644 index 31e0147..0000000 Binary files a/custom-commands/Save music.exe and /dev/null differ diff --git a/custom-commands/Stop music.ahk b/custom-commands/Stop music.ahk deleted file mode 100644 index ff950ea..0000000 --- a/custom-commands/Stop music.ahk +++ /dev/null @@ -1,6 +0,0 @@ -#NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. -; #Warn ; Enable warnings to assist with detecting common errors. -SendMode Input ; Recommended for new scripts due to its superior speed and reliability. -SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. - -Process, Close, Y.Music.exe \ No newline at end of file diff --git a/custom-commands/Stop music.exe b/custom-commands/Stop music.exe deleted file mode 100644 index e8a5d2e..0000000 Binary files a/custom-commands/Stop music.exe and /dev/null differ diff --git a/custom-commands/Switch back to workspace.ahk b/custom-commands/Switch back to workspace.ahk deleted file mode 100644 index c9ca23e..0000000 --- a/custom-commands/Switch back to workspace.ahk +++ /dev/null @@ -1,16 +0,0 @@ -#NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. -; #Warn ; Enable warnings to assist with detecting common errors. -SendMode Input ; Recommended for new scripts due to its superior speed and reliability. -SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. - -; Step 1. Close steam. -WinKill, AHK_exe Steam.exe -Process, Close, Steam.exe - -; Step 2. Switch monitor profile. -RunWait C:\MonitorProfileSwitcher\MonitorSwitcher.exe -load:"C:\Users\Abraham\AppData\Roaming\MonitorSwitcher\Profiles\Workspace.xml" - -Sleep, 7000 - -; Step 3. Switch audio device to Luna Edifier. -Run, nircmd setdefaultsounddevice "Luna Edifier" 1 \ No newline at end of file diff --git a/custom-commands/Switch back to workspace.exe b/custom-commands/Switch back to workspace.exe deleted file mode 100644 index f1164ee..0000000 Binary files a/custom-commands/Switch back to workspace.exe and /dev/null differ diff --git a/custom-commands/Switch to gaming mode.ahk b/custom-commands/Switch to gaming mode.ahk deleted file mode 100644 index e8f1967..0000000 --- a/custom-commands/Switch to gaming mode.ahk +++ /dev/null @@ -1,19 +0,0 @@ -#NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. -; #Warn ; Enable warnings to assist with detecting common errors. -SendMode Input ; Recommended for new scripts due to its superior speed and reliability. -SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. - -; Step 1. Close steam. -WinKill, AHK_exe Steam.exe -Process, Close, Steam.exe - -; Step 2. Switch monitor profile. -RunWait C:\MonitorProfileSwitcher\MonitorSwitcher.exe -load:"C:\Users\Abraham\AppData\Roaming\MonitorSwitcher\Profiles\Gaming.xml" - -Sleep, 7000 - -; Step 3. Switch audio device to LG TV. -Run, nircmd setdefaultsounddevice "LG TV" 1 - -; Step 4. Run Steam big picture. -Run, steam://open/bigpicture \ No newline at end of file diff --git a/custom-commands/Switch to gaming mode.exe b/custom-commands/Switch to gaming mode.exe deleted file mode 100644 index 9f5a84d..0000000 Binary files a/custom-commands/Switch to gaming mode.exe and /dev/null differ diff --git a/custom-commands/Switch to headphones.ahk b/custom-commands/Switch to headphones.ahk deleted file mode 100644 index d05b68b..0000000 --- a/custom-commands/Switch to headphones.ahk +++ /dev/null @@ -1,6 +0,0 @@ -#NoEnv ; Recommended for performance and compatibility with future AutoHotkey releases. -; #Warn ; Enable warnings to assist with detecting common errors. -SendMode Input ; Recommended for new scripts due to its superior speed and reliability. -SetWorkingDir %A_ScriptDir% ; Ensures a consistent starting directory. - -Run, nircmd setdefaultsounddevice "Razer Kraken" 1 \ No newline at end of file diff --git a/custom-commands/Switch to headphones.exe b/custom-commands/Switch to headphones.exe deleted file mode 100644 index c506d8d..0000000 Binary files a/custom-commands/Switch to headphones.exe and /dev/null differ diff --git a/custom-commands/nircmd.exe b/custom-commands/nircmd.exe deleted file mode 100644 index e606a83..0000000 Binary files a/custom-commands/nircmd.exe and /dev/null differ diff --git a/dev.env b/dev.env deleted file mode 100644 index 4f357f2..0000000 --- a/dev.env +++ /dev/null @@ -1,2 +0,0 @@ -PICOVOICE_TOKEN=<тут ключ-picovoice> -OPENAI_TOKEN=<тут ключ-openai> \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..6e53357 --- /dev/null +++ b/index.html @@ -0,0 +1,14 @@ + + + + + + +
+ * {
+ * "alternatives": [
+ * { "text": "one two three four five", "confidence": 0.97 },
+ * { "text": "one two three for five", "confidence": 0.03 },
+ * ]
+ * }
+ *
+ *
+ * @param max_alternatives - maximum alternatives to return from recognition results
+ */
+void vosk_recognizer_set_max_alternatives(VoskRecognizer *recognizer, int max_alternatives);
+
+
+/** Enables words with times in the output
+ *
+ *
+ * "result" : [{
+ * "conf" : 1.000000,
+ * "end" : 1.110000,
+ * "start" : 0.870000,
+ * "word" : "what"
+ * }, {
+ * "conf" : 1.000000,
+ * "end" : 1.530000,
+ * "start" : 1.110000,
+ * "word" : "zero"
+ * }, {
+ * "conf" : 1.000000,
+ * "end" : 1.950000,
+ * "start" : 1.530000,
+ * "word" : "zero"
+ * }, {
+ * "conf" : 1.000000,
+ * "end" : 2.340000,
+ * "start" : 1.950000,
+ * "word" : "zero"
+ * }, {
+ * "conf" : 1.000000,
+ * "end" : 2.610000,
+ * "start" : 2.340000,
+ * "word" : "one"
+ * }],
+ *
+ *
+ * @param words - boolean value
+ */
+void vosk_recognizer_set_words(VoskRecognizer *recognizer, int words);
+
+/** Like above return words and confidences in partial results
+ *
+ * @param partial_words - boolean value
+ */
+void vosk_recognizer_set_partial_words(VoskRecognizer *recognizer, int partial_words);
+
+/** Set NLSML output
+ * @param nlsml - boolean value
+ */
+void vosk_recognizer_set_nlsml(VoskRecognizer *recognizer, int nlsml);
+
+
+/** Accept voice data
+ *
+ * accept and process new chunk of voice data
+ *
+ * @param data - audio data in PCM 16-bit mono format
+ * @param length - length of the audio data
+ * @returns 1 if silence is occured and you can retrieve a new utterance with result method
+ * 0 if decoding continues
+ * -1 if exception occured */
+int vosk_recognizer_accept_waveform(VoskRecognizer *recognizer, const char *data, int length);
+
+
+/** Same as above but the version with the short data for language bindings where you have
+ * audio as array of shorts */
+int vosk_recognizer_accept_waveform_s(VoskRecognizer *recognizer, const short *data, int length);
+
+
+/** Same as above but the version with the float data for language bindings where you have
+ * audio as array of floats */
+int vosk_recognizer_accept_waveform_f(VoskRecognizer *recognizer, const float *data, int length);
+
+
+/** Returns speech recognition result
+ *
+ * @returns the result in JSON format which contains decoded line, decoded
+ * words, times in seconds and confidences. You can parse this result
+ * with any json parser
+ *
+ *
+ * {
+ * "text" : "what zero zero zero one"
+ * }
+ *
+ *
+ * If alternatives enabled it returns result with alternatives, see also vosk_recognizer_set_max_alternatives().
+ *
+ * If word times enabled returns word time, see also vosk_recognizer_set_word_times().
+ */
+const char *vosk_recognizer_result(VoskRecognizer *recognizer);
+
+
+/** Returns partial speech recognition
+ *
+ * @returns partial speech recognition text which is not yet finalized.
+ * result may change as recognizer process more data.
+ *
+ *
+ * {
+ * "partial" : "cyril one eight zero"
+ * }
+ *
+ */
+const char *vosk_recognizer_partial_result(VoskRecognizer *recognizer);
+
+
+/** Returns speech recognition result. Same as result, but doesn't wait for silence
+ * You usually call it in the end of the stream to get final bits of audio. It
+ * flushes the feature pipeline, so all remaining audio chunks got processed.
+ *
+ * @returns speech result in JSON format.
+ */
+const char *vosk_recognizer_final_result(VoskRecognizer *recognizer);
+
+
+/** Resets the recognizer
+ *
+ * Resets current results so the recognition can continue from scratch */
+void vosk_recognizer_reset(VoskRecognizer *recognizer);
+
+
+/** Releases recognizer object
+ *
+ * Underlying model is also unreferenced and if needed released */
+void vosk_recognizer_free(VoskRecognizer *recognizer);
+
+/** Set log level for Kaldi messages
+ *
+ * @param log_level the level
+ * 0 - default value to print info and error messages but no debug
+ * less than 0 - don't print info messages
+ * greather than 0 - more verbose mode
+ */
+void vosk_set_log_level(int log_level);
+
+/**
+ * Init, automatically select a CUDA device and allow multithreading.
+ * Must be called once from the main thread.
+ * Has no effect if HAVE_CUDA flag is not set.
+ */
+void vosk_gpu_init();
+
+/**
+ * Init CUDA device in a multi-threaded environment.
+ * Must be called for each thread.
+ * Has no effect if HAVE_CUDA flag is not set.
+ */
+void vosk_gpu_thread_init();
+
+/** Creates the batch recognizer object
+ *
+ * @returns model object or NULL if problem occured */
+VoskBatchModel *vosk_batch_model_new(const char *model_path);
+
+/** Releases batch model object */
+void vosk_batch_model_free(VoskBatchModel *model);
+
+/** Wait for the processing */
+void vosk_batch_model_wait(VoskBatchModel *model);
+
+/** Creates batch recognizer object
+ * @returns recognizer object or NULL if problem occured */
+VoskBatchRecognizer *vosk_batch_recognizer_new(VoskBatchModel *model, float sample_rate);
+
+/** Releases batch recognizer object */
+void vosk_batch_recognizer_free(VoskBatchRecognizer *recognizer);
+
+/** Accept batch voice data */
+void vosk_batch_recognizer_accept_waveform(VoskBatchRecognizer *recognizer, const char *data, int length);
+
+/** Set NLSML output
+ * @param nlsml - boolean value
+ */
+void vosk_batch_recognizer_set_nlsml(VoskBatchRecognizer *recognizer, int nlsml);
+
+/** Closes the stream */
+void vosk_batch_recognizer_finish_stream(VoskBatchRecognizer *recognizer);
+
+/** Return results */
+const char *vosk_batch_recognizer_front_result(VoskBatchRecognizer *recognizer);
+
+/** Release and free first retrieved result */
+void vosk_batch_recognizer_pop(VoskBatchRecognizer *recognizer);
+
+/** Get amount of pending chunks for more intelligent waiting */
+int vosk_batch_recognizer_get_pending_chunks(VoskBatchRecognizer *recognizer);
+
+#ifdef __cplusplus
+}
+#endif
+
+#endif /* VOSK_API_H */
diff --git a/src-tauri/vosk_build.py b/src-tauri/vosk_build.py
new file mode 100644
index 0000000..5a87fb2
--- /dev/null
+++ b/src-tauri/vosk_build.py
@@ -0,0 +1,36 @@
+# Simple python script used to
+# copy Vosk libraries to the "target" directory
+# after Rust build
+
+# Note that Rust build should be run via "cargo make
+ 
+
+
+
+
+
+ JARVIS
+v{app_version} beta
+
+
+
+
\ No newline at end of file
diff --git a/src/components/elements/HDivider.svelte b/src/components/elements/HDivider.svelte
new file mode 100644
index 0000000..5c8cea9
--- /dev/null
+++ b/src/components/elements/HDivider.svelte
@@ -0,0 +1,18 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/elements/SearchBar.svelte b/src/components/elements/SearchBar.svelte
new file mode 100644
index 0000000..3e48b10
--- /dev/null
+++ b/src/components/elements/SearchBar.svelte
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/elements/Stats.svelte b/src/components/elements/Stats.svelte
new file mode 100644
index 0000000..78f4894
--- /dev/null
+++ b/src/components/elements/Stats.svelte
@@ -0,0 +1,366 @@
+
+
+
+
+
+
diff --git a/src/css/main.scss b/src/css/main.scss
new file mode 100644
index 0000000..50f5246
--- /dev/null
+++ b/src/css/main.scss
@@ -0,0 +1,2738 @@
+$prim-font: "Roboto", sans-serif;
+$sec-font: "Roboto Condensed", sans-serif;
+
+html, body {
+ overflow-x: hidden;
+}
+
+::-webkit-scrollbar {
+ width: 15px;
+}
+
+::-webkit-scrollbar-track {
+ -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
+}
+
+::-webkit-scrollbar-thumb {
+ background: -webkit-gradient(linear,left top,left bottom,from(#999),to(#27292F));
+ background: linear-gradient(to bottom,#999,#27292F);
+}
+
+::selection {
+ background: #FF8901!important; /* WebKit/Blink Browsers */
+ color: white!important;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, .5)!important;
+}
+::-moz-selection {
+ background: #FF8901!important; /* WebKit/Blink Browsers */
+ color: white!important;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, .5)!important;
+}
+
+/*
+ * HEADER
+ */
+
+#header {
+ height: 80px;
+ background-color: #0c1013;
+ box-shadow: 0 0 19px 2px rgba(0, 0, 0, 0.91);
+ position: relative;
+ z-index: 100;
+ text-align: justify;
+
+ display: flex;
+ justify-content: space-between;
+
+ .logo {
+ margin-top: 12px;
+
+ & > a > img {
+ width: 57px;
+ display: inline-block;
+ transition: .5s opacity ease-in;
+
+ &:hover {
+ opacity: .8;
+ }
+ }
+
+ & > div {
+ display: inline-block;
+ margin-left: 13px;
+ margin-top: 8px;
+ vertical-align: top;
+ }
+
+ h1 {
+ color: #ffffff;
+ font-family: $sec-font;
+ font-size: 20px;
+ font-weight: bold;
+ text-transform: uppercase;
+ letter-spacing: 0.1px;
+ margin: 0;
+
+ & > a {
+ color: white;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, .5);
+ text-decoration: none;
+
+ &:hover {
+ color: #FF0000;
+ }
+ }
+ }
+
+ h2 {
+ color: #888;
+ font-family: $sec-font;
+ font-size: 14px;
+ font-weight: bold;
+ letter-spacing: 0.1px;
+ margin-top: 2px;
+ letter-spacing: -0.01px;
+ }
+ }
+
+ .top-menu {
+ vertical-align: top;
+ margin-top: 18px;
+ margin-left: 50px;
+
+ & > ul {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+
+ & > li {
+ display: inline-block;
+ position: relative;
+
+ &:not(:first-child) {
+ margin-left: 20px;
+ }
+
+ & > a {
+ display: inline-block;
+ text-decoration: none;
+ color: #c6c6c6;
+ font-family: $sec-font;
+ font-size: 16px;
+ text-transform: uppercase;
+ font-weight: bold;
+ transition: .2s color;
+ padding: 10px 0;
+
+ & > svg {
+ height: 20px;
+ width: 20px;
+ vertical-align: middle;
+ margin-bottom: 4px;
+ margin-right: 3px;
+ margin-left: 3px;
+ }
+
+ &:hover, &.active {
+ color: #8AC832;
+
+ &:after {
+ -webkit-transform: scaleX(1);
+ -ms-transform: scaleX(1);
+ transform: scaleX(1);
+ -webkit-transform-origin: left;
+ -ms-transform-origin: left;
+ transform-origin: left;
+ }
+ }
+
+ &:after {
+ content: "";
+ display: block;
+ height: 3px;
+ border-radius: 10px;
+ -webkit-transform: scaleX(0);
+ -ms-transform: scaleX(0);
+ transform: scaleX(0);
+ transition: .4s -webkit-transform;
+ transition: .4s transform;
+ -webkit-transform-origin: 100% 0;
+ -ms-transform-origin: 100% 0;
+ transform-origin: 100% 0;
+ background: #8AC832;
+ opacity: 0.90;
+ position: absolute;
+ bottom: 5px;
+ left: 0;
+ width: 100%;
+ z-index: 333;
+ }
+
+ }
+ }
+ }
+ }
+}
+
+.search {
+ display: block;
+ margin: 20px 0;
+ text-align: center;
+
+ & > form {
+ position: relative;
+
+ & > input {
+ width: 380px;
+ height: 38px;
+ box-shadow: inset 0 0 5px 1px rgba(0, 0, 0, 0.6);
+ border: 1px solid rgba(6, 6, 6, 0.99);
+ background-color: #0f1012;
+ outline: none;
+
+ color: #D1D1D1;
+ font-family: $sec-font;
+ font-size: 17px;
+ font-weight: 600;
+ line-height: 70.58px;
+ padding-left: 20px;
+ padding-right: 45px;
+ padding-right: 45px;
+
+ &::placeholder {
+ color: #676767;
+ font-weight: 400;
+ }
+
+ &:focus + button + small {
+ opacity: .3;
+ }
+ }
+
+ & > button {
+ position: absolute;
+ padding: 0;
+ margin: 0;
+ background: none;
+ border: none;
+ right: 35px;
+ top: 4px;
+ width: 30px;
+ height: 30px;
+ opacity: 1;
+ transition: .3s opacity;
+
+ &::before {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 110%;
+ height: 110%;
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAbCAYAAABvCO8sAAAC4ElEQVRIiaXWX4hXRRTA8c/etkwy+gNBEVRCmxFl1ouZGlEWFUQZPfVQRLAjKvSylEFBf16EiChJOxhLQY8RtA+lRZtpRv8ohUJQNMiHooKyojZNtoeZy95+/fZ3r+uBy5xz5pzznYGZc2dodHRUB1lVviUYwXkYwk84iK8wGRHb2goNtQDXYxRXdVkV9mFrRDx/osCl2IxrG75PsAv75Z1NyzsdwQosb8R+jXURsbML8AG82rDH8TI+77eyiAAppSVYg9SYXhsRW5rxVU/+Qw3Yd7ip+PrCesB7ImKNvNMDxb05pbR+NuBSvFL0L7EYH7SB+oA/Lrm7i2tTSmlVL3AYbxf9eyzDkROFNaBTWCmfYJhIKc1rAh/DuUW/HUfnCmtAp3FrMefjmRp4Kh4tE+PYO6DO6fKp7Ao9hJeKOZZSWlBhNc4ozidbaqyUr8W4/x+42aSuOYT7KtxZHF/gcEvyvDI+KF/yFW20iPgZk8W8o8KVxZjsn/IfOdbQL8OulNLTHfJ2lHFRhYuKcbB/bKs8kVLanVK6ZkBMfS8vqLCgGL/NEQjX48MB8/UVm1/hz2KceRLAfbh3wHxde2pYbmFnY+EcYVsiYm1LzKVl/KHCN8W4sUPxUxr6j7i7AwxuKOP+ykxLW4bzWxKnyziBRXirjZRSOstMx9lW4Q38XRyPt+R/hOtwF35tgzVqDhX99QpTeK441pWVzya/49OOICmlCzFWzE0RcaRuT0/hj6Jv71qwg7xbxuNKv66BR820uIuxE6edDCmltB1XFPOeiPiL/B+sZQcexgtyk96L+3X42/eAFuM1+YUHGyJiop4f7ol/Ef/Iv5TL8VlZQMiXexBoRH7hjTXcj0TEs8242V5tNxdo8wC9J5/Sfq+25bitEfut/Gp7p7dw7w5reV/e4Yay6oW4pXyD5DC2YmNEHOsXMBuwlo3lWy3v+mpcgnPku/WL3Br3yA+uNyPi+KCC/wJQGMGINsMjCwAAAABJRU5ErkJggg==");
+ background-repeat: no-repeat;
+ background-size: 75%;
+ background-position: center center;
+ transition: all .3s;
+ }
+
+ &:hover {
+ &::before {
+ cursor: pointer;
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAbCAYAAABvCO8sAAABN2lDQ1BBZG9iZSBSR0IgKDE5OTgpAAAokZWPv0rDUBSHvxtFxaFWCOLgcCdRUGzVwYxJW4ogWKtDkq1JQ5ViEm6uf/oQjm4dXNx9AidHwUHxCXwDxamDQ4QMBYvf9J3fORzOAaNi152GUYbzWKt205Gu58vZF2aYAoBOmKV2q3UAECdxxBjf7wiA10277jTG+38yH6ZKAyNguxtlIYgK0L/SqQYxBMygn2oQD4CpTto1EE9AqZf7G1AKcv8ASsr1fBBfgNlzPR+MOcAMcl8BTB1da4Bakg7UWe9Uy6plWdLuJkEkjweZjs4zuR+HiUoT1dFRF8jvA2AxH2w3HblWtay99X/+PRHX82Vun0cIQCw9F1lBeKEuf1UYO5PrYsdwGQ7vYXpUZLs3cLcBC7dFtlqF8hY8Dn8AwMZP/fNTP8gAAAAJcEhZcwAACxMAAAsTAQCanBgAAAXRaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzE0MiA3OS4xNjA5MjQsIDIwMTcvMDcvMTMtMDE6MDY6MzkgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdEV2dD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlRXZlbnQjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE4IChXaW5kb3dzKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjMtMDQtMjNUMDQ6MzE6NTgrMDU6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDIzLTA0LTIzVDA0OjM0OjI3KzA1OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDIzLTA0LTIzVDA0OjM0OjI3KzA1OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowZDA5NTdiMi0zYmM3LTcxNDItODcyNS01ODA3MjA2NTFlYTIiIHhtcE1NOkRvY3VtZW50SUQ9ImFkb2JlOmRvY2lkOnBob3Rvc2hvcDoxM2UwZWYxNi03OGM0LTE2NGMtODc1Mi0xYjY5OTQ1OTczMGMiIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo5YjNkZTI4Yy1iOTBmLTNjNDUtYjAwNS1kNTExOTE3ZDhkNzIiPiA8eG1wTU06SGlzdG9yeT4gPHJkZjpTZXE+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJjcmVhdGVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjliM2RlMjhjLWI5MGYtM2M0NS1iMDA1LWQ1MTE5MTdkOGQ3MiIgc3RFdnQ6d2hlbj0iMjAyMy0wNC0yM1QwNDozMTo1OCswNTowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKFdpbmRvd3MpIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDowZDA5NTdiMi0zYmM3LTcxNDItODcyNS01ODA3MjA2NTFlYTIiIHN0RXZ0OndoZW49IjIwMjMtMDQtMjNUMDQ6MzQ6MjcrMDU6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE4IChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4Wh528AAAC7UlEQVRIiaXWX4gXVRTA8c9v2jLJ6A8ERVAJbUakTr2YqRFl0QRRRk89FBGYqNDLUgY51PQiRERJWhhLQY8RtA+OFm2mGf2RGqEQDAvyoaigrKhNk+3h3mGnX7/9zbgeGO45555zvvfCvWdub/POpTrI6vilGMVF6OEnHMEXmCyyaldboV4LcCPWYnGXVeEQdhRZ9fypApdhG65v+D7GPhwWdjYt7HQUK7GiEfslNhRZtbcL8EG81rDH8TI+G7SyIqtAXqYp1uGRxvT6Iqu2N+OTvvyHG7DvcEv0DYT1gasiq9YJO/06urflZbpxNuAyvBr1z7EE77eBBoA/irn7o2trXqar+4Ej2Bn177Ecx04V1oBOYZVwgmEiL9N5TeATuDDqGY7PFdaATuP2aM7HMzXwTDweJ8ZxcEids4VT2RX6DV6K5lhepgsSrME50flUS41VwrUY9/8DN5vUNXu4P8Fd0XEAR1uS58XxIeGSr2yjFVn1MyajeWeCa6MxOTjlP3KioV+FfXmZFh3y9sRxUYLLonFkcGyrbM7LdH9eptcNianv5SUJFkTjtzkC4UZ8MGS+vmLzE/wZjXNPA3gI9w2Zr2tPjQgt7HwsnCNse5FV61tirozjDwm+isbNHYqf0dB/xD0dYHBTHA8nZlraclzckjgdxwkswtttpLxMzzPTcXYleBN/R8eTLfkf4gbcjV/bYI2avai/kWAKz0XHhrjy2eR3fNIRJC/TSzEWza1FVh2r29PT+CPqu7sW7CDvxPGk2K9r4HEzLe5y7MVZp0PKy3Q3ronmvUVW/UX4D9ayB4/iBaFJH8QDOvzt+0BL8LrwwoNNRVZN1PMjffEv4h/hl3I1Po0LeEW43MNAo8ILb6zhfqzIqmebcbO92m6N0OYBelc4pYNebStwRyP2W+HVVvYX7t9hLe8JO9wUV70Qt8VvmBzFDmwpsurEoIDZgLVsid8aYddLcQUuEO7WL0JrrIQH11tFVp0cVvBfVZDA+HDoxOQAAAAASUVORK5CYII=");
+ }
+ }
+ }
+
+ & > small {
+ position: absolute;
+ font-family: $sec-font;
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 1.7em;
+ top: 8px;
+ right: 75px;
+ background-color: #D1D1D1;
+ color: #080C0F;
+ padding: 0 7px;
+ padding-top: 2px;
+ border-radius: 4px;
+ opacity: 0;
+ transition: opacity .3s;
+ cursor: default;
+ }
+ }
+
+ &.active {
+ small {
+ opacity: .3;
+ }
+ }
+}
+
+/*
+ * CONTENT
+ */
+
+#content {
+ margin-top: 52px;
+
+ & > .inner {
+ min-height: 1000px;
+ background-image: url(media/images/decor.png);
+ background-repeat: no-repeat;
+ background-size: 100%;
+
+ & > section.materials {
+ padding: 36px;
+
+ & > header {
+ margin-top: 25px;
+
+ & > h1 {
+ display: inline-block;
+ margin: 0;
+ padding: 0;
+ color: #d1d1d1;
+ font-family: $sec-font;
+ font-size: 23px;
+ font-weight: bold;
+ letter-spacing: 0.1px;
+ position: relative;
+
+ & + sup {
+ font-family: $sec-font;
+ margin-left: 10px;
+ color: silver;
+ background: black;
+ padding: 3px 7px;
+ border-radius: 3px;
+ opacity: .5;
+ top: 0;
+ transition: .3s opacity;
+
+ &:hover {
+ opacity: 1;
+ }
+ }
+
+ &::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ bottom: -5px;
+ width: 100%;
+ height: 3px;
+ background-color: #ff8a00;
+ background: -webkit-gradient(linear,left top,right top,from(#ff8a00),to(#da1b60));
+ background: linear-gradient(to right,#ff8a00,#da1b60);
+ }
+
+ &.with-icon {
+ margin-bottom: 5px;
+
+ & > img {
+ vertical-align: middle;
+ margin-right: 10px;
+ }
+
+ & > span {
+ vertical-align: middle;
+ }
+
+ &::before {
+ bottom: -10px;
+ }
+ }
+ }
+ }
+
+ & > article {
+ display: table;
+ margin: 15px 0;
+ font-size: 0;
+ position: relative;
+
+ .toolkit {
+ position: absolute;
+ left: 10px;
+ top: 10px;
+ z-index: 10;
+ font-size: 20px;
+ opacity: 0;
+ transition: .3s opacity;
+
+ & > a {
+ text-decoration: none;
+ opacity: .3;
+ transition: .3s opacity;
+
+ &:hover {
+ opacity: 1;
+ }
+ }
+ }
+
+ &:hover {
+ & > .toolkit {
+ opacity: 1;
+ }
+ }
+
+ & > .poster {
+ display: inline-block;
+ vertical-align: top;
+ width: 372px;
+ min-height: 250px;
+ overflow: hidden;
+ background-color: black;
+ border-radius: 3px 0 0 3px;
+
+ background-repeat: no-repeat;
+ background-size: contain;
+ background-position: center;
+
+ & > img {
+ max-width: 372px;
+ border-radius: 3px 0 0 3px;
+ vertical-align: middle;
+ }
+ }
+
+ & > .details {
+ display: table-cell;
+ vertical-align: top;
+ background-color: #080c0f;
+ min-height: 250px;
+ /*width: calc(100% - 372px);*/
+ width: 100%;
+ border-radius: 0 3px 3px 0;
+ font-size: 16px;
+ padding: 15px 22px;
+ position: relative;
+
+ & > h1 {
+ display: inline-block;
+ text-shadow: 0 0 4px rgba(55, 55, 55, 0.54);
+ font-family: $sec-font;
+ font-size: 21px;
+ padding: 0;
+ margin: 0;
+ font-weight: normal;
+ font-weight: 600;
+
+ & > a {
+ color: #fea431;
+ color: #FFC14E;
+ text-decoration: none;
+ display: inline-block;
+ opacity: 1;
+ transition: .1s opacity;
+ position: relative;
+ background: -webkit-gradient(linear,left top,right top,from(#fea431),to(#ff8a00));
+ background: linear-gradient(to right,#fea431,#ff8a00);
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ -webkit-box-decoration-break: clone;
+ box-decoration-break: clone;
+ text-shadow: none;
+
+ &:hover {
+ background: -webkit-gradient(linear,left top,right top,from(#ff8a00),to(#da1b60));
+ background: linear-gradient(to right,#ff8a00,#da1b60);
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ -webkit-box-decoration-break: clone;
+ box-decoration-break: clone;
+ text-shadow: none;
+ }
+ }
+ }
+
+ & > .meta {
+ margin-top: 10px;
+
+ .status {
+ &.over5k {
+ color: mediumslateblue;
+ background-image: url(images/bg/bg10.gif);
+ background-position: center center;
+ background-size: 50%;
+ background-repeat: no-repeat;
+ }
+
+ &.over10k {
+ color: limegreen;
+ background-image: url(images/bg/bg24.gif);
+ background-position: center center;
+ background-size: cover;
+ background-repeat: no-repeat;
+ }
+
+ &.over100k {
+ color: goldenrod;
+ font-weight: bold;
+ font-size: 20px;
+ background-image: url(images/bg/bg11.gif);
+ background-position: center center;
+ background-size: 100%;
+ background-repeat: no-repeat;
+ text-shadow: 0 0 3px rgba(0, 0, 0, 1);
+ position: relative;
+ top: -2px;
+ }
+ }
+
+ & > .pubdate {
+ display: inline-block;
+ vertical-align: top;
+ color: #888888;
+ font-family: $sec-font;
+ font-size: 16px;
+ font-weight: 400;
+ margin-right: 19px;
+ }
+
+ & > .cat {
+ display: inline-block;
+ vertical-align: top;
+ margin-right: 5px;
+ color: #888888;
+ font-family: $sec-font;
+ font-size: 16px;
+ font-weight: 400;
+ margin-right: 17px;
+ opacity: .9;
+ transition: .3s opacity;
+
+ background-position: center;
+ background-size: 17px;
+ background-repeat: no-repeat;
+ background-position: left center;
+
+ & > a {
+ color: inherit;
+ text-decoration: none;
+ transition: .2s color;
+
+ &:hover {
+ color: deepskyblue;
+ background-image: url(images/bg/bg8.gif);
+ }
+ }
+
+ &.icon {
+ & > a > img {
+ vertical-align: middle;
+ margin-right: 3px;
+ }
+ }
+ }
+
+ & > .downloads {
+ display: inline-block;
+ vertical-align: top;
+ margin-right: 5px;
+ color: #888888;
+ font-family: $sec-font;
+ font-size: 16px;
+ font-weight: 400;
+ padding-left: 20px;
+ opacity: .7;
+ transition: .3s opacity;
+
+ background-position: center;
+ background-size: 17px;
+ background-repeat: no-repeat;
+ background-position: left -2px;
+
+ & > a {
+ color: inherit;
+ text-decoration: none;
+
+ &:hover {
+ color: orange;
+ }
+ }
+ }
+ }
+
+ & > blockquote {
+ font-family: $prim-font;
+ color: #88919d;
+ font-size: 15px;
+ font-weight: normal;
+ line-height: 20px;
+ padding: 0;
+ margin: 0;
+ margin-top: 12px;
+ overflow: hidden;
+ display: -webkit-box;
+ -webkit-line-clamp: 5;
+ -webkit-box-orient: vertical;
+ }
+
+ & > .actions {
+ position: absolute;
+ right: 22px;
+ bottom: 15px;
+ font-size: 0;
+
+ & > .btn {
+ &:first-child {
+ border-radius: 3px 0 0 3px;
+ margin-right: 1px;
+ opacity: .7;
+
+ & + .btn {
+ border-radius: 0 3px 3px 0;
+ }
+ }
+
+ &:not(:first-child):not(:last-child) {
+ border-radius: 0;
+ margin-right: 1px;
+ opacity: .7;
+
+ &:hover {
+ opacity: 1;
+ }
+ }
+
+ &:last-child {
+ border-radius: 0 3px 3px 0;
+ margin-right: 1px;
+ opacity: .7;
+
+ & + .btn {
+ border-radius: 0 3px 3px 0;
+ }
+
+ &:hover {
+ opacity: 1;
+ }
+ }
+
+ &:only-child {
+ border-radius: 3px!important;
+ }
+ }
+ }
+ }
+
+ &:hover {
+ .meta > .cat {
+ opacity: 1;
+ }
+
+ .meta > .downloads {
+ opacity: 1;
+ }
+
+ .actions > .btn:first-child {
+ opacity: 1;
+ }
+ }
+ }
+ }
+ }
+}
+
+@media (max-width: 1364px) {
+ #content>.inner>section.materials>header>h1 {
+ font-size: 26px;
+ }
+
+ #content>.inner>section.materials>article>.details>h1 {
+ font-size: 25px;
+ }
+
+ #content>.inner>section.materials>article>.details>blockquote {
+ font-size: 17px;
+ line-height: 24px;
+ -webkit-line-clamp: 4;
+ }
+
+ .btn {
+ font-size: 16px!important;
+ }
+
+ #paginator>header>h1 {
+ font-size: 30px!important;
+ }
+
+ #paginator>.paginator-wrapper>.paginator-box {
+ transform: scale(1.5);
+ margin-top: 15px;
+ }
+
+ #paginator>.paginator-wrapper>small:first-child {
+ display: none;
+ }
+
+ #paginator>.paginator-wrapper>small:last-child {
+ display: none;
+ }
+}
+
+@media (max-width: 991px) {
+ #wrapper {
+ overflow-y: hidden;
+ }
+ #content>.inner>section.materials>article>.details>h1 {
+ font-size: 30px;
+ margin-top: 15px;
+ margin-bottom: 10px;
+ }
+
+ #content>.inner>section.materials>article>.details>blockquote {
+ -webkit-line-clamp: initial;
+ font-size: 18px;
+ line-height: 25px;
+ }
+
+ #content>.inner>section.materials>article>.poster {
+ display: block;
+ width: 100%;
+ min-height: auto;
+ max-height: 650px;
+
+ & > img {
+ max-width: none;
+ width: inherit!important;
+ }
+ }
+
+ #content>.inner>section.materials>article>.details {
+ display: block;
+ }
+
+ #content>.inner>section.materials>article>.details>.actions {
+ position: static;
+ text-align: center;
+ margin-top: 20px;
+ margin-bottom: 10px;
+ display: none;
+ }
+
+ #content>.inner>section.materials>article {
+ display: block;
+ }
+
+ #content>.inner>section.materials>article>.details>.meta>.cat {
+ display: none;
+ }
+
+ #content>.inner>section.materials {
+ padding: 0px;
+ }
+}
+
+#paginator {
+ text-align: center;
+
+ & > header {
+ margin-bottom: 20px;
+
+ & > h1 {
+ display: inline-block;
+ margin: 0;
+ padding: 0;
+ color: #d1d1d1;
+ font-family: $sec-font;
+ font-size: 23px;
+ font-weight: bold;
+ letter-spacing: 0.1px;
+ position: relative;
+
+ &::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ bottom: -5px;
+ width: 100%;
+ height: 3px;
+ background-color: #86BF45;
+ background: -webkit-gradient(linear,left top,right top,from(#ff8a00),to(#da1b60));
+ background: linear-gradient(to right,#ff8a00,#da1b60);
+ }
+ }
+ }
+
+ & > .paginator-wrapper {
+ margin-bottom: 150px;
+ position: relative;
+
+ & > small {
+ display: inline-block;
+ opacity: 0.75;
+ color: #d3d3d3;
+ font-family: $sec-font;
+ font-size: 15px;
+ font-weight: 700;
+ vertical-align: middle;
+
+ &:first-child {
+ margin-right: 15px;
+ color: #88DB47;
+ }
+
+ &:last-child {
+ margin-left: 15px;
+ }
+ }
+
+ & > .paginator-box {
+ display: inline-block;
+ background: black;
+ width: 500px;
+ height: 50px;
+ border-radius: 2px;
+ border: 1px solid #070808;
+ background-color: #171A20;
+ vertical-align: middle;
+ overflow: hidden;
+ position: relative;
+
+ /* box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5); */
+
+ & > .pb-start, & > .pb-end {
+ height: 100%;
+
+ & > nav {
+ & > ul {
+ padding: 0;
+ margin: 0;
+ list-style: none;
+
+ & > li {
+ display: inline-block;
+ line-height: 43px;
+
+ & > a {
+ position: relative;
+ display: inline-block;
+ width: 35px;
+ height: 35px;
+ line-height: 33px;
+ border-radius: 1px;
+ border: 1px solid #070808;
+ border-radius: 3px;
+ background-color: #171A20;
+ background-image: linear-gradient(to top, #1a1c24 0%, #20232a 100%);
+ box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.7);
+ text-shadow: 0px 0px 5px #000000, 0px 0px 5px #000000, 0px 0px 3px #000000, 0px 0px 3px #000000, 0px 0px 3px #000000;
+ color: #D5DAE3;
+ font-family: $sec-font;
+ font-size: 15px;
+ font-weight: 700;
+ text-decoration: none;
+ text-align: center;
+
+ &.current {
+ color: #8AC547;
+ cursor: not-allowed;
+ opacity: .5;
+ }
+
+ &.last {
+ width: auto;
+ padding: 0 15px;
+ }
+
+ &:not(.current):hover {
+ background-image: linear-gradient(to top, #20222A 0%, #2B2E35 100%);
+ }
+
+ &::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ border-radius: 2px;
+ border-left: 1px solid rgba(150, 150, 150, .1);
+ border-top: 1px solid rgba(150, 150, 150, .1);
+ border-right: 1px solid rgba(100, 100, 100, .1);
+ border-bottom: 1px solid rgba(100, 100, 100, .1);
+ }
+
+ &.chosen {
+ color: #8AC547;
+ cursor: not-allowed;
+ opacity: .5;
+ }
+ }
+ }
+ }
+ }
+ }
+
+ & > .pb-start {
+ background-color: #171a20;
+ box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
+ text-align: left;
+ padding-left: 10px;
+ position: absolute;
+ z-index: 10;
+ padding-right: 10px;
+ left: 0;
+
+ &::before {
+ content: "";
+ position: absolute;
+ right: -10px;
+ top: -70%;
+ height: 200%;
+ width: 50px;
+ background-image: linear-gradient(to bottom, #13151A 30%, #16191E 70%, #13151A 100%);
+ border-right: 2px solid #456789;
+ transform: rotate(25deg);
+ }
+
+ &.pb-single {
+ position: static;
+ text-align: center;
+
+ &::before {
+ display: none;
+ }
+ }
+ }
+
+ & > .pb-end {
+ background-color: #0E131A;
+ text-align: right;
+ padding-right: 10px;
+ }
+ }
+ }
+}
+
+/*
+ * SIDEBAR
+ */
+
+#sidebar, #sidebar-mobile {
+
+ &.col-s {
+ &::after {
+ content: " ";
+ box-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.54);
+ background-color: #1f2326;
+ position: fixed;
+
+ top: 0;
+ width: 328px;
+ height: 100vh;
+ }
+ }
+
+ & > .inner {
+ z-index: 9;
+
+ & > section {
+ position: relative;
+ z-index: 2;
+ padding: 18px;
+
+ &:last-child {
+ margin-bottom: 50px;
+ }
+
+ & > header {
+ margin-top: 25px;
+
+ & > h1 {
+ display: inline-block;
+ margin: 0;
+ padding: 0;
+ color: #d1d1d1;
+ font-family: $sec-font;
+ font-size: 20px;
+ font-weight: bold;
+ letter-spacing: 0.1px;
+ position: relative;
+
+ &::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ bottom: -5px;
+ width: 100%;
+ height: 3px;
+ background-color: #ff8a00;
+ background: -webkit-gradient(linear,left top,right top,from(#ff8a00),to(#da1b60));
+ background: linear-gradient(to right,#ff8a00,#da1b60);
+ }
+ }
+ }
+
+ &.hollow {
+ padding: 0;
+
+ & > header {
+ padding: 18px;
+ }
+ }
+
+ &.default {
+ & > header {
+ margin-bottom: 18px;
+ }
+ }
+
+ }
+
+ & > .side-menu {
+ padding: 0;
+
+ & > header {
+ padding: 18px;
+ }
+
+ & > nav {
+ background-color: rgba(0, 0, 0, .05);
+
+ & > ul {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+
+ & > li {
+ & > a {
+ color: white;
+ text-decoration: none;
+ display: block;
+ height: 50px;
+ line-height: 50px;
+ text-align: left;
+ padding: 0 18px;
+ text-transform: uppercase;
+ font-family: $sec-font;
+ font-size: 16px;
+ font-weight: 400;
+ position: relative;
+
+ &:hover {
+ background-color: rgba(11,12,14,0.75);
+ }
+
+ &.with-icon {
+ padding-left: 54px;
+
+ &:hover {
+ cursor: pointer;
+ }
+
+ & > .icon-fg {
+ display: block;
+ width: 20px;
+ height: 20px;
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: contain;
+ position: absolute;
+ left: 18px;
+ top: 12.5px;
+ z-index: 10;
+
+ & > .icon-bg {
+ display: block;
+ width: 32px;
+ height: 32px;
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: contain;
+ position: absolute;
+ left: -6px;
+ top: -6px;
+ opacity: 0.3;
+ z-index: 5;
+ filter: blur(3px);
+ transition: .5s all;
+ }
+ }
+
+ &:hover {
+
+ & > .icon-fg {
+ & > .icon-bg {
+ filter: blur(1px);
+ }
+ }
+ }
+ }
+ }
+
+ &.active > a {
+ background-color: rgba(11,12,14,0.75);
+ }
+
+ span.emoji-ic {
+ display: inline-block;
+ width: 20px;
+ text-align: center;
+ margin-right: 5px;
+ }
+
+ &.with-dropdown {
+
+ & > a {
+ &::after {
+ content: "";
+ position: absolute;
+ width: 13px;
+ height: 13px;
+ background-color: #434648;
+ opacity: .3;
+ border-radius: 50%;
+ right: 18px;
+ top: 18px;
+ }
+ }
+
+ & > ul.dropdown {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+ box-shadow: inset 0 1px 10px rgba(0, 0, 0, .3);
+ display: none;
+
+ & > li {
+ & > a {
+ color: rgba(255, 255, 255, .9);
+ text-decoration: none;
+ display: block;
+ height: 50px;
+ line-height: 50px;
+ text-align: left;
+ padding: 0 18px;
+ text-transform: uppercase;
+ font-family: $sec-font;
+ font-size: 15px;
+ font-weight: 400;
+ position: relative;
+
+ &:hover {
+ background-color: rgba(11,12,14,0.5);
+ color: #FEA431;
+ }
+
+ & > small {
+ position: absolute;
+ right: 18px;
+ opacity: .5;
+
+ &.warning {
+ opacity: .7;
+ color: #EFCE49;
+ }
+ }
+
+ &.with-icon {
+ padding-left: 54px;
+
+ & > .icon-fg {
+ display: block;
+ width: 18px;
+ height: 18px;
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: contain;
+ position: absolute;
+ left: 19px;
+ top: 12.5px;
+ z-index: 10;
+
+
+ & > .icon-bg {
+ display: block;
+ width: 25px;
+ height: 25px;
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: contain;
+ position: absolute;
+ left: -4px;
+ top: -4px;
+ opacity: 0.3;
+ z-index: 5;
+ filter: blur(3px);
+ transition: .5s all;
+
+ }
+ }
+
+ &:hover {
+
+ & > .icon-fg {
+ & > .icon-bg {
+ filter: blur(1px);
+ }
+ }
+ }
+ }
+ }
+
+ &.active {
+ & > a {
+ background-color: rgba(11,12,14,0.5);
+ color: #FEA431;
+ }
+ }
+ }
+ }
+
+ &.dropdown-opened {
+ & > a {
+ background-color: rgba(11,12,14,0.75);
+ }
+
+ & > ul.dropdown {
+ /*display: block;*/
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ }
+}
+
+#sidebar-mobile {
+ section.special {
+ margin-top: 30px;
+
+ & > .special-top-tip {
+ position: relative;
+ width: 285px;
+ height: 100px;
+ margin: 0 auto;
+ border-radius: 5px;
+ text-shadow: 0 0 4px rgba(55, 55, 55, 0.54);
+ color: #b6b6b6;
+ font-family: $prim-font;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 18px;
+ padding: 15px 15px;
+ text-align: center;
+ z-index: 10;
+
+ background-color: #ff8a00;
+ background: -webkit-gradient(linear,left top,right top,from(#ff8a00),to(#da1b60));
+ background: -o-linear-gradient(left,#ff8a00,#da1b60);
+ background: linear-gradient(to right,#ff8a00,#da1b60);
+ color: white!important;
+
+ & > a {
+ color: gold!important;
+ text-transform: uppercase;
+ font-weight: bold;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
+ text-decoration: none;
+ }
+
+ &::before {
+ content: "";
+ width: 0;
+ height: 0;
+ border-left: 15px solid transparent;
+ border-right: 15px solid transparent;
+ border-top: 15px solid #ED5430;
+
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: -15px;
+ margin: auto;
+ }
+ }
+
+ & > .special-bottom-tip {
+ position: relative;
+ width: 200px;
+ height: 55px;
+ margin: 0 auto;
+ border-radius: 5px;
+ background-color: #0b0d10;
+ text-shadow: 0 0 4px rgba(55, 55, 55, 0.54);
+ color: #b6b6b6;
+ font-family: $prim-font;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 18px;
+ padding: 8px 15px;
+ text-align: center;
+ z-index: 10;
+ margin-top: 20px;
+
+ & > a {
+ color: #fc7234;
+ text-decoration: none;
+ }
+ }
+
+ & > .special-copyright {
+ position: relative;
+ margin: 0 auto;
+ text-shadow: 0 0 3px rgba(0, 0, 0, 1);
+ color: #b6b6b6;
+ font-family: $prim-font;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 18px;
+ padding: 8px 15px;
+ text-align: center;
+ z-index: 10;
+ margin-top: 20px;
+
+ & > span {
+ color: #6c00ff;
+ font-weight: bold;
+ }
+ }
+
+ @mixin rings($duration, $delay) {
+ opacity: 0;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ position: absolute;
+ top: -21%;
+ left: -21%;
+ right: 0;
+ bottom: 0;
+ content: '';
+ height: 125%;
+ width: 125%;
+ border: 11px solid rgba(0, 169, 221, .7);
+ border-radius: 100%;
+ animation-name: ripple;
+ animation-duration: $duration;
+ animation-delay: $delay;
+ animation-iteration-count: infinite;
+ animation-timing-function: cubic-bezier(.65,0,.34,1);
+ z-index: -1;
+ }
+
+ @keyframes ripple {
+ from {
+ opacity: 1;
+ transform: scale3d(0.75,0.75,1);
+ }
+
+ to {
+ opacity: 0;
+ transform: scale3d(1.5,1.5,1);
+ }
+ }
+
+ & > .special-ripple {
+ & > .request-loader {
+ position: relative;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ height: 123px;
+ width: 123px;
+ background: #00B4DB;
+ border-radius: 100%;
+ box-shadow: 0 0 20px 0 rgba(0,0,0,0.25);
+ margin: 0 auto;
+ margin-top: 35px;
+ text-align: center;
+ opacity: .9;
+ transition: .3s all;
+
+ &:hover {
+ opacity: 1;
+ background: #00BEEA;
+ }
+
+ img {
+ width: 60px;
+ margin-right: 5px;
+ }
+
+ &::after {
+ @include rings(3s, 0s);
+ }
+
+ &::before {
+ @include rings(3s, 0.5s);
+ }
+ }
+ }
+ }
+
+ .search {
+ margin-top: 20px;
+
+ & > form {
+ position: relative;
+
+ & > input {
+ width: 100%;
+ height: auto;
+ box-shadow: inset 0 0 5px 1px rgba(0, 0, 0, 0.6);
+ border: 1px solid rgba(6, 6, 6, 0.99);
+ background-color: #0f1012;
+ outline: none;
+
+ color: #D1D1D1!important;
+ font-family: $sec-font;
+ font-size: 16px;
+ font-weight: 600;
+ padding: 15px 20px;
+
+ &::placeholder {
+ color: #676767;
+ font-weight: 400;
+ }
+
+ &:focus + button + small {
+ opacity: .3;
+ }
+ }
+
+ & > button {
+ position: absolute;
+ padding: 0;
+ margin: 0;
+ background: none;
+ border: none;
+ right: 15px;
+ top: 10px;
+ width: 30px;
+ height: 30px;
+ opacity: 1;
+ transition: .3s opacity;
+
+ &::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background-image: url(icons/search.svg);
+ background-repeat: no-repeat;
+ background-size: 75%;
+ background-position: center center;
+ opacity: .3;
+ transition: all .3s;
+ }
+
+ &:hover {
+ &::before {
+ cursor: pointer;
+ background-image: url(icons/magnifier-tool.svg);
+ opacity: .9;
+ }
+ }
+ }
+
+ & > small {
+ position: absolute;
+ font-family: $sec-font;
+ font-size: 14px;
+ font-weight: bold;
+ top: 10px;
+ right: 50px;
+ background-color: #D1D1D1;
+ color: #080C0F;
+ padding: 1px 4px;
+ border-radius: 4px;
+ opacity: 0;
+ transition: opacity .3s;
+ }
+ }
+ }
+}
+
+@media (max-width: 1499px) {
+ #sidebar.col-s::after {
+ width: 303px;
+ }
+
+ #vk_groups {
+ max-width: 100%;
+ overflow: hidden;
+ border-radius: 3px;
+ }
+
+ #sidebar>.inner>.side-menu>nav>ul>li.with-dropdown>ul.dropdown>li>a>small {
+ font-size: 11px;
+ }
+
+ #sidebar>.inner>.statistics span.num {
+ font-size: 18px!important;
+ }
+
+ #sidebar>.inner>.statistics > div {
+ width: 75px!important;
+ }
+}
+
+/*
+ * FOOTER
+ */
+
+footer#footer {
+ & > .footer-content {
+ height: 320px;
+ background-color: #0B0D10;
+ padding: 45px 0;
+
+ & > .container {
+ position: relative;
+ }
+
+ .logo {
+ display: inline-block;
+ margin-top: 7px;
+
+ & > a > img {
+ width: 57px;
+ display: inline-block;
+ transition: .5s opacity ease-in;
+
+ &:hover {
+ opacity: .8;
+ }
+ }
+
+ & > div {
+ display: inline-block;
+ margin-left: 13px;
+ margin-top: 15px;
+ vertical-align: top;
+ }
+
+ h1 {
+ color: #ffffff;
+ font-family: $sec-font;
+ font-size: 20px;
+ font-weight: bold;
+ text-transform: uppercase;
+ letter-spacing: 0.1px;
+ margin: 0;
+
+ & > a {
+ color: white;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, .5);
+ text-decoration: none;
+
+ &:hover {
+ color: #da1b60;
+ }
+ }
+ }
+
+ h2 {
+ color: #888;
+ font-family: $sec-font;
+ font-size: 14px;
+ font-weight: bold;
+ text-transform: uppercase;
+ letter-spacing: 0.1px;
+ margin-top: 2px;
+ letter-spacing: -0.01px;
+ }
+ }
+
+ p.cowners-text {
+ width: 330px;
+ font-family: $prim-font;
+ color: #c1c6cf;
+ color: #929393;
+ line-height: 19px;
+ font-size: 14px;
+ text-align: left;
+ }
+
+ section.special {
+ position: absolute;
+ height: 380px;
+ width: 291px;
+ right: 18px;
+ top: -80px;
+ padding: 0;
+ z-index: 10;
+
+ & > .special-top-tip {
+ position: relative;
+ width: 285px;
+ height: 100px;
+ margin: 0 auto;
+ border-radius: 5px;
+ background-color: #0b0d10;
+ text-shadow: 0 0 4px rgba(55, 55, 55, 0.54);
+ color: #b6b6b6;
+ font-family: $prim-font;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 18px;
+ padding: 15px 15px;
+ text-align: center;
+ z-index: 10;
+
+ & > a {
+ color: #fc7234;
+ text-decoration: none;
+ }
+
+ &::before {
+ content: "";
+ width: 0;
+ height: 0;
+ border-left: 15px solid transparent;
+ border-right: 15px solid transparent;
+ border-top: 15px solid #0b0d10;
+
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: -15px;
+ margin: auto;
+ }
+ }
+
+ & > .special-bottom-tip {
+ position: relative;
+ width: 200px;
+ height: 55px;
+ margin: 0 auto;
+ border-radius: 5px;
+ background-color: #0b0d10;
+ text-shadow: 0 0 4px rgba(55, 55, 55, 0.54);
+ color: #b6b6b6;
+ font-family: $prim-font;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 18px;
+ padding: 8px 15px;
+ text-align: center;
+ z-index: 10;
+ margin-top: 20px;
+
+ & > a {
+ color: #fc7234;
+ text-decoration: none;
+ }
+ }
+
+ & > .special-copyright {
+ position: relative;
+ margin: 0 auto;
+ text-shadow: 0 0 3px rgba(0, 0, 0, 1);
+ color: #b6b6b6;
+ font-family: $prim-font;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 18px;
+ padding: 8px 15px;
+ text-align: center;
+ z-index: 10;
+ margin-top: 20px;
+
+ & > span {
+ color: #6c00ff;
+ font-weight: bold;
+ }
+ }
+
+ @mixin rings($duration, $delay) {
+ opacity: 0;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ position: absolute;
+ top: -21%;
+ left: -21%;
+ right: 0;
+ bottom: 0;
+ content: '';
+ height: 125%;
+ width: 125%;
+ border: 11px solid rgba(0, 169, 221, .7);
+ border-radius: 100%;
+ animation-name: ripple;
+ animation-duration: $duration;
+ animation-delay: $delay;
+ animation-iteration-count: infinite;
+ animation-timing-function: cubic-bezier(.65,0,.34,1);
+ z-index: -1;
+ }
+
+ @keyframes ripple {
+ from {
+ opacity: 1;
+ transform: scale3d(0.75,0.75,1);
+ }
+
+ to {
+ opacity: 0;
+ transform: scale3d(1.5,1.5,1);
+ }
+ }
+
+ & > .special-ripple {
+ & > .request-loader {
+ position: relative;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ height: 123px;
+ width: 123px;
+ background: #00B4DB;
+ border-radius: 100%;
+ box-shadow: 0 0 20px 0 rgba(0,0,0,0.25);
+ margin: 0 auto;
+ margin-top: 35px;
+ text-align: center;
+ opacity: .9;
+ transition: .3s all;
+
+ &:hover {
+ opacity: 1;
+ background: #00BEEA;
+ }
+
+ img {
+ width: 60px;
+ margin-right: 5px;
+ }
+
+ &::after {
+ @include rings(3s, 0s);
+ }
+
+ &::before {
+ @include rings(3s, 0.5s);
+ }
+ }
+ }
+ }
+ }
+
+ & > div.footer-copyright {
+ height: 80px;
+ line-height: 50px;
+ font-family: $prim-font;
+ color: #929393;
+ font-size: 14px;
+ background-color: #040506;
+
+ span {
+ color: #eee;
+ }
+
+ small {
+ color: #8AC547;
+ }
+ }
+}
+
+@media (max-width: 1499px) {
+ footer#footer>.footer-content section.special {
+ right: 5px;
+ }
+}
+
+@media (max-width: 1364px) {
+ #footer .container {
+ padding: 0 10px;
+ }
+
+ footer#footer>.footer-content section.special>.special-top-tip {
+ background-color: #ff8a00;
+ background: -webkit-gradient(linear,left top,right top,from(#ff8a00),to(#da1b60));
+ background: -o-linear-gradient(left,#ff8a00,#da1b60);
+ background: linear-gradient(to right,#ff8a00,#da1b60);
+ color: white!important;
+
+ & > a {
+ color: gold!important;
+ text-transform: uppercase;
+ font-weight: bold;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
+ }
+
+ &::before {
+ border-top: 15px solid #ED5430!important;
+ }
+ }
+
+ footer#footer>.footer-content p.cowners-text {
+ font-size: 16px;
+ line-height: 22px;
+ width: 450px;
+ }
+
+ footer#footer>.footer-content section.special>.special-bottom-tip {
+ background-color: rgba(0, 0, 0, .7);
+ }
+}
+
+@media (max-width: 991px) {
+ footer#footer>.footer-content section.special {
+ display: none;
+ }
+
+ footer#footer>.footer-content p.cowners-text {
+ font-size: 20px;
+ line-height: 24px;
+ }
+
+ footer#footer>.footer-content {
+ height: auto;
+ }
+
+ .footer-copyright {
+ text-align: center;
+ font-size: 16px!important;
+ }
+}
+
+@media (max-width: 750px) {
+ .footer-copyright .container {
+ padding: 0!important;
+ }
+
+ #paginator {
+ margin-top: 50px;
+ }
+
+ #paginator>.paginator-wrapper>.paginator-box {
+ transform: none!important;
+ height: auto;
+ width: auto;
+ background: transparent;
+ border: none;
+ }
+
+ #paginator>.paginator-wrapper>.paginator-box>.pb-start {
+ position: static;
+ text-align: center;
+ box-shadow: none;
+ background: transparent;
+ border: none;
+ }
+
+ #paginator>.paginator-wrapper>.paginator-box>.pb-start::before {
+ display: none;
+ }
+
+ #paginator>.paginator-wrapper>.paginator-box>.pb-end {
+ display: none;
+ }
+
+ #paginator>.paginator-wrapper>.paginator-box>.pb-start>nav>ul>li {
+ & > a {
+ font-size: 25px;
+ width: auto;
+ height: auto;
+ padding: 10px 20px;
+ margin: 5px;
+ }
+ }
+
+ footer#footer>.footer-content p.cowners-text {
+ width: auto;
+ }
+
+ .row {
+ margin-left: 0;
+ margin-right: 0;
+ }
+}
+
+/*
+ * ORPHUS.
+ */
+#orphus-popup {
+ background: #1F2326;
+ padding: 30px;
+ border-radius: 10px;
+ box-shadow: 0 0 150px rgba(0, 0, 0, 1);
+ position: fixed;
+ left: 0;top: 0;right: 0;bottom: 0;
+ margin: auto;
+ width: 750px;
+ height: 500px;
+ font-family: $prim-font;
+ font-size: 18px;
+
+ & > a {
+ display: block;
+ text-align: center;
+ margin-bottom: 10px;
+ }
+
+ & > h2 {
+ font-size: 20px;
+ color: #F24941;
+
+ & + div {
+ line-height: 1.3em;
+ font-size: 16px;
+ color: #88919D;
+ margin-bottom: 15px;
+
+ u {
+ font-weight: bold;
+ color: #F24941!important;
+ }
+
+ & + div {
+ line-height: 1.5em;
+ font-size: 17px;
+ color: #ddd;
+
+ & + form {
+ & > input {
+ font-size: 18px;
+ padding: 10px;
+ border-radius: 5px;
+ border: none;
+ background: #0F1012;
+ -webkit-box-shadow: inset 0 0 5px 1px rgba(0,0,0,.6);
+ box-shadow: inset 0 0 5px 1px rgba(0,0,0,.6);
+ border: 1px solid rgba(6,6,6,.99);
+ background-color: #0f1012;
+ outline: none;
+ color: #D1D1D1;
+ font-family: $prim-font;
+
+ & + div {
+ margin-top: 7px;
+
+ input {
+ background: #7DB042;
+ border: none;
+ padding: 10px 5px;
+ border-radius: 3px;
+ color: #eee;
+ text-transform: uppercase;
+ font-size: 14px;
+ font-family: $prim-font;
+ opacity: .9;
+ transition: .3s all;
+
+ &:last-child {
+ background: #0F1012;
+ color: silver;
+ opacity: .7;
+ }
+
+ &:hover {
+ cursor: pointer;
+ opacity: 1;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+}
+
+/*
+ * ADAPTIVE
+ */
+#slideout-open {
+ position: fixed;
+ left: 0;
+ bottom: 0;
+ z-index: 10;
+ width: 110px;
+ height: 100px;
+ text-align: center;
+ cursor: pointer;
+ transition: left .3s;
+ transition-timing-function: ease-in-out;
+ visibility: hidden;
+
+ & > .request-loader img:last-child {display: none;}
+
+ &.opened {
+ & > .request-loader img:first-child {display: none;}
+ & > .request-loader img:last-child {display: block;}
+ }
+
+ @mixin rings($duration, $delay) {
+ opacity: 0;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ position: absolute;
+ top: -9px;
+ left: -9px;
+ right: 0;
+ bottom: 0;
+ content: '';
+ height: 70px;
+ width: 70px;
+ border: 11px solid rgba(125,133,144, .7);
+ border-radius: 100%;
+ animation-name: ripple;
+ animation-duration: $duration;
+ animation-delay: $delay;
+ animation-iteration-count: infinite;
+ animation-timing-function: cubic-bezier(.65,0,.34,1);
+ z-index: -1;
+ }
+
+ @keyframes ripple {
+ from {
+ opacity: 1;
+ transform: scale3d(0.75,0.75,1);
+ }
+
+ to {
+ opacity: 0;
+ transform: scale3d(1.5,1.5,1);
+ }
+ }
+
+ &.special-ripple {
+ & > .request-loader {
+ position: relative;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ height: 75px;
+ width: 75px;
+ border-radius: 100%;
+ box-shadow: 0 0 20px 0 rgba(0,0,0,0.25);
+ margin: 0 auto;
+ margin-top: 15px;
+ text-align: center;
+ opacity: .9;
+ text-align: center;
+ line-height: 75px;
+ background-color: #ff8a00;
+ background: -webkit-gradient(linear,left top,right top,from(#ff8a00),to(#da1b60));
+ background: linear-gradient(to right,#ff8a00,#da1b60);
+
+ &:hover {
+ opacity: 1;
+ }
+
+ img {
+ width: 62px;
+ }
+
+ &::after {
+ @include rings(3s, 0s);
+ }
+
+ &::before {
+ @include rings(3s, 0.5s);
+ }
+ }
+ }
+}
+
+@media (max-width: 1364px) {
+ #sidebar {
+ display: none;
+ }
+
+ #slideout-open {
+ visibility: visible!important;
+ }
+}
+
+/*
+ * SLIDEOUT
+ */
+.slideout-menu {
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ width: 370px;
+ min-height: 100vh;
+ overflow-y: scroll;
+ overflow-x: hidden;
+ -webkit-overflow-scrolling: touch;
+ z-index: 0;
+ display: none;
+ background: #1F2326;
+
+ & > #sidebar-mobile {
+ & > .inner {
+ & > .statistics {
+ padding-top: 10px;
+ }
+ }
+ }
+}
+
+.slideout-menu-left {
+ left: 0;
+}
+
+.slideout-menu-right {
+ right: 0;
+}
+
+.slideout-panel {
+ position: relative;
+ z-index: 1;
+ background-color: #14171A; /* A background-color is required */
+ min-height: 100vh;
+}
+
+.slideout-open,
+.slideout-open body,
+.slideout-open .slideout-panel {
+ overflow: hidden;
+}
+
+.slideout-open .slideout-menu {
+ display: block;
+}
+
+/*
+ * BUTTONS & STUFF
+ */
+
+.btn {
+ display: inline-block;
+ background-color: #181e23;
+ color: #d1d1d1;
+ font-family: $sec-font;
+ text-decoration: none;
+ font-weight: bold;
+ letter-spacing: 0.2px;
+ font-size: 14px;
+ padding: 8px 15px;
+ border-radius: 3px;
+ margin: 0;
+ text-shadow: 0 0 3px rgba(0, 0, 0, .5);
+ transition: .3s all;
+
+ & > .label {
+ font-family: $sec-font;
+ text-align: center;
+ background: #31383F;
+ color: white;
+ font-size: 12px;
+ font-weight: bold;
+ text-shadow: none;
+ border-radius: 2px;
+ padding: 2px 5px;
+ margin-left: 5px;
+ opacity: .5;
+ transition: .7s all;
+ }
+
+ &.btn-darkblue:hover {
+ background-color: rgb(39,111,169);
+ color: white;
+
+ & > .label {
+ opacity: .9;
+ }
+ }
+
+ &.btn-orange:hover {
+ background-color: orange;
+ color: white;
+
+ & > .label {
+ opacity: .9;
+ }
+ }
+
+ &.btn-green:hover {
+ background-color: #41b14f;
+ background-image: -webkit-gradient(linear,left top,left bottom,from(#9ec14c),to(#41b14f));
+ background-image: linear-gradient(#9ec14c,#41b14f);
+ color: #fff;
+
+ & > .label {
+ opacity: 0.9;
+ }
+ }
+
+ // &.btn-blue:hover {
+ // background-color: #2096D2;
+ // background-image: -webkit-gradient(linear,left top,left bottom,from(#79C1E4),to(#2096D2));
+ // background-image: linear-gradient(#79C1E4,#2096D2);
+ // color: #fff;
+
+ // & > .label {
+ // opacity: 0.9;
+ // }
+ // }
+
+ &.btn-blue:hover {
+ background-color: #0BBFF5;
+ color: white;
+
+ & > .label {
+ opacity: .9;
+ }
+ }
+
+ &.btn-dark:hover {
+ background-color: darkslategray;
+ color: white;
+
+ & > .label {
+ opacity: .9;
+ }
+ }
+}
+
+/**
+ * ICONS.
+ */
+.icon {
+ &.icon-books {
+ background-image: url(/media/icons/upload/book.svg);
+ }
+
+ &.icon-downloads {
+ background-image: url(/media/icons/download.svg);
+ }
+}
+
+/**
+ * OTHER.
+ */
+[class*=hint--]:after {
+ color: #DDD;
+ text-transform: uppercase;
+ font-family: $sec-font;
+ font-size: 15px;
+ font-weight: 600;
+ padding: 13px;
+}
+
+.KICKASSELEMENT.KICKASShidden {
+ display: none!important;
+}
+
+@-webkit-keyframes ka-bg-alert-blink {
+ 0%, 49% {
+ background: rgba(0, 0, 0, .9);
+ border: 3px solid rgb(117, 209, 63);
+ color: #ff0000;
+ }
+ 50%, 100% {
+ background: rgba(0, 0, 0, .3);
+ border: 3px solid rgb(117, 209, 63);
+ color: rgb(134,191,69);
+ }
+}
+
+@-webkit-keyframes ka-activator-blink {
+ 0% {
+ opacity: 1;
+ }
+ 100% {
+ opacity: .3;
+ }
+}
+
+#activate-ka {
+ animation: ka-activator-blink 1.2s infinite;
+ animation-direction: alternate;
+ cursor: pointer;
+}
+
+#ka-info {
+ position: fixed;
+ left: 0;
+ bottom: 0;
+ background: rgba(8,12,15,.9);
+ border-radius: 10px;
+ padding: 15px 30px;
+ width: 500px;
+ margin: 20px;
+ display: none;
+ font-size: 0;
+ z-index: 998;
+
+ & > div {
+ display: inline-block;
+ width: 50%;
+ font-size: 16px;
+ font-family: $sec-font;
+ vertical-align: middle;
+
+ &:last-child {
+ width: 50%;
+ font-size: 30px;
+ text-align: center;
+
+ p {
+ margin: 0;
+ }
+
+ #ka-score {
+ color: rgb(0,191,8);
+ font-weight: bold;
+ }
+
+ small {
+ display: inline-block;
+ font-size: 14px;
+ width: 100px;
+ opacity: .7;
+ margin-top: 10px;
+ }
+ }
+ }
+
+ kbd {
+ color: #88DB47;
+ background-color: black;
+ padding: 5px 10px;
+ border-radius: 10px;
+ }
+
+ &.ka-new-ship-alert::before {
+ content: "НОВЫЙ КОРАБЛЬ!";
+ font-size: 40px;
+ font-weight: bold;
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ text-align: center;
+ padding-top: 50px;
+ z-index: 999;
+ color: rgb(134,191,69);
+ border-radius: 10px;
+ animation: ka-bg-alert-blink 1s infinite;
+ }
+}
+
+hr {
+ border: none;
+ border-top: 2px dotted #1D3D42;
+ background-color: transparent;
+ height: 1px;
+ width: 75%;
+}
+
+/**
+ * Chat Bro restyle.
+ */
+
+#chatbro {
+ height: 500px;
+ overflow: hidden;
+ position: relative;
+
+ &.is-loading {
+ &::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background-color: #1D2124;
+ background-image: url(/media/images/preloaders/loader.gif);
+ background-repeat: no-repeat;
+ background-position: center center;
+ z-index: 999;
+ transition: 1s opacity;
+ }
+
+ &::after {
+ content: "Загрузка ...";
+ position: absolute;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ margin: auto;
+ text-align: center;
+ width: 100px;
+ height: 50px;
+ line-height: 50px;
+ font-size: 16px;
+ z-index: 999;
+ transition: 1s opacity;
+ }
+
+ &.is-loaded {
+ &::before {
+ opacity: 0;
+ }
+
+ &::after {
+ opacity: 0;
+ }
+ }
+
+ &.is-loaded-finish {
+ &::before {
+ display: none;
+ }
+
+ &::after {
+ display: none;
+ }
+ }
+ }
+}
+
+.chatbro_header {
+ display: none;
+}
+
+.chatbro_body {
+ font-family: $prim-font!important;
+ border: none!important;
+}
+
+.chatbro_body {
+ position: relative!important;
+
+ &::before {
+ content: "";
+ background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0) 100%);
+ height: 26px;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ flex-shrink: 0;
+ z-index: 2;
+ pointer-events: none;
+ opacity: .3;
+ }
+
+ &::after {
+ content: "";
+ background: linear-gradient(to top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0) 100%);
+ height: 16px;
+ position: absolute;
+ flex-shrink: 0;
+ bottom: 57px;
+ left: 0;
+ right: 0;
+ pointer-events: none;
+ }
+}
+
+.chatbro_messages_block {
+ background: #1F2127!important;
+}
+
+.chatbro_message_image {
+ width: 30px!important;
+ height: 30px!important;
+}
+
+.chatbro_message_name, .chatbro_message_name > a {
+ font-size: 13px!important;
+}
+
+.chatbro_message_text {
+ color: #c1c6cf!important;
+ line-height: 18px!important;
+ font-size: 14px!important;
+ margin-top: 0!important;
+}
+
+.chatbro_message_td_message {
+ border-top: 1px dashed #0ef3f322!important;
+}
+
+.chatbro_messages .chatbro_message td {
+ padding: 12px 2px!important;
+}
+
+.chatbro_send_input_wrapper {
+
+}
+
+.chatbro_send_input_block {
+ position: relative!important;
+
+ .chatbro_send_button {
+ position: absolute!important;
+ left: 215px!important;
+ top: 0!important;
+ background: transparent!important;
+
+ &::before {
+ content: ""!important;
+ position: absolute!important;
+ left: -39px!important;
+ top: 9px!important;
+ width: 40px;
+ height: 42px;
+ background-image: url('/media/icons/enter-arrow.svg');
+ background-size: 50%;
+ background-position: center center;
+ background-repeat: no-repeat;
+ background-color: #2C3036;
+ fill: #6F798A;
+ }
+ }
+
+ .chatbro_open_smiles_button {
+ position: absolute!important;
+ left: 224px!important;
+ top: 0!important;
+ background: transparent!important;
+
+ &::before {
+ content: ""!important;
+ position: absolute!important;
+ left: 0!important;
+ top: 5px!important;
+ width: 46px;
+ height: 46px;
+ background-image: url('/media/icons/smile.svg');
+ background-size: 50%;
+ background-position: center center;
+ background-repeat: no-repeat;
+ background-color: #2C3036;
+ box-sizing: content-box;
+ border: 2px solid #0F0F12;
+ }
+ }
+
+ .chatbro_open_upload_button {
+ position: absolute!important;
+ left: 273px!important;
+ top: 0!important;
+ background: transparent!important;
+
+ &::before {
+ content: ""!important;
+ position: absolute!important;
+ left: 0px!important;
+ top: 5px!important;
+ width: 46px;
+ height: 46px;
+ background-image: url('/media/icons/photo-camera.svg');
+ background-size: 53%;
+ background-position: center center;
+ background-repeat: no-repeat;
+ background-color: #2C3036;
+ box-sizing: content-box;
+ border: 2px solid #0F0F12;
+ opacity: .6;
+ }
+
+ &:hover::before {
+ opacity: 1!important;
+ cursor: pointer;
+ }
+ }
+
+ .chatbro_send_input_wrapper {
+ padding: 0!important;
+ box-shadow: inset 0px 0px 4px #000000;
+ height: 50px!important;
+ width: 215px!important;
+ margin-top: 5px;
+ margin-left: 5px;
+
+ & > .chatbro_send_input {
+ width: 80%!important;
+ background: transparent!important;
+ cursor: text;
+ height: 45px!important;
+ overflow: hidden!important;
+ max-height: 50px!important;
+ padding: 8px 13px !important;
+ }
+ }
+}
+
+.chatbro_smiles_menu {
+ bottom: 60px!important;
+ right: 34px!important;
+}
+
+.emojione {
+ width: 20px;
+ display: inline;
+ vertical-align: middle;
+ margin: auto 2px;
+}
+
+.chatbro_loader_radial {
+ top: 18px!important;
+ left: -31px!important;
+ border-color: rgb(119, 119, 119) rgb(119, 119, 119) rgb(119, 119, 119) rgb(138,197,71)!important;
+}
+
+.chatbro_message_admin {
+ color: rgb(138,197,71);
+ opacity: 1!important;
+ border-radius: 3px!important;
+
+ &::before {
+ content: "АДМИН"!important;
+ }
+}
+
+@media (max-width: 1499px) {
+ .chatbro_send_input_block .chatbro_open_smiles_button::before {
+ width: 36px;
+ left: -1px!important;
+ }
+ .chatbro_send_input_block .chatbro_open_upload_button::before {
+ width: 36px;
+ left: -11px!important;
+ }
+ .chatbro_smiles_menu {
+ right: 14px!important;
+ }
+}
+
+.not-found {
+ background-color: #040304;
+ padding: 30px 50px;
+ margin-top: 5px;
+ font-family: $prim-font;
+ height: 500px;
+
+ background-image: url(/media/images/tenor.gif);
+ background-repeat: no-repeat;
+ background-position: 90% 50%;
+
+ h2 {
+ font-size: 40px;
+ color: white;
+ background: -webkit-gradient(linear,left top,right top,from(#ff8a00),to(#da1b60));
+ background: -o-linear-gradient(left,#ff8a00,#da1b60);
+ background: linear-gradient(to right,#ff8a00,#da1b60);
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ -webkit-box-decoration-break: clone;
+ box-decoration-break: clone;
+ text-shadow: none;
+ }
+
+ p {
+ max-width: 60%;
+ line-height: 1.5em;
+
+ span {
+ color: #F56C1A;
+ font-weight: bold;
+ }
+ }
+
+ small {
+ color: #555;
+ }
+
+ .search-f {
+ margin-top: 20px;
+ background: white;
+ width: 440px;
+
+ & > form {
+ position: relative;
+
+ & > input {
+ width: 442px;
+ height: 50px;
+ box-shadow: inset 0 0 5px 1px rgba(0, 0, 0, 0.6);
+ border: 1px solid rgba(6, 6, 6, 0.99);
+ background-color: #0f1012;
+ outline: none;
+
+ color: #D1D1D1;
+ font-family: $sec-font;
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 70.58px;
+ padding-left: 10px;
+ padding-right: 45px;
+ padding-right: 45px;
+
+ &::placeholder {
+ color: #676767;
+ font-weight: 400;
+ }
+
+ &:focus + button + small {
+ opacity: .3;
+ }
+ }
+
+ & > button {
+ position: absolute;
+ padding: 0;
+ margin: 0;
+ background: none;
+ border: none;
+ right: 10px;
+ top: 9px;
+ width: 30px;
+ height: 30px;
+ opacity: 1;
+ transition: .3s opacity;
+
+ &::before {
+ content: "";
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background-image: url(/media/icons/search.svg);
+ background-repeat: no-repeat;
+ background-size: 75%;
+ background-position: center center;
+ opacity: .3;
+ transition: all .3s;
+ }
+
+ &:hover {
+ &::before {
+ cursor: pointer;
+ background-image: url(/media/icons/magnifier-tool.svg);
+ opacity: .9;
+ }
+ }
+ }
+
+ & > small {
+ position: absolute;
+ font-family: $sec-font;
+ font-size: 14px;
+ font-weight: bold;
+ top: 10px;
+ right: 50px;
+ background-color: #D1D1D1;
+ color: #080C0F;
+ padding: 1px 4px;
+ border-radius: 4px;
+ opacity: 0;
+ transition: opacity .3s;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/css/styles.scss b/src/css/styles.scss
new file mode 100644
index 0000000..e5bb9f4
--- /dev/null
+++ b/src/css/styles.scss
@@ -0,0 +1,74 @@
+/*
+ SOME DEFAULT CSS.
+*/
+html, body {
+ margin: 0;
+ padding: 0;
+ min-height: 100vh;
+ min-width: 100vw;
+
+ background-color: #4C5062;
+ color: white;
+
+
+ &.assist-page {
+ background: rgb(24,123,123);
+ background: -moz-radial-gradient(circle, rgba(24,123,123,0.4906337535014006) 0%, rgba(13,15,19,1) 64%);
+ background: -webkit-radial-gradient(circle, rgba(24,123,123,0.4906337535014006) 0%, rgba(13,15,19,1) 64%);
+ background: radial-gradient(circle, rgba(24,123,123,0.4906337535014006) 0%, rgba(13,15,19,1) 64%);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#187b7b",endColorstr="#0d0f13",GradientType=1);
+
+ &.assist-active {
+ background: rgb(24,81,123);
+ background: -moz-radial-gradient(circle, rgba(24,81,123,0.6418942577030813) 0%, rgba(13,15,19,1) 64%);
+ background: -webkit-radial-gradient(circle, rgba(24,81,123,0.6418942577030813) 0%, rgba(13,15,19,1) 64%);
+ background: radial-gradient(circle, rgba(24,81,123,0.6418942577030813) 0%, rgba(13,15,19,1) 64%);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#18517b",endColorstr="#0d0f13",GradientType=1);
+ }
+
+ }
+}
+
+:root {
+ font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
+ font-size: 16px;
+ line-height: 24px;
+ font-weight: 400;
+
+ color: #0f0f0f;
+ background-color: #f6f6f6;
+
+ font-synthesis: none;
+ text-rendering: optimizeLegibility;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-text-size-adjust: 100%;
+}
+
+
+a {
+ color: #2A9CD0;
+ text-decoration: none;
+ font-weight: bold;
+
+ &:hover {
+ color: #1dabed;
+ text-decoration: underline;
+ }
+}
+
+/*
+ OVERRIDES.
+*/
+#wrapper {
+ padding: 0;
+ margin: 0;
+}
+
+#header, main {
+ padding: 0 30px;
+}
+
+select, input {
+ color: #ccc!important;
+}
\ No newline at end of file
diff --git a/src/functions.ts b/src/functions.ts
new file mode 100644
index 0000000..4cec82a
--- /dev/null
+++ b/src/functions.ts
@@ -0,0 +1,44 @@
+import { invoke } from "@tauri-apps/api/tauri"
+import { is_listening, isListening } from "@/stores"
+import { clearInterval, clearTimeout, setInterval, setTimeout } from 'worker-timers';
+
+setInterval(() => {
+ (async () => {
+ is_listening.set(await invoke("is_listening"));
+ })().catch(err => {
+ console.error(err);
+ });
+}, 1000);
+
+export function startListening() {
+ (async () => {
+ invoke('start_listening')
+ .then((message) => {
+ is_listening.set(true);
+ })
+ .catch((error) => {
+ is_listening.set(false);
+ console.error(error);
+ // alert("Ошибка: " + error);
+ })
+ })().catch(err => {
+ console.error(err);
+ });
+}
+
+export function stopListening(callback) {
+ (async () => {
+ invoke('stop_listening')
+ .then((message) => {
+ is_listening.set(false);
+ if(callback) {
+ callback();
+ }
+ })
+ .catch((error) => {
+ console.error(error);
+ })
+ })().catch(err => {
+ console.error(err);
+ });
+}
\ No newline at end of file
diff --git a/src/main.ts b/src/main.ts
new file mode 100644
index 0000000..be9c929
--- /dev/null
+++ b/src/main.ts
@@ -0,0 +1,13 @@
+// Klondike project old CSS file
+import "./css/main.scss";
+
+// App current CSS file
+import "./css/styles.scss";
+
+// deploy app
+import App from "./App.svelte";
+const app = new App({
+ target: document.getElementById("app"),
+});
+
+export default app;
\ No newline at end of file
diff --git a/src/pages/_layout.svelte b/src/pages/_layout.svelte
new file mode 100644
index 0000000..f307626
--- /dev/null
+++ b/src/pages/_layout.svelte
@@ -0,0 +1,12 @@
+
+
+
+
+
+
+
+ Микрофон
+ {microphone_label}
+
+
+
+
+
+ Нейросети
+ {nn_label}
+
+
+
+
+
+ Ресурсы
+ RAM {resources_ram_usage}mb
+
+ +Пожалуйста, перейдите в настройки и введите ключ Picovoice. +
+ Часть функций может работать некорректно.
+ Сообщайте обо всех найденных багах в наш телеграм бот. +
Он выдается бесплатно при регистрации в Picovoice Console.
Получить его можно на официальном сайте OpenAI.