wysiwyg-edit .tinyeditor {border:1px solid #bbb; padding:0 1px 1px; font:12px Verdana,Arial}
wysiwyg-edit .tinyeditor iframe {border:none; background: white; overflow-x:hidden}
wysiwyg-edit .tinyeditor .sizer { min-height: 200px; height: 400px; position: relative; }
wysiwyg-edit .tinyeditor .resizer { background: url(../images/resize.gif) 15px 15px no-repeat; float: right; height: 32px; width: 32px; cursor: ns-resize; }
wysiwyg-edit .tinyeditor .tinyeditor-header {height: auto; border-bottom:1px solid #bbb; background:url(../images/header-bg.gif) repeat; padding-top:1px}
wysiwyg-edit .tinyeditor .tinyeditor-header select {float:left; /*margin-top:5px*/ }
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-font {/*margin-left:12px*/}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-size {margin:0 3px}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-style {margin-right:12px}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-divider {float:left; width:1px; height:30px; background:#ccc}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control {
    float:left;
    width:34px;
    height:30px;
    cursor:pointer;
    background-image:url(../images/icons.png);
    background-position-x: 0px;
}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control:hover {
    background-color:#fff;
    background-position-x: 34px;
}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control.pressed {
    background-color:#D0CFCF;
}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group {
    float: left;
    height:31px;
}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group:after {
    clear: left;
}
wysiwyg-edit .tinyeditor .tinyeditor-footer {height:32px; border-top:1px solid #bbb; background:#f5f5f5; margin-top: 10px;}
wysiwyg-edit .tinyeditor .tinyeditor-footer .toggle {float:left; background:url(../images/icons.png) -34px 2px no-repeat; padding:9px 13px 0 31px; height:23px; border-right:1px solid #ccc; cursor:pointer; color:#666}
wysiwyg-edit .tinyeditor .tinyeditor-footer .toggle:hover {background-color:#fff}
wysiwyg-edit .tinyeditor .resize {float:right; height:32px; width:32px; background:url(../images/resize.gif) 15px 15px no-repeat; cursor:s-resize}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control .colors-grid { position: absolute; left: 0; top: 30px; background-color: white; width: 192px; border: black solid 2px; padding: 0; margin: 0; z-index: 100;}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control .colors-grid > li { list-style: none; border: white solid 2px; float: left; width: 20px; height: 20px; }
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control .colors-grid > li:hover { opacity: 0.7; }
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control .symbols-grid { position: absolute; left: 0; top: 30px; background-color: white; width: 384px; border: black solid 2px; padding: 0; margin: 0; z-index: 100;}
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control .symbols-grid > li { list-style: none; border: rgb(231, 231, 231) solid 1px; float: left; width: 30px; height: 30px; text-align: center; font-size: 1.3em; }
wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-control .symbols-grid > li:hover { opacity: 0.7; font-size: 1.7em; }
@media only screen and (max-width: 500px) {
    wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-font {
	width: 80px;
    }
    wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-size {
	width: 80px;
    }
    wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-style {
	width: 80px;
    }
}
@media only screen and (max-width: 768px) {
    wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-font {
	width: 80px;
    }
    wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-size {
	width: 80px;
    }
    wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .tinyeditor-style {
	width: 80px;
    }
}


/* insert code area */

wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .insert-codes-button {
  float: left;
  width: auto;
  height: 25px;
  line-height: 20px;
  cursor: pointer;
  background-image: none;
  background-position-x: 0px;
  margin-right: 5px;
  padding-right: 5px;
  padding-top: 2px;
}

  wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .insert-codes-button > span {
    font-weight: bold;
    color: #f63;
    font-family: Droid Arabic Kufi;
    font-size: 13px;
    padding: 0 10px;
  }

  wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .insert-codes-button:hover {
    background-color: #f5f5f5;
  }

  wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .insert-codes-button .code-grid {
    position: absolute;
    left: unset;
    top: unset;
    background-color: white;
    width: auto;
    border: none;
    padding: 0;
    margin: 0;
    z-index: 100;
  }

    wysiwyg-edit .tinyeditor .tinyeditor-header .tinyeditor-buttons-group .insert-codes-button .code-grid > li {
      list-style: none;
      border: #e7e7e7 solid 1px;
      background-color: white;
      float: none;
      width: auto;
      height: auto;
      text-align: unset;
      font-size: 12px;
      font-family: Droid Arabic Kufi;
      padding: 2px 5px;
    }