/* Uncomment and set these variables to customize the grid. */

/*
*
* Intercode CSS grid and standard styles
* v1.0
*
*/

/**** settings ******/
:root{
  --gutter-size: 10px;
  --break-xsmall: 48em;
}
/********/


/***** standard styles *******/
img { display:inline-block; max-width:100%; height:auto; border-style:none; }
/*******/


/*******  container and grid *********/
.ic-container { margin-right: auto;  margin-left: auto; box-sizing:border-box; max-width: 75em; }
.ic-grid {  box-sizing: border-box;  display: -ms-flexbox;  display: -webkit-box; display: flex;  -ms-flex: 0 1 auto;  -webkit-box-flex: 0;  flex: 0 1 auto;  -ms-flex-direction: row;  -webkit-box-orient: horizontal;  -webkit-box-direction: normal;  flex-direction: row;  -ms-flex-wrap: wrap;  flex-wrap: wrap; justify-content:space-between; }
.ic-grid.reverse {  -ms-flex-direction: row-reverse;  -webkit-box-orient: horizontal;  -webkit-box-direction: reverse;  flex-direction: row-reverse; }
.col.reverse {  -ms-flex-direction: column-reverse;  -webkit-box-orient: vertical;  -webkit-box-direction: reverse;  flex-direction: column-reverse; }
/**********/


/***** padding and margins *******/
.cell { -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; box-sizing:border-box; } 
.ic-grid-padding > .cell { padding:var(--gutter-size); }
.ic-grid-space { gap:var(--gutter-size); }
/*******/

/******* xsmall and default styles (< 48em = 768px) *******/
.xsmall, .xsmall-1, .xsmall-2, .xsmall-3, .xsmall-4, .xsmall-5, .xsmall-6, .xsmall-7, .xsmall-8, .xsmall-9, .xsmall-10, .xsmall-11, .xsmall-12 {  box-sizing: border-box;  -ms-flex: 0 0 auto;  -webkit-box-flex: 0;  flex: 0 0 auto; }
.xsmall, .small, .medium, .large {  -webkit-flex-grow: 1;  -ms-flex-positive: 1;  -webkit-box-flex: 1;  flex-grow: 1;  -ms-flex-preferred-size: 0;  flex-basis: 0;  max-width: 100%; }

.xsmall-1 {  -ms-flex-preferred-size: 8.333%; flex-basis: 8.333%;  max-width: 8.333%; }
.xsmall-2 {  -ms-flex-preferred-size: 16.667%; flex-basis: 16.667%; max-width: 16.667%; }
.xsmall-3 {  -ms-flex-preferred-size: 25%;  flex-basis: 25%;  max-width: 25%; }
.xsmall-4 {  -ms-flex-preferred-size: 33.333%;  flex-basis: 33.333%;  max-width: 33.333%; }
.xsmall-5 {  -ms-flex-preferred-size: 41.667%;  flex-basis: 41.667%;  max-width: 41.667%; }
.xsmall-6 {  -ms-flex-preferred-size: 50%;  flex-basis: 50%;  max-width: 50%; }
.xsmall-7 {  -ms-flex-preferred-size: 58.333%;  flex-basis: 58.333%;  max-width: 58.333%; }
.xsmall-8 {  -ms-flex-preferred-size: 66.667%;  flex-basis: 66.667%;  max-width: 66.667%; }
.xsmall-9 {  -ms-flex-preferred-size: 75%;  flex-basis: 75%;  max-width: 75%; }
.xsmall-10 {  -ms-flex-preferred-size: 83.333%;  flex-basis: 83.333%;  max-width: 83.333%; }
.xsmall-11 {  -ms-flex-preferred-size: 91.667%;  flex-basis: 91.667%;  max-width: 91.667%; }
.xsmall-12 {  -ms-flex-preferred-size: 100%;  flex-basis: 100%;  max-width: 100%; }

