@import url("jquery-ui.css");

@font-face {
    font-family: "Inter";
    src: url('../webfonts/Inter_18pt-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

* {
	-moz-box-sizing: content-box;
         box-sizing: content-box;
	font-family: inherit;
	font-size: inherit;
}

:root {
	--ss-font-color: black;
	--ss-border-color: #5189c0;
	--ss-border-radius: 3px;
	--ss-bg-color: #e9f4ff;
	--ss-disabled-color: transparent;
}

select {
	color: black;
}

:focus {
	outline-style: dotted;
	outline-color: orange;
	outline-width: 1px;
	border-color: orange !important;
}

p {
	margin: 1em;
}

.bodytext {
	font-weight: normal;
	color: #FFFFFF;
	font-family: "Inter", sans-serif
}

.bodytextbold {
	font-weight: bold;
	color: #FFFFFF;
	font-family: "Inter", sans-serif
}

.bodytextboldwhite {
	font-weight: bold;
	font-size: 11px;
	color: #000000;
	font-family: "Inter", sans-serif
}

.bodytextboldwhiteun {
	font-weight: bold;
	font-size: 11px;
	color: #000000;
	font-family: "Inter", sans-serif;
	text-decoration: underline;
}

a {
	color: #3366cc;
	text-decoration: none;
}

a:visited {
	color: #3366cc;
	text-decoration: none;
}

a:hover {
	color: #3366cc;
	text-decoration: underline;
}

a:active {
	color: #b2c9f9;
	text-decoration: none;
}

body {
	margin: 0px;
	font-family: "Inter", sans-serif;
	font-weight: normal;
	font-size: 12px;
}

tdLabel {
	font-family: "Inter", sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #000000;
}

.errorMessage {
	color: red;
	font-size: 1em;
}

.messageWrapper {
	padding: .7em;
	margin-bottom: 1.4em;
}

.messageIcon {
	float: left; margin-right: 1.4em;
}

errorLabel {
	font-family: "Inter", sans-serif;
	font-size: 9px;
	color: red;
}

label {
	font-family: "Inter", sans-serif;
	font-weight: normal;
	color: #000000;
}

table.mytable {
	border-style: solid;
	border-color: black;
	border-width: 1px;
}

th.columnheader {
	background-color: rgb(228, 228, 228);
}

td.tablepager {
	background-color: rgb(228, 228, 228);
}

tr.even {
	background-color: lightblue;
}

tr.odd {
	background-color: rgb(228, 255, 228);
}

table.std tr.aspekPenilaianKinerjaKprsTr,
table.std tr.topborder {
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}
table.std tr.aspekPenilaianKinerjaKprsTr td {
	vertical-align: middle;
}

code.snippet {
	color: red;
}

code.highlight {
	color: red;
	background-color: rgb(255, 255, 128);
}

.inputerror {
	color: red;
	font-weight: bold;
	background-color: yellow;
}

input.error, textarea.error, select.error, .select.error {
	border: 1px solid red !important;
	background-color: lightyellow;
}
div.dialogFormEdit input[type="radio"] {
	float:left;
	margin: 2px 0 0;
}
div.dialogFormEdit label {
	padding-left: 18px;
	margin: 0 0 12px;
}

div.code {
	color: red;
	background-color: rgb(255, 255, 228);
}

div.note {
	background-color: rgb(228, 255, 228);
}

TABLE.palette TH {
	font-size: 9pt;
	font-weight: bold;
	color: white;
	background-color: #330066;
	text-align: center;
}

TABLE.palette SELECT {
	font-weight: bold;
	background-color: #839cd1;
	width: 200px;
}

TABLE.palette TD.controls {
	text-align: center;
	vertical-align: middle;
	width: 60px;
}

pre {
	font-family: monospace;
}

h1 {
	text-align: center;
	font-size: 1.6em;
	color: #5189C0; 
	padding-top: .6em;
	padding-bottom: .9em;
	white-space: pre-line;
}

form {
	margin: 0px;
} 

.errorlabel {
	color: Red;
}

.backgroundForm {
	background: #cc2810;
}

.backgroundForm1 {
	background: #83bf00;
}

.formtext_new {
	font-size: 13px;
	border: 1px solid red;
}

.formtext_2 {
	font-size: 11px;
	border: 1px solid gray;
}

.buttons_new {
	font-size: 10px;
}

.labelText {
	color: white;
}

#header {
	/*height: 90px;*/
	margin: 0px;
	padding: 0px;
	height: 66px;
	position: relative;
	z-index: 2;
	
	border-bottom: 1px solid #D4EAFF;
	background-color: #5189C0;
}

html.in-iframe {
	height: 100%;
	/* overflow: scroll; */
	scrollbar-width: thin; 	
}

html.in-iframe:has(#ContractLifecycle) {
	overflow: hidden;
}

html.in-iframe html.in-iframe {
	/* overflow: scroll; */
	scrollbar-width: thin;
}

html.in-iframe #header {
	display: none;
}

#header2 {
	background-image:url(../images/logo.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:80%;
	background-color: white;
	max-width: 145px;
	min-width:94px;
	width: 145px;
	height:66px;
	position:absolute;left:0px;top:0px;
}

.header-DJMGB #header2 {
	background-image:url(../images/logo_esdm.png);
}
 
#header_left { 
	margin: 0px;
	background-repeat: repeat-x;
	background-position: right bottom;
	max-height: 66px;
	height: 66px;
	
	padding: 0px;
	margin: 0px;
	vertical-align: bottom;
	margin-right: 167px;
	margin-left: 145px;
}

#header_right {
	background: url(../images/header_r.png); 
	height: 66px;
	width: 167px;
	position:absolute;
	right:0px;
	top:0px;
	overflow:hidden;
	max-width: 300px;
	text-align: right;
}

#header_right>div {
	height:100%;
	position:relative;
}

#local_time {
	padding: 2px;
	padding-right: 5px;
	vertical-align: middle;
	
	text-align: right;
	
	padding-bottom: 7px;
	position:absolute;
	right:0px;
	top:0px;
}

#login_info {
	text-align: right;
	padding: 2px;
	padding-right: 5px;
	
	overflow:hidden;
	position:absolute;
	right:0px;
	bottom:0px;
}

#login_info a.other {
	color: #3366cc;
	text-decoration: none;
}

#login_info a {
	color: #fa3a3a;
	text-decoration: none;
}

#login_info a:hover {
	text-decoration: underline;
}

#login_info ul {
	list-style: none;
	padding-left: 5;
}

#login_info li {
	display: inline;
	padding-right: 5px;
}

