$maxPageWidth:          1100px;

$backgroundColor:       rgb(254, 254, 252);
$shadedBackgroundColor: #f5f3ee;
$shadow:                #C8C5C1;
$underline:             #c1bcb7;
$midTone:               #827e7a;
$nearBlack:             #0f0a07;

$highlight:             #74b58c;
$highlightHover:        #4a765a;
$highlightPressed:      #569a6e;

$linkColor:             $highlight;
$linkHoverColor:        $highlightHover;

$minSizeForTwoCol:         950px;
$sizeRequiringPhoneLayout: 600px;

$menuMarginRight: 20px;

/* categorical colours from https://github.com/mbostock/d3/wiki/Ordinal-Scales */
$categoricalBlue:#1f77b4;
$categoricalOrange: #ff7f0e;
$categoricalGreen: #2ca02c;
$categoricalRed: #d62728;
$categoricalPurple: #9467bd;
$categoricalBrown: #8c564b;
$categoricalPink: #e377c2;
$categoricalGrey: #7f7f7f;
$categoricalYellow: #bcbd22;
$categoricalLightBlue: #17becf;
  
$categoricalColors: $categoricalBlue $categoricalOrange $categoricalGreen $categoricalPurple $categoricalRed $categoricalBrown $categoricalPink $categoricalGrey $categoricalYellow $categoricalLightBlue;

@mixin linkTiming {
  transition: all 0.5s;
}
@mixin linkTimingHover {
  transition: all 0.2s;
}

@mixin link {
  color: $linkColor;
  fill: $linkColor;
  text-decoration: none;
  @include linkTiming;
}
@mixin hovered-link {
  color: $highlightHover;
  fill: $highlightHover;
  text-decoration: underline;
  @include linkTimingHover;
  cursor: pointer;
}
@mixin active-link {
  color: $nearBlack;
  fill: $nearBlack;
  transition: all 0s;
}

$themeFont: "Computer Modern";
$themeMonoFont: "Computer Modern mono";
$themeItalicFont: "Computer Modern italic";


@font-face {
  font-family: $themeMonoFont;
  src: url("/type/cmuntt.eot");
  src: url("/type/cmuntt.ttf");
  src: url("/type/cmuntt.svg");
  src: url("/type/cmuntt.woff");
}

@font-face {
  font-family: $themeFont;
  src: url("/type/cmunrm.eot");
  src: url("/type/cmunrm.ttf");
  src: url("/type/cmunrm.svg");
  src: url("/type/cmunrm.woff");
}

@font-face {
  font-family: $themeItalicFont;
  src: url("/type/cmunti.eot");
  src: url("/type/cmunti.ttf");
  src: url("/type/cmunti.svg");
  src: url("/type/cmunti.woff");
}

@import 'oboe';
@import 'content';
@import 'demo';
@import 'map';
@import 'graph';
@import 'cartogram';
@import 'packetColors';