.text-bold {
    font-weight: bold;
}

.color1 {
     color: #f44336;
}
.color2 {
     color:  #e91e63;
}
.color3 {
     color:  #9c27b0;
}
.color4 {
     color: #673ab7;
}
.color5 {
     color:  #3f51b5;
}
.color6 {
     color:  #2196f3;
}
.color7 {
     color:  #03a9f4;
}
.color8 {
     color:  #00bcd4;
}
.color9 {
     color:  #009688;
}
.color10 {
     color:  #4caf50;
}
.color11 {
     color:  #8bc34a;
}
.color12 {
     color:  #cddc39;
}
.color13 {
     color:  #ffeb3b;
}
.color14 {
     color:  #ffc107;
}
.color15 {
     color:  #ff9800;
}
.color16 {
     color:  #ff5722;
}
.color17 {
     color:  #795548;
}
.color18 {
     color:  #9e9e9e;
}
.color19 {
     color:  #607d8b;
}

.sexuality-bg,
.sexuality-bg.md-button.md-fab:not([disabled]):hover,
.sexuality-bg.md-button.md-fab{
    background-color:  #e91e63;
}
.life-bg,
.life-bg.md-button.md-fab:not([disabled]):hover,
.life-bg.md-button.md-fab{
    background-color: #f44336;
}
.healing-bg,
.healing-bg.md-button.md-fab:not([disabled]):hover,
.healing-bg.md-button.md-fab{
    background-color:  #ff9800;
}
.sunlight-bg,
.sunlight-bg.md-button.md-fab:not([disabled]):hover,
.sunlight-bg.md-button.md-fab{
    background-color:  #ffeb3b;
}
.nature-bg,
.nature-bg.md-button.md-fab:not([disabled]):hover,
.nature-bg.md-button.md-fab{
    background-color:  #4caf50;
}
.art-bg,
.art-bg.md-button.md-fab:not([disabled]):hover,
.art-bg.md-button.md-fab{
    background-color: #00ffef;
}
.harmony-bg,
.harmony-bg.md-button.md-fab:not([disabled]):hover,
.harmony-bg.md-button.md-fab{
    background-color: #3f51b5;
}
.spirit-bg,
.spirit-bg.md-button.md-fab:not([disabled]):hover,
.spirit-bg.md-button.md-fab{
    background-color:  #9c27b0;
}

.pink,
.sexuality {
     color:  #e91e63 !important;
}
.red,
.life {
    color: #f44336 !important;
}
.orange,
.healing {
    color:  #ff9800 !important;
}
.yellow,
.sunlight {
    color:  #ffeb3b !important;
    text-shadow: 1px 1px #bbb;
}
.green,
.nature {
    color:  #4caf50 !important;
}
.turquoise,
.art {
    color: #00ffef !important;
    text-shadow: 1px 1px #bbb;
}
.indigo,
.harmony {
    color: #3f51b5 !important;
}
.violet,
.spirit {
    color:  #9c27b0 !important;
}

