/** Colors
 * ------------------------ */
:root{
    --theme-c01:   #990025;            /* vermell, diba corporatiu */
    --theme-c02:   #f94c61;            /* rosa, adm local (#fc8b9d) */
    --theme-c03:   #e0001a;            /* vermell, comerç i consum */
    --theme-c04:   #ffa02a;            /* taronja, cultura */
    --theme-c05:   #f4c400;            /* groc, educació */
    --theme-c06:   #a3600f;            /* marró, turisme */
    --theme-c07:   #b5be00;            /* verd oliva, benestar i ciutadania */
    --theme-c08:   #598d1e;            /* verd, territori i parcs naturals */
    --theme-c09:   #01a29c;            /* turquesa, esports */
    --theme-c10:   #2f9ad3;            /* blau cel, medi ambient (#6dc6e8;) */
    --theme-c11:   #02739b;            /* blau cobalt, economia i treball */
    --theme-c12:   #362a80;            /* lila, urbanisme i habitatge */
    --theme-c13:   #8f246a;            /* morat, salut pública */
    --theme-c14:   #5d6b6b;            /* corduroy */
    --theme-c15:   #bdc3c7;            /* silver */

    --color-diba: --theme-c01;
    
    --color-greensea: #16A085;
    --color-emerald: #2ECC71;
    --color-nephritis: #27AE60;
    --color-peterriver: #3498DB;
    --color-belizehole: #2980B9;
    --color-amethyst: #9B59B6;
    --color-wisteria: #8E44AD;
    --color-wetasphalt: #34495E;
    --color-midnightblue: #2C3E50;
    --color-sunflower: #F1C40F;
    --color-orange: #F39C12;
    --color-carrot: #E67E22;
    --color-pumpkin: #D35400;
    --color-alizarin: #E74C3C;
    --color-pomegranate: #C0392B;
    --color-clouds: #ECF0F1;
    --color-silver: #BDC3C7;
    --color-concrete: #95A5A6;
    --color-asbestos: #7F8C8D;
}

/** SECTIONS Colors
 * ---------------------------------- */
.scolor-1 {
  color: #ffd5df;
  background-color: var(--theme-c01);
}
.scolor-1 h4,
.scolor-1 h5,
.scolor-1 h6 {
  font-weight: bold;
}
.scolor-2 {
  color: #2f1b1f;
  background-color: var(--theme-c02);
}
.scolor-2 h4,
.scolor-2 h5,
.scolor-2 h6 {
  font-weight: bold;
}
.scolor-3 {
  color: #fff4f5;
  background-color: var(--theme-c03);
}
.scolor-3 h4,
.scolor-3 h5,
.scolor-3 h6 {
  font-weight: bold;
}
.scolor-4 {
  color: #633e10;
  background-color: var(--theme-c04);
}
.scolor-4 h4,
.scolor-4 h5,
.scolor-4 h6 {
  font-weight: bold;
}
.scolor-5 {
  color: #604d00;
  background-color: var(--theme-c05);
}
.scolor-5 h4,
.scolor-5 h5,
.scolor-5 h6 {
  font-weight: bold;
}
.scolor-6 {
  color: #fff4e7;
  background-color: var(--theme-c06);
}
.scolor-6 h4,
.scolor-6 h5,
.scolor-6 h6 {
  font-weight: bold;
}
.scolor-7 {
  color: #434700;
  background-color: var(--theme-c07);
}
.scolor-7 h4,
.scolor-7 h5,
.scolor-7 h6 {
  font-weight: bold;
}
.scolor-8 {
  color: #0f1705;
  background-color: var(--theme-c08);
}
.scolor-8 h4,
.scolor-8 h5,
.scolor-8 h6 {
  font-weight: bold;
}
.scolor-9 {
  color: #002f2d;
  background-color: var(--theme-c09);
}
.scolor-9 h4,
.scolor-9 h5,
.scolor-9 h6 {
  font-weight: bold;
}
.scolor-10 {
  color: #172c34;
  background-color: var(--theme-c10);
}
.scolor-10 h4,
.scolor-10 h5,
.scolor-10 h6 {
  font-weight: bold;
}
.scolor-11 {
  color: #ccf2ff;
  background-color: var(--theme-c11);
}
.scolor-11 h4,
.scolor-11 h5,
.scolor-11 h6 {
  font-weight: bold;
}
.scolor-12 {
  color: #d1caff;
  background-color: var(--theme-c12);
}
.scolor-12 h4,
.scolor-12 h5,
.scolor-12 h6 {
  font-weight: bold;
}
.scolor-13 {
  color: #ffe1f4;
  background-color: var(--theme-c13);
}
.scolor-13 h4,
.scolor-13 h5,
.scolor-13 h6 {
  font-weight: bold;
}
.scolor-14 {
  color: #f4ffff;
  background-color: var(--theme-c14);
}
.scolor-14 h4,
.scolor-14 h5,
.scolor-14 h6 {
  font-weight: bold;
}
.scolor-15 {
  color: #484a4b;
  background-color: var(--theme-c15);
}
.scolor-15 h4,
.scolor-15 h5,
.scolor-15 h6 {
  font-weight: bold;
}


/** THEME Colors
 * ---------------------------------- */

.bg-theme {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--theme-color);
}
.bg-greensea {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-greensea);
}
.bg-emerald {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-emerald);
}
.bg-nephritis {
  color: rgba(255, 255, 255, 0.8);
  background-color: #var(--color-nephritis);
}
.bg-peterriver {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-peterriver);
}
.bg-belizehole {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-belizehole);
}
.bg-amethyst {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-amethyst);
}
.bg-wisteria {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-wisteria);
}
.bg-wetasphalt {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-wetasphalt);
}
.bg-midnightblue {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-midnightblue);
}
.bg-sunflower {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-sunflower);
}
.bg-orange {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-orange);
}
.bg-carrot {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-carrot);
}
.bg-pumpkin {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-pumpkin);
}
.bg-alizarin {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-alizarin);
}
.bg-pomegranate {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-pomegranate);
}
.bg-clouds {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-clouds);
}
.bg-silver {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-silver);
}
.bg-concrete {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-concrete);
}
.bg-asbestos {
  color: rgba(255, 255, 255, 0.8);
  background-color: var(--color-asbestos);
}