body { padding-top: 70px; }

#characterRow > div{
	padding:0px;
	background-position: top center;
	border:2px solid #333;
	max-width: 300px;
}
#characterRow > div:after{
	display: block;
	content: '';
	border-bottom:8px solid #FF3;
	transition: width .5s ease, background-color .5s ease;
	transform: scaleX(0.0001);  
  	transition: transform 250ms ease-in-out;
}
#characterRow > div:hover:after {
  transform: scaleX(1)
}

.characterSelecter{
	margin:0px;
}
.characterSelecter > input{ /* HIDE RADIO */
  display:none;
}
.characterSelecter > input + img{ /* IMAGE STYLES */
  cursor:pointer;
  border:none;
}
.characterSelecter > input:checked + img{ /* (CHECKED) IMAGE STYLES */
  border:2px solid #00f;
}

.winContainer{
	width:76px;
}

.winContainer span{
	padding:0px 4px;
	color:#F5F5F5;
}

.extraIn{
	padding-left: 30px;
	padding-right: 30px;
}

.threeFrame{
	background-color: #B80028;
}
.fourFrame{
	background-color: #FF5B00;
}
.fiveFrame{
	background-color: #FFC200;
}


.moveActive{
	background-color: #5cb85c;
}


#currentKnockdownRow > .moveName{
	text-align: center;
	max-width: none;
	overflow: hidden;
    white-space: nowrap;
    min-width: 124px;
	max-width: none;
}

#frames{
	margin-bottom: 0px;
}

#frames > td{
	max-width:16px;
	min-width:16px;
	border:1px solid #CCC;
}

#frames > th{
	max-width:16px;
	min-width:16px;
	border:1px solid #CCC;
}

#currentKnockdownRow .target{
	border-right:2px solid red;
	/*background-color: #c9302c;*/
}

#fullPage{
	margin:10px;
}

/*#buttonRow {
	min-height:140px;
}*/

#buttonRow > button{
	margin: 3px;
	margin-left:0px;
}

#characterSelectRow{
	min-width:145px;
	min-height:145px;
	margin-bottom: 10px;
}
#characterSelectRow > button{
	width:100%;
	max-height: 200px;
}

#currentSetupInfo > td{
	text-align: center;
}

#movesRow{
	margin-top: 20px;
}

#movesRow > button{
	margin: 3px;
	margin-left:0px;
	text-align: left;
	overflow: hidden;
}
#KDButton {
	margin-top: 5px;
}
#CSButton{
	overflow: hidden;
}
#CSButton > img {
	width: 100%;
}

.scoreInput{
	width: 40%;
}



/*/draggin stuffs/*/

body.dragging, body.dragging * {
  cursor: move !important;
}

.dragged {
  position: absolute;
  opacity: 0.5;
  z-index: 2000;
}

ol.movesList li.placeholder , ol.knockdownList li.placeholder {
  position: relative;
  /** More li styles **/
  list-style: circle;
}

ol.movesList li.placeholder:before , ol.knockdownList li.placeholder:before {
  position: absolute;
  /** Define arrowhead **/
}

ol.movesList li , ol.knockdownList li{
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none;   /* Chrome/Safari/Opera */
	-khtml-user-select: none;    /* Konqueror */
	-moz-user-select: none;      /* Firefox */
	-ms-user-select: none;       /* Internet Explorer/Edge */
	user-select: none;   
}
ol.movesList li:hover , ol.knockdownList li:hover{
	cursor: move !important;
}