diff --git a/Sankore_3.1.pro b/Sankore_3.1.pro
index 5f1a5b9e..fcc3143b 100644
--- a/Sankore_3.1.pro
+++ b/Sankore_3.1.pro
@@ -11,7 +11,7 @@ CONFIG += debug_and_release \
 VERSION_MAJ = 2
 VERSION_MIN = 00 
 VERSION_TYPE = b # a = alpha, b = beta, r = release, other => error
-VERSION_PATCH = 08
+VERSION_PATCH = 09
 
 VERSION = "$${VERSION_MAJ}.$${VERSION_MIN}.$${VERSION_TYPE}.$${VERSION_PATCH}"
 VERSION = $$replace(VERSION, "\\.r", "")
diff --git a/plugins/cffadaptor/src/UBCFFAdaptor.cpp b/plugins/cffadaptor/src/UBCFFAdaptor.cpp
index 5630c01d..f5c84068 100644
--- a/plugins/cffadaptor/src/UBCFFAdaptor.cpp
+++ b/plugins/cffadaptor/src/UBCFFAdaptor.cpp
@@ -550,8 +550,8 @@ QDomElement UBCFFAdaptor::UBToCFFConverter::parsePage(const QString &pageFileNam
                 pageFile.close();
                 return QDomElement();
             }
-        } else if (tagname == tUBZGroup) {
-            group = parseGroupPageSection(nextTopElement);
+        } else if (tagname == tUBZGroups) {
+            group = parseGroupsPageSection(nextTopElement);
             if (group.isNull()) {
                 qDebug() << "Page doesn't contains any groups.";
                 pageFile.close();
@@ -634,6 +634,7 @@ QDomElement UBCFFAdaptor::UBToCFFConverter::parseSvgPageSection(const QDomElemen
         else if (tagName == tUBZLine)          parseUBZLine(nextElement, svgElements);
         else if (tagName == tUBZPolygon)       parseUBZPolygon(nextElement, svgElements);
         else if (tagName == tUBZPolyline)      parseUBZPolyline(nextElement, svgElements);
+        else if (tagName == tUBZGroups)        parseGroupsPageSection(nextElement);
 
         nextElement = nextElement.nextSiblingElement();
     }
@@ -694,12 +695,34 @@ bool UBCFFAdaptor::UBToCFFConverter::writeExtendedIwbSection()
 // extended element options
 // editable, background, locked are supported for now
 
-QDomElement UBCFFAdaptor::UBToCFFConverter::parseGroupPageSection(const QDomElement &element)
+QDomElement UBCFFAdaptor::UBToCFFConverter::parseGroupsPageSection(const QDomElement &groupRoot)
 {
 //    First sankore side implementation needed. TODO in Sankore 1.5
-    Q_UNUSED(element)
+    if (!groupRoot.hasChildNodes()) {
+        qDebug() << "Group root is empty";
+        return QDomElement();
+    }
+
+    QDomElement groupElement = groupRoot.firstChildElement();
+
+    while (!groupElement.isNull()) {
+        QDomElement extendedElement = mDataModel->createElementNS(iwbNS, groupElement.tagName());
+        QDomElement groupChildElement = groupElement.firstChildElement();
+        while (!groupChildElement.isNull()) {
+            QDomElement extSubElement = mDataModel->createElementNS(iwbNS, groupChildElement.tagName());
+            extSubElement.setAttribute(aRef, groupChildElement.attribute(aID, QUuid().toString()));
+            extendedElement.appendChild(extSubElement);
+
+            groupChildElement = groupChildElement.nextSiblingElement();
+        }
+
+        mExtendedElements.append(extendedElement);
+
+        groupElement = groupElement.nextSiblingElement();
+    }
+
     qDebug() << "parsing ubz group section";
-    return QDomElement();
+    return groupRoot;
 }
 
 QString UBCFFAdaptor::UBToCFFConverter::getDstContentFolderName(const QString &elementType)
@@ -1250,6 +1273,19 @@ bool UBCFFAdaptor::UBToCFFConverter::setCFFAttribute(const QString &attributeNam
         {
             setGeometryFromUBZ(ubzElement, svgElement);
         }
+        else
+            if (attributeName.contains(aUBZUuid))
+            {
+
+                QString parentId = ubzElement.attribute(aUBZParent);
+                QString id;
+                if (!parentId.isEmpty())
+                    id = "{" + parentId + "}" + "{" + ubzElement.attribute(aUBZUuid)+"}";
+                else
+                    id = "{" + ubzElement.attribute(aUBZUuid)+"}";
+
+                svgElement.setAttribute(aID, id);
+            }
         else 
             if (attributeName.contains(aUBZHref)||attributeName.contains(aSrc))
             {
@@ -1799,7 +1835,10 @@ bool UBCFFAdaptor::UBToCFFConverter::parseUBZPolygon(const QDomElement &element,
 
         if (0 < iwbElementPart.attributes().count())
         {   
-            QString id = QUuid::createUuid().toString();
+            QString id = svgElementPart.attribute(aUBZUuid);
+            if (id.isEmpty())
+                id = QUuid::createUuid().toString();
+
             svgElementPart.setAttribute(aID, id);
             iwbElementPart.setAttribute(aRef, id);     
 
diff --git a/plugins/cffadaptor/src/UBCFFAdaptor.h b/plugins/cffadaptor/src/UBCFFAdaptor.h
index d9891460..f38d51e0 100644
--- a/plugins/cffadaptor/src/UBCFFAdaptor.h
+++ b/plugins/cffadaptor/src/UBCFFAdaptor.h
@@ -63,7 +63,7 @@ private:
         QDomElement parseSvgPageSection(const QDomElement &element);
         void writeQDomElementToXML(const QDomNode &node);
         bool writeExtendedIwbSection();
-        QDomElement parseGroupPageSection(const QDomElement &element);
+        QDomElement parseGroupsPageSection(const QDomElement &groupRoot);
 
         bool createBackground(const QDomElement &element, QMultiMap<int, QDomElement> &dstSvgList);
         QString createBackgroundImage(const QDomElement &element, QSize size);
diff --git a/plugins/cffadaptor/src/UBCFFConstants.h b/plugins/cffadaptor/src/UBCFFConstants.h
index adeeb507..69de92dd 100644
--- a/plugins/cffadaptor/src/UBCFFConstants.h
+++ b/plugins/cffadaptor/src/UBCFFConstants.h
@@ -28,6 +28,7 @@ const QString tIWBPageSet = "pageset";
 const QString tId = "id";
 const QString tElement = "element";
 const QString tUBZGroup = "group";
+const QString tUBZGroups = "groups";
 const QString tUBZG = "g";
 const QString tUBZPolygon = "polygon";
 const QString tUBZPolyline = "polyline";
@@ -67,6 +68,7 @@ const QString aBackground = "background";
 const QString aCrossedBackground = "crossed-background";
 const QString aUBZType = "type";
 const QString aUBZUuid = "uuid";
+const QString aUBZParent = "parent";
 const QString aFill = "fill"; // IWB attribute contans color to fill
 
 const QString aID = "id";   // ID of any svg element can be placed in to iwb section
@@ -334,8 +336,10 @@ stroke-lineshape-end \
 const QString ubzElementAttributesToConvert(" \
 xlink:href, \
 src, \
-transform \
-");
+transform, \
+uuid \
+"
+);
 
 // additional attributes. Have references in SVG section.
 const QString svgElementAttributes(" \
@@ -376,4 +380,4 @@ struct UBItemLayerType
     };
 };
 
-#endif // UBCFFCONSTANTS_H
\ No newline at end of file
+#endif // UBCFFCONSTANTS_H
diff --git a/resources/i18n/sankore_fr.ts b/resources/i18n/sankore_fr.ts
index 6b2894cf..88f25d5a 100644
--- a/resources/i18n/sankore_fr.ts
+++ b/resources/i18n/sankore_fr.ts
@@ -377,7 +377,7 @@
     </message>
     <message>
         <source>Show Desktop</source>
-        <translation>Afficher le bureau</translation>
+        <translation>Bureau</translation>
     </message>
     <message>
         <source>Ctrl+Shift+H</source>
@@ -1961,7 +1961,7 @@ Voulez-vous ignorer les erreurs pour ce serveur ?</translation>
     </message>
     <message>
         <source>Add a link</source>
-        <translation>Ajouter un lien.web</translation>
+        <translation>Ajouter un lien web</translation>
     </message>
     <message>
         <source>Page: %0</source>
diff --git a/resources/i18n/sankore_fr_CH.ts b/resources/i18n/sankore_fr_CH.ts
index 6b2894cf..88f25d5a 100644
--- a/resources/i18n/sankore_fr_CH.ts
+++ b/resources/i18n/sankore_fr_CH.ts
@@ -377,7 +377,7 @@
     </message>
     <message>
         <source>Show Desktop</source>
-        <translation>Afficher le bureau</translation>
+        <translation>Bureau</translation>
     </message>
     <message>
         <source>Ctrl+Shift+H</source>
@@ -1961,7 +1961,7 @@ Voulez-vous ignorer les erreurs pour ce serveur ?</translation>
     </message>
     <message>
         <source>Add a link</source>
-        <translation>Ajouter un lien.web</translation>
+        <translation>Ajouter un lien web</translation>
     </message>
     <message>
         <source>Page: %0</source>
diff --git a/resources/library/applications/Nuancier.wgt/js/colorpicker.js b/resources/library/applications/Nuancier.wgt/js/colorpicker.js
index 0c7080ff..b5ac79ed 100644
--- a/resources/library/applications/Nuancier.wgt/js/colorpicker.js
+++ b/resources/library/applications/Nuancier.wgt/js/colorpicker.js
@@ -70,12 +70,12 @@
                 $("div.tools_change").removeClass("tools_compass");
                 window.sankore.setTool('pen');              
                 window.sankore.setPenColor('#' + HSBToHex(hsb));
-                sankore.returnStatus("PEN installed", penFlag);
+                //sankore.returnStatus("PEN installed", penFlag);
             } else {
                 $("div.tools_change").addClass("tools_compass");
                 window.sankore.setTool('compass');              
                 window.sankore.setPenColor('#' + HSBToHex(hsb));
-                sankore.returnStatus("Compass installed", penFlag);
+                //sankore.returnStatus("Compass installed", penFlag);
             }
         },
         keyDown = function (ev) {
@@ -224,12 +224,12 @@
                 $("div.tools_change").removeClass("tools_compass");
                 window.sankore.setTool('pen');
                 window.sankore.setPenColor('#' + HSBToHex(tmpColor.b));
-                sankore.returnStatus("PEN installed", penFlag);
+                //sankore.returnStatus("PEN installed", penFlag);
             } else {
                 $("div.tools_change").addClass("tools_compass");
                 window.sankore.setTool('compass');
                 window.sankore.setPenColor('#' + HSBToHex(tmpColor.b));
-                sankore.returnStatus("Compass installed", penFlag);
+                //sankore.returnStatus("Compass installed", penFlag);
             }
             //$(tmpColor.a).data('colorpicker').newColor.css('backgroundColor', '#' + HSBToHex(tmpColor.b));
             return false;
@@ -261,7 +261,7 @@
             cal.data('colorpicker').onSubmit(col, HSBToHex(col), HSBToRGB(col), cal.data('colorpicker').el);
             penFlag = (penFlag)?false:true;
             setNewColor(col, cal.get(0));
-            sankore.returnStatus("startEditing()", penFlag);
+            //sankore.returnStatus("startEditing()", penFlag);
         },
         show = function (ev) {
             var cal = $('#' + $(this).data('colorpickerId'));
@@ -604,4 +604,4 @@
         ColorPickerShow: ColorPicker.showPicker,
         ColorPickerSetColor: ColorPicker.setColor
     });
