/*******************
LOGIN FORM STYLESHEET
by: Amit Jakhu (Modified for Brand Colors & Layout)
*******************/

/*******************
SELECTION STYLING
*******************/

::selection {
	color: #fff;
	background: #00afdb; /* Brand Blue */
}
::-moz-selection {
	color: #fff;
	background: #00afdb; /* Brand Blue */
}

/*******************
BODY STYLING
*******************/

* {
	margin: 0;
	padding: 0;
	border: 0;
}

body {
    background-color:#f4f9fb; /* Very light blue/gray background */
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	font-weight:300;
	text-align: left;
	text-decoration: none;
}
.navbar navbar-default navbar-static-top {
    background-color:#e6f2f5;
}
#wrapper {
	/* Move wrapper to the left */
	width: 300px;
	height: 400px;
	position: absolute;
	left: 10%; /* Ekranın solundan %10 boşluk bırakır */
	top: 50%;
	margin-top: -200px;
}

.gradient {
	/* Positioned behind the left-aligned wrapper */
	width: 600px;
	height: 600px;
	position: fixed;
	left: 10%; /* Wrapper ile aynı konuma alındı */
	top: 50%;
	margin-left: -150px; /* Efekti panelin arkasına ortalamak için uyarlandı */
	margin-top: -300px;
	
	/* Fallback */ 
	background-image: url(../Images/gradient.png); 
	background-repeat: no-repeat; 
	
	/* CSS3 Gradient - Adapted to Brand Blue */
	background-image: -webkit-gradient(radial, 0% 0%, 0% 100%, from(rgba(0,175,219,0.15)), to(rgba(0,175,219,0)));
	background-image: -webkit-radial-gradient(50% 50%, 40% 40%, rgba(0,175,219,0.15), rgba(0,175,219,0));
	background-image: -moz-radial-gradient(50% 50%, 50% 50%, rgba(0,175,219,0.15), rgba(0,175,219,0));
	background-image: -ms-radial-gradient(50% 50%, 50% 50%, rgba(0,175,219,0.15), rgba(0,175,219,0));
	background-image: -o-radial-gradient(50% 50%, 50% 50%, rgba(0,175,219,0.15), rgba(0,175,219,0));
}

/*******************
LOGIN FORM
*******************/

.login-form {
	width: 300px;
	margin: 0 auto;
	position: relative;
	z-index:5;
	
	background: #e1f4f9; /* Requested Light Blue */
	border: 1px solid #cbeff7;
	border-radius: 5px;
	
	box-shadow: 0 1px 3px rgba(0,0,0,0.2);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

/*******************
HEADER
*******************/

.login-form .header {
	padding: 40px 30px 30px 30px;
	text-align: center; /* Başlığı ve alt yazıyı ortalar */
}

.login-form .header h1 {
	font-family: 'Bree Serif', serif;
	font-weight: 300;
	font-size: 28px;
	line-height:34px;
	color: #0d2f3d; /* Dark Navy/Blue instead of flat gray */
	text-shadow: 1px 1px 0 rgba(255,255,255,1.0); /* 256 hatası düzeltildi */
	margin-bottom: 10px;
}

.login-form .header span {
	font-size: 11px;
	line-height: 16px;
	color: #3b6b7d;
	text-shadow: 1px 1px 0 rgba(255,255,255,1.0); /* 256 hatası düzeltildi */
}

/*******************
CONTENT
*******************/

.login-form .content {
	padding: 0 30px 25px 30px;
}

/* Input field */
.login-form .content .input {
	width: 188px;
	padding: 15px 25px;
	
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #638896;
	text-shadow: 1px 1px 0 rgba(255,255,255,1.0); /* 256 hatası düzeltildi */
	
	background: #fff;
	border: 1px solid #fff;
	border-radius: 5px;
	
	box-shadow: inset 0 1px 3px rgba(0,0,0,0.15);
	-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.15);
	-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.15);
}

/* Second input field */
.login-form .content .password, .login-form .content .pass-icon {
	margin-top: 25px;
}

