/* (c) 2012 by Michael Weigand
 stilmedien - Kommunikation & Werbung ------------------ 
 stilmedien.de ----------------------------------------- 
 mail@stilmedien.de --------------------------------- */

body {
    font-size: 1.6rem;
    font-family: 'Roboto Condensed', sans-serif;
    line-height: 160%;
    color: #1f1f1e;
    margin: 0;
    padding: 0;
    font-weight: normal;
}

/* allgemeine Überschriften*/

h1 {
    margin: 0;
    color: #2f297f;
    font-size: 300%;
    line-height: 1;
    font-weight: normal;
    padding: 0;
	text-transform: uppercase;
    font-family: 'Amarante', cursive;
}
h1 a,
h2 a {
    color: #2f297f !important;
    text-decoration: none !important;
}
h2 {
    margin: 0;
    color: #2f297f;
    font-size: 180%;
	line-height: 1;
    font-weight: normal;
    padding: 0;
	text-transform: uppercase;
    font-family: 'Amarante', cursive;
}
h3 {
    letter-spacing: 0;
    margin: 0;
    color: #2f297f;
    font-size: 120%;
	line-height: 1;
    font-weight: normal;
    padding: 0;
    font-family: 'Amarante', cursive;
}

/* allgemeine links im text */

a:link,
a:visited {
    text-decoration: underline;
    color: #2f297f;
}
a:hover,
a:active {
    text-decoration: none;
    color: #000000;
}

/* Listen */

ul {
    list-style: square;
}
hr {
    border: none;
	background: #000;
    height: 1px;
}
td,
div {
    font-size: 100%;
    vertical-align: top;
}
img {
    border: none;
    max-width: 100%;
    height: auto;
}
form {
    background: none;
    border: none;
}
.button,
a.button {
    background-color: #2F297F;
    color: #FFFFFF;
    border: none;
    padding: 10px 15px;
    text-decoration: none;
}
.button:hover,
a.button:hover,
.button:focus {
    background-color: #000000;
    color: #FFFFFF;
    cursor: pointer;
}
.button.secondary{
	background-color: #e8e8e8 !important;
	color: #1f1f1e !important;
}
.button.secondary:hover{
    background-color: #000000 !important;
    color: #FFFFFF !important;
}
input,
select,
textarea,
.inputbox {
    background: #BEB9A4;
    color: #686253;
    border: none;
    padding: 3px 5px;
	border-radius: 0;
}

/* Weiterlesen-Link */

