DavesWF-mod.css

[title~="#em1"] {
    background-color: red !important;
	color: #ffffff !important;
    box-shadow: 3px 3px 3px #424242;
    padding: 2px 3px 2px !important;
}

[title~="#em2"] {
    background-color: yellow !important;
	color: black !important;
    box-shadow: 3px 3px 3px #424242;
    padding: 2px 3px 2px !important;
}

[title~="#em3"] {
    background-color:green !important;
	color: #ffffff !important;
    box-shadow: 3px 3px 3px #424242;
    padding: 2px 3px 2px !important;
}

[title~="#em4"] {
    background-color: black !important;
	color: #ffffff !important;
    box-shadow: 3px 3px 3px #424242;
    padding: 2px 3px 2px !important;
}

[title~="#nextsechedule"] {
    background-color: #355C7D !important;
	color: #ffffff !important;
    box-shadow: 3px 3px 3px #424242;
    padding: 2px 3px 2px !important;
}

[title~="#idocsProgram"] {
    background-color: CadetBlue !important;
	color: #ffffff !important;
    box-shadow: 3px 3px 3px #424242;
    padding: 2px 3px 2px !important;
}

[title~="@plummer"] {
    background-color: SeaGreen !important;
	color: #ffffff !important;
    box-shadow: 3px 3px 3px #424242;
    padding: 2px 3px 2px !important;
}

[title~="@tag8"] {
    background-color: CornflowerBlue !important;
	color: #ffffff !important;
    box-shadow: 3px 3px 3px #424242;
    padding: 2px 3px 2px !important;
}


/* Truncate a link when not hovered. */
.content .contentLink:not(:hover), .nameAnimated .contentLink:not(:hover) {
max-width: 50px !important;
overflow: hidden;
text-overflow: ellipsis;
vertical-align: bottom; 
white-space: nowrap;
display: inline-block !important;
}


/* Bold top level item... */
  div.project.selected > div.children > div > div.name div.content {
    font-weight: bold;
    font-size: 16px;
    padding-bottom: 2px;
  }
  /* ...except for tags */
  div.project.selected > div.children > div > div.name div.content .contentTag {
    font-weight: normal;
  }


/*full width*/

body {
        background: #FFF !important;
    }
    #pageContainer {
        margin-top: 24px;
    }
    .page {
        max-width: 80% !important;
        border: none !important;
        margin-bottom: 0 !important;
        padding: 10px 60px !important;
        /* fix for dynamic positioning of the .page div */
        transform: none !important;
        width: auto !important;
    }
    /* Remove the "Get more space" top left link so it does not interfere */
    .getMoreSpaceButton {
        display: none;
    }

/* cool date tags*/
.contentTag[title*="today"] {
  background-color: #FFC800 !important;
  color: black;
}
.contentTag[title*="today"]::after {
  content: " \25b6";
  position: relative;
  top: -0.15em;
}

.contentTag[title*="tomorrow"] {
  background-color: #FFE800 !important;
  color: black;
}
.contentTag[title*="tomorrow"]::after {
  content: " \23e9";
  position: relative;
  top: -0.15em;
}

.contentTag[title*="sunday"],
.contentTag[title*="monday"],
.contentTag[title*="tuesday"],
.contentTag[title*="wednesday"],
.contentTag[title*="thursday"],
.contentTag[title*="friday"],
.contentTag[title*="saturday"]{
  background-color: #D6E800 !important;
  color: black;
}

.contentTag[title*="sunday"]::after,
.contentTag[title*="monday"]::after,
.contentTag[title*="tuesday"]::after,
.contentTag[title*="wednesday"]::after,
.contentTag[title*="thursday"]::after,
.contentTag[title*="friday"]::after,
.contentTag[title*="saturday"]::after {
  content: " \1f4c6";
  position: relative;
  top: -0.05em;
  font-weight: normal;
}




/* .contentTag[title^="Filter #every0"], */
.contentTag[title^="Filter #every1"],
.contentTag[title^="Filter #every2"],
.contentTag[title^="Filter #every3"],
.contentTag[title^="Filter #every4"],
.contentTag[title^="Filter #every5"],
.contentTag[title^="Filter #every6"],
.contentTag[title^="Filter #every7"],
.contentTag[title^="Filter #every8"],
.contentTag[title^="Filter #every9"],
.contentTag[title*="201"], .contentTag[title*="202"] {
  background-color: #B2E800 !important;
  color: black;
}
/* .contentTag[title^="Filter #every0"]::after, */
.contentTag[title^="Filter #every1"]::after,
.contentTag[title^="Filter #every2"]::after,
.contentTag[title^="Filter #every3"]::after,
.contentTag[title^="Filter #every4"]::after,
.contentTag[title^="Filter #every5"]::after,
.contentTag[title^="Filter #every6"]::after,
.contentTag[title^="Filter #every7"]::after,
.contentTag[title^="Filter #every8"]::after,
.contentTag[title^="Filter #every9"]::after,
.contentTag[title*="201"]::after, .contentTag[title*="202"]::after {
  content: " \1f4c5";
  position: relative;
  top: -0.05em;
  font-weight: normal;
}


/*fasder in/out*/
@media screen {
  .noted                 > .notes > .content,
  /* The next two are for compatibility with my "Fade out completed items" style - this must be more specific */
  .noted.done            > .notes > .content,
  .noted.doneAppearance  > .notes > .content {
    opacity: 0.2;
  }
  
  .noted > .notes > .content:focus,
  .noted > .notes > .content:hover {
    opacity: 1;
  }
}

/*Bullet Charater*/
   
    /*BULLETS*/

    .bullet, #bulletBucket .bulletBucketBullet {

    height: 18px;

    width: 18px;

    background-color: cyan;

    border-radius: 12px;

}
    
.project.shared > .name > .bullet {
    background-color: cyan;
}


/**** MISC ******/
   /* set main font for notes and notes editor */
    DIV.noteEditor TEXTAREA,
    DIV.notes DIV.content {
        /*font-family: 'Segoe UI' !important;*/
        font-size: 11px !important;
        font-weight: normal;
        color: #0C86AB !important;
    }
    
    DIV.notes DIV.content {
        margin: 0 0 0 18px !important;
        padding: 0 0 0 12px !important;
        border-left: 1px dashed green !important;
        width: 100% !important;
    }
    
 
    
    /* Show full notes */
    /*DIV.notes DIV.content {
        height: auto !important;
        overflow: visible !important;
    }*/
    
 
    
    /* Outer border, set to none */
    #workflowy > DIV.children {
        border-left:none !important;
    }
    
    /* border of each child... I've set to none, but you can add this back in */
    DIV.children {
        border-left:none !important;
    }