/* General */

*{
    font-family: 'Nanum Gothic', sans-serif;
    color: #4C517A;
    outline: 0;
}

.form-control:focus {
    border-color: #ccc;
    box-shadow: none !important;
}

button:focus {
    box-shadow: none !important;
}



html {
    font-family: 'Roboto Condensed', sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent
}

@-ms-viewport {
    width: device-width;
}

body {
    background-color: #F8F8FC;
}

/* Menu Sidebar Wrapper */

#wrapper {
    width: 100%;
    position: relative;
}

#sidebar-wrapper {
    background: #ffffff;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 1000;
    overflow: hidden;
    width: 240px;
    height: 100%;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65), 0 2px 6px 0 rgba(206, 206, 238, 0.54);
}

#wrapper.toggled #sidebar-wrapper {
    position: fixed;
    left: -240px;
}

#wrapper.toggled .menu-icon {
    margin-left: 0px;
}

#wrapper.toggled .content-wrapper {
    margin-left: 0;
}


/* Page Content Wrapper */

.content-wrapper {
    margin-left: 240px;
    padding-top: 70px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 70px;
    overflow-x: hidden;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}


/* Topbar Header */

.topbar-nav .navbar {
    padding: 0px 15px;
    z-index: 999;
    height: 60px;
    -webkit-box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65), 0 0px 6px 0 rgba(206, 206, 238, 0.54);
    box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65), 0 0px 6px 0 rgba(206, 206, 238, 0.54);
}

.toggle-menu i {
    margin-left: 240px;
    font-size: 25px;
    color: #223035;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.right-nav-link a.nav-link {
    padding-right: .8rem !important;
    padding-left: .8rem !important;
    font-size: 20px;
    color: #223035;
}


/* Dropdown Menu */

.dropdown-menu {
    border: 0px solid rgba(0, 0, 0, .15);
    -webkit-box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65), 0 2px 6px 0 rgba(206, 206, 238, 0.54) !important;
    box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65), 0 2px 6px 0 rgba(206, 206, 238, 0.54) !important;
    font-size: 15px
}

.dropdown-menu ul {
    margin-top: 0px;
}

.dropdown-divider {
    margin: 0;
    border-top: 1px solid rgb(236, 236, 253);
}

.dropdown-item {
    padding: .70rem 1.5rem;
}
.dropdown-item:active{
    background: #EBF5F5;;
    color: #fff;
}
.dropdown-item:active a{
    color: #fff;
}

.dropdown-toggle-nocaret:after {
    display: none
}

.dropdown-lg .dropdown-menu {
    width: 320px;
    padding: 0
}

.dropdown-lg .dropdown-menu .list-group-flush:first-child .list-group-item:first-child {
    border-top: 0;
    border-top-left-radius: .25em;
    border-top-right-radius: .25em;
}

.dropdown-lg .dropdown-menu .list-group-flush:last-child .list-group-item:last-child {
    border-bottom: 0;
    border-bottom-left-radius: .25em;
    border-bottom-right-radius: .25em;
}

.dropdown-lg .dropdown-menu .media .avatar img {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    border: 2px solid #ffffff;
    -webkit-box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2);
}

.dropdown-lg .dropdown-menu .media .media-body .msg-title {
    font-size: 14px;
    color: #000;
    font-weight: 600;
    margin-bottom: 0px;
}

.dropdown-lg .dropdown-menu .media .media-body .msg-info {
    font-size: 13px;
    color: #232323;
    margin-bottom: 0;
    white-space: nowrap;
}


/* User Details */

.user-profile img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 16px 38px -12px rgba(0, 0, 0, .56), 0 4px 25px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
}

.user-details .media .avatar img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.user-details .media .media-body .user-title {
    font-size: 14px;
    color: #000;
    font-weight: 600;
    margin-bottom: 2px;
}
.user-details:active .media .media-body .user-title {
    color: #fff;
}

.user-details .media .media-body .user-subtitle {
    font-size: 13px;
    color: #232323;
    margin-bottom: 0;
}
.user-details:active .media .media-body .user-subtitle {
    color: #fff;
}


/* Logo */

.brand-logo {
    width: 100%;
    height: 61px;
    border-bottom: 1px solid #e9eaea;
}