.ic-grid-space > .xsmall-1 { max-width:calc(8.333% - var(--gutter-size)); }
.ic-grid-space > .xsmall-2 { max-width:calc(16.667% - var(--gutter-size)); }
.ic-grid-space > .xsmall-3 { max-width:calc(25% - var(--gutter-size)); }
.ic-grid-space > .xsmall-4 { max-width:calc(33.333% - var(--gutter-size)); }
.ic-grid-space > .xsmall-5 { max-width:calc(41.667% - var(--gutter-size)); }
.ic-grid-space > .xsmall-6 { max-width:calc(50% - var(--gutter-size)); }
.ic-grid-space > .xsmall-7 { max-width:calc(58.333% - var(--gutter-size)); }
.ic-grid-space > .xsmall-8 { max-width:calc(66.667% - var(--gutter-size)); }
.ic-grid-space > .xsmall-9 { max-width:calc(75% - var(--gutter-size)); }
.ic-grid-space > .xsmall-10 { max-width:calc(83.333% - var(--gutter-size)); }
.ic-grid-space > .xsmall-11 { max-width:calc(91.667% - var(--gutter-size)); }
.ic-grid-space > .xsmall-12 { /* max-width:calc(100% - var(--gutter-size)); */ }

.start-xs {  -ms-flex-pack: start;  -webkit-box-pack: start;  justify-content: flex-start;  text-align: start; }
.center-xs {  -ms-flex-pack: center;  -webkit-box-pack: center;  justify-content: center;  text-align: center; }
.end-xs {  -ms-flex-pack: end;  -webkit-box-pack: end;  justify-content: flex-end;  text-align: end; }
.top-xs {  -ms-flex-align: start;  -webkit-box-align: start;  align-items: flex-start; }
.middle-xs {  -ms-flex-align: center;  -webkit-box-align: center;  align-items: center; }
.bottom-xs {  -ms-flex-align: end;  -webkit-box-align: end;  align-items: flex-end; }
.around-xs {  -ms-flex-pack: distribute;  justify-content: space-around; }
.between-xs {  -ms-flex-pack: justify;  -webkit-box-pack: justify;  justify-content: space-between; }
.first-xs {  -ms-flex-order: -1;  -webkit-box-ordinal-group: 0;  order: -1; }
.last-xs {  -ms-flex-order: 1;  -webkit-box-ordinal-group: 2;  order: 1; }

.ic-xsmall-hide, .ic-small-hide, .ic-medium-hide, .ic-large-hide { display:none; }
/***********/

/***** small ( > 48em = 768px) *******/
@media only screen and (min-width: 40em) {
  
  .small, .small-1, .small-2, .small-3, .small-4, .small-5, .small-6, .small-7, .small-8, .small-9, .small-10, .small-11, .small-12 { box-sizing: border-box; -ms-flex: 0 0 auto; -webkit-box-flex: 0;   flex: 0 0 auto;  }

  .small-1 { -ms-flex-preferred-size: 8.333%; flex-basis: 8.333%; max-width: 8.333%; }
  .small-2 { -ms-flex-preferred-size: 16.667%; flex-basis: 16.667%; max-width: 16.667%; }
  .small-3 { -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; }
  .small-4 { -ms-flex-preferred-size: 33.333%; flex-basis: 33.333%; max-width: 33.333%; }
  .small-5 { -ms-flex-preferred-size: 41.667%; flex-basis: 41.667%; max-width: 41.667%; }
  .small-6 { -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; }
  .small-7 { -ms-flex-preferred-size: 58.333%; flex-basis: 58.333%; max-width: 58.333%; }
  .small-8 { -ms-flex-preferred-size: 66.667%; flex-basis: 66.667%; max-width: 66.667%; }
  .small-9 { -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; }
  .small-10 { -ms-flex-preferred-size: 83.333%; flex-basis: 83.333%; max-width: 83.333%; }
  .small-11 { -ms-flex-preferred-size: 91.667%; flex-basis: 91.667%; max-width: 91.667%; }
  .small-12 { -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; }

  .ic-grid-space > .small-1 { max-width:calc(8.333% - var(--gutter-size)); }
  .ic-grid-space > .small-2 { max-width:calc(16.667% - var(--gutter-size)); }
  .ic-grid-space > .small-3 { max-width:calc(25% - var(--gutter-size)); }
  .ic-grid-space > .small-4 { max-width:calc(33.333% - var(--gutter-size)); }
  .ic-grid-space > .small-5 { max-width:calc(41.667% - var(--gutter-size)); }
  .ic-grid-space > .small-6 { max-width:calc(50% - var(--gutter-size)); }
  .ic-grid-space > .small-7 { max-width:calc(58.333% - var(--gutter-size)); }
  .ic-grid-space > .small-8 { max-width:calc(66.667% - var(--gutter-size)); }
  .ic-grid-space > .small-9 { max-width:calc(75% - var(--gutter-size)); }
  .ic-grid-space > .small-10 { max-width:calc(83.333% - var(--gutter-size)); }
  .ic-grid-space > .small-11 { max-width:calc(91.667% - var(--gutter-size)); }
  .ic-grid-space > .small-12 { /*max-width:calc(100% - var(--gutter-size));*/ }


  .start-sm { -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; text-align: start; }
  .center-sm { -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; text-align: center; }
  .end-sm { -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; text-align: end; }
  .top-sm { -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; }
  .middle-sm { -ms-flex-align: center; -webkit-box-align: center; align-items: center; }
  .bottom-sm { -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; }
  .around-sm { -ms-flex-pack: distribute; justify-content: space-around; }
  .between-sm { -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; }
  .first-sm { -ms-flex-order: -1; -webkit-box-ordinal-group: 0; order: -1; }
  .last-sm { -ms-flex-order: 1; -webkit-box-ordinal-group: 2; order: 1; }

  .ic-xsmall-hide, .ic-small-hide { display:initial; }

}
/********/


