/* LOGO */

.st-light-theme {
  --st-logo-path: url(./assets/logo-light.png);
}
.st-dark-theme {
  --st-logo-path:  url(./assets/logo-dark.png);
}

/* ROOT*/

:root {
    --st-light-primary-color: #12C63F !important;
    --st-dark-primary-color: #12C63F !important;
    --st-light-secondary-color: #12C63F !important;
    --st-dark-secondary-color: #12C63F !important;
    --st-success-message-color: #12C63F !important;
    --st-error-message-color: #DD4B39 !important;
    --st-positive-color: #12C63F !important;
    --st-negative-color: #DD4B39 !important;
    --palette-background-background: #ffffff !important;
}



/* PAGES */



/* >>> Portal general <<< */

/* light-dark theme button */

div > mat-chip.mat-chip.mat-focus-indicator.st-menu-button.st-menu-button--theme.mat-primary.mat-standard-chip.ng-star-inserted {
display: none;
}

/* portal background color */

.mat-app-background {
background-color: #ffffff!important;
}



/* >>> Login page <<< */
/* https://social.bcm-markets.com/portal/login */




/* page div */
body > app-root > ng-component > brs-app-wrapper > div {
background-color: #ffffff!important;	
}

/* header div */

body > app-root > ng-component > brs-app-wrapper > div > header.brs-header {
/*box-shadow: 0px 0px 10px 0px #E3E4E8!important;*/
box-shadow: 0px 5px 5px -5px #C5CCD1!important;
border-width: 0px!important;
display: none!important;
}

body > app-root > ng-component > brs-app-wrapper > div > header > div.brs-header__container {
background-color: #f0f1f5!important;
}

.brs-header__container {
min-height: 50px!important;
}

/* user login div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login {
overflow: hidden!important;
}

/* form div */

body > app-root > ng-component > brs-app-wrapper > div > main.brs-main.brs-main--center {
background-color: #f0f1f5!important;
padding-bottom: 100px!important;
padding-left: 0px!important;
padding-right: 0px!important;
padding-top: 25px!important;
}

/* min width divs */

body > app-root > ng-component > brs-app-wrapper > div > main.brs-main.brs-main--center {
min-width: 0px!important;	
}

.brs-main.brs-main--center {
min-width: 0px!important;	
}

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div.brs-modal.brs-modal--page-inline.st-login-modal {
min-width: 0px!important;	
}

.brs-modal.brs-modal--page-inline.st-login-modal {
min-width: 0px!important;	
}

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > form.brs-form.ng-untouched.ng-pristine.ng-invalid {
min-width: 0px!important;
}

.brs-form.ng-untouched.ng-pristine.ng-invalid {
min-width: 0px!important;
}

.brs-form.ng-untouched.ng-pristine.ng-valid {
min-width: 0px!important;
}

.brs-form.ng-dirty.ng-touched.ng-valid {
min-width: 0px!important;
}

.brs-form.ng-dirty.ng-touched.ng-invalid {
min-width: 0px!important;
}

.brs-form.ng-invalid {
min-width: 0px!important;
}

.brs-form.ng-valid {
min-width: 0px!important;
}

/* footer div */

body > app-root > ng-component > brs-app-wrapper > div > footer {
margin: 0px!important;
padding: 0px;
background-color: #f0f1f5;
}

/* >>> <<< */

/* logo + title + sub-title div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > div {
margin: 0px!important;
padding-left: 25px!important;
padding-right: 25px!important;
padding-bottom: 18px!important;
}

/* BCM logo */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > div > div {
margin-top: 10px;
margin-bottom: 28px!important;
}

/* div containing the login form */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div.brs-modal.brs-modal--page-inline.st-login-modal {
margin-top: 0px!important;
margin-bottom: 0px!important;
background-color: #ffffff!important;
border-width: 0px!important;
box-shadow: 0px 0px 10px 0px #E3E4E8;
}

/* >>> <<< */

/* title div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > div > brand-product-name {
margin-bottom: 5px!important;
display: flex!important;
flex-direction: column!important;
}

/* title before text*/

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > div > brand-product-name::before {
content: "Social Trading";
text-align: center;
font-size: 24px!important;
font-weight: 400!important;
line-height: 32px;
margin-bottom: 10px;
}

/* title after text*/

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > div > brand-product-name::after {
content: "Client Portal";
text-align: center;
font-size: 24px!important;
font-weight: 400!important;
color: rgba(0, 0, 0, 0.87);
opacity: .6;
line-height: 32px;
}

/* original title from en json */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > div > brand-product-name > span {
display: none;
}

/* >>> <<< */

/* insert your trading account login sub-title */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > div > small {
display: none;
}

/* login + password div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > form > div.brs-modal__content {
padding-left: 25px!important;
padding-right: 25px!important;
}

/* login button div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > form > div.brs-modal__actions {
padding-top: 18px;
padding-bottom: 35px;
padding-left: 25px!important;
padding-right: 25px!important;
}

/* login button itself */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > div > form > div.brs-modal__actions > button {
width: 100% !important;
height: 52px !important;
font-weight: 600 !important;
font-size: 16.8px !important;
min-width: 0px!important;
}

/* click here link below login button */

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > account-registration-link > div {
display: none!important;
}

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > account-registration-link > div > div > a.brs-link {
border-bottom: 0px dashed var(--brs-gray-color-darker) !important;
color: var(--st-light-primary-color)!important;
margin-right: -3px;
}

body > app-root > ng-component > brs-app-wrapper > div > main > user-login > account-registration-link > div > div > a.brs-link:hover {
border-bottom: 0px dashed rgb(var(--palette-primary-500))!important;
color: #14E148!important;
}





/* >>> Identity confirmation page <<< */
/* https://social.bcm-markets.com/portal/login/confirmation */

/* min width */

.brs-modal {
min-width: 0px!important;
}

.brs-form.ng-touched.ng-pristine.ng-valid {
min-width: 0px!important;
}

.brs-form.ng-touched.ng-pristine.ng-invalid {
min-width: 0px!important;
}

.brs-form.ng-untouched.ng-pristine.ng-invalid {
min-width: 0px!important;
}

.brs-form.ng-untouched.ng-pristine.ng-valid {
min-width: 0px!important;
}

/* identity confirmation div */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation {
overflow: hidden!important;
}

/* page containing the login form */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div.brs-modal.brs-modal--page-inline {
margin-top: 0px!important;
margin-bottom: 0px!important;
background-color: #ffffff!important;
box-shadow: 0px 0px 10px 0px #E3E4E8!important;
border-width: 0px!important;
}

/* BCM logo */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > div.brs-modal__headline > div {
margin-top: 10px;
margin-bottom: 26px!important;
}

/* main title */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > div.brs-modal__headline > span {
margin-bottom: 10px!important;
}

/* box containing the logo, title and sub title */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > div.brs-modal__headline {
padding-bottom: 18px!important;
padding-left: 25px!important;
padding-right: 25px!important;
margin: 0px!important;
}