#menu {
	background-position: center top;
	background-color: #83be02;
	background-repeat: no-repeat;
	padding-top: 3px;
	padding-bottom: 3px; border-bottom : 1px solid gray;
	text-align: center;
	color: gray;
	height: 17px;
	border-bottom: 1px solid gray; 
}

#menu a {
	color: White;
	text-decoration: none;
	padding: 2 0 2 0;
	margin: 2 0 2 0;
}

#menu a:hover {
	color: maroon;
	text-decoration: none;
}

#wrapper {
	background-color: #f8f8f8;
}
html.in-iframe #wrapper {
	margin-top: .25em;
	border-radius: 5px;
}

.content-header {
	padding: 1em;
	line-height: 2;
	font-weight: bold;
	text-align: center;
}

#footer {
	font-size: 0.8em;
	width: 100%;
	text-align: center;
	padding-top: 2px;
	padding-bottom: 2px;
	color: White;
	background: #83AD27;
	position: relative;
	margin-top: -17px;
	clear: both;
}
#footer * {
	font-size: 1em;
}

body:before {
	content: "";
	height: 100%;
	float: left;
	width: 0;
	margin-top:-32767px;/
}

#footer a {
	color: white;
	text-decoration: underline;
}
#footer a:visited {
	color: white;
}
#footer a:hover {
	text-decoration: none;
}

/* #menu ul {
} */

#menu ul li ul {
	border: 1px solid black;
	background-color: #83be02;
}

ul.dropdown li {
	padding-left: 5;
	padding-right: 5; 
	color: white;
}

#nav2 {
	float: none;
	left: 137px;
}

h2 {
	color: Maroon;
	display: block;
	margin-bottom: 20;
	font-size: larger;
}

#content {
	/* margin:5px;
	padding: 5px;
	margin-bottom: 30px; */
	position: relative;
	background-color: white;
}

#left {
	width: 190px;
	float: left;
	border: 1px solid #D4EAFF;
	margin: 5px;
	background-color: white;
	padding-left: 10px;
	padding-bottom: 2em;
	position: absolute;
	left: 0px;
}

#left>ul {
	padding: 0px;
}
#left>ul>li {
	list-style: none;
	padding-top: 1em;
	color: #8eab38;
}
#left>ul>li>ul, #left>ul>li>ul>li>ul {
	margin-top:.2em;
	color: black;
	padding: 0px;
}
#left>ul>li>ul>li, #left>ul>li>ul>li>ul>li {
	list-style-type: none;
	color: rgb(51, 102, 204);
}

#left>a {
	display: block;
	width: 200px;
	border-bottom: 1px solid #ddd;
	text-align: center;
	background-color: #aaa;
	margin-left: -10px;
	/* margin-right: -10px; */
}
.left_menu_logo {
	vertical-align: bottom; margin-left: -5px;
}
.left_menu_logo_text {
	display: none;
}

#content.withLeft {
	margin-top: 5px;
	margin-right: 5px;
	margin-left: 215px;
	background-color: white;
	border: 1px solid #D4EAFF;
	padding-bottom: 20px;
	overflow-x: auto;
	height: 100%;
	overflow-y: hidden;
}

/* HALAMAN LOGIN */
#Login_error {
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 30;
	padding-bottom: 0px;
	margin-bottom: 0px;
}

#Warna {
	color: White;
}

#Login h2 {
	display: block;
}

#Login table {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	width: 100%;
}

input.utama {
	width: 128px;
	padding: 2px 4px;
	margin: 2px;
}

#Login input[type=submit] {
	margin-right: 20px;
}

#Login_bpmigas {
	background-image: url('../images/bpmigas.gif');
	background-repeat: no-repeat;
	height: 115px;
	margin-left: 5px;
	padding-bottom: 0;
	margin-bottom: 0;
}

#Login_news {
	margin-left: 410;
	padding-left: 30;
	padding-right: 50;
	border: 1px solid gray;
}

#Login_news ul {
	padding-left: 10;
	margin-left: 0;
	max-height: 200px;
	overflow: auto;
}

#dialogCheckboxForm div.row {
	width: 100%;
}
#dialogCheckboxForm div.row>div.cell {
	width: 12%;
	display: inline-block;
	margin: 3px 0;
}
#dialogCheckboxForm input{
	vertical-align: sub;
}
/* div.basicFormHeader {
	max-width: 500px; 
} */
div.basicFormHeader .formHorizontal {
	margin: 5px 0;
}
div.basicFormHeader .formHorizontal label {
	width: 25%;
	display: inline-block;
}
div.basicFormHeader .formHorizontal input,
div.basicFormHeader .formHorizontal select {
	width: 70%;
	display: inline-block;
}

ul.listaction-multiple-plain {
    margin: 0; padding: 0; list-style-type: none;
}

table.std {
	width: 100%;
	border-collapse: collapse;
	/*border-collapse: separate;*/
	border: 1px solid #EEE;
	background-color: white;
	box-sizing:border-box;
}

.JStableOuter table.std{
	max-height: 100vh;
}

table.std-print {
	width: 100%;
	border-collapse: collapse;
	/*border-collapse: separate;*/
	border: 1px solid black;
	background-color: white;
	box-sizing:border-box;
}

table.str{
	width:100%;
}

table.str td.center{
	text-align:center;
}

table.std-print td {
	font-weight: normal !important;
	padding: .4em;
	border-top-width: 0px !important;
	border-right: 1px solid black;
	/*white-space: pre-wrap; harus diperbaiki dulu di tampilan2*/
}

table.std td {
	font-weight: normal !important;
	padding: .4em;
	border-top-width: 0px !important;
	border-right: 1px solid rgba(0,0,0,0.1);
	/*white-space: pre-wrap; harus diperbaiki dulu di tampilan2*/
}

table.std td.right {
	text-align: right;
}
table.std td.center {
	text-align: center;
}

table.std td,table.std th, .listactionx-totalHeader td, .listactionx-total td {
	padding: .4em 7px .4em 7px;
	vertical-align: top;
}

table.std-print td,table.std-print th, .listactionx-totalHeader td, .listactionx-total td {
	padding: .4em 7px .4em 7px;
	vertical-align: top;
	border: 1px solid black;
}

table.std th, .listactionx-totalHeader td, .listactionx-total td {
	padding-top: 5px;
	padding-bottom: 4px;
	color: #fff;
	background: #5189C0;
	font-weight: normal;
	border-right: 1px solid rgba(255,255,255,0.1);
}

table.std th {
	text-align: center;
}

table.std-print th {
	text-align: center;
	padding-top: 5px;
	padding-bottom: 4px;
	color: black;
	background: white;
	font-weight: bold;
}

