@import url(
    https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,
    300italic,
    300,
    400italic,
    600,
    600italic,
    700,
    700italic
);
/**
 * BASE
 *
 * Tags and basic classes definition
 *
 */
/* ------------------------------------ *\
   #TAGS
\* ------------------------------------ */
html {
    height: 100%;
}
body {
    height: 100%;
    margin: 0;
    padding: 0;
    color: #242d38;
    font-family: "Source Sans Pro", sans-serif;
    font-size: 0.8rem;
    letter-spacing: 0.02rem;
}
a {
    color: #3484e6;
    text-decoration: none;
}
a:hover {
    color: #224e8c;
    text-decoration: underline;
}
/* ------------------------------------ *\
   #CLASSES
\* ------------------------------------ */
.pnd-text-align-left {
    text-align: left;
}
.pnd-error {
    padding: 0 20px;
    color: #ff643f;
    text-align: center;
}
/* ------------------------------------ *\
   #PUNDIT LOGO
\* ------------------------------------ */
.pnd-form-logo {
    width: 100%;
    height: 94px;
    margin: 0 auto 20px auto;
    padding: 0 0 20px 0;
    border-bottom: 1px solid #dfe2e6;
    background-image: url(../images/pundit-logo.png);
    background-repeat: no-repeat;
    background-position: top center;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2),
    only screen and (min--moz-device-pixel-ratio: 2),
    only screen and (-o-min-device-pixel-ratio: 2/1),
    only screen and (min-device-pixel-ratio: 2),
    only screen and (min-resolution: 192dpi),
    only screen and (min-resolution: 2dppx) {
    .pnd-form-logo {
        /* on retina, use image that's scaled by 2 */
        background-image: url(../images/pundit-logo@2x.png);
        background-size: 127px 94px;
    }
}
/* ------------------------------------ *\
   #RESPONSIVE
\* ------------------------------------ */
/* This should work also for the Pundit Annotator */
@media all and (max-width: 500px) {
    body {
        font-size: 0.74rem;
    }
    .pnd-form-logo {
        height: 72px;
        margin: 5px auto 15px auto;
        padding: 0 0 15px 0;
        background-size: 97px 72px;
    }
    .pnd-error {
        padding: 0 5px;
    }
}
/**
 * TYPOGRAPHY
 *
 * Typography
 *
 */
/* ------------------------------------ *\
   #HEADINGS
\* ------------------------------------ */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Source Sans Pro", sans-serif;
    font-weight: 100;
}
h1 {
    font-size: 1.7rem;
    line-height: 1.1;
    margin: 0 0 15px 0;
    padding: 0;
    color: #242d38;
}
h2 {
    margin: 0 75px 10px;
    padding: 0;
    font-size: 1.3rem;
    line-height: 1.25;
    color: #8d939a;
}
/* ------------------------------------ *\
   #BODY-TEXT
\* ------------------------------------ */
p {
    margin: 0 0 10px 0;
    padding: 0;
    font-family: "Source Sans Pro", sans-serif;
    font-size: 1rem;
    font-weight: 100;
    line-height: 1.45;
}
a {
    font-size: 1rem;
    font-weight: 100;
}
strong {
    font-weight: 600;
}
/* ------------------------------------ *\
   #VARIOUS
\* ------------------------------------ */
hr {
    border: 0;
    height: 1px;
    max-width: 400px;
    margin: 8px auto 18px auto;
    background: #dfe2e6;
}
.pnd-small {
    font-size: 0.86rem;
}
/* Big icon showing an action output */
span.pnd-output-icon {
    font-size: 2.2rem;
    margin-bottom: 9px;
    color: #8d939a;
}
/* ------------------------------------ *\
   #RESPONSIVE
\* ------------------------------------ */
/* This should work also for the Pundit Annotator */
@media all and (max-width: 500px) {
    h1 {
        font-size: 1.4rem;
        margin: 0 0 10px 0;
    }
    h2 {
        margin: 0 30px 10px;
        font-size: 1rem;
    }
    p {
        margin: 0 0 5px 0;
        font-size: 0.88rem;
        line-height: 1.35;
    }
    a {
        font-size: 0.88rem;
    }
    hr {
        margin-bottom: 10px;
    }
}
/**
 * FORMS
 *
 * Special style for form elements
 *
 */
