html {
  -webkit-text-size-adjust: none;
}

.radioDiv {
  display: table-row;
}
.radioDiv .radioSpan {
  display: table-cell;
  vertical-align: top;
} /* You can omit the entire span if you don't want the radiobutton vertically centered */
.radioDiv label {
  display: table-cell;
}

#logo_gremlin {
  position: relative;
  margin: 2px 0 -2px 15px;
  border-width: 0;
  height: 32px;
}

/* begin: credit card modal */
.ccModalBody {
  overflow: hidden;
  position: fixed;
  top: 0;
  border: 0;
  left: 0;
  right: 0;
}

.uploadFaqContainer {
  margin: 0px 20px 40px 20px;
}

.uploadFaqHeadline {
  font-size: 14pt;
  padding: 20px;
  box-sizing: border-box;
  background: #4f4f4f;
  color: #ffffff;
  font-weight: bold;
  line-height: 1.5em;
  border-radius: 5px 5px 0px 0px;
}

.uploadFaqBody {
  padding: 40px 20px;
  box-sizing: border-box;
  line-height: 1.5em;
  border-radius: 0px 0px 5px 5px;
  background: #eeeeee;
  font-weight: 400;
  border: 1px solid #4f4f4f;
}

.swal2-container {
  z-index: 10000;
}

.ccModalBody #payButton {
  margin: 0px !important;
}

.ccModalBody input {
  min-width: 100px !important;
}

.ccModalBody .thisIsCcModalContainer {
  display: block !important;
}

.ccModalBody .ccButtonContainer {
  background: #eeeeee;
}

.ccModalBody .ccButtonContainerContainer {
  background: none;
}
/* end: credit card modal */

.ccButtonContainer {
  border-top: 1px solid #cccccc;
  padding: 15px 10px 15px 15px;
  background: #cccccc;
}

.upgradeWindow {
  margin-top: 2em;
}

.kShadow {
  box-shadow:
    0 50px 100px -20px rgb(50 50 93 / 25%),
    0 30px 60px -40px rgb(0 0 0 / 30%);
}

.planBoxContainer {
  font-weight: 400;
}

.innerLoginForm {
  max-width: 280px;
}

.signinForgotContainer {
  text-align: right;
  margin-top: -6px;
  margin-bottom: 10px;
}

#emailDidYouMeanContainer {
  float: right;
  margin: -4px 0px 5px 0px;
  display: none;
}
.bankInfoNotice {
  display: flex;
  max-width: 620px;
  margin: 20px 0px 8px 0px;
  padding: 10px;
  box-sizing: border-box;
  background: #eeeeee;
  border: 1px solid #00000024;
  line-height: 1.5em;
  border-radius: 5px;
}
.dashBox {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow:
    0 50px 100px -20px rgb(50 50 93 / 25%),
    0 30px 60px -40px rgb(0 0 0 / 30%);
  margin: 20px;
  font-weight: 600;
  display: block;
}

.dashBox:hover {
  background: #f8f8f8;
}

.boxPic {
  max-height: 200px;
  overflow: hidden;
}

.boxText {
  padding: 15px;
  line-height: 1.5em;
}

.boxTitle {
  color: #a0a0a0;
}

.mobileHideTable {
  display: table;
}

.navMobileIcon {
  opacity: 0.5;
  display: inline-block;
  width: 25px;
}

.playlisterLogo {
  box-shadow: 3px 3px 3px rgb(0 0 0 / 20%);
  width: 100%;
  max-width: 200px;
}

/* LANDING PAGE SIGN UP */

.homePageSignupBox {
  padding: 24px;
  box-sizing: border-box;
  box-shadow:
    0px 1px 2px rgba(0, 0, 0, 0.08),
    0px 4px 12px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  margin-top: 42px;
  background: #ffffff;
  border: 1px solid rgba(221, 221, 221, 0.2);
  min-width: 360px;
}

.heading-sign-up {
  font-size: 24px;
  font-weight: 700;
  margin: 0px;
  padding-bottom: 12px;
}

.subhead-sign-up {
  font-size: 18px;
  font-weight: 400;
  color: #828282;
  padding-bottom: 24px;
}

.homeFormInputContainer {
  border: 1px solid rgba(34, 34, 34, 0.2);
  border-radius: 6px;
  padding-left: 12px;
  margin-bottom: 18px;
  background-color: white;
  box-sizing: border-box;
  width: 100%;
}

.homeFormInput {
  width: 100%;
  line-height: 22px;
  height: 42px;
  font-size: 18px;
  border: none;
  border-radius: 6px;
  outline: none;
  border-width: 0px;
  margin: 0px;
  padding: 0px;
  font-weight: 400;
}

.register-button-modern {
  width: 100%;
  padding: 12px;
  -webkit-appearance: none;
  background-color: #0073c7;
  color: #ffffff !important;
  text-decoration: none !important;
  margin: 0px;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 6px;
  border: none;
  outline: none;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.register-button-modern:hover {
  background-color: #005b9e;
}

.or-sign-up {
  display: flex;
  font-family: Lato, sans-serif;
  font-weight: 400;
  color: var(--gray-500);
  font-size: 18px;
  margin: 0;
}

.or-container-sign-up {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 12px;
  padding-bottom: 18px;
  padding-top: 18px;
}

.or-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  margin: 42px auto 0px;
  font-weight: 400;
}

.or-container-full {
  width: 96%;
  display: flex;
  flex-direction: row;
  align-items: center;
  align-content: center;
  margin: 0px auto 0px;
  font-weight: 400;
}

.or-hr {
  width: 100%;
  border: none;
  border-bottom: 1px solid #d1d5db;
}

.socialSignup-container {
  display: flex;
  flex-direction: column;
  margin: 0;
  row-gap: 16px;
}

.forgotPasswordWrapper {
  margin: auto;
  margin-bottom: 24px;
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: center;
  row-gap: 20px;
  max-width: 440px;
  font-weight: 400;
}

.forgotPassH2 {
  margin: 0;
}

.forgotPassP {
  margin: 0;
}

.forgotPasswordContainer {
  margin: auto;
  padding: 20px;
  border: 1px solid #e5e7eb;
  max-width: 320px;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
}

.socialSignup-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 12px;
  column-gap: 8px;
  font-size: 14pt;
  font-family: "Lato";
  font-weight: 400;
  cursor: pointer;
}

.socialFB-button {
  background-color: #1877f2;
  color: white;
  border: none;
  border-radius: 6px;
}

.socialApple-button {
  background-color: #000000;
  color: white;
  border: none;
  border-radius: 6px;
}

.socialGoogle-button {
  background-color: #ffffff;
  color: #374151;
  border: 1px solid #9ca3af;
  border-radius: 6px;
}

.social-sign-in-container {
  max-width: 300px;
  margin: auto;
  display: flex;
  flex-direction: row;
  align-content: center;
  justify-content: space-between;
}

.sign-in-icon-button {
  height: 48px;
  width: 48px;
  background-color: white;
  border: 1px solid rgba(34, 34, 34, 0.15);
  box-sizing: border-box;
  border-radius: 6px;
  cursor: pointer;
}

.social-sign-in-container-text {
  width: 100%;
  margin: auto;
  display: flex;
  flex-direction: row;
  align-content: center;
  column-gap: 32px;
  justify-content: flex-start;
  margin-top: 24px;
}

.account-social-login-section {
  max-width: 600px;
  font-weight: 400;
  margin-top: 24px;
  padding-left: 16px;
  padding-right: 16px;
}

/* .social-tr{
	border-bottom: solid 1px #F2F2F2;
	padding-top: 12px;
} */

.social-firstLast {
  width: 84px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.social-longEmail {
  width: 250px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.currentLogin-sm {
  color: #6b7280;
  padding: 0;
  padding-bottom: 4px;
  margin: 0;
  font-size: 12px;
  font-weight: 400;
}

.social-info {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
}

.account-actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-self: center;
  gap: 20px;
}

.social-account-disconnect {
  display: flex;
  flex-direction: row;
  justify-content: end;
  align-items: center;
}

.social-account-disconnect-button {
  color: #9ca3af;
  cursor: pointer;
}

.social-account-disconnect-button:hover {
  text-decoration: underline;
}

/* ONE CLICK UPGRADE OCT 2022 - Aaron wuz here */

.upgradeContainer {
  margin: 28px 16px;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
  align-items: center;
}

.upgradeContainer button {
  padding: 0.75rem;
  border-radius: 0.333rem;
  width: 100%;
  height: 50px;
  font-weight: bold;
  text-align: center;
  background: rgb(45, 113, 193);
  color: #fff;
  cursor: pointer;
}

.cardUpgradeSummary {
  /* display: flex;
	flex-direction: row;
	padding: 12px 16px;
	column-gap: 12px;
	background-color: var(--gray-100);
	border-radius: 6px;
	align-items: center;
	justify-content: center; */

  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 24px 18px;
  align-items: center;
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 12px 16px;
  width: 100%;
  max-width: 440px;
}

.cardUpgradeInfoContainer {
  display: flex;
  column-gap: 7px;
  width: 100%;
}

.cc-icon-upgrade {
  fill: var(--gray-500);
}

.cardConfirm {
  font-weight: 400;
  font-size: 0.85rem;
  color: var(--gray-600);
  font-family: "Inter", sans-serif;
  align-self: center;
  flex: 1;
}

.changeCardUpgrade {
  color: #0073c7;
  cursor: pointer;
  font-weight: 700;
}

.changeCardUpgrade:hover {
  text-decoration: underline;
}

.upgradePlanDisclaimer {
  color: var(--gray-500);
  font-size: 0.667rem;
  font-weight: 400;
  margin-top: 0px;
}
/* DESIGN SYSTEM NAMING CONVENTION? */

.text-lg {
  font-size: 1.2em;
  font-weight: 400;
  margin: 0px;
  margin-bottom: 12px;
}

.text-sm {
  font-size: 1em;
  line-height: 1.36em;
  margin: 0px;
}

.grey400 {
  color: #9ca3af;
}
/* NAMING CONVENTION END */

.back-to-account-info {
  display: flex;
  align-items: center;
  font-weight: 400;
  color: #4b5563;
  column-gap: 8px;
  background-color: white;
  border: none;
  margin-top: 32px;
  margin-left: 12px;
  cursor: pointer;
  fill: #4b5563;
}

.back-to-account-info:hover {
  text-decoration: underline;
}

.sign-in-icon-button-text {
  padding: 12px;
  font-family: "Lato", sans-serif;
  background-color: white;
  border: 1px solid #d1d5db;
  box-sizing: border-box;
  border-radius: 6px;
  cursor: pointer;
  font-size: 1em;
  column-gap: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
}

.sign-in-icon-button-text:hover {
  background: #f3f4f6;
}

.sign-in-table {
  width: 100%;
  max-width: 600px;
  background-color: #ffffff;
  padding: 12px;
  margin: 0px;
  /* margin-top: 24px; */
  /* border-radius: 6px;
	border: 1px solid rgba(34, 34, 34, 0.1); */
}

.sign-in-table tr {
  border-bottom: 1px solid #f2f2f2;
  padding-top: 16px;
  padding-bottom: 16px;
  display: flex;
  justify-content: space-between;
}
.sign-in-table tr.last {
  border-bottom: none;
}

.sign-in-table th tr {
  padding: 16px;
}

.sign-in-icon {
  height: 20px;
}

.socialLoginExistsMessage {
  font-weight: 400;
  padding: 12px;
  padding-left: 20px;
  padding-right: 20px;
  line-height: 24px;
  background-color: #f3f4f6;
  text-align: left;
  margin-bottom: 20px;
  border-radius: 6px;
  color: #374151;
  margin: auto;
  margin-bottom: 20px;
  max-width: 400px;
}

.signinBox {
  box-sizing: border-box;
  z-index: 1000;
  position: absolute;
  background: white;
  right: 0px;
  text-align: left;
  border: 1px solid #ccc;
  margin: -2px 0px 0px 0px;
  width: 300px;
  padding: 24px;
  box-shadow:
    0px 1px 2px rgba(0, 0, 0, 0.08),
    0px 4px 12px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
}

.sign-in-button-round {
  padding: 12px;
  -webkit-appearance: none;
  background-color: #0f78b8;
  color: #ffffff !important;
  text-decoration: none !important;
  margin: 0px;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 6px;
  border: 1px solid #006ca4;
  outline: none;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.dk-signinForgotPassword {
  margin-top: 18px;
  font-size: 11pt;
  font-weight: 400;
  text-align: center;
}

.homeFormInputContainerSignin {
  border: 1px solid rgba(34, 34, 34, 0.2);
  border-radius: 6px;
  padding-left: 12px;
  margin-bottom: 18px;
  background-color: white;
  box-sizing: border-box;
  width: 100%;
}

/* LANDING PAGE SIGN UP END */

.totalEarningsHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.blackAndWhiteExceptHover {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}

.blackAndWhiteExceptHover:hover {
  -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
  filter: grayscale(0%);
}

.groupListDesc {
  margin-top: 5px;
  word-wrap: break-word;
  word-break: break-word;
}

.atsign {
  color: #0071c7;
}

.phoneInput::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #d2d2d2;
  opacity: 1;
}
.phoneInput:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #d2d2d2;
  opacity: 1;
}
.phoneInput::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #d2d2d2;
  opacity: 1;
}
.phoneInput:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #d2d2d2;
}

.selectCaret {
  position: absolute;
  right: 0;
  top: 1px;
  line-height: 42px;
  padding-right: 12px;
  font-size: 22px;
  box-sizing: border-box;
  pointer-events: none;
}

.transparentToWhiteBg {
  background: rgb(255, 255, 255);
  background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
}

.borderBox {
  box-sizing: border-box;
}

textarea {
  font-family: "Lato", helvetica, arial, sans;
}

