@charset "UTF-8";

@font-face{
    font-family:amsterdam sans;
    font-style:normal;
    font-weight:300;
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-Light.eot?#iefix);
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-Light.eot?#iefix) format("eot"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff2/AmsterdamSans-Light.woff2) format("woff2"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff/AmsterdamSans-Light.woff) format("woff")
}
@font-face{
    font-family:amsterdam sans;
    font-style:normal;
    font-weight:400;
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-Regular.eot?#iefix);
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-Regular.eot?#iefix) format("eot"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff2/AmsterdamSans-Regular.woff2) format("woff2"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff/AmsterdamSans-Regular.woff) format("woff")
}
@font-face{
    font-family:amsterdam sans;
    font-style:italic;
    font-weight:400;
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-Italic.eot?#iefix);
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-Italic.eot?#iefix) format("eot"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff2/AmsterdamSans-Italic.woff2) format("woff2"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff/AmsterdamSans-Italic.woff) format("woff")
}
@font-face{
    font-family:amsterdam sans;
    font-style:normal;
    font-weight:700;
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-Bold.eot?#iefix);
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-Bold.eot?#iefix) format("eot"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff2/AmsterdamSans-Bold.woff2) format("woff2"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff/AmsterdamSans-Bold.woff) format("woff")
}
@font-face{
    font-family:amsterdam sans;
    font-style:italic;
    font-weight:700;
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-BoldItalic.eot?#iefix);
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-BoldItalic.eot?#iefix) format("eot"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff2/AmsterdamSans-BoldItalic.woff2) format("woff2"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff/AmsterdamSans-BoldItalic.woff) format("woff")
}
@font-face{
    font-family:amsterdam sans;
    font-style:normal;
    font-weight:800;
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-ExtraBold.eot?#iefix);
    src:url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/eot/AmsterdamSans-ExtraBold.eot?#iefix) format("eot"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff2/AmsterdamSans-ExtraBold.woff2) format("woff2"),url(https://www.amsterdam.nl/views/core/fonts/AmsterdamSans/woff/AmsterdamSans-ExtraBold.woff) format("woff")
}

body{
    font-family:amsterdam sans,arial,sans-serif;
}

html {
    font-size: 10px !important;
}

.login-pf {
    background-color: #e6e6e6;
    background-image: none;}

.login-pf body {
    background: url("../img/amsterdam-bg.png") repeat-x;
    max-width:1400px;
    margin:auto;
    padding-bottom:100px;
    min-height:100%;
    height: auto;
    background-color:#fff;
    color:#000;}

.login-pf-page {
    max-width:960px;
    margin-left:auto;
    margin-right:auto;
    padding-top:0;}

.login-pf-page .login-pf-page-header {
    margin-bottom:5.5rem;}

.login-pf-page .login-pf-header h1 {
    text-align:center;}

.login-pf-page #kc-back {
    display:none;}

body,button,input,keygen,select,textarea {
    font-size:1.6rem;
    line-height:1.25;
    color:inherit;
    font-weight:400}

.login-pf-page .card-pf {
    width:385px;
    padding:20px 40px 30px 40px;
    background:none;}

.login-pf-page .card-pf p {
    color:inherit;}

h1, h2, h3, h4 {
  font-weight:700; }

h1 {
  font-size:3.0rem !important;
  line-height:3.2rem !important; }

h2, h3 {
  font-size:1.5rem;
  line-height:1.875rem; }

h4 {
  font-size:1.25rem;
  line-height:1.75rem; }

a:link {
    color:#004699;
    text-decoration:underline;}

a:active, a:hover {
    color:#EC0000 !important;
    text-decoration:underline;}