/***** medium ( > 62em = 992px) *******/
@media only screen and (min-width: 62em) {

  .medium, .medium-1, .medium-2, .medium-3, .medium-4, .medium-5, .medium-6, .medium-7, .medium-8, .medium-9, .medium-10, .medium-11, .medium-12 { box-sizing: border-box; -ms-flex: 0 0 auto;    -webkit-box-flex: 0;    flex: 0 0 auto; }

  .medium-1 { -ms-flex-preferred-size: 8.333%; flex-basis: 8.333%; max-width: 8.333%; }
  .medium-2 { -ms-flex-preferred-size: 16.667%; flex-basis: 16.667%; max-width: 16.667%; }
  .medium-3 { -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; }
  .medium-4 { -ms-flex-preferred-size: 33.333%; flex-basis: 33.333%; max-width: 33.333%; }
  .medium-5 { -ms-flex-preferred-size: 41.667%; flex-basis: 41.667%; max-width: 41.667%; }
  .medium-6 { -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; }
  .medium-7 { -ms-flex-preferred-size: 58.333%; flex-basis: 58.333%; max-width: 58.333%; }
  .medium-8 { -ms-flex-preferred-size: 66.667%; flex-basis: 66.667%; max-width: 66.667%; }
  .medium-9 { -ms-flex-preferred-size: 75%; flex-basis: 75%;  max-width: 75%; }
  .medium-10 { -ms-flex-preferred-size: 83.333%; flex-basis: 83.333%; max-width: 83.333%; }
  .medium-11 { -ms-flex-preferred-size: 91.667%; flex-basis: 91.667%; max-width: 91.667%; }
  .medium-12 { -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; }

  .ic-grid-space > .medium-1 { max-width:calc(8.333% - var(--gutter-size)); }
  .ic-grid-space > .medium-2 { max-width:calc(16.667% - var(--gutter-size)); }
  .ic-grid-space > .medium-3 { max-width:calc(25% - var(--gutter-size)); }
  .ic-grid-space > .medium-4 { max-width:calc(33.333% - var(--gutter-size)); }
  .ic-grid-space > .medium-5 { max-width:calc(41.667% - var(--gutter-size)); }
  .ic-grid-space > .medium-6 { max-width:calc(50% - var(--gutter-size)); }
  .ic-grid-space > .medium-7 { max-width:calc(58.333% - var(--gutter-size)); }
  .ic-grid-space > .medium-8 { max-width:calc(66.667% - var(--gutter-size)); }
  .ic-grid-space > .medium-9 { max-width:calc(75% - var(--gutter-size)); }
  .ic-grid-space > .medium-10 { max-width:calc(83.333% - var(--gutter-size)); }
  .ic-grid-space > .medium-11 { max-width:calc(91.667% - var(--gutter-size)); }
  .ic-grid-space > .medium-12 { /*max-width:calc(100% - var(--gutter-size)); */}

  .start-md { -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; text-align: start; }
  .center-md { -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; text-align: center; }
  .end-md { -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; text-align: end; }
  .top-md { -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; }
  .middle-md { -ms-flex-align: center; -webkit-box-align: center; align-items: center; }
  .bottom-md { -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; }
  .around-md { -ms-flex-pack: distribute; justify-content: space-around; }
  .between-md { -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; }
  .first-md { -ms-flex-order: -1; -webkit-box-ordinal-group: 0; order: -1; }
  .last-md { -ms-flex-order: 1; -webkit-box-ordinal-group: 2; order: 1; }

  .ic-xsmall-hide, .ic-small-hide, .ic-medium-hide { display:initial; }

}
/*********/