.logo-text {
    color: #223035;
    font-size: 18px;
    display: inline-block;
    position: relative;
    top: 3px;
    font-weight: 400;
    text-align: center;
    line-height: 50px;
}

.logo-icon {
    margin-left: 20px;
    width: 40px;
}


/* SearachBar */

.search-bar {
    margin-left: 20px;
    position: relative;
}

.search-bar input {
    border: 1px solid #dadaf1;
    font-size: 15px;
    width: 330px;
    border-radius: 30px;
    height: 30px;
    padding: .375rem 2.0rem .375rem .75rem;
    background: #f7f7ff;
}

.search-bar a i {
    position: absolute;
    top: 9px;
    right: 12px;
    color: #000;
}

.product-img {
    height: 32px;
}

.page-title {
    font-size: 20px;
    line-height: 20px;
}

.breadcrumb {
    padding: 0;
    background-color: transparent;
}

.sidebar-menu li {
    border-bottom: 1px solid #F8F8FC;
}

.sidebar-menu li a {
    font-size: 16px;
}

.sidebar-menu li a i:first-child {
    margin-right: 10px;
}

.sidebar-menu li a i:last-child {
    margin-right: 10px;
}

.sidebar-menu li span {
    width: 100%;
}


.sidebar-menu li .nav-icon-right {
    float: right;
    line-height: 25px;
}


/*Badges*/

.badge {
    display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, .075);
}

.badge-pill {
    padding-right: .6em;
    padding-left: .6em;
    border-radius: 10rem;
}

.badge-up {
    position: absolute;
    top: 2px;
    right: 2px;
    border-radius: 50%;
    font-size: 12px;
}

.badge-primary {
    color: #fff;
    background-color: #008cff;
}

.badge-secondary {
    color: #fff;
    background-color: #75808a;
}

.badge-success {
    color: #fff;
    background-color: #15ca20;
}

.badge-danger {
    color: #fff;
    background-color: #fd3550;
}

.badge-warning {
    color: #fff;
    background-color: #ff9700;
}

.badge-info {
    color: #fff;
    background-color: #0dceec;
}

.badge-light {
    color: #212529;
    background-color: #e9eaea;
}

.badge-dark {
    color: #fff;
    background-color: #223035;
}

.footer {
    bottom: 0px;
    color: #272727;
    text-align: center;
    padding: 12px 30px;
    position: absolute;
    right: 0;
    left: 240px;
    background-color: #f9f9f9;
    border-top: 1px solid rgb(223, 223, 255);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

#wrapper.toggled .footer {
    position: absolute;
    left: 0px;
}

.back-to-top {
    display: none;
    width: 40px;
    height: 40px;
    text-align: center;
    position: fixed;
    border-radius: 50%;
    bottom: 20px;
    right: 12px;
    background-color: #4C517A;
    z-index: 10000;
    box-shadow: 2px 2px 10px #DDDDEB;
    padding-top:6px;
}

.back-to-top .icon-arrow-up {
    font-size: 25px;
    color: white;
}

.back-to-top:hover {
    background-color: #001C4E;
    transition: all .5s;
}

.waves-effect {
    position: relative;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    vertical-align: middle;
    z-index: 1;
    will-change: opacity, transform;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}


/* Start Font Classes */

.font-light {
    font-weight: 300 !important;
}

.font-light-italic {
    font-weight: 300 !important;
    font-style: italic !important;
}

.font-regular {
    font-weight: 400 !important;
}

.font-regular-italic {
    font-weight: 400 !important;
    font-style: italic !important;
}

.font-bold {
    font-weight: 700 !important;
}

.font-bold-italic {
    font-weight: 700 !important;
    font-style: italic !important;
}

/* Start Moon icons sizing */

.mi-sm {
    font-size: 12px;
}

.mi-md {
    font-size: 18px;
}

.mi-lg {
    font-size: 25px;
}

.mi-xl {
    font-size: 30px;
}
.mi-nav {
    font-size: 25px;
}


/* Responsive */

@media only screen and (max-width: 1024px) {
    .search-bar {
        margin-left: 10px;
        position: relative;
    }
    .search-bar input {
        width: 100%;
    }
}

