.wysihtml5-toolbar button .swatch
{
float:left;
width:12px;
height:12px;
margin:2px;
}

.wysihtml5-toolbar .buttonGroup.readingLevels .wysihtml5-action-active,
.wysihtml5-toolbar .buttonGroup.readingLevels .wysihtml5-command-active 
{
  color:#ffffff;
  box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.2);
  background: #ddccbb !important;
}


.wysihtml5-toolbar [data-wysihtml5-action] {
float:left;
background-color:#eeeeee;
}

.wysihtml5-toolbar div.buttonGroup
{
float:left;
margin:0px 4px 4px 0px;
padding:3px 1px 3px 3px;
background-color:#333344;
-webkit-border-radius:6px;
-moz-border-radius:6px;
-webkit-box-shadow: #666666 1px 1px 4px;
-moz-box-shadow: #666666 1px 1px 4px;
}

.wysihtml5-toolbar .buttonGroup.readingLevels
{
background-color:#ffffee;
margin-right:20px;
}

.wysihtml5-toolbar .buttonGroup.readingLevels button
{
color:#555555;
background-color:#ffffee;
font-size:11px;
}


.wysihtml5-toolbar button
{
display:block;
color:#cccccc;
font-weight:bold;
margin:0px 2px 0px 0px;
float:left;
font-size:14px;
background-color:#333344;
border-color:#cccccc;
border-width:0px 1px 0px 0px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
padding:1px 6px;
}

.wysihtml5-action-active,
.wysihtml5-command-active {
color:#ffffff;
box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.2);
background: #666677 !important;
}

[data-wysihtml5-dialog] {
color: #333;
font-size: 14px;
text-align: left;
border-radius: 4px;
-ms-box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #ccc;
padding: 5px 10px;
background: #ccccdd;
position: fixed;
width: 510px;
text-align: center;
top: 45px;
z-index:100;
}

[data-wysihtml5-dialog]
{
position:relative;
z-index:20;
margin:auto;
}

[data-wysihtml5-dialog] input {
color: #333;
border: 1px solid #ccc;
padding: 3px;
width: 300px;
}

[data-wysihtml5-dialog] input:focus {
outline: 0;
border: 1px solid #666;
}

[data-wysihtml5-dialog-action] {

padding: 4px;
color: #fff;
cursor: pointer;
}


[data-wysihtml5-dialog] {
margin: 5px 0 0;
padding: 5px;
border: 1px solid #666;
}

a[data-wysihtml5-command-value="red"] {
color: red;
}

a[data-wysihtml5-command-value="green"] {
color: green;
}

a[data-wysihtml5-command-value="blue"] {
color: blue;
}


.wysiwyg-font-size-smaller {
font-size: smaller;
}

.wysiwyg-font-size-larger {
font-size: larger;
}

.wysiwyg-font-size-xx-large {
font-size: xx-large;
}

.wysiwyg-font-size-x-large {
font-size: x-large;
}

.wysiwyg-font-size-large {
font-size: large;
}

.wysiwyg-font-size-medium {
font-size: medium;
}

.wysiwyg-font-size-small {
font-size: small;
}

.wysiwyg-font-size-x-small {
font-size: x-small;
}

.wysiwyg-font-size-xx-small {
font-size: xx-small;
}

.wysiwyg-color-black {
color: black;
}

.wysiwyg-color-silver {
color: silver;
}

.wysiwyg-color-gray {
color: gray;
}

.wysiwyg-color-white {
color: white;
}

.wysiwyg-color-maroon {
color: maroon;
}

.wysiwyg-color-red {
color: red;
}

.wysiwyg-color-purple {
color: purple;
}

.wysiwyg-color-fuchsia {
color: fuchsia;
}

.wysiwyg-color-green {
color: green;
}

.wysiwyg-color-lime {
color: lime;
}

.wysiwyg-color-olive {
color: olive;
}

.wysiwyg-color-yellow {
color: yellow;
}

.wysiwyg-color-navy {
color: navy;
}

.wysiwyg-color-blue {
color: blue;
}

.wysiwyg-color-teal {
color: teal;
}

.wysiwyg-color-aqua {
color: aqua;
}

.wysiwyg-text-align-right {
text-align: right;
}

.wysiwyg-text-align-center {
text-align: center;
}

.wysiwyg-text-align-left {
text-align: left;
}

.wysiwyg-float-left {
float: left;
margin: 0 8px 8px 0;
}

.wysiwyg-float-right {
float: right;
margin: 0 0 8px 8px;
}

.wysiwyg-clear-right {
clear: right;
}

.wysiwyg-clear-left {
clear: left;
}


.wysiwyg-color-highlight-yellow {
background-color:#ffff55;
}

.wysiwyg-color-highlight-green {
background-color:#55ff00;
}

.wysiwyg-color-highlight-blue {
background-color:#88aaff;
}



