html,
body {    		
		height: 100%;   		
}

bodyx {    		
		height: 100%;   
		background-color: #2196f3;						
		background-image: -moz-linear-gradient(top, white 0%, #2196f3 90%);	/* For Firefox 3.6 to 15 */	 																									
		background-image: -webkit-linear-gradient(top, white 0%, #2196f3 90%); /* For Chrome10+, Safari5.1+ */			
		background-image: -o-linear-gradient(top, white 0%, #2196f3 90%);	/* For Opera 11.10+ */		
		background-image: -ms-linear-gradient(top, white 0%, #2196f3 90%); /* For IE10+ */	
}

.image-logo {
    font-size:11px;       
    float:left;		
		position: absolute;	
		height: 95px;
		width: 85px;
		padding: 2px;
		border: 1px solid navy;
		margin: 2px;		
		margin-left:0px; 
		margin-top:0px;
}

.image-logo-menu {
    font-size:11px;           
		height: 50px;
		width: auto;		
		margin-top: -15px;				
}

.navbar-default > .container {    
    width: 100%;
}

.footer > .container {    
    width: 100%;
}

.navbar-default > .container > .collapse {    
    margin: auto;
}

.navbar-headerx {				
		width: 85px;
    margin-left: -100px; 
}

.navbar-brandx > img {
   /*max-height: 100%;   */
   margin-top: -10px; 
   margin-left: 0px; 
   height: 40px;
   width: auto;  
   /* probably not needed anymore, but doesn't hurt */
   -o-object-fit: contain;
   object-fit: contain; 
}

.box-content {
	margin-left: 225px; 
	padding-top: 10px; 
	padding-bottom: 20px; 
	padding-left: 40px; 
	padding-right: 30px; 
	background-color: white; 
	box-shadow: 10px 10px 5px #888888; /*#888888*/
	border-radius: 25px;	
}

.box-contentheaderadditem {
	margin-left: 15px; 
	padding-top: 20px; 
	padding-bottom: 0px; 
	padding-left: 20px; 
	padding-right: 30px; 
	border: 1px dotted silver;
	background-color: white; 	
	border-radius: 15px;	
	width: 45%;	
}

.box-contentitemsublevel {
	margin-left: 225px; 
	padding-top: 5px; 
	padding-bottom: 1px; 
	padding-left: 30px; 
	padding-right: 30px; 
	background-color: white; 	
	border-radius: 15px;	
}

.box-table {
  font-size: 1em;
  font-family: sans-serif;
  border: 1px dotted silver;
  background-color: white;
}

.label-td {
  font-size: 0.9em;
  font-weight: bold;
  color: orange;
  text-align: right;
  /*background-color: rgb(240,240,200);*/
  /*background: transparent url(themes/default/img/header/panel_08.gif) scroll repeat-x; */
  background: #EEEEEE;
  border-bottom: 1px dotted silver;
  padding: 4px;
  width: 35%;
}

.input-td {
  border-bottom: 1px dotted #ddd;
  padding: 4px;  
}

.alert-success {
	margin-left: 220px; 	
}

/*.navbar-default {				
    //background-color: silver;
    //border-color: #AA0000;
    border-radius: 0px;
}

.navbar-collapse {
	border-top: 1px solid transparent;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);		
}*/

.navbar-collapse .collapse {						
	margin-left: 20px;
	
}

.preview-image {
    font-size:11px;       
    float:left;		
		position: absolute;	
		height: 150px;
		width: 130px;
		padding: 2px;
		border: 2px solid navy;
		margin: 2px;		
}

.preview-image2 {
    font-size:11px;       
    float:left;		
		position: absolute;	
		height: 130px;
		width: 110px;
		padding: 2px;
		border: 2px solid navy;
		margin: 2px;		
}

.preview-image-lg {
    font-size:11px;       
    float:left;		
		position: absolute;	
		height: 250px;
		width: 230px;
		padding: 2px;
		border: 2px solid navy;
		margin: 2px;				
}

.preview-image-lgblank {
    background-color:white; 
    float:left; 
    position: absolute; 
    height: 250px; 
    width: 230px; 
    padding: 2px; 
    border: 2px solid navy; 
    margin: 2px;     
}

.preview-image-subform {
    font-size: 11px;          
		position: relative;	
		height: 150px;
		width: 130px;
		padding: 2px;
		border: 1px solid navy;
		margin: 2px;		
}

.preview-image-subform-lg {
    font-size: 11px;              
		position: relative;	
		height: 450px;
		width: 430px;
		padding: 2px;
		border: 2px solid navy;
		margin: 2px;		
}

.label-title {
    font-size:11px;            
    float:left;		
		position: absolute;		
}

.label-title-lg {
    font-size:11px;            
    float:left;		
		position: absolute;		
}

.label-title-subform-lg {
    font-size:14px;            
    float:left;		
		position: relative;		
}

/* Browser window size: 1024x768 [1008x529] (window size, viewport size)    
   Laptop 14" = 1366 x 768 resolution (1366 x 696 in browser)   
*/
/*
@media only screen and (orientation:portrait){
	#wrapper { display:none; }
	#warning-message { 
		display:block; 
	}
}
@media only screen and (orientation:landscape){
	#warning-message { 
		display:none; 
	}		
}*/
/*==========  Mobile First Method  ==========*/
/* Custom, iPhone Retina */ 
/* mobile phone 5.0 inch in potrait, not compatible for wide administration screen */
@media only screen and (min-width : 320px) {
	body, .dropdown-menu {        
		font-size: 10px;				
	}
	.jumbotron h1 {        
		font-size: 40px;						
	}
	h1 {        
		font-size: 30px;						
	}
	h2 {        
		font-size: 28px;						
	}
	h3 {        
		font-size: 22px;						
	}
	h4 {        
		font-size: 16px;						
	}
	.panel-heading h3 {        
		font-size: 13px;						
	}
	.jumbotron .lead {        
		font-size: 14px;						
	}	
	.navbar-collapse.collapse {				
		width: 320px;		
	}
	.grid-view {
		font-size: 10px;						
	}
	.btn {
		font-size: 11px;						
	}
	.box-content.box-login {
		width:100%;		
	}
	.box-content.box-index {
		margin: auto;
		width: 50%;	
		height: 400px; 		
		margin-top: 100px;		
	}
	.preview-image {
		margin-left:800px; 
		margin-top:-195px;		
	}	
	.label-title {
		margin-left:800px; 
		margin-top:-210px;
	}
	.preview-image-lg {
		margin-left:700px;
		top:205px; 			
	}
	.preview-image-lgblank {    
		margin-left:700px; 
		top:205px;		
	}
	.label-title-lg {
		margin-left:700px; 
		top:189px;	
	}	
}
/* Extra Small Devices, Phones */ 
/* mobile phone 5.0 inch in landscape */
@media only screen and (min-width : 480px) {
	body, .dropdown-menu {        
		font-size: 10px;				
	}
	.jumbotron h1 {        
		font-size: 30px;						
	}
	h1 {        
		font-size: 20px;						
	}
	h2 {        
		font-size: 28px;						
	}
	h3 {        
		font-size: 22px;						
	}
	h4 {        
		font-size: 12px;						
	}
	.panel-heading h3 {        
		font-size: 13px;						
	}
	.jumbotron .lead {        
		font-size: 14px;						
	}	
	.navbar-collapse.collapse {				
		width: 480px;				
	}
	
	
	
	.grid-view {
		font-size: 10px;						
	}
	.btn {
		font-size: 11px;						
	}
	.box-content.box-login {
		width:85%;		
	}
	.box-content.box-index {
		margin: auto;
		width: 100%;	
		height: 400px; 		
		margin-top: 100px;		
	}
	.preview-image {
		margin-left:800px; 
		margin-top:-195px;		
	}	
	.label-title {
		margin-left:800px; 
		margin-top:-210px;
	}
	.preview-image-lg {
		margin-left:700px;
		top:205px; 			
	}
	.preview-image-lgblank {    
		margin-left:700px; 
		top:205px;		
	}
	.label-title-lg {
		margin-left:700px; 
		top:189px;	
	}	
}
/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {	
	body, .dropdown-menu {        
		font-size: 10px;				
	}
	.jumbotron h1 {        
		font-size: 40px;						
	}
	h1 {        
		font-size: 30px;						
	}
	h2 {        
		font-size: 28px;						
	}
	h3 {        
		font-size: 22px;						
	}
	h4 {        
		font-size: 16px;						
	}
	.panel-heading h3 {        
		font-size: 13px;						
	}
	.jumbotron .lead {        
		font-size: 17px;						
	}	
	.navbar-collapse.collapse {				
		width: 768px;		
	}			
	
	.grid-view {
		font-size: 10px;						
	}
	.btn {
		font-size: 11px;						
	}
	.box-content.box-login {
		width:65%;		
	}
	.box-content.box-index {
		margin: auto;
		width: 50%;	
		height: 400px; 		
		margin-top: 100px;		
	}
	.preview-image {
		margin-left:800px; 
		margin-top:-195px;		
	}	
	.label-title {
		margin-left:800px; 
		margin-top:-210px;
	}
	.preview-image-lg {
		margin-left:700px;
		top:205px; 			
	}
	.preview-image-lgblank {    
		margin-left:700px; 
		top:205px;		
	}
	.label-title-lg {
		margin-left:700px; 
		top:189px;	
	}	
}
/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
	body, .dropdown-menu {        
		font-size: 11px;				
	}
	.jumbotron h1 {        
		font-size: 40px;						
	}
	h1 {        
		font-size: 30px;						
	}
	h2 {        
		font-size: 28px;						
	}
	h3 {        
		font-size: 22px;						
	}
	h4 {        
		font-size: 16px;						
	}
	.panel-heading h3 {        
		font-size: 13px;						
	}
	.jumbotron .lead {        
		font-size: 20px;						
	}	
	.navbar-collapse .collapse {				
		width: 992px;		
	}		
	.grid-view {
		font-size: 11px;						
	}
	.btn {
		font-size: 12px;						
	}
	.box-content.box-login {
		width:65%;		
	}
	.box-content.box-index {
		margin: auto;
		width: 50%;	
		height: 400px; 		
		margin-top: 100px;		
	}
	.preview-image {
		margin-left:800px; 
		margin-top:-195px;		
	}	
	.label-title {
		margin-left:800px; 
		margin-top:-210px;
	}
	.preview-image-lg {
		margin-left:700px;
		top:205px; 			
	}
	.preview-image-lgblank {    
		margin-left:700px; 
		top:205px;		
	}
	.label-title-lg {
		margin-left:700px; 
		top:189px;	
	}	
}
/* Large Devices, Wide Screens: used in simulation 15" http://quirktools.com/screenfly */
@media only screen and (min-width : 1200px) {
	body, .dropdown-menu {        
		font-size: 11px;						
	}	
	.jumbotron h1 {        
		font-size: 40px;						
	}
	h1 {        
		font-size: 30px;						
	}
	h2 {        
		font-size: 28px;						
	}
	h3 {        
		font-size: 22px;						
	}
	h4 {        
		font-size: 16px;						
	}
	.panel-heading h3 {        
		font-size: 15px;						
	}
	.jumbotron .lead {        
		font-size: 20px;						
	}			
	.navbar-collapse.collapse {				
		width: 1200px;		
	}		
	.grid-view {
		font-size: 11px;						
	}
	.btn {
		font-size: 12px;						
	}	
	.box-content.box-login {
		width:65%;		
	}
	.box-content.box-index {
		margin: auto;
		width: 50%;	
		height: 380px; 		
		margin-top: 60px;		
	}
	.preview-image {
		margin-left:800px; 
		margin-top:-195px;		
	}	
	.label-title {
		margin-left:800px; 
		margin-top:-210px;
	}
	.preview-image-lg {
		margin-left:700px;
		top:205px; 			
	}
	.preview-image-lgblank {    
		margin-left:700px; 
		top:205px;		
	}
	.label-title-lg {
		margin-left:700px; 
		top:189px;	
	}	
}
/* Large Devices, Wide Screens: used in simulation 23" LED */
@media only screen and (min-width : 1500px) {
	body, .dropdown-menu {        
		font-size: 12px;						
	}	
	.jumbotron h1 {        
		font-size: 40px; /* 57	*/
	}
	h1 {        
		font-size: 31px;						
	}
	h2 {        
		font-size: 32px;						
	}
	h3 {        
		font-size: 22px;						
	}
	h4 {        
		font-size: 16px;						
	}
	.panel-heading h3 {        
		font-size: 17px;						
	}
	.jumbotron .lead {        
		font-size: 21px; /* 25 */
	}			
	.navbar-collapse.collapse {				
		width: 1500px;		
	}		
	.grid-view {
		font-size: 12px;						
	}
	.btn {
		font-size: 13px;						
	}	
	.box-content.box-login {
		width:55%;		
	}
	.box-content.box-index {		
		margin: auto;
		width: 40%;	
		height: 390px; 		
		margin-top: 60px;
	}
	.preview-image {
		margin-left:830px; 
		margin-top:-195px;		
	}
	.label-title {
		margin-left:830px; 
		margin-top:-210px;
	}
	.preview-image-lg {
		margin-left:1000px;
		top:205px; 			
	}
	.preview-image-lgblank {    
		margin-left:1000px; 
		top:205px;		
	}
	.label-title-lg {
		margin-left:1000px; 
		top:189px;	
	}	
}





.site-error {    
		margin-left: 200px; 
		padding-top: 10px; 
		padding-bottom: 20px; 
		padding-left: 30px; 
		padding-right: 30px; 
		background-color: white; 
		box-shadow: 10px 10px 5px #888888;
}

/* Ref.: http://formvalidation.io/examples/changing-success-error-colors/ 
.has-error .control-label,
.has-error .help-block,
.has-error .form-control-feedback {
    width: 300px;
}*/
.has-error .help-block {
    width: 300px;
}

.input-shortdescription {
    font-size:11px;
    font-style: italic;
    font-weight:normal;
    color: black;
    display: inline-block; 
    margin-top: 0px;    
    margin-left: 5px;    
}

.input-shortdescription2 {
    font-size:11px;
    font-style: italic;
    font-weight:normal;
    color: black;    
    margin-top: -17px;        
}

.input-shortdescription-red {
    font-size:11px;
    font-style: italic;
    font-weight:normal;
    color: red;
    display: inline-block; 
    margin-top: 13px;
    margin-left: 5px; 	
}

.input-shortdescription-red2 {
    font-size:8px;
    font-style: italic;
    font-weight:normal;
    color: red;
    display: inline-block; 
    margin-top: 13px;
    margin-left: 5px; 		
}

.hr-title {
	/* none */
	/*border: 0; 
	height: 0px; */
	/* style-two */	
	border: 0; 
	height: 1px; 
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); 
}

.vr-line {
	/* none */
	/*border: 0; 
	height: 0px; */
	/* style-two */	
	border: 0; 
	height: 260px; 
	width: 1px; 
	background-color: orange;
	border-radius: 50%;
	/*background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); */
}

/* Gradient color1 - color2 - color1 */ 
hr.style-one { 
	border: 0; 
	height: 1px; 
	background: #333; 
	background-image: linear-gradient(to right, #ccc, #333, #ccc); 
}

/* Gradient transparent - color - transparent */ 
hr.style-two { 
	border: 0; 
	height: 1px; 
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); 
}

/* Double-color dashed line */ 
hr.style-three { 
	border: 0; 
	border-bottom: 1px dashed #ccc; 
	background: #999; 
}

/* Single-direction drop shadow */ 
hr.style-four { 
	height: 12px; 
	border: 0; 
	box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5); 
}

/* Cloud */ 
hr.style-five { 
	border: 0; 
	height: 0; 
	/* Firefox... */ 
	box-shadow: 0 0 10px 1px black; 
} 
hr.style-five:after { 
	/* Not really supposed to work, but does */ 
	content: "\00a0"; 
	/* Prevent margin collapse */ 
}

/* Inset, by Dan Eden */ 
hr.style-six { 
	border: 0; 
	height: 0; 
	border-top: 1px solid rgba(0, 0, 0, 0.1); 
	border-bottom: 1px solid rgba(255, 255, 255, 0.3); 
}

/* Flaired edges, by Tomas Theunissen */
hr.style-seven { 
	height: 30px; 
	border-style: solid; 
	border-color: black; 
	border-width: 1px 0 0 0; 
	border-radius: 20px; 
} 
hr.style-seven:before { 
	/* Not really supposed to work, but does */ 
	display: block; 
	content: ""; 
	height: 30px; 
	margin-top: -31px; 
	border-style: solid; 
	border-color: black; 
	border-width: 0 0 1px 0; 
	border-radius: 20px; 
}

.form-inline .form-group{
    margin-left: 0;
    margin-right: 0;
}

.error {
    font-size:14px;    
    //font-weight: bold;
    color: #a94442;;
    float:left;		
		position: absolute;		
}

table {
	width: 50%;
}

table.detail-view {	
	border:1px solid #fff !important; 
}
table.detail-view tbody tr:nth-child(even) {
	background:#E5F1F4; 
	border-color:#fff; 
	min-width:20%; 		
}
table.detail-view tbody tr:nth-child(odd) {
	background:#F8F8F8;  
	border-color:#fff; 
	min-width:20%; 	
}
table.detail-view tbody td {
	//border-color:#fff; 
	min-width:78%;			
}

table.detail-view tbody tr.header { 
	background:#95C8D5; 
}
table.detail-view tbody tr.header th {
	text-align:left; 
	min-width:20%; 
}

table.detail-view-pos th {		
	padding:0px !important; 
	height:10px !important;	
	border:0px !important; 
}

table.kv-grid-table-pos td {		
	padding:0px !important; 
	height:10px !important;	
	border:0px !important; 
}

table.kv-grid-table-type1 td {		
	padding:1px !important; 
	height:25px !important;	
	border:0px !important; 
}

table.kv-grid-table-type2 td {		
	padding:1px !important; 
	height:25px !important;	
	border:1px solid rgb(220,220,220) !important; 
}

table.kv-grid-table-type3 td {		
	padding:1px !important; 
	height:25px !important;	
	border:0px solid rgb(220,220,220) !important; 
	border-bottom: 1px solid #ccc !important;	
}

@media print {
  a[href]:after {
    content: none !important;
  }
}

/*#warning-message {
	display: none; 
}
*/

/* increase index for autocomplete, higher than modal form */
.ui-autocomplete { 
  z-index:2147483647;
}

.note
{
    font-size:12px;
    //font-style: italic;
    //color: red;
    float:left;		
		position: absolute;	
}

.text-blink{   
  animation-duration: 800ms;
  animation-name: blink;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@keyframes blink {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.radio-inline { 
	display:inline; 
	//font-size:24px;
}


.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -60px;
    padding: 0 0 60px;
}

.wrap > .container {
    padding: 60px 20px 20px;
    width: 100%;
}

.footer {
    height: 60px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}

.jumbotron {
    text-align: center;
    background-color: transparent;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.not-set {
    color: #c55;
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    padding-left: 5px;
}

a.asc:after {
    content: /*"\e113"*/ "\e151";
}

a.desc:after {
    content: /*"\e114"*/ "\e152";
}

.sort-numerical a.asc:after {
    content: "\e153";
}

.sort-numerical a.desc:after {
    content: "\e154";
}

.sort-ordinal a.asc:after {
    content: "\e155";
}

.sort-ordinal a.desc:after {
    content: "\e156";
}

.grid-view th {
    white-space: nowrap;
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;       
}

.error-summary {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

.error-summary2 {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

.text-blink{   
	animation-duration: 700ms; /* default 800ms */
	animation-name: blink;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}
@keyframes blink {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}

.modal-dialog {
	width: 1200px;	
	margin: 30px auto;
}

/* for kartik datepicker, css disabled day */
table.table-condensed td.disabled.day {			
	background: #dddddd;
}