/* 
HEADLINES - POPPINS BOLD (700)
font-family: 'Poppins', sans-serif;
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;700&display=swap" rel="stylesheet">
 */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;700&display=swap');

/* 
H1 - Barlow medium (500) 40 px
H2 - Barlow light (300) 25 px
H3/body - Barlow light (300) 20 px
font-family: 'Barlow', sans-serif;
*/
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;500&display=swap');

/* 
Main color: #011049;
Secondary color: #1A5CE0;
Accent color: #27B7FF;
*/

/* Links for chevron icon of Status Button */

@import 'https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.3.2/css/simple-line-icons.min.css';
@import 'https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css';


/********************* STYLES FROM GUIDELINES *************************/

.custom-head
{
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  color:#343a40;
}

.custom-h1
{
  font-family: 'Barlow', sans-serif;
  font-weight: 500;
  font-size: 40px;
}

.custom-h2
{
  font-family: 'Barlow', sans-serif;
  font-weight: 300;
  font-size: 25px;
}

.custom-h3b
{
  font-family: 'Barlow', sans-serif;
  font-weight: 300;
  font-size: 20px;
}

.accent-color
{
  color:#27B7FF;
}

.baccent-color
{
  background-color: #27B7FF;
}

.main-color
{
  color: #011049;
}

.bmain-color
{
  background-color: #011049;
}

.svg-primary
{
  filter: invert(32%) sepia(59%) saturate(4590%) hue-rotate(201deg) brightness(104%) contrast(105%);
}

/****************** Style for anchor elements with button style*************************/
.btn-custom
{
background-color:white; 
border:1px solid #d7dadd;
border-radius: 4px;
box-shadow: 0 .125rem .25rem rgba(black, .075);
}

/* Secondary button to use next to button with class of primary */
.btn-scustom{
  border:1px solid #0275d8;
  border-radius: 4px;
  color:#0275d8;
}

/****************** Collapse toggle*************************/


.collapse-toggle{
  background-color:#011049;
}

/***************** Style for Status button Header for Moderator and User************************/

/* 2nd Navbar Header Callcenter */

 /* Extra small devices (phones, 500px and down) */
 @media only screen and (max-width: 500px)
 {
     .sch-dp
     {
         display: flex;
         flex-direction: column;
         justify-content: end;                    
     }
 }

/* Header Mod Navbar 1 */
@media only screen and (min-width: 375px) and (max-width: 393px)
{
	.navbar-mod-1
  {
    display: flex;

  }
  
  .collaspse-mod
  {
    margin-left: auto;
    margin-bottom: 1vh;
  }
  

}