@font-face {
  font-family: 'Sergoe UI';
  src: url('../font/seguisym.ttf');
}

html {
position: relative;
width: 100%;
  height: 100%;
}
body {
background: #f8f8f8;
color: #393939;
font-family : 'sergoe UI';
font-size: 1.2rem;
line-height: 1.6rem;
margin: 0;
height: 100%;
}
#t-header {
height: 40px;
background: var(--theme-1);
position: relative;
z-index: 999;
padding:0;
-webkit-font-smoothing: antialiased;
position: fixed;
width: 100%;
}
#t-header .orders {
  position: fixed;
  width: 300px;
  height: 100%;
  right: -300px;
  -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12), 0 1px 3px 0 rgba(0,0,0,0.2);
  box-shadow: 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12), 0 1px 3px 0 rgba(0,0,0,0.2);
    -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  white-space: normal;
  background: var(--theme-2);
  top: 90px
}
#t-header .orders ul.list-orders {
  padding: 8px;
  list-style: none;
}
#t-header .orders ul.list-orders li.orders-item {
  background: #f6f9fd;
  padding: 12px;
  box-sizing: border-box;
  border-radius: 3px;
  margin-bottom: 5px;
  position: relative;
}
#t-header .orders ul.list-orders li.orders-item .xcontrol {
  position: absolute;
  right: 0;
  top: 0;;
  cursor: pointer;
  color: rgba(240, 52, 52, 0.7)

}
#t-header .orders ul.list-orders li.orders-item span.orders-msg {
  display: block;
  font-size: 13px;
}
#t-header .orders ul.list-orders li.orders-item span.orders-control a {
  width: 80px;
  height: 25px;
  text-align: center;
  line-height: 23px;
  left: 10px;
  border: 1px solid  var(--theme-1);
  border-radius: 5px;
  font-size: 13px;
  text-decoration: none;
  display: inline-block;
}
#t-header .orders ul.list-orders li.orders-item  .accordion {
  margin:  5px 0;
  font-size: 13px;
  
}
#t-header .t-header-controls{
width: 40px;
height: 40px;
line-height: 40px;
position: absolute;
text-align: center;
left: 0;
top: 0;
overflow: hidden;
cursor: pointer;
}
#t-header .t-header-controls:hover {
background: rgba(0,0,0,0.2);
}
#t-header .t-header-controls i {
font-size: 14px;
color: #fff;
}
#t-header .t-header-logo {
  margin-left: 40px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display:inline-block;
  font-size: 14px;
  font-weight: 400;
  line-height: 40px;
  white-space: nowrap;
  padding: 0 12px;
  vertical-align: middle;
  height: 40px;
color: #fff;
}

#t-header .t-header-navBar {
display: inline-block;
width: calc(100% - 200px);
position: absolute;
right: 0;
height: 40px;
line-height: 40px;
}
#t-header .t-header-navBar .t-header-ul-navBar {
position: absolute; 
 right: 0; 
height: 40px;
padding: 0;
list-style: none;
color: #fff;
font-size: 14px;
cursor: pointer;
}
#t-header .t-header-navBar .t-header-ul-navBar li.userPanel:hover {
background: rgba(0,0,0,0.2);
}

#t-header .t-header-navBar .t-header-ul-navBar li  {
height: 100%;
padding: 0 5px;
position: relative;
cursor: pointer;
display: inline-block;
  vertical-align: top;
  margin-left: -4px;
}
#t-header .t-header-navBar .t-header-ul-navBar li.cloche{
      height: 40px;
    min-height: 40px;
    min-width: 46px;
    padding: 0;
    margin-top: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
  display: inline-block
}
#t-header .t-header-navBar .t-header-ul-navBar li span.ic-cloche-content {
     border-radius: 50%;
    text-decoration: none;
    padding: 0;
    height: 30px;
    width: 30px;
    min-height: 30px;
    min-width: 30px;
    background-color: rgba(0,79,30,.4);
    margin: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  position: relative;
}
#t-header .t-header-navBar .t-header-ul-navBar li span.ic-cloche-content.eventClo {
  background: #fff;
  color: var(--theme-1);
}
#t-header .t-header-navBar .t-header-ul-navBar li span.ic-cloche-content.eventClo i {
  color: #fff;
}
#t-header .t-header-navBar .t-header-ul-navBar li span.ic-cloche-content font {
 position: absolute;
}
#t-header .t-header-navBar .t-header-ul-navBar li span.ic-cloche-content i {
    font-size: 11px;
    position: absolute;
    height: 15px;
    width: 15px;
    border-radius: 50%;
    line-height: 15px;
    top: -4px;
    right: -9px;
}


#t-header .t-header-navBar .t-header-ul-navBar  .li-navBar label.panel-user-label {
padding: 0 2px;
width: 60px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: top;
cursor: pointer;
}
#t-header .t-header-navBar .t-header-ul-navBar  .li-navBar .user-d-panel {
display: inline-block;
background: var(--theme-2);
width: 240px;
position: absolute;
right: 0;
top:40px;;
/*height: 155px;*/
}

#t-header .t-header-navBar .t-header-ul-navBar  .li-navBar .user-d-panel .d-panel-list{
padding:0;
list-style: none;
}
#t-header .t-header-navBar .t-header-ul-navBar  .li-navBar .user-d-panel .d-panel-list li {
width: 100%;
height: 35px;
  line-height: 35px;
}
#t-header .t-header-navBar .t-header-ul-navBar  .li-navBar .user-d-panel .d-panel-list li a {
display: inline-block;
width: 100%;
height: 100%;
color: #fff;
font-size: 14px;
}
#t-header .t-header-navBar .t-header-ul-navBar  .li-navBar .user-d-panel .d-panel-list li a i {
display: inline-block;
width: 30px;
text-align: center;
}
#t-header .t-header-navBar .t-header-ul-navBar  .li-navBar .user-d-panel .d-panel-list li a:hover {
  background : rgba(0,0,0,0.2);
}
.t-actived {
  background : rgba(0,0,0,0.2);
}

#t-section {
position: absolute;
margin-top: 40px;
width: 100%;
/*! background: red; */
height: 100%;
}
#t-section.sizeScreen .menu-controllers {
  width: 45px;
}
#t-section.sizeScreen .t-body {
  width: calc(100% - 45px);
  left: 45px;
}
#t-section.sizeScreen .t-body  .body-header {
  width: calc(100% - 45px)
}
#t-section .menu-controllers {
width: 200px;
height: 100%;
position: fixed;
left:0;
background: var(--theme-2);
}

#t-section .menu-controllers .menu-ul {
padding: 0;
list-style: none;
}
#t-section .menu-controllers .menu-ul .li-lenu-list {
width: 100%;
height: 35px;

}
#t-section .menu-controllers .menu-ul .li-lenu-list a {
width: 100%;
display: inline-block;
height: 100%;
color: #fff;
box-sizing: border-box;
font-size: 14px;
text-decoration: none;
line-height: 35px;
}
#t-section .menu-controllers .menu-ul .li-lenu-list a:hover{
background: var(--theme-1);
}
#t-section .menu-controllers .menu-ul .li-lenu-list a span {
display: inline-block;
vertical-align: top;
}
#t-section .menu-controllers .menu-ul .li-lenu-list a span.lll-ic {
width: 40px;
height: 100%;
text-align: center
}
#t-section .menu-controllers .menu-ul .li-lenu-list a span.lll-txt {
width: calc(100% - 50px);
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 100%;
}
#t-section .t-body {
width: calc(100% - 205px);
height: 100%;
position: relative;
vertical-align: top;
left: 200px;
}