html,body{
        height: 100%;
      }
      .loader{
        display: none;
      }
	 .loader2{
        display: none;
      }
		.label {
    margin-bottom: 0.25rem;
    padding: 7px 7px 7px 7px;
    background: #ffeb3b36;
    border-radius: 10px;
	font-size: 17px;
		}
		.button {
	width: 90px;
	border-radius: 26px;
    position: relative;
  	display: inline-block;
 	color: #777674;
  	font-weight: bold;
  	text-decoration: none;
  	text-shadow: rgba(255,255,255,.5) 1px 1px, rgba(100,100,100,.3) 3px 7px 3px;
  	user-select: none;
  	padding: 0.5em 0.5em;
  	outline: none;
  	background-image:
   	linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%),
   	linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
   	linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
   	linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
   	linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5)),
   	linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5));
  	background-repeat: no-repeat;
  	background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
  	background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
  	box-shadow: rgba(0,0,0,.5) 3px 10px 10px -10px;
	cursor: pointer;
}
	.button:hover {
  transition: .5s linear;
  background-position: -200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
}
	.button:active {
  top: 1px;
}
		#tab {
	width: 650px;
 	text-align: center;
	padding: 20px;
 	font-size: 20px;
 	border: 3px double #1e8cbe;
 	background-color: #ffe0b299;
 	border-radius: 12px;
 	position: absolute;
 	left: 50%;
	transform: translate(-50%);
	z-index: 1
	top: 60px;
		  }

	input[type="number"]:invalid+span:after {
	content: '✖';
	padding-left: 5px;
	color: red;
		}
 
	input[type="number"]:valid+span:after {
	content: '✓';
	padding-left: 5px;
	color: green;
		}
	b {
	color: rgba(0,0,0,0.6);
	text-shadow: 2px 8px 6px rgba(0,0,0,0.2),
    0px -5px 35px rgba(255,255,255,0.3);
		  }
.tab {
   	text-align: center;
    font-size: 20px;
    width: auto;
    overflow: hidden;
}

/* Style the buttons inside the tab */
.tab button {
    background-color: inherit;
    float: left;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 17px;
    width: 50%;
	background-color: #ffecd1;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
 	 background-color: #ffecd1;
    color: rgba(0,0,0,0.6);
    text-shadow: 2px 8px 6px rgb(0 0 0 / 20%), 0px -5px 35px rgb(255 255 255 / 30%);
    border-radius: 40px 0px 40px 0px;
	font-weight: 700;
;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border-top: none;
}

#main {
    width: 800px;
    height: auto;
    border: 2px solid;
    overflow: hidden;
}
#table{
    width: 100%;
    height: auto;
}
.lidate{
    list-style: none;
    display: block;
    padding: 5px 0 0 24px;
    border: 1px solid;
    line-height: 2.1;
}