body,
input,
textarea,
select,
[class*=hint--]:after {
  color: #FFFFFF;
  font-family: "IBM Plex Sans", "Lexend Deca", "Space Grotesk", "Roboto", "Helvetica", "Helvetica-Neue", "Helvetica Neue", "HelveticaNeue", "Arial", sans-serif;
}

h1 {
  font-size: 30px;
  line-height: 30px;
  font-weight: 700;
  margin: 0;
  padding: 0;
}

h2 {
  font-size: 20px;
  line-height: 24px;
  font-weight: 700;
  margin: 0;
  padding: 0;
}

h3 {
  font-size: 13px;
  line-height: 20px;
  font-weight: 700;
  margin: 0;
  padding: 0;
}

h4 {
  font-size: 13px;
  line-height: 20px;
  font-weight: 700;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
  letter-spacing: 2px;
}

p {
  font-size: 16px;
  line-height: 20px;
  font-weight: 400;
  margin: 0;
  padding: 0;
}

label {
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
  margin: 0;
  padding: 0;
}

ul {
  margin: 0;
  padding: 0;
}

li {
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
}

fieldset {
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  padding: 0 15px 30px 15px;
  margin: 15px 0 0 0;
}
fieldset legend {
  color: rgba(0, 0, 0, 0.5);
  font-size: 13px;
  line-height: 20px;
  padding: 0 5px;
}

