html{width:100%; height:100%; overflow:hidden;}
body {font-family:Segoe UI, Calibri, Arial; font-size:11px; padding:0; margin:0px; background:linear-gradient(#00c0ff, #009fd4); width:100%; height:100%; overflow:auto;}
::-webkit-scrollbar {width: 5px; padding:2px; border:1px solid #c8c8c8; background-color:white;}
::-webkit-scrollbar-track {-webkit-border-radius: 0px; border-radius: 0px;}
::-webkit-scrollbar-thumb { -webkit-border-radius: 0px; border-radius: 0px; background: #0094ff;}
::-webkit-scrollbar-thumb:window-inactive {background: rgba(255,0,0,0.4);}

input, select, textarea{-webkit-box-sizing:border-box;‌​ -moz-box-sizing:border-box; box-sizing:border-box; font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-size:11px;}
input:focus, select:focus, textarea:focus{outline:none;}
a{cursor:pointer;}
.clear{clear:both;}
.login_form_baslik{width:50%; margin-left:auto; margin-right:auto; margin-top:7%; text-align:center; padding:5px; font-size:13px; color:white;}
.login_main_div{width:50%; margin-left:auto; margin-right:auto; padding:10px; border-radius:3px; background-color:#fffbf0;
                -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75); background-image:url("/lib/img/login/back.jpg"); background-size:100% auto; background-repeat:no-repeat;
}

.login_bottom_div{width:49%; margin-left:auto; margin-right:auto; text-align:center; color:white;}
.login_bottom_div .login_bottom{padding:5px; background-color:rgba(0,0,0,0.75); border-radius:0px 0px 3px 3px;
                                -webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
}
.login_form{display:table; border-spacing:0; border-collapse:collapse; width:100%;}
.login_form .login_form_l{display:table-cell; vertical-align:top; padding:5px;}
.login_form .login_form_r{display:table-cell; width:350px; padding:5px; vertical-align:top;}

@media screen and (max-width:500px) {
.login_form .login_form_r{}
.login_form .login_form_l{display:none;}
.login_bottom_div .login_bottom{font-size:8px;}
}

@media screen and (min-width:500px) and (max-width:1000px) {
.login_form .login_form_r{width:200px;}
.login_form .login_form_l{}
.login_bottom_div .login_bottom{font-size:10px;}
}
.login_form_title{margin:0px 0px; font-size:11px; color:gray;}
.login_bottom a{color:white; font-weight:bold; text-decoration:none;}
.login_form_form .login_form_form_div{display:block; margin-bottom:0px;}
.login_form_form_div .login_form_form_1{display:block; padding:3px 0px; font-size:9px; font-weight:bold; display:none;}
.login_form_form_div .login_form_form_2{display:block; position:relative;}
.login_form_form_div input[type=text], .login_form_form_div input[type=password]{padding-left:40px; border-width:0px; width:100%; font-size:12px; height:34px; background-color:white;}
.login_form_form_div input[type=text]:focus, .login_form_form_div input[type=password]:focus{background-color:#f4f4f4; -webkit-text-security:none}

.login_form_form_div input[type=text]{-webkit-text-security:circle}
.login_form_form_div input[type=password]{-webkit-text-security:circle}
.login_form_form_div .form_u_n{background-image:url("/lib/img/login/user_icon.png"); background-repeat:no-repeat; background-size:auto 32px; background-position:left center; border-radius:3px 3px 0px 0px;}
.login_form_form_div .form_u_p{background-image:url("/lib/img/login/pass_icon.png"); background-repeat:no-repeat; background-size:auto 32px; background-position:left center; border-radius:0px 0px 3px 3px;}
.login_form_form_div .form_u_n:focus{background-image:url("/lib/img/login/user.png");}
.login_form_form_div .form_u_p:focus{background-image:url("/lib/img/login/pass.png");}
.login_form_data{margin-bottom:5px; margin-top:10px; border:1px solid #bababa; border-radius:3px;}
.login_form_data .login_form_line{display:block; height:1px; background-color:#bababa;}
.form_pass_forget{display:inline-block; height:24px; width:24px; position:absolute; right:5px; top:5px; background-image:url("/lib/img/login/forget.png"); cursor:pointer;}
.form_pass_forget:hover{background-color:#e2e2e2; border-radius:3px;}
.form_pass_forget_cancel{display:inline-block; height:24px; width:24px; position:absolute; right:5px; top:5px; background-image:url("/lib/img/login/forget.png"); cursor:pointer;}
.form_pass_forget_cancel:hover{background-color:#e2e2e2; border-radius:3px;}

.login_form_btn{display:block; text-align:right;}
.login_form_btn input[type=button]{height:34px; border:0px solid #bababa; background:url("/lib/img/login/login_arrow.png") no-repeat left center, linear-gradient(#0094ff, #007dd7); color:white; border-radius:2px; width:130px; max-width:100%; cursor:pointer; font-weight:bold; border-bottom:1px solid #ffffff; border-top:1px solid #ffffff; -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25); -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25); box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25);}
.login_form_btn input[type=button]:hover{background:url("/lib/img/login/login_arrow.png") no-repeat left center, linear-gradient(#0094ff, #006ab6); color:white;}
.login_form_btn input[type=button]:focus{background:url("/lib/img/login/login_arrow.png") no-repeat left center, linear-gradient(#d9d513, #b6a700); color:white; -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25); -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25); box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25);}
.login_error{display:block; margin:5px 0px; background-color:red; color:white; font-weight:bold; text-align:center; padding:10px; border-radius:4px;}

.form_title_logo{margin:0; padding:0; border-spacing:0; border-collapse:collapse;}
.form_title_logo tr td{padding:0px!important; vertical-align:bottom;}
.form_title_logo tr td:last-child{padding-bottom:3px!important; padding-left:5px!important;}

@media screen and (max-width:800px) {
    .line01{display:none;}
    .form_u_n{padding:25px 10px 25px 30px!important; font-size:18px!important;}
    .form_u_p{padding:25px 10px 25px 30px!important; font-size:18px!important;}
    .login_form_btn input{height:54px!important;}
    .login_form_baslik{display:none;}
    .login_main_div{width:calc(100% - 20px); box-shadow:none!important; border-radius:0px!important; position:absolute; left:0; right:0; top:0; bottom:0;}
    .login_bottom_div{display:none;}
    .login_form_title{display:block; text-align:center;}
    .login_form_title table{display:inline-table; text-align:left;}
}
hr.line01 {
    margin:10px 10px;
    border-width: 0px;
    height:39px;
	text-align: center;   
}
hr.line01:after {
    border:1px solid #0094ff;
	content: 'Sisteme Giriş';
	display: inline-block;
	position: relative;
	top: 0px;
	padding: 4px 10px 0px 25px;
    height:18px;
	background-color: #ffffff;
    background-image:url("/lib/img/logo_50.png"); background-size:20px 20px; background-position:left center; background-repeat:no-repeat;
    border-radius:2px;
	color: #0094ff;
	font-size: 10px;
	/*-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);*/
}

.div_saat{position:absolute; bottom:0; right:0; font-size:240px; color:white; z-index:-1;}
.div_saat_table{display:table;}
.div_saat_table *{font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;}
.div_saat_table .div_saat_right{display:table-cell; vertical-align:top;}
.div_saat_table .div_saat_left{display:table-cell; vertical-align:top;}
.div_saat_table .div_saat_saat{font-size:240px; width:200px; text-align:right; overflow:hidden;}
.div_saat_table .div_saat_dakika{font-size:170px; text-align:right; width:190px; overflow:hidden; padding:0px; padding-right:10px; margin-top:25px;}
.div_saat_table .div_saat_saniye{font-size:30px; text-align:center; width:180px; overflow:hidden; color:#ffffff; text-align:right; padding-right:20px; margin-top:-30px;}

.div_login_images{display:block; height:300px; background-position:center center; background-size:100% auto; background-repeat:no-repeat; border-radius:3px 0px 0px 3px; border:1px solid #8a8a8a;
                  animation: animatedBackground1 4s linear, animatedBackground2 4s 4s linear, animatedBackground3 2s 8s linear;
                  background-size: cover;
}
@media screen and (min-width:500px) and (max-width:1000px) {
    .div_login_images{display:block; height:150px;}
}

@keyframes animatedBackground1 {
	from { background-position: 0 0; }
	to { background-position: 0 100%; }
}
@keyframes animatedBackground2 {
	from { background-position: 0 100%; }
	to { background-position: 0 0; }
}

@keyframes animatedBackground3 {
	from { background-position: 0 0; }
	to { background-position: 0 50%; }
}