.noselect {
  /* useful for buttons etc where you don't want the user to accidentally highlight on touch device */
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

body.modal-open {
  overflow: hidden;
}

.tinyButton {
  padding: 4px 7px 4px 7px;
  font-size: 10px;
  border-radius: 4px;
  cursor: pointer;
  text-transform: uppercase;
  text-align: left;
  margin-bottom: 0px;
  display: inline-block;
  background: #0071c7;
  color: #ffffff;
}

.tinyButton:hover {
  background: #0884c5;
}

.tinyButtonGray {
  padding: 4px 7px 4px 7px;
  font-size: 10px;
  border-radius: 4px;
  cursor: pointer;
  text-transform: uppercase;
  text-align: left;
  margin-bottom: 0px;
  display: inline-block;
  background: #999999;
  color: #ffffff;
}

.tinyButtonGray:hover {
  background: #a1a1a1;
}

.newUsernameInput {
  max-width: 180px;
  min-width: 0px;
  width: auto;
}

.vizyFormSection {
  margin-top: 22px;
}

.vizyFormLabel {
  text-transform: uppercase;
  font-size: 9pt;
}

.fileKidTermsContainer {
  color: #333333;
  line-height: 1.5em;
}

.fileKidTermsSlogan {
  margin-top: 15px;
  color: #666666;
}

.fileKidTermsDetails {
  margin-top: 15px;
  font-size: 11px;
  color: #666666;
  line-height: 1.5em;
}

.dont-break-out {
  /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;
  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.navEnvelope {
  color: #ffffff !important;
  margin-left: 10px;
}

.unreadMessageCount {
  background: #d00000;
  padding: 3px;
  border-radius: 25%;
  font-size: 8pt;
}

.navDropdownHide {
  display: none !important;
}

.navDropdownShow {
  display: block !important;
}

.moreMenu {
  padding: 10px;
  cursor: pointer;
  border-bottom: 1px solid hsla(0, 0%, 0%, 0.09);
}

.moreMenuContainer {
  border-radius: 0px 0px 5px 5px;
  box-shadow: 3px 3px 5px 0px hsla(0, 0%, 0%, 0.12);
  border: 1px solid hsla(0, 0%, 0%, 0.17);
  line-height: 1.4em;
  text-transform: none;
  text-align: left;
  font-weight: normal;
  background: #ffffff;
  color: #333333;
  width: 400px;
  box-sizing: border-box;
  margin-bottom: 70px; /* useful for when menu is longer than the page itself */
}

.navDropdown {
  position: absolute;
  right: 0px;
  margin-top: 1px;
  display: none;
  z-index: 100000;
}

.moreMenu:hover {
  background: #f2f2f2;
}

.invisible {
  visibility: hidden;
}

.grecaptcha-badge {
  display: none;
}

.turnstile-badge {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left: -150px;
  margin-top: -32px;
  z-index: 1000;
}

.turnstile-badge.visible.with-background:before {
  content: "";
  background-color: #000000;
  opacity: 0.5;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  position: fixed;
  z-index: -1;
}

.captcha-div {
  position: relative;
  width: 100%;
  display: none;
}

.captcha-div.visible {
  display: block;
}

.captcha-div .turnstile-badge {
  position: relative;
  top: unset;
  right: unset;
  left: unset;
  margin: 18px 0;
}

.vizyPricingBlock,
.mqaPricingBlock {
  margin-top: 26px;
  background: #ffffff;
  box-sizing: border-box;
  border: 1px solid rgba(0, 0, 0, 0.12);
}

.vizySongInput,
.vizyLyricFileInput,
.facebookFreeSongInput {
  display: block;
  cursor: pointer;
  width: 100%;
  box-sizing: border-box;
  background: #ffffff;
  color: #4f5057;
  font-size: 10pt;
  border: 1px dotted #aaaaaa;
  padding: 1em;
  text-align: center;
}

.vizyAudioFilenameGoesHere {
  overflow: hidden;
  text-overflow: ellipsis;
}

.rightVizyColumn {
  padding-left: 30px;
  width: 100%;
}

#vizyAudio,
#vizyLyricFile,
#facebookFreeAudio {
  width: 100%;
  max-width: 600px;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.vizyCheckboxes label {
  display: block;
  padding-right: 10px;
  padding-left: 22px;
  text-indent: -22px;
}
.vizyCheckboxes input {
  vertical-align: text-bottom;
}
.vizyCheckboxes label span {
  vertical-align: middle;
}

.vizySongInputDragOver,
.vizyLyricFileInputDragOver,
.facebookFreeSongInputDragOver {
  background: #f1f1f1;
}

.hyperFollowSocialMediaIcon {
  height: 26px;
  width: 26px;
  vertical-align: middle;
  margin-left: 6px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-sizing: border-box;
}

.applyTheseSocialMediaLinksToAll {
  margin-top: 17px;
  margin-left: 33px;
  box-sizing: border-box;
  padding-right: 1em;
}

.hyperFollowSocialMediaIconContainer {
  text-align: right;
  background: rgba(0, 0, 0, 1);
  padding: 6px;
  font-size: 0;
}

.redbg {
  color: #ffffff !important;
  background: #d00000 !important;
}

.redborder {
  border: 1px solid #d00000 !important;
}

.grayBg {
  color: #000000 !important;
  background: #eeeeee !important;
}

.mobileBreak480 {
  display: inline;
}

.grayWithBlueMouseover {
  color: #999999 !important;
}

.grayWithBlueMouseover:hover {
  color: #0071c7 !important;
}

.hyperfollowUnfollowButton {
  margin-right: 10px;
  cursor: pointer;
  box-sizing: border-box;
  display: inline-block;
  height: 30px;
  padding: 6px 9px 4px 6px;
  width: 125px;
}

.messageToHeader {
  padding: 20px;
  box-sizing: border-box;
  font-size: 14pt;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.messageToHeaderEllipsis {
  float: right;
  padding: 1.5em 1.4em 1.4em 1.4em;
  cursor: pointer;
}

.messageToHeaderEllipsisMenu {
  font-size: 12pt;
  box-sizing: border-box;
  box-shadow: 3px 3px 5px 0px hsla(0, 0%, 0%, 0.12);
  z-index: 100;
  right: 18px;
  margin-top: 15px;
  max-width: 180px;
  background: #ffffff;
  border: 1px solid hsla(0, 0%, 0%, 0.17);
  position: absolute;
}

.messageToHeaderEllipsisMenuItem {
  display: block;
  padding: 10px;
  background: #ffffff;
  color: #333333;
  cursor: pointer;
  font-size: 15px;
  font-weight: 400;
  text-transform: none;
  white-space: nowrap;
}

.messageToHeaderEllipsisMenuItem:hover {
  padding: 10px;
  background: #f2f2f2;
}

.saveEmailButton {
  box-sizing: border-box;
  font-size: inherit !important;
  display: inline-block;
  padding: 6px 8px 4px 8px !important;
  height: 30px;
  border-radius: 0px 8px 8px 0px !important;
  border-left: none !important;
  width: 100%;
  max-width: 200px;
}

.emailMeTd {
  width: 190px;
}

.myEmailAddress {
  width: 190px;
  box-sizing: border-box;
  line-height: 31px;
  min-width: 0px;
  height: 30px;
  vertical-align: bottom;
  border: 1px solid #006ca4;
  border-right: none;
  padding-bottom: 1px;
}

.mobileFloatLeftDesktopFloatRight {
  float: right;
}

.mobileClear {
  display: none;
}

.showWhoImSendingTo {
  font-size: 16pt;
  margin-bottom: 10px;
}

.messageTimeStamp {
  text-align: center;
  margin-bottom: 10px;
  display: none;
}

.complimentMeta {
  margin-bottom: 10px;
}

.message_me a,
.message_me_bulk a {
  color: #ffffff !important;
  text-decoration: underline;
}

.message_me a:hover,
.message_me_bulk a:hover {
  color: #ffffff;
  text-decoration: underline;
}

.hyperfollowArtistHeader {
  border-radius: 0px 0px 5px 5px;
  background: #ffffff;
  color: #333333;
}

.addressLine {
  display: inline-block;
}

.addressLine:after {
  content: "\B7";
}

.addressLine:nth-of-type(4):after {
  content: "";
}

.swal2-content {
  line-height: 1.5em;
}

.tableFlex {
  display: flex;
}

.spotifyGreenBg {
  background: #1db954;
}

.tabletBreak {
  display: inline;
}

.spotifyGreenBgHoverHighlight:hover {
  background: #1fbf57 !important;
}

.spotifyPresaveLonely {
  text-align: center;
  padding: 2em 1em 2em 1em;
  box-sizing: border-box;
  border-radius: 4px;
  margin-bottom: 1em;
  color: #ffffff;
}

.blueHoverHighlight:hover {
  color: #0884c5;
}

.showIfIncomingFromSpotify {
  display: none;
}

#emailDidYouMeanContainer .didYouMean {
  color: red;
}

.hyperfollowPlayButton {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.dkRequiredForSpotifyBackground {
  background: #f0f7fe !important;
}

.playTd {
  border-radius: 0px 0px 0px 0px;
  background: #ffffff;
  width: 60px;
}

.playTd_multi {
  border-radius: 0px 0px 0px 4px;
  width: 125px;
}

.hyperfollowPlayButtonLowerRight {
  bottom: 6px;
  left: 7px;
  top: auto;
  transform: none;
}

.hyperfollowPlayButtonIconContainer {
  color: #ffffff;
  opacity: 1;
}

.playButtonShadow {
  text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
}

.hyperfollowPlayButtonIconContainer:hover {
  color: #ffffff;
  opacity: 1;
}

.hyperfollowPlayButtonIcon {
  font-size: 75pt;
  vertical-align: middle;
  cursor: pointer;
}

.hyperfollowPlayButtonIcon:hover {
  color: #0884c5 !important;
}

.hyperfollowPlayButtonIconSmaller {
  font-size: 36pt;
}

.playHeaderContainer {
  margin-bottom: -12px;
}

.playHeaderWords {
  color: #ffffff;
  background: #333333;
  padding: 1em;
  text-align: center;
  border: 1px solid rgba(51, 51, 51, 0.41);
  border-radius: 4px 4px 0px 0px;
}

.artistNameContainer {
  padding: 15px 15px 15px 15px;
  margin-bottom: 21px;
}

.storeLinksContainer {
  box-shadow: none;
  background: #ffffff;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  border-right: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: none;
  border-top: none;
  border-radius: 0px 0px 4px 4px;
}

.artistNameText {
  font-family: "Montserrat", "Lato", helvetica, arial, sans;
  font-weight: 900;
  text-transform: uppercase;
  text-align: left;
  color: #555555;
  box-sizing: border-box;
}

.wrap {
  white-space: pre-wrap; /* CSS3 */
  white-space: -moz-pre-wrap; /* Firefox */
  white-space: -pre-wrap; /* Opera <7 */
  white-space: -o-pre-wrap; /* Opera 7 */
  word-wrap: break-word; /* IE */
}

.inboxTextMessagingLabel {
  text-transform: uppercase;
  margin-top: 3px;
  font-size: 7px;
  box-sizing: border-box;
  padding: 2px 4px 2px 4px;
  border-radius: 3px;
  background: #000000;
  color: white;
}

.inboxEmojiMessage {
  font-size: 35pt !important;
  padding: 0.1em 0.2em 0.1em 0.2em !important;
}

.inboxCharCount {
  display: inline-block;
  margin-right: 5px;
  color: #666666;
  font-size: 9pt;
}

.inboxMedia_me {
  max-width: 50%;
  border-radius: 5px;
  margin-bottom: 8px;
  float: right;
}

.inboxMedia_you {
  max-width: 50%;
  border-radius: 5px;
  margin-bottom: 8px;
}

.message_me {
  line-height: 1.3em;
  max-width: 70%;
  margin-bottom: 10px;
  color: #ffffff;
  float: right;
  clear: all;
  border-radius: 5px;
  word-wrap: break-word;
  clear: both;
  font-weight: 400;
}

.message_me_bulk {
  line-height: 1.3em;
  max-width: 70%;
  margin-bottom: 10px;
  background: #a228b8;
  color: #ffffff;
  float: right;
  clear: all;
  padding: 0.5em 0.7em 0.5em 0.7em;
  border-radius: 5px;
  word-wrap: break-word;
  clear: both;
  font-weight: 400;
}

.message_you {
  font-weight: 400;
  display: inline-block;
  border-radius: 5px;
  line-height: 1.3em;
  max-width: 70%;
  margin-bottom: 10px;
  word-wrap: break-word;
  clear: both;
}

.message_you_bulk {
  display: inline-block;
  padding: 0.5em 0.7em 0.5em 0.7em;
  border-radius: 5px;
  line-height: 1.3em;
  max-width: 70%;
  margin-bottom: 10px;
  background: #a228b8;
  color: #ffffff;
  word-wrap: break-word;
  clear: both;
  font-weight: 400;
}

.message_you_bulk a,
.message_you_bulk a:visited,
.message_you_bulk a:hover {
  color: #ffffff;
  text-decoration: underline;
}

.inboxLeft {
  float: left;
  width: 25%;
  overflow: scroll;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  z-index: 100;
  background: #ffffff;
  z-index: 100; /* z-index so it's above .inboxMobileOverlayToClickAndDismissMenu but below everything else */
}

.inboxMobileOverlayToClickAndDismissMenu {
  display: none;
  background: rgba(0, 0, 0, 0);
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0px;
  top: 0px;
  z-index: 50; /* z-index so it's below .inboxLeft but above everything else */
  -webkit-animation: inboxMobileOverlayToClickAndDismissMenuBackgroundAnimation linear 0.15s;
  -webkit-animation-fill-mode: forwards;
  animation: inboxMobileOverlayToClickAndDismissMenuBackgroundAnimation linear 0.15s;
  animation-fill-mode: forwards;
}

@-webkit-keyframes inboxMobileOverlayToClickAndDismissMenuBackgroundAnimation {
  0% {
    background: rgba(0, 0, 0, 0);
  }
  100% {
    background: rgba(0, 0, 0, 0.36);
  }
}
@keyframes inboxMobileOverlayToClickAndDismissMenuBackgroundAnimation {
  0% {
    background: rgba(0, 0, 0, 0);
  }
  100% {
    background: rgba(0, 0, 0, 0.36);
  }
}

.inboxMobileOverlayToClickAndDismissMenuBackgroundAnimateBackToTransparent {
  background: rgba(0, 0, 0, 0.36) !important;
  transition: 5.15ms;
  -webkit-animation: inboxMobileOverlayToClickAndDismissMenuBackgroundAnimationUndo linear 0.15s;
  -webkit-animation-fill-mode: forwards;
  animation: inboxMobileOverlayToClickAndDismissMenuBackgroundAnimationUndo linear 0.15s;
  animation-fill-mode: forwards;
}

@-webkit-keyframes inboxMobileOverlayToClickAndDismissMenuBackgroundAnimationUndo {
  0% {
    background: rgba(0, 0, 0, 0.36);
  }
  100% {
    background: rgba(0, 0, 0, 0);
  }
}
@keyframes inboxMobileOverlayToClickAndDismissMenuBackgroundAnimationUndo {
  0% {
    background: rgba(0, 0, 0, 0.36);
  }
  100% {
    background: rgba(0, 0, 0, 0);
  }
}

.inboxRight {
  float: left;
  width: 75%;
  border-left: 1px solid rgba(0, 0, 0, 0.11);
  box-sizing: border-box;
}

.inboxDate {
  float: right;
  font-size: 9pt;
  color: #999999;
}

.inboxRow.selected {
  background: rgba(0, 0, 0, 0.045) !important;
}

.inboxRow {
  padding: 15px 15px 15px 0px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  border-left: 1px solid rgba(0, 0, 0, 0.05);
  cursor: pointer;
  box-sizing: border-box;
}

.inboxLeftMenuItem {
  padding: 25px 15px 25px 15px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  border-left: 1px solid rgba(0, 0, 0, 0.05);
  cursor: pointer;
  box-sizing: border-box;
}

.purple {
  color: #af2daf;
}

.purple {
  color: #af2daf;
}

.purpleBackground {
  background: #af2daf;
}

.bulkMessaging:hover {
  background: #af2daf;
}

.inboxRow:hover {
  background: rgba(0, 0, 0, 0.15);
}

.newMessageIndicator {
  position: absolute;
  bottom: 0px;
  right: 0px;
  height: 10px;
  width: 10px;
  border-radius: 5px;
  background: #0f78b8;
  display: none;
}

.inboxFrom {
  padding: 0px 15px 0px 10px;
  font-size: 13pt;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  box-sizing: border-box;
}

.inboxPreview {
  padding: 0px 15px 0px 10px;
  font-size: 10pt;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: #999999;
  box-sizing: border-box;
  position: relative;
}

.inboxUnread {
  opacity: 1 !important;
  font-weight: bold;
}

.inboxConversation {
  /* height:calc(100% - 226px); */
  overflow: scroll;
  overflow-x: hidden;
  overflow-y: auto;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding: 1em 4% 1em 4%;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
}

.inboxConversationContainer {
  position: relative;
  overflow: scroll;
  overflow-y: auto;
  overflow-x: hidden;
}

.inboxNewMessage {
  box-sizing: border-box;
  width: 100%;
  position: absolute;
  min-height: 3.5em;
  line-height: 1.5em;
  padding: 1em;
  outline: none;
  font-size: 12pt;
  font-weight: 400;
}

.inboxSendButton {
  float: right;
  line-height: 1.5em;
  padding: 1em 1em 1em 1em;
  box-sizing: border-box;
}

.hyperfollowFollow {
  position: inherit;
}

.hyperfollowPrivateMessage {
  position: inherit;
  margin-top: 16px;
  border-radius: 5px;
}

.hyperfollowRegisterHelp {
  float: left;
  line-height: 35px;
  margin-left: 5px;
  font-size: 10pt;
  opacity: 0.75;
}

.messageSentLabel {
  display: none;
  margin-left: 0px;
  font-size: 9px;
  text-transform: uppercase;
  padding: 4px 10px 4px 10px;
  box-sizing: border-box;
}

.hyperfollowArtPlaceholder {
  background-image: linear-gradient(
    45deg,
    #000000 25%,
    #212121 25%,
    #212121 50%,
    #000000 50%,
    #000000 75%,
    #212121 75%,
    #212121 100%
  );
  background-size: 28.28px 28.28px;
}

.hyperfollowMailingListContainer {
  border-radius: 5px;
  margin-top: 1.3em;
  width: 100%;
  box-sizing: border-box;
  padding: 18px 20px 20px 20px;
  background: rgba(0, 0, 0, 0.1);
  display: inline-block;
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.presaveSpotifyButton {
  cursor: pointer;
  position: relative;
  text-transform: uppercase;
  border-radius: 0px 0px 4px 4px;
  text-align: center;
  padding: 1.5em 1em 1.5em 1em;
  background: #1db954;
  color: #ffffff;
}

.presaveSpotifyButton:hover {
  background: #1fbf57;
}

.hyperfollowTextingContainer {
  border-radius: 5px;
  margin-top: 27px;
  width: 100%;
  box-sizing: border-box;
  padding: 18px 20px 8px 20px;
  background: rgba(0, 0, 0, 0.1);
  display: inline-block;
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.hyperfollowMobileStoreLink {
  padding: 1.2em 1em 1.2em 1em;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.hyperfollowMobileStoreLink:hover {
  background: rgba(0, 0, 0, 0.035);
}

.moreFromTr:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.showMoreButtonContainer {
  padding: 1em 1em 0px 1em;
}

.moreFromTr:hover {
  background: rgba(0, 0, 0, 0.035);
}

.hyperfollowMoreFromContainer {
  line-height: 1.5em;
  width: 100%;
  box-sizing: border-box;
  display: inline-block;
  background: #ffffff;
  border-radius: 4px;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  border-right: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.hyperfollowListenNow {
  margin-top: 1.5em;
  line-height: 1.5em;
  width: 100%;
  box-sizing: border-box;
  padding: 20px 20px 20px 20px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  display: inline-block;
  border-radius: 5px;
}

.mobileShowTablet {
  display: none;
}

.mobileShowTabletInline {
  display: none;
}

.container {
  overflow: hidden;
  margin: 0px 1em 0px 1em;
  max-width: 900px;
}

.right {
  width: 100%;
  max-width: 320px;
  float: right;
  /* background:rgba(255, 255, 255, 0.65); */
}

.left {
  float: none; /* not needed, just for clarification */
  width: auto;
  overflow: hidden;
}

.right2 {
  float: none; /* not needed, just for clarification */
  width: auto;
  overflow: hidden;
}

.left2 {
  width: 100%;
  max-width: 320px;
  float: left;
  background: rgba(255, 255, 255, 0.65);
}

.fa-drag-handle:before {
  content: "\f142 \f142";
  letter-spacing: 0.1em;
}

.hyperFollowDspLink {
  padding: 1.2em 1em 1.2em 1em;
  text-align: left;
  transition: 0.2s;
  cursor: pointer;
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
  border-right: 1px solid rgba(0, 0, 0, 0.07);
}

.hyperFollowDspLink:hover {
  background: rgba(255, 255, 255, 0.85);
}

.hyperFollowDspIcon {
  height: 40px;
  vertical-align: middle;
}

.marginTop3ExceptFirst {
  margin-top: 3px;
}

.buttonRed {
  display: inline-block;
  border: 1px solid #ff0000;
  padding: 0.5em 1em 0.5em 1em;
  border-radius: 5px;
  color: #ff0000;
  cursor: pointer;
  background: #ffffff;
  text-align: center;
}

.buttonBlue {
  display: inline-block;
  border: 1px solid #2895f1;
  padding: 0.5em 1em 0.5em 1em;
  border-radius: 5px;
  color: #2895f1;
  cursor: pointer;
  background: #ffffff;
  text-align: center;
}

.buttonBlue:hover,
.buttonBlue.hover {
  display: inline-block;
  border: 1px solid #2895f1;
  padding: 0.5em 1em 0.5em 1em;
  border-radius: 5px;
  color: #ffffff;
  cursor: pointer;
  background: #2895f1;
  text-align: center;
}

.buttonWhite {
  display: inline-block;
  border: 1px solid #2895f1;
  padding: 0.5em 1em 0.5em 1em;
  border-radius: 5px;
  color: #2895f1;
  cursor: pointer;
  background: #ffffff;
  text-align: center;
}

.buttonSemitrans {
  background: #ffffffa1;
  display: inline-block;
  border: 1px solid #2895f1;
  padding: 0.5em 1em 0.5em 1em;
  border-radius: 5px;
  color: #2895f1;
  cursor: pointer;
  text-align: center;
}

.buttonSemitrans:hover {
  background: #ffffff;
}

.buttonWhite:hover {
  background: #e3e3e3;
}

.buttonRed:hover {
  background: #ff0000;
  color: #ffffff;
}

.buttonGreen {
  display: inline-block;
  border: 1px solid #4bb543;
  padding: 0.5em 1em 0.5em 1em;
  border-radius: 5px;
  color: #4bb543;
  cursor: pointer;
  background: #ffffff;
  text-align: center;
}

.buttonGreen:hover {
  background: #4bb543;
  color: #ffffff;
}

.buttonGreen.noUnderline:hover,
.buttonRed.noUnderline:hover {
  text-decoration: none !important;
}

.selectListWithNoBorders {
  border: none !important;
  background: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  text-indent: 1px !important;
  text-overflow: "" !important;
  appearance: none !important;
}

.portedOverFromSpotify:before {
  font-family: FontAwesome;
  font-weight: normal;
  content: "\f1bc";
  white-space: nowrap;
}

.portedOverFromSpotify {
  color: #1db954 !important;
  font-weight: bold;
  white-space: nowrap;
}

.notPortedOverFromSpotify {
  background: #f0f7fe !important;
  color: #2860ad !important;
  font-weight: bold;
  white-space: nowrap;
}

.spotifyGreenOnWhite {
  background: #1db954 !important;
  color: #ffffff !important;
}

.dkBlueOnWhite {
  background: #0f78b8 !important;
  color: #ffffff !important;
}

.whiteOnBlack {
  background: #000000 !important;
  color: #ffffff !important;
}

.marginTop3ExceptFirst:first-child {
  margin-top: 0px;
}

.breakdownRow {
  display: none;
}

.highlightedFieldsAreRequired {
  background-color: rgba(255, 0, 0, 0.05) !important;
  border: 1px solid red !important;
}

.myISRC {
  float: right;
}

.stripeCardInputElement {
  background: #ffffff;
  display: inline-block;
  min-width: 200px;
  height: 30px;
  line-height: 30px;
  padding: 2px 0px 0px 5px;
  border-radius: 0px;
  border: 1px solid #cccccc;
}

.mySongTitlesLeft {
  display: inline-block;
  vertical-align: bottom;
  width: 200px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.myCreditsLeft {
  float: left;
  min-width: 300px;
}

.storeDragHandle {
  margin-right: 7px;
  color: #ffffff;
  text-shadow: -1px -1px rgba(0, 0, 0, 0.4);
  font-size: 17px;
  vertical-align: middle;
}

.albumSongFeaturesLink {
  display: inline-block;
  margin-right: 10px;
  color: #cccccc !important;
}
.albumSongFeaturesLink i {
  text-align: center;
  width: 1rem;
}
.albumSongFeaturesLink:hover {
  color: #0071c7;
}

.lyricsTextarea {
  font-size: 24px;
  padding: 16px 10px 10px 20px;
  font-family: serif;
  color: #222222;
  border: 1px solid #cccccc;
  width: 100%;
  height: 400px;
  box-sizing: border-box;
  outline: none;
  line-height: 30px;
}

.checkboxHighlight {
  background: rgb(255, 142, 200);
  padding: 3px 6px 3px 6px;
}

.mobileShowBlock {
  display: none;
}

.twitterLoveHeader {
  margin: 1rem;
  font-size: 24px;
}

.desktopBr {
  display: block;
}

.spin {
  -webkit-animation: spin 4s linear infinite;
  -moz-animation: spin 4s linear infinite;
  animation: spin 4s linear infinite;
}

.facebookEmbedded {
  margin-top: 2px;
}

.hoverWhiteUnderline {
  text-decoration: none;
}

.hoverWhiteUnderline:hover {
  text-decoration: underline;
}

@-moz-keyframes spin {
  100% {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.fa-times-thin:before {
  content: "\00d7";
}

.mobileShow {
  display: none;
}

.closeAlertContainer {
  float: right;
  font-size: 14px;
  opacity: 0.7;
  cursor: pointer;
}

.mobileHideInline {
  display: inline;
}

.mobileHideInlineTablet {
  display: inline;
}

.closeAlertContainer:hover {
  opacity: 1;
}

img.grayscale {
  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

img.grayscale:hover {
  filter: none;
  -webkit-filter: grayscale(0%);
}

.marginRightIcon {
  margin-right: 6px;
}

.menuItemHeading {
  padding: 1em;
  white-space: nowrap;
  color: rgba(255, 255, 255, 0.5);
}

.menuItem {
  padding: 1em;
  white-space: nowrap;
  cursor: pointer;
}

.menuItem:hover {
  background: rgba(255, 255, 255, 0.1);
}

.pageBg {
  position: fixed;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background-color: #000000;
  z-index: -100;
  overflow: hidden;
}

.pageBgImage {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  margin: auto;
  min-width: 55%;
  min-height: 55%;
  -webkit-filter: blur(35px);
  filter: blur(35px);
  /* filter: url(/images/blur.svg#blur); */
  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='35');
  opacity: 0.3;
}

.fuzzyBackground {
  margin-left: -20%;
  margin-top: -20%;
  width: 150%;
  height: 150%;
  -webkit-filter: blur(35px);
  filter: blur(35px);
  /* filter: url(/images/blur.svg#blur); */
  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='35');
  opacity: 0.72;
}

.hyperfollowAlbumArt {
  /* box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.21); */
  display: block;
  width: 100%;
  /* border:1px solid rgb(210, 210, 210); */
  /* box-sizing: border-box; messed up */
  /* max-width: 700px; */
  border-radius: 4px;
}

.hyperfollowAlbumArt2 {
  /* box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.21); */
  display: block;
  width: 100%;
  border: 1px solid rgb(181, 181, 181);
  box-sizing: border-box;
  max-width: 700px;
  border-radius: 5px;
}

.hyperfollowRelatedAlbumsOverflow {
  display: none;
}

.hyperfollowAlbumArtContainer {
  background: none;
  text-align: center;
  position: relative;
}

.tableRowLink {
  cursor: pointer;
}

.searchVaultInputBox {
  width: 100%;
  max-width: 200px;
}

.vaultTitle {
  width: 65%;
}

.tableRowLink:hover {
  color: #2895f1;
}

.lightBlue {
  color: #2895f1;
}

.songDownloadIcon {
  margin-left: 5px;
  color: #aaaaaa;
  cursor: pointer;
}

.songDownloadIcon:hover {
  color: #0f78b8;
}

.pageImagePreviewBackground {
  background: url(/images/checkerboard.png);
  border: 1px solid #bfbfbf;
  box-sizing: border-box;
}

.paddingTop10 {
  padding-top: 10px;
}

.artworkVisible {
  text-align: center;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 280px;
  width: 280px;
  overflow: hidden;
}

.artworkInputBoxVisibleBorder,
.audioFileInputBoxVisibleBorder {
  border: 1px dotted #aaaaaa;
}

.artworkInputBoxVisible {
  font-size: 10pt;
  line-height: 1.3em;
  text-align: center;
  cursor: pointer;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 280px;
  width: 280px;
  background: #eeeeee;
  box-sizing: border-box;
}

.artworkInputBoxVisibleDragOver,
.audioFileInputBoxVisibleDragOver {
  border: 1px dotted #111111 !important;
  background: #f3f3f3 !important;
}

.artworkPreview {
  max-height: 100%;
  max-width: 100%;
  width: auto;
  height: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.rightArrow {
  width: 47px;
  background-color: #00c5e5;
  color: #ffffff;
  position: relative;
  word-break: break-all;
  text-align: justify;
  padding: 4px 0px 4px 10px;
  display: inline-block;
  margin-right: 25px;
}
.rightArrow:after,
.rightArrow:before {
  content: "";
  position: absolute;
  left: 100%;
  width: 20px;
  height: 50%;
}
.rightArrow:before {
  top: 0px;
  background: linear-gradient(to top right, #00c5e5 50%, transparent 51%);
}
.rightArrow:after {
  bottom: 0px;
  background: linear-gradient(to bottom right, #00c5e5 50%, transparent 51%);
}

.pageSteps {
  margin-right: 8px;
  box-sizing: border-box;
  padding: 0px 10px 0px 10px;
  display: inline-block;
  background: #00c5e5;
  color: #ffffff;
  line-height: 24px;
}

.youtubeLoadingBackground {
  background: repeating-linear-gradient(45deg, #eeeeee, #eeeeee 10px, #cccccc 10px, #cccccc 20px);
}

.pageEditPencil {
  color: #cccccc;
  cursor: pointer;
}

.pageEditPencil:hover {
  cursor: pointer;
  text-decoration: underline;
  color: #0071c7;
}

.youtubeLoadingBackgroundDark {
  background: repeating-linear-gradient(45deg, #444444, #444444 10px, #333333 10px, #333333 20px);
}

.mobileShowInline {
  display: none;
}

.opacityHover {
  opacity: 0.75;
}

.opacityHover:hover {
  opacity: 1;
}

.opacityHoverSuper {
  opacity: 0.25;
}

.opacityHoverSuper:hover {
  opacity: 0.8;
}

.orange {
  color: #ff7227;
}

.mint {
  color: #28daab;
}

.lilac {
  color: #c746aa;
}

.dashboardCheckboxDiv {
  display: inline-block;
  width: 1.5em;
}

.mobileTopAlign {
  vertical-align: middle;
}

.termsHeadlineArea {
  margin-top: 2em;
  text-align: center;
  padding: 1em;
  box-sizing: border-box;
}

.artistLinkUrlHover {
  background-color: none;
}

.artistLinkUrlHover:hover {
  background-color: #e7e7e7 !important;
}

.highlightSubtle {
  background-color: #dfdfdf;
}

.termsHeadline {
  font-size: 18pt;
  text-align: left;
  margin: 0px 0px 3px 0px;
}

.hurryAndUpgrade {
  line-height: 1.4em;
  color: #ffffff;
  padding: 1em;
  background: #5cb85c;
  box-sizing: border-box;
}

.uploadDaysLeftBadge /* should be "upgrade" doh */ {
  background: #5cb85c;
  padding: 3px;
  border-radius: 25%;
  font-size: 8pt;
  margin-left: 3px;
}

.twoFactorContainer {
  text-align: left;
  width: 400px;
  background: #ffffff;
  box-sizing: border-box;
  margin-top: 80px;
  padding: 0em;
  border-radius: 25px;
  overflow: hidden;
  box-sizing: border-box;
  box-shadow:
    0 50px 100px -20px rgb(50 50 93 / 25%),
    0 30px 60px -30px rgb(0 0 0 / 30%);
}

.twoFactorImage {
  width: 100%;
}

.viewEditTeam {
}

li.listSpaces {
  margin-bottom: 1em;
}

.navLink {
  padding: 20px 15px 20px 15px;
  font-size: 10pt;
  /* padding: 0px 12px 0px 12px; */
  box-sizing: border-box;
  color: #ffffff !important;
  display: block;
  cursor: pointer;
}

.navLink:hover,
.navLink:focus {
  background: rgba(255, 255, 255, 0.08);
}

.navHref {
  color: inherit !important;
  text-decoration: none !important;
}

/* NEW COLORS START */

:root {
  /* GRAY */

  --gray-50: rgba(249, 250, 251, 1);
  --gray-100: rgba(243, 244, 246, 1);
  --gray-200: rgba(229, 231, 235, 1);
  --gray-300: rgba(209, 213, 219, 1);
  --gray-400: rgba(156, 163, 175, 1);
  --gray-500: rgba(107, 114, 128, 1);
  --gray-600: rgba(75, 85, 99, 1);
  --gray-700: rgba(55, 65, 81, 1);
  --gray-800: rgba(31, 41, 55, 1);
  --gray-900: rgba(17, 24, 39, 1);

  /* Blue */
  --blue-100: #e0f2ff;
  --blue-200: #cce9ff;
  --blue-500: #0073c7;
  --blue-600: #005ea3;

  /* red */
  --red-50: #fef2f2;
  --red-100: #fee2e2;
  --red-400: #f87171;
  --red-600: #dc2626;
  --red-900: #7f1d1d;

  /* Yellow */
  --yellow-100: #fef3c7;
  --yellow-200: #fde68a;
  --yellow-300: #fcd34d;
  --yellow-400: #fbbf24;
  --yellow-500: #f59e0b;
  --yellow-600: #d97706;
}

/* NEW COLORS END */

.white {
  color: #ffffff;
}

.whiteHover:hover {
  color: #ffffff;
}

.whiteVisited:visited {
  color: #ffffff;
}

.blue {
  color: #0f78b8;
}

.blueBg {
  background-color: #0f78b8;
  color: #ffffff;
}

.red {
  color: #d00000;
}

.messagingCounts {
  background: #009813;
  color: #ffffff;
  padding: 2px 10px 2px 10px;
  font-weight: 400;
  border-radius: 50px;
  font-size: 12px;
  margin-left: 2px;
}

.green {
  color: #009813 !important;
}

.lightGreen {
  color: rgba(3, 204, 28, 0.73);
}

.bg-success,
.lightGreenBg {
  background: rgba(3, 204, 28, 0.73);
}

.bg-warn {
  background: rgba(255, 204, 204, 0.75);
}

.slapStat {
  display: inline-block;
  background: rgb(12, 24, 151);
  color: #ffffff;
  padding: 0px 6px 0px 6px;
}

.yellow {
  color: yellow;
}

.gray {
  color: #999999;
}

.grayWithRedMouseover {
  color: #999999;
}

.grayWithRedMouseover:hover {
  color: #d00000;
}

.lightgray {
  color: #a9a9a9;
}

.lightlightgray {
  color: #c6c6c6;
}

.circle-processing {
  color: #ffcc37;
}

.circle-pending {
  color: #b0b0b0;
}

.teamError {
  background-color: #ffdcdc;
}

.teamReviewChanges {
  background-color: #009813;
}

.teamReviewChanges:hover {
  background-color: #00a715;
}

.teamCancel {
  background-color: #999999 !important;
}

.teamCancel:hover {
  background-color: #aaaaaa;
}

@-webkit-keyframes fadeIt {
  0% {
    background-color: #ffcc00;
  }
  100% {
    background-color: none;
  }
}
@-moz-keyframes fadeIt {
  0% {
    background-color: #ffcc00;
  }
  100% {
    background-color: none;
  }
}
@-o-keyframes fadeIt {
  0% {
    background-color: #ffcc00;
  }
  100% {
    background-color: none;
  }
}
@keyframes fadeIt {
  0% {
    background-color: #ffcc00;
  }
  100% {
    background-color: none;
  }
}

.backgroundPulse {
  background-image: none !important;
  -webkit-animation: fadeIt 1s ease-in-out;
  -moz-animation: fadeIt 1s ease-in-out;
  -o-animation: fadeIt 1s ease-in-out;
  animation: fadeIt 1s ease-in-out;
}

.teamsHeadline {
  line-height: 1em;
  max-width: 520px;
  font-size: 30pt;
  margin: 80px 0px 0px 0px;
  color: #ffffff;
}

.videoEmbediFrame {
  width: 100%;
  height: 360px;
}

.socialMediaIcon {
  height: 24px;
  width: 24px;
  position: relative;
}

.socialMediaIcon:hover {
}

.styleGuideExample {
  background: #e7f4f9;
  padding-right: 3px;
  padding-left: 3px;
}

.indentWrappedText {
  text-indent: -2em;
  padding-left: 2em;
}

.noPadding {
  padding: 0px 0px 0px 0px !important;
}
.smallPadding {
  padding: 3px 3px 3px 3px !important;
}
.lessPadding {
  padding: 5px 5px 5px 5px !important;
}
.littlePadding {
  padding: 10px 10px 10px 10px !important;
}
.dontShow {
  display: none;
}
.evenRow {
  background-color: #fefefe;
}
.oddRow {
  background-color: #eeeeee;
}

@media print {
  body * {
    visibility: hidden;
  }
  #section-to-print,
  #section-to-print * {
    visibility: visible;
  }
  #section-to-print {
    position: absolute;
    left: 0;
    top: 0;
  }
}

/* Grow Rotate (from hover.css) */
.hvr-grow-rotate {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.15s;
  transition-duration: 0.15s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow-rotate:hover,
.hvr-grow-rotate:focus,
.hvr-grow-rotate:active {
  -webkit-transform: scale(1.1) rotate(-14deg);
  transform: scale(1.1) rotate(-14deg);
}

img.desaturate {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray;
  filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale");
}

a.pageSocialMediaIconsLink,
a.pageSocialMediaIconsLink:visited {
  font-size: 22pt;
  color: #68696b;
}

a.pageSocialMediaIconsLink:hover {
  color: #0071c7;
}

.pageBandnameBox {
  font-size: 20pt;
  text-transform: uppercase;
  text-align: center;
  box-sizing: border-box;
  padding: 60px 0px 0px 0px;
}

.pageNewsletterBox {
  max-width: 1000px;
  background: #dedede;
  border-top: 1px solid #cfcfcf;
  border-bottom: 1px solid #cfcfcf;
  border-left: 1px solid #cfcfcf;
  border-right: 1px solid #cfcfcf;
  padding: 2em 3em 3em 3em;
  box-sizing: border-box;
  margin: 58px 0px 70px 0px;
}

.pageSocialMedia {
  box-sizing: border-box;
  text-align: center;
  margin-top: 10px;
}

.pageSocialMediaIcons {
  margin: 0px 0px 0px 15px;
}

.pageStoreLink {
  color: #68696b;
  border-bottom: 1px dotted black;
  font-weight: bold;
  text-decoration: none !important;
}

.pageStoreLink:hover {
  text-decoration: none !important;
}

.pagePadding {
  padding: 0px 75px 0px 75px;
}

.verticalCenteringParent {
  height: 200px;
  width: 100%;
  margin: 0px auto;
  display: table;
}

.verticalCenteringChild {
  text-align: center;
  display: table-cell;
  vertical-align: middle;
}

.littleStoreIcons {
  border: 1px solid #dddddd;
  height: 16px;
  width: 16px;
}

.whiteLink {
  color: #ffffff !important;
  text-decoration: underline;
}

.underline {
  text-decoration: underline !important;
}

.albumRow {
  float: left;
}

.helpLabel {
  font-size: 18pt;
  margin-bottom: 14px;
}

.desktopOnlyLeftMargin4 {
  margin-left: 4px !important;
}

.mobileOnlyPadding {
  padding: 0px 0px 0px 0px;
  box-sizing: border-box;
}

.chartHalfPageWidth {
  width: 50%;
  float: left;
  border: 2px solid white;
  box-sizing: border-box;
}

.hoorayCoupon {
  margin-top: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 2em auto 0;
  column-gap: 8px;
  background: #ecfdf5;
  padding: 1.4em 2em;
  box-sizing: border-box;
  border-radius: 6px;
  font-weight: 400;
  color: #065f46;
  max-width: 400px;
}

.chartFullPageWidth {
  width: 100%;
  border: 2px solid white;
  box-sizing: border-box;
  margin-top: 20px;
}

.discountHomepageGreeting {
  display: flex;
  justify-content: center;
  align-items: center;
  position: sticky;
  top: 0;
  background-color: #ecfdf5;
  color: #065f46;
  height: 68px;
  font-weight: 700;
  font-size: 16px;
  z-index: 2001; /* Above .nav-wrapper */
  box-sizing: border-box;
  padding: 1rem 1.5rem;
}

.discountHomepageGreeting .discountGreen {
  color: #059669;
}

.discountHomepageGreeting .alignGreeting {
  display: flex;
  align-self: center;
  align-items: baseline;
  column-gap: 4px;
}

.discountBanner {
  display: flex;
  justify-content: center;
  align-items: center;
  position: sticky;
  top: 0;
  height: 68px;
  z-index: 2001; /* Above .nav-wrapper */
  box-sizing: border-box;
  padding: 1rem 1.5rem;
}

.discountBanner p {
  font-weight: 700;
  font-size: 1rem;
  font-family: Lato;
}

.discountBanner--clouds {
  background-image: url("/images/backgrounds/banner_clouds.webp");
}

.discountBanner--clouds p {
  color: black;
}

.discountBanner--black-friday-2025 {
  background-image: url("/res/images/black-friday-2025-banner-background.webp");
  background-size: cover;
}

.discountBanner--black-friday-2025 p {
  color: #932221;
  z-index: 2;
  text-align: center;
}

@media (min-width: 400px) {
  .discountBanner--black-friday-2025 {
    background-size: contain;
  }

  .discountBanner--black-friday-2025::before {
    content: "";
    position: absolute;
    top: 0;
    left: 16px;
    width: 100%;
    height: calc(100% - 16px);
    background-image: url("/res/images/black-friday-2025-banner-snowflakes-left.webp");
    background-position: left;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 8px 0px;
    z-index: 1;
  }

  .discountBanner--black-friday-2025::after {
    content: "";
    position: absolute;
    top: 0;
    right: 16px;
    width: 100%;
    height: calc(100% - 16px);
    background-image: url("/res/images/black-friday-2025-banner-snowflakes-right.webp");
    background-position: right;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 8px 0px;
    z-index: 1;
  }
}

.faqFont {
  font-size: 10pt;
  line-height: 1.5em;
}

.taxFormSectionHeader {
  font-weight: bold;
  background: #eeeeee;
}

.idPerson {
  display: none;
}

.idBusiness {
  display: none;
}

.idBusinessPersonBoth {
  display: none;
}

.pageAdminBlurb {
  box-sizing: border-box;
  margin-top: 10px;
  max-width: 400px;
  line-height: 1.4em;
}

.uploadNotice {
  background: #ffff7f;
  padding: 1em;
  box-sizing: border-box;
  margin: 0px 0px 10px 0px;
}

.uploadNotice.emojiWarning {
  font-size: 12px;
}

.uploadNotice .appleEmojiWarning {
  display: none;
}

.uploadNotice.appleStoreSelected .appleEmojiWarning {
  display: inline;
}

.uploadNotice .nonAppleEmojiWarning {
  display: inline;
}

.uploadNotice.appleStoreSelected .nonAppleEmojiWarning {
  display: none;
}

.topBar {
  padding: 14px 14px 13px 14px;
  background: #0f78b8;
  color: #ffffff;
}

.pageFooter {
  position: fixed;
  bottom: 0px;
  width: 100%;
  z-index: 10000;
  text-align: center;
  padding: 20px 20px 20px 20px;
  box-sizing: border-box;
  background: #444444;
  color: #ffffff;
}

#pageSubscribeButton {
  font-size: 14px;
  margin-top: 15px;
  height: 50px;
  box-sizing: border-box;
  width: 140px;
}

.pageMailingListBlock {
  margin: 15px 0px 65px 0px;
}

.pageBlurb {
  text-transform: uppercase;
  margin: 25px 0px 0px 0px;
  max-width: 600px;
  padding: 0px 10px 0px 10px;
  box-sizing: border-box;
  color: #ffffff;
}

.selectMailingListDiv {
  background: #ffffff;
  margin-top: 5px;
  width: 329px;
  box-sizing: border-box;
}

.pageHalfDiv {
  background: #ffffff;
  margin: 0px 0px 0px 2px;
  width: 162px;
  box-sizing: border-box;
}

.coolSelectMailingList {
  border-radius: 0px;
  line-height: 30px;
  height: 30px;
  font-size: 15px;
  outline: none;
  margin: 0px;
  width: 329px;
  padding: 2px 0px 0px 5px;

  border: none;
  background: #ffffff;
  width: 329px;
  overflow: hidden;
  color: #68696b;
}

.pageJoinButton {
  width: 329px;
  box-sizing: border-box;
  height: 35px;
  font-size: 10pt !important;
}

.coolSelect {
  border-radius: 0px;
  line-height: 30px;
  height: 30px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px;
  padding: 2px 0px 0px 5px;
}

.coolSelectModern {
  background: #ffffff;
  border-radius: 0px;
  min-width: 200px;
  line-height: 42px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px !important;
  padding: 0px 36px 0px 8px; /* the 36 is to make room for the down carat */
  font-weight: 400;
  width: 100%;
  max-width: 600px;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.ccTable {
  width: 70%;
}

.pageSongs {
  max-height: 135px;
  overflow-y: scroll;
  overflow-x: hidden;
}

.pageSongs::-webkit-scrollbar {
  -webkit-appearance: none;
}

.pageSongs::-webkit-scrollbar:vertical {
  width: 11px;
}

.pageSongs::-webkit-scrollbar-thumb {
  border-radius: 8px;
  border: 2px solid #eeeeee; /* should match background, can't be transparent */
  background-color: rgba(0, 0, 0, 0.25);
}

.pageSongs::-webkit-scrollbar-track {
  background-color: #eeeeee;
  border-radius: 8px;
}

.mobileLineBreak {
  display: inline;
}

.pageSectionContent {
  font-size: 10pt;
  width: 100%;
}

.pageBottomSection {
  position: absolute;
  bottom: 0px;
  padding: 0px 14px 16px 0px;
}

.pageSeparator {
  border-bottom: 1px solid #dddddd;
  text-transform: uppercase;
  font-size: 8pt;
  margin: 0px 0px 10px 0px;
  padding: 2px 4px 2px 0px;
  box-sizing: border-box;
  width: 259px;
}

.albumBlock {
  position: relative;
  background: #eeeeee;
  border-bottom: solid 5px #dddddd;
  padding: 16px 16px 12px 16px;
  width: 100%;
  clear: both;
  box-sizing: border-box;
  margin: 0px 0px 2em 0px;
}

.pageArtContainer {
  float: left;
}

.pageSongsContainer {
}

.pageStoreButtonContainer:hover {
  background: #a5a5a5;
}

.pageStoreButtonContainer {
  cursor: pointer;
  background: #999999;
  padding: 10px 10px 10px 10px;
  margin: 2px 0px 0px 0px;
  color: #ffffff;
  width: 100%;
  max-width: 300px;
  box-sizing: border-box;
}

.pageStores {
  margin: 2em 0px 0px 0px;
}

.pageSong {
  margin: 4px 0px 0px 0px;
}

.pageSongCount {
  margin: 1em 0px 0px 0px;
}

.pageMetadata {
  float: left;
  margin-left: 10px;
  text-align: left;
}

.pageReleaseDate {
  text-transform: uppercase;
  font-size: 8pt;
  margin: 4px 0px 0px 0px;
}

.pageAlbumTitle {
  font-weight: bold;
  font-size: 14pt;
}

.pageBandname {
  font-size: 100px;
  font-weight: bold;
  margin: 200px 0px 30px 0px;
  color: #ffffff;
  font-family: helvetica, arial;
}

.pageContainer {
  box-sizing: border-box;
  padding: 10px 50px 0px 50px;
  min-height: 600px;
  min-width: 700px;
}

.artworkInPage {
  background: #eeeeee;
  border: 1px solid #dddddd;
  width: 300px;
  height: auto;
  min-width: 300px;
}

.floatRightUnlessMobile {
  float: right;
}

.tableHeader a,
.tableHeader a:hover,
.tableHeader a:active,
.tableHeader a:visited {
  text-decoration: underline;
  color: white;
}

.appleSelectCSS {
  width: 10em;
}

.appleArtistCSS {
  width: 15em;
}

.coverFull {
  display: none;
  border-left: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
  width: 100%;
  height: 100%;
}

.clipartDiv {
  position: absolute;
  right: 0px;
  bottom: -3px;
  width: 50%;
}

.planPrice {
  font-size: 16px;
  margin-top: 5px;
}

.ccImages {
  margin: 0px 0px 0px 2px;
  box-sizing: border-box;

  width: 100px;
  height: 16px;
}

.grayBox {
  background: #f2f2f2;
  border: 1px solid #333333;
  padding: 1em;
  font-weight: 400;
  color: #666666;
}

.sloganBig {
  font-size: 58px;
  margin-top: 5px;
  letter-spacing: -0.5px;
  font-weight: 900;
  text-transform: uppercase;
  display: inline-block;
  margin-left: -3px;
}

.sloganMedium {
  font-size: 26px;
  margin-top: 5px;
  font-weight: 900;
  text-transform: uppercase;
  display: inline-block;
}

.mobileBreak,
.mobileBr {
  display: inline;
}

.logoFrontPage {
  width: 230px;
  height: 69px;
}

.navLoggedIn {
  background: var(--gray-600);
  color: #ffffff;
  /* box-shadow:0px -1px 12px #000000; */
  border-bottom: 1px solid rgba(0, 0, 0, 0.21);
}

.navNotLoggedIn {
  background: var(--gray-600);
  color: #ffffff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.21);
}

.navNotLoggedInFrontPage {
  background: #0f78b8;
  color: #ffffff;
}

.bigFrontHeader {
  position: relative;
  background: #0f78b8;
  color: #ffffff;
  padding: 60px 0px 170px 0px;
}

.navInnerLogLoggedIn {
  background: #0f78b8;
  color: #ffffff;
}

.width100exceptMobile {
  width: 100%;
}

.rightNavMarginMobile {
  margin-right: 2.8vw;
}

.uppercase {
  text-transform: uppercase;
}

.headerLoggedOutNav {
  text-align: right;
  width: 100%;
  max-width: 1140px;
  /* padding:20px 0px 16px 0px; */
}

.popup .headerLoggedOutNav,
.popup .footerStuff {
  display: none;
}

.outer {
  width: 100%;
  text-align: center;
}

.inner {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  display: inline-block;
  width: 100%;
}

.outer2 {
  width: 100%;
  text-align: center;
}

.inner2 {
  display: inline-block;
}

.buttonKindaSmall {
  -webkit-appearance: none;
  background-color: #0f78b8;
  color: #ffffff !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 1px solid #006ca4;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  margin: -3px 0px 0px 0px;
  border: 1px solid #03386a;
  font-size: 9pt;
  padding: 6px 10px 6px 10px;
}

.buttonKindaSmall:hover {
  background: #0884c5;
}

.mobileNewLine {
  float: left;
}

.smallTextUnderInput {
  font-size: 12px;
  margin-top: 2px;
}

.smallTextUnderInputLabel {
  margin-top: -10px;
}

.homepageBanner {
  background: black;
  color: white;
  padding: 20px;
  /* background-image:url(/images/big-guitar2.jpg); */
  background-color: #0f78b8;
  background-position: 0px 0px;
  height: 400px;
}

.pressHypebot {
  width: 342px;
  height: 68px;
  margin-top: -20px;
}

.icon {
  vertical-align: text-top;
}

.upSell {
  background: #f1f1ff;
  padding: 10px;
  margin: 10px 0px 0px 0px;
  display: inline-block;
  border: 1px solid #0071c7;
  cursor: pointer;
  font-size: 10pt;
  font-weight: 400;
}

.upSell:hover {
  background: #eeeeff;
}

.finePrint {
  font-size: 8pt;
}

.linkIcon {
  margin: 0px 0px -2px 5px;
}

.distroFileInput {
}

.tableLight {
  height: 14px;
  width: 14px;
  margin-bottom: -2px;
}

.signOut {
  margin: 2px 5px 0px 0px;
  float: right;
  height: 11px;
  width: 11px;
  background: url(/images/logout-blue.png);
}

.ui-progressbar-value {
  transition: width 0.4s ease-in-out;
  background: white;
  background-image: url(/images/progress-bar-animation.gif) !important;
}
.distroProgressBar {
  height: 20px;
  position: relative;
  margin-bottom: 5px;
}
.distroProgressBarLabel {
  font-size: 11px;
  width: 100%;
  position: absolute;
  text-align: left;
  line-height: 20px;
  padding-left: 5px;
}
.distroProgressBarLabelRight {
  font-size: 11px;
  position: absolute;
  right: 0px;
  line-height: 20px;
  padding-right: 5px;
}
.distroProgressBarDone {
  background: #35586c;
  border: 1px solid black;
}
.distroLabelDone {
  color: white;
  text-shadow: none;
}

.distroProgressBarError {
  background: #d00000;
  border: 1px solid black;
}
.distroLabelError {
  color: white;
  text-shadow: none;
}

.UPC {
  float: right;
  text-align: right;
}

.redborderpadding {
  border: 2px solid red !important;
  padding: 10px 5px 5px 5px;
}
/* .ui-progressbar-value{background:white; background-image:url(/images/progress-bar-animation.gif) !important;} */

.ui-progressbar-value {
  position: absolute;
  top: 0;
  left: 0;
  height: 30px;
  width: 200px;
  margin-top: -20px; /* half the height */
  margin-left: -100px; /* half the width */
  border-radius: 0;
  background-image: -webkit-linear-gradient(
    -45deg,
    #00d152 25%,
    rgba(255, 154, 26, 0) 25%,
    rgba(255, 154, 26, 0) 50%,
    #00d152 50%,
    #00d152 75%,
    rgba(255, 154, 26, 0) 75%
  ) !important;
  background-image: -moz-linear-gradient(
    -45deg,
    #00d152 25%,
    rgba(255, 154, 26, 0) 25%,
    rgba(255, 154, 26, 0) 50%,
    #00d152 50%,
    #00d152 75%,
    rgba(255, 154, 26, 0) 75%
  ) !important;
  background-image: -o-linear-gradient(
    -45deg,
    #00d152 25%,
    rgba(255, 154, 26, 0) 25%,
    rgba(255, 154, 26, 0) 50%,
    #00d152 50%,
    #00d152 75%,
    rgba(255, 154, 26, 0) 75%
  ) !important;
  background-image: linear-gradient(
    -45deg,
    #00d152 25%,
    rgba(255, 154, 26, 0) 25%,
    rgba(255, 154, 26, 0) 50%,
    #00d152 50%,
    #00d152 75%,
    rgba(255, 154, 26, 0) 75%
  ) !important;
  background-color: #00db56;
  background-size: 100px 100px;
  border: none;
  -webkit-animation: loading-bar-animation 1.2s linear infinite;
  -moz-animation: loading-bar-animation 1.2s linear infinite;
  -ms-animation: loading-bar-animation 1.2s linear infinite;
  animation: loading-bar-animation 1.2s linear infinite;
}

@-webkit-keyframes loading-bar-animation {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 50px 50px;
  }
}

@-moz-keyframes loading-bar-animation {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 50px 50px;
  }
}

@-ms-keyframes loading-bar-animation {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 50px 50px;
  }
}

@-webkit-keyframes loading-bar-animation {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 50px 50px;
  }
}

.ui-progressbar .ui-progressbar-value {
  margin: 0 !important;
}

.distroProgressBar {
  height: 40px;
  position: relative;
  margin-bottom: 20px;
  border-radius: 24px;
  border: 1px solid #f2f2f2;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.distroProgressBarLabel {
  font-size: 14px;
  width: 100%;
  position: absolute;
  text-align: left;
  line-height: 39px;
  padding-left: 16px;
  z-index: 1000;
  text-transform: none;
  color: #000;
}
.distroProgressBarLabelRight {
  font-size: 14px;
  position: absolute;
  right: 0px;
  line-height: 39px;
  padding-right: 16px;
  z-index: 1000;
  color: #000;
}
.distroProgressBarDone {
  background: #35586c;
  border: 1px solid black;
}
.distroLabelDone {
  color: white;
  text-shadow: none;
}

.distroProgressBarError {
  background: #d00000;
  border: 1px solid black;
}
.distroLabelError {
  color: white;
  text-shadow: none;
}

.kenburns {
  width: 100%;
  height: auto;
  position: relative;
  margin: auto;
}
.kenburns img {
  /* Avoid flashing */
  display: none;
}
.kenburns canvas {
  /* Make it responsive */
  width: 100%;
  height: auto;
}

.logoMobile {
  height: 25px;
  width: 138px;
  position: absolute;
  top: 11px;
  left: 10px;
  display: none;
}

.statusLightContainer {
  bottom: 0px;
  left: 1px;
  float: left;
  margin: 11px 8px 0px 0px;
}

.albumCoverIcon {
  float: left;
  margin-right: 5px;
  height: 35px;
  width: 35px;
}

.tableHeader {
  /* background:#E7F2FB; */
  background: #0f78b8;
  text-transform: uppercase;
  color: #ffffff;
  padding: 1em;
}

.tableHeader2 {
  /* background:#E7F2FB; */
  background: #666666;
  text-transform: uppercase;
  color: #ffffff;
  padding: 10px;
}

.withdrawalInfoBox {
  margin: 3em 0px 1em 0px;
  border: 1px solid #666666;
  font-size: 12pt;
  background: #f2f2f2;
  color: #000000;
  padding: 10px;
}

.tableHeader3 {
  /* background:#E7F2FB; */
  background: #f2f2f2;
  text-transform: uppercase;
  color: #000000;
  padding: 10px;
}

.tableRow {
  border-bottom: 1px solid #e7f2fb;
  padding: 10px;
}

.tableCell {
  padding: 20px 15px 20px 15px;
  border-bottom: 1px solid #e7f2fb;
}

.tableCellSmallFont {
  padding: 20px 15px 20px 15px;
  border-bottom: 1px solid #e7f2fb;
  font-size: 8pt;
}

.tableCellLeft {
  width: 205px;
}

.tableRow:hover {
  background: #fcfcfc;
}

.hoverColor:hover {
  color: #0071c7;
}

.songRow {
  width: 78%;
  float: left;
}

.storeRow {
  text-align: right;
  float: right;
  min-width: 70px;
  margin-top: 11px;
}

.formContainer {
  width: 50%;
  min-width: 320px;
}

.bannerContainer {
  margin: 0px;
  position: absolute;
  left: 0px;
  width: 100%;
}

.everythingButNav {
  margin: 0px 15px 15px 15px;
  max-width: 1140px;
}

.notify {
  background: #ffcc00;
  padding: 7px 5px 5px 5px;
  margin: 0px 0px 10px 0px;
  color: #68696b;
  display: none;
}

.signinBoxNotification {
  background: #ffcc00;
  padding: 7px 5px 5px 5px;
  margin: 0px 0px 10px 0px;
  color: #68696b;
  display: none;
  font-size: 9pt;
}

.signinBoxContainer {
  position: relative;
}

.navInnerInner {
  /* padding:5px 15px 5px 5px; */
}

.fkNavInnerInner {
  /* padding:5px 15px 5px 5px; */
  float: right;
  text-align: right;
  box-sizing: border-box;
}

.planBox {
  float: left;
  text-align: center;
  padding: 30px 10px 30px 10px;
  box-sizing: border-box;
}

.planBoxEmpty {
  float: left;
  text-align: center;
  padding: 0px 10px 30px 10px;
}

.planBox:hover {
  padding: 29px 9px 29px 9px;
  border: 1px solid #cce7ff;
  background: #f4faff !important;
}

.webview .planBoxMobile,
.webview .planBoxMobile:hover {
  padding: 30px 10px 30px 10px !important;
}

.planTitle {
  font-size: 22pt;
  text-align: center;
  margin: 0px 0px 20px 0px;
  padding-top: 0px;
  text-align: center;
  color: #0071c7;
  font-size: 12pt;
}

.planDesc {
  text-align: center;
  margin: 0px 0px 30px 0px;
  line-height: 17pt;
  width: 260px;
}

.planButton {
  margin-top: 20px !important;
  width: 65% !important;
}

.planButtonGray {
  background: #ccc !important;
  cursor: default !important;
  border: 1px solid #bbb !important;
  outline: 0;
}

.buttonGray {
  background: #ccc !important;
  cursor: default !important;
  border: 1px solid #bbb !important;
  outline: 0;
}

.planContainer {
  margin: 60px 0px 0px 0px;
  text-align: center;
}

.navInner {
  font-size: 11pt;
}

a {
  text-decoration: none;
  color: #0071c7;
}

.linklike {
  cursor: pointer;
  text-decoration: none;
  color: #0071c7;
}

.linklike:hover {
  text-decoration: underline;
}

.linklikeDotted {
  cursor: pointer;
  text-decoration: none;
  border-bottom: 1px dotted #0071c7;
  color: #0071c7;
}

a:hover {
  text-decoration: underline;
  color: #0071c7;
}

a.noHover:hover {
  text-decoration: none !important;
  color: red !important;
}

a:active,
a:visited {
  color: #0071c7;
}

a.black-color:active,
a.black-color:visited {
  color: #222;
}

.iconX {
  background-image: url(/images/x.png);
  background-position: 0px -1px;
  background-repeat: no-repeat;
  padding-left: 20px; /* Or size of icon + spacing */
}

.signinForgotPassword {
  margin: 6px 0px 5px 0px;
  font-size: 8pt;
}

.pointer {
  cursor: pointer;
}

.coolInputNoFancyBrowserStuff {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  border-radius: 0;
}

.coolInput {
  border-radius: 0px;
  width: 50%;
  min-width: 200px;
  line-height: 30px;
  height: 30px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px !important;
  padding: 2px 0px 0px 5px;
  font-weight: 400;
}

input.coolInput::placeholder {
  opacity: 0.3;
}

.textNumBig {
  border-radius: 0px;
  width: 100px;
  min-width: 0px;
  line-height: 30px;
  height: 2em;
  font-size: 24px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px !important;
  padding: 2px 0px 0px 5px;
  font-weight: 900;
  text-align: center;
  letter-spacing: 3px;
}

.phoneVerificationLink {
  font-weight: 525;
  cursor: pointer;
  color: #0071c7;
}

.phoneVerificationLink:hover {
  text-decoration: underline;
}

.phoneVerificationInput {
  width: 10rem;
  border-radius: 0.3rem;
}

.myCustomSpotifyUri {
  border-radius: 0px;
  width: 50%;
  min-width: 200px;
  line-height: 30px;
  height: 30px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px 0px 9px 0px !important;
  padding: 2px 0px 0px 5px;
}

.formLabel {
  font-size: 11px;
  margin-bottom: 3px;
  font-weight: 400;
}

.formSubLabel {
  font-size: 11px;
  margin-bottom: 3px;
  font-weight: 400;
  color: #999999;
}

.formSubLabelRed {
  font-size: 11px;
  margin-bottom: 3px;
  font-weight: 400;
  color: #d00000;
}

.formSubLabelStrong {
  font-size: 16px;
  margin-bottom: 0.5em;
  margin-top: -0.5em;
  font-weight: 400;
  color: #999999;
}
label.formLabelStrong {
  display: block;
  font-size: 16px;
  margin-bottom: 0.5em;
  font-weight: 600;
}

.coolInputModern {
  border-radius: 0px;
  min-width: 200px;
  line-height: 42px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px !important;
  padding: 0px 0px 0px 8px;
  font-weight: 400;
  width: 100%;
  max-width: 600px;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.coolInputShort {
  border-radius: 0px;
  min-width: 200px;
  line-height: 30px;
  height: 30px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px !important;
  padding: 2px 0px 0px 5px;
}

.coolTextarea {
  border-radius: 0px;
  width: 50%;
  min-width: 200px;
  line-height: 30px;
  height: 30px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px !important;
  padding: 2px 0px 0px 5px;
  height: 75px;
  font-weight: 300;
  color: #68696b;
  line-height: 1.3em;
  font-family: "Lato", helvetica, arial, sans;
}

.coolTextareaModern {
  min-width: 200px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px !important;
  padding: 8px;
  height: 75px;
  font-weight: 400;
  color: #68696b;
  line-height: 1.3em;
  font-weight: 400;
  width: 100%;
  max-width: 600px;
  box-sizing: border-box;
  font-family: inherit;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.coolInputMailingList {
  font-family: ".HelveticaNeueDeskInterface-Regular", Helvetica, Arial;
  width: 329px;
  line-height: 30px;
  height: 30px;
  font-size: 15px;
  outline: none;
  margin: 0px;
  padding: 2px 0px 0px 8px;
  box-sizing: border-box;
  border: none;
}

.line {
  border: 0;
  border-top: 1px solid #ccc;
}

.coolInputSmall {
  width: 10%;
  min-width: 50px;
  line-height: 30px;
  height: 30px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px;
  padding: 2px 0px 0px 5px;
}

/* .homeFormInput
	{
	width:100%;
	line-height:40px;
	height:40px;
	font-size:16px;
	border:none;
	outline:none;
	border-width:0px;
	margin:0px;
	padding:0px;
	font-weight: 400;
	} */

/* .homeFormInputContainer
	{
	border:1px solid #AAA;
	padding-left:10px;
	margin-bottom:5px;
	background-color: white;
	box-sizing: border-box;
	width: 100%;
	} */

/* .homeFormInputContainerSignin
	{
	border:1px solid #AAA;
	border-radius: 6px;
	padding-left:10px;
	} */

.input {
  width: 100%;
  line-height: 40px;
  font-size: 20px;
  border: none;
  outline: none;
  border-width: 0px;
  margin: 0px;
  padding: 0px;
}

.inputContainer {
  border: 1px solid #aaaaaa;
  padding-left: 7px;
  margin-bottom: 5px;
  background: #ffffff;
}

body {
  margin: 0px;
  padding: 0px 0px 0px 0px;
  background-color: #ffffff;
  /* color: #68696b; */
  /* color: #2E2F33; */
  color: #4f5057;
  margin: 0px;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 300;
  font-size: 11pt;
}

.albumTitleBig {
  font-family: "Lato3", helvetica, arial, sans;
  font-weight: 900;
  font-size: 34pt;
}

.bandNameBig {
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 300;
  font-size: 18pt;
}

.heading {
  text-transform: uppercase;
  font-size: 1.5em;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 900;
  margin-top: 2em;
}

/*.homeError
	{
	text-transform: uppercase;
	}*/

.homeError {
  font-weight: 400;
  color: #b91c1c;
  padding-bottom: 8px;
}

.button {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #0f78b8;
  color: #ffffff !important;
  text-transform: uppercase;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #006ca4;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.button-like {
  margin: 0;
  padding: 10px 16px;
  text-decoration: none;
  text-transform: uppercase;
  border: 1px solid #ccc;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  outline: none;
  user-select: none;
}

.button-like.blue {
  background-color: #0f78b8;
  border-color: #0f78b8;
  color: #fff;
}

.buttonNft {
  padding: 12px 30px;
  -webkit-appearance: none;
  background-color: rgb(32, 129, 226);
  color: #ffffff !important;
  text-transform: uppercase;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid rgb(32, 129, 226);
  font-family: "Poppins", "Lato", helvetica, arial, sans;
  font-weight: 600;
  font-size: 16px;
  text-align: center;
  cursor: pointer;
  border-radius: 10px;
  outline: none;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.buttonOutline {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #ffffff;
  color: #0f78b8;
  text-transform: uppercase;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #006ca4;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.buttonOutline:hover {
  background-color: #e7f6ff;
}

.buttonPill {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #0f78b8;
  color: #ffffff !important;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #0f78b8;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 500px; /* intentionally large border-radius gives pill-shape */
  outline: none;
  text-transform: none;
  display: inline-block;
}

.blueHover {
  color: #0f78b8;
}

.blueHover:hover {
  color: #0884c5;
}

.buttonRoundish {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #0f78b8;
  color: #ffffff !important;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #0f78b8;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 5px;
  outline: none;
  text-transform: none;
  display: inline-block;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
	                                  supported by Chrome, Edge, Opera and Firefox */
}

.buttonRoundishGray {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #dbd8d8;
  color: #333 !important;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #ccc;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 5px;
  outline: none;
  text-transform: none;
  display: inline-block;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
	                                  supported by Chrome, Edge, Opera and Firefox */
}

.buttonRoundishGray:hover {
  background-color: #ddd;
}

.buttonRoundishWhite {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #ffffff;
  color: #333 !important;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #ddd;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 5px;
  outline: none;
  text-transform: none;
  display: inline-block;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
	                                  supported by Chrome, Edge, Opera and Firefox */
}

.buttonRoundishWhite:hover {
  border-color: #ccc;
}

.buttonRoundishGreen {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #28a745;
  color: #ffffff !important;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #28a745;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 5px;
  outline: none;
  text-transform: none;
  display: inline-block;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
	                                  supported by Chrome, Edge, Opera and Firefox */
}

.buttonRoundishGreen:hover {
  background: #2ab149;
}

.buttonRoundishOutline {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #ffffff;
  color: #006ca4 !important;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #0f78b8;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 5px;
  outline: none;
  text-transform: none;
  display: inline-block;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.buttonPillOutline {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #006ca4;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 500px; /* intentionally large border-radius gives pill-shape */
  outline: none;
  text-transform: none;
  display: inline-block;
  background-color: #ffffff;
  color: #006ca4 !important;
}

.buttonPillOutline:hover {
  background-color: #e7f6ff;
}

.buttonRoundishOutline:hover {
  background-color: #e7f6ff;
}

.buttonCancel {
  padding: 10px 10px 10px 10px;
  -webkit-appearance: none;
  background-color: #dddddd;
  color: #333333 !important;
  text-transform: uppercase;
  text-decoration: none !important;
  margin: 0px;
  border: 1px solid #cccccc;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
}

.buttonCancelSmall {
  -webkit-appearance: none;
  background-color: #dddddd;
  color: #666666 !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 1px solid #cccccc;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  font-size: 10pt;
  text-align: center;
  padding: 5px 6px 5px 6px;
}

.buttonPink {
  -webkit-appearance: none;
  background-color: #f3267f;
  color: #ffffff !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: none;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  font-size: 10pt;
  text-align: center;
  padding: 16px 16px 14px 16px;
  border-radius: 4px;
}

.buttonPink:hover {
  background: #e61771;
}

.buttonPink:active {
  background: #d21165;
  box-shadow: inset -1px 1px 1px #bb0d58;
  outline: none;
}

.buttonPink:disabled,
.buttonPink[disabled] {
  background: #c5c5c5;
}

.buttonSmall {
  -webkit-appearance: none;
  background-color: #0f78b8;
  color: #ffffff !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 1px solid #006ca4;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  font-size: 10pt;
  text-align: center;
  padding: 6px 6px 4px 6px;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.buttonSmallOutline {
  -webkit-appearance: none;
  color: #006ca4 !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 1px solid #006ca4;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  font-size: 10pt;
  text-align: center;
  padding: 6px 6px 4px 6px;
}

.redBackgroundOnHover:hover {
  background-color: #d00000;
  color: #ffffff !important;
  border: 1px solid #d00000 !important;
}

.buttonSmallGray {
  -webkit-appearance: none;
  background-color: #bfbfbf;
  color: #333333 !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 1px solid #aaaaaa;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  font-size: 10pt;
  text-align: center;
  padding: 6px 6px 4px 6px;
}

.buttonSmallGreen {
  -webkit-appearance: none;
  background-color: #009813;
  color: #ffffff !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 1px solid #88b295;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  font-size: 10pt;
  text-align: center;
  padding: 6px 6px 4px 6px;
}

.buttonSmallGreen:hover {
  background-color: #03ab1a;
}

.buttonSmallRed {
  -webkit-appearance: none;
  background-color: #d00000;
  color: #ffffff !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 1px solid #88b295;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
  font-size: 14pt;
  text-align: center;
  cursor: pointer;
  border-radius: 0px;
  outline: none;
  font-size: 10pt;
  text-align: center;
  padding: 6px 6px 4px 6px;
}

.buttonSmallRed:hover {
  background-color: #e33d3d;
}

.button.disabled {
  background: #42a0d1 !important;
}

.buttonRounded:not([disabled]) {
  cursor: pointer;
}

.buttonRounded2 {
  white-space: nowrap;
  padding: 0.75rem 20px;
  text-align: center;
  display: inline-block;
  width: auto;
  font-weight: 600;
  font-size: 1rem;
  border: none;
  cursor: pointer;
  border-radius: 0.375rem;
  background-color: #0073c7;
  color: #ffffff !important;
  text-decoration: none !important;
}

.buttonRounded {
  margin: 0.3125em 0px 0.3125em 0px;
  padding: 0.625em 2em;
  box-shadow: none;
  font-weight: 500;
  border: 0;
  border-radius: 0.25em;
  white-space: nowrap;
  background: initial;
  background-color: #3085d6;
  color: #fff;
  font-size: 1.0625em;
  -webkit-appearance: none;
  text-align: center;
}

.buttonRounded:focus {
  outline: none;
  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px rgba(50, 100, 150, 0.4);
}

.buttonRounded::-moz-focus-inner {
  border: 0;
}

.buttonRounded:hover {
  background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1));
}

.slogan {
  font-size: 1em;
  margin: 10px 0px 15px 0px;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 400;
}

.button:hover {
  background: #0884c5;
}

.buttonRoundish:hover {
  background: #0884c5;
}

.buttonSmall:hover {
  background: #0884c5;
}

.buttonModern {
  text-align: center;
  font-size: 12pt;
  background: #0073c7;
  color: #ffffff;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 5px;
  box-sizing: border-box;
  display: inline-block;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  border: none;
  -webkit-appearance: none;
}

.buttonModern:hover {
  background: #0884c5;
}

.buttonModernGray {
  text-align: center;
  font-size: 12pt;
  background: #aaaaaa;
  color: #ffffff;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 5px;
  box-sizing: border-box;
  display: inline-block;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  border: none;
  -webkit-appearance: none;
}

.buttonModernGray:hover {
  background: #b3b3b3;
}

.buttonModernGreen {
  text-align: center;
  font-size: 12pt;
  background: #009813;
  color: #ffffff;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 5px;
  box-sizing: border-box;
  display: inline-block;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  border: none;
  -webkit-appearance: none;
}

.buttonModernGreen:hover {
  background: #009d16;
}

.buttonGray:active {
  background: #0f78b8;
  box-shadow: inset -1px 1px 1px #b5b5b5 !important;
  outline: none;
}

.button:active {
  background: #0f78b8;
  box-shadow: inset -1px 1px 1px #0f78b8;
  outline: none;
}

.buttonSmall:active {
  background: #0f78b8;
  box-shadow: inset -1px 1px 1px #0f78b8;
  outline: none;
}

input {
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 300;
  color: #68696b;
}
.black {
  color: #000000;
}

.black {
  font-weight: 900;
}

.bold {
  font-family: "Lato3", helvetica, arial, sans;
  font-weight: 700;
}

.italic {
  font-style: italic;
}

/* Structure */
.wrapper {
  width: 100%;
  max-width: 1140px;
  margin: auto;
  padding: 0%;
  transition: 0.3s;
}

/* DC-16738 - why 2?
.wrapper
	{
	width:100%;
	max-width: 1140px;
	margin:auto;
	padding:0px;
	}
*/
#main,
.mainSection {
  width: 45%;
  margin-right: 5%;
  float: left;
}
aside {
  width: 49%;
  float: right;
}
/* Logo H1 */
header h1 {
  width: 276px;
  height: 50px;
  float: left;
  display: block;
}
/* Nav */
header nav {
  float: right;
  margin-top: 0px;
}
header nav li {
  display: inline;
  margin-left: 0px;
}
#skipTo {
  display: none;
}
#skipTo li {
  background: #b1fffc;
}
/* Banner */

#banner {
  float: left;
  margin-bottom: 15px;
  width: 100%;
}

#banner img {
  width: 100%;
}

.desktopLinebreak {
  height: 2em;
}

.greenAdvanceDot {
  width: 0.75em;
}

.dk__ .editRelease .releaseDateInput {
  margin-right: 5px;
  width: auto;
}
/*
Language Selector
*/

.cf:after {
  clear: both;
}

.cf:after,
.cf:before {
  content: "";
  display: table;
}

.page-header {
  padding: 40px 15px;
  font-size: 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  border-collapse: collapse;
}

.page-header__title {
  float: left;
  font-size: 24px;
  font-weight: 500;
}

.page-header-body-text {
  font-weight: 400;
  margin-top: 32px;
  margin-bottom: 0;
}

.page-header__actions {
  vertical-align: middle;
}

.tag-beta {
  display: inline-block;
  font-size: 9px;
  text-transform: uppercase;
  font-weight: bold;
  background: #fef4d7;
  padding: 3px;
  color: #5c4812;
  border: 1px solid #f5cb64;
  border-radius: 3px;
  margin-right: 5px;
}

.tag-new {
  position: relative;
  top: -2px;
  display: inline;
  border: none;
  background-color: #fff079;
  padding: 3px 8px;
  color: #6a4401;
  border-radius: 5px;
  font-size: 8px;
  margin-left: 3px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

.tag-new .fa-star {
  color: #ddbb3a;
}

.language-select {
  padding: 5px;
  border: 1px solid rgba(0, 0, 0, 0.3);
  margin-left: 3px;
}

#sitetran_translate_element {
  display: inline-block;
}

#sitetran_translate_element select {
  padding: 5px;
  border: 1px solid rgba(0, 0, 0, 0.3);
  margin-left: 3px;
}

#sitetran_translate_element select:focus {
  outline: none;
}

/* End */

/* Top Navigation */
.uploadCloud {
  margin: 1px 6px 0px 0px;
  height: 14px;
  opacity: 0.6;
  vertical-align: text-top;
}

.caret-down {
  font-size: 20px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.6);
  padding: 0 0 0 5px;
  transform: translateY(15%);
}

.caret-right {
  font-size: 20px;
  font-weight: 600;
  color: rgba(74, 74, 74, 0.6);
  padding: 0 0 0 5px;
  vertical-align: middle;
}

.caret-avatar,
.caret-crossproduct {
  padding: 0 0 0 6px;
  align-self: center;
}

.avatar {
  display: inline-block;
  align-self: center;
}

.avatar-image {
  vertical-align: middle;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.9);
  background-size: cover;
  background-position: top center;
  box-sizing: border-box;
}

.avatar-badge {
  background-color: #e4f2f9;
  border-radius: 50%;
  color: #0f7bbe;
  font-weight: 700;
  padding: 3px 3px;
  margin: -3px -3px 0 0;
  font-size: 10px;
  position: absolute;
  top: 12px;
  right: 27px;
  min-width: 12px;
  text-align: center;
  box-sizing: content-box;
  line-height: normal;
}

.menu-badge-blue {
  position: relative;
  bottom: 1px;
  display: inline-block;
  background: #e4f2f9;
  color: #0f7bbe;
  font-weight: 700;
  padding: 0 6px;
  border-radius: 80px;
  font-size: 12px;
  margin-left: 3px;
  min-width: 11px;
  text-align: center;
}

.menu-badge-green {
  position: relative;
  display: inline;
  float: right;
  background: #edfef3;
  color: #00a63d;
  font-weight: 700;
  padding: 3px 12px;
  border-radius: 80px;
  font-size: 12px;
}

.menu-badge-green2 {
  background: #90ee90;
  color: #166534;
  border-radius: 50px;
  padding: 3px 7px;
  font-size: 12px;
  display: inline;
  font-weight: 700;
}

.nav-overlay {
  transition: background-color 0.5s ease;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: transparent;
  opacity: 0.6;
  z-index: 100;
}

.nav-wrapper {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  /* padding: 8px 10px 10px 0; */
  position: relative;
  z-index: 2000;
  font-weight: 400;
  font-family: "Lato", helvetica, arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.nav-href {
  padding: 18px 12px;
  color: white !important;
  text-decoration: none !important;
  box-sizing: border-box;
  display: block;
  cursor: pointer;
}

.nav-href:hover,
#button-account.nav-link:hover {
  background: rgba(0, 0, 0, 0.1);
}

#button-account.nav-link {
  padding: 12px;
  display: flex;
  justify-content: center;
}

#button-goodies.nav-href {
  margin-top: -2px;
}

#button-mobile.nav-href {
  margin-top: -2px;
}

.nav-link {
  transition: opacity 0s;
  font-weight: 600;
  font-family: "Lato", helvetica, arial, sans-serif;
  font-size: 11pt;
  padding: 0 6px;
  cursor: pointer;
  opacity: 0.9;
  display: block;
}

.nav-submenu {
  position: relative;
  text-align: left;
}

.nav-menu::before {
  /* arrow */
  content: "";
  position: absolute;
  top: 6px;
  transform: translatex(-50%);
  border-bottom: 10px solid white;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  box-shadow: -3px -3px 5px rgba(80, 90, 120, 0.05);
}

.nav-menu {
  position: absolute;
  display: none;
  z-index: 1050;
  border-radius: 4px;
  overflow: hidden;
  padding: 0;
  width: 299px;
  transition: all ease-out 0.5s;
  box-shadow:
    0 50px 100px -20px rgba(50, 50, 93, 0.25),
    0 30px 60px -30px rgba(0, 0, 0, 0.3);
  transform-origin: center -20px;
}

.nav-menu-body {
  margin-top: 16px;
  background: white;
  border-radius: 4px;
}

.nav-menu-body hr {
  height: 1px;
  border: 0;
  color: rgba(0, 0, 0, 0.1);
  background-color: rgba(0, 0, 0, 0.1);
  padding: 0;
  margin: 12px 0;
}

.nav-menu-body .menu-item {
  padding: 25px 15px 25px 30px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  cursor: pointer;
}

.nav-menu-body .menu-item:hover {
  background: rgba(15, 120, 184, 0.05);
}

.nav-menu-body .menu-item .title {
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  color: #0f78b8;
}

.nav-menu-body .menu-item .title a {
  cursor: pointer;
  color: #0f78b8;
  text-decoration: none;
}

.nav-menu-body .menu-item .title a:hover {
  cursor: pointer;
  color: #0f6194;
  text-decoration: none;
}

.nav-menu-body ul {
  padding: 0px;
  padding: 12px 0;
  margin: 0;
  list-style-type: none;
}

.nav-menu-body li {
  font-weight: 400;
  font-family: "Lato", helvetica, arial, sans-serif;
  font-size: 14px;
  color: #4a4a4a;
  padding: 12px 30px;
  margin: 0;
  display: block;
  text-align: left;
  line-height: 155%;
  cursor: pointer;
}

.nav-menu-body li:hover {
  background-color: rgba(15, 120, 184, 0.05);
  cursor: pointer;
}

.nav-menu-body li a {
  font-weight: 600;
  color: #0d6ea9;
  text-decoration: none;
  font-size: 15px;
}

.accordion {
  width: inherit;
  height: 70px;
  margin: 0;
  background: transparent;
  overflow: hidden;
  text-align: left;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.accordion_single {
  height: auto;
  border: 0;
}

.accordion_single_break {
  height: auto;
  border: 0;
}

.accordion .accordion_tab {
  padding: 25px 15px 25px 30px;
  cursor: pointer;
  user-select: none;
  font-size: 15px;
  font-weight: 600;
  position: relative;
  color: #4a4a4a;
}

.accordion .accordion_tab:hover,
.accordion .accordion_tab:hover .caret-right {
  color: black;
}

.accordion .accordion_tab .accordion_arrow {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  right: 30px;
  width: 15px;
  height: 15px;
  transition: all 0.25s ease;
}

.accordion .accordion_tab.active .accordion_arrow {
  transform: translateY(-10%) rotate(90deg);
}

.accordion.active,
.accordion_single.active {
  height: auto;
}

.accordion .accordion_content .accordion_item,
.accordion_single_break .accordion_content .accordion_item_single {
  padding: 12px 30px;
  margin-bottom: 0px;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  display: block;
}

.accordion_content {
  margin-bottom: 12px;
}

.accordion_single .accordion_content,
.accordion_single_break .accordion_content {
  margin-bottom: 0;
}

.accordion_content a:hover {
  text-decoration: none;
}

.accordion .accordion_content .accordion_item:hover {
  background-color: rgba(15, 120, 184, 0.05);
  cursor: pointer;
}

.accordion .accordion_content:focus-within {
  background-color: rgba(15, 120, 184, 0.05);
}

.accordion_single_break:hover {
  background-color: rgba(15, 120, 184, 0.05);
  cursor: pointer;
}

.accordion .accordion_content .accordion_item p.item_title,
p.item_title a {
  color: #0d6ea9;
  font-weight: 700;
  font-size: 15px;
  text-decoration: none;
  text-align: left;
  margin-top: 0px;
  display: flex;
  align-items: center;
  margin-bottom: 3px;
}

.accordion .accordion_content .accordion_item p.item_title .logo {
  display: inline-block;
  width: 18px;
  height: auto;
  margin-right: 6px;
}

.goodies-new-star,
.goodies-free-badge {
  position: relative;
  top: -2px;
  display: inline;
  border: none;
  background-color: #fff079;
  padding: 3px 8px;
  color: #6a4401;
  border-radius: 5px;
  font-size: 8px;
  margin-left: 3px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

.goodies-new-star .fa-star {
  color: #ddbb3a;
}

.goodies-free-badge {
  background-color: #d1fae5;
  color: #065f46;
}

.goodies-free-badge .fa-rocket {
  color: #10b981;
}

.default-badge-border {
  background: white;
  border-radius: 5px;
  border: 1px solid;
  position: relative;
  top: -2px;
  display: inline;
  padding: 2px 6px;
  top: -2px;

  font-size: 8px;
  margin-left: 3px;
  font-weight: 700;
}

.default-badge-text {
  color: black;
  letter-spacing: 0.8px;
  font-size: 8px;
}

.ultimate-badge-border {
  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(to right, #0073c7, #17e3cb) border-box;
  border-radius: 5px;
  border: 1px solid transparent;
  position: relative;
  top: -2px;
  display: inline;
  padding: 2px 6px;
  top: -2px;

  font-size: 8px;
  margin-left: 3px;
  font-weight: 700;
}

.ultimate-badge-text {
  color: #0073c7;
  letter-spacing: 0.8px;
  font-size: 8px;
}

.ultimate-banner {
  display: block;
  width: 100%;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  padding: 18px;
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  margin: 30px 0;

  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(to right, #0073c7, #17e3cb) border-box;
  border-radius: 6px;
  border: 1px solid transparent;
  box-shadow: 0 4px 8px 0 #0000001a;
}

.accordion .accordion_content .accordion_item p:last-child {
  font-weight: 400;
  font-family: "Lato", helvetica, arial, sans-serif;
  font-size: 14px;
  color: #4a4a4a;
  margin: 0;
  display: block;
  text-align: left;
  line-height: 155%;
}

.accordion_single .accordion_content .accordion_item:last-child {
  margin-bottom: 0;
}

.accordion_item_single p.item_title {
  font-weight: 700;
  margin: 0;
}

/* Top Navigation - Cross Product Menu */
#menu-crossproduct {
  width: 400px;
}

#menu-mobileCrossproduct.nav-menu {
  width: 92vw;
  max-width: 384px;
}

.crossproduct-nav-menu .nav-menu::before {
  left: 73%;
}

#menu-mobileCrossproduct.nav-menu::before {
  left: 69.5625%;
}

.crossproduct-menu .nav-menu-body {
  padding: 20px 16px 8px 16px;
  border-radius: 12px;
  color: #111827;
}

.crossproduct-menu .nav-menu-body h3 {
  margin: 12px;
  font-size: 18px;
}

.crossproduct-menu .nav-menu-body hr {
  width: 100%;
  margin: 0;
}

#button-crossproduct.nav-href,
#button-mobileCrossproduct.nav-href {
  padding: 11px 4px;
}

.crossproduct-menu-icon-container {
  display: flex;
}

.crossproduct-menu-icon-bubble {
  width: 32px;
  height: 32px;
  border-radius: 32px;
  background-color: rgba(0, 0, 0, 0.25);
  display: flex;
  justify-content: center;
  align-items: center;
}

.crossproduct-menu-icon {
  width: 14px;
  fill: #ffffff;
}

.service-section {
  margin-bottom: 24px;
}

.service-list a {
  color: #6b7280;
}

.service-list a:hover {
  text-decoration: none;
}

.service-list-item {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 6px 0;
  padding: 12px 16px 12px 12px;
  border-radius: 6px;
}

.service-list-item:hover,
.service-list-item.selected {
  background-color: rgba(0, 0, 0, 0.05);
}

.service-list-item:hover {
  cursor: pointer;
  transition: 200ms;
}

.service-list-item .icon-box {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-right: 12px;
  border-radius: 6px;
  flex-shrink: 0;
}

.service-list-item.distrokid .icon-box {
  background-color: #0073c7;
}

.service-list-item.social-phone .icon-box {
  background-color: #10ba81;
}

.service-list-item.distrovid .icon-box {
  background-color: #8b5cf6;
}

.service-list-item.bandzoogle .icon-box {
  background-color: #ef672a;
}

.service-list-item.mixea .icon-box {
  background-color: #ec499a;
}

.service-list-item.slaps .icon-box {
  background-color: #4f46e5;
}

.service-list-item.instant-share .icon-box {
  background-color: #ea580c;
}

.service-list-item.dk-direct .icon-box {
  background-color: #000;
  color: #fff;
}

.service-list-item.dk-direct .service-icon {
  filter: brightness(0) invert(1);
}

.service-list-item img {
  filter: invert(100%);
}

.service-list-item.slaps img {
  filter: brightness(0) invert(1);
}

.service-list-item .service-icon {
  width: 19px;
  height: auto;
}

.service-list-item .service-info h4,
.service-list-item .service-info p {
  margin-top: 0;
  margin-bottom: 0;
}

.service-list-item .service-info h4 {
  color: #111827;
  font-size: 14px;
}

.service-list-item .service-info p {
  margin-top: 4px;
  color: #6b7280;
  font-size: 13px;
}

.crossproduct-menu .goodie-item-arrow {
  float: right;
  transition: all 0.25s ease;
}

.goodies-free-container {
  background-image: url(/images/header/faded-goodies-menu.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.goodies-free-overlay {
  height: 230px;
  padding-top: 68px;
  box-sizing: content-box;
  text-align: center;
}

.goodies-subscribe-link:hover {
  cursor: pointer;
  text-decoration: none;
  filter: saturate(2);
}

.goodies-free-subscribe {
  display: inline-block;
  background-color: #fffbeb;
  border: 1px solid #fef3c7;
  border-radius: 10px;
  padding: 20px 32px;
}

.goodies-free-subscribe .fa-lock {
  color: #f59e0b;
  font-size: 24px;
}

.goodies-free-subscribe p {
  color: #78350f;
  font-size: 16px;
  font-weight: bold;
  margin: 7px 0 0 0;
}

.goodie-section {
  margin: 0 6px;
}

.goodie-section:last-child {
  margin-bottom: 4px;
}

.goodie-section.active .goodie-item-arrow {
  transform: translateY(-10%) rotate(90deg);
}

.goodie-section-title {
  padding: 16px 8px;
  cursor: pointer;
  user-select: none;
  color: #4a4a4a;
  font-weight: 600;
}

.goodie-section-title:hover,
.goodie-section-title:hover .caret-right {
  color: black;
}

.goodie-section-content {
  max-height: 0px;
  overflow: hidden;
  transition: all 0.25s ease;
}

.goodie-section.active .goodie-section-content {
  max-height: 1000px;
}

.goodie-section-content a {
  display: block;
  padding: 10px 8px;
  border-radius: 8px;
  font-family: "Inter", "Lato", helvetica, arial, sans-serif;
  line-height: 20px;
  text-decoration: none;
}

.goodie-section-content a:hover {
  background-color: rgba(15, 120, 184, 0.05);
}

.goodie-section-content a div:first-child {
  display: flex;
  align-items: center;
  color: #0d6ea9;
  font-weight: 600;
}

.goodie-section-content a div:first-child .goodies-new-star,
.goodie-section-content a div:first-child .goodies-free-badge {
  line-height: 12px;
  top: 0;
  margin-left: 6px;
}

.goodie-section-content a div:last-child {
  color: #4a4a4a;
  font-size: 12px;
}

.goodie-section-content a:last-child {
  margin-bottom: 6px;
}

.goodie-section-content a .logo {
  width: 18px;
  height: auto;
  margin-right: 6px;
}

/* Top Navigation - Cross Product Menu END */

/* PAYMENT METHODS */

.payment-method-card {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 24px 18px;
  justify-content: space-between;
  align-items: center;
  background: #ffffff;
  border: 1px solid rgba(221, 221, 221, 0.2);
  box-shadow:
    0px 1px 2px rgba(0, 0, 0, 0.08),
    0px 4px 12px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  padding: 12px;
  margin-top: 24px;
  max-width: 620px;
  margin-left: auto;
  margin-right: auto;
}

.payment-info-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 30px;
  order: 2;
}

.payment-method-icons {
  width: 44px;
  order: 1;
}

.tag-wrapper {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  order: 4;
  width: 180px;
}

@media screen and (max-width: 535px) and (min-width: 480px) {
  .tag-wrapper {
    width: 115px;
  }
}

.payment-method-default-tag {
  max-width: 54px;
  font-size: 8pt;
  font-weight: 700;
  font-variant: small-caps;
  padding: 8px;
  background: #f3f4f6;
  border-radius: 3px;
  text-align: center;
}

.payment-method-error-tag {
  max-width: 54px;
  font-size: 8pt;
  font-weight: 700;
  font-variant: small-caps;
  padding: 8px;
  color: #ef4444;
  background: #feeded;
  border-radius: 3px;
}

.payment-ellipses {
  width: 18px;
  fill: rgba(34, 34, 34, 0.6);
}

.payment-method-number {
  font-weight: 400;
  font-size: 16px;
  order: 2;
}

.payment-method-exp {
  font-weight: 400;
  font-size: 16px;
  order: 3;
}

.payment-method-exp-gray {
  color: #9ca3af;
}

.payment-method-cardtype {
  font-weight: 400;
  font-size: 14px;
  width: 50px;
  order: 4;
  color: #9a3412;
}

.payment-wallet-container {
  margin: 20px auto 0px;
  max-width: 320px;
}

.loading-box-grey {
  content: "";
  height: 50px;
  padding: 0 1.333rem 0 1.333rem;
  border-radius: 4px;
  background: linear-gradient(to left, #e6e6e6 0%, #cdcdcd 50%, #e6e6e6 100%);
  background-size: 200% 200%;
  animation: loadingGradient 1s infinite;
}

/* Wallet Payment */
.payment-wallet {
  display: flex;
  justify-content: center;
  height: 50px;
  border-radius: 4px;
}

/* Wallet - Link Payment */
.link-button {
  position: relative !important;
  background: #33ddb3 !important;
}

.link-button--loading .button__text {
  visibility: hidden;
  opacity: 0;
}

.link-button--loading::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border: 4px solid #4a4a4a3b;
  border-top-color: black;
  border-radius: 50%;
  animation: button-loading-spinner 1s ease infinite;
}

/* Wallet - Google / Apple Pay */
.google-apple-button {
  position: relative !important;
  background: black !important;
}

.button-- {
  position: relative !important;
  background: rgb(45, 113, 193, 0.75) !important;
}

.button--loading .button__text {
  visibility: hidden;
  opacity: 0;
}

.button--loading::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border: 4px solid transparent;
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: button-loading-spinner 1s ease infinite;
}

@keyframes button-loading-spinner {
  from {
    transform: rotate(0turn);
  }

  to {
    transform: rotate(1turn);
  }
}

/* Setting the keyframe when the animation is 0% and 100% complete */
@keyframes loadingGradient {
  0% {
    background-position: 0% 50%; /* sets the  position for each background image */
  }
  100% {
    background-position: -200% 0%;
  }
}

.add-card-button {
  padding: 16px;
  border-radius: 6px;
  width: 320px;
  font-weight: bold;
  text-align: center;
  background: #2d71c1;
  color: #fff;
  border: none;
  font-size: 1rem;
  margin: 20px 18px;
  cursor: pointer;
}

.add-card-button:hover {
  background-color: #005b9e;
}

.icon-wrap {
  display: inline-block;
  transition: background-color 0.25s;
  height: 2em;
  width: 2em;
  padding-left: 4px;
  padding-right: 4px;
  border-radius: 4px;
}

.icon-wrap:hover {
  background-color: #f3f4f6;
  border-radius: 6px;
  cursor: pointer;
}

.icon-wrap.icon-wrap-clicked {
  background-color: #f3f4f6;
}

.ellipses {
  fill: #9ca3af;
}

.dropdown {
  display: inline-block;
  position: relative;
}
.dropdown-content {
  display: none;
  position: absolute;
  width: 160px;
  overflow: auto;
  border: 1px solid rgba(221, 221, 221, 0.5);
  box-shadow:
    0px 1px 2px rgb(0 0 0 / 8%),
    0px 4px 12px rgb(0 0 0 / 5%);
  z-index: 1000;
  background-color: rgb(255, 255, 255);
  border-radius: 6px;
  font-weight: 400;
  margin-top: 6px;
  left: -124px;
}
.dropdown:hover .dropdown-content {
  /*
	display: block;
	*/
}
.dropdown-content a {
  display: block;
  color: #4b5563;
  text-decoration: none;
  padding: 12px 18px;
}
.dropdown-content a:hover {
  /*color: #FFFFFF;*/
  background-color: #f3f4f6;
}

.dropdown-divider {
  margin: 0;
  border: solid 0.5px #e5e7eb;
}

/* PAYMENT METHODS END*/

/* ADJUSTMENTS PAGE START - Aaron was here ;P */

.back-button {
  display: flex;
  align-items: center;
  font-weight: 400;
  color: #4b5563;
  column-gap: 8px;
  background-color: white;
  border: none;
  margin-top: 32px;
  cursor: pointer;
  fill: #4b5563;
  padding-left: 16px;
}

.back-button:hover {
  text-decoration: underline;
}

.adjustment-wrapper {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  margin-top: 40px;
  color: #374151;
  padding: 0 16px;
}

.adjustment-row {
  display: flex;
  flex-direction: column;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  row-gap: 12px;
}

.adjustment-amount-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  font-weight: 700;
}

