:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;--button-color: #1a1a1a;--button-light: rgb(128, 206, 99);--button-hover: rgb(63, 63, 63);--background-color: #242424;--background-header: rgb(97, 97, 97);text-align:center;align-items:center;align-content:center;color:#fff;background-color:var(--background-color);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{display:block;min-width:1000px;min-height:100vh;margin:0 10%}.home{margin-top:500px}.home ul{list-style:none;padding:0;width:100%;left:0;right:0;display:inline-block}.home input.searchBar{margin-top:25px;width:75%;transition:width .75s;color:#fff;background-color:var(--button-color);padding:10px 0;text-align:center;border-style:solid;border-color:var(--button-hover);border-radius:20px}.home input.searchBar:focus{border-color:var(--button-hover);width:100%}.home li{padding:50px 6px;margin-bottom:10px;background-color:var(--button-color);transition:background-color .7s;border-style:solid;border-radius:20px;border-width:2px;border-color:var(--button-hover)}.home li button{margin:5px;width:100%;background-color:inherit;border-style:none;color:#fff}.home li:hover{background-color:var(--button-hover)}.navigation{padding:0 0 10%;width:100%;height:600px;left:0;right:0;top:0;z-index:-10;position:absolute;background-image:linear-gradient(180deg,var(--background-header),var(--background-color) 100%)}.navigation .title{padding:100px}.navigation .title h1{margin:0;font-size:75px}.navigation .title p{margin:0}.navigation a{transition:color .75s;color:#fff;text-decoration:none}.navigation a:hover{color:#e68080}.navigation .navBtnFlex{width:80%;display:flex;flex-direction:row;justify-content:center;margin-left:10%;margin-right:10%}.navigation .navBtnFlex a{margin-right:5px;margin-left:5px;width:100%}.navigation .navBtnFlex a button{width:100%;flex:1 1 auto;transition:color .25s;transition:background-color .25s;background-color:var(--button-color);color:#fff;margin-left:5px;margin-right:5px;padding:20px;border-style:none;border-color:var(--button-hover);border-radius:10px}.navigation .navBtnFlex a button:hover{background-color:#fff;flex-grow:2;color:var(--button-color)}.builder{margin-top:500px}.builder .shareBlock .shareFlex{display:flex;flex-direction:row}.builder .shareBlock .shareFlex button{flex:1 1 auto;background-color:var(--button-color);border-style:solid;border-color:var(--button-hover);border-radius:10px;color:#fff;padding:10px;transition:background-color .25s}.builder .shareBlock .shareFlex button a{text-decoration:none;color:#fff}.builder .shareBlock .shareFlex button.postBtn{margin-right:5px}.builder .shareBlock .shareFlex button.exportBtn{margin-left:5px}.builder .shareBlock .shareFlex button:hover{background-color:var(--button-hover)}.builder .shareBlock button.importBtn{background-color:var(--button-color);border-style:solid;border-color:var(--button-hover);border-radius:10px;color:#fff;padding:10px;width:100%;transition:background-color .25s}.builder .shareBlock button.importBtn:hover{background-color:var(--button-hover)}.builder .columns{margin-left:30%;margin-right:30%}.builder .tabColumn{background-color:var(--background-color);border-style:none;border-radius:5px;color:#fff;margin-bottom:15px}.builder .tabColumn:hover,.builder .tabColumn.selectedTab{background-color:var(--button-hover)}.builder .builderUtils .builderUtilBtn{background-color:var(--background-color);border-width:2px;border-style:solid;border-color:var(--button-hover);color:#fff;margin-left:5px;margin-right:5px}.builder .builderUtils .builderUtilBtn:hover{background-color:var(--button-hover)}.builder .builderUtils .builderUtilBtn.playing{background-color:#ff5050;color:#000}.builder .builderUtils .builderUtilBtn.listen{background-color:#50ff50;color:#000}.builder .settings{margin-top:20px}.builder .settings .builderSettings{background-color:var(--background-color);color:#fff;border-radius:5px;border-color:var(--button-hover);border-width:2px;margin-left:5px;margin-right:5px;border-style:solid}.builder .builderUtils{margin-left:5px}.auth{margin-top:500px}.auth input{background-color:var(--background-color);border-style:solid;border-radius:5px;padding:10px;color:#fff;border-color:var(--button-hover);width:33%;margin-left:20%;margin-right:20%;margin-bottom:5px}.auth .utils button{margin-left:5px;margin-right:5px;padding:10px;background-color:var(--background-color);border-color:var(--button-hover);border-style:solid;border-radius:5px;color:#fff;width:10%;transition:background-color .25s}.auth .utils button:hover{background-color:var(--button-hover)}.profile{margin-top:500px}.profile .logoutBtn{width:33%;margin-left:20px;margin-right:20px;padding:10px;border-radius:5px;border-color:var(--button-hover);background-color:var(--background-color);color:#fff;border-style:solid;transition:background-color .25s}.profile .logoutBtn:hover{background-color:var(--button-hover)}.profile .trackList{margin-top:50px}.profile .trackList ul{padding:0;list-style:none}.profile .trackList ul button{width:30%;padding:10px;margin-bottom:10px;margin-right:5px;background-color:var(--background-color);border-radius:5px;border-style:solid;border-width:2px;border-color:var(--button-hover);color:#fff;transition:background-color .25s}.profile .trackList ul button:hover{background-color:var(--button-hover)}.profile .trackList ul .removeTrackBtn{width:5%}.profile .trackList ul .removeTrackBtn:hover{background-color:red}.fretboard .note{background-color:var(--button-color);color:#fff;width:30px;height:20px;border-radius:5px;margin-left:5px;margin-right:5px;border-style:solid;border-color:var(--button-hover);transition:background-color .15s}.fretboard .note:hover{background-color:#fff;color:#000}.fretboard .noteClearBtn{background-color:var(--button-color);margin-left:5px;border-radius:5px;border-style:solid;border-color:var(--button-hover);color:#fff}.fretboard .noteClearBtn:hover{background-color:red}.fretboard .tuningSelect{background-color:var(--button-hover);color:#fff;border-style:none}.view{margin-top:500px}.view .utilBtn button{background-color:var(--background-color);color:#fff;border-radius:5px;border-style:solid;border-width:2px;border-color:var(--button-hover);margin-left:2px;margin-right:2px;padding:10px;transition:background-color .5s}.view .utilBtn button:hover{background-color:var(--button-hover)}.view .columns{background-color:var(--background-color);padding:10px;border-style:solid;border-color:var(--button-hover);border-radius:10px;margin-left:5px;margin-right:5px}.view .columns button{background-color:var(--background-color);color:#fff;border-style:none;border-radius:5px;margin:0}.view .deleteBtn{width:10%;margin:5px 50px 25px;background-color:var(--background-color);color:#fff;padding:10px;border-style:solid;border-color:var(--button-hover);border-radius:5px;transition:background-color .5s}.view .deleteBtn:hover{background-color:red;color:#fff}