.cm-WooPreviewEmail {
    display: flex;
    flex-wrap: wrap;
    transition: 0.8s all;
}

.cm-WooPreviewEmail .tool-bar-toggler {
    left: 25%;
    position: fixed;
    top: 0;
    padding: 1em;
    min-width: 200px;
    transition: 0.4s all;
}

.cm-WooPreviewEmail .tool-bar-toggler.hidden {
    left: 0;
}

.cm-WooPreviewEmail .tool-bar-toggler.hidden svg {
    rotate: 180deg;
}

.cm-WooPreviewEmail .tool-bar-toggler .show-controls,
.cm-WooPreviewEmail .tool-bar-toggler.hidden .hide-controls {
    display: none;
}

.cm-WooPreviewEmail .tool-bar-toggler.hidden .show-controls {
    display: inline-block;
}

.cm-WooPreviewEmail div#tool-options.hidden {
    display: none;
}

.cm-WooPreviewEmail .tool-bar-toggler svg {
    width: 14px;
}

.cm-WooPreviewEmail .tool-bar-toggler a,
.cm-WooPreviewEmail .tool-bar-toggler a:visited {
    text-decoration: none;
    color: #646970;
}

.cm-WooPreviewEmail .tool-bar-toggler a:hover {
    color: #2271b1;
}


.cm-WooPreviewEmail #tool-options {
    width: 30%;
    padding: 2em;
}

.cm-WooPreviewEmail #tool-options #email {
    max-width: 75%;
}

.cm-WooPreviewEmail #tool-options #clearEmail {
    padding: 0.15em 1em;
}

.cm-WooPreviewEmail-emailContent {
    flex-grow: 1;
}

.cm-WooPreviewEmail #tool-options select {
    font-size: 14px;
    line-height: 2;
    color: #32373c;
    border-color: #7e8993;
    box-shadow: none;
    border-radius: 3px;
    padding: 0 24px 0 8px;
    min-height: 30px;
    max-width: 25rem;
    -webkit-appearance: none;
    background: #fff url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2…%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E) no-repeat right 5px top 55%;
    background-size: 16px 16px;
    cursor: pointer;
    vertical-align: middle;
}

.cm-WooPreviewEmail #tool-options .button-primary {
    background: #007cba;
    border-color: #007cba;
    color: #fff;
    text-decoration: none;
    text-shadow: none;
    display: inline-block;
    font-size: 13px;
    line-height: 2.15384615;
    min-height: 30px;
    margin: 0;
    padding: 0 10px;
    cursor: pointer;
    border-width: 1px;
    border-style: solid;
    -webkit-appearance: none;
    border-radius: 3px;
    white-space: nowrap;
    box-sizing: border-box;
}

.cm-WooPreviewEmail #tool-options .regular-text {
    width: 25em;
}


.cm-WooPreviewEmail #tool-options input[type=date],
.cm-WooPreviewEmail #tool-options input[type=datetime-local],
.cm-WooPreviewEmail #tool-options input[type=datetime],
.cm-WooPreviewEmail #tool-options input[type=email],
.cm-WooPreviewEmail #tool-options input[type=month],
.cm-WooPreviewEmail #tool-options input[type=number],
.cm-WooPreviewEmail #tool-options input[type=password],
.cm-WooPreviewEmail #tool-options input[type=search],
.cm-WooPreviewEmail #tool-options input[type=tel],
.cm-WooPreviewEmail #tool-options input[type=text],
.cm-WooPreviewEmail #tool-options input[type=time],
.cm-WooPreviewEmail #tool-options input[type=url],
.cm-WooPreviewEmail #tool-options input[type=week] {
    padding: 0 8px;
    line-height: 2;
    min-height: 30px;
    font-size: 14px;
    width: 25em;
}

#tool-options #search-description {
    display: none;
}

#tool-wrap table select, input[type='email'] { width: 100%; }

#tool-options table th { text-align: left; }


@media screen and (max-width: 767px) {
    .cm-WooPreviewEmail #tool-options, .cm-WooPreviewEmail-emailContent {
        width: 100%;
    }
}