/* 
 * custom styles for apotheke von hirschhausen
 * (c) 2014 jens heidrich info at tulix dot de
 * 
 */

/*
 * global styles 
 */

@font-face {
   font-family: 'bauhaus regular';
   src: url(/static/fonts/bauhaus-medium.otf);
}

@font-face {
   font-family: 'bauhaus demi';
   src: url(/static/fonts/bauhaus-demi.otf);
}

body {
    font-size: 14px;
    font-family: sans-serif;
}

.maxwidth {
    width: 100%;
    max-width: 100%;
}

.page {
    padding: 0;
}

.row {
    margin-left: -5px;
    margin-right: -5px;
}

.col-header-bg {
    background-color: #eaeaea;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 10px;
    padding-left: 0;
}

.col-xs-1,.col-sm-1,.col-md-1,.col-lg-1,.col-xs-2,.col-sm-2,.col-md-2,.col-lg-2,.col-xs-3,.col-sm-3,.col-md-3,.col-lg-3,.col-xs-4,.col-sm-4,.col-md-4,.col-lg-4,.col-xs-5,.col-sm-5,.col-md-5,.col-lg-5,.col-xs-6,.col-sm-6,.col-md-6,.col-lg-6,.col-xs-7,.col-sm-7,.col-md-7,.col-lg-7,.col-xs-8,.col-sm-8,.col-md-8,.col-lg-8,.col-xs-9,.col-sm-9,.col-md-9,.col-lg-9,.col-xs-10,.col-sm-10,.col-md-10,.col-lg-10,.col-xs-11,.col-sm-11,.col-md-11,.col-lg-11,.col-xs-12,.col-sm-12,.col-md-12,.col-lg-12 {
    padding-right: 5px;
    padding-left: 5px
}

.center {
    text-align: center;
}

.fill {
    min-height: 100%;
}

a {
    color: #b40001;
}

a:hover, a:focus {
    color: #b40001;
}

.marker {
    background-color: #ffe700;
}

.navbar {
    margin-bottom: 10px;
    border-width: 0;
    border-radius: 0;
}

.navbar-brand,
.nav {
    font-family: 'bauhaus regular';
    font-weight: normal;
}

.nav > li > a {
    padding: 5px 10px;
}

.nav > li > a:hover,
.nav > li > a.focus {
    color: #b40001;
    background-color: #ffffff;
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
    color: #ffffff;
    background-color: #b40001;
}

footer div.outer {
    margin: 0;
    background-color: #eaeaea;
}

div.bg {
    margin: 0 -5px;
    /*
    padding-right: 5px;
    padding-left: 5px;
    */
}

.navbar {
    min-height: 34px;
}

.navbar-default {
    background: #aa0000 url(/static/img/nav-bg.gif) repeat-x top left;
}

iframe {
    width: 100%;
    height: 100vh;
}

.iframe-invisible {
    border: 0;
}

/*
.navbar-page {
    background: #aa0000 url(/static/img/nav-bg.gif) repeat-x top left;
}
*/
/*.navbar {
    height: 34px;
}*/

.navbar-default .navbar-brand {
    font-size: 16px;
    font-weight: bold;
    color: #ffffff;
    padding-top: 10px;
    padding-right: 5px;
    padding-bottom: 4px;
    padding-left: 15px;
}

/*
.navbar-page .navbar-brand {
    font-size: 16px;
    font-weight: bold;
    color: #ffffff;
    padding-top: 10px;
    padding-bottom: 4px;
}
*/

.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:hover {
    color: #eaeaea;
}

.navbar-toggle {
    margin-top: 4px;
    margin-bottom: 4px;
    padding: 5px 6px;
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background: rgba(0, 0, 0, 0.33);
    color: #eaeaea;
}

form.navbar-form {
    margin-top: 4px;
    margin-bottom: 4px;
}

/*
.navbar-page form.navbar-form {
    margin-top: 4px;
    margin-bottom: 4px;
}
*/

form.navbar-form > div > input {
    padding: 2px 6px;
    height: 26px;
}

form.navbar-form > button {
    padding: 2px 6px;
    height: 26px;
}

