/*--------------------------COLUMNS STYLING-----------------------------*/

/*----------------------------------------------------------------------*/
/*--------------------------FORMAT COLUMNS------------------------------*/
/*----------------------------------------------------------------------*/
/*
*     BLOCK CONTROL
*/
.keeptogether  {
      -webkit-column-break-inside:  avoid;
      -moz-column-break-inside: avoid;
      -column-break-inside: avoid;
      page-break-inside: avoid;
      break-inside: avoid;
     }
.breakbefore  {
      -webkit-column-break-before:  always;
      -moz-column-break-before: always;
      -column-break-before: always;
      page-break-before: always;
      break-before: always;
     }

/*
*     TWO COLUMNS WITH DIVIDER
*/
@media   screen and (min-width: 420px) {
.j1col2 {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
     -moz-column-count: 2; /* Firefox */
     column-count: 2;
    -webkit-column-gap: 20px; /* Chrome, Safari, Opera */
     -moz-column-gap: 20px; /* Firefox */
     column-gap: 20px;
    -webkit-column-rule: 2px outset #006633; /* Chrome, Safari, Opera */
     -moz-column-rule: 2px outset #006633; /* Firefox */
     column-rule: 2px outset #006633;
      -webkit-column-break-inside:  auto;
      -moz-column-break-inside: auto;
      -column-break-inside: auto;
      page-break-inside: auto;	
      break-inside: auto;
     }
p.j1col2 {
      -webkit-column-break-inside:  auto;
      -moz-column-break-inside: auto;
      -column-break-inside: auto;
      page-break-inside: auto;
      break-inside: auto;
     }
  }
/*
*       THREE COLUMNS WITH DIVIDER
*/
@media   screen and (min-width: 420px) {
.j1col3 {
    -webkit-column-count: 3; /* Chrome, Safari, Opera */
     -moz-column-count: 3; /* Firefox */
     column-count: 3;
    -webkit-column-gap: 20px; /* Chrome, Safari, Opera */
     -moz-column-gap: 20px; /* Firefox */
     column-gap: 20px;
     -webkit-column-rule: 2px outset #006633; /* Chrome, Safari, Opera */
     -moz-column-rule: 2px outset #006633; /* Firefox */
     column-rule: 2px outset #006633;
     }
  }
/*
*     FOUR COLUMNS WITH DIVIDER
*/
@media  screen and (min-width: 420px) {
.j1col4 {
    -webkit-column-count: 4; /* Chrome, Safari, Opera */
     -moz-column-count: 4; /* Firefox */
     column-count: 4;
    -webkit-column-gap: 20px; /* Chrome, Safari, Opera */
     -moz-column-gap: 20px; /* Firefox */
     column-gap: 20px;
     -webkit-column-rule: 2px outset #006633; /* Chrome, Safari, Opera */
     -moz-column-rule: 2px outset #006633; /* Firefox */
     column-rule: 2px outset #006633;
     }
  }

/*
*        TWO COLUMNS NO DIVIDER
*/
@media   screen and (min-width: 420px) {
.j1col2no {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
     -moz-column-count: 2; /* Firefox */
     column-count: 2;
    -webkit-column-gap: 2em; /* Chrome, Safari, Opera */
     -moz-column-gap: 2em; /* Firefox */
     column-gap: 2em;
     }
  }
/*
*         THREE COLUMNS NO DIVIDER
*/
@media  screen and (min-width: 420px) {
.j1col3no {
    -webkit-column-count: 3; /* Chrome, Safari, Opera */
     -moz-column-count: 3; /* Firefox */
     column-count: 3;
    -webkit-column-gap: 2em; /* Chrome, Safari, Opera */
     -moz-column-gap: 2em; /* Firefox */
     column-gap: 2em;
     }
  }
/*
*        FOUR COLUMNS NO DIVIDER
*/
@media  screen and (min-width: 420px) {
.j1col4no {
    -webkit-column-count: 4; /* Chrome, Safari, Opera */
     -moz-column-count: 4; /* Firefox */
     column-count: 4;
    -webkit-column-gap: 2em; /* Chrome, Safari, Opera */
     -moz-column-gap: 2em; /* Firefox */
     column-gap: 2em;
     }
  }

/*! ---END FORMAT COLUMNS----*/