Downloaded CSS has no changes

[Robert Verderber]

I'm not sure if I am just doing something wrong but thought maybe someone could help me. I am using visual style builder to help tweak the colors for the simple skin (Menu Control) . I change the colors I want, I see them reflected on the screen. I click the save button and then when I download the file, the css values are from the original colors in the simple skin. Am I missing a step?

[Kamen Bundev]

Hi Robert,

Can you tell which browser did you use to create the skin? Also can you send the generated skin along (you will need to open a support ticket to attach it)?

Kind regards,
Kamen Bundev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Robert Verderber]

Ihave only been playing with creating a new menu skin based off simple.

I was originally using chrome, which doesn't work at all. Changing a color doesn't have any effect on the preview at all. After a while I tried another browser. Both IE8 and Firefox show the color changes on the preview but both download a css file that is unchanged.

I will open a support ticket and attach a file

[MBA]

Hi,

I'm also having a similar problem.  Style Builder looks like a very useful tool, but unfortunately none of my changes get downloaded.  I've tried in both Chrome (version 6.0.472.63) and IE 8 and neither save my changes.

Here's what I'm doing:

Create a new skin based on the default skin.  Select the controls I require, make the desired change to the input control style (border colour and font size and type) click the save button and then click the download button.

My changes don't appear when the custom skin is used.  If I then load my skin back into Style Builder none of my changes are there.  I have slightly different behaviour between IE and Chrome.  In Chrome even if I stay in Style Builder and change between controls after clicking save when I go back to a changed control my styles have disappeared and reverted to the original skin values.  In IE navigation between controls and back my values are retained and only lost during downloads.

Any help much appreciated.

Jeff

[Kamen Bundev]

Hi Jeff,

You are right about Chrome, we will investigate why this happens.

I tried to follow your steps in IE8 but Visual Style Builder worked as usual there producing a skin that had all the changes I did. Can you describe what you did step by step, including which controls you chose and what changes exactly did you make before saving the skin and downloading it? Thank you in advance.

Can you also send one such skin that you downloaded from VSB so we can check it out?

Kind regards,
Kamen Bundev
the Telerik team

[MBA]

Hi,

The controls I selected were Calendar, ComboBox, Dock, FormDecorator, Grid, Input, ListBox, Menu, Schedular, Slider, ToolBar, ToolTip and Window. The particular change I was trying to make was the border color to the input.  Once I had this working I was planning to change more styles.  The base theme I started with was Windows7.

I'm not able to attach the zip to this reply and I'm not able to send a support ticket at the moment as I get a 404 error.  How shall I send the zip of the style?

Many thanks for you time.

Jeff

[Kamen Bundev]

Hi Jeff,

You can open a support ticket and attach the needed files there. Just make sure you refer to this thread in the ticket.

Kind regards,
Kamen Bundev
the Telerik team

[Robert Verderber]

I never really got this to work myself. Chrome wasn't supported at the time I made the original post. I tried both the toolbar and the menu seperately with IE and no matter what I did the changes I made would be reflected in the site but what I downloaded was the orginal settings in the default simple skin.

[Kamen Bundev]

Hi Robert,

Did you do a more recent test in Visual Style Builder which failed again? Can you record a short video of the actions you take and send it along in a support ticket? Thank you in advance.

Sincerely yours,
Kamen Bundev
the Telerik team

[treesara]

I'm also running into issues trying to set a base color.  I choose New Skin and WebBlue as template, checking only the Dock.  Under the Colorize tab, I try choosing a base color by inputting #495a70 which is not accepted and keeps automatically changing.  I then try choosing the color popup and there under HSV am able to enter the color above and click apply.  However, the resulting preview is grayed out.  Finally, clicking save shows some more previews but the color above is not applied at all.  Instead, I end up with a gray based colortone.  Please help.

Thanks
Panit

[Kamen Bundev]

Hi Treesara,

The gray tint can happen if you apply the same colorization twice (at least with your color). The point is that the second time the result is getting colorized, not the original. Other than that - I've just tested in IE and Firefox and the color can be correctly entered both in the text box and in the color picker.

Sincerely yours,
Kamen Bundev
the Telerik team

[treesara]

Kamen,

I just tried putting the color in once into the Base Color textbox and clicked saved.  The result is still a gray tone effect.  Did you try and download all the way through as well as checking the resulting files once downloaded?  I think you'll see that the colors do no take effect.

