I am trying to move styles for a number of elements from a less file into an angular directive. I have created directives already but am unclear how this should be done.

For example, if I have a html file like below:

```
   <div mylessDirective>
       <div class="style1">Hello World</div>
       <div class="style2">Hello World2</div>
       <div class="style3">Hello World3</div>
   <div>

```

Here I have 3 divs with 3 different styles, style 1 and style 2 and style 3. Is it possible to call a directive (mylessDirective) as shown that contains all the less styles associated with this class, so that it picks them up. If so can anyone suggest how this directive should be done, for example if I wanted to set a different background colour for each of the three styles. Thanks for the help!