html > body {
  font-family: 'Roboto', sans-serif;
  background-color: #f5f5f5;
  color: #454d55;
  font-size: 12pt;
  padding-bottom: 70px;
}
a {color: #009ff2; text-decoration: none;}
a:hover {text-decoration: none;}

div.header, div.footer {background-color: #4E6038; color: white; padding: 5px; text-align: center;}
div.header {margin: 0 !important;}
div.header img {height: 40px;}
@media (min-width: 600px) {
  div.header img {height: 60px;}
}
@media (min-width: 900px) {
  div.header img {height: 80px;}
}
div.header a {color: white;}
div.header a:hover {color: #D6D6D6;}

div.container {max-width: 850px;}

#loading {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); z-index: 9998; display: none;}
#loading div.loader {position: relative; width: 200px; top: 200px; left: 50%; margin-left: -100px;}

img.div-img {width: 100%;}

@media (min-width: 100px) {
  img.div-img-100 {width: 100px;}
}

@media (min-width: 250px) {
  img.div-img-250 {width: 250px;}
}

@media (min-width: 300px) {
  img.div-img-300 {width: 300px;}
}

@media (min-width: 350px) {
  img.div-img-350 {width: 350px;}
}

@media (min-width: 400px) {
  img.div-img-400 {width: 400px;}
}

@media (min-width: 768px) {
  img.div-img-500 {width: 500px;}
  img.div-img-600 {width: 600px;}
  img.div-img-700 {width: 700px;}
}

/*FORM*/
.alert-form {
  display: none;
  background-color: #bf322f;
  color: white;
  padding: 0 5px;
  margin: 3px 0;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}
.ok-form {
  display: none;
  font-weight: normal;
  background-color: #006929;
  color: white;
  padding: 0 5px;
  margin: 20px;
  padding: 10px;
  text-align: center;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}
.alert-form a, .ok-form a {
  color: white;
  font-weight: bold;
  text-decoration: underline;
}
div.custom-control.custom-radio {line-height: 17pt;}
div.custom-control.custom-checkbox {font-size: 1rem;}
.form-control-grey {background-color: #F0F0F0;}

div.loading {
  display: none;
  width: 100%;
  padding: 5px;
  margin: 0 auto;
  text-align: center;
  border: solid 2px #CCCCCC;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  background-color: white;
  color: black;
}
div.loading div.progress_bar {
  margin-top: 3px;
}
div.loading div.progress_bar div.bar_container {
  width: 100%;
  height: 8px;
  padding: 1px;
  margin-top: 6px;
}
div.loading div.progress_bar div.bar_container div.bar {
  background-color: #CCCCCC;
  height: 8px;
  width: 10%;
}
div.loading div.progress_bar span.percent {
  color: #CCCCCC;
}