@charset "utf-8";
/* FONTS 
@import url(http://fonts.googleapis.com/css?family=Signika+Negative:400,600&subset=latin,latin-ext);
*/
@font-face {
  font-family: 'Signika Negative';
  font-style: normal;
  font-weight: 400;
  src: url(fonts/Z-Q1hzbY8uAo3TpTyPFMXUvhvNk3JTR21y7KD052k40.woff) format('woff');
}
@font-face {
  font-family: 'Signika Negative';
  font-style: normal;
  font-weight: 600;
  src: url(fonts/q5TOjIw4CenPw6C-TW06FtatzzXq3x4JKpNFiBueuss.woff) format('woff');
}

html{ padding:0; margin:0;  }
body {
	font-family: 'Signika Negative', sans-serif;
	padding:0; margin:0;
	font-weight:400;
	
	background:#f9f9f9;
	/*
	font-size:2.5vmin;
	*/
	
	
	padding:4vmin;
	
	
	
}



a:link, a:visited{ color: #C00; text-decoration:none   }
a:active, a:hover{ color: #F90; }



.fl{ float:left; }
.fr{ float:right }

div, input{ box-sizing:border-box !important   }

.x{ display:none}

.tac{ text-align: center}

input[type=text], input[type=number], input[type=password], input[type=email], input[type=tel]{
	font-family: 'Signika Negative', sans-serif;
	color:#eee;
	margin:0;
	border:0;
	padding:3vmin 3vmin 3vmin 9vmin;  
	width:100%;
	font-size:3.5vmin;
	box-shadow:inset 0 0 5vmin #000;
	background:#222;
}
input[type=text]:focus, input[type=number]:focus, input[type=password]:focus, input[type=email]:focus, input[type=tel]:focus{
	background:#fff !important;
	color:#000;
	box-shadow:inset 0 0 3vmin #666;
	font-weight:bold;
}

.microinput{
	font-size:2vmin !important;
	padding:1vmin .5vmin !important;
}
#setTable .microinput{
	width:10vmin
}
#search, #addOrderSearch, #addProductSearch, #clientSearch{

	background:#222 url(search.png) 3vmin center no-repeat;
	background-size:4.2vmin;
	
	
}
#search:hover, #addOrderSearch:hover,  #addProductSearch:hover,  #clientSearch:hover{
	background:#fff url(search.png) 3vmin center no-repeat !important;
	background-size:4.2vmin !important;
}
#addOrderSearch, #addProductSearch{ width:60vw; }

.inputData{
	padding:2vmin 1vmin !important;
	font-size:4vmin !important;
}
.inputData2{
	padding:2vmin 1vmin !important;
	font-size:3.5vmin !important;
	width:30vw !important;
	margin:0 0 2vmin 0 !important;
}
.inputData3{
	padding:2vmin !important;
	font-size:3vmin !important;
	width:43vw !important;
	margin:0 0 2vmin 0 !important;
}
.inputData4{
	padding:2vmin !important;
	font-size:3vmin !important;
	width:60% !important;
	margin:0 !important;
	background:#fff !important;
	box-shadow:inset 0 0 4vmin #ddd !important;
	color:#000 !important;
}

.inputData5{
	padding:1.5vmin 1vmin !important;
	font-size:3.5vmin !important;
	width:30vw !important;
	margin:0 0 1vmin 0 !important;
}
.mininput{
	width:17vw !important;
}

.unit{
	padding:1.5vmin 2vmin 1.5vmin 3vmin ;
	font-size:3.5vmin;
	width:10vw;
	margin:0;
	display:inline-block;
	background:#ddd

}
.unitmin{
	width:5vw;
	margin-right:2vmin;
}

.unit .small{
	font-size:2.2vmin;
}
.bruttos{
	margin:1vmin 1vmin 0 0
}

.buttonset .ui-button{ font-size:3.5vmin !important}

