/* TODO: remove unused lines, this is mostly holdover from traveler response page */
h1 { font-size: 2rem;  }
a { color: #00a7c2; }
.loading { width:100%; text-align:center; font-size:1.6em; font-weight:bold; color:#fff; padding:20px; margin-bottom:100px; display:block; }
dd:before, dd:after { content: none !important; }
.navbar-tbtravelers { margin-right: 0 !important; }

.toprow { padding: 30px 15px 15px 0px; }
.bottomrow { padding: 0px; }
.trustyou img { max-width:140px; }
.trustyou p { color: #00a7c2; font-size:1.2em; font-weight:bold; padding-left:2px; text-transform:uppercase; }
.trustyou a:hover p { color:#666; }
.hotelname { font-size: 1.6em; font-weight: bold; color: #00a7c2; padding-bottom: 15px; }
.hotelnamelabel { font-size: 1.6em; font-weight: bold; color: #999; padding-bottom: 15px; padding-right:8px; }
.bidstatustext { font-weight: bold; color: rgba(236, 132, 107, 1); font-size: 1.3rem; }
.bidstatusdesc { font-weight: normal; color: #888; font-size: 1rem; font-style:italic; }
.bidstatuscounter { margin-bottom:10px; }
#supplierEmail { margin-bottom:6px; }
.accept-counterbid-prompt { padding-top: 30px; }

.hotelattribute { font-size: 1.2em; color: #777; line-height: normal; }
.inoutdatesrow { padding: 10px 0px; border-left:15px solid #fff; }
.inoutdates { background-color:#f5f5f5; position:relative; min-height: 70px; }
.inoutdates .glyphicon { color: #99cfd9; font-size: 30px; font-weight: bold; position: absolute; left: 12px; top: 33%; }
.inoutdates .offerattribute_label, .inoutdates .offerattribute_value,  .inoutdates .offerattribute_hint { padding-left: 40px; line-height:normal; padding-bottom:2px; }
.inoutdates .offerattribute_label { padding-top: 10px; }
.offerattribute_label { padding-top: 5px; margin: 0; font-size: 1.1em; text-transform: uppercase; color: #666; font-weight:normal; }
p.ratingattribute_label { padding-bottom:5px; margin: 0; font-size: 1.1em; text-transform: uppercase; color: #666; font-weight:normal; }
.offerattribute_value {padding-bottom: 0; font-size: 1.2em; font-weight: bold; text-transform: uppercase; color: #000; margin:0; line-height:normal; }
.offerattribute_hint {padding-bottom: 4px; font-size: 1em; text-transform: uppercase; color: #00a7c2; font-weight: bold; }
.offerattributesrow {padding-bottom:5px;}
.hotelimagerow, .bottomrow { background-color: #fff; border-radius: 0px 0px 4px 4px; }
.hotelimagerow { padding-top:40px; }
.hotelimagepanel .thumbnail { border-radius:0px; padding: 0px; margin-bottom: 10px; height:100px; width:100px; border: 2px solid #fff; }
.hotelimagenav { background-color: #96cfda; color: white; height:100px; width:100px; border: 2px solid #fff; cursor:pointer; outline: none;  }
.hotelimagenav .glyphicon { padding-top: 10px; padding-left:30px; font-size: 1.5em; }
.hotelimagenav:hover, .hotelimagepanel .thumbnail:hover { border-color: #00a7c2; }
.amenity { font-size:1.2em; text-transform: uppercase; font-weight:bold; }
.amenity .glyphicon { padding-right: 5px; }
.amenity.text-muted { color: #CCC;  }
.amenity.text-success { color: #65a338;  }
.amenitiesrow { padding-bottom:5px; padding-top: 10px; margin-bottom:0; }
.stars { padding-bottom: 20px; }
.stars span {overflow: auto; white-space:nowrap; }
.stars img { display: inline; }
.statusrow { background-color: #65a338; padding: 5px; text-align: center; text-transform: uppercase; font-size: 1.1em; margin-bottom:15px; }
.status_value { font-weight:bold; padding-left:5px; }
.ratepanel { background-color: #3b3b3b; color: white; padding-bottom:30px; }
.raterow { padding: 10px 0px 10px 0px; font-size: 1.3em; text-transform: uppercase;border-bottom: 4px solid rgb(75, 75, 75);padding-bottom: 15px; font-weight:bold; }
.rate_label { float:left; color:#a0a0a0;  }
.rate_value { float:right;  }
.ratedetailsrow { color: #a0a0a0; padding: 10px 0px; font-size: 1.1em; }
.ratebuttonrow { padding-top:0px; }
.mappanel img { border: 2px solid #fff; }
.dealrating { margin-left:22px; }
.countercheck { margin-left: 4px; }

#ContentContainer button { min-width:0px; min-height: 40px; height: auto; white-space: normal }
#ContentContainer .btn-primary.btn-reject { background-color: rgba(236, 132, 107, 1); }
#ContentContainer .btn-primary.btn-reject:hover { background-color:#fff; color: rgba(236, 132, 107, 1); }
#ContentContainer button.btn-primary:hover { background-color: #333; color: #fff; }
#ContentContainer .buttonrow button.btn-primary:hover { background-color: #fff; color: #65a338; }
#ContentContainer .buttonrow button.btn-reject:hover { background-color: #fff; color: rgba(236, 132, 107, 1); }
#ContentContainer .btn-primary.btn-back { background-color: #00a7c2; }
#ContentContainer .btn-primary.btn-back:hover, #ContentContainer .buttonrow .btn-primary.btn-back:hover { background-color:#fff; color:#00a7c2; }
#ContentContainer button.btn-primary:disabled { background-color: #888; cursor:not-allowed; }
div.option-panel.not-selected fo-dropdown-select div#selectedValue { color: #ccc !important;}
#selector.disabled { background-color: #e9ecef !important; }
#decline-counterbid-btn:hover { background-color: #eee !important;}
.hoteldescpanel, .mappanel {  padding-bottom:30px; padding-top:25px; }
.mappanel { padding-left: 30px; }
.hoteldescpanel { padding-right: 30px; }
.hoteldesc_type { color: #777;}
.hoteldesc_text { font-size: 1.2em; padding-top: 10px; }
.actionpanel, .declinebuttonrow { background-color: #3b3b3b; color: white; padding: 20px; border-radius: 0px 0px 4px 4px; }
.actionpanel h3, .declinebuttonrow h3 { font-size: 2.4em; font-weight: bold; line-height: normal; margin-top: 10px; }
.declinechoicesrow { padding-bottom: 30px; padding-left: 30px; }
.declineactioncol { padding:0; }
.declinereasonpanel { font-size: 1.3em; padding-bottom: 15px; padding-top: 15px; }

.confirm-accepted-panel h3, confirm-declined-panel { font-family: 'Helvetica', 'Arial', 'Tahoma'; font-weight: bold; font-size: 2.4em; }
.confirmation { text-align: center; }
.confirmation a {color: #e8e8e8; }
.confirmation a:hover {color: #fff; }
.confirmation img { display: block; margin: 20px auto 60px auto; }
.confirmation-frame { margin-top: 40px; margin-bottom: 80px; padding: 80px; color: #fff; border: 8px solid #fff; border-radius: 4px; }
.confirmation-frame .confirmation-title { font-size: 32px;font-weight: bold; line-height:1.2em; }
.confirmation-frame .confirmation-subtitle { font-size: 24px;font-family: sans-serif;font-weight: lighter;color: #e8e8e8; line-height:1.1em; }
.confirmation-footertext { font-size: 16px;font-family: sans-serif;font-weight: lighter;color: #e8e8e8; line-height: 1.4em; padding: 0px 40px 80px 40px; }
.notesrequired { color: rgba(236, 132, 107, 1); padding-top: 4px; padding-left: 4px; }
.invalid-feedback { margin-top: .5rem; font-size: .75rem; }

.rejectrow {margin-top:6px;}
.notesrow {margin-top:6px; margin-bottom:20px;}

.rejectrow .option-button-label { line-height: 2em;}

.boxnumber { 
  color: #00a7c2; 
  font-size: 2em; 
  font-weight: bold; 
  min-height: 60px; 
  text-align: center; 
  background: #e9e9e9; 
  font-family: 'Arial Black','Arial', sans-serif; 
  margin-bottom:6px; 
  overflow: hidden; 
  word-break: break-word; 
  padding-left: 3px; 
  padding-right: 3px;
}
.boxnumber label { display: inline-flex; line-height: 60px;}
.row.titlerow { padding-top:15px; }
.row.titlerow .scs_label_md { vertical-align: bottom; }
.row.valuerow.top { padding-top:15px; }
.row.valuerow {border-bottom: #f7f7f7 3px solid; padding-top:6px; }
.row.valuerow.bottom {border-bottom: none; margin-bottom: 40px; }
.row.valuerow label {margin:0;padding-bottom: 10px;}
.greycol { background: #e9e9e9; border-radius: 0px 4px 0px 0px; }
.buttonrow { background:#333; border-radius: 0px 0px 4px 4px; padding-top:5px; padding-bottom: 15px; }
.moreinfo { list-style: none; font-size: 1.1em; }
.moreinfo li { padding-bottom:6px; }
.moreinfo li::before { content: "\2022"; color: #00a7c2; font-weight: bold;  display: inline-block; width: 1em; margin-left: -1em; }
.tandc { background: #e5e5e5; font-family: 'Courier New', 'monospace'; font-size: 1.2em; height: 420px; overflow-y: scroll; padding: 12px; border: 1px dashed #fff; margin-bottom:20px; }
.scs_label_sm { font-size:1.1em; font-weight:normal; }
.scs_label_md { font-size:1.2em; font-weight:bold; line-height: 1.2em; }
.scs_label_lg { font-size:2.4em; font-weight:bold; line-height: 1.2em; }

.scs_value_sm { font-size:1.1em; font-weight:normal; margin:0; }
.scs_value_md { font-size:1.2em; font-weight:normal; margin:0; }
.scs_value_lg { font-size:2.4em; font-weight:normal; margin:0; }

#supplier-reply-bid-value-row { text-align: center; }

.info_block {
  background-color: #fafafa; 
  margin-left: 4px;
  margin-right: 4px;
  padding-top: 7px;
  padding-bottom: 7px;
  word-break: break-word;
  font-size: 1rem;
  text-align: center;
  border-radius: 5px;
  height: fit-content;
  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}

.complex_bid_info_container {
  height:100%;
  padding-top: 5%; 
  padding-bottom: 5%; 
  padding-left: 3%;
  padding-right: 3%
}

.complex_bid_info_inner_container {
  max-width: 500px;
  padding: 20px; 
  margin: auto;
}

/* option buttons */
.option-button {
    display: inline-block;
    position: relative;
    padding-left: 32px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    padding-right: 20px;
    user-select: none;
}
/* Option Button: Hide the browser's default radio button */
.option-button input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
/* Option Button: Create a custom radio button */
.option-button-radio {
  position: absolute;
  top: 0;
  left: 0;
  height: 22px;
  width: 22px;
  background-color: #eee;
  border-radius: 50%;
}
/* Option Button: On mouse-over, add a grey background color */
.option-button:hover input ~ .option-button-radio {
  background-color: #ccc;
}

/* Option Button: When the radio button is checked but the pane is not selected, make the background dark grey */
.not-selected .option-button input:checked ~ .option-button-radio {
  background-color: #c0c0c0;
}
/* Option Button: When the radio button is checked, add a green background */
.option-button input:checked ~ .option-button-radio {
  background-color: #65a137;
}
.option-button input:checked ~ .option-button-radio-readonly {
  background-color: #ccc;
}

/* Option Button: Create the indicator (the dot/circle - hidden when checked) */
.option-button-radio:after {
  content: "";
  position: absolute;
  display: none;
}
/* Option Button: Show the indicator (dot/circle) when not checked */
.option-button input:not(:checked) ~ .option-button-radio:after {
  display: block;
}
/* Option Button: Style the indicator (dot/circle) */
.option-button .option-button-radio:after {
 	top: 3px;
	left: 3px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: white;
}

.option-panel {
  margin: 0 5px;
  padding: 20px 10px;
  height: 100%;
}

.option-panel.selected {
  background-color: #f5f5f5;
}

.option-panel.not-selected {
  background-color: #fcfcfc;
  color: #ccc;
}

.option-panel.not-selected .form-control{
  color: #ccc;
}

.topactionrow {
  padding: 15px 5px;
}

.dealrow {
  padding: 15px 5px;
}

.bottomrow {
  padding: 15px 5px;
}

.yes-no .option-button {
  font-size: 1em;
}

.yes-no .option-button-label {
  line-height: 20px;
}

.option-panel .panel .option-button-label {
  font-size: 22px;
  line-height: 24px;
}

.option-panel .panel a.question-icon {
  line-height: 20px;
  font-size: 12px;
  height: 18px;
  width: 18px;
  vertical-align: middle;
  margin-bottom: 8px;
}

.yes-no .option-button-radio {
  height: 16px;
  width: 16px;
}
.yes-no .option-button .option-button-radio:after {
 	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
}

label, .yes-no-label, .range-slider-label, .date-picker-label, .date-range-picker-label{
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.2em;
  margin-top: 6px;
}

.control-label, .range-slider-label, .date-picker-label, .date-range-picker-label {
  line-height: 2em;
  display: inline-block;
  vertical-align: baseline;
  margin-top: 6px;
}

.date-range-picker-input, .date-range-picker-to span {
  padding-left: 6px;
  padding-right: 6px;
}

.control-label.hardcoded
{
  color:#666;
  font-size:1rem;
  font-weight:normal;
  padding-left: .95rem;
}

.not-selected .control-label.hardcoded
{
  opacity: 0.25;
}

.not-selected .date {
  opacity: 0.5;
}

.dealrow .container-fluid .row, .bottomrow .container-fluid .row {
  margin-top: 5px;
  margin-bottom: 10px;
}

.range-slider-text {
  width: 100%;
}

.range-slider-error {
  margin-top: -5px;
}

.logotop {
  margin: 0;
  padding: 20px;
}

#error-msg-row { padding-top: 15px; }
#go-back-row { padding-bottom: 15px; }

a.question-icon {
  margin-left:6px;
  color:#fff;
  background-color:#00a7c2;
  width:16px;
  height:16px;
  display:inline-block;
  cursor: help;
  border-radius:100%;
  font-size:10px;
  font-weight:bold;
  text-align:center;
  text-decoration:none;
  -webkit-box-shadow: inset -1px -1px 1px 0px rgba(0,0,0,0.25);
  -moz-box-shadow: inset -1px -1px 1px 0px rgba(0,0,0,0.25);
  box-shadow: inset -1px -1px 1px 0px rgba(0,0,0,0.25);
  opacity: 0.25;
  vertical-align: text-bottom;
}

a.question-icon:hover {
  opacity: 0.75;
  color:#fff;
}
.not-selected a.question-icon {
  opacity: 0.1;
}

.not-selected a.question-icon:hover {
  opacity: 0.1;
  color:#fff;
}

.tabcontainer {
  width: 100%;
}

.tab-slider--nav {
  margin-bottom: 20px;
}
.tab-slider--tabs {
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.tab-slider--trigger {
  font-size: 1.4em;
  line-height: 1;
  font-weight: bold;
  color: #333;
  text-transform: uppercase;
  text-align: center;
  padding: 11px 20px;
  position: relative;
  z-index: 2;
  cursor: pointer;
  display: inline-block;
  -webkit-transition: color 250ms ease-in-out;
  transition: color 250ms ease-in-out;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-bottom: 3px transparent;
}
.tab-slider--trigger.active {
  color:  #00a7c2;
  border-bottom: 3px solid #00a7c2;
}
.tab-slider--body {
  margin-bottom: 20px;
}

.tab-slider--container
{
  display:block;
}

#tyreviewscontainer {
  width:100%; height:100%; min-height:500px;padding:8px;background:#fff;
}

#tyreviewscontainer iframe {
  min-height:480px;
}

.mapembed {
  width:100%;
  min-height:200px;
}

/* Redundant selectors due to specificity rules. https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity */
#ContentContainer button.dual-rate-toggle, button.dual-rate-toggle {
  color: #65a338;
  text-decoration: underline;
  text-transform: none;
}
#ContentContainer button.dual-rate-toggle:focus, button.dual-rate-toggle:focus {
  box-shadow: none;
}

/* input range slider style, generated by https://www.cssportal.com/style-input-range/ */
input[type=range] {
  height: 37px;
  -webkit-appearance: none;
  /* margin: 10px 0; changed from what was generated */
  width: 100%;
  background-color: transparent; /* changed from what was generated */
  border-width: 0; /* changed from what was generated */
}
input[type=range]:focus {
  background-color: transparent; /* changed from what was generated */
  border-width: 0; /* changed from what was generated */
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 10px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background: #D6D6D6;
  border-radius: 5px;
  border: 0px solid #000000;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 0px 0px 0px #D1D1D1;
  border: 1px solid #65A137;
  height: 30px;
  width: 9px;
  border-radius: 5px;
  background: #65A137;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -10.5px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #D6D6D6;
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 10px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background: #D6D6D6;
  border-radius: 5px;
  border: 0px solid #000000;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 0px 0px 0px #D1D1D1;
  border: 1px solid #65A137;
  height: 30px;
  width: 9px;
  border-radius: 5px;
  background: #65A137;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 10px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #D6D6D6;
  border: 0px solid #000000;
  border-radius: 10px;
  box-shadow: 0px 0px 0px #000000;
}
input[type=range]::-ms-fill-upper {
  background: #D6D6D6;
  border: 0px solid #000000;
  border-radius: 10px;
  box-shadow: 0px 0px 0px #000000;
}
input[type=range]::-ms-thumb {
  margin-top: 1px;
  box-shadow: 0px 0px 0px #D1D1D1;
  border: 1px solid #65A137;
  height: 30px;
  width: 9px;
  border-radius: 5px;
  background: #65A137;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: #D6D6D6;
}
input[type=range]:focus::-ms-fill-upper {
  background: #D6D6D6;
}
/* additional slider styles that were not generated */
.option-panel.not-selected input[type=range]::-webkit-slider-runnable-track {
  background: #eee;
}
.option-panel.not-selected input[type=range]::-webkit-slider-thumb {
  background: #ccc;
  border-color: #ccc;
}
.option-panel.not-selected input[type=range]::-moz-range-track {
  background: #eee;
}
.option-panel.not-selected input[type=range]::-moz-range-thumb {
  background: #ccc;
  border-color: #ccc;
}
.option-panel.not-selected input[type=range]::-ms-fill-lower {
  background: #eee;
}
.option-panel.not-selected input[type=range]::-ms-fill-upper {
  background: #eee;
}
.option-panel.not-selected input[type=range]::-ms-thumb {
  background: #ccc;
  border-color: #ccc;
}
/* end input range slider style */

.input-group-text.auto-renewal {
  appearance: auto;
  padding-left: 6px;
  padding-right: 6px;
  background-color: #fcfcfc;
  text-overflow: clip;
  flex-basis: auto;
  flex-grow: 1;
  flex-shrink: 1;
  text-rendering: auto;
  color: #CCCCCC;
}

img.grayscale {
  filter: grayscale(1) opacity(.25);
}

.switch{
	--hue: 223;
	--bg: hsl(var(--hue),90%,90%);
	--fg: hsl(var(--hue),90%,10%);
	--trans-dur: 0.3s;
	--trans-timing: cubic-bezier(0.65,0,0.35,1);
	font-size: 1em/1.5;
}
.switch,
.switch__input {
	-webkit-tap-highlight-color: transparent;
}
.switch {
	position: relative;
	width: 3em;
	height: 1.5em;
}
label.switch{
  margin-top: 2px;
  margin-bottom: -3px;
}
.switch__check {
	display: block;
	transform: translateX(0) rotate(0);
	transition: transform var(--trans-dur) var(--trans-timing);
	z-index: 1;
}
.switch__check-line {
	transform: translate(0,0);
	transition:
		stroke var(--trans-dur) var(--trans-timing),
		stroke-dashoffset var(--trans-dur) var(--trans-timing),
		transform var(--trans-dur) var(--trans-timing);
}
.switch__input {
	background-color: hsla(var(--hue),90%,50%,0);
	border-radius: 1.5em;
	box-shadow:
		0 0 0 0.0625em hsl(var(--hue),10%,50%) inset,
		0 0.25em 1em hsla(var(--hue),90%,10%,0);
	cursor: pointer;
	display: block;
	outline: transparent;
	width: 100%;
	height: 100%;
	transition:
		background-color var(--trans-dur) var(--trans-timing),
		box-shadow var(--trans-dur) var(--trans-timing);
	-webkit-appearance: none;
	appearance: none;
}
.switch__input:before,
.switch__input:after {
	content: "";
	display: block;
}
.switch__input:before {
	background-color: hsl(0,0%,100%);
	border-radius: 50%;
	box-shadow: 0 0.125em 0.25em hsla(var(--hue),90%,10%,0);
	transition:
		box-shadow var(--trans-dur) var(--trans-timing),
		transform var(--trans-dur) var(--trans-timing);
}
.switch__input:after {
	border-radius: 0.75em;
	box-shadow: 0 0 0 0.125em hsla(var(--hue),90%,70%,0);
	width: 100%;
	height: 100%;
	transition: box-shadow 0.15s linear;
  position:relative;
    right:-55px;
}
.switch__input:focus-visible:after {
	box-shadow: 0 0 0 0.125em hsla(var(--hue),90%,70%,1);
}
.switch__check,
.switch__input:before {
	position: absolute;
	top: 0.25em;
	left: 0.25em;
	width: 1em;
	height: 1em;
}
.switch__input:checked {
	background-color: #65a338;
	box-shadow:
		0 0 0 0.0625em #65a338 inset,
		0 0.25em 1em hsla(var(--hue),90%,10%,0.5);
}
.switch__input:checked:before {
	box-shadow: 0 0.125em 0.25em hsla(var(--hue),90%,10%,0.5);
	transform: translateX(1.5em);
}
.switch__input:checked + .switch__check {
	animation: switch-check var(--trans-dur) var(--trans-timing);
	transform: translateX(1.5em) rotate(-225deg);
}
.switch__input:checked + .switch__check .switch__check-line {
	stroke: #65a338;
	stroke-dashoffset: 0;
	transform: translate(-1px,-1px);
	transition-delay: 0s, calc(var(--trans-dur) / 2), 0s;
}
.switch__sr {
	overflow: hidden;
	position: absolute;
	width: 1px;
	height: 1px;
}

/* Animations */
@keyframes switch-check {
	from {
		transform: translateX(0) rotate(0);
	}
	to {
		transform: translateX(1.5em) rotate(135deg);
	}
}
