
html {
	
      /* font-size: 62.5%; */
      /* box-sizing: border-box; */
	  /* color: white; */
    }

    /* *, */
    /* *::before, */
    /* *::after { */
      /* margin: 0; */
      /* padding: 0; */
      /* box-sizing: inherit; */
    /* } */
	
/* #p1Name, #p2Name{ */
    /* font-size: 2vw; */
/* } */

/* . - class , # - id */

.focus-board {
		border-color: orange!important;
}

.winner {
	/* border-color:red; */
	color: yellow!important;
	/* border-bottom: 4px ridge white; */
	padding: 0 0 0 0;
	margin-bottom: 0;
}

#p1Remaining , #p2Remaining{
	font-size: 160%;
	/* border-top: 4px ridge white; */
	/* padding:0; */
	/* margin-bottom:0; */
}

/* #p1lchev, #p1rchev, #p2lchev, #p2rchev { */
	/* font-family: 'Arial'!important; */
/* } */

#playerscore{
	/* background-width:2px; */
	/* border-style: none; */
	border-style: none;
	font-size: 140%!important;
}

#nonfocusPlayer {
	background-color:#343a40!important;
	/* border-width:2px; */
}

#score {
	/* border-width:2px; */
	/* font-family: 'Just Another Hand', cursive; */
	/* font-size: 90%; */
	width:  90%;
	height:10%;
	text-align: center; 
	background-color: #254855;
	color: yellow;
}

#p1Dot {
	right: 8px;
	font-size: 365%;
	position: absolute;
	padding-bottom: 0;
	color: orange;	
}

#p2Dot {
	left: 8px;
	font-size: 365%;
	position: absolute;
	padding-bottom: 0;
	color: orange;	
}

.p1Throws {
	/* padding-left: 1px; */
	left: 8px;
	font-size: 65%;
	position: absolute;
	padding-top: 6px;
}

.p2Throws {
	right: 8px;
	font-size: 65%;
	position: absolute;
	padding-top: 6px;
}

.stats{
	background-color: #254855;	
	color: white;
	letter-spacing: 2px;
	font-size: 65%;
	/* line-height: 1!important; */
	padding-top: 6px;
	padding-bottom: 6px;
}

.SetsLegs {
	line-height: 100%!Important;
}

.stats td{
	padding-top: 6px;
	padding-bottom: 6px;
}

#remainingScore{
	 border-style: 8px solid red;
}

.active {
	/* color: yellow!important; */
	background-color: orange!important;
}
 
.activePanel {
	/* color: yellow!important; */
	border-color: orange!important;
}

.inactive {
	color: yellow!important;
	background-color: #254855;
	/* border: 2px solid yellow!important; */
	/* border-radius: 10px; */
}
#p1Panel, #p2Panel {
	border-width: 6px;
}

#p1Header , #p2Header {
	color: yellow;
	border: none;
	background-color: #254855;
	border-width: 0;
	/* border-bottom: 4px ridge white; */
}

table {
	border-collapse: separate;
}

#p1Table , #p2Table {
	letter-spacing: 3px;
	/* background-color: #254855;  */
	/* font-family: 'Just Another Hand', cursive; */
	font-size: 85%;
	color: orange;
}
#p1LegsSets, #p2LegsSets {
	margin-right: 0!Important;
    margin-left: 0!Important;
}

#remainingScore{
	/* border-top: 4px ridge white; */
	/* border-top: 4px ridge white; */
	padding:0 0 0 0;
	margin-bottom:0;}

	input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0;
  background-color: #994855!important;
}

textarea:focus, input:focus{
    outline: none;
}

wrapper {
  margin: auto;
  display: flex;
  text-align: center!important;
  /* justify-content: center; */
}

.hidden {
  display: none
}

 label{
	text-align: center!important;
	letter-spacing: 3px;
	vertical-align: middle;
	/* width: 100%; */
}

.table-sum {
	border-bottom: 4px solid white!important; 
}

    .calculator {
      /* border: 1px solid #ccc; */
      border-radius: 3px;
      /* position: absolute; */
      /* top: 50%; */
      /* left: 50%; */
	  padding: 2%; 
      /* transform: translate(-50%, -50%); */
      /* width: 360px; */
    }
	
    .calculator-keys{
	  /* font-size: 5%; */
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-gap: 10px 10px;
	  /* margin: 0 1% 5%; */
      /* padding: 2%; */
	}
	
    .calculator-keys button{
		/* height: 60%; */
		/* font-size: 90%; */
		/* padding: 6%; */
		touch-action: manipulation;
	}
	
	.equal-sign {
      /* height: 93%!important; */
      grid-area:  1 / 4 / span 4 / span 1;
    }
	
	
	
	
.btn3d {
	position: relative;
	top: -6px;
	border: 0;
	transition: all 40ms linear;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 2px;
	margin-right: 2px;
}

.btn3d:active:focus,
.btn3d:focus:hover,
.btn3d:focus {
	-moz-outline-style: none;
	outline: medium none;
}

.btn3d:active,
.btn3d.active {
	top: 2px;
}

.btn3d.btn-white {
	color: #666666;
	box-shadow: 0 0 0 1px #ebebeb inset, 0 0 0 2px rgba(255, 255, 255, 0.10) inset, 0 8px 0 0 #f5f5f5, 0 8px 8px 1px rgba(0, 0, 0, .2);
	background-color: #fff;
}

.btn3d.btn-white:active,
.btn3d.btn-white.active {
	color: #666666;
	box-shadow: 0 0 0 1px #ebebeb inset, 0 0 0 1px rgba(255, 255, 255, 0.15) inset, 0 1px 3px 1px rgba(0, 0, 0, .1);
	background-color: #fff;
}

.btn3d.btn-default {
	color: #666666;
	box-shadow: 0 0 0 1px #ebebeb inset, 0 0 0 2px rgba(255, 255, 255, 0.10) inset, 0 8px 0 0 #BEBEBE, 0 8px 8px 1px rgba(0, 0, 0, .2);
	background-color: #f9f9f9;
}

.btn3d.btn-default:active,
.btn3d.btn-default.active {
	color: #666666;
	box-shadow: 0 0 0 1px #ebebeb inset, 0 0 0 1px rgba(255, 255, 255, 0.15) inset, 0 1px 3px 1px rgba(0, 0, 0, .1);
	background-color: #f9f9f9;
}	
	
.card {
	background-color: #254855;		
}
	
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	letter-spacing: 0;
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
	letter-spacing: 0;
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
	
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {...}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {...}