/* s_little */
.s_little {
	--animator-mode: css;
	/*     clip-path:inset(0% 0% 0% 0%);
    --init-delay:0.7s; */
	--animator-in-duration: 1200ms;
	--animator-out-duration: 1800ms;
	/*transition-property:transform, clip-path;*/
}

/*.s_little.ani_out_end,*/

/* COMP LOGO */

.s_little.ani_out .s_little_row1.main .comp_logo,
.s_little.ani_init .s_little_row1.main .comp_logo {
	transform: scale(0, 0);
}

.s_little.ani_in .s_little_row1.main .comp_logo {
	transition-delay: 0ms;
	transition-duration: 500ms;
}

.s_little.ani_out .s_little_row1.main .comp_logo {
	transition-delay: 550ms;
}

/* SCORE */

.s_little_row1.main .s_little_score {
	--translate_src: 94px;
	transform: none;
	--animator-in-duration: 500ms;
}
.s_little/* .ani_init  */ .s_little_row1.main .s_little_score.home {
	--translate: calc(var(--translate_src) * 1);
}
.s_little/* .ani_init  */ .s_little_row1.main .s_little_score.away {
	--translate: calc(var(--translate_src) * -1);
}

.s_little.ani_init .s_little_row1.main .s_little_score {
	transition-duration: 0s;
}

.s_little.ani_init .s_little_row1.main .s_little_score,
.s_little.ani_out .s_little_row1.main .s_little_score {
	transform: translateX(var(--translate));
}

.s_little.ani_in .s_little_row1.main .s_little_score {
	transition: all 600ms;
	transition-delay: 150ms;
}

.s_little.ani_in_end .s_little_row1.main .s_little_score {
	transition-delay: 0s;
}

.s_little.ani_out .s_little_row1.main .s_little_score {
	transition-delay: 200ms;
}

/* top redcards */

.s_little_row1.main .s_little_redcard {
	/* clip-path: inset(0% 0% 0% 0%); */
	--animator-mode: css;
	--translate: translateY(30px);
}

.s_little.ani_in.hide_main .s_little_redcard,
.s_little.ani_init .s_little_redcard,
.s_little .s_little_redcard.ani_init {
	transform: var(--translate); /* max-height: 0; */
	/* clip-path: inset(100% 0% 0% 0%); */
}

.s_little.ani_in .s_little_redcard,
.s_little .s_little_redcard.ani_in {
	/* max-height: var(--redcard-height); */
	transition: all 700ms;
	transition-delay: 650ms;
}

.s_little.ani_in_end .s_little_redcard {
	transition-delay: 0s;
}

.s_little.ani_out .s_little_redcard {
	/* height: 0; */
	transform: var(--translate);
	transition-delay: 0ms;
	transition: all 200ms;
}

/* teams bg */

.s_little .s_little_row1.main .s_little_row1_bg {
	clip-path: rect(0% 100% 100% 0% round var(--border-radius));
	clip-path: inset(0px 0% 0px 0% round var(--border-radius));
}

.s_little.ani_in .s_little_row1.main .s_little_row1_bg {
	transition-duration: 500ms;
	transition-delay: 100ms;
}

.s_little.ani_out .s_little_row1.main .s_little_row1_bg,
.s_little.ani_init .s_little_row1.main .s_little_row1_bg {
	clip-path: rect(0% 50% 100% 50% round var(--border-radius));
	clip-path: inset(0px 50% 0px 50% round var(--border-radius));
	opacity: 1;
}

.s_little.ani_out .s_little_row1.main .s_little_row1_bg {
	transition-delay: 200ms;
}

/* s_little_team */

.s_little.ani_in.ani_out .s_little_row1.main .s_little_team,
.s_little.ani_init .s_little_row1.main .s_little_team {
	opacity: 0;
}

.s_little.ani_in .s_little_row1.main .s_little_team {
	opacity: 1;
	transition-delay: 400ms;
	transition-duration: 700ms;
}

.s_little.ani_out .s_little_row1.main .s_little_team {
	transition-delay: 0s;
	transition-duration: 500ms;
	/* transition-duration: 0ms; */
}

/* s_little_teamname */

.s_little .s_little_row1.main .s_little_teamname {
	--translate_src: 40px;
}
.s_little .s_little_row1.main .s_little_teamname.home {
	--translate: calc(var(--translate_src) * 1);
}
.s_little .s_little_row1.main .s_little_teamname.away {
	--translate: calc(var(--translate_src) * -1);
}

.s_little.ani_in.ani_out .s_little_row1.main .s_little_teamname,
.s_little.ani_init .s_little_row1.main .s_little_teamname {
	transform: translateX(var(--translate));
}