.md-button.md-fab.md-mini {
  line-height: 25px;
  width: 25px;
  height: 25px;
  min-height: 25px;
}
/* Define two variables as the loop limits */
md-fab-actions .md-button {
  position: absolute;
  bottom: 17px;
  left: 17px;
}
#color-0 {
  -webkit-transform: rotate(75deg) translate(0px) rotate(-75deg) scale(0);
  -moz-transform: rotate(75deg) translate(0px) rotate(-75deg) scale(0);
  -o-transform: rotate(75deg) translate(0px) rotate(-75deg) scale(0);
  transform: rotate(75deg) translate(0px) rotate(-75deg) scale(0);
}
.md-is-open #color-0 {
  -webkit-transform: rotate(75deg) translate(55.8px) rotate(-75deg) scale(1);
  -moz-transform: rotate(75deg) translate(55.8px) rotate(-75deg) scale(1);
  -o-transform: rotate(75deg) translate(55.8px) rotate(-75deg) scale(1);
  transform: rotate(75deg) translate(55.8px) rotate(-75deg) scale(1);
  transition-delay: 0s !important;
}
#color-1 {
  -webkit-transform: rotate(105deg) translate(0px) rotate(-105deg) scale(0);
  -moz-transform: rotate(105deg) translate(0px) rotate(-105deg) scale(0);
  -o-transform: rotate(105deg) translate(0px) rotate(-105deg) scale(0);
  transform: rotate(105deg) translate(0px) rotate(-105deg) scale(0);
}
.md-is-open #color-1 {
  -webkit-transform: rotate(105deg) translate(55.8px) rotate(-105deg) scale(1);
  -moz-transform: rotate(105deg) translate(55.8px) rotate(-105deg) scale(1);
  -o-transform: rotate(105deg) translate(55.8px) rotate(-105deg) scale(1);
  transform: rotate(105deg) translate(55.8px) rotate(-105deg) scale(1);
  transition-delay: 0.025s !important;
}
#color-2 {
  -webkit-transform: rotate(135deg) translate(0px) rotate(-135deg) scale(0);
  -moz-transform: rotate(135deg) translate(0px) rotate(-135deg) scale(0);
  -o-transform: rotate(135deg) translate(0px) rotate(-135deg) scale(0);
  transform: rotate(135deg) translate(0px) rotate(-135deg) scale(0);
}
.md-is-open #color-2 {
  -webkit-transform: rotate(135deg) translate(55.8px) rotate(-135deg) scale(1);
  -moz-transform: rotate(135deg) translate(55.8px) rotate(-135deg) scale(1);
  -o-transform: rotate(135deg) translate(55.8px) rotate(-135deg) scale(1);
  transform: rotate(135deg) translate(55.8px) rotate(-135deg) scale(1);
  transition-delay: 0.05s !important;
}
#color-3 {
  -webkit-transform: rotate(165deg) translate(0px) rotate(-165deg) scale(0);
  -moz-transform: rotate(165deg) translate(0px) rotate(-165deg) scale(0);
  -o-transform: rotate(165deg) translate(0px) rotate(-165deg) scale(0);
  transform: rotate(165deg) translate(0px) rotate(-165deg) scale(0);
}
.md-is-open #color-3 {
  -webkit-transform: rotate(165deg) translate(55.8px) rotate(-165deg) scale(1);
  -moz-transform: rotate(165deg) translate(55.8px) rotate(-165deg) scale(1);
  -o-transform: rotate(165deg) translate(55.8px) rotate(-165deg) scale(1);
  transform: rotate(165deg) translate(55.8px) rotate(-165deg) scale(1);
  transition-delay: 0.075s !important;
}
#color-4 {
  -webkit-transform: rotate(195deg) translate(0px) rotate(-195deg) scale(0);
  -moz-transform: rotate(195deg) translate(0px) rotate(-195deg) scale(0);
  -o-transform: rotate(195deg) translate(0px) rotate(-195deg) scale(0);
  transform: rotate(195deg) translate(0px) rotate(-195deg) scale(0);
}
.md-is-open #color-4 {
  -webkit-transform: rotate(195deg) translate(55.8px) rotate(-195deg) scale(1);
  -moz-transform: rotate(195deg) translate(55.8px) rotate(-195deg) scale(1);
  -o-transform: rotate(195deg) translate(55.8px) rotate(-195deg) scale(1);
  transform: rotate(195deg) translate(55.8px) rotate(-195deg) scale(1);
  transition-delay: 0.1s !important;
}
#color-5 {
  -webkit-transform: rotate(225deg) translate(0px) rotate(-225deg) scale(0);
  -moz-transform: rotate(225deg) translate(0px) rotate(-225deg) scale(0);
  -o-transform: rotate(225deg) translate(0px) rotate(-225deg) scale(0);
  transform: rotate(225deg) translate(0px) rotate(-225deg) scale(0);
}
.md-is-open #color-5 {
  -webkit-transform: rotate(225deg) translate(55.8px) rotate(-225deg) scale(1);
  -moz-transform: rotate(225deg) translate(55.8px) rotate(-225deg) scale(1);
  -o-transform: rotate(225deg) translate(55.8px) rotate(-225deg) scale(1);
  transform: rotate(225deg) translate(55.8px) rotate(-225deg) scale(1);
  transition-delay: 0.125s !important;
}
#color-6 {
  -webkit-transform: rotate(255deg) translate(0px) rotate(-255deg) scale(0);
  -moz-transform: rotate(255deg) translate(0px) rotate(-255deg) scale(0);
  -o-transform: rotate(255deg) translate(0px) rotate(-255deg) scale(0);
  transform: rotate(255deg) translate(0px) rotate(-255deg) scale(0);
}
.md-is-open #color-6 {
  -webkit-transform: rotate(255deg) translate(55.8px) rotate(-255deg) scale(1);
  -moz-transform: rotate(255deg) translate(55.8px) rotate(-255deg) scale(1);
  -o-transform: rotate(255deg) translate(55.8px) rotate(-255deg) scale(1);
  transform: rotate(255deg) translate(55.8px) rotate(-255deg) scale(1);
  transition-delay: 0.15s !important;
}
#color-7 {
  -webkit-transform: rotate(285deg) translate(0px) rotate(-285deg) scale(0);
  -moz-transform: rotate(285deg) translate(0px) rotate(-285deg) scale(0);
  -o-transform: rotate(285deg) translate(0px) rotate(-285deg) scale(0);
  transform: rotate(285deg) translate(0px) rotate(-285deg) scale(0);
}
.md-is-open #color-7 {
  -webkit-transform: rotate(285deg) translate(55.8px) rotate(-285deg) scale(1);
  -moz-transform: rotate(285deg) translate(55.8px) rotate(-285deg) scale(1);
  -o-transform: rotate(285deg) translate(55.8px) rotate(-285deg) scale(1);
  transform: rotate(285deg) translate(55.8px) rotate(-285deg) scale(1);
  transition-delay: 0.175s !important;
}
#color-8 {
  -webkit-transform: rotate(315deg) translate(0px) rotate(-315deg) scale(0);
  -moz-transform: rotate(315deg) translate(0px) rotate(-315deg) scale(0);
  -o-transform: rotate(315deg) translate(0px) rotate(-315deg) scale(0);
  transform: rotate(315deg) translate(0px) rotate(-315deg) scale(0);
}
.md-is-open #color-8 {
  -webkit-transform: rotate(315deg) translate(55.8px) rotate(-315deg) scale(1);
  -moz-transform: rotate(315deg) translate(55.8px) rotate(-315deg) scale(1);
  -o-transform: rotate(315deg) translate(55.8px) rotate(-315deg) scale(1);
  transform: rotate(315deg) translate(55.8px) rotate(-315deg) scale(1);
  transition-delay: 0.2s !important;
}
#color-9 {
  -webkit-transform: rotate(345deg) translate(0px) rotate(-345deg) scale(0);
  -moz-transform: rotate(345deg) translate(0px) rotate(-345deg) scale(0);
  -o-transform: rotate(345deg) translate(0px) rotate(-345deg) scale(0);
  transform: rotate(345deg) translate(0px) rotate(-345deg) scale(0);
}
.md-is-open #color-9 {
  -webkit-transform: rotate(345deg) translate(55.8px) rotate(-345deg) scale(1);
  -moz-transform: rotate(345deg) translate(55.8px) rotate(-345deg) scale(1);
  -o-transform: rotate(345deg) translate(55.8px) rotate(-345deg) scale(1);
  transform: rotate(345deg) translate(55.8px) rotate(-345deg) scale(1);
  transition-delay: 0.225s !important;
}
#color-10 {
  -webkit-transform: rotate(375deg) translate(0px) rotate(-375deg) scale(0);
  -moz-transform: rotate(375deg) translate(0px) rotate(-375deg) scale(0);
  -o-transform: rotate(375deg) translate(0px) rotate(-375deg) scale(0);
  transform: rotate(375deg) translate(0px) rotate(-375deg) scale(0);
}
.md-is-open #color-10 {
  -webkit-transform: rotate(375deg) translate(55.8px) rotate(-375deg) scale(1);
  -moz-transform: rotate(375deg) translate(55.8px) rotate(-375deg) scale(1);
  -o-transform: rotate(375deg) translate(55.8px) rotate(-375deg) scale(1);
  transform: rotate(375deg) translate(55.8px) rotate(-375deg) scale(1);
  transition-delay: 0.25s !important;
}
#color-11 {
  -webkit-transform: rotate(405deg) translate(0px) rotate(-405deg) scale(0);
  -moz-transform: rotate(405deg) translate(0px) rotate(-405deg) scale(0);
  -o-transform: rotate(405deg) translate(0px) rotate(-405deg) scale(0);
  transform: rotate(405deg) translate(0px) rotate(-405deg) scale(0);
}
.md-is-open #color-11 {
  -webkit-transform: rotate(405deg) translate(55.8px) rotate(-405deg) scale(1);
  -moz-transform: rotate(405deg) translate(55.8px) rotate(-405deg) scale(1);
  -o-transform: rotate(405deg) translate(55.8px) rotate(-405deg) scale(1);
  transform: rotate(405deg) translate(55.8px) rotate(-405deg) scale(1);
  transition-delay: 0.275s !important;
}
.fabSpeedDialCircle .text-capitalize {
  text-transform: capitalize;
}
.fabSpeedDialCircle .md-fab:hover,
.fabSpeedDialCircle .md-fab.md-focused {
  background-color: #ccc !important;
}
.fabSpeedDialCircle .lock-size {
  min-width: 300px;
  min-height: 300px;
  width: 300px;
  height: 300px;
  margin-left: auto;
  margin-right: auto;
}
md-fab-trigger {
  z-index: 100;
}
md-fab-actions {
  z-index: 50;
}
ng-md-icon {
  display: block;
}
ng-md-icon svg {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.menu-icon,
.close-icon {
  position: absolute;
  top: 10px;
  left: 10px;
  transition: all 0.3s ease-in-out;
  opacity: 1;
  transform: scale(1);
}
.close-icon {
  opacity: 0;
  transform: scale(0);
}
.md-is-open .menu-icon {
  opacity: 0;
  transform: scale(0);
}
.md-is-open .close-icon {
  opacity: 1;
  transform: scale(1);
}