﻿
body{
    font-family:"Lato", sans-serif;color: #6D6F71;
}

h1, h2, h3, h4, h5, p, a, li, input, label {
font-family:"Lato", sans-serif;}

a {
color:white}

    a.md-default-theme:not(.md-button), a:not(.md-button) {
        color: white;
    }

input {
padding:6px; }

textarea {
padding:6px;}

select {
padding:6px; line-height:40px;}

.data-container {
}

.data-list-container { 
}

    .data-list-container table { 
    }


.table-data-container {height:70vh; border:solid 1px red; margin-top:20px; overflow-y:scroll; width:380px; border:solid 1px #dedede;
}

.table-data-container table{
    width:100%;
}


#recurrence-tabs {
overflow:hidden; list-style:none; padding:0; margin:0;}

#recurrence-tabs li { float:left; border:solid 1px #E5E7E5; padding:8px; cursor:pointer; 
}

    #recurrence-tabs li:hover {
    color:white; background-color:#a4b8a6;}

    .highlighted-recurrence-tab{
    color:white; background-color:#a4b8a6;}

#recurrence-pane-container {
 border:solid 1px  #E5E7E5; padding:15px; height:250px; width:400px;}

.alert span {
float:right; background-color:#5A6B6C; color:white; margin-right:8px;  display:block; -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; cursor:pointer; padding-left:8px; padding-right:8px; padding-bottom:2px;}

.navbar-header {
width:100%;}

.bookings_container { float:left; min-width:120px;
}

.bookings_wrapper {
overflow:hidden;}

#day-view-btn {
margin-left:25px;}

.facility_selector {
float:left; margin-right:10px; margin-bottom:10px;}

.facility-selectors-container {
overflow:hidden;
}

md-checkbox {margin-bottom:5px!important;
}

.dates-wrapper {float:left; min-width:250px;}

.date_selector{
float:left; margin-right:20px; margin-bottom:20px;}

.date-selectors-container {
overflow:hidden;}

.overflow {
overflow:hidden;}

.schedule-container {
overflow:hidden; margin-top:25px; float:left; width:100%;  }

.time-column {
 margin-left:0; padding-left:0; list-style:none; }

.time-column li {
height:60px; width:100%; padding:10px; box-sizing:border-box; background-color:#E5E7E5; color:#c0bfbf; cursor:pointer; }

.time-column li:hover { background-image:url(/images/add-new-button.png); background-repeat:no-repeat; background-position:60px 10px;
}

.time-column li:nth-child(odd) {
    background-color:white;}

.bookings-column {
width:100%; list-style:none;  position:relative; border:solid 1px #ebebeb; box-sizing:border-box; }

.booking{top:100px; 
    width:92%;  background-color:#a4b8a6; color: white; border:solid 1px white; box-sizing:border-box; position:absolute; padding:0px;  overflow:hidden; margin-left:8%;
    -webkit-box-shadow: 10px 10px 19px -12px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 19px -12px rgba(0,0,0,0.75);
box-shadow: 10px 10px 19px -12px rgba(0,0,0,0.75); 
cursor:pointer;
height:30px;
}

.fixed-booking{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#031e3f+1,2989d8+100,207cca+100,19839b+100&0.8+0,0.8+100 */
background: -moz-linear-gradient(left,  rgba(3,30,63,0.8) 0%, rgba(3,30,63,0.8) 1%, rgba(25,131,155,0.8) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(3,30,63,0.8) 0%,rgba(3,30,63,0.8) 1%,rgba(25,131,155,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(3,30,63,0.8) 0%,rgba(3,30,63,0.8) 1%,rgba(25,131,155,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc031e3f', endColorstr='#cc19839b',GradientType=1 ); /* IE6-9 */
}

.fixed-booking div.booking-top {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#031e3f+1,2989d8+100,207cca+100,19839b+100&0.8+0,0.8+100 */
background: -moz-linear-gradient(left,  rgba(3,30,63,0.8) 0%, rgba(3,30,63,0.8) 1%, rgba(25,131,155,0.8) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(3,30,63,0.8) 0%,rgba(3,30,63,0.8) 1%,rgba(25,131,155,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(3,30,63,0.8) 0%,rgba(3,30,63,0.8) 1%,rgba(25,131,155,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc031e3f', endColorstr='#cc19839b',GradientType=1 ); /* IE6-9 */
}

.do-not-use-booking{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c83080+0,9f2867+100&0.8+0,0.8+100 */
background: -moz-linear-gradient(left,  rgba(200,48,128,0.8) 0%, rgba(159,40,103,0.8) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(200,48,128,0.8) 0%,rgba(159,40,103,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(200,48,128,0.8) 0%,rgba(159,40,103,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccc83080', endColorstr='#cc9f2867',GradientType=1 ); /* IE6-9 */


}

.pending-booking{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f9c667+0,f79621+100;Orange+3D+%234 */
background: rgb(249,198,103); /* Old browsers */
background: -moz-linear-gradient(top, rgba(249,198,103,1) 0%, rgba(247,150,33,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(249,198,103,1) 0%,rgba(247,150,33,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(249,198,103,1) 0%,rgba(247,150,33,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9c667', endColorstr='#f79621',GradientType=0 ); /* IE6-9 */


}

.navbar {
margin-bottom:8px;}

.booking-top {
padding:10px; box-sizing:border-box;}

.recurrence {
border-top:3px solid green;}

.booking-bottom {
padding:10px;}

.action-button {
 cursor:pointer; background-color:#666666; display:inline-block; padding:8px; color:white; width:150px; text-align:center; margin-right:10px; margin-bottom:10px; border:solid #425759 1px;}

.action-button:hover{
     text-decoration:none; color:white; background-color:#949A9B;
}

.dte-picker {margin-right:10px; margin-bottom:10px;}

.date-panel-control-bar {
padding:10px;
}

#login {
margin-top:25px; float:left;
}

#login input {
    margin-right:15px; margin-left:6px; padding:8px; min-width:250px;}

#app-title {
    font-size:28px; display:block; padding:15px; margin:0px; margin-right:25px; font-weight:lighter; float:right; text-align:right; margin-top:10px;
}

.navbar-brand {
border-right:solid 1px #c4c2c3; margin:10px; margin-right:30px; padding-right:30px;}



#app-title span {
font-size:20px;}

#app_nav {
overflow:hidden; float:left; list-style:none; margin-top:15px;}

#app_nav li {
float:left; font-weight:bold; margin-right:20px; cursor:pointer; }

#user-details {
float:right; padding:15px;}

#booking-details {
    padding-top: 15px;
    padding-bottom:15px;
    overflow: hidden;
    width: 100%;
}

#booking-details-core {
float:left; width:50%; box-sizing:border-box; padding-left:15px; padding-right:15px;}

#booking-details-ancillary {
float:left;width:50%; box-sizing:border-box;padding-left:15px; padding-right:15px;}

.section_title {
font-weight:bold; display:block; margin-top:15px; margin-bottom:15px; 
}

#consultants-container {
overflow:hidden; padding:20px;}

#consultant-listing {
float:left; margin-right:25px;
}

#consultant-detail {
float:left;
}

#anaesthetists-container {
overflow:hidden; padding:20px;}

#anaesthetist-listing {
float:left; margin-right:25px;
}

#anaesthetist-detail {
float:left;
}

#recurring-bookings-container {
overflow:hidden; padding:20px;}

#recurring-bookings-listing {
float:left; margin-right:25px;
}

