/* ========================================================================
   AJSTD stylesheet
   v1.5.9 25 December 2021
   (c) 2018-2021 Joaquim Baeta <mail@joaquimbaeta.com>
         for the ASEAN Journal on Science & Technology for Development
  
   This program is free software: you can redistribute it and/or modify
   it under the terms of the GNU General Public License as published by
   the Free Software Foundation, either version 3 of the License, or
   (at your option) any later version.
   This program is distributed in the hope that it will be useful,
   but WITHOUT ANY WARRANTY; without even the implied warranty of
   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
   GNU General Public License for more details.
   You should have received a copy of the GNU General Public License
   along with this program.  If not, see <https://www.gnu.org/licenses/>.

   ------------------------------------------------------------------------
     
   Table of contents 

   1.......Typography
   2.......Global
   2.1.....Body
   2.2.....Header
   2.3.....Navbar
   2.4.....Footer
   3.......Styling
   3.1.....Buttons
   3.2.....Forms
   3.3.....Paragraphs
   3.4.....Tooltips
   3.5.....Page headers
   4.......Page-specific
   4.1.....Homepage
   4.1.1...Homepage issue
   4.1.2...Homepage table of contents
   4.1.3...Introduction
   4.1.4...Homepage announcements
   4.2.....Issue table of contents
   4.3.....Individual articles
   4.4.....All custom pages
   4.5.....Contact page
   4.6.....Submissions page
   4.7.....FAQ page
   4.8.....Search page
   4.9.....Editorial team
   4.10....Announcements
   4.11....Archives

   ======================================================================== */

/* 1. Typography */

@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;400&family=Lora:ital@0;1&display=swap');

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #5C97BF;
    font-family: 'Fira Sans', sans-serif;
    font-weight: 300;
}

h1 {
    font-size: 1.75rem;
}

a {
    color: #1E8BC3;
    text-decoration: underline;
    text-decoration-color: #F4B350;
    text-decoration-thickness: 1px;
    text-underline-offset: 7px;
    transition: all ease-in-out 0.2s;
}

a:hover {
    color: #5C97BF;
    text-decoration-color: #F4B350;
    text-decoration-thickness: 3px;
}

::selection { /* Style selections */
    background: #5C97BF;
    color: #FCFCFC;
}

.page-content p, .page-content li {
    font-size: 1.05rem !important;
    font-weight: 300 !important;
}

/* 2. Global */

/* 2.1 Body */

body {
    color: #161413;
    background-color: #FCFCFC;
}

/* 2.2 Header */

.main-header {
    border-bottom: 1px solid #C5B3BC;
    /*background: #F5F3F4;*/
    background: transparent url("https://i.ibb.co/KDS0thy/semk.jpg") scroll 0% 0% !important;
}


/* 2.3 Navbar */

#userNav .nav-link, .language-toggle .dropdown-toggle {
    color: #A18A96;
    text-decoration: none;
}
#userNav .dropdown-item {
    color: #000;
    padding-left: 0.5em;
    font-size: 14px;
    text-transform: none;
}
#userNav .nav-link:hover, .language-toggle .dropdown-toggle:hover, #userNav .nav-link:focus, .language-toggle .dropdown-toggle:focus {
    outline: 0;
    border-color: transparent;
    color: #1E8BC3;
}

#userNav .dropdown-menu, .language-toggle .dropdown-menu {
    border-radius: 20px 5px 20px 20px;
}

#primaryNav .nav-link {
    font-weight: 300;
    letter-spacing: 0.25px;
    font-size: 1rem;
    text-decoration: none;
}

#primaryNav .nav-link:hover, #primaryNav .nav-link:focus {
    background: transparent;
    color: #5C97BF;
    border-color: transparent;
    font-weight: 300;
    letter-spacing: 0.25px;
    font-size: 1rem;
}

.badge-light {
    background: #F4B350cc;
    color: #161413aa;
}

.dropdown-item {
    transition: all ease-in-out 0.2s;
    text-decoration: none;
    color: #000;
}

.dropdown-item:hover, .dropdown-item:focus {
    border-color: transparent;
    color: #F4B350 !important;
}

#primaryNav .dropdown-menu.show {
    border-radius: 0px 0px 20px 20px;
    border-top: 1px solid #C5B3BC;
}

#primaryNav .dropdown-item {
    color: #000;
    transition: all ease-in-out 0.2s;
    font-weight: 300;
    letter-spacing: 0.25px;
    text-decoration: none;
}

