/*********************************************** FONTS ***********************************************/
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 300;
  src: url('/web/css/fonts/raleway/300.woff') format('woff');
}

@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('/web/css/fonts/raleway/400.woff') format('woff');
}

@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  src: url('/web/css/fonts/raleway/500.woff') format('woff');
}

@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  src: url('/web/css/fonts/raleway/600.woff') format('woff');
}

@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 800;
  src: url('/web/css/fonts/raleway/800.woff') format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 500;
  src: url('/web/css/fonts/lato/500.woff') format('woff');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 800;
  src: url('/web/css/fonts/lato/800.woff') format('woff');
}

/*********************************************** RESET ***********************************************/
*:focus {
  outline: none;
}

*:not(.selectable):not(input):not(textarea) {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.selectable {
  -webkit-touch-callout: text;
  -webkit-user-select: text;
  -khtml-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

input, textarea {
  background: none;
  border: none;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
}

textarea {
  resize: none;
}

input:-webkit-autofill {
  -webkit-text-fill-color: white;
  -webkit-box-shadow: 0 0 0px 350px rgb(38, 40, 44) inset;
  filter: none;
}

.pebbleOuter_medium_plan input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 350px rgb(43, 45, 49) inset !important;
}

.pebbleOuter_medium_boutique input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 350px rgb(43, 45, 49) inset !important;
}

input[type=text]::-ms-clear {
  display: none;
}

input:invalid {
  border: none;
  box-shadow: none;
}

button {
  border: 0;
  margin: 0;
  padding: 0;
  background: none;
}

button::-moz-focus-inner {
  border: 0;
}

input::-webkit-input-placeholder {
  color: rgb(188, 190, 194);
}

input:-moz-placeholder {
  color: rgb(188, 190, 194);
}

input::-moz-placeholder {
  color: rgb(188, 190, 194);
}

input:-ms-input-placeholder {
  color: rgb(188, 190, 194);
}

svg {
  /* Svg rendering fix for Firefox and Edge */
  overflow: visible !important;
}

.fb_black {
  color: white !important;
}

.fb_blue {
  color: rgb(4, 110, 228) !important;
}

.fb_bold {
  font-weight: 800;
}

/*********************************************** RECAPTCHA ***********************************************/

.grecaptcha-badge { visibility: hidden; }

#reCAPTCHA_ctr {
  padding-top: 20px;
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 849px) {
  #reCAPTCHA_ctr {
    padding: 20px 0;
  }
}

#reCAPTCHA_ctr span {
  display: block;
  line-height: 18px;
  margin-right: 10px;
  font-size: 11px;
  color: white;
  font-weight: 500;
  word-break: break-word;
}

#reCAPTCHA_ctr a {
  text-decoration: none;
  display: block;
  line-height: 18px;
  margin-right: 10px;
  font-size: 11px;
  color: rgb(4, 110, 228);
  font-weight: 500;
  word-break: break-word;
}

#reCAPTCHA_ctr a:hover {
  text-decoration: underline;
}

/*********************************************** APP CORE ***********************************************/

* {
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  font-family: "Raleway", "Helvetica", "Arial", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-variant-numeric: lining-nums;
  -webkit-font-feature-settings: 'lnum'1;
  -moz-font-feature-settings: 'lnum';
  font-feature-settings: 'lnum'1;
}

html {
  width: 100vw;
  height: 100%;
  overflow: hidden;
}

#app {
  width: 100vw;
  height: 100%;
  background: rgb(38, 40, 44);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.embed_app {
  width: calc(100vw - 2px) !important;
  height: calc(100% - 2px) !important;
  background: rgba(255,255,255,0) !important;
  border: 1px solid rgb(48, 51, 56) !important;
  border-radius: 7px;
}

#topZone, #topZone_no-border, #topZone_home {
  position: relative;
  z-index: 9;
  max-height: 64px;
  background: rgb(38, 40, 44);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#topZone_home {
  position: fixed;
  height: 64px;
  width: 100%;
  background: none;
  transition: background 1s ease, box-shadow 1s ease;
}

.topZone_translucent {
  background: rgba(48, 51, 56, 0.8) !important;
  box-shadow: 0px 0px 8px rgba(8,8,8,.48) !important;
  backdrop-filter: blur(16px) !important;
}

#topZone_leftWrapper {
  padding: 0px 20px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

@media screen and (min-width: 850px) {
  #topZone, #topZone_no-border, #topZone_home {
    flex: 1 0 64px;
    border-bottom: 1px solid rgb(38, 40, 44);
    box-shadow: 0px 0px 4px rgba(8,8,8,.48);
  }

  #topZone_no-border, #topZone_home {
    border-bottom: none;
    box-shadow: none;
  }

  #topZone_centerWrapper {
    flex-grow: 1;
  }

  #topZone_rightWrapper {
    position: relative;
    z-index: 3;
    padding-right: 20px;
    display: flex;
    align-items: center;
  }
}

@media screen and (max-width: 849px) {

  #app:not(.embed_app) {
    height: calc(100% + env(safe-area-inset-top));
  }

  #topZone, #topZone_no-border, #topZone_home {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 64px;
    padding-top: env(safe-area-inset-top);
    box-shadow: 0px 2px 5px rgba(8,8,8,.28);
    overflow: auto;
  }

  #topZone_no-border {
    box-shadow: none;
  }

  #topZone_leftWrapper {
    padding: 0px 15px;
  }

  #topZone_centerWrapper {
    flex-grow: 1;
    display: flex;
    justify-content: flex-end;
  }

  #topZone_rightWrapper {
    position: relative;
    z-index: 3;
    padding-right: 15px;
    display: flex;
    align-items: center;
  }
}

#coreZone {
  flex: 1;
  height: 100%;
  display: flex;
  overflow: hidden;
}

@media screen and (max-width: 849px) {

  #coreZone {
    position: relative;
    padding-top: calc(64px + env(safe-area-inset-top));
  }

  .embed_app #coreZone {
    padding-top: 0px;
  }
}

.embed_app #coreZone {
  background: rgb(38, 40, 44);
}

#coreZone_leftBlock_wrapper {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  width: 300px;
  background: rgb(48, 51, 56);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  display: flex;
  flex-direction: column;
}

@media screen and (max-width: 849px) {
  #coreZone_leftBlock_wrapper {
    width: 0;
  }
}

#coreZone_leftBlock {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
}

#coreZone_rightBlock_wrapper {
  position: relative;
  flex-grow: 1;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.lock {
  overflow: hidden !important;
}

#coreZone_rightBlock {
  height: 100%;
}

#app_zone_wrapper {
  flex-grow: 1;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.appPageTitleCtr {
  width: 100%;
  padding: 30px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.appPageTitle_leftZone, .appPageTitle_rightZone {
  display: flex;
  align-items: center;
}

.appPageTitle_rightZone {
  flex-wrap: wrap;
}

.app_bigTitle_link {
  text-decoration: none;
  word-break: break-word;
  display: flex;
  align-items: center;
}

.app_bigTitle_link:hover {
  color: rgb(24, 130, 248);
}

.app_bigTitle {
  line-height: 25px;
  margin: 7.5px 30px 7.5px 0px;
  color: white;
  font-size: 24px;
  font-weight: 800;
}

.app_bigTitle_link>svg {
  flex-shrink: 0;
  display: block;
  margin-right: 10px;
}

.app_bigTitle_link:hover svg {
  cursor: pointer;
  fill: rgb(4, 110, 228);
}

#fb_orientation_info_ctr {
  display: none;
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: rgb(38, 40, 44);
  padding-right: env(safe-area-inset-right);
  padding-left: env(safe-area-inset-left);
  box-sizing: border-box;
}

#fb_orientation_info {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#fb_orientation_info span {
  line-height: 34px;
  color: white;
  font-size: 22px;
  font-weight: 400;
  text-align: center;
}

/*********************************************** BOTTOM APP INFO ZONE ***********************************************/
#bottomAppInfoZone {
  position: relative;
  z-index: 2;
}

#acceptCookies_infoZone {
  padding: 7.5px 30px;
  box-sizing: border-box;
  background: rgb(48, 51, 56);
  border-top: 1px solid rgb(38, 41, 46);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

@media screen and (max-width: 849px) {

  @media only screen and (orientation: portrait) {
    #acceptCookies_infoZone {
      padding-bottom: calc(7.5px + env(safe-area-inset-bottom));
    }
  }
}

.appInfoZoneLeft {
  width: 80%;
  margin: 0px 5px;
}

.appInfoZoneLeft span, .appInfoZoneLeft a {
  line-height: 22px;
  color: white;
  font-size: 13px;
  font-weight: 500;
}

.appInfoZoneLeft a {
  text-decoration: none;
}

.appInfoZoneLeft a:hover {
  color: rgb(24, 130, 247);
}

.appInfoZoneRight {
  width: 180px;
}

/*********************************************** FIDBAK PLAYER ***********************************************/
#fbap {
  position: relative;
  z-index: 7;
  height: 0px;
  background: rgb(38, 40, 44);
  transition: height 0.5s ease-in-out;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

[data-fbap_format=low] {
  height: 64px !important;
  border-top: 1px solid rgb(48, 51, 56) !important;
}

[data-fbap_format=medium] {
  height: 240px !important;
  border-top: 1px solid rgb(48, 51, 56) !important;
}

[data-fbap_embed=true][data-fbap_format=high].fbap_notopborder {
  border-top: none !important;
}

#fb_audio_error_ctr {
  display: none;
}

#fb_audio_error_outer {
  position: absolute;
  z-index: 4;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  padding: 15px;
  box-sizing: border-box;
  background: rgb(38, 40, 44);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

#fb_audio_error_inner {
  max-width: 450px;
  text-align: center;
}

#fb_audio_error_outer span {
  line-height: 25px;
  margin: 15px 0px;
  color: white;
  font-size: 16px;
  font-weight: 800;
}

#fbap_topZone {
  flex: 0 0 65px;
  padding: 7.5px 10px 7.5px 7.5px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#fbap_mobile_ui_artwork_and_controls {
  flex: 1 0 auto;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

#fbap_topZone_l {
  min-width: 0;
  display: flex;
  align-items: center;
}

#fbap_artworkZone {
  flex-shrink: 0;
  position: relative;
  width: 50px;
  height: 50px;
  margin-right: 10px;
  border-radius: 4px;
  overflow: hidden;
}

#fbap_mobile_ui_artworkZone {
  position: relative;
  margin: 0px 15px;
  border-radius: 7px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

[data-fbap_format=low] #fbap_mobile_ui_artworkZone {
  height: auto;
}

[data-fbap_embed=true] #fbap_mobile_ui_artworkZone {
  flex-grow: 1;
  margin: 0;
  border-radius: 0px;
}

#fbap_artworkCtr, #fbap_mobile_ui_artworkCtr {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#fbap_artwork, #fbap_mobile_ui_artwork {
  position: relative;
  width: 100%;
  height: 100%;
}

#fbap_mobile_ui_artwork .fb-bg_img {
  background-position: top !important;
}

#fbap_artwork .fb-bg_img {
  border-radius: 0px;
}

#fbap_defaultCover {
  position: relative;
  width: 100%;
  height: 100%;
  background: rgb(48, 51, 56);
}

#fbap_defaultCover svg {
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: calc(50% - 15px);
  left: calc(50% - 15px);
}

#fbap_mobile_ui_defaultCover {
  flex: 1;
  position: relative;
  width: 100%;
  height: 100%;
  background: url('/web/files/img/sys_icons/fbap_mobile_default_cover_darkMode.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  overflow: hidden;
}

[data-fbap_embed=false] #fbap_mobile_ui_defaultCover {
  border-radius: 7px;
}

.fbap_trackInfoZone {
  min-width: 0;
  margin-right: 10px;
}

.fbap_trackName, .fbap_playerName {
  text-decoration: none;
  display: block;
  padding-bottom: 2px;
  color: white;
  font-size: 13.5px;
  font-weight: 800;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.fbap_playerName {
  font-size: 12px;
  font-weight: 500;
}

#fbap_topZone_r {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

#fbap_topZone_r svg {
  fill: white;
}

.fbap_miniBtn, .fbap_mui_controlBtn {
  position: relative;
  flex-shrink: 0;
  border-radius: 50%;
  border: 1px solid rgb(58, 61, 65);
  cursor: pointer;
  -webkit-animation: border-radius 0.25s ease;
  animation: border-radius 0.25s ease;
}

.fbap_mui_controlBtn {
  margin: 0px 8px;
}

.fbap_miniBtn {
  position: relative;
  background: rgb(38, 40, 44);
  margin-left: 10px;
}

.fbap_miniBtn svg, .fbap_mui_controlBtn svg, .embed_ext_link svg {
  flex-shrink: 0;
  display: block;
}

.fbap_miniBtn_borderAnim {
  border-radius: 7px;
  -webkit-animation: border-radius 0.25s ease;
  animation: border-radius 0.25s ease;
}

.embed_fb_logo {
  text-decoration: none;
  margin-left: 10px;
}

.embed_fb_logo svg {
  flex-shrink: 0;
  display: block;
}

.embed_fb_logo:hover svg {
  fill: white;
}

.embed_ext_link {
  flex-shrink: 0;
  display: block;
  text-decoration: none;
  margin-left: 10px;
  cursor: pointer;
}

#fbap_waveform {
  position: relative;
  height: 70px;
  padding: 2.5px 0px;
}

#waveform_top_c, #waveform_mid_c, #waveform_bot_c, #waveform_top, #waveform_mid, #waveform_bot {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#waveform_top, #waveform_mid, #waveform_bot {
  background-repeat: no-repeat;
  background-size: cover;
}

#waveform_top, #waveform_mid {
  width: 0;
}

#waveform_bot {
  width: 100%;
}

#fbap_timers_and_specs {
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

[data-fbap_embed=true] #fbap_timers_and_specs{
  height: 30px;
}

#fbap_currentTime_wrapper, #fbap_audioSpecs, #fbap_duration {
  flex: 1;
}

#fbap_audioSpecs {
  color: rgb(4, 110, 228);
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
}

#fbap_duration {
  color: white;
  font-size: 11px;
  font-weight: 600;
  text-align: right;
}

#fbap_currentTime {
  display: block;
  width: 50px;
  color: white;
  font-size: 11px;
  font-weight: 600;
}

[data-fbap_embed=true] #fbap_audioSpecs, [data-fbap_embed=true] #fbap_currentTime, [data-fbap_embed=true] #fbap_duration{
  font-size: 10px;
}

.fbap_answer_comment_zone_ctr {
  display: none;
}

#fbap_write_comment_zone, .fbap_answer_comment_zone {
  flex-shrink: 0;
  position: relative;
  z-index: 1;
  background: rgb(48, 51, 56);
  display: flex;
  align-items: center;
}

.fbap_answer_comment_zone {
  margin-top: 15px;
}

@media screen and (max-width: 849px) {
  .fbap_answer_comment_zone {
    padding-bottom: env(safe-area-inset-bottom);
  }
}

[name=fbap_write_comment_ta], [name=fbap_answer_comment_ta] {
  flex-grow: 1;
  height: 50px;
  padding: 15px 10px;
  box-sizing: border-box;
  line-height: 20px;
  color: white;
  font-size: 14px;
  font-weight: 500;
}

[name=fbap_write_comment_ta]::-webkit-input-placeholder, [name=fbap_answer_comment_ta]::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: rgb(188, 190, 194);
}

[name=fbap_write_comment_ta]:-moz-placeholder, [name=fbap_answer_comment_ta]:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: rgb(188, 190, 194);
  opacity: 1;
}

[name=fbap_write_comment_ta]::-moz-placeholder, [name=fbap_answer_comment_ta]::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: rgb(188, 190, 194);
  opacity: 1;
}

[name=fbap_write_comment_ta]:-ms-input-placeholder, [name=fbap_answer_comment_ta]:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: rgb(188, 190, 194);
}

.fbap_post_comment_btn {
  align-self: flex-end;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.fbap_post_comment_btn svg {
  flex-shrink: 0;
  display: block;
}

.fbap_volume {
  display: flex;
  align-items: center;
}

.fbap_volumeSliderCtr {
  position: relative;
  z-index: 1;
  width: 0;
  height: 36px;
  overflow: hidden;
}

.fbap_volumeSlider {
  position: absolute;
  z-index: 2;
  left: 0;
  top: calc(50% - 2px);
  width: calc(100% - 15px);
  height: 4px;
  background: white;
  border-radius: 4px;
}

.fbap_volumeSlider_setter {
  position: absolute;
  z-index: 3;
  left: 0;
  top: calc(50% - 6px);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgb(4, 110, 228);
}

#fbap_volume_muted {
    display: none;
}

#fbap_timeSliderCtr {
  position: relative;
  z-index: 1;
  height: 40px;
  margin: 0px 15px;
  overflow: hidden;
  cursor: pointer;
}

[data-fbap_embed=true] #fbap_timeSliderCtr {
  height: 25px;
}

#fbap_timeSlider {
  position: absolute;
  z-index: 2;
  left: 0;
  top: calc(50% - 1px);
  width: 100%;
  height: 2px;
  background: rgb(48, 50, 54);
  border-radius: 3px;
}

#fbap_timeSlider_setter {
  position: absolute;
  z-index: 3;
  left: 0;
  top: calc(50% - 6px);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgb(78, 80, 84);
}

[data-fbap_embed=true] #fbap_timeSlider{
  top: calc(50% - 0.5px);
  height: 1px;
}

[data-fbap_embed=true] #fbap_timeSlider_setter{
  top: calc(50% - 5px);
  width: 10px;
  height: 10px;
}

#fbap_mobile_ui_controls {
  padding: 30px 15px 8px 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

#fbap_mobile_ui_controls svg {
  fill: white;
}

[data-fbap_embed=true] #fbap_mobile_ui_controls {
  padding: 10px 15px 0px 15px;
}

#fbap_mobile_ui_controls_z2_ctr {
  display: none;
  width: 100%;
  margin-top: 20px;
}

#fbap_mobile_ui_controls_z2 {
  display: flex;
  align-items: center;
  justify-content: center;
}

.fbap_mui_controlBtn.fbap_mui_pause {
  display: none;
}

.fbap_mui_controlBtn.fbap_mui_play, .fbap_mui_controlBtn.fbap_mui_pause, .fbap_mui_controlBtn.fbap_mui_play svg, .fbap_mui_controlBtn.fbap_mui_pause svg {
  width: 75px;
  height: 75px;
}

[data-fbap_embed=true] .fbap_mui_controlBtn.fbap_mui_play, [data-fbap_embed=true] .fbap_mui_controlBtn.fbap_mui_pause, [data-fbap_embed=true] .fbap_mui_controlBtn.fbap_mui_play svg, [data-fbap_embed=true] .fbap_mui_controlBtn.fbap_mui_pause svg {
  width: 70px;
  height: 70px;
}

.fbap_comments_nbr {
  position: absolute;
  top: -8px;
  right: -8px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  background: rgb(4, 110, 228);
  border-radius: 50%;
  color: white;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  overflow: hidden;
}

.comment_block_header {
  position: relative;
  padding: 0px 15px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.comment_block_header_avatarBlock {
  position: relative;
}

.comment_block_header_avatarCtr {
  position: relative;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
}

.comment_block_header_avatar {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.comment_block_header_rightZone {
  margin-left: 10px;
}

.comment_block_header_username {
  display: block;
  margin-bottom: 3px;
  color: white;
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.comment_block_header_date {
  display: block;
  color: rgb(108, 110, 114);
  font-size: 10px;
  font-weight: 600;
}

.comment_block .dotsMenu {
  position: absolute;
  z-index: 1;
  top: 0px;
  right: 15px;
  width: 36px;
  height: 36px;
}

.comment_block .dotsMenu .menu_dot {
  background: white;
}

.comment_block_comment {
  padding: 15px 15px 0px 15px;
  box-sizing: border-box;
  color: white;
  line-height: 20px;
  font-size: 13px;
  font-weight: 400;
  word-wrap: break-word;
}

.comment_tools {
  display: none;
  list-style-type: none;
  position: absolute;
  top: 36px;
  right: 15px;
  z-index: 1;
  background: rgb(38, 40, 44);
  border: 1px solid rgb(58, 61, 65);
  box-shadow: 0 0 8px rgba(4, 6, 12, .2);
  border-radius: 7px;
  overflow: hidden;
}

.comment_tools>li {
  padding: 15px;
  color: white;
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}

@media screen and (min-width: 850px) {
  [data-fbap_format=high] {
    height: calc(100% - 65px) !important;
    border: none !important;
  }

  [data-fbap_embed=true][data-fbap_format=high] {
    height: 190px !important;
    border-top: 1px solid rgb(48, 51, 56) !important;
  }

  #fbap_midZone {
    flex-shrink: 0;
    padding: 5px 10px 0px 10px;
    box-sizing: border-box;
  }

  #fbap_botZone {
    flex: 1;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    display: flex;
    flex-direction: column;
  }

  .fbap_trackName:hover, .fbap_playerName:hover {
    color: rgb(4, 110, 228);
  }

  .fbap_miniBtn:hover, .fbap_miniBtnActive {
    border-color: rgba(4, 110, 228, .4);
  }

  .fbap_miniBtn:hover svg, .fbap_miniBtnActive svg {
    fill: rgb(4, 110, 228);
  }

  #fbap_mobile_ui_artworkZone, #fbap_mobile_ui_controls {
    display: none;
  }

  #fbap_timeSliderCtr {
    display: none;
  }

  .fbap_post_comment_btn:hover {
    background: rgb(38, 40, 44);
  }

  #fbap_comments {
    position: relative;
    flex: 1;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  [data-fbap_format=high] #fbap_comments {
    display: block;
  }

  .comment_block {
    display: flex;
    align-items: stretch;
    margin-bottom: 15px;
  }

  .comment_block_time {
    border-right: 1px solid rgba(4, 110, 228, .28);
    padding: 0px 15px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  .comment_block_time:hover {
    background: rgba(4, 110, 228, .08);
  }

  .comment_block_time span {
    display: block;
    width: 50px;
    color: white;
    font-size: 11px;
    font-weight: 600;
  }

  .comment_block_data {
    flex-grow: 1;
  }

  .comment_block_inner {
    padding: 15px 0px;
  }

  .comment_block_inner:hover {
    background: rgba(4, 110, 228, .08);
  }

  .comment_answers {
    padding-left: 15px;
  }

  [data-fbap_format=high][data-fbap_embed=false] .appLoader_tape {
    width: 90px;
    height: 90px;
  }

  .comment_block .dotsMenu:hover .menu_dot {
    background: rgb(4, 110, 228);
  }

  .comment_tools>li:hover {
    background: rgb(48, 51, 56);
  }

  #exportCommentAsCsv {
    width: 81px;
    align-self: flex-start;
    height: 34px;
    padding: 0px 10px;
    box-sizing: border-box;
    background: rgb(4, 110, 228);
    color: white;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
  }

  #exportCommentAsCsv:hover {
    background: rgb(24, 130, 248);
  }
}

@media screen and (max-width: 849px) {

  @media only screen and (orientation: portrait) {
    [data-fbap_format=low] {
      padding-bottom: env(safe-area-inset-bottom);
    }
  }

  [data-fbap_format=high] {
    height: 100% !important;
    border: none !important;
    padding-bottom: env(safe-area-inset-bottom);
  }

  [data-fbap_embed=true] {
    padding-bottom: 0;
  }

  #fbap_midZone {
    flex: 1;
    display: flex;
    flex-direction: column;
  }

  #fbap_botZone {
    flex: 0;
    opacity: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }

  .fbap_miniBtn {
    display: none;
    background: none;
  }

  [data-fbap_embed=true] .fbap_miniBtn svg {
    width: 30px;
    height: 30px;
  }

  .fbap_miniBtnActive {
    border-color: rgba(4, 110, 228, .4);
  }

  .fbap_miniBtnActive svg {
    fill: rgb(4, 110, 228);
  }

  .embed_fb_logo {
    margin-left: 5px;
  }

  .embed_fb_logo svg {
    width: 29px;
    height: 29px;
  }

  [data-fbap_format=high] #fbap_topZone {
    flex: 0 0 80px;
    padding: 7.5px 15px;
  }

  [data-fbap_embed=true][data-fbap_format=high] #fbap_topZone {
    flex: 0 0 63px;
    padding: 7.5px 10px 7.5px 15px;
  }

  [data-fbap_format=high] #fbap_artworkZone {
    display: none;
  }

  [data-fbap_format=high][data-fbap_embed=false] .fbap_trackName {
    font-size: 16px;
  }

  [data-fbap_format=high][data-fbap_embed=false] .fbap_playerName {
    font-size: 14px;
  }

  [data-fbap_format=high] .fbap_reduce {
    display: block;
  }

  [data-fbap_format=low] .fbap_reduce {
    display: none;
  }

  [data-fbap_format=high] .fbap_extend {
    display: none;
  }

  [data-fbap_format=low] .fbap_extend {
    display: block;
  }

  [data-fbap_embed=true] .fbap_reduce svg{
    width: 30px;
    height: 30px;
  }

  #fbap_waveform {
    display: none;
  }

  #fbap_timers_and_specs {
    padding: 0px 15px;
    box-sizing: border-box;
  }

  #fbap_write_comment_zone {
    background: rgb(38, 40, 44);
    box-shadow: 0px 1px 3px rgba(8, 11, 16, .2);
    padding-bottom: env(safe-area-inset-bottom);
  }

  #fbap_comments {
    position: relative;
    flex: 1;
    background: rgb(48, 51, 56);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  [name=fbap_write_comment_ta], [name=fbap_answer_comment_ta] {
    padding: 15px;
    font-size: 14.5px;
  }

  .comment_block_time {
    padding: 15px;
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    justify-content: center;
  }

  .comment_block_inner {
    padding: 15px 0px;
  }

  .comment_block_time span {
    padding: 5px 10px;
    background: rgb(4, 110, 228);
    border-radius: 24px;
    color: white;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
  }

  #appLoaderWrapper_fbap .appLoader_tape {
    display: none;
    width: 90px;
    height: 90px;
  }

  [data-fbap_embed=true] .fbap_trackName:hover, [data-fbap_embed=true] .fbap_playerName:hover {
    color: rgb(4, 110, 228);
  }

  #exportCommentAsCsv {
    display: none;
  }
}

/*********************************************** EMBED ***********************************************/
.app_embed_iframe {
  width: 100%;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#ep_free_message {
  margin: 10px 0px 50px 0px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

#ep_free_message .linkBtnColor {
  width: auto;
  height: 35px;
  line-height: 35px;
  font-size: 14px;
}

#ep_free_message .fb_help {
  flex-grow: 1;
  line-height: 22px;
}

[data-mode=waveform] {
  padding-bottom: 80px;
}

[data-mode=cover] {
  padding-bottom: 40px;
}

.ep_legend {
  display: block;
  padding: 15px 0px;
  color: rgb(4,110,228);
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

#code2Embed_cm, #code2Embed_wfm {
  height: 135px;
  font-size: 12.5px;
}

@media screen and (min-width: 850px) {
  .embed_code_zone {
    display: flex;
  }

  #code2Embed_cm, #code2Embed_wfm {
    height: auto;
    flex: 1 0 80%;
    margin-right: 40px;
  }
}

@media screen and (max-width: 849px) {

  #ep_free_message .fb_help {
    flex: 1;
  }

  #ep_free_message .linkBtnColor {
    width: 100%;
  }

  .textArea {
    font-size: 14.5px;
  }

  [data-mode=cover] {
    padding-bottom: 15px;
  }
}

/*********************************************** APP LOADER ***********************************************/
#appLoaderWrapper_main {
  position: fixed;
  z-index: 11;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: rgb(38, 40, 44);
}

.embed_app #appLoaderWrapper_main {
  border-radius: 7px;
  top: 1px;
  left: 1px;
  width: calc(100vw - 2px);
  height: calc(100% - 2px);
  overflow: hidden;
}

#appLoaderWrapper_zone {
  display: none;
  position: fixed;
  z-index: 3;
  top: 65px;
  right: 0;
  width: calc(100% - 290px);
  height: calc(100% - 65px);
  background: rgb(38, 40, 44);
}

@media screen and (max-width: 849px) {

  #appLoaderWrapper_zone {
    position: absolute;
    top: calc(64px + env(safe-area-inset-top));
    height: calc(100% - 64px - env(safe-area-inset-top));
    width: 100%;
  }
}

#appLoaderWrapper_fbap {
  display: none;
  position: absolute;
  z-index: 4;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(38, 40, 44);
}

.embed_app #appLoaderWrapper_fbap {
  border-radius: 7px;
  overflow: hidden;
}

