/* Various city hub only tweaks*/

/*
html {
	--main-bg-color: #1a809d;
	--link-color: #fff;
	--alt-dark-color: #002a32;
	--footer-color: var(--alt-dark-color);
	--panel-color: #F6FFD5;
}*/
html {
	--main-bg-color: #f4f5f4;
	--link-color: #136278;
	--alt-dark-color: #002a32;
	--footer-color: var(--alt-dark-color);
	--panel-color: #F6FFD5;
	--bright-bg-color: #00b5b5;
	--box-bg-color: rgba(210, 219, 223, 0.8);
}


body {
	background-color: var(--main-bg-color);
	font-weight: 400;
	background: var(--main-bg-color) url("/images/Drysdale%20corridor%201600w%20bottom%20gradient.jpg") no-repeat center var(--navbar-height);
	background-size: contain;
}

button:active {
	transform: translateY(3px);
}
button{
	transition: linear 50ms;
}

h4.subheader {
	margin-top: 20px;
	clear: both;
	color: #000;
	font-weight: bold;
}

h4.subheader a {
	color: #000
}

#intro_area h2 {
	line-height: 155%;
}

#intro_area #internalnavigation {
	grid-area: megamenu;
}

#usefullinks_wrapper {
	min-height: 700px;
}


.hubbox { /* this is duplicated in other sites local config. consolodate later? */
	margin-bottom: var(--column-gap);
	padding: var(--box-padding);
	background: var(--box-bg-color);
	border-radius: 10px;
	gap: unset;
}

.hubbox ul {
	list-style-type: none;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 0;
}

.newsblock ul.bulletblock li a,
.newsblock .newsitem a {
	display: block;
	padding: 5px 0;
}

.newsblock ul.bulletblock li a:hover,
.rssfeed ul a:hover li,
.newsblock .newsitem a:hover {
	background-color: rgba(0, 0, 0, 0.05);
	box-shadow: 0 0 0 7px rgba(0, 0, 0, 0.05);
}

/*
.newsblock ul.bulletblock li a:hover, .rssfeed ul a:hover {
	text-decoration: none;
} */

.newsblock ul li:last-child,
.calendarblock div:last-child {
	border-bottom: 0
}

/*
.newsblock ul.bulletblock li,
.newsitem {
	border-bottom: 1px dotted #a1e5eb;
}*/

p {
	margin-bottom: .5em
}

#elibrarycontents td {
	padding-right: 10px;
	padding-bottom: 10px;
	vertical-align: top;
	line-height: 2;
}

.poster a.editlink {
	color: yellow;
	font-weight: bold
}

ol.instructions {
	margin-top: 20px;
	margin-left: 30px;
	margin-bottom: 20px
}

ol.instructions li {
	margin-bottom: 1em;
}


.journal_box {
	height: 25em;
}

.alphaindex {
	margin-bottom: 20px;
}

.imagecredit {
	text-align: right;
	font-size: smaller;
	color: #808080;
	line-height: 1.2;
	margin-top: 3em;
}

#journals_content_wrapper {
	margin-top: 20px;
}

#databasesleft-container .newsitem {
	max-width: 50%
}

.spaceafter {
	margin-bottom: 3em;
}

/*
.shaded-launch-buttons {
	margin: 0;
	margin-top: 20px;
}

.shaded-launch-buttons li,
.shaded-launch-buttons li a,
.shaded-launch-buttons li span {
	display: block;
	float: left;
}
*/


ul.shaded-launch-buttons {
  display: grid;
  grid-auto-rows: 1fr;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: var(--box-padding);
}

.shaded-launch-buttons li {
	border-radius: 4px;
	margin-left: 0px;
	display: block;
	float: left;
	transition: all 0.1s linear;
}

.shaded-launch-buttons li:first-child {
	margin-left: 0;
}


.shaded-launch-buttons li a  {
	/* same concept as calendar button styles */
	color: #333;
	font-size: 170%;
   line-height: 0.3;
   font-family: Poppins, sans-serif;
   font-weight: 300;
   width: 1.6em;
   display: block;
   border:0;
   border-radius: 0.2em;
   padding: 0 0.1em 0.3em 0.1em;
   text-align: center;
   float: left;
   margin-top: 0;
   box-sizing: border-box;
   box-shadow: 2px 2px 2px rgba(0,0,0,0.4);
   height: min-content;
	background: linear-gradient(180deg, green 0%, green 0.7em, rgba(255,255,255,1) 0.7em, rgba(255,255,255,1) 100%); 
	min-width: 10rem;
	width: 100%;
	height: 4.8rem;
}

