html, body {
    height: 100%;
    
/**  background-color: #a1b2c3;   **/

/*  background: whitesmoke;  */
/* background-image: url('./chalkboard.jpg'); */
/* background-image: url('./dd76b902.png'); */
/**/ background-image: url('./../images/back_win_D.png'); /* */

/* background-image: url('./ocean.gif'); */
/* background-size: cover; */

/** background-image: url('./back.png'); **/
/** background-size: cover; **/

}
/*
.my-navbar {
    background-color: #a1b2c3;
}
.navbar-gio {
    color: #FFFFFF;
    background-color: #c6c6c6;  // 1A4C80
}
*/

.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -60px;
    padding: 0 0 60px;	
/**
	//    background: whitesmoke;
	//    background-image: url('./back_win.png');
**/		
}

.wrap > .container {
/* thi do the trick for full screen... */
	width: 98%;

    padding: 70px 2px 20px; 
			/* 70 15 20 */	
/*	
	// background: red;
	// background-image: url('./back_win.png');
*/	
}

.footer {
    height: 60px;
/*    background-color: #f5f5f5;            */
/*    background-color: rgb(68, 110, 155);  */  /* 449B6E */
/**/    background-color: rgb(225, 225, 225); /**/

    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;
}


	.giogrid {
		width:100%;
		border:3px solid #C0C0C0;
		border-collapse:collapse;
		padding:5px;
	}
	.giogrid caption {
		border:1px solid #C0C0C0;
		padding:5px;
                /* font-size: 19px; */
                font-weight: bold;
		color:#000000;
		/* background:#F0F0F0; */
                background:#7db9e8;
	}
	.giogrid th {
		border:1px solid #C0C0C0;
		padding:5px;
		background:#F0F0F0;
                /* background:#7db9e8; */
		/* background:#2989d8; */
	}
	.giogrid td {
		border:1px solid #C0C0C0;
		padding:5px;
	}


/* body{margin:40px;} */

.stepwizard-step p {
    margin-top: 10px;    
}

.stepwizard-row {
    display: table-row;
}

.stepwizard {
    display: table;     
    width: 100%;
    position: relative;
}

.stepwizard-step button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

.stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    z-order: 0;
    
}

.stepwizard-step {    
    display: table-cell;
    text-align: center;
    position: relative;
}

.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 15px;
}
/******************************************************************************/
/* Modals */
/******************************************************************************/
/*    
    .modal-backdrop {
        background-color: gray;
    }    
*/    
    .modal-content{
        background-color: lightgray;
    }    
/******************************************************************************/

/******************************************************************************/
/* x WorkArea */
/******************************************************************************/
@media (min-width: 600px){  /* 768 */
  #left {
    position:fixed !important;
    position: absolute; 
/*    position: fixed; */
    top: 52px; 
/*    top: 0;  */
    bottom: 0;
    left: 0;
/*    width: 30%; */
    width: 360px; 
/*    float: left; */
/*    overflow-y: scroll;*/
/*    overflow: hidden;*/
    overflow-y: auto;
/*     display: table-cell; */
padding: 2px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;     
  }
  
  #right {
      position:fixed !important;
    position: absolute;
    top: 52px; 
/*    top: 0; */
    bottom: 0;
/*    right: 0; */
    left: 360px; 
/*    width: 70%;  */
    width: calc(100vw - 360px); 
/*    overflow-y: scroll;*/
/*    overflow: hidden;*/
    overflow-y: auto;
/*     display: table-cell; */
padding: 0 2px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;     
  }
}

#left {
/**  background-color: rgb(175, 180, 188);  **/
/**  background-color: rgb(102, 116, 140); **/
/**  background-color: whitesmoke; **/
/* background-image: url('./dd76b902.png'); */    
/* background-image: url('./dd76b902.png'); */    
/** background-size: cover; **/

  text-align: center;
  height:100%;
}
#right {
/*  background-color: #4FC1E9; */
/* background-image: url('./dd76b902.png'); */    
/* background-image: url('./dd76b902.png'); */    
  text-align: center;
/*  height:100%; */
  height:100%;
/*  
background: rgb(40,52,59);
background: -moz-linear-gradient(top,  rgba(40,52,59,1) 0%, rgba(130,140,149,1) 64%, rgba(181,189,200,1) 100%);
background: -webkit-linear-gradient(top,  rgba(40,52,59,1) 0%,rgba(130,140,149,1) 64%,rgba(181,189,200,1) 100%);
background: linear-gradient(to bottom,  rgba(40,52,59,1) 0%,rgba(130,140,149,1) 64%,rgba(181,189,200,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28343b', endColorstr='#b5bdc8',GradientType=0 );
*/  
}    

