body {
    font-family: Arial, sans-serif;
    background-color: #000000;
    margin: 0;
    padding: 0;
			;
}

.IncreaseSizeForMoble{
}



.container {
	max-width: 800px;
	margin: 20px auto;
	background-color: #fff;
	padding: 20px;
	border-radius: 8px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	height: auto;
}

.containingchapters{width: 100%; position: relative; max-width: 1324px;}

.year{display: contents;}
.hideyear{display: none;}

h1 {
		text-align: center;
}

.numbers {
	display: flex;
	justify-content: space-around;
	margin-top: 20px;
	display: grid;
}

.Sum0wrapper {


}

.sum1wrapper {
    text-align: center;
    padding-top: 4px;
    padding-bottom: 4px;
    margin-bottom: 7.5px;
    margin-top: 0px;
    min-width: 100%;
    max-width: min-content;
    border-radius: 0px;
    background-color: #f5f5f5a3;
    color: black;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    display: grid;
    grid-row-gap: 2px;
    position: relative;

    cursor: pointer;

    transition: background-color 0.2s ease,
                box-shadow 0.2s ease,
                transform 0.2s ease;
}

/* Hover only while acting as a button */
.sum1wrapper:not(.menu-open):hover {
    background-color: #ececec;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
    transform: translateY(-1px);
}

/* Optional: pressed effect */
.sum1wrapper:not(.menu-open):active {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}

/* Open: acts like a container */
.sum1wrapper.menu-open {
    cursor: default;
}

/* Buttons inside still show pointer */
.Sum2closebutton,
.sum1wrapper.menu-open button,
.sum1wrapper.menu-open [role="button"],
.sum1wrapper.menu-open a {
    cursor: pointer;
}

.sum1 {
    text-align: center;
    margin-bottom: 0px;
}

.sum2 {
    text-align: center;
    margin-bottom: 0px;
    grid-column: span 2;
	animation: fadein 1s ease-out;
}



.sum3 {
    z-index: 0;
    text-align: center;
    margin-bottom: 0px;
    grid-column: span 2;
    background-color: #104400;
    position: relative;
    right: 4px;
    border-left: 8px #0d3302 solid;
    height: 26px;
    width: 60px;
    color: white;
    border-radius: 4px 3px 6px / 2px 4px;
    line-height: 27.5px;
	background-image: linear-gradient(90deg, #0d3201 0%, /* Dark green on the left */ #194e19 25%, /* Lighter green */ #114a11 50%, /* Medium green */ #1d4e1d 75%, /* Lighter green */ #132a0c 100% /* Dark green on the right */);
	opacity:0;
	animation: reveal2 forwards 0.25s 0.4s ease-out;
}
.date1{
	text-align: center;
    margin-bottom: 0px;
    position: relative;
    right: 5px;
    font-size: 22px;
    line-height: 23.5px;
    max-height: 26px;
    width: 30px;
    border: black solid 2px;
    font-weight: bold;
    background-color: wheat;
	border-radius: 4px 3px 6px / 2px 4px;
}

.date1:hover{
	background-color:blue;
	cursor: pointer;
}

.date1::before {
	content: attr(date-mirror);
    display: block;
    text-align: center;
    margin-bottom: 0px;
    position: absolute;
    /* right: 5px; */
    font-size: 22px;
    line-height: 23.5px;
    max-height: 26px;
    width: 26px;
    z-index: -1;
    /* border: black solid 2px; */
    height: 21.5px;
    font-weight: bold;
    background-color: wheat;
    border-radius: 4px 3px 6px / 2px 4px;
    background: linear-gradient(315deg, rgb(255 201 100) 0%, rgba(245, 222, 179, 1) 87%, rgb(255 243 191) 100%);
}

.date2{
    text-align: center;
    position: relative;
    right: 0px;
    margin-bottom: 0px;
    grid-column: span 2;
    width: 60px;
    font-size: 24px;
    font-weight: bold;
	line-height: 23.5px;
    background-color: beige;
	background: linear-gradient(134deg, rgb(255 255 255) 0%, rgb(255 249 211) 87%, rgb(255 248 202) 100%);
    max-height: 26px;
    border: black 2px solid;
    border-radius: 4px 3px 6px / 2px 4px;
	opacity: 0;
    clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%, 0 32%);
	animation: revealdate2 forwards 0.25s 0.65s ease-out;
}
.date2::before {
    content: " ";
    background-color: #4f000000;
    height: 6.5px;
    width: 7.5px;
    position: absolute;
    border: solid 4px black;
    left: -9px;
    top: -9px;
    clip-path: polygon(0 0, 0% 100%, 100% 0);
    transform: rotate(225deg);
    clip-path: polygon(0 0, 0% 100%, 50% 50%);
}

@keyframes revealdate2 {
    0% {opacity:0; clip-path: polygon(90% 0, 100% 0, 100% 100%, 0 100%, 0 99999%);}
    100% {opacity:1; clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%, 0 32%);}
}

@keyframes revealsum2 {
    0% {opacity:0; clip-path: polygon(0 0, 1% 0, 1% 100%, 0% 100%);}
    100% {opacity:1; clip-path: polygon(100% 0, -100% 0, 0 210%, 100% 100%);}
}

.hidesum2 {
	display: none;
}

.sum2wrapper {
    display: none;
    grid-template-columns: repeat(1, 1fr);
    padding-top: 6px;
	padding-bottom: 2px;
	grid-row-gap: 3px;
	border-top: 1px black solid;
	height: auto;
            animation: slidedown 0.4s;

}

.sum2wrapper1 {
            animation: slidedown 0.25s, slidedownheight1 0.25s;
}

.sum2wrapper2 {
            animation: slidedown 0.3s, slidedownheight2 0.3s;
}

.sum2wrapper3 {
            animation: slidedown 0.35s, slidedownheight3 0.35s;;
}
.sum2wrapper10 {
            animation: slidedown 0.4s, slidedownheight10 0.4s, clipdownheight10 0.5s;
}
.sum2wrapper20 {
            animation: slidedown 0.4s, slidedownheight20 0.4s; clipdownheight20 0.5s;
}
.sum2wrapper30 {
            animation: slidedown 0.4s, slidedownheight30 0.4s; clipdownheight30 0.5s;
}

.sum2wrapper100 {
            animation: slidedown 0s, clipdownheight10 0.5s;
}
.sum2wrapper200 {
            animation: slidedown 0s, clipdownheight20 0.5s;
}
.sum2wrapper300 {
            animation: slidedown 0s, clipdownheight30 0.5s;
}

@keyframes slidedown {
    from { height: 0px; clip-path: polygon(0 0, 100% 0, 100% 1%, 0 1%); padding-top: 0px; padding-bottom: 0px;}
    to   { height: 128px; clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); padding-top: 6px; padding-bottom: 2px; }
}

@keyframes slidedownheight1 {
    from { height: 0px;}
    to   { height: 36.5px;;}
}

@keyframes slidedownheight2 {
    from { height: 0px;}
    to   { height: 67px;}
}

@keyframes slidedownheight3 {
    from { height: 0px;}
    to   { height: 99px;}
}

@keyframes slidedownheight10 {
    from { height: 36.5px;}
    to   { height: 128px;}
}

@keyframes slidedownheight20 {
    from { height: 67px;}
    to   { height: 128px;}
}

@keyframes slidedownheight30 {
    from { height: 99px;}
    to   { height: 128px;}
}

