/* =====================================
=========== Edit Module CSS ============
======================================== */


/* ================ Modules ===================== */
.module_tabs_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/tabs_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_slider_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/slider_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_megaslider_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/mega_slider_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_selectaslide_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/selectaslide_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_sitemap_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/sitemap_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_social_media_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/social_media_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_locations_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/locations_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_testimonial_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/testimonial_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_form_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/form_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_button_maker_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/button_maker_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_gallery_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/gallery_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.module_hover_icon_images_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/hover_icon_images_module_icon.png');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}

.no_module_icon {
    width: 64px;
    height: 64px;
    margin: 0 auto;
    background-image: url('../images/no_module_icon.jpg');
    background-repeat: no-repeat;
    background-size: 53px;
    cursor: pointer;
}


/* ================ Miscellanious ===================== */
.input-text, .input-select, .input-textarea {
    padding: 7px;
    border: #ccc 1px solid;
    border-radius: 4px;
    margin: 0;
    box-sizing: border-box;
}

.secondary_tools_wrap {
    position: absolute;
    bottom: 20px;
    right: 40px;
    display: block;
    width: 500px;
    height: 55px;
    text-align: right;
}

.secondary_tools {
    display: inline-block;
    width: 55px;
    height: 55px;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    opacity: 1;
    transition: all ease-in-out 180ms;
}

.secondary_tools:hover {
    opacity: 0.7;
}

.publish_icon {
    background-image: url('../images/publish_icon.png');
}

.global_publish_icon {
    background-image: url('../images/global_publish_icon.png');
}

.publish_complete {
    background-image: url('../images/publish_complete_icon.png');
}

.global_preview_icon {
    background-image: url('../images/global_preview_icon.png');
}

.design_wizard_icon {
    background-image: url('../images/design_wizard_icon.png');
}

.publish_loading {
    width: 34px;
    height: 34px;
    position: relative;
    top: 50%;
    left: 50%;
    margin: -18px 0 0 -18px;
    background: url('../images/spinner2.gif');
    background-size: 100%;
    background-repeat: no-repeat;
    z-index: 49999;
    display: none;
}


/* ================ Buttons ===================== */
.clearing {
    clear: both;
}

.button, .submit-button, .edit-button, .close-button {
    display: inline-block;
    width: auto;
    padding: 6px 8px;
    background: #dd912a;
    color: #fff;
    border: #dd912a 1px solid;
    border-radius: 4px;
    font-size: 12px;
    text-align: center;
    transition: all ease-in-out 150ms;
}

.button:hover {
    background: #0053A6;
    cursor: pointer;
}

.submit-button {
    background: #427fed;
    border-color: #3963c5;
    margin: 0 2px;
}

.submit-button:hover {
    background: #0053A6;
    cursor: pointer;
}

.edit-button {
    background: #427fed;
    border-color: #3963c5;
    margin: 0 2px;
}

.edit-button:hover {
    background: #0053A6;
    cursor: pointer;
}

.preview-button {
    background: #1dc017;
    border-color: #1b8917;
    margin: 0 2px;
}

.preview-button:hover {
    background: #7ac42c;
    cursor: pointer;
}

.close-button {
    background: #A4181B;
    border-color: #ad6100;
    margin: 0 2px;
}

.close-button:hover {
    background: #E1595B;
    cursor: pointer;
}

.btn_save, .btn_save:hover,
.btn_edit, .btn_edit:hover,
.btn_preview, .btn_preview:hover,
.btn_delete, .btn_delete:hover,
.btn_publish, .btn_publish:hover {
    background-repeat: no-repeat;
    background-position: 5px 8px;
    background-size: 14px 14px;
    padding-left: 30px;
    padding-right: 30px;
}

.btn_save, .btn_save:hover {
    background-image: url('../images/save_icon.png');
}

.btn_edit, .btn_edit:hover {
    background-image: url('../images/edit_icon.png');
}

.btn_preview, .btn_preview:hover {
    background-image: url('../images/preview_icon.png');
}

.btn_delete, .btn_delete:hover {
    background-image: url('../images/delete_icon.png');
}

