@import url(//fonts.googleapis.com/css?family=Open+Sans:400,700,700italic,400italic);
@import url(//fonts.googleapis.com/css?family=Cuprum:400,400italic,700,700italic);
:root {
  --bg-body-image-url:url("./_bodyBackground.webp");
  --primary-color:#014A31;
  --primary-color-a:#01563B;
  --primary-color-b:#016347;
  --accent-color:#4B3E49
}
#headerTitle,
#navbar {
  width:1020px
}
#header {
  background-color:transparent;
  padding-bottom:40px
}
#navbar {
  background-color:var(--primary-color);
  background-repeat:repeat-x;
  border:0;
  height:40px;
  margin-bottom:10px;
  margin-left:0!important;
  padding:0;
  text-align:left
}
#navbar ul {
  margin:0;
  padding:0 0 0 10px
}
#navbar ul li {
  float:left;
  margin:0;
  padding:0
}
#navbar a,
#navbar a:link,
#navbar a:visited {
  color:#fff;
  display:inline-block;
  font-size:.6em;
  font-weight:700;
  line-height:40px;
  margin:0;
  padding-left:10px;
  padding-right:10px
}
#navbar a::after,
#navbar a::before {
  content:"";
  display:block;
  height:30px;
  position:absolute;
  top:5px;
  width:1px
}
#navbar a::before {
  background:-moz-linear-gradient(center top,rgba(0,0,0,0),#000,rgba(0,0,0,0)) rgba(0,0,0,0);
  margin-left:-10px;
  opacity:.15
}
#navbar a::after {
  background:-moz-linear-gradient(center top,rgba(255,255,255,.01),#fff,rgba(255,255,255,.01)) rgba(0,0,0,0);
  margin-left:-9px;
  opacity:.35
}
#navbar li:first-child a::after,
#navbar li:first-child a::before {
  background-color:#000;
  display:none
}
#navbar a:hover {
  background:#fec73f;
  background:linear-gradient(0deg,#fec73f 0,#7ecb29 100%);
  text-shadow:1px 1px var(--primary-color)
}
#body,
#header,
#main,
#navbar,
#sidebar {
  display:inline-block!important
}
#header,
#main,
#navbar,
ul.sidemenu li:before {
  display:none
}
#body,
#main,
body {
  background-color:#fff
}
#additionalHomeContent,
#announcementsHome,
#navbar {
  clear:both
}
#container,
#headerTitle {
  margin:0 auto
}
#announcements,
#container {
  width:auto
}
#body,
#container,
#headerTitle,
#headerTitle img,
.banner-img,
.indexers a,
.intro {
  display:inline-block
}
body {
  color:#333;
  font-family:'Open Sans',sans-serif;
  font-size:18px
}
a:active,
a:link,
a:visited {
  color:var(--primary-color-b);
  text-decoration:none
}
#navbar a:active,
a:hover {
  background:rgba(0,0,0,0);
  text-decoration:underline
}
#container {
  background-image:var(--bg-body-image-url);
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
  background-size:cover;
  min-width:730px!important;
  text-align:center
}
#header h1 {
  color:#111;
  font-family:Georgia,"Times New Roman",Times,serif;
  font-size:1.4em;
  font-weight:400;
  letter-spacing:1px;
  line-height:120px;
  padding:0;
  text-shadow:1px 1px #fff
}
#headerTitle img {
  float:left;
  margin-right:20px
}
#body {
  margin:-40px auto 0;
  width:1020px!important;
  padding-bottom:20px;
  display:none
}
#main,
ul.sidemenu li {
  padding:0
}
#main {
  float:left;
  margin-left:0;
  margin-right:0!important;
  overflow:visible!important;
  position:relative;
  width:795px
}
#content h1,
#content h2,
#content h3,
#content h4,
#main>h2 {
  color:var(--primary-color-a);
  font-family:Cuprum,sans-serif;
  font-weight:700
}
#content {
  border-top:0 dotted #000
}
ul.sidemenu li a,
ul.sidemenu li:first-child a {
  border-top:1px solid var(--primary-color)
}
ul.sidemenu {
  padding-left:0!important;
  margin:-10px -10px 0
}
ul.sidemenu li a {
  background:var(--primary-color);
  border-bottom:1px solid var(--primary-color-b);
  color:#fff;
  display:block;
  padding:.66em 10px .6em 13px;
  text-decoration:none;
  font-weight:700
}
#leftSidebar {
  display:none;
  border-right:1px solid #ccc;
  float:left;
  width:0
}
ul.sidemenu li:last-child a {
  border-bottom:0
}
ul.sidemenu li a:hover {
  background:#fec73f;
  background:linear-gradient(90deg,#fec73f 0,#7ecb29 100%)
}
#breadcrumb {
  margin:0 20px;
  padding:.7em 0;
  border-bottom:1px dotted #333
}
#content,
#main>h2 {
  padding-left:20px;
  padding-right:20px
}
#cpr {
  border:0 #fff
}
#leftSidebar,
#rightSidebar {
  font-size:.68em;
  height:100%;
  margin-left:0;
  margin-right:0;
  overflow:hidden;
  padding:50px 10px 10px
}
#rightSidebar {
  border-left:1px solid #ccc;
  float:right;
  width:200px;
  background:0 0
}
#leftSidebar div.block,
#rightSidebar div.block {
  border:0;
  color:inherit;
  padding:0 0 10px;
  margin-bottom:10px
}
#leftSidebar div.block span.blockTitle,
#rightSidebar div.block span.blockTitle,
#sidebarDevelopedBy.block,
#sidebarHelp.block {
  color:#fff;
  display:block;
  letter-spacing:0;
  margin-bottom:10px;
  background:var(--primary-color);
  padding:.4em 10px!important;
  text-transform:uppercase
}
#sidebarDevelopedBy.block a,
#sidebarHelp.block a {
  color:#fff;
  text-transform:uppercase;
  text-decoration:underline
}
#content h4 a,
input[type=button],
input[type=submit],
table.tocArticle a {
  text-decoration:none
}
.block p {
  margin:0!important
}
#homepageImage,
.banner-img,
div.thickSeparator {
  margin-bottom:10px
}
.block ul {
  list-style:none;
  padding-left:1.2em
}
.block li:before {
  content:"\00BB";
  display:block;
  height:0;
  left:-1em;
  position:relative;
  width:0
}
#sidebarFontSize.block {
  padding-bottom:35px!important
}
.color1-light,
table.tocArticle:nth-child(odd) tr {
  background-color:#f0f0ff
}
.color-grey-light,
table.tocArticle:nth-child(2n) tr {
  background-color:#f4f4f4
}
.color2-light,
table.tocArticle tr:hover {
  background-color:#ffedcc
}
table.tocArticle td {
  padding:10px 10px
}
.tocTitle {
  font-weight:700
}
td.tocGalleys {
  padding-right:10px
}
#content ul.menu {
  margin:0
}
#content ul.menu li {
  background-image:linear-gradient(to bottom,#2651ff 0,#4f72ff 100%);
  background-repeat:repeat-x;
  border-radius:3px;
  padding:5px 8px
}
#content ul.menu li.current,
#content ul.menu li:hover {
  background-image:linear-gradient(to bottom,#ec790f 0,#f28c31 100%);
  background-repeat:repeat-x
}
#content ul.menu a {
  color:#fff
}
#content ul.menu a:hover {
  color:#ff0
}
input.textField,
input.uploadField,
select.selectMenu,
textarea.textArea {
  background-color:#f1f1f1;
  border:1px solid #aaa;
  color:#444;
  padding:.3em
}
input.textField:focus,
input.uploadField:focus,
select.selectMenu:focus,
textarea.textArea:focus {
  border:1px solid #0d355e
}
input[type=button],
input[type=submit] {
  background-image:linear-gradient(to bottom,#ddd 0,#c4c4c4 100%);
  background-repeat:repeat-x;
  border:1px solid #9d9d9d;
  border-radius:2px;
  color:#444;
  padding:3px 5px;
  text-shadow:1px 1px #f6f6f6
}
input[type=button]:hover,
input[type=submit]:hover {
  background-image:linear-gradient(to bottom,#c4c4c4 0,#aaa 100%);
  background-repeat:repeat-x;
  cursor:pointer;
  text-decoration:none
}
input.defaultButton {
  color:#2b2b2b;
  font-weight:700
}
div.separator {
  border-bottom:1px dotted #222
}
.banner-img:hover {
  opacity:.7
}
.indexers {
  margin:10px 0
}
.indexers a {
  border:2px solid transparent;
  padding:5px 3px
}
.indexers a:hover {
  background:0 0;
  border:2px dotted navy;
  opacity:.75
}
.indexers a img {
  height:38px
}
a img {
  border:0
}
span.highlight {
  background-color:#ffff80
}
.intro {
  background-color:#fff2db;
  border:1px dotted Orange;
  padding:10px
}
.intro ul {
  margin:0;
  padding-left:1em
}
.highlight {
  background-color:ivory;
  border:1px dashed #ffa851;
  padding-bottom:6px;
  padding-top:6px
}
.issueCoverImage {
  border:1px solid #fff;
  margin:0;
  padding:0
}
.issueCoverImage img {
  border:0 solid #fff;
  box-shadow:4px 4px 6px #aaa;
  margin:1em 2em 1em 0;
  width:100px
}
.cover-image-intro {
  border:1px solid #eee;
  box-shadow:1px 1px 12px #ccc;
  margin:0 0 0 1em;
  width:100px
}
.color-box {
  display:block;
  float:left;
  height:40px;
  margin-right:5px;
  width:60px
}
.color1 {
  background-color:#0d355e
}
.color2 {
  background-color:Orange
}
#journalDescription {
  float:left;
  width:60%
}
#homepageImage {
  float:right;
  width:38%
}
#homepageImage img {
  height:auto;
  max-width:100%;
  margin-top:-1em
}
#setupForm #homepageImage,
#setupForm #journalDescription {
  width:100%
}
#setupForm #homepageImage img {
  margin-left:0;
  margin-top:0
}
.articleDOI,
.tocAuthors,
.tocDOI {
  margin-top:4px;
  padding-left:0px
}
#setupForm .uploadField {
  width:400px!important;
  margin-right:10px;
  float:left!important
}
#sidebar {
  float:right
}
.articleDOI,
.tocDOI {
  background:url(./icon-doi.png) 1px 2px no-repeat rgba(0,0,0,0)
}
.tocAuthors {
  background:url(./icon-group.png) 1px 2px no-repeat rgba(0,0,0,0);
  font-style:italic;
  padding-bottom:5px
}
.tocGaleyPdf {
  background:url(./icon-pdf.png) top right no-repeat;
  height:20px;
  width:24px;
  display:inline-block;
  float:right
}
.tocGaleyFile {
  background:url(./icon-file.png) top right no-repeat;
  height:20px
}
span.blockTitle {
  font-weight:700
}
input#simpleQuery {
  width:190px
}
select#searchField {
  width:199px
}
#sidebar input.textField {
  width:-webkit-fill-available
}
#sidebar input[type=button],
#sidebar input[type=submit] {
  margin-top:5px;
  width:199px
}
#body,
#headerTitle {
  box-shadow:0 0 10px rgba(0,0,0,.25)
}


