body{
    background-color: #1D2A38;
    color: #93C3C5;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1d2a38+0,46505b+100 */
    background: #1d2a38; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #1d2a38 0%, #46505b 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #1d2a38 0%,#46505b 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #1d2a38 0%,#46505b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1d2a38', endColorstr='#46505b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
input.form-control {
    background-color: #DDD;
    color: #333;
}
input.form-control:focus {
    box-shadow: 0px 0px 5px #CBEFF3;
    background-color: #FFF;
    border-color: white;
}
button.btn.btn-default {
    background-color: rgba(255,255,255,0.05);
    color: white;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
    border-color: rgba(255,255,255,0.1);
    text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
    border-left: 3px solid #1BA543;
}
.alert-danger {
    color: #D89D9C;
    background-color: rgba(255, 0, 0, 0.1);
    border-color: rgba(235, 204, 209, 0.5);
}
.panel.panel-default {
    background-color: rgba(0,0,0,0.3);
    border-color: #50676D;
    border-radius: 2px;
    box-shadow: 2px 2px 7px rgba(0,0,0,0.5);
}
.panel-default>.panel-heading {
    background-color: rgba(0,0,0,0.3);
    border-color: #50676D;
    color: white;
}
.control-buttons-panel {
    border-right: 1px solid #50676D;
}
.row.row-edicion {
    border-left: 1px solid #50676D;
}
.control-button .fa {
    color: #7A8788;
    text-shadow: 1px 1px 0px black;
}
.light-panel.error {
    background-color: rgba(202, 85, 119, 0.2);
    box-shadow: 0px 0px 10px rgba(255, 0, 0, 0.5);
}
.plane-component-floating.active.light,
.light-panel.active i,
.plane-section i.active {
    color: white;
    text-shadow: 1px 1px 15px #FFE661;
}
.light-panel.active span {
    color: #E0E8E8;
}
.heat-panel.active,
.light-panel.active {
    background-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0px 0px 10px rgba(255,255,0,0.5);
}
.plane-component-floating.active i.fa-fire, 
.heat-panel.active i,
.plane-section i.fa-fire.active {
    color: white;
    text-shadow: 0px 0px 15px #FF4343;
}
.control-button.active {
    border-left: 4px solid #1BA543;
    background-color: rgba(102, 140, 183, 0.1);
    box-shadow: 1px 0px 0px rgba(27, 165, 67, 0.57) inset;
}
.control-button.active .fa {
    color: white;
    text-shadow: 2px 2px 1px black;
}
@media (max-width:767px){
    .control-buttons-panel{
        border-bottom: 1px solid #50676D;
    }
}
.loading-icon {
    text-shadow: 0px 0px 10px rgba(255,255,255,0.5);
    color: rgba(73, 125, 111, 0.8);
}
.categorie-work-header,
.plane-work-header {
    color: #666;
    background-color: #222;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#111111+0,222222+100 */
    background: #111111; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #111111 0%, #222222 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #111111 0%,#222222 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #111111 0%,#222222 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#111111', endColorstr='#222222',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.plane-work-header{
    border-bottom: 5px solid #1A1C1F;
}
.categorie-work-header .active,
.plane-work-header .active {
    color: #DDD;
    text-shadow: 2px 2px 1px black;
}
hr {
    border-top-color: #50676D;
}
.plane-component-floating {
    text-shadow: 1px 1px 2px black;
}
.plane-section {
    background: url(/home/public/img/gridbg_glow.png);
    background-color: rgba(0,0,0,0.2);
}
/* -------------------------------------------------------------- VERTICAL MENU -------------------------------------------------------------- */
header#top {
    border-bottom: 1px solid #092134;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#02111e+0,102f47+100 */
    background: #02111e; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #02111e 0%, #102f47 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #02111e 0%,#102f47 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #02111e 0%,#102f47 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#02111e', endColorstr='#102f47',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.block-title {
    color: #798687;
    text-shadow: 1px 1px 3px black;
}
#top .nav-btn {
    color: #AFAFAF;
    text-shadow: 1px 1px 1px black;
}
.close-btn {
    color: white;
    text-shadow: 1px 1px 1px black;
}
#nav li.is-active a {
    background-color: #444;
}
img.avatar {
    border: 3px solid #C5C5C5;
    box-shadow: 2px 2px 7px black;
}
.only-menu span {
    text-shadow: 1px 1px 1px black;
}
.user-faction i.selected {
    opacity: 1;
    text-shadow: 2px 2px 3px #000;
    color: #1AA442;
}
.control-button:hover {
    color: #DDD;
}
.heat-panel i,
.light-panel i,
.heat-working-panel i,
.light-working-panel i {
    color: #555;
}
.heats-seemore i,
.lights-seemore i{
    color: #93C3C5;
}
.btn-temperature-validate i.fa,
.btn-color-validate i.fa {
    color: #93C5AC;
    text-shadow: 2px 2px 1px black;
}
.btn-heat-validate i.fa,
.btn-heat-remove i.fa,
.btn-light-validate i.fa,
.btn-light-remove i.fa{
    color: #93C5AC;
    text-shadow: 2px 2px 1px black;
}
.btn-heat-remove i.fa,
.btn-light-remove i.fa{
    color: #C59393;
}
.saved .heat-icon i,
.saved .light-icon i {
    color: #D3E4FF;
}

/* --------------------------------------------------------------- COLOR TOGGLE --------------------------------------------------------------- */

input.jscolor {
    box-shadow: 2px 2px 1px rgba(0,0,0,0.5);
}
input.cmn-toggle-round + label {
    background-color: #999;
}
input.cmn-toggle-round + label:before {
    background-color: #999;
}
input.cmn-toggle-round + label:after {
    background-color: #FFF;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 1);
}
input.cmn-toggle-round:checked + label:before {
    background-color: #5DC56A;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.2) inset;
}