:root{ --my-bg: rgb(170, 168, 161); --my-text-color: rgb(20, 15, 10); --my-secondary-text-color: rgba(160, 128, 105, 0.5); --my-pale: rgb(190,173, 158); --my-dark: rgb(36,21,14, 0.5); --my-accent: rgb(72, 80, 37); --my-button: rgba(255, 228, 214, 0.61); --my-gradpart-1: rgb(155, 154, 146); --my-gradpart-2: rgb(177,174,166); --my-gradpart-3: rgb(187, 185, 180); --cards-gap: 20px; --tg-theme-text-color: #000000; --tg-theme-section-header-text-color: #6d6d71; --tg-theme-header-bg-color: #efeff3; --tg-theme-hint-color: #999999; --tg-theme-section-bg-color: #ffffff; --tg-theme-bottom-bar-bg-color: #e4e4e4; --tg-theme-link-color: #2481cc; --tg-theme-accent-text-color: #2481cc; --tg-theme-destructive-text-color: #ff3b30; --tg-theme-button-text-color: #ffffff; --tg-theme-button-color: #2481cc; --tg-color-scheme: light; --tg-theme-bg-color: #ffffff; --tg-theme-secondary-bg-color: #efeff3; --tg-theme-subtitle-text-color: #999999; --tg-theme-section-separator-color: #eaeaea; --tg-viewport-height: 100vh; --tg-viewport-stable-height: 100vh; --tg-theme-button-lighter-color: var(var(--tg-theme-button-color)); --tg-theme-mod-bg-color: var(--tg-theme-bg-color); --tg-safe-area-inset-top: env(safe-area-inset-top, 0px); --tg-safe-area-inset-right: env(safe-area-inset-top, 0px); --tg-safe-area-inset-bottom: env(safe-area-inset-bottom, 0px); --tg-safe-area-inset-left: env(safe-area-inset-left, 0px); --grd_dissolve_horiz: linear-gradient(90deg, rgba(0, 0, 0, 1) 85%, transparent 100%); --grd_dissolve_vertic: linear-gradient(180deg, transparent 0px, black 17px, black calc(100% - 15px), transparent); --grd_dissolve_horiz_mini: linear-gradient(90deg, rgba(0, 0, 0, 1) calc(100% - 10px), transparent 100%); --grd_dissolve_horiz_micro: linear-gradient(90deg, rgba(0, 0, 0, 1) calc(100% - 7px), transparent 100%); --quick-features-height: 0px; --quick-view-height: 0px; --bg-fader: 0.3; --green-accent: rgb(23, 146, 35); --green-accent-light: transparent; --yellow-accent: rgb(198, 123, 0); --yellow-accent-light: transparent; --red-soft-accent: #ef5b5b; --header-and-search-box-size: 0px; --header-size: 0px; --s-opacity: 1; --album-button-slideoff: 0; --album-button-opacity: 1; }html{ scroll-behavior: smooth; font-family: Corm; overflow: hidden; }#bg{ background-color: black; background: url(../media/bg-full-c2.jpeg), url(../media/bg-preload.jpeg); filter: brightness(0.8) contrast(1) saturate(1) blur(0px) hue-rotate(0deg); -webkit-filter: brightness(0.8) contrast(1) saturate(1) blur(0px) hue-rotate(0deg); background-size: cover, cover; background-position: 50% 45%, 50% 45%; z-index: -1; }body{ margin: 0px; margin-block: 0px; color: white; overflow-y: scroll; -webkit-overflow-scrolling:touch; background: #8c8782; }#logo{ font-size: 60px; text-align: center; letter-spacing: 3px; font-variant: petite-caps; line-height: 50px; min-height: 50px;}@media screen and (max-width: 428px) { #logo{ min-height: 100px; }}#under-logo{ padding: 0px; font-size: 17px; justify-content: center; text-align: center; margin-top: 10px;}#all-holder{ height: 100%; grid-template-rows: 1fr max-content; opacity: 0;}#all-holder.ready{ opacity: 1;}#main{ display: grid; grid-template-rows: 20px max-content max-content max-content max-content 20px max-content; padding-top: 50px; padding-inline: 15px;}#main > grid:not(#cards), #footer > grid > grid:not(#listen-at){ mix-blend-mode: plus-lighter; color: rgb(90, 102, 56, 0.7); color: rgba(255, 228, 214, 0.61); opacity: 1;}#listen-at{ mix-blend-mode: hard-light; }#footer{ padding-bottom: 20px; padding-inline: 15px;}#upper-buttons{ justify-content: center; grid-gap: 6px; width: 100%; text-transform: uppercase; font-family: CormBold; isolation: isolate; color: var(--my-button); margin-top: 50px; min-height: 42px; }@media screen and (max-width: 450px) { }#upper-buttons > flex{ justify-content: center; padding: 12px; cursor: pointer; border-radius: 100px; font-size: clamp(12px, 3vw, 13px); border: 1px solid transparent; transition: border-color 400ms, filter 400ms; width: auto;}#upper-buttons > .selected{ border: 1px solid var(--my-button); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }@media (hover: hover) { #upper-buttons > flex:hover{ border: 1px solid var(--my-button); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }}#cards{ overflow-x: scroll; overflow-y: hidden; scroll-snap-type: inline mandatory; scroll-behavior: smooth; scroll-margin: 0; grid-template-columns: repeat(3, 100%); gap: var(--cards-gap); isolation: isolate; mix-blend-mode: none; margin-top: 10px; transition: 200ms transform; transform: scale(1); z-index: 1; }#cards.loading{ transform: scale(0.9);}.card{ scroll-snap-align: start; scroll-snap-stop: always; background: rgba(255, 228, 214, 0.1); color: white; padding: 15px; padding-bottom: 5px; border-radius: 12px; gap: 5px; max-height: var(--folded-height); transition: max-height 500ms, padding-bottom 500ms, backdrop-filter 500ms, -webkit-backdrop-filter 500ms, filter 500ms, -webkit-filter 500ms; box-sizing: border-box; backdrop-filter: blur(10px) opacity(0); -webkit-backdrop-filter: blur(10px) opacity(0); filter: opacity(0); -webkit-filter: opacity(0);}#cards:not(.loading) .card{ backdrop-filter: blur(10px) opacity(1); -webkit-backdrop-filter: blur(10px) opacity(1); filter: opacity(1); -webkit-filter: opacity(1);}.cards-white .card{ background: rgba(255,255,255,0.8); color: rgba(0,0,0,0.9);}.cards-darkred .card{ background: rgba(82, 53, 40, 0.1); color: rgb(255, 244, 244);}.cards-dark .card{ background: rgba(0, 0, 0, 0.09); color: rgb(255, 255, 255);}#scroll-dots{ justify-items: center; color: var(--my-button); transform: translateY(var(--album-button-slideoff));}#scroll-dots span{ font-size: 60px; opacity: 0.3; line-height: 15px; transition: transform 500ms;}#scroll-dots .current{ opacity: 0.5; transform: translateY(-12%) scale(1.5); }.card.expanded{ --rolling-height: 900px; max-height: min(900px, var(--rolling-height)); padding-bottom: 15px;}.card-header{ text-transform: uppercase; opacity: 0.8; justify-content: center;}#cards .photo{ width: 95px; height: 95px; border-radius: 10px;}.photo-feature{ }#last-release .photo{ transition: 200ms transform; cursor: pointer;}#last-release .photo:hover{ transform: scale(1.05);}.photo-desc{ align-content: center; line-height: 21px; hyphens: auto;}#last-release .photo-desc{ }.photo{ float: left; margin-right: 15px; margin-bottom: 10px;}#listen-at{ margin-top: 20px; opacity: 1; }#listen-at > flex{ justify-content: center; }#music, #social{ grid-auto-flow: column; justify-self: center; align-items: center; min-height: 60px;}#social-links{ text-align: center;}#music > *, #social > *{ padding: 15px; opacity: 0.6; cursor: pointer; transition: transform 200ms;}#music img:hover, #social img:hover{ transform: scale(1.1);}#listen-at img, #social img{ width: 30px; }#support-me, #buy-tracks{ justify-self: center; grid-auto-flow: column; grid-gap: 5px; margin-top: 20px; }#support-me, #buy-tracks, #listen-at, #inst-disclaimer{ font-family: CormLight; font-size: 16px;}#listen-at{ mix-blend-mode: plus-lighter;}#inst-disclaimer, #footer-notes, #inquiries{ font-size: 14px; opacity: 0.7; justify-content: center;}body[lang="en"] #inst-disclaimer{ display: none;}body[lang="en"] #support-me{ display: none;}body[lang="ru"] #buy-tracks{ display: none;}#inst-disclaimer{ font-size: 12px;}#footer-notes{ margin-top: 15px;}#inquiries{ margin-top: 15px; grid-gap: 5px;}#footer-notes span img{ width: 10px; margin-inline: 3px; margin-top: 2px; opacity: 0.6;}#inst-ico{ position: relative;}#inst-ico::after{ content: ''; color: white; display: block; position: absolute; left: 100%; top: 0; font-size: 20px;}.learn-more{ cursor: pointer; opacity: 0.7; hyphens: none;}greyed{ opacity: 0.6;}greyed a{ text-decoration: none; color: white; font-family: CormBold; font-size: 17px; display: inline-flex; grid-gap: 6px; align-items: center;}.dot{ padding-inline: 0px;}a{ text-decoration: none; color: inherit;}greyed img{ width: 14px;}#support-me a, #buy-tracks a{ text-decoration: none; color: unset;}#support-me a:hover, #buy-tracks a:hover{ color: white;}#buy-tracks a{ font-family: CormBold;}#lang-switch{ grid-gap: 10px; position: absolute; top: 20px; right: 20px; width: max-content; font-size: 20px; opacity: 0.3; mix-blend-mode: plus-lighter; align-items: center; cursor: pointer; transition: transform 300ms; transform: translateY(0px); }#lang-switch:hover{ opacity: 0.5;}#lang-switch > img{ width: 16px;}#lang-switch.outaway{ transform: translateY(-100px);}#main grid#listen-new-album{ color: black; background: rgba(255,255,255,0.6); filter: contrast(1.6); border-radius: 12px; justify-content: center; line-height: 38px; margin-top: 10px; font-size: 18px; grid-template-columns: max-content max-content; align-items: center; grid-gap: 5px; width: 100%; transform: translateY(var(--album-button-slideoff)); opacity: calc(var(--album-button-opacity) / 2); z-index: 0; cursor: pointer;}#listen-new-album img{ width: 12px; margin-inline: 3px; margin-top: 2px; opacity: 0.6; }#main grid#listen-new-album:hover{ }#listen-loc{ display: none;} .photo-feature img{ opacity: 0; transition: 0.5s opacity;}.photo-feature img.ready{ opacity: 1;}