/*FONTS*/
@font-face {
  font-family: "proxima-nova";
  src: url("fonts/proximanova-regular-webfont.ttf") format("opentype");
}
@font-face {
  font-family: "proxima-nova-semibold";
  src: url("fonts/proximanova-semibold-webfont.ttf") format("opentype");
}
@font-face {
  font-family: "proxima-nova-bold";
  src: url("fonts/proximanova-bold-webfont.ttf") format("opentype");
}
@font-face {
  font-family: "proxima-nova-light";
  src: url("fonts/proximanova-light-webfont.ttf") format("opentype");
}
/*END FONTS*/
body, .body-text {
  font-family: "proxima-nova";
  font-size: 15px;
  line-height: 22px;
  color: #000000;
  -webkit-overflow-scrolling: touch;
}

h1 {
  font-family: "proxima-nova";
  font-size: 30px;
}

h2 {
  font-family: "proxima-nova-semibold";
  font-size: 25px;
}

h3 {
  font-family: "proxima-nova-bold";
  font-size: 20px;
}

.small-text {
  font-family: "proxima-nova";
  font-size: 12px;
  line-height: 18px;
}

.application-name {
  text-align: center;
  font-family: "proxima-nova-light";
  font-size: 24px;
  color: white;
}

#startPageImage {
  padding-bottom: 30px;
  width: 100%;
}

#startPageLogo {
  width: 100%;
}

/*HEADER*/
.ui-toolbar-header {
  border: none;
}

/*main header container*/
.header {
  border: none;
  background-color: #006dbf !important;
}

/* main header */
#mainHeader {
  height: 55px;
}

/* main header serch icon */
#mainHeader .header-icon {
  height: 45px;
}

#mainHeader .img-container:before {
  content: " ";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

/* main header background img */
#mainHeader .img-container {
  height: 55px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 20px;
  right: 20px;
  /*font: 0/0 a;*/
}

#mainHeader .img-container-right {
  text-align: right;
  left: 250px;
}

#mainHeader .img-container img {
  vertical-align: middle;
  display: inline-block;
}

#headerLogo {
  height: 30px;
}

/*HEADER WITH SCREEN TITLE AND SIDE ACTIONS*/
#headerBar {
  display: flex;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 5px;
  padding-top: 5px;
  color: #ffffff !important;
}

/*SCREEN TITLE*/
.headerBarTitle {
  text-align: center;
  width: 100%;
  font-size: 18px;
  font-family: "proxima-nova-bold";
  font-weight: normal;
}

/*HEADER TITLE ACTION*/
.headerBarAction {
  font-size: 16px;
  width: 25% !important;
  font-weight: normal;
  font-family: "proxima-nova-semibold";
  color: white !important;
}

.header-bar-action-link {
  color: white !important;
  text-decoration: none;
}

/*CONTAINER FOR SECONDARY NAVIGATION BAR*/
#secondaryHeader {
  display: flex;
  padding-left: 20px;
  padding-right: 20px;
  background-color: #e2eef7;
  height: 50px;
}

/*HEADER LINKS ON SECONDARY NAVIGATION BAR */
.headerLink {
  border: none;
  color: #006dbf !important;
  padding-top: 2px;
  padding-bottom: 2px;
  font-size: 14px !important;
  font-family: "proxima-nova";
  font-weight: normal !important;
  padding-left: 25px;
  margin-right: 0px;
  line-height: 16px;
  background-color: #e2eef7 !important;
  text-align: left !important;
}

.headerLinkRight {
  padding-left: 25px;
}

/*GRADIENT LINE FOR HEADER(s) */
.gradient {
  height: 3px;
  background-image: url("../img/gradient.png");
}

/* END HEADER*/
/*FOOTER*/
/*MAIN FOOTER CONTAINER*/
.footer {
  border: none;
  background-color: #e2eef7 !important;
  padding-right: 20px !important;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}