.firstfree {
    width:100%;
    border:1px solid #C0C0C0;
    border-collapse:collapse;
    border-spacing:2px;
    padding:5px;
    text-align:center;
    margin-left: auto;  /* align table in center... */ 
    margin-right: auto; /* align table in center... */
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#b4e391+0,61c419+50,b4e391+100 */
background: rgb(180,227,145); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(180,227,145,1) 0%, rgba(97,196,25,1) 50%, rgba(180,227,145,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(180,227,145,1) 0%,rgba(97,196,25,1) 50%,rgba(180,227,145,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(180,227,145,1) 0%,rgba(97,196,25,1) 50%,rgba(180,227,145,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4e391', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */
}
    
.calendar {
    width:100%;
		border:1px solid #C0C0C0;
		border-collapse:collapse;
		border-spacing:2px;
		padding:5px;
		text-align:center;
            margin-left: auto;  /* align table in center... */ 
            margin-right: auto; /* align table in center... */            
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#28343b+0,828c95+64,b5bdc8+100 */
background: #28343b; /* Old browsers */
background: -moz-linear-gradient(top,  #28343b 0%, #828c95 64%, #b5bdc8 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #28343b 0%,#828c95 64%,#b5bdc8 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #28343b 0%,#828c95 64%,#b5bdc8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28343b', endColorstr='#b5bdc8',GradientType=0 ); /* IE6-9 */
}
	.calendar caption {
		caption-side:top;
		text-align:center;
		// background:gray;    // #F0F0F0
		color:white;
	}
	.calendar th {
		text-align:center;
		border:1px solid #C0C0C0;
		padding:5px;
		/* background:#F0F0F0; */
	}
	.calendar td {
		border:1px solid #C0C0C0;
		text-align:center;
		padding:5px;
		/* background:#FFFFFF; */
                // color:whitesmoke;
	}
            
/******************************************************************************/    
    
.legends {
    width:100%;
		// border:1px solid #C0C0C0;
		border-collapse:collapse;
		border-spacing:2px;
		padding:5px;
		text-align:center;
            margin-left: auto;  /* align table in center... */ 
            margin-right: auto; /* align table in center... */            
/*            
background: #28343b;
background: -moz-linear-gradient(top,  #28343b 0%, #828c95 64%, #b5bdc8 100%);
background: -webkit-linear-gradient(top,  #28343b 0%,#828c95 64%,#b5bdc8 100%);
background: linear-gradient(to bottom,  #28343b 0%,#828c95 64%,#b5bdc8 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28343b', endColorstr='#b5bdc8',GradientType=0 );
*/
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100;Neutral+Density */
background: -moz-linear-gradient(left,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */

}
	.legends caption {
		caption-side:top;
		text-align:center;
//		background: gray;   // #F0F0F0;
                color:cyan;   // whitesmoke
	}
	.legends th {
		text-align:center;
		// border:1px solid #C0C0C0;
		padding:5px;
		/* background:#F0F0F0; */
                color:white;
	}
	.legends td {
		// border:1px solid #C0C0C0;
		text-align:center;
		padding:5px;
		/* background:#FFFFFF; */
                color:lightgray;
	}
            
/******************************************************************************/    
    
.funkey {
    width:100%;
                border:0px solid #C0C0C0;
		border-collapse:collapse;
		border-spacing:0px;
		padding:5px;    /* 5 */
		text-align:center;
            margin-left: auto;  /* align table in center... */ 
            margin-right: auto; /* align table in center... */
/*
background: #28343b;
background: -moz-linear-gradient(top,  #28343b 0%, #828c95 64%, #b5bdc8 100%);
background: -webkit-linear-gradient(top,  #28343b 0%,#828c95 64%,#b5bdc8 100%);
background: linear-gradient(to bottom,  #28343b 0%,#828c95 64%,#b5bdc8 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28343b', endColorstr='#b5bdc8',GradientType=0 ); 
*/
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#b5bdc8+0,828c95+36,28343b+100 */
background: #b5bdc8; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #b5bdc8 0%, #828c95 36%, #28343b 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  #b5bdc8 0%,#828c95 36%,#28343b 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #b5bdc8 0%,#828c95 36%,#28343b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#28343b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

    }
	.funkey caption {
		caption-side:top;
		text-align:center;
		background:#F0F0F0;
	}
	.funkey th {
		text-align:center;
		border:0px solid #C0C0C0;
		padding:2px;
		/* background:#F0F0F0; */
	}
	.funkey td {
		text-align:center;
		border:0px solid #C0C0C0;
		padding:2px;
		/* background:#FFFFFF; */
	}
        
        
.custom {
    width: 150px;
}        

.customX {
    width: auto;
}        

/******************************************************************************/