.material-icon, .material-icons, .materials-icon, .materials-icons, .icon- {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "PANDA" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none !important;
  line-height: 1;
  /* Enable Ligatures ================ */
  letter-spacing: 0;
  -webkit-font-feature-settings: "liga";
  -moz-font-feature-settings: "liga=1";
  -moz-font-feature-settings: "liga";
  -ms-font-feature-settings: "liga" 1;
  font-feature-settings: "liga";
  -webkit-font-variant-ligatures: discretionary-ligatures;
  font-variant-ligatures: discretionary-ligatures;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.material-icon.iconXs, .material-icons.iconXs, .materials-icon.iconXs, .materials-icons.iconXs, .icon-.iconXs {
  font-size: 20px;
}
.material-icon.iconSm, .material-icons.iconSm, .materials-icon.iconSm, .materials-icons.iconSm, .icon-.iconSm {
  font-size: 24px;
}
.material-icon.iconMd, .material-icons.iconMd, .materials-icon.iconMd, .materials-icons.iconMd, .icon-.iconMd {
  font-size: 30px;
}
.material-icon.iconLg, .material-icons.iconLg, .materials-icon.iconLg, .materials-icons.iconLg, .icon-.iconLg {
  font-size: 50px;
}
.material-icon.iconXl, .material-icons.iconXl, .materials-icon.iconXl, .materials-icons.iconXl, .icon-.iconXl {
  font-size: 70px;
}

.noselect,
.noSelect {
  -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 */
}

input.boxButton, input.boxButtonIcon, textarea.boxButton, textarea.boxButtonIcon, select.boxButton, select.boxButtonIcon {
  -webkit-touch-callout: initial !important; /* iOS Safari */
  -webkit-user-select: initial !important; /* Safari */
  -khtml-user-select: initial !important; /* Konqueror HTML */
  -moz-user-select: initial !important; /* Firefox */
  -ms-user-select: initial !important; /* Internet Explorer/Edge */
  user-select: initial !important; /* Non-prefixed version, currently */
}

body.cornerSquaring .boxButton,
body.cornerSquaring .boxButtonIcon,
body.cornerSquaring .boxButtonGroup,
body.cornerSquaring .vodItem,
body.cornerSquaring .vodThumbnail,
body.cornerSquaring .itemImage,
body.cornerSquaring .itemPrice,
body.cornerSquaring .externalButton,
body.cornerSquaring .checkoutThumbnail,
body.cornerSquaring .scheduleItem,
body.cornerSquaring .scheduleImage,
body.cornerSquaring .downloadItem,
body.cornerSquaring .rangeSelection a,
body.cornerSquaring .progressBarBackground,
body.cornerSquaring .progressBarWrapper,
body.cornerSquaring .stateResultCard,
body.cornerSquaring .broadcastCard .cover img,
body.cornerSquaring .index,
body.cornerSquaring .dropdownChannels,
body.cornerSquaring .channelTile,
body.cornerSquaring .colorFade,
body.cornerSquaring .tileImage,
body.cornerSquaring .tileLogo,
body.cornerSquaring .badge,
body.cornerSquaring .broadcastListItem,
body.cornerSquaring .broadcastThumbnail,
body.cornerSquaring .pricingPackage,
body.cornerSquaring .channelMegaCard,
body.cornerSquaring .timers .days,
body.cornerSquaring .timers .hours,
body.cornerSquaring .timers .minutes,
body.cornerSquaring .timers .seconds,
body.cornerSquaring .timers .days span,
body.cornerSquaring .timers .hours span,
body.cornerSquaring .timers .minutes span,
body.cornerSquaring .timers .seconds span,
body.cornerSquaring .countdownBanners fieldset {
  border-radius: 0px !important;
}

.boxButton, .boxButtonIcon {
  cursor: pointer;
  height: 32px !important;
  min-width: 12px;
  border: solid 1px rgba(0, 0, 0, 0.15);
  border-radius: 5px;
  box-sizing: content-box;
  display: inherit;
  white-space: nowrap;
  letter-spacing: 0 !important;
  font-size: 13px !important;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: 32px;
  text-align: center;
  color: #222222;
  background-color: rgba(0, 0, 0, 0.05);
  padding: 0 10px;
  margin: 0 5px 0 0;
  transition: 0.2s;
  position: relative;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently */
}
.boxButton.twoLines, .boxButtonIcon.twoLines {
  line-height: 16px;
}
.boxButton option, .boxButtonIcon option {
  color: black !important;
}
@media (hover: hover) {
  .boxButton:hover, .boxButtonIcon:hover {
    color: #222222;
    border-color: #222222;
  }
}
.boxButton.active, .boxButtonIcon.active {
  color: #222222;
  border-color: #222222;
}
.boxButton.dark, .boxButtonIcon.dark {
  border: solid 1px rgba(255, 255, 255, 0.15);
  background-color: rgba(255, 255, 255, 0.15);
  color: #FFFFFF !important;
}
.boxButton.dark option, .boxButtonIcon.dark option {
  color: black !important;
}
@media (hover: hover) {
  .boxButton.dark:hover, .boxButtonIcon.dark:hover {
    color: #FFFFFF;
    border-color: #FFFFFF;
  }
}
.boxButton.dark.active, .boxButtonIcon.dark.active {
  color: #FFFFFF;
  border-color: #FFFFFF;
}
.boxButton.dark.opaque, .boxButtonIcon.dark.opaque {
  background-color: #222222;
}
.boxButton.disabled, .boxButtonIcon.disabled {
  cursor: not-allowed;
  color: rgba(0, 0, 0, 0.3);
}
@media (hover: hover) {
  .boxButton.disabled:hover, .boxButtonIcon.disabled:hover {
    color: rgba(0, 0, 0, 0.3);
    border-color: inherit;
  }
}
.boxButton.disabled.dark, .boxButtonIcon.disabled.dark {
  color: rgba(255, 255, 255, 0.15) !important;
}
.boxButton.pandaAccent1Hover:hover, .boxButtonIcon.pandaAccent1Hover:hover {
  color: #222222;
  background: #13eaad;
  border-color: #13eaad;
}
.boxButton.pandaAccent2Hover:hover, .boxButtonIcon.pandaAccent2Hover:hover {
  color: #FFFFFF;
  background: #8641f2;
  border-color: #8641f2;
}
.boxButton.pandaAccent3Hover:hover, .boxButtonIcon.pandaAccent3Hover:hover {
  color: #FFFFFF;
  background: #158EFC;
  border-color: #158EFC;
}
.boxButton.pandaRedHover:hover, .boxButtonIcon.pandaRedHover:hover {
  color: #FFFFFF;
  background: #F71E33;
  border-color: #F71E33;
}
.boxButton.pandaGreenHover:hover, .boxButtonIcon.pandaGreenHover:hover {
  color: #FFFFFF;
  background: #10BF89;
  border-color: #10BF89;
}
.boxButton.highlighted, .boxButtonIcon.highlighted {
  color: #FFFFFF;
}
.boxButton.lowlighted, .boxButtonIcon.lowlighted {
  color: #222222;
}
.boxButton.highlighted.primary, .boxButton.lowlighted.primary, .boxButtonIcon.highlighted.primary, .boxButtonIcon.lowlighted.primary {
  background: #222222;
  border-color: #222222;
  color: #FFFFFF;
}
@media (hover: hover) {
  .boxButton.highlighted.primary:hover, .boxButton.lowlighted.primary:hover, .boxButtonIcon.highlighted.primary:hover, .boxButtonIcon.lowlighted.primary:hover {
    background: #111111;
    border-color: #111111;
  }
}
.boxButton.highlighted.primary.dark, .boxButton.lowlighted.primary.dark, .boxButtonIcon.highlighted.primary.dark, .boxButtonIcon.lowlighted.primary.dark {
  background: #FFFFFF;
  border-color: #FFFFFF;
  color: #222222;
}
@media (hover: hover) {
  .boxButton.highlighted.primary.dark:hover, .boxButton.lowlighted.primary.dark:hover, .boxButtonIcon.highlighted.primary.dark:hover, .boxButtonIcon.lowlighted.primary.dark:hover {
    border-color: #FFFFFF;
  }
}
.boxButton.highlighted.pandaAccent1, .boxButton.lowlighted.pandaAccent1, .boxButtonIcon.highlighted.pandaAccent1, .boxButtonIcon.lowlighted.pandaAccent1 {
  background: #13eaad;
  border-color: #13eaad;
}
@media (hover: hover) {
  .boxButton.highlighted.pandaAccent1:hover, .boxButton.lowlighted.pandaAccent1:hover, .boxButtonIcon.highlighted.pandaAccent1:hover, .boxButtonIcon.lowlighted.pandaAccent1:hover {
    border-color: #13eaad;
  }
}
.boxButton.highlighted.pandaAccent2, .boxButton.lowlighted.pandaAccent2, .boxButtonIcon.highlighted.pandaAccent2, .boxButtonIcon.lowlighted.pandaAccent2 {
  background: #8641f2;
  border-color: #8641f2;
}
@media (hover: hover) {
  .boxButton.highlighted.pandaAccent2:hover, .boxButton.lowlighted.pandaAccent2:hover, .boxButtonIcon.highlighted.pandaAccent2:hover, .boxButtonIcon.lowlighted.pandaAccent2:hover {
    border-color: #8641f2;
  }
}
.boxButton.highlighted.pandaAccent3, .boxButton.lowlighted.pandaAccent3, .boxButtonIcon.highlighted.pandaAccent3, .boxButtonIcon.lowlighted.pandaAccent3 {
  background: #158EFC;
  border-color: #158EFC;
}
@media (hover: hover) {
  .boxButton.highlighted.pandaAccent3:hover, .boxButton.lowlighted.pandaAccent3:hover, .boxButtonIcon.highlighted.pandaAccent3:hover, .boxButtonIcon.lowlighted.pandaAccent3:hover {
    border-color: #158EFC;
  }
}
.boxButton.highlighted.pandaRed, .boxButton.lowlighted.pandaRed, .boxButtonIcon.highlighted.pandaRed, .boxButtonIcon.lowlighted.pandaRed {
  background: #F71E33;
  border-color: #F71E33;
}
@media (hover: hover) {
  .boxButton.highlighted.pandaRed:hover, .boxButton.lowlighted.pandaRed:hover, .boxButtonIcon.highlighted.pandaRed:hover, .boxButtonIcon.lowlighted.pandaRed:hover {
    border-color: #F71E33;
  }
}
.boxButton.highlighted.pandaGreen, .boxButton.lowlighted.pandaGreen, .boxButtonIcon.highlighted.pandaGreen, .boxButtonIcon.lowlighted.pandaGreen {
  background: #10BF89;
  border-color: #10BF89;
}
@media (hover: hover) {
  .boxButton.highlighted.pandaGreen:hover, .boxButton.lowlighted.pandaGreen:hover, .boxButtonIcon.highlighted.pandaGreen:hover, .boxButtonIcon.lowlighted.pandaGreen:hover {
    border-color: #10BF89;
  }
}
.boxButton.ghost.pandaAccent1, .boxButtonIcon.ghost.pandaAccent1 {
  color: #222222;
  background: rgba(19, 234, 173, 0.3);
  border-color: #13eaad;
}
.boxButton.ghost.pandaAccent1.dark, .boxButtonIcon.ghost.pandaAccent1.dark {
  color: #FFFFFF !important;
}
.boxButton.ghost.pandaAccent2, .boxButtonIcon.ghost.pandaAccent2 {
  color: #222222;
  background: rgba(134, 65, 242, 0.3);
  border-color: #8641f2;
}
.boxButton.ghost.pandaAccent2.dark, .boxButtonIcon.ghost.pandaAccent2.dark {
  color: #FFFFFF !important;
}
.boxButton.ghost.pandaAccent3, .boxButtonIcon.ghost.pandaAccent3 {
  color: #222222;
  background: rgba(21, 142, 252, 0.3);
  border-color: #158EFC;
}
.boxButton.ghost.pandaAccent3.dark, .boxButtonIcon.ghost.pandaAccent3.dark {
  color: #FFFFFF !important;
}
.boxButton.ghost.pandaRed, .boxButtonIcon.ghost.pandaRed {
  color: #222222;
  background: rgba(247, 30, 51, 0.3);
  border-color: #F71E33;
}
.boxButton.ghost.pandaRed.dark, .boxButtonIcon.ghost.pandaRed.dark {
  color: #FFFFFF !important;
}
.boxButton.ghost.pandaGreen, .boxButtonIcon.ghost.pandaGreen {
  color: #222222;
  background: rgba(16, 191, 137, 0.3);
  border-color: #10BF89;
}
.boxButton.ghost.pandaGreen.dark, .boxButtonIcon.ghost.pandaGreen.dark {
  color: #FFFFFF !important;
}
.boxButton .appIcon, .boxButtonIcon .appIcon {
  width: 34px;
  border-radius: 4px;
  float: left;
  margin: -1px 10px 0 -8px;
}

.radioWrapper,
.checkboxWrapper {
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.05);
  margin-bottom: 5px;
  min-height: 32px;
  display: flex;
  flex-direction: row;
  cursor: pointer;
  display: inline-flex;
  padding-right: 10px;
}
.radioWrapper:focus,
.checkboxWrapper:focus {
  border-color: #222222;
  transition: 0.2s ease-in-out;
}
@media (hover: hover) {
  .radioWrapper:hover,
  .checkboxWrapper:hover {
    border-color: #222222;
    transition: 0.2s ease-in-out;
  }
}
.radioWrapper label,
.checkboxWrapper label {
  padding: 6px 0;
  line-height: 20px !important;
}
.radioWrapper input,
.checkboxWrapper input {
  opacity: 0.01;
  /* Base for label styling */
  /* checkbox aspect */
  /* checked mark aspect */
  /* checked mark aspect changes */
  /* Accessibility */
}
.radioWrapper input[type=radio]:not(:checked), .radioWrapper input[type=checkbox]:not(:checked), .radioWrapper input[type=radio]:checked, .radioWrapper input[type=checkbox]:checked,
.checkboxWrapper input[type=radio]:not(:checked),
.checkboxWrapper input[type=checkbox]:not(:checked),
.checkboxWrapper input[type=radio]:checked,
.checkboxWrapper input[type=checkbox]:checked {
  position: absolute;
  left: 0;
  opacity: 0.01;
}
.radioWrapper input[type=radio]:not(:checked) + label, .radioWrapper input[type=checkbox]:not(:checked) + label, .radioWrapper input[type=radio]:checked + label, .radioWrapper input[type=checkbox]:checked + label,
.checkboxWrapper input[type=radio]:not(:checked) + label,
.checkboxWrapper input[type=checkbox]:not(:checked) + label,
.checkboxWrapper input[type=radio]:checked + label,
.checkboxWrapper input[type=checkbox]:checked + label {
  color: #222222;
  line-height: 32px;
  position: relative;
  padding-left: 34px;
  cursor: pointer;
  width: 100%;
  text-align: left;
}
.radioWrapper input[type=radio]:not(:checked) + label:before, .radioWrapper input[type=checkbox]:not(:checked) + label:before, .radioWrapper input[type=radio]:checked + label:before, .radioWrapper input[type=checkbox]:checked + label:before,
.checkboxWrapper input[type=radio]:not(:checked) + label:before,
.checkboxWrapper input[type=checkbox]:not(:checked) + label:before,
.checkboxWrapper input[type=radio]:checked + label:before,
.checkboxWrapper input[type=checkbox]:checked + label:before {
  content: "";
  position: absolute;
  left: 4px;
  top: 4px;
  width: 24px;
  height: 24px;
  background: rgba(0, 0, 0, 0.05);
  border-radius: 3px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.radioWrapper input[type=radio]:not(:checked) + label:after, .radioWrapper input[type=checkbox]:not(:checked) + label:after, .radioWrapper input[type=radio]:checked + label:after, .radioWrapper input[type=checkbox]:checked + label:after,
.checkboxWrapper input[type=radio]:not(:checked) + label:after,
.checkboxWrapper input[type=checkbox]:not(:checked) + label:after,
.checkboxWrapper input[type=radio]:checked + label:after,
.checkboxWrapper input[type=checkbox]:checked + label:after {
  font-family: "PANDA";
  content: "\e917";
  position: absolute;
  top: 0;
  left: 4px;
  font-size: 24px;
  line-height: 32px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.radioWrapper input[type=radio]:not(:checked) + label:after, .radioWrapper input[type=checkbox]:not(:checked) + label:after,
.checkboxWrapper input[type=radio]:not(:checked) + label:after,
.checkboxWrapper input[type=checkbox]:not(:checked) + label:after {
  opacity: 0;
  -webkit-transform: scale(0) rotate(45deg);
  transform: scale(0) rotate(45deg);
}
.radioWrapper input[type=radio]:checked + label:after, .radioWrapper input[type=checkbox]:checked + label:after,
.checkboxWrapper input[type=radio]:checked + label:after,
.checkboxWrapper input[type=checkbox]:checked + label:after {
  opacity: 1;
  -webkit-transform: scale(1) rotate(0);
  transform: scale(1) rotate(0);
}
.radioWrapper input[type=radio]:checked:focus + label:before, .radioWrapper input[type=checkbox]:checked:focus + label:before, .radioWrapper input[type=radio]:not(:checked):focus + label:before, .radioWrapper input[type=checkbox]:not(:checked):focus + label:before,
.checkboxWrapper input[type=radio]:checked:focus + label:before,
.checkboxWrapper input[type=checkbox]:checked:focus + label:before,
.checkboxWrapper input[type=radio]:not(:checked):focus + label:before,
.checkboxWrapper input[type=checkbox]:not(:checked):focus + label:before {
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.15);
}
.radioWrapper.dark,
.checkboxWrapper.dark {
  border-color: rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.15);
}
.radioWrapper.dark:focus,
.checkboxWrapper.dark:focus {
  border-color: #FFFFFF;
}
@media (hover: hover) {
  .radioWrapper.dark:hover,
  .checkboxWrapper.dark:hover {
    border-color: #FFFFFF;
  }
}
.radioWrapper.dark input,
.checkboxWrapper.dark input {
  /* checkbox aspect */
  /* Accessibility */
}
.radioWrapper.dark input[type=radio]:not(:checked) + label, .radioWrapper.dark input[type=checkbox]:not(:checked) + label, .radioWrapper.dark input[type=radio]:checked + label, .radioWrapper.dark input[type=checkbox]:checked + label,
.checkboxWrapper.dark input[type=radio]:not(:checked) + label,
.checkboxWrapper.dark input[type=checkbox]:not(:checked) + label,
.checkboxWrapper.dark input[type=radio]:checked + label,
.checkboxWrapper.dark input[type=checkbox]:checked + label {
  color: #FFFFFF;
}
.radioWrapper.dark input[type=radio]:not(:checked) + label:before, .radioWrapper.dark input[type=checkbox]:not(:checked) + label:before, .radioWrapper.dark input[type=radio]:checked + label:before, .radioWrapper.dark input[type=checkbox]:checked + label:before,
.checkboxWrapper.dark input[type=radio]:not(:checked) + label:before,
.checkboxWrapper.dark input[type=checkbox]:not(:checked) + label:before,
.checkboxWrapper.dark input[type=radio]:checked + label:before,
.checkboxWrapper.dark input[type=checkbox]:checked + label:before {
  background: rgba(255, 255, 255, 0.15);
}
.radioWrapper.dark input[type=radio]:checked:focus + label:before, .radioWrapper.dark input[type=checkbox]:checked:focus + label:before, .radioWrapper.dark input[type=radio]:not(:checked):focus + label:before, .radioWrapper.dark input[type=checkbox]:not(:checked):focus + label:before,
.checkboxWrapper.dark input[type=radio]:checked:focus + label:before,
.checkboxWrapper.dark input[type=checkbox]:checked:focus + label:before,
.checkboxWrapper.dark input[type=radio]:not(:checked):focus + label:before,
.checkboxWrapper.dark input[type=checkbox]:not(:checked):focus + label:before {
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.15);
}

