/**
 * Only for Additional Styles
 *
 * Language Selection
 * Search
 * Extra Informations/Product Requestable
 */

 .required{
     color:#d04;
 }
.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 15px;
}
.btn-circle.btn-lg {
  width: 50px;
  height: 50px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.33;
  border-radius: 25px;
}
.btn-circle.btn-xl {
  width: 70px;
  height: 70px;
  padding: 10px 16px;
  font-size: 24px;
  line-height: 1.33;
  border-radius: 35px;
}

/*Statusbar*/
#status-navbar .navbar-nav>li, .navbar-nav {
    float: left;
    margin-top: 0px;
    margin-right: 0px;
}
#status-navbar>.navbar-nav>li:first-child {
    margin-top: 0;
}
#statusbar-iconbar.navbar-nav.navbar-right:last-child {
  margin-right: -15px !important;
}
#statusbar-iconbar {
  float: right!important;
  list-style: none;
  padding-left: 0;
}
#statusbar-iconbar .navbar-nav > li {
  list-style: none;
}
#statusbar .navbar-nav {
    margin: 0;
}
#statusbar{
    background-color:#1A1A1A;
    max-height: 50px;
    min-height: 40px;
    overflow: visible;
    position: relative;
    z-index: 1000;
    padding-inline: 2rem;
}
#statusbar .container-fluid,
#statusbar #status-navbar {
    max-height: 50px;
    min-height: 40px;
    margin-inline: 1rem;
}
#statusbar .navbar-header,
#statusbar .navbar-brand,
#statusbar .navbar-nav {
    align-items: center;
    flex-direction: row;
}
#statusbar .navbar-brand img{
    height: 22px;
}
/* Prevent any statusbar dropdown from stretching the viewport (class works even if Bootstrap moves menu in DOM) */
.statusbar-dropdown-menu {
    min-width: 0;
    max-width: min(calc(100vw - 2rem), 400px) !important;
    overflow-x: auto;
    box-sizing: border-box;
}
#statusbar-iconbar.navbar-nav>li>a{
    padding: 8px 5px;
    color: #fff;
}
.navbar-login
{
    width: 305px;
    padding: 10px;
    padding-bottom: 0px;
}

 .navbar-login-session
 {
     padding: 10px;
     padding-bottom: 0px;
     padding-top: 0px;
 }

 .icon-size
 {
     font-size: 87px;
 }
 /* mmenu-js: hide menu when closed so it does not stay visible with insertSelector */
.mm-wrapper:not(.mm-wrapper--opened) .mm-menu {
    visibility: hidden;
    pointer-events: none;
}
.mm-wrapper.mm-wrapper--opened .mm-menu {
    visibility: visible;
    pointer-events: auto;
}

/* Hide original #optionMenu in statusbar; only the mmenu clone is used (off-canvas) */
#statusbar #optionMenu {
    display: none !important;
}

/* Option menu off-canvas: ensure it sits above page and statusbar */
#optionMenu-mmenu-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    pointer-events: none;
}
#optionMenu-mmenu-wrapper.mm-wrapper--opened .mm-menu {
    pointer-events: auto;
}

/* Fix Administration at the bottom of the option menu */
#optionMenu-mmenu-wrapper .mm-panel {
    padding-bottom: 60px !important;
}
#optionMenu-mmenu-wrapper .menu-administration {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: #eee !important;
    border-top: 1px solid rgba(0,0,0,0.1) !important;
    z-index: 10 !important;
    margin-top: 0 !important;
}

/* Main nav off-canvas: same stacking as option menu */
#dse-menu-mmenu-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    pointer-events: none;
}
#dse-menu-mmenu-wrapper.mm-wrapper--opened .mm-menu {
    pointer-events: auto;
}

/* Main menu: slide page when open (slideout is in body, not in dse wrapper) */
body.mm-dse-menu-opened .mm-slideout {
    --mm-translate-horizontal: clamp(
        calc(-1 * var(--mm-max-size)),
        calc(-1 * var(--mm-size)),
        calc(-1 * var(--mm-min-size))
    );
    -webkit-transform: translate3d(var(--mm-translate-horizontal), 0, 0);
    transform: translate3d(var(--mm-translate-horizontal), 0, 0);
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-property: -webkit-transform;
    transition-property: transform;
}

/* Option menu: slide page when open (slideout is in body, not in option wrapper) */
body.mm-option-menu-opened .mm-slideout {
    --mm-translate-horizontal: clamp(
        calc(-1 * var(--mm-max-size)),
        calc(-1 * var(--mm-size)),
        calc(-1 * var(--mm-min-size))
    );
    -webkit-transform: translate3d(var(--mm-translate-horizontal), 0, 0);
    transform: translate3d(var(--mm-translate-horizontal), 0, 0);
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-property: -webkit-transform;
    transition-property: transform;
}