#primaryNav .dropdown-item:hover, #primaryNav .dropdown-item:focus {
    background: transparent;
    color: #F4B350;
    border-color: transparent;
}

.dropdown-toggle::after {
    display: unset;
    margin-left: 0;
    vertical-align: baseline;
    border: none;
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    color: #C5B3BC;
    padding-left: 3px;
}

/* 2.4 Footer */

/* Use prefooter block to aesthetically place sidebar content in footer; disable when not in use */

/*#CUSTOMblock-prefooter {
    flex-basis: auto;
    width: 100%;
    padding: 0;
}

@media (max-width: 767px) {
  #CUSTOMblock-prefooter {
    padding: 15px 15px 0 15px;
    margin-bottom: 0;
  }
}*/

.site-footer-sidebar { /* Remove margin and padding when prefooter is not in use */
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}

.site-footer {
    background: transparent url("https://i.ibb.co/KDS0thy/semk.jpg") scroll 0% 0% !important;/*
    background: transparent url("https://i.ibb.co/KrYxhYQ/hexaip.jpg") scroll 0% 0% !important;*/
    /*background: #303030;*/
    color: #F4B350;
    padding-bottom: 0;
}

.site-footer h3 {
    font-size: 1rem;
    color: #F4B350;
}

.site-footer p {
    font-size: 0.8rem;
}

.site-footer a {
    color: #1E8BC3;
    text-decoration: none;
    transition: all ease-in-out 0.2s;
}

.site-footer a:hover {
    color: #F4B350;
    text-decoration: none;
}

.site-footer .row .align-self-center { /* modify the align-self-center class in the footer because it's hard-coded in the template */
    -ms-flex-item-align: flex-start !important;
    align-self: flex-start !important;
}


.col-md.col-md-2.align-self-center.text-right { /* Remove PKP logo for placement elsewhere */
    display: none;
}

@media (min-width: 991px) {
  .publisher-logos {
    float: left;
    text-align: left;
    margin-bottom: 0;
  }
}

.publisher-logos {
  text-align: center;
  margin-bottom: 1rem;
}

/* 3. Styling */

/* 3.1 Buttons */

.btn {
    border-radius: 10px;
    border: 1px solid #A18A96;
    color: #1E8BC3;
    text-transform: uppercase;
    font-weight: 300;
}

.btn-primary { /* Main (violet) buttons */
    border-radius: 20px 40px 40px 20px;
    border-color: #48092B !important;
    color: #FCFCFC;
    background: #1E8BC3;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background: #161413 !important;
    border-color: #161413 !important;
    color: #FCFCFC;
}

.btn-primary:focus {
  box-shadow: 0 0 0 .2rem #F4B350 !important;
}

.modal-content .btn-primary { /* Buttons in modals with violet backgrounds */
    background: transparent;
    border-radius: 10px !important;
    border-color: #FCFCFC44;
    color: #FCFCFCaa;
    text-transform: uppercase;
    transition: all ease-in-out 0.2s;
}

.modal-content .btn-primary:hover, .modal-content .btn-primary:active {
    background: transparent;
    border-color: #FCFCFC77;
    color: #FCFCFC;
}

/* 3.2 Forms */

.form-control {
    background-color: #FCFCFC;
}

.form-control:hover {
    border-color: #F4B350;
}

.form-control:focus {
    color: #495057;
    background-color: #FFF;
    border-color: #FFF;
    outline: 0;
    box-shadow: 0 0 0 0.2rem #F4B350;
}

@media (max-width: 575px) { /* Lists with images on the side */
    .list-img {
        text-align: center !important;
    }

    .list-img > img {
        width: 150px !important;
        margin-bottom: 2rem;
    }
}

/* 3.3 Paragraphs */

.paragraph {
    font-weight: 300;
    font-size: 1.1rem;
}

/* 3.4 Tooltips */

.hint {
    position: relative;
    display: inline-block;
    color: #5C97BF;
}

.hint .hint-text {
    visibility: hidden;
    width: 200px;
    background-color: #5C97BF;
    color: #FCFCFC;
    border-radius: 10px;
    padding: 10px 10px;
    position: absolute;
    z-index: 1;
    bottom: 110%;
    left: 50%;
    transform: translate(-50%);
    text-align: center;
    font-size: 0.9rem;
    line-height: 1.5;
    opacity: 0;
    transition: opacity 0.3s;
}

.hint .hint-text::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #5C97BF transparent transparent transparent;
}

.hint:hover .hint-text {
    visibility: visible;
    opacity: 1;
}

/* 3.5 Page headers */

.page-header {
    margin-top: 5rem;
    margin-bottom: 1rem;
}