/* =========================================================
   OJS 2.4.8.4
   ARTICLE PAGE - FINAL CLEAN STYLE
   ========================================================= */


/* =========================================================
   1. ARTICLE TITLE
   ========================================================= */

#articleTitle {
	margin: 8px 0 10px;
	padding: 0;
}

#articleTitle h3 {
	color: #014A31 !important;
	font-family: inherit !important;
	font-size: 24px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	letter-spacing: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	text-align: left;
}


/* =========================================================
   2. AUTHORS
   ========================================================= */

.articleAuthors {
	margin: 4px 0 9px;
	padding: 0;
}

.authorRow {
	color: #333;
	font-size: 13px;
	line-height: 1.55;
	margin: 0;
	padding: 0;
}

.authorRow strong {
	color: #333;
	font-weight: 700;
}

.authorAffiliation {
	color: #555;
	font-size: 11px;
}

.correspondingAuthor {
	color: #555;
	font-size: 10px;
	line-height: 1.4;
	margin-top: 2px;
}

.countryFlag {
	display: inline-block;
	height: auto !important;
	max-height: 14px;
	width: auto !important;
	margin-left: 4px;
	vertical-align: middle;
}


/* =========================================================
   3. CHECK FOR UPDATES / CROSSMARK
   ========================================================= */