/* box containing the password div */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > form > div.brs-modal__content {
padding-left: 25px!important;
padding-right: 25px!important;
}

/* confirm button's box */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > form > div.brs-modal__actions {
padding-top: 18px!important;
padding-bottom: 26px!important;
padding-left: 25px!important;
Padding-right: 25px!important;
}

/* confirm button itself */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > form > div.brs-modal__actions > button {
width: 100% !important;
height: 52px !important;
font-weight: 600 !important;
font-size: 16.8px !important;
min-width: 0px !important;
}

/* log out button div */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > div.brs-modal__links {
padding-bottom: 27px;
padding-left: 25px!important;
padding-right: 25px!important;
margin: 0px!important;
}

/* log out button text */

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > div.brs-modal__links > a.brs-link {
border-bottom: 0px dashed var(--brs-gray-color-darker) !important;
color: var(--st-light-primary-color)!important;
}

body > app-root > ng-component > brs-app-wrapper > div > main > app-identity-confirmation > div > div.brs-modal__links > a.brs-link:hover {
border-bottom: 0px dashed rgb(var(--palette-primary-500))!important;
color: #14E148!important;
}





/* >>> home page <<< */
/* https://social.bcm-markets.com/portal */



/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
  user-dashboard > section.brs-page-title.brs-page-title--with-actions > div.brs-page-title__container {
          display: flex;
          flex-direction: column;
          justify-content: center;
        }
}
        
/* image div */
      
@media (max-width: 499px) {
  user-dashboard > section.brs-page-title.brs-page-title--with-actions > div.brs-page-title__container > div.brs-page-title__icon {
          margin-right: 0px;
          margin-bottom: 16px;
        }
}
        
/* title + subtitle div */

@media (max-width: 499px) {
  user-dashboard > section.brs-page-title.brs-page-title--with-actions > div.brs-page-title__container > div.brs-page-title__text {
          text-align: center;
          width: 100%;
        }
}
        
/* title */
        
user-dashboard > section.brs-page-title.brs-page-title--with-actions > div.brs-page-title__container > div.brs-page-title__text > span {
          white-space: normal;
          overflow-wrap: break-word;
          max-width: 100%;
}
        
/* sub-title */
        
user-dashboard > section.brs-page-title.brs-page-title--with-actions > div.brs-page-title__container > div.brs-page-title__text > small {
          white-space: normal;
          overflow-wrap: break-word;
          max-width: 100%;
}



/* >>> follower home - add new trading account button <<< */

/* refresh and green button div */

@media (max-width: 499px) {
  body > app-root > user-portal-layout > brs-app-wrapper > div > main > user-dashboard > section.st-dashboards > section > user-accounts-view > div > div > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons {
    display: flex;
    flex-direction: column-reverse;
  }
}
  
/* refresh button */
  
@media (max-width: 499px) {
user-dashboard > section.st-dashboards > section > user-accounts-view > div > div > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > button.mat-focus-indicator.mat-stroked-button.mat-button-base.ng-star-inserted {
      margin-right: 0px;
      margin-top: 10px;
    }
}

/* green button itself text */
  
user-dashboard > section.st-dashboards > section > user-accounts-view > div > div > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper::before {
  content: "Add New Trading Account";
}
  
user-dashboard > section.st-dashboards > section > user-accounts-view > div > div > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper > span {
  display: none;
}

/* green button itself div */

@media (min-width: 500px) {
user-dashboard > section.st-dashboards > section > user-accounts-view > div > div > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons {
  min-width: max-content;
}
}
  





/* >>> page elements <<< */

/* buttons */

.brs-page-title--with-actions .brs-page__actions button {
  min-width: 0px!important;
  margin-left: 6px!important;
  margin-top: 6px!important;
  margin-bottom: 6px!important;
}
  
.brs-page__actions button {
  min-width: 0px!important;
}
  
.mat-focus-indicator.mat-flat-button.mat-button-base.mat-primary.ng-star-inserted {
  white-space: normal;
  overflow-wrap: break-word;
  line-height: 26px;
  padding-top: 5px!important;
  padding-bottom: 5px!important;
  min-height: fit-content;
}

.mat-focus-indicator.mat-stroked-button.mat-button-base {
  white-space: normal;
  overflow-wrap: break-word;
  line-height: 26px;
  padding-top: 5px!important;
  padding-bottom: 5px!important;
  min-height: fit-content;
}

@media (max-width: 499px) {
.brs-modal__actions button {
  min-width: 0px!important;
  height: 39px;
}
}


/* page title with actions div */

@media (max-width: 769px) {
  .brs-page-title.brs-page-title--with-actions {
  display: flex !important;
  flex-direction: column !important;
  }
}
  
@media (min-width: 680px) and (max-width: 769px) {
  .brs-page-title__container {
  margin-bottom: 20px!important;
  }
}

/* page actions buttons div */

@media (max-width: 499px) {
  .brs-page__actions {
  display: flex!important;
  flex-direction: column!important;
  }
}

/* action buttons div */

.brs-actions__buttons {
  padding-top: 10px;
  padding-bottom: 10px;
}







/* >>> page common elements <<< */

/* header container */

.brs-header__container {
padding-left: 25px!important;
padding-right: 25px!important;
}

/* body main container */

.brs-main {
padding-left: 25px!important;
padding-right: 25px!important;
}

/* min width items */

.brs-system-wrapper, .brs-header__container, .brs-app .brs-main {
min-width: 0px!important;
}

.brs-system-wrapper, .brs-header__container, .brs-app .brs-main {
min-width: 0px!important;
}




/* >>> pop-up common elements <<< */






/* >>> desktop menu div <<< */

nav.brs-header__menu.brs-from-tablets > a:nth-child(1) > span.mat-button-focus-overlay {
  display: none;
}

nav.brs-header__menu.brs-from-tablets > a:nth-child(1) > span.mat-ripple.mat-button-ripple {
  display: none;
}



/* >>> mobile menu div <<< */

/* menu div */

.mat-menu-content:not(:empty) {
padding-right: 25px!important;
padding-left: 25px!important;
padding-top: 18px!important;
padding-bottom: 18px!important;
}

/* logo div */

div.mat-menu-content > a:nth-child(1)::after {
  content: 'Home';
  font-size: 16px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.87);
  line-height: 36px;
}

div.mat-menu-content > a:nth-child(1):hover {
  padding-top: 23px;
  padding-bottom: 23px;
  margin-bottom: -1.5px;
}

div.mat-menu-content > a:nth-child(1):hover::after {
  content: 'Home';
  font-size: 16px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.87);
  display: flex;
  flex-direction: column-reverse;
  line-height: 46px;
  height: 3px;
  bottom: -2px;
  opacity: 1!important;
  background-color: #9de7af!important;
}

div.mat-menu-content > a:nth-child(1).brs-header__menu--active {
  padding-top: 23px;
  padding-bottom: 23px;
  margin-bottom: -1.5px;
}

