@font-face {
    font-family: 'ProximaNovaRegular';
    src: url('../font/ProximaNovaCond-Regular.otf');
}

@font-face {
    font-family: 'ProximaNovaSemibold';
    src: url('../font/ProximaNovaCond-Semibold.otf');
}

@font-face {
    font-family: 'SolanoGothic';
    src: url('../font/SolanoGothicMVBProBd.otf');
}

body {
    position: relative;
    font-size: 10px;
    color: #3f3f3f;
    font-family: Arial, sans-serif;
    height: 100vh;
    background: #fff;
}

.dropdown-menu .dropdown-divider{
    margin:5px 0;
    height:1px;
    background: #ccc;
}

.btn-secondary {
    color: #292b2c;
    background-color: #fff;
    border-color: #ccc;
}

.return-link{
    color:#fff;
    font-size: 1.2em;
}

.main_content_header.mod_caisse{
    border-bottom:1px solid #c4c4c4;
    margin-bottom:20px;
}

.connected .nav-left ul a{
    transition: all 0.3s ease;
}

.connected .nav-left ul a:hover{
    color:#3a83bf;
    text-decoration: none;
}

.tab-content{
    display:none;
}

.tabs-inner{
    display: block;
    padding:10px 0;
    margin: 0 20px;
    float:left;
    font-size: 1.2em;
    border-bottom:4px solid #fff;
    font-weight: bold;
    background:#fff;
    transition: all 0.3s ease;
}

.tabs-inner:first-child{
    margin-left:0;
}

a.tabs-inner{
    color:#333;
}

a.tabs-inner:hover{
    color:#3a83bf;
}

a.tabs-inner:hover,a.tabs-inner:active,a.tabs-inner:focus{
    text-decoration: none;
    border-bottom:4px solid #3a83bf;
}

.tabs-inner.active{
    color:#3a83bf;
    border-bottom:4px solid #3a83bf;
}

/* Table scrollable */
.table-wrapper{
    overflow-x:auto;
    width:100%;
}

.table-wrapper table{
    width:100%;
}

.table-wrapper table tr td,
.table-wrapper table tr td *,
.table-wrapper table tr th,
.table-wrapper table tr th *{
    white-space: nowrap;
}


.dataform .lbl span.more-info{
    font-size: 18px;
    color:#3a83bf;
    display: inline-block;
    vertical-align: bottom;
}

.input-group{
    height:34px;
}

.main_content{
    width: 100%;
}

.main_content_inner{
    /*overflow:scroll;*/
}

#main_notification_succes_msg.notification.note-success,#main_notification_error_msg.notification.note-error{
    display:none;
    position:absolute;
    bottom:55px;
    margin:0;
    right:0;
    height:44px;
}
#main_notification_succes_msg.notification.note-success p,#main_notification_error_msg.notification.note-error p{
    text-align: right;
}

.mobile-sms-logo{
    height:40px;
    margin:10px auto;
    position: absolute;
    left:0;
    right:0;
    top:0;
    text-align: center;
}

.mobile-sms-logo img{
    height:100%;
}

html body p, html body h1, html body h2, html body h3, html body h4, html body h5, html body h6, html body ul li, html body input, html body select, html body textarea, html body a {
    margin: 0;
    padding: 0;
    font-weight: 400;
    font-size: 1em;
    line-height: 1em;
}

html body * {
    outline: none !important;
}

html body ul {
    margin: 0;
    padding: 0;
}

html body ul li {
    list-style: none;
}

html body a img {
    border: none;
}

.group:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
}

.no-data-result{
    font-size: 1.2em;
}

.container-form-element {
    display: block;
    margin: 0 0 15px 0;
    text-align: left;
}

/* breadcrumb */
#breadcrumb {
    display : block;
    font-weight : 600;
    display: none;
}
#breadcrumb ul {
    font-family : Helvetica, sans-serif;
    list-style : none;
    margin-left:5px;
    margin-bottom:20px;
    height:30px;
}
.crumbs,.crumbs li {
    display : block;
}

.crumbs li{
    float : left;
}

.crumbs li.first {
    padding-left : 8px;
}
.crumbs li a, .crumbs li a:link, .crumbs li a:visited {
    color : #616d7e;
    display : block;
    font-size : 12px;
    margin-left : -13px;
    padding : 9px 17px 9px 25px;
    position : relative;
    text-decoration : none;
}
.crumbs li a {
    background-image : url(../images/bg-crumbs.png);
    background-position : 100% 0%;
    background-repeat : no-repeat;
    position : relative;
}
.crumbs li a:hover {
    background-position : 100% -48px;
    color : #333;
    cursor : pointer;
}
.crumbs li a.active {
    background-position : 100% -96px;
    color : #333;
}
.crumbs li.first a span {
    border-left : 1px solid #d9d9d9;
    height : 29px;
    left : 0;
    position : absolute;
    top : 0;
    width : 3px;
}
/*#######*/


