/* here you can put your own css to customize and override the theme */

/***
Rounded Portlets
***/
/*
.portlet {
	border-radius: 4px !important;
}

.portlet .portlet-title {
	border-radius: 4px 4px 0px 0px !important;
}

.portlet .portlet-body,
.portlet .portlet-body .form-actions  {
	border-radius: 0px 0px 4px 4px !important;
}
*/


/*=========================================*/
/*============== MY DARK THEME ============*/
/*=========================================*/
.page-container {
	background-color: #3d3d3d !important;
}
.logo-default {
	margin-top: 21px !important;
}
.my-dark-theme {
	background-color: #4f4f4f !important;
	color: #acacac;
}
.my-dark-theme .page-title {
	color: #ffffff;
	padding-left: 65px;
	padding-bottom: 30px;
	border-bottom: 1px solid #5d5d5d;
}
.my-dark-theme .page-title small {
	color: #acacac;
	display: block;
	margin-top: 5px;
}
.my-dark-theme .page-title i {
	display: block;
	font-size: 35px;
	font-weight: bold;
	margin-top: -28px;
	margin-left: -55px;
	color: #f04848;
}
.my-dark-theme .blockUI.blockOverlay {
	opacity: 0.8 !important;
	background-color: #4f4f4f !important;
}

.my-dark-theme .top-right-container {
	margin-right: 0px;
	right: 20px;
	z-index: 100;
	position: absolute;
}
.my-dark-theme .top-right-button {
	width: 150px;
	margin-right: 0px;
	padding: 5px 10px 5px 10px;
	text-decoration: none;
	
	float: right;
	margin-left: 10px;
	
	background-color: #d05454 !important;
	border: 1px solid #8f8f8f !important;
	color: #fff;
}
.my-dark-theme .top-right-button:hover {
	background-color: #f04848 !important;
	border: 1px solid #fff !important;
	color: #fff;
}
.my-dark-theme .top-right-button i {
	/* width: 100%; */
	text-align: center;
	font-size: 30px;
	line-height: 35px;
}
.my-dark-theme .top-right-button label {
	/* width: 100%; */
	/* text-align: center; */
	/* font-size: 11px; */
	margin-left: 5px;
}
.my-dark-theme .top-right-button label small {
	display: block;
	font-size: 10px;
}
.my-dark-theme .top-right-button .badge {
	position: absolute;
	top: -9px;
	right: -9px;
}
.my-dark-theme .top-right-button .badge.badge-default {
	background-color: #e87e04;
	border: 1px solid #ffb848;
}


.my-dark-tabel .btn.default,
.my-dark-modal .btn.default,
.my-dark-portlet .btn.default,
.my-panel-antrian .btn.default {
	background-color: #4f4f4f !important;
	border: 1px solid #8f8f8f !important;
	color: #acacac;
}
.my-dark-tabel .btn.default:hover,
.my-dark-modal .btn.default:hover,
.my-dark-portlet .btn.default:hover ,
.my-panel-antrian .btn.default:hover {
	background-color: #b04b4b !important;
	border: 1px solid #fff !important;
	color: #fff;
}
.my-dark-tabel .btn.active,
.my-dark-modal .btn.active,
.my-dark-portlet .btn.active ,
.my-panel-antrian .btn.active {
	background-color: #f04848 !important;
	border: 1px solid #8f8f8f !important;
	color: #fff;
}
.my-dark-tabel .btn.active:hover,
.my-dark-modal .btn.active:hover,
.my-dark-portlet .btn.active:hover,
.my-panel-antrian .btn.active:hover {
	background-color: #e11c1c !important;
	border: 1px solid #fff !important;
	color: #fff;
}


.my-dark-theme-sidebar .selected {
	border-color: transparent #4f4f4f transparent transparent !important;
}


