@import url("//fonts.googleapis.com/css?family=Cantarell|Fjalla+One");
@import url("https://use.fontawesome.com/releases/v5.5.0/css/all.css");

*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }

html {
  font-size: 15px;
}
html, body {
  font-family: 'Cantarell', sans-serif;
  background: #f9fbff;
	color: #494949;
}
h1,h2,h3,h4,h5 {
  color: #494949;
  font-family: 'Fjalla One', sans-serif;
}

a {
	color: #2CC185;
	text-decoration: none;
	outline: none;
}

a:hover, a:focus {
	color: #74777b;
}

.container > section {
	padding: 5em 0;
	font-size: 1.25em;
	min-height: 100%;
}

p {
	text-align: center;
	padding: 1em;
}

@media screen and (max-width: 30em) {
	.container > section {
		padding: 3em 0;
	}
}

.selectize-input.dropdown-active  {
     border-radius: 0;
 }
 
.selectize-input {
  border-radius: 0;
  border: 1px solid #dddddd;
}
.selectize-control.single .selectize-input::after {
   border-color: #707070 transparent transparent transparent;
}
.main_heading {
  text-align:center;
}
.main_heading h1, .main_heading .form-group {
  display:inline-block;
}
.main_heading .form-group {
  text-align:left;
  width: auto;
}

.main_heading .form-group .selectize-dropdown {
  min-width:250px;
}

.main_heading .form-group .selectize-input {
  border:0;
  overflow:inherit;
  padding-left: 3px;
  border-bottom: 2px solid #4d7b8e;
  padding-bottom: 2px;
  background-color: #f9fbff;
}

.main_heading .form-group .selectize-input, .main_heading .selectize-control.single .selectize-input input {
  color:#4d7b8e;
}

.main_heading .form-group .selectize-input.focus {
  box-shadow:none;
  background-color: #f9fbff;
}

.main_heading .selectize-control.single .selectize-input::after {
  right:0;
  margin-top:-3px;
  border-color: #4d7b8e transparent transparent transparent;
}
.main_heading .selectize-control.single .selectize-input.dropdown-active::after {
  border-color: transparent transparent #4d7b8e transparent;
}

.main_heading .form-group .selectize-input .item, .main_heading .selectize-control.single .selectize-input input,
.main_heading h1 {
  font-family: 'Fjalla One', sans-serif;
  font-size: 2.5rem;
}

.main_heading .selectize-control { 
  margin-bottom: 0;
}

.leaflet .legend{
  float: left; 
  text-align: left;
}

.row{
  padding-top: 10px;
  padding-bottom: 10px;
}
.content .row > div{ /*col*/
  padding-left: 10px;
  padding-right: 10px;
}

/*
#rmu_text2,
#consumption_text2,
#productivity_text2 {
  margin-top: 20px;
}
*/

/* our reference disclaimer */
.col-sm-12.well {
  /*
  margin-left: 10px;
  margin-right: 10px;
  */
  padding: 19px;
}

h2 {
  margin-top: 10px;
  margin-bottom: 10px;
}

.shiny-html-output {
  text-align: justify;
}


/* Tooltip container */
.scp_tooltip,
.scp_tooltip_bottom {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}
/* Tooltip text */
.scp_tooltip .scp_tooltiptext,
.scp_tooltip_bottom .scp_tooltiptext {
  visibility: hidden;
  background-color: black;
  color: #fff;
  text-align: left;
  padding: 5px 5px;
  border-radius: 6px;
  
  /* text formatting */
  font-size: 0.7em;
  
  /* Position the tooltip text */
  position: absolute;
  z-index: 1;
  
  width: 300px;
  left: 50%;
  margin-left: -150px; /* Use half of the width (120/2 = 60), to center the tooltip */
}
.scp_tooltip .scp_tooltiptext {
  bottom: 100%;
}
.scp_tooltip_bottom .scp_tooltiptext {
  top: 100%;
}
/* Show the tooltip text when you mouse over the tooltip container */
.scp_tooltip:hover .scp_tooltiptext,
.scp_tooltip_bottom:hover .scp_tooltiptext {
  visibility: visible;
}

.color-orange {
        color: #EB9B4D
    }
    .color-red {
color: #A8474B;
    }

    .color-teal {
color: #59CC92;
    }
    .color-green {
color: #6da34d;
    }
.color-cyan {
  color: #63c2de;
}
    .color-blue {
color: #4d7b8e;
    }
    .color-purple {
color: #8F599B;
    }
.color-darkgrey {
  color: #525252;
}
.color-grey {
  color: grey;
}
    .bg-orange {
        background-color: #EB9B4D
    }
    .bg-red {
background-color: #A8474B;
    }

    .bg-teal {
background-color: #59CC92;
    }
    .bg-green {
background-color: #6da34d;
    }
    .bg-cyan {
      background-color: #63c2de;
    }
    .bg-blue {
background-color: #4d7b8e;
    }
    .bg-purple {
background-color: #8F599B;
    }
    .bg-grey{
      background-color: grey;
    }