.appLoader {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.appLoader_message {
  display: none;
  padding: 30px 0px;
  color: white;
  font-size: 16px;
  font-weight: 800;
}

.appLoader_tape {
  flex-shrink: 0;
  display: block;
  animation: reeltape_rotate 1.4s linear infinite;
}

@-webkit-keyframes reeltape_rotate {
  to {
    -webkit-transform: rotate(-360deg);
  }
}

@keyframes reeltape_rotate {
  to {
    transform: rotate(-360deg);
  }
}

.reloadApp {
  position: absolute;
  bottom: 15px;
  right: 15px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  background: rgb(48, 51, 56);
  border-radius: 50%;
  color: white;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
}

.reloadApp svg {
  flex-shrink: 0;
  display: block;
  fill: white;
}

.embed_app .appLoader_tape {
  display: block !important;
  width: 70px !important;
  height: 70px !important;
}

/*********************************************** BLOCK LOADER ***********************************************/
.spinner {
  position: absolute;
  z-index: 3;
  left: 0;
  top: 0;
  background: rgb(38, 40, 44);
  display: flex;
  align-items: center;
  justify-content: center;
}

.spinner>div {
  flex-shrink: 0;
  margin: 1.5px;
  background: rgb(4, 110, 228);
  border-radius: 50%;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0)
  }

  40% {
    -webkit-transform: scale(1.0)
  }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  40% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

.animatedCircle_boxCtr {
  position: relative;
  width: 75px;
  height: 75px;
}

.animatedCircle_box {
  width: 100%;
  transform-origin: center;
  animation: rotate 2s linear infinite;
}

.animatedCircle {
  fill: none;
  stroke: rgb(4, 110, 228);
  stroke-width: 1.5;
  stroke-dasharray: 1, 200;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  animation: dash 1.5s ease-in-out infinite;
}

#countDown {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  line-height: 75px;
  color: white;
  font-size: 18px;
  font-weight: 800;
  text-align: center;
}

@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dasharray: 90, 200;
    stroke-dashoffset: -35px;
  }

  100% {
    stroke-dashoffset: -125px;
  }
}

/*********************************************** APP SCROLL BAR ***********************************************/
@media screen and (min-width: 850px) {
  ::-webkit-scrollbar {
    width: 4px;
    height: 2px;
  }

  ::-webkit-scrollbar-track {
    background: transparent;
  }

  ::-webkit-scrollbar-thumb {
    background: rgb(58, 61, 65);
  }
}

@media screen and (max-width: 849px) {
  ::-webkit-scrollbar {
    width: 0;
    height: 0;
  }

  ::-webkit-scrollbar-track {
    background: transparent;
  }

  ::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 0px;
  }
}

/*********************************************** IMG LOADER ***********************************************/
.img {
  position: relative;
  z-index: 1;
  align-self: flex-start;
}

.imgLoader {
  display: block;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(38, 41, 46);
}

.imgLoader::after {
  content: "";
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: rgb(48, 51, 56);
  animation: animate_img_loader 2s ease infinite;
}

@keyframes animate_img_loader {
  to {
    width: 100%;
  }
}

.fb-bg_img {
  width: 100%;
  height: 100%;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

/*********************************************** INTERACTIVE WINDOW ***********************************************/
#interActiveWindow {
  display: none;
  position: fixed;
  z-index: 9;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background: rgba(8, 10, 14, .77);
  overflow: hidden;
}

#interActiveWindowBox, #appLoaderWrapper_iw {
  position: fixed;
  z-index: 9;
  top: 0;
  right: -450px;
  width: 100vw;
  max-width: 450px;
  height: 100%;
  background: rgb(38, 40, 44);
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

#appLoaderWrapper_iw {
  z-index: 10;
  display: none;
}

@media screen and (max-width: 849px) {
  #interActiveWindowBox {
    padding: 30px 30px 0px 30px;
    padding-top: calc(30px + env(safe-area-inset-top));
    padding-bottom: calc(0px + env(safe-area-inset-top));
  }

  .iwBox_nopad {
    padding: calc(0px + env(safe-area-inset-top)) 0 0 0 !important;
  }

  #pwa_iw_topMask {
    position: fixed;
    z-index: 99;
    top: 0;
    left: 0;
    width: 100vw;
    height: env(safe-area-inset-top);
    background: rgba(38, 40, 44, 0.8) !important;
    -webkit-backdrop-filter: blur(8px) !important;
  }
}

@media screen and (min-width: 850px) {
  #interActiveWindowBox {
    padding: 40px 40px 0px 40px;
  }

  .iwBox_nopad {
    padding: 0 !important;
  }
}

#closeInterActiveWindow {
  position: fixed;
  z-index: 9;
  top: calc(0px + env(safe-area-inset-top));
  right: 0;
  fill: rgb(204, 206, 210);
}

#closeInterActiveWindow:hover {
  cursor: pointer;
  fill: rgb(78, 80, 84);
}

#iWmessageCtr {
  position: relative;
  z-index: 1;
  min-width: 0;
  margin: 40px;
  padding: 0px 40px;
  background: rgb(38, 40, 44);
  border: 1px solid rgb(58, 61, 65);
  border-radius: 3px;
}

#iWmessageBubble {
  flex-shrink: 0;
  display: block;
  width: 80px;
  height: 80px;
  line-height: 80px;
  background: rgb(4, 110, 228);
  border-radius: 50%;
  margin: 0px auto;
  color: white;
  font-size: 30px;
  font-weight: 500;
  text-align: center;
}

#iWmessage {
  display: block;
  line-height: 30px;
  margin: 50px 20px 40px 20px;
  color: white;
  font-size: 16px;
  font-weight: 800;
  text-align: center;
  word-break: break-word;
}

.iWmessage_block {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 10px 0px;
}

.iWmessage_block>span {
  color: white;
  font-size: 13px;
  font-weight: 500;
}

.iWmessage_block>svg {
  flex-shrink: 0;
  display: block;
  width: 12px;
  height: 12px;
  margin-right: 10px;
}

#iW_btns_zone {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 20px;
}

.iWbtn_color {
  padding: 10px 20px;
  border-radius: 7px;
  margin: 8px;
  background: rgb(4, 110, 228);
  color: white;
  font-size: 14px;
  font-weight: 800;
}

.iWbtn_color:hover {
  background: rgb(24, 130, 248);
  cursor: pointer;
}

.appInfo_cookie svg {
  flex-shrink: 0;
  display: block;
  height: 30px;
  width: 30px;
}

.appInfo_cookie_img:hover {
  cursor: pointer;
  fill: rgb(78, 80, 84);
}

#iw_subMenu {
  list-style-type: none;
  margin-bottom: 30px;
  border-bottom: 1px solid rgb(58, 61, 65);
  display: flex;
  align-items: center;
}

#iw_subMenu li {
  flex-grow: 1;
  width: 50%;
  height: 40px;
  line-height: 40px;
  color: white;
  font-size: 12px;
  font-weight: 400;
  text-align: center;
  text-transform: uppercase;
}

#iw_subMenu li:hover {
  cursor: pointer;
}

.iw_subMenu_liActive {
  color: rgb(4, 110, 228) !important;
}

.iw_subTitle {
  display: block;
  line-height: 22px;
  padding: 15px 0px 10px 0px;
  color: white;
  font-size: 16px;
  font-weight: 700;
}

.iw_red_string {
  display: block;
  padding: 10px;
  margin: 20px 0px;
  border-radius: 4px;
  line-height: 22px;
  color: white;
  font-size: 15px;
  font-weight: 600;
  background: rgb(242, 88, 88);
  text-align: center;
}

#iwMessageTop {
  display: none;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 40px 40px 0px 40px;
  box-sizing: border-box;
  background: rgb(38, 40, 44);
}

/*****************************************************APP SYSTEM MESSAGE********************************************/
#appSystemMessage {
  flex-grow: 1;
  padding: 30px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.appSystemMessage_bigText {
  display: block;
  line-height: 40px;
  padding: 30px 0px;
  color: white;
  font-size: 24px;
  font-weight: 800;
  text-align: center;
}

.appSystemMessage_smallText {
  display: block;
  padding: 15px 0px;
  line-height: 28px;
  color: white;
  font-size: 16px;
  font-weight: 400;
  text-align: center;
}

#appSystemMessage_btns {
  width: 300px;
  padding: 10px 60px;
  margin-top: 40px;
  border-top: 1px solid rgb(58, 61, 65);
}

#accountConfirmation_email_sent {
  display: none;
}

#appSystemMessage_logo {
  flex-shrink: 0;
  display: block;
  width: 204px;
  padding: 30px 0px;
}

#app_bot_message_ctr {
  position: fixed;
  z-index: 9;
  bottom: -65px;
  left: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

#app_bot_message {
  box-sizing: border-box;
  background: rgb(4, 110, 228);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media screen and (min-width: 850px) {

  #app_bot_message_ctr {
    padding: 0px 20px;
    box-sizing: border-box;
  }

  #app_bot_message {
    padding: 15px;
    border-radius: 4px;
    box-shadow: 0 0 18px rgba(0, 0, 0, .18);
  }

  #app_bot_permanent_message {
    display: flex;
    align-items: center;
  }
}

@media screen and (max-width: 849px) {
  #app_bot_message {
    width: 100vw;
    padding: 15px;
    padding-bottom: calc(15px + env(safe-area-inset-bottom));
  }
}

#app_bot_message p {
  flex-grow: 1;
  line-height: 22px;
  color: white;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  word-break: break-word;
}

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

@media screen and (max-width: 849px) {
  .app_bot_message_btns {
    justify-content: center;
  }
}

.app_bot_message_btns span{
  display: block;
  margin-top: 20px;
}

.app_bot_message_btns a, .app_bot_message_btns button {
  flex-shrink: 0;
  width: auto;
  height: 28px;
  line-height: 28px;
  font-size: 13px;
  margin: 0px;
}

.app_bot_message_btns a {
    margin: 0px 15px;
}

@media screen and (max-width: 849px) {
  .app_bot_message_btns a, .app_bot_message_btns button {
    margin: 8px 8px 0px 8px;
  }
}

/*********************************************** TOP ZONE ***********************************************/
#logo {
  text-decoration: none;
  display: flex;
  align-items: center;
}

#fidbak_reel_tape_logo {
  display: block;
  flex-shrink: 0;
}

#topZone_home #fidbak_reel_tape_logo, #topZone_home #fidbak_font_logo {
  fill: white;
  transition: fill 1s ease;
}

.reel_tape_rewind_logo {
  animation: reeltape_rewind 0.5s linear;
}

.reel_tape_forward_logo {
  animation: reeltape_forward 1s linear;
}

@-webkit-keyframes reeltape_rewind {
  to {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes reeltape_rewind {
  to {
    transform: rotate(360deg);
  }
}

@-webkit-keyframes reeltape_forward {
  to {
    -webkit-transform: rotate(-360deg);
  }
}

@keyframes reeltape_forward {
  to {
    transform: rotate(-360deg);
  }
}

#fidbak_font_logoCtr, #fidbak_font_logoCtr_visible {
  width: 0px;
  margin-left: 8px;
  overflow: hidden;
}

#fidbak_font_logoCtr_visible {
  width: 70px;
}

#fidbak_font_logoCtr svg, #fidbak_font_logoCtr_visible svg {
  fill: white;
}

#fidbak_font_logo {
  display: block;
  flex-shrink: 0;
}

#topZone_right_notifications {
  position: relative;
  padding: 3px;
  border-radius: 50%;
  background: rgb(48, 51, 56);
}

@media screen and (max-width: 849px) {
  #topZone_right_notifications {
    margin-right: 20px;
  }
}

@media screen and (min-width: 850px) {
  #topZone_right_notifications {
    margin: 0px 20px;
  }

  #topZone_right_notifications:hover {
    background: rgb(58, 61, 66);
    cursor: pointer;
  }
}

#topZone_right_notifications svg {
  flex-shrink: 0;
  display: block;
  fill: white;
}

#topZone_right_notifications_nbr {
  display: none;
  position: absolute;
  top: -5px;
  right: -5px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  background: rgb(4, 110, 228);
  border-radius: 50%;
  color: white;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  overflow: hidden;
}

#userZone {
  height: 36px;
  border-radius: 36px;
  display: flex;
  align-items: center;
}

#userZone:hover {
  background: rgb(48, 51, 56);
  cursor: pointer;
}

#userZone_avatar {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
}

#userZone img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  opacity: 0;
}

#userZone span {
  display: block;
  padding: 0px 15px 0px 10px;
  color: white;
  font-size: 15px;
  font-weight: 500;
  white-space: nowrap;
}

.dotsMenu {
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dotsMenu:hover {
  cursor: pointer;
}

.menu_dot {
  width: 4px;
  height: 4px;
  background: rgb(4, 110, 228);
  margin: 0px 1.5px;
  border-radius: 50%;
}

@media screen and (min-width: 850px) {
  .dotsMenu:hover .menu_dot {
    background: rgb(24, 130, 248);
  }
}

#topZone_home .menu_dot{
  background: white;
}

#topZone_rightWrapper [data-btn=loginBtn] {
  display: block;
  height: 34px;
  line-height: 1;
  padding: 0px 25px;
  margin-right: 25px;
  color: white;
  font-size: 15.5px;
  font-weight: 800;
  text-align: center;
  white-space: nowrap;
}

#topZone_rightWrapper [data-btn=loginBtn]:hover {
  color: rgb(24, 130, 248);
  cursor: pointer;
}

#topZone_left_lines_menu {
  display: none;
  padding: 5px;
}

#topZone_left_lines_menu svg {
  flex-shrink: 0;
  display: block;
}

#topZone_left_lines_menu:hover {
  cursor: pointer;
}

#mobile_app_prev_btn_ctr {
  display: none;
  position: relative;
  left: -5px;
  padding: 10px;
  cursor: pointer;
}

#mobile_app_prev_btn {
  display: flex;
  align-items: center;
  justify-content: center;
}

.credentials_sideBar {}

/*********************************************** SIDE BARS MENU ***********************************************/
#notificationsListWrapper, #userSideBarMenuWrapper, #coreZoneSideBarMenuWrapper {
  position: fixed;
  z-index: 8;
  top: 65px;
  width: 100vw;
  height: calc(100% - 65px);
  background: rgb(38, 40, 44);
  overflow: hidden;
}

#userSideBarMenuWrapper svg {
  fill: white;
}

@media screen and (min-width: 850px) {
  #coreZoneSideBarMenuWrapper {
    left: -251px;
    width: 250px;
    border-right: 1px solid rgb(58, 61, 65);
  }

  #notificationsListWrapper, #userSideBarMenuWrapper {
    right: -321px;
    width: 320px;
    border-left: 1px solid rgb(58, 61, 65);
  }

  #userSideBarMenu a:hover, #switchAccountBtn:hover, #logOutBtn:hover, #adminLogOutBtn:hover, #installApp:hover, #userSideBarMenu [data-btn=loginBtn]:hover {
    background: rgb(48, 51, 56);
    cursor: pointer;
  }

  #userSideBarMenu a>span, #switchAccountBtn span, #logOutBtn span, #adminLogOutBtn span, #installApp span, #userSideBarMenu [data-btn=loginBtn] button {
    display: block;
    color: white;
    font-size: 13.75px;
    font-weight: 600;
  }
}

@media screen and (max-width: 849px) {
  #notificationsListWrapper, #userSideBarMenuWrapper, #coreZoneSideBarMenuWrapper {
    top: calc(64px + env(safe-area-inset-top));
    height: calc(100% - 64px - (env(safe-area-inset-top)));
  }

  #notificationsListWrapper, #coreZoneSideBarMenuWrapper {
    padding-bottom: env(safe-area-inset-bottom);
    box-sizing: border-box;
  }

  #userSideBarMenuWrapper #appMentions {
    padding-bottom: calc(15px + env(safe-area-inset-bottom));
  }

  #coreZoneSideBarMenuWrapper {
    left: -100vw;
    background: rgb(48, 51, 56);
  }

  #notificationsListWrapper, #userSideBarMenuWrapper {
    right: -100vw;
  }

  #userSideBarMenu a>span, #switchAccountBtn span, #logOutBtn span, #adminLogOutBtn span, #installApp span, #userSideBarMenu [data-btn=loginBtn] button {
    display: block;
    color: white;
    font-size: 14px;
    font-weight: 500;
  }
}

#coreZoneSideBarMenuWrapper {
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

#notificationsListInner, #userSideBarMenuInner {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
}

#userSideBarMenu, #notificationsList {
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

#userSideBarMenu {
  list-style-type: none;
  height: calc(100% - 20px);
  padding-top: 20px;
}

#notificationsList {
  height: 100%;
}

#notificationsList .chatBlock_header_username {
  max-width: 200px;
}

#userSideBarMenu li:not(#installApp) {
  display: flex;
  align-items: center;
}

#userSideBarMenu a {
  text-decoration: none;
}

#userSideBarMenu a, #switchAccountBtn, #logOutBtn, #adminLogOutBtn, #installApp, [data-btn=loginBtn] {
  width: 100%;
  height: 55px;
  padding: 0px 20px;
  box-sizing: border-box;
  align-items: center;
}

#userSideBarMenu a, #switchAccountBtn, #logOutBtn, #adminLogOutBtn {
  display: flex;
}

#installApp, #userSideBarMenu[data-btn=loginBtn] {
  display: none;
}

#userSideBarMenu a>svg, #switchAccountBtn svg, #logOutBtn svg, #adminLogOutBtn svg, #installApp svg, #userSideBarMenu [data-btn=loginBtn] svg {
  flex-shrink: 0;
  display: block;
  margin-right: 20px;
}

#notifications_view_all {
  width: 100%;
  height: 70px;
  padding: 15px;
  box-sizing: border-box;
}

#notifications_view_all .linkBtnColor {
  margin: 0;
}

#appMentions {
  flex-shrink: 0;
  width: 100%;
  padding: 15px 0px 15px 15px;
  box-sizing: border-box;
  background: rgb(48, 51, 56);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

#appMentionsLeft, #appMentionsRight {
  display: flex;
  align-items: center;
}

#appMentions a {
  text-decoration: none;
}

#appMentions span, #appMentions a {
  display: block;
  margin-right: 10px;
  color: white;
  font-size: 11px;
  font-weight: 800;
}

#appMentions a:hover {
  color: rgb(4, 110, 228);
}

#appMentions svg {
  flex-shrink: 0;
  display: block;
  fill: white;
}

#user_menu_boutique_new_icon {
  padding: 5px;
  margin-left: 20px;
  border: 1px solid rgb(4, 110, 228);
  border-radius: 4px;
  color: rgb(4, 110, 228) !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

/*********************************************** HOME ***********************************************/

#home_menu {
  list-style-type: none;
  padding: 0px 20px;
  box-sizing: border-box;
  height: 64px;
  display: flex;
  align-items: stretch;
}

#home_menu li {
  display: flex;
  align-items: stretch;
}

#home_menu a {
  text-decoration: none;
  display: block;
  padding: 0px 20px;
  box-sizing: border-box;
  border-bottom: 1px solid transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}

#home_menu span {
  color: white;
  font-size: 15px;
  font-weight: 800;
  white-space: nowrap;
  transition: color 1s ease;
}

#home_menu a:hover {
  border-bottom: 1px solid white;
}

#desktop_home_rtz {
  display: flex;
  align-items: center;
}

#home_banner_outer {
  position: relative;
  width: 100%;
  min-height: calc(100% - 65px);
  background: rgb(28, 30, 34);
  display: flex;
  align-items: center;
  justify-content: center;
}

#home_banner_inner {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#home_tag_line_container {
  padding-bottom: 30px;
}

#home_tag_line_thin {
  display: block;
  line-height: 40px;
  color: white;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
}

#home_tag_line_large {
  display: block;
  line-height: 65px;
  color: white;
  font-size: 50px;
  font-weight: 800;
  text-align: center;
}

.home_tag_line_gradient_start {
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-image: linear-gradient(15deg, rgb(228, 4, 110), white);
}

.home_tag_line_gradient_end {
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-image: linear-gradient(-15deg, rgb(228, 4, 110), white);
}

#home_app_screenshots_container {
  position: relative;
}

#home_app_screenshots {
  opacity: 1;
  transition: opacity 0.5s ease-out;
}

.home_app_screenshots_animation {
  opacity: 0 !important;
}

#home_app_img_container {
  position: relative;
  z-index: 1;
}

#home_app_screenshot {
  display: block;
  width: 100%;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  box-shadow: 0 7px 100px rgba(228, 4, 110,.15);
  animation: scale_app_screenshot 1s;
}

#home_paywall_screenshot {
  position: absolute;
  z-index: 2;
  right: -12%;
  top: 12%;
  display: block;
  width: 24%;
  animation: fade_paywall_screenshot 1.5s linear,
             scale_paywall_screenshot 1s linear;
}

@keyframes scale_app_screenshot {
  0% {
    transform: scale(0.9);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes fade_paywall_screenshot {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes scale_paywall_screenshot {
  0% {
    transform: scale(0.9);
  }
  70% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}

#home_discover_vid {
  position: absolute;
  top: 0;
  left: 0;
  background: rgb(31, 33, 38);
}

#homeArrow {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 50px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#homeArrow svg {
  flex-shrink: 0;
  display: block;
  width: 20px;
  padding: 15px;
  fill: white;
  animation: arrow_bounce 2.2s;
  animation-iteration-count: infinite;
  cursor: pointer;
}

@keyframes arrow_bounce {
  0%,
  25%,
  50%,
  75%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-22px);
  }
  60% {
    transform: translateY(-8px);
  }
}

@media screen and (min-width: 850px) {

  #home_banner_outer {
    padding-top: 65px;
  }

  #home_banner_inner {
    width: 46vw;
    padding: 20px 20px 85px 20px;
  }

  #home_buttons_container {
    padding-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #home_buttons_container .linkBtnColor,
  #home_buttons_container .formBtnGrey {
    width: auto;
    margin: 10px;
  }
}

@media screen and (max-width: 849px) {

  #home_banner_inner {
    padding: 30px 20px 105px 20px;
  }

  #home_tag_line_container {
    padding: 30px 0;
  }

  #home_buttons_container {
    padding-top: 60px;
  }

  #home_tag_line_thin {
    font-size: 18px;
  }

  #home_tag_line_large {
    line-height: 50px;
    font-size: 45px;
  }

  #home_buttons_container .linkBtnColor {
    margin: 0;
  }

  #home_app_screenshot {
    border-radius: 4px;
  }

  #home_paywall_screenshot {
    top: -15px;
    right: -2px;
  }
}

.homeBlock {
  position: relative;
  width: 100%;
}

.homeTextBlock {
  position: relative;
  top: 200px;
  opacity: 0;
}

#home_trailer_vid {
  border: none;
}

.homeVid_thumbNail {
  position: relative;
  width: 100%;
  box-shadow: 0 0 28px rgba(8,8,8,.4);
  border-radius: 7px;
}

.home_mid_gradient_font {
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-image: linear-gradient(-45deg, #ffb618, #ce1a1a);
}

@media screen and (min-width: 850px) {

  #topZone_home #topZone_right_dots_menu {
    display: none;
  }

  .homeBlock {
    padding: 60px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
  }

  .homeBlockOut {
    flex: 1;
    max-width: 1390px;
    padding: 150px 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .homeBlockIn {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .homeBlockL, .homeBlockR {
    flex: 1 0 50%;
    padding: 40px;
    box-sizing: border-box;
  }

  .homeBlock .linkBtnColor_grey {
    margin: 30px 0;
  }

  .home_block_btn_auto_size {
    display: inline-block !important;
    width: auto !important;
  }

  .home_mid_font, .home_light_font {
    display: block;
    line-height: 55px;
    color: white;
    font-size: 45px;
    font-weight: 800;
  }

  .home_light_font {
    margin-top: 30px;
    line-height: 28px;
    font-size: 18px;
    font-weight: 600;
    color: rgb(228,228,228);
  }
}

@media screen and (max-width: 849px) {

  #desktop_home_rtz {
    display: none;
  }

  #home_trailer_vid {
    border-radius: 7px;
  }

  .homeBlock {
    padding: 0 30px 60px 30px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .homeBlockIn {
    padding-top: 30px;
  }

  .home_mid_font, .home_light_font {
    display: block;
    line-height: 45px;
    color: white;
    font-size: 30px;
    font-weight: 800;
  }

  .home_mid_font {
    padding: 30px 0;
    text-align: center;
  }

  .home_light_font {
    line-height: 28px;
    font-size: 16px;
    font-weight: 500;
    color: rgb(228, 228, 228);
    text-align: justify;
  }
}

/*****************************************************FORMS********************************************/
.form {
  position: relative;
  padding-bottom: 25px;
}

.formTitleCtr {
  display: flex;
  align-items: center;
  justify-content: center;
}

.formTitleCtr span {
  display: block;
  margin: 15px 0px 40px 0px;
  line-height: 35px;
  color: white;
  font-size: 28px;
  font-weight: 800;
}

.formSubTitle {
  display: block;
  margin-top: 30px;
  line-height: 22px;
  color: rgb(4, 110, 228);
  font-size: 15px;
  font-weight: 800;
}

.formTitle1 {
  display: block;
  padding-top: 15px;
  line-height: 35px;
  color: white;
  font-size: 28px;
  font-weight: 800;
}

.formTitle2 {
  display: block;
  padding-bottom: 40px;
  line-height: 35px;
  color: rgb(4, 110, 228);
  font-size: 22px;
  font-weight: 400;
  word-break: break-word;
}

.form2Titles_flex {
  padding-bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.formTitleBtn {
  display: block;
  padding: 10px;
  margin-top: 15px;
  box-sizing: border-box;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  color: white;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
}

@media screen and (min-width: 850px) {

  .formTitleBtn:hover {
    background: rgb(48, 51, 56);
  }
}

.formInputCtr_flex {
  display: flex;
  align-items: center;
}

.formInputCtr_flex svg {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-right: 10px;
}

.formInputCtr_flex a {
  text-decoration: none;
  display: block;
  width: 100%;
  height: 40px;
  line-height: 40px;
  color: white;
  font-size: 14px;
  font-weight: 500;
}

.formInputCtr_flex a:hover {
  color: rgb(4, 110, 228);
}

.formInputCtr {
  position: relative;
  width: 100%;
  padding: 15px 0px;
  box-sizing: border-box;
}

.formInputCtr_email {
  position: relative;
  height: 90px;
  width: 100%;
  padding: 15px 0px;
  box-sizing: border-box;
}

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

.legend {
  display: inline-block;
  height: 20px;
  line-height: 20px;
  color: white;
  font-size: 12px;
  font-weight: 400;
  text-transform: uppercase;
}

.formInput {
  position: relative;
  width: 100%;
  height: 39px;
  line-height: normal;
  border-bottom: 1px solid rgb(58, 61, 65);
  color: white;
  font-size: 14px;
  font-weight: 500;
  transition: border-color 0.25s ease;
}

.formInput_underline {
  position: absolute;
  bottom: 14px;
  left: 50%;
  width: 100%;
  height: 2px;
  opacity: 0;
  background-color: rgb(4, 110, 228);
  transform-origin: center;
  transform: translate(-50%, 0) scaleX(0);
  transition: all 0.3s ease;
}

.formInput:focus~.formInput_underline,
.formInput_underlined {
  transform: translate(-50%, 0) scaleX(1);
  opacity: 1;
}

.numberInputsCtr {
  padding-top: 10px;
  display: flex;
}

.numberInput {
  width: 28px;
  height: 28px;
  margin-right: 10px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  padding: 5px;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 4px;
  text-align: center;
}

.numberInput:focus {
  border: 1px solid rgb(4, 110, 228);
}

.textArea {
  display: block;
  width: 100%;
  height: 112px;
  padding: 15px;
  box-sizing: border-box;
  background: rgb(48, 51, 56);
  border: 1px solid transparent;
  border-radius: 7px;
  line-height: 20px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  transition: background 0.25s ease, border 0.25s ease;
}

@media screen and (max-width: 849px) {
  .textArea {
    font-size: 14.5px;
  }
}

.textArea::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: rgb(188, 190, 194);
}

.textArea:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: rgb(188, 190, 194);
  opacity: 1;
}

.textArea::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: rgb(188, 190, 194);
  opacity: 1;
}

.textArea:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: rgb(188, 190, 194);
}

@media screen and (min-width: 850px) {
  .textArea:focus {
    background: rgb(38, 40, 44) !important;
    border: 1px solid rgb(48, 51, 56) !important;
    transition: background 0.25s ease, border 0.25s ease;
  }
}