input.boxButton,
select.boxButton {
  text-align: left;
  font-weight: 400;
}

input.boxButton,
textarea.boxButton {
  cursor: text;
}
input.boxButton::placeholder,
textarea.boxButton::placeholder {
  color: rgba(0, 0, 0, 0.5) !important;
}
input.boxButton.dark::placeholder,
textarea.boxButton.dark::placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}

textarea.boxButton {
  white-space: normal;
  line-height: 20px;
  padding: 7px 10px !important;
}

select.boxButton {
  width: calc(100% - 20px);
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg id='selectArrow' data-name='Select Arrow' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='rgba(0,0,0,.3)' d='M16.59,8.3,12,12.88,7.41,8.3,6,9.7l6,6,6-6Z'/></svg>");
  background-repeat: no-repeat;
  background-position-x: 100%;
  background-position-y: 0px;
}
select.boxButton.filter {
  width: auto;
}
select.boxButton.dark {
  background-image: url("data:image/svg+xml;utf8,<svg id='selectArrow' data-name='Select Arrow' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='rgba(255,255,255,.3)' d='M16.59,8.3,12,12.88,7.41,8.3,6,9.7l6,6,6-6Z'/></svg>");
}

input[type=submit] {
  font-weight: 700;
  cursor: pointer;
}

