body {
    margin: 0;
    padding: 0;
}

.play-bt {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 5px;
    background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAw1JREFUeNrcmttLVEEcx2cP2pVSowtKFBQRSpoYW1QEQUVRIXSBHpIIumBPIQU+9Bd0gSKhrJ6jiOhCgT4EZQ9dKShJKboRhEWBaCm5atP3187AYZhd98yc457ZL3xwPc6657NzzplrgnPOQsoikBRUgnJQBiaDBEiBPvANfAQvwTPQCf7YfnjCUmQe2Al2gDowyeB/vAVt4IoQMwuJGFAJWkEvDy+joB1sMjmnoG8oBSfAAI82t0B1VCLrQBcfv/SDprBFjoIUz0+uiivBWqSF5z9PQEW28xzrqXURHGDxyGuwGXzV/dHL8sZTMZKg1IAboCSICAkcYfHLcnBJNLBjNohLwSMwhcU3TeBMNpFi0AFWsnhnQHSFujNdWvsdkKBMBScz1Uip6MDNZe5kA7hHL4p8B/daSAyC75pvbbZy7Df4oRybBmYafm6zFJENygTL7sddUKywS1PusqbcQcuOZh05yHtkjRhDmGYUDGswLZdr6Pwb/Df7dttxTY5tVK7lgmQLmOiJR+5a5m5oZLqERBaIX1wN1fIKEqkSteJylnmO14bMQk9MILieOSQyowBEpnuGUzhxy//HLy8AEe6JLrHrGfQ0nT0X00sinwtApIdE3hWASDeJvAG/HBd5TiI9LD1n5GqGwFP5+G13WOQF+CTHAjfBiOXASvdNqRnJsVyQXKfKkGN2uk/ui8G8SWaBVcqxGk25ck25KguJfnBNnUXZCu44dlm1gkOqCF1mD8FqRySoR1IL3qvj5b/gmEN9rxYpodaIzHnQGHMJWkBN+ts/nQhN2z9mdtNDUYamj9aL24D57ws1tBbeEOPWvlmVyCRCocX8PZZtSxQ5C07rRyTZ1w93g2Eej1ywXQzdBvryLHE8rOXpJOjMgwCtte8Le8NAGTg3jhIPQG1UWzjkDoiOCAU+gEZQFOVeFD/1oA0MhSTwChwWNR/4fGy3OVGqQT3YKHq8JTm+LyWG2bT4elv8TJmeRBgi/lSIbvliMJ+mMll6CY7aK9pc9hN8EX2kLpbegBZKW/VPgAEAGYXv2/tP1L0AAAAASUVORK5CYII=) no-repeat 5px;
    position: absolute;
    bottom: 0%;
    left: 0%;
    /* margin-left:-25px; */
    /* margin-top:-40px; */
    z-index: 99;
    cursor: pointer;
}

.play-bt_right {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 5px;
    background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAw1JREFUeNrcmttLVEEcx2cP2pVSowtKFBQRSpoYW1QEQUVRIXSBHpIIumBPIQU+9Bd0gSKhrJ6jiOhCgT4EZQ9dKShJKboRhEWBaCm5atP3187AYZhd98yc457ZL3xwPc6657NzzplrgnPOQsoikBRUgnJQBiaDBEiBPvANfAQvwTPQCf7YfnjCUmQe2Al2gDowyeB/vAVt4IoQMwuJGFAJWkEvDy+joB1sMjmnoG8oBSfAAI82t0B1VCLrQBcfv/SDprBFjoIUz0+uiivBWqSF5z9PQEW28xzrqXURHGDxyGuwGXzV/dHL8sZTMZKg1IAboCSICAkcYfHLcnBJNLBjNohLwSMwhcU3TeBMNpFi0AFWsnhnQHSFujNdWvsdkKBMBScz1Uip6MDNZe5kA7hHL4p8B/daSAyC75pvbbZy7Df4oRybBmYafm6zFJENygTL7sddUKywS1PusqbcQcuOZh05yHtkjRhDmGYUDGswLZdr6Pwb/Df7dttxTY5tVK7lgmQLmOiJR+5a5m5oZLqERBaIX1wN1fIKEqkSteJylnmO14bMQk9MILieOSQyowBEpnuGUzhxy//HLy8AEe6JLrHrGfQ0nT0X00sinwtApIdE3hWASDeJvAG/HBd5TiI9LD1n5GqGwFP5+G13WOQF+CTHAjfBiOXASvdNqRnJsVyQXKfKkGN2uk/ui8G8SWaBVcqxGk25ck25KguJfnBNnUXZCu44dlm1gkOqCF1mD8FqRySoR1IL3qvj5b/gmEN9rxYpodaIzHnQGHMJWkBN+ts/nQhN2z9mdtNDUYamj9aL24D57ws1tBbeEOPWvlmVyCRCocX8PZZtSxQ5C07rRyTZ1w93g2Eej1ywXQzdBvryLHE8rOXpJOjMgwCtte8Le8NAGTg3jhIPQG1UWzjkDoiOCAU+gEZQFOVeFD/1oA0MhSTwChwWNR/4fGy3OVGqQT3YKHq8JTm+LyWG2bT4elv8TJmeRBgi/lSIbvliMJ+mMll6CY7aK9pc9hN8EX2kLpbegBZKW/VPgAEAGYXv2/tP1L0AAAAASUVORK5CYII=) no-repeat 5px;
    position: absolute;
    bottom: 0%;
    right: 0%;
    /* margin-left:-25px; */
    /* margin-top:-40px; */
    z-index: 99;
    cursor: pointer;
}

