body {
	--color-primary: #2E2925; /* HSL(27, 11%, 16%);  #2E2925 */ 
	--color-primary-80: HSL(27, 11%, 25%); /* l = -0.94 x pourcentage de la charte + 100 */
	--color-primary-40: HSL(27, 11%, 62%); /* l = -0.94 x pourcentage de la charte + 100 */
	--color-primary-20: HSL(27, 11%, 81%); /* l = -0.94 x pourcentage de la charte + 100 */
	--color-secondary: #2D770C;
	--color-secondary-20: hsl(101deg 38% 90%); // #2D770C; 
}

.bg-fit-content {
	padding: 2px 15px 2px 15px;
	width: fit-content;
}

.bg-primary {
	background-color: var(--color-primary);
	color: white;
}
.bg-primary-80 {
	background-color: var(--color-primary-80);
	color: white;
}
.bg-primary-40 {
	background-color: var(--color-primary-40);
	color: white;
}
.bg-secondary {
	background-color: var(--color-secondary);
}
.bg-secondary-20 {
	background-color: var(--color-secondary-20);
}
.bigger {
	transform: scale(1.5);
}
div [contenteditable="true"] {
	font-size: 1.1em;
}

/*
h3 {
	font-size: 2em;
}

*/
h3 .legend {
	font-size: small;
	top: -1.5em;
	position: relative;	
}

h3 .legend::before {
	content: "\A";
	white-space: pre;	
}

input[type="file"] { /* attention pour tout input de type file, il faut un label avec la classe file */
	display: none;
}

input[type="checkbox"] {
	margin-right: 4px;
}

label.file {
    cursor: pointer;
    color: #337ab7;	
	font-weight: normal;
}

label.file:hover {
    color: #25a5c4;	
}

select.selectdesign option[value*="design"]{
    color: #7fabd5; -- #01aac7;
}

select.selectversion option[value*="version"]{
    font-weight: bold;
}

select.selectversion option[value*="draft"]{
    color: darkgrey;
}

#loading-bar .bar {
	height: 10px;
	color: #e31b1b;
}

.bg {
	background: #FFFFF5 ;
}

.btn, .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
	outline: none;
}

.btn-default.active, .btn-default.active:focus, .btn-default.active:hover {
	background-color: #007deb52;
	background-color: #7fabd5;
}

.btn-primary  {
	background-color: var(--color-primary); // #2e2925;
	background-image: none;
}

.btn-primary:disabled  {
	background-color: var(--color-primary-20); // #2e2925;
	background-image: none;
}

.btn-primary.notactive  {
	background-color: #c7c4c2;
	background-image: none;
}

.col-xs-05, .col-sm-05, .col-md-05, .col-lg-05, .col-xs-6m, .col-sm-6m, .col-md-6m, .col-lg-6m, .col-xs-115, .col-sm-115, .col-md-115, .col-lg-115 {
  position: relative;
  min-height: 1px;
 
  padding-right: 15px;
  padding-left: 15px;
  
}

.col-xs-05, .col-xs-6m, .col-xs-115 {
	float: left;
}

.col-xs-05  {
	width: 4.16666%;
}

.col-xs-6m {
	width: 45%;
}

.col-xs-115 {
	width: 91.6666667%;
}

.col-xs-12 {
	min-height: 0px;
}

#controles label {
	margin-bottom: 0;
    margin-top: 4px;
    vertical-align: text-bottom;
	font-weight: normal;
}

@media (min-width: 768px) {
	.col-sm-05, .col-sm-6m, .col-sm-115 {
		float: left;
	}

	.col-sm-05  {
		width: 4.16666%;
	}

	.col-sm-6m {
		width: 45%;
	}

	.col-sm-115 {
		width: 91.6666667%;
	}
}

@media (min-width: 992px) {
	.col-md-05, .col-md-6m, .col-md-115 {
		float: left;
	}

	.col-md-05  {
		width: 4.16666%;
	}

	.col-md-6m {
		width: 45%;
	}

	.col-md-115 {
		width: 91.6666667%;
	}
}

@media (min-width: 1200px) {
	.col-lg-05, .col-lg-6m, .col-lg-115 {
		float: left;
	}

	.col-lg-05  {
		width: 4.16666%;
	}

	.col-lg-6m {
		width: 45%;
	}

	.col-lg-115 {
		width: 91.6666667%;
	}
}