Regards,
Panit

[Judy]

Hi:
I was thrilled when I found this tool - thrilled!!!  All the functions to pick colors worked great and the results showed correctly on the screen. However, when downloaded the results my colors were not there they were still the black skin that I started with.  I tried this both in FF and IE hoping for the correct results.  Please look into this - this is a fantastic tool.

Judy

[Judy]

BTW I was using the sitemap.

[Kamen Bundev]

Hello Judy and Treesara,

@Judy: Unfortunately this is how currently the colorization works. The grayscale colors cannot be colorized. We are considering changing this behavior but I can't give you a time frame for that.

@Treesara: They do take effect, but your color when applied on the WebBlue color produces a different color that is very little blue and mostly gray. As I said previously the color information is not removed when your color is applied so you won't get the same color you applied at the end. For instance if you apply pink on the WebBlue skin you won't get pink but violet instead. To be able to do what you ask for, we first need to implement the grayscale colorization I've mentioned in the first answer above. Again I can't give you a time frame for that.

Greetings,
Kamen Bundev
the Telerik team

[Bart Welch]

I too have been trying to change the colors in the Style Builder tool.  No changes are made when I set the base color.

Here is what I am doing:
Select Sunset as the starting template
Select Grid option
On the base color, I am setting it to color #c18330 which is a different shade of orange.  Click save.
When I go to the fine tune tab, nothing looks different.  Still has the base Sunset theme with no color changes.  

I also downloaded the zip file for the Sunset theme in order to manually make changes to the colors and images myself.  I made the necessary changes to use the custom them, but the grid is not seeing or using my custom theme.  I loaded the custom theme to the Theme folder.  I also made the changes in the web.config for the new custom theme as well as changing the theme within the grid control itself and it still does not see the custom theme.  Am I doing something wrong for custom themes?

Web.config appSettings

        <add key="Telerik.Grid.Skin" value="IMGReports"  />

        <add key="Telerik.EnableEmbeddedSkins" value="False"/>
Loaded custom theme "IMGReports" to the App_Themes folder.

[Alex Gyoshev]

Hello Bart,

We could not reproduce the problem. Here is a video of what we tried, and the generated skin is attached. Regarding the App_Themes, it seems that you took all required steps in order to register it. Could you please send the solution that shows the problem?

Kind regards,
Alex Gyoshev
the Telerik team

[Bart Welch]

Alex,

What other information do you need specifically from our project for linking to the custom theme?  

Btw, I got the stylebuilder to work.  It was being blocked by our internal firewall settings.

[Judy]

I used your visual style builder to change colors on the Forest RadMenu - here is what I did:
1. Colorize - set base color to #1C3664
2. Shift Colors - set saturation = 100

saved it

3. Fine-tune

Horizontal

Main item - Set background color to #1C3664
            set Text color to #ffffff & set font = Arial

Exapandable Root - Expandable (only inner), Expanded and Expanded (inner)
                   set background color to #618073
                   set Text color to #ffffff & set font = Arial

Hovered Root item & Hovered(inner)
                   set background color to #618073
                   set Text color to #ffffff & set font = Arial

Sub-menu Wrapper - set background color to #ABB8D7

sub-menu items - outer wrapper = background color #abbbd7
                                 Text color to #ffffff & set font = Arial

                 inner wrapper = background color #e0e5f0
                 inner wrapper text color #606262

Hovered -
          outer Wrapper = background color #618073
          Inner wrapper = background color #618073
                          Text color = #ffffff

save

download


I have attached the rmsprite.png file that was included in the zip download and you will  notice that there is a bright blue color on hover not the green #618073 that I set in the visual style Builder (VSB).  I can't figure out if I used VSB incorrectly or if it is not taking all of my inputs. I look through the CSS, but I cannot see what I need to modify to get it to use the green color.

2. I also want to have the menu float right and I cannot figure out where in the CSS to set this. 

I have included the CSS that was in the zip file below.  I hope that you can point  me in the right direction because In need to learn how to customize the color on the rad controls.

/* <RadMenu / Forest> */