.adjustment-info {
  margin: 0;
  padding: 0;
}

.orig-transaction-date {
  color: #6b7280;
  width: 100%;
  margin: 0;
}

.adjustment-code {
  width: 100%;
  margin: 0;
}

.adjustment-hr {
  border: none;
  border-bottom: 1px solid #d1d5db;
}
/* ADJUSTMENTS PAGE END */

/* NEW LANDING PAGE START */

.wrapper-new {
  width: 100%;
}

.gray50 {
  color: #f9fafb;
}

.gray400 {
  color: #9ca3af;
}

.blue600-background {
  background-color: #0073c7;
  /* height: 680px; */
}

.blue900-background {
  background: #002c4d;
}

.header-row-new {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
  padding: 40px 20px;
  margin: auto;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.header-logo {
  max-width: 160px;
  height: auto;
}

.signinWrapper {
  display: flex;
  flex-direction: row;
  column-gap: 8px;
  align-items: center;
  justify-content: center;
  color: white;
  padding: 12px 16px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.15s linear;
}

.signinWrapper:hover {
  background-color: #005b9e;
}

.signinChevron {
  transform: rotate(-90deg);
  fill-opacity: 0.75;
}

.hero-content-wrapper {
  margin: auto;
  max-width: 1200px;
  padding: 120px 20px 100px;
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.content-wrapper {
  margin-top: 120px;
  display: flex;
  flex-direction: row;
  column-gap: 36px;
  justify-content: space-evenly;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 100px;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding: 0 20px 0 20px;
}

.content-wrapper-column {
  margin-top: 120px;
  display: flex;
  flex-direction: column;
  row-gap: 40px;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding: 0 24px 0 24px;
}

.__dk_mobile_landing .content-wrapper-column.got-money {
  margin-top: 120px;
}

.content-wrapper-faq {
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding-top: 72px;
  padding-bottom: 72px;
  max-width: 1120px;
  margin: 120px auto;
  margin-bottom: 0;
  flex-wrap: wrap;
  row-gap: 60px;
  column-gap: 60px;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.dk-love-content-row {
  max-width: 1200px;
  margin: 40px auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  column-gap: 40px;
  row-gap: 40px;
  flex-wrap: wrap;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.dk-love-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  row-gap: 24px;
  max-width: 320px;
  background: #f3f4f6;
  border-radius: 16px;
  padding: 24px;
}

.dk-love-img {
  width: 320px;
  height: 208px;
}

.hero-text-wrapper {
  max-width: 600px;
  display: flex;
  flex-direction: column;
  row-gap: 24px;
  padding-right: 15px;
  flex-shrink: 0;
}

.dk-heading-icon {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 12px;
}

.dk-gremlin-pair {
  max-width: 52px;
  height: auto;
}

.text-wrapper {
  max-width: 500px;
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  margin: 0;
}

.blob-mockup {
  max-width: 680px;
  width: 100%;
  height: auto;
}

.services-img {
  max-width: 550px;
  height: auto;
  width: 100%;
}

.h1-xl {
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  letter-spacing: -0.02em;
  margin: 0;
}

.h1-2xl {
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 60px;
  line-height: 48px;
  letter-spacing: -0.02em;
  margin: 0;
}

.h1-base {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 28px;
  line-height: 34px;
  margin: 0;
}

.h2-base {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 20px;
  line-height: 24px;
  margin: 0;
}

.h4-caption {
  margin: 0;
}

.p-caption {
  padding-top: 8px;
  font-weight: 400;
  margin: 0;
}

.h1-lg {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 33px;
  line-height: 1.4;
  margin: 0;
  letter-spacing: -0.02em;
}

.p-text-xl {
  font-family: "Lato";
  font-style: normal;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.4;
  margin: 0;
}

.lpfaq-question {
  font-weight: 700;
}

.p-text-lg {
  font-family: "Lato";
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  margin: 0;
}

.feature-teaser-wrapper {
  display: flex;
  flex-direction: row;
  column-gap: 40px;
  flex-wrap: wrap;
  row-gap: 40px;
  justify-content: center;
  padding: 0 24px 0 24px;
}

.feature-teaser {
  display: flex;
  flex-direction: row;
  column-gap: 24px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 24px;
  padding-right: 24px;
  max-width: 240px;
  align-items: center;
}

.hyperfollow-icon {
  width: 24px;
  height: auto;
}

.playlist-spotlight-icon {
  width: 32px;
  height: auto;
}

.promoCards-icon {
  width: 32px;
  height: auto;
}

.vizy-icon {
  width: 36px;
  height: auto;
}

.faq-section {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  row-gap: 20px;
  max-width: 520px;
  width: 100%;
}

.testimonial-section {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
  max-width: 520px;
}

.testimonial-hr {
  border: none;
  border-bottom: 1px solid;
  opacity: 0.5;
  margin-top: 20px;
}

.testimonial {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

.dk-love-title {
  display: flex;
  flex-direction: row;
  column-gap: 16px;
  align-items: center;
  margin-bottom: 20px;
}

.get-started {
  margin: auto;
  margin-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  border-radius: 6px;
  font-size: 16px;
  padding: 12px 16px;
  font-family: "Lato", sans-serif;
  max-width: 320px;
  width: 100%;
  font-weight: 400;
  cursor: pointer;
  transition: all 0.15s linear;
  background: #0073c7;
}

.get-started:hover {
  background: #005b9e;
}

/* Style the buttons that are used to open and close the accordion panel */
.landingPageAccordion {
  cursor: pointer;
  padding: 0;
  padding-top: 16px;
  width: 520px;
  height: auto;
  text-align: left;
  border: none;
  outline: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  column-gap: 2px;
}

.landingPageAccordion-chevron {
  transform: rotate(180deg);
  -moz-transition: all 2s linear;
  -webkit-transition: all 2s linear;
  transition: all 0.15s linear;
  min-width: 7px;
}

.landingPageAccordion-chevron.down {
  -ms-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}

/* Style the accordion panel. Note: hidden by default */

.landingPageAccordion .panel {
  transition-duration: 0.5s;
  transition-property: all ease-in-out;
}
.accordion-wrapper .panel {
  display: none;
  overflow: hidden;
  padding-top: 12px;
}

#footerLine-new {
  margin-top: 180px;
  width: 100%;
  border-top: 1px solid #e5e7eb;
}

.footer-new {
  display: flex;
  flex-direction: column;
  max-width: 1200px;
  padding: 60px 24px 0 24px;
  margin: auto;
  row-gap: 40px;
}

.footer-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.footer-column-row {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  column-gap: 80px;
}

.footer-socials {
  display: flex;
  flex-direction: row;
  column-gap: 12px;
}

.footer-socials .fa-brands {
  color: #4b5563;
  font-size: 24px;
}

.footer-new-icons {
  width: 24px;
  height: 24px;
}

.footer-copyright {
  font-size: 16px;
  color: #4b5563;
  font-weight: 400;
  text-align: right;
}

.footer-column {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  align-self: flex-start;
}

.footer-h4 {
  margin: 0;
}

.footer-new-link {
  font-weight: 400;
  color: #4b5563;
}

.footer-new-link:hover {
  color: #4b5563;
}

.footer-new-link:visited {
  color: #4b5563;
}

.footer-legal-fun {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  column-gap: 24px;
}

.siteTran-wrapper {
  margin-left: auto;
}

.footer-new .siteTran-wrapper {
  margin-top: 12px;
}

@media screen and (max-width: 820px) {
  .blue600-background {
    margin-bottom: 540px;
  }

  .header-row-new {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    padding: 40px 80px;
  }

  .hero-content-wrapper {
    margin: auto;
    margin-bottom: 380px;
    max-width: 1200px;
    padding: 80px;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    row-gap: 100px;
    height: 700px;
  }

  .homePageSignupBox {
    max-width: 100%;
    padding: 24px;
    box-sizing: border-box;
    box-shadow:
      0px 1px 2px rgba(0, 0, 0, 0.08),
      0px 4px 12px rgba(0, 0, 0, 0.05);
    border-radius: 6px;
    background: #ffffff;
    border: 1px solid rgba(221, 221, 221, 0.2);
    align-self: center;
  }

  .text-wrapper {
    order: 1;
  }

  .blob-mockup {
    order: 2;
  }

  .services-img {
    order: 2;
  }
}

/* Media Queries */

/* Base styles - hide mobile nav by default on desktop */
.showMobileNav {
  display: none;
}

@media screen and (max-width: 1224px) {
  .showNav {
    display: block;
  }
  .showMobileNav {
    display: none;
  }

  .mobileOnlyMarginBottom5 {
    margin-bottom: 5px;
  }

  .mobileOnlyPadding {
    padding: 0px 10px 0px 10px;
    box-sizing: border-box;
  }

  .ccTable {
    width: 85%;
  }

  .clipartDiv {
    right: -100px;
  }
}

@media screen and (max-width: 768px) {
  .showNav {
    display: block;
  }
  .showMobileNav {
    display: none;
  }

  .nav-href {
    padding: 18px 6px;
  }

  #skipTo {
    display: block;
  }

  .greenAdvanceDot {
    width: 0.65em;
  }

  /*.navLink
	{
	font-size: 10px;
	padding: 15px 10px 15px 10px;
	}*/

  .tableFlex {
    display: block;
  }

  .tableFlex > div:nth-of-type(1) {
    margin-bottom: 1em;
  }

  .mobileClear {
    display: block;
    clear: both;
  }

  .mobileFloatLeftDesktopFloatRight {
    float: left;
  }

  .mobileNoMargin {
    margin: 0px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
  .mobileNoBorder {
    border: none !important;
    border-top: none !important;
    border-left: none !important;
    border-bottom: none !important;
    border-right: none !important;
  }

  .mobileHideTablet {
    display: none !important;
  }

  .hyperfollowUnfollowButton {
    margin-right: 0px;
    margin-left: 10px;
  }

  .myEmailAddress {
    width: 100%;
    min-width: 0px;
  }

  .saveEmailButton {
    width: 100%;
  }

  .emailMeTd {
    width: 80%;
  }

  .mobileNoPadding {
    padding: 0px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }

  .tabletDisplayBlock {
    display: block !important;
  }

  .tabletMarginTop4em {
    margin-top: 4em !important;
  }

  .tabletMarginTop52px {
    margin-top: 52px !important;
  }

  .tabletCenter {
    text-align: center !important;
  }

  .tabletWidth100 {
    width: 100% !important;
    max-width: none !important;
  }

  .tabletBreak {
    display: block;
  }

  .playHeaderWords {
    background: #333333;
    color: white;
    border: none;
  }

  .storeLinksContainer {
    box-shadow: 0 -19px 19px 14px black;
    background: none;
    margin-top: 0px;
    border: none;
  }

  .playHeaderContainer {
    margin-top: 0px;
  }

  .hyperfollowRegisterHelp {
    clear: both;
    line-height: inherit;
    font-size: 8pt;
    margin: -3px 0px 10px 0px;
  }

  .hyperfollowMoreFromContainer {
    border-top: none;
    margin-top: 0px;
    border: none;
    background: rgba(0, 0, 0, 0.1);
  }

  .hyperfollowListenNow {
    margin-top: 0px;
  }

  .hyperfollowArtistName {
    /* used in hyperfollow */
    padding: 1.5em 1em 1em 1em;
  }

  .hyperfollowAlbumArt {
    border: none;
    border-radius: 0px;
  }

  .hyperfollowPrivateMessage {
    position: absolute;
    top: 1em;
    right: 1em;
    margin-top: 5px;
  }

  .mobileShowTablet {
    display: block;
  }

  .mobileShowTabletInline {
    display: inline-block;
  }

  .mobileNoShadow {
    box-shadow: none !important;
    text-shadow: none !important;
  }

  .emailMailingList {
    border-radius: 0px !important;
  }

  .hyperfollowMailingListContainer {
    margin-top: 2.1em;
    border-radius: 0px;
  }

  .fuilWidthTablet {
    width: 100% !important;
    max-width: none !important;
    padding: 0px !important;
    margin: 0px !important;
  }

  .mySongTitlesLeft {
    display: block;
    vertical-align: bottom;
    width: 100%;
    white-space: normal;
  }

  .twitterLoveHeader {
    margin: 1rem;
    font-size: 14px;
  }

  .mobileHideInlineTablet {
    display: none;
  }

  .twoFactorContainer {
    width: 100%;
    margin-top: 0px;
    border-radius: 0px;
    box-shadow: none;
  }

  .twoFactorImage {
    width: 100%;
  }

  .viewEditTeam {
    float: none;
    margin-bottom: 1em;
  }

  .mobile100 {
    width: 100%;
  }

  .mobile100autoHeight {
    width: 100% !important;
    height: auto !important;
  }

  .mobileCenter {
    text-align: center;
  }

  .videoEmbediFrame {
    width: 100%;
    height: 225px;
  }

  .desktopOnlyLeftMargin4 {
    margin-left: 0px !important;
  }

  .chartHalfPageWidth {
    width: 100%;
    border: 2px solid white;
    box-sizing: border-box;
  }

  .pageAdminBlurb {
    width: 100%;
    max-width: none;
  }

  .pageSongs {
    max-height: 65px;
    overflow-y: scroll;
    overflow-x: hidden;
  }

  .pageSeparator {
    width: 200px;
  }

  .pageMetadata {
    float: left;
    margin-left: 10px;
  }

  .mobileWidth100 {
    width: 100%;
  }

  .pageContainer {
    padding: 10px 10px 0px 10px;
    min-height: 600px;
    width: 100%;
    min-width: 0px;
  }

  .artworkInPage {
    width: 230px;
    min-width: 0px;
    height: auto;
  }

  .floatRightUnlessMobile {
    margin-bottom: 1em;
    float: none;
  }

  .mobileWidth80 {
    width: 80% !important;
  }

  .mobileWidth40 {
    width: 40% !important;
  }

  .tableCellLeft {
    width: auto;
  }

  .ccTable {
    width: 100%;
  }

  .clipartDiv {
    display: none;
  }

  .mobileMarginTop5 {
    margin-top: 5px !important;
  }

  .width100exceptMobile {
    width: auto;
  }

  .mobileNewLine {
    float: none;
  }

  .hideMobile {
    display: none;
  }

  .planTitle {
    margin: 0px 0px 0px 0px;
    display: flex;
    align-items: top;
  }

  .planTitleWord {
    font-size: 20pt;
    font-weight: bold;
  }

  .planImageContainer {
    width: 67px;
    display: flex;
    justify-content: center;
    margin: 0px 8px 30px 0px;
  }

  .planWords {
    text-align: left;
    margin-left: 8px;
  }

  .planTruck {
    margin-left: -66px;
  }

  .planQuotes {
    text-align: left;
    padding: 20px;
    box-sizing: border-box;
  }

  .planQuoteCredit {
    color: #666666;
  }

  .pressHypebot {
    margin-top: 0px;
    width: 75%;
    height: 75%;
    margin-top: -5px;
  }

  .mobileOnlyLineBreak {
    height: 1em;
  }

  .paddingMobile {
    padding: 15px;
  }

  .signOut {
    background: url(/images/logout-white.png);
  }

  .UPC {
    float: none;
    text-align: right;
    margin-bottom: 10px;
  }

  .magnify {
    display: none !important;
  }

  .mobileFullBleed {
    /* margin:0px -15px 0px -15px; */
  }

  .nav {
    color: #ffffff;
    width: 100%;
    margin-bottom: 0px;
    vertical-align: middle;
  }

  .logoDesktop {
    display: none;
  }

  .logoMobile {
    display: inline;
  }

  .formContainer {
    width: 100%;
    min-width: inherit;
  }

  .bannerContainer {
    margin: 0px;
  }

  .planTopImage {
    margin-top: -120px;
  }

  .signinForgotPassword {
  }

  .signinForgotPasswordLink {
    color: #0071c7 !important;
  }

  .signinBoxContainer {
  }

  .navInnerInner {
    width: 100%;
  }

  .navInnerNotLoggedIn {
    /* float:right;
	width:200px; */
  }

  .planContainer {
    margin: 30px 0px 0px 0px;
    text-align: center;
  }

  .planDesc {
    margin: 0px 0px 10px 0px;
    width: auto;
  }
  .planButton {
    margin: 0px 0px 20px 0px;
    width: 90% !important;
    border-radius: 100px !important;
  }

  .planBox {
    float: left;
    text-align: center;
    width: 100%;
    margin: 0px auto;
    padding: 30px 10px 10px 10px;
  }

  .upgradeWindow {
    margin-top: 0px;
    margin-bottom: 10px;
  }

  .planBoxEmpty {
    float: left;
    text-align: center;
    width: 100%;
    margin: 0px auto;
  }

  body {
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
  }
  /*.nav a
	{
	color:#FFFFFF;
	}*/
  .nav {
    color: #ffffff;
    width: 100%;
    margin-bottom: 0px;
  }

  .uploadDaysLeftBadge /* should be "upgrade" doh */ {
    position: relative;
    display: inline;
    background: #5cb85c;
    padding: 2px;
    border-radius: 25%;
    font-size: 7pt;
  }

  .navInner {
  }

  header,
  #main,
  .mainSection {
    float: left;
    clear: left;
    margin: 0 0 10px;
    width: 60%;
  }
  aside {
    float: right;
    margin: 0 0 10px;
    width: 100%;
  }
  #main,
  .mainSection {
    /* margin:0px; */
    /* DC-16738 width:100%; */
  }

  .wrapper {
    /* DC-16738
	width:100%;
	margin:0px;
	*/
    padding: 0px;
    min-height: inherit;
  }
  header li {
    margin: 0;
    display: block;
    margin-bottom: 3px;
  }
  .heading {
    text-transform: uppercase;
    margin-top: 0em;
    font-weight: bold;
  }
  .everythingButNav {
    margin: 15px;
  }

  .everythingButNavNoTopMargin {
    /* margin:15px; */
  }

  header a {
    display: block;
    padding: 0px;
    text-align: center;
  }

  .desktopLinebreak {
    height: 1em;
  }

  body .dk__ .link-to-top {
    margin-top: 200px;
    margin-bottom: -140px;
    font-size: 22px;
    display: block;
    text-align: center;
    font-weight: 300;
  }

  .dk__ .link-to-top a {
    color: #828282;
    text-decoration: none;
  }

  .dk__ .link-to-top a .arrow-top {
    height: 14px;
  }
}
/* // @media screen and (max-width: 768px) */

@media screen and (max-width: 600px) {
  .showNav {
    display: none;
  }

  .showMobileNav {
    display: block;
  }

  .rightNavMarginMobile {
    font-size: 8px;
    margin-right: 11px;
  }
}
/* // @media screen and (max-width: 600px) */

@media screen and (min-width: 480px) {
  .inboxLeft {
    display: block !important;
  }
}
/* // @media screen and (min-width: 480px) */

@media screen and (max-width: 820px) {
  .showNav {
    display: none;
  }

  .distrovid-nav-wrapper #menu-crossproduct {
    width: 92vw;
  }

  .goodies-free-overlay {
    height: 210px;
    padding-top: 60px;
  }

  .goodies-free-subscribe {
    padding: 16px 28px;
  }

  .showMobileNav {
    display: block;
  }
}
/* // @media screen and (max-width: 650px) */

@media screen and (max-width: 480px) {
  .sm-block {
    display: block;
  }

  .payment-wallet-container {
    max-width: 100%;
    margin: 0px 18px 20px;
  }

  .blue600-background {
    margin-bottom: 180px;
  }

  .hero-content-wrapper {
    height: 700px;
  }

  .showNav {
    display: none;
  }

  .distrovid-nav-wrapper .showNav {
    display: block;
  }

  .showMobileNav {
    display: block;
  }

  .mobileFlexColumn {
    flex-direction: column;
  }

  .webviewFullWidthMobileButton {
    width: 100% !important;
    border-radius: 4px;
    padding: 12px 18px 12px 18px;
    text-transform: none;
  }

  .hurryAndUpgrade {
    text-align: left;
  }

  .innerLoginForm {
    max-width: 90%;
  }

  .planDesc {
    text-align: left;
    margin-left: 76px; /* to align with other stuff */
  }

  .planBoxContainer {
    width: 100%;
    padding: 0px 20px 0px 20px;
    box-sizing: border-box;
  }

  .planBox {
    box-shadow:
      0 0px 100px -35px rgb(50 50 93 / 25%),
      0 0px 80px -40px rgb(0 0 0 / 30%);
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #dcdcdc;
    margin-bottom: 20px;
  }

  .homeFormInputContainerStandalone,
  .regFormContainerStandalone .homeFormInputContainer {
    border-top: none;
    border-left: none;
    border-right: none;
    padding-left: 0px;
    margin-bottom: 20px;
  }

  .homeFormInputStandalone,
  .regFormContainerStandalone .homeFormInput {
    font-size: 12pt;
    height: auto;
    line-height: 2em;
  }

  .signinForgotContainer {
    margin-top: -19px;
    margin-bottom: 17px;
  }

  #signInButtonStandalonePage,
  .regFormContainerStandalone #registerButton {
    border-radius: 6px;
  }

  .hoorayCoupon {
    width: 100%;
  }

  #skipTo {
    display: block;
  }

  .mobileBreak,
  .mobileBr {
    display: block;
  }

  .unreadMessageCount {
  }

  .homePageSignupBox {
    padding: 18px;
    box-shadow:
      0px 1px 2px rgba(0, 0, 0, 0.08),
      0px 4px 12px rgba(0, 0, 0, 0.05);
    margin-top: 20px;
    background: inherit;
    margin-bottom: 20px;
  }

  .totalEarningsHeader {
    display: block;
  }

  #bankDateSelector {
    margin-top: 10px !important;
  }

  .greenAdvanceDot {
    width: 0.55em;
  }

  .newUsernameInput {
    max-width: 180px;
    min-width: 0px;
    width: auto;
  }

  .buttonPink {
    width: 100%;
  }

  .fileKidTermsSlogan {
    font-size: 12pt;
  }

  .fileKidTermsHeadline {
    font-size: 26px;
    line-height: 1.2em;
  }

  .messageToHeaderEllipsisMenuItem {
    font-size: 13px;
  }

  .messagingHeader {
    font-size: 13px;
  }

  .navLink {
    /*font-size: 6pt;*/
    padding: 15px 7px 15px 7px;
    /* padding: 0px 5px 0px 5px; */
  }

  .navLinkBigger {
    font-size: 10px;
  }

  .navEnvelope {
    font-size: 8pt;
  }

  .moreMenuContainerContainer {
    position: inherit;
  }

  .moreMenuContainer {
    width: 100%;
    border-radius: 0px 0px 0px 0px;
  }

  .navDropdown {
    width: 100% !important;
    left: 0px !important;
  }

  .mobileBlock {
    display: block !important;
  }

  .mobileBorderTopExceptFirst:not(:first-child) {
    border-top: 1px solid #cccccc;
  }

  .mobileBreak480 {
    display: block;
  }

  .hyperfollowArtistHeader {
    border-radius: 0px;
    background: #ffffff;
    color: #333333;
  }

  .inboxLeft {
    display: none;
    width: 80%;
    box-shadow: 5px 7px 9px rgba(0, 0, 0, 0.12);
    position: absolute;
    top: 0px;
    height: 100% !important;
    background: #ffffff;
    border-right: 1px solid rgba(0, 0, 0, 0.12);
  }

  .inboxRight {
    float: none;
    width: 100%;
  }

  .myISRC {
    font-size: 10pt;
  }

  .myCreditsLeft {
    float: none;
    font-weight: bold;
  }

  .desktopBr {
    display: inline;
  }

  .mobileShow {
    display: block;
  }

  .vaultTitle {
    width: auto;
    max-width: 150px;
    box-sizing: border-box;
  }

  .searchVaultInputBox {
    width: 100%;
    min-width: 0px;
    max-width: 125px;
  }

  .teamsHeadline {
    font-size: 30pt;
    margin: 30px 0px 0px 0px;
  }

  .mobileWidth100Small {
    width: 100%;
  }

  .mobileHide {
    display: none;
  }

  .mobileHideTable {
    display: none;
  }

  .mobileShowBlock {
    display: block;
  }

  .mobileHideInline {
    display: none;
  }

  .mobileShowInline {
    display: inline;
  }

  .pageJoinButton {
    width: 100%;
  }

  .coolInputMailingList {
    width: 100%;
  }

  .selectMailingListDiv {
    width: 100%;
  }

  .coolSelectMailingList {
    width: 100%;
  }

  .videoEmbediFrame {
    width: 100%;
    height: 168px;
  }

  .pageBandnameBox {
    padding: 35px 0px 35px 0px;
  }

  .pageNewsletterBox {
    width: 100%;
    border-left: none;
    border-right: none;
    margin: 0px 0px 0px 0px;
  }

  .pagePadding {
    padding: 0px 0px 0px 0px;
  }

  .littleStoreIcons {
    height: 10px;
    width: 10px;
  }

  .albumRow {
    width: 100%;
    float: none !important;
  }

  .mobileTopAlign {
    vertical-align: top;
  }

  .mobileTopMargin {
    margin-top: 1em;
  }

  .facebookEmbedded {
    margin-top: 20px;
  }

  .mobileTopMarginSmall {
    margin-top: 2px;
  }

  .pageAdminBlurb {
    font-size: 9pt;
  }

  .pageFooter {
    font-size: 9pt;
    padding: 8px 8px 8px 8px;
  }

  .hideMobile480 {
    display: none;
  }

  .pageMailingListBlock {
    margin: 15px 0px 15px 0px;
  }

  .mobileWidth90 {
    width: 94% !important;
  }

  .pageSongs {
    max-height: none;
    overflow-x: auto;
    overflow-y: auto;
  }

  .mobileLineBreak {
    display: block;
  }

  .mobileLineBreakWithTopMargin {
    margin-top: 5px;
    display: block;
  }

  .pageBottomSection {
    position: relative;
    margin: 20px 0px 0px 0px;
  }

  .pageSeparator {
    width: 100%;
  }

  .pageStores {
    margin: 1em 0px 0px 0px;
  }

  .pageStoreButtonContainer {
    max-width: none;
  }
  .pageMetadata {
    float: none;
    margin-left: 0px;
    width: 100%;
    max-width: none;
  }

  .pageAlbumTitle {
    margin: 15px 0px 0px 0px;
    clear: both;
  }

  .pageArtContainer {
    float: none;
  }

  .pageBandname {
    font-size: 24px;
    margin: 10px 0px 0px 0px;
  }

  .pageContainer {
    padding: 10px 0px 0px 0px;
    min-height: 600px;
    text-align: center;
  }

  .artworkInPage {
    width: 100%;
    height: auto;
    border: none;
  }

  .coolInputSmallMobileShrink {
    min-width: 80px !important;
    width: 80px !important;
  }

  .coolInputMobileShrink {
    min-width: 140px !important;
  }

  .planNav {
    float: none !important;
  }

  .mobileNegativeTopMarginThing {
    margin-top: -120px !important;
  }

  .mobileTopMarginCreditCard {
    margin-top: 40px;
  }

  aside {
    margin: 50px 0px 0px 0px;
  }

  .bigFrontHeader {
    padding: 40px 0px 93px 0px;
  }

  .logoFrontPage {
    width: 133px;
    height: 40px;
    margin-top: 37px;
  }

  .sloganBig {
    font-size: 37px;
    display: inline-block;
    margin-left: -2px;
  }

  .navInnerInner {
    margin-top: 0em;
  }

  .navInnerNotLoggedIn {
    /* float:right;
	width:200px; */
  }

  .mobileTopMarginCreditCard {
    clear: both;
    margin-top: 42px;
  }

  .hideMobile {
    display: none;
  }

  a:hover {
    text-decoration: none;
  }

  .statusLightContainer {
    margin: 25px 8px 0px 0px;
  }

  .albumCoverIcon {
    float: left;
    margin-right: 5px;
    height: 62px;
    width: 62px;
  }

  .storeRow {
    float: none;
    margin: 2px 0px 0px 0px;
    min-width: 70px;
  }

  body {
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
  }

  .navInner {
  }
  header,
  #main,
  .mainSection,
  aside {
    float: left;
    clear: left;
    margin: 0 0 10px;
    width: 100%;
  }
  #main,
  .mainSection {
    /* margin:0px; */
    width: 100%;
  }

  /* DC-16738
.wrapper
	{
	width:100%;
	margin:0px;
	padding:0px;
	min-height: inherit;
	}
*/
  header li {
    margin: 0;
    display: block;
    margin-bottom: 3px;
  }

  .heading {
    text-transform: uppercase;
    margin-top: 0em;
    font-weight: bold;
  }

  .everythingButNav {
    margin: 15px 15px 0px 15px;
  }

  header a {
    display: block;
    padding: 0px;
    text-align: center;
  }

  .desktopLinebreak {
    height: 1em;
  }
  /* PAYMENT METHODS MOBILE*/

  .payment-method-card {
    display: flex;
    flex-wrap: wrap;
    gap: 24px 18px;
    justify-content: space-between;
    background: #ffffff;
    border: 1px solid rgba(221, 221, 221, 0.2);
    box-shadow:
      0px 1px 2px rgba(0, 0, 0, 0.08),
      0px 4px 12px rgba(0, 0, 0, 0.05);
    border-radius: 6px;
    padding: 24px 18px;
    margin: 24px 18px;
  }

  .payment-method-icons {
    width: 43px;
  }

  .tag-wrapper {
    display: flex;
    gap: 12px;
    order: 2;
  }

  .payment-method-default-tag {
    max-width: 54px;
    font-size: 8pt;
    font-weight: 700;
    font-variant: small-caps;
    padding: 8px;
    background: rgba(74, 74, 74, 0.1);
    border-radius: 3px;
    text-align: center;
  }

  .payment-method-error-tag {
    max-width: 54px;
    font-size: 8pt;
    font-weight: 700;
    font-variant: small-caps;
    padding: 8px;
    color: #ef4444;
    background: #feeded;
    border-radius: 3px;
  }

  .payment-method-number {
    font-weight: 400;
    font-size: 14pt;
    order: 3;
  }

  .payment-method-exp {
    font-weight: 400;
    font-size: 14pt;
    order: 4;
  }

  .payment-method-exp-gray {
    color: rgba(34, 34, 34, 0.3);
  }

  .payment-method-cardtype {
    font-weight: 400;
    font-size: 14px;
    width: 50px;
    order: 3;
  }

  .payment-method-cardtype-red {
    color: red;
  }

  .ellipses {
    align-self: center;
    padding: 0;
    margin: 0;
    position: relative;
  }

  .ellipses-drop {
    border: none;
    background-color: white;
    cursor: pointer;
    margin: 0;
    padding: 0;
  }

  .payment-ellipses-content {
    display: none;
  }

  .ellipses-show-content {
    display: block;
    position: absolute;
    border: 1px solid rgba(221, 221, 221, 0.1);
    background-color: #fff;
    min-width: 160px;
    overflow: auto;
    box-shadow:
      0px 1px 2px rgba(0, 0, 0, 0.08),
      0px 4px 12px rgba(0, 0, 0, 0.05);
    border-radius: 6px;
    z-index: 1;
  }

  .ellipses-select {
    list-style: none;
    padding: 18px;
    margin: 0;
    font-weight: 400;
  }

  .add-card-button {
    padding: 16px;
    border-radius: 6px;
    width: 100%;
    font-weight: bold;
    text-align: center;
    background: #2d71c1;
    color: #fff;
    border: none;
    font-size: 1rem;
    margin: 0px 18px;
  }

  .btn-primary {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 16px;
    background-color: #0073c7;
    border-radius: 6px;
    border: none;
  }

  /* PAYMENT METHODS MOBILE END*/

  .social-sign-in-container-text {
    flex-direction: column;
    row-gap: 16px;
  }

  .social-firstLast {
    display: none;
  }

  .social-tr {
    display: flex;
    flex-direction: row;
  }

  .social-longEmail {
    text-align: start;
    width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .sign-in-icon-button-text {
    margin-left: 12px;
    margin-right: 12px;
  }

  .social-info {
    justify-content: flex-start;
  }

  .account-actions {
    justify-content: space-between;
  }

  .sign-in-icon-button-text {
    margin-left: 12px;
    margin-right: 12px;
  }
  /* NEW LANDING PAGE MOBILE START */

  .header-row-new {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    padding: 20px;
    margin: auto;
  }

  .header-logo {
    max-width: 120px;
  }

  .hero-content-wrapper {
    display: flex;
    flex-direction: column;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 40px;
    row-gap: 40px;
    /*height: 400px;*/
    margin-bottom: 300px;
  }

  .h1-xl {
    font-family: "Inter", sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 40px;
    letter-spacing: -0.02em;
    margin: 0;
  }

  .h1-2xl {
    font-family: "Inter", sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 36px;
    line-height: 48px;
    letter-spacing: -0.02em;
    margin: 0;
  }

  .dk-heading-icon {
    display: flex;
    flex-direction: row;
    align-items: center;
    column-gap: 8px;
  }

  .dk-gremlin-pair {
    max-width: 36px;
    height: auto;
  }

  .h1-lg {
    font-size: 24px;
  }

  .p-text-xl {
    font-family: "Lato";
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    margin: 0;
  }

  .content-wrapper {
    display: flex;
    flex-direction: column;
    margin-top: 60px;
    padding-left: 20px;
    padding-right: 20px;
    row-gap: 60px;
    justify-content: center;
  }

  .text-wrapper {
    order: 1;
  }

  .blob-mockup {
    max-width: 100%;
    height: auto;
    order: 2;
  }

  .services-img {
    order: 2;
    max-width: 100%;
    height: auto;
  }

  .content-wrapper-column {
    margin-top: 60px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .feature-teaser-wrapper {
    display: flex;
    flex-direction: column;
    max-width: 100%;
    row-gap: 24px;
  }

  .get-started {
    margin: auto;
    margin-top: 40px;
  }

  .content-wrapper-faq {
    display: flex;
    flex-direction: column;
    row-gap: 80px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .landingPageAccordion {
    padding: 0;
    padding-top: 16px;
    max-width: 100%;
    height: auto;
    border: none;
    outline: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
    column-gap: 4px;
  }

  .dk-love-content-row {
    display: flex;
    flex-direction: column;
    row-gap: 36px;
    padding-left: 20px;
    padding-right: 20px;
    align-content: center;
  }

  .dk-love-img {
    width: 100%;
    height: auto;
  }

  .feature-teaser {
    max-width: 100%;
  }

  .footer-legal-fun {
    display: flex;
    flex-direction: column;
    row-gap: 12px;
  }

  .footer-column-row {
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    row-gap: 40px;
  }

  .footer-column {
    display: flex;
    flex-direction: column;
    row-gap: 12px;
    align-self: flex-start;
    order: 2;
  }

  .siteTran-wrapper {
    margin: 0;
  }

  .lpfaq-question {
    font-weight: 700;
  }

  .prepaid-exp-banner-mobile {
    margin: 20px !important;
    align-items: flex-start !important;
  }
}

@media screen and (max-height: 600px) {
  .termsHeadline {
    font-size: 14pt;
  }
  .termsHeadlineArea {
    margin-top: 0em;
  }
}

@media screen and (max-height: 450px) {
  .termsHeadlineArea {
    margin-top: 0em;
  }
}

/* +++ Start Stats Charts */
/* TODO DC-28613 we can remove the "Stats Charts" section after merging the experiment */
.lessPadding {
  padding: 3px;
}

.chartStyle {
  width: 100%;
  height: 290px;
  overflow: hidden;
  text-align: center;
  vertical-align: middle;
  background-color: #f6f6f6;
}

.loadingText {
  line-height: 290px;
}

[class*="col-"] {
  width: 100%;
  float: left;
  box-sizing: border-box;
  padding: 1px;
}

@media only screen and (min-width: 768px) {
  .col-1 {
    width: 8.33%;
  }
  .col-2 {
    width: 16.66%;
  }
  .col-3 {
    width: 25%;
  }
  .col-4 {
    width: 33.33%;
  }
  .col-5 {
    width: 41.66%;
  }
  .col-6 {
    width: 50%;
  }
  .col-7 {
    width: 58.33%;
  }
  .col-8 {
    width: 66.66%;
  }
  .col-9 {
    width: 75%;
  }
  .col-10 {
    width: 83.33%;
  }
  .col-11 {
    width: 91.66%;
  }
  .col-12 {
    width: 100%;
  }
}
/* --- End Stats Charts */

/* Table valign */
.vtop-header {
  vertical-align: top;
  color: #4f6685;
}
.vtop {
  vertical-align: top;
}

/* Feature Table */
table.feature-table {
  font-size: 20px;
  line-height: 1.4em;
}
td.vtop-header i.fa {
  margin-right: 4px;
}

/* Utils */

.absolute {
  position: absolute;
}
.relative {
  position: relative;
}

.clearBoth {
  clear: both;
}

.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.text-transform-none {
  text-transform: none;
}

.hidden {
  display: none;
}

.w-100 {
  width: 100%;
}
.w-content {
  width: max-content;
}

/* striped rows */
.r0 td {
  background-color: #f8f8f8;
}
.r1 td {
  background-color: #f0f0f0;
}

/* Margins */
.m-1 {
  margin: 0.25rem;
}
.m-2 {
  margin: 0.5rem;
}
.m-3 {
  margin: 1rem;
}
.m-4 {
  margin: 2rem;
}

.mx-1 {
  margin-inline: 0.25rem;
}
.mx-2 {
  margin-inline: 0.5rem;
}
.mx-3 {
  margin-inline: 1rem;
}
.mx-4 {
  margin-inline: 2rem;
}

.my-1 {
  margin-block: 0.25rem;
}
.my-2 {
  margin-block: 0.5rem;
}
.my-3 {
  margin-block: 1rem;
}
.my-4 {
  margin-block: 2rem;
}

.mt-3 {
  margin-top: 3px;
}
.mt-6 {
  margin-top: 6px;
}
.mt-12 {
  margin-top: 12px;
}
.mt-20 {
  margin-top: 20px;
}
.mt-30 {
  margin-top: 30px;
}
.mt-50 {
  margin-top: 50px;
}

.mt-4 {
  margin-top: 1rem;
}

.mb-2 {
  margin-bottom: 1rem;
}
.mb-3 {
  margin-bottom: 1.5rem;
}
.mb-4 {
  margin-bottom: 2rem;
}

.mt-2em {
  margin-top: 2em;
}

.mi-3 {
  margin-inline: 1rem;
}
.mi-4 {
  margin-inline: 2rem;
}

.mr-2 {
  margin-right: 0.5rem;
}
.mr-3 {
  margin-right: 1rem;
}
.mr-4 {
  margin-right: 2rem;
}

.ml-1 {
  margin-left: 0.25rem;
}
.ml-2 {
  margin-left: 0.5rem;
}
.ml-3 {
  margin-left: 1rem;
}
.ml-4 {
  margin-left: 2rem;
}

/* Padding */
.p-1 {
  padding: 0.25rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-3 {
  padding: 1rem;
}
.p-4 {
  padding: 2rem;
}

.pt-1 {
  padding-top: 0.25rem;
}
.pt-2 {
  padding-top: 0.5rem;
}
.pt-3 {
  padding-top: 1rem;
}
.pt-4 {
  padding-top: 2rem;
}

.pr-2 {
  padding-right: 0.5rem;
}
.pr-3 {
  padding-right: 1rem;
}
.pr-4 {
  padding-right: 2rem;
}

.px-2 {
  padding-inline: 0.5rem;
}
.px-3 {
  padding-inline: 1rem;
}

.py-2 {
  padding-block: 0.5rem;
}
.py-3 {
  padding-block: 1rem;
}

/* Floats */
.fl-left {
  float: left;
}

/* Font Size */
.fs-20 {
  font-size: 20px;
}

.f-75 {
  font-size: 0.75rem;
}
.f-125 {
  font-size: 1.25rem;
}
.f-150 {
  font-size: 1.5rem;
}

/* Font Weight */
.fw-400 {
  font-weight: 400;
}

.d-table {
  display: table;
}
.d-cell {
  display: table-cell;
}

/* flex */
.d-flex {
  display: flex;
}
.flex-wrap {
  flex-wrap: wrap;
}
.flex-grow-1 {
  flex-grow: 1;
}

.align-items-center {
  align-items: center;
}

.offscreen {
  position: absolute;
  left: -10000px;
}

.rounded {
  border-radius: 6px;
}

.color-222 {
  color: #222;
}

.middle-align-children > span {
  display: table-cell;
  vertical-align: middle;
}

hr.thin {
  height: 1px;
  border: 0;
  margin-block: 1rem;
}

.bg-lightgray {
  background-color: #f4f4f4;
}

.bg-lightblue {
  background-color: aliceblue;
}

a.nodecor:hover {
  text-decoration: none;
}

/* text */
.text-center {
  text-align: center;
}

button.btn[disabled] {
  background-color: gray;
  cursor: default;
}

.border-lightgray {
  border: 1px solid lightgray;
}

/* other */

.priority-acct-icon {
  color: #facc15;
  background: #fff;
  padding: 3px;
  border-radius: 46px;
  border: 2px solid #facc15;
  font-size: 15px;
  margin-inline: 0.5rem;
  margin-bottom: 6px;
}

.priority-acc-center {
  border: none;
  box-shadow: none;
  display: flex;
  justify-content: center;
  align-items: baseline;
}

/* Home Page */

.registrationForm .hiddenError {
  margin-top: 10px;
  display: none;
}

.registrationForm .hiddenError-new {
  display: none;
}

.registrationForm .register-button {
  width: 100%;
}

.home-grey {
  background: #f2f2f2;
  padding: 50px 0px 50px 0px;
}

.home-grey > .everythingButNav {
  line-height: 2em;
}

.home-grey .faqs {
  font-size: 20px;
}

.home-testimonials {
  margin-top: 2em;
  font-size: 20px;
}

.home-testimonials .testimonial-block {
  margin: 1em 0px 1em 0px;
}

.home-dk-love-holder {
  background: #333333;
  color: #ffffff;
}

.home-dk-love-holder .everythingButNav {
  line-height: 2em;
}

.home-dk-love-entry img.photo {
  box-shadow: 9px 9px 21px rgba(0, 0, 0, 0.28);
  border: 8px solid #ffffff;
  box-sizing: border-box;
  width: 100%;
}

.home-dk-love-entry .quote-holder {
  position: relative;
  margin-top: 30px;
  font-family: serif;
  font-size: 30px;
  line-height: 1.1em;
}

.home-dk-love-entry .quote-holder .open-quote {
  display: inline-block;
  font-size: 120px;
  position: absolute;
  top: 16px;
  color: #7a7a7a;
}

.home-dk-love-entry .quote-holder .quote-text {
  text-indent: 35px;
  display: inline-block;
}

.home-dk-love-entry .quote-holder .quote-bio {
  font-size: 14px;
  line-height: 1.5em;
  margin-top: 2em;
}

.testimonialTopPosition {
  margin-top: 30px;
}

.testimonialMiddlePosition {
  margin-top: 120px;
}

/* Header */

.bouncedEmailNotificationContainer {
  background: red;
  height: auto;
}

.bouncedEmailNotificationContainer .inner2 {
  line-height: 1.5em;
  text-align: left;
  max-width: 1140px;
  width: 100%;
  padding: 0px 1em 0px 1em;
  box-sizing: border-box;
}

.bouncePadding {
  padding: 1em 0px 1em 0px;
}

.bouncePadding i.fa {
  margin-right: 10px;
  font-size: 28px;
  vertical-align: sub;
}

/* Footer */
.footerStuff {
  min-height: 0px;
  margin-bottom: 3em;
}

#footerLine {
  margin-top: 170px;
  border-top: 1px solid #dddddd;
}

.pad-15 {
  padding: 15px 15px 15px 15px;
}

.twitterEmbed {
  float: left;
  margin: 0px 20px 0px 0px;
}

.footerSocial {
  line-height: 1.5em;
}

.footerSocial a i.fa {
  width: 18px;
}

.footerSocial i.fa-bookmark {
  color: #cfe317;
}

.footerSocial i.fa-medium {
  color: #999999;
}

.footerSocial i.fa-instagram {
  color: #a143b1;
}

.footerSocial i.fa-twitter {
  color: #58ccff;
}

.footerSocial i.fa-facebook {
  color: #3b5998;
}

i.fa-youtube,
i.fa-youtube-play {
  color: #ff0000;
}

.copyright-info {
  /*margin-top:20px;*/
  color: #999;
  text-align: right;
}

.copyright-info ul.link-list {
  margin-top: 0;
  list-style: none;
}

.copyright-info ul.link-list li {
  margin-bottom: 5px;
}

span.nobr {
  white-space: nowrap;
}

/* Banner Notifications */

.banner-notify {
  display: flex;
}

.banner-notify-icon {
  margin-right: 5px;
}

.banner-notify-text {
  flex: 1;
  margin-right: 5px;
}

.banner-notify-close {
  text-align: right;
  padding: 5px 0 0 0;
}

.banner-reinstate {
  width: 100vw;
  position: relative;
  left: calc(-50vw + 50%);
  background: #e8f5ff;
  padding-top: 14px;
  padding-bottom: 14px;
  display: flex;
  justify-content: center;
}

.banner-reinstate-icon {
  margin-right: 5px;
  margin-left: 10px;
}

.banner-reinstate-text {
  flex: 1;
  margin-right: 5px;
  margin-left: 5px;
  font-weight: 400;
  color: #000000;
}

.info-icon {
  color: #0073c7;
  font-style: normal;
  font-weight: 900;
  font-size: 18px;
  text-align: center;
}

.mobile-prepaid-cont {
  display: flex;
  flex-direction: row;
  column-gap: 8px;
  align-items: center;
  justify-content: flex-start;
}

@media screen and (max-width: 380px) {
  .xs-hide {
    display: none;
  }
}
/* // @media screen and (max-width: 480px) */

/** Media query for super-small nonLoggedNav menu **/
@media screen and (max-width: 330px) {
  .nonLoggedDKLogoContainer {
    padding-bottom: 5px;
  }

  .navInnerNotLoggedIn {
    display: none;
  }

  .hero-content-wrapper {
    margin-bottom: 300px;
  }
}
/* // @media screen and (max-width: 330px) */

.verifyArtistFail,
.verifyArtistHasEmoji {
  border-color: red;
}

#verifyArtistCheckingContainer {
  display: none;
  margin-top: 20px;
}

#verifyArtistFailContainer {
  margin-top: 20px;
  background-color: red;
  padding: 10px;
}