@media print{
	@page {
	  left: 0px;   
	}
	.noprint{
		display:none ;
	}
}
		
.colorTransparent {
	color: #00000000 !important;
	background: #FFFFFF55 !important;
	border: 0px !important;
}
.inputSelected {
    /* background: #f5d8bb;*/
    /* font-weight: bold; */
	color: red;
}

.comment {
	font-style: italic;
}

.danger {
	color: red;
	font-weight: bold;
}

.disabled {
	cursor: not-allowed;
}

.dropdown-menu {
	/* left: auto; */
	top: auto;
}
.dropdown-submenu{position:relative;}
.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:-1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
.dropdown-submenu:hover>.dropdown-menu{display:block;}
.dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#cccccc;margin-top:5px;margin-right:-10px;}
.dropdown-submenu:hover>a:after{border-left-color:#ffffff;}
.dropdown-submenu.pull-left{float:none;}.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;}

.fit-content {
	width: fit-content;
	width: -moz-fit-content;
	margin: auto;
}

.flgLabel0 {
	font-size: 1em;
	color: #9da0a480; 
	cursor: pointer;
}

.flgLabel1 {
	font-size: 1em;
	colo: #5d544b;
	cursor: pointer;
}

.greyTitle {
	font-size: 30px;
	color:	aliceblue;
	background-color: grey;
	text-align: center;
	margin-bottom: 15px;
}

.has-error, input.ng-invalid{
    border-color: #a94442 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !important;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !important;
    color: #a94442 !important;
    font-weight: bold !important;
	border: solid 1px !important;
}

.input80 {
	width: calc(100% - 20px);
	border: solid 1px lightblue;
}

.input100 {
	width: 100%;
	border: solid 1px lightblue;
	padding-left: 5px;
}

.lighter {
	box-shadow: inset 0 0 100px 100px rgb(255 255 255 / 25%);
}

.link,.link2 {
	cursor: pointer;
}

.link:hover {
	transform: scale(1.05);
	box-shadow: 10px 5px 5px grey;
}

.mb-tooltip {
	position: relative;
}

.menImgItemSelected {
	background: lightblue;
}


.noBorder input {
	border: 0px;
	margin-top: 1px;
	margin-bottom: 1px;
}

.noScroll {
	position: relative; 
	background-color: white; 
	z-index: 1
}

.noSelectCaret {
	-webkit-appearance: textarea;
    padding-left: 5px;
    padding-right: 5px;	
}

.noMarginTop {
	margin-top: 0px;
}

.nowrap {
	white-space: nowrap;
}

.placeholder {
	color: #999;
	padding-left: 5px;
}

.pointer {
	cursor: pointer;
}

.pointer:hover {
	font-weight: bold;
}

/* Charte MODBLOC */
.primaryBox {
	background: #2E2925;
	color: white;
	font-weight: bold;
}

.rubrique {
	background: lightblue
}

.scan {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: red;
	z-index: 100;
}

/* customization multiple-selection.js */
.selected {
	border: 1.75px dotted #2E2925;
	/*opacity: 1;
	background: grey !important;*/
	filter: brightness(80%);
}
.selecting {
	border: 1.75px dotted #2E2925;
	/*opacity: 1;
	background: grey !important;*/
	filter: brightness(80%);
}
.select-helper {
	position: absolute;
	border: 1px dashed red;
	background: none;
	opacity: 1;
}

.sorted {
	font-style: italic;
}

.spacerNavBar {
	height: 50px;
}

.standby {
	color: darkgrey;
}

.strong {
	font-weight: bold;
}

.tag-select {
	font-size: 75%;
	border-width: 0px;
	max-width: 50px;
}

.tag-control {
	height: auto;
}

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: #E8E8FF;
}
.table-xtra-condensed > thead > tr > th,
.table-xtra-condensed > tbody > tr > th,
.table-xtra-condensed > tfoot > tr > th,
.table-xtra-condensed > tr > th,
.table-xtra-condensed > thead > tr > td,
.table-xtra-condensed > tbody > tr > td,
.table-xtra-condensed > tfoot > tr > td,
.table-xtra-condensed > tr > td {
  padding: 5px;
  white-space: nowrap;
  font-size: 1em;
}

