/* Coffee Dose Branding */

/* Fonts */
@font-face {
  font-family: "Montserrat-Thin";
  src: local("Montserrat-Thin"), local("Montserrat-Thin"), local("Montserrat Thin"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/montserrat-thin/a1973639-bb37-4701-86ac-9548e8200b98.woff2") format("woff2"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/montserrat-thin/a1973639-bb37-4701-86ac-9548e8200b98.woff") format("woff"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/montserrat-thin/a1973639-bb37-4701-86ac-9548e8200b98.ttf") format("truetype"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/montserrat-thin/a1973639-bb37-4701-86ac-9548e8200b98.otf") format("opentype");
  font-weight: 100 1000;
  font-stretch: 0% 200%;
}

@font-face {
  font-family: "Fulbo-Tano";
  src: local("Fulbo-Tano"), local("Fulbo-Tano"), local("Fulbo Tano"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/fulbo-tano/e0cfb714-6187-47fb-8b7b-593b15570278.woff2") format("woff2"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/fulbo-tano/e0cfb714-6187-47fb-8b7b-593b15570278.woff") format("woff"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/fulbo-tano/e0cfb714-6187-47fb-8b7b-593b15570278.ttf") format("truetype"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/fulbo-tano/e0cfb714-6187-47fb-8b7b-593b15570278.otf") format("opentype");
  font-weight: 100 1000;
  font-stretch: 0% 200%;
}

@font-face {
  font-family: "Jost";
  src: local("Jost"), local("Jost"), local("Jost"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/jost/253478f3-53fb-4531-b3e1-5567ad742a52.woff2") format("woff2"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/jost/253478f3-53fb-4531-b3e1-5567ad742a52.woff") format("woff"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/jost/253478f3-53fb-4531-b3e1-5567ad742a52.ttf") format("truetype"), url("https://cdn.kytelearning.com/coffee-dose/branding/fonts/jost/253478f3-53fb-4531-b3e1-5567ad742a52.otf") format("opentype");
  font-weight: 100 1000;
  font-stretch: 0% 200%;
}

/* ***** */
/* CSS Variables */
:root {
  --color-font: rgba(0,0,0,1);
  --color-black: #000000;
  --color-white: #ffffff;
  --color-border: rgba(0,0,0,1);
  --color-status-info: #36a3f7;
  --header-color-text: rgba(0,0,0,1);
  --color-status-error: #f4516c;
  --color-brand-primary: rgba(0,0,0,1);
  --font-family-primary: 'Fulbo-Tano';
  --color-brand-tertiary: rgba(244,203,213,1);
  --color-status-success: #34bfa3;
  --color-status-warning: #ffb822;
  --color-brand-secondary: rgba(244,203,213,1);
  --color-page-background: #f5f5f5;
  --font-family-secondary: 'Jost';
  --header-background-color: rgba(255,255,255,1);
  --forced-brand-color: rgba(0,0,0,1);
}
/* ************* */

/* Custom CSS */
kyte-header header.logged-out {
  display: none !important;
}


kyte-login,
kyte-forgot,
kyte-join,
kyte-signup-from-token {
  background-image: url(https://cdn.kytelearning.com/coffee-dose/org-0/page-1/e0240056-2253-5e19-85ad-0333fe1f4348.jpg);




  background-size: cover;
}

#login-container {
  max-width: 480px;
  width: 100%;
  padding: 40px;
  background-color: rgba(255, 255, 255, 0.7) !important;
  border-radius: 10px;
}


[ng-reflect-name="courseType"],
kyte-content-manager-course-builder-info #course-type {
  display: none !important;
}

.hide-tenant {
  display: none !important;
}

/* Set player background/overlay color */
kyte-plyr-video-backend .kyte-overlay {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Brand (most of) the buttons */
[kyte-button]:not(.link),
kyte-button:not(.link) {
  outline: 0;
  background-color: var(--color-brand-primary);
  border: none !important;
  color: white;
  border-radius: 8px !important;
}

button.sign-in-btn {
  background-color: var(--color-brand-primary) !important;
}


header.masquerade {
  background-color: white !important;
}

@media screen and (orientation: portrait) and (max-width: 768px),
screen and (orientation: landscape) and (max-width: 1024px) {

  h1 {
    font-size: 1.5rem;
  }

  h2 {
    font-size: 1.4rem;
  }

  h3 {
    font-size: 1.3rem;
  }

  h4 {
    font-size: 1.2rem;
  }

  h5 {
    font-size: 1.1rem;
  }

  h6 {
    font-size: 1rem;
  }
}

html mat-slide-toggle .mat-slide-toggle-bar {
  width: 26px;
}

mat-slide-toggle .mat-slide-toggle-thumb-container {
  transform: translate3d(1px, 0, 0);
}

mat-slide-toggle .mat-slide-toggle-bar {
  background-color: var(--color-brand-tertiary, #000000) !important;

  opacity: 0.25;
  transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

mat-slide-toggle.mat-checked .mat-slide-toggle-bar {
  opacity: 1;
  background-color: var(--color-brand-tertiary, #000000) !important;

}

mat-slide-toggle.mat-checked .mat-slide-toggle-thumb-container {
  transform: translate3d(13px, 0, 0);
}

html mat-slide-toggle .mat-slide-toggle-thumb-container {
  width: 12px;
  height: 12px;
  top: 1px;
}

mat-slide-toggle .mat-slide-toggle-thumb-container .mat-slide-toggle-thumb {
  height: 12px;
  width: 12px;
  background-color: white !important;
}

mat-slide-toggle .mat-slide-toggle-ripple {
  display: none !important;
}

/*font overides*/
*:not(.monaco-editor):not(i):not(h1, h2, h3, h4, h5, h6):not(button.modern) {
  font-family: var(--font-family-secondary) !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-family-primary) !important;
}


/*custom button styles*/
button.modern {
  color: black !Important;
  border: 2px solid black;
  font-family: var(--font-family-primary) !important;
}