table.std th:hover, .listactionx-totalHeader td:hover, .listactionx-total td:hover {
	background: #3A638C;
}

table.std th a, .listactionx-totalHeader td a, .listactionx-total td a {
	color: #fff;
}

table.std th a:hover,table.std td a:hover, .listactionx-totalHeader td a:hover, .listactionx-total td a:hover {
	text-decoration: underline !important;
}

table.std>tr.alt td, table.std>tbody>tr.alt td, table.std>tr:nth-child(even) td, table.std>tbody>tr:nth-child(even) td {
	background-color: #E1F0FF;
}  

table.std tr.hover td, table.std tr.selected td {
	background-color:#a7c7eb !important;
}
table.std tr.selected
{
	border: 1px solid #DCDCDC;
}

table.std tr th.sort {
	background-image: url('../images/sort.png');
	background-position: 10px;
	background-repeat: no-repeat;
}

table.std tr th.sort_reverse {
	background-image: url('../images/sort_reverse.png');
	background-position: 10px;
	background-repeat: no-repeat;
}

table.std th.separator, table.std td.separator {
	width:0px;overflow:hidden;margin:0px;padding:0px;
	border-right: 1px solid rgba(230,230,230,0.5);
	border-left: 1px solid rgba(190,190,190,0.5);
}

table.std th.separator div, table.std td.separator div {
	width:0px; overflow:hidden;
}

table.std > tbody > tr.subheader > td {
	background-color: #aaa;
	font-weight: bold;
	text-align: center;
}

#validasi table.std th {
	background: #ddd;
	color: black;
	font-weight: normal;
}
#validasi table.std th a:link {
	color: black;
}

table.std > tbody > tr > td .ui-button {
	z-index: 0;
}

div.std_freeze {
	float: left;
	width:20%;
}
div.std_table {
	width: 80%;
	overflow-x: scroll;
}


div.listTableContainer, div.listTableScrollTop {
	overflow-x: auto;
}

div.listTableScrollTop > div {
	height: 1px;
	overflow-y: hidden;
	box-sizing:border-box;
}

table.std tr.listaction-totalHeader td {
	border-top: 1px solid rgb(206, 228, 193) !important;
	border-top-width: 1px !important;
	font-weight: bold !important;
}

.menu_header {
	background: #83be02;
}

.loading {
	background-image: url(../images/loading.gif);
	min-width:16px;
	min-height:16px;
	width:16px;
	height:16px;
	background-position: center;
	background-repeat: no-repeat;
}
.loading-big {
	background-image: url(../images/loading-big.gif);
	background-position: center;
	background-repeat: no-repeat;
	min-width:100px;
	min-height:100px;
}

.message {
	clear: both;
	color: #000000;
	cursor: hand;
	background: #666;
	font-size: 1em;
	text-transform: uppercase;
	border-radius: 3px;
	box-shadow: 1px 1px rgba(0,0,0,0.4);
	padding: 1px 5px;
	behavior: url(/pmadashboard/css/pie/PIE.htc);   /*adding functionality to border radius in ie8*/
}

.iex_valid {
	background-color: #62B212;
	border-color: #467F0D;
}

.iex_warning, .iex_processing {
	background-color: #FFFF00;
	border-color: #467F0D;
}

/* .iex_error, .iex_fatal_error { */
/* 	background-color: #CC1414; */
/* 	border-color: #7F0D0D; */
/* } */

.iex_error, .iex_fatal_error {
	background-color: #CC1414;
	border-color: #7F0D0D;
	color: white;
	cursor: pointer;
}

.hide {
	display: none;
}

.Warna {
	color: White;
}
pre {
	text-align: left;
}

form.std * {
	scroll-margin-top: 100px;
}


form.std .form-attachment a {	
	white-space: nowrap;
	max-width: 100%;
	overflow:hidden;
}

form.std .form-attachment .button {	
	position: absolute;
	right: -2px;
	top: 0;
}

form.std div.form-actions {
	border-bottom: 1px solid #D4EAFF;
	margin-bottom: 1em;
	padding: 0.5em 20px;
	margin-left: -5px;
	padding-left: 10px;
	padding-bottom: .5em;
	padding-top: .5em;
	background-color: #DFE0DF;
	margin-right: -5px;
	border-top: 1px solid #D4EAFF;
	position: relative;
	text-align: right;
	padding-right: 0px;
	height: 30px;
	overflow: hidden;
	position: relative;
}

form.std div.form-actions > span {
	display:inline-block;
	left: 10px;
	position: absolute;
	z-index: 1;
	background-color: #DFE0DF;
	height: 3em;
}

.form-actions:not(:has(*)) {
	display: none;
}

form.std #states {
	display:inline-block;
	text-align:left;
	overflow: hidden;
	white-space: nowrap;
	/* float: right; */
}

form.std #states ul {
	margin: 0;
	padding: 0 18px 0 0;
	border-top: 1px solid #888;
	border-bottom: 1px solid #888;
}

form.std #states ul li {
	display: inline-block;
	list-style-type: none;
	margin: 0 -18px 0 0;
	padding: 0;
	background-color: #EBEBEB;
}

form.std #states ul li.state-active-blue {
	background-color: #5382b9;
}

form.std #states ul li.state-active-yellow {
	background-color: #cbc800;
}

form.std #states ul li.state-active-green {
	background-color: rgba(42, 209, 0, 1);
}

form.std #states ul li.state-active-red {
	background-color: #f00;
}

a.form-workflow-action-button-blue, button.form-workflow-action-button-blue, input.form-workflow-action-button-blue[type=submit] {
	background: #5382b9;
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
	color: white;
	background-image: linear-gradient(to bottom, #5382b9, #274971);
}
a.form-workflow-action-button-yellow, button.form-workflow-action-button-yellow, input.form-workflow-action-button-yellow[type=submit] {
	background: #cbc800;
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
	color: white;
	background-image: linear-gradient(to bottom, #cbc800, #aba800);
}
a.form-workflow-action-button-green, button.form-workflow-action-button-green, input.form-workflow-action-button-green[type=submit] {
	background: #2AA100;
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
	color: white;
	background-image: linear-gradient(to bottom, #2AD100, #2AA100);
}
a.form-workflow-action-button-red, button.form-workflow-action-button-red, input.form-workflow-action-button-red[type=submit] {
	background: #E25858;
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
	color: white;
	background-image: linear-gradient(to bottom, #ED5656, #A72A2A);
}

form.std #states ul li > .state-label {
	padding: 7px;
	display: inline-block;
	padding-left: 24px;
	margin: 0;
	position: relative;
	vertical-align: baseline;
	cursor: default;
}

form.std #states.small ul li > .state-label {
	width: 0px;
	padding-left: 10px;
	/* hide text */
	white-space: nowrap;
	overflow: hidden;
	
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

form.std #states.small ul li > .state-label.hover,  form.std #states.small ul li.state-active > .state-label {
    width: auto;
	padding-left: 24px;
	/* show text */
	text-indent: 0;
}

form.std #states.small ul {
	height: 28px;
	overflow-y: hidden;
	
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

form.std #states ul li.state-active > .state-label {
	color: white;
	text-shadow: 0 1px 1px #729fcf, 0 -1px 1px #3465a4;
}

form.std #states ul li > .state-arrow {
	width: 17px;
	height: 28px;
	display: inline-block;
	vertical-align: top;
	overflow: hidden;
	margin-left: -5px;
}

