/* Globals */
.brand {
  height: 35px;
}

.delete-button {
  width: 150px;
  height: 50px;
}

@media (max-width: 320px) {
  .delete-button {
    width: 120px;
    height: 50px;
  }
}

/* Account Page screen */
.personal-info-form .pf-c-form__group-control {
  max-width: 600px;
}

/* Device Activity screen */
.signed-in-device-list .pf-c-data-list__item-row {
  --pf-c-data-list__item-row--PaddingRight: 0;
  --pf-c-data-list__item-row--PaddingLeft: 0;
}

.signed-in-device-list .pf-c-data-list__expandable-content-body {
  --pf-c-data-list__expandable-content-body--PaddingRight: 0;
}

.signed-in-device-grid {
  grid-template-columns: auto repeat(11, [col-start] 1fr);
}

.signed-in-device-list.pf-c-data-list {
  --pf-c-data-list--sm--BorderTopWidth: 0;
}

.pf-c-data-list__item {
  --pf-c-data-list__item--BorderBottomWidth: 1px;
  --pf-c-data-list__item--BorderBottomColor: var(--pf-global--BorderColor--100);
}

.signed-in-device-list.pf-c-data-list {
  --pf-c-data-list--BorderTopWidth: 0;
}

@media (min-width: 576px) {
  .pf-c-data-list__item {
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: var(--pf-c-data-list__item--BackgroundColor);
    border-bottom: var(--pf-c-data-list__item--BorderBottomWidth) solid var(--pf-c-data-list__item--BorderBottomColor);
  }

  .signed-in-device-list.pf-c-data-list {
    --pf-c-data-list--BorderTopWidth: 0;
  }
}

@media (min-width: 768px) {
  .signed-in-device-list .pf-c-description-list {
    --pf-c-description-list--GridTemplateColumns--count: 5;
  }
}

/* Signing in screen */
.title-case:first-letter,
.cred-title:first-letter,
#otp-not-set-up .pf-c-empty-state__body:first-letter {
  text-transform: capitalize
}

/* Applications screen */
#applications-list-header .pf-c-data-list__item-content {
  --pf-c-data-list__item-content--md--PaddingBottom: 1rem;
}

.pf-u-pl-35xl {
  padding-left: 4.5rem;
}