@media only screen and (max-width: 767px) {
    #sidebar-wrapper {
        background: #ffffff;
        position: fixed;
        top: 60px;
        left: -240px;
        z-index: 1000;
        overflow-y: auto;
        width: 240px;
        height: 100%;
        -webkit-transition: all 0.2s ease;
        -moz-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        transition: all 0.2s ease;
        box-shadow: none;
    }
    .toggle-menu i {
        line-height: 60px;
        margin-left: 0px;
        font-size: 25px;
        color: #223035;
        cursor: pointer;
    }
    .content-wrapper {
        margin-left: 0px;
        padding-left: 5px;
        padding-right: 5px;
    }
    .footer {
        position: absolute;
        left: 0px;
    }
    #wrapper.toggled #sidebar-wrapper {
        position: fixed;
        top: 60px;
        left: 0px;
        box-shadow: 0 2px 6px 0 rgba(218, 218, 253, 0.65), 0 2px 6px 0 rgba(206, 206, 238, 0.54);
    }
    #wrapper.toggled .menu-icon {
        margin-left: 0px;
    }
    #wrapper.toggled .content-wrapper {
        margin-left: 0px;
    }
    #wrapper.toggled .footer {
        position: absolute;
        left: 0px;
    }
}

@media only screen and (max-width: 575px) {
    .bg-signup2 {
        height: 35rem;
        border-radius: 0;
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
    }
    .bg-signin2 {
        height: 25rem;
        border-radius: 0;
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
    }
    .bg-reset-password2 {
        height: 20rem;
        border-radius: 0;
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem;
    }
}

@media only screen and (max-width: 480px) {
    .search-bar {
        margin-left: 5px;
        position: relative;
    }
    .search-bar input {
        width: 100%;
    }
    .dropdown-lg {
        display: none;
    }
    .nav-item.language {
        display: none;
    }
    .right-nav-link a.nav-link {
        padding-right: .0rem !important;
    }
    .topbar-nav .navbar {
        padding: 0px 10px 0 5px;
    }
}

/* Table */
.table{
    border-collapse: collapse;
    margin-bottom: 0;
}
.table tr th{
    padding:6px 10px;
    border-top:0;
    font-weight:400;
    border-right:1px solid #dee2e6;
    background: #4C517A;
    color: #fff;
}
.table thead tr th {
    border-bottom: 0px solid #4C517A;
}

.table tr th:last-child{
    border-right:none;
}
.table tr td{
    padding:5px 10px;
    border-right:1px solid #dee2e6;
}
.table tr td:last-child{
    border-right:none;
}
.table tr td.right-border{
    border-right:1px solid #dee2e6;
}
.table tr td.noborder{
    border-top:none;
    border-bottom:none;
    border-left:none;
    border-right:none;
}

.table tr.noborder td{
    border-top:none;
}

.table.compleate-border tr td{
    border-top:1px solid #dee2e6;
    border-bottom:1px solid #dee2e6;
    border-left:1px solid #dee2e6;
    border-right:1px solid #dee2e6;
}



/* Anchor links */
a{
    color: #4C517A;
    text-decoration: none;
}
a:hover{
    color: #4C517A;
    text-decoration: none;
}

/* Start Font Classes */

.font-light {
    font-weight: 300 !important;
}

.font-light-italic {
    font-weight: 300 !important;
    font-style: italic !important;
}

.font-regular {
    font-weight: 400 !important;
}

.font-regular-italic {
    font-weight: 400 !important;
    font-style: italic !important;
}

.font-bold {
    font-weight: 700 !important;
}

/* Backgrounds */

.bg-dark {
    background-color: #4C517A !important;
}

.bg-light {
    background-color: #EBF5F5 !important;
}


/* Start Buttons */

.btn-default {
    background: #4C517A;
    color: white;
}

.btn-default:hover {
    background: #404866;
    color: rgba(255, 255, 255, .8)
}

.btn-default:hover span {
    color: rgba(255, 255, 255, .8)
}

.btn-default-outline {
    color: #4C517A;
    background: #fff;
}

.btn-default-outline:hover {
    background: #4C517A;
    color: white;
}

.btn-default-outline:hover span {
    color: white;
}

.btn-outline-default {
    border: 1px solid #4C517A;
    color: #4C517A;
}

.btn-outline-default:hover {
    color: #fff;
    background-color: #4C517A;
    border-color: #4C517A;
}