.navbar-nav > li > a {
    font-size: 16px;
    font-weight: bold;
    padding-top: 10px;
    padding-right: 11px;
    padding-bottom: 4px;
    padding-left: 11px;
}

/*
.navbar-page .navbar-nav > li > a {
    padding-top: 10px;
    padding-bottom: 4px;
}
*/

.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a {
    color: #ffffff;
}

.navbar-default .navbar-nav > li.active > a,
.navbar-default .navbar-nav > li > a:hover {
    background: rgba(0, 0, 0, 0.33);
    color: #eaeaea;
}

.navbar-default .navbar-nav > .open > a, 
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    background: rgba(0, 0, 0, 0.33);
    color: #eaeaea;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.33);
}

.navbar .divider-vertical {
    margin: 0 0 0 0;
    padding-top: 10px;
    padding-bottom: 4px;
    color: #ffffff;
    font-size: 16px;
    font-weight: bold;
    line-height: 20px;
    border: none;
}

/*
.navbar-page .divider-vertical {
    padding-top: 8px;
    padding-bottom: 6px;
}
*/

.navbar .divider-vertical:before {
    content: "|";
}

.navbar-nav > li > a.menuicon-social {
    padding-left: 3px;
    padding-right: 3px;
    display: inline-block;
}

/*
.navbar-page .navbar-nav > li > a.menuicon-facebook {
    padding: 1px 0;
}
*/

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    color: #b40001;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #b40001;
}

div.column-footer {
    background-color: #eaeaea;
    padding-top: 10px;
    padding-bottom: 10px;
}

div.column-footer img {
    display: block;
    margin: auto;
}

div.column-footer address {
    margin-bottom: 0;
    padding-top: 10px;
}

ul.errorlist {
    color: red;
    padding-left: 0;
    list-style-type: none;
}

ul.errorlist ~ input,
ul.errorlist ~ select,
ul.errorlist ~ textarea {
    border: 1px solid red;
}

/* 
 * structural elements 
 */

header {
    margin-bottom: 0;
    padding-right: 5px;
    padding-left: 5px;
}

.header-column-right {
    padding-right: 0;
}

.header-column-left {
    padding-left: 2px;
}

article {
    margin-bottom: 10px;
    padding: 0 5px;
}

div.main {
    display: table;
    table-layout: fixed;
    width: calc(100% + 20px);
    padding: 0;
    margin-left: -10px;
    border-spacing: 10px;
}

div.main > div.mainrow {
    display: table-row;
}

div.main > div.mainrow > div {
    display: table-cell;
    vertical-align: top;
    float: none;
}

footer p {
    font-family: 'bauhaus regular', sans-serif;
    margin: 10px 10px;
}

/*
 * startpage 
 */

.carousel-indicators {
    bottom: -10px;
    margin-left: 0;
    left: 0;
    width: 100%;
    padding-top: 25px;
    background-color: rgba(0, 0, 0, 0.3);
/*    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0px, rgba(0, 0, 0, 0.15) 50%, rgba(0, 0, 0, 0.3) 100%);*/
}

.carousel-caption {
    padding-bottom: 0;
    z-index: 16;
}

.carousel-control {
    opacity: 0.75;
}

.carousel-control:hover,
.carousel-control:focus {
    opacity: 1;
}

span.slide-control {
    position: absolute;
    top: 50%;
    margin-top: -10px;
}

.column-startpage {
    min-height: 388px;
    padding: 0;
    color: #333333;
    background-color: #fafafa;
    border: 10px solid #eaeaea;
}

.column-startpage-inner {
    min-height: 368px;
    background-color: #fafafa;
    border-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
}

.column-startpage-inner h1 {
    font-size: 16px;
    margin: 10px;
}

.column-startpage-inner p {
    font-size: 13px;
    margin: 10px;
}

.column-startpage-inner img {
    width: 100%;
    max-width: 100%;
    height: auto;
    border: 1px solid #b40001;
}

/*
 * page-menu
 */

div.column-page-menu {
    font-size: 16px;
}

div.pagenav {
    z-index: 0;
    background-color: #eaeaea;
    padding: 20px 15px;
}

