/* this style sheet is customised to display html galleys for IJCMR - it only   */
/* works with the Classic theme and the customised html galley plugin          */

/* fonts - Georama is preloaded from google fonts via the custom header plugin */

body {
	font-size: 1.3rem;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Georama','Cardo',serif;
  color: #414141;
  font-stretch: 75%;
  font-weight: 600;
}

p, li, a, blockquote {
  font-family: 'Cardo',serif;
  font-size: 1.3rem;
  line-height: 1.6;
}

.article-full-title {
	font-size: 52px;
	color: #f00;
}

.galleyContent h1 {
	font-size: 52px;
	margin-bottom: 2rem;
}

@media (min-width: 992px) {
	.journal-logo {
		max-height: 250px;
		max-width: unset;
	}
}

@media (min-width: 992px) {
	#navigationPrimary {
		border: 0;
		justify-content: space-evenly;
		padding-bottom: 0px;
		}
}

@media (min-width: 992px) {
	.header {
		height: 250px;
	}
}

.header {
	background: url("https://tuwhera.aut.ac.nz/__data/assets/image/0008/933848/IJCMRbanner.png");
	background-size: cover;
	padding-top: 0px;
}

@media (min-width: 992px) {
	.header .row {
		min-height: 213px;
	}
}

.upper-header {
	padding-top: 0px;
}

@media (min-width: 992px) {
	.lower-header .nav-tabs .nav-item {
		background-color: white;
		padding-left: 10px;
		padding-right: 10px;
		color: #000;
	}
}

.nav-link {
  color: #000;
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
  color: #F00;
}

.upper-header .nav-link {
    color: white;
}

.upper-header .nav-link:focus, .upper-header .nav-link:hover {
    color: white;
}

.nav-tabs .nav-item.show .nav-link {
  background-color: white;
}

@media (max-width: 991px) {
  #show-modal {
    cursor: pointer;
    color: #000;
  }
}

@media (max-width: 991px) {
  #show-modal:focus, #show-modal:hover {
    color: #000;
    background-color: inherit;
  }
}

#user-dashboard-link {
  color: white;
}

.journal_summary {
  margin-top: 2em;
  margin-bottom: 0em;
}

/* make images scale nicely on summary pages */

.imgIJCMR {
	max-height: 100%;
	object-fit: cover;
	min-width: 100%;
	height: 30vh;
}


/* This allows the current issue header to be full width. Provides a background to current issue info on homepage. */

.current_issue header {
	background: url("https://tuwhera.aut.ac.nz/__data/assets/image/0006/904830/IJCNRbanner.png");
	color: #fff;
	padding: 1rem 0;
	position: relative;
	z-index: 2;
	
	&:before {
		background: url("https://tuwhera.aut.ac.nz/__data/assets/image/0006/904830/IJCNRbanner.png");
		content: '';
		display: flex;
		height: 100%;
		left: 50%;
		margin-left: -50vw;
		margin-right: -50vw;
		max-width: 100vw;
		position: absolute;
		right: 50%;
		top: 0;
		width: 100vw;
		z-index: -1;
	}
}

.current_issue header {
  margin-bottom: 0px;
}

.current_issue_label {
	color: #FFF;
}

.current_issue_identification {
	color: #F00;
}

.page_issue_archive header, .page_about header, .page_privacy header, .page_submissions header {
  border-bottom: solid 1px #F00;
}

/* Changes to size of pdf button */

.galleys_links .btn, .item.galleys .btn {
  color: #FFF;
  background-color: #F00;
  border-color: #E8E6E6;
  font-size: 2rem;
}

.galleys_links .btn:hover {
	background-color: #999997;
}

.item.galleys .btn:hover {
  background-color: #999997;
}
	
/* For html galleys -  code is in htmlArticleGalleyIJCMR plugin */

.htmlGalley .cmp_breadcrumbs {
	display: none;
}

.galleyContent p {
	margin-bottom: 2rem;
}

.w-100 {
	max-width: unset;
}
	

/* make embedded videos responsive - only works for embedded */
/* this first media rule is legacy - if removed old videos will break */
.media {
	padding: 56.25% 0 0 0;
	position: relative;
}

.mediaVimeo, .mediaYoutube {
	padding: 56.25% 0 0 0;
	position: relative;
}

video {
	display: block;
	height: 100%;
	width: 100%;
}

/* tidy up tables */
.galleyContent table p {
	margin-bottom: 0;
}

.galleyContent table td {
	padding: 0.5rem;
}

.galleyContent table {
	border-bottom: 1px solid #000;
	margin-bottom: 2rem;
}

.galleyContent .img-fluid {
	margin: 1rem;
}

/* Desktop - large image */
.cover_image {
    width: 95% !important;
    min-width: unset !important;
    max-width: none !important;
    height: auto !important;
    object-fit: unset !important;
}

/* Mobile - scale to fit screen */
@media (max-width: 768px) {
    .cover_image {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
}