/**************************************************************/
/* Copyright (c) 2022 Avatar Therapy Ltd. All rights Reserved */
/**************************************************************/

html {
  position: relative;
  min-height: 100%;
}
body {
  margin-bottom: 41px; /* Margin bottom by footer height */
  max-width: 100%;
  overflow-x: hidden;
}

.footer {
  position: absolute;
  bottom: 0;
  height: 40px; /* Set the fixed height of the footer here */
  line-height: 40px; /* Vertically center the text there */
  background-color: #f5f5f5;
}

table { width: inherit !important; }
td {
    width: auto;
}

td.min {
    width: 1%;
    white-space: nowrap;
}

.scrollable {
  overflow-y: auto;
  max-height: 400px;
}

#errmessg { font-size:1.25em };

@media (max-width: 767px) {
    .carousel-inner .carousel-item > div {
        display: none;
    }
    .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

/* medium and up screens */
@media (min-width: 768px) {
    
    .carousel-inner .carousel-item-end.active,
    .carousel-inner .carousel-item-next {
      transform: translateX(25%);
    }
    
    .carousel-inner .carousel-item-start.active, 
    .carousel-inner .carousel-item-prev {
      transform: translateX(-25%);
    }
}

.carousel-inner .carousel-item-end,
.carousel-inner .carousel-item-start { 
  transform: translateX(0);
}


.carousel-control-prev-icon { color:#040404 };
.carousel-control-next-icon { color:#040404 };

.carousel-indicator { width:50px; }

.carousel-caption-select {
   position: absolute;
   top:0.5em;
   left:0.5em;
   height:20px;
}

.carousel-caption-checkbox {
   position: absolute;
   top:1em;
   left:1em;
   height:25px;
}

.carousel-caption {
   position: absolute;
   bottom:0;
   left:1em;
   color:black;
   text-align:left;
}


.playable .control { opacity: 0; transition: opacity .2s linear; }
.playable.not-started .play, .playable.paused .play { opacity: 1; }
.playable.playing .pause { opacity: 1; }
.playable.ended .stop {opacity: 1; }
.playable.precache-bar .done {opacity: 0; }

/* .playable.not-started .progress-bar, .playable.ended .progress-bar { display: none; } */
.playable.ended .progress-track { stroke-opacity: 1; }

/* floating toolbar */
.toolbar_container{
 position:absolute;
 width:auto;
 height:auto;
 padding:0px;
 background-color:#f7f7f7;
 -moz-box-shadow: 0 1px 3px #777;
 -webkit-box-shadow: 0 1px 3px #777;
 margin:0px auto;
 z-index:1;
}
ul.toolbar{
 width:auto;
 height:58;
 margin:0px;
 padding:0px;
 list-style-type:none;
 background-color:white; /* #f7f7f7; */
}
ul.toolbar li{
 display:inline;
}
ul.toolbar li button {
 float:left;
}
ul.toolbar li button i {
 float:left;
 cursor:pointer;
 width:46px;
 height:56px;
 margin:0px;
 padding:0px 3px;
 font-size: 40px;
}
.transparent{
 opacity: 0.6;
}
ul.toolbar2{
 width:auto;
 height:auto;
 margin:0px;
 padding:0px;
 list-style-type:none;
 background-color:white; /* #f7f7f7; */
}
ul.toolbar2 li{
 display:inline;
}
ul.toolbar2 li button {
 float:left;
}
ul.toolbar2 li button i {
 float:left;
 cursor:pointer;
 width:38px;
 height:48px;
 margin:0px;
 padding:0px 3px;
 font-size: 40px;
}

/* floating video player */
#vidoverlay {
 position:absolute;
 width:640px;
 height:480px;
 padding:0px;
 margin:0px auto;
 z-index:1;
}
/* floating help dialog */
#helpoverlay {
 position:absolute;
 width:480px;
 height:480px;
 padding:2rem;
 z-index:1;
 background-color: rgba(192,192,192,.6);
 color: black;
}
/* floating download dialog */
#downloadoverlay, #uploadoverlay {
 position:absolute;
 width:640px;
 height:480px;
 padding:2rem;
 z-index:1;
 background-color: rgba(192,192,192,1);
 color: black;
}
/* floating audio help dialog */
#audiohelpoverlay {
 position:absolute;
 width:640px;
 height:480px;
 padding:2rem;
 z-index:1;
 background-color: rgba(192,192,192,1);
 color: black;
}

/* feedback dialog */
#feedbackoverlay {
 position:absolute;
 width:640px;
 height:480px;
 padding:2rem;
 z-index:1;
 background-color: #B8FBD8;
 color: black;
}

/* choose therapist dialog */
#therapistoverlay {
 position:absolute;
 width:480px;
 height:auto;
 padding:2rem;
 z-index:1;
 background-color: #B8FBD8;
 color: black;
}

/* choose therapist dialog */
#uploadoverlay {
 position:absolute;
 width:480px;
 height:auto;
 padding:2rem;
 z-index:1;
 background-color: #B8FBD8;
 color: black;
}

/* floating assessment dialog */
#assessmentoverlay {
 position:absolute;
 width:640px;
 height:auto;
 padding:2rem;
 z-index:1;
 background-color: #B8FBD8;
 color: black;
}

/* floating book call dialog */
#bookcalloverlay {
 position:absolute;
 width:640px;
 height:auto;
 padding:2rem;
 z-index:1;
 background-color: #B8FBD8;
 color: black;
}

/* floating assessment dialog */
#controlpanel {
 position:absolute;
 width:auto;
 height:auto;
 padding:1rem;
 z-index:1;
 background-color: "white";
 color: black;
}

.carousel-control-prev, .carousel-control-next {
    width:50px;
}

.carousel-control-prev-icon {
    margin-left:-30px;
    width:50px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
}
      
.carousel-control-next-icon {
    margin-right:-30px;
    width:50px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
}

.report {
    font-family: monospace;
}

.background {
	background-color: black;
	opacity: 0.8;
	filter:alpha(opacity=80);
	background-color:rgba(0,0,0,0.8);
	width: 100%;
	min-height: 100%;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	color: white;
}