-})(jQuery)
\ No newline at end of file
+})(jQuery)
diff --git a/resources/library/interactivities/Ass images.wgt/js/script.js b/resources/library/interactivities/Ass images.wgt/js/script.js
index c2322d84..d771579c 100644
--- a/resources/library/interactivities/Ass images.wgt/js/script.js	
+++ b/resources/library/interactivities/Ass images.wgt/js/script.js	
@@ -1,14 +1,14 @@
 var sankoreLang = {
-    display: "Close", 
+    display: "Display", 
     edit: "Edit", 
     short_desc: "Select the number \"three\".", 
     add: "Add new block",
     enter: "Enter your instruction here ...",
     wgt_name: "Associate images",
     reload: "Reload",
-    slate: "Wood",
-    pad: "Pad",
-    none: "None",
+    slate: "slate",
+    pad: "pad",
+    none: "none",
     help: "Help",
     help_content: "This is an example of help content ...",
     theme: "Theme"
diff --git a/resources/library/interactivities/Ass images.wgt/locales/fr/js/script.js b/resources/library/interactivities/Ass images.wgt/locales/fr/js/script.js
index 967256d0..3895c032 100644
--- a/resources/library/interactivities/Ass images.wgt/locales/fr/js/script.js	
+++ b/resources/library/interactivities/Ass images.wgt/locales/fr/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Fermer", 
+    display: "Afficher", 
     edit: "Modifier", 
     short_desc: "Sélectionner le numéro «trois».", 
     add: "Nouveau bloc",
diff --git a/resources/library/interactivities/Ass sons.wgt/js/script.js b/resources/library/interactivities/Ass sons.wgt/js/script.js
index 3b8f3efa..7ae359f3 100644
--- a/resources/library/interactivities/Ass sons.wgt/js/script.js	
+++ b/resources/library/interactivities/Ass sons.wgt/js/script.js	
@@ -1,14 +1,14 @@
 var sankoreLang = {
-    display: "Close", 
+    display: "Display", 
     edit: "Edit", 
     short_desc: "How many signals do you hear?", 
     add: "Add new block",
     enter: "Enter your instruction here ...",
     wgt_name: "Associate to the audio",
     reload: "Reload",
-    slate: "Wood",
-    pad: "Pad",
-    none: "None",
+    slate: "slate",
+    pad: "pad",
+    none: "none",
     help: "Help",
     help_content: "This is an example of help content ...",
     theme: "Theme"
diff --git a/resources/library/interactivities/Ass sons.wgt/locales/fr/js/script.js b/resources/library/interactivities/Ass sons.wgt/locales/fr/js/script.js
index 184c4822..1b3c594d 100644
--- a/resources/library/interactivities/Ass sons.wgt/locales/fr/js/script.js	
+++ b/resources/library/interactivities/Ass sons.wgt/locales/fr/js/script.js	
@@ -1,14 +1,14 @@
 var sankoreLang = {
-    display: "Fermer", 
+    display: "Afficher", 
     edit: "Modifier", 
     short_desc: "Combien de signaux entendez-vous?", 
     add: "Nouveau bloc",
     enter: "Saisir votre description ici ...",
     wgt_name: "Associer aux sons",
     reload: "Recharger",
-    slate: "Bois",
-    pad: "Pad",
-    none: "Aucun",
+    slate: "ardoise",
+    pad: "tablette",
+    none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Associer aux sons</h2></p>"+
     "<p><h3>Faire correspondre une image à un son.</h3></p>"+
@@ -21,14 +21,17 @@ var sankoreLang = {
     "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
     "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
 
-    "<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis </p>"+
-    "<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir votre description ici ...”,"+
-    "<li>insérez un son dans la zone à gauche de la consigne par glisser-déposer d’un son à partir de votre bibliothèque,</li>"+
-    "<li>ajoutez des zones image en cliquant sur le gros signe + en dessous,</li>"+
-    "<li>insérez des images par glisser-déposer des images à partir de votre bibliothèque,</li>"+
-    "<li>définissez l’image correcte de l’interactivité en cliquant sur le bouton valider “v” situé en bas à droite de l’image concernée.</li></ul>"+
-    "<p>Pour supprimer une zone image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+ 
-    "<p>Pour remplacer un son, glissez-déposez simplement un nouveau son.</p>"+
+
+"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis </p>"+
+"<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir votre description ici ...”,"+
+"<li>insérez un son dans la zone à gauche de la consigne par glisser-déposer d’un son à partir de votre bibliothèque,</li>"+
+"<li>ajoutez des zones image(s) en cliquant sur le gros signe + en dessous,</li>"+
+"<li>insérez des images par glisser-déposer des images à partir de votre bibliothèque,</li>"+
+"<li>définissez l’image correcte de l’interactivité en cliquant sur le bouton valider “v” situé en bas à droite de l’image concernée.</li></ul>"+
+"<p>Pour supprimer une zone image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+ 
+"<p>Pour remplacer un son, glissez-déposez simplement un nouveau son.</p>"+
+
+
 
     "<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
 
diff --git a/resources/library/interactivities/Calcul.wgt/css/main.css b/resources/library/interactivities/Calcul.wgt/css/main.css
index 727a9a36..27f420e5 100644
--- a/resources/library/interactivities/Calcul.wgt/css/main.css
+++ b/resources/library/interactivities/Calcul.wgt/css/main.css
@@ -25,7 +25,7 @@ ul {
 	background-color: red;
 }
 
-.pagination li a {
+.pagination li span {
 	display: block;
 	width: 100%;
 	height: 100%;
diff --git a/resources/library/interactivities/Calcul.wgt/js/main.js b/resources/library/interactivities/Calcul.wgt/js/main.js
index 49e20e41..29436649 100644
--- a/resources/library/interactivities/Calcul.wgt/js/main.js
+++ b/resources/library/interactivities/Calcul.wgt/js/main.js
@@ -27,7 +27,7 @@ function reloadApp(app) {
 	$pagination = $("<ul class='pagination'></ul>");
 	$operationContainer.append($pagination);
 	for (var i = 0; i < operations; i++)
-		$("<li><a href='#'>"+(i+1)+"</a></li>").appendTo($pagination);
+		$("<li><span>"+(i+1)+"</span></li>").appendTo($pagination);
 
 	$operations = $("<ul class='operations'></ul>");
 	$operationContainer.append($operations);
diff --git a/resources/library/interactivities/Cat images.wgt/js/script.js b/resources/library/interactivities/Cat images.wgt/js/script.js
index cf2f6d0c..9c4358b4 100644
--- a/resources/library/interactivities/Cat images.wgt/js/script.js	
+++ b/resources/library/interactivities/Cat images.wgt/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Close", 
+    display: "Display", 
     edit: "Edit", 
     first_desc: "Odd numbers", 
     second_desc: "Even numbers", 
@@ -7,9 +7,9 @@ var sankoreLang = {
     add: "Add new block",
     wgt_name: "Categorize images",
     reload: "Reload",
-    slate: "Wood",
-    pad: "Pad",
-    none: "None",
+    slate: "slate",
+    pad: "pad",
+    none: "none",
     help: "Help",
     help_content: "This is an example of help content ...",
     theme: "Theme"
diff --git a/resources/library/interactivities/Cat images.wgt/locales/fr/js/script.js b/resources/library/interactivities/Cat images.wgt/locales/fr/js/script.js
index 5b20fcd1..a23d77b7 100644
--- a/resources/library/interactivities/Cat images.wgt/locales/fr/js/script.js	
+++ b/resources/library/interactivities/Cat images.wgt/locales/fr/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Fermer", 
+    display: "Afficher", 
     edit: "Modifier",
     first_desc: "Les nombres impairs", 
     second_desc: "Les nombres pairs", 
diff --git a/resources/library/interactivities/Cat text.wgt/js/script.js b/resources/library/interactivities/Cat text.wgt/js/script.js
index a53fc178..5744ce0a 100644
--- a/resources/library/interactivities/Cat text.wgt/js/script.js	
+++ b/resources/library/interactivities/Cat text.wgt/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Close", 
+    display: "Display", 
     edit: "Edit", 
     first_desc: "Fruits", 
     second_desc: "Vegetables",
@@ -13,9 +13,9 @@ var sankoreLang = {
     text: "Some text",
     wgt_name: "Categorize text",
     reload: "Reload",
-    slate: "Wood",
-    pad: "Pad",
-    none: "None",
+    slate: "slate",
+    pad: "pad",
+    none: "none",
     help: "Help",
     help_content: "This is an example of help content ...",
     theme: "Theme"
diff --git a/resources/library/interactivities/Cat text.wgt/locales/fr/js/script.js b/resources/library/interactivities/Cat text.wgt/locales/fr/js/script.js
index 90cbd71c..3e1395ec 100644
--- a/resources/library/interactivities/Cat text.wgt/locales/fr/js/script.js	
+++ b/resources/library/interactivities/Cat text.wgt/locales/fr/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Fermer", 
+    display: "Afficher", 
     edit: "Modifier", 
     first_desc: "Fruits", 
     second_desc: "Légumes",
@@ -28,13 +28,14 @@ var sankoreLang = {
     "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
     "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
 
-    "<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, une zone bleue apparaît, c’est une catégorie, puis.</p>"+
-    "<ul><li>insérez le nom de la catégorie (par exemple “fruits”, “légumes”, “mammifères”...) en cliquant dans le champ de texte “Saisir le nom de la catégorie ici …”,</li>"+
-    "<li>cliquez sur le gros “+” situé à gauche de la catégorie ce qui vous permet de rajouter des étiquettes de mots,</li>"+
-    "<li>entrez des mots dans ces étiquettes,</li>"+
-    "<li>ajoutez ensuite une catégorie (ou plusieurs) en cliquant sur le signe “+” situé à droite de la catégorie, complétez par son nom et ajoutez des étiquettes de mots.</li></ul>"+
-    "<p>Pour supprimer une étiquette de mots, cliquez sur la croix située dans le coin supérieur droit de celle-ci.</p>"+
-    "<p>Pour supprimer une catégorie, cliquez sur le signe “-” situé à droite de celle-ci.</p>"+
+"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, une zone bleue apparaît, c’est une catégorie, puis :</p>"+
+"<ul><li>insérez le nom de la catégorie (par exemple “fruits”, “légumes”, “mammifères”...) en cliquant dans le champ de texte “Saisir le nom de la catégorie ici …”,</li>"+
+"<li>cliquez sur le gros “+” situé à gauche de la catégorie ce qui vous permet de rajouter des étiquettes de mots,</li>"+
+"<li>entrez des mots dans ces étiquettes,</li>"+
+"<li>ajoutez ensuite une catégorie (ou plusieurs) en cliquant sur le signe “+” situé à droite de la catégorie, complétez par son nom et ajoutez des étiquettes de mots.</li></ul>"+
+"<p>Pour supprimer une étiquette de mots, cliquez sur la croix située dans le coin supérieur droit de celle-ci.</p>"+
+"<p>Pour supprimer une catégorie, cliquez sur le signe “-” situé à droite de celle-ci.</p>"+
+
 
     "<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
 
diff --git a/resources/library/interactivities/Choisir.wgt/locales/fr/scripts/selQuestionApp.js b/resources/library/interactivities/Choisir.wgt/locales/fr/scripts/selQuestionApp.js
index 6c976c50..720c3b5f 100644
--- a/resources/library/interactivities/Choisir.wgt/locales/fr/scripts/selQuestionApp.js
+++ b/resources/library/interactivities/Choisir.wgt/locales/fr/scripts/selQuestionApp.js
@@ -15,7 +15,7 @@
 
 var sankoreLang = {
     edit: "Modifier",
-    display:"Fermer",
+    display:"Afficher",
     question:"La question",
     example_question:"Ceci est un exemple de question",
     answer:"Ceci est une réponse possible",
@@ -52,7 +52,7 @@ var sankoreLang = {
 "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
 "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
 
-"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Ajouter une nouvelle question …”, puis.</p>"+
+"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Ajouter une nouvelle question …”, puis :</p>"+
 "<ul><li>insérez la question en cliquant sur le champ de texte “Saisir la question ici ...”,</li>"+
 "<li>cliquez sur ”Options” pour choisir l’affichage des propositions (une seule bonne réponse, plusieurs bonnes réponses, liste déroulante). Cliquez sur “Fermer”,</li>"+
 "<li>cliquez sur ”Ajouter une proposition” et saisissez la proposition dans le champ de texte,</li>"+
diff --git a/resources/library/interactivities/Choisir.wgt/scripts/selQuestionApp.js b/resources/library/interactivities/Choisir.wgt/scripts/selQuestionApp.js
index e04f2e83..8bb552c3 100644
--- a/resources/library/interactivities/Choisir.wgt/scripts/selQuestionApp.js
+++ b/resources/library/interactivities/Choisir.wgt/scripts/selQuestionApp.js
@@ -15,7 +15,7 @@
 
 var sankoreLang = {
     edit: "Edit",
-    display:"Close",
+    display:"Display",
     question:"Question",
     example_question:"This is an example of the question",
     answer:"This is one possible answer",
@@ -37,9 +37,9 @@ var sankoreLang = {
     a:"A",
     wgt_name: "Choose the right answer",
     reload: "Reload",
-    slate: "Wood",
-    pad: "Pad",
-    none: "None",
+    slate: "slate",
+    pad: "pad",
+    none: "none",
     help: "Help",
     help_content: "This is an example of help content ...",
     theme: "Theme"
diff --git a/resources/library/interactivities/Contraste.wgt/css/basic.css b/resources/library/interactivities/Contraste.wgt/css/basic.css
index 64323d60..90530c69 100644
--- a/resources/library/interactivities/Contraste.wgt/css/basic.css
+++ b/resources/library/interactivities/Contraste.wgt/css/basic.css
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;    
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -41,8 +41,6 @@ body{
     height: 100%;
     float: left;
     background-color: black;
-    -webkit-border-top-left-radius: 7px;
-    -webkit-border-bottom-left-radius: 7px;
     border-top-left-radius: 7px;
     border-bottom-left-radius: 7px;
 }
@@ -52,8 +50,6 @@ body{
     height: 100%;
     float: right;
     background-color: yellow;
-    -webkit-border-top-right-radius: 7px;
-    -webkit-border-bottom-right-radius: 7px;
     border-top-right-radius: 7px;
     border-bottom-right-radius: 7px;
 }
@@ -269,65 +265,55 @@ body{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
-#wgt_reload, #wgt_edit, #wgt_display,#wgt_add, #wgt_help{
+#wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../images/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../images/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../images/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../images/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../images/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../images/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_add{
-    padding-left: 40px;
-    background-image: url(../images/plus.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-    display: none;
+    margin-left: 10px;
+    padding-right: 10px;
+    border: 1px solid #666;
+    border-radius: 15px;
+    padding-left: 30px;
+    background: url(../images/plus.png) -2px -2px no-repeat;
+    display: inline-block;
 }
 
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../images/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+#wgt_add:hover{
+    border-color: black;
+    cursor: pointer;
 }
 
 .btl_pad{
@@ -362,55 +348,50 @@ body{
     background-image: url(../images/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
-}
-
-.pad_reload{
-    background-image: url(../images/slate-toolbar-reload-white.png) !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_edit{
-    background-image: url(../images/slate-display.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_add{
-    background-image: url(../images/plus-white.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../images/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../images/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../images/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../images/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../images/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../images/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../images/slate-help-white.png) !important;
+.help_pad{
+    background: url(../images/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../images/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../images/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -419,5 +400,37 @@ body{
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    margin: 40px 0 0 0;
+    padding: 10px 20px;
+    background: url("../images/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../images/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Contraste.wgt/images/ar_down.png b/resources/library/interactivities/Contraste.wgt/images/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Contraste.wgt/images/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/ar_down_white.png b/resources/library/interactivities/Contraste.wgt/images/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Contraste.wgt/images/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/parameters-bg.png b/resources/library/interactivities/Contraste.wgt/images/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Contraste.wgt/images/parameters-bg.png differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/plus-white.png b/resources/library/interactivities/Contraste.wgt/images/plus-white.png
deleted file mode 100644
index 650983ca..00000000
Binary files a/resources/library/interactivities/Contraste.wgt/images/plus-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/plus.png b/resources/library/interactivities/Contraste.wgt/images/plus.png
index b8d6f764..4ed06b7c 100644
Binary files a/resources/library/interactivities/Contraste.wgt/images/plus.png and b/resources/library/interactivities/Contraste.wgt/images/plus.png differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/slate-display.png b/resources/library/interactivities/Contraste.wgt/images/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Contraste.wgt/images/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/slate-edit.png b/resources/library/interactivities/Contraste.wgt/images/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Contraste.wgt/images/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/slate-help-white.png b/resources/library/interactivities/Contraste.wgt/images/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Contraste.wgt/images/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/slate-help.png b/resources/library/interactivities/Contraste.wgt/images/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Contraste.wgt/images/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-help.png b/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-reload-white.png b/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-reload.png b/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-reload.png and b/resources/library/interactivities/Contraste.wgt/images/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/toolbar-edit.png b/resources/library/interactivities/Contraste.wgt/images/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Contraste.wgt/images/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/toolbar-help.png b/resources/library/interactivities/Contraste.wgt/images/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Contraste.wgt/images/toolbar-help.png differ
diff --git a/resources/library/interactivities/Contraste.wgt/images/toolbar-reload.png b/resources/library/interactivities/Contraste.wgt/images/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Contraste.wgt/images/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Contraste.wgt/index.html b/resources/library/interactivities/Contraste.wgt/index.html
index 0072e219..8f20fea1 100644
--- a/resources/library/interactivities/Contraste.wgt/index.html
+++ b/resources/library/interactivities/Contraste.wgt/index.html
@@ -5,7 +5,7 @@
         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
         <link rel="stylesheet" type="text/css" href="css/basic.css"/>
         <link rel="stylesheet" href="css/fonts/Lobster/stylesheet.css">
-	<link rel="stylesheet" href="css/fonts/SF-Toontime/stylesheet.css">
+        <link rel="stylesheet" href="css/fonts/SF-Toontime/stylesheet.css">
         <script type="text/javascript" src="scripts/jquery-1.6.2.min.js"></script>
         <script src="scripts/jquery.disable.text.select.js" type="text/javascript"></script>
         <script type="text/javascript" src="scripts/blackYellow.js"></script>
@@ -51,27 +51,33 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <div id="wgt_add"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
-       
+
             <tr>
                 <td class="b_center_left">&nbsp;</td>
                 <td>
                     <div id="help"></div>
+                    <div id="parameters">
+                        <div class="inline">
+                            <label>
+                                <select id="style_select">
+                                    <option value="1"></option>
+                                    <option value="2"></option>
+                                    <option value="3"></option>
+                                </select>
+                            </label>
+                            <div id="wgt_add"></div>
+                        </div>
+                    </div>
                     <div id="data">
-                        
+
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
             </tr>     
-        
+
             <tr style="height: 54px;">
                 <td class="b_bottom_left">&nbsp;</td>
                 <td class="b_bottom_center">&nbsp;</td>
diff --git a/resources/library/interactivities/Contraste.wgt/locales/fr/index.html b/resources/library/interactivities/Contraste.wgt/locales/fr/index.html
index f2cecf06..5c74529e 100644
--- a/resources/library/interactivities/Contraste.wgt/locales/fr/index.html
+++ b/resources/library/interactivities/Contraste.wgt/locales/fr/index.html
@@ -9,7 +9,7 @@ and open the template in the editor.
         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
         <link rel="stylesheet" type="text/css" href="../../css/basic.css"/>
         <link rel="stylesheet" href="../../css/fonts/Lobster/stylesheet.css">
-	<link rel="stylesheet" href="../../css/fonts/SF-Toontime/stylesheet.css">
+        <link rel="stylesheet" href="../../css/fonts/SF-Toontime/stylesheet.css">
         <script type="text/javascript" src="../../scripts/jquery-1.6.2.min.js"></script>
         <script src="../../scripts/jquery.disable.text.select.js" type="text/javascript"></script>
         <script type="text/javascript" src="scripts/blackYellow.js"></script>
@@ -31,27 +31,33 @@ and open the template in the editor.
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <div id="wgt_add"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
-       
+
             <tr>
                 <td class="b_center_left">&nbsp;</td>
                 <td>
                     <div id="help"></div>
+                    <div id="parameters">
+                        <div class="inline">
+                            <label>
+                                <select id="style_select">
+                                    <option value="1"></option>
+                                    <option value="2"></option>
+                                    <option value="3"></option>
+                                </select>
+                            </label>
+                            <div id="wgt_add"></div>
+                        </div>
+                    </div>
                     <div id="data">
-                        
+
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
             </tr>     
-        
+
             <tr style="height: 54px;">
                 <td class="b_bottom_left">&nbsp;</td>
                 <td class="b_bottom_center">&nbsp;</td>
diff --git a/resources/library/interactivities/Contraste.wgt/locales/fr/scripts/blackYellow.js b/resources/library/interactivities/Contraste.wgt/locales/fr/scripts/blackYellow.js
index 634dde99..aa40e63e 100644
--- a/resources/library/interactivities/Contraste.wgt/locales/fr/scripts/blackYellow.js
+++ b/resources/library/interactivities/Contraste.wgt/locales/fr/scripts/blackYellow.js
@@ -14,7 +14,7 @@
  */
 
 var sankoreLang = {
-    display: "Afficher", 
+    display: "Fermer", 
     edit: "Modifier", 
     add: "Ajouter", 
     enter_data: "Saisir la donnée:", 
@@ -28,24 +28,25 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Contraste</h2></p>"+
-"<p><h3>Jeu de couleurs.</h3></p>"+
+    "<p><h3>Jeu de couleurs.</h3></p>"+
 
 
-"<p>Cette activité permet de masquer et d’afficher du texte en jouant sur la couleur de fond (jaune ou noir). Le but est de pouvoir faire apparaître des données en passant d’une couleur à l’autre.</p>"+
+    "<p>Cette activité permet de masquer et d’afficher du texte en jouant sur la couleur de fond (jaune ou noir). Le but est de pouvoir faire apparaître des données en passant d’une couleur à l’autre.</p>"+
 
-"<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
+    "<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
-"<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
+    "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
 
-"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “+ Ajouter” en haut, puis</p>"+
-"<ul><li>saisissez la donnée par exemple “3x15”,</li>"+
-"<li>saisissez le résultat, par exemple “15” et cliquez sur “OK”.</li></ul>"+
-"<p>Pour modifier les données ou les résultats, cliquez directement sur l’exercice.</p>"+
-"<p>Pour supprimer un exercice, cliquez sur la croix en haut à droite de l’exercice.</p>"+
+    "<p>En mode édition, pour créer un nouvel exercice, cliquez sur “+ Ajouter” en haut, puis</p>"+
+    "<ul><li>saisissez la donnée par exemple “3x15”,</li>"+
+    "<li>saisissez le résultat, par exemple “15” et cliquez sur “OK”.</li></ul>"+
+    "<p>Pour modifier les données ou les résultats, cliquez directement sur l’exercice.</p>"+
+    "<p>Pour supprimer un exercice, cliquez sur la croix en haut à droite de l’exercice.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 };
 
 function init(){
@@ -61,6 +62,8 @@ function init(){
     var flagForSelect = false;
     var dragElement = null; //the element that must be dragging
     var lang = ""; //locale language
+    var resizeFlag = true;
+    
     var coords = {
         left:0,
         top:0
@@ -82,9 +85,11 @@ function init(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("blackYellowData","")){
@@ -109,7 +114,7 @@ function init(){
     if(window.sankore){
         if(sankore.preference("by_style","")){
             changeStyle(sankore.preference("by_style",""));
-            $(".style_select").val(sankore.preference("by_style",""));
+            $("#style_select").val(sankore.preference("by_style",""));
         } else
             changeStyle("3")
     } else
@@ -120,9 +125,15 @@ function init(){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");   
+                var tmpwh = $(window).height();
+                var tmpww = $(window).width();
+                resizeFlag = true;
+                window.resizeTo(tmpww, tmpwh - 44)
+                $("#data").css("padding-bottom","");
+                $("#leftDiv").css("border-top-left-radius","7px");
+                $("#rightDiv").css("border-top-right-radius","7px");
                 $(this).css("display", "none");
-                $("#wgt_add").css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 mode = false;
                 $(".leftDiv, .rightDiv").animate({
@@ -135,7 +146,7 @@ function init(){
                                 tmpReadyTask.width($(domElem).width())
                                 .height($(domElem).height())
                                 .css("position","absolute")
-                                .css("top",$(domElem).position().top)
+                                .css("top",$(domElem).position().top - 40)
                                 .css("left",$(domElem).position().left)
                                 .find(".taskContainer").removeAttr("contenteditable");                                
                                 
@@ -146,15 +157,22 @@ function init(){
                         opacityChanged = false;
                     }
                 });
+                
                 $(document).disableTextSelect(); 
             }
         } else {            
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");   
+                tmpwh = $(window).height();
+                tmpww = $(window).width();
+                resizeFlag = true;
+                window.resizeTo(tmpww, tmpwh + 44)
+                $("#data").css("padding-bottom","42px");
+                $("#leftDiv").css("border-top-left-radius","0px");
+                $("#rightDiv").css("border-top-right-radius","0px");
                 $(this).css("display", "none");
-                $("#wgt_add").css("display", "block");
                 $("#wgt_display").css("display", "block");
                 mode = true; 
                 $(document).enableTextSelect(); 
@@ -189,12 +207,15 @@ function init(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
+                ($("#wgt_edit").hasClass("selected"))?$("#parameters").show():'';
             });
         } else {            
-            $("#data").hide();
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
+            $("#data, #parameters").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
             });
@@ -218,10 +239,10 @@ function init(){
         $(document).disableTextSelect();
     });
     
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -372,12 +393,12 @@ function init(){
             if((prevBottom + 15 + curHeight) < ($(window).height() - 54))
                 curr.css("top", prevBottom + 15 + "px");                        
             else
-                curr.css("top", "60px").css("left", prevLeft + 255 + "px");            
+                curr.css("top", "100px").css("left", prevLeft + 255 + "px");            
         } else {
             if((prevBottom + 15 + curHeight) < ($(window).height() - 54))
                 curr.css("top", prevBottom + 15 + "px").css("left", prevLeft + "px");           
             else
-                curr.css("top", "60px").css("left", prevLeft + 255 + "px");
+                curr.css("top", "100px").css("left", prevLeft + 255 + "px");
         }
         prevBottom = curr.position().top + curr.height(),
         prevLeft = curr.position().left;
@@ -390,28 +411,31 @@ function init(){
     popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
     
     $(window).resize(function(){
-        if($("#wgt_edit").hasClass("selected")){
-            if($(".editContainer").size() > 1){            
-                var prev = $(".editContainer:first"),
-                prevBottom = prev.position().top + prev.height(),
-                prevLeft = prev.position().left;
-                recursionCall(prevBottom, prevLeft, prev.next());
+        if(!resizeFlag){
+            if($("#wgt_edit").hasClass("selected")){
+                if($(".editContainer").size() > 1){            
+                    var prev = $(".editContainer:first"),
+                    prevBottom = prev.position().top + prev.height(),
+                    prevLeft = prev.position().left;
+                    recursionCall(prevBottom, prevLeft, prev.next());
+                }
+            } else {
+                var tmp_array = [];
+                $(".readyTask").each(function(){
+                    tmp_array.push($(this));
+                });
+                orderItems(tmp_array);
             }
-        } else {
-            var tmp_array = [];
-            $(".readyTask").each(function(){
-                tmp_array.push($(this));
-            });
-            orderItems(tmp_array);
-        }
-        popupBack.css("top", ($(window).height() - 138)*50/$(window).height() + "%");
-        popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
+            popupBack.css("top", ($(window).height() - 138)*50/$(window).height() + "%");
+            popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
+        } else 
+            resizeFlag = false;
     });
     
     if (window.widget) {
         window.widget.onleave = function(){
             exportToSankore();
-            sankore.setPreference("by_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("by_style", $("#style_select").find("option:selected").val());
         }
     }
     
@@ -434,7 +458,7 @@ function init(){
                     objToExport.data2 = $(domElem).find(".readyTask").find(":last-child").text();
                     objToExport.width = $(domElem).width();
                     objToExport.height = $(domElem).height();
-                    objToExport.top = $(domElem).position().top;
+                    objToExport.top = $(domElem).position().top - 40;
                     objToExport.left = $(domElem).position().left;
                     arrayToExport.push(objToExport);
                 });
@@ -493,14 +517,14 @@ function reloadItems(){
 
 //order items
 function orderItems(items){
-    var bottom = 45,
+    var bottom = ($("#wgt_edit").hasClass("selected"))?85:45,
     lastItemLeft = 54; 
     for (var i in items){
         if((bottom + items[i].height()) < ($(window).height() - 54)){
             items[i].css("top", bottom + 15 + "px").css("left", lastItemLeft + "px").appendTo("#data");
             bottom += items[i].height() + 15;
         } else {
-            bottom = 60;
+            bottom = 100;
             lastItemLeft += 255;
             items[i].css("top", bottom + "px").css("left", lastItemLeft + "px").appendTo("#data");
             bottom += items[i].height();
@@ -525,7 +549,7 @@ function shuffle( arr )
 //adding a new task to the page
 function addTask(expression, result){
     var lastItem = $(".editContainer:last"),
-    lastItemPos = lastItem.length ? lastItem.position().top : 45,
+    lastItemPos = lastItem.length ? lastItem.position().top : 85,
     lastItemHeight = lastItem.length ? lastItem.height() : 0,
     lastItemLeft = lastItem.length ? lastItem.position().left : 54;
     var bottom = lastItemPos + lastItemHeight + 85;
@@ -537,7 +561,7 @@ function addTask(expression, result){
     if(bottom < ($(window).height() - 54)){
         editContent.css("top", lastItemPos + lastItemHeight + 15 + "px").css("left", lastItemLeft + "px").appendTo("#data");
     } else {
-        lastItemPos = 45;
+        lastItemPos = 85;
         editContent.css("top", lastItemPos + 15 + "px").css("left", lastItemLeft + 255 + "px").appendTo("#data");
     }    
     main.appendTo(editContent);
@@ -556,13 +580,12 @@ function changeStyle(val){
             $(".b_bottom_left").removeClass("bbl_pad").removeClass("without_back");
             $(".b_bottom_center").removeClass("bbc_pad").removeClass("without_back");
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
-            $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_add").removeClass("pad_color").removeClass("pad_add");
+            $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -574,13 +597,12 @@ function changeStyle(val){
             $(".b_bottom_left").addClass("bbl_pad").removeClass("without_back");
             $(".b_bottom_center").addClass("bbc_pad").removeClass("without_back");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
-            $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_add").addClass("pad_color").addClass("pad_add");
+            $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -591,14 +613,13 @@ function changeStyle(val){
             $(".b_bottom_right").addClass("without_back").removeClass("bbr_pad");
             $(".b_bottom_left").addClass("without_back").removeClass("bbl_pad");
             $(".b_bottom_center").addClass("without_back").removeClass("bbc_pad");
+            $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_help").addClass("pad_color").addClass("pad_help");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_add").addClass("pad_color").addClass("pad_add");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
     if($("#wgt_edit").hasClass("selected"))
diff --git a/resources/library/interactivities/Contraste.wgt/locales/ru/index.html b/resources/library/interactivities/Contraste.wgt/locales/ru/index.html
index f2cecf06..f72a635b 100644
--- a/resources/library/interactivities/Contraste.wgt/locales/ru/index.html
+++ b/resources/library/interactivities/Contraste.wgt/locales/ru/index.html
@@ -31,12 +31,6 @@ and open the template in the editor.
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <div id="wgt_add"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -45,6 +39,18 @@ and open the template in the editor.
                 <td class="b_center_left">&nbsp;</td>
                 <td>
                     <div id="help"></div>
+                     <div id="parameters">
+                        <div class="inline">
+                            <label>
+                                <select id="style_select">
+                                    <option value="1"></option>
+                                    <option value="2"></option>
+                                    <option value="3"></option>
+                                </select>
+                            </label>
+                            <div id="wgt_add"></div>
+                        </div>
+                    </div>
                     <div id="data">
                         
                     </div>
diff --git a/resources/library/interactivities/Contraste.wgt/locales/ru/scripts/blackYellow.js b/resources/library/interactivities/Contraste.wgt/locales/ru/scripts/blackYellow.js
index fc0eb152..15d2aff3 100644
--- a/resources/library/interactivities/Contraste.wgt/locales/ru/scripts/blackYellow.js
+++ b/resources/library/interactivities/Contraste.wgt/locales/ru/scripts/blackYellow.js
@@ -14,7 +14,7 @@
  */
 
 var sankoreLang = {
-    display: "Показать", 
+    display: "Закрыть", 
     edit: "Изменить", 
     add: "Добавить", 
     enter_data: "Введите вопрос:", 
@@ -27,7 +27,8 @@ var sankoreLang = {
     pad: "планшет",
     none: "нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 function init(){
@@ -43,6 +44,8 @@ function init(){
     var flagForSelect = false;
     var dragElement = null; //the element that must be dragging
     var lang = ""; //locale language
+    var resizeFlag = true;
+    
     var coords = {
         left:0,
         top:0
@@ -64,9 +67,11 @@ function init(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("blackYellowData","")){
@@ -91,7 +96,7 @@ function init(){
     if(window.sankore){
         if(sankore.preference("by_style","")){
             changeStyle(sankore.preference("by_style",""));
-            $(".style_select").val(sankore.preference("by_style",""));
+            $("#style_select").val(sankore.preference("by_style",""));
         } else
             changeStyle("3")
     } else
@@ -102,9 +107,15 @@ function init(){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");   
+                var tmpwh = $(window).height();
+                var tmpww = $(window).width();
+                resizeFlag = true;
+                window.resizeTo(tmpww, tmpwh - 44)
+                $("#data").css("padding-bottom","");
+                $("#leftDiv").css("border-top-left-radius","7px");
+                $("#rightDiv").css("border-top-right-radius","7px");
                 $(this).css("display", "none");
-                $("#wgt_add").css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 mode = false;
                 $(".leftDiv, .rightDiv").animate({
@@ -117,7 +128,7 @@ function init(){
                                 tmpReadyTask.width($(domElem).width())
                                 .height($(domElem).height())
                                 .css("position","absolute")
-                                .css("top",$(domElem).position().top)
+                                .css("top",$(domElem).position().top - 40)
                                 .css("left",$(domElem).position().left)
                                 .find(".taskContainer").removeAttr("contenteditable");                                
                                 
@@ -128,15 +139,22 @@ function init(){
                         opacityChanged = false;
                     }
                 });
+                
                 $(document).disableTextSelect(); 
             }
         } else {            
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");   
+                tmpwh = $(window).height();
+                tmpww = $(window).width();
+                resizeFlag = true;
+                window.resizeTo(tmpww, tmpwh + 44)
+                $("#data").css("padding-bottom","42px");
+                $("#leftDiv").css("border-top-left-radius","0px");
+                $("#rightDiv").css("border-top-right-radius","0px");
                 $(this).css("display", "none");
-                $("#wgt_add").css("display", "block");
                 $("#wgt_display").css("display", "block");
                 mode = true; 
                 $(document).enableTextSelect(); 
@@ -171,12 +189,15 @@ function init(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
+                ($("#wgt_edit").hasClass("selected"))?$("#parameters").show():'';
             });
         } else {            
-            $("#data").hide();
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
+            $("#data, #parameters").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
             });
@@ -200,10 +221,10 @@ function init(){
         $(document).disableTextSelect();
     });
     
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -354,12 +375,12 @@ function init(){
             if((prevBottom + 15 + curHeight) < ($(window).height() - 54))
                 curr.css("top", prevBottom + 15 + "px");                        
             else
-                curr.css("top", "60px").css("left", prevLeft + 255 + "px");            
+                curr.css("top", "100px").css("left", prevLeft + 255 + "px");            
         } else {
             if((prevBottom + 15 + curHeight) < ($(window).height() - 54))
                 curr.css("top", prevBottom + 15 + "px").css("left", prevLeft + "px");           
             else
-                curr.css("top", "60px").css("left", prevLeft + 255 + "px");
+                curr.css("top", "100px").css("left", prevLeft + 255 + "px");
         }
         prevBottom = curr.position().top + curr.height(),
         prevLeft = curr.position().left;
@@ -372,28 +393,31 @@ function init(){
     popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
     
     $(window).resize(function(){
-        if($("#wgt_edit").hasClass("selected")){
-            if($(".editContainer").size() > 1){            
-                var prev = $(".editContainer:first"),
-                prevBottom = prev.position().top + prev.height(),
-                prevLeft = prev.position().left;
-                recursionCall(prevBottom, prevLeft, prev.next());
+        if(!resizeFlag){
+            if($("#wgt_edit").hasClass("selected")){
+                if($(".editContainer").size() > 1){            
+                    var prev = $(".editContainer:first"),
+                    prevBottom = prev.position().top + prev.height(),
+                    prevLeft = prev.position().left;
+                    recursionCall(prevBottom, prevLeft, prev.next());
+                }
+            } else {
+                var tmp_array = [];
+                $(".readyTask").each(function(){
+                    tmp_array.push($(this));
+                });
+                orderItems(tmp_array);
             }
-        } else {
-            var tmp_array = [];
-            $(".readyTask").each(function(){
-                tmp_array.push($(this));
-            });
-            orderItems(tmp_array);
-        }
-        popupBack.css("top", ($(window).height() - 138)*50/$(window).height() + "%");
-        popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
+            popupBack.css("top", ($(window).height() - 138)*50/$(window).height() + "%");
+            popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
+        } else 
+            resizeFlag = false;
     });
     
     if (window.widget) {
         window.widget.onleave = function(){
             exportToSankore();
-            sankore.setPreference("by_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("by_style", $("#style_select").find("option:selected").val());
         }
     }
     
@@ -416,7 +440,7 @@ function init(){
                     objToExport.data2 = $(domElem).find(".readyTask").find(":last-child").text();
                     objToExport.width = $(domElem).width();
                     objToExport.height = $(domElem).height();
-                    objToExport.top = $(domElem).position().top;
+                    objToExport.top = $(domElem).position().top - 40;
                     objToExport.left = $(domElem).position().left;
                     arrayToExport.push(objToExport);
                 });
@@ -475,14 +499,14 @@ function reloadItems(){
 
 //order items
 function orderItems(items){
-    var bottom = 45,
+    var bottom = ($("#wgt_edit").hasClass("selected"))?85:45,
     lastItemLeft = 54; 
     for (var i in items){
         if((bottom + items[i].height()) < ($(window).height() - 54)){
             items[i].css("top", bottom + 15 + "px").css("left", lastItemLeft + "px").appendTo("#data");
             bottom += items[i].height() + 15;
         } else {
-            bottom = 60;
+            bottom = 100;
             lastItemLeft += 255;
             items[i].css("top", bottom + "px").css("left", lastItemLeft + "px").appendTo("#data");
             bottom += items[i].height();
@@ -507,7 +531,7 @@ function shuffle( arr )
 //adding a new task to the page
 function addTask(expression, result){
     var lastItem = $(".editContainer:last"),
-    lastItemPos = lastItem.length ? lastItem.position().top : 45,
+    lastItemPos = lastItem.length ? lastItem.position().top : 85,
     lastItemHeight = lastItem.length ? lastItem.height() : 0,
     lastItemLeft = lastItem.length ? lastItem.position().left : 54;
     var bottom = lastItemPos + lastItemHeight + 85;
@@ -519,7 +543,7 @@ function addTask(expression, result){
     if(bottom < ($(window).height() - 54)){
         editContent.css("top", lastItemPos + lastItemHeight + 15 + "px").css("left", lastItemLeft + "px").appendTo("#data");
     } else {
-        lastItemPos = 45;
+        lastItemPos = 85;
         editContent.css("top", lastItemPos + 15 + "px").css("left", lastItemLeft + 255 + "px").appendTo("#data");
     }    
     main.appendTo(editContent);
@@ -538,13 +562,12 @@ function changeStyle(val){
             $(".b_bottom_left").removeClass("bbl_pad").removeClass("without_back");
             $(".b_bottom_center").removeClass("bbc_pad").removeClass("without_back");
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
-            $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_add").removeClass("pad_color").removeClass("pad_add");
+            $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -556,13 +579,12 @@ function changeStyle(val){
             $(".b_bottom_left").addClass("bbl_pad").removeClass("without_back");
             $(".b_bottom_center").addClass("bbc_pad").removeClass("without_back");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
-            $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_add").addClass("pad_color").addClass("pad_add");
+            $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -573,14 +595,13 @@ function changeStyle(val){
             $(".b_bottom_right").addClass("without_back").removeClass("bbr_pad");
             $(".b_bottom_left").addClass("without_back").removeClass("bbl_pad");
             $(".b_bottom_center").addClass("without_back").removeClass("bbc_pad");
+            $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_help").addClass("pad_color").addClass("pad_help");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_add").addClass("pad_color").addClass("pad_add");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
     if($("#wgt_edit").hasClass("selected"))
diff --git a/resources/library/interactivities/Contraste.wgt/scripts/blackYellow.js b/resources/library/interactivities/Contraste.wgt/scripts/blackYellow.js
index 89e6df3f..593bde46 100644
--- a/resources/library/interactivities/Contraste.wgt/scripts/blackYellow.js
+++ b/resources/library/interactivities/Contraste.wgt/scripts/blackYellow.js
@@ -14,7 +14,7 @@
  */
 
 var sankoreLang = {
-    display: "Display", 
+    display: "Close", 
     edit: "Edit", 
     add: "Add", 
     enter_data: "Enter data:", 
@@ -23,11 +23,12 @@ var sankoreLang = {
     cancel: "Cancel",
     wgt_name: "Contrast",
     reload: "Reload",
-    slate: "wood",
+    slate: "slate",
     pad: "pad",
     none: "none",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 function init(){
@@ -43,6 +44,8 @@ function init(){
     var flagForSelect = false;
     var dragElement = null; //the element that must be dragging
     var lang = ""; //locale language
+    var resizeFlag = true;
+    
     var coords = {
         left:0,
         top:0
@@ -64,9 +67,11 @@ function init(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("blackYellowData","")){
@@ -91,7 +96,7 @@ function init(){
     if(window.sankore){
         if(sankore.preference("by_style","")){
             changeStyle(sankore.preference("by_style",""));
-            $(".style_select").val(sankore.preference("by_style",""));
+            $("#style_select").val(sankore.preference("by_style",""));
         } else
             changeStyle("3")
     } else
@@ -102,9 +107,15 @@ function init(){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");   
+                var tmpwh = $(window).height();
+                var tmpww = $(window).width();
+                resizeFlag = true;
+                window.resizeTo(tmpww, tmpwh - 44)
+                $("#data").css("padding-bottom","");
+                $("#leftDiv").css("border-top-left-radius","7px");
+                $("#rightDiv").css("border-top-right-radius","7px");
                 $(this).css("display", "none");
-                $("#wgt_add").css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 mode = false;
                 $(".leftDiv, .rightDiv").animate({
@@ -117,7 +128,7 @@ function init(){
                                 tmpReadyTask.width($(domElem).width())
                                 .height($(domElem).height())
                                 .css("position","absolute")
-                                .css("top",$(domElem).position().top)
+                                .css("top",$(domElem).position().top - 40)
                                 .css("left",$(domElem).position().left)
                                 .find(".taskContainer").removeAttr("contenteditable");                                
                                 
@@ -128,15 +139,22 @@ function init(){
                         opacityChanged = false;
                     }
                 });
+                
                 $(document).disableTextSelect(); 
             }
         } else {            
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");   
+                tmpwh = $(window).height();
+                tmpww = $(window).width();
+                resizeFlag = true;
+                window.resizeTo(tmpww, tmpwh + 44)
+                $("#data").css("padding-bottom","42px");
+                $("#leftDiv").css("border-top-left-radius","0px");
+                $("#rightDiv").css("border-top-right-radius","0px");
                 $(this).css("display", "none");
-                $("#wgt_add").css("display", "block");
                 $("#wgt_display").css("display", "block");
                 mode = true; 
                 $(document).enableTextSelect(); 
@@ -171,12 +189,15 @@ function init(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
+                ($("#wgt_edit").hasClass("selected"))?$("#parameters").show():'';
             });
         } else {            
-            $("#data").hide();
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
+            $("#data, #parameters").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
             });
@@ -200,10 +221,10 @@ function init(){
         $(document).disableTextSelect();
     });
     
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -354,12 +375,12 @@ function init(){
             if((prevBottom + 15 + curHeight) < ($(window).height() - 54))
                 curr.css("top", prevBottom + 15 + "px");                        
             else
-                curr.css("top", "60px").css("left", prevLeft + 255 + "px");            
+                curr.css("top", "100px").css("left", prevLeft + 255 + "px");            
         } else {
             if((prevBottom + 15 + curHeight) < ($(window).height() - 54))
                 curr.css("top", prevBottom + 15 + "px").css("left", prevLeft + "px");           
             else
-                curr.css("top", "60px").css("left", prevLeft + 255 + "px");
+                curr.css("top", "100px").css("left", prevLeft + 255 + "px");
         }
         prevBottom = curr.position().top + curr.height(),
         prevLeft = curr.position().left;
@@ -372,28 +393,31 @@ function init(){
     popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
     
     $(window).resize(function(){
-        if($("#wgt_edit").hasClass("selected")){
-            if($(".editContainer").size() > 1){            
-                var prev = $(".editContainer:first"),
-                prevBottom = prev.position().top + prev.height(),
-                prevLeft = prev.position().left;
-                recursionCall(prevBottom, prevLeft, prev.next());
+        if(!resizeFlag){
+            if($("#wgt_edit").hasClass("selected")){
+                if($(".editContainer").size() > 1){            
+                    var prev = $(".editContainer:first"),
+                    prevBottom = prev.position().top + prev.height(),
+                    prevLeft = prev.position().left;
+                    recursionCall(prevBottom, prevLeft, prev.next());
+                }
+            } else {
+                var tmp_array = [];
+                $(".readyTask").each(function(){
+                    tmp_array.push($(this));
+                });
+                orderItems(tmp_array);
             }
-        } else {
-            var tmp_array = [];
-            $(".readyTask").each(function(){
-                tmp_array.push($(this));
-            });
-            orderItems(tmp_array);
-        }
-        popupBack.css("top", ($(window).height() - 138)*50/$(window).height() + "%");
-        popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
+            popupBack.css("top", ($(window).height() - 138)*50/$(window).height() + "%");
+            popupBack.css("left", ($(window).width() - 360)*50/$(window).width() + "%");
+        } else 
+            resizeFlag = false;
     });
     
     if (window.widget) {
         window.widget.onleave = function(){
             exportToSankore();
-            sankore.setPreference("by_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("by_style", $("#style_select").find("option:selected").val());
         }
     }
     
@@ -416,7 +440,7 @@ function init(){
                     objToExport.data2 = $(domElem).find(".readyTask").find(":last-child").text();
                     objToExport.width = $(domElem).width();
                     objToExport.height = $(domElem).height();
-                    objToExport.top = $(domElem).position().top;
+                    objToExport.top = $(domElem).position().top - 40;
                     objToExport.left = $(domElem).position().left;
                     arrayToExport.push(objToExport);
                 });
@@ -475,14 +499,14 @@ function reloadItems(){
 
 //order items
 function orderItems(items){
-    var bottom = 45,
+    var bottom = ($("#wgt_edit").hasClass("selected"))?85:45,
     lastItemLeft = 54; 
     for (var i in items){
         if((bottom + items[i].height()) < ($(window).height() - 54)){
             items[i].css("top", bottom + 15 + "px").css("left", lastItemLeft + "px").appendTo("#data");
             bottom += items[i].height() + 15;
         } else {
-            bottom = 60;
+            bottom = 100;
             lastItemLeft += 255;
             items[i].css("top", bottom + "px").css("left", lastItemLeft + "px").appendTo("#data");
             bottom += items[i].height();
@@ -507,7 +531,7 @@ function shuffle( arr )
 //adding a new task to the page
 function addTask(expression, result){
     var lastItem = $(".editContainer:last"),
-    lastItemPos = lastItem.length ? lastItem.position().top : 45,
+    lastItemPos = lastItem.length ? lastItem.position().top : 85,
     lastItemHeight = lastItem.length ? lastItem.height() : 0,
     lastItemLeft = lastItem.length ? lastItem.position().left : 54;
     var bottom = lastItemPos + lastItemHeight + 85;
@@ -519,7 +543,7 @@ function addTask(expression, result){
     if(bottom < ($(window).height() - 54)){
         editContent.css("top", lastItemPos + lastItemHeight + 15 + "px").css("left", lastItemLeft + "px").appendTo("#data");
     } else {
-        lastItemPos = 45;
+        lastItemPos = 85;
         editContent.css("top", lastItemPos + 15 + "px").css("left", lastItemLeft + 255 + "px").appendTo("#data");
     }    
     main.appendTo(editContent);
@@ -538,13 +562,12 @@ function changeStyle(val){
             $(".b_bottom_left").removeClass("bbl_pad").removeClass("without_back");
             $(".b_bottom_center").removeClass("bbc_pad").removeClass("without_back");
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
-            $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_add").removeClass("pad_color").removeClass("pad_add");
+            $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -556,13 +579,12 @@ function changeStyle(val){
             $(".b_bottom_left").addClass("bbl_pad").removeClass("without_back");
             $(".b_bottom_center").addClass("bbc_pad").removeClass("without_back");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
-            $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_add").addClass("pad_color").addClass("pad_add");
+            $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -573,14 +595,13 @@ function changeStyle(val){
             $(".b_bottom_right").addClass("without_back").removeClass("bbr_pad");
             $(".b_bottom_left").addClass("without_back").removeClass("bbl_pad");
             $(".b_bottom_center").addClass("without_back").removeClass("bbc_pad");
+            $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_help").addClass("pad_color").addClass("pad_help");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_add").addClass("pad_color").addClass("pad_add");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
     if($("#wgt_edit").hasClass("selected"))
diff --git a/resources/library/interactivities/Enveloppe.wgt/js/help_fr-template.js b/resources/library/interactivities/Enveloppe.wgt/js/help_fr-template.js
index 17301536..44e0fc11 100644
--- a/resources/library/interactivities/Enveloppe.wgt/js/help_fr-template.js
+++ b/resources/library/interactivities/Enveloppe.wgt/js/help_fr-template.js
@@ -8,7 +8,7 @@
 <p>Le bouton “Modifier” vous permet : </p>
 <ul>
 <li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut tablette), </li>
-<li>de déterminer le nombre de trombone(s) souhaités.</li> 
+<li>de déterminer le nombre de trombone(s) souhaité(s).</li> 
 </ul>
 
 <p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>
\ No newline at end of file
diff --git a/resources/library/interactivities/Etudier.wgt/css/basic.css b/resources/library/interactivities/Etudier.wgt/css/basic.css
index 0c107f14..f9516240 100644
--- a/resources/library/interactivities/Etudier.wgt/css/basic.css
+++ b/resources/library/interactivities/Etudier.wgt/css/basic.css
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -28,14 +28,6 @@ body{
     margin: 5px 10px;
 }
 
-.green_point{
-    background-image: url(../img/green_point.png);
-}
-
-.red_point{
-    background-image: url(../img/red_point.png);
-}
-
 #display_text, #edit_text{
     height: 19px;
     padding: 3px 0 0 0;
@@ -362,57 +354,33 @@ li>div{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
-#wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
+#wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-#wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -447,58 +415,88 @@ li>div{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
     background-color: #ccc;
-    padding: 5px 0 5px 5px;
+    padding: 5px;
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Etudier.wgt/img/ar_down.png b/resources/library/interactivities/Etudier.wgt/img/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/ar_down_white.png b/resources/library/interactivities/Etudier.wgt/img/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/green_point.png b/resources/library/interactivities/Etudier.wgt/img/green_point.png
deleted file mode 100644
index a2a44680..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/green_point.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/parameters-bg.png b/resources/library/interactivities/Etudier.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Etudier.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/red_point.png b/resources/library/interactivities/Etudier.wgt/img/red_point.png
deleted file mode 100644
index f6daa19a..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/red_point.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/slate-display.png b/resources/library/interactivities/Etudier.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/slate-edit.png b/resources/library/interactivities/Etudier.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/slate-help-white.png b/resources/library/interactivities/Etudier.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/slate-help.png b/resources/library/interactivities/Etudier.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Etudier.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/toolbar-edit.png b/resources/library/interactivities/Etudier.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Etudier.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/toolbar-help.png b/resources/library/interactivities/Etudier.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Etudier.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Etudier.wgt/img/toolbar-reload.png b/resources/library/interactivities/Etudier.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Etudier.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Etudier.wgt/index.html b/resources/library/interactivities/Etudier.wgt/index.html
index c21be121..3029c850 100644
--- a/resources/library/interactivities/Etudier.wgt/index.html
+++ b/resources/library/interactivities/Etudier.wgt/index.html
@@ -52,11 +52,6 @@
                     <div id="wgt_help"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -66,6 +61,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="slider">
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                         <ul>							
                         </ul>
                     </div>
diff --git a/resources/library/interactivities/Etudier.wgt/js/script.js b/resources/library/interactivities/Etudier.wgt/js/script.js
index 476167a4..fe372d38 100644
--- a/resources/library/interactivities/Etudier.wgt/js/script.js
+++ b/resources/library/interactivities/Etudier.wgt/js/script.js
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Display", 
+    display: "Close", 
     edit: "Edit", 
     text_content: "This is an example. Instead of this text you can put your own content.", 
     new_txt: "New text block",
@@ -9,7 +9,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 //some flags
@@ -31,9 +32,11 @@ function start(){
     $("#wgt_name").text(sankoreLang.wgt_name);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("etudier","")){
@@ -44,7 +47,7 @@ function start(){
             showExample();
         if(sankore.preference("etudier_style","")){
             changeStyle(sankore.preference("etudier_style",""));
-            $(".style_select").val(sankore.preference("etudier_style",""));
+            $("#style_select").val(sankore.preference("etudier_style",""));
         } else
             changeStyle("3")
     } 
@@ -56,7 +59,7 @@ function start(){
         window.widget.onleave = function(){
             if(!$("#wgt_help").hasClass("open")){
                 exportData();
-                sankore.setPreference("etudier_style", $(".style_select").find("option:selected").val());
+                sankore.setPreference("etudier_style", $("#style_select").find("option:selected").val());
                 sankore.setPreference("etudier_cur_page", $("#slider").getPage());
                 sankore.setPreference("etudier_left_nav", $("#prevBtn a").css("display"));
                 sankore.setPreference("etudier_right_nav", $("#nextBtn a").css("display"));
@@ -64,19 +67,21 @@ function start(){
         }
     }
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").hide();
             tmp.removeClass("open");
             $("#slider").show();
         } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             exportData();
-            sankore.setPreference("etudier_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("etudier_style", $("#style_select").find("option:selected").val());
             sankore.setPreference("etudier_cur_page", $("#slider").getPage());
             sankore.setPreference("etudier_left_nav", $("#prevBtn a").css("display"));
             sankore.setPreference("etudier_right_nav", $("#nextBtn a").css("display"));            
@@ -93,8 +98,10 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
-                
+                $("#parameters").css("display","none");
+                var tmpwh = $(window).height();
+                var tmpww = $(window).width();
+                window.resizeTo(tmpww, tmpwh - 44)
                 $("#slider li>div").each(function(){
                     var container = $(this);
                     container.removeAttr("ondragenter")
@@ -143,8 +150,10 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
-                
+                $("#parameters").css("display","block");
+                tmpwh = $(window).height();
+                tmpww = $(window).width();
+                window.resizeTo(tmpww, tmpwh + 44)
                 $("#slider li>div").each(function(){
                     var container = $(this);
                     container.attr("ondragenter", "return false;")
@@ -556,10 +565,10 @@ function changeStyle(val){
             $(".b_bottom_center").removeClass("bbc_pad").removeClass("without_back");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -572,10 +581,10 @@ function changeStyle(val){
             $(".b_bottom_center").addClass("bbc_pad").removeClass("without_back");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -588,10 +597,10 @@ function changeStyle(val){
             $(".b_bottom_center").addClass("without_back").removeClass("bbc_pad");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Etudier.wgt/locales/fr/index.html b/resources/library/interactivities/Etudier.wgt/locales/fr/index.html
index a33496df..5d8f1724 100644
--- a/resources/library/interactivities/Etudier.wgt/locales/fr/index.html
+++ b/resources/library/interactivities/Etudier.wgt/locales/fr/index.html
@@ -25,12 +25,7 @@
                     <div id="wgt_name"></div>
                     <div id="wgt_help"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,6 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="slider">
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                         <ul>							
                         </ul>
                     </div>
diff --git a/resources/library/interactivities/Etudier.wgt/locales/fr/js/script.js b/resources/library/interactivities/Etudier.wgt/locales/fr/js/script.js
index 2b10962a..3d9d5b47 100644
--- a/resources/library/interactivities/Etudier.wgt/locales/fr/js/script.js
+++ b/resources/library/interactivities/Etudier.wgt/locales/fr/js/script.js
@@ -10,25 +10,28 @@ var sankoreLang = {
     none: "Aucun",
     help: "Aide",
     help_content: "<p><h2>Etudier</h2></p>"+
-"<p><h3>Livret de pages.</h3></p>"+
+    "<p><h3>Livret de pages.</h3></p>"+
 
-"<p>L’interactivité Etudier permet d’ajouter un livret avec des pages. Ce livret peut être enrichi avec du texte, des images, du son et des vidéos.</p>"+
+    "<p>L’interactivité Etudier permet d’ajouter un livret avec des pages. Ce livret peut être enrichi avec du texte, des images, du son et des vidéos.</p>"+
+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
+    "<li>de modifier les pages du livret.</li></ul>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
-"<li>de modifier les pages du livret.</li></ul>"+
 
 "<p>Sur chaque page, vous pouvez :</p>"+ 
-"<ul><li>insérer des zones de texte avec le bouton “+T” situé en haut à gauche de l’interactivité. (pour modifier ces zones de texte, cliquez à l’intérieur et écrivez du texte),</li>"+
+"<ul><li>insérer des zones de texte avec le bouton “+T” situé en haut à gauche de l’interactivité (pour modifier ces zones de texte, cliquez à l’intérieur et écrivez du texte),</li>"+
 "<li>insérer des images, sons et vidéos par glisser-déposer de fichiers depuis la bibliothèque jusqu’à l’intérieur de la page du livret,</li>"+
 "<li>déplacer les textes, images, sons et vidéos à l’intérieur de la page en cliquant et en déplaçant la flèche multidirectionnelle qui se situe dans le coin supérieur gauche de chaque élément,</li>"+
 "<li>agrandir la taille d’un élément avec la double flèche en bas à droite de celui-ci,</li>"+
 "<li>supprimer un élément avec la case en haut à droite de celui-ci.</li></ul>"+
 
-"<p>Pour ajouter une page, cliquez sur la flèche verte accompagnée d’un “+” se trouvant en bas à gauche et à droite.</p>"+
-"<p>Pour supprimer une page, cliquez sur la croix rouge située en haut à droite de la page.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Pour ajouter une page, cliquez sur la flèche verte accompagnée d’un “+” se trouvant en bas à gauche et à droite.</p>"+
+    "<p>Pour supprimer une page, cliquez sur la croix rouge située en haut à droite de la page.</p>"+
+
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 
 };
 
@@ -51,9 +54,11 @@ function start(){
     $("#wgt_name").text(sankoreLang.wgt_name);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("etudier","")){
@@ -64,7 +69,7 @@ function start(){
             showExample();
         if(sankore.preference("etudier_style","")){
             changeStyle(sankore.preference("etudier_style",""));
-            $(".style_select").val(sankore.preference("etudier_style",""));
+            $("#style_select").val(sankore.preference("etudier_style",""));
         } else
             changeStyle("3")
     } 
@@ -76,7 +81,7 @@ function start(){
         window.widget.onleave = function(){
             if(!$("#wgt_help").hasClass("open")){
                 exportData();
-                sankore.setPreference("etudier_style", $(".style_select").find("option:selected").val());
+                sankore.setPreference("etudier_style", $("#style_select").find("option:selected").val());
                 sankore.setPreference("etudier_cur_page", $("#slider").getPage());
                 sankore.setPreference("etudier_left_nav", $("#prevBtn a").css("display"));
                 sankore.setPreference("etudier_right_nav", $("#nextBtn a").css("display"));
@@ -84,19 +89,21 @@ function start(){
         }
     }
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").hide();
             tmp.removeClass("open");
             $("#slider").show();
         } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             exportData();
-            sankore.setPreference("etudier_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("etudier_style", $("#style_select").find("option:selected").val());
             sankore.setPreference("etudier_cur_page", $("#slider").getPage());
             sankore.setPreference("etudier_left_nav", $("#prevBtn a").css("display"));
             sankore.setPreference("etudier_right_nav", $("#nextBtn a").css("display"));            
@@ -113,7 +120,10 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
+                var tmpwh = $(window).height();
+                var tmpww = $(window).width();
+                window.resizeTo(tmpww, tmpwh - 44)
                 
                 $("#slider li>div").each(function(){
                     var container = $(this);
@@ -163,7 +173,10 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
+                tmpwh = $(window).height();
+                tmpww = $(window).width();
+                window.resizeTo(tmpww, tmpwh + 44)
                 
                 $("#slider li>div").each(function(){
                     var container = $(this);
@@ -577,10 +590,10 @@ function changeStyle(val){
             $(".b_bottom_center").removeClass("bbc_pad").removeClass("without_back");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -593,10 +606,10 @@ function changeStyle(val){
             $(".b_bottom_center").addClass("bbc_pad").removeClass("without_back");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -609,10 +622,10 @@ function changeStyle(val){
             $(".b_bottom_center").addClass("without_back").removeClass("bbc_pad");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Etudier.wgt/locales/ru/index.html b/resources/library/interactivities/Etudier.wgt/locales/ru/index.html
index a33496df..5d8f1724 100644
--- a/resources/library/interactivities/Etudier.wgt/locales/ru/index.html
+++ b/resources/library/interactivities/Etudier.wgt/locales/ru/index.html
@@ -25,12 +25,7 @@
                     <div id="wgt_name"></div>
                     <div id="wgt_help"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,6 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="slider">
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                         <ul>							
                         </ul>
                     </div>
diff --git a/resources/library/interactivities/Etudier.wgt/locales/ru/js/script.js b/resources/library/interactivities/Etudier.wgt/locales/ru/js/script.js
index eb5df17c..0fcfd790 100644
--- a/resources/library/interactivities/Etudier.wgt/locales/ru/js/script.js
+++ b/resources/library/interactivities/Etudier.wgt/locales/ru/js/script.js
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Показать", 
+    display: "Закрыть", 
     edit: "Изменить",
     text_content: "Это - пример. Вместо этого текста вы можете ввести свой собственный контент.", 
     new_txt: "Новый текстовый блок.",
@@ -9,7 +9,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 //some flags
@@ -31,9 +32,11 @@ function start(){
     $("#wgt_name").text(sankoreLang.wgt_name);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("etudier","")){
@@ -44,7 +47,7 @@ function start(){
             showExample();
         if(sankore.preference("etudier_style","")){
             changeStyle(sankore.preference("etudier_style",""));
-            $(".style_select").val(sankore.preference("etudier_style",""));
+            $("#style_select").val(sankore.preference("etudier_style",""));
         } else
             changeStyle("3")
     } 
@@ -56,7 +59,7 @@ function start(){
         window.widget.onleave = function(){
             if(!$("#wgt_help").hasClass("open")){
                 exportData();
-                sankore.setPreference("etudier_style", $(".style_select").find("option:selected").val());
+                sankore.setPreference("etudier_style", $("#style_select").find("option:selected").val());
                 sankore.setPreference("etudier_cur_page", $("#slider").getPage());
                 sankore.setPreference("etudier_left_nav", $("#prevBtn a").css("display"));
                 sankore.setPreference("etudier_right_nav", $("#nextBtn a").css("display"));
@@ -64,19 +67,21 @@ function start(){
         }
     }
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").hide();
             tmp.removeClass("open");
             $("#slider").show();
         } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             exportData();
-            sankore.setPreference("etudier_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("etudier_style", $("#style_select").find("option:selected").val());
             sankore.setPreference("etudier_cur_page", $("#slider").getPage());
             sankore.setPreference("etudier_left_nav", $("#prevBtn a").css("display"));
             sankore.setPreference("etudier_right_nav", $("#nextBtn a").css("display"));            
@@ -93,7 +98,10 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
+                var tmpwh = $(window).height();
+                var tmpww = $(window).width();
+                window.resizeTo(tmpww, tmpwh - 44)
                 
                 $("#slider li>div").each(function(){
                     var container = $(this);
@@ -109,7 +117,8 @@ function start(){
                         $(this).find(".size_up").remove();
                         $(this).find(".size_down").remove();
                         $(this).find(".resize_block").remove();
-                        $(this).removeAttr("contenteditable").removeClass("block_border");
+                        $(this).find(".real_text").removeAttr("contenteditable");
+                        $(this).removeClass("block_border");
                         $(this).css("position","absolute");
                     });
                     
@@ -142,7 +151,10 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
+                tmpwh = $(window).height();
+                tmpww = $(window).width();
+                window.resizeTo(tmpww, tmpwh + 44)
                 
                 $("#slider li>div").each(function(){
                     var container = $(this);
@@ -158,7 +170,8 @@ function start(){
                         $("<div class='size_up' contenteditable='false'>").appendTo($(this));
                         $("<div class='size_down' contenteditable='false'>").appendTo($(this));
                         $("<div class='resize_block' contenteditable='false'>").appendTo($(this));
-                        $(this).attr("contenteditable", "true").addClass("block_border");
+                        $(this).find(".real_text").attr("contenteditable", "true");
+                        $(this).addClass("block_border");
                     });
                     
                     container.find(".img_block").each(function(){
@@ -292,7 +305,7 @@ function start(){
                 //var height = resize_obj.object.parent().height() - resize_obj.top + event.clientY;
                 resize_obj.left = event.clientX;
                 resize_obj.top = event.clientY;
-                resize_obj.object.parent().width(width).height("");
+                resize_obj.object.parent().width(width);
             } else {
                 width = resize_obj.object.parent().width() - resize_obj.left + event.clientX;
                 var height = resize_obj.object.parent().height() - resize_obj.top + event.clientY;
@@ -367,13 +380,13 @@ function start(){
     
     $(".add_text").live("click", function(){
         var container = $(this).parent();
-        var text_block = $("<div class='text_block'>" + sankoreLang.new_txt + "</div>").appendTo(container);
+        var text_block = $("<div class='text_block'><div class='real_text' contenteditable='true'>" + sankoreLang.new_txt + "</div></div>").appendTo(container);
         $("<div class='move_block' contenteditable='false'>").appendTo(text_block);
         $("<div class='close_img' contenteditable='false'>").appendTo(text_block);
         $("<div class='size_up' contenteditable='false'>").appendTo(text_block);
         $("<div class='size_down' contenteditable='false'>").appendTo(text_block);
         $("<div class='resize_block' contenteditable='false'>").appendTo(text_block);
-        text_block.attr("contenteditable", "true").addClass("block_border");
+        text_block.addClass("block_border");
     });
 }
 
@@ -391,7 +404,7 @@ function exportData(){
             txt_block.left = $(this).position().left;
             txt_block.w = $(this).width();
             txt_block.fz = $(this).css("font-size");
-            txt_block.val = $(this).text();
+            txt_block.val = $(this).find(".real_text").html();
             cont_obj.text.push(txt_block);
         });
         cont_obj.imgs = [];
@@ -433,7 +446,7 @@ function importData(data){
         var div = $("<div>").appendTo(li);
         
         for(var j in data[i].text){
-            var text_div = $("<div class='text_block'>" + data[i].text[j].val + "</div>");
+            var text_div = $("<div class='text_block'><div class='real_text'>" + data[i].text[j].val + "</div></div>");
             text_div.draggable().css("position","absolute")
             .width(data[i].text[j].w)
             .css("top", data[i].text[j].top)
@@ -486,7 +499,7 @@ function showExample(){
     
     var li1 = $("<li>");
     var div1 = $("<div>").appendTo(li1);
-    $("<div class='text_block'>" + sankoreLang.text_content + "</div>").draggable().appendTo(div1)
+    $("<div class='text_block'><div class='real_text'>" + sankoreLang.text_content + "</div></div>").draggable().appendTo(div1)
     li1.width($("#slider").width()).height($("#slider").height());
     $("#slider ul").append(li1);
     var li2 = $("<li>");
@@ -507,7 +520,7 @@ function showExample(){
     $("#slider ul").append(li3);
     var li4 = $("<li>");
     var div4 = $("<div>").appendTo(li4);
-    $("<div class='text_block'>" + sankoreLang.text_content + "</div>").draggable().appendTo(div4);
+    $("<div class='text_block'><div class='real_text'>" + sankoreLang.text_content + "</div></div>").draggable().appendTo(div4);
     var img2 = $("<div class='img_block' style='text-align: center;'></div>").draggable().appendTo(div4);
     $("<img src=\"../../objects/1.gif\" style=\"display: inline;\" height=\"120\"/>").appendTo(img2);
     var audio_block2 = $("<div class='audio_block'>").draggable().appendTo(div4);
@@ -555,10 +568,10 @@ function changeStyle(val){
             $(".b_bottom_center").removeClass("bbc_pad").removeClass("without_back");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -571,10 +584,10 @@ function changeStyle(val){
             $(".b_bottom_center").addClass("bbc_pad").removeClass("without_back");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -587,10 +600,10 @@ function changeStyle(val){
             $(".b_bottom_center").addClass("without_back").removeClass("bbc_pad");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -663,4 +676,4 @@ $(window).resize(function(){
         $(this).width(slider.width()).height(slider.height());
     });
     slider.setSize(slider.width(), slider.height());
-})
+})
\ No newline at end of file
diff --git a/resources/library/interactivities/Ordre images.wgt/css/basic.css b/resources/library/interactivities/Ordre images.wgt/css/basic.css
index 48ab3bb5..930b66f4 100644
--- a/resources/library/interactivities/Ordre images.wgt/css/basic.css	
+++ b/resources/library/interactivities/Ordre images.wgt/css/basic.css	
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;    
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -28,14 +28,6 @@ body{
     margin: 5px 10px;
 }
 
-.green_point{
-    background-image: url(../img/green_point.png);
-}
-
-.red_point{
-    background-image: url(../img/red_point.png);
-}
-
 #display_text, #edit_text{
     height: 19px;
     padding: 3px 0 0 0;
@@ -245,57 +237,40 @@ body{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -330,51 +305,50 @@ body{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -383,5 +357,36 @@ body{
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Ordre images.wgt/img/ar_down.png b/resources/library/interactivities/Ordre images.wgt/img/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/ar_down_white.png b/resources/library/interactivities/Ordre images.wgt/img/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/green_point.png b/resources/library/interactivities/Ordre images.wgt/img/green_point.png
deleted file mode 100644
index a2a44680..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/green_point.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/parameters-bg.png b/resources/library/interactivities/Ordre images.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Ordre images.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/red_point.png b/resources/library/interactivities/Ordre images.wgt/img/red_point.png
deleted file mode 100644
index f6daa19a..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/red_point.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/slate-display.png b/resources/library/interactivities/Ordre images.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/slate-edit.png b/resources/library/interactivities/Ordre images.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/slate-help-white.png b/resources/library/interactivities/Ordre images.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/slate-help.png b/resources/library/interactivities/Ordre images.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Ordre images.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/toolbar-edit.png b/resources/library/interactivities/Ordre images.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Ordre images.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/toolbar-help.png b/resources/library/interactivities/Ordre images.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Ordre images.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Ordre images.wgt/img/toolbar-reload.png b/resources/library/interactivities/Ordre images.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Ordre images.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Ordre images.wgt/index.html b/resources/library/interactivities/Ordre images.wgt/index.html
index 53ab2c3d..5ef629a0 100644
--- a/resources/library/interactivities/Ordre images.wgt/index.html	
+++ b/resources/library/interactivities/Ordre images.wgt/index.html	
@@ -51,12 +51,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -66,7 +61,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre images.wgt/js/script.js b/resources/library/interactivities/Ordre images.wgt/js/script.js
index f0a4ca0c..c19678e4 100644
--- a/resources/library/interactivities/Ordre images.wgt/js/script.js	
+++ b/resources/library/interactivities/Ordre images.wgt/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Display", 
+    display: "Close", 
     edit: "Edit", 
     short_desc: "Place the pictures in ascending order.", 
     add: "Add new block",
@@ -10,7 +10,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 //main function
@@ -22,9 +23,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("odr_des_imgs","")){
@@ -47,11 +50,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -72,7 +77,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -83,7 +88,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -130,7 +135,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 $(".cont").each(function(){
                     var container = $(this);
     
@@ -214,7 +219,7 @@ function exportData(){
     }
     $(".cont").each(function(){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.text = $(this).find(".text_cont").text();
         cont_obj.right = $(this).find(".imgs_cont>input").val();
         cont_obj.imgs = [];
@@ -231,7 +236,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -254,12 +259,12 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         }
         else {
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             var tmp_array = [];
             var container = $("<div class='cont'>");
@@ -451,10 +456,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -468,10 +473,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -485,10 +490,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Ordre images.wgt/locales/fr/index.html b/resources/library/interactivities/Ordre images.wgt/locales/fr/index.html
index 6151ae43..b8c4d872 100644
--- a/resources/library/interactivities/Ordre images.wgt/locales/fr/index.html	
+++ b/resources/library/interactivities/Ordre images.wgt/locales/fr/index.html	
@@ -25,12 +25,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre images.wgt/locales/fr/js/script.js b/resources/library/interactivities/Ordre images.wgt/locales/fr/js/script.js
index ca851845..153d5c08 100644
--- a/resources/library/interactivities/Ordre images.wgt/locales/fr/js/script.js	
+++ b/resources/library/interactivities/Ordre images.wgt/locales/fr/js/script.js	
@@ -1,6 +1,6 @@
 
 var sankoreLang = {
-    display: "Afficher", 
+    display: "Fermer", 
     edit: "Modifier", 
     short_desc: "Placez les images dans l'ordre croissant.", 
     add: "Nouveau bloc",
@@ -12,28 +12,29 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Ordonner des images</h2></p>"+
-"<p><h3>Classer des images dans l’ordre demandé.</h3></p>"+
+    "<p><h3>Classer des images dans l’ordre demandé.</h3></p>"+
 
-"<p>La consigne indique dans quel ordre les images doivent être classées. Le classement des images s’effectue par un glisser-déposer. Une fois que toutes les images sont correctement classées, la zone se colore en vert.</p>"+
+    "<p>La consigne indique dans quel ordre les images doivent être classées. Le classement des images s’effectue par un glisser-déposer. Une fois que toutes les images sont correctement classées, la zone se colore en vert.</p>"+
 
-"<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
+    "<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
-"<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
+    "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
 
-"<p>Pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis</p>"+
-"<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir votre consigne ici …”,</li>"+
-"<li>insérez des images dans les zones de dépôt par glisser-déposer des images à partir de votre bibliothèque,</li>"+
-"<li>modifiez éventuellement l’ordre des images par un glisser-déposer de l’image concernée pour la mettre au bon endroit dans la suite.</li></ul>"+
+    "<p>Pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis</p>"+
+    "<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir votre consigne ici …”,</li>"+
+    "<li>insérez des images dans les zones de dépôt par glisser-déposer des images à partir de votre bibliothèque,</li>"+
+    "<li>modifiez éventuellement l’ordre des images par un glisser-déposer de l’image concernée pour la mettre au bon endroit dans la suite.</li></ul>"+
 
-"<p>Pour ajouter une zone image, cliquez sur le gros “+” en bas.</p>"+
-"<p>Pour supprimer une zone image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+
-"<p>Pour changer d’image, cliquez sur l’icône située au milieu à droite de l’image.</p>"+ 
+    "<p>Pour ajouter une zone image, cliquez sur le gros “+” en bas.</p>"+
+    "<p>Pour supprimer une zone image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+
+    "<p>Pour changer d’image, cliquez sur l’icône située au milieu à droite de l’image.</p>"+ 
 
-"<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
+    "<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 };
 
 //main function
@@ -45,9 +46,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("odr_des_imgs","")){
@@ -70,11 +73,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -95,7 +100,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -105,7 +110,7 @@ function start(){
                 sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -151,7 +156,7 @@ function start(){
                 sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 $(".cont").each(function(){
                     var container = $(this);
     
@@ -235,7 +240,7 @@ function exportData(){
     }
     $(".cont").each(function(){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.text = $(this).find(".text_cont").text();
         cont_obj.right = $(this).find(".imgs_cont>input").val();
         cont_obj.imgs = [];
@@ -252,7 +257,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -270,11 +275,11 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         }else{
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             var tmp_array = [];
             var container = $("<div class='cont'>");
@@ -465,10 +470,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -482,10 +487,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -499,10 +504,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Ordre images.wgt/locales/ru/index.html b/resources/library/interactivities/Ordre images.wgt/locales/ru/index.html
index 6151ae43..b8c4d872 100644
--- a/resources/library/interactivities/Ordre images.wgt/locales/ru/index.html	
+++ b/resources/library/interactivities/Ordre images.wgt/locales/ru/index.html	
@@ -25,12 +25,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre images.wgt/locales/ru/js/script.js b/resources/library/interactivities/Ordre images.wgt/locales/ru/js/script.js
index 4f709a3c..0bce5739 100644
--- a/resources/library/interactivities/Ordre images.wgt/locales/ru/js/script.js	
+++ b/resources/library/interactivities/Ordre images.wgt/locales/ru/js/script.js	
@@ -1,6 +1,6 @@
 
 var sankoreLang = {
-    display: "Показать", 
+    display: "Закрыть", 
     edit: "Изменить", 
     short_desc: "Расположите картинки в порядке возрастания цифр.", 
     add: "Новый блок",
@@ -11,7 +11,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 //main function
@@ -23,9 +24,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("odr_des_imgs","")){
@@ -48,11 +51,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -73,7 +78,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -83,7 +88,7 @@ function start(){
                 sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -129,7 +134,7 @@ function start(){
                 sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 $(".cont").each(function(){
                     var container = $(this);
     
@@ -213,7 +218,7 @@ function exportData(){
     }
     $(".cont").each(function(){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.text = $(this).find(".text_cont").text();
         cont_obj.right = $(this).find(".imgs_cont>input").val();
         cont_obj.imgs = [];
@@ -230,7 +235,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -248,11 +253,11 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         }else{
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             var tmp_array = [];
             var container = $("<div class='cont'>");
@@ -443,10 +448,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -460,10 +465,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -477,10 +482,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -518,7 +523,6 @@ function onDropTarget(obj, event) {
                 tmp_img.attr("height",h);
                 tmp_img.css("margin",(120 - tmp_img.height())/2 + "px 0");
             }
-            exportData();
         }, 6)
     }
     else {
diff --git a/resources/library/interactivities/Ordre lettres.wgt/css/basic.css b/resources/library/interactivities/Ordre lettres.wgt/css/basic.css
index 4573addc..bd270ede 100644
--- a/resources/library/interactivities/Ordre lettres.wgt/css/basic.css	
+++ b/resources/library/interactivities/Ordre lettres.wgt/css/basic.css	
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -28,14 +28,6 @@ body{
     margin: 5px 10px;
 }
 
-.green_point{
-    background-image: url(../img/green_point.png);
-}
-
-.red_point{
-    background-image: url(../img/red_point.png);
-}
-
 #display_text, #edit_text{
     height: 19px;
     padding: 3px 0 0 0;
@@ -306,57 +298,40 @@ body{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -391,51 +366,50 @@ body{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -444,5 +418,36 @@ body{
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/green_point.png b/resources/library/interactivities/Ordre lettres.wgt/img/green_point.png
deleted file mode 100644
index a2a44680..00000000
Binary files a/resources/library/interactivities/Ordre lettres.wgt/img/green_point.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/parameters-bg.png b/resources/library/interactivities/Ordre lettres.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Ordre lettres.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/red_point.png b/resources/library/interactivities/Ordre lettres.wgt/img/red_point.png
deleted file mode 100644
index f6daa19a..00000000
Binary files a/resources/library/interactivities/Ordre lettres.wgt/img/red_point.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/slate-display.png b/resources/library/interactivities/Ordre lettres.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Ordre lettres.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/slate-edit.png b/resources/library/interactivities/Ordre lettres.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Ordre lettres.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/slate-help-white.png b/resources/library/interactivities/Ordre lettres.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Ordre lettres.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/slate-help.png b/resources/library/interactivities/Ordre lettres.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Ordre lettres.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Ordre lettres.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-edit.png b/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-help.png b/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-reload.png b/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Ordre lettres.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Ordre lettres.wgt/index.html b/resources/library/interactivities/Ordre lettres.wgt/index.html
index 1ccdeec9..a5328ff0 100644
--- a/resources/library/interactivities/Ordre lettres.wgt/index.html	
+++ b/resources/library/interactivities/Ordre lettres.wgt/index.html	
@@ -52,11 +52,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -66,7 +61,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre lettres.wgt/js/script.js b/resources/library/interactivities/Ordre lettres.wgt/js/script.js
index d3ca2c70..a9c844d8 100644
--- a/resources/library/interactivities/Ordre lettres.wgt/js/script.js	
+++ b/resources/library/interactivities/Ordre lettres.wgt/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Display", 
+    display: "Close", 
     edit: "Edit", 
     short_desc: "Listen to the sound and make the correct word.", 
     add: "Add new block",
@@ -11,7 +11,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 //main function
@@ -23,9 +24,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer_sound","")){
@@ -36,7 +39,7 @@ function start(){
             showExample();
         if(sankore.preference("ord_let_style","")){
             changeStyle(sankore.preference("ord_let_style",""));
-            $(".style_select").val(sankore.preference("ord_let_style",""));
+            $("#style_select").val(sankore.preference("ord_let_style",""));
         } else
             changeStyle("3")
     } 
@@ -46,18 +49,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("ord_let_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("ord_let_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -78,7 +83,7 @@ function start(){
         exportData();
     });
 
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -89,7 +94,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -124,7 +129,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 $(".cont").each(function(){
                     var container = $(this);
                     $("<div class='close_cont'>").appendTo(container);
@@ -446,10 +451,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -463,10 +468,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -480,10 +485,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Ordre lettres.wgt/locales/fr/index.html b/resources/library/interactivities/Ordre lettres.wgt/locales/fr/index.html
index 035d2684..cb3d1b52 100644
--- a/resources/library/interactivities/Ordre lettres.wgt/locales/fr/index.html	
+++ b/resources/library/interactivities/Ordre lettres.wgt/locales/fr/index.html	
@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre lettres.wgt/locales/fr/js/script.js b/resources/library/interactivities/Ordre lettres.wgt/locales/fr/js/script.js
index 2e85339f..f37ff6a2 100644
--- a/resources/library/interactivities/Ordre lettres.wgt/locales/fr/js/script.js	
+++ b/resources/library/interactivities/Ordre lettres.wgt/locales/fr/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Afficher", 
+    display: "Fermer", 
     edit: "Modifier", 
     short_desc: "Ecoutez le son et replacer les lettres dans l'ordre.", 
     add: "Nouveau bloc",
@@ -12,26 +12,27 @@ var sankoreLang = {
     none: "Aucun",
     help: "Aide",
     help_content: "<p><h2>Ordre des lettres</h2></p>"+
-"<p><h3>Ordonner des lettres pour reconstituer un mot.</h3></p>"+
+    "<p><h3>Ordonner des lettres pour reconstituer un mot.</h3></p>"+
 
-"<p>L’intégration d’un fichier son (facultatif) permet d’écouter le mot à reconstituer. Lorsque les lettres sont dans le bon ordre, l’interactivité se colore en vert.</p>"+
+    "<p>L’intégration d’un fichier son (facultatif) permet d’écouter le mot à reconstituer. Lorsque les lettres sont dans le bon ordre, l’interactivité se colore en vert.</p>"+
 
-"<p>L’activité s’effectue par un glisser-déposer des étiquettes pour remettre les lettres en ordre.<b> NB : vous pouvez également utiliser cette activité avec des chiffres.</b></p>"+
+    "<p>L’activité s’effectue par un glisser-déposer des étiquettes pour remettre les lettres en ordre.<b> NB : vous pouvez également utiliser cette activité avec des chiffres.</b></p>"+
 
-"<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
+    "<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
-"<li>de déterminer le mot à reconstituer.</li></ul>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
+    "<li>de déterminer le mot à reconstituer.</li></ul>"+
  
-"<p>Pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis</p>"+
-"<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir la consigne ici ...”,</li>"+
-"<li>insérez un son dans la zone à gauche de la consigne par glisser-déposer d’un son à partir de votre bibliothèque (facultatif),</li>"+
-"<li>écrivez le mot souhaité à la place de “exemple”.</li></ul>"+
+    "<p>Pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis</p>"+
+    "<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir la consigne ici ...”,</li>"+
+    "<li>insérez un son dans la zone à gauche de la consigne par glisser-déposer d’un son à partir de votre bibliothèque (facultatif),</li>"+
+    "<li>écrivez le mot souhaité à la place de “exemple”.</li></ul>"+
 
-"<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
+    "<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 };
 
 //main function
@@ -43,9 +44,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer_sound","")){
@@ -56,7 +59,7 @@ function start(){
             showExample();
         if(sankore.preference("ord_let_style","")){
             changeStyle(sankore.preference("ord_let_style",""));
-            $(".style_select").val(sankore.preference("ord_let_style",""));
+            $("#style_select").val(sankore.preference("ord_let_style",""));
         } else
             changeStyle("3")
     } 
@@ -66,18 +69,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("ord_let_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("ord_let_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -98,7 +103,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -109,7 +114,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -133,7 +138,11 @@ function start(){
                     tmp_array = shuffle(tmp_array);
                     for(var i = 0; i<tmp_array.length;i++)
                         tmp_array[i].appendTo(ul_cont);
-                    ul_cont.sortable({revert: true, placeholder: "highlight", update: checkResult});
+                    ul_cont.sortable({
+                        revert: true, 
+                        placeholder: "highlight", 
+                        update: checkResult
+                    });
                 });
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
@@ -144,7 +153,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 $(".cont").each(function(){
                     var container = $(this);
                     $("<div class='close_cont'>").appendTo(container);
@@ -300,7 +309,7 @@ function importData(data){
         var audio_block = $("<div class='audio_block'>").appendTo(text);
         $("<div class='play'>").appendTo(audio_block);
         $("<div class='replay'>").appendTo(audio_block);
-        var source = $("<source/>").attr("src", "../../" + data[i].audio);
+        var source = $("<source/>").attr("src", data[i].audio);
         var audio = $("<audio>").appendTo(audio_block);
         audio.append(source);
         $("<input type='hidden'/>").appendTo(audio_block);
@@ -326,7 +335,10 @@ function importData(data){
         for(j = 0; j<tmp_array.length;j++)
             tmp_array[j].appendTo(imgs_container);
         
-        imgs_container.sortable({revert: true, placeholder: "highlight"}).bind('sortupdate', function(event, ui) {
+        imgs_container.sortable({
+            revert: true, 
+            placeholder: "highlight"
+        }).bind('sortupdate', function(event, ui) {
             checkResult(event);
         }); 
         if(data[i].cur_answer)
@@ -347,7 +359,7 @@ function showExample(){
     var audio_block = $("<div class='audio_block'>").appendTo(text);
     $("<div class='play'>").appendTo(audio_block);
     $("<div class='replay'>").appendTo(audio_block);
-    var source = $("<source/>").attr("src", "objects/beep.mp3");
+    var source = $("<source/>").attr("src", "objects/exemple.mp3");
     var audio = $("<audio>").appendTo(audio_block);
     audio.append(source);
     $("<input type='hidden'/>").appendTo(audio_block);
@@ -363,7 +375,10 @@ function showExample(){
     tmp_array = shuffle(tmp_array);
     for(var i = 0; i<tmp_array.length;i++)
         tmp_array[i].appendTo(imgs_container);
-    imgs_container.sortable({revert: true, placeholder: "highlight"}).bind('sortupdate', function(event, ui) {
+    imgs_container.sortable({
+        revert: true, 
+        placeholder: "highlight"
+    }).bind('sortupdate', function(event, ui) {
         checkResult(event);
     });
 }
@@ -460,10 +475,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -477,10 +492,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -494,10 +509,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Ordre lettres.wgt/locales/ru/index.html b/resources/library/interactivities/Ordre lettres.wgt/locales/ru/index.html
index 035d2684..cb3d1b52 100644
--- a/resources/library/interactivities/Ordre lettres.wgt/locales/ru/index.html	
+++ b/resources/library/interactivities/Ordre lettres.wgt/locales/ru/index.html	
@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre lettres.wgt/locales/ru/js/script.js b/resources/library/interactivities/Ordre lettres.wgt/locales/ru/js/script.js
index 3377a85c..05853cd2 100644
--- a/resources/library/interactivities/Ordre lettres.wgt/locales/ru/js/script.js	
+++ b/resources/library/interactivities/Ordre lettres.wgt/locales/ru/js/script.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Показать", 
+    display: "Закрыть", 
     edit: "Изменить", 
     short_desc: "Прослушайте звук и составьте корректное слово.", 
     add: "Новый блок",
@@ -11,10 +11,10 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
-
 //main function
 function start(){
 
@@ -24,9 +24,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer_sound","")){
@@ -37,7 +39,7 @@ function start(){
             showExample();
         if(sankore.preference("ord_let_style","")){
             changeStyle(sankore.preference("ord_let_style",""));
-            $(".style_select").val(sankore.preference("ord_let_style",""));
+            $("#style_select").val(sankore.preference("ord_let_style",""));
         } else
             changeStyle("3")
     } 
@@ -47,18 +49,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("ord_let_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("ord_let_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -79,7 +83,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -90,7 +94,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -114,7 +118,11 @@ function start(){
                     tmp_array = shuffle(tmp_array);
                     for(var i = 0; i<tmp_array.length;i++)
                         tmp_array[i].appendTo(ul_cont);
-                    ul_cont.sortable({revert: true, placeholder: "highlight", update: checkResult});
+                    ul_cont.sortable({
+                        revert: true, 
+                        placeholder: "highlight", 
+                        update: checkResult
+                    });
                 });
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
@@ -125,7 +133,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 $(".cont").each(function(){
                     var container = $(this);
                     $("<div class='close_cont'>").appendTo(container);
@@ -281,7 +289,7 @@ function importData(data){
         var audio_block = $("<div class='audio_block'>").appendTo(text);
         $("<div class='play'>").appendTo(audio_block);
         $("<div class='replay'>").appendTo(audio_block);
-        var source = $("<source/>").attr("src", "../../" + data[i].audio);
+        var source = $("<source/>").attr("src", data[i].audio);
         var audio = $("<audio>").appendTo(audio_block);
         audio.append(source);
         $("<input type='hidden'/>").appendTo(audio_block);
@@ -307,7 +315,10 @@ function importData(data){
         for(j = 0; j<tmp_array.length;j++)
             tmp_array[j].appendTo(imgs_container);
         
-        imgs_container.sortable({revert: true, placeholder: "highlight"}).bind('sortupdate', function(event, ui) {
+        imgs_container.sortable({
+            revert: true, 
+            placeholder: "highlight"
+        }).bind('sortupdate', function(event, ui) {
             checkResult(event);
         }); 
         if(data[i].cur_answer)
@@ -328,7 +339,7 @@ function showExample(){
     var audio_block = $("<div class='audio_block'>").appendTo(text);
     $("<div class='play'>").appendTo(audio_block);
     $("<div class='replay'>").appendTo(audio_block);
-    var source = $("<source/>").attr("src", "objects/beep.mp3");
+    var source = $("<source/>").attr("src", "objects/exemple.mp3");
     var audio = $("<audio>").appendTo(audio_block);
     audio.append(source);
     $("<input type='hidden'/>").appendTo(audio_block);
@@ -344,7 +355,10 @@ function showExample(){
     tmp_array = shuffle(tmp_array);
     for(var i = 0; i<tmp_array.length;i++)
         tmp_array[i].appendTo(imgs_container);
-    imgs_container.sortable({revert: true, placeholder: "highlight"}).bind('sortupdate', function(event, ui) {
+    imgs_container.sortable({
+        revert: true, 
+        placeholder: "highlight"
+    }).bind('sortupdate', function(event, ui) {
         checkResult(event);
     });
 }
@@ -441,10 +455,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -458,10 +472,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -475,10 +489,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Ordre mots.wgt/config.xml b/resources/library/interactivities/Ordre mots.wgt/config.xml
index 7b94a87e..0c0cf709 100644
--- a/resources/library/interactivities/Ordre mots.wgt/config.xml	
+++ b/resources/library/interactivities/Ordre mots.wgt/config.xml	
@@ -5,7 +5,7 @@
         id="http://www.example.net/widgets/helloworld" 
         version="1.1"
         width="850"
-        height="320" 
+        height="420" 
 	ub:resizable="true">
 		
 		<name>Words/Letters sortable</name>
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/ar_down.png b/resources/library/interactivities/Ordre mots.wgt/img/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Ordre mots.wgt/img/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/ar_down_white.png b/resources/library/interactivities/Ordre mots.wgt/img/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Ordre mots.wgt/img/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/parameters-bg.png b/resources/library/interactivities/Ordre mots.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Ordre mots.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/slate-display.png b/resources/library/interactivities/Ordre mots.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Ordre mots.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/slate-edit.png b/resources/library/interactivities/Ordre mots.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Ordre mots.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/slate-help-white.png b/resources/library/interactivities/Ordre mots.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Ordre mots.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/slate-help.png b/resources/library/interactivities/Ordre mots.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Ordre mots.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Ordre mots.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/toolbar-edit.png b/resources/library/interactivities/Ordre mots.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Ordre mots.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/toolbar-help.png b/resources/library/interactivities/Ordre mots.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Ordre mots.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/img/toolbar-reload.png b/resources/library/interactivities/Ordre mots.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Ordre mots.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Ordre mots.wgt/index.html b/resources/library/interactivities/Ordre mots.wgt/index.html
index 80615e61..0feab107 100644
--- a/resources/library/interactivities/Ordre mots.wgt/index.html	
+++ b/resources/library/interactivities/Ordre mots.wgt/index.html	
@@ -11,7 +11,7 @@
         <link rel="stylesheet" type="text/css" href="styles/master.css">
         <link rel="stylesheet" type="text/css" href="styles/of_puppets.css">
         <link rel="stylesheet" href="styles/fonts/Lobster/stylesheet.css">
-	<link rel="stylesheet" href="styles/fonts/SF-Toontime/stylesheet.css">
+        <link rel="stylesheet" href="styles/fonts/SF-Toontime/stylesheet.css">
         <!--Scripts-->
         <script type="text/javascript" src="scripts/jquery-1.6.2.min.js"></script>
         <script type="text/javascript" src="scripts/jquery-ui-1.8.9.custom.min.js"></script>
@@ -62,12 +62,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -77,12 +72,21 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
-            </tr>     
-
+            </tr>
             <tr style="height: 54px;">
                 <td class="b_bottom_left">&nbsp;</td>
                 <td class="b_bottom_center">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre mots.wgt/locales/fr/index.html b/resources/library/interactivities/Ordre mots.wgt/locales/fr/index.html
index 8918641f..801b68cb 100644
--- a/resources/library/interactivities/Ordre mots.wgt/locales/fr/index.html	
+++ b/resources/library/interactivities/Ordre mots.wgt/locales/fr/index.html	
@@ -33,12 +33,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -48,7 +43,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre mots.wgt/locales/fr/scripts/template2.js b/resources/library/interactivities/Ordre mots.wgt/locales/fr/scripts/template2.js
index 73cf4c40..9a64ac27 100644
--- a/resources/library/interactivities/Ordre mots.wgt/locales/fr/scripts/template2.js	
+++ b/resources/library/interactivities/Ordre mots.wgt/locales/fr/scripts/template2.js	
@@ -27,7 +27,7 @@ function checkResponse()
 */
 
 var sankoreLang = {
-    view: "Afficher", 
+    view: "Fermer", 
     edit: "Modifier",
     example: "Il*était*une*fois*...",
     wgt_name: "Ordonner des mots",
@@ -37,20 +37,21 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Ordonner des mots</h2></p>"+
-"<p><h3>Ordonner des mots pour reconstituer une phrase.</h3></p>"+
+    "<p><h3>Ordonner des mots pour reconstituer une phrase.</h3></p>"+
 
-"<p>Des étiquettes avec des mots sont dans le désordre. Le but est de les remettre en ordre pour avoir un énoncé compréhensible et correct. Lorsque l’énoncé est en ordre, l’interactivité se colore en vert. L’activité s’effectue par un glisser-déposer des étiquettes pour remettre les mots en ordre.</p>"+
+    "<p>Des étiquettes avec des mots sont dans le désordre. Le but est de les remettre en ordre pour avoir un énoncé compréhensible et correct. Lorsque l’énoncé est en ordre, l’interactivité se colore en vert. L’activité s’effectue par un glisser-déposer des étiquettes pour remettre les mots en ordre.</p>"+
 
-"<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
+    "<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
-"<li>de déterminer la phrase à reconstituer et les séparations dans l’énoncé.</li></ul>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
+    "<li>de déterminer la phrase à reconstituer et les séparations dans l’énoncé.</li></ul>"+
 
-"<p>Pour insérer du texte dans la zone, cliquez sur la zone et saisissez la phrase souhaitée. </p>"+
-"<p>Pour ajouter des espaces dans la phrase, insérer une étoile * entre chaque mot. Votre texte sera séparé autant de fois qu’il y a d’étoiles.<b> NB : une (*) correspond à un espace. Ne pas en mettre ni au début ni à la fin de votre phrase.</b></p>"+
+    "<p>Pour insérer du texte dans la zone, cliquez sur la zone et saisissez la phrase souhaitée. </p>"+
+    "<p>Pour ajouter des espaces dans la phrase, insérer une étoile * entre chaque mot. Votre texte sera séparé autant de fois qu’il y a d’étoiles.<b> NB : une (*) correspond à un espace. Ne pas en mettre ni au début ni à la fin de votre phrase.</b></p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité. </p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité. </p>",
+    theme:"Thème"
 };
 
 var word = "";
@@ -80,27 +81,35 @@ var input_width = 606;
 var widget_padding = 0;
 var min_view_width = 400;
 
+
 $(document).ready(function(){
     if(window.sankore){
         if(sankore.preference("ord_words_style","")){
             changeStyle(sankore.preference("ord_words_style",""));
-            $(".style_select").val(sankore.preference("ord_words_style",""));
         } else
             changeStyle("3")
     } else 
         changeStyle("3")
-    
     $("#wgt_display").text(sankoreLang.view);
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
-    $("#help").html(sankoreLang.help_content);
+    $("#help").html(sankoreLang.help_content);    
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 modeView();
@@ -109,7 +118,7 @@ $(document).ready(function(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 modeEdit();
@@ -122,11 +131,13 @@ $(document).ready(function(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
         } else {            
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -178,15 +189,8 @@ $(document).ready(function(){
                 $( "#mp_word" ).css( "margin-left", 0 );
             }
         }
-    });
-    
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    });    
     
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })
 })
 
 /*
@@ -239,10 +243,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select option:first").attr('selected',true);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -256,10 +260,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:first").next().attr('selected',true);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -273,10 +277,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:last").attr('selected',true);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -406,7 +410,7 @@ function modeEdit()
 
 if (window.widget) {
     window.widget.onleave = function(){
-        sankore.setPreference("ord_words_style", $(".style_select").find("option:selected").val());
+        sankore.setPreference("ord_words_style", $("#style_select").find("option:selected").val());
         if($( "#mp_word .wgt_cont" ).val())
         {
             modeView();
diff --git a/resources/library/interactivities/Ordre mots.wgt/locales/ru/index.html b/resources/library/interactivities/Ordre mots.wgt/locales/ru/index.html
index 8918641f..e323447f 100644
--- a/resources/library/interactivities/Ordre mots.wgt/locales/ru/index.html	
+++ b/resources/library/interactivities/Ordre mots.wgt/locales/ru/index.html	
@@ -10,8 +10,6 @@
         <!--Styles-->
         <link rel="stylesheet" type="text/css" href="../../styles/master.css">
         <link rel="stylesheet" type="text/css" href="../../styles/of_puppets.css">
-        <link rel="stylesheet" href="../../styles/fonts/Lobster/stylesheet.css">
-	<link rel="stylesheet" href="../../styles/fonts/SF-Toontime/stylesheet.css">
         <!--Scripts-->
         <script type="text/javascript" src="../../scripts/jquery-1.6.2.min.js"></script>
         <script type="text/javascript" src="../../scripts/jquery-ui-1.8.9.custom.min.js"></script>
@@ -33,12 +31,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -48,7 +41,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre mots.wgt/locales/ru/scripts/template2.js b/resources/library/interactivities/Ordre mots.wgt/locales/ru/scripts/template2.js
index 3b267590..b7b04940 100644
--- a/resources/library/interactivities/Ordre mots.wgt/locales/ru/scripts/template2.js	
+++ b/resources/library/interactivities/Ordre mots.wgt/locales/ru/scripts/template2.js	
@@ -27,7 +27,7 @@ function checkResponse()
 */
 
 var sankoreLang = {
-    view: "Показать", 
+    view: "Закрыть", 
     edit: "Изменить",
     example: "много*,*много*лет*назад*...",
     wgt_name: "Порядок слов",
@@ -36,7 +36,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 var word = "";
@@ -66,11 +67,11 @@ var input_width = 606;
 var widget_padding = 0;
 var min_view_width = 400;
 
+
 $(document).ready(function(){
     if(window.sankore){
         if(sankore.preference("ord_words_style","")){
             changeStyle(sankore.preference("ord_words_style",""));
-            $(".style_select").val(sankore.preference("ord_words_style",""));
         } else
             changeStyle("3")
     } else 
@@ -78,14 +79,23 @@ $(document).ready(function(){
     $("#wgt_display").text(sankoreLang.view);
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
-    $("#help").html(sankoreLang.help_content);
+    $("#help").html(sankoreLang.help_content);    
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 modeView();
@@ -94,7 +104,7 @@ $(document).ready(function(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 modeEdit();
@@ -107,11 +117,13 @@ $(document).ready(function(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
         } else {            
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -163,15 +175,8 @@ $(document).ready(function(){
                 $( "#mp_word" ).css( "margin-left", 0 );
             }
         }
-    });
-    
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    });    
     
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })
 })
 
 /*
@@ -224,10 +229,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select option:first").attr('selected',true);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -241,10 +246,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:first").next().attr('selected',true);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -258,10 +263,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:last").attr('selected',true);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -391,7 +396,7 @@ function modeEdit()
 
 if (window.widget) {
     window.widget.onleave = function(){
-        sankore.setPreference("ord_words_style", $(".style_select").find("option:selected").val());
+        sankore.setPreference("ord_words_style", $("#style_select").find("option:selected").val());
         if($( "#mp_word .wgt_cont" ).val())
         {
             modeView();
diff --git a/resources/library/interactivities/Ordre mots.wgt/scripts/template2.js b/resources/library/interactivities/Ordre mots.wgt/scripts/template2.js
index db966b89..8c784eab 100644
--- a/resources/library/interactivities/Ordre mots.wgt/scripts/template2.js	
+++ b/resources/library/interactivities/Ordre mots.wgt/scripts/template2.js	
@@ -27,7 +27,7 @@ function checkResponse()
 */
 
 var sankoreLang = {
-    view: "Display", 
+    view: "Close", 
     edit: "Edit",
     example: "a*long*,*long*time*ago*...",
     wgt_name: "Order words",
@@ -36,7 +36,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 var word = "";
@@ -66,11 +67,11 @@ var input_width = 606;
 var widget_padding = 0;
 var min_view_width = 400;
 
+
 $(document).ready(function(){
     if(window.sankore){
         if(sankore.preference("ord_words_style","")){
             changeStyle(sankore.preference("ord_words_style",""));
-            $(".style_select").val(sankore.preference("ord_words_style",""));
         } else
             changeStyle("3")
     } else 
@@ -78,14 +79,23 @@ $(document).ready(function(){
     $("#wgt_display").text(sankoreLang.view);
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
-    $("#help").html(sankoreLang.help_content);
+    $("#help").html(sankoreLang.help_content);    
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 modeView();
@@ -94,7 +104,7 @@ $(document).ready(function(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 modeEdit();
@@ -107,11 +117,13 @@ $(document).ready(function(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
         } else {            
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -163,15 +175,8 @@ $(document).ready(function(){
                 $( "#mp_word" ).css( "margin-left", 0 );
             }
         }
-    });
-    
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    });    
     
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })
 })
 
 /*
@@ -224,10 +229,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select option:first").attr('selected',true);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -241,10 +246,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:first").next().attr('selected',true);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -258,10 +263,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:last").attr('selected',true);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -391,7 +396,7 @@ function modeEdit()
 
 if (window.widget) {
     window.widget.onleave = function(){
-        sankore.setPreference("ord_words_style", $(".style_select").find("option:selected").val());
+        sankore.setPreference("ord_words_style", $("#style_select").find("option:selected").val());
         if($( "#mp_word .wgt_cont" ).val())
         {
             modeView();
diff --git a/resources/library/interactivities/Ordre mots.wgt/styles/of_puppets.css b/resources/library/interactivities/Ordre mots.wgt/styles/of_puppets.css
index 111e3199..6e3e8e8d 100644
--- a/resources/library/interactivities/Ordre mots.wgt/styles/of_puppets.css	
+++ b/resources/library/interactivities/Ordre mots.wgt/styles/of_puppets.css	
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;    
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -45,6 +45,7 @@ body{
 }
 
 #mp_word .wgt_cont{
+    margin-top: 20px;
     font: 32px tahoma;
     letter-spacing: 0.1em;
     width: 98%;
@@ -139,57 +140,40 @@ body{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -224,51 +208,50 @@ body{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -277,5 +260,36 @@ body{
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/ar_down.png b/resources/library/interactivities/Ordre phrase.wgt/img/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Ordre phrase.wgt/img/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/ar_down_white.png b/resources/library/interactivities/Ordre phrase.wgt/img/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Ordre phrase.wgt/img/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/parameters-bg.png b/resources/library/interactivities/Ordre phrase.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Ordre phrase.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/slate-display.png b/resources/library/interactivities/Ordre phrase.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Ordre phrase.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/slate-edit.png b/resources/library/interactivities/Ordre phrase.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Ordre phrase.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/slate-help-white.png b/resources/library/interactivities/Ordre phrase.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Ordre phrase.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/slate-help.png b/resources/library/interactivities/Ordre phrase.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Ordre phrase.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Ordre phrase.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-edit.png b/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-help.png b/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-reload.png b/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Ordre phrase.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Ordre phrase.wgt/index.html b/resources/library/interactivities/Ordre phrase.wgt/index.html
index 48305e39..90fcc335 100644
--- a/resources/library/interactivities/Ordre phrase.wgt/index.html	
+++ b/resources/library/interactivities/Ordre phrase.wgt/index.html	
@@ -60,11 +60,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -74,7 +69,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre phrase.wgt/locales/fr/index.html b/resources/library/interactivities/Ordre phrase.wgt/locales/fr/index.html
index 763aa128..ef868edb 100644
--- a/resources/library/interactivities/Ordre phrase.wgt/locales/fr/index.html	
+++ b/resources/library/interactivities/Ordre phrase.wgt/locales/fr/index.html	
@@ -36,11 +36,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -50,7 +45,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre phrase.wgt/locales/fr/script/template2.js b/resources/library/interactivities/Ordre phrase.wgt/locales/fr/script/template2.js
index 65cbc135..184102b8 100644
--- a/resources/library/interactivities/Ordre phrase.wgt/locales/fr/script/template2.js	
+++ b/resources/library/interactivities/Ordre phrase.wgt/locales/fr/script/template2.js	
@@ -26,7 +26,7 @@ function checkResponse()
 */
 
 var sankoreLang = {
-    view: "Afficher", 
+    view: "Fermer", 
     edit: "Modifier",
     example: "Cette phrase\nest un\nexemple",
     wgt_name: "Ordonner des phrases",
@@ -36,23 +36,23 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Ordonner des phrases</h2></p>"+
-"<p><h3>Ordonner des segments de phrases pour reconstituer le texte.</h3></p>"+
+    "<p><h3>Ordonner des segments de phrases pour reconstituer le texte.</h3></p>"+
 
-"<p>Des étiquettes avec des phrases sont dans le désordre. Le but est de les remettre en ordre pour avoir un texte compréhensible et correct. Lorsque le texte est en ordre, l’interactivité se colore en vert. L’activité s’effectue par un glisser-déposer des étiquettes pour remettre le texte en ordre.</p>"+
+    "<p>Des étiquettes avec des phrases sont dans le désordre. Le but est de les remettre en ordre pour avoir un texte compréhensible et correct. Lorsque le texte est en ordre, l’interactivité se colore en vert. L’activité s’effectue par un glisser-déposer des étiquettes pour remettre le texte en ordre.</p>"+
 
-"<p>Le bouton “Recharger” réinitialise l’exercice.</p>"+
+    "<p>Le bouton “Recharger” réinitialise l’exercice.</p>"+
 
-"<p>Le bouton “Modifier” vous permet : </p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
-"<li>de déterminer le texte à reconstituer et le nombre de séparations dans l’énoncé.</li></ul>"+
+    "<p>Le bouton “Modifier” vous permet : </p>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
+    "<li>de déterminer le texte à reconstituer et le nombre de séparations dans l’énoncé.</li></ul>"+
 
-"<p>Pour insérer du texte dans la zone, cliquez sur la zone et saisissez le texte souhaité.</p>"+
-"<p>Pour ajouter des séparations dans l’énoncé, retournez à la ligne. Votre texte sera séparé lors d'un retour à la ligne.</p>"+
+    "<p>Pour insérer du texte dans la zone, cliquez sur la zone et saisissez le texte souhaité.</p>"+
+    "<p>Pour ajouter des séparations dans l’énoncé, retournez à la ligne. Votre texte sera séparé lors d'un retour à la ligne.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme:"Thème"
 };
 
-
 var sentence = "";
 var curSentence = "";
 
@@ -82,23 +82,34 @@ var input_width = 606;
 var widget_padding = 0;
 
 $(document).ready(function(){
-    if(sankore.preference("ord_phrases_style","")){
-        changeStyle(sankore.preference("ord_phrases_style",""));
-        $(".style_select").val(sankore.preference("ord_phrases_style",""));
-    } else
-        changeStyle("3")
-    
+    if(window.sankore)
+        if(sankore.preference("ord_phrases_style","")){
+            changeStyle(sankore.preference("ord_phrases_style",""));
+            $("#style_select").val(sankore.preference("ord_phrases_style",""));
+        } else
+            changeStyle("3")
+        
     $("#wgt_display").text(sankoreLang.view);
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);    
+    
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 modeView();
@@ -107,7 +118,7 @@ $(document).ready(function(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 modeEdit();
@@ -120,11 +131,13 @@ $(document).ready(function(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
-        } else {            
+        } else {      
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -158,13 +171,7 @@ $(document).ready(function(){
         }
     });
     
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
     
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })
 })
 
 function str_replace( w, b, s ){
@@ -230,10 +237,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select option:first").attr('selected',true);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -247,10 +254,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:first").next().attr('selected',true);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -264,10 +271,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:last").attr('selected',true);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -355,7 +362,7 @@ function modeEdit()
 
 if (window.widget) {
     window.widget.onleave = function(){
-        sankore.setPreference("ord_phrases_style", $(".style_select").find("option:selected").val());
+        sankore.setPreference("ord_phrases_style", $("#style_select").find("option:selected").val());
         if($( "#mp_word textarea" ).val())
         {
             modeView();
@@ -377,4 +384,4 @@ if (window.widget) {
         }
         sankore.setPreference("rightOrdPhrases", sentence);
     }
-}
+}
\ No newline at end of file
diff --git a/resources/library/interactivities/Ordre phrase.wgt/locales/ru/index.html b/resources/library/interactivities/Ordre phrase.wgt/locales/ru/index.html
index 763aa128..ef868edb 100644
--- a/resources/library/interactivities/Ordre phrase.wgt/locales/ru/index.html	
+++ b/resources/library/interactivities/Ordre phrase.wgt/locales/ru/index.html	
@@ -36,11 +36,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -50,7 +45,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Ordre phrase.wgt/locales/ru/script/template2.js b/resources/library/interactivities/Ordre phrase.wgt/locales/ru/script/template2.js
index 8163d8af..398d9fa7 100644
--- a/resources/library/interactivities/Ordre phrase.wgt/locales/ru/script/template2.js	
+++ b/resources/library/interactivities/Ordre phrase.wgt/locales/ru/script/template2.js	
@@ -27,7 +27,7 @@ function checkResponse()
 
 var sankoreLang = {
     edit: "Изменить",
-    view: "Просмотр",
+    view: "Закрыть",
     example: "это\nпример\nпредложения",
     wgt_name: "Порядок фраз",
     reload: "Обновить",
@@ -35,10 +35,10 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 }
 
-
 var sentence = "";
 var curSentence = "";
 
@@ -68,23 +68,34 @@ var input_width = 606;
 var widget_padding = 0;
 
 $(document).ready(function(){
-    if(sankore.preference("ord_phrases_style","")){
-        changeStyle(sankore.preference("ord_phrases_style",""));
-        $(".style_select").val(sankore.preference("ord_phrases_style",""));
-    } else
-        changeStyle("3")
-    
+    if(window.sankore)
+        if(sankore.preference("ord_phrases_style","")){
+            changeStyle(sankore.preference("ord_phrases_style",""));
+            $("#style_select").val(sankore.preference("ord_phrases_style",""));
+        } else
+            changeStyle("3")
+        
     $("#wgt_display").text(sankoreLang.view);
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);    
+    
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 modeView();
@@ -93,7 +104,7 @@ $(document).ready(function(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 modeEdit();
@@ -106,11 +117,13 @@ $(document).ready(function(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
-        } else {            
+        } else {      
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -144,13 +157,7 @@ $(document).ready(function(){
         }
     });
     
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
     
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })
 })
 
 function str_replace( w, b, s ){
@@ -216,10 +223,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select option:first").attr('selected',true);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -233,10 +240,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:first").next().attr('selected',true);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -250,10 +257,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:last").attr('selected',true);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -341,7 +348,7 @@ function modeEdit()
 
 if (window.widget) {
     window.widget.onleave = function(){
-        sankore.setPreference("ord_phrases_style", $(".style_select").find("option:selected").val());
+        sankore.setPreference("ord_phrases_style", $("#style_select").find("option:selected").val());
         if($( "#mp_word textarea" ).val())
         {
             modeView();
@@ -363,4 +370,4 @@ if (window.widget) {
         }
         sankore.setPreference("rightOrdPhrases", sentence);
     }
-}
+}
\ No newline at end of file
diff --git a/resources/library/interactivities/Ordre phrase.wgt/scripts/template2.js b/resources/library/interactivities/Ordre phrase.wgt/scripts/template2.js
index 99241058..d63220b3 100644
--- a/resources/library/interactivities/Ordre phrase.wgt/scripts/template2.js	
+++ b/resources/library/interactivities/Ordre phrase.wgt/scripts/template2.js	
@@ -28,7 +28,7 @@ function checkResponse()
 
 var sankoreLang = {
     edit: "Edit",
-    view: "Display",
+    view: "Close",
     example: "this is\nan example\nsentence",
     wgt_name: "Order phrases",
     reload: "Reload",
@@ -36,7 +36,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 }
 
 
@@ -72,7 +73,7 @@ $(document).ready(function(){
     if(window.sankore)
         if(sankore.preference("ord_phrases_style","")){
             changeStyle(sankore.preference("ord_phrases_style",""));
-            $(".style_select").val(sankore.preference("ord_phrases_style",""));
+            $("#style_select").val(sankore.preference("ord_phrases_style",""));
         } else
             changeStyle("3")
         
@@ -80,13 +81,23 @@ $(document).ready(function(){
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);    
+    
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 modeView();
@@ -95,7 +106,7 @@ $(document).ready(function(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 modeEdit();
@@ -108,11 +119,13 @@ $(document).ready(function(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
-        } else {            
+        } else {      
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -146,13 +159,7 @@ $(document).ready(function(){
         }
     });
     
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
     
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })
 })
 
 function str_replace( w, b, s ){
@@ -218,10 +225,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select option:first").attr('selected',true);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -235,10 +242,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:first").next().attr('selected',true);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -252,10 +259,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select option:last").attr('selected',true);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -343,7 +350,7 @@ function modeEdit()
 
 if (window.widget) {
     window.widget.onleave = function(){
-        sankore.setPreference("ord_phrases_style", $(".style_select").find("option:selected").val());
+        sankore.setPreference("ord_phrases_style", $("#style_select").find("option:selected").val());
         if($( "#mp_word textarea" ).val())
         {
             modeView();
diff --git a/resources/library/interactivities/Ordre phrase.wgt/styles/of_puppets.css b/resources/library/interactivities/Ordre phrase.wgt/styles/of_puppets.css
index 401a2bea..741bf47f 100644
--- a/resources/library/interactivities/Ordre phrase.wgt/styles/of_puppets.css	
+++ b/resources/library/interactivities/Ordre phrase.wgt/styles/of_puppets.css	
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;    
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -149,57 +149,40 @@ textarea{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -234,51 +217,50 @@ textarea{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -287,5 +269,36 @@ textarea{
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Selectionner.wgt/css/basic.css b/resources/library/interactivities/Selectionner.wgt/css/basic.css
index 8a5c3d9d..7f682d90 100644
--- a/resources/library/interactivities/Selectionner.wgt/css/basic.css
+++ b/resources/library/interactivities/Selectionner.wgt/css/basic.css
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;    
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -28,14 +28,6 @@ body{
     margin: 5px 10px;
 }
 
-.green_point{
-    background-image: url(../img/green_point.png);
-}
-
-.red_point{
-    background-image: url(../img/red_point.png);
-}
-
 #display_text, #edit_text{
     height: 19px;
     padding: 3px 0 0 0;
@@ -322,57 +314,40 @@ body{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -407,51 +382,50 @@ body{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -460,5 +434,36 @@ body{
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Selectionner.wgt/img/ar_down.png b/resources/library/interactivities/Selectionner.wgt/img/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/ar_down_white.png b/resources/library/interactivities/Selectionner.wgt/img/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/green_point.png b/resources/library/interactivities/Selectionner.wgt/img/green_point.png
deleted file mode 100644
index a2a44680..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/green_point.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/parameters-bg.png b/resources/library/interactivities/Selectionner.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Selectionner.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/red_point.png b/resources/library/interactivities/Selectionner.wgt/img/red_point.png
deleted file mode 100644
index f6daa19a..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/red_point.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/slate-display.png b/resources/library/interactivities/Selectionner.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/slate-edit.png b/resources/library/interactivities/Selectionner.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/slate-help-white.png b/resources/library/interactivities/Selectionner.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/slate-help.png b/resources/library/interactivities/Selectionner.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Selectionner.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/toolbar-edit.png b/resources/library/interactivities/Selectionner.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Selectionner.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/toolbar-help.png b/resources/library/interactivities/Selectionner.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Selectionner.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Selectionner.wgt/img/toolbar-reload.png b/resources/library/interactivities/Selectionner.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Selectionner.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Selectionner.wgt/index.html b/resources/library/interactivities/Selectionner.wgt/index.html
index 688bb52f..47062b93 100644
--- a/resources/library/interactivities/Selectionner.wgt/index.html
+++ b/resources/library/interactivities/Selectionner.wgt/index.html
@@ -52,11 +52,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -66,7 +61,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Selectionner.wgt/js/script.js b/resources/library/interactivities/Selectionner.wgt/js/script.js
index f8a5f9a2..0e96f2eb 100644
--- a/resources/library/interactivities/Selectionner.wgt/js/script.js
+++ b/resources/library/interactivities/Selectionner.wgt/js/script.js
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Display", 
+    display: "Close", 
     edit: "Edit", 
     short_desc: "Select animals from the following list:", 
     add: "Add new block",
@@ -15,7 +15,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 //main function
@@ -27,9 +28,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("selectionner","")){
@@ -39,7 +42,7 @@ function start(){
             showExample();
         if(sankore.preference("sel_style","")){
             changeStyle(sankore.preference("sel_style",""));
-            $(".style_select").val(sankore.preference("sel_style",""));
+            $("#style_select").val(sankore.preference("sel_style",""));
         } else
             changeStyle("3")
     } 
@@ -50,18 +53,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("sel_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("sel_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -83,7 +88,7 @@ function start(){
             $("#wgt_display").trigger("click");
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -94,7 +99,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -122,7 +127,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 
                 $(".cont").each(function(){
                     var container = $(this);
@@ -446,10 +451,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -463,10 +468,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -480,10 +485,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Selectionner.wgt/locales/fr/index.html b/resources/library/interactivities/Selectionner.wgt/locales/fr/index.html
index 218567a2..33fa36f6 100644
--- a/resources/library/interactivities/Selectionner.wgt/locales/fr/index.html
+++ b/resources/library/interactivities/Selectionner.wgt/locales/fr/index.html
@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Selectionner.wgt/locales/fr/js/script.js b/resources/library/interactivities/Selectionner.wgt/locales/fr/js/script.js
index 7650dcaf..7cdd8d02 100644
--- a/resources/library/interactivities/Selectionner.wgt/locales/fr/js/script.js
+++ b/resources/library/interactivities/Selectionner.wgt/locales/fr/js/script.js
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Afficher", 
+    display: "Fermer", 
     edit: "Modifier", 
     short_desc: "Sélectionner les animaux dans la liste suivante :", 
     add: "Nouveau bloc",
@@ -16,24 +16,25 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Sélectionner</h2></p>"+
-"<p><h3>Trouver les éléments correspondants à la consigne.</h3></p>"+
+    "<p><h3>Trouver les éléments correspondants à la consigne.</h3></p>"+
 
-"<p>Une consigne est écrite précisant le ou les éléments à chercher parmi tous les éléments proposés. Le but est de trouver les éléments correspondants à la consigne. L’activité s’effectue en cochant les cases sous les éléments correspondants. Une fois que tous les éléments corrects sont cochés, la zone se colore en vert.</p>"+
+    "<p>Une consigne est écrite précisant le ou les éléments à chercher parmi tous les éléments proposés. Le but est de trouver les éléments correspondants à la consigne. L’activité s’effectue en cochant les cases sous les éléments correspondants. Une fois que tous les éléments corrects sont cochés, la zone se colore en vert.</p>"+
 
-"<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
+    "<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
-"<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité. </li></ul>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
+    "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité. </li></ul>"+
 
-"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis</p>"+
-"<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir votre consigne ici ...”, </li>"+
-"<li>ajoutez des zones de texte en cliquant sur le gros “+T” vert en dessous puis entrez le texte voulu.</li></ul>"+
-"<p>Pour supprimer une zone de texte, cliquez sur la croix située dans le coin supérieur de celle-ci.</p>"+ 
+    "<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis</p>"+
+    "<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir votre consigne ici ...”, </li>"+
+    "<li>ajoutez des zones de texte en cliquant sur le gros “+T” vert en dessous puis entrez le texte voulu.</li></ul>"+
+    "<p>Pour supprimer une zone de texte, cliquez sur la croix située dans le coin supérieur de celle-ci.</p>"+ 
 
-"<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
+    "<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme:"Thème"
 };
 
 //main function
@@ -45,9 +46,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("selectionner","")){
@@ -57,7 +60,7 @@ function start(){
             showExample();
         if(sankore.preference("sel_style","")){
             changeStyle(sankore.preference("sel_style",""));
-            $(".style_select").val(sankore.preference("sel_style",""));
+            $("#style_select").val(sankore.preference("sel_style",""));
         } else
             changeStyle("3")
     } 
@@ -68,18 +71,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("sel_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("sel_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -101,7 +106,7 @@ function start(){
             $("#wgt_display").trigger("click");
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -112,7 +117,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -140,7 +145,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 
                 $(".cont").each(function(){
                     var container = $(this);
@@ -196,31 +201,31 @@ function start(){
             if($(this).is(":checked"))
                 $(this).parent().find("input:hidden").val(1);
             else
-            $(this).parent().find("input:hidden").val(0);
-            }
-            });
+                $(this).parent().find("input:hidden").val(0);
+        }
+    });
     
-        //play/pause event
-        $(".play, .stop").live("click", function(){
-            var tmp_audio = $(this);
-            var audio = tmp_audio.parent().find("audio").get(0);
-            if($(this).hasClass("play")){            
+    //play/pause event
+    $(".play, .stop").live("click", function(){
+        var tmp_audio = $(this);
+        var audio = tmp_audio.parent().find("audio").get(0);
+        if($(this).hasClass("play")){            
             if(tmp_audio.parent().find("source").attr("src")){
-            tmp_audio.removeClass("play").addClass("stop");
-            var id = setInterval(function(){
-                if(audio.currentTime == audio.duration){
-                clearInterval(id);
-                tmp_audio.removeClass("stop").addClass("play");
-                }
+                tmp_audio.removeClass("play").addClass("stop");
+                var id = setInterval(function(){
+                    if(audio.currentTime == audio.duration){
+                        clearInterval(id);
+                        tmp_audio.removeClass("stop").addClass("play");
+                    }
                 }, 10);
-            tmp_audio.parent().find("input").val(id);
-            audio.play();
+                tmp_audio.parent().find("input").val(id);
+                audio.play();
             }
-            } else {
-        $(this).removeClass("stop").addClass("play");
-        clearInterval( tmp_audio.parent().find("input").val())
-        audio.pause();
-    }
+        } else {
+            $(this).removeClass("stop").addClass("play");
+            clearInterval( tmp_audio.parent().find("input").val())
+            audio.pause();
+        }
     });
     
     $(".replay").live("click", function(){
@@ -463,10 +468,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -480,10 +485,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -497,10 +502,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Selectionner.wgt/locales/ru/index.html b/resources/library/interactivities/Selectionner.wgt/locales/ru/index.html
index 1e415855..61714a1f 100644
--- a/resources/library/interactivities/Selectionner.wgt/locales/ru/index.html
+++ b/resources/library/interactivities/Selectionner.wgt/locales/ru/index.html
@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Selectionner.wgt/locales/ru/js/script.js b/resources/library/interactivities/Selectionner.wgt/locales/ru/js/script.js
index 872e57bf..8f4f3589 100644
--- a/resources/library/interactivities/Selectionner.wgt/locales/ru/js/script.js
+++ b/resources/library/interactivities/Selectionner.wgt/locales/ru/js/script.js
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Показать", 
+    display: "Закрыть", 
     edit: "Изменить", 
     short_desc: "Выберите животных из следующего списка:", 
     add: "Новый блок",
@@ -15,7 +15,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 //main function
@@ -27,9 +28,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("selectionner","")){
@@ -39,7 +42,7 @@ function start(){
             showExample();
         if(sankore.preference("sel_style","")){
             changeStyle(sankore.preference("sel_style",""));
-            $(".style_select").val(sankore.preference("sel_style",""));
+            $("#style_select").val(sankore.preference("sel_style",""));
         } else
             changeStyle("3")
     } 
@@ -50,18 +53,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("sel_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("sel_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -83,7 +88,7 @@ function start(){
             $("#wgt_display").trigger("click");
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -94,7 +99,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -122,7 +127,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 
                 $(".cont").each(function(){
                     var container = $(this);
@@ -178,31 +183,31 @@ function start(){
             if($(this).is(":checked"))
                 $(this).parent().find("input:hidden").val(1);
             else
-            $(this).parent().find("input:hidden").val(0);
-            }
-            });
+                $(this).parent().find("input:hidden").val(0);
+        }
+    });
     
-        //play/pause event
-        $(".play, .stop").live("click", function(){
-            var tmp_audio = $(this);
-            var audio = tmp_audio.parent().find("audio").get(0);
-            if($(this).hasClass("play")){            
+    //play/pause event
+    $(".play, .stop").live("click", function(){
+        var tmp_audio = $(this);
+        var audio = tmp_audio.parent().find("audio").get(0);
+        if($(this).hasClass("play")){            
             if(tmp_audio.parent().find("source").attr("src")){
-            tmp_audio.removeClass("play").addClass("stop");
-            var id = setInterval(function(){
-                if(audio.currentTime == audio.duration){
-                clearInterval(id);
-                tmp_audio.removeClass("stop").addClass("play");
-                }
+                tmp_audio.removeClass("play").addClass("stop");
+                var id = setInterval(function(){
+                    if(audio.currentTime == audio.duration){
+                        clearInterval(id);
+                        tmp_audio.removeClass("stop").addClass("play");
+                    }
                 }, 10);
-            tmp_audio.parent().find("input").val(id);
-            audio.play();
+                tmp_audio.parent().find("input").val(id);
+                audio.play();
             }
-            } else {
-        $(this).removeClass("stop").addClass("play");
-        clearInterval( tmp_audio.parent().find("input").val())
-        audio.pause();
-    }
+        } else {
+            $(this).removeClass("stop").addClass("play");
+            clearInterval( tmp_audio.parent().find("input").val())
+            audio.pause();
+        }
     });
     
     $(".replay").live("click", function(){
@@ -445,10 +450,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").addClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -462,10 +467,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -479,10 +484,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
+            $("#wgt_display").removeClass("display_wood");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/ar_down.png b/resources/library/interactivities/Separe phrase.wgt/img/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Separe phrase.wgt/img/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/ar_down_white.png b/resources/library/interactivities/Separe phrase.wgt/img/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Separe phrase.wgt/img/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/parameters-bg.png b/resources/library/interactivities/Separe phrase.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Separe phrase.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/slate-display.png b/resources/library/interactivities/Separe phrase.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Separe phrase.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/slate-edit.png b/resources/library/interactivities/Separe phrase.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Separe phrase.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/slate-help-white.png b/resources/library/interactivities/Separe phrase.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Separe phrase.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/slate-help.png b/resources/library/interactivities/Separe phrase.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Separe phrase.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Separe phrase.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/toolbar-edit.png b/resources/library/interactivities/Separe phrase.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Separe phrase.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/toolbar-help.png b/resources/library/interactivities/Separe phrase.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Separe phrase.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/img/toolbar-reload.png b/resources/library/interactivities/Separe phrase.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Separe phrase.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Separe phrase.wgt/index.html b/resources/library/interactivities/Separe phrase.wgt/index.html
index e108a1c9..10583ebf 100644
--- a/resources/library/interactivities/Separe phrase.wgt/index.html	
+++ b/resources/library/interactivities/Separe phrase.wgt/index.html	
@@ -58,11 +58,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -72,7 +67,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Separe phrase.wgt/locales/fr/index.html b/resources/library/interactivities/Separe phrase.wgt/locales/fr/index.html
index 593e885a..db3451e8 100644
--- a/resources/library/interactivities/Separe phrase.wgt/locales/fr/index.html	
+++ b/resources/library/interactivities/Separe phrase.wgt/locales/fr/index.html	
@@ -36,11 +36,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -50,7 +45,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Separe phrase.wgt/locales/fr/scripts/wcontainer.js b/resources/library/interactivities/Separe phrase.wgt/locales/fr/scripts/wcontainer.js
index 73f641e9..e74b586e 100644
--- a/resources/library/interactivities/Separe phrase.wgt/locales/fr/scripts/wcontainer.js	
+++ b/resources/library/interactivities/Separe phrase.wgt/locales/fr/scripts/wcontainer.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Afficher", 
+    view: "Fermer", 
     edit: "Modifier",
     example: "Ceci est une série de mots à séparer correctement",
     wgt_name: "Séparer une phrase",
@@ -9,25 +9,26 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Séparer une phrase</h2></p>"+
-"<p><h3>Séparer les mots d’une phrase.</h3></p>"+
+    "<p><h3>Séparer les mots d’une phrase.</h3></p>"+
 
-"<p>Une phrase est écrite sans que les mots ne soient séparés. Le but de cette activité est d’insérer les espaces aux bons endroits. Une fois que les séparations sont placées correctement, la phrase se colore en vert.</p>"+
+    "<p>Une phrase est écrite sans que les mots ne soient séparés. Le but de cette activité est d’insérer les espaces aux bons endroits. Une fois que les séparations sont placées correctement, la phrase se colore en vert.</p>"+
 
-"<p>Pour ajouter des séparations entre les mots, déplacez le curseur et cliquez entre deux lettres, une séparation s’ajoute alors.</p>"+
+    "<p>Pour ajouter des séparations entre les mots, déplacez le curseur et cliquez entre deux lettres, une séparation s’ajoute alors.</p>"+
 
 
-"<p>Le bouton “Recharger” réinitialise l’exercice.</p>"+
+    "<p>Le bouton “Recharger” réinitialise l’exercice.</p>"+
 
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
 
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun), </li>"+
-"<li>de déterminer la phrase sur laquelle travailler.</li></ul>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun), </li>"+
+    "<li>de déterminer la phrase sur laquelle travailler.</li></ul>"+
 
-"<p>Ecrivez simplement une phrase dans la zone de texte.</p>"+
+    "<p>Ecrivez simplement une phrase dans la zone de texte.</p>"+
 
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 
 };
 
@@ -38,180 +39,180 @@ var isBrowser = ( typeof( widget ) == "undefined" );
 
 function wcontainer( containerID )
 {
-	// some protecred variables
-	var thisInstance = this;
-	this.editMode = false;
-	var data = {}; // see setData and getData
+    // some protecred variables
+    var thisInstance = this;
+    this.editMode = false;
+    var data = {}; // see setData and getData
 	
-	// widget size parameters
-	this.minHeight = 100;
-	this.minWidth = 400;
+    // widget size parameters
+    this.minHeight = 100;
+    this.minWidth = 400;
 	
-	// set to 0 for no max width restriction
-	this.maxWidth = 0;
+    // set to 0 for no max width restriction
+    this.maxWidth = 0;
 	
-	// links to the elements of the widget
-	this.elements = {};
+    // links to the elements of the widget
+    this.elements = {};
 	
-	/*
+    /*
 	============
 	create
 	============
 	- creates html base, inits this.elements, assings events
 	*/
-	this.create = function( containerID )
-	{
-		var html = 			
-			'<div id="mp_content">' +
-				'<div class="viewmode" id="mp_view">' +
-				'</div>' +
-				'<div class="editmode" id="mp_edit">' +
-				'</div>' +
-			'</div>';
+    this.create = function( containerID )
+    {
+        var html = 			
+        '<div id="mp_content">' +
+        '<div class="viewmode" id="mp_view">' +
+        '</div>' +
+        '<div class="editmode" id="mp_edit">' +
+        '</div>' +
+        '</div>';
 		
-		var container = $( containerID );
+        var container = $( containerID );
 		
-		container.append( html );
-		this.elements.edit = container.find( ".editmode" );
-		this.elements.view = container.find( ".viewmode" );
-		this.elements.container = container;
-		this.elements.subcontainer = container.find( "#mp_content" );
-		this.elements.containerView = this.elements.subcontainer.find( ".viewmode" );
-		this.elements.containerEdit = this.elements.subcontainer.find( ".editmode" );
+        container.append( html );
+        this.elements.edit = container.find( ".editmode" );
+        this.elements.view = container.find( ".viewmode" );
+        this.elements.container = container;
+        this.elements.subcontainer = container.find( "#mp_content" );
+        this.elements.containerView = this.elements.subcontainer.find( ".viewmode" );
+        this.elements.containerEdit = this.elements.subcontainer.find( ".editmode" );
 		
-		$("#wgt_edit").live("click", function(){
-			thisInstance.modeEdit();
-		} );
+        $("#wgt_edit").live("click", function(){
+            thisInstance.modeEdit();
+        } );
 		
-		$("#wgt_display").live("click", function(){
-			thisInstance.modeView();
-		} );
-	};
+        $("#wgt_display").live("click", function(){
+            thisInstance.modeView();
+        } );
+    };
 	
 	
-	/*
+    /*
 	===============
 	setViewContent
 	===============
 	- assigns custom html to the viewmode container
 	*/
-	this.setViewContent = function( html )
-	{
-		this.elements.container.find( "#mp_content .viewmode" ).html( html );
-	};
+    this.setViewContent = function( html )
+    {
+        this.elements.container.find( "#mp_content .viewmode" ).html( html );
+    };
 	
-	/*
+    /*
 	===============
 	setEditContent
 	===============
 	- assigns custom html to the editmode container
 	*/
-	this.setEditContent = function( html )
-	{
-		this.elements.container.find( "#mp_content .editmode" ).html( html );
-	};
+    this.setEditContent = function( html )
+    {
+        this.elements.container.find( "#mp_content .editmode" ).html( html );
+    };
 	
 	
 	
-	/*
+    /*
 	=========================
 	modeEdit and modeView
 	=========================
 	- switch the widget betweed modes
 	* for customization extend onEditMode and onViewMode
 	*/
-	this.modeEdit = function()
-	{
-		this.onEditMode();
-		this.editMode = true;
-		this.elements.edit.removeClass( "hide" );
-		this.elements.view.addClass( "hide" );
+    this.modeEdit = function()
+    {
+        this.onEditMode();
+        this.editMode = true;
+        this.elements.edit.removeClass( "hide" );
+        this.elements.view.addClass( "hide" );
 		
-		//this.adjustSize();
-	};
-	this.modeView = function()
-	{
-		this.onViewMode();
-		this.editMode = false;
-		this.elements.edit.addClass( "hide" );
-		this.elements.view.removeClass( "hide" );
+    //this.adjustSize();
+    };
+    this.modeView = function()
+    {
+        this.onViewMode();
+        this.editMode = false;
+        this.elements.edit.addClass( "hide" );
+        this.elements.view.removeClass( "hide" );
 		
-		//this.adjustSize();
-	};
+    //this.adjustSize();
+    };
 	
 	
-	/*
+    /*
 	======================
 	setData and getData
 	======================
 	- store some data inside
 	*/
-	this.setData = function( name, value ){
-		data[name] = value;
-	};
-	this.getData = function( name ){
-		if( typeof( data[name] ) == "undefined" ){
-			return null;
-		} else return data[name];
-	};
+    this.setData = function( name, value ){
+        data[name] = value;
+    };
+    this.getData = function( name ){
+        if( typeof( data[name] ) == "undefined" ){
+            return null;
+        } else return data[name];
+    };
 	
 	
-	// redefinable methods
+    // redefinable methods
 	
-	/*
+    /*
 	==========================
 	onEditMode and onViewMode
 	==========================
 	- these are called when the mode is being changed
 	*/
-	this.onEditMode = function(){
-		//
-	};
-	this.onViewMode = function(){
-		//
-	};
-	
-	/*
+    this.onEditMode = function(){
+    //
+    };
+    this.onViewMode = function(){
+    //
+    };
+	
+    /*
 	======================
 	viewSize and editSize
 	======================
 	- calculate container size for the adjustSize method
 	* they are likely to be redefined for each particular widget
 	*/
-	this.viewSize = function(){
-		return {
-			w: this.elements.containerView.outerWidth(),
-			h: this.elements.containerView.outerHeight()
-		};
-	};
-	this.editSize = function(){
-		return {
-			w: this.elements.containerEdit.outerWidth(),
-			h: this.elements.containerEdit.outerHeight()
-		};
-	};
-	
-	/*
+    this.viewSize = function(){
+        return {
+            w: this.elements.containerView.outerWidth(),
+            h: this.elements.containerView.outerHeight()
+        };
+    };
+    this.editSize = function(){
+        return {
+            w: this.elements.containerEdit.outerWidth(),
+            h: this.elements.containerEdit.outerHeight()
+        };
+    };
+	
+    /*
 	=====================
 	checkAnswer
 	=====================
 	- check if the exercise in the view mode was done right
 	* redefine it for each particular widget
 	*/
-	this.checkAnswer = function()
-	{
-		//
-	};
-	
-	
-	// constructor end
-	
-	// if the constructor was called with a parameter,
-	// call create() automatically
-	if( arguments.length > 0 ){
-		this.create( containerID );
-	}
-	this.setData( "dw", this.elements.container.outerWidth( true ) - this.elements.container.width() );
-	this.setData( "dh", this.elements.container.outerHeight( true ) - this.elements.container.height() );
-	window.winstance = thisInstance;
+    this.checkAnswer = function()
+    {
+    //
+    };
+	
+	
+    // constructor end
+	
+    // if the constructor was called with a parameter,
+    // call create() automatically
+    if( arguments.length > 0 ){
+        this.create( containerID );
+    }
+    this.setData( "dw", this.elements.container.outerWidth( true ) - this.elements.container.width() );
+    this.setData( "dh", this.elements.container.outerHeight( true ) - this.elements.container.height() );
+    window.winstance = thisInstance;
 }
diff --git a/resources/library/interactivities/Separe phrase.wgt/locales/ru/index.html b/resources/library/interactivities/Separe phrase.wgt/locales/ru/index.html
index 61039d1a..e13bfddc 100644
--- a/resources/library/interactivities/Separe phrase.wgt/locales/ru/index.html	
+++ b/resources/library/interactivities/Separe phrase.wgt/locales/ru/index.html	
@@ -20,7 +20,6 @@
         <script type="text/javascript" src="../../scripts/app.js"></script>
         <script type="text/javascript">
             $(document).ready(function(){
-                alert(2)
                 if(window.sankore)
                     sankore.enableDropOnWidget(false);                         
             });
@@ -37,11 +36,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -51,7 +45,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Separe phrase.wgt/locales/ru/scripts/wcontainer.js b/resources/library/interactivities/Separe phrase.wgt/locales/ru/scripts/wcontainer.js
index d73ca911..9eb8a67e 100644
--- a/resources/library/interactivities/Separe phrase.wgt/locales/ru/scripts/wcontainer.js	
+++ b/resources/library/interactivities/Separe phrase.wgt/locales/ru/scripts/wcontainer.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Показать", 
+    view: "Закрыть", 
     edit: "Изменить",
     example: "это группа слов которую нужно разделить",
     wgt_name: "Разделить фразу",
@@ -8,7 +8,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 // if use the "view/edit" button or rely on the api instead
diff --git a/resources/library/interactivities/Separe phrase.wgt/scripts/app.js b/resources/library/interactivities/Separe phrase.wgt/scripts/app.js
index 693e63c4..ac172eae 100644
--- a/resources/library/interactivities/Separe phrase.wgt/scripts/app.js	
+++ b/resources/library/interactivities/Separe phrase.wgt/scripts/app.js	
@@ -18,6 +18,15 @@ function createElements( phrase )
     return s;
 }
 
+function createChain( phrase )
+{
+    var arr = phrase.split(" ");
+    var result = "";
+    for( var i = 0; i < arr.length; i++ )    	
+        result += '<div class="letterCont">' + createElements(arr[i]) + '</div>';    
+    return result;
+}
+
 
 $(document).ready(function()
 {    
@@ -31,7 +40,7 @@ $(document).ready(function()
     
     if (window.widget) {
         window.widget.onleave = function(){
-            sankore.setPreference("spl_phrase_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("spl_phrase_style", $("#style_select").find("option:selected").val());
             if(w.editMode){
                 sankore.setPreference("ordSplPhrases", w.elements.container.find( "textarea" ).val());
                 sankore.setPreference("ordSplPhrasesState", "0");
@@ -47,7 +56,6 @@ $(document).ready(function()
     
     if(window.sankore && sankore.preference("spl_phrase_style","")){
         changeStyle(sankore.preference("spl_phrase_style",""));
-        $(".style_select").val(sankore.preference("spl_phrase_style",""));
     } else
         changeStyle("3")
     
@@ -55,13 +63,23 @@ $(document).ready(function()
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);    
+    
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 w.modeView();
@@ -70,7 +88,7 @@ $(document).ready(function()
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 w.modeEdit();
@@ -83,11 +101,13 @@ $(document).ready(function()
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
-        } else {            
+        } else {     
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -104,14 +124,6 @@ $(document).ready(function()
         }
     });
     
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
-    
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })
-    
     w.maxWidth = 600;
 	
     w.setEditContent( '<div class="inputwrap"><textarea class="percent">' + sentence + '</textarea></div>' );
@@ -132,9 +144,8 @@ $(document).ready(function()
 		
         // store the text
         w.setData( "phrase", phrase );
-		
         // remove all dots (they are to be set during the exercise)
-        phrase = phrase.replace( / /g, '' );
+        //phrase = phrase.replace( / /g, '' );
 		
         // create the html
         if(window.sankore && sankore.preference("ordSplPhrasesState", "") == "1" && flag){
@@ -144,7 +155,7 @@ $(document).ready(function()
             flag = false;
         } 
         else
-            w.setViewContent( createElements( phrase ) );
+            w.setViewContent( createChain( phrase ) );
 		
 		
         // the behaviour
@@ -238,7 +249,7 @@ $(document).ready(function()
             if( this.className.indexOf( "fixed" ) != -1 ){
                 phrase += ' ';
             }
-            else if( this.className.indexOf( "dash" ) != -1 ){
+            else if( (this.className.indexOf( "dash" ) != -1) || (this.className.indexOf( "letterCont" ) != -1) ){
                 return;
             }
             else{
@@ -246,7 +257,6 @@ $(document).ready(function()
                 phrase += ch;
             }
         });
-        //alert(phrase + " | " + this.getData( "phrase" ))	
         if( phrase == this.getData( "phrase" ) ){
             this.elements.containerView.addClass( "answerRight" );
         }
@@ -263,59 +273,59 @@ $(document).ready(function()
     
     //changing the style
     function changeStyle(val){
-    switch(val){
-        case "1":
-            $(".b_top_left").removeClass("btl_pad").removeClass("without_back");
-            $(".b_top_center").removeClass("btc_pad").removeClass("without_back");
-            $(".b_top_right").removeClass("btr_pad").removeClass("without_back");
-            $(".b_center_left").removeClass("bcl_pad").removeClass("without_back");
-            $(".b_center_right").removeClass("bcr_pad").removeClass("without_back");
-            $(".b_bottom_right").removeClass("bbr_pad").removeClass("without_back");
-            $(".b_bottom_left").removeClass("bbl_pad").removeClass("without_back");
-            $(".b_bottom_center").removeClass("bbc_pad").removeClass("without_back");
-            $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
-            $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
-            $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
-            break;
-        case "2":
-            $(".b_top_left").addClass("btl_pad").removeClass("without_back");
-            $(".b_top_center").addClass("btc_pad").removeClass("without_back");
-            $(".b_top_right").addClass("btr_pad").removeClass("without_back");
-            $(".b_center_left").addClass("bcl_pad").removeClass("without_back");
-            $(".b_center_right").addClass("bcr_pad").removeClass("without_back");
-            $(".b_bottom_right").addClass("bbr_pad").removeClass("without_back");
-            $(".b_bottom_left").addClass("bbl_pad").removeClass("without_back");
-            $(".b_bottom_center").addClass("bbc_pad").removeClass("without_back");
-            $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
-            $("#wgt_help").addClass("pad_color").addClass("pad_help");
-            $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-            $("body, html").removeClass("without_radius");
-            break;
-        case "3":
-            $(".b_top_left").addClass("without_back").removeClass("btl_pad");
-            $(".b_top_center").addClass("without_back").removeClass("btc_pad");
-            $(".b_top_right").addClass("without_back").removeClass("btr_pad");
-            $(".b_center_left").addClass("without_back").removeClass("bcl_pad");
-            $(".b_center_right").addClass("without_back").removeClass("bcr_pad");
-            $(".b_bottom_right").addClass("without_back").removeClass("bbr_pad");
-            $(".b_bottom_left").addClass("without_back").removeClass("bbl_pad");
-            $(".b_bottom_center").addClass("without_back").removeClass("bbc_pad");
-            $("#wgt_help").addClass("pad_color").addClass("pad_help");
-            $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
-            $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
-            $("body, html").addClass("without_radius");
-            break;
+        switch(val){
+            case "1":
+                $(".b_top_left").removeClass("btl_pad").removeClass("without_back");
+                $(".b_top_center").removeClass("btc_pad").removeClass("without_back");
+                $(".b_top_right").removeClass("btr_pad").removeClass("without_back");
+                $(".b_center_left").removeClass("bcl_pad").removeClass("without_back");
+                $(".b_center_right").removeClass("bcr_pad").removeClass("without_back");
+                $(".b_bottom_right").removeClass("bbr_pad").removeClass("without_back");
+                $(".b_bottom_left").removeClass("bbl_pad").removeClass("without_back");
+                $(".b_bottom_center").removeClass("bbc_pad").removeClass("without_back");
+                $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
+                $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
+                $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
+                $("#wgt_name").removeClass("pad_color");
+                $("#wgt_display").addClass("display_wood");
+                $("#style_select option:first").attr('selected',true);
+                $("body, html").removeClass("without_radius").addClass("radius_ft");
+                break;
+            case "2":
+                $(".b_top_left").addClass("btl_pad").removeClass("without_back");
+                $(".b_top_center").addClass("btc_pad").removeClass("without_back");
+                $(".b_top_right").addClass("btr_pad").removeClass("without_back");
+                $(".b_center_left").addClass("bcl_pad").removeClass("without_back");
+                $(".b_center_right").addClass("bcr_pad").removeClass("without_back");
+                $(".b_bottom_right").addClass("bbr_pad").removeClass("without_back");
+                $(".b_bottom_left").addClass("bbl_pad").removeClass("without_back");
+                $(".b_bottom_center").addClass("bbc_pad").removeClass("without_back");
+                $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
+                $("#wgt_help").addClass("pad_color").addClass("pad_help");
+                $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
+                $("#wgt_name").addClass("pad_color");
+                $("#wgt_display").removeClass("display_wood");
+                $("#style_select option:first").next().attr('selected',true);
+                $("body, html").removeClass("without_radius").removeClass("radius_ft");
+                break;
+            case "3":
+                $(".b_top_left").addClass("without_back").removeClass("btl_pad");
+                $(".b_top_center").addClass("without_back").removeClass("btc_pad");
+                $(".b_top_right").addClass("without_back").removeClass("btr_pad");
+                $(".b_center_left").addClass("without_back").removeClass("bcl_pad");
+                $(".b_center_right").addClass("without_back").removeClass("bcr_pad");
+                $(".b_bottom_right").addClass("without_back").removeClass("bbr_pad");
+                $(".b_bottom_left").addClass("without_back").removeClass("bbl_pad");
+                $(".b_bottom_center").addClass("without_back").removeClass("bbc_pad");
+                $("#wgt_help").addClass("pad_color").addClass("pad_help");
+                $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
+                $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
+                $("#wgt_name").addClass("pad_color");
+                $("#wgt_display").removeClass("display_wood");
+                $("#style_select option:last").attr('selected',true);
+                $("body, html").addClass("without_radius").removeClass("radius_ft");
+                break;
+        }
     }
-}
 	
 });
\ No newline at end of file
diff --git a/resources/library/interactivities/Separe phrase.wgt/scripts/wcontainer.js b/resources/library/interactivities/Separe phrase.wgt/scripts/wcontainer.js
index be809815..4ed155a6 100644
--- a/resources/library/interactivities/Separe phrase.wgt/scripts/wcontainer.js	
+++ b/resources/library/interactivities/Separe phrase.wgt/scripts/wcontainer.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Display", 
+    view: "Close", 
     edit: "Edit",
     example: "this is a bunch of words which should be split apart",
     wgt_name: "Split a phrase",
@@ -8,7 +8,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 // if use the "view/edit" button or rely on the api instead
diff --git a/resources/library/interactivities/Separe phrase.wgt/styles/app.css b/resources/library/interactivities/Separe phrase.wgt/styles/app.css
index 6db70b17..ba022a7e 100644
--- a/resources/library/interactivities/Separe phrase.wgt/styles/app.css	
+++ b/resources/library/interactivities/Separe phrase.wgt/styles/app.css	
@@ -109,57 +109,40 @@
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -194,51 +177,50 @@
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -247,5 +229,36 @@
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Separe phrase.wgt/styles/master.css b/resources/library/interactivities/Separe phrase.wgt/styles/master.css
index 62ff205f..f08ff509 100644
--- a/resources/library/interactivities/Separe phrase.wgt/styles/master.css	
+++ b/resources/library/interactivities/Separe phrase.wgt/styles/master.css	
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;    
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
diff --git a/resources/library/interactivities/Separe texte.wgt/img/ar_down.png b/resources/library/interactivities/Separe texte.wgt/img/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Separe texte.wgt/img/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/ar_down_white.png b/resources/library/interactivities/Separe texte.wgt/img/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Separe texte.wgt/img/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/parameters-bg.png b/resources/library/interactivities/Separe texte.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Separe texte.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/slate-display.png b/resources/library/interactivities/Separe texte.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Separe texte.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/slate-edit.png b/resources/library/interactivities/Separe texte.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Separe texte.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/slate-help-white.png b/resources/library/interactivities/Separe texte.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Separe texte.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/slate-help.png b/resources/library/interactivities/Separe texte.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Separe texte.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Separe texte.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/toolbar-edit.png b/resources/library/interactivities/Separe texte.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Separe texte.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/toolbar-help.png b/resources/library/interactivities/Separe texte.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Separe texte.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Separe texte.wgt/img/toolbar-reload.png b/resources/library/interactivities/Separe texte.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Separe texte.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Separe texte.wgt/index.html b/resources/library/interactivities/Separe texte.wgt/index.html
index f615b9fe..bdb587f7 100644
--- a/resources/library/interactivities/Separe texte.wgt/index.html	
+++ b/resources/library/interactivities/Separe texte.wgt/index.html	
@@ -27,7 +27,6 @@
                     lang = sankore.locale().substr(0,2);    
                 } else 
                     lang = "en";
-
                 if(lang != "en"){
                     returnStatus(lang);
                 }
@@ -60,12 +59,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
+                    <div id="wgt_edit"></div>                    
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -75,7 +69,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Separe texte.wgt/locales/fr/index.html b/resources/library/interactivities/Separe texte.wgt/locales/fr/index.html
index 4a728cf8..20d6f93b 100644
--- a/resources/library/interactivities/Separe texte.wgt/locales/fr/index.html	
+++ b/resources/library/interactivities/Separe texte.wgt/locales/fr/index.html	
@@ -36,11 +36,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -50,7 +45,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Separe texte.wgt/locales/fr/scripts/wcontainer.js b/resources/library/interactivities/Separe texte.wgt/locales/fr/scripts/wcontainer.js
index f7c3e597..6fa223ee 100644
--- a/resources/library/interactivities/Separe texte.wgt/locales/fr/scripts/wcontainer.js	
+++ b/resources/library/interactivities/Separe texte.wgt/locales/fr/scripts/wcontainer.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Afficher", 
+    view: "Fermer", 
     edit: "Modifier",
     example: "bonjour, ceci est la première phrase. salut, c'est la deuxième phrase. bonjour à nouveau, c'est la troisième phrase. bonjour, c'est la quatrième phrase. salut, désolé, je suis en retard, je suis la cinquième phrase.",
     wgt_name: "Séparer un texte",
@@ -10,23 +10,24 @@ var sankoreLang = {
     help: "Aide",
     help_content: "<p><h3>Séparer les phrases d’un texte.</h3></p>"+
 
-"<p>Un texte est écrit sans que les points entre les phrases n’apparaissent. Le but de cette activité est d’insérer les points aux bons endroits. Une fois que les points sont placés correctement, la phrase se colore en vert.</p>"+
+    "<p>Un texte est écrit sans que les points entre les phrases n’apparaissent. Le but de cette activité est d’insérer les points aux bons endroits. Une fois que les points sont placés correctement, la phrase se colore en vert.</p>"+
 
-"<p>Pour ajouter les points entre les phrases, déplacez le curseur et cliquez entre deux mots, un point s’ajoute alors.</p>"+
+    "<p>Pour ajouter les points entre les phrases, déplacez le curseur et cliquez entre deux mots, un point s’ajoute alors.</p>"+
 
 
-"<p>Le bouton “Recharger” réinitialise l’exercice.</p>"+
+    "<p>Le bouton “Recharger” réinitialise l’exercice.</p>"+
 
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
 
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun), </li>"+
-"<li>de déterminer le texte sur lequel travailler.</li></ul>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun), </li>"+
+    "<li>de déterminer le texte sur lequel travailler.</li></ul>"+
 
-"<p>Ecrivez simplement dans la zone de texte les différentes phrases séparées par des points.<b> NB : Les points d’interrogation, les deux points “:”, les points-virgules “;” et les points d’exclamation ne sont pas pris en compte.</b></p>"+
+    "<p>Ecrivez simplement dans la zone de texte les différentes phrases séparées par des points.<b> NB : Les points d’interrogation, les deux points “:”, les points-virgules “;” et les points d’exclamation ne sont pas pris en compte.</b></p>"+
 
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 
 };
 
@@ -57,7 +58,7 @@ function wcontainer( containerID )
 	create
 	============
 	- creates html base, inits this.elements, assings events
-	*/
+     */
     this.create = function( containerID )
     {
         var html = 
@@ -93,7 +94,7 @@ function wcontainer( containerID )
 	setViewContent
 	===============
 	- assigns custom html to the viewmode container
-	*/
+     */
     this.setViewContent = function( html )
     {
         this.elements.container.find( "#mp_content .viewmode" ).html( html );
@@ -104,7 +105,7 @@ function wcontainer( containerID )
 	setEditContent
 	===============
 	- assigns custom html to the editmode container
-	*/
+     */
     this.setEditContent = function( html )
     {
         this.elements.container.find( "#mp_content .editmode" ).html( html );
@@ -117,8 +118,8 @@ function wcontainer( containerID )
 	modeEdit and modeView
 	=========================
 	- switch the widget betweed modes
-	* for customization extend onEditMode and onViewMode
-	*/
+     * for customization extend onEditMode and onViewMode
+     */
     this.modeEdit = function()
     {
         this.onEditMode();
@@ -126,7 +127,7 @@ function wcontainer( containerID )
         this.elements.edit.removeClass( "hide" );
         this.elements.view.addClass( "hide" );
 		
-        //this.adjustSize();
+    //this.adjustSize();
     };
     this.modeView = function()
     {
@@ -135,7 +136,7 @@ function wcontainer( containerID )
         this.elements.edit.addClass( "hide" );
         this.elements.view.removeClass( "hide" );
 		
-        //this.adjustSize();
+    //this.adjustSize();
     };
 	
 	
@@ -145,7 +146,7 @@ function wcontainer( containerID )
 	setData and getData
 	======================
 	- store some data inside
-	*/
+     */
     this.setData = function( name, value ){
         data[name] = value;
     };
@@ -163,7 +164,7 @@ function wcontainer( containerID )
 	onEditMode and onViewMode
 	==========================
 	- these are called when the mode is being changed
-	*/
+     */
     this.onEditMode = function(){
     //
     };
@@ -176,8 +177,8 @@ function wcontainer( containerID )
 	viewSize and editSize
 	======================
 	- calculate container size for the adjustSize method
-	* they are likely to be redefined for each particular widget
-	*/
+     * they are likely to be redefined for each particular widget
+     */
     this.viewSize = function(){
         return {
             w: this.elements.containerView.outerWidth(),
@@ -196,8 +197,8 @@ function wcontainer( containerID )
 	checkAnswer
 	=====================
 	- check if the exercise in the view mode was done right
-	* redefine it for each particular widget
-	*/
+     * redefine it for each particular widget
+     */
     this.checkAnswer = function()
     {
     //
diff --git a/resources/library/interactivities/Separe texte.wgt/locales/ru/index.html b/resources/library/interactivities/Separe texte.wgt/locales/ru/index.html
index 4a728cf8..20d6f93b 100644
--- a/resources/library/interactivities/Separe texte.wgt/locales/ru/index.html	
+++ b/resources/library/interactivities/Separe texte.wgt/locales/ru/index.html	
@@ -36,11 +36,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -50,7 +45,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Separe texte.wgt/locales/ru/scripts/wcontainer.js b/resources/library/interactivities/Separe texte.wgt/locales/ru/scripts/wcontainer.js
index 8fb023d9..b0bc3111 100644
--- a/resources/library/interactivities/Separe texte.wgt/locales/ru/scripts/wcontainer.js	
+++ b/resources/library/interactivities/Separe texte.wgt/locales/ru/scripts/wcontainer.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Показать", 
+    view: "Закрыть", 
     edit: "Изменить",
     example: "привет, это первое предложение. а это второе предложение. и снова привет, это третье предложение. добрый день, это четвертое предложение. привет, извини, но я последнее предложение.",
     wgt_name: "Разделить текст",
@@ -8,7 +8,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 // if use the "view/edit" button or rely on the api instead
diff --git a/resources/library/interactivities/Separe texte.wgt/scripts/app2.js b/resources/library/interactivities/Separe texte.wgt/scripts/app2.js
index a53fa9b5..db3ed1ac 100644
--- a/resources/library/interactivities/Separe texte.wgt/scripts/app2.js	
+++ b/resources/library/interactivities/Separe texte.wgt/scripts/app2.js	
@@ -32,7 +32,7 @@ $(document).ready(function()
     
     if (window.widget) {
         window.widget.onleave = function(){
-            sankore.setPreference("spl_text_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("spl_text_style", $("#style_select").find("option:selected").val());
             if(w.editMode){
                 sankore.setPreference("ordSplText", w.elements.container.find( "textarea" ).val());
                 sankore.setPreference("ordSplTextState", "0");
@@ -48,7 +48,7 @@ $(document).ready(function()
     
     if(sankore.preference("spl_text_style","")){
         changeStyle(sankore.preference("spl_text_style",""));
-        $(".style_select").val(sankore.preference("spl_text_style",""));
+        $("#style_select").val(sankore.preference("spl_text_style",""));
     } else
         changeStyle("3")
     
@@ -56,13 +56,23 @@ $(document).ready(function()
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })  
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 w.modeView();
@@ -71,7 +81,7 @@ $(document).ready(function()
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 w.modeEdit();
@@ -84,11 +94,13 @@ $(document).ready(function()
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
         } else {            
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -105,14 +117,6 @@ $(document).ready(function()
         }
     });
     
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
-    
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })  
-    
     w.maxWidth = 600;
 	
     w.setEditContent( '<div class="inputwrap"><textarea class="percent">' + sentences + '</textarea></div>' );
@@ -279,10 +283,10 @@ $(document).ready(function()
                 $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
                 $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
                 $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-                $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
                 $("#wgt_name").removeClass("pad_color");
-                $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-                $("body, html").removeClass("without_radius");
+                $("#wgt_display").addClass("display_wood");
+                $("#style_select option:first").attr('selected',true);
+                $("body, html").removeClass("without_radius").addClass("radius_ft");
                 break;
             case "2":
                 $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -296,10 +300,10 @@ $(document).ready(function()
                 $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
                 $("#wgt_help").addClass("pad_color").addClass("pad_help");
                 $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-                $("#wgt_display").addClass("pad_color").addClass("pad_edit");
                 $("#wgt_name").addClass("pad_color");
-                $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-                $("body, html").removeClass("without_radius");
+                $("#wgt_display").removeClass("display_wood");
+                $("#style_select option:first").next().attr('selected',true);
+                $("body, html").removeClass("without_radius").removeClass("radius_ft");
                 break;
             case "3":
                 $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -313,10 +317,10 @@ $(document).ready(function()
                 $("#wgt_help").addClass("pad_color").addClass("pad_help");
                 $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
                 $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-                $("#wgt_display").addClass("pad_color").addClass("pad_edit");
                 $("#wgt_name").addClass("pad_color");
-                $(".style_select").addClass("none_select").val(val);
-                $("body, html").addClass("without_radius");
+                $("#wgt_display").removeClass("display_wood");
+                $("#style_select option:last").attr('selected',true);
+                $("body, html").addClass("without_radius").removeClass("radius_ft");
                 break;
         }
     }
diff --git a/resources/library/interactivities/Separe texte.wgt/scripts/wcontainer.js b/resources/library/interactivities/Separe texte.wgt/scripts/wcontainer.js
index f64ef65c..7cc12b34 100644
--- a/resources/library/interactivities/Separe texte.wgt/scripts/wcontainer.js	
+++ b/resources/library/interactivities/Separe texte.wgt/scripts/wcontainer.js	
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Display", 
+    view: "Close", 
     edit: "Edit",
     example: "hello, this is the first sentence. hi, this is the second sentence. hello again, this is the third sentence. good morning, this is the fourth sentence. hi, sorry, i\'m late, i\'m the fifth sentence.",
     wgt_name: "Split a text",
@@ -8,7 +8,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 // if use the "view/edit" button or rely on the api instead
diff --git a/resources/library/interactivities/Separe texte.wgt/styles/app.css b/resources/library/interactivities/Separe texte.wgt/styles/app.css
index fb0061ea..e96bbf70 100644
--- a/resources/library/interactivities/Separe texte.wgt/styles/app.css	
+++ b/resources/library/interactivities/Separe texte.wgt/styles/app.css	
@@ -110,57 +110,40 @@
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -195,51 +178,50 @@
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -248,5 +230,36 @@
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/resources/library/interactivities/Separe texte.wgt/styles/master.css b/resources/library/interactivities/Separe texte.wgt/styles/master.css
index 42dde744..c1b4e81c 100644
--- a/resources/library/interactivities/Separe texte.wgt/styles/master.css	
+++ b/resources/library/interactivities/Separe texte.wgt/styles/master.css	
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;    
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
diff --git a/resources/library/interactivities/Syllabes.wgt/config.xml b/resources/library/interactivities/Syllabes.wgt/config.xml
index 221ba65e..aa5f8820 100644
--- a/resources/library/interactivities/Syllabes.wgt/config.xml
+++ b/resources/library/interactivities/Syllabes.wgt/config.xml
@@ -4,7 +4,7 @@
 		xmlns:ub="http://uniboard.mnemis.com/widgets"
         id="http://www.example.net/widgets/helloworld" 
         version="1.0"
-        width="750"
+        width="770"
         height="320" 
 		ub:resizable="true">
 		
diff --git a/resources/library/interactivities/Syllabes.wgt/img/ar_down.png b/resources/library/interactivities/Syllabes.wgt/img/ar_down.png
deleted file mode 100644
index a20fab4f..00000000
Binary files a/resources/library/interactivities/Syllabes.wgt/img/ar_down.png and /dev/null differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/ar_down_white.png b/resources/library/interactivities/Syllabes.wgt/img/ar_down_white.png
deleted file mode 100644
index 4a1d133b..00000000
Binary files a/resources/library/interactivities/Syllabes.wgt/img/ar_down_white.png and /dev/null differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/parameters-bg.png b/resources/library/interactivities/Syllabes.wgt/img/parameters-bg.png
new file mode 100644
index 00000000..36f648e1
Binary files /dev/null and b/resources/library/interactivities/Syllabes.wgt/img/parameters-bg.png differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/slate-display.png b/resources/library/interactivities/Syllabes.wgt/img/slate-display.png
deleted file mode 100644
index 96166143..00000000
Binary files a/resources/library/interactivities/Syllabes.wgt/img/slate-display.png and /dev/null differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/slate-edit.png b/resources/library/interactivities/Syllabes.wgt/img/slate-edit.png
deleted file mode 100644
index 17f5fc5c..00000000
Binary files a/resources/library/interactivities/Syllabes.wgt/img/slate-edit.png and /dev/null differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/slate-help-white.png b/resources/library/interactivities/Syllabes.wgt/img/slate-help-white.png
deleted file mode 100644
index 7b5ebfd8..00000000
Binary files a/resources/library/interactivities/Syllabes.wgt/img/slate-help-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/slate-help.png b/resources/library/interactivities/Syllabes.wgt/img/slate-help.png
deleted file mode 100644
index 069052d0..00000000
Binary files a/resources/library/interactivities/Syllabes.wgt/img/slate-help.png and /dev/null differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-help.png b/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-help.png
new file mode 100644
index 00000000..fb7cdeba
Binary files /dev/null and b/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-help.png differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-reload-white.png b/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-reload-white.png
deleted file mode 100644
index 78d146ec..00000000
Binary files a/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-reload-white.png and /dev/null differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-reload.png b/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-reload.png
index 685a5cb2..844169a9 100644
Binary files a/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-reload.png and b/resources/library/interactivities/Syllabes.wgt/img/slate-toolbar-reload.png differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/toolbar-edit.png b/resources/library/interactivities/Syllabes.wgt/img/toolbar-edit.png
new file mode 100644
index 00000000..daa338cd
Binary files /dev/null and b/resources/library/interactivities/Syllabes.wgt/img/toolbar-edit.png differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/toolbar-help.png b/resources/library/interactivities/Syllabes.wgt/img/toolbar-help.png
new file mode 100644
index 00000000..6c4454c0
Binary files /dev/null and b/resources/library/interactivities/Syllabes.wgt/img/toolbar-help.png differ
diff --git a/resources/library/interactivities/Syllabes.wgt/img/toolbar-reload.png b/resources/library/interactivities/Syllabes.wgt/img/toolbar-reload.png
new file mode 100644
index 00000000..340d7371
Binary files /dev/null and b/resources/library/interactivities/Syllabes.wgt/img/toolbar-reload.png differ
diff --git a/resources/library/interactivities/Syllabes.wgt/index.html b/resources/library/interactivities/Syllabes.wgt/index.html
index f0e87e3b..89edc875 100644
--- a/resources/library/interactivities/Syllabes.wgt/index.html
+++ b/resources/library/interactivities/Syllabes.wgt/index.html
@@ -60,11 +60,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -74,7 +69,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Syllabes.wgt/locales/fr/index.html b/resources/library/interactivities/Syllabes.wgt/locales/fr/index.html
index 99f21db7..5a32491c 100644
--- a/resources/library/interactivities/Syllabes.wgt/locales/fr/index.html
+++ b/resources/library/interactivities/Syllabes.wgt/locales/fr/index.html
@@ -37,11 +37,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -51,7 +46,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Syllabes.wgt/locales/fr/scripts/wcontainer.js b/resources/library/interactivities/Syllabes.wgt/locales/fr/scripts/wcontainer.js
index de1c180a..1b8db4ef 100644
--- a/resources/library/interactivities/Syllabes.wgt/locales/fr/scripts/wcontainer.js
+++ b/resources/library/interactivities/Syllabes.wgt/locales/fr/scripts/wcontainer.js
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Afficher", 
+    view: "Fermer", 
     edit: "Modifier",
     example: "so*phis*ti*qué",
     wgt_name: "Syllabe",
@@ -9,20 +9,21 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Syllabe</h2></p>"+
-"<p><h3>Séparer les syllabes d’un mot.</h3></p>"+
+    "<p><h3>Séparer les syllabes d’un mot.</h3></p>"+
 
-"<p>Un mot est écrit et le but est de découper le mot en syllabes. Une fois que le découpage est correct, le mot se colore en vert.</p>"+
-"<p>Pour ajouter une séparation entre deux syllabes, déplacez le curseur et cliquez entre deux lettres, une séparation s’ajoute. </p>"+
+    "<p>Un mot est écrit et le but est de découper le mot en syllabes. Une fois que le découpage est correct, le mot se colore en vert.</p>"+
+    "<p>Pour ajouter une séparation entre deux syllabes, déplacez le curseur et cliquez entre deux lettres, une séparation s’ajoute. </p>"+
 
-"<p>Le bouton “Recharger” réinitialise l’exercice.</p>"+
+    "<p>Le bouton “Recharger” réinitialise l’exercice.</p>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut tablette), </li>"+
-"<li>de déterminer le mot sur lequel travailler.</li></ul>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut tablette), </li>"+
+    "<li>de déterminer le mot sur lequel travailler.</li></ul>"+
 
-"<p>Ecrivez simplement dans la zone de texte le mot en insérant entre les syllabes une étoile *.</p>"+
+    "<p>Ecrivez simplement dans la zone de texte le mot en insérant entre les syllabes une étoile *.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 
 };
 
@@ -118,7 +119,7 @@ function wcontainer( containerID )
         this.elements.edit.removeClass( "hide" );
         this.elements.view.addClass( "hide" );
 		
-        //this.adjustSize();
+    //this.adjustSize();
     };
     this.modeView = function()
     {
@@ -127,7 +128,7 @@ function wcontainer( containerID )
         this.elements.edit.addClass( "hide" );
         this.elements.view.removeClass( "hide" );
 		
-        //this.adjustSize();
+    //this.adjustSize();
     };
 	
 
diff --git a/resources/library/interactivities/Syllabes.wgt/locales/ru/index.html b/resources/library/interactivities/Syllabes.wgt/locales/ru/index.html
index 99f21db7..5a32491c 100644
--- a/resources/library/interactivities/Syllabes.wgt/locales/ru/index.html
+++ b/resources/library/interactivities/Syllabes.wgt/locales/ru/index.html
@@ -37,11 +37,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -51,7 +46,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="ub-widget">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>
diff --git a/resources/library/interactivities/Syllabes.wgt/locales/ru/scripts/wcontainer.js b/resources/library/interactivities/Syllabes.wgt/locales/ru/scripts/wcontainer.js
index cf158ff3..cde55e7a 100644
--- a/resources/library/interactivities/Syllabes.wgt/locales/ru/scripts/wcontainer.js
+++ b/resources/library/interactivities/Syllabes.wgt/locales/ru/scripts/wcontainer.js
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Показать", 
+    view: "Закрыть", 
     edit: "Изменить",
     example: "слож*ный",
     wgt_name: "Разделить слово",
@@ -8,7 +8,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 // if use the "view/edit" button or rely on the api instead
diff --git a/resources/library/interactivities/Syllabes.wgt/scripts/spl-word.js b/resources/library/interactivities/Syllabes.wgt/scripts/spl-word.js
index e46e7f0d..9c2309d9 100644
--- a/resources/library/interactivities/Syllabes.wgt/scripts/spl-word.js
+++ b/resources/library/interactivities/Syllabes.wgt/scripts/spl-word.js
@@ -36,7 +36,7 @@ $(document).ready(function()
 
     if (window.widget) {
         window.widget.onleave = function(){
-            sankore.setPreference("spl_word_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("spl_word_style", $("#style_select").find("option:selected").val());
             if(w.editMode){
                 sankore.setPreference("ordSplWords", w.elements.container.find( "input" ).val().trim( ['*'] ));
                 sankore.setPreference("ordSplWordsState", "0");
@@ -52,21 +52,31 @@ $(document).ready(function()
 
     if(sankore.preference("spl_word_style","")){
         changeStyle(sankore.preference("spl_word_style",""));
-        $(".style_select").val(sankore.preference("spl_word_style",""));
+        $("#style_select").val(sankore.preference("spl_word_style",""));
     } else
         changeStyle("3")
 
     $("#wgt_display").text(sankoreLang.view);
     $("#wgt_edit").text(sankoreLang.edit);
     $("#wgt_help").text(sankoreLang.help);
-    $("#help").html(sankoreLang.help_content);
+    $("#help").html(sankoreLang.help_content);    
+    $("#style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
+    
+    $("#style_select").change(function (event){
+        changeStyle($(this).find("option:selected").val());
+    })
     
     $("#wgt_display, #wgt_edit").click(function(event){
         if(this.id == "wgt_display"){
             if(!$(this).hasClass("selected")){                
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");                
+                $("#parameters").css("display","none");                
                 $(this).css("display", "none");
                 $("#wgt_edit").css("display", "block");
                 w.modeView();
@@ -75,7 +85,7 @@ $(document).ready(function()
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");                
+                $("#parameters").css("display","block");                
                 $(this).css("display", "none");
                 $("#wgt_display").css("display", "block");
                 w.modeEdit();
@@ -88,11 +98,13 @@ $(document).ready(function()
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#ub-widget").show();
             });
         } else {            
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#ub-widget").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -108,14 +120,6 @@ $(document).ready(function()
             $("#wgt_display").trigger("click");
         }
     });
-    
-    $(".style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
-    
-    $(".style_select").change(function (event){
-        changeStyle($(this).find("option:selected").val());
-    })
 
     // onViewMode
     w.onViewMode = function()
@@ -214,10 +218,10 @@ $(document).ready(function()
                 $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
                 $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
                 $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-                $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
                 $("#wgt_name").removeClass("pad_color");
-                $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
-                $("body, html").removeClass("without_radius");
+                $("#wgt_display").addClass("display_wood");
+                $("#style_select option:first").attr('selected',true);
+                $("body, html").removeClass("without_radius").addClass("radius_ft");
                 break;
             case "2":
                 $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -231,10 +235,10 @@ $(document).ready(function()
                 $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
                 $("#wgt_help").addClass("pad_color").addClass("pad_help");
                 $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-                $("#wgt_display").addClass("pad_color").addClass("pad_edit");
                 $("#wgt_name").addClass("pad_color");
-                $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
-                $("body, html").removeClass("without_radius");
+                $("#wgt_display").removeClass("display_wood");
+                $("#style_select option:first").next().attr('selected',true);
+                $("body, html").removeClass("without_radius").removeClass("radius_ft");
                 break;
             case "3":
                 $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -248,10 +252,10 @@ $(document).ready(function()
                 $("#wgt_help").addClass("pad_color").addClass("pad_help");
                 $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
                 $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-                $("#wgt_display").addClass("pad_color").addClass("pad_edit");
                 $("#wgt_name").addClass("pad_color");
-                $(".style_select").addClass("none_select").val(val);
-                $("body, html").addClass("without_radius");
+                $("#wgt_display").removeClass("display_wood");
+                $("#style_select option:last").attr('selected',true);
+                $("body, html").addClass("without_radius").removeClass("radius_ft");
                 break;
         }
     }
diff --git a/resources/library/interactivities/Syllabes.wgt/scripts/wcontainer.js b/resources/library/interactivities/Syllabes.wgt/scripts/wcontainer.js
index daaf20b3..62742d3a 100644
--- a/resources/library/interactivities/Syllabes.wgt/scripts/wcontainer.js
+++ b/resources/library/interactivities/Syllabes.wgt/scripts/wcontainer.js
@@ -1,5 +1,5 @@
 var sankoreLang = {
-    view: "Display", 
+    view: "Close", 
     edit: "Edit",
     example: "so*phis*ti*ca*ted",
     wgt_name: "Split a word",
@@ -8,7 +8,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 // if use the "view/edit" button or rely on the api instead
diff --git a/resources/library/interactivities/Syllabes.wgt/styles/master.css b/resources/library/interactivities/Syllabes.wgt/styles/master.css
index 9775eba8..c9d9a0c1 100644
--- a/resources/library/interactivities/Syllabes.wgt/styles/master.css
+++ b/resources/library/interactivities/Syllabes.wgt/styles/master.css
@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;    
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
diff --git a/resources/library/interactivities/Syllabes.wgt/styles/spl-word.css b/resources/library/interactivities/Syllabes.wgt/styles/spl-word.css
index 3bcf504f..417d0ef3 100644
--- a/resources/library/interactivities/Syllabes.wgt/styles/spl-word.css
+++ b/resources/library/interactivities/Syllabes.wgt/styles/spl-word.css
@@ -111,57 +111,40 @@
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;   
-    color: #8c5730;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 24px;    
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
+    color: white;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
-    background-image: url(../img/slate-edit.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
-    background-image: url(../img/slate-toolbar-reload.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .btl_pad{
@@ -196,52 +179,50 @@
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
-    color: white !important;
+.without_radius{
+    border-radius: 0 !important;
 }
 
-.pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+.without_back{
+    background: none !important;
 }
 
-.pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+.pad_color{
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
-    background-color: black !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+.pad_reload{
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
-
-.without_radius{
-    border-radius: 0 !important;
+.pad_edit{
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
-    background: none !important;
+.pad_help{
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
-    background-color: #333 !important;
+.help_wood{
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
-    background-image: url(../img/slate-help-white.png) !important;
+.help_pad{
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
-    background-image: url(../img/slate-help.png);
-    background-repeat: no-repeat;
-    background-position: top 0;
+    padding-left: 35px;
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -250,5 +231,36 @@
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }
\ No newline at end of file
diff --git a/src/adaptors/UBCFFSubsetAdaptor.cpp b/src/adaptors/UBCFFSubsetAdaptor.cpp
index f156e4c5..d06c95a7 100644
--- a/src/adaptors/UBCFFSubsetAdaptor.cpp
+++ b/src/adaptors/UBCFFSubsetAdaptor.cpp
@@ -16,6 +16,7 @@
 #include <QSvgGenerator>
 #include <QSvgRenderer>
 #include <QPixmap>
+#include <QMap>
 
 #include "core/UBPersistenceManager.h"
 
@@ -248,6 +249,11 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgRect(const QDomElement &elem
     painter.end();
 
     UBGraphicsSvgItem *svgItem = mCurrentScene->addSvg(QUrl::fromLocalFile(generator->fileName()));
+   
+    QString uuid = QUuid::createUuid().toString();
+    mRefToUuidMap.insert(element.attribute(aId), uuid);
+    svgItem->setUuid(QUuid(uuid));
+
     QTransform transform;
     QString textTransform = element.attribute(aTransform);
 
@@ -298,6 +304,11 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgEllipse(const QDomElement &e
     painter.end();
 
     UBGraphicsSvgItem *svgItem = mCurrentScene->addSvg(QUrl::fromLocalFile(generator->fileName()));
+
+    QString uuid = QUuid::createUuid().toString();
+    mRefToUuidMap.insert(element.attribute(aId), uuid);
+    svgItem->setUuid(QUuid(uuid));
+
     QTransform transform;
     QString textTransform = element.attribute(aTransform);
 
@@ -373,37 +384,65 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgPolygon(const QDomElement &e
     brush.setColor(fillColor);
     brush.setStyle(Qt::SolidPattern);
 
-    QSvgGenerator *generator = createSvgGenerator(width + pen.width(), height + pen.width());
-    QPainter painter;
+ 
+    QUuid itemUuid(element.attribute(aId).right(QUuid().toString().length()));
+    QUuid itemGroupUuid(element.attribute(aId).left(QUuid().toString().length()-1));
+    if (!itemUuid.isNull() && (itemGroupUuid!=itemUuid)) // reimported from UBZ
+    {
+        UBGraphicsPolygonItem *graphicsPolygon = mCurrentScene->polygonToPolygonItem(polygon);
 
-    painter.begin(generator); //drawing to svg tmp file
+        graphicsPolygon->setBrush(brush);
 
-    painter.translate(pen.widthF() / 2 - x1, pen.widthF() / 2 - y1);
-    painter.setBrush(brush);
-    painter.setPen(pen);
-    painter.drawPolygon(polygon);
+        QTransform transform;
+        QString textTransform = element.attribute(aTransform);
 
-    painter.end();
+        graphicsPolygon->resetTransform();
+        if (!textTransform.isNull()) {
+            transform = transformFromString(textTransform, graphicsPolygon);
+        }
+        mCurrentScene->addItem(graphicsPolygon);
 
-    //add resulting svg file to scene
-    UBGraphicsSvgItem *svgItem = mCurrentScene->addSvg(QUrl::fromLocalFile(generator->fileName()));
-    QTransform transform;
-    QString textTransform = element.attribute(aTransform);
+        graphicsPolygon->setUuid(itemUuid);
+        mRefToUuidMap.insert(element.attribute(aId), itemUuid);
 
-    svgItem->resetTransform();
-    if (!textTransform.isNull()) {
-        transform = transformFromString(textTransform, svgItem);
     }
-    repositionSvgItem(svgItem, width +strokeWidth, height + strokeWidth, x1 - strokeWidth/2 + transform.m31(), y1 + strokeWidth/2 + transform.m32(), transform);
-    hashSceneItem(element, svgItem);
-
-    if (mGSectionContainer)
+    else // single CFF
     {
-        addItemToGSection(svgItem);
-    }
+        QSvgGenerator *generator = createSvgGenerator(width + pen.width(), height + pen.width());
+        QPainter painter;
 
-    delete generator;
+        painter.begin(generator); //drawing to svg tmp file
+
+        painter.translate(pen.widthF() / 2 - x1, pen.widthF() / 2 - y1);
+        painter.setBrush(brush);
+        painter.setPen(pen);
+        painter.drawPolygon(polygon);
+
+        painter.end();
+
+        //add resulting svg file to scene
+        UBGraphicsSvgItem *svgItem = mCurrentScene->addSvg(QUrl::fromLocalFile(generator->fileName()));
+        QTransform transform;
+        QString textTransform = element.attribute(aTransform);
+        
+        QUuid uuid = QUuid::createUuid().toString();
+        mRefToUuidMap.insert(element.attribute(aId), uuid);
+        svgItem->setUuid(uuid);
+
+        svgItem->resetTransform();
+        if (!textTransform.isNull()) {
+            transform = transformFromString(textTransform, svgItem);
+        }
+        repositionSvgItem(svgItem, width +strokeWidth, height + strokeWidth, x1 - strokeWidth/2 + transform.m31(), y1 + strokeWidth/2 + transform.m32(), transform);
+        hashSceneItem(element, svgItem);
 
+        if (mGSectionContainer)
+        {
+            addItemToGSection(svgItem);
+        }
+
+        delete generator;
+    }
     return true;
 }
 bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgPolyline(const QDomElement &element)
@@ -441,6 +480,7 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgPolyline(const QDomElement &
     //bounding rect lef top corner coordinates
     qreal x1 = polygon.boundingRect().topLeft().x();
     qreal y1 = polygon.boundingRect().topLeft().y();
+
     //bounding rect dimensions
     qreal width = polygon.boundingRect().width();
     qreal height = polygon.boundingRect().height();
@@ -458,35 +498,72 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgPolyline(const QDomElement &
     pen.setColor(strokeColor);
     pen.setWidth(strokeWidth);
 
-    QSvgGenerator *generator = createSvgGenerator(width + pen.width(), height + pen.width());
-    QPainter painter;
+    QBrush brush;
+    brush.setColor(strokeColor);
+    brush.setStyle(Qt::SolidPattern);
 
-    painter.begin(generator); //drawing to svg tmp file
+    QUuid itemUuid(element.attribute(aId).right(QUuid().toString().length()));
+    QUuid itemGroupUuid(element.attribute(aId).left(QUuid().toString().length()-1));
+    if (!itemUuid.isNull() && (itemGroupUuid!=itemUuid)) // reimported from UBZ
+    {
+        UBGraphicsPolygonItem *graphicsPolygon = new UBGraphicsPolygonItem(polygon);
 
-    painter.translate(pen.widthF()/2 - x1, pen.widthF()/2- y1);
-    painter.setPen(pen);
-    painter.drawPolyline(polygon);
+        UBGraphicsStroke *stroke = new UBGraphicsStroke();
+        graphicsPolygon->setStroke(stroke);
 
-    painter.end();
+        graphicsPolygon->setBrush(brush);
+        QTransform transform;
+        QString textTransform = element.attribute(aTransform);
 
-    //add resulting svg file to scene
-    UBGraphicsSvgItem *svgItem = mCurrentScene->addSvg(QUrl::fromLocalFile(generator->fileName()));
-    QTransform transform;
-    QString textTransform = element.attribute(aTransform);
+        graphicsPolygon->resetTransform();
+        if (!textTransform.isNull()) {
+            transform = transformFromString(textTransform, graphicsPolygon);
+        }
+        mCurrentScene->addItem(graphicsPolygon);
 
-    svgItem->resetTransform();
-    if (!textTransform.isNull()) {
-        transform = transformFromString(textTransform, svgItem);
-    }
-    repositionSvgItem(svgItem, width +strokeWidth, height + strokeWidth, x1 + transform.m31() - strokeWidth/2, y1 + transform.m32() + strokeWidth/2, transform);
-    hashSceneItem(element, svgItem);
+        graphicsPolygon->setUuid(itemUuid);
+        mRefToUuidMap.insert(element.attribute(aId), itemUuid);
 
-    if (mGSectionContainer)
+    }
+    else // simple CFF
     {
-        addItemToGSection(svgItem);
+        QSvgGenerator *generator = createSvgGenerator(width + pen.width(), height + pen.width());
+        QPainter painter;
+
+        painter.begin(generator); //drawing to svg tmp file
+
+        painter.translate(pen.widthF() / 2 - x1, pen.widthF() / 2 - y1);
+        painter.setBrush(brush);
+        painter.setPen(pen);
+        painter.drawPolygon(polygon);
+
+        painter.end();
+
+        //add resulting svg file to scene
+        UBGraphicsSvgItem *svgItem = mCurrentScene->addSvg(QUrl::fromLocalFile(generator->fileName()));
+        
+        QString uuid = QUuid::createUuid().toString();
+        mRefToUuidMap.insert(element.attribute(aId), uuid);
+        svgItem->setUuid(QUuid(uuid));
+
+        QTransform transform;
+        QString textTransform = element.attribute(aTransform);
+
+        svgItem->resetTransform();
+        if (!textTransform.isNull()) {
+            transform = transformFromString(textTransform, svgItem);
+        }
+        repositionSvgItem(svgItem, width +strokeWidth, height + strokeWidth, x1 - strokeWidth/2 + transform.m31(), y1 + strokeWidth/2 + transform.m32(), transform);
+        hashSceneItem(element, svgItem);
+
+        if (mGSectionContainer)
+        {
+            addItemToGSection(svgItem);
+        }
+
+        delete generator;
     }
 
-    delete generator;
 
     return true;
 }
@@ -621,6 +698,10 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgText(const QDomElement &elem
     //add resulting svg file to scene
     UBGraphicsSvgItem *svgItem = mCurrentScene->addSvg(QUrl::fromLocalFile(generator->fileName()));
 
+    QString uuid = QUuid::createUuid().toString();
+    mRefToUuidMap.insert(element.attribute(aId), uuid);
+    svgItem->setUuid(QUuid(uuid));
+
     svgItem->resetTransform();
     repositionSvgItem(svgItem, width, height, x + transform.m31(), y + transform.m32(), transform);
     hashSceneItem(element, svgItem);
@@ -734,6 +815,10 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgTextarea(const QDomElement &
     UBGraphicsTextItem *svgItem = mCurrentScene->addTextHtml(doc.toHtml());
     svgItem->resize(width, height);
 
+    QString uuid = QUuid::createUuid().toString();
+    mRefToUuidMap.insert(element.attribute(aId), uuid);
+    svgItem->setUuid(QUuid(uuid));
+
     QTransform transform;
     QString textTransform = element.attribute(aTransform);
 
@@ -783,6 +868,11 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgImage(const QDomElement &ele
     }
 
    UBGraphicsPixmapItem *pixItem = mCurrentScene->addPixmap(pix, NULL);
+
+   QString uuid = QUuid::createUuid().toString();
+   mRefToUuidMap.insert(element.attribute(aId), uuid);
+   pixItem->setUuid(QUuid(uuid));
+
    QTransform transform;
    QString textTransform = element.attribute(aTransform);
 
@@ -830,6 +920,10 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgFlash(const QDomElement &ele
     UBGraphicsWidgetItem *flashItem = mCurrentScene->addW3CWidget(QUrl::fromLocalFile(flashUrl));
     flashItem->setSourceUrl(urlPath);
 
+    QString uuid = QUuid::createUuid().toString();
+    mRefToUuidMap.insert(element.attribute(aId), uuid);
+    flashItem->setUuid(QUuid(uuid));
+
     QTransform transform;
     QString textTransform = element.attribute(aTransform);
 
@@ -867,14 +961,15 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgAudio(const QDomElement &ele
         concreteUrl = QUrl::fromLocalFile(audioPath);
     }
 
-    QUuid uuid = QUuid::createUuid();
+    QString uuid = QUuid::createUuid().toString();
+    mRefToUuidMap.insert(element.attribute(aId), uuid);
 
     QString destFile;
     bool b = UBPersistenceManager::persistenceManager()->addFileToDocument(
             mCurrentScene->document(), 
             concreteUrl.toLocalFile(), 
             UBPersistenceManager::audioDirectory,
-            uuid,
+            QUuid(uuid),
             destFile);
     if (!b)
     {
@@ -883,6 +978,7 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgAudio(const QDomElement &ele
     concreteUrl = QUrl::fromLocalFile(destFile);
     
     UBGraphicsMediaItem *audioItem = mCurrentScene->addAudio(concreteUrl, false);
+
     QTransform transform;
     QString textTransform = parentOfAudio.attribute(aTransform);
 
@@ -920,15 +1016,15 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgVideo(const QDomElement &ele
         concreteUrl = QUrl::fromLocalFile(videoPath);
     }
 
-    QUuid uuid = QUuid::createUuid();
-
+    QString uuid = QUuid::createUuid().toString();
+    mRefToUuidMap.insert(element.attribute(aId), uuid);
 
     QString destFile;
     bool b = UBPersistenceManager::persistenceManager()->addFileToDocument(
             mCurrentScene->document(), 
             concreteUrl.toLocalFile(), 
             UBPersistenceManager::videoDirectory,
-            uuid,
+            QUuid(uuid),
             destFile);
     if (!b)
     {
@@ -937,6 +1033,7 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgVideo(const QDomElement &ele
     concreteUrl = QUrl::fromLocalFile(destFile);
 
     UBGraphicsMediaItem *videoItem = mCurrentScene->addVideo(concreteUrl, false);
+
     QTransform transform;
     QString textTransform = element.attribute(aTransform);
 
@@ -980,8 +1077,8 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgElement(const QDomElement &p
 {
     QString tagName = parent.tagName();
     if (parent.namespaceURI() != svgNS) {
-        qDebug() << "Incorrect namespace, error at content file, line number" << parent.lineNumber();
-        return false;
+        qWarning() << "Incorrect namespace, error at content file, line number" << parent.lineNumber();
+        //return false;
     }
 
     if      (tagName == tG          &&  !parseGSection(parent))             return false;
@@ -1027,8 +1124,8 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvgPageset(const QDomElement &p
 bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseIwbMeta(const QDomElement &element)
 {
     if (element.namespaceURI() != iwbNS) {
-        qDebug() << "incorrect meta namespace, incorrect document";
-        return false;
+        qWarning() << "incorrect meta namespace, incorrect document";
+        //return false;
     }
 
     return true;
@@ -1036,8 +1133,8 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseIwbMeta(const QDomElement &elem
 bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvg(const QDomElement &svgSection)
 {
     if (svgSection.namespaceURI() != svgNS) {
-        qDebug() << "incorrect svg namespace, incorrect document";
-        return false;
+        qWarning() << "incorrect svg namespace, incorrect document";
+       // return false;
     }
 
     parseSvgSectionAttr(svgSection);
@@ -1052,15 +1149,92 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseSvg(const QDomElement &svgSecti
     return true;
 }
 
-bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseIwbGroup(QDomElement &parent)
+UBGraphicsGroupContainerItem *UBCFFSubsetAdaptor::UBCFFSubsetReader::parseIwbGroup(QDomElement &parent)
 {
     //TODO. Create groups from elements parsed by parseIwbElement() function
     if (parent.namespaceURI() != iwbNS) {
-        qDebug() << "incorrect iwb group namespace, incorrect document";
-        return false;
+        qWarning() << "incorrect iwb group namespace, incorrect document";
+      //  return false;
     }
 
-    return true;
+    UBGraphicsGroupContainerItem *group = new UBGraphicsGroupContainerItem();
+    QMultiMap<QString, UBGraphicsPolygonItem *> strokesGroupsContainer;    
+    QList<QGraphicsItem *> groupContainer;    
+    QString currentStrokeIdentifier;
+
+    QDomElement currentStrokeElement = parent.firstChildElement();    
+    while (!currentStrokeElement.isNull())
+    {
+        if (tGroup == currentStrokeElement.tagName())
+            group->addToGroup(parseIwbGroup(currentStrokeElement));
+        else
+        {
+            
+            QString ref = currentStrokeElement.attribute(aRef);
+            QString uuid = mRefToUuidMap[ref];
+            if (!uuid.isEmpty())
+            {
+                if (ref.size() > QUuid().toString().length()) // create stroke group
+                {              
+                    currentStrokeIdentifier = ref.left(QUuid().toString().length()-1);
+                    UBGraphicsPolygonItem *strokeByUuid = qgraphicsitem_cast<UBGraphicsPolygonItem *>(mCurrentScene->itemForUuid(QUuid(ref.right(QUuid().toString().length()))));
+
+                    if (strokeByUuid)
+                        strokesGroupsContainer.insert(currentStrokeIdentifier, strokeByUuid);
+                }
+                else // single elements in group
+                    groupContainer.append(mCurrentScene->itemForUuid(QUuid(uuid)));
+            }
+        }
+        currentStrokeElement = currentStrokeElement.nextSiblingElement();
+    }
+
+
+
+    foreach (QString key, strokesGroupsContainer.keys().toSet())
+    {
+        UBGraphicsStrokesGroup* pStrokesGroup = new UBGraphicsStrokesGroup();
+        UBGraphicsStroke *currentStroke = new UBGraphicsStroke();
+        foreach(UBGraphicsPolygonItem* poly, strokesGroupsContainer.values(key))
+        {
+            if (poly)
+            {
+                mCurrentScene->removeItem(poly);
+                mCurrentScene->removeItemFromDeletion(poly);
+                poly->setStrokesGroup(pStrokesGroup);
+                poly->setStroke(currentStroke);
+                pStrokesGroup->addToGroup(poly);
+            }
+        }
+        if (currentStroke->polygons().empty())
+            delete currentStroke;
+
+        if (pStrokesGroup->childItems().count())
+            mCurrentScene->addItem(pStrokesGroup);
+        else
+            delete pStrokesGroup;
+
+        if (pStrokesGroup)
+        {
+            QGraphicsItem *strokeGroup = qgraphicsitem_cast<QGraphicsItem *>(pStrokesGroup);
+            groupContainer.append(strokeGroup);
+        }
+    }
+
+    foreach(QGraphicsItem* item, groupContainer)
+        group->addToGroup(item);
+
+    if (group->childItems().count())
+    {
+        mCurrentScene->addItem(group);
+
+        if (1 == group->childItems().count())
+        {
+            group->destroy(false);
+        }
+    }
+
+    return group;
 }
 
 bool UBCFFSubsetAdaptor::UBCFFSubsetReader::strToBool(QString str)
@@ -1071,8 +1245,8 @@ bool UBCFFSubsetAdaptor::UBCFFSubsetReader::strToBool(QString str)
 bool UBCFFSubsetAdaptor::UBCFFSubsetReader::parseIwbElement(QDomElement &element)
 {
     if (element.namespaceURI() != iwbNS) {
-        qDebug() << "incorrect iwb element namespace, incorrect document";
-        return false;
+        qWarning() << "incorrect iwb element namespace, incorrect document";
+      //  return false;
     }
 
     bool locked = false;
diff --git a/src/adaptors/UBCFFSubsetAdaptor.h b/src/adaptors/UBCFFSubsetAdaptor.h
index acebc151..3a6f89a6 100644
--- a/src/adaptors/UBCFFSubsetAdaptor.h
+++ b/src/adaptors/UBCFFSubsetAdaptor.h
@@ -74,6 +74,7 @@ private:
         QDomDocument mDOMdoc;
         QDomNode mCurrentDOMElement;
         QHash<QString, UBGraphicsItem*> persistedItems;
+        QMap<QString, QString> mRefToUuidMap;
         QDir mTmpFlashDir;
 
         void addItemToGSection(QGraphicsItem *item);
@@ -102,7 +103,7 @@ private:
         inline bool parseSvgFlash(const QDomElement &element);
         inline bool parseSvgAudio(const QDomElement &element);
         inline bool parseSvgVideo(const QDomElement &element);
-        inline bool parseIwbGroup(QDomElement &parent);
+        inline UBGraphicsGroupContainerItem *parseIwbGroup(QDomElement &parent);
         inline bool parseIwbElement(QDomElement &element);
         inline void parseTSpan(const QDomElement &parent, QPainter &painter
                                , qreal &curX, qreal &curY, qreal &width, qreal &height, qreal &linespacing, QRectF &lastDrawnTextBoundingRect
diff --git a/src/adaptors/UBImportPDF.cpp b/src/adaptors/UBImportPDF.cpp
index fd9dc16b..10b81193 100644
--- a/src/adaptors/UBImportPDF.cpp
+++ b/src/adaptors/UBImportPDF.cpp
@@ -70,7 +70,6 @@ QList<UBGraphicsItem*> UBImportPDF::import(const QUuid& uuid, const QString& fil
     for(int pdfPageNumber = 1; pdfPageNumber <= pdfPageCount; pdfPageNumber++)
     {
         UBApplication::showMessage(tr("Importing page %1 of %2").arg(pdfPageNumber).arg(pdfPageCount), true);
-
         result << new UBGraphicsPDFItem(pdfRenderer, pdfPageNumber); // deleted by the scene
     }
     return result;
diff --git a/src/adaptors/UBSvgSubsetAdaptor.cpp b/src/adaptors/UBSvgSubsetAdaptor.cpp
index c306978a..d4c920af 100644
--- a/src/adaptors/UBSvgSubsetAdaptor.cpp
+++ b/src/adaptors/UBSvgSubsetAdaptor.cpp
@@ -48,6 +48,7 @@
 
 #include "frameworks/UBFileSystemUtils.h"
 #include "frameworks/UBStringUtils.h"
+#include "frameworks/UBFileSystemUtils.h"
 
 #include "core/UBSettings.h"
 #include "core/UBSetting.h"
@@ -79,6 +80,7 @@ const QString UBSvgSubsetAdaptor::sFormerUniboardDocumentNamespaceUri = "http://
 
 const QString tElement = "element";
 const QString tGroup = "group";
+const QString tStrokeGroup = "strokeGroup";
 const QString tGroups = "groups";
 const QString aId = "id";
 
@@ -553,6 +555,10 @@ UBGraphicsScene* UBSvgSubsetAdaptor::UBSvgSubsetReader::loadScene()
 
                 if (polygonItem)
                 {
+                    mScene->addItem(polygonItem);
+
+                    polygonItem->setUuid(uuidFromSvg);
+
                     if (annotationGroup)
                     {
                         polygonItem->setStroke(annotationGroup);
@@ -993,31 +999,45 @@ UBGraphicsScene* UBSvgSubsetAdaptor::UBSvgSubsetReader::loadScene()
 
 UBGraphicsGroupContainerItem* UBSvgSubsetAdaptor::UBSvgSubsetReader::readGroup()
 {
-    UBGraphicsGroupContainerItem *result = new UBGraphicsGroupContainerItem();
-
+    UBGraphicsGroupContainerItem *group = new UBGraphicsGroupContainerItem();
+    QMultiMap<QString, UBGraphicsPolygonItem *> strokesGroupsContainer;    
+    QList<QGraphicsItem *> groupContainer;    
+    QString currentStrokeIdentifier;
+    
     QUuid groupUuid = QUuid(mXmlReader.attributes().value(aId).toString());
 
     mXmlReader.readNext();
-    while (!mXmlReader.atEnd()) {
+    while (!mXmlReader.atEnd()) 
+    {
         if (mXmlReader.isEndElement()) {
             mXmlReader.readNext();
-            result->setUuid(groupUuid);
-            if (!result->childItems().count()) {
-                delete result;
-                result = 0;
-            }
             break;
-        } else if (mXmlReader.isStartElement()) {
-            if (mXmlReader.name() == tGroup) {
+        } else if (mXmlReader.isStartElement())
+        {
+            if (mXmlReader.name() == tGroup) 
+            {
                 qDebug() << "came across the group id is" << mXmlReader.attributes().value(aId);
                 UBGraphicsGroupContainerItem *curGroup = readGroup();
-                if (curGroup) {
-                    result->addToGroup(curGroup);
-                }
-            } else  if (mXmlReader.name() == tElement) {
+                if (curGroup) 
+                    groupContainer.append(curGroup);
+            } 
+            else if (mXmlReader.name() == tElement)
+            {
+                QString id = mXmlReader.attributes().value(aId).toString();
+                QString itemId  = id.right(QUuid().toString().size());
+                QString groupId = id.left(QUuid().toString().size());
+
                 QGraphicsItem *curItem = readElementFromGroup();
-                if (curItem) {
-                    result->addToGroup(curItem);
+
+                UBGraphicsPolygonItem *curPolygon = qgraphicsitem_cast<UBGraphicsPolygonItem *>(curItem);
+
+                if (curPolygon && !groupId.isEmpty() && !itemId.isEmpty() && itemId != groupId)
+                {
+                    strokesGroupsContainer.insert(groupId, curPolygon);
+                }
+                else // item
+                {
+                    groupContainer.append(curItem);
                 }
             }else {
                 mXmlReader.skipCurrentElement();
@@ -1027,7 +1047,49 @@ UBGraphicsGroupContainerItem* UBSvgSubsetAdaptor::UBSvgSubsetReader::readGroup()
         }
     }
 
-    return result;
+    foreach (QString key, strokesGroupsContainer.keys().toSet())
+    {
+        UBGraphicsStrokesGroup* pStrokesGroup = new UBGraphicsStrokesGroup();
+        UBGraphicsStroke *currentStroke = new UBGraphicsStroke();
+        foreach(UBGraphicsPolygonItem* poly, strokesGroupsContainer.values(key))
+        {
+            if (poly)
+            {
+                mScene->removeItem(poly);
+                mScene->removeItemFromDeletion(poly);
+                poly->setStrokesGroup(pStrokesGroup);
+                poly->setStroke(currentStroke);
+                pStrokesGroup->addToGroup(poly);
+            }
+        }
+        if (currentStroke->polygons().empty())
+            delete currentStroke;
+
+        if (pStrokesGroup->childItems().count())
+            mScene->addItem(pStrokesGroup);
+        else
+            delete pStrokesGroup;
+
+        if (pStrokesGroup)
+        {
+            QGraphicsItem *strokeGroup = qgraphicsitem_cast<QGraphicsItem *>(pStrokesGroup);
+            groupContainer.append(strokeGroup);
+        }
+    }
+
+    foreach(QGraphicsItem* item, groupContainer)
+        group->addToGroup(item);
+
+    if (group->childItems().count())
+    {
+        mScene->addItem(group);
+
+        if (1 == group->childItems().count())
+        {
+            group->destroy(false);
+        }
+    }
+    return group;
 }
 
 void UBSvgSubsetAdaptor::UBSvgSubsetReader::readGroupRoot()
@@ -1055,8 +1117,9 @@ void UBSvgSubsetAdaptor::UBSvgSubsetReader::readGroupRoot()
 QGraphicsItem *UBSvgSubsetAdaptor::UBSvgSubsetReader::readElementFromGroup()
 {
     QGraphicsItem *result = 0;
-
-    result = mScene->itemForUuid(QUuid(mXmlReader.attributes().value(aId).toString()));
+    QString id = mXmlReader.attributes().value(aId).toString();
+    QString uuid = id.right(QUuid().toString().size());
+    result = mScene->itemForUuid(QUuid(uuid));
 
     mXmlReader.skipCurrentElement();
     mXmlReader.readNext();
@@ -1156,25 +1219,42 @@ bool UBSvgSubsetAdaptor::UBSvgSubsetWriter::persistScene(int pageIndex)
             QGraphicsItem *item = items.takeFirst();
 
             // Is the item a strokes group?
+
             UBGraphicsStrokesGroup* strokesGroupItem = qgraphicsitem_cast<UBGraphicsStrokesGroup*>(item);
+
             if(strokesGroupItem && strokesGroupItem->isVisible()){
-            	mXmlWriter.writeStartElement("g");
-                mXmlWriter.writeAttribute(UBSettings::uniboardDocumentNamespaceUri, "uuid", UBStringUtils::toCanonicalUuid(strokesGroupItem->uuid()));
-            	QMatrix matrix = item->sceneMatrix();
-				if (!matrix.isIdentity()){
-					mXmlWriter.writeAttribute("transform", toSvgTransform(matrix));
-				}
-
-				// Add the polygons
-				foreach(QGraphicsItem* item, strokesGroupItem->childItems()){
-					UBGraphicsPolygonItem* poly = qgraphicsitem_cast<UBGraphicsPolygonItem*>(item);
-					if(NULL != poly){
-						polygonItemToSvgPolygon(poly, true);
-						items.removeOne(poly);
-					}
-				}
-
-            	mXmlWriter.writeEndElement(); //g
+                QDomElement newGroupElement;
+                if (!strokesGroupItem->parentItem() && strokesGroupItem->childItems().count()) {
+                    newGroupElement = groupDomDocument.createElement(tGroup);
+                    newGroupElement.setAttribute(aId, strokesGroupItem->uuid().toString());
+                    groupRoot.appendChild(newGroupElement);
+                }
+
+                //disabling g section parsing as a group of elements. Use groups refs instead
+//                mXmlWriter.writeStartElement("g");
+//                mXmlWriter.writeAttribute(UBSettings::uniboardDocumentNamespaceUri, "uuid", UBStringUtils::toCanonicalUuid(strokesGroupItem->uuid()));
+//            	QMatrix matrix = item->sceneMatrix();
+//				if (!matrix.isIdentity()){
+//					mXmlWriter.writeAttribute("transform", toSvgTransform(matrix));
+//				}
+
+                // Add the polygons
+                foreach(QGraphicsItem* item, strokesGroupItem->childItems()){
+
+                    UBGraphicsPolygonItem* poly = qgraphicsitem_cast<UBGraphicsPolygonItem*>(item);
+                    if(NULL != poly){
+                        polygonItemToSvgPolygon(poly, true);
+                        if (!newGroupElement.isNull()) {
+                            QDomElement curPolygonElement = groupDomDocument.createElement(tElement);
+                            curPolygonElement.setAttribute(aId, strokesGroupItem->uuid().toString()
+                                                              + poly->uuid().toString());
+                            newGroupElement.appendChild(curPolygonElement);
+                        }
+                        items.removeOne(poly);
+                    }
+                }
+
+//                mXmlWriter.writeEndElement(); //g
             }
 
             // Is the item a polygon?
@@ -1405,12 +1485,12 @@ bool UBSvgSubsetAdaptor::UBSvgSubsetWriter::persistScene(int pageIndex)
             QDomElement curElement = groupRoot.firstChildElement();
             while (!curElement.isNull()) {
                 if (curElement.hasAttribute(aId)) {
-                    mXmlWriter.writeStartElement(tGroup);
+                    mXmlWriter.writeStartElement(curElement.tagName());
                     mXmlWriter.writeAttribute(aId, curElement.attribute(aId));
                     QDomElement curSubElement = curElement.firstChildElement();
                     while (!curSubElement.isNull()) {
                         if (curSubElement.hasAttribute(aId)) {
-                            mXmlWriter.writeStartElement(tElement);
+                            mXmlWriter.writeStartElement(curSubElement.tagName());
                             mXmlWriter.writeAttribute(aId, curSubElement.attribute(aId));
                             mXmlWriter.writeEndElement();
                             curSubElement = curSubElement.nextSiblingElement();
@@ -1458,8 +1538,16 @@ void UBSvgSubsetAdaptor::UBSvgSubsetWriter::persistGroupToDom(QGraphicsItem *gro
             if (!tmpUuid.isNull()) {
                 if (item->type() == UBGraphicsGroupContainerItem::Type && item->childItems().count()) {
                     persistGroupToDom(item, curParent, groupDomDocument);
+                } else if (item->type() == UBGraphicsStrokesGroup::Type) {
+                    foreach (QGraphicsItem *polygonItem, item->childItems()) {
+                        QDomElement curPolygonElement = groupDomDocument->createElement(tElement);
+                        curPolygonElement.setAttribute(aId, tmpUuid.toString()
+                                                          + UBGraphicsItem::getOwnUuid(polygonItem).toString());
+                        curGroupElement.appendChild(curPolygonElement);
+                    }
                 } else {
-                    QDomElement curSubElement = groupDomDocument->createElement(tGroup);
+                    QDomElement curSubElement = groupDomDocument->createElement(tElement);
+
                     curSubElement.setAttribute(aId, tmpUuid);
                     curGroupElement.appendChild(curSubElement);
                 }
@@ -1468,6 +1556,27 @@ void UBSvgSubsetAdaptor::UBSvgSubsetWriter::persistGroupToDom(QGraphicsItem *gro
     }
 }
 
+void UBSvgSubsetAdaptor::UBSvgSubsetWriter::persistStrokeToDom(QGraphicsItem *strokeItem, QDomElement *curParent, QDomDocument *curDomDocument)
+{
+    QUuid uuid = UBGraphicsScene::getPersonalUuid(strokeItem);
+    if (!uuid.isNull()) {
+        QDomElement curStrokesGroupElement = curDomDocument->createElement(tStrokeGroup);
+        curStrokesGroupElement.setAttribute(aId, uuid);
+        curParent->appendChild(curStrokesGroupElement);
+
+        foreach (QGraphicsItem *item, strokeItem->childItems()) {
+            QUuid tmpUuid = UBGraphicsScene::getPersonalUuid(item);
+            if (!tmpUuid.isNull()) {
+                if (item->type() == UBGraphicsPolygonItem::Type && item->childItems().count()) {
+                    QDomElement curSubElement = curDomDocument->createElement(tElement);
+                    curSubElement.setAttribute(aId, tmpUuid);
+                    curStrokesGroupElement.appendChild(curSubElement);
+                }
+            }
+        }
+    }
+}
+
 void UBSvgSubsetAdaptor::UBSvgSubsetWriter::polygonItemToSvgLine(UBGraphicsPolygonItem* polygonItem, bool groupHoldsInfo)
 {
     mXmlWriter.writeStartElement("line");
@@ -1619,6 +1728,11 @@ void UBSvgSubsetAdaptor::UBSvgSubsetWriter::polygonItemToSvgPolygon(UBGraphicsPo
                                       , "fill-on-light-background", polygonItem->colorOnLightBackground().name());
         }
 
+        mXmlWriter.writeAttribute(UBSettings::uniboardDocumentNamespaceUri, "uuid", UBStringUtils::toCanonicalUuid(polygonItem->uuid()));
+        if (polygonItem->parentItem()) {
+            mXmlWriter.writeAttribute(UBSettings::uniboardDocumentNamespaceUri, "parent", UBStringUtils::toCanonicalUuid(UBGraphicsItem::getOwnUuid(polygonItem->parentItem())));
+        }
+
         mXmlWriter.writeEndElement();
     }
 }
diff --git a/src/adaptors/UBSvgSubsetAdaptor.h b/src/adaptors/UBSvgSubsetAdaptor.h
index d02765c3..39a3ccd0 100644
--- a/src/adaptors/UBSvgSubsetAdaptor.h
+++ b/src/adaptors/UBSvgSubsetAdaptor.h
@@ -179,6 +179,7 @@ class UBSvgSubsetAdaptor
             private:
 
                 void persistGroupToDom(QGraphicsItem *groupItem, QDomElement *curParent, QDomDocument *curDomDocument);
+                void persistStrokeToDom(QGraphicsItem *strokeItem, QDomElement *curParent, QDomDocument *curDomDocument);
                 void polygonItemToSvgPolygon(UBGraphicsPolygonItem* polygonItem, bool groupHoldsInfo);
                 void polygonItemToSvgLine(UBGraphicsPolygonItem* polygonItem, bool groupHoldsInfo);
                 void strokeToSvgPolyline(UBGraphicsStroke* stroke, bool groupHoldsInfo);
diff --git a/src/board/UBBoardController.cpp b/src/board/UBBoardController.cpp
index b269b8fa..94d317d4 100644
--- a/src/board/UBBoardController.cpp
+++ b/src/board/UBBoardController.cpp
@@ -537,7 +537,7 @@ void UBBoardController::duplicateScene()
     duplicateScene(mActiveSceneIndex);
 }
 
-UBGraphicsItem *UBBoardController::duplicateItem(UBItem *item)
+UBGraphicsItem *UBBoardController::duplicateItem(UBItem *item, bool bAsync)
 {    
     if (!item)
         return NULL;
@@ -568,7 +568,10 @@ UBGraphicsItem *UBBoardController::duplicateItem(UBItem *item)
     if (srcFile.isEmpty())
         srcFile = item->sourceUrl().toString();
 
-    QString contentTypeHeader = UBFileSystemUtils::mimeTypeFromFileName(srcFile);
+    QString contentTypeHeader;
+    if (!srcFile.isEmpty())
+        contentTypeHeader = UBFileSystemUtils::mimeTypeFromFileName(srcFile);
+
     if(NULL != qgraphicsitem_cast<UBGraphicsGroupContainerItem*>(commonItem))
         itemMimeType = UBMimeType::Group;
     else 
@@ -593,9 +596,13 @@ UBGraphicsItem *UBBoardController::duplicateItem(UBItem *item)
             if (mitem)
             {
                 sourceUrl = mitem->mediaFileUrl();
-                downloadURL(sourceUrl, srcFile, itemPos, QSize(itemSize.width(), itemSize.height()), false, false);    
+                if (bAsync)
+                {
+                    downloadURL(sourceUrl, srcFile, itemPos, QSize(itemSize.width(), itemSize.height()), false, false);    
+                    return NULL; // async operation
+                }
             }
-        }return NULL; // async operation
+        }break;
 
     case UBMimeType::VectorImage:
         {
@@ -621,35 +628,32 @@ UBGraphicsItem *UBBoardController::duplicateItem(UBItem *item)
 
     case UBMimeType::Group:
     {
-    	UBGraphicsGroupContainerItem* groupItem = dynamic_cast<UBGraphicsGroupContainerItem*>(item);
+        UBGraphicsGroupContainerItem* groupItem = dynamic_cast<UBGraphicsGroupContainerItem*>(item);
         UBGraphicsGroupContainerItem* duplicatedGroup = NULL;
-    	if(groupItem){
-    		QTransform groupTransform = groupItem->transform();
-    		groupItem->resetTransform();
-
-    		QList<QGraphicsItem*> children = groupItem->childItems();
-    		foreach(QGraphicsItem* pIt, children){
-    			UBItem* pItem = dynamic_cast<UBItem*>(pIt);
-    			if(NULL != pItem){
-    				duplicateItem(pItem);
-    			}
-    		}
-    		groupItem->setTransform(groupTransform);
-    		groupItem->setSelected(false);
-    		UBApplication::mainWindow->actionGroupItems->trigger();
-    		QList<QGraphicsItem*> selItems =  mActiveScene->selectedItems();
-    		if(!selItems.empty()){
-    			// I don't like this solution but for now this is the only way I found.
-    			// Normally, at this state, only the duplicated group should be selected
-    			duplicatedGroup = dynamic_cast<UBGraphicsGroupContainerItem*>(selItems.at(0));
-    			if(NULL != duplicatedGroup){
-    				duplicatedGroup->setTransform(groupTransform);
-    			}
-    		}
-    	}
-    	retItem = dynamic_cast<UBGraphicsItem *>(duplicatedGroup);
-    	break;
-    }
+        
+        QList<QGraphicsItem*> duplicatedItems;
+        QList<QGraphicsItem*> children = groupItem->childItems();
+        foreach(QGraphicsItem* pIt, children){
+            UBItem* pItem = dynamic_cast<UBItem*>(pIt);
+            if(pItem){ // we diong sync duplication of all childs.
+                QGraphicsItem * itemToGroup = dynamic_cast<QGraphicsItem *>(duplicateItem(pItem, false));
+                if (itemToGroup)
+                    duplicatedItems.append(itemToGroup);
+            }
+        }
+        duplicatedGroup = mActiveScene->createGroup(duplicatedItems);
+        duplicatedGroup->setTransform(groupItem->transform());
+        groupItem->setSelected(false);
+
+        retItem = dynamic_cast<UBGraphicsItem *>(duplicatedGroup);
+
+        QGraphicsItem * itemToAdd = dynamic_cast<QGraphicsItem *>(retItem);
+        if (itemToAdd)
+        {
+            mActiveScene->addItem(itemToAdd);
+            itemToAdd->setSelected(true);
+        }
+    }break;
 
     case UBMimeType::UNKNOWN:
         {
@@ -668,7 +672,7 @@ UBGraphicsItem *UBBoardController::duplicateItem(UBItem *item)
     if (retItem)
         return retItem;
 
-    UBItem *createdItem = downloadFinished(true, sourceUrl, sourceUrl, contentTypeHeader, pData, itemPos, QSize(itemSize.width(), itemSize.height()), false);
+    UBItem *createdItem = downloadFinished(true, sourceUrl, srcFile, contentTypeHeader, pData, itemPos, QSize(itemSize.width(), itemSize.height()), false);
     if (createdItem)
     {
         createdItem->setSourceUrl(item->sourceUrl());
@@ -983,8 +987,8 @@ void UBBoardController::downloadURL(const QUrl& url, QString contentSourceUrl, c
     }
     else if (sUrl.startsWith("file://") || sUrl.startsWith("/"))
     {
-        QString fileName = url.toLocalFile();
-        QUrl formedUrl = sUrl.startsWith("file://") ? sUrl : QUrl::fromLocalFile(sUrl);
+        QUrl formedUrl = sUrl.startsWith("file://") ? url : QUrl::fromLocalFile(sUrl);
+        QString fileName = formedUrl.toLocalFile();
         QString contentType = UBFileSystemUtils::mimeTypeFromFileName(fileName);
 
         bool shouldLoadFileData =
diff --git a/src/board/UBBoardController.h b/src/board/UBBoardController.h
index d7f44e37..aa27b788 100644
--- a/src/board/UBBoardController.h
+++ b/src/board/UBBoardController.h
@@ -159,7 +159,7 @@ class UBBoardController : public UBDocumentContainer
 
         void moveSceneToIndex(int source, int target);
         void duplicateScene(int index);
-        UBGraphicsItem *duplicateItem(UBItem *item);
+        UBGraphicsItem *duplicateItem(UBItem *item, bool bAsync = true);
         void deleteScene(int index);
 
         bool cacheIsVisible() {return mCacheWidgetIsEnabled;}
diff --git a/src/board/UBFeaturesController.cpp b/src/board/UBFeaturesController.cpp
index 049ee301..b39017ce 100644
--- a/src/board/UBFeaturesController.cpp
+++ b/src/board/UBFeaturesController.cpp
@@ -260,6 +260,7 @@ bool UBFeature::isDeletable() const
             || elementType == FEATURE_AUDIO
             || elementType == FEATURE_VIDEO
             || elementType == FEATURE_IMAGE
+            || elementType == FEATURE_FLASH
             || elementType == FEATURE_FOLDER;
 }
 
@@ -750,7 +751,7 @@ void UBFeaturesController::addDownloadedFile(const QUrl &sourceUrl, const QByteA
         file.write(pData);
         file.close();
 
-        UBFeature downloadedFeature = UBFeature(dest.getFullVirtualPath() + "/" + fileName, getIcon( filePath ),
+        UBFeature downloadedFeature = UBFeature(dest.getFullVirtualPath() + "/" + fileName, getIcon( filePath, fileTypeFromUrl(filePath)),
                                                  fileName, QUrl::fromLocalFile(filePath), FEATURE_ITEM);
         if (downloadedFeature != UBFeature()) {
             featuresModel->addItem(downloadedFeature);
diff --git a/src/board/UBFeaturesController.h b/src/board/UBFeaturesController.h
index b48f3d62..6c05e90b 100644
--- a/src/board/UBFeaturesController.h
+++ b/src/board/UBFeaturesController.h
@@ -73,14 +73,14 @@ enum UBFeatureElementType
     FEATURE_VIRTUALFOLDER,
     FEATURE_FOLDER,
     FEATURE_INTERACTIVE,
-	FEATURE_INTERNAL,
+    FEATURE_INTERNAL,
     FEATURE_ITEM,
     FEATURE_AUDIO,
     FEATURE_VIDEO,
     FEATURE_IMAGE,
     FEATURE_FLASH,
-	FEATURE_TRASH,
-	FEATURE_FAVORITE,
+    FEATURE_TRASH,
+    FEATURE_FAVORITE,
     FEATURE_SEARCH,
     FEATURE_INVALID
 };
diff --git a/src/core/UBApplication.cpp b/src/core/UBApplication.cpp
index a2043121..580ef897 100644
--- a/src/core/UBApplication.cpp
+++ b/src/core/UBApplication.cpp
@@ -216,14 +216,17 @@ QString UBApplication::checkLanguageAvailabilityForSankore(QString &language)
 
 void UBApplication::setupTranslators(QStringList args)
 {
-    QString forcedLanguage;
+    QString forcedLanguage("");
     if(args.contains("-lang"))
         forcedLanguage=args.at(args.indexOf("-lang") + 1);
-    else{
-        QString setLanguage = UBSettings::settings()->appPreferredLanguage->get().toString();
-        if(!setLanguage.isEmpty())
-            forcedLanguage = setLanguage;
-    }
+// TODO claudio: this has been commented because some of the translation seem to be loaded at this time
+//               especially tools name. This is a workaround and we have to be able to load settings without
+//               impacting the translations
+//    else{
+//        QString setLanguage = UBSettings::settings()->appPreferredLanguage->get().toString();
+//        if(!setLanguage.isEmpty())
+//            forcedLanguage = setLanguage;
+//    }
 
     QString language("");
 
@@ -242,7 +245,6 @@ void UBApplication::setupTranslators(QStringList args)
     else{
         mApplicationTranslator = new QTranslator(this);
         mQtGuiTranslator = new QTranslator(this);
-
         mApplicationTranslator->load(UBPlatformUtils::translationPath(QString("sankore_"),language));
         installTranslator(mApplicationTranslator);
 
@@ -256,7 +258,6 @@ void UBApplication::setupTranslators(QStringList args)
         }
 
         if(!qtGuiTranslationPath.isEmpty()){
-            qDebug() << "qtGuiTranslationPath " << qtGuiTranslationPath;
             mQtGuiTranslator->load(qtGuiTranslationPath);
             installTranslator(mQtGuiTranslator);
         }
diff --git a/src/core/UBDocumentManager.cpp b/src/core/UBDocumentManager.cpp
index 0eaf15b2..368c09c1 100644
--- a/src/core/UBDocumentManager.cpp
+++ b/src/core/UBDocumentManager.cpp
@@ -170,6 +170,10 @@ UBDocumentProxy* UBDocumentManager::importFile(const QFile& pFile, const QString
                 foreach(UBGraphicsItem* page, pages)
                 {
                     UBApplication::showMessage(tr("Inserting page %1 of %2").arg(++nPage).arg(pages.size()), true);
+#ifdef Q_WS_MACX
+                    //Workaround for issue 912
+                    QApplication::processEvents();
+#endif
                     int pageIndex = document->pageCount();
                     UBGraphicsScene* scene = UBPersistenceManager::persistenceManager()->createDocumentSceneAt(document, pageIndex);
                     importAdaptor->placeImportedItemToScene(scene, page);
diff --git a/src/domain/UBGraphicsDelegateFrame.cpp b/src/domain/UBGraphicsDelegateFrame.cpp
index cc0505cd..71351090 100644
--- a/src/domain/UBGraphicsDelegateFrame.cpp
+++ b/src/domain/UBGraphicsDelegateFrame.cpp
@@ -49,6 +49,8 @@ UBGraphicsDelegateFrame::UBGraphicsDelegateFrame(UBGraphicsItemDelegate* pDelega
     , mTotalTranslateX(0)
     , mTotalTranslateY(0)
     , mOperationMode(Scaling)
+    , mFlippedX(false)
+    , mFlippedY(false)
     , mMirrorX(false)
     , mMirrorY(false)
 {
@@ -74,11 +76,9 @@ UBGraphicsDelegateFrame::UBGraphicsDelegateFrame(UBGraphicsItemDelegate* pDelega
     mBottomResizeGrip = new QGraphicsRectItem(this);
     mBottomResizeGrip->setPen(Qt::NoPen);
     mLeftResizeGrip = new QGraphicsRectItem(this);
-    mLeftResizeGrip->setToolTip("left");
     mLeftResizeGrip->setPen(Qt::NoPen);
     mRightResizeGrip = new QGraphicsRectItem(this);
     mRightResizeGrip->setPen(Qt::NoPen);
-    mRightResizeGrip->setToolTip("Right");
     mTopResizeGrip = new QGraphicsRectItem(this);
     mTopResizeGrip->setPen(Qt::NoPen);
 
@@ -381,6 +381,12 @@ QSizeF UBGraphicsDelegateFrame::resizeDelegate(qreal moveX, qreal moveY)
     return incVector;
 }
 
+
+void UBGraphicsDelegateFrame::scaleByPos(qreal scaleX, qreal scaleY)
+{
+
+}
+
 void UBGraphicsDelegateFrame::mouseMoveEvent(QGraphicsSceneMouseEvent *event)
 {
     if (None == mCurrentTool)
@@ -453,6 +459,7 @@ void UBGraphicsDelegateFrame::mouseMoveEvent(QGraphicsSceneMouseEvent *event)
                                     scaleX = -2*mFrameWidth/width;
                             }else{
                                 scaleX = -1;
+                                mFlippedX = !mFlippedX;
                             }
                         }
                         mScaleX = scaleX;
@@ -482,6 +489,7 @@ void UBGraphicsDelegateFrame::mouseMoveEvent(QGraphicsSceneMouseEvent *event)
                                     scaleY = -2*mFrameWidth/width;
                             }else{
                                 scaleY = -1;
+                                mFlippedY = !mFlippedY;
                             }
                         }
                         mScaleY = scaleY;
@@ -545,15 +553,38 @@ void UBGraphicsDelegateFrame::mouseMoveEvent(QGraphicsSceneMouseEvent *event)
             QPointF ref;
 
             // we just detects coordinates of corner before and after scaling and then moves object at diff between them.
-            if (resizingBottomRight() && mMirrorX)
+            if (resizingBottomRight() && (mMirrorX || mMirrorY))
             {
-                mTranslateX += mInitialTransform.map(delegated()->boundingRect().bottomRight()).x() - tr.map(delegated()->boundingRect().bottomRight()).x();
-                mTranslateY += mInitialTransform.map(delegated()->boundingRect().bottomRight()).y() - tr.map(delegated()->boundingRect().bottomRight()).y();
+                if (mFlippedX && !mMirrorX && mFlippedY)// && !mMirrorY)
+                {
+                    mTranslateX += mInitialTransform.map(delegated()->boundingRect().bottomLeft()).x() - tr.map(delegated()->boundingRect().bottomLeft()).x();
+                    mTranslateY += mInitialTransform.map(delegated()->boundingRect().bottomLeft()).y() - tr.map(delegated()->boundingRect().bottomLeft()).y();
+                }
+                else if ((mFlippedX || mMirrorX) && (mFlippedY || mMirrorY))
+                {
+                    mTranslateX += mInitialTransform.map(delegated()->boundingRect().bottomRight()).x() - tr.map(delegated()->boundingRect().bottomRight()).x();
+                    mTranslateY += mInitialTransform.map(delegated()->boundingRect().bottomRight()).y() - tr.map(delegated()->boundingRect().bottomRight()).y();
+                }
+                else if (mFlippedX || mMirrorX)
+                {
+                    mTranslateX += mInitialTransform.map(delegated()->boundingRect().topRight()).x() - tr.map(delegated()->boundingRect().topRight()).x();
+                    mTranslateY += mInitialTransform.map(delegated()->boundingRect().topRight()).y() - tr.map(delegated()->boundingRect().topRight()).y();
+                }
+                else if (mFlippedY || mMirrorY)
+                {
+                    mTranslateX += mInitialTransform.map(delegated()->boundingRect().bottomLeft()).x() - tr.map(delegated()->boundingRect().bottomLeft()).x();
+                    mTranslateY += mInitialTransform.map(delegated()->boundingRect().bottomLeft()).y() - tr.map(delegated()->boundingRect().bottomLeft()).y();
+                }
+                else
+                {
+                    mTranslateX += mInitialTransform.map(delegated()->boundingRect().bottomRight()).x() - tr.map(delegated()->boundingRect().bottomRight()).x();
+                    mTranslateY += mInitialTransform.map(delegated()->boundingRect().bottomRight()).y() - tr.map(delegated()->boundingRect().bottomRight()).y();
+                }
             }
             else
             {
-                mTranslateX += mInitialTransform.map(delegated()->boundingRect().topLeft()).x() - tr.map(delegated()->boundingRect().topLeft()).x();
-                mTranslateY += mInitialTransform.map(delegated()->boundingRect().topLeft()).y() - tr.map(delegated()->boundingRect().topLeft()).y();         
+                    mTranslateX += mInitialTransform.map(delegated()->boundingRect().topLeft()).x() - tr.map(delegated()->boundingRect().topLeft()).x();
+                    mTranslateY += mInitialTransform.map(delegated()->boundingRect().topLeft()).y() - tr.map(delegated()->boundingRect().topLeft()).y();
             }
         }
         else if (resizingTop() || resizingLeft())
diff --git a/src/domain/UBGraphicsDelegateFrame.h b/src/domain/UBGraphicsDelegateFrame.h
index d3034711..e171358b 100644
--- a/src/domain/UBGraphicsDelegateFrame.h
+++ b/src/domain/UBGraphicsDelegateFrame.h
@@ -40,6 +40,7 @@ class UBGraphicsDelegateFrame: public QGraphicsRectItem, public QObject
         QPointF getFixedPointFromPos();
         QSizeF getResizeVector(qreal moveX, qreal moveY);
         QSizeF resizeDelegate(qreal moveX, qreal moveY);
+        void scaleByPos(qreal scaleX, qreal scaleY);
         virtual void mouseMoveEvent(QGraphicsSceneMouseEvent *event);
         virtual void mouseReleaseEvent(QGraphicsSceneMouseEvent *event);
 
@@ -124,6 +125,8 @@ class UBGraphicsDelegateFrame: public QGraphicsRectItem, public QObject
         OperationMode mOperationMode;
 
         QGraphicsItem* delegated();
+        bool mFlippedX;
+        bool mFlippedY;
         bool mMirrorX;
         bool mMirrorY;
         bool mResizing;
diff --git a/src/domain/UBGraphicsPolygonItem.cpp b/src/domain/UBGraphicsPolygonItem.cpp
index d6448e06..55c55dda 100644
--- a/src/domain/UBGraphicsPolygonItem.cpp
+++ b/src/domain/UBGraphicsPolygonItem.cpp
@@ -60,6 +60,13 @@ UBGraphicsPolygonItem::UBGraphicsPolygonItem (const QLineF& pLine, qreal pWidth)
 void UBGraphicsPolygonItem::initialize()
 {
     setData(UBGraphicsItemData::itemLayerType, QVariant(itemLayerType::DrawingItem)); //Necessary to set if we want z value to be assigned correctly
+    setUuid(QUuid::createUuid());
+}
+
+void UBGraphicsPolygonItem::setUuid(const QUuid &pUuid)
+{
+    UBItem::setUuid(pUuid);
+    setData(UBGraphicsItemData::ItemUuid, QVariant(pUuid)); //store item uuid inside the QGraphicsItem to fast operations with Items on the scene
 }
 
 void UBGraphicsPolygonItem::clearStroke()
diff --git a/src/domain/UBGraphicsPolygonItem.h b/src/domain/UBGraphicsPolygonItem.h
index 7b961e52..511e5da7 100644
--- a/src/domain/UBGraphicsPolygonItem.h
+++ b/src/domain/UBGraphicsPolygonItem.h
@@ -39,6 +39,8 @@ class UBGraphicsPolygonItem : public QGraphicsPolygonItem, public UBItem
 
         void initialize();
 
+        void setUuid(const QUuid &pUuid);
+
         void setStrokesGroup(UBGraphicsStrokesGroup* group);
         UBGraphicsStrokesGroup* strokesGroup() const{return mpGroup;}
         void setColor(const QColor& color);
diff --git a/src/domain/UBGraphicsScene.cpp b/src/domain/UBGraphicsScene.cpp
index 621dc9a4..99bfe301 100644
--- a/src/domain/UBGraphicsScene.cpp
+++ b/src/domain/UBGraphicsScene.cpp
@@ -1713,6 +1713,7 @@ QRectF UBGraphicsScene::normalizedSceneRect(qreal ratio)
 QGraphicsItem *UBGraphicsScene::itemForUuid(QUuid uuid)
 {
     QGraphicsItem *result = 0;
+    QString ui = uuid.toString();
 
     //simple search before implementing container for fast access
     foreach (QGraphicsItem *item, items()) {
diff --git a/src/domain/UBGraphicsScene.h b/src/domain/UBGraphicsScene.h
index 6d496369..1b0a54db 100644
--- a/src/domain/UBGraphicsScene.h
+++ b/src/domain/UBGraphicsScene.h
@@ -302,6 +302,8 @@ class UBGraphicsScene: public UBCoreGraphicsScene, public UBItem
 
         static QUuid getPersonalUuid(QGraphicsItem *item);
 
+        UBGraphicsPolygonItem* polygonToPolygonItem(const QPolygonF pPolygon);
+
 public slots:
 		void initStroke();
         void hideEraser();
@@ -338,7 +340,6 @@ public slots:
 
         UBGraphicsPolygonItem* lineToPolygonItem(const QLineF& pLine, const qreal& pWidth);
         UBGraphicsPolygonItem* arcToPolygonItem(const QLineF& pStartRadius, qreal pSpanAngle, qreal pWidth);
-        UBGraphicsPolygonItem* polygonToPolygonItem(const QPolygonF pPolygon);
 
         void initPolygonItem(UBGraphicsPolygonItem*);
 
diff --git a/src/domain/UBGraphicsStrokesGroup.cpp b/src/domain/UBGraphicsStrokesGroup.cpp
index 793459a8..e19ea4ab 100644
--- a/src/domain/UBGraphicsStrokesGroup.cpp
+++ b/src/domain/UBGraphicsStrokesGroup.cpp
@@ -124,8 +124,13 @@ UBItem* UBGraphicsStrokesGroup::deepCopy() const
 		UBGraphicsPolygonItem *polygon = dynamic_cast<UBGraphicsPolygonItem*>(child);
 
 		if (polygon){
-			QGraphicsItem* pItem = dynamic_cast<QGraphicsItem*>(polygon->deepCopy());
-			copy->addToGroup(pItem);
+            UBGraphicsPolygonItem *polygonCopy = dynamic_cast<UBGraphicsPolygonItem*>(polygon->deepCopy());
+            if (polygonCopy)
+            {
+                QGraphicsItem* pItem = dynamic_cast<QGraphicsItem*>(polygonCopy);
+                copy->addToGroup(pItem);
+                polygonCopy->setStrokesGroup(copy);
+            }
 		}
 
 	}
diff --git a/src/domain/UBGraphicsWidgetItem.cpp b/src/domain/UBGraphicsWidgetItem.cpp
index 53ecc53a..7d43c949 100644
--- a/src/domain/UBGraphicsWidgetItem.cpp
+++ b/src/domain/UBGraphicsWidgetItem.cpp
@@ -49,7 +49,7 @@ UBGraphicsWidgetItem::UBGraphicsWidgetItem(const QUrl &pWidgetUrl, QGraphicsItem
     , mInitialLoadDone(false)
     , mIsFreezable(true)
     , mIsResizable(false)    
-    , mLoadIsErronous(false)    
+    , mLoadIsErronous(false)
     , mCanBeContent(0)
     , mCanBeTool(0)
     , mWidgetUrl(pWidgetUrl)
@@ -113,6 +113,7 @@ void UBGraphicsWidgetItem::initialize()
     connect(page()->mainFrame(), SIGNAL(javaScriptWindowObjectCleared()), this, SLOT(javaScriptWindowObjectCleared()));
     connect(page(), SIGNAL(geometryChangeRequested(const QRect&)), this, SLOT(geometryChangeRequested(const QRect&)));
     connect(this, SIGNAL(loadFinished(bool)), this, SLOT(mainFrameLoadFinished (bool)));
+    connect(page()->mainFrame(), SIGNAL(initialLayoutCompleted()), this, SLOT(initialLayoutCompleted()));
     connect(page(), SIGNAL(linkClicked(const QUrl&)), this, SLOT(onLinkClicked(const QUrl&)));
 }
 
@@ -121,6 +122,11 @@ void UBGraphicsWidgetItem::onLinkClicked(const QUrl& url)
 	UBApplication::webController->loadUrl(url);
 }
 
+void UBGraphicsWidgetItem::initialLayoutCompleted()
+{
+    mInitialLoadDone = true;
+}
+
 QUrl UBGraphicsWidgetItem::mainHtml()
 {
     return mMainHtmlUrl;
@@ -564,40 +570,33 @@ void UBGraphicsWidgetItem::injectInlineJavaScript()
 void UBGraphicsWidgetItem::paint( QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget)
 {
 
-    if (scene() && scene()->renderingContext() != UBGraphicsScene::Screen)
-    {
+    if (scene() && scene()->renderingContext() != UBGraphicsScene::Screen) {
         painter->drawPixmap(0, 0, snapshot());
     }
-    else
-    {
-        if (!mInitialLoadDone || mLoadIsErronous) 
-        {
-            QString message;
+    else {
+        QGraphicsWebView::paint(painter, option, widget);
+    }
 
-            if (mInitialLoadDone && mLoadIsErronous)
-                message = tr("Cannot load content");
-            else
-                message = tr("Loading ...");
+    if (!mInitialLoadDone) {
+        QString message;
 
-            painter->setFont(QFont("Arial", 12));
+        message = tr("Loading ...");
 
-            QFontMetrics fm = painter->fontMetrics();
-            QRect txtBoundingRect = fm.boundingRect(message);
+        painter->setFont(QFont("Arial", 12));
 
-            txtBoundingRect.moveCenter(rect().center().toPoint());
-            txtBoundingRect.adjust(-10, -5, 10, 5);
+        QFontMetrics fm = painter->fontMetrics();
+        QRect txtBoundingRect = fm.boundingRect(message);
 
-            painter->setPen(Qt::NoPen);
-            painter->setBrush(UBSettings::paletteColor);
-            painter->drawRoundedRect(txtBoundingRect, 3, 3);
+        txtBoundingRect.moveCenter(rect().center().toPoint());
+        txtBoundingRect.adjust(-10, -5, 10, 5);
 
-            painter->setPen(Qt::white);
-            painter->drawText(rect(), Qt::AlignCenter, message);
-        }
-        else
-            QGraphicsWebView::paint(painter, option, widget);
-    }
+        painter->setPen(Qt::NoPen);
+        painter->setBrush(UBSettings::paletteColor);
+        painter->drawRoundedRect(txtBoundingRect, 3, 3);
 
+        painter->setPen(Qt::white);
+        painter->drawText(rect(), Qt::AlignCenter, message);
+    }
 }
 
 void UBGraphicsWidgetItem::geometryChangeRequested(const QRect& geom)
@@ -618,9 +617,9 @@ void UBGraphicsWidgetItem::javaScriptWindowObjectCleared()
 
 void UBGraphicsWidgetItem::mainFrameLoadFinished (bool ok)
 {
-    mInitialLoadDone = true;
     mLoadIsErronous = !ok;
     update(boundingRect());
+    takeSnapshot();
 }
 
 void UBGraphicsWidgetItem::wheelEvent(QGraphicsSceneWheelEvent *event)
diff --git a/src/domain/UBGraphicsWidgetItem.h b/src/domain/UBGraphicsWidgetItem.h
index 10aeb2b7..412dbad8 100644
--- a/src/domain/UBGraphicsWidgetItem.h
+++ b/src/domain/UBGraphicsWidgetItem.h
@@ -21,8 +21,8 @@
 
 #include "core/UB.h"
 
-#include "UBItem.h"
-#include "UBResizableGraphicsItem.h"
+#include "UBItem.h"
+#include "UBResizableGraphicsItem.h"
 
 class UBWidgetUniboardAPI;
 class UBGraphicsScene;
@@ -163,6 +163,7 @@ class UBGraphicsWidgetItem : public QGraphicsWebView, public UBItem, public UBRe
 
     private slots:
     	void onLinkClicked(const QUrl& url);
+        void initialLayoutCompleted();
 
     private:
         bool mIsFrozen;
diff --git a/src/frameworks/UBFileSystemUtils.cpp b/src/frameworks/UBFileSystemUtils.cpp
index 2bde7364..fa0b0a57 100644
--- a/src/frameworks/UBFileSystemUtils.cpp
+++ b/src/frameworks/UBFileSystemUtils.cpp
@@ -359,7 +359,7 @@ QString UBFileSystemUtils::thumbnailPath(const QString& path)
 
 QString UBFileSystemUtils::extension(const QString& fileName)
 {
-    QString extension;
+    QString extension("");
 
     int lastDotIndex = fileName.lastIndexOf(".");
 
@@ -397,6 +397,7 @@ QString UBFileSystemUtils::lastPathComponent(const QString& path)
 
 QString UBFileSystemUtils::mimeTypeFromFileName(const QString& fileName)
 {
+    Q_ASSERT(fileName.length());
     QString ext = extension(fileName);
 
     if (ext == "xls" || ext == "xlsx") return "application/msexcel";
@@ -853,4 +854,4 @@ QString UBFileSystemUtils::readTextFile(QString path)
     }
 
     return "";
-}
\ No newline at end of file
+}
diff --git a/src/gui/UBFeaturesWidget.cpp b/src/gui/UBFeaturesWidget.cpp
index e5e6ab69..6ee337cf 100644
--- a/src/gui/UBFeaturesWidget.cpp
+++ b/src/gui/UBFeaturesWidget.cpp
@@ -235,7 +235,7 @@ void UBFeaturesWidget::onDisplayMetadata( QMap<QString,QString> metadata )
             if (!imageGatherer)
                 imageGatherer = new UBDownloadHttpFile(0, this);
 
-            connect(imageGatherer, SIGNAL(downloadFinished(int, bool, QUrl, QString, QByteArray, QPointF, QSize, bool)), this, SLOT(onPreviewLoaded(int, bool, QUrl, QString, QByteArray, QPointF, QSize, bool)));
+            connect(imageGatherer, SIGNAL(downloadFinished(int, bool, QUrl, QUrl, QString, QByteArray, QPointF, QSize, bool)), this, SLOT(onPreviewLoaded(int, bool, QUrl, QUrl, QString, QByteArray, QPointF, QSize, bool)));
 
             // We send here the request and store its reply in order to be able to cancel it if needed
             imageGatherer->get(QUrl(metadata["Url"]), QPoint(0,0), QSize(), false);
@@ -262,10 +262,11 @@ void UBFeaturesWidget::onDisplayMetadata( QMap<QString,QString> metadata )
 }
 
 
-void UBFeaturesWidget::onPreviewLoaded(int id, bool pSuccess, QUrl sourceUrl, QString pContentTypeHeader, QByteArray pData, QPointF pPos, QSize pSize, bool isBackground)
+void UBFeaturesWidget::onPreviewLoaded(int id, bool pSuccess, QUrl sourceUrl, QUrl originalUrl, QString pContentTypeHeader, QByteArray pData, QPointF pPos, QSize pSize, bool isBackground)
 {
     Q_UNUSED(id);
     Q_UNUSED(pSuccess);
+    Q_UNUSED(originalUrl);
     Q_UNUSED(isBackground);
     Q_UNUSED(pSize);
     Q_UNUSED(pPos);
@@ -1044,6 +1045,7 @@ void UBFeatureProperties::onAddToLib()
         sDownloadFileDesc desc;
         desc.isBackground = false;
         desc.modal = false;
+        desc.dest = sDownloadFileDesc::library;
         desc.name = QFileInfo( mpElement->getFullPath().toString()).fileName();
         qDebug() << desc.name;
         desc.srcUrl = mpElement->getFullPath().toString();
diff --git a/src/gui/UBFeaturesWidget.h b/src/gui/UBFeaturesWidget.h
index e4fb9775..b94b3136 100644
--- a/src/gui/UBFeaturesWidget.h
+++ b/src/gui/UBFeaturesWidget.h
@@ -79,7 +79,7 @@ signals:
     void sendFileNameList(const QStringList lst);
 
 private slots:
-    void onPreviewLoaded(int id, bool pSuccess, QUrl sourceUrl, QString pContentTypeHeader, QByteArray pData, QPointF pPos, QSize pSize, bool isBackground);
+    void onPreviewLoaded(int id, bool pSuccess, QUrl sourceUrl, QUrl originalUrl, QString pContentTypeHeader, QByteArray pData, QPointF pPos, QSize pSize, bool isBackground);
     void currentSelected( const QModelIndex & );
     void searchStarted( const QString & );
     void createNewFolder();
diff --git a/src/gui/UBTeacherGuideWidget.cpp b/src/gui/UBTeacherGuideWidget.cpp
index a56fe901..7d9eca10 100644
--- a/src/gui/UBTeacherGuideWidget.cpp
+++ b/src/gui/UBTeacherGuideWidget.cpp
@@ -551,9 +551,9 @@ void UBTeacherGuidePresentationWidget::showData( QVector<tUBGEElementNode*> data
         else if (element->name == "comment")
             mpComment->showText(element->attributes.value("value"));
         else if (element->name == "action") {
-            QTreeWidgetItem* newWidgetItem = new QTreeWidgetItem( mpRootWidgetItem);
+            QTreeWidgetItem* newWidgetItem = new QTreeWidgetItem(mpRootWidgetItem);
             newWidgetItem->setText(0, element->attributes.value("task"));
-            newWidgetItem->setFlags(Qt::ItemIsEnabled | Qt::ItemIsSelectable);
+            newWidgetItem->setFlags(Qt::ItemIsEnabled);
             QString colorString = element->attributes.value("owner").toInt() == 0 ? "blue" : "green";
             UBTGAdaptableText* textWidget = new UBTGAdaptableText(newWidgetItem, 0);
             textWidget->bottomMargin(14);
@@ -679,7 +679,9 @@ UBTeacherGuidePageZeroWidget::UBTeacherGuidePageZeroWidget(QWidget* parent, cons
     mpLayout->addWidget(mpPageNumberLabel);
 
     mpScrollArea = new QScrollArea();
+    mpScrollArea->setFocusPolicy(Qt::NoFocus);
     mpContainerWidget = new QWidget();
+    mpContainerWidget->setFocusPolicy(Qt::NoFocus);
     mpContainerWidgetLayout = new QVBoxLayout();
 
     mpLayout->addWidget(mpScrollArea);
diff --git a/src/gui/UBTeacherGuideWidgetsTools.cpp b/src/gui/UBTeacherGuideWidgetsTools.cpp
index db2d8bf7..587bc817 100644
--- a/src/gui/UBTeacherGuideWidgetsTools.cpp
+++ b/src/gui/UBTeacherGuideWidgetsTools.cpp
@@ -164,7 +164,7 @@ void UBTGAdaptableText::keyReleaseEvent(QKeyEvent* e)
 void UBTGAdaptableText::showEvent(QShowEvent* e)
 {
     Q_UNUSED(e);
-    if(!mIsUpdatingSize && mHasPlaceHolder && toPlainText().isEmpty() && !isReadOnly()){
+    if(!mIsUpdatingSize && !hasFocus() && mHasPlaceHolder && toPlainText().isEmpty() && !isReadOnly()){
     	setTextColor(QColor(Qt::lightGray));
     	setPlainText(mPlaceHolderText);
     }
@@ -193,7 +193,8 @@ void UBTGAdaptableText::onTextChanged()
 
     if(documentSize < mMinimumHeight){
     	setFixedHeight(mMinimumHeight);
-    }else{
+    }
+    else{
     	setFixedHeight(documentSize+mBottomMargin);
     }
 
@@ -237,12 +238,14 @@ void UBTGAdaptableText::focusInEvent(QFocusEvent* e)
 	QTextEdit::focusInEvent(e);
 }
 
-void UBTGAdaptableText::focusOutEvent(QFocusEvent* e){
+void UBTGAdaptableText::focusOutEvent(QFocusEvent* e)
+{
 	managePlaceholder(false);
 	QTextEdit::focusOutEvent(e);
 }
 
-void UBTGAdaptableText::managePlaceholder(bool focus){
+void UBTGAdaptableText::managePlaceholder(bool focus)
+{
 	if(focus){
 		if(toPlainText() == mPlaceHolderText){
 			setTextColor(QColor(Qt::black));
@@ -258,7 +261,8 @@ void UBTGAdaptableText::managePlaceholder(bool focus){
 	}
 }
 
-void UBTGAdaptableText::setCursorToTheEnd(){
+void UBTGAdaptableText::setCursorToTheEnd()
+{
 	QTextDocument* doc = document();
 	if(NULL != doc){
 		QTextBlock block = doc->lastBlock();
diff --git a/src/tools/UBGraphicsAristo.cpp b/src/tools/UBGraphicsAristo.cpp
index 61762774..40c27ae5 100644
--- a/src/tools/UBGraphicsAristo.cpp
+++ b/src/tools/UBGraphicsAristo.cpp
@@ -31,7 +31,7 @@
 #include "core/memcheck.h"
 
 const QRectF UBGraphicsAristo::sDefaultRect =  QRectF(0, 0, 800, 500);
-const UBGraphicsAristo::Orientation UBGraphicsAristo::sDefaultOrientation = UBGraphicsAristo::Bottom;
+const UBGraphicsAristo::Orientation UBGraphicsAristo::sDefaultOrientation = UBGraphicsAristo::Top;
 
 UBGraphicsAristo::UBGraphicsAristo()
     : UBAbstractDrawRuler()
@@ -62,12 +62,14 @@ UBGraphicsAristo::UBGraphicsAristo()
     mRotateSvgItem->setData(UBGraphicsItemData::ItemLayerType, QVariant(UBItemLayerType::Control));
 
     mMarkerSvgItem = new QGraphicsSvgItem(":/images/angleMarker.svg", this);
-    mMarkerSvgItem->setVisible(false);
     mMarkerSvgItem->setData(UBGraphicsItemData::ItemLayerType, QVariant(UBItemLayerType::Tool));
     mMarkerSvgItem->setVisible(true);
 
     create(*this);
-    setBoundingRect(sDefaultRect);
+
+    setData(UBGraphicsItemData::itemLayerType, QVariant(itemLayerType::CppTool)); //Necessary to set if we want z value to be assigned correctly
+    setFlag(QGraphicsItem::ItemIsSelectable, false);
+
     setOrientation(sDefaultOrientation);
 }
 
@@ -78,43 +80,55 @@ UBGraphicsAristo::~UBGraphicsAristo()
 
 /*
  * setOrientation() modify the tool orientation.
- * makeGeometryChange() is called so points are recomputed, control items are positionnated and shape is determined according to this modification.
+ * Apexes coordinates are alors recomputed.
  */
 void UBGraphicsAristo::setOrientation(Orientation orientation)
 {
+    /* substracting difference to zero [2pi] twice, to obtain the desired angle */
+    mMarkerAngle -= 2 * (mMarkerAngle - (int)(mMarkerAngle/360)*360) - 360;
+
+    bool wasUndefined = mOrientation == Undefined;
     mOrientation = orientation;
-    makeGeometryChange();
+    
+    if (wasUndefined)
+        calculatePoints(sDefaultRect);
+    else
+        calculatePoints(boundingRect());
 }
 
 /* calculatePoints() is used to calculate polygon's apexes coordinates.
  * This function handles orientation changes too.
+ * Items are repositionated and path is redeterminates.
  */
-void UBGraphicsAristo::calculatePoints()
+void UBGraphicsAristo::calculatePoints(QRectF bounds)
 {
     switch (mOrientation) {
     case Bottom:
-        C.setX(boundingRect().center().x());
-        C.setY(boundingRect().bottom());
+        C.setX(bounds.center().x());
+        C.setY(bounds.bottom());
 
-        A.setX(boundingRect().left());
-        A.setY(boundingRect().bottom() - boundingRect().width() / 2);
+        A.setX(bounds.left());
+        A.setY(bounds.bottom() - bounds.width() / 2);
 
-        B.setX(boundingRect().right());
-        B.setY(boundingRect().bottom() - boundingRect().width() / 2);
+        B.setX(bounds.right());
+        B.setY(bounds.bottom() - bounds.width() / 2);
         break;
     case Top:
-        C.setX(boundingRect().center().x());
-        C.setY(boundingRect().top());
+        C.setX(bounds.center().x());
+        C.setY(bounds.top());
 
-        A.setX(boundingRect().left());
-        A.setY(boundingRect().top() + boundingRect().width() / 2);
+        A.setX(bounds.left());
+        A.setY(bounds.top() + bounds.width() / 2);
 
-        B.setX(boundingRect().right());
-        B.setY(boundingRect().top() + boundingRect().width() / 2);
+        B.setX(bounds.right());
+        B.setY(bounds.top() + bounds.width() / 2);
         break;
     default:
         break;
     }
+
+    setItemsPos();
+    setPath(determinePath());
 }
 
 /*
@@ -142,39 +156,49 @@ QPainterPath UBGraphicsAristo::determinePath()
 
     QPolygonF polygon;
     polygon << A << B << C;
-    path.addPolygon(polygon);
 
-    path.addPath(mResizeSvgItem->shape().translated(mResizeSvgItem->pos()));
-    path.addPath(mMarkerSvgItem->shape().translated(mMarkerSvgItem->pos()));
+    qreal rotationAngle = mOrientation == Bottom ? mMarkerAngle : mMarkerAngle - 360 * (int)(mMarkerAngle / 360);
+    QTransform t;
+    t.rotate(rotationAngle);
+    bool markerIsInPolygon = true;
+    if ((mOrientation == Bottom && mMarkerAngle < 90) || (mOrientation == Top && mMarkerAngle < 270))
+        markerIsInPolygon = polygon.containsPoint(t.map(markerButtonRect().topLeft()) + rotationCenter(), Qt::OddEvenFill);
+    else
+        markerIsInPolygon = polygon.containsPoint(t.map(markerButtonRect().bottomLeft()) + rotationCenter(), Qt::OddEvenFill);
 
-    return path;
-}
+    path.moveTo(A);
 
-/*
- * setBoundingRect() is a helper to set the given rectangle as the new shape to limit apexes coordinates.
- * This is useful when instanciating or resizing the object.
- * makeGeometryChange() is called so points are recomputed, control items are positionnated and shape is determined according to this modification. 
- * Setting bounds' width less than 300 is not allowed.
- */
-void UBGraphicsAristo::setBoundingRect(QRectF boundingRect)
-{
-    if (boundingRect.width() < 300)
-        return;
+    QRectF mappedRect = t.mapRect(markerButtonRect());
+    path.lineTo(QPointF(mappedRect.translated(rotationCenter()).left(), A.y()));
+    if (!markerIsInPolygon) {
+        if (mOrientation == Top) {
+            path.lineTo(QPointF(mappedRect.translated(rotationCenter()).left(), mappedRect.translated(rotationCenter()).bottom()));
+            path.lineTo(QPointF(mappedRect.translated(rotationCenter()).right(), mappedRect.translated(rotationCenter()).bottom()));
+        }
+        else if (mOrientation == Bottom) {
+            path.lineTo(QPointF(mappedRect.translated(rotationCenter()).left(), mappedRect.translated(rotationCenter()).top()));
+            path.lineTo(QPointF(mappedRect.translated(rotationCenter()).right(), mappedRect.translated(rotationCenter()).top()));
+        }
+    }
+    path.lineTo(QPointF(mappedRect.translated(rotationCenter()).right(), A.y()));
 
-    QPainterPath path;
-    path.addRect(boundingRect);
-    setPath(path);
-    if (mOrientation != Undefined)
-        makeGeometryChange();
-}
+    path.lineTo(QPointF(resizeButtonRect().translated(rotationCenter()).left(), A.y()));
+    if (mOrientation == Top) {
+        path.lineTo(QPointF(resizeButtonRect().translated(rotationCenter()).left(), resizeButtonRect().translated(rotationCenter()).bottom()));
+        path.lineTo(QPointF(resizeButtonRect().translated(rotationCenter()).right(), resizeButtonRect().translated(rotationCenter()).bottom()));
+    }
+    else if (mOrientation == Bottom) {
+        path.lineTo(QPointF(resizeButtonRect().translated(rotationCenter()).left(), resizeButtonRect().translated(rotationCenter()).top()));
+        path.lineTo(QPointF(resizeButtonRect().translated(rotationCenter()).right(), resizeButtonRect().translated(rotationCenter()).top()));
+    }
+    path.lineTo(QPointF(resizeButtonRect().translated(rotationCenter()).right(), A.y()));
 
-void UBGraphicsAristo::makeGeometryChange()
-{
-    calculatePoints();
-    setItemsPos();
-    setPath(determinePath());
-}
+    path.lineTo(B);
+    path.lineTo(C);
+    path.lineTo(A);
 
+    return path;
+}
 
 UBItem* UBGraphicsAristo::deepCopy(void) const
 {
@@ -191,7 +215,6 @@ void UBGraphicsAristo::copyItemParameters(UBItem *copy) const
         /* TODO: copy all members */
         cp->setPos(this->pos());
         cp->setTransform(this->transform());
-        cp->setBoundingRect(boundingRect());
         cp->setOrientation(mOrientation);
         cp->mRotatedAngle = mRotatedAngle;
         cp->mMarkerAngle = mMarkerAngle;
@@ -501,7 +524,8 @@ QRectF UBGraphicsAristo::hFlipRect() const
 
 QRectF UBGraphicsAristo::markerButtonRect() const
 {
-    return QRectF (radius()/2 - mMarkerSvgItem->boundingRect().width(), - mMarkerSvgItem->boundingRect().height()/2, mMarkerSvgItem->boundingRect().width(), mMarkerSvgItem->boundingRect().height());
+    qreal y = - mMarkerSvgItem->boundingRect().height()/2;
+    return QRectF (radius()/2 - mMarkerSvgItem->boundingRect().width(), y, mMarkerSvgItem->boundingRect().width(), mMarkerSvgItem->boundingRect().height());
 }
 
 QRectF  UBGraphicsAristo::resizeButtonRect() const
@@ -580,7 +604,7 @@ void UBGraphicsAristo::mouseMoveEvent(QGraphicsSceneMouseEvent *event)
         }
         else if (mResizing) {
             QPointF delta = event->pos() - event->lastPos();
-            setBoundingRect(QRectF(boundingRect().topLeft(), QSizeF(boundingRect().width() + delta.x(), boundingRect().height() + delta.x())));
+            calculatePoints(QRectF(boundingRect().topLeft(), QSizeF(boundingRect().width() + delta.x(), boundingRect().height() + delta.x())));
         }
         else if(mMarking) {
             qreal angle = currentLine.angleTo(lastLine);
@@ -611,6 +635,8 @@ void UBGraphicsAristo::mouseReleaseEvent(QGraphicsSceneMouseEvent *event)
 {
     if (mResizing || mRotating || mMarking)
     {
+        if (mMarking)
+            setPath(determinePath());
         mResizing = false;
         mRotating = false;
         mMarking = false;
@@ -623,9 +649,7 @@ void UBGraphicsAristo::mouseReleaseEvent(QGraphicsSceneMouseEvent *event)
             hide();
             emit hidden();
             break;
-        case HorizontalFlip:
-            /* substracting difference to zero [2pi] twice, to obtain the desired angle */
-            mMarkerAngle -= 2 * (mMarkerAngle - (int)(mMarkerAngle/360)*360) - 360;
+        case HorizontalFlip:            
             /* setting new orientation */
             switch(mOrientation) {
             case Bottom:
diff --git a/src/tools/UBGraphicsAristo.h b/src/tools/UBGraphicsAristo.h
index 8d23d7e5..2d7af92b 100644
--- a/src/tools/UBGraphicsAristo.h
+++ b/src/tools/UBGraphicsAristo.h
@@ -66,8 +66,7 @@ public:
         Undefined
     };
     
-    void setOrientation(Orientation orientation);
-    void setBoundingRect(QRectF boundingRect);        
+    void setOrientation(Orientation orientation);       
 
     virtual UBItem* deepCopy() const;
     virtual void copyItemParameters(UBItem *copy) const;
@@ -113,10 +112,9 @@ private:
     QTransform calculateRotationTransform();
     void rotateAroundCenter(QTransform& transform, QPointF center);
 
-    void calculatePoints();
+    void calculatePoints(QRectF bounds);
     QPainterPath determinePath();
     void setItemsPos();
-    void makeGeometryChange();
 
     QBrush fillBrush() const;
     void paintGraduations(QPainter *painter);