.page-header h1 {
    font-size: 1.75rem;
    text-transform: uppercase;
}

/* 4. Page-specific */

/* 4.1 Homepage */

/* 4.1.1 Homepage issue */

.homepage-image-behind-issue::after {
    background: rgba(0,0,0,0.2);
}

.homepage-issue-current { /* 'CURRENT ISSUE' text */
    margin-top: 0 !important;
  	font-family: 'Fira Sans', sans-serif;
  	font-size: 2rem;
  	font-weight: 300;
  	text-transform: uppercase;
}

.homepage-issue-identifier {
  	display: none;
}

.homepage-issue-published { /* Date issue was published */
    margin-top: 1.5rem !important;
}

.homepage-issue-description-wrapper { /* Issue description box */
    display: flex;
    align-content: center;
    background: #F5F3F4;
    height: 297px;
    padding: 2.8rem 3rem;
    border: 1px solid #C5B3BC;
    border-radius: 0px 45px 0px 0px;
    line-height: 25px;
    background: transparent url("https://i.ibb.co/Mk7Pfkq/pat2.jpg") scroll 0% 0% !important;
}

.homepage-issue-description .h2 {
    font-family: 'Lora', serif;
    font-style: italic;
    color: #161413;
    font-size: 1.45rem !important;
    margin-bottom: 1rem;
}

.homepage-issue-description p {

    color: #161413;
    font-weight: 300;
    font-size: 1.05rem;
    
}

.homepage-issue-description:after {
    display: none;
}

.homepage-issue-description-more {
    display: none !important;
}

@media (max-width: 1199px) {
    .homepage-issue-current {
        color: #161413;
    }

    .homepage-issue-published {
        color: #1E8BC3;
        text-transform: uppercase;
    }

    .homepage-issue-description-wrapper { /* Issue description box */
        box-shadow: none;
    }
}

@media (max-width: 991px) {
    .homepage-issue-description-wrapper { /* Issue description box */
        height: 100%;
        padding: 1rem 0rem;
        border: 0;
        background: #FCFCFC;
    }

    .homepage-issue-description {
        padding-bottom: 0;
    }
}

@media (min-width: 769px) {
    .homepage-issue-cover { /* Cover image */
        width: 210px;
        height: 297px;
    }
}

@media (max-width: 768px) {
    .homepage-issue-cover {
        max-width: 100% !important;
        max-height: 100% !important;
    }
}

/* 4.1.2 Homepage table of contents */

.issue-toc-section-title {
    font-size: 1.75rem;
    color: #5C97BF;
}

.article-summary-authors, .article-summary-pages {
    font-size: 0.9rem;
    color: #1E8BC3;
    text-transform: uppercase;
    font-weight: 300;
    line-height: 1.33;
}

@media (min-width: 992px) {
	.article-summary-pages {
		width: 56px;
	}
}

.article-summary-title {
  	font-family: 'Lora', serif;
  	font-style: italic;
}

.article-summary-title a {
    color: #161413;
    /*border-bottom: 0px solid #F4B350;*/
    text-decoration-color: #FCFCFC;
    text-decoration-thickness: 0px;
    transition: all ease-in-out 0.2s;
}

.article-summary-title a:hover {
    /*border-bottom: 3px solid #F4B350;*/
    text-decoration: underline;
    text-decoration-thickness: 3px;
    text-decoration-color: #F4B350;
}

.article-summary-doi { /* Do not show article DOIs in the table of contents */
    display: inline;
    font-size: smaller;
}

.article-summary {
  margin-bottom: 20px;
  border-bottom: solid darkseagreen;
/*  background-color: #4cbf89 !important;*/ 
  background: transparent url("https://i.ibb.co/4YfscGf/pattern.png") repeat scroll 0% 0% !important;
  padding: 1rem;
  border-radius: 0rem 0rem 0rem 0rem;
  /*border-radius: 2rem 2rem 2rem 2rem;*/
  box-shadow: .2rem .2rem .1rem #1e6292;
}

/* 4.1.3 Introduction */

.asean-terms {
    list-style: none;
}

.asean-terms li::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f101"; 
    color: #C5B3BC;
    font-size: 1rem;
    display: inline-block; 
    width: 1.75rem;
    margin-left: -1.75rem;
}

/* 4.1.4 Homepage announcement */

.homepage-announcement {
    flex: 0 0 100%;
    max-width: 100%;
}

.homepage-announcement-title {
    font-size: 1.35rem;
}

.homepage-announcement a {
    font-size: 1.05rem;
    font-weight: 300;
}