/*FOOTER CONTAINER WITH HORIZONTAL LINKS */
#secondaryFooter {
  /*display:flex;
  align-items:center; */
  padding: 4px 0px 4px 0px;
  margin-left: 20px;
  margin-right: 20px;
  color: #006dbf;
  text-align: center;
}

/*FOOTER HORIZONTAL LINK STYLING*/
.footerLink {
  border: none;
  color: #006dbf !important;
  padding-top: 1px;
  padding-bottom: 1px;
  font-size: 14px !important;
  background-color: #e2eef7 !important;
  margin-right: 0px;
  font-family: "proxima-nova-semibold";
  font-weight: normal !important;
  /*padding-left:25px !important;*/
  line-height: 20px;
  text-align: left !important;
}

.footerLink:after {
  moz-border-radius: 0 px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
  background-size: 18px 18px;
}

/*FOOTER CONTAINER WITH BUTTON TRAY LINKS */
#buttonTray {
  text-align: center;
  width: 100%;
  display: flex;
  align-items: center;
}

/*CONTAINER FOR BUTTON TRAY LINKS*/
.footerButtonTray {
  margin: 0px;
  width: 100%;
  border: none;
  color: #006dbf !important;
  background-color: #e2eef7 !important;
  font-size: 14px !important;
  font-family: "proxima-nova-semibold";
  font-weight: normal !important;
}

.activeButton {
  background-color: #6c6463 !important;
  color: white !important;
}

.footerButtonTray:after {
  moz-border-radius: 0 px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
  background-size: 24px 24px;
}

/*END FOOTER*/
/*POP UP*/
.modal-popup {
  padding-bottom: 20px !important;
}

.ui-popup {
  background-color: #ffffff;
  border-bottom-right-radius: 10px !important;
  border-bottom-left-radius: 0px !important;
  border-top-left-radius: 10px !important;
  border-top-right-radius: 0px !important;
  border-color: #343434 !important;
}

/*background when pop up is open*/
.ui-popup-background {
  background-color: #343434;
  opacity: 0.85 !important;
}

.modal-popup .ui-popup-screen {
  background-color: #343434;
  opacity: 0.85 !important;
}

.ui-popup > .ui-button-right {
  right: 10px;
  top: 10px;
  border-style: none !important;
  background-color: #ffffff !important;
}

.popUpHeader {
  font-size: 20px;
  color: #343434;
  font-weight: normal;
  font-family: "proxima-nova-bold";
}

.ui-icon-popup-close:after {
  background-image: url("themes/images/close.png");
  background-size: 24px 24px;
}

/*END POP UP */

/* Slider and flipswitch*/
.ui-slider-bg, .ui-flipswitch{
  background-color: #006dbf;
  color:#fff;
}

.ui-slider-handle, .ui-flipswitch-on{
  background-color: #e2eef7;
  border-color: #aaa;
}

/* end slider */
/*MISC STYLING*/
/*LINK CONTAINER FOR NAVIGATION ITEM USED BY HEADER AND FOOTER */
.secondary-nav-item {
  display: flex;
  align-items: center;
  width: 100%;
}

/*Used to divide sections*/
hr {
  border: solid 1px #e8e8e8;
}

/*RIGHT JUSTIFY NAVIGATION ITEMS */
.flexRight {
  justify-content: flex-end;
}

/*PADDING COLOR FOR ALL UI-CONTENT SCREENS*/
.ui-content {
  padding: 20px 20px 0 20px;
}

/*default page background color */
.ui-page {
  background-color: #ffffff;
  margin-top: -10px;
}

/*Main content background color */
.contentBackGround {
  background-color: #ffffff;
}

/*Styling for t and c link on start page*/
.tandc-link {
  color: white !important;
  font-weight: normal;
  font-family: "proxima-nova";
  font-size: 15px !important;
  font-weight: normal !important;
  text-shadow: none;
}

#tandc {
  background: white;
  width: 100%;
  overflow-y: none;
}