@font-face{font-family:Rubik;src:url("rubik.woff") format("woff");font-display:swap;}
@font-face{font-family:CDR;src:url("cdr.woff") format("woff");font-display:swap;}
:root{
	--time:6s;
	--menu:200px;
	--menu-aus:-220px;
	--label:50%;
	--max-breite:1015px;
	--links:calc((100% - var(--menu)) / 2 - var(--max-breite));
	--transition:.2s;
	--green:#4B5;
	--cyan:#0CD;
	--yellow:#DB0;
	--orange:#F80;
	--red:#E26;
	--hover:#294159;
	--button:#BA1F27;
	--text1:#000;
	--text2:#294159;
	--text3:#FFF;
	--ovo-grau:#A0B3C6;
	--ovo-blau:#40668B;
	--wichtig2:linear-gradient(90deg,var(--ovo-grau),var(--red),var(--ovo-grau));
	--streifen:url("data:image/svg+xml,<svg width='40' height='40' viewBox='0 0 4 4' xmlns='http://www.w3.org/2000/svg'><g fill='rgba(0,0,0,0.07)' fill-rule='evenodd'><path d='M0 4L4 0H2L0 2M4 4V2L2 4'/></g></svg>");
	--streifen-dunkel:url("data:image/svg+xml,<svg width='40' height='40' viewBox='0 0 4 4' xmlns='http://www.w3.org/2000/svg'><g fill='rgba(0,0,0,0.2)' fill-rule='evenodd'><path d='M0 4L4 0H2L0 2M4 4V2L2 4'/></g></svg>");
}
*{box-sizing:border-box;-webkit-font-smoothing:antialiased;font-family:Rubik,sans-serif;position:relative;padding:0;margin:0;letter-spacing:.3px}
*:focus,*:active{outline:0}
a{color:var(--button);text-decoration:none}
body{background:var(--ovo-grau)}
header{display:none}
.ovo_button, .login button{
	color:#FFF!important;
	background:var(--button);
	height:40px;
	text-align:center;
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius:10px;
	padding:0;
	margin:25px 0 0 0;
	border:none;
	font-size:18px;
	float:left;
}
#copyright{position:absolute;bottom:15px;left:5%;width:90%;text-align:center;font-size:14px;color:var(--text2)}
.login{width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:column}
.login article{width:90%;max-width:400px;border-radius:20px;background:var(--ovo-blau);padding:20px;z-index:2}
.login input{border-radius:10px;width:100%;height:40px;line-height:40px;text-align:center;box-shadow:none!important}
.login h1{font-size:24px;width:100%;text-align:center;font-weight:600;margin:20px 0;color:var(--text3);text-transform:uppercase}
.login label{font-size:16px;width:100%;text-align:center;display:inline-block;margin:10px 0;color:var(--text3)}
.login hr{height:25px;outline:0}
.login cite{width:100%;padding:20px;color:#FFF;border-radius:10px;background:var(--red);text-align:center;margin:30px 0;font-style:normal;font-size:19px;display:block;text-shadow:1px 1px 1px rgba(0,0,0,0.4)}
.login cite.gut{background:var(--green)}
.login #kennwort-vergessen{display:none}
.login button, .login .ovo_button{width:48%;cursor:pointer}
.login button:hover, .login .ovo_button:hover{background:var(--hover)!important}
a:hover{color:var(--hover)}
.login button{margin-left:4%}
.login a.hilfe{position:absolute;left:0;bottom:-35px;text-align:center;width:100%;max-width:400px;display:inline-block;font-size:18px}
.login .links{margin:0!important}
.login .links a{text-decoration:none;color:#FFF}
.login .rechts{margin-left:2%}
.feature:nth-child(1){animation-delay:1.2s}
.feature:nth-child(2){animation-delay:1.4s}
.feature:nth-child(3){animation-delay:1.6s}
.feature{animation:feature-count .3s linear;animation-fill-mode:forwards;opacity:0;left:-200px}
.feature b{background:var(--ovo-blau);color:#FFF;text-align:center;border-radius:15px;float:left;width:120px;height:90px;font-size:16px;display:flex;flex-direction:column;justify-content:center;align-items:center;font-weight:400;margin-bottom:20px}

input,select,textarea{border:0;color:var(--ovo-blau);float:left;font-size:18px;cursor:text;padding:0 10px;background:#FFF!important;box-shadow:inset 0 0 2px 0 var(--ovo-grau)!important;appearance:none!important;clear:both}
@keyframes fadeout{0%{top:-200px}10%{top:0}80%{top:0}100%{top:-200px}}
.messagebox{display:flex;top:0;left:0;position:fixed;width:100%;height:100vh;align-items:flex-start;justify-content:flex-start;pointer-events:none;z-index:999;flex-direction:column}
.message{animation:fadeout var(--time);width:100%;color:#FFF;padding:10px;top:-200px;text-align:center;font-size:20px;z-index:9999;text-shadow:1px 1px 1px rgba(0,0,0,0.6);transition:0.2s;animation-fill-mode:forwards;background-color:var(--red);background-image:var(--streifen);background-repeat:repeat}

@media only screen and (min-height:1024px)
{
	@keyframes feature-tip{0%{top:-300px;opacity:0}100%{top:0;opacity:1}}
	@keyframes feature-count{0%{left:-200px;opacity:0}70%{opacity:.4}100%{left:0;opacity:1}}
	.overso-tip{animation:feature-tip .3s linear;animation-fill-mode:forwards;animation-delay:3s;width:200px;margin-top:70px;opacity:0;z-index:1}
	.feature-box{display:flex;flex-direction:row;justify-content:space-between;width:90%;max-width:400px;margin-bottom:10px}
}
@media only screen and (max-height:1023px) and (min-width:1024px)
{
	.login{flex-direction:row}
	@keyframes feature-tip{0%{left:50%;opacity:0}100%{left:0;opacity:1}}
	@keyframes feature-count{0%{left:-200px;opacity:0}100%{left:0;opacity:1}}
	.overso-tip{margin-left:40px;animation:feature-tip .4s linear;animation-fill-mode:forwards;animation-delay:3s;width:200px;margin-top:10px;opacity:0;z-index:1}
	.feature-box{display:flex;flex-direction:column;justify-content:space-between;width:190px;margin-right:50px;align-items:flex-end}
}
@media only screen and (max-width:768px)
{
	.login{flex-direction:column;padding:20px 10px;justify-content:flex-start}
	.login h1{font-size:20px}
	.overso-tip,.feature-box{display:none}
}
@media only screen and (max-height:420px)
{
	.login img{display:none}
	.login h1{margin:0}
}