.my-dark-dashboard-stat {
	background-color: #5f5f5f;
}
.my-dark-dashboard-stat:hover {
	background-color: #555555;
}
.my-dark-dashboard-stat .visual {
	color: #666666;
}
.my-dark-dashboard-stat .more {
	color: #ffffff;
	background-color: #6f6f6f;
	position: absolute;
	bottom: 20px;
	left: 15px;
	right: 15px;
}
.my-dark-dashboard-stat .number {
	color: #ffffff;
}
.my-dark-dashboard-stat .desc {
	color: #acacac;
}
.my-dark-dashboard-stat .desc-small {
	font-size: 12px !important;
}


.my-dark-portlet {
	background-color: #555555 !important;
}
.my-dark-portlet .portlet-title {
	border-bottom: 1px solid #6f6f6f;
}
.my-dark-portlet .profile-usertitle-name {
	color: #acacac;
}
.my-dark-portlet .profile-usertitle-job {
	color: #fff;
}
.my-dark-portlet .profile-usermenu ul li {
	border-bottom: 1px solid #4f4f4f;
}
.my-dark-portlet .profile-usermenu ul li:last-child {
	border-bottom: none;
}
.my-dark-portlet .profile-usermenu ul li.active a {
	background-color: #b04b4b !important;
	color: #fff;
	border-left: 2px solid #fff;
}
.my-dark-portlet .profile-usermenu ul li a:hover {
	background-color: #b04b4b !important;
	color: #fff;
}
.my-dark-portlet .feeds li {
	background-color: #5f5f5f !important;
}
.my-dark-portlet .todo-tasklist-item, 
.my-dark-panel .todo-tasklist-item {
	background-color: #5f5f5f !important;
}
.my-dark-portlet .todo-tasklist-item .todo-tasklist-item-title, 
.my-dark-panel .todo-tasklist-item .todo-tasklist-item-title {
	color: #fff !important;
}
.my-dark-portlet .todo-tasklist-item .todo-userpic, 
.my-dark-panel .todo-tasklist-item .todo-userpic {
	border-color: #fff !important;
}
.my-dark-portlet .todo-tasklist-item .todo-tasklist-date,
.my-dark-portlet .todo-tasklist-item .media-body,
.my-dark-panel .todo-tasklist-item .todo-tasklist-item-text,
.my-dark-panel .todo-tasklist-item .todo-tasklist-date,
.my-dark-panel .todo-tasklist-item .media-body {
	color: #acacac !important;
}


.my-dark-portlet > .portlet-title > .nav-tabs > li.active > a, 
.my-dark-portlet > .portlet-title > .nav-tabs > li:hover > a {
	color: #fff !important;
}
.my-dark-modal .tabbable-line > .nav-tabs > li > a ,
.my-dark-portlet > .portlet-title > .nav-tabs > li > a {
	color: #f3565d !important;
}

.my-dark-modal .tabbable-line > .nav-tabs > li.active > a, 
.my-dark-modal .tabbable-line > .nav-tabs > li:hover > a{
	color: #fff !important;
	background-color: #4f4f4f !important;
}
.my-dark-modal .tabbable-line > .tab-content {
	background-color: #4f4f4f !important;
	border-top: 1px solid #6f6f6f;
	margin-top: 0;
}


.my-dark-accordion .panel-default {
	border-color: #5f5f5f !important;
}
.my-dark-accordion .panel-heading {
	background-color: #555555 !important;
}
.my-dark-accordion .panel-body {
	background-color: #555555 !important;
}


.my-dark-tabel.bordered .table > thead > tr > th {
	border: 1px solid #666666;
	vertical-align: middle;
}
.my-dark-tabel.bordered .table > tbody > tr > td {
	border: 1px solid #606060;
	vertical-align: middle;
}