.login-form .content .input:hover {
	background: #f0f9fb;
	color: #0d2f3d;
}

.login-form .content .input:focus {
	background: #f0f9fb;
	color: #0d2f3d;
	
	box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
	-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.15);
}

.user-icon, .pass-icon {
	width: 46px;
	height: 47px;
	display: block;
	position: absolute;
	left: 0px;
	padding-right: 2px;
	z-index: 3;
	
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
}

.user-icon {
	top:147px; 
	background: rgba(0,175,219,0.85) url(../Images/user-icon.png) no-repeat center;	
}

.pass-icon {
	top:221px;
	background: rgba(0,175,219,0.85) url(../Images/pass-icon.png) no-repeat center;
}

/* Animation */
.input, .user-icon, .pass-icon, .button, .register {
	transition: all 0.5s;
	-moz-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	-ms-transition: all 0.5s;
}

/*******************
FOOTER
*******************/

.login-form .footer {
	padding: 25px 30px 40px 30px;
	overflow: auto;
	
	background: #cbeff7; /* Matching lower section */
	border-top: 1px solid #fff;
	
	box-shadow: inset 0 1px 0 rgba(0,0,0,0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(0,0,0,0.05);
	-webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.05);
}

/* Login button */
.login-form .footer .button {
	float:right;
	padding: 11px 25px;
	
	font-family: 'Bree Serif', serif;
	font-weight: 300;
	font-size: 18px;
	color: #fff;
	text-shadow: 0px 1px 0 rgba(0,0,0,0.15);
	
	background: #00afdb; /* Brand Blue */
	border: 1px solid #0098bf;
	border-radius: 5px;
	cursor: pointer;
	
	box-shadow: inset 0 0 2px rgba(255,255,255,0.75); /* 256 hatası düzeltildi */
	-moz-box-shadow: inset 0 0 2px rgba(255,255,255,0.75);
	-webkit-box-shadow: inset 0 0 2px rgba(255,255,255,0.75);
}

.login-form .footer .button:hover {
	background: #008eb3; /* Darker Brand Blue for Hover */
	border: 1px solid rgba(255,255,255,0.75); /* 256 hatası düzeltildi */
	
	box-shadow: inset 0 1px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.3);
}

.login-form .footer .button:focus {
	position: relative;
	bottom: -1px;
	
	background: #00afdb;
	
	box-shadow: inset 0 1px 6px rgba(255,255,255,0.75); /* 256 hatası düzeltildi */
	-moz-box-shadow: inset 0 1px 6px rgba(255,255,255,0.75);
	-webkit-box-shadow: inset 0 1px 6px rgba(255,255,255,0.75);
}

/* Register button */
.login-form .footer .register {
	display: block;
	float: right;
	padding: 10px;
	margin-right: 20px;
	
	background: none;
	border: none;
	cursor: pointer;
	
	font-family: 'Bree Serif', serif;
	font-weight: 300;
	font-size: 18px;
	color: #0d2f3d;
	text-shadow: 0px 1px 0 rgba(255,255,255,0.5); /* 256 hatası düzeltildi */
}

.login-form .footer .register:hover {
	color: #e40817; /* Brand Red for interaction pop */
}

.login-form .footer .register:focus {
	position: relative;
	bottom: -1px;
}