.popup-title{
    margin: 0px;
    font-size: 16px;
    font-weight: bold;
    color: #000000;
    text-align: left;
    margin-bottom:20px;
}

input[type=checkbox]{
    width:25px;
    margin:0 auto;
}

.container-form-element input:not([type="submit"]), .container-form-element select, .container-form-element textarea,table tr td input,table tr td select {
    display: block;
    width: 100%;
    height: 30px;
    border: 2px solid #ddd;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
    padding: 0 5px;
    font-size: 1.2em;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    text-shadow: none;
    box-shadow: none;
    background-color: #ffffff;
}

.qsearch select,.qsearch input,.quick_finder select,.quick_finder input{
    display: inline-block;
    width: 30%;
    height: 34px;
    border: 2px solid #ddd;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    text-shadow: none;
    box-shadow: none;
    background-color: #ffffff;
    max-width:150px;
    margin:0px 5px;
}

.qsearch select{
    font-size: 1.2em;
    padding-left:10px;
    max-width:80px;
}

.qsearch input{
    margin-right:20px;
}

.qsearch .button{
    float: right;
    font-size: 1em;
}

.main_content_inner .main_content_body .qsearch{
    margin-bottom:20px;
}

.no-data-result{}

.quick_finder .result{
    top:36px;
    max-width:800px;
}

.stylish-input-group .input-group-addon{
    background: white !important;
}
.stylish-input-group .form-control{
    border-right:0;
    box-shadow:0 0 0;
    border-color:#ccc;
}
.stylish-input-group button{
    border:0;
    background:transparent;
}

.quick_finder .result table{
    min-width:100%;
}

.quick_finder{
    margin: 10px 0;
}

.container-form-element .link-under-input {
    display: inline-block;
    line-height: 1em;
    font-weight: 700;
    color: #bbb;
    padding: 0;
    margin: 2px 0 0 0;
    border-bottom: dotted 1px #bbb;
}

.container-form-element label {
    margin-bottom: 5px;
}

.container-form-element input:not([type="submit"]):disabled, .container-form-element select:disabled, .container-form-element textarea:disabled {
    background-color: #f0f0f0;
    color: #666;
}

/*.container-form-element.submit-bottom-page {*/
    /*margin-top: 30px;*/
    /*border-top: 1px solid #ccc;*/
/*}*/

.container-form-element .link-under-input.blue {
    color: #3a83bf;
    border-bottom: dotted 1px #3a83bf;
    margin-top:10px;
}

.container-form-element .container-submit {
    margin-top: 30px;
}

.nav-left {
    background-color: #202020;
    left: -100%;
    width: 100%;
    top: 60px;
    bottom: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    padding: 0 12px;
    position: fixed;
    height: 100%;
    z-index: 1001;
    overflow-y: scroll;
}

.nav-left .container-link {
    padding: 20px 10px 20px 0;
    border-top: 1px solid #494952;
    /*border-bottom: 1px solid #494952;*/
}

.nav-left .container-link.first {
    padding-top: 0;
    padding-bottom: 0;
    border-bottom: none;
    overflow: hidden;

}

.nav-left .container-text {
    margin: 25px 0 15px;
}

.nav-left .container-btn {
    margin: 25px 0 15px;
}

.connected .nav-left ul svg path, .connected .nav-left ul svg circle, .connected .nav-left ul svg polygon, .connected .nav-left ul svg rect {
    fill: #f0f0f0;
}

.connected .nav-left ul svg path, .connected .nav-left ul svg circle, .connected .nav-left ul svg polygon {
    fill: #f0f0f0;
}

.connected .nav-left ul li.active svg path, .connected .nav-left ul li.active svg circle, .connected .nav-left ul li.active svg polygon, .connected .nav-left ul li.active svg rect {
    fill: #202020;
}

.connected .nav-left ul li.active svg path {
    fill: #202020;
}

.separation-menu {
    height: 1px;
    width: 100%;
    background: #494952;
    margin: 25px 0 0 0;
}

.nav-left .profil-box.disabled {
    cursor: not-allowed;
}

.nav-left .profil-box {
    display: block;
    margin-bottom: 15px;
}