#verifyArtistSuccessContainer {
  margin-top: 20px;
  padding: 10px;
}

.artistListItem {
  margin: 5px 0;
  display: flex;
}

.artistListIcon {
  margin-right: 5px;
}

.artistListStoreIcon {
  margin: 0 4px 0 2px;
}

.artistListLoadingIcon {
  margin: 0 4px 0 1px;
}

.artistCustomContainer {
  padding: 4px 0 0 26px;
}

.terms-box {
  padding: 15px;
  overflow-wrap: anywhere;
  box-sizing: border-box;
  white-space: pre-line;
  line-height: 1.2em;
  text-align: left;
  max-width: 500px;
  width: 100%;
  height: 150px;
  border: 1px solid #cccccc;
  overflow: auto;
}

.font-weight-400 {
  font-weight: 400;
}

.checkboxes-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.checkboxes-col {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
}

.checkbox-grid-cols {
  display: grid;
  grid-gap: 5px;
  grid-template-columns: auto 1fr;
  margin-bottom: 10px;
  align-items: start;
}

/* --------------------------
	Track-level role management
 -------------------------- */

td.track-role-heading,
td.track-version-heading {
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 10px;
  text-align: left;
  vertical-align: middle;
  border-bottom: none;
}
td.track-role-heading {
  border-bottom: 1px solid #ccc;
}
.mappingExplainer {
  font-size: 12px;
}
.track-role-heading-flex {
  font-weight: 400;
}

