@import"https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap";*{margin:0;padding:0}body{background-color:#181818;color:#ccc;overflow:hidden;font-family:Roboto,sans-serif}:root{--theme-color: #5BB6FF }::-webkit-scrollbar{width:3px}::-webkit-scrollbar-thumb{background-color:var(--theme-color, aqua)}.UserDetailDiv{height:300px;color:#000;display:grid;grid-template-columns:auto auto;padding:20px 0}.UserDetailDiv>svg{width:600px;position:absolute;top:-300px;left:-250px;z-index:-1}.UserDetailDiv>.UserDiv{top:50px;left:75px;justify-self:flex-start;margin:30px 0 0 50px}.UserDetailDiv>.UserDiv>h1{text-shadow:0px 0px 5px #ccc;text-align:center}.UserDetailDiv>.UserDiv>.profileSvg>svg{width:70px}.PeerConnectSection{color:#ccc;display:flex;flex-direction:column;gap:3em;box-sizing:border-box;text-align:center;padding-top:2em;position:relative;font-size:.8em}.PeerConnectSection>h3>strong{cursor:pointer;color:#0f0}.PeerConnectSection .copyIconSpan{margin:1em;padding:10px;border-radius:10px;background-color:#333;transition:.2s ease-in-out}.PeerConnectSection .copyIconSpan:hover{padding:12px;font-size:1.1em}.PeerConnectSection .activeCopyBtn{background-color:#007cff;color:#000;position:relative}.PeerConnectSection .activeCopyBtn:after{content:"Copied";position:absolute;color:#fff;left:110%}.userConnectBarDiv{margin:0 auto;display:grid;grid-template-columns:auto 150px;width:80%;min-width:350px;max-width:800px;height:50px;font-size:1.1em;padding:5px 0;background-color:#333;border-radius:50px;position:relative}.userConnectBarDiv>input{background-color:transparent;color:#ccc;font-size:1.1em;border:none;outline:none;width:100%;padding:10px 30px}.userConnectBarDiv>button{background-color:var(--theme-color, #0ff);border-radius:50px;padding:15px 20px;width:100%;border:none;font-size:1.1em}@media (max-width:800px){.UserDetailDiv{grid-template-columns:auto;gap:5em;height:400px}}.inputField{font-size:1.1em;margin:10px;position:relative;--blue: #09f}.inputField>p{position:absolute;padding-top:5px;bottom:0}.inputField>p>span{position:relative}.floatAnimationApply{animation:floatAnimation .3s ease-in-out forwards}.floatAnimationApplyReverse{animation:floatAnimationReverse .3s ease-in-out!important}.underLineColor{--underLine-color: var(--blue) }.passShowBtn{background-color:transparent;position:absolute;right:0;top:.5em;border:none;cursor:pointer;font-size:1.1em;z-index:2}.inputField>input{padding:5px 10px;width:100%;box-sizing:border-box;outline:none;border:none;font-size:1.1em;transition:.3s ease-in-out;border-bottom:2px solid var(--underLine-color, gray);z-index:1;position:relative;background:transparent}@keyframes floatAnimation{0%{bottom:0;color:#000}70%{bottom:1.5em}to{color:var(--blue);bottom:1.1em}}@keyframes floatAnimationReverse{0%{color:var(--blue);bottom:1.1em}70%{bottom:1.5em}to{bottom:0;color:#000}}.takeUserNameInput{position:fixed;z-index:15;background-color:#fff;color:#000;border-radius:20px;padding:10px;overflow:hidden;top:50%;left:50%;translate:-50% -50%;transition:.5s ease-in-out}.takeUserNameInput>h3{text-align:center;font-weight:1000!important;padding:10px}.takeUserNameInput>.JoinBtn{padding:10px 20px;border-radius:10px;border:none;background-color:var(--theme-color, #09f);margin:10px auto;display:block}.hideUserNameModel{top:150%}.UserListDiv{display:flex;flex-flow:row wrap;gap:2em;margin:30px;text-align:center}.UserListDiv>.UserDiv{transition:.3s ease-in-out;border-radius:50px;display:flex;align-items:center;width:60px;height:60px;background-color:var(--theme-color, #0ff);position:relative}.UserListDiv>.UserDiv>.UserDetailDiv,.UserListDiv>.UserDiv>.UserDetailDiv>svg,.UserListDiv>.UserDiv>.UserDetailDiv>i{display:flex;align-items:center;justify-content:center;transition:.3s ease-in-out;width:60px;border-radius:50%;height:60px;flex-shrink:0;position:static;z-index:1}.UserListDiv>.UserDiv>.UserDetailDiv>i{font-size:3em;color:#fff}.UserListDiv>.UserDiv>.FileManageSection,.UserListDiv>.UserDiv>.DownloadFileManage{height:100%;width:0%;overflow:hidden;transition:.3s ease-in-out;color:#000;display:grid;word-break:break-all}.UserListDiv>.UserDiv>.FileManageSection>label>input[type=file],.UserListDiv>.UserDiv>.DownloadFileManage>label>input[type=file]{display:none}.UserListDiv>.UserDiv>.FileManageSection>label,.UserListDiv>.UserDiv>.FileManageSection>label>h5,.UserListDiv>.UserDiv>.FileManageSection>h5,.UserListDiv>.UserDiv>.DownloadFileManage>label,.UserListDiv>.UserDiv>.DownloadFileManage>label>h5,.UserListDiv>.UserDiv>.DownloadFileManage>h5{font-size:10px;align-self:center}.UserListDiv>.UserDiv>.FileManageSection .progressBar,.UserListDiv>.UserDiv>.DownloadFileManage .progressBar{display:none;background-color:#ccc;margin:2px;border-radius:10px;overflow:hidden;height:10px}.UserListDiv>.UserDiv>.FileManageSection .progressBar>div,.UserListDiv>.UserDiv>.DownloadFileManage .progressBar>div{background-color:#000;height:100%;width:var(--progress, 0%);transition:.3s ease-in-out}.UserListDiv>.UserDiv>.FileManageSection>.FileSendBtn,.UserListDiv>.UserDiv>.FileManageSection .DownloadBtn,.UserListDiv>.UserDiv>.FileManageSection .CancelBtn,.UserListDiv>.UserDiv>.DownloadFileManage>.FileSendBtn,.UserListDiv>.UserDiv>.DownloadFileManage .DownloadBtn,.UserListDiv>.UserDiv>.DownloadFileManage .CancelBtn{border-radius:1em;border:none;padding:0 20px;min-height:10px}.UserListDiv .DownloadFileManage>.BtnsDiv{width:100%;display:flex;justify-content:space-between}.UserListDiv .DownloadFileManage>.BtnsDiv .CancelBtn{background-color:red;color:#ccc}.UserListDiv .DownloadFileManage>.BtnsDiv .DownloadBtn{background-color:#000;color:#0f0}.UserListDiv>.UserDiv:after{content:attr(data-name);position:absolute;top:100%;left:50%;transform:translate(-50%);font-weight:600;z-index:1}.UserListDiv>.UserDiv:hover{scale:1.1}.UserListDiv .activeUserDiv{background-color:var(--theme-color, #0ff);width:300px}.UserListDiv .activeUserDiv>.FileManageSection{width:100%;padding:0 20px}.UserListDiv .downloadShowUser{background-color:#0f0;width:300px}.UserListDiv .downloadShowUser>.DownloadFileManage{width:100%;padding:0 20px}.UserListDiv .downloadShowUser>.FileManageSection{display:none}.UserListDiv .downloadShowUser:not(.activeUserDiv){width:60px!important}.UserListDiv .downloadShowUser:not(.activeUserDiv)>.DownloadFileManage{width:100%;padding:0}.UserListDiv .startProgress>.DownloadFileManage .progressBar,.UserListDiv .startProgress>.FileManageSection .progressBar{display:flex}.UserListDiv .startProgress>.DownloadFileManage .BtnsDiv,.UserListDiv .startProgress>.FileManageSection .BtnsDiv{display:none}.PreLoader{position:absolute;width:100%;height:100%;top:0;left:0;background-color:#000000c5;display:flex;align-items:center;justify-content:center;z-index:10}.PreLoader .loadingAnimation{display:flex;gap:1em}.PreLoader .loadingAnimation>.animationSphere{border-radius:50%;background-color:var(--theme-color, aqua);padding:.5em;animation:sphereAnimate 1s ease-in-out calc(var(--i) * .1s) infinite}.hideLoading{display:none}@keyframes sphereAnimate{0%{transform:translateY(0)}50%{transform:translateY(-1em)}to{transform:translateY(0)}}