//these are the main variables used in the sass file



// G R I D 

$grid_width : 100% // grid width %
$grid_max_width : 100% // max width
$grid_cols : 12 // cols number
$grid_gut : 2.5% // gut width %
$grid_col : ($grid_width - ($grid_gut * ($grid_cols - 1))) / $grid_cols
$class-col : col !default 

.col
	float: left
	margin: 0 $grid_gut 0 0
	+box-sizing(border-box)
	@extend .clear-fix
	&.last
		margin-right: 0
@for $i from 1 through $grid_cols
	$j: $i - 1
	.#{$class-col}-#{$i}
		width: ($i * $grid_col) + ($j * $grid_gut)


// vars used for the website

$site-width : $grid_max_width
$gut-width : $grid_gut
$space : 1rem
// colors

$light-grey: #e9e9e9
$dark-blue: #38434E
$color-yellow: #E6953C
$color-pink: #BF6B6C
$color-green: #B4C669 
$color-red: #EF5D43 
$color-blue: #00AA8B
$dark-grey : #444

$main-color-light: #aaa
$main-color-dark: #596073
$main-color-color: $color-green
$main-background-color: $light-grey 

$bloc-background-color: white
$background-light: lighten($main-background-color, 4% )

$defaut-font-color: $dark-grey

$global-font-size : 15px
$main-font-size : 1rem
$main-line-height  :  1.4rem


/* FONTS */

$main-font-family: "Roboto", sans-serif
$symbol-font-family: "fontello"
$serif-font-family: "Droid", serif