:root  { --color1: #0d6efd; --color2: #4c93fd; }

header .hdr { height: 50px; }
header .logo { font-size: 28px; color: #212529; }
header .logo a { text-decoration: none; color: #212529; }
header .icons { font-size: 28px; color: #212529; }
header .icons a { text-decoration: none; color: #212529; }
header .navbar-toggler:focus, .navbar-toggler:active, .navbar-toggler-icon:focus { outline: none; box-shadow: none; margin-bottom: 10px; }
header .navbar a { white-space: nowrap !important; color: #fff !important; margin: 0 20px 0 0; }
header .navbar-nav > li > .dropdown-menu { background-color: #212529; color: #fff; border: none; }
header .navbar-nav > li > .dropdown-menu a { color: #fff !important; margin: 10px 0; }
header .navbar-nav > li > .dropdown-menu a:hover { background-color: #2f2f2f !important; }
header .menu { min-height: 65px; }

main .container { margin: 25px auto 50px auto !important; }

footer .container { border-top: #ccc 1px solid; padding-top: 15px; text-align: center; }

h1 { margin-bottom: 20px !important; }

.table thead th, .table .thead th { background: #212529; color: #fff; border: #444 1px solid; padding: 4px 10px 5px 10px; font-weight: 600; white-space: nowrap; }
.table thead th a, .table .thead th a { text-decoration: none; color: #fff; cursor: pointer; }
.table tbody td { border: #ccc 1px solid; padding: 5px 10px; white-space: nowrap; border-bottom: #aaa 1px solid !important; }
.table tbody td a { text-decoration: none; color: #000; cursor: pointer; }
.table tfoot td, .table .tfoot td { background: #ddd; border: #888 1px solid !important; padding: 2px 10px; }
.table .blankspace td { border: none; padding: 0; }
.table .cellnotes { font-size: 10px; }
.table .celltrans { padding-left: 25px; }
.table .redline td { border-top: #f00 4px solid !important; }

.ddate { display: inline-block; white-space: nowrap; }

.text-green { color: #090; font-weight: 600; }
.text-red { color: #f00; font-weight: 600; }

.calendar td { min-height: 150px !important; height: 150px !important; padding-bottom: 10px !important; }
.calendarmonth td { width: 14.2% !important; }
.calendar .inactive { background: #ccc; }
.calendar .today { background: var(--color1); color: #fff; }
.calendar .entry { background: #f1f1f1; padding: 7px 10px 10px 10px; margin: 2px 0; color: #000; cursor: pointer; }
.calendar .entry .avail { display: inline-block; float: right; }
.calendar .entry .details { font-size: 11px; }

.vtop { padding-top: 0px; }
.vtop2 { padding-top: 5px; }
.expand { width: 100%; }
.none { display: none; }
.w50 { width: 50px !important; }
.w65 { width: 65px !important; }
.w75 { width: 75px !important; }
.w100 { width: 100px !important; }
.w150 { width: 150px !important; }
.inline { display: inline-block !important; }
.nowrap { white-space: nowrap !important; }

.btn { cursor: pointer; min-width: 150px; margin-top: 5px; }
.btn-default { border: #ccc 1px solid; }
.btn-icon { width: auto !important; min-width: auto !important; padding: 5px 10px !important; font-size: 20px; }

.freq { padding-right: calc(1.5em + .75rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(.375em + .1875rem) center; background-size: calc(.75em + .375rem) calc(.75em + .375rem); }
.freq2 { padding-right: calc(1.5em + .75rem); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(.375em + .1875rem) top 3px; background-size: calc(.75em + .375rem) calc(.75em + .375rem); }

.bi-biggie { font-size: 100px; }

.dtpicker, .dpicker { width: 225px; cursor: pointer; background-position: center right 10px; background-repeat: no-repeat; background-size: 17px; background-color: #fff !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath fill-rule='evenodd' d='M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3e%3c/svg%3e"); }
.datetimepicker {  box-shadow: 0px 0px 0px 4px var(--color1) inset; border: none !important; background: #f0f0f0; padding: 9px; width: 300px !important; height: 260px !important; }
.datetimepicker table { width: 100%; }
.datetimepicker td { padding: 3px 10px !important; }
.datetimepicker .hour { padding: 0px 8px !important; width: 21% !important; height: 25px !important; line-height: 20px !important; }
.datetimepicker th.switch, .datetimepicker th.prev, .datetimepicker th.next { border-radius: 0; background: var(--color1) !important; color: #fff; padding: 4px; }
.datetimepicker th.switch { font-size: 18px; }
.datetimepicker th.prev { cursor: pointer; background-repeat: no-repeat !important; background-image: url("../images/icon-left.png") !important; background-position: 5px 7px !important; height: 20px; top: 5px !important; left: 2px !important; margin: 0 !important; }
.datetimepicker th.next { cursor: pointer; background-repeat: no-repeat !important; background-image: url("../images/icon-right.png") !important; background-position: right 5px center !important; height: 20px; top: 5px !important; right: 0 !important; margin: 0 !important; }

.ui-datepicker.ui-widget.ui-widget-content { border: 4px solid var(--color1) !important; padding: 5px; background: #f0f0f0 !important; }
.ui-state-default, .ui-widget-content .ui-state-default { background: #f0f0f0 !important; }
.ui-datepicker .ui-widget-header { padding: 0 !important; font-size: 18px; border-radius: 0; border: 1px solid var(--color1) !important; background: var(--color1) !important; color: #fff; font-weight: bold; }
.ui-datepicker .ui-state-active, .ui-datepicker .ui-widget-content .ui-state-active, .ui-datepicker .ui-widget-header .ui-state-active, .ui-datepicker a.ui-button:active, .ui-datepicker .ui-button:active, .ui-datepicker .ui-button.ui-state-active:hover { border: 1px solid var(--color1) !important; background: var(--color1) !important; font-weight: normal; color: #ffffff; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-datepicker-prev-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { background-color: var(--color1) !important; border: none; color: #fff; }
.ui-icon-circle-triangle-w { cursor: pointer; background-image: url("../images/icon-left.png") !important; background-position: 0; height: 20px; top: 5px !important; left: 2px !important; margin: 0 !important; }
.ui-icon-circle-triangle-e { cursor: pointer; background-image: url("../images/icon-right.png") !important; background-position: 0; height: 20px; top: 5px !important; right: 0 !important; margin: 0 !important; }
.ui-state-default, .ui-widget-content .ui-state-default { border: none; text-align: center; }
.ui-datepicker td, .ui-datepicker th { font-size: 16px; font-weight: 700; border: none; text-align: center; background: #f0f0f0 !important; }

.pills .nav { border: none; }
.pills .nav .nav-link { padding-top: 5px; text-align: left; height: 41px; font-weight: 600; border: none; border-left: none !important; background: #eee !important; color: #212529; border: #ddd 1px solid; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
.pills .nav .nav-link:first-child { border-left: #ddd 1px solid; -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; border-top-left-radius: 10px; }
.pills .nav .nav-link:last-child { -webkit-border-top-right-radius: 10px; -moz-border-radius-topright: 10px; border-top-right-radius: 10px; }
.pills .nav .nav-link:hover { color: #fff; border: none; background: var(--color1) !important; }
.pills .nav .active { color: #fff; border: none; background: var(--color1) !important; border-radius: 0; border: var(--color1) 1px solid !important; }
.pills .tab-content { padding: 30px 20px 20px 20px; border: #ddd 1px solid; border-top: none; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; }
.pills .nav .nav-link .bi { margin-right: 5px; }

.customersummary { margin: 0 0 20px 0; padding: 10px 20px; background: #f9f9f9; border: #ddd 1px solid; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
.customersummary .name { font-size: 26px; font-weight: 800; }
.customersummary .text-green { color: #090; font-weight: 600; }
.customersummary .text-red { color: #f00; font-weight: 600; }
.customersummary ul { margin: 0; padding: 10px 0 0 0; list-style-type: none; }
.customersummary li { list-style-type: none; margin: 10px 0; padding: 10px 0 0 0; border-top: #eee 1px solid; }
.customersummary a { text-decoration: none; color: #000; }
.customersummary a .bi { margin-right: 5px; }
.customersummary hr { background-color: #bbb !important; }
.customersummary .mainimage { cursor: pointer; background: #fff center center no-repeat; font-size: 175px; line-height: 120px; padding: 0; border: #999 1px solid; display: inline-block; width: 200px; height: 200px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
.customersummary .mainimage a { margin-left: 5px; margin-bottom: 0px; display: inline-block; padding: 0 !important; line-height: 1px; }
.customersummary .petimage { background: #fff center center no-repeat; font-size: 175px; line-height: 120px; padding: 0; border: #999 1px solid; display: inline-block; width: 200px; height: 200px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
.customersummary .petimage a { margin-left: 5px; margin-bottom: 0px; display: inline-block; padding: 0 !important; line-height: 1px; }

.accordion-button:not(.collapsed) { background-color: var(--color1) !important; color: #fff; font-weight: 600; }
.accordion-button { padding: 5px 15px; height: 41px; background-color: var(--color2) !important; color: #fff; font-weight: 600; }
.accordion-button::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }
.accordion-button:not(.collapsed)::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); }
.accordion-item:first-of-type .accordion-button, .accordion-item:first-of-type { -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topright: 10px; border-top-right-radius: 10px; }
.accordion-item:last-of-type .accordion-button.collapsed, .accordion-item:last-of-type { -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomright: 10px; border-bottom-right-radius: 10px; }
.accordion-button .bi { margin-right: 5px; }
.accordion-button:focus { box-shadow: none; }

.fancybox-bg { background: #fff; }
.fancybox-is-open .fancybox-bg { opacity: 0.5; opacity: 0.90; }
.fancybox-is-open .fancybox-iframe { border: #ccc 1px solid; overflow: hidden !important; padding: 10px; }
.fancybox-slide--iframe .fancybox-content { padding: 10px; max-width: 600px; max-height: 600px; min-height: 400px; }

.vaccines .exptext { font-size: 10px; margin: 2px 0 5px 0 !important; }

.simage img { height: 150px; width: 150px; border: #ccc 1px solid; float: left; margin-right: 10px; cursor: pointer; }
.simage .txt { cursor: pointer; height: 25px; }
.simage .noshow { display: none; }

.table2 { border-collapse: collapse; }
.table2 td { padding: 2px 10px 2px 0px; }
.table .btn { color: #fff !important; }

.colorpicker-element .input-group-addon i, .colorpicker-element .add-on i { width: 25px !important; height: 25px !important; border: #cccccc 1px solid; }

.agreement { border: #ccc 3px dashed; padding: 50px; }
.sigs { border: #f00 1px dotted; }

.captcha { width: 100%; border: #ccc 1px solid; margin: 2px 0; }

.pwd { font-size: 11px; }
.cursor-hand { cursor: pointer; }

.balanceinfo { color: #fff; float: right; }
.balanceinfo ul { list-style-type: none; margin: 0; padding: 0; }
.balanceinfo li { margin: 0 0 0 25px; padding: 0; float: left; }

.datetimepopupcontainer .fancybox-slide--iframe .fancybox-content { width: 450px; height: 450px !important; max-width: 450px; max-height: 450px !important; margin: 0; }
.dtp { width: 225px; cursor: pointer; background-position: center right 10px; background-repeat: no-repeat; background-size: 17px; background-color: #fff !important; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath fill-rule='evenodd' d='M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3e%3c/svg%3e"); }

@media (max-width: 580px) {

	.pills .nav .nav-link:first-child { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
	.pills .nav .nav-link:last-child { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }

	.vaccines .docs { margin: 0 0 5px 0 !important; }
	.vaccines .exptext { font-size: 10px; margin: 2px 0 15px 0 !important; }

	.balanceinfo { float: none; }
	.balanceinfo li { margin: 10px 0 20px 0; float: none; }

}