Template:Vol/styles.css

From JoJo's Bizarre Encyclopedia - JoJo Wiki
Jump to navigation Jump to search
.volumeTable {
	background-color: #F0F0F0;
	border: 3px groove #444;
}

.volumeTable ul ol {
	margin: 0 0 0 -10px !important;
}

.volumeTable dl {
	margin-left: 20px;
}

.volumeTable dd {
	margin-left: 0;
}

.listCol1, .listCol2 {
  border: 1px solid #999;
}

.volumeTableRow {
	display: table-row;
}

.volumeTableHead {
	display: table;
	width: 100%;
}

.volumeTableHeading {
	color: white;
}

.volumeTableChTitles {
	padding: 3px 10px;
	text-align: center;
}

.volumeTableNumber {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	border: 1px solid #999;
	width: 14.5%;
	color: white;
	font-size: small;
	font-variant: small-caps;
}

.volumeTableNumber a, .volumeTableHeading a, .volumeTableTitle a {
	color: white !important;
}

.noTitle {
	width: 100%;
	font-size: initial;
	padding: 10px;
}

.volumeTableTitle {
	border: 1px solid #999;
	font-weight: bold;
	text-align: center;
	color: white;
	display: table-cell;
	position: relative;
}

.volumeTableTitle2 {
	padding: 5px;
}

.volumeTableImage {
	border: 1px solid #999;
	display: table-cell;
	text-align: center;
	min-width: 150px;
	width: 150px;
	vertical-align: middle;
}

.volumeTableImage img {
  border: 2px solid black;
}

.volumeTableCell {
	border: 1px solid #999;
	display: table-cell;
	padding: 3px 10px;
	width: 50%;
}

.volumeTableAll {
	display: table-cell;
	width: 100%;
	vertical-align: top;
}

.volumeTableInfo {
	display: table;
	width: 100%;
}

.volumeTableChapters {
	display: table;
	width: 100%;
	margin-top: 10px;
}

.volumeTableAllChapters {
  display: table-cell;
  width: 100%;
}

.volumeTableAllChapters2 {
  width: 100%;
}

.volumeTableChList, .volumeTableChList2 {
  font-size: small;
}

.volumeTableChList2 .noexcerpt {
  font-size: smaller !important;
  display: block;
}

.volumeTableNone p {
	padding-left: 15px;
}

.volumeTableNone {
	font-size: 90%;
}

.volumeTableTitle p {
	margin: 0;
}

.volumeTableScroll {
	overflow: auto;
	max-height: 400px;
}

.volumeTableScroll2 {
	overflow: auto;
	max-height: 95px;
}

.boxAnchorLink {
	float: none;
	display: inline-block;
	position: absolute;
	right: 0;
	top: 10%;
}

.volumeTableBarcode {
	font-size: small;
}

.volumeTableBDBarcodeHeading {
	width: 7.5%;
}

.volumeTableBDDate {
	width: 25%;
}

.volumeTableBDDateHeading {
	width: 15%;
}

.volumeTableBDPriceHeading {
	width: 5%;
}

.volumeTableBDPrice {
	width: 25%;
}

.volumeTableBDEpsHeading {
	width: 10%;
}

.volumeTableBDEps {
	width: 10%;
}

.volumeTableBDDiscHeading {
	width: 5%;
}

.volumeTableBDDisc {
	width: 5%;
}

.volumeTableHeading2 {
	padding: 3px 10px;
	border: 1px solid #999;
	border-top: none;
	color: white;
}

.volumeTableBDCover2 {
	display: flex;
	flex-grow: 1;
	align-items: center;
	align-self: center;
	justify-content: center;
}

.volumeTableBDCover {
	display: inline-flex;
	flex-direction: column;
}

.volumeTableCovers {
	display:inline-flex;
}

.volumeTableSpecifications {
	margin-left: 10px;
}

.volumeTableLEGallery {
	display: inline-block;
	vertical-align: top;
}

.volumeTableBDDate, .volumeTableBDPrice, .volumeTableBDDisc, .volumeTableBDEps,
.volumeTableBDBarcode {
	font-size: 85%;
}

.volumeTableBDRow {
	display: flex;
}

.volumeTableBDBarcode {
  flex-grow: 1;
  width: 77%;
}

body.skin-minerva .volumeTableBDDateHeading {
  flex-grow: 0.5;
}

body.skin-minerva .volumeTableBDDiscHeading, .volumeTableBDDisc, .volumeTableBDEpsHeading, .volumeTableBDEps {
  flex-grow: 0.25;
}


body.skin-minerva .volumeTableBDPriceHeading, .volumeTableBDBarcodeHeading {
  flex-grow: 0.8;
}

body.skin-minerva .volumeTableBDDate, .volumeTablePrice, .volumeTableBarcode {
  flex-grow: 1;
}

body.skin-minerva .volumeTableImage {
	display: block !important;
    width: 99.5% !important;
    min-width: unset !important;
}

body.skin-minerva .volumeTableAllChapters {
		display: block !important;
}

body.skin-minerva .volumeTableCovers {
		display: block !important;
		width: 99.5% !important;
		text-align: center;
}

@media only screen and (min-width: 1100px) {
	.volumeTableDate {
		width: 58.85%;
	}
}

@media only screen and (max-width: 600px) {
	.volumeTableBDRow {
		flex-wrap: wrap;
	}
}

@media only screen and (max-width: 1100px) {
	.volumeTableImage {
    	display: block;
    	width: 99.5%;
    	min-width: unset !important;
	}
	
	.volumeTableAllChapters {
		display: block;
	}
	
	.volumeTableNumber {
    	display: table-header-group;
	}
	
	.volumeTableCovers {
		display: block;
		width: 99.5%;
		text-align: center;
	}
	
	.volumeTableChList2 .noexcerpt {
		display: initial;
	}
	
	.volumeTable .boxAnchorLink {
		display: none;
	}
	
	.volumeTableBDPriceHeading, .volumeTableBDDiscHeading {
		display: table-cell;
	}
	
	.volumeTableBDDate,
	.volumeTableBDPrice,
	.volumeTableBDBarcode {
		font-size: 85%;
		flex-grow: 1;
		width: 65% !important;
	}

	.volumeTableBDDisc,
	.volumeTableBDEps {
		font-size: 85%;
		flex-grow: 0.40 !important;
		width: 10% !important;
	}

	.volumeTableBDDateHeading,
	.volumeTableBDPriceHeading,
	.volumeTableBDDiscHeading,
	.volumeTableBDEpsHeading,
	.volumeTableBDBarcodeHeading {
		font-size: 75% !important;
	}

	.volumeTableBDPriceHeading,
	.volumeTableBDBarcodeHeading {
		width: 15% !important;
		flex-grow: 0.5 !important;
	}

	.volumeTableBDDiscHeading,
	.volumeTableBDEpsHeading {
		width: 15% !important;
		flex-grow: 0.12 !important;
	}
}