@charset "utf-8";

@-khtml-keyframes textBlink {
	0% 		{ opacity: 0; }
	50% 	{ opacity: 1; }
	100% 	{ opacity: 0; }
}
@-webkit-keyframes textBlink {
	0% 		{ opacity: 0; }
	50% 	{ opacity: 1; }
	100% 	{ opacity: 0; }
}
@-moz-keyframes textBlink {
	0% 		{ opacity: 0; }
	50% 	{ opacity: 1; }
	100% 	{ opacity: 0; }
}
@-ms-keyframes textBlink {
	0% 		{ opacity: 0; }
	50% 	{ opacity: 1; }
	100% 	{ opacity: 0; }
}
@-o-keyframes textBlink {
	0% 		{ opacity: 0; }
	50% 	{ opacity: 1; }
	100% 	{ opacity: 0; }
}
@keyframes textBlink {
	0% 		{ opacity: 0; }
	50% 	{ opacity: 1; }
	100% 	{ opacity: 0; }
}

/* Bulanık */
@-webkit-keyframes blur {
  0% 		{ -webkit-filter: 1blur(1px); opacity: 0.8; }
  50% 		{ -webkit-filter: blur(1px); opacity: 1; }
  100% 		{ -webkit-filter: blur(1px); opacity: 0.8; }
}

/* Sallanma */
@-webkit-keyframes shake {
  30% 		{  }
  40% 		{ opacity: 1; top: 0; left: 0; -webkit-transform: scale(1,1); -webkit-transform: skew(0,0); }
  41% 		{ opacity: 0.8; top: 0px; left: -100px; -webkit-transform: scale(1,1.2); -webkit-transform: skew(50deg,0); }
  42% 		{ opacity: 0.8; top: 0px; left: 100px; -webkit-transform: scale(1,1.2); -webkit-transform: skew(-80deg,0); }
  43% 		{ opacity: 1; top: 0; left: 0; -webkit-transform: scale(1,1); -webkit-transform: skew(0,0); }
  65% 		{  }
}

/* Yazma */
@-khtml-keyframes loginWrite {
	from 	{ width: 0; }
	to 		{ width: 12em; }
}
@-webkit-keyframes loginWrite {
	from 	{ width: 0; }
	to 		{ width: 12em; }
}
@-moz-keyframes loginWrite {
	from 	{ width: 0; }
	to 		{ width: 12em; }
}
@-ms-keyframes loginWrite {
	from 	{ width: 0; }
	to 		{ width: 12em; }
}
@-o-keyframes loginWrite {
	from 	{ width: 0; }
	to 		{ width: 12em; }
}
@keyframes loginWrite {
	from 	{ width: 0; }
	to 		{ width: 12em; }
}

@-khtml-keyframes errorWrite {
	from 	{ width: 0; }
	to 		{ width: 13em; }
}
@-webkit-keyframes errorWrite {
	from 	{ width: 0; }
	to 		{ width: 13em; }
}
@-moz-keyframes errorWrite {
	from 	{ width: 0; }
	to 		{ width: 13em; }
}
@-ms-keyframes errorWrite {
	from 	{ width: 0; }
	to 		{ width: 13em; }
}
@-o-keyframes errorWrite {
	from 	{ width: 0; }
	to 		{ width: 13em; }
}
@keyframes errorWrite {
	from 	{ width: 0; }
	to 		{ width: 13em; }
}

@-webkit-keyframes text {
	from 	{ border-right-color: rgba(31,240,66, .75); }
	to 		{ border-right-color: transparent; }
}
@-moz-keyframes text {
	from 	{ border-right-color: rgba(31,240,66, .75); }
	to 		{ border-right-color: transparent; }
}
@-ms-keyframes text {
	from 	{ border-right-color: rgba(31,240,66, .75); }
	to 		{ border-right-color: transparent; }
}
@-o-keyframes text {
	from 	{ border-right-color: rgba(31,240,66, .75); }
	to 		{ border-right-color: transparent; }
}
@keyframes text {
	from 	{ border-right-color: rgba(31,240,66, .75); }
	to 		{ border-right-color: transparent; }
}

.terminal-box {
	position: fixed;
	overflow: hidden;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
}

.terminal-box > div {
	width: 100%;
	height: 100%;
	overflow: hidden;
	display: table;
	table-layout: fixed;
}

.terminal-box > div > div {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

.terminal-box > div > div > p {
    position: relative;
    margin: 0 auto !important;
    border-right: 2px solid rgba(31,240,66, .75);
    font-size: 180%;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
}

.terminal-box > div > div > p.login {
	width: 12em;
	-khtml-animation: loginWrite 1s steps(35) 1s 1 normal both,
						text 500ms steps(35) infinite normal,
						shake 10s infinite;
	-webkit-animation: loginWrite 1s steps(35) 1s 1 normal both,
						text 500ms steps(35) infinite normal,
						shake 10s infinite;
	-moz-animation: loginWrite 1s steps(35) 1s 1 normal both,
						text 500ms steps(35) infinite normal,
						shake 10s infinite;
	-ms-animation: loginWrite 1s steps(35) 1s 1 normal both,
						text 500ms steps(35) infinite normal,
						shake 10s infinite;
	-o-animation: loginWrite 1s steps(35) 1s 1 normal both,
						text 500ms steps(35) infinite normal,
						shake 10s infinite;
	animation: loginWrite 1s steps(35) 1s 1 normal both,
						text 500ms steps(35) infinite normal,
						shake 10s infinite;	
}

.terminal-box > div > div > p.error {
	width: 13em;
	-khtml-animation: errorWrite 4s steps(44) 1s 1 normal both,
						text 500ms steps(44) infinite normal,
						shake 10s infinite;
	-webkit-animation: errorWrite 4s steps(44) 1s 1 normal both,
						text 500ms steps(44) infinite normal,
						shake 10s infinite;
	-moz-animation: errorWrite 4s steps(44) 1s 1 normal both,
						text 500ms steps(44) infinite normal,
						shake 10s infinite;
	-ms-animation: errorWrite 4s steps(44) 1s 1 normal both,
						text 500ms steps(44) infinite normal,
						shake 10s infinite;
	-o-animation: errorWrite 4s steps(44) 1s 1 normal both,
						text 500ms steps(44) infinite normal,
						shake 10s infinite;
	animation: errorWrite 4s steps(44) 1s 1 normal both,
						text 500ms steps(44) infinite normal,
						shake 10s infinite;	
}

.terminal-box.terminal-img {
	background-image: url('../img/defatul.png');
	background-color: #000;
	background-attachment: fixed;
	background-position: center center;
	background-repeat: no-repeat;
}

.terminal-box.terminal-error {
	z-index: 5;
}

.terminal-box.terminal-loader {
	display: none;
	z-index: 4;
	background: #000 url('../img/loader.gif');
	background-repeat: no-repeat;
	-khtml-background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/../img/loader.gif', sizingMethod='scale')";
}

.terminal-box.terminal-login {
	z-index: 3;
	display: block;
}

.terminal-box.terminal-logo {
	z-index: -1;
	opacity: .7;
}

@media (max-width: 800px) {
	.terminal-box > div > div > p {
		font-size: 100%;
	}

	.terminal-box.terminal-logo {
		opacity: .3;
	}
}