#recurring-bookings-detail {
float:left;
}


#users-container {
overflow:hidden; padding:20px;}

#user-listing {
float:left; margin-right:25px;
}

#user-detail {
float:left;
}

.data-table {

}

.data-table th{ background-color:#aac2c7; color:white; font-weight:bold;     padding: 10px;

}

.data-table th a {cursor:pointer}

.data-table td {
    padding: 10px; cursor:pointer;
}


.data-table tr:nth-child(odd)
{
   background-color: #E5E7E5;
}

 .data-table tr:hover {
   background-color: #aac2c7;
}

 .data-table tr:hover td{
   color:white;
}

.add-new-button {
display:block; border:solid 1px #666666; padding: 4px; 
background-image:url(/images/add-new-button.png); background-position:5px center; background-repeat:no-repeat; color:white; padding-left:30px; 
width:150px; box-sizing:border-box; background-color:#666666;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
cursor:pointer;
}

.add-new-button:hover {
    text-decoration:none; color:white;
}

#procedures-container {
    overflow: hidden;
    padding: 20px;
}

#procedure-listing {
    float: left;
    margin-right: 25px;
}

#procedure-detail {
    float: left;
}

/*.fadein,.fadeout
 {
  -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
  -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
  -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.5s;
}


.fadein.ng-hide-remove,
.fadeout.ng-hide-add.ng-hide-add-active {
   opacity: 0;
 display: block !important;
}

.fadeout.ng-hide-add,
.fadein.ng-hide-remove.ng-hide-remove-active {
 
  opacity: 1;
  display: block !important;
}*/