.track-role-heading-flex .showRoleModal,
.track-role-heading-flex .showVersionModal {
  font-weight: 600;
}
.track-role-heading-flex .showRoleModal i,
.track-role-heading-flex .showVersionModal i {
  width: 15px;
  margin-right: 2px;
}
.track-role-modal-container {
  border: none;
  padding: 0px;
}

.track-role-modal-cell {
  border: none;
  padding: 0 0 20px 0;
}
.track-role-modal-cell i {
  margin-left: 5px;
}

.collabDisplayDeleteIcon {
  margin-left: 5px;
  cursor: pointer;
}
.iconButton {
  padding: 3px 6px;
  border-radius: 4px;
  display: inline-block;
}
.iconButton:hover {
  background: #eee;
}
.iconButton i {
  display: inline-block;
  margin: auto;
}
.track-role-modal-cell .form-grid-label {
  font-weight: 400;
  margin-bottom: 7px;
}
.track-roles-module-title,
.track-version-module-title {
  font-weight: 600;
}
.track-role-modal-box,
.track-version-modal-box {
  border: 1px solid #ccc;
  border-radius: 5px;
  background: #ffffff;
  margin-top: 20px;
  margin-bottom: 0px;
  /* DC-472: transition: height 2000ms ease-in-out, opacity 2500ms ease-in-out; */
  display: none;
  padding: 25px 20px 5px 20px;
}
.track-role-modal-cell-buttons {
  padding-top: 10px;
}
.track-role-add-button {
  padding-left: 0px;
  border: none;
  font-weight: 400;
}

