html, body
{
    margin: 0;
    padding: 0;
    height: 100%;
    background-color: #333642;
    color: #fff;
    font: normal normal normal 13px/ 16px 'trebuchet ms', Arial;
}

label
{
    text-shadow: 1px 1px 0 #000;
}

#loginDistance
{
    width: 1px;
    height: 50%;
    background-color: Transparent;
    margin-bottom: -70px; /* half of Login's height */
    float: left;
}
#body
{
    margin: 0 auto;
    position: relative;
    width: 410px;
    height: 100px;
    clear: left;
    direction: ltr;
    text-align: center;
}
#logo 
{
    float:left;
    width: 150px;
    height: 100px;
    background: transparent url(../App_Images/CP/loginLogo.png) no-repeat left center;
}
#login 
{
    float:left;
	width: 250px;
    height: 100px;
    direction: ltr;
    border-left: 3px solid Red;
}
#developer {
	position: fixed;
	right: 10px;
	bottom: 10px;
}
    
#developer span {
	color:#7A7A7A;
	display: block;
	margin-top: 10px;
}
#developer span a, #developer span a:visited {
    color:	#CECED0;
    text-decoration: none;
    border-bottom: 1px dotted #7A7A7A;
}
#developer span a:hover {
    border-bottom: 1px solid #CECED0;
}
.loginTextBox
{
    border-style: none;
    border-color: inherit;
    border-width: medium;
    background-color: #BFBFBF; /*url('Images/Login/loginTextBox.png') no-repeat center;*/
    width: 150px;
    height: 24px;
    color: #000;
    padding: 0 5px;
    margin: 2px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.loginButton
{
    background: url('Images/Login/loginButton.png') no-repeat center;
    border: none;
    width: 89px;
    height: 35px;
    margin: 15px 14px 0 0;
    cursor: pointer;
}

.loginButton:hover
{
    background: url('Images/Login/loginButtonHover.png') no-repeat center;
}


input.login, a.login
{
    height: 25px;
    padding: 3px 20px 2px;
    position: relative;
    top: 15px;
    margin: 0 12px 10px 0;
    white-space: nowrap;
    border: none;
    overflow: visible;
    border-bottom: 1px solid #ebebeb;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    cursor: pointer;
    -webkit-font-smoothing: subpixel-antialiased !important;
    color: #fff;
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
    background: #32a324;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#2eb3ca',endColorstr='#1f7e8e');
    background: -webkit-gradient(linear,0% 0,0% 100%,from(#2eb3ca),to(#1f7e8e));
    background: -moz-linear-gradient(-90deg,#2eb3ca,#1f7e8e);
    border-bottom-color: #2491a3;
    text-decoration: none;
}

input.login:hover, a.login:hover
{
    color: #fff;
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
    background: #22b90f;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#1bc3df',endColorstr='#11879b');
    background: -webkit-gradient(linear,0% 0,0% 100%,from(#1bc3df),to(#11879b));
    background: -moz-linear-gradient(-90deg,#1bc3df,#11879b);
    border-bottom-color: #149bb2;
}