html { 	-webkit-font-smoothing: subpixel-antialiased; }
body { -webkit-overflow-scrolling: touch; }

icnavbar { position: fixed; top: 0px; min-width:240px; min-height: 100%; z-index: 10; color: white; background-color: rgba(50, 50, 50, 1); overflow-y: scroll; }
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; }
#workbody { position: absolute; top:70px; width:100%; background-color: rgba(230,230,230,1); color: rgba(131,130,114,1); }
#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; }
.dropdown-pull-right { float: right !important; right: 0; left: auto; }
.dropdown-pull-right>.dropdown-menu { right: 0; left: auto; }

.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;
}
.mcounters { 
	float: right;
	padding: 2px 6px; 
	border-radius: 4px;
	font-size: 14px;
}

.nbright {right:0px;}
.nbleft {left:0px;}
.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;
	padding: 2px 15px;
	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;}


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

.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-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-180 {width:180px !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}

.clear {clear:both}
.vertical {
	writing-mode: vertical-rl; /* Or vertical-rl for right-to-left */
	text-orientation: sideways;
	transform-origin: top left;
}

.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-dshadow { box-shadow:3px 3px 5px black; border-radius:6px; padding: 10px;}
.box-shadow { box-shadow: 1px 1px 6px 1px rgba(98, 98, 98, 1) !important; }
.box-ishadow { box-shadow: inset 1px 1px 6px 2px rgba(19, 18, 18, 0.60) !important; }
.img-shadow { -webkit-filter: drop-shadow(2px 1px 2px #222); filter: drop-shadow(2px 1px 2px #222); }

.cpointer {cursor:pointer !important}
.cmove {cursor:move}
.carrowleft {cursor:w-resize}
.carrowright {cursor:e-resize}
.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;}
.dash {border: 1px dashed gray}
.dashsel {border: 2px dashed red}
.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: 'Courier', monospace;
	font-size: 14px;
	margin:0;
	background-color: #c0bcb7;
	color: maroon;
	padding:15px 12px;
}
textarea { border:0; padding: 10px; }
.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-footer-total { font-weight: 700; }
.cell-footer-average { font-size: small !important;	font-weight: 200; color: #88a3ac !important; }
.cell-reference { font-weight: 700 !important; }
.cell-browse-key { text-align: center; }
.cell-browse-number, .cell-browse-id  { text-align:right; white-space: nowrap; }
.cell-browse-column, .cell-record-column,
.cell-browse-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-browse-image, .cell-record-image {  }
.cell-browse-choices, .cell-record-user, { text-align: center; }
.cell-browse-color { text-align: center; }
.cell-browse-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-browse-password { text-align: center; color: maroon; }
.cell-record-password { text-align: left; color: maroon; margin-left: 5px; }
.cell-record-key {  text-align:left; color: #1a5f78; }
.cell-record-key {  text-align:left; color: #1a5f78; }
.cell-record-number, .cell-record-id, .cell-browse-tags, .cell-record-tags { text-align: left; margin-left: 5px; color: #6a6c6d;}
.cell-record-logical { }
.cell-record-string { }
.cell-record-choices { text-align: left;}
.cell-record-color { text-align: left; }
.cell-record-lookup { text-align: left; }
.cell-record-language { text-align: left; color: maroon; }

.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 {
	padding: 4px 6px;
	-webkit-appearance:none;
	border:0;
	font-variant: small-caps;
	vertical-align: top;
}

.input-select {
	border: 1px solid rgba(171, 171, 171, 1);
}
.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;
	vertical-align: middle;
}
.cell-data {
	font-family: 'Oswald', sans-serif;
	width:60%;
	margin-left: 5px;
	text-align:left;
	border: 0;
	padding: 2px 0px;
}


/* 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;
}
.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: 'Courier', 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;
}