/********************************************** Allgemein **********************************************/
* {
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-touch-callout: text;
-webkit-user-select: text;
-khtml-user-select: text;
-moz-user-select: text;
-ms-user-select: text;
user-select: text;
font-size: 100%;
vertical-align: middle;
outline: 0;
}
*:link {
-webkit-tap-highlight-color: rgba(135,200,250,0.4);
}
*::selection {
background: transparent;
}
*::-moz-selection {
background: transparent;
}
.selectable *::selection {
background: #8fdaff;
}
.selectable *::-moz-selection {
background: #8fdaff;
}
html {
height: 100%;
font-size: 100%;
background-color: #f0eee6;
transition: background-color 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
}
body {
height: 100%;
padding:0;
margin:0;
color: #3F464C;
overflow-x: hidden;
overflow-y: auto;
line-height: 1;
}
h1, h2, h3, h4, h5, p, span, div, hr, br, nav, header, section, menu {
margin: 0;
padding: 0;
border: 0;
}
input {
margin: 0;
padding: 0;
}
hr {
padding: 0;
border-top: 1px solid #8DA4A3;
margin: 1rem 0;
}
header {
height: 6.25rem;
width: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 100;
background-color: #006ec0;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-flex-direction: row;
-moz-box-flex-direction: row;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
transition: all 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
}
.hidden {
display: none;
}
.blue_bar_title {
-webkit-box-flex: 1 1 auto;
-moz-box-flex: 1 1 auto;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-box-align-self: center;
-moz-box-align-self: center;
-webkit-align-self: center;
-ms-align-self: center;
align-self: center;
margin: 0.3rem 0 0 0;
font-size: 3rem;
font-weight: bold;
text-align: left;
color: #fff;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
transition: all 150ms;
cursor: pointer;
}
.blue_bar_title.fade {
font-size: 0;
color: transparent;
}
.logoBox {
background-image: url("/css/rd/images/fritzLogo.svg");
background-position: center right;
background-repeat: no-repeat;
background-size: 7rem;
color: transparent;
width: 11rem;
height: 6.25rem;
}
.logoBox.fake {
background-image: none;
}
.dialog_outer {
height: 100%;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-justify-content: center;
-moz-box-justify-content: center;
-webkit-justify-content: center;
-ms-justify-content: center;
justify-content: center;
-webkit-box-align-items: center;
-moz-box-align-items: center;
-webkit-align-items: center;
-ms-align-items: center;
align-items: center;
background-image: url("/css/rd/images/login_background.svg");
background-position: center;
background-repeat: no-repeat;
background-size: 44rem;
padding: 6.5rem 0;
}
.dialog_outer p {
margin: 0.6rem 0;
}
.loginForm {
display: block;
}
.setFac .pushmailQuestion,
.setFac #sendFacReset,
.setFac #sendPushMail,
.setFac #setFac,
.pushmailSend,
.restore,
.pushmail .pushmailQuestion,
.pushmail #sendFacReset,
.pushmail #sendPushMail,
.pushmail #setFac,
.forgotPassForm,
.forgotPass .loginForm {
display: none;
}
.setFac .restore,
.pushmail .pushmailSend,
.forgotPass .forgotPassForm {
display: block;
visibility: visible;
}
.setFac .forgotPassForm {
display: none;
}
.pushmail.wait .pushmailSend {
visibility: hidden;
}
.intxt.wait,
.setFac.wait .dialog_content,
.pushmail.wait .dialog_content {
background-image: url("/css/rd/images/wait_circle_bright_back.gif");
background-position: center 1.5rem;
background-repeat: no-repeat;
background-size: 2rem;
}
.intxt.wait {
height: 2rem;
width: 100%;
margin: 0.5rem;
background-position: center;
}
.ErrorMsg,
.error_text,
.WarnMsgBold {
color: #cc0000;
}
.WarnMsgBold {
font-weight:bold;
}
.pushmailQuestion,
.pushmailSend,
#setFac,
.restore {
padding: 0 0.75rem;
}
.btn_form_foot button {
min-height: 2rem;
min-width: 7.5rem;
margin: 0 0.25rem;
background-color: #268edf;
color: #ffffff;
cursor: pointer;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
padding: 0 1rem;
will-change: margin, width, background-color, color;
transition: margin 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000),
width 400ms cubic-bezier(0.165, 0.840, 0.440, 1.000),
background-color 100ms,
color 100ms;
border: 0;
border-radius: 0;
}
.btn_form_foot button:active {
background-color: #57758c;
}
.btn_form_foot button:disabled {
background-color: #d5d5d5;
color: #969693;
cursor: default;
}
@media (max-width: 1023px) {
.btn_form_foot button {
min-height: 2.25rem;
}
}
@media (min-width: 760px) {
/*pc*/
.dialog_inner {
-webkit-box-flex: 0 0 33rem;
-moz-box-flex: 0 0 33rem;
-webkit-flex: 0 0 33rem;
-ms-flex: 0 0 33rem;
flex: 0 0 33rem;
margin: auto 0;
padding: 0;
}
.dialog_head_box {
text-align: left;
height: 3rem;
margin: auto;
border: 1px solid #8DA4A3;
background-color: #117ccd;
}
.dialog_head_box h2 {
margin: 0 0 0 1.25rem;
font-weight: bold;
font-size: 1.25rem;
color: #fff;
letter-spacing: 0.025rem;
line-height: 3rem;
}
.dialog_content {
background-color: #ffffff;
padding: 0.5rem;
border: 1px solid #8DA4A3;
border-top: none;
min-height: 5rem;
}
.formular {
text-align: left;
margin: 0;
padding: 0.1rem 0.75rem 0.1rem 0.75rem;
}
label,
input,
select {
margin: 0 0 0.3rem;
color: #3F464C;
vertical-align: middle;
display: inline-block;
}
.formular label {
width: 7.5rem;
margin-right: 0.3rem;
}
.formular .form_input_note {
margin-left: 7.8rem;
}
.formular input,
.formular select {
width: 14rem;
}
.formular input {
padding: 0 0.15rem;
}
.language_selection.formular input {
width: auto;
margin-right: 0.25rem;
}
.btn_form_foot {
border-top: 1px solid #8DA4A3;
margin-top: 1rem;
padding: 0.5rem 0.5rem 0 0.75rem;
text-align: right;
width: 100%;
}
#forgot_pass {
float: left;
}
#forgot_pass a {
display: inline-block;
text-decoration: none;
font-size: 0.85rem;
font-weight: normal;
color: #4269a4;
line-height: 2.25rem;
}
#forgot_pass a:hover {
text-decoration: underline;
}
}
@media (max-width: 759px) {
/*für mobile Ansicht*/
html {
background-color: #fff;
background-image: none;
}
body {
height: auto;
}
header {
height: 3.75rem;
}
.dialog_outer {
font-size: 1.25rem;
background-image: none;
padding: 5.125rem 0 3.375rem 0;
}
.blue_bar_title {
text-align: left;
padding: 1rem 0 1.035rem 0.15rem;
font-size: 1.25rem;
font-weight: normal;
}
.blue_bar_title.hide {
color: transparent;
}
.dialog_inner {
width: 90%;
margin: 0;
}
.dialog_head_box {
display: none;
}
.logoBox {
height: 3.75rem;
background-position: left 0.5rem center;
background-size: 3.75rem;
width: 5rem;
}
.formular {
text-align: left;
margin: 0;
padding: 0;
}
label,
input,
select {
vertical-align: middle;
display: inline-block;
margin: 0 0 0.3rem;
color: #3F464C;
}
.pushmailQuestion,
.pushmailSend,
#setFac,
.restore {
padding: 0;
}
.formular label {
width: 10rem;
}
.formular .form_input_note {
margin-left: 0;
}
.formular input {
padding: 0 0.15rem;
width: 14rem;
}
.formular select {
width: 14.1rem;
}
.btn_form_foot {
margin-top: 1rem;
text-align: center;
width: 100%;
}
input[type="button"]:not(.icon),
input[type="submit"]:not(.icon),
input[type="reset"]:not(.icon),
button:not(.icon) {
width: 100%;
min-height: 2.2rem;
margin: 0.75rem 0;
}
#forgot_pass {
position: fixed;
bottom: 0;
left: 0;
text-align: center;
width: 100%;
padding: 1rem 0;
background-color: #f1f6f9;
}
#forgot_pass a {
color: #3080C8;
}
.logoBox.fake {
display: none;
}
}
.perfTestHead {
border-top: 1px solid #ff0000;
margin: 0.5rem 0 0 0;
padding: 1rem 0.75rem 0.5rem 0.75rem;
color: #ff0000;
cursor: pointer;
}
.perfTestHead span {
display: inline-block;
height: 1rem;
width: 2rem;
background-image: url("/css/rd/images/link_open_red.svg");
background-position: center;
background-size: 1rem;
background-repeat: no-repeat;
}
.perfTestHead.show span {
background-image: url("/css/rd/images/link_closed_red.svg");
}
.perfTestMsg {
display: none;
padding: 0 0.75rem 0.5rem 0.75rem;
}
.perfTestMsg.show {
display: block;
}
.forgotPass .perfTestHead,
.forgotPass .perfTestMsg.show {
display: none;
}
.hintMsg {
font-weight: bold;
}
@media (max-width: 759px) {
.perfTestHead {
margin: 1rem 0 0 0;
padding: 1rem 0 0.5rem 0;
}
.perfTestMsg {
padding: 0 0 0.5rem 0;
}
}
@media (min-width: 2040px) {
html {
font-size: 0.79vw;
}
}