@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Source+Sans+3&display=swap");
.sprite.audioOff {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -871px -1px;
}

.sprite.audioOn {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -908px -1px;
}

.sprite.CameraOff {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -945px -1px;
}

.sprite.CameraOn {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -1px -38px;
}

.sprite.customRangeBtn {
  display: inline-block;
  overflow: hidden;
  width: 33px;
  height: 29px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -379px -1px;
}

.sprite.customTrackBtn {
  display: inline-block;
  overflow: hidden;
  width: 218px;
  height: 44px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -38px -78px;
}

.sprite.deleteIcon {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -28px -1px;
}

.sprite.discordLogo {
  display: inline-block;
  overflow: hidden;
  width: 200px;
  height: 69px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -370px -143px;
}

.sprite.downBtn {
  display: inline-block;
  overflow: hidden;
  width: 44px;
  height: 27px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -252px -1px;
}

.sprite.fastForwardBtn {
  display: inline-block;
  overflow: hidden;
  width: 60px;
  height: 31px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -541px -1px;
}

.sprite.fire {
  display: inline-block;
  overflow: hidden;
  width: 24px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -478px -1px;
}

.sprite.leftBtn {
  display: inline-block;
  overflow: hidden;
  width: 60px;
  height: 31px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -603px -1px;
}

.sprite.loopOff {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -38px -38px;
}

.sprite.loopOn {
  display: inline-block;
  overflow: hidden;
  width: 36px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -75px -38px;
}

.sprite.magnifyingGlass {
  display: inline-block;
  overflow: hidden;
  width: 30px;
  height: 29px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -414px -1px;
}

.sprite.MediaSettingsBtn {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -113px -38px;
}

.sprite.MeetingEnd {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -150px -38px;
}

.sprite.MeetingStart {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -187px -38px;
}

.sprite.MicOff {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -224px -38px;
}

.sprite.MicOn {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -261px -38px;
}

.sprite.sessionBtn {
  display: inline-block;
  overflow: hidden;
  width: 52px;
  height: 46px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -258px -78px;
}

.sprite.ShareScreenOff {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -298px -38px;
}

.sprite.ShareScreenOn {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -335px -38px;
}

.sprite.muteIcon {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -56px -1px;
}

.sprite.next-disabled {
  display: inline-block;
  overflow: hidden;
  width: 138px;
  height: 38px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -372px -38px;
}

.sprite.next-enabled {
  display: inline-block;
  overflow: hidden;
  width: 138px;
  height: 38px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -512px -38px;
}

.sprite.octaveDown0 {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -84px -1px;
}

.sprite.octaveDown1 {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -112px -1px;
}

.sprite.octaveDown2 {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -140px -1px;
}

.sprite.octaveUp1 {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -168px -1px;
}

.sprite.Places-folder-music-icon {
  display: inline-block;
  overflow: hidden;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -446px -1px;
}

.sprite.playBtn {
  display: inline-block;
  overflow: hidden;
  width: 71px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -420px -78px;
}

.sprite.playBtnSmall {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -196px -1px;
}

.sprite.prev-disabled {
  display: inline-block;
  overflow: hidden;
  width: 138px;
  height: 38px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -652px -38px;
}

.sprite.prev-enabled {
  display: inline-block;
  overflow: hidden;
  width: 138px;
  height: 38px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -792px -38px;
}

.sprite.recordBtn {
  display: inline-block;
  overflow: hidden;
  width: 71px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -493px -78px;
}

.sprite.recordBtn5_once {
  display: inline-block;
  overflow: hidden;
  width: 72px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -640px -78px;
}

.sprite.recordBtn5_auto {
  display: inline-block;
  overflow: hidden;
  width: 72px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -566px -78px;
}

.sprite.recordBtn5_take1 {
  display: inline-block;
  overflow: hidden;
  width: 72px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -714px -78px;
}

.sprite.recordBtn5_takes {
  display: inline-block;
  overflow: hidden;
  width: 72px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -788px -78px;
}

.sprite.stopBtn5_once {
  display: inline-block;
  overflow: hidden;
  width: 72px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -75px -143px;
}

.sprite.stopBtn5_auto {
  display: inline-block;
  overflow: hidden;
  width: 72px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -1px -143px;
}

.sprite.stopBtn5_take1 {
  display: inline-block;
  overflow: hidden;
  width: 72px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -149px -143px;
}

.sprite.stopBtn5_takes {
  display: inline-block;
  overflow: hidden;
  width: 72px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -223px -143px;
}

.sprite.recOne {
  display: inline-block;
  overflow: hidden;
  width: 16px;
  height: 32px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -853px -1px;
}

.sprite.recAuto {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -504px -1px;
}

.sprite.recTake1 {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 38px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -932px -38px;
}

.sprite.recTakes {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 38px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -1px -78px;
}

.sprite.rewindBtn {
  display: inline-block;
  overflow: hidden;
  width: 60px;
  height: 31px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -665px -1px;
}

.sprite.rightBtn {
  display: inline-block;
  overflow: hidden;
  width: 60px;
  height: 31px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -727px -1px;
}

.sprite.settingsBtn {
  display: inline-block;
  overflow: hidden;
  width: 52px;
  height: 46px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -312px -78px;
}

.sprite.saveBtn {
  display: inline-block;
  overflow: hidden;
  width: 71px;
  height: 64px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -297px -143px;
}

.sprite.settingsIcon {
  display: inline-block;
  overflow: hidden;
  width: 25px;
  height: 25px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -1px -1px;
}

.sprite.signedIn {
  display: inline-block;
  overflow: hidden;
  width: 30px;
  height: 31px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -789px -1px;
}

.sprite.signedOut {
  display: inline-block;
  overflow: hidden;
  width: 30px;
  height: 31px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -821px -1px;
}

.sprite.soloIcon {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -224px -1px;
}

.sprite.songsBtn {
  display: inline-block;
  overflow: hidden;
  width: 52px;
  height: 46px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -366px -78px;
}

.sprite.stopBtn {
  display: inline-block;
  overflow: hidden;
  width: 71px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -862px -78px;
}

.sprite.trackBg {
  display: inline-block;
  overflow: hidden;
  width: 409px;
  height: 72px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -572px -143px;
}

.sprite.upBtn {
  display: inline-block;
  overflow: hidden;
  width: 44px;
  height: 27px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -298px -1px;
}

.sprite.uploadIcon {
  display: inline-block;
  overflow: hidden;
  width: 33px;
  height: 27px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -344px -1px;
}

/* ---------------------------GENERAL RESET----------------------- */
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-weight: normal;
}

img {
  border: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

/*variables*/
html,
body {
  height: 100%;
  width: 100%;
}

body {
  color: #303030;
  font-family: "Source Sans 3", sans-serif;
  line-height: 1.35;
}

h1,
.h1 {
  font-size: 2.5rem;
}

h2,
.h2 {
  font-size: 2.2rem;
}

h3,
.h3 {
  font-size: 1.8rem;
}

h4,
.h4 {
  font-size: 1.5rem;
}

h5,
.h5 {
  font-size: 1.2rem;
}

h6,
.h6 {
  font-size: 1.1rem;
}

p,
.p {
  font-size: 1rem;
}

small,
.small {
  font-size: 0.9rem;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  background-color: #666;
}

::-webkit-scrollbar:hover {
  background-color: #777;
  position: relative;
}

::-webkit-scrollbar-thumb {
  background-color: rgb(161, 207, 154);
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgb(205, 255, 197);
}

.screen-overlay, .screen-overlay--dim {
  z-index: 100;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.screen-overlay--dim {
  background-color: rgba(0, 0, 0, 0.1);
}
.screen-overlay.screenOverlayHide, .screenOverlayHide.screen-overlay--dim {
  display: none;
}

.dialog {
  color: #FFF;
  background: linear-gradient(to bottom, #333 0%, #222 100%);
  border: 1px solid #CCC;
  padding: 10px 20px 15px 20px;
  border-radius: 15px;
  width: 98%;
  max-width: 400px;
  display: flex;
  margin: auto;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  filter: drop-shadow(8px 8px 6px #000);
}
.dialog.withcontent {
  display: block;
  padding: 0;
  overflow: hidden;
}
.dialog.withcontent .dialog-content {
  width: 100%;
  height: 100%;
  padding: 10px 20px 15px 20px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.dialog.withcontent .dialog-content.vscroll {
  overflow-y: auto;
}
.dialog .dialog-header {
  font-size: 32px;
  font-weight: bold;
  color: #ddeeff;
  margin-bottom: 10px;
}
.dialog .tabs-dialog-header {
  font-size: 1.8rem;
  display: flex;
  width: 100%;
}
.dialog .tabs-dialog-header .dialog-header-tab {
  flex: 1 1 0;
  background-color: #ff9500;
  border: 4px solid #ff9500;
  cursor: pointer;
}
.dialog .tabs-dialog-header .dialog-header-tab:not(:first-child) {
  margin-left: 20px;
}
.dialog .tabs-dialog-header .dialog-header-tab:hover {
  background-color: #fcbb43;
  border: 4px solid #fcbb43;
}
.dialog .tabs-dialog-header .dialog-header-tab.selected {
  border: 4px solid #ff0;
}
.dialog .tabs-dialog-header .dialog-header-tab.disabled {
  cursor: inherit;
  background-color: #AAA;
  border: 4px solid #999;
  color: #EEE;
}
.dialog .dialog-divider {
  width: 100%;
  margin: 10px 15px;
}
.dialog .dialog-fields-section {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  width: 100%;
}
.dialog .dialog-fields-section .dialog-section-header {
  font-size: 28px;
  color: #cdf8ff;
  text-align: left;
  width: 100%;
  margin-bottom: 5px;
}
.dialog .dialog-fields-section .dialog-field-instructions {
  width: 100%;
  text-align: left;
  font-size: 1.1rem;
  margin-bottom: 5px;
}
.dialog .dialog-fields-section .dialog-textfield {
  width: 100%;
  margin-bottom: 20px;
}
.dialog .dialog-fields-section .dialog-textfield > input {
  height: 30px;
  width: 100%;
  font-size: 1.5rem;
  color: #303030;
}
.dialog .dialog-fields-section .dialog-textfield > input::-moz-placeholder {
  color: #AAA;
}
.dialog .dialog-fields-section .dialog-textfield > input::placeholder {
  color: #AAA;
}
.dialog .dialog-fields-section .dialog-checkbox {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 12px;
}
.dialog .dialog-fields-section .dialog-checkbox > label {
  display: block;
  padding-left: 23px;
}
.dialog .dialog-fields-section .dialog-checkbox > label > input {
  margin-left: -23px;
  margin-right: 7px;
  transform: scale(1.5) translateY(0px);
}
.dialog .dialog-fields-section .dialog-verticalRadioBtnGroup {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 8px;
}
.dialog .dialog-fields-section .dialog-verticalRadioBtnGroup > label {
  display: block;
  padding-left: 28px;
  margin-top: 5px;
}
.dialog .dialog-fields-section .dialog-verticalRadioBtnGroup > label:first-child {
  margin-top: 0;
}
.dialog .dialog-fields-section .dialog-verticalRadioBtnGroup > label > input {
  margin-left: -28px;
  margin-right: 5px;
  width: 18px;
  height: 18px;
  transform: translateY(3px);
}
.dialog .dialog-fields-section .dialog-horizontalRadioBtnGroup {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 8px;
}
.dialog .dialog-fields-section .dialog-horizontalRadioBtnGroup > label {
  padding-left: 28px;
  margin-top: 5px;
  margin-right: 20px;
}
.dialog .dialog-fields-section .dialog-horizontalRadioBtnGroup > label:first-child {
  margin-top: 0;
}
.dialog .dialog-fields-section .dialog-horizontalRadioBtnGroup > label > input {
  margin-left: -28px;
  margin-right: 5px;
  width: 18px;
  height: 18px;
  transform: translateY(3px);
}
.dialog .dialog-buttons-section {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  width: 200px;
}
.dialog .dialog-buttons-section2 {
  margin-top: 20px;
  width: 100%;
  text-align: center;
}
.dialog .dialog-buttons-section2 button:not(:first-child) {
  margin-left: 20px;
}
.dialog .dialog-button {
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 1.2rem;
  color: #FFF;
  cursor: pointer;
  background-color: #ff9500;
}
.dialog .dialog-button.full-width {
  width: 100%;
}
.dialog .dialog-button:disabled {
  background-color: #999;
  cursor: default;
  color: #EEE;
  opacity: 0.8;
  border: solid #888 1px;
}
.dialog .dialog-button:disabled:hover {
  background-color: #999;
}
.dialog .dialog-vertical-buttons-section {
  width: 100%;
  margin-top: 20px;
}
.dialog .dialog-vertical-buttons-section div > button {
  padding: 3px 0;
  border-radius: 5px;
}
.dialog .dialog-vertical-buttons-section > div:not(:first-child) {
  margin-top: 15px;
}

.messageBox {
  z-index: 100;
  background-color: #494949;
  width: 300px;
  padding: 20px;
  filter: drop-shadow(5px 5px 4px #000);
  border-radius: 5px;
  position: fixed;
  top: 50dvh;
  left: 50dvw;
  transform: translate(-50%, -50%);
  color: #FFF;
  font-size: 20px;
  text-align: center;
}

.bigBtnDiv button {
  border-radius: 5px;
  color: #FFFFFF;
  font-size: 1.5rem;
  font-weight: 100;
  padding: 5px 10px;
  background-color: #ff9500;
  box-shadow: 1px 1px 5px 0px #000000;
  text-shadow: 1px 1px 2px #555;
  border: solid #fcbb43 1px;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
}
.bigBtnDiv button:disabled {
  background-color: #999;
  cursor: default;
  color: #EEE;
  opacity: 0.8;
  border: solid #888 1px;
}
.bigBtnDiv button:disabled:hover {
  background-color: #999;
}
.bigBtnDiv button:focus {
  outline: none;
  border: solid rgb(241, 218, 7) 1px;
}
.bigBtnDiv button:hover {
  background-color: #fdcf7a;
}
.bigBtnDiv button:active {
  background-color: #f8b333;
}
.bigBtnDiv.green button {
  background-color: #0A0;
  border-color: #080;
}

.hRbtnGroup {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 8px;
}
.hRbtnGroup > label {
  padding-left: 28px;
  margin-top: 5px;
  margin-right: 20px;
}
.hRbtnGroup > label:first-child {
  margin-top: 0;
}
.hRbtnGroup > label > input {
  margin-left: -28px;
  margin-right: 5px;
  width: 18px;
  height: 18px;
  transform: translateY(3px);
}

.checkbox {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 12px;
}
.checkbox > label {
  display: block;
  padding-left: 23px;
}
.checkbox > label > input {
  margin-left: -23px;
  margin-right: 7px;
  transform: scale(1.5) translateY(0px);
}

.dialog2 {
  color: #FFF;
  background: linear-gradient(to bottom, #333 0%, #222 100%);
  border: 1px solid #CCC;
  padding: 0;
  border-radius: 15px;
  width: 600px;
  max-width: calc(100dvw - 20px);
  height: -moz-min-content;
  height: min-content;
  max-height: calc(100dvh - 20px);
  display: flex;
  margin: auto;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  overflow: hidden;
  filter: drop-shadow(8px 8px 6px #000);
}
.dialog2 .dg2-content {
  width: 100%;
  padding: 10px 20px 15px 20px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow-y: auto;
  text-align: left;
}
.dialog2 .dg2-content .dg2-header {
  font-size: 32px;
  font-weight: bold;
  color: #ddeeff;
  text-align: center;
}
.dialog2 .dg2-content .dg2-tabs-header {
  font-size: 1.8rem;
  display: flex;
  width: 100%;
  gap: 20px;
}
.dialog2 .dg2-content .dg2-tabs-header .dg2-tab {
  flex: 1 1 0;
  background-color: #ff9500;
  border: 4px solid #ff9500;
  text-align: center;
  cursor: pointer;
}
.dialog2 .dg2-content .dg2-tabs-header .dg2-tab:hover {
  background-color: #fcbb43;
  border: 4px solid #fcbb43;
}
.dialog2 .dg2-content .dg2-tabs-header .dg2-tab.selected {
  border: 4px solid #ff0;
}
.dialog2 .dg2-content .dg2-tabs-header .dg2-tab.disabled {
  cursor: inherit;
  background-color: #AAA;
  border: 4px solid #999;
  color: #EEE;
}
.dialog2 .dg2-content .dg2-divider {
  width: 100%;
  margin: 10px 0;
  border: 1px solid #888;
}
.dialog2 .dg2-content .dg2-fields-section {
  margin-top: 0px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-section-header {
  font-size: 1.5rem;
  color: #cdf8ff;
  text-align: left;
  width: 100%;
  margin-bottom: 5px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-field-instructions {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  margin-bottom: 5px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-textfield {
  width: 100%;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-textfield > input {
  height: 30px;
  width: 100%;
  font-size: 1.5rem;
  color: #303030;
  padding: 0 5px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-textfield > input::-moz-placeholder {
  color: #AAA;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-textfield > input::placeholder {
  color: #AAA;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-checkbox {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 5px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-checkbox > label {
  display: block;
  padding-left: 23px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-checkbox > label > input {
  vertical-align: middle;
  margin-left: -23px;
  margin-right: 7px;
  transform: scale(1.5);
}
.dialog2 .dg2-content .dg2-fields-section .dg2-verticalRadioBtnGroup {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 8px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-verticalRadioBtnGroup > label {
  display: block;
  padding-left: 28px;
  margin-top: 5px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-verticalRadioBtnGroup > label:first-child {
  margin-top: 0;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-verticalRadioBtnGroup > label > input {
  margin-left: -28px;
  margin-right: 5px;
  width: 18px;
  height: 18px;
  vertical-align: middle;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-horizontalRadioBtnGroup {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 8px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-horizontalRadioBtnGroup > label {
  padding-left: 28px;
  margin-top: 5px;
  margin-right: 20px;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-horizontalRadioBtnGroup > label:first-child {
  margin-top: 0;
}
.dialog2 .dg2-content .dg2-fields-section .dg2-horizontalRadioBtnGroup > label > input {
  margin-left: -28px;
  margin-right: 5px;
  width: 18px;
  height: 18px;
  vertical-align: middle;
}
.dialog2 .dg2-content .dg2-buttons-section {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  width: 200px;
  align-self: center;
}
.dialog2 .dg2-content .dg2-buttons-section2 {
  margin-top: 20px;
  width: 100%;
  text-align: center;
}
.dialog2 .dg2-content .dg2-buttons-section2 button:not(:first-child) {
  margin-left: 20px;
}
.dialog2 .dg2-content .dg2-button {
  padding: 5px 12px;
  border-radius: 5px;
  font-size: 1.2rem;
  color: #FFF;
  cursor: pointer;
  background-color: #ff9500;
}
.dialog2 .dg2-content .dg2-button.full-width {
  width: 100%;
}
.dialog2 .dg2-content .dg2-button:disabled {
  background-color: #999;
  cursor: default;
  color: #EEE;
  opacity: 0.8;
  border: solid #888 1px;
}
.dialog2 .dg2-content .dg2-button:disabled:hover {
  background-color: #999;
}
.dialog2 .dg2-content .dg2-vertical-buttons-section {
  width: 100%;
  margin-top: 20px;
  text-align: center;
}
.dialog2 .dg2-content .dg2-vertical-buttons-section > div:not(:first-child) {
  margin-top: 15px;
}

.dialog2dev {
  width: 700px;
  max-height: min(700px, 100dvh - 20px);
}
.dialog2dev .dg2-content .dg2-fields-section .dg2-field-instructions:not(:first-child) {
  margin-top: 20px;
}
.dialog2dev .dg2-content .dg2-fields-section .dg2dev-select {
  width: 100%;
}
.dialog2dev .dg2-content .dg2-fields-section .dg2dev-select select {
  width: 100%;
}

.big-range-slider input[type=range] {
  -webkit-appearance: none;
  width: 100%;
  margin: 7.3px 0;
}
.big-range-slider input[type=range]:focus {
  outline: none;
}
.big-range-slider input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 11.4px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: rgba(113, 113, 113, 0.78);
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
.big-range-slider input[type=range]::-webkit-slider-thumb {
  box-shadow: 0.9px 0.9px 1px #000031, 0px 0px 0.9px #00004b;
  height: 26px;
  width: 26px;
  border-radius: 15px;
  background: #ebebeb;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7.5px;
}
.big-range-slider input[type=range]:focus::-webkit-slider-runnable-track {
  background: rgba(126, 126, 126, 0.78);
}
.big-range-slider input[type=range]::-moz-range-track {
  width: 100%;
  height: 11.4px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: rgba(113, 113, 113, 0.78);
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
.big-range-slider input[type=range]::-moz-range-thumb {
  box-shadow: 0.9px 0.9px 1px #000031, 0px 0px 0.9px #00004b;
  height: 26px;
  width: 26px;
  border-radius: 15px;
  background: #ebebeb;
  cursor: pointer;
}
.big-range-slider input[type=range]::-ms-track {
  width: 100%;
  height: 16px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
.big-range-slider input[type=range]::-ms-fill-lower {
  background: rgba(100, 100, 100, 0.78);
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
.big-range-slider input[type=range]::-ms-fill-upper {
  background: rgba(113, 113, 113, 0.78);
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
.big-range-slider input[type=range]::-ms-thumb {
  box-shadow: 0.9px 0.9px 1px #000031, 0px 0px 0.9px #00004b;
  height: 20px;
  width: 20px;
  border-radius: 15px;
  background: #ebebeb;
  cursor: pointer;
  margin-top: 1px;
}
.big-range-slider input[type=range]:focus::-ms-fill-lower {
  background: rgba(113, 113, 113, 0.78);
}
.big-range-slider input[type=range]:focus::-ms-fill-upper {
  background: rgba(126, 126, 126, 0.78);
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0.4em;
  background: #efefef;
  border: none;
  border-radius: 3px;
  padding: 0.3em 2em 0.3em 0.3em;
  font-size: 1rem;
  cursor: pointer;
}

.select-div {
  position: relative;
  display: inline;
}

.select-div:after {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  pointer-events: none;
}

.select-div:after {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  top: 0.5em;
  right: 0.75em;
  border-top: 8px solid black;
  opacity: 0.5;
}

select::-ms-expand {
  display: none;
}

.ani-loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid blue;
  border-bottom: 16px solid blue;
  width: 120px;
  height: 120px;
  animation: ani-spin 2s linear infinite;
}
@keyframes ani-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.ani-loadingOverlay {
  z-index: 100;
  position: absolute;
  width: 100%;
  height: 100%;
  min-height: 200px;
  background: linear-gradient(to bottom, #333 0%, #222 100%);
  border-radius: 15px;
  border: 3px outset #ff9500;
  top: 0;
  left: 0;
}
.ani-loadingOverlay > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 200px;
}
.ani-loadingOverlay > div .ani-lo-pleaseWait {
  font-size: 1.8rem;
  color: #CCC;
  margin-bottom: 20px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div {
  position: absolute;
  width: 6px;
  height: 6px;
  background: #fd8d0d;
  border-radius: 50%;
  animation: lds-default 1.2s linear infinite;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(1) {
  animation-delay: 0s;
  top: 37px;
  left: 66px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(2) {
  animation-delay: -0.1s;
  top: 22px;
  left: 62px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(3) {
  animation-delay: -0.2s;
  top: 11px;
  left: 52px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(4) {
  animation-delay: -0.3s;
  top: 7px;
  left: 37px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(5) {
  animation-delay: -0.4s;
  top: 11px;
  left: 22px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(6) {
  animation-delay: -0.5s;
  top: 22px;
  left: 11px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(7) {
  animation-delay: -0.6s;
  top: 37px;
  left: 7px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(8) {
  animation-delay: -0.7s;
  top: 52px;
  left: 11px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(9) {
  animation-delay: -0.8s;
  top: 62px;
  left: 22px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(10) {
  animation-delay: -0.9s;
  top: 66px;
  left: 37px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(11) {
  animation-delay: -1s;
  top: 62px;
  left: 52px;
}
.ani-loadingOverlay > div > .ani-lo-lds-default > div:nth-child(12) {
  animation-delay: -1.1s;
  top: 52px;
  left: 62px;
}
@keyframes lds-default {
  0%, 20%, 80%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
}

@keyframes scroll-background {
  0% {
    background-position-x: 0%;
  }
  50% {
    background-position-x: 100%;
  }
  100% {
    background-position-x: 0%;
  }
}
.playBtn_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 71px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -420px -78px;
}
.playBtn_h5 {
  display: inline-block;
  position: relative;
  width: 25px;
  margin-left: 4px;
  margin-right: 4px;
}
.playBtn_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.37, 0.37);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .playBtn_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .playBtn_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.3, 0.3);
    top: -15px;
  }
}

.recordBtn_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 71px;
  height: 63px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -493px -78px;
}
.recordBtn_h5 {
  display: inline-block;
  position: relative;
  width: 25px;
  margin-left: 4px;
  margin-right: 4px;
}
.recordBtn_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.37, 0.37);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .recordBtn_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .recordBtn_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.3, 0.3);
    top: -15px;
  }
}

.deleteIcon_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -28px -1px;
}
.deleteIcon_h5 {
  display: inline-block;
  position: relative;
  width: 19px;
  margin-left: 4px;
  margin-right: 4px;
}
.deleteIcon_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.85, 0.85);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .deleteIcon_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 1px;
  }
  .deleteIcon_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.75, 0.75);
    top: -15px;
  }
}

.soloIcon_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -224px -1px;
}
.soloIcon_h5 {
  display: inline-block;
  position: relative;
  width: 20px;
  margin-left: 4px;
  margin-right: 4px;
}
.soloIcon_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .soloIcon_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .soloIcon_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.8, 0.8);
    top: -16px;
  }
}

.muteIcon_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -56px -1px;
}
.muteIcon_h5 {
  display: inline-block;
  position: relative;
  width: 20px;
  margin-left: 4px;
  margin-right: 4px;
}
.muteIcon_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .muteIcon_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .muteIcon_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.8, 0.8);
    top: -16px;
  }
}

.octaveDown0_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -84px -1px;
}
.octaveDown0_h5 {
  display: inline-block;
  position: relative;
  width: 20px;
  margin-left: 4px;
  margin-right: 4px;
}
.octaveDown0_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .octaveDown0_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .octaveDown0_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.8, 0.8);
    top: -16px;
  }
}

.octaveDown1_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -112px -1px;
}
.octaveDown1_h5 {
  display: inline-block;
  position: relative;
  width: 20px;
  margin-left: 4px;
  margin-right: 4px;
}
.octaveDown1_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .octaveDown1_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .octaveDown1_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.8, 0.8);
    top: -16px;
  }
}

.octaveDown2_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -140px -1px;
}
.octaveDown2_h5 {
  display: inline-block;
  position: relative;
  width: 20px;
  margin-left: 4px;
  margin-right: 4px;
}
.octaveDown2_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .octaveDown2_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .octaveDown2_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.8, 0.8);
    top: -16px;
  }
}

.octaveUp1_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -168px -1px;
}
.octaveUp1_h5 {
  display: inline-block;
  position: relative;
  width: 20px;
  margin-left: 4px;
  margin-right: 4px;
}
.octaveUp1_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .octaveUp1_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .octaveUp1_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.8, 0.8);
    top: -16px;
  }
}

.playBtnSmall_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 26px;
  height: 26px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -196px -1px;
}
.playBtnSmall_h5 {
  display: inline-block;
  position: relative;
  width: 16px;
  margin-left: 4px;
  margin-right: 4px;
}
.playBtnSmall_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .playBtnSmall_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .playBtnSmall_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.8, 0.8);
    top: -16px;
  }
}

.uploadIcon_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 33px;
  height: 27px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -344px -1px;
}
.uploadIcon_h5 {
  display: inline-block;
  position: relative;
  width: 23px;
  margin-left: 4px;
  margin-right: 4px;
}
.uploadIcon_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -18px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .uploadIcon_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 23px;
    margin-left: -2px;
    margin-right: 3px;
  }
  .uploadIcon_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.78, 0.78);
    top: -17px;
  }
}

.mediaSettingsBtn_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -113px -38px;
}
.mediaSettingsBtn_h5 {
  display: inline-block;
  position: relative;
  width: 20px;
  margin-left: 4px;
  margin-right: 4px;
}
.mediaSettingsBtn_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.68, 0.68);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .mediaSettingsBtn_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .mediaSettingsBtn_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.58, 0.58);
    top: -16px;
  }
}

.settingsIcon_h5 > div {
  display: inline-block;
  overflow: hidden;
  width: 25px;
  height: 25px;
  background-repeat: no-repeat;
  background-image: url("../images/atlases/looperAppAtlas.png");
  background-position: -1px -1px;
}
.settingsIcon_h5 {
  display: inline-block;
  position: relative;
  width: 20px;
  margin-left: 4px;
  margin-right: 4px;
}
.settingsIcon_h5 > div {
  position: absolute;
  transform-origin: top left;
  transform: scale(0.9, 0.9);
  top: -17px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .settingsIcon_h5.auto1 {
    display: inline-block;
    position: relative;
    width: 17px;
    margin-left: 3px;
    margin-right: 3px;
  }
  .settingsIcon_h5.auto1 > div {
    position: absolute;
    transform-origin: top left;
    transform: scale(0.78, 0.78);
    top: -16px;
  }
}

#indexScreen {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: #000;
  background-image: url("../images/star_twinkles2.webp");
  color: #FFF;
  font-family: "Source Sans 3", sans-serif;
}
#indexScreen.startScreenLayout #stscr-header-content #stscr-info {
  grid-template-areas: "findCommunity" "intro" "introVids" "features" "pricing" "schools" "socialSection";
}
#indexScreen.startScreenLayout #stscr-header-content #stscr-info #stscr-findACommunity {
  margin-top: 0px;
}
#indexScreen.startScreenLayout #stscr-header-content #stscr-info #stscr-findACommunity #stscr-fac-header {
  display: none;
}
#indexScreen.startScreenLayout #stscr-header-content #stscr-info #stscr-introSection {
  margin-top: 80px;
}
#indexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
  display: block;
}
#indexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinGuestBtnDiv {
  display: block;
}
@media only screen and (max-width: 1200px) {
  #indexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv {
    padding: 5px 5px;
    font-size: 45px;
    width: 200px;
  }
}
@media only screen and (max-width: 600px) {
  #indexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: translateY(13px);
  }
  #indexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
    font-size: 1.8rem;
    margin: 10px 0;
  }
  #indexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv {
    padding: 5px 5px;
    font-size: 35px;
    width: 170px;
  }
}
#indexScreen #stscr-header-content {
  background-color: rgba(160, 210, 235, 0.15);
  padding-bottom: 100px;
}
#indexScreen #stscr-header-content #stscr-header {
  background: url("../images/star_twinkles2.webp");
  color: #FFF;
  padding: 20px 20px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-header {
    padding: 20px 20px;
  }
}
#indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent {
  max-width: 1100px;
  margin: 0 auto 0 auto;
}
#indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
  text-align: center;
  font-size: 90px;
  font-weight: bold;
  font-family: "Montserrat", sans-serif;
}
@media only screen and (max-width: 1500px) {
  #indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 70px;
  }
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 50px;
  }
}
#indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
  text-align: center;
  font-size: 2.5rem;
  margin-top: 15px;
  font-family: "Montserrat", sans-serif;
  color: #a8f5a8;
  font-weight: bold;
}
@media only screen and (max-width: 1500px) {
  #indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
    font-size: 1.8rem;
  }
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
    font-size: 1.5rem;
  }
}
#indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image {
  display: none;
  margin-top: 5px;
}
#indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image img {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  -webkit-mask-image: radial-gradient(circle, black 78%, rgba(0, 0, 0, 0) 80%);
          mask-image: radial-gradient(circle, black 78%, rgba(0, 0, 0, 0) 80%);
}
#indexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image {
  border-radius: 20px;
  overflow: hidden;
}
#indexScreen #stscr-header-content #stscr-signinDiv {
  margin-top: 0px;
  min-height: 200px;
  background-color: rgba(255, 255, 255, 0.15);
}
#indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
  display: flex;
  justify-content: space-between;
  width: 650px;
  margin: 0 auto;
  transform: translateY(55px);
}
#indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
  display: none;
  font-size: 2.2rem;
  font-weight: bold;
  text-align: center;
  margin: 20px auto;
  text-shadow: 1px 1px 1px #333;
}
#indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv {
  cursor: pointer;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  font-size: 54px;
  font-weight: bold;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  width: 250px;
  margin: 0 auto;
  background-color: orange;
  text-shadow: 1px 1px 1px #333;
  padding: 5px 0px;
  border-radius: 8px;
  box-shadow: 2px 2px 5px #000;
}
#indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv:hover {
  background-color: rgb(255, 182, 65);
}
#indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinGuestBtnDiv {
  display: none;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 500px;
    transform: translateY(65px);
  }
  #indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
    font-size: 2.2rem;
    margin: 10px auto;
  }
}
@media only screen and (max-width: 600px) {
  #indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 100%;
  }
}
#indexScreen #stscr-header-content #stscr-signinDiv #stscr-signinBusyDiv {
  display: none;
  position: relative;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}