.shaded-launch-buttons li.fulllist a {
	background: linear-gradient(180deg, var(--bright-bg-color) 0%, var(--bright-bg-color) 0.7em, rgba(255,255,255,1) 0.7em, rgba(255,255,255,1) 100%); 
}

.shaded-launch-buttons li a .topcaption {
	font-size: 40%;
	color: #fff;
	font-weight: 800;
	margin-bottom: 0.5em;
	display: inline-block;
}

.shaded-launch-buttons li a img {
	margin-top: 1rem;
}

/*
.shaded-launch-buttons li a {
	width: 160px;
	border-left-width: 0;
	border-radius: 0 4px 4px 0;
	color: #838383;
	text-shadow: 0 1px 0 #FFF;
	padding-top: 19px;
	padding-left: 6px;
	padding-right: 5px;
	padding-bottom: 14px;
	background: #fff;
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.5) inset, 0 5px 0 0 #c4c5d5, 0 1px 0 0 #FFF inset;
	border-bottom-width: 0;
	transition: all 0.1s linear;
}
*/
/*
.shaded-launch-buttons li span {
	border-radius: 4px 0 0 4px;
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2) inset, 0 5px 0 0 #447700;
	background: #f7f7f7;
	background: linear-gradient(to top, var(--alt-dark-color) 0%, var(--alt-dark-color) 100%);
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
	color: #fff;
	font-style: italic;
	padding: 23px 5px;
	transition: all 0.1s linear;
}
*/
/*
.shaded-launch-buttons li span.red {
	background: #ee706b;
	background: linear-gradient(to top, #ee706b 0%, #9c3107 100%);
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2) inset, 0 5px 0 0 #722300;
}

.shaded-launch-buttons li span.yellow {
	background: linear-gradient(to top, #ffd800 0%, #ffb400 100%);
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2) inset, 0 5px 0 0 #c79700;
}

.shaded-launch-buttons li:hover a {
	background: linear-gradient(to top, #FFFFFF 0%, #e7e7f9 100%);

}

.shaded-launch-buttons li:hover span.green {
	background: linear-gradient(to top, #ABC837 0%, #659506 100%);

}

.shaded-launch-buttons li:hover span.red {
	background: linear-gradient(to top, #f0807c 0%, #9c3107 100%);
}

.shaded-launch-buttons li:hover span.yellow {
	background: linear-gradient(to top, #ffe300 0%, #ffb400 100%);
}
*/
.shaded-launch-buttons li:active {
	transform: translateY(3px);
}

.shaded-launch-buttons li:active a {
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2) inset, 0 2px 0 0 #cecfe0;
}

.shaded-launch-buttons li:active span {
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2) inset, 0 2px 0 0 #447700;
}

/*
.shaded-launch-buttons li:active {
	box-shadow: 1px 3px 2px 0 rgba(0, 0, 0, 0.3);
}*/

.shaded-launch-buttons li:active span.red {
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2) inset, 0 2px 0 0 #722300;
}

.shaded-launch-buttons li:active span.yellow {
	box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2) inset, 0 2px 0 0 #c79700;
}

.database_quicklink {
	line-height: 1;
	font-weight: 700;
	font-size: 14px;
	height: 68px;
	box-sizing: border-box;
}
*/

/* Databases carousel 

        
.kc-item img {
                position:absolute;
            } 
.kc-wrap { padding-bottom: 70%}
#last_update { color:#ccc; font-size:11px;  }
#instructions { position: relative; top: -40px; text-align: center; }

*/

#loadingspinnerholder {
	text-align: center;
}

.instructions {
	text-align: center;
	font-size: 14px
}

#carousel2 {
	height: 200px;
}

.kc-wrap {
	background-color: transparent;
	border-radius: 5px;
	padding-bottom: 20px;
}

.kc-wrap .caption {
	font-size: 22px;
	font-weight: 400;
	margin-top: 20px;
	padding-left: 6px;
	color: #fff;
}

.kc-item .database_item {
	display: block;
}

.kc-item img {
	max-width: 100%;
	height: auto;
	background-color: #fff;
	opacity: 0.9;
}

.kc-imagelink {
	height: 310px
}

.kc-wrap .pad_to_square {
	padding: 55px 0;
	background-color: #fff;
	text-align: center
}

.kc-description {
	display: none;
}