#tandc-space {
  padding-top: 50px;
}

#tandcContainer {
  height: 100%;
}

#tandcText {
  overflow-y: scroll;
  height: 85%;
}

.ui-panel .ui-panel-inner {
  overflow: auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /*-webkit-overflow-scrolling: touch;*/
}

/*END MISC STYLING*/
/*BUTTON STYLING*/
/*remove round border on button icons*/
.ui-button-icon-notext {
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important;
  background-color:#006dbf !important; 
  border:none;
}

/*REMOVE HALO ON ALL BUTTONS*/
.ui-button {
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  padding: .5em 1em;
}
.ui-textinput-clear-button{
	padding: 0 !important;
}

.basicButton {
  font-size: 18px;
  font-weight: normal !important;
  font-family: "proxima-nova";
  border-bottom-right-radius: 10px;
  border-top-left-radius: 10px;
  border-style: none;
  text-shadow: 0 0 0 !important;
}

.primaryButton {
  background-color: #ed6f00 !important;
  color: white !important;
}

.primaryButton:active {
  background-color: #b55219 !important;
  color: white !important;
}

.primaryButton.ui-disabled {
  background-color: #e8e8e8 !important;
  color: #afafaf !important;
  opacity: 1;
}

.secondaryButton {
  background-color: #ffffff !important;
  color: #006dbf !important;
  border-style: solid;
  border-color: #006dbf !important;
}

.secondaryButton:active {
  background-color: #d9e9f5 !important;
  color: #006dbf !important;
}

.secondaryButton.ui-disabled {
  background-color: #ffffff !important;
  color: #bfbfbf !important;
  border-style: solid;
  border-color: #bfbfbf !important;
  opacity: 1;
}

.secondaryButtonColoredBackGround.ui-disabled {
  background-color: #4292cf !important;
  color: #afafaf !important;
  border-style: solid;
  border-color: #4292cf !important;
  opacity: 1;
}

.smallButton {
  max-width: 100px;
}

.centeredButton {
  margin: 0 auto;
}

#startPageButton {
  width: 100px;
  margin: 0 auto;
}

/*END BUTTON STYLING*/
/*LIST*/
.listSectionTitle {
  background-position: left center;
  font-family: "proxima-nova-bold";
  font-weight: normal !important;
  color: #006dbf !important;
  text-decoration: none;
  font-size: 20px;
  background-image: url("themes/images/back_arrow.png");
  background-size: 16px;
  background-repeat: no-repeat;
  padding-left: 25px;
}

.listSectionHeader {
  font-size: 15px;
  color: #343434;
  font-family: "proxima-nova-bold";
}

.listSectionParagraph {
  font-size: 15px;
  font-family: "proxima-nova";
  color: #343434;
}

/*END LIST*/
/*COLLAPSIBLE*/
.ui-collapsible-set .ui-collapsible:not(.ui-collapsible-inset) .ui-collapsible-heading .ui-button {
  border-top-width: 1px;
  background-color: #e2eef7;
  border-color: white;
  color: #006dbf;
  font-family: "proxima-nova";
  font-size: 20px;
  font-weight: normal !important;
}

/*FIX MARGINS FOR COLLAPSIBLE */
.ui-collapsible-set .ui-collapsible {
  margin: 0 0;
}

/*REMOVE BOTTOM BORDER FROM OPENED COLLAPSIBLE*/
.ui-collapsible-themed-content .ui-collapsible-content {
  border-style: none;
}

/*CONTENT HEADER*/
div.ui-collapsible-content h2 {
  font-size: 15px;
  font-weight: normal;
  font-family: "proxima-nova-bold";
}

/*CONTENT TEXT*/
div.ui-collapsible-content p {
  font-size: 15px;
  line-height: 22px;
}

/*END COLLAPSIBLE*/
/*FORM STYLE*/
.formHeader {
  font-size: 20px;
  color: #343434;
  font-weight: normal;
  font-family: "proxima-nova-semibold";
}