.info, .success, .warning, .error, .validation 
 {
font-family:Arial, Geneva, sans-serif;
font-size:13px;
border: 1px solid;
border-color:white;
padding:15px 10px 15px 50px;
background-repeat: no-repeat;
background-position: 10px center;
border-bottom-left-radius:10px;
border-bottom-right-radius:10px;
}
.info {
color: #00529B;
background-color: #BDE5F8;
background-image: url("../Images/info.png");
}
.success {
color: #4F8A10;
background-color: #DFF2BF;
background-image:url("../Images/success.png");
}
.warning {
color: #9F6000;
background-color: #FEEFB3;
background-image: url("../Images/warning.png");
}
.error {
color: #e40817; /* Brand Red for errors */
background-color: #fde8e9;
border-color: #e40817;
background-image: url("../Images/error.png");
}
.modalclose
{
    right: 7px;
    background: url(../Images/CloseDialog.png) no-repeat;
    width: 25px;	
    cursor: pointer;	
    position: absolute;	 
    height: 15px;
}
.modalheader
{ 
    background-color:#00afdb; /* Brand Blue */
    color: #ffffff;	
    border-width: 0px 1px 1px;
    padding: 3px 10px;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    height:24px;
}
.modalBackground
{
    background-color: White;
    filter: alpha(opacity=70);
    opacity: 0.7;
}
.edit, .dropdown, .textbox, .DropDownList {
    Font-Family: Tahoma, Times New Roman, Arial;
    Font-size: 12px;
    width: 160px;
    color: black;
    border: none;
    border-bottom: 1px solid #a8e0f0;
}

.buttonStyle {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
    color: #fff;
    background-color: #00afdb; /* Brand Blue */
    border-color: #0098bf;
}
.modal-header{min-height:16.43px;padding:15px;border-bottom:2px solid white;}.modal-header .close{margin-top:-2px}.modal-title{margin:0;line-height:1.42857143}.modal-body{position:relative;padding:15px}.modal-footer{padding:15px;text-align:right;border-top:1px solid #e5e5e5}
.modal-content{position:relative;background-color:#f4f9fb;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #999;border:1px solid rgba(0,0,0,.2);border-radius:6px;outline:0;-webkit-box-shadow:0 3px 9px rgba(0,0,0,.5);box-shadow:0 3px 9px rgba(0,0,0,.5)}
.alert-dismissable .close,.alert-dismissible .close{position:relative;top:-2px;right:-21px;color:inherit}
.modal.fade .modal-dialog{-webkit-transition:-webkit-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out;-webkit-transform:translate(0,-25%);-ms-transform:translate(0,-25%);-o-transform:translate(0,-25%);transform:translate(0,-25%)}.modal.in .modal-dialog{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0)}.modal-open .modal{overflow-x:hidden;overflow-y:auto}
.close{float:right;font-size:21px;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;filter:alpha(opacity=20);opacity:.2;}.close:focus,.close:hover{color:#000;text-decoration:none;cursor:pointer;filter:alpha(opacity=50);opacity:.5}button.close{background:0 0;border:0;}

.LoginContent {
	padding: 0 30px 25px 30px;
}

.LoginFooter {
	padding: 25px 30px 40px 30px;
	overflow: auto;
	
	background: #cbeff7;
	border-top: 1px solid #fff;
	
	box-shadow: inset 0 1px 0 rgba(0,0,0,0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(0,0,0,0.05);
	-webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.05);
}

/* Login button */
.LoginButton {
	float:right;
	padding: 11px 25px;
	
	font-family: 'Bree Serif', serif;
	font-weight: 300;
	font-size: 18px;
	color: #fff;
	text-shadow: 0px 1px 0 rgba(0,0,0,0.15);
	
	background: #00afdb; /* Brand Blue */
	border: 1px solid #0098bf;
	border-radius: 5px;
	cursor: pointer;
	
	box-shadow: inset 0 0 2px rgba(255,255,255,0.75); /* 256 hatası düzeltildi */
	-moz-box-shadow: inset 0 0 2px rgba(255,255,255,0.75);
	-webkit-box-shadow: inset 0 0 2px rgba(255,255,255,0.75);
}

.LoginButton:hover {
	background: #008eb3; /* Darker Brand Blue for hover */
	border: 1px solid rgba(255,255,255,0.75); /* 256 hatası düzeltildi */
	
	box-shadow: inset 0 1px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.3);
}

.LoginButton:focus {
	position: relative;
	bottom: -1px;
	
	background: #00afdb;
	
	box-shadow: inset 0 1px 6px rgba(255,255,255,0.75); /* 256 hatası düzeltildi */
	-moz-box-shadow: inset 0 1px 6px rgba(255,255,255,0.75);
	-webkit-box-shadow: inset 0 1px 6px rgba(255,255,255,0.75);
}