@import"https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap";*,*:after,*:before{margin:0;padding:0;box-sizing:border-box}:root{--mainBG: rgb(27, 27, 27);--secBG: rgb(78, 78, 78);--primTextColor: white;--secTextColor: rgb(209, 209, 209);--lightTextColor: rgb(158, 158, 158);--pink: rgb(248, 67, 127)}html{font-size:62.5%;font-family:Roboto,sans-serif}body{font-size:1.6rem}a{color:inherit;text-decoration:none}ul{list-style:none}button{border:none;cursor:pointer}.videoApp .container{display:flex;background-color:var(--mainBG)}.videoApp .container .main{flex:7}.menuContainer{flex:1;height:100vh;color:#fff;font-size:1.4rem;position:sticky;top:0;background-color:var(--mainBG)}.menuContainer .wrapper{padding:3rem 26px}.menuContainer .wrapper .logo{display:flex;align-items:center;gap:5px;font-weight:700;margin-bottom:25px}.menuContainer .wrapper .logo img{height:25px;width:auto}.menuContainer .wrapper .itemList .item{display:flex;align-items:center;gap:15px;cursor:pointer;margin:15px 0}.menuContainer .wrapper .login{display:block;background-color:transparent;border:1px solid white;padding:8px 16px;color:#fff;margin-top:25px;cursor:pointer;font-weight:600}.menuContainer .wrapper .currentUserInfo{display:flex;align-items:center;gap:15px;margin:15px 0}.menuContainer .wrapper .currentUserInfo img{width:18px;height:18px;border-radius:50%;background-color:#fff;display:flex;object-fit:cover}.menuContainer .wrapper .logout,.menuContainer .wrapper .uploadBtn{margin:15px 0;display:flex;align-items:center;gap:15px}.navContainer{display:flex;justify-content:center;align-items:center;padding:3rem 0;background-color:var(--mainBG);position:sticky;top:0}.navContainer .search{display:flex;justify-content:center;align-items:center;gap:20px}.navContainer .search input{border:none;outline:none;padding:6px 12px;width:40rem;border-radius:5px}.navContainer .search i{color:#fff;cursor:pointer}.homeContainer{display:grid;grid-template-columns:repeat(auto-fill,minmax(275px,360px));padding:2rem;gap:2.6rem;justify-content:center}.cardContainer{cursor:pointer;background-color:var(--secBG);padding:1.1rem;border-radius:10px}.cardContainer.sm{width:100%;margin-bottom:35px}.cardContainer img{width:100%;height:170px;display:block;object-fit:cover}.cardContainer .smThumbnail{height:120px;object-fit:cover}.cardContainer .details{display:flex;margin-top:16px;gap:12px}.cardContainer .details.smtype{margin-top:8px}.cardContainer .details .channelImg{width:40px;height:40px;border-radius:50%;background:#999}.cardContainer .details .channelImg.sm{display:none}.cardContainer .details .texts .title{font-size:1.6rem;font-weight:500;color:#fff}.cardContainer .details .texts .channelName{font-size:1.4rem;margin:9px 0;color:var(--secTextColor)}.cardContainer .details .texts .channelName.smtype{margin:6px 0}.cardContainer .details .texts .info{font-size:1.4rem;color:var(--lightTextColor);font-weight:500}.vidPageContainer{display:flex;gap:25px;padding:1rem 2rem}.vidPageContainer .content{flex:7;background-color:var(--mainBG)}.vidPageContainer .content .vidWrapper video{width:100%;aspect-ratio:16/9}.vidPageContainer .content .vidWrapper .title{font-size:1.8rem;font-weight:600;margin-top:20px;margin-bottom:12px;color:var(--primTextColor)}.vidPageContainer .content .vidWrapper .details{display:flex;align-items:center;justify-content:space-between;font-size:1.5rem;color:var(--secTextColor)}.vidPageContainer .content .details .buttons{display:flex;gap:20px}.vidPageContainer .content .vidWrapper .details .buttons button{display:flex;justify-content:center;align-items:center;gap:5px;font-size:1.6rem;font-weight:600;background-color:transparent;color:var(--pink)}.vidPageContainer .content .vidWrapper .details .buttons button i{font-size:2.2rem}.vidPageContainer .content .vidWrapper .channel{display:flex;justify-content:space-between;margin-top:35px;gap:2rem}.vidPageContainer .content .vidWrapper .channel .channelInfo{display:flex;gap:20px}.vidPageContainer .content .vidWrapper .channel .channelInfo img{width:40px;height:40px;border-radius:50%}.vidPageContainer .content .vidWrapper .channel .channelInfo .channelDetail{display:flex;flex-direction:column;gap:10px}.vidPageContainer .content .vidWrapper .channel .channelInfo .channelDetail .channelName{font-weight:600;color:var(--primTextColor)}.vidPageContainer .content .vidWrapper .channel .channelInfo .channelDetail .subscribers{font-size:1.5rem;font-weight:500;color:var(--secTextColor)}.vidPageContainer .content .vidWrapper .channel .channelInfo .channelDetail .channelDesc{font-size:1.4rem;line-height:1.7;color:var(--lightTextColor)}.vidPageContainer .content .vidWrapper .channel .subscribe{height:40px;padding:5px 10px;background-color:red;color:#fff;font-weight:600;border-radius:10px}.commentsContainer{margin-top:8rem}.commentsContainer .newComment{display:flex;gap:15px;align-items:center}.commentsContainer .newComment img{height:40px;width:40px;border-radius:50%}.commentsContainer .newComment textarea{background:transparent;border:none;border-bottom:1px solid var(--lightTextColor);width:100%;height:35px;padding:5px;font-size:1.6rem;resize:none;caret-color:var(--lightTextColor);color:var(--secTextColor);font-family:Roboto}.commentsContainer .newComment textarea::placeholder{font-family:Roboto;color:var(--lightTextColor)}.commentsContainer .newComment textarea:focus{outline:none}.newComment .addCommentBtn{width:160px;padding:8px;font-size:1.4rem;font-weight:500;color:#fff;background-color:#070;border-radius:10px}.commentsContainer .allComments{margin-top:8rem}.commentsContainer .allComments .singleCommentContainer{display:flex;gap:1.5rem;margin-bottom:5rem}.commentsContainer .allComments .singleCommentContainer img{width:40px;height:40px;border-radius:50%}.commentsContainer .allComments .singleCommentContainer .commentDetail .commentInfo{display:flex;align-items:center;gap:10px;margin-bottom:8px}.commentsContainer .allComments .singleCommentContainer .commentDetail .commentInfo .commentMaker{font-size:1.6rem;color:var(--primTextColor)}.commentsContainer .allComments .singleCommentContainer .commentDetail .commentInfo .commentTime{font-size:1.4rem;font-weight:400;color:var(--secTextColor)}.commentsContainer .allComments .singleCommentContainer .commentDetail .commentDesc{font-size:1.5rem;color:var(--lightTextColor)}.recomContainer{flex:2;color:#fff}.authContainer{display:flex;justify-content:center;align-items:center;height:calc(100vh - 63px);background-color:var(--mainBG)}.authContainer .wrapper{display:flex;align-items:center;flex-direction:column;background-color:var(--secBG);padding:3rem 5rem;border-radius:10px}.authContainer .wrapper .title{font-size:3rem;margin-bottom:15px;color:var(--primTextColor)}.authContainer .wrapper .subTitle{margin:5px 0 20px;font-size:2.2rem;color:var(--primTextColor)}.authContainer .wrapper .subTitle .vidTub{color:#f8437f}.authContainer .wrapper input{font-size:1.6rem;padding:5px 10px;margin-bottom:25px;border:none;outline:none;border-bottom:1px solid var(--lightTextColor);background-color:transparent;width:100%;color:var(--secTextColor)}.authContainer .wrapper input::placeholder{color:var(--secTextColor)}.authContainer .wrapper input:focus{outline:none}.authContainer .wrapper button{display:inline-block;padding:8px 12px;font-size:1.5rem;font-weight:600}.authContainer .wrapper button:nth-of-type(1){margin-bottom:20px;background-color:#f8437f;color:#fff}.authContainer .wrapper button:nth-of-type(2){background-color:#c46416;color:#fff}.authContainer .wrapper button:nth-of-type(3){background-color:#f8437f;color:#fff}.authContainer .wrapper label{color:var(--primTextColor);margin-right:auto;margin-top:2rem;margin-bottom:1rem;padding-left:1rem}.authContainer .wrapper .uploadPerc{color:var(--primTextColor);margin-right:auto;padding-left:1rem;margin-bottom:1rem}.authContainer .wrapper button:disabled{cursor:not-allowed}.createContainer{color:#fff;display:flex;justify-content:center;align-items:center}.createContainer .wrapper{width:80%;background-color:var(--secBG);padding:2rem;display:flex;flex-direction:column;margin-top:5rem}.createContainer .wrapper .title{text-align:center;font-size:2.5rem;font-weight:600}.createContainer .wrapper input:not([type=file]),.createContainer .wrapper textarea{font-size:1.6rem;padding:5px 10px;margin-bottom:25px;border:none;outline:none;border-bottom:1px solid var(--lightTextColor);background-color:transparent;width:100%;color:var(--secTextColor);resize:none}.createContainer .wrapper textarea{height:40px}.createContainer .wrapper input::placeholder,.createContainer .wrapper textarea::placeholder{color:var(--lightTextColor)}.createContainer .wrapper input[type=file]{margin-bottom:2rem;width:max-content}.createContainer .wrapper label{margin-bottom:1rem}div.rti--container{--rti-main: transparent;background-color:transparent;border:none;margin-bottom:2rem}span.rti--tag{background-color:transparent}input.rti--input{margin-bottom:0;margin-top:1.5rem}.tagInp{background-color:red}.createContainer .wrapper .uploadBtn{background-color:var(--pink);width:max-content;margin-inline:auto;padding:.6rem 1.4rem;margin-top:2rem;font-weight:600;text-transform:uppercase;letter-spacing:.6px}.createContainer .wrapper .uploadBtn:disabled{background-color:pink;color:red}.searchContainer{display:grid;grid-template-columns:repeat(auto-fill,minmax(275px,360px));padding:2rem;gap:2.6rem;justify-content:center}