.badge-notify{
     z-index:99;
    background: #d00;
    position: absolute;
    top: 5px;
    right: -5px;
}
 /**/
 /*Fullscreen search*/
 #search {
     position: fixed;
     top: 0px;
     left: 0px;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.7);

     -webkit-transition: all 0.5s ease-in-out;
 	-moz-transition: all 0.5s ease-in-out;
 	-o-transition: all 0.5s ease-in-out;
 	-ms-transition: all 0.5s ease-in-out;
 	transition: all 0.5s ease-in-out;

     -webkit-transform: translate(0px, -100%) scale(0, 0);
 	-moz-transform: translate(0px, -100%) scale(0, 0);
 	-o-transform: translate(0px, -100%) scale(0, 0);
 	-ms-transform: translate(0px, -100%) scale(0, 0);
 	transform: translate(0px, -100%) scale(0, 0);
    z-index: 9999;
     opacity: 0;
 }

 #search.open {
     -webkit-transform: translate(0px, 0px) scale(1, 1);
     -moz-transform: translate(0px, 0px) scale(1, 1);
 	-o-transform: translate(0px, 0px) scale(1, 1);
 	-ms-transform: translate(0px, 0px) scale(1, 1);
 	transform: translate(0px, 0px) scale(1, 1);
     opacity: 1;
     z-index: 9999;
 }

 #search input[type="search"] {
     position: absolute;
     top: 20%;
     width: 100%;
     color: rgb(255, 255, 255);
     background: rgba(0, 0, 0, 0);
     font-size: 60px;
     font-weight: 300;
     text-align: center;
     border: 0px;
     margin: 0px auto;
     margin-top: -51px;
     padding-left: 30px;
     padding-right: 30px;
     outline: none;
     z-index: 9999;
 }
 #search .btn {
     position: absolute;
     top: 20%;
     left: 50%;
     margin-top: 61px;
     margin-left: -45px;
     z-index: 9999;
 }
 #search .close {
     position: fixed;
     top: 15px;
     right: 15px;
     color: #fff;
 	background-color: #428bca;
 	border-color: #357ebd;
 	opacity: 1;
 	padding: 10px 17px;
 	font-size: 27px;
    z-index: 9999;
 }
 div#results{
     position: absolute;
     width: 100%;
     top:30%;
 }
 /**/
 /*Cards*/
 .card {
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
 }

 .card {
   margin-top: 10px;
   box-sizing: border-box;
   border-radius: 2px;
   background-clip: padding-box;
   background-color:#fff;
 }
 .card span.card-title {
     color: #333;
     font-size: 24px;
     font-weight: 300;
     text-transform: uppercase;
 }

 .card .card-image {
   position: relative;
   overflow: hidden;
 }
 .card .card-image img {
   border-radius: 2px 2px 0 0;
   background-clip: padding-box;
   position: relative;
   z-index: -1;
   height: 150px;
 }
 .card .card-image span.card-title {
   position: relative;
   float:left;
   bottom: 0;
   left: 0;
   padding: 16px;
 }
 .card .card-content {
   padding: 16px;
   border-radius: 0 0 2px 2px;
   background-clip: padding-box;
   box-sizing: border-box;
 }
 .card .card-content p {
   margin: 0;
   color: inherit;
 }
 .card .card-content span.card-title {
   line-height: 48px;
 }
 .card .card-action {
   border-top: 1px solid rgba(160, 160, 160, 0.2);
   padding: 16px;
   background-color: #fff;
 }
 .card .card-action a {
   color: #ffab40;
   margin-right: 16px;
   transition: color 0.3s ease;
   text-transform: uppercase;
 }
 .card .card-action a:hover {
   color: #ffd8a6;
   text-decoration: none;
 }
 /**/
.no-margin{
    margin:0px !important;
}
 /* Language */
.sprachwechsel {
	float: left;
}

#public_language_selection {
	width: 200px;
}

#public_language_selection li {
	float: left;
	padding: 0 1%;
}


/*Benachrichtigungen */
#messages_last {
  display:none;
}

/* Search */
/*#search {
	display: none;
}
*/
/************************************************************** Ab 768 Pixel *********************************************************/
@media screen and (min-width: 768px) {
.sprachwechsel {
	margin: 2% 0;
}

/* Search */
/*#search {
	display: block;
}
*/
#schnellsuche {
	float: right;
	margin-right: 0%;
}

#schnellsuche input.such_textinput_short {
	width: 80%;
	float: left;
}
}