#indexScreen #stscr-header-content #stscr-signinDiv.hideSigninBtns #stscr-signinOptions {
  display: none;
}
#indexScreen #stscr-header-content #stscr-mobileWarning, #indexScreen #stscr-header-content #stscr-safariWarning, #indexScreen #stscr-header-content #stscr-videoWarning,
#indexScreen #stscr-header-content #stscr-audioWarning, #indexScreen #stscr-header-content #stscr-preferWarning {
  max-width: min(750px, 100% - 40px);
  margin: 20px auto 20px auto;
  padding: 10px;
  font-size: 1.5rem;
  color: #303030;
  font-weight: bold;
  display: none;
  background-color: #e5eaf5;
}
#indexScreen #stscr-header-content #stscr-preferWarning {
  background-color: #000;
  color: #FFF;
}
#indexScreen #stscr-header-content #stscr-info {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 0px;
  display: grid;
  grid-template-areas: "intro" "introVids" "features" "pricing" "findCommunity" "schools" "socialSection";
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity {
  grid-area: findCommunity;
  margin-top: 100px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-findACommunity {
    margin-top: 70px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity {
  width: 100%;
  overflow: hidden;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity #stscr-fac-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-findACommunity #stscr-fac-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .stscr-communitiesExplanationHeader {
  margin-top: 30px;
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
  font-size: 2.2rem;
  font-weight: bold;
  text-shadow: 1px 1px 1px #333;
  padding: 0 20px;
  margin-bottom: -15px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .stscr-communitiesExplanationHeader {
    font-size: 1.8rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .stscr-communitiesExplanation {
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
  padding: 0 20px;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .stscr-communitiesExplanation {
    font-size: 1.2rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide {
  margin-top: 20px;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.05);
  -webkit-mask-image: radial-gradient(circle, black 95%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 95%, rgba(0, 0, 0, 0) 100%);
  border-radius: 10px;
  padding: 0px 20px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .splide__arrow {
  background-color: #fcbb43;
  width: 40px;
  height: 40px;
  opacity: 2;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI {
  width: 430px;
  background: url("../images/community_bg2.png");
  background-size: cover;
  background-repeat: no-repeat;
  aspect-ratio: 1.288;
  aspect-ratio: 1.57;
  padding: 10px 15px 8px 15px;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media only screen and (max-width: 600px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI {
    width: 240px;
    padding: 7px 10px 8px 10px;
    background-size: contain;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI.showJoin .stscr-cli-bottom .stscr-cli-join {
  display: block;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-top .stscr-cli-title {
  font-size: 1.5rem;
  text-align: center;
  width: 100%;
  padding: 0 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #80C680;
  text-shadow: 0px 1px 0px #777;
  font-weight: bold;
}
@media only screen and (max-width: 600px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-top .stscr-cli-title {
    font-size: 1.1rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-top .stscr-cli-details div {
  margin-top: 5px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-top .stscr-cli-details div:not(:first-child) {
  margin-top: 5px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-top .stscr-cli-details div {
  padding-left: 10px;
  font-size: 1.1rem;
  color: #303030;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-top .stscr-cli-details div span {
  color: #000;
  font-weight: bold;
}
@media only screen and (max-width: 600px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-top .stscr-cli-details div {
    padding-left: 5px;
    font-size: 0.9rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-bottom {
  display: flex;
  justify-content: center;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-bottom .stscr-cli-join {
  display: none;
  margin-bottom: 0px;
  padding: 10px 20px;
  background-color: rgba(0, 0, 0, 0.8);
  color: #fcbb43;
  font-weight: bold;
  font-size: 1.8rem;
  font-family: "Montserrat", sans-serif;
  text-align: center;
  text-shadow: 1px 1px 0 #FFF;
  width: 100%;
  border-radius: 5px 5px 30px 30px;
  cursor: pointer;
  transition: 0.2s;
}
#indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-bottom .stscr-cli-join:hover {
  transform: scale(1.025);
}
@media only screen and (max-width: 600px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-findACommunity .splide .stscr-communityLI .stscr-cli-bottom .stscr-cli-join {
    position: relative;
    font-size: 1.2rem;
    padding: 2px 20px;
    border-radius: 5px 5px 20px 20px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-pricingSection {
  grid-area: pricing;
  margin-top: 100px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-pricingSection {
    margin-top: 70px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-pricingSection {
  width: 100%;
}
#indexScreen #stscr-header-content #stscr-info #stscr-pricingSection #stscr-ps-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-pricingSection #stscr-ps-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-pricingSection .stscr-pricingHeader {
  margin-top: 30px;
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
  font-size: 2.2rem;
  font-weight: bold;
  text-shadow: 1px 1px 1px #333;
  padding: 0 20px;
  margin-bottom: -15px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-pricingSection .stscr-pricingHeader {
    font-size: 1.8rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-pricingSection .stscr-pricingBulletsList {
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
  padding-left: 50px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-pricingSection .stscr-pricingBulletsList .stscr-pricingBullet:not(:first-child) {
  margin-top: 10px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-pricingSection .stscr-pricingBulletsList .stscr-pricingBullet {
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-pricingSection .stscr-pricingBulletsList .stscr-pricingBullet {
    font-size: 1.2rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introSection {
  grid-area: intro;
  margin: 20px auto 0 auto;
  width: 100%;
}
#indexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro {
  padding: 0 20px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introHeader {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introHeader {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody {
  margin-top: 20px;
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
}
#indexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph {
  font-size: 1.8rem;
}
#indexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph:not(:first-child) {
  margin-top: 30px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph {
    font-size: 1.5rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids {
  grid-area: introVids;
  width: 100%;
  max-width: 1400px;
  margin: 20px auto 0 auto;
  padding: 10px 20px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer {
  margin-top: 20px;
  display: flex;
  align-items: center;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer {
    display: block;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left {
  width: 50%;
  aspect-ratio: 1.667;
  padding-right: 20px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left {
    width: 100%;
    padding-right: 0;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left img {
  width: 100%;
  height: 100%;
  border: 1px solid #468;
  box-shadow: 3px 3px 3px #000;
  border-radius: 15px;
  -webkit-mask-image: radial-gradient(ellipse, black 50%, rgba(0, 0, 0, 0.1) 100%);
          mask-image: radial-gradient(ellipse, black 50%, rgba(0, 0, 0, 0.1) 100%);
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left iframe {
  display: none;
  width: 100%;
  height: 100%;
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right {
  width: 50%;
  aspect-ratio: 1.667;
  padding-left: 20px;
  overflow-y: scroll;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right {
    aspect-ratio: initial;
    width: 100%;
    padding-left: 0;
    overflow-y: visible;
  }
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList {
    height: 200px;
    overflow-x: scroll;
    background: rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 10px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI {
  cursor: pointer;
  transition: 0.5s;
  margin-top: 10px;
  margin-right: 20px;
  border-bottom: 1px solid #87b4cb;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI {
    width: 100%;
    max-width: 470px;
    flex: 0 0 auto;
    align-self: flex-start;
    padding-right: 30px;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI .videoLI-title {
  text-align: right;
  font-family: "Source Sans 3", sans-serif;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI .videoLI-title {
    text-align: left;
    font-size: 1.2rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI.currentVid {
  color: #a8f5a8;
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI:hover {
  transform: translateX(-20px);
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI:hover {
    transform: none;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-sendVids {
  border-top: 1px solid #87b4cb;
  padding-top: 10px;
  margin-top: 20px;
  text-align: center;
  font-size: 1.2rem;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-sendVids {
    text-align: center;
    font-size: 1rem;
  }
}
#indexScreen #stscr-header-content #stscr-info #stscr-featuresSection {
  grid-area: features;
}
#indexScreen #stscr-header-content #stscr-info #stscr-schoolsSection {
  grid-area: schools;
}
#indexScreen #stscr-header-content #stscr-info #stscr-socialSection {
  grid-area: socialSection;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection:not(:first-child) {
  margin-top: 100px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection:not(:first-child) {
    margin-top: 70px;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content {
  padding: 0 20px 0 20px;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .showInSmall {
  display: none;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair.shift-right {
  justify-content: flex-end;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair.shift-left {
  justify-content: flex-start;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
  margin-top: 60px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
    margin-top: 40px;
  }
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .hideInSmall {
    display: none;
  }
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .showInSmall {
    display: block;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair:not(:first-child) {
  margin-top: 80px;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
  width: 100%;
  max-width: 1400px;
  display: flex;
  align-items: flex-start;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
    width: 100%;
    display: block;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
  width: 48%;
  max-width: 700px;
  padding: 0 20px 0 0;
}
@media only screen and (max-width: 1500px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 0;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
  width: 48%;
  max-width: 700px;
  padding: 0 0 0 20px;
}
@media only screen and (max-width: 1500px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
    width: 100%;
    max-width: 600px;
    margin: 20px auto;
    padding: 0;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpHeader {
  font-size: 2.2rem;
  font-weight: bold;
  text-shadow: 1px 1px 1px #333;
  text-align: left;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpHeader {
    font-size: 1.8rem;
    padding: 0 10px;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits {
    margin: 5px 0 20px 0;
    padding: 0 10px 0 32px;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul {
  list-style-type: square;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul li {
  color: #DDD;
  margin-top: 7px;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul li {
    font-size: 1.2rem;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription {
    margin: 5px 0 20px 0;
    padding: 0 10px;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p {
  color: #DDD;
  margin-top: 7px;
  font-size: 1.5rem;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p:not(:first-child) {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p {
    font-size: 1.2rem;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem {
  container-type: inline-size;
  border-radius: 15px;
  overflow: hidden;
  cursor: pointer;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem iframe {
  aspect-ratio: 1.667;
  width: 100%;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem img {
  border: 1px solid #87b4cb;
  box-shadow: 3px 3px 3px #000;
  border-radius: 15px;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem {
    margin: 0 auto;
  }
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-image img {
  border: 1px solid #87b4cb;
  box-shadow: 3px 3px 3px #000;
  width: 100%;
  height: 100%;
  border-radius: 15px;
}
#indexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-image {
  border-radius: 15px;
  overflow: hidden;
}
#indexScreen #stscr-header-content #stscr-info #stscr-videos {
  padding: 0 20px;
  margin-top: 50px;
  width: 100%;
  display: flex;
  justify-content: center;
  max-height: 400px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem {
  flex: 1 1 0;
  position: relative;
  container-type: inline-size;
  border-radius: 25px;
  overflow: hidden;
}
#indexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem:not(:first-child) {
  margin-left: 30px;
}
#indexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem iframe {
  aspect-ratio: 1.667;
  width: 100%;
}
#indexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem img {
  width: 100%;
  height: 100%;
}
#indexScreen #stscr-header-content #stscr-appContainer {
  padding: 20px 20px;
}
#indexScreen #stscr-footer {
  background: url("../images/star_twinkles2.webp");
  color: #FFF;
  padding: 20px 20px 20px 20px;
}
#indexScreen #stscr-footer #stscr-footer-centerContent {
  max-width: 1200px;
  margin: 0 auto 0 auto;
}
#indexScreen #stscr-footer #stscr-footer-centerContent #stscr-title {
  text-align: center;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-footer #stscr-footer-centerContent #stscr-title {
    font-size: 1.2rem;
  }
}
#indexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle {
  text-align: left;
  font-size: 1.2rem;
  margin-top: 10px;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle {
    font-size: 1rem;
  }
}
#indexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle.stscr-signature {
  text-align: right;
  margin-top: 0px;
}
#indexScreen #stscr-footer #stscr-footer-centerContent #stscr-support {
  font-size: 1.2rem;
  text-align: center;
}
@media only screen and (max-width: 1200px) {
  #indexScreen #stscr-footer #stscr-footer-centerContent #stscr-support {
    font-size: 1rem;
    text-align: left;
  }
}
#indexScreen #stscr-footer #stscr-footer-centerContent #stscr-support a {
  text-decoration: underline;
}

#bandIndexScreen {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: #000;
  background-image: url("../images/star_twinkles2.webp");
  color: #FFF;
  font-family: "Source Sans 3", sans-serif;
}
#bandIndexScreen.startScreenLayout #stscr-header-content #stscr-info {
  grid-template-areas: "intro" "introVids" "features" "schools";
}
#bandIndexScreen.startScreenLayout #stscr-header-content #stscr-info #stscr-introSection {
  margin-top: 80px;
}
#bandIndexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
  display: block;
}
#bandIndexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinGuestBtnDiv {
  display: block;
}
#bandIndexScreen #stscr-header-content {
  background-color: rgba(160, 210, 235, 0.15);
  padding-bottom: 100px;
}
#bandIndexScreen #stscr-header-content #stscr-header {
  background: url("../images/star_twinkles2.webp");
  color: #FFF;
  padding: 20px 20px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-header {
    padding: 20px 20px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent {
  max-width: 1100px;
  margin: 0 auto 0 auto;
}
#bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
  text-align: center;
  font-size: 90px;
  font-weight: bold;
  font-family: "Montserrat", sans-serif;
}
@media only screen and (max-width: 1500px) {
  #bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 70px;
  }
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 50px;
  }
}
@media only screen and (max-width: 350px) {
  #bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 40px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
  text-align: center;
  font-size: 2.5rem;
  margin-top: 15px;
  font-family: "Montserrat", sans-serif;
  color: #a8f5a8;
  font-weight: bold;
}
@media only screen and (max-width: 1500px) {
  #bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
    font-size: 1.8rem;
  }
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
    font-size: 1.5rem;
  }
}
#bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image {
  display: none;
  margin-top: 5px;
}
#bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image img {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  -webkit-mask-image: radial-gradient(circle, black 78%, rgba(0, 0, 0, 0) 80%);
          mask-image: radial-gradient(circle, black 78%, rgba(0, 0, 0, 0) 80%);
}
#bandIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image {
  border-radius: 20px;
  overflow: hidden;
}
#bandIndexScreen #stscr-header-content #stscr-signinDiv {
  margin-top: 0px;
  min-height: 200px;
  background-color: rgba(255, 255, 255, 0.15);
}
#bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
  display: flex;
  justify-content: space-between;
  width: 650px;
  margin: 0 auto;
  transform: translateY(55px);
}
#bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
  display: none;
  font-size: 2.2rem;
  font-weight: bold;
  text-align: center;
  margin: 20px auto;
  text-shadow: 1px 1px 1px #333;
}
#bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv {
  cursor: pointer;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  font-size: 54px;
  font-weight: bold;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  width: 250px;
  margin: 0 auto;
  background-color: orange;
  text-shadow: 1px 1px 1px #333;
  padding: 5px 0px;
  border-radius: 8px;
  box-shadow: 2px 2px 5px #000;
}
#bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv:hover {
  background-color: rgb(255, 182, 65);
}
#bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinGuestBtnDiv {
  display: none;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 500px;
    transform: translateY(65px);
  }
  #bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
    font-size: 2.2rem;
    margin: 10px auto;
  }
}
@media only screen and (max-width: 600px) {
  #bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 100%;
  }
}
#bandIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinBusyDiv {
  display: none;
  position: relative;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}
#bandIndexScreen #stscr-header-content #stscr-signinDiv.hideSigninBtns #stscr-signinOptions {
  display: none;
}
#bandIndexScreen #stscr-header-content #stscr-mobileWarning, #bandIndexScreen #stscr-header-content #stscr-safariWarning, #bandIndexScreen #stscr-header-content #stscr-videoWarning,
#bandIndexScreen #stscr-header-content #stscr-audioWarning, #bandIndexScreen #stscr-header-content #stscr-preferWarning {
  max-width: min(750px, 100% - 40px);
  margin: 20px auto 20px auto;
  padding: 10px;
  font-size: 1.5rem;
  color: #303030;
  font-weight: bold;
  display: none;
  background-color: #e5eaf5;
}
#bandIndexScreen #stscr-header-content #stscr-preferWarning {
  background-color: #000;
  color: #FFF;
}
#bandIndexScreen #stscr-header-content #stscr-info {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 0px;
  display: grid;
  grid-template-areas: "intro" "introVids" "features" "schools";
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introSection {
  grid-area: intro;
  margin: 20px auto 0 auto;
  width: 100%;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro {
  padding: 0 20px;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introHeader {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introHeader {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody {
  margin-top: 20px;
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph {
  font-size: 1.8rem;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph:not(:first-child) {
  margin-top: 30px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph {
    font-size: 1.5rem;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids {
  grid-area: introVids;
  width: 100%;
  max-width: 1400px;
  margin: 0px auto 0 auto;
  padding: 10px 20px;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer {
  margin-top: 20px;
  display: flex;
  align-items: center;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer {
    display: block;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left {
  width: 50%;
  aspect-ratio: 1.667;
  padding-right: 20px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left {
    width: 100%;
    padding-right: 0;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left img {
  width: 100%;
  height: 100%;
  border: 1px solid #468;
  box-shadow: 3px 3px 3px #000;
  border-radius: 15px;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left iframe {
  display: none;
  width: 100%;
  height: 100%;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right {
  width: 50%;
  aspect-ratio: 1.667;
  padding-left: 20px;
  overflow-y: scroll;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right {
    aspect-ratio: initial;
    width: 100%;
    padding-left: 0;
    overflow-y: visible;
  }
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList {
    height: 200px;
    overflow-x: scroll;
    background: rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 10px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI {
  cursor: pointer;
  transition: 0.5s;
  margin-top: 10px;
  margin-right: 20px;
  border-bottom: 1px solid #87b4cb;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI {
    width: 100%;
    max-width: 470px;
    flex: 0 0 auto;
    align-self: flex-start;
    padding-right: 30px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI .videoLI-title {
  text-align: right;
  font-family: "Source Sans 3", sans-serif;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI .videoLI-title {
    text-align: left;
    font-size: 1.2rem;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI.currentVid {
  color: #a8f5a8;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI:hover {
  transform: translateX(-20px);
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI:hover {
    transform: none;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-sendVids {
  border-top: 1px solid #87b4cb;
  padding-top: 10px;
  margin-top: 20px;
  text-align: center;
  font-size: 1.2rem;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-sendVids {
    text-align: center;
    font-size: 1rem;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-featuresSection {
  grid-area: features;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-schoolsSection {
  grid-area: schools;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection:not(:first-child) {
  margin-top: 100px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection:not(:first-child) {
    margin-top: 70px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content {
  padding: 0 20px 0 20px;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .showInSmall {
  display: none;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair.shift-right {
  justify-content: flex-end;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair.shift-left {
  justify-content: flex-start;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
  margin-top: 60px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
    margin-top: 40px;
  }
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .hideInSmall {
    display: none;
  }
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .showInSmall {
    display: block;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair:not(:first-child) {
  margin-top: 80px;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
  width: 100%;
  max-width: 1400px;
  display: flex;
  align-items: flex-start;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
    width: 100%;
    display: block;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
  width: 48%;
  max-width: 700px;
  padding: 0 20px 0 0;
}
@media only screen and (max-width: 1500px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 0;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
  width: 48%;
  max-width: 700px;
  padding: 0 0 0 20px;
}
@media only screen and (max-width: 1500px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
    width: 100%;
    max-width: 600px;
    margin: 20px auto;
    padding: 0;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpHeader {
  font-size: 2.2rem;
  font-weight: bold;
  text-shadow: 1px 1px 1px #333;
  text-align: left;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpHeader {
    font-size: 1.8rem;
    padding: 0 10px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits {
    margin: 5px 0 20px 0;
    padding: 0 10px 0 32px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul {
  list-style-type: square;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul li {
  color: #DDD;
  margin-top: 7px;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul li {
    font-size: 1.2rem;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription {
    margin: 5px 0 20px 0;
    padding: 0 10px;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p {
  color: #DDD;
  margin-top: 7px;
  font-size: 1.5rem;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p:not(:first-child) {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p {
    font-size: 1.2rem;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem {
  container-type: inline-size;
  border-radius: 15px;
  overflow: hidden;
  cursor: pointer;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem iframe {
  aspect-ratio: 1.667;
  width: 100%;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem img {
  border: 1px solid #87b4cb;
  box-shadow: 3px 3px 3px #000;
  border-radius: 15px;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem {
    margin: 0 auto;
  }
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-image img {
  border: 1px solid #87b4cb;
  box-shadow: 3px 3px 3px #000;
  width: 100%;
  height: 100%;
  border-radius: 15px;
}
#bandIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-image {
  border-radius: 15px;
  overflow: hidden;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-videos {
  padding: 0 20px;
  margin-top: 50px;
  width: 100%;
  display: flex;
  justify-content: center;
  max-height: 400px;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem {
  flex: 1 1 0;
  position: relative;
  container-type: inline-size;
  border-radius: 25px;
  overflow: hidden;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem:not(:first-child) {
  margin-left: 30px;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem iframe {
  aspect-ratio: 1.667;
  width: 100%;
}
#bandIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem img {
  width: 100%;
  height: 100%;
}
#bandIndexScreen #stscr-header-content #stscr-appContainer {
  padding: 20px 20px;
}
#bandIndexScreen #stscr-footer {
  background: url("../images/star_twinkles2.webp");
  color: #FFF;
  padding: 20px 20px 20px 20px;
}
#bandIndexScreen #stscr-footer #stscr-footer-centerContent {
  max-width: 1200px;
  margin: 0 auto 0 auto;
}
#bandIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-title {
  text-align: center;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-title {
    font-size: 1.2rem;
  }
}
#bandIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle {
  text-align: left;
  font-size: 1.2rem;
  margin-top: 10px;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle {
    font-size: 1rem;
  }
}
#bandIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle.stscr-signature {
  text-align: right;
  margin-top: 0px;
}
#bandIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support {
  font-size: 1.2rem;
  text-align: center;
}
@media only screen and (max-width: 1200px) {
  #bandIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support {
    font-size: 1rem;
  }
}
#bandIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support a {
  text-decoration: underline;
}

#easyLoopsIndexScreen {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: #000;
  background-image: url("../images/star_twinkles2.webp");
  color: #FFF;
  font-family: "Source Sans 3", sans-serif;
}
#easyLoopsIndexScreen.startScreenLayout #stscr-header-content #stscr-info {
  grid-template-areas: "intro" "introVids" "features" "schools";
}
#easyLoopsIndexScreen.startScreenLayout #stscr-header-content #stscr-info #stscr-introSection {
  margin-top: 80px;
}
#easyLoopsIndexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
  display: block;
}
#easyLoopsIndexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinGuestBtnDiv {
  display: block;
}
#easyLoopsIndexScreen #stscr-header-content {
  background-color: rgba(160, 210, 235, 0.15);
  padding-bottom: 100px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-header {
  background: url("../images/star_twinkles2.webp");
  color: #FFF;
  padding: 20px 20px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-header {
    padding: 20px 20px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent {
  max-width: 1100px;
  margin: 0 auto 0 auto;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
  text-align: center;
  font-size: 90px;
  font-weight: bold;
  font-family: "Montserrat", sans-serif;
}
@media only screen and (max-width: 1500px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 70px;
  }
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 50px;
  }
}
@media only screen and (max-width: 350px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 40px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
  text-align: center;
  font-size: 2.5rem;
  margin-top: 15px;
  font-family: "Montserrat", sans-serif;
  color: #a8f5a8;
  font-weight: bold;
}
@media only screen and (max-width: 1500px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
    font-size: 1.8rem;
  }
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
    font-size: 1.5rem;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image {
  display: none;
  margin-top: 5px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image img {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  -webkit-mask-image: radial-gradient(circle, black 78%, rgba(0, 0, 0, 0) 80%);
          mask-image: radial-gradient(circle, black 78%, rgba(0, 0, 0, 0) 80%);
}
#easyLoopsIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image {
  border-radius: 20px;
  overflow: hidden;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv {
  margin-top: 0px;
  min-height: 200px;
  background-color: rgba(255, 255, 255, 0.15);
}
#easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
  display: flex;
  justify-content: space-between;
  width: 650px;
  margin: 0 auto;
  transform: translateY(55px);
}
#easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
  display: none;
  font-size: 2.2rem;
  font-weight: bold;
  text-align: center;
  margin: 20px auto;
  text-shadow: 1px 1px 1px #333;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv {
  cursor: pointer;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  font-size: 54px;
  font-weight: bold;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  width: 250px;
  margin: 0 auto;
  background-color: orange;
  text-shadow: 1px 1px 1px #333;
  padding: 5px 0px;
  border-radius: 8px;
  box-shadow: 2px 2px 5px #000;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv:hover {
  background-color: rgb(255, 182, 65);
}
#easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinGuestBtnDiv {
  display: none;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 500px;
    transform: translateY(65px);
  }
  #easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
    font-size: 2.2rem;
    margin: 10px auto;
  }
}
@media only screen and (max-width: 600px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 100%;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinBusyDiv {
  display: none;
  position: relative;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-signinDiv.hideSigninBtns #stscr-signinOptions {
  display: none;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-mobileWarning, #easyLoopsIndexScreen #stscr-header-content #stscr-safariWarning, #easyLoopsIndexScreen #stscr-header-content #stscr-videoWarning,
#easyLoopsIndexScreen #stscr-header-content #stscr-audioWarning, #easyLoopsIndexScreen #stscr-header-content #stscr-preferWarning {
  max-width: min(750px, 100% - 40px);
  margin: 20px auto 20px auto;
  padding: 10px;
  font-size: 1.5rem;
  color: #303030;
  font-weight: bold;
  display: none;
  background-color: #e5eaf5;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-preferWarning {
  background-color: #000;
  color: #FFF;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 0px;
  display: grid;
  grid-template-areas: "intro" "introVids" "features" "schools";
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introSection {
  grid-area: intro;
  margin: 20px auto 0 auto;
  width: 100%;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro {
  padding: 0 20px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introHeader {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introHeader {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody {
  margin-top: 20px;
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph {
  font-size: 1.8rem;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph:not(:first-child) {
  margin-top: 30px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph {
    font-size: 1.5rem;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids {
  grid-area: introVids;
  width: 100%;
  max-width: 1400px;
  margin: 0px auto 0 auto;
  padding: 10px 20px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer {
  margin-top: 20px;
  display: flex;
  align-items: center;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer {
    display: block;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left {
  width: 50%;
  aspect-ratio: 1.667;
  padding-right: 20px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left {
    width: 100%;
    padding-right: 0;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left img {
  width: 100%;
  height: 100%;
  border: 1px solid #468;
  box-shadow: 3px 3px 3px #000;
  border-radius: 15px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left iframe {
  display: none;
  width: 100%;
  height: 100%;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right {
  width: 50%;
  aspect-ratio: 1.667;
  padding-left: 20px;
  overflow-y: scroll;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right {
    aspect-ratio: initial;
    width: 100%;
    padding-left: 0;
    overflow-y: visible;
  }
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList {
    height: 200px;
    overflow-x: scroll;
    background: rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 10px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI {
  cursor: pointer;
  transition: 0.5s;
  margin-top: 10px;
  margin-right: 20px;
  border-bottom: 1px solid #87b4cb;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI {
    width: 100%;
    max-width: 470px;
    flex: 0 0 auto;
    align-self: flex-start;
    padding-right: 30px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI .videoLI-title {
  text-align: right;
  font-family: "Source Sans 3", sans-serif;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI .videoLI-title {
    text-align: left;
    font-size: 1.2rem;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI.currentVid {
  color: #a8f5a8;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI:hover {
  transform: translateX(-20px);
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI:hover {
    transform: none;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-sendVids {
  border-top: 1px solid #87b4cb;
  padding-top: 10px;
  margin-top: 20px;
  text-align: center;
  font-size: 1.2rem;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-sendVids {
    text-align: center;
    font-size: 1rem;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-featuresSection {
  grid-area: features;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-schoolsSection {
  grid-area: schools;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection:not(:first-child) {
  margin-top: 100px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection:not(:first-child) {
    margin-top: 70px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content {
  padding: 0 20px 0 20px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .showInSmall {
  display: none;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair.shift-right {
  justify-content: flex-end;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair.shift-left {
  justify-content: flex-start;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
  margin-top: 60px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
    margin-top: 40px;
  }
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .hideInSmall {
    display: none;
  }
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .showInSmall {
    display: block;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair:not(:first-child) {
  margin-top: 80px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
  width: 100%;
  max-width: 1400px;
  display: flex;
  align-items: flex-start;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
    width: 100%;
    display: block;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
  width: 48%;
  max-width: 700px;
  padding: 0 20px 0 0;
}
@media only screen and (max-width: 1500px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 0;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
  width: 48%;
  max-width: 700px;
  padding: 0 0 0 20px;
}
@media only screen and (max-width: 1500px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
    width: 100%;
    max-width: 600px;
    margin: 20px auto;
    padding: 0;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpHeader {
  font-size: 2.2rem;
  font-weight: bold;
  text-shadow: 1px 1px 1px #333;
  text-align: left;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpHeader {
    font-size: 1.8rem;
    padding: 0 10px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits {
    margin: 5px 0 20px 0;
    padding: 0 10px 0 32px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul {
  list-style-type: square;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul li {
  color: #DDD;
  margin-top: 7px;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul li {
    font-size: 1.2rem;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription {
    margin: 5px 0 20px 0;
    padding: 0 10px;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p {
  color: #DDD;
  margin-top: 7px;
  font-size: 1.5rem;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p:not(:first-child) {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p {
    font-size: 1.2rem;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem {
  container-type: inline-size;
  border-radius: 15px;
  overflow: hidden;
  cursor: pointer;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem iframe {
  aspect-ratio: 1.667;
  width: 100%;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem img {
  border: 1px solid #87b4cb;
  box-shadow: 3px 3px 3px #000;
  border-radius: 15px;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem {
    margin: 0 auto;
  }
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-image img {
  border: 1px solid #87b4cb;
  box-shadow: 3px 3px 3px #000;
  width: 100%;
  height: 100%;
  border-radius: 15px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-image {
  border-radius: 15px;
  overflow: hidden;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-videos {
  padding: 0 20px;
  margin-top: 50px;
  width: 100%;
  display: flex;
  justify-content: center;
  max-height: 400px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem {
  flex: 1 1 0;
  position: relative;
  container-type: inline-size;
  border-radius: 25px;
  overflow: hidden;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem:not(:first-child) {
  margin-left: 30px;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem iframe {
  aspect-ratio: 1.667;
  width: 100%;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem img {
  width: 100%;
  height: 100%;
}
#easyLoopsIndexScreen #stscr-header-content #stscr-appContainer {
  padding: 20px 20px;
}
#easyLoopsIndexScreen #stscr-footer {
  background: url("../images/star_twinkles2.webp");
  color: #FFF;
  padding: 20px 20px 20px 20px;
}
#easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent {
  max-width: 1200px;
  margin: 0 auto 0 auto;
}
#easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-title {
  text-align: center;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-title {
    font-size: 1.2rem;
  }
}
#easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle {
  text-align: left;
  font-size: 1.2rem;
  margin-top: 10px;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle {
    font-size: 1rem;
  }
}
#easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle.stscr-signature {
  text-align: right;
  margin-top: 0px;
}
#easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support {
  font-size: 1.2rem;
  text-align: center;
}
@media only screen and (max-width: 1200px) {
  #easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support {
    font-size: 1rem;
  }
}
#easyLoopsIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support a {
  text-decoration: underline;
}

#recorderIndexScreen {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-color: #000;
  background-image: url("../images/star_twinkles2.webp");
  color: #FFF;
  font-family: "Source Sans 3", sans-serif;
}
#recorderIndexScreen.startScreenLayout #stscr-header-content #stscr-info {
  grid-template-areas: "intro" "introVids" "features" "schools";
}
#recorderIndexScreen.startScreenLayout #stscr-header-content #stscr-info #stscr-introSection {
  margin-top: 80px;
}
#recorderIndexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
  display: block;
}
#recorderIndexScreen.showGuest #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinGuestBtnDiv {
  display: block;
}
#recorderIndexScreen #stscr-header-content {
  background-color: rgba(160, 210, 235, 0.15);
  padding-bottom: 100px;
}
#recorderIndexScreen #stscr-header-content #stscr-header {
  background: url("../images/star_twinkles2.webp");
  color: #FFF;
  padding: 20px 20px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-header {
    padding: 20px 20px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent {
  max-width: 1100px;
  margin: 0 auto 0 auto;
}
#recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
  text-align: center;
  font-size: 90px;
  font-weight: bold;
  font-family: "Montserrat", sans-serif;
}
@media only screen and (max-width: 1500px) {
  #recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 70px;
  }
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 50px;
  }
}
@media only screen and (max-width: 450px) {
  #recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text #stscr-title {
    font-size: 35px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
  text-align: center;
  font-size: 2.5rem;
  margin-top: 15px;
  font-family: "Montserrat", sans-serif;
  color: #a8f5a8;
  font-weight: bold;
}
@media only screen and (max-width: 1500px) {
  #recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
    font-size: 1.8rem;
  }
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-text .stscr-subtitle {
    font-size: 1.5rem;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image {
  display: none;
  margin-top: 5px;
}
#recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image img {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  -webkit-mask-image: radial-gradient(circle, black 78%, rgba(0, 0, 0, 0) 80%);
          mask-image: radial-gradient(circle, black 78%, rgba(0, 0, 0, 0) 80%);
}
#recorderIndexScreen #stscr-header-content #stscr-header #stscr-header-centerContent #stscr-header-cc-image {
  border-radius: 20px;
  overflow: hidden;
}
#recorderIndexScreen #stscr-header-content #stscr-signinDiv {
  margin-top: 0px;
  min-height: 200px;
  background-color: rgba(255, 255, 255, 0.15);
}
#recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
  display: flex;
  justify-content: space-between;
  width: 650px;
  margin: 0 auto;
  transform: translateY(55px);
}
#recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
  display: none;
  font-size: 2.2rem;
  font-weight: bold;
  text-align: center;
  margin: 20px auto;
  text-shadow: 1px 1px 1px #333;
}
#recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv {
  cursor: pointer;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  font-size: 54px;
  font-weight: bold;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  width: 250px;
  margin: 0 auto;
  background-color: orange;
  text-shadow: 1px 1px 1px #333;
  padding: 5px 0px;
  border-radius: 8px;
  box-shadow: 2px 2px 5px #000;
}
#recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions .giantButtonDiv:hover {
  background-color: rgb(255, 182, 65);
}
#recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinGuestBtnDiv {
  display: none;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 500px;
    transform: translateY(65px);
  }
  #recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions #stscr-signinOrDiv {
    font-size: 2.2rem;
    margin: 10px auto;
  }
}
@media only screen and (max-width: 600px) {
  #recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinOptions {
    width: 100%;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-signinDiv #stscr-signinBusyDiv {
  display: none;
  position: relative;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}
#recorderIndexScreen #stscr-header-content #stscr-signinDiv.hideSigninBtns #stscr-signinOptions {
  display: none;
}
#recorderIndexScreen #stscr-header-content #stscr-mobileWarning, #recorderIndexScreen #stscr-header-content #stscr-safariWarning, #recorderIndexScreen #stscr-header-content #stscr-videoWarning,
#recorderIndexScreen #stscr-header-content #stscr-audioWarning, #recorderIndexScreen #stscr-header-content #stscr-preferWarning {
  max-width: min(750px, 100% - 40px);
  margin: 20px auto 20px auto;
  padding: 10px;
  font-size: 1.5rem;
  color: #303030;
  font-weight: bold;
  display: none;
  background-color: #e5eaf5;
}
#recorderIndexScreen #stscr-header-content #stscr-preferWarning {
  background-color: #000;
  color: #FFF;
}
#recorderIndexScreen #stscr-header-content #stscr-info {
  max-width: 1500px;
  margin: 0 auto;
  padding: 0 0px;
  display: grid;
  grid-template-areas: "intro" "introVids" "features" "schools";
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introSection {
  grid-area: intro;
  margin: 20px auto 0 auto;
  width: 100%;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro {
  padding: 0 20px;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introHeader {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introHeader {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody {
  margin-top: 20px;
  max-width: 1350px;
  margin-left: auto;
  margin-right: auto;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph {
  font-size: 1.8rem;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph:not(:first-child) {
  margin-top: 30px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introSection #stscr-intro #stscr-introBody .stscr-introParagraph {
    font-size: 1.5rem;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids {
  grid-area: introVids;
  width: 100%;
  max-width: 1400px;
  margin: 0px auto 0 auto;
  padding: 10px 20px;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer {
  margin-top: 20px;
  display: flex;
  align-items: center;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer {
    display: block;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left {
  width: 50%;
  aspect-ratio: 1.667;
  padding-right: 20px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left {
    width: 100%;
    padding-right: 0;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left img {
  width: 100%;
  height: 100%;
  border: 1px solid #468;
  box-shadow: 3px 3px 3px #000;
  border-radius: 15px;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-left iframe {
  display: none;
  width: 100%;
  height: 100%;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right {
  width: 50%;
  aspect-ratio: 1.667;
  padding-left: 20px;
  overflow-y: scroll;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right {
    aspect-ratio: initial;
    width: 100%;
    padding-left: 0;
    overflow-y: visible;
  }
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList {
    height: 200px;
    overflow-x: scroll;
    background: rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    padding: 10px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI {
  cursor: pointer;
  transition: 0.5s;
  margin-top: 10px;
  margin-right: 20px;
  border-bottom: 1px solid #87b4cb;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI {
    width: 100%;
    max-width: 470px;
    flex: 0 0 auto;
    align-self: flex-start;
    padding-right: 30px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI .videoLI-title {
  text-align: right;
  font-family: "Source Sans 3", sans-serif;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI .videoLI-title {
    text-align: left;
    font-size: 1.2rem;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI.currentVid {
  color: #a8f5a8;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI:hover {
  transform: translateX(-20px);
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-videoListAndPlayer #stscr-iv-right #stscr-iv-videoListDiv #stscr-iv-videoList .stscr-iv-videoLI:hover {
    transform: none;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-sendVids {
  border-top: 1px solid #87b4cb;
  padding-top: 10px;
  margin-top: 20px;
  text-align: center;
  font-size: 1.2rem;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info #stscr-introVids #stscr-iv-sendVids {
    text-align: center;
    font-size: 1rem;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-featuresSection {
  grid-area: features;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-schoolsSection {
  grid-area: schools;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection:not(:first-child) {
  margin-top: 100px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection:not(:first-child) {
    margin-top: 70px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-header {
  font-family: "Montserrat", sans-serif;
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  background-color: #80C680;
  border-radius: 5px;
  -webkit-mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
          mask-image: radial-gradient(circle, black 70%, rgba(0, 0, 0, 0) 100%);
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-header {
    font-size: 2.2rem;
    padding: 0 50px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content {
  padding: 0 20px 0 20px;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .showInSmall {
  display: none;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair.shift-right {
  justify-content: flex-end;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair.shift-left {
  justify-content: flex-start;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
  margin-top: 60px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
    margin-top: 40px;
  }
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .hideInSmall {
    display: none;
  }
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .showInSmall {
    display: block;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair:not(:first-child) {
  margin-top: 80px;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
  width: 100%;
  max-width: 1400px;
  display: flex;
  align-items: flex-start;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair {
    width: 100%;
    display: block;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
  width: 48%;
  max-width: 700px;
  padding: 0 20px 0 0;
}
@media only screen and (max-width: 1500px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpLeft {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 0;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
  width: 48%;
  max-width: 700px;
  padding: 0 0 0 20px;
}
@media only screen and (max-width: 1500px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
    width: calc(50% - 10px);
  }
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpRight {
    width: 100%;
    max-width: 600px;
    margin: 20px auto;
    padding: 0;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpHeader {
  font-size: 2.2rem;
  font-weight: bold;
  text-shadow: 1px 1px 1px #333;
  text-align: left;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpHeader {
    font-size: 1.8rem;
    padding: 0 10px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits {
    margin: 5px 0 20px 0;
    padding: 0 10px 0 32px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul {
  list-style-type: square;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul li {
  color: #DDD;
  margin-top: 7px;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpBenefits ul li {
    font-size: 1.2rem;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription {
    margin: 5px 0 20px 0;
    padding: 0 10px;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p {
  color: #DDD;
  margin-top: 7px;
  font-size: 1.5rem;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p:not(:first-child) {
  margin-top: 20px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-mpDescription > p {
    font-size: 1.2rem;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem {
  container-type: inline-size;
  border-radius: 15px;
  overflow: hidden;
  cursor: pointer;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem iframe {
  aspect-ratio: 1.667;
  width: 100%;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem img {
  border: 1px solid #87b4cb;
  box-shadow: 3px 3px 3px #000;
  border-radius: 15px;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-videoItem {
    margin: 0 auto;
  }
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-image img {
  border: 1px solid #87b4cb;
  box-shadow: 3px 3px 3px #000;
  width: 100%;
  height: 100%;
  border-radius: 15px;
}
#recorderIndexScreen #stscr-header-content #stscr-info .stscr-infoSection .stscr-is-content .stscr-is-mediaPair .stscr-is-image {
  border-radius: 15px;
  overflow: hidden;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-videos {
  padding: 0 20px;
  margin-top: 50px;
  width: 100%;
  display: flex;
  justify-content: center;
  max-height: 400px;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem {
  flex: 1 1 0;
  position: relative;
  container-type: inline-size;
  border-radius: 25px;
  overflow: hidden;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem:not(:first-child) {
  margin-left: 30px;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem iframe {
  aspect-ratio: 1.667;
  width: 100%;
}
#recorderIndexScreen #stscr-header-content #stscr-info #stscr-videos .stscr-videoItem img {
  width: 100%;
  height: 100%;
}
#recorderIndexScreen #stscr-header-content #stscr-appContainer {
  padding: 20px 20px;
}
#recorderIndexScreen #stscr-footer {
  background: url("../images/star_twinkles2.webp");
  color: #FFF;
  padding: 20px 20px 20px 20px;
}
#recorderIndexScreen #stscr-footer #stscr-footer-centerContent {
  max-width: 1200px;
  margin: 0 auto 0 auto;
}
#recorderIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-title {
  text-align: center;
  font-size: 1.5rem;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-title {
    font-size: 1.2rem;
  }
}
#recorderIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle {
  text-align: left;
  font-size: 1.2rem;
  margin-top: 10px;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle {
    font-size: 1rem;
  }
}
#recorderIndexScreen #stscr-footer #stscr-footer-centerContent .stscr-subtitle.stscr-signature {
  text-align: right;
  margin-top: 0px;
}
#recorderIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support {
  font-size: 1.2rem;
  text-align: center;
}
@media only screen and (max-width: 1200px) {
  #recorderIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support {
    font-size: 1rem;
  }
}
#recorderIndexScreen #stscr-footer #stscr-footer-centerContent #stscr-support a {
  text-decoration: underline;
}

.tuner {
  width: 100%;
  height: 65px;
  background: linear-gradient(175deg, rgb(23, 23, 23) 60%, rgb(0, 0, 0) 100%);
  border-radius: 5px;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  box-shadow: 2px 2px 1px rgb(72, 72, 72);
  border: 2px solid #888;
}
.tuner .tuner-hashes {
  width: calc(100% - 25px);
  margin: 0 auto;
  height: 100%;
  position: relative;
  bottom: 2px;
}
.tuner .tuner-hashes .tuner-hash-div {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  justify-content: flex-end;
  height: 100%;
}
.tuner .tuner-hashes .tuner-hash-div .tuner-hashmark {
  width: 2px;
  height: 10px;
  background-color: #ddeeff;
}
.tuner .tuner-hashes .tuner-hash-div .tuner-hashValue {
  font-size: 0.9rem;
  color: #ddeeff;
}
.tuner .tuner-hashes .tuner-hash-n50 {
  left: 0px;
  transform: translateX(-8px);
}
.tuner .tuner-hashes .tuner-hash-n25 {
  left: 25%;
  transform: translateX(-8px);
}
.tuner .tuner-hashes .tuner-hash-n25 .tuner-hashValue {
  transform: translateX(-3px);
}
.tuner .tuner-hashes .tuner-hash-n10 {
  left: 40%;
  transform: translateX(-8px);
}
.tuner .tuner-hashes .tuner-hash-n10 .tuner-hashValue {
  transform: translateX(-3px);
}
.tuner .tuner-hashes .tuner-hash-0 {
  left: 50%;
  transform: translateX(-4px);
}
.tuner .tuner-hashes .tuner-hash-0 .tuner-hashmark {
  height: 15px;
  background-color: #a8f5a8;
}
.tuner .tuner-hashes .tuner-hash-p10 {
  left: 60%;
  transform: translateX(-6px);
}
.tuner .tuner-hashes .tuner-hash-p25 {
  left: 75%;
  transform: translateX(-6px);
}
.tuner .tuner-hashes .tuner-hash-p50 {
  left: 100%;
  transform: translateX(-6px);
}
.tuner .tuner-hashes .tuner-indicator {
  width: 30px;
  position: absolute;
  top: 2px;
  left: calc(50% - 15px);
}
.tuner .tuner-hashes .tuner-indicator .tuner-indicatorText {
  color: #a8f5a8;
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
}

a.shacc {
  color: #fcbb43;
}
a.shacc:hover {
  text-decoration: underline;
  cursor: pointer;
}

.shacc-header {
  font-size: 1.7rem;
  text-align: center;
  margin-bottom: 10px;
  color: #FFF;
}

.shacc-description {
  font-size: 1.2rem;
}

.shacc-message {
  margin-top: 15px;
  margin-left: 2px;
  font-size: 0.9rem;
  color: #FF9999;
}

input.shacc[type=text], input.shacc[type=password] {
  font-size: 1.2rem;
  width: 100%;
  margin-top: 10px;
  padding: 2px 5px;
}

.shacc-verticalRadioBtnGroup {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  padding-left: 8px;
}
.shacc-verticalRadioBtnGroup > label {
  display: block;
  padding-left: 28px;
  margin-top: 5px;
}
.shacc-verticalRadioBtnGroup > label:first-child {
  margin-top: 0;
}
.shacc-verticalRadioBtnGroup > label > input {
  margin-left: -28px;
  margin-right: 10px;
  width: 18px;
  height: 18px;
  transform: translateY(3px);
}

.shacc-bottomButtonsSection {
  margin-top: 30px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.shacc-bottomButtonsSection > div:not(:first-child) {
  margin-top: 10px;
}
.shacc-bottomButtonsSection button {
  background-color: #fcbb43;
  color: #FFF;
  border: none;
  cursor: pointer;
  width: 250px;
  padding: 5px 5px;
  border-radius: 15px;
  font-size: 1.4rem;
}
.shacc-bottomButtonsSection button:hover {
  box-shadow: 1px 1px 1px #FFF;
}
.shacc-bottomButtonsSection button:active {
  transform: translateY(1px);
}

.shacc-hide {
  display: none !important;
}

.user-manager-widget {
  width: 100%;
  min-height: 200px;
  position: relative;
  display: flex;
  justify-content: center;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  color: #FFF;
}
.user-manager-widget.hide {
  display: none;
}
.user-manager-widget.signInView #act-createAccountView, .user-manager-widget.signInView #act-resetPasswordView, .user-manager-widget.signInView #act-finishAccountView,
.user-manager-widget.signInView #act-emailConfirmationView, .user-manager-widget.signInView #act-manageAccountView {
  display: none;
}
.user-manager-widget.createAccountView #act-signInView, .user-manager-widget.createAccountView #act-resetPasswordView, .user-manager-widget.createAccountView #act-emailConfirmationView,
.user-manager-widget.createAccountView #act-finishAccountView, .user-manager-widget.createAccountView #act-manageAccountView {
  display: none;
}
.user-manager-widget.resetPasswordView #act-signInView, .user-manager-widget.resetPasswordView #act-createAccountView, .user-manager-widget.resetPasswordView #act-emailConfirmationView,
.user-manager-widget.resetPasswordView #act-finishAccountView, .user-manager-widget.resetPasswordView #act-manageAccountView {
  display: none;
}
.user-manager-widget.emailConfirmationView #act-signInView, .user-manager-widget.emailConfirmationView #act-createAccountView, .user-manager-widget.emailConfirmationView #act-resetPasswordView,
.user-manager-widget.emailConfirmationView #act-finishAccountView, .user-manager-widget.emailConfirmationView #act-manageAccountView {
  display: none;
}
.user-manager-widget.finishAccountView #act-signInView, .user-manager-widget.finishAccountView #act-createAccountView, .user-manager-widget.finishAccountView #act-resetPasswordView,
.user-manager-widget.finishAccountView #act-emailConfirmationView, .user-manager-widget.finishAccountView #act-manageAccountView {
  display: none;
}
.user-manager-widget.manageAccountView #act-signInView, .user-manager-widget.manageAccountView #act-createAccountView, .user-manager-widget.manageAccountView #act-resetPasswordView,
.user-manager-widget.manageAccountView #act-emailConfirmationView, .user-manager-widget.manageAccountView #act-finishAccountView {
  display: none;
}
.user-manager-widget #act-signInView {
  width: 100%;
}
.user-manager-widget #act-signInView #siv-resetDiv {
  margin-left: 2px;
  margin-top: 5px;
}
.user-manager-widget #act-signInView #siv-resetDiv #siv-resetLink {
  font-size: 0.9rem;
}
.user-manager-widget #act-createAccountView {
  width: 100%;
}
.user-manager-widget #act-createAccountView #cav-ageDiv {
  margin-top: 20px;
}
.user-manager-widget #act-createAccountView #cav-ageDiv #cav-ageInstructions {
  font-size: 1.5rem;
  margin-bottom: 10px;
}
.user-manager-widget #act-createAccountView #cav-ageDiv .cav-parentMsg {
  color: #0F0;
  font-size: 1.2rem;
  margin-top: 10px;
  text-decoration: underline;
}
.user-manager-widget #act-resetPasswordView {
  width: 100%;
}
.user-manager-widget #act-emailConfirmationView {
  width: 100%;
}
.user-manager-widget #act-emailConfirmationView #ecv-resendInstruction {
  margin-top: 15px;
}
.user-manager-widget #act-emailConfirmationView #ecv-signoutLinkDiv {
  margin-top: 20px;
  text-align: center;
}
.user-manager-widget #act-emailConfirmationView #ecv-infoMsg {
  margin-top: 20px;
  text-align: center;
  color: #FF0;
}
.user-manager-widget #act-finishAccountView {
  width: 100%;
}
.user-manager-widget #act-finishAccountView #fav-usernameDiv #fav-usernameInstructions {
  font-size: 1.2rem;
}
.user-manager-widget #act-finishAccountView #fav-usernameDiv #fav-usernameInput {
  color: 0;
}
.user-manager-widget #act-finishAccountView #fav-codeDiv {
  margin-top: 20px;
}
.user-manager-widget #act-finishAccountView #fav-codeDiv #fav-codeInstructions {
  font-size: 1.2rem;
}
.user-manager-widget #act-finishAccountView #fav-signoutLinkDiv {
  margin-top: 20px;
  text-align: center;
}
.user-manager-widget #act-manageAccountView {
  width: 100%;
}
.user-manager-widget #act-manageAccountView #mav-welcome {
  margin-top: 15px;
  font-size: 1.4rem;
  color: #0F0;
  text-align: center;
}
.user-manager-widget #act-manageAccountView #mav-manageDataLinkDiv {
  margin-top: 15px;
  text-align: center;
}
.user-manager-widget #act-manageAccountView #mav-deleteAccountLinkDiv {
  margin-top: 15px;
  text-align: center;
}

#stscr-app {
  padding: 20px 20px 0 20px;
}
#stscr-app.guestMode #stscr-readyView {
  display: none;
}
#stscr-app.guestMode #stscr-guestReadyView {
  display: block;
}
#stscr-app #stscr-welcomeAndRequirements {
  max-width: 1500px;
  margin: 0 auto;
  padding: 10px;
  border-top: 1px solid #888;
  border-bottom: 1px solid #888;
  display: flex;
  justify-content: center;
}
#stscr-app #stscr-welcomeAndRequirements.showWelcome #stscr-welcomeSection {
  display: block;
}
#stscr-app #stscr-welcomeAndRequirements.showWelcome #stscr-requirements {
  margin-left: 30px;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-welcomeSection {
  display: none;
  justify-content: center;
  flex-shrink: 0;
  text-align: left;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-welcomeSection #stscr-welcomeMsg {
  font-size: 1.8rem;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-welcomeSection #stscr-manageMyCommunitiesLinkDiv {
  margin-top: 12px;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-welcomeSection #stscr-manageMyCommunitiesLinkDiv #stscr-manageMyCommunitiesLink {
  color: #fcbb43;
  font-size: 1.2rem;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-welcomeSection #stscr-manageAccountLinkDiv {
  display: none;
  margin-top: 5px;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-welcomeSection #stscr-manageAccountLinkDiv #stscr-manageAccountLink {
  color: #fcbb43;
  font-size: 1.2rem;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-welcomeSection #stscr-signoutLinkDiv {
  margin-top: 5px;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-welcomeSection #stscr-signoutLinkDiv #stscr-signoutLink {
  color: #fcbb43;
  font-size: 1.2rem;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-requirements {
  flex-shrink: 1;
  max-width: 400px;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-requirements #stscr-req-header {
  font-size: 1.8rem;
  text-align: left;
  margin-left: 20px;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-requirements #stscr-req-listDiv {
  margin-top: 10px;
}
#stscr-app #stscr-welcomeAndRequirements #stscr-requirements #stscr-req-listDiv #stscr-req-list li {
  font-size: 1.2rem;
  margin-left: 20px;
}
#stscr-app #stscr-readyView {
  max-width: 800px;
  margin: 30px auto 0 auto;
}
#stscr-app #stscr-readyView.hide {
  display: none;
}
#stscr-app #stscr-readyView.noCommunity #rv-startBtnAndCommunity {
  display: none;
}
#stscr-app #stscr-readyView.noCommunity #stscr-rv-instructions {
  display: none;
}
#stscr-app #stscr-readyView.noCommunity #stscr-rv-instructionsNewUser, #stscr-app #stscr-readyView.noCommunity #stscr-rv-haveCode {
  display: block;
}
#stscr-app #stscr-readyView.showCodeInput #rv-startBtnAndCommunity #rv-communityDiv #rv-communityInstructionsDiv {
  display: none;
}
#stscr-app #stscr-readyView.showCodeInput #rv-startBtnAndCommunity #rv-communityDiv #rv-communityCodeDiv {
  display: flex;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 20px;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-startBtnDiv #rv-startBtn {
  padding: 5px 0;
  width: 250px;
  font-family: "Montserrat", sans-serif;
  font-size: 65px;
  font-weight: bold;
  border-radius: 8px;
  color: #FFF;
  background-color: orange;
  text-shadow: 1px 1px 1px #333;
  border: none;
  box-shadow: 1px 1px #000;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  cursor: pointer;
  border-color: #fcbb43;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-startBtnDiv #rv-startBtn:hover {
  box-shadow: 1px 1px #AAA;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-startBtnDiv #rv-startBtn:active {
  box-shadow: none;
  transform: translateY(1px);
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-startBtnDiv #rv-startBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-startBtnDiv #rv-startBtn.disabled:hover {
  box-shadow: none;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-startBtnDiv #rv-startBtn.disabled:active {
  box-shadow: none;
  transform: translateY(0px);
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv {
  margin-left: 25px;
  width: 400px;
  position: relative;
  top: 1px;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communitySelectDiv #rv-communitySelect {
  width: 100%;
  font-size: 1.2rem;
  padding: 8px;
  border-radius: 5px;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communityInstructionsDiv {
  display: flex;
  margin-top: 5px;
  justify-content: space-between;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communityInstructionsDiv div {
  font-size: 1.2rem;
  color: #fcbb43;
  cursor: pointer;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communityInstructionsDiv div:hover {
  text-decoration: underline;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communityCodeDiv {
  display: none;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communityCodeDiv input {
  flex: 1 1 auto;
  font-size: 1.2rem;
  padding: 4px 5px;
  border-radius: 5px;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communityCodeDiv button {
  flex: 0 0 auto;
  margin-left: 5px;
  font-size: 1.2rem;
  padding: 3px 10px;
  border-radius: 5px;
  cursor: pointer;
  color: #FFF;
  background-color: #ff9500;
  box-shadow: 1px 1px 5px 0px #000000;
  border: solid #ff9500 1px;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communityCodeDiv button:hover {
  box-shadow: 1px 1px #AAA;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-communityDiv #rv-communityCodeDiv button:active {
  box-shadow: none;
  transform: translateY(1px);
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-guestCommunityDiv {
  display: none;
  max-width: 400px;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-guestCommunityDiv #rv-guestCommunityInstructionsDiv {
  font-size: 1.2rem;
  margin-left: 20px;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-guestCommunityDiv #rv-guestCommunityInstructionsDiv #guestCodeLink {
  color: #fcbb43;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-guestCommunityDiv #rv-guestCommunityCodeDiv {
  display: none;
  width: 100%;
}
#stscr-app #stscr-readyView #rv-startBtnAndCommunity #rv-guestCommunityDiv #rv-guestCommunityCodeDiv input {
  font-size: 1.2rem;
  padding: 4px 5px;
  border-radius: 5px;
}
#stscr-app #stscr-readyView #stscr-rv-instructions {
  margin-top: 10px;
  font-size: 35px;
  font-weight: bold;
  color: #a8f5a8;
  text-align: center;
}
#stscr-app #stscr-readyView #stscr-rv-instructionsNewUser {
  display: none;
  margin-top: 10px;
  font-size: 35px;
  font-weight: bold;
  color: #a8f5a8;
  text-align: center;
}
#stscr-app #stscr-readyView #stscr-rv-haveCode {
  display: none;
  margin-top: 10px;
  font-size: 1.2rem;
  color: #ffb400;
  text-align: center;
  cursor: pointer;
}
#stscr-app #stscr-readyView #stscr-rv-haveCode:hover {
  text-decoration: underline;
}
#stscr-app #stscr-guestReadyView {
  display: none;
  max-width: 620px;
  margin: 40px auto 0 auto;
}
#stscr-app #stscr-guestReadyView #grv-startBtnDiv {
  text-align: center;
}
#stscr-app #stscr-guestReadyView #grv-startBtnDiv button {
  margin-left: 10px;
  font-size: 70px;
  font-weight: bold;
  padding: 5px 30px;
  border-radius: 5px;
  cursor: pointer;
  color: #FFF;
  background-color: #ff9500;
  box-shadow: 1px 1px 5px 0px #000000;
  border: solid #ff9500 1px;
  text-shadow: 1px 1px 1px #333;
}
#stscr-app #stscr-guestReadyView #grv-startBtnDiv button:hover {
  box-shadow: 1px 1px #AAA;
}
#stscr-app #stscr-guestReadyView #grv-startBtnDiv button:active {
  box-shadow: none;
  transform: translateY(1px);
}
#stscr-app #stscr-userManagerContainer {
  max-width: 600px;
  margin: 30px auto 0 auto;
}

.manage-data-dg.dialog {
  max-width: 800px;
  max-height: calc(100dvh - 30px);
  overflow-y: auto;
  justify-content: flex-start;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.manage-data-dg.dialog .dialog-fields-section {
  padding: 0 15px;
}
.manage-data-dg.dialog .dialog-fields-section .mdd-description {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.manage-data-dg.dialog .dialog-fields-section .mdd-dataSelectDiv {
  width: 100%;
  text-align: left;
  margin-top: 30px;
}
.manage-data-dg.dialog .dialog-fields-section .mdd-dataSelectDiv label {
  font-size: 1.2rem;
  color: #0F0;
  text-decoration: underline;
}
.manage-data-dg.dialog .dialog-fields-section .mdd-dataSelectDiv .mdd-messagesLbl {
  margin-left: 40px;
}
.manage-data-dg.dialog .dialog-fields-section .mdd-contentDiv {
  margin-top: 30px;
  width: 100%;
  height: 300px;
  max-height: calc(100dvh - 400px);
  overflow-y: scroll;
}
.manage-data-dg.dialog .dialog-fields-section .mdd-performancesDiv {
  display: none;
}
.manage-data-dg.dialog .dialog-fields-section .mdd-messagesDiv {
  display: none;
}
.manage-data-dg.dialog .mdd-buttons.dialog-buttons-section {
  margin-top: 30px;
  justify-content: center;
  width: 150px;
}
.manage-data-dg.dialog .mdd-buttons.dialog-buttons-section .mdd-closeBtn {
  margin-left: 30px;
  width: 125px;
}
.manage-data-dg.dialog .mdd-buttons.dialog-buttons-section button {
  background-color: #ff9500;
  color: #FFF;
  display: block;
}

#lcAppContainer {
  height: 100%;
  width: 100%;
  background: url("../images/star_twinkles2.webp");
  display: grid;
  position: relative;
}
#lcAppContainer.withActivityPanel {
  grid-template-columns: calc(100% - 275px) 275px;
  grid-template-rows: 100%;
}
@media screen and (max-width: 1500px) {
  #lcAppContainer.withActivityPanel {
    grid-template-columns: calc(100% - 200px) 200px;
  }
}
@media screen and (max-width: 1300px) {
  #lcAppContainer.withActivityPanel {
    grid-template-columns: calc(100% - 168px) 168px;
  }
}
#lcAppContainer.withActivityPanel.empty-view {
  grid-template-areas: "menu activityPanel";
}
#lcAppContainer.withActivityPanel.menu-view {
  grid-template-areas: "menu activityPanel";
}
#lcAppContainer.withActivityPanel.menu-view #lcac-menu, #lcAppContainer.withActivityPanel.menu-view #lcac-activityPanel {
  display: block;
}
#lcAppContainer.withActivityPanel.player-view {
  grid-template-areas: "player activityPanel";
}
#lcAppContainer.withActivityPanel.player-view #lcac-player, #lcAppContainer.withActivityPanel.player-view #lcac-activityPanel {
  display: block;
}
#lcAppContainer.withMiniPanel {
  grid-template-columns: calc(100% - 50px) 50px;
  grid-template-rows: 100%;
}
#lcAppContainer.withMiniPanel.miniPanelClips #lcac-miniPanel {
  background-color: rgba(0, 0, 0, 0);
}
#lcAppContainer.withMiniPanel.miniPanelClips {
  grid-template-columns: calc(100% - 168px) 168px;
}
#lcAppContainer.withMiniPanel.empty-view {
  grid-template-areas: "menu miniPanel";
}
#lcAppContainer.withMiniPanel.menu-view {
  grid-template-areas: "menu miniPanel";
}
#lcAppContainer.withMiniPanel.menu-view #lcac-menu, #lcAppContainer.withMiniPanel.menu-view #lcac-activityPanel {
  display: block;
}
#lcAppContainer.withMiniPanel.player-view {
  grid-template-areas: "player miniPanel";
}
#lcAppContainer.withMiniPanel.player-view #lcac-player, #lcAppContainer.withMiniPanel.player-view #lcac-activityPanel {
  display: block;
}
#lcAppContainer #lcac-menu {
  grid-area: menu;
  display: none;
  width: 100%;
  overflow-y: auto;
}
#lcAppContainer #lcac-player {
  grid-area: player;
  display: none;
}
#lcAppContainer #lcac-activityPanel {
  grid-area: activityPanel;
  width: 100%;
  height: 100%;
  background-color: rgba(160, 210, 235, 0.15);
  border-left: 1px solid #888;
}
#lcAppContainer #lcac-miniPanel {
  grid-area: miniPanel;
  width: 100%;
  height: 100%;
  background-color: rgba(160, 210, 235, 0.15);
  border-left: 1px solid #888;
}

.accountWidget {
  color: #FFF;
  font-size: 1.5rem;
  cursor: pointer;
  display: flex;
  align-items: center;
}
.accountWidget > .accountWidget-message {
  margin-right: 10px;
}
.accountWidget > .accountWidget-imgDiv {
  width: 30px;
  height: 30.2px;
}
.accountWidget > .accountWidget-imgDiv > img {
  width: 100%;
  height: 100%;
}

#m-container {
  height: 100%;
  width: 100%;
  display: grid;
  grid-template-columns: 270px calc(100% - 270px);
  grid-template-rows: 100%;
  grid-template-areas: "menu_left panels";
}
@media screen and (max-width: 1300px) {
  #m-container {
    grid-template-columns: 225px calc(100% - 225px);
  }
}
@media screen and (max-width: 1200px) {
  #m-container {
    grid-template-columns: 100%;
    grid-template-rows: 1fr;
    grid-template-areas: "panels" "menu_left";
  }
}
#m-container.show-songs #m-panelsArea, #m-container.show-community #m-panelsArea {
  overflow-y: hidden;
}
#m-container.show-songs #m-panelsArea #m-library, #m-container.show-community #m-panelsArea #m-library {
  display: flex;
}
#m-container.show-songs #m-panelsArea #m-sessions-scrollArea, #m-container.show-community #m-panelsArea #m-sessions-scrollArea {
  display: none;
}
#m-container.show-sessions #m-panelsArea {
  overflow-y: hidden;
}
#m-container.show-sessions #m-panelsArea #m-library {
  display: none;
}
#m-container.show-sessions #m-panelsArea #m-sessions-scrollArea {
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1200px) {
  #m-container.show-songs #m-left {
    display: none;
  }
  #m-container.show-songs #m-panelsArea {
    display: flex;
  }
  #m-container.show-songs #m-panelsArea #m-library {
    display: flex;
  }
  #m-container.show-songs #m-panelsArea #m-sessions-scrollArea {
    display: none;
  }
  #m-container.show-sessions #m-left {
    display: none;
  }
  #m-container.show-sessions #m-panelsArea {
    display: flex;
  }
  #m-container.show-sessions #m-panelsArea #m-library {
    display: none;
  }
  #m-container.show-sessions #m-panelsArea #m-sessions-scrollArea {
    display: flex;
    flex-direction: column;
  }
  #m-container.show-community {
    grid-template-rows: auto 1fr;
  }
  #m-container.show-community #m-left {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    border-right: none;
  }
  #m-container.show-community #m-left #m-communityArea {
    width: 100%;
    border-bottom: none;
    flex: 1;
  }
  #m-container.show-community #m-panelsArea {
    height: auto;
    display: flex;
  }
  #m-container.show-community #m-panelsArea #m-library {
    display: none;
  }
  #m-container.show-community #m-panelsArea #m-sessions-scrollArea {
    display: none;
  }
}
#m-container.managerMode #m-left #m-communityArea #m-ca-edit {
  display: block;
}
#m-container.managerMode #m-left #m-communityArea #m-ca-manageMembers {
  display: block;
}
#m-container.noUsersMode {
  grid-template-areas: "panels";
  grid-template-columns: 100%;
}
#m-container.noUsersMode #m-left {
  display: none;
}
#m-container.noUsersMode #m-panelsArea #m-tabHeader {
  display: none;
}
#m-container.noUsersMode #m-panelsArea #m-sessions-scrollArea {
  display: none;
}
#m-container #m-left {
  grid-area: menu_left;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-right: 1px solid rgba(119, 119, 119, 0.6);
}
#m-container #m-left #m-communityArea {
  grid-area: community;
  padding: 0 10px 10px 10px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  flex: 1 1 auto;
  overflow-y: auto;
  padding-right: 5px; /* Spacing for the scrollbar */
}
#m-container #m-left #m-communityArea::-webkit-scrollbar {
  width: 6px;
}
#m-container #m-left #m-communityArea::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.02);
  border-radius: 3px;
}
#m-container #m-left #m-communityArea::-webkit-scrollbar-thumb {
  background: rgb(161, 207, 154);
  border-radius: 3px;
}
#m-container #m-left #m-communityArea::-webkit-scrollbar-thumb:hover {
  background: rgb(205, 255, 197);
}
#m-container #m-left #m-communityArea {
  border-bottom: 1px solid rgba(119, 119, 119, 0.6);
}
#m-container #m-left #m-communityArea.editMode #m-ca-code {
  display: block;
}
#m-container #m-left #m-communityArea.editMode #m-ca-description {
  display: none;
}
#m-container #m-left #m-communityArea.editMode #m-ca-description-edit {
  display: block;
}
#m-container #m-left #m-communityArea.editMode #m-ca-links #m-ca-linksList {
  display: none;
}
#m-container #m-left #m-communityArea.editMode #m-ca-links #m-ca-linksListEdit {
  display: block;
}
#m-container #m-left #m-communityArea.editMode.showTips #m-ca-description-edit #m-ca-tips {
  display: block;
}
#m-container #m-left #m-communityArea.editMode #m-ca-cancel {
  display: block;
}
#m-container #m-left #m-communityArea.editMode #m-ca-manageMembers {
  display: none;
}
#m-container #m-left #m-communityArea #m-ca-title {
  margin-top: 10px;
  color: #ddeeff;
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
  font-size: 1.2rem;
  text-align: center;
  padding: 0 5px 5px 5px;
  border-bottom: 1px solid rgba(119, 119, 119, 0.6);
}
@media screen and (max-width: 1300px) {
  #m-container #m-left #m-communityArea #m-ca-title {
    font-size: 1.1rem;
  }
}
#m-container #m-left #m-communityArea #m-ca-code {
  display: none;
  margin-top: 10px;
  font-size: 1rem;
  color: #ddeeff;
}
#m-container #m-left #m-communityArea #m-ca-code span {
  color: #FFF;
  cursor: pointer;
}
@media screen and (max-width: 1300px) {
  #m-container #m-left #m-communityArea #m-ca-code {
    font-size: 0.9rem;
  }
}
#m-container #m-left #m-communityArea #m-ca-description {
  margin-top: 10px;
}
#m-container #m-left #m-communityArea #m-ca-description #m-ca-descriptionHeader {
  color: #ddeeff;
  font-weight: bold;
  font-size: 1.2rem;
  margin-right: 5px;
}
@media screen and (max-width: 1300px) {
  #m-container #m-left #m-communityArea #m-ca-description #m-ca-descriptionHeader {
    font-size: 1.1rem;
  }
}
#m-container #m-left #m-communityArea #m-ca-description #m-ca-descriptionBody {
  color: #FFF;
  font-size: 1rem;
}
@media screen and (max-width: 1300px) {
  #m-container #m-left #m-communityArea #m-ca-description #m-ca-descriptionBody {
    font-size: 0.9rem;
  }
}
#m-container #m-left #m-communityArea #m-ca-description-edit {
  display: none;
  margin-top: 10px;
}
#m-container #m-left #m-communityArea #m-ca-description-edit #m-ca-description-editInstructions {
  color: #FFF;
}
#m-container #m-left #m-communityArea #m-ca-description-edit #m-ca-description-editTA {
  margin-top: 5px;
  width: 100%;
  height: 250px;
  font-size: 1.2rem;
  padding: 5px;
}
#m-container #m-left #m-communityArea #m-ca-description-edit #m-ca-seeTips {
  color: #ffb400;
  text-align: right;
}
#m-container #m-left #m-communityArea #m-ca-description-edit #m-ca-tips {
  display: none;
  max-height: 150px;
  padding-right: 5px;
  overflow-y: scroll;
  margin-top: 10px;
  color: #FFF;
  font-size: 1rem;
}
@media screen and (max-width: 1300px) {
  #m-container #m-left #m-communityArea #m-ca-description-edit #m-ca-tips {
    font-size: 0.9rem;
  }
}
#m-container #m-left #m-communityArea #m-ca-links {
  margin-top: 30px;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksHeader {
  color: #ddeeff;
  font-weight: bold;
  font-size: 1.2rem;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksList {
  margin-top: 10px;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksList .m-ca-linkItem a {
  color: #fcbb43;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksList .m-ca-linkItem a:hover {
  text-decoration: underline;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksListEdit {
  display: none;
  margin-top: 10px;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksListEdit #m-ca-linksListEditInstructions {
  color: #FFF;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksListEdit #m-ca-linksListEditPairs {
  margin-top: 10px;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksListEdit #m-ca-linksListEditPairs .m-ca-linksListEditPair {
  width: 100%;
  display: flex;
  border-bottom: 1px solid rgba(119, 119, 119, 0.6);
  padding-bottom: 10px;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksListEdit #m-ca-linksListEditPairs .m-ca-linksListEditPair div {
  flex: 0 1 auto;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksListEdit #m-ca-linksListEditPairs .m-ca-linksListEditPair div input {
  width: 100%;
  padding: 0px 5px;
}
#m-container #m-left #m-communityArea #m-ca-links #m-ca-linksListEdit #m-ca-linksListEditPairs .m-ca-linksListEditPair div:not(:first-child) {
  margin-left: 10px;
}
#m-container #m-left #m-communityArea #m-ca-edit {
  display: none;
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#m-container #m-left #m-communityArea #m-ca-edit:hover {
  background-color: #494D5F;
}
#m-container #m-left #m-communityArea #m-ca-edit {
  margin-top: 25px;
  text-align: center;
  border-radius: 5px;
  padding: 2px 0;
  font-size: 1.2rem;
  text-shadow: 1px 1px 1px #333;
  cursor: pointer;
}
#m-container #m-left #m-communityArea #m-ca-cancel {
  display: none;
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#m-container #m-left #m-communityArea #m-ca-cancel:hover {
  background-color: #494D5F;
}
#m-container #m-left #m-communityArea #m-ca-cancel {
  margin-top: 25px;
  text-align: center;
  border-radius: 5px;
  padding: 2px 0;
  font-size: 1.2rem;
  text-shadow: 1px 1px 1px #333;
  cursor: pointer;
}
#m-container #m-left #m-communityArea #m-ca-manageMembers {
  display: none;
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#m-container #m-left #m-communityArea #m-ca-manageMembers:hover {
  background-color: #494D5F;
}
#m-container #m-left #m-communityArea #m-ca-manageMembers {
  margin-top: 25px;
  text-align: center;
  border-radius: 5px;
  padding: 2px 0;
  font-size: 1.2rem;
  text-shadow: 1px 1px 1px #333;
  cursor: pointer;
}
#m-container #m-panelsArea {
  grid-area: panels;
  padding: 10px 10px 10px 10px;
  display: flex;
  flex-direction: column;
  height: 100%;
  max-width: 1600px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
