/* custom styles for CAC website */

:root {
	font-size: 14px; /* default is to use browser setting, usually 16px */
}

/* gray background for margin areas.
   everything else is in the banner or div.mainarea */
body {
	background-color: #E7E7E7; /* gray */
}

a {
	text-decoration: none; /* bootstrap 5 underlines links */
}

a:hover {
	text-decoration: underline;	
}

a.btn:hover {
	text-decoration: none;	
}

.container {
	/* give us a top border */
	margin-top: 15px;
}

/* remove L R padding to use full width for xs screens */
@media only screen and (max-width: 575px) {
	.container {
		margin-top: 10px;
		padding-left: 0px;
		padding-right: 0px;
	}
}

/* suppress the xxl breakpoint by keeping container xl width */
@media only screen and (min-width: 1400px) {
	.container {
		max-width: 1140px;
	}
}

div.mainarea {
	min-height: 600px;
	background-color: white;
	padding: 5px 15px;
}

/* top of most pages */
.pageheader {
	text-align: center;
	margin-top: 15px;
}

/* defaults are a bit large */
h4 { font-size: 1.3rem; }

/* blue links in the blue alert box get washed out */
div.alert-primary a {
	color: rgb(175, 100, 100); 
}

/* blue links in the blue alert box get washed out */
div.alert-info a {
	color: rgb(175, 100, 100); 
}

/* following styles all related to the top banner and menu bar */
#topBanner {
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: white;
}

#topMenu {
	background-color:  #f3b633; /* orangish */
}

/* typical navbar buttons (non-active state) */
#topMenu a.nav-link {
	font-size: 1.0rem;
	color: #4d4d4d; /* black */
	font-weight: bold;
	padding-right: 0.75rem; /* default is 0.5, which looks a little tight */
	padding-left: 0.75rem;
}

/* typical navbar buttons (active state) */
#topMenu li.nav-item>a.nav-link.active {
	color: rgb(152, 16, 58); /* dark red */
}

/* typical navbar buttons (hover state) */
#topMenu li.nav-item>a.nav-link:hover {
	color: rgb(152, 16, 58); /* dark red */
	text-decoration: underline;
}


/* toolbars */
nav.cac_tool {
	background-color: #f8f8f8;
}
nav.cac_tool a.nav-link {
	color: #777;
	padding-right: 15px !important;
}
nav.cac_tool a.nav-link:hover {
	color: black;
}


/* darker background gray for hover on our tabs menu for large displays */
#tabs .nav-item:hover {
	background-color: #E6E6E6;
}

/* The vertical pills for tabs on small displays*/
#tabsSm .nav-link {
	background-color: rgba(0,0,0,.03);
	border-radius: 0;
}

#tabsSm .nav-link.active {
	background-color: #007bff;;
}


/* no wells in bootstrap anymore. add our own well class to cards */
div.card.well {
	background-color: #f5f5f5;
}


/* Increase the width of bootstrap popover */
.popover {
	max-width: 400px;
	width: 400px;
	font-size: 14px;
}


/* For drag and drop ordering */
.ui-sortable-helper {
	display: table;
}
.handle {
	cursor: ns-resize;
	text-align: center;
}


/* bootstrap hr is nearly invisible */
hr.cac {
	border-width: 2px; 
	border-color: darkgrey;
}


/* toolbars */
nav.cac_tool {
	background-color: #f8f8f8;
}
nav.cac_tool a.nav-link {
	color: #777;
	padding-right: 15px !important;
}
nav.cac_tool a.nav-link:hover {
	color: black;
}


/* found row in a search result */
tr.foundrow {
	background-color: #f3d492 !important; /* lighter orangish */
}