/*----------------------Loading--------------------*/
.box-loading {
    width: 100vw;
    height: 100vh;
    margin: 0;
    background-color: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    position:fixed;
    z-index:99999999;
    opacity:0.5;
}
.box-loading >.loading {
    width: 5vmax;
    height: 5vmax;
    border-right: 4px solid #ffffff;
    border-radius: 100%;
    animation: spinRight 800ms linear infinite;
    &:before, &:after {
        content: '';
        width: 6vmax;
        height: 6vmax;
        display: block;
        position: absolute;
        top: calc(50% - 3vmax);
        left: calc(50% - 3vmax);
        border-left: 3px solid #ffffff;
        border-radius: 100%;
        animation: spinLeft 800ms linear infinite;
    }
    &:after {
        width: 4vmax;
        height: 4vmax;
        top: calc(50% - 2vmax);
        left: calc(50% - 2vmax);
        border: 0;
        border-right: 2px solid #ffffff;
        animation: none;
    }
}
@keyframes spinLeft {
    from {transform:rotate(0deg);}
    to {transform:rotate(720deg);}
}
@keyframes spinRight {
    from {transform:rotate(360deg);}
    to {transform:rotate(0deg);}
}
/*------------------End loading------------------*/

.w-5{width:5%}
.w-8{width:8%}
.w-10{width:10%}
.w-12{width:12%}
.w-15{width:15%}
.w-20{width:20%}
.w-25{width:25%}
.w-30{width:30%}
.w-35{width:35%}
.w-40{width:40%}
.w-45{width:45%}
.w-50{width:50%}
.w-55{width:55%}
.w-60{width:60%}
.w-65{width:65%}
.w-70{width:70%}
.w-75{width:75%}
.w-80{width:80%}
.w-85{width:85%}
.w-88{width:88%}
.w-90{width:90%}
.w-95{width:95%}
.size-06{font-size:.6rem}
.size-07{font-size:.7rem}
.size-08{font-size:.8rem}
.size-09{font-size:.9rem}
.size-1{font-size:1rem}
.size-11{font-size:1.1rem}
.size-12{font-size:1.2rem}
.size-13{font-size:1.3rem}
.size-14{font-size:1.4rem}
.text-red{color:red}
.text-black{color: black}
.text-green{color: green}
a:hover{text-decoration:none !important}
a{color:#063a4c !important}
body{background-color:#e9edf0}
a{color: #000;font-size: 1rem}
p{font-size:.9rem}
strong{font-weight:600}
label{font-weight:600}
.container{max-width: 100% !important}
.container-color-white{background-color:#fff;padding:1rem}
.title_indust {float: left;height: 32px;background-color: #b5b8ba;text-align: center;line-height: 30px;color: #FFF;font-weight: bold;}
.box-info-footer{line-height:1}
.box-four-home:last-child{border-bottom:0px !important}
.box-detail img{max-width:100% !important;max-height:100%}
.box-detail table{max-width:100% !important}
.form-text {display: block;margin-top: 0.25rem;font-size: 14px;color: #dc3545 !important;}
.btn-user-edit{position:absolute;top:.2rem;right:.2rem;cursor:pointer}
.box-user-info{line-height:1.8}
.box-acti-operation{position:absolute;right:5px;top:5px;}
.border-activities-home{border-right:10px solid #e9edf0}
.btn-sm{padding: .1rem .3rem !important}
.title-header-box{background-color:#c5c8c5}
/*.custom-select-project>span .select2-selection {border-radius:2rem 0 0 2rem !important}*/
.row_nineteen{margin-left:-19px !important;margin-right:-19px !important}
.font-weight-bold{font-weight:600 !important}
.content-detail table{max-width: 100% !important}
.content-detail img{max-width: 100% !important;height:auto !important}
.form-search-mobile>.select2-container--default .select2-selection--single{padding:.46875rem .1rem !important}
.text-title-1{overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.text-title-2{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.2;height:2.6rem}
.box-show-captcha{background-color:black;color:white;width:10%;padding:7.5px;text-align:center;font-size:15px;float:left}
.box-input-captcha{width:25%;float:left;text-align:center;border-radius:0px}
.pagination{margin-top:.5rem !important;margin-bottom:.5rem !important}
.box-contact-icon{position:absolute;top:40px;right:10px}
.border-bottom-dotted{border-bottom:1px dotted #ccc}
.object-fit-cover{object-fit:cover}
.object-fit-contain{object-fit:contain}
.h-100{height:100%}
.custom-height-image img{object-fit:cover !important;height:170px !important}
.delete-image-multi{position: absolute;right: 0;top: 0;cursor:pointer;}
.box-status-proser{position:absolute;width:100%;top:35%}
.box-status-proser strong {background-color:#ccc;opacity:0.8;color:red;padding:10px 15px}
.btn-search-mobile {position:absolute;right:0;height:38px;z-index:99}
.btn-search-mobile button{background-color:#0d5a86;color:#fff}
/*-------------Custom select2-----------------*/
.select2-container--default .select2-selection--single {
    border: 1px solid #ced4da;
    padding: .46875rem .75rem;
    height: calc(2.25rem + 2px);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height:20px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    top:60%;
}
/*Province*/
.ProvinceIDM>.select2-search{width:300% !important;background-color:#fff;margin-left:-100%}
#select2-ProvinceIDM-results{width: 300%;background-color:#fff;max-height:300px;border:1px solid #ccc;margin-left: -100%}
#select2-ProvinceIDM-results li{border-bottom:1px dotted #ccc}
#select2-ProvinceIDM-results > .select2-dropdown{border:0px !important}

/*District*/
.DistrictIDM>.select2-search{width:300% !important;background-color:#fff;margin-left:-200%}
#select2-DistrictIDM-results{width: 300%;background-color:#fff;max-height:300px;border:1px solid #ccc;margin-left: -200%}
#select2-DistrictIDM-results li{border-bottom:1px dotted #ccc}
#select2-DistrictIDM-results.select2-dropdown{border:0px !important}

/*Street*/
.StreetIDM>.select2-search{width:300% !important;background-color:#fff;margin-left:-200%}
#select2-StreetIDM-results{width: 300%;background-color:#fff;max-height:300px;border:1px solid #ccc;margin-left: -200%}
#select2-StreetIDM-results li{border-bottom:1px dotted #ccc}
#select2-StreetIDM-results.select2-dropdown{border:0px !important}

/*Cate*/
.CateIDM>.select2-search{width:300% !important;background-color:#fff}
#select2-CateIDM-results{width: 300%;background-color:#fff;max-height:300px;border:1px solid #ccc}
#select2-CateIDM-results li{border-bottom:1px dotted #ccc}
#select2-CateIDM-results.select2-dropdown{border:0px !important}
#select2-cateId-results{max-height:400px}
/*-------------End custom select2-----------------*/

#proviceR .select2{width: 100% !important}
#districtR .select2{width: 100% !important}
#wardR .select2{width: 100% !important}
#streetR .select2{width: 100% !important}
/*-------------See more-----------------*/
#seeMore p.collapse:not(.show) {overflow: hidden;display:-webkit-box;-webkit-line-clamp:10;-webkit-box-orient:vertical}
#seeMore p.collapsing {min-height: 100px !important;}
#seeMore span.collapsed:after  {content: '+ Xem thêm';}
#seeMore span:not(.collapsed):after {content: '- Thu gọn';}
#seeMore span{color:blue;cursor:pointer}
/*------------Custome menu desktop---------------*/

/*------------Custom search auto-----------------*/
.inputTypeaheadDesk .twitter-typeahead{width:100% !important}
.inputTypeaheadDesk .tt-menu{width:100%;border:1px solid #ddd;background:#fff}
.inputTypeaheadDesk .tt-menu .header-title-search{padding: .5rem 1rem;background-color: #f8f9fa}
.inputTypeaheadDesk .tt-menu .list-result-search{padding: .5rem 1rem;width:100%;border-bottom:1px dotted #ccc}
.inputTypeaheadDesk .tt-menu .list-result-search-construct{padding: .3rem .5rem;width:100%;border-bottom:1px dotted #ccc}
.inputTypeaheadDesk .tt-menu .list-result-search-construct img{width:100%;height:40px;object-fit:cover}
.inputTypeaheadDesk .tt-menu .list-result-search-construct .image-result{width:10%}
.inputTypeaheadDesk .tt-menu .list-result-search-construct .title-result{width:87%;line-height: 1.2 !important;margin-left:3%}

.inputTypeaheadMobi >.twitter-typeahead{width:100% !important}
.inputTypeaheadMobi .tt-menu{width:100%;border:1px solid #ddd;background:#fff}
.inputTypeaheadMobi .tt-menu .header-title-search{padding: .5rem 1rem;background-color: #f8f9fa}
.inputTypeaheadMobi .tt-menu .list-result-search{padding: .5rem 1rem;width:100%;border-bottom:1px dotted #ccc}
.inputTypeaheadMobi .tt-menu .list-result-search-construct{padding: .3rem .5rem;width:100%;border-bottom:1px dotted #ccc}
.inputTypeaheadMobi .tt-menu .list-result-search-construct img{width:100%;height:40px;object-fit:cover}
.inputTypeaheadMobi .tt-menu .list-result-search-construct .image-result{width:15%}
.inputTypeaheadMobi .tt-menu .list-result-search-construct .title-result{width:82%;line-height: 1.2 !important;margin-left:3%}

.requestSurvey >.twitter-typeahead{width:100% !important}
.requestSurvey .tt-menu{width:100%;border:1px solid #ddd;background:#fff}
.requestSurvey .tt-menu .header-title-search{padding: .5rem 1rem;background-color: #f8f9fa}
.requestSurvey .tt-menu .list-result-search{padding: .5rem 1rem;width:100%;border-bottom:1px dotted #ccc}
.requestSurvey .tt-menu .list-result-search-construct{padding: .3rem .5rem;width:100%;border-bottom:1px dotted #ccc}
.requestSurvey .tt-menu .list-result-search-construct img{width:100%;height:50px;object-fit:cover}
.requestSurvey .tt-menu .list-result-search-construct .image-result{width:10%}
.requestSurvey .tt-menu .list-result-search-construct .title-result{width:88%;line-height: 1.2 !important;margin-left:2%}
.requestSurvey .tt-menu .list-result-search-construct .btn-result{color:#fff}
/*------------End custom search auto-------------*/

#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    display: block;
    position: relative;
    z-index: 999; 
}
#cssmenu:after,
#cssmenu > ul:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li.active > a {
    color: #fff;
    width:180px;
}
#cssmenu > ul > li.has-sub > a::after {
    position: absolute;  
    top: 10px;
    right: 0px;
    width: 7px;
    height: 7px;
    border-bottom: 2px solid #000;
    border-right: 2px solid #000;
}
#cssmenu > ul > li.has-sub:hover > a::after {
    border-color: #e43d1c;
}
#cssmenu ul ul {
    position: absolute;
    left: -9999px;
}
#cssmenu li:hover > ul {
    left:-1rem;
}
#cssmenu.align-right li:hover > ul {
    right: 0;
}
#cssmenu ul ul ul {
    margin-left: 105.7%;
    top: 0;
}
#cssmenu.align-right ul ul ul {
    margin-left: 0;
    margin-right: 100%;
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {
    color: #e43d1c; 
}
#cssmenu ul ul li.has-sub > a::after {
    position: absolute;
    top: 20px;
    right: 10px;
    width: 4px;
    height: 4px;
}
#cssmenu .child {width:337% !important}
#cssmenu .child img{width:100%;height:88px;object-fit:contain}
/*------------Edn custom menu desktop------------*/

#bars{position:absolute;z-index:999}
#bars{margin-top:2rem}
#bars ul{background-color:#f5f5f5;list-style:none}
#bars ul li a i{font-size:20px;margin-right:5px}
#bars ul li a strong{margin-left:5px}
.logo{max-width:100%;object-fit:contain}
.logo-mobi{max-width:70%;object-fit:contain}

/*-------------End See more-----------------*/
@media only screen and (max-width: 1220px) {
    .container 
    {
        width:100%;
    }
}
@media only screen and (max-width: 1080px) {
    .w-5{width:8% !important}
    .w-90{width:84% !important}
}
@media only screen and (max-width: 810px) {
    .w-5{width:10% !important}
    .w-90{width:85% !important}
}
@media only screen and (max-width: 767px) {
	.custon-padding-none 
	{
		padding: 0px;
	}
    .container {
        width: 100%;
        padding-right: 5px;
        padding-left: 5px;
        margin-right: auto;
        margin-left: auto;
    }
    .border-activities-home{border-right:0px}
    .box-show-captcha{background-color:black;color:white;width:40%;padding:7.5px;text-align:center;font-size:15px;float:left}
    .box-input-captcha{width:60%;height:38px !important;float:left;text-align:center;border-radius:0px}
    .text-title-1{overflow: hidden;display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
    .content-detail img{max-width: 100% !important;height: auto !important;}
    .content-detail table{max-width: 100% !important;height: auto !important;}
    .row-custom-margin-sm{margin-left:0px !important;margin-right:0px !important}
    .col-custom-padding-sm{padding-left:0px !important;padding-right:2px}
    .content-detail{max-width:100% !important}
}