form.std #states ul li > .state-arrow span {
	position: relative;
	width: 22px;
	height: 23px;
	display: inline-block;
	margin-left: -12px;
	margin-top: 2px;
	box-shadow: -1px 1px 2px rgba(255, 255, 255, 0.1), inset -1px 1px 1px rgba(0, 0, 0, 0.1);
	border: 1px solid #888;
	background-color: #EBEBEB;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}
.lt-ie9 form.std #states ul li > .state-arrow span {
	/* IE8+ - must be on one line, unfortunately */ 
	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865474, M12=-0.7071067811865476, M21=0.7071067811865476, M22=0.7071067811865474, SizingMethod='auto expand')";
	
	/* IE6 and 7 */ 
	filter: progid:DXImageTransform.Microsoft.Matrix(
	         M11=0.7071067811865474,
	         M12=-0.7071067811865476,
	         M21=0.7071067811865476,
	         M22=0.7071067811865474,
	         SizingMethod='auto expand');
	margin-left: -17px; 
	margin-top: -3px;
}

form.std #states ul li.state-active-blue > .state-arrow span {
	background-color: #5382b9;
}

form.std #states ul li.state-active-yellow > .state-arrow span {
	background-color: #cbc800;
}

form.std #states ul li.state-active-green > .state-arrow span {
	background-color: rgba(42, 209, 0, 1);
}

form.std #states ul li.state-active-red > .state-arrow span {
	background-color: #f00;
}

form.std #states ul li:first-child > .state-label, .is-ie form.std #states ul li.first-child > .state-label {
	border-left: 1px solid #888;
	padding-left: 14px;
}

/* form.std #states ul li:last-child, .is-ie form.std #states ul li.last-child {
}			 */

form.std #states ul li:last-child > .state-label, .is-ie form.std #states ul li.last-child > .state-label {
	padding-right: 14px;
}

form.std #states ul li:last-child > .state-arrow, .is-ie form.std #states ul li.last-child > .state-arrow {
	display: none;
}

input.ui-button {
	color: #36C;
}

.ui-button.red {
	background-color: #bb5252;
	background-blend-mode: overlay;
}

.ui-button.green {
	background-color: #93b154;
	background-blend-mode: overlay;
}

.ui-button.yellow {
	background-color: #f5c211;
	background-blend-mode: overlay;
}


form.std div.form-actions .ui-button-text {
	padding: .4em 1em !important;
}

.ui-widgets, .ui-widget {
	font-size: 1em !important;
}
#btnAddNote.ui-button.ui-widget{
    margin: 10px 0px;
    padding: 2px;
}

form.std input[type='text'], .form input[type='text'], form.std input.text, .form input.text {
	width: calc(100% - 14px);
	min-width: 100px;
	display: block;
	background-color: #ffffdb;
}
/*===============================================================================*/
form.std input.text, .form input.text, form.std input.date, .form input.date {
	width: calc(100% - 10px);
	display: block;
	background-color: #ffffdb;
}

/*====================================================================*/
form.std input.time, .form input.time {
	background-color: #ffffdb;
}

form.std textarea, form.std select, .form textarea, .form select {
	width: calc(100% - 10px);
	min-width: 100px;
	display: block;
	background-color: #ffffdb;
}

.form div.select {
	background-color: #ffffdb;
}

/* form.std select, .form select {
	padding-top: 1px;
	padding-bottom: 1px;
} */
.stdInput {
	width: 100%;
	min-width: 100px;
}
input[type='text'], input[type='time'], input[type='password'], input.text, textarea, select, input.ui-autocomplete-input {	
	border: 1px solid #5189c0;
	/* margin: 2px; */
	border-radius: 3px;
	padding: 7px 4px;	
	background-color: #e9f4ff;
}
input.required, textarea.required, select.required, div.select.required {
	background-color: #FCC !important;
}
input.readonly, textarea.readonly, select.readonly, div.select.readonly {
	background-color: white !important;
	border: 1px solid #efefef;
}
#searchForm input[type='text'], #searchForm input[type='password'], #searchForm input.text, #searchForm textarea, #searchForm select, #searchForm input.ui-autocomplete-input {
	padding: 2px 4px;	
}

@keyframes borderPulse {
  0% { border-color: #cccccc; }
  50% { border-color: #4a90e2; }
  100% { border-color: #cccccc; }
}

/* Apply animation to the input when jQuery UI adds the loading class */
.ui-autocomplete-loading {
  animation: borderPulse 1.5s infinite ease-in-out;
  border-width: 1px; 
  border-style: solid;
}

.value {
	padding: 7px 4px;
	/* margin: 2px; */
	display: block;
	border: 1px solid #efefef;
	border-radius: 3px;
	min-height: 1.2em;
	position: relative;
}

.textarea-value {
	white-space: pre-wrap;
	min-height: 6em;
	max-height: 10em;
	overflow: auto;
	
}

form.std label, .form label {
	width: 100%;
	text-align: left;
	display: block;
	/* white-space: nowrap; */
	padding-left: 10px;
	box-sizing: border-box;
	padding-top: .4lh;
	text-wrap: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	padding-right: 5px;
}

form.form-action label {
	text-wrap: auto !important;
}

form.std label.boolean-radio, .form label.boolean-radio {
	display: inline;
	width: auto;
}

form.std label.required:after {
	content: "*"
}

.form table tr td.separator, h3 {
	text-align: left;
	/*background: #A7C942 url(../images/ui-bg_highlight-soft_50_a7c942_1x100.png) 50% 50% repeat-x;*/
	color: #5189C0;
	font-weight: bold;
	margin-top: 1.1em;
	margin-bottom: .5em;
	font-size: 1.2em;
}

.form table tr td.separator {
	border-bottom: 1px solid #ddd;
	padding-left: 10px;
}

.form table tr td.separator hr {
	border: 0px;
	height: 0px;
	overflow: hidden;
	margin: 0px;
	display: none;
}

.form table tr:not(:first-child):has(td.separator) > td {
	padding-top: 1em;
}

.form table tr td.element-container {
	padding-right: 15px;
}
/* =======================================================================
	Khusus Element Container Combobox*/
	
.form #ProclistForm table tr td.element-container:has(div[role~="combobox"]){
	width: auto;
}
.form #ProclistEvaharForm table tr td.element-container:has(div[role~="combobox"]){
	width: 75px;
}
.form #ProclistHepForm table tr td.element-container:has(div[role~="combobox"]){
	width: auto;
}
.form #ProclistNegosiasiForm table tr td.element-container:has(div[role~="combobox"]){
	width: 75px;
}
.form #PlkPjwkPelaporan table tr td.element-container:has(div[role~="combobox"]){
	width: 75px;
}
.form #BidPlanAction table tr td.element-container:has(div[role~="combobox"]){
	width: 75px;
}
.form #BidAwardPengajuan table tr td.element-container:has(div[role~="combobox"]){
	width: 75px;
}
.form #BidAwardAction table tr td.element-container:has(div[role~="combobox"]){
	width: 75px;
}
.form #PlkPjwkPelaporanGS table tr td.element-container:has(div[role~="combobox"]){
	width: 75px;
}
.form table tr td.element-container:has(div[role~="combobox"]) {
	width: 55px;
}

