:root {
  --primary: #db7e17;
  --secondary: #fff;
  --textcolor: #000;
  --textcolor-secondary: #414141; }

/*

	Media Query mixin

	See https://github.com/sass-mq/sass-mq/ for original full version.

	@example scss
	 .element {
	   @include mq($from: mobile) {
		 color: red;
	   }

	   @include mq($to: tablet) {
		 color: blue;
	   }

	   @include mq(mobile, tablet) {
		 color: green;
	   }

	   @include mq($from: tablet, $and: '(orientation: landscape)') {
		 color: teal;
	   }

	   @include mq(em(950px)) {
		 color: hotpink;
	   }

	   @include mq(em(950px), $media-feature: height) {
		 color: hotpink;
	   }

	   @include mq(tablet, $media-type: screen) {
		 color: hotpink;
	   }

	   // Advanced use:
	   $custom-breakpoints: (L: 900px, XL: 1200px);
	   @include mq(L, $bp: $custom-breakpoints) {
		 color: hotpink;
	   }
	 }

*/
/*

	Margin / Padding Quick Resets

	example: top & bottom margin set to $spacing-unit
	.element {
		@include push--ends;
	}

	example: left & right padding set to $spacing-unit--small
	.element {
		@include soft--sides($spacing-unit--small);
	}

*/
/*

	Helper mixins

*/
/*

	Form input placeholder text

	example:

	input,
	textarea {
		@include input-placeholder {
			color: $grey;
		}
	}

*/
/*

	Retina images

	example:

	.element {
		@include retina {
			background-image: url(../img/background@2x.png);
		}
	}

*/
/*

	Content margins

	fore removing first/last child margins

	example: default
	.element {
		@include content-margins;
	}

	output:
	.element > *:first-child {
		margin-top: 0;
	}
	.element > *:last-child {
		margin-bottom: 0;
	}

	example: empty selector
	.element {
		@include content-margins('false');
	}

	output:
	.element:first-child {
		margin-top: 0;
	}
	.element:last-child {
		margin-bottom: 0;
	}

*/
/*

	CSS Triangle

	used for creating CSS only triangles

	example:
	.element {

		&::before {
			@include css-triangle(blue, down);
		}
	}

*/
/*

	Hide text

	example:

	.element {
		@include hide-text;
	}

*/
/*

	Responsive ratio

	Used for creating scalable elements that maintain the same ratio

	example:
	.element {
		@include responsive-ratio(400, 300);
	}

*/
/*

	Icon

	For using fontastic icons in pseudo elements

*/
/*

	Colours

	background, colour, etc. match up with colour map in _variables.scss

	modify to suit per project

*/
/*

	Fluid Property

	http://www.adrenalinmedia.com.au/the-agency/insights/this-changes-everything-css-fluid-properties.aspx

	HTML:

	<h1 class="element">
		<span>Text to replace</span>
	</h1>

	example:
	h1 {
		@include fp(font-size, 50, 100); // 50px at 320, 100px at 1920;
	}

	output:
	h1 {
		font-size: calc(3.125vw + 40px); //This is the magic!
	}

	@media (max-width:320px){ //Clips the start to the min value
		font-size:50px;
	}

	@media (min-width:1920px){ //Clips the end to the max value
		font-size:100px;
	}


*/
/*

	Misc

*/
/*

	Font face

	example:

	@include font-face('Clarendon', 'clarendon-webfont');
	@include font-face('Clarendon', 'clarendon-webfont', $w--bold, italic);

*/
/*

	REMs

*/
/*

	EMs calculator

*/
/*

	SVG inliner

*/
/*

	Media Query mixin

	See https://github.com/sass-mq/sass-mq/ for original full version.

	@example scss
	 .element {
	   @include mq($from: mobile) {
		 color: red;
	   }

	   @include mq($to: tablet) {
		 color: blue;
	   }

	   @include mq(mobile, tablet) {
		 color: green;
	   }

	   @include mq($from: tablet, $and: '(orientation: landscape)') {
		 color: teal;
	   }

	   @include mq(em(950px)) {
		 color: hotpink;
	   }

	   @include mq(em(950px), $media-feature: height) {
		 color: hotpink;
	   }

	   @include mq(tablet, $media-type: screen) {
		 color: hotpink;
	   }

	   // Advanced use:
	   $custom-breakpoints: (L: 900px, XL: 1200px);
	   @include mq(L, $bp: $custom-breakpoints) {
		 color: hotpink;
	   }
	 }

*/
/*

	Margin / Padding Quick Resets

	example: top & bottom margin set to $spacing-unit
	.element {
		@include push--ends;
	}

	example: left & right padding set to $spacing-unit--small
	.element {
		@include soft--sides($spacing-unit--small);
	}

*/
/*

	Helper mixins

*/
/*

	Form input placeholder text

	example:

	input,
	textarea {
		@include input-placeholder {
			color: $grey;
		}
	}

*/
/*

	Retina images

	example:

	.element {
		@include retina {
			background-image: url(../img/background@2x.png);
		}
	}

*/
/*

	Content margins

	fore removing first/last child margins

	example: default
	.element {
		@include content-margins;
	}

	output:
	.element > *:first-child {
		margin-top: 0;
	}
	.element > *:last-child {
		margin-bottom: 0;
	}

	example: empty selector
	.element {
		@include content-margins('false');
	}

	output:
	.element:first-child {
		margin-top: 0;
	}
	.element:last-child {
		margin-bottom: 0;
	}

*/
/*

	CSS Triangle

	used for creating CSS only triangles

	example:
	.element {

		&::before {
			@include css-triangle(blue, down);
		}
	}

*/
/*

	Hide text

	example:

	.element {
		@include hide-text;
	}

*/
/*

	Responsive ratio

	Used for creating scalable elements that maintain the same ratio

	example:
	.element {
		@include responsive-ratio(400, 300);
	}

*/
/*

	Icon

	For using fontastic icons in pseudo elements

*/
/*

	Colours

	background, colour, etc. match up with colour map in _variables.scss

	modify to suit per project

*/
/*

	Fluid Property

	http://www.adrenalinmedia.com.au/the-agency/insights/this-changes-everything-css-fluid-properties.aspx

	HTML:

	<h1 class="element">
		<span>Text to replace</span>
	</h1>

	example:
	h1 {
		@include fp(font-size, 50, 100); // 50px at 320, 100px at 1920;
	}

	output:
	h1 {
		font-size: calc(3.125vw + 40px); //This is the magic!
	}

	@media (max-width:320px){ //Clips the start to the min value
		font-size:50px;
	}

	@media (min-width:1920px){ //Clips the end to the max value
		font-size:100px;
	}


*/
/*

	Misc

*/
/*

	Font face

	example:

	@include font-face('Clarendon', 'clarendon-webfont');
	@include font-face('Clarendon', 'clarendon-webfont', $w--bold, italic);

*/
/*

	REMs

*/
/*

	EMs calculator

*/
/*

	SVG inliner

*/
/*

	Media Query mixin

	See https://github.com/sass-mq/sass-mq/ for original full version.

	@example scss
	 .element {
	   @include mq($from: mobile) {
		 color: red;
	   }

	   @include mq($to: tablet) {
		 color: blue;
	   }

	   @include mq(mobile, tablet) {
		 color: green;
	   }

	   @include mq($from: tablet, $and: '(orientation: landscape)') {
		 color: teal;
	   }

	   @include mq(em(950px)) {
		 color: hotpink;
	   }

	   @include mq(em(950px), $media-feature: height) {
		 color: hotpink;
	   }

	   @include mq(tablet, $media-type: screen) {
		 color: hotpink;
	   }

	   // Advanced use:
	   $custom-breakpoints: (L: 900px, XL: 1200px);
	   @include mq(L, $bp: $custom-breakpoints) {
		 color: hotpink;
	   }
	 }

*/
/*

	Margin / Padding Quick Resets

	example: top & bottom margin set to $spacing-unit
	.element {
		@include push--ends;
	}

	example: left & right padding set to $spacing-unit--small
	.element {
		@include soft--sides($spacing-unit--small);
	}

*/
/*

	Helper mixins

*/
/*

	Form input placeholder text

	example:

	input,
	textarea {
		@include input-placeholder {
			color: $grey;
		}
	}

*/
/*

	Retina images

	example:

	.element {
		@include retina {
			background-image: url(../img/background@2x.png);
		}
	}

*/
/*

	Content margins

	fore removing first/last child margins

	example: default
	.element {
		@include content-margins;
	}

	output:
	.element > *:first-child {
		margin-top: 0;
	}
	.element > *:last-child {
		margin-bottom: 0;
	}

	example: empty selector
	.element {
		@include content-margins('false');
	}

	output:
	.element:first-child {
		margin-top: 0;
	}
	.element:last-child {
		margin-bottom: 0;
	}

*/
/*

	CSS Triangle

	used for creating CSS only triangles

	example:
	.element {

		&::before {
			@include css-triangle(blue, down);
		}
	}

*/
/*

	Hide text

	example:

	.element {
		@include hide-text;
	}

*/
/*

	Responsive ratio

	Used for creating scalable elements that maintain the same ratio

	example:
	.element {
		@include responsive-ratio(400, 300);
	}

*/
/*

	Icon

	For using fontastic icons in pseudo elements

*/
/*

	Colours

	background, colour, etc. match up with colour map in _variables.scss

	modify to suit per project

*/
/*

	Fluid Property

	http://www.adrenalinmedia.com.au/the-agency/insights/this-changes-everything-css-fluid-properties.aspx

	HTML:

	<h1 class="element">
		<span>Text to replace</span>
	</h1>

	example:
	h1 {
		@include fp(font-size, 50, 100); // 50px at 320, 100px at 1920;
	}

	output:
	h1 {
		font-size: calc(3.125vw + 40px); //This is the magic!
	}

	@media (max-width:320px){ //Clips the start to the min value
		font-size:50px;
	}

	@media (min-width:1920px){ //Clips the end to the max value
		font-size:100px;
	}


*/
/*

	Misc

*/
/*

	Font face

	example:

	@include font-face('Clarendon', 'clarendon-webfont');
	@include font-face('Clarendon', 'clarendon-webfont', $w--bold, italic);

*/
.search-result h2 {
  font-size: 2rem;
  font-weight: 700;
  color: var(--primary);
  padding-top: 0.9375rem; }

.search-result--count {
  margin-bottom: 1.875rem;
  padding-top: 1.25rem;
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--textcolor); }

.search-result--flat .card {
  border-radius: 0.75rem; }
  .search-result--flat .card .card-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 1rem; }
    .search-result--flat .card .card-body p {
      margin: 0;
      color: var(--textcolor); }
      .search-result--flat .card .card-body p span {
        color: var(--primary); }

.search-result--flat__link {
  padding-left: 10px; }
  .search-result--flat__link svg {
    min-width: 32px; }
    @media screen and (max-width: 767px) {
      .search-result--flat__link svg {
        width: 25px;
        height: 25px;
        min-width: 25px; } }

.search-result--manuscript .card__image {
  padding-top: 0 !important;
  margin-top: 15px;
  box-shadow: 0px 4px 39.2px 0px #00000059; }