/* ------------------------------------ *\
   #GENERAL-FORM
\* ------------------------------------ */
.pnd-form input:focus {
    outline: none;
}
.pnd-form label {
    display: block;
    position: absolute;
    width: auto;
    height: 40px;
    left: 3px;
    padding: 5px 10px;
    text-align: left;
    font-size: 0.9rem;
    font-weight: 100;
    color: #aeb1b5;
    line-height: 40px;
}
.pnd-form input[type="text"],
.pnd-form input[type="email"],
.pnd-form input[type="password"] {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 400px;
    min-width: 150px;
    height: 40px;
    margin: 5px auto 10px auto;
    padding: 5px 10px 5px 130px;
    border: 1px solid #dfe2e6;
    border-radius: 2px;
    background: #ffffff;
    font-family: "Source Sans Pro", sans-serif;
    font-size: 1rem;
    font-weight: 300;
    transition-property: border-color;
    transition-duration: 0.5s;
}
.pnd-form input[type="text"]:focus,
.pnd-form input[type="email"]:focus,
.pnd-form input[type="password"]:focus {
    border: 1px solid #3484e6;
}
.pnd-form input[type="text"]:-webkit-autofill,
.pnd-form input[type="email"]:-webkit-autofill,
.pnd-form input[type="password"]:-webkit-autofill {
    background: transparent none !important;
}
.pnd-form input[type="text"]::-webkit-input-placeholder,
.pnd-form input[type="email"]::-webkit-input-placeholder,
.pnd-form input[type="password"]::-webkit-input-placeholder {
    font-size: 0.9rem;
    font-weight: 100;
    opacity: 0;
}
.pnd-form input[type="text"]:-moz-placeholder,
.pnd-form input[type="email"]:-moz-placeholder,
.pnd-form input[type="password"]:-moz-placeholder {
    /* Firefox 18- */
    font-size: 0.9rem;
    font-weight: 100;
    opacity: 0;
}
.pnd-form input[type="text"]::-moz-placeholder,
.pnd-form input[type="email"]::-moz-placeholder,
.pnd-form input[type="password"]::-moz-placeholder {
    /* Firefox 19+ */
    font-size: 0.9rem;
    font-weight: 100;
    opacity: 0;
}
.pnd-form input[type="text"]:-ms-input-placeholder,
.pnd-form input[type="email"]:-ms-input-placeholder,
.pnd-form input[type="password"]:-ms-input-placeholder {
    font-size: 0.9rem;
    font-weight: 100;
    opacity: 0;
}
.pnd-form input[type="checkbox"] {
    display: inline-block;
    box-sizing: border-box;
    width: 1rem;
    height: 1rem;
}
.pnd-form input[type="checkbox"] + label {
    display: none;
    margin-bottom: -3px;
    vertical-align: baseline;
}
/* ------------------------------------ *\
   #BLOCKS
\* ------------------------------------ */
/* Elements containing labels and input fields */
/* Form block with left alignment */
.pnd-form-block {
    padding: 1px;
    /* Content is aligned left (default is centered) */
    /* Error! */
}
.pnd-form-block.pnd-text-align-left {
    position: relative;
    max-width: 400px;
    min-width: 150px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}
.pnd-form-block.pnd-error input[type="text"],
.pnd-form-block.pnd-error input[type="password"],
.pnd-form-block.pnd-error input[type="email"] {
    border-color: #ff643f;
}
/* ------------------------------------ *\
   #RESPONSIVE
\* ------------------------------------ */
/* This should work also for the Pundit Annotator */
@media all and (max-width: 500px) {
    .pnd-form label {
        height: 30px;
        left: 10px;
        padding: 2px 0;
        font-size: 0.82rem;
        line-height: 30px;
    }
    .pnd-form input[type="text"],
    .pnd-form input[type="email"],
    .pnd-form input[type="password"] {
        height: 30px;
        margin: 2px auto 7px auto;
        padding: 5px 10px 5px 113px;
        font-size: 0.88rem;
    }
}
/**
 * BUTTONS
 *
 * Styles for button
 *
 */
