/* WEB SITE STYLES */
.wp { font-size: 16px; font-weight: 300; }
.wl { font-weight: 100; }
.wtshadow { text-shadow: 1px 1px 4px black; }
.wcl1 {background-color: rgba(80, 80, 90, 1); color: white !important; padding: 5px 15px; border-radius: 5px;}
.wcl2 {background-color: rgba(165, 165, 185, 1); color: rgba(35,35,55,1) !important; padding: 5px 15px; border-radius: 5px;}
.wcl7 {background-color: rgba(230, 230, 240, 1); color: rgba(80,80,80,1); padding: 5px 15px; border-radius: 5px;}
.wbtn1 {background-color: rgba(32, 32, 32, 1); color: white !important; padding: 5px 15px; border-radius: 5px; border:1px solid black;}



html { 	-webkit-font-smoothing: subpixel-antialiased; }
icnavbar { position: fixed; top: 0px; min-width:240px; height: 100%; z-index: 10; color: white; background-color: rgba(91, 89, 89, 1); overflow-y: scroll; box-shadow: 0px 0px 10px rgba(91, 89, 89, 1); }
body { -webkit-overflow-scrolling: touch; }
icheaderbar { position: fixed; top:0px; left:0px;	right: 0px; height: 41px; z-index: 100; background-color: rgba(48, 46, 45, 1); color: rgba(205,205,199,1); overflow: hidden; }
.nbright {right:0px;}
.nbleft {left:0px;}
#workbody { position: absolute; top:70px; width:100%; background-color: rgba(230,230,230,1); color: rgba(131,130,114,1); }
/* .undertopbar {top:70px; height: 100%} */
#worktitlebar { background-color: rgba(181,180,170,1); color: rgba(48, 46, 45, 0.75); overflow: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.icbutton { 
	background-color: transparent; 
	border: 1px solid rgba(184, 183, 174, 1); 
	border-radius: 3px; 
	color:rgba(110, 107, 107, 0.85);
	font-family: 'Oswald', sans-serif; 
	padding:0px 8px;
	margin: 2px;
	min-height:28px;
	line-height:28px;
	vertical-align: middle;
	display: inline-block;
}
.bcounters { 
	height: 18px; line-height: 18px; 
	padding: 0px 5px; 
	border-radius: 9px; 
	background-color: rgba(255,  0,  0, 0.8); color: white; font-size: 10px;
	font-weight: bold;
}

.nbmenuitem { padding: 6px 20px; margin-bottom: 10px; font-size: 18px; border-radius: 3px; background-color: rgba(106, 101, 101, 1); cursor: pointer; font-family: 'Oswald', sans-serif; }
.nbmenuitem:hover {	background-color: rgba(251, 251, 251, 0.67);color: rgba(106, 101, 101, 1); }

