//- Google Fonts
$font-google-primary: 'https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap';
$font-google-secondary: 'https://fonts.googleapis.com/css2?family=Montserrat&display=swap';

//- @type List
$abril-fatface: 'Abril Fatface', cursive;
$montserrat: 'Montserrat', sans-serif;

//- Typography
$base-font-family: $montserrat;
$heading-font-family: $abril-fatface;

$font-size-small: 0.875em;

/*- Screen Sizes*/
$tablet-width: 768px;
$desktop-width: 1024px;

/* COLOR HEX */
$cadet: #4f6d7aff;
$maximum-blue: #5ea5b8ff;
$columbia-blue: #c0d6dfff;
$platinum: #eaeaeaff;
$cultured: #f3f3f3ff;
$nero: #444444;

/* COLOR Gradient */
$dl-gradient-right: linear-gradient(90deg, rgba(0, 0, 0, 0.04) 20%, rgba(255, 255, 255, 0) 0%);

$body-background-color: $platinum;
$body-text-color: $nero;

//- Global Functions
/*import fonts*/
@if variable-exists(font-google-primary) {
	@import url($font-google-primary);
}

@if variable-exists(font-google-secondary) {
	@import url($font-google-secondary);
}

//- Global Mixins

/*media queries*/
@mixin tablet {
	@media (min-width: #{$tablet-width}) and (max-width: #{$desktop-width - 1px}) {
		@content;
	}
}

@mixin desktop {
	@media (min-width: #{$desktop-width}) {
		@content;
	}
}

@mixin tablet-up {
	@media (min-width: #{$tablet-width}) {
		@content;
	}
}




.dl-blurbs {
	display: grid;

	@include tablet-up {
		grid-template-columns: repeat(2, 1fr);
		gap: 2vw;
	}
}

/* LIST */
dl {

	background: $dl-gradient-right;
	//padding-left: 2vw; //default is smartphone
	padding-right: 2vw;
	margin: 0;

	@include tablet-up {
		padding-left: 2vw;
	}

	@include desktop {
		padding-top: 3vw;
		padding-bottom: 3vw;
	}

}

// dt {

// 	color: rgba(46, 45, 45, 0.548);
// 	font-family: $base-font-family;
// 	font-size: 14px;
// 	text-transform: uppercase;
//     padding: 3vw;
//     border-bottom:1px solid #f0eaea;
//     margin-top: 2px;
// 	width: 174px;

// }
@media only screen and (max-width: 600px) {
	a:hover {

		background-color: #fff;



	}
}

dd {

	margin-bottom: 2vh;
}