@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');

@font-face {
  font-family: 'MTSans-BoldCondensed';
  font-style: normal;
  font-weight: 800;
  src: url('./fonts/MTSans-BoldCondensed.woff2') format('woff2');
}

@font-face {
  font-family: 'MTSans-RegularCondensed';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/MTSans-RegularCondensed.woff2') format('woff2');
}

@font-face {
  font-family: 'MTSans BlackCondensed';
  src: url('./fonts/MTSans-BlackCondensed.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: 'MTSans BlackExtended';
  src: url('./fonts/MTSans-BlackExtended.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'MTSans Bold';
  src: url('./fonts/MTSans-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'MTSans BoldCondensed';
  src: url('./fonts/MTSans-BoldCondensed.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'MTSans LightCondensed';
  src: url('./fonts/MTSans-LightCondensed.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'MTSans RegularCondensed';
  src: url('./fonts/MTSans-RegularCondensed.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'MTSans ThinCondensed';
  src: url('./fonts/MTSans-ThinCondensed.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
}

:root {
	--bg: #23262F;
	--color: #ffffff;
	--color-dark: #494b55;
	--bg-form: ;
	--btn-bg: #393B43;
	--btn-bg-hover: #494b53;
	--btn-bg-2: #FDDD2D;
	--btn-bg-2-hover: #c9b025;
	--footer-btn: #4C4E55;
	--footer-btn-hover: #61636A;
	--input-bg: rgb(0 0 0 / 21%);
	--input-span: rgb(255 255 255 / 5%);
	--input-span-color: #fffffff2;
	--input-check: #a1a1a1e8;
	--input-focus: rgb(0 0 0 / 41%);
	--shadow: #0000002b;
	--logo: #ffffff;
	--logo-hover: #ffffffb8;
	--service-hover: #4d5059;
	--select-bg: rgb(45 47 53);
	--rez-bg: #313339;
	--rez-btn: #393b43;
	--rez-btn-hover: #484b55;
	
	--flag-sssr: url(/template/images/flag_mini/sssr.svg);
	--flag-german: url(/template/images/flag_mini/german.svg);
	--flag-usa: url(/template/images/flag_mini/usa.svg);
	--flag-brit: url(/template/images/flag_mini/brit.svg);
	--flag-japan: url(/template/images/flag_mini/japan.svg);
	--flag-chine: url(/template/images/flag_mini/chine.svg);
	--flag-franc: url(/template/images/flag_mini/franc.svg);
	--flag-chech: url(/template/images/flag_mini/chech.svg);
	--flag-sveden: url(/template/images/flag_mini/sveden.svg);
	--flag-poland: url(/template/images/flag_mini/poland.svg);
	--flag-italy: url(/template/images/flag_mini/italy.svg);
	--flag-sssr: url(/template/images/flag_mini/sssr.svg);
	--flag-sbor: url(/template/images/flag_mini/sbor.svg);
	
	
	--type-lt-fillter: url(/template/images/flag_mini/lt_fill.svg);
	--type-lt: url(/template/images/flag_mini/lt.svg);
	--type-st-fillter: url(/template/images/flag_mini/st_fill.svg);
	--type-st: url(/template/images/flag_mini/st.svg);
	--type-tt-fillter: url(/template/images/flag_mini/tt_fill.svg);
	--type-tt: url(/template/images/flag_mini/tt.svg);
	--type-pt-fillter: url(/template/images/flag_mini/pt_fill.svg);
	--type-pt: url(/template/images/flag_mini/pt.svg);
}


* {
    margin: 0;
    padding: 0;
    list-style-type: none;
    box-sizing: border-box;
    font-family: 'Roboto Condensed', serif;
}

body {
	background-color: #181818;
	margin: 0;
	font-family: Rubik;
}
ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
	height: max-content;
}  
a {
	font-style: normal;
	font-weight: 600;
	font-family: Rubik, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	transition: .3s;
}  
input, textarea {outline:none;}


header {
    position: fixed;
    width: 100%;
    top: 0;
    box-sizing: border-box;
    z-index: 9;
    display: flex;
    justify-content: center;
    background: rgb(39 39 43 / 63%);
    backdrop-filter: blur(5px);
}
.top-menu {
    display: flex;
    justify-content: space-between;
    height: 5rem;
    width: 70%;
}
.top-menu>.left {
    display: flex;
    align-items: center;
}
.top-menu>.left>.logo {
    display: flex;
    transition: all .3s;
	color: #ffffff;
	font-size: 1.3rem;
}
.top-menu>.left>.logo>span {
	padding: 1rem 0rem;
	font-family: "MTSans BoldCondensed";
}
.top-menu>.left>.logo>span:last-child {
    padding-left: .4rem;
    color: #fab81b;
}
.top-menu>.left>.logo:hover {
    color: #fab81b;
}
.top-menu>.left>ul {
    display: flex;
    padding-left: 2rem;
}
.top-menu>.left>ul>li {
	position: relative;
	transition: .3s;
}
.top-menu>.left>ul>li>a {
    position: relative;
    color: #aaaaab;
    padding: 1rem .7rem;
    font-size: 1.1rem;
    transition: .3s;
    display: flex;
    align-items: center;
    font-family: "MTSans BoldCondensed";
}
.top-menu>.left>ul>li>a>svg {
	height: 15px;
}
.top-menu>.right {
    display: flex;
    align-items: center;
}
.top-menu>.right>ul {
    display: flex;
    align-items: center;
}
.top-menu>.right>ul>li>a {
    position: relative;
    color: #aaaaab;
    padding: 1rem .7rem;
    font-size: 1.1rem;
    transition: .3s;
    font-family: "MTSans BoldCondensed";
}
.top-menu>.right>.basket {
    color: #b7b7a1;
    padding: .5rem;
    width: 3rem;
    height: 3rem;
    font-size: 0.95rem;
    background: #ffffff24;
    border-radius: 0.2rem;
    transition: .2s;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.6rem;
    justify-content: center;
}
.top-menu>.right>.basket:hover {
    background: #fab81b;
    color: #000000;
}
.top-menu>.right>.basket>svg {
    width: 1.5rem;
}
.top-menu>.right>.basket>span {
    font-size: 1.1rem;
}
.top-menu>.right>a.active {
    background: #fab81b;
}

.top-menu>.left>ul>li>a:hover, .top-menu>.right>ul>li>a:hover {
    color: #fab81b;
}
.top-menu>.left>ul>li>a.active, .top-menu>.right>ul>li>a.active {
    color: #fab81b;
}
.top-menu>.left>ul>li>a:after, .top-menu>.right>ul>li>a:after {
	content: '';
    width: 100%;
    position: absolute;
    bottom: 0px;
    height: 2px;
    right: 50%;
    background: currentColor;
    -webkit-transform: scale(0, 0) translate(-50%, 0);
    transform: scale(0, 0) translate(-50%, 0);
    transition: color .0s ease-in-out, -webkit-transform .2s ease-in-out;
    transition: transform .2s ease-in-out, color .0s ease-in-out;
    transition: transform .2s ease-in-out, color .0s ease-in-out, -webkit-transform .2s ease-in-out;
	width: calc(100% - 2em);
}
.top-menu>.left>ul>li>a:hover:after, .top-menu>.right>ul>li>a:hover:after {
    -webkit-transform: scale(1, 1) translate(50%, 0);
    transform: scale(1, 1) translate(50%, 0);
}
.top-menu>.left>ul>li>a.active:after, .top-menu>.right>ul>li>a.active:after {
    -webkit-transform: scale(1, 1) translate(50%, 0);
    transform: scale(1, 1) translate(50%, 0);
}

.index-top {
    height: 100vh;
    background-image: url(/template/images/fon_index.png);
	background-attachment: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
    padding-bottom: 6rem;
}
.index-top.tanks {
    background-image: url(/template/images/fon_tanks.png);
}
.index-top.gold {
    background-image: url(/template/images/fon_gold.png);
}
.index-top.style {
    background-image: url(/template/images/fon_style.png);
}
.index-top.other {
    background-image: url(/template/images/fon_other.png);
}
.index-top.contact {
    background-image: url(/template/images/fon_help.png);
    height: 50vh;
    padding-bottom: 0;
    background-position: center;
}
.index-top.contact>h1 {
    font-size: 4rem;
}
.index-top:after {
	content: "";
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    height: 15vh;
    z-index: 1;
	bottom: 0;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), to(#000));
    background: linear-gradient(180deg, transparent 0, #000 100%);
}
.index-top>h1 {
    position: relative;
    font-size: 5rem;
    text-align: center;
    color: #F0F0F0;
    font-family: 'MTSans BlackCondensed';
    width: 90%;
    text-transform: uppercase;
}
.index-top>h3 {
    font-size: 1.5rem;
    font-family: 'MTSans-RegularCondensed';
    color: #fffceb;
    padding: 2rem 0rem;
    width: 70%;
    text-align: center;
}
.index-top>a {
    position: absolute;
    bottom: 9rem;
    font-size: 2.3rem;
    font-family: 'MTSans-RegularCondensed';
    color: #F0F0F0;
    background: rgb(255, 80, 0);
    padding: 1rem 2rem;
    border-radius: .5rem;
    font-weight: 300;
	z-index: 3;
}
.index-top>a:hover {
    color: #fff;
    background-color: #ff8200;
}

.index-box {
    width: 100%;
    margin: 0 auto;
    padding-top: 2rem;
	background: #000000;
}
.index-box>.top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 70%;
    margin: 0 auto;
}
.index-box>.top>h2 {
    color: #fffceb;
    font-size: 1.5rem;
    font-weight: 500;
    font-family: 'MTSans RegularCondensed';
	text-transform: uppercase;
}
.center {
    display: flex;
    gap: 1rem;
    padding-top: 2rem;
    width: 70%;
    margin: 0 auto;
}

.category-menu {
    width: 25%;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.category-menu>a {
    background: linear-gradient(90.22deg,rgba(255,255,255,.09) .18%,rgba(255,255,255,0) 99.81%);
    border-radius: 0.2rem .5rem .5rem 0.2rem;
    display: flex;
    align-items: center;
    padding: 0 .5rem;
    position: relative;
    height: 6rem;
    cursor: pointer;
    transition: .3s;
    border-left: .2875rem solid #f7a827;
}
.category-menu>a>span {
    font-family: 'MTSans-BoldCondensed';
    font-size: 1.2rem;
    color: #F0F0F0;
    padding-left: .7rem;
}
.category-menu>a>img {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
}
.category-menu>a:hover {
    background-color: #42424259;
}
.category-menu>a.active {
    border-left: .2875rem solid #ff5000;
    background: linear-gradient(88deg, rgb(255 80 0 / 20%) .18%, rgb(40 209 51 / 0%) 99.81%);
}

.product {
    width: 75%;
}
.product>section {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
.product>section>.item {
    position: relative;
    border-radius: .5rem;
    height: 225px;
    overflow: hidden;
    padding: 1rem;
    transition: .3s;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
}
.product>section>.item::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url(/template/images/fone_item.png);
	background-size: 100% 100%;
	left: 0;
	top: 0;
	z-index: 1;
}
.product>section>.item:hover {
    background-color: #4242421f;
}
.product>section>.item>.name {
    color: #FFFBED;
    font-family: 'MTSans-RegularCondensed';
    font-size: 1.5rem;
    position: relative;
    z-index: 2;
}
.product>section>.item>.other {
    position: relative;
    padding: .5rem 0;
    font-size: 1.2rem;
    display: flex;
    gap: .3rem;
    align-items: center;
    z-index: 2;
}
.product>section>.item>.other>.level {
    font-family: 'MTSans LightCondensed';
    color: #fff;
}

.product>section>.item>.other>.type {
    display: block;
    height: 1rem;
    width: 1rem;
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.product>section>.item>.other>.type.lt {
	background-image: var(--type-lt);
}
.product>section>.item>.other>.type.st {
	background-image: var(--type-st);
}
.product>section>.item>.other>.type.tt {
	background-image: var(--type-tt);
}
.product>section>.item>.other>.type.pt {
	background-image: var(--type-pt);
}

.product>section>.item>.other>.flag {
    display: block;
    height: 1.3rem;
    100%: 2rem;
    width: 1.8rem;
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
.product>section>.item>.other>.flag.sssr {
	background-image: var(--flag-sssr);
}
.product>section>.item>.other>.flag.german {
	background-image: var(--flag-german);
}
.product>section>.item>.other>.flag.usa {
	background-image: var(--flag-usa);
}
.product>section>.item>.other>.flag.brit {
	background-image: var(--flag-brit);
}
.product>section>.item>.other>.flag.japan {
	background-image: var(--flag-japan);
}
.product>section>.item>.other>.flag.chine {
	background-image: var(--flag-chine);
}
.product>section>.item>.other>.flag.franc {
	background-image: var(--flag-franc);
}
.product>section>.item>.other>.flag.chech {
	background-image: var(--flag-chech);
}
.product>section>.item>.other>.flag.sveden {
	background-image: var(--flag-sveden);
}
.product>section>.item>.other>.flag.poland {
	background-image: var(--flag-poland);
}
.product>section>.item>.other>.flag.italy {
	background-image: var(--flag-italy);
}
.product>section>.item>.other>.flag.sbor {
	background-image: var(--flag-sbor);
}

.product>section>.item>.flag {
    position: absolute;
    top: 0;
    right: 0;
    opacity: .5;
    z-index: 2;
    height: 94%;
}
.product>section>.item>.flag>img {
	height: 100%;
}
.product>section>.item>.images {
    position: absolute;
    top: 0;
    right: 1rem;
    z-index: 2;
    width: 52%;
    height: 100%;
    display: flex;
    align-items: center;
}
.product>section>.item>.images>img {
	width: 100%;
}
.product>section>.item>.cost {
    background: #323232;
    width: max-content;
    color: #f7a827;
    padding: .5rem .5rem;
    border-radius: .5rem;
    margin-top: .7rem;
    position: relative;
    z-index: 2;
}
.product>section>.item>.cost>span {
    font-family: 'MTSans LightCondensed';
    font-size: 1.2rem;
}
.product>section>.item>button {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    background: #2b2a2a;
    border: none;
    font-family: 'MTSans-RegularCondensed';
    font-size: 1.3rem;
    padding: .5rem 1rem;
    color: #d7d7d7;
    border-radius: .5rem;
    cursor: pointer;
    transition: .3s;
    z-index: 2;
}
.product>section>.item>button:hover {
    background: #f0401e;
    color: #fff;
}
.product>section>.item.clear-list {
   grid-column: 1 / 3;
   text-align: center;
   padding: 1rem;
   border-radius: .2rem;
   font-size: 1.2rem;
   font-family: "MTSans BoldCondensed";
   color: #fffcebcf;
   height: max-content;
   border-left: .2875rem solid #ff5000;
   background: linear-gradient(88deg, rgb(255 80 0 / 20%) .18%, rgb(40 209 51 / 0%) 99.81%);
}
.product>section>.item.clear-list::before {
   background-image: none;
}
.filter {
    display: flex;
    gap: .5rem;
    border-radius: 2rem;
    display: flex;
    padding: .3rem;
    justify-content: space-between;
}
.filter>.box {
    position: relative;
}
.filter>.box>button {
    position: relative;
    display: flex;
    text-transform: none;
    padding: .6rem 2.2rem .6rem 1.1rem;
    color: #b7b7a1;
    border-radius: .5rem;
    background: transparent;
    border: none;
    font-family: 'MTSans RegularCondensed';
    font-size: 1.1rem;
    transition: .3s;
    cursor: pointer;
    background: rgba(255,255,255,.09);
    height: 100%;
    align-items: center;
}
.filter>.box>button:hover {
    background: #424242;
    color: #F0F0F0;
}
.filter>.box>button::after {
    position: absolute;
    content: "";
    width: 13px;
    height: 13px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBkPSJNMjMzLjQgNDA2LjZjMTIuNSAxMi41IDMyLjggMTIuNSA0NS4zIDBsMTkyLTE5MmMxMi41LTEyLjUgMTIuNS0zMi44IDAtNDUuM3MtMzIuOC0xMi41LTQ1LjMgMEwyNTYgMzM4LjcgODYuNiAxNjkuNGMtMTIuNS0xMi41LTMyLjgtMTIuNS00NS4zIDBzLTEyLjUgMzIuOCAwIDQ1LjNsMTkyIDE5MnoiIGZpbGw9InJnYigyNTUgMjU1IDI1NSAvIDUwJSkiLz48L3N2Zz4=) no-repeat;
    right: 15px;
    background-position: center;
    top: 14px;
    transition: .3s;
}
.filter>.box>button:hover::after {
    transform: rotate(180deg);
	transition: .3s;
}
.filter>.box>.drops {
    position: absolute;
    right: 0;
    top: 100%;
    max-height: 0;
    transition: max-height .2s ease-in-out;
    overflow: hidden;
    z-index: 9;
}
.filter>.box>.drops>.show {
	margin-top: .5rem;
	background: rgb(23 23 23);
	width: max-content;
	border-radius: .5rem;
	padding: 1rem;
	margin-bottom: 5px;
	display: flex;
	flex-direction: column;
	gap: .5rem;
}
.filter>.box>.drops>.show.flag {
	display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
}
.filter>.box>.drops>.show.level {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
}
.filter>.box>.drops>.show>div {
    color: #b7b7a1;
    background: #ffffff12;
    display: flex;
    align-items: center;
    padding: 0 0.5rem 0 .5rem;
    position: relative;
    height: 2.5rem;
    cursor: pointer;
    transition: .3s;
    border-radius: .2rem 0.5rem 0.5rem 0.2rem;
    background-repeat: no-repeat;
    background-position-y: center;
    background-position-x: 10px;
    border-left: .2875rem solid #f7a827;
    font-family: 'MTSans RegularCondensed';
    font-size: 1.2rem;
}
.filter>.box>.drops>.show>div:hover {
    background-color: #63616199;
}
.filter>.box:hover .drops {
    max-height: 500px;
    transition: max-height .2s ease-in-out;
}
.filter>.box>.drops>.show.flag>div {
	padding: 0 0.5rem 0 3rem;
}

.filter>.box>.drops>.show.flag>div.sssr {
	background-image: var(--flag-sssr);
}
.filter>.box>.drops>.show.flag>div.german {
	background-image: var(--flag-german);
}
.filter>.box>.drops>.show.flag>div.usa {
	background-image: var(--flag-usa);
}
.filter>.box>.drops>.show.flag>div.brit {
	background-image: var(--flag-brit);
}
.filter>.box>.drops>.show.flag>div.japan {
	background-image: var(--flag-japan);
}
.filter>.box>.drops>.show.flag>div.chine {
	background-image: var(--flag-chine);
}
.filter>.box>.drops>.show.flag>div.franc {
	background-image: var(--flag-franc);
}
.filter>.box>.drops>.show.flag>div.chech {
	background-image: var(--flag-chech);
}
.filter>.box>.drops>.show.flag>div.sveden {
	background-image: var(--flag-sveden);
}
.filter>.box>.drops>.show.flag>div.poland {
	background-image: var(--flag-poland);
}
.filter>.box>.drops>.show.flag>div.italy {
	background-image: var(--flag-italy);
}
.filter>.box>.drops>.show.flag>div.sbor {
	background-image: var(--flag-sbor);
}

.filter>.box>.drops>.show.type>div {
	padding: 0 0.5rem 0 2rem;
	background-size: 14px;
}
.filter>.box>.drops>.show.type>div.lt {
	background-image: var(--type-lt-fillter);
}
.filter>.box>.drops>.show.type>div.st {
	background-image: var(--type-st-fillter);
}
.filter>.box>.drops>.show.type>div.tt {
	background-image: var(--type-tt-fillter);
}
.filter>.box>.drops>.show.type>div.pt {
	background-image: var(--type-pt-fillter);
}
.filter>.box>.drops>.show.level>div {
    justify-content: center;
}

.filter>.box>.drops>.show>div.active {
    border-left: .2875rem solid #19a322;
}
.filter>.box>.drops>.show>div.active::before {
    content: "";
    background: linear-gradient(88deg, rgb(40 209 51 / 11%) .18%, rgb(40 209 51 / 0%) 99.81%);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
}

.paginated {
    grid-column: 1 / 3;
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    padding-top: 1rem;
}
.paginated>a {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .5rem;
    border: none;
    font-family: 'MTSans RegularCondensed';
    font-size: 1.3rem;
    transition: .3s;
    cursor: pointer;
    background: rgba(255,255,255,.09);
    color: #b7b7a1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.paginated>a:not([disabled]):hover {
    background: #424242;
    color: #ffffff;
}
.paginated>.ellipsis {
	width: 2.5rem;
    height: 2.5rem;
    border-radius: .5rem;
    border: none;
    font-family: 'MTSans RegularCondensed';
    font-size: 1.3rem;
    transition: .3s;
    background: rgba(255,255,255,.09);
    color: #b7b7a1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(255 255 255 / 2%);
}
.paginated>a.active {
    color: #f7a827;
    background: #424242;
}
.title-block {
    width: 70%;
    margin: 0 auto;
    margin-top: 4rem;
}
.title-block>h1 {
    text-transform: uppercase;
    font-family: "MTSans BoldCondensed", sans-serif;
    line-height: 1.2;
    font-size: 1.5625rem;
    color: #f0f0f0e6;
    text-align: center;
    padding-bottom: 1rem;
}
.title-block>.text {
    padding: 1.875rem 0 .9375rem 1.875rem;
    background: linear-gradient(90.22deg, rgb(255 255 255 / 9%) .18%, rgba(255, 255, 255, 0) 99.81%);
    border-left: .2875rem solid #f7a827;
    border-radius: .2rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.title-block>.text>h2 {
    font-family: "MTSans BoldCondensed";
    color: #fffcebcf;
    font-size: 1.3rem;
    padding-bottom: 1rem;
}
.title-block>.text>p {
    font-family: "MTSans RegularCondensed",sans-serif;
    color: #fffcebcf;
    font-size: 1.2rem;
}
.title-block>.text>ul {}
.title-block>.text>ul>li {
    font-family: "MTSans RegularCondensed",sans-serif;
    color: #fffcebcf;
    list-style-type: disc;
    margin-left: 1.5rem;
    padding-bottom: .5rem;
}
.title-block>.text>ul>li>b {
    font-family: "MTSans RegularCondensed",sans-serif;
    font-weight: 300;
    padding-right: .2rem;
    font-family: "MTSans RegularCondensed", sans-serif;
}
.title-block>.text>h3 {
    font-family: "MTSans BoldCondensed";
    color: #fffcebcf;
}

footer {
    background: radial-gradient(127.55% 180.14% at 50% 170.59%, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 100%), #000;
    margin-top: 2rem;
}
footer>.footer {
    width: 70%;
    margin: 0 auto;
    margin-top: 2rem;
    padding: 2rem 0rem;
}
footer>.footer>a {
    width: max-content;
    margin: 0 auto;
    display: flex;
    transition: all .3s;
    color: #ffffff;
    font-size: 1.1rem;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
}
footer>.footer>a>img {
	width: 2rem;
}
footer>.footer>a>div {
	display: flex;
	gap: .5rem;
}
footer>.footer>a:hover {
    color: #f0401e;
}


footer>.footer>ul {
    display: flex;
    justify-content: center;
    gap: 2rem;
    padding: 1rem 0rem;
    margin: 1.5rem 0rem;
    border-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .1) 25%, rgba(255, 255, 255, .1) 75%, rgba(255, 255, 255, 0)) 1;
    border-top-width: 1px;
    border-style: solid;
}
footer>.footer>ul>li>a {
    position: relative;
    color: #aaaaab;
    padding: 1rem .7rem;
    font-size: 1rem;
    transition: .3s;
    display: flex;
    align-items: center;
    font-family: "MTSans RegularCondensed",sans-serif;
    font-weight: normal;
}
footer>.footer>ul>li>a:hover {
    color: #fab81b;
}
footer>.footer>ul>li>a.active {
    color: #fab81b;
}
footer>.footer>.text>span {
    color: #676c6f;
    font-family: "MTSans RegularCondensed", sans-serif;
    margin-bottom: 1rem;
    display: block;
    text-transform: uppercase;
    text-align: center;
}
footer>.footer>.text>p {
    color: #676c6f;
    font-family: "MTSans RegularCondensed", sans-serif;
    text-align: center;
}
footer>.footer>.text>p>a {
    color: #f7a827;
    text-transform: none;
    font-family: "MTSans RegularCondensed", sans-serif;
    font-weight: normal;
}
.search {
    display: flex;
    gap: .3rem;
    padding-left: 2rem;
    justify-content: flex-start;
}
.search>input {
    position: relative;
    display: block;
    text-transform: none;
    padding: .6rem;
    color: #b7b7a1;
    border-radius: .5rem;
    background: transparent;
    border: none;
    font-family: 'MTSans RegularCondensed';
    font-size: 1.1rem;
    transition: .3s;
    background: rgba(255, 255, 255, .09);
}
.search>input:hover, .search>input:focus {
	background: rgb(255 255 255 / 13%);
}
.search>button {
    position: relative;
    display: block;
    text-transform: none;
    padding: .6rem;
    color: #b7b7a1;
    border-radius: .5rem;
    background: transparent;
    border: none;
    font-family: 'MTSans RegularCondensed';
    font-size: 1.1rem;
    transition: .3s;
    cursor: pointer;
    background: rgba(255, 255, 255, .09);
}
.search>button:hover {
    background: #424242;
    color: #F0F0F0;
}

.list-filter-active {
    position: absolute;
    bottom: 110%;
    z-index: 5;
    background: rgba(255, 255, 255, .09);
    padding: .5rem;
    border-radius: .5rem;
    right: 0;
    max-width: 5rem;
    display: none;
}
.list-filter-active[name="flag"] {
    max-width: 100%;
}
.list-filter-active>.list {
    display: flex;
    gap: .2rem;
    flex-wrap: wrap;
}
.list-filter-active>.list>div {
    color: #b7b7a1;
    display: flex;
    font-size: .8rem;
    align-items: center;
}
.list-filter-active>.list>div.server {
    text-transform: uppercase;
}
.list-filter-active>.clear {
    width: 1.5rem;
    height: 1.5rem;
    position: absolute;
    top: -17px;
    right: -11px;
    background: #313030;
    color: #f7a827;
    padding: .4rem;
    border-radius: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: .3s;
}
.list-filter-active>.clear:hover {
    background-color: #63616199;
}


.list-filter-active>.type {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.list-filter-active>.type>div[data-type] {
	display: block;
    height: 0.8rem;
    width: 0.8rem;
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
.list-filter-active>.type>[data-type="lt"] {
	background-image: var(--type-lt-fillter);
}
.list-filter-active>.type>[data-type="st"] {
	background-image: var(--type-st-fillter);
}
.list-filter-active>.type>[data-type="tt"] {
	background-image: var(--type-tt-fillter);
}
.list-filter-active>.type>[data-type="pt"] {
	background-image: var(--type-pt-fillter);
}

.list-filter-active>.flag {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .3rem;
}
.list-filter-active>.flag>div {
    display: block;
    height: 1rem;
    100%: 2rem;
    width: 1.5rem;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    border-radius: .3rem;
}
.list-filter-active>.flag>[data-flag="sssr"] {
	background-image: var(--flag-sssr);
}
.list-filter-active>.flag>[data-flag="german"] {
	background-image: var(--flag-german);
}
.list-filter-active>.flag>[data-flag="usa"] {
	background-image: var(--flag-usa);
}
.list-filter-active>.flag>[data-flag="brit"] {
	background-image: var(--flag-brit);
}
.list-filter-active>.flag>[data-flag="japan"] {
	background-image: var(--flag-japan);
}
.list-filter-active>.flag>[data-flag="chine"] {
	background-image: var(--flag-chine);
}
.list-filter-active>.flag>[data-flag="franc"] {
	background-image: var(--flag-franc);
}
.list-filter-active>.flag>[data-flag="chech"] {
	background-image: var(--flag-chech);
}
.list-filter-active>.flag>[data-flag="sveden"] {
	background-image: var(--flag-sveden);
}
.list-filter-active>.flag>[data-flag="poland"] {
	background-image: var(--flag-poland);
}
.list-filter-active>.flag>[data-flag="italy"] {
	background-image: var(--flag-italy);
}
.list-filter-active>.flag>[data-flag="sbor"] {
	background-image: var(--flag-sbor);
}

.help {
    width: 70%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 3rem;
    padding: 2rem 0rem;
}
.help>h2 {
    position: relative;
    font-size: 2.5rem;
    color: #F0F0F0;
    font-family: 'MTSans BlackCondensed';
    text-transform: uppercase;
    padding-bottom: 1rem;
    grid-column: 1 / 3;
}
.help>section {width: 100%;}
.help>section>div {background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgba(255, 255, 255, 0) 99.81%);border-radius: 0.2rem .5rem .5rem 0.2rem;display: flex;padding: 0 .5rem;position: relative;transition: .3s;border-left: .2875rem solid #f7a827;display: flex;flex-direction: column;align-items: flex-start;padding: .8rem;margin-bottom: .7rem;}

.help>section>div>.block {
	
position: absolute;
	
width: max-content;
	
height: 2rem;
	
top: 7px;
	
left: .8rem;
	
display: flex;
	
align-items: center;
}
.help>section>div>.block>svg {
	
width: 1.7rem;
	
height: 1.7rem;
	
color: #fab81b;
}

.help>section>div>a {
    font-family: "MTSans BoldCondensed";
    color: #fffcebcf;
    font-size: 1.2rem;
    padding-bottom: .3rem;
    padding-left: 2.1rem;
}
.help>section>div>a:hover {
    color: #fab81b;
}
.help>section>div>p {
    color: #fffceb80;
    font-size: .9rem;
    padding-top: .5rem;
}
.help>section>.email {
}
.help>section>form>p {
    color: #fffcebcf;
    font-weight: 300;
    padding-right: .2rem;
    font-family: "MTSans RegularCondensed", sans-serif;
    padding-bottom: 1rem;
    font-size: 1.2rem;
}
.help>section>form>.form-block {
    display: flex;
    flex-direction: column;
    padding-bottom: 1rem;
}
.help>section>form>.succes-email {
    border-left: .2875rem solid #19a322;
    background: #ffffff12;
    height: 3rem;
    display: flex
;
    align-items: center;
    padding-left: 1rem;
    color: #19a322;
    border-radius: .2rem;
}
.help>section>form>.form-block>input {
    position: relative;
    display: block;
    text-transform: none;
    padding: .8rem 0.6rem;
    color: #b7b7a1;
    border-radius: .5rem;
    background: transparent;
    border: none;
    font-family: 'MTSans RegularCondensed';
    font-size: 1.1rem;
    transition: .3s;
    background: rgba(255, 255, 255, .09);
}

.help>section>form>.form-block>input:hover, .help>section>form>.form-block>input:focus {
	background: rgb(255 255 255 / 13%);
}
.help>section>form>.form-block>textarea {
    position: relative;
    display: block;
    text-transform: none;
    padding: .8rem 0.6rem;
    color: #b7b7a1;
    border-radius: .5rem;
    background: transparent;
    border: none;
    font-family: 'MTSans RegularCondensed';
    font-size: 1.1rem;
    transition: .3s;
    background: rgba(255, 255, 255, .09);
}
.help>section>form>.form-block>textarea:hover, .help>section>form>.form-block>textarea:focus {
	background: rgb(255 255 255 / 13%);
}
.help>section>form>button {
    background: #2b2a2a;
    border: none;
    font-family: 'MTSans-RegularCondensed';
    font-size: 1.2rem;
    padding: .8rem 1rem;
    color: #d7d7d7;
    border-radius: .5rem;
    cursor: pointer;
    transition: .3s;
}
.help>section>form>button:hover {
    background: #f0401e;
    color: #fff;
}

.help>section>form>.form-block>p {
    color: #676c6f;
    font-family: "MTSans RegularCondensed", sans-serif;
}
.help>section>form>.form-block>p>a {
    color: #f7a827;
    text-transform: none;
    font-family: "MTSans RegularCondensed", sans-serif;
    font-weight: normal;
}
.help>.footnote {
    grid-column: 1 / 3;
    font-family: "MTSans RegularCondensed", sans-serif;
    color: #fffcebcf;
    padding: 1rem 0rem;
}

#product {
    background: #0d0e10;
    padding-top: 5rem;
}
#product .index-box {
	background: none;
}

.store-box {
    display: flex;
    gap: 1rem;
    width: 70%;
    margin: 0 auto;
    flex-direction: column;
}
.store-box>.navigated {
    display: flex;
    gap: .3rem;
    width: 100%;
    border-bottom: 1px solid #a9a8a85c;
    padding-bottom: .5rem;
    font-size: 1rem;
}
.store-box>.navigated>a {
    color: #aaaaab;
    text-transform: none;
    font-weight: normal;
    font-family: 'MTSans-RegularCondensed';
}
.store-box>.navigated>span {
    color: #aaaaab;
    text-transform: none;
    font-family: "MTSans RegularCondensed", sans-serif;
    font-weight: normal;
    font-family: 'MTSans-RegularCondensed';
}

.store-box>.navigated>a:hover, .store-box>.navigated>a.active {
    color: #f7a827;
}

.store-box>.body {
    display: flex;
    gap: 2rem;
    max-height: 80vh;
}
.store-box>.body>.left {
    width: 55%;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-color: #a9a8a85c transparent;
    scrollbar-width: thin;
    padding-right: 1rem;
}
.store-box>.body>.left>.name {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.store-box>.body>.left>.name>h1 {
    color: #F7A827;
    font-family: 'MTSans-RegularCondensed';
    font-size: 2rem;
    position: relative;
}
.store-box>.body>.left>.name>.status {
    background: #1C1C1C;
    color: #F7A827;
    font-family: 'MTSans-RegularCondensed';
    font-size: 1.3rem;
    padding: .5rem 1rem;
    border-radius: .5rem;
}
.store-box>.body>.left>.name>.status.error {
    color: #cb3d3d;
}

.store-box>.body>.left>.other {
    display: flex;
    color: #fffceb;
    font-size: 1.3rem;
    font-weight: 500;
    font-family: 'MTSans RegularCondensed';
    align-items: center;
    padding: 1rem 0rem;
    border-bottom: 1px solid #a9a8a85c;
}
.store-box>.body>.left>.other>.type {
    font-family: 'MTSans RegularCondensed';
}
.store-box>.body>.left>.other>.level {
    font-family: 'MTSans RegularCondensed';
    padding-left: .3rem;
}
.store-box>.body>.left>.other>.flag {
    display: block;
    height: 1.5rem;
    width: 2rem;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    margin-left: .5rem;
    border-radius: 0.2rem;
}
.store-box>.body>.left>.other>.flag.sssr {
	background-image: var(--flag-sssr);
}
.store-box>.body>.left>.other>.flag.german {
	background-image: var(--flag-german);
}
.store-box>.body>.left>.other>.flag.usa {
	background-image: var(--flag-usa);
}
.store-box>.body>.left>.other>.flag.brit {
	background-image: var(--flag-brit);
}
.store-box>.body>.left>.other>.flag.japan {
	background-image: var(--flag-japan);
}
.store-box>.body>.left>.other>.flag.chine {
	background-image: var(--flag-chine);
}
.store-box>.body>.left>.other>.flag.franc {
	background-image: var(--flag-franc);
}
.store-box>.body>.left>.other>.flag.chech {
	background-image: var(--flag-chech);
}
.store-box>.body>.left>.other>.flag.sveden {
	background-image: var(--flag-sveden);
}
.store-box>.body>.left>.other>.flag.poland {
	background-image: var(--flag-poland);
}
.store-box>.body>.left>.other>.flag.italy {
	background-image: var(--flag-italy);
}
.store-box>.body>.left>.other>.flag.sbor {
	background-image: var(--flag-sbor);
}

.store-box .server {
    font-size: 1rem;
    margin-top: 1rem;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
    border-radius: .3rem;
    width: max-content;
    padding: .3rem .8rem .3rem 0.3rem;
    display: flex;
}
.store-box .server>p {
    font-family: 'MTSans-RegularCondensed';
    display: flex;
    color: #fffceb;
    font-size: 1rem;
    font-weight: 500;
    align-items: center;
}
.store-box .server>p>img {
    padding: 0.5rem 0.5rem;
    width: 2rem;
}

.store-box>.body>.slider {
    width: 50%;
}
.store-box>.body>.slider>h2 {
    color: #fffceb;
    font-size: 1.3rem;
    font-weight: 500;
    font-family: 'MTSans-RegularCondensed';
    padding-bottom: 1rem;
}
.store-box>.body>.slider>h2>span {
    color: #F7A827;
	text-transform: uppercase;
}
.store-box>.body>.slider>.box {}
.store-box>.body>.slider>.box>.images {
    overflow: hidden;
    border-radius: .5rem;
    position: relative;
}
.store-box>.body>.slider>.box>.images>button {
    position: absolute;
    height: 100%;
    width: 2.5rem;
    background: #23232324;
    border: none;
    background-repeat: no-repeat;
    background-size: 1rem;
    background-position: center;
    cursor: pointer;
	transition: .3s;
	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjU3IiBoZWlnaHQ9IjQ0OSIgdmlld0JveD0iMCAwIDI1NyA0NDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik05LjM3NSAyNDYuNjc1Qy0zLjEyNSAyMzQuMTc1IC0zLjEyNSAyMTMuODc1IDkuMzc1IDIwMS4zNzVMMjAxLjM3NSA5LjM3NDg4QzIxMy44NzUgLTMuMTI1MTIgMjM0LjE3NSAtMy4xMjUxMiAyNDYuNjc1IDkuMzc0ODhDMjU5LjE3NSAyMS44NzQ5IDI1OS4xNzUgNDIuMTc0OSAyNDYuNjc1IDU0LjY3NDlMNzcuMjc1IDIyNC4wNzVMMjQ2LjU3NSAzOTMuNDc1QzI1OS4wNzUgNDA1Ljk3NSAyNTkuMDc1IDQyNi4yNzUgMjQ2LjU3NSA0MzguNzc1QzIzNC4wNzUgNDUxLjI3NSAyMTMuNzc1IDQ1MS4yNzUgMjAxLjI3NSA0MzguNzc1TDkuMjc1IDI0Ni43NzVMOS4zNzUgMjQ2LjY3NVoiIGZpbGw9IiNBQUFBQUIiLz4KPC9zdmc+Cg==);
	backdrop-filter: blur(5px);
}
.store-box>.body>.slider>.box>.images>button.left {
    top: 0;
    left: 0;
    z-index: 2;
}
.store-box>.body>.slider>.box>.images>button.right {
    top: 0;
    right: 0;
    transform: rotate(180deg);
}
.store-box>.body>.slider>.box>.images>button:hover {
	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjU3IiBoZWlnaHQ9IjQ0OSIgdmlld0JveD0iMCAwIDI1NyA0NDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik05LjM3NSAyNDYuNjc1Qy0zLjEyNSAyMzQuMTc1IC0zLjEyNSAyMTMuODc1IDkuMzc1IDIwMS4zNzVMMjAxLjM3NSA5LjM3NDg4QzIxMy44NzUgLTMuMTI1MTIgMjM0LjE3NSAtMy4xMjUxMiAyNDYuNjc1IDkuMzc0ODhDMjU5LjE3NSAyMS44NzQ5IDI1OS4xNzUgNDIuMTc0OSAyNDYuNjc1IDU0LjY3NDlMNzcuMjc1IDIyNC4wNzVMMjQ2LjU3NSAzOTMuNDc1QzI1OS4wNzUgNDA1Ljk3NSAyNTkuMDc1IDQyNi4yNzUgMjQ2LjU3NSA0MzguNzc1QzIzNC4wNzUgNDUxLjI3NSAyMTMuNzc1IDQ1MS4yNzUgMjAxLjI3NSA0MzguNzc1TDkuMjc1IDI0Ni43NzVMOS4zNzUgMjQ2LjY3NVoiIGZpbGw9IiNGN0E4MjciLz4KPC9zdmc+Cg==);
	background-color: #2323234f;
}

.store-box>.body>.slider>.box>.images>.block {
    position: relative;
    display: flex;
    transition: .3s;
}
.store-box>.body>.slider[data-id="1"]>.box>.images>.block {
	left: 0%;
}
.store-box>.body>.slider[data-id="2"]>.box>.images>.block {
	left: -100%;
}
.store-box>.body>.slider[data-id="3"]>.box>.images>.block {
	left: -200%;
}
.store-box>.body>.slider[data-id="4"]>.box>.images>.block {
	left: -300%;
}

.store-box>.body>.slider[data-id="1"]>.box>.images>button.left, .store-box>.body>.slider[data-id="4"]>.box>.images>button.right {
	display: none;
}

.store-box>.body>.slider>.box>.images>.block>img {
    width: 100%;
    position: relative;
}

.store-box>.body>.slider>.menu {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    padding-top: 1rem;
}
.store-box>.body>.slider>.menu>div {
	cursor: pointer;
	position: relative;
}

.store-box>.body>.slider[data-id="1"]>.menu>div[data-id="1"]::before, .store-box>.body>.slider[data-id="2"]>.menu>div[data-id="2"]::before, .store-box>.body>.slider[data-id="3"]>.menu>div[data-id="3"]::before, .store-box>.body>.slider[data-id="4"]>.menu>div[data-id="4"]::before {
	background-color: rgb(0 0 0 / 0%);
    border: 1px solid #f7a827;
}


.store-box>.body>.slider>.menu>div:hover::before {
	background-color: rgb(0 0 0 / 0%);
    border: 1px solid #f7a827;
}
.store-box>.body>.slider>.menu>div::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
	width: 100%;
	height: 100%;
	border-radius: .3rem;
	transition: all .25s ease;
    background-color: rgba(0, 0, 0, .5);
}
.store-box>.body>.slider>.menu>div>img {
    width: 100%;
    border-radius: .3rem;
}
.store-box>.body>.slider>p {
    text-transform: none;
    color: #CBAC77;
    font-size: .9rem;
    font-family: 'MTSans RegularCondensed';
    font-weight: 500;
    padding-top: 1rem;
}
.list-store {
    padding: 2rem 0rem 1rem 0rem;
    border-bottom: 1px solid #a9a8a85c;
}
.list-store>h2 {color: #fffceb;font-size: 1.3rem;font-weight: 500;font-family: 'MTSans-RegularCondensed';}
.list-store>h2>span {
    color: #F7A827;
	text-transform: uppercase;
}
.list-store>section {
    padding-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.list-store>section>.top {
    display: flex;
    gap: .5rem;
}
.list-store>section>.top>.url {
    width: 60%;
    color: #FFFFFF;
    font-family: 'MTSans RegularCondensed';
    padding: .5rem 1rem;
    border-radius: .5rem;
    font-size: 1.1rem;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
}
.list-store>section>.top>.cost {
    width: 20%;
    color: #FFFFFF;
    font-family: 'MTSans RegularCondensed';
    padding: .5rem 1rem;
    border-radius: .5rem;
    text-align: center;
    font-size: 1.1rem;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
}
.list-store>section>.body {
    display: flex;
    gap: .5rem;
}
.list-store>section>.body>.url {
    width: 60%;
    color: #FFFFFF;
    font-family: 'MTSans RegularCondensed';
    padding: .5rem 1rem;
    border-radius: .5rem;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
}
.list-store>section>.body>.url>a {
    display: block;
    text-transform: none;
    color: #CBAC77;
    font-size: 1rem;
    font-family: 'MTSans RegularCondensed';
    font-weight: 500;
    overflow: hidden;
    width: 100%;
    white-space: nowrap;
}
.list-store>section>.body>.url>a:hover {
    color: #dfcba8;
}
.list-store>section>.body>.cost {
    width: 20%;
    color: #F7A827;
    font-family: 'MTSans RegularCondensed';
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
    padding: .5rem 1rem;
    border-radius: .5rem;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    white-space: nowrap;
}
.list-store>section>.body>.button {
    display: flex;
    align-items: center;
}
.list-store>section>.body>.button>button {
    color: #1C1C1C;
    background: #F7A827;
    font-size: 1.1rem;
    padding: .5rem 1.8rem;
    border-radius: .5rem;
    border: none;
    cursor: pointer;
    font-family: 'MTSans RegularCondensed';
	transition: .3s;
}
.list-store>section>.body>.button>button:hover {
	color: #1C1C1C;
    background: #f79900;
}
.list-store>p {
	text-transform: none;
    color: #CBAC77;
    font-size: .9rem;
    font-family: 'MTSans RegularCondensed';
    font-weight: 500;
	padding-top: .5rem;
}
.product-description {
    padding-top: 2rem;
    border-bottom: 1px solid #a9a8a85c;
    padding-bottom: 1rem;
}
.product-description>h2 {
    color: #fffceb;
    font-size: 1.3rem;
    font-weight: 500;
    font-family: 'MTSans-RegularCondensed';
}
.product-description>h2>span {
    color: #F7A827;
	text-transform: uppercase;
}
.product-description>.text {
    color: #cdcdcd;
    font-family: 'Roboto Condensed';
    padding: .5rem 1rem;
    border-radius: .5rem;
    font-size: 1rem;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
    margin-top: 1rem;
    line-height: 1.5rem;
}
.product-description>.text>h4 {
    font-family: 'MTSans RegularCondensed';
    font-weight: 400;
    font-size: 1.3rem;
    color: #fffceb;
}
.product-description>.text>p {
    font-family: 'Roboto Condensed';
    padding-top: .4rem;
    padding-bottom: .6rem;
}
.product-description>.text>p.list {
    font-family: 'Roboto Condensed';
    padding-top: .6rem;
    padding-bottom: .3rem;
    font-size: 1rem;
    color: #fffceb;
}
.product-description>.text>ol {
}
.product-description>.text>ol>li {
    position: relative;
    font-family: 'Roboto Condensed';
    padding-left: 0.8rem;
    display: flex;
    align-items: center;
}
.product-description>.text>ol>li::before {
	content: '';
	position: absolute;
	background: #27f756a1;
	font-size: 17px;
	font-family: 'Roboto Condensed';
	line-height: 1;
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	left: 0;
}
.product-description>.text>ol.none>li::before {
	content: '';
	background: #cb3d3d;
}


.product-description>.text>.gold {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    padding: 1rem 0rem;
}
.product-description>.text>.gold>.box-gold {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
    padding: .5rem;
    border-radius: .5rem;
}
.product-description>.text>.gold>.box-gold>img {
    width: 9rem;
}
.product-description>.text>.gold>.box-gold>p {
    text-align: center;
	font-size: .9rem;
	padding-top: .5rem;
}
.product-description>.text>.gold_2 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    padding: 1rem 0rem;
}
.product-description>.text>.gold_2>.box-gold {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
    padding: .5rem;
    border-radius: .5rem;
}
.product-description>.text>.gold_2>.box-gold>img {
    width: 3rem;
    height: auto;
    padding-right: .5rem;
}
.product-description>.text>.gold_2>.box-gold>p {
    text-align: center;
	font-size: .9rem;
	padding-top: .5rem;
}

ul {
  list-style: none;
}

.product-specifications {
    padding-top: 2rem;
}
.product-specifications>h2 {
    color: #fffceb;
    font-size: 1.3rem;
    font-weight: 500;
    font-family: 'MTSans-RegularCondensed';
}
.product-specifications>.box {
    margin-top: 1rem;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem 1rem;
}
.product-specifications>.box>section {
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
    padding: 1rem;
    border-radius: .5rem;
    height: max-content;
}
.product-specifications>.box>section>h3 {
    color: #fffceb;
    font-size: 1rem;
    font-weight: 500;
    font-family: 'MTSans-RegularCondensed';
    padding-bottom: .2rem;
    border-bottom: 1px solid #a9a8a85c;
    margin-bottom: .5rem;
}
.product-specifications>.box>section>ul>li {
    display: flex
;
    justify-content: space-between;
    border-bottom: 1px dashed #a9a8a85c;
    padding-bottom: .3rem;
}
.product-specifications>.box>section>ul>li:nth-last-child(1) {
	border-bottom: none;
}
.product-specifications>.box>section>ul>li>span {
    text-transform: none;
    color: #cdcdcd;
    font-size: .9rem;
    font-family: 'MTSans RegularCondensed';
    font-weight: 500;
    padding-top: .5rem;
}

.modal {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background: #0e0f10b3;
    backdrop-filter: blur(3px);
}
.modal>.overlay {
    position: relative;
    width: 25rem;
    margin: 0 auto;
    top: 9rem;
    background: rgb(21 21 21);
    padding: 1rem 1.5rem;
    border-radius: .5rem;
    box-shadow: 0px 0 14px 6px rgb(0 0 0 / 43%);
}

.modal>.overlay.show {
	transform: translateY(-150%);
	animation: show_animated .5s forwards;
}
@keyframes show_animated {
	0% {transform: translateY(-150%);}
	100% {transform: translateY(0);}
}
.modal>.overlay.delited {
    transform: translateY(0);
	animation: hide_animated .5s forwards;
}
@keyframes hide_animated {
	0% {transform: translateY(0);}
	100% {transform: translateY(-150%);}
}


.modal>.overlay>.svg {
    color: #CBAC77;
    width: 5rem;
    height: 4rem;
    margin: 0 auto;
    padding: 0rem 1rem 1rem 1rem;
}
.modal>.overlay>h1 {
    text-align: center;
    color: #CBAC77;
    font-family: 'MTSans-RegularCondensed';
    font-size: 2rem;
    position: relative;
}
.modal>.overlay>p {
    text-transform: none;
    color: #cdcdcd;
    font-size: 1.1rem;
    font-family: 'MTSans RegularCondensed';
    font-weight: 500;
    padding-top: .5rem;
    text-align: center;
}
.modal>.overlay>p.not {
    text-transform: uppercase;
    padding-top: 1rem;
}
.modal>.overlay>p>a {
    color: #F7A827;
    font-size: 1rem;
    font-family: 'MTSans RegularCondensed';
    font-weight: 500;
}
.modal>.overlay>.timer {
    width: 9rem;
    height: 7rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 1rem auto 0 auto;
    padding: .5rem;
    background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
    border-radius: .5rem;
}
.modal>.overlay>.timer>p {
    text-transform: none;
    color: #cdcdcd;
    font-size: 1rem;
    font-family: 'MTSans RegularCondensed';
    font-weight: 500;
    padding-top: .5rem;
    text-align: center;
}
.modal>.overlay>.timer>span {
    display: block;
    text-align: center;
    color: #CBAC77;
    font-family: 'MTSans-RegularCondensed';
    font-size: 4rem;
    position: relative;
}

@property --n {
  syntax: "<integer>";
  inherits: false;
  initial-value: 0;
}
@keyframes count {
  from { --n: 5; }
  to { --n: 0; }
}

.modal>.overlay>.timer>span::after{
  content: '';
  font-size: 4rem;
  text-align: center;
  animation: 5s linear count;
  animation-fill-mode: forwards;
  counter-reset: n calc(0 + var(--n));
  content: counter(n);
}
.modal>.overlay>.timer>span {
  place-self: center;
}


.modal>.overlay>.button {
    padding: 1rem 0 0rem 0;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    flex-direction: column-reverse;
}
.modal>.overlay>.button>button {
    color: #b7b7a1;
    background: #ffffff24;
    font-size: 1.3rem;
    padding: .7rem 2.5rem;
    border-radius: .5rem;
    border: none;
    cursor: pointer;
    font-family: 'MTSans RegularCondensed';
    transition: .3s;
}
.modal>.overlay>.button>button:hover {
    background: #ffffff42;
}
.modal>.overlay>.button>a {
    color: #1C1C1C;
    background: #F7A827;
    font-size: 1.3rem;
    padding: .7rem 2.5rem;
    border-radius: .5rem;
    border: none;
    cursor: pointer;
    font-family: 'MTSans RegularCondensed';
    transition: .3s;
    text-transform: capitalize;
    font-weight: 300;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.modal>.overlay>.button>a:hover {
    background: #f79900;
}
.subscription {color: #cb3d3d;padding: .5rem 1rem;border-radius: 0.1rem 0.5rem 0.5rem 0.1rem;font-size: 1rem;background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);margin-top: 1rem;line-height: 1.5rem;border-left: .2875rem solid #c50d0d;}
.subscription>p {
    font-family: 'MTSans-RegularCondensed';
    font-weight: 600;
}

.mobile, [menu-mobile] {
	display: none;
}

.mobile.show {
	transform: translateX(-120%);
	animation: show_animated_mobile .5s forwards;
}
@keyframes show_animated_mobile {
	0% {transform: translateX(-120%);}
	100% {transform: translateX(0);}
}
.mobile.hide {
	transform: translateX(0);
	animation: show_animated_mobile_closed .5s forwards;
}
@keyframes show_animated_mobile_closed {
	0% {transform: translateX(0);}
	100% {transform: translateX(-120%);}
}
[menu-mobile] {
	display: block;
	position: absolute;
	width: 1.7rem;
	height: auto;
	right: 1rem;
	top: 1.5rem;
	background: transparent;
	border: none;
	color: #fff;
	cursor: pointer;
}
[menu-mobile]:hover {
	color: #fab81b;
}
.mobile>.menu {
	position: absolute;
	width: 100%;
	height: 100vh;
	left: 0;
	top: 0;
	background: rgb(30 30 30);
	backdrop-filter: blur(5px);
}
.mobile>.menu>.top {
	height: 5rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.mobile>.menu>.top>[menu-mobile-closed] {
	position: absolute;
	width: 1.7rem;
	height: auto;
	right: 1rem;
	top: 1.5rem;
	background: transparent;
	border: none;
	color: #aaaaab;
	cursor: pointer;
}
.mobile>.menu>.top>[menu-mobile-closed]:hover {
	color: #fab81b;
}
.mobile>.menu>.top>.logo {
	display: flex;
    transition: all .3s;
	color: #ffffff;
	font-size: 1.3rem;
}
.mobile>.menu>.top>.logo>span {
	padding: 1rem 0rem;
	font-family: "MTSans BoldCondensed";
}
.mobile>.menu>.top>.logo>span:last-child {
    padding-left: .4rem;
    color: #fab81b;
}
.top-menu>.left>.logo:hover {
    color: #fab81b;
}


.mobile>.menu>.body>.menu {
	padding: 0rem 1rem;
	display: grid;
	gap: .5rem;
}
.mobile>.menu>.body>.menu>li>a {
	background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgba(255, 255, 255, 0) 99.81%);
	border-radius: 0.2rem .5rem .5rem 0.2rem;
	display: flex;
	align-items: center;
	padding: 0 .5rem;
	position: relative;
	height: 5rem;
	cursor: pointer;
	transition: .3s;
	border-left: .2875rem solid #f7a827;
}
.mobile>.menu>.body>.menu>li>a>span {
	font-family: 'MTSans-BoldCondensed';
	font-size: 1.2rem;
	color: #F0F0F0;
	padding-left: .7rem;
}
.mobile>.menu>.body>.menu>li>a>img {
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
}
.mobile>.menu>.body>.other {
	padding: 1rem;
	padding-left: 1rem;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}
.mobile>.menu>.body>.other>li>a {
	color: #b7b7a1;
	padding: .5rem 1rem;
	width: 100%;
	height: 3rem;
	font-size: 0.95rem;
	background: #ffffff24;
	border-radius: .5rem;
	transition: .2s;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.6rem;
	justify-content: center;
}
.mobile>.menu>.body>.other>li>a:hover {
	background: #fab81b;
	color: #000000;
}
.mobile>.menu>.body>.other>li>a>svg {
	width: 1.5rem;
}
[menu-mobile] {
	display: none;
}

@media (min-width: 1026px) and (max-width: 1440px){ }
@media (min-width: 1023px) and (max-width: 1025px){
	.index-top {
		background-size: auto 100%;
	}
	[menu-mobile] {
		display: none;
	}
	
	.index-box>.top {
		width: 90%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	.filter {
		padding: 0.5rem 0;
		width: 100%;
		justify-content: flex-end;
	}
	.category-menu {
		width: 32%;
	}
	.product {
		width: 68%;
	}
	.search>input, .filter>.box>button {
		width: 100%;
	}
	.filter>.box {
		position: relative;
		width: 15%;
	}
	.search {
        width: 40%;
    }
	.title-block, footer>.footer, .center, .top-menu {
		width: 90%;
	}
	
}
@media (min-width: 701px) and (max-width: 1023px){
	[menu-mobile] {
		display: block;
	}
	.mobile {
        display: flex;
        align-items: center;
        position: fixed;
        width: 100%;
        height: 100vh;
        transform: translateX(-120%);
    }
	.top-menu {
		width: 95%;
	}
	.top-menu>.left>ul, .top-menu>.right {
		display: none;
	}
	.index-box>.top {
		width: 95%;
		align-items: flex-start;
		flex-direction: column;
	}
	.index-box>.top>h2 {
		padding-bottom: 1rem;
	}
	.filter {
		display: flex;
		padding: .5rem 0;
		width: 100%;
		margin: 0 auto;
		justify-content: flex-start;
	}
	.search {
		padding-left: 0;
		justify-content: flex-start;
	}
	.search>input {
		width: 100%;
	}
	.center {
		width: 95%;
		flex-direction: column;
	}
	.category-menu {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
	.product {
		width: 100%;
	}
	.product>section {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.paginated {
		grid-column: 1 / 3;
	}
	.index-top {
		background-size: auto 100%;
	}
	.index-top>h1 {
		font-size: 4.5rem;
	}
	.category-menu>a {
		height: 4rem;
	}
	.product>section>.item>.images {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		height: 100%;
	}
	.product>section>.item>.images>img {
		width: 75%;
	}
	.title-block, footer>.footer, .help, .store-box {
		width: 95%;
	}
	.help>h2 {
		font-size: 1.7rem;
	}
	.top-menu>.left {
		width: 100%;
		justify-content: center;
	}
	.top-menu>.left>.logo {
		font-size: 2rem;
	}
	
	
	.store-box>.body>.slider>.box>.images>.block>img {
		min-width: 100%;
	}
	.store-box>.body {
		display: flex;
		flex-direction: column;
	}
	.store-box>.body>.left, .store-box>.body>.slider {
		width: 100%;
	}
	.store-box>.body {
        display: flex;
        flex-direction: column;
        max-height: 100%;
    }
	#product {
		background-attachment: fixed;
	}
	
	
}
@media screen and (max-width: 700px){
	[menu-mobile] {
		display: block;
	}
	.mobile {
        display: flex;
        align-items: center;
        position: fixed;
        width: 100%;
        height: 100vh;
        transform: translateX(-120%);
    }
	.top-menu {
		width: 100%;
		justify-content: center;
	}
	.top-menu>.left>ul {
		display: none;
	}
	.top-menu>.right {
		display: none;
	}
	.index-top>h1 {
		font-size: 2.5rem;
		width: 90%;
	}
	.index-top>h3 {
		width: 90%;
	}
	.index-top>a {
		bottom: 20%;
		font-size: 1.35rem;
		color: #ffffff;
	}
	.index-box>.top {
        flex-direction: column;
		width: 95%;
    }
	.index-box>.top>h2 {
		font-size: 1.7rem;
		font-weight: 600;
	}
	.filter {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1rem;
		width: 100%;
		padding: 0;
		padding-top: 1.5rem;
	}
	.filter>.box>button {
		width: 100%;
	}
	.filter>.box:nth-child(1n)>.drops {
        left: 0;
        right: auto;
    }
	.filter>.box:nth-child(2n)>.drops {
        right: 0;
        left: auto;
    }
	.filter>.box>.drops>.show>div {
		font-size: 1.1rem;
	}
	.list-filter-active {
		background: rgb(47 47 47);
	}
	.search {
		padding-left: 0;
		grid-column: 1 / 3;
	}
	.search>input {
		width: 100%;
	}
	.center {
		width: 95%;
		flex-direction: column;
	}
	.category-menu {
		width: 100%;
	}
	.category-menu>a {
		height: 3rem; 
	}
	.product {
		width: 100%;
	}
	.product>section {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
	.paginated {
		grid-column: 1 / 2;
		justify-content: center;
	}
	.product>section>.item>.images {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		height: 100%;
	}
	.product>section>.item>.images>img {
		width: 80%;
	}
	.title-block {
		width: 95%;
		margin: 0 auto;
		margin-top: 3rem;
	}
	.title-block>.text {
		padding: 1rem;
	}
	.title-block>.text>h2 {
		font-size: 1.1rem;
	}
	.title-block>.text>h3 {
		font-size: 1rem;
	}
	footer>.footer {
		width: 95%;
		padding: 1rem 0rem 2rem 0rem;
	}
	footer>.footer>ul {
        gap: 0rem;
        align-items: center;
        flex-wrap: wrap;
    }
	footer>.footer>ul>li>a {
		padding: .5rem .7rem .5rem .7rem;
		font-size: 1.2rem;
	}
	.list-filter-active>.clear {
		top: -19px;
		right: -9px;
	}
	.index-top.contact>h1 {
		font-size: 3rem;
	}
	.help {
        width: 95%;
        display: flex;
        flex-direction: column;
    }
	.help>h2 {
		font-size: 1.5rem;
		grid-column: 1 / 1;
	}
	.store-box {
		width: 95%;
	}
	.store-box>.navigated {
		font-size: .7rem;
	}
	.store-box>.body {
		max-height: 100%;
		flex-direction: column;
	}
	.store-box>.body>.slider, .store-box>.body>.left {
		width: 100%;
		padding-right: 0;
	}
	.store-box>.body>.left>.name {
		align-items: flex-start;
		flex-direction: column;
	}
	.product-specifications>.box {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
	.list-store>section>.body {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        background: linear-gradient(90.22deg, rgba(255, 255, 255, .09) .18%, rgb(255 255 255 / 3%) 99.81%);
        padding: .5rem;
        border-radius: .5rem;
    }
	.list-store>section>.body>.url {
		width: 100%;
	}
	.list-store>section>.body>.cost {
		width: 30%;
	}
	.list-store>section>.body>.button {
		width: 40%;
	}
	.list-store>section>.body>.button>button {
		width: 100%;
	}
	.list-store>section>.top {
		display: none;
	}
	
	.modal {
		position: fixed;
	}
	.modal>.overlay {
		height: 100%;
		top: 0;
		padding-top: 2rem;
	}
	#product {
		padding-top: 5rem;
		background-repeat: no-repeat;
		background-attachment: fixed;
	}
	.product-description>.text>.gold, .product-description>.text>.gold_2, .product-description>.text>.prem{
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
	.store-box>.body>.slider>h2 {
		text-align: center;
	}
}