/* MID - Liga Logo */

#nks_table_mid            .tmid_liga_logo{
   clip-path:inset(0% 0% 0% 0%);
   transition-property:transform, clip-path;

    animation: 0.2s infinite  common_blink_1;  
    animation-iteration-count:1;
    animation-delay:2s;  

  
}
#nks_table_mid.fadeOutEnd .tmid_liga_logo,
#nks_table_mid.fadeInInit .tmid_liga_logo{
  transform:scale3d(0.7,0.7,1);
  clip-path:inset(0% 0% 100% 0);
}

#nks_table_mid.fadeInStart .tmid_liga_logo{
  transition-delay: 0.7s;
  transition-duration:0.3s;
  transition-timing-function:cubic-bezier(0.51, 0.02, 0.54, 1)
}

#nks_table_mid.fadeOutStart .tmid_liga_logo{
  transition-delay: 0.4s;
}

/*  MID - Arrows */

#nks_table_mid            .tmid_left_arrow,
#nks_table_mid            .tmid_right_arrow{
  transition-property:opacity,transform;   
}

#nks_table_mid.fadeInInit .tmid_left_arrow,
#nks_table_mid.fadeOutEnd .tmid_left_arrow{
  transform: translateX(-20px);
  opacity:0;
}

#nks_table_mid.fadeInInit .tmid_right_arrow,
#nks_table_mid.fadeOutEnd .tmid_right_arrow{
  transform: translateX(20px);
  opacity:0;
}

#nks_table_mid.fadeInStart .tmid_left_arrow,
#nks_table_mid.fadeInStart .tmid_right_arrow {
  transition-delay: calc( ( var(--n) * 0.08 + 0.9)*1s), calc( ( var(--n) * 0.15 + 0.8)*1s);
  transition-duration: 0s, 0.2s;
  transition-timing-function:cubic-bezier(0.75, 0.12, 0.2, 0.94), cubic-bezier(1, 0.03, 0.87, 0.82);
}


#nks_table_mid.fadeOutStart .tmid_left_arrow,
#nks_table_mid.fadeOutStart .tmid_right_arrow
{
  transition-delay: calc( ( var(--n) * -0.1 + 0.3)*1s);
  transition-timing-function:cubic-bezier(0.77, 0.04, 0.71, 0.69), cubic-bezier(0.37, 0.31, 0.77, 0.5) ;  
}

#nks_table_mid.fadeOutEnd .tmid_left_arrow,
#nks_table_mid.fadeOutEnd .tmid_right_arrow{
  transform:unset;
  
}




/* MID - command logos */

#nks_table_mid.fadeOutEnd .tmid_logo_home,
#nks_table_mid.fadeOutEnd .tmid_logo_away,
#nks_table_mid.fadeInInit .tmid_logo_home,
#nks_table_mid.fadeInInit .tmid_logo_away{
  transform:scale3d(0,0,1);
}

#nks_table_mid.fadeInStart .tmid_logo_home,
#nks_table_mid.fadeInStart .tmid_logo_away{
  transition-delay: 0.3s;
  transition-duration:0.5s;
  transition-timing-function:cubic-bezier(0.54, 0.12, 0.46, 0.97)
}

#nks_table_mid.fadeOutStart .tmid_logo_home,
#nks_table_mid.fadeOutStart .tmid_logo_away{
  transition-delay: 0.7s;

}


/* MID (Match ID) - Names */

#nks_table_mid .tmid_name_text_home,
#nks_table_mid .tmid_name_text_away{
  clip-path:inset(0% 0% 0% 0%);
}

#nks_table_mid.fadeInInit .tmid_name_text_home,
#nks_table_mid.fadeInInit .tmid_name_text_away{
   clip-path:inset(0% 100% 0%  0%); 
}

#nks_table_mid.fadeInStart .tmid_name_text_home,
#nks_table_mid.fadeInStart .tmid_name_text_away{
  transition-delay: 1s;
  transition-duration:0.5s;
  transition-timing-function:cubic-bezier(0.51, 0.02, 0.54, 1);
  clip-path:inset(0% 0% 0% 0%);
  
}

#nks_table_mid.fadeInInit .tmid_name_text_home{
   clip-path:inset(0% 0% 0%  100%); 
  
}

#nks_table_mid.fadeOutStart .tmid_name_text_home,
#nks_table_mid.fadeOutStart .tmid_name_text_away{
  transition-delay: 0s;
  transition-duration:0.5s;
  
}

#nks_table_mid.fadeOutEnd .tmid_name_text_home,
#nks_table_mid.fadeOutEnd .tmid_name_text_away{
   clip-path:inset(0% 0% 0% 100%);
}


/* MID (Match ID) - Names BG */

#nks_table_mid            .tmid_edge_home,
#nks_table_mid            .tmid_edge_away{
  clip-path:inset(0% 0% 0%  0%); 
  transition-property:clip-path,opacity;


}