/****** large ( > 75em = 1200px)  ******/
@media only screen and (min-width: 75em) {

  .large, .large-1, .large-2, .large-3, .large-4, .large-5, .large-6, .large-7, .large-8, .large-9, .large-10, .large-11, .large-12 { box-sizing: border-box; -ms-flex: 0 0 auto;    -webkit-box-flex: 0;    flex: 0 0 auto; }

  .large-1 { -ms-flex-preferred-size: 8.333%; flex-basis: 8.333%; max-width: 8.333%; }
  .large-2 { -ms-flex-preferred-size: 16.667%; flex-basis: 16.667%; max-width: 16.667%; }
  .large-3 { -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; }
  .large-4 { -ms-flex-preferred-size: 33.333%; flex-basis: 33.333%; max-width: 33.333%; }
  .large-5 { -ms-flex-preferred-size: 41.667%; flex-basis: 41.667%; max-width: 41.667%; }
  .large-6 { -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; }
  .large-7 { -ms-flex-preferred-size: 58.333%; flex-basis: 58.333%; max-width: 58.333%; }
  .large-8 { -ms-flex-preferred-size: 66.667%; flex-basis: 66.667%; max-width: 66.667%; }
  .large-9 { -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; }
  .large-10 { -ms-flex-preferred-size: 83.333%; flex-basis: 83.333%; max-width: 83.333%; }
  .large-11 { -ms-flex-preferred-size: 91.667%; flex-basis: 91.667%; max-width: 91.667%; }
  .large-12 { -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; }

  .ic-grid-space > .large-1 { max-width:calc(8.333% - var(--gutter-size)); }
  .ic-grid-space > .large-2 { max-width:calc(16.667% - var(--gutter-size)); }
  .ic-grid-space > .large-3 { max-width:calc(25% - var(--gutter-size)); }
  .ic-grid-space > .large-4 { max-width:calc(33.333% - var(--gutter-size)); }
  .ic-grid-space > .large-5 { max-width:calc(41.667% - var(--gutter-size)); }
  .ic-grid-space > .large-6 { max-width:calc(50% - var(--gutter-size)); }
  .ic-grid-space > .large-7 { max-width:calc(58.333% - var(--gutter-size)); }
  .ic-grid-space > .large-8 { max-width:calc(66.667% - var(--gutter-size)); }
  .ic-grid-space > .large-9 { max-width:calc(75% - var(--gutter-size)); }
  .ic-grid-space > .large-10 { max-width:calc(83.333% - var(--gutter-size)); }
  .ic-grid-space > .large-11 { max-width:calc(91.667% - var(--gutter-size)); }
  .ic-grid-space > .large-12 { /*max-width:calc(100% - var(--gutter-size));*/ }

  .start-lg { -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; text-align: start; }
  .center-lg { -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; text-align: center; }
  .end-lg { -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; text-align: end; }
  .top-lg { -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; }
  .middle-lg { -ms-flex-align: center; -webkit-box-align: center; align-items: center; }
  .bottom-lg { -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; }
  .around-lg { -ms-flex-pack: distribute; justify-content: space-around; }
  .between-lg { -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; }
  .first-lg { -ms-flex-order: -1; -webkit-box-ordinal-group: 0; order: -1; }
  .last-lg { -ms-flex-order: 1; -webkit-box-ordinal-group: 2; order: 1; }
  
  .ic-xsmall-hide, .ic-small-hide, .ic-medium-hide, .ic-large-hide { display:initial; }

}
/*********/