.textArea_send_btn_ctr {
  display: none;
  align-self: flex-end;
}

.textArea_send_btn {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.textArea_send_btn svg {
  flex-shrink: 0;
  display: block;
  width: 30px;
  height: 30px;
  margin: 0;
}

.textArea_ui_mobile {
  flex-grow: 1;
  height: 50px;
  background: rgb(38, 40, 44);
  padding: 15px 20px;
  box-sizing: border-box;
  border: none;
  border-radius: 0px;
  line-height: 20px;
  color: white;
  font-size: 14px;
  font-weight: 500;
}

.fb_textBlock {
  display: block;
  width: 100%;
  padding: 15px;
  box-sizing: border-box;
  background: rgb(48, 51, 56);
  border-radius: 7px;
  line-height: 20px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  word-break: break-word;
}

.fb_textBlock a {
  text-decoration: none;
  color: rgb(4, 110, 228);
}

.fb_textBlock a:hover {
  text-decoration: underline;
}

.formError, .comZone {
  display: none;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  margin: 15px 0px;
  line-height: 22px;
  background: rgb(242, 88, 88);
  border-radius: 4px;
  color: white;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  word-break: break-word;
}

.formError a {
  color: white;
}

[data-btn=show_pw], [data-btn=hide_pw] {
  height: 39px;
  line-height: 39px;
  padding: 0px 15px;
  box-sizing: border-box;
  border-bottom: 1px solid rgb(58, 61, 65);
  color: rgb(4, 110, 228);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
}

[data-btn=show_pw]:hover, [data-btn=hide_pw]:hover {
  color: rgb(24, 130, 248);
}

[data-btn=hide_pw] {
  display: none;
}

.no_data {
  padding: 15px 0px;
  color: rgb(88, 90, 94);
  font-size: 12px;
  font-weight: 600;
  font-style: italic;
}

#fb_imgUploader {
  position: relative;
}

#new_audio_group_form, #delete_audioGroup_iW {
  display: none;
}

/***************************************************** BUTTONS ********************************************/

.formBtnColor,
.formBtnGrey,
.formBtnWhite,
.formMiniBtnColor,
.linkBtnGrey {
  position: relative;
  width: 100%;
  height: 40px;
  margin: 15px 0px;
  padding: 0px 20px;
  box-sizing: border-box;
  border-radius: 7px;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}

.formBtnColor,
.formMiniBtnColor {
  background: rgb(4, 110, 228);
  color: white;
}

.formMiniBtnColor {
  height: 34px;
  margin: 6px 0px;
  padding: 0px 10px;
  font-size: 13px;
}

.formBtnGrey {
  background: rgb(48, 51, 56);
  color: white;
}

.linkBtnGrey {
  display: block;
  text-decoration: none;
  line-height: 40px;
  background: rgb(48, 51, 56);
  color: white;
  text-align: center;
}

.formBtnWhite {
  background: rgb(38, 40, 44);
  color: white;
}

.linkString, .linkString_tos, .linkString_600 {
  text-decoration: none;
  display: block;
  line-height: 22px;
  margin: 15px 0px;
  font-size: 15px;
  color: rgb(4, 110, 228);
  font-weight: 500;
  word-break: break-word;
}

.linkString_tos {
  font-size: 13px;
}

.linkString_600 {
  font-weight: 600;
}

#confirmBtnCtr {
  max-width: 60%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto;
}

.btnString, .btnString_unFlex {
  display: block;
  line-height: 20px;
  padding: 15px 0px;
  box-sizing: border-box;
  font-size: 15px;
  color: rgb(4, 110, 228);
  font-weight: 600;
}

.btnString_unFlex {
  align-self: flex-start;
}

.linkBtnColor, .linkBtnColor_grey, .linkBtnColor_white {
  position: relative;
  display: block;
  text-decoration: none;
  width: 100%;
  height: 40px;
  line-height: 40px;
  margin: 15px 0px;
  padding: 0px 20px;
  box-sizing: border-box;
  border-radius: 7px;
  background: rgb(4, 110, 228);
  color: white;
  font-size: 15px;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
  overflow: hidden;
}

.linkBtnColor_grey {
  background: rgb(48, 51, 56) !important;
  color: white;
}

.linkBtnColor_white {
  background: white;
  color: rgb(78, 80, 84) !important;
}

.customLinkBtnColor {
  display: block;
  text-decoration: none;
  height: 38px;
  line-height: 38px;
  padding: 0px 10px;
  margin: 15px 15px 15px 0px;
  box-sizing: border-box;
  border-radius: 7px;
  background: rgb(4, 110, 228);
  color: white;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
}

@media screen and (min-width: 850px) {
  .formBtnColor:hover, .formMiniBtnColor:hover {
    background: rgb(24, 130, 248);
  }

  .formBtnGrey:hover,
  .linkBtnGrey:hover {
    background: rgb(48, 50, 54);
  }

  .formBtnWhite:hover {
    background: rgb(38, 40, 44);
  }

  .btnString:hover, .btnString_unFlex:hover {
    color: rgb(24, 130, 248);
    cursor: pointer;
  }

  .linkString:hover, .linkString_tos:hover {
    color: rgb(24, 130, 248);
  }

  .linkBtnColor:hover {
    background: rgb(24, 130, 248);
  }
}

/***************************************************** SELECT BOX ********************************************/
.selectBox_fbCtr {
  display: inline-block;
  width: 100%;
  margin: 15px 0px;
}

.selectBox_fb {
  position: relative;
  border-radius: 7px;
  border: 1px solid rgb(58, 61, 65);
  margin: 15px 0px;
}

.selectBox_fb_opened {
  border-radius: 7px 7px 0px 0px !important;
}

.selectBoxHeader {
  padding: 0px 15px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.selectBoxHeader:hover {
  cursor: pointer;
}

.selectBoxHeader>span {
  display: block;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
  color: white;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.selectBoxHeader>svg {
  flex-shrink: 0;
  display: block;
  margin-left: 10px;
  fill: white;
}

.selectBoxActive {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.selectBoxList>span {
  display: block;
  height: 38px;
  line-height: 38px;
  padding: 0px 15px;
  box-sizing: border-box;
  color: white !important;
  font-size: 14px;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.selectBoxList span>img, .selectBoxList span>svg {
  display: block;
  height: 25px;
  width: 25px;
  margin-right: 10px;
}

.selectBoxList span>img {
  border-radius: 50%;
}

@media screen and (max-width: 849px) {
  .selectBoxList {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 3;
    width: 100%;
    max-height: 75vh;
    padding: 15px 0px;
    border-radius: 7px 7px 0px 0px;
    background: rgb(38, 40, 44);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .selectBoxList>span {
    display: block;
    height: 45px;
    line-height: 45px;
    padding: 0px 25px;
    box-sizing: border-box;
    color: rgb(88, 90, 94);
    font-size: 14.5px;
    font-weight: 600;
  }
}

@media screen and (min-width: 850px) {
  .selectBoxList {
    display: none;
    position: absolute;
    top: 38px;
    left: -1px;
    z-index: 3;
    width: 100%;
    max-height: 380px;
    border-radius: 0px 0px 7px 7px;
    background: rgb(38, 40, 44);
    border-left: 1px solid rgb(58, 61, 65);
    border-right: 1px solid rgb(58, 61, 65);
    border-bottom: 1px solid rgb(58, 61, 65);
    margin-bottom: 30px;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .selectBoxList>span:hover, .selectBoxList_itemHovered {
    cursor: pointer;
    background: rgb(48, 51, 56);
  }
}

/***************************************************** RADIO BOX ********************************************/
.radioBox_fb {
  padding: 10px 0px;
  display: flex;
  align-items: center;
}

.radioBox_fb:hover {
  cursor: pointer;
}

.radioBox {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  background: rgb(38, 40, 44);
  border: 1px solid rgb(58, 61, 65);
  border-radius: 50%;
  margin-right: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.radioBoxInner {
  flex-shrink: 0;
  display: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgb(4, 110, 228);
}

.radioBox_fb span {
  line-height: 20px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  word-break: break-word;
}

/*****************************************************PERMISSIONS********************************************/
#item_permissions_list, #file_settings {
  list-style-type: none;
  padding: 15px 0px;
}

#item_permissions_list li, #file_settings li {
  padding: 12px 0px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#file_settings li {
  flex-wrap: wrap;
}

#item_permissions_list li>span {
  line-height: 22px;
  color: white;
  font-size: 14px;
  font-weight: 400;
  word-break: break-word;
}

.file_setting_leftZone span, .info_point_textZone p {
  line-height: 22px;
  color: white;
  font-size: 14px;
  font-weight: 400;
  word-break: break-word;
}

.info_point_textZone p {
  padding-top: 15px;
}

.file_setting_rightZone {
  display: flex;
  align-items: center;
}

.file_setting_infoPoint {
  flex-shrink: 0;
  display: block;
  width: 28px;
  height: 28px;
  line-height: 28px;
  border-radius: 50%;
  border: 1px solid rgb(58, 61, 65);
  margin-right: 15px;
  color: rgb(4, 110, 228);
  font-size: 18px;
  font-weight: 500;
  text-align: center;
  cursor: pointer;
}

.info_point_textZone {
  display: none;
}

/*****************************************************SWITCH********************************************/
.fb_switch {
  flex-shrink: 0;
  width: 36px;
  height: 18px;
  border: 1px solid rgb(58, 61, 66);
  background: rgb(48, 51, 56);
  border-radius: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  transition: background 0.25s ease, border 0.25s ease, justify-content 0.25s ease;
}

.fb_switcher {
  width: 50%;
  height: 100%;
  border-radius: 50%;
  background: rgb(38, 41, 46);
}

.fb_switch_active {
  background: rgb(4, 110, 228);
  border: 1px solid transparent;
  justify-content: flex-end;
  transition: background 0.25s ease, border 0.25s ease, justify-content 0.25s ease;
}

.fb_switch_active .fb_switcher {
  background: rgb(38, 40, 44);
}

.fb_switch:hover {
  cursor: pointer;
}

/*****************************************************CREATE ACCOUNT********************************************/
#fidbakCheck {
  display: none;
}

#acceptTosMention {
  display: block;
  padding-top: 17.5px;
  line-height: 22px;
  color: white;
  font-size: 13px;
  font-weight: 500;
  text-align: center;
}

#tosLink {
  text-decoration: none;
  display: block;
  padding-bottom: 10px;
  line-height: 22px;
  color: rgb(4, 110, 228);
  font-size: 13px;
  font-weight: 500;
  text-align: center;
}

#tosLink:hover {
  cursor: pointer;
  color: rgb(24, 130, 248);
}

/*****************************************************LOGIN********************************************/
#loginForms, #fb_forms {
  display: flex;
  justify-content: center;
  padding: 60px 0px;
}

.pebble_form {
  width: 100%;
  padding: 20px 40px;
  box-sizing: border-box;
}

@media screen and (min-width: 850px) {
  .pebble_form {
    width: calc(100vw - 20px);
    max-width: 450px;
    background: rgb(38, 40, 44);
    border: 1px solid rgb(58, 61, 65);
    border-radius: 7px;
  }
}

#newPassword {
  position: relative;
  display: none;
}

#forgottenPwBtn {
  display: block;
  width: 100%;
  height: 40px;
  line-height: 40px;
  color: rgb(88, 90, 94);
  font-size: 12px;
  font-weight: 500;
  text-align: center;
}

#forgottenPwBtn:hover {
  cursor: pointer;
}

#noAccountYet_ctr, #alreadyHaveAnAccount_ctr {
  margin-top: 20px;
  display: flex;
  align-items: center;
}

.noAccountYet_line, .alreadyHaveAnAccount_line {
  flex-grow: 1;
  height: 1px;
  background: rgb(49, 51, 56);
}

.noAccountYet_string, .alreadyHaveAnAccount_string {
  display: block;
  padding: 0px 10px;
  color: white;
  font-size: 14px;
  font-weight: 500;
}

/*****************************************************SIDE LIST********************************************/
.sideList {
  list-style-type: none;
  padding: 30px 30px 0px 0px;
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.sideList>li>a {
  text-decoration: none;
  display: block;
  height: 40px;
  padding: 0px 20px;
  box-sizing: border-box;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}

.sideListItemActive {
  border-radius: 0px 7px 7px 0px;
  background: rgb(38, 40, 44);
}

.sideListItemActive svg {
  fill: rgb(4, 110, 228) !important;
}

@media screen and (min-width: 850px) {
  .sideList>li>a>span {
    display: block;
    line-height: 20px;
    color: white;
    font-size: 13.25px;
    font-weight: 600;
  }

  .sideList>li>a>svg {
    flex-shrink: 0;
    display: block;
    margin-right: 10px;
    fill: white;
  }

  #folders_shared_with_me>svg>path:nth-child(2) {
    fill: rgb(38, 40, 44);
  }

  #folders_shared_with_me>svg>path:nth-child(3) {
    fill: rgb(38, 40, 44);
  }

  .sideList>li>a:not(.sideListItemActive):hover {
    border-radius: 0px 50px 50px 0px;
    background: rgb(38, 40, 44);
  }
}

@media screen and (max-width: 849px) {
  .sideList>li>a>span {
    display: block;
    line-height: 20px;
    color: white;
    font-size: 14px;
    font-weight: 500;
  }

  .sideList>li>a>svg {
    flex-shrink: 0;
    display: block;
    margin-right: 20px;
    fill: white;
  }
}

.drive_itemDrop {
  background: rgb(38, 40, 44) !important;
  border-radius: 50px !important;
  box-shadow: 0 0 6px rgba(0, 0, 0, .2) !important;
}

.sub_list_title {
  height: 45px;
  padding: 0px 20px;
  box-sizing: border-box;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.sub_list_title_arrow {
  flex-shrink: 0;
  display: block;
  margin-right: 10px;
  fill: white;
}

.sub_list_title_arrowActive {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.sub_list_title>span {
  display: block;
  color: white;
  font-size: 14.5px;
  font-weight: 500;
}

.sideList_subList {
  display: none;
  list-style-type: none;
  padding-left: 40px;
  box-sizing: border-box;
}

.sideList_subList>li>a {
  text-decoration: none;
  display: block;
  line-height: 20px;
  margin-bottom: 10px;
  color: rgb(4, 110, 228);
  font-size: 14px;
  font-weight: 800;
  word-break: break-word;
}

.sideList_subList>li>a:hover {
  color: rgb(4, 110, 228);
}

/*****************************************************APP PATH********************************************/
#app_path_drive_root, #trashHeaderZone, #archivesHeaderZone {
  text-decoration: none;
  flex-shrink: 0;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

#app_path_master_name {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  cursor: default;
}

#app_path_master_namePicCtr {
  flex-shrink: 0;
  height: 36px;
  width: 36px;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
}

#app_path_master_namePic {
  display: block;
  height: 100%;
  width: 100%;
  opacity: 0;
}

#app_path_drive_root span, #trashHeaderZone span, #app_path_master_name span, #archivesHeaderZone span {
  margin-right: 10px;
  color: white;
  font-size: 15px;
  font-weight: 800;
}

#app_path_drive_root svg, #trashHeaderZone svg, #archivesHeaderZone svg {
  flex-shrink: 0;
  display: block;
  margin-right: 8px;
  fill: white;
}

.drive_items_list_tools_ctr {
  position: fixed;
  z-index: 2;
  top: 95px;
  right: 35px;
  height: 38px;
  background: rgb(48, 52, 56);
  border: 1px solid rgb(48, 52, 56);
  border-radius: 7px;
  box-sizing: border-box;
  display: flex;
  justify-content: flex-end;
}

.drive_items_list_tools {
  display: flex;
  align-items: center;
}

.drive_items_list_ui_selector {
  padding: 0px 3px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.drive_items_list_ui_selector_covers, .drive_items_list_ui_selector_bars {
  padding: 0px 10px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.drive_items_list_ui_selector_bars {
  flex-direction: column;
}

.drive_items_list_ui_selector_covers span {
  width: 12px;
  height: 12px;
  border-radius: 2px;
  background: white;
}

.drive_items_list_ui_selector_bars span {
  width: 12px;
  height: 1px;
  border-radius: 7px;
  background: white;
  margin: 1.5px 0px;
}

#drive_items_list_tools_menu_ctr {
  position: relative !important;
  height: 28px !important;
  padding-right: 10px;
}

#drive_items_list_tools_menu_ctr .menu_dot {
  background: white !important;
}

#drive_items_list_tools_menu {
  display: none;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 3;
  width: 150px;
  padding-bottom: 10px;
  box-sizing: border-box;
  background: rgb(38, 40, 44);
  border-radius: 4px;
  border: 1px solid rgb(58, 61, 65);
  box-shadow: 0 0 8px rgba(4, 6, 12, .2);
}

.drive_sort_by_title {
  display: block;
  height: 40px;
  line-height: 40px;
  border-bottom: 1px solid rgb(58, 61, 65);
  color: rgb(4, 110, 227);
  font-size: 13px;
  font-weight: 800;
  text-align: center;
  cursor: default;
}

.drive_sort_by_selector_ctr, .reorder_drive_items {
  height: 40px;
  padding: 0px 10px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.reorder_drive_items {
  height: 50px;
  border-bottom: 1px solid rgb(58, 61, 65);
}

[data-sort_req=partial_load] {
  display: none;
}

.drive_sort_by_selector_ctr svg, .reorder_drive_items svg {
  flex-shrink: 0;
  display: block;
  margin-right: 10px;
}

.drive_sort_by_selector, .reorder_drive_items span {
  color: white;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

.drive_sort_by_selectorActive {
    fill: rgb(4, 110, 228) !important;
}

.reorder_drive_items_db_ctr {
  display: none;
}

.reorder_drive_items_db {
  display: flex;
  align-items: center;
}

.reorder_drive_items_db button {
  width: 85px;
  height: 36px;
  margin: 0;
  padding: 0;
  border-radius: 0;
  font-size: 13px;
  background: none;
  border-radius: 7px;
  color: white;
  cursor: pointer;
}

.reorder_drive_items_db button:hover {
  background: rgb(77, 80, 84) !important;
}

.drive_sort_by_selector_ctr:hover, .reorder_drive_items:hover {
  cursor: pointer;
  background: rgb(48, 51, 56);
}

@media screen and (min-width: 850px) {
  #app_path, #trash_path, #archives_path {
    height: 38px;
    display: flex;
    align-items: center;
  }

  #app_path {
    padding: 30px 30px 0px 30px;
  }

  #trash_path, #archives_path {
    padding: 30px;
  }

  .drive_header_zone {
    width: 100%;
    display: flex;
    align-items: center;
  }

  .drive_header_zone svg {
    display: none;
  }

  .drive_header_zone_title {
    margin-left: 30px;
    color: rgb(4, 110, 228);
    font-size: 15px;
    font-weight: 800;
  }

  #drive_items_list_tools_menu_ctr:hover .menu_dot, .drive_items_list_ui_selector_covers:hover span, .drive_items_list_ui_selector_bars:hover span {
    background: rgb(4, 110, 228) !important;
  }

  #app_path_drive_root:hover span, #trashHeaderZone:hover span, #archivesHeaderZone:hover span {
    color: rgb(4, 110, 228);
  }

  #app_path_drive_root:hover svg, #trashHeaderZone:hover svg, #archivesHeaderZone:hover svg {
    fill: rgb(4, 110, 228);
  }
}

@media screen and (max-width: 849px) {
  #app_path {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }

  #trash_path {
    padding: 20px 0px 10px 0px;
  }

  #empty_trash_ctr, #empty_trash_ctr .formMiniBtnColor {
    margin: 0;
  }

  .drive_header_zone_ctr {
    display: none;
  }

  #app_path_drive_root, #trashHeaderZone, #archivesHeaderZone {
    display: none;
  }

  .drive_items_list_tools_ctr {
    display: none;
  }
}

#app_path_list {
  flex-grow: 1;
  display: flex;
  align-items: center;
}

#app_path_list svg {
  flex-shrink: 0;
  display: block;
  margin: 0px 4px;
}

#app_path svg, #app_path_list svg {
  fill: white;
}

#app_path_list a {
  text-decoration: none;
  flex-shrink: 0;
  padding: 8px;
  box-sizing: border-box;
  border-radius: 7px;
  color: white;
  font-size: 14px;
  font-weight: 400;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#app_path_list a:not(.drive_itemDrop):hover {
  background: rgb(48, 51, 56);
}

#empty_trash_ctr {
  margin: 0px 20px;
}

/*****************************************************DRIVE********************************************/
#driveZone {
  height: 100%;
}

@media screen and (min-width: 850px) {
  #driveZone {
    padding-left: 10px;
    box-sizing: border-box;
  }
}

#new_el_zone {
  position: relative;
  margin: 30px 30px 0px 20px;
  cursor: pointer;
}

#new_el_btn {
  height: 38px;
  padding: 0px 20px;
  box-sizing: border-box;
  background: rgb(4, 110, 228);
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.new_el_btnActive {
  border-radius: 8px 8px 0px 0px !important;
}

#new_el_btn span {
  color: white;
  font-size: 15px;
  font-weight: 800;
}

#new_el_btn_arrow {
  flex-shrink: 0;
  display: block;
}

.new_el_btn_arrowActive {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

#new_el_list {
  display: none;
  list-style-type: none;
  position: absolute;
  z-index: 2;
  top: 38px;
  left: 0;
  width: 100%;
  padding-bottom: 8px;
  border-radius: 0px 0px 8px 8px;
  background: rgb(4, 110, 228);
  overflow: hidden;
}

#new_el_list li {
  height: 38px;
  line-height: 38px;
  padding: 0px 20px;
  box-sizing: border-box;
  background: rgb(4, 110, 228);
  color: white;
  font-size: 15px;
  font-weight: 600;
}

#new_el_list li:hover {
  background: rgb(32, 138, 255);
}

#hard_disk_zone {
  padding: 12.5px 30px;
  box-sizing: border-box;
  cursor: default;
}

#hard_disk_zone_title {
  display: inline-block;
  color: white;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
}

#hard_disk_data_ctr {
  position: relative;
  width: 100%;
  height: 8px;
  background: white;
  border-radius: 2px;
  margin: 15px 0px 10px 0px;
  overflow: hidden;
}
#hard_disk_data_ctr {
  background: rgb(38, 40, 44);
}

#hard_disk_data {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0;
  background: rgb(4, 110, 228);
}

#hard_drive_data_loading, #hard_disk_data_left {
  display: block;
  line-height: 20px;
  margin-bottom: 10px;
  color: white;
  font-size: 12px;
  font-weight: 500;
  word-break: break-word;
}

#hard_disk_data_left {
  display: none;
}

#drive_subscribe_mention, #trial_left_sb_mention {
  display: block;
  line-height: 20px;
  color: rgb(4, 110, 228);
  font-size: 12px;
  font-weight: 500;
}

#drive_subscribe_mention {
  text-decoration: none;
}

#drive_subscribe_mention:hover {
  color: rgb(24, 130, 248);
}

@media screen and (min-width: 850px) {
  .drive_items_list_zone {
    position: relative;
  }

  .drive_items_list {
    list-style-type: none;
    padding: 15px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
  }

  .drive_items_list[data-dil_owner=true] {
    cursor: crosshair;
  }

  .drive_items_list_sortable_cursor {
    cursor: default !important;
  }

  .drive_items_list_bars {
    list-style-type: none;
    padding: 30px 30px 40px 30px;
    box-sizing: border-box;
  }

  .drive_items_list li, .drive_items_list_bars li {
    position: relative;
  }

  .drive_items_list_bars li {
    background: rgb(38, 40, 44);
  }

  .drive_items_list_li_active {
    background: rgb(48, 51, 56);
  }

  .drive_items_list a, .trash_item_ctr {
    position: relative;
    display: block;
    width: 200px;
    height: 200px;
    margin: 15px;
    border: 1px solid rgb(58, 61, 65);
    border-radius: 7px;
    overflow: hidden;
  }

  .drive_items_list a {
    text-decoration: none;
  }

  .trash_item_ctr:hover, .trash_item_ctr_bars:hover {
    cursor: default;
  }

  .drive_items_list_bars a, .trash_item_ctr_bars {
    position: relative;
    text-decoration: none;
    height: 75px;
    padding: 0px 15px 0px 8px;
    box-sizing: border-box;
    border-bottom: 1px solid rgb(58, 61, 65);
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .drive_items_zone1 {
    position: relative;
    width: 100%;
    height: 100%;
  }

  .drive_items_bars_zone1 {
    flex-grow: 1;
    max-width: calc(100% - 65px);
    display: flex;
    align-items: center;
  }

  .drive_items_listActive {
    box-shadow: 0 1px 8px rgba(4, 6, 12, .2);
  }

  .drive_itemCover_ctr {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .drive_itemCover_bars_ctr {
    position: absolute;
    z-index: 1;
    top: 7px;
    left: 8px;
    width: 60px;
    height: 60px;
    border-radius: 6px;
    overflow: hidden;
    cursor: default;
  }

  [data-dil_owner=true] .drive_itemCover_bars_ctr {
    cursor: -webkit-grab;
    cursor: grab;
  }

  .drive_itemCover {
    position: relative;
    width: 100%;
    height: 100%;
  }

  .fb-bg_img {
    border-radius: 7px;
  }

  .drive_item_defaultCover {
    flex-shrink: 0;
    position: relative;
    width: 100%;
    height: 100%;
    background: rgb(48, 51, 56);
    border-radius: 6px;
  }

  .drive_item_defaultCover svg {
    flex-shrink: 0;
    display: block;
    position: absolute;
    width: 65px;
    height: 65px;
    top: calc(50% - 32.5px);
    left: calc(50% - 32.5px);
  }

  .drive_item_defaultCover_bars {
    flex-shrink: 0;
    position: relative;
    width: 60px;
    height: 60px;
    background: rgb(48, 51, 56);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: default;
  }

  [data-dil_owner=true] .drive_itemCover_bars_ctr, [data-dil_owner=true] .drive_item_defaultCover_bars {
    cursor: -webkit-grab;
    cursor: grab;
  }

  .drive_item_defaultCover_bars svg {
    flex-shrink: 0;
    display: block;
    width: 30px;
    height: 30px;
  }

  .drive_item_info {
    position: absolute;
    z-index: 1;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    background: rgba(38, 40, 44, .9);
    cursor: default;
  }

  [data-dil_owner=true] .drive_item_info {
    cursor: -webkit-grab;
    cursor: grab;
  }

  .drive_item_info_bars {
    min-width: 0;
    flex-grow: 1;
    padding: 10px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
  }

  .drive_item_info_names_bars {
    min-width: 0;
    flex-grow: 1;
    display: flex;
  }

  [data-dil_owner=true] .drive_item_info:active, [data-dil_owner=true] .drive_item_defaultCover_bars:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
  }

  .drive_item_name, .drive_item_artistName, .item_info_delimiter, .drive_item_date {
    display: block;
    padding: 2.5px 0px;
    color: white;
    font-size: 12px;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  .drive_item_name {
    font-weight: 800;
  }

  .item_info_delimiter {
    margin: 0px 4px;
  }

  .drive_item_info_bars .drive_item_name, .drive_item_info_bars .drive_item_artistName {
    max-width: calc(50% - 6px);
  }

  .drive_item_date {
    width: 65px;
    font-size: 10.5px;
  }

  [data-app_mobile_btn=drive_item_menu], [data-app_mobile_btn=item_menu], [data-app_mobile_btn=plus] {
    display: none;
  }
}

.console_paywall_info {
  position: absolute;
  z-index: 2;
  top: 7px;
  right: 7px;
  padding: 5px;
  background: rgba(48, 51, 56, .9);
  border: 1px solid rgb(58, 61, 65);
  border-radius: 4px;
}

.console_paywall_price {
  display: block;
  color: white;
  font-size: 11px;
  font-weight: 600;
}

.console_paywall_info_bars {
  position: absolute;
  z-index: 2;
  top: 10px;
  left: 10px;
}

.console_paywall_icon {
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgb(4, 110, 228);
  border: 1px solid white;
}

@media screen and (max-width: 849px) {
  .drive_items_list_zone {
    position: relative;
  }

  .drive_items_list {
    list-style-type: none;
    padding-bottom: 90px;
  }

  #child_zones {
    position: relative;
    height: calc(100% - 109px);
    display: flex;
  }

  #child_folders_zone, #child_players_zone, #child_files_zone {
    flex: 1 0 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .drive_items_list li {
    position: relative;
  }

  .drive_items_list a, .trash_item_ctr {
    display: block;
    position: relative;
    width: 100vw;
    height: 70vw;
    padding: 15px 15px 0px 15px;
    box-sizing: border-box;
    overflow: hidden;
  }

  .drive_items_list a {
    text-decoration: none;
  }

  #itemHeader_ctr {
    width: 100%;
    overflow: hidden;
  }

  #itemHeader {
    position: relative;
    height: 64px;
  }

  .drive_items_zone1 {
    position: relative;
    width: 100%;
    height: 100%;
  }

  #itemHeader_coverZone {
    height: 100%;
  }

  .drive_itemCover_ctr, #itemHeaderCover_ctr {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 7px;
    overflow: hidden;
  }

  #itemHeaderCover_ctr {
    border-radius: 0px;
  }

  .drive_itemCover {
    position: relative;
    width: 100%;
    height: 100%;
  }

  .drive_itemCover .fb-bg_img {
    background-position: top !important;
  }

  .drive_item_defaultCover {
    flex-shrink: 0;
    position: relative;
    width: 100%;
    height: 100%;
    background: rgb(48, 51, 56);
    border-radius: 7px;
    overflow: hidden;
  }

  .drive_item_defaultCover svg {
    flex-shrink: 0;
    display: block;
    position: absolute;
    width: 70px;
    height: 70px;
    top: calc(50% - 35px);
    left: calc(50% - 35px);
  }

  #itemHeader_coverZone .drive_item_defaultCover {
    background: rgb(178, 181, 186);
    border-radius: 0px;
  }

  #itemHeader_coverZone .drive_item_defaultCover svg {
    display: none;
  }

  .drive_item_info, #itemHeaderDataZone {
    position: absolute;
    z-index: 1;
    left: 0;
    bottom: 0;
    width: 100%;
    background: rgba(38, 40, 44, .88);
    padding: 12px 15px;
    box-sizing: border-box;
  }

  .drive_item_info {
    border-radius: 0 0 5px 5px;
  }

  .drive_item_info, #itemHeaderNameZone {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  #itemHeaderDataZone {
    height: 100%;
  }

  .drive_item_info_names, #itemHeader_info_names {
    min-width: 0;
  }

  .drive_item_name, .drive_item_artistName, #itemHeaderNameZone_string1, #itemHeaderNameZone_string2, #itemHeaderNameZone_string4 {
    display: block;
    color: white;
    font-size: 14px;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  #itemHeaderNameZone_string1 {
    font-size: 18px;
  }

  #itemHeaderNameZone_string2 {
    font-weight: 400;
  }

  .drive_item_name, #itemHeaderNameZone_string1 {
    font-weight: 800;
  }

  #itemHeaderNameZone_string3, #itemHeaderNameZone_string4 {
    display: none;
  }

  [data-app_mobile_btn=plusCtr] {
    position: fixed;
    z-index: 1;
    bottom: 15px;
    right: 15px;
    width: 60px;
    height: 60px;
    opacity: 1;
    box-shadow: 0 2px 8px rgba(8, 10, 14, .2);
    border-radius: 50%;
    overflow: hidden;
  }

  [data-app_mobile_btn=plusCtr]:hover {
    cursor: pointer;
  }

  [data-app_mobile_btn=plus] {
    width: 100%;
    height: 100%;
    background: linear-gradient(-45deg, rgb(4, 110, 228), rgb(14, 120, 237));
    display: flex;
    align-items: center;
    justify-content: center;
  }

  [data-app_mobile_btn=plus] span {
    position: relative;
    color: white;
    font-size: 58px;
    font-weight: 400;
  }

  .data-app_mobile_btn_glue_70 {
    bottom: 70px;
    transition: bottom 0.25s ease;
  }

  .hide_data-app_action_btn {
    z-index: -1;
    opacity: 0;
    transition: opacity 0.25s ease;
  }

  .drive_no_data {
    display: block;
    padding: 40px 20px;
    color: white;
    font-size: 12px;
    font-weight: 500;
    font-style: italic;
    text-align: center;
  }

  [data-app_mobile_btn=drive_item_menu], [data-app_mobile_btn=item_menu] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 20px;
    margin-left: 20px;
  }

  [data-app_mobile_btn=drive_item_menu] .menu_dot, [data-app_mobile_btn=item_menu] .menu_dot {
    background: white;
    margin: 1px;
  }

  .drive_load_next_zone_ctr {
    width: 100%;
    background: rgb(48, 51, 56);
    display: flex;
    justify-content: center;
  }

  @media only screen and (orientation: portrait) {
    .drive_load_next_zone_ctr {
      padding-bottom: env(safe-area-inset-bottom);
    }
  }

  .drive_load_next_zone {
    display: flex;
    align-items: center;
    padding: 20px;
  }

  .drive_load_next_zone svg {
    flex-shrink: 0;
    display: block;
    margin-right: 10px;
    fill: white;
  }

  .drive_load_next_zone span {
    color: white;
    font-size: 13px;
    font-weight: 600;
  }

  #mobileAi_app_subMenu {
    list-style-type: none;
    background: rgb(38, 40, 44);
    display: flex;
    align-items: center;
  }

  #mobileAi_app_subMenu li {
    width: 50%;
    height: 45px;
    line-height: 45px;
    color: white;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    text-transform: uppercase;
  }

  .itemCustomLink_btn>svg>path {
    stroke: white;
  }

  #mobileAi_app_subMenu li:hover {
    cursor: pointer;
  }

  .mobileAi_app_subMenu_liActive {
    color: rgb(4, 110, 228) !important;
  }

  #itemHeaderBtnsZone {
    display: none;
  }
}