.RadMenu_PIC .rmRootGroup,
.RadMenu_PIC a.rmLink,
.RadMenu_PIC .rmText,
.RadMenu_PIC .rmLeftArrow,
.RadMenu_PIC .rmRightArrow,
.RadMenu_PIC .rmTopArrow,
.RadMenu_PIC .rmBottomArrow
{
    background-image: url('Menu/rmSprite.png');
    background-color: transparent;
}

.RadMenu_PIC .rmRootGroup
{
    border: 1px solid #4d648a;
    background-repeat: repeat-x;
    background-position: 0 0;
    background-color: #55709e;
}

.RadMenu_PIC .rmVertical
{
    background-position: 0 -408px;
}

/* <Root items> */

.RadMenu_PIC,
.RadMenu_PIC a.rmLink
{
    font: normal 12px/23px "Segoe UI", Arial, sans-serif;
    color: #21252b;
    text-decoration: none;
}

.RadMenu_PIC a.rmLink,
.RadMenu_PIC .rmText
{
    background-position: 0 1050px;
    background-repeat: no-repeat;
}

.RadMenu_PIC a.rmLink:hover,
.RadMenu_PIC a.rmFocused,
.RadMenu_PIC a.rmSelected
{
    color: #022e7a;
    background-position: 0 -72px;
}

.RadMenu_PIC a.rmLink:hover .rmText,
.RadMenu_PIC a.rmFocused .rmText,
.RadMenu_PIC a.rmSelected .rmText
{
    background-position: 100% -96px;
}

.RadMenu_PIC a.rmExpanded,
.RadMenu_PIC a.rmExpanded:hover
{
    color: #ffffff;
    background-position: 0 -120px;
}

.RadMenu_PIC a.rmExpanded .rmText,
.RadMenu_PIC a.rmExpanded:hover .rmText
{
    background-position: 100% -144px;
}

.RadMenu_PIC a.rmDisabled,
.RadMenu_PIC a.rmDisabled:hover
{
    color: #7f9ac7;
}

.RadMenu_PIC a.rmDisabled:hover,
.RadMenu_PIC a.rmDisabled:hover .rmText
{
    background: none;
}

/* </Root items> */


/* <Submenu items> */

.RadMenu_PIC .rmGroup,
.RadMenu_PIC .rmMultiColumn,
.RadMenu_PIC .rmGroup .rmVertical
{
    border: 1px solid #4d648a;
    background: #abbcd6 url('Menu/rmVSprite.png') repeat-y 0 0;
}

.RadMenu_PIC .rmTopFix,
.RadMenu_PIC .rmBottomFix,
.RadMenu_PIC .rmRoundedCorners .rmGroup .rmItem,
.RadMenu_PIC .rmRoundedCorners li.rmFirstGroupColumn .rmItem,
.RadMenu_PIC .rmRoundedCorners .rmFirstGroupColumn li.rmFirstGroupColumn .rmItem,
.RadMenu_PIC .rmRoundedCorners ul.rmHorizontal .rmFirst,
.RadMenu_PIC_Context.rmRoundedCorners .rmGroup .rmItem,
.RadMenu_PIC_Context.rmRoundedCorners ul.rmHorizontal .rmFirst
{
    background-image: url('Menu/rmVSprite.png');
    background-color: #abbcd6;
    background-repeat: repeat-y;
}

* html .rmRoundedCorners_PIC .rmGroup .rmItem,
* html .rmRoundedCorners_PIC ul.rmHorizontal .rmFirst
{
    background-image: url('Menu/rmVSprite.png');
    background-color: #abbcd6;
    background-repeat: repeat-y;
}

.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer .rmGroup,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrap .rmItem,
.RadMenu_PIC .rmRoundedCorners .rmGroupColumn .rmItem,
.RadMenu_PIC .rmRoundedCorners .rmGroupColumn .rmGroupColumn .rmItem,
.RadMenu_PIC .rmRoundedCorners .rmHorizontal .rmItem,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrap .rmVertical,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer .rmGroup,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrap .rmItem,
.RadMenu_PIC_Context.rmRoundedCorners .rmHorizontal .rmItem,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrap .rmVertical
{
    background-image: none;
}

* html .rmRoundedCorners_PIC .rmScrollWrapContainer .rmGroup,
* html .rmRoundedCorners_PIC .rmScrollWrap .rmItem,
* html .rmRoundedCorners_PIC .rmHorizontal .rmItem,
* html .rmRoundedCorners_PIC .rmScrollWrap .rmVertical
{
    background-image: none;
}

