@font-face {
    font-family: 'segoe-ui-bold'; /*a name to be used later*/
    src: url('./admin/fonts/Segoe-ui-bold.ttf'); /*URL to font*/
}
@font-face {
    font-family: 'renner'; /*a name to be used later*/
    src: url('./admin/fonts/Renner.ttf'); /*URL to font*/
}
@font-face {
    font-family: 'segoe-ui'; /*a name to be used later*/
    src: url('./admin/fonts/Segoe-ui.ttf'); /*URL to font*/
}

@font-face {
    font-family: 'trueno'; /*a name to be used later*/
    src: url('./admin/fonts/TruenoRg.otf'); /*URL to font*/
}
@font-face {
    font-family: 'trueno_lt'; /*a name to be used later*/
    src: url('./admin/fonts/TruenoLt.otf'); /*URL to font*/
}
@font-face {
    font-family: 'trueno_bd'; /*a name to be used later*/
    src: url('./admin/fonts/TruenoBd.otf'); /*URL to font*/
}


#body-row {
    margin-left:0;
    margin-right:0;
}
#sidebar-container {
    min-height: 100vh;   
    background-color:  white;
    box-shadow: 4px 0px 8px 4px rgba(0, 0, 0, 0.2);
    padding: 0;
}

/* Sidebar sizes when expanded and expanded */
.sidebar-expanded {
    width: 230px;
}
.sidebar-collapsed {
    width: 60px;
}

/* Menu item*/
#sidebar-container .list-group a {
    height: 50px;
    color: 2e2c2c;
}

/* Submenu item*/
#sidebar-container .list-group .sidebar-submenu a {
    height: 45px;
    padding-left: 30px;
    background-color:  white;
    color: #0f42aa;
    
}
.sidebar-submenu {
    font-size: 0.9rem;
}

/* Separators */
.sidebar-separator-title {
    background-color:  white;
    height: 35px;
    color:#0f42aa;
}
.sidebar-separator {
    background-color:  white;
    height: 25px;
}
.logo-separator {
    background-color: white;    
    height: 60px;
    border: 0px solid black !important;
}

/* Closed submenu icon */
#sidebar-container .list-group .list-group-item[aria-expanded="false"] .submenu-icon::after {
  content: " \f0d7";
  font-family: "trueno_bd";
  display: inline;
  text-align: right;
  padding-left: 10px;
}
/* Opened submenu icon */
#sidebar-container .list-group .list-group-item[aria-expanded="true"] .submenu-icon::after {
  content: " \f0da";
  font-family: "trueno_bd";
  display: inline;
  text-align: right;
  padding-left: 10px;
}
.bgc-1{
    background: #0f42aa !important;
color: white;
}
.bgc-2{
    background: white!important;
}
.bg-primary{
    background: white !important;
    border: 0px solid black !important;
    font-family: "trueno_lt";
}
a.bg-primary:hover, a.bg-primary:focus,
button.bg-primary:hover,
button.bg-primary:focus {
    background: #5394c4 !important;
  color: white !important;
  font-family: "trueno_bd";
}
#submenu2{
    color: #0f42aa !important;
}
.menu-collapsed2{
    color: 2e2c2c;
}
.b1{
    color:2e2c2c !important;
    
}
.bb:hover span, .bb:hover .b1{
    color: white !important;
}
.bb:hover .b2{
color: #5394C4 !important;
}
.tbl-active{
    background: red !important;
}
.focus-highlight td:focus::before, .focus-highlight th:focus::before {
    background-color: white;
  }
  .active{
    color: white !important; 
    background: rgb(83,148,196);
    background: linear-gradient(90deg, rgba(83,148,196,1) 0%, rgba(15,66,170,1) 100%) !important;
    font-family: "trueno_bd";
  }
  .active span, .active .b1{
    color: white !important;
}

a.bg-primary:hover span.badge{
    background-color: white !important;
    color: #0f42aa !important;
}
a.bg-primary span.badge{
    background: #0f42aa !important;
    color: white !important;
}
a.active span.badge{
    background-color: white !important;
    color: #0f42aa !important;
}
hr{
    height: 8px;
    background: rgb(83,148,196);
    background: linear-gradient(90deg, rgba(83,148,196,1) 0%, rgba(15,66,170,1) 100%);
    
    border: 0;
    height: 1px;
}
.bienvenida{
    background: -webkit-linear-gradient(#5394c4, #0f42aa);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size:25px;
    font-family:"trueno-bd";
    text-align: center;
    
}
.nombre{
    font-size:90%;
    font-family:"trueno-bd";
    color: black;

}
.fecha{
    font-size:75%;
    font-family:"trueno";
    color: gray;

/*barra de progreso*/
}
#progresobarra {
    margin-bottom: 30px;
    overflow: hidden;
    color: #455A64;
    padding-left: 0px;
    margin-top: 30px
}

#progresobarra li {
    list-style-type: none;
    font-size: 13px;
    width: 25%;
    float: left;
    position: relative;
    font-weight: 400
}

#progresobarra .step0:before {
    font-family: "Font Awesome Kit";
    content: "\f00c";
    color: black;
}

#progresobarra li:before {
    width: 40px;
    height: 40px;
    line-height: 45px;
    display: block;
    font-size: 20px;
    background: #C5CAE9;
    border-radius: 50%;
    margin: auto;
    padding: 0px
}

#progresobarra li:after {
    content: '';
    width: 100%;
    height: 12px;
    background: #C5CAE9;
    position: absolute;
    left: 0;
    top: 16px;
    z-index: -1
}

#progresobarra li:last-child:after {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    position: absolute;
    left: -50%
}

#progresobarra li:nth-child(2):after,
#progresobarra li:nth-child(3):after {
    left: -50%
}

#progresobarra li:first-child:after {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    position: absolute;
    left: 50%
}

#progresobarra li:last-child:after {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px
}

#progresobarra li:first-child:after {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px
}

#progresobarra li.active:before,
#progresobarra li.active:after {
    background: #651FFF
}

#progresobarra li.active:before {
    font-family: "Font Awesome Kit";
    content: "\f00c";
}

.icon {
    width: 60px;
    height: 60px;
    margin-right: 15px
}

.icon-content {
    padding-bottom: 20px
}

@media screen and (max-width: 992px) {
    .icon-content {
        width: 50%
    }
}