*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}
html{font-size:10pt;min-height: 100vh;}
body{
	background-color: #f3f2f6;
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1IiBoZWlnaHQ9IjUiPgo8cmVjdCB3aWR0aD0iNSIgaGVpZ2h0PSI1IiBmaWxsPSIjZmZmIj48L3JlY3Q+CjxyZWN0IHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9IiNjY2MiPjwvcmVjdD4KPC9zdmc+");
	width:100%;
	min-height:100vh;
	font-family: Segoe UI,Tahoma,Trebuchet MS,Arial,sans-serif;
}
#content{
	width:100%;
}
a{
	color: #555;
}
.inline{display:inline-block;}
.hidden{display:none}
.block{	display:block;}
/* navbar
*/
.nav-container {
    width: 100%;
    background-color: #222;
}
nav {
    max-width: 1720px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 10% 1fr 10%;
}
  #block-menu-1{
  	grid-column: 1;
  }
  #block-menu-2 {
  /*display: grid;
  grid-template-columns: repeat(4, auto) 1fr;
  grid-gap: 15px;
  align-self: center;*/
  }
  #block-menu-3 {
    grid-column: 3;
    display:table;
    height:100%;
  }
  #block-menu-2 a {
    padding: 10px 0;
    margin-left: 15px;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.5px;
  }
  #block-menu-2 a.active,#block-menu-2 a:hover{
  border-bottom:3px solid #FED601;
  transition:.3s all ease-in-out;
  }
  #block-menu-2 ul{
  	list-style-type:none;
  	display:table;
  	height:100%;
  	margin:auto;
  }
  #block-menu-2 li{
  	display:table-cell;
  	padding:10px;
  	vertical-align:middle;
  	width:200px;
  }
  #block-menu-3 a{
  	display:table-cell;
  	vertical-align:middle;
  	padding:10px;
  }
  .logo {
    padding: 5px 15px;
    display:inline-block;
    height:73px;
  }
  .logo svg{width:68px;}
  #nav-toggle, .burger-menu {
    display: none;
  }
  .burger-menu {
    grid-column: 3;
    align-self: center;
    margin-left: 20px;
    color:white;
  }
  #disconnect-mitem{display:none!important}
  nav a {
    text-decoration: none;
    font-family: Arial, sans-serif;
    color:#FFF;
    transition: .3s all ease-in-out;
  }
  navbar-nav .dropdown-menu {
  position: absolute;
  float: none;
}
#navbarDropdown{
	display: inline-block;
	vertical-align:calc(200%);;
}
.dropdown-toggle::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: .255em;
  vertical-align: .255em;
  content: "";
  border-top: .3em solid;
  border-right: .3em solid transparent;
  border-bottom: 0;
  border-left: .3em solid transparent;
  }
.dropdown-menu {
  position: absolute;
  right: 10px;
  top:65px;
  z-index: 1000;
  float: left;
  min-width: 10rem;
  padding: .5rem 0;
  margin: .125rem 0 0;
  font-size: 1rem;
  color: #000;
  text-align: left;
  list-style: none;
  background-color: #FED601;
  background-clip: padding-box;
  border: 1px solid rgba(0,0,0,.15);
  border-radius: .25rem;
  }
  .dropdown-menu a{
  	color:#000;
  	display:block;
  	padding:10px;
  }
  .dropdown-item{display:block;}

/*** modal ***/
.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  display: none;
  overflow: hidden;
  outline: 0;
}
.modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: .3rem;
    outline: 0;
}
.modal-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #dee2e6;
    border-top-left-radius: calc(.3rem - 1px);
    border-top-right-radius: calc(.3rem - 1px);
}
.modal-title {
    margin: 0;
    line-height: 1.5;
    color: black;
    font-size: 1.5rem;
    font-weight: 400;
}
.modal-header button {
    font-size: 2rem;
    background: none;
    border: none;
    cursor: pointer;
}
.modal-body {
    padding: 1rem;
}
.modal-body h1 {
    margin-top: 0;
}
.show-modal.modal {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.modal-dialog{
	width:50%;
	margin:auto;
	box-shadow:5px 5px 5px rgb(0,0,0,0.5);
}
/**
Main container
*/
#main-container{
	display:grid;
	grid-template-columns: auto 1fr;
	height:calc(100vh - 76px);
}
#left-menu{
	grid-column:1;
	background-color:#FED601;
	height:100%;
}
#left-menu ul{
	padding:50px 20px;
	list-style-type : none;
	line-height:3em;
	font-size:14px;
	color:#000;
}
#left-menu h4{
	padding:20px 20px;
}
#left-menu > a{
	color:#000;
}
#right-content{
	padding:15px;
}
span.icon{
	vertical-align:middle;
}
span.icon svg{
	vertical-align:sub;
}

