#developer_toolbar {
  display: none;
}


.uk-button-primary,
.uk-background-primary {
  background-color: #77913f;
  color: #fff;
}
#top-head .uk-background-primary * {
  color: #fff;
}

.uk-button-primary:hover,
.uk-button-primary:focus
{
  background-color: #59751e;
  color: #fff;
}

.uk-card {
  border-radius: 10px;
}



#top-head {
  box-shadow: 2px 0px 3px 1px rgb(0 0 0 / 75%);
}
#top-head > .uk-background-primary
{
  background-color: #77913f;
  background: linear-gradient(#5f7432, #99b955);
}

#left-col {
  box-shadow: 0px 2px 3px 1px rgb(0 0 0 / 75%);
}

.left-logo {
  background: linear-gradient(#242b30,#34414a);
}



.counterpitch-listbox {
}
.counterpitch-listbox-item
{
  background-color: rgb(240,240,240);
  border-radius: 10px;
}



.counterpitch-practice-records {
  display: flex;
  flex-direction: column;
}



.counterpitch-pitchbox-container
{
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  min-height: 0;
}

.counterpitch-pitchbox
{
  height: 100%;
/*width: 54%;*/
  width: auto;
  margin: 0 auto;

  display: block;

  position: absolute;
  box-sizing: border-box;

  left: auto;
  z-index: 0;
  overflow: visible;

  transition: 0.5s;
/*
  background-image: url("../assets/pitchbox_bg.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
*/
}


.counterpitch-practice-input
{
  display: flex;
  position: relative;
  flex-direction: column;
  height: 100%;
}
.counterpitch-practice-input .counterpitch-practice-stats
{
  flex: 1 1 auto;
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  text-align: center;
  justify-content: space-around;
}
.counterpitch-practice-input .counterpitch-practice-stats > * {
  min-width: 80%;
  flex-basis: 100%;
}

.counterpitch-practice-input .uk-button {
  padding: 0 15px;
}
.counterpitch-practice-input .uk-button,
.counterpitch-practice-input .uk-select {
  border-radius: 10px;
}

.counterpitch-practice-input .counterpitch-pitchbox-container {
  flex: 1 1 auto;
}
@media screen and (max-width: 499px)
{
  .counterpitch-practice-input {
	height: auto;
  }
  .counterpitch-practice-input .counterpitch-pitchbox {
	position: relative;
	width: 100%;
	height: auto;
  }

  .counterpitch-practice-input .counterpitch-pitchbox .counterpitch-pitchbox-bg {
	width: 100%;
	height: auto;
  }
}

.counterpitch-pitchbox .counterpitch-pitchbox-bg
{
  width: auto;
  height: 100%;
  position: static;
  max-width: none;
  z-index: 0;
}
.counterpitch-pitchbox.lefthanded .counterpitch-pitchbox-bg
{
  transform: scaleX(-1);
}

.counterpitch-pitchbox.unfocused
{
  --NO-transform: 'scale(0.25, 0.25)';
/*width: 10%;*/
  height: 17%;
}

.counterpitch-pitchbox-outter
{
  box-sizing: border-box;
  display: block;
  position: absolute;
  z-index: 1;

  border-top: 2px solid rgba(0,0,0,0.5);
  border-left: 2px solid rgba(0,0,0,0.5);
  border-right: 2px solid rgba(0,0,0,0.5);
  border-bottom: 2px solid rgba(0,0,0,0.5);

/*background: #ddd;*/

  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.counterpitch-pitchbox-inner
{
  box-sizing: border-box;
  position: relative;

/*display: grid;
  grid-template-columns: repeat(3, 1fr);
*/
  display: grid;
/*
  grid-template-columns: 40% 11.0% 11.0% 11.0% auto;
  grid-template-rows   : 29% 12.0% 12.0% 12.0% auto;
*/
  grid-template-columns: 40% 33.0% auto;
  grid-template-rows   : 29% 36.0% auto;

  gap: 0px 0px;
/*
  grid-template-areas:
    "g1 g2 g2 g2 g3"
    "g4 z1 z2 z3 g5"
    "g4 z4 z5 z6 g5"
    "g4 z7 z8 z9 g5"
    "g6 g7 g7 g7 g8";
*/
/*
  grid-template-areas:
    "r1 r2 r3"
    "r4 r5 r6"
    "r7 r8 r9";
*/
  height: 100%;
  width: 100%;
}
.counterpitch-pitchbox-region
{
  display: grid;
  box-sizing: border-box;
  position: relative;

  grid-template-columns: 33.333% auto 33.333%;
  grid-template-rows: 33.333% auto 33.333%;

  height: 100%;
  width: 100%;
}
.counterpitch-pitchbox.lefthanded .counterpitch-pitchbox-inner
{
  grid-template-columns: 27% 33.0% auto;
/*grid-template-areas:
    "g3 g2 g2 g2 g1"
    "g5 z3 z2 z1 g4"
    "g5 z6 z5 z4 g4"
    "g5 z9 z8 z7 g4"
    "g8 g7 g7 g7 g6";*/
}

.counterpitch-pitchbox-gutter[data-grid-cell="g1"] { grid-area: g1; }
.counterpitch-pitchbox-gutter[data-grid-cell="g2"] { grid-area: g2; }
.counterpitch-pitchbox-gutter[data-grid-cell="g3"] { grid-area: g3; }
.counterpitch-pitchbox-gutter[data-grid-cell="g4"] { grid-area: g4; }
.counterpitch-pitchbox-gutter[data-grid-cell="g5"] { grid-area: g5; }
.counterpitch-pitchbox-gutter[data-grid-cell="g6"] { grid-area: g6; }
.counterpitch-pitchbox-gutter[data-grid-cell="g7"] { grid-area: g7; }
.counterpitch-pitchbox-gutter[data-grid-cell="g8"] { grid-area: g8; }

.counterpitch-pitchbox-cell[data-grid-cell="z1"] { grid-area: z1; }
.counterpitch-pitchbox-cell[data-grid-cell="z2"] { grid-area: z2; }
.counterpitch-pitchbox-cell[data-grid-cell="z3"] { grid-area: z3; }
.counterpitch-pitchbox-cell[data-grid-cell="z4"] { grid-area: z4; }
.counterpitch-pitchbox-cell[data-grid-cell="z5"] { grid-area: z5; }
.counterpitch-pitchbox-cell[data-grid-cell="z6"] { grid-area: z6; }
.counterpitch-pitchbox-cell[data-grid-cell="z7"] { grid-area: z7; }
.counterpitch-pitchbox-cell[data-grid-cell="z8"] { grid-area: z8; }
.counterpitch-pitchbox-cell[data-grid-cell="z9"] { grid-area: z9; }

.counterpitch-pitchbox_pitch
{
	position: absolute;
	background: white !important;
	color: red;
	/*border:1px solid rebeccapurple;*/
	margin-top: -3%;
	margin-left: -3%;
	width: 6%;
	height: 0;
	padding-bottom: 6%;
	border-radius: 50%;

	background-image: url("../icons/baseball-svgrepo-com.svg") !important;
	background-repeat: no-repeat;
	background-size: cover;
}

.counterpitch-pitchbox-gutter
{
  background: rgba(216, 216, 216, 0.2);
/*border-right: 1px solid rgba(0,0,0,0.5);
  border-bottom: 1px solid rgba(0,0,0,0.5);*/
  /*padding: 0.1rem;*/

  transition: 0.25s;
  cursor: crosshair;

  position: relative;
}/*
.counterpitch-pitchbox-gutter[data-grid-cell="g2"] {
  border-bottom: 1px solid rgba(0,0,0,0.5);
}
.counterpitch-pitchbox-gutter[data-grid-cell="g4"] {
  border-right: 1px solid rgba(0,0,0,0.5);
}*/
.counterpitch-pitchbox-gutter.counterpitch-pitchbox-cell-highlighted,
.counterpitch-pitchbox-gutter:hover {
  background: rgba(117, 30, 30, 0.5);
}


.counterpitch-pitchbox-cell
{
  border-right: 3px solid rgba(255,255,255,0.5);
  border-bottom: 3px solid rgba(255,255,255,0.5);
  /*padding: 0.1rem;*/

  transition: background 0.25s, border-width 0s;

  cursor: crosshair;

  position: relative;
}

.counterpitch-pitchbox.unfocused .counterpitch-pitchbox-cell {
  border-width: 0.5px;
}

.counterpitch-pitchbox/*:not(.lefthanded)*/ .counterpitch-pitchbox-cell[data-grid-cell="r5c1"],
.counterpitch-pitchbox/*:not(.lefthanded)*/ .counterpitch-pitchbox-cell[data-grid-cell="r5c4"],
.counterpitch-pitchbox/*:not(.lefthanded)*/ .counterpitch-pitchbox-cell[data-grid-cell="r5c7"] {
  border-left: 3px solid rgba(255,255,255,0.5);
}
/*
.counterpitch-pitchbox.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c1"],
.counterpitch-pitchbox.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c4"],
.counterpitch-pitchbox.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c7"] {
  border-left: none;
}
.counterpitch-pitchbox.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c3"],
.counterpitch-pitchbox.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c6"],
.counterpitch-pitchbox.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c9"] {
  border-left: 3px solid rgba(255,255,255,0.5);
}*/
.counterpitch-pitchbox-cell[data-grid-cell="r5c1"],
.counterpitch-pitchbox-cell[data-grid-cell="r5c2"],
.counterpitch-pitchbox-cell[data-grid-cell="r5c3"] {
  border-top: 3px solid rgba(255,255,255,0.5);
}

.counterpitch-pitchbox-cell-highlighted,
.counterpitch-pitchbox-cell:hover {
  background: rgba(89, 117, 30, 0.5);
}

/******************/
/* Report mode overrides: */
.counterpitch-pitchbox.pitchbox_mode-report {
}
.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox-bg {
  visibility: hidden;
}

.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox-inner
{
  grid-template-columns: 20% 60.0% auto;
  grid-template-rows   : 15% 70.0% auto;
}

.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox-cell {
  cursor: default;
  background: rgb(255,255,255);

  border-right: 1px solid rgba(0,0,0,0.5);
  border-bottom: 1px solid rgba(0,0,0,0.5);
}

.counterpitch-pitchbox.pitchbox_mode-report/*:not(.lefthanded)*/ .counterpitch-pitchbox-cell[data-grid-cell="r5c1"],
.counterpitch-pitchbox.pitchbox_mode-report/*:not(.lefthanded)*/ .counterpitch-pitchbox-cell[data-grid-cell="r5c4"],
.counterpitch-pitchbox.pitchbox_mode-report/*:not(.lefthanded)*/ .counterpitch-pitchbox-cell[data-grid-cell="r5c7"] {
  border-left: 1px solid rgba(0,0,0,0.5);
}
/*
.counterpitch-pitchbox.pitchbox_mode-report.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c1"],
.counterpitch-pitchbox.pitchbox_mode-report.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c4"],
.counterpitch-pitchbox.pitchbox_mode-report.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c7"] {
  border-left: none;
}
.counterpitch-pitchbox.pitchbox_mode-report.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c3"],
.counterpitch-pitchbox.pitchbox_mode-report.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c6"],
.counterpitch-pitchbox.pitchbox_mode-report.lefthanded .counterpitch-pitchbox-cell[data-grid-cell="r5c9"] {
  border-left: 1px solid rgba(0,0,0,0.5);
}*/
.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox-cell[data-grid-cell="r5c1"],
.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox-cell[data-grid-cell="r5c2"],
.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox-cell[data-grid-cell="r5c3"] {
  border-top: 1px solid rgba(0,0,0,0.5);
}

.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox-gutter {
  cursor: default;
  background: rgb(192,192,192);
}

.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox_pitch
{
  margin-top: -3px;
  margin-left: -3px;
  width: 6px;
  padding-bottom: 6px;
/*background-image: radial-gradient(circle, rgba(255,0,0,1) 0%, rgba(255,0,0,1) 50%, rgba(0,0,0,1) 100%);*/
  background-image: url("../icons/pitch-dot.svg") !important;
  background-size: cover;
  border-radius: 0;
  background-color: transparent !important;
}
.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox_pitch-strike {
  background-image: url("../icons/pitch-dot-strike.svg") !important;
}
.counterpitch-pitchbox.pitchbox_mode-report .counterpitch-pitchbox_pitch-ball {
  background-image: url("../icons/pitch-dot-ball.svg") !important;
}

/******************/

.counterpitch_fieldbox
{
  position: absolute;
  right: 0;
/*border: 1px solid red;*/
  transition: 0.5s;

  width: 100%;
  height: auto;
}
.counterpitch_fieldbox.unfocused
{
  width: 25%;
  height: auto;
}
.counterpitch_fieldbox,
.counterpitch_fieldbox *,
.counterpitch_fieldbox img {
  user-select: none;
}

.counterpitch_fieldbox .counterpitch-field-position
{
  position: absolute;
  top: 0;
  left: 0;
  background: white;
  color: black;
  border: 2px solid #777;
  margin-top: -5%;
  margin-left: -5%;
  width: 10%;
  height: 0;
  padding-bottom: 10%;
  border-radius: 50%;

  background-image: none; /*url("../icons/baseball-svgrepo-com.svg");*/
  background-repeat: no-repeat;
  background-size: cover;

  text-align: center;
  font-size: 28pt;
  line-height: 2.2;

  cursor: pointer;
  user-select: none;
}
.counterpitch_fieldbox.unfocused .counterpitch-field-position
{
  font-size: 10pt;
  transition: all;
}

.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="1"]
{ /* Pitcher */
  top: 71%;
  left: 50%;
}
.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="2"]
{ /* Catcher */
  top: 92%;
  left: 50%;
}
.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="3"]
{ /* First Baseman */
  top: 71%;
  left: 67%;
}
.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="4"]
{ /* Second Baseman */
  top: 50%;
  left: 60%;
}
.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="5"]
{ /* Third Baseman */
  top: 71%;
  left: 33%;
}
.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="6"]
{ /* Shortstop */
  top: 50%;
  left: 40%;
}
.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="7"]
{ /* Left Fielder */
  top: 29%;
  left: 25%;
}
.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="8"]
{ /* Center Fielder */
  top: 19%;
  left: 50%;
}
.counterpitch_fieldbox .counterpitch-field-position[data-counterpitch-position="9"]
{ /* Right Fielder */
  top: 29%;
  left: 75%;
}