.track-role-submit {
  border-radius: 0px;
  padding-left: 20px;
  padding-right: 20px;
  margin-right: 5px;
  height: 44px;
}

.track-role-cancel {
  border-radius: 0px;
  padding-left: 20px;
  padding-right: 20px;
  background-color: white;
  color: #0f78b8 !important;
  margin-left: 5px;
  height: 44px;
}

.track-role-cancel:hover {
  background-color: #ffffff;
}

.track-role-name {
  padding: 20px 0;
  text-align: left;
  width: 1%;
  white-space: nowrap;

  align-items: center;
}

.track-role-edit {
  text-align: right;
  padding: 20px 0;
}

.collabName {
  font-weight: 500;
  display: inline-block;
  margin-right: 10px;
}
.collabRole {
  background: #eee;
  font-weight: 600;
  font-size: 10px;
  border-radius: 8px;
  display: inline-block;
  text-transform: uppercase;
  /*display: block;*/
  padding: 2px 8px;
  letter-spacing: 1px;
}
.version {
  font-weight: 400;
}
.track-role-version-modules {
  width: calc(50% + 10px);
  margin-bottom: 1em;
}

.track-version-person-container td {
  border-top: 1px solid #ccc;
  border-bottom: none;
}
/* --------------------------
	Upload form (table driven version)
----------------------------- */