.btn_publish, .btn_publish:hover {
    background-image: url('../images/publish_icon_sm.png');
}

#add_link_btn_wrap {
    position: absolute;
    bottom: 0;
    background: rgba(200, 200, 200, 0.4);
    width: 100%;
    box-sizing: border-box;
    padding: 12px 24px 12px 12px;
    border-radius: 0 0 0 5px;
    display: none;
}


/* ================ Modules ===================== */

#editModulesWrap, #pluginsWrap, .modules_popup_wrapper, .additional_module_features_wrap, #defPopupWrap {
    position: fixed;
    width: 1000px;
    min-height: 300px;
    z-index: 15002;
    left: 50%;
    margin-left: -500px;
    top: -820px;
    background: #eee;
    border-radius: 26px;
    border: #CBCBCB 12px solid;
    box-shadow: #000 0 0px 20px 8px;
    opacity: 0;
}

.editModulesBG {
    background: #000;
    opacity: 0.6;
    position: fixed;
    width: 100%;
    height: 1500px;
    top: 0;
    left: 0;
    z-index: 15001;
    display: none;
}

.editModulesBG2 {
    background: #000;
    opacity: 0.6;
    position: fixed;
    width: 100%;
    height: 1500px;
    top: 0;
    left: 0;
    z-index: 50001;
    display: none;
}

.editModulesHeader, .pluginsHeader, .modules_popup_header, .defPopupHeader {
    background: #9D9D9D;
    padding: 8px;
    color: #fff;
    border-radius: 12px 12px 0 0;
}

.editModulesClose, .pluginsClose, .modules_popup_close, .defPopupClose {
    position: absolute;
    top: 0px;
    right: 10px;
    color: #fff;
    font-size: 19px;
    display: inline-block;
    width: auto;
    padding: 5px;
}

.editModulesClose:hover, .pluginsClose:hover, .modules_popup_close:hover, .defPopupClose:hover {
    color: #bbb;
    cursor: pointer;
}

.editModule, .addModule {
    opacity: 1;
    transition: all ease-in-out 180ms;
}

.editModule:hover, .addModule:hover {
    opacity: 0.8;
}

.load_module_settings {
    width: 160px;
    height: 160px;
    position: absolute;
    top: 80px;
    left: 50%;
    margin-left: -80px;
    background-image: url('../images/loading.gif');
    background-repeat: no-repeat;
    background-size: 160px;
}

.edit_module_wrap, .add_module_wrap {
    display: inline-block;
    margin: 0 4px;
    width: 76px;
    height: 90px;
    text-align: center;
    vertical-align: top;
}

.edit_module_title, .add_module_title {
    width: 49px;
    text-align: center;
    font-size: 10px;
    color: #111;
    margin: 0 auto;
}

.reusable-trRow-even, .reusable-trRow-odd {
    background: transparent;
    opacity: 1;
    padding: 1px 0 1px 8px;
    display: block;
    transition: all ease-in-out 180ms;
}

