#container {
        max-width: 400px;
        margin: auto;
        padding: 20px;

        /* Begin Gradient */
        background: #eee; /* Old browsers */
        background: -moz-linear-gradient(top,  #eee 0%, #fff 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eee), color-stop(100%,#fff)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  #eee 0%,#fff 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  #eee 0%,#fff 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  #eee 0%,#fff 100%); /* IE10+ */
        background: linear-gradient(to bottom,  #eee 0%,#fff 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eee', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
        /* End Gradient */
        border: 1px solid #eee;
        border-radius: 10px;
        font-family: Arial, Helvetica, sans-serif;
}

h1 {
        margin: 0 0 5px 0;
        font-size: 20px;
        height: 23px;
}

p {
        margin: 0 0 5px 0;
        font-size: 15px;
}

label {
        display: block;
        font-size: 14px;
}

input, select {
        display: inline-block;
        margin-bottom: 5px;
}

select::-ms-expand {
        display: none;
}

select {
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        background-image:
                linear-gradient(45deg, transparent 50%, gray 50%),
                linear-gradient(135deg, gray 50%, transparent 50%),
                linear-gradient(to right, #ccc, #ccc);
        background-position:
                calc(100% - 20px) calc(1em + 2px),
                calc(100% - 15px) calc(1em + 2px),
                calc(100% - 2.5em) 0.5em;
        background-size:
                5px 5px,
                5px 5px,
                1px 1.5em;
        background-repeat: no-repeat;
}

td {
        color: #484848;
}

.required {
        color: #f00;
}

.error {
        color: #f00;
}

#container.logged-in select {
        /*width: 63%;*/
        margin-bottom: 5px;
        display: block;
}

#container.logged-in select, #container.logged-in button {
        font-size: 16px;
}

#container.logged-in .get-list-result-row select, #container.logged-in .get-list-result-row button {
        font-size: 13px;
}

#loader {
        vertical-align: middle;
        height: 23px;
        position: relative;
        top: -2px; display: none;
}

.get-list-result-row {
        margin-top: 1.6em;
        font-size: 12px;
        border: 1px solid #afafaf;
    border-radius: 2px;
}

.description {
        display: none;
}

.description td {
        padding: 10px 4px;
        color: #888888;
        background: #eee;
}
.description.description-open {
        display: table-row;
}

#results {
        margin-top: 40px;
}

.g-recaptcha {
        margin: 5px 0 8px 0;
}

.no-credits {
        border-color: red;
}
.self-sched-input:hover, .self-sched-input:focus {
        border: 1px solid #009cde;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
}
.self-sched-input:not([type=submit]):hover {
        -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        border: 1px solid #009cde;
}
.self-sched-input:focus {
        -moz-box-shadow: 0 0 5px rgba(58, 144, 194, 0.6), 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        -webkit-box-shadow: 0 0 5px rgba(58, 144, 194, 0.6), 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        box-shadow: 0 0 5px rgba(58, 144, 194, 0.6), 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        border: 1px solid #009cde;
        background-color: #fff;
}
.self-sched-input {
        outline: 0;
        height: 2.6em;
        padding: 0 24px 0 12px;
        border-width: 1px;
        border-style: solid;
        text-overflow: ellipsis;
        overflow: hidden;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        font-size: 1em;
        font-weight: normal;
        text-shadow: none;
        -moz-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        -webkit-box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        box-shadow: 0 2px 2px rgba(0, 0, 0, 0.15) inset;
        box-shadow: none;
        line-height: 1.5em;
        border-color: #cde3f1;
        background-color: #fff;
        color: #333;
    cursor: pointer;
    cursor: pointer;
}

.self-sched-input {
        -webkit-transition: border 0.2s ease-in-out, background-color 0.2s ease-in-out;
        -moz-transition: border 0.2s ease-in-out, background-color 0.2s ease-in-out;
        -ms-transition: border 0.2s ease-in-out, background-color 0.2s ease-in-out;
        -o-transition: border 0.2s ease-in-out, background-color 0.2s ease-in-out;
        transition: border 0.2s ease-in-out, background-color 0.2s ease-in-out;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        -moz-background-clip: padding-box;
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
}

.dob-wrapper, .phone-wrapper {
        display: flex;
        justify-content: space-between;
        line-height: 40px;
}

/*.dob-wrapper select,
.dob-wrapper input,
.phone-wrapper select,
.phone-wrapper input {
        margin: 0 2px;
}*/

