/*-----------------------------------*/
/* VARIABLES TO UPDATE FOR EACH SITE */
/*-----------------------------------*/
:root {
  --bg-opacity: 1;
  --dashboard-overlay: 1;

  --primary-color-light: rgba(120, 115, 237, 1);
  --primary-color: rgba(76, 0, 204, var(--bg-opacity));
  --primary-color-dark: rgba(168, 101, 225, 1);
  --primary-color-opaque: rgba(76, 0, 204, 0.2);

  --secondary-color: rgba(255, 0, 57, var(--bg-opacity));
  --secondary-color-dark: rgb(204, 3, 46, var(--bg-opacity));
  --secondary-color-opaque: rgba(255, 0, 57, 0.2);
  --secondary-color-light: rgba(251, 57, 125, 1);

  --upgrade-btn: #935bff;
  --upgrade-btn-tools: #935bff;
  --upgrade-btn-hover: #7d45df;

  --upgrade-notif: #eadeff;

  --dashboard-top-header-bg: rgba(76, 0, 204, var(--dashboard-overlay));

  --divider-color-one: rgba(67, 83, 207, 0.8);
  --divider-color-two: rgba(212,79,145, 0.8);
  --divider-color-three: rgba(254,125,103, 0.8);

  --color-extra: #bc006e;
  --im-active: #bc006e;

  --welcome-color-one: #5e56e9;
  --welcome-color-two: #9547db;

  --darkColor: #363636; /*things like fonts*/

  --bg-paint-splatter: url('/wp-content/uploads/paint-splatter-1.png');
  --loadingGIF: url('/custom-code/images/loading.gif');

  --vc-primary: #7873ED;
  --vc-primary-dark: #4c48ca;
}

/*-----------------------------------*/
/* SITE SPECIFIC STYLES              */
/* NOTE: Always copy/ declare as     */
/* this styles are all required      */
/*-----------------------------------*/

/* This style is for positioning the site logo properly */
/* Apply this class to the logo link <a /> */
.ts-loggedin-logo {
  max-width: 280px;
  position: absolute;
  left: -15px;
  top: -25px;
  background-color: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ts-tools-logo {
  max-height: 75px;
  margin-top: 0;
  position: relative;
  top: -5px;
}

.ts-landing-logo {
  max-height: 100px;
  margin-bottom: -60px;
  top: -30px;
  position: relative;
}

.ts-welcome-logo {
  height: 50px !important;
}