#notification_dialog {
position:absolute; z-index:10000; display:block; left:25%; top:25%; width:50%; height:25%; background-color:white; border:solid 1px #ccc;
box-sizing:border-box; padding:15px;
-webkit-box-shadow: 10px 10px 41px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 41px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 41px 0px rgba(0,0,0,0.75);
cursor:pointer;
background-image:url(/images/close-icon.png); background-repeat:no-repeat; background-position:top right;
}

#notification_dialog h2 {
display:block; border-bottom:solid 1px #5A6B6C; margin-top:0; padding-bottom:10px; }

    #notification_dialog p{
        font-size:16px; padding-top:12px;
    }

#notification-close-button {
color:white; font-size:26px; text-align:center; background-color:#AAC2C7; display:block; padding:5px; padding-left:10px; padding-right:10px; float:right; -webkit-border-radius: 50%;
-moz-border-radius:  50%;
border-radius:  50%}

    #notification-close-button:hover {
     text-decoration:none;}

md-tooltip .md-content {
    height: auto; 
    padding:15px;
    border:solid 1px red;
    font-size:14px;
}



.tooltip {
    display: none;
    position: absolute;
    background-color: #222;
    padding: 7px 10px;
    max-width: 250px;
    color: #fff;
}

.tooltip-show {
    display: inherit;
}

.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0; 
}

.tooltip-down .tooltip-arrow {
    top: -5px;
    left: 50%;
    margin-left: -5px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #222;
}

.tooltip-up .tooltip-arrow {
    bottom: -5px;
    left: 50%;
    margin-left: -5px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #222;
}

.tooltip-right .tooltip-arrow {
    left: -5px;
    top: 50%;
    margin-top: -3px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 5px solid #222;
}

.tooltip-left .tooltip-arrow {
    right: -5px;
    top: 50%;
    margin-top: -3px;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #222;
}


.patient_new_row td{border-top:1px solid black;
}

@media screen and (max-width: 1024px){

    .bookings_container {
       width: 100%;
    }

    #login {
   padding:5%; box-sizing:border-box; width:100%;
         }

        #login input{
            display:block;
            width:100%;
            margin-bottom:10px;
            margin-left:0; margin-right:0
}

    #user-details {
    display:none;}

    #app-title {
    display:none;}

    #app_nav {
    margin-top:20px; margin-left:0;
    }

    #app_nav li {margin-left:0; margin-right:10px; margin-bottom:10px;
    }

    .dates-wrapper {
    width:100%!important;}

    #print-btn {
    display:none;}


}

@media print{
    #buttons-container{
    display:none;}

    md-button{
    display:none;}

    .time-column {
    display:none;}

    .dte-picker {
    display:none}

    .dte_picker_start_date {
    display:none;}

    .action-button {
    display:none;}

    .booking {position:static; height:auto!important; border:solid 1px grey;
              margin-left:0; width:100%;
    }

    .facility-selectors-container {
    display:none;
    }

    .panel-heading {
   /* border:none!important;*/}

    .panel {
    border:none!important;}

    .spire_container {border:none!important;
    }

    .panel-primary {border:none!important;
    }

    .dates-wrapper {
    float:none;  width:100%!important; margin-bottom:25px;   /*page-break-inside: avoid;*/}

    .bookings_container {
         float:none;  width:100%!important; 
    }
}