.my-dark-tabel {
	border: none;
}
.my-dark-tabel .table {
	background-color: transparent !important;
}
.my-dark-tabel .table > thead > tr > th {
	border-bottom: 1px solid #666666;
	color: #ffffff;
}
.my-dark-tabel .table > tbody > tr > td {
	border-top: 1px solid #606060;
	vertical-align: middle;
}
.my-dark-tabel .table > tbody > tr > td:hover,
.my-dark-tabel .table > tbody > tr:hover > td {
	background-color: #5f5f5f !important;
}
.my-dark-tabel .form-control,
.my-dark-modal .form-control,
.my-dark-portlet .select2-choice,
.my-dark-portlet .select2-choices,
.my-dark-modal .select2-choice,
.my-dark-modal .select2-choices,
.select2-drop, .select2-search input,
.my-dark-portlet .form-control {
	background-color: #666666 !important;
	color: #fff;
	border: 1px solid #8f8f8f;
}
.my-dark-portlet .select2-choices .select2-search-field .select2-focused,
.my-dark-modal .select2-choices .select2-search-field .select2-focused {
	color: #fff !important;
}
.my-dark-tabel .form-control:disabled,
.my-dark-modal .form-control:disabled,
.my-dark-portlet .form-control:disabled {
	background-color: #8f8f8f !important;
	color: #dfdfdf !important;
	border: 1px solid #bcbcbc;
}
.my-dark-tabel .form-control:focus,
.my-dark-modal .form-control:focus,
.my-dark-portlet .form-control:focus {
	border: 1px solid #fff;
	background-color: #6f6f6f !important;
}
.my-dark-tabel .form-control::-webkit-input-placeholder,
.my-dark-modal .form-control::-webkit-input-placeholder,
.my-dark-portlet .form-control::-webkit-input-placeholder { /* Chrome */
	color: #7f7f7f;
}
.my-dark-tabel .form-control:-ms-input-placeholder,
.my-dark-modal .form-control:-ms-input-placeholder,
.my-dark-portlet .form-control:-ms-input-placeholder { /* IE 10+ */
	color: #7f7f7f;
}
.my-dark-tabel .form-control::-moz-placeholder,
.my-dark-modal .form-control::-moz-placeholder,
.my-dark-portlet .form-control::-moz-placeholder { /* Firefox 19+ */ 
	color: #7f7f7f;
}
.my-dark-tabel .form-control:-moz-placeholder,
.my-dark-modal .form-control:-moz-placeholder,
.my-dark-portlet .form-control:-moz-placeholder { /* Firefox 4 - 18 */
	color: #7f7f7f;
}
.my-dark-tabel select.dark,
.my-dark-modal select.dark,
.my-dark-portlet select.dark {
	color: #7f7f7f !important;
}
.my-dark-tabel select.default,
.my-dark-modal select.default,
.my-dark-portlet select.default {
	color: #fff !important;
}
.my-dark-tabel select.default optgroup,
.my-dark-modal select.default optgroup,
.my-dark-portlet select.default optgroup {
	color: #7f7f7f !important;
}
.my-dark-tabel select option,
.my-dark-modal select option,
.my-dark-portlet select option {
	color: #fff;
}
.my-dark-tabel select option:first-child,
.my-dark-modal select option:first-child,
.my-dark-portlet select option:first-child {
	color: #7f7f7f;
}
.my-dark-tabel select optgroup option:first-child,
.my-dark-modal select optgroup option:first-child,
.my-dark-portlet select optgroup option:first-child {
	color: #fff;
}
.my-dark-tabel select.no-blank,
.my-dark-tabel select.no-blank option:first-child, 
.my-dark-modal select.no-blank,
.my-dark-modal select.no-blank option:first-child, 
.my-dark-portlet select.no-blank,
.my-dark-portlet select.no-blank option:first-child {
	color: #fff !important;
}


.my-dark-pagging .default{
	background-color: #5f5f5f !important;
	border: 1px solid #8f8f8f !important;
	padding-left: 0;
	padding-right: 0;
}
.my-dark-pagging .active{
	background-color: #f04848 !important;
	border: 1px solid #8f8f8f !important;
	color: #fff;
}
.my-dark-pagging .active:hover{
	color: #fff;
}
.my-dark-pagging .default a{
	color: #acacac;
	padding: 5px 12px 5px 12px;
}
.my-dark-pagging .default a:hover{
	color: #fff;
}


