* {
	box-sizing: border-box;	
}


body {
margin: 0;

}

.card-image {
	background-repeat: no-repeat;
	background-color: white;
	border: 1px solid black;

}

.card.marked .card-image {
        background-color: yellow;
}

.hand {
	font-size: 0px;
	text-align: center;
	
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}

.right {
	float: right;
	clear: right;
}

#hand-W .suit {
	float: left;
	clear: left;
}


#hand-E .suit {
	clear: right;
	float: right;
}

#table {
        position: relative;
	background-color: green;
	z-index: 2;
}


.player-label {
	background-color: cyan;
	text-align: center;
	font-weight: bold;
	font-family: sans-serif;
}


.player-label-solver {
	background-color: DarkSlateBlue;
}

.player-label-onplay .player-seat {
	background-color: yellow;
}


.player-seat {
}


#label-N, #label-S, #label-W, #label-E {
	position: absolute;
}

.hand {
	position: absolute;
	white-space: nowrap;
	overflow: hidden;
}


#trick {
	position: absolute;
}


.trick {
	position: absolute;
}


.trick-start {
	display: none
}


#bidding {
	position: absolute;
}



#bidding-tab {
 	border-collapse: collapse;
	background-color: Khaki;
	width: 100%;
	font-family: Sans-serif;
	font-weight: bold;
}


#bidding-tab td,th {
	text-align: center;
	vertical-align: middle;
	width: 25%;
}


.bidding-head {
	background-color: GoldenRod;
}


.bid-comment {
	cursor: default;
}
	 

#trick-stack {
	position: absolute;
}


#old-trick {
	display: none;
	position: absolute;
	border: solid black 1px;
	background-color: gray;
	z-index: 100;
}

#old-trick-number {
	position: absolute;
	font-family: sans-serif;
	font-weight: bold;
}



#status-line {
	position: absolute;
	background-color: Khaki;
	font-family: sans-serif;
	font-weight: bold;
}


#deal-info {
	position: absolute;
	text-align: center;
	font-family: sans-serif;
        font-weight: bold;
}


#deal-info p {
	vertical-align: middle;
}


.dlvl-1 {
	background-color: yellow;
}


.dlvl-2 {
	background-color: lime;
}


.dlvl-3 {
	background-color: red;
}


.dlvl-4 {
	background-color: black;
	color: white; 
}



#contract {
	float: left;
}


#score {
	float: right;
}


#trick .level_0 {
    z-index: 50;
}

#trick .level_1 {
    z-index: 51;
}

#trick .level_2 {
    z-index: 52;
}

#trick .level_3 {
    z-index: 53;
}




.level_0 {
	transform: translate3D(0, 0, 10px);
}


.level_1 {
	transform: translate3D(0, 0, 20px);
}


.level_2 {
	transform: translate3D(0, 0, 30px);
}


.level_3 {
	transform: translate3D(0, 0, 40px);
}



.level_4 {
	transform: translate3D(0, 0, 50px);
}


.level_5 {
	transform: translate3D(0, 0, 60px);
}


.level_6 {
	transform: translate3D(0, 0, 70px);
}


.level_7 {
	transform: translate3D(0, 0, 80px);
}


.level_8 {
	transform: translate3D(0, 0, 90px);
}


.level_9 {
	transform: translate3D(0, 0, 100px);
}


.level_10 {
	transform: translate3D(0, 0, 110px);
}


.level_11 {
	transform: translate3D(0, 0, 120px);
}


.level_12 {
	transform: translate3D(0, 0, 130px);
}




.S.color {
	color: mediumblue;
	font-size: 130%;
}

.H, .rb.D {
	color: red;
	font-size: 130%;
}

.color.D {
	color: OrangeRed;
	font-size: 130%;
}

.C {
	color: black;
	font-size: 100%;
}


.rb.D {

}


.rb.H {
	color: red;
	font-size: 100%;	
}

.rb.C {
	color: black;
	font-size: 100%;
}

.rb.S {
	color: black;
	font-size: 110%;
}


.bid-pass {
	font-weight: normal;
}


#button-row {
	position: absolute;
	border-top: solid black 1px;
	background-color: white;
}


button {
	border: 1px solid black;
	border-radius: 5px;
	color: black;
}

button.green {
	background-color: limegreen;
}

button.yellow {
	background-color: yellow;
}

button:disabled {
	color: gray;
}

#button-solution {
	float: right;
}


#dds-indicator {
	float: right;
}

#dds-indicator.ddsfail {
	background-color: red;
}


#dds-indicator.ddsok {
	background-color: green;

}

#text-view {
	position: absolute;
	margin: 0px;
	background-color: white;
	display: none;
}



.msg {
	position: absolute;
	display: none;
	font-family: sans-serif;
	font-weight: bold;
	text-align: center;
	padding: 4px;
}


.msg-fail {
	background-color: red;
}

.msg-success {
	background-color: yellow;
}


.msg-cont {
	border: solid black 1px;
	background-color: white;
}