clea,

sites/all/themes/gui/materiobasetheme/less/fonts.scss

@@ -1,7 +1,6 @@
+@mixin ubuntu(){font-family: "Ubuntu", Arial, "MS Trebuchet", sans-serif; @include fs500(); @include normal;}
 
-.ubuntu(){font-family: "Ubuntu", Arial, "MS Trebuchet", sans-serif; .500; .normal;}
-
-body{font-size:16px; .ubuntu; line-height:1.3;}
+body{font-size:16px; @include ubuntu; line-height:1.3;}
 
 a{color: #007BC2; text-decoration: none;}
 
@@ -12,14 +11,14 @@ h4{font-size:1.3em;}
 h5{font-size:1.2em;}
 h6{font-size:1.1em;}
 
-input, button, select, textarea{.ubuntu();}
+input, button, select, textarea{@include ubuntu();}
 
-.22(){
+@mixin fs22(){
 	font-size:22px;
 }
 
 #footer{
   #footer-bottom{ text-align: center;}
-  #footer-bottom .block{ .8;}
+  #footer-bottom .block{ @include fs8;}
   
 }

sites/all/themes/gui/materiobasetheme/less/misc.scss

@@ -1,6 +1,6 @@
 
 //** Messages. */
-.messages(){
+@mixin messages(){
   padding: 9px;
   margin: 0.5em 0 0;
   color: #3a87ad;//#360;
@@ -9,7 +9,7 @@
   -moz-border-radius: 5px;
     -webkit-border-radius: 5px;
     border-radius: 5px;
-    .12;
+    @include fs12();
 
   &.warning {
     color: #c09853;//#840;
@@ -28,27 +28,27 @@
     color: #468847;//#036;
     background-color: #dff0d8;//#bdf;
     border-color:#d6e9c6;//#ace;
-    .14;
+    @include fs14();
   }
 
 }
 
-div.messages { .messages();}
+div.messages { @include messages();}
 
 .messages-label{display:none;}
 
 #better-messages-wrapper{
-  background-color: rgba(255,255,255,0.7); .p(10px); .rounded(5px); .drop-shadow(0, 0, 6px, 0.4);
+  background-color: rgba(255,255,255,0.7); @include p(10px); @include rounded(5px); @include drop-shadow(0, 0, 6px, 0.4);
   #better-messages-default{
 
     div.messages{
-      .messages(); margin:0 0 10px 0;
+      @include messages(); margin:0 0 10px 0;
     }
     .footer{
       border:none; padding:0; margin:0;
       a.message-close{
         background: #fff url('../img/close.png') no-repeat center center;
-        width:15px; height:15px; .rounded(3px); display:block;
+        width:15px; height:15px; @include rounded(3px); display:block;
 
       }
     }
@@ -128,43 +128,43 @@ div.messages { .messages();}
 /**
 * icons
 */
-.icon(@w, @x, @y, @color : #fff){
+@mixin icon($w, $x, $y, $color : #fff){
   background-image: url('../img/sprite.png');
-  width:@w; height:@w; line-height:@w;
-  background-position: @x @y ;
-  background-color: @color;
+  width:$w; height:$w; line-height:$w;
+  background-position: $x $y ;
+  background-color: $color;
 }
 // [class^="icon-materio-viewmode-"], [class*=" icon-materio-viewmode-"]{
 //   .icon(20px);
 // }
 
 i.icon-materio-viewmode-cardsmall{
-  .icon(20px, -42px, 0);
-  &.active{.icon(21px, 0, 0); }
-  &:hover:not(.active){.icon(21px, -21px, 0); }
+  @include icon(20px, -42px, 0);
+  &.active{@include icon(21px, 0, 0); }
+  &:hover:not(.active){@include icon(21px, -21px, 0); }
 }
 i.icon-materio-viewmode-cardmedium{
-  .icon(21px, -42px, -21px);
-  &.active{.icon(21px, 0, -21px); }
-  &:hover:not(.active){.icon(21px, -21px, -21px); }
+  @include icon(21px, -42px, -21px);
+  &.active{@include icon(21px, 0, -21px); }
+  &:hover:not(.active){@include icon(21px, -21px, -21px); }
 }
 i.icon-materio-viewmode-cardbig{
-  .icon(21px, -42px, -42px);
-  &.active{.icon(21px, 0, -42px); }
-  &:hover:not(.active){.icon(21px, -21px, -42px); }
+  @include icon(21px, -42px, -42px);
+  &.active{@include icon(21px, 0, -42px); }
+  &:hover:not(.active){@include icon(21px, -21px, -42px); }
 }
 i.icon-materio-viewmode-cardfull{
-  .icon(21px, -42px, -63px);
-  &.active{.icon(21px, 0, -63px); }
-  &:hover:not(.active){.icon(21px, -21px, -63px); }
+  @include icon(21px, -42px, -63px);
+  &.active{@include icon(21px, 0, -63px); }
+  &:hover:not(.active){@include icon(21px, -21px, -63px); }
 }
 
 i.icon-materio-search{
-  .icon(21px, -63px, -63px);
+  @include icon(21px, -63px, -63px);
 }
 
 i.icon-materio-folder{
-  .icon(21px, -84px, -63px);
+  @include icon(21px, -84px, -63px);
 }
 
 
@@ -219,7 +219,7 @@ a:hover {
 
 /** COLORBOX */
 #colorbox{
-  .rounded; .drop-shadow(0, 0, 5px, 0.4);
+  @include rounded; @include drop-shadow(0, 0, 5px, 0.4);
   #cboxLoadedContent{ background-color: #fff; }
 }
 
@@ -227,10 +227,10 @@ a:hover {
 /** embed player */
 .embedded-video{
   .player iframe{
-    @media @max-768{
-      max-width:100%;
-      height:auto;
-    }
+    // @media @max-768{
+    //   max-width:100%;
+    //   height:auto;
+    // } change this
   }
 }
 

sites/all/themes/gui/materiobasetheme/less/styles.scss

@@ -89,7 +89,7 @@
 }
 
 @mixin bouton(){
-  // .16; change this
+  @include fs16();
   font-weight:bold;
   @include p(0.1em 0.3em 0.2em); @include rounded(0.3em);
   border: 2px solid #ccc; @include bgc(#ccc); color:#4D4D4D; // blanc/bleu
@@ -119,9 +119,9 @@
     @include transition-simply-prefix(margin-left 0.3s ease-out);
     .column-switcher{
       display:inline-block; @include rounded(3px); color:#fff; background-color: #3e3e3e; vertical-align:middle;
-      // .700; .22; change this
+      @include fs700(); @include fs22;
       @include p(0.05em 0.15em 0.2em 0.2em); line-height:0.5; 
-      // .regular;change this
+      @include regular;
       &.prev-column{cursor: w-resize;}
       &.next-column{cursor: e-resize;}
     }
@@ -165,7 +165,7 @@ $headerouterheight:$headerheight+$headerpaddingtop+$headerpaddingbottom;
 
   .logo{
     //width:210px; //padding-left:5px; //margin-left:50px;
-    // .inlineblock; change this
+    @include inlineblock;
     h1{
       margin:0; 
       //.36; change this