#uploadTable {
  margin: 0;
  padding: 0;
  width: 100%;
}

#uploadTable .artworkInputBoxVisibleContainer {
  cursor: pointer;
  position: relative;
  height: 280px;
  width: 280px;
  margin-bottom: 20px;
  float: left;
}

.track-roles-module-support-text,
.track-version-module-support-text {
  margin-top: 0.2em;
  font-size: 12px;
}

#uploadTable .artworkInputBoxInvisible {
  cursor: pointer;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 280px;
  width: 280px;
  opacity: 0;
}

#uploadTable .artworkInputBoxInvisible input {
  cursor: pointer;
  height: 280px;
  width: 280px;
  outline: none;
}

.track-name-tips {
  line-height: 1.5em;
  margin-top: 10px;
  margin-bottom: 10px;
}

.songwriter-content label div:first-child {
  margin-bottom: 6px;
}

.flex-input {
  display: flex;
}

.coversong-new {
  padding-top: 11px;
  border-radius: 6px;
  line-height: 1.4;
  font-size: 1em;
}

.coversong-new.has-cover {
  background: rgba(249, 250, 251, 1);
}

.coversong-new.has-cover label {
  background: none;
}

.coversong-desc {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 0px 30px 34px 30px;
}

.coversong-subsection {
  width: 100%;
  max-width: 520;
}

.coversong-subheader {
  margin: 16px 0 10px 0;
  color: rgba(17, 24, 39, 1);
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.coversong-subheader i {
  margin-right: 4px;
}

.coversong-subheader i.cyan {
  color: #22d3ee;
}

.coversong-subheader-details {
  font-weight: 400;
}

.coversong-requirements {
  margin: 25px 0 20px 0;
  padding-left: 18px;
}

.coversong-requirement {
  margin-bottom: 10px;
}

.coversong-requirement i {
  margin-right: 10px;
}

/* --------------------------
	Upload form (table driven version) media queries
----------------------------- */

@media (max-width: 1120px) {
  #uploadTable .coolInput,
  #uploadTable .artworkInputBoxVisibleContainer,
  .track-role-version-modules {
    width: 435px;
  }
}
@media (max-width: 768px) {
  #uploadTable .coolInput,
  #uploadTable .artworkInputBoxVisibleContainer,
  #uploadTable .audioFileInputBoxVisibleContainer,
  #uploadTable .dolbyAtmosFileInputBoxVisibleContainer,
  .track-role-version-modules {
    width: 100%;
  }
}
@media (max-width: 500px) {
  .track-role-heading-flex {
    display: block;
  }

  .track-roles-module-support-text,
  .track-version-module-support-text {
    font-size: 12px;
    padding-left: 17px;
  }
}

/* --------------------------
	DK Utility Styles
 -------------------------- */

/* add "dk__" class prefix to outer container as to not overwrite existing site styles */

/* DK Text Colors */

.dk__ .txt-light {
  color: #fff;
}
.dk__ .txt-primary {
  color: #0e78b8;
}

/* DK Background Colors */

.dk__ .bg-light {
  background-color: #fff;
}
.dk__ .bg-light-gray {
  background-color: #f9fafb;
}
.dk__ .bg-primary {
  background-color: #0e78b8;
}

/* DK Defaults */

.dk__ {
  font-weight: 400;
  font-family: "Lato", helvetica, arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.dk__ p {
  font-weight: 400;
}

.dk__ span {
  font-weight: inherit;
}

.dk__ hr {
  height: 1px;
  background-color: #efefef;
  border: 0;
  margin-bottom: 20px;
}

.dk__ .fade-out-gallery {
  position: relative;
  box-sizing: border-box;
}

.dk__ .fade-out-gallery::before {
  position: absolute;
  content: "";
  right: -5px;
  left: -5px;
  bottom: -5px;
  height: 200px;
  z-index: 1;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1), rgba(255, 255, 255, 1));
}

.dk__ .bg-primary {
  background: #0f78b8;
}

.dk__ .section-padding {
  padding: 30px 20px;
}

.dk__ .no-br {
  white-space: nowrap;
}

.dk__ .float-right {
  float: right;
}

.dk__ .float-right::after {
  clear: right;
}

.dk__ .txt-right {
  text-align: right;
}

.dk__ .text-large {
  font-size: 1.2rem;
  line-height: 1.5em;
}

.dk__ .sm-subtext {
  display: block;
  margin-top: 5px;
  font-size: 12px;
  font-weight: 300;
}

.dk__ main {
  min-height: 550px;
}

.dk__ .header-bar {
  background: #0f78b8;
  text-transform: uppercase;
  color: #ffffff;
  padding: 1em;
}

.dk__.navNotLoggedIn {
  background: #0f78b8;
  color: #ffffff;
  border-bottom: 0px;
}

.dk__ .page-wrapper {
  max-width: 1140px;
  padding: 0 20px;
  margin: 0 auto;
}

.dk__ .page-wrapper-ident {
  max-width: 750px;
  padding: 0 20px;
  margin: 0 auto;
}

.dk__ .overflow-hidden {
  overflow: hidden;
}

.dk__ .section {
  margin: 40px 0;
  padding: 0;
}

/* DK Typography */

.dk__ h1 {
  font-size: 36px;
  line-height: 43.2px;
  margin: 0 0 60px 0;
  font-weight: bold;
}
.dk__ h2 {
  font-size: 30px;
  line-height: 36px;
  margin: 0 0 60px 0;
  font-weight: bold;
}
.dk__ h3 {
  font-size: 24px;
  line-height: 30px;
  font-weight: bold;
}
.dk__ h4 {
  font-size: 22px;
  line-height: 26px;
  font-weight: bold;
}
.dk__ h5 {
  font-size: 18px;
  line-height: 22px;
  font-weight: bold;
}
.dk__ h6 {
  font-size: 18px;
  line-height: 22px;
  font-weight: 400;
}

.dk__ .sub-text {
  font-size: 0.75em;
  font-weight: inherit;
  margin-top: 1em;
  padding: 0;
}

.dk__ .photo-description {
  font-size: 18px;
  margin-top: 2px;
  color: #000;
}

/* DK Ornamental */

.dk__ hr {
  border: 0;
  border-top: 1px solid #ececec;
  margin: 20px 0px;
}

.dk__ .border-round {
  border-radius: 6px;
}

.dk__ .shadow {
  box-shadow:
    0 0 10px 4px rgba(0, 0, 0, 0.1),
    0 0 2px 1px rgba(0, 0, 0, 0.1);
}

/* Spacing */

.dk__ .no-margin {
  margin: 0 0 0 0;
}

.dk__ .no-padding {
  padding: 0 0 0 0;
}

.dk__ .m-b-1 {
  margin-bottom: 1rem;
}

.dk__ .m-b-2 {
  margin-bottom: 2rem;
}

.dk__ .m-b-3 {
  margin-bottom: 3rem;
}

/* Layout */

.dk__ .full-width {
  width: 100vw;
  position: relative;
  left: 50%;
  margin-left: -50vw;
  padding: 20px;
  box-sizing: border-box;
}

.dk__ .flex-row {
  max-width: 1140px;
  margin: 0 auto;
  display: flex;
  justify-content: space-evenly;
  align-items: flex-start;
}

.dk__ .flex-col {
  flex: 1;
  min-width: 270px;
  height: auto;
  margin: 0 2%;
}

/* Quotemarks */

.dk__ .quote::before {
  content: "\201C";
}

.dk__ .quote::after {
  content: "\201D";
}

/* --------------------------
	DK UI Elements
 -------------------------- */

.dk__ .section {
  margin: 70px 0;
}

.dk__ .billboard {
  display: flex;
  justify-content: space-evenly;
  background-color: #0e78b8;
  height: 600px;
  overflow: hidden;
}

.dk__ .billboard-overflow {
  position: relative;
  display: flex;
  justify-content: flex-start;
  background-color: #0e78b8;
}

.dk__ .billboard-img-box {
  flex: 1;
  position: relative;
}

.dk__ .billboard-img-box img {
  position: absolute;
  bottom: 0;
  right: 10vw;
  max-height: 575px;
  max-width: 30vw;
}

.dk__ .billboard-copy {
  flex: 1;
  align-self: center;
  padding: 0 0 0 150px;
}

.dk__ .billboard-logo {
  width: 264px;
  height: auto;
  margin-bottom: 80px;
}

.dk__ .billboard-title {
  font-size: 65px;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 2rem;
  color: #fff;
}

.dk__ .billboard-slogan {
  color: #fff;
  font-size: 50px;
  font-weight: 300;
  line-height: 60px;
  letter-spacing: -0.5px;
  margin-bottom: 30px;
}

.dk__ .textButtonWarning {
  text-transform: none;
  color: #eb5757;
}

.dk__ .removeFromAllStoresBtn {
  margin-top: 2em;
}

.dk__ .explLyricHolder {
  display: block;
}
.dk__ ul.adviceList li,
.dk__ ol.adviceList li {
  margin-bottom: 0.5em;
  line-height: 1.5em;
  font-size: 14px;
}
.dk__ .releaseTimeTr,
.dk__ .synchronizationTr {
  display: none;
}

.dk__ ul.releaseInfo {
  list-style-type: none;
  margin: 0;
  padding: 0;
  clear: both;
  font-size: 14px;
  color: #999;
}
.dk__ ul.adviceList li strong,
.dk__ ol.adviceList li strong {
  font-weight: 800;
}
.dk__ .youtube-verification {
  font-size: 24px;
  line-height: 28px;
  color: #fff;
}

.dk__ .youtube-verification .fa {
  color: #fff;
  font-size: 32px;
  vertical-align: middle;
  margin-right: 10px;
  float: left;
}

.dk__ .facebook-free-logo {
  width: 25px;
  height: 25px;
  margin-right: 7px;
}

.dk__ .features h2 {
  margin-top: 0;
}

.dk__ .feature-list {
  margin: 0 0 1em 0;
  padding: 0 0 0 2em;
  list-style: none;
}

.dk__ .feature-list li {
  position: relative;
  padding-left: 0.4em;
  font-size: 24px;
  line-height: 30px;
  margin-bottom: 30px;
}

.dk__ .feature-list li::before {
  content: "\f00c";
  font-family: FontAwesome;
  font-size: 30px;
  color: #0f77b8;
  position: absolute;
  left: -1em;
  top: 0;
}

.dk__ .feature-list-sm {
  margin: 0 0 1em 0;
  padding: 0 0 0 2em;
  list-style: none;
}

.dk__ .feature-list-sm li {
  position: relative;
  padding-left: 0.4em;
  font-size: 22px;
  line-height: 30px;
  margin-bottom: 30px;
  font-weight: 400;
}

.dk__ .feature-list-sm li::before {
  content: "\f00c";
  font-family: FontAwesome;
  font-size: 20px;
  color: #0f77b8;
  position: absolute;
  left: -1.6em;
  top: 0;
}

.dk__ .faq p {
  font-size: 24px;
  line-height: 30px;
}

.dk__ .testimonials-press p {
  font-size: 24px;
  line-height: 30px;
}

.dk__ .testimonials-press a {
  color: inherit;
}

.dk__ .testimonials-artists {
  padding: 0 20px;
}

.dk__ .home-dk-love-holder .everythingButNav {
  margin: 0;
}

/* Card */

.dk__ .card {
  margin-bottom: 30px;
}

.dk__ .card-head {
  border-bottom: 1px solid #ececec;
  padding: 30px 50px 20px 50px;
}

.dk__ .card-header {
  margin: 10px 0 10px 0;
}

.dk__ .card-subhead {
  font-size: 22px;
  line-height: 26.4px;
  margin-bottom: 1em;
  font-weight: 300;
}

.dk__ .card-body {
  padding: 50px 50px 0px 50px;
}

.dk__ .card-body .homeFormInputContainer {
  border-radius: 6px;
  font-size: 20px;
  line-height: 24px;
  margin-bottom: 20px;
  overflow: hidden;
}

.dk__ .card-body .homeFormInput {
  font-size: 20px;
  line-height: 24px;
  border-radius: 6px;
  padding: 10px 10px;
}

.dk__ .card-body .button {
  font-size: 20px;
  line-height: 24px;
  border-radius: 6px;
  padding: 18px 10px;
  margin-bottom: 20px;
  text-transform: capitalize;
}

.dk__ .testimonialMiddlePosition {
  margin-top: 60px;
}

.dk__ .testimonials img.photo {
  box-shadow: none;
  border: none;
}

.dk__ .open-quote {
  /* hides older quote mark */
  display: none !important;
}

.dk__ .quote-text {
  font-family: Lato;
  font-style: normal;
  font-weight: bold;
  font-size: 22px;
  line-height: 24px;
  text-indent: 0 !important;
  margin-bottom: 1rem;
  color: #000;
}

.dk__ .quote-text::before {
  content: "\201C";
}

.dk__ .quote-text::after {
  content: "\201D";
}

.dk__ .quote-bio {
  font-size: 18px;
  line-height: 22px;
}

.dk__ .home-dk-love-holder {
  background: transparent;
  color: #4f5057;
}

.dk__ .home-dk-love-holder span {
  color: #4f5057 !important;
}

.dk__ .link-to-top {
  display: none;
}

.dk__ main {
  min-height: 550px;
}

.dk__ .header-bar {
  background: #0f78b8;
  text-transform: uppercase;
  color: #ffffff;
  padding: 1em;
}

.dk__ .narrow-page h1 {
  font-size: 1.45rem;
}

.dk__ .narrow-page {
  max-width: 760px;
  min-height: 500px;
  margin: 0 auto;
  padding: 18px 25px 0 25px;
}

.dk__ .narrow-page h1 {
  margin-bottom: 30px;
}

.dk__ .row-fullwidth {
  width: 100vw;
  position: relative;
  margin-left: -50vw;
  left: 50%;
}

.dk__ .upstream-billboard {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.dk__ .upstream-billboard-left {
  flex: 1;
}

.dk__ .upstream-billboard-right {
  max-width: 300px;
}

.dk__ .upstream-billboard-header {
  color: #0f78b8;
  font-size: 28px;
  margin-bottom: 2rem;
  font-weight: 400;
}

.dk__ .upstream-billboard-slogan {
  font-size: 34px;
  font-weight: 600;
  max-width: 600px;
  line-height: 1;
  margin-bottom: 2rem;
}

.dk__ .upstream-billboard-text {
  font-size: 24px;
  font-weight: 400;
  max-width: 775px;
  line-height: 1.2;
  margin-bottom: 2rem;
}

.dk__ .bubble-text {
  display: inline-block;
  padding: 10px 20px;
  line-height: 1.5;
  font-size: 20px;
  font-weight: bold;
  border-radius: 20px;
  background: #deefff;
}

.dk__ .bubble-text-author {
  font-size: 18px;
  font-weight: 500;
  padding: 5px 15px;
  line-height: 1.5;
}

.dk__ .signup-container {
  box-sizing: border-box;
  max-width: 1140px;
  padding: 40px 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  margin: 0 auto;
}

.dk__ .signup-description {
  flex: 1.5;
  min-width: 250px;
  margin: 0 30px 30px 0;
  color: #fff;
}

.dk__ .signup-header {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 2rem;
}

.dk__ .signup-form {
  flex: 1;
  min-width: 250px;
  background: #fff;
  margin: 0;
  padding: 30px;
  border-radius: 6px;
}

.dk__ .signup-form-title {
  font-size: 22px;
  font-weight: 600;
}

.dk__ .message-block {
  width: 100%;
}

.dk__ .message-header {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 2rem;
}

.dk__ .message-text {
  font-size: 28px;
  margin-bottom: 2rem;
  font-weight: 400;
}

.dk__ .labels-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: 20px;
}

.dk__ .label-grid-item {
  display: flex;
  width: 100%;
  height: auto;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  border: 1px solid #e4e4e4;
  border-radius: 6px;
  background: #efefef;
  overflow: hidden;
}

.dk__ .label-grid-item img {
  display: block;
  width: 100%;
  height: auto;
}

.dk__ .inro-text,
.dk__ .intro-text {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  margin-bottom: 40px;
}

.dk__ .icon-in-h1 {
  font-size: 24px;
  margin-right: 3px;
  color: #643fa5;
}

.dk__ .icon-in-h1-artists {
  font-size: 24px;
  margin-right: 3px;
  color: #0071c7;
}

.dk__ .hide {
  display: none;
}

.dk__ .text-center {
  text-align: center;
}

.dk__ .shadow-box {
  margin: 40px 0 50px 0;
  padding: 20px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  box-shadow:
    0px 1px 2px rgb(0 0 0 / 8%),
    0px 4px 12px rgb(0 0 0 / 5%);
}

.dk__ .needToUploadFirstMusicPrompt {
  padding: 30px;
  box-shadow:
    0px 1px 2px rgb(0 0 0 / 8%),
    0px 4px 12px rgb(0 0 0 / 5%);
  border-radius: 6px;
  max-width: 450px;
  margin: 0 auto;
  text-align: center;
  display: none;
}

.dk__ .needToUploadFirstMusicPrompt h2 {
  margin-top: 0;
}

.dk__ .needToUploadFirstMusicPrompt p {
  font-size: 16px;
  line-height: 1.5;
}

.dk__ .form-row {
  display: flex;
  justify-content: space-evenly;
  flex-direction: column;
}

.dk__ .form-row-left {
  display: flex;
}
.dk__ .editRelease .form-row-left {
  /* padding-top: 2em;
	padding-bottom: 2.5em; */
}
.dk__ .editRelease .coolInput,
.dk__ .editRelease .btn,
.dk__ .editRelease .coolInputSmall {
  font-size: 16px;
}

.dk__ .form-group-end {
  border-bottom: 1px solid #e4e4e4;
  border-collapse: collapse;
  padding-bottom: 20px;
}
.dk__ .form-group-start {
  padding-top: 20px;
  border-collapse: collapse;
}

.dk__ .form-group-item {
  padding: 1em 15px;
  margin: 0 -15px;
  border-radius: 6px;
}
.dk__ .form-group-item:hover {
  background: #fcfcfc;
}

.dk__ .form-row.space-around {
  justify-content: space-around;
}

.dk__ .form-col {
  padding: 15px 10px;
}

.dk__ #label-reg {
  width: 100%;
}

.dk__ .form-grid-box {
  padding: 40px 20px 20px 20px;
  border-bottom: 1px solid #e4e4e4;
}

.dk__ .form-grid-row {
  margin-bottom: 20px;
}

.dk__ .form-grid-label {
  margin-bottom: 10px;
}

.dk__ .form-grid-input {
  margin-bottom: 15px;
}

.form-grid-button {
  display: flex;
  justify-content: center;
}

.form-grid-button-left {
  /* modifier when you don't want the form-grid-button to auto center on smaller width */
  justify-content: flex-start;
}

.dk__ .form-input {
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  min-height: 30px;
  width: 100%;
  box-sizing: border-box;
  padding: 10px;
}

.dk__ .justify-content-right {
  display: flex;
  justify-content: flex-end;
}

.dk__ .justify-content-left {
  display: flex;
  justify-content: flex-start;
}

.dk__ .justify-content-center {
  display: flex;
  justify-content: center;
}

.dk__ .coolInput {
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  height: 40px;
  width: 100%;
  border-radius: 6px;
  box-sizing: border-box;
  padding: 10px;
  min-width: auto;
}

.dk__ .coolTextArea {
  font-size: 14px;
  font-weight: 400;
  line-height: 17px;
  height: 150px;
  width: 100%;
  border-radius: 6px;
  box-sizing: border-box;
  padding: 10px;
  min-width: auto;
  border: 1px solid #ccc;
}

.dk__ .charCount {
  font-size: smaller;
}

.dk__ .profileArtworkRender {
  max-height: 100%;
  max-width: 100%;
  width: auto;
  height: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.dk__ .cropartworkPreviewHolder {
  height: 198px;
  width: 198px;
  cursor: default;
}

.dk__ .clearImageHolder {
  clear: both;
  float: left;
  max-width: 198px;
  line-height: 1.1em;
  cursor: pointer;
}

.dk__ .cropImageHolder {
  clear: both;
  float: left;
  line-height: 1.1em;
}

.dk__ .cropImageHolder i {
  color: green;
}

.dk__ .input-group {
  margin-bottom: 20px;
}

.dk__ .btn {
  font-size: 14px;
  font-weight: 400;
  text-transform: capitalize;
  min-height: 40px;
  border: 0;
  border-radius: 6px;
  box-sizing: border-box;
  display: inline-block;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  outline: none;
  padding: 10px 20px;
  background-color: #0f78b8;
  color: #ffffff;
}

.dk__ .btn.fullwidth {
  width: 100%;
}

.dk__ .btn:hover {
  background-color: #0884c5;
}

.dk__ .btn.no-fullwidth {
  width: auto;
}

.dk__ .button {
  padding: 12px 18px;
  text-transform: capitalize;
}

.dk__ .btn-lg {
  font-size: 28px;
  line-height: 1.2;
  padding: 25px;
  height: auto;
  font-weight: 400;
}

.form-label-block {
  font-size: 14px;
  line-height: 17px;
  display: block;
  margin-bottom: 10px;
}

::placeholder {
  opacity: 0.5;
}

.dk__ ::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #bbb;
  opacity: 1; /* Firefox */
}

.dk__ ::-ms-input-placeholder {
  /* Microsoft Edge */
  color: #bbb;
}

.dk__ .flex-1 {
  flex: 1;
}

.dk__ .flex-05 {
  flex: 0.5;
}

.dk__ .no-border {
  border: 0;
}

.dk__ .radio-margin {
  margin-bottom: 10px;
}

.dk__ .bottom-border {
  border-bottom: 1px solid #e4e4e4;
  margin-bottom: 20px;
}

.dk__ .twitch-connected-header,
.dk__ .profile-connected-header {
  font-size: 15px;
  line-height: 18px;
  font-weight: 600;
  border-bottom: 1px solid #e4e4e4;
  margin: 0;
  padding: 0 0 20px 0;
}

.dk__ .connectedArtist {
  display: flex;
  border-bottom: 1px solid #e4e4e4;
  padding: 20px 0;
}

.dk__ .connected-indicator {
  margin-right: 15px;
}

.dk__ .connected-indicator .fa,
.dk__ .connected-indicator .fa.connected,
.dk__ .connected-indicator .fa.inserted {
  font-size: 10px;
  color: #37c273;
}

.dk__ .connected-indicator .fa.disconnected {
  font-size: 10px;
  color: #bdbdbd;
}

.dk__ .connected-indicator .fa.processing,
.dk__ .connected-indicator .fa.new,
.dk__ .connected-indicator .fa.ready-to-upload {
  font-size: 10px;
  color: #ffcc37;
}

.dk__ .connected-indicator .fa.rejected,
.dk__ .connected-indicator .fa.deleted,
.dk__ .connected-indicator .fa.error,
.dk__ .connected-indicator .fa.payment-required,
.dk__ .connected-indicator .fa.failed,
.dk__ .connected-indicator .fa.failed---refunded {
  font-size: 10px;
  color: #d00000;
}

.dk__ .connected-artist-info {
  flex: 1;
  padding-right: 10px;
  cursor: pointer;
}

.dk__ .connected-artist-name {
  font-size: 15px;
  line-height: 22.5px;
  font-weight: 700;
  margin: 0;
  padding: 0;
}

.dk__ .connected-artist-url a {
  font-size: 15px;
  line-height: 22.5px;
  font-weight: 400;
  color: #343a41;
  margin: 0;
  padding: 0;
}

.dk__ .connected-artist-actions {
  display: flex;
  align-items: center;
}

.dk__ .artistDisconnectTwitch {
  font-size: 12px;
}

.dk__ .artistDisconnectTwitch:hover {
  cursor: pointer;
  color: #d8302f;
}

.dk__ .artistDisconnectAudiomack {
  font-size: 16px;
  color: #828282;
}

.dk__ .artistDisconnectAudiomack:hover {
  cursor: pointer;
  color: #d8302f;
}

.dk__ .confirmation-message {
  margin: 80px 0 40px 0;
  text-align: center;
}

.dk__ #spinner {
  padding-bottom: 10px;
}

/* --------------------------
	Artist Profile Bio
--------------------------- */

.artistBioTextArea {
  border-radius: 0px;
  width: 50%;
  min-width: 200px;
  line-height: 30px;
  height: 125px;
  font-size: 15px;
  border: 1px solid #ccc;
  outline: none;
  margin: 0px !important;
  padding: 2px 0px 0px 5px;
  font-weight: 300;
  color: #68696b;
  line-height: 1.3em;
  font-family: "Lato", helvetica, arial, sans;
  border-radius: 6px;
}

.dk__ ol.legal-list li ol li {
  list-style-type: lower-alpha;
}

.dk__ ol.legal-list li ol li ol li {
  list-style-type: lower-roman;
}

.dk__ ol.legal-list li ol {
  margin-bottom: -38px;
}

.dk__ .text-transform-none {
  text-transform: none !important;
}

/* Marketing Billboard */

.dk__ .marketing-billboard {
  display: block;
  position: relative;
  background-color: #0e78b8;
  overflow: hidden;
}

.dk__ .marketing-billboard-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1140px;
  margin: 0 auto;
  padding: 20px;
}

.dk__ .marketing-billboard-text-box {
  flex: 1;
  padding: 20px;
  box-sizing: border-box;
}

.dk__ .marketing-billboard-logo-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin: 40px 0 60px 0;
}

.dk__ .marketing-billboard-dk-logo img {
  height: 40px;
  width: auto;
}

.dk__ .marketing-billboard-partner-logo img {
  height: 55px;
  width: auto;
}

