// TODO: Move all of this into the LesionTracker package
html
  height: 100%
  width: 100%

  min-height: 100%
  min-width: 100%

  
body
  height: 100%
  width: 100%

  min-height: 100%
  min-width: 100%
  
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,45484d+100 */
  background: #000000; /* Old browsers */
  background: -moz-linear-gradient(top,  #000000 0%, #45484d 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #000000 0%,#45484d 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #000000 0%,#45484d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

.tab-content 
  height: calc(100% - 40px)

table#tblStudyList thead > tr 
  background-color: #424242
  color: white

table#tblStudyList tbody > tr:nth-child(even) 
  background-color: #888
  color: black
 
table#tblStudyList tbody > tr:nth-child(odd) 
  background-color: #BBB
  color: black

table#tblStudyList tbody > tr:hover
  background-color: #009BD2
  color: white

table#tblStudyList tbody > tr > td
  word-wrap: break-word

/* Mobile devices */
@media only screen and (min-device-width : 375px) and (max-device-width : 768px)
  .logoContainer
    width: 15%

  .navbar-brand
    img
      height: 20px
      margin-top: 10px
      margin-bottom: 10px
      margin-right: 5px

    h4.name
      padding: 1px
      font-size: 0.3em
      width: 50%

  table#tblStudyList
    table-layout: fixed
    font-size: 0.7em

  #tablist
    width: 85%
    overflow-x: auto

  #toolbar .btn-group button
    width: 40px
    height: 40px

  .studyDateList
    margin-top: 5px

@media (max-device-width: 667px)
  #toolbar .btn-group button
    width: 35px
    height: 35px