p.readmore a {
    padding: 5px 8px;
    background: #E2001A;
    color: #FFFFFF !important;
    text-decoration: none;
    border-radius: 0;
}
p.readmore a:hover {
    background: #960012;
}
.item-separator {
    margin: 40px 0;
    height: 1px;
    background: #CCCCCC;
}
.gmnoprint img {
    max-width: none;
}
.gmnoprint label {
    display: inline;
    width: auto;
}
.header-wrapper {
    position: relative;
}
.header-topbar-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.topbar {
    text-align: right;
    color: #FFFFFF;
    padding: 10px 0 0 0;
    font-weight: bold;
    position: relative;
    z-index: 1;
}
.topbar a {
    color: #FFFFFF;
    text-decoration: none;
}
.header {
    line-height: 100px;
    position: relative;
    z-index: 1;
}
.header .container {
    position: relative;
}
.header .logo {
    position: relative;
}
.header .logo #logo {
    padding-left: 70px;
}
.header .logo #logo img {
    width: 280px;
    max-width: calc(100% - 75px);
    height: auto;
}
.header .logo #sau {
    position: absolute;
    left: 0;
    width: 75px;
    z-index: 2;
}
.header .line {
    height: 2px;
    background: #FFFFFF;
}
.header .line.top {
    position: absolute;
    top: 15px;
    left: 30px;
    height: 2px;
    width: 200%;
}
.header .line.bottom {
    position: absolute;
    bottom: 15px;
    left: 30px;
    height: 2px;
    width: 200%;
}
.header .mainmenu {}
.header .mainmenu ul {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
    text-align: right;
}
.header .mainmenu ul li {
    display: inline-block;
    margin: 0 0 0 15px;
}
.header .mainmenu ul li a {
    background: none !important;
    padding: 0;
    margin: 0;
    color: #FFFFFF;
    text-decoration: none;
    font-weight: bold;
}
.header .mainmenu ul ul {
    display: none !important;
}
.menu-black .topbar,
.menu-black .topbar a {
    color: #000000;
}
.menu-black .header .line {
    background: #000000;
}
.menu-black .header .mainmenu ul li a {
    color: #000000;
}
.header .mainmenu ul li a:hover,
.header .mainmenu ul li.active a {
    color: #e6b49c;
}
.header-img {
    text-align: left;
    position: relative;
    top: 0;
    left: 0;
    z-index: 0;
}
.header-img img {
    max-width: 100%;
    height: auto;
}
.submenu {
    background: #2f297f;
    color: #FFFFFF;
    padding: 15px 0;
    line-height: 20px;
    min-height: 50px;
}
.submenu ul {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
    text-align: center;
}
.submenu ul li {
    display: inline-block;
    margin: 0 0 0 15px;
}
.submenu ul li a {
    background: none !important;
    padding: 0;
    margin: 0;
    color: #FFFFFF;
    text-decoration: none;
    text-transform: uppercase;
}
.submenu ul li.cart a{
	color: #e6b49c;
}
.submenu ul li a:hover,
.submenu ul li.current a {
    font-weight: bold;
}
.content .sppb-row-container{
	padding: 0;
}
.content ul.sppb-gallery{
	margin: -5px;
}
.content ul.sppb-gallery li{
	float: left;
	width: calc(25% - 10px);
	margin: 5px;
}
.sppb-addon-shop{
	border: 1px solid #2f297f;
	margin: 0 0 30px 0;
	position: relative;
	z-index: 99;
}
.sppb-addon-shop .image{
	display: block;
	text-align: center;
}
.sppb-addon-shop .image img{
	display: inline-block;	
}
.sppb-addon-shop .title{
	display: block;
	font-weight: bold;
	text-align: center;
}
.sppb-addon-shop .price{
	display: block;
	text-align: center;
	padding: 0 0 10px 0;
}
.sppb-addon-shop .cartbutton{
	display: block;
	text-align: center;
	padding: 0 0 20px 0;
}
.sppb-addon-shop input.qty, .content input.qty{
	display: inline-block;
	text-align: center;
	width: 50px;
	padding: 10px 5px;
	background: #e6b49c;
}
.sppb-addon-shop .cartbutton .button{
	display: inline-block;
}

.sppb-addon-shop .popupopen{
	cursor: pointer;
}

.sppb-addon-shop .popupclose{
	width: 40px;
    height: 40px;
    background: #2f297f url(../images/close.svg) center center no-repeat;
    background-size: 25px auto;
    position: absolute;
    right: 10px;
    top: 10px;
    margin: 0;
    display: block;
    cursor: pointer;
    opacity: 1;
}

.sppb-addon-shop.popup{
	display: none;
	width: 500px;
	max-width: 90%;
	background: #FFFFFF;
	padding: 0 20px 20px 20px;
	z-index: 999;
}
.sppb-addon-shop.popup .price{
	font-weight: bold;
	padding: 10px 0 10px 0;
}

.content #warenkorb{background: #efefef; padding: 40px 30px;}
.content #warenkorb table{width: 100%;}
.content #warenkorb table td{padding: 10px; vertical-align: middle;}
.content #warenkorb table td:nth-child(2){text-align: center;}
.content #warenkorb table td:nth-child(3){text-align: right;}
.content #warenkorb table td:nth-child(4){text-align: right;}
.content #warenkorb table .head td{font-weight: bold;}
.content #warenkorb table .sum td{font-weight: bold;}

.content .cartaction{margin: 10px 0 0 0;}
.content .cartaction .shopmore{float: left;}
.content .cartaction .updatecart{float: right;}

@media (max-width: 600px){
	.content #warenkorb{padding: 20px 10px; margin-bottom: 40px;}
	.content #warenkorb table td:nth-child(3){display: none;}

}

.chronoform #warenkorbform{display: none;}
.chronoform .versandadresse{display: none;}

