@media (max-width: 768px) {
 	#subnavbar {
		display: none !important;
	}
	#smallsubnavbar {
		display: block !important;
	}
	.loadingbox {
		display: none;
	}
}

@media (max-width: 1000px) {
	.loadingbox {
		display: none;
	}
}

@media (min-width: 769px){
	#smallsubnavbar {
		display: none !important;
	}
	#subnavbar {
		display: block !important;
	}
}



body {
	font-family: "Trebuchet MS", sans-serif;
	margin: 50px;
	overflow-x: hidden !important;
	padding: 0;
	margin: 0 !important;
}

.loginbg {
	background: url(../images/emailbg.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}

.tooltip {
	font-size: 1.1vw;
}

.tooltip-inner {
  max-width: 500px;
}

.dropshadow {
	box-shadow: 0px 0px 20px #545b62;
}

#payamtmoney:hover {
	cursor: pointer;
}

.ui-datepicker {
	z-index: 2000 !important;
}

.roomtitle {
	/*font-size: 1.8vh !important;*/
	font-size: 16.812px;
}

/* This Centers the Modals in the exact center of the windows */
.modal {
  text-align: center;
  padding: 0!important;
}

.modal:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -4px;
}

.modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}
/* End This Centers the Modals in the exact center of the windows */

/* Center the Div in the middle of the viewport */
.center-screen {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 100vh;
}

.sortbyme {
	cursor: pointer;	
}

.sortbyme:hover {
	color: rgba(0,62,128,1.00) !important;
}

.dropdown-item:hover {
	background-color: #17a2b8;	
}

.dropdown-item {
    padding: 0;
}

/*#mainwrap {
	overflow: hidden;
}*/

/* Add to Element to Hide */
.hidden {
	display: none;
}

/* Color Palette Classes */

.bg-darkred {
	background-color: #3C1518;
}

.darkred {
	color: #3C1518;
}

.bg-lightred {
	background-color: #721213;	
}

.lightred {
	color: #721213;
}

.bg-purple {
	background-color: #774C60;	
}

.purple {
	color: #774C60;	
}

.bg-pink {
	background-color: #B75D69;
}

.pink {
	color: #B75D69;	
}

.bg-pink-white {
	background-color: #EACDC2;
}

.pink-white {
	color: #EACDC2;
}

/* Controls the Color of the Column on the Booking Table that indicated current day */
.bg-today {
	background-color: #21C700;
}

/* End Color Palette Classes */

/* Style the Selectable Reservation Calendar */
.selectable .ui-selecting { background: #FECA40 !important; }
.selectable .ui-selected { background: #F39814 !important; color: white; }
.selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
.selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }

/* Make sure the Autocomplete Pop-Up Selection Box Appears Above Any Modal that may contain it. */
.ui-autocomplete {
    z-index: 9999 !important;
}

/* Force Bookings Table Cells to be relative so that the reservation-block position absolute will apply correctly */
.reservation-time {
	position: relative;
}

/* Controls the Reservation Blocks displayed on Bookings Table */
.reservation-block{
	position: absolute;
	top: 0px;
/*	transition: transform .2s;*/
	overflow: hidden !important;
	z-index: 1000;
}

/*.reservation-block:hover {
  -ms-transform: scale(1.3);
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
}*/

/* Force the UI-Datepicker to be on top of reservation-blocks located on the bookings table */
.ui-datepicker {
	z-index: 2000 !important;
}

/* Fix the width of the Rooms Column of the Booking Table */
.booking-room-col{
	width: 123px;
}

/* Space oi-icon info icons correctly on settings page */
.oi-info {
	margin-left: 5px;
}

/* Smaller Text Class */
.smaller {
	/*font-size: 1.2vh;*/
	font-size: 11.208px;
	padding: 0;
	margin: 0;
}

.mynavlink {
	border-radius: 0;
}

/* Add 45% Width */
.w-45 {
	width: 45% !important;
}

/* Override height of select form objects */
.height-override {
	height: auto !important;	
}

/* Change Text Formatting of Name Displayed in Reservation Box */
.reservation-display-name{
	font-size: 14.01px;
	/*font-size: 1.5vh;*/
}

/* Wrap Around Input and button in order to apply classes below correctly */
.inputfieldwrapper {
	position: relative;
	width: 100%;
}

/* Apply this class to the button wrapped inside the above class in order to display the button inline with the input field */
.inlineinputbutton-right {
	position: absolute;
	top: 0;
	right: 0;
}

.inlineinputbutton2-right{
	position: absolute;
	top: 23px;
	right: 0;
}
#displaynumber li {
	display: inline;	
}

.pdfobject-container { height: 100vh; margin: 0; padding: 0; width: 100%; }

.dropdown-menu{
/*    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
    padding-top: 0rem !important;
    padding-bottom: 0rem !important;*/
	z-index: 2000;
}

table#booking-table tr td {
	border:  1px solid black !important;
}

table#researchtable tr td {
	border:  1px solid black !important;
}

.pointer:hover {
	cursor: pointer;
}

.loadingbox {
	position: absolute;
	top: 45%;
	left: 45%;
	z-index: 8000;
	height: 150px;
	width: 110px;
	box-shadow: 0px 0px 20px rgba(0,0,0,1.00);
	background-color: rgba(255,255,255,1.00);
	float: right;	
}
/* Chat Box Related Classes and IDs */
#chatbox{
    position: fixed;
    right: 10px;
    bottom: 0;
    height: 300px;
    width: 400px;
}

#chatboxopen {
    position: fixed;
    right: 10px;
    bottom: 0;
    width: 400px;
}

.chatboxtoggle {
    cursor: pointer;
}

#chatmsgs {
    padding-left: 5px;
    list-style: none;
}

.chatboxfooter {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

.chatbox-content {
    position: absolute;
    top: 33px;
    bottom: 43px;
    left: 0;
    right: 0;
    overflow-y: scroll;
}

@keyframes chattitle {
  from {background-color: #17a2b8;}
  to {background-color: #ffc107;}
}

div.chatboxtoganim {
    animation: chattitle 0.5s infinite;
    animation-direction: alternate;
}
/* Chat Box Related Classes and IDs */

/* Originals from Jquery UI Blizter Theme 

	
	.demoHeaders {
		margin-top: 2em;
	}
	#dialog-link {
		padding: .4em 1em .4em 20px;
		text-decoration: none;
		position: relative;
	}
	#dialog-link span.ui-icon {
		margin: 0 5px 0 0;
		position: absolute;
		left: .2em;
		top: 50%;
		margin-top: -8px;
	}
	#icons {
		margin: 0;
		padding: 0;
	}
	#icons li {
		margin: 2px;
		position: relative;
		padding: 4px 0;
		cursor: pointer;
		float: left;
		list-style: none;
	}
	#icons span.ui-icon {
		float: left;
		margin: 0 4px;
	}
	.fakewindowcontain .ui-widget-overlay {
		position: absolute;
	}
	select {
		width: 200px;
	}
/* End Originals from Jquery UI Blitzer Theme */