.tdAmount {
	text-align: right;
	white-space: nowrap;
}

.tdAmount input {
	text-align: right;
	white-space: nowrap;
}

.thumbnail {
	overflow: hidden;
	transition: all .2s ease-in-out;
	position: relative;
}



.thumbnail.link:hover {

}

.tool .littlefield[type="number"] {
    max-width: 50px;
	max-height: 2em;
    font-size: x-small;
	padding-right: 0px;
	padding-left: 5px;
	padding-bottom: 5px;
	text-align: right;
}

.tool label {
	font-size: 0.9em;
}

.tooltip-inner {
	max-width: none;
}
/* *** */ 


/* CSS used here will be applied after bootstrap.css */
@media only screen and (min-width : 481px) {
    .row.equal-height {
        display: flex;
        flex-wrap: wrap;
    }
    .row.equal-height > [class*='col-'] {
        display: flex;
        flex-direction: column;
    }
    .row.equal-height.row:after,
    .row.equal-height.row:before {
        display: flex;
    }

    .row.equal-height > [class*='col-'] > .thumbnail,
    .row.equal-height > [class*='col-'] > .thumbnail > .caption {
        display: flex;
        flex: 1 0 auto;
        flex-direction: column;
    }
    .row.equal-height > [class*='col-'] > .thumbnail > .caption > .flex-text {
        flex-grow: 1;
    }
	
    .row.equal-height > [class*='col-'] > .thumbnail > img {
        width: 100%;
        height: 200px; /* force image's height */

        /* force image fit inside it's "box" */
        -webkit-object-fit: cover;
           -moz-object-fit: cover;
            -ms-object-fit: cover;
             -o-object-fit: cover;
                object-fit: cover;
				
		border:	solid #2D770C 2px;
    }
    .row.equal-height > .sm > .thumbnail > img {
		height: 150px; /* force image's height */
	}
    .row.equal-height > .sm > .thumbnail {
		font-size: 0.9em;
	}

}

    .row.equal-height > .sm > .thumbnail > .smCircle {
		width: 36px;
		height: 36px;
	}
	.smCircle {
		position:absolute;
		width: 40px;
		height: 40px;
		top: 10px;
		background-color: rgba(250,250,250,0.9);
		border-radius: 50%;
		text-align: center;
		font-size: 2em;
	}
	
	.EasyblocOnly, .ModblocOnly {
		display: none;
	}

	/* specific CSS MODBLOC */
	.Modbloc.thumb-col, .Modbloc .thumb-col{
		background: #2e2925;	/* Modbloc	#2e2925; 	Easybloc	#606060*/
	}
	.Modbloc.back-col, .Modbloc .back-col{
		background: #94887A;	/* Modbloc	#94887A 	Easybloc	#ffffff*/
	}
	.Modbloc.back2-col, .Modbloc .back2-col{
		background: #766B5F;	/* Modbloc 	#766B5F 	Easybloc 	#ffffff*/	
	}	
	.Modbloc.back3-col, .Modbloc .back3-col{
		background: #2e2925;	/* Modbloc 	#2e2925 	Easybloc 	#ffffff*/	
		color: #FFFFFF;	
	}
	.Modbloc .ModblocOnly {
		display: inherit;
	}
	
	/* specific CSS EASYBLOC */
	.Easybloc.thumb-col, .Easybloc .thumb-col{
		background: #606060;	/* Modbloc	#2e2925; 	Easybloc	#606060*/
	}
	.Easybloc.back-col, .Easybloc .back-col{
		background: #ffffff;	/* Modbloc	#94887A 	Easybloc	#ffffff*/
	}
	.Easybloc.back2-col, .Easybloc .back2-col{
		background: #ffffff;	/* Modbloc 	#766B5F 	Easybloc 	#ffffff*/	
	}
	.Easybloc.back3-col, .Easybloc .back3-col{
		background: #ffffff;	/* Modbloc 	#2e2925 	Easybloc 	#ffffff*/	
		color: #000000;	/* Modbloc 	#2e2925 	Easybloc 	#ffffff*/	
	}
	.Easybloc .EasyblocOnly {
		display: inherit;
	}