body {
  background-color: #f5f5f5;
}

.d-none {
  display: none;
}

h1 {
  margin-top: 20px;
}

div.onlyPrint {
  margin-left: -50px;
  display: none;
}

table.printingTable {
  margin-left: -20px;
}

table.printingTable tr.treatmentRow {
  border: 1px solid #eee;
  padding: 4px 0;
}

table.printingTable tr.treatmentRow td {
  padding: 0 2px;
  font-size: 8px;
  border-left: 1px dashed #eee;
  border-right: 1px dashed #eee;
}

table.printingTable tr.treatmentRow td:nth-child(3) {
  width: 80px;
}
table.printingTable tr.treatmentRow td:nth-child(4) {
  width: 35px;
}
table.printingTable tr.treatmentRow td:nth-child(5) {
  width: 30px;
}
table.printingTable tr.treatmentRow td:nth-child(6) {
  width: 65px;
}

table.printingTable tr.treatmentRow td:nth-child(1),
table.printingTable tr.treatmentRow td:nth-child(2),
table.printingTable tr.treatmentRow td:nth-child(7),
table.printingTable tr.treatmentRow td:nth-child(8),
table.printingTable tr.treatmentRow td:nth-child(9),
table.printingTable tr.treatmentRow td:nth-child(10),
table.printingTable tr.treatmentRow td:nth-child(11) {
  width: 15px;
}
table.printingTable tr.treatmentRow td:nth-child(12) {
  width: 45px;
}
table.printingTable tr.treatmentRow td:nth-child(13) {
  width: 45px;
}
table.printingTable tr.treatmentRow td:nth-child(14) {
  width: 55px;
  
}
table.printingTable tr.treatmentRow td:nth-child(15) {
  width: 49px;
}
table.printingTable tr.treatmentRow td:nth-child(16) {
  width: 54px;
}
table.printingTable tr.treatmentRow td:nth-child(17),
table.printingTable tr.treatmentRow td:nth-child(18),
table.printingTable tr.treatmentRow td:nth-child(19),
table.printingTable tr.treatmentRow td:nth-child(20),
table.printingTable tr.treatmentRow td:nth-child(21) {
  width: 50px;
}

table.printingTable tr.treatmentRow td:nth-child(22),
table.printingTable tr.treatmentRow td:nth-child(23){
  width: 50px;
}





table.treatmentTable tr td.colmedicament input {
  width: 200px;
}
table.treatmentTable tr td.coldosage input {
  width: 70px;
}
table.treatmentTable tr td.colunit input {
  width: 50px;
}
table.treatmentTable tr td.colvoie input {
  width: 200px;
}
table.treatmentTable tr td.colfreq_1 input {
  width: 40px;
}
table.treatmentTable tr td.colfreq_2 select {
  width: 85px;
}
table.treatmentTable tr td.colcondition input {
  width: 150px;
}
table.treatmentTable tr td.colremark input,
table.treatmentTable tr td.collastControl input,
table.treatmentTable tr td.colnextControl input,
table.treatmentTable tr td.colfromDate input,
table.treatmentTable tr td.coltoDate input,
table.treatmentTable tr td.collastModified input,
table.treatmentTable tr td.collastInj input,
table.treatmentTable tr td.colnextInj input {
  width: 80px;
}

table.treatmentTable tr.expired {
  opacity: 0.5;
}
 
div.palette {
  background-color: #fff;
  border-radius: 8px;
  padding: 15px;
  margin-top: 20px;
  max-width: 100%;
  overflow-x: auto;
}

div.primitive {
    clear: both;
    padding-top: 10px;
}

div.regcontainer [type="text"],
div.regcontainer [type="email"],
div.regcontainer [type="password"]  {
  width: 100%;
  margin-bottom: 5px;
  padding: 6px 10px;
  border-radius: 4px;
}

div.primitive span.controlButtons {
    margin-left: 10px;
}

.btn-primary {
  background-color: #581687;
  border-color: #581687;
}

.btn-primary:hover {
  background-color: #581687;
  border-color: #581687;
  opacity: 0.9;
}


div.lPart {
  width: 100% !important;  
}
div.rPart {
  width: 100% !important;  
}

div.fluxPan {
  height: 390px;
  margin-left: 20px;
}

div.fluxOnly div.fluxPan {
  height: auto;
}

div.fluxOnly div.fluxPan div.qnContainer {
  max-height: none;
}


@media screen and (max-width: 768px) {
  div.lPart {
    width: 100% !important;  
  }
  div.rPart {
    width: 100% !important;  
  }

  body div.leftMenu {
    bottom: 0;
    height: 60px;
    left: 0;
    right: 0;
    top: auto;
    width: auto ;
    z-index: 100;
  }

  body div.leftMenu a.lMenuBtn {
    display: inline-block;
    width: 60px;
  }

  body div.contContainer {
    left: 15px;
    right: 15px;
  }
  

}

