/*
	Variable Grid System.
	Learn more ~ http://www.spry-soft.com/grids/
	Based on 960 Grid System - http://960.gs/

	Licensed under GPL and MIT.
*/

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


body .wrapper {
	width: 80%;
	overflow: hidden;
}
@media (max-width: 960px){
	body .wrapper {
		width: 88%;
	}	
}
@media (max-width: 720px){
	body .wrapper {
		width: 90%;
	}	
}
@media (max-width: 640px){
	body .wrapper {
		width: 96%;
	}	
}




/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 {
	margin: 0 auto;
	padding: 0 0;
	width: 100%;
	max-width:100%; /* ie10 11 fix */
	text-align: center;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	position: relative;
	
		/* display flex if possible */
	  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	  display: -webkit-flex;     /* NEW - Chrome */
	  display: -ms-flexbox;      /* TWEENER - IE 10 */
	  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	
	-webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	flex-flow: row wrap;
	
	/* horizontal distibution */
    -webkit-box-pack: left;
    -moz-box-pack: left;
    -webkit-justify-content: left;
    -ms-flex-pack: left;
    justify-content: left;
	
	/* vertical distibution */
	-webkit-align-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    
    /* vertical sizing */
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    
 }



/* Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_item.fullbleed img {
	width: 100% !important;
	height: auto !important;
}
.grid_item img.aligncenter,
.grid_item p img.aligncenter{
	width: auto !important;
	max-width: 90%;
	height: auto;
	margin: 0 auto;
	text-align: center;
}
.grid_item a.block_link img{
	display: block;
}


.grid_auto,
.grid_item {
  display: block;
  vertical-align: top;
  float: left;
  position: relative;
  
  padding: 0.7vw;
  margin: 0 0;
   
  -webkit-box-ordinal-group: 1;
  -moz-box-ordinal-group: 1;
  -webkit-order: 0;
  -ms-flex-order: 0;
  order: 0;
  
  -webkit-flex-shrink: 0; 
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
      
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
    
  /* to test and check */
 ___border: thin #ddd dotted;
 ___min-height: 15px;
}

.container_12 .grid_no_space{
	padding: 0 0 0 0;
}


/* Grid >> 12 Columns 100/12 = 8.33%
----------------------------------------------------------------------------------------------------*/
.container_12 .grid_auto {
	width: auto;
	flex-grow: 1 !important;
	flex-shrink: 1 !important;
	flex-basis: auto;
}

.container_12 .grid_1 {
	width: 8.33%;
	flex-basis: auto;
}

.container_12 .grid_2 {
	width: 16.66%;
	flex-basis: auto;
}

.container_12 .grid_3 {
	width: 25%;
	flex-basis: auto;
}

.container_12 .grid_4 {
	width: 33.33%;
	flex-basis: auto;
}

.container_12 .grid_5 {
	width: 41.66%;
	flex-basis: auto;
}

.container_12 .grid_6 {
	width: 50%;
	flex-basis: auto;
}

.container_12 .grid_7 {
	width: 58.33%;
	flex-basis: auto;
}

.container_12 .grid_8 {
	width: 66.66%;
	flex-basis: auto;
}

.container_12 .grid_9 {
	width: 75%;
	flex-basis: auto;
}

.container_12 .grid_10 {
	width: 83.33%;
	flex-basis: auto;
}

.container_12 .grid_11 {
	width: 91.66%;
	flex-basis: auto;
}

.container_12 .grid_12 {
	width: 100%;
	flex-basis: auto;
}

@media (max-width: 1200px){
	.index .grid_item:first-of-type h3{
		margin-bottom: 5px;
	}
	.index .grid_item:first-of-type p{
		font-size: 1em;
	}
}
@media (max-width: 880px){
	.index .grid_item:first-of-type h3{
		margin-bottom: 3px;
	}
	.index .grid_item:first-of-type p{
		font-size: 0.9em;
	}
}
@media (max-width: 840px){
	.index .grid_item:first-of-type h3{
		margin-bottom: 4px;
	}
	.index .grid_item:first-of-type{
		width: 50%;
	}
}
@media (max-width: 510px){
	.index .grid_item:first-of-type{
		width: 75%;
	}
}
@media (max-width: 440px){
	.index .grid_item:first-of-type{
		width: 100%;
	}
}



@media (max-width: 680px){
	.grid_item.grid_9,.grid_item.grid_3{
		width: 50%;
	}
	.grid_item.grid_7{
		width: 50%;
	}
	.grid_item.spacer{
		display: none;
	}
}
@media (max-width: 580px){
	.grid_item.grid_9,.grid_item.grid_3{
		width: 100%;
	}
	.grid_item.grid_7{
		width: 100%;
	}
	.grid_item{
		order: 3;
	}
	.grid_item.title_wrap{
		width: 100%;
		order: 0;
		float: none;
	}
	.grid_item.image_wrap{
		width: 100%;
		order: 1;
		float: none;
	}
	.grid_item.title_box{
		width: 100%;
		order: 1;
	}
}

/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}
.clearfix {
}

* html .clearfix {
	height: 1%;
}