.dk__ .marketing-billboard-vert-divider {
  border-left: 1px solid #fff;
  width: 0px;
  margin-left: 35px;
  margin-right: 25px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.dk__ .marketing-billboard-text-lg {
  font-size: 40px;
  font-weight: 300;
  line-height: 1.3;
  margin-bottom: 1.5rem;
  color: #fff;
}

.dk__ .marketing-billboard-text-md {
  font-size: 28px;
  font-weight: 300;
  line-height: 1.2;
  color: #fff;
  margin-bottom: 1rem;
}

.dk__ .marketing-billboard-graphic {
  width: 40%;
  padding-top: 50px;
  align-self: stretch;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.dk__ .marketing-billboard-graphic img.laptop {
  max-width: 750px;
  width: 175%;
  height: auto;
  transition: all ease 200ms;
}

@media (max-width: 938px) {
  .dk__ .marketing-billboard-container {
    padding: 10px;
  }

  .dk__ .marketing-billboard-logo-box {
    margin: 30px 0 40px 0;
  }

  .dk__ .marketing-billboard-dk-logo img {
    height: 20px;
  }

  .dk__ .marketing-billboard-vert-divider {
    margin-left: 25px;
    margin-right: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .dk__ .marketing-billboard-partner-logo img {
    height: 35px;
  }

  .dk__ .marketing-billboard-text-lg {
    font-size: 30px;
    line-height: 1.3;
    margin-bottom: 1.5rem;
  }

  .dk__ .marketing-billboard-text-md {
    font-size: 20px;
    line-height: 1.2;
    margin-bottom: 1rem;
  }

  .dk__ .marketing-billboard-graphic {
    display: none;
  }
}

/* End: Marketing Billboard */

/* Twitch Affiliate */

.dk__ .twitch-billboard {
  display: block;
  margin: 0;
  padding: 10px;
  position: relative;
  background-color: #0e78b8;
}

.dk__ .twitch-text-box {
  max-width: 1140px;
  margin: 0 auto;
  padding: 20px 20px 60px 20px;
  box-sizing: border-box;
}

.dk__ .twitch-logo-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin: 40px 0 80px 0;
}

.dk__ .twitch-dk-logo img {
  height: 40px;
  width: auto;
}

.dk__ .twitch-logo img {
  height: 33px;
  width: auto;
}

.dk__ .mqa-logo img {
  height: 50px;
  width: auto;
}

.dk__ .twitch-vert-divider {
  color: #fff;
  font-size: 33px;
  padding: 0 20px 10px 20px;
}

.dk__ .twitch-marketing-text-lg {
  font-size: 65px;
  font-weight: bold;
  line-height: 1.1;
  margin-bottom: 1rem;
  color: #fff;
}

.dk__ .twitch-marketing-text-md {
  font-size: 42px;
  line-height: 1.1;
  color: #fff;
  margin-bottom: 1rem;
}

.dk__ .twitch-verification {
  position: absolute;
  bottom: -36px;
  right: 7%;
}

.dk__ .twitch-verification img {
  width: 60px;
  height: auto;
}

.dk__ .twitch-form-bg {
  background: transparent;
}

.dk__ .twitch-flex-row {
  margin: 0 auto;
  display: flex;
  justify-content: space-evenly;
  max-width: 1140px;
  min-height: 500px;
  align-items: center;
}

.dk__ .dk__ .twitch-check-outline img {
  position: absolute;
  width: 400px;
  height: auto;
  right: -100px;
  transform: translatey(-50%);
}

.dk__ .twitch-header-text-lg {
  font-size: 56px;
  font-weight: 700;
  line-height: 1.2em;
  margin: 0 0 1.6rem 0;
}

.dk__ .twitch-p-text-md,
.dk__ .twitch-p-text-md p {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.4em;
  margin: 0 0 1.4em 0;
}

.dk__ .twitch-p-text-md-header {
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4em;
  margin-bottom: 1em;
}

.dk__ .twitch-p-text-lg,
.dk__ .twitch-p-text-lg p {
  font-size: 26px;
  color: #4f5057;
  font-weight: 400;
  text-align: left;
}

.dk__ .twitch-p-text-lg-header {
  font-size: 26px;
  font-weight: bold;
  line-height: 1.4em;
  margin-bottom: 1em;
}

.dk__ .twitch-artist-photo {
  width: 100%;
  height: auto;
}

@media screen and (min-width: 768px) {
  .dk__ .twitch-verification {
    bottom: -58px;
  }

  .dk__ .twitch-verification img {
    width: 100px;
    height: auto;
  }

  .dk__ .twitch-form-bg {
    background: #fff;
  }
}

@media screen and (max-width: 400px) {
  .dk__ .twitch-text-box {
    padding: 20px 20px 20px 20px;
  }
  .dk__ .editRelease .releaseDateInput {
    display: block;
    margin-bottom: 0.5em;
    width: 150px;
  }
  .dk__ .twitch-marketing-text-lg {
    font-size: 38px;
  }

  .dk__ .twitch-header-text-lg {
    font-size: 32px;
  }
}
/* End: Twitch Affiliate */

.tidalArtistPaymentsIcon {
  height: 20px;
  margin-right: 5px;
}

/* --------------------------
	DK Media Queries
 -------------------------- */

/* For Mobile */

@media (max-width: 768px) {
  .dk__ h1 {
    font-size: 18px;
    line-height: 21.6px;
    margin: 30px 0 30px 0;
    font-weight: bold;
  }
  .dk__ h2 {
    font-size: 18px;
    line-height: 21.6px;
    margin: 30px 0 30px 0;
    font-weight: bold;
  }
  .dk__ h3 {
    font-size: 14px;
    line-height: 17px;
    font-weight: bold;
  }
  .dk__ h4 {
    font-size: 14px;
    line-height: 17px;
    font-weight: bold;
  }
  .dk__ h5 {
    font-size: 12px;
    line-height: 14px;
    font-weight: bold;
  }
  .dk__ h6 {
    font-size: 12px;
    line-height: 14px;
    font-weight: 400;
  }

  .dk__ .hide-sm {
    display: none;
  }

  .dk__ .page-wrapper {
    padding: 0 20px;
  }

  .dk__ .section {
    margin: 30px 0;
  }

  .dk__ .photo-description {
    font-size: 14px;
    line-height: 16.8px;
    margin-top: 2px;
    color: #000;
  }

  .dk__ .billboard {
    height: auto;
  }

  .dk__ .billboard-img-box {
    display: none;
  }

  .dk__ .billboard-copy {
    flex: 1;
    align-self: center;
    padding: 40px 25px;
  }

  .dk__ .billboard-logo {
    width: 150px;
    height: auto;
    margin-bottom: 25px;
  }

  .dk__ .billboard-slogan {
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    line-height: 21.6px;
    letter-spacing: -0.5px;
    margin-bottom: 15px;
  }

  .dk__ .youtube-verification {
    font-size: 12px;
    line-height: 20px;
    color: #fff;
  }

  .dk__ .youtube-verification .fa {
    color: #fff;
    font-size: 20px;
    margin-right: 5px;
    vertical-align: middle;
    float: left;
  }

  .dk__ .facebook-free-logo {
    width: 12px;
    height: 12px;
    margin-right: 4px;
  }

  .dk__ .flex-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .dk__ .flex-col {
    flex: 1;
  }

  .dk__ .position-relative {
    position: relative;
  }

  .dk__ .faq p {
    font-size: 14px;
    line-height: 17px;
  }

  .dk__ .testimonials-press p {
    font-size: 14px;
    line-height: 17px;
  }

  .dk__ .testimonials-artists {
    padding: 0 10px;
  }

  .dk__ .card {
    margin-bottom: 20px;
  }

  .dk__ .card-head {
    border-bottom: 0px solid transparent;
    padding: 0 0 20px 0;
  }

  .dk__ .card-subhead {
    font-size: 15px;
    line-height: 18px;
    margin-bottom: 1em;
    font-weight: 300;
  }

  .dk__ .card-body {
    padding: 0;
  }

  .dk__ .card-body .homeFormInputContainer {
    border-radius: 6px;
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 20px;
    overflow: hidden;
  }

  .dk__ .card-body .homeFormInput {
    font-size: 18px;
    line-height: 22px;
    border-radius: 6px;
    padding: 0;
  }

  .dk__ .card-body .button {
    font-size: 18px;
    line-height: 22px;
    border-radius: 6px;
    padding: 10px 10px;
    text-transform: capitalize;
  }

  .dk__ hr {
    margin: 20px 5px;
  }

  .dk__ .shadow {
    box-shadow: none;
  }

  .dk__ .feature-list-sm {
    margin: 0 0 1em 0;
    padding: 0 0 0 2em;
    list-style: none;
  }

  .dk__ .feature-list-sm li {
    font-size: 16px;
    line-height: 1.4em;
    margin-bottom: 1.2em;
    font-weight: 400;
  }

  .dk__ .feature-list-sm li::before {
    content: "\f00c";
    font-family: FontAwesome;
    font-size: 18px;
    color: #0f77b8;
    position: absolute;
    left: -1.8em;
    top: 0;
  }

  .dk__ .twitch-p-text-md,
  .dk__ .twitch-p-text-md p {
    font-weight: 400;
    font-size: 16px;
  }

  .dk__ .twitch-header-text-lg {
    font-size: 30px;
  }
  .dk__ .twitch-p-text-lg,
  .dk__ .twitch-p-text-lg p {
    font-size: 20px;
  }
  .dk__ .twitch-logo-box {
    margin-bottom: 40px;
  }
  .dk__ .twitch-text-box {
    padding: 0;
  }
}

@media screen and (min-width: 600px) {
  .dk__ .narrow-page {
    padding: 30px 25px 0 25px;
  }

  .dk__ .narrow-page h1 {
    font-size: 1.65rem;
  }

  .dk__ .form-row {
    flex-direction: row;
    align-items: flex-end;
  }

  .dk__ .form-col {
    margin-bottom: 0;
  }

  .dk__ .section-padding {
    padding: 60px;
  }

  .dk__ .upstream-billboard-header {
    font-size: 32px;
  }

  .dk__ .upstream-billboard-slogan {
    font-size: 66px;
  }

  .dk__ .upstream-billboard-text {
    font-size: 36px;
  }

  .dk__ .signup-container {
    padding: 80px 60px;
  }

  .dk__ .message-block {
    width: 60%;
  }
}

/* for larger displays */

@media screen and (min-width: 992px) {
  .dk__ .form-grid-label {
    max-width: 40%;
  }

  .dk__ .form-grid-input {
    max-width: 40%;
  }

  .form-grid-button {
    display: flex;
    justify-content: flex-start;
  }
}

/* Snap DSP Sweet Confirm overrides */

.snapSATitle {
  font-size: 22px;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 700;
  padding-bottom: 15px;
}

.snapSATextContent {
  font-size: 16px;
  font-family: "Lato", helvetica, arial, sans;
  margin: 20px 5px 5px 5px;
}

.snapSAConfirmButton,
.roblox-sa-continue-button {
  padding: 10px !important;
  font-size: 16px !important;
  border-radius: 0 !important;
}

.snapSACancelButton,
.roblox-sa-cancel-button {
  padding: 10px !important;
  font-size: 16px !important;
  border-radius: 0 !important;
  border: 1px solid #3085d6 !important;
  background: none !important;
  color: #3085d6 !important;
}

/* Roblox DSP Sweet Confirm overrides */

.roblox-sa-title {
  font-size: 20px;
  color: var(--gray-900);
}

.roblox-sa-text-content {
  font-size: 13px;
  text-align: left;
}

.roblox-sa-subheader {
  font-weight: bold;
}

.roblox-sa-checkbox-row {
  display: flex;
}

/* Audiomack disconnect Sweet Confirm overrides */

.amDisconnectSATitle {
  font-size: 22px;
  font-family: "Lato", helvetica, arial, sans;
  font-weight: 700;
}

.amDisconnectSATextContent {
  font-size: 16px;
  font-family: "Lato", helvetica, arial, sans;
  margin: 20px 5px 5px 5px;
}

.amDisconnectSAConfirmButton {
  padding: 10px !important;
  font-size: 16px !important;
  border-radius: 5px !important;
  border: 1px solid #d8302f !important;
  background: none !important;
  color: #d8302f !important;
}

.amDisconnectSACancelButton {
  padding: 10px !important;
  font-size: 16px !important;
  border-radius: 5px !important;
  border: 1px solid #999999 !important;
  background: none !important;
  color: #999999 !important;
}

.tableInputCaret {
  position: relative;
  max-width: 600px;
}

.tableInputCaretColumn {
  max-width: 400px;
  width: 100%;
  position: relative;
}

.tableInputCaretColumnSmall {
  max-width: 200px;
  position: relative;
}

.dk__ select.coolSelect {
  display: block;
  font-size: 15px;
  font-family: sans-serif;
  font-weight: 400;
  color: #222;
  line-height: 1.3;
  padding: 3px 30px 3px 9px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  background-image: url("/images/chevron-down-solid.svg");
  background-repeat: no-repeat, repeat;
  background-position:
    right 0.7em top 50%,
    0 0;
  background-size:
    0.65em auto,
    100%;
  height: 42px;
}

/* used on Tidal Artist Payments */
.animation-checkmark-done {
  animation: appear 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  height: 50px;
  width: 50px;
}

@keyframes appear {
  0% {
    opacity: 0;
    transform: scale(2);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.js-reactDownloadVideo i.fa-download {
  margin-right: 5px;
}

/** /Start DK Mobile App Landing Page **/

/* MOBILE APP LANDING PAGE START */

.__dk_mobile_landing {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--gray-800);
  padding: 24px;
}

.img-app-icon-hero {
  width: 66px;
  height: auto;
  display: block;
  margin-right: 12px;
  margin-bottom: 12px;
}

.dk-mobile-app-logo {
  max-width: 160px;
  min-width: 120px;
}

.dk-for-ios-container {
  display: flex;
  flex-direction: column;
  column-gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.dk-for-ios-container a.dk-home-link {
  top: 2px;
  position: relative;
}

.download-button-holder .download-button-mobile {
  display: none;
}
.download-button-holder .download-button-desktop {
  display: block;
  width: 190px;
  height: auto;
}

a.download-button {
  display: inline-block;
}

a.download-button:hover {
  opacity: 0.85;
  cursor: pointer;
}

.h1-3xl {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-size: 46px;
  line-height: 1.2;
  margin: 18px 0;
}

.p-text-2xl {
  font-size: 24px;
  line-height: 36px;
  font-weight: 400;
  margin: 0;
}

.__dk_mobile_landing .app-store-cta-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 20px;
  margin-top: 30px;
}

.download-button-holder {
  flex-grow: 2;
}

.mobile-app-qr-scan-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex-grow: 2;
}

.mobile-app-qr-scan-container img {
  margin-bottom: 12px;
}

.__dk_mobile_landing .mobile-app-qr-code {
  max-width: 136px;
}

.__dk_mobile_landing .mobile-app-scan-text-container {
  max-width: 200px;
}

.__dk_mobile_landing .p-text-base {
  font-family: "Lato";
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  margin: 0;
}

.__dk_mobile_landing .p-text-sm {
  font-family: "Lato";
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
  margin: 6px 0 0;
  color: var(--gray-500);
}

.__dk_mobile_landing .vertial-line-mobile-app-cta {
  border: none;
  border-left: 1px solid var(--gray-200);
  height: 100px;
  flex-grow: 1;
}

.__dk_mobile_landing .mobile-app-bullet-point-container {
  display: flex;
  flex-direction: row;
  max-width: 700px;
  flex-wrap: wrap;
  row-gap: 24px;
  margin-top: 48px;
}

.__dk_mobile_landing .mobile-app-bullet-point {
  display: flex;
  flex-direction: row;
  column-gap: 18px;
  align-items: center;
  padding-right: 36px;
  width: 500px;
}

.__dk_mobile_landing .mobile-app-bullet-icon {
  max-width: 22px;
  filter: brightness(0) saturate(100%) invert(25%) sepia(97%) saturate(1238%) hue-rotate(183deg) brightness(109%)
    contrast(103%);
  position: inherit !important;
  display: block;
  height: 100%;
}

.__dk_mobile_landing .p-text-lg {
  font-style: normal;
  font-weight: 400;
  font-size: 17px;
  line-height: 1.4;
  color: var(--gray-700);
}

.__dk_mobile_landing .content-wrapper {
  margin-top: 160px;
  flex-wrap: nowrap;
}

.__dk_mobile_landing .content-wrapper-hero {
  margin-top: 48px;
  display: flex;
  flex-direction: row;
  column-gap: 30px;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.__dk_mobile_landing .text-wrapper {
  max-width: 600px;
  width: 100%;
}

.__dk_mobile_landing .text-wrapper-below-fold {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  max-width: 400px;
}

.__dk_mobile_landing .content-wrapper-column {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}

.__dk_mobile_landing .h1-base {
  color: var(--gray-700);
}

.__dk_mobile_landing .main-font {
  color: #374151;
}

.__dk_mobile_landing .faq-section {
  max-width: 100%;
}

.__dk_mobile_landing .landingPageAccordion {
  width: 100%;
}

.__dk_mobile_landing img.img-app-hero {
  width: 100%;
  order: 2;
}

.__dk_mobile_landing img.img-app-stats {
  height: auto;
}

.__dk_mobile_landing .got-money img {
  max-width: 600px;
  padding-top: 18px;
}

.__dk_mobile_landing h2.sub-heading {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.5;
  color: var(--gray-500);
}

.__dk_mobile_landing button.landingPageAccordion {
  background: none !important;
}

.__dk_mobile_landing .testimonial-hr {
  border: 0.5px solid #9ca3af;
}

.__dk_mobile_landing .lpfaq-question {
  color: var(--gray-700);
}

.__dk_mobile_landing .mobile-app-hero-hr {
  display: none;
}

.__dk_mobile_landing .content-wrapper-faq {
  padding-left: 20px;
  padding-right: 20px;
}

@media screen and (max-width: 1200px) {
  .__dk_mobile_landing .text-wrapper {
    max-width: 540px;
  }

  .__dk_mobile_landing .mobile-app-bullet-point {
    display: flex;
    flex-direction: row;
    column-gap: 12px;
    align-items: center;
    padding-right: 36px;
    max-width: 500px;
  }
}

@media screen and (max-width: 950px) {
  .__dk_mobile_landing .content-wrapper-hero {
    margin-top: 0px;
    flex-direction: column;
  }

  .__dk_mobile_landing img.img-app-hero {
    margin: 0 auto;
  }

  .__dk_mobile_landing .mobile-app-hero-hr {
    display: inline-block;
    width: 100%;
    margin-top: 100px;
    border-bottom: 1px solid #e5e7eb;
  }

  .__dk_mobile_landing .content-wrapper {
    row-gap: 40px;
  }

  .__dk_mobile_landing .content-wrapper.mobile-upload-unlimited {
    margin-top: 100px;
  }

  .__dk_mobile_landing .content-wrapper {
    flex-wrap: wrap;
  }

  .__dk_mobile_landing .got-money img {
    max-width: 480px;
    height: auto;
  }

  .__dk_mobile_landing .mobile-app-bullet-point-container {
    margin-top: 50px;
    max-width: 100%;
    padding: 0;
  }
}

@media screen and (min-width: 951px) {
  .__dk_mobile_landing .dk-for-ios-container {
    align-items: flex-start;
  }

  .__dk_mobile_landing .content-wrapper-column.got-money {
    margin-top: 180px;
  }
}

@media screen and (min-width: 480px) {
  .__dk_mobile_landing img.img-app-hero {
    max-width: 680px;
    min-width: 340px;
  }
}

@media screen and (max-width: 480px) {
  .__dk_mobile_landing .dk-for-ios-container {
    margin: auto;
  }

  .download-button-holder .download-button-mobile {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: auto;
  }
  .download-button-holder .download-button-desktop {
    margin: 0 auto;
    width: 100%;
    max-width: 180px;
    height: auto;
  }

  .__dk_mobile_landing .content-wrapper-hero {
    margin-top: 10px;
  }

  .__dk_mobile_landing .content-wrapper {
    row-gap: 20px;
    margin-top: 100px;
  }

  .__dk_mobile_landing .text-wrapper {
    width: 100%;
  }

  .__dk_mobile_landing .h1-lg {
    text-align: center;
  }

  .__dk_mobile_landing .p-text-xl {
    text-align: center;
    font-size: 16px;
    line-height: 24px;
  }

  .__dk_mobile_landing .p-text-lg {
    font-size: 16px;
    line-height: 24px;
  }

  .__dk_mobile_landing img.img-app-unlimited,
  .__dk_mobile_landing img.img-app-stats {
    max-width: 100%;
  }

  .__dk_mobile_landing .content-wrapper-faq {
    padding: 0;
    width: 100%;
    margin-bottom: 0;
  }

  .__dk_mobile_landing .content-wrapper-faq .h1-base {
    font-size: 24px;
  }

  .__dk_mobile_landing .accordion-wrapper .p-text-xl {
    text-align: left !important;
  }

  .__dk_mobile_landing .testimonial-hr {
    color: #9ca3af !important;
  }

  .__dk_mobile_landing .h1-3xl {
    font-size: 24px;
    line-height: 32px;
    text-align: center;
  }

  .__dk_mobile_landing h2.sub-heading {
    font-size: 20px;
    text-align: center;
    line-height: 24px;
  }

  .__dk_mobile_landing .mobile-app-qr-code,
  .__dk_mobile_landing .mobile-app-scan-text-container,
  .__dk_mobile_landing .vertial-line-mobile-app-cta {
    display: none;
  }

  .__dk_mobile_landing .app-store-cta-container {
    margin-top: 0;
  }

  .__dk_mobile_landing .download-button-holder {
    text-align: center;
    width: 100%;
    margin: 32px 0;
  }

  .__dk_mobile_landing .mobile-app-bullet-point-container {
    text-align: center;
    max-width: 100%;
    margin-top: 0;
  }

  .__dk_mobile_landing .mobile-app-bullet-point {
    width: 100%;
    padding-right: 0;
  }

  .__dk_mobile_landing .mobile-app-hero-hr {
    display: inline-block;
    width: 100%;
    margin-top: 100px;
    border-bottom: 1px solid #e5e7eb;
  }

  .__dk_mobile_landing .content-wrapper.mobile-upload-unlimited {
    margin-top: 100px;
  }

  .__dk_mobile_landing img.img-app-stats {
    max-width: 80%;
  }

  .__dk_mobile_landing .got-money {
    margin-top: 120px;
  }

  .__dk_mobile_landing .got-money img {
    width: 100%;
  }
}

/** /End DK Mobile App Landing Page **/

/* Announcement banner */
/* ------------------------- */

.announcement-banner-container {
  display: flex;
  width: 100%;
}

.announcement-banner-container .close-banner-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.announcement-banner-container .close-banner {
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  font-weight: 400;
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin: 0 12px;
  border-radius: 6px;
}

.announcement-banner-container .close-banner:hover {
  cursor: pointer;
}

.announcement-banner {
  display: block;
  width: 100%;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  padding: 18px;
  text-align: center;
  font-weight: 400;
  line-height: 1.5;
  font-size: 16px;
}

.announcement-banner-link {
  text-decoration: none;
}

.announcement-banner-link:hover {
  text-decoration: none;
}

.announcement-banner-content {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 4px;
}

.announcement-banner .primary-banner-icon,
.announcement-banner .banner-go-icon {
  width: 16px;
  height: auto;
}

.announcement-banner .primary-banner-icon {
  margin-right: 3px;
  position: relative;
  top: 3px;
}

.announcement-banner .banner-go-icon {
  margin-left: 5px;
  vertical-align: text-bottom;
}

.announcement-banner-text {
  display: flex;
  flex-flow: row wrap;
  gap: 4px;
  text-align: left;
}

.announcement-banner-cta {
  cursor: pointer;
}

/* banner .purple */
.announcement-banner-container.purple .close-banner {
  color: #5b21b6;
}
.announcement-banner-container.purple .close-banner:hover {
  background-color: #ede9fe;
}

.announcement-banner-container.purple {
  background: #ede9fe;
  color: #5b21b6;
}

.announcement-banner-container.purple a {
  color: #5b21b6;
}

.announcement-banner-container.purple img.primary-banner-icon,
.announcement-banner-container.purple .banner-go-icon {
  filter: invert(44%) sepia(48%) saturate(770%) hue-rotate(221deg) brightness(70%) contrast(88%);
}
/* End banner .purple */

/* banner .lime */
.announcement-banner-container.lime .close-banner {
  color: #065f46;
}
.announcement-banner-container.lime .close-banner:hover {
  background-color: #ecfdf5;
}

.announcement-banner-container.lime {
  background: #ecfdf5;
  color: #065f46;
}

.announcement-banner-container.lime a {
  color: #065f46;
}

.announcement-banner-container.lime img.primary-banner-icon,
.announcement-banner-container.lime .banner-go-icon {
  filter: invert(27%) sepia(15%) saturate(3069%) hue-rotate(118deg) brightness(97%) contrast(95%);
}
/* End banner .lime */

/* End Announcement banner */

/* Start Bank Mobile Promo */
.bankPromoTitle {
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: #000000;
  margin: 20px 0;
}

.bankPromoModal {
  width: 90%;
  border-radius: 15px;
}
/* End Bank Mobile Promo */

.bank-tipalti-link,
.bank-tipalti-link:visited,
.bank-tipalti-link:hover {
  color: #999999;
  font-size: 12px;
  text-decoration: none;
  border-bottom: 1px solid #999999;
}

/* Start lapsed takedown banner */
.alert-col {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
  font-size: 14px;
  line-height: 20px;
}

.alert-icon-red {
  font-size: 18px;
  color: var(--red-600);
}

.alert-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}

.alert-text {
  font-size: 16px;
  line-height: 20px;
  font-weight: 400;
}

.alert-text-bold {
  font-size: 16px;
  font-weight: bold;
}

.alert-wrapper {
  display: flex;
  color: #000000;
  width: calc(100% - (2 * 18px));
  padding: 12px 12px;
  align-items: center;
  border: 1px solid var(--red-600);
  border-left: 6px solid var(--red-600);
  border-radius: 6px;
  margin: 18px 18px 24px;
  box-shadow: 0px 4px 12px 0px #0000000d;
  box-sizing: border-box;
}

.button-col {
  text-align: right;
  padding-left: 24px;
}

.button-restore {
  padding: 12px 18px;
  background: var(--blue-100);
  border-radius: 6px;
  font-weight: bold;
  border: 0;
  color: var(--blue-600);
  transition: all ease-in-out 0.2s;
}

.button-restore:hover {
  background: var(--blue-200);
  transition: all ease-in-out 0.2s;
}

.copy-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  align-items: center;
}

.icon-col {
  max-width: 30px;
}

.icon-margin {
  margin-right: 12px;
}

@media (max-width: 800px) {
  .alert-wrapper {
    padding-bottom: 18px;
  }

  .button-col {
    text-align: left;
    padding-left: 0;
    padding-top: 18px;
    margin-bottom: 6px;
    margin-top: 6px;
  }

  .copy-row {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* End lapsed takedown banner */

.alert-validation {
  margin-top: 0.7rem;
  margin-bottom: 1.3rem;
  padding: 1rem;
  font-size: 14px !important;
  line-height: 1.4;
  background: #fef9c3;
  color: #603610;
  border: 1px solid var(--gray-300);
  border-radius: 6px;
}

.dk__ select.previewStartMinutes {
  display: inline-block;
  width: initial;
}

.dk__ select.previewStartSeconds {
  display: inline-block;
  width: initial;
}

.social-media-pack-icon-dashboard {
  font-family: FontAwesome;
  font-size: 16px;
  width: 16px;
  margin-right: 8px;
  margin-left: 24px;
}

.social-media-pack-icon-dashboard.tiktok {
  width: 14px;
  margin-right: 10px;
}

.social-media-pack-group-dashboard {
  margin-top: 6px;
}

/* Terms of Service Page */

.tos-main-container {
  min-height: 800px;
}

.tos-inner-container {
  display: inline-block;
  max-width: 800px;
  width: 100%;
  text-align: left;
}

.tos-outer-container-1 {
  padding: 0px 1em 0px 1em;
  box-sizing: border-box;
}

.tos-outer-container-2 {
  width: 100%;
  text-align: center;
  padding: 0px 1em 0px 1em;
  box-sizing: border-box;
}

.tos-terms-container {
  white-space: pre-line;
  line-height: 1.2em;
}

.tos-terms-ol {
  margin-top: 0px;
}