@@ -13,6 +13,11 @@ $color-text: #000000;

 $color-link: #878787;

 /**

+ * Gutters

+ */

+$gutter-default: 1 / 960 * 30 * 100%;

+

+/**

  * Font sizes and defaults

  */

 $font-size-default: 16px;

@@ -14,16 +14,20 @@

  * Mixins

  */

-@mixin font-awesome {

+@mixin iconfont {

   display: inline-block;

-  font: normal normal normal 14px/1 FontAwesome;

-  font-size: inherit;

-  text-rendering: auto;

+  font-family: 'icomoon' !important;

+  speak: none;

+  font-style: normal;

+  font-weight: normal;

+  font-variant: normal;

+  text-transform: none;

+  line-height: 1;

   -webkit-font-smoothing: antialiased;

   -moz-osx-font-smoothing: grayscale;

 }

-@mixin fa-text-replacement($height, $width) {

+@mixin icon-text-replacement($height, $width) {

   height: $height;

   width: $width;

   padding: 0;

@@ -37,6 +41,26 @@

   position: relative;

 }

+@mixin cf {

+  &:before,

+  &:after {

+    content: " "; /* 1 */

+    display: table; /* 2 */

+  }

+

+  &:after {

+    clear: both;

+  }

+

+  /**

+   * For IE 6/7 only

+   * Include this rule to trigger hasLayout and contain floats.

+   */

+  & {

+    *zoom: 1;

+  }

+}

+

 /**

  * Hide invisible elements

  */

@@ -75,23 +99,7 @@ img {

 .block,

 #container,

 .inside {

-  &:before,

-  &:after {

-	content: " "; /* 1 */

-	display: table; /* 2 */

-  }

-

-  &:after {

-	clear: both;

-  }

-

-  /**

-   * For IE 6/7 only

-   * Include this rule to trigger hasLayout and contain floats.

-   */

-  & {

-	*zoom: 1;

-  }

+  @include cf;

 }

 @if $load-holy-grail-layout {

@@ -116,8 +124,11 @@ img {

  * Standards

  */

-body {

+html, body {

   font: $font-size-default/$line-height-default $font-family;

+}

+

+body {

   font-weight: $font-weight-default;

   color: $color-text;

 }

@@ -18,6 +18,8 @@ $button-text-color: #ffffff;

 $button-background-color: #2f67b7;

 $button-border-color: #082054;

 $background-color-ro: #eeeeee;

+$placeholder-color: #9c8152;

+$field-color: #9c8152;

 // Sizes & Paddings

 $field-padding: 3px 6px;

@@ -29,6 +31,9 @@ $button-border-width: 2px;

 $font-size-field: 16px;

+// Font

+$font-family-form: "Noto Serif", Arial, Helvetica, FreeSans, sans-serif;

+

 /**

  * Since fieldset borders are removed in the reset style sheet, adjust the

  * legends accordingly

@@ -47,7 +52,26 @@ select {

   line-height: 150%;

   outline: none;

   font-size: $font-size-field;

-  font-family: inherit;

+  font-family: $font-family-form;

+}

+

+/**

+ * Placeholders

+ */

+::-webkit-input-placeholder {

+  color: $placeholder-color;

+}

+

+:-moz-placeholder { /* Firefox 18- */

+  color: $placeholder-color;

+}

+

+::-moz-placeholder {  /* Firefox 19+ */

+  color: $placeholder-color;

+}

+

+:-ms-input-placeholder {

+  color: $placeholder-color;

 }

 /**

@@ -65,6 +89,7 @@ input[type="number"], input[type="search"], input[type="tel"], input[type="time"

   @include box-shadow(inset 0 1px 1px $shadow-color);

   @include transition(all .15s linear);

   @include box-sizing(border-box);

+  color: $field-color;

   &:focus {

     outline: 0;

@@ -174,11 +199,24 @@ input[type="submit"], .button, button {

  * Optional button styles

  */

 .button_block input[type="submit"],

-.button_block button {

+.button_block button,

+button.button_block,

+.button_block.button {

   display: block;

   width: 100%;

 }

+.button_small input[type="submit"],

+.button_small button,

+button.button_small,

+.button_small.button {

+  height: 30px;

+}

+

+a.button_small.button {

+  line-height: 30px;

+}

+

 /**

  * Checkbox

  */