/* ------------------------------------ *\
   #BUTTONS
\* ------------------------------------ */
.pnd-btn {
    display: inline-block;
    box-sizing: border-box;
    width: auto;
    height: 40px;
    margin: 0 0 10px 0;
    padding: 0 10px;
    border: 0;
    border-radius: 4px;
    background: #3484e6;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 100;
    text-align: center;
    vertical-align: middle;
    line-height: 40px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15);
    transition-property: background, width;
    transition-duration: 0.5s;
    cursor: pointer;
    /* Icon */
    /* Loader inside button */
    /* Buttons with a small margin on top */
    /* Fixed width button: 300px */
}
.pnd-btn:hover {
    background: #196ace;
    border: 0;
    color: #ffffff;
    text-decoration: none;
    text-shadow: 0 3px 0 rgba(0, 0, 0, 0.15);
}
.pnd-btn.pnd-btn-loading {
    background: rgba(52, 132, 230, 0.5);
    cursor: default;
}
.pnd-btn .fa {
    display: block;
    float: left;
    height: 30px;
    width: 30px;
    border-right: 1px solid rgba(0, 0, 0, 0.3);
    font-size: 16px;
    line-height: 30px;
}
.pnd-btn .slim-loader {
    margin: 5px 20px 0 20px;
}
.pnd-btn.pnd-btn-margin-top {
    margin-top: 6px;
}
.pnd-btn.pnd-btn-width-140 {
    min-width: 140px;
}
/* Button with icon on the left */
.pnd-btn-icon {
    padding: 0;
}
/* Social button */
/* Has a custom width */
.pnd-btn-social {
    width: 150px;
    height: 30px;
    margin: 0 4px 8px 4px;
    color: #fff;
    line-height: 30px;
    font-size: 0.8rem;
}
/* Facebook button */
.pnd-btn-facebook {
    background: #3b5998;
}
.pnd-btn-facebook:hover {
    background: #2d4373;
}
/* Google button */
.pnd-btn-google {
    background: #cc3732;
}
.pnd-btn-google:hover {
    background: #a32c28;
}
/* ------------------------------------ *\
   #RESPONSIVE
\* ------------------------------------ */
/* This should work also for the Pundit Annotator */
@media all and (max-width: 500px) {
    .pnd-btn {
        height: 30px;
        font-size: 0.83rem;
        line-height: 30px;
    }
    .pnd-btn-social {
        width: 126px;
        height: 26px;
        margin: 0 1px 2px 1px;
        color: #fff;
        line-height: 26px;
        font-size: 0.72rem;
    }
}
/**
 * LOADER
 *
 * Animated loader used for entertaining the user that is waiting
 *
 * Inspired by: https://github.com/ConnorAtherton/loaders.css
 *
 */
/* ------------------------------------ *\
   #LOADER
\* ------------------------------------ */
@-webkit-keyframes rotate {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(180deg) scale(1);
    }
    100% {
        transform: rotate(360deg) scale(1);
    }
}
@-moz-keyframes rotate {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(180deg) scale(1);
    }
    100% {
        transform: rotate(360deg) scale(1);
    }
}
@-o-keyframes rotate {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(180deg) scale(1);
    }
    100% {
        transform: rotate(360deg) scale(1);
    }
}
@keyframes rotate {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(180deg) scale(1);
    }
    100% {
        transform: rotate(360deg) scale(1);
    }
}
.slim-loader {
    margin: 0 auto;
    text-align: center;
}
.slim-loader > div {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 2px;
    border: 2px solid #fff;
    border-bottom-color: transparent;
    border-radius: 100%;
    background: transparent !important;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: rotate 0.87s 0s linear infinite;
    -moz-animation: rotate 0.87s 0s linear infinite;
    -o-animation: rotate 0.87s 0s linear infinite;
    animation: rotate 0.87s 0s linear infinite;
}
.slim-loader-dark > div {
    border: 2px solid #999;
    border-bottom-color: transparent;
}
/**
 * LOGIN REGISTRATION
 *
 * Component used for:
 * - user login
 * - user registration
 * - user profile edit
 * - user lost password retrival
 *
 */
/* ------------------------------------ *\
   #GENERAL
\* ------------------------------------ */
/* Class of body */
.pnd-login {
    width: 100%;
    height: 100%;
    display: table;
    text-align: center;
    background: #fafbfc;
}
.pnd-login-content-wrapper {
    display: table-cell;
    position: relative;
    vertical-align: middle;
    padding: 0 15px;
}
.pnd-login-content {
    max-width: 560px;
    height: auto;
    margin: 0 auto;
    padding: 40px 0 20px;
    background: #fff;
    text-align: center;
    border: 1px solid #dfe2e6;
    border-radius: 3px;
    box-shadow: 0 4px 0 0px #dfe2e6;
}
/* Info footer */
.pnd-login-footer {
    display: inline-block;
    margin: 10px 0 0;
    color: #8d939a;
    font-size: 0.86rem;
}
.pnd-login-footer a {
    color: inherit;
    font-size: 0.86rem;
    cursor: pointer;
}
.pnd-login-footer a:hover {
    color: #3484e6;
    text-decoration: none;
}
/* ------------------------------------ *\
   #RESPONSIVE
\* ------------------------------------ */
/* This should work also for the Pundit Annotator */
@media all and (max-width: 500px) {
    .pnd-login {
        background: #fff;
    }
    .pnd-login-content-wrapper {
        padding: 0;
    }
    .pnd-login-content {
        width: auto;
        height: auto;
        padding: 20px;
        border: 0;
        box-shadow: 0 0 0 0 transparent;
    }
    .pnd-login-footer {
        display: none;
    }
}
/*# sourceMappingURL=login.css.map */
