	:root{
		--primary-color : #0071b3;
		--primary-color-washed : #0071b3bb;
		--lighter-color : #9f9f9f;
		--text-color    : #333;
		--success-color : #189b18;
		--error-color   : #cb4552;
		
	}
	.ast-label::selection {
		color: none;
		background: none;
	}
	
	
	.ast-input-group {
		display : inline-block;
		width : 100%;

		position : relative;
		padding : 0 0.75rem;
		color : var(--text-color);
		margin : 3px 0;
	}
	.ast-input-group>.ast-label{
		position: absolute;
		left: 0.75rem;
		bottom: 0;
		line-height: 1.3rem;
		/* font-size: 1.3rem; */
		font-weight : lighter;
		color : var(--lighter-color);
		transition : all 100ms linear;
		cursor : text;
	}	
	.ast-input-group>.ast-input{
		border-bottom : 1px solid var(--primary-color);
		margin-top : 20px;

		width : 100%;
		line-height: 1.5rem;
		background: transparent;
		font-size: 0.8rem;
	}	
	.ast-input,.ast-input:focus,.ast-input:active,.ast-input:focus-visible{
		border:0;outline:0;
	}
	.ast-input-group>.ast-label>i{
		font-size: 1rem;
		color: var(--primary-color);
		cursor: pointer;
		margin-right : 7px;
	}
	.ast-input[readonly]{
		color : #ccc!important;
		cursor : not-allowed;
	}
	.ast-input-group.active>.ast-label,.ast-input-group.input-filled>.ast-label, .ast-input-group.readonly>.ast-label,.ast-input-group.always-active>.ast-label{
		position: absolute;
		left: 0.75rem;
		bottom: 0.9rem;
		top: 0;
		
		font-size: 0.8rem;
		font-weight : lighter;
		color : var(--primary-color);
	}
	.ast-input-group.input-filled>.ast-label{
		color : var(--lighter-color);
	}
	
	.ast-input-group.active>.ast-input{
		border-bottom : 2px solid var(--primary-color);
		color : var(--primary-color);
	}
	
	.ast-input-group.ast-success>.ast-input{
		color : var(--text-color);
		border-bottom : 2px solid var(--success-color);
	}	
	.ast-input-group.ast-error>.ast-input{
		color : var(--error-color);
		border-bottom : 2px solid var(--error-color);
	}
	.ast-input-submit{
		border : 0;
		border-radius: 0rem;
		background : #003699;
		color: white;
		padding: 0.75rem;
		margin : 0.75rem 0;
	}
	.ast-input-submit:activ{
		color: white;
		background : #1c60b8;
	}
	.ast-input-submit:hover{
		color: white;
		background : #1c60b8;
	}
	.primary-background{
		background-color: var(--primary-color);
		color : white;
		font-size : 1rem;
	}
	.primary-background:hover{
		background : linear-gradient(0, var(--primary-color), var(--primary-color-washed));
	}	
	.primary-background:active{
		box-shadow : 0 0 3px var(--primary-color);
	}
	
	/* buuton with icon   */
	
	.ast-button {
		    border-radius: .25rem;
		transition:0.2s;
		border: none;
		padding-left: 0px;
		margin: 12px;
	}
	.ast-button:hover {
		
		box-shadow: 0 3px 6px rgb(0 0 0 / 16%), 0 1px 2px rgb(0 0 0 / 23%);
	}
	
	.ast-button:enabled:active {
		
		box-shadow: inset 1px 1px 1px #000;
		outline: none;
		border: none;
		box-shadow: inset 1px 1px 4px -1px #000;
	}
	
	.ast-button:focus {
	}
	
	.ast-button:hover > .bg-1-dark {
		transition:0.2s;
	}
	
	.ast-button:active > .bg-1-dark {
		transition:0.2s;
		background-color: #028b89;
	}
	
	.ast-button:hover > .bg-red-dark {
		transition:0.2s;
	}
	
	.ast-button:active > .bg-red-dark {
		transition:0.2s;
		background-color: #9f1616;
	}
	
	.ast-button:active.bg-red {
		transition:0.2s;
		background-color: #d24f4f;
	}
	.ast-button:active.bg-1 {
		transition:0.2s;
		background-color: #21b7b9;
	}
	
	.btn-icon {
		transition:0.2s;

		padding: 8px 10px;
		display: inline-block; 
		height: 100%;
		border-radius: 3px 0 0 2px;
		color: #fafafa;
	}
	
	.bg-1 {
		color: #fafafa;
		text-shadow: 1px 1px 2px #6f6f6f;
		background: #23c6c8;
	}
	
	.bg-1-dark {
		background: #00a5a2;
	}
	
	.bg-red {
		color: #fafafa;
		text-shadow: 1px 1px 2px #6f6f6f;
		background-color: #d85959;
	}
	
	.bg-red-dark {
		background-color: #b11b1b;
	}
	
	.btn-primary-ast {
    box-shadow: none;
    border-width: 1px;
    cursor: pointer;
	background-color: #3c8dbc;
    border-color: #367fa9;
	border: 1px solid transparent;
	color: #fff!important;
}
	
	
.btn-primary-ast:hover{
    background-color: #367fa9;
}

.btn-primary-ast:focus {
    outline: none;
}
.ast-textarea {
    margin-top: 10px;
    box-shadow: 0px 0px 3px 0px rgba(119, 119, 119, 0.63);
    -moz-box-shadow: 0px 0px 3px 0px rgba(119, 119, 119, 0.63);
    -webkit-box-shadow: 0px 0px 3px 0px rgba(119, 119, 119, 0.63);
}