@charset "utf-8";
/* CSS Document */

.runda_gwiazdkowa {
	position: relative;
	overflow: visible;
	z-index: 1;
	max-width: 22.059rem;
    margin: 0 auto;
}

.lp .home {
	position: relative;
	z-index: 2;
	background-color: transparent;
}

.gwiazdkowa-bg {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -3rem;
	transform: translateX(-50%);
	width: min(750px, 100vw);
	height: auto;
}

.gwiazdkowa-bg01.trig {transform:  translateX(-50%) translateY(calc(var(--trig) * 0.05 * -1))}
.gwiazdkowa-bg02.trig {transform:  translateX(-50%) translateY(calc(var(--trig) * 0.05))}
.gwiazdkowa-bg02 {
	max-width: 23rem;
}

.xmas-tree {
	position: relative;
	width: 10.353rem;
	height: 13.529rem;
}

.xmas-tree .xmas-box {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: auto;
}

.xmas-tree  .gwiazdka {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) rotate(180deg);
	width: 2.941rem;
	height: auto;
	transition: all .8s ease-In-Out;
}

.xmas-tree.trig .gwiazdka {
	top: 0;
	left: 53%;
	transform: translateX(-50%) rotate(0deg);
}



.xmas-tree  .los-plus-01 {
	position: absolute;
	width: 3.235rem;
	height: auto;
    right: 42%;
    bottom: 10%;
	transform: rotate(30deg);
	transition: all .8s ease-In-Out;
}

.xmas-tree.trig  .los-plus-01 {
	right: 42%;
    bottom: 28%;
	transform: rotate(0deg);
}

.xmas-tree  .los-plus-02 {
	position: absolute;
	width: 3.176rem;
	height: auto;
	left: 49%;
	 bottom: 10%;
	transform: rotate(-30deg);
	transition: all .8s ease-In-Out;
}

.xmas-tree.trig  .los-plus-02 {
	
    bottom: 35%;
	transform: rotate(0deg);
}

.xmas-tree  .los-plus-03 {
	position: absolute;
	width: 2.588rem;
	height: auto;
		right: 43%;
    bottom: 10%;
	transform: rotate(44deg);
	transition: all .8s ease-In-Out;
}

.xmas-tree.trig  .los-plus-03 {
	right: 43%;
    bottom: 50%;
	transform: rotate(-14deg);
}

.xmas-tree  .los-plus-04 {
	position: absolute;
	width: 2.471rem;
	height: auto;
	left: 50%;
    bottom: 10%;
	transform: rotate(41deg);
	transition: all .8s ease-In-Out;
}
.xmas-tree.trig  .los-plus-04 {
	left: 50%;
    bottom: 56%;
	transform: rotate(-11deg);
}

.xmas-tree  .los-plus-05 {
	position: absolute;
	width: 2.235rem;
	height: auto;
	left: 39%;
    bottom: 10%;
	transform: rotate(-30deg);
	transition: all .8s ease-In-Out;
}

.xmas-tree.trig  .los-plus-05 {
	left: 39%;
    bottom: 67%;
	transform: rotate(-2deg);
}

.nav-losy .losy-vip, .nav-losy .losy-car, .nav-losy .losy-star {
	width: min(85px, 21.795vw);
	height: min(40px, 10.256vw);
	filter: drop-shadow(0px 3px 6px rgba(0,0,0,0.16));
	text-align: center;
	font-family: 'teleneoultra';
	font-size: min(17px, 4.359vw);
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;

	display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
}

.nav-losy .losy-vip > div, .nav-losy .losy-car > div, .nav-losy .losy-star > div {
	width: 100%;
    line-height: 1;
    padding: 3px 6px 0 36px;
}


.nav-losy .losy-star  {
	background-image: url("../img/runda-gwiazdkowa/gwiazdka-ico-lY4G4b9.svg");
}


.win-losy .losy-vip, .win-losy .losy-car, .win-losy .losy-star {
	width: 6.941rem;
	height: 3.294rem;
	filter: drop-shadow(0px 0.176rem 0.353rem rgba(0,0,0,0.16));
	text-align: center;
	font-family: 'teleneoultra';
	font-size: min(1.176rem, 4.359vw);
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;

	display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
}

.win-losy .losy-vip > div, .win-losy .losy-car > div, .win-losy .losy-star > div {
	width: 100%;
    line-height: 1;
    padding: 0.176rem 0.353rem 0 2.2rem;
	    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
	color: var(--magenta)
}

.win-losy .losy-star  {
	background-image: url("../img/runda-gwiazdkowa/gwiazdka-ico-lY4G4b9.svg");
}