div.mat-menu-content > a:nth-child(1).brs-header__menu--active::after {
  content: 'Home';
  font-size: 16px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.87);
  display: flex;
  flex-direction: column-reverse;
  line-height: 46px;
  height: 3px;
  bottom: -2px;
}

div.mat-menu-content > a:nth-child(1) > span.mat-button-wrapper > span.st-header-logo-link {
  display: none;
}

div.mat-menu-content > a:nth-child(1) > span.mat-button-focus-overlay {
  background: #fff!important;
}

/* all buttons */

div > a.mat-focus-indicator.mat-button.mat-button-base.brs-header__menu--active.ng-star-inserted {
white-space: normal;
overflow-wrap: break-word;
}

div > a.mat-focus-indicator.st-header-providers.mat-button.mat-button-base.ng-star-inserted {
white-space: normal;
overflow-wrap: break-word;
}

div > a.mat-focus-indicator.st-header-accounts.mat-button.mat-button-base {
white-space: normal;
overflow-wrap: break-word;
}

div > a.mat-focus-indicator.st-header-transactions.mat-button.mat-button-base {
white-space: normal;
overflow-wrap: break-word;
}

div > a.mat-focus-indicator.st-app-ratings-menu.mat-button.mat-button-base.ng-star-inserted {
white-space: normal;
overflow-wrap: break-word;
}



/* >>> header menu buttons <<< */

/* contact us button */

.mat-chip.mat-focus-indicator.mat-menu-trigger.st-menu-button.st-menu-button--contacts.mat-primary.mat-standard-chip.ng-star-inserted {
display: none;
}

/* header container */

@media (max-width: 242px) {
.brs-header__container {
padding-top: 10px!important;
padding-bottom: 2px!important;
justify-content: center!important;
}
}

/* settings + language + logout div */

.mat-chip-list-wrapper {
justify-content: center;
}

@media (max-width: 242px) {
.mat-chip-list-wrapper {
margin-top: 4px!important;
margin-bottom: 4px!important;
}
}

/* menu button */

body > app-root > user-portal-layout > brs-app-wrapper > div > header > div > nav.brs-to-tablets > mat-chip {
margin-right: 8px;
}

@media (max-width: 242px) {
  body > app-root > user-portal-layout > brs-app-wrapper > div > header > div > nav.brs-to-tablets > mat-chip {
    margin-left: 8px;
    }
}

/* language div */

.mat-menu-panel {
min-width: 0px!important;
}



/* >>> notification settings pop-up <<< */

/* pup up div */

.brs-modal .brs-form {
min-width: 0px!important;
}

.brs-modal {
min-width: 0px!important;
}

.brs-form {
min-width: 0px!important;
}

.brs-modal .brs-list {
min-width: 0px!important;
}

.brs-list {
min-width: 0px!important;
}

/* header div */

.brs-modal__headline {
margin: 0px!important;
padding-left: 25px!important;
padding-right: 25px!important;
}

/* body div */

.brs-modal__content {
padding-left: 25px!important;
padding-right: 25px!important;
}

/* buttons div */

.brs-modal__actions {
padding-left: 25px!important;
padding-right: 25px!important;
padding-bottom: 35px!important;
padding-top: 16px!important;
}

@media (max-width: 399px) {
section.brs-modal > form.brs-form > .brs-modal__actions {
flex-direction: column-reverse;
}
}

@media (max-width: 399px) {
  section.brs-modal-extension__content > form > div.brs-modal__actions {
  flex-direction: column-reverse;
  }
}

@media (max-width: 399px) {
section.brs-modal > form.brs-form > div.brs-modal__actions > button:nth-child(1) {
margin-top: 25px;
}
}

@media (max-width: 399px) {
  section.brs-modal-extension__content > form > div.brs-modal__actions > button:nth-child(1) {
  margin-top: 25px;
  }
}




/* >>> nav brs breadcrumbs <<< */

@media (max-width: 399px) {
nav.brs-breadcrumbs {
  display: flex;
  flex-direction: column;
  height: fit-content;
  padding-top: 10px;
  padding-bottom: 15px;
}
}

@media (max-width: 399px) {
  nav.brs-breadcrumbs > .brs-breadcrumbs__paths {
    padding-bottom: 10px;
  }
}

@media (max-width: 399px) {
  nav.brs-breadcrumbs > .brs-breadcrumbs__actions {
    display: flex;
    justify-content: center;
  }
}

/* >>> brs-headblock <<< */

.brs-headblock {
  display: flex;
  align-items: center;
}

.brs-actions.ng-star-inserted {
  display: flex;
  align-items: center;
}

@media (min-width: 960px) {
brs-table > section.brs-actions.ng-star-inserted {
  padding-bottom: 20px!important;
}
}

@media (min-width: 960px) {
brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__title.ng-star-inserted {
  margin-bottom: 0px!important;
}
}

@media (min-width: 960px) {
brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__filters.ng-star-inserted > form > formly-form > formly-field > formly-group > formly-field > formly-wrapper-mat-form-field > mat-form-field {
  margin-bottom: 0px!important;
}
}










/* >>> My portfolio <<< */
/* https://social.bcm-markets.com/portal/subscriptions */



/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
  user-subscriptions-view > section.brs-page-title {
          display: flex;
          flex-direction: column;
          justify-content: center;
        }
}
        
/* image div */
        
@media (max-width: 499px) {
  user-subscriptions-view > section.brs-page-title > div.brs-page-title__icon {
          margin-right: 0px;
          margin-bottom: 16px;
        }
}
        
/* title + subtitle div */
        
@media (max-width: 499px) {
  user-subscriptions-view > section.brs-page-title > div.brs-page-title__text {
          text-align: center;
          width: 100%;
        }
}
        
/* title */
        
user-subscriptions-view > section.brs-page-title > div.brs-page-title__text > span {
          white-space: normal;
          overflow-wrap: break-word;
          max-width: 100%;
}
        
/* sub-title */
        
user-subscriptions-view > section.brs-page-title > div.brs-page-title__text > small {
          white-space: normal;
          overflow-wrap: break-word;
          max-width: 100%;
}


/* >>> add new subscription + refresh div mobile <<< */
  
/* refresh and green button div */
  
@media (max-width: 499px) {
  user-subscriptions-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons {
      display: flex;
      flex-direction: column-reverse;
    }
}
    
/* refresh button */
    
@media (max-width: 499px) {
  user-subscriptions-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > button.mat-focus-indicator.mat-stroked-button.mat-button-base.ng-star-inserted {
        margin-right: 0px;
        margin-top: 10px;
      }
}


/* >>> add new subscription green button <<< */
  
/* button text */

user-subscriptions-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper::before {
  content: "Add New Subscription";
}
  
user-subscriptions-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper > span {
  display: none;
}
  
/* button div desktop */

@media (min-width: 500px) {
  user-subscriptions-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons {
      min-width: max-content;
    }
}








/* >>> Add a new subscription pop-up <<< */

/* Add a new subscription title div */