.chronoform .input-group{position: relative; margin: 0 0 20px 0; width: 100%; display: block;}
.chronoform label{font-weight: normal; display: block;}
.chronoform input, .chronoform textarea {background: #FFFFFF; font-size: 100%; padding: 10px; display:block; width:100%; max-width: 100%; min-width: 100%; border:1px solid #CCCCCC; margin: 0; box-shadow: none; border-radius: 0;}
.chronoform input:focus, .chronoform textarea:focus { outline:none; }
.chronoform input.radio{width: auto; min-width: 10px; display: inline-block; position: relative; top: 3px;}
.chronoform textarea{min-height: 100px;}
.chronoform select{background: #FFFFFF; font-size: 100%; padding: 10px; display: block; width: 100%; max-width: 100%; border: 1px solid #CCCCCC; box-shadow: none;}
.chronoform input.checkbox{display: inline-block; width: auto; padding: 0; min-width: 10px; margin: 0 5px 0 0; position: relative; top: 2px;}
.chronoform .disabled{background: rgba(0,0,0,0.1);}

.chronoform .button{background: #2F297F; color: #FFFFFF; border: none; padding: 10px 15px; text-decoration: none; display: inline-block; font-weight: 500; transition: all 0.2s ease; text-transform: uppercase; width: auto !important; min-width: 10px;}
.chronoform .button:hover{background: #000000;}

.chronoform input.valid{border-color: #48A844;}
.chronoform input.error{border-color: #D04346;}
.chronoform label.error{color: #D04346; position: absolute; top: 0; right: 0; font-size: 80%;}

.chrono_credits{position: absolute; top: -9999px;}

.content table.sale{
	width: 100%;
}
.content table.sale tr:first-child td{
	border-top: 1px solid #000;
}
.content table.sale tr td{
	border-bottom: 1px solid #000;
	padding: 5px 0;
}
.content table.sale tr td:nth-child(1){
	font-weight: bold;
}
.content table.sale tr td:nth-child(3){
	text-align: right;
}
.content table.dailymenu{
	width: 100%;
}
.content table.dailymenu tr:first-child td{
	border-top: 1px solid #000;
}
.content table.dailymenu tr td{
	border-bottom: 1px solid #000;
	padding: 5px 0;
}
.content table.dailymenu tr td span{
	background: #2f297f;
	color: #FFF;
	padding: 1px 5px;
	margin: 0 5px 0 0;
	display: inline-block;
	width: 30px;
	text-align: center;
}

.content .nav > li{}
.content .nav > li a{background: none !important;}

.footer {
    background: #2f297f;
    color: #FFFFFF;
    padding: 0 0 60px 0;
    line-height: 1.2;
}
.footer a {
    color: #FFFFFF;
    text-decoration: none;
}
.footer a:hover {
    opacity: 0.6;
}
.footer .footer1 {
    padding: 40px 0 20px 0;
    position: relative;
}
.footer .footer1:after {
    position: absolute;
    right: 0;
    top: 0;
    width: 1px;
    height: 100%;
    background: #FFFFFF;
    content: " ";
    display: block;
}
.footer .footer1 td {
    padding-right: 10px;
}
.footer .footer1 .button {
    background: #FFFFFF;
    color: #2f297f;
    margin: 10px 0 0 0;
    display: inline-block;
}
.footer .footer1 .button:hover {
    opacity: 0.6;
}
.footer .footer2 {
    padding: 40px 0 0 0;
    position: relative;
}
.footer .footer2:after {
    position: absolute;
    right: 0;
    top: 0;
    width: 1px;
    height: 100%;
    background: #FFFFFF;
    content: " ";
    display: block;
}
.footer .footer2 table {
    width: 100%;
}
.footer .footer2 table td {
    padding-right: 10px;
}
.footer .footer3 {
    padding: 40px 0 20px 0;
}
.footer .footer3 ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
.footer .footer3 ul li {}
.footer .footer3 ul li a {
    padding: 0;
    margin: 0;
    color: #FFFFFF;
    text-decoration: none;
    background: none !important;
}
.footer .footer3 ul li a:hover {
    opacity: 0.6;
}
ul#jPanelMenu-menu {
    list-style: outside none none;
    margin: 0;
    padding: 0;
    background: #2f297f;
    display: none;
}
ul#jPanelMenu-menu ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
ul#jPanelMenu-menu>li {
    padding: 0;
    text-align: left;
    position: relative;
    background: none !important;
}
ul#jPanelMenu-menu>li.desc {
    padding: 20px 40px 20px 10px;
    background: #FFFFFF !important;
    color: #2f297f;
    font-size: 140%;
    font-weight: 500;
    position: relative;
    text-transform: none;
}
ul#jPanelMenu-menu>li.desc span.close {
    width: 40px;
    height: 40px;
    background: #2f297f url(../images/close.svg) center center no-repeat;
    background-size: 25px auto;
    position: absolute;
    right: 10px;
    top: 50%;
    margin: -20px 0 0 0;
    display: block;
    cursor: pointer;
    opacity: 1;
}
ul#jPanelMenu-menu>li .trigger {
    position: absolute;
    right: 10px;
    top: 0;
    background: url(../images/trigger.svg) center center no-repeat;
    background-size: 25px auto;
    height: 50px;
    width: 30px;
    text-align: center;
    cursor: pointer;
    z-index: 99;
}
ul#jPanelMenu-menu>li .trigger.active {
    -ms-transform: rotate(90deg);
    /* IE 9 */
    -webkit-transform: rotate(90deg);
    /* Chrome, Safari, Opera */
    transform: rotate(90deg);
}
ul#jPanelMenu-menu>li a {
    border-top: 1px solid rgba(0, 0, 0, 0.20);
    color: #FFFFFF;
    display: block;
    font-weight: normal;
    line-height: 50px;
    text-decoration: none;
    padding: 0 40px 0 10px;
    background: none !important;
}
ul#jPanelMenu-menu>li:last-child a {
    border-bottom: 1px solid rgba(0, 0, 0, 0.20);
}
ul#jPanelMenu-menu ul.nav-child {
    padding: 0 0 10px 0;
}
ul#jPanelMenu-menu ul.nav-child li {
    border: medium none !important;
}
ul#jPanelMenu-menu ul.nav-child li a {
    border: medium none;
    font-weight: normal;
    line-height: 100%;
    padding: 8px 10px;
    text-transform: none;
}
ul#jPanelMenu-menu ul ul {
    display: block !important;
    margin: 0 0 0 10px;
}
ul#jPanelMenu-menu li.active ul {}
.jPanelMenu-panel {
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.6);
    overflow: hidden;
    background: none !important;
}
ul#jPanelMenu-menu li.active a {
    color: #e6b49c !important;
    font-weight: bold !important;
}
ul#jPanelMenu-menu li.active .nav-child a {
    color: #FFFFFF !important;
}
ul#jPanelMenu-menu li.active .nav-child li.current a {
    color: #e6b49c !important;
    font-weight: bold !important;
}
@media (max-width: 992px) {
    .header .logo #logo img {
        max-width: calc(100% - 130px);
        height: auto;
    }
    .mainmenu {
        display: none;
    }
    .menu-toggle {
        display: block;
        width: 40px;
        height: 40px;
        background: url(../images/menu.svg) center center no-repeat;
        background-size: 25px 25px;
        position: absolute;
        right: 15px;
        top: 50%;
        margin: -20px 0 0 0;
    }
    .menu-black .menu-toggle {
        background: url(../images/menu_black.svg) center center no-repeat;
        background-size: 25px 25px;
        cursor: pointer;
    }
    .footer .footer2 {
        padding-top: 20px;
    }
    .footer .footer2:after {
        top: 0;
        left: 0;
        height: 1px;
        width: 100%;
    }
    .footer .footer2 td:nth-child(1) {
        width: 8%;
    }
    .footer .footer2 td:nth-child(2) {
        width: 30%;
    }
    .footer .footer2 td:nth-child(3) {
        width: 46%;
    }
}
@media (max-width: 480px) {
    .topbar {
        font-size: 80%;
        text-align: center;
    }
    .header-img img {
        max-width: 2000px;
        width: auto;
        height: 250px;
    }
}