:root {
--header_height: 100px;  
--main_height : calc(100vh - var(--header_height))     
    }



@font-face {
    font-family: "netcase";
    src: url("/core/css/fonts/netcase_regular.eot");
    src: url("/core/css/fonts/netcase_regular.eot?#iefix") format("embedded-opentype"),
         url("/core/css/fonts/netcase_regular.woff") format("woff"),
         url("/core/css/fonts/netcase_regular.ttf") format("truetype"),
         url("/core/css/fonts/netcase_regular.svg#netcaseregular") format("svg");
    font-weight: normal;
    font-style: normal;

}




.main_height {height: calc(100vh - var(--header_height));}

.core_header {width:100%; height:var(--header_height); background-color:rgba(161,165,180,1); position:fixed; box-shadow:0 2px 2px #000; z-index:1001; color:#fff; padding: 0 10px; box-sizing: border-box;}
.core_header .title {text-shadow: 0px 0px 2px #000; font-size: 3em; color:rgba(240,240,240,1); text-align:center; padding-top:20px;}

.has_left_menu .core_left_menu {width:300px; background-color:#efefef; padding:5px 10px; box-sizing:border-box; position:fixed; z-index:1000;  left:0; top:100px; vertical-align:top; height: var(--main_height);}
.has_right_menu .core_right_menu {width:150px; background-color:#efefef; padding:40px 10px; box-sizing:border-box;  position:fixed;  z-index:1000; right:0; top:100px;  vertical-align:top;height: var(--main_height);}
.has_left_menu  .core_central {padding-left:300px;}
.has_right_menu .core_central {padding-right:150px;}


.core_main { box-sizing: border-box; font-size:1.6rem; padding-top:var(--header_height);}
.core_main_inner {display:table; width:100%;}
.core_central {position:fixed; box-sizing:border-box; z-index:999; vertical-align:top; width:100%; top:100px; height: var(--main_height);}

.core_menu_button {border:1px solid black; padding:2px; margin:2px 0px; background-color:#cfcfcf; display:inline-block; border-radius:3px;}
.core_menu_list {background-color:#fff; height:300px; width:100%; padding:5px 0 0 30px; overflow-y: scroll; overflow-x: hidden; box-sizing: border-box; }
.core_menu_list li {list-style-type: disc;}

.core_editable_content {width:100%; border:1px solid #dfdfdf; padding:2px; resize: vertical;}
textarea.core_editable_content { min-height:200px; }
.core_content_active {background-color:#fffda0;}
.core_content_changed {background-color:#fffde0;}

.core_function_variables {min-height:150px; padding-left:30px; margin-top:10px;}

.core_message {display:none; position:fixed; bottom:0px; left:0; font-size:1.2rem; line-height: 2.5; background-color:#000; color:#43f727; font-family:monospace; width:100%; box-sizing:border-box;  min-height:30px; max-height:100px; overflow-y:auto; overflow-x:hidden; padding:0px 20px;}

.page_builder {width:100%; height:100%;  padding:0 10px; box-sizing:border-box; padding-top:10px;overflow-y:scroll;}


.builder_button {border: 0; background: transparent; padding:0; display:block; z-index:1;}
.builder_button img {display:block;}


.draggable_add_section {opacity:0.1; cursor:grab; filter: invert(1);}

.droppable {height:30px; width:calc(100% - 50px); position:absolute; top:0; left:0; visibility:hidden;}
.dragging_new_section {height:75px; width:calc(100% - 50px); visibility:visible; text-align:center; position:static; padding-top:10px;  background-color:#fffda0; box-sizing:border-box; border: 1px solid #dfdfdf; margin-bottom:3px;}
.dragging_new_section:after {content:"Drop New Section Here"; font-size:30pt; color:#111;  text-shadow: 2px 2px 4px #aaa; }
.awaiting_new_section {height:200px; width:calc(100% - 50px); position:static;  background-color:#fffda0;}

.droppable_content_section {margin-top:6px; position:relative; background-color:#fbfbfb; position:relative}

.template_textarea {width:100%; min-height:100vh; font-size:1.4rem; padding:30px 10px; box-sizing:border-box; font-family:"Courtier New"; color:#999;}
.template_save_button {position:absolute; top:0px;right:0px;width:60px; height:50px; z-index:9;}
.save_acknowledge {position:absolute; width:32px; height:36px; background-color:#66ff66; top:7px; left:13px; z-index:0; display:none;}

.editable_div {width:calc(100% - 75px); margin-left:10px; height:100%; font-size:1.4rem; box-sizing:border-box; font-family:monospace; color:#000; background-color:#fdfdfd; padding:5px; resize: none; overflow-y:scroll; border-radius:2px; border:2px solid #bbb;}
.editable_line {padding:2px 0 0 10px;font-family: monospace; box-sizing:border-box; vertical-align:top; height:24px; text-indent: -8px;}
 .duplicate_div{display:none;}

.table_list tr:nth-child(odd) {background-color:#fafafa;}
.table_list tr:nth-child(even) {background-color:#fff;} 
.numbered_line {width:50px; padding-left:10px; color:red; box-sizing:border-box; vertical-align:top;padding-top: 4px;}
.numbered_line_add {width:100%; height:100px; background-color:#fff;font-size: 4rem; font-family: arial; color: #efefef; text-align: center; padding-top: 10px; box-sizing: border-box; border-top: 4px solid #efefef; cursor:pointer;}
.selected_editable_line {background-color:#dfdfdf!important; font-weight:bold;}


[contenteditable]:focus { outline: 0px solid transparent;}


.creator_tabbed_box{width:100%;height: calc(100% - 10px);}
.creator_tabbed_box > .tabs {height: 40px; font-size:1.6rem}
.creator_tabbed_box > .tabs > .tab {min-width: 150px;padding: 5px;}
.creator_tabbed_box > .open_tab {padding: 10px;height: calc(100% - 40px);}
.creator_tabbed_box >.open_tab .form_item{font-family: arial;border-radius: 2px;border: 1px solid #cfcfcf;background-color:#fff;color: #333; box-sizing: border-box;}
.creator_tabbed_box >.open_tab textarea.form_item {padding:5px;}

.large_tabbed_box{width: 100%; min-width:1500px; height:calc(100vh - 130px); margin-top:10px;}
.large_tabbed_box > .tabs {height: 40px; font-size:1.6rem}
.large_tabbed_box > .tabs > .tab {min-width: 150px;padding: 5px;}
.large_tabbed_box > .open_tab {padding: 0 10px 10px 10px; border-top:10px solid rgba(255,255,255,0); height: calc(100% - 40px);}


.admin_popup_content {margin-top:65px; padding:0px 30px 10px 30px;}



.thumbnail {display:inline-block; min-height:110px; position:relative; background-color:#dfdfdf; vertical-align:top; margin:3px; border-radius:5px; padding:5px; } 
.thumbnail > .image {max-width:190px; max-height:190px;}
.thumbnail > .image img {display:block; max-width: 190px;  max-height: 190px;}
.thumbnail > .icon {position:absolute;  width:20px; background-color:rgba(255,255,255,0.5); padding:2px; border-radius:5px;}
.thumbnail > .icon img {width:100%; display:block}
.thumbnail > .delete {left:10px; top:10px;}
.thumbnail > .sortable_item {right:10px; top:10px;}
.new_image {width:200px;margin:3px; border-radius:5px; padding:5px; border:5px solid #dfdfdf; background-color:#fff;  font-size:2rem; font-weight:bold; color:#dfdfdf; text-align:center;}
.thumbnail .caption {position:absolute; left:10px; bottom:10px;}
.thumbnail .link {position:absolute; left:10px; bottom:32px;}