.crossmarkArticle {
	margin: 5px 0 8px;
}

.crossmarkArticle img {
	max-width: 150px;
	height: auto;
}


/* =========================================================
   4. ABSTRACT
   ========================================================= */

#articleAbstract {
	background: #e7f6fc;
	border: 1px solid #d3e9f1;
	border-left: 5px solid #087a58;
	border-radius: 0 8px 8px 0;
	box-sizing: border-box;
	margin: 10px 0 8px;
	padding: 0;
	width: 100%;
}


/* Abstract title */

#articleAbstract h4 {
	color: #014A31 !important;
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	margin: 0 !important;
	padding: 11px 14px 5px !important;
}


/* Abstract text */

#articleAbstract > div {
	color: #333;
	font-size: 11.5px !important;
	line-height: 1.6 !important;
	margin: 0 !important;
	padding: 5px 14px 12px !important;
	text-align: justify !important;
	text-justify: inter-word;
}


/* =========================================================
   5. KEYWORDS
   ========================================================= */

#articleSubject {
	background: #f1f8f4;
	border: 1px solid #dce9e1;
	border-left: 5px solid #d5a33b;
	border-radius: 0 8px 8px 0;
	box-sizing: border-box;
	margin: 8px 0 12px;
	padding: 0;
	width: 100%;
}


