/** 
 * CSS Style: Theme grid 
 * 
 * @since 1.0
 */

/**
 * Theme footer down 
 * 
 * @since 1.0
 */
.theme-wrap {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    /*max-width: 1600px;*/
    margin: 0 auto;
}

main {
    flex: 1;
    padding-top: calc( var(--theme-padding) * 2 );
    padding-bottom: calc( var( --theme-padding ) * 2 );
    background-color: #ffffff;
}

.home main, .search main {
    background-color: var( --theme-color-background );
}

/**
 * Theme wrap 
 * 
 * @since 1.0
 */
/*@media only screen and (max-width: 1100px) {
    .theme-wrap {
        max-width: 924px;
    }
}

@media only screen and (max-width: 1024px) {
    .theme-wrap {
        max-width: 768px;
    }
}

@media only screen and (max-width: 768px) {
    .theme-wrap {
        max-width: 560px;
    }
}*/

/**
 * Theme grid 
 * 
 * @since 1.0
 */
.theme-grid {
    margin: 0 auto;
}

.theme-grid > .theme-grid-row {
    max-width: 1200px; 
    margin: 0 auto;
    padding: 0 var( --theme-padding );
}

/**
 * Grid Widget 
 *
 * @since 1.0.0 !!!!!!
 */
.theme-grid-widget {
    margin-bottom: var( --theme-margin );
}

/** 
 * Theme row
 * 
 * @since 1.0
 */
.theme-grid-row {
    display: flex;
    flex-wrap: wrap;
}

.theme-grid-row-reverse {
    flex-direction: row-reverse;
}

/** 
 * Theme col
 * 
 * @since 1.0
 */
.theme-grid-col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
    width: 100%;
}

.theme-grid-col-reverse {
    flex-direction: column-reverse;
}

.theme-grid-col-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
}

.theme-grid-col-1 {
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
}

.theme-grid-col-2 {
  flex: 0 0 12.5%;
  max-width: 12.5%;
}

.theme-grid-col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

.theme-grid-col-sidebar {
  flex: 0 0 25%;
  max-width: 25%;
}

.theme-grid-col-4 {
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.theme-grid-col-5 {
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}

.theme-grid-col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

.theme-grid-col-7 {
  flex: 0 0 58.333334%;
  max-width: 58.333334%;
}

.theme-grid-col-8 {
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
}

.theme-grid-col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

.theme-grid-col-10 {
  flex: 0 0 83.333334%;
  max-width: 83.333334%;
}

.theme-grid-col-11 {
  flex: 0 0 91.666666%;
  max-width: 91.666666%;
}

.theme-grid-col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

/**
 * justify-content 
 * 
 * @since 1.0
 */
.theme-justify-content-start {
  justify-content: flex-start;
}

.theme-justify-content-end {
  justify-content: flex-end;
}

.theme-justify-content-center {
  justify-content: center;
}

.theme-justify-content-between {
  justify-content: space-between;
}

.theme-justify-content-around {
  justify-content: space-around;
}

/**
 * align-items 
 * 
 * @since 1.0
 */
.theme-align-items-start {
  align-items: flex-start;
}

.theme-align-items-end {
  align-items: flex-end;
}

.theme-align-items-center {
  align-items: center;
}

.theme-align-items-baseline {
  align-items: baseline;
}

.theme-align-items-stretch {
  align-items: stretch;
}

/**
 * align-self 
 * 
 * @since 1.0
 */
.theme-align-self-start {
  align-self: flex-start;
}

.theme-align-self-end {
  align-self: flex-end;
}

.theme-align-self-center {
  align-self: center;
}

.theme-align-self-baseline {
  align-self: baseline;
}

.theme-align-self-stretch {
  align-self: stretch;
}

/**
 * align-content 
 * 
 * @since 1.0
 */
.theme-align-content-start {
  align-content: flex-start;
}

.theme-align-content-end {
  align-content: flex-end;
}

.theme-align-content-center {
  align-content: center;
}

.theme-align-content-between {
  align-content: space-between;
}

.theme-align-content-around {
  align-content: space-around;
}

.theme-align-content-stretch {
  align-content: stretch;
}

/**
 * overflow 
 * 
 * @since 1.0
 */
.theme-overflow-hidden {
  overflow: hidden;
}