@media screen and (min-width: 850px) {
  .item_data_list {
    list-style-type: none;
    position: relative;
    margin: 0px 30px;
  }

  .item_data_list li {
    display: flex;
  }

  .item_data_list a {
    flex-grow: 1;
    text-decoration: none;
    padding: 10px;
    box-sizing: border-box;
    border-bottom: 1px solid rgb(58, 61, 65);
    display: flex;
    align-items: center;
  }

  .item_data_list a:hover {
    background: rgb(48, 51, 56);
  }

  .item_data_list_cover_ctr {
    position: relative;
    width: 60px;
    height: 60px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .item_data_list_cover_outer {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .item_data_list_cover_inner {
    position: relative;
  }

  .item_data_list_cover_inner img {
    flex-shrink: 0;
    display: block;
    width: 100%;
    height: 100%;
  }

  .item_data_list_defaultCover {
    flex-shrink: 0;
    position: relative;
    width: 100%;
    height: 100%;
    background: rgb(48, 51, 56);
  }

  .item_data_list_defaultCover svg {
    flex-shrink: 0;
    display: block;
    position: absolute;
    width: 30px;
    height: 30px;
    top: calc(50% - 15px);
    left: calc(50% - 15px);
  }

  .item_data_list_name {
    color: white;
    font-size: 12px;
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  #mobile_plus_btn {
    display: none;
  }

  .drive_no_data {
    display: block;
    padding: 40px 30px;
    color: white;
    font-size: 12px;
    font-weight: 500;
    font-style: italic;
  }

  .drive_load_next_zone_ctr {
    width: 100%;
    padding: 0px 0px 30px 30px;
    display: flex;
    align-items: center;
  }

  .drive_load_next_zone {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    margin-right: 20px;
    background: rgb(48, 51, 56);
    border: 1px solid rgb(58, 61, 65);
    border-radius: 7px;
  }

  .drive_load_next_zone svg {
    flex-shrink: 0;
    display: block;
    margin-right: 10px;
    fill: white;
  }

  .drive_load_next_zone span {
    color: white;
    font-size: 13px;
    font-weight: 600;
  }

  .drive_load_next_zone:hover {
    background: rgb(4, 110, 228);
    border: 1px solid rgb(4, 110, 228);
    cursor: pointer;
  }

  .drive_load_next_zone:hover span {
    color: white;
  }

  .drive_load_next_zone:hover svg {
    fill: white;
  }

  #mobileAi_app_subMenu {
    display: none;
  }
}

.drive_item_selected_blue {
  z-index: 1;
  background: rgb(4, 110, 228);
}

.drive_item_selected_red {
  z-index: 1;
  background: rgb(246, 20, 71);
}

.drive_item_selected_orange {
  z-index: 1;
  background: rgb(252, 144, 11);
}

.drive_item_selected_blue svg,
.drive_item_selected_red svg,
.drive_item_selected_orange svg {
  fill: white;
}


.drive_bar_item_selected {
  background: rgb(48, 51, 56) !important;
}

.isSynkro {
  position: absolute;
  z-index: 1;
  right: 6px;
  top: 6px;
  width: 8px;
  height: 8px;
  border-radius: 7px;
  background: rgb(252 ,144, 11);
}

/***************************************************** ITEM MENU ********************************************/
.item_menu {
  display: none;
  list-style-type: none;
  position: absolute;
  left: 0;
  z-index: 3;
  padding: 20px 0px;
  box-sizing: border-box;
  background: rgb(38, 40, 44);
  border-radius: 7px;
  box-shadow: 0 0 8px rgba(4, 6, 12, .2);
  border: 1px solid rgb(58, 61, 65);
}

.item_menu>li {
  position: relative;
  height: 50px;
  padding: 0px 25px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.item_menu>li>svg {
  flex-shrink: 0;
  display: block;
  margin-right: 20px;
  fill: white;
}

.show_in_files_system svg>path:nth-child(2){
  fill: rgb(38, 40, 44);
}

.show_in_files_system svg>path:nth-child(3){
  fill: white;
}

.file_item_menu_blank {
  display: none !important;
}

@media screen and (min-width: 850px) {
  .item_menu {
    min-width: 265px;
    top: 0;
  }

  .item_menu>li>span, .item_menu>li>a {
    display: block;
    height: 50px;
    line-height: 50px;
    color: white;
    font-size: 13.5px;
    font-weight: 600;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  .item_menu>li>a {
    text-decoration: none;
  }

  .item_menu>li:hover {
    background: rgb(48, 51, 56);
    cursor: pointer;
  }
}

@media screen and (max-width: 849px) {
  .item_menu {
    width: 100%;
    max-height: 68vh;
    bottom: 0;
    border-radius: 8px 8px 0px 0px;
    box-shadow: none;
    border: none;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  .item_menu>li>a {
    text-decoration: none;
    flex-grow: 1;
    display: flex;
    align-items: center;
  }

  .item_menu>li>span, .item_menu>li>a>span {
    display: block;
    height: 50px;
    line-height: 50px;
    color: white;
    font-size: 13.5px;
    font-weight: 600;
    white-space: nowrap;
  }

  .item_menu>li>a>svg {
    flex-shrink: 0;
    display: block;
    margin-right: 25px;
  }

  .item_menu>li>a>svg>path {
    stroke: white;
  }
}

#footer_item_menu_zone {
  display: none;
  position: fixed;
  z-index: 10;
  left: 0;
  bottom: 0;
  width: 100vw;
  height: 100%;
  background: rgba(0, 10, 22, .68);
}

#footer_item_menu {
  position: fixed;
  z-index: 10;
  left: 0;
  bottom: 0;
  width: 100%;
}

#footer_item_menu #player_write_message_zone, #footer_item_menu .fbap_answer_comment_zone, #footer_item_menu #fbap_write_comment_zone {
  background: rgb(38, 40, 44);
}

#footer_item_menu .formInputCtr {
  padding: 0;
  background: rgb(38, 40, 44);
}

/***************************************************** ITEM HEADER ********************************************/
#btnsZone_itemName_ctr {
  min-width: 0;
  display: none;
  flex: 1;
}

@media screen and (min-width: 850px) {
  #itemHeader_ctr {
    margin: 30px 0px 30px 30px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgb(58, 61, 65);
  }

  #itemHeader {
    padding-bottom: 15px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }

  #itemHeader_coverZone {
    flex-shrink: 0;
    position: relative;
    width: 200px;
    height: 200px;
    margin-right: 30px;
    border: 1px solid rgb(38, 40, 44);
    border-radius: 7px;
    overflow: hidden;
  }

  #itemHeaderCover_ctr {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  #itemHeaderDataZone {
    min-width: 0;
  }

  #itemHeader_info_names {
    margin: 30px 30px 15px 0px;
    display: flex;
    flex-direction: column;
  }

  #itemHeaderNameZone_string1, #itemHeaderNameZone_string2, #itemHeaderNameZone_string3, #itemHeaderNameZone_string4 {
    margin-bottom: 5px;
    color: white;
    font-size: 22px;
    font-weight: 800;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  #itemHeaderNameZone_string2 {
    font-size: 16px;
    font-weight: 400;
  }

  #itemHeaderNameZone_string3 {
    font-size: 14px;
    font-weight: 400;
    color: rgb(4, 110, 228);
    cursor: pointer;
  }

  #itemHeaderNameZone_string4 {
    font-size: 14px;
    font-weight: 400;
    font-style: italic;
    padding-right: 15px;
  }

  #btnsZone_itemName {
    padding-right: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }

  #btnsZone_itemName span {
    color: white;
    font-size: 16px;
    font-weight: 800;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  #itemHeaderBtnsZone {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }

  #itemHeaderBtnsZone .formBtnGrey,
  #itemHeaderBtnsZone .linkBtnGrey,
  #itemHeaderBtnsZone .formBtnColor {
    width: 160px;
    padding: 0px 10px;
    margin: 15px 15px 15px 0px;
    font-size: 14px;
  }

  [data-type=plusMenu] {
    border: none;
    background: rgb(48, 51, 56);
    width: 168px;
    margin: 15px 15px 15px 0px;
    border-radius: 7px;
    border: 1px solid transparent;
  }

  [data-type=plusMenu].selectBox_fb_opened {
    border-left: 1px solid rgb(58, 61, 68);
    border-right: 1px solid rgb(58, 61, 68);
    border-top: 1px solid rgb(58, 61, 68);
  }

  [data-type=plusMenu] > .selectBoxHeader span {
    font-weight: 800;
  }

  [data-type=plusMenu] > .selectBoxList {
    left: -1px;
    border: none;
    background: rgb(48, 51, 56);
    border-left: 1px solid rgb(58, 61, 68);
    border-right: 1px solid rgb(58, 61, 68);
    border-bottom: 1px solid rgb(58, 61, 68);
  }

  [data-type=plusMenu] > .selectBoxList>span:hover {
    background: rgb(58, 61, 68);
  }
}

/***************************************************** ITEM PASSWORD ********************************************/
#pw_form_ctr .iw_red_string {
  width: 100%;
  height: 40px;
  line-height: 40px;
  padding: 0px 10px;
  box-sizing: border-box;
}

#pw_form_ctr .formInput {
  color: rgb(4, 110, 228);
}

/***************************************************** IW LIST ********************************************/
.iW_list, .iW_list_sub {
  list-style-type: none;
}

.iW_list, .iW_list_2btns, .iW_list_3btns, .audio_groups_list {
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.iW_list {
  height: calc(100% - 195px);
}

.iW_list_2btns, .audio_groups_list {
  height: calc(100% - 202px);
}

.iW_list_3btns {
  height: calc(100% - 258px);
}

.iW_list_sub {
  display: none;
  padding-left: 15px;
}

.iW_list>li, .iW_list_2btns>li, .audio_groups_list>li, .iW_list_3btns>li, .iW_list_sub>li {
  display: block;
}

.iW_list_liActive {
  background: rgb(48, 51, 56);
}

.iW_list_topBlock {
  padding: 10px;
  box-sizing: border-box;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.audio_groups_list .iW_list_topBlock {
  padding: 10px 0px;
}

.iW_list_leftBlock, .iW_list_rightBlock {
  display: flex;
  align-items: center;
}

.iW_list_leftBlock {
  flex-grow: 1;
}

.iW_list_leftBlock .formInputCtr {
  padding: 0;
}

.iW_list_leftBlock .formInput_underline {
  bottom: 0;
}

.iW_list_rightBlock svg {
  flex-shrink: 0;
  display: block;
  padding: 8px;
  cursor: pointer;
}

.edit_audio_group {
  margin-left: 10px;
}

.iWlist_coverZone {
  flex-shrink: 0;
  position: relative;
  width: 60px;
  height: 60px;
  margin-right: 15px;
}

.iWlist_itemCover_ctr {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 7px;
  overflow: hidden;
}

.iWlist_itemCover {
  position: relative;
  width: 100%;
  height: 100%;
}

.iWlist_item_defaultCover {
  flex-shrink: 0;
  position: relative;
  width: 100%;
  height: 100%;
  background: rgb(48, 51, 56);
  border-radius: 7px;
}

.iWlist_item_defaultCover svg {
  flex-shrink: 0;
  display: block;
  position: absolute;
  width: 30px;
  height: 30px;
  top: calc(50% - 15px);
  left: calc(50% - 15px);
}

.iWlist_item_groupIcon {
  flex-shrink: 0;
  margin-right: 8px;
  cursor: default;
}

.iWlist_item_groupIcon svg {
  flex-shrink: 0;
  display: block;
  fill: white;
}

#move_to_drive svg {
  flex-shrink: 0;
  display: block;
  position: absolute;
  width: 18px;
  height: 18px;
  top: calc(50% - 9px);
  left: calc(50% - 9px);
}

.subList_opener {
  flex-shrink: 0;
  display: block;
  padding: 15px;
}

.iW_list_sub_opened {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.iW_list>li span, .iW_list_2btns>li span, .audio_groups_list>li span, .iW_list_3btns>li span, .iW_list_sub>li span {
  display: block;
  color: white;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.audioGroup_name_selected {
  color: rgb(4, 110, 228) !important;
  font-weight: 800 !important;
}

@media screen and (min-width: 850px) {
  .iW_list>li span, .iW_list_2btns>li span, .audio_groups_list>li span, .iW_list_3btns>li span, .iW_list_sub>li span {
    font-size: 13.5px;
    font-weight: 600;
  }

  .iW_list>li:hover, .iW_list_2btns>li:hover, .iW_list_3btns>li:hover, .iW_list_sub>li:hover {
    cursor: pointer;
  }

  .iW_list_rightBlock svg:hover {
    fill: rgb(4, 110, 228);
  }
}

@media screen and (max-width: 849px) {
  .iW_list>li span, .iW_list_2btns>li span, .audio_groups_list>li span, .iW_list_3btns>li span, .iW_list_sub>li span {
    font-size: 14px;
    font-weight: 600;
  }
}

#moveTo_newFolderZone, #copyTo_newPlayerZone {
  display: none;
}

#copyTo_form, #moveItems_form, #set_recipients_form, #reorder_form, #audio_groups_manager_form {
  height: calc(100% - 25px);
}

#copyTo_form button, #moveItems_form button, #audio_groups_manager_form button {
  margin: 8px 0px;
}

.rf_file, .rf_audio_group {
  padding: 20px 0px;
  margin-right: 15px;
  background: rgb(38, 40, 44);
  border-bottom: 1px solid rgb(58, 61, 65);
  cursor: default !important;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
}

.rf_file {
  flex-wrap: wrap;
}

.rf_audio_group {
  border: none;
  margin: 0;
  padding: 15px 0px;
}

#reorder_form .iW_list>li span {
  flex: 1;
}

.rf_file:active, .rf_audio_group:active {
  cursor: grabbing !important;
  cursor: -moz-grabbing !important;
  cursor: -webkit-grabbing !important;
}

.rf_audio_group_files_list {
  list-style-type: none;
  display: none;
  width: 100%;
  padding: 15px 0px 0px 15px;
  box-sizing: border-box;
}

.rf_show_audio_group {
  flex-shrink: 0;
  display: block;
  padding: 0px 10px;
  cursor: pointer;
}

.audio_group_files_list {
  display: none;
  padding: 0px 8px;
  box-sizing: border-box;
}

.rf_file_sorter {
  flex: 0 0 auto !important;
  width: 18px;
  height: 18px;
  background: rgb(48, 51, 56);
  border-radius: 50%;
  margin-right: 15px;
  cursor: ns-resize;
}

/***************************************************** FILES TRANSFER ********************************************/
#fb_transfer_zone {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media screen and (max-width: 849px) {
  #fb_transfer_zone_top {
    flex-shrink: 0;
    padding: 30px;
    box-sizing: border-box;
  }

  #fb_transfer_zone_bot, #drag_n_drop_zone, #drag_n_drop_mention {
    display: none;
  }
}

@media screen and (min-width: 850px) {
  #fb_transfer_zone_top {
    flex-shrink: 0;
    padding: 40px 40px 15px 40px;
    box-sizing: border-box;
  }

  #fb_transfer_zone_bot {
    flex: 0 0 188px;
    background: rgb(48, 51, 56);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.25s ease;
  }

  .active_dropZone {
    background: rgb(4, 110, 228) !important;
    transition: background 0.25s ease;
  }

  .active_dropZone .drag_n_drop_mention {
    color: white !important;
  }

  .drag_n_drop_mention {
    color: rgb(4, 110, 228);
    font-size: 15px;
    font-weight: 800;
    pointer-events: none;
  }
}

#files_list {
  display: none;
}

#app_transfer_files_btn {
  display: none;
}

#transfer_progress_zone {
  flex: 0;
  position: relative;
  z-index: 2;
  background: rgb(48, 51, 56);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  transition: flex-basis 0.25s ease;
}

@media screen and (min-width: 850px) {
  .tpz_expanded_mini {
    flex-basis: 65px !important;
    transition: flex-basis 0.25s ease;
  }

  .tpz_expanded {
    flex-basis: 325px !important;
    transition: flex-basis 0.5s ease;
  }
}

@media screen and (max-width: 849px) {
  .tpz_expanded_mini {
    flex-basis: 103px !important;
    flex-shrink: 0 !important;
    transition: flex-basis 0.25s ease;
    padding-top: calc(64px + env(safe-area-inset-top));
    margin-bottom: calc(-64px - env(safe-area-inset-top));
  }

  .tpz_expanded {
    flex-basis: 50% !important;
    transition: flex-basis 0.5s ease;
    padding-top: calc(64px + env(safe-area-inset-top));
    margin-bottom: calc(-64px - env(safe-area-inset-top));
  }
}

#transfer_progress_zone_counter {
  position: fixed;
  z-index: 1;
  top: 65px;
  padding: 5px 10px;
  background: rgb(4, 110, 228);
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

#transfer_progress_zone_counter svg {
  flex-shrink: 0;
  display: block;
  margin-right: 8px;
}

.transfer_progress_zone_counterActive {
  -webkit-transform: rotate(180deg) !important;
  -moz-transform: rotate(180deg) !important;
  -o-transform: rotate(180deg) !important;
  -ms-transform: rotate(180deg) !important;
  transform: rotate(180deg) !important;
}

#transfer_progress_zone_counter span {
  color: white;
  font-size: 12.5px;
  font-weight: 600;
}

#transfer_progress_zone_counter:hover {
  cursor: pointer;
}

@media screen and (min-width: 850px) {
  #transfer_progress_zone_counter {
    left: 50%;
    transform: translateX(-50%);
    border-radius: 0px 0px 4px 4px;
  }
}

@media screen and (max-width: 849px) {
  #transfer_progress_zone_counter {
    right: 0;
    border-radius: 0px 0px 0px 4px;
  }

  #transfer_progress_zone_counter svg {
    display: none;
  }
}

.transfer_bar, .synkro_bar {
  position: relative;
  border-bottom: 1px solid rgb(58, 61, 65);
  display: flex;
}

@media screen and (min-width: 850px) {
  .transfer_bar, .synkro_bar {
    height: 64px;
  }
}

@media screen and (max-width: 849px) {
  .transfer_bar, .synkro_bar {
    flex-wrap: wrap;
    padding-bottom: 20px;
  }
}

.transfer_bar_leftZone, .transfer_bar_rightZone, .transfer_bar_rightZone_data_and_btns, .synkro_bar_leftZone, .synkro_bar_rightZone, .synkro_bar_rightZone_data_and_btns {
  flex-grow: 1;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.transfer_bar_rightZone_success_icon, .transfer_bar_rightZone_checking, .synkro_bar_rightZone_success_icon, .synkro_bar_rightZone_checking {
  display: none;
  padding-right: 15px;
}

.transfer_bar_rightZone_success_icon_inner, .transfer_bar_rightZone_checking_inner, .synkro_bar_rightZone_success_icon_inner, .synkro_bar_rightZone_checking_inner {
  display: flex;
  align-items: center;
}

.transfer_bar_rightZone_success_icon span, .transfer_bar_rightZone_checking span, .synkro_bar_rightZone_success_icon span, .synkro_bar_rightZone_checking span {
  min-width: 0;
  margin-right: 15px;
  color: white;
  font-size: 13px;
  font-weight: 500;
  font-family: "Lato", "Helvetica", "Arial", sans-serif !important;
  cursor: default;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.transfer_bar_rightZone_success_icon svg, .synkro_bar_rightZone_success_icon svg {
  flex-shrink: 0;
  display: block;
}

.close_transfer_bar, .close_synkro_bar {
  width: 20px;
  height: 20px;
  fill: white;
}

.close_transfer_bar:hover , .close_synkro_bar:hover {
  cursor: pointer;
}

.transfer_bar_rightZone_checking_loader, .synkro_bar_rightZone_checking_loader {
  position: relative;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
}

@media screen and (min-width: 850px) {
  .transfer_bar_leftZone, .synkro_bar_leftZone {
    max-width: 40%;
    padding-left: 20px;
  }

  .transfer_bar_rightZone, .synkro_bar_rightZone {
    max-width: 60%;
    padding-left: 20px;
  }

  .transfer_bar_rightZone, .transfer_bar_rightZone_data_and_btns, .synkro_bar_rightZone, .synkro_bar_rightZone_data_and_btns {
    justify-content: flex-end;
  }
}

@media screen and (max-width: 849px) {
  .transfer_bar_leftZone, .transfer_bar_rightZone, .synkro_bar_leftZone, .synkro_bar_rightZone {
    width: 100%;
    padding: 20px 20px 0px 20px;
  }

  .transfer_bar_rightZone, .synkro_bar_rightZone {
    flex-wrap: wrap;
  }

  .transfer_bar_rightZone_checking, .synkro_bar_rightZone_checking {
    height: 42px;
    padding: 0;
  }

  .transfer_bar_rightZone_checking span, .synkro_bar_rightZone_checking span {
    white-space: normal;
    line-height: 18px;
  }
}

.transfer_string, .transfer_string12, .transfer_success_string, .synkro_string, .synkro_string12, .synkro_success_string {
  min-width: 0;
  margin-right: 20px;
  color: white;
  font-size: 13px;
  font-weight: 500;
  cursor: default;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.transfer_string12, .synkro_string12 {
  font-family: "Lato", "Helvetica", "Arial", sans-serif !important;
  font-size: 12px;
}

.transfer_success_string, .synkro_success_string {
  display: none;
}

.transfer_string_link, .synkro_string_link {
  text-decoration: none;
  color: rgb(4, 110, 228);
  font-size: 13px;
  font-weight: 800;
}

.transfer_bar .formBtnGrey, .synkro_bar .formBtnGrey {
  flex-shrink: 0;
  width: 90px;
  height: 28px;
  font-size: 12.5px;
  margin: 0px 20px 0px 0px;
  padding: 0;
  border: 1px solid rgb(58, 61, 65);
}

.app_transfer_progress_percent, .app_synkro_progress_percent {
  flex-shrink: 0;
  width: 31px;
  margin-right: 20px;
}

@media screen and (min-width: 850px) {
  .app_resume_transfer_btn, .app_resume_synkro_btn {
    display: none;
  }
}

.app_transfer_time_left, .app_synkro_time_left {
  display: none;
}

@media screen and (max-width: 849px) {
  .app_resume_transfer_btn, .app_transferred_total, .app_resume_synkro_btn, .app_synkro_total {
    display: none;
  }
}

.transfer_bar_progressZoneCtr, .synkro_bar_progressZoneCtr {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
}

.transfer_bar_progressZone, .synkro_bar_progressZone {
  position: relative;
  width: 100%;
  height: 100%;
}

.transfer_bar_progress, .synkro_bar_progress {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: rgb(4, 110, 228);
}

.synkro_bar_progress {
  background: rgb(252 ,144, 11);
}

.transfer_bar_anim, .synkro_bar_anim {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 2.5%;
  height: 100%;
  background: rgb(252, 144, 11);
  border-radius: 3px;
  animation: transfer_bar_progress_anim_pos 2.5s ease infinite;
}

.synkro_bar_anim {
  background: rgb(4, 110, 228);
}

@keyframes transfer_bar_progress_anim_pos {
  to {
    left: 100%;
    width: 10%;
  }
}

/*********************************************** LASSO & DRAGGER***********************************************/
.lassoSelector {
  display: none;
  position: absolute;
  z-index: 3;
  background: rgba(4, 110, 227, .1);
  border: 1px solid rgba(4, 110, 227, .2);
  border-radius: 7px;
  cursor: default;
}

.drive_dragger {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 3;
  min-width: 150px;
  padding: 15px;
  box-sizing: border-box;
  background: rgb(4, 110, 228);
  border-radius: 7px;
  box-shadow: 0 0 18px rgba(0, 0, 0, .2);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.drive_dragger span {
  color: white;
  font-size: 14px;
  font-weight: 800;
}

.app_dragging {
  cursor: move;
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}

.app_lassoing {
  cursor: crosshair;
}

.app_noDrop {
  cursor: no-drop;
}

/*****************************************************SHARE********************************************/
#share_zones_ctr {
  position: relative;
  display: flex;
}

#guests_zone, #private_link_zone {
  flex: 1 0 100%;
}

@media screen and (min-width: 850px) {
  #guests_zone {
    margin-right: 40px;
  }
}

@media screen and (max-width: 849px) {
  #guests_zone {
    margin-right: 30px;
  }
}