.pause-bt {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 5px;
    background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAw1JREFUeNrcmttLVEEcx2cP2pVSowtKFBQRSpoYW1QEQUVRIXSBHpIIumBPIQU+9Bd0gSKhrJ6jiOhCgT4EZQ9dKShJKboRhEWBaCm5atP3187AYZhd98yc457ZL3xwPc6657NzzplrgnPOQsoikBRUgnJQBiaDBEiBPvANfAQvwTPQCf7YfnjCUmQe2Al2gDowyeB/vAVt4IoQMwuJGFAJWkEvDy+joB1sMjmnoG8oBSfAAI82t0B1VCLrQBcfv/SDprBFjoIUz0+uiivBWqSF5z9PQEW28xzrqXURHGDxyGuwGXzV/dHL8sZTMZKg1IAboCSICAkcYfHLcnBJNLBjNohLwSMwhcU3TeBMNpFi0AFWsnhnQHSFujNdWvsdkKBMBScz1Uip6MDNZe5kA7hHL4p8B/daSAyC75pvbbZy7Df4oRybBmYafm6zFJENygTL7sddUKywS1PusqbcQcuOZh05yHtkjRhDmGYUDGswLZdr6Pwb/Df7dttxTY5tVK7lgmQLmOiJR+5a5m5oZLqERBaIX1wN1fIKEqkSteJylnmO14bMQk9MILieOSQyowBEpnuGUzhxy//HLy8AEe6JLrHrGfQ0nT0X00sinwtApIdE3hWASDeJvAG/HBd5TiI9LD1n5GqGwFP5+G13WOQF+CTHAjfBiOXASvdNqRnJsVyQXKfKkGN2uk/ui8G8SWaBVcqxGk25ck25KguJfnBNnUXZCu44dlm1gkOqCF1mD8FqRySoR1IL3qvj5b/gmEN9rxYpodaIzHnQGHMJWkBN+ts/nQhN2z9mdtNDUYamj9aL24D57ws1tBbeEOPWvlmVyCRCocX8PZZtSxQ5C07rRyTZ1w93g2Eej1ywXQzdBvryLHE8rOXpJOjMgwCtte8Le8NAGTg3jhIPQG1UWzjkDoiOCAU+gEZQFOVeFD/1oA0MhSTwChwWNR/4fGy3OVGqQT3YKHq8JTm+LyWG2bT4elv8TJmeRBgi/lSIbvliMJ+mMll6CY7aK9pc9hN8EX2kLpbegBZKW/VPgAEAGYXv2/tP1L0AAAAASUVORK5CYII=) no-repeat 5px;
    position: absolute;
    bottom: 0%;
    left: 0%;
    /* margin-left:-25px; */
    /* margin-top:-40px; */
    z-index: 99;
    cursor: pointer;
}

