.main-footer {  
  padding: 5px;  
}

.logo-small {
      color: #f4511e;
      font-size: 50px;
}

.app-box {
    border-radius: 2px;
    position: relative;
    display: block;
    margin-bottom: 20px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);     
    background-color: whitesmoke;
}
.app-box > h4 {
      font-size: 19px;
      line-height: 1.375em;
      color: #303030;
      font-weight: 400;      
      text-decoration: none;
}

.app-box > .app-box-content {
    position: relative;
    text-align: center;
    padding: 3px 0;
    color: #303030;    
    display: block;
    z-index: 10;    
    text-decoration: none;
}

.app-box > a > .app-box-icon {
    color: #f4511e;
    font-size: 50px;
     -webkit-transition: width 2s, height 2s, -webkit-transform 2s; /* Safari */
    transition: width 2s, height 2s, transform 2s;
}


.app-box a > .app-box-icon:hover {    
    -webkit-transform: rotate(360deg); /* Safari */
    transform: rotate(360deg);    
}

.app-box a > .app-box-icon:hover + h4 {    
    font-weight: 700;
}
.app-box > a> h4:hover {
      font-weight: 700;
}

@media only screen and (min-width: 768px) {
  .modal {
    text-align: center;
  }
  .modal-xl {
     width: 90%;
     max-width:1200px;
  }
  .modal:before {
    display: inline-block;
    vertical-align: middle;
    content: " ";
    height: 100%;
  }
  .modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
  }
  .modal.fade .modal-dialog {
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
    opacity: 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  .modal.fade.in .modal-dialog {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    /*
    -webkit-transform: translate3d(0, -300px, 0);
    transform: translate3d(0, -300px, 0);
    */
    opacity: 1;
  }
}

/* Bootstrap 3 Form Horizontal */
.modal-body .form-horizontal .col-sm-2,
.modal-body .form-horizontal .col-sm-10 {
    width: 100%
}

.modal-body .form-horizontal .col-sm-offset-2 {
    margin-left: 15px;
}


@media (min-width: 768px) {
    .form-horizontal .control-label-left {
        padding-top: 7px;
        margin-bottom: 0;
        text-align: left;
    }
    
    .form-horizontal .text-left {
        padding-top: 7px;
        margin-bottom: 0;
        text-align: left;
    }
}

/* Bootstrap 3 Directional Slides */
.modal.fade:not(.in).left .modal-dialog {
	-webkit-transform: translate3d(-25%, 0, 0);
	transform: translate3d(-25%, 0, 0);
}
.modal.fade:not(.in).right .modal-dialog {
	-webkit-transform: translate3d(25%, 0, 0);
	transform: translate3d(25%, 0, 0);
}
.modal.fade:not(.in).bottom .modal-dialog {
	-webkit-transform: translate3d(0, 25%, 0);
	transform: translate3d(0, 25%, 0);
}

/* Alternative Angles */
.modal.fade:not(.in).top-left .modal-dialog {
	-webkit-transform: translate3d(-25%, -25%, 0);
	transform: translate3d(-25%, -25%, 0);
}
.modal.fade:not(.in).top-right .modal-dialog {
	-webkit-transform: translate3d(25%, -25%, 0);
	transform: translate3d(25%, -25%, 0);
}
.modal.fade:not(.in).bottom-left .modal-dialog {
	-webkit-transform: translate3d(-25%, 25%, 0);
	transform: translate3d(-25%, 25%, 0);
}
.modal.fade:not(.in).bottom-right .modal-dialog {
	-webkit-transform: translate3d(25%, 25%, 0);
	transform: translate3d(25%, 25%, 0);
}

.bg-color-red {
	background: red;
}

.bg-color-green {
	background: green;
}

.bg-color-yellow {
	background: yellow;
}

.bg-color-blue {
	background: blue;
}

.bg-color-orange {
	background: orange;
}

/* Remove Serching DataTabels */
/*div.dataTables_wrapper div.dataTables_filter {
	display:none;
}*/

@media screen and (min-width: 768px) {
    div.dataTables_wrapper div.dataTables_info {
        margin-top: 20px;
        padding-top:0px;	
    }
}

/* Other */

.full-height {
	height:100%;
    margin-bottom: 0px;
}

.panel-fullscreen {
    display: block;
    z-index: 9999;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    overflow: auto;
}

.text-to-upper {
    text-transform: uppercase;
}

.text-left {
    text-align: left;
}

.text-justify {
    text-align: justify;
}

.borderless>tr>td {
    border: none !important;    
}

.borderlesss tr td {
    border: none !important;    
}

.table-borderless>thead>tr>th
.table-borderless>thead>tr>td
.table-borderless>tbody>tr>th
.table-borderless>tbody>tr>td
.table-borderless>tfoot>tr>th
.table-borderless>tfoot>tr>td {
    border: none;
}

.navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
    position: absolute;
    right: 0px;
    left: auto;
    border: 1px solid #ddd;
    background: #fff;
}

@media screen and (min-width: 601px) {
    div.judulutama1 { display: show; }
    div.judulutama2 { display: none; }
}

@media screen and (max-width: 600px) {
    div.judulutama1 { display: none; }
    div.judulutama2 { display: show; }
}

/*Login CSS */
.panel-login {
    min-width: 320px;
    max-width: 350px;	
	margin-bottom: 0;	
}

.panel-yellow {
  border-color: #fc8c03;
}

.input-group-addon {
    background-color: #fc8c03 !important;
    border-color:#9e9a98 !important;
    color: white;
}

.btn-primary-login {
    background: #fc8c03;
    color: white;
    font-weight: normal;
}

.btn-primary-login:hover, .btn-primary-login:focus, .btn-primary-login:active, .btn-primary-login.active, .open > .dropdown-toggle.btn-primary-login {
    background: orange;
    color: white;
    font-weight: bold;
}

.btn-primary-login:active, .btn-primary-login.active {
    background: orange;
    box-shadow: none;
}

.vertical-center {    
    display: -webkit-flex; /* Safari */
    -webkit-align-items: center; /* Safari 7.0+ */
    display: flex;
    align-items: center;
}

.bg-block {	   
  min-height: inherit;
}

.bg-gradient {  
  background: orange; /* For browsers that do not support gradients */
  background: -webkit-radial-gradient(circle, orange, #fc8c03, orange); /* Safari */
  background: -o-radial-gradient(circle, orange, #fc8c03, orange); /* Opera 11.6 to 12.0 */
  background: -moz-radial-gradient(circle, orange, #fc8c03, orange); /* Firefox 3.6 to 15 */
  background: radial-gradient(circle, orange, #fc8c03, orange); /* Standard syntax */
}

.background-content {
    background: url('../img/pic_background03.jpg') no-repeat; 
    background-size: 100% 100%;
}