.my-dark-modal .modal-header {
	background-color: #3d3d3d !important;
	color: #acacac;
	border-bottom: 1px solid #5d5d5d;
}
.my-dark-modal .modal-footer {
	background-color: #3d3d3d !important;
	color: #acacac;
	border-top: 1px solid #5d5d5d;
}
.my-dark-modal .modal-body {
	background-color: #4f4f4f !important;
	color: #acacac;
}
.my-dark-modal .modal-title {
	color: #ffffff;
}
.my-dark-modal .img-container {
	background-color: #3d3d3d !important;
	height: 400px;
	border: 2px solid #5d5d5d;
	padding: 5px;
}
.my-dark-modal .img-container img {
	max-height: 386px;
	max-width: 386px;
	margin: auto;
}
.my-dark-modal a {
	color: #d06f6f;
}
.my-dark-portlet .btn-block,
.my-dark-portlet .date-picker .btn,
.my-dark-modal .date-picker .btn,
.my-dark-modal .btn-timepicker {
	height: 34px !important;
}


.my-dark-portlet.calendar .fc-button {
	top: -55px !important;
	padding: 0 12px !important;
	background-color: #4f4f4f !important;
	border: 1px solid #8f8f8f !important;
	color: #acacac !important;
	border-radius: 25px !important;
	font-size: 11px !important;
}
.my-dark-portlet.calendar .fc-button:hover {
	background-color: #f04848 !important;
	border: 1px solid #fff !important;
	color: #fff !important;
}
.my-dark-portlet.calendar .fc-button.fc-state-active {
	background-color: #f04848 !important;
	border: 1px solid #8f8f8f !important;
	color: #fff !important;
}
.my-dark-portlet.calendar .fc-unthemed .fc-popover, .fc-unthemed .fc-row, .fc-unthemed hr, .fc-unthemed tbody, .fc-unthemed td, .fc-unthemed th, .fc-unthemed thead {
	border-color: #6f6f6f !important;
}
.my-dark-portlet.calendar .fc .fc-widget-header {
	background-color: transparent !important;
	color: #fff !important;
	font-weight: bold !important;
}
.my-dark-portlet.calendar .fc {
	color: #fff;
}
.my-dark-portlet.calendar .fc-unthemed .fc-today {
	background-color: #b04b4b;
}


.my-panel-antrian .theme-options {
	padding: 15px 5px 5px 5px !important;
	background-color: #3d3d3d !important;
	border-color: #666666;
	min-width: 300px;
}
.my-panel-antrian .antrian-counter {
	font-size: 15px;
	line-height: 15px;
	font-weight: bold;
	padding: 0 0 15px 0;
	margin-top: 0;
	border-bottom: 1px dashed #5d5d5d;
	color: #f04848;
}
.my-panel-antrian .antrian-panggil-no {
	font-size: 40px;
	line-height: 40px;
	font-weight: bold;
	padding-top: 5px;
	padding-bottom: 15px;
	color: #ffffff;
}
.my-panel-antrian .table-header {
	background-color: #4f4f4f; 
	padding: 5px;
	color: #ffffff;
}
.my-panel-antrian .col-left,
.my-panel-antrian .col-right {
	width: 50%;
	padding-bottom: 5px;
}
.my-panel-antrian .list-container {
	height: 115px;
	padding: 5px 18px 5px 17px;
}
.my-panel-antrian .list-container a {
	text-decoration: none;
}
.my-panel-antrian .col-left {
	border-right: 1px solid #4f4f4f; 
}
.my-panel-antrian .col-right {
	border-left: 1px solid #4f4f4f; 
}
.my-panel-antrian .antrian-nomor {
	width: 70px;
	padding: 5px 10px;
	margin: 5px 0 0 5px;
	border: 1px solid #59a8b7;
	position: relative;
	float: left;
	color: #fff;
	text-align: center;
}
.my-panel-antrian .antrian-note {
	color: #ffffff;
	width: 100%;
	text-align: center;
	margin-top: 20px;
	font-size: 9px;
	font-weight: bold;
}


.rotateimg180 {
  -webkit-transform:rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.rotateimg90 {
  -webkit-transform:rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}