/*****************/
/*   CSS-Reset   */
/*****************/

html, body, div, span, applet,
object, iframe, h1, h2, h3, h4,
h5, h6, p, blockquote, pre, a, abbr,
acronym, address, big, cite, code, del,
dfn, em, font,img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody, tfoot,
thead, tr, th, td{
   background:transparent;
   border:0;
   margin:0;
   padding:0;
   vertical-align:baseline;
}


/*******************/
/*   Allgemeines   */
/*******************/

/* Lokale Google Webfont Schrift */
@font-face {
   font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Open Sans'), local('OpenSans'), url(../../../system/plugins/fonts/opensans/OpenSans-Regular.ttf) format('truetype');
}

@font-face {
   font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local('Open Sans'), local('OpenSans-Bold'), url(../../../system/plugins/fonts/opensans/OpenSans-Bold.ttf) format('truetype');
}

@font-face {
   font-family: 'Open Sans';
    font-style: italic;
    font-weight: 400;
    src: local('Open Sans'), local('OpenSans-Italic'), url(../../../system/plugins/fonts/opensans/OpenSans-Italic.ttf) format('truetype');
}

/* Grundlegende Seitendesigns */
body{
   background-color: #f3f4f6;
   font-family: 'Open Sans', sans-serif, Helvetica, "Trebuchet MS";
   color: #4c4c4c;
   font-weight:normal;
   color: #4c4c4c;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   cursor:default;
}

.print_arr{
   float: right;
   background-color: #000;
   color:#fff;
   position: relative;
   z-index: 999;
   margin-bottom: 5px;
   right: -102%;
   width:100%;
}

/* "Glow"-Effekt in Safari und Chrome entfernen */
select,
textarea,
input {
   outline: none !important;
}

sup{
   line-height:20px;
   vertical-align:top;
}

/* Fett */
.bold{
   font-weight:bold !important;
}

