/*
  Grep xchange to make color
  
  ex.
    cs2_color -> teal
    ffdd60 -> 00B5AD
    ffce19 -> 009A93
    e6b917 -> 00847E
*/

/*******************************
            Standard
*******************************/

/*--------------
    Colors
---------------*/

/*--- Light Colors  ---*/

.ui.menu .cs2_color.active.item,
.ui.cs2_color.menu .active.item {
  border-color: #ffdd60 !important;
  color: #ffdd60 !important;
}

/*--------------
 Inverted Colors
---------------*/

/*--- Inverted Colors  ---*/

.ui.inverted.cs2_color.menu {
  background-color: #ffdd60;
}

.ui.inverted.cs2_color.pointing.menu .active.item:after {
  background-color: #ffdd60;
}

/*-------------------
       Colors
--------------------*/

i.cs2_color.basic.icon {
  color: #ffdd60 !important;
}

/*-------------------
   Inverted Colors
--------------------*/

i.inverted.cs2_color.basic.icon {
  background-color: #ffdd60 !important;
  color: #FFFFFF !important;
}

/*-------------------
       Colors
--------------------*/

/*--- cs2_color ---*/

.ui.cs2_color.buttons .button,
.ui.cs2_color.button {
  background-color: #ffdd60;
  color: #FFFFFF;
}

.ui.cs2_color.buttons .button:hover,
.ui.cs2_color.button:hover,
.ui.cs2_color.buttons .active.button,
.ui.cs2_color.button.active {
  background-color: #ffce19;
  color: #FFFFFF;
}

.ui.cs2_color.buttons .button:active,
.ui.cs2_color.button:active {
  background-color: #e6b917;
  color: #FFFFFF;
}

/*******************************
            Header
*******************************/

/*-------------------
       Colors
--------------------*/

.ui.cs2_color.header {
  color: #ffdd60 !important;
}

.ui.cs2_color.dividing.header {
  border-bottom: 3px solid #ffdd60;
}

/*-------------------
   Inverted Colors
--------------------*/

.ui.inverted.cs2_color.header {
  background-color: #ffdd60 !important;
  color: #FFFFFF !important;
}

/*******************************
             Icon
*******************************/

/*-------------------
       Colors
--------------------*/
i.cs2_color.icon {
  color: #ffdd60 !important;
}

/*-------------------
   Inverted Colors
--------------------*/

i.inverted.cs2_color.icon {
  background-color: #ffdd60 !important;
  color: #FFFFFF !important;
}

/*******************************
            Label
*******************************/

/*-------------------
       Colors
--------------------*/

/*--- cs2_color ---*/

.ui.cs2_color.labels .label,
.ui.cs2_color.label {
  background-color: #ffdd60 !important;
  border-color: #ffdd60 !important;
  color: #FFFFFF !important;
}

.ui.labels .cs2_color.label:before,
.ui.cs2_color.labels .label:before,
.ui.cs2_color.label:before {
  background-color: #ffdd60 !important;
}

/* Hover */

a.ui.cs2_color.labels .label:hover,
.ui.cs2_color.labels a.label:hover,
a.ui.cs2_color.label:hover {
  background-color: #ffce19 !important;
  border-color: #ffce19 !important;
  color: #FFFFFF !important;
}

.ui.labels a.cs2_color.label:hover:before,
.ui.cs2_color.labels a.label:hover:before,
a.ui.cs2_color.label:hover:before {
  background-color: #ffce19 !important;
}

/* Corner */

.ui.cs2_color.corner.label,
.ui.cs2_color.corner.label:hover {
  background-color: transparent !important;
}

/* Ribbon */

.ui.cs2_color.ribbon.label {
  border-color: #ffce19 !important;
}

/*******************************
         Progress Bar
*******************************/

/*--------------
     Colors
---------------*/

.ui.cs2_color.progress .bar {
  background-color: #ffdd60;
}

/*******************************
            Segment
*******************************/

/*--------------
     Colors
---------------*/

.ui.cs2_color.segment {
  border-top: 0.2em solid #ffdd60;
}

/*-------------------
   Inverted Colors
--------------------*/

.ui.inverted.cs2_color.segment {
  background-color: #ffdd60 !important;
  color: #FFFFFF !important;
}

