/* structure + elements
------------------------------ */

#totop a:hover::before { color: #fff; background-color: #36a4d7; }

h1, h2, h3, .headline { margin-bottom: 28px; }


/* header
------------------------------ */

header.main { background-color: #36a4d7 }

header.main > .wrp {
clear: both;
overflow: unset;
display: flex;
align-items: center;
justify-content: space-between;
height: 130px;
padding: 10px;
}

header .search { margin-top: 0; }
header .search fieldset { margin-bottom: 0; }

/* main navigation
------------------------- */

#navbar > .wrp { display: flex; justify-content: space-between; }

/* hide home nav element like in main shop */  
#navbar .navbarHome { display: none !important; }

#navbar > .wrp, #navbar > .wrp > ul { height: 50px !important; }

#navbar .wrp > ul { display: flex; align-items: center; }

#navbar .wrp > ul > li { height: 39px !important; margin-top: 0 !important; margin-left: 15px; line-height: 38px !important; }

#navbar .wrp > ul > li:first-child {
  height: inherit;
  margin-top: inherit;
  margin-left: 0;
  background-color: #222;
  color: #fff;
  font-size: inherit;
  line-height: inherit;
  cursor: pointer;
}

#navbar .wrp > ul > li:first-child:hover { color: inherit;  background: inherit; }

#navbar .wrp > ul > li:first-child::after { margin-top: 1px; }

#navbar .wrp > ul > li:first-child, #navbar .wrp > ul > li > a {	padding: 0 10px; border-radius: 3px; }

#navbar .wrp > ul > li a { height: 39px; line-height: 38px; font-size: 16px !important; }

#navbar .wrp > ul > li:hover ul { top: 37px; }

#navbar .wrp > ul > li:hover ul > li > a { padding: 15px 20px; height: auto; border: 0 none transparent; background: #f7f7f7; }

#navbar .wrp > ul > li:hover ul > li > a:hover { background: #fff; }

#navbar .wrp > ul > li > a:hover, #navbar .wrp > ul > li > a .current { background-color: #fff; }

/* search
------------------------- */

header form.search { position: relative; }

header form.search input[type="text"] { border-right: 0 none transparent !important; }

header form.search input[type="submit"] {
  position: absolute;
  width: 40px;
  height: 40px;
  border: none;
  background: url("https://www.vereinsdruck.shop/tpl/ds_flyeralarm/assets/loupe.png") no-repeat center center;
  right: 0;
  top: 0;
}


/* customer menu
------------------------- */

header.main #customer-menu > button,
header.main #customer-menu > button:hover,
header.main #customer-menu a,
header.main #customer-menu a:hover,
#offcanvas .btn,
#offcanvas .btn:hover,
header.main #customer-menu a.active,
header.main #customer-menu > button.active { background: #111; }

header.main #customer-menu a::before,
header.main #customer-menu > *::before,
header.main #customer-menu > button span { color: #fff !important; }

header.main #customer-menu a:hover::before,
header.main #customer-menu > button:hover::before,
header.main #customer-menu > button:hover span,
#offcanvas .btn:hover,
header.main #customer-menu a.active::before,
header.main #customer-menu > button.active::before { color: #36a4d7 !important; }

header.main #customer-menu a .count,
#offcanvas .btn .count { background: #fff !Important; color: #000 !important; font-size: 11px; }

header.main #customer-menu a.active .count,
header.main #customer-menu > button.active .count { background: #36a4d7 !important; color: #000; }

header.main #customer-menu .menu-item-cart.active { background: #000 !important; }

#navbar { top: 160px; }


/* content
------------------------------ */

/* buttons
------------------------- */