.pause-bt_righ {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 5px;
    background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAw1JREFUeNrcmttLVEEcx2cP2pVSowtKFBQRSpoYW1QEQUVRIXSBHpIIumBPIQU+9Bd0gSKhrJ6jiOhCgT4EZQ9dKShJKboRhEWBaCm5atP3187AYZhd98yc457ZL3xwPc6657NzzplrgnPOQsoikBRUgnJQBiaDBEiBPvANfAQvwTPQCf7YfnjCUmQe2Al2gDowyeB/vAVt4IoQMwuJGFAJWkEvDy+joB1sMjmnoG8oBSfAAI82t0B1VCLrQBcfv/SDprBFjoIUz0+uiivBWqSF5z9PQEW28xzrqXURHGDxyGuwGXzV/dHL8sZTMZKg1IAboCSICAkcYfHLcnBJNLBjNohLwSMwhcU3TeBMNpFi0AFWsnhnQHSFujNdWvsdkKBMBScz1Uip6MDNZe5kA7hHL4p8B/daSAyC75pvbbZy7Df4oRybBmYafm6zFJENygTL7sddUKywS1PusqbcQcuOZh05yHtkjRhDmGYUDGswLZdr6Pwb/Df7dttxTY5tVK7lgmQLmOiJR+5a5m5oZLqERBaIX1wN1fIKEqkSteJylnmO14bMQk9MILieOSQyowBEpnuGUzhxy//HLy8AEe6JLrHrGfQ0nT0X00sinwtApIdE3hWASDeJvAG/HBd5TiI9LD1n5GqGwFP5+G13WOQF+CTHAjfBiOXASvdNqRnJsVyQXKfKkGN2uk/ui8G8SWaBVcqxGk25ck25KguJfnBNnUXZCu44dlm1gkOqCF1mD8FqRySoR1IL3qvj5b/gmEN9rxYpodaIzHnQGHMJWkBN+ts/nQhN2z9mdtNDUYamj9aL24D57ws1tBbeEOPWvlmVyCRCocX8PZZtSxQ5C07rRyTZ1w93g2Eej1ywXQzdBvryLHE8rOXpJOjMgwCtte8Le8NAGTg3jhIPQG1UWzjkDoiOCAU+gEZQFOVeFD/1oA0MhSTwChwWNR/4fGy3OVGqQT3YKHq8JTm+LyWG2bT4elv8TJmeRBgi/lSIbvliMJ+mMll6CY7aK9pc9hN8EX2kLpbegBZKW/VPgAEAGYXv2/tP1L0AAAAASUVORK5CYII=) no-repeat 5px;
    position: absolute;
    bottom: 0%;
    right: 0%;
    /* margin-left:-25px; */
    /* margin-top:-40px; */
    z-index: 99;
    cursor: pointer;
}

.stop-bt_left {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 5px;
    background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAxxJREFUeNrcmktoFDEYxzPDamuxKopdaFVQEV+giFVaFbRWRER8IbRFKipV0KMHbx68eVVQRPSyF8WLFPGBVMRnS2tPolgoimgVWl91i7Dt1vj/2AyM407nsUk32T/8LrvzyH+SfEm+xOKcM0maBhaADWAxqAFzQSWwQQZ8B5/AEOgEfeCLjJcnJNxfD5rAZrAElEW4/yd4Ae6B2+BD7JJQjcSgAhwFnVyevoGLYGWcMsUxsR/0cnVKC0MLVRmpASk+efoIWmUbaQD9vDi6JppywUboq4zw4qoDJAsxchyMcT3UBar9ympNMI60ghTTS8/ALjDs/cPPyEYR2yuZfroFmsGo+0c7z4U0Gl/V1ARpHzgVpkaugGNMb42ARtDtZ4T+vAumBjyIqpUrLOgUn9bi1iOwHWS9Rqjwj0FdwAPGxQP6FJpoB6tCXNsCbngnjbtDmHBEM9YBhTUyFvK606LzZ2xXp2+L+NVUiVqGFfLaNWCbO2otB1uZmTrsNrJX8VdWqQaQtEU/aWTmag61JjJSBdYys1VLRhaB6YYbqScj60IMPrqrigzMZOZrNhmZVQJGKsjIjBIwkrBZiYiM/CoBH1k737LRQP22RT7WdP0gIz3gj+FGPpORdyBtuJEnZIRS/C8NN/LKFkvXhwab+Erld8aR9gjLS91ElTDkGHkLOgw1knKvEClqXY5wc0ZhwUYjRNEepwLcWRRKkT5nuXRp0GxghXhhQrIJLpIPYddH50Q5/kvQ0T7gAxacoBtXOPZYIT8Q9Y0dLE+CztElcELzfpEWSYdedzPx6gx4o7mRs24TfjVCqhN9RsdF101w0GlSE9UIqQucZJ49CA1Eies2rwkWkHS4znLbC7qYoYja5DcvDFoh0mBzRIPF132wR8wLfQJ3uO3pTeB1kTZB6fBAmcwDA0mx552dJAPvQYvKIxw7QbdCA8PgPJiv+iwKUQ4OgacS9+EHwQWwLE6ZLAnntWrBAbAFrAblEeZVgyLU05h1h+XOcsWb10g8eEbzs3lgPVjKcun+avbvwTPK2AyI6EPhtF+YKVh/BRgAE4h+1tvQXHoAAAAASUVORK5CYII=) no-repeat 5px;
    position: absolute;
    bottom: 25px;
    left: 100px;
    margin-left: -25px;
    margin-top: -40px;
    z-index: 99;
    cursor: pointer;
}

