.redactor-toolbar-wrapper {
    position: relative;
}
.redactor-toolbar,
.redactor-air {
    z-index: $z-index-toolbar;
    font-family: $base-font-family;
    position: relative;
	margin: 0 !important;
	padding: 0;
	list-style: none !important;
	line-height: 1 !important;
	background: $color-mystic;
	border: none;
	box-sizing: border-box;
}
.redactor-box.redactor-styles-on {
    & .redactor-toolbar {
	    padding: 5px 0px 0px 5px;
	}
}
.redactor-toolbar a,
.redactor-air a {
    display: inline-block;
    box-sizing: border-box;
	font-size: 14px;
    letter-spacing: 0.23px;
    line-height: 20px;
	text-align: center;
	padding: 5px 10px;
	cursor: pointer;
	outline: none;
	border: none;
	vertical-align: middle;
	text-decoration: none;
	zoom: 1;
	position: relative;
	color: $color-outer-space;
	border-radius: 4px;
    border: 1px solid $color-geyser;
    background: rgba(255, 255, 255, 1);
    margin-right: 5px;
    margin-bottom: 5px;
    height: 30px;
    &[data-dropdown="true"] {
      background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSI4cHgiIGhlaWdodD0iNXB4IiB2aWV3Qm94PSIwIDAgOCA1IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPiAgICAgICAgPHRpdGxlPkljb24gLyBBcnJvdyBEb3duPC90aXRsZT4gICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+ICAgIDxkZWZzPiAgICAgICAgPHBhdGggZD0iTTMuOTk5NzIwNCwzLjE0MTk5MDk2IEw2Ljc2MzA5OTY0LDAuMjIzODQ4Mzc3IEM2Ljg5NTMyMTA1LDAuMDgxMDkxMjkwMyA3LjA4MDY5MTk2LDAgNy4yNzQ4MDY2LDAgQzcuNDY4OTIxMjQsMCA3LjY1NDI5MjE1LDAuMDgxMDkxMjkwMyA3Ljc4NjUxMzU1LDAuMjIzODQ4Mzc3IEM4LjA3MTE2MjE1LDAuNTI2MzYxNDQ2IDguMDcxMTYyMTUsMC45OTk0ODU5OTkgNy43ODY1MTM1NSwxLjMwMTk5OTA3IEw0LjYyOTEyNDcxLDQuNjM2MjE3NzkgQzQuNjAwNjI3MDgsNC42ODU0MDY0MyA0LjU2NjQ0MDc5LDQuNzMyMjAyMzIgNC41MjY1NjU4Myw0Ljc3NTY1MDE2IEM0LjM5NDM0NDQzLDQuOTE4NDA3MjQgNC4yMDg5NzM1Miw0Ljk5OTQ5ODUzIDQuMDE0ODU4ODgsNC45OTk0OTg1MyBDNC4wMTM3NTI4Miw0Ljk5OTQ5ODUzIDQuMDEyNjQ3MDQsNC45OTk0OTU5IDQuMDExNTQxNTYsNC45OTk0OTA2NCBDNC4wMDI2ODQwMyw0Ljk5OTgyOTU5IDMuOTkzODAzODUsNSAzLjk4NDkwNTMsNSBDMy43OTA3OTA2Niw1IDMuNjA1NDE5NzUsNC45MTg5MDg3MSAzLjQ3MzE5ODM1LDQuNzc2MTUxNjIgQzMuNDMyNjE2NTYsNC43MzE5MzM2MiAzLjM5NzkyNjksNC42ODQyNDc4MiAzLjM2OTEyOTM2LDQuNjM0MTAxMjIgTDAuMjEzMjUwNjI3LDEuMzAwOTk2MTQgQy0wLjA3MTA4MzU0MjQsMC45OTg1NTEwNTcgLTAuMDcxMDgzNTQyNCwwLjUyNTc5MTk5MiAwLjIxMzI1MDYyNywwLjIyMzM0NjkxMSBDMC4zNDQ2NjA1MDIsMC4wODA5ODc1MDU4IDAuNTI5MTg5MTY5LDcuOTQ4MjUxMzdlLTA1IDAuNzIyNDYxNDUsNy45NDgyNTEzN2UtMDUgQzAuOTE1NzMzNzMxLDcuOTQ4MjUxMzdlLTA1IDEuMTAwMjYyNCwwLjA4MDk4NzUwNTggMS4yMzE2NzIyNywwLjIyMzM0NjkxMSBMMy45OTk3MjA0LDMuMTQxOTkwOTYgWiIgaWQ9InBhdGgtMSI+PC9wYXRoPiAgICA8L2RlZnM+ICAgIDxnIGlkPSJTeW1ib2xzIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSJGb3JtLS8tU2VsZWN0LS8tTGFiZWwtLy1Ob3JtYWwiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMTIuMDAwMDAwLCAtMTMuMDAwMDAwKSI+ICAgICAgICAgICAgPGcgaWQ9Ikljb24tLy1QaWN0b2dyYW0tLy1BcnJvdy1Eb3duIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMDQuMDAwMDAwLCAzLjAwMDAwMCkiPiAgICAgICAgICAgICAgICA8ZyBpZD0iRnJhbWVfLV8yNHB4Ij4gICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUtcGF0aCIgeD0iMCIgeT0iMCIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ij48L3JlY3Q+ICAgICAgICAgICAgICAgIDwvZz4gICAgICAgICAgICAgICAgPGcgaWQ9IkxpbmVfSWNvbnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDguMDAwMDAwLCAxMC4wMDAwMDApIj4gICAgICAgICAgICAgICAgICAgIDxtYXNrIGlkPSJtYXNrLTIiIGZpbGw9IndoaXRlIj4gICAgICAgICAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPiAgICAgICAgICAgICAgICAgICAgPC9tYXNrPiAgICAgICAgICAgICAgICAgICAgPHVzZSBpZD0iTWFzayIgZmlsbD0iIzJDMzIzOCIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+ICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iQ29sb3VyLS8tY29sb3Itc2lsdmVyIiBtYXNrPSJ1cmwoI21hc2stMikiIGZpbGw9IiM2Rjc5ODIiPiAgICAgICAgICAgICAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xOS4wMDAwMDAsIC0yMy4wMDAwMDApIj4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjUwIiBoZWlnaHQ9IjUwIj48L3JlY3Q+ICAgICAgICAgICAgICAgICAgICAgICAgPC9nPiAgICAgICAgICAgICAgICAgICAgPC9nPiAgICAgICAgICAgICAgICA8L2c+ICAgICAgICAgICAgPC9nPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+);
      background-size: rem-calc(8);
      padding-right: rem-calc(25);
      background-origin: content-box;
      background-position: right rem-calc(-15) center;
      background-repeat: no-repeat;
    }
    span {
      font-size: 14px;
      letter-spacing: 0.23px;
      line-height: 20px;
      color: $color-outer-space;
      margin-top: 4px;
      display: block;
    }
    i {
      color: $color-pale-sky;
      line-height: rem-calc(20);
    }
}
.redactor-toolbar,
.redactor-air {
    a.re-button-icon {
	    font-size: 18px;
        color: $color-pale-sky;
        padding: 4px 3px 2px 3px;
        min-width: 30px;
      &.re-fontcolor {
        font-size: 24px;
        padding-top: 5px;
      }
      &.re-fontfamily, &.re-fontsize {
        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSI4cHgiIGhlaWdodD0iNXB4IiB2aWV3Qm94PSIwIDAgOCA1IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPiAgICAgICAgPHRpdGxlPkljb24gLyBBcnJvdyBEb3duPC90aXRsZT4gICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+ICAgIDxkZWZzPiAgICAgICAgPHBhdGggZD0iTTMuOTk5NzIwNCwzLjE0MTk5MDk2IEw2Ljc2MzA5OTY0LDAuMjIzODQ4Mzc3IEM2Ljg5NTMyMTA1LDAuMDgxMDkxMjkwMyA3LjA4MDY5MTk2LDAgNy4yNzQ4MDY2LDAgQzcuNDY4OTIxMjQsMCA3LjY1NDI5MjE1LDAuMDgxMDkxMjkwMyA3Ljc4NjUxMzU1LDAuMjIzODQ4Mzc3IEM4LjA3MTE2MjE1LDAuNTI2MzYxNDQ2IDguMDcxMTYyMTUsMC45OTk0ODU5OTkgNy43ODY1MTM1NSwxLjMwMTk5OTA3IEw0LjYyOTEyNDcxLDQuNjM2MjE3NzkgQzQuNjAwNjI3MDgsNC42ODU0MDY0MyA0LjU2NjQ0MDc5LDQuNzMyMjAyMzIgNC41MjY1NjU4Myw0Ljc3NTY1MDE2IEM0LjM5NDM0NDQzLDQuOTE4NDA3MjQgNC4yMDg5NzM1Miw0Ljk5OTQ5ODUzIDQuMDE0ODU4ODgsNC45OTk0OTg1MyBDNC4wMTM3NTI4Miw0Ljk5OTQ5ODUzIDQuMDEyNjQ3MDQsNC45OTk0OTU5IDQuMDExNTQxNTYsNC45OTk0OTA2NCBDNC4wMDI2ODQwMyw0Ljk5OTgyOTU5IDMuOTkzODAzODUsNSAzLjk4NDkwNTMsNSBDMy43OTA3OTA2Niw1IDMuNjA1NDE5NzUsNC45MTg5MDg3MSAzLjQ3MzE5ODM1LDQuNzc2MTUxNjIgQzMuNDMyNjE2NTYsNC43MzE5MzM2MiAzLjM5NzkyNjksNC42ODQyNDc4MiAzLjM2OTEyOTM2LDQuNjM0MTAxMjIgTDAuMjEzMjUwNjI3LDEuMzAwOTk2MTQgQy0wLjA3MTA4MzU0MjQsMC45OTg1NTEwNTcgLTAuMDcxMDgzNTQyNCwwLjUyNTc5MTk5MiAwLjIxMzI1MDYyNywwLjIyMzM0NjkxMSBDMC4zNDQ2NjA1MDIsMC4wODA5ODc1MDU4IDAuNTI5MTg5MTY5LDcuOTQ4MjUxMzdlLTA1IDAuNzIyNDYxNDUsNy45NDgyNTEzN2UtMDUgQzAuOTE1NzMzNzMxLDcuOTQ4MjUxMzdlLTA1IDEuMTAwMjYyNCwwLjA4MDk4NzUwNTggMS4yMzE2NzIyNywwLjIyMzM0NjkxMSBMMy45OTk3MjA0LDMuMTQxOTkwOTYgWiIgaWQ9InBhdGgtMSI+PC9wYXRoPiAgICA8L2RlZnM+ICAgIDxnIGlkPSJTeW1ib2xzIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSJGb3JtLS8tU2VsZWN0LS8tTGFiZWwtLy1Ob3JtYWwiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMTIuMDAwMDAwLCAtMTMuMDAwMDAwKSI+ICAgICAgICAgICAgPGcgaWQ9Ikljb24tLy1QaWN0b2dyYW0tLy1BcnJvdy1Eb3duIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMDQuMDAwMDAwLCAzLjAwMDAwMCkiPiAgICAgICAgICAgICAgICA8ZyBpZD0iRnJhbWVfLV8yNHB4Ij4gICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUtcGF0aCIgeD0iMCIgeT0iMCIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ij48L3JlY3Q+ICAgICAgICAgICAgICAgIDwvZz4gICAgICAgICAgICAgICAgPGcgaWQ9IkxpbmVfSWNvbnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDguMDAwMDAwLCAxMC4wMDAwMDApIj4gICAgICAgICAgICAgICAgICAgIDxtYXNrIGlkPSJtYXNrLTIiIGZpbGw9IndoaXRlIj4gICAgICAgICAgICAgICAgICAgICAgICA8dXNlIHhsaW5rOmhyZWY9IiNwYXRoLTEiPjwvdXNlPiAgICAgICAgICAgICAgICAgICAgPC9tYXNrPiAgICAgICAgICAgICAgICAgICAgPHVzZSBpZD0iTWFzayIgZmlsbD0iIzJDMzIzOCIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+ICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iQ29sb3VyLS8tY29sb3Itc2lsdmVyIiBtYXNrPSJ1cmwoI21hc2stMikiIGZpbGw9IiM2Rjc5ODIiPiAgICAgICAgICAgICAgICAgICAgICAgIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xOS4wMDAwMDAsIC0yMy4wMDAwMDApIj4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjUwIiBoZWlnaHQ9IjUwIj48L3JlY3Q+ICAgICAgICAgICAgICAgICAgICAgICAgPC9nPiAgICAgICAgICAgICAgICAgICAgPC9nPiAgICAgICAgICAgICAgICA8L2c+ICAgICAgICAgICAgPC9nPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+);
        background-size: rem-calc(8);
        padding: 0px rem-calc(25) 0px 10px;
        background-origin: content-box;
        background-position: right rem-calc(-15) center;
        background-repeat: no-repeat;
      }
      &.icon-variables {
        font-family: $base-font-family;
        font-weight: 600;
        padding: 3px 6px;
        font-size: 16px;
      }
    }
}
.redactor-toolbar,
.redactor-air {
    a:hover {
	    outline: none;
        color: $color-outer-space;
        background: #fff;
    }
}
.redactor-toolbar a.redactor-button-active {
    background: rgba(245, 245, 245, .95);
    color: rgba(0, 0, 0, .4);
}
.redactor-toolbar,
.redactor-air {
    a.redactor-button-disabled {
        opacity: 0.3;
    	&:hover {
    		color: #333;
    		outline: none;
    		background-color: transparent !important;
    		cursor: default;
    	}
    }
}
.redactor-source-view {
    & .redactor-toolbar {
        background: #252525;
    }
    & .redactor-toolbar a {
        background: #000;
        color: #fff;
        &:hover {
            background: #449aef;
        }
    }
    & .redactor-toolbar a.redactor-button-disabled {
    	&:hover {
		    color: #fff !important;
    		background-color: #000 !important;
        }
    }
}
.re-button-tooltip {
	display: none;
	position: absolute;
	white-space: nowrap;
    top: 0;
    z-index: $z-index-toolbar-button-tooltip;
    background: rgba(0, 0, 0, .9);
    border-radius: 3px;
    padding: 5px 9px;
    color: rgba(255, 255, 255, .8);
    font-size: 12px;
    line-height: 1;
    font-family: $monospace-font-family;

    &:after {
    	bottom: 100%;
    	left: 50%;
    	border: solid transparent;
    	content: " ";
    	height: 0;
    	width: 0;
    	position: absolute;
    	pointer-events: none;
    	border-color: none;
    	border-bottom-color: rgba(0, 0, 0, .9);
    	border-width: 4px;
    	margin-left: -4px;
    }
}