.submit-button {
        color: #fff;
        background: #0E97FF;
        border: 1px solid #006ABB;
        cursor: pointer;
}
.submit-button:focus {
        color: #afafaf;
        background: #0E97FF;
}
.cancel-button, .cancel-button:focus {
        color: #868686;
        background: #fff;
        padding: 0;
        cursor: pointer;
}

.float-btn {
        position: fixed;
        width: 120px;
}

.date-legend {
        font-size: 1.4em;
        text-decoration: underline;
}
.ss-appt-name {
        font-size: 1.5em;
        font-weight: 900;
        cursor: default;
}
.ss-appt-name img {
        height: 0.8em;
        width: 0.8em;
}
.ss-trainer-name {
	font-weight: 600;
	float: right;
	display: flex;
	align-items: center;
	justify-content: center;
}
.ss-trainer-name img {
	margin-right: 0.4em;
    position: relative;
}
.ss-appt-duration {
        line-height: 1.9em;
        font-size: 1em;
}
.ss-appt-clock {
	margin-right: 0.4em;
    height: 1.1em;
    width: 1.1em;
    position: relative;
}
.time {
	width: 8.4em;
    height: 2.6em;
    border: 1px solid #cde3f1;
    padding: 0.2em 0.4em;
    font-weight: 600;
    border-radius: 0.3em;
    position: relative;
    top: 0.18em;
    right: 0.1em;
}
.desc-link {
        margin-bottom: 2px;
}
.book-btn, .book-btn:focus {
        width: 30%;
        padding: 0;
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -o-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease;
        background: #0E97FF;
        color: #fff;
        opacity: 0.3;
}
.get-list-result-row:hover .book-btn {
        opacity: 1;
}

.book-btn-wrapper {
        display: flex;
        justify-content: flex-end;
}

.cancel-btn-container {
        display: flex;
        justify-content: space-between;
        margin-bottom: 20px;
        width: 100%;
}

.cancel-button, .update-button {
    width: 25%;
    padding: 0;
}

.cancel-button, .cancel-btn-container {
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -o-transition: all 1s ease;
        -ms-transition: all 1s ease;
        transition: all 1s ease;
        float: right;
}

#container {
        position: relative;
}

.fixed-back {
    position: fixed;
    top: 0;
    z-index: 99;
    padding: 4px 0 0 0;
    max-width: 300px;
    width: 100%;
}

.fixed-back input {
        width: 100%;
}

.btn-anchor {
	position: fixed;
	top: 0;
	max-width: 400px;
	width: 100%;
	height: 50px;
	margin-left: -20px;
	opacity: 0;
	background: #009cde;
	z-index: 98;
	-webkit-transition: opacity 0.3s ease;
	-moz-transition: opacity 0.3s ease;
	-o-transition: opacity 0.3s ease;
	-ms-transition: opacity 0.3s ease;
	transition: opacity 0.3s ease;
	pointer-events: none;
}

.btn-anchor-show {
        opacity: 1;
        display: flex;
        justify-content: flex-end;
        pointer-events: inherit;
}

.upBtn {
        height: 44px;
        width: 40px;
        position: relative;
        background: url(/Static/Images/up_arrow.png) no-repeat center;
        background-size: 26px;
        cursor: pointer;
    margin: 0.2em 1em 0.2em 0.2em;
}

#location {
	margin-bottom: 20px;
}

.nav {
	margin:10px 0;
}

.searchTab, .bookedTab {
    text-transform: uppercase;
    font-size: 11px;
}


.nav-tabs > li, .nav-pills > li {
    float:none;
    display:inline-block;
    max-width: 49%;
    width: 100%;
}

.nav-tabs, .nav-pills {
    text-align:center;
}
.booked-row {
	display: flex;
	justify-content: space-between;
	margin: 4px 0;
}
.bookedAppt {
	display: flex;
	flex-direction: column;
	border: 1px solid #ccc;
	margin: 1em 0;
	padding: 0.6em;
	border-radius: 2px;
	color: #666666;
	font-size: 0.8em;
}

.booked-user-name {    
	display: flex;
    font-size: 0.8em;
    font-weight: bold;
    align-items: center;
}
.booked-appt-name {
	font-weight: bold;
	font-size: 1.2em;
}
.booked-icons {
	margin-right: 0.4em;
	height: 1em;
	width: 1em;
	position: relative;
}
.booked-appt-date, .booked-appt-time {
	display: flex;
	text-transform: uppercase;
}
.booked-appt-date {
	text-decoration: underline;
}
.booked-appt-cancel {
	max-width: 49%;
	padding: 4px;
	margin: 0;
	opacity: 0.5;
}
.bookedAppt:hover .booked-appt-cancel {
	opacity: 1;
}