:root{
  --dark:#1e212b;
  --light:#EAEAEA;
  --primary:#2D4263;
  --secondary:#C8102E;
  --accent:#ECDBBA;
}

body {
  font-size: 1rem;
  background:#005eb8;
  font-family: 'Rubik';
  color:var(--light);
}

.card{
  color:#000;
}

h1,h2,h3,h4,h5,h6{
  font-family: 'Montserrat';
}

label.form-label{
  font-weight: bold;
  margin-bottom:0;
}

a{
  text-decoration: none;
  color:initial;
}

#message-tray{
  position: fixed;
  width:100%;
  max-width:700px;
  bottom:0;
  left:50%;
  background:#FFF;
  box-shadow:0 0 10px var(--dark);
  text-align: center;
  transform:translate(-50%, calc(100% + 10px)); /*account for box-shadow */
  transition: 0.5s;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

#message-tray.show{
  transform: translate(-50%, 0);
}

#message-tray .alert{
  margin:0;
}
/*
 * Sidebar
 */


@media (max-width: 767.98px) {
  .sidebar {
    top: 5rem;
  }
}

.sidebar-sticky {
  position: relative;
  top: 0;
  height: calc(100vh - 48px);
  padding-top: .5rem;
  overflow-x: hidden;
  overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}

.sidebar .nav-link {
  font-weight: 500;
  color: var(--light);
  font-size:1.2rem;
  transition: 0.3s;
}

.sidebar .nav-link.active,
.sidebar .nav-link:hover {
  color: var(--secondary);
}

.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
  color: inherit;
}

.sidebar-heading{
  padding:0 1.25rem;
  font-size:1.2rem;
  height:65px;
}

.sidebar-heading,
header{
  height:65px;
}

header{
  background:var(--dark);
}

#content-container{
  flex-grow: 1;
}

#sidebarMenu{
  min-height: 100vh;
  background:var(--dark);
  color:#FFF;
  position: relative;
  flex: 0 0 350px;
}

#sidebarMenu .toggle-sidebarMenu:before{
  font-family:'Font Awesome 5 Free';
  font-weight:900;
  content:'\f060';
  display: inline-block;
  transform-origin: center;
}

#sidebarMenu .nav-link [class*="fa-"]{
  margin-right:5px;
  width:30px;
}

#sidebarMenu,
#sidebarMenu .toggle-sidebarMenu:before,
#sidebarMenu.collapsed .nav-link{
  transition: 0.3s;
}

#sidebarMenu.collapsed .toggle-sidebarMenu:before{
  transform:rotate(180deg);
}

#sidebarMenu.collapsed{
  flex:0 0 5rem;
}

#sidebarMenu.collapsed .sidebar-heading div:not(.toggle-container),
#sidebarMenu.collapsed .nav-link span{
  display: none;
}

#sidebarMenu.collapsed .nav-link{
  font-size:1.5rem;
  text-align: center;
}

#sidebarMenu .bottom-tray{
  position: absolute;
  bottom:0;
  left:0;
  width:100%;
  height:50px;
}

#sidebarMenu .bottom-tray a{
  color:#FFF;
  text-decoration: none;
  display: block;
  line-height: 1;
  padding:1rem 0.75rem;
}




main{
  padding:1.5rem 2rem;
}


th.no-sort,
td.no-sort{
  width:1%;
  white-space: nowrap;
}

.table .btn{
  white-space: nowrap;
}




.colour-preview{
  height:40px;
  width:40px;
}

.colour-preview:first-child{
  border-top-left-radius:8px;
  border-bottom-left-radius:8px;
}

.colour-preview:last-child{
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.img-preview{
  max-width:100%;
  width:250px;
}


.ui-sortable-handle{
  cursor: pointer;
}