/*.form table tr td.element-container:has(div[role~="combobox"]) {
	width: auto;
}
===========================================================================*/

.form table tr td.label-container {
 	vertical-align: top;
 	padding-top: .3lh;
 	padding-bottom: .3lh;
 	border-bottom: 1px dotted transparent;
}

.form table tr td.label-container:hover {
	border-bottom-color: #5189c0;
}

/*===========================================*/
/*Khusus untuk ukuran tabel*/
.form #LaporanKontrakDetailRigAction table {
  width: 150% !important;
}
.form #LaporanKontrakDetailOCTGAction table {
  width: 150% !important;
}
.form #LaporanKontrakDetailValveAction table {
  width: 150% !important;
}
.form #LaporanKontrakDetailVesselAction table {
  width: 150% !important;
}
.form #LaporanKontrakDetailPipaAction table {
  width: 150% !important;
}
.form #LaporanKontrakDetailWellheadAction table {
  width: 150% !important;
}
/*===========================================*/

.form table {
	table-layout: fixed; 
}

.many>table {
	width: 100%;
	table-layout: auto;
}

.many .many-number {
	vertical-align: top;
	padding-top: .5em;
	padding-left: 10px;
	width: 10px;
}

.many td {
	padding-right: 0px !important;
}

.hidden {
	display: none;
	visibility: hidden;
}

#Table_01 #Login {
	padding-top: 5px;
	padding-bottom: 5px;
}

#tabs div {
	overflow: auto;
}

.r1 {
   -moz-transform: rotate(90deg);
   -webkit-transform: rotate(90deg);
   transform: rotate(90deg);
   filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);  
}
.r2 {
	-moz-transform: rotate(180deg);
   -webkit-transform: rotate(180deg);
   transform: rotate(180deg);
   filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}
.r3 {
   -moz-transform: rotate(-90deg);
   -webkit-transform: rotate(-90deg);
   transform: rotate(-90deg);
   filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
.m1 {
	-webkit-transform: matrix(-1, 0, 0, 1, 0, 0);
    -moz-transform: matrix(-1, 0, 0, 1, 0, 0);
    transform: matrix(-1, 0, 0, 1, 0, 0);
    filter:progid:DXImageTransform.Microsoft.BasicImage(mirror=1);
}
.m2 {
	-webkit-transform: matrix(1, 0, 0, -1, 0, 0);
    -moz-transform: matrix(1, 0, 0, -1, 0, 0);
    transform: matrix(1, 0, 0, -1, 0, 0);
    filter:progid:DXImageTransform.Microsoft.BasicImage(mirror=2);
}

.search {
	text-align: left;
}
.list { padding: 0; /* margin-top: 1.5em; */}
/* .listTableMenu {
} */
.listPaging input {
	width: 35px;
}
.listPaging span {
	margin-left: 15px;
	margin-right: 15px;
}
.listNumRecords {
	position: absolute;
	left: 0px;
	margin-top: 5px;
	padding-left: 15px;
}
.listRowPerPage {
	position: absolute;
	right: 0px;
	padding-right: 10px; 
}
.listRowPerPage input {
	width: 35px;
}
.listHeader {
	margin-bottom: 0.5em;
	margin-top: 0.5em;
	text-align: center;
}
.listCurrentPage {
	font-weight: bold;
}
#mainTab {
	margin-top: -30px;
}
#mainMenu {
	position: relative;
	/* top: 1.4em; */
	/* margin-top: 5px; */
	margin-left: 10px; 
	top: -0.25em;
}
#quickSearch {
	position: absolute;
	right: 0px;
	/* top: 1.4em; */
	/* padding-right: 0.5em; */
	margin-top: -2.5em;
	padding-right: 15px;
}
html.in-iframe #quickSearch {
	margin-top: calc(-2.4em + 1px);
}
#quickSearch button span {
	padding-top: 0px;
	padding-bottom: 0px;
}
#quickSearchText {
	min-width: 120px !important;
	width: 200px !important;
	margin-top: 1px;
}
#normalSearch, #extendedSearch {
	padding: 0.5em;
	border-right: 1px solid #BBB;
	border-bottom: 1px solid #BBB;
	border-left: 1px solid #BBB;
}
#normalSearch {
	border-top: 1px solid #BBB;
}
#extendedButton {
	float: right;
}
.searchColumn {
	display: inline-block; 
	margin-bottom: .25em;
	vertical-align: middle;
	width: 370px;
	position: relative;
}
.searchColumn label {
	width: 100px;
	text-align: left;
	display: inline-block;
	vertical-align: middle;
	margin-left: 15px;
	text-wrap: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.search input {
	width: 236px;
	/* vertical-align: middle; */
	display: table-column;
}
.search input.ui-autocomplete-input:has(+ button) {
	width: 207px;
  	border-radius: 3px 0px 0px 3px;
  	border-right: transparent;
}
.search input.ui-autocomplete-input + button {
	position: absolute;
	right: 9px;
	top: 3px;
}
.searchColumn>button {
	border-radius: 0px 3px 3px 0px;
	height: 21px;
	margin-top: -3px;
	border-color: #5189c0;
}
.search .rangeSearch {
	width: 106.5px;
}
.search select[multiple] {
	display: none;
}

.hint {
	position : absolute;
	width: 300px;
	z-index: 596;
}

#inbox {
	text-align: left;
	width:100%;
	position:relative; 
	float: left;
	height: 100%;
	border-right: 1px solid #CCC;
	font-size: larger;

}