/* Customize the label (the cbcontainer) */
.cbcontainer {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 18px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  
  .cbcontainer.d-none {
    display: none;
  }
  
  /* Hide the browser's default checkbox */
  .cbcontainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
  }
  
  /* Create a custom checkbox */
  .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
  }
  
  /* On mouse-over, add a grey background color */
  .cbcontainer:hover input ~ .checkmark {
    background-color: #ccc;
  }
  
  /* When the checkbox is checked, add a blue background */
  .cbcontainer input:checked ~ .checkmark {
    background-color: #2196F3;
  }
  
  /* Create the checkmark/indicator (hidden when not checked) */
  .checkmark:after {
    content: "";
    position: absolute;
    display: none;
  }
  
  /* Show the checkmark when checked */
  .cbcontainer input:checked ~ .checkmark:after {
    display: block;
  }
  
  /* Style the checkmark/indicator */
  .cbcontainer .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  .slidecontainer {
    width: 100%; /* Width of the outside container */
  }
  
  /* The slider itself */
  .slider {
    -webkit-appearance: none;  /* Override default CSS styles */
    appearance: none;
    width: 100%; /* Full-width */
    height: 25px; /* Specified height */
    background: #d3d3d3; /* Grey background */
    outline: none; /* Remove outline */
    opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
    -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    transition: opacity .2s;
  }
  
  /* Mouse-over effects */
  .slider:hover {
    opacity: 1; /* Fully shown on mouse-over */
  }
  
  /* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
  .slider::-webkit-slider-thumb {
    -webkit-appearance: none; /* Override default look */
    appearance: none;
    width: 25px; /* Set a specific slider handle width */
    height: 25px; /* Slider handle height */
    background: #2196F3; /* Green background */
    cursor: pointer; /* Cursor on hover */
  }
  
  .slider::-moz-range-thumb {
    width: 25px; /* Set a specific slider handle width */
    height: 25px; /* Slider handle height */
    background: #2196F3; /* Green background */
    cursor: pointer; /* Cursor on hover */
  }

p.eMessage {
    color: #cd3232;
    font-size: 18px;
}



h4 {
    font-size: 18px;
    font-weight: normal;
}

div.list {
    clear: both;
}

div.children {
    padding-left: 20px;
    clear:both;
}


div.bordered {
	border: 1px solid #000;
	padding-top: 3px;
	padding-bottom: 3px;
}

div.vspace {
	width: 100%;
    height: 20px;
    clear: both;
}

div#invoice {
	margin: 20px;
}

div#invoice div.sm {
	font-size: 12px;
}

.print-content {
    display: none !important;
}

.viewNotePart .print-content {
    display: block !important;
}

.viewNotePart textarea {display: none !important;}
.viewNotePart input[type="text"],
.viewNotePart input[type="email"] 
    {display: none !important;}
.viewNotePart span.controlButtons a {display: none !important;}

.viewNotePart .cbcontainer input:checked + span.checkmark:before {
        content: "x";
    }

.viewNotePart div.filters input[type="text"],
.viewNotePart form.editable input[type="text"] {
  display: inline-block !important;
}

.viewNotePart div.filters p.well.print-content,
.viewNotePart form.editable p.well.print-content {
  display: none !important;
}

form.qnForm input[type="text"] {
  width: calc(100%-100px);
}

form.qnForm textarea {
  display: block !important;
}

div.qNote.isPriority {
  background-color: #FFB7A5;
}

div.qNote {
  padding: 4px;
  border-bottom: 1px solid #eee;
  margin-bottom: 10px;
}

div.qNote span.buttons {
  float: right;
}

div.qNote span.by {
  font-size: 12px;
}

div.qnContainer {
  max-height: 200px;
  overflow-y: auto;
}

div.qnContainer.large {
  max-height: 310px;
}

div.plotContainer {
  margin-bottom: 30px;
  width: 100%;
  overflow-x: auto;
}

div.header a {
  color: #000;
}

div.logoCont img {
  height: 34px;
  margin-right: 10px;

}

div.logoCont {
  font-weight: 700;
}

div.leftMenu {
  background-color: #581687;
  width: 60px;
  position: fixed;
  top: 74px;
  left: 0;
}

div.contContainer {
  position: absolute;
  left: 74px;
  right: 0;
  padding-bottom: 60px;
}

div.leftMenu a.lMenuBtn {
  display: block;
  padding: 10px;
  border-bottom: 1px solid #008667;
}
div.leftMenu a.lMenuBtn img {
  width: 40px;
}

.viewNotePart div.noPar p.print-content {
  display: none !important;

}

.viewNotePart div.noPar input {
  display: inline-block !important;

}
    
