/*
    Document   : stapfer.main
    Created on : 06.12.2011, 18:30:03
    Author     : thomas
    Description:
        Styles, die die Grundstruktur der Webapplikation betreffen (Navigation,
        Banner, Strukturen, kein Inhaltsbereich).
------------------------------------------------------------------------------*/


/*--- BASE STRUCTURE PROPERTIES ---*/

body {
  background-color: rgb(227, 209, 165);
  margin-top: 0;
  height: 100%;
}

#container,
#content,
#main,
#transkription-view-header {
  height: 100%;
}

#main_content #container {
  min-height: 500px;
}

div.error-container {
  padding-left: 240px;
}

table {
  width: 1000px;
  margin: auto;
  background-color: #FFF;
  font-family: Helvetica Regular, Helvetica, Arial, sans-serif;
}

table th {
  text-align: left;
  vertical-align: top;
}

tr.odd {
  background: #eddfba;
}

td#logo {
  width: 240px;
}

td#contextual-header {
  width: 720px;
}

#block-menu_block-3 {
  width: 720px;
}

#logo {
  padding-top: 30px;
  padding-right: 0px;
  padding-bottom: 0px;
}


/* Define the shadow around the whole page. */

.shadow_left {
  width: 20px;
  background: url(../../img/shadow_left.jpg) repeat-y;
}

.shadow_right {
  width: 20px;
  background: url(../../img/shadow_right.jpg) repeat-y;
}

.shadow_cornerbotleft {
  background: url(../../img/shadow_cornerbotleft.jpg) no-repeat;
}

.shadow_cornerbotright {
  background: url(../../img/shadow_cornerbotright.jpg) no-repeat;
}

.shadow_bottom {
  height: 20px;
  background: url(../../img/shadow_bottom.jpg) repeat-x;
}


/* --- POPUP JS DIALOGS --- */

div.ui-dialog,
div.ui-widget,
div.ui-widget-content,
div.ui-corner-all,
div.ui-draggable,
div.ui-resizable {
  z-index: 99999 ! important;
}

.ui-widget-content {
  font-size: 12px ! important
}

.pop-info {
  min-height: 30px ! important;
}

.loader-popup {
  display: none;
  z-index: 99999;
  background: none repeat scroll 0px 0px white;
  border: 1px solid rgb(158, 124, 58);
  padding: 3px 5px;
}

.map {
  height: 450px;
  width: 100%;
}

.mapKlein {
  height: 300px;
  width: 720px;
  border: 1px solid grey;
  padding: 0 0 0 0;
}


/* --- CONTEXTUAL HEADER ---*/


/* Defining the contextual header area, which is actually just the active item of a redundant main menu. */

#contextual-header {
  padding-top: 30px;
  padding-left: 0px;
  padding-bottom: 0;
}


/* At first make menu items invisible. */

#contextual-header ul.menu li,
#contextual-header ul.menu li a {
  display: none;
}

#contextual-header ul.menu li.leaf {
  padding: 0;
}

#contextual-header .block ul {
  padding: 0;
}


/* Let the active menu item reappear. Set a default banner.(TODO!!) */

#contextual-header ul.menu {
  display: block;
  margin: 0 auto;
  width: 720px;
  height: 175px;
  background-image: url(../../img/banner_projekt.jpg);
  background-repeat: no-repeat;
}

#contextual-header ul.menu li.active-trail {
  display: block;
  margin: 0 auto;
  width: 720px;
  height: 175px;
  background-image: url(../../img/banner_projekt.jpg);
  background-repeat: no-repeat;
}


/*Frontpage (Only local) */

#contextual-header ul.menu_frontpage {
  display: block;
  margin: 0 auto;
  width: 900px;
  height: 218px;
  background-image: url(../../img/900banner_projekt.jpg);
  background-repeat: no-repeat;
}

#contextual-header ul.menu_frontpage li a {
  display: none;
}

#contextual-header ul.menu_frontpage li.active-trail {
  display: block;
  margin: 0 auto;
  width: 900px;
  height: 218px;
  background-image: url(../../img/900banner_projekt.jpg);
  background-repeat: no-repeat;
}


/* set for each main category a different background image. */

#contextual-header ul.menu li.menu-mlid-148 {
  background-image: url(../../img/banner_projekt.jpg);
  background-repeat: no-repeat;
}

#contextual-header ul.menu li.menu-mlid-149 {
  background-image: url(../../img/banner_histhintergrund.jpg);
  background-repeat: no-repeat;
}

#contextual-header ul.menu li.menu-mlid-150 {
  background-image: url(../../img/banner_expertensuche.jpg);
  background-repeat: no-repeat;
}

#contextual-header ul.menu li.menu-mlid-151 {
  background-image: url(../../img/banner_expertensuche.jpg);
  background-repeat: no-repeat;
}

#contextual-header ul.menu li.menu-mlid-152 {
  background-image: url(../../img/banner_links.jpg);
  background-repeat: no-repeat;
}


/* --- MAIN NAVIGATION --- */

.block-nice-menus {
  line-height: normal;
  z-index: 10;
  word-wrap: break-word;
}

ul.nice-menu::after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden;
}

#nice-menu-1 {
  width: 735px;
}

ul.nice-menu-down {
  border: 0 none;
  float: left;
}

ul.nice-menu,
ul.nice-menu ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}

ul.nice-menu,
ul.nice-menu ul {
  position: relative;
  z-index: 5;
}

#nice-menu-1 li.menu-355 {
  text-align: left;
  width: 141px;
}

#nice-menu-1 li {
  background-color: transparent;
  border: medium none;
  font-size: 14px;
  height: 25px;
  text-align: center;
  text-transform: uppercase;
  float: left;
}

ul.nice-menu li {
  background-image: none;
  margin: 0;
  padding-left: 0;
}

ul.nice-menu li {
  position: relative;
}

#nice-menu-1 li a {
  padding: 0;
  padding-top: 4px;
  text-decoration: none;
}

ul.nice-menu a {
  color: #027ac6;
  display: block;
}

#nice-menu-1 li.menu-355 {
  text-align: left;
}

#nice-menu-1 li {
  font-size: 14px;
  text-align: center;
  text-transform: uppercase;
}

#nice-menu-1 li.menu-356 {
  width: 171px;
}

#nice-menu-1 li.menu-372 {
  width: 176px;
}

#nice-menu-1 li a:hover,
#nice-menu-1 li a.active {
  color: rgb(0, 98, 159);
}

#nice-menu-1 li.menu-373 {
  width: 152px;
}

#nice-menu-1 li.menu-374 {
  text-align: right;
  width: 80px;
}


/*--- SPACE BETWEEN PAGEHEADER AND PAGEBODY ---*/

td.lineholder {
  border-top: solid rgb(158, 124, 58) 2px;
}

#spaceholder {
  height: 15px;
}


/* --- SECTION NAVIGATION --- */

#section-navigation {
  vertical-align: top;
}

#section-navigation h2 {
  margin: 0 auto 0.7em;
  padding: 0;
  font-size: 14px;
  text-transform: uppercase;
}

#section-navigation h2 a {
  text-decoration: none;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: bold;
  color: rgb(0, 98, 159);
  margin: 0;
}

#section-navigation ul.menu li {
  margin: 0;
  margin-bottom: 0.6em;
  font-size: 13px;
}

#section-navigation ul.menu li a {
  text-decoration: none;
  color: rgb(0, 98, 159);
}

#section-navigation ul.menu li.leaf a:hover {
  color: rgb(63, 136, 186);
}


/* --- SIDEBAR-LEFT --- */

.sidebar-left {
  vertical-align: text-top;
}

.sidebar-left #sidebar-left-navigation {
  padding-bottom: 15px;
  padding-right: 0.8em;
  padding-left: 0.8em;
  /*    border-bottom: solid rgb(158,124,58) 1px;*/
}

.sidebar-left #sidebar-left-transkription,
.sidebar-left #sidebar-left-metadaten {
  padding-top: 10px;
  padding-right: 0.8em;
  padding-left: 0.8em;
  padding-bottom: 15px;
  border-top: solid rgb(158, 124, 58) 1px;
}

.sidebar-left #sidebar-left-erlaeuterungen ul {
  list-style: none;
  padding: 0;
  margin-bottom: 0;
}

.sidebar-left #sidebar-left-erlaeuterungen {
  padding-top: 10px;
  padding-right: 0.8em;
  padding-left: 0.8em;
  padding-bottom: 15px;
  border-top: solid rgb(158, 124, 58) 1px;
}

.sidebar-left #erlaeuterungen-begriffe {
  /*margin-top: 0.4em;*/
}