#nks_table_mid.fadeInInit .tmid_edge_home,
#nks_table_mid.fadeOutEnd .tmid_edge_home{
   clip-path:inset(0% 0% 0%  100%); 
  opacity:0;  
}

#nks_table_mid.fadeInInit .tmid_edge_away,
#nks_table_mid.fadeOutEnd .tmid_edge_away{
   clip-path:inset(0% 100% 0%  0%);
   opacity:0; 
}

#nks_table_mid.fadeInStart .tmid_edge_home,
#nks_table_mid.fadeInStart .tmid_edge_away{
  transition-delay: 0.7s;
  transition-duration:0.5s,0.1s;
  transition-timing-function:cubic-bezier(0.51, 0.02, 0.54, 1);
  
}

#nks_table_mid.fadeOutStart .tmid_edge_home,
#nks_table_mid.fadeOutStart .tmid_edge_away{
  transition-delay: 0.4s,0.6s;
  transition-duration:0.5s,0.3s;
  
}



/* MID - Date */

#nks_table_mid  .tmid_date_text{
  transition-property:opacity,transform;
}
#nks_table_mid.fadeOutEnd .tmid_date_text,
#nks_table_mid.fadeInInit .tmid_date_text{
  opacity:0;
  transform:translateY(-100px)
}

#nks_table_mid.fadeInStart .tmid_date_text{
  transition-delay: 0.6s;
  transition-duration:0.3s;
  transition-timing-function:cubic-bezier(0.73, 0.27, 0.66, 0.77),cubic-bezier(0, 0.75, 0.74, 0.98)
}


#nks_table_mid.fadeOutStart .tmid_date_text{
  transition-delay: 0.5s, 0.4s;
  
  transition-timing-function:cubic-bezier(0.14, 0.44, 0.42, 0.82),cubic-bezier(0.74, 0.04, 0.96, 0.58)
}


/* MID - Text 2 */

#nks_table_mid  .tmid_date_text2{
  transition-property:opacity,transform,clip-path;
  clip-path:inset(0 0% 0 0%)
  
}
#nks_table_mid.fadeOutEnd .tmid_date_text2,
#nks_table_mid.fadeInInit .tmid_date_text2{
  opacity:0;
  transform:translateY(-100px);
  clip-path:inset(0 50% 0 50%)
}

#nks_table_mid.fadeInStart .tmid_date_text2{
  transition-delay: 0.9s, 0.9s , 1.3s;
  transition-duration:0.3s;
  transition-timing-function:cubic-bezier(0.73, 0.27, 0.66, 0.77),cubic-bezier(0, 0.75, 0.74, 0.98)
}


#nks_table_mid.fadeOutStart .tmid_date_text2{
  transition-delay: 0.5s, 0.4s,0s;
  
  transition-timing-function:cubic-bezier(0.14, 0.44, 0.42, 0.82),cubic-bezier(0.74, 0.04, 0.96, 0.58)
}


/* MID - Above timer text */

#nks_table_mid            .tmid_remain_text{
  transition-property: opacity,transform;
}
#nks_table_mid.fadeOutEnd .tmid_remain_text,
#nks_table_mid.fadeInInit .tmid_remain_text{
  opacity:0;
  transform:translateY(20px)
  
}

#nks_table_mid.fadeInStart .tmid_remain_text{
  transition-delay: 1.2s;
  transition-duration:0.6s;
  transition-timing-function:cubic-bezier(0.18, 0.56, 0.54, 1)
}


#nks_table_mid.fadeOutStart .tmid_remain_text{
  transition-delay: 0.4s;
  transition-timing-function:cubic-bezier(0.12, 0.54, 0.37, 0.97),cubic-bezier(0.57, 0.11, 0.4, 0.87)
}

/* MID - timer digits */

#nks_table_mid.fadeOutEnd .tmid_remain_time,
#nks_table_mid.fadeInInit .tmid_remain_time{
  opacity:0;
  transform:translateY(0px);
  
}

#nks_table_mid.fadeInStart .tmid_remain_time{
  transition-delay: 1s;
  transition-duration:1.3s;
  transition-timing-function:cubic-bezier(0.18, 0.56, 0.54, 1)
}


#nks_table_mid.fadeOutStart .tmid_remain_time{
  transition-delay: 0.4s;
  transition-timing-function:cubic-bezier(0.69, 0.11, 0.54, 1);
  transition-duration:0.5s;
  
}



/* MID - Score digit */

#nks_table_mid            .tmid_score_wrap_home,
#nks_table_mid            .tmid_score_wrap_away{
  transition-property:transform,opacity;
}
#nks_table_mid.fadeInInit .tmid_score_wrap_home,
#nks_table_mid.fadeOutEnd .tmid_score_wrap_home{
   transform:translateX(-150px);
   opacity:0;
}

#nks_table_mid.fadeInInit .tmid_score_wrap_away,
#nks_table_mid.fadeOutEnd .tmid_score_wrap_away{
   transform:translateX(150px);
   opacity:0;  
}

