a,abbr,acronym,address,applet,big,blockquote,body,caption,cite,code,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,iframe,img,input,ins,kbd,label,legend,li,object,ol,p,pre,q,s,samp,small,span,
strike,strong,sub,sup,table,tbody,td,textarea,tfoot,th,thead,tr,tt,ul,var {margin:0;padding:0;border:0;outline:0;font-size:100%;font-family:'Roboto',Arial, Helvetica, sans-serif;letter-spacing:0; }
:focus { outline:0; } body{font-size:10px;line-height:1;color:#8e8e8e;background:#f2f2f2; } ol,ul{list-style:none; } blockquote:after,blockquote:before,q:after,q:before {content:""; } blockquote,q{quotes:"" ""}
* { font-variant-ligatures: none; }
html { overflow-x:hidden; }
* { -webkit-font-feature-settings: "liga" 0, "dlig" 0; }
* {	-webkit-font-variant-ligatures: no-common-ligatures; font-variant-ligatures: no-common-ligatures; }

html{overflow:-moz-scrollbars-vertical;overflow-y:scroll} .nodisplay{display:none} .clear, .c { clear:both; float:none; } .clearr, .cr { clear:right; float:none; } .clearl, .cl { clear:left; float:none; }
html, body { margin:0; padding:0; height:100%; width:100%; font-family: 'Roboto',sans-serif; background:#f2f2f2; position:relative; }

@-moz-document url-prefix() {
  body {
    font-weight: lighter !important;
  }
}

.wtf { position:absolute; bottom:20px; left:20px; }
.wtf .item { font-size:14px; }
.wtf .item .fad { font-size:24px; }
.wtf .item span { background:#1b2027; color:#f2f2f2; margin-left:20px; display:none; padding:7px 10px 5px; border-radius:3px; border-bottom-left-radius:0px; position:absolute; white-space:nowrap; transform:translateY(-10px); }
.wtf .item:hover span { display:inline-block; }
.wtf .item span::before { width:0; height:0; border-style:solid; border-width:0 0 10px 10px; border-color:transparent transparent #1b2027 transparent; content:""; display:block; position:absolute; left:-10px; bottom:0; }

.container { padding:0 25px; }

header { background:#141423; position:sticky; top:0; left:0; width:100%; min-height:50px; }
header .row { padding:5px 0; display:grid; grid-template-columns:250px 50px 1fr; }
header .row .brand img { display:inline-block; height:70px; margin-right:20px; width:auto; }
header span.hello { font:400 16px/30px 'Roboto',sans-serif; letter-spacing:0; color:#fff; text-align:right; display:block; margin-top:15px; vertical-align:middle; }
header span.hello a { font:400 30px/1em 'Roboto',sans-serif; letter-spacing:0; color:#fff; display:inline-block; transform:translateY(6px); margin-left:10px; }
header span.hello a:hover { color:#aaa; }

.back-btn { display:inline-block; text-decoration:none; background:#aaa; color:#fff; text-align:center; padding:10px; text-transform:uppercase; letter-spacing:0.1em; font:700 12px/1em 'Roboto',sans-serif; border:0; cursor:pointer; margin-bottom:15px; }
.back-btn:hover { background:#303654; color:#fff; }
.add-btn { display:inline-block; text-decoration:none; background:#303654; color:#fff; text-align:center; padding:10px; text-transform:uppercase; letter-spacing:0.1em; font:700 12px/1em 'Roboto',sans-serif; border:0; cursor:pointer; margin:15px 0 0 auto; display:table; }
.add-btn:hover { background:#aaa; color:#fff; }

.vaccination-grid { border:1px solid #ddd; margin-top:50px; }
.vaccination-grid .vaccination-row { display:grid; grid-template-columns:200px 1fr 150px; background:#fff; }
.vaccination-grid .vaccination-row:nth-child(odd) { background:#eff3fd; }
.vaccination-grid .vaccination-row:hover { background:#d6dbe7 !important; }
.vaccination-grid .vaccination-row > div { padding:10px; box-sizing:border-box; }
.vaccination-grid .vaccination-row > div span { font:400 16px/30px 'Roboto',sans-serif; letter-spacing:0; color:#000; }
.row-options { text-align:right; }
.row-options a { text-decoration:none; color:#61768b; font-size:28px; margin-left:20px; display:inline-block; opacity:.5; filter:grayscale(50); }
.row-options a:hover { opacity:1; filter:grayscale(0); }
.row-options a.btn-edit { color:#0ac0c9; }
.row-options a.btn-delete { color:#c9230a; }

label { font:400 14px/1.3em 'Roboto',sans-serif; letter-spacing:0; color:#000; width:auto; }
label > span { font:400 18px/1.3em 'Roboto',sans-serif; letter-spacing:0; color:#000; width:auto; display:block; margin-top:13px; }
.form-control { padding:10px 10px; font:400 18px/1.3em 'Roboto',sans-serif; letter-spacing:0; color:#000; width:100%; box-sizing:border-box; border:0; display:block; margin-top:3px; }
label > span .form-control { display:inline-block; padding:0; width:auto; margin-right:10px; }
select.form-control { width:100%; }
input[type=submit].form-control { padding:16px 30px; background:#303654; color:#fff; text-align:center; width:inherit; text-transform:uppercase; letter-spacing:0.1em; font:700 12px/1em 'Roboto',sans-serif; border:0; cursor:pointer; display:inline-block; }
input[type=submit].form-control:hover { color:#000; background:#fff; }
.form-fields { margin-top:50px; padding:15px; border:1px solid #ddd; background:#eff3fd; }
.form-fields > div { display:grid; grid-template-columns:200px 300px 1fr; grid-column-gap:50px; }
.form-fields > div.form-test { display:grid; grid-template-columns:150px 200px 200px 100px 1fr; grid-column-gap:50px; }
section { padding:25px; }

.fullscreen { width:100%; height:calc(100vh - 85px); box-sizing:border-box; display:flex; align-items:center; background:#f2f2f2; }

.form-signin { width:300px; margin:0 auto; background:#fff; box-sizing:border-box; box-shadow:3px 3px 5px 0px rgba(0,0,0,.1); padding:15px; }

h2 { font:400 30px/1.3em 'Roboto',sans-serif; letter-spacing:0; color:#000; text-align:left; margin-bottom:15px; }
p { font:300 12px/1.5em 'Roboto',sans-serif; letter-spacing:0; color:#000; text-align:left; margin-bottom:0px; display:block; }

.form-signin .h3 { font:400 20px/1.3em 'Roboto',sans-serif; letter-spacing:0; color:#000; text-align:center; margin-bottom:15px; }

.form-signin input[type=password], .form-signin input[type=email] { padding:5px 0; font:300 16px/1.3em 'Roboto',sans-serif; letter-spacing:0; color:#000; border-bottom:1px dotted #aaa; width:100%; box-sizing:border-box; text-align:center; margin-bottom:15px; }
.form-signin button { background:#303654; color:#fff; text-align:center; width:100%; padding:10px; text-transform:uppercase; letter-spacing:0.1em; font:700 12px/1em 'Roboto',sans-serif; border:0; cursor:pointer; }
.form-signin button:hover { background:#1b2027; }
.form-signin .text-muted { text-align:center; padding:15px; font:400 11px/1.4em 'Roboto',sans-serif; }
.form-signin .text-muted a { font:inherit; color:inherit; }
.error { font:700 12px/1.4em 'Roboto',sans-serif; color:red; text-align:center; margin-bottom:10px; display:block; }

.page { padding-top:50px; }

.options { display:flex; align-items:stretch; margin-top:50px; }
.box-item { padding:15px; background:#fff; width:250px; box-sizing:border-box; border:1px solid #ddd; margin:0 15px 15px 0; border-radius:10px; text-decoration:none; }
.box-item .icon { display:block; width:100%; font-size:72px; color:#354d6e; margin-bottom:15px; text-align:center; }
.box-item .title { font:400 20px/1.3em 'Roboto',sans-serif; letter-spacing:0; color:#000; text-align:center; margin-bottom:15px; display:block; }
.box-item .description { font:300 12px/1.5em 'Roboto',sans-serif; letter-spacing:0; color:#000; text-align:center; margin-bottom:0px; display:block; }
.box-item:hover { background:#354d6e; }
.box-item:hover * { color:#fff; }