/* Class names prefixes */
/* Colors / Theme */
/*  Example for more firendly tooltip for blocks */
.gjs-block-category .gjs-blocks-c div[title='Input']:hover:after, .gjs-block-category .gjs-blocks-c div[title='Textarea']:hover:after, .gjs-block-category .gjs-blocks-c div[title='Radio']:hover:after, .gjs-block-category .gjs-blocks-c div[title='Checkbox']:hover:after, .gjs-block-category .gjs-blocks-c div[title='Select']:hover:after { top: 30%; opacity: 1; display: block; visibility: visible; }

.gjs-block-category .gjs-blocks-c div[title='Input']:after, .gjs-block-category .gjs-blocks-c div[title='Textarea']:after, .gjs-block-category .gjs-blocks-c div[title='Radio']:after, .gjs-block-category .gjs-blocks-c div[title='Checkbox']:after, .gjs-block-category .gjs-blocks-c div[title='Select']:after { line-height: 2; position: fixed; top: 0; right: 220px; opacity: 0; z-index: 2; visibility: hidden; transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; -moz-transition: all ease-in-out 0.3s; width: 300px; height: 44px; font-size: 13px; padding: 10px; background: #ffffff; color: #000; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: 1px 2px 10px rgba(116, 116, 116, 0.3); -moz-box-shadow: 1px 2px 10px rgba(116, 116, 116, 0.3); -webkit-box-shadow: 1px 2px 10px rgba(116, 116, 116, 0.3); content: "Please insert this inside the <form> tag."; }

.gjs-block-category .gjs-blocks-c .gjs-iml-block.gjs-iml-good-tooltip:hover:after { top: 30%; opacity: 1; display: block; visibility: visible; }

.gjs-block-category .gjs-blocks-c .gjs-iml-block.gjs-iml-good-tooltip:after { line-height: 2; position: fixed; top: 0; right: 220px; opacity: 0; z-index: 2; visibility: hidden; transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; -moz-transition: all ease-in-out 0.3s; width: 300px; height: 44px; font-size: 13px; padding: 10px; background: #ffffff; color: #000; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; box-shadow: 1px 2px 10px rgba(116, 116, 116, 0.3); -moz-box-shadow: 1px 2px 10px rgba(116, 116, 116, 0.3); -webkit-box-shadow: 1px 2px 10px rgba(116, 116, 116, 0.3); content: attr(iml-good-title); }

/* grapejs style override */
.gjs-btn-prim { background-color: #007bff; color: #f8f9fa; }

.gjs-btn-prim:hover, .gjs-btn-prim:active, .gjs-btn-prim:focus { background-color: #0069d9; }

.gjs-pn-commands { min-height: 40px; }

.gjs-am-preview-cont { height: 100px; width: 100%; }

.gjs-pn-panel.gjs-pn-views { padding: 0; border-bottom: none; }

.gjs-pn-btn.gjs-pn-active { box-shadow: none; }

.gjs-logo { height: 25px; }

.gjs-logo-cont { display: inline-block; position: absolute; box-sizing: border-box; text-align: center; padding: 5px; z-index: 3; left: 50%; left: calc(50% - 220px); top: 3px; }

.gjs-logo-version { font-size: 16px; font-weight: bold; }

.gjs-pn-views .gjs-pn-btn { margin: 0; height: 40px; padding: 10px; width: 33.3333%; border-bottom: 2px solid rgba(0, 0, 0, 0.3); }

.CodeMirror { min-height: 450px; margin-bottom: 8px; }

/*.gjs-editor-cont .fa{*/
/*  display: inline-block;*/
/*   font: normal normal normal 14px/1 FontAwesome !important;*/
/*   font-size: inherit;*/
/*   text-rendering: auto;*/
/*   -webkit-font-smoothing: antialiased;*/
/*   -moz-osx-font-smoothing: grayscale;*/
/*}*/
/*   reslove boot strap make right panel wrong issue*/
.gjs-pn-panel label { margin-bottom: inherit !important; }

.gjs-label-wrp { /*width: auto;*/ /*max-width: 70%;*/ /*min-width: 30%;*/ }

/*#gjs-sm-float, .gjs-pn-views .fa-cog {*/
/*    display: none;*/
/*}*/
/* make the delete button of assert visiable */
.gjs-am-close { display: block; /*color: white;*/ z-index: 2000; opacity: 1; }

#customListModal .premium-mode .custom-row { display: none; }

#customListModal .custom-mode .premium-row { display: none; }

#menuEditor li.pr-0 { padding-right: 12px !important; }

.gjs-three-color { color: #007BFF; }

.gjs-three-color-h:hover { color: #007BFF; }

.gjs-four-color { color: #007BFF; }

.gjs-four-color-h:hover { color: #007BFF; }