/***** General *****/
body { margin: 0; padding: 0; background: url(pic/bg.jpg) center top no-repeat fixed; color: rgb(0,0,0); font: normal 15px 'Exo 2', sans-serif; }
p { /*font-size: 1.1em;*/ font-weight: 400; line-height: 1.7em; }
a { color: rgb(0,0,0); }
	a:hover,a:focus { color: rgb(0,0,0); text-decoration: underline; transition: all 0.3s; }
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 { line-height: 1.3; text-align: left; }
.container { padding-right: 0px; padding-left: 0px; }
.container-fluid { padding-right: 0px; padding-left: 0px; }
/*.bg-dark { background: rgb(39,42,93) !important; }*/
.nav-item { margin: 3px 10px; }
.nav-link { font-size: 18px; }
h1 { margin-bottom: 20px; font-size: 30px; font-weight: bold; }
h2 { /*margin-bottom: 2px;*/ font-size: 22px; font-weight: bold; }
h3 { /*margin-bottom: 2px;*/ font-size: 18px; font-weight: bold; }
.list-group-item { padding: 10px; background: rgb(245,245,245); }
	.list-group-item.nadpis { margin: 0px 0px; /*background: rgb(255,192,0); border-color: rgb(255,192,0);*/ background: rgb(84,197,63); border-color: rgb(84,197,63); color: rgb(0,0,0); /*font-weight: bold;*/ font-size: 18px; text-transform: uppercase; }
	.list-group-item-action { text-align: left; }
		.list-group-item-action2 { padding-left: 25px; font-size: 12px; } 
		.list-group-item-action3 { padding-left: 35px; font-size: 11px; }
			/*.list-group-item-action3.active a { color: #fff !important; }*/
		/*.list-group-item-action.active { background: rgb(255,0,0); }*/
table th { text-align: center; }
	table.zakaznik th { text-align: left; width: 20%; }
table td { text-align: left; }
footer { padding: 17px 0 10px 0; background: rgb(35, 35, 35); color: rgb(255,255,255); text-align: center; }
	footer a, footer a:hover { color: rgb(141, 198, 65); }

.btn-success { background-color: rgb(84,197,63); border-color: rgb(84,197,63); /*background-color: rgb(255,192,0); border-color: rgb(255,192,0);*/ }

