Polymer - Elemente cu stiluri diferite

Pana acum am facut un element polymer si se pare ca functioneaza perfect, dar ce putem face daca dorim sa avem diverse stiluri (CSS) pentru acel element?

Pai,putem scrie acest CSS ca facand parte din element.

Bineinteles, aceste stiluri pot fi suprascrise, dar poate avem nevoie ca elemental nostrum sa arate intr-un anumit mod in mod default.

Cum putem face acest lucru? Pai exact cum am fi facut in HTML normal, folosindu-ne de tag-ul <style> in template.

Iar in interiorul acestui style punem CSS-ul necesar acestui element polymer:

<link rel="import" href="../bower_components/polymer/polymer.html">

<dom-module id="salut-ip">
  <template>
    <style>
      .element-heading{
          font-family: monospace;
          text-shadow: 1px 1px 3px black;
      }
    </style>
	<h1 class="element-heading">Salut www.Invata-Programare.Ro</h1>
  </template>
  <script>
    Polymer({is: "salut-ip"});
  </script>
</dom-module>

Acum, daca mergem in browser si apasam F5 se poate observa schimbarea: