/*
 * ------------------------------------------------------------------
 *  
 * Fonts.
 *  
 */
@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 100;
  src: url(resources/fonts/Roboto-Thin.ttf);
}
@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 300;
  src: url(resources/fonts/Roboto-Light.ttf);
}
@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 400;
  src: url(resources/fonts/Roboto-Regular.ttf);
}
@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 700;
  src: url(resources/fonts/Roboto-Bold.ttf);
}

html,
body {
  min-width: 100%;
}

body {
  font-family: Roboto, sans-serif;
}

/*
 * ------------------------------------------------------------------
 *  
 * Publication titles
 *  
 */
.wh_publication_title > a {
  color: #1c1c59;
}

/*
 * ------------------------------------------------------------------
 *  
 * Tiles - legt Aussehen der Tiles fest
 *  
 */

.wh_content_area {
  margin-top: 80px;
}

.wh_tile {
  background-color: #ffffff;
  border-color: #e6e9f1; /* "10% GK Blue", um die Kachel ein wenig vom weißen Hintergrund abzuheben. */
  border-style: solid;
  border-width: 1px;
  border-radius: 15px;
  padding-top: 7em;
  box-shadow: 0px 5px 5px 0px rgba(150, 150, 150, 0.75);
  -webkit-box-shadow: 0px 5px 5px 0px rgba(150, 150, 150, 0.75);
  -moz-box-shadow: 0px 5px 5px 0px rgba(150, 150, 150, 0.75);
}

/* legt Größe, Farbe und Ausrichtung des Tile-Titels fest */
.wh_tile_title {
  color: #1c1c59 !important;
  text-align: left;
  font-size: 1.5em;
  font-weight: 450;
}
.wh_tile_title a {
  color: #1c1c59;
}

.wh_tile_title a:visited {
  color: #1c1c59;
}

/* Legt Ausrichtung, Farbe und Größe der Shortdescription auf den Tiles fest, wenn es eine gibt */
.wh_tile_shortdesc {
  margin-top: 1em;
  margin-bottom: 0.5em;
  text-align: left;
  color: #1c1c59;
}

/*
 * ------------------------------------------------------------------
 *  
 * Suchfeld und Hintergrundbild
 *  
 */

/* Legt den Hintergrund des Suchfelds auf der Startseite fest */
.wh_main_page .wh_search_input {
  background: url('resources/images/sap_hero.svg') #0057d2ff;
  background-repeat: no-repeat;
  background-position: right bottom;
  margin-top: -50px;
}
/* legt das Aussehen des Suchfelds auf der Startseite fest */
.wh_search_textfield {
  margin-top: 100px;
  border: solid 1px #ccc;
  border-radius: 23px;
  padding: 0.5em;
  position: relative;
  height: 2.8em;
}
/* legt das Aussehen des Suchbuttons auf der Startseite fest */
.wh_search_button {
  margin-top: 100px;
  border: solid 1px #ccc;
  border-radius: 23px;
  padding: 0.6em 1em;
  color: #fff;
  background-color: #0057d2ff;
  height: 2.8em;
}
/* Legt den Hintergrund des Suchfelds auf den Topicseiten fest */
.wh_search_input {
  display: block;
  margin: 0;
  position: relative;
  background: url('resources/images/sap_hero.svg') #0057d2ff;
  background-repeat: no-repeat;
  background-position: right bottom;
  padding-top: 0px;
  padding-bottom: 50px;
  margin-bottom: -30px;
  margin-top: -50px;
}
/* Ändert Position oder Aussehen der Suchergebnis-Seite */
.wh_search_results {
  margin-top: 40px;
  padding-left: 200px;
  padding-right: 200px;
}

/* Mit .wh_search_results_items könnte man z.B. die Formatierung der Suchergebnisse ändern*/

/*
 * ------------------------------------------------------------------
 *  
 * Header - legt Aussehen des Headers fest
 *  
 */

/* legt die Hintergrundfarbe für die obere Menüleiste fest */
.wh_header {
  background-color: #ffffff;
}

/* legt die Schriftfarbe für die obere Menüleiste fest */
.wh_top_menu > ul > li a,
.wh_indexterms_link a::before {
  color: #1c1c59;
}

.wh_indexterms_link a span {
  display: none;
}

/* legt die Hintergrundfarbe für das Hovern über die obere Menüleiste fest */
.wh_top_menu ul li:hover {
  background-color: #00000029;
}
.wh_top_menu ul ul {
  background-color: #00000029;
}
.wh_top_menu ul ul li {
  border-top-color: #00000029;
}
.wh_top_menu ul ul li a:hover {
  background: #00000029;
}
#wh_menu_mobile_button {
  background-color: #00000029;
}