/*----------------------------------------------*\
    GLOBAL
	======

	@package ccr

\*----------------------------------------------*/
/*----------------------------------------------*\
    COMPONENTS
	==========

	@package ccr

\*----------------------------------------------*/
/*
 *
 * / Variables
------------------------------------------------*/
/* Colors */
/* Breakpoints */
/* 368px, bigger phones */
/* 560px */
/* 800px */
/* 1008px, tablet vertical */
/* 1200px */
/* Max Widths */
/* 1040px */
/* 672px */
/* Fonts */
/*
 *
 * / Mixins
------------------------------------------------*/
/*
 *
 * 1./ Site Wide
------------------------------------------------*/
body {
  font-family: proxima-nova, Arial, sans-serif;
  color: #444; }

/*
 *
 * 2./ Responsive sizes and Max Widths
------------------------------------------------*/
.responsive-scale {
  font-size: 1rem; }
  @media screen and (min-width: 23rem) {
    .responsive-scale {
      font-size: 1.025rem; } }
  @media screen and (min-width: 35rem) {
    .responsive-scale {
      font-size: 1.075rem; } }
  @media screen and (min-width: 50rem) {
    .responsive-scale {
      font-size: 1.125rem; } }
  @media screen and (min-width: 63rem) {
    .responsive-scale {
      font-size: 1.2rem; } }

.max-width-nav, .wp-block-columns {
  padding: 0 1em; }
  @media screen and (min-width: 35rem) {
    .max-width-nav, .wp-block-columns {
      padding: 0 2em; } }
  @media screen and (min-width: calc(65rem + 4rem)) {
    .max-width-nav, .wp-block-columns {
      max-width: 65rem;
      padding: 0;
      margin-left: auto;
      margin-right: auto; } }

.max-width-text {
  padding: 0 1em; }
  @media screen and (min-width: 35rem) {
    .max-width-text {
      padding: 0 2em; } }
  @media screen and (min-width: calc(42rem + 8rem)) {
    .max-width-text {
      /* add 8rem so that there is a difference between nav width and text width at the break */
      max-width: 42rem;
      padding: 0;
      margin-left: auto;
      margin-right: auto; } }

.wp-block-columns {
  /* columns need max-width too */ }
  .wp-block-columns .max-width-nav, .wp-block-columns .wp-block-columns,
  .wp-block-columns .max-width-text {
    /* no double padding when columns */
    padding: 0; }

/*
 *
 * 3./ Admin for front-end
------------------------------------------------*/
.admin-note {
  padding: 1em;
  background-color: yellow;
  color: red;
  font-style: italic; }
  .admin-note a {
    color: red; }