app-user-dialog-subscription-create > div > section.brs-modal-extension__content > div {
padding-top: 30px;
padding-bottom: 20px;
}

/* details title div */

app-user-dialog-subscription-create > div > section.brs-modal-extension__details > div.brs-modal__headline {
padding-top: 30px;
padding-bottom: 20px;
}

@media (max-width: 959px) {
app-user-dialog-subscription-create > div > section.brs-modal-extension__details > div.brs-modal__headline {
padding-top: 0px;
padding-bottom: 20px;
}
}

/* terms of service div */

app-user-dialog-subscription-create > div > section.brs-modal-extension__content > form > div.brs-modal__content.ng-star-inserted {
margin-top: 13px;
}

/* cancel and create buttons div */

app-user-dialog-subscription-create > div > section.brs-modal-extension__content > form > div.brs-modal__actions {
padding-top: 30px;
padding-bottom: 35px;
}

/* create button text - inactive */

app-user-dialog-subscription-create > div > section.brs-modal-extension__content > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-stroked-button > span.mat-button-wrapper::before {
content: "Add New";
}

app-user-dialog-subscription-create > div > section.brs-modal-extension__content > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-stroked-button > span.mat-button-wrapper > span {
display: none;
}

/* create button text - active*/

app-user-dialog-subscription-create > div > section.brs-modal-extension__content > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-flat-button > span.mat-button-wrapper::before {
content: "Add New";
}

app-user-dialog-subscription-create > div > section.brs-modal-extension__content > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-flat-button > span.mat-button-wrapper > span {
display: none;
}





/* >>> My account page <<< */
/* https://social.bcm-markets.com/portal/accounts */


/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
  user-accounts-view > section.brs-page-title {
          display: flex;
          flex-direction: column;
          justify-content: center;
        }
}
        
/* image div */
        
@media (max-width: 499px) {
  user-accounts-view > section.brs-page-title > div.brs-page-title__icon {
          margin-right: 0px;
          margin-bottom: 16px;
        }
}
        
/* title + subtitle div */
        
@media (max-width: 499px) {
  user-accounts-view > section.brs-page-title > div.brs-page-title__text {
          text-align: center;
          width: 100%;
        }
}
        
/* title */
        
user-accounts-view > section.brs-page-title > div.brs-page-title__text > span {
          white-space: normal;
          overflow-wrap: break-word;
          max-width: 100%;
}
        
/* sub-title */
        
user-accounts-view > section.brs-page-title > div.brs-page-title__text > small {
          white-space: normal;
          overflow-wrap: break-word;
          max-width: 100%;
}


/* >>> add new provider account + refresh div mobile <<< */
  
/* refresh and green button div */
  
@media (max-width: 499px) {
  user-accounts-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons {
      display: flex;
      flex-direction: column-reverse;
    }
}
    
/* refresh button */
    
@media (max-width: 499px) {
  user-accounts-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > button.mat-focus-indicator.mat-stroked-button.mat-button-base.ng-star-inserted {
        margin-right: 0px;
        margin-top: 10px;
      }
}



/* >>> add new trading account green button <<< */
  
/* button text */

user-accounts-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper::before {
content: "Add New Trading Account";
}

user-accounts-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper > span {
display: none;
}

/* button div desktop */
@media (min-width: 500px) {
  user-accounts-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons {
    min-width: max-content;
  }
}



/* >>> Add a new trading account pop-up <<< */

/* title div */

lib-dialog-account-create > section > div {
padding-top: 30px;
padding-bottom: 20px;
}

/* cancel and create buttons div */

lib-dialog-account-create > section > form > div.brs-modal__actions {
padding-top: 19px;
padding-bottom: 35px;
}

/* create button text - inactive */

lib-dialog-account-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-stroked-button > span.mat-button-wrapper::before {
content: "Add New";
}

lib-dialog-account-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-stroked-button > span.mat-button-wrapper > span {
display: none;
}

/* create button text - active */

lib-dialog-account-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-flat-button > span.mat-button-wrapper::before {
content: "Add New";
}

lib-dialog-account-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-flat-button > span.mat-button-wrapper > span {
display: none;
}


/* >>> trading account info pop-up <<< */

/* action buttons */

@media (max-width: 399px) {
  lib-dialog-client-account-info > section > div.brs-modal__actions {
    display: flex!important;
    flex-direction: column!important;
    justify-content: center!important;
  }
}
  
/* button size */
  
@media (max-width: 399px) {
  lib-dialog-client-account-info > section > div.brs-modal__actions > button {
    min-width: 0px!important;
    max-width: 128px!important;
    width: 100%!important;
    height: 39px!important;
  }
}
  
/* cancel button */
  
@media (max-width: 399px) {
  lib-dialog-client-account-info > section > div.brs-modal__actions > button.mat-focus-indicator.mat-stroked-button.mat-button-base {
    margin-top: 25px!important;
  }
}




/* >>> my providers page <<< */
/* https://social.bcm-markets.com/portal/providers */



/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
user-providers-view > section.brs-page-title {
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
}
      
/* image div */
      
@media (max-width: 499px) {
user-providers-view > section.brs-page-title > div.brs-page-title__icon {
        margin-right: 0px;
        margin-bottom: 16px;
      }
}
      
/* title + subtitle div */
      
@media (max-width: 499px) {
user-providers-view > section.brs-page-title > div.brs-page-title__text {
        text-align: center;
        width: 100%;
      }
}
      
/* title */
      
user-providers-view > section.brs-page-title > div.brs-page-title__text > span {
        white-space: normal;
        overflow-wrap: break-word;
        max-width: 100%;
}
      
/* sub-title */
      
user-providers-view > section.brs-page-title > div.brs-page-title__text > small {
        white-space: normal;
        overflow-wrap: break-word;
        max-width: 100%;
}

/* >>> tutles to underline <<< */

.brs-measures__headline {
  text-decoration: underline;
  text-underline-position: under;
}


/* >>> add new provider account green button <<< */

/* button text */

user-providers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper::before {
content: "Add New Provider Account";
}

user-providers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper > span {
display: none;
}

/* button div desktop */
@media (min-width: 500px) {
user-providers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons {
  min-width: max-content;
}
}


/* >>> add new provider account + refresh div mobile <<< */

/* refresh and green button div */

@media (max-width: 499px) {
  user-providers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons {
    display: flex;
    flex-direction: column-reverse;
  }
}
  
/* refresh button */
  
@media (max-width: 499px) {
  user-providers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > button.mat-focus-indicator.mat-stroked-button.mat-button-base.ng-star-inserted {
      margin-right: 0px;
      margin-top: 10px;
    }
}




/* >>> Add a new provider account pop-up <<< */

/* title div */

user-dialog-provider-create > section > div {
padding-top: 30px;
padding-bottom: 20px;
}

/* terms of service div */

form > div.brs-modal__content.ng-star-inserted {
margin-top: 13px;
margin-bottom: 10px;
}

/* cancel and create buttons div */

user-dialog-provider-create > section > form > div.brs-modal__actions {
padding-top: 30px;
padding-bottom: 35px;
}