.connected .nav-left ul li.active a {
    background: #ffffff;
    -webkit-border-radius: 3px 0 0 3px;
    -moz-border-radius: 3px 0 0 3px;
    -ms-border-radius: 3px 0 0 3px;
    border-radius: 3px 0 0 3px;
    color: #202020;
}

.connected .nav-left ul a {
    color: #f0f0f0;
}

.nav-left .profil-box figure {
    width: 32px;
    height: 32px;
    margin-right: 12px;
    overflow: hidden;
}

.nav-left .profil-box .profil-info {
    position: relative;
    width: calc(100% - 44px);
    padding-right: 20px;
}

.nav-left .profil-box .profil-info p.name {
    margin-top: 2px;
    font-size: 1.4em;
    color: #3a83bf;
    font-weight: 300;
    text-transform: none;
}

.nav-left .profil-box figure, .nav-left .profil-box .profil-info {
    display: inline-block;
    vertical-align: top;
}

.nav-left .profil-box figure, .nav-left .profil-box .profil-info {
    display: inline-block;
    vertical-align: top;
}

.nav-left .profil-box .profil-info {
    position: relative;
    width: calc(100% - 44px);
    padding-right: 20px;
}

.nav-left .profil-box figure, .nav-left .profil-box .profil-info {
    display: inline-block;
    vertical-align: top;
}

.nav-left ul svg {
    margin-right: 10px;
    display: inline-block;
    vertical-align: middle;
}

.nav-left ul a span {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 34px);
    height: 30px;
}

.nav-left .profil-box .profil-info p {
    font-size: 1em;
    color: #666;
    text-transform: uppercase;
    font-weight: 700;
}

.nav-left ul li.submenu a:before {
    content: "\e928";
    display: block;
    position: absolute;
    font: normal normal normal 16px/1 'Nucleo Mini';
    color: #ddd;
    font-size: 0.8em;
    right: 22px;
    top: 10px;
}

.nav-left ul li.submenu.open a:before{
    content: "\e926";
}

.nav-left ul li.submenu ul li a:before{
    display: none;
}