div.pagenav a {
    color: #333333;
}

div.pagenav a.collapse-toggle {
    color: #ffffff;
}

div.column-page-root {
    z-index: -1;
    position: absolute;
    right: 0;
    bottom: 0;
    font-family: 'bauhaus regular';
    font-size: 4ex;
    background-color: #eaeaea;
    color: #c2c2c2;
    text-align: right;
    text-transform: uppercase;
    padding-right: 15px;
}

ul.nav.nav-pills.nav-stacked.in,
ul.nav.nav-pills.nav-stacked.collapse,
ul.nav.nav-pills.nav-stacked.in.collapse {
    margin-top: 2px;
    margin-left: 15px;
}

.collapse-toggle,
.collapse-toggle.collapsed {
    color: #ffffff;
    background-color: #b40001;
}

.nav > li.sub > a:hover .caret,
.collapse-toggle .caret {
    border-bottom-color: #ffffff;
    border-top-color: #ffffff;
}

.nav > li.sub > a:hover,
.nav > li.sub > a:focus {
    color: #ffffff;
    background-color: #b40001;
}

.nav > li.sub > ul > li.sub a:hover,
.nav > li.sub > ul > li.sub a:focus,
.nav > li.sub > ul > li.sub.active > a,
.nav > li.sub > ul > li.sub.active > a:hover,
.nav > li.sub > ul > li.sub.active > a:focus {
    color: #ffffff;
    background-color: rgba(180,0,1,0.66)
}

/* 
 * page-content
 */

.column-page-content {
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 0;
    padding-left: 20px;
}

.column-page-content h1 {
    font-size: 200%;
}

.column-page-content h2 {
    font-size: 160%;
}

.column-page-content h3 {
    font-size: 130%;
}

div.mabox {
    display: inline-block;
    vertical-align: top;
/*    background-color: #aaaaaa; */
    min-width: 250px; /* maimage + margin + X (wegen Text) */
    max-width: 30%; 
}

div.textbox {
    float: left;
    display: inline-block;
    background-color: #aaffff;
    padding: 20px;
}
 
/* 
 * contact-form
 */
 
table.table.contact th,
table.table.contact td {
    border: 0;
}

table.table.contact th {
    text-align: right;
}

/* 
 * gallery
 */

.gallery > a:hover {
    text-decoration: none;
}

.gallery > a > img {
    border: 1px solid #cdcdcd;
/*    width: 122px;
    height: 122px;*/
    opacity:1;
    filter:alpha(opacity=100);
    -webkit-transition:opacity 700ms ease-out;
    -moz-transition:opacity 700ms ease-out;
    -o-transition:opacity 700ms ease-out;
    transition:opacity 700ms ease-out;
}

.gallery > a > img:hover {
    position: relative;
    left: -1px;
    top: -1px;
    border: 1px solid #cdcdcd;
    -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
    opacity:0.7;
    filter:alpha(opacity=70);
}

video {
    max-width: 100%;
}

/* plugins */
/* cmsplugin_filer_image */
div.cmsimage {
    display: inline-block;
    text-align: center;
    margin-top: 10px;
    margin-right: 20px;
    margin-bottom: 3px;
    margin-left: 20px;
}

div.column-startpage div.cmsimage {
    margin-right: 10px;
    margin-left: 10px;
}

div.column-footer div.cmsimage {
    margin-right: 6px;
    margin-left: 6px;
}

div.cmsimage > img {
    max-width: 100%;
}

div.column-footer div.cmsimage img {
    width: 100%;
}

div.cmsimage span.info,
div.cmsimage span.info span.title,
div.cmsimage span.info span.desc {
    display: block;
}

/* emergency service */
td.dstore div.store {
}

td.dstore div.contact {
}

/* blackboard */

.blackboard .title {
   font-weight: bold;
}

.blackboard .subnav {
    background-color: #ffffff;
    margin-bottom: 20px;
    border-spacing: 0;
}
.blackboard ul.nav-pills {
    background-color: #ffffff;
    border-spacing: 5px;
}

