/******LESS FOOTPRINT GRID SYSTEM******
**************************************/


.grid,
.unit { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }



/* Set up some rules to govern the grid */
.grid { display: block; clear: both; }
.grid .unit { float: left; width: 100%; padding: 10px; }



/* This ensures the outer gutters are equal to the (doubled) inner gutters. */
.grid .unit:first-child { /*padding-left: 20px;*/ }
.grid .unit:last-child { /*padding-right: 20px;*/ }



/* Nested grids already have padding though, so let's nuke it */
.unit .unit:first-child { padding-left: 0; }
.unit .unit:last-child { padding-right: 0; }



.unit .grid:first-child > .unit { padding-top: 0; }
.unit .grid:last-child > .unit { padding-bottom: 0; }



/* Let people nuke the gutters/padding completely in a couple of ways */
.no-gutters .unit,
.unit.no-gutters { padding: 0 !important; }



/* Wrapping at a maximum width is optional */
.wrap .grid,
.grid.wrap { max-width: 1180px; margin: 0 auto; }


body.page-template-full-width div.wrapper > div.wrap { max-width: none; }
body.page-template-full-width div.wrapper > div.wrap > div#primary { padding: 0px; }
body.page-template-full-width div.entry-content { margin: 0px; }
 

 /****************DEFAULT GRID****************/
.grid .w-1-1 { width: 100%; }

.grid .w-1-2 { width: 50%; }

.grid .w-1-3 { width: 33.3332%; }

.grid .w-2-3 { width: 66.6665%; }

.grid .w-1-4 { width: 25%; }

.grid .w-3-4 { width: 75%; }

.grid .w-1-5 { width: 20%; }

.grid .w-2-5 { width: 40%; }

.grid .w-3-5 { width: 60%; }

.grid .w-4-5 { width: 80%; }  
 
 
 
 /****************CUSTOMIZED GRID****************/
 
 .grid .p5 { width :5%; }  
 
 .grid .p10 { width: 10%; }   
 
 .grid .p15 { width: 15%; }  
 
  .grid .p17 { width: 17%; } 
 
 .grid .p20 { width: 20%; }  
 
 .grid .p25 { width: 25%; }  
 
 .grid .p30 { width: 30%; }  
 
 .grid .p35 { width: 35%; }  
 
 .grid .p40 { width: 40%; }  
 
 .grid .p45 { width: 45%; }  
 
 .grid .p50 { width: 50%; }  
 
 .grid .p55{ width: 55%; }  
 
 .grid .p60 { width: 60%; }  
 
 .grid .p65 { width: 65%; }  
 
 .grid .p70 { width: 70%; }  
 
 .grid .p75 { width: 75%; }  
 
 .grid .p80 { width: 80%; }  
 
.grid .p83  { width: 83%; }  
 
 .grid .p85 { width: 85%; }  
 
 .grid .p90 { width: 90%; }  
 
 .grid .p95 { width: 95%; }  
 
 .grid .p100 { width: 100%; }  
 
 

/* Clearfix after every .grid */

.grid { *zoom: 1; }
.grid:after { clear: both; }
.grid:before,
.grid:after { display: table; content: ""; line-height: 0; }


/* Utility classes */
.align-center { text-align: center; }
.align-left   { text-align: left; }
.align-right  { text-align: right; }

.pull-left    { float: left; }
.pull-right   { float: right; }



/* Responsive Stuff */
@media screen and (max-width: 768px) {

    /* Stack anything that isn’t full-width on smaller screens */
    .main-navigation ul { margin-left: 0; }
	.main-navigation ul li { float: none; text-align: center; }
	

    .grid .unit { width: 100% !important; } /*padding-left: 20px; padding-right: 20px;*/

    .unit .grid .unit { padding-left: 0px; padding-right: 0px; }

    /* Sometimes, you just want to be different on small screens */
    .center-on-mobiles { text-align: center !important; }


}

/* Expand the wrap a bit further on larger screens */
@media screen and (min-width: 1180px) {
    .wider .grid { max-width: 1180px; margin: 0 auto; }
}

.grid,
.unit { -webkit-transition: all .25s ease-in-out; -moz-transition: all .25s ease-in-out; transition: all .25s ease-in-out; }

/* *** End of Custom Grid *** */