html, body {
	width: 100%;
	height: 100%;
}

body {    
	font-family:'Poppins', sans-serif !important; 
	font-size:0.875em;
	background:#FFF;
	margin: 0;
	padding: 0;
}
.pharmacy-page {
	min-height: 100%;
	display: flex;
	flex-flow: column nowrap;
	align-items: stretch;
}
.header, .body, .footer {
	flex-shrink: 0;
}
#header-hamburger {
	display: none;
	height: 25px;
	width: 25px;
	padding: 8px;
}
@media (max-width: 768px) {
	#header-hamburger {
		display: block;
	}
}

/*Header*/
.header {
	display: flex;
	flex: 0 0 auto;
	flex-flow: row nowrap;
	align-items: center;
	background-color: #2d3e91;
	justify-content: space-between;
	min-width: 320px;
	width: 100%;
	height: 100px;
}
@media (max-width: 768px) {
	.header {
		flex: 1 0 auto;
		flex-flow: column nowrap;
		height: 64px;
		position: fixed;
		z-index: 1;
		top: 0;
	}
}
.top-bar {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	height: 100%;
}
@media (max-width: 768px) {
	.top-bar {
		width: 100%;
	}
}
.logos {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	margin-left: 1em;
}
@media (max-width: 768px) {
	.logos {
		flex: 1 0 auto;
		margin-left: 0;
	}
}
.logos > .ecp-logo {
	display: flex;
	flex-flow: column nowrap;
	max-height:60px;
}
.logos > .ecp-logo > a > img {
	height: 30px;
	padding-top: 8px;
}
.logos > .customer-logo {
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	background-color: #ffffff;
	border-radius:2.875em;
	margin-bottom:1.250em;
	margin-left: 4px;
	margin-right:1.250em;
	margin-top:1.250em;
	min-height: 48px;
	min-width: 150px;
}
.logos > .customer-logo > img {
	display:block;
	margin:auto;
	max-height:45px;
	max-width:100px;
}
.logos > .text-logo {
	color:#2d3e91;
	font-weight:bold;
}

.USER_FULL_NAME {
	color: white;
	font-weight:bold;
	padding-left:2em;
}

.pharmacyTextLogo {
	text-align: center;
}
.navigation {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-around;
	flex-grow: 1;
	max-width: 650px;
}

