/*hover tooltip*/
.wrap-control-element button i.icon-blr-envelope-open:hover::before{
    content: "Gửi đến email";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-envelope-open:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;    
}


.wrap-control-element button i.icon-blr-form:hover::before{
    content: "Sửa trường thông tin";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-form:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}



.d-flex button i.icon-blr-arrow-up:hover::before{
    content: "Chuyển lên";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.d-flex button i.icon-blr-arrow-up:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}

.d-flex button i.icon-blr-arrow-down:hover::before{
    content: "Chuyển xuống";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.d-flex button i.icon-blr-arrow-down:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}

.d-flex button i.icon-blr-section-bg:hover::before{
    content: "Thay hình nền";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.d-flex button i.icon-blr-section-bg:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}

.d-flex button i.icon-blr-settings:hover::before{
    content: "Thiết lập khối";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.d-flex button i.icon-blr-settings:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}


.d-flex button i.icon-blr-code:hover::before{
    content: "Sửa mã HTML";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.d-flex button i.icon-blr-code:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}


.d-flex button i.icon-blr-copy:hover::before{
    content: "Sao chép";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.d-flex button i.icon-blr-copy:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}


.d-flex button i.icon-blr-trash:hover::before{
    content: "Xóa";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.d-flex button i.icon-blr-trash:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}



.wrap-control-element button i.icon-blr-picture:hover::before{
    content: "Thay ảnh";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-picture:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}



.wrap-control-element button i.icon-blr-link:hover::before{
    content: "Sửa liên kết";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-link:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}


.wrap-control-element button i.icon-blr-settings:hover::before{
    content: "Thiết lập";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-settings:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}


.wrap-control-element button i.icon-blr-drop:hover::before{
    content: "Thuộc tính";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-drop:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}



.wrap-control-element button i.icon-blr-clapboard:hover::before{
    content: "Hiệu ứng";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-clapboard:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}

.wrap-control-element button i.icon-blr-copy:hover::before{
    content: "Sao chép";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-copy:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}


.wrap-control-element button i.icon-blr-trash:hover::before{
    content: "Xóa";
    font-weight: bold;
    background: #2398dd;
    text-align: center;
    color: white;
    font-style: normal;
    width: auto;
    padding: 3px 7px;
    height: 29px;
    font-size: 12px;
    top: -37px;
    left: -1px;
    position: absolute;
    z-index: 999999999;
    border-radius: 5px;
}
.wrap-control-element button i.icon-blr-trash:hover::after{
    content: " ";
    width: 0;
    height: 0;
    border-left: 1px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2398dd;
    position: absolute;
    top: -8px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    
}

/*nut sua khoi*/
.page-mode-project-pages li div.style_div {
    display: none;
}
        
.style_div {
     top: 25px;
     right:0px;
     position: absolute;
     z-index: 30;
     background: #F2F2F2;
     width:45px;
     border-bottom-left-radius: 20px;
     border-top-left-radius: 20px;
     height: 40px;
     padding-top:3px;
     cursor: pointer;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
     
}

.goup_hide {
    display: none;
}

.style_div img {
    float: right;
    margin-right: 6px;
    width: 34px;
    height: 34px;
}
/*end*/
li[data-group='navigations'] label.label-section{
    display: none !important;
}

.style_node {   
    background: #189effe0;
    width: 100%;
    padding: 5px;
    cursor: pointer;
    font-size: 13px;         
}

.style_node span{
        margin: 0 auto;
}

li[data-group='navigations'] .style_node{
width: 183px;
padding: 9px;
}
/*hover outline*/    

.go_relative{
    position: relative;
} 
.navbar-nav .go_relative{
    position: inherit;
}
h1.spr-outline-control::before{
            content: "Tiêu đề H1";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -30px;
            color: white;
            left: -1px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
        h2.spr-outline-control::before{
            content: "Tiêu đề H2";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -30px;
            color: white;
            left: -1px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
         h3.spr-outline-control::before{
            content: "Tiêu đề H3";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -30px;
            color: white;
            left: -1px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
         h4.spr-outline-control::before{
            content: "Tiêu đề H4";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -30px;
            color: white;
            left: -1px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
         h5.spr-outline-control::before{
            content: "Tiêu đề H5";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -30px;
            color: white;
            left: -1px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
         
        p.spr-outline-control::before{
             content: "Văn bản";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -30px;
            color: white;
            left: -1px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
        button.spr-outline-control::before{
            content: "Nút bấm";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -32px;
            color: white;
            left: -3px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
        a.spr-outline-control::before{
            content: "Liên kết";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -32px;
            color: white;
            left: -3px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
        form.spr-outline-control::before{
            content: "Biểu mẫu FORM";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -30px;
            color: white;
            left: -1px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
        input.spr-outline-control::before{
            content: "Ô nhập";
            background:  #08aae6;
            width: auto;
            padding-left: 7px;
            padding-right: 7px;
            padding-top: 7px;
            height: 30px;
            font-size: 12px;
            top: -30px;
            color: white;
            left: -1px;
            position: absolute;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            z-index: 999999999;
        }
/*end hover*/
/**
 * CONTENTS
 *
 * Common
 * Icons
 * Drag sections
 * Preloader
 * Modal popup
 * Magnific
 * Main
 */
/**
goup
*/
.main > ul > li.section-item .wrap-control{
    outline: 2px solid #08aae6 !important;
}

.spr-outline-control{
    outline: 2px solid #08aae6 !important;
}

.spr-oc-show{
    outline: 1px solid rgba(0, 0, 0, 0.9) !important;
}

.wrap-control, .wrap-control-element{
    background-color: rgba(68, 68, 68, 0.2) !important;
}

.wrap-control .wrapper{
box-shadow: 0 0 10px #3e3e3e !important;
}