/*
#=================================================================
#
#  Author: Thomas Wahlmann
#
#=================================================================
 */



/*
 * main layout concept
 */
body {
   font-family: Arial,sans-serif;
   font-size: 13px;
   color: black;
   margin: 0 auto;
   background-color: #D0D0D0;
}

#main_layout{
   width: 100%;
   border-spacing: 0px;
}
#header_left  {   }
#header_right {   }
#header_middle {
   background-repeat: no-repeat;
   width: 845px;
   height: 103px;
}
#content_left  {   background-image: url(image/shadow_left.png);  background-position: top right; background-repeat: repeat-y;  }
#content_right {   background-image: url(image/shadow_right.png); background-position: top left;  background-repeat: repeat-y;  }
#content_middle {
   background-color: #FFFFEE;
   text-align: left;
   padding: 10px;
   width: 820px;
}
#footer_left  {   background-image: url(image/shadow_buttomleft.png);  background-position: top right; background-repeat: no-repeat;  }
#footer_right {   background-image: url(image/shadow_buttomright.png); background-position: top left;  background-repeat: no-repeat;  }
#footer_middle {
   background-image: url(image/shadow_buttom.png);
   background-repeat: repeat-x;
   background-position: top right; 
   height: 70px;
}


/* header & links */
h1 {  color: white; background-color: #303030;   margin-right: 00%;  padding-left: 20px; }
h2 {  color: white; background-color: #404040;   margin-right: 10%;  padding-left: 20px; }
h3 {  color: white; background-color: #505050;   margin-right: 20%;  padding-left: 20px; }
h4 {  color: white; background-color: #606060;   margin-right: 30%;  padding-left: 20px; }

h1 { margin-top: 0px; margin-bottom: 5px;   }
hr { margin-right: 60%; }

h1, h2, h3, h4 { border-radius: 7px; }


span.small    { padding-left: 10px;   font-size: 85%;  font-weight: normal; }

td, th {  white-space: nowrap;  }


a:link    {  color: #303090; /* text-decoration: none;*/ }
a:visited {  color: #403090; /* text-decoration: none;*/ }
a:hover   {  color: #303090; text-decoration: underline; }

/*a:before {
   content: ">";  text-decoration: none;
   padding-right: 5px;  padding-left: 5px;
   color: #6060FF;
   font-size: 70%; font-weight: bold;
}*/

/* remove border around images in links (for IE) */
a > img { border: 0; }

/*
 * footer
 */
span.footer { 
   display: block;
   position: relative;
   border-top: 5px solid #2C367D;
   margin-right: 10%; 
   margin-top: 30px;   
   color: #505050;
   font-size: 80%;
   height: 10px;
}
span.footer .left   {  position: absolute; left:  0%;  width: 40%;   }
span.footer .middle {  position: absolute; left: 40%;  text-align: center; }
span.footer .right  {  position: absolute; right: 0%;  color: #D0D0D0;  font-style: italic;  }

/*   
span.warning {
   background-color: #DDDDFF;
   color: red;
   margin-top: 7px;
}
*/

/*
 * login dialog
 */
 
form.login {
   border-radius: 15px; 
   width: 50%;
   border: 3px solid #808080;
   background-color: #F8F8F8;
   margin: 15px;  
   padding: 15px;
   margin-left: 150px;
   text-align: center;
}

form.login .greet,
form.login .errmsg,
form.login .link,
form.login .field,
form.login .info,
form.login .submit {
   display: block;
   border-radius: 5px;
   padding: 3px;
   margin-top: 0px; margin-bottom: 15px;  
   margin-left: 50px; margin-right: 50px;
   color: black;
}
form.login .greet {
   font-size: 130%;
   background-color: #303030;
   color: #F0F0F0;
   margin-left: 0px; margin-right: 0px;
}
form.login .errmsg {
   background-color: #9D2C36;
   color: #F0F0F0;
}
form.login .link {
   background-color: #e0e0FF;
   border: 1px solid #202020;
}

form.login .field {
   border: 1px solid #404040;
   margin-top: -1px; margin-bottom: 0px;
   color: black;
}
form.login .info {
    font-size: 85%;
}
form.login .submit {
   padding-top: 10px; 
   margin-bottom: 0px;
}

form.login .field .text,
form.login .field input {
   display: inline-block; 
   width: 80px; 
}

/*
 * login info
 */
 
#logininfo { display: block;  position: relative; }
#logininfo .userinfo {
   position: absolute; right: 20px;
   text-align: right;
   font-size: 90%;    
   color: white;
}
#logininfo .userinfo .logout a {
   background-color: #FF3030;   
   padding-left: 5px; padding-right: 5px;
   text-decoration: none; 
   font-weight: bold;
   color: white;
}


/*
 * navigation /locale
 */
div.top_bar {
   display: block;  position: relative;   
   padding: 2px;
}
div.top_bar .locale {
   position: absolute; right: 10px;
}
div.top_bar .navigation {
   border-bottom: 2px solid #808080;
   border-top:    2px solid #808080;
   padding-right: 100px;
}

div.top_bar .locale a .active   {   border-bottom: 2px solid #444444;  }
div.top_bar .locale a .inactive {   border-bottom: 2px solid white;  }

/*
div.top_bar .locale   {   border-right: 1px solid #99A2AB; border-left: 1px solid #99A2AB; }
*/

/*
 ************* content table *************
 */
span.content table {
   border: 3px solid #808080; border-collapse:collapse;
   background-color: #F8F8F8;
   margin-top: 15px;
}
span.content table td,
span.content table th {
   border: 1px solid #808080;  border-collapse: collapse; 
   padding: 5px;
   vertical-align: top;
}

span.content table th {
   text-align: center;
   font-weight: normal;
   font-style: italic;
   background-color: #e0e0e0;
   color: #505050;
}
tr.tablesubheader th { font-size: 80%;    border-top: none; }


table td.value  {  text-align: right;   }
table td.center {  text-align: center;  }
table td.small  {  font-size: 80%;      }




/*
 ************* info table *************
 */
span.info table {
    border-radius: 7px; 
    border: 2px solid #808080; border-collapse:collapse;
    background-color: #F8F8F8;
    margin: 15px;
}
span.info table td,
span.info table th {
    border: 1px dashed #808080;
    border-collapse: collapse;
    padding: 3px;
    vertical-align: top;
    font-size: 85%;
}

span.info table th {
    text-align: left;
    font-weight: normal;
    font-style: italic;
    background-color: #e0e0e0;
    color: #606060;
}

table.route_info    {    padding: 0px;   margin: 0px;  }
table.route_info td {    vertical-align: top;   padding-right: 10px;  }
table.route_info td span.info table {    margin: 0px;    }

span.info table th.locA {   color: #FF2020;   }
span.info table th.locB {   color: #2020FF;   }


/*
 * route table
 */
.route  tr.rowhead {  
    border-top: 2px solid #808080; 
    border-collapse:collapse;
}
.route  tr.rowhead td {  
    border-bottom: none; 
    font-weight: bold;
    background-color: #F0F0FF; color: #303030;
}

.route  tr.row_ab td {   }
.route  tr.row_ba  {   }
.route tr td.intent  {
    width: 100px;   
    background-color: #F0F0FF;
    border-top: none; 
    font-size: 85%;
}



/*
 * journey table
 */
table td.black    {  background-color: #606060; color: #FFFFFF   }
table td.red      {  background-color: #FFa0a0;   }
table td.orange   {  background-color: #FFdFa0;   }
table td.green    {  background-color: #a0FFa0;   }
table td.grey     {  color: #606060; font-style: italic;  }



/*
 * filter form
 */
 
span.filter {
    display: block;
    border: 1px solid #a0a0a0;
    background-color: #dddddd;
    padding: 10px;
    margin: 5px;  margin-left: 10px;
    width: 80%;
}

span.filter table td {
   vertical-align: top; 
  /* text-align: right; */
   padding-top:    0px;
   padding-bottom: 0px;
   padding-left:  15px;
}

span.filter table tr.row1 {
    font-size: 80%;
}


/*
 * info
 */
span.autoupdate {
   display: inline-block; 
   border: 1px dashed #808080;
   padding-left: 5px;  padding-right: 5px;
   padding-top: 1px;  padding-bottom: 1px;
   margin: 5px;
   border-radius: 4px;
   font-size: 85%;
}
span.autoupdate.red     {  background-color: #FFa0a0;   }
span.autoupdate.green   {  background-color: #a0FFa0;   }
span.autoupdate.orange  {  background-color: #FFdFa0;   }
span.autoupdate.grey    {  color: #606060; font-style: italic;  }

span.autoupdate.error  {  color: #FF0000;  }



/*
 *  tags
 */
.tag  {
   display: inline-block;
   padding-left: 5px;  padding-right: 5px;
   text-align: center;
   border-radius: 4px; border: 0px solid #808080;
   color: #202020;  background-color: #F0F0F0;
}
.tag.deleted   {   background-color: #FFFFFF;   }
.tag.inactive  {   background-color: #8080FF;   }
.tag.active,
.tag.segment   {   background-color: #FF8080;   }
.tag.multi     {   background-color: #FFC080;   }
.tag.monitored {   background-color: #FF80FF;   }

.tag.yes     {   color: #E0E0E0;  background-color: #008000;   }
.tag.no      {   color: #404040;  font-style: italic;   }



.tag.overwrite,
.tag.overwrite select  {   color: #FF6000;  background-color: #303030;  font-size: 120%;    }

.tag.red    {   background-color: #FFA0A0;   }
.tag.green  {   background-color: #A0FFA0;   }
.tag.blue   {   background-color: #80A0FF;   }
.tag.orange {   background-color: #FFD0A0;   }
.tag.pink   {   background-color: #FFA0FF;   }
.tag.black  {   background-color: #303030; color: white;   }