
/** Google Fonts **/

@import url('https://fonts.googleapis.com/css?family=Muli:600,700');


/** General Styles **/

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}


html, body {
  font-family: 'Muli', sans-serif;
  height: 100%;
  background-color: #ffd3b6;

}


/** Navigation **/

div#bs-example-navbar-collapse-1.collapse.navbar-collapse {
  font-size: 15px !important;
}
ul.dropdown-menu li a {
  font-size: 15px !important;
}

.navbar-default {
  background-color: #0d0a38;
}

.nav.navbar-nav.navbar-right li a {
  color: #eadbdb;
}

.nav.navbar-nav.navbar-right li a:hover {
  color: #b4969a;
}

.navbar-default .navbar-nav>.active>a {
  background-color: #0b134d;
}

.navbar {
  margin-bottom: 0;
  border: 0;
  border-radius: 0;
}

.navbar-brand {
  padding: 0;
}

.navbar-nav {
  margin-bottom: 0px;
}

.navbar-brand > img {
  width: auto;
  height: 100%;
  padding: 0;
}

.dropdown-menu {
    padding: 0;
}

.dropdown-menu > li {
  text-align: left;
  font-size: 15px;
  border-bottom: 2px solid #fff;
  padding: 0;
}

.dropdown-menu > li > a {
  background-color: #0b134d;
  color: #fff;
}

.dropdown-menu > li > a > img {
  height: 1.2em;
  width: 2em;
  margin-left: 0px;
}

@media (min-width: 979px) {
  ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
  }
}

/** Header **/

h1 {
  text-align: center;
  font-weight: 700;
  margin-bottom: .5em;
}


/** Input **/

.no-spinners {
  -moz-appearance: textfield;
}

.no-spinners::-webkit-outer-spin-button,
.no-spinners::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#patientAge {
  margin-left: 2em;
  margin-right: .8em;
  font-size: 18px;
}

#ageInYears, #month {
width: 3em;
height: 1.8em;
}

/** Table **/

thead {
  background-color: #000;
  color: #fff;
}

tr:nth-child(even) {background: #ccc}

.table-nonfluid {
   width: auto !important;
   margin-left: 2em;
   margin-top: .5em;
}

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: #d6fcca;
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th  {
  padding: 4px;
  font-size: 15px;
}

#thSecond {
  width: 22%;
}

.color {
  background-color: #d6fcca !important;
}

/** Checkboxes **/

[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
}

[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
    position: relative;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    margin-bottom: 1em;
text-align: center;
margin-left: 2em;
}

[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
    content: '';
    position: absolute;
    left: 0px; top: 0px;
    width: 18px; height: 18px;
    border: 2px solid #000;
    background: #ffffff;
    border-radius: 20px;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
}

[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
    content: '✔';
    position: absolute;
    top: -1px; left: 2px;
    font-size: 16px;
    line-height: 1.2;
    color: #ff0000;
    transition: all .2s;
}

[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
    box-shadow: none;
    border-color: #999999;
    background-color: #dddddd;
}

[type="checkbox"]:disabled:checked + label:after {
    color: #999999;
}

[type="checkbox"]:disabled + label {
    color: #aaaaaa;
}

[type="checkbox"]:not(:checked) + label:after {
    opacity: 0;
    transform: scale(0);
}

[type="checkbox"]:checked + label:after {
    opacity: 1;
    transform: scale(1);
}

label:hover:before {
    border: 2px solid #4778d9!important;
    background: #ffffff
	}


/** Outputs **/

#outputs {
  font-weight: 700;
  font-size: 18px;
  margin-top: 10em;
}

#outputHolm, #outputGA1, #outputGA2 {
  color: red;
}


/** Footer **/

footer {
  margin-left: 2em;
}


/** Media Queries **/

@media (max-width:860px) {
  .table-nonfluid {
    margin:0;
  }

  #outputs {
    font-weight: 700;
    font-size: 15px;
    margin-top: 1em;
  }
  footer {
    margin-left: 0em;
  }
}
