@media screen and (max-width: 1399px) {
/* hero-section */
.hero-section .f-60 { font-size: 47px;}
.hero-section .f-18 { font-size: 16px;} 
.play-btn {position: absolute; top: 40%; left: 40%; width: 60px; height: 60px; background: red; border-radius: 50%; display: flex; align-items: center; justify-content: center;}

}
@media (max-width: 1199.98px) {
/* hero-section */
.hero-section .f-60 { font-size: 47px;}
.hero-section .f-18 { font-size: 16px;} 
.play-btn {position: absolute; top: 40%; left: 40%; width: 60px; height: 60px; background: red; border-radius: 50%; display: flex; align-items: center; justify-content: center;}

}
@media (max-width: 991.98px) {
/* hero-section */
.hero-section .f-60 { font-size: 47px;}
.hero-section .f-18 { font-size: 16px;} 
.play-btn {position: absolute; top: 40%; left: 40%; width: 60px; height: 60px; background: red; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
}
@media (max-width: 767.98px) {  
/* hero-section */
.hero-section .f-60 { font-size: 47px;}
.hero-section .f-18 { font-size: 16px;} 
.play-btn {position: absolute; top: 30%; left: 40%; width: 60px; height: 60px; background: red; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
}

@media (max-width: 575.98px) {
 /* hero-section */
.hero-section .f-60 { font-size: 47px;}
.hero-section .f-18 { font-size: 16px;}   
.store-badge img { height: 45px;}
.play-btn {position: absolute; top: 35%; left: 40%; width: 60px; height: 60px; background: red; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
}

@media screen and (max-width: 420px) {
/* hero-section */
.hero-section .f-60 { font-size: 40px;}
.hero-section .f-18 { font-size: 16px;}
.play-btn {position: absolute; top: 30%; left: 40%; width: 50px; height: 50px; background: red; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.play-btn::before {content: ""; border-top: 9px solid transparent; border-bottom: 9px solid transparent;  border-left: 15px solid white; margin-left: 5px;}
}

@media screen and (max-width: 320px) {
/* hero-section */
.hero-section .f-60 { font-size: 39px;}
.hero-section .f-18 { font-size: 16px;}
.play-btn {position: absolute; top: 30%; left: 40%; width: 40px; height: 40px; background: red; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.play-btn::before {content: ""; border-top: 9px solid transparent; border-bottom: 9px solid transparent;  border-left: 15px solid white; margin-left: 5px;}
}