@import url(https://fonts.googleapis.com/css?family=Playfair+Display);

@font-face { font-family: 'FuturaPT-Medium'; src: url('webfonts/2F53AC_0_0.eot'); src: url('webfonts/2F53AC_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/2F53AC_0_0.woff2') format('woff2'),url('webfonts/2F53AC_0_0.woff') format('woff'),url('webfonts/2F53AC_0_0.ttf') format('truetype'); }
@font-face { font-family: 'FuturaPT-Demi'; src: url('webfonts/2F53AC_1_0.eot'); src: url('webfonts/2F53AC_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/2F53AC_1_0.woff2') format('woff2'),url('webfonts/2F53AC_1_0.woff') format('woff'),url('webfonts/2F53AC_1_0.ttf') format('truetype'); }

body { color: #2f3133; font-family: 'FuturaPT-Medium'; line-height: 1.5; font-size: 20px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }

h1 { color: #464849; text-transform: uppercase; line-height: 1.2; font-size: 32px; margin-bottom: 1.2em; margin-top: 1em; }
/*p { font-family: 'Dual 300'; margin-bottom: 1.5em; }*/
p { font-family: 'Dual W00_400'; margin-bottom: 1.5em; }

a:active,
a:focus { outline: 0 !important; -webkit-appearance: none; }

#home-intro { height: 100%; }
    /*#home-intro #intro-content { background-image: url('img/homeIntro.jpg'); background-repeat: no-repeat; height: 100%; }*/
    #home-intro #intro-content { background-image: url('homeIntro.jpg'); background-repeat: no-repeat; height: 100%; }

#home-content { }

.home-menu-submenu-container,
.home-news-container,
.home-content-container { margin-top: 1em; margin-bottom: 1em; border-bottom: thin solid #d5d5d5; padding-bottom: 1em; padding-top: 1.5em; }

/* submenu */
.navbar-default { border: none; background-color: #fff; }
    .navbar-default .navbar-brand { color: #fff; background-color: transparent; }
.navbar { min-height: 70px; margin-bottom: 2em; /*border: 1px solid transparent;*/ }
.navbar-default .navbar-nav > li > a { color: #d5d5d5; font-size: 16px; text-transform: uppercase; }
.navbar .container { border-bottom: thin solid #d5d5d5; }
.navbar-brand { height: auto; padding: 1em; }
    .navbar-brand > img { margin: 0 auto; }

/* margin of first row, equals menu height */
.container > .row:first-child { /*margin-top: 70px;*/ /*margin-top: -1em;*/ }
/* setting of last row item */
.container > .home-content-container:last-child { /*border-bottom: none; padding-bottom: 1em; margin-top: 0; margin-bottom: 0; padding-top: 0;*/ }

@media all and (min-width:768px) {
    /* center brand */
    .navbar-brand-centered { position: absolute; left: 50%; display: block; width: 160px; text-align: center; background-color: #eee; }
    .navbar > .container .navbar-brand-centered,
    .navbar > .container-fluid .navbar-brand-centered { margin-left: -80px; }

    /* format submenu */
    .navbar-nav > li:first-child > a { padding-left: 0; }
    .navbar-right > li:first-child > a { padding-right: 1.5em; }
    .navbar-right > li:last-child > a { padding-right: 0; }
    .navbar-nav > li > a { padding: 2em; }
}

/* news container*/
.home-news-container { }
    .home-news-container h1 { font-size: 18px; margin-top: 0; margin-bottom: 2em; }
    .home-news-container p { font-size: 18px; }

/* content container*/
.home-content-container { padding-bottom: 2.5em; }
    .home-content-container .introheader { color: #d5d5d5; font-size: 102px; font-family: "Playfair Display"; line-height: 1em; margin-bottom: 0.5em; /*margin-right: 0.25em; margin-left: 0.25em;*/ }
    /*.home-content-container h1 { font-size: 25px; margin-bottom: 1.5em; margin-top: 1em; }*/
    .home-content-container p { width: 90%; }
    .home-content-container a { text-transform: uppercase; color: #464849; border-bottom: thin solid #464849; font-family: "FuturaPT-Medium",Helvetica,Arial,sans-serif; font-size: 15px; letter-spacing: 0.1em; }
    .home-content-container p.more { margin-top: 2em; }
    /* set container padding on odd / even */
    .home-content-container.even .content-container { /*padding-right: 2em;*/ }
    .home-content-container.odd .content-container { /*padding-left: 2em;*/ }
    .home-content-container.even img.lead-image { /*padding-left: 1em;*/ }
    .home-content-container.odd img.lead-image { /*padding-right: 1em;*/ }
    .home-content-container img.lead-image.full { padding-right: 0 !important; padding-left: 0 !important; padding-top: 2em; }

    /* hide home leadimage on small devices */
    .home-content-container .image-container { display: none; }

@media all and (min-width: 768px) {
    .home-content-container .image-container { display: block; }
}

/* last row */
.footer-content-container { color: #d5d5d5; font-family: "FuturaPT-Medium"; line-height: 1.5; font-size: 25px; text-transform: uppercase; padding-bottom: 1em; }
    .footer-content-container a { color: #d5d5d5; border: none; letter-spacing: 0; font-size: 20px; }
        .footer-content-container a:hover { color: #333; }

/* SubPage */
.content-container-subcontainer p { width: 90%; }
.content-container-subcontainer { float: left; width: 605px; padding-left: 2em; height: 100%; overflow: auto; padding-right: 4em; /*background-color: #fff;*/ }
/* todo: calculate width of image*/
.content-container-imagecontainer { background-color: #d5d5d5; float: left; width: 1315px; height: 100%; z-index: -10; /*position: fixed;*/ position: absolute; right: 0; background-repeat: no-repeat; background-size: cover; background-position-x: center; }

.content-header-container { float: left; width: 100%; }
.content-header { float: left; width: 50%; }
.content-logo img { padding-top: 1.5em; height: 110px; float: right; }

.highlight { text-transform: uppercase; font-weight: normal; font-family: "FuturaPT-Demi"; }

.lead-article { margin-bottom: 2em; margin-top: 3em; }
    .lead-article h1 { font-size: 24px; margin-bottom: 0; margin-top: 1em; }
    .lead-article h2 { font-size: 20px; margin-top: 0.2em; margin-bottom: 0; }
    .lead-article p { width: 100%; margin-top: 1em; }

.content-header-back { float: left; width: 100%; margin-top: 1em; }
    .content-header-back a { color: #464849; text-transform: uppercase; font-size: 0.8em; }
        .content-header-back a::before { content: "\2190"; font-size: 1.7em; padding-right: 0.3em; line-height: 1; font-weight: bold; }

a.sortiment { text-transform: uppercase; color: #464849; }
    a.sortiment img { height: 30px; float: left; padding-right: 0.75em; }

.content-container-logocontainer { background-color: #9ba1aa; position: fixed; top: 0; right: 0; /*width: 70px; height: 70px;*/ }
    .content-container-logocontainer img { padding: 1em; }

a.content-link { text-transform: uppercase; color: #464849; border-bottom: thin solid #464849; font-family: "FuturaPT-Medium",Helvetica,Arial,sans-serif; font-size: 15px; letter-spacing: 0.1em; }


/* SubPage Kaesemacher*/
#kaesemacher .content-container-imagecontainer { background-image: url(img/mgKaesemacher.jpg); }
#genussbegeistert .content-container-imagecontainer { background-image: url(img/mgGenussbegeistert-03.jpg); }
#businesscatering .content-container-imagecontainer { background-image: url(img/mgBusinessCatering.jpg); }
#pizzabaguette .content-container-imagecontainer { background-image: url(img/mgPizzaBaguette.jpg); }
#spezialitaeten .content-container-imagecontainer { background-image: url(img/mgSpezialitaeten.jpg); background-position: center bottom; }
#weine .content-container-imagecontainer { background-image: url(img/mgWeine.jpg); background-position: center bottom; }

/* Marte */
body { background-image: url(img/redox_01.png); }

.signation { font-size: 0.75em; text-transform: uppercase; }

.header-menu .navbar-nav > .open > a,
.header-menu .navbar-nav > .open > a:hover,
header-menu .navbar-nav > .open > a:focus { background: none !important; }

.header-menu .navbar-nav > li > .dropdown-menu { background: none; border: none; box-shadow: none; margin-top: -2em; }

.header-menu .dropdown-menu { min-width: 225px; border: none; text-align: right; margin-right: 3em; }
    .header-menu .dropdown-menu > li > a { color: #fff; }

        .header-menu .dropdown-menu > li > a:hover,
        .header-menu .dropdown-menu > li > a:focus { color: #333; background: none !important; }

.header-menu .navbar-default .navbar-nav > .open > a,
.header-menu .navbar-default .navbar-nav > .open > a:hover,
.header-menu .navbar-default .navbar-nav > .open > a:focus { color: #fff; }


#home-contact h1,
#home-contact h2,
#home-contact h3 { line-height: 26px; margin-bottom: 0; }
#home-contact h1 { font-size: 22px; margin-top: 2em; font-weight: bold; }
    #home-contact h1.first-child { margin-top: 1.5em; }
#home-contact h2 { font-size: 20px; font-weight: bold; }
#home-contact h3 { font-size: 20px; font-weight: bold; }
#home-contact a { color: black; text-decoration: none; }

#home-contact h2 { /*font-size: 18px; font-weight: 400;*/ }
#home-contact h3 { /*font-size: 20px; font-weight: 400; font-weight: bold; font-size: 18px;*/ }
#home-contact { width: 400px; position: fixed; left: -500px; top: 0; height: 100%; text-transform: uppercase; /*background-image: url('images/redox_01.png');*/ /*color: #1a1a1a; font-family: "FuturaPT-Medium", sans-serif; font-size: 20px; font-weight: 400; line-height: 26px;*/ z-index: 999; padding: 2em; padding-left: 3em; -moz-transition: all 1s; -o-transition: all 1s; -webkit-transition: all 1s; transition: all 1s; padding-right: 3em; padding-top: 1.3em; }
    #home-contact h1.first-child { /*margin-top: 2em;*/ }

#home-contact { background-image: url("img/redox_01.png"); opacity: 1; padding-right: 2em; z-index: 11000; padding-top: 2em; width: 335px; color: #9ba1aa !important; padding-left: 2em; max-height: 100%; overflow: auto; }
.close-home { float: left; width: 100%; }
    .close-home img { float: right; }

#home-contact h1 { font-size: 22px; margin-top: 2em; font-weight: normal; font-family: "FuturaPT-Demi"; color: #9ba1aa !important; }
#home-contact h2 { font-size: 18px; font-weight: normal; margin-top: 0; }
#home-contact h3 { font-size: 18px; font-weight: normal; font-family: "FuturaPT-Demi"; }
#home-contact a { text-decoration: none; font-family: "FuturaPT-Medium"; font-size: 18px; color: #9ba1aa !important; }

.intro-content { color: #fff; padding-top: 15em; padding-bottom: 5em; font-family: "FuturaPT-Medium"; min-height: 100%; }
    .intro-content .brand-container { margin-bottom: 5em; }
        .intro-content .brand-container img { }
    .intro-content .brand-content { width: 60%; margin: 0 auto; }
    .intro-content h1 { color: #fff; font-size: 28px; margin-bottom: 0; }
    .intro-content hr { width: 250px; margin: 0 auto; margin-bottom: 1em; margin-top: 0.75em; }
    .intro-content p { width: 60%; margin: 0 auto; font-family: "FuturaPT-Medium"; font-size: 24px; margin-bottom: 2em; }
    .intro-content a { color: #fff; text-transform: uppercase; border: thin solid; padding: 0.3em 1em; }
        .intro-content a:hover { /*background-color: #fff; color: #2f3133;*/ }

.dropdown-menu { min-width: 203px; border: none; text-transform: uppercase !important; text-align: right; }

.navbar.header-menu { min-height: 70px; margin-bottom: 2em; margin-bottom: 0; background: none; position: absolute; z-index: 9999; width: 100%; border: none; display: none; margin-top: 1em; }

    .navbar.header-menu .container { border: none; }
.header-menu .navbar-nav > li > a { color: #fff; }

.navbar-toggle { margin-right: 1em; margin-top: 1.2em; }

.brand-content { width: 100%; margin: 0 auto; }
    .brand-content p { width: 100%; margin: 0 auto; font-family: "FuturaPT-Medium"; font-size: 24px; margin-bottom: 2em; }

.navbar > .container .navbar-brand-centered,
.navbar > .container-fluid .navbar-brand-centered { margin-left: -65px; }
.header-menu .navbar > .container .navbar-brand-centered,
.header-menu .navbar > .container-fluid .navbar-brand-centered { margin-left: -70px; }

#home { background-repeat: no-repeat; background-size: cover; background-position: center center; opacity: 0.8; color: #fff; font-family: "FuturaPT-Medium"; padding: 0; }
#home { background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(227, 6, 19, 0.09) 15%), url('homeIntro.jpg'); }
    #home > .row { display: table; width: 100%; height: 100%; padding: 0; margin: 0; }
    #home .home-content { display: table-cell; vertical-align: bottom; float: none; min-height: 480px; padding: 0; margin: 0; }


.brand-container { margin-bottom: 5em; }
    .brand-container img { }
/*.brand-content { width: 60%; margin: 0 auto; }*/
.brand-content h1 { color: #fff; font-size: 28px; margin-bottom: 0; }
.brand-content hr { width: 250px; margin: 0 auto; margin-bottom: 1em; margin-top: 0.75em; }
/*.brand-content p { width: 60%; margin: 0 auto; font-family: "FuturaPT-Medium"; font-size: 24px; margin-bottom: 2em; }*/
.intro-enter a { color: #fff; text-transform: uppercase; border: thin solid; padding: 0.3em 1em; }
    .intro-enter a:hover { /*background-color: #fff; color: #2f3133;*/ }

.contact-container { position: absolute; top: 3em; left: 3em; z-index: 10000; height: 30px; }
.mobile-brand { position: absolute; top: 15px; left: 0px; z-index: 10000; height: 30px; right: 0; text-align: center; display: none; }

.contact-container img { height: 30px; }
/*.mobile-brand img { height: 30px; }*/


.home-links { height: 4em; }
#home-content { margin-top: -70px; padding-top: 70px; }

.content-container-subcontainer { width: 100%; padding-right: 2em; }
.content-container-imagecontainer { visibility: hidden; }
.content-container-subcontainer p { width: 100%; padding-right: 2.2em; }
.content-mobile-img { display: block; margin-bottom: 2em; float: left; width: 100%; }
.content-container-logocontainer { position: absolute; }
    .content-container-logocontainer img { padding: 0.5em; height: 80px; }
.content-logo { display: none; }

.content-header br { display: none; }
.home-content-container .introheader { font-size: 60px; }


.brand-container { margin-bottom: 3em; margin-top: 2em; }

/**/
@media all and (min-width:768px) {
    .header-menu .navbar-nav > li > a { padding-left: 2em !important; padding-right: 2em !important; padding-top: 2.8em !important; padding-bottom: 2.8em !important; }
    .header-menu .navbar-nav { float: left; margin: 0; padding-left: 5em; padding-right: 0; }
    .header-menu .navbar-right { float: right !important; margin-right: -15px; padding-right: 5em; padding-left: 0; }

    .content-header br { display: block; }

    .home-content-container .introheader { font-size: 102px; }

    .home-content-container.odd .content-container { padding-left: 2em; }
    .home-content-container.even .content-container { padding-right: 2em; }
    .home-content-container.even img.lead-image { padding-left: 1em; }
    .home-content-container.odd img.lead-image { padding-right: 1em; }

    .content-mobile-img { display: none; }

    .content-container-subcontainer .content-mobile-img { display: block; }
    .content-container-subcontainer p { width: 100%; /*padding-right: 2em;*/ padding-right: 1.45em; }
}

@media all and (min-width:1025px) {

    .content-logo { display: block; }

    .content-container-subcontainer { width: 605px; padding-right: 4em; }
    .content-container-imagecontainer { visibility: visible; }

    .content-container-subcontainer p { /*width: 90%;*/ }
    .content-container-logocontainer { position: fixed; }
        .content-container-logocontainer img { padding: 1em; height: 100%; }

    .content-container-subcontainer .content-mobile-img { display: none; }
}

@media all and (min-width: 1280px) {
    .header-menu .navbar-nav > li > a { padding-left: 4em !important; padding-right: 4em !important; padding-top: 2.8em !important; padding-bottom: 2.8em !important; }
    .header-menu .navbar-nav { padding-left: 8em; padding-right: 0; }
    .header-menu .navbar-right { padding-right: 8em; padding-left: 0; }

    .brand-content,
    .brand-content p { width: 60%; }
}

@media all and (max-width:767px) {
    .navbar-fixed-top { /*display: block !important;*/ }
    .header-menu { display: none !important; }

    .navbar > .container .navbar-brand-centered,
    .navbar > .container-fluid .navbar-brand-centered { margin-left: 0; }

    .home-links { display: none; }

    .contact-container { top: 1em; left: 1em; display: block !important; }
    .mobile-brand { display: block; }

    /* optimize home mobile */


    .brand-content h1 { font-size: 22px; margin-top: 4.5em; }
    .brand-content hr { width: 200px; margin-top: 0.5em; }

    .brand-container { display: none; }
    .brand-content p { margin-bottom: 1em; font-size: 16px; padding-left: 15px; padding-right: 15px; }

    .home-content-container .introheader { font-size: 55px !important; }
}

@media all and (max-width:900px) and (orientation: portrait) {
    .navbar-fixed-top { /*display: block !important;*/ }
    .header-menu { display: none !important; }

    .navbar > .container .navbar-brand-centered,
    .navbar > .container-fluid .navbar-brand-centered { margin-left: 0; }

    .home-links { display: none; }

    .contact-container { top: 1em; left: 1em; display: block !important; }
    .mobile-brand { display: block; }

    .brand-container { display: none; }
    .brand-content p { margin-bottom: 1em; }
}

/* Business Catering */
.content-container-imagecontainer { z-index: 5; }
.content-container-logocontainer { z-index: 10; }

.content-container-subcontainer,
.content-container-subcontainer-level-2,
.content-container-subcontainer-level-3 { float: left; width: 605px; padding-left: 2em; height: 100%; overflow: auto; padding-right: 4em; -moz-transition: left 1s; -o-transition: left 1s; -webkit-transition: left 1s; transition: left 1s; }

.content-container-subcontainer-level-2 { position: absolute; left: 605px; }
.content-container-subcontainer-level-3 { position: absolute; left: 1210px; }

.content-container-subcontainer { width: 100%; padding-right: 2em; position: absolute; }

.subpage-container,
.subpage-container-mobile { float: left; width: 100%; margin-bottom: 1.5em; }

.subpage-container { display: none; }
.subpage-container-mobile { display: block; }
.content-container-subcontainer-level-2,
.content-container-subcontainer-level-3 { display: none; }

/*@media all and (min-width:768px) {*/
@media all and (min-width:1025px) {
    .content-container-subcontainer { width: 605px; padding-right: 4em; }

    .subpage-container { display: block; }
    .subpage-container-mobile { display: none; }

    .content-container-subcontainer-level-2,
    .content-container-subcontainer-level-3 { display: block; }
}

a.subpage { text-transform: uppercase; color: #464849; font-family: "FuturaPT-Medium"; }
ul.content { font-family: "Dual W00_400"; margin-bottom: 1.5em; padding-left: 1em; }

.content-header-back a::before { content: "\2039"; font-size: 1.5em; padding-right: 0.3em; line-height: 1; font-weight: bold; font-family: 'Dual W00_400'; }
a.subpage::before { content: "\203A"; font-size: 1.5em; padding-right: 0.3em; line-height: 1; font-weight: bold; font-family: "Dual W00_400"; }

.lead-article .img-responsive { min-width: 100%; }




.content-container-subcontainer { /*overflow: auto !important;*/ }

@media all and (max-width: 1024px) {
    .content-container-subcontainer,
    .content-container-subcontainer-level-2,
    .content-container-subcontainer-level-3 { overflow: hidden; height: auto; }

    .home-link-enter { visibility: hidden !important; }
}

/* noJS */
#mgContactContainerMobile { display: none !important; }
.noJS #mgNavBarFixedTop { display: none !important; }
.noJS #mgHeaderMenu { display: block !important; }
.noJS #mgBrandContainer { display: none !important; }
.noJS .home-content { padding-top: 30% !important; }

.noJS #home { height: 0 !important; padding-bottom: 60%; }
    .noJS #home:after { opacity: 0.8 !important; }

.noJS #introContent { visibility: visible !important; }
.noJS #introLinks { visibility: visible !important; }
.noJS .intro-enter { display: none !important; }
.noJS .intro-to-news { display: block !important; }
.noJS #mgContactContainer { display: none !important; }
.noJS #mgContactContainerMobile { display: block !important; }
.noJS #footer-contact { display: block !important; }

/* optimization */
#genussbegeistert .content-container-imagecontainer { background-image: url(img/mgGenussbegeistert-03.jpg); opacity: 0; transition: 1s all; }
    #genussbegeistert .content-container-imagecontainer.shown { opacity: 1; }
#genussbegeistert #image-container-2.content-container-imagecontainer { background-image: url(img/mgGenussbegeistert-01.jpg); }

#businesscatering .content-container-imagecontainer { background-image: url("img/mgBusinessCatering.jpg"); opacity: 0; transition: 1s all; }
    #businesscatering .content-container-imagecontainer.shown { opacity: 1; }
#businesscatering #image-container-2.content-container-imagecontainer { background-image: url("img/mg_dienstleistungen_01.jpg"); }
#businesscatering #image-container-2-2.content-container-imagecontainer { background-image: url("img/mg_dienstleistungen_02.jpg"); }
#businesscatering #image-container-3.content-container-imagecontainer { background-image: url("img/mg_konzeption.jpg"); }

.active-gallery-container { cursor: pointer; z-index: 9; }