.database-blurb {
	position: absolute;
	top: 388px;
	background: url('/images/subtopic bg.svg');
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.database-blurb a {
	color: #000
}

.database-blurb h3 {
	margin-top: 20px;
	margin-bottom: 20px;
	background-color: #25C1D2;
	color: #fff !important;
	display: inline-block;
	padding: 3px 10px 3px 20px;
	margin-right: 15px;
}

.database-blurb ul {
	padding-left: 2em;
	margin-bottom: 0.5em;
}

.placeholder-description {
	padding: 0 20px 20px 20px
}

.placeholder-description a {
	color: #000;
	text-decoration: underline;
}


/* New calendar section */


/* hide all but first 20 items */

.calpage-hidden {
	display: none;
}

.calpage-end {
	border-bottom: 0;
}

#calendarnav {
	font-weight: bold;
}

.calmorelink {
	text-align: right;
	margin-top: 5px;
}

.calprevlink {
	margin-top: 5px;
	display: none
}

.newstext div.item {
	display: inline-block;
	vertical-align: top;
}

.newstext div.label {
	width: 6em;
	display: inline-block;
	font-weight: bold;
}


/* City Law School News featured stories*/

/* Featured slider items 
 
   These styles really need consolodating with the calendar featured styles to use a common codebase.
   
	Commented out for the purpose of achieving this.



.featuredItem {
	width: 100%;
	height: 250px;
	background-size: cover;
	color: #fff;
}


.featuredItem .caltitleindent {
	font-size: 150%;
	width: 90%;
	height: 220px;
	font-weight: 400;
	padding-top: 0.5em;
}

.featuredItem .caltitleindent .inside {
	background-color: var(--main-bg-color);
	color: #fff;
}


.newsitem .storylink:hover .caltitleindent {
	text-decoration: underline;
	cursor: pointer;
}


 .storylink:focus {
	outline-color: #fff;
}

*/


/* Twitter box */

#twitter-widget-0 {
	width: 232px !important;
	overflow: hidden;
	height: 666px !important;
}


/* Mixitup styles for Ejournals page  */


/**
 * Form & Button Styles
 */

.mixitup_name {
	font-weight: bold;
	margin-bottom: .5em;
	line-height: 1.2;
	display: block;
}

.mixitup_summary {
	line-height: 1.2;
	display: block;
}

label {
	font-weight: 300;
}

.databases_page button,
.ejournals_page button, 
.opportunities_sorter button {
	display: inline-block;
	background-color: #666;
	border: 0;
	margin: 0 .2em .4em 0;
	color: #fff;
	font-size: 100%;
	font-weight: 300;
	border-radius: .25em;
	cursor: pointer;
	padding: .4em .8em;
}

/*button.show-all {background-color: #495C35}*/

.databases_page button.active, 
.ejournals_page button.active, 
.opportunities_sorter button   {
	background: #25C1D2;
	color: #000;
}



.databases_page button:first-of-type, 
.ejournals_page button:first-of-type {
	margin-left: 0;
}

.databases_page button:last-of-type,
.ejournals_page button:last-of-type {
	margin-right: 0;
}


.controls {
	/*background: url('/images/filterbox bg.svg');*/
	margin-bottom: 20px;
}

.controls h3 {
	/* color: #fff;*/
	margin-bottom: 0.5em;
	margin-top: 0.5em; 
	/* margin-left: 0.5em; */
}

.controls p {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

fieldset {
	padding: 0;
}


#Filters fieldset h2 {
	color: #fff;
	margin: 0;
}

#Searchfilter {
	display: inline-block;
	padding: .4em .8em;
	background: #666;
	border: 0;
	margin: 0 .2em .4em 0;
	color: #fff;
	font-size: 100%;
	font-weight: 300;
	border-radius: .25em;
}

#Searchfilter::placeholder {
	color: #ccc;
}


.databases_page #Searchfilter {
	max-width: 20em;
}

.databases_page .controlblock {
	margin-right: 10px;
}

.databases_page #mixitup .mix {
	background-size: auto 80px;
}



.databases_page .database_modal_grid {
	display: grid;
	grid-template-columns: auto 250px;
	grid-column-gap: 20px;
}

.databases_page .database_modal_grid .top_cell {
	grid-column: span 2;
	text-align: left;
}

.databases_page .remodal {
	background-color: #F6FFD5;
}

.database_modal_grid .left_cell {
	text-align: left;
	grid-column-start: 1;
	grid-row-start: 2;
}

.database_modal_grid .right_cell {
	text-align: right;
	padding-top: 0.3em;
	grid-column-start: 2;
	grid-row-start: 2;
}