.reusable-trRow-even:hover, .reusable-trRow-odd:hover { /*background:#f0f0f0;*/
    background: linear-gradient(#efefef 42px, transparent 42px, transparent);
}

/*.reusable-trRow-odd-selected, .reusable-trRow-odd-selected:hover { background:linear-gradient(#dfdfdf 40px, transparent 40px, transparent); }*/
.widgetTitle {
    float: left;
    display: block;
    width: 35%;
    padding: 9px;
    text-align: left;
    position: relative; /*width:auto;*/
}


/* Reusable */
.r-menu-wrapper {
    position: fixed;
    z-index: 100;
    display: block;
    width: 101%;
    background: #ccc;
    border-bottom: #bbb 1px solid;
    margin-left: -8px;
    top: -100px;
}

.r-menu {
    display: inline-block;
    padding: 20px 0px;
    width: 12%;
    box-sizing: border-box;
    text-align: center;
    border-right: #bbb 1px dotted;
    transition: all ease-in-out 150ms;
    position: relative;
}

.r-menu:hover, .r-selected {
    background: #e5e5e5;
    cursor: pointer;
}

.r-menu:hover:after, .r-selected:after {
    content: "";
    width: 0;
    height: 0;
    border-right: 20px solid transparent;
    border-left: 20px solid transparent;
    border-top: 20px solid #e5e5e5;
    position: absolute;
    top: 60px;
    left: 50%;
    margin-left: -15px;
}

.r-menu:hover:before, .r-selected:before {
    content: "";
    width: 0;
    height: 0;
    border-right: 21px solid transparent;
    border-left: 21px solid transparent;
    border-top: 22px solid #bbb;
    position: absolute;
    top: 60px;
    left: 50%;
    margin-left: -16px;
}

.reusable_top_category, .reusable_top_category:hover, .client_top_category, .client_top_category:hover, .top_section, .top_section:hover {
    padding-left: 40px;
    background-image: url('../images/folder_closed.png');
    background-repeat: no-repeat;
    background-size: 22px;
    background-position: 10px 9px;
    cursor: default;
}

.top_section:hover {
    cursor: pointer;
}

.reusable_top_category_open, .reusable_top_category_open:hover, .client_top_category_open, .client_top_category_open:hover {
    background-image: url('../images/folder_open.png');
    padding-left: 40px;
    background-repeat: no-repeat;
    background-size: 22px;
    background-position: 10px 9px;
    cursor: default;
}

.reusable_top_category_loading, .reusable_top_category_loading:hover, .client_top_category_loading, .client_top_category_loading:hover {
    background-image: url('../images/loading.gif');
}

.reusable_category_results_wrapper, .client_category_results_wrapper {
    box-sizing: border-box;
    margin-left: 20px;
    cursor: default;
}

.reusable_sub_sections, .reusable_sub_sections:hover, .client_sub_sections, .client_sub_sections:hover {
    padding-left: 40px;
    background-image: url('../images/folder_closed.png');
    background-repeat: no-repeat;
    background-size: 22px;
    background-position: 10px 9px;
    cursor: default;
}

.reusable_file, .client_file {
    padding-left: 40px;
    background-image: url('../images/file_icon.png');
    background-repeat: no-repeat;
    background-size: 22px;
    background-position: 10px 9px;
    cursor: default;
}

.reusable_global, .client_global {
    padding-left: 40px;
    background-image: url('../images/global_icon.png');
    background-repeat: no-repeat;
    background-size: 22px;
    background-position: 10px 9px;
    cursor: default;
}

.reusable-trRow-odd-selected, .reusable-trRow-odd-selected:hover {
    background: linear-gradient(#dfdfdf 40px, transparent 40px, transparent);
}

.reusable-trRow-locked-selected, .reusable-trRow-locked-selected:hover {
    background-color: #dfdfdf;
    background-image: url('../images/lock_orange.png');
    background-position: right;
    background-repeat: no-repeat;
}

.folderHandle, .top_section_folder_handle {
    display: block;
    width: 27px;
    height: 27px;
    left: 4px;
    position: absolute;
    cursor: pointer;
}

.reusable_file_drop_zone, .client_file_drop_zone {
    background-color: #C5E3BE;
}

.sortable_reusable_file_drop_zone, .sortable_client_file_drop_zone {
    background-color: #C5E3BE;
    height: 45px;
}

.reusable_file_dropped, .client_file_dropped {
    background-color: #E7E9BF;
}

.draggableLinkIcon {
    position: absolute;
    margin-left: 125px;
    margin-top: 7px;
    display: block;
    width: 20px;
    height: 20px;
    cursor: pointer;
    background-image: url('../images/link_icon.png');
    background-repeat: no-repeat;
    background-size: 20px;
}

.edit_file_folder {
    display: inline-block;
    width: 17px;
    height: 17px;
    margin: 3px 0 0 12px;
    background-image: url('../images/editIcon.png');
    background-repeat: no-repeat;
    background-size: 17px;
    cursor: pointer;
}

.top_section_selected {
    padding-left: 40px;
    background-image: url('../images/top_section_selected.png');
    background-repeat: no-repeat;
    background-size: 22px;
    background-position: 10px 9px;
    cursor: default;
}

.top_section_selected:hover {
    padding-left: 40px;
    background-image: url('../images/top_section_selected.png');
    background-repeat: no-repeat;
    background-size: 22px;
    background-position: 10px 9px;
    cursor: default;
}

.reusable_title, .client_title {
    font-weight: bold;
    padding: 6px;
    color: #777;
    font-size: 13px;
    display: inline-block;
    float: left;
}

.reusable_input_wrap, .client_input_wrap {
    width: 60% !important;
    display: inline-block;
    float: right;
}

.reusable_title_input_wrap, .client_title_input_wrap {
    background: transparent;
    transition: all ease-in-out 180ms;
    padding: 3px;
    margin-bottom: 3px;
}

.reusable_title_input_wrap:hover, .client_title_input_wrap:hover {
    background: #EBEBEB;
}

.fileSortable {
    min-height: 8px;
}

.fileSortable.hover {
    min-height: 40px;
    background: #F7F6E0;
}

.submit_new_page_button_wrapper {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 83%;
    padding: 12px;
    background: rgba(229, 229, 229, 0.9);
    border: #0649ad 1px solid;
    border-color: rgba(56, 56, 255, 0.4);
    box-sizing: border-box;
}

.floatingModuleIconWrapper {
    position: absolute;
    bottom: 15px;
    right: 15px;
    transition: all cubic-bezier(0, 1.11, 1, 1.27) 350ms;
    z-index: 2000;
}

.floatingModuleIconWrapper:hover {
    bottom: 15px;
}

.floatingModuleIcon {
    width: 100px;
    height: 100px;
    border-radius: 24px;
    background-image: url('../images/add_update_modules_icon.png');
    background-repeat: no-repeat;
    background-size: 100px;
    box-shadow: #000 0 0 15px -5px;
    z-index: 1000;
    cursor: pointer;
}

.floatingModuleIconCover {
    position: absolute;
    top: 0;
    width: 100px;
    height: 100px;
    border-radius: 24px;
    z-index: 1001;
    background: rgba(255, 255, 255, 0.4);
}

.floatingModuleNumber {
    width: 23px;
    height: 23px;
    background: #2F31A6;
    color: #fff;
    border: #fff 2px solid;
    text-align: center;
    border-radius: 20px;
    position: absolute;
    top: -6px;
    right: -4px;
    z-index: 1000;
}

.addUpdateModuleWrapper {
    width: 0px;
    height: 80px;
    padding: 4px 8px 4px 4px;
    box-sizing: border-box;
    position: absolute;
    right: 10px;
    bottom: 8px;
    background: #fff;
    border: #B5B5B5 1px solid;
    border-radius: 8px;
    box-shadow: #000 0 0 15px -5px;
    z-index: -1;
    overflow: hidden;
}

.addModuleIcon {
    display: inline-block;
    width: 68px;
    height: 68px;
    background-image: url('../images/add_module_icon.jpg');
    background-repeat: no-repeat;
    background-size: 68px;
    cursor: pointer;
}

.floatingModuleLoading {
    width: 90px;
    height: 90px;
    position: absolute;
    top: 5px;
    left: 5px;
    background-image: url('../images/loading.gif');
    background-repeat: no-repeat;
    background-size: 90px;
}

#addModulePlaceHolder {
    display: inline-block;
    width: auto;
    margin: 0 4px;
}

#r-createSectionGlobal, #cs-createSiteMapGlobal {
    display: none;
}

