/*
Template Name: Color Admin - Responsive Admin Dashboard Template build with Twitter Bootstrap 3 & 4
Version: 4.0.0
Author: Sean Ngu
Website: http://www.seantheme.com/color-admin-v4.0/admin/
*/
 
.header .navbar-logo,
.login .login-header .brand .logo,
.header .navbar-nav > li > a .label,
.label.label-theme,
.btn.btn-scroll-to-top {
    background: #348fe2;
}
.header.navbar-inverse .navbar-brand {
    color: #fff !important;
}
.text-theme,
.sidebar .nav > li.active > a i {
    color: #348fe2;
}
.sidebar .sub-menu > li.active:after {
	border-color: #348fe2;
}


/* Added in v1.5 */

.gradient-enabled .sidebar .nav > li.active > a, 
.gradient-enabled .sidebar .nav > li.active > a:focus, 
.gradient-enabled .sidebar .nav > li.active > a:hover,
.gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active:focus > a, 
.gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active:hover > a, 
.gradient-enabled.page-sidebar-minified .sidebar .nav > li.has-sub.active > a,
.gradient-enabled .label.label-theme,
.gradient-enabled .btn.btn-scroll-to-top,
.gradient-enabled .top-menu .nav > li.active > a, 
.gradient-enabled .top-menu .nav > li.active > a:focus, 
.gradient-enabled .top-menu .nav > li.active > a:hover {
    background: rgb(103,176,240); /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY3YjBmMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzNDhmZTIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  rgba(103,176,240,1) 0%, rgba(52,143,226,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(103,176,240,1)), color-stop(100%,rgba(52,143,226,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(103,176,240,1) 0%,rgba(52,143,226,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(103,176,240,1) 0%,rgba(52,143,226,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(103,176,240,1) 0%,rgba(52,143,226,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(103,176,240,1) 0%,rgba(52,143,226,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#67b0f0', endColorstr='#348fe2',GradientType=0 ); /* IE6-8 */
}
.gradient-enabled .sidebar .nav > li.active > a {
	z-index: 10;
}
.gradient-enabled .sidebar .nav > li.active > a i,
.gradient-enabled .sidebar .nav > li.active > a .caret {
	color: rgba(0,0,0,0.5);
}
.pace-progress {
    background: #348fe2;
}
.pace .pace-activity {
    border-top-color: #348fe2;
    border-left-color: #348fe2;
}


/* Added in v1.7 */

.page-with-light-sidebar .sidebar .nav > li.active > a > i {
    color: #348fe2;
}
.page-with-light-sidebar .sidebar .nav > li.active > a .badge,
.page-with-light-sidebar .sidebar .nav > li.active > a .label.label-theme {
    background: #348fe2;
}


/* Added in v1.9 */

.top-menu .nav > li.active > a i, 
.top-menu .nav > li.active > a:focus i, 
.top-menu .nav > li.active > a:hover i {
    color: #348fe2;
}


/* Added by Dhika */
.logo-brand{
    height: 50px;
    padding-right: 10px;
    display: inline!important;
}
.brand .logo-brand{
    height: 60px;
    padding-right: 10px;
}
.cardx {
    background: linear-gradient(45deg, #00205b 0%, #8bb1de 100%);
    padding-top: 20px;
    box-shadow: 0px 2px 20px 2px #000000;
}

.cardx  ::placeholder{
                color: white !important;
}

.footer-login{       
    position: fixed;
    bottom: 0;
    height: 50px;
    background-color: #00000042;
    width: 100%;
    margin-left: 400px;
}
.floatimg-login{
    position: fixed;
    right: 0;
}
.footer-login span{
    line-height: 50px;
    margin-right: 420px;
}
.home-menu{
    padding: 20px 50px;
    margin: 15px;
    border-radius: 4px;
    text-align: center;
    background: #00205b9c;
    border: 1px solid white;
}
.home-menu:hover{
    background: white !important;
    transform: scale(1.2);
    color: black !important;
}
.home-menu:hover .descx{
    color: black !important;
}
.descx{
    position: absolute;
    bottom: 10px;
    font-weight: bold;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;}

.caret-right {
    border-bottom: 4px solid transparent;
    border-top: 4px solid transparent;
    border-left: 4px solid;
    display: inline-block;
    height: 0;
    vertical-align: top;
    width: 0;
}
.btn-chat{
    right: 60px !important;
    bottom: 17px !important;
    color: white !important;
}

.modal .modal-full-height {
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    width: 400px;
    height: auto;
    min-height: 100%;
    top: 0;
    right: 0;
}
#top-menu .navbar-nav>li>a{
    padding: 15px 10px !important;
}
.dropdown-submenu{
    position: relative;
}
.dropdown-submenu a::after{
    transform: rotate(-90deg);
    position: absolute;
    right: 3px;
    top: 40%;
}
.dropdown-submenu:hover .dropdown-menu, .dropdown-submenu:focus .dropdown-menu{
    display: flex;
    flex-direction: column;
    position: absolute !important;
    margin-top: -30px;
    left: 100%;
}
@media (max-width: 992px) {
    .dropdown-menu{
        width: 50%;
    }
    .dropdown-menu .dropdown-submenu{
        width: auto;
    }
}
.company-photo{
    float: none !important;
    margin: 0 auto;
    width: 140px !important;
    height: 100px !important;
}

.work {
    position: relative;
    overflow: hidden;
    margin-bottom: 10px;
}

.work .image img {
    max-width: 100%;
}
.centerflex{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

.modal-dialog.cascading-modal.modal-avatar {
    margin-top: 10rem;
}
.modal-dialog.cascading-modal.modal-avatar .modal-header {
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: -4rem 0 -1rem;
}
.modal-dialog.cascading-modal.modal-avatar .modal-header img {
    width: 100px;
    margin-left: auto;
    margin-right: auto;
    -webkit-filter: drop-shadow(1px 3px 5px rgba(0,0,0,0.9));
    filter: drop-shadow(1px 3px 5px rgba(0,0,0,0.9));
}
.modal-dialog.cascading-modal .modal-body {
    padding: 2rem;
}
.modal-full-height{
    max-width: 100%!important;
}
