body {
  padding: 0px;
  margin: 0px;
  font-size: 12px;
  color: #666666;
  font-family: Noto Sans, sans-serif;
  background-color: #E8E8E8;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.center {
  text-align: center;
}

/* Track */
::-webkit-scrollbar-track {
  background: rgb(128,128,128); 
}
/* Handle */
::-webkit-scrollbar-thumb {
  background: rgb(196,196,196); 
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* confirm */
.login_container {
  position: relative;
}
.logo_container {
  position: relative;
  margin-left: calc(50vw - 25vh);
  height: 50vh;
  width: 50vh;
  background-image: url(../images/fitness.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 50%;
}
.logo_name {
  position: absolute;
  top: 37vh;
  left: 0px;
  width: 100%;
  text-align: center;
  font-size: 6vh;
  font-weight: bold;
  color: #808080;
}
.login_base {
  position: absolute;
  top: calc(50vh - 22px);
  left: calc(50vw - 122px);
}
.confirm_win_base {
	position: fixed;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 999999;
	background-color: rgba(0,0,0,0.5);
}
.confirm_win_base .confirm_win {
  position: absolute;
  top: calc(50vh - 45vmin);
  left: calc(50vw - 45vmin);
  width: 90vmin;
  height: 90vmin;
  font-size: 10vmin;
  background-color: #FFFFFF;
  box-shadow: 0.5vmin 0.5vmin 2vmin #000000;
}
.confirm_win_base .confirm_win .cancel {
  position: absolute;
  top: 2%;
  right: 2%;
  width: 8%;
  height: 8%;
  font-size: 50%;
  border-radius: 25%;
  text-align: center;
  cursor: pointer;
  -moz-transition: all .2s linear;
	-o-transition: all .2s linear;
	-webkit-transition: all .2s linear;
	transition: all .2s linear;
  background-color: rgb(245,245,245);
}
.confirm_win_base .confirm_win .cancel:hover {
  background-color: rgb(225,225,225);
}
.confirm_win_base .confirm_win .cancel:active {
  background-color: rgb(192,192,192);
}
.confirm_win_base .confirm_win .caption {
  position: absolute;
  top: 2%;
  left: 4%;
  width: 85%;
  font-size: 60%;
  font-weight: bold;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.confirm_win_base .confirm_win .animation {
  position: absolute;
  top: 10%;
  left: 30%;
  width: 40%;
  height: 40%;
  background-color: rgb(255,255,255);
  background-size: cover;
  background-repeat: no-repeat;
}
.confirm_win_base .confirm_win .units {
  position: absolute;
  top: 63%;
  left: 0%;
  width: 100%;
  font-size: 20%;
  text-align: center;
}
.confirm_win_base .confirm_win .info {
  position: absolute;
  top: 68%;
  left: 4%;
  width: 26%;
  font-size: 28%;
  text-align: left;
}
.confirm_win_base .confirm_win .info b {
  display: inline-block;
  font-size: 60%;
  background-color: #DDDDDD;
  padding-left: 1vmin;
  padding-right: 1vmin;
  border-radius: 1vmin;
}
.confirm_win_base .confirm_win .info a {
  display: inline-block;
  font-size: 80%;
  background-color: #EEEEEE;
  text-decoration: none;
  color: #DD0000;
  padding: 1vmin 3vmin;
  border-radius: 2vmin;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.confirm_win_base .confirm_win .info a:hover {
  background-color: #F8F8F8;
  color: #AA0000;
}
.confirm_win_base .confirm_win .info2 {
  position: absolute;
  top: 68%;
  left: 32%;
  width: 64%;
  font-size: 25%;
  text-align: justify;
}
.confirm_win_base .confirm_win .form {
  position: absolute;
  top: 51%;
  left: 10vmin;
  width: 80vmin;
  font-size: 50%;
  text-align: center;
}

.form_input[type=submit] {
  border-radius: 50%;
  height: 10vmin;
  width: 10vmin;
  font-size: 2vmin;
  background: linear-gradient(#FFFFFF,#F8F8F8);
  color: #888888;
  border: none;
  outline: none;
  cursor: pointer;
}
.form_input[type=submit]:hover {
  background: linear-gradient(#FAFAFA,#F4F4F4);
}
.form_input[type=submit]:active {
  background-image: linear-gradient(#F4F4F4, #EAEAEA);
}
.form_input[type=button] {
  border-radius: 50%;
  height: 10vmin;
  width: 10vmin;
  font-size: 4vmin;
  background: linear-gradient(#EE0000,#880000);
  color: #FFFFFF;
  border: none;
  outline: none;
  cursor: pointer;
}
.form_input[type=button]:hover {
  background: linear-gradient(#F40000,#950000);
}
.form_input[type=button]:active {
  background-image: linear-gradient(#EE0000, #660000);
}
.form_input[type=number] {
  height: 10vmin;
  width: 16vmin;
  text-align: center;
  border-radius: 5vmin;
  font-size: 4vmin;
  border: 1px solid #CCCCCC;
  background-image: linear-gradient(#F8F8F8, #FFFFFF);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  outline: none;
}
.form_input[type=number]:hover {
  background-image: linear-gradient(#F4F4F4, #FFFFFF);
}
.form_input[type=number]:focus {
  background-image: linear-gradient(#F4F4F4, #FFFFFF);
  border: 1px solid #888888;
}

.spacer {
  padding-bottom: 8%;
}