.file-player{border:solid 1px #ff682a;border-radius:20px;padding:20px;display:flex;align-items:center;gap:10px;width:100%}.file-player>BUTTON.icon{flex-shrink:0;background-color:transparent;background-repeat:no-repeat;background-size:30px;background-position:center;height:30px;width:30px;border-radius:0px}.file-player>BUTTON.icon:nth-child(1){background-image:url(/assets/pages/demo/play.svg)}.file-player>BUTTON.icon:nth-child(2){background-image:url(/assets/pages/demo/stop.svg)}.file-player>SPAN{flex-grow:1}DIV[data-contain="file"] #divFileMain{height:20vh;margin-top:30px}DIV[data-contain="file"] #divFileMain>.file-card{padding:0px 30px}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload{display:flex;flex-direction:column;align-items:center;gap:20px;height:100%;padding:0px}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload>INPUT{display:none}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload>DIV.buttons{width:100%;display:flex;justify-content:space-between}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload>#divFileDrop{flex-grow:1;width:100%;border:dashed 5px #ff682a;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload>#divFileDrop>SPAN{font-size:20px}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload>#divFileDrop.markDrop{background-color:#ff682a;border:none}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload>#divFileDrop.markDrop>SPAN{color:#FFF}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder{display:flex;flex-direction:column;align-items:center;gap:20px;height:100%}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileMicrophones{visibility:hidden;margin-top:10px;display:block}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileMicrophones>IMG{width:20px;height:20px;transform:scale(1);animation-duration:.5s;animation-iteration-count:infinite;animation-direction:alternate;animation-name:micActived}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileMicrophones>IMG:nth-child(1){animation-delay:0s}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileMicrophones>IMG:nth-child(2){animation-delay:0.25s}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileMicrophones>IMG:nth-child(3){animation-delay:0.5s}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileMicrophones.active{visibility:visible}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileTalkNow{flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileTalkNow>SPAN{font-size:20px;animation:blink 1.5s ease-in-out infinite}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileRecordTime{flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileRecorder #fileRecordTime>SPAN{font-size:20px}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2){top:-20vh;display:flex;flex-direction:column;gap:20px;align-items:center;justify-content:center}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2)>DIV:nth-child(2){display:flex;align-items:center;gap:20px;width:100%}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2)>DIV:nth-child(2)>DIV{flex-grow:1}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2)>DIV:nth-child(2)>DIV>#selFileLanguageTo LABEL.caption{padding:0px}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2)>DIV:nth-child(2)>#btFileGenerate{max-width:35%}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2).generating>*:nth-child(1){display:none}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2).generating>*:nth-child(2){display:none}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2).generating>*:nth-child(3){display:block}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(3){top:calc(-20vh - 20vh);display:flex;flex-direction:column;gap:20px;align-items:center;justify-content:center}@media (max-width:1000px){.file-player{border-radius:10px;padding:10px;flex-wrap:wrap}.file-player>BUTTON.icon{background-size:20px;height:20px;width:20px}.file-player>SPAN{max-width:75%}DIV[data-contain="file"] #divFileMain{height:50vh;margin-top:10px}DIV[data-contain="file"] #divFileMain>.file-card{padding:0px 10px}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload>DIV.buttons{width:100%;display:flex;flex-direction:column;align-items:center;gap:10px}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(1)>#fileFrmUpload>#divFileDrop{display:none}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2){top:-50vh;justify-content:flex-start}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2)>DIV:nth-child(2){flex-direction:column}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2)>DIV:nth-child(2)>#selFileLanguageTo{width:100%}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2)>DIV:nth-child(2)>#btFileGenerate{max-width:100%;width:100%}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(2).generating{justify-content:center}DIV[data-contain="file"] #divFileMain>.file-card:nth-child(3){top:calc(-50vh - 50vh);justify-content:flex-start}}@keyframes card_center_to_left{0%{left:0px}100%{left:-100%}}@keyframes card_center_to_right{0%{left:0px}100%{left:100%}}@keyframes card_right_to_center{0%{left:100%}100%{left:0px}}@keyframes card_left_to_center{0%{left:-100%}100%{left:0px}}#divFileMain{overflow:hidden}#divFileMain.from_1_to_2>.file-card:nth-child(1){animation:card_center_to_left 800ms forwards}#divFileMain.from_1_to_2>.file-card:nth-child(2){animation:card_right_to_center 800ms forwards}#divFileMain.from_2_to_1>.file-card:nth-child(1){animation:card_left_to_center 800ms forwards}#divFileMain.from_2_to_1>.file-card:nth-child(2){animation:card_center_to_right 800ms forwards}#divFileMain.from_2_to_3>.file-card:nth-child(2){animation:card_center_to_left 800ms forwards}#divFileMain.from_2_to_3>.file-card:nth-child(3){animation:card_right_to_center 800ms forwards}#divFileMain.from_3_to_1>.file-card:nth-child(1){animation:card_left_to_center 800ms forwards}#divFileMain.from_3_to_1>.file-card:nth-child(3){animation:card_center_to_right 800ms forwards}#divFileMain>.file-card{width:100%;height:inherit;position:relative;left:100%}#divFileMain>.file-card.show{left:0px}