.RadMenu_PIC .rmRoundedCorners .rmGroupColumn
{
    background-color: #abbcd6;
}

.RadMenu_PIC .rmBottomLeft,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer,
.RadMenu_PIC_Context.rmRoundedCorners ul.rmGroup,
.RadMenu_PIC .rmRoundedCorners ul.rmGroup,
.RadMenu_PIC .rmRoundedCorners .rmMultiColumn
{
    background-image:  url('Menu/rmRoundedLeft.png');
    background-color: transparent;
    background-repeat: no-repeat;
}

* html .rmRoundedCorners_PIC .rmScrollWrapContainer,
* html .rmRoundedCorners_PIC .rmGroup ul.rmGroup,
* html .rmRoundedCorners_PIC ul.rmGroup
{
    background-image:  url('Menu/rmRoundedLeft.png');
    background-color: transparent;
    background-repeat: no-repeat;
}

.RadMenu_PIC .rmTopRight,
.RadMenu_PIC .rmBottomRight
{
    background-image:  url('Menu/rmRoundedRight.png');
    background-color: transparent;
    background-repeat: no-repeat;
}

.RadMenu_PIC .rmTopFix,
.RadMenu_PIC .rmBottomFix,
.RadMenu_PIC .rmRoundedCorners .rmGroup .rmFirst,
.RadMenu_PIC_Context.rmRoundedCorners .rmGroup .rmFirst,
.rmRoundedCorners_PIC .rmGroup .rmFirst
{
    border-color: #4d648a;
}

.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer .rmTopFix,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer .rmBottomFix,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer .rmTopFix,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer .rmBottomFix
{
    background: #abbcd6;
}

* html .rmRoundedCorners_PIC .rmScrollWrapContainer .rmTopFix,
* html .rmRoundedCorners_PIC .rmScrollWrapContainer .rmBottomFix
{
    background: #abbcd6;
}

.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer .rmTopArrow,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer .rmBottomArrow,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer .rmLeftArrow,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer .rmRightArrow,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer .rmTopArrow,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer .rmBottomArrow,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer .rmLeftArrow,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer .rmRightArrow
{
    background-color: #abbcd6;
    border: 0;
}

* html .rmRoundedCorners_PIC .rmScrollWrapContainer .rmTopArrow,
* html .rmRoundedCorners_PIC .rmScrollWrapContainer .rmBottomArrow,
* html .rmRoundedCorners_PIC .rmScrollWrapContainer .rmLeftArrow,
* html .rmRoundedCorners_PIC .rmScrollWrapContainer .rmRightArrow
{
    background-color: #abbcd6;
    border: 0;
}

.RadMenu_PIC_rtl .rmBottomLeft,
.RadMenu_PIC_rtl .rmRoundedCorners ul.rmGroup,
.RadMenu_PIC_rtl .rmRoundedCorners .rmMultiColumn,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer,
.RadMenu_PIC .rmScrollWrapContainer .rmBottomLeft,
.rmRoundedCorners.RadMenu_PIC_Context_rtl ul.rmGroup,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer
{
    background-image: url('Menu/rmRoundedLeft_rtl.png');
}

.RadMenu_PIC_rtl .rmTopRight,
.RadMenu_PIC_rtl .rmBottomRight
{
    background-image: url('Menu/rmRoundedRight_rtl.png');
}

.RadMenu_PIC_rtl li.rmTopFix,
.RadMenu_PIC_rtl li.rmBottomFix,
.RadMenu_PIC_rtl .rmRoundedCorners .rmGroup .rmItem,
.rmRoundedCorners.RadMenu_PIC_Context_rtl .rmGroup .rmItem
{
    background-position: 101% 0;
}

.RadMenu_PIC .rmSlide .rmScrollWrap
{
    background-image: none;
}

.RadMenu_PIC_rtl .rmGroup,
.RadMenu_PIC_rtl .rmMultiColumn,
.RadMenu_PIC_rtl .rmGroup .rmVertical
{
    background-position: 100% 0;
}

.RadMenu_PIC .rmRootGroup .rmHorizontal
{
    background-image: none;
}

.RadMenu_PIC .rmScrollWrap .rmVertical
{
    border: 0;
}