#m-container #m-panelsArea #m-tabHeader {
  display: flex;
  gap: 12px;
  margin-bottom: 15px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  flex: 0 0 auto;
}
#m-container #m-panelsArea #m-tabHeader .m-tabBtn {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 6px;
  padding: 6px 16px;
  color: #DDD;
  font-family: "Montserrat", sans-serif;
  font-size: 1.8rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  outline: none;
}
#m-container #m-panelsArea #m-tabHeader .m-tabBtn:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.15);
  color: #FFF;
}
#m-container #m-panelsArea #m-tabHeader .m-tabBtn.active {
  background: rgba(168, 245, 168, 0.12);
  border-color: rgba(168, 245, 168, 0.45);
  color: #a8f5a8; /* Signature Green title color! */
  box-shadow: 0 0 10px rgba(168, 245, 168, 0.12);
}
@media screen and (max-width: 1300px) {
  #m-container #m-panelsArea #m-tabHeader .m-tabBtn {
    font-size: 1.5rem;
    padding: 5px 12px;
  }
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea #m-tabHeader .m-tabBtn {
    font-size: 1.2rem;
    padding: 4px 10px;
  }
}
#m-container #m-panelsArea #m-tabHeader .m-communityTabBtn {
  display: none;
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea #m-tabHeader .m-communityTabBtn {
    display: block;
  }
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea {
    height: 100%;
  }
}
#m-container #m-panelsArea .m-panelSection {
  background-color: rgba(18, 22, 33, 0.55);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 10px;
  padding: 5px 10px;
}
#m-container #m-panelsArea .m-panelSection:not(:first-child) {
  margin-top: 20px;
}
#m-container #m-panelsArea .m-grid-section-header {
  display: flex;
  align-items: center;
  font-family: "Montserrat", sans-serif;
  font-size: 1.8rem;
  color: #FFF;
  padding: 2px 5px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#m-container #m-panelsArea .m-grid-section-header .m-panel-section-header-title {
  font-weight: 500;
}
@media screen and (max-width: 1300px) {
  #m-container #m-panelsArea .m-grid-section-header {
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea .m-grid-section-header {
    font-size: 1.2rem;
  }
}
#m-container #m-panelsArea #m-library {
  width: 100%;
  max-width: 100%;
  flex: 1 1 auto;
  height: 0;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background-color: transparent;
  backdrop-filter: none;
  border: none;
  box-shadow: none;
  padding: 0;
}
#m-container #m-panelsArea #m-library #m-categoryList {
  min-height: 100px;
  width: 100%;
  padding: 10px 0px;
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide {
  width: calc(100% + 20px);
  min-height: 80px;
  margin-left: -10px;
  padding: 0 50px;
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide .splide__track .splide__list .m-categoryItem {
  padding: 5px 10px;
  padding-top: 8px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.01) 100%), linear-gradient(135deg, rgba(28, 38, 33, 0.75) 0%, rgba(16, 20, 18, 0.85) 100%);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.45), inset 0 0 1px 1px rgba(255, 255, 255, 0.06);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide .splide__track .splide__list .m-categoryItem:hover {
  border: 1px solid rgba(255, 180, 0, 0.5);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.55), 0 0 12px rgba(255, 180, 0, 0.25), inset 0 0 2px 1px rgba(255, 255, 255, 0.12);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.02) 100%), linear-gradient(135deg, rgba(45, 42, 35, 0.85) 0%, rgba(22, 20, 18, 0.95) 100%);
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide .splide__track .splide__list .m-categoryItem {
  height: 80px;
  cursor: pointer;
  display: flex;
  align-items: center;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.01) 100%), linear-gradient(135deg, rgba(22, 28, 38, 0.75) 0%, rgba(15, 18, 22, 0.85) 100%);
  border: 1px solid rgba(168, 221, 255, 0.08);
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide .splide__track .splide__list .m-categoryItem.selected {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%), linear-gradient(135deg, rgba(255, 180, 0, 0.12) 0%, rgba(22, 20, 18, 0.85) 100%);
  border: 1px solid rgba(255, 180, 0, 0.5);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.45), 0 0 10px rgba(255, 180, 0, 0.25);
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide .splide__track .splide__list .m-categoryItem.selected .m-ci-info .m-ci-title {
  color: #ffb400;
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide .splide__track .splide__list .m-categoryItem .m-ci-info {
  width: 100%;
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide .splide__track .splide__list .m-categoryItem .m-ci-info .m-ci-title {
  color: #a8f5a8;
  font-size: 1.2rem;
  text-align: center;
}
#m-container #m-panelsArea #m-library #m-categoryList .m-categorySplide .splide__track .splide__list .m-categoryItem .m-ci-info .m-ci-subtitle {
  margin-top: 5px;
  color: #DDD;
  font-size: 0.9rem;
  text-align: center;
}
#m-container #m-panelsArea #m-library #m-categorySongDivider {
  border: 1px dashed #888;
  margin: 5px 0;
}
#m-container #m-panelsArea #m-library #m-songList {
  flex: 0 1 auto;
  overflow-y: auto;
  padding-right: 5px; /* Spacing for the scrollbar */
  margin-top: 15px;
  min-height: 100px;
}
#m-container #m-panelsArea #m-library #m-songList::-webkit-scrollbar {
  width: 6px;
}
#m-container #m-panelsArea #m-library #m-songList::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.02);
  border-radius: 3px;
}
#m-container #m-panelsArea #m-library #m-songList::-webkit-scrollbar-thumb {
  background: rgb(161, 207, 154);
  border-radius: 3px;
}
#m-container #m-panelsArea #m-library #m-songList::-webkit-scrollbar-thumb:hover {
  background: rgb(205, 255, 197);
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 64px;
  margin-bottom: 10px;
  padding: 12px 18px;
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%), linear-gradient(135deg, rgba(22, 32, 28, 0.25) 0%, rgba(16, 20, 18, 0.4) 100%);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3), inset 0 0 1px rgba(255, 255, 255, 0.05);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
  cursor: pointer;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem:hover {
  transform: translateY(-1px) translateX(4px);
  border: 1px solid rgba(255, 180, 0, 0.4);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4), 0 0 10px rgba(255, 180, 0, 0.2), inset 0 0 2px rgba(255, 255, 255, 0.1);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%), linear-gradient(135deg, rgba(45, 42, 35, 0.85) 0%, rgba(22, 20, 18, 0.95) 100%);
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem.series .m-songItem-metaDiv .m-seriesBadge {
  display: inline-block;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem.series .m-songItem-metaDiv .m-si-level {
  display: none;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem.lessons .m-songItem-metaDiv .m-lessonsBadge {
  display: inline-block;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem.lessons .m-songItem-metaDiv .m-si-level {
  display: none;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem.proLock .m-songItem-metaDiv .m-proLock {
  display: inline-block;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem.proUnlock .m-songItem-metaDiv .m-proUnlock {
  display: inline-block;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem.community .m-songItem-metaDiv .m-communityBadge {
  display: inline-block;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-infoDiv {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  flex: 1 1 auto;
  min-width: 0;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-infoDiv .m-title {
  font-size: 1.2rem;
  font-weight: 500;
  color: #a8f5a8;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 0 1 auto;
  max-width: 380px;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-infoDiv .m-title > a {
  font-size: 1.2rem;
  font-weight: 500;
  color: #a8f5a8;
  text-decoration: none;
  transition: color 0.2s;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-infoDiv .m-title > a:hover {
  color: #a8f5a8;
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-infoDiv .m-title {
    font-size: 1rem;
  }
  #m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-infoDiv .m-title > a {
    font-size: 1rem;
  }
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-infoDiv .m-composer {
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.45);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 280px;
  letter-spacing: 0.2px;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  flex: 0 0 auto;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-si-level,
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-seriesBadge,
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-lessonsBadge,
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-proLock,
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-proUnlock,
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-communityBadge {
  display: none;
  position: static;
  font-family: "Montserrat", sans-serif;
  font-size: 0.8rem;
  font-weight: 600;
  border-radius: 20px;
  padding: 2px 8px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-si-level {
  display: inline-block;
  color: #DDD;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  text-align: right;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-si-level input {
  width: 60px;
  margin-left: 6px;
  padding: 1px 4px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #FFF;
  border-radius: 4px;
  outline: none;
  text-align: center;
  font-size: 0.8rem;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-si-level input:focus {
  border-color: rgba(255, 180, 0, 0.5);
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-seriesBadge {
  background: rgba(168, 221, 255, 0.08);
  border: 1px solid rgba(168, 221, 255, 0.3);
  color: #a8ddff;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-lessonsBadge {
  background: rgba(168, 245, 168, 0.08);
  border: 1px solid rgba(168, 245, 168, 0.3);
  color: #a8f5a8;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-proLock {
  background: rgba(255, 180, 0, 0.08);
  border: 1px solid rgba(255, 180, 0, 0.3);
  color: #ffb400;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-proUnlock {
  background: rgba(168, 245, 168, 0.08);
  border: 1px solid rgba(168, 245, 168, 0.3);
  color: #a8f5a8;
}
#m-container #m-panelsArea #m-library #m-songList .m-songItem .m-songItem-metaDiv .m-communityBadge {
  background: rgba(0, 200, 200, 0.08);
  border: 1px solid rgba(0, 200, 200, 0.3);
  color: #00c8c8;
}
#m-container #m-panelsArea #m-library #m-library-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0 0 0;
  margin-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  flex: 0 0 auto;
}
#m-container #m-panelsArea #m-library #m-library-footer #m-upgradeMsgDiv {
  color: #ffb400;
  font-size: 1.2rem;
  font-weight: bold;
  cursor: pointer;
  transition: 0.2s;
  transform-origin: left;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  display: flex;
  align-items: center;
  gap: 6px;
}
#m-container #m-panelsArea #m-library #m-library-footer #m-upgradeMsgDiv:hover {
  transform: scale(1.02);
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea #m-library #m-library-footer #m-upgradeMsgDiv {
    font-size: 1rem;
  }
}
#m-container #m-panelsArea #m-library #m-library-footer .m-loadMixBtnDiv {
  width: 220px;
  margin-left: auto;
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea #m-library #m-library-footer .m-loadMixBtnDiv {
    width: 170px;
  }
}
#m-container #m-panelsArea #m-library #m-library-footer .m-loadMixBtnDiv button {
  width: 100%;
  border-radius: 5px;
  padding: 4px 10px;
  font-size: 1.2rem;
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#m-container #m-panelsArea #m-library #m-library-footer .m-loadMixBtnDiv button:hover {
  background-color: #494D5F;
}
#m-container #m-panelsArea #m-library #m-library-footer .m-loadMixBtnDiv button:hover {
  background-color: #494D5F;
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea #m-library #m-library-footer .m-loadMixBtnDiv button {
    font-size: 1rem;
  }
}
#m-container #m-panelsArea #m-sessions-scrollArea {
  display: none;
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
  padding-right: 5px;
  flex-direction: column;
  gap: 20px;
}
#m-container #m-panelsArea #m-sessions-scrollArea::-webkit-scrollbar {
  width: 6px;
}
#m-container #m-panelsArea #m-sessions-scrollArea::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.02);
  border-radius: 3px;
}
#m-container #m-panelsArea #m-sessions-scrollArea::-webkit-scrollbar-thumb {
  background: rgb(161, 207, 154);
  border-radius: 3px;
}
#m-container #m-panelsArea #m-sessions-scrollArea::-webkit-scrollbar-thumb:hover {
  background: rgb(205, 255, 197);
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions,
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions,
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions {
  flex-shrink: 0;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-grid-section-header {
  display: block;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-sessions-publicSessionsList {
  min-height: 100px;
  width: 100%;
  padding: 10px 0px;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-sessions-publicSessionsList .m-pubSesSplide {
  width: calc(100% + 20px);
  min-height: 80px;
  margin-left: -10px;
  padding: 0 50px;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-sessions-publicSessionsList .m-pubSesSplide .splide__track .splide__list .m-publicSessionListItem {
  padding: 5px 10px;
  padding-top: 8px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.01) 100%), linear-gradient(135deg, rgba(28, 38, 33, 0.75) 0%, rgba(16, 20, 18, 0.85) 100%);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.45), inset 0 0 1px 1px rgba(255, 255, 255, 0.06);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-sessions-publicSessionsList .m-pubSesSplide .splide__track .splide__list .m-publicSessionListItem:hover {
  border: 1px solid rgba(255, 180, 0, 0.5);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.55), 0 0 12px rgba(255, 180, 0, 0.25), inset 0 0 2px 1px rgba(255, 255, 255, 0.12);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.02) 100%), linear-gradient(135deg, rgba(45, 42, 35, 0.85) 0%, rgba(22, 20, 18, 0.95) 100%);
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-sessions-publicSessionsList .m-pubSesSplide .splide__track .splide__list .m-publicSessionListItem {
  height: 90px;
  position: relative;
  cursor: pointer;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-sessions-publicSessionsList .m-pubSesSplide .splide__track .splide__list .m-publicSessionListItem .m-psli-info {
  min-width: 0;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-sessions-publicSessionsList .m-pubSesSplide .splide__track .splide__list .m-publicSessionListItem .m-psli-info .m-psli-song {
  font-size: 1.1rem;
  color: #a8f5a8;
  line-height: 1.15;
  max-height: 2.53rem;
  overflow: hidden;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions .m-sessions-publicSessionsList .m-pubSesSplide .splide__track .splide__list .m-publicSessionListItem .m-psli-info .m-psli-activity {
  margin-top: 7px;
  font-size: 0.9rem;
  color: #DDD;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-grid-section-header {
  display: flex;
  justify-content: space-between;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-grid-section-header .m-sessions-joinSessionBtnDiv {
  position: relative;
  top: -3px;
  flex: 0 0 auto;
  width: 220px;
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-grid-section-header .m-sessions-joinSessionBtnDiv {
    width: 170px;
  }
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-grid-section-header .m-sessions-joinSessionBtnDiv button {
  width: 100%;
  border-radius: 5px;
  padding: 3px 10px;
  font-size: 1.2rem;
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-grid-section-header .m-sessions-joinSessionBtnDiv button:hover {
  background-color: #494D5F;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-grid-section-header .m-sessions-joinSessionBtnDiv button:hover {
  background-color: #494D5F;
}
@media screen and (max-width: 1200px) {
  #m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-grid-section-header .m-sessions-joinSessionBtnDiv button {
    font-size: 1rem;
  }
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList {
  min-height: 100px;
  width: 100%;
  padding: 10px 0px;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide {
  width: calc(100% + 20px);
  min-height: 80px;
  margin-left: -10px;
  padding: 0 50px;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide .splide__track .splide__list .m-joinedSessionListItem {
  padding: 5px 10px;
  padding-top: 8px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.01) 100%), linear-gradient(135deg, rgba(28, 38, 33, 0.75) 0%, rgba(16, 20, 18, 0.85) 100%);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.45), inset 0 0 1px 1px rgba(255, 255, 255, 0.06);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide .splide__track .splide__list .m-joinedSessionListItem:hover {
  border: 1px solid rgba(255, 180, 0, 0.5);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.55), 0 0 12px rgba(255, 180, 0, 0.25), inset 0 0 2px 1px rgba(255, 255, 255, 0.12);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.02) 100%), linear-gradient(135deg, rgba(45, 42, 35, 0.85) 0%, rgba(22, 20, 18, 0.95) 100%);
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide .splide__track .splide__list .m-joinedSessionListItem {
  height: 125px;
  position: relative;
  cursor: pointer;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide .splide__track .splide__list .m-joinedSessionListItem .m-jsli-info {
  min-width: 0;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide .splide__track .splide__list .m-joinedSessionListItem .m-jsli-info .m-jsli-song {
  font-size: 1.1rem;
  color: #a8f5a8;
  line-height: 1.15;
  max-height: 2.53rem;
  overflow: hidden;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide .splide__track .splide__list .m-joinedSessionListItem .m-jsli-info .m-jsli-users {
  margin-top: 7px;
  font-size: 0.9rem;
  color: #DDD;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide .splide__track .splide__list .m-joinedSessionListItem .m-jsli-info .m-jsli-users > span {
  color: #FFF;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-joinedSessions .m-sessions-joinedSessionsList .m-joinSesSplide .splide__track .splide__list .m-joinedSessionListItem .m-jsli-info .m-jsli-date {
  text-align: left;
  margin-top: 5px;
  font-size: 0.9rem;
  color: #DDD;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList {
  min-height: 100px;
  width: 100%;
  padding: 10px 0px;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide {
  width: calc(100% + 20px);
  min-height: 80px;
  margin-left: -10px;
  padding: 0 50px;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem {
  padding: 5px 10px;
  padding-top: 8px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.01) 100%), linear-gradient(135deg, rgba(28, 38, 33, 0.75) 0%, rgba(16, 20, 18, 0.85) 100%);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.45), inset 0 0 1px 1px rgba(255, 255, 255, 0.06);
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem:hover {
  border: 1px solid rgba(255, 180, 0, 0.5);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.55), 0 0 12px rgba(255, 180, 0, 0.25), inset 0 0 2px 1px rgba(255, 255, 255, 0.12);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.02) 100%), linear-gradient(135deg, rgba(45, 42, 35, 0.85) 0%, rgba(22, 20, 18, 0.95) 100%);
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem {
  height: 125px;
  position: relative;
  cursor: pointer;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem .m-usli-info {
  min-width: 0;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem .m-usli-info .m-usli-song {
  font-size: 1.1rem;
  color: #a8f5a8;
  line-height: 1.15;
  max-height: 2.53rem;
  overflow: hidden;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem .m-usli-info .m-usli-users {
  margin-top: 7px;
  font-size: 0.9rem;
  color: #DDD;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem .m-usli-info .m-usli-users > span {
  color: #FFF;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem .m-usli-info .m-usli-date {
  text-align: left;
  margin-top: 5px;
  font-size: 0.9rem;
  color: #DDD;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem .sprite.settingsIcon {
  position: absolute;
  right: 5px;
  bottom: 5px;
  cursor: pointer;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-userSesSplide .splide__track .splide__list .m-userSessionListItem .sprite.settingsIcon:hover {
  transform: scale(1.1);
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-createSessionInstructions {
  padding: 20px 10px 50px 10px;
  max-width: 1000px;
  margin: 0 auto;
  color: #DDD;
  font-size: 1.5rem;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-createSessionInstructions div {
  position: relative;
  display: inline-block;
  width: 35px;
}
#m-container #m-panelsArea #m-sessions-scrollArea #m-sessions-userSessions .m-sessions-userSessionsList .m-createSessionInstructions div div {
  position: absolute;
  top: -25px;
  transform: scale(0.75, 0.75);
}

.xmlImportDialog {
  width: 450px;
}
.xmlImportDialog .dg2-content .xid-instructionsDiv {
  font-size: 1.2rem;
}
.xmlImportDialog .dg2-content .xid-instructionsDiv > a {
  text-decoration: underline;
  color: #cdf8ff;
}
.xmlImportDialog .dg2-content .oneLineBtnDiv {
  width: 100%;
}
.xmlImportDialog .dg2-content .oneLineBtnDiv > button {
  font-size: 1.2rem;
  border-radius: 10px;
  padding: 3px 10px;
  cursor: pointer;
}
.xmlImportDialog .dg2-content .oneLineBtnDiv:not(:first-child) {
  margin-top: 20px;
}
.xmlImportDialog .dg2-content .oneLineBtnDiv > input {
  display: none;
}
.xmlImportDialog .dg2-content .xid-info {
  margin-top: 20px;
  color: #FBB;
  font-size: 1rem;
}
.xmlImportDialog .dg2-content .xid-buttons {
  width: 100%;
  justify-content: center;
}
.xmlImportDialog .dg2-content .xid-buttons div {
  width: 125px;
}
.xmlImportDialog .dg2-content .xid-buttons div:not(:first-child) {
  margin-left: 20px;
}
.xmlImportDialog .dg2-content .xid-buttons div .dg2-button {
  width: 100%;
}
.xmlImportDialog .dg2-content .xid-buttons div > input {
  display: none;
}

.aiSongDialog.dialog2 {
  width: 800px;
  max-height: min(700px, 100dvh - 20px);
}
.aiSongDialog.dialog2.type_standard .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-measures-field, .aiSongDialog.dialog2.type_standard .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-staves-field,
.aiSongDialog.dialog2.type_standard .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-harmony-field, .aiSongDialog.dialog2.type_standard .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-song-form-field {
  display: block;
}
.aiSongDialog.dialog2.type_variable .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-measures-field, .aiSongDialog.dialog2.type_variable .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-sections-field,
.aiSongDialog.dialog2.type_variable .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-chords-field {
  display: block;
}
.aiSongDialog.dialog2.type_loop_pedal .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-base-loop-field, .aiSongDialog.dialog2.type_loop_pedal .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-main-loop-field,
.aiSongDialog.dialog2.type_loop_pedal .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-chords-field, .aiSongDialog.dialog2.type_loop_pedal .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-accomp-field {
  display: block;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section {
  margin-top: 10px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list {
  width: 100%;
  padding-left: 0;
  margin-top: 10px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option {
  display: flex;
  gap: 15px;
  padding: 12px 15px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
  align-items: center;
  margin-bottom: 8px;
  margin-top: 0;
  position: relative;
  padding-left: 15px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option:not(:first-child) {
  margin-top: 10px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.3);
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option input {
  margin: 0;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  cursor: pointer;
  vertical-align: middle;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option .asd-type-text {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option .asd-type-text strong {
  font-size: 1.2rem;
  color: #cdf8ff;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option .asd-type-text span {
  font-size: 0.9rem;
  color: #bbb;
  line-height: 1.3;
  margin-top: 2px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option:has(input:checked) {
  border-color: #cdf8ff;
  background: rgba(255, 255, 255, 0.15);
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-type-list .asd-type-option:has(input:checked) .asd-type-text strong {
  color: #fff;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  width: 100%;
  margin-top: 10px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field {
  display: block;
  flex: 0 0 calc(33.33% - 14px);
  box-sizing: border-box;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-measures-field, .aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-song-form-field, .aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-sections-field, .aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-chords-field, .aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-harmony-field, .aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-staves-field, .aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-base-loop-field, .aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-main-loop-field, .aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field.asd-accomp-field {
  display: none;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-fields-container .asd-field .dg2-field-instructions {
  font-size: 0.9rem;
  opacity: 0.8;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-rhythm-group {
  margin-top: 20px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-rhythm-group .dg2-checkbox {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-left: 0;
  margin-top: 5px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-rhythm-group .dg2-checkbox label {
  margin-right: 15px;
  padding-left: 25px;
  font-size: 1rem;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-rhythm-group .dg2-checkbox label input {
  margin-left: -25px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-instructionsHeader {
  margin-top: 20px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-instructions-text {
  width: 100%;
  font-size: 1rem;
  margin-left: 10px;
  border-radius: 4px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-instructions-text div:not(:first-child) {
  margin-top: 5px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-abc-input-container {
  width: 100%;
  margin-top: 15px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-abc-input-container textarea {
  width: 100%;
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid #666;
  color: #fff;
  padding: 8px;
  border-radius: 4px;
  font-size: 1rem;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-abc-input-container textarea:focus {
  border-color: #cdf8ff;
  outline: none;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-abc-input-container textarea.asd-abc-input {
  height: 200px;
  font-family: monospace;
  font-size: 12px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .asd-info {
  color: #FBB;
  min-height: 1.2em;
  margin-top: 10px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .dg2-buttons-section2 {
  margin-top: 20px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .dg2-buttons-section2 button {
  margin: 0 10px;
  min-width: 120px;
}
.aiSongDialog.dialog2 .dg2-content .dg2-fields-section .dg2-buttons-section2 button:first-child {
  margin-left: 0;
}

.brokenSongDialog {
  width: 550px;
}
.brokenSongDialog .dg2-content .dg2-fields-section {
  margin-top: 15px;
}
.brokenSongDialog .dg2-content .dg2-fields-section .bsd-instructionsDiv {
  font-size: 1.2rem;
  text-align: left;
  padding-right: 10px;
}
.brokenSongDialog .dg2-content .dg2-fields-section .bsd-instructionsDiv:not(:first-child) {
  margin-top: 20px;
}
.brokenSongDialog .dg2-content .bsd-info {
  margin-top: 20px;
  color: #FBB;
  font-size: 1rem;
}
.brokenSongDialog .dg2-content .bsd-buttons {
  width: 100%;
  justify-content: center;
}
.brokenSongDialog .dg2-content .bsd-buttons div {
  width: 160px;
}
.brokenSongDialog .dg2-content .bsd-buttons div:not(:first-child) {
  margin-left: 20px;
}
.brokenSongDialog .dg2-content .bsd-buttons div .dg2-button {
  width: 100%;
}
.brokenSongDialog .dg2-content .bsd-buttons div > input {
  display: none;
}

.lcActivityPanel {
  color: #FFF;
  height: 100%;
  max-height: 100%;
  padding: 10px 8px 8px 8px;
  display: grid;
  grid-template-areas: "upperSection" "lowerSection";
}
.lcActivityPanel.clipsView {
  grid-template-rows: 100% 0px;
}
.lcActivityPanel.clipsView .lcap-upperSection #lcap-clipsTracks {
  display: flex;
}
.lcActivityPanel.chatView {
  grid-template-rows: calc(100% - 40px) 40px;
}
.lcActivityPanel.chatView .lcap-upperSection .lcap-chat-list {
  display: block;
}
.lcActivityPanel.chatView .lcap-lowerSection .lcap-chat-controls {
  display: flex;
}
.lcActivityPanel.chatView.inSession .lcap-upperSection .lcap-sessionInfo {
  display: block;
}
.lcActivityPanel.joinMeetingView {
  grid-template-rows: calc(100% - 41px) 41px;
}
.lcActivityPanel.joinMeetingView .lcap-upperSection .lcap-meetingArea {
  display: flex;
}
.lcActivityPanel.joinMeetingView .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin {
  display: flex;
}
.lcActivityPanel.joinMeetingView .lcap-lowerSection .lcap-meeting-controls {
  display: flex;
}
.lcActivityPanel.inMeetingView {
  grid-template-rows: calc(100% - 41px) 41px;
}
.lcActivityPanel.inMeetingView .lcap-upperSection .lcap-meetingArea {
  display: flex;
}
.lcActivityPanel.inMeetingView .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls {
  display: block;
}
.lcActivityPanel.inMeetingView .lcap-upperSection .lcap-meetingArea .lcap-ma-copyCode {
  display: block;
}
.lcActivityPanel.inMeetingView .lcap-lowerSection .lcap-meeting-controls {
  display: flex;
}
.lcActivityPanel.emptyView {
  grid-template-rows: calc(100% - 41px) 41px;
}
.lcActivityPanel.emptyView .lcap-upperSection .lcap-chat-list {
  display: none;
}
.lcActivityPanel.emptyView .lcap-lowerSection .lcap-chat-controls {
  display: none;
}
.lcActivityPanel.includeClipsNav .lcap-upperSection .lcap-nav .lcap-viewSelect .lcap-vs-clips {
  display: block;
}
.lcActivityPanel.showFS .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn {
  display: block;
}
.lcActivityPanel .lcap-menuPopup {
  display: none;
  position: absolute;
  top: 40px;
  max-height: calc(100dvh - 50px);
  overflow-y: auto;
  overflow-x: hidden;
  right: 0;
  width: 260px;
  padding: 10px;
  background: linear-gradient(to bottom, #333 0%, #222 100%);
  border: 1px solid #000;
  border-radius: 5px;
  box-shadow: 2px 2px 3px #000;
  z-index: 10;
}
.lcActivityPanel .lcap-menuPopup .lcap-sm-item {
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.lcActivityPanel .lcap-menuPopup .lcap-sm-item:not(:first-child) {
  margin-top: 5px;
}
.lcActivityPanel .lcap-menuPopup .lcap-sm-item:hover {
  text-decoration: underline;
}
.lcActivityPanel .lcap-menuPopup .lcap-sm-item.disabled {
  color: #AAA;
  cursor: default;
}
.lcActivityPanel .lcap-menuPopup .lcap-sm-item.disabled:hover {
  text-decoration: none;
}
.lcActivityPanel .lcap-menuPopup .lcap-sm-item.hidden {
  display: none;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-menuPopup .lcap-sm-item {
    font-size: 0.9rem;
  }
  .lcActivityPanel .lcap-menuPopup .lcap-sm-item:not(:first-child) {
    margin-top: 4px;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-menuPopup .lcap-sm-item {
    font-size: 13px;
  }
  .lcActivityPanel .lcap-menuPopup .lcap-sm-item:not(:first-child) {
    margin-top: 4px;
  }
}
.lcActivityPanel .lcap-menuPopup .lcap-sm-divider {
  border-top: 1px solid #AAA;
  width: 100%;
  margin-top: 5px;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-menuPopup {
    width: 210px;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-menuPopup {
    width: 190px;
  }
}
.lcActivityPanel .lcap-upperSection {
  grid-area: upperSection;
  height: 100%;
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
  padding-bottom: 5px;
}
.lcActivityPanel .lcap-upperSection .lcap-nav {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: flex-start;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect {
  flex: 0 0 auto;
  display: flex;
  justify-content: flex-start;
  gap: 15px;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect {
    gap: 10px;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect {
    gap: 5px;
  }
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect .toggle {
  color: #fcbb43;
  padding: 0.5px 2px;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  font-size: 1rem;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect .toggle {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect .toggle {
    font-size: 0.8rem;
  }
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect .toggle.selected {
  border-bottom: 2px solid #ddeeff;
  font-weight: bold;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect .toggle.disabled {
  color: #888;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect .toggle:hover {
  font-weight: bold;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-viewSelect .lcap-vs-clips {
  display: none;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight {
  display: flex;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn {
  display: none;
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn > button {
  outline: none;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn {
  flex: 0 0 auto;
  margin-right: 22px;
  font-weight: bold;
  font-size: 24px;
  transform-origin: right;
  color: #fcbb43;
  position: relative;
  top: -2px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn {
    top: -1px;
    margin-right: 17px;
    font-size: 21px;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-fullscreenBtn {
    top: -1px;
    margin-right: 10px;
    font-size: 19px;
  }
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn {
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn > button {
  outline: none;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn {
  flex: 0 0 auto;
  font-weight: bold;
  font-size: 23px;
  transform-origin: right;
  transform: scaleX(1.4);
  color: #fcbb43;
  position: relative;
  top: -1px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn {
    font-size: 21px;
    transform: scaleX(1.3);
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-nav .lcap-navRight .lcap-menuBtn {
    font-size: 19px;
    transform: scaleX(1.1);
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks {
  display: none;
  height: calc(100% - 25px);
  flex-direction: column;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection {
  grid-area: clipsSection;
  width: 100%;
  height: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation.dynamic #pw-c-a-container #pw-c-a-controls #pw-c-a-next {
  display: block;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation.sequential #pw-c-a-container #pw-c-a-controls #pw-c-a-step {
  display: flex;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container {
  background-color: #000;
  border: 1px solid #888;
  padding: 10px 5px 5px 5px;
  width: 100%;
  position: relative;
  border-radius: 5px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-header {
  position: absolute;
  top: -8px;
  left: 5px;
  background-color: #000;
  color: #a8f5a8;
  font-size: 0.8rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-header {
    font-size: 10px;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 {
  margin-top: 1px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap {
  padding-left: 5px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label {
  font-size: 0.9rem;
  color: #FFF;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label {
    font-size: 11px;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label #pw-c-a-gapCb {
  width: 10px;
  position: relative;
  top: 3px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 {
  margin-top: 5px;
  display: flex;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect {
  width: calc(100% - 39px);
  flex: 1 1 auto;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect:after {
  right: 0.35em;
  top: 0.55em;
  opacity: 0.6;
  border-left-width: 5px;
  border-right-width: 5px;
  border-top: 8px solid #FFF;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
  width: 100%;
  font-size: 0.8rem;
  padding-right: 18px;
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
  background-color: #494D5F;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:focus {
  background-color: #222;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
  background-color: #494D5F;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect {
    width: calc(100% - 30px);
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0.2em;
    background: #efefef;
    border: none;
    border-radius: 3px;
    font-size: 12px;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div {
    position: relative;
    display: inline;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    pointer-events: none;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div:after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    top: 0.5em;
    right: 0.75em;
    border-top: 8px solid black;
    opacity: 0.5;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select::-ms-expand {
    display: none;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    background-color: #222;
    border: 1px solid #CCC;
    color: #FFF;
    text-shadow: 1px 1px 2px #555;
    box-shadow: 1px 1px 2px #000;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
    background-color: #494D5F;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:focus {
    background-color: #222;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    font-size: 10px;
    padding-right: 15px;
    padding-top: 4px;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect:after {
    right: 0.2em;
    top: 0.5em;
    border-left-width: 5px;
    border-right-width: 5px;
    border-top: 8px solid #FFF;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-sort {
  flex: 0 0 auto;
  color: #FFF;
  cursor: pointer;
  margin-left: 5px;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-sort {
    margin-right: -1px;
    margin-left: 4px;
    padding-top: 0px;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips {
  margin-top: 15px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip {
  padding: 5px 5px;
  color: #FFF;
  background: black;
  border-radius: 5px;
  border: 1px solid #999;
  position: relative;
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip:not(:first-child) {
  margin-top: 10px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip:hover {
  border: 1px solid #87b4cb;
  transform: scale(1.02);
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo {
  width: 100%;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipId {
  color: #a8f5a8;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipDescription {
  font-size: 0.9rem;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipDescription {
    font-size: 0.8rem;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipPlays {
  font-size: 0.9rem;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipPlays {
    font-size: 0.8rem;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-reduceInfo {
  display: none;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo {
    font-size: 0.9rem;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-clipDescription, .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-clipPlays {
  display: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-reduceInfo {
  display: block;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.selected {
  border: 2px solid #a0d2eb;
  background: #333;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.selected .pw-c-clip-plus {
  line-height: 1rem;
  opacity: 1;
  padding: 0 3px;
  right: -6px;
  top: -8px;
  background-color: #000;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.notIdeal .pw-c-clipInfo .pw-c-clipId {
  color: #EE0;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus {
  position: absolute;
  right: 0px;
  top: 0;
  border-radius: 50%;
  padding: 0 5px;
  color: #ffb400;
  font-weight: bold;
  font-size: 1.1rem;
  opacity: 0;
  transition: 0.2s;
  cursor: pointer;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus {
    font-size: 1rem;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus:hover {
  transform: scale(1.35);
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip {
    margin-top: 8px;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv {
  margin-top: 10px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov, .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm {
  color: #ffb400;
  font-size: 0.9rem;
  border: 1px solid #888;
  padding: 5px 5px 5px 5px;
  border-radius: 5px;
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov:hover, .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm:hover {
  font-weight: bold;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov.disabled, .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm.disabled {
  color: #999;
  cursor: auto;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov.disabled:hover, .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm.disabled:hover {
  font-weight: normal;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv:has(> #pw-c-addImprov:not([style*="display: none"])) > #pw-c-addRhythm {
  margin-top: 10px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clips {
  padding-top: 5px;
  padding-bottom: 15px;
  padding-right: 8px;
  height: 50%;
  overflow-y: scroll;
  overflow-x: hidden;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-clipsTracksDivider {
  border-top: 1px solid #CCC;
  margin: 5px 0 5px 0;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks {
  min-height: 100%;
  padding: 10px 0px 10px 0px;
  width: calc(135px + 2 * 0px);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks.showLoadMore #pw-t-loadMoreTracks {
  display: block;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks #pw-t-tracksHeader {
  position: relative;
  width: 135px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv {
  color: #FFF;
  font-size: 1.2rem;
  text-align: center;
  width: 100%;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv #pw-t-ensembleScaleInput {
  margin-left: 10px;
  padding: 0 5px;
  width: 45px;
  font-size: 1rem;
  background-color: #000;
  color: #FFF;
  border-color: #000;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv {
    font-size: 0.9rem;
  }
  .lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv #pw-t-ensembleScaleInput {
    font-size: 0.9rem;
  }
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks #pw-t-loadMoreTracks {
  display: none;
  width: 135px;
  margin-top: 10px;
  color: #DDD;
  text-align: center;
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks #pw-t-loadMoreTracks:hover {
  color: #FFF;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track {
  flex: 0 0 auto;
  width: 135px;
  transition: width 0.1s;
  min-height: 55px;
  background: #000;
  border: 1px solid #999;
  position: relative;
  z-index: 2;
  padding: 1px 4px 2px 4px;
  border-radius: 5px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track.mute {
  border: 2px solid rgb(187, 187, 66);
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track.solo {
  border: 2px solid green;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track.isPlaying {
  border: 2px solid red;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track.editMode .pw-t-trackSettings {
  display: block;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track.editFx .pw-t-trackSettings .pw-t-fx {
  display: block;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track.editTime .pw-t-trackSettings .pw-t-timing {
  display: flex;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track.pw-t-busy .pw-t-loader {
  display: block;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track:not(:first-child) {
  margin-top: 10px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackLabel {
  position: relative;
  top: -2px;
  font-size: 11px;
  color: #FFF;
  border-width: 0;
  width: 100%;
  border-radius: 3px;
  padding: 3px 0 1px 0;
  height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial {
  border: 1px solid black;
  width: calc(48px * 0.56);
  height: calc(48px * 0.56);
  border-radius: 50%;
  background: radial-gradient(circle, rgb(2, 0, 36) 50%, #a8f5a8 65%);
  box-shadow: 1px 1px 0px #000;
  cursor: pointer;
  position: relative;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial .dialControl-overlay {
  position: absolute;
  bottom: 0px;
  left: calc(8px * 0.56);
  width: 0;
  height: 0;
  border-left: calc(15px * 0.56) solid transparent;
  border-right: calc(15px * 0.56) solid transparent;
  border-bottom: calc(23px * 0.56) solid #000;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial .dialControl-indicator {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(22px * 0.56);
  height: 1px;
  border: 1px solid #FFF;
  background-color: #ff9500;
  transform-origin: 0 0;
  transform: rotate(120deg);
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-label {
  margin-top: calc(0px * 0.56);
  color: #DDD;
  font-size: calc(0.9rem * 0.56);
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls > div:not(:last-child) {
  margin-right: 5px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay {
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay > button {
  outline: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay {
  flex: 0 0 auto;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackVolume {
  position: relative;
  top: -1px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload {
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload > button {
  outline: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload {
  margin-left: -2px;
  flex: 0 0 auto;
  position: relative;
  bottom: 1px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove {
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove > button {
  outline: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove {
  transform: scale(0.95, 0.95);
  flex: 0 0 auto;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 {
  margin-top: 1px;
  height: 18px;
  border-top: 1px dotted #888;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv {
  flex: 0 0 auto;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  background-color: #222;
  border: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect:focus {
  background-color: #222;
  outline: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  color: #FFF;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect:hover {
  background-color: #494D5F;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  font-size: 10px;
  color: #FFF;
  padding: 1px 0px;
  width: 26px;
  text-align: center;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview {
  display: flex;
  align-items: center;
  width: 26px;
  flex: 0 0 auto;
  text-align: center;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label {
  width: 100%;
  position: relative;
  top: 1px;
  color: #a8f5a8;
  font-size: 11px;
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label:hover {
  color: #ddeeff;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label.disabled {
  color: #999;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv {
  flex: 0 0 auto;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  background-color: #222;
  border: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect:focus {
  background-color: #222;
  outline: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  color: #FFF;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect:hover {
  background-color: #494D5F;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  font-size: 10px;
  color: #FFF;
  padding: 1px 0px 1px 0;
  width: 26px;
  text-align: center;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink {
  width: 26px;
  flex: 0 0 auto;
  color: #FFF;
  position: relative;
  top: 1px;
  cursor: pointer;
  font-size: 11px;
  text-align: center;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink:hover {
  color: #ddeeff;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink.disabled {
  color: #999;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings {
  display: none;
  margin-top: 0px;
  border-top: 1px solid #555;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx {
  display: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  background-color: #222;
  border: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect:focus {
  background-color: #222;
  outline: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  color: #FFF;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect:hover {
  background-color: #494D5F;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  font-size: 10px;
  color: #FFF;
  width: 100%;
  text-align: left;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem {
  position: relative;
  padding-top: 7px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem:not(:first-child) {
  margin-top: 5px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-name {
  position: absolute;
  top: 0;
  left: 5px;
  background-color: #000;
  color: #a8f5a8;
  font-size: 11px;
  font-family: "Montserrat", sans-serif;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-remove {
  position: absolute;
  top: 0;
  right: 5px;
  background-color: #000;
  color: #F00;
  font-size: 11px;
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-remove:hover {
  transform: scale(1.2);
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-content {
  border: 1px dotted #888;
  padding: 10px 5px 5px 5px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-labelDiv {
  color: #FFF;
  font-size: 11px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv {
  position: relative;
  top: -1px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  background-color: #222;
  border: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select:focus {
  background-color: #222;
  outline: none;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  color: #FFF;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select:hover {
  background-color: #494D5F;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  font-size: 11px;
  color: #FFF;
  padding: 1px 2px;
  width: 50px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing {
  margin-top: 6px;
  display: flex;
  display: none;
  align-items: center;
  justify-content: space-between;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingDescription {
  font-size: 12px;
  line-height: 12px;
  color: #DDD;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv {
  flex: 0 0 auto;
  margin-left: 5px;
  width: 50px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv input {
  border-radius: 3px;
  width: 100%;
  padding: 1px 1px 1px 3px;
  font-size: 12px;
  position: relative;
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv .pw-t-timing-newDefault {
  width: 100%;
  font-size: 11px;
  margin-top: 1px;
  color: #FFF;
  text-align: center;
  text-decoration: underline;
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-loader {
  position: absolute;
  left: 50%;
  top: 10px;
  transform: translateX(-50%);
  display: none;
  z-index: 1;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks #pw-tracks .pw-t-track .pw-t-loader .ani-loader {
  border: 4px solid #f3f3f3;
  border-radius: 50%;
  border-top: 4px solid rgb(205, 206, 207);
  border-bottom: 4px solid rgb(205, 206, 207);
  width: 35px;
  height: 35px;
}
.lcActivityPanel .lcap-upperSection #lcap-clipsTracks #lcap-tracks {
  height: 50%;
  overflow-y: scroll;
}
.lcActivityPanel .lcap-upperSection .lcap-sessionInfo {
  display: none;
  margin-top: 5px;
  border-bottom: 1px solid #CCC;
}
.lcActivityPanel .lcap-upperSection .lcap-sessionInfo .lcap-si-sessionId {
  text-align: left;
  font-size: 1rem;
  color: #a8f5a8;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-sessionInfo .lcap-si-sessionId {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-sessionInfo .lcap-si-sessionId {
    font-size: 0.8rem;
  }
}
.lcActivityPanel .lcap-upperSection .lcap-chat-list {
  margin-top: 5px;
  padding: 0 0 5px 0;
  overflow-y: auto;
  display: none;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-chat-list {
    height: calc(100% - 35px);
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-chat-list {
    height: calc(100% - 30px);
  }
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea {
  width: 100%;
  height: 100%;
  display: flex;
  display: none;
  flex-direction: column;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin {
  width: 100%;
  height: 100%;
  display: flex;
  display: none;
  flex-direction: column;
  justify-content: center;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room {
  width: 100%;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomInput {
  width: 100%;
  font-size: 1rem;
  padding: 1px 3px;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomInput {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomInput {
    font-size: 0.8rem;
  }
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons {
  margin-top: 3px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons .lcap-ma-joinBtn, .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons .lcap-ma-newRoomBtn {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: #fcbb43;
  cursor: pointer;
  font-size: 1rem;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons .lcap-ma-joinBtn, .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons .lcap-ma-newRoomBtn {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons .lcap-ma-joinBtn, .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons .lcap-ma-newRoomBtn {
    font-size: 0.8rem;
  }
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons .lcap-ma-joinBtn:hover, .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-roomButtons .lcap-ma-newRoomBtn:hover {
  text-decoration: underline;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-instructions {
  margin-top: 10px;
  font-size: 1rem;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-instructions {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-createJoin .lcap-ma-room .lcap-ma-instructions {
    font-size: 0.8rem;
  }
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-copyCode {
  margin-top: 5px;
  display: none;
  flex: 0 0 auto;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: #fcbb43;
  cursor: pointer;
  text-align: center;
  font-size: 1rem;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-copyCode {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-copyCode {
    font-size: 0.8rem;
  }
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls {
  display: none;
  width: 100%;
  flex: 1 1 auto;
  padding: 5px 0 5px 0;
  overflow: hidden;
  position: relative;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls.expand {
  position: fixed;
  width: 100dvw;
  height: 100dvh;
  top: 0;
  left: 0;
  background-color: #000;
  z-index: 100;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls.expand .lcap-ma-iframeDiv {
  margin: 0;
  padding: 0 0 40px 0;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls.expand .lcap-ma-controls2 {
  display: flex;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-iframeDiv {
  width: 100%;
  height: 100%;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-iframeDiv iframe {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: none;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 {
  width: 150px;
  position: absolute;
  bottom: 10px;
  left: calc(50% - 75px);
  display: flex;
  justify-content: space-between;
  display: none;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-meetingBtn2 {
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-meetingBtn2:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-meetingBtn2:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-meetingBtn2 > button {
  outline: none;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-meetingBtn2.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-meetingBtn2.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-meetingBtn2.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-meetingBtn2 {
  flex: 0 0 auto;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-expandBtn2 {
  cursor: pointer;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-expandBtn2:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-expandBtn2:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-expandBtn2 > button {
  outline: none;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-expandBtn2.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-expandBtn2.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-expandBtn2.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-upperSection .lcap-meetingArea .lcap-ma-iframeAndControls .lcap-ma-controls2 .lcap-ma-expandBtn2 {
  flex: 0 0 auto;
}
.lcActivityPanel .lcap-lowerSection {
  grid-area: lowerSection;
  width: 100%;
  height: 100%;
  position: relative;
}
.lcActivityPanel .lcap-lowerSection .lcap-chat-controls {
  width: 100%;
  display: flex;
  display: none;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-textDiv {
  flex: 1 1 auto;
}
.lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-textDiv textarea {
  width: 100%;
  height: 40px;
  resize: none;
  padding: 2px 5px;
  overflow: hidden;
  background-color: #000;
  color: #DDD;
}
.lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-textDiv textarea:disabled::-moz-placeholder {
  color: rgba(0, 0, 0, 0);
}
.lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-textDiv textarea:disabled::placeholder {
  color: rgba(0, 0, 0, 0);
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-textDiv textarea {
    font-size: 0.8rem;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-textDiv textarea {
    font-size: 0.7rem;
  }
}
.lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-sendBtnDiv {
  flex: 0 0 auto;
  margin-left: 10px;
  position: relative;
  top: -3px;
}
.lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-sendBtnDiv button {
  font-size: 1.2rem;
  padding: 8px 7px;
}
@media screen and (max-width: 1500px) {
  .lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-sendBtnDiv {
    margin-left: 8px;
  }
  .lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-sendBtnDiv button {
    font-size: 1rem;
    padding: 10px 7px;
  }
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-lowerSection .lcap-chat-controls .lcap-chat-sendBtnDiv {
    margin-left: 6px;
  }
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls {
  padding-top: 7px;
  border-top: 1px solid #CCC;
  display: flex;
  display: none;
  width: 100%;
  justify-content: space-around;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-meetingBtn {
  cursor: pointer;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-meetingBtn:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-meetingBtn:active {
  opacity: 1;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-meetingBtn > button {
  outline: none;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-meetingBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-meetingBtn.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-meetingBtn.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-meetingBtn {
  flex: 0 0 auto;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-expandBtn {
  cursor: pointer;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-expandBtn:hover {
  opacity: 0.9;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-expandBtn:active {
  opacity: 1;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-expandBtn > button {
  outline: none;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-expandBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-expandBtn.disabled:hover {
  opacity: 1;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-expandBtn.disabled:active {
  opacity: 1;
}
.lcActivityPanel .lcap-lowerSection .lcap-meeting-controls #lcap-mc-expandBtn {
  flex: 0 0 auto;
}
@media screen and (max-width: 1300px) {
  .lcActivityPanel .lcap-lowerSection .lcap-meeting-controls .sprite {
    transform: scale(0.85, 0.85);
  }
}

.lcap-chat-listItem {
  font-size: 0.9rem;
  position: relative;
}
.lcap-chat-listItem .lcap-cli-username {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: #a8f5a8;
}
.lcap-chat-listItem .lcap-cli-message.highlight {
  font-style: italic;
  font-weight: bold;
  color: #fcbb43;
}
.lcap-chat-listItem .lcap-cli-remove {
  display: none;
  position: absolute;
  right: 0;
  top: -2px;
  transform: scale(0.7, 0.7);
  cursor: pointer;
}
@media screen and (max-width: 1300px) {
  .lcap-chat-listItem .lcap-cli-remove {
    top: -3px;
    transform: scale(0.5, 0.5);
  }
}
.lcap-chat-listItem:not(:first-child) {
  margin-top: 4px;
}
.lcap-chat-listItem.modControls:hover .lcap-cli-remove {
  display: block;
}
@media screen and (max-width: 1300px) {
  .lcap-chat-listItem {
    font-size: 12px;
  }
}

#lcAppContainer.miniPanelClips .lcMiniPanel .lcmp-upperSection {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-around;
  align-items: center;
}
#lcAppContainer.miniPanelClips .lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn {
  top: 1px;
  left: 0;
}
#lcAppContainer.miniPanelClips .lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn {
  line-height: 35px;
  position: relative;
  top: 2px;
}
#lcAppContainer.miniPanelClips .lcMiniPanel .lcmp-upperSection #lcmp-ui-membership {
  width: 34px;
  height: 34px;
}
#lcAppContainer.miniPanelClips .lcMiniPanel #lcmp-clipsTracks {
  display: flex;
}

.lcMiniPanel {
  color: #FFF;
  height: 100%;
  padding: 10px 8px 8px 8px;
  display: grid;
  grid-template-rows: max-content calc(100% - 34px);
}
.lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn {
  cursor: pointer;
}
.lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn:hover {
  opacity: 0.9;
}
.lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn:active {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn > button {
  outline: none;
}
.lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn.disabled:hover {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn.disabled:active {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-mc-menuBtn {
  flex: 0 0 auto;
  font-size: 32px;
  line-height: 32px;
  transform-origin: right;
  color: #fcbb43;
  position: relative;
  left: 2px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn {
  cursor: pointer;
}
.lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn:hover {
  opacity: 0.9;
}
.lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn:active {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn > button {
  outline: none;
}
.lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn.disabled:hover {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn.disabled:active {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-fullscreenBtn {
  flex: 0 0 auto;
  font-size: 39px;
  color: #fcbb43;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.lcMiniPanel .lcmp-upperSection .lcmp-menuPopup {
  display: none;
  z-index: 10;
  position: absolute;
  top: 45px;
  right: 0;
  max-height: calc(100dvh - 55px);
  overflow-y: auto;
  overflow-x: hidden;
  width: 260px;
  padding: 10px;
  background: linear-gradient(to bottom, #333 0%, #222 100%);
  border: 1px solid #000;
  border-radius: 5px;
  box-shadow: 2px 2px 3px #000;
}
.lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item {
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item:not(:first-child) {
  margin-top: 5px;
}
.lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item:hover {
  text-decoration: underline;
}
.lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item.disabled {
  color: #AAA;
  cursor: default;
}
.lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item.disabled:hover {
  text-decoration: none;
}
.lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item.hidden {
  display: none;
}
@media screen and (max-width: 1500px) {
  .lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item {
    font-size: 0.9rem;
  }
  .lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item:not(:first-child) {
    margin-top: 4px;
  }
}
@media screen and (max-width: 1300px) {
  .lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item {
    font-size: 13px;
  }
  .lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcmp-sm-item:not(:first-child) {
    margin-top: 4px;
  }
}
.lcMiniPanel .lcmp-upperSection .lcmp-menuPopup .lcap-sm-divider {
  border-top: 1px solid #AAA;
  width: 100%;
  margin-top: 5px;
}
@media screen and (max-width: 1500px) {
  .lcMiniPanel .lcmp-upperSection .lcmp-menuPopup {
    width: 210px;
  }
}
@media screen and (max-width: 1300px) {
  .lcMiniPanel .lcmp-upperSection .lcmp-menuPopup {
    width: 190px;
  }
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership {
  cursor: pointer;
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership:hover {
  opacity: 0.9;
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership:active {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership > button {
  outline: none;
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership.disabled:hover {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership.disabled:active {
  opacity: 1;
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership {
  width: 100%;
  border: 1px solid #fcbb43;
  border-radius: 50%;
  padding: 5px 2px;
  text-align: center;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  color: #fcbb43;
  font-size: 1rem;
  cursor: pointer;
}
.lcMiniPanel .lcmp-upperSection #lcmp-ui-membership:hover {
  font-weight: bold;
}
.lcMiniPanel #lcmp-clipsTracks {
  padding-top: 10px;
  display: none;
  height: 100%;
  flex-direction: column;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection {
  grid-area: clipsSection;
  width: 100%;
  height: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation.dynamic #pw-c-a-container #pw-c-a-controls #pw-c-a-next {
  display: block;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation.sequential #pw-c-a-container #pw-c-a-controls #pw-c-a-step {
  display: flex;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container {
  background-color: #000;
  border: 1px solid #888;
  padding: 10px 5px 5px 5px;
  width: 100%;
  position: relative;
  border-radius: 5px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-header {
  position: absolute;
  top: -8px;
  left: 5px;
  background-color: #000;
  color: #a8f5a8;
  font-size: 0.8rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-header {
    font-size: 10px;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 {
  margin-top: 1px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap {
  padding-left: 5px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label {
  font-size: 0.9rem;
  color: #FFF;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label {
    font-size: 11px;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label #pw-c-a-gapCb {
  width: 10px;
  position: relative;
  top: 3px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 {
  margin-top: 5px;
  display: flex;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect {
  width: calc(100% - 39px);
  flex: 1 1 auto;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect:after {
  right: 0.35em;
  top: 0.55em;
  opacity: 0.6;
  border-left-width: 5px;
  border-right-width: 5px;
  border-top: 8px solid #FFF;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
  width: 100%;
  font-size: 0.8rem;
  padding-right: 18px;
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
  background-color: #494D5F;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:focus {
  background-color: #222;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
  background-color: #494D5F;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect {
    width: calc(100% - 30px);
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0.2em;
    background: #efefef;
    border: none;
    border-radius: 3px;
    font-size: 12px;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div {
    position: relative;
    display: inline;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    pointer-events: none;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div:after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    top: 0.5em;
    right: 0.75em;
    border-top: 8px solid black;
    opacity: 0.5;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select::-ms-expand {
    display: none;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    background-color: #222;
    border: 1px solid #CCC;
    color: #FFF;
    text-shadow: 1px 1px 2px #555;
    box-shadow: 1px 1px 2px #000;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
    background-color: #494D5F;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:focus {
    background-color: #222;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    font-size: 10px;
    padding-right: 15px;
    padding-top: 4px;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect:after {
    right: 0.2em;
    top: 0.5em;
    border-left-width: 5px;
    border-right-width: 5px;
    border-top: 8px solid #FFF;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-sort {
  flex: 0 0 auto;
  color: #FFF;
  cursor: pointer;
  margin-left: 5px;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-sort {
    margin-right: -1px;
    margin-left: 4px;
    padding-top: 0px;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips {
  margin-top: 15px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip {
  padding: 5px 5px;
  color: #FFF;
  background: black;
  border-radius: 5px;
  border: 1px solid #999;
  position: relative;
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip:not(:first-child) {
  margin-top: 10px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip:hover {
  border: 1px solid #87b4cb;
  transform: scale(1.02);
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo {
  width: 100%;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipId {
  color: #a8f5a8;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipDescription {
  font-size: 0.9rem;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipDescription {
    font-size: 0.8rem;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipPlays {
  font-size: 0.9rem;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipPlays {
    font-size: 0.8rem;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-reduceInfo {
  display: none;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo {
    font-size: 0.9rem;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-clipDescription, .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-clipPlays {
  display: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-reduceInfo {
  display: block;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.selected {
  border: 2px solid #a0d2eb;
  background: #333;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.selected .pw-c-clip-plus {
  line-height: 1rem;
  opacity: 1;
  padding: 0 3px;
  right: -6px;
  top: -8px;
  background-color: #000;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.notIdeal .pw-c-clipInfo .pw-c-clipId {
  color: #EE0;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus {
  position: absolute;
  right: 0px;
  top: 0;
  border-radius: 50%;
  padding: 0 5px;
  color: #ffb400;
  font-weight: bold;
  font-size: 1.1rem;
  opacity: 0;
  transition: 0.2s;
  cursor: pointer;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus {
    font-size: 1rem;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus:hover {
  transform: scale(1.35);
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip {
    margin-top: 8px;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv {
  margin-top: 10px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov, .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm {
  color: #ffb400;
  font-size: 0.9rem;
  border: 1px solid #888;
  padding: 5px 5px 5px 5px;
  border-radius: 5px;
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov:hover, .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm:hover {
  font-weight: bold;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov.disabled, .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm.disabled {
  color: #999;
  cursor: auto;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov.disabled:hover, .lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm.disabled:hover {
  font-weight: normal;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv:has(> #pw-c-addImprov:not([style*="display: none"])) > #pw-c-addRhythm {
  margin-top: 10px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clips {
  padding-top: 5px;
  padding-bottom: 15px;
  padding-right: 8px;
  height: calc(50% - 10px);
  overflow-y: scroll;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-clipsTracksDivider {
  border-top: 1px solid #CCC;
  margin: 5px 0 5px 0;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks {
  min-height: 100%;
  padding: 10px 0px 10px 0px;
  width: calc(135px + 2 * 0px);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks.showLoadMore #pw-t-loadMoreTracks {
  display: block;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks #pw-t-tracksHeader {
  position: relative;
  width: 135px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv {
  color: #FFF;
  font-size: 1.2rem;
  text-align: center;
  width: 100%;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv #pw-t-ensembleScaleInput {
  margin-left: 10px;
  padding: 0 5px;
  width: 45px;
  font-size: 1rem;
  background-color: #000;
  color: #FFF;
  border-color: #000;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv {
    font-size: 0.9rem;
  }
  .lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv #pw-t-ensembleScaleInput {
    font-size: 0.9rem;
  }
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks #pw-t-loadMoreTracks {
  display: none;
  width: 135px;
  margin-top: 10px;
  color: #DDD;
  text-align: center;
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks #pw-t-loadMoreTracks:hover {
  color: #FFF;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track {
  flex: 0 0 auto;
  width: 135px;
  transition: width 0.1s;
  min-height: 55px;
  background: #000;
  border: 1px solid #999;
  position: relative;
  z-index: 2;
  padding: 1px 4px 2px 4px;
  border-radius: 5px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track.mute {
  border: 2px solid rgb(187, 187, 66);
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track.solo {
  border: 2px solid green;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track.isPlaying {
  border: 2px solid red;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track.editMode .pw-t-trackSettings {
  display: block;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track.editFx .pw-t-trackSettings .pw-t-fx {
  display: block;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track.editTime .pw-t-trackSettings .pw-t-timing {
  display: flex;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track.pw-t-busy .pw-t-loader {
  display: block;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track:not(:first-child) {
  margin-top: 10px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackLabel {
  position: relative;
  top: -2px;
  font-size: 11px;
  color: #FFF;
  border-width: 0;
  width: 100%;
  border-radius: 3px;
  padding: 3px 0 1px 0;
  height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial {
  border: 1px solid black;
  width: calc(48px * 0.56);
  height: calc(48px * 0.56);
  border-radius: 50%;
  background: radial-gradient(circle, rgb(2, 0, 36) 50%, #a8f5a8 65%);
  box-shadow: 1px 1px 0px #000;
  cursor: pointer;
  position: relative;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial .dialControl-overlay {
  position: absolute;
  bottom: 0px;
  left: calc(8px * 0.56);
  width: 0;
  height: 0;
  border-left: calc(15px * 0.56) solid transparent;
  border-right: calc(15px * 0.56) solid transparent;
  border-bottom: calc(23px * 0.56) solid #000;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial .dialControl-indicator {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(22px * 0.56);
  height: 1px;
  border: 1px solid #FFF;
  background-color: #ff9500;
  transform-origin: 0 0;
  transform: rotate(120deg);
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-label {
  margin-top: calc(0px * 0.56);
  color: #DDD;
  font-size: calc(0.9rem * 0.56);
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls > div:not(:last-child) {
  margin-right: 5px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay {
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay:hover {
  opacity: 0.9;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay:active {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay > button {
  outline: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled:hover {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled:active {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay {
  flex: 0 0 auto;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackVolume {
  position: relative;
  top: -1px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload {
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload:hover {
  opacity: 0.9;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload:active {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload > button {
  outline: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled:hover {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled:active {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload {
  margin-left: -2px;
  flex: 0 0 auto;
  position: relative;
  bottom: 1px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove {
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove:hover {
  opacity: 0.9;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove:active {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove > button {
  outline: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled {
  filter: grayscale(100%);
  cursor: default;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled:hover {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled:active {
  opacity: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove {
  transform: scale(0.95, 0.95);
  flex: 0 0 auto;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 {
  margin-top: 1px;
  height: 18px;
  border-top: 1px dotted #888;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv {
  flex: 0 0 auto;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  background-color: #222;
  border: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect:focus {
  background-color: #222;
  outline: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  color: #FFF;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect:hover {
  background-color: #494D5F;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  font-size: 10px;
  color: #FFF;
  padding: 1px 0px;
  width: 26px;
  text-align: center;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview {
  display: flex;
  align-items: center;
  width: 26px;
  flex: 0 0 auto;
  text-align: center;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label {
  width: 100%;
  position: relative;
  top: 1px;
  color: #a8f5a8;
  font-size: 11px;
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label:hover {
  color: #ddeeff;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label.disabled {
  color: #999;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv {
  flex: 0 0 auto;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  background-color: #222;
  border: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect:focus {
  background-color: #222;
  outline: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  color: #FFF;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect:hover {
  background-color: #494D5F;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  font-size: 10px;
  color: #FFF;
  padding: 1px 0px 1px 0;
  width: 26px;
  text-align: center;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink {
  width: 26px;
  flex: 0 0 auto;
  color: #FFF;
  position: relative;
  top: 1px;
  cursor: pointer;
  font-size: 11px;
  text-align: center;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink:hover {
  color: #ddeeff;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink.disabled {
  color: #999;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings {
  display: none;
  margin-top: 0px;
  border-top: 1px solid #555;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx {
  display: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  background-color: #222;
  border: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect:focus {
  background-color: #222;
  outline: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  color: #FFF;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect:hover {
  background-color: #494D5F;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  font-size: 10px;
  color: #FFF;
  width: 100%;
  text-align: left;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem {
  position: relative;
  padding-top: 7px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem:not(:first-child) {
  margin-top: 5px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-name {
  position: absolute;
  top: 0;
  left: 5px;
  background-color: #000;
  color: #a8f5a8;
  font-size: 11px;
  font-family: "Montserrat", sans-serif;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-remove {
  position: absolute;
  top: 0;
  right: 5px;
  background-color: #000;
  color: #F00;
  font-size: 11px;
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-remove:hover {
  transform: scale(1.2);
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-content {
  border: 1px dotted #888;
  padding: 10px 5px 5px 5px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-labelDiv {
  color: #FFF;
  font-size: 11px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv {
  position: relative;
  top: -1px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  background-color: #222;
  border: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select:focus {
  background-color: #222;
  outline: none;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  color: #FFF;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select:hover {
  background-color: #494D5F;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  font-size: 11px;
  color: #FFF;
  padding: 1px 2px;
  width: 50px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing {
  margin-top: 6px;
  display: flex;
  display: none;
  align-items: center;
  justify-content: space-between;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingDescription {
  font-size: 12px;
  line-height: 12px;
  color: #DDD;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv {
  flex: 0 0 auto;
  margin-left: 5px;
  width: 50px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv input {
  border-radius: 3px;
  width: 100%;
  padding: 1px 1px 1px 3px;
  font-size: 12px;
  position: relative;
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv .pw-t-timing-newDefault {
  width: 100%;
  font-size: 11px;
  margin-top: 1px;
  color: #FFF;
  text-align: center;
  text-decoration: underline;
  cursor: pointer;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-loader {
  position: absolute;
  left: 50%;
  top: 10px;
  transform: translateX(-50%);
  display: none;
  z-index: 1;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks #pw-tracks .pw-t-track .pw-t-loader .ani-loader {
  border: 4px solid #f3f3f3;
  border-radius: 50%;
  border-top: 4px solid rgb(205, 206, 207);
  border-bottom: 4px solid rgb(205, 206, 207);
  width: 35px;
  height: 35px;
}
.lcMiniPanel #lcmp-clipsTracks #lcmp-tracks {
  height: 50%;
  overflow-y: scroll;
}

.create-session-dialog {
  width: 650px;
}
.create-session-dialog.page1View .dg2-content .dg2-header.finished {
  display: none;
}
.create-session-dialog.page1View .dg2-content .page1 {
  display: block;
}
.create-session-dialog.page2View .dg2-content .dg2-header.creation {
  display: none;
}
.create-session-dialog.page2View .dg2-content .page2 {
  display: block;
}
.create-session-dialog.owner .dg2-content .page1 .csd-visibilityRbtnDiv .csd-privateRbtnLabel .descriptionForUsers {
  display: none;
}
.create-session-dialog.owner .dg2-content .page1 .csd-visibilityRbtnDiv .csd-privateRbtnLabel .descriptionForOwners {
  display: inline;
}
.create-session-dialog.student .dg2-content .page1 .csd-visibilityRbtnDiv .csd-shareWithTeacher {
  display: block;
}
.create-session-dialog .dg2-content .csd-fieldInstructionsDiv {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.create-session-dialog .dg2-content select {
  font-size: 1.2rem;
}
.create-session-dialog .dg2-content .page1 {
  display: none;
  margin-top: 10px;
}
.create-session-dialog .dg2-content .page1 .csd-visibilityRbtnDiv label {
  cursor: pointer;
}
.create-session-dialog .dg2-content .page1 .csd-visibilityRbtnDiv label .visName {
  color: #cdf8ff;
}
.create-session-dialog .dg2-content .page1 .csd-visibilityRbtnDiv label > input {
  cursor: pointer;
  margin-right: 6px;
}
.create-session-dialog .dg2-content .page1 .csd-visibilityRbtnDiv label .select-div {
  margin-left: 10px;
}
.create-session-dialog .dg2-content .page1 .csd-visibilityRbtnDiv label .select-div select {
  font-size: 1.1rem;
  min-width: 200px;
}
.create-session-dialog .dg2-content .page1 .csd-visibilityRbtnDiv label .descriptionForOwners {
  display: none;
}
.create-session-dialog .dg2-content .page1 .csd-visibilityRbtnDiv .csd-shareWithTeacher {
  display: none;
  padding-left: 30px;
  margin-top: 10px;
}
.create-session-dialog .dg2-content .page1 .csd-visibilityRbtnDiv .csd-publicRbtnLabel {
  margin-top: 20px;
}
.create-session-dialog .dg2-content .page1 .csd-lessonDiv {
  margin-top: 30px;
  width: 100%;
  text-align: left;
  padding-left: 10px;
  font-size: 1.2rem;
}
.create-session-dialog .dg2-content .page2 {
  display: none;
  margin-top: 10px;
}
.create-session-dialog .dg2-content .page2 .csd-fieldInstructionsDiv {
  font-size: 1.2rem;
}
.create-session-dialog .dg2-content .page2 .csd-code {
  margin-top: 20px;
  font-size: 1.5rem;
  color: #cdf8ff;
}
.create-session-dialog .dg2-content .csd-message {
  display: none;
  font-size: 1.2rem;
  color: #FFFF00;
  margin-top: 25px;
}
.create-session-dialog .dg2-content .csd-buttons {
  margin-top: 30px;
}
.create-session-dialog .dg2-content .csd-buttons button {
  margin: 0 15px;
  width: 100px;
}
.create-session-dialog .dg2-content .csd-buttons .csd-nextBtn {
  display: none;
}
.create-session-dialog .dg2-content .csd-buttons .csd-createBtn {
  display: none;
}
.create-session-dialog .dg2-content .csd-buttons .csd-cancelBtn {
  display: none;
}
.create-session-dialog .dg2-content .csd-buttons .csd-returnBtn {
  display: none;
}

.edit-session-dialog {
  width: 400px;
}
.edit-session-dialog.editUsers {
  width: 650px;
}
.edit-session-dialog.editUsers .dg2-content .dg2-fields-section .esd-details {
  text-align: left;
}
.edit-session-dialog.editUsers .dg2-content .dg2-fields-section .esd-usersInstructions {
  display: block;
}
.edit-session-dialog.editUsers .dg2-content .dg2-fields-section .esd-usersDiv {
  display: flex;
}
.edit-session-dialog.editUsers .dg2-content .esd-buttons .esd-saveBtn {
  display: inline-block;
}
.edit-session-dialog .dg2-content .dg2-fields-section {
  margin-top: 10px;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-details {
  font-size: 1.2rem;
  width: 100%;
  text-align: center;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-details .code {
  cursor: pointer;
  font-weight: bold;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-usersInstructions {
  display: none;
  margin-top: 10px;
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-usersDiv {
  margin-top: 10px;
  display: flex;
  display: none;
  width: 100%;
  justify-content: center;
  align-items: center;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-usersDiv select {
  font-size: 1.2rem;
  width: 100%;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-usersDiv .esd-communityUsersDiv {
  flex: 1 0 auto;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-usersDiv .esd-controlsDiv {
  margin-left: 20px;
  flex: 0 0 auto;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-usersDiv .esd-controlsDiv .dg2-button {
  width: 130px;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-usersDiv .esd-controlsDiv div:not(:first-child) {
  margin-top: 30px;
}
.edit-session-dialog .dg2-content .dg2-fields-section .esd-usersDiv .esd-sessionUsersDiv {
  margin-left: 20px;
  flex: 1 0 auto;
}
.edit-session-dialog .dg2-content .esd-message {
  display: none;
  font-size: 1.2rem;
  color: #FFFF00;
  margin-top: 25px;
}
.edit-session-dialog .dg2-content .esd-buttons {
  margin-top: 30px;
  justify-content: center;
}
.edit-session-dialog .dg2-content .esd-buttons button {
  margin: 0 15px;
  width: 100px;
}
.edit-session-dialog .dg2-content .esd-buttons .esd-saveBtn {
  display: none;
}

.join-session-dialog {
  width: 450px;
}
.join-session-dialog .dg2-content .jsd-fieldInstructionsDiv {
  text-align: left;
  font-size: 1.2rem;
  margin-bottom: 5px;
}
.join-session-dialog .dg2-content .dg2-fields-section {
  margin-top: 10px;
}
.join-session-dialog .dg2-content .jsd-info {
  margin-top: 20px;
  font-size: 1.2rem;
  color: #cdf8ff;
  text-align: center;
}
.join-session-dialog .dg2-content .jsd-buttons {
  width: 210px;
}
.join-session-dialog .dg2-content .jsd-buttons .dg2-button {
  width: 90px;
}

#pw-container {
  width: 100%;
  height: 100%;
  padding: 0 0 0 0;
  display: grid;
  overflow: hidden;
}
#pw-container.clipTip #pw-ip-infoBar #pw-ip-clipTip {
  display: block;
}
#pw-container.beats #pw-ip-infoBar #pw-ip-beatsDiv {
  display: flex;
}
#pw-container {
  grid-template-rows: max-content minmax(75px, 4fr) max-content minmax(180px, 3fr);
}
#pw-container.infoPanelHide {
  grid-template-rows: max-content 5fr 0px 3fr;
}
#pw-container.infoPanelHide #pw-s-infoPanel, #pw-container.infoPanelHide #pw-s-infoControls {
  display: none;
}
#pw-container.infoPanelMinimal {
  grid-template-rows: max-content minmax(200px, 5fr) max-content minmax(50px, 3fr);
}
#pw-container.infoPanelMinimal #pw-s-infoPanel {
  display: none;
}
#pw-container {
  grid-template-columns: 228px 150px minmax(0, calc(100% - 228px - 150px - (135px + 2 * 10px + 10px))) calc(135px + 2 * 10px + 10px);
}
@media screen and (max-width: 1500px), (max-height: 600px) {
  #pw-container {
    grid-template-columns: 170px 125px minmax(0, calc(100% - 170px - 125px - (135px + 2 * 10px + 10px))) calc(135px + 2 * 10px + 10px);
  }
}
#pw-container {
  grid-template-areas: "notationControls clipsContainer infoBar tracksContainer" "notationControls clipsContainer stage tracksContainer" "notationControls clipsContainer infoControls tracksContainer" "notationControls clipsContainer infoPanel tracksContainer";
}
#pw-container.infoPanelHide, #pw-container.infoPanelMinimal {
  grid-template-areas: "notationControls clipsContainer infoBar tracksContainer" "notationControls clipsContainer stage tracksContainer" "notationControls clipsContainer infoControls tracksContainer" "notationControls clipsContainer performanceVideos tracksContainer";
}
#pw-container.hideClipsTracks {
  grid-template-columns: 170px minmax(0, calc(100% - 170px));
}
#pw-container.hideClipsTracks #pw-tracksContainer, #pw-container.hideClipsTracks #pw-clipsContainer {
  display: none;
}
#pw-container.hideClipsTracks {
  grid-template-areas: "notationControls infoBar" "notationControls stage" "notationControls infoControls" "notationControls infoPanel";
}
#pw-container.hideClipsTracks.infoPanelHide, #pw-container.hideClipsTracks.infoPanelMinimal {
  grid-template-areas: "notationControls infoBar" "notationControls stage" "notationControls infoControls" "notationControls performanceVideos";
}
#pw-container.showFS #pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn {
  display: block;
}

#pw-clipsContainer {
  grid-area: clipsContainer;
  padding: 10px 10px;
  border-left: 1px solid #888;
  overflow-y: scroll;
}

#pw-clipsSection {
  grid-area: clipsSection;
  width: 100%;
  height: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#pw-clipsSection #pw-c-automation.dynamic #pw-c-a-container #pw-c-a-controls #pw-c-a-next {
  display: block;
}
#pw-clipsSection #pw-c-automation.sequential #pw-c-a-container #pw-c-a-controls #pw-c-a-step {
  display: flex;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container {
  background-color: #000;
  border: 1px solid #888;
  padding: 10px 5px 5px 5px;
  width: 100%;
  position: relative;
  border-radius: 5px;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-header {
  position: absolute;
  top: -8px;
  left: 5px;
  background-color: #000;
  color: #a8f5a8;
  font-size: 0.8rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-header {
    font-size: 10px;
  }
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 {
  margin-top: 1px;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap {
  padding-left: 5px;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label {
  font-size: 0.9rem;
  color: #FFF;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label {
    font-size: 11px;
  }
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row1 #pw-c-a-gap label #pw-c-a-gapCb {
  width: 10px;
  position: relative;
  top: 3px;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 {
  margin-top: 5px;
  display: flex;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect {
  width: calc(100% - 39px);
  flex: 1 1 auto;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect:after {
  right: 0.35em;
  top: 0.55em;
  opacity: 0.6;
  border-left-width: 5px;
  border-right-width: 5px;
  border-top: 8px solid #FFF;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
  width: 100%;
  font-size: 0.8rem;
  padding-right: 18px;
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
  background-color: #494D5F;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:focus {
  background-color: #222;
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
  background-color: #494D5F;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect {
    width: calc(100% - 30px);
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0.2em;
    background: #efefef;
    border: none;
    border-radius: 3px;
    font-size: 12px;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div {
    position: relative;
    display: inline;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    pointer-events: none;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect .select-div:after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    top: 0.5em;
    right: 0.75em;
    border-top: 8px solid black;
    opacity: 0.5;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select::-ms-expand {
    display: none;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    background-color: #222;
    border: 1px solid #CCC;
    color: #FFF;
    text-shadow: 1px 1px 2px #555;
    box-shadow: 1px 1px 2px #000;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:hover {
    background-color: #494D5F;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select:focus {
    background-color: #222;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect select {
    font-size: 10px;
    padding-right: 15px;
    padding-top: 4px;
  }
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-filterSelect:after {
    right: 0.2em;
    top: 0.5em;
    border-left-width: 5px;
    border-right-width: 5px;
    border-top: 8px solid #FFF;
  }
}
#pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-sort {
  flex: 0 0 auto;
  color: #FFF;
  cursor: pointer;
  margin-left: 5px;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-automation #pw-c-a-container #pw-c-a-row2 #pw-c-a-sort {
    margin-right: -1px;
    margin-left: 4px;
    padding-top: 0px;
  }
}
#pw-clipsSection #pw-c-songClips {
  margin-top: 15px;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip {
  padding: 5px 5px;
  color: #FFF;
  background: black;
  border-radius: 5px;
  border: 1px solid #999;
  position: relative;
  cursor: pointer;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip:not(:first-child) {
  margin-top: 10px;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip:hover {
  border: 1px solid #87b4cb;
  transform: scale(1.02);
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo {
  width: 100%;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipId {
  color: #a8f5a8;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipDescription {
  font-size: 0.9rem;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipDescription {
    font-size: 0.8rem;
  }
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipPlays {
  font-size: 0.9rem;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-clipPlays {
    font-size: 0.8rem;
  }
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo .pw-c-reduceInfo {
  display: none;
  color: #DDD;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clipInfo {
    font-size: 0.9rem;
  }
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-clipDescription, #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-clipPlays {
  display: none;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.reduce .pw-c-clipInfo .pw-c-reduceInfo {
  display: block;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.selected {
  border: 2px solid #a0d2eb;
  background: #333;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.selected .pw-c-clip-plus {
  line-height: 1rem;
  opacity: 1;
  padding: 0 3px;
  right: -6px;
  top: -8px;
  background-color: #000;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip.notIdeal .pw-c-clipInfo .pw-c-clipId {
  color: #EE0;
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus {
  position: absolute;
  right: 0px;
  top: 0;
  border-radius: 50%;
  padding: 0 5px;
  color: #ffb400;
  font-weight: bold;
  font-size: 1.1rem;
  opacity: 0;
  transition: 0.2s;
  cursor: pointer;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus {
    font-size: 1rem;
  }
}
#pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip .pw-c-clip-plus:hover {
  transform: scale(1.35);
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-clipsSection #pw-c-songClips #pw-c-clipsList .pw-c-clip {
    margin-top: 8px;
  }
}
#pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv {
  margin-top: 10px;
}
#pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov, #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm {
  color: #ffb400;
  font-size: 0.9rem;
  border: 1px solid #888;
  padding: 5px 5px 5px 5px;
  border-radius: 5px;
  cursor: pointer;
}
#pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov:hover, #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm:hover {
  font-weight: bold;
}
#pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov.disabled, #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm.disabled {
  color: #999;
  cursor: auto;
}
#pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addImprov.disabled:hover, #pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv #pw-c-addRhythm.disabled:hover {
  font-weight: normal;
}
#pw-clipsSection #pw-c-songClips #pw-c-addClipsDiv:has(> #pw-c-addImprov:not([style*="display: none"])) > #pw-c-addRhythm {
  margin-top: 10px;
}

#pw-tracksContainer {
  grid-area: tracksContainer;
  min-height: 100%;
  height: 100%;
  overflow-y: scroll;
}

#pw-tracks {
  min-height: 100%;
  padding: 10px 10px 10px 10px;
  width: calc(135px + 2 * 10px);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#pw-tracks.showLoadMore #pw-t-loadMoreTracks {
  display: block;
}
#pw-tracks #pw-t-tracksHeader {
  position: relative;
  width: 135px;
}
#pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv {
  color: #FFF;
  font-size: 1.2rem;
  text-align: center;
  width: 100%;
}
#pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv #pw-t-ensembleScaleInput {
  margin-left: 10px;
  padding: 0 5px;
  width: 45px;
  font-size: 1rem;
  background-color: #000;
  color: #FFF;
  border-color: #000;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv {
    font-size: 0.9rem;
  }
  #pw-tracks #pw-t-tracksHeader #pw-t-ensembleScaleDiv #pw-t-ensembleScaleInput {
    font-size: 0.9rem;
  }
}
#pw-tracks #pw-t-loadMoreTracks {
  display: none;
  width: 135px;
  margin-top: 10px;
  color: #DDD;
  text-align: center;
  cursor: pointer;
}
#pw-tracks #pw-t-loadMoreTracks:hover {
  color: #FFF;
}
#pw-tracks .pw-t-track {
  flex: 0 0 auto;
  width: 135px;
  transition: width 0.1s;
  min-height: 55px;
  background: #000;
  border: 1px solid #999;
  position: relative;
  z-index: 2;
  padding: 1px 4px 2px 4px;
  border-radius: 5px;
}
#pw-tracks .pw-t-track.mute {
  border: 2px solid rgb(187, 187, 66);
}
#pw-tracks .pw-t-track.solo {
  border: 2px solid green;
}
#pw-tracks .pw-t-track.isPlaying {
  border: 2px solid red;
}
#pw-tracks .pw-t-track.editMode .pw-t-trackSettings {
  display: block;
}
#pw-tracks .pw-t-track.editFx .pw-t-trackSettings .pw-t-fx {
  display: block;
}
#pw-tracks .pw-t-track.editTime .pw-t-trackSettings .pw-t-timing {
  display: flex;
}
#pw-tracks .pw-t-track.pw-t-busy .pw-t-loader {
  display: block;
}
#pw-tracks .pw-t-track:not(:first-child) {
  margin-top: 10px;
}
#pw-tracks .pw-t-track .pw-t-trackLabel {
  position: relative;
  top: -2px;
  font-size: 11px;
  color: #FFF;
  border-width: 0;
  width: 100%;
  border-radius: 3px;
  padding: 3px 0 1px 0;
  height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
#pw-tracks .pw-t-track .pw-t-trackControls {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
#pw-tracks .pw-t-track .pw-t-trackControls .dialControl {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial {
  border: 1px solid black;
  width: calc(48px * 0.56);
  height: calc(48px * 0.56);
  border-radius: 50%;
  background: radial-gradient(circle, rgb(2, 0, 36) 50%, #a8f5a8 65%);
  box-shadow: 1px 1px 0px #000;
  cursor: pointer;
  position: relative;
}
#pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial .dialControl-overlay {
  position: absolute;
  bottom: 0px;
  left: calc(8px * 0.56);
  width: 0;
  height: 0;
  border-left: calc(15px * 0.56) solid transparent;
  border-right: calc(15px * 0.56) solid transparent;
  border-bottom: calc(23px * 0.56) solid #000;
}
#pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-dial .dialControl-indicator {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(22px * 0.56);
  height: 1px;
  border: 1px solid #FFF;
  background-color: #ff9500;
  transform-origin: 0 0;
  transform: rotate(120deg);
}
#pw-tracks .pw-t-track .pw-t-trackControls .dialControl .dialControl-label {
  margin-top: calc(0px * 0.56);
  color: #DDD;
  font-size: calc(0.9rem * 0.56);
}
#pw-tracks .pw-t-track .pw-t-trackControls > div:not(:last-child) {
  margin-right: 5px;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay {
  cursor: pointer;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay:hover {
  opacity: 0.9;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay:active {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay > button {
  outline: none;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled {
  filter: grayscale(100%);
  cursor: default;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled:hover {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay.disabled:active {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackPlay {
  flex: 0 0 auto;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackVolume {
  position: relative;
  top: -1px;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload {
  cursor: pointer;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload:hover {
  opacity: 0.9;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload:active {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload > button {
  outline: none;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled {
  filter: grayscale(100%);
  cursor: default;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled:hover {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload.disabled:active {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackUpload {
  margin-left: -2px;
  flex: 0 0 auto;
  position: relative;
  bottom: 1px;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove {
  cursor: pointer;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove:hover {
  opacity: 0.9;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove:active {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove > button {
  outline: none;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled {
  filter: grayscale(100%);
  cursor: default;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled:hover {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove.disabled:active {
  opacity: 1;
}
#pw-tracks .pw-t-track .pw-t-trackControls .pw-t-trackRemove {
  transform: scale(0.95, 0.95);
  flex: 0 0 auto;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 {
  margin-top: 1px;
  height: 18px;
  border-top: 1px dotted #888;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 0;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv {
  flex: 0 0 auto;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  background-color: #222;
  border: none;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect:focus {
  background-color: #222;
  outline: none;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  color: #FFF;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect:hover {
  background-color: #494D5F;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-octaveSelectDiv .pw-t-octaveSelect {
  font-size: 10px;
  color: #FFF;
  padding: 1px 0px;
  width: 26px;
  text-align: center;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview {
  display: flex;
  align-items: center;
  width: 26px;
  flex: 0 0 auto;
  text-align: center;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label {
  width: 100%;
  position: relative;
  top: 1px;
  color: #a8f5a8;
  font-size: 11px;
  cursor: pointer;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label:hover {
  color: #ddeeff;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-fxPreview .pw-t-fxp-label.disabled {
  color: #999;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv {
  flex: 0 0 auto;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  background-color: #222;
  border: none;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect:focus {
  background-color: #222;
  outline: none;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  color: #FFF;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect:hover {
  background-color: #494D5F;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-muteSelectDiv .pw-t-muteSelect {
  font-size: 10px;
  color: #FFF;
  padding: 1px 0px 1px 0;
  width: 26px;
  text-align: center;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink {
  width: 26px;
  flex: 0 0 auto;
  color: #FFF;
  position: relative;
  top: 1px;
  cursor: pointer;
  font-size: 11px;
  text-align: center;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink:hover {
  color: #ddeeff;
}
#pw-tracks .pw-t-track .pw-t-trackRow2 .pw-t-trackTimeLink.disabled {
  color: #999;
}
#pw-tracks .pw-t-track .pw-t-trackSettings {
  display: none;
  margin-top: 0px;
  border-top: 1px solid #555;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx {
  display: none;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  background-color: #222;
  border: none;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect:focus {
  background-color: #222;
  outline: none;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  color: #FFF;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect:hover {
  background-color: #494D5F;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fx-add .pw-t-fx-addSelect {
  font-size: 10px;
  color: #FFF;
  width: 100%;
  text-align: left;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem {
  position: relative;
  padding-top: 7px;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem:not(:first-child) {
  margin-top: 5px;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-name {
  position: absolute;
  top: 0;
  left: 5px;
  background-color: #000;
  color: #a8f5a8;
  font-size: 11px;
  font-family: "Montserrat", sans-serif;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-remove {
  position: absolute;
  top: 0;
  right: 5px;
  background-color: #000;
  color: #F00;
  font-size: 11px;
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
  cursor: pointer;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-remove:hover {
  transform: scale(1.2);
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .pw-fxItem .pw-fxi-content {
  border: 1px dotted #888;
  padding: 10px 5px 5px 5px;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-labelDiv {
  color: #FFF;
  font-size: 11px;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv {
  position: relative;
  top: -1px;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  background-color: #222;
  border: none;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select:focus {
  background-color: #222;
  outline: none;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  color: #FFF;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select:hover {
  background-color: #494D5F;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-fx .pw-t-fxList .fx-distortion .distortion-level .distortion-levelSelectDiv select {
  font-size: 11px;
  color: #FFF;
  padding: 1px 2px;
  width: 50px;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing {
  margin-top: 6px;
  display: flex;
  display: none;
  align-items: center;
  justify-content: space-between;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingDescription {
  font-size: 12px;
  line-height: 12px;
  color: #DDD;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv {
  flex: 0 0 auto;
  margin-left: 5px;
  width: 50px;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv input {
  border-radius: 3px;
  width: 100%;
  padding: 1px 1px 1px 3px;
  font-size: 12px;
  position: relative;
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-tracks .pw-t-track .pw-t-trackSettings .pw-t-timing .pw-t-timingInputDiv .pw-t-timing-newDefault {
  width: 100%;
  font-size: 11px;
  margin-top: 1px;
  color: #FFF;
  text-align: center;
  text-decoration: underline;
  cursor: pointer;
}
#pw-tracks .pw-t-track .pw-t-loader {
  position: absolute;
  left: 50%;
  top: 10px;
  transform: translateX(-50%);
  display: none;
  z-index: 1;
}
#pw-tracks .pw-t-track .pw-t-loader .ani-loader {
  border: 4px solid #f3f3f3;
  border-radius: 50%;
  border-top: 4px solid rgb(205, 206, 207);
  border-bottom: 4px solid rgb(205, 206, 207);
  width: 35px;
  height: 35px;
}

.dialControl {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.dialControl .dialControl-dial {
  border: 1px solid black;
  width: calc(48px * 1);
  height: calc(48px * 1);
  border-radius: 50%;
  background: radial-gradient(circle, rgb(2, 0, 36) 50%, #a8f5a8 65%);
  box-shadow: 1px 1px 0px #000;
  cursor: pointer;
  position: relative;
}
.dialControl .dialControl-dial .dialControl-overlay {
  position: absolute;
  bottom: 0px;
  left: calc(8px * 1);
  width: 0;
  height: 0;
  border-left: calc(15px * 1) solid transparent;
  border-right: calc(15px * 1) solid transparent;
  border-bottom: calc(23px * 1) solid #000;
}
.dialControl .dialControl-dial .dialControl-indicator {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(22px * 1);
  height: 1px;
  border: 1px solid #FFF;
  background-color: #ff9500;
  transform-origin: 0 0;
  transform: rotate(120deg);
}
.dialControl .dialControl-label {
  margin-top: calc(0px * 1);
  color: #DDD;
  font-size: calc(0.9rem * 1);
}

@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  .dialControl {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .dialControl .dialControl-dial {
    border: 1px solid black;
    width: calc(48px * 0.75);
    height: calc(48px * 0.75);
    border-radius: 50%;
    background: radial-gradient(circle, rgb(2, 0, 36) 50%, #a8f5a8 65%);
    box-shadow: 1px 1px 0px #000;
    cursor: pointer;
    position: relative;
  }
  .dialControl .dialControl-dial .dialControl-overlay {
    position: absolute;
    bottom: 0px;
    left: calc(8px * 0.75);
    width: 0;
    height: 0;
    border-left: calc(15px * 0.75) solid transparent;
    border-right: calc(15px * 0.75) solid transparent;
    border-bottom: calc(23px * 0.75) solid #000;
  }
  .dialControl .dialControl-dial .dialControl-indicator {
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(22px * 0.75);
    height: 1px;
    border: 1px solid #FFF;
    background-color: #ff9500;
    transform-origin: 0 0;
    transform: rotate(120deg);
  }
  .dialControl .dialControl-label {
    margin-top: calc(0px * 0.75);
    color: #DDD;
    font-size: calc(0.9rem * 0.75);
  }
}
#pw-notationcontrols {
  grid-area: notationControls;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  padding: 5px 10px 0px 10px;
  position: relative;
  display: grid;
  grid-template-rows: max-content 1fr;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols {
    padding: 5px 5px 0px 5px;
  }
}
#pw-notationcontrols.pre-record #pw-nc-top #pw-nc-controlsRow2 {
  display: flex;
}
#pw-notationcontrols.pre-record #pw-nc-top #pw-nc-controlsRow3, #pw-notationcontrols.pre-record #pw-nc-top #pw-nc-controlsRow4, #pw-notationcontrols.pre-record #pw-nc-top #pw-nc-controlsRow5 {
  display: none;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar {
  border-bottom: 1px solid #888;
  padding-bottom: 2px;
  margin-bottom: 10px;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-songsDiv {
  font-size: 1.5rem;
  color: #fcbb43;
  cursor: pointer;
  transition: 0.25s;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-songsDiv:hover {
  transform: scale(1.05);
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-songsDiv:hover.disabled {
  transform: none;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-songsDiv.disabled {
  opacity: 0.8;
  filter: grayscale(100%);
  cursor: initial;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-songsDiv {
    font-size: 1.2rem;
  }
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right {
  display: flex;
  align-items: center;
  vertical-align: middle;
  gap: 10px;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-saveBtn {
  font-size: 30px;
  color: #fcbb43;
  line-height: 0;
  cursor: pointer;
  transition: 0.25s;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-saveBtn:hover {
  transform: scale(1.05);
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-saveBtn:hover.disabled {
  transform: none;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-saveBtn.disabled {
  opacity: 0.8;
  filter: grayscale(100%);
  cursor: initial;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-saveBtn {
    font-size: 26px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn {
  cursor: pointer;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn:hover {
  opacity: 0.9;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn:active {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn > button {
  outline: none;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn.disabled:hover {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn.disabled:active {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn {
  display: none;
  flex: 0 0 auto;
  font-size: 28px;
  line-height: 0;
  position: relative;
  top: 1px;
  color: #fcbb43;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-menuBar #pw-mb-row1 #pw-mb-right #pw-mb-fullscreenBtn {
    font-size: 24px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  position: relative;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-playBtnDiv {
  cursor: pointer;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-playBtnDiv:hover {
  opacity: 0.9;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-playBtnDiv:active {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-playBtnDiv > button {
  outline: none;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-playBtnDiv.disabled {
  filter: grayscale(100%);
  cursor: default;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-playBtnDiv.disabled:hover {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-playBtnDiv.disabled:active {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-playBtnDiv {
  flex: 0 0 auto;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv {
  cursor: pointer;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv:hover {
  opacity: 0.9;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv:active {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv > button {
  outline: none;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv.disabled {
  filter: grayscale(100%);
  cursor: default;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv.disabled:hover {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv.disabled:active {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv {
  flex: 0 0 auto;
  position: relative;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv #pw-nc-recordPlusBtn {
  position: absolute;
  right: 0px;
  top: 0;
  background-color: #333;
  border: 1px solid #888;
  border-radius: 50%;
  padding: 0 5px;
  color: #ffb400;
  font-weight: bold;
  font-size: 1rem;
  transition: 0.2s;
  cursor: pointer;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv #pw-nc-recordPlusBtn {
    font-size: 1.2rem;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 #pw-nc-recordBtnDiv #pw-nc-recordPlusBtn:hover {
  transform: scale(1.1);
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 {
    height: 48px;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow1 div {
    transform: scale(0.8, 0.8);
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 {
  width: 100%;
  margin-top: 25px;
  margin-bottom: 37px;
  display: none;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 {
    margin-top: 15px;
    margin-bottom: 24px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection {
  flex-direction: column;
  align-items: center;
  width: 100%;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn {
  cursor: pointer;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn:hover {
  opacity: 0.9;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn:active {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn > button {
  outline: none;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn.disabled {
  filter: grayscale(100%);
  cursor: default;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn.disabled:hover {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn.disabled:active {
  opacity: 1;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn {
  width: 100%;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn button {
  width: 100%;
  padding: 7px 10px;
  border-radius: 15px;
  cursor: pointer;
  background-color: #C00;
  color: #FFF;
  font-size: 1rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-jumpToRecordTimeBtn button {
    font-size: 0.8rem;
    padding: 5px 5px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-recordCountDown {
  margin-top: 5px;
  width: 100%;
  font-size: 1.2rem;
  color: #FFF;
  text-align: center;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-recordCountDown span {
  color: #F00;
  font-weight: bold;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow2 #pw-nc-preRecordSection #pw-nc-recordCountDown {
    font-size: 13px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 {
  margin-top: 25px;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 {
    margin-top: 15px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect {
  flex: 1 0 min-content;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect:after {
  content: none;
  width: 0;
  height: 0;
  position: absolute;
  pointer-events: none;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select {
  width: 100%;
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select:hover {
  background-color: #494D5F;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select:focus {
  background-color: #222;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select {
  padding-right: 5px;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select:hover {
  background-color: #494D5F;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect {
    width: calc(100% - 30px);
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0.2em;
    background: #efefef;
    border: none;
    border-radius: 3px;
    font-size: 12px;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect .select-div {
    position: relative;
    display: inline;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect .select-div:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    pointer-events: none;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect .select-div:after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    top: 0.5em;
    right: 0.75em;
    border-top: 8px solid black;
    opacity: 0.5;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select::-ms-expand {
    display: none;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect:after {
    content: none;
    width: 0;
    height: 0;
    position: absolute;
    pointer-events: none;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select {
    background-color: #222;
    border: 1px solid #CCC;
    color: #FFF;
    text-shadow: 1px 1px 2px #555;
    box-shadow: 1px 1px 2px #000;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select:hover {
    background-color: #494D5F;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select:focus {
    background-color: #222;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-instrumentSelect select {
    padding-right: 5px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-scoreBtn {
  flex: 0 0 auto;
  margin-left: 6px;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-scoreBtn button {
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-scoreBtn button:hover {
  background-color: #494D5F;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-scoreBtn button {
  width: 24px;
  height: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 5px;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow4 #pw-nc-scoreBtn button {
    width: 20px;
    height: 20px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 {
  margin-top: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 {
    margin-top: 10px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect:after, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect:after {
  content: none;
  width: 0;
  height: 0;
  position: absolute;
  pointer-events: none;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select {
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select:hover, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select:hover {
  background-color: #494D5F;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select:focus, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select:focus {
  background-color: #222;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select {
  width: 100%;
  padding-right: 5px;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select:hover, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select:hover {
  background-color: #494D5F;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0.2em;
    background: #efefef;
    border: none;
    border-radius: 3px;
    font-size: 12px;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect .select-div, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect .select-div {
    position: relative;
    display: inline;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect .select-div:after, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect .select-div:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    pointer-events: none;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect .select-div:after, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect .select-div:after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    top: 0.5em;
    right: 0.75em;
    border-top: 8px solid black;
    opacity: 0.5;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select::-ms-expand, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select::-ms-expand {
    display: none;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect:after, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect:after {
    content: none;
    width: 0;
    height: 0;
    position: absolute;
    pointer-events: none;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select {
    background-color: #222;
    border: 1px solid #CCC;
    color: #FFF;
    text-shadow: 1px 1px 2px #555;
    box-shadow: 1px 1px 2px #000;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select:hover, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select:hover {
    background-color: #494D5F;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select:focus, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select:focus {
    background-color: #222;
  }
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect select, #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect select {
    padding-right: 2px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect {
  flex: 0 0 73px;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-keySelect {
    flex: 0 0 55px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-rangeSelect {
  margin-left: 6px;
  flex: 1 0 min-content;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-songSettingsBtn {
  flex: 0 0 auto;
  margin-left: 6px;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-songSettingsBtn button {
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-songSettingsBtn button:hover {
  background-color: #494D5F;
}
#pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-songSettingsBtn button {
  width: 24px;
  height: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 5px;
  font-weight: bold;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-nc-controlsRow5 #pw-nc-songSettingsBtn button {
    width: 20px;
    height: 20px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-mixcontrols {
  margin-top: 25px;
  width: 100%;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-mixcontrols {
    margin-top: 15px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-mixcontrols #pw-mc-controlsRow1 {
  display: flex;
  width: 100%;
  flex-direction: row;
  justify-content: space-between;
}
#pw-notationcontrols #pw-nc-top #pw-mixcontrols #pw-mc-controlsRow1 .dialControl .dialControl-label {
  cursor: pointer;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-mixcontrols #pw-mc-controlsRow1 .dialControl {
    width: 34px;
  }
}
#pw-notationcontrols #pw-nc-top #pw-tuner-section {
  margin-top: 25px;
}
@media screen and (max-width: 1500px), screen and (max-height: 600px) {
  #pw-notationcontrols #pw-nc-top #pw-tuner-section {
    margin-top: 15px;
  }
  #pw-notationcontrols #pw-nc-top #pw-tuner-section .tuner {
    height: 60px;
  }
  #pw-notationcontrols #pw-nc-top #pw-tuner-section .tuner .tuner-hashes .tuner-hash-div .tuner-hashValue {
    font-size: 0.75rem;
  }
  #pw-notationcontrols #pw-nc-top #pw-tuner-section .tuner .tuner-hashes .tuner-indicator .tuner-indicatorText {
    font-size: 1rem;
  }
}
#pw-notationcontrols {
  /*notation controls bottom area (for player preview video) */
}
#pw-notationcontrols #pw-nc-bottom {
  margin-top: 15px;
  width: 100%;
  overflow: hidden;
}
@media screen and (max-height: 400px) {
  #pw-notationcontrols #pw-nc-bottom {
    display: none;
  }
}
#pw-notationcontrols #pw-nc-bottom #pw-videoPreview {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
#pw-notationcontrols #pw-nc-bottom #pw-videoPreview #videoContainer {
  flex: 0 1 auto;
  max-height: 100%;
  aspect-ratio: 1;
  border: 1px solid #CCC;
}
#pw-notationcontrols #pw-nc-bottom #pw-videoPreview #videoContainer video {
  width: 100%;
  height: 100%;
}
#pw-notationcontrols #pw-nc-bottom #pw-videoPreview:hover #lcac-vp-micLevelDiv {
  opacity: 0.7;
  background-color: #AAA;
}

#pw-s-stageDiv {
  grid-area: stage;
  width: 100%;
  height: 100%;
  position: relative;
}
#pw-s-stageDiv #pw-s-stageCanvas {
  width: 100%;
  height: 100%;
  padding: 0px 0px 0 0px;
  position: absolute;
  top: 0;
  left: 0;
  background: #e5eaf5;
  background: #d5dfe0;
}
#pw-s-stageDiv #pw-s-instructions {
  position: absolute;
  top: calc(50% - 50px);
  padding: 0 15%;
  width: 100%;
  color: #303030;
  font-family: "Montserrat", sans-serif;
  font-size: 60px;
  font-weight: bold;
  text-align: center;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media screen and (max-width: 2400px) {
  #pw-s-stageDiv #pw-s-instructions {
    font-size: 2.5rem;
    top: calc(50% - 40px);
  }
}
@media screen and (max-width: 1500px) {
  #pw-s-stageDiv #pw-s-instructions {
    font-size: 2.2rem;
    top: calc(50% - 35px);
  }
}
@media screen and (max-width: 1300px) {
  #pw-s-stageDiv #pw-s-instructions {
    font-size: 1.8rem;
    top: calc(50% - 30px);
  }
}
@media screen and (max-width: 1200px) {
  #pw-s-stageDiv #pw-s-instructions {
    font-size: 1.5rem;
    top: calc(50% - 25px);
  }
}

#pw-ip-infoBar {
  grid-area: infoBar;
  height: 35px;
  width: 100%;
  overflow: hidden;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  border-bottom: 1px solid #888;
  border-right: 1px solid #888;
  border-left: 1px solid #888;
}
#pw-ip-infoBar #pw-ip-clipTip {
  display: none;
  flex: 1 1 auto;
  white-space: nowrap;
  padding: 5px 10px;
  background-color: #000;
  color: #FFF;
  font-family: "Montserrat", sans-serif;
  font-size: 1.2rem;
  text-align: left;
  opacity: 1;
  transition: 1s;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media screen and (max-width: 1500px) {
  #pw-ip-infoBar #pw-ip-clipTip {
    font-size: 1rem;
  }
}
@media screen and (max-width: 1300px) {
  #pw-ip-infoBar #pw-ip-clipTip {
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 1200px) {
  #pw-ip-infoBar #pw-ip-clipTip {
    font-size: 0.8rem;
  }
}
@media screen and (max-width: 1000px) {
  #pw-ip-infoBar #pw-ip-clipTip {
    font-size: 0.7rem;
  }
}
#pw-ip-infoBar #pw-ip-beatsDiv {
  flex: 2 1 auto;
  display: flex;
  display: none;
  max-width: min(50%, 500px);
}
#pw-ip-infoBar #pw-ip-beatsDiv .pw-ip-beatBox {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 1.5rem;
  font-family: "Montserrat", sans-serif;
  color: #FFF;
  text-align: center;
  font-weight: bold;
  padding: 1px 0;
}
#pw-ip-infoBar #pw-ip-beatsDiv .pw-ip-beatBox.active {
  background-color: #F00;
}

#pw-ip-controls {
  grid-area: infoControls;
  height: 33px;
  background: rgba(160, 210, 235, 0.15);
  padding: 1px 1px 2px 1px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  border-bottom: 1px solid #888;
}
#pw-ip-controls #pw-ip-toggles {
  display: flex;
  justify-content: flex-start;
}
#pw-ip-controls #pw-ip-detailsToggles {
  display: flex;
}
#pw-ip-controls #pw-ip-detailsToggles #pw-ip-closePreview {
  display: none;
  margin-left: 10px;
  color: rgb(255, 228, 52);
  font-size: 0.9rem;
  cursor: pointer;
  position: relative;
  top: 1px;
}
#pw-ip-controls #pw-ip-detailsToggles #pw-ip-closePreview:hover {
  text-decoration: underline;
}
#pw-ip-controls #pw-ip-detailsToggles #pw-ip-appDetailsToggle {
  display: none;
}
#pw-ip-controls .toggle {
  color: #ddeeff;
  padding: 3px 7px;
  min-width: 70px;
  flex: 0 0 auto;
  text-align: center;
  background-color: #333;
  font-family: "Montserrat", sans-serif;
  font-size: 1rem;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#pw-ip-controls .toggle:not(:first-child) {
  margin-left: 10px;
}
@media screen and (max-width: 1500px) {
  #pw-ip-controls .toggle {
    font-size: 0.9rem;
  }
}
#pw-ip-controls .toggle.selected {
  background-color: #a8f5a8;
  color: #303030;
  font-weight: bold;
}
#pw-ip-controls .toggle.disabled {
  color: #888;
}

#pw-s-infoPanel {
  grid-area: infoPanel;
  width: 100%;
  height: 100%;
  background: url("../images/star_twinkles2.webp");
  border-right: 1px solid #888;
  border-bottom: 1px solid #888;
  overflow-y: hidden;
}
#pw-s-infoPanel.automationView #pw-ip-content > #pw-ip-automation {
  display: block;
}
#pw-s-infoPanel.detailsView #pw-ip-content > #pw-ip-details {
  display: block;
}
#pw-s-infoPanel #pw-ip-content {
  width: 100%;
  height: 100%;
  background: rgba(160, 210, 235, 0.15);
}
@media screen and (min-width: 1800px) {
  #pw-s-infoPanel #pw-ip-content {
    max-width: 1200px;
    margin: 0 auto;
    border-left: 1px solid #888;
    border-right: 1px solid #888;
  }
}
#pw-s-infoPanel #pw-ip-content #pw-ip-details {
  display: none;
  overflow-y: auto;
  padding: 10px 10px;
  height: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-details > h4 {
  color: #ddeeff;
  font-size: 1.5rem;
  margin-bottom: 10px;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-details > h4 {
    font-size: 1.2rem;
  }
}
#pw-s-infoPanel #pw-ip-content #pw-ip-details > div {
  color: #FFF;
  margin-bottom: 15px;
  font-size: 1.2rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-details > div {
    font-size: 1rem;
    margin-bottom: 10px;
  }
}
#pw-s-infoPanel #pw-ip-content #pw-ip-details > ul {
  margin-left: 30px;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-details > ul li {
  color: #FFF;
  margin-bottom: 15px;
  font-size: 1.2rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-details > ul li {
    font-size: 1rem;
    margin-bottom: 10px;
  }
}
#pw-s-infoPanel #pw-ip-content #pw-ip-details span {
  color: #ffb400;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-details > iframe {
  height: calc(100% - 10px);
  aspect-ratio: 1.7778;
  max-width: 100%;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation {
  display: none;
  overflow-y: auto;
  padding: 0px 10px 10px 10px;
  height: 100%;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation.dynamic #pw-ip-auto-dynamic {
  display: block;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation.sequential #pw-ip-auto-sequential {
  display: block;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-header {
  text-align: center;
  color: #a8f5a8;
  font-size: 2.5rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-header {
    font-size: 2.2rem;
  }
}
@media screen and (max-width: 1300px), screen and (max-height: 750px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-header {
    font-size: 1.5rem;
  }
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-typeRBtns {
  margin-top: 5px;
  text-align: center;
  padding-bottom: 8px;
  border-bottom: 1px solid #888;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-typeRBtns > label {
  color: #FFF;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation div, #pw-s-infoPanel #pw-ip-content #pw-ip-automation .checkbox {
  font-size: 1.2rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-automation div, #pw-s-infoPanel #pw-ip-content #pw-ip-automation .checkbox {
    font-size: 1rem;
  }
}
@media screen and (max-width: 1300px), screen and (max-height: 750px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-automation div, #pw-s-infoPanel #pw-ip-content #pw-ip-automation .checkbox {
    font-size: 1rem;
  }
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation .hRbtnGroup {
  font-size: 1.5rem;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-automation .hRbtnGroup {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 1300px), screen and (max-height: 750px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-automation .hRbtnGroup {
    font-size: 1rem;
  }
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic {
  display: none;
  padding: 15px 10px 10px 10px;
  margin: 0 auto;
  color: #DDD;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-autoUpload {
  margin-top: 20px;
  padding-left: 0;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-autoUpload label {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-autoUpload label > input {
  transform: scale(1.5) translateY(1px);
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-endBehavior {
  margin-top: 20px;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-endBehavior #pw-ip-dyn-ebLabel {
  margin-bottom: 5px;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-endBehavior #pw-ip-dyn-ebSelect.select-div {
  width: calc(100% - 39px);
  flex: 0 0 auto;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-endBehavior #pw-ip-dyn-ebSelect.select-div:after {
  right: 0.35em;
  top: 0.35em;
  opacity: 0.6;
  border-left-width: 7px;
  border-right-width: 7px;
  border-top: 12px solid #FFF;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-endBehavior #pw-ip-dyn-ebSelect.select-div select {
  width: 100%;
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-endBehavior #pw-ip-dyn-ebSelect.select-div select:hover {
  background-color: #494D5F;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-endBehavior #pw-ip-dyn-ebSelect.select-div select:focus {
  background-color: #222;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-dynamic #pw-ip-dyn-endBehavior #pw-ip-dyn-ebSelect.select-div select:hover {
  background-color: #494D5F;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential {
  display: none;
  padding: 15px 10px 10px 10px;
  margin: 0 auto;
  color: #DDD;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential .pw-ip-seq-instructions:not(:first-child) {
  margin-top: 10px;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps {
  margin-top: 20px;
  display: flex;
  justify-content: center;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer {
  flex: 0 1 auto;
  max-height: 250px;
  overflow: auto;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable {
  margin: 0 auto;
  background-color: 0;
  padding: 2px 10px;
  border: 1px solid #CCC;
  border-collapse: collapse;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable td, #pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable th {
  border: 1px solid #CCC;
  padding: 3px 10px;
  color: #DDD;
  white-space: nowrap;
  max-width: 160px;
  text-wrap: nowrap;
  overflow: hidden;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable th {
  color: #a8f5a8;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable select {
  background-color: #222;
  border: none;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable select:focus {
  background-color: #222;
  outline: none;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable select {
  color: #FFF;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable select:hover {
  background-color: #494D5F;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable select {
  text-align: center;
  background-color: rgba(0, 0, 0, 0);
  padding: 2px 10px;
  font-size: 1.2rem;
  color: #DDD;
  transform: translateY(1px);
  width: 100%;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  #pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-steps #pw-ip-seq-stepsTableContainer #pw-ip-seq-stepsTable select {
    font-size: 1rem;
  }
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-autoUpload {
  margin-top: 20px;
  padding-left: 0;
  text-align: center;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-autoUpload label {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-autoUpload label > input {
  transform: scale(1.5) translateY(1px);
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-buttons {
  margin-top: 20px;
  width: 100%;
  text-align: center;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-buttons button {
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-buttons button:hover {
  background-color: #494D5F;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-buttons button {
  font-size: 1.2rem;
  padding: 5px 10px;
  border-radius: 5px;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-sequential #pw-ip-seq-buttons button:not(:first-child) {
  margin-left: 20px;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-buttons {
  margin-top: 20px;
  width: 100%;
  text-align: center;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-buttons button {
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-buttons button:hover {
  background-color: #494D5F;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-buttons button {
  font-size: 1.2rem;
  padding: 5px 10px;
  border-radius: 5px;
}
#pw-s-infoPanel #pw-ip-content #pw-ip-automation #pw-ip-auto-buttons button:not(:first-child) {
  margin-left: 20px;
}

#pw-s-performanceVideosContainer {
  grid-area: performanceVideos;
  padding-bottom: 10px;
  width: 100%;
  height: 100%;
  border-right: 1px solid #888;
  position: relative;
}
#pw-s-performanceVideosContainer .pw-s-performanceVideoDiv {
  width: 200px;
  height: 200px;
  position: absolute;
  top: 10px;
  left: 10px;
}
#pw-s-performanceVideosContainer .pw-s-performanceVideoDiv.highlight {
  border: 5px solid #F00;
  border-radius: 10px;
}
#pw-s-performanceVideosContainer .pw-s-performanceVideoDiv video {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  opacity: 0;
  transition: opacity 0.3s linear;
}
@keyframes fadeInAnimation {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
#pw-s-performanceVideosContainer .pw-s-performanceVideoDiv video.fadeIn {
  opacity: 1;
  animation-name: fadeInAnimation;
  animation-duration: 0.5s;
}

.song-settings-dialog {
  width: 800px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.song-settings-dialog .dg2-content .dg2-fields-section {
  margin-top: 10px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection {
  width: 100%;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-header {
  font-size: 1.5rem;
  text-align: left;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-tempoDiv {
  margin-top: 10px;
  padding-left: 8px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-tempoDiv > label {
  font-size: 1.2rem;
  display: block;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-tempoDiv > label span {
  font-weight: bold;
  color: #ffb400;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-tempoDiv > label .ssd-ss-tempoInput {
  margin-left: 2px;
  margin-right: 2px;
  font-size: 1.2rem;
  width: 60px;
  border-radius: 5px;
  padding-left: 5px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-sfzSection {
  margin-top: 20px;
  padding-left: 8px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-sfzSection > label {
  font-size: 1.2rem;
  display: block;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-sfzSection > label .select-div {
  margin-left: 3px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-sfzSection > label span {
  font-weight: bold;
  color: #ffb400;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-sfzSection > label select {
  padding-top: 3px;
  padding-bottom: 3px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-fullPartRangeCbDiv {
  margin-top: 20px;
  padding-left: 8px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-fullPartRangeCbDiv > label {
  padding-left: 0px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-fullPartRangeCbDiv > label span {
  font-weight: bold;
  color: #ffb400;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-thisSong .ssd-ss-fullPartRangeCbDiv > label > input {
  margin-left: 2px;
  vertical-align: middle;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-allSongs {
  margin-top: 30px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-allSongs .ssd-ss-ranges {
  margin-top: 10px;
  padding-left: 8px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-allSongs .ssd-ss-ranges > label {
  font-size: 1.2rem;
  display: block;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-allSongs .ssd-ss-ranges > label .select-div {
  margin-left: 3px;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-allSongs .ssd-ss-ranges > label span {
  font-weight: bold;
  color: #ffb400;
}
.song-settings-dialog .dg2-content .dg2-fields-section .ssd-settingsSection .ssd-ss-allSongs .ssd-ss-ranges > label select {
  padding-top: 3px;
  padding-bottom: 3px;
}
.song-settings-dialog .dg2-content .ssd-buttons {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  margin-top: 40px;
}
.song-settings-dialog .dg2-content .ssd-buttons div {
  width: 125px;
}
.song-settings-dialog .dg2-content .ssd-buttons div:not(:first-child) {
  margin-left: 40px;
}
.song-settings-dialog .dg2-content .ssd-buttons div .dg2-button {
  width: 100%;
}

.region-settings-dialog {
  width: 800px;
  max-height: min(700px, 100dvh - 20px);
}
.region-settings-dialog .dg2-content .dg2-fields-section {
  margin-top: 10px;
  padding-right: 10px;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-fieldInstructionsDiv {
  width: 100%;
  text-align: left;
  font-size: 1.1rem;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-fieldInstructionsDiv:not(:first-child) {
  margin-top: 10px;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-combosList {
  margin-top: 20px;
  width: 100%;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-combosList .rsd-comboLI {
  width: 100%;
  display: flex;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-combosList .rsd-comboLI:not(:first-child) {
  margin-top: 20px;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-combosList .rsd-comboLI .rsd-cli-inputDiv {
  width: calc(100% - 40px);
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-combosList .rsd-comboLI .rsd-cli-inputDiv input {
  width: 100%;
  font-size: 1.1rem;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-combosList .rsd-comboLI .rsd-cli-removeDiv {
  margin-left: 10px;
  cursor: pointer;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-combosList .rsd-comboLI.error .rsd-cli-inputDiv input {
  color: #F00;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-addCombo {
  margin-top: 20px;
  width: 100%;
}
.region-settings-dialog .dg2-content .dg2-fields-section .rsd-addCombo .rsd-addComboBtn {
  text-align: center;
}
.region-settings-dialog .dg2-content hr {
  margin-top: 20px;
  width: 100%;
  margin-right: 0px;
}
.region-settings-dialog .dg2-content .rsd-buttons {
  width: 100%;
  justify-content: center;
}
.region-settings-dialog .dg2-content .rsd-buttons .dg2-button {
  width: 120px;
}
.region-settings-dialog .dg2-content .rsd-buttons .dg2-button:not(:first-child) {
  margin-left: 20px;
}

#p-overlay {
  pointer-events: none;
  color: #333;
}

#p-overlay-infoDiv {
  background-color: #494949;
  opacity: 0.85;
  display: flex;
  margin: auto;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  padding: 10px 10px;
  color: #FFF;
  border-radius: 15px;
  max-width: 85%;
}

#p-overlay-title {
  font-size: 36px;
  color: #cdf8ff;
}

#p-overlay-status {
  font-size: 20px;
  margin-top: 20px;
}

#p-overlay-tips {
  margin-top: 30px;
  font-size: 16px;
}

.p-overlay-fade {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 3s, opacity 3s cubic-bezier(1, 0, 0.8, 0);
}

.p-overlay-fade-quick {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 0.5s, opacity 0.5s linear;
}

.exportRecordingDialog {
  max-width: 450px;
  max-height: 100dvh;
  overflow-y: auto;
  justify-content: flex-start;
}
.exportRecordingDialog .erd-instructionsDiv {
  font-size: 1.2rem;
  text-align: left;
}
.exportRecordingDialog .erd-instructionsDiv:not(:first-child) {
  margin-top: 20px;
}
.exportRecordingDialog .erd-shareRecording {
  margin-top: 20px;
}
.exportRecordingDialog .erd-buttons {
  width: 100%;
  justify-content: center;
}
.exportRecordingDialog .erd-buttons div {
  width: 130px;
}
.exportRecordingDialog .erd-buttons div:not(:first-child) {
  margin-left: 20px;
}
.exportRecordingDialog .erd-buttons div .dialog-button {
  width: 100%;
}
.exportRecordingDialog .erd-buttons div.erd-record button {
  background-color: red;
  color: #FFF;
}

.settings-dialog {
  width: 350px;
}
.settings-dialog .oneLineBtnDiv {
  width: 100%;
}
.settings-dialog .oneLineBtnDiv > button {
  width: 100%;
}
.settings-dialog .oneLineBtnDiv:not(:first-child) {
  margin-top: 20px;
}
.settings-dialog .sd-closeBtnDiv {
  margin-top: 40px;
  width: 100%;
}
.settings-dialog .sd-closeBtnDiv > button {
  width: 100px;
}

.song-dev-dialog {
  width: 800px;
  max-height: min(700px, 100dvh - 20px);
}
.song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-seriesDiv, .song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-creditInfoDiv, .song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-priorityInstructions,
.song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-accessLevelInstructions, .song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-rangeInstructions,
.song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-keyInstructions, .song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-detailsSection, .song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-icons,
.song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-showDetailsOnOpen {
  display: block;
}
.song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-priorityDiv, .song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-accessLevelDiv, .song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-rangeDiv,
.song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-keyDiv {
  display: flex;
}
.song-dev-dialog.showAllSettings .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml .sdev-xmlSelectContainer {
  display: flex;
}
.song-dev-dialog.libraryTags .dg2-content .dg2-fields-section .sdev-tagSelectDiv {
  display: block;
}
.song-dev-dialog.communityTags .dg2-content .dg2-fields-section .sdev-communityTag {
  display: block;
}
.song-dev-dialog .dg2-content .dg2-fields-section {
  margin-top: 10px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-fieldInstructionsDiv {
  width: 100%;
  text-align: left;
  font-size: 1.1rem;
  margin-bottom: 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section select {
  font-size: 1.2rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .dg2-textfield > input {
  font-size: 1.2rem;
  padding: 0 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-composerDiv {
  margin-top: 10px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-creditInfoDiv {
  margin-top: 10px;
  display: none;
  width: 100%;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-creditInfoDiv > textarea {
  width: 100%;
  font-family: "Source Sans 3", sans-serif;
  font-size: 1.2rem;
  resize: none;
  padding: 0 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-visibilityRbtnDiv {
  margin-top: 15px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-libraryInstructions {
  margin-top: 15px;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-libraryDiv {
  width: 100%;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-libraryDiv .sdev-libSelect {
  width: 100%;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv {
  margin-top: 25px;
  display: none;
  width: 100%;
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
  padding: 5px 0 10px 0;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-selectSeriesInstructions {
  margin-top: 0;
  width: 100%;
  text-align: left;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesNameAndSelect {
  display: flex;
  align-items: center;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesNameAndSelect .sdev-seriesNameDiv {
  margin-bottom: 0;
  flex: 0 0 auto;
  width: 200px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesNameAndSelect .sdev-seriesNameDiv input {
  font-size: 1.2rem;
  width: 100%;
  padding: 0 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesNameAndSelect .sdev-seriesSelectDiv.select-div {
  flex: 0 0 auto;
  width: 200px;
  margin-left: 20px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesNameAndSelect .sdev-seriesSelectDiv.select-div .sdev-seriesSelect {
  width: 100%;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesNameAndSelect .sdev-removeSeriesDiv {
  margin-left: 15px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesButtons {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  width: 200px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesButtons .sdev-addSeriesDiv button {
  width: 90px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesButtons .sdev-updateSeriesDiv {
  margin-left: 15px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .sdev-seriesButtons .sdev-updateSeriesDiv button {
  width: 90px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesSelection .dg2-button {
  font-size: 1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-positionInstructions {
  margin-top: 15px;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesPositionSelectDiv {
  width: 100%;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-seriesDiv .sdev-seriesPositionSelectDiv .sdev-seriesPositionSelect {
  width: 100%;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-tagInstructions {
  margin-top: 25px;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-tagSelectDiv {
  display: none;
  width: 100%;
  text-align: left;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-tagSelectDiv .sdev-tagSelect {
  width: 100%;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-communityTag {
  display: none;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-priorityInstructions {
  display: none;
  margin-top: 25px;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-priorityDiv {
  margin-top: 5px;
  width: 100%;
  display: flex;
  display: none;
  justify-content: flex-start;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-priorityDiv .sdev-priorityInput {
  width: 100px;
  font-size: 1.2rem;
  padding: 0 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-difficultyInstructions {
  margin-top: 25px;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-difficultyDiv {
  margin-top: 5px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-difficultyDiv .sdev-difficultyInput {
  width: 50px;
  font-size: 1.2rem;
  padding: 0 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-rangeInstructions {
  display: none;
  margin-top: 25px;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-rangeDiv {
  margin-top: 5px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
  display: none;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-rangeDiv .sdev-rangeInput {
  width: 50px;
  font-size: 1.2rem;
  padding: 0 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-keyInstructions {
  display: none;
  margin-top: 25px;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-keyDiv {
  margin-top: 5px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
  display: none;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-keyDiv .sdev-keyInput {
  width: 50px;
  font-size: 1.2rem;
  padding: 0 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-scaleInstructions {
  margin-top: 25px;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-scaleDiv {
  margin-top: 5px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-scaleDiv .sdev-scaleInput {
  width: 50px;
  font-size: 1.2rem;
  padding: 0 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-volumeSettings {
  margin-top: 25px;
  padding-left: 0;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-volumeSettings label > input {
  transform: scale(1.5) translateY(1px);
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-detailsSection {
  margin-top: 20px;
  width: 100%;
  display: none;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-detailsSection .sdev-songDetailsItem {
  width: 100%;
  position: relative;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-detailsSection .sdev-songDetailsItem .sdev-sdi-header {
  font-size: 1.2rem;
  text-align: left;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-detailsSection .sdev-songDetailsItem .sdev-sdi-details {
  width: 100%;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-detailsSection .sdev-songDetailsItem .sdev-sdi-details textarea {
  width: 100%;
  height: 100px;
  resize: none;
  font-size: 1rem;
  padding: 3px 5px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-detailsSection .sdev-songDetailsItem .sdev-sdi-preview {
  position: absolute;
  top: 5px;
  right: 0;
  text-align: right;
  color: rgb(255, 228, 52);
  font-size: 0.9rem;
  cursor: pointer;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-detailsSection .sdev-songDetailsItem .sdev-sdi-preview:hover {
  text-decoration: underline;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-icons {
  display: none;
  width: 100%;
  text-align: center;
  font-size: 1.2rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-icons button {
  padding: 1px 5px;
  border-radius: 5px;
  margin-right: 2px;
  font-size: 1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-showDetailsOnOpen {
  display: none;
  margin-top: 5px;
  padding-left: 0;
  font-size: 1.1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-showDetailsOnOpen label > input {
  transform: scale(1.5) translateY(1px);
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml {
  margin-top: 25px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml .sdev-mp3SelectContainer .sdev-selectMp3 {
  width: 130px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml .sdev-mp3SelectContainer .sdev-selectMp3 .dg2-button {
  width: 100%;
  font-size: 1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml .sdev-mp3SelectContainer .sdev-selectMp3 > input {
  display: none;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml .sdev-xmlSelectContainer {
  margin-left: 30px;
  display: none;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml .sdev-xmlSelectContainer .sdev-selectXml {
  width: 130px;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml .sdev-xmlSelectContainer .sdev-selectXml .dg2-button {
  width: 100%;
  font-size: 1rem;
}
.song-dev-dialog .dg2-content .dg2-fields-section .sdev-mp3AndMusicXml .sdev-xmlSelectContainer .sdev-selectXml > input {
  display: none;
}
.song-dev-dialog .dg2-content .sdev-info {
  font-size: 1.2rem;
  color: #cdf8ff;
  margin-top: 15px;
  min-height: 1.2rem;
}
.song-dev-dialog .dg2-content .sdev-buttons {
  width: 100%;
}
.song-dev-dialog .dg2-content .sdev-buttons button {
  width: 80px;
}

.save-idb-song-dialog {
  width: 400px;
}
.save-idb-song-dialog .sIdbSd-info {
  font-size: 1.2rem;
  color: #cdf8ff;
  margin-top: 15px;
}
.save-idb-song-dialog .sIdbSd-closeBtnDiv {
  margin-top: 20px;
}
.save-idb-song-dialog .sIdbSd-closeBtnDiv > button {
  width: 100px;
}

.series-songs-dialog.dialog2 {
  width: 600px;
  max-height: min(450px, 100dvh - 20px);
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList {
  margin-top: 10px;
  width: 100%;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem {
  cursor: pointer;
  text-align: left;
  border-left: 2px solid rgba(0, 0, 0, 0);
  transition: 0.5s;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem .ssd-sli-info {
  font-size: 1.2rem;
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem .ssd-sli-info .ssd-sli-left {
  flex: 1 1 auto;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem .ssd-sli-info .ssd-sli-left .ssd-sli-number {
  color: #FFF;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem .ssd-sli-info .ssd-sli-left .ssd-sli-title {
  margin-left: 5px;
  color: #a8f5a8;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem .ssd-sli-info .ssd-sli-right {
  flex: 0 0 auto;
  margin-left: 10px;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem .ssd-sli-info .ssd-sli-right .ssd-sli-level {
  display: inline;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem .ssd-sli-info .ssd-sli-right .ssd-sli-proLock, .series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem .ssd-sli-info .ssd-sli-right .ssd-sli-proUnlock {
  display: none;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem:not(:first-child) {
  margin-top: 5px;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem:hover {
  font-weight: bold;
  border-left: 2px solid #ddeeff;
  padding-left: 5px;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem:hover .ssd-sli-info .ssd-sli-title {
  color: #ffb400;
  font-weight: bold;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem.proLock .ssd-sli-info .ssd-sli-proLock {
  display: inline;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-songList .ssd-songListItem.proUnlock .ssd-sli-info .ssd-sli-proUnlock {
  display: inline;
}
.series-songs-dialog.dialog2 .dg2-content .ssd-buttons {
  width: 100%;
  justify-content: center;
}

.lessonDg {
  width: 800px;
  max-height: min(700px, 100dvh - 20px);
}
.lessonDg .dg2-content .dg2-fields-section .ldg-fieldInstructionsDiv {
  margin-top: 10px;
  width: 100%;
  text-align: left;
  font-size: 1.1rem;
  margin-bottom: 5px;
}
.lessonDg .dg2-content .dg2-fields-section select {
  font-size: 1.2rem;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv {
  width: 100%;
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
  padding: 5px 0 10px 0;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpInstructions {
  width: 100%;
  text-align: left;
  font-size: 1.1rem;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpSelectOrInput {
  display: flex;
  align-items: center;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpSelectOrInput .ldg-lpNameDiv {
  margin-bottom: 0;
  flex: 0 0 auto;
  width: 200px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpSelectOrInput .ldg-lpNameDiv input {
  font-size: 1.2rem;
  width: 100%;
  padding: 0 5px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpSelectOrInput .ldg-lpSelectDiv.select-div {
  margin-left: 20px;
  flex: 0 0 auto;
  width: 200px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpSelectOrInput .ldg-lpSelectDiv.select-div .ldg-lpSelect {
  width: 100%;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpSelectOrInput .ldg-lpRemoveDiv {
  margin-left: 15px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpButtons {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  width: 200px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpButtons .ldg-lpAddDiv {
  margin-left: 0;
  width: 90px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpButtons .ldg-lpAddDiv button {
  width: 100%;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpButtons .ldg-lpUpdateDiv {
  margin-left: 15px;
  width: 90px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .ldg-lpButtons .ldg-lpUpdateDiv button {
  width: 100%;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpSelection .dg2-button {
  font-size: 1rem;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-positionInstructions {
  margin-top: 15px;
  font-size: 1.1rem;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpPositionSelectDiv {
  width: 100%;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-lessonPackDiv .ldg-lpPositionSelectDiv .ldg-lpPositionSelect {
  width: 100%;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-accessLevelInstructions {
  margin-top: 20px;
  font-size: 1.1rem;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-accessLevelDiv {
  margin-top: 5px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-accessLevelDiv .ldg-accessLevelInput {
  width: 50px;
  font-size: 1.2rem;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-detailsSection {
  margin-top: 20px;
  width: 100%;
  position: relative;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-detailsSection .ldg-ldi-header {
  font-size: 1.1rem;
  text-align: left;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-detailsSection .ldg-ldi-details {
  width: 100%;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-detailsSection .ldg-ldi-details textarea {
  width: 100%;
  height: 100px;
  resize: none;
  font-size: 1rem;
  padding: 3px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-detailsSection .ldg-ldi-icons {
  width: 100%;
  text-align: center;
  font-size: 1.2rem;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-detailsSection .ldg-ldi-icons button {
  padding: 1px 5px;
  border-radius: 5px;
  margin-right: 2px;
  font-size: 1rem;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-detailsSection .ldg-ldi-preview {
  position: absolute;
  top: 5px;
  right: 0;
  text-align: right;
  color: rgb(255, 228, 52);
  font-size: 0.9rem;
  cursor: pointer;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-detailsSection .ldg-ldi-preview:hover {
  text-decoration: underline;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-messageSection {
  margin-top: 5px;
  width: 100%;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-messageSection .ldg-ms-text {
  width: 100%;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-messageSection .ldg-ms-text textarea {
  width: 100%;
  height: 50px;
  resize: none;
  font-size: 1rem;
  padding: 3px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-autoAssign.dg2-checkbox {
  margin-top: 20px;
  padding-left: 5px;
}
.lessonDg .dg2-content .dg2-fields-section .ldg-autoAssign.dg2-checkbox input {
  transform: scale(1.5) translateY(1px);
}
.lessonDg .dg2-content .ldg-info {
  font-size: 1.2rem;
  color: #cdf8ff;
  margin-top: 15px;
  text-align: center;
}
.lessonDg .dg2-content .ldg-buttons {
  width: 100%;
}
.lessonDg .dg2-content .ldg-buttons button {
  width: 80px;
}

.lessonListDg.dialog {
  max-width: 450px;
  max-height: calc(100% - 10px);
}
.lessonListDg.dialog .lldg-lessonList {
  width: 100%;
  overflow-y: auto;
  max-height: 165px;
  min-height: 50px;
  padding: 5px 30px 5px 5px;
  border-top: 1px solid #777;
}
.lessonListDg.dialog .lldg-lessonList .lldg-lessonListLI {
  cursor: pointer;
  text-align: left;
  border-left: 2px solid rgba(0, 0, 0, 0);
  transition: 0.5s;
  position: relative;
}
.lessonListDg.dialog .lldg-lessonList .lldg-lessonListLI .lldg-llli-info {
  font-size: 1.2rem;
}
.lessonListDg.dialog .lldg-lessonList .lldg-lessonListLI .lldg-llli-info .lldg-llli-title {
  margin-left: 5px;
  color: #a8f5a8;
}
.lessonListDg.dialog .lldg-lessonList .lldg-lessonListLI:not(:first-child) {
  margin-top: 5px;
}
.lessonListDg.dialog .lldg-lessonList .lldg-lessonListLI:hover {
  font-weight: bold;
  border-left: 2px solid #ddeeff;
  padding-left: 5px;
}
.lessonListDg.dialog .lldg-lessonList .lldg-lessonListLI:hover .lldg-llli-info .lldg-llli-title {
  color: #ffb400;
  font-weight: bold;
}
.lessonListDg.dialog .lldg-buttons {
  width: 100%;
  justify-content: center;
}

.lessonPackDg.dialog2 {
  width: 450px;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList {
  width: 100%;
  padding: 5px 60px 5px 5px;
  border-top: 1px solid #777;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem {
  cursor: pointer;
  text-align: left;
  border-left: 2px solid rgba(0, 0, 0, 0);
  transition: 0.5s;
  position: relative;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem .lpdg-lplli-info {
  font-size: 1.2rem;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem .lpdg-lplli-info .lpdg-lplli-specialAccess {
  display: none;
  background-color: #ddeeff;
  color: #303030;
  font-weight: bold;
  font-family: "Montserrat", sans-serif;
  padding: 0 5px;
  border-radius: 50%;
  font-size: 0.9rem;
  position: absolute;
  right: -30px;
  top: 3px;
  box-shadow: inset 0.15em 0.15em 0.15em 0 rgba(255, 255, 255, 0.5), inset -0.15em -0.15em 0.15em 0 rgba(0, 0, 0, 0.5);
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem .lpdg-lplli-info .lpdg-lplli-proLock, .lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem .lpdg-lplli-info .lpdg-lplli-proUnlock {
  display: none;
  position: absolute;
  right: -60px;
  padding: 0 3px;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem .lpdg-lplli-info .lpdg-lplli-number {
  color: #FFF;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem .lpdg-lplli-info .lpdg-lplli-title {
  margin-left: 5px;
  color: #a8f5a8;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem:not(:first-child) {
  margin-top: 5px;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem:hover {
  font-weight: bold;
  border-left: 2px solid #ddeeff;
  padding-left: 5px;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem:hover .lpdg-lplli-info .lpdg-lplli-title {
  color: #ffb400;
  font-weight: bold;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem.specialAccess .lpdg-lplli-info .lpdg-lplli-specialAccess {
  display: inline;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem.proLock .lpdg-lplli-info .lpdg-lplli-proLock {
  display: inline;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-lpLessonList .lpdg-lplListItem.proUnlock .lpdg-lplli-info .lpdg-lplli-proUnlock {
  display: inline;
}
.lessonPackDg.dialog2 .dg2-content .lpdg-buttons {
  width: 100%;
  justify-content: center;
}

.p-uploadDg {
  max-width: 500px;
}
.p-uploadDg .p-uploadDg-description {
  font-size: 1.2rem;
  text-align: left;
}
.p-uploadDg .dialog-fields-section .p-uploadDg-checkbox {
  margin-top: 10px;
}
.p-uploadDg .p-uploadDg-info {
  font-size: 1.5rem;
  color: #cdf8ff;
}
.p-uploadDg .p-uploadDg-buttons {
  margin-top: 25px;
  display: flex;
  justify-content: space-between;
  width: 200px;
}

.custom-range-dialog {
  width: 410px;
}
.custom-range-dialog .dg2-content .crd-description {
  margin-top: 10px;
  text-align: left;
  font-size: 1.2rem;
}
.custom-range-dialog .dg2-content .crd-rangesDiv {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 15px;
}
.custom-range-dialog .dg2-content .crd-rangesDiv .crd-label {
  margin-right: 10px;
  border: 1px solid #888;
  font-size: 1.2rem;
  padding: 0 5px;
  border-radius: 3px;
}
.custom-range-dialog .dg2-content .crd-rangesDiv .crd-lowPitchValue {
  width: 58px;
  text-align: center;
}
.custom-range-dialog .dg2-content .crd-rangesDiv .crd-spinners {
  display: flex;
  flex-direction: column;
}
.custom-range-dialog .dg2-content .crd-rangesDiv .crd-spinners > div {
  cursor: pointer;
}
.custom-range-dialog .dg2-content .crd-rangesDiv .crd-spinners > div:active {
  transform: translate(0px, 1px);
}
.custom-range-dialog .dg2-content .crd-rangesDiv .crd-spinners > .crd-shape-arrow-down {
  margin-top: 7px;
}
.custom-range-dialog .dg2-content .crd-rangesDiv .crd-highPitchValue {
  margin-left: 20px;
  width: 58px;
  text-align: center;
}
.custom-range-dialog .dg2-content .dg2-buttons-section {
  margin-top: 30px;
}
.custom-range-dialog .dg2-content .dg2-buttons-section button {
  width: 100px;
}
.custom-range-dialog .dg2-content .dg2-buttons-section {
  width: 250px;
}
.custom-range-dialog .dg2-content .crd-shape-arrow-up {
  width: 0;
  height: 0;
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  border-bottom: 13px solid rgb(137, 222, 248);
}
.custom-range-dialog .dg2-content .crd-shape-arrow-down {
  width: 0;
  height: 0;
  border-left: 13px solid transparent;
  border-right: 13px solid transparent;
  border-top: 13px solid rgb(137, 222, 248);
}

.clip-settings.dialog2 {
  width: 550px;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section {
  width: 100%;
  font-size: 1.2rem;
  text-align: left;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section > div {
  width: 100%;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section > div:not(:first-child) {
  margin-top: 15px;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section .cs-clipRangeRole {
  display: flex;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section .cs-clipRangeRole > div:not(:first-child) {
  margin-left: 10px;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section .cs-clipRange > .cs-clipRangeCbDiv.dg2-checkbox > label {
  cursor: pointer;
  padding-left: 15px;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section .cs-clipRange > .cs-clipRangeCbDiv.dg2-checkbox > label > input {
  cursor: pointer;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section .cs-clipRange > .cs-clipRangeFamilyCbDiv.dg2-checkbox {
  display: none;
  margin-top: 10px;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section .cs-clipRange > .cs-clipRangeFamilyCbDiv.dg2-checkbox > label {
  cursor: pointer;
  padding-left: 15px;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section .cs-clipRange > .cs-clipRangeFamilyCbDiv.dg2-checkbox > label > input {
  cursor: pointer;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section select {
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section select:hover {
  background-color: #494D5F;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section select:focus {
  background-color: #222;
}
.clip-settings.dialog2 .dg2-content .dg2-fields-section select {
  text-align: center;
  background-color: rgba(0, 0, 0, 0);
  padding: 2px 10px;
  font-size: 1.2rem;
  color: #DDD;
  transform: translateY(1px);
  width: 100%;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .clip-settings.dialog2 .dg2-content .dg2-fields-section select {
    font-size: 1rem;
  }
}
.clip-settings.dialog2 .dg2-content .dg2-buttons-section {
  margin-top: 30px;
}
.clip-settings.dialog2 .dg2-content .dg2-buttons-section button {
  width: 100px;
}
.clip-settings.dialog2 .dg2-content .dg2-buttons-section {
  width: 250px;
}

.clip-order.dialog2 {
  width: 450px;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section {
  margin-top: 10px;
  width: 100%;
  font-size: 1.2rem;
  text-align: left;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section > div {
  width: 100%;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section > div:not(:first-child) {
  margin-top: 15px;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section .co-clipOrderType {
  display: flex;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section .co-clipOrderType > div:not(:first-child) {
  margin-left: 10px;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section .co-clipOrder {
  display: flex;
  align-items: center;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section .co-clipOrder .co-coSelectDiv {
  width: 330px;
  border-bottom: 1px solid #CCC;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section .co-clipOrder .co-coSelectDiv .co-coSelect {
  width: 100%;
  height: 100%;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section .co-clipOrder .co-coButtons {
  margin-left: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section .co-clipOrder .co-coButtons > div:not(:first-child) {
  margin-top: 20px;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section .co-clipOrder .co-coButtons > div .dg2-button {
  padding: 3px 7px;
  width: 80px;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section select {
  background-color: #222;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section select:hover {
  background-color: #494D5F;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section select:focus {
  background-color: #222;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section select:hover {
  background-color: #222;
}
.clip-order.dialog2 .dg2-content .dg2-fields-section select {
  text-align: left;
  background-color: rgba(0, 0, 0, 0);
  padding: 2px 10px;
  font-size: 1.2rem;
  color: #DDD;
  transform: translateY(1px);
  width: 100%;
}
@media screen and (max-width: 1500px), screen and (max-height: 1000px) {
  .clip-order.dialog2 .dg2-content .dg2-fields-section select {
    font-size: 1rem;
  }
}
.clip-order.dialog2 .dg2-content .dg2-buttons-section {
  margin-top: 30px;
}
.clip-order.dialog2 .dg2-content .dg2-buttons-section button {
  width: 100px;
}
.clip-order.dialog2 .dg2-content .dg2-buttons-section {
  width: 375px;
}

.cfm-overlay {
  background-color: rgba(255, 255, 255, 0.25);
  z-index: 100;
}

.cfm-confirmationBox {
  width: 300px;
  font-size: 1.5rem;
  font-family: "Source Sans 3", sans-serif;
}
.cfm-confirmationBox .dg2-content .cfm-verification {
  width: 100%;
}
.cfm-confirmationBox .dg2-content .cfm-verification .cfm-verificationInput {
  width: 100%;
  font-size: 1.2rem;
}
.cfm-confirmationBox .dg2-content .cfm-buttonsDiv {
  margin-top: 25px;
  width: 100%;
  display: flex;
  justify-content: space-around;
}
.cfm-confirmationBox .dg2-content .cfm-buttonsDiv button {
  display: block;
  font-size: 1.5rem;
  font-family: "Source Sans 3", sans-serif;
  padding: 3px 10px;
  border-radius: 8px;
  cursor: pointer;
  background-color: #fcbb43;
  color: #FFF;
  text-shadow: 1px 1px 0px #888;
}

.device-setup-dialog {
  width: 750px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.device-setup-dialog .dg2-content .dg2-fields-section {
  margin-top: 10px;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-fieldInstructionsDiv {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  margin-bottom: 8px;
}
.device-setup-dialog .dg2-content .dg2-fields-section .select-div {
  width: 100%;
  margin-bottom: 20px;
}
.device-setup-dialog .dg2-content .dg2-fields-section select {
  width: 100%;
  font-size: 1.2rem;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-micLevelAndNS {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-micLevelAndNS .dsd-micLevelIndicator {
  height: 30px;
  flex: 1 1 auto;
  background: linear-gradient(0.25turn, #00F, 15%, #0F0, 25%, #0F0, 75%, #0F0, 90%, #F00);
  border: 1px solid #222;
  border-radius: 5px;
  margin-bottom: 30px;
  display: flex;
  justify-content: flex-end;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-micLevelAndNS .dsd-micLevelIndicator .dsd-mli-Cover {
  flex: 0 0 auto;
  width: 100%;
  height: 100%;
  opacity: 0.7;
  background-color: #000;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-micLevelAndNS .dsd-noiseSuppression {
  width: 250px;
  text-align: right;
  padding-top: 3px;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-headphonesCbDiv {
  margin-top: -15px;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-cameraSection {
  margin-top: 20px;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-cameraSection .dsd-cameraSettings {
  flex: 1 0 auto;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-cameraSection .dsd-cameraSettings .dsd-useCameraCbDiv {
  margin-bottom: 10px;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-cameraSection .dsd-videoPreview {
  flex: 0 0 auto;
  margin-left: 20px;
  width: 75px;
  aspect-ratio: 1;
  border: 1px solid #888;
  overflow: hidden;
  position: relative;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-cameraSection .dsd-videoPreview #videoContainer {
  width: 100%;
  height: 100%;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-cameraSection .dsd-videoPreview #videoContainer video {
  aspect-ratio: 1;
  height: 100%;
  max-width: 100%;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-instructions-div {
  margin-top: 20px;
  text-align: left;
  font-size: 1.2rem;
  width: 100%;
}
.device-setup-dialog .dg2-content .dg2-fields-section .dsd-instructions-div span {
  color: #ffb400;
}
.device-setup-dialog .dg2-content .dsd-buttons {
  justify-content: center;
}
.device-setup-dialog .dg2-content .dsd-buttons .dsd-finishBtn {
  width: 125px;
}

.audio-settings-dialog {
  width: 600px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.audio-settings-dialog.hideMeetingSettings .dg2-content .dg2-fields-section .asd-settingsSection {
  display: none;
}
.audio-settings-dialog .dg2-content .dg2-fields-section {
  max-height: 500px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection {
  margin-top: 0px;
  margin-right: 5px;
  border: 1px dashed #AAA;
  padding: 10px 15px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-title {
  text-align: left;
  font-size: 1.5rem;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-instructions {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-instructions:not(:first-child) {
  margin-top: 10px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-instructions span {
  color: rgb(255, 228, 52);
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults {
  margin-top: 20px;
  margin-right: 5px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults .asd-ds-testBtnDiv {
  width: 120px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults .asd-ds-testBtnDiv .asd-ds-testBtn {
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults .asd-ds-testBtnDiv .asd-ds-testBtn:hover {
  background-color: #494D5F;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults .asd-ds-testBtnDiv .asd-ds-testBtn {
  width: 100%;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults .asd-ds-resetBtnDiv {
  margin-left: 20px;
  width: 120px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults .asd-ds-resetBtnDiv .asd-ds-resetBtn {
  width: 100%;
  background-color: #333;
  border: 1px solid #CCC;
  color: #FFF;
  text-shadow: 1px 1px 2px #555;
  box-shadow: 1px 1px 2px #000;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults .asd-ds-resetBtnDiv .asd-ds-resetBtn:hover {
  background-color: #494D5F;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-delaySection .asd-ds-testAndResults .asd-ds-resultsDiv {
  margin-left: 30px;
  font-size: 1.2rem;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-settingsSection {
  width: 100%;
  margin-top: 20px;
  margin-right: 5px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-settingsSection .asd-ss-muteOnRecordDiv.dg2-checkbox > label {
  padding-left: 10px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-settingsSection .asd-ss-muteOnRecordDiv.dg2-checkbox > label > input {
  margin-left: -10px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-settingsSection .asd-ss-autoDuckingDiv {
  margin-top: 20px;
  text-align: left;
  padding-left: 1px;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-settingsSection .asd-ss-autoDuckingDiv > label {
  padding-left: 15px;
  font-size: 1.2rem;
  display: block;
}
.audio-settings-dialog .dg2-content .dg2-fields-section .asd-settingsSection .asd-ss-autoDuckingDiv > label .asd-ss-duckingInput {
  margin-left: -15px;
  font-size: 1.2rem;
  width: 50px;
  margin-right: 5px;
  border-radius: 5px;
  padding-left: 5px;
}
.audio-settings-dialog .dg2-content .asd-buttons {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}
.audio-settings-dialog .dg2-content .asd-buttons div {
  width: 125px;
}
.audio-settings-dialog .dg2-content .asd-buttons div:not(:first-child) {
  margin-left: 40px;
}
.audio-settings-dialog .dg2-content .asd-buttons div .dg2-button {
  width: 100%;
}

.mixdown-dialog {
  width: 600px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.mixdown-dialog .dg2-content .dg2-fields-section .md-instructions {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.mixdown-dialog .dg2-content .dg2-fields-section .md-fadeDiv {
  width: 100%;
  margin-top: 20px;
  text-align: left;
}
.mixdown-dialog .dg2-content .dg2-fields-section .md-fadeDiv > label {
  font-size: 1.2rem;
  display: block;
}
.mixdown-dialog .dg2-content .dg2-fields-section .md-fadeDiv > label .md-fadeInput {
  margin-left: 5px;
  margin-right: 15px;
  font-size: 1.2rem;
  width: 50px;
  margin-right: 5px;
  border-radius: 5px;
  padding-left: 5px;
}
.mixdown-dialog .dg2-content .md-buttons {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}
.mixdown-dialog .dg2-content .md-buttons div {
  width: 125px;
}
.mixdown-dialog .dg2-content .md-buttons div:not(:first-child) {
  margin-left: 40px;
}
.mixdown-dialog .dg2-content .md-buttons div .dg2-button {
  width: 100%;
}

.my-communities-dg.dialog2 {
  width: 800px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.my-communities-dg.dialog2 .dg2-content .dg2-header {
  flex: 0 0 auto;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section {
  margin-top: 10px;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-description {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv {
  margin-top: 20px;
  width: 100%;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable {
  width: 100%;
  background-color: #000;
  border: 1px solid #CCC;
  padding: 5px;
  text-align: center;
  border-collapse: collapse;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable thead {
  color: #0F0;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable thead th {
  border: 1 px solid #AAA;
  padding: 5px;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable thead th:not(:first-child) {
  border-left: 1px solid #999;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable tbody {
  padding-top: 15px;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable tbody td {
  border-top: 1px solid #999;
  padding: 5px;
  margin-left: 0;
  font-family: monospace;
  font-size: 1.1rem;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable tbody td:not(:first-child) {
  border-left: 1px solid #999;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable tbody td > a {
  color: #ffb400;
  cursor: pointer;
}
.my-communities-dg.dialog2 .dg2-content .dg2-fields-section .mcd-communitiesTableDiv .mcd-communitiesTable tbody td > a:hover {
  text-decoration: underline;
}
.my-communities-dg.dialog2 .dg2-content .mcd-buttons.dg2-buttons-section {
  margin-top: 30px;
  justify-content: center;
  width: 300px;
}
.my-communities-dg.dialog2 .dg2-content .mcd-buttons.dg2-buttons-section .mcd-addCommunityBtn {
  width: 240px;
}
.my-communities-dg.dialog2 .dg2-content .mcd-buttons.dg2-buttons-section .mcd-finishBtn {
  margin-left: 30px;
  width: 125px;
}
.my-communities-dg.dialog2 .dg2-content .mcd-buttons.dg2-buttons-section button {
  background-color: #ff9500;
  color: #FFF;
  display: block;
}

.add-community-dg.dialog2 {
  width: 720px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.add-community-dg.dialog2 .dg2-content .dg2-header {
  flex: 0 0 auto;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-fieldInstructionsDiv {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  margin-bottom: 5px;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-nameDiv {
  width: 100%;
  text-align: left;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-nameDiv input {
  font-size: 1.2rem;
  width: 100%;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-typeRbtnDiv {
  margin-top: 20px;
  width: 100%;
  text-align: left;
  padding: 0;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-typeRbtnDiv .dg2-verticalRadioBtnGroup {
  margin-top: 10px;
  text-align: left;
  padding: 0;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-typeRbtnDiv .acd-edCommunityInstructions {
  margin-top: 5px;
  color: #CFC;
  font-size: 0.9rem;
  font-style: italic;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-typeRbtnDiv .acd-edCommunityInstructions a {
  color: #fcbb43;
  text-decoration: underline;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-activeDiv {
  margin-top: 30px;
  width: 100%;
  text-align: left;
  padding-left: 5px;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-activeDiv label, .add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-activeDiv label > input {
  cursor: pointer;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-codeDiv {
  width: 100%;
  text-align: left;
  margin-top: 15px;
  font-size: 1.5rem;
  color: #ffb400;
  display: none;
  font-family: monospace;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-codeDiv button {
  background-color: #ff9500;
  color: #FFF;
  font-size: 1.1rem;
  margin-top: -2px;
  margin-left: 10px;
}
.add-community-dg.dialog2 .dg2-content .dg2-fields-section .acd-message {
  margin-top: 30px;
  width: 100%;
  font-size: 1.2rem;
  text-align: left;
  color: #FF0;
}
.add-community-dg.dialog2 .dg2-content .acd-buttons.dg2-buttons-section {
  margin-top: 30px;
  justify-content: center;
  width: 300px;
}
.add-community-dg.dialog2 .dg2-content .acd-buttons.dg2-buttons-section .acd-saveBtn {
  width: 125px;
}
.add-community-dg.dialog2 .dg2-content .acd-buttons.dg2-buttons-section .acd-closeBtn {
  margin-left: 30px;
  width: 125px;
}
.add-community-dg.dialog2 .dg2-content .acd-buttons.dg2-buttons-section button {
  background-color: #ff9500;
  color: #FFF;
  display: block;
}

.community-members-dialog.dialog2 {
  width: 500px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.community-members-dialog.dialog2.showSettings .dg2-content .dg2-fields-section .cmd-settings {
  display: block;
}
.community-members-dialog.dialog2 .dg2-content .dg2-header {
  flex: 0 0 auto;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section {
  flex: 1 1 auto;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-sectionHeader {
  width: 100%;
  text-align: left;
  font-size: 1.1rem;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .label-and-selectDiv {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .label-and-selectDiv label {
  font-size: 1.1rem;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .label-and-selectDiv .select-div {
  flex-grow: 1;
  margin-left: 10px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .label-and-selectDiv .select-div select {
  width: 100%;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .dg2-checkbox {
  font-size: 1.1rem;
  padding-left: 1px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .dg2-checkbox > label > input {
  transform: scale(1.5) translateY(1px);
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-userSelection {
  margin-top: 20px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings {
  display: none;
  margin-top: 10px;
  width: 100%;
  padding: 10px;
  border: 1px solid #888;
}
@media screen and (max-height: 750px) {
  .community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings {
    flex: 0 3 auto;
  }
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings .cmd-teacherSessions {
  margin-top: 10px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings .cmd-openSongs {
  margin-top: 10px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings .cmd-addSongs {
  margin-top: 10px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings .cmd-interaction {
  margin-top: 10px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings .cmd-access {
  width: 100%;
  text-align: left;
  margin-top: 10px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings .cmd-access label {
  font-size: 1.1rem;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings .cmd-access label .cmd-accessInput {
  padding: 1px 5px;
  font-size: 1.1rem;
  width: 50px;
  margin-left: 5px;
}
.community-members-dialog.dialog2 .dg2-content .dg2-fields-section .cmd-settings .cmd-msgDiv {
  margin-top: 20px;
  width: 100%;
  text-align: center;
  color: #ffb400;
}
.community-members-dialog.dialog2 .dg2-content .cmd-buttons {
  margin-top: 30px;
}

.edit-user-summary-dialog {
  width: 600px;
  max-width: 600px;
  max-height: 100dvh;
  overflow-y: auto;
  justify-content: flex-start;
  text-align: left;
}
.edit-user-summary-dialog .eusd-fieldInstructionsDiv {
  width: 100%;
  text-align: left;
  font-size: 1.5rem;
  margin-bottom: 5px;
  color: #cdf8ff;
}
.edit-user-summary-dialog .eusd-photo {
  width: 100%;
}
.edit-user-summary-dialog .eusd-photo .eusd-photoDivSection {
  display: flex;
  justify-content: center;
  align-items: center;
}
.edit-user-summary-dialog .eusd-photo .eusd-photoDivSection .eusd-photoDiv {
  width: 150px;
  height: 150px;
  border: 1px solid #999;
}
.edit-user-summary-dialog .eusd-photo .eusd-photoDivSection .eusd-photoDiv img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.edit-user-summary-dialog .eusd-photo .eusd-photoDivSection .eusd-photoControls {
  margin-left: 35px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.edit-user-summary-dialog .eusd-photo .eusd-photoDivSection .eusd-photoControls .dialog-button {
  width: 120px;
}
.edit-user-summary-dialog .eusd-photo .eusd-photoDivSection .eusd-photoControls .eusd-choosePhoto .eusd-fileInput {
  display: none;
}
.edit-user-summary-dialog .eusd-photo .eusd-photoDivSection .eusd-photoControls .eusd-uploadPhoto {
  margin-top: 15px;
}
.edit-user-summary-dialog .eusd-photo .eusd-photoDivSection .eusd-photoControls .eusd-removePhoto {
  margin-top: 15px;
}
.edit-user-summary-dialog .eusd-actionStatement {
  margin-top: 30px;
  width: 100%;
  font-size: 1.2rem;
}
.edit-user-summary-dialog .eusd-actionStatement .eusd-actionInputSection {
  margin-top: 10px;
  display: flex;
}
.edit-user-summary-dialog .eusd-actionStatement .eusd-actionInputSection .eusd-actionStatementLeft {
  flex: 0 0 auto;
  margin-left: 15px;
}
.edit-user-summary-dialog .eusd-actionStatement .eusd-actionInputSection .eusd-actionStatementRight {
  flex: 1 1 auto;
  margin-left: 10px;
}
.edit-user-summary-dialog .eusd-actionStatement .eusd-actionInputSection .eusd-actionStatementRight input {
  font-size: 1.2rem;
  padding: 0 3px;
  width: 100%;
}
.edit-user-summary-dialog .eusd-actionStatement .eusd-actionInputSection .eusd-actionStatementRight .eusd-actionExample {
  font-size: 0.9rem;
  margin-top: 3px;
  padding-left: 5px;
  color: #DDD;
}
.edit-user-summary-dialog .eusd-bio {
  margin-top: 30px;
  width: 100%;
}
.edit-user-summary-dialog .eusd-bio .eusd-bioInputDiv .eusd-bioTA {
  resize: none;
  font-size: 1rem;
  padding: 3px;
  width: 100%;
  height: 70px;
}
.edit-user-summary-dialog .eusd-info {
  font-size: 1.2rem;
  color: #cdf8ff;
  margin-top: 15px;
}
.edit-user-summary-dialog .eusd-buttons {
  width: 300px;
}
.edit-user-summary-dialog .eusd-buttons button {
  width: 100px;
}

.user-profile-dialog {
  max-width: 600px;
  width: 600px;
  text-align: left;
}
.user-profile-dialog .upd-photoAndBio {
  width: 100%;
  display: flex;
  justify-content: flex-start;
}
.user-profile-dialog .upd-photoAndBio .upd-photo {
  width: 200px;
  flex: 0 0 auto;
}
.user-profile-dialog .upd-photoAndBio .upd-photo .upd-photoDiv {
  width: 200px;
  height: 200px;
  border: 1px solid #999;
}
.user-profile-dialog .upd-photoAndBio .upd-photo .upd-photoDiv img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.user-profile-dialog .upd-photoAndBio .upd-bio {
  flex: 1 1 auto;
  margin-left: 20px;
}
.user-profile-dialog .upd-photoAndBio .upd-bio .upd-actionStatement {
  text-align: left;
  font-size: 1.2rem;
  color: #cdf8ff;
}
.user-profile-dialog .upd-photoAndBio .upd-bio .upd-details {
  margin-top: 15px;
  text-align: left;
  font-size: 1rem;
}
.user-profile-dialog .upd-buttons {
  margin-top: 30px;
  width: 100%;
  justify-content: center;
}
.user-profile-dialog .upd-buttons button {
  width: 100px;
}

.checkout-dialog {
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  display: flex;
  justify-content: center;
  align-content: center;
  height: 500px;
  max-height: calc(100% - 20px);
  width: 500px;
  max-width: 100dvw;
  background-color: #FFF;
}
@media only screen and (max-width: 600px) {
  .checkout-dialog #payment-form {
    width: 80dvw;
    min-width: initial;
  }
}
.checkout-dialog {
  /* Buttons and links */
}
.checkout-dialog button {
  background: #5469d4;
  font-family: Arial, sans-serif;
  color: #ffffff;
  border-radius: 4px;
  border: 0;
  padding: 12px 16px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  display: block;
  transition: all 0.2s ease;
  box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07);
  width: 100%;
}
.checkout-dialog button:hover {
  filter: contrast(115%);
}
.checkout-dialog button:disabled {
  opacity: 0.5;
  cursor: default;
}
.checkout-dialog #payment-form {
  width: 500px;
  min-width: 500px;
  align-self: center;
  padding: 40px;
}
.checkout-dialog #payment-form #payment-message {
  color: rgb(105, 115, 134);
  font-size: 16px;
  line-height: 20px;
  padding-top: 12px;
  text-align: center;
}
.checkout-dialog #payment-form #payment-element {
  margin-bottom: 24px;
}
.checkout-dialog #payment-form {
  /* spinner/processing state, errors */
}
.checkout-dialog #payment-form .spinner,
.checkout-dialog #payment-form .spinner:before,
.checkout-dialog #payment-form .spinner:after {
  border-radius: 50%;
}
.checkout-dialog #payment-form .spinner {
  color: #ffffff;
  font-size: 22px;
  text-indent: -99999px;
  margin: 0px auto;
  position: relative;
  width: 20px;
  height: 20px;
  box-shadow: inset 0 0 0 2px;
  transform: translateZ(0);
}
.checkout-dialog #payment-form .spinner:before,
.checkout-dialog #payment-form .spinner:after {
  position: absolute;
  content: "";
}
.checkout-dialog #payment-form .spinner:before {
  width: 10.4px;
  height: 20.4px;
  background: #5469d4;
  border-radius: 20.4px 0 0 20.4px;
  top: -0.2px;
  left: -0.2px;
  transform-origin: 10.4px 10.2px;
  animation: loading 2s infinite ease 1.5s;
}
.checkout-dialog #payment-form .spinner:after {
  width: 10.4px;
  height: 10.2px;
  background: #5469d4;
  border-radius: 0 10.2px 10.2px 0;
  top: -0.1px;
  left: 10.2px;
  transform-origin: 0px 10.2px;
  animation: loading 2s infinite ease;
}
.checkout-dialog #cancelBtnDiv {
  width: 500px;
  padding: 0 40px;
}
.checkout-dialog .hidden {
  display: none;
}
@keyframes loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.membershipAndCheckoutOverlay.showCheckout .buy-membership-dg.dialog2 .dg2-content .bsd-checkoutDiv {
  display: block;
}
.membershipAndCheckoutOverlay.showCheckout .buy-membership-dg.dialog2 .dg2-content .dg2-fields-section {
  display: none;
}
.membershipAndCheckoutOverlay.showCheckout .buy-membership-dg.dialog2 .dg2-content .bsd-buttons .bsd-checkoutBtn, .membershipAndCheckoutOverlay.showCheckout .buy-membership-dg.dialog2 .dg2-content .bsd-buttons .bsd-closeBtn {
  display: none;
}
.membershipAndCheckoutOverlay.showCheckout .buy-membership-dg.dialog2 .dg2-content .bsd-buttons .bsd-cancelCheckoutBtn {
  display: block;
}

.buy-membership-dg.dialog2 {
  width: 900px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.buy-membership-dg.dialog2 .dg2-content .bsd-checkoutDiv {
  display: none;
  width: 100%;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-header {
  flex: 0 0 auto;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section {
  padding: 1px 15px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-special-offer {
  font-size: 1.5rem;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-fieldInstructionsDiv {
  margin-top: 10px;
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  margin-bottom: 5px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits {
  margin-top: 10px;
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-benefitsListDiv {
  margin-top: 10px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-benefitsListDiv .bsd-benefitsList {
  padding-left: 25px;
  color: #cdf8ff;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv {
  margin-top: 0px;
  width: 100%;
  display: flex;
  flex-direction: row;
  overflow-x: scroll;
  padding-bottom: 10px;
  cursor: pointer;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn {
  flex: 0 0 auto;
  width: 500px;
  border: 1px solid #CCC;
  background-color: #000;
  border-radius: 10px;
  padding: 10px 10px 60px 10px;
  position: relative;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn .planHeader.dg2-horizontalRadioBtnGroup {
  width: 100%;
  text-align: left;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn .planHeader.dg2-horizontalRadioBtnGroup > label {
  display: block;
  width: 100%;
  cursor: pointer;
  font-size: 1.2rem;
  font-weight: bold;
  color: #cdf8ff;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn .planHeader.dg2-horizontalRadioBtnGroup > label > input {
  margin-left: -33px;
  width: 22px;
  height: 22px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn .planHeader.dg2-horizontalRadioBtnGroup > label span {
  font-weight: bold;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn .planDescription {
  margin-top: 15px;
  padding-left: 20px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn .planDescription li:not(:first-child) {
  margin-top: 10px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn .planPrice {
  position: absolute;
  bottom: 10px;
  text-align: center;
  width: calc(100% - 20px);
  font-size: 1.2rem;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn .planPrice .priceText span {
  font-size: 1.5rem;
  font-weight: bold;
  display: inline-block;
  transform: translateY(1px);
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn:not(:first-child) {
  margin-left: 20px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn.isForCode .planPrice > input {
  display: initial;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-benefits .bsd-plansDiv .planColumn.isForCode .planPrice .priceText {
  display: none;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-coupon {
  margin-top: 20px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-coupon .bsd-couponText {
  font-size: 1.2rem;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-coupon .bsd-couponInputDiv {
  margin-left: 10px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-coupon .bsd-couponInputDiv > input {
  width: calc(100% - 10px);
  font-size: 1.2rem;
  padding: 2px 5px;
  border-radius: 5px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-coupon .bsd-redeemBtnDiv {
  margin-left: 10px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-coupon .bsd-redeemBtnDiv .bsd-redeemBtn {
  font-size: 1.1rem;
  padding-top: 3px;
  padding-bottom: 3px;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-currentPlan {
  margin-top: 30px;
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.buy-membership-dg.dialog2 .dg2-content .dg2-fields-section .bsd-message {
  margin-top: 30px;
  width: 100%;
  font-size: 1.2rem;
  text-align: center;
  color: #FF0;
}
.buy-membership-dg.dialog2 .dg2-content .bsd-buttons.dg2-buttons-section {
  margin-top: 30px;
  justify-content: center;
  width: 300px;
}
.buy-membership-dg.dialog2 .dg2-content .bsd-buttons.dg2-buttons-section .bsd-checkoutBtn {
  width: 175px;
}
.buy-membership-dg.dialog2 .dg2-content .bsd-buttons.dg2-buttons-section .bsd-checkoutBtn:disabled {
  background-color: #AAA;
  color: #CCC;
}
.buy-membership-dg.dialog2 .dg2-content .bsd-buttons.dg2-buttons-section .bsd-closeBtn {
  margin-left: 30px;
  width: 175px;
}
.buy-membership-dg.dialog2 .dg2-content .bsd-buttons.dg2-buttons-section .bsd-cancelCheckoutBtn {
  display: none;
  width: 200px;
}
.buy-membership-dg.dialog2 .dg2-content .bsd-buttons.dg2-buttons-section button {
  background-color: #ff9500;
  color: #FFF;
  display: block;
}

.membershipAndCheckoutOverlay.showCheckout .no-user-pro-dg.dialog2 .dg2-content .nup-checkoutDiv {
  display: block;
}
.membershipAndCheckoutOverlay.showCheckout .no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section {
  display: none;
}
.membershipAndCheckoutOverlay.showCheckout .no-user-pro-dg.dialog2 .dg2-content .nup-buttons .nup-checkoutBtn, .membershipAndCheckoutOverlay.showCheckout .no-user-pro-dg.dialog2 .dg2-content .nup-buttons .nup-closeBtn {
  display: none;
}
.membershipAndCheckoutOverlay.showCheckout .no-user-pro-dg.dialog2 .dg2-content .nup-buttons .nup-cancelCheckoutBtn {
  display: block;
}

.no-user-pro-dg.dialog2 {
  width: 600px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.no-user-pro-dg.dialog2 .dg2-content .nup-checkoutDiv {
  display: none;
  width: 100%;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-header {
  flex: 0 0 auto;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section {
  margin-top: 10px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-special-offer {
  font-size: 1.5rem;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-fieldInstructionsDiv {
  margin-top: 10px;
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  margin-bottom: 5px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-benefitsListDiv {
  margin-top: 10px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-benefitsListDiv .nup-benefitsList {
  padding-left: 25px;
  color: #cdf8ff;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv {
  margin-top: 0px;
  width: 100%;
  display: flex;
  flex-direction: row;
  overflow-x: scroll;
  padding-bottom: 10px;
  cursor: pointer;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn {
  flex: 0 0 auto;
  width: 100%;
  border: 1px solid #CCC;
  background-color: #000;
  border-radius: 10px;
  padding: 10px 10px 60px 10px;
  position: relative;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn .planHeader.dg2-horizontalRadioBtnGroup {
  width: 100%;
  text-align: left;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn .planHeader.dg2-horizontalRadioBtnGroup > label {
  display: block;
  width: 100%;
  cursor: pointer;
  font-size: 1.2rem;
  font-weight: bold;
  color: #cdf8ff;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn .planHeader.dg2-horizontalRadioBtnGroup > label > input {
  margin-left: -33px;
  width: 22px;
  height: 22px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn .planHeader.dg2-horizontalRadioBtnGroup > label span {
  font-weight: bold;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn .planDescription {
  margin-top: 15px;
  padding-left: 20px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn .planDescription li:not(:first-child) {
  margin-top: 10px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn .planPrice {
  position: absolute;
  bottom: 10px;
  text-align: center;
  width: calc(100% - 20px);
  font-size: 1.2rem;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn .planPrice .priceText span {
  font-size: 1.5rem;
  font-weight: bold;
  display: inline-block;
  transform: translateY(1px);
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn:not(:first-child) {
  margin-left: 20px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn.isForCode .planPrice > input {
  display: initial;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-benefits .nup-plansDiv .planColumn.isForCode .planPrice .priceText {
  display: none;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-activationCodeSection {
  margin-top: 10px;
  width: 100%;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-activationCodeSection .nup-activationControls {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-activationCodeSection .nup-activationControls .nup-codeInputDiv {
  flex: 1 1 0;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-activationCodeSection .nup-activationControls .nup-codeInputDiv .nup-codeInput {
  width: 100%;
  font-size: 1.2rem;
  padding: 2px 5px;
  border-radius: 5px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-activationCodeSection .nup-activationControls .nup-activateBtnDiv {
  flex: 0 0 auto;
  margin-left: 10px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-activationCodeSection .nup-activationControls .nup-activateBtnDiv .nup-activateBtn {
  font-size: 1.1rem;
  padding-top: 3px;
  padding-bottom: 3px;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-activationCodeSection .nup-activationSupport {
  margin-top: 10px;
  font-size: 1.1rem;
  text-align: left;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-activationCodeSection .nup-activationSupport span a {
  font-weight: bold;
  color: #fcbb43;
  -webkit-user-select: text;
     -moz-user-select: text;
          user-select: text;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-currentPlan {
  margin-top: 30px;
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
}
.no-user-pro-dg.dialog2 .dg2-content .dg2-fields-section .nup-message {
  margin-top: 30px;
  width: 100%;
  font-size: 1.2rem;
  text-align: center;
  color: #FF0;
  -webkit-user-select: text;
     -moz-user-select: text;
          user-select: text;
}
.no-user-pro-dg.dialog2 .dg2-content .nup-buttons.dg2-buttons-section {
  margin-top: 30px;
  justify-content: center;
  width: 300px;
}
.no-user-pro-dg.dialog2 .dg2-content .nup-buttons.dg2-buttons-section .nup-checkoutBtn {
  width: 175px;
}
.no-user-pro-dg.dialog2 .dg2-content .nup-buttons.dg2-buttons-section .nup-checkoutBtn:disabled {
  background-color: #AAA;
  color: #CCC;
}
.no-user-pro-dg.dialog2 .dg2-content .nup-buttons.dg2-buttons-section .nup-closeBtn {
  margin-left: 30px;
  width: 175px;
}
.no-user-pro-dg.dialog2 .dg2-content .nup-buttons.dg2-buttons-section .nup-cancelCheckoutBtn {
  display: none;
  width: 200px;
}
.no-user-pro-dg.dialog2 .dg2-content .nup-buttons.dg2-buttons-section button {
  background-color: #ff9500;
  color: #FFF;
  display: block;
}

.discordVoiceDialog {
  max-width: 600px;
  max-height: 100dvh;
  overflow-y: auto;
  justify-content: flex-start;
}
.discordVoiceDialog .dvd-fieldInstructionsDiv {
  width: 100%;
  text-align: left;
  font-size: 1.2rem;
  margin-bottom: 5px;
}
.discordVoiceDialog .dvd-tipsDiv {
  margin-top: 20px;
  width: 100%;
  padding-left: 20px;
  font-size: 1.2rem;
}
.discordVoiceDialog .dvd-tipsDiv ul li {
  text-align: left;
}
.discordVoiceDialog .dvd-tipsDiv ul li:not(:first-child) {
  margin-top: 10px;
}
.discordVoiceDialog .dvd-discordLinkDiv {
  margin-top: 20px;
  width: 100%;
  font-size: 1.8rem;
  color: rgb(255, 228, 52);
  text-decoration: underline;
}
.discordVoiceDialog .dvd-buttons {
  margin-top: 40px;
  justify-content: center;
}
.discordVoiceDialog .dvd-buttons .dvd-closeBtn {
  width: 125px;
}

.autoSessionsDg {
  width: 500px;
}
.autoSessionsDg .dg2-content .asd-info {
  text-align: center;
  margin-top: 20px;
  color: #FBB;
  font-size: 1rem;
}
.autoSessionsDg .dg2-content .asd-buttons {
  width: 100%;
  justify-content: center;
}
.autoSessionsDg .dg2-content .asd-buttons div {
  width: 135px;
}
.autoSessionsDg .dg2-content .asd-buttons div:not(:first-child) {
  margin-left: 20px;
}
.autoSessionsDg .dg2-content .asd-buttons div .dg2-button {
  width: 100%;
}
.autoSessionsDg .dg2-content .asd-buttons div > input {
  display: none;
}/*# sourceMappingURL=main.css.map */