/**
 * GravityView Grid rules
 *
 * @package   GravityView
 * @author    Zack Katz <zack@katzwebservices.com>
 * @license   GPL2
 * @link      https://www.gravitykit.com
 * @copyright Copyright 2016, Katz Web Services, Inc.
 *
 * @since 1.17
 */

/* Responsive
--------------------------------------- */

@import "responsive";

/* GV Grid
--------------------------------------- */

.gv-grid,
.gv-grid .gv-grid-row {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  direction: $direction;
  text-align: $left;
  width: 100%;

	&:before,
	&:after {
		content: " ";
		display: table;
	}

	&:after {
		clear: both;
	}
}

.gv-grid:after {
  clear: both;
}

[class*='gv-grid-col-'] {
  float: $left;
  #{$padding-right}: 1em;
  min-height: 1px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  @include respond($mobile-portrait) {
    width: 100% !important;
    float: none;
  }

  @include respond($mobile-landscape) {
    width: 100% !important;
    float: none;
  }

}

.gv-grid-col-1-1 {
  width: 100%;
	padding-right: 0;
}

.gv-grid-col-1-3 {
  //width: 33.33%;
  width: (1/3) * 100%;
}

.gv-grid-col-2-3 {
  //width: 66.66%;
  width: (2/3) * 100%;
}

.gv-grid-col-1-2 {
  //width: 50%;
  width: (1/2) * 100%;
}

.gv-grid-col-1-4 {
  //width: 25%;
  width: (1/4) * 100%;
}

.gv-grid-col-1-6 {
  //width: 66.66%;
  width: (1/6) * 100%;
}

.gv-grid-col-1-8 {
  //width: 12.5%;
  width: (1/8) * 100%;
}


.gv-right {
  text-align: $right;
  display: block;
  .gv-right > div {
    float: $right;
  }
}

.gv-left {
  text-align: $left;
  display: block;
  .gv-right > div {
    float: $left;
  }
}

@media screen and ( max-width: 480px ) {
  [class*='gv-grid-col-'] {
    width: 100%;
  }
  .gv-right, .gv-left, .gv-right > div, .gv-left > div {
    float: none;
    text-align: $left;
  }
}