.stop-bt {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 5px;
    background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAxxJREFUeNrcmktoFDEYxzPDamuxKopdaFVQEV+giFVaFbRWRER8IbRFKipV0KMHbx68eVVQRPSyF8WLFPGBVMRnS2tPolgoimgVWl91i7Dt1vj/2AyM407nsUk32T/8LrvzyH+SfEm+xOKcM0maBhaADWAxqAFzQSWwQQZ8B5/AEOgEfeCLjJcnJNxfD5rAZrAElEW4/yd4Ae6B2+BD7JJQjcSgAhwFnVyevoGLYGWcMsUxsR/0cnVKC0MLVRmpASk+efoIWmUbaQD9vDi6JppywUboq4zw4qoDJAsxchyMcT3UBar9ympNMI60ghTTS8/ALjDs/cPPyEYR2yuZfroFmsGo+0c7z4U0Gl/V1ARpHzgVpkaugGNMb42ARtDtZ4T+vAumBjyIqpUrLOgUn9bi1iOwHWS9Rqjwj0FdwAPGxQP6FJpoB6tCXNsCbngnjbtDmHBEM9YBhTUyFvK606LzZ2xXp2+L+NVUiVqGFfLaNWCbO2otB1uZmTrsNrJX8VdWqQaQtEU/aWTmag61JjJSBdYys1VLRhaB6YYbqScj60IMPrqrigzMZOZrNhmZVQJGKsjIjBIwkrBZiYiM/CoBH1k737LRQP22RT7WdP0gIz3gj+FGPpORdyBtuJEnZIRS/C8NN/LKFkvXhwab+Erld8aR9gjLS91ElTDkGHkLOgw1knKvEClqXY5wc0ZhwUYjRNEepwLcWRRKkT5nuXRp0GxghXhhQrIJLpIPYddH50Q5/kvQ0T7gAxacoBtXOPZYIT8Q9Y0dLE+CztElcELzfpEWSYdedzPx6gx4o7mRs24TfjVCqhN9RsdF101w0GlSE9UIqQucZJ49CA1Eies2rwkWkHS4znLbC7qYoYja5DcvDFoh0mBzRIPF132wR8wLfQJ3uO3pTeB1kTZB6fBAmcwDA0mx552dJAPvQYvKIxw7QbdCA8PgPJiv+iwKUQ4OgacS9+EHwQWwLE6ZLAnntWrBAbAFrAblEeZVgyLU05h1h+XOcsWb10g8eEbzs3lgPVjKcun+avbvwTPK2AyI6EPhtF+YKVh/BRgAE4h+1tvQXHoAAAAASUVORK5CYII=) no-repeat 5px;
    position: absolute;
    bottom: 25px;
    right: 100px;
    margin-left: -25px;
    margin-top: -40px;
    z-index: 99;
    cursor: pointer;
}

