/*
##########################
## ARUBA SELFCARE THEME ##
##########################
*/

/* SIZING */
@media (min-width: 576px) {
	.w-sm-25 { width: 25%; }
	.w-sm-50 { width: 50%; }
	.w-sm-75 { width: 82%; }
	.w-sm-100 { width: 100%; }
}
@media (min-width: 768px) {
	.w-md-25 { width: 25%; }
	.w-md-50 { width: 50%; }
	.w-md-75 { width: 82%; }
	.w-md-100 { width: 100%; }
}
@media (min-width: 992px) {
	.w-lg-25 { width: 25%; }
	.w-lg-50 { width: 50%; }
	.w-lg-75 { width: 82%; }
	.w-lg-100 { width: 100%; }
}
@media (min-width: 1200px) {
	.w-xl-25 { width: 25%; }
	.w-xl-50 { width: 50%; }
	.w-xl-75 { width: 82%; }
	.w-xl-100 { width: 100%; }
}

/*	TYPOGRAPHY	*/
:root {
	--font-family-sans-serif: 'Lato', sans-serif;
}
html, body { font-family: 'Lato', sans-serif; }

h1, .h1, .text-xxl { font-size: 36px; }
h2, .h2, .text-xl { font-size: 30px; }
h3, .h3, .text-lg { font-size: 24px; }
h4, .h4, .text-md { font-size: 18px; }
h5, .h5, .text-sm { font-size: 14px; }
h6, .h6, .text-xs { font-size: 12px; }
body { font-size: 14px; }

@media (max-width: 575.98px) {
	h1, .h1, .text-xxl { font-size: 30px; }
	h2, .h2, .text-xl { font-size: 26px; }
	h3, .h3, .text-lg { font-size: 21px; }
	h5, .h5, .text-sm { font-size: 15px; }
	body { font-size: 15px; }
}