#add_guests_form {
  padding-bottom: 30px;
  margin-bottom: 15px;
  border-bottom: 1px solid rgb(58, 61, 65);
}

#add_guests_form .formInput {
  color: rgb(4, 110, 228);
}

.remove_guests_input {
  display: none;
}

.remove_guests_input:hover {
  cursor: pointer;
  fill: rgb(4, 110, 228);
}

.formInputCtr_email .fb_results_list {
  top: 76px;
  left: 0;
  width: calc(100% - 2px);
  background: rgb(38, 40, 44);
}

.formInputCtr_email .fb_results_list>.ab_contact, .formInputCtr_email .fb_results_list>.ab_group {
  border-radius: 0px;
}

@media screen and (min-width: 850px) {
  .formInputCtr_email .fb_results_list>.ab_contact:hover, .formInputCtr_email .fb_results_list>.ab_group:hover {
    background: rgb(48, 51, 56);
  }
}

.guests_list_no_data {
  display: block;
  padding: 20px 0px;
  color: rgb(88, 90, 94);
  font-size: 12px;
  font-weight: 500;
  font-style: italic;
}

#guests_list .ab_contact_header:hover, #guests_list .ab_group_header:hover {
  cursor: default;
}

.guest_menu_ctr {
  position: relative;
}

.guest_menu_launcher {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 40px;
  width: 40px;
}

.guest_menu_launcher .menu_dot {
  background: white;
  margin: 1px;
}

@media screen and (min-width: 850px) {
  .guest_menu_launcher:hover {
    cursor: pointer;
  }

  .guest_menu_launcher:hover .menu_dot {
    background: rgb(4, 110, 228);
  }
}

.guest_menu {
  display: none;
  list-style-type: none;
  position: absolute;
  z-index: 3;
  padding: 10px 0px;
  box-sizing: border-box;
  border-radius: 7px;
  background: rgb(38, 40, 44);
  border: 1px solid rgb(58, 61, 65);
  box-shadow: 0 0 8px rgba(4, 6, 12, .2);
}

.guest_menu {
  min-width: 235px;
  top: 40px;
  right: 0;
}

.guest_menu>li>span {
  display: block;
  height: 50px;
  line-height: 50px;
  color: white;
  font-size: 13.5px;
  font-weight: 600;
  white-space: nowrap;
}

@media screen and (min-width: 850px) {
  .guest_menu>li:hover {
    background: rgb(48, 51, 56);
    cursor: pointer;
  }
}

.guest_menu>li {
  position: relative;
  height: 50px;
  padding: 0px 25px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.guest_menu>li>svg {
  flex-shrink: 0;
  display: block;
  margin-right: 25px;
  fill: white;
}

#private_link {
  height: 72px;
  margin: 15px 0px 30px 0px;
  background: none;
  border: 1px solid rgb(58, 61, 65);
  font-weight: 600;
}

.guestPermissions_ctr {
  display: none;
  padding: 5px 20px 10px 20px;
  margin-bottom: 20px;
  box-sizing: border-box;
  border-radius: 7px;
  border: 1px solid rgb(58, 61, 65);
}

.guestPermissions_ctr #item_permissions_list {
  padding: 0;
}

[data-btn=close_guest_permissions] {
  margin-top: 0;
}

/***************************************************** WHITE PEBBLES ********************************************/
.pebbleOuter_medium, .pebbleOuter_large, .pebbleOuter_large_600 {
  position: relative;
  background: rgb(38, 40, 44);
}

@media screen and (min-width: 850px) {
  .pebble_full_width {
    width: 100%;
    display: flex;
  }

  .pebbleOuter_medium, .pebbleOuter_large, .pebbleOuter_large_600 {
    margin: 0px 30px 30px 0px;
    border: 1px solid rgb(58, 61, 65);
    border-radius: 7px;
  }

  .pebbleOuter_medium {
    width: 415px;
  }

  .pebbleOuter_large {
    min-width: 0;
    flex-grow: 1;
  }

  .pebbleOuter_large_600 {
    width: 600px;
  }
}

.pebbleInner {
  height: 100%;
  padding: 0px 40px 15px 40px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

@media screen and (max-width: 849px) {
  .pebbleInner {
    padding: 0px 30px;
  }
}

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

.pebble_bigTitle {
  display: block;
  width: 100%;
  height: 80px;
  line-height: 80px;
  color: white;
  font-size: 22px;
  font-weight: 800;
}

.pebbleTitle {
  display: block;
  width: 100%;
  margin-top: 30px;
  line-height: 20px;
  color: white;
  font-size: 16px;
  font-weight: 800;
}

.pebbleTitleCtr {
  padding: 30px 0px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.pebbleTitle_leftZone, .pebbleTitle_rightZone {
  min-width: 50%;
  flex-grow: 1;
}

.pebbleTitle_rightZone {
  display: flex;
  justify-content: flex-end;
}

.pebbleTitle_leftZone span {
  display: block;
  margin: 12.5px 0px;
  line-height: 20px;
  color: rgb(4, 110, 228);
  font-size: 18px;
  font-weight: 800;
}

.red {
  color: rgb(222, 0, 0);
}

.pebble_actionZone {
  flex-grow: 1;
  display: flex;
  align-items: flex-end;
}

/***************************************************** SEARCH BAR ********************************************/
.fb_searchBar {
  position: relative;
  flex-grow: 1;
  height: 45px;
  background: rgb(48, 51, 56);
  border-radius: 7px;
  border: 1px solid transparent;
  padding: 0px 10px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  transition: background 0.25s ease, border 0.25s ease;
}

.fb_searchBar {
  background: rgb(48, 51, 56);
}

.fb_searchWen, .closeSearchBar {
  fill: white;
}

@media screen and (min-width: 850px) {
  .fb_searchBar {
    max-width: 650px;
  }
}

.fb_searchBarOpened {
  border-radius: 8px 8px 0px 0px !important;
}

.fb_searchBarInput {
  flex-grow: 1;
  height: 30px;
  line-height: normal;
  color: white;
  font-size: 14px;
  font-weight: 500;
}

.fb_searchBarInput::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: rgb(188, 190, 194);
}

.fb_searchBarInput:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: rgb(188, 190, 194);
  opacity: 1;
}

.fb_searchBarInput::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: rgb(188, 190, 194);
  opacity: 1;
}

.fb_searchBarInput:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: rgb(188, 190, 194);
}

.fb_searchBarInputFocused {
  background: rgb(38, 40, 44) !important;
  border: 1px solid rgb(48, 51, 56) !important;
  transition: background 0.25s ease, border 0.25s ease;
}

.fb_searchBarInputFocused_nob {
  background: rgb(38, 40, 44) !important;
  transition: background 0.25s ease, border 0.25s ease;
}

.fb_searchWenCtr {
  position: relative;
}

.fb_searchWen {
  flex-shrink: 0;
  display: block;
  margin-right: 10px;
}

.closeSearchBar {
  flex-shrink: 0;
  display: none;
}

.closeSearchBar:hover {
  cursor: pointer;
}

.fb_results_list {
  display: none;
  position: absolute;
  top: 43px;
  left: -1px;
  z-index: 3;
  width: 100%;
  max-height: 450px;
  border-radius: 0px 0px 7px 7px;
  background: rgb(38, 40, 44) !important;
  border-left: 1px solid rgb(58, 61, 65);
  border-right: 1px solid rgb(58, 61, 65);
  border-bottom: 1px solid rgb(58, 61, 65);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.fb_results_list a {
  text-decoration: none;
  height: 75px;
  padding: 0px 15px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.search_list_mini_ui {
  height: 45px !important;
}

.search_result_leftZone, .search_result_rightZone {
  flex-grow: 1;
  display: flex;
  align-items: center;
}

.search_result_rightZone {
  justify-content: flex-end;
}

.search_result_leftZone_covers {
  position: relative;
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  margin-right: 10px;
  border-radius: 6px;
  overflow: hidden;
}

.search_result_avatarCtr {
  position: relative;
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  margin-right: 10px;
  border-radius: 50%;
  overflow: hidden;
}

.search_result_coverCtr {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.search_result_avatarCtr img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.search_result_defaultCover {
  flex-shrink: 0;
  position: relative;
  width: 60px;
  height: 60px;
  background: rgb(48, 51, 56);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.search_result_defaultCover svg {
  flex-shrink: 0;
  display: block;
  width: 30px;
  height: 30px;
}

.search_result_trashIcon {
  fill: white;
}

@media screen and (min-width: 850px) {
  .fb_results_list a:hover, .item_list_hovered {
    cursor: pointer;
    background: rgb(48, 51, 56);
  }
}

.search_result_item_info_ctr {
  min-width: 0;
  flex-grow: 1;
  padding: 10px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.search_result_item_name, .search_result_item_date {
  display: block;
  line-height: 20px;
  color: white;
  font-size: 13px;
  font-weight: 500;
  word-break: break-all;
}

.search_result_item_date {
  font-size: 10.5px;
}

@media screen and (max-width: 849px) {
  .search_result_leftZone {
    width: 100%;
  }

  .search_result_item_date {
    display: none;
  }
}

@media screen and (min-width: 850px) {
  .search_result_leftZone {
    max-width: calc(100% - 85px);
  }

  .search_result_item_name {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
}

.fb_no_results {
  display: block;
  height: 45px;
  line-height: 45px;
  padding: 0px 15px;
  box-sizing: border-box;
  color: rgb(88, 90, 94);
  font-size: 14px;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

@media screen and (max-width: 849px) {
  [data-target=searchEngineOp] {
    position: relative;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    margin-right: 20px;
    background: rgb(48, 51, 56);
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  [data-target=searchEngineOp] .fb_searchBarInput {
    display: none;
  }

  [data-target=searchEngineOp] .fb_searchWen {
    margin-right: 0;
  }

  [data-target=searchEngineOp] .fb_results_list {
    position: fixed;
    top: calc(64px + env(safe-area-inset-top));
    left: 0;
    z-index: 3;
    width: 100%;
    height: calc(100% - 64px - env(safe-area-inset-top));
    max-height: none;
    border: none;
    border-radius: 0px;
  }
}

.mobile_searchEngine_active {
  border: none !important;
  border-radius: 0px !important;
  background: none !important;
}

.mobile_searchEngine_active .fb_searchWen {
  margin-right: 10px;
}

/***************************************************** TABLE ********************************************/
.fb_table_header {
  list-style-type: none;
  width: 100%;
  height: 50px;
  border-bottom: 1px solid rgb(58, 61, 65);
  display: flex;
  align-items: center;
}

.fb_table_header li {
  padding: 0px 10px;
  box-sizing: border-box;
  color: white;
  font-size: 13px;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

@media screen and (min-width: 850px) {
  .fb_table_header li {
    padding: 0px 20px;
    box-sizing: border-box;
  }
}

.fb_table {
  list-style-type: none;
}

.fb_table li {
  height: 50px;
  border-bottom: 1px solid rgb(58, 61, 65);
  display: flex;
  align-items: center;
}

.fb_table li>a {
  text-decoration: none;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

.fb_table li span {
  padding: 0px 10px;
  box-sizing: border-box;
  color: white;
  font-size: 13px;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

@media screen and (min-width: 850px) {
  .fb_table li span {
    padding: 0px 20px;
    box-sizing: border-box;
  }

  .fb_table li:hover, .fb_table li>a:hover {
    cursor: pointer;
    background: rgb(48, 51, 56);
  }
}

.fb_table li svg {
  flex-shrink: 0;
  display: block;
  margin: 0 auto;
}

.fb_table li svg:hover {
  cursor: pointer;
  fill: rgb(4, 110, 228)
}

/***************************************************** SUPPORT ********************************************/
#ticketZone {
  padding: 30px 30px 15px 30px;
  box-sizing: border-box;
  max-width: 750px;
  margin: 0 auto;
}

@media screen and (min-width: 850px) {
  #supportZone {
    padding: 0px 0px 30px 30px;
    display: flex;
    flex-wrap: wrap;
  }
}

@media screen and (max-width: 849px) {
  #ticketZone {
    padding-top: 0;
  }

  #supportZone {
    padding-bottom: 30px;
  }
}

#open_ticket_visitor_response {
  margin-top: 30px;
  line-height: 20px;
  color: white;
  font-size: 16px;
  font-weight: 800;
}

[data-tabletype=tickets_list] {
  max-height: 341px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

#ticket_id_string {
  margin: 15px 15px 15px 0px;
  color: rgb(4, 110, 228);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

[data-type=ticketstatusselector] {
  width: 135px;
  margin: 15px 0px;
}

/***************************************************** CHAT ********************************************/
.chat_block_leftCtr, .chat_block_rightCtr {
  position: relative;
  display: flex;
  justify-content: flex-start;
}

.chat_block_rightCtr {
  justify-content: flex-end;
}

@media screen and (min-width: 850px) {
  .chat_block_leftCtr, .chat_block_rightCtr {
    padding: 20px 0px;
  }

  .chat_block_left, .chat_block_right {
    position: relative;
    min-width: 40%;
    max-width: 80%;
  }
}

@media screen and (max-width: 849px) {
  .chat_block_leftCtr, .chat_block_rightCtr {
    padding: 20px 0px;
  }

  .chat_block_left, .chat_block_right {
    position: relative;
    min-width: 60%;
    max-width: 90%;
  }
}

.chatBlock_header {
  padding-bottom: 10px;
  display: flex;
  align-items: center;
}

.chatBlock_header_avatarBlock {
  position: relative;
}

.chatBlock_header_avatarCtr {
  position: relative;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
}

.chatBlock_header_avatar {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.chatBlock_header_user_loggedIn {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: 2px solid white;
  background: rgb(13, 181, 130);
}

.chatBlock_header_rightZone {
  margin-left: 10px;
}

.chatBlock_header_username {
  display: block;
  margin-bottom: 3px;
  color: white;
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.chatBlock_header_date {
  display: block;
  color: rgb(108, 110, 114);
  font-size: 10px;
  font-weight: 600;
}

.chatBlock_message_ctr_left, .chatBlock_message_ctr_right, .chat_block_origin_message_ctr_left, .chat_block_origin_message_ctr_right {
  position: relative;
  z-index: 1;
  display: block;
  padding: 15px;
  box-sizing: border-box;
  border-radius: 7px;
}

.brTop {
  border-radius: 8px 8px 0px 0px;
}

.brBot {
  border-radius: 0px 0px 8px 8px;
}

.chatBlock_message_ctr_left {
  background: rgb(48, 51, 56);
  color: white;
}

.chatBlock_message_ctr_right {
  background: rgb(4, 110, 228);
  color: white;
}

.chat_block_origin_message_ctr_left, .chat_block_origin_message_ctr_right {
  text-decoration: none;
}

.chat_block_origin_message_ctr_left {
  background: rgba(48, 51, 56, .3);
  color: white;
}

.chat_block_origin_message_ctr_right {
  background: rgba(4, 110, 228, .5);
  color: white;
}

.chat_block_origin_message_ctr_left span, .chat_block_origin_message_ctr_right span {
  display: block;
  max-width: 90%;
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.chat_block_origin_message_ctr_left span {
  color: rgb(4, 110, 228);
}

.chat_block_origin_message_ctr_right span {
  color: white;
}

.chatBlock_message_ctr_left .chatBlock_message a, .chatBlock_message_ctr_right .chatBlock_message a {
  text-decoration: none;
  word-break: break-all;
}

.chatBlock_message_ctr_left .chatBlock_message a {
  color: white;
}

.chatBlock_message_ctr_right .chatBlock_message a {
  color: white;
}

.chatBlock_message_ctr_left .chatBlock_message a:hover, .chatBlock_message_ctr_right .chatBlock_message a:hover {
  text-decoration: underline;
}

.chatBlock_message, .chat_block_origin_message_ctr_left p, .chat_block_origin_message_ctr_right p {
  line-height: 20px;
  font-size: 13px;
  font-weight: 400;
  word-wrap: break-word;
}

.chat_block_origin_message_ctr_left p, .chat_block_origin_message_ctr_right p {
  line-height: 18px;
  font-size: 12px;
}

.delete_message_btn {
  position: absolute;
  z-index: 2;
  top: 2px;
  right: 2px;
  flex-shrink: 0;
  display: block;
}

.delete_message_btn:hover {
  cursor: pointer;
}

.view_by {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 2;
  flex-shrink: 0;
  display: block;
  margin: 0px 2px 2px 0px;
  cursor: pointer;
}

.seenByList {
  display: none;
  list-style-type: none;
  position: absolute;
  bottom: 20px;
  right: 0;
  z-index: 2;
  width: 200px;
  max-height: 200px;
  border-radius: 7px;
  background: rgb(38, 40, 44);
  border: 1px solid rgb(58, 61, 65);
  box-shadow: 0 0 8px rgba(4, 6, 12, .2);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  transition: display 0.25s ease;
}

.seenByList>li {
  padding: 10px;
  display: flex;
  align-items: center;
}

.seenByList>li>span {
  color: white;
  font-size: 13px;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.viewer_avatarCtr {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  margin-right: 10px;
  overflow: hidden;
}

.viewer_avatarCtr img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  border-radius: 50%;
}

.recipient_avatarCtr {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  margin-right: 10px;
  overflow: hidden;
}

.recipient_avatarCtr img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  border-radius: 50%;
}

.chatBlock_answer_message{
  display: flex;
  justify-content: flex-end;
}

.chatBlock_answer_message span{
  display: block;
  line-height: 20px;
  margin-right: 5px;
  color: white;
  font-size: 10px;
  font-weight: 600;
  cursor: pointer;
}

.chatBlock_answer_message span:hover{
  color: rgb(4, 110, 228);
}

#message_answer_marker {
  position: absolute;
  left: 0;
  top: -28px;
  padding: 8px;
  background: rgb(4, 110, 228);
  border-radius: 0 4px 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#message_answer_marker span {
  color: white;
  font-size: 10.5px;
  font-weight: 800;
  margin-right: 5px;
}

#remove_message_answer_marker {
  display: block;
  flex-shrink: 0;
  cursor: pointer;
}

/***************************************************** NOTIFICATIONS ********************************************/
[data-method=search_notif] {
  max-width: 100%;
  padding: 0px 30px;
  border-radius: 0;
}

#notifs_subMenu {
  list-style-type: none;
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgb(58, 61, 65);
}

#notifs_subMenu li {
  width: 50%;
}

#notifs_subMenu a {
  text-decoration: none;
  display: block;
  width: 100%;
  height: 45px;
  line-height: 45px;
  color: white;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  text-transform: uppercase;
}

.notifs_subMenu_liActive {
  color: rgb(4, 110, 228) !important;
}

@media screen and (min-width: 850px) {
  #notifs_subMenu li:hover {
    cursor: pointer;
    color: rgb(4, 110, 228)
  }
}

[data-type=notification] {
  text-decoration: none;
  display: block;
  position: relative;
  box-sizing: border-box;
}

#notificationsZone [data-type=notification] {
  padding: 30px 60px 30px 30px;
}

#notificationsList [data-type=notification] {
  padding: 20px 50px 20px 20px;
}

@media screen and (min-width: 850px) {
  [data-type=notification]:hover {
    background: rgb(48, 51, 56);
  }
}

[data-type=notification] .dotsMenu {
  position: absolute;
  z-index: 1;
  top: 15px;
  right: 15px;
  width: 30px;
  height: 30px;
}

[data-type=notification] .dotsMenu .menu_dot {
  background: white;
}

.notif_tools {
  display: none;
  list-style-type: none;
  position: absolute;
  top: 45px;
  right: 15px;
  z-index: 1;
  border-radius: 7px;
  background: rgb(38, 40, 44);
  border: 1px solid rgb(58, 61, 65);
  box-shadow: 0 0 8px rgba(4, 6, 12, .2);
  overflow: hidden;
}

.notif_tools>li {
  padding: 15px;
  color: white;
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}

@media screen and (min-width: 850px) {
  .notif_tools>li:hover {
    background: rgb(48, 51, 56);
  }
}

.notif_message_zone {
  margin-left: 46px;
}

.notif_mention {
  display: block;
  margin-bottom: 10px;
  line-height: 18px;
  color: white;
  font-size: 13px;
  font-weight: 600;
}

.notif_message p {
  line-height: 20px;
  color: white;
  font-size: 12px;
  font-weight: 600;
  font-style: italic;
}

@media screen and (min-width: 850px) {
  .notif_load_next_zone_ctr {
    width: 100%;
    margin: 30px 0px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .notif_load_next_zone {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    border: 1px solid rgb(58, 61, 65);
    border-radius: 7px;
  }

  .notif_load_next_zone svg {
    flex-shrink: 0;
    display: block;
    margin-right: 10px;
  }

  .notif_load_next_zone span {
    color: white;
    font-size: 13px;
    font-weight: 600;
  }

  .notif_load_next_zone:hover {
    background: rgb(4, 110, 228);
    border: 1px solid rgb(4, 110, 228);
    cursor: pointer;
  }

  .notif_load_next_zone:hover span {
    color: white;
  }

  .notif_load_next_zone:hover svg {
    fill: white;
  }
}

@media screen and (max-width: 849px) {
  .notif_load_next_zone_ctr {
    width: 100%;
    background: rgb(48, 51, 56);
    display: flex;
    justify-content: center;
  }

  .notif_load_next_zone {
    display: flex;
    align-items: center;
    padding: 20px;
  }

  .notif_load_next_zone svg {
    flex-shrink: 0;
    display: block;
    margin-right: 10px;
  }

  .notif_load_next_zone span {
    color: white;
    font-size: 13px;
    font-weight: 600;
  }
}

.notif_list {
  list-style-type: circle;
  list-style-position: inside;
}

.notif_list li {
  padding: 4px 0px;
  line-height: 18px;
  color: rgb(128, 131, 136);
  font-size: 12px;
  font-weight: 600;
  word-break: break-word;
}

#notificationsList .drive_no_data {
  padding: 30px 20px;
}

/***************************************************** STATISTICS ********************************************/
#statisticsZone {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
}

#stats_data {
  position: relative;
  height: 350px;
}

.fb_stats_no_result {
  display: none;
  height: 40px;
  line-height: 40px;
  color: rgb(88, 90, 94);
  font-size: 12px;
  font-weight: 500;
  font-style: italic;
}

@media screen and (min-width: 1000px) {
  #stats_selectors {
    min-width: 30%;
    max-width: 30%;
    padding: 15px 30px 30px 30px;
    box-sizing: border-box;
  }

  #stats_data, #geoloc_stats_data_ctr {
    width: 70%;
    padding: 30px;
    box-sizing: border-box;
  }

  [data-pebble_type=admin_statistics] #stats_selectors, [data-pebble_type=admin_statistics] #stats_data, [data-pebble_type=admin_statistics] #geoloc_stats_data_ctr {
    min-width: 0;
    flex: 1 0 100%;
  }

  [data-pebble_type=admin_statistics] #stats_selectors {
    max-width: 40%;
  }
}

@media screen and (max-width: 999px) {
  #stats_selectors, #stats_data, #geoloc_stats_data_ctr {
    width: 100%;
    padding: 0px 30px 30px 30px;
    box-sizing: border-box;
  }

  [data-pebble_type=admin_statistics] #stats_selectors {
    padding: 0px 0px 30px 0px;
  }

  [data-pebble_type=admin_statistics] #stats_data, [data-pebble_type=admin_statistics] #geoloc_stats_data_ctr {
    padding: 0;
  }
}

#top_graph {
  position: relative;
  height: calc(100% - 50px);
}

#graph_data {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: calc(100% - 50px);
  height: 100%;
}

#graph_canvas {
  width: 100%;
  height: 100%;
}

#y_axis {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
}

.y_block {
  width: 100%;
  border-top: 1px solid rgb(58, 61, 65);
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
}

.y_block span {
  line-height: 22px;
  color: rgb(88, 90, 94);
  font-size: 11px;
  font-weight: 400;
}

#x_axis {
  width: 100%;
  height: 50px;
  border-top: 1px solid rgb(58, 61, 65);
  display: flex;
  align-items: center;
}

#x_axis span {
  position: relative;
  flex-shrink: 0;
  display: block;
  color: white;
  font-size: 11px;
  font-weight: 400;
}

[data-type=stat_tracks_selector], [data-type=stat_guests_selector], [data-type=stat_geolocation_type_selector] {
  display: none;
}

.graph_plot_data {
  position: absolute;
  top: 0;
  height: 100%;
  cursor: default;
}

.graph_plot_ctr {
  position: relative;
  height: 100%;
}

.graph_plot_line {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  border-left: 1px solid rgb(58, 61, 65);
}

.graph_plot {
  position: absolute;
  left: -5px;
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgb(4, 110, 228);
}

.graph_plot_tooltip {
  display: none;
  position: absolute;
  z-index: 2;
  left: 10px;
  bottom: 0;
  padding: 10px;
  box-sizing: border-box;
  background: rgb(48, 50, 54);
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  box-shadow: 0 1px 8px rgba(4, 6, 12, .08);
}

.graph_plot_tooltip span {
  display: block;
  line-height: 22px;
  color: white;
  font-size: 11px;
  font-weight: 400;
  white-space: nowrap;
}

.statsLoader {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(38, 40, 44);
  display: flex;
  align-items: center;
  justify-content: center;
}

.statsLoader_animatedCircle_boxCtr {
  width: 70px;
  height: 70px;
}

#geoloc_stats_data_ctr {
  display: none;
}

#geoloc_stats_data {
  position: relative;
  min-height: 350px;
  display: flex;
}

#geoloc_y_axis {
  min-width: 0;
  flex-grow: 1;
}

@media screen and (min-width: 850px) {
  #geoloc_y_axis {
    max-width: 160px;
  }
}

.y_geo_block {
  display: block;
  height: 50px;
  display: flex;
  align-items: center;
}

.y_geo_block_img {
  position: relative;
  flex-shrink: 0;
  margin-right: 10px;
  border-radius: 2px;
  overflow: hidden;
}

.y_geo_block_country_flag {
  width: 30px;
  height: 20px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.y_geo_block_country_name, .y_geo_block_city_name {
  line-height: 22px;
  color: white;
  font-size: 13px;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#geoloc_data_list {
  padding-left: 20px;
  box-sizing: border-box;
}

@media screen and (min-width: 850px) {
  #geoloc_data_list {
    flex-grow: 1;
  }
}

.geoloc_data {
  height: 50px;
  display: flex;
  align-items: center;
}

@media screen and (max-width: 849px) {
  .geoloc_data {
    justify-content: flex-end;
  }
}

.geoloc_bar {
  height: 20px;
  background: rgb(48, 51, 56);
}

.geoloc_bar_data_tooltip {
  flex-shrink: 0;
  display: block;
  height: 30px;
  line-height: 30px;
  padding: 0px 11.5px;
  border-radius: 6px;
  background: rgb(38, 40, 44);
  border: 1px solid rgb(58, 61, 65);
  color: rgb(4, 110, 228);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  cursor: default;
}

#statistics_total_value_ctr {
  background: rgb(48, 51, 56);
  border-radius: 7px;
  padding: 9px 0px;
  margin: 15px 0px;
  text-align: center;
}

#statistics_total_value_ctr span {
  color: rgb(4, 110, 227);
  font-size: 16px;
  font-weight: 800;
}

/***************************************************** ADDRESS BOOK ********************************************/
@media screen and (min-width: 850px) {
  #addressBookZone {
    padding: 0px 0px 30px 30px;
    display: flex;
    flex-wrap: wrap;
  }
}

@media screen and (max-width: 849px) {
  #addressBookZone {
    padding-bottom: 30px;
  }
}