a:focus {
    color:#004699;
    background-color:#f3c927;}

.btn, .pf-c-button {
    color:#fff;
    width:300px;
    height:44px;
    background-image:none;
    background-color:#084897;
    font-size:18px;
    font-weight:700;
    padding:6px;
    box-shadow:none;
    filter:none;
    border:none;
    box-sizing:border-box;
    margin-bottom:15px;}

.pf-c-button.pf-m-control{
  width: auto;
}

.pf-c-button.pf-m-primary {
    background-color: #084897;
}
.pf-c-button.pf-m-block {
    width: 300px;
}

a.btn:link, a.pf-c-button:link {
    color:#fff;
    text-decoration:none;}

.btn:hover, .btn:active, .pf-c-button:hover, .pf-c-button:active {
    background-color:#053A78 !important;
    color:#fff !important;
    border:none !important;}

.btn:focus, .pf-c-button:focus {
    background-color:#084897 !important;
    color:#fff !important;
    border:4px solid #f3c927 !important; }

input#kc-cancel {
    background-color:#b4b4b4 !important;
    color:#000 !important;}

input#kc-cancel:hover, input#kc-cancel:active {
    background-color:#989898 !important;}

input#kc-cancel:focus {
    background-color:#b4b4b4 !important;
    color:#000 !important;
    border:4px solid #f3c927 !important; }

.formulier {
    font-size: 1rem; }

.login-pf-page .form-control, .login-pf-page .pf-c-form-control,
.login-pf-page .form-control:focus, .login-pf-page .pf-c-form-control:focus,
.login-pf-page .form-control:hover, .login-pf-page .pf-c-form-control:hover,
.login-pf-page .form-control:active, .login-pf-page .pf-c-form-control:active {
    border:1px solid #666666;
    box-shadow:none;
    height:44px;
    width:300px;
    font-size:inherit;
    transition:none;}

.login-pf-page .login-pf-settings {
    width: 300px;}

.control-label, .pf-c-form__label-text {
    font-weight: 700;}

.form-horizontal .control-label, .form-horizontal .pf-c-form__label {
    margin-bottom:5px;}

.pf-c-form__label {
    margin-bottom: 5px;
    width: 300px;}

.alert {
    padding:13px 19px 13px 19px;
    border:none;}

.alert > .pficon, .alert > .pf-c-alert__icon {
    display:none;}

.alert ul {
    margin-top:10px;
    margin-bottom:0px;}

.alert-error {
    background-color: #EC0000;
    color: #fff;}

.alert-success {
    background-color: #00A03C;
    color: #fff;}

.alert-warning {
    padding:0px;
    color:#000;
    background-color:#fff;}

#kc-info-message ul {
    margin-top:20px;}

#kc-info-message li {
    margin-bottom:5px;}

.login-pf .container {
    padding-top: 40px;}

.login-pf a:hover {
    color: #0099d3;}

.login-pf p {
    margin:0 0 30px 0;}

#kc-login {
  font-family: "amsterdam sans";
}

#kc-logo {
    width: 100%;}

#kc-logo-wrapper {
    height: 63px;
    width: 300px;
    margin: 62px auto 0;}

div.kc-logo-text {
    background-image: url(../img/logo.svg);
    background-repeat: no-repeat;
    height: 68px;
    width: 85px;
    position:relative;
    top:0px;
    left:20px;
    padding:1px 0 0 140px;}

div.kc-logo-text span {
    font-weight: 700;
    font-size:2.6rem;
    line-height:2.6rem;}

#kc-header {
    overflow: visible;
    white-space: nowrap;
    position:relative;}

#kc-header-wrapper {
    padding: 20px 0px;
    white-space: nowrap;}

#kc-content {
    width: 100%;}

#kc-info {
    padding-bottom: 200px;
    margin-bottom: -200px;}

#kc-info-wrapper {
    font-size: 13px;}

#kc-form-options span {
    display: block;}

#kc-form-options .checkbox {
    margin-top: 0;
    color: #72767b;}

#kc-terms-text {
    margin-bottom: 20px;}

#kc-registration {
    margin-bottom: 15px;}

/* TOTP */

ol#kc-totp-settings {
    margin: 0;
    padding-left: 20px;}

#kc-totp-settings p {
    margin-bottom:10px;}

ul#kc-totp-supported-apps {
  margin-bottom: 10px;}

#kc-totp-secret-qr-code {
    max-width:150px;
    max-height:150px;}

#kc-totp-secret-key {
    background-color: #fff;
    color: #333333;
    font-size: 16px;
    padding: 10px 0;}

#kc-totp-supported-apps li {
    list-style-type:disc;}

/* OAuth */

#kc-oauth h3 {
    margin-top: 0;}

#kc-oauth ul {
    list-style: none;
    padding: 0;
    margin: 0;}

#kc-oauth ul li {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 12px;
    padding: 10px 0;
}

#kc-oauth ul li:first-of-type {
    border-top: 0;
}

#kc-oauth .kc-role {
    display: inline-block;
    width: 50%;
}

/* Code */
#kc-code textarea {
    width: 100%;
    height: 8em;
}

/* Social */

#kc-social-providers ul {
    padding: 0;}

#kc-social-providers li {
    display: block;}

#kc-social-providers li:first-of-type {
    margin-top: 0;}

