
.full-width {
	width: 100%;
}



.top {
	vertical-align: top;
}
.bottom {
	vertical-align: bottom;
}

.left {
	text-align: left;
}
.right {
	text-align: right;
}
.center {
	text-align: center;
}



.zebra-odd, .zebra tbody tr:nth-child(odd) {	background-color: rgba(0,0,0,.1);}
.zebra-even, .zebra tbody tr:nth-child(even) {	background-color: rgba(0,0,0,.2);}

@media (prefers-color-scheme: dark) {
	.zebra-odd, .zebra tbody tr:nth-child(odd) 		{	background-color: rgba(255,255,255,.1);}
	.zebra-even, .zebra tbody tr:nth-child(even) 	{	background-color: rgba(255,255,255,.2);}
}	

.fill {
	background-size: cover;
	background-position: center;
	width: 100%;
	height: 100%;
}

.container-fill {
	height: 100%;
	width: 100%;
	object-fit: cover;
}



thead {
	background-color: rgba(0,0,0,.3);
}

thead th { 
	vertical-align: bottom; 
	border: 1px solid rgb(125,125,125);
}

.player-list td {
	border-right: 1px solid rgba(0,0,0,.3);
}
.player-list td:first-child {
	border-left: 1px solid rgba(0,0,0,.3);
}

.light-text {
	color: rgba(0,0,0,.5);
}

.vertical { 
	writing-mode: vertical-lr;
	transform: rotate(-180deg);
	text-align: left;
	vertical-align: baseline;
}




.share-button {
    cursor:pointer; 
    display:inline-block;
    font-size:0;
    border-radius: 10px;
    border-width: 2px;
	border-style: solid;	
}

.header-info-section .share-button {
	color: #FFF;
	background-color: rgba(0,0,0,.7);
	border-color: rgba(255,255,255,.7);    
}

.share-button .icon {
    display:inline-block;
    margin: 0px 2px;
}

.share-button.small {
    border-radius: 10px;
	padding: 2px;	
}
.share-button.small .icon {
    margin: 0px 2px;
}
.share-button .share-title {
    display:inline-block;
    padding: 5px;
    vertical-align:top; 
    font-size: 15px;
}
.share-button.small .share-title {
    padding: 2px; 
    font-size: 12px;
	line-height: 12px;
}




@media (max-width: 768px) {

	.map-zoom-actions span {
		font-size: .8rem;
		line-height: .8rem;
	}
}


@media (prefers-color-scheme: dark) {	
	thead {	background-color: rgba(255,255,255,.3);}
	thead th {border-color: rgba(255, 255, 255, .3);}				
				
	.player-list td { border-color: rgba(255,255,255,.3);}
	.light-text { color: rgba(255,255,255,.5);}
	
	.map-zoom-actions span {
		background-color: rgba(255,255,255,.2);
		color: #fff;	
		}

}