#ab_contacts_list, #ab_groups_list {
  max-height: 1218px;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.ab_contact, .ab_group {
  border-radius: 7px;
}

.ab_contactActive, .ab_groupActive {
  background: rgb(48, 51, 56);
}

.ab_contact_header, .ab_group_header {
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ab_contact_header:hover, .ab_group_header:hover {
  cursor: pointer;
}

.ab_contact_header_left, .ab_contact_header_right, .ab_group_header_left, .ab_group_header_right {
  display: flex;
  align-items: center;
}

.ab_contact_header_left, .ab_group_header_left {
  width: 85%;
}

.ab_contact_header_right, .ab_group_header_right {
  justify-content: flex-end;
}

.ab_contact_header_avatarCtr, .ab_contact_inGroup_avatarCtr {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  margin-left: 10px;
  overflow: hidden;
}

.ab_contact_inGroup_avatarCtr {
  margin: 0px 10px 0px 0px;
}

.ab_contact_header_avatarCtr img, .ab_contact_inGroup_avatarCtr img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  border-radius: 50%;
}

.ab_group_header_icon {
  flex-shrink: 0;
  display: block;
}

.ab_contact_header_name, .ab_group_header_name {
  padding-left: 10px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.ab_open_contact, .ab_open_group {
  flex-shrink: 0;
  display: block;
  padding: 15px;
  fill: white;
}

.ab_open_contactActive, .ab_open_groupActive {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.ab_open_contact:hover, .ab_open_group:hover {
  cursor: pointer;
}

.ab_contact_tools, .ab_group_tools {
  display: none;
  padding: 10px 20px;
  box-sizing: border-box;
}

.ab_contact_tools_title, .ab_group_tools_title {
  display: block;
  line-height: 22px;
  padding: 10px 0px;
  box-sizing: border-box;
  font-size: 15px;
  color: rgb(4, 110, 228);
  font-weight: 600;
  word-break: break-word;
}

.ab_contact_groups_list, .ab_group_emails_list {
  max-height: 176px;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

/***************************************************** PROXY ACCOUNTS ********************************************/

#proxy_accounts_list {
  list-style-type: none;
}

#proxy_accounts_list>li {
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 6px;
}

#proxy_accounts_list>li:hover {
  cursor: pointer;
  background: rgb(48, 51, 56);
}

.switch_to_proxy_account_leftZone, .switch_to_proxy_account_rightZone {
  display: flex;
  align-items: center;
}

.switch_to_proxy_account_leftZone {
  width: 85%;
}

.switch_to_proxy_account_rightZone {
  justify-content: flex-end;
}

.switch_to_proxy_account_avatarCtr {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  margin-left: 10px;
  overflow: hidden;
}

.switch_to_proxy_account_avatarCtr img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  border-radius: 50%;
}

.switch_to_proxy_account_leftZone span {
  padding-left: 10px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.switch_to_proxy_account_menu_ctr {
  position: relative;
}

.switch_to_proxy_account_menu_launcher {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 40px;
  width: 40px;
}

.switch_to_proxy_account_menu_launcher .menu_dot {
  background: white;
  margin: 1px;
}

@media screen and (min-width: 850px) {
  .switch_to_proxy_account_menu_launcher:hover {
    cursor: pointer;
  }

  .switch_to_proxy_account_menu_launcher:hover .menu_dot {
    background: rgb(4, 110, 228);
  }
}

.switch_to_proxy_account_menu {
  display: none;
  list-style-type: none;
  position: absolute;
  z-index: 3;
  min-width: 235px;
  top: 40px;
  right: 0;
  border-radius: 7px;
  background: rgb(38, 40, 44);
  border: 1px solid rgb(58, 61, 65);
  box-shadow: 0 0 8px rgba(4, 6, 12, .2);
}

.switch_to_proxy_account_menu>li>span {
  display: block;
  height: 50px;
  line-height: 50px;
  color: white;
  font-size: 13.5px;
  font-weight: 600;
  white-space: nowrap;
}

@media screen and (min-width: 850px) {
  .switch_to_proxy_account_menu>li:hover {
    background: rgb(48, 51, 56);
    cursor: pointer;
  }
}

.switch_to_proxy_account_menu>li {
  position: relative;
  height: 50px;
  padding: 0px 15px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.switch_to_proxy_account_menu>li>svg {
  flex-shrink: 0;
  display: block;
  margin-right: 25px;
}

.proxy_accounts_no_data {
  display: block;
  padding: 20px 0px;
  color: rgb(88, 90, 94);
  font-size: 12px;
  font-weight: 500;
  font-style: italic;
}

/***************************************************** PLAYER ********************************************/
#playerZone {
  height: 100%;
}

@media screen and (min-width: 850px) {
  #app:not(.embed_app) #playerZone {
    padding-left: 10px;
    box-sizing: border-box;
  }
}

#playerZone #itemHeader_ctr {
  margin-bottom: 0;
}

#playerCore {
  position: relative;
  display: flex;
}

#embedPlayerCore {
  position: relative;
  height: 100%;
  background: rgb(48, 51, 56);
}

#embedPlayerCore #filesZone {
  background: rgb(48, 51, 56);
}

#filesZone {
  list-style-type: none;
}

#filesZone {
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

#chatZone {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
}

#chatZone .formBtnColor {
  width: 245px;
  font-size: 14px;
}

#conversations {
  flex-grow: 1;
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

@media screen and (max-width: 849px) {
  #conversations {
    height: calc(100% - 50px);
    padding: 0px 30px;
  }
}

@media screen and (min-width: 850px) {
  #conversations {
    padding: 0px 20px;
  }

  #playerCore {
    height: calc(100% - 100px);
    margin-left: 30px;
  }

  #playerCore #filesZone, #playerCore #chatZone {
    flex: 1 0 50%;
  }

  #chatZone {
    border-left: 1px solid rgb(58, 61, 65);
  }

  #start_collaboration_btn_ctr {
    padding: 15px 30px;
    display: flex;
    justify-content: center;
  }
}

@media screen and (max-width: 849px) {
  #playerCore {
    height: calc(100% - 109px);
  }

  #filesZone, #chatZone {
    flex: 1 0 100%;
  }

  #playerCore #filesZone_inner {
    padding-bottom: 90px;
  }

  #start_collaboration_btn_ctr {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

#conversations::-webkit-scrollbar {
  width: 0;
  height: 0;
}

#conversations::-webkit-scrollbar-track {
  background: transparent;
}

#conversations::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 0px;
}

#player_write_message_zone {
  flex-shrink: 0;
  position: relative;
  background: rgb(48, 51, 56);
  padding-bottom: env(safe-area-inset-bottom);
  display: flex;
  align-items: center;
}

@media screen and (min-width: 850px) {

  #player_write_message_zone {
    position: sticky;
    z-index: 1;
    bottom: 0;
    right: 0;
    width: 50%;
  }
}

[name=fb_write_message_ta] {
  flex-grow: 1;
  height: 50px;
  padding: 15px 20px;
  box-sizing: border-box;
  line-height: 20px;
  color: white;
  font-size: 14px;
  font-weight: 500;
}

[name=fb_write_message_ta]::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: rgb(188, 190, 194);
}

[name=fb_write_message_ta]:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: rgb(188, 190, 194);
  opacity: 1;
}

[name=fb_write_message_ta]::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: rgb(188, 190, 194);
  opacity: 1;
}

[name=fb_write_message_ta]:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: rgb(188, 190, 194);
}

#player_send_message_btn, .chat_choose_recipients_btn {
  align-self: flex-end;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

#player_send_message_btn svg, .chat_choose_recipients_btn svg {
  flex-shrink: 0;
  display: block;
}

.chat_choose_recipients_btn svg {
  fill: white;
}

@media screen and (min-width: 850px) {
  #player_send_message_btn:hover, .chat_choose_recipients_btn:hover {
    background: rgb(38, 40, 44);
  }
}

#tM_quickStartVid_launcher {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: rgb(4, 110, 228);
  margin: 0 20px;
  color: white;
  font-size: 18px;
  font-weight: 800;
}

@media screen and (min-width: 850px) {
  #tM_quickStartVid_launcher:hover {
    cursor: pointer;
    background: rgb(14, 120, 238);
  }
}

#tM_quickStartVid_outer {
  visibility: hidden;
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 60px;
  box-sizing: border-box;
  background: rgba(8, 10, 14, .6);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: visibility 0s, opacity 2s ease;
}

#tM_quickStartVid_inner {
  width: 70%;
}

.tM_quickStartVid_show {
  visibility: visible !important;
  opacity: 1 !important;
}

@media screen and (max-width: 849px) {

  #tM_quickStartVid_outer {
    padding: 0;
  }

  #tM_quickStartVid_inner {
    width: 100%;
  }
}

/***************************************************** FILE BLOCK ********************************************/
.fb_file_block {
  position: relative;
  height: 75px;
  padding: 0px 15px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fb_file_block svg {
  fill: white;
}

.fb_audioGroup_block {
  position: relative;
  padding: 0px 15px;
  box-sizing: border-box;
}

.fb_audioGroup_block_topZone {
  height: 75px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

.fb_audioGroup_block_botZone {
  list-style-type: none;
  display: none;
  border-bottom: 1px solid rgb(58, 61, 65);
}

.fb_file_block_leftZone, .fb_audioGroup_block_leftZone {
  min-width: 0;
  display: flex;
  align-items: center;
}

.fbap_track_selected {
  flex-shrink: 0;
  display: none;
  width: 8px;
  height: 8px;
  margin-left: 15px;
  border-radius: 50%;
  background: rgb(4, 110, 228);
  -webkit-animation: blinker 1.8s linear infinite;
  animation: blinker 1.8s linear infinite;
}

@-webkit-keyframes blinker {
  50% {
    opacity: 0;
  }
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

.fb_file_block_audioControlBtn {
  position: relative;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgb(58, 61, 65);
  cursor: pointer;
}

@media screen and (max-width: 849px) {

  #embedPlayerCore .fb_file_block, #embedPlayerCore .fb_audioGroup_block_topZone {
    height: 48px;
  }

  #embedPlayerCore .fb_file_block_audioControlBtn, #embedPlayerCore .fb_file_block_audioControlBtn svg {
    width: 30px;
    height: 30px;
  }

  #embedPlayerCore .fb_audioGroup_block_botZone > .fb_file_block {
    padding: 0;
  }

  #embedPlayerCore .fb_audioGroup_block {
    background: rgb(48, 51, 56);
  }
}

.fb_file_block_playBtn, .fb_file_block_pauseBtn {
  flex-shrink: 0;
  display: block;
}

.fb_file_block_pauseBtn {
  display: none;
}

.fb_file_block_fileIcon {
  flex-shrink: 0;
  position: relative;
  width: 36px;
  height: 36px;
  background: rgb(48, 51, 56);
  border-radius: 6px;
  border: 1px solid transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fb_audioGroup_blockIcon {
  flex-shrink: 0;
  margin-right: 8px;
  cursor: default;
}

.fb_audioGroup_blockIcon svg {
  flex-shrink: 0;
  display: block;
  fill: white;
}

.fb_file_block_fileIcon span {
  flex-shrink: 0;
  display: block;
  max-width: 28px;
  color: rgb(4, 110, 228);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  cursor: default;
}

.fb_file_block_AudioIcon {
  flex-shrink: 0;
  position: relative;
  width: 36px;
  height: 36px;
  margin-right: 10px;
  border-radius: 6px;
  border: 1px solid rgb(48, 51, 56);
  display: flex;
  align-items: center;
  justify-content: center;
}

.fb_file_block_AudioIcon span {
  flex-shrink: 0;
  display: block;
  max-width: 28px;
  color: rgb(4, 110, 228);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  cursor: default;
}

.fb_file_block_isSynkro {
  width: 5px;
  height: 5px;
  background: rgb(252 ,144, 11);
  border-radius: 5px;
  margin: 15px;
}

.fb_file_block_name, .fb_audio_group_block_name {
  margin: 0px 15px;
  padding: 8px 0px;
  line-height: 20px;
  color: white;
  font-weight: 500;
  word-break: break-word;
}

.fb_audio_group_block_name {
  cursor: pointer;
}

.fb_file_block_name {
  cursor: -webkit-grab;
  cursor: grab;
}

#embedPlayerCore .fb_file_block, #embedPlayerCore .fb_audioGroup_block {
  padding: 0 8px;
}

#embedPlayerCore .fb_file_block_name {
  cursor: default;
}

.fb_audioGroup_block_rightZone {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.fb_file_block_dotsMenu,
.audio_group_files_viewer,
.audio_group_download_icon_ctr
{
  width: 36px;
  height: 36px;
  background: rgb(48, 52, 56);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.audio_group_download_icon_ctr {
  margin-right: 15px;
}

.audio_group_files_viewer svg,
.audio_group_download_icon_ctr svg
{
  flex-shrink: 0;
  display: block;
  fill: white !important;
}

.fb_file_block_dotsMenu .menu_dot {
  background: white;
  margin: 1px;
}

.audio_group_files_viewer svg, .fb_file_stat svg {
  fill: white !important;
}

@media screen and (min-width: 850px) {

  #embedPlayerCore .fb_file_block, #embedPlayerCore .fb_audioGroup_block_topZone {
    height: 55px;
  }

  .fb_file_block_dotsMenu:hover .menu_dot {
    background: rgb(4, 110, 228);
  }

  .fb_file_block_audioControlBtn:hover {
    border-color: rgba(4, 110, 228, .4);
  }

  .fb_file_block_playBtn:hover, .fb_file_block_pauseBtn:hover {
    fill: rgb(4, 110, 228);
  }

  .fb_file_block_name, .fb_audio_group_block_name {
    font-size: 13px;
  }

  .fb_file_block_name:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
  }

  .access_stat_btn {
    display: none !important;
  }
}

.fb_file_block_RightZone {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 849px) {
  .fb_file_block_name, .fb_audio_group_block_name {
    font-size: 12.5px;
  }

  #embedPlayerCore .fb_file_block_name, #embedPlayerCore .fb_audio_group_block_name {
    font-size: 12px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  #embedPlayerCore .fb_audioGroup_blockIcon, #embedPlayerCore .audio_group_files_viewer {
    width: 30px;
    height: 30px;
  }

  #embedPlayerCore .fb_audioGroup_block_botZone {
    border-bottom: none;
  }

  .access_stat_btn svg{
    width: 30px !important;
    height: 30px !important;
  }

  [data-stattype=plays], [data-stattype=downloads] {
    display: none !important;
  }
}

.fb_file_stat {
  text-decoration: none;
  display: flex;
  align-items: center;
  padding: 4px 8px 4px 4px;
  margin-right: 15px;
  border-radius: 7px;
  border: 1px dashed rgb(48, 51, 56);
}

.fb_file_stat.iLink:hover svg{
  fill: rgb(4, 110, 228) !important;
}

.fb_file_stat.iLink:hover span{
  color: rgb(4, 110, 228);
}

.fb_file_stat svg {
  display: block;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  fill: rgb(78, 80, 84);
}

.fb_file_stat span {
  font-size: 10.5px;
  color: white;
  font-weight: 500;
}

.fb_file_block .item_menu {
  left: auto;
  right: 15px;
  top: 53px;
  width: 300px;
}

/***************************************************** VIDEO PLAYER ********************************************/
.fb_vidPlayer_ctr {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  background: rgb(48, 51, 56);
  overflow: hidden;
  cursor: default;
}

.fb_vidPlayer {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.fb_vidPlayer_poster {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.fb_vidPlayer_fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9;
  width: 100%;
  height: 100%;
}

.vidLoader, .fb_vidPlayer_screenPlay {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vidLoader {
  opacity: 0;
  background: rgba(28, 30, 34, .6);
}

.fb_vidPlayer_controls {
  z-index: 2;
  background: transparent;
}

.vidLoader_animatedCircle_boxCtr {
  width: 102px;
  height: 102px;
}

.vid_play, .vid_launcher {
  width: 80px;
  height: 80px;
  background: rgba(38, 40, 44, .9);
  box-shadow: 0 0 7px rgba(18, 20, 24, .7);
  border-radius: 50%;
  overflow: hidden;
}

.vid_launcher {
  position: absolute;
  top: calc(50% - 40px);
  left: calc(50% - 40px);
  z-index: 4;
}

.vid_play:hover, .vid_launcher:hover {
  cursor: pointer;
  background: rgba(4, 110, 227, 1);
}

.vid_play svg, .vid_launcher svg {
  flex-shrink: 0;
  display: block;
  fill: white;
}

.fb_vidPlayer_bar {
  position: absolute;
  z-index: 3;
  bottom: -70px;
  left: 0;
  width: 100%;
  height: 69px;
  background: rgba(38, 41, 46, .6);
  border-top: 1px solid rgb(88, 91, 96);
  -webkit-backdrop-filter : blur(6px);
  backdrop-filter: blur(6px);
  padding: 0px 10px;
  box-sizing: border-box;
  transition: bottom 0.25s ease;
}

.fb_vidPlayer_bar_visible {
  bottom: 0;
}

.fb_vidPlayer_bar_controls {
  padding-bottom: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fb_vidPlayer_bar_leftZone, .fb_vidPlayer_bar_rightZone {
  display: flex;
  align-items: center;
}

.fb_vidPlayer_bar_rightZone {
  justify-content: flex-end;
}

.vid_play_bar:hover, .vid_pause_bar:hover, .vid_full_screen:hover {
  cursor: pointer;
}

.vid_pause_bar {
  display: none;
}

.vid_play_bar svg, .vid_pause_bar svg, .vid_full_screen svg, .vid_fidbak_logo svg, .vid_volumeCtr svg {
  flex-shrink: 0;
  display: block;
  fill: white;
}

.fb_vidPlayer_sliderCtr {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 4px;
  padding: 10px 0px;
  cursor: pointer;
}

.fb_vidPlayer_slider_timer {
  display: none;
  position: absolute;
  top: -21px;
  left: 0;
  z-index: 1;
  background: rgba(4, 110, 227, .8);
  color: white;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 6px;
  border-radius: 4px 4px 0px 0px;
}

.fb_vidPlayer_slider {
  position: absolute;
  z-index: 1;
  left: 0;
  bottom: calc(50% - 2px);
  width: 100%;
  height: 4px;
}

.fb_vidPlayer_slider_tube {
  position: relative;
  width: 100%;
  height: 100%;
  background: rgba(28, 31, 36, .5);
  border-radius: 4px;
}

.fb_vidPlayer_slider_seeker {
  display: none;
  position: absolute;
  z-index: 4;
  top: -4px;
  left: 0;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgb(4, 110, 228);
}

.fb_vidPlayer_slider_current {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: rgb(4, 110, 228);
  border-radius: 4px;
}

.fb_vidPlayer_slider_progress {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background: rgba(28, 68, 148, .8);
  border-radius: 4px;
}

.vid_currentTime, .vid_duration, .vid_time_separator {
  font-family: "Lato", "Helvetica", "Arial", sans-serif !important;
  color: white;
  font-size: 11px;
  font-weight: 500;
  padding: 0px 4px;
  cursor: default;
}

.vid_time_separator {
  padding: 0px;
}

.vid_volumeCtr {
  display: flex;
  align-items: center;
}

.vid_volumeCtr:hover {
  cursor: pointer;
}

.vid_volumeSliderCtr {
  position: relative;
  z-index: 1;
  width: 0;
  height: 40px;
  margin-right: 10px;
  overflow: hidden;
}

.vid_volumeSlider {
  position: absolute;
  z-index: 2;
  left: 0;
  top: calc(50% - 2px);
  width: 100%;
  height: 4px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
}

.vid_volumeSlider_setter {
  position: absolute;
  z-index: 3;
  left: 0;
  top: calc(50% - 6px);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgb(4, 110, 228);
}

@media screen and (min-width: 850px) {
  #welcome_vid_ctr {
    width: 60%;
    padding: 0px 30px 30px 30px;
    box-sizing: border-box;
  }

  #help_welcome_vid_ctr {
    width: 100%;
    padding: 30px;
    box-sizing: border-box;
  }

  .fb_vidPlayer_ctr {
    border: 1px solid rgb(58, 61, 68);
    border-radius: 7px;
  }
}

@media screen and (max-width: 849px) {
  #help_welcome_vid_ctr {
    padding-top: 30px;
  }
}

/***************************************************** PREFERENCES - ADMIN ********************************************/

@media screen and (min-width: 850px) {
  #preferencesZone, #adminZone {
    padding: 30px 0px 30px 20px;
    display: flex;
    flex-wrap: wrap;
  }
}

@media screen and (max-width: 849px) {
  #preferencesZone, #adminZone {
    padding-bottom: 30px;
  }
}

.preferences_bigTitle {
  display: inline-block;
  width: 100%;
  line-height: 25px;
  margin: 30px 0px 60px 0px;
  color: white;
  font-size: 24px;
  font-weight: 800;
  word-break: break-word;
}

@media screen and (max-width: 849px) {
  .preferences_bigTitle {
    margin: 30px;
  }
}

#preferences_avatarPicCtr {
  flex-shrink: 0;
  height: 106px;
  width: 106px;
  margin: 30px 0px 15px 0px;
  border-radius: 50%;
  overflow: hidden;
}

#preferences_avatarPic {
  display: block;
  height: 100%;
  width: 100%;
  opacity: 0;
}

#preferences_user_logoCtr, #custom_user_logoCtr {
  flex-shrink: 0;
  height: 45px;
  width: 150px;
  border-radius: 7px;
  overflow: hidden;
}

#preferences_user_logoCtr {
  margin: 15px 0px;
}

#preferences_fb_logoCtr {
  display: flex;
  align-items: center;
  margin: 15px 0px;
}

#preferences_userLogo, #custom_userLogo {
  display: block;
  height: 100%;
  width: 100%;
  opacity: 0;
}

#preferences_fidbot_bgCtr {
  flex-shrink: 0;
  width: 100%;
  height: 250px;
  margin: 15px 0px;
  overflow: hidden;
}

#preferences_fidbot_bg {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

#preferences_fidbot_default_bg {
  width: 100%;
  height: 250px;
  margin: 15px 0px;
  background: rgb(255, 67, 93);
  background: linear-gradient(-45deg, rgb(255, 67, 93), rgb(128, 49, 255));
}

#deleteAccount {
  margin-top: 15px;
  border-top: 1px solid rgb(58, 61, 65);
}

.subscription_detail, .profile_detail, .profile_detail_mailto, .subscription_detail_italic {
  display: block;
  line-height: 22px;
  padding: 10px 0px;
  box-sizing: border-box;
  font-size: 15px;
  color: white;
  font-weight: 500;
  word-break: break-word;
}

.profile_detail_mailto {
  display: block;
  text-decoration: none;
}

.profile_detail_mailto:hover {
  color: rgb(4, 110, 228);
}

.subscription_detail_italic {
  font-size: 12.5px;
  font-style: italic;
  padding: 0;
  margin-top: -12px;
}

#update_plan_message {
  display: none;
}

#billingInfo {
  width: 100%;
  padding-top: 15px;
  display: flex;
  flex-wrap: wrap;
}

#invoicesList {
  position: relative;
  list-style-type: none;
  max-height: 334px;
  margin-top: 11px;
  padding-right: 15px;
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

#invoicesList li {
  border-bottom: 1px solid transparent;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#invoicesList li>span {
  display: block;
  line-height: 20px;
  padding: 16px 0px;
  box-sizing: border-box;
  font-size: 12.5px;
  color: white;
  font-weight: 500;
}

#invoicesList li span:nth-child(1) {
  margin-right: 15px;
}

#invoicesList li span:nth-child(2) {
  flex-shrink: 0;
  text-align: right;
}

#invoicesList li:hover {
  cursor: default;
  border-bottom: 1px solid rgb(58, 61, 65);
}

.downloadInvoice {
  display: none;
  height: 30px;
  width: 28%;
  min-width: 100px;
  background: rgb(4, 110, 228);
  border-radius: 30px;
  padding: 0px 10px;
  box-sizing: border-box;
  font-size: 12.5px;
  color: white;
  font-weight: 800;
}

.downloadInvoice:hover {
  cursor: pointer;
  background: rgb(24, 130, 248);
}

#invoicesList li:hover .downloadInvoice {
  display: block;
}

#invoicesList li:hover span:nth-child(2) {
  display: none;
}

#subscription_credit_card_data {
  display: flex;
  flex-wrap: wrap;
}

#subscription_credit_card_data_imgCtr {
  flex-shrink: 0;
  width: 56px;
  height: 38px;
  margin: 15px 15px 15px 0px;
  overflow: hidden;
}

#subscription_credit_card_data_imgCtr img {
  display: block;
  width: 100%;
  height: 100%;
}

#subscription_credit_card_data span {
  height: 38px;
  line-height: 38px;
  padding: 0px 15px;
  box-sizing: border-box;
  background: rgb(4, 110, 228);
  border-radius: 4px;
  margin: 15px 15px 15px 0px;
  font-size: 14px;
  color: white;
  font-weight: 600;
}

#creditCard_adder {
  position: relative;
  display: none;
  width: 100%;
  border-bottom: 1px solid rgb(58, 61, 65);
  border-top: 1px solid rgb(58, 61, 65);
  padding-bottom: 15px;
}

#bt_dropIn_ctr {
  position: relative;
}

#tutorial_file_selectionCtr, #tutorial_poster_file_selectionCtr {
  display: none;
  padding: 10px;
  box-sizing: border-box;
  border-radius: 7px;
  background: rgb(48, 51, 56);
}

#tutorial_file_selection, #tutorial_poster_file_selection {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#tutorial_file_selection span, #tutorial_poster_file_selection span {
  color: rgb(4, 110, 228);
  font-size: 14px;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#tutorial_file_selection svg, #tutorial_poster_file_selection svg {
  flex-shrink: 0;
  display: block;
  margin-left: 10px;
}

#tutorial_file_selection svg:hover, #tutorial_poster_file_selection svg:hover {
  cursor: pointer;
}

#tutorial_poster_file_display {
  width: 100%;
}

@media screen and (min-width: 850px) {
  .admin_stats_subData_ctr {
    padding: 0px 30px 30px 30px;
  }
}

.admin_stats_subData_title, .admin_stats_subData_nbr {
  font-size: 14px;
  color: white;
  font-weight: 600;
}

.admin_stats_subData_nbr {
  color: rgb(4, 110, 228);
  margin-left: 10px;
}

.download_binaries_list {
  list-style-type: none;
  padding: 20px 0;
}

.download_binaries_list a {
  display: block;
  text-decoration: none;
  padding: 15px;
  box-sizing: border-box;
  border-radius: 10px;
  display: flex;
  align-items: flex-start;
}

.download_binaries_list a:hover {
  background: rgb(48, 51, 56);
}


.download_binaries_list a > svg {
  flex-shrink: 0;
  display: block;
  margin-right: 10px;
  fill: white;
}

#apple_install svg {
  position: relative;
  top: -4px;
}

.app_requirements span {
  display: block;
  font-size: 16px;
  color: white;
  font-weight: 800;
}

.app_requirements p {
  padding-top: 5px;
  font-size: 13px;
  color: white;
  font-weight: 500;
  font-style: italic;
}

.devices_list {
  list-style-type: none;
  padding-bottom: 20px;
}

.devices_list li {
  padding-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.device_details span {
  display: block;
  font-size: 14px;
  color: white;
  font-weight: 500;
  line-height: 22px;
}

.devices_list li > svg {
  flex-shrink: 0;
  display: block;
  margin-left: 10px;
  fill: white;
}

.devices_list li > svg:hover {
  cursor: pointer;
}

.device_name {
  color: rgb(4, 110, 228) !important;
  font-weight: 800 !important;
}

.device_ip, .device_lastLog {
  font-size: 13px !important;
}

#max_devices_reached_zone {
  margin-top: 20px;
}

#max_devices_reached_zone p{
  background: rgb(242, 88, 88);
  border-radius: 7px;
  padding: 10px;
  box-sizing: border-box;
  font-size: 13px;
  color: white;
  font-weight: 600;
  line-height: 22px;
  text-align: center;
}

/***************************************************** PLANS ********************************************/

#plansZone_outer, #createAccountZone_outer, #billingZone_outer, #paymentZone_outer {
  min-height: 100%;
}

#createAccountZone_outer, #billingZone_outer, #paymentZone_outer {
  display: none;
}

.pebbleOuter_medium_plan {
  position: relative;
  border-radius: 7px;
  background: rgb(43, 45, 49);
  border: 1px solid rgb(58, 61, 65);
}

.pmp_highlight {
  box-shadow: 0px 0 28px rgb(4, 8, 10,.5);
}

