/* Custom User CSS for Cassiopeia (Joomla 4 Standard Frontend Template */

/*
:root {
	--cassiopeia-color-primary: #f44336;
  	--cassiopeia-color-link: #ff5050;
  	--cassiopeia-color-hover: #c00000;
}
*/

/* body {font-size:1.2rem;} */

a, a:not([class]), a:hover {text-decoration:none;}

span.star {color: #F00;}

.container-header .navbar-brand {margin:auto; text-align:center;}
.container-header .navbar-brand img {width:150px; height:auto;}
.container-header .site-description {font-size:1.3rem; line-height:1.3;}

.container-header a {text-decoration:none;}
.container-header nav {margin: auto;}
.container-header .nav li a {font-size:1.2em; margin-right:3em;}

.metismenu.mod-menu .parent>ul {background:#393c71;}
.metismenu.mod-menu .parent>ul li a {color:#FFF;}
.metismenu.mod-menu .metismenu-item.active>a, .metismenu.mod-menu .metismenu-item.active>button, .metismenu.mod-menu .metismenu-item>a:hover, .metismenu.mod-menu .metismenu-item>button:hover {text-decoration:none; /* border-bottom:2px solid #FFF;*/ }
.container-header .metismenu>li>a:after {opacity:0.6;}



/* BANNER TOP - SLIDESHOW */
.banner-top img {width:auto; max-width:unset;}
.banner-top .banneritem {position:relative; overflow:hidden;}
/* .banner-top .banneritem::after {
  content:'"Sabda sudah menjadi manusia, Ia bertabernakel di antara kita, dan kita sudah melihat keagungan-Nya. Keagungan itu diterima-Nya sebagai Anak tunggal Bapa. Melalui Dia kita melihat Allah dan kasih-Nya kepada kita" \A (Yoh 1 : 14)'; 
  font-size:1.4em; 
  color:#FFF; 
  position:absolute; 
  width:80%; 
  text-align:center; 
  top:50%; 
  left:50%; 
  transform: translate(-50%, -50%);
  white-space: pre-wrap;
  background:#0000001a;
  padding: 1em;
  max-width:800px;
} */
.banner-top .bannerheader {
  font-size:1.3em; 
  color:#FFF; 
  position:absolute; 
  width:80%; 
  text-align:center; 
  top:42%; 
  left:50%; 
  transform: translate(-50%, -50%);
  background:#0000001a;
  padding: 1em;
  max-width:800px;
  z-index: 1;
}

/* Module LOGIN */
.mod-login-logout div, .mod-login-logout ul {display:inline-block;}



/* MENU CATALOG (CATEGORY BLOG) */
.catalog .cover-front, .catalog .cover-back {list-style:none; width:47%; display:contents; min-width:300px;}
.catalog li.pdf {padding-top:1em;}
.catalog .blog-item {padding:20px 10px 20px 10px; border:1px solid #CCC;}
.catalog .blog-item:hover {background:#f5f5ff;}
.catalog .blog-item ul.fields-container {padding-left:0;}
.catalog .blog-item .cover-front img, .catalog .blog-item .cover-back img {border:1px solid #CCC; padding:2px;}
.catalog .blog-item .field-entry .field-label {font-weight:bold; width:120px; float:left;}
.catalog .blog-item .field-entry .field-value {display:table;}
.catalog .blog-item .field-entry.cover-front .field-value, .catalog .blog-item .field-entry.cover-back .field-value {display:initial;}
.edit.item-page #attrib-fields-1 .form-grid > .control-group {border-top: 2px solid #7684fc; padding:1em 0;}
.field-entry.pdf .acfup-item a.download {box-shadow: 2px 2px 4px 1px #888;}
.field-entry.pdf .acfup-item a.download:hover {box-shadow: 0px 0px 4px 1px #888;}


/* MENU BUKU (CATEGORY LIST) */
.menu-buku table th.list-title, .menu-buku table th#categorylist_header_title {
    position: sticky;
 /*   width: 160px; */
    left: 0;
    background: #eee;
}
.menu-buku th#categorylist_header_tahunterbit {white-space:normal;}



/* FOOTER */
.footer .grid-child {padding:10px;}
.mod-footer {text-align:center; width:100%;}
.mod-footer .footer2 {font-size:small;}

.login-modals {margin-left:30px;}


@media (max-width: 1100px) {
/*	.banner-top img {width:auto;} */
}
@media (min-width: 992px) {
  
}

@media (max-width: 991px) {
  .banner-top .bannerheader {font-size:1.2em; top:40%;}
}

@media (min-width: 768px) and (max-width: 991px) {
.container-header .mod-menu {
    -webkit-box-flex: 1;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;
    -ms-flex-direction: row;
    flex-direction: row;
	}
}

@media (min-width: 976px) {
	
}

@media (max-width: 975px) {
	
}

@media (min-width: 768px) {
	
}

@media (max-width: 767px) {
  .container-header nav {width:100%; text-align:center; margin-top:0 !important;}
  .container-header .navbar-toggler {margin:auto; border:none;}
  .container-header .navbar-toggler:hover, .container-header .navbar-toggler:focus {border:none; box-shadow:none;}
  .container-header .navbar-toggler span.icon-menu::after {font-family: sans-serif; font-weight:normal; font-size: 1.2rem; position:absolute; padding-left:20px;}
  .container-header .navbar-toggler[aria-expanded="false"] span.icon-menu::after {content:' MENU';}
  .container-header .navbar-toggler[aria-expanded="true"] span.icon-menu::after {content:' CLOSE';}
  .container-header .mod-list li {width:100%; justify-content:center;}
/*  .container-header .mod-list li:hover {background:#2d3668; color:#FFF;} */
}

@media (min-width: 576px) {
	
}

@media (max-width: 575px) {
	
}

@media (min-width: 480px) {
  .menu-buku th.list-title, .menu-buku td.list-penulis {min-width:150px;}
}

@media (max-width: 479px) {
	.container-header .site-description {font-size:1.2rem;}
  	.banner-top .bannerheader {font-size:1.1em; top:36%;}
/*  	.catalog ul.fields-container {padding:0;} */
  .catalog .blog-item .page-header {text-align:center;}
  .catalog .cover-front, .catalog .cover-back {margin-left: -1em;}
  	.mod-footer .footer1 {line-height: 1.4;}
}

@media (max-width: 400px) {
	.container-header .site-description {font-size:1.1rem;}
}