ul li.submenu ul{
    height: 0;
    opacity: 0;
    overflow: hidden;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

ul li.submenu.open ul{
    height: auto;
    opacity: 1;
    overflow: visible;
}

ul li.submenu ul li{
    padding-left:10px;
    height:32px;
    overflow:hidden;
}

.nav-left ul a {
    display: block;
    position: relative;
    color: #3f3f3f;
    height: 30px;
    line-height: 30px;
    margin: 5px -22px 0 0;
    font-size: 1.2em;
    padding: 0;
    font-weight: 400;
}

.nav-left .container-text p {
    font-size: 1.2em;
    color: #ffffff;
    margin-bottom: 20px;
}

.nav-left .container-btn .grey-btn {
    margin-bottom: 10px;
}

.nav-bot {
    width: 100%;
    height: 50px;
    background: #fff;
    margin-left: 240px;
    line-height:50px;
    position: fixed;
    bottom: 0;
    z-index: 1000;
    font-size:1.6em;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.nav-bot.not-connected {
    margin: 0;
}

.nav-bot span a.active {
    color: #3f3f3f;
    font-weight: bold;
}

.nav-bot span a {
    color: #878787;
    line-height: 30px;
    display: inline-block;
    margin-left: 20px;
}

.container-box {
    width: 100%;
    text-align: center;
    background-color: transparent;
    padding: 20px 20px 50px 20px;
    font-size:1.4em;
}

.container-box .inner-box {
    background-color: #ffffff;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    padding: 10px 20px 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    border-radius: 20px;
}

.container-box .inner-box h1 {
    color: #3a83bf;
    margin-bottom: 20px;
    padding: 0;
    text-align: center;
    font-weight: normal;
    font-size: 3em;
    line-height: 1em;
}

.custom-form-info-wrapper .custom-form-info.bottom {
    margin-bottom: 20px;
}

.custom-form-info-wrapper .custom-form-info.light {
    font-weight: normal;
}

.custom-form-info-wrapper .custom-form-info {
    font-weight: bold;
}

/* CONTENT */
html body .content {
    background-color: #ffffff;
    overflow: auto;
    margin-top:60px;
    box-sizing: border-box;
    padding: 40px 20px;
}

html body .content-inner {
    /*max-width: 94%;*/
    max-width:1260px;
    margin: 0 auto;
}

.content-inner h1 {
    position: relative;
    font-size: 2.6em;
    margin: 0 0 30px 0;
    padding: 0 0 0 52px;
    color: #323232;
    font-weight: 400;
    padding-top:10px;
}

.btn-group.caisse-nav{
    float:right;
}

.btn-group.caisse-nav .btn{
    padding:4px 25px;
    font-size:16px;
}

.btn-group.caisse-nav .dropdown-menu{
    right:0;
    left:auto;
}

.content-inner h1 .title-icon {
    position: absolute;
    left: 0;
    top: 9px;
    width: 32px;
    display: inline-block;
    color: #3a83bf;
    font-size: 1em;
}

li a.link .title-icon{
    position:relative;
    width:16px;
    height:16px;
    margin-right:10px;
    display: inline-block;
    vertical-align: middle;
}


.btn-custom {
    display: block;
    height: 36px;
    padding: 8px 30px;
    font-weight: 400;
    font-size: 1em;
    /*line-height: 20px;*/
    width: 100%;
    background-color: #3a83bf;
    color: #ffffff;
    text-align: center;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    border: none;
    box-shadow: none;
    text-shadow: none;
}

.button{
    display: inline-block;
    height: 34px;
    padding: 8px 15px;
    font-weight: 400;
    font-size: 1.2em;
    line-height: 18px;
    background-image:none;
    color: #ffffff;
    text-align: center;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    border: none;
    box-shadow: none;
    text-shadow: none;
}

.main_content_inner .main_content_header div .btn-group .button{
    float:left;
    margin-top:0;
    height:34px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.main_content_inner .main_content_header div .btn-group{
    float:right;
    margin-top:10px;
}

.btn-primary{
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.btn-primary:hover{
    border-color: #286090;
}


.button_blue {
    background-color: #3a83bf;
}

.button_red:hover {
    text-decoration: none;
    color:#fff;
}

.button_black {
    background-color: #3f3f3f;
}

.button_blue:hover{
    background-color: #216AA6;
    text-decoration: none;
    color:#fff;
}

.button_black:hover {
    background-color: #202020;
    text-decoration: none;
    color:#fff;
}

.button_black:focus,.button_blue:focus,.button_red:focus{
    color:#fff;
    text-decoration: none;
}


.nav-top {
    display: block;
    position: fixed;
    width: 100%;
    z-index: 1000;
    background-color: #202020;
    height: 60px;
    top:0;
}

#top-left-menu-btn {
    height: 60px;
    width: 56px;
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    left:0;
    z-index: 1;
}

#top-left-menu-btn div {
    width: 16px;
    height: 16px;
    margin: 22px 20px;
    position: relative;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    cursor: pointer;
}

#top-left-menu-btn div span {
    display: block;
    position: absolute;
    height: 2px;
    width: 55%;
    background: #ddd;
    opacity: 1;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.nav-left.open {
    left: 0;
}

#top-left-menu-btn div span:nth-child(1), #top-left-menu-btn div span:nth-child(2) {
    top: 0;
}

#top-left-menu-btn div span:nth-child(1), #top-left-menu-btn div span:nth-child(2) {
    top: 0;
}

#top-left-menu-btn div span:nth-child(3), #top-left-menu-btn div span:nth-child(4) {
    top: 6px;
}

#top-left-menu-btn div span:nth-child(5), #top-left-menu-btn div span:nth-child(6) {
    top: 12px;
}

#top-left-menu-btn div span:nth-child(odd) {
    left: 0;
    border-radius: 1px 0 0 1px;
}

#top-left-menu-btn div span:nth-child(even) {
    left: 50%;
    border-radius: 0 1px 1px 0;
}

.footer-wrapper {
    background: #202020;
    z-index: 1002;
    display: none;
}

.dataform {
    table-layout: fixed;
    width: 100%;
    position: relative;
}

.datatable{
    display:table;
}

table tr.head td{
    padding:10px;
}

table.dataform tr{
    font-size:0;
}

table.dataform tr:last-child{
    border-bottom:none;
}

#std_search table.dataform tr{
    border:none;
}

#std_search .dataform td,.main_content_inner .main_content_body .detail_search .dataform td {
    padding:2px 0;
}

table tr td{
    font-size:1em;
}

.dataform .head td{
    display:block;
    float:left;
}

.dataform .data_full{
    width:100%;
    display: block;
}

.dataform tr,
.dataform tr td.lbl,
.dataform tr td.data_small,
.dataform tr td.data_large,
.dataform tr td.data,
.dataform .title_bar td,
.dataform .subtitle_bar td {
    width: 100%;
    display: block;
    clear: both;
    box-sizing: border-box;
}

.dataform .datatable tr {
    width: 100%;
    display: table-row;
}