.btn-outline-default:hover span {
    color: #fff;
}

.btn-default.active {
    background: #001C4E;
    color: white;
}

.btn-highlighte {
    background: #FE4066;
    color: #FFF3F5;
}

.btn-highlighte:hover {
    color: #FFFFFF;
}

.no-btn{
    border:none;
    padding:0;
    margin:0;
    background-color:transparent;
}
/* End Buttons */

.theme-input-group-text{
    background: #4C517A;
    border-color: #4C517A;
    color: #fff;
}

.form-white {
    border: 1px solid #CBCBE1;
    background: white;
    border-radius: 20px;
}

.form-white.noborder {
    border: none;
}

.form-white.noborderradius {
    border-radius:0;
}

/* Temporary author rows */
.badge-default{
    padding: 2px 10px;
    background: #4C517A;
    color:#fff;
    border:none;
}
.badge-default:hover{
    background: #404866;
    box-shadow: 2px 2px 10px #DDDDEB;
}
.badge-danger{
    padding: 2px 10px;
    background: #fb2f4b;
    color:#fff;
    border:none;
}
.badge-danger:hover{
    background: #bb2124;
    box-shadow: 2px 2px 10px #DDDDEB;
}

.badge-success{
    padding: 2px 10px;
    background: #8BB54F;
    color:#fff;
    border:none;
}
.badge-success:hover{
    background: #28a745;
    box-shadow: 2px 2px 10px #DDDDEB;
}

.theme-border{
    border:1px solid #4C517A;
    box-shadow: 2px 2px 10px #DDDDEB;
}
.theme-border.noshadow{
    border:1px solid #4C517A;
    box-shadow: none;
}
.light-border{
    border:1px solid rgba(0,0,0,.1);
}
.sender-update{
    background: #F8F8FC;
    padding:5px 10px;
    border-radius: 0 15px 15px 15px;
    border: 1px solid #000;
}
.sender-update span, .sender-update strong{
    color: #000;
}
.receiver-update{
    background: #DCF8C6;
    padding:5px 10px;
    border-radius: 15px 0 15px 15px;
}
.receiver-update span, .receiver-update strong{
    color: #000;
}
.process-loader{
    width:100%;
    height:100%;
    background-color: rgba(248, 248, 252, 0.5);
    position:fixed;
    text-align:center;
    z-index:99999999;
}
.process-loader img{
    position: absolute;
    top:50%;
}

/* Pills */
.pill-default{
    padding: 2px 10px;
    background: #4C517A;
    color:#fff;
    border:none;
    border-radius: 20px;
}
.pill-default:hover{
    background: #404866;
    box-shadow: 2px 2px 10px #DDDDEB;
}

.pill-danger{
    padding: 2px 10px;
    background: #fb2f4b;
    color:#fff;
    border:none;
    border-radius: 20px;
}
.pill-danger:hover{
    background: #bb2124;
    box-shadow: 2px 2px 10px #DDDDEB;
}

.pill-success{
    padding: 2px 10px;
    background: #8BB54F;
    color:#fff;
    border:none;
    border-radius: 20px;
}
.pill-success:hover{
    background: #28a745;
    box-shadow: 2px 2px 10px #DDDDEB;
}

.pill-warning{
    padding: 2px 10px;
    background: #ff9700;
    color:#fff;
    border:none;
    border-radius: 20px;
}
.pill-warning:hover{
    background: #bf9700;
    box-shadow: 2px 2px 10px #DDDDEB;
}


/* ******************************************* */

.proceed{
    color:green;
}
.proceed small{
    color:green;
}
.proceed:hover small{
    font-weight:600;
}
.bottom-right-shadow{
    box-shadow: -27px 27px 10px -24px #e8e8e8;
    border-bottom-left-radius: 50px;
    border-left: 1px solid #e8e8e8;
    /* border-bottom: 1px solid #e8e8e8; */
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.shadow-border{
    box-shadow: -27px 27px 10px -24px #e8e8e8;
    border-radius: 10px;
    /* border: 1px solid #e8e8e8; */
    /* border-bottom: 1px solid #e8e8e8; */
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.pointer {cursor: pointer;}
.text-dull{
    color: #8ea2af;
}