.database_link svg {
	height: 2em;
	width: 2em;
	display: inline-block;
	vertical-align: middle;
	margin-right: 0.6em;
}

.database_link:hover svg path {
	fill: #1b919e !important;
}

.space {
	margin-left: 3em !important
}

#Reset {
	background-color: #DD872A;
	float: right;
	color: #000;
}


/* E-resources stuff */

.featurebox {
	background-color: #000c;
	padding: 15px;
	box-sizing: border-box;
	text-align: center;
	color: #fff;
	display: block;
	width: 100%;
	height: 100%;
}


.featurebox h3 {
	font-size: 23px;
	line-height: 1.4;
	margin-top: 0.3em;
	color: #fff;
	font-weight: 400;
}

.featurebox:hover {
	background-color: var(--alt-dark-color);
	text-decoration: none;
}


#eresources-boxes {
	display: flex;
	justify-content: space-between;
	margin:0;
	gap:20px;
	flex-flow: row wrap;
}


#eresources-boxes li {
	flex-basis: 270px;
	flex-grow: 1;
}
/**
 * Container/Target Styles
 */

/* Colours for database categories */
body {
	--cat-G-colour: #526145;
	--cat-S-colour: #61424f;
	--cat-G-hover: #3f4b35;
	--cat-S-hover: #47303a;
	--journal-colour: #333;
	--journal-hover: #1a1a1a;
}

#mixitup {
	text-align: justify;
	min-height: 100px;
}

#mixitup .mix:focus {
	outline-width: 4px;
	outline-color: #fff;
}

#Filters input:focus,
#Filters button:focus {
	outline-width: 3px;
	outline-color: #fff;
}

#mixitup .mix,
#mixitup .gap {
	width: 11em;
	display: inline-block;
	margin: 0 5px;
}

#mixitup .mix {
	width: 11em;
	height: 11em;
	margin: 5px 5px 15px 5px;
	background-position: bottom right;
	background-repeat: no-repeat;
/*	display: none; depreciated since mixitup 3*/
	overflow: hidden;
	box-sizing: border-box;
	text-align: left;
	background-color: var(--journal-colour);
	color: #fff;
	vertical-align: top;
	border-radius: 10px;
}

#mixitup .mix button {
	background-position: calc(100% - 8px) calc(100% - 8px);
	background-repeat: no-repeat;
	background-color: inherit;
	text-align: left;
	padding: 0;
	margin: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
}




#mixitup .mix button .inner {
	padding: .4em .8em;
}

#mixitup .mix button:focus {
	box-shadow: inset 0 0 3px 3px rgb(231, 37, 140);
	box-sizing: border-box;
}

.databases_page #mixitup .mix button {
	background-size: 75px;
}

#mixitup .mix .inner {
	height: 10em;
	/* needed for top-alignment of button contents */
	display: block;
}


#mixitup .mix h4 {
	margin-bottom: 5px;
	line-height: 1.2;
}

#mixitup .mix h5 {
	/*background: rgba(246,255,213,0.8);*/
	margin-bottom: 0;
	line-height: 1.2;
}

#mixitup .mix:hover,
#mixitup .mix:focus,
#mixitup .mix:hover button,
#mixitup .mix:focus button {
	background-color: var(--journal-hover);
	border-bottom-color: var(--journal-hover);
	border-right-color: var(--journal-hover);
	color: #fff;
	cursor: pointer;
}

#mixitup.fail {
	background: url("/images/nomatch.png") no-repeat center;
}



#mixitup .mix.Generalised {
	border-bottom-color: var(--cat-G-colour);
	border-right-color: var(--cat-G-colour);
	background-color: var(--cat-G-colour);
}

#mixitup .mix.Specialised {
	border-bottom-color: var(--cat-S-colour);
	border-right-color: var(--cat-S-colour);
	background-color: var(--cat-S-colour);
}

#mixitup .mix.Generalised:hover,
#mixitup .mix.Generalised:hover button {
	border-bottom-color: var(--cat-G-hover);
	border-right-color: var(--cat-G-hover);
	background-color: var(--cat-G-hover);
}

#mixitup .mix.Specialised:hover,
#mixitup .mix.Specialised:hover button {
	border-bottom-color: var(--cat-S-hover);
	border-right-color: var(--cat-S-hover);
	background-color: var(--cat-S-hover);
}


#Filters button.Generalised {
	border-bottom: 5px solid var(--cat-G-colour);
	padding-bottom: 0.3em;
}