.zocial,
a.zocial  {
    width: 100%;
    font-weight: normal;
    font-size: 14px;
    text-shadow: none;
    border: 0;
    background: #f5f5f5;
    color: #72767b;
    border-radius: 0;
    white-space: normal;
}
.zocial:before {
  border-right: 0;
  margin-right: 0;
}
.zocial span:before {
    padding: 7px 10px;
    font-size: 14px;
}
.zocial:hover {
    background: #ededed !important;
}

.zocial.facebook,
.zocial.github,
.zocial.google,
.zocial.microsoft,
.zocial.stackoverflow,
.zocial.linkedin,
.zocial.twitter {
    background-image: none;
    border: 0;
    box-shadow: none;
    text-shadow: none;
}

/* Copy of zocial windows classes to be used for microsoft's social provider button */
.zocial.microsoft:before{ content: "\f15d"; }
.zocial.stackoverflow:before{ color: inherit; }

@media (min-width: 768px) {
    #kc-container-wrapper {
        position: absolute;
        width: 100%;
    }

    .login-pf .container {
        padding-right: 80px;
    }
    .login-pf-page .login-pf-header {
        margin-bottom: 30px;}

    #kc-locale {
        position: relative;
        text-align: right;
        z-index: 9999;
    }
}

@media (max-width: 540px) {

    h1 {
        font-size:2.4rem !important;
        line-height:3.0rem !important;}
    h2 {
        font-size:2.0rem;
        line-height:2.8rem;}

    #kc-header {
        padding: 10px 15px 0px 15px;
        float: none;
        text-align: left;}

    #kc-header-wrapper {
        padding:0;
        font-size:1.8rem;}

    #kc-logo-text {
        padding:1px 0 0 114px;}

    div.kc-logo-text span {
        position:relative;
        top:-4px;
        font-size:1.8rem;
        line-height:2.5rem;}

    #kc-form {
        float: none;}

    #kc-info-wrapper {
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        margin-top: 15px;
        padding-top: 15px;
        padding-left: 0px;
        padding-right: 15px;}

    #kc-social-providers li {
        display: block;
        margin-right: 5px;}

    .login-pf .container {
        padding-top: 15px;
        padding-bottom: 15px;}

    #kc-locale {
        position: absolute;
        width: 200px;
        top: 20px;
        right: 20px;
        text-align: right;
        z-index: 9999;}

    #kc-logo-wrapper {
        background-size: 100px 21px;
        height: 21px;
        width: 100px;
        margin: 20px 0 0 20px;}

    .login-pf body {
        background-image:url("../img/amsterdam-bg-mobile.png");}

    div.kc-logo-text {
        background-image:url("../img/logo-mobile.svg");}

    .login-pf-page .login-pf-page-header {
        margin-bottom:2.5rem;}
}

@media (min-height: 646px) {
    #kc-container-wrapper {
        bottom: 12%;
    }
}

@media (max-height: 645px) {
    #kc-container-wrapper {
        padding-top: 50px;
        top: 20%;
    }
}

.card-pf form.form-actions .btn {
    float: right;
    margin-left: 10px;
}

#kc-form-buttons {
  margin-top: 15px;
}

.login-pf-page .login-pf-brand {
  margin-top: 20px;
  max-width: 360px;
  width: 40%;
}

.card-pf {
  background: #fff;
  margin: 0 auto;
  padding: 0 20px;
  max-width: 500px;
  border-top: 0;
  box-shadow: 0 0 0;
}

.login-pf-page .login-pf-signup {
  font-size: 15px;
  color: #72767b;
}
#kc-content-wrapper .row {
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 768px) {
  .login-pf-page .login-pf-social-section:first-of-type {
    padding-right: 39px;
    border-right: 1px solid #d1d1d1;
    margin-right: -1px;
  }
  .login-pf-page .login-pf-social-section:last-of-type {
    padding-left: 40px;
  }
  .login-pf-page .login-pf-social-section .login-pf-social-link:last-of-type {
    margin-bottom: 0;
  }
}

.login-pf-page .login-pf-social-link {
  margin-bottom: 25px;
}
.login-pf-page .login-pf-social-link a {
  padding: 2px 0;
}

.login-pf-page.login-pf-page-accounts {
  margin-left: auto;
  margin-right: auto;
}

.login-pf-page .btn-primary {
    margin-top: 0;
}
.username_input_info {
    display: block;
    line-height: 1.2;
    padding-bottom: 8px;
}