/*GENERAL
orange: #ed7623
mild: #ff7f26
hot: #ff6900
mild:#ffa96d
*/

body {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 2.0;
    color: #212529;
}
.m-header--fixed-mobile .m-topbar {
    top: -55px;
}
.btn {
    font-family: Roboto !important;
}
/*flag*/
.dropdown__inner_language {
    background-color: #f6f6f6 !important;
}
.m-nav__link-title.m-topbar__language-text.m-nav__link-text {
    padding-left: 20px !important;
}
/*photo profil*/
.m-topbar__userpic img {
    width: 41px; height: 41px;
}
.m-card-user__pic img {
    width: 70px; height: 70px;    
}
@media (max-width: 1024px) {
    .m-topbar__userpic img {
        width: 31px; height: 31px;
    }
    .m-form.m-form--fit .m-form__group {
        padding-left: 0; padding-right: 0; 
    }   
    .m-quick-sidebar.m-quick-sidebar--tabbed .m-tabs.m-tabs-line {
        margin: 0;
    }    
    .m-form .m-form__group {
        margin-bottom: 0; padding-top: 10px; padding-bottom: 0;
    }    
    .m-stack_item.m-topbar_nav-wrapper {
        background: #f1f1f1;
    }
    .m-topbar .m-topbar_nav.m-nav > .m-nav_item:hover {
        background-color: #ffffff;
    }   
}
/*alert*/
.alert {
    padding: 0.85rem;
    line-height: 1.5rem;
}



/*SIDE BAR
*************/
/*toogler - reguler*/
.m-brand .m-brand__tools .m-brand__toggler span::before, .m-brand .m-brand__tools .m-brand__toggler span::after,
.m-brand .m-brand__tools .m-brand__toggler span
{
    background: #cccccc;
} 
/*toogler - hover*/
.m-brand .m-brand__tools .m-brand__toggler:hover span,
.m-brand .m-brand__tools .m-brand__toggler:hover span::before,
.m-brand .m-brand__tools .m-brand__toggler:hover span::after {
    background: #ed7623;
}
/*toogler - active*/
.m-brand .m-brand__tools .m-brand__toggler.m-brand__toggler--active span,
.m-brand .m-brand__tools .m-brand__toggler.m-brand__toggler--active span::before, 
.m-brand .m-brand__tools .m-brand__toggler.m-brand__toggler--active span::after {
    background: #ffffff;
}
/*heading*/
.m-aside-menu .m-menu__nav > .m-menu__section .m-menu__section-text,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__section .m-menu__section-icon {
    font-size: 1.1rem; font-weight: 500; text-transform: uppercase; letter-spacing: 0.3px; color: #ffa96d !important;
}
/*active mode */
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--expanded > .m-menu__link,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link {
    background-color: #ed7623;
}
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--expanded > .m-menu__link .m-menu__link-icon ,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--expanded > .m-menu__link .m-menu__ver-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-text ,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--open > .m-menu__link .m-menu__link-icon,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--open > .m-menu__link .m-menu__link-text,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--open > .m-menu__link .m-menu__ver-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-icon 
{
    color: #ffffff;
}
/*reguler mode */
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-icon,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-text, 
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__ver-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item > .m-menu__link .m-menu__link-text,
.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-icon,
.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__hor-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item > .m-menu__link .m-menu__ver-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item.m-menu__item--open > .m-menu__link .m-menu__link-bullet.m-menu__link-bullet--line > span,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item.m-menu__item--open > .m-menu__link, .m-menu__link-text.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item.m-menu__item--open > .m-menu__link .m-menu__ver-arrow,
.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--hover > .m-menu__link > .m-menu__hor-arrow,
.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--hover > .m-menu__link .m-menu__link-icon,
.m-aside-left--minimize .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link > .m-menu__link-icon
{
    color: #cccccc;
}
/*hover mode */
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item:not(.m-menu__item--parent):not(.m-menu__item--open):not(.m-menu__item--expanded):not(.m-menu__item--active):hover > .m-menu__link .m-menu__link-icon,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item:not(.m-menu__item--parent):not(.m-menu__item--open):not(.m-menu__item--expanded):not(.m-menu__item--active):hover > .m-menu__link .m-menu__link-text,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item:not(.m-menu__item--parent):not(.m-menu__item--open):not(.m-menu__item--expanded):not(.m-menu__item--active):hover > .m-menu__link .m-menu__ver-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item:not(.m-menu__item--parent):not(.m-menu__item--open):not(.m-menu__item--expanded):not(.m-menu__item--active):hover > .m-menu__link .m-menu__link-text,
.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item:hover > .m-menu__link .m-menu__link-icon,
.m-header-menu.m-header-menu--skin-dark .m-menu__nav > .m-menu__item:hover > .m-menu__link > .m-menu__hor-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item:not(.m-menu__item--parent):not(.m-menu__item--open):not(.m-menu__item--expanded):not(.m-menu__item--active):hover > .m-menu__link .m-menu__ver-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item.m-menu__item--open > .m-menu__link .m-menu__link-bullet.m-menu__link-bullet--line > span,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item.m-menu__item--open > .m-menu__link .m-menu__link-text,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item .m-menu__submenu .m-menu__item.m-menu__item--open > .m-menu__link .m-menu__ver-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__ver-arrow,
.m-aside-left--minimize .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--hover > .m-menu__submenu .m-menu__subnav > .m-menu__item.m-menu__item--parent > .m-menu__link > .m-menu__link-text 
{
    color: #ffffff;
}