.list-group-item { background: rgb(220,220,220); }
.list-group-item.active { background-color: #007bff; border-color: #007bff; }

.form-inline .form-control { width: 75%; }

/***** Layout *****/
#content { /*margin: 0px auto;*/ padding: 25px; min-height: 600px; background: rgb(255,255,255); text-align: justify; box-shadow: 0px 0px 20px rgb(30,30,30); /*border: 1px solid red;*/ }
	#content ul li { line-height: 25px; }

#list .col-lg-6, #list .col-lg-3, #list .col-md-6 { margin-bottom: 30px; }
	#list .border { padding: 5px; border: 1px solid rgb(230,230,230) !important; transition: all 0.3s; }
		#list .border:hover { /*background: rgb(230,230,230);*/ box-shadow: 0px 0px 20px rgb(180,180,180); transition: all 0.3s; }
	#list h2 { margin-bottom: 2px; height: 50px; font-size: 18px; overflow: hidden; }
	#list .popis { font-size: 10px; height: 50px; }
	#list .cena { font-size: 20px; font-weight: bold; }
		/*#list .cena2 { font-weight: bold; }*/
		#list .cena2 { font-size: 10px; font-weight: normal; }
	#list .kusy { width: 50px; }
	#list .kosik { height: 50px; }
	#list .image { margin: 5px; }
	#list .detail { font-size: 13px; height: 60px; }
		#list .detail .col-3 { font-size: 12px;  }
	#list .ean { padding: 2px; background: rgb(132,182,31); color: rgb(255,255,255); text-align: center; font-size: 11px; }
	#list .border_r { border-right: 1px dotted rgb(0,0,0); }
	#list .border_t { border-top: 1px dotted rgb(0,0,0); }
/*	
	#list .status-novinka { margin: -12px 0 0 calc(100% - 130px); background: url(sortiment/pic/status-novinka1.png) no-repeat; width: 100px; height: 100px; position: absolute; z-index: 1; }
	#list .status-vypredaj { margin: -12px 0 0 calc(100% - 130px); background: url(sortiment/pic/status-vypredaj.png); width: 100px; height: 100px; position: absolute; z-index: 10; }	
	#list .status-akcia { margin: -12px 0 0 calc(100% - 130px); background: url(sortiment/pic/status-akcia.png); width: 100px; height: 100px; position: absolute; z-index: 10; }
	#list .status-nedostupny { margin: -12px 0 0 calc(100% - 130px); background: url(sortiment/pic/status-nedostupny.png); width: 100px; height: 100px; position: absolute; z-index: 10; }		
*/
	#list .status-novinka { margin: -11px 0 0 calc(100% - 103px); background: url(sortiment/pic/status-novinka1.png) no-repeat; width: 70px; height: 70px; position: absolute; z-index: 10; }
	#list .status-vypredaj { margin: -11px 0 0 calc(100% - 103px); background: url(sortiment/pic/status-vypredaj1.png) no-repeat; width: 70px; height: 70px; position: absolute; z-index: 10; }
	#list .status-akcia { margin: -11px 0 0 calc(100% - 103px); background: url(sortiment/pic/status-akcia1.png) no-repeat; width: 70px; height: 70px; position: absolute; z-index: 10; }
	#list .status-nedostupny { margin: -11px 0 0 calc(100% - 103px); background: url(sortiment/pic/status-nedostupny1.png) no-repeat; width: 70px; height: 70px; position: absolute; z-index: 10; }		
	
/***** paging *****/
#paging { margin: 10px auto 25px auto; padding: 0; width: 100%; overflow: hidden; text-align: center; }
	#paging ul { margin: 0; padding: 0; list-style-type: none; /*float: right;*/ font-size: 15px; }
	#paging li { margin: 0; padding: 0; display: inline-block; }
	#paging li a { margin: 0; padding: 0px 8px; display: inline-block; color: gray; border-top: #fff 2px solid; border-bottom: #fff 2px solid; text-decoration: none; }
		#paging li a:hover { border-top: rgb(255,0,0) 2px solid; color: rgb(255,0,0); text-decoration: none; }
	#paging li.active_page { margin: 0; padding: 0 8px; background: rgb(0, 123, 255); color: rgb(255,255,255); border-top: rgb(0, 123, 255) 2px solid; border-bottom: rgb(0, 123, 255) 2px solid; }
	#paging li.inactive { margin: 0; padding: 0 8px; color: rgb(210,210,210); border-top: #fff 2px solid; border-bottom: #fff 2px solid; text-decoration:none; }
	#paging li.zaznamov { padding: 1px 0 0 0; border-top: 2px solid rgb(255,255,255); border-bottom: 2px solid rgb(255,255,255); }
	#paging li.poloziek {  }
	#paging select { margin: 0; padding: 2px; border: 1px solid rgb(200,200,200); }
	
/***** responzive *****/
@media (max-width: 768px) { 
	.btn { margin: 5px 0 0 0; width: 100%; }
	.list-group { margin-bottom: 15px; } 
	.form-inline .form-control { width: 100%; }
}



.ribbon {
  position: absolute;
  right: 11px;
  top: -5px;
  z-index: 1;
  overflow: hidden;
  width: 75px;
  height: 75px;
  text-align: right;
}
.ribbon span {
  font-size: 11px;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
  font-weight: bold;
  line-height: 20px;
  transform: rotate(45deg);
  width: 100px;
  display: block;
  background: #54C53F;
  /*background: linear-gradient(#9BC90D 0%, #79A70A 100%);*/
  	background: #54C53F;
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
  position: absolute;
  top: 19px;
  right: -21px;
}
.ribbon span::before {
  content: '';
  position: absolute;
  left: 0px;
  top: 100%;
  z-index: -1;
  border-left: 3px solid #54C53F;
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #54C53F;
}
.ribbon span::after {
  content: '';
  position: absolute;
  right: 0%;
  top: 100%;
  z-index: -1;
  border-right: 3px solid #54C53F;
  border-left: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #54C53F;
}

.red span {
  /*background: linear-gradient(#F70505 0%, #8F0808 100%);*/
  background: #FF0000;
}
.red span::before {
  border-left-color: #FF0000;
  border-top-color: #FF0000;
}
.red span::after {
  border-right-color: #FF0000;
  border-top-color: #FF0000;
}

.blue span {
  /*background: linear-gradient(#2989d8 0%, #1e5799 100%);*/
  background: #2A4DD4;  
}
.blue span::before {
  border-left-color: #2A4DD4;
  border-top-color: #2A4DD4;
}
.blue span::after {
  border-right-color: #2A4DD4;
  border-top-color: #2A4DD4;
}	

.yellow span {
  /*background: linear-gradient(#2989d8 0%, #1e5799 100%);*/
  background: #F7F22E;
  color: #000;
  font-size: 9px;  
}
.yellow span::before {
  border-left-color: #F7F22E;
  border-top-color: #F7F22E;
}
.yellow span::after {
  border-right-color: #F7F22E;
  border-top-color: #F7F22E;
}	

.brown span {
  /*background: linear-gradient(#2989d8 0%, #1e5799 100%);*/
  background: #A65E3D;
  font-size: 10px;  
}
.brown span::before {
  border-left-color: #A65E3D;
  border-top-color: #A65E3D;
}
.brown span::after {
  border-right-color: #A65E3D;
  border-top-color: #A65E3D;
}