﻿/*=========------___OBJECTS___------=========*/
/*for example*/
.o-layout-grid {
  display: grid; }

.o-layout-grid__columns {
  display: grid;
  grid-auto-flow: columns; }

.o-layout-grid__rows {
  display: grid;
  grid-auto-flow: columns; }

.o-Container__24 {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  grid-auto-flow: row;
  height: calc(100% - 42px); }

@media screen and (min-width: 768px) {
  .o-Container__24 {
    display: grid;
    grid-template-columns: repeat(24, 1fr);
    grid-template-rows: auto;
    grid-auto-flow: row;
    height: calc(100% - 50px); } }

.o-Container-left__24 {
  grid-column-start: 1;
  grid-column-end: 25; }

.o-Container-right__24 {
  grid-column-start: 1;
  grid-column-end: 25; }

@media screen and (min-width: 768px) {
  .o-Container-left__24 {
    grid-column-start: 1;
    grid-column-end: 6; }
  .o-Container-right__24 {
    grid-column-start: 6;
    grid-column-end: 25; } }

@media screen and (min-width: 992px) {
  .o-Container-left__24 {
    grid-column-start: 1;
    grid-column-end: 5; }
  .o-Container-right__24 {
    grid-column-start: 5;
    grid-column-end: 25; } }

@media screen and (min-width: 1200px) {
  .o-Container-left__24 {
    grid-column-start: 1;
    grid-column-end: 4; }
  .o-Container-right__24 {
    grid-column-start: 4;
    grid-column-end: 25; } }