/**General
*/
.form-group {
  margin-bottom: 15px;
}
label {
	display: inline-block;
	max-width: 100%;
	margin-bottom: 5px;
	font-weight: 700;
}
.form-control {
	display: block;
	width: 100%;
	height: 34px;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
fieldset{
	border: 1px solid #DDD;
    padding: 15px;
}

input[type=number]{
	width:115px;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset;
}
#dropdown-user-menu{padding: 5px 30px;font-size:0.9em;left:-240px;background-color:#DDD;width:300px;line-height:3em}
.pluscircle {
 width: 31px;
height: 31px;
background: black;
border-radius: 50%;
text-align: center;
font-weight: bold;
color: white;
display: inline-block;
line-height: 29px;
font-size: 20px;
}


.red{
	color:Crimson;
}
.green{
	color:green;
}
.orange{
	color:DarkOrange;
}
.bold{
	font-weight:bold;
}
.h5{
	display: block;
	background-color: aliceblue;
	line-height: 2em;
	padding-left: 10px;
}
#error,#success,#registration_success,#registration_error{
color: white;
line-height: 2em;
padding: 5px;
text-align: center;
position:absolute;
width: 700px;
left:calc(50% - 350px);
z-index: 10;
}
#error{
	background-color:#dc3545 !important;
}
#success{
	background-color:#28a745 !important;
}
.pointer{
	cursor:pointer;
}

.blue-tooltip > .ui-tooltip-content,.ui-widget-content,.ui-tooltip.blue-tooltip{
    background: #42434a;
    color:white;
}
legend{font-size:1vw;}

#product_img:hover{
	cursor:pointer;
}
.dataTable-table tbody>tr:nth-child(odd){
	background-color:white;
}
.dataTable-table tbody>tr:nth-child(even){
	background-color:whitesmoke;
}
.dataTable-table thead>tr,.dataTable-table th{
	background-color:#000;
	color:white;
}
.btn{
	margin-top: 5px;
	margin-bottom: 5px;
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-image: none;
	border: 1px solid transparent;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color: transparent;
	border-radius: 4px;
}
.btn-primary{
	background-color:#FED601;
	color:#000;
}
.btn-black {
  background-color: #000;
  color: #FFF;
}
#loader{
	background-color:white;
	opacity:0.8;
	position:fixed;
	width:100%;
	height:100%;
	z-index:100000;
	display:none;
}
#spinner{
	width: 48px;
    height: 48px;
    border: 5px solid #000;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
    margin:10% 40%;
}   
@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
} 
/*********************************************** ADAPTATIVE DESIGN ***************************************************/

@media screen and (min-width: 1550px) {
}	
@media screen and (max-width: 1550px) {
	.navbar-default{height:100px;}
	.navbar-brand img{height:60px;}
}	
@media screen and (max-width: 1024px){
	.navbar-default{height:100px;}
	.navbar-brand img{height:60px;}
	.card-header {padding: 0rem .25rem;}
	#accordion #headingAdvanced{padding: .375rem 1.25rem;text-align:left}
	.burger-menu {
      display: inline-block;
    }
    #block-menu-2,#block-menu-3 {
	  display: none;
	  padding-right: 0 !important;
	}
	#block-menu-2 li,#disconnect-mitem{display:block !important;}
	#nav-toggle:checked ~ .menu-items {
	  display: grid;
	  grid-row-start: 2;
	  grid-auto-flow: row;
	  grid-template-columns: auto;
	}

}
@media only screen and (max-width: 815px) and (-Webkit-min-device-pixel-ratio: 1.5),
@media only screen and (max-width: 815px) and (-moz-min-device-pixel-ratio: 1.5),
@media only screen and (max-width: 815px) and (-o-min-device-pixel-ratio: 3/2),
@media only screen and (max-width: 815px) and (min-device-pixel-ratio: 1.5)
{
	.navbar-default{height:100px;}
	.navbar-brand img{height:60px;}
}
 /*tooltip  zoltantothcom /vanilla-js-tooltip */
 .b-tooltip{display:inline-block;font-size:.875em;padding:.75em;position:absolute;text-align:center}.b-tooltip-light{background:#eaeaea;background:linear-gradient(to bottom, #fdfdfd 0%, #eaeaea 100%);box-shadow:0px 0px 6px 2px rgba(110,110,110,0.4);color:#242424}.b-tooltip-dark{background:#242424;background:linear-gradient(to bottom, #6e6e6e 0%, #242424 100%);box-shadow:0px 0px 6px 2px #6e6e6e;color:#fff}.wrap{margin:0 auto;width:800px}