/* Keywords title */

#articleSubject h4 {
	color: #014A31 !important;
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	margin: 0 !important;
	padding: 10px 14px 4px !important;
}


/* Keywords text */

#articleSubject > div {
	color: #444;
	font-size: 11px !important;
	line-height: 1.5 !important;
	margin: 0 !important;
	padding: 4px 14px 10px !important;
	text-align: left !important;
}


/* =========================================================
   6. DOI
   Jika DOI dibuat sebagai .article-doi-row
   ========================================================= */

.article-doi-row {
	background: #fffde8;
	border: 1px solid #eeeacb;
	border-left: 5px solid #d5a33b;
	border-radius: 0 7px 7px 0;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	width: 100%;
	margin: 10px 0 13px;
	padding: 9px 14px;
}


/* DOI label */

.article-doi-title {
	color: #014A31;
	flex: 0 0 45px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .3px;
	text-transform: uppercase;
}


/* DOI content */

.article-doi-content {
	flex: 1;
	min-width: 0;
}


/* DOI link */

.article-doi-link {
	color: #2676b8 !important;
	display: block;
	font-size: 10.5px !important;
	line-height: 1.4;
	text-decoration: none !important;
	word-break: break-all;
	overflow-wrap: anywhere;
}

.article-doi-link:hover {
	color: #014A31 !important;
	text-decoration: underline !important;
}

.article-doi-text {
	color: #2676b8;
	font-size: 10.5px;
	word-break: break-all;
}


/* =========================================================
   7. INFORMATION BOX GRID
   ========================================================= */

.article-metadata-grid {
	display: flex;
	width: 100%;
	margin: 10px 0 17px;
	padding: 0;
	box-sizing: border-box;
	align-items: stretch;
}


/* General box */

.article-meta-box {
	box-sizing: border-box;
	min-height: 88px;
	padding: 12px 13px;
	overflow: hidden;
}


/* =========================================================
   8. DOI BOX
   Jika DOI masih berada dalam grid lama
   ========================================================= */

.article-meta-box.doi-box {
	background: #fffde8;
	border-top: 1px solid #eeeacb;
	border-bottom: 1px solid #eeeacb;
	border-left: 5px solid #d5a33b;
}


/* =========================================================
   9. ARTICLE METRICS
   ========================================================= */

.article-meta-box.metrics-box {
	background: #f4f4f0;
	border-top: 1px solid #e4e4df;
	border-bottom: 1px solid #e4e4df;
}


/* Metrics icon */

.metrics-icon {
	float: left;
	width: 58px;
	margin-right: 8px;
	text-align: center;
}

.metrics-icon .__dimensions_badge_embed__ {
	display: inline-block;
	max-width: 52px;
}


/* Metrics content */

.metrics-content {
	overflow: hidden;
}


/* Metrics heading */

.metrics-box .meta-title {
	color: #014A31;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: 6px;
}


/* Metrics number */

.metric-value {
	color: #444;
	font-size: 10px;
	line-height: 1.5;
}

.metric-value strong {
	color: #014A31;
	font-weight: 700;
}

.metric-separator {
	color: #aaa;
	margin: 0 3px;
}


/* =========================================================
   10. CITE
   ========================================================= */

.article-meta-box.cite-box {
	background: #f1e7fb;
	border-top: 1px solid #e3d6ee;
	border-bottom: 1px solid #e3d6ee;
}


/* Cite heading */

.cite-box .meta-title {
	color: #014A31;
	font-size: 13px;
	font-weight: 700;
	margin-bottom: 6px;
}


/* Cite icon */

.cite-box .articleToolIcon {
	height: 20px;
	width: auto;
	margin-right: 4px;
	vertical-align: middle;
}


/* Cite link */

.cite-box a {
	color: #2676b8 !important;
	font-size: 10.5px;
	text-decoration: none !important;
}

.cite-box a:hover {
	text-decoration: underline !important;
}