/* create button text - inactive */

user-dialog-provider-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-stroked-button > span.mat-button-wrapper::before {
content: "Convert Now";
}

user-dialog-provider-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-stroked-button > span.mat-button-wrapper > span {
display: none;
}

/* create button text - active*/

user-dialog-provider-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-flat-button > span.mat-button-wrapper::before {
content: "Convert Now";
}

user-dialog-provider-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-flat-button > span.mat-button-wrapper > span {
display: none;
}





/* >>> transactions history page <<< */
/* ????? */



/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
  user-transactions-view > section.brs-page-title {
          display: flex;
          flex-direction: column;
          justify-content: center;
        }
}
        
/* image div */
        
@media (max-width: 499px) {
  user-transactions-view > section.brs-page-title > div.brs-page-title__icon {
          margin-right: 0px;
          margin-bottom: 16px;
        }
}
        
/* title + subtitle div */
        
@media (max-width: 499px) {
  user-transactions-view > section.brs-page-title > div.brs-page-title__text {
          text-align: center;
          width: 100%;
        }
}
        
/* title */
        
user-transactions-view > section.brs-page-title > div.brs-page-title__text > span {
          white-space: normal;
          overflow-wrap: break-word;
          max-width: 100%;
}
        
/* sub-title */
        
user-transactions-view > section.brs-page-title > div.brs-page-title__text > small {
          white-space: normal;
          overflow-wrap: break-word;
          max-width: 100%;
}








/* >>> new subscription page <<< */
/* https://social.bcm-markets.com/portal/subscriptions */



/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
  user-subscription-profile > section.brs-page-title {
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
}
    
/* image div */
    
@media (max-width: 499px) {
  user-subscription-profile > section.brs-page-title > div.brs-page-title__icon {
      margin-right: 0px;
      margin-bottom: 16px;
    }
}
    
/* title + subtitle div */
    
@media (max-width: 499px) {
  user-subscription-profile > section.brs-page-title > div.brs-page-title__text {
      text-align: center;
      width: 100%;
    }
}
    
/* title */
    
user-subscription-profile > section.brs-page-title > div.brs-page-title__text > span {
      white-space: normal;
      overflow-wrap: break-word;
      max-width: 100%;
}
    
/* sub-title */
    
user-subscription-profile > section.brs-page-title > div.brs-page-title__text > small {
      white-space: normal;
      overflow-wrap: break-word;
      max-width: 100%;
}
  

/* >>> chart elements <<< */
  
/* no trading history message */

user-subscription-profile > lib-subscription-profile-dashboard > section > div.brs-metrics__block.brs-metrics__block--with-chart > lib-micro-chart > div > div > span.mat-subheading-2.ng-star-inserted {
  padding: 0px!important;
  white-space: normal!important;
  overflow-wrap: break-word!important;
  text-align: center!important;
}


/* >>> titles and edit buttons <<< */
  
/* titles and edit buttons div */
  
@media (max-width: 499px) {
  user-subscription-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock {
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center;
    }
}

@media (max-width: 499px) {
  user-subscription-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > lib-subscription-risks-view > div.brs-headblock {
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center;
    }
}

    
/* title div */
    
@media (max-width: 499px) {
user-subscription-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock > div.brs-headblock__info {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        border-right: 2px solid rgb(var(--palette-primary-500)) !important;
        padding-right: 5px!important;
        border-left: 2px solid rgb(var(--palette-primary-500)) !important;
        padding-left: 5px!important;
      }
}
  
@media (max-width: 499px) {
user-subscription-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > lib-subscription-risks-view > div.brs-headblock > div.brs-headblock__info {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        border-right: 2px solid rgb(var(--palette-primary-500)) !important;
        padding-right: 5px!important;
        border-left: 2px solid rgb(var(--palette-primary-500)) !important;
        padding-left: 5px!important;
      }
}


/* edit buttons div */
    
@media (max-width: 499px) {
  user-subscription-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock > div.brs-headblock__buttons {
        display: flex;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
        margin-top: 28px;
        margin-bottom: 9px;
    }
}

@media (max-width: 499px) {
user-subscription-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > lib-subscription-risks-view > div.brs-headblock > div.brs-headblock__buttons {
        display: flex;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
        margin-top: 28px;
        margin-bottom: 9px;
    }
}


/* >>> correction pup up <<< */
  
/* cancel button */

@media (min-width: 400px) {
ng-component > brs-form-modal > section > form > div.brs-modal__actions > button:nth-child(1) {
  margin-right: 10px;
}
}

/* save changes button */

@media (min-width: 400px) {
  ng-component > brs-form-modal > section > form > div.brs-modal__actions > button:nth-child(2) {
    margin-left: 10px;
  }
}



/* >>> Page elements <<< */

/* active subscription text div */

body > app-root > user-portal-layout > brs-app-wrapper > div > main > user-subscription-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__additional > div.brs-list.ng-star-inserted > div.brs-list__entry.brs-list__entry--message.ng-star-inserted {
border-left: 3px solid var(--st-positive-color) !important;
border-right: 3px solid var(--st-positive-color) !important;
}

/* suspended subscription text div */

body > app-root > user-portal-layout > brs-app-wrapper > div > main > user-subscription-profile > section.st-notification-panel.ng-star-inserted > div.st-notification.st-notification--accent {
border-left: 3px solid rgb(var(--palette-warn-500)) !important;
border-right: 3px solid rgb(var(--palette-warn-500)) !important;
padding-top: 10px;
padding-bottom: 10px;
}




/* >>> Attention pop-up <<< */

/* title div */

lib-dialog-subscription-attention-message > section > div.brs-modal__headline {
padding-top: 30px;
padding-bottom: 19px;
}

/* description text div */

lib-dialog-subscription-attention-message > section > div.brs-modal__content > div > div {
border-left: 3px solid rgb(var(--palette-warn-500)) !important;
border-right: 3px solid rgb(var(--palette-warn-500)) !important;
}

/* cancel and create buttons div */

lib-dialog-subscription-attention-message > section > div.brs-modal__actions {
padding-top: 17px;
padding-bottom: 35px;
}

/* OK button text */

lib-dialog-subscription-attention-message > section > div.brs-modal__actions > button > span.mat-button-wrapper::before {
content: "Continue To Copy & Risk Management Settings";
}

lib-dialog-subscription-attention-message > section > div.brs-modal__actions > button > span.mat-button-wrapper > span {
display: none;
}



/* >>> Unsubscribe pop-up <<< */

/* title div */

ng-component > brs-modal > section > div.brs-modal__headline {
padding-top: 30px;
padding-bottom: 25px;
}

/* terms of service div */

ng-component > brs-modal > section > form > div.brs-modal__content > div {
margin-bottom: 10px;
}

/* cancel and create buttons div */

ng-component > brs-modal > section > form > div.brs-modal__actions {
padding-top: 27px;
padding-bottom: 35px;
}



/* >>> Activate pop-up <<< */