.s_little.ani_in .s_little_row1.main .s_little_teamname {
	/* opacity: 1; */
	transition-delay: 450ms;
	transition-duration: 600ms;
}

.s_little.ani_out .s_little_row1.main .s_little_teamname {
	/* opacity: 0; */
	transition-delay: 0s;
	/* transition-duration: 0ms; */
}

/* s_little_team_name_text */

.s_little .s_little_row1.main .s_little_team_name_text {
	--translate_src: 30px;
}
.s_little .s_little_row1.main .s_little_team_name_text.home {
	--translate: calc(var(--translate_src) * 1);
}
.s_little .s_little_row1.main .s_little_team_name_text.away {
	--translate: calc(var(--translate_src) * -1);
}

.s_little.ani_in.ani_out .s_little_row1.main .s_little_team_name_text,
.s_little.ani_init .s_little_row1.main .s_little_team_name_text {
	opacity: 0;
	transform: translateX(var(--translate));
}

.s_little.ani_in .s_little_row1.main .s_little_team_name_text {
	opacity: 1;
	transition-delay: 600ms;
	transition-duration: 600ms;
}

.s_little.ani_out .s_little_row1.main .s_little_team_name_text {
	opacity: 0;
	transition-delay: 0s;
	/* transition-duration: 0ms; */
}

/* row2 */

.s_little.ani_in.ani_out .s_little_row2_container,
.s_little.ani_init .s_little_row2_container {
	opacity: 0;
	transform: translateY(calc(var(--header-height) * -1));
}

.s_little.ani_in .s_little_row2_container {
	opacity: 1;
	transition-delay: 600ms;
	transition-duration: 500ms;
}

.s_little.ani_in_end .s_little_row2_container {
	transition-delay: 0ms;
}

.s_little.ani_in.ani_out .s_little_row2_container {
	transition-delay: 0ms;
}

/* s_little_row1 */

.s_little_row1 {
	/* overflow: hidden; */
	--animator-mode: css;
	--animator-in-duration: 500ms;
	--animator-out-duration: 600ms;
}
.s_little_row1.ani_in.ani_out,
.s_little_row1.ani_init {
	overflow: hidden;
	max-width: 0;
	opacity: 0;
}

.s_little_row1.ani_in {
	overflow: hidden;
	max-width: var(--little-width);
	transition-duration: var(--animator-in-duration);
}

.s_little_row1.ani_in_end {
	/* overflow:visible; */
	transition-delay: 0ms;
}

.s_little_row1.ani_in.ani_out {
	transition-delay: 0ms;
	transition-duration: 600ms;
}

/* goal */
.little_goal .s_little_team_content.goal {
	--translate: 200px;
	--direction: 1;
}

.little_goal .away .s_little_team_content.goal {
	--direction: -1;
}

.little_goal.ani_in.ani_out .s_little_team_content.goal,
.little_goal.ani_init .s_little_team_content.goal {
	overflow: hidden;
	max-width: 0;
	animation: goal;
}

.little_goal.ani_in .s_little_team_content.goal {
	transition-property: transform, opacity;
	transform: translate(calc(var(--translate) * var(--direction)));
	transition-timing-function: linear, linear;
	transition-duration: 5000ms, 1000ms;
	animation-name: goal;
	animation-duration: 1s;
	animation-iteration-count: 20;
}

.little_goal.ani_in_end .s_little_team_content.goal {
	/* overflow:visible; */
	transition-delay: 0ms;
}

.little_goal.ani_in.ani_out .s_little_team_content.goal {
	transition-delay: 0ms;
}

@keyframes goal {
	0%,
	100% {
		opacity: 1;
	}

	50% {
		opacity: 0.5;
	}
}

/* s_little_block */

.s_little_block {
	/* --animator-mode: css; */
	/*     clip-path:inset(0% 0% 0% 0%);
    --init-delay:0.7s; */
	--animator-in-duration: 600ms;
	--animator-out-duration: 600ms;
	/*transition-property:transform, clip-path;*/
}

.s_little_block.ani_out_end,
.s_little_block.ani_init {
	max-width: 0;
	max-height: 0;
	/*     transform:scale3d(0,0,1);
    clip-path:inset(0% 0% 0% 0%);
    opacity:0; */
}

.s_little_block.ani_in {
	max-width: var(--animator-init-width);
	max-height: var(--animator-init-height);
	transition-property: max-width, max-height;
	transition-duration: 300ms, 500ms;
	transition-delay: 0s, 300ms;

	/* transition-timing-function: cubic-bezier(0.51, 0.02, 0.26, 1.49); */
}

.s_little_block.ani_out {
	max-height: 0;
	transition-delay: 300ms, 0ms;
	max-width: 0;

	/*     transition-duration:0.4s;
    transition-delay: 1.3s; */
}