#chartPlace {
	font-size:80px;
	color: green;
	margin-right:75px;

}

iframe.include {
	width: 100%;
	height: 100%;
}

button.expand-iframe {
	float: right;
	font-size: xx-large;
	margin-bottom: -21px;
}

button.expand-iframe + iframe {
	border: 1px solid transparent;
	border-radius: 5px;
	padding-top: 21px;
	
	width: 100%;
	height: auto;
	transition: all 0.5s ease;
	
}

button.expand-iframe:hover + iframe {
	border: 1px dashed #bb5252;
	border-radius: 5px;
	transition: all 0.5s ease;
}

button.expand-iframe.expanded {
	position: fixed;
	top: 5px;
	right: 5px;
	z-index: 1001;
	transition: all .7s ease;
}

button.expand-iframe.expanded + iframe {
	position: fixed;
	top: 0;
	left: 0;
	background: #000d;
	width: calc(100vw - 12px) !important;
	height: 100vh !important;
	z-index: 1000;
	transition: background .7s ease;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 0;
	padding-top: 0px;
}

/* button.expand-iframe + iframe {
}
 */
span.charty{
	background-color: blue;
	font-style: italic;
	margin-left: 5px;
	width: 500px;
	}

iframe {
	border: none;
	padding: 0px;
	margin: 0px;
}

#inbox h3 {
	border-bottom: 1px solid rgba(206, 41, 16, 0.3);
	background: transparent;
	color: gray;
}

#rightMenu {
	width: 300px;
	text-align: right;
	color: white;
	position: absolute;
	right: 0px;
	display: block;
}

#kkksMenu {
	position: absolute;
	right: 0px;
	top: 90px;
}

.uploaded {
	font-weight: bold;
}

#help {
	text-align: left;
}
#help .nav {
	margin-bottom: 20px;
}
#help img {
	border: 1px outset;
}
code {
	font-family: monospace;
	color: gray;
}

.inbox_num {
	position: absolute;
	top: 0;
	right: 0;
	margin-right: 5px;
	margin-top: 5px;
	color: white;
	background-color: #0096A9;
	padding-left: 2px;
	padding-right: 2px;
	border: 1px solid white;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	behavior: url(/pmadashboard/css/pie/PIE.htc);   /*adding functionality to border radius in ie8*/
}

.inboxReport {
	border-bottom: 1px solid AEC879;
}
/* .inboxReportId {
} */
.inboxTime {
	padding: 2px;
	margin: 1px;
}
.inboxSubmitTime {
	padding: 2px;
	margin: 1px;
}
.inboxReportName {
	border-top: 1px solid #99c1f1;
}
/* .inboxReportNo {
}
.inboxReportDesc {
}
.inboxReportInfo {
}
.inboxCompany {
}
.inboxProjectId {
}
.inboxSubject {
} */
.inbox_ijo {
	background: url(../images/circlegreen_kecil.png) top right no-repeat !important;
}
.inbox_kuning {
	background: url(../images/circleYellow_kecil.png) top right no-repeat !important;
}
.inbox_merah {
	background: url(../images/circleRed_kecil.png) top right no-repeat !important;
}



/** VIEW WORKFLOW **/
#view_report_workflow {
	width: 100%;
	max-width: 100%;
	overflow: auto;
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
	text-align: center;
	margin: 5px;
	border: 1px solid #eee;
	
}
#view_report_workflow * {
	white-space: normal;
	width:initial;
}
.wfp {
	width: 100px;
	text-align: center;
	display: inline;
	display: inline-block;
	padding-top: 10px;
	padding-bottom: 10px;
	position: relative;
	vertical-align:top;
}
.wfp_info {
	border: 1px solid #ccc;
	-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,.40);
    -moz-box-shadow:    1px 1px 3px rgba(0,0,0,.40);
  	box-shadow:         1px 1px 3px rgba(0,0,0,.40);	
  	margin-right: 5px;
  	margin-left: 5px;
  	position: relative;
  	width:90px;
	behavior: url(/pmadashboard/css/pie/PIE.htc);   /*adding functionality to box-shadow in ie8*/
	
}
.wfp_info_empty {
	border: 1px solid transparent;
}
/* .wpf_info div {	
} */
.wpf_assignTo {
	white-space: normal;
	word-wrap: break-word;
}
.wfp_current {
	background: url(../images/bintang.png) no-repeat left;
}
.wpf_day:before{
	content: "Hari Ke-";
}
.wfp_START_BLANK {
	background: url(../images/wf_start_normal.png);
}
.wfp_START_GREEN {
	background: url(../images/wf_start_green.png);
}
.wfp_START_YELLOW {
	background: url(../images/wf_start_yellow.png);
}
.wfp_START_RED {
	background: url(../images/wf_start_red.png);
}
.wfp_NORMAL_BLANK {
	background: url(../images/wf_point_normal.png);
}
.wfp_NORMAL_GREEN {
	background: url(../images/wf_point_green.png);
}
.wfp_NORMAL_YELLOW {
	background: url(../images/wf_point_yellow.png);
}
.wfp_NORMAL_RED {
	background: url(../images/wf_point_red.png);
}
.wfp_EMPTY_null {
	background: url(../images/wf_point_empty.png);
}
.wfp_END_BLANK {
	background: url(../images/wf_end_normal.png);
}
.wfp_END_GREEN {
	background: url(../images/wf_end_green.png);
}
.wfp_END_YELLOW {
	background: url(../images/wf_end_yellow.png);
}
.wfp_END_RED {
	background: url(../images/wf_end_red.png);
}
.wfp_point {
	height: 20px;
	background-position: center;
}

#comments {
	padding-left: 10px;
}
.comment {
	width: 100%;
	border-bottom: 1px solid #DDD;
	border-right: 1px solid #DDD;
	border-left: 1px solid #DDD;
	border-top: 1px solid #DDD;
	margin-bottom: 3px;
	position: relative;
	padding: 2px;
}
.commentNo {
	position: absolute;
	height: 100%;
	left: -10px;
	padding-right: 2px;
}
.commentDate {
	position: absolute;
	right: 5px;
}
.commentAuthor {
	display: inline;/* IE */
	display: inline-block;
}
.commentAuthor:before {
	content: "oleh: ";
}
.commentStatus {
	display: inline;/* IE */
	display: inline-block;
	font-weight: bold;
}
.commentText {
	margin-top: 2px;
	padding-top: 2px;
	white-space: pre-wrap;
}