#r-editCustomCssJs, #cs-editSiteMapCssJs {
    display: none;
}

.shared_global {
    display: inline-block;
    position: absolute;
    width: 20px;
    height: 20px;
    margin-left: 10px;
    margin-top: 0px;
    background: url('../images/shared_global.png');
    background-size: 100%;
    background-repeat: no-repeat;
}


/* Client Sitemap */
.cs-menu-wrapper {
    position: fixed;
    z-index: 100;
    display: block;
    width: 101%;
    background: #ccc;
    border-bottom: #bbb 1px solid;
    margin-left: -8px;
    top: -100px;
}

.cs-menu-wrapper .cs-menu {
    display: inline-block;
    padding: 20px 0px;
    width: 11%;
    box-sizing: border-box;
    text-align: center;
    border-right: #bbb 1px dotted;
    transition: all ease-in-out 150ms;
    position: relative;
}

.cs-menu-wrapper .cs-menu:hover, .cs-selected {
    background: #e5e5e5;
    cursor: pointer;
}

.cs-menu-wrapper .cs-menu:hover:after, .cs-selected:after {
    content: "";
    width: 0;
    height: 0;
    border-right: 20px solid transparent;
    border-left: 20px solid transparent;
    border-top: 20px solid #e5e5e5;
    position: absolute;
    top: 60px;
    left: 50%;
    margin-left: -15px;
}

