/*******************************************
* client proprietary (usually in welcome.asp)
*******************************************/

/*******************************************
Tabs-Panel Styles
******************************************/
/* welcomeTabs */
#welcomeTabs {
	--primary: #263f6a;
	--secondary: #a1d67c;
	--light: #ebebeb;
	--highlight: #f58c1a;
	--text-light: #fff;
	--text-dark: #39424b;
	max-width: 800px;
	margin: auto;
}
/* Tabs */
#welcomeTabs .nav-tabs {	
	display: table;
	color: var(--text-dark);
	cursor: pointer;
}
#welcomeTabs .nav-tabs li{
	display: table-cell;
	width: 33.34%;
	vertical-align: middle;
	font-size: 1.2em;
	text-align: center;
	background-color: var(--light);
	border: 1px solid var(--primary);
	border-radius: 10px 10px 0 0;
	padding: 10px;
}
#welcomeTabs li:hover {
	background-color: var(--secondary);
	border: 1px solid var(--secondary);
}
#welcomeTabs li.focus,
#welcomeTabs li.active {
	border-color: var(--primary);
	background-color: var(--primary);
	color: var(--text-light);
}
/* Tab Panels */
#welcomeTabs .tab-content {
	background-color: var(--primary);
	color: var(--text-light);
	border-radius: 0 0 10px 10px;
}
#welcomeTabs .list-group-item-heading {
	color: var(--text-light);
	border-bottom: 1px solid var(--text-light);
}
#welcomeTabs .list-group-item {
	background-color: inherit;
	color: var(--text-light);
	text-decoration: none;
	border: none;
	border-radius: 4px;
}
#welcomeTabs .list-group-item:hover {
	background-color: var(--secondary);
	color: var(--text-light);
}

/*******************************************
* custom icons (should use <span></span>
* with glyphicons instead wherever possible)
*******************************************/
#courses_interest_icon {
	/* 	content:url("/_config/[clientname]/_images/courses_interest.png"); */
}

#transcripts_icon {
	/* 	content:url("/_config/[clientname]/_images/transcripts_icon.png");	*/
}
#enrollments_icon {
	/* 	content:url("/_config/[clientname]/_images/enrollments_icon.png");	*/
}

/*******************************************
* main overrides
*******************************************/
/* need to have a taller masthead to accomodate logo? */
.masthead {
	height: 146px;
	background: #ffffff;
}

#MastHeadImgExt {
	padding: 10px 20px 10px 30px;
	max-width: 500px;
	max-height: 146px;
}

#MastHeadImgRightDiv {
	margin: 30px 20px 0px 0px;
}

/* main menubar color */
.primaryhighlight {
	background: #263f6a;
}

.primaryborder {
	border: 0px;
}

a:link,
a:visited {
	color: #1851a5;
}

a:hover {
	color: #1851a5;
	text-decoration: underline;
}

a:link.btn,
a:visited.btn {
	color: #fff;
}

/*** override to bootstrap main blue button color */
.btn-primary {
	color: #fff;
	background-color: #337ab7;
	border-color: transparent;
}

.btn-primary:hover,
.btn-primary:focus {
	background-color: #286090;
	border-color: transparent;
}

.btn-primary:active,
.btn-primary.active,
.btn-primary:active:focus {
	background-color: #204d74;
	border-color: transparent;
}

.btn-primary.disabled.focus,
.btn-primary.disabled:focus,
.btn-primary.disabled:hover,
.btn-primary[disabled].focus,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:hover,
.btn-primary:disabled,
.btn-primary.disabled {
	background-color: #337ab7;
	border-color: transparent;
}

/* initial block-login button */
#btn-login {
	color: #fff;
	background-color: #337ab7;
	border-color: transparent;
}

#btn-login:hover,
#btn-login:focus {
	color: #fff;
	background-color: #286090;
	border-color: transparent;
}

#btn-login:active {
	background-color: #204d74;
	border-color: transparent;
}

/* pagination link, li colors (resemble anchor links) */
.pagination > li > a,
.pagination > li > span {
	color: #337ab7;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
	color: #337ab7;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
	background-color: #337ab7;
	border-color: #ffc0c0;
}

/*******************************************
* panel colors and backgrounds
*******************************************/
/* modal head color */
.modal-header {
	background-color: #3fa3cd;
}

/* my current enrollments widget panel */
.invertedtab {
	background-color: #0d548a;
}

#mycarethref {
	color: #ffffff;
}

/* other courses of interest */
.panel-myinfo {
	border-color: #3fa3cd;
}

.panel-myinfo > .panel-heading {
	background-color: #3fa3cd;
	border-color: #3fa3cd;
}

/*******************************************
* course tables
*******************************************/
.courseTable {
	background-color: #d8dfeb;
}
.courseTableHeader {
	color: #8396b7;
}