@media (max-width: 768px) {
	.navigation {
		flex-flow: row nowrap;
		flex: 0 0 auto;
		max-width: 100%;
	}
}
.header-options {
	display: flex;
	flex-flow: row nowrap;
	flex: 0.5 0 auto;
	position: inherit;
	background-color: #2d3e91;
	justify-content: space-around;
	font-family:'Heebo', sans-serif !important;
}
@media (max-width: 768px) {
	.header-options {
		display: none;
		flex-flow: column nowrap;
		justify-content: center;
		align-items: center;
		background-color: #3246a9;
		width: 100%;
		position: fixed;
		top: 64px;
		padding-bottom: 8px;
		padding-top: 8px;
		font-weight: bold;
		z-index: 100;
		left: 0;
	}
}
.header-option {
	cursor: pointer;
	padding: 8px;
	color: white;
	max-height: 100px;
}
.header-option:hover {
	color: #00b5cb;
}
@media (max-width: 768px) {
	.header-option {
		color: white;
	}
}
.header-option select {
	padding:.15em;
}
/*Body*/
.pharmacy-page > .body {
	display: flex;
	flex-flow: column wrap;
	flex-grow: 1;
	align-items: center;
}
@media (max-width: 768px) {
	.pharmacy-page > .body {
		margin-top: 75px;
	}
}
.title {
	border: none;
	background: #2E4A99;
	font-family:'Heebo', sans-serif !important; 
	height:2.5em;
	margin: 4px 0;
	font-size:1.2em;
	color: white;
}
.body > .content {
	display: flex;
	flex-flow: column nowrap;
	flex: 1 0 auto;
	/*justify-content: space-around;*/
	max-width:940px;
	width: 99%;
	margin-top: 16px;
}
.body > .content:first-child {
	margin-top: 16px;
}
.content > .title {
	text-transform: uppercase;
}
.content-title {
	display: flex;
	flex-flow: row nowrap;
	padding: 0 8px;
	padding-bottom: 0 !important;
	text-transform: uppercase;
	justify-content: space-between;
	font-weight: bold;
}
.body > .content > div {
	padding: 8px;
}
.grid {
	display: grid;
	grid-template-columns: auto auto;
}
@media (max-width: 768px) {
	.grid {
		display: flex;
		flex-flow: column nowrap;
	}
}
.grid > .col-2 {
	grid-column: 1 / 3;
}
.sub-grid {
	display: grid;
	grid-template-columns: auto auto;
	padding-left: 50%;
}
.connection-table > div{
	border-bottom: solid 1px #d7d7d7;
	margin: 4px 0;
}
@media (max-width: 768px) {
	.connection-table > div {
		margin: 16px 0;
	}
	.connection-table > div:nth-child(odd) {
		border:none;
	}
	.connection-table > div:nth-child(even) {
		margin: 0 0;
	}
}
.connection-content {
	display: flex;
	flex-flow: row nowrap;
}
@media (max-width: 768px) {
	.connection-content {
		flex-flow: column nowrap;
	}
}
.connection-content > div {
	flex: 1 0 auto;
}
.connection-table > .content-title {
	border: none;
	font-weight: bold;
}
.connection-table > .error {
	border: none;
}
.display-monitor {
	flex: 0.5 0 auto;
}
.display-monitor > div {
	text-align: center;
}
.display-monitor-content {
	flex: 1.5 0 auto;
}
@media (max-width: 768px) {
	.grid > div {
		padding: 0 0;
	}
}
.pharmacy-content {
	display: flex;
	flex-flow: column nowrap;
}
.pharmacy-content > div {
	border-bottom: solid 1px #d7d7d7;
	padding: 4px 0;
}
a {
	cursor: pointer;
}
@media (max-width: 768px) {
	.pharmacy-content > div {
		padding: 16px 0;
	}
}
.pharmacy-title {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	font-weight: bold;
	text-align: center;
	margin-top: 24px;
}
.pharmacy-expand {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
}
.expand {
	width: 25px;
	height: 25px;
	background-image: url("/pharmacy/includes/images/expand_down.svg");
	background-repeat: no-repeat;
	background-position: top;
	background-size: 25px;
}
.expand-content {
	display: none;
}
.expand-content > div {
	padding: 8px 0;
}
@media (max-width: 768px) {
	.expand-content > div {
		padding: 16px 0;
	}
}
.svg {  
	height:1.25em;
	margin-right: 8px;
	overflow:visible; /* MLL 2/20/17 - without this, Users.svg gets cropped on the right side. */
	width:1.25em;
}

.viewCorners {
	background-color:#00B5C9;
	border-radius:20px;
	color:white; 
	font-size:12px;
	padding:0 5px;
	text-align:center;
	min-width:45px; 
	cursor: pointer;
}

.statusUP {
	border:1px solid green;
	color:green;
	float:left;
	padding:3px;
	text-align:center;
	width:30px;
}

.statusDOWN {
	border:1px solid red;
	color:red;
	float:left;
	padding:3px;
	text-align:center;
}

.dataTables_info {
	font-size:0.875em;
}

.circle {
	margin:.5em auto;
    background-color:#fff;
    height:6em;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    width:6em;
	line-height:75px;
	text-align:center;
	
	font-weight:bold;
}

.redCircle {
	border:15px solid red;
	font-size:1.3em;
}

