﻿body, html {
    min-height: 100%;
}
body, 
.bodyComplete {  font-family: "Segoe UI Light", "Segoe UI", Arial, Sans-Serif; margin: 0; padding: 0; }
#Wrapper, 
#WrapperComplete, 
#WrapperWebLogin { background: #eee; width: 370px; background: #eee; margin: 0 auto; padding: 20px; }
.logo {
    margin: 0;
}
.logo img { width: 222px; }
h1 { font-weight: 100; margin: 25px 0 25px; padding: 0; font-size: 28px; }
h2 { font-weight: 100; margin: 0; padding: 0; font-size: 20px; }
a:link, a:visited {
	color:#198DB9;
	text-decoration: none;
}
a:hover, a:active, a:focus {
	text-decoration: underline;
}
a:active {
	color:#C00;
}
#loginform {
    clear: both; 
    padding: 10px 0;
}
#placeHolderNode { list-style: none; margin: 0; padding: 0; overflow: hidden; }
#placeHolderNode li { float: left; margin: 0 10px 10px 0; padding: 0; }
#placeHolderNode a { display: block; width: 50px; font-size: 11px; text-align: center; color: #333; text-decoration: none; opacity: .9 }
#placeHolderNode a:hover { opacity: 1; }
#placeHolderNode a .icon { display: block; width: 40px; height: 44px; margin: 0 auto; }
#placeHolderNode a .icon.telerik { background: url(../Images/login-providers/login-provider-telerik.png) no-repeat; }
#placeHolderNode a .icon.facebook { background: url(../Images/login-providers/login-provider-facebook.png) no-repeat; }
#placeHolderNode a .icon.twitter { background: url(../Images/login-providers/login-provider-twitter.png) no-repeat; }
#placeHolderNode a .icon.yahoo { background: url(../Images/login-providers/login-provider-yahoo.png) no-repeat; }
#placeHolderNode a .icon.liveid { background: url(../Images/login-providers/login-provider-liveid.png) no-repeat; }
#placeHolderNode a .icon.google { background: url(../Images/login-providers/login-provider-google.png) no-repeat; }
#placeHolderNode a .icon { display: block; width: 44px; height: 44px; }
.property-invalid { color: #E61F26; }
.label { font-weight: 100; font-size: 18px; margin: 0 0 5px; font-family: "Segoe UI Light", "Segoe UI", sans-serif; font-weight: 100; }
.value { margin: 0 0 10px 0; }
form input[type="text"], 
form input[type="password"] { display: block; width: 96%; padding: 4px; background: #fff; border: none; font-weight: 100; font: 18px "Segoe UI Light", "Segoe UI", sans-serif; font-weight: 100; }
form input[type="text"]:disabled { cursor:default; }
.actions { margin: 20px 0 10px 0;  }
.actions input[type="button"], 
.actions input[type="submit"] { 
 /* background-color: #ddd;
  background-image: -moz-linear-gradient(top, #ddd, #ccc);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ddd), to(#ccc));
  background-image: -webkit-linear-gradient(top, #ddd, #ccc);
  background-image: -o-linear-gradient(top, #ddd, #ccc);
  background-image: linear-gradient(to bottom, #ddd, #ccc);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ddd', endColorstr='#ccc', GradientType=0);
    border-radius: 2px;
    color: #000;     
    border: none; 
    padding: 5px 20px 7px; 
    font: 18px "Segoe UI Light", "Segoe UI", sans-serif; 
    cursor:pointer;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);*/
    display: block;
    font: 18px "Segoe UI Light", "Segoe UI", sans-serif; 
    font-weight: 100; 
    padding: 7px 20px;
    margin-bottom: 0;
    *margin-left: .3em;
    font-size: 18px;
    line-height: 20px;
    color: #000;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
    cursor: pointer;
    background-color: #f5f5f5;
    *background-color: #e6e6e6;
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #bbbbbb;
    *border: 0;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border-bottom-color: #a2a2a2;
    -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
            border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    *zoom: 1;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
        -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}
    
.actions input[type="button"]:hover, 
.actions input[type="submit"]:hover {  
    background-color: #e6e6e6;
    *background-color: #d9d9d9;
    color: #333333;
    text-decoration: none;
    background-position: 0 -15px;
    -webkit-transition: background-position 0.1s linear;
        -moz-transition: background-position 0.1s linear;
        -o-transition: background-position 0.1s linear;
            transition: background-position 0.1s linear;
}
.actions.register input[type="button"] { background: #F08501; color: white; text-shadow: none;}
#RememberMe, 
#remember_me, 
#RememberMeWindows {margin: 0 0 20px 0;}
.divider {margin-top:15px; margin-bottom:15px; font-size: 13px;}
.divider span {border-top:1px solid #ccc;width:150px;display:inline-block;vertical-align:middle;}
.divider span.left {margin-right:10px;}
.divider span.right {margin-left:10px;}

.first-time-login { position: absolute; left: 50%; width: 250px; margin: 95px 0 0 -470px; font-weight: 100; }
.first-time-login h2,
.first-time-login b { font-family: "Segoe UI", Arial, Sans-Serif; font-weight: bold; }

@media all and (max-width: 500px) {
    #Wrapper,
    #WrapperComplete,
    #WrapperWebLogin {
        width: 100%;
        min-height: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
}

@media all and (max-width: 400px) {
    .divider {
        text-align: center;
    }
    .divider span {
        width: 100px;
    }
    .actions input[type="button"], .actions input[type="submit"] {
        max-width: 100%;
        overflow: hidden;
        white-space: normal;
    }
}