/* title div */

ng-component > section > div.brs-modal__headline {
padding-top: 30px;
padding-bottom: 19px;
}

/* description text div */

ng-component > section > div.brs-modal__content > div > div {
border-left: 3px solid var(--st-positive-color) !important;
border-right: 3px solid var(--st-positive-color) !important;
}

/* cancel and create buttons div */

ng-component > section > div.brs-modal__actions {
padding-top: 17px;
padding-bottom: 35px;
}


/* action buttons */

@media (max-width: 399px) {
  ng-component.ng-star-inserted > section.brs-modal.ng-star-inserted > div.brs-modal__actions {
    display: flex!important;
    flex-direction: column-reverse!important;
    justify-content: center!important;
  }
}

/* cancel button */
  
@media (max-width: 399px) {
  ng-component > section > div.brs-modal__actions > button.mat-focus-indicator.mat-stroked-button.mat-button-base {
    margin-top: 25px!important;
  }
}









/* >>> Provider's profile and sharing settings <<< */
/* https://social.bcm-markets.com/portal/providers/1 */



/* >>> logo and ttle div <<< */

/* logo and title div*/

@media (max-width: 499px) {
app-user-provider-profile > section.brs-page-title.ng-star-inserted {
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  margin: 0px;
  flex-direction: column!important;
}
}

/* logo div */

@media (max-width: 499px) {
app-user-provider-profile > section.brs-page-title.ng-star-inserted > div.profile__avatar {
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  margin: 0px;
}
}

/* strategy title div */

@media (max-width: 499px) {
  app-user-provider-profile > section.brs-page-title.ng-star-inserted > div.brs-page-title__text {
    display: flex !important;
    justify-content: center !important;
    align-items: center;
    margin: 0px;
  }
}

/* strategy sub-title div */

@media (max-width: 499px) {
  app-user-provider-profile > section.brs-page-title.ng-star-inserted > div.brs-page-title__text > small.mat-caption {
    text-align: center;
  }
}


/* >>> titles and edit buttons <<< */

/* titles and edit buttons div */

@media (max-width: 499px) {
app-user-provider-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}
}

/* title div */

@media (max-width: 499px) {
  app-user-provider-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock > div.brs-headblock__info {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    border-right: 2px solid rgb(var(--palette-primary-500)) !important;
    padding-right: 5px!important;
    border-left: 2px solid rgb(var(--palette-primary-500)) !important;
    padding-left: 5px!important;
  }
}

/* edit buttons div */

@media (max-width: 499px) {
  app-user-provider-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock > div.brs-headblock__buttons {
    display: flex;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 28px;
    margin-bottom: 9px;
  }
}


/* >>> actions button update avatar and archive overlay div <<< */


/* >>> update avatar pop-up <<< */

/* action buttons */

@media (max-width: 399px) {
.cdk-overlay-pane.st-avatar__container > .mat-dialog-container > ng-component.ng-star-inserted > div.brs-modal > div.brs-modal__actions {
  display: flex!important;
  flex-direction: column-reverse!important;
  justify-content: center!important;
}
}

/* button size */

@media (max-width: 399px) {
.cdk-overlay-pane.st-avatar__container > .mat-dialog-container > ng-component.ng-star-inserted > div.brs-modal > div.brs-modal__actions > button {
  min-width: 0px!important;
  max-width: 128px!important;
  width: 100%!important;
  height: 39px!important;
}
}

/* cancel button */

@media (max-width: 399px) {
.cdk-overlay-pane.st-avatar__container > .mat-dialog-container > ng-component.ng-star-inserted > div.brs-modal > div.brs-modal__actions > button.mat-focus-indicator.mat-stroked-button.mat-button-base {
  margin-top: 25px!important;
}
}

/* >>> archive pop-up <<< */

/* brs list div */

.brs-modal__content > brs-modal-top-content > .brs-list {
  min-width: 0px!important;
}

brs-modal-top-content > .brs-list {
  min-width: 0px!important;
}

.brs-modal__content > .brs-list {
  min-width: 0px!important;
}

.brs-modal__content > .brs-list.ng-star-inserted {
  min-width: 0px!important;
}

.brs-modal__content.ng-star-inserted > .brs-list {
  min-width: 0px!important;
}

/* >>> Offers <<< */

/* refresh and green button div */

@media (max-width: 499px) {
app-user-provider-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > lib-provider-offers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons {
  display: flex;
  flex-direction: column-reverse;
}
}

/* refresh button */

@media (max-width: 499px) {
  app-user-provider-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > lib-provider-offers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > button.mat-focus-indicator.mat-stroked-button.mat-button-base.ng-star-inserted {
    margin-right: 0px;
    margin-top: 10px;
  }
}

/* green button itself text */

app-user-provider-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > lib-provider-offers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper::before {
content: "Add New Offer";
}

app-user-provider-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > lib-provider-offers-view > brs-table > section.brs-actions.ng-star-inserted > div.brs-actions__buttons > brs-table-action-buttons > button > span.mat-button-wrapper > span {
display: none;
}





/* >>> Add a new offer pop-up <<< */

/* title div */

lib-dialog-offer-create > section > div.brs-modal__headline {
padding-top: 30px;
padding-bottom: 17px;
}

/* cancel and create buttons div */

lib-dialog-offer-create > section > form > div.brs-modal__actions {
padding-top: 15px;
padding-bottom: 35px;
}

/* create button text - inactive */

lib-dialog-offer-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-stroked-button > span.mat-button-wrapper::before {
content: "Add Now";
}

lib-dialog-offer-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-stroked-button > span.mat-button-wrapper > span {
display: none;
}

/* create button text - active*/

lib-dialog-offer-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-flat-button > span.mat-button-wrapper::before {
content: "Add Now";
}

lib-dialog-offer-create > section > form > div.brs-modal__actions > button.mat-focus-indicator.mat-button-base.mat-primary.mat-flat-button > span.mat-button-wrapper > span {
display: none;
}





/* >>> subscription # page <<< */
/* ?????? */

/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
app-provider-subscription-profile > section.brs-page-title {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
}

/* image div */

@media (max-width: 499px) {
app-provider-subscription-profile > section.brs-page-title > div.brs-page-title__icon {
  margin-right: 0px;
  margin-bottom: 16px;
}
}

/* title + subtitle div */

@media (max-width: 499px) {
app-provider-subscription-profile > section.brs-page-title > div.brs-page-title__text.ng-star-inserted {
  text-align: center;
  width: 100%;
}
}

/* title */

app-provider-subscription-profile > section.brs-page-title > div.brs-page-title__text.ng-star-inserted > span {
  white-space: normal;
  overflow-wrap: break-word;
  max-width: 100%;
}

/* sub-title */

app-provider-subscription-profile > section.brs-page-title > div.brs-page-title__text.ng-star-inserted > small {
  white-space: normal;
  overflow-wrap: break-word;
  max-width: 100%;
}

/* paginator container */