.sidebar-left #erlaeuterungen-begriffe form {
  margin-left: 1em;
  margin-top: 0.4em;
}

.sidebar-left #erlaeuterungen-begriffe .input input {
  color: #3F88BA;
  float: left;
  width: 65%;
}

.sidebar-left #erlaeuterungen-begriffe .submit {
  padding-left: 3px;
}

.sidebar-left #erlaeuterungen-begriffe .submit input {
  background: #fff;
  border: #000 solid 1px;
  height: 23px;
  padding-bottom: 3px;
  color: #3F88BA;
  margin-left: 3px;
  width: 30%;
}

.sidebar-left #sidebar-left-user {
  padding-top: 10px;
  padding-right: 0.8em;
  padding-left: 0.8em;
  border-top: solid rgb(158, 124, 58) 1px;
}

.sidebar-left #sidebar-left-metadaten ul {
  margin-bottom: 5px;
  margin-top: 0 !important;
}

.sidebar-left h2 {
  margin: 0 auto 0.7em;
  padding: 0;
  font-size: 14px;
  text-transform: uppercase;
}

.sidebar-left a {
  color: inherit;
  text-decoration: none;
  font-size: 13px;
}

.sidebar-left div {
  color: rgb(0, 98, 159);
  font-size: 14px;
}

.sidebar-left .input input,
.sidebar-left .submit input {
  font-size: 13px;
}

.sidebar-left div.browse-menu {
  margin-bottom: 10px;
}

.sidebar-left div.browse-menu a {
  padding: 0;
}

.sidebar-left div.browse-menu ul.menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sidebar-left div.browse-menu ul.menu li {
  margin-bottom: 0.4em ! important;
}

.sidebar-left div.browse-menu .menu a.active {
  font-weight: bold ! important;
}

.sidebar-left div.browse-menu input {
  margin-left: 0;
}

.sidebar-left div.browse-menu .pop-info-icon {
  margin-left: 4px;
}

.sidebar-left div.browse-results {
  padding-top: 5px;
  clear: both;
}

.sidebar-left div.chooser-container {
  /*margin-top: 5px;*/
  padding-left: 16px;
}

.sidebar-left div.chooser-container select {
  width: 100%;
}

.sidebar-left #submenu-search form {
  margin-left: 1em;
}

.sidebar-left #submenu-search .input input {
  color: #3F88BA;
  float: left;
  width: 65%;
}

.sidebar-left #submenu-search .submit {
  padding-left: 3px;
}

.sidebar-left #submenu-search .submit input,
.sidebar-left #sidebar-left-transkription .submit input {
  background: #fff;
  border: #000 solid 1px;
  height: 23px;
  padding-bottom: 3px;
  color: #3F88BA;
  margin-left: 3px;
  width: 30%;
}

.sidebar-left #sidebar-left-transkription .submit input {
  width: auto;
}

.sidebar-left #transkription-view-links a,
.sidebar-left #transkription-view-links a:visited {
  display: block;
  text-decoration: none;
  color: rgb(0, 98, 159);
}

.sidebar-left #transkription-view-links ul,
.sidebar-left #metadaten-schule-links ul,
.sidebar-left #metadaten-ort-links ul,
.sidebar-left #metadaten-lehrer-links ul {
  margin-top: 0.4em;
  margin-left: 2em;
  padding: 0;
  list-style: disc;
}

.sidebar-left #sidebar-left-user ul {
  padding-left: 0;
  list-style: none;
}


/* Citation Footer */

.zitation {
  float: left;
  max-height: 200px;
  background-color: #ededed;
  padding: 5px;
  margin-top: 20px;
}

.empfehlung {
  background-color: #ededed;
}

.dynlink {
  background-color: #ededed;
  padding: 5px;
  margin-top: 5px;
}


/* FOOTERMENU */

#footer {
  background-color: rgb(227, 209, 165);
  font-size: 10px;
}

#footer ul.menu {
  text-align: center;
  float: none;
  margin-top: 5px;
}

#footer li.leaf {
  display: inline;
  border-right: rgb(0, 98, 159) 1px solid;
  padding-right: 0.5em;
  padding-left: 0.5em;
  padding-top: 0;
}

#footer li.last {
  border-right: none;
}

#footer a {
  text-decoration: none;
  color: rgb(0, 98, 159);
}
.flash-error{
  background-color: red;
  color: white;
  padding: 10px;
  border-radius: 5px;
  margin: 10px 0;
}