/* =========================================================
   11. FULL TEXT
   ========================================================= */

.article-meta-box.fulltext-box {
	background: #e7fbf1;
	border-top: 1px solid #d4eee0;
	border-bottom: 1px solid #d4eee0;
}


/* Full text heading */

.fulltext-box .meta-title {
	color: #014A31;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: 6px;
}


/* Download */

.fulltext-box .download-link {
	color: #2676b8 !important;
	display: inline-flex;
	align-items: center;
	font-size: 10.5px;
	line-height: 1.3;
	text-decoration: none !important;
	white-space: nowrap;
}

.fulltext-box .download-link:hover {
	color: #014A31 !important;
	text-decoration: underline !important;
}

.fulltext-box .download-link img {
	height: 18px;
	width: auto;
	margin-right: 5px;
	vertical-align: middle;
}


/* Access icon */

.fulltext-box .accessLogo {
	margin-left: 3px;
	vertical-align: middle;
}


/* =========================================================
   12. REFERENCES
   ========================================================= */

#articleCitations {
	background: #f6faf8;
	border: 1px solid #dce8e2;
	border-top: 4px solid #014A31;
	border-radius: 7px;
	box-sizing: border-box;
	margin: 17px 0 15px;
	padding: 0;
	overflow: hidden;
	width: 100%;
}


/* References heading */

#articleCitations h4 {
	background: #e9f5ef;
	color: #014A31 !important;
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	margin: 0 !important;
	padding: 10px 14px !important;
}


/* References content */

#articleCitations > div {
	background: #fff;
	margin: 0 !important;
	padding: 3px 14px 5px !important;
}


/* Individual reference */

#articleCitations p {
	border-bottom: 1px solid #edf0ee;
	color: #444;
	font-size: 9.5px !important;
	line-height: 1.4 !important;
	margin: 0 !important;
	padding: 5px 0 !important;
	text-align: left !important;
}

#articleCitations p:last-child {
	border-bottom: 0;
}


/* =========================================================
   13. DOI / GENERAL LINKS
   ========================================================= */

.article-metadata-grid a {
	text-decoration: none;
}

.article-metadata-grid a:hover {
	text-decoration: underline;
}


/* =========================================================
   14. REMOVE EXCESSIVE DEFAULT SPACING
   ========================================================= */

#articleAbstract br,
#articleSubject br {
	line-height: 0;
}


/* =========================================================
   15. ARTICLE PAGE GENERAL TEXT
   ========================================================= */

#articleTitle,
.articleAuthors,
#articleAbstract,
#articleSubject,
.article-doi-row,
.article-metadata-grid,
#articleCitations {
	box-sizing: border-box;
}


/* =========================================================
   16. MOBILE
   ========================================================= */

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

	#articleTitle h3 {
		font-size: 21px !important;
		line-height: 1.35 !important;
	}

	.authorRow {
		font-size: 12px;
	}

	.authorAffiliation {
		font-size: 10.5px;
	}

	#articleAbstract > div {
		font-size: 11px !important;
		line-height: 1.55 !important;
	}

	#articleSubject > div {
		font-size: 10.5px !important;
	}

	.article-doi-row {
		display: block;
	}

	.article-doi-title {
		margin-bottom: 4px;
	}

	.article-doi-link {
		font-size: 10px !important;
	}

	.article-metadata-grid {
		display: flex;
		flex-wrap: wrap;
	}

	.article-meta-box {
		min-height: 85px;
	}

	.article-meta-box.doi-box {
		width: 100%;
	}

	.article-meta-box.metrics-box {
		width: 60%;
	}

	.article-meta-box.cite-box {
		width: 20%;
	}

	.article-meta-box.fulltext-box {
		width: 20%;
	}

	.metrics-icon {
		width: 45px;
		margin-right: 5px;
	}

	.metrics-box .meta-title,
	.cite-box .meta-title,
	.fulltext-box .meta-title {
		font-size: 11px;
	}

	.metric-value {
		font-size: 9px;
	}

	.cite-box a,
	.fulltext-box .download-link {
		font-size: 9.5px;
	}

	#articleCitations p {
		font-size: 9px !important;
		line-height: 1.35 !important;
	}

}


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

	.article-metadata-grid {
		display: block;
	}

	.article-meta-box.metrics-box,
	.article-meta-box.cite-box,
	.article-meta-box.fulltext-box {
		width: 100%;
	}

	.article-meta-box {
		min-height: auto;
	}

}