:root{--tuneflo-black:#000;--tuneflo-white:#fff;--tuneflo-grey:#f6f8fa;--tuneflo-blue:#0171e2;--tuneflo-green:#81fbac;--tuneflo-red:#fe5d00}body{font-family:DMSans-Regular,Helvetica;background-color:#f6f8fa;margin:0;padding:0;font-size:15px;font-weight:400;line-height:20px;letter-spacing:0;text-align:left}h1{font-size:36px}h2{font-size:30px}h3{font-size:20px}h4{font-size:15px;font-weight:500}.container-parent{padding:60px}.container{max-width:1150px;margin:0}.container-wraper{max-width:600px;margin:0 auto;padding:0 20px}.top-nav{height:50px!important;overflow:hidden;background-color:#f6f8fa;border-bottom:1px solid #dbddde;align-items:center;display:flex;justify-content:space-between}.top-nav a{float:left;display:block;color:#000;text-align:center;padding:14px 16px;text-decoration:none;font-size:18px;font-weight:400;line-height:23.44px}.heading{font-weight:700!important;font-size:25px!important;line-height:32.25px!important}.top-nav a:hover{background-color:#ddd;color:#000}.top-nav a.active{background-color:#fff;color:#000}.top-nav .icon{display:none}.borders{border-right:1px solid #dbddde}.borders,.borders-left{border-left:1px solid #dbddde}.nev-items{height:10.5px;display:flex!important;align-items:center!important}.banner{background-color:var(--tuneflo-blue);color:#fff;display:flex;justify-content:space-between;justify-content:center;align-items:center;padding:.5em}.banner-text{padding-right:1em}.Title-container{display:flex;align-items:center}.Title-container,.container-w{justify-content:center}.input-box{width:100%}.input-box,.verse-box{position:relative;padding-right:15px;display:inline-flex;flex-direction:column}.verse-box{width:600px}label{display:block;margin-bottom:10px;font-weight:700}input[type=text]{width:95%;padding:10px;font-size:16px;border-radius:5px;border:1px solid #ccc;box-shadow:0 0 8px 1px rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.19)}.question-icon{position:absolute;top:50%;right:9px;transform:translateY(-50%);cursor:pointer;margin-left:5px;margin-top:15px;z-index:1}.tooltip{display:none;position:absolute;top:100%;right:0;background-color:#fff;border:1px solid #ccc;padding:5px 10px;font-size:14px;border-radius:5px;white-space:nowrap}.errortooltip{color:red}.overlay-expand-icon{position:absolute;top:50%;right:31px;transform:translateY(-50%);cursor:pointer;width:20px;height:20px;padding-top:30px}.threeDot-icon{position:absolute;right:29px;transform:translateY(-76%);cursor:pointer;padding:0;font-size:40px}.overlay-shrink-icon{position:absolute;top:7%;right:7.25%;cursor:pointer;width:20px;height:20px;padding-top:30px}.row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;width:100%}select{height:36px;border:none;border-radius:10px;box-shadow:0 0 8px 1px rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.19);margin-right:10px}.button{border:1px solid #fff;text-align:center;display:inline-block;font-size:16px;padding:10px 20px;margin-top:15px;border-radius:9px;background:#fff;cursor:pointer;float:right;box-shadow:4px 4px 3px 0 rgba(0,0,0,.2)}button:hover{background:#f1f3f4}.output{width:100%;height:calc(100vh - 400px);border:1px solid #ccc;border-radius:5px;padding:10px;overflow-y:scroll;box-shadow:0 0 8px 1px rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.19)}.chords-wrapper{gap:10px;padding-top:20px;margin-right:-20px}.chords-wrapper,.d-flex{display:flex;align-items:center}.d-flex{gap:11px}.main-option-cntainer-wraper{width:603px;margin:0 auto}.flex-wrap{display:flex;flex-wrap:wrap;gap:18px}.align-item-center{display:flex;align-items:center;gap:25%;width:22%;min-width:49px}.cursor-pointer{cursor:pointer}.mb-0{margin-bottom:0}.mb-2{margin-bottom:20px}.mb-4{margin-bottom:40px}.mt-2{margin-top:20px}.boxShadow-chorus{box-shadow:4px 4px 4px 0 rgba(89,227,148,.5)}.boxShadow-bridge{box-shadow:4px 4px 4px 0 rgba(247,111,185,.5)}.boxShadow-verse1{box-shadow:4px 4px 4px 0 rgba(248,224,78,.5)}.boxShadow-verse2{box-shadow:4px 4px 4px 0 rgba(120,227,229,.5)}.threeDotOption{display:flex;flex-direction:column;justify-content:center;height:130px;margin-bottom:46px;border:1px solid #c8c5c5;border-radius:25px 14px 17px 5px;padding:10px;z-index:3;background:#f8f8f8}.copiedPanel{margin:5px;background-color:#69af7a;height:21px;color:#fff;border:none;border-radius:5px}.threeDotOptionButtons{background-color:#fff}.disabled,.threeDotOptionButtons{margin:5px;height:21px;color:#000;border:none;border-radius:5px;box-shadow:4px 4px 3px 0 rgba(0,0,0,.2)}.disabled{background-color:#e6e6e6}.optionLabel{display:flex;gap:6px}.toastSuccess{color:#155724e8;background-color:#d4edda}.toastError,.toastSuccess{display:flex;position:fixed;align-items:center;justify-content:center;z-index:6;top:7%;font-size:15px;height:62px;width:230px;right:3%;border-radius:10px}.toastError{color:#721c24d4;background-color:#f8d7da}.verseHeadingMargin{margin:0 0 21px}.mainOptionButtons{border:none;height:34px;width:34px;border-radius:10px;box-shadow:4px 4px 4px 0 rgba(0,0,0,.25);background:#fff}.displayNone{display:none}.overlay-shrink-icon-regenerate{position:absolute;top:18%;right:18.2%;cursor:pointer;width:20px;height:20px;padding-top:30px}.regenerate-button{background-color:#000;border:none;color:#fff;text-align:center;display:inline-block;font-size:16px;padding:10px 20px;border-radius:25px;cursor:pointer}.buttonsDiv{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px}.text-area{font-size:16px;background-color:#fff;padding:10px 10px 10px 18px;color:#000;border-radius:22px 22px 22px 22px;width:-webkit-fill-available;border:none;min-height:100px;resize:none;outline:none}textarea::-webkit-scrollbar{width:2px}textarea::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px hsla(0,0%,50%,.3)}textarea::-webkit-scrollbar-thumb{background-color:#a9a9a9;outline:1px solid #708090}.border{border:1px solid}.create-panel-button{border:1px solid #fff;text-align:center;display:inline-block;font-size:16px;padding:10px 20px;border-radius:8px;background:#fff;cursor:pointer;box-shadow:4px 4px 3px 0 rgba(0,0,0,.2)}.add-new-panel-icon{width:37%;min-width:18px;min-height:40px;height:79%}.create-panel-input-div{display:flex;align-items:center;width:27%;justify-content:center}.create-panel-input{width:60px;height:27px;border-radius:6px;border:none;box-shadow:0 0 13px 1px rgba(0,0,0,.2),0 2px 13px 0 rgba(0,0,0,.19)}.create-panel-items{display:flex;align-items:center;gap:11px;width:23%;height:55px}.create-panel-items-parent{display:flex;align-items:center;gap:11px;justify-content:space-between}.create-panel-buttonsDiv{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding-right:11px}.create-panel-label{margin-bottom:0}.unselectable{-webkit-user-select:none;-webkit-touch-callout:none;-moz-user-select:none;user-select:none}.textarea-parent{background-color:#fff;color:#000;border-radius:25px}.dragableDiv{height:48px;display:flex;align-items:center;justify-content:space-between}.three-dot-parent{width:63px;height:30px}.three-dot-icons,.three-dot-parent{display:flex;align-items:center;justify-content:center}.three-dot-icons{width:70px;height:36px;gap:6px;transform:translateX(100%);transition:transform .5s;opacity:1;transform:translateX(0)}.song-generator{margin-top:35px}.song-generator-title{margin-top:15px}.song-generator-panel{margin-top:35px}.song-title{height:36px;border-radius:4px;padding-left:12px;font-size:24px;font-weight:400;transition:border-color .15s ease-in-out 0s;outline:none;color:#21313c;background-color:#f6f8fa;padding-right:12px;border:0;text-align:center}.steps-parent{position:fixed;top:30px;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;gap:60px}.card-body{width:190px;height:215px;border-radius:15px;background:#fff;box-shadow:4px 4px 4px 0 rgba(0,0,0,.25)}.card-content{display:flex;flex-direction:column;align-items:center;height:100%;justify-content:center}.Genre-body{width:38%;background:#fff;height:-moz-fit-content;height:fit-content;border-radius:25px;padding:0 20px 19px 25px;box-shadow:0 4px 4px 0 rgba(0,0,0,.25)}.regenerate-alert{display:flex;gap:15px;align-items:center;justify-content:flex-end}.error-message{font-size:14px;color:red;margin:0}.genre-inp{width:32%;padding:10px;font-size:16px;border-radius:5px;border:1px solid #ccc;box-shadow:0 0 8px 1px rgba(0,0,0,.2),0 0 0 0 rgba(0,0,0,.19)}.genre-input{width:116px;border-radius:10px;height:34px;border:1px solid #0096ff;text-align:center}.inp-div{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.selected-option-border{border:1px solid #0096ff}.option-border{border:1px solid #000}.option{width:120px;border-radius:10px;display:flex;align-items:center;justify-content:space-around;height:37px;gap:6px}.options{display:flex;gap:8px;padding:23px 30px 30px 51px;flex-wrap:wrap}.genre-footer{display:flex;align-items:center;justify-content:space-between}.option-value:hover{border:1px solid #0096ff}.loader{position:fixed;top:0;left:0;width:100vw;height:100vh;align-items:center;z-index:9999;background-color:rgba(0,0,0,.28)}.containerL,.loader{display:flex;justify-content:center}.circle{margin-left:5px;height:10px;width:10px;background:#00587c;border-radius:10px;transform-origin:center}.one{animation:puls 1s cubic-bezier(.215,.61,.355,1) infinite}.two{animation:puls 1s cubic-bezier(.215,.61,.355,1) .1s infinite}.three{animation:puls 1s cubic-bezier(.215,.61,.355,1) .2s infinite}@keyframes puls{0%{transform:scale(1) translateY(10px);height:10px}50%{transform:scale(.5) translateY(-30px);height:40px}to{transform:scale(1) translateY(15px)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@media only screen and (max-width:645px){.main-option-cntainer-wraper{width:192px;margin:0 auto}.verse-box{position:relative;padding-right:15px;display:inline-flex;flex-direction:column;width:100%}}@media only screen and (max-width:455px){.steps-parent{position:relative;top:50px;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;gap:60px;flex-wrap:wrap}}@media only screen and (max-width:690px){.option{width:65px;border-radius:10px;font-size:11px;display:flex;align-items:center;justify-content:center;height:30px;gap:3px}.options{display:flex;gap:8px;padding:16px 21px 18px 22px;flex-wrap:wrap}.Genre-body{width:59%;background:#fff;height:-moz-fit-content;height:fit-content;border-radius:25px;padding:0 20px 19px 25px;box-shadow:0 4px 4px 0 rgba(0,0,0,.25)}.selected-option{width:90px}}@media only screen and (max-width:830px){.my-projects-main{margin:10px auto 0;border-radius:20px;width:600px!important;max-height:599;overflow:auto;align-items:center}}@media only screen and (max-width:650px){.my-projects-main{margin:10px auto 0;border-radius:20px;width:400px!important;max-height:599;overflow:auto;align-items:center}}@media only screen and (max-width:438px){.my-projects-main{margin:10px auto 0;border-radius:20px;width:300px!important;max-height:599;overflow:auto;align-items:center}}.my-projects-main{border-radius:20px;margin:10px auto 0;width:724px;max-width:724;max-height:599;overflow:auto;align-items:center}.under_top{display:flex!important;justify-content:space-between}.search_input{border-radius:10px!important;border:none;padding:0 0 0 38px;height:35px!important;width:250px!important}.table_div{margin-top:30px}.table_div nextui-table-column-header{color:#000!important}.search_div{position:relative;padding-left:5px}.search_img{position:absolute;top:6px;left:10px!important}.sort_by{position:absolute;cursor:pointer;margin-top:2px;margin-left:15px}.heading_project{text-align:center;margin-bottom:30px}.edit_input:hover{border:2px dotted;cursor:pointer}.edit_input,.edit_input:hover{width:200px;height:25px;padding-left:10px}.edit_input{font-size:18px;font-weight:400;border:2px solid #fff}.header_btn{display:flex}.header_btn_div,.header_btn_div1{width:35px;border:1px solid #fff;background-color:#fff;cursor:pointer;margin-left:5px;border-radius:10px}.header_btn_div1{margin-right:15px}.active_header_btn_div1,.header_btn_div1:hover{margin-right:15px}.active_header_btn_div1,.header_btn_div1:hover,.header_btn_div:hover{width:35px;border:1px solid #000;background-color:#fff;cursor:pointer;margin-left:5px;border-radius:10px}.image_header,.image_header2{margin-top:5px;margin-left:5px}.project_name_column{color:#000!important;font-size:18px!important;font-style:normal;font-weight:400!important;line-height:normal}.nextui-c-kNgzEX-hHqiAG-allowsSorting-true:hover{color:#000!important;background:#f1f3f5!important;cursor:pointer}.custom-header .navbar-nav.me-auto.mb-2.mb-lg-0{display:flex;justify-content:center;width:-webkit-fill-available}.custom-header .navbar-nav .nav-link.active,.custom-header .navbar-nav .nav-link.show,.custom-header .navbar-nav .nav-link:hover{color:#2563eb}.banner-sec-right img{width:100%}.banner-sec{background:linear-gradient(316deg,#161f3e 42%,#122636 72%);padding:200px 0 100px}.Need-p{font-size:40px;font-weight:700;line-height:54.6px;letter-spacing:.16px;margin:0 0 25px}.Need-p,.Need-p1{color:#fff;font-style:normal}.Need-p1{font-size:15px;font-weight:400;line-height:25.6px;letter-spacing:.32px}.try-bt{color:#2563eb;font-size:16px;font-style:normal;font-weight:700;line-height:20.8px;letter-spacing:.16px;text-transform:uppercase;border-radius:454px;background:#fff;border:none;padding:0 30px;height:60px;margin:25px 0 0}.try-bt img{max-width:41px}.custom-header{position:absolute;left:0;right:0;top:0}.login-frame{background-color:#fff;border-radius:25px;height:364px;overflow:hidden;position:relative;width:448px}.login-frame .welcome-to-tuneflo{color:#000;font-size:30px;font-weight:700;height:62px;left:66px;letter-spacing:0;line-height:25px;position:absolute;text-align:center;top:31px;width:317px}.login-frame .tuneflo-logo-color-instance{height:69px!important;left:190px!important;position:absolute!important;top:101px!important;width:69px!important}.login-frame .continue-with-google{align-items:flex-start;background-color:#fff;border-radius:10px;box-shadow:0 2px 3px #0000002b,0 0 3px #00000015;display:flex;gap:15px;left:94px;padding:15px;position:absolute;top:236px;width:-moz-fit-content;width:fit-content}.login-frame .google-logo{height:24px;min-width:24px;position:relative}.login-frame .text-wrapper{color:#0000008a;font-family:Roboto-Medium,Helvetica;font-size:20px;font-weight:500;letter-spacing:0;line-height:normal;margin-top:-1px;position:relative;white-space:nowrap;width:-moz-fit-content;width:fit-content}.spinner-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;z-index:9999}