.rate_content {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    position: relative;
    border-bottom: 1px solid rgb(28, 21, 55);
    grid-area: canvas;
    overflow: hidden;
    
}

.jet_animatsion{
width: 100%;
position: relative;
height: calc(100vh - 165px - 57px - 69px - 52px);
opacity: 0;
}

.jet_main_animatsion{
opacity: 1;
transition: all 0.32s ease 0s;   
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;
}


.schedule-bg1 {
position: absolute;
width: 100%;
height: 60%;
background: url(../images/schedule-bg1.png) 0% 0% / contain repeat-x;
background-repeat: repeat-x;
animation: 320s scroll infinite linear;
}


.schedule-bg2 {
position: absolute;
width: 100%;
height: 157px;
bottom: 0px;
opacity: 1;
background: url(../images/86e9cddf78b8061081ecdae04d9d15e9.svg) 0% 0% / contain repeat-x;
background-repeat: repeat-x;
animation: 100s scroll infinite linear;
}

.schedule-bg3 {
position: absolute;
bottom: 0px;
left: 20px;
width: 100%;
height: 20px;
background: url(../images/schedule-bg3.svg);
border-top: 1px solid rgb(38, 28, 74);
animation: 50s scroll infinite linear;
}

.schedule-bg4 {
position: absolute;
bottom: 0px;
left: 0px;
width: 20px;
height: 100%;
background: url(../images/schedule-bg4.svg);
border-right: 1px solid rgb(38, 28, 74);
animation: 70s scrolltop infinite linear;
}


@-webkit-keyframes scroll {
100% {
background-position: -3000px 0px;
}
}

@keyframes scroll {
100% {
background-position: -3000px 0px;
}
}

@-webkit-keyframes scrolltop {
100% {
background-position:0px 3000px;
}
}

@keyframes scrolltop {
100% {
background-position:0px 3000px;
}
}

.schedule-animate-img {
position: relative;
}


.schedule-animate-img img:nth-child(1){
position: absolute;
width: 100%;
top: -135px;
z-index: 10;
}

.schedule-animate-img img:nth-child(2){
position: absolute;
width: 120px;
height: 120px;
transform: rotate(-115deg);
right: 50px;
top: -85px;
z-index: -1;
}

.pilot_fire{
position: absolute;
width: 120px;
height: 120px;
transform: rotate(-115deg);
right: 82px;
top: -62px;
z-index: -1;
}




.lucky-jet {
	outline: 1px solid;
	height: calc(100vh - 165px - 57px - 69px - 52px);
	position: relative;
	overflow: hidden;

}
.lucky-jet__pilot {
	visibility: hidden;
	width: 80px;
	position: absolute;
	left: 0;
	top: 0;
}
.lucky-jet._animating .lucky-jet__pilot {
	visibility: visible;
}
.lucky-jet__pilot::before {
	content: '';
	display: block;
	padding-top: 100%;
}
.lucky-jet__pilot-img {
position: absolute;
top: 0;
left: 0;	
width: 100%;
height: 100%;
object-fit: contain;
transform: rotate(7deg);
}


.lucky-jet__svg {
	width: 100%;
	height: 100%;
	pointer-events: none;
}
@media (min-width: 768px) {
	.lucky-jet__pilot {
		width: 110px;
	}
}


.jet-main-laoding {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
visibility: hidden;
opacity: 0;
width: 100%;
height: 100%;
transition: all 0.32s ease 0s;
}

.laoding-active {
z-index: 100;
visibility: visible;
opacity: 1;
}



.jet-main-laoding-content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 24px;
height: 100%;
}

.jet-main-laoding-img {
max-width: 150px;
}

.jet-main-laoding-blog {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 12px;
}

.jet-main-laoding-text {
max-width: 450px;
font-family: Rocketfont;
font-size: 28px;
font-style: normal;
font-weight: 400;
line-height: 39px;
letter-spacing: 0.06em;
text-align: center;
color: rgb(255, 255, 255);
text-transform: uppercase;

}

.progress-bar{
position:relative;
width: 256px;
height: 4px;
background:rgba(255, 255, 255, 0.1);
border-radius:10px;
}

.progress-line{
position:absolute;
top: 0;
left: 0;
width:100%;
height:100%;
background:rgb(148, 78, 245);
border-radius:25px;
}

.schedule-number {
position: absolute;
top: 35%;
width: 100%;
margin: auto;
z-index: 100;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
opacity: 0;
}


.schedule-number-header {
position: relative;
color: rgb(148, 78, 245);
font-size: 40px;
font-weight: 900;
display: flex;
align-items: end;
justify-content: center;
gap: 10px;
opacity: 1;
transform: scale(1.0);
}

.schedule-number-animated{
display: inline;
color: rgb(148, 78, 245);
font-weight: 900;
font-size: 38px;
line-height: 83px;
font-weight: 900;
font-variant-numeric: tabular-nums;
animation-timing-function: unset;
animation-delay: unset;
animation-iteration-count: unset;
animation-direction: unset;
animation-fill-mode: unset;
animation-play-state: unset;
animation-name: unset;
animation-duration: 0.7s;
font-family: Roboto;
font-style: normal;
text-align: center;
text-transform: uppercase;
}

.schedule-number-animated span{
font-family: Roboto;
font-weight: 900;
font-style: normal;
text-align: center;
text-transform: uppercase;	
font-size: 70px;
}


.number-animated-active {
animation: 0.7s ease 0s 1 normal none running finish_number;   
transition: 0.7s; 
}

@-webkit-keyframes finish_number {
0% {
opacity: 1;
transform: scale(1.1);
}
25% {
opacity: 0;
transform: scale(1.0);
}
50% {
opacity: 1;
transform: scale(1.1);
}
75% {
opacity: 0;
transform: scale(1.0);
}
100% {
opacity: 1;
transform: scale(1.1);
}
}

@keyframes finish_number {
0% {
opacity: 1;
transform: scale(1.1);
}
25% {
opacity: 0;
transform: scale(1.0);
}
50% {
opacity: 1;
transform: scale(1.1);
}
75% {
opacity: 0;
transform: scale(1.0);
}
100% {
opacity: 1;
transform: scale(1.1);
}
}




.schedule-number-finish {
position: relative;
font-size: 34px;
font-family: Rocketfont;
line-height: 45px;
letter-spacing: 0em;
text-transform: uppercase;
color: rgb(250, 250, 250);
text-shadow: rgba(138, 138, 138, 0.5) 0px 0px 21.9869px;
text-align: center;
opacity: 1;
top: -10px;
}

.schedule-finish-active {
animation: 0.4s ease 0s 1 normal forwards running gEoZNG;
top: 0 !important;
transition: 0.4s ease 0s;
opacity: 1;
}



.jet_waiting {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
visibility: hidden;
opacity: 0;
width: 100%;
height: 100%;
transition: all 0.32s ease 0s;
}


.jet_waiting_content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 24px;
height: 100%;
}

.jet_waiting_content_text {
max-width: 450px;
font-family: Rocketfont;
font-size: 28px;
font-style: normal;
font-weight: 400;
line-height: 39px;
letter-spacing: 0.06em;
text-align: center;
color: rgb(255, 255, 255);
text-transform: uppercase;

}