/*Welcome text*/
h1 {
	/*fixes animation bug and aligns items */
	position: absolute;
	right: 50%;
	top:30px;
	transform: translate(50%,-50%);
	margin: 10 auto;
	
	/*Animation*/
	overflow: hidden; /* Ensures the content is not revealed until the animation */
	border-right: .15em solid green; /* cursor */
	white-space: nowrap; /* Keeps the content on a single line */
	margin: 0 auto; /* Gives that scrolling effect as the typing happens */
	letter-spacing: .15em; /* Adjust as needed */
	animation: 
		typing 4.5s steps(60, end),
		flash .75s step-end infinite;
}

/* QWERT Talk*/
h2{
	position: absolute;

}

.container{
	display: table;
	margin: 0 auto;	
	background: rgba(0, 0, 0, 0);
	position: absolute;
	top: 400px;
	right: 50%;
	transform: translate(50%,-50%);
	
	max-width: 90%;
	padding: 2em 3em;  
}

/*QWERT pulse - takes keyframe from below*/
.alive {
	animation-name: pulse_animation;
	animation-duration: 6000ms;
	transform-origin:90% 90%;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

/*QWERT Query Field*/
input[type=text] {
    width: 100%;
    padding: 12px 35px;
    margin: 8px 0;
    box-sizing: border-box;
	background-image: url(../img/queryicon.png);
	background-position: 2px 7px; 
    background-repeat: no-repeat;
	border-radius: 4px;
	
    border: 2px solid #ccc;
	font-family: inherit;
}

/*--------------- Animations ---------------*/

/* Animation for header */
@keyframes typing {
  from { width: 0 }
  to { width: 860px }
}
/* Typing Effect */
@keyframes flash {
  from, to { border-color: transparent }
  50% { border-color: #00ff00; }
}

/*QWERT Pulse */
@keyframes pulse_animation {
	0% { transform: scale(1); }
	30% { transform: scale(1); }
	40% { transform: scale(1.08); }
	50% { transform: scale(1); }
	60% { transform: scale(1); }
	70% { transform: scale(1.05); }
	80% { transform: scale(1); }
	100% { transform: scale(1); }
}

/*Loading dots*/
@keyframes blink {50% { color: transparent }}
.loaderDot { animation: 1s blink infinite }
.loaderDot:nth-child(2) { animation-delay: 250ms }
.loaderDot:nth-child(3) { animation-delay: 500ms }