/*
 styles for Dockground used for GWYRE
 Sukha Malladi
 8/20/2021
*/
/* While I'd have prefer to directly specify a set of names with primary, secondary, and accent colors,
  we are still working through that part.
 */
:root {

	--ku-blue: #0051ba;
	--ku-crimson: #e80000d;
	--jayhawk-yellow: #ffc82d;
	--signature-grey: #85898a;
	--download-box-option:  #197DFF;
	--text-color-on-primary: white;
	--primary-color: #0051ba;
	--title-size: 5rem;
	--sub-title-size: calc(.60 * var(--title-size));
	--dataset-title-size: calc(.60 * var(--title-size));
}

.repository-table {
	background-color:  var(--primary-color);
	color: var(--text-color-on-primary);
	margin: 0 auto 0 auto;
}

.table-responsive {
	margin: 0 auto 0 auto;
}

.repository-status-sub-title {
	color: var(--ku-blue);
	font-size: calc(.35 * var(--title-size));
	font-weight: bold;
}

.repository-card {
	width: 325px;
}

.section_one { 
	background-image: url("/assets/images/gw_top_img.jpg"); 
	width: 100%;
	height: 400px;
	align-items: center;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: calc(100% - 20px) center;
}

td {
	align: center;
	text-align: center;
}

tr {
	align: center;
	text-align: center;
}

h1 {
	color:#ffffff;
	font-size: var(--title-size);
}

h2 {
	color: var(--primary-color);
	font-size: var(--sub-title-size);
	font-weight: bold;
}

h6 {
	font-weight: bold;
}

.dataset-card-title {
	color: var(--text-color-on-primary);
	font-size: var(--dataset-title-size);
	font-weight: bold;
	line-height: 1.2;
}

.bg-c-blue {
	background: var(--primary-color);
}

.bg-c-blue3 {
	background: var(--primary-color);
}

.bg-c-blue-unused {
	rgba(0,81,186,1)
	background: linear-gradient(0deg, #ffffff , var(--primary-color) 70%);
	background-color: var(--primary-color);
	background: linear-gradient(0deg, #ffffff , #000033 70%);
	background: linear-gradient(45deg,#4099ff,#73b4ff);
	background: linear-gradient(to bottom,  #ffffff 0%, #c2e0ff 100%);
	background: linear-gradient(to bottom, #000033 100%, #ffffff 0%);
	background-color: rgba(0,0,51, 1); <!-- Hex=#000033 -->
}

.card {
	background-color: rgba(0,81,186,1);
}

body {	
	background-color: #FFFFFF; 
} 

.carousel-inner img {
	width: 75%;
	height: 40vh;
}

.navbar { 
	background-color: var(--primary-color);
	-webkit-transition: background-color 500ms linear; 
	-moz-transition: background-color 500ms linear; 
	-ms-transition: background-color 500ms linear; 
	transition: background-color 500ms linear; 
}

.scrolled { 
	background-color: rgba(0,81,186,0.5);
	-webkit-transition: background-color 500ms linear; 
	-moz-transition: background-color 500ms linear; 
	-ms-transition: background-color 500ms linear; 
	transition: background-color 500ms linear; 
}

.overlay {
  position: absolute;
  bottom: 0%; 
  left: 0;
  right: 0;
  background-color: var(--primary-color);
  overflow: hidden;
  width: 100%;
  height: 0; <!-- height was 100 -->
  transform: scale(0);
  transition: .3s ease;
}

.card:hover .overlay {
  transform: scale(1);
  <!-- bottom: 0;
  height: 100%; -->
}

.carousel-indicators li {
	background-color: black;
}
.carousel-indicators .active {
	background-color: black;
}

.carousel-arrow {
	color:#000033;
	font-size: 50px;
}

.dataset-card {
	width: 333px;
	height: 333px;
	flex: unset;
}

.dataset-card-image {
	width: 100%;
	height: 78%;
	background-color: white;

}

.dataset-card-other-resources-image-placeholder {
	width: 100%;
	height: 50%;
	background-color: var(--primary-color);
}

.dataset-card-body {
	padding-top: 10;
}

.dataset-card-body a:link {
	color: var(--jayhawk-yellow);
}

.dataset-card-body a:visited {
	color: var(--jayhawk-yellow);
}
.dataset-card-body  a:hover {
	color: var(--jayhawk-yellow);
}
.dataset-card-body  a:active {
	color: var(--jayhawk-yellow);
}

.other-resources-card {
	width: 125px;
	height: 165px;
}

.other-resources-site-image {
	-webkit-filter: brightness(70%);
	filter: brightness(70%);
}

.other-resources-image-title {
	font-size: larger;
	font-weight: bold;
	word-wrap: normal;
}

.other-resources-link {
	font-size: x-large;
	font-weight: bold;
}

.page-footer {
	text-align:center;
   color: black;
   /* background:#E6E6FA; */
}

.references {
	color:  black;
}

.publication-notes {
	/* color: #e8000d; */
	text-decoration: underline;
}

.publication-link {
	color: black;
}

.nav-link:link {
	color:var(--text-color-on-primary);
}
.nav-link:visited {
	color:var(--text-color-on-primary);
}
.nav-link:hover {
	color:var(--text-color-on-primary);
}
.nav-link:active{
	color:var(--text-color-on-primary);
}
.nav-link {
	color: var(--text-color-on-primary);
}

.navbar-link {
	color: var(--text-color-on-primary);
}

.navbar-link:link {
	color:var(--text-color-on-primary);
}
.navbar-link:visited {
	color:var(--text-color-on-primary);
}
.navbar-link:hover {
	color:var(--text-color-on-primary);
}
.navbar-link:active{
	color:var(--text-color-on-primary);
}

.dockground-navbar-link {
	font-size:  large;
}

.dockground-name {
	font-variant: small-caps;
}

.downloads {
	color: var(--text-color-on-primary);
}

.downloads a:link {
	color: var(--text-color-on-primary);
}

.downloads a:visited {
	color: var(--text-color-on-primary);
}

.downloads a:hover {
	color: var(--text-color-on-primary);
}

.downloads a:active {
	color: var(--text-color-on-primary);
}

.downloads-dropdown {
	width: 300px;
	height: auto
	font-size: 1.25rem;
}

.downloads-header-link {
	font-size: 1.25rem;
}

.downloads-option {
	background-color: var(--download-box-option);
}

.downloads-option:link {
	background-color: var(--download-box-option);
}

.downloads-option:visited {
	background-color: var(--download-box-option);
}

.downloads-option:hover {
	background-color: var(--download-box-option);
}

.downloads-option:active {
	background-color: var(--download-box-option);
}

.tags {
	display: inline;
	position: relative;
  }
  
  .tags:hover:after {
	background: #333;
	background: rgba(0, 0, 0, .8);
	border-radius: 5px;
	bottom: -34px;
	color: #fff;
	content: attr(gloss);
	left: 20%;
	padding: 5px 15px;
	position: absolute;
	z-index: 98;
	width: 350px;
  }
  
  .tags:hover:before {
	border: solid;
	border-color: #333 transparent;
	border-width: 0 6px 6px 6px;
	bottom: -4px;
	content: "";
	left: 50%;
	position: absolute;
	z-index: 99;
  }