.dataform .datatable .head td{
    display:table-cell;
    float:none;
}

/* Tooltip */
.tooltip.in{opacity:1!important;}

.tooltip > .tooltip-inner {
    background-color: #fff;
    color: #414141;
    border: 2px solid #414141;
    font-size: 11px;
    line-height: 16px;
    font-weight: bold;
    text-align: left;
    max-width: 350px;
    word-wrap: break-word;
    white-space: pre-line;
}
/* Tooltip on top */
.tooltip.top > .tooltip-arrow {
    border-top: 5px solid #414141;
}

.tooltip.right > .tooltip-arrow {
    border-right: 5px solid #414141;
}

a.caisse-option{
    font-size: 1.4em;
    display: block;
}

a.caisse-option.first{
    margin-top:10px;
}

hr{
    border-top: 1px solid #ddd;
}

.qsearch .icon-export{
    float:right;
    height:24px;
    width:24px;
    position:relative;
    top:10px;
}

.main_content_header .dropdown-menu{
    right:0;
    left:auto;
}

.notification{
    margin:20px 0;
    box-sizing: border-box;
    transition: all 0.4s ease;
    text-shadow: none;
    box-shadow: none;
    background-color: #FFF;
    padding: 12px;
    background-image: none;
    border-radius: 0;
    display: block;
}


.notification.note-success{
    border: 2px solid #5cb85c;
}

.notification.note-attention{
    border: 2px solid #f0ad4e;
}

.notification.note-error{
    border: 2px solid #c02544;
    margin:20px 0;
}

.notification.note-info{
    border: 2px solid #3a83bf;
}

.notification p{
    font-weight: bold;
    font-size: 1.1em;
    text-align: left;
    padding: 0;
}

.datepicker {
    border-radius: revert;
}

.section-active{
    color:#3a83bf;
}

.dataform tr td.data,.dataform tr td.lbl{
    clear:none;
    float:left;
}

.dataform .spacer{
    /*width:40%;*/
}

.dataform .primary-text,.datatable .primary-text{
    color:#3a83bf;
    font-weight: bold;
}


@media only screen and (min-width: 480px) {

}

@media only screen and (min-width: 610px) {
    .container-box {
        padding: 20px 0 50px 0;
    }
    html body{
        font-size:12px;
    }
}

@media only screen and (min-width: 768px) {

    .container-box .inner-box {
        padding: 30px 60px;
    }

    /*.container-form-element.submit-bottom-page {*/
        /*margin-top: 42px;*/
    /*}*/

    /*.container-form-element .container-submit {*/
        /*margin-top: 42px;*/
    /*}*/
}

@media only screen and (min-width: 992px) {
    html body .content {
        padding-left: 260px;
        padding-right:20px;
    }

    .dataform td,.dataform tr{
        padding:0;
    }

    .dataform td.lbl {
        padding:10px;
        border:none;
    }

    .dataform td.data {
        border:none;
    }

    .dataform tr {
        border-bottom: 1px solid #ddd;
    }

    .dataform.options-list td.lbl{
        border:none;
    }


    .container-box {
        padding: 80px 80px 80px 320px;
    }

    .container-box.not-connected {
        padding: 80px;
    }

    .nav-bot.not-connected {
        margin: 0;
    }

    .nav-left {
        left: 0;
        top: 0;
    }

    .nav-top {
        display: none;
    }

    .dataform {
        display: table;
    }

    .dataform tr td.lbl {
        width: 20%;
        clear: none;
        box-sizing: border-box;
        display: inline-block;
        float:none;
    }

    .dataform tr td.data.data_small, .dataform tr td.data{
        width: 30%;
        clear: none;
        box-sizing: border-box;
        display: inline-block;
        float:none;
    }

    .dataform tr td.data.data_large,.dataform tr td.data{
        width: 80%;
        clear: none;
        box-sizing: border-box;
        display: inline-block;
        float:none;
    }

    .footer-wrapper{
        display:block;
    }

    html body .content{
        margin-top:0;
    }

    .nav-left {
        width: 240px;
    }

    .button{
        padding:8px 30px;
    }
}

@media only screen and (min-width: 768px) {

    #breadcrumb {
        display: block;
    }
}

@media print {
    body {
        overflow: auto !important;
        height: initial !important;
    }
    html body .content {
        height: 100% !important;
    }
    html body .button {
        display: none !important;
    }
    html body a[href]:after {
        content: none
        !important;
    }
    html body img[src]:after {
        content: none !important;
    }
    html body .tab-content {
        display: block !important;
    }
}

.a_button {
    cursor: pointer;
}