#nks_table_mid.fadeInStart .tmid_score_wrap_home,
#nks_table_mid.fadeInStart .tmid_score_wrap_away{
  transition-delay: 0.8s;
  transition-duration:0.6s;
  transition-timing-function:cubic-bezier(0, 0.52, 0.12, 1),cubic-bezier(0.18, 0.43, 0.46, 0.72)
}

#nks_table_mid.fadeOutStart .tmid_score_wrap_home,
#nks_table_mid.fadeOutStart .tmid_score_wrap_away{
  transition-delay: 0.2s;
  transition-timing-function:cubic-bezier(0.81, 0.03, 0.57, 0.98),cubic-bezier(0.53, 0.23, 0.33, 0.77)

}



/* MID bottom design element */

#nks_table_mid            .tmid_remain_logo{
    transition-property: clip-path;  
    clip-path:inset(0 0% 0 0%);   

    animation: 0.15s infinite  common_blink_1;  
    animation-iteration-count:1;
    animation-delay:2.5s;    
  
}

#nks_table_mid.fadeOutEnd .tmid_remain_logo,
#nks_table_mid.fadeInInit .tmid_remain_logo{
    clip-path:inset(50% 0% 50% 0%)
}

#nks_table_mid.fadeInStart .tmid_remain_logo{
    transition-delay: 0.7s;
    transition-duration:0.6s;
    transition-timing-function: cubic-bezier(0.71, -0.01, 0.3, 0.95);
}

#nks_table_mid.fadeOutStart .tmid_remain_logo{
    transition-duration:0.4s;
    transition-delay: 0s;
  
}

/* MID (Match ID) - Background */


#nks_table_mid            .tmid_bg{
    transition-property: transform, clip-path;  
    clip-path:inset(0 0% 0 0%);
    transform-origin:top;  
}
#nks_table_mid.fadeOutEnd .tmid_bg,
#nks_table_mid.fadeInInit .tmid_bg{
    transform:scale(1,0);
    clip-path:inset(0 21.7% 0 21.7%)
}

#nks_table_mid.fadeInStart .tmid_bg{
    transition-delay: 0s, 0.4s;
    transition-duration:0.4s,0.3s;
    transition-timing-function: cubic-bezier(0.67, 0.03, 0.45, 0.84),
      cubic-bezier(0.69, 0.05, 0.34, 0.8);
}

#nks_table_mid.fadeOutInit .tmid_bg{

  
}
#nks_table_mid.fadeOutStart .tmid_bg{
    transition-duration:0.3s,0.3s;
    transition-delay: 1s, 0.7s;
}

/* MID (Match ID) - Background2 */


#nks_table_mid            .tmid_bg2{
    transition-property: transform, clip-path, opacity;  
    transform-origin:center;  
}
#nks_table_mid.fadeOutEnd .tmid_bg2,
#nks_table_mid.fadeInInit .tmid_bg2{
    transform:scale(0.6);
    opacity:0;
}

#nks_table_mid.fadeInStart .tmid_bg2{
    transition-delay: 0.9s;
    transition-duration:0.4s;
    transition-timing-function: cubic-bezier(0.67, 0.03, 0.45, 0.84),
      cubic-bezier(0.69, 0.05, 0.34, 0.8);
}

#nks_table_mid.fadeOutInit .tmid_bg2{

  
}
#nks_table_mid.fadeOutStart .tmid_bg2{
    transition-duration:0.3s;
    transition-delay: 0.5s;
}



/* MID Arrows Animation */



#nks_table_mid .tmid_left_arrow,
#nks_table_mid .tmid_right_arrow{
  animation: 3s infinite arrow_blink;
  animation-delay:calc(var(--n)*0.2s*-1 + 3s);
  animation-duration:5s;
}

#nks_table_mid .fadeOutStart .tmid_left_arrow ,
#nks_table_mid .fadeOutStart .tmid_right_arrow{
  animation:none;
}



@keyframes arrow_blink {
  0% { opacity:0; transform:scale(1)  }
  0.9% { opacity:0; transform:scale(1.2)  }
  
  1.0% { opacity:1; }
  1.9% { opacity:1; }  
  2.0% { opacity:0; }
  2.9% { opacity:0; transform:scale(1.2)  }
  3.0%{ opacity:1; }
  3.9%{ opacity:1; }
  4.0%{ opacity:0; }
  4.9%{ opacity:0; transform:scale(1.2) }
  5.0%{ opacity:1;  transform:scale(1) } 
  
  49.9%{ opacity:1; transform:scale(1)  }   
  50.0%{ opacity:0; }
  50.9%{ opacity:0; }  
  51.0%{ opacity:1; transform:scale(1)  }  
  51.9%{ opacity:1; }  
  52.0%{ opacity:0; }    
  52.9%{ opacity:0; }   
  53.0%{ opacity:1; transform:scale(1) }  
  
  100%{opacity:1; }
  
}