@keyframes clipdownheight10 {
    from { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
    to   { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
}

@keyframes clipdownheight20 {
    from { clip-path: polygon(0 0, 100% 0, 100% 51%, 0 51%);}
    to   { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
}

@keyframes clipdownheight30 {
    from { clip-path: polygon(0 0, 100% 0, 100% 35%, 0 35%)}
    to   { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
}

@keyframes clipdownheight40 {
    from { clip-path: polygon(0 0, 100% 0, 100% 1%, 0 1%)}
    to   { clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);}
}

.sum2wrapper.reverse-animation {
    animation: slideup 0.5s;
}

.sum2wrapper1.reverse-animation1 {
    animation: slideup 0.25s, slideupheight1 0.25s;
}

.sum2wrapper2.reverse-animation2 {
    animation: slideup 0.3s, slideupheight2 0.3s;
}

.sum2wrapper3.reverse-animation3 {
    animation: slideup 0.35s, slideupheight3 0.35s;
}

.sum2wrapper1.reverse-animation10 {
    animation: slideup 0.4s, slideupheight10 0.4s;
}

.sum2wrapper2.reverse-animation20 {
    animation: slideup 0.4s, slideupheight20 0.4s;
}
.sum2wrapper3.reverse-animation30 {
    animation: slideup 0.4s, slideupheight30 0.4s;
}

.reverse-animation10 {
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    animation: slideupheight10 0.4s;
}

.reverse-animation20 {
	clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);
    animation: slideupheight20 0.4s;
}
.reverse-animation30 {
	clip-path: polygon(0 0, 100% 0, 100% 35%, 0 35%);
    animation: slideupheight30 0.4s;
}

.sum2wrapper10.reverse-animation10 {
    animation: slideup 0.4s, slideupheight10 0.4s;
}

.sum2wrapper20.reverse-animation20 {
    animation: slideup 0.4s, slideupheight20 0.4s;
}
.sum2wrapper30.reverse-animation30 {
    animation: slideup 0.4s, slideupheight30 0.4s;
}

.no-animation .sum2wrapper1, 
.no-animation .sum2wrapper2, 
.no-animation .sum2wrapper3 {
  animation-play-state: paused; /* Pause animation when no-animation class is present */
}

@keyframes slideup {
    from { height: 128px; clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); padding-top: 6px; padding-bottom: 2px; }
    to   { height: 0px; clip-path: polygon(0 0, 100% 0, 100% 1%, 0 1%); padding-top: 0px; padding-bottom: 0px; }
}

@keyframes slideupheight1 {
    from { height: 36.5px; }
    to   { height: 0px; }
}

@keyframes slideupheight2 {
    from { height: 67px; }
    to   { height: 0px; }
}

@keyframes slideupheight3 {
    from { height: 99px; }
    to   { height: 0px; }
}

@keyframes slideupheight10 {
    from { height: 128px; }
    to   { height: 36.5px; }
}

@keyframes slideupheight20 {
    from { height: 128px; }
    to   { height: 67px; }
}
@keyframes slideupheight30 {
    from { height: 128px; }
    to   { height: 99px; }
}
.Sum2closebutton {
	position: absolute;
    top: 5px;
    right: 5px;
    background-color: #2d2d2d;
    color: white;
    border: none;
    padding: 5px;
    cursor: pointer;
    z-index: 10;
    border-radius: 5px;
    width: 28px;
    height: 28px;
    font-size: 15.5px;
	display:none;
}

.Sum2closebutton:hover {
	background-color: #ff4d4d;

	transition: background-color 0.15s;
}

.fade-out {
    animation: fadeOut 0.25s forwards;
}

@keyframes fadeOut {
    to { opacity: 0; }
}



.Sum2closebutton:active:after {
  opacity: 1;
  transition: 0.25s
}

.sum3wrapper{
	display: grid;
    grid-column: span 6;
    grid-template-columns: repeat(6, 1fr);
    padding-top: 3px;
    padding-bottom: 2px;
    grid-row-gap: 3px;
	grid-template-rows: repeat(auto-fill, minmax(25.5px, 25.5px));
    border-top: 1px black solid;
    max-height: 100px;
    height: 88.5px;
    overflow-y: auto;
    clip-path: polygon(0 0, 100% 0, 100% 1%, 0 1%);
    animation: fadein 0.75s ease-out, clipdownheight40 0.5s 0.15s forwards ease-out;
}

.hidesum3wrapper{
	display: none;
}

.CategoryIcon1{
	position: relative; /* Ensure relative positioning for absolute children */
    display: inline-block; /* Ensures the element takes only the space it needs */
	text-align: center;
	height: 27.43px;
	margin-bottom: 0px;
	grid-column: span 1;
	font-size: 130%;
	background-color: white;
    border-radius: 10px;
	cursor: pointer;
	transition: background-color 0.1s ease;
	animation: fadein 1s ease-out;
	z-index: 1;
}

.CategoryIcon2{
	position: relative; /* Ensure relative positioning for absolute children */
    display: inline-block; /* Ensures the element takes only the space it needs */
	text-align: center;
	margin-bottom: 0px;
	grid-column: span 1;
	font-size: 117%;
	background-color: white;
    border-radius: 10px;
	cursor: pointer;
	z-index: 1;
	border-radius: 4px 3px 6px / 2px 4px;
	height: 26px;
	width: 26px;
	transition: background-color 0.1s ease;
}



.CategoryIcon2 {
	background: linear-gradient(330deg, rgb(45 77 253) 0%, rgb(135 206 255) 32%, rgb(23 56 155) 70%, rgb(51 170 255) 100%);
    transition: opacity 0.15s ease;
}

.CategoryIcon2::before {
    content: "❓";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.CategoryIcon2::after {
    content: "❓";
    opacity: 0;
	background: linear-gradient(330deg, rgba(179, 245, 231, 1) 0%, rgb(255 255 255) 32%, rgb(186 220 255) 70%, rgba(214, 179, 245, 1) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.15s ease;
}

.CategoryIcon2:hover::after {
    opacity: 1;
}




.hideCategoryIcon{
	display:none;
}

.TheatreIcon{background-color: #810020;}
.CantoIcon{background-color: #00bfff;}
.AliensIcon{background-color: #600096;}

.FoodIcon{background-color: #663500;}
.HouseIcon{background-color: #0093ff;}
.GiftsIcon{background-color: green;}
.ClothesIcon{background-color: #9370db;}
.UpkeepIcon{background-color: #000;}
.HealthIcon{background-color: #ffaeda;}
.StudioIcon{background-color: #1e90ff;}
.OtherIcon{background-color: #007676;}

.MeatIcon{background-color: #742424;}




.CategoryIcon1:hover {background-color: white; transition:} 
.CategoryIcon2:hover {background-color: white; transition:} 






.AfarăIcon {
	background: linear-gradient(330deg, rgb(45 77 253) 0%, rgb(135 206 255) 32%, rgb(23 56 155) 70%, rgb(51 170 255) 100%); background: linear-gradient(330deg, rgb(45 77 253) 0%, rgb(135 206 255) 32%, rgb(23 56 155) 70%, rgb(51 170 255) 100%);
    transition: background 2s;
}

.AfarăIcon::before {
    content: "🪄";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.AfarăIcon::after {
    content: "🪄";
    opacity: 0;
    background: linear-gradient(330deg, #9af96d 0%, #eeffd5 32%, #018231 70%, #fff0d1 100%); background: linear-gradient(330deg, #786df9 0%, #e7d5ff 32%, #7f7afa 70%, #fbd1ff 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.15s ease;
}

.AfarăIcon:hover::after {
    opacity: 1;
}




.ȘcoalăIcon {
    background: linear-gradient(180deg, #1fc9f1 8%, #98e4ff 35%, #29bdc8 66%, #beff71 65%, #ffffff 47%, rgb(0 202 204) 60%, #006d72 100%);
    transition: background 2s;
}

.ȘcoalăIcon::before {
    content: "✨️";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ȘcoalăIcon::after {
    content: "✨";
    opacity: 0;
    background: linear-gradient(180deg, #fdfda1 19%, #ffffff 40%, #f7e9bd 65%, #adffc0 63%, #ffecb0 30%, rgb(255 222 116) 88%, #fff5b2 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.15s ease;
}

.ȘcoalăIcon:hover::after {
    opacity: 1;
}







.GrădiIcon {
	background: linear-gradient(330deg, rgb(45 253 116) 0%, rgb(166 255 135) 32%, rgb(133 183 0) 70%, rgb(209 255 58) 100%);
    transition: background 2s;
}

.GrădiIcon::before {
    content: "🎈";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.GrădiIcon::after {
    content: "🎈";
    opacity: 0;
	background: linear-gradient(330deg, rgb(245 234 179) 0%, rgb(232 242 0) 32%, rgb(255 246 186) 70%, rgb(255 210 30) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.15s ease;
}

.GrădiIcon:hover::after {
    opacity: 1;
}




.ManIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.ManIcon::before {
    content: "🕺";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ManIcon::after {
    content: "🕺";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ManIcon:hover::after {
    opacity: 1;
}

.WomanIcon {
background: linear-gradient(0deg, #3a00bd 0%, #c7c9ff 65%, #ff0000 30%, rgb(116 101 167) 65%, #230094 100%);
    transition: background 2s;
}

.WomanIcon::before {
    content: "💃";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.WomanIcon::after {
    content: "💃";
    opacity: 0;
    background: linear-gradient(0deg, #ff0000 0%, #ffedc6 65%, #ff0000 30%, rgb(255 84 208) 65%, #f4ff6e 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.WomanIcon:hover::after {
    opacity: 1;
}

.BoyIcon{background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);}


.BoyIcon::before {
    content: "👨‍🏫";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.BoyIcon::after {
    content: "👨‍🏫";
    opacity: 0;
    background: linear-gradient(0deg, #fff 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.BoyIcon:hover::after {
    opacity: 1;
}

.GirlIcon {
background: linear-gradient(0deg, #df68e9 0%, #c7e5ff 65%, #ff0000 30%, rgb(253 142 228) 65%, #862096 100%);
    transition: background 2s;
}

.GirlIcon::before {
    content: "👩‍🏫";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.GirlIcon::after {
    content: "👩‍🏫";
    opacity: 0;
    background: linear-gradient(0deg, #fff 0%, #c7e5ff 65%, #ff0000 30%, rgb(253 142 228) 65%, #862096 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.GirlIcon:hover::after {
    opacity: 1;
}

.LidlIcon{background: linear-gradient(330deg, #0050aa 0%, #0050aa 32%);} .LidlIcon::after{content:" "; background: linear-gradient(330deg, #ffffff 0%, #ffffff 32%); z-index:-1;} 
.LidlIcon::before{content:"-"; color:#00000000; display: block; background-size: 26px; background-image: url('data:image/svg+xml,%3Csvg version="1.1" xmlns="http://www.w3.org/2000/svg" width="26px" height="26px" style="display:%20block;%20border-radius:%2020px;" viewBox="0%200%2060%2060"%3E%3Cpath fill="%230050aa" d="M0.522 0.522h58.957v58.957h-58.957z"%3E%3C/path%3E%3Cpath fill="%23fff" d="M59.478 0.522v58.957h-58.957v-58.957h58.957zM60 0h-60v60h60v-60z"%3E%3C/path%3E%3Cpath fill="%23fff000" d="M30 3.85c-14.442 0-26.15 11.708-26.15 26.15s11.708 26.15 26.15 26.15c14.438 0 26.144-11.702 26.15-26.139v-0.001c0-14.444-11.706-26.154-26.149-26.16h-0.001z"%3E%3C/path%3E%3Cpath fill="%23e60a14" d="M28.377 30.736l-4.617-4.617-5.322 5.332v1.79l1.341-1.346 3.715 3.725-1.372 1.367 0.892 0.897 7.43-7.44v-1.784l-2.066 2.077z"%3E%3C/path%3E%3Cpath fill="%230050aa" d="M6.824 25.148h8.223v1.774h-1.372v5.739l4.763-2.65v4.857h-11.614v-1.784h1.377v-6.162h-1.377v-1.774zM41.494 25.148v1.774h1.377v6.162h-1.377v1.784h11.624v-4.857l-4.769 2.65v-5.739h1.377v-1.774h-8.233z"%3E%3C/path%3E%3Cpath fill="%23e60a14" d="M23.082 19.623c1.616 0 2.927 1.31 2.927 2.927s-1.31 2.927-2.927 2.927c-1.616 0-2.927-1.31-2.927-2.927 0-0.004 0-0.007 0-0.011v0.001c0 0 0 0 0 0 0-1.611 1.306-2.917 2.917-2.917 0.004 0 0.007 0 0.011 0h-0.001z"%3E%3C/path%3E%3Cpath fill="%23e60a14" d="M30 2.087c-0.002 0-0.003 0-0.005 0-15.419 0-27.918 12.499-27.918 27.918s12.499 27.918 27.918 27.918c15.417 0 27.915-12.496 27.918-27.913v-0c-0.003-15.417-12.497-27.915-27.912-27.923h-0.001zM30 56.155c-14.442 0-26.15-11.708-26.15-26.15s11.708-26.15 26.15-26.15c14.442 0 26.15 11.708 26.15 26.15 0 0.004 0 0.007 0 0.011v-0.001c-0.012 14.434-11.714 26.131-26.149 26.134h-0z"%3E%3C/path%3E%3Cpath fill="%230050aa" d="M36.913 25.148h-7.826v1.774h1.372v6.162h-1.388v1.784h7.826c5.812 0 5.885-9.72 0.016-9.72z"%3E%3C/path%3E%3Cpath fill="%23fff000" d="M35.812 31.826h-0.391v-3.652h0.329c1.717 0 1.717 3.652 0.063 3.652z"%3E%3C/path%3E%3C/svg%3E');}


.KauflandIcon{background: linear-gradient(330deg, #ed1c24 0%, #ed1c24 32%);} .KauflandIcon::after{content:" "; background: linear-gradient(330deg, #ffffff 0%, #ffffff 32%); z-index:-1;} 
.KauflandIcon::before{content:"-"; color:#00000000; display: block; background-size: 26px; background-image: url('data:image/svg+xml,%3Csvg%20xmlns:svg=%22http://www.w3.org/2000/svg%22%20xmlns=%22http://www.w3.org/2000/svg%22%20version=%221.1%22%20width=%22400%22%20height=%22400%22%20id=%22svg2816%22%20xml:space=%22preserve%22%3E%3Cdefs%20id=%22defs2820%22/%3E%3Cg%20transform=%22matrix(1.25,0,0,-1.25,0,400)%22%20id=%22g2826%22%3E%3Cg%20transform=%22translate(-518.81175,-249.76069)%22%20id=%22g3973%22%3E%3Cpath%20d=%22m%20830.81175,257.76069%20-304,0%200,304%20304,0%200,-304%20z%22%20id=%22path2914%22%20style=%22fill:%23ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none%22/%3E%3Cpath%20d=%22m%20824.13397,264.4349%20-290.64801,0%200,290.64801%20290.64801,0%200,-290.64801%20z%22%20id=%22path2916%22%20style=%22fill:%23ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none%22/%3E%3Cpath%20d=%22m%20533.48596,555.08291%200,-290.63729%206.60629,0%200,284.031%20277.43543,0%200,-284.031%206.60629,0%200,6.60272%200,284.03457%20-290.64801,0%20z%22%20id=%22path2918%22%20style=%22fill:%23ed1c24;fill-opacity:1;fill-rule:nonzero;stroke:none%22/%3E%3Cpath%20d=%22m%20591.5698,533.89132%20174.38738,0%200,-191.9112%20-174.38738,0%200,191.9112%20z%22%20id=%22path2920%22%20style=%22fill:%23ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none%22/%3E%3Cpath%20d=%22m%20591.5698,533.89132%20174.38738,0%200,-191.9112%20-174.38738,0%200,191.9112%20z%22%20id=%22path2922%22%20style=%22fill:none;stroke:%23ed1c24;stroke-width:4.35414362;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:2.61299992;stroke-opacity:1;stroke-dasharray:none%22/%3E%3Cpath%20d=%22m%20602.99139,433.94621%2065.40509,0%200,-80.74112%20-65.40509,0%200,80.74112%20z%22%20id=%22path2924%22%20style=%22fill:%23ed1c24;fill-opacity:1;fill-rule:evenodd;stroke:none%22/%3E%3Cpath%20d=%22m%20602.99139,522.94519%2065.40509,0%200,-80.73755%20-65.40509,0%200,80.73755%20z%22%20id=%22path2926%22%20style=%22fill:%23ed1c24;fill-opacity:1;fill-rule:evenodd;stroke:none%22/%3E%3Cpath%20d=%22m%20677.23704,522.94519%2077.79188,0%20-77.79188,-80.73397%200,80.73397%20z%22%20id=%22path2928%22%20style=%22fill:%23ed1c24;fill-opacity:1;fill-rule:evenodd;stroke:none%22/%3E%3Cpath%20d=%22m%20677.23704,433.94621%2077.79188,-80.74112%20-77.79188,0%200,80.74112%20z%22%20id=%22path2930%22%20style=%22fill:%23ed1c24;fill-opacity:1;fill-rule:evenodd;stroke:none%22/%3E%3Cpath%20d=%22m%20791.68523,305.41676%20c%204.28265,0%206.79218,-3.06363%206.79218,-6.67779%200,-3.72855%20-2.50953,-6.57054%20-6.79218,-6.57054%20-4.31839,0%20-6.82792,2.84199%20-6.82792,6.57054%200,3.61416%202.50953,6.67779%206.82792,6.67779%20m%206.45972,-21.33102%2010.5529,0%200,29.30289%200,18.3067%20-10.5529,0%200,-21.07362%20c%20-2.21639,2.5846%20-5.83412,3.83579%20-9.26238,3.83579%20-8.85843,0%20-14.94994,-7.19613%20-14.94994,-15.64703%200,-8.41158%206.19875,-15.68636%2015.05718,-15.68636%203.50691,0%207.16039,1.29409%209.005,4.20758%20l%200.15014,0%200,-3.24595%20z%20m%20-48.42465,29.41371%20-10.59222,0%200,-29.30289%200,-0.11082%2010.59222,0%200,15.24308%20c%200,3.68922%201.21902,6.82793%205.53741,6.82793%205.2407,0%204.76168,-4.94757%204.76168,-7.75024%20l%200,-14.32077%2010.58864,0%200,18.15657%20c%200,7.23545%20-3.20662,12.21519%20-11.21781,12.21519%20-4.13251,0%20-7.12107,-1.17969%20-9.5591,-4.7581%20l%20-0.11082,0%200,3.80005%20z%20m%20-15.76143,0%20-10.59222,0%200,-2.87774%20c%20-2.1735,2.5846%20-5.7948,3.83579%20-9.22664,3.83579%20-8.85843,0%20-14.94636,-7.19613%20-14.94636,-15.64703%200,-8.41158%206.19875,-15.68636%2015.05718,-15.68636%203.50691,0%207.16039,1.29409%209.005,4.20758%20l%200.11082,0%200,-3.24595%2010.59222,0%200,29.30289%200,0.11082%20z%20m%20-17.01262,-8.08269%20c%204.28265,0%206.79218,-3.06363%206.79218,-6.67779%200,-3.72855%20-2.50953,-6.57054%20-6.79218,-6.57054%20-4.31839,0%20-6.82792,2.84199%20-6.82792,6.57054%200,3.61416%202.50953,6.67779%206.82792,6.67779%20m%20-20.66966,26.27857%20-10.59223,0%200,-29.3422%200,-18.26739%2010.59223,0%200,29.30289%200,18.3067%20z%20m%20-19.63297,-26.79335%207.41777,0%200,8.59747%20-7.41777,0%200,4.76167%20c%200,3.32102%200.95805,4.94757%203.68922,4.94757%201.36559,0%202.47378,-0.48261%203.72855,-0.99738%20l%200,9.005%20c%20-1.47641,0.77573%20-2.91706,1.03312%20-4.54003,1.03312%20-4.02169,0%20-7.82531,-1.66229%20-10.44923,-4.6866%20-2.87417,-3.28527%20-3.02431,-6.27383%20-3.02431,-10.33484%20l%200,-3.72854%20-3.68923,0%200,-8.59747%203.68923,0%200,-20.81624%2010.5958,0%200,20.81624%20z%20m%20-48.27809,8.59747%200,-17.71329%20c%200,-9.70566%206.93875,-12.66205%2015.908,-12.66205%208.92992,0%2015.86867,2.95639%2015.86867,12.66205%20l%200,17.71329%20-10.59222,0%200,-15.72211%20c%200,-3.72497%20-0.92231,-6.38464%20-5.27645,-6.38464%20-4.39347,0%20-5.31578,2.65967%20-5.31578,6.38464%20l%200,15.72211%20-10.59222,0%20z%20m%20-4.98331,0%20-10.59222,0%200,-2.87774%20c%20-2.17708,2.5846%20-5.7948,3.83579%20-9.22664,3.83579%20-8.85843,0%20-14.94994,-7.19613%20-14.94994,-15.64703%200,-8.41158%206.20233,-15.68636%2015.06076,-15.68636%203.50691,0%207.16038,1.29409%209.005,4.20758%20l%200.11082,0%200,-3.24595%2010.59222,0%200,29.30289%200,0.11082%20z%20m%20-17.01262,-8.08269%20c%204.27907,0%206.7886,-3.06363%206.7886,-6.67779%200,-3.72855%20-2.50953,-6.57054%20-6.7886,-6.57054%20-4.32197,0%20-6.82793,2.84199%20-6.82793,6.57054%200,3.61416%202.50596,6.67779%206.82793,6.67779%20m%20-45.47184,5.09413%20-0.14657,0%200,18.59984%20-11.92206,0%200,-30.59697%200,-14.50309%2011.92206,0%200,19.56147%200.14657,0%2015.38964,-19.56147%2015.38965,0%20-19.81886,23.7333%2018.23521,21.36676%20-14.80337,0%20-14.39227,-18.59984%20z%22%20id=%22path2932%22%20style=%22fill:%23ed1c24;fill-opacity:1;fill-rule:evenodd;stroke:none%22/%3E%3Cpath%20d=%22m%20548.9042,277.46516%20259.50052,0%200,-6.60629%20-259.50052,0%200,6.60629%20z%22%20id=%22path2934%22%20style=%22fill:%23ed1c24;fill-opacity:1;fill-rule:evenodd;stroke:none%22/%3E%3C/g%3E%3C/g%3E%3C/svg%3E');}



.LivellaIcon{background: linear-gradient(330deg, rgb(189 76 76) 0%, rgb(126 22 117) 32%, rgb(137 17 17) 70%, rgb(197 86 86) 100%);} .LivellaIcon::after{content:" "; background: linear-gradient(330deg, #ffe900 0%, #ffe900 32%); z-index:-1;} .LivellaIcon::before{content:" "; display: none;}
.LivellaIcon::before{
	content: "Livella";
    display: block;
    background-size: 22px;
    background-color: #ea661c;
	background: linear-gradient(338deg, rgb(79 214 211) 0%, rgb(22 116 126) 50%, rgb(12 181 42) 80%, rgb(197 86 86) 100%);
    border-radius: 9px;
    border-radius: 21px 1px 24px / 34px 15px;
    color: white;
    font-family: monospace;
    font-family: "Gill Sans", sans-serif;
    font-weight: 900;
    font-size: 6px;
    height: 20px;
    top: 1px;
    position: relative;
    width: 26px;
    line-height: 19.5px;
    border-top: #ffffff solid 2px;
    border-bottom: #ffffff solid 2px;
}

.ProfiIcon{background: linear-gradient(330deg, #ffe900 0%, #ffe900 32%);} .ProfiIcon::after{content:" "; background: linear-gradient(330deg, #ffffff 0%, #ffffff 32%); z-index:-1;} .ProfiIcon::before{content:" "; display: none;}
.ProfiIcon::before{
	content: "Profi";
    display: block;
    background-size: 22px;
    background-color: #ea1c2d;
    border-radius: 10px;
    color: white;
    font-family: monospace;
    font-family: "Gill Sans", sans-serif;
    font-weight: 900;
    font-size: 8px;
    height: 15px;
    top: 1.5px;
    position: relative;
    width: 26px;
    line-height: 14.5px;
    border-top: #ffe900 solid 4px;
    border-bottom: #ffe900 solid 4px;
}



.CarrefourIcon{background: linear-gradient(330deg, #ffe900 0%, #ffe900 32%);} .CarrefourIcon::after{content:" "; background: linear-gradient(330deg, #ffffff 0%, #ffffff 32%); z-index:-1;} 
.CarrefourIcon::before{content:"-"; color:#00000000; display: block; background-size: 26px; height: 21.5px; top: 2.5px; border-radius: 0px; position: relative; background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="2006" viewBox="0 0 1000 802.207" width="2500"><path d="m203.522 744.333c-12.963 0-22.431 6.537-22.431 19.046 0 11.717 8.23 19.884 20.582 19.884 8.237 0 16.474-4.577 21.616-11.122v-16.686c0-5.565-7.21-11.122-19.767-11.122m280.2-2.312c.61 21.961 14.616 37.848 38.702 37.848 14.625 0 25.747-7.923 29.65-12.9 1.85 1.395 3.715 3.48 3.715 8.331 0 10.926-13.183 26.037-43.86 26.037-30.873 0-56.008-24.618-56.008-56.8 0-35.434 23.27-60.758 57.662-60.758 31.264 0 45.694 23.027 45.694 42.637 0 5.784-1.239 11.138-3.715 15.605zm43.655-14.194c4.938 0 5.15-2.892 5.15-6.764-.212-11.553-9.288-22.251-23.067-22.251-17.91 0-24.916 15.009-25.527 29.015zm290.474 12.117c0 26.836 3.723 40.513 21.029 40.513 18.904 0 24.077-16.882 24.077-32.22v-29.275c0-10.055-4.765-13.958-15.66-12.783-4.522-11.302 10.487-18.497 18.96-20.15 2.65-.408 5.134-.816 7.422-.816 11.922 0 16.499 7.438 16.499 18.552 0 4.084-.4 11.53-.4 42.332 0 13.026-.211 19.9-.211 22.055 0 10.142 4.694 15.307 15.581 14.124 4.46 11.325-10.455 16.694-18.967 18.27-2.61.391-4.985.791-6.944.791-11.318 0-13.615-7.344-15.895-17.87-1.6 1.975-3.073 3.59-6.145 6.552-7.415 6.945-17.086 11.122-28.012 11.122-11.945 0-22.032-4.585-28.42-12.11-9.875-11.717-9.875-26.82-9.875-48.875v-21.186c0-10.055-4.742-13.959-15.644-12.783-4.53-11.302 10.51-18.497 18.943-20.15 2.673-.408 5.134-.816 7.407-.816 11.929 0 16.467 7.438 16.467 18.552l-.211 36.171zm-52.074 2.304c0-34.815-24.085-58.477-57.442-58.477-30.873 0-58.266 23.662-58.266 58.477 0 35.255 25.731 58.885 57.239 58.885 33.342 0 58.47-24.022 58.47-58.885m-516.75 30.677c0 8.88 5.753 11.71 15.848 13.105-.62 10.314-7.83 14.312-16.263 15.103-9.476.792-18.74-3.597-22.44-13.488-4.334 3.934-17.094 13.88-33.772 13.88-22.847 0-39.942-15.307-39.942-36.155 0-22.04 19.148-35.098 46.118-35.098 9.28 0 18.936 1.928 24.704 4.915v-14.759c0-13.222-5.768-21.616-20.785-21.616-3.096 0-9.884.815-15.245 2.853.62 2.092 1.043 4.326 1.043 6.38 0 8.072-5.15 14.617-13.795 14.617-7.626 0-13.394-6.145-13.394-13.99 0-14.414 18.128-24.909 43.248-24.909 19.97 0 32.127 4.734 38.507 12.956 5.753 7.234 6.168 18.356 6.168 34.408zm487.31-28.984c0 26.75-11.536 41.29-27.792 41.29-14.413 0-28.412-14.532-28.412-46.259 0-24.72 10.291-40.152 27.174-40.152 16.67-.006 29.03 17.101 29.03 45.121m-405.79-40.607c.62 7.023 6.592 11.945 13.583 11.945 8.857 0 14.21-7.854 14.21-15.456 0-10.714-8.645-16.264-17.298-16.264-9.875 0-20.378 7.423-26.343 18.521l-.415.204c-1.85-9.86-6.591-17.298-16.475-17.298-2.265 0-4.734.423-7.406 1.238-8.238 2.47-20.386 8.833-15.848 20.151 11.529-2.218 15.644 1.662 15.644 11.717v47.881c0 9.507-1.23 13.489-4.53 16.28-3.096 2.366-6.38 3.346-8.442 3.753-4.734 10.315 4.53 13.528 27.385 13.528s30.677-3.205 25.943-13.528c-2.061-.415-7.822-1.395-10.91-3.754-3.3-2.79-4.734-6.772-4.734-16.279v-28.882c-.006-25.747 9.46-32.519 15.636-33.757m283.295-16.694h29.439c3.503 8.425-1.231 15.22-7.823 15.848-2.06.219-4.326.219-6.38.219-5.36 0-10.706-.423-14.413-.423v63.697c0 9.507 1.646 13.489 4.938 16.279 3.096 2.367 10.306 3.347 12.368 3.754 4.734 10.315-6.396 13.528-29.243 13.528s-32.315-3.206-27.589-13.528c2.054-.415 5.361-1.395 8.442-3.754 3.291-2.79 4.522-6.772 4.522-16.28v-64.127l-17.29-.612c-3.504-8.41 1.23-14.398 8.23-14.398h8.66v-8.237c0-16.679 3.08-25.95 7.203-32.127 6.372-9.883 17.29-16.67 34.369-16.67 21.624 0 39.118 10.086 39.118 25.315 0 6.592-4.53 14.617-13.999 14.617-6.99 0-13.582-5.972-13.582-13.37 0-3.104 1.238-6.396 2.876-8.442-2.461-2.884-7.61-4.334-12.556-4.334-14.21 0-17.29 10.502-17.29 23.678zm-189.618 16.694c.62 7.023 6.591 11.945 13.59 11.945 8.857 0 14.202-7.854 14.202-15.456 0-10.714-8.645-16.264-17.29-16.264-9.883 0-20.385 7.423-26.342 18.521l-.423.204c-1.842-9.86-6.584-17.298-16.468-17.298-2.257 0-4.733.423-7.406 1.238-8.245 2.47-20.394 8.833-15.856 20.151 11.53-2.218 15.636 1.662 15.636 11.717v47.881c0 9.507-1.222 13.489-4.522 16.279-3.088 2.367-6.372 3.347-8.426 3.754-4.741 10.315 4.53 13.528 27.37 13.528 22.847 0 30.685-3.205 25.943-13.528-2.054-.415-7.815-1.395-10.91-3.754-3.292-2.79-4.734-6.772-4.734-16.279v-28.882c-.006-25.747 9.46-32.519 15.636-33.757m547.951 0c.69 7.023 6.71 11.945 13.74 11.945 8.73 0 14.084-7.854 14.084-15.456 0-10.715-8.52-16.264-17.29-16.264-9.844 0-20.23 7.423-26.178 18.52l-.603.204c-1.803-9.86-6.584-17.298-16.287-17.298-2.414 0-4.758.424-7.58 1.239-8.12 2.469-20.229 8.833-15.816 20.15 11.569-2.217 15.62 1.662 15.62 11.718v47.88c0 9.508-1.183 13.49-4.584 16.28-2.955 2.367-6.349 3.346-8.316 3.754-4.781 10.314 4.57 13.528 27.408 13.528 22.847 0 30.575-3.206 25.794-13.528-1.96-.415-7.72-1.395-10.926-3.754-3.135-2.79-4.522-6.772-4.522-16.28v-28.881c.008-25.747 9.311-32.519 15.456-33.757m-972.176 16.146c0 51.956 35.81 82.727 74.725 82.727 35.003 0 59.496-24.61 59.496-45.098 0-10.91-6.787-18.842-15.644-18.842-9.06 0-16.67 6.145-16.67 16.702 0 6.74 3.699 10.51 6.38 13.48-4.743 9.155-14.83 16.687-30.482 16.687-25.935 0-44.667-27.016-44.667-65.868 0-38.898 17.901-66.08 43.852-66.08 15.652 0 25.731 7.619 30.473 16.687-2.68 3.08-6.38 6.787-6.38 13.583 0 10.502 7.618 16.67 16.679 16.67 8.857 0 15.636-8.002 15.636-18.936 0-20.393-24.493-45.09-59.496-45.09-38.922-.006-73.902 33.765-73.902 83.378" fill="%23004e9f"/><path d="m337.21 17.893-218.445 211.33c-10.91 9.263-17.878 20.142-17.878 35.708 0 15.495 6.976 26.413 17.878 35.748l218.445 211.258c1.403 1.434 2.76 2.006 3.911 2.006 2.07 0 3.496-1.88 3.433-4.091-.062-1.301-.627-2.798-1.92-4.091-51.274-63.705-88.582-136.769-88.582-240.062 0-103.356 37.308-177.854 88.582-241.606 1.293-1.277 1.858-2.75 1.92-4.083.07-2.258-1.363-4.084-3.433-4.084-1.152-.022-2.508.541-3.91 1.967" fill="%23e3000d"/><path d="m505.15 0c-85.534 0-118.954 121.21-118.954 265.683 0 144.52 33.42 264.116 118.953 264.116 51.33 0 95.08-30.058 95.221-54.762.022-5.408-2.061-10.589-6.6-15.111-24.328-23.506-33.843-46.995-33.913-67.726-.157-39.573 34.172-69.05 65.821-69.05 43.507 0 69.168 34.195 69.168 78.479 0 41.963-17.878 76.911-37.331 104.9-.768 1.144-1.113 2.422-1.113 3.542.016 2.195 1.309 3.998 3.245 3.998 1.175 0 2.555-.627 4.06-2.14l218.5-211.258c10.91-9.327 17.878-20.253 17.878-35.748 0-15.558-6.976-26.445-17.878-35.709l-218.5-211.328c-1.497-1.497-2.877-2.132-4.06-2.132-1.952 0-3.23 1.818-3.245 4.02 0 1.13.345 2.391 1.113 3.551 19.445 27.95 37.33 62.937 37.33 104.869 0 44.252-25.66 78.479-69.167 78.479-31.649 0-65.978-29.454-65.821-69.035.07-20.73 9.585-44.244 33.914-67.726 4.538-4.545 6.622-9.68 6.599-15.095-.141-24.744-43.891-54.817-95.22-54.817" fill="%23004e9f"/></svg>');

}

.MealIcon{background: linear-gradient(0deg, #830092 0%, rgb(243 214 255) 65%, rgb(0 0 0) 30%, rgb(185 0 255) 65%, #ff8e54 100%);}


.MealIcon::before {
    content: "🥗";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.MealIcon::after {
    content: "🥗";
    opacity: 0;
    background: linear-gradient(0deg, #d22c00 0%, rgb(255 249 234) 65%, rgba(255, 179, 0, 1) 30%, rgb(255 240 0) 65%, #f45503 100%);;
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.MealIcon:hover::after {
    opacity: 1;
}

.DrinkIcon {
background: linear-gradient(0deg, #3a00bd 0%, #c7c9ff 65%, #ff0000 30%, rgb(116 101 167) 65%, #230094 100%);
    transition: background 2s;
}

.DrinkIcon::before {
    content: "🍹";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.DrinkIcon::after {
    content: "🍹";
    opacity: 0;
    background: linear-gradient(0deg, #ff0000 0%, #ffedc6 65%, #ff0000 30%, rgb(255 84 208) 65%, #f4ff6e 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.DrinkIcon:hover::after {
    opacity: 1;
}



.BillsIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.BillsIcon::before {
    content: "📖";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.BillsIcon::after {
    content: "📖";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.BillsIcon:hover::after {
    opacity: 1;
}


.DigiIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.DigiIcon::before {
    content: "🛜";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.DigiIcon::after {
    content: "🛜";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.DigiIcon:hover::after {
    opacity: 1;
}



.WaterIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.WaterIcon::before {
    content: "🌊";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.WaterIcon::after {
    content: "🌊";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.WaterIcon:hover::after {
    opacity: 1;
}




.ElectricityIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.ElectricityIcon::before {
    content: "⚡";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ElectricityIcon::after {
    content: "⚡";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ElectricityIcon:hover::after {
    opacity: 1;
}



.TrashIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.TrashIcon::before {
    content: "🗑️";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.TrashIcon::after {
    content: "🗑️";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.TrashIcon:hover::after {
    opacity: 1;
}


.HeatingIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.HeatingIcon::before {
    content: "🔥";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.HeatingIcon::after {
    content: "🔥";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.HeatingIcon:hover::after {
    opacity: 1;
}


.RentIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.RentIcon::before {
    content: "🔖";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.RentIcon::after {
    content: "🔖";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.RentIcon:hover::after {
    opacity: 1;
}



.PackIcon {
    transition: background 2s;
}

.PackIcon::before {
    content: "🎀";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.PackIcon::after {
    content: "🎀";
    opacity: 0;
    border-radius: 4px 3px 6px / 2px 4px;
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.15s ease;
}

.PackIcon:hover::after {
    opacity: 1;
}






.HatIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.HatIcon::before {
    content: "🎩";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.HatIcon::after {
    content: "🎩";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.HatIcon:hover::after {
    opacity: 1;
}

.ShirtIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.ShirtIcon::before {
    content: "👔";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ShirtIcon::after {
    content: "👔";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ShirtIcon:hover::after {
    opacity: 1;
}


.SuitIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.SuitIcon::before {
    content: "🧑‍💼";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.SuitIcon::after {
    content: "🧑‍💼";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.SuitIcon:hover::after {
    opacity: 1;
}

.JacketIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.JacketIcon::before {
    content: "🧥";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.JacketIcon::after {
    content: "🧥";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.JacketIcon:hover::after {
    opacity: 1;
}

.PantsIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.PantsIcon::before {
    content: "👖";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.PantsIcon::after {
    content: "👖";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.PantsIcon:hover::after {
    opacity: 1;
}


.ShoesIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.ShoesIcon::before {
    content: "👞";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ShoesIcon::after {
    content: "👞";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ShoesIcon:hover::after {
    opacity: 1;
}



.SocksIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.SocksIcon::before {
    content: "🧦";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.SocksIcon::after {
    content: "🧦";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.SocksIcon:hover::after {
    opacity: 1;
}


.UnderwearIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.UnderwearIcon::before {
    content: "🩳";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.UnderwearIcon::after {
    content: "🩳";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.UnderwearIcon:hover::after {
    opacity: 1;
}

.BeltIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.BeltIcon::before {
    content: "🥋";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.BeltIcon::after {
    content: "🥋";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.BeltIcon:hover::after {
    opacity: 1;
}



.BagIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.BagIcon::before {
    content: "👜";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.BagIcon::after {
    content: "👜";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.BagIcon:hover::after {
    opacity: 1;
}






.RepairIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.RepairIcon::before {
    content: "🧑‍🔧";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.RepairIcon::after {
    content: "🧑‍🔧";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.RepairIcon:hover::after {
    opacity: 1;
}

.ReplaceIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.ReplaceIcon::before {
    content: "♻️";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ReplaceIcon::after {
    content: "♻️";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ReplaceIcon:hover::after {
    opacity: 1;
}


.DoctorIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.DoctorIcon::before {
    content: "👩‍⚕️";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.DoctorIcon::after {
    content: "👩‍⚕️";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.DoctorIcon:hover::after {
    opacity: 1;
}

.MedsIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.MedsIcon::before {
    content: "💊";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.MedsIcon::after {
    content: "💊";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.MedsIcon:hover::after {
    opacity: 1;
}



.AnalizeIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.AnalizeIcon::before {
    content: "🔬";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.AnalizeIcon::after {
    content: "🔬";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.AnalizeIcon:hover::after {
    opacity: 1;
}



.DentistIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.DentistIcon::before {
    content: "🦷️";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.DentistIcon::after {
    content: "🦷";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.DentistIcon:hover::after {
    opacity: 1;
}

.ToiletIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.ToiletIcon::before {
    content: "🧻";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ToiletIcon::after {
    content: "🧻";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ToiletIcon:hover::after {
    opacity: 1;
}

.SoapIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.SoapIcon::before {
    content: "🧼";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.SoapIcon::after {
    content: "🧼";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.SoapIcon:hover::after {
    opacity: 1;
}

.DetergentIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.DetergentIcon::before {
    content: "🫧";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.DetergentIcon::after {
    content: "🫧";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.DetergentIcon:hover::after {
    opacity: 1;
}

.ToothpasteIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.ToothpasteIcon::before {
    content: "😁";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ToothpasteIcon::after {
    content: "😁";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ToothpasteIcon:hover::after {
    opacity: 1;
}

.ToothbrushIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.ToothbrushIcon::before {
    content: "🪥";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.ToothbrushIcon::after {
    content: "🪥";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ToothbrushIcon:hover::after {
    opacity: 1;
}

.SpeakersIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.SpeakersIcon::before {
    content: "🔊";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.SpeakersIcon::after {
    content: "🔊";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.SpeakersIcon:hover::after {
    opacity: 1;
}


.MicrophoneIcon{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.MicrophoneIcon::before {
    content: "🎙️";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.MicrophoneIcon::after {
    content: "🎙️";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.MicrophoneIcon:hover::after {
    opacity: 1;
}


.GearIcon	{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.GearIcon::before {
    content: "🎚️";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.GearIcon::after {
    content: "🎚️";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.GearIcon:hover::after {
    opacity: 1;
}



.CableIcon	{background: linear-gradient(0deg, rgb(9 0 189) 0%, rgb(199 228 255) 65%, rgb(65 0 255) 30%, rgb(101 137 167) 65%, rgb(0 22 148) 100%);}


.CableIcon::before {
    content: "🔌";
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
}

.CableIcon::after {
    content: "🔌";
    opacity: 0;
    background: linear-gradient(0deg, rgb(0 123 189) 0%, rgb(199 253 255) 65%, rgb(0 121 255) 30%, rgb(34 224 224) 65%, rgb(0 148 66) 100%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.CableIcon:hover::after {
    opacity: 1;
}

.ReclamaIcon	{background: linear-gradient(228deg, #63eeff 0%, #0064bb 50%, #b4bbff 97%); font-size:24px}


.ReclamaIcon::before {
    content: "f";
    border-radius: 4px 3px 6px / 2px 4px;
	color: white;
    height: 26px;
    display: block;
}

.ReclamaIcon::after {
    content: "f";
	color: #862f66;
    font-size: 24px;
    opacity: 0;
    linear-gradient(228deg, #d8fbff -11%, #d59f9f 50%, #eaf164 117%);
	background: linear-gradient(228deg, #caa4ff -11%, #f5e9ff 50%, #bf64f1 117%);
    border-radius: 4px 3px 6px / 2px 4px;
    height: 26px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transition: opacity 0.1s ease;
}

.ReclamaIcon:hover::after {
    opacity: 1;
}

.Logo {
    width: 23.5px;
    height: 23.5px;
    top: 1.25px;
	position: relative;
	display: block;
	background-size: cover;
	background-size: cover;
}

.CalendarEventWrapper{
	display: block;
    height: 26px;
    max-width: 26px;
    position: relative;
    z-index: 1;
}
.calendareventname{
	display: block;
    Background-color: white;
    height: 26px;
    width: 147px;
    position: relative;
    bottom: 26px;
    left: 26px;
    font-size: 15px;
    font-weight: 600;
    line-height: 26px;
    white-space: nowrap;
	border-radius: 4px 3px 6px / 2px 4px;
    border: 1px black solid;
    padding-left: 2px;
    padding-right: 2px;
	overflow: hidden;
	opacity: 0;
    animation: reveal2 forwards 0.25s ease-out;

}

.EventContentWrapper{
	display: grid;
    grid-column: span 6;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(auto-fill, minmax(25.5px, 25.5px));
    height: 26px;
	overflow: hidden;
}

.unrevealeventname {
	opacity: 1;
    animation: unreveal forwards 0.25s ease-out;
}

.hideeventname {
	display: none;
}



		
	
.starsgradientflash {
	z-index: -1;	
}
		
.background-container {
	z-index: -2;	
}

.SkyGradient{
	z-index: -2;
}
.topNaviagationMenu{
	grid-template-columns: repeat(1, 1fr);
	max-width:800px;
	animation-delay:0s;
	padding-top: 1.75rem;
	grid-template-columns: repeat(1, 1fr);
	max-width: 320px;
}

.RON, .Percent {
display: block;
    opacity: 0;
    position: relative;
    animation: fadein 1s forwards;
    cursor: pointer;
    transition: 0.25s;
    padding-right: 2px;
    /* border-radius: 5px; */
    border-radius: 0px 0px 22px / 33px 31px;
	animation: fadein 0.25s ease-out forwards, revealsum2 0.25s forwards;
}

.RON::after {
	content: " ";
    opacity: 0;
    display: block;
    position: absolute;
    background-color: #2d6b8a;
    width: 17px;
    left: -17px;
    height: 27.5px;
    /* bottom: 97px; */
    top: 0px;
    z-index: -1;
	transition: 0.25s;
}

.RON:hover::after {
  opacity: 1;
}

.RON:hover {
    background-color: #2d6b8a;
	color: white;
}

.Percent::after {
	content: " ";
    opacity: 0;
    display: block;
    position: absolute;
    background-color: #2d6b8a;
    width: 17px;
    left: -17px;
    height: 27.5px;
    /* bottom: 97px; */
    top: 0px;
    z-index: -1;
	transition: 0.25s;
}

.Percent:hover::after {
  opacity: 1;
}
.Percent:hover {
    background-color: #2d6b8a;
	color: white;
}

.hideRON, .hidePercent {
  display: none;
  opacity: 0;
}

.fadeout {
  animation: fadeout 0.4s;
  animation-fill-mode: forwards;
	user-select: none;
}

.Percent.fadein {
  animation-fill-mode: forwards;
}












@import url('https://fonts.googleapis.com/css?family=Cardo:400i|Rubik:400,700&display=swap');
:root {
  --d: 700ms;
  --e: cubic-bezier(0.19, 1, 0.22, 1);
  --font-sans: 'Rubik', sans-serif;
  --font-serif: 'Cardo', serif;
}
* {
  box-sizing: border-box;
}
html, body {
  height: 100%;
}
body {
  place-items: center;
}

 .Author{
border-top: 0;
    height: 50px;
    padding-top: 8px;
    position: relative;
    transition: var(--go-navigation--transition);
    animation: reveal2 2s;
    opacity: 0;
    clip-path: polygon(100% 0, 99.999% 0, 99.999% 100%, 100% 100%);
    animation-fill-mode: forwards;
    background: #673AB7;
	border: solid white 5px;
	border-top: 0;
	background: linear-gradient(var(--angle), #120b26 0%, #2f1160 100%);
	max-width: 450px;
	    background: #1c1c1c;
 }
 
.MapsContainer {
	display:grid;
	width:100%;
	grid-template-columns: repeat(1, 1fr);
	        row-gap: 20px;
}

.GoogleMapOverheadView{
	min-width: 100%;
	min-height: 350px;
	grid-column: span 2;
}

.LocationContainer1{
	font-size: 75%;
    font-size: 75%;
    text-align: center;
    box-shadow: -25px 25px 19px #000000bd, inset 0 0 0 800px #0399ff73;

    margin: 0 auto 0 auto;
	border-color: #00000000;
	padding-left: 15px;
    padding-right: 15px;
	box-sizing: border-box;
	grid-column: span 2;
	width: 100%;
}

.page-content {
  display: grid;
  grid-gap: 1rem;
  padding: 1rem;
  max-width: 350px;
    width: 100vw;
  margin: 0 auto;
  /font-family: var(--font-sans);
  font-family: "Montseratt", sans-serif;
          z-index: 1;
        position: relative;
}
@media (min-width: 600px) {
  .page-content {
    grid-template-columns: repeat(2, 1fr);
	max-width: max(85vw, 600px);
  }
  
  .MapsContainer {
	grid-template-columns: repeat(1, 1fr);
	grid-row-gap: 20px;
}
}
@media (min-width: 801px) {
.MapsContainer{
padding:20px 20px 0px 20px;
}
}
@media (min-width: 850px) {
.MapsContainer{
padding:0px;
}
}
.MapsInner {

	text-align: justify;
    font-family: Lato;
    font-weight: 600;
	line-height: 35px;
	opacity:0;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
	animation-fill-mode: forwards;
	padding-bottom: 20px;
	text-shadow: 2px 2px 0 #000000, 2px -2px 0 #000000, -2px 2px 0 #000000, -2px -2px 0 #000000, 2px 0px 0 #000000, 0px 2px 0 #000000, -2px 0px 0 #000000, 0px -2px 0 #000000, 0px 0px 14px #000000;
	animation: reveal 1s;
    animation-delay: 1.5s;
	animation-fill-mode: forwards;
	overflow-y: auto;
	font-family: "Montseratt", sans-serif;
	padding-top: 40px;
}


@media (max-width: 850px) {
	.studio-photo-container{
	grid-template-columns: repeat(1, 1fr);
		display: grid;
		column-gap: 20px;
		padding-left: 20px;
		padding-right: 20px;
	}
}
@media (min-width: 600px) {
.MapsInner {
	width: 85vw;
	max-width: 100%;}

}


@media (min-width: 1340px) {
	
.MapsInner {
	width: 1000px;
	max-width: 100%;}

}

	.studio-photo-container{
	grid-template-columns: repeat(1, 1fr);
		display: grid;
		column-gap: 20px;
	}

.studio-photo {
    width: 100%;
    position: relative;
	padding-bottom: 20px;
}
.Inscriere-photo {
    width: 100%;
    position: relative;
	padding-bottom: 20px;
	grid-column: span 2;
	}

.studio-photo-text{
    display: grid;
	box-shadow: -25px 25px 19px #000000bd, inset 0 0 0 800px #0399ff73;
	    align-content: center;
		border-radius: 15px;
		padding: 10px;
}

.ButtonLocation{
	
	
	background-color: #b12929;
    border: 0 none;
    border-radius: 3px;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-family: "Helvetica Neue",Arial,Helvetica,Verdana,sans-serif;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 36px;
    padding: 0 18px;
    text-align: center;
    vertical-align: middle;
    white-space: normal;
	Width:82%;
	max-width: 320px;
	margin-top: 20px;
	margin-bottom: 20px;
	transition: 0.25s;
	border-radius: 5px;
	}
	
.ButtonLocation:hover{
	background-color:#0399ff;
	font-size: 20px;
	Width: 90%;
	max-width: 360px;
	padding-top: 1.5px;
	padding-bottom: 1.5px;
	margin-top: 17px;
}



@media (min-width: 850px) {
  .page-content {
    grid-template-columns: repeat(6, 1fr);
        max-width: 840px;
  }
  .containingchapters{ max-width: 100%;}
  
  .glowcard1 {grid-column: span 3; left: 69px;}
  .glowcard2 {grid-column: span 3; right: 69px;}
  .glowcard3 {grid-column: span 2; }
  .glowcard4 {grid-column: span 2; }
  .glowcard5 {grid-column: span 2; }
  
      .MapsContainer {
        grid-template-columns: repeat(3, 1fr);
        grid-row-gap: 20px;
        grid-column-gap: 20px;
	  }	
	  .studio-photo-container {
        grid-template-columns: repeat(2, 1fr);
		padding-bottom: 20px;
	  }
	  .studio-photo {padding-bottom: 0px;}
.	  .Inscriere-photo {padding-bottom: 0px;}
	  .LocationContainer1{    grid-column: span 3;}
  
}

@media (min-width: 1340px) {
  .page-content {
    grid-template-columns: repeat(5, 1fr);
	max-width: 1346px;
	padding-top: 1rem;}
  .containingchapters{max-width: 1324px;}
  
  .glowcard1 {grid-column: span 1; left: auto;}
  .glowcard2 {grid-column: span 1; right: auto;}
  .glowcard3 {grid-column: span 1; }
  .glowcard4 {grid-column: span 1; }
  .glowcard5 {grid-column: span 1; }
}



.card {
  position: relative;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  width: 100%;
  text-align: center;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.1), 0 4px 4px rgba(0, 0, 0, 0.1), 0 8px 8px rgba(0, 0, 0, 0.1), 0 16px 16px rgba(0, 0, 0, 0.1);	
  box-shadow: 0 0 61px #4f0949;
        box-shadow: 0 0 61px #000000;
        box-shadow: 0 0 61px #a21095;
		
}


  .card {
	  min-height: min(350px, 180vw);
  }
  
.card:after {
  content: '';
  display: block;
  position: absolute;
	top: 50%;
    left: 0;
    width: 100%;
    height: 100%;  
  pointer-events: none;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.009) 11.7%, rgba(0, 0, 0, 0.034) 22.1%, rgba(0, 0, 0, 0.072) 31.2%, rgba(0, 0, 0, 0.123) 39.4%, rgba(0, 0, 0, 0.182) 46.6%, rgba(0, 0, 0, 0.249) 53.1%, rgba(0, 0, 0, 0.32) 58.9%, rgba(0, 0, 0, 0.394) 64.3%, rgba(0, 0, 0, 0.468) 69.3%, rgba(0, 0, 0, 0.54) 74.1%, rgba(0, 0, 0, 0.607) 78.8%, rgba(0, 0, 0, 0.668) 83.6%, rgba(0, 0, 0, 0.721) 88.7%, rgba(0, 0, 0, 0.762) 94.1%, rgba(0, 0, 0, 0.79) 100%);
  transform: translateY(-50%);
  transition: transform calc(var(--d) * 2) var(--e);
  z-index: 1;
}  
  
  @media (min-width: 600px) {
  .card {
	      height: 350px;
	width: 250px;
  }

    
}
.card:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 110%;
  background-size: cover;
  background-position: 0 0;
  transition: transform calc(var(--d) * 1.5) var(--e);
  pointer-events: none;
      z-index: -1 !important;
}

.card:nth-child(1):before {
	background-image: url(./BACKGROUNDS/Copilul_tau.png);
	background-position: center; 
	animation: fadein 1s;
	animation-fill-mode: forwards;
	opacity: 0;
	box-shadow: 0 0 61px #1049a2;

}

  @media (max-width: 600px) {
	  .card:nth-child(1):before {
		background-position-y: -25px;
}
  }
.card:nth-child(2):before {
	background-image: url(./BACKGROUNDS/Studenti.png);
    background-position-x: center;
    background-size: 383px;
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.05s;
	box-shadow: 0 0 61px #CDDC39;
}
.card:nth-child(3):before {
	background-image: url(./BACKGROUNDS/grupuri.png);
	background-position: center; 
	animation: fadein 1s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.1s;
	box-shadow: 0 0 61px #10a224;
}
.card:nth-child(4):before {
	background-image: url(./BACKGROUNDS/Dezvoltare_Personală.jpg);
	background-position: center; 
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.15s;
	box-shadow: 0 0 61px #1092a2;
  }
.card:nth-child(5):before {
	background-image: url(./BACKGROUNDS/Performanță.jpg);
	background-position: center;
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.2s;
}
.card:nth-child(6):before {
	background-image: url(./BACKGROUNDS/About_ShareCover.jpg);
	background-position: center; 
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.25s;
}

.card:nth-child(7):before {
	background-image: url(./BACKGROUNDS/July1.webp);
	background-position: center; 
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.3s;
	}
.card:nth-child(8):before {
	background-image: url(./BACKGROUNDS/August1.webp);
	background-position: center;
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.35s;
}
.card:nth-child(9):before {
	background-image: url(./BACKGROUNDS/September1.webp);
	background-position: center;
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.4s;	
}
.card:nth-child(10):before {
    background-image: url(./BACKGROUNDS/October1.webp);
	background-position: center;
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.45s;	
}
.card:nth-child(11):before {
    background-image: url(./BACKGROUNDS/November1.webp);
	background-position: center;
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.5s;
	}
	
.card:nth-child(12):before {
    background-image: url(./BACKGROUNDS/December1.webp);
	background-position: center; 
	animation: fadein 0.6s;
	animation-fill-mode: forwards;
	opacity: 0;
	animation-delay: 0.55s;
}

.card:nth-child(13):before {
	background-image: url(./BACKGROUNDS/January1.webp);
	background-position: center; 
}
.card:nth-child(14):before {
	background-image: url(./BACKGROUNDS/February1.webp);
	background-position: center; 
}
.card:nth-child(15):before {
	background-image: url(./BACKGROUNDS/March1.webp);
	background-position: center; 
}
.card:nth-child(16):before {
	background-image: url(./BACKGROUNDS/April1.webp);
	background-position: center; 
  }
.card:nth-child(17):before {
	background-image: url(./BACKGROUNDS/May1.webp);
	background-position: center; 
}
.card:nth-child(18):before {
	background-image: url(./BACKGROUNDS/June1.webp);
	background-position: center; }
.card:nth-child(19):before {
	background-image: url(./BACKGROUNDS/July1.webp);
	background-position: center; 
	}
.card:nth-child(20):before {
	background-image: url(./BACKGROUNDS/August1.webp);
	background-position: center; 
}
.card:nth-child(21):before {
	background-image: url(./BACKGROUNDS/September1.webp);
	background-position: center; 
}
.card:nth-child(22):before {
    background-image: url(./BACKGROUNDS/October1.webp);
	background-position: center; 
}
.card:nth-child(23):before {
    background-image: url(./BACKGROUNDS/November1.webp);
	background-position: center; }
	
.card:nth-child(24):before {
    background-image: url(./BACKGROUNDS/December1.webp);
	background-position: center; 
}

@keyframes glowCRD1 {
    0% {box-shadow: 0 0 61px #a21095;}
    50%   {box-shadow: 0 0 61px #4f0949;}
	100% {box-shadow: 0 0 61px #a21095;}
}

.glowcard1{  	animation: glowCRD1 infinite 6s;
	animation-delay: 0.35s;}
	
.glowcard2{  	animation: glowCRD1 backwards infinite 5s;
	animation-delay: 1.35s;}
.glowcard3{  	animation: glowCRD1 infinite 6s;
	animation-delay: 2.35s;}
.glowcard4{  	animation: glowCRD1 backwards infinite 8s;
	animation-delay: 3.35s;}
.glowcard5{  	animation: glowCRD1 infinite 7s;
	animation-delay: 4.35s;}


.foodwrapper{
	background-image: url(./BACKGROUNDS/May1.webp);
	background-position: center; 
	}
.content {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  transition: transform var(--d) var(--e);
  z-index: 2;
}
.content > * + * {
  margin-top: 1rem;
}


.copy {
  font-family: var(--font-serif);
  font-size: 1.125rem;
  font-style: italic;
  line-height: 1.35;
}
.btn {
  cursor: pointer;
  padding: 0.75rem 1.5rem;
  font-size: 0.85rem;
  font-weight: bold;
  letter-spacing: 0.025rem;
  text-transform: uppercase;
  color: white;
  background-color: black;
  border: none;
}
.btn:hover {
  background-color: #0d0d0d;
}
.btn:focus {
  outline: 1px dashed yellow;
  outline-offset: 3px;
}
@media (hover: hover) and (min-width: 600px) {
  .card:after {
    transform: none !important;
  }
  .content {
    transform: translateY(calc(100% - 5.5rem));

    justify-content: center;
    align-content: center;
  }
  .content > *:not(.title) {
    opacity: 0;
    transform: translateY(1rem);
    transition: transform var(--d) var(--e), opacity var(--d) var(--e);
  }
  .card:hover, .card:focus-within {
    align-items: center;
  }
  .card:hover:before, .card:focus-within:before {
    transform: translateY(-4%);
  }
  .card:hover:after, .card:focus-within:after {
    transform: translateY(-50%);
  }
  .card:hover .content, .card:focus-within .content {
    transform: translateY(0);
  }
  .card:hover .content > *:not(.title), .card:focus-within .content > *:not(.title) {
    opacity: 1;
    transform: translateY(0);
    transition-delay: calc(var(--d) / 8);
	
  }
  .card:focus-within:before, .card:focus-within:after, .card:focus-within .content, .card:focus-within .content > *:not(.title) {
    transition-duration: 0s;
  }
}



.Sum0wrapper {

margin-top: 9px;
overflow-y: hidden;
margin-top: 9px;
	    min-width: 102.5%;
}


@media (min-width: 600px) {
	.IncreaseSizeForMoble{
		scale: 1;
		max-width: none;
	}
	
	.Sum0wrapper {
		max-height: 312px;
	}

	.topNaviagationMenu {
		padding-top: 1rem;
		grid-template-columns: repeat(5, 1fr);
		max-width: 950px;
	}
	

}


.topNaviagationMenu{margin-bottom: 0px; position: static; background-color: #00000000; border-bottom: 0px solid white; border-top: solid 0px white; }

.btn{
	text-shadow: 0px 0px 14px #ffffff00;
	transition: text-shadow 0.1s, color 0.2s ease-out, background-color 0.2s ease-out;
}

.btn:hover{
	text-shadow: 0px 0px 14px #ffffff00;
	background-color: #ffffff;
    color: black;
	animation-delay: 0s;
	transition: text-shadow 0.1s, color 0.2s ease-out, background-color 0.2s ease-out;
}


.loadinganimationnavyear{
	display: block;
	opacity: 0%;
	pointer-events: none;
	animation: loadinganimationnavyear 5s, fadein 1.5s;
	animation-fill-mode: forwards;
	animation-delay: 1s;
}

@keyframes loadinganimationnavyear {
    from {pointer-events: none; }
    to   {pointer-events: all; }
}

.hidenavyear2{display:none;}
.unhidenavyear2{display:block;}
.unhidenavyear1{display:block;}
.hidenavyear1{display:none;}
.hidenavyear3{display:none;}



.BlurContainer {
	color: red;
    transition:
        filter 180ms ease-out,
        opacity 180ms ease-out,
        transform 180ms ease-out;
}

.BlurContainer.blur-transition {
    filter: blur(20px);
    opacity: 0.96;
    transform: scale(0.995);
}

h2 {
	margin-bottom: 18px;
    top: 17px;
	position: relative;
	font-family: "Adobe Garamond Pro Bold", Georgia, "Times New Roman", Times, serif;
	padding-top: 60px;
}

h3{
	font-size: 24px;
}

p {
	font-size: 24px;
	font-weight: bold;
}

footer {
	text-align: center;
	margin-top: 20px;
	padding: 10px;
	background-color: #ddd;
}






















body {
  font-family: 'Roboto', serif;
  background: linear-gradient(135deg, black, #220033);
}
.carousel {
    --count: 1;
    position: relative;
    width: 100%;
	height: 80vw;
    min-height: 300px;
	max-height: 350px;
    overflow: hidden;
	border-radius: 15px;
}

.carousel-item {
	--width: clamp(200px, 100%, 700px);
    --height: clamp(300px, 100%, 350px);

    position: absolute;
    top: 50%;
    left: 50%;

    width: var(--width);
    height: var(--height);

    margin-left: calc(var(--width) / -2);
    margin-top: calc(var(--height) / -2);

    border-radius: 10px;
    overflow: hidden;
    background: #000;

    transform:
        translate(calc(var(--active) * 80%), calc(var(--active) * 20%))
        rotate(calc(var(--active) * 12deg));

    z-index: var(--zIndex);
    opacity: calc(var(--zIndex) / var(--count));

    transition:
        transform 0.8s cubic-bezier(0, .02, 0, 1),
        opacity 0.8s cubic-bezier(0, .02, 0, 1);

    box-shadow: 0 10px 40px rgba(0,0,0,.35);
}

.carousel-box {
    width: 100%;
    height: 100%;
}

.carousel-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}