/* this CSS is not part of the widget, it is here just as an example of the demo page styling.... Don't copy this one, roll your own. One
 * of the key things about the widget is that it allows you to do your own styling!
 */

.editor-container {
   background-color: #CEE0F5;
}

div[id*="editor"] {
   max-height: 250px;
   height: 250px;
   background-color: white;
   border-collapse: separate;
   border: 1px solid rgb(204, 204, 204);
   padding: 4px;
   box-sizing: content-box;
   -webkit-box-shadow: rgba(0, 0, 0, 0.0745098) 0px 1px 1px 0px inset;
   box-shadow: rgba(0, 0, 0, 0.0745098) 0px 1px 1px 0px inset;
   border-top-right-radius: 3px;
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
   border-top-left-radius: 3px;
   overflow: scroll;
   outline: none;
   text-align: left;
}

div[id*="editor"] b {
   display: inline !important;
}

div[data-role="editor-toolbar"] {
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

.dropdown-menu a {
   cursor: pointer;
}