@import url('https://fonts.googleapis.com/css2?family=Bitter:wght@400;700&display=swap');
	
	
	body {
		background-color: white;
	}
	
	body,p,td,tr,input,textarea,select, button {
		font-family: 'Bitter', serif;
	}
	
	.page {
		width:95%;
		max-width: 1200px;
		background-color: white;
		margin:30px auto;
		
		font-size:12pt;
		
		-webkit-box-shadow: 0px 0px 10px 2px rgba(234, 234, 234, 1);
		-moz-box-shadow: 0px 0px 10px 2px rgba(234, 234, 234, 1);
		box-shadow: 0px 0px 10px 2px rgba(234, 234, 234, 1);
	}
	
	.header {
		padding:20px;
		text-align: center;
	}
	
	.logo a {
		border-bottom: unset !important;
	}
	
	.menu {
		padding:20px;
		text-align: center;
		font-size:1.2em;
		border-bottom: 1px solid #DFEF78;
		
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-flow: row wrap;
	}
	
	.menu span {
		margin:0 20px;
	}
	
	.menu a {
		color:black;
		text-decoration: none;
		border-bottom: 3px solid #DFEF78;
	}
	
	.menu a.active, .branches a.active {
		font-weight: bold;
		border-bottom-color: #29CF34;
	}
	
	.menuitems img {
		height:17px;
	}
	
	
	
	a {
		color:black;
		text-decoration: none;
		border-bottom: 3px solid #DFEF78;
	}
	
	.logo {
		background: #DFEF78;
background: -webkit-linear-gradient(to right, #DFEF78 0%, #29CF34 100%);
background: -moz-linear-gradient(to right, #DFEF78 0%, #29CF34 100%);
background: linear-gradient(to right, #DFEF78 0%, #29CF34 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-weight: bold;
font-size: 1.5em;
	}
	
	a.plus {
		color:white;
		background-color: #29CF34;
		padding:2px 8px;
		text-decoration: none;
		border-radius:4px;
		border-bottom: unset;
		
	}
	
	a.minus {
		color:white;
		background-color: #29CF34;
		padding:2px 8px;
		text-decoration: none;
		border-radius:4px;
		border-bottom: unset;
		
		
	}
	
	.footer {
		text-align: center;
		padding:20px;
		border-top: 1px solid #DFEF78;
	}
	
	.content {
		padding:20px;
	}
	
	.content h2 {
		text-align: center;
	}
	
/* формы */

input, select, textarea, button {
	font-size: 1em;
	/*padding:10px;*/
	margin: 5px 5px;
	border:1px solid #989898;
	
}

input {
	padding:1.5px;
	height:38px;
	min-height: 45px;
	
}

input[type="checkbox"] {
	height:unset;
	min-height: unset;
}

select {
	height:42px;
	background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 95% 50%;
	-moz-appearance: none; 
	-webkit-appearance: none; 
	appearance: none;
    /* and then whatever styles you want*/
	height: 50px; 
	padding:0 20px 0 10px;
	border-radius:0;
	max-width: 150px;
}

textarea {
	padding:9px;
	height:30px;
	margin-bottom: 1px;
}

input[type="submit"], input[type="reset"], button {
	padding:9px;
	background-color: #29CF34;
	border: 1px solid transparent;
	color:white;
	height: 50px;
}

div.formfield {
	position: relative;
	/*margin-bottom:10px;*/
	display: inline-block;
}

div.submitblock {
	display: inline-block;
}

span.fieldname {
	background-color: white;
	padding:3px;
	position: absolute;
	top:-3px;
	font-size:10px;
	left:10px;
}

.form form {
	 display: flex;
 flex-flow: row wrap;
 justify-content: center;
 align-items: center;
}

.quickadd {
	margin-bottom: 30px;
}

.quickfilter {
	margin-bottom: 30px;
}

/* таблица */

div.table {
	overflow-x: auto;
	width:100%;
}

.table table {
	margin:0 auto;
	width:80%;
	border-collapse: collapse;
}

.table th {
	padding:10px;
	background-color:white;
	text-align: center;
	border:1px solid #989898;
}

.table td {
	padding:10px;
	background-color:white;
	text-align: center;
	border:1px solid #989898;
}



.table td:nth-child(2) {
	/*text-align: left;*/
}

tr:nth-child(odd)>td {
	background-color: white;
}

tr:nth-child(even)>td {
	background-color: #f8f8f8;
}

.table td p:first-child {
	margin-top: 0;
}

.table td p:last-child {
	margin-bottom: 0;
}

/* */

.photo img {
	width:75px;
}

.name {
	font-weight: bold;
}

.basic {
	font-size: 0.8em;
	color: #555555;
}

.basic span {
	margin:0 10px 0 0;
}

.more span.prices {
	margin:0 10px 0 0;
}

.quantity {
	font-weight:bold;
}



span {
  position: relative;
  display: inline-block;
}

span[title]:hover::after {
  content: attr(title);
  position: absolute;
  top: -120%;
  left: 0;
  background-color: #DFEF78;
  padding:3px;
  border-radius: 5px;
}

.addimage {
	
}

input[type="file"]::file-selector-button {
    display: none1;
	width:75px;
	height:75px;
	background-image: url(content/images/add-image.png);
    background-size: cover;
	font-size: 10px;
	border: 0px solid #ccc;
	cursor: pointer;
	color:transparent;
}

input[type="file"] {
	width:75px;
	height:75px;
	padding:0;
}

.submitblock a {
	margin:0 5px;
}

.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    cursor: pointer;
	
	/* width: 75px;
    height: 75px;
    background-image: url(content/images/add-image.png);
    background-size: cover;*/
	
	display:none;
	
}

.itogo {
	text-align: center;
}

.result {
	text-align: center;
	font-weight: bold;
	background-color: #DFEF78;
	padding: 10px;
	width: fit-content;
	margin: 1em auto;
}

tr.hidesku {
	display: none;
}

td.description {
	text-align: left;
}

td.main {
	text-align: left;
}

td.photo {
 text-align: center;
}

tr.edited td {
	background-color: rgba(223,239,120,0.5);
}

tr.date td {
	background-color: rgba(223,239,120,0.25);
}

tr.sold td {
	background-color: rgba(41,207,52,0.5);
}

td.operations {
	width:15%;

}



.operations a {
		color:black;
		text-decoration: none;
		border-bottom: 3px solid #DFEF78;
		margin-right: 10px;
	}
	
.skuoperations a {
		color:black;
		text-decoration: none;
		border-bottom: 3px solid #DFEF78;
		margin-right: 10px;
	}
	
div.quickedit {
	border: 3px solid rgba(223,239,120,0.5);
	width: fit-content;
	margin: 0 auto 30px auto;
	padding:10px;
	box-shadow: 0px 0px 10px 0px rgba(223,239,120,0.5);
	-webkit-box-shadow: 0px 0px 10px 0px rgba(223,239,120,0.5);
	-moz-box-shadow: 0px 0px 10px 0px rgba(223,239,120,0.5);
}

div.quicksale {
	border: 3px solid rgba(41,207,52,0.5);
	width: fit-content;
	margin: 0 auto 30px auto;
	padding:10px;
	box-shadow: 0px 0px 10px 0px rgba(41,207,52,0.5);
	-webkit-box-shadow: 0px 0px 10px 0px rgba(41,207,52,0.5);
	-moz-box-shadow: 0px 0px 10px 0px rgba(41,207,52,0.5);
}

.flatpickr-months .flatpickr-month {
	height:42px !important;
}

.form {
	max-width: calc(100% - 26px);
}

.itemname {
	font-weight: bold;
}

.branches {
	width:80%;
	margin:1em auto;
	text-align: right;
}

.branches span {
	margin-left: 10px;
}

.discount {
	color:red;
}

td.image img {
	width:75px;
	height:75px;
	object-fit:cover;
}

.error {
	text-align: center;
	font-weight: bold;
}

td.functions {
	text-align: left;
}

.zero {
	color:red;
}

span.nomargin {
	margin:unset;
}

@media screen and (max-width:900px) {
	.menu {
		justify-content: center;
	}
		
	.table table {
		width: 100%;
    }
	
	.branches {
		width:100%;
	}
	
	textarea {
		max-width: calc(100% - 18px);
	}
	}
	
	
	
	
	
.center {
		text-align: center;
	}
	
	.left {
		text-align: left;
	}