app/assets/stylesheets/application.css
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
* compiled file so the styles you add here take precedence over styles defined in any styles
* defined in the other CSS/SCSS files in this directory. It is generally better to create a new
* file per style scope.
*
*= require_tree .
*= require_self
*/
html{
overflow: auto;
}
body{
position: absolute;
margin:0;
padding:0;
top:0;
left:0;
width:100%;
height:100%;
font-size: 20px;
font-family: 'Open Sans', 'Trebuchet MS', Helvetica, Garuda, sans-serif;
z-index: 1;
font-weight: lighter;
/****/
}
label{
font-size:14px;
}
a, input {
color:black;
text-decoration: none;
}
fieldset {
overflow-y:scroll;
height:200px;
display: inline-block;
}
#download_button,
.panel_container button, td a {
top:0;
border:none;
background:none!important;
padding:0!important;
font: inherit;
text-align:center;
cursor:pointer;
height:80px;
vertical-align:top;
color:white;
text-decoration: none;
outline:none;
}
/** App header **/
.header{
position:relative;
top:0;
left:0;
margin-top: 0;
padding:18px 0;
overflow:hidden;
}
.header span{
position: relative;
text-align: left;
bottom:0;
}
/** App Content **/
.content{
left:0;
height:100%;
min-width: 807px;
padding-left:250px;
font-size: 14px;
position:absolute;
border:none;
right:0;
z-index: 1;
overflow: scroll;
}
.content h1{
width:90%;
position:relative;
margin: 15px auto;
}
.half-width, .half-width-shifted{
position: relative;
margin-left: auto;
margin-right: auto;
text-align: left;
}
.half-width-shifted img{
float:left;
position: relative;
top:5px;
margin-right:80px;
margin-bottom:50px;
}
.half-width-shifted{
padding:0;
width:550px;
height:auto;
top:50%;
transform: translateY(-50%);
}
.half-width-shifted h1{
margin-bottom: 10px;
}
.half-width{
top:0;
padding:40px 80px 40px 80px;
border:1px solid rgb(0,105,73);
border-radius:5px;
background-color:rgb(255,255,254);
color:black;
width:450px;
margin-top: 15px;
height:auto;
}
.half-width.narrow{
width:300px;
}
.flash{
position:relative;
margin-left: auto;
margin-right: auto;
bottom:0;
color:rgb(0, 105, 73);
}
/** Table Formatting **/
.table_container{
position:relative;
margin-top:20px;
max-height:550px;
width:90%;
margin-left: auto;
margin-right: auto;
overflow-x: auto;
overflow-y: hidden;
border: 1px solid #ddd;
z-index: 7;
}
.table_header_container, .scrolling_table {
width:100%;
position:relative;
top:0;
border:none;
overflow-y: scroll;
}
.table_header_container{
z-index: 2;
background-color:rgb(255,255,254);
top:0;
left:0;
border-bottom: 1px solid #ddd;
border-left: 1px solid white;
overflow-x: hidden;
padding:0;
}
.table_header_container a{
color: black;
text-decoration:none;
}
.scrolling_table{
z-index:5;
height:550px;
display:block;
box-shadow: 0 1px 1px #ccc;
background-color:#fff;
overflow-x: auto;
}
#table_header, #patients_table{
top:0;
table-layout: fixed;
font-size: 18px;
border-collapse: collapse;
border-spacing:0;
width:100%;
}
#table_header{
position: relative;
text-align: center;
left:-1px;
padding:0;
}
#table_header th,
#patients_table td{
border-left:1px solid #ddd;
}
#table_header th{
width:152px;
overflow:hidden;
padding:0 1px;
}
#patients_table td{
padding-left:5px;
width:148px;
overflow:hidden;
white-space:nowrap;
}
#patients_table tr:nth-child(even) {
background: rgb(244, 245, 247);
}
#patients_table tbody tr:hover {
background: #eee;
transition: all 0.1s ease-in-out;
}
/** Scrollbar **/
.table_header_container::-webkit-scrollbar,
.scrolling_table::-webkit-scrollbar {
width: 5px;
height: 5px;
}
.scrolling_table::-webkit-scrollbar-track{
-webkit-box-shadow: inset 0 0 6px rgb(0, 105, 73);
-moz-box-shadow:inset 0 0 6px rgb(0, 105, 73);
box-shadow:inset 0 0 6px rgb(0, 105, 73);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.scrolling_table::-webkit-scrollbar-thumb {
background: rgb(249, 253, 254);
-webkit-box-shadow: inset 0 0 1px rgb(0, 105, 73);
-moz-box-shadow: inset 0 0 1px rgb(0, 105, 73);
box-shadow:inset 0 0 1px rgb(0, 105, 73);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.scrolling_table::-webkit-scrollbar-thumb:window-inactive {
background: white;
}
/** Filters **/
.filters{
margin-left:auto;
margin-right:auto;
position:relative;
max-width:90%;
background:rgb(248, 248, 248);
border-radius:10px;
border:none;
overflow-y:auto;
}
.sliding.open:before{
z-index: 11;
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 41px;
top: -15px;
border-style: solid;
border-color: #e7e7e7 transparent #e7e7e7 transparent;
border-width: 0 9px 15px;
}
.sliding.open:after{
z-index:15;
content: ' ';
position: absolute;
width: 0;
height: 0;
left: 42px;
top: -13px;
border-style: solid;
border-color: rgb(248, 248, 248) transparent rgb(248, 248, 248) transparent;
border-width: 0 8px 13px;
}
.sliding {
height:0;
-webkit-transition:height, 0.5s linear;
-moz-transition: height, 0.5s linear;
-ms-transition: height, 0.5s linear;
-o-transition: height, 0.5s linear;
transition: height, 0.5s linear;
overflow-y:auto;
}
.sliding.open {
height:390px;
-webkit-transition:height, 0.5s linear;
-moz-transition: height, 0.5s linear;
-ms-transition: height, 0.5s linear;
-o-transition: height, 0.5s linear;
transition: height, 0.5s linear;
border: 1px solid #e7e7e7;
overflow:visible;
}
.field_filters{
overflow-y:auto;
}
.field_filters, .input_filters{
margin-left: 25px;
position: relative;
width:100%;
height:auto;
}
.field_filters form{
margin-left:5px;
float:left;
}
.filters h4{
margin-bottom: 3px;
}
.input_filters {
float:right;
clear:right;
}
.input_filters form{
margin-left: 15px;
}
.bottom-right{
position:relative;
bottom:0;
text-align:right;
}
/** Button appearance **/
.button_link {
background:none!important;
border:none;
padding:0!important;
font: inherit;
border-bottom:1px solid #444;
cursor: pointer;
text-decoration: none;
}
.div_button,
.option-button {
position:relative;
height:24px;
display: inline-block;
vertical-align: middle;
line-height: 14px;
font-size:14px;
cursor: pointer;
text-align: center;
background-color:rgb(0, 105, 73);
border-color:rgb(92,159,138);
color: rgb(245,255,245);
margin:5px;
border-width:2px;
border-radius: 3px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
.option-button{
bottom:0;
text-align:right;
right:0;
}
.div_button{
border-style:solid;
text-decoration:none;
padding:2px 10px;
height:14px;
clear:right;
right:0;
}
/** Navigation **/
.side_bar-nav{
position: relative;
width:250px;
height:100%;
display:block;
background-color: rgb(248, 248, 248);
box-sizing: border-box;
border-color: #e7e7e7;
color:rgb(0, 105, 74);
font-size:20px;
line-height: 25px;
z-index: 150;
padding: 15px 0;
float:left;
}
.side_bar-nav ul,
li{
border-bottom: 1px solid #e7e7e7;
}
li{
position:relative;
display:block;
text-align: inherit;
}
li a{
padding-left:15px;
}
.nav{
padding-left:0;
margin-bottom:0;
list-style:none;
margin-top:0;
display: block;
list-style-type: disc;
}
/** Panels **/
.panels{
position:relative;
top:0;
width:90%;
margin-left:auto;
margin-right:auto;
background-color: white;
border-top:1px solid rgba(0, 0, 0, .05);
border-radius:4px;
overflow: hidden;
padding-top: 10px;
z-index: 1;
height:75px;
margin-bottom: 15px;
}
.panel_container{
position:relative;
float:left;
width:33.33%;
min-width:269px;
height:100%;
margin:0;
}
.panel_container.index{
min-width:200px;
}
.panel{
box-sizing:border-box;
box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
border-bottom: 1px solid transparent;
border-radius: 3px;
min-width: 233px;
}
.panel, .panel_container button{
position: relative;
bottom:0;
text-align: left;
padding:0 10px;
height:100%;
cursor:pointer;
margin:0;
}
.panel_container button{
width:100%;
}
.shade_1{
background-color: #006949;
border-color: #006949;
margin-left:0;
margin-right:16.67px;
}
.shade_2{
background-color: #80B5A5;
border-color: #80B5A5;
margin: 0 8.33px;
}
.shade_3{
background-color: #005569;
border-color: #005569;
margin-left:16.67px;
margin-right: 0;
right:0;
}
.panels.two_panels{
min-width:538px;
}
.panel_content{
position:relative;
text-align: right;
font-size: 25px;
word-wrap: break-word;
line-height: 25px;
top:50%;transform: translateY(-50%);
display:block;
}
.panel_content a, .panel{
color: #fff;
}
.panel img, .panel_content i{
float:left;
position: relative;
top:50%;transform: translateY(-50%);
}
.panel form{
top:-50%;
transform: translateY(75%);
}
.active_page{
background-color: #eee;
}
.top_link{
position: fixed;
top:25%;
right:0;
padding:5px;
font-size:18px;
text-align: right;
}
.bottom_link{
position:absolute;
bottom:0;
right:0;
padding:5px;
font-size:18px;
}
/** Layouts for specific pages **/
.sign_{
position:relative;
right:0;
float:right;
width:250px;
}
#logo{
padding-top:5px;
}
.footer, .footer a{
color:#DDDDDD;
font-size: 10px;
right:0;
bottom:0;
position: fixed;
}
.hidden{
display:none;
}
#patients_renderer{
position:relative;
margin-left:auto;
margin-right:auto
}
.full {
position: absolute;
padding:0;
margin:0;
width:100%;
height:100%;
top:0;
background-color: rgb(0, 105, 74);
background-image: linear-gradient(top,rgb(0, 105, 74), rgb(255, 255, 254));
background-image: -webkit-linear-gradient(top,rgb(0, 105, 74), rgb(255, 255, 254));
background-image: -moz-linear-gradient(top,rgb(0, 105, 74), rgb(255, 255, 254));
background-image: -o-linear-gradient(top,rgb(0, 105, 74), rgb(255, 255, 254));
background-image: -ms-linear-gradient(top,rgb(0, 105, 74), rgb(255, 255, 254));
}
/** Reporting **/
.report_container{
margin:30px auto 0 auto;
padding:15px;
max-width:800px;
height:488px;
border:1px solid #C6BAC0;
border-radius:10px;
color:#555;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
-webkit-box-shadow:0 0 5px 0 #CCC;
-moz-box-shadow:0 0 5px 0 #CCC;
box-shadow:0 0 5px 0 #CCC;
}
.report_tabs_filler{
margin:0 0 10px 0;
height:350px;
border-radius:10px 0 0 0;
}
.report_tabs{
float:left;
width:250px;
font-family:Georgia, serif;
}
.report_anchor{
display:block;
margin:2px 0;
padding:5px;
background:#0B684B;
color:#FFF;
font-style:italic;
text-align:center;
text-decoration:none;
text-transform:uppercase;
}
.report_anchor.last{
border-radius:0 0 0 10px;
}
.patient_record_table{
width:520px; color:#555;
}
.patient_record_table td.title{
padding-right:7px;
width:50px;
border-right:3px solid #999;
color:#C6BAC0;
font-family:Georgia, serif;
font-size:12px;
text-align:right;
text-transform:uppercase;
}
.two_line{
width:102px;
}
.patient_record_table td.data{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
.info_section_container{
margin-left:250px;
height:488px;
text-align:justify;
overflow:hidden;
}
.info_section{
margin:0 0 0 10px;
padding:10px;
width:520px;
height:468px;
border-radius:0 10px 10px 0;
background:#FCFCFC;
overflow:auto;
}
.info_section b{
text-transform:uppercase;
}
.section_header{
display:block;
margin-bottom:5px;
padding-bottom:3px;
border-bottom:1px solid #999;
font-family:Georgia, serif;
font-size:20px;
font-style:italic;
text-transform:uppercase;
}
.section_header.style1{
color:#0B684B;
}
.section_header.style2{
color:#C6BAC0;
}
.report_footer{
clear:left;
margin:5px auto;
width:800px;
font-size:14px;
text-align:center;
}
.report_notes{
display:block;
color:#C6BAC0;
font-family:Monospace, serif;
font-size:11px;
font-style:italic;
text-transform:lowercase;
}
.selectors{
position:relative;
width:100%;
clear:left;
margin:5px 15px;
}
#filter_container{
clear: left;
display: inline-block;
width: 100%;
overflow-x: hidden;
}
#filter_container select{
float:left; margin-right:5px;
max-width: 200px;
}