.container-fluid,html{
background-color: white ;  
}



#welcome,#listcrit,#listHC, #choicecrit, #project, #area, #metsel,#weista,#weihi,#histogar,#choiceHC{
            background-color:#EBEFE2;
            border-style: solid;
            border-width: 1px;
            border-color: #C0C0C0;
			padding:20px;

			
}

#loginpage{
  height: 100%;
  width: 100%;
}


#welcome,#listcrit, #listHC{   
            width : auto;                       
}

#welcome.shiny-html-output.shiny-bound-output{

            background-color:#81A85E;
            border-style: solid;
            border-width: 1px;
            border-color: #C0C0C0;
			      width : 15%;
}


#choicecrit,#choiceHC{ 
            width : 100%;
            float:left;
}

#metsel{ 
            width : auto;
            
            
           
}

#maparea1,#mapareathr,#mapareaAV,#mapareaCON,#mapareaCLT,#mapareaCM{
            background-color: #EBEFE2;
            border-style: solid;
            border-width: 1px;
            border-color: #C0C0C0;
			padding:20px;
            }


.well{
            background-color:#94C73F;
            border-style: solid;
            border-width: 1px;
            border-color: #C0C0C0;
            }

#weista,#weihi{ 
             width : auto;                       
}




p{
    height : auto;
    width:auto;
}
			
table {
border: medium solid #6495ed;
border-collapse: collapse;
max-width: 100%;
}
th {
/*font-family: monospace;*/
border: thin solid #6495ed;
max-width: 50%;
padding: 5px;
background-color: #81A85E;

}
td {
/*font-family: sans-serif;*/
border: thin solid #6495ed;
max-width: 50%;
padding: 5px;
text-align: center;
background-color: #ffffff;
}

tr{
/*font-family: sans-serif;*/
border: thin solid #6495ed;
max-width: 50%;
padding: 5px;
text-align: center;
background-color: #ffffff;
}


h1,h2,h3,h4,h5,h6{

  font-family: fantasy;
  font-weight: 300;
  line-height: 1;
  
}

.shiny-output-error-validation {
        color: #850606;
		font-weight:bold;
		text-align:center;
		margin-top : 20px;
}


.shiny-progress-container {
  top: 50% !important;
  left: 50% !important;
  right:50% ;
  bottom: 50%;

  color: #020202;
  font-size: 50px;
  background-color: #020202;
  text-align: center;

}

.shiny-progress .progress {
    position: absolute;
    width: 100%;
    top: 0px;
    /* The default height is only 1px which is find to be TINY */
    height: 8px;
    margin: 0px;
}

.shiny-progress .bar {
    background-color: #FF0000;
    .opacity = 0.8;
    transition-duration: 250ms;
}

.shiny-progress .progress-text {
    position: absolute;
    right: 30px;
    height: 30px;
    width: 490px;
    background-color: #D9534F;
    padding-top: 2px;
    padding-right: 3px;
    padding-bottom: 2px;
    padding-left: 3px;
    opacity: 0.95;
    /* I also wanted to round off the corners of the text box */
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}

.progress-text {
    /* Copy the below to vertically center the progress bar text box in the shiny dashboard header */
    /* !important is crucial here otherwise it gets overridden by the dreaded element.style */
    top: 15px !important;
    color: #FFFFFF !important;
    text-align: center;
}

/* Bold Initial part of message */
.shiny-progress .progress-text .progress-message {
    padding-top: 0px;
    padding-right: 3px;
    padding-bottom: 3px;
    padding-left: 10px;
    font-weight: bold;
    font-size: 18px;
}

/* Message detail */
.shiny-progress .progress-text .progress-detail {
    padding-top: 0px;
    padding-right: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    font-size: 17px;
}
.shiny-notification{
  position:center;
  
  width:auto;
  }

.navbar-default{
background-color:#E8EEE8;
}

.navbar  .container .navbar-brand{
margin-bottom:auto;
}

.navbar-default .navbar-nav li a{

padding-top:auto;
padding-bottom:auto;
border-radius: 3px;
}

.navbar-default .navbar-nav  .active  a,.navbar-default .navbar-nav  .active  a:hover,.navbar-default .navbar-nav  .active a:focus{
background-color:#77A22F;
color:white;
width: auto;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus{
background-color:#77A22F;
color:white;
}

.navbar-default .navbar-nav > li > a:hover,.nav-tabs > li > a:hover{
background-color:#94C73F;
color:white;
}

.nav-tabs{
border-bottom:0px;
}

.nav-tabs > li > a{
color:black;
background-color:#EBEFE2;
border-bottom:1px;
}

.irs-grid-text{
color:black;
}

.irs-bar{
background:white;
}