/*
*******************************************************************
*
*   Author: Vlad Karpov
*   Version: Codeweapon CSS Grid v1.0.0 (http://codeweapon.com)
*   Copyright: 2017 codeweapon.com
*   Licensed: under MIT (https://codeweapon.com)
*   FileName: codeweapon-grid.css
*
*******************************************************************
*/

/*  Global                                                                                    */
/* ****************************************************************************************** */
/* ****************************************************************************************** */

* {
    /* global */
    /* apply to all elements */
    /* smart box model calculations */
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

html {
    font-size: 100%;
    box-sizing: border-box; 
}

body {
  margin: 0; 
}

/*  Clearfix                                                                                  */
/* ****************************************************************************************** */
/* ****************************************************************************************** */


.group::before, .group::after {
    content: ' ';
    display: table;
}

.group::after {
    clear: both;
}

/*  Containers                                                                                */
/* ****************************************************************************************** */
/* ****************************************************************************************** */

/* .container class doesn't have any margins or paddings. It's a clear zero container  */
/* .default-container has default padding and margin  */


.container-full {
    /* global */
    /* set container to full-width */
    width: 100%;
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
}

.container-full::before, .container-full::after {
    /* global */
    /* clearfix */
    content: ' ';
    display: table;
}

.container-full::after {
    /* global */
    /* clearfix */    
    clear: both;
}

@media (min-width: 1px) and (max-width: 767px) {
    /* global */
    /* on screens from 1px to 767px */
    /* give column 10px top & bottom padding */
    .container-full > [class*="grid-"] {
        padding-top: 10px;
        padding-bottom: 10px;
    }
}


/*  Rows
---------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------- */

.row {
    /* global */
    /* set width for all rows */
    /* center row */
    width: 90%;
    max-width: 1360px;
    margin-right: auto;
    margin-left: auto;
}

.row::before, .row::after {
    content: ' ';
    display: table;
}

.row::after {
    clear: both;
}

.row .row.collapse {
    /* remove gutters between rows */
    margin-left: 0;
    margin-right: 0;
}

.row .row {
    /* global */
    /* reset width on descendant rows */
    width: auto;
    margin-right: -15px;
    margin-left: -15px; 
}

/* GRID SECTION                                                                               */
/* ****************************************************************************************** */
/* ****************************************************************************************** */

[class*="grid"] {
    width: 100%;
    float: left;
    overflow-wrap: break-word; 
    padding-left: 15px;
    padding-right: 15px;
}

[class*="grid"]:last-child:not(:first-child) {
    /* float last column in the row */
    /* don't float if one single column in the row e.g grid-sm-12 */
    float: right;
}  

/* 
When it is single in the row
creates full width strip block 
Applies to the grid container
for example class="grid row" */
[class*="grid"].row.row {
  float: none; 
}

.row [class*="grid"].row.row {
  margin-right: 0;
  margin-left: 0;
  padding-right: 0;
  padding-left: 0; 
}


/*  (S) Grid
----------------------------------------------------------------------------- */

    .grid-sm-12 { width: 100.0000000%; }
    .grid-sm-11 { width: 91.66666667%; }
    .grid-sm-10 { width: 83.33333333%; }
    .grid-sm-9  { width: 75.00000000%; }
    .grid-sm-8  { width: 66.66666667%; }
    .grid-sm-7  { width: 58.33333333%; }
    .grid-sm-6  { width: 50.00000000%; }
    .grid-sm-5  { width: 41.66666667%; }
    .grid-sm-4  { width: 33.33333333%; }
    .grid-sm-3  { width: 25.00000000%; }
    .grid-sm-2  { width: 16.66666667%; }
    .grid-sm-1  { width: 8.333333333%; }


    /*  (S) Push & Pull
    -------------------------------------------------------- */
    .sm-push-1, .sm-push-2, .sm-push-3, .sm-push-4, .sm-push-5, .sm-push-6,
    .sm-push-7, .sm-push-8, .sm-push-9, .sm-push-10, .sm-push-11, .sm-push-12,
    .sm-pull-1, .sm-pull-2, .sm-pull-3, .sm-pull-4, .sm-pull-5, .sm-pull-6,
    .sm-pull-7, .sm-pull-8, .sm-pull-9, .sm-pull-10, .sm-pull-11, .sm-pull-12 {
        position: relative;
    }

    /*  (S) - Push
    -------------------------------------------------------- */

    .sm-push-1 { left: 8.33333%; }
    .sm-push-2 { left: 16.66667%; }
    .sm-push-3 { left: 25%; }
    .sm-push-4 { left: 33.33333%; }
    .sm-push-5 { left: 41.66667%; }
    .sm-push-6 { left: 50%; }
    .sm-push-7 { left: 58.33333%; }
    .sm-push-8 { left: 66.66667%; }
    .sm-push-9 { left: 75%; }
    .sm-push-10 { left: 83.33333%; }
    .sm-push-11 { left: 91.66667%; }

    /*  (S) Pull
    -------------------------------------------------------- */

    .sm-pull-1  { left: -8.33333%;  }
    .sm-pull-2  { left: -16.66667%; }
    .sm-pull-3  { left: -25%; }
    .sm-pull-4  { left: -33.33333%; }
    .sm-pull-5  { left: -41.66667%; }
    .sm-pull-6  { left: -50%; }
    .sm-pull-7  { left: -58.33333%; }
    .sm-pull-8  { left: -66.66667%; }
    .sm-pull-9  { left: -75%; }
    .sm-pull-10 { left: -83.33333%; }
    .sm-pull-11 { left: -91.66667%; }

    /*  (S) Offsets
    -------------------------------------------------------- */

    .sm-offset-0  { margin-left: 0%; }
    .sm-offset-1  { margin-left: 8.33333%; }
    .sm-offset-2  { margin-left: 16.66667%; }
    .sm-offset-3  { margin-left: 25%; }
    .sm-offset-4  { margin-left: 33.33333%; }
    .sm-offset-5  { margin-left: 41.66667%; }
    .sm-offset-6  { margin-left: 50%; }
    .sm-offset-7  { margin-left: 58.33333%; }
    .sm-offset-8  { margin-left: 66.66667%; }
    .sm-offset-9  { margin-left: 75%; }
    .sm-offset-10 { margin-left: 83.33333%; }
    .sm-offset-11 { margin-left: 91.66667%; }


/*  (M) Grid
----------------------------------------------------------------------------- */

@media screen and (min-width: 40em) { /* 40em = 640px */


    .grid-md-12 { width: 100.0000000%; }
    .grid-md-11 { width: 91.66666667%; }
    .grid-md-10 { width: 83.33333333%; }
    .grid-md-9  { width: 75.00000000%; }
    .grid-md-8  { width: 66.66666667%; }
    .grid-md-7  { width: 58.33333333%; }
    .grid-md-6  { width: 50.00000000%; }
    .grid-md-5  { width: 41.66666667%; }
    .grid-md-4  { width: 33.33333333%; }
    .grid-md-3  { width: 25.00000000%; }
    .grid-md-2  { width: 16.66666667%; }
    .grid-md-1  { width: 8.333333333%; }


    /*  (M) Push & Pull - overall styles
    -------------------------------------------------------- */
    .md-push-1, .md-push-2, .md-push-3, .md-push-4, .md-push-5, .md-push-6,
    .md-push-7, .md-push-8, .md-push-9, .md-push-10, .md-push-11, .md-push-12,
    .md-pull-1, .md-pull-2, .md-pull-3, .md-pull-4, .md-pull-5, .md-pull-6,
    .md-pull-7, .md-pull-8, .md-pull-9, .md-pull-10, .md-pull-11, .md-pull-12 {
        position: relative;
    }

    /*  (M) - Push
    -------------------------------------------------------- */

    .md-push-1 { left: 8.33333%; }
    .md-push-2 { left: 16.66667%; }
    .md-push-3 { left: 25%; }
    .md-push-4 { left: 33.33333%; }
    .md-push-5 { left: 41.66667%; }
    .md-push-6 { left: 50%; }
    .md-push-7 { left: 58.33333%; }
    .md-push-8 { left: 66.66667%; }
    .md-push-9 { left: 75%; }
    .md-push-10 { left: 83.33333%; }
    .md-push-11 { left: 91.66667%; }

    /*  (M) Pull
    -------------------------------------------------------- */

    .md-pull-1  { left: -8.33333%;  }
    .md-pull-2  { left: -16.66667%; }
    .md-pull-3  { left: -25%; }
    .md-pull-4  { left: -33.33333%; }
    .md-pull-5  { left: -41.66667%; }
    .md-pull-6  { left: -50%; }
    .md-pull-7  { left: -58.33333%; }
    .md-pull-8  { left: -66.66667%; }
    .md-pull-9  { left: -75%; }
    .md-pull-10 { left: -83.33333%; }
    .md-pull-11 { left: -91.66667%; }

    /*  (M) Offsets
    -------------------------------------------------------- */

    .md-offset-0  { margin-left: 0%; }
    .md-offset-1  { margin-left: 8.33333%; }
    .md-offset-2  { margin-left: 16.66667%; }
    .md-offset-3  { margin-left: 25%; }
    .md-offset-4  { margin-left: 33.33333%; }
    .md-offset-5  { margin-left: 41.66667%; }
    .md-offset-6  { margin-left: 50%; }
    .md-offset-7  { margin-left: 58.33333%; }
    .md-offset-8  { margin-left: 66.66667%; }
    .md-offset-9  { margin-left: 75%; }
    .md-offset-10 { margin-left: 83.33333%; }
    .md-offset-11 { margin-left: 91.66667%; }

}

/*  (L) Grid
----------------------------------------------------------------------------- */

@media (min-width: 70em) { /* 64em = 1024px */


    .grid-lg-12 { width: 100.0000000%; }
    .grid-lg-11 { width: 91.66666667%; }
    .grid-lg-10 { width: 83.33333333%; }
    .grid-lg-9  { width: 75.00000000%; }
    .grid-lg-8  { width: 66.66666667%; }
    .grid-lg-7  { width: 58.33333333%; }
    .grid-lg-6  { width: 50.00000000%; }
    .grid-lg-5  { width: 41.66666667%; }
    .grid-lg-4  { width: 33.33333333%; }
    .grid-lg-3  { width: 25.00000000%; }
    .grid-lg-2  { width: 16.66666667%; }
    .grid-lg-1  { width: 8.333333333%; }


    /*  (L) Push & Pull
    -------------------------------------------------------- */
    .lg-push-1, .lg-push-2, .lg-push-3, .lg-push-4, .lg-push-5, .lg-push-6,
    .lg-push-7, .lg-push-8, .lg-push-9, .lg-push-10, .lg-push-11, .lg-push-12,
    .lg-pull-1, .lg-pull-2, .lg-pull-3, .lg-pull-4, .lg-pull-5, .lg-pull-6,
    .lg-pull-7, .lg-pull-8, .lg-pull-9, .lg-pull-10, .lg-pull-11, .lg-pull-12 {
        position: relative;
    }

    /*  (L) - Push
    -------------------------------------------------------- */

    .lg-push-1 { left: 8.33333%; }
    .lg-push-2 { left: 16.66667%; }
    .lg-push-3 { left: 25%; }
    .lg-push-4 { left: 33.33333%; }
    .lg-push-5 { left: 41.66667%; }
    .lg-push-6 { left: 50%; }
    .lg-push-7 { left: 58.33333%; }
    .lg-push-8 { left: 66.66667%; }
    .lg-push-9 { left: 75%; }
    .lg-push-10 { left: 83.33333%; }
    .lg-push-11 { left: 91.66667%; }

    /*  (L) Pull
    -------------------------------------------------------- */

    .lg-pull-1  { left: -8.33333%;  }
    .lg-pull-2  { left: -16.66667%; }
    .lg-pull-3  { left: -25%; }
    .lg-pull-4  { left: -33.33333%; }
    .lg-pull-5  { left: -41.66667%; }
    .lg-pull-6  { left: -50%; }
    .lg-pull-7  { left: -58.33333%; }
    .lg-pull-8  { left: -66.66667%; }
    .lg-pull-9  { left: -75%; }
    .lg-pull-10 { left: -83.33333%; }
    .lg-pull-11 { left: -91.66667%; }

    /*  (L) Offset
    -------------------------------------------------------- */

    .lg-offset-0  { margin-left: 0%; }
    .lg-offset-1  { margin-left: 8.33333%; }
    .lg-offset-2  { margin-left: 16.66667%; }
    .lg-offset-3  { margin-left: 25%; }
    .lg-offset-4  { margin-left: 33.33333%; }
    .lg-offset-5  { margin-left: 41.66667%; }
    .lg-offset-6  { margin-left: 50%; }
    .lg-offset-7  { margin-left: 58.33333%; }
    .lg-offset-8  { margin-left: 66.66667%; }
    .lg-offset-9  { margin-left: 75%; }
    .lg-offset-10 { margin-left: 83.33333%; }
    .lg-offset-11 { margin-left: 91.66667%; }

}

/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&*/
/*              Media Queries            */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&*/ 


/*  Mobile Classes
---------------------------------------------------------------------------------------------
--------------------------------------------------------------------------------------------- */

/*@media (min-width: 1px) and (max-width: 767px)  {
    .hide-mobile {
        display: none;
    }    
}*/