/* Verlinkungen */
a:link { text-decoration:none; color:#666; }
a:visited { text-decoration:none; color:#666; }
a:hover { text-decoration:none;  color:#666; }
a:active { text-decoration:none; color:#666; }
a:focus { text-decoration:none; color:#666; }

/* Trennlinie */
hr{
   height:1px;
   border:0px;
    border-bottom: 1px solid transparent;
    border-image: linear-gradient(to right, #6B7982 0%, #fff 80%);
    border-image-slice: 1;
}

/* Unsichtbare Bereiche */
.hidden{
   display:none;
}

.not_bold{
   font-weight: normal !important;
}

.center{
   text-align:center !important;
}

/* Weiße Schrift */
.white-font{
   color:#FFF;
}


/*************/
/*   Logos   */
/*************/
.logo_area{
   width:100%;
   z-index:6;
   cursor:default;
   position:absolute;
   min-width:800px;
}

.logo_left{
   width:400px;
   float: left;
    padding-top:3px;
}

.logo_left p{
   color: #4A5D66 !important;
   font-family: Arial;
   font-size: 20px;
   font-variant: small-caps;
   line-height: 28px;
}

.logo_left p span,
.logo_left p span strong{
   font-size: 10px;
   line-height: 19px !important;
    vertical-align: top;
}

.logo_left p span:hover{
   opacity: 1.0;
}

.logo_left img{
   height:45px;
   width:45px;
   padding-top:5px;
   padding-left:5px;
   padding-right:2px;
}

.logo_right{
    width: 330px;
   float: right;
   text-align:right;
}

.logo_right img{
   height:70px;
   width:auto;
   padding:5px;
}


/**********************/
/*   Seiten-Content   */
/**********************/

/* Seiten-Bereich */
.page{
   width:100%;
   height:100%;
   min-width:385px;
   min-height:400px;
   position: absolute;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   background-color: #F7F8F9;
}

/* Hinweis-Bereich */
.note{
   position: relative;
   top:100px;
   width:315px;
   margin-left: auto;
   margin-right: auto;
    background-image: linear-gradient(right, #fafafa 11%, #fff 56%);
    background-image: -o-linear-gradient(right, #fafafa 11%, #fff 56%);
    background-image: -moz-linear-gradient(left, #fafafa 11%, #fff 56%);
    background-image: -webkit-linear-gradient(right, #fafafa 11%, #fff 56%);
    background-image: -ms-linear-gradient(right, #fafafa 11%, #fff 56%);
    background-image: gradient(right, #fafafa 11%, #fff 56%);
    padding:15px;
   border-radius: 8px;
    -webkit-box-shadow: 0px 0px 2px #6B7982;
   -moz-box-shadow: 0px 0px 2px #6B7982;
   box-shadow: 0px 0px 2px #6B7982;
}

.note #head{
   font-size:12px !important;
   font-weight:bold;
   margin-top:2px;
   margin-bottom:8px;
}

.note #text{
   font-size:10px !important;
    padding-right:5px;
   text-align:justify;
}

.note #text a:link,
.note #text a:visited{
   text-decoration: underline;
}


/* Login-Bereich */
.login_area{
   margin-left: auto;
   margin-right: auto;
   margin-top:180px;
    position: static;
   z-index:99;
    padding:15px;
    width: 315px;
    border:0px solid #6b7982;
    border-radius:6px;
    -webkit-box-shadow: 0px 0px 2px #6B7982;
   -moz-box-shadow: 0px 0px 2px #6B7982;
   box-shadow: 0px 0px 2px #6B7982;
    background-image: linear-gradient(right, #fafafa 11%, #fff 56%);
    background-image: -o-linear-gradient(right, #fafafa 11%, #fff 56%);
    background-image: -moz-linear-gradient(left, #fafafa 11%, #fff 56%);
    background-image: -webkit-linear-gradient(right, #fafafa 11%, #fff 56%);
    background-image: -ms-linear-gradient(right, #fafafa 11%, #fff 56%);
    background-image: gradient(right, #fafafa 11%, #fff 56%);
}

.login{
    border-collapse: collapse;
    width:310px;
}

.login_head{
    font-size: 19px;
    font-variant: small-caps;
    font-weight: bold;
}

.login_titel{
   font-size: 13px;
   padding-bottom:10px;
   padding-top:5px;
}


.password_td_code{
   vertical-align: top !important;
   line-height: 30px;
   font-size:13px;
}

.username,
.password,
.password_large,
.secure_solution{
   border-radius:3px;
   border: 0px solid #6B7982;
   height:30px;
   width: 300px;
   padding-left:10px;
    -webkit-box-shadow: inset 0px 0px 2px #6B7982;
   -moz-box-shadow: inset 0px 0px 2px #6B7982;
    box-shadow: inset 0px 0px 2px #6B7982;
   margin-bottom:5px;
   -webkit-appearance: none;
   font-weight: bold;
   color: #888;
}

.password{
   width: 185px;
   margin-top:5px;
   font-size: xx-small;
}

.secure_solution{
   width: 60px;
   height:20px !important;
    margin-left: -5px;
    margin-right: 5px;
}

.username:active,
.password:active,
.password_large:active,
.secure_solution:active,
.username:focus,
.password:focus,
.password_large:focus,
.secure_solution:focus{
   color: #C9C9C9;
   cursor:pointer;
}


.login_button{
   -webkit-appearance: none;   /* iPad */
   width: 100px;
   height:30px;
   margin:0px;
   margin-top:6px !important;
   padding-left:10px;
   border: 0px solid #000;
   color:#fff;
   float:right;
   border-radius:3px;
   -webkit-box-shadow:  0px 0px 2px #6199ed;
   -moz-box-shadow:  0px 0px 2px #6199ed;
   box-shadow:  0px 0px 2px #6199ed;
   cursor:pointer;
   background-image: -webkit-linear-gradient(-20deg, #6199ed 0%, #3E7AD6 50%,#6199ed 100%);
   background-image: -moz-linear-gradient(-20deg #6199ed 0%, #3E7AD6 50%,#6199ed 100%);
   background-image: -o-linear-gradient(-20deg, #6199ed 0%, #3E7AD6 50%,#6199ed 100%);
   background-image: linear-gradient(-20deg, #6199ed 0%, #3E7AD6 50%, #6199ed 100%);
}

.login_button:hover{
   background-image: -webkit-linear-gradient(-20deg, #6199ed 0%, #3E7AD6 50%,#3E7AD6 100%) !important;
   background-image: -moz-linear-gradient(-20deg #6199ed 0%, #3E7AD6 50%,#3E7AD6 100%) !important;
   background-image: -o-linear-gradient(-20deg, #6199ed 0%, #3E7AD6 50%,#3E7AD6 100%) !important;
   background-image: linear-gradient(-20deg, #6199ed 0%, #3E7AD6 50%, #3E7AD6 100%) !important;
}

.login_button:active,
.login_button:focus{
   background-image: -webkit-linear-gradient(-20deg, #3E7AD6 0%, #3E7AD6 50%,#3E7AD6 100%) !important;
   background-image: -moz-linear-gradient(-20deg #3E7AD6 0%, #3E7AD6 50%,#3E7AD6 100%) !important;
   background-image: -o-linear-gradient(-20deg, #3E7AD6 0%, #3E7AD6 50%,#3E7AD6 100%) !important;
   background-image: linear-gradient(-20deg, #3E7AD6 0%, #3E7AD6 50%, #3E7AD6 100%) !important;

   -webkit-box-shadow:  0px 0px 1px #6199ed;
   -moz-box-shadow:  0px 0px 1px #6199ed;
   box-shadow:  0px 0px 1px #6199ed;
}


/*************************/
/*   Fehlervalidierung   */
/*************************/

.fehler{
     background-color:#AA362E;
     opacity:0.7;
     color:#fff;
}


/****************/
/*   Fußzeile   */
/****************/
.footer_area{
   bottom: 0px;
   position: absolute;
   width: 100%;
    min-width:800px;
   z-index:5;
   cursor:default;
}

.footer_area td{
   vertical-align: bottom;
}


.copyright_show{
    min-width: 180px;
}

.footer_area table{
   color:#666;
   width:100%;
   font-size:9px;
}

.footer_area table td{
   padding:2px;
   padding-left:8px;
   padding-right:8px;
   line-height: 22px;
}

.footer_area a,
.footer_area a:link,
.footer_area a:visited,
.footer_area a:hover,
.footer_area a:active,
.footer_area a:focus{
   color:#666 !important;
}

.footer_area sup{
   color:#666 !important;
    font-size: 7px;
    font-weight: normal !important;
    vertical-align: text-bottom !important;
    line-height:22px;
}

.footer_lizenz{
   width:40%;
   text-align:right !important;
   //min-width:420px !important;
}