.details {
	display: flex;
	flex-wrap: wrap;
	position: relative;
}
.details .sidebar {
	background: #006e8c;
	/* box-shadow: 1px 2px 2px #444; */
	position: relative;
	z-index: 10;
}
.details .head {
	display: flex;
}
.details .head .title-box {
	padding: 10px 20px;
	width: 85%;
	background: #fafafa;
}
.details .head .title-box img {
	max-width: 80px;
	float: left;
}
.details .head .title-box .desc {
	padding: 10px 0 0 10px;
}
.details .head .title-box .desc h1 {
	color: #006e8c;
	font-size: 24px;
}
.details .head .title-box .desc .location {
	background: #fefce0;
	border: 1px solid #aa671d;
	padding: 3px 20px;
	border-radius: 20px;
	font-size: 12px;
	display: inline-block;
	margin: 0 0 5px 0;
}

.details .head .right-box {
	width: 15%;
	background: #d4e3fc;
	position: relative;
}
.details .head .right-box .valid {
	display: block;
	background: #006e8c;
	color: #fff;
	text-align: center;
	padding: 3px 7px;
}
.details .head .right-box .valid.closed {
	background: #ff3823;
}
.details .head .right-box .pos {
	font-size: 50px;
	text-align: center;
	display: block;
	line-height: 50px;
	padding: 15px 0;
}
.details .head .right-box .pos.closed span {
	color: #ff0000;
	border: 1px solid #ff0000;
	display: inline-block;
	padding: 5px;
	border-radius: 5px;
}
.details .head .right-box .pos span {
	font-size: 18px;
	line-height: 18px;
	display: block;
}
.details .status {
	margin: 10px;
}
.details .status span {
	padding: 10px 10px 10px 50px;
	background-repeat: no-repeat;
	background-position: 10px 50%;
	display: block;
	background-size: 30px;
	color: #fff;
}
.details .status span.lolos {
	background-image: url('../employer/images/pass-bg.png');
	background-color: #9bbb59;
	border: 1px solid #7a9149;
}
.details .status span.tidak-lolos {
	background-image: url('../employer/images/failed-bg.png');
	background-color: #c0504d;
	border: 1px solid #9d4542;
}

.details .sidebar .menu {}
.details .sidebar .menu > ul {
	margin: 0;
	list-style: none;
}
.details .sidebar .menu ul span {
	display: block;
	padding: 5px 10px;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	font-weight: 600;
	text-shadow: 0 1px 1px #444;
	font-size: 12px;
}
.details .sidebar .menu > ul > li {
	display: block;
	position: relative;
}
.details .sidebar .menu > ul > li > a {
	display: block;
	width: 100%;
	height: 65px;
	background-repeat: no-repeat;
	background-position: 50%;
	border: 1px solid #025e77;
	background-size: auto;
}
.details .sidebar .menu > ul > li > a:hover,
.details .sidebar .menu > ul > li > a.active {
	background-color: #008db1;
}
.details .sidebar .menu > ul > li > a.share {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/icon-share.png');
}
.details .sidebar .menu > ul > li > a.download {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/icon-download-pdf.png');
	background-color: #e8e8e8;
	border: 1px solid #e8e8e8;
}
.details .sidebar .menu > ul > li > a.download:hover {
	background-color: #dfdddd;
}
.details .sidebar .menu > ul > li > a.fb {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/facebook.png');
}
.details .sidebar .menu > ul > li > a.twitter {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/twitter.png');
}
	
.details .sidebar .menu > ul > li > a.g-plus {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/gplus.png');
}
.details .sidebar .menu > ul > li > a.linkedin {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/in.png');
}
.details .sidebar .menu > ul > li > a.whatsapp {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/whatsapp.png');
}
.details .sidebar .menu > ul > li.download {

}

