Vorlage:Medienbox/styles.css

Aus ÖsterreichWiki
Zur Navigation springen Zur Suche springen
/* (Info-)Box-Layout im medien-Bereich */
.medien-box{
	display:table;
	width:23em;
	margin-top:0;
	border:solid 1px #A2A9B1;
	border-spacing:0;
	line-height:1.3;
}

.medien-box,
.float-right[id*="Synchronisation"]{
	font-size:93%;
}

.medien-box th, .medien-box td{
	text-align:left;
	vertical-align:top;
	padding:4px;
}

.medien-box td ul {
	margin:0 0 0 1.5em;
	padding:0;
	line-height:inherit;
}

/* kompakte Listendarstellung */
.medien-box td:not([colspan]) ul {
	list-style:none none;
	margin:0;
}

.medien-box td:not([colspan]) ul li {
	margin:0 0 0 .7em;
	text-indent: -.7em;
}

@media (max-width:639px){
	.medien-box td:not([colspan]) ul li {
		margin:0;
		display:inline;
	}

	.medien-box td:not([colspan]) ul li+li::before {
		content: "• ";
	}

	.medien-box td[colspan] ul{
		column-width:15em;
		column-gap:2em
	}
}

/* Bilder skalieren auf Boxbreite */
.medien-box img {
	width:auto;
	max-width:100%;
	height:auto;
	max-height:100%;
}

.medien-box[title="Eckdaten eines Rundfunksenders"] td:not(.medien-titel) img{
	max-height:180px;
}

/* vermeidet zu schmale Textzeilen */
@media (max-width: 768px){
	.float-right[id*="Synchronisation"]{
		float:none !important;
		margin-left:auto;
		margin-right:auto;
	}
}

/* Band-Design bei Schachtelung */
.medien-box .medien-box {
	display:contents !important;
	font-size:inherit;
}

.medien-filmtv th, .medien-videospiel th{
	background-color:#F4F4F7;
	background-color:RGBA(150,150,175,.1);
	font-weight:inherit;
}

.medien-filmtv tr>:nth-child(2){
	width:70%;
}

/* Thematisch eingefaerbte Titelzeilen */
.medien-box tr:first-child .medien-titel{
	font-weight:bold;
}

.medien-box .medien-titel,
[id*="Synchronisation"] td[colspan]{
	text-align:center;
}

.medien-titel td, .medien-titel th{
	background-color:transparent;
}

.medien-hoerfunk tr:first-child .medien-titel{
	background-color:#B0C4DE;
}

.medien-hoerfunk .medien-titel{
	background-color:#DEE5EE;
}

.medien-website tr:first-child .medien-titel{
	background-color:#C7CDD9;
	background-color:RGBA(135,206,235,.5);
}

.medien-website .medien-titel{
	background-color:#EAECF0;
	background-color:RGBA(135,206,235,.3);
}

.medien-videospiel tr:first-child .medien-titel{
	color:white;
	background-color:#444444;
}

.medien-videospiel .medien-titel{
	background-color:#444444;
}

.medien-youtube tr:first-child .medien-titel{
	background-color:#FC493B;
}

.medien-youtube .medien-titel{
	background-color:#444444;
}

.medien-filmtv tr:first-child .medien-titel,
[id*="Synchronisation"] tr:first-child th{
	background-color:#DCDCF5;
	background-color:RGBA(155,155,225,.35);
}

.medien-filmtv .medien-titel,
[id*="Synchronisation"] th{
	color:inherit !important;
	background-color:#EBEBF9;
	background-color:RGBA(155,155,225,.35);
}