.cs-menu-wrapper .cs-menu:hover:before, .cs-selected:before {
    content: "";
    width: 0;
    height: 0;
    border-right: 21px solid transparent;
    border-left: 21px solid transparent;
    border-top: 22px solid #bbb;
    position: absolute;
    top: 60px;
    left: 50%;
    margin-left: -16px;
}

.add_reusable_content {
    display: inline-block;
    width: auto;
    padding: 5px 10px 5px 24px;
    font-size: 12px;
    background-image: url('../images/addIconGreen.png');
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: 3px 5px;
    opacity: 1;
    transition: all ease-in-out 180ms;
    position: relative;
    margin-left: 15px;
    margin-top: 20px;
}

.add_reusable_content:hover {
    cursor: pointer;
    opacity: 0.7;
}


/* ImageExtravaganza */
.image_file_selected {
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 3px;
    left: 3px;
    background-image: url('../images/add_slider_checkmark.png');
    background-repeat: no-repeat;
}


#confirmOverlay {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: url('../images/confirm/ie.png');
    background: -moz-linear-gradient(rgba(11, 11, 11, 0.1), rgba(11, 11, 11, 0.6)) repeat-x rgba(11, 11, 11, 0.2);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(11, 11, 11, 0.1)), to(rgba(11, 11, 11, 0.6))) repeat-x rgba(11, 11, 11, 0.2);
    z-index: 100000;
}

#confirmBox {
    background: url('../images/confirm/body_bg.jpg') repeat-x left bottom #e5e5e5;
    width: 460px;
    position: fixed;
    left: 50%;
    top: 50%;
    margin: -190px 0 0 -230px;
    border: 1px solid rgba(33, 33, 33, 0.6);

    -moz-box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
    -webkit-box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
    box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
}

#confirmBox h1,
#confirmBox p {
    font: 26px/1 'Cuprum', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
    background: url('../images/confirm/header_bg.jpg') repeat-x left bottom #f5f5f5;
    padding: 18px 25px;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.6);
    color: #666;
}

#confirmBox h1 {
    letter-spacing: 0.3px;
    color: #888;
}

#confirmBox p {
    background: none;
    font-size: 16px;
    line-height: 1.4;
    padding-top: 35px;
}

#confirmButtons {
    padding: 15px 0 25px;
    text-align: center;
}

#confirmBox .conbutton {
    display: inline-block;
    background: url('../images/confirm/buttons.png') no-repeat;
    color: white;
    position: relative;
    height: 33px;

    font: 17px/33px 'Cuprum', 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;

    margin-right: 15px;
    padding: 0 35px 0 40px;
    text-decoration: none;
    border: none;
}

#confirmBox .conbutton:last-child {
    margin-right: 0;
}

#confirmBox .conbutton span {
    position: absolute;
    top: 0;
    right: -5px;
    background: url('../images/confirm/buttons.png') no-repeat;
    width: 5px;
    height: 33px
}

#confirmBox .blue {
    background-position: left top;
    text-shadow: 1px 1px 0 #5889a2;
}

#confirmBox .blue span {
    background-position: -195px 0;
}

#confirmBox .blue:hover {
    background-position: left bottom;
}

#confirmBox .blue:hover span {
    background-position: -195px bottom;
}

#confirmBox .gray {
    background-position: -200px top;
    text-shadow: 1px 1px 0 #707070;
}

#confirmBox .gray span {
    background-position: -395px 0;
}

#confirmBox .gray:hover {
    background-position: -200px bottom;
}

#confirmBox .gray:hover span {
    background-position: -395px bottom;
}