@media (max-width: 499px) {
.mat-paginator-container {
  display: flex!important;
  justify-content: center!important;
}
}





/* >>> offer # page <<< */
/* ?????? */




/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
main > ng-component > section.brs-page-title {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}
  
/* image div */
  
@media (max-width: 499px) {
main > ng-component > section.brs-page-title > div.brs-page-title__icon {
    margin-right: 0px;
    margin-bottom: 16px;
  }
}
  
/* title + subtitle div */
  
@media (max-width: 499px) {
main > ng-component > section.brs-page-title > div.brs-page-title__text.ng-star-inserted {
    text-align: center;
    width: 100%;
  }
}
  
/* title */
  
main > ng-component > section.brs-page-title > div.brs-page-title__text.ng-star-inserted > span {
    white-space: normal;
    overflow-wrap: break-word;
    max-width: 100%;
}
  
/* sub-title */
  
main > ng-component > section.brs-page-title > div.brs-page-title__text.ng-star-inserted > small {
    white-space: normal;
    overflow-wrap: break-word;
    max-width: 100%;
}




/* >>> titles and edit buttons <<< */

/* titles and edit buttons div */

@media (max-width: 499px) {
main > ng-component > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }
}

@media (max-width: 499px) {
brs-table > section.brs-actions.ng-star-inserted {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}
}

  
/* title div */
  
@media (max-width: 499px) {
main > ng-component > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock > div.brs-headblock__info {
      width: 100%;
      margin-left: auto;
      margin-right: auto;
      border-right: 2px solid rgb(var(--palette-primary-500)) !important;
      padding-right: 5px!important;
      border-left: 2px solid rgb(var(--palette-primary-500)) !important;
      padding-left: 5px!important;
    }
}

@media (max-width: 499px) {
brs-table > section.brs-actions.ng-star-inserted > .brs-actions__title.ng-star-inserted {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        border-right: 2px solid rgb(var(--palette-primary-500)) !important;
        padding-right: 5px!important;
        border-left: 2px solid rgb(var(--palette-primary-500)) !important;
        padding-left: 5px!important;
      }
}

/* edit buttons div */
  
@media (max-width: 499px) {
main > ng-component > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock > div.brs-headblock__buttons {
      display: flex;
      justify-content: center;
      margin-left: auto;
      margin-right: auto;
      margin-top: 28px;
      margin-bottom: 9px;
  }
}



/* >>> position # page <<< */
/* ?????? */



/* >>> image + title + sub-title <<< */

/* image + title + sub-title div */

