.textfield{
	position: relative;
	display: inline-block;
	//height: 72px;
	width: 100%;

	// border-top-right-radius: 4px;
	// border-top-left-radius: 4px;
	overflow: hidden;
	z-index: 1;
//
	//border: 0.2px solid red;               //←←←←←←←←←←←←←←←←←←←← 
 
	& > .elem {
		position: relative;
		display: block;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 56px;
		margin-bottom: 16px;
		
		background-color:lighten($c-b, 95%);
		//background-color: rgba(0, 0, 0, 0.02);
		padding-left: 12px;
		padding-top: 14px;
		padding-right: 50px;
		text-overflow: ellipsis;     //... at the end of input
		appearance: none;
		-webkit-appearance:none;

		@include font(body2, $c-b);
		font-weight: 700;

		outline-width: 0; //remove hightliter
		caret-color: $c-p; //blinking pointer
		border: none;		
		border-bottom: 1px solid lighten($c-b, 54%);

		//border: 0.2px solid green;               //←←←←←←←←←←←←←←←←←←←← 


		&:hover{
			background-color: rgba(0, 0, 0, 0.04);
		}
		&:focus{
			background-color: rgba(0, 0, 0, 0.06);
		}		
		& + .indicador{
			position: absolute;
			display: inline-block;
			bottom: 16px;
			height: 2px;
			width: 100%;
			background-color: $c-p;
			transform: scaleX(0);
		}

		&:focus{
			& + .indicador{
				transform: scaleX(1);
			}		
		}

		//border: 0.2px solid blue;               //←←←←←←←←←←←←←←←←←←←← 
	
	}/*elem*/



	& input[type="time"]{
		padding-top: 18px;

		  &::-webkit-datetime-edit-second-field {
		    border: 5px solid blue;   
		    display: none;            //←←←←←←←←←←←←←←←←←←←← 
		  }

	 }

}

.c100 {
	display: flex;
	align-items: center;
	// background-color:lighten($c-b, 95%);
	border-bottom: 1px solid black;

}

.quick-form{
	//font-size: 88px;
	//position: absolute;
	right: 5px;
	top: 5px;
	font-size: 15px;
	width: 30px;
	height: 36px;
	border-style: none;
	background-color: #0078d4;
	color: white;
	cursor: pointer;

	&:hover {
		background-color: $cpe;
	}
}