.pmp_topColor1 {
  border-top: 8px solid rgb(4, 110, 228);
}

.pmp_topColor2 {
  border-top: 8px solid rgb(188, 4, 228);
}

.pmp_topColor3 {
  border-top: 8px solid rgb(4, 228, 119);
}

.pmp_topColor4 {
  border-top: 8px solid rgb(228, 195, 4);
}

.pebbleOuter_medium_plan .selectBox_fb, .pebbleOuter_medium_plan .formBtnGrey {
  background: rgb(38, 40, 44);
}

#createAccountZone_inner .pebbleOuter_medium_plan {
  padding-top: 10px;
}

.plans_header_title {
  width: 100%;
  padding: 120px 30px;
  box-sizing: border-box;
}

.plans_header_title_top {
  display: flex;
  align-items: center;
  justify-content: center;
}

.plans_header_title_str {
  color: white;
  font-size: 2.8vw;
  font-weight: 800;
  line-height: 35px;
  text-align: center;
}

#plans_period_switch_ctr {
  margin-top: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.plans_period_switch_str {
  display: block;
  margin: 0 10px;
  color: rgb(178, 180, 184);
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
  transition: color 1s ease;
  cursor: default;
}

.ppsc_active {
  color: rgb(4, 110, 228);
}

#period_switch {
  position: relative;
  flex-shrink: 0;
  width: 50px;
  height: 25px;
  border: 1px solid rgb(4, 110, 228);
  border-radius: 25px;
  display: flex;
}

#period_switcher {
  position: absolute;
  left: 0;
  width: 50%;
  height: 25px;
  border-radius: 52%;
  background: rgb(4, 110, 228);
}

#period_switch:hover {
  cursor: pointer;
}

.period_switch_val {
  flex: 1;
}

.plans_prev_step {
  fill: white;
  margin-right: 10px;
  cursor: pointer;
}

.update_plan_info, .update_plan_info_warn {
  margin-top: 10px;
  line-height: 22px;
  font-size: 13px;
  color: white;
  font-weight: 500;
  text-align: center;
}

.update_plan_info_warn {
  margin: 0;
  font-weight: 800;
  color: rgb(242, 88, 88);
  text-align: left;
}

@media screen and (max-width: 999px) {

  #plans_conditions_ctr {
    padding: 0 15px 30px 15px;
  }

  .pebbleOuter_plans_conds {
    margin-top: 30px;
    border-radius: 7px;
    background: rgb(43, 45, 49);
    border: 1px solid rgb(58, 61, 65);
  }
}

@media screen and (min-width: 1000px) {

  #plans_conditions_ctr {
    display: flex;
    padding: 0 0 45px 45px;
    justify-content: center;
    flex-wrap: wrap;
  }

  .pebbleOuter_plans_conds {
    flex: 1 1 calc(33% - 45px);
    margin: 45px 45px 0 0;
    border-radius: 7px;
    background: rgb(43, 45, 49);
    border: 1px solid rgb(58, 61, 65);
  }
}

.plans_conditions_title {
  display: block;
  padding: 30px;
  color: rgb(4, 110, 228);
  font-size: 22px;
  font-weight: 800;
}

.plans_conditions_text {
  padding: 0 30px 30px 30px;
  line-height: 25px;
  color: white;
  font-size: 15px;
  font-weight: 300;
}

#subscription_ux_message_outer, #subscription_ux_error_outer {
  display: none;
  position: fixed;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 65px 30px;
  box-sizing: border-box;
  transition: display 0.5s ease;
}

#subscription_ux_message_outer {
  background: rgb(4, 110, 228);
}

#subscription_ux_error_outer {
  background: rgb(242, 88, 88);
}

#subscription_ux_message_inner, #subscription_ux_error_inner {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#subscription_ux_message_inner span, #subscription_ux_error_inner span {
  color: white;
  font-size: 28px;
  font-weight: 300;
  line-height: 40px;
  text-align: center;
}

.show_ux_message {
  display: block !important;
}

.plan_title {
  padding: 45px 0px 30px 0px;
}

.plan_name, .plan_price {
  display: block;
  color: white;
  font-size: 25px;
  font-weight: 800;
  text-transform: uppercase;
  text-align: center;
}

.plan_price {
  margin-top: 10px;
  font-size: 22px;
  color: rgb(4, 110, 228);
  font-weight: 400;
  text-transform: lowercase;
}

.plan_discount {
  display: block;
  margin-top: 10px;
  color: rgb(228, 230, 234);
  font-size: 14px;
  font-weight: 400;
  text-align: center;
}

.plan_details_list {
  list-style-type: none;
}

.plan_details_list>li {
  margin: 20px 0px;
  display: flex;
  align-items: center;
}

.plan_details_list li>svg {
  flex-shrink: 0;
  display: block;
  height: 11px;
  margin-right: 20px;
}

.plan_details_list li>span {
  flex-grow: 1;
  line-height: 20px;
  color: white;
  font-size: 14.5px;
  font-weight: 500;
}

#subscriberTypeSelector {
  list-style-type: none;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
}

#subscriberTypeSelector li {
  width: 45%;
  padding: 15px 0px;
  margin-top: 20px;
  border-radius: 48px;
  color: white;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
}

#subscriberTypeSelector li:hover {
  cursor: pointer;
  color: rgb(4, 110, 228);
}

.subscriberTypeActive {
  color: rgb(4, 110, 228) !important;
  background: rgb(48, 52, 56);
}

[data-formname=company], [data-formname=vat_number] {
  display: none;
}

#bt_av_cc_logos {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 40px 0px 25px 0px;
}

#bt_av_cc_logos img {
  display: block;
  flex-shrink: 0;
  width: 48px;
  height: 30px;
  margin: 5px;
}

#billingZone_inner .selectBox_fbCtr {
  margin-bottom: 0;
}

@media screen and (max-width: 999px) {

  .plans_header_title_str {
    font-size: 35px;
    line-height: 45px;
  }

  .pebbleOuter_medium_plan {
    width: calc(100vw - 30px);
    max-width: 420px;
    margin: 0 auto 30px auto;
  }

  #subscription_ux_message_inner span, #subscription_ux_error_inner span {
    font-size: 22px;
    line-height: 35px;
  }
}

@media screen and (min-width: 1000px) {

  #plansZone_outer, #createAccountZone_outer, #billingZone_outer, #paymentZone_outer {
    max-width: 1680px;
    margin: 0 auto;
  }

  #plansZone_inner, #createAccountZone_inner, #billingZone_inner, #paymentZone_inner {
    padding: 0px 30px 10px 30px;
    display: flex;
    justify-content: center;
  }

  .pebbleOuter_medium_plan {
    flex:  1 1 370px;
    max-width: 420px;
    margin: 0px 15px 30px 15px;
  }

  .plans_prev_step:hover {
    fill: rgb(4, 110, 228);
  }
}

#plans_vids_ctr {
  padding: 0 15px;
  box-sizing: border-box;
  background: rgb(43, 45, 49);
}

#plans_vids_title {
  display: block;
  width: 100%;
  padding: 60px 0;
  color: white;
  font-size: 35px;
  line-height: 45px;
  font-weight: 800;
  text-align: center;
}

.plans_vid_ctr {
  width: 100%;
  padding-bottom: 30px;
}

@media screen and (min-width: 1000px) {

  #plans_vids_ctr {
    margin: 0 45px;
    padding: 0 0 40px 40px;
    border: 1px solid rgb(58, 61, 65);
    border-radius: 7px;
    display: flex;
    flex-wrap: wrap;
  }

  #plans_vids_title {
    display: block;
    width: 100%;
    padding: 50px 0 10px 0;
    color: white;
    font-size: 33px;
    font-weight: 800;
    text-align: left;
  }

  .plans_vid_ctr {
    width: 33%;
    padding: 40px 40px 0 0;
    box-sizing: border-box;
  }
}

.plans_vid_ctr .fb_vidPlayer_ctr {
  border: none;
  border-radius: 7px;
}

.plans_vid_title {
  display: block;
  width: 100%;
  padding-top: 15px;
  color: white;
  font-size: 16px;
  font-weight: 600;
}

.plans_vid_sub_title {
  display: block;
  width: 100%;
  color: white;
  font-size: 13px;
  font-weight: 400;
  font-style: italic;
}

#paymentZone_subscription_detailsCtr {
  padding: 40px 0 19px 0;
}

#pzs_plan {
  display: block;
  font-size: 18px;
  color: rgb(4, 110, 228);
  font-weight: 800;
}

#pzs_details {
  padding: 2px 0;
  line-height: 22px;
  font-size: 14px;
  color: white;
  font-weight: 500;
}

#paymentZone_toPayCtr {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#paymentZone_inner .formMiniBtnColor {
  width: auto;
  height: 28px;
  margin-left: 20px;
}

#paymentZone_toPayCtr span{
  display: block;
  margin: 10px 0px;
  font-size: 15px;
  color: white;
  font-weight: 800;
}

#couponCodeAddedZone {
  display: none;
  padding: 15px 0;
}

#couponCodeAddedZone .legend {
  width: 100%;
}

#couponCodeAddedZone_inner {
  display: flex;
  align-items: center;
}

#couponCodeAdded {
  display: block;
  flex-grow: 1;
  height: 39px;
  line-height: 40px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  border-bottom: 1px solid rgb(58, 61, 65);
}

/*****************************************************UPLOAD IMG********************************************/
#itemCoverForm {
  position: relative;
}

#chooseImgType {
  list-style-type: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

#chooseImgType li {
  position: relative;
  display: block;
  width: 60px;
  height: 38px;
  line-height: 38px;
  margin: 20px;
  padding: 0px 20px;
  border-radius: 36px;
  font-size: 14px;
  font-weight: 600;
  background: rgb(48, 51, 56);
  color: white;
  text-align: center;
}

#chooseImgType li:hover {
  cursor: pointer;
  background: rgb(52, 55, 60);
}

#croppieCtr, #transferImg {
  display: none;
  position: relative;
}

#croppie_isLoading_ctr {
  display: none;
}

#croppie_isLoading {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(38, 40, 44);
  display: flex;
  align-items: center;
  justify-content: center;
}

#croppie_isLoading span {
  color: white;
  font-size: 14px;
  font-weight: 400;
}

/*********************************************** HELP ***********************************************/
.fb_helpZoneCtr {
  margin: 15px 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fb_infoPoint {
  flex-shrink: 0;
  display: block;
  width: 35px;
  height: 35px;
  line-height: 35px;
  border-radius: 50%;
  border: 1px solid rgb(58, 61, 65);
  color: rgb(4, 110, 228);
  font-size: 22px;
  font-weight: 500;
  text-align: center;
}

.fb_help {
  line-height: 18px;
  margin-left: 20px;
  color: white;
  font-size: 13px;
  font-weight: 500;
}

#helpZone {
  max-width: 800px;
}

#help_center_home_string {
  padding: 0px 30px;
  box-sizing: border-box;
  line-height: 28px;
  font-size: 15px;
  color: white;
  font-weight: 400;
}

#help_center_home_string a {
  text-decoration: none;
  color: rgb(4, 110, 228);
}

#help_center_home_string a:hover {
  text-decoration: underline;
}

#help_tutorial_videoCtr {}

#tutorial_title {
  display: block;
  line-height: 25px;
  padding: 0px 30px;
  box-sizing: border-box;
  color: rgb(4, 110, 228);
  font-size: 24px;
  font-weight: 400;
  word-break: break-word;
}

#tutorial_description {
  line-height: 22px;
  padding: 30px;
  box-sizing: border-box;
  color: white;
  font-size: 15px;
  font-weight: 500;
  text-align: justify;
}

#help_videoPlayer{
  padding: 30px;
  box-sizing: border-box;
}

/*********************************************** PAGINATION ***********************************************/
#paginationCtr {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
}

.pagination {
  display: inline-block;
  list-style-type: none;
  border-radius: 4px;
  color: white;
  font-size: 13px;
  font-weight: 500;
}

.pagination>li {
  display: inline;
}

.pagination>li>a, .pagination>li>span {
  position: relative;
  float: left;
  padding: 4px 10px;
  margin: 5px 0px;
  line-height: 1.42857143;
  text-decoration: none;
  margin-left: -1px;
  border: 1px solid rgb(58, 61, 65);
  color: white;
  background: rgb(49, 51, 56);
}

.pagination>li:first-child>a, .pagination>li:first-child>span {
  margin-left: 0;
}

.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus {
  z-index: 2;
  border: 1px solid rgb(58, 61, 65);
  color: white;
  background: rgb(69, 71, 76);
}

.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {
  z-index: 3;
  color: white;
  background-color: rgb(4, 110, 228);
  border-color: rgb(4, 110, 228);
  cursor: default;
}

.pagination>.disabled>span, .pagination>.disabled>span:hover, .pagination>.disabled>span:focus, .pagination>.disabled>a, .pagination>.disabled>a:hover, .pagination>.disabled>a:focus {
  color: white;
  background: rgb(48, 51, 56);
  border-color: rgb(48, 51, 56);
  cursor: not-allowed;
}

.pagination-lg>li>a, .pagination-lg>li>span {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
}

.pagination-lg>li:first-child>a, .pagination-lg>li:first-child>span {
  border-bottom-left-radius: 6px;
  border-top-left-radius: 6px;
}

.pagination-lg>li:last-child>a, .pagination-lg>li:last-child>span {
  border-bottom-right-radius: 6px;
  border-top-right-radius: 6px;
}

.pagination-sm>li>a, .pagination-sm>li>span {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
}

.pagination-sm>li:first-child>a, .pagination-sm>li:first-child>span {
  border-bottom-left-radius: 3px;
  border-top-left-radius: 3px;
}

.pagination-sm>li:last-child>a, .pagination-sm>li:last-child>span {
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px;
}

/***************************************************** TOS ********************************************/
#legal_termsZone {
  padding: 30px;
}

.tosTitle {
  display: block;
  margin: 18px 0px 40px 0px;
  line-height: 40px;
  color: white;
  font-size: 25px;
  font-weight: 300;
}

.termSubTitle,
.termsSubHead {
  display: block;
  line-height: 28px;
  margin: 30px 0px 5px 0px;
  color: rgb(4, 110, 228);
  font-size: 16px;
  font-weight: 800;
}

.termsSubHead {
  font-weight: 600;
}

.termText {
  display: block;
  width: 100%;
  line-height: 28px;
  color: white;
  font-size: 14px;
  font-weight: 400;
}

.termText a {
    text-decoration: none;
    color: rgb(4, 110, 228);
}

.termText a:hover {
  text-decoration: underline;
}

@media screen and (min-width: 850px) {

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

  .termsSubHead {
    padding-left: 20px;
  }
}

/***************************************************** FIDBOT UPLOAD BOX ********************************************/
#fidbotZone {
  position: relative;
  z-index: 1;
  flex-grow: 1;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

#fidbot_bg {
  position: fixed;
  z-index: 0;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100%;
}

#gradient_top, #gradient_bottom {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100%;
}

#gradient_top {
  display: none;
  z-index: 0;
}

#gradient_bottom {
  z-index: -1;
}

#fidbot_drop_files_ctr {
  display: none;
  position: fixed;
  z-index: 2;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100%;
}

#fidbot_drop_files {
  height: 100%;
  background: rgba(4, 110, 227, .9);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

#fidbot_drop_files span {
  display: inline-block;
  color: white;
  font-size: 32px;
  font-weight: 400;
  pointer-events: none;
}

#fidbot_header {
  position: relative;
  z-index: 1;
  flex: 0 0 65px;
  padding: 0px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#fidbot_logo {}

#fidbot_logo svg {
  fill: white !important;
}

#fidbot_fidbaker_name {
  text-decoration: none;
  display: block;
  max-width: 50%;
  background: rgba(255,255,255,.6);
  padding: 8px 15px;
  border-radius: 36px;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  box-shadow: 0 0 8px rgba(8, 11, 15, .2);
  color: rgb(38,51,55);
  font-size: 14px;
  font-weight: 800;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#fidbot_boxes {
  position: relative;
  z-index: 1;
  flex-grow: 1;
  display: flex;
  align-items: center;
}

@media screen and (min-width: 850px) {
  #fidbot_boxes {
    padding: 30px 60px;
  }

  #fidbot_fidbaker_name:hover {
    box-shadow: 0 0 8px rgba(8, 11, 15, .4);
  }
}

@media screen and (max-width: 849px) {
  #fidbot_boxes {
    padding: 30px 0px;
    justify-content: center;
  }
}

#fidbot_box_outer {
  position: relative;
  width: calc(100vw - 40px);
  max-width: 300px;
  height: 400px;
  background: rgb(38, 40, 44);
  border-radius: 10px;
  overflow: hidden;
}

@media screen and (min-width: 450px) {
  #fidbot_box_outer {
    box-shadow: 0 1px 48px rgba(4, 6, 12, .28);
  }
}

.fidbotLoader_ctr, .fidbotLoader_message_ctr {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 10px;
  overflow: hidden;
}

.fidbotLoader_ctr{
  z-index: 3;
  background: rgb(38, 40, 44);
}

.fidbotLoader_message_ctr {
  z-index: 4;
}

.fidbotLoader, .fidbotLoader_message {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fidbotLoader_animatedCircle_boxCtr {
  width: 120px;
  height: 120px;
}

.fidbotLoader_message span {
  color: white;
  font-size: 14px;
  font-weight: 800;
  cursor: default;
}

#fidbot_box_inner {
  position: relative;
  height: 100%;
  display: flex;
}

[data-type=fidbot_view] {
  min-width: 100%;
  height: 100%;
  padding: 15px 30px;
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#fidbot_files {
  display: none;
}

[data-type=fidbot_view] .formInputCtr, [data-type=fidbot_view] .formInputCtr_email {
  flex-shrink: 0;
  padding: 7.5px 0px;
}

[data-type=fidbot_view] .formInputCtr_email {
  height: 65px;
}

[data-type=fidbot_view] .legend {
  height: 20px;
  font-size: 11px;
  font-weight: 300;
}

[data-type=fidbot_view] .formInput {
  height: 28px;
  font-size: 13.5px;
  font-weight: 400;
}

[data-type=fidbot_view] .formInput_underline {
  bottom: 6.5px;
}

[data-type=fidbot_view] .formBtnColor, [data-type=fidbot_view] .formBtnGrey, [data-type=fidbot_view] .linkBtnColor {
  height: 34px;
  margin: 10px 0px;
  padding: 0px 10px;
}

[data-type=fidbot_view] .formBtnColor, [data-type=fidbot_view] .linkBtnColor {
  flex-shrink: 0;
}

[data-type=fidbot_view] .linkBtnColor {
  line-height: 34px;
}

[data-type=fidbot_view] .textArea {
  height: 90px;
  padding: 10px;
  font-size: 13.5px;
  font-weight: 400;
}

[data-type=fidbot_view] #confirmBtnCtr {
  max-width: 100%;
}

#fidbot_files_list_pebble {
  padding: 10px 0px 15px 20px;
}

#fidbot_files_ctr {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

#fidbot_files_selected_btn_ctr {
  display: none;
}

#fidbot_files_selected_btn {
  position: relative;
  height: 34px;
  margin-left: 7px;
  padding: 0px 10px;
  box-sizing: border-box;
  background: rgb(38, 40, 44);
  border-radius: 34px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#fidbot_files_selected_btn>span {
  line-height: 38px;
  color: white;
  font-size: 14px;
  font-weight: 800;
}

#fidbot_files_selected_btn>svg {
  flex-shrink: 0;
  display: block;
  margin-left: 8px;
}

#fidbot_files_selected_btn:hover {
  background: rgb(48, 51, 56);
}

#fidbot_files_selected_btn>svg, .fidbot_title>svg, .fidbot_filesList_deleteBtn {
  fill: white;
}

.fidbot_title {
  height: 54px;
  display: flex;
  align-items: center;
  cursor: default;
}

.fidbot_title>span {
  color: rgb(4, 110, 228);
  font-size: 16px;
  font-weight: 800;
}

.fidbot_title svg {
  flex-shrink: 0;
  display: block;
  margin-right: 10px;
  padding: 10px;
  background: rgb(48, 51, 56);
  border-radius: 50%;
}

.fidbot_title svg:hover {
  cursor: pointer;
  fill: rgb(4, 110, 228);
}

#fidbot_filesList, #app_filesList, #app_filesList_to_restore {
  list-style-type: none;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  cursor: default;
}

#fidbot_filesList {
  height: calc(100% - 54px);
  padding-right: 8px;
}

#fidbot_filesList li, #app_filesList li, #app_filesList_to_restore li {
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#fidbot_filesList>li>span, #app_filesList>li>span, #app_filesList_to_restore>li>span {
  color: white;
  font-size: 12.5px;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#app_filesList>li>span, #app_filesList_to_restore>li>span {
  font-size: 13px;
}

#fidbot_filesList>li>svg, #app_filesList>li>svg {
  flex-shrink: 0;
  display: block;
  padding: 5px;
}

#fidbot_filesList>li>svg:hover, #app_filesList>li>svg:hover {
  cursor: pointer;
  fill: rgb(4, 110, 228);
}

.file2restore_checker {
  display: none;
  flex-shrink: 0;
  padding: 5px;
}

.fidbot_info_point {
  display: inline-block;
  flex-shrink: 0;
  display: block;
  width: 80px;
  height: 80px;
  line-height: 80px;
  background: rgb(4, 110, 228);
  border-radius: 50%;
  margin: 45px auto;
  color: white;
  font-size: 30px;
  font-weight: 500;
  text-align: center;
}

.fidbot_info_message_title {
  display: inline-block;
  width: 100%;
  margin-bottom: 30px;
  color: white;
  font-size: 22px;
  font-weight: 800;
  text-align: center;
}

.fidbot_info_message {
  display: inline-block;
  width: 100%;
  line-height: 22px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
}

#fidbotTransferCircle_ctr {
  position: relative;
  flex-shrink: 0;
  width: 120px;
  height: 120px;
  margin: 25px auto;
}

#fidbotTransferCircle {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.fidbotTransferCircleActive {
  animation: progressbar_rotate 1.4s linear infinite;
}

@-webkit-keyframes progressbar_rotate {
  to {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes progressbar_rotate {
  to {
    transform: rotate(360deg);
  }
}

#fidbot_transfer_progress_percent {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  line-height: 120px;
  color: rgb(4, 110, 228);
  font-family: "Lato", "Helvetica", "Arial", sans-serif !important;
  font-size: 30px;
  font-weight: 500;
  text-align: center;
}

#fidbot_transfer_time_left {
  display: none;
}

.fidbot_transfer_stats {
  display: inline-block;
  width: 100%;
  line-height: 28px;
  font-family: "Lato", "Helvetica", "Arial", sans-serif !important;
  color: white;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
}

#fidbot_resume_transfer_btn {
  display: none;
}

#fidbot_transfer_circle svg {
  flex-shrink: 0;
  display: block;
}

#transfer_add_to_audio_group {
  display: inline-block;
  width: 100%;
  margin: 15px 0px;
}

#transfer_add_to_audio_group .selectBox_fb {
  margin-bottom: 0;
}

/*********************************************** FB CALENDAR ***********************************************/
.fb_calendar {
  position: relative;
  border-radius: 7px;
  border: 1px solid rgb(58, 61, 65);
  margin: 15px 0px;
}

.fb_calendar_mobile_ui {
  margin: 0;
  padding-top: 15px;
  background: rgb(38, 40, 44);
  border: none;
  border-radius: 0px;
}

.fb_calendar_opened {
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}

.fb_calendar_header {
  position: relative;
  padding: 0px 15px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fb_calendar_header:hover {
  cursor: pointer;
}

.fb_calendar_placeholder > span,
.fb_calendar_period_selected > span {
  display: block;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
  color: white;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.fb_calendar_header > svg {
  flex-shrink: 0;
  display: block;
  margin-left: 10px;
  fill: white;
}

.fb_calendarActive {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.fb_calendar_mobile_ui .fb_calendar_header>svg {
  display: none;
}

.fb_calendar_content {
  display: none;
  position: absolute;
  top: 38px;
  left: -1px;
  z-index: 2;
  width: 100%;
  border-radius: 0px 0px 8px 8px;
  background: rgb(38, 40, 44);
  border-left: 1px solid rgb(58, 61, 65);
  border-right: 1px solid rgb(58, 61, 65);
  border-bottom: 1px solid rgb(58, 61, 65);
  margin-bottom: 30px;
}

.fb_calendar_content_mobile_ui {
  position: relative;
  top: 0;
  left: 0;
  border: none;
  border-radius: 0px;
  margin: 0;
}

.fb_calendar_selectors {
  display: flex;
  flex-wrap: wrap;
}

.fb_calendar_selector {
  position: relative;
  width: calc(50% - 32px);
  border-radius: 7px;
  border: 1px solid rgb(58, 61, 65);
  margin: 15px;
}

.fb_calendar_selector_opened {
  border-radius: 8px 8px 0px 0px;
}

.fb_calendar_selector_header {
  padding: 0px 15px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fb_calendar_selector_header:hover {
  cursor: pointer;
}

.fb_calendar_selector_header>span {
  display: block;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
  color: white;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.fb_calendar_selector_header>svg {
  flex-shrink: 0;
  display: block;
  margin-left: 10px;
}

.fb_calendar_selectorActive {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.fb_calendar_selector_list {
  display: none;
  position: absolute;
  top: 38px;
  left: -1px;
  z-index: 3;
  width: 100%;
  max-height: 152px;
  border-radius: 0px 0px 8px 8px;
  background: rgb(38, 40, 44);
  border-left: 1px solid rgb(58, 61, 65);
  border-right: 1px solid rgb(58, 61, 65);
  border-bottom: 1px solid rgb(58, 61, 65);
  margin-bottom: 30px;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.fb_calendar_selector_list>li {
  display: block;
  height: 38px;
  line-height: 38px;
  padding: 0px 15px;
  box-sizing: border-box;
  color: white;
  font-size: 14px;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.fb_calendar_selector_list>li:hover {
  cursor: pointer;
  background: rgb(48, 51, 56);
}

.fb_calendar_days {
  padding-bottom: 15px;
  display: flex;
  align-items: center;
}

.fb_calendar_prev, .fb_calendar_next {
  flex-shrink: 0;
  display: block;
  padding: 12.5px;
}

.fb_calendar_next {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.fb_calendar_prev {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.fb_calendar_prev:hover, .fb_calendar_next:hover {
  cursor: pointer;
  fill: rgb(4, 110, 228);
}

.fb_calendar_days_ctr {
  overflow: hidden;
  display: flex;
}

.fb_calendar_days_wrapper {
  position: relative;
  display: flex;
  align-items: stretch;
}

.fb_calendar_days_innerBox {
  list-style-type: none;
  width: 308px;
  display: flex;
  flex-wrap: wrap;
}

.fb_calendar_days_innerBox li {
  width: 14.2857142857%;
  height: 44px;
  line-height: 44px;
  border-radius: 4px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
}

.fb_calendar_days_innerBox li:not([data-date_unselectable=true]):hover {
  cursor: pointer;
  background: rgba(4, 110, 227, .5);
  color: white;
}

.fb_calendar_days_innerBox_range {
  cursor: pointer;
  background: rgb(48, 51, 56);
}

[data-startdateselected=true], [data-enddateselected=true] {
  background: rgb(4, 110, 228) !important;
  color: white !important;
}

[data-date_unselectable=true] {
  color: rgb(58, 60, 64) !important;
}

/*********************************************** ADMIN ***********************************************/

#admin_account_details_header_data_ctr {
  padding: 30px 0 15px 0;
  display: flex;
  align-items: center;
}

#admin_account_details_header_data_left .img {
  flex-shrink: 0;
  height: 108px;
  width: 108px;
  margin-right: 30px;
  border-radius: 50%;
  overflow: hidden;
}

#admin_account_details_header_data_right {
  display: flex;
  flex-direction: column;
}

#admin_account_details_header_data_right a {
  display: block;
  text-decoration: none;
  padding: 10px 0;
  color: white;
  font-size: 14px;
  font-weight: 400;
}

#admin_account_details_header_data_right a:hover {
  color: rgb(4, 110, 228);
}

.admin_account_name_title {
  display: block;
  color: white;
  font-size: 22px;
  font-weight: 800;
}

.admin_simple_txt {
  display: block;
  color: white;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}

/*********************************************** BOUTIQUE ***********************************************/

#boutiqueZone {
  height: 100%;
}

.boutiqueHeader {
  width: 100%;
  border-bottom: 1px solid rgb(58, 61, 65);
}

.boutiqueHeaderTitle {
  display: block;
  padding-bottom: 30px;
  line-height: 40px;
  color: white;
  font-size: 24px;
  font-weight: 800;
}

.boutiqueHeaderBtn {
  display: block;
  padding: 10px 15px;
  box-sizing: border-box;
  background: rgb(49, 51, 56);
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  color: white;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
}

.boutiqueHeaderWarningMessage {
  display: block;
  line-height: 22px;
  color: rgb(222, 0, 0);
  font-size: 14px;
  font-weight: 600;
}

@media screen and (max-width: 849px) {

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

  .boutiqueHeaderTitle {
    padding: 20px 0 10px 0;
  }

  .boutiqueHeaderBtn {
    width: 100%;
    margin-top: 10px;
  }
}

@media screen and (min-width: 850px) {

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

  .boutiqueHeaderBtn {
    margin: 0 10px;
  }

  .boutiqueHeaderBtn:hover {
    background: rgb(38, 40, 44);
  }

  .boutiqueHeaderRightZone {
    padding-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
  }
}

#boutiqueWelcomeOuter {
  min-height: 100%;
  background: rgb(28, 30, 34);
  display: flex;
  justify-content: center;
}

#boutiqueWelcomeInner {
  width: 45%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

#boutique_trailer_vid_ctr {
  width: 100%;
  padding-bottom: 30px;
}

#boutique_trailer_vid_ctr .fb_vidPlayer_ctr {
  background: rgb(31, 33, 38);
}

#boutique_welcome_slogan_container {
  padding: 60px 0;
}