@media print {
  thead {display: table-header-group;}
tfoot {display: table-footer-group;}


  
  div.onlyPrint {
    display: block;
  }
  .noPrint {
    display: none !important;
  }

  div.leftMenu {
    display: none;
  }
  p {
    font-size: 12px;
  }
  .cbcontainer {
    padding-left: 15px;
  }

    .authorOnly {
        display: none !important;
    }

    .print-content {
        display: block !important;
        
    }

    p.print-content {
        margin-bottom: 3px !important;
        padding: 3px !important;
    }

    h4 {
        margin-top: 3px;
        margin-bottom: 5px;
        font-size: 12px;
    }

    form {
        border: none !important;
        padding: none !important;
    }

    label.cbcontainer {
        margin-bottom: 8px !important;
        font-size: 12px;
        border: 1px dashed #ddd;
    }

    div.primitive {
        padding-top: 0 !important;
    }
    
    textarea {display: none !important;}
    input[type="text"],
    input[type="email"] 
    {display: none !important;}

    .cbcontainer input:checked + span.checkmark:before {
        content: "x";
    }

  body > div > div {
    display: none;
  }
  
  div.printable {
    display: block;
  }

  div#prescription div.headerrow {
       margin-top: -60px;
  }

  div.noprint,
  button.noprint {
       display: none;
  }

  table { page-break-inside:auto }
  
  body * {
    visibility: hidden;
  }
  
  div.printable * {
    visibility: visible;
  }

  .notprintable,
  .notprintable * {
    display: none;
  }


  
  div.printable a.btn {
  	visibility: hidden;
  }



  
  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
        float: left;
        padding-left: 5px;
        padding-right: 5px;
   }
   .col-md-12 {
        width: 100%;
   }
   .col-md-11 {
        width: 100%;
   }
   .col-md-10 {
        width: 100%;
   }
   .col-md-9 {
        width: 75%;
   }
   .col-md-8 {
        width: 66.66666667%;
   }
   .col-md-7 {
        width: 58.33333333%;
   }
   .col-md-6 {
        width: 50%;
   }
   .col-md-5 {
        width: 41.66666667%;
   }
   .col-md-4 {
        width: 33.33333333%;
   }
   .col-md-3 {
        width: 25%;
   }
   .col-md-2 {
        width: 16.66666667%;
   }
   .col-md-1 {
        width: 8.33333333%;
   }

   body > div > div.col-md-1 {
       display: none;
   }

   body > div > div.col-md-10 {
    width: 100%;
    margin-left: -30px;
    margin-right: -30px;
}

   body > div.printError.print-content {
        visibility: visible !important;
        display: block !important; 
    }

    body > div.row {
        margin-top: -40px;
    }
}

div.tviewh {
	background: #ccc;
}

div.tview.row {
	display: -webkit-box;
	  display: -webkit-flex;
	  display: -ms-flexbox;
	  display:         flex;
	  flex-wrap: wrap;
}

div.tview.row  > [class*='col-'] {
  display: flex;
  flex-direction: column;
}

div.tview.row > div:nth-child(even) {
	background: #eee;
}

form {
	border-radius: 10px;
	padding: 20px;
}

form > p {
	padding-bottom: 10px;
	padding-top: 2px;
	border-bottom: 1px solid #eee;
}

form label {
	display: inline-block;
	text-align: left;
	margin-right: 10px;
}

form.inlineForm {
	border: none;
	padding: 5px;
}


.btn {
	margin-right: 20px;
}

textarea {
	width: 100%;
	max-width: 100%;
}

input[type="text"],
input[type="email"] {
	width: 400px;
	max-width: 100%;
}

select {
	width: 400px;
	max-width: 100%;
}

p.datetime {
	margin-left: 168px;
}

p.datetime input.vDateField {
	margin-left: 8px;
}

div.colheader {
	font-weight: bold;
	text-decoration: underline;
}

button[disabled], 
html input[disabled],
html textarea[disabled],
html select[disabled]
{
    cursor: default;
    background: #eee;
}

span.warning {
     color: #a33;
}

button.cancelbtn {
     margin-left: 100px;
     background: #ccc;
}

div.header {
    padding: 20px;
    background-color: #fff;
}

div.row.tview .col-md-1,
div.row.tview .col-md-2 {
    padding-bottom: 10px;
}

button.filterBtn {
    background: #fff;
    color: #447e9b;
    border: 1px solid #eee;
    outline: none;
}

button.filterBtn:hover {
    background: #efefef;
    color: #447e9b;
    border: 1px solid #eee;
}

button.filterBtn.active {
    background:#447e9b;
    color: #fff;
    border: 1px solid #eee;
}

p.well.print-content {
    margin-bottom: 3px;

}

div.allNotes {
    margin-bottom: 100px;
}

a.white {
    color: #fff;
}


div.calendarbox {
  left: calc(50% - 114px) !important;
}

td.sticky-col,
th.sticky-col {
  position: -webkit-sticky;
  position: sticky;
  left: -20px;
  background-color: #f6f6f6;
}

tr.currentTreatment:not(.MI) + tr.currentTreatment.MI {
  border-top: 2px solid black;
} 

tr.currentTreatment:not(.AE) + tr.currentTreatment.AE {
  border-top: 2px solid black;
}