﻿@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');

body {
    font-family: 'Roboto';
}
.navbar-header {
  position: relative;
  top: -4px;
}
.navbar-brand > .icon-banner {
  position: relative;
  top: -2px;
  display: inline;
}
.icon {
  position: relative;
  top: -10px;
}
.logged-out iframe {
  display: none;
  width: 0;
  height: 0;
}
.page-consent .client-logo {
  float: left;
}
.page-consent .client-logo img {
  width: 80px;
  height: 80px;
}
.page-consent .consent-buttons {
  margin-top: 25px;
}
.page-consent .consent-form .consent-scopecheck {
  display: inline-block;
  margin-right: 5px;
}
.page-consent .consent-form .consent-description {
  margin-left: 25px;
}
.page-consent .consent-form .consent-description label {
  font-weight: normal;
}
.page-consent .consent-form .consent-remember {
  padding-left: 16px;
}
.grants .page-header {
  margin-bottom: 10px;
}
.grants .grant {
  margin-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid lightgray;
}
.grants .grant img {
  width: 100px;
  height: 100px;
}
.grants .grant .clientname {
  font-size: 140%;
  font-weight: bold;
}
.grants .grant .granttype {
  font-size: 120%;
  font-weight: bold;
}
.grants .grant .created {
  font-size: 120%;
  font-weight: bold;
}
.grants .grant .expires {
  font-size: 120%;
  font-weight: bold;
}
.grants .grant li {
  list-style-type: none;
  display: inline;
}
.grants .grant li:after {
  content: ', ';
}
.grants .grant li:last-child:after {
  content: '';
}
.inputStyled {
    background: transparent;
    outline: 0;
    border: 0;
    padding: 2px 0px;
    border-bottom: 1px solid #9bb1da;
    font-family: 'Roboto-Regular', 'Roboto';
    font-size: 12px;
    color: #333333;
    padding-right: 0px !important;
    display: flex;
    flex: 1 0 auto;
    max-width: 100%;
}
.labelStyled {
    font-family: 'Roboto-Bold', 'Roboto';
    font-weight: 700;
    font-size: 12px;
    color: #333333;
    position: relative;
}

.text-validation-error {
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 11px;
    color: #F36750;
    transition: 3s ease-in;
}

.validation-summary-errors ul {
    list-style: none;
    padding-left:0;
}

.buttonStyled {
    cursor: pointer;
    padding: 10px 20px;
    color: #ffffff;
    background-color: #398bf7;
    border: 1px solid #ffffff;
    border-radius: 2px;
    margin-top: 20px;
}
.display-hidden {
    display:none;
}
.leftside, .rightside {
    height: 100vh;
    width: 100%;
    display:flex;
}
.rightside {
    justify-content:center;
    align-items:center;  
}
.leftside {
    justify-content: center;
    align-items: center;
}
.nopadding {
    padding: 0 !important;
    margin: 0 !important;
}
img.login-logo {
    margin-bottom: 40px;
    width: 130px;
}
img.login-bg {
    position: inherit !important;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
img.login-screen {
    width: 60%;
    position: absolute;
    bottom: 0px;   
    display: flex;   
    flex-direction: row;
    justify-content: center;
    overflow:hidden
}
.login-slogan {
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Roboto-Medium', 'Roboto';
    font-weight: 700;
    font-size: 30px;
    fill: #fff;
    color: #394a9d;
    white-space: nowrap;
}
.login-sub-slogan {
    font-family: 'Roboto-Medium', 'Roboto';
    transform: translate(-50%, -50%);
    font-size: 18px;
    left: 50%;
    top: 15%;
    position: absolute;
    fill: #fff;
    color: #394a9d;
    text-align: center;
    white-space: nowrap;
}
.linkStyled{
    font-family: 'Roboto-Regular', 'Roboto';
    font-size: 11px;
    fill: #2a8adb;
    color: #2a8adb;
}
.copyright {
    font-family: 'Roboto-Regular', 'Roboto';
    font-size: 10px;
    fill: #535353;
    color: #535353;
    bottom: 0;
    margin-bottom: 50px;
}
.copyright-content {
    justify-content: center;
    flex-direction: column;
    height: inherit;
    width: inherit;
}
.copyright-content p {
    font-family: 'Roboto-Regular', 'Roboto';
    font-size: 10px;
    fill: #535353;
    color: #535353;
    margin-top: 2em;
    position: absolute;
    bottom: 50px;
} 