/* FROM WYSIHTML5 HOMEPAGE 

html {
overflow: hidden;
background: url(../img/bg_pattern_r1.png);
height: 100%;
}

body {
width: 810px;
min-height: 100%;
margin: 0 auto;
}

body, textarea, input {
font-family: Helvetica, Arial, Verdana;
}

strong {
font-weight: bold;
}

.get-started {
margin: 20px 0;
color: #666;
font-size: 11px;
text-align: center;
}

.get-started a {
color: #666;
}

#wysihtml5-editor-toolbar {
position: relative;
}

header {
display: block;
border-radius: 4px;
width: 810px;
background: #eee;
position: relative;
z-index: 1;
text-align: center;
background-image: linear-gradient(bottom, rgb(238,238,238) 0%, rgb(255,255,255) 100%);
background-image: -o-linear-gradient(bottom, rgb(238,238,238) 0%, rgb(255,255,255) 100%);
background-image: -moz-linear-gradient(bottom, rgb(238,238,238) 0%, rgb(255,255,255) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(238,238,238) 0%, rgb(255,255,255) 100%);
background-image: -ms-linear-gradient(bottom, rgb(238,238,238) 0%, rgb(255,255,255) 100%);
box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.3);
font-size: 0;
text-align: center;
}

.commands {
border-left: 1px solid #ddd;
display: inline-block;
}

[data-wysihtml5-command],
[data-wysihtml5-action],
.fore-color {
position: relative;
border-right: 1px solid #ddd;
border-left: 1px solid #fff;
list-style: none;
font-size: 12px;
display: inline-block;
cursor: pointer;
height: 40px;
width: 68px;
}

[data-wysihtml5-command]::after,
[data-wysihtml5-action]::after,
.fore-color::after {
content: "";
background-image: url(../img/spr_toolbar_icons_r1.png);
background-repeat: no-repeat;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}

[data-wysihtml5-command]:hover,
[data-wysihtml5-action]:hover,
.fore-color:hover {
background-image: linear-gradient(bottom, rgb(229,240,226) 0%, rgb(255,255,255) 100%);
background-image: -o-linear-gradient(bottom, rgb(229,240,226) 0%, rgb(255,255,255) 100%);
background-image: -moz-linear-gradient(bottom, rgb(229,240,226) 0%, rgb(255,255,255) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(229,240,226) 0%, rgb(255,255,255) 100%);
background-image: -ms-linear-gradient(bottom, rgb(229,240,226) 0%, rgb(255,255,255) 100%);
}

[data-wysihtml5-command="bold"]::after {
background-position: 24px center;
}

[data-wysihtml5-command="italic"]::after {
background-position: -48px center;
}

[data-wysihtml5-command="insertUnorderedList"]::after {
background-position: -115px center;
}

[data-wysihtml5-command="insertOrderedList"]::after {
background-position: -197px center;
}

[data-wysihtml5-command="formatBlock"][data-wysihtml5-command-value="h1"]::after {
background-position: -344px center;
}

[data-wysihtml5-command="formatBlock"][data-wysihtml5-command-value="h2"]::after {
background-position: -428px center;
}

[data-wysihtml5-command="createLink"]::after {
background-position: -271px center;
}

[data-wysihtml5-command="insertImage"]::after {
background-position: -513px center;
}

.fore-color::after {
background-position: -741px center;
}

[data-wysihtml5-command="insertSpeech"]::after {
background-position: -596px center;
}

[data-wysihtml5-action="change_view"]::after {
background-position: -670px center;
}

.fore-color ul {
display: none;
position: absolute;
z-index: 2;
top: 40px;
right: -1px;
left: -2px;
border: 1px solid #ccc;
border-top: 0;
background: #fff;
overflow: hidden;
}

.fore-color li {
display: block;
margin: 3px;
width: auto;
border: 0;
height: 15px;
}

.fore-color li::after {
display: none;
}

.fore-color:hover ul {
display: block;
}

.fore-color [data-wysihtml5-command-value="silver"] {
background: silver !important;
}


.fore-color [data-wysihtml5-command-value="gray"] {
background: gray !important;
}

.fore-color [data-wysihtml5-command-value="maroon"] {
background: maroon !important;
}

.fore-color [data-wysihtml5-command-value="red"] {
background: red !important;
}

.fore-color [data-wysihtml5-command-value="purple"] {
background: purple !important;
}

.fore-color [data-wysihtml5-command-value="green"] {
background: green !important;
}

.fore-color [data-wysihtml5-command-value="olive"] {
background: olive !important;
}

.fore-color [data-wysihtml5-command-value="navy"] {
background: navy !important;
}

.fore-color [data-wysihtml5-command-value="blue"] {
background: blue !important;
}

.fore-color .wysihtml5-command-active {
outline: 1px solid #666;
outline-offset: 1px;
}

.wysihtml5-commands-disabled .fore-color ul {
display: none;
}

.wysihtml5-action-active,
.wysihtml5-command-active {
box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.2);
background: #eee !important;
}

.wysihtml5-commands-disabled [data-wysihtml5-command],
.wysihtml5-commands-disabled .fore-color {
opacity: 0.4;
cursor: default;
background-image: none !important;
}

[data-wysihtml5-dialog] {
color: #333;
font-size: 14px;
text-align: left;
border-radius: 4px;
-ms-box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #ccc;
padding: 5px 10px;
background: #FFFBE0;
position: absolute;
width: 810px;
text-align: center;
top: 45px;
}

[data-wysihtml5-dialog] input {
color: #333;
border: 1px solid #ccc;
padding: 3px;
width: 300px;
}

[data-wysihtml5-dialog] input:focus {
outline: 0;
border: 1px solid #666;
}

[data-wysihtml5-dialog-action] {
padding: 4px;
color: #fff;
cursor: pointer;
}

[data-wysihtml5-dialog-action="save"] {
background: #007200;
}

[data-wysihtml5-dialog-action="cancel"] {
background: #999;
}

section {
position: absolute;
width: 810px;
top: 139px;
bottom: 0;
}

textarea {
width: 100%;
background: transparent;
height: 100%;
border: 0;
resize: none;
white-space: pre;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
padding: 10px;
word-wrap: normal;
-ms-box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

textarea:focus {
box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.3);
background: rgba(255, 255, 255, 0.4);
outline: 0;
}

a.fork {
position: absolute;
top: 0;
right: 0;
border: 0;
}

*/