.order{
	margin:0 auto 3vmin auto; padding:0;
	width:100%;
	background:#fff;

	border-left:1px solid #ddd;
	
	
	box-sizing:border-box;
	

}
.order .title{ margin:0; padding:2vmin 0 ;width:100%;background: #000; color:#fff }
.order .title .number{  margin:0 2vmin 0 0; padding:2vmin;  color:#fff; font-weight:600; cursor:pointer} 


.order .title .number-0{ background:#0093dd; }
.order .title .number-1{ background: #F90; }
.order .title .number-2{ background: #63b72e; }
.order .title .number-3{ background: #666; }



.order .title .date{background: #666;     margin:-2vmin 0 0 0; padding:2vmin;  color:#fff; float:right;}
.order .title .date sup{ line-height:0 }
.order .title .driver{background: #222;     margin:-2vmin 0 0 0; padding:2vmin;  color:#fff; float:right;}

.order .content{ margin:0; padding:0;width:100%; }
.order .content .products{  margin:0;padding:0; border-right: #dfdfdf solid 1px  }
.order .content .products .table, #setTable {  border-spacing:0; border-collapse: separate;  width:100%  }
.order .content .products .table tr td{ padding: 1vmin 1.5vmin; font-size:2.5vmin; cursor:pointer; border-bottom: #dfdfdf solid 1px}

.order .content .products .table tr td:nth-of-type(1){ /*width:16vw;*/


}#productName{ font-weight:600; margin-top:.6vmin; display:inline-block; float:left }
.order .content .products .table tr td:nth-of-type(2){ width:4vw }
.order .content .products .table tr td:nth-of-type(3){ width:4vw }
.order .content .products .table tr td:nth-of-type(4){ width:4vw }

.order .content .products .table tr td:nth-of-type(5){ width:4vw; padding:0 1vmin; }
.order .content .products .table tr td:nth-of-type(6){ width:4vw; font-weight:600; color: #C00;  padding:0 1vmin; }

.order .content .products .table tr td:nth-of-type(7){ width:4vw; background: #fff; text-align:center; padding:0 1vmin; color:#888 }

.pico{
	width:3.8vw;
	height:3.8vw;
}
.localPrices{
	float:right;
	text-align:right;
	margin:-1.2vmin 0 !important;
	display:inline-block;
	line-height:1.0;
	
}


#setTable tr:nth-child(even) td{
	background:#fff;
}
/*
.order .content .products .table tr:nth-child(odd) td
,*/#setTable tr:nth-child(odd) td
{ background:#eee }
/*

.order .content .products .table tr:nth-child(odd) td:nth-child(even)
,*/#setTable tr:nth-child(odd) td:nth-child(even)
{ background:#ddd }
/*

.order .content .products .table tr:nth-child(even) td:nth-child(even)
,*/#setTable tr:nth-child(even) td:nth-child(even)
{ background:#eee }
/**/

.order .content .products .table tr:nth-child(odd) td
,#setTable tr:nth-child(odd) td
{ background:#fbfbfb }







/*
.order .content .products .table tr:nth-last-child(1) td:nth-child(1){ background: #fff }

.order .content .products .table tr:nth-last-child(1) td:nth-child(2){ background: #fff }
.order .content .products .table tr:nth-last-child(1) td:nth-child(3){ background: #fff }
.order .content .products .table tr:nth-last-child(1) td:nth-child(4){ background: #fff }
.order .content .products .table tr:nth-last-child(1) td:nth-child(5){ background: #fff }
.order .content .products .table tr:nth-last-child(1) td:nth-child(6){ background: #fff }
*/


.controls{
	width:100%;
	background:	#dededc;
	line-height: 0;
	margin-top:-1px;
}
.controls a{ margin:0; padding:0; line-height:0; display:inline-block; }

#add_product { /* background:#F90; border:0.5vmin solid #F90; */

/*
border-radius:5vmin;
*/
}
#add_product:hover{ /* border-color: #000 */ }

.del_order { }
.del_order:hover{ opacity:.5 }



/*.del_product, */
.delivery{ width:5vmin; height:5vmin; margin:0 0 .5vmin 0;}
.payment{ width:5vmin; height:5vmin; margin:0 0 2.5vmin 0;}
.invoice{ width:5vmin; height:5vmin; margin:0 ;}
#user{  width:3vmin; height:3vmin;margin:-.5vmin .5vmin -.5vmin -.5vmin;  }
#welcomeUser{  width:3vmin; height:3vmin; margin:-.5vmin 0 -.5vmin 0;  }

.red{ color:#C00 }
.yellow{ color:#FF9900 !important }

.ybg{ background: #C00 !important;  }

.green{ color: #3E8A01 }
.gray{ color:#999 }

.big{ font-size:4vmin }
.calendar{ font-size:3.5vmin !important; margin:-1vmin -.5vmin !important; display:inline-block !important}

.date sup{ margin-bottom:-1.5vmin !important; display:inline-block !important }

.order .content .products .options { background: #fff !important; padding:0 !important; width:40%; border-left: #dfdfdf solid 1px }
.order .content .products .options table {  border-spacing:0; border-collapse: separate;  width:100%;  }
.order .content .products .options table td{ border:0; padding:2vmin 0    }



.order .content .products .options table td:not(.comments){  background: #fff !important; }

.order .content .products .options table td:nth-child(1){ width:12vmin !important}
.order .content .products .options table td:nth-child(2){  width:16vmin !important;
background:#fbfbfb !important; border:#dfdfdf solid 1px; border-top:0; border-bottom:0; padding:0 !important }

.order .content .products .options table td:nth-child(3){ width:12vmin !important}
.comments{ color: #F00 !important } 	
.comments , textarea{
	/*
	padding: 1vmin !important; border:2vmin #fff solid !important;
	*/
	padding: 2vmin !important; border:0 !important; 
	
	
width:auto !important;
border-left: #dfdfdf solid 1px !important ;

font-family: 'Signika Negative', sans-serif !important;

font-size:2vmin; color:#777; /*transition:.2s; float: right;*/

background:#eee url(comments.png) no-repeat center center !important;

background-size:25%;
vertical-align:text-top;



}
#comments textarea, #alertPicker textarea{
	border:0;
	width:60vw !important;
	height:30vh;
	font-size:3vmin;
	color:#666; /*transition:.2s; float: right;*/
	padding:2vmin !important;
	
	background:#eee url(comments.png) no-repeat center center;
	box-shadow:inset 0 0 4vmin #ccc;
}
#comments textarea:hover, #alertPicker textarea:hover{
	color:#000; /*transition:.2s; float: right;*/
	background:#fff url(comments.png) no-repeat center center !important;
	box-shadow:inset 0 0 3vmin #bbb;
	
}




#productsUpdate textarea{
	padding:2vmin !important;
	border:0 !important;
	box-shadow:inset 0 0 3vmin #666;
	width:100% !important;
	height:50vmin;
	font-size:3vmin;
	margin:2vmin 0 !important;
	background:#eee !important;
	
}
#productsUpdate textarea:hover{
	color:#000;
	background:#fff !important;
}
/*
.comments:focus{    color:#000; 

font-size:2.5vmin; padding:2vmin;
width: 200%;
height:150%;
 
position: relative;

background-size:25%;

 }
 */

.megaIcon img{
	width:10vmin;
	height:10vmin;
	border-right:1px solid #666;
	margin:1vmin 0 3vmin 0;
}
.megaIcon{
	
	
	 display:inline-block;
	
	padding:0;
	/*
	border-radius:8vmin;
	*/
	
	
	
}
#headIcons{ margin:2vmin 0 0 0 }
#headIcons a{ line-height:0; display:inline-block}

#deliveryPicker .megaIcon:hover,
#headIcons .megaIcon:hover,
.megaActive, #settings, #clients

{
	opacity:.7
}



/*
 .megaYellow{
	background:#F90;
	border:.7vmin solid #FFDAA1
}
 .megaYellow:hover{
	border-color:#000;
}
*/
hr{ height:0; border:0; border-top:1px solid #ccc; margin:.9vmin 0}

.forCenter{
display: flex;
align-items: center;
justify-content: center;
}


.btn{
	background: #F90;
	font-size:4vmin;
	font-weight:bold;
	padding:2vmin;
	text-align:center;
	color:#000;
	margin:2vmin 0;
}

.controls .btn{
	 width:10vmin; height:10vmin; border-right:1px solid #666;
	 
	 background: none;
	font-size:0;
	font-weight: normal;
	padding:0; margin:0

}
.btn-green{
	background: #690;
	color:#fff
}
/*
.btn:hover{
	background:#fff;
	color:#999;
}
*/
.mb{
	margin-bottom:1vmin
}
.mb2{
	margin-bottom:2vmin
}
/*
.fixedWidth1, .fixedWidth2{
	width:11vmin !important;
}
.fixedWidth1{
	
	padding-right:0 !important;
	padding-left:3vmin !important;
	
}
*/

.redAlert{
	background:#CC0000 !important;
	color:#fff !important;
}


td:not(.comments), .ellipsis{ white-space:nowrap;overflow:hidden;text-overflow:ellipsis}



#welcome{ margin:0 0 4vmin 0}
#welcome a:link, #welcome a:visited{ color:#333; background:#fff; padding:1vmin 1.5vmin; margin:0 0 0 2vmin; text-decoration:none; border-bottom:1px solid #ccc  }
#welcome a:active, #welcome a:hover{ color:#fff; background:#000; }


#projectStatusesPicker label, #statusesPicker label{ width:40vmin } #invoicePicker label{ width:45vmin }


/*
.barContainer{
	height: 1px !important;
	width:100%; display:inline-block;
	background: rgba(0,0,0,.2);
	margin: 1vmin auto -10vmin auto;
}
.bar{
	height: 1px !important;
	width:100%; display:inline-block;
	background: #D70000;
	float:right
}
*/

#login{
	width:50vw;
	margin:auto;
}






.userCard, .clientCard {
	background:#fff;
	margin: 3vmin 3vmin 0 0;
	float:left;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ddd;
	width:45vw !important;
	overflow:hidden;
}
.userCard .item, .clientCard .item{
	margin:0 2vmin;

}
.userCard .buttonset{
	margin-bottom:2vmin;
}
.userCard #avatar{
	background:#ddd;
	margin:2vmin 2vmin -3vmin 3vmin;
	width:5vmin;
	height:5vmin;
	padding:2vmin;
	/*
	border-radius:10vmin;
*/
}
.userCard #del, .clientCard #del{

margin: 2vmin 2vmin 0 0;
width: 5vmin;
height: 5vmin;
top: 0;
right: 0;
position: relative;

}




.userCard .disabled{
	font-size:3vmin;
	padding:1vmin;
	line-height:1;
	height:9.28vmin
}

.clientCard #avatar{
	
	margin:3vmin 4vmin -2vmin 3vmin;
	width:8vmin;
	/*
	height:10vmin;
*/


}


.w100{ width:100% }
#header .big{
	margin:2vmin 0 0 2vmin !important;
	display:inline-block;
	float:left;
	font-size:200%;
}
#productsUpdate #header .big{
	margin:0 !important 
}
	
.column{ width:49% }

#productsUpdate #del_product, #delDate, #delInv{
margin: 1vmin 0;
border: 1vmin solid #ddd;
/*
border-radius: 6vmin;
*/
padding: 1vmin;
}
#productsUpdate #del_product:hover, #delDate:hover, #delInv:hover {
margin: 1vmin 0;
border: 1vmin solid #c00;
/*
border-radius: 6vmin;
*/
padding: 1vmin;
}

 #delDate, #delInv{
position: fixed;
bottom: 1%;
left: 47%;
 }
 
#productsUpdate #save{
	width:80%
}
.clientAutocomplete{
	padding:2vmin;
	background:#fff;
	border-bottom:1px solid #ccc
}

#addOrderPicker, #addProductPicker{
	height:60vmin;
}
.clearField{
	float: right;
/* display: inline-block; */
/* z-index: 10; */
position: relative;
margin: 2vmin 2vmin 0 -10vmin;
width: 6vmin;
height: 6vmin;
opacity:.4
}
.clearField2{
position: relative;
margin: 0 1.5vmin -.8vmin -5.5vmin;
width: 4vmin;
height: 4vmin;
opacity: .4;
}
.clearField:hover, .clearField2:hover{
	opacity:1 !important;
	box-shadow:0 0 .1vmin .2vmin #fff;
	/*
	border-radius:8vmin;
	*/
	background:#ddd;
}

#setTable input[type=checkbox], #setTable img{
	width: 4vmin;
	height: 4vmin;
}
#setTable .switchProd{
	width: 6vmin;
	height: 6vmin;
	margin:-.5vmin 2vmin -1vmin 2vmin;
}
#setTable td{
	padding:2vmin 1vmin;
}

#sync{
    transition-duration: .2s;
	margin-top:24vmin;
	width:6vmin;
	height:6vmin;
	opacity:.6;
	background:#ccc;
	border:#ddd 2vmin solid;
	padding:1vmin;
	border-radius:6vmin;

}#sync:hover{
transform:rotate(180deg);

}
.addIcon{
	margin-right:5vmin;
}
.clientCard .item input[data-column="postalCode"], .clientCard .item input[data-column="deliveryPostalCode"]{ width:22vmin !important }
.clientCard .item input[data-column="city"], .clientCard .item input[data-column="deliveryCity"]{ width:45vmin !important; margin-left:1vmin !important }
.clientCard .btn{ width:36vmin !important }