/* ----------------------------------------------------------------
I M P O R T
---------------------------------------------------------------- */
/* ----------------------------------------------------------------
D E F A U L T S
---------------------------------------------------------------- */
/* ----------------------------------------------------------------
TYPOGRAPHY
---------------------------------------------------------------- */
/*041*/
/* ----------------------------------------------------------------
LAYOUT
---------------------------------------------------------------- */
/* was 560px /// 530px: old blog size */
/* 810px: legacy size based on a fixed 12-column grid (40px unit and 30px gutter) */
/* was 1024px */
/* was 370px // was 500px */
/* 680px + safetypadding */
/* 900px + safetypadding */
/* 1024px + safetypadding */
/* used to be 16px */
/* ----------------------------------------------------------------
COLORS
---------------------------------------------------------------- */
/* #69a2ff */
/* fadeout(@defaults-color-manateeblack, 97%) looks better than @defaults-color-snowblacks-002 */
/* Palette.snowWhites.at(0.075).desaturate(0.08) = rgba(208, 221, 240, 0.1)*/
/* fadeout(@defaults-color-manateeblack, 90%) looks better than @defaults-color-snowblacks-010 */
/* looks better than @defaults-color-snowblacks-010 */
/* ----------------------------------------------------------------
FONT STACKS
---------------------------------------------------------------- */
/*
Starting from Safari 13.1, they added font family names for system fonts:
ui-sans-serif — San Francisco (same as system-ui and -apple-system)
ui-rounded
ui-serif — New York
ui-monospace — SF Mono
*/
/* More */
/* ----------------------------------------------------------------
COLOR PALETTE
---------------------------------------------------------------- */
/* 
Helper Function:
```
var a = [];
a.push([Palette.skyflowerBluesV2, 'skyflowerblues']);
a.push([Palette.diamondGrays, 'diamondgrays']);
a.push([Palette.diamondBlacks, 'diamondblacks']);
a.push([Palette.diamondWhites, 'diamondwhites']);
a.push([Palette.snowGrays, 'snowgrays']);
a.push([Palette.snowBlacks, 'snowblacks']);
a.push([Palette.snowWhites, 'snowwhites']);
a.push([Palette.iceGrays, 'icegrays']);
a.push([Palette.iceBlacks, 'iceblacks']);
a.push([Palette.iceWhites, 'icewhites']);
a.push([Palette.oceanGrays, 'oceangrays']);
a.push([Palette.oceanBlacks, 'oceanblacks']);
a.push([Palette.oceanWhites, 'oceanwhites']);

var s = '';
for (var j=0; j<a.length; ++j) {
	for (var i=1; i<=100; i=i+1) {
		if (i<20 || i>80 || i%5===0) {
			var grad = a[j][0];
			var title = a[j][1];
			var rgbaString = grad.at(i/100).toString('rgba256');
			s += '@defaults-color-'+title+'-'+("0000" + i).slice(-3)+': color('+rgbaString+');\n';
		}
	}
	s += '\n';
}
console.log(s);
```
*/
/* Legacy */
/* business pink */
/* awesome green */
/* golden yellow */
/* golden yellow bright */
/* skyflower blue */
/* indigo blue */
/* things blue 0 */
/* things blue 1 */
/* things blue 2 */
/* things blue 3 */
/* things blue 4 */
/* things blue 5 */
/* things blue 6 */
/* things blue 7 */
/* things blue 8 */
/* things blue 9 */
/* manatee gray */
/* manatee black (50% manatee black ^= manatee gray) */
/* rhino gray */
/* rhino black (75% rhino black ^= rhino gray) */
/* shark black */
/* snow white */
/* porcelain white */
/* quartz black */
/* diamond black */
/* space black (mac) */
/* space black (ios) */
/* space silver (mac) */
/* space silver (ios) */
/* ----------------------------------------------------------------
T O O L S
---------------------------------------------------------------- */
/* ----------------------------------------------------------------
BACKGROUND IMAGES
---------------------------------------------------------------- */
/* BACKGROUND IMAGE */
/* SPRITE */
/* HIDE TEXT */
/* ----------------------------------------------------------------
GRID
---------------------------------------------------------------- */
/* 

- implemented like Core 0.6 > Layout > Grid > MixedGrid > Float/Innerpadding

*/
/* ROW */
/* COLUMN */
/* ----------------------------------------------------------------
O V E R R I D E S
---------------------------------------------------------------- */
/* SLICE */
.slice {
  padding-bottom: 1px;
  /* prevents collapsing margins */
}
/* CONTAINER */
.container.for-navigation {
  padding-bottom: 3em;
}
/* FANCYGRID */
.fancygrid.for-productselection {
  font-size: 0.89em;
  margin-bottom: 0.5em;
}
/* ----------------------------------------------------------------
C O N T A C T F O R M
---------------------------------------------------------------- */
.contactform {
  margin-bottom: 80px;
}
/* OVERRIDES */
.contactform .textarea.for-message {
  height: 16em;
}
/* QUESTION */
.contactform-section {
  margin-bottom: 2em;
}
.contactform-section.is-hidden {
  display: none;
}
.contactform-section.for-submit {
  margin: 2em 0;
}
/*

INLINE ERROR HANDLING EXPERIMENT...

.contactform-section {
    padding: 0.25em 0.75em 0.75em 0.75em;
    margin: -0.25em -0.75em 16px -0.75em;
	border-radius: 1.0em;
    transition: background 0.1s ease-out;
}

.contactform-section.has-error {
	background: hsla(50, 89%, 55%, 0.75);
	animation: contactform-shaking 0.2s 1 ease-out forwards;
}

@keyframes contactform-shaking {
	0% {
		transform: translate(0, 0);
	}
	25% {
		transform: translate(-15px, 0);
	}
	50% {
		transform: translate(10px, 0);
	}
	90% {
		transform: translate(-2px, 0);
	}
	100% { 
		transform: translate(0, 0);
	}
}
*/
/* HEADING */
.contactform-heading {
  /* Layout */
  padding: 0.25em 0;
  /* Typography */
  font-weight: 700;
}
/* BODY */
/* CATEGORY */
.contactform-category {
  margin: 0.25em 0;
}
/* SUBMIT */
/* FRIENDLYCAPTCHA */
.contactform-friendlycaptcha {
  margin: 20px 0;
  padding: 5px;
  background-color: rgba(0, 0, 0, 0.07);
  border-radius: 8px;
  width: fit-content;
}
.contactform-friendlycaptcha .frc-captcha {
  margin: 0 auto;
  background: transparent;
  border: none;
}
.contactform-friendlycaptcha .frc-button {
  padding: 4px 6px;
  margin-top: 1px;
  border-radius: 4px;
  color: #fff;
  background: #5c9cf5;
}
.contactform-friendlycaptcha .frc-button:hover {
  background: #5c9cf5;
}
.contactform-friendlycaptcha .dark.frc-captcha button {
  background: #5c9cf5;
}
/* ----------------------------------------------------------------
P R O D U C T S E L E C T I O N
---------------------------------------------------------------- */
/* ITEM */
.productselection-item {
  padding: 0.25em 0;
}
/* QUESTIONS */
.productselection-questions {
  /* Layout */
  display: none;
  margin: 0.5em 0 0.5em 1.25em;
  padding: 0.75em 0.75em;
  /* Typography */
  font-size: 0.9em;
  /* Appearance */
  background: rgba(0, 48, 111, 0.04);
  border-radius: 0.75em;
}
.productselection-item.is-selected .productselection-questions {
  display: block;
}
/* QUESTION */
.productselection-question:not(:last-child) {
  margin-bottom: 0.5em;
}
/* LABEL */
.productselection-label {
  font-weight: 500;
  margin-bottom: 0.25em;
}
/* FIELD */
/* ----------------------------------------------------------------
S T I C K Y N O T E
---------------------------------------------------------------- */
.stickynote {
  /* Layout */
  padding: 1em;
  margin-bottom: 1.5em;
  /* Typography */
  font-size: 1em;
  line-height: 1.3;
  /* Appearance */
  color: #595636;
  background-color: #fffac2;
  /* hsl(55, 100%, 88%) */
  border-radius: 1em;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 4px rgba(0, 0, 0, 0.05), 0 2px 8px rgba(0, 0, 0, 0.05);
}
.stickynote p,
.stickynote ol,
.stickynote ul {
  margin-bottom: 0.65em;
}
.stickynote h1,
.stickynote h2,
.stickynote h3,
.stickynote h4,
.stickynote h5,
.stickynote h6 {
  font-size: 1em;
  line-height: 1.3;
  margin-top: 0;
  margin-bottom: 0.65em;
  font-weight: 700;
}
.stickynote *:last-child {
  margin-bottom: 0;
}
/* ----------------------------------------------------------------
R E S P O N S E
---------------------------------------------------------------- */
.response {
  /* Layout */
  position: relative;
  margin-bottom: 2em;
  padding: 1em 1.5em 1em 60px;
  /* Typography */
  font-size: 1em;
  line-height: 1.3;
  /* Appearance */
  color: #b6b9be;
  background: #393c40;
  border-radius: 1.25em;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1), 0 4px 16px 0 rgba(0, 0, 0, 0.1), 0 8px 32px 0 rgba(0, 0, 0, 0.1);
}
.response.is-successful {
  /* margin-bottom: 240px; /* otherwise the page is too short */
}
/* ICON */
.response-icon {
  /* Layout */
  display: block;
  width: 32px;
  height: 32px;
  position: absolute;
  left: 1.1em;
  top: 1.1em;
  /* Appearance */
  background-repeat: no-repeat;
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  background-size: 100% 100%;
}
.response.has-failed .response-icon {
  background-image: url(images/response-icon-error.2x.png);
}
.response.is-invalid .response-icon {
  background-image: url(images/response-icon-error.2x.png);
}
.response.is-successful .response-icon {
  background-image: url(images/response-icon-success.2x.png);
}
/* TITLE */
.response-title {
  font-weight: 700;
  color: #fff;
}
/* BODY */
.response-body {
  font-weight: 500;
}
.response-body *:last-child {
  margin-bottom: 0;
}
.response-body a {
  color: #7badff;
}
/* ----------------------------------------------------------------
Y O U R E M A I L
---------------------------------------------------------------- */
.youremail {
  /* Layout */
  padding: 2.5em;
  margin: 3em 0 5em 0;
  /* Typography */
  font-size: 0.9em;
  line-height: 1.3;
  /* Appearance */
  color: #2e3135;
  background: #fff;
  border-radius: 1.5em;
  border: 2px solid rgba(0, 28, 70, 0.12);
  /* box-shadow: 
		0 16px 32px 0 rgba(0,0,0,0.025); */
}
.youremail-subject {
  margin-bottom: 1.3em;
  font-weight: 700;
}
.youremail-message {
  white-space: pre-line;
}
/* ----------------------------------------------------------------
S U G G E S T I O N S
---------------------------------------------------------------- */
/* wrapper for quickfind results */