.blackboard .nav > li > a:hover,
.blackboard .nav > li > a:focus {
    background-color: #b40001;
    color: #ffffff;
}

.blackboard .nav form.text,
.blackboard #posts_filter_switch div.text {
    display: inline;
    padding: 5px 0 5px 10px;
}

.blackboard #posts_filter_switch i {
    vertical-align: middle;
    cursor: pointer;
}

.blackboard #posts_filter_switch.on i {
    color: #00a541;
}

.blackboard #posts_filter_switch.off i {
    color: #888888;
}

.pagenav .blackboard li a {
    color: #b40001;
}

.pagenav .blackboard a {
    color: #468847;
}

.pagenav .blackboard .subnav a:focus,
.pagenav .blackboard .subnav a:hover {
    color: #ffffff;
}

.pagenav .blackboard hr.form {
    border-color: #aaaaaa;
}

.pagenav .blackboard a:focus i,
.pagenav .blackboard a:hover i {
    color: #000000;
}

.pagenav .blackboard .panel-body a:hover,
.pagenav .blackboard .panel-body a:focus {
    color: #b40001;
}
.pagenav .blackboard ul {
    list-style-type: none;
}

.pagenav .blackboard ul a:hover,
.pagenav .blackboard ul a:focus {
    color: #000000;
}

.panel-danger > .panel-heading {
    background-color: #f2dede;
    color: #b94a48;
    border-color: #ebccd1;
}

.panel-danger.read {
    border-color: #dddddd;
}

.panel-danger.read > .panel-heading {
    background-color: #f5f5f5;
    color: #555555;
    border-color: #dddddd;
}

/* resposive ads */
/* too much menu entries, reduce font-size on smaller screens */
@media (min-width: 768px) and (max-width: 991px) {

    .header-column-left {
        padding-left: 0;
    }

    .navbar-collapse {
        padding-right: 2px;
        padding-left: 2px;
    }

    a.navbar-brand,
    form.navbar-form > div > input,
    form.navbar-form > button,
    .navbar-nav > li > a {
        font-size: 12px;
    }

    .navbar-default .navbar-brand {
        font-weight: normal;
        padding-top: 9px;
        padding-bottom: 5px;
        padding-left: 2px;
    }

    .navbar-nav > li > a {
        padding-right: 4px;
        padding-left: 4px;
    }

    form.navbar-form {
        padding: 0 5px;
    }

    form.navbar-form > div > input {
        font-size: 11px;
        height: 26px;
    }
    form.navbar-form > button {
        font-size: 11px;
        padding: 6px 6px;
    }

    .navbar-nav > li > a.menuicon-social {
        padding: 6px 0;
        width: 20px;
    }
    .navbar-nav > li > a.menuicon-social > img {
        width: 100%
    }

    div.main > div.mainrow > div {
        float: left;
    }

    div.column-footer div.cmsimage {
        margin-top: 25px;
    }

}

@media (min-width: 991px) and (max-width: 1199px) {

    .navbar-default .navbar-brand {
        font-weight: normal;
        padding-top: 9px;
        padding-bottom: 5px;
        padding-left: 2px;
    }

    .navbar-collapse {
        padding-right: 2px;
        padding-left: 2px;
    }

    .navbar-nav > li > a {
        font-size: 14px;
        font-weight: normal;
        padding-right: 4px;
        padding-left: 4px;
    }
}

@media (max-width: 767px) {

    .dropdown-menu > li > a {
        color: #ffffff;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: #ffffff;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
        color: #b40001;
        background-color: #eeeeee;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a, 
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #b40001;
        background-color: #eeeeee;
    }
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, 
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover,
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #eeeeee;
        background-color: transparent;
    }
    .navbar-collapse .divider-vertical {
        content: "";
        display: none;
    }
    .navbar-nav > li > a.menuicon-social {
        padding-left: 11px;
        padding-right: 11px;
    }

    div.main {
        display: block;
        width: 100%;
    }

    div.main > div.mainrow {
        display: block;
    }

    div.main > div.mainrow > div {
        display: block;
        float: left;
        max-width: 100%;
    }
    div.column-footer div.cmsimage img {
        max-height: 145px;
    }

}