#boutiqueWelcomeSlogan {
  display: block;
  color: white;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-image: linear-gradient(-45deg, #ffb618, #ce1a1a);
  line-height: 55px;
  font-size: 40px;
  font-weight: 800;
  text-align: center;
}

#boutiqueWelcomeSlogan_thin {
  display: block;
  padding-top: 20px;
  line-height: 30px;
  color: white;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
}

#boutique_welcome_help_content {
  width: 100%;
  padding-bottom: 40px;
}

.boutiqueWelcomeInfo {
  display: block;
  color: white;
  line-height: 28px;
  font-size: 15px;
  font-weight: 500;
  text-align: center;
}

.boutiqueWelcomeInfo a {
  color: white;
}

#boutiqueWelcomeInner .formBtnColor {
  width: auto;
  margin: 40px 0;
}

@media screen and (min-width: 850px) {

  .boutiqueFlexPebbles {
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
  }
}

@media screen and (max-width: 849px) {

  #boutiqueWelcomeInner {
    width: 100%;
  }

  #boutique_trailer_vid_ctr {
    padding: 0;
  }

  #boutiqueWelcomeSlogan {
    padding: 30px 20px;
  }

  .boutiqueWelcomeInfo {
    padding: 0 15px;
  }
}

.pebbleOuter_medium {
  align-self: flex-start;
}

@media screen and (min-width: 850px) {

  .boutiqueFlexPebbles .pebbleTitleCtr {
    padding: 45px 0 30px 0;
  }

  .boutiqueInfoZoneCtr {
    padding: 15px 20px;
    margin: 30px 60px 0 60px;
    border: 1px solid rgb(58, 61, 65);
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .boutiqueInfoZoneBtns {
    display: flex;
    align-items: center;
  }

  .boutiqueInfoZoneBtn {
    margin-left: 20px;
  }

  .boutiqueInfoZoneBtn:hover {
    background: rgb(38, 40, 44);
  }
}

@media screen and (max-width: 849px) {

  .boutiqueInfoZoneCtr {
    padding: 30px;
    border-bottom: 1px solid rgb(58, 61, 65);
  }

  .boutiqueInfoZoneBtn {
    width: 100%;
    margin-top: 20px;
  }
}

.boutiqueInfoZoneContent {
  display: block;
  color: white;
  line-height: 25px;
  font-size: 14px;
  font-weight: 600;
}

.boutiqueInfoZoneBtns a {
  text-decoration: none;
}

.boutiqueInfoZoneBtn {
  display: block;
  padding: 10px 15px;
  box-sizing: border-box;
  background: rgb(49, 51, 56);
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  color: white;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
}

@media screen and (min-width: 850px) {

  #userBoutiqueSettingsContent {
    padding: 30px 60px;
  }
}

@media screen and (max-width: 849px) {

  #userBoutiqueSettingsContent {
    padding-bottom: 30px;
  }
}

#boutiqueInvoiceDetails .textArea {
  background: none;
  border: 1px solid rgb(58, 61, 65);
  margin: 15px 0;
}

#paymentPortalIcon {
  padding-bottom: 15px;
}

#boutiqueUploadIcon .formBtnGrey {
  margin: 0;
}

#boutiqueIconFileOuter {
  display: none;
}

.boutiqueIconFile {
  display: flex;
  align-items: center;
  justify-content: center;
}

#boutiqueIconImg {
  position: relative;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin-right: 20px;
  overflow: hidden;
}

#boutiqueIconImg img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.boutiqueIconFile span {
  display: block;
  color: white;
  line-height: 20px;
  font-size: 13px;
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

#removeBoutiqueIconFile {
  cursor: pointer;
}

#removeBoutiqueIconFile svg {
  display: block;
  width: 25px;
  flex-shrink: 0;
  fill: white;
}

#boutiqueSelectIconInfo {
  display: block;
  padding-top: 15px;
  color: rgb(4, 110, 228);
  line-height: 20px;
  font-size: 12px;
  font-weight: 500;
  font-style: italic;
}

#transferBoutiqueIconBtn {
  display: none;
}

.colorPicker {
  position: relative;
  width: 100%;
  height: 40px;
  margin-top: 15px;
  display: flex;
  align-items: center;
}

.colorPicker input[type=color] {
  position: absolute;
  top: 3.5px;
  left: -1px;
  visibility: hidden;
  width: 29px;
  height: 33px;
}

.colorPicker .selectColor {
  flex-shrink: 0;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  border: 1px solid rgb(58, 61, 65);
  cursor: pointer;
}

.colorPicker .hashtag {
  flex-shrink: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  color: rgb(128, 128, 128);
  font-size: 15px;
  font-weight: 600;
  text-align: center;
}

.colorPicker .colorCode {
  flex: 1;
  height: 25px;
  border-bottom: 1px solid rgb(58, 61, 65);
  color: white;
  font-size: 14px;
  font-weight: 500;
}

.playerPaywallInputOuter {
  padding: 15px 0;
  display: flex;
  align-items: center;
}

.playerPaywallInputLabel {
  color: white;
  font-size: 12px;
  font-weight: 400;
  text-transform: uppercase;
}

.playerPaywallInput {
  position: relative;
  height: 40px;
  width: 85px;
  margin-left: 15px;
  line-height: normal;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 4px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  transition: border-color 0.25s ease;
  text-align: center;
}

.playerPaywallInput:focus {
  border: 1px solid rgb(4, 110, 228);
}

#playerPaywallCurrencyStr {
  flex-shrink: 0;
  display: block;
  height: 40px;
  line-height: 40px;
  padding: 0 10px;
  margin-left: 15px;
  background: rgb(48, 51, 56);
  border-radius: 4px;
  color: rgb(4, 110, 228);
  font-size: 14px;
  font-weight: 800;
  text-align: center;
}

#playerPaywallTaxMention {
  margin: 15px 0;
  background: rgb(48, 51, 56);
  border: 1px solid rgb(4, 110, 228);
  border-radius: 7px;
  line-height: 22px;
  color: white;
  font-size: 13px;
  font-weight: 500;
  padding: 12.5px 20px;
  text-align: justify;
}

@media screen and (min-width: 850px) {

  #playerPaywallPriceStr {
    align-self: flex-start;
    margin: 5px 0 10px 0;
    padding: 6px;
    background: rgb(48, 51, 56);
    border: 1px solid rgb(58, 61, 65);
    border-radius: 4px;
    color: white;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
  }

  #playerPaywallPriceStr:hover {
    background: rgb(4, 110, 228);
    border: 1px solid rgb(4, 110, 228);
    color: white;
  }
}

@media screen and (max-width: 849px) {

  #playerPaywallPriceStr {
    display: none;
  }
}

#noTaxPlayerPaywall {
  padding: 20px 0;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.checkBoxOuter {
  position: relative;
  flex-shrink: 0;
  width: 15px;
  height: 15px;
}

.checkBox {
  display: block;
  width: 100%;
  height: 100%;
  border: 1px solid rgb(108, 111, 115);
  border-radius: 2px;
}

.checkboxChecked {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 100%;
  fill: white;
}

.checkBoxStr {
  display: block;
  margin-left: 15px;
  line-height: 22px;
  color: white;
  font-size: 13px;
  font-weight: 800;
}

#setPlayerPaywall .legend {
  padding: 10px 0;
}

#setPlayerPaywall_purchaseLink {
  height: 72px;
  background: none;
  border: 1px solid rgb(58, 61, 65);
  font-weight: 600;
}

#pfb_HeaderTitle {
  display: block;
  padding-bottom: 40px;
  line-height: 38px;
  color: white;
  font-size: 30px;
  font-weight: 300;
}

#pfb_HeaderPrice {
  display: inline-block;
  padding: 11px;
  background: rgb(4, 110, 228);
  border-radius: 5px;
  color: white;
  font-size: 17px;
  font-weight: 600;
}

#pfb_HeaderSubTitle {
  display: block;
  padding: 20px 0;
  color: rgb(4, 110, 228);
  font-size: 22px;
  font-weight: 400;
}

#buyer_company_details {
  display: none;
}

@media screen and (max-width: 849px) {

  #buyPlayerFilesMobileBtn,
  #downloadFilesPurchaseMobileBtn,
  #downloadInvoicePurchaseMobileBtn {
    width: 100%;
    height: 45px;
    padding: 0px 20px;
    box-sizing: border-box;
    background: rgb(228, 4, 110);
    color: white;
    font-size: 15px;
    font-weight: 800;
    cursor: pointer;
  }

  #teammate_download_purchase_btn {
    display: block;
    text-decoration: none;
    width: 100%;
    height: 45px;
    line-height: 45px;
    padding: 0px 20px;
    box-sizing: border-box;
    background: rgb(48, 51, 56);
    color: white;
    font-size: 15px;
    font-weight: 800;
    text-align: center;
  }
}

@media screen and (min-width: 850px) {

  #buyPlayerFilesMobileBtn,
  #downloadFilesPurchaseMobileBtn,
  #downloadInvoicePurchaseMobileBtn,
  #teammate_download_purchase_btn {
    display: none;
  }
}

#buyPlayerFilesBtn {
  background: rgb(228, 4, 110);
}

#downloadFilesPurchaseDesktopBtn {
  background: rgb(228, 4, 110);
}

#downloadInvoicePurchaseMobileBtn {
  background: none;
}

.userBoutiqueSalesListHeader {
  width: 100%;
  border-bottom: 1px solid rgb(58, 61, 65);
}

.userBoutiqueSalesListTitle {
  display: block;
  margin-bottom: 30px;
  color: white;
  font-size: 24px;
  font-weight: 800;
}

.boutiqueList_searchBar {
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  padding: 4px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.boutiqueList_searchBarWen {
  position: relative;
}

.boutiqueList_searchBarWen svg {
  display: block;
  flex-shrink: 0;
  margin-right: 5px;
  fill: white;
}

.boutiqueList_searchBar input {
  flex: 1;
  line-height: normal;
  color: white;
  font-size: 14px;
  font-weight: 600;
}

.boutiqueList_searchBar input::placeholder {
  color: white;
}

.boutiqueList_resetFiltersBtn {
  display: block;
  height: 40px;
  padding: 0 15px;
  box-sizing: border-box;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  color: white;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
}

@media screen and (max-width: 849px) {

  .userBoutiqueSalesListTools {
    display: flex;
    flex-direction: column-reverse;
  }

  .userBoutiqueSalesListTools .fb_calendar {
    flex: 1;
    margin: 0 15px 30px 0;
  }

  .boutiqueList_resetFiltersBtn {
    margin-bottom: 30px;
  }

  .boutiqueList_searchBar {
    width: 100%;
    margin: 0 0 30px 0;
  }
}

@media screen and (min-width: 850px) {

  .userBoutiqueSalesListTools {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }

  .boutiqueList_searchBar {
    flex: 3;
    margin: 0 10px 30px 10px;
  }

  .userBoutiqueSalesListTools .fb_calendar {
    width: 350px;
    margin: 0 10px 30px 10px;
  }

  .boutiqueList_resetFiltersBtn {
    margin: 0 10px 30px 10px;
  }

  .boutiqueList_resetFiltersBtn:hover {
    background: rgb(48, 51, 56);
  }
}

.userBoutiqueSalesListSubTools {
  display: flex;
  align-items: center;
}

.boutiqueList {
  position: relative;
}

.boutiqueList a {
  text-decoration: none;
  height: 50px;
  padding: 0 10px;
  border-bottom: 1px solid rgb(58, 61, 65);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.boutiqueListBlock {
  padding: 10px;
  border-bottom: 1px solid rgb(58, 61, 65);
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

.boutiqueList_noResults {
  padding: 20px;
}

@media screen and (min-width: 850px) {

  .boutiqueList a:hover,
  .boutiqueListBlock:hover {
    background: rgb(48, 51, 56);
  }
}

@media screen and (max-width: 849px) {

  .boutiqueListBlock {
    padding: 30px;
  }
}

.boutiqueList_leftBlock {
  width: 50%;
}

.boutiqueList_leftBlock_large {
  width: 70%;
}

.boutiqueList_rightBlock,
.boutiqueList_rightBlock_small {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.boutiqueList_rightBlock {
  width: 50%;
}

.boutiqueList_leftBlock span,
.boutiqueList_noResults span {
  display: block;
  color: white;
  font-size: 13px;
  font-weight: 400;
}

.boutiqueList_leftBlock_large span {
  display: block;
  margin-right: 20px;
  line-height: 25px;
  color: white;
  font-size: 13px;
  font-weight: 400;
}

.boutiqueList_leftBlock span {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.boutiqueList_refundedIcon_pending,
.boutiqueList_refundedIcon_succeeded,
.boutiqueList_refundedIcon_failed {
  display: block;
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin-right: 20px;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
}

.boutiqueList_refundedIcon_pending {
  border: 1px solid rgb(58, 61, 65);
  color: rgb(178, 180, 184);
}

.boutiqueList_refundedIcon_succeeded {
  border: 1px solid rgb(4, 110, 228);
  color: rgb(4, 110, 228);
}

.boutiqueList_refundedIcon_failed {
  border: 1px solid rgb(222, 0, 0);
  color: rgb(222, 0, 0);
}

.boutiqueList_salePrice {
  display: block;
  margin-right: 40px;
  color: white;
  font-size: 13px;
  font-weight: 800;
}

.boutiqueList_saleDate {
  display: block;
  color: white;
  font-size: 13px;
  font-weight: 400;
}

@media screen and (max-width: 849px) {

  .boutiqueList_salePrice {
    margin-right: 0;
  }

  .boutiqueList_saleDate {
    display: none;
  }
}

.boutiqueListFooter {
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.boutiqueListFooter_leftZone span {
  color: rgb(128, 128, 128);
  font-size: 12px;
  font-weight: 500;
}

.boutiqueListDisplayed {
  margin-right: 3px;
}

.boutiqueList_salesTotal,
.boutiqueList_docsTotal {
  margin: 0 3px;
}

.boutiqueListFooter_rightZone {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.boutiqueList_load {
  padding: 8px 12px;
  box-sizing: border-box;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 4px;
  color: white;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
}

.boutiqueList_load[data-action=prev] {
  margin-right: 15px;
}

.boutiqueList_load.disabled {
  color: rgb(58, 61, 65);
  pointer-events: none;
}

@media screen and (min-width: 850px) {

  .boutiqueList_loadPrev[data-action=prev] {
    background: rgb(48, 51, 56);
  }
}

@media screen and (max-width: 849px) {

  .boutiqueListFooter {
    padding: 0 10px;
  }
}

@media screen and (min-width: 850px) {

  #userBoutiqueSalesContent {
    display: flex;
    flex-wrap: wrap;
    padding: 30px;
  }

  #userBoutiqueSalesThumbnails {
    flex: 1;
    min-width: 220px;
    padding: 30px;
    box-sizing: border-box;
  }

  #userBoutiqueSalesList {
    flex: 3;
    padding: 30px;
    box-sizing: border-box;
  }
}

@media screen and (max-width: 849px) {

  #userBoutiqueSalesThumbnails {
    padding: 30px 30px 0 30px;
  }

  #userBoutiqueSalesList {
    padding: 0 30px 30px 30px;
  }
}

.userBoutiqueSalesThumbnail {
  max-height: 510px;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  padding: 20px 20px 0 20px;
  margin-bottom: 29px;
  overflow-y: auto;
}

.userBoutiqueSalesThumbnailHeader {
  margin-bottom: 20px;
  display: flex;
  align-items: center;
}

.userBoutiqueSalesThumbnailHeader span {
  display: block;
  line-height: 20px;
  color: white;
  font-size: 14px;
  font-weight: 600;
}

.boutique_help_icon {
  flex-shrink: 0;
  text-decoration: none;
  display: block;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  line-height: 20px;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 50%;
  color: rgb(4, 110, 228);
  font-size: 12px;
  font-weight: 600;
  text-align: center;
}

@media screen and (min-width: 850px) {

  .boutique_help_icon:hover {
    border: 1px solid rgb(4, 110, 228);
  }
}

.userBoutiqueSalesThumbnailContent {
  display: block;
  margin-bottom: 20px;
  color: rgb(4, 110, 228);
  font-size: 20px;
  font-weight: 400;
}

.userBoutiqueSalesThumbnailFooter {
  display: block;
  margin-bottom: 30px;
  color: rgb(178, 180, 184);
  font-size: 12px;
  font-weight: 500;
}

.userBoutiqueSalesPayoutThumbnail {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgb(58, 61, 65);
}

.userBoutiqueSalesPayoutAmount {
  display: block;
  margin-bottom: 10px;
  color: rgb(4, 110, 228);
  font-size: 20px;
  font-weight: 400;
}

.userBoutiqueSalesPayoutDate {
  display: block;
  color: rgb(178, 180, 184);
  font-size: 12px;
  font-weight: 500;
}

@media screen and (min-width: 850px) {

  #userBoutiqueSaleContent {
    padding: 30px 60px;
  }

  #userBoutiqueSaleContent .pebbleOuter_medium {
    align-self: stretch;
  }
}

.purchaseDetailsContent {
  display: flex;
  align-items: center;
}

.pebbleSaleTitle {
  display: block;
  padding: 35px 0;
  color: rgb(4, 110, 228);
  font-size: 18px;
  font-weight: 800;
}

.purchaseDetailsArtwork {
  flex-shrink: 0;
  position: relative;
  width: 140px;
  height: 140px;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  margin-right: 20px;
  overflow: hidden;
}

.purchaseDetailsDefaultArtwork {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(48, 51, 56);
  z-index: 1;
}

.purchaseDetailsDefaultArtwork svg {
  position: relative;
  top: calc(50% - 30px);
  left: calc(50% - 30px);
}

.purchaseDetailsArtworkImg {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
}

.purchaseDetailsArtworkImg img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.purchaseDetailsInfo a {
  text-decoration: none;
  display: block;
}

@media screen and (min-width: 850px) {

  .purchaseDetailsInfo a:hover span {
    color: rgb(4, 110, 228);
  }
}

.purchaseDetailsInfo_pn,
.purchaseDetailsInfo_pAn,
.purchaseDetailsInfo_price {
  display: block;
  line-height: 25px;
  color: white;
  font-size: 14px;
  font-weight: 600;
}

.purchaseDetailsInfo_pn {
  font-size: 16px;
  font-weight: 800;
}

.purchaseDetailsInfo_price {
  color: rgb(4, 110, 228);
}

.purchaseDetailsFees {
  padding-bottom: 20px;
}

.purchaseDetailsFee {
  padding-top: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.purchaseDetailsFee span {
  display: block;
  line-height: 20px;
  color: white;
  font-size: 14px;
  font-weight: 600;
}

.purchaseDetailsFee span:nth-child(2) {
  color: rgb(4, 110, 228);
}

.customerDetailsContent span {
  display: block;
  margin-bottom: 15px;
  line-height: 22px;
  color: white;
  font-size: 14px;
  font-weight: 400;
}

.customerDetailsContent span:nth-child(1) {
  font-weight: 800;
}

.customerDetailsContent a {
  display: block;
  text-decoration: none;
  padding-bottom: 20px;
  color: rgb(4, 110, 228);
  font-size: 14px;
  font-weight: 600;
}

@media screen and (min-width: 850px) {

  .customerDetailsContent a:hover {
    text-decoration: underline;
  }
}

.customerDetail_flex {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}

.customerDetail_flex span {
  margin: 0;
}

.customerDetail_flagImg {
  position: relative;
  width: 28px;
  margin-right: 10px;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 4px;
  overflow: hidden;
}

.customerDetail_flagImg img {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.invoiceAndReceiptContent span {
  display: block;
  padding-bottom: 25px;
  color: white;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.invoiceAndReceiptContent a {
  display: block;
  text-decoration: none;
  padding-bottom: 20px;
  color: white;
  font-size: 14px;
  font-weight: 600;
}

@media screen and (min-width: 850px) {

  .invoiceAndReceiptContent span:hover,
  .invoiceAndReceiptContent a:hover {
    color: rgb(4, 110, 228);
  }
}

.saleMessageContent {
  padding: 20px;
  margin: 30px 0;
  border: 1px solid rgb(4, 110, 228);
  border-radius: 7px;
  line-height: 22px;
  color: white;
  font-size: 14px;
  font-weight: 500;
}

.saleMessageContent a {
  color: rgb(4, 110, 228);
  font-weight: 800;
}

.customerPaymentMethodTitle {
  display: block;
  padding: 15px 0;
  border-bottom: 1px solid rgb(58, 61, 65);
  color: white;
  font-size: 15px;
  font-weight: 800;
}

.customerPaymentMethodDetails {
  padding: 15px 0;
  display: flex;
  align-items: center;
}

.customerPaymentMethodDetailsImg {
  display: block;
  flex-shrink: 0;
  width: 35px;
}

.customerPaymentMethodDetails span {
  color: white;
  font-size: 14px;
  font-weight: 600;
  margin: 0 15px;
}

@media screen and (min-width: 850px) {

  #userBoutiqueInvoicesContent {
    padding: 30px 60px;
  }
}

@media screen and (max-width: 849px) {

  #userBoutiqueInvoicesContent {
    padding: 30px;
  }
}

.userBoutiqueInvoicesListHeader {
  width: 100%;
  border-bottom: 1px solid rgb(58, 61, 65);
}

.userBoutiqueInvoicesListTitle {
  display: block;
  margin-bottom: 30px;
  color: white;
  font-size: 24px;
  font-weight: 800;
}

.userBoutiqueInvoicesForm {
  padding: 30px 0;
}

@media screen and (min-width: 850px) {

  .userBoutiqueInvoicesForm {
    width: 450px;
  }
}

.userBoutiqueInvoices_clientSearchCtr {
  position: relative;
  height: 40px;
  padding: 4px;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

.userBoutiqueInvoices_clientSearchCtr_opened {
  border-radius: 8px 8px 0 0;
}

.userBoutiqueInvoices_clientSearchWen {
  position: relative;
}

.userBoutiqueInvoices_clientSearchWen svg {
  display: block;
  flex-shrink: 0;
  margin-right: 5px;
  fill: white;
}

.userBoutiqueInvoices_clientSearch {
  flex: 1;
  line-height: normal;
  color: white;
  font-size: 14px;
  font-weight: 600;
}

.userBoutiqueInvoices_clientSearch::placeholder {
  color: white;
}

.userBoutiqueInvoices_clientSearch_results {
  display: none;
  position: absolute;
  z-index: 1;
  top: 38px;
  left: -1px;
  width: 100%;
  background: rgb(38, 40, 44);
  border-left: 1px solid rgb(58, 61, 65);
  border-right: 1px solid rgb(58, 61, 65);
  border-bottom: 1px solid rgb(58, 61, 65);
  border-radius: 0 0 8px 8px;
}

.ubicsr_result,
.ubicsr_no_result {
  height: 40px;
  padding: 0 20px;
  display: flex;
  align-items: center;
}

.ubicsr_result {
  cursor: pointer;
}

.userBoutiqueInvoices_clientSearch_results span {
  display: block;
  margin-right: 5px;
  color: white;
  font-size: 14px;
  font-weight: 600;
}

.userBoutiqueInvoices_clientSearch_results span:nth-child(2) {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.userBoutiqueInvoicesForm .fb_calendar {
  margin: 30px 0;
}

.userBoutiqueInvoices_resetFiltersBtn {
  display: block;
  width: 100%;
  height: 40px;
  padding: 0 15px;
  margin-bottom: 15px;
  box-sizing: border-box;
  border: 1px solid rgb(58, 61, 65);
  border-radius: 7px;
  color: white;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
}

.userBoutiqueInvoices_searchResults {
  display: none;
  padding: 10px 0;
  color: rgb(4, 110, 228);
  font-size: 14px;
  font-weight: 600;
}

@media screen and (min-width: 850px) {

  .ubicsr_result:hover {
    background: rgb(48, 51, 56);
  }

  .userBoutiqueInvoices_resetFiltersBtn:hover {
    background: rgb(48, 51, 56);
  }
}

@media screen and (min-width: 850px) {

  #userBoutiqueHelpContent {
    padding: 30px 60px;
  }
}

@media screen and (max-width: 849px) {

  #userBoutiqueHelpContent {
    padding-bottom: 30px;
  }
}

.userBoutiqueHelpHeader {
  border-bottom: 1px solid rgb(58, 61, 65);
}

@media screen and (min-width: 850px) {

  .userBoutiqueHelpHeader {
    padding-bottom: 30px;
  }
}

@media screen and (max-width: 849px) {

  .userBoutiqueHelpHeader {
    padding: 30px;
  }
}

.userBoutiqueHelpHeader span {
  display: block;
  line-height: 40px;
  color: white;
  font-size: 24px;
  font-weight: 800;
}

.userBoutiqueHelpTheme {
  border-bottom: 1px solid rgb(58, 61, 65);
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

@media screen and (min-width: 850px) {

  .userBoutiqueHelpTheme:hover span {
    color: rgb(4, 110, 228);
  }

  .userBoutiqueHelpTheme {
    padding: 20px;
  }
}

@media screen and (max-width: 849px) {

  .userBoutiqueHelpTheme {
    padding: 30px;
  }
}

.userBoutiqueHelpTheme span {
  display: block;
  margin-right: 30px;
  line-height: 22px;
  color: white;
  font-size: 14px;
  font-weight: 600;
}

.user_boutique_help_question_selected {
  color: rgb(4, 110, 228) !important;
}

.userBoutiqueHelpThemeArrrow {
  transition: transform 0.25s ease;
}

.userBoutiqueHelpThemeArrrow svg {
  display: block;
  flex-shrink: 0;
  fill: white;
}

.userBoutiqueHelpTheme_isOpened {
  transform: rotate(180deg);
}

.userBoutiqueHelpBlockContent {
  display: none;
  padding: 30px;
  line-height: 25px;
  color: white;
  font-size: 14px;
  font-weight: 400;
  text-align: justify;
}

.userBoutiqueHelpBlockContent a {
  color: white;
}

@media screen and (min-width: 850px) {

  #user_boutique_docs_content {
    padding: 30px 60px;
  }
}

@media screen and (max-width: 849px) {

  #user_boutique_docs_content {
    padding-bottom: 30px;
  }
}

#user_boutique_docs_header {
  border-bottom: 1px solid rgb(58, 61, 65);
}

@media screen and (min-width: 850px) {

  #user_boutique_docs_header {
    padding-bottom: 30px;
  }
}

@media screen and (max-width: 849px) {

  #user_boutique_docs_header {
    padding: 30px;
  }
}

#user_boutique_docs_header span {
  display: block;
  line-height: 40px;
  color: white;
  font-size: 24px;
  font-weight: 800;
}

@media screen and (min-width: 850px) {

.download_user_boutique_doc {
  visibility: hidden;
  }

  .boutiqueListBlock:hover .download_user_boutique_doc{
    visibility: visible;
  }
}

#boutique_side_menu_bottom {
  padding: 20px;
  box-sizing: border-box;
}

#boutique_side_menu_bottom a {
  display: block;
  text-decoration: none;
  color: white;
  font-size: 12px;
  font-weight: 800;
}

@media screen and (min-width: 850px) {

  #boutique_side_menu_bottom a:hover {
    color: rgb(4, 110, 228);
  }
}