#news ul{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

#news ul li span.date {
	display:block;
	border-bottom: 1px solid #BBB;
}

#news ul li {
	margin-bottom: 10px;
	white-space: pre-wrap;
}

.rank {
	float:right;
	border:1px outset #eee;
	position:relative;

}

.rank h2 {
	margin: 0;
	padding: 0;
}

.rank ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	padding-bottom:10px;
}

.rank ul li {
	padding: 2px;
	padding-left: 5px;
	padding-right: 5px;
}

.rank ul li:hover {
	background: #5189C0;
}

header, nav, section, article, aside, footer, main{ 
   display: block;
}



.no-padding-margin {
	padding: 0px !important;
	margin: 0px !important;
}
#wrapper.no-padding-margin {
	margin-top: .0em !important;
}

.indeterminate-progress {
	background: url("data:image/gif;base64,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") !important;
	width: 100% !important;
	filter: opacity=0.2;
	-ms-filter: opacity=0.2;
	opacity: 0.2;
}

#wfHeaderActionHistory ol {
	list-style: none;
	padding-left: 10px;
}

#wfHeaderActionHistory .changedDate {
	color: #aaa;
}
#wfHeaderActionHistory .webUser {
	color: #A5A327;
}
#wfHeaderActionHistory .description {
	color: #888;
}


#monitor-main {
	width: 100%;
	padding: 0;
	margin: 0;
}
#monitor-main table {
	width: 100%;
}
#monitor-main .monitor {
	width: 49%;
	display: inline-block;
	margin: 0;
	border: 0;
	box-sizing: border-box;
}
#monitor-main .day-column {
	width: 10px;
	padding: 0px;
	cursor:default;
}
#monitor-main .today {
	background-color: orange;
}
#monitor-main .status-column {
	width: 20px;
	padding: 0px;
}
#monitor-main .status-yellow, #monitor-main .status-red, #monitor-main .status-green {
	position: relative;
	padding: 0;
}
#monitor-main .status-yellow span, #monitor-main .status-red span, #monitor-main .status-green span {
	position: absolute;
	width: 100%;
	height: 100%;
}
#monitor-main .status-yellow span {
	background-color: transparent;
	background: url(../images/circleYellow_kecil.png) center center no-repeat;
}
#monitor-main .status-green span {
	background-color: transparent;
	background: url(../images/circlegreen_kecil.png) center center no-repeat;
}
#monitor-main .status-red span {
	background-color: transparent;
	background: url(../images/circleRed_kecil.png) center center no-repeat;
}

#monitor-main .state-cell {
	margin: 0px;
	margin-top: 2px;
	margin-bottom: 2px;
	padding: 0px;
	padding-top:2px;
	padding-bottom:2px;
	border-right: 1px solid white;
	position: relative;
}

#monitor-main .state-cell div {
	width:100%;
	height: 65%;
	background-color: #AAA;
	margin-top: .1em;
	position: absolute;
}

#monitor-main .state-cell div:hover {
	background-color: #CCC;
	border: 1px solid #AAA;
	cursor: pointer;
}

.is-ie img {
	border: none;
}

.validation-invalid * {
	color: red;
}

#navbtn {
	display: none;
}
@media (max-width: 1000px) {
	#left {
		display: none;
	}
  
	#content.withLeft {
		margin-top: 5px;
		margin-right: 0px;
		margin-left: 0px;
		background-color: white;
		border: 0px;
		padding-bottom: 0px;
	}
}
@media (max-width: 803px) {
	#nav {
		position: absolute;
		width: 68px;
		background-color: white;
		border: 1px solid gray;
		box-shadow: 3px 3px 5px #aaa;
		top: 66px;
		display: none;
	}
	#navbtn {
		display: block;
	}
	
	ul.dropdown ul {
		top: 20% !important;
		left: 50% !important;
	}
}

@media print {
	* {
		font-size: 9px !important;
		line-height: 1 !important;
		padding: 0 !important;
		margin: 0 !important;
	}
	.textarea-value {
		height: auto !important;
		vertical-align: middle;
	}
	div.listTableScrollTop {
		display:none
	}
	#FuppPreview .form-actions {
		display: none;
	}
	#FuppPreview th, #FuppPreview td {
		font-size: 7px !important;
	}
	#FuppPreview input, #FuppPreview textarea, #FuppPreview select, #FuppPreview .value {
		border: 0;
	}  
}

span.value.form-attachment a {
    white-space: nowrap; overflow: hidden; max-width: 100%;
}

.m2-hidden {
	display: none;
}
body.m2 .m2-hidden {
	display: block;
}

/*  {
    list-style-type: none;
} */

#left ul {
    padding-left: 0px;
    list-style-type: none;
}

.searchButton .ui-button-text {
    margin-right: 0px;
}

.ui-dialog-content {
	line-height: 2em;
}

/* .ui-state-highlight.ui-corner-all.messageWrapper {
    padding: .7em;
} */

/* a.button.many-add {} */

.rfNotification, .k-notification-error {
	display: none !important;
}

.messageWrapper {
	list-style-type: none;
}

/* div.messageWrapper {
	padding: .7em;
} */

#summary .ui-accordion-header {
    background: #5189C0;
    height: 1.7em;
    padding-top: .4em;
    padding-left: 30px;
    font-weight: bold;
}

span.ui-button-text.ui-buttonset {
    margin-right: 0;
}

#quickSearch span.ui-buttonset {
    margin-right: 0px;
}

#InputBulananSubmit #mainTable ul {
    margin: 0;
    padding-left: 1em;
}

#quickSearch.normalSearchShown {
    margin-top: -2em;
}

html.in-iframe #quickSearch.normalSearchShown {
  margin-top: calc(-1.9em + 1px);
}

input[type=submit] {
    color: #36C;
    padding: 0.5em 1em;
    display: inline-block;
    position: relative;
    margin-right: .1em;
    border-radius: 4px;
    border: 1px solid #d3d3d3;   background: #e6e6e6 url(../images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
}

.textarea {
    width: 100%;
}

.button_hijau {
    width: 115px;
    background-color: #4CAF50; /* Green */
    border: 1px solid #4CAF50;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    border-radius: 4px;
    transition-duration: 0.4s;
}

.button_hijau:hover {
    width: 115px;
    background-color: white; /* Green */
    border: 1px solid #4CAF50;
    color: #4CAF50;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    border-radius: 4px;
}

.button_kuning {
    width: 115px;
    background-color: Orange; /* Green */
    border: 1px solid Orange;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    border-radius: 4px;
    transition-duration: 0.4s;
}