.RadMenu_PIC .rmGroup .rmFirst,
.RadMenu_PIC .rmGroup .rmLast,
.RadMenu_PIC .rmRoundedCorners .rmScrollWrapContainer li.rmItem,
.RadMenu_PIC_Context.rmRoundedCorners .rmScrollWrapContainer li.rmItem,
.rmRoundedCorners_PIC .rmScrollWrapContainer li.rmItem
{
    background: none;
}

.RadMenu_PIC .rmGroup .rmLast
{
    padding-bottom: 1px;
}

.RadMenu_PIC .rmGroup a.rmLink:hover,
.RadMenu_PIC .rmGroup a.rmFocused,
.RadMenu_PIC .rmGroup a.rmSelected,
.RadMenu_PIC .rmGroup a.rmExpanded
{
    background-position: 0 -168px;
}

.RadMenu_PIC .rmGroup a.rmLink:hover .rmText,
.RadMenu_PIC .rmGroup a.rmFocused .rmText,
.RadMenu_PIC .rmGroup a.rmSelected .rmText,
.RadMenu_PIC .rmGroup a.rmExpanded .rmText
{
    background-position: 100% -192px;
}

.RadMenu_PIC .rmGroup a.rmExpanded,
.RadMenu_PIC .rmGroup a.rmExpanded:hover
{
    color: #022e7a;
}

.RadMenu_PIC .rmGroup a.rmDisabled,
.RadMenu_PIC .rmGroup a.rmDisabled:hover
{
    color: #5f769e;
}

/* <expand arrows> */

.RadMenu_PIC .rmGroup .rmExpandRight,
.RadMenu_PIC .rmGroup .rmExpandDown
{
    background-position: 100% -216px;
}

.RadMenu_PIC .rmGroup a.rmLink:hover .rmExpandRight,
.RadMenu_PIC .rmGroup a.rmFocused .rmExpandRight,
.RadMenu_PIC .rmGroup a.rmSelected .rmExpandRight,
.RadMenu_PIC .rmGroup a.rmExpanded .rmExpandRight,
.RadMenu_PIC .rmGroup a.rmLink:hover .rmExpandDown,
.RadMenu_PIC .rmGroup a.rmFocused .rmExpandDown,
.RadMenu_PIC .rmGroup a.rmSelected .rmExpandDown,
.RadMenu_PIC .rmGroup a.rmExpanded .rmExpandDown
{
    background-position: 100% -240px;
}

.RadMenu_PIC .rmGroup a.rmDisabled:hover .rmExpandRight,
.RadMenu_PIC .rmGroup a.rmDisabled:hover .rmExpandDown
{
    background-image: url('Menu/rmSprite.png');
    background-position: 100% -216px;
}

/* </expand arrows> */

/* <rtl> */

.RadMenu_PIC_rtl .rmGroup a.rmLink:hover,
.RadMenu_PIC_rtl .rmGroup a.rmFocused,
.RadMenu_PIC_rtl .rmGroup a.rmSelected,
.RadMenu_PIC_rtl .rmGroup a.rmExpanded
{
    background-position: 100% -264px;
}

.RadMenu_PIC_rtl .rmGroup a.rmLink:hover .rmText,
.RadMenu_PIC_rtl .rmGroup a.rmFocused .rmText,
.RadMenu_PIC_rtl .rmGroup a.rmSelected .rmText,
.RadMenu_PIC_rtl .rmGroup a.rmExpanded .rmText
{
    background-position: 0 -288px;
}

.RadMenu_PIC_rtl .rmGroup .rmExpandLeft
{
    background-position: 0 -312px;
}

.RadMenu_PIC_rtl .rmGroup a.rmLink:hover .rmExpandLeft,
.RadMenu_PIC_rtl .rmGroup a.rmFocused .rmExpandLeft,
.RadMenu_PIC_rtl .rmGroup a.rmSelected .rmExpandLeft,
.RadMenu_PIC_rtl .rmGroup a.rmExpanded .rmExpandLeft
{
    background-position: 0 -336px;
}

/* </rtl> */

/* </Submenu items> */

/* <Submenu offsets (Forest - specific, overlapping submenus)> */

.RadMenu_PIC .rmSlide
{
    margin: -3px 0 0 1px;
}

.RadMenu_PIC .rmVertical .rmSlide,
.RadMenu_PIC .rmSlide .rmSlide,
.RadMenu_PIC_Context .rmGroup .rmSlide
{
    margin: 0 0 0 -5px;
}