.mute-bt {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 5px;
    background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA61JREFUeNrsmUlIVVEYxzM1S0sbJMvMMBQ0XKgN0IANBoVWFAVBrlpYJLqwVbWLaGVJRkW0MRpWNkohRFSYoEHDIqkoUlAbzAw1UXLg9j9wDv378j29vXevr7gf/PA70/X835nu+W6YZVmT/gcL84R4QjwhnhBPyCi2G2SDC6DZZtuNIBbcBiM+aykhDlNm/bJ7INxG221gWLc95q+ukwImg1PW79YJ4mw8o1K03+K2kOngpvWnfbIpJAd8p/atYI5bQhaCRmt0G4+QKJEuEs8474aQbNBi+baxhOwBzeCOqFdDzxgEWU4KKQDdln/zJ0RtAm1U9yKVpYkpds0pIQfAiDW2+ROijoJbov4mKq+g/B9aXFCFHLfGb2NNrSTQRfWfgkhdlgL6qawiWELUorxs2TMpZIleV/zcYtFmF5Xx/2vhjYFP9ihQDBaN88RdBlbbPKU/g3TQA7aC6yASlIIzus4U0ATSdPoByNP+ZlBLz1sL6uTJfthy3nhEzlF+D0igvhykMrX2Mul8+kBl5abNZFKX7fJ7XjX56l2qhNJX9KgpU33M136fHiFjK8EMU8nYsMtCHoIaSu8F0dr/AhqobB35nK+mX4oUMhFWSf4CsJzSdeRnmV9erx9j8SA1FIQ0go+UziX/CfnzQLL228EQTbvkUBDSD15QmkdE3VsGzb1Ji1H2DfRSvYRQEKLsFflzye/TGJup/w7QRmA2ipAQwp2aRv4QTSFzzplNaZDyI0NFiOy8sXCN3FVVnyMofyRUhKSR30W+2opjKG3WxVTawcwUnHAh6pfNofRL8pPEaHXQWomj/M5QEJIJFlP6kXiXM9YNWrU/X4+KsbZQELKP+tAjTu01YqTMtEsXApulkAiXRWTo1xJjN6iz0eJwrCd/Bfkt4L0U0uCykEKaImrnKaey7XoKGaulrTaP8p+Br3IUTuuhGs99RJ20BWBpAEKek6/uIq8pXSKmVaP2c8TUuhuMSGOsiG78zQ1xg74BhlFevmhTSmUnfAX7Ar2vR4CzQbyzR4M3VL+N6s8GHVR21YkoyqEgCTkp6hf5iCErW+VUXEsF1wYCFPKO6j7WI67yZ4F2Kqt3OtKYK4bfrpD9oFdPr1TKl8HwAjdiv+mgKYDYbyKIofR6METPqHUzGh8P7gchGp8oYsl9IMPt7yMqeFYV4PeRI6J92UR86DEcFYvUzherHdS22l9dt74hFuo33Srw1mbbnSARXBK3Se+rrifEE+IJ+YftpwADAJs4uzLWopW5AAAAAElFTkSuQmCC) no-repeat 5px;
    position: absolute;
    bottom: 25px;
    right: 25px;
    margin-left: -25px;
    margin-top: -25px;
    z-index: 99;
    cursor: pointer;
}

.mute-bt.stop {
    background: #000 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAqpJREFUeNrsmU1IVUEUx59SZoiKiBV9WGAaqYuKsKKCQltEtI5cJEIf60IMIYPapAuh0CiKFtLmSQTRuhSEPqAWrWoXhKJPjT4oAym9/QfOxcPhznv39t5478Qc+PG4M2fuvD9z5szHLfI8L/U/WJET4oQ4IU6IExJg7WAvuA8+GOlBCTHMdW/Z3oLVJvoxOSIl4B7oYGVzoB58tyW01lMYnRTl02CnLUKawGOwI6DOGiGHQBps0tRbIeQ0hVNZFh9jQgqVNXq8cDYFKk1krXxfoEb0jhfepJCDoBc0Rez3LLgEKgohpAqkvWjGhdSBn1Seoecw/fax9930y1eJSOsDR9TcCRGV68C2PKK6gs0nla6fgFYwm6XNZcK3jbo5Ytr4iKiwvCXqx0CpZiROgEXm+xXs0YXWSgpRlIBR4XM7QMRu8IX5/CZhqaQIUVTTHozbVVa/FXwS9edzZa04hPh/dlr4ttOIvRDl/WHSb1xCFK1ggfl+pjnDLR12HYlTSIpG4Y+m7WtQbosQRVeAmHdgQ7Z2xQk8tb5Xq4IomwKZKHutuEekGcxo2t6NsteKU8gW8JH5qvCaFe27ky5kDXgpfG+ABtqH+bYETiVZyAPh95RdUrTRSu7bPNiXRCEDwmcclAmfDuEzIXfLcQvpFPWToFYzD64EpOQanZA3NMkW6Tcb+QrZDn6xuh/gQI41ZkS8b1B3HjkMakFxQC6X1gIGQeU/rhflYK24jXyVo00nqALH2JmoIGf2/QGbvSjnkYvgOTgT8WT6kBJCYyFvGhvBCGgO4Zv466AaMAyO2y7Ev+sdAudsvtfiXLPxXkvHBXbVsyJCTH5WOAoegWpWlqHQ+mbbF6tdlNEa6HkG1IF5G79YbQbPaH/Ubaof9zHUCXFCnBAnJBb7K8AA5jNpuFcQhagAAAAASUVORK5CYII=) no-repeat 5px;
}

.video {
    width: 100%;
    position: relative;
}

.tv_video {
    height: 100%;
    width: 100%;
    object-fit: cover;
}