.greenCircle {
	border:15px solid green;
	font-size:1.5em;
}
/*JR 05/04/17 Override DataTable Styling*/
table .sorting {
    background-size: 25px;
    background-image: url("/pharmacy/includes/images/Expand_Up.svg"), url("/pharmacy/includes/images/Expand_Down.svg") !important;
    background-position: 100% 30%, 100% 70% !important;
}
table .sorting_asc {
    background-size: 25px;
    background-position: 100% 30% !important;
    background-image: url("/pharmacy/includes/images/Expand_Up_Blue.svg") !important;
}
table .sorting_desc {
    background-size: 25px;
    background-position: 100% 70% !important;
    background-image: url("/pharmacy/includes/images/Expand_Down_Blue.svg") !important;
}
.paginate_button {
	height: 25px;
}
.paginate_button.previous  {
	background-position: center center;
	background-size: 35px 35px !important;
    background:  url("/pharmacy/includes/images/Left_Arrow.svg") no-repeat !important;
 }
 .paginate_button.previous.disabled  {
    background:  url("/pharmacy/includes/images/Left_Arrow_Gray.svg") no-repeat !important;
 }
 .paginate_button.next  {
	 background-position: center center;
	 background-size: 35px 35px !important;
     background:  url("/pharmacy/includes/images/Right_Arrow.svg") no-repeat !important;
 }
  .paginate_button.next.disabled  {  
     background:  url("/pharmacy/includes/images/Right_Arrow_Gray.svg") no-repeat !important;
 }
.dataTables_paginate {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	vertical-align: middle;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
	padding: 0 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: black !important;
    border: 1px solid transparent !important;
    background-color: transparent;
	background: none;
}
.menuOption{
	border-bottom: solid 1px #d7d7d7;
	padding: 4px 0;
}
@media (max-width: 768px) {
	td {
		padding: 16px 0;
	}
}
/*Footer*/
.footer {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	background-color: #2d3e91;
	color: white; 
	bottom:0;
	height: 38px;
	width: 100%;
	margin-top: auto;
}
.login-button {
	display: flex;
	flex-flow: column nowrap;
	align-items: center;
	justify-content: center;
	font-family:'Heebo', sans-serif !important;
	background-color:#3ab18d;
	border-radius:1.875em;
	color:white; 
	font-size:16px;
	cursor:pointer;
	margin-top: 32px;
	height: 52px;
}
/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.8); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
	display: flex;
	flex-flow: column nowrap;
	align-items: center;
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
	margin-top: 300px;
    padding: 20px;
    border: 1px solid #888;
    width: 400px; /* Could be more or less, depending on screen size */
	border-radius: 25px;
	font-size: 14px;
	font-weight: bold;
}
#timeoutConfirm {
	width: 200px;
	text-transform: uppercase;
}

.x-window-body { overflow:hidden !important; }

/* .ui-widget-header { background:#e9e9e9 !important; color:#2E4A99 !important; border:none !important; border-bottom:1px solid #9d9d9d !important; } */

/* Style CFWindow */
/* .x-css-shadow { box-shadow:rgb(254, 254, 254) -4px -4px 10px !important; }
.x-window, .x-window-header { background-color:#2E4A99 !important; border:none !important; box-shadow:none !important; }
.x-window-header-text { color:white !important; }

.x-btn { margin: 10px; padding: 4px 4px; color: #202129; background-color: #f2f2f2; border: 0 none; border-radius: 4px; }
.x-btn:hover { color: #202129; background-color: #e1e2e2; opacity: 1; }
.x-btn:active { background-color: #d5d6d6; opacity: 1; }
.x-btn:focus { outline: 1px dotted #959595; outline-offset: -4px; } */

/* .x-border-box, .x-border-box * {box-sizing:content-box;} */

.required {color:red;}

.uploadLogoForm * .filepond--root{
	width: 320px;
}
  
.uploadLogoForm * .filepond--item{
	width: 280px;
}

.uploadLogoHeader{
	padding: 20px 0 10px 0; 
	font-size: 16px;
}

.uploadLogoBody{
	font-family:Tahoma,Verdana,Arial; 
	font-size:12px;
}

/* Styles for wwwroot\pharmacy\customers\dsp_view_med_log_prefs.cfm */
th.pharmPrefTable {
	font-weight:bold;
}
td.pharmPrefTable, th.pharmPrefTable {
	border-bottom:1px solid gray;
}
td.pharmPrefTable.c, th.pharmPrefTable.c {
	text-align:center; border-bottom:1px solid gray;
}
#prefEmailAddresses div {
	margin:.5em 0;
}