/* 4.2 Issue table of contents */

.page-issue-date {
    color: #1E8BC3 !important;;
    text-transform: uppercase;
    font-weight: 300;
}

.page-issue-description-wrapper {
    display: flex;
    align-items: center;
    background: #F5F3F4;
    border: 1px solid #C5B3BC;
    min-height: 297px;
    padding: 2.8rem 3rem;
    border-radius: 45px 0px 0px 0px;
}

.page-issue-description-wrapper p {
    font-weight: 300;
    font-size: 1.15rem;
    text-align: right;
    margin-bottom: 0;
}

.page-issue-description-wrapper .h2 {
    font-family: 'Lora', serif;
    font-style: italic;
    color: #161413;
    font-size: 1.45rem !important;
    text-align: right;
    margin-bottom: 1rem;
}

.article-details-issue-identifier a {
    font-family: 'Fira Sans';
    color: #5C97BF;
    font-size: 1.15rem;
}

.article-details-issue-section {
    color: #1E8BC3;
}

.article-details-published {
    color: #1E8BC3;
}

.authors-string {
    font-size: 1.25rem;
}

.authors-string a {
    border-bottom: 0px solid #F4B350;
}

.issue-toc-section + .issue-toc-section {
    border-top: 1px solid #C5B3BC !important;
}


/* 4.3 Individual articles */


.article-details-issue-identifier, .article-details-heading, .article-details .item > .label {
    color: #1E8BC3 !important;
    font-weight: 300;
}

.article-details-issue-identifier a {
    border-bottom: 0px solid #F4B350;
    transition: all ease-in-out 0.2s;
}

.article-details-issue-identifier a:hover, .article-details-issue-identifier a:focus {
    color: #5C97BF;
    text-decoration: none;
    border-bottom: 3px solid #F4B350;
}

.article-details-doi a {
    color: #1E8BC3;
    text-decoration: underline;
    text-decoration-color: #F4B350;
    text-decoration-thickness: 1px;
    text-underline-offset: 7px;
    transition: all ease-in-out 0.2s;
}

.article-details-doi a:hover {
    color: #5C97BF;
    text-decoration-color: #F4B350;
    text-decoration-thickness: 3px;
}

.author-symbol {
    color: #1E8BC3 !important;
}

.author-string-href {
    font-size: 1.3rem;
    text-decoration: none;
    font-weight: 400;
}

.article-details-author-affiliation {
    color: #1E8BC3 !important;
    font-size: 1.1rem !important; 
    font-weight: 300;
}

.article-details-fulltitle {
    font-family: 'Lora', serif;
    font-style: italic;
    color: #161413;
    line-height: 1.5;
    text-transform: unset !important;
}

.article-details-issue-section {
    color: #1E8BC3 !important;
    text-transform: uppercase;
    font-weight: 300;
}

.article-details-published {
    color: #1E8BC3 !important;
    font-weight: 300;
    text-transform: uppercase;
}

.article-details-main {
    padding: 3rem 6rem;
    background: #F5F3F4;
    border: 1px solid #C5B3BC;
    border-radius: 45px 0px 0px 0px;
}

.article-details-abstract p {
    font-family: 'Lora', serif;
      text-align: justify;
  text-justify: inter-word;
}

.article-details-references p {
    font-family: 'Lora', serif;
}

.article-details-sidebar ul {
    font-size: 1.05rem;
    font-weight: 300;
    list-style: none;
}

.article-details-sidebar ul li::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f101"; 
    color: #C5B3BC;
    font-size: 1rem;
    display: inline-block; 
    width: 1.25rem;
    margin-left: -2.5rem;
}

.article-details-keywords-value {
    font-size: 1.05rem;
    font-weight: 300;
}

.article-details-references-value {
    font-family: 'Lora', serif;
}

.article-details-license p {
    font-size: 1rem;
    font-weight: 300;
    margin-top: 1rem;
    margin-bottom: 0;
}

/*.article-details-license img {
    margin-left: 43%;
}*/

/* 4.4 All custom pages */

.custom-page .page-header h1 {
    font-size: 2rem;
    margin-top: 2.5rem
    margin-bottom: 0;
}

.page-content {
    border-top-color: #C5B3BC;
}

/* 4.5 Contact page */

.contact-name {
    font-size: 16px;
}

.contact-affiliation {
    font-size: 16px;  
}

.contact-email {
    font-size: 16px;
}

/* 4.6 Submissions page */

.submissions-checklist {
    font-size: 1.05rem;
    font-weight: 300;
}

