/*
---------------------------Introduction: Change colors of a DP4-Shop-----------------------------
-------------------------------------------------------------------------------------------------
This is a css template, where all css-classes are added to change the main-colors of a DP4-Shop:
---
1. Save this css-file in customer-directory and rename it to "css_Standard.css".   
   Example: \Druckereiportal4\Content\custom\printportal\Democenter Contoweb\css_Standard.css
2. Choose your custom color and generate all needed gradations: https://www.color-hex.com/
3. Search and replace all colors, where you can find in classes bg-100, bg-80.
   [optional: bg-15]
4. [optional: icons how can be changed are listed on the bottom of this file ]
-------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------
*/

/*--------------------------------- Colors ---------------------------------*/

.bg-100 {
  background-color: #268b9d !important;
}

.bg-80 {
  background-color: #b1dae1 !important;
}

.bg-35 {
  background-color: #f1f7f8 !important;
}

.bg-15 {
  background-color: #ededed !important;
}

.color-100 {
  color: #268b9d !important;
}

.color-80 {
  color: #b1dae1 !important;
}

.border-100 {
  border-color: #268b9d;
}

.border-80 {
  border-color: #b1dae1;
}

.text-primary {
  color: #268b9d !important;
}

.hover-primary {
  background-color: #b1dae1 !important;
}

.form-control {
  color: #268b9d;
  border: 1px solid #268b9d;
}

/*--------------------------------- Buttons ---------------------------------*/

/* Button */
.btn-primary {
  background-color: #268b9d !important;
  color: #fff !important;
}

.btn-secondary {
  background-color: #b1dae1 !important;
  color: #fff !important;
}

.btn-primary:hover {
  background-color: #b1dae1 !important;
  color: #fff !important;
}

/*--------------------------------- head, h1-h6, p, table, a, hr ---------------------------------*/

html body {
  color: #268b9d !important;
}

h1,
.h1 {
  color: #268b9d;
}

p,
.p {
  color: #268b9d;
}

th,
td,
dl,
dt,
dd {
  color: #268b9d;
}

a {
  color: #268b9d !important;
}

a.text-primary:hover,
a.text-primary:focus {
  color: #268b9d !important;
}

hr,
.hr {
  border-top-color: #268b9d !important;
}

/*--------------------------------- Breadcrumb ---------------------------------*/

.breadcrumb a {
  color: #b1dae1;
}

.breadcrumb a:hover {
  color: #268b9d;
}

.breadcrumb-item.active {
  color: #268b9d;
}

/*--------------------------------- Auftragsarchiv ---------------------------------*/

/* Buttons for page change */

/* Vorherige | 1 | Nächste 
	   Block	
	*/
.page-link {
  color: #268b9d;
  border: 1px solid #268b9d;
}

/* 
	   Vorherige | Nächste 
	   if not avaible	
	*/
.page-item.disabled .page-link {
  color: #268b9d;
  border-color: #268b9d;
}

/* 
	   Vorherige | Nächste 
	   :hover	
	*/
.page-link:hover {
  color: #b1dae1;
  border-color: #268b9d;
}

/* 	
		1 (Number in the middle)
		styling
	*/
.page-item.active .page-link {
  background-color: #268b9d;
  border-color: #268b9d;
}

.badge-dark {
  background-color: #b1dae1 !important;
}

/* listed suggestions */
a:active.list-group-item,
a:focus.list-group-item,
a:hover.list-group-item {
  color: #268b9d;
}

.nav-artikel {
  color: #b1dae1 !important;
}

/*--------------------------------- Icons ---------------------------------*/

/* OPTIONAL: change Icons */

.img-icon-favorite + label {
  background: url("../../../Images/konpago.ch/favorite_add.svg") no-repeat;
}
.img-icon-favorite:checked + label {
  background: url("../../../Images/konpago.ch/favorite_remove.svg") no-repeat;
}

a[data-toggle="collapse"][data-toggle="collapse"][aria-expanded="false"] {
  background-image: url(/Images/konpago.ch/dark/show_more.svg) !important;
}

a[data-toggle="collapse"][data-toggle="collapse"][aria-expanded="true"] {
  background-image: url(/Images/konpago.ch/dark/show_less.svg);
}

/* following remaining icons are defined in the _Navigation.cshtml
		warenkorb.svg
		benutzer.svg
		auftraege.svg
	*/

/*--------------------------------- Warenkorb ---------------------------------*/
.bg-light-main {
  background-color: #ededed !important;
}

.bg-img-preview {
  background-color: #ededed !important;
}

/*--------------------------------- Alert ---------------------------------*/
.alert-info {
  color: #268b9d !important;
}

/*--------------------------------- 
  Konpago-specific adjustments (not colors) 
  --------------------------------- */
.mb-6 {
  margin-bottom: 5rem !important;
}

@media (max-width: 575px) {
  .card-body {
    min-height: 4.2rem !important;
  }
  .nav {
    height: 160px;
  }
}

@media (max-width: 768px) {
  .logo-size {
    width: 200px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

.bg-img-preview {
  background-color: #cfcfcf !important;
}

/*--------------------------------- Alert ---------------------------------*/
.footer {
  bottom: -110px;
}