/*	COLORS	*/
.text-dark { color: #222 !important; }
.bg-dark { background-color: #222 !important; }
a,
.btn-link { color: #035791; }
a:hover,
a:active,
.btn-link:hover,
.btn-link:active { color: #0475c3; }
.modal-body{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/*	COMPONENTS	*/

/* buttons */
.btn { font-weight: bold; border-radius: 3px; border: none; box-shadow: 0 -2px 0 rgba(0,0,0,.7) inset; transition: ease-out .2s; }
.btn.focus, .btn:focus { box-shadow: none !important; }
.btn-primary { background-color: #666; }
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active { background-color: #444 !important; }
.btn-link { box-shadow: none; }
.btn-outline-primary { color: #666; border: 1px solid #666; box-shadow: none; }
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active { color: #fff; border: 1px solid #444 !important; background: #444 !important; }

/* alert */
.alert { border: none; border-radius: 0; }
.alert::before { vertical-align: text-bottom; display: inline-block; width: 26px; height: 46px; margin: -5px 10px -23px -5px; }
.alert-success { color: #18A50D; background-color: #E5F6ED; }
.alert-success::before { content: ''; background: url(/asmonitor/javax.faces.resource/images/alert-success-icon.png.xhtml) no-repeat 0 0; }
.alert-success-logged { color: #18A50D; background-color: #E5F6ED; }
.alert-success-logged::before { content: ''; background: url('../images/alert-success-icon.png') no-repeat 0 0; }
.alert-danger::before { content: ''; background: url(/asmonitor/javax.faces.resource/images/alert-danger-icon.png.xhtml) no-repeat 0 0; }
.alert-info { color: #069; background-color: #d0e9f6; }

/* modal */
.modal .modal-content { border-radius: 0;  }

/* utilities */
.title-block-height { padding-top: 1rem; }
@media (min-width: 576px) {
	.title-block-height { min-height: 100px; }
}
.title-border-bottom { border-bottom: 3px solid #444; margin-bottom: 0; padding-bottom: 1rem; line-height: 1; }
.text-break-all { word-break: break-all; }
@media (min-width: 992px) {
	.border-lg-right { border-right: 1px solid #ddd; }
}

.btn-switcher { transition: ease-out .2s; border: none; background-color: #ddd; color: #666; padding: 2px 10px 2px 2px; display: inline-block; text-transform: uppercase; border-radius: 3px; font-size: 11px; line-height: 1.2; font-weight: bold; height: 19px; text-decoration: none; min-width: 110px; text-align: center; cursor: pointer; }
.btn-switcher > .switch-label-active { display: none; }
.btn-switcher > .switch-cursor { background-color: #fff; border-radius: 3px; width: 15px; height: 15px; float: left; margin-right: 10px; }
.btn-switcher.active { background-color: #28a745; color: #fff; padding: 2px 2px 2px 10px; }
.btn-switcher.active > .switch-cursor { float: right; margin-right: 0; margin-left: 10px; }
.btn-switcher.active > .switch-label-disable { display: none; }
.btn-switcher.active > .switch-label-active { display: inline; }

/* header */
header .top-navbar { padding: 5px 0; min-height: 28px; }
header .top-navbar > .container > * { margin: 0 5px; }
header .logo-banner { margin: 20px auto; }
header .logo-banner a { text-decoration: none; }
header .logo-banner img { margin-right: 10px; }

/* footer */
footer > hr { margin-bottom: -12px; }
footer > .footer-copyright { background-color: #fff; }

/* container */
body { background: url() repeat-x 0 0; }
.page-container { background: #fff; min-height: 320px; box-shadow: 0px -15px 30px -20px rgba(0,0,0,.5); }

/* aside */
.page-container aside { padding-left: 0; }
aside * { transition: ease-out .2s; }
aside .list-group-item { border-bottom: 1px solid #999; border-top: none; padding: 0; margin-bottom: 1px; position: relative; }
aside .list-group-item .aside-warning-icon { position: absolute; top: 15px; right: 0; }
aside .list-group-item a { color: #666; padding: 1rem; text-decoration: none; display: block; box-shadow: none; }
aside .list-group-item:hover,
aside .list-group-item.active { background: #fff; border-color: #999; margin-left: -1rem; }
aside .list-group-item:hover a,
aside .list-group-item.active a { padding-right: 2rem; color: #222; box-shadow: -10px 0px 20px -20px rgba(0,0,0,.5); }
aside .list-group-flush:last-child .list-group-item:last-child { border-bottom: 1px solid #999;  }
aside button > img { width: 24px; }

@media (max-width: 575.98px) {
	aside * { transition: none; }
	aside .menu-list { margin-bottom: 40px; transition: ease-out .2s; }
	aside .list-group-item .aside-warning-icon { top: 5px; right: 10px; }
	aside .list-group-item a { padding: 0.25rem 1rem; }
	aside .list-group-item:hover,
	aside .list-group-item.active { margin-left: 0; }
}


/* section */
.need-help-button { position: absolute; right: 0; bottom: 1rem; }
.need-help-button.show {  }
.need-help-button > .dropdown-toggle { border: 1px solid #fff; border-left-color: #ccc; border-radius: 0; background-color: #fff; }
.need-help-button > .dropdown-toggle:focus { text-decoration: none; }
.need-help-button > .dropdown-toggle:hover { text-decoration: underline; }
.need-help-button.show > .dropdown-toggle { border: 1px solid #ccc; border-bottom-color: #fff; z-index: 10; position: relative; }
.need-help-button > .dropdown-menu { top: -4px !important; border-radius: 0; z-index: 9; }
.need-help-button > .dropdown-menu > a { color: #2B7125; border-bottom: 1px solid #eee; }
.need-help-button > .dropdown-menu > a:last-child { border-bottom: none }
.need-help-button > .dropdown-menu[x-placement="top-end"] { top: 1px !important; }
@media (max-width: 991.98px) {
	#dropdownMenuButton { text-decoration: none; }
}
@media (max-width: 575.98px) {
	.need-help-button { top: -25px; }
}

/* table */
.table.table-thead-micro * { vertical-align: middle; }
.table.table-thead-micro thead th { background-color: #eee; border-top: 2px solid #222; border-bottom: 0; padding-top: 0; padding-bottom: 0; text-transform: uppercase; font-size: 11px; line-height: 1; }
.table.table-thead-micro tbody td { border-top: none; border-bottom: 1px solid #ddd; }

.btn.disabled, .btn:disabled {
    opacity: .65;
    background-color: #666;
}