.submissions-checklist ul {
    margin-top: 1rem;
    list-style: none;
}

.submissions-checklist ul li::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f101"; 
    color: #C5B3BC;
    font-size: 1rem;
    display: inline-block; 
    width: 1.525rem;
    margin-left: -1.8rem;
}

/* 4.7 FAQ page */

.faq-return a {
    color: #1E8BC3;
    transition: all ease-in-out 0.2s;
}

.faq-return a:hover {
    color: #5C97BF;
    text-decoration: none;
}

/* 4.8 Search page */

.alert-info {
    background: #F5F3F4;
    color: #1E8BC3;
    border-color: #C5B3BC;
}

.search-filters {
    background: #F5F3F4;
    border: 1px solid #C5B3BC;
    border-radius: 45px 0 0 0;
}

.search-filters > h2 {
    color: #1E8BC3;
}

.search-filters label {
    color: #1E8BC3;
}

.form-control {
    color: #5C97BF;
}

/* 4.9 Editorial team */

.editorial-member .col-lg-10 {
    display: grid;
}

.editorial-member img {
    border-radius: 40px 5px 5px 5px;
    border: 1px solid #C5B3BC;
}

.editorial-member a {
    transition: all ease-in-out 0.2s;
}

.editorial-member a:hover {
    color: #161413;
}

.editorial-member h3 {
    margin: 0;
    font-size: 1.25rem;
    align-self: center;
}

.editorial-member h4 {
    margin: 0;
    line-height: 1.2; 
    color: #1E8BC3; 
    font-weight: 400;
    font-size: 1.05rem;
    align-self: self-end;
}

.editorial-member h5 {
    margin: 0;
    line-height: 1.2; 
    color: #1E8BC3; 
    font-weight: 300; 
    font-size: 1.05rem;
    align-self: self-end;
}

.editorial-member p {
    margin: 0;
    align-self: center;
}

/* 4.10 Announcements */

.announcement-summary-date, .announcement-date, .homepage-announcement-date {
    font-family: 'Fira Sans', sans-serif !important;
    font-size: 1rem !important;
    color: #1E8BC3 !important;
    text-transform: uppercase !important;
    font-weight: 300 !important;
}

/* 4.11 Archives */

.page-archives-header {
    margin-bottom: 4rem !important;
}

.page-archives .issue-summary {
    background: #fcfcfc;
}

.page-archives .issue-summary-cover {
    box-shadow: 0 5px 10px rgba(0,0,0,0.1);
}

.page-archives .issue-summary .card-body {
    background: transparent;
}

.page-archives .issue-summary-series a {
    color: #1E8BC3;
    font-size: 1.11rem;
    text-decoration: none;
}

.page-archives .issue-summary-series a:hover {
    color: #5C97BF;
}

.page-archives .issue-summary-date {
    color: #1E8BC3 !important;
    font-size: 0.9rem;
    font-weight: 300;
    text-transform: uppercase;
}

.page-archives .issue-summary-title {
    color: #1E8BC3 !important;
    font-size: 0.9rem;
    font-weight: 300;
}

/* Pagination */

.page-item {
    font-size: 1rem;
    font-weight: 300;
}

.page-item a {
    text-decoration: none;
}

.page-link {
    color: #1E8BC3 !important;
    transition: all ease-in-out 0.2s;
}

.page-link:hover, .page-link:focus {
    color: #5C97BF !important;
    background: #fcfcfc !important;
    box-shadow: none;
}

.page-item:first-child .page-link {
    border: 0;
}

.page-item:first-child .page-link span {
    display: none;
}

.page-item:first-child .page-link:before {
    margin-left: 0;
    vertical-align: text-bottom;
    border: none;
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f100";
    color: #C5B3BC;
    padding-right: 3px;
    transition: all ease-in-out 0.2s;
}

.page-item:first-child:hover .page-link:before {
    color: #5C97BF;
}

.page-item:last-child .page-link {
    border: 0;
}

.page-item:last-child .page-link span {
    display: none;
}

.page-item:last-child .page-link:after {
    margin-left: 0;
    vertical-align: text-bottom;
    border: none;
    font-family: 'Font Awesome 5 Free';
    font-weight: 700;
    content: "\f101";
    color: #C5B3BC;
    padding-left: 3px;
    transition: all ease-in-out 0.2s;
}

.page-item:last-child:hover .page-link:after {
    color: #5C97BF;
}

.page-item.active .page-link {
    border: 0;
    color: #1E8BC3 !important;
}

.page-item.disabled .page-link {
    color: #C5B3BC !important;
}