.btn,
.btn.success { border: 0 none transparent !important; background: #222; }

.btn:hover,
.btn.success:hover,
.btn.edit:hover,
.btn.success:active,
.btn.success.active { background-color: #36a4d7; color: #fff; }

.btn.edit { border-radius: 0 !important; background: #222; color: #fff; }

.btn.edit#addressBookModal, .btn.edit#addressBookModalLiefer, .btn.edit#addressBookModalAbsender { border: 0 none transparent; }


/* pages
------------------------- */

main h1:last-child,
main h2:last-child,
main h3:last-child,
main h4:last-child,
main h5:last-child,
main h6:last-child { margin-bottom: 0; }

h2.rte_container, .rte_container h2, #impressum h2 { margin: 0 0 5px; font-weight: 600; font-size: 30px; }
h3.rte_container, .rte_container h3, #impressum h3 { margin: 0 0 5px;  font-weight: 600; font-size: 24px; }
h4.rte_container, .rte_container h4, #impressum h4 { margin: 0 0 5px;  font-weight: 600; font-size: 20px; }
p.rte_container, .rte_container p, #impressum p { margin: 0 0 10px;  }
.rte_container ul { margin-bottom: 15px; }

.benefits > div,
.benefits > div > * { color: #000 !important; text-transform: uppercase; }

.benefits > div {
	float: left;
	box-sizing: border-box;
	margin-right: 2%;
	padding: 17px 15px;
	color: #fff;
	font-family: 'libre-regular';
	font-weight: bold;
	font-size: 19px !important;
}

.benefits > div:first-child { width: 49.5%; background-color: #36a4d7 !important; }

.benefits > div:nth-of-type(2) {
width: 47.5%;
margin-right: 0;
background-color: #f2f2f2 !important;
background-size: 11%;
}

.benefits > div span {
	display: block;
	color: rgba(0,0,0,0.05) !important;
	font-family: 'libre-bold';
	font-size: 38px !important;
	line-height: 24px;
	text-transform: uppercase;
}


/* home section
------------------------- */

/* 1st block after slider */
#slider + .wrp { padding: 45px 0; background-color: #fff; }

/* 2nd block after slider */
.trade-groups { margin-bottom: 0 !important; padding: 45px 0 55px !important; background: #f7f7f7 !important; }

/* 3rd block after slider */
.trade-groups + .wrp { padding: 45px 0 0; }

/* 4th block after slider */
#trade-blocks + .wrp { padding: 0 0 50px; }

#trade-blocks + .wrp .benefits.wrp { margin-top: 0; margin-bottom: 0; }

/* 5th block after slider */
.parallax { display: flex; align-items: center; margin: 0; }
.parallax .wrp { border: 0 none transparent; }

/* 6th block after slider */
#usp-bar { padding: 40px 0 40px; background: #f7f7f7; }

/* 7th + 8th block after slider */
#trade-blocks,
#payment-bar { padding: 0; }

/* blocks contents 
-------------------- */

.cms_homepage_text * { color: inherit; }


/* products
------------------------- */

/* product attachments
-------------------- */

#modalTemplates #modulesPrinttemplate ul { display: flex; flex-wrap: wrap; }

#modalTemplates #modulesPrinttemplate ul li {
float: none !important;
width: auto !important;
margin-bottom: 10px;
margin-right: 15px;
padding: 0 10px 0 8px;
}


/* order
------------------------- */

.cart_breadcrumb li { /*color: #888; */line-height: 21px;}

/*.cart_breadcrumb li.active { color: #fff; }*/

/*.cart_breadcrumb li.preactive { background: #36a4d7 !important; color: #fff; }*/


/* cart
-------------------- */

#cart #total_price strong { color: #000; }


/* order process
-------------------- */


/* footer
------------------------------ */

footer.main { background: #fff; }

/* "Cheat" because there's no 2nd col */
footer.main address .col_left { width: 100%; }

footer.main>.wrp>nav li.druckmuster_jn { display: none; }

/*Tel + mail */
footer.main i { color: #333; }

.leadprint-brand { display: none; }


/* media queries
------------------------------ */

@media screen and (min-width: 1281px) {
#offcanvas_open { display: none; }
}

@media screen and (min-width: 1280px) {
.benefits > div {padding: 10px 15px; background-size: contain !important; }
}

@media screen and (max-width: 1280px) {
#offcanvas #shortcut_menu { display: flex; }
#offcanvas .btn {
float: none;
display: flex;
align-items: center;
justify-content: center;
border-color: #222;
}
#offcanvas .btn .count {
top: 10px;
right: 10px;
background: #36a4d7;
color: #000;
height: 25px;
width: 25px;
font-size: 11px;
line-height: 25px;
}
.benefits > div span { font-size: 18px; }
}

@media screen and (min-width: 768px) { 
header.main { height: 160px; margin-bottom: 50px; }
header.main #customer-menu { display: flex; align-items: center; margin-top: 0; }
}

@media screen and (max-width: 767px) {
header.main { height: 78px; margin-bottom: 0; }
header.main #brand-logo {
width: auto !important;
height: 60px !important;
margin-top: 0;
margin-left: 5px;
}
header.main #brand-logo img { width: auto; min-height: 60px; max-height: 60px; }
 #offcanvas_open { top: 20px; right: 18px; }
}