.RadMenu_PIC_rtl .rmSlide
{
    margin: -3px 0 0 -1px;
}

.RadMenu_PIC_rtl .rmVertical .rmSlide,
.RadMenu_PIC_rtl .rmSlide .rmSlide,
.RadMenu_PIC_Context_rtl .rmGroup .rmSlide
{
    margin: 0 0 0 5px;
}

/* </Submenu offsets> */

/* <Scrolling arrows> */

.RadMenu_PIC .rmLeftArrow,
.RadMenu_PIC .rmRightArrow
{
    background-color: #abbcd6;
}

.RadMenu_PIC .rmLeftArrow { background-position: -8px -312px; border-right: 1px solid #4d648a; }
.RadMenu_PIC .rmRightArrow { background-position: -482px -216px; border-left: 1px solid #4d648a; }

.RadMenu_PIC .rmTopArrow,
.RadMenu_PIC .rmBottomArrow,
.RadMenu_PIC .rmGroup .rmLeftArrow,
.RadMenu_PIC .rmGroup .rmRightArrow
{
    background-color: #abbcd6;
}

.RadMenu_PIC .rmTopArrow { background-position: 50% -367px; border-bottom: 1px solid #4d648a; }
.RadMenu_PIC .rmBottomArrow { background-position: 50% -391px; border-top: 1px solid #4d648a; }

/* </Scrolling arrows> */

/* <Separators> */

.RadMenu_PIC .rmVertical .rmSeparator .rmText,
.RadMenu_PIC .rmHorizontal .rmVertical .rmSeparator .rmText
{
    background-position: 0 -406px;
}

.RadMenu_PIC .rmHorizontal .rmSeparator .rmText,
.RadMenu_PIC .rmVertical .rmHorizontal .rmSeparator .rmText
{
    background-position: 0 -386px;
}

/* </Separators> */

/* </RadMenu / Forest> */




 div.RadMenu_PIC .rmItem .rmLink {

    font-family: Arial;

    color: rgb(255, 255, 255);

    background-color: rgb(28, 54, 100);

}

 div.RadMenu_PIC .rmItem .rmLink:hover {

    background-color: rgb(97, 128, 115);

}

 div.RadMenu_PIC .rmItem .rmLink .rmExpandDown {

    background-color: rgb(97, 128, 115);

}

 div.RadMenu_PIC .rmItem .rmExpanded {

    background-color: rgb(97, 128, 115);

}

 div.RadMenu_PIC .rmItem .rmGroup {

    background-color: rgb(171, 184, 215);

}

 div.RadMenu_PIC .rmGroup .rmItem .rmLink {

    background-color: rgb(171, 187, 215);

}

 div.RadMenu_PIC .rmGroup .rmItem .rmLink .rmText {

    background-color: rgb(224, 229, 240);

    color: rgb(96, 98, 98);

}

 div.RadMenu_PIC .rmGroup .rmItem .rmLink:hover {

    background-color: rgb(97, 128, 115);

}

 div.RadMenu_PIC .rmGroup .rmItem .rmLink:hover .rmText {

    background-color: rgb(97, 128, 112);

    color: rgb(255, 255, 255);

}

[Alex Gyoshev]

@Bart: If the process outlined in the online documentation does not work, we need a sample application that shows the problem (i.e. not working theme)

@Judy: The color is applied. #618073 is rgb(97, 128, 115). The background image is placed over the colors, though -- so you should remove it if you want the color to be visible. In order to float the menu to the right, you might want to use the following CSS:
    div.RadMenu { float: right; }

All the best,
Alex Gyoshev
the Telerik team

[Judy]

Thank you for your response.

I want to edit the sprite how can I do that? 

Can you make PSD files available?

Judy

[Vasil Yordanov]

Hi Judy,

You can edit the sprite with your preferred image editor that supports PNG8 and PNG24, for instance Paint.NET and The Gimp are good free ones and Adobe Photoshop is non-free.

We don't have sprite PSD files for our controls since they are generally not needed when you edit the sprite - the backgrounds, strokes and shadows are kept in the skin design PSD files which you can download from:

http://www.telerik.com/support/skins.aspx

Greetings,
Vasil Yordanov, UX Team
the Telerik team