.formLabel {
  font-size: 15px !important;
  color: #343434;
  font-family: "proxima-nova-semibold";
}

.pass {
  color: #608009;
  font-family: "proxima-nova";
}

.required {
  color: #ff0000;
  font-family: "proxima-nova";
}

label {
  margin-bottom: 0px !important;
}

.ui-input-text {
  border-bottom-right-radius: 3px !important;
  border-bottom-left-radius: 3px !important;
  border-top-left-radius: 3px !important;
  border-top-right-radius: 3px !important;
  border-color: #343434 !important;
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
  box-shadow: none !important;
  background-color: #ffffff !important;
  font-family: "proxima-nova";
}

.inputErrorBorder {
  border-color: #ff0000 !important;
}

input[type=text] {
  padding: 5px 5px 5px 5px;
  font-family: "proxima-nova";
}

.ui-hide-label.ui-br, .no-field-separator {
  border-bottom-width: 0;
}

.ui-field-contain.ui-hide-label, .no-field-separator {
  margin: 1em 0;
  padding: 0;
}

.textinput1 {
  width: 150px;
  display: inline-block;
}

.inlineButton {
  display: inline;
}

/*REMOVE HALO ON INPUTS*/
.ui-focus {
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

/*END FORM STYLE*/
/*selects*/
h1.ui-title {
  color: #006dbf;
  text-shadow: 0 0 0 !important;
  font-family: "proxima-nova";
  font-weight: normal !important;
}

/*placeholder background color */
.ui-selectmenu .ui-toolbar-header {
  background-color: #ffffff !important;
}

/*select options*/
.ui-listview li a {
  background-color: #006dbf !important;
  color: #ffffff !important;
  border-color: #006dbf !important;
  font-family: "proxima-nova";
  font-weight: normal !important;
}

/*current selected option*/
.ui-selectmenu .ui-button > span:not(.ui-li-count) {
  color: #006dbf !important;
  text-align: left !important;
  font-family: "proxima-nova";
  font-weight: normal !important;
}
.ui-selectmenu-button{
  color: #006dbf !important;
  text-align: left !important;
  font-family: "proxima-nova";
  font-weight: normal !important;
}
/*end selects*/
/*radio*/
.ui-radio {
  border-radius: 0px !important;
}

.ui-radio-on {
  border: none !important;
  background-color: white !important;
  color: #343434 !important;
}

.ui-radio .ui-button.ui-radio-on:after {
  border-color: #343434 !important;
}

.ui-radio-off {
  border: none !important;
  background-color: white !important;
  color: #006dbf !important;
}



/*radio*/
/*checkbox*/

/* .ui-checkbox { */
  /* border-radius: 0px !important; */
/* } */

.ui-checkboxradio-label{
  border: none !important;
  background-color: transparent !important;
  color: #006dbf !important;
}

.ui-checkboxradio-checked {
  border: none !important;
  background-color: transparent !important;
  color: #343434 !important;  
  background-image: url("themes/images/check-white.png");
}


/*Terms and Conditions checkbox stylings */
.tandc-label {
  color: white !important;
}

.tandc-link {
  display: inline-block;
  padding: 0px;
}


/*end checkbox*/
/*styling for full width buttons on home page */
.ui-listview li a.navLink {
  font-size: 20px;
  color: #006dbf !important;
  background-color: #e2eef7 !important;
  border-bottom-color: #ffffff !important;
  border-bottom-width: 2px;
  border-top-width: 0px;
}

/*CUSTOM ICON STYES */
.ui-icon{
	background-color:#006dbf;
}
.ui-icon-myapp-select {
  background-image: url("themes/images/arrow_down.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
}

.ui-icon-myapp-about {
  background-image: url("themes/images/info.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
  left: 0px !important;
}

.ui-icon-myapp-add {
  background-image: url("themes/images/add.png");
    background-size: 24px 24px;
  background-repeat: no-repeat;
}

.ui-icon-myapp-delete {
  background-image: url("themes/images/delete.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
}

.ui-icon-myapp-edit {
  background-image: url("themes/images/edit.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
}

.ui-icon-myapp-metronome {
  background-image: url("themes/images/metronome.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
}

.ui-icon-myapp-note {
  background-image: url("themes/images/note.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
}

.ui-icon-myapp-schedule {
  background-image: url("themes/images/events.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
  left: 0px !important;
}


.ui-icon-myapp-settings {
  background-image: url("themes/images/settings.png");
  background-size: 20px 20px;
  background-repeat: no-repeat;
}

.ui-icon-myapp-view {
  background-image: url("themes/images/view.png");
  background-size: 24px 24px;
  background-repeat: no-repeat;
}

.ui-icon-myapp-dept {
  background-image: url("themes/images/info.png");
  background-size: 20px 20px;
  background-repeat: no-repeat;
}

/*
.ui-icon-myapp-dept:hover:after {
	background-image: url('themes/images/info.png');
}
*/
.ui-icon-myapp-home {
  background-image: url("themes/images/home.png");
    background-size: 18px 18px;
  background-repeat: no-repeat;
}

/*.ui-icon-myapp-home:hover:after {
	background-image: url('themes/images/home_active.png');
}*/
.ui-icon-myapp-account {
  background-image: url("themes/images/account.png");
  background-repeat: no-repeat;
}

.ui-icon-myapp-account-active {
  background-image: url("themes/images/account_active.png") !important;
  background-repeat: no-repeat;
}

.ui-icon-myapp-alarm {
  background-image: url("themes/images/alarm.png");
  background-repeat: no-repeat;
}

.ui-icon-myapp-alarm-active {
  background-image: url("themes/images/alarm_active.png");
  background-repeat: no-repeat;
}

.ui-icon-myapp-close {
  background-image: url("themes/images/close.png");
  background-repeat: no-repeat;
  background-size: 14px 14px;
}

.ui-icon-myapp-email {
  background-image: url("themes/images/email.png");
  background-repeat: no-repeat;
}

.ui-icon-myapp-email-active {
  background-image: url("themes/images/email_active.png");
  background-repeat: no-repeat;
}

.ui-icon-myapp-events-active {
  background-image: url("themes/images/events_active.png") !important;
  background-repeat: no-repeat;
}

.ui-icon-myapp-events {
  background-image: url("themes/images/events.png");
  background-repeat: no-repeat;
}

.ui-icon-myapp-remove {
  background-image: url("themes/images/remove.png");
  background-repeat: no-repeat;
  background-size: 24px 24px;
}

.ui-icon-minus{
  background-image: url("themes/images/remove.png");
  background-repeat: no-repeat;
  background-size: 24px 24px;
}

.ui-icon-myapp-right-arrow {
  background-image: url("themes/images/right_arrow.png") !important;
  background-repeat: no-repeat;
  background-size: 18px 18px;
}

.ui-icon-myapp-left-arrow {
  background-image: url("themes/images/back_arrow.png") !important;
  background-repeat: no-repeat;
  background-size: 18px 18px;
}

.ui-icon-myapp-menu {
	background-image: url("themes/images/menu.png") !important;
  background-repeat: no-repeat;
	background-size: 24px 24px;
}

.ui-icon-myapp-menu-small {
  background-image: url("themes/images/menu.png") !important;
  background-repeat: no-repeat;
    background-size: 15px 15px;
}

/* iPhone 5 */
/*@media screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) {*/
@media screen and (min-width: 320px) and (max-width: 568px) {
  /*h1 {color:red;}*/
}
/* iPhone 6 */
@media screen and (min-width: 375px) and (max-width: 667px) {
  /*h1 {color:blue;}*/
}
/* iPhone 6plus */
@media screen and (min-width: 414px) and (max-width: 736px) {
  /*h1 {color:black;}*/
}