.button_kuning:hover {
    width: 115px;
    background-color: white; /* Green */
    border: 1px solid Orange;
    color: Orange;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    border-radius: 4px;
}

.button_merah {
    width: 115px;
    background-color: red; /* Green */
    border: 1px solid red;
    color: white;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    border-radius: 4px;
    transition-duration: 0.4s;
}

.button_merah:hover {
    width: 115px;
    background-color: white; /* Green */
    border: 1px solid red;
    color: red;
    padding: 5px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    border-radius: 4px;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
	background: #5189C0;
	font-weight: normal;
	color: white;
}

/* export form */
.export-form label {
  padding: 0px 5px;
  display: block;
}
.export-form input {
  margin-right: 5px;
}

/* LOADING */

.loading-span {
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    margin-bottom: .1em;
    animation: horizontal-move 1s linear infinite;
}

.loading-circle {
    display: inline-block;
	border: 1px solid #f3f3f3; /* Light grey */
	border-top: 1px solid #3498db; /* Blue */
	border-radius: 50%;
    width: 0.5em;
    height: 0.5em;
    margin-bottom: .1em;
    animation: spin 1s linear infinite;
}

@keyframes horizontal-move {
    0% { transform: translateX(-0.25em); background-color: #e41f1b; }
    50% { transform: translateX(0.25em); background-color: #c6d002; }
    100% { transform: translateX(-0.25em); background-color: #e41f1b; }
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

.ui-autocomplete-loading {
  position: relative; /* Allows the pseudo-element to position relative to this element */
}

/* Create a spinner using the ::after pseudo-element */
.ui-autocomplete-loading::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px; /* Adjust this value to control the horizontal placement */
  width: 16px; /* Spinner size */
  height: 16px;
  margin-top: -8px; /* Centers the spinner vertically */
  border: 2px solid #ccc;       /* Base color for the spinner */
  border-top-color: #333;       /* Color for the animated segment */
  border-radius: 50%;           /* Makes it a circle */
  animation: spin 0.7s linear infinite;  /* Applies the spin animation */
}


/* Apply loading spinner to empty divs */	
.ui-tabs-panel:empty::before, iframe.loading::before {
	 content: '';
	 display: block;
	 width: 60px;
	 height: 60px;
	 border: 16px solid #f3f3f3; /* Light grey */
	 border-top: 16px solid #3498db; /* Blue */
	 border-radius: 50%;
	 animation: spin 2s linear infinite;
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 margin: 0 auto; /* Center horizontally */
}

.ui-tabs-panel:empty, iframe.loading {
	position: relative;
	min-height: 100px;
	width: 100%;
}

html.loading {
	background-image:url(../images/logo.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:80%;
	background-color:gray; 
}

html.loading::before {
	 content: '';
	 display: block;
	 width: 60px;
	 height: 60px;
	 border: 16px solid #f3f3f3; /* Light grey */
	 border-top: 16px solid #3498db; /* Blue */
	 border-radius: 50%;
	 animation: spin 2s linear infinite;
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 margin: 0 auto; /* Center horizontally */
}	

.text-striked {
	text-decoration: line-through;
}

/***** HACKS *****/
#WarehouseManagementDetail table {
	table-layout: auto;
}
table:has(input[name="item.jangkaTahun"]):not(:has(table)) {
	table-layout: auto;
}

/* Test Evatek */
#ProclistEvatekForm table style{
	table-layout: auto;
}
#ProclistEvaharForm table style{
	table-layout: auto;
}
#ProclistNegosiasiForm table style{
	table-layout: auto;
}

.form #ProclistEvatekForm table {
    table-layout: auto;
}

.form #ProclistEvaharForm table {
    table-layout: auto;
}

.form #ProclistNegosiasiForm table {
    table-layout: auto;
}

.form #ProclistEvatekForm table .element-container {
    width: 200px;
}
/*
.form #ProclistEvaharForm table .element-container {
    width: auto;
}

.form #ProclistEvaharForm table .element-container {
    width: auto;
}

.form #ProclistNegosiasiForm table .element-container {
    width: 200px;
}*/

/* Test Inventory Marketplace */
#InventoryMarketplacePengajuan table style{
	table-layout: auto;
}
	
/*.form #InventoryMarketplacePengajuan table .element-container {
    width: 200em;
}

.form #InventoryMarketplacePengajuan table label-container {
    width: 200em;
}
*/
.form #InventoryMarketplacePengajuan table tr td.element-container:has(div[role~="combobox"]) {
	width: auto;
}

/*--<<<<<<< HEAD*/
/* Dikomen dlu aja, saya lupa ini yang mana :D */
/*
input#form\.item\.tanggal {
    width: 315%;
}

input#form\.item\.transferAsetNo {
    width: 315%;
}

input#form\.item\.ars {
	width: 315%;
}

a#form-attachment-COVER-upload {
    margin-right: calc(100% - 83px) !important;
}

a#form-attachment-COVER-reset {
    margin-right: calc(100% - 175px) !important;
*/
    
/*=======*/
/* Test Realisasi TKDN */
/* Override only for the specific form */
#LaporanTambahanRealisasiPencapaianTKDNV2.form td.element-container[style] div[role~="combobox"] {
    width: auto !important;
}


#mainTable {
  table-layout: auto;
}

#summary {
  width: 100%;
}

#LaporanBulananAsetSubmit > table:nth-child(1) {
  width: 100%;
}

#mainTable > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(3) {
  padding-left: 20px;
/*>>>>>>> branch 'main' of http://gitlab.sharingvision.com/si-prs/be.git*/
}


.form #ProclistEvaharForm table tr td.element-container {
	width: auto;
}

/*
.form #ProclistEvaharForm table tr td.element-container:has(div[role~="combobox"]) {
	width: auto;
}*/

#InputMouSubmit table.wwFormTable {
	width: 99%;
}

#InputExcessMaterialSubmit table.wwFormTable {
	width: 99%;
}

#LaporanKontrakDetailRigAction > table > tbody > tr:nth-child(1) > td > div > table > tbody > tr:nth-child(30) > td:nth-child(2) > div > table > tbody > tr > td {
	text-align: -webkit-right;
}

#form\.item\.dk_totalContractValue {
	width: 30.7%;
}

#LaporanKontrakDetailVesselAction > table > tbody > tr:nth-child(1) > td > div > table > tbody > tr:nth-child(46) > td:nth-child(2) > div > table > tbody > tr > td {
	text-align: -webkit-right;
}

#form\.item\.dkTotalQuotation {
	width: 30.7%;
	margin-left: 68%;
}

#DashboardSubscriptionForm>table {
	table-layout: auto;
}