@media (max-width: 499px) {
lib-provider-position-profile > section.brs-page-title {
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
}
    
/* image div */
    
@media (max-width: 499px) {
lib-provider-position-profile > section.brs-page-title > div.brs-page-title__icon {
      margin-right: 0px;
      margin-bottom: 16px;
    }
}
    
/* title + subtitle div */
    
@media (max-width: 499px) {
lib-provider-position-profile > section.brs-page-title > div.brs-page-title__text.ng-star-inserted {
      text-align: center;
      width: 100%;
    }
}
    
/* title */
    
lib-provider-position-profile > section.brs-page-title > div.brs-page-title__text.ng-star-inserted > span {
      white-space: normal;
      overflow-wrap: break-word;
      max-width: 100%;
}
    
/* sub-title */
    
lib-provider-position-profile > section.brs-page-title > div.brs-page-title__text.ng-star-inserted > small {
      white-space: normal;
      overflow-wrap: break-word;
      max-width: 100%;
}


/* >>> titles and edit buttons <<< */

/* titles and edit buttons div */

@media (max-width: 499px) {
lib-provider-position-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock {
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center;
    }
}
  
/* title div */
    
@media (max-width: 499px) {
lib-provider-position-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock > div.brs-headblock__info {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        border-right: 2px solid rgb(var(--palette-primary-500)) !important;
        padding-right: 5px!important;
        border-left: 2px solid rgb(var(--palette-primary-500)) !important;
        padding-left: 5px!important;
      }
}

/* edit buttons div */
    
@media (max-width: 499px) {
lib-provider-position-profile > section.brs-container.brs-container--profile.ng-star-inserted > div.brs-container__content > div.brs-headblock > div.brs-headblock__buttons {
        display: flex;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
        margin-top: 28px;
        margin-bottom: 9px;
    }
}






/* >>> offers page settings <<< */
/* https://social.bcm-markets.com/portal/offers/2 */

/* >>> Delete Join Link pop-up <<< */

/* content div */

ng-component > section > div.brs-modal__content > div > div {
	border-left: 0px solid var(--st-positive-color) !important;
    border-right: 0px solid var(--st-positive-color) !important;
}





/* >>> offers registration page for agents links <<< */
/* https://social.bcm-markets.com/portal/registration/subscription/82955/agent1 */



/* >>> Common elements <<< */

/* form div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div.brs-modal.brs-modal--extended.brs-modal--page-inline.st-login-modal {
background-color: #ffffff!important;
border-width: 0px!important;
box-shadow: 0px 0px 10px 0px #E3E4E8;
}



/* >>> add a new subscription <<< */

/* section div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content {
padding-right: 25px!important;
padding-left: 25px!important;
}

/* logo + title + subtitle div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > div.brs-modal__headline {
margin: 0px!important;
padding-bottom: 18px!important;
}

/* BCM logo */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > div.brs-modal__headline > div {
margin-top: 10px;
margin-bottom: 28px!important;
}

/* page containing the login form */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div {
margin-top: 50px!important;
margin-bottom: 29px!important;
}

/* "social trading portal" title */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > div.brs-modal__headline > span {
margin-bottom: 15px!important;
}

/* logo + password div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > form > div:nth-child(1) {
padding-right: 0px!important;
padding-left: 0px!important;
}

/* terms of service div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > form > div.brs-modal__content.ng-star-inserted {
margin-top: 13px;
padding-right: 0px!important;
padding-left: 0px!important;
}

/* register button's box */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > form > div.brs-modal__actions {
padding-top: 30px;
padding-bottom: 35px;
padding-right: 0px!important;
padding-left: 0px!important;
}

/* register button text - active*/

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > form > div.brs-modal__actions > button > span.mat-button-wrapper::before {
content: "Add Now";
}

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > form > div.brs-modal__actions > button > span.mat-button-wrapper > span {
display: none;
}

/* below login button div */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > div.brs-modal__links.ng-star-inserted {
flex-direction: column;
}



/* >>> As a logged in client <<< */

/* log out link below login button */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > div.brs-modal__links.ng-star-inserted > small > a.brs-link {
border-bottom: 0px dashed var(--brs-gray-color-darker) !important;
color: var(--st-light-primary-color)!important;
margin-top: 25px;
}

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > div.brs-modal__links.ng-star-inserted > small > a.brs-link:hover {
border-bottom: 0px dashed rgb(var(--palette-primary-500))!important;
color: #14E148!important;
}



/* >>> NOT as a logged in client <<< */

/* Log in as a client link */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > div.brs-modal__links.ng-star-inserted > a.brs-link {
border-bottom: 0px dashed var(--brs-gray-color-darker) !important;
color: var(--st-light-primary-color)!important;
}

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > div > section.brs-modal-extension__content > div.brs-modal__links.ng-star-inserted > a.brs-link:hover {
border-bottom: 0px dashed rgb(var(--palette-primary-500))!important;
color: #14E148!important;
}

/* click here and register link - itself */

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > account-registration-link > div > div > a.brs-link {
border-bottom: 0px dashed var(--brs-gray-color-darker) !important;
color: var(--st-light-primary-color)!important;
margin-right: -3px;
}

body > app-root > ng-component > brs-app-wrapper > div > main > user-dialog-subscription-join > account-registration-link > div > div > a.brs-link:hover {
border-bottom: 0px dashed rgb(var(--palette-primary-500))!important;
color: #14E148!important;
}



/* >>> Details section <<< */

/* section div */

.brs-modal-extension__details {
padding-right: 25px!important;
padding-left: 25px!important;
padding-bottom: 35px!important;
}

/* title and sub-title div */

.brs-modal-extension__details > div.brs-modal__headline {
padding-top: 30px;
padding-right: 0px!important;
padding-left: 0px!important;
margin-right: 0px!important;
margin-left: 0px!important;
}

/* list div */

.brs-modal-extension__details > div.brs-list {
min-width: 0px!important;
padding-bottom: 0px!important;
}





/* >>> ratings page <<< */
/* ?????????? */



/* >>> page elements <<< */

/* ratings title + find widget div */

@media (max-width: 449px) {
embedded-ratings-view > lib-widget-ratings-view > section.ta-widget__header.ta-widget__header--with-icon.ng-star-inserted {
flex-direction: column!important;
}
}

/* ratings title div */

@media (max-width: 449px) {
embedded-ratings-view > lib-widget-ratings-view > section.ta-widget__header.ta-widget__header--with-icon.ng-star-inserted > .ta-widget__text {
text-align: center;
}
}

/* find widget div */

embedded-ratings-view > lib-widget-ratings-view > section.ta-widget__header.ta-widget__header--with-icon.ng-star-inserted > .ta-widget__search {
min-width: 0px!important;
width: 100%;
max-width: 200px;
}

/* paginator label */

.mat-paginator-range-actions .mat-paginator-range-label {
margin: 0px!important;
}




/* >>> provider view profile page in ratings <<< */
/* ?????????? */




/* >>> avatar + strategy title + strategy description + subscribe now button section <<< */

/* avatar + strategy title + strategy description + subscribe now button div */

embedded-rating-profile > lib-widget-rating-profile > section.brs-page-title.ta-profile-details.ng-star-inserted {
  padding-bottom: 0px!important;
  padding-top: 30px!important;
}
  
@media (max-width: 449px) {
  embedded-rating-profile > lib-widget-rating-profile > section.brs-page-title.ta-profile-details.ng-star-inserted {
  display: flex !important;
  justify-content: center !important;
  flex-direction: column !important;
  text-align: center !important;
  }
}

@media (min-width: 960px) {
  embedded-rating-profile > lib-widget-rating-profile > section.brs-page-title.ta-profile-details.ng-star-inserted {
    padding-bottom: 32px!important;
  }
}
  
/* avatar + strategy title div */
  
@media (max-width: 449px) {
  embedded-rating-profile > lib-widget-rating-profile > section.brs-page-title.ta-profile-details.ng-star-inserted > div.ta-profile-details__info {
  display: flex !important;
  justify-content: center !important;
  flex-direction: column !important;
  text-align: center !important;
  }
}
  
/* avatar image div */
  
.ta-profile-details__identification {
  flex-direction: column !important;
}
  
@media (max-width: 449px) {
  embedded-rating-profile > lib-widget-rating-profile > section.brs-page-title.ta-profile-details.ng-star-inserted > div.ta-profile-details__info > div.ta-profile-details__identification {
  display: flex !important;
  justify-content: center !important;
  flex-direction: column !important;
  text-align: center !important;
  padding-right: 0px!important;
  }
}
  
/* avatar image itself */
  
@media (max-width: 449px) {
  embedded-rating-profile > lib-widget-rating-profile > section.brs-page-title.ta-profile-details.ng-star-inserted > div.ta-profile-details__info > div.ta-profile-details__identification > div.ta-profile__avatar {
  display: flex !important;
  justify-content: center !important;
  flex-direction: column !important;
  text-align: center !important;
  margin-right: auto!important;
  margin-left: auto!important;
  }
}
  
/* sub-title div */
  
@media (max-width: 449px) {
  embedded-rating-profile > lib-widget-rating-profile > section.brs-page-title.ta-profile-details.ng-star-inserted > div.ta-profile-details__info > div.ta-profile-details__summary {
  display: flex !important;
  justify-content: center !important;
  flex-direction: column !important;
  text-align: center !important;
  padding-right: 0px!important;
  }
}
  
/* subscribe now button div */
  
.ta-profile-details .ta-widget__buttons {
  min-width: fit-content!important;
  margin-top: 29px;
}
  
@media (max-width: 449px) {
  .brs-page-title.ta-profile-details.ng-star-inserted > .ta-widget__buttons.ng-star-inserted {
  position: static!important;
  display: flex!important;
  justify-content: center!important;
  margin-top: 0px!important;
  margin-bottom: 38px!important;
  }
}
  
@media (max-width: 959px) {
  .ta-profile-details .ta-widget__buttons {
  position: absolute;
  top: 0;
  inset-inline-end: 0;
  margin: 53px 0!important;
  display: flex!important;
  justify-content: flex-end!important;
  }
}
  
/* >>> page elements <<< */
  
/* returns overview div */
  
.brs-container.brs-container--profile.ng-star-inserted > .brs-container__content.ng-star-inserted > .ta-profile-card__info.ta-overview {
  display: flex!important;
  flex-direction: row!important;
  justify-content: center;
}
  
@media (max-width: 399px) {
  .brs-container.brs-container--profile.ng-star-inserted > .brs-container__content.ng-star-inserted > .ta-profile-card__info.ta-overview {
  flex-direction: column!important;
  padding-top: 13px;
  padding-bottom: 18px;
  }
}
  
@media (max-width: 399px) {
  .brs-container.brs-container--profile.ng-star-inserted > .brs-container__content.ng-star-inserted > .ta-profile-card__info.ta-overview > .ta-overview__item.ng-star-inserted::after {
  display: none;
  }
}
  
/* months filters */
  
history-chart.ng-star-inserted .ta-chart-menu {
  justify-content: center;
}
  
/* list headline */
  
.brs-list__headline {
  text-decoration: underline;
  text-underline-position: under;
}
    
/* monthly returns */
  
@media (max-width: 959px) {
  lib-profile-income-tab > section.ta-indicators.ta-indicators--responsive.ng-star-inserted > div.ta-indicators__block > span.ta-indicators__label.mat-caption {
  text-align: left!important;
  }
}