#Filters button.Specialised {
	border-bottom: 5px solid var(--cat-S-colour);
	padding-bottom: 0.3em;
}

#Filters button.Generalised.active {
	background-color: var(--cat-G-colour);
	color: #fff;
	font-weight: bold;
}

#Filters button.Specialised.active {
	background-color: var(--cat-S-colour);
	color: #fff;
	font-weight: bold;
}

.controlblock {
	display: block;
	float: left;
	margin-right: 30px;
}

.ejournal_details {
	text-align: left;
	padding: 20px;
}

.ejournal_details .header {
	margin-bottom: 1em;
	font-weight: 400;
	font-family: Poppins, sans-serif;
	color: var(--alt-dark-color);
}

.ejournal_details .header h2 {
	margin-bottom: 0.2em;
}

.ejournal_details .header h5 {
	margin-bottom: .5em;
}

.ejournal_details .header h3 {
	margin-right: 40px;
}

.ejournal_details img {
	float: right;
	border-left: 15px solid #F6FFD5;
}

.ejournal_details td,
.ejournal_details th {
	padding: 0 3em 1em 0;
}

.ejournal_details td {
	vertical-align: top;
	font-weight: normal;
}

.ejournal_details th {
	font-weight: bold;
}

.ejournal_details table {
	margin-bottom: 20px;
}

.ejournal_details a {
	color: #25C1D2;
}

.ejournal_details .availability {
	margin-top: 20px;
}

.nowrap {
	white-space: nowrap;
}


/* Extra styles for Opportunities section, building on Events Calendar CSS */

.deadline_banner_top {
	font-size: 40%;
	color: #fff;
	font-weight: 800;
	margin-bottom: 0.5em;
	display: inline-block;
}

/* Stacking rules: one featured item starts a new row, but two are allowed to be next to each other in a row*/
.featuredItem {
 clear: left;
}
.featuredItem+.featuredItem {
	clear: unset;
}

.opportunity_non_featured {
	width: 50%;
	float: left;
}

.caldate {
	background: linear-gradient(180deg, rgba(226,32,19,1) 0%, rgba(226,32,19,1) 0.7em, rgba(255,255,255,1) 0.7em, rgba(255,255,255,1) 100%); 
	width: 4.5rem; /* to vertically align both featured and non-featured items, make the date cards same width always */
}

.modalbody {
	margin-top:0;
}


.deadlineDate, .opportunityEmail {
	font-weight: bold;
}

.opportunity_non_featured {
	/*background: rgba(0,0,0,0.05);*/
	height: auto;
	/* margin-top: 10px;*/
	min-height: 120px;
}


.opportunity_non_featured .newstitle {
	display: flex;
}
.opportunity_non_featured .caltitleindent {
	width: 100%;
	float: unset;
	margin-right: 20px;
	color: var(--link-color);
}
.opportunity_non_featured .caldate {
	margin-bottom:5px;
	margin-top: 5px;
	margin-left: 20px;
	flex: 0 0 auto;
}

.featuredItem {
	display: flex; /* prevents layout bug where item can have blank line at top*/
}

 /* hide weekday for less vertical height. Two rules are needed: */
.opportunity_non_featured .caldate .weekday {
	display: none;
}
.opportunity_non_featured .caldate .day { 
	margin-top: 0.55em;
}

.opportunities_sorter.controls {
	padding: 20px 5px 5px 0;
}

.opportunities_sorter button.filter {
	background: #666;
	color: #fff;
}
.opportunities_sorter button.active {
	background-color: var(--bright-bg-color);
	color: #000;
}

.opportunities_sorter .controlblock h3 {
	display: inline-block;
	margin-right: 0.5em;
	text-align: left;
}

#opportunities_list .newsitem {
	border-bottom:0; 
}
.opendaytag {
   background-color: #930c81;
   color: white;
   font-size: 11px;
   line-height: 11px;
   display: inline-block;
   padding: 1px;
   font-family: Arial, Helvetica, sans-serif;
   font-weight: bold;
   vertical-align: super;
   margin-left:1em;
}

div.file-attachment {
	font-weight: bold;
}

div.file-attachment a {
	word-break: break-all;
}


/* Mobile ajustments for remodal boxes 
   in main site mobile.css 
   
 */


/* Mobile adjustments to Opportunities.
 Can be moved later to mobile.css 
 */

@media only screen and (max-width: 930px) {
	#opportunities_list .newsitem {
		width: 100%;
	}
	
	#opportunities_list div.caltitleindent {
		width: auto;
		float: none;
	}
	
}