/**
 * @file
 * Grid styling for the HSL 3 column grid
 */
.icon-small-sprite, .icon-small-cross-blue, .icon-small-star-blue, .icon-small-star-pink, .icon-small-star-white {
  background: url('../../../img/icon-small-se8cae0c792.png') no-repeat;
}

.icon-small-cross-blue {
  background-position: 0 0;
}

.icon-small-star-blue {
  background-position: 0 -18px;
}

.icon-small-star-pink {
  background-position: 0 -48px;
}

.icon-small-star-white {
  background-position: 0 -33px;
}

/*
 * Container for the grid items
 */
.hsl-2col:before, .hsl-2col:after,
.hsl-3col:before,
.hsl-3col:after,
.hsl-2col-rows:before,
.hsl-2col-rows:after,
.hsl-2col-bricks:before,
.hsl-2col-bricks:after {
  content: "";
  display: table;
}
.hsl-2col:after,
.hsl-3col:after,
.hsl-2col-rows:after,
.hsl-2col-bricks:after {
  clear: both;
}

/*
 * Apply the shared properties of grid items in a single, efficient ruleset.
 */
.panel-col-first,
.panel-col-second,
.panel-col-third,
.panel-col-fourth,
h2.pane-title,
h2.row-title {
  padding-left: 5px;
  padding-right: 5px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  word-wrap: break-word;
}

.page-panels #content {
  padding-left: 0;
  padding-right: 0;
}

/*
 * Picto item rows
 */
.hsl-picto-row-wrapper {
  padding: 0 !important;
}
.hsl-picto-row-wrapper:before, .hsl-picto-row-wrapper:after {
  content: "";
  display: table;
}
.hsl-picto-row-wrapper:after {
  clear: both;
}
.hsl-picto-row-wrapper .hsl-pane-1 .picto {
  clear: left;
  /* Span 1 column, starting in 1st column from left. */
  float: left;
  width: 50%;
  margin-left: 0%;
  margin-right: -50%;
  padding-left: 5px;
  padding-right: 5px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  word-wrap: break-word;
}
.hsl-picto-row-wrapper .hsl-pane-2 .picto {
  /* Span 1 column, starting in 2nd column from left. */
  float: left;
  width: 50%;
  margin-left: 50%;
  margin-right: -100%;
  padding-left: 5px;
  padding-right: 5px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  word-wrap: break-word;
}

/*
 * Bigger than medium breakpoint
 */
@media all and (min-width: 481px) {
  .hsl-2col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panel-pane, .hsl-2col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panels-ipe-portlet-wrapper, .hsl-2col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-rounded-corners-row-wrapper, .hsl-2col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-picto-row-wrapper, .hsl-2col > .panel-panel > .panel-pane, .hsl-2col > .panel-panel > .hsl-rounded-corners-row-wrapper, .hsl-2col > .panel-panel > .hsl-picto-row-wrapper,
  .hsl-2col-bricks > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panel-pane,
  .hsl-2col-bricks > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panels-ipe-portlet-wrapper,
  .hsl-2col-bricks > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-rounded-corners-row-wrapper,
  .hsl-2col-bricks > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-picto-row-wrapper,
  .hsl-2col-bricks > .panel-panel > .panel-pane,
  .hsl-2col-bricks > .panel-panel > .hsl-rounded-corners-row-wrapper,
  .hsl-2col-bricks > .panel-panel > .hsl-picto-row-wrapper,
  .hsl-2col-rows > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panel-pane,
  .hsl-2col-rows > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panels-ipe-portlet-wrapper,
  .hsl-2col-rows > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-rounded-corners-row-wrapper,
  .hsl-2col-rows > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-picto-row-wrapper,
  .hsl-2col-rows > .panel-panel > .panel-pane,
  .hsl-2col-rows > .panel-panel > .hsl-rounded-corners-row-wrapper,
  .hsl-2col-rows > .panel-panel > .hsl-picto-row-wrapper,
  .hsl-4col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panel-pane,
  .hsl-4col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panels-ipe-portlet-wrapper,
  .hsl-4col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-rounded-corners-row-wrapper,
  .hsl-4col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-picto-row-wrapper,
  .hsl-4col > .panel-panel > .panel-pane,
  .hsl-4col > .panel-panel > .hsl-rounded-corners-row-wrapper,
  .hsl-4col > .panel-panel > .hsl-picto-row-wrapper,
  .hsl-3col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panel-pane,
  .hsl-3col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .panels-ipe-portlet-wrapper,
  .hsl-3col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-rounded-corners-row-wrapper,
  .hsl-3col > .panel-panel > .panels-ipe-region > .panels-ipe-sort-container > .hsl-picto-row-wrapper,
  .hsl-3col > .panel-panel > .panel-pane,
  .hsl-3col > .panel-panel > .hsl-rounded-corners-row-wrapper,
  .hsl-3col > .panel-panel > .hsl-picto-row-wrapper {
    clear: left;
    float: left;
    width: 100%;
    margin-left: 0%;
    margin-right: -100%;
    padding-left: 5px;
    padding-right: 5px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    word-wrap: break-word;
  }
}