/*FORM*/
.m-form .m-form__heading .m-form__heading-title {
    color: #575962;
    border-bottom: solid 1px #eaeaea;
    padding-bottom: 15px;
    padding-top: 25px;
}
.m-form.m-form--group-seperator-dashed .m-form__group {
    border-bottom: 0;
    padding-top: 15px;
    padding-bottom: 15px;
}
/*checkbox - kompetensi*/
.m-option.m-option--plain {
    margin-bottom: 0.5rem !important;
}
.m-form .my-spacer{
    margin-bottom: 0.5rem;
}
.m-option .m-option__label .m-option__body {
    padding-top: o.7rem !important;
    font-size: 1.0rem;
    line-height: 1.5em;
}
.m-option .m-option__label .m-option__nopadtop {
    padding-top: 0rem !important;
}
.last-row-spacer {
    margin-bottom: 2.0rem !important;
}
.row-middle-spacer {
    margin-top: 2.0rem !important; margin-bottom: 2.0rem !important; 
}


/*Page heading*/
ul.m-nav li.m-nav__item {
    line-height: 1.5rem;
}


/*heading*/
h1.my-heading {font-size: 1.7rem; line-height: 2.2;}
h2.my-heading {font-size: 1.5rem; line-height: 2;}
h3.my-heading {font-size: 1.3rem; line-height: 1.3;}
.my-heading-modal {font-size: 1.2rem; line-height: 1.3;margin-bottom: 20px;}
@media (max-width: 768px) {
    h1.my-heading {font-size: 1.5rem; line-height: 1.6;}
    h2.my-heading {font-size: 1.2rem; line-height: 1.4;}
    h3.my-heading {font-size: 1.0rem; line-height: 1.2;}
    .m-subheader .m-subheader__title {
        display: inline;
        margin: 0 10px 0 0;
    }
}


/*subheading*/
.m-portlet__head-caption {
    max-width: 90%;
}
.m-nav .m-nav__item>.m-nav__link .m-nav__link-icon {
    width: 20px;
}
.m-portlet .m-portlet__head .m-portlet__head-text {
    padding-right: 10px !important;
}
.dropdown-menu > li > a, .dropdown-menu > .dropdown-item {
    color: #575962 !important;
}


/*heading divider*/
.heading-divider {
    border-top: dashed 1px #dedede; margin: 1.2rem auto 1.5rem; width: 94%;
}
.heading-divider-2 {
    border-top: dashed 1px #dedede; margin: 2.5rem auto 1.5rem; width: 100%;;
}
.heading-divider-modal {
    border-top: dashed 1px #dedede; margin: 1.0rem auto 1.5rem; width: 100%;;
}


/*portlets*/
.m-portlet .m-portlet__head {
    border-bottom: 1px solid #ebedf2;
    height: auto;
    padding: 1rem 2.2rem;
}


/*table*/
.table th {
    line-height: 1.4rem;
    vertical-align: middle !important;
}
.table td {
    line-height: 1.6rem;
    font-size: 13px;
    vertical-align: middle !important;
}
.btn.m-btn--hover-brand:not(.btn-secondary):not(.btn-outline-light) {
    background: #e4e4e4;
    color: #575962;
}
.table tr.justedited {
    background-color: #ecffc1;
    -webkit-animation: flash linear 2s ;
	animation: flash linear 2s ;
}
@-webkit-keyframes flash {
    0%   {background-color: #ecffc1;}
    25%  {background-color: white;}
    50%  {background-color: #ecffc1;}
    100% {background-color: white;}
}
@keyframes flash {
    0%   {background-color: #ecffc1;}
    25%  {background-color: white;}
    50%  {background-color: #ecffc1;}
    100% {background-color: white;}
}


/*wizard*/
.m-wizard.m-wizard--2 .m-wizard__head {
    margin: 5rem 0 0 0;
    padding:0;
}
.m-portlet .m-portlet__mywizardbody {
    padding: 1rem 2.2rem 2.2rem;
}
.m-form .m-form__mywizardsection {
    margin: 0 0 20px 0 !important;
}


/*modal */
.modal .modal-content .modal-body {
    padding: 10px 25px 30px !important;
}
.modal .modal-content .modal-body .form-group  {
    padding: 0 !important;
}


/*form*/
.m-form span.m-form__help {
    display: none !important;
}
.alert.m-alert--icon .m-alert__text {
    padding: 1.45rem 1rem;
    line-height: 1.4rem;
}