.boxButtonIcon {
  padding: 0;
}
.boxButtonIcon i {
  font-size: 24px;
  line-height: inherit;
  float: left;
  padding: 0 4px;
}
.boxButtonIcon i.pandaAccent1 {
  color: #13eaad;
}
.boxButtonIcon i.pandaAccent2 {
  color: #8641f2;
}
.boxButtonIcon i.pandaAccent3 {
  color: #158EFC;
}
.boxButtonIcon i.pandaRed {
  color: #F71E33;
}
.boxButtonIcon i.pandaGreen {
  color: #10BF89;
}
.boxButtonIcon.iconLeft {
  padding: 0 10px 0 0;
}
.boxButtonIcon.iconRight {
  padding: 0 0 0 10px;
}
.boxButtonIcon.iconRight i {
  float: right;
}
.boxButtonIcon.iconBoth {
  padding: 0;
}
.boxButtonIcon.iconBoth i:nth-child(2) {
  float: right;
  border-left: 1px solid rgba(0, 0, 0, 0.15);
  margin-left: 10px;
}
.boxButtonIcon.dark.iconBoth i:nth-child(2) {
  border-left-color: rgba(255, 255, 255, 0.15);
}

.boxButtonGroup {
  display: inline-flex;
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: rgba(0, 0, 0, 0.05);
  border-radius: 5px;
  height: 32px;
  width: 64px;
}
.boxButtonGroup.dark {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.3);
}
.boxButtonGroup.dark .boxButton:not(:last-child)::after {
  background: rgba(255, 255, 255, 0.3);
}
.boxButtonGroup .boxButton {
  background: none;
  margin: -1px;
  border-color: transparent;
}
.boxButtonGroup .boxButton:not(:last-child)::after {
  content: "";
  height: 32px;
  width: 1px;
  background: rgba(0, 0, 0, 0.15);
  position: absolute;
  top: 0;
  right: -1px;
}
.boxButtonGroup .boxButton:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: -1px;
}
.boxButtonGroup .boxButton:last-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: 0;
}

.boxButtonGroup .boxButton {
  margin-right: 0;
}
.boxButtonGroup .boxButton:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.boxButtonGroup .boxButton:last-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/*# sourceMappingURL=basic_buttons.css.map */