#searchbar { 
	min-height: 36px; line-height: 36px; vertical-align: middle;
	/*z-index: 100;*/
	padding: 2px 15px;
	/*box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); */
	background-color: rgba(205,205,199,1);	
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; 
}
.inp-search { color: #465867; font-size: 12px; width: 120px; height:24px; border:0; padding: 1px 5px; margin: 3px; background-color: transparent; }
.sticky-footer {position:fixed; bottom: 0; left: 0; right:0; z-index:200;}
.errortop {
	position:fixed; 
	top: 300; left: 0; right:0;
	background-color: rgba(255, 0, 48, 0.9);
	color: white;
	z-index: 30000;
	text-align: center;
	padding: 30px;
}

.bk-tperso {
	border-top: 5px solid #F7972A;
	background-color: #e0d3b7;
	color: #584000;
}
.bk-twork {
	border-top: 5px solid #25B492;
	background-color: #cbdad4;
	color: #045414;
}
.bk-twork-others {
	border-top: 3px solid #25B492;
	background-color: #c1c9c8;
	color: #848178;
	
}


/* COLORS */
.cl00 {background-color: rgba(32, 32, 32, 1) !important; color: white !important;}
.cl10,.cnavbar {background-color: rgba(60, 60, 60, 1) !important; color: white !important;}
.cl15 {background-color: rgba(74, 74, 74, 1) !important; color: #b3b3b3 !important;}
.cl20,.csidebar {background-color: rgba(95, 94, 85, 1) !important; color: rgba(205,205,199,1) !important;}
.cl30,.cheaderbar {background-color: rgba(136, 136, 134, 1) !important; color: rgba(205,205,199,1) !important;}
.cl40,.cworktitlebar {background-color: rgba(179, 178, 173, 1) !important; color: rgba(131,130,114,1) !important;}
.cl50,.cworksearckbar {background-color: rgba(205,205,199,1) !important; color: rgba(131,130,114,1) !important;}
.cl60,.cworkarea {background-color: rgba(230,230,227,1) !important; color: rgba(131,130,114,1) !important;}
.cl70 {background-color: rgba(240, 240, 240, 1) !important; color: rgba(131,130,114,1) !important;}
.cl80 {background-color: white !important; color: rgba(131,130,114,1) !important;}
.cl-work { color: #25B492 !important; }
.cl-perso,.cl-orange { color: #F7972A !important; }
.cl-app { color: rgba(206,5,56,1) !important; }
.cl-dwork { color: #18735d !important; }
.cl-dperso { color: #b57123 !important; }
.cl-maroon { color: maroon !important; }
.cl-black { color: #1c1c1c !important; }
.cl-dark { color: rgba(131,130,114,1) !important; }
.cl-gray { color: rgba(180, 180, 180, 1) !important; }
.cl-light, .cl-navbar { color: rgba(214, 214, 202, 1) !important; }
.cl-white { color: white !important; }
.cl-green, .cl-credit { color: #20a217 !important; }
.cl-red, .cl-debit { color: #e42121 !important; }
.cl-yellow { color: #ffea00 !important; }
.cl-light-green { color: #12ff00 !important; }
.cl-blue { color: #008dff !important; }
.cl-selected { color: rgba(0, 156, 222, 1) !important; }
.cl-transp {color: transparent !important}
.cl-focus:hover {color: rgba(0, 156, 222, 1) !important; }
.cl-attention { -webkit-animation: cl-attchange 2s infinite; -moz-animation: cl-attchange 2s infinite; -o-animation: cl-attchange 2s infinite; -ms-animation: cl-attchange 2s infinite; animation: cl-attchange 2s infinite;}
	@-webkit-keyframes cl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
	@-moz-keyframes cl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
	@-ms-keyframes ccl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
	@-o-keyframes cl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
	@keyframes ccl-attchange { 0%, 100% { color: red; } 50% { color: #ffe5a0; } }
.bk-usr {background-color: rgba(239,125,0,1) !important;}
.bk-ent {
	background: #50C9C3;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to top, #96DEDA, #50C9C3);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to top, #96DEDA, #50C9C3); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	color: white !important;
}
.bg-gray { background-color: rgba(167, 174, 181, 1); }
.bg-gray1 { background-color: rgba(225, 229, 235, 1); }

.bk-ent-dark {background-color: rgba(51, 167, 162, 1) !important;}
.bk-ent-dark:hover { background-color: rgba(38, 124, 119, 1) !important;}
.bk-app, .bk-app-badge {background-color: rgba(206,5,56,1) !important;}
.bk-app-dark {background-color: rgba(175, 9, 51, 1) !important;}
.bk-app-dark:hover {background-color: rgba(141, 10, 42, 1) !important;}
.bkl-usr:hover { background-color: rgba(239,125,0,1) !important; color: white !important;}
.bkl-ent:hover { background-color: rgba(61,183,176, 1) !important; color: white !important;}
.bkl-app:hover { background-color: rgba(206,5,56,1) !important; color: white !important;}
.bk-system { background-color: rgba(134, 29, 28, 1) !important;}
.bk-focus:hover { background-color: rgba(0, 156, 222, 1) !important; color: white !important; }
.bk-focus-black:hover { background-color: #464646 !important; color: white !important; }
.bk-focus-light:hover { background-color: #e8eef3 !important; color: #4c4242 !important;}
.bk-focus-danger:hover { background-color: #ff0000 !important; color: #ffffff !important;}
.mark-system { border-top: 2px dashed red !important;}
.bk-work { background-color: rgba(6, 160, 151, 1) !important}
.bk-work-others { background-color: rgba(98, 157, 153, 0.5) !important}
.bk-perso { background-color: rgba(239,125,0,1) !important}
.bk-perso-soft {
	background: #FFB75E;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to bottom, #ED8F03, #FFB75E);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to bottom, #ED8F03, #FFB75E); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	color: white !important;
}
.bk-white { background-color: white !important}
.bk-black { background-color: black !important}
.bk-blue { background-color: #16a5e7 !important}
.bk-gray { background-color: #bcbcbc !important}
.bk-light-gray,.bk-gray-light { background-color: #e8e8e8 !important}
.bk-mark { background-color: #cde4ef !important}
.bk-transp { background-color: transparent !important}
.bk-transp-dark { background-color: rgba(13, 14, 14, 0.62) !important}
.bk-transp-light { background-color: rgba(210, 210, 210, 0.5) !important}
.bk-hover {	background-color: transparent; color: transparent; }
.bk-hover:hover { background-color:rgba(89, 89, 89, 0.68); color: white; }
.bk-white-soft {
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #f1f1f1 27%, #e1e1e1 77%, #f6f6f6 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f1f1f1 27%,#e1e1e1 77%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ffffff 0%,#f1f1f1 27%,#e1e1e1 77%,#f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */
}
.bk-red-glass {
	background: #f85032; /* Old browsers */
	background: -moz-linear-gradient(top,  #f85032 0%, #f16f5c 35%, #f6290c 56%, #f02f17 71%, #e73827 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #f85032 0%,#f16f5c 35%,#f6290c 56%,#f02f17 71%,#e73827 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #f85032 0%,#f16f5c 35%,#f6290c 56%,#f02f17 71%,#e73827 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=0 ); /* IE6-9 */
}
.bk-blue-glass-light {
	background: #b7deed; /* Old browsers */
	backgrousnd: -moz-linear-gradient(top,  #b7deed 0%, #71ceef 50%, #21b4e2 51%, #b7deed 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #b7deed 0%,#71ceef 50%,#21b4e2 51%,#b7deed 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #b7deed 0%,#71ceef 50%,#21b4e2 51%,#b7deed 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b7deed', endColorstr='#b7deed',GradientType=0 ); /* IE6-9 */
}
.bk-black-glass {
	background: #959595; /* Old browsers */
	background: -moz-linear-gradient(top,  #959595 0%, #0d0d0d 46%, #010101 50%, #0a0a0a 53%, #4e4e4e 76%, #383838 87%, #1b1b1b 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #959595 0%,#0d0d0d 46%,#010101 50%,#0a0a0a 53%,#4e4e4e 76%,#383838 87%,#1b1b1b 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #959595 0%,#0d0d0d 46%,#010101 50%,#0a0a0a 53%,#4e4e4e 76%,#383838 87%,#1b1b1b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#959595', endColorstr='#1b1b1b',GradientType=0 ); /* IE6-9 */
}
.bk-black-soft {
	background: #000000;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to bottom, #434343, #000000);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to bottom, #434343, #000000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bk-perso-bar {
	background: #16222A;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to bottom, #3A6073, #16222A);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to bottom, #3A6073, #16222A); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bk-shades {
background: #bdc3c7;  /* fallback for old browsers */
background: -webkit-linear-gradient(to top, #2c3e50, #bdc3c7);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to top, #2c3e50, #bdc3c7); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bk-blue-soft {
background: #83a4d4;  /* fallback for old browsers */
background: -webkit-linear-gradient(to top, #b6fbff, #83a4d4);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to top, #b6fbff, #83a4d4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bk-metal {
background: #abbaab;  /* fallback for old browsers */
background: -webkit-linear-gradient(to top, #ffffff, #abbaab);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to top, #ffffff, #abbaab); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.ft-100 { font-weight:100 !important}	
.ft-300 { font-weight:300 !important}	
.ft-400 { font-weight:400 !important}	
.ft-700 { font-weight:700 !important}	
.ft-900 { font-weight:900 !important}	
.ft-10 { font-size:10px !important}	
.ft-12 { font-size:12px !important}	
.ft-14 { font-size:14px !important}	
.ft-16 { font-size:16px !important}	
.ft-18 { font-size:18px !important}	
.ft-22 { font-size:22px !important}	
.ft-24 { font-size:24px !important}	
.ft-26 { font-size:26px !important}	
.ft-28 { font-size:28px !important}	
.ft-32 { font-size:32px !important}	
.ft-36 { font-size:36px !important}	
.ft-40 { font-size:40px !important}	
.ft-48 { font-size:48px !important}	
.ft-64 { font-size:64px !important}
.ftw-24 { font-size:2.5vw !important}
.ft-caps,.txt-caps { font-variant: small-caps !important}


.bg-center { background-size: cover; background-position: center center; }
.bg-center-top { background-size: cover; background-position: center top; }

.fright { float:right}
.fleft { float:left}
.fcenter { float:center}
.txt-emboss {
	background-color: #666666;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
}

.txt-l {text-align:left}
.txt-c {text-align:center}
.txt-r {text-align:right}
.txt-s {text-decoration:  line-through !important}
.txt-shadow { text-shadow: 1px 1px 4px black; }
.ls-1 {letter-spacing: 1px !important;}
.ls-2 {letter-spacing: 2px !important;}

.vmiddle { vertical-align: middle !important; line-height: 36px; }
.vtop {vertical-align: top !important}
.vbottom {vertical-align: bottom !important}
.verticaltext { transform: rotate(-90deg); transform-origin: left bottom 0; }

.mrg-t-rcell {margin-top:5px}
.mrg-l-10 {margin-left:10px}
.mrg-t-10 {margin-top:10px}
.mrg-r-10 {margin-right:10px}
.mrg-b-10 {margin-bottom:10px}
.mrg-l-20 {margin-left:20px}
.mrg-t-20 {margin-top:20px}
.mrg-t-40 {margin-top:40px}
.mrg-r-20 {margin-right:20px}
.mrg-b-20 {margin-bottom:20px}
.mrg-auto {margin:20px auto}

.inset {padding:4px}
.inset-5-15 {padding:5px 15px;}
.inset-10 {padding:10px}
.inset-20 {padding:20px}
.inset-20-40 {padding:10vw 20vh}
.inset10 {padding:10vh 10vw}
.inset20 {padding:20vh 20vw}

.wcenter {margin: 20px auto}
.w5 {width:5% !important}
.w10 {width:10% !important}
.w20 {width:19% !important}
.w25 {width:24% !important}
.w30 {width:29% !important}
.w40 {width:39% !important;}
.w50 {width:50% !important}
.w60 {width:59% !important}
.w70 {width:69% !important}
.w75 {width:74% !important}
.w85 {width:84% !important}
.w99 {width:98% !important}
.w100 {width:100% !important}
.wm100 {max-width: 100% !important}
.mw-200 {min-width: 200px !important}
.wm-400 {max-width: 400px !important}
.wm-700 {max-width: 700px !important}
.wm-800 {max-width: 800px !important}
.w-16 {width:16px !important}
.w-26 {width:25px !important}
.w-30 {width:30px !important}
.w-40 {width:40px !important}
.w-51 {width:50px !important}
.w-60 {width:60px !important}
.w-76 {width:75px !important}
.w-101 {width:100px !important}
.w-150 {width:150px !important}
.w-200 {width:200px !important}
.w-240 {width:240px !important}
.w-260 {width:260px !important}
.w-280 {width:280px !important}
.w-300 {width:300px !important; max-width: 100% !important;}
.w-320 {width:320px !important; max-width: 100% !important;}
.w-400 {width:414px !important; max-width: 93% !important;}
.w-510 {width:500px !important; max-width: 100% !important;}
.w-600 {width:600px !important; max-width: 100% !important;}
.w-700 {width:700px !important; max-width: 100% !important;}
.h100 {height:100vh !important}
.h-200 {height:200px !important}
.h-101 {height:100px !important}
.h-60 {height:60px !important}
.h-51 {height:50px !important}
.h-26 {height:25px !important}
.h50 {height:50vh !important}
.h30 {height:30vh !important}
.mh-100 {min-height:100px !important}
.mh-50 {min-height:50px !important}
.mh-25 {min-height:25px !important}

.borline {border:1px solid lightgray !important}
.borrad-3 {border-radius:3px !important}
.borrad-5 {border-radius:5px !important}
.borrad-10 {border-radius:10px !important}
.borrad-50 {border-radius:50% !important}
.shadowpad {box-shadow:1px 1px 3px gray; border-radius:6px; padding: 10px;}
.clear {clear:both}
.overline-system {border-top: 2px solid #d50000 !important}
.underline-system {border-bottom: 2px solid #d50000 !important}
.leftline {border-left: 1px solid #aca1a1 !important}
.rightline {border-right: 1px solid #aca1a1 !important}
.overline {border-top: 1px solid #aca1a1 !important}
.overline-light {border-top: 1px solid #f9e7e7 !important}
.underline {border-bottom: 1px solid #aca1a1 !important}
.underline-light {border-bottom: 1px solid #f0efec !important}
.box-shadow { box-shadow: 1px 1px 6px 1px rgba(98, 98, 98, 1) !important; }
.box-ishadow { box-shadow: inset 1px 1px 10px 2px rgba(19, 18, 18, 0.95) !important; }
.cpointer {cursor:pointer !important}
.cmove {cursor:move}
.cdefault {cursor: default }
.calias {cursor: alias}
.chelp {cursor: help}
.cedit {cursor: context-menu}

.show {display:block}
.hide {display:none}
.no-border,noborder {border:0 !important; outline: none !important;}
.no-wrap { white-space: nowrap; overflow-x: hidden;  }
.dash {border: 1px dashed gray}
.dashsel {border: 2px dashed red}
.pageheight { /* adjusts element to page height on window resize*/ }
.boxsizing { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.boxsizing:after { content:""; display:table; clear:both; }
.text-selectable { -moz-user-select: text; -webkit-user-select: text; -ms-user-select: text; user-select: text;}
.fr-wrapper { -moz-user-select: auto; -webkit-user-select: auto; -ms-user-select: auto; user-select: auto;} 
.text-notselectable { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none;}
pre {
	-moz-user-select: text; -webkit-user-select: text; -ms-user-select: text; user-select: text;
	font-family: 'Ubuntu Mono', monospace;
	font-size: 14px;
	margin:0;
	background-color: #c0bcb7;
	color: maroon;
	padding:15px 12px;
}
textarea { border:0; padding: 10px; }
.sh1 { font-family: 'Roboto', sans-serif; font-weight: 300;	font-size: 28px; }
.sh2 { font-family: 'Roboto', sans-serif; font-weight: 300;	font-size: 24px; }
.sh3 { font-size: 18px; }
.sh4 { font-size: 14px; font-weight: 300; }
.sh5 { font-weight: 400; font-size: 12px; color: maroon; }
.sh6 { font-size: 10px;	color: #484747; }

.recordtab {
	float:left; 
	margin: 10px 5px 0px 5px; 
	padding: 5px 10px; 
	border-radius: 5px 5px 0px 0px;
	font-family: 'Oswald', sans-serif; font-weight: 700;
	background-color: gray; color:white;
}
.rtselected { background-color: white !important; color:#5d4545 !important; }

td { border-bottom: solid 1px #f4f3f0; }
.cell-header { margin: 0px !important; padding: 4px !important; background-color: #f6f7f4; }
.cell-footer { margin:0 !important; padding:4px !important;	background-color: #f6f7f4; }
.cell-reference { font-weight: 700 !important; }
.cell-footer-total { font-weight: 700; }
.cell-footer-average { font-size: small !important;	font-weight: 200; color: #88a3ac !important; }
.cell-browse-key { text-align: center; }
.cell-record-key {  text-align:left; color: #1a5f78; }
.cell-browse-number, .cell-browse-id  { text-align:right; white-space: nowrap; }
.cell-record-number, .cell-record-id, .cell-browse-tags, .cell-record-tags { text-align: left; margin-left: 5px; color: #6a6c6d;}
.cell-browse-column, .cell-record-column,
.cell-browse-user, .cell-record-user,
.cell-browse-choices, .cell-record-choices,
.cell-browse-string, .cell-record-string { text-align: left !important; }
.cell-browse-address, .cell-record-address { text-align: left; min-width: 150px; }
.cell-browse-logical { text-align: center; }
.cell-record-logical { }
.cell-browse-image, .cell-record-image {  }
.cell-browse-choices { text-align: center; }
.cell-record-choices { text-align: left; }
.cell-browse-color { text-align: center; }
.cell-record-color { text-align: left; }
.cell-browse-lookup { text-align: left; }
.cell-record-lookup { text-align: left; }
.cell-browse-datetime, .cell-record-datetime { text-align: left; white-space: nowrap; }
.cell-browse-text, .cell-record-text { min-width: 150px; }
.cell-browse-rich-text, .cell-record-rich-text {   }
.cell-browse-tags, .cell-record-tags { min-width: 150px; }
.cell-browse-language { text-align: center; color: maroon; }
.cell-record-language { text-align: left; color: maroon; }
.cell-browse-password { text-align: center; color: maroon; }
.cell-record-password { text-align: left; color: maroon; margin-left: 5px; }

.input-browse-string, 
.input-record-string, 
.input-browse-datetime, .input-datetime { border:0; padding: 4px; }
.input-browse-number { border:0; background-color: white; padding: 4px 6px; }
.select-browse {
	-webkit-appearance:none;
	border: solid 1px white;
	border-radius: 3px;
	padding: 4px 6px;
	background-color: white;
	outline: none;
	font-size: 14px;
	font-variant: small-caps;
}

.logininput {
	border: none;
	border-radius: 3px;
	background-color: rgba(41, 41, 40, 1);
	color: white;
	font-size: 14px;
	padding: 2px 4px;
	outline: none;
	margin-top: 2px;
	margin-right: 2px;
	width: 22vw;
	max-width:180px;
}

.input-select {
	width: auto;
	/*font-family: 'Oswald', sans-serif;*/
	border: 1px solid white;
	font-size: 14px;
	color: #413f3b;
}
.input-select-dark {
	border-radius: 2px;
	border: 1px solid #5a5a57;
	margin: 5px;
	color: white;
	background-color: rgba(53, 53, 53, 0.7);
	font-size: 14px;
	font-variant: small-caps;
	font-family: 'Oswald', sans-serif;
}
.input-select-light {
	border-radius: 2px;
	border: 1px solid #cccbc3;
	margin: 4px;
	background-color: transparent;
	font-size: 12px;
	font-family: 'Oswald', sans-serif;
}

.input-search {
	float:left;  
	border:0;
	border-radius: 3px;
	height: 22px;
	line-height: 22px;
	width: 120px;
	padding: 1px 5px;
	margin: 4px 10px;
}

.input-text {
	width:100%;
	resize:none;
	padding: 6px;
}

.input-string {
	width:100%;
	border:0;
	box-sizing : border-box;
	border-radius: 2px;
	background-color: #f7f9fa;
}

.input-number {
	width:100%;
	border:0;
	color: maroon;
	text-align: right;
	box-sizing : border-box;
	background-color: #f3f5f2;
	padding: 4px 6px;
	border-radius: 2px;
}

.input-addr {
	font-size: 16px;
	border: 0;
	border-radius: 3px;
	background-color: #f3f3f3;
	padding: 4px 6px;
	color: #7a7a7a;
	font-variant: small-caps;
}

.input-tag {
	margin:0;
	padding:0;
	border:0;
	background:none;
	color:white; 
	outline: none;
}

.tag {
	margin: 2px 4px 2px 0px;
	padding: 3px 8px;
	border-radius: 2px;
	float:left;
	background-color: #7f7e7c;
	color: white;
}
.smalltag {
	padding: 2px 10px;
	font-family: 'Quicksand', sans-serif;
	font-weight: 700;
	border-radius: 3px;
	float:left;
	font-size:12px;
	margin: 0px 4px 4px 0px;
}
.tag-selected {
	background-color: #597b85;
	color: white;
}
.tag-unselected {
	background-color: #c8d5d9;
	color: #7e99a6;
}

.cell-label {
	font-family: 'Oswald', sans-serif;
	width:39%;
	text-align:right;
	padding: 4px 6px;
	border: 0;
	font-size: 16px;
}
.cell-data {
	font-family: 'Oswald', sans-serif;
	width:60%;
	margin-left: 5px;
	color:#756241; 
	text-align:left;
	border: 0;
}


/* jquery */
.ui-autocomplete-loading { background: url('../_images/loading16.gif') no-repeat right center; }
/* jbox */
.dialog-title { font-size: 1.5em; font-weight: bold; color: maroon; }
.dialog-stitle { font-size: 0.7em; font-weight: 100; color: #4b4646; }
/* PRINT */
@media print { 
	.no-print { display:none; } 
	@page { size: auto; margin: 0; } 
	/*@page { size: A4 portrait; margin: 0; } */
	/*@page A4landscape { size: A4 landscape; margin: 0; }*/
	.page-break { page-break-before: always; } /* used in agenda so far */
}
/*style="@page { size: landscape; }"*/

.counters {
	font-family: 'Oswald', sans-serif;
	font-size: 10px;
	padding: 4px 6px;
	min-width: 10px;
	border-radius: 11px;
	color: white;
	margin: 2px 3px;
	text-align: center;
}
.menusection {
	min-width: 100px;
	margin-right:20px;
	float:left;
	border-radius: 3px;
	padding: 10px;
}
.menutitle {
	font-family: 'Oswald', sans-serif;
	font-weight: 100;
	width: 100%;
	font-size: 16px;
	margin-bottom: 6px;
	padding: 6px;
	border-left: 2px solid rgba(220,220,220,1);
}
.menuitem {
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	width: 100%;
	color:#744a08;
	font-size: 14px;
	padding: 6px 5px;
	cursor: pointer;
	border-radius: 0px 6px 6px 0px;
	margin-bottom: 5px;
}
.menuitem:hover {
	color: white;
	background-color: orange;
}
.work { color: #25B492 }
.perso { color: #F7972A }
.cardscontainer { position:relative; margin-left: 20px; }
.card,bd-card { min-width:240px; min-height: 30px; border-radius: 3px; overflow: hidden; float:left;}
.card-top { min-height:22px; border-radius: 3px 3px 0px 0px; padding: 10px; background-color: #bbb2a6; }
.card-top-ct { min-height:22px;	border-radius: 4px 4px 0px 0px; padding: 10px; background: #56514d; }
.flash { -webkit-animation-name: flash; -webkit-animation-duration: 5000ms; -webkit-animation-iteration-count: 1; -webkit-animation-timing-function: ease-out;}    
@-webkit-keyframes flash { 0% { background-color: #19b7de; } 10% { background-color: #004880; } 100% { background-color: #565d61; } }
.flashkey { -webkit-animation-name: flashkey; -webkit-animation-duration: 200ms; -webkit-animation-iteration-count: 1; -webkit-animation-timing-function: ease-out;}    
@-webkit-keyframes flashkey { 0% { background-color: #00b7ff; }  100% { background-color: #ffffff; } }



/* TABLE DESIGNER */
.listitem {
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	width: 70%;
	color:#744a08;
	font-size: 14px;
	padding: 1px 3px;
	cursor: pointer;
	margin:4px;
}
.listitem:hover {
	color: white;
	background-color: orange;
}

.topcontents {
	background-color: white;
	min-height: 50px;
	padding: 20px 10px;
}

.topcontents:after {
	content:"";
	display:table;
	clear:both;
}

.sectionsort {
	min-width:50px; 
	color:white; 
	padding: 2px 4px;
	margin-right:5px; 
	margin-bottom:5px; 
	float:left;
	text-align: center;
	border-radius: 2px;
}
.pagesection { /* the sortable page area */
	border-radius: 5px;
	border: 2px dashed #dbc9c9;
	min-height: 50px;
	background-color: #f7fcff;
}
.grouptitle {
	font-size:18px;
	font-variant: small-caps;
	background-color: #f3edea;
	box-shadow: 1px 1px 2px #622a0d;
	min-height:24px;
}
.sortableul { /* the column lists */
	cursor:move;
	padding: 5px; 
	border-radius: 5px;
	clear: both;
}
.sortableli { /* the column names */
	background-color: #e9e7e0;
	margin: 0px 2px 4px 4px;
	padding: 0 3px;
	border-radius: 3px;
	border: 1px solid #ceccc2;
	color:#867f67;
	min-height: 24px;
	line-height: 24px;
	vertical-align: middle;
	list-style: none;
}
.sortabledetails { /* the detail list */
	padding: 5px; 
	border-radius: 5px;
	clear: both;
}
.sortabledetailitem { /* the detail columns */
	background-color: #eeede8;
	margin: 0px 0px 3px 10px;
	padding: 2px 8px;
	border-radius: 3px;
	color:#867f67;
	min-height: 22px;
	line-height: 22px;
	vertical-align: middle;
	cursor: move;
}

.fieldname { /* the column names itself */
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	font-size: 12px;
	color:maroon;
	margin-left: 5px;
	overflow-x: hidden;
}

.fieldtype { /* the column types */
	background-color: #a4a2a2;
	color:white;
	font-size: 14px;
	font-family: 'Ubuntu', sans-serif;
	font-variant: small-caps;
	cursor:pointer;
	text-align: center;
	min-height:18px;
	border-radius: 2px;
}
.fieldtype:hover { /* the column types */
	background-color: #e29700;
	color:yellow;
}

.fieldtyperec { /* the column types */
	min-height:19px;
	line-height: 16px;
	width: 38px;
	float:left;
	margin: 2px 6px 2px 0px;
	border-radius: 3px;
}





/* SLIDES */
.slide100 {
	height: 100vh;
	background-position: top center;
	background-size: cover;
	background-repeat: no-repeat;
	background-color: #eff7f7;
}

.slide-bg-fixed { 
	background-attachment: fixed;
}
.slide-flow { 
	/* controled by parolle */
}
.slide-bg,slide { 
	background-position: left top;
	background-repeat: no-repeat;
	background-size: cover;
}

/* Implements Container with overlap slides, use z-index for order, and paroller for scolls <script src="_lib/parallax/jquery.paroller.min.js"></script> */
.slide-container {
	position: relative;
	display: block;
	overflow: hidden;
}
.slide-layer {
	position: absolute;
	top:0; bottom: 0; left: 0; right: 0;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.square {
  width: 100%;
}
.square:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.square-content {
  position: absolute;
  width: 78%;
  height: 78%;
  margin: 6%;
}

/* T7STUFF */
.showcams {
	float: left;
	width: 320px;
	height: 240px;
	margin: 5px;
}



/* DEBUG */
.debug {
	font-family: 'courier' monospace;
	color:gray;
	-moz-user-select: text; 
	-webkit-user-select: text; 
	-ms-user-select: text; 
	user-select: text; 
}


.debugbar{
	font-family: 'Oswald';
	font-size: 26px;
	padding:10; 
	color:white; 
	font-size:large;
	background-color:gray;
}