/* 
  
  change font 
  
*/
body {
  font-family: 'Open Sans', 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* 
  
  change font 
  
*/


/*

  FIXES TO ALLOW FONTAWESOME 5 ICONS

*/
.dropdown-menu>li>a>.fas {
  margin-right: 10px;
}

.hold-transition .menu-open .fas-angle-left {
  /* Fix for IE */
  -webkit-transition: none;
  -o-transition: none;
  transition: none;
}

.main-header .navbar .nav>li.user>a>.fas {
  margin-right: 5px;
}

/* change default burger menu icon to angle-left icon */
.main-header .sidebar-toggle:before {
  content: "\f104";
  font-weight: bolder;
}

.main-header .sidebar-toggle {
  transition: ease 300ms;
}

.sidebar-collapse .main-header .sidebar-toggle {
  transform: rotateY(180deg);
  /* spin angle bracket to face the other way when it's closed */
  border-left: solid 1px #CCC5;
}

/* leave out border on dev site as there are no borders in header and can look like a bug */
.sidebar-collapse.skin-red .main-header .sidebar-toggle {
  border: transparent;
}

/* since default theme being used is skin-black, need to disable the background changing colour on mobile */
@media (max-width: 767px) {

  .skin-black .main-header .logo,
  .skin-black .main-header .logo:hover {
    background-color: #fff;
    border-bottom: 1px solid #CCC5;
  }
}

.content-header>.breadcrumb>li>a>.fas {
  margin-right: 5px;
}

.user-panel>.info>a>.fas {
  margin-right: 3px;
}

.sidebar-menu>li>a>.fas {
  width: 20px;
}

.sidebar-menu li>a>.fas-angle-left,
.sidebar-menu li>a>.pull-right-container>.fas-angle-left {
  width: auto;
  height: auto;
  padding: 0;
  margin-right: 10px;
  -webkit-transition: transform 0.5s ease;
  -o-transition: transform 0.5s ease;
  transition: transform 0.5s ease;
}

.sidebar-menu li>a>.fas-angle-left {
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -8px;
}

.sidebar-menu .menu-open>a>.fas-angle-left,
.sidebar-menu .menu-open>a>.pull-right-container>.fas-angle-left {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.dropdown-menu>li>a>.fas {
  margin-right: 10px;
}

.navbar-nav>.notifications-menu>.dropdown-menu>li .menu>li>a>.fas {
  width: 20px;
}

.form-control-feedback.fas {
  line-height: 34px;
}

.input-lg+.form-control-feedback.fas,
.input-group-lg+.form-control-feedback.fas,
.form-group-lg .form-control+.form-control-feedback.fas {
  line-height: 46px;
}

.input-sm+.form-control-feedback.fas,
.input-group-sm+.form-control-feedback.fas,
.form-group-sm .form-control+.form-control-feedback.fas {
  line-height: 30px;
}

.box .overlay>.fas,
.overlay-wrapper .overlay>.fas {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -15px;
  margin-top: -15px;
  color: #000;
  font-size: 30px;
}

.box-header>.fas {
  display: inline-block;
  font-size: 18px;
  margin: 0;
  line-height: 1;
}

.box-header>.fas {
  margin-right: 5px;
}

.todo-list>li .tools>.fas {
  margin-right: 5px;
  cursor: pointer;
}

.timeline>li>.fas {
  width: 30px;
  height: 30px;
  font-size: 15px;
  line-height: 30px;
  position: absolute;
  color: #666;
  background: #d2d6de;
  border-radius: 50%;
  text-align: center;
  left: 18px;
  top: 0;
}

.btn-app>.fas {
  font-size: 20px;
  display: block;
}

.nav-pills>li>a>.fas {
  margin-right: 5px;
}

.nav-tabs-custom>.nav-tabs>li.header>.fas {
  margin-right: 5px;
}

.carousel-control>.fas {
  font-size: 40px;
  position: absolute;
  top: 50%;
  z-index: 5;
  display: inline-block;
  margin-top: -20px;
}

.treeview-menu>li>a>.fas {
  width: 20px;
}

.treeview-menu>li>a>.pull-right-container>.fas-angle-left,
.treeview-menu>li>a>.pull-right-container>.fas-angle-down,
.treeview-menu>li>a>.fas-angle-left,
.treeview-menu>li>a>.fas-angle-down {
  width: auto;
}

.fc-color-picker>li .fas {
  -webkit-transition: -webkit-transform linear 0.3s;
  -moz-transition: -moz-transform linear 0.3s;
  -o-transition: -o-transform linear 0.3s;
  transition: transform linear 0.3s;
}

.fc-color-picker>li .fas:hover {
  -webkit-transform: rotate(30deg);
  -ms-transform: rotate(30deg);
  -o-transform: rotate(30deg);
  transform: rotate(30deg);
}

/*

  END FIXES TO ALLOW FONTAWESOME 5 ICONS

*/

/*

  Styling changes for green skin

*/
.skin-green a:not(.btn) {
  color: #589f38;
}

.skin-green .dropdown-menu>li>a {
  color: #777;
}

.skin-green .main-header .logo {
  color: #589f38;
  background-color: #fff;
  border-bottom: 0 solid transparent;
}

.skin-green .main-header .logo:hover {
  background-color: #f0f0f0;
}

.skin-green a:not(.btn):hover,
.skin-green a:not(.btn):active,
.skin-green a:not(.btn):focus {
  outline: none;
  text-decoration: none;
  color: #81c760;
}

.skin-green .sidebar-menu>li>a {
  color: #b8c7ce;
  border-left: 3px solid transparent;
}

body.skin-green {
  background-color: #ecf5f0;
}

.skin-green .content-wrapper,
.skin-green .right-side {
  min-height: 100%;
  background-color: #ecf5f0;
  z-index: 800;
}

.skin-green .main-header .navbar {
  background-color: #6CBD45;
}

.skin-green .main-header .navbar .sidebar-toggle:hover {
  background-color: #589f38;
}

@media (max-width: 767px) {
  .skin-green .main-header .navbar .dropdown-menu li.divider {
    background-color: rgba(255, 255, 255, 0.1);
  }

  .skin-green .main-header .navbar .dropdown-menu li a {
    color: #fff;
  }

  .skin-green .main-header .navbar .dropdown-menu li a:hover {
    background: #589f38;
  }
}

.skin-green .main-header li.user-header {
  background-color: #6CBD45;
}

.skin-green .sidebar-menu>li.active>a {
  border-left-color: #6CBD45;
}

/*

  End styling changes for green skin

*/

/*

  Styling changes for blue skin (Cloudsecure)

*/
body.skin-blue {
  background-color: #ecf0f5;
}

.skin-blue .main-header .logo {
  color: #367fa9;
  background-color: #fff;
  border-bottom: 0 solid transparent;
}

.skin-blue .main-header .logo:hover {
  background-color: #f0f0f0;
}

/*

  End styling changes for blue skin

*/

/*
  Make info box numbers overflow to ellipsis
*/

.info-box .info-box-number {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}