@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,400italic,500,500italic,700,700italic,900,900italic,300italic,300,100italic,100');

:root {
  
  --background-color    : #f4f7f9;

  --site-font           : 'Roboto';

  --site-header-color     : #FFF;
  --site-header-bgcolor   : #1973e7;
  --site-header-height    : 3rem;

  --site-drawer-title-color : #FFF;
  --site-drawer-color   : rgba(255,255,255,.7);
  --site-drawer-bgcolor : rgb(38, 26, 61);
  --site-drawer-select-color : #c8cfd8;
  --site-drawer-min     : 3.4rem;
  --site-drawer-max     : 14rem;

  --site-main-padding   : 1rem;
  --site-footer-color   : rgba(0,0,0,.8);
  --site-footer-bgcolor : #F6F6F8;
  --site-footer-height  : 4rem;

  --text-color          : #0a101b;
  --text-color-light    : rgba(0,0,0,.62);
  --text-color-lighter  : rgba(0,0,0,.44);

  --page-header-padding: 0 1rem;

  --primary-color-dark          : rgb(29, 6, 71);
  --primary-color               : rgb(50, 20, 105);
  --primary-color-light         : rgb(72, 39, 133);
  --primary-color-lighter       : rgba(109, 76, 172, .5);
  --primary-color-text          : rgba(255,255,255, 1 );

  --secondary-color-dark        : rgba(100, 100, 150, 1);
  --secondary-color             : rgba(128, 128, 128, .5);
  --secondary-color-light       : rgba(120, 120, 170, .72);
  --secondary-color-lighter     : #e8f0fe;
  --secondary-color-text        : #000;

  --accent-color                : #000;
  --accent-color-text           : #FFF;

  --danger-color                : #ff4400;
  --danger-color-light          : #ff7470;

  --paper-color                 : #FFFFFF;
  --overlay-color               : rgba(100,100,100,.5);
  --divider-color               : rgba(100,100,100,.3);
  --divider-color-light         : rgba(232,234,237,1);

  --shadow1 :
      0 2px 2px 0 rgba(0,0,0,.14),
      0 3px 1px -2px rgba(0,0,0,.2),
      0 1px 5px 0 rgba(0,0,0,.12);


  --shadow1-light :
      0 2px 2px 0 rgba(200,200,200,.14),
      0 3px 1px -2px rgba(200,200,200,.2),
      0 1px 5px 0 rgba(200,200,200,.12);


  --shadow2 :
      inset 0 2px 2px 0 rgba(0,0,0,.14),
      inset 0 3px 1px -2px rgba(0,0,0,.2),
      inset 0 1px 5px 0 rgba(0,0,0,.12);

  --shadow-right :
      3px 0px 3px 0px rgba(100,100,100,0.5);

  --shadow-bottom :
      0px 3px 5px 0px rgba(50,50,50,0.3);

  --shadow-top :
      0px -3px 5px 0px rgba(150,150,150,0.3);
}