/* .details .sidebar .menu ul ul {
	margin: 0;
	position: absolute;
	list-style: none;
	margin: 0;
	left: 99%;
	background: #008db1;
	z-index: 10;
	top: 0;
	box-shadow: 2px 2px 2px #777;
	display: none;
}
.details .sidebar .menu ul ul span {
	display: block;
	padding: 5px 10px;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	font-weight: 600;
	text-shadow: 0 1px 1px #444;
}
.details .sidebar .menu ul ul li {}
.details .sidebar .menu ul ul li a {
	display: block;
	width: 100%;
	height: 50px;
	background-repeat: no-repeat;
	background-position: 50%;
	border-top: 1px solid #036f8a;
}
.details .sidebar .menu ul ul li a:hover {
	background-color: #00c8f8;
}
.details .sidebar .menu ul ul li a.fb {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/facebook.png');
}
.details .sidebar .menu ul ul li a.twitter {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/twitter.png');
}
	
.details .sidebar .menu ul ul li a.g-plus {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/gplus.png');
}
.details .sidebar .menu ul ul li a.linkedin {
	background-image: url('../../../themes/rekrutmen_pln/images/icons/in.png');
} */
@media only screen and (max-width:768px) {
	.details .sidebar.share-box {
		position: absolute;
		bottom: 0;
	}
}
.details .prolog {
	font-size: 13px;
/* 	border-bottom: 1px solid #d4e3fc; */
	padding: 20px 20px 0 20px;
}
.details .pos-title {}
.details .pos-title h4 {
	font-size: 18px;
	line-height: 24px;
	padding: 20px 20px 0 20px;border-top: 1px solid #ccc; margin: 40px 0 0 0;
}
.details .content-box {

}
.details ul.jenjang {margin: 20px;list-style: none;border-bottom: 2px solid #006e8c;padding: 0 10px;}
.details ul.jenjang li {float: left;}
.details ul.jenjang li a {display: block;padding: 10px;font-size: 18px;min-width: 120px;text-align: center;text-decoration: none;border: 1px solid #ddd;border-bottom: none;background: #f4f4f4;}
.details ul.jenjang li a:hover {
	border: 1px solid #006e8c;border-bottom: none;
}
.details ul.jenjang li a.active {background: #006e8c;color: #fff;border: 1px solid #006e8c;border-bottom: none;}
.details .jenjang-box {
	display: none;
	padding: 0 30px;
}
.details .jenjang-box.active {
	display: block;
}
.details .infolabel {
	background: #fafafa;
	border: 1px solid #d4e3fc;
	margin: 20px;
	padding: 10px 20px;
	display: flex;
	flex-wrap: wrap;
	position: relative;
}
.details .infolabel > div {
	width: 45%;
	padding: 0 10px;
}
.details .infolabel .apply-btn-box {width: 10%;position: absolute;right: 10px;top: 20px;}
.details .infolabel .apply-btn-box span.closed {
	color: #ff0000;
	border: 1px solid #ff0000;
	display: inline-block;
	padding: 5px;
	border-radius: 5px;
	text-align: center;
}
.details .infolabel .apply-btn-box a {}
.details .infolabel > div.full {
	width: 100%;
}
.details .infolabel label {
	float: left;
	font-size: 12px;
	width: 130px;
}
.details .infolabel label:after {
	content: ":";
	float: right;
}
.details .infolabel ul {
	margin: 0;
	list-style: none;
	padding: 0 0 0 140px;
}
.details .infolabel ul li {
	font-size: 12px;
}
.details .infolabel ul ul {
	padding: 0;
}
.details .infolabel ul ul li {}
.details .bottom-box {
	text-align: center;
	margin: 20px;
	padding: 20px 0;
}
.details .message-box {
	padding: 20px;
	border-top: 1px solid #d4e3fc;
	border-bottom: 1px solid #d4e3fc;
	background: #fafafa;
}
.details .message-box h4 {}
.details .message-box p {
	margin: 5px 0 10px 0;
}
.details .message-box div {
	margin: 7px 0;
}
.details .bottom-box {
	border-top: 1px solid #d4e3fc;
}
.details .bottom-box .button {
	display: inline-block;
	font-size: 18px;
	text-transform: uppercase;
	line-height: 24px;
}
.details .bottom-box .requirement {
	position: absolute;
	right: 0;
	font-size: 12px;
	margin: 10px 0 0 0;
}
.details .text-content {
	padding: 20px;
	line-height: 24px;
}
.details .text-content * {
	line-height: 24px;
}
.details .text-content p {}
.details .text-content ul {
	margin: 10px 0 10px 40px;
}
.details .text-content ul li {
	margin: 0 0 5px 0;
}
.details .text-content ul.info li label {
	float: left;
	width: 120px;
}
.details .text-content ul.info li label:after {
	content: ":";
	float: right;
}
.details .text-content ul.info li span {
	padding: 0 0 0 130px;
	display: block;
}
.details .text-content ul.info li a {}
.details .pdf-box {
	padding: 20px;
	min-height: 1400px;
}
.details .pdf-box object {
	min-height: 1400px;
}
/* Dialog */
.dialog .apply-box span.date {
	color: #006e8c;
	font-size: 24px;
	line-height: 24px;
	display: block;
}
.dialog .apply-box span.location {
	background: #fefce0;
	border: 1px solid #aa671d;
	padding: 3px 20px;
	border-radius: 20px;
	font-size: 12px;
	display: inline-block;
}
.details .text-content .grid-view .summary {
	display: block;
	background: #d4e3fc;
	text-align: right;
	padding: 7px 10px;
	margin: 10px 0 0 0;
	border: 1px solid #d4e3fc;
}
.details .text-content .grid-view table.items {
	border: 1px solid #d4e3fc;
	background: #fafafa;
}
.details .text-content .grid-view table.items thead tr {
}
.details .text-content .grid-view table.items thead tr th {
	padding: 7px;
	background: #00c8f8;
}
.details .text-content .grid-view table.items thead tr th a {
	color: #444;
	text-decoration: underline;
}
.details .text-content .grid-view table.items thead tr.filters {
}
.details .text-content .grid-view table.items thead tr.filters td {
	padding: 7px;
}
.details .text-content .grid-view table.items thead tr.filters td input[type="text"]{
	width: 100%;
}
.details .text-content .grid-view table.items tbody tr {
	border-top: 1px solid #d4e3fc;
}
.details .text-content .grid-view table.items tbody tr.odd {
	background: #fff;
}
.details .text-content .grid-view table.items tbody tr td {
	padding: 7px;
	vertical-align: top;
}
.details .text-content .grid-view table.items tbody tr td img {
	display: inline-block;
}
.details .text-content .grid-view table.items tbody tr td.button-column {
	min-width: 95px;
	text-align: center;
}
.details .text-content .grid-view table.items tbody tr td.button-column a {
	width: 20px;
	height: 20px;
	font-size: 0;
	display: inline-block;
	margin: 0 2px;
}
.details .text-content .grid-view table.items tbody tr td.button-column a.view {
	background: url('images/view.png') 50% 50% no-repeat;
}
.details .text-content .grid-view table.items tbody tr td.button-column a.update {
	background: url('images/update.png') 50% 50% no-repeat;
}
.details .text-content .grid-view table.items tbody tr td.button-column a.delete {
	background: url('images/delete.png') 50% 50% no-repeat;
}
.details .text-content .grid-view table.items tbody tr td.button-column a.download {
	background: url('images/download.png') 50% 50% no-repeat;
}
.details .text-content .grid-view table.items tbody tr td.button-column a img {
	max-width: 95%;
}
/* =Responsive
-------------------------------------------------------------- */
/* Resolution 1280 */

@media only screen and (max-width:1280px) {}
/* Resolution 1024 */

@media only screen and (max-width:1024px) {
}
/* Resolution 768 */

@media only screen and (max-width:768px) {
	.details .sidebar .menu > ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.details .sidebar .menu > ul span {
		width: 100%;
	}
	.details .sidebar .menu > ul > li {
		width: 15%;
	}
	.details .sidebar .menu > ul > li.download {
		width: 100%;
	}
	.details .sidebar .menu > ul > li > a {
		/* width: 40px; */
		height: 40px;
		background-size: 20px;
	}
	.details .sidebar .menu > ul > li > a.download {
		background-image: url('../../../themes/rekrutmen_pln/images/icons/icon-download-pdf-mob.png');
		background-size: auto 30px;
	}
	.details .infolabel > div {
		width: 100%;
	}
	.details .bottom-box .requirement {
		position: relative;
		display: block;
	}
	.details .head .title-box .desc h1 {
		font-size: 16px;
		line-height: 20px;
	}
	.details .head .right-box .pos span,
	.details .head .right-box .pos {
		font-size: 14px;
		line-height: 16px;
	}
	.details .head .right-box .pos span {
		text-overflow: ellipsis;
		overflow: hidden;
		padding: 2px;
	}
}
/* Resolution 600 */

@media only screen and (max-width:640px) {}
/* Resolution 480 */

@media only screen and (max-width:480px) {
}
/* Resolution 320 */

@media only screen and (max-width:320px) {}



.details .text-content .batch {
	margin: 20px 0 0 0;
}
.details .text-content .batch ul {
	list-style: none;
	margin: 0;
}
.details .text-content .batch ul li {
	float: left;
	padding: 0;
	position: relative;
}
.details .text-content .batch ul li span.counter {
	position: absolute;
	background: #ff0000;
	padding: 1px 8px;
	line-height: 18px;
	color: #fff;
	text-align: center;
	top: -10px;
	right: 5px;
	border-radius: 5px;
	font-size: 11px;
}
.details .text-content .batch ul li a {
	display: block;
	padding: 7px 30px 7px 10px;
	background: #00c8f8;
	color: #006e8c;
	border-right: 1px solid #fff;
}
.details .text-content .batch ul li a.active {
	background: #006e8c;
	color: #fff;
}