﻿body, html { font-size:8px; padding: .5rem; }

.Foco           { font-family: foco, sans-serif; font-style: normal; }
.FocoRegular    { font-family: foco, sans-serif; font-weight: 400; font-style: normal; }
.FocoItalic     { font-family: foco, sans-serif; font-weight: 400; font-style: italic; }
.FocoBold       { font-family: foco, sans-serif; font-weight: 700; font-style: normal; }
.FocoBoldItalic { font-family: foco, sans-serif; font-weight: 700; font-style: italic;}



@media (min-width: 768px) { body, html { font-size: 10px; padding: 1rem; }
}



.navbar span { font-size:2.4rem; color: #c3c3c3}

.navbar-light .navbar-brand { color: #cecece; }
.navbar-brand > img { position: relative; top: -2px; }
li.nav-item { font-size: 2rem;   }

h2 { color: #EF5E0A; font-size: 4rem; font-family: foco, sans-serif; font-style: normal; font-weight: 700; }
h3 { color: #383838; font-size: 3rem; font-family: foco, sans-serif; font-style: normal; }

h3.orange { color: #EF5E0A; }

.grey { color: #898989; }
.green { color: #61D60E }
.ebill {width:100%; max-width:300px; height:auto; margin-top:3em; position:absolute;right:0;}


/* Forms */
form.incident { font-size: 1.2rem; color: #EF5E0A; }
form.incident .form-control-lg {font-size:1.4rem;}

.alert>.text {font-size:1.4rem;}

/*Radio Buttons*/
.radio input[type='radio'] { display: none; /*removes original button*/ }

.radio label:before { /*styles outer circle*/ content: " "; display: inline-block; position: relative; top: 5px; margin: 0 5px 0 0; width: 16px; height: 16px; border-radius: 11px; border: 2px solid #EF5E0A; background-color: transparent; }

.radio label { position: relative; }

.radio label input[type='radio']:checked + span { /*styles inside circle*/ border-radius: 11px; width: 8px; height: 8px; position: absolute; top: 9px; left: 4px; display: block; background-color: #EF5E0A; }