@charset "utf-8";
@import url("../vendor/bootstrap-select/1.5.4/bootstrap-select.min.css");

img{
    user-drag: none; 
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

body, html{font-family: 'Montserrat', sans-serif;}
body, html{height:100%;}
body{
    overflow: hidden;
    background:#e6e6e6 !important;
    font-size:13px;
}

.shareitem_head{
    float: left;
    margin: 25px 2px !important;
    padding: 0px;
    color: #fff !important;
    border-radius: 3px;
    font-size:15px;
}



.subHubs{
    float: left;
    width: 100%;
}

.subHubs .lineLin{
    float: left;
    width: 100%;
    display: flex;
    align-content: center;
    justify-content: space-between;
    padding: 2px 9px 2px 32px;
    opacity:0.75;
    position: relative;
}

.labelUsersList.ELtrashS.ELtrashS{
    background: #f3ffa1 !important;
}

.subHubs .lineLin > div{
    font-size: 11px;
    align-items: center;
    display: flex;
}

.subHubs .lineLin > div a{
    margin-left:3px;
    width:auto;
}

/*
.subHubs .send_access_email{
    display:none !important;
} */




div .src + a[data-download]{
    display:none;
}

/*
.isHiddenCat{
    opacity:0.5;
    border-left:solid 3px #F00; 
}
*/

#selecterType{
    width: 100%;
    border: 0;
    padding: 9px 8px;
    height: 50px;
    color: blue;
}

.toggHid{
    border: solid 1px #f00 !important;
    border-right: 0px !important;
    height: 33px !important;
    border-left: 0px !important;
}

/*
.companiesAtt{
    float: left;
    padding: 4px 30px 0px 10px;
    color: #ababab;
    font-size: 0.75em;
    font-style: italic;
    display:none;
}
*/

.dragHoverX_cat.hideATT{
    display:none !important;
}




.testu.hide input,
.testu.hide label input{
    display:none !important;
}

/*
.companiesAtt img{
    width: 40px;
    height: auto;
}
*/
    
.mssag_tr{
    float: left;
    width: 100%;
    padding: 0px 8px 5px 36px;
    font-size: 0.8em;
    font-style: italic;
    color: #f70;
}

.pingleft{
    float: left;
    width:100%;
}

.searchSubcat{
    float: left;
    width: 100%;
    border: 0px;
    border-bottom: dotted 1px #a2a2a2;
    padding: 6px 13px 6px 13px;
    height: 34px;
    margin-bottom: 3px;
}

.searchSubcat:focus, .searchSubcat:active{outline:0;}


.capsaitem img.isSvg, .capsaitem img.isSvg:hover {
    width: 100%;
    max-width: 85px;
    padding: 20px;
    float: none;
    border-radius: 2px;
    border: solid 0px #e2e2e2;
    position: relative;
    left: 50%;
    transform: translateX(-50%) !important;
}

.categoriesUserCrea{
    margin: 15px 0px 10px 0px;
    float: left;
    width: 100%;
    border-bottom: solid 1px #ccc;
    padding-bottom: 16px;
}

.send_user_link{
    border: solid 1px #ccc;
    float: left;
    padding: 17px 22px;
    border-radius: 3px;
    margin-top: 10px;
    margin-bottom: 30px;
}

.shareitem_head i{
    padding:10px 12px 10px 12px;
}

#moveItems_head i{
    padding:0;
}

.showCatsUser a{
    float:left;
    padding:6px 10px;
    color:#b1b1b1;
    border:solid 1px #b1b1b1;
    border-radius:3px;
}

.showCatsUser a i{
    color: #b1b1b1;
    float: left;
    font-size: 1.4em;
    margin-right: 5px;
}

.showCatsUser a, .showCatsUser a:hover{
    color: #555;
    text-decoration: none;
    background: #fff;
    font-size: 10px;
    padding: 6px 19px;
}

.checkedOK .refere.draggeritem{
    display:none;
}

@keyframes littleAnim {
  0%   {transform:scale(1)}
  50%  {transform:scale(1.1)}
  100% {transform:scale(1)}
}

.littleAnim{
    animation-name: littleAnim;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}


@keyframes bounceV {
    0%   {transform:scale(1);}
    50%  {transform:scale(1.15);}
    100% {transform:scale(1);}
  }
  

.bouNcing{
    animation-name: bounceV;
    animation-duration: 0.5s;
    animation-iteration-count: 2;
    opacity:1;
    z-index:999999;
}


#moveItems_head{
    cursor:grab;
    background: #fff !important;
    color: #000 !important;
    box-shadow: 0px 0px 20px rgb(0 0 0 / 40%);
    border-radius: 9999px;
    height: 50px;
    width: 50px;
    font-size: 1.7em;
    padding: 11px 14px;
    margin-top: 18px !important;
    margin-right: 25px !important;
}

.seeUsersSharing:focus, .seeUsersSharing_out:focus{
    outline:0;
}

.SeeDetail{
    position:relative;
}

.seeUsersSharing, .seeUsersSharing_out{
    background: orange;
    border: 0;
    color: #fff;
    padding: 4px 7px 3px 7px;
    border-radius: 2px;
}

.usjo{
    opacity:0; height:0;
}

/*
.yyy{
    
    background-image: url(../custom/img/spinner.gif);
    background-size: 100px;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #fff;
    height: 100%;
}*/

.seeUsersSharing_out{
    opacity:0.6;
}

.agafador{
    float: right;
    padding: 2px;
    opacity: 0.3;
    cursor: grab;
}

.waiting_background{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    opacity:0.7;
    z-index:999999;
    display:none;
}

#toggleDragg{
    display:none;
}

.modal_drop_upload{
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 998;
    background-color: rgba(255,255,255,0.65);
    background-image: url(../../view/custom/img/uplo.png);
    background-size: 150px;
    background-position: center center;
    background-repeat: no-repeat;
}

.modal_drop_upload div{
    position:absolute;
    height:100% !important;
    width:100% !important;
}

.versions_available{
    position: absolute;
    z-index: 99999;
    right: 10px;
    top: 10px;
    font-size: 17px;
    background: #fff;
    padding: 11px 9px 9px 10px;
    border-radius: 99px;
    height: 40px;
    width: 40px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.4);
}



/* Reset for ALL children of .upload_wrapper */
.modal_drop_upload .upload_wrapper div {
    position: static !important;
    height: auto !important;
    width: auto !important;
}

/* Ensure the wrapper itself is visible */
.modal_drop_upload .upload_wrapper {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 90% !important;
    max-width: 800px !important;
    max-height: 80vh !important;
    height: auto !important;
    background: white !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    z-index: 1000000 !important;
}


.modal_drop_upload .plupload_filelist_footer{
    height: 0px !important;
    position: static !important;
    bottom: -58px;
    overflow:hidden !important;
}

.modal_drop_upload .plupload_scroll .plupload_filelist{
    height: 100% !important;
    position: static !important;
}

.modal_drop_upload .plupload_scroll .plupload_filelist li{
    height: 100% !important;
    position: static !important;
}

.modal_drop_upload li.plupload_droptext {
    height: 100%;
    position: static !important;
}

#upload_listen{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999999;
    height: auto;
    max-width: 600px;
    width: 100%;
}

#CloseIdo{
    display: inline-block;
    padding: 33px 21px 27px 21px;
    background: #f1f1f1;
    color:blue !important;
    cursor:pointer;
}

.dragg_to_item_get{
    display:none;
    color:blue !important;
}

.TOShari{
    transform:scale(0.9) !important;
    opacity:0.5 !important;
}


.formUpItemSee{
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    z-index:99999999999;
    left: 0;
}


.modal_drop_upload_v{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    z-index: 998;
    background-color: rgba(255,255,255,0.87);
    background-image: url(../../view/custom/img/uplo.png);
    background-size: 150px;
    background-position: center center;
    background-repeat: no-repeat;
}

.modal_drop_upload_v .plupload_file_action{
    display: none !important;
}

.modal_drop_upload_v div{
    position:absolute;
    height:100% !important;
    width:100% !important;
    opacity: 0;
}



.modal_drop_upload_v .plupload_filelist_footer{
    height: 0px !important;
    bottom: -58px;
    overflow:hidden !important;
}

.modal_drop_upload_v .plupload_scroll .plupload_filelist{
    height: 100% !important;
}

.modal_drop_upload_v .plupload_scroll .plupload_filelist li{
    height: 100% !important;
}

.modal_drop_upload_v li.plupload_droptext {
    height: 100%
}

#upload_listen_v .plupload_filelist {
    margin: 0;
    padding: 0;
    list-style: none;
    border-radius: 3px;
    overflow: hidden;
    border: 0;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
    max-height:500px;
    overflow-y:scroll;
}

#upload_listen_v .plupload_filelist li{
    padding: 11px 14px;
    height: 43px;
    font-size: 0.9em;
}

#upload_listen_v .plupload_file_status img.imgloadcharge{
    width:30px;
    height:30px;
    border-radius:999px;
    margin-top: -6px;
}

#upload_listen_v .plupload_done img.imgloadcharge{
    opacity:0;
}





/* Modal Drop Upload - Full screen overlay */
#modal_drop_upload {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgb(236 236 236 / 78%) !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    backdrop-filter: blur(5px);
}

/* Hide when not dragging */
#modal_drop_upload.hide {
    display: none !important;
}

/* Upload wrapper - centered container */
#modal_drop_upload .upload_wrapper {
    width: 90%;
    max-width: 800px;
    max-height: 80vh;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Scrollable content area */
#modal_drop_upload .upload_wrapper.scroll {
    overflow-y: auto;
    padding: 25px;
}

/* Progress container styling */
#modal_upload_progress {
    background: #f8f9ff !important;
    border: 2px dashed #4361ee !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
}

/* Progress header */
#modal_upload_progress > div:first-child {
    font-size: 18px !important;
    color: #1e293b !important;
    border-bottom: 2px solid #e2e8f0 !important;
    padding-bottom: 12px !important;
    margin-bottom: 20px !important;
    font-weight: 600 !important;
}

/* Individual file progress items */
[id^="progress_container_"] {
    background: white !important;
    border-radius: 10px !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02) !important;
}

/* File name */
[id^="progress_container_"] > div:first-child {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 12px !important;
}

.file_link {
    color: #1e293b !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    font-size: 14px !important;
}

.file_link:hover {
    color: #4361ee !important;
}

/* Percentage badge */
[id^="percent_"] {
    background: #eef2ff !important;
    color: #4361ee !important;
    padding: 4px 12px !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    border: 1px solid #dbeafe !important;
}

/* Progress bar container */
[id^="progress_container_"] > div:nth-child(2) {
    width: 100% !important;
    height: 8px !important;
    background: #f1f5f9 !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    margin: 10px 0 !important;
}

/* Progress bar fill */
[id^="progress_"] {
    height: 100% !important;
    background: linear-gradient(90deg, #4361ee, #6d8cff) !important;
    border-radius: 4px !important;
    transition: width 0.3s ease !important;
}

/* File info row (speed, remaining, uploaded) */
[id^="progress_container_"] > div:last-child {
    display: flex !important;
    justify-content: space-between !important;
    margin-top: 8px !important;
    font-size: 12px !important;
    color: #64748b !important;
}

/* Individual info spans */
[id^="speed_"], [id^="remaining_"], [id^="uploaded_"] {
    background: #f8fafc !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
}

/* Hide the old html5 container if it's in the way */
#html5_jhcor8iucdm18jirnmq19t64_container {
    display: none !important;
}

/* Animation for when files are added */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

[id^="progress_container_"] {
    animation: slideIn 0.3s ease;
}

/* Complete state */
[id^="progress_"].complete {
    background: #10b981 !important;
}

[id^="percent_"].complete {
    background: #d1fae5 !important;
    color: #065f46 !important;
}

.related_versions {
    width: 100% !important;
    margin: 0px auto !important;
    background: #dadada;
    padding: 0px !important;
    list-style:none;
    float: left;
}


.related_versions li{
    float: left;
    margin-left: 6px;
    margin-right: 6px;
    margin-bottom: 18px;
    margin-top: 6px;
    width: calc(12.5% - 16px);
    border-bottom: solid 0px #ccc;
    list-style: none;
    position: relative;
}

.related_versions img{
    width: 100%;
    height: auto;
    border-radius: 8px;
    background:none;
    cursor:pointer;
}

.related_versions img.smpl{
    width: 44px;
    position: absolute;
    right: -6px;
    top: -20px;
    border-radius: 999px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
}

.relPrev{
    position: absolute;
    top: 50%;
    font-size: 4em;
    right:2%;
}

.relNext{
    position: absolute;
    top: 50%;
    font-size: 4em;
    left:2%;
}



.related_versions img:hover{
    opacity:0.6;
}

.lookingUpl{
    position: absolute;
    z-index: 999;
    left: 50%;
    transform: translate(-50%,-50%);
}


.checkboxToBig input[type="checkbox"] {
    -moz-appearance: auto !important;
}


@media (max-width: 768px){
    .related_versions li{
        width: calc(50% - 25px);
    }
}


.watch_item_modal .casing.fullHeight{
    min-height: 100vh !important;
}

.watch_item_modal .casing.fullHeight .mainImg {
    max-height: initial !important;
}

/* HIDDEN, NOT REMOVED (2026-10-10, his words: "el boton reduce seria mejor sacarlo pra siempre en todo. solo escondelo y ya esta"): «Expand» / «Reduce» is not drawn in any detail - the library's,
   the caja fuerte's, the landing's demo. The markup and the handlers stay (core/item/watch_item.php, core/vk/vault_detail.php, view/js/script.js); a file opens in the stage its view gives it. */
.expandBig_style{
    display: none !important;
    position: absolute;
    z-index: 99999;
    top: 25px;
    left: 29px;
    background: blue;
    color: #fff;
    border-radius: 23px;
    padding: 12px 20px;
    cursor:pointer;
}

.expandBig_style:hover{
    opacity:0.7;
}

.watch_item_modal .casing .expandBig_style .reste{
    display:none;
}

.watch_item_modal .casing .expandBig_style .exte{
    display:block;
}

.watch_item_modal .casing.fullHeight .expandBig_style .reste{
    display:block;
}

.watch_item_modal .casing.fullHeight .expandBig_style .exte{
    display:none;
}

.watch_item_modal .casing.fullHeight .overlayerPic{
    display:none;
}

.watch_item_modal .casing.fullHeight .mainImg {
    max-width: 830px;
}


.ScherFrm.formBin {
    float: left !important;
    margin: 0px 20px 0px 7px !important;
    display: flex;
    align-items: center;
}












.changeIMG{
    background: blue;
    padding: 13px 17px 12px 17px;
    color: yellow;
    border-radius: 10px;
    margin-right: 2px;
    margin-left: 1px;
    float: right;
}

.details .changeIMG{
    background: blue;
    padding: 7px 12px 6px 12px;
    color: yellow;
    border-radius: 5px;
    margin-right: 5px;
    margin-left: 0px;
    float: left;
}





.Currentl{
    border-radius: 9px;
    position:relative;
}

.Currentl img{
    opacity: 0.4 !important;
}

.Currentl:after{
    bottom: -19px;
    content: "";
    opacity: 1 !important;
    border-radius: 9px;
    position: absolute;
    height: 5px;
    width: 100%;
    border-radius: 3px 3px 0px 0px;
    background: #0c00ff;
    right: 50%;
    border: solid 0px #fff;
    transform: translate(50%);
}

.Opac{
    opacity:0 !important;
}

.SpecialBig{
    height: auto !important;
    width: auto !important;
}

.checkboxToBig{
    padding: 15px 11px;
    border-bottom: dotted 0px #ccc;
    width: 100%;
    margin-top: 10px;
}

.checkboxToBig input[type=checkbox]{
    margin-right:10px;
}


.checkboxToBig input[type="checkbox"] {
    -moz-appearance: auto !important;
}

.checkboxToBig input[type=checkbox] {
    height: initial;
    width: initial;
}


ul.menucatstop{
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}


ul.menucatstop::-webkit-scrollbar {
    display: none;
}

.menucatstop.userListBox li {
    opacity: 0;
    transition: all 0.1s ease;
}
.menucatstop.userListBox.scroll-ready li{
    opacity: 1;
}

.MAINitem{
    border: solid 0px blue !important;
    border-radius: 12px;
}

.MAINitem:after{
    bottom: -30px;
    content: "";
    opacity: 1 !important;
    border-radius: 9px;
    position: absolute;
    height: 25px;
    width: 25px;
    border-radius: 30px;
    background: rgb(61, 184, 0);
    right: 50%;
    border: solid 4px #fff;
    transform: translate(50%);
}

#loadmenuCats.loading {
    opacity: 0.5;
    pointer-events: none;
}
#loadmenuCats.loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    border: 2px solid #ccc;
    border-top-color: #333;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }


/* Upload Progress Bars */
.plupload_file_progress {
    width: 100%;
    height: 6px;
    background: #e0e0e0;
    border-radius: 3px;
    margin-top: 5px;
    overflow: hidden;
}

.plupload_file_progress_bar {
    height: 100%;
    background: linear-gradient(90deg, #6c5ce7, #a29bfe);
    border-radius: 3px;
    transition: width 0.2s ease;
    width: 0%;
}

.plupload_file_percent {
    font-size: 11px;
    color: #666;
    margin-left: 8px;
    min-width: 35px;
    display: inline-block;
}

.plupload_filelist li {
    padding: 8px 10px;
    border-bottom: 1px solid #eee;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.plupload_file_name {
    flex: 1;
    min-width: 150px;
}

.plupload_file_status {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 200px;
}

.plupload_file_size {
    color: #999;
    font-size: 12px;
    margin-left: 10px;
}

/* Upload complete state */
.plupload_done .plupload_file_progress_bar {
    background: #00b894;
}

/* Upload error state */
.plupload_failed .plupload_file_progress_bar {
    background: #e74c3c;
}

/* Uploading animation */
.plupload_uploading .plupload_file_progress_bar {
    background: linear-gradient(90deg, #6c5ce7, #a29bfe, #6c5ce7);
    background-size: 200% 100%;
    animation: progressShine 1.5s ease infinite;
}

@keyframes progressShine {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

ul.menucatstop{
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}

ul.menucatstop::-webkit-scrollbar {
    display: none;
}
















#upload_listen .plupload_filelist {
    margin: 0;
    padding: 0;
    list-style: none;
    border-radius: 3px;
    overflow: hidden;
    border: 0;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
    max-height:500px;
    overflow-y:scroll;
}

#upload_listen .plupload_filelist li{
    padding: 11px 14px;
    height: 43px;
    font-size: 0.9em;
}

#upload_listen .plupload_file_status img.imgloadcharge{
    width:30px;
    height:30px;
    border-radius:999px;
    margin-top: -6px;
}

#upload_listen .plupload_done img.imgloadcharge{
    opacity:0;
}


#modal_drop_upload .plupload_scroll{
    opacity:1;
}

.appendcount{
    margin-left: 15px;
}


#modal_drop_upload .plupload_scroll > div{
    position: relative !important;
    height: auto !important;
    width: 100% !important;
    opacity: 1;
}

.subcatStandingOut{
    background: #57aafb !important;
    position: absolute;
    width: 3px;
    right: 0;
    top: 0;
    height: 100%;
}

.catStandingOut{
    background: #0479e9 !important;
    position: absolute;
    width: 3px;
    left: 0;
    top: 0;
    height: 100%;
}


#upload_modal_single .imagesample{
    position: absolute;
    height: 82%;
    transform: translateX(-50%);
    left: 50%;
}

.isWebsite{
    border: solid 2px #00db00;
}

.carregarUplo{
    margin-bottom: 0px;
    margin-top: 0px;
    border: solid 3px #efefef;
    float: left;
    width: calc(100% - 30px) !important;
    margin-left: 7px;
}

.filesicon{
    position: absolute;
    right: 0;
    bottom: 41px;
    top: initial;
    z-index: 99;
    padding: 17px;
    opacity: 0.6;
}

.btn_upload_modal_single{
    float: left !important;
    width: auto;
    height: auto !important;
    z-index: 99;
    right: 0;
    padding: 7px 9px;
    position: absolute;
    background: #fff;
    border-radius:0px 0px 0px 4px;
}

.btn_upload_modal_single i{
    font-size: 1.1em !important;
}

a.create_space, a.delete_web_space{
    border:0;
    font-size: 0.8em;
    padding: 10px;
}

.linea.nameurl a{
    font-size: 0.8em;
    float:left;
    border-top:dotted 1px #ccc;
    padding-top:5px;
    margin-top:5px;
    width:100%;
}

.moreopaci{
    opacity:1 !important;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}

#update_users_cat .capsausers, 
#update_users_share .capsausers,
#shareitems_users .capsausers,
#adduserjob .capsausers{
    border: solid 1px #ccc;
    border-radius: 3px;
    padding: 20px;
    background: #f5f5f5;
    float:left;
    margin-bottom: 20px;
    width:100%;
    margin-top: 5px;
}


.capsausers_2{
    border: solid 1px #eaeaea;
    border-radius: 3px;
    padding: 20px;
    background: #fff;
    float:left;
    margin-bottom: 20px;
    margin-top: 5px;
}

.assigncat ul.menucatstop{
    float: left;
    position: relative;
    width: 100%;
    height: auto;
    overflow: visible;
    box-shadow: none;
}

.capsausers input, .capsausers_2 input{
    margin-right: 8px;
    margin-top:6px;
    margin-left:3px;
}

#users_result_cats label{
    border-bottom: solid 1px #ccc;
    padding-bottom: 7px;
    margin-bottom: 0px;
}

#users_result_cats label:last-child{
    border-bottom: solid 0px #ccc;
}

#createuser .modal-content, 
#assign_categories .modal-content, 
#modifyuser .modal-content, 
#modal_delete_user .modal-content, 
#modal_pw .modal-content, 
#userscat .modal-content, 
#editcat .modal-content, 
#addcat .modal-content, 
#delcat .modal-content, 
#delpr .modal-content, 
#editpr .modal-content, 
shareitem_users .modal-content, 
#info_edit_modal .modal-content,
#info_edit_modal_d .modal-content,
#systemsettings .modal-content,
#shareitem .modal-content,
#shareitems_users .modal-content,
#modaleditlist .modal-content,
#modaldeletegroup .modal-content,
#masiv .modal-content,
#addpr .modal-content{
    margin: 20px;
    width: calc(100% - 40px) !important;
    padding: 40px 40px 40px 40px;
}

.nameComTop{
    position: absolute;
    left: 54px;
    font-size: 13px;
    margin-top: 23px;
}

.EmptyCats{
    float: left;
    top: 159px;
    z-index: 9999;
    font-size: 20px;
    opacity: 1;
    line-height: 42px;
    margin-left: 29px;
    background: #fff;
    color: #b0b0b0;
    position: fixed;
}

.DirectItems{
    font-size: 12px;
    float: none !important;
    color: #8e00ec;
    margin-right: 2px;
}

.DirectItems:hover{
    text-decoration:none;
}

.btnShowCats{
    cursor:pointer;
}

#userscat h3, #editcat h3, #addcat h3, #delcat h3{
    margin-top: 10px;
    margin-bottom: 25px;
}
    
@media (min-width: 768px){
    #userscat .modal-dialog, 
    #shareitems_users .modal-dialog,
    #shareitem_users .modal-dialog,
    #adduserjob .modal-dialog{
        width: 900px;
    }
}

.addcat_button{
    background:#e6e6e6;
    margin: 0;
    width: 100% !important;
    font-size: 1em;
    padding: 0 !important;
    cursor: pointer;
}

.addcat_button i{
    margin-right: 0px;
    font-size: 1em;
    padding: 10px 13px !important;
    background: #1767d4;
    margin: 0;
    color: #fff;
    float: right;
    cursor: pointer;
    width: auto !important;
}


.valnum{
    float: none;
    margin-bottom: 0;
    padding-top: 0;
    margin-left: 8px;
    background: #fff;
    margin-top: 0px;
    position: absolute;
    bottom: auto;
    bottom: -27px;
    position: relative;
}

li.plupload_droptext {
    height: 242px !important;
}

.contbarprog{
    width: 100%;
    float: left;
    margin-top: 10px;
    margin-bottom: -5px;
    background: #dadada;
    border-radius: 9px;
    overflow: hidden;
}

.heightupl{
    height:2px !important;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    overflow:hidden;
}

.plupload_scroll .plupload_filelist {
    height: 262px !important;
}

#triggerU, #triggerU_s{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: url(../../view/custom/img/uplo.png) !important;
    background-repeat: no-repeat !important;
    background-size: 115px !important;
    background-position: center center !important;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

#trigger_each{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    /*background: url(../../view/custom/img/uplo.png) !important;*/
    background-repeat: no-repeat !important;
    background-size: 115px !important;
    background-position: center center !important;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

video:focus{outline:0;}

.moxie-shim.moxie-shim-html5{
    z-index:-1 !important;
}


.triggerU_add{
    bottom: 8px !important;
    top: initial !important;
    height: 38px !important;
    left: 0 !important;
    width: 100px !important;
    opacity:0;
}

.trigger_each_add{
    bottom: 8px !important;
    top: initial !important;
    height: 38px !important;
    left: 0 !important;
    width: 100px !important;
    opacity:0;
}

.modal_drop_upload.UploadPart{
    background-image: url(../../view/custom/img/uplo_.png) !important;
}

.labelUsersList.StainsHud{
    background: yellow !important;
    border-right: solid 4px blue!important;
    margin-top: -5px;
    padding-top: 12px !important;
} 

.labelUsersList.StainsHud .desplegar_s_comp{
    color: blue !important;
    opacity: 1 !important;
}

/*
.SpecialBacklog > label{
    background: #fffdaf !important;
    margin-top: 1px !important;
}*/

.OpiR a i{
    color: blue !important;
}

li.plupload_droptext {
    background:none !important;
}

#triggerU:hover, #triggerU_s:hover{
    background-size: 135px !important;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.uploadlayer{
    position:relative;
}

.plupload_content{
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    overflow:hidden;
    height:300px;
}

.buttonsbm{
    float: right;
    margin-right: 66px;
    border-radius: 3px;
    padding: 7px 15px;
    background: #333;
    border: 0;
    color: #fff;
}

.desplegar_s{
    float: left;
    right: 0;
    margin-top: 0px;
    margin-right: 12px;
    font-size: 20px;
    cursor: pointer;
    margin-left: 3px;
}

.editcat_menu{
    float: left;
    width: 100%;
    /*background: #f1f1f1;*/
    margin-top: 0px;
    padding:0px 6px 0px 30px;
}

.editcat_menu i{
    padding:7px 8px;
    float:right;
}

.linkweb{
    background: #969696;
    padding: 3px 6px !important;
    color: #fff;
    border-radius: 3px;
}

.detta .linkweb{
    top: 0 !important;
    background: inherit !important;
    right: 0 !important;
    height: 37px !important;
    color: #000;
    width: 79px !important;
    padding: 11px !important;
    border-radius: 0px !important;
    text-align: center;
}

.linelabel{
    max-width: 234px;
    float: left;
    display: block;
    margin-top: 1px;
}

.subulcat .linelabel {
    max-width: 160px;
    margin-left: 27px;
}

.roundonline{
    height: 20px;
    width: 20px;
    position: relative;
    right: 0px;
    left: initial;
    float: right;
    margin: 6px;
    border-radius: 20px;
}

header{
    width: 100%;
    float: right;
    z-index: 9999;
    position: fixed;
    /* no shadow: in _design-refs/sidebar-header-borde-2026-09-27.png the header meets what is
       under it on a clean line. Measured 2026-09-28: this one smeared 20px of grey over the
       first rows of the sidebar and the grid. */
    height: 90px;
    left: 50%;
    top: 0%;
    transform: translateX(-50%);
    overflow:visible !important;
    width: calc(100% + 1px);
}

.logoColComp{
    float: left;
    height: 25px;
    width: auto;
    margin-top: 47px;
    margin-left: 11px;
    margin-bottom: 10px;
}

#deleteicon{
    margin-right: 15px;
}

.isajobcat{
    float: right;
    margin: 0;
    width: auto;
    background: #e6e6e6;
    position: absolute;
    right: 0;
    top: 40px;
    z-index: 99;
    padding: 3px 3px 3px 3px;
    border-radius: 4px 0px 0px 4px;
    font-size: 14px;
}

.isajobcat i{
    color: #fff !important;
    float: right;
    padding: 6px 3px 9px 5px;
    width: auto;
    font-size: 17px !important;
}

.massivedownload{
    padding: 14px 11px;
    float: left;
    text-align: center;
    color: #FFF;
    width: 86px;
    font-size: 14px;
    right: -10px;
    position: fixed;
    bottom: 40px;
    border: solid 10px #fff;
    border-radius: 16px 0px 0px 16px;
}

.titlehead .imguser{
    float: left;
    width: auto;
    height: 33px;
    border-radius:999px;
}

.plupload_header, .plupload_filelist_header{display:none;}

.takeopacity{
    opacity:0.5;
}

.lupaactive{
    position: absolute;
    top: 0;
    right: 3px;
    background: #fff;
    padding: 18px;
    border-radius: 0px 3px 3px 0px;
    border-left: dotted 1px #ccc;
    display:block;
}

.contimagedet{
    float: left;
    max-height:initial;
    overflow: hidden;
    border-radius: 3px;
}

.details .imagesample{
    max-width:35px;
    float:left;
}

.details .imagesmalldet{
    padding:0;
}

.details .imagesmalldet .word{
    float: left !important;
    padding: 10px 3px;
    width: auto;
}

audio{
    width: 100%;
}

.capsaitem audio{
    width: calc(100% + 30px);
    margin-top: -10px;
    margin-left: -16px;
    background: #f1f3f4;
}

.icongroup{
    position: absolute;
    top: -28px;
    color: #a2a2a2;
    left: 12px;
    font-size: 15px !important;
}

header a i, button i{
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    opacity:1;
    text-decoration:none !important;
	
}

#approve:focus{
    border:0;
    outline:0;
}


.companyMembers.inle{
    width: auto;
    float: right;
    height: 24px;
    display: flex;
}

.companyMembers.inle .operators{
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
}

.companyMembers.inle .operators a{
    margin: 0;
    color: #c1c1c1 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 0px 0px 5px !important;
    width: 21px !important;
}

.noOverflowHidden{
    overflow:visible !important;
}

.cred{
    float:left;
    width:100%;
    font-size:10px;
    margin-bottom: 8px;
}

.expl_black{
    display:none;
}

.notifc .fa-check-circle{
    position: absolute;
    top: -4px;
    right: -7px;
    padding: 2px;
    font-size: 17px;
    color: red;
    border-radius: 16px;
    background: #fff;
}

.notifc{
    position: relative;
    right: 0px;
    top: 3px;
    float: left;
    font-size: 22px;
    border-radius: 99999px;
    padding: 1px 1px;
    height: auto;
    color: white;
}

.chat_notifications_container{
    position:fixed;
    z-index: 909999;
    right:-110%;
    bottom:20px;
    width:250px;
}

.effectslow{
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
}

.chat_notifications{
    position:relative;
    width:100%;
    border-radius:5px;
    background:#fff;
    color:#000;
    border:solid 1px #ccc;
    text-align:left;
    padding: 10px 10px 5px 10px;
    margin-bottom: 8px;
    float:left;
    text-align:left;
}

.chat_notifications:hover, .chat_notifications:focus, .chat_notifications:visited, .chat_notifications:active{
    color:#000;
    text-decoration:none;
}

.chat_notifications .text{
    float: left;
    margin-top: 9px;
    width: 100%;
    border-top: dotted 1px #ccc;
    padding-top: 5px;
}

.chat_notifications i{
    margin-right:6px;
}

.minusright{
    right:1% !important;
}

header .secondline button, header .secondline button:focus{
    outline:0;
    border-radius:0px;
}

header .secondline{
    width: 100%;
    float: left;
    /* the frame, measured off _design-refs/sidebar-header-borde-2026-09-27.png on 2026-09-28:
       9px across the top, 6px down the left, and a 33px corner. The colour comes from the
       installation's own sheet (view/custom/styles_custom.php); these are the fallback. */
    border-top: solid 10px var(--vk-brand, #0F52FF);   /* his, 2026-09-28 */
    border-left: solid 10px var(--vk-brand, #0F52FF);  /* 10 to paint 9, the same as the top: the bar starts at -1px */
    height: 100%;
    margin-top: 0px;
    /* background: #FFF; */
    border-bottom: solid 0px #d68500;
    border-radius: 32px 0px 0px 0px;
}

header .slogan{
    width: auto; 
    float: left;
    height: 90px;
    padding-top: 20px;
    padding-left: 0px;
    letter-spacing: -2px;
    font-size: 34px;
    font-weight: bold;
    text-align:left;
    z-index: 999999;
    position: relative;
    opacity: 0.35;
}

header .secondline form{ float:left; }
header .secondline form{ float: right; width:80%; font-family: 'Montserrat', sans-serif; }
header .secondline form input[type="submit"]{ float:left; padding: 26px 20px 25px 20px; color: #000; width: 35%; text-align: center; border-radius:0; outline:0; border-left:solid 1px #f2f2f2; background:#FFF; height: 72px;}
header .secondline form input[type="search"]{
    float: left;
    margin-left: 13px;
    padding: 18px 20px 12px 24px;
    color: #404040;
    width: calc(75% - 13px);
    background: #FFF;
    text-align: left;
    border-radius: 0;
    font-size: 22px;
    font-family: 'Montserrat', sans-serif;
    border: 0;
    border-radius: 0px 0px 0px 0px;
    height: 80px;
    box-shadow: inset 0px 0px 0px;
    border-radius: 0px 31px 0px 0px;
    margin-left: -1px;
    padding-right: 20px;
    float: left;
    width: calc(100% - 67px);
}
header .secondline form input[type="search"]::-webkit-input-placeholder { color: #404040; }
header .secondline form input[type="search"]:-moz-placeholder { color: #404040;  }
header .secondline form input[type="search"]::-moz-placeholder { color: #404040;  }
header .secondline form input[type="search"]:-ms-input-placeholder { color: #404040; }

header .secondline button{ 
    float: right;
    padding: 15px 0px 12px 0px;
    color: #000;
    width: 67px;
    text-align: center;
    border-radius: 0px 3px 0px 0px;
    border-left: solid 0px #f2f2f2;
    font-size: 21px;
    height: 72px;
}

.nopadding{padding:0;}

.sidebar .regular{
    float:none !important;
    border:0;
    padding: 7px 3px 7px 0px;
}

.regular{font-family: 'Montserrat', sans-serif;}

.grupoa img{ border-radius:0px !important; }

.secondline .logo{
    width: auto;
    float: left;
    height: 80px;
    margin-left: 0;
    padding: 0px 5px;
    text-align: center;
    position: relative;
    z-index: 99998;
    border-left: solid 0px #fbce07;
    display: flex;
    align-items: center;
}

.secondline .logo img.logoStandard{
    height: 100%;
    float: left;
    width: auto;
    margin-top: 0px !important;
    padding-right: 26px;
    padding-left: 16px;
    max-width: 224px;
}

.communicators{
    color:#000 !important;
    padding-top: 0px;
    top: 0px;
    width: 100%!important;
    position: relative;
}

header ul.menucatstop > li:not(:hover)  li:focus {
    left: 9999em;
    position: relative;
}

.titlem{
    display: block;
    margin-top: 7px;
    font-size: 29px;
    margin-left: 20px;
    font-weight: inherit;
    letter-spacing: 0px;
    font-weight: 100;
}

.sidebar .details a:hover{ background:#000; }
.sidebar .details a:hover i{ color:#FFF !important; }



.modal{z-index:9999999999 !important;}


.nopadding{padding:0;}
.sidebar{
    padding:0px 7px 19px 7px !important;
    border-radius: 2px;
    position:fixed;
    width: auto;
    margin-right: 12px;
}

.sidebar.detta{ position:static; }

.whiteback{ background:#e6e6e6; }

.sidebar span{
    padding: 10px 15px 10px 13px;
    border-bottom: solid 1px #ececec;
    border-left: solid 4px #f7f7f7;
}
.sidebar .details span{
    float:left;
    width:100%; 
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    font-size:12px;
    background: #FFF;
}
  
.sidebar .details i{
    margin-right:4px;
    color: #b1b1b1;
    width: 14px;
}
.sidebar .details a{
    position: absolute;
    bottom: 20px;
    top: initial;
    background: #FFF;
    border-top: solid 1px #ececec;
    border-right: solid 1px #ececec;
    border-left: solid 1px #ececec;
    right: 6px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    width: 50px;
    margin: 0;
    border-radius: 0px;
}

.sidebarblock{
    width: 67px;
    position: fixed;
    top: 90px;
    right: 0;
    z-index: 1002;
    background: #0065b3;
    border-radius: 0px 0px 0px 15px;
}

#trigg_disco:hover,
#trigg_disco{
    border-radius: 0px 0px 0px 15px;
}


.sidebarblock a{
    padding: 14px 11px;
    float: left;
    text-align: center;
    color: #FFF;
    position:relative;
    width: 100%;
    font-size: 14px;
}

/* The bar's tooltips (Bootstrap's, inserted in this 67 px column). A label of several words wrapped
   there while Bootstrap measured it, was placed by that narrow width, then drawn on one line over its
   own button, taking its clicks. Measured 2026-09-26 at 1900 px: "Personas con enlace" and "Webs
   publicas" covered their icons. His words: "sus tooltips se solapan en los botones. arreglalo".
   On one line from the start, so placed where it fits, and never in the way of a click. */
.sidebarblock .tooltip{ pointer-events: none; }
.sidebarblock .tooltip-inner{ max-width: none; white-space: nowrap; }


.checkedOK, .ui-selecting{
    opacity:0.5 !important;
}


.sidebar .details a i{
    font-size: 20px;
    margin-right: 0;
    padding-top: 5px;
    color:#000 !important;
}
.detailphoto{
    padding-top: 104px;
    padding-bottom: 80px;
    padding-left: 5px;
    padding-right: 73px;
    float: right;
    width: calc(83% - 76px);
}
.detailphoto .imgset img{
    float:left;
    width:100%;
    border-radius:3px;
    height:auto;
    border: solid 1px #ececec;       
}


.secondsidebar{
    margin-top:0px;
    padding:3px;
}

.relateds{
    float:left;
    width:100%;
    height:auto;
}

.relateds .capsa_rel{
    float: left;
    width: calc(33% + 1px);
    height: auto;
    padding: 1%;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.relateds .capsa_rel a{
    background: #fff;
    float: left;
    border-radius: 3px 3px 0px 0px;
    width: 100%;
}

.relateds .capsa_rel:hover{
    opacity:0.5;
}

.relateds img{
    float:left;
    width:100%;
    height:auto;
    height:auto;
    border-radius:2px;
}

.contChooserSelect{
    margin-left: 0px !important; 
    margin-right:18px !important; 
    margin-top: 18px; float:right; 
    border-radius:2px; 
    display: flex;
    align-items: flex-start;
    font-size:12px !important;
    flex-direction: column;
    width:auto;
    border-radius: 2px 6px 6px 2px;
    overflow:hidden;
    height:42px;
}

.contChooserSelect.morwHH{
    height:auto !important;
    border-radius: 2px 6px 6px 6px !important;
}

.btnPublisSite{
    padding: 8px 15px;
    background: #e3e3e3;
    border-radius: 5px;
    color: black;
    margin-top: 10px;
    font-size: 11px;
}
.btnPublisSite i{
    margin-right: 4px;
}
.btnPublisSite:hover{
    color: black;
    text-decoration: none;
}

.contChooserSelect.BF{
    width: 42px;
    margin-right: 3px !important;
    background: #f7f7f7;
    border-radius: 6px 2px 2px 6px !important;
    height: 42px !important;
    display: flex;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row;
    font-size: 13px !important;
}

.contChooserSelect.BF i{
    color:#ccc;
}

.contChooserSelect .lineChoo{
    width: 100%;
    padding: 14px 17px;
    background: #f7f7f7;
    color: #000;
    border-top:solid 0px #ccc;
    display: flex;
    align-content: center;
    justify-content: space-between;
    cursor: pointer;
}

.contChooserSelect .CRR.lineChoo{
    font-weight: bold !important;
}


.contChooserSelect .lineChoo:hover{
    text-decoration: none;
    background: #eee;
}


.contChooserSelect .lineChoo i{
    font-size: 16px;
    margin-left:12px;
}

.contChooserSelect .lineChoo:fist-child{
    border-top:solid 0px #ccc;
}


.titliFilelist.spaRound{
    background: blue;
    color: #fff;
    padding: 4px 
    px
    ;
    margin: 0;
    text-align: center;
    margin-left: 13px;
    border-radius: 4px;
    height: 34px;
    display: flex !important;
    align-items: center;
    justify-content: space-around;
}


.contChooserSelect label{
    padding: 0px 14px;
    margin-bottom: 0;
}

.contChooserSelect select{
    border: 1px solid #ccc !important; 
    border-radius:2px; font-size: 12px !important;
}


header .secondline button{
    color: #FFF;
    background: #0065b3;
    height: 80px;
}

.footerfonsbaix{
    background: #424242;
    float: right;
    position: relative !important;
    text-align: center;
    color: #fff;
    font-size: 12px;
    padding-bottom: 32px;
    padding-top: 30px;
    text-shadow: 0px 1px 0px #000;
}
.sidebar .details a i{ color: #e67600;}


a{outline-color: #DD1D21 !important; outline: 0 !important;}
h1{outline:0;}
span{outline:0;}
/*useful menu mobile*/
.grupoa a:focus img {
    transform: scale(1.1) !important;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

body{
	overflow-x: hidden;
	-ms-scroll-limit: auto 0px auto 0px !important;
}
.owl-carousel{
    padding-top: 0px;
    background: none;
    width: 100% !important;
    margin-right: 0%;
    margin-left: 0%;
}
.owl-carousel .item{
    height:100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}


@keyframes linegrow {
  from {width:0%;}
  to {width:100%;}
}

/* The element to apply the animation to */


.lineload{
    height:2.3px;
    width:100%;
    position:absolute;
    top:-1px;
    left:0;
    animation-name: linegrow;
    animation-duration: 1s;
    animation-iteration-count:1;
}





.containernews div.conty{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(16.65% - 10px), 1fr));
    grid-gap: 10px;
}

.capsaitem{
    width:calc(16.65% - 10px);
    margin-bottom:10px;
    margin-left:5px;
    margin-right:5px;
    overflow:hidden;
    border-radius:8px;
    visibility: hidden;
}

.capsaitem.WiDerItem {
    width: calc(33.3% - 10px) !important;
}

.capsaitem.WiDerItemPlus{
    width: calc(66.6% - 10px) !important;
}


.containernews.is-visible-items .capsaitem { 
    visibility: visible;
}

.adddiii{
    transform: inherit !important;
}

.effect{
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.capsaitem img{
	transform: scale(1.05) !important;
	-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.capsaitem a:hover  img{
    transform: scale(1.15) !important;
}
.capsaitem img{width:100%; float:left; border-radius: 2px; border: solid 1px #e2e2e2; height: auto !important;}
.capsaitem a i{color:#000;}
.capsaitem a i{
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	-o-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
	}
.capsaitem a:hover i{
	color:#888;
}
.capsaitem .details{
    float: left;
    width: 100%;
    padding: 14px 14px 14px 14px;
    background: #FFF;
    position: relative;
    z-index: 5;
    border-top: solid 5px #000;
    margin-top: 0px !important;
    border-radius: 0px 0px 0px 0px;
}



.preloader {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    left: 0;
    width: 100% !important;
}
.loader {
    width: 80px;
    height: 80px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.loader img{
    width: 100%;
    height: auto;
}

.relateds .image img:hover {
    transform: initial !important;
}

a, body, h1, h2, h4, h5, li, li a, p, span {
    font-family: inherit !important;
}

.bodyindex .owl-carousel{display:block !important;}

.bodyindex{overflow:visible !important;}

.tdwn{
    padding: 10px 16px 6px 16px;
    border-radius: 0px 0px 0px 0px;
    position: absolute;
    bottom: initial;
    width: initial;
    top: -1px;
    right: -1px;
    width: 50px;
    font-size: 19px;
    background: #e6e6e6;
    overflow: hidden;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.tdwnlupa{
    padding: 10px 16px 6px 16px;
    border-radius: 0px 0px 0px 3px;
    position: absolute;
    bottom: initial;
    width: initial;
    top: -1px;
    right: 50px;
    width: 50px;
    font-size: 19px;
    background: #e6e6e6;
    overflow: hidden;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.lightbox{
    height: 100%;
    overflow-y: scroll;
    position: fixed;
    top: 0px !important;
    padding-top:20px !important;
    padding-bottom:20px !important;
}

.shareitem {
    padding: 4px 16px 6px 16px !important;
    border-radius: 0px 0px 0px 3px;
    position: absolute;
    bottom: initial;
    width: initial;
    top: 15px;
    right: -1px;
    width: 39px;
    bottom: 60px !important;
    font-size: 19px;
    border-bottom: solid 1px #e8e8e8;
    background: #e6e6e6;
    overflow: hidden;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.form-inline .form-group{float: right;}

header .secondline form {
    width: auto;
    margin-right:-1px;
    height: 80px;
}

header .secondline .form-group {
    margin-bottom: 0px;
    float: left;
    margin-top:0px;
    margin-left:0px;
}

header .secondline form.formbeginning input[type="submit"], .forgotpassword{
    color: #fff;
    border-radius: 4px;
    width: auto;
    margin-top: 29px;
    text-align: center;
    outline: 0;
    border: 0px;
    margin-left:5px;
    border-left: solid 1px #f2f2f2;
    background: #000;
    height: auto;
    padding-left:12px;
    padding-right:12px;
    padding-top:7px;
    padding-bottom:7px;
}

header .secondline form.arrar {
    width: auto;
    margin-right:20px;
}

header .secondline .arrar .form-group {
    margin-bottom: 15px;
    float: left;
    margin-top:29px;
    margin-left:-1px;
}

header .secondline form.arrar input[type="submit"], .forgotpassword{
    color: #fff;
    border-radius: 4px;
    width: auto;
    margin-top: 29px;
    text-align: center;
    outline: 0;
    border: 0px;
    margin-left:0px;
    border-left: solid 1px #3c3c3c;
    background: #000;
    height: auto;
    padding-left:12px;
    padding-right:12px;
    padding-top:7px;
    padding-bottom:7px;
}

.buttonupslider:hover{ background:none !important; }

h5 a:hover{
    text-decoration:none;
    opacity:0.6;
}

header .secondline button:focus {
    outline: 0 !important;
    background: #0065b3;
}

.forgotpassword:hover, .forgotpassword:focus{
    background:#000 !important;
}

.sharegroup{
    float: left;
    position: relative;
    top: 24px;
    padding: 2px 10px 1px 10px !important;
    text-align: center;
    margin-right: 10px;
    font-size: 22px;
    width: auto;
    border: solid 1px #ccc;
    border-radius: 3px;
    color: #000;
    background: #fff;
    overflow:hidden !important;
}

.botonet_notif{
    overflow: hidden;
    float: left;
    position: relative;
    height: 67px;
}

.bootstrap-tagsinput{
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

input[type=checkbox]{
  -ms-transform: scale(1.7); /* IE */
  -moz-transform: scale(1.7); /* FF */
  -webkit-transform: scale(1.7); /* Safari and Chrome */
  -o-transform: scale(1.7); /* Opera */
  padding: 0px;
  height:0px;
  width:0px;
  color:#FFF;
}

.dropdwn{position: absolute;
    top: 100px;
    height: 100px;
    overflow: hidden;
    width: 97px;
    z-index: 99;
    margin: 0;
    padding: 0;
    right: 0px;
    top: initial;
    border-radius:2px;
    overflow:hidden;
    bottom: 34px;
}

.dropdwn li a{
    position: relative;
    float: left;
    width: 100%;
    padding: 7px 11px;
    font-size: 12px;
    border-top: solid 1px #0c0c0c;
    border-bottom: solid 1px #737373;
    background: #424242;
    color: #fff;
}

.dropdwn li:first-child a{border-top: solid 0px #0c0c0c;}
.dropdwn li:last-child a{border-bottom: solid 0px #0c0c0c;}
.dropdwn li a:hover{text-decoration:none; background:#555;}
.dropdwn li{float: left; width: 100%;}
.buttondrop{position:relative; float:left; width:100%; padding:10px; border-bottom:solid 1px; background:#ccc; color:#fff;}
.imgset.sharinglist a{
    width:100px;
    float:left;
    background:#FFF;
}

#resetform{
    position: absolute;
    margin-left: -58px;
    padding: 5px 15px;
    height: 34px;
    color: #a5a5a5;
    background: #fff;
    border-radius: 4px;
    font-size: 19px;
    cursor: pointer;
    z-index: 1;
    right: 8px;
    border: solid 1px #ccc;
}

.imgset.sharinglist .sharinglistitem{
    width: 100%;
    float: left;
    margin-bottom: 10px;
    background: #f5f5f5;
    border-radius: 3px;
    overflow: visible;
    position: relative;
    box-shadow: 2px 4px 12px #ccc;
}

.imgset.sharinglist img{
    width:100px;
    float:left;
    border: 0px;
    border-radius: 0px;
}

.inf ul{
    float: left;
    list-style: none;
    margin: 0px;
    padding: 0px 0px;
    border-left: solid 1px #f3f3f3;
    width: calc(100% - 100px);
}

.inf ul li{
    padding: 5px 12px;
    width: 100%;
    font-size: 12px;
}

.bckwardfolder, .bckwardfolder:hover{
    text-decoration: none;
    margin-right: 11px;
    color: #fff;
    border-radius: 4px;
    padding: 4px 19px;
}

.inf ul li i{
    color:#ccc;
    margin-right:7px;
}

.inf ul li:last-child{
    border-bottom:solid 0px #ccc;
}

.inf{position:relative;}
.sharinglist .del{
    float: left;
    color: #424242;
    width: auto !important;
    position: absolute;
    bottom: 1px;
    right: 0px;
    padding: 0px 22px;
    font-size: 22px;
    z-index: 90;
}

.sharinglistitem .changest{
    background: #fff !important;
    border-left: solid 1px #ececec !important;
    border-radius: 0px !important;
}

.sharinglistitem .changest:focus{
    outline:0;
}

.desplin{
    float:right;
    color:#000;
    font-size:1.5em;
}

.desplout{
    float:right;
    color:#000;
    font-size:1.5em;
}

/*
#approved_change:after {
    content:"";
    position:absolute;
    width:100%;
    bottom:1px;
    z-index:-1;
    transform:scale(.9);
    box-shadow: 0px 0px 8px 2px #000000;
}
*/

.task{background: #fff; border-top:solid 1px #efefef;}

.casemessages{
    background: #fff;
    padding: 0px;
    margin: 7px 0px 10px 0px;
    margin: -8px 0px 1px 0px;
    height: 100%;
    overflow-y: scroll;
    float: left;
    border-radius: 3px;
    width: 100%;
    position: relative;
    background-image: url(../custom/img/cenefachat.svg);
    background-size: 60px;
    background-repeat: repeat;
    background-color: #f7f7f7;
}

#loadversions.state{ margin-bottom:10px !important; }

.chat textarea{
    border: 0;
    padding: 16px 17px 16px 17px;
    height: 82px;
    border-radius: 0px 0px 4px 4px;
}

.chat button{
    background: #424242;
    border: 0;
    width: 100%;
    border-radius: 0px 0px 4px 4px;
    color:#fff;
}

.sharingdetail .inf ul {
    float: right;
    list-style: none;
    margin: 0px;
    padding: 0px 0px;
    width: calc(100% - 111px);
    border-radius: 4px;
    background: #FFF;
    overflow: visible;
    margin-bottom: 0px;
    height: auto;
    overflow: hidden;
    z-index: 10;
}



.standoutjob .bro{
    opacity: 0.2 !important;
    font-size: 0px;
    border: 0;
    background: #fff;
}


.sampledesktop{
    max-height: 120px;
    float: left;
    overflow: hidden;
}

.sharingdetail .inf img{
    border: 0;
    float: left;
    width: 40px;
    height: auto;
    margin-right:0px;
}
.sharingdetail .inf{float:left; width:100%; margin-bottom: 10px;}

.inf .dw{
    position: relative;
    bottom: 1px;
    float: left;
    float: left;
    left: 0;
    padding: 3px 10px 4px 10px;
    background: #505050;
    color: #fff;
    border-radius: 3px;
    height: 72px;
    margin-top: 1px;
    text-align: center;
    padding: 25px 8px;
    font-size: 1.2em;
}

.inf .dw i {
    padding: 0 4px;
    color: #ccc;
}

.sharingdetail .inf ul li {
    border-bottom: solid 1px #f3f3f3;
    padding: 5px 12px;
    width: 50%;
    font-size: 12px;
    float: left;
    text-align:left;
}



.mess{
    width: 100%;
    float: left;
    padding-bottom: 8px;
    border-bottom: solid 1px rgba(255, 255, 255, 0.6);
    margin-bottom: 0px;
    font-size: 0.9em;
    padding: 18px 21px;
    padding-top: 10px;
    border-top: solid 0px rgba(255, 255, 255, 0.6);
    background: #fff;
    border-bottom: solid 1px #bfbfbf;
    border-left: solid 1px #e2e2e2;
    border-right: solid 1px #e2e2e2;
    border-radius: 0px 0px 6px 6px;
}

.state i{
    font-size: 18px !important;
    float: left;
    margin-right: 5px;
    color: #bdbdbd;
}

.msger{
    max-width: 90% !important;
    width: initial !important;
    border-radius: 4px;
    background: none !important;
    padding: 0px 17px 6px 18px;
    position: relative;
    overflow: hidden;
    margin-top: 0px;
    line-height: 1.4em;
    margin-bottom: 15px;
    box-shadow: 0px 0px;
}

.dstetime{
    font-size: 0.7em;
    text-align: right;
    float: right;
    padding: 0px;
    padding-top: 3px;
    padding-right: 11px;
    opacity: 0.4 !important;
    color: #000;
    margin-top: 0px !important;
}

.who{
    border-radius: 6px 6px 0px 0px;
    float: left;
    width: 100%;
    margin-bottom: 0px;
    padding: 15px 15px 9px 15px;
    font-size: 0.9em;
    background: #fff;
    border-top: solid 1px #e2e2e2;
    border-left: solid 1px #e2e2e2;
    border-right: solid 1px #e2e2e2;
    border-bottom: dotted 1px #e2e2e2;
}

/*
.seen{
    opacity:1; 
    border-left:solid 8px orange !important;
}
*/

.state{    
    background: #fff;
    padding: 11px 20px;
    border-radius: 3px 3px 0px 0px;
    margin-bottom: 0px;
}

.msger.newheight:last-child{
    opacity:0;
}

.chatcapsa form{
    float: left;
    width: 100%;
    padding: 5px 10px 10px 10px;
    background: #fff;
}

.chatcapsa form textarea:focus, .chatcapsa form textarea {
    box-shadow: 0px 0px 0px !important;
}

#seleted-rows{
    width: 100%;
    float: left;
    padding: 0px 14px;
    border-radius: 3px;
    margin: 10px 0px 10px 0px;
    background: #efefef;
}

.deletmod{
    float: left !important;
    background: #fff !important;
    padding: 10px 20px;
    border-radius: 3px;
    margin: 20px;
    font-size:17px !important;
    position: relative !important;
    border: solid 1px #ccc;
}

.versionscontrol{
    width: auto !important;
    float: left !important;
    padding: 12px 20px 12px 20px !important;
    background: orange;
    font-size: 13px !important;
    color: #fff !important;
    text-decoration: none;
    border: none;
    border-top: solid 0px #f8f8f8;
    border-left: solid 0px #fbfbfb;
    border-radius: 0px;
    
}






.versionscontrol_modal{
    width: auto !important;
    float: left !important;
    padding: 8px 17px 7px 17px !important;
    background: orange;
    font-size: 11px !important;
    color: #fff !important;
    text-decoration:none;
    border:none;
    border-top: solid 1px #f8f8f8;
    border-left: solid 1px #fbfbfb;
    border-radius: 0px;
}

.versionscontrol_modal:hover, .versionscontrol_modal:focus{
    background:initial;
    opacity:0.5;
    outline:0;
}

.versionscontrol_modal:hover, .versionscontrol_modal:focus{
    background:#555555 !important;
    text-decoration:none;
}



.deletmod:hover, .deletmod:focus{text-decoration:none; background:#f1f1f1 !important;}

.chat{
    width: 100%;
    float: left;
    height: 100%;
}

.chat input[type="button"], .chat input[type="button"]:focus{
    outline:0;
    border:0;
}

.sidebarblock .backtoSite{
    background: rgb(163 190 255 / 40%) !important;
}

.loadversions{
    float: left;
    width: calc(100% - 7px);
    margin-left: 5px;
    padding: 6px 6px 0px 6px;
    margin-bottom: 10px;
    background: #fff;
    border-radius: 4px;
}


.choosenVersion{
    background: #24aeff !important;
    color: #ffffff !important;
    padding: 12px 18px !important;
    text-shadow: 1px 1px 3px #0363b3;
    margin: 0px 0px 0px 0px !important;
    border-radius: 3px !important;
    float: left !important;
}

.detailphoto h1{
    float: left;
    width: auto;
    margin: 0;
    margin-right:10px;
    font-size:17px;
}

.autoheight_versions_box{
    min-height: 54px;
}

.selectedversion, .loadversions form button:hover{
    background-image: url(../custom/img/arrow_selected_verson.png) !important;
    background-position: center bottom !important;
    background-repeat: no-repeat !important;
    background-size: 21px !important;
}
.loadversions form button:hover{
    opacity:0.7;
}
.loadversions form button:focus, .loadversions form button:active{
    outline:0;
    border:0;
}

.yyy{
    width: calc(16.7% + 78px);
}

ul.menucatstop{
    position: fixed;
    padding: 0;
    left: 0;
    width: calc(16.7% + 78px);
    height: 100%;
    overflow-y: scroll;
    z-index: 999;
    list-style: none;
    background: #fff;
    padding-right: 0px;
    top: 0;
    box-shadow:0px 0px 15px rgba(0, 0, 0, 0.2);
    padding-top: 90px;
    padding-bottom: 70px;
    border-left: solid 10px #e6e6e6;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
/*
ul.menucatstop:hover{
    width: 23.7%;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
*/


ul.menucatstop label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 0px;
    font-weight: 700;
    float: left;
    padding: 7px 9px 7px 10px;
    width: 100%;
    border-radius: 2px 0px 0px 2px;
    background: #FFF;
    border-left: solid 0px #424242;
    position: relative;
    z-index:0;
}
/*
.desk{
    float: left;
    width:calc(70% - 33px);
    min-height: auto;
    margin: 0;
    background: #fff;
    border-radius: 4px;
    padding: 0;
    box-shadow: 0px 0px 13px #d2d2d2;
    position:relative;
}
*/
.desk{
    float: left;
    width: calc(70% - 33px);
    min-height: auto;
    margin: 0;
    background: #fff;
    border-radius: 4px;
    padding: 0;
    box-shadow: 0px 0px 13px #d2d2d2;
    position: relative;
}
/*
.average_panel{
    float: left;
    width: calc(33% - 82px);
    min-height: auto;
    padding: 5px !important;
    margin: 0px 15px;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0px 0px 13px #d2d2d2;
    list-style: none;
    height:auto;
    overflow-y:scroll;
}
*/

.average_panel {
    float: left;
    width: 100%;
    min-height: initial;
    padding: 0px !important;
    margin: 0;
    background: #fff;
    list-style: none;
    height: auto;
    /*overflow-y: scroll;*/
}

.charts{
    float: left;
    width: calc(45% - 16px);
    margin-right: 15px;
    background: #fff;
    border-radius: 2px;
    box-shadow: 0px 0px 10px #ccc;
    padding: 15px 20px;
}

.plusiconFiletype{
    position: absolute;
    z-index: 99;
    left: 28px;
    top: 34px;
    color: #946e6e;
    padding: 4px 4px 4px 4px;
    background: #e8e8e8;
    border-radius: 99px;
    font-size: 0.8em;
    width: auto !important;
}

.average_panel li{
    float: left;
    width: 100%;
    padding: 4px 4px;
    margin: 0;
    background: #f3f3f3;
    margin-bottom: 3px;
}

.average_panel a{
    width:100%;
    float:left;
}

.average_panel a:hover{
    text-decoration:none;
    opacity:0.7;
}

.average_panel li:last-child{
    margin-bottom: 0px;
}

.average_panel li i{
    padding-right: 10px;
    color: #9e9e9e;
}

.average_panel li img{
    float:left;
    width:40px;
    height:auto;
}

.average_panel .explainDesk{
    float: left;
    padding: 12px;
    font-size: 0.8em;
}

.box_dasboard .explainDesk{
    float: left;
    padding: 10px 12px;
    font-size: 0.8em;
}

.box_dasboard .average_panel .explainDesk {
    padding: 14px 12px;
}

.box_dasboard_hand{
    position: absolute;
    right: 0;
    padding: 12px 14px;
    background: #fff;
    font-size: 1.5em;
    cursor:grab;
}

.noresultsmenu{
    position: fixed;
    top: 138px;
    left: 46px;
    z-index: 9999;
    color: #888;
    font-style: italic;
}

.noresultsmenuUser{
    position: fixed;
    top: 138px;
    left: 46px;
    z-index: 9999;
    color: #888;
    font-style: italic;
}

.opaclow{
    opacity:0.3;
    height:0;
    overflow:hidden;
    padding:0 !important;
}

.noWorkShop{
    opacity:0.4 !important;
}

.totalOpacity{
    opacity:1 !important;
}





@keyframes amnim {
    0%   {transform:scale(1)}
    50%  {transform:scale(1.1)}
    100% {transform:scale(1)}
}

.opaclesss{
    z-index:99999;
    box-shadow:0px 0px 20px rgba(0,0,0,0.4);
    animation: amnim;
    animation-duration: 0.5s;
    animation-iteration-count:2;
}

.sharinglistitem .who{
    border-radius:0;
    border-top:0;
}

.box_dasboard{
    width:calc(25% - 53px);
    float: left;
    min-height: initial;
    padding: 5px !important;
    margin: 0;
    background: #fff;
    border-radius: 11px;
    box-shadow: 0px 0px 13px #d2d2d2;
    list-style: none;
    height: auto;
    /*overflow-y: scroll;*/
    margin-bottom:11px;
}

.box_dasboard.desko{
    width:calc(25% - 26px);
}


.switcherVisibles{
    float: right;
    position: relative;
    top: 51px;
    right: -26px;
}

.switcherVisibles i{
    font-size: 1.25em;
    padding-left: 3px;
    padding-right: 3px;
}





.opacu{
    opacity:1 !important;
}


.ScherFrm{
    float: left;
    margin: 0px 1px 0px 0px !important;
    position: relative;
    left: 3px;
    z-index: 2;
    background: #fff;
}

.box_dasboard_plus video{
    width:100%;
    float:left;
}

.box_dasboard_plus{
    width: calc(75% - 50px) !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.box_dasboard_plus.videostart{
    width: 75%;
    margin-right: 15px;
}

.box_dasboard.filelist{
    background: #fff;
    border-radius: 3px;
    overflow-y: scroll;
}

.box_dasboard.filelist a img{
    float:left;
    width:35px;
    height:auto;
    border-radius: 2px;
}

.box_dasboard.filelist a{
    float:left;
    width: 100%;
    padding: 4px 4px;
    margin: 0;
    background: #f3f3f3;
    margin-bottom: 3px;
}

.box_dasboard.filelist a:last-child{
    margin-bottom: 0px;
}

.contpujador{
    position:relative;
    padding:15px;
    width:calc(83% - 75px);
    
}

.buttonupslider:hover {
    background: #424242 !important;
}

ul.menucatstop li{
    float: left;
    width: 100%;
    padding-bottom: 5px;
    padding-top: 0px;
    padding-left: 0px;
    overflow:hidden;
}

ul.menucatstop li ul{
    list-style: none;
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 38px;
}

ul.menucatstop li ul li{
    list-style: none;
    float: left;
    width: 100%;
    padding-bottom: 0px !important;
    padding-top: 0px;
    border-top: solid 0px #000;
}

ul.menucatstop li ul li label {
    background: #FFF;
    border-left: solid 0px #FFF;
    color: #8c8c8c;
    font-size: 10.5px;
    margin-left: 0px;
    padding-left:0px;
    width: auto;
}

ul.menucatstop .editcat, ul.menucatstop .addcat{
    float: right;
    padding: 10px 6px 6px 6px;
    color: #c7c7c7;
    cursor:pointer;
}

ul.menucatstop .addcat_button{
    background: #e6e6e6;
    margin: 0;
    width: 36px !important;
    font-size: 1em;
    padding: 0 !important;
    right: 0;
    float: right;
    border-radius: 7px 0px 0px 7px;
}

ul.menucatstop .addpr{
    float: right;
    padding: 10px 6px 6px 6px;
    color: #c7c7c7;
    cursor:pointer;
}

ul.menucatstop .fileTypeCat{
    float: right;
    padding: 10px 6px 6px 6px;
    color: #c7c7c7;
    cursor:pointer;
}

ul.menucatstop .delcat{
    float: right;
    padding: 10px 6px 6px 6px;
    color: #c7c7c7;
    cursor:pointer;
}

ul.menucatstop .userscat{
    float: right;
    padding: 10px 6px 6px 6px;
    color: #c7c7c7;
    cursor:pointer;
}

.editcat_menu .usersPub {
  float: left !important;
  padding: 0px 6px 6px 6px !important;
  color:#000 !important;
}

#modal_upload h2{
    float: left;
    width: 100%;
    padding: 17px;
    margin: 0;
    font-size: 1.5em;
    font-weight: bold;
    opacity:0.7;
}

#modal_upload form{
    float: left;
    width: 100%;
}

#modal_upload .modal-content{
    padding: 0;
    overflow: hidden;
}

ul.menucatstop .uploadcat{
    float: right;
    padding: 0px 3px 11px 6px;
    color: #c7c7c7;
    cursor:pointer;
}

ul.menucatstop .AddDoc{
    padding:  0px 3px 11px 6px !important;
    float: right;
    color: #c7c7c7;
    cursor:pointer;
}

ul.subulcat .AddDoc{
    padding: 10px 6px 0px 6px !important;
    float: right;
    color: #c7c7c7;
    cursor:pointer;
}


ul.menucatstop ul li .uploadcat{
    padding: 10px 6px 0px 6px !important;
}



ul.menucatstop .upload3d{
    float: right;
    padding: 10px 0px 6px 3px;
    color: #c7c7c7;
    cursor:pointer;
}

ul.menucatstop .editcat:hover, ul.menucatstop .addcat:hover, .addpr:hover, ul.menucatstop .userscat:hover, ul.menucatstop .delcat:hover, .uploadcat:hover, .upload3d:hover{
    color: #9a9a9a !important;
}

.editcat_menu .addcat, .editcat_menu .editcat, .editcat_menu .userscat, .editcat_menu .delcat{
    float: left !important;
    padding: 0px 6px 6px 6px !important;
}

ul.menucatstop input[type=checkbox] {
    -ms-transform: scale(1.7);
    -moz-transform: scale(1.7);
    -webkit-transform: scale(1.4);
    -o-transform: scale(1.7);
    padding: 0px;
    background-color: #562323;
    color: #FFF;
    float: left;
    margin-right: 13px;
    margin-left: 4px;
    background-color: white;
}

.titleflow{
    font-size: 19px;
    margin: 0px 0px 6px 0px;
    float: left;
    color: #a0a0a0;
    font-size: 19px;
    padding: 4px 0px;
}

.uploadver{
    float: right;
    margin-bottom: 5px;
    padding: 5px 14px;
    font-size: 13px;
    border: 0;
    border-radius: 3px;
    color: #fff;
}

.uploadver:hover, .uploadver:focus{
    color: #fff;
    background: #0363b3;
}

.halff{
    width:25% !important; float:left; padding:9px 13px !important; height:34.3px;
}

.versup{
    color: #fff;
    background: #0065b3 !important;
    border-radius: 3px;
    padding: 3px 14px;
    width: auto !important;
}

.uploadbuttonversion{
    float: left;
    width: 100% !important;
    height: 100%;
    text-align: left;
    padding: 9px 17px !important;
    border-radius: 0px;
}

.versup:hover, .versup:focus{
    color:#fff;
    text-decoration:none;
}

.deletmod, .deletmod:hover{color:#000;}

.modal input[type="file"]{
    width: 100%;
    height: 265px;
    margin-bottom: 14px;
    background: url(../../view/custom/img/uplo.png);
    background-size: 120px;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 4px;
    background-color: #efefef;
    text-indent: -999em;
    outline: none;
    color: transparent;
}

#uploader_versions_container .plupload_content, #uploader_each_container .plupload_content{
    background-image: url(../../view/custom/img/uplo.png);
    background-size: 120px;
    background-position: center center;
    background-repeat: no-repeat;
}

.modal .filenw{
    background-image: url(../../view/custom/img/uplo.png);
    background-size: 120px;
    background-position: center center;
    background-repeat: no-repeat;
}

ul.menucatassign_user {
    position: relative !important;
    padding: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow-y: visible !important;
    z-index: 999 !important;
    list-style: none !important;
    background: none !important;
    background-color: #fff !important;
    padding-right: 0px !important;
    top: 0 !important;
    box-shadow: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-left: 0 !important;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.attp:hover{ text-decoration:none; }

.modal input[type="file"]:focus{
    outline:0;
    border: solid 0px #ccc;
}

.detailphoto .sidebar{
    border-radius: 3px;
    /*overflow: hidden;*/
    position:relative;
}

.plupload_scroll .plupload_filelist {
    background: none;
}

.footerfonsbaix.foo{
    border: 0px;
    width: 100%;
    position: fixed !important;
    background: rgba(0,0,0,0.8);
    bottom: 0;
    z-index: 9999;
}

.sharegroup:hover{
    text-decoration:none;
}

.repeated{
    float: left;
    width: 70%;
    min-height: auto;
    margin: -5% 15%;
    border-radius: 4px;
}

.countitems{
    float: left;
    margin-top: 36px;
    color: #616161;
    margin-right: 20px;
    font-size: 12px;
}

.number{
    float: left;
    margin-top: 22px;
    color: #424242;
    margin-left: 17px;
    padding: 11px 0px;
    width: 40px;
    height: 40px;
    text-align: center;
    color: #fff;
    margin-right: 20px;
    background: #0065b3;
    border-radius: 999px;
    position: fixed;
    bottom: -100px;
    right: 0;
    display:none;
}

input[type=checkbox] {
  -moz-appearance:initial;
}

.checkedcheck[type='checkbox']::after{
    position: relative;
    display: block;
    left: -1.60px;
    top: -1.1px;
    width: 19px;
    height: 19px;
    border-radius: 4px;   /* his, 2026-09-28 */
    border-width: 0;
    border-style: solid;
    border-color: #B3B3B3 #dcddde #dcddde #B3B3B3;
    content: "";
    background-image: linear-gradient(135deg, #B1B6BE 0%,#FFF 100%);
    background-repeat: no-repeat;
    background-position: center;
}

.checkedcheck[type='checkbox']:checked:after{
    background-image:url(../../view/custom/img/check.png) !important;
    background-size: 14px;
}

ul.menucatstop input[type=checkbox]:after, 
#selectall[type=checkbox]:after{
    position: relative;
    display: block;
    left: -1.60px;
    top: -1px;
    width: 15px;
    height: 14px;
    border-radius: 2px;
    border-width: 0.5px;
    border-style: solid;
    border-color: #d6d6d6;
    content: "";
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
}


ul.menucatstop input[type='checkbox']:checked:after, 
#selectall[type='checkbox']:checked:after{
    background-image:url(../../view/custom/img/check.png) !important;
    background-size: 11px;
    border:0;
}

ul.menucatstop input[type='checkbox']:checked, 
#selectall[type='checkbox']:checked{
    background-image:url(../../view/custom/img/check.png) !important;
    background-size: 11px;
    border:0;
}

textarea:focus{ outline:0; }

.relateds a img{ border-radius:3px 3px 0px 0px;}

.openheader, .opensidebar{display:none;}

.movilheaderhidden{ float:right; height: 100%;}

.inboxoutbox{
    opacity:1; 
    float:left; 
    background:#CCC; 
    color:#8c8c8c; 
    font-size: 20px; 
    margin-right:10px; 
    margin-bottom:15px; 
    border-radius:3px; 
    padding: 1px 10px;
    border: solid 1px #ababab;
}

.inboxoutbox .textbox{
    float: right;
    font-size: 15px !important;
    padding: 4px 1px 3px 8px;
}

.dstetime i{
    margin:0px 4px 0px 4px;
}


.rel_proj_list{
    float: left !important;
    margin-left: 32px !important;
    padding: 0px 0px 0px 0px !important;
    width: calc(100% - 29px) !important;
}

.chatcapsa{
    position: static;
    bottom: 0px;
    width: 100%;
    height:calc(100% - 50px);
}

.chat_notifications_container{
    position:fixed;
    z-index:999;
    right:-110%;
    bottom:20px;
    width:250px;
    height:auto;
}

.who img{
    width: 28px;
    float: left;
    box-shadow: 0px 0px 2px rgba(0,0,0,0.3);
    border-radius: 3px;
    margin-right: 9px;
    border-radius: 999px;
    margin-left: -1px;
    margin-top: -5px;
}

#approved_change{
    z-index: 2;
    position: relative;
}

.effectslow{
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
}

.approovedjob_button{
    float: left;
    position: absolute;
    right: 5px;
    top: 8px;
}

.approovedjob_button button{
    right: 60px;
    font-size: 18px;
    margin-top: -4px !important;
    margin-bottom: 2px !important;
    border-radius: 3px !important;
    opacity: 1 !important;
    height: 34px;
    width: 41px;
    background: #989898;
}

.contain .infor{
    float:right;
    width: calc(80% - 15px);
}

.contain .photo{
    float:left;
    width:20%;
    background: #d8d8d8;
    border-radius: 3px;
}

.contain .photo img{
    float:left;
    width:100%;
    margin-right:15px;
    border-radius:3px !important;
    box-shadow:0px 0px 6px #ccc !important;
}

.contain{
    float:left;
    width:100%;
    border-bottom: solid 0px #ccc;
    padding: 20px 0px 20px 0px;
}

.contain .infor .versionscontrol{
    border-radius:3px !important;
}

.contain .infor .versionscontrol_modal{
    border-radius:3px !important;
}

.contain .infor .exte{
    border-radius: 3px !important;
    padding: 6px 12px 6px 12px;
    border: solid 1px #ccc;
    float: left;
    margin-right: 5px;
    margin-top: 1px;
    font-size: 12px;
    margin-bottom: 5px;
}

.contain .infor .task_s{
    width:100% !important; 
    border-radius:0px !important;
    border-top:solid 1px #e0e0e0;
    border-left:0px;
    border-bottom:0px;
    border-right:0px;
    float:left;
    width:100%;
    padding: 6px 0px 6px 0px;
    margin-top: 6px;
}

.modal-header .del.deletmod{
    height:auto !important;
}

.who a, .who a:hover, .who a:focus{
    color:#000;
    text-decoration:none;
    float: left;
    width: 100%;
}

.versup{
    color:#fff !important;
}


#sendmes {
display:none !important;
}


li.plupload_droptext {
    background-repeat: no-repeat !important;
    background-size: 115px !important;
    background-position: center center !important;
    font-size: 0px;
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
}

#uploader_single, #uploader{
    overflow:hidden;
}

.add_drop {
    background-size: 135px !important;
    -webkit-transition: all 0.9s ease-in-out;
    -moz-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
}

.opacityU{
    opacity:0.4 !important;
    -webkit-transition: all 0.20s ease-in-out;
    -moz-transition: all 0.20s ease-in-out;
    -o-transition: all 0.20s ease-in-out;
    transition: all 0.20s ease-in-out;
}


.plupload_container {
    padding: 0;
}

.detsunmi {
    width: 140px;
    height: auto;
    right: 0px;
    bottom: -91px !important;
    display: none;
    position: absolute;
    bottom: 0px;
    top: initial;
    background: #000;
}

.detsunmi{
    width:140px; height:auto; right: 0px; bottom: -91px !important; display:none; position: absolute; bottom: 0px; top: initial; background:#000;
}
.detsunmi li a:hover{
    background:#555 !important;
}
.detsunmi li a{
    padding:6px 12px !important;
    border-top: solid 1px #0c0c0c !important;
    border-bottom: solid 1px #737373 !important;
}
.detsunmi li:first-child a{
    border-top:solid 0px #555;
}
.detsunmi li:last-child a{
    border-bottom:solid 0px #555 !important;
}

.drdr{
    bottom: initial !important; 
    right: 0 !important; 
    position: relative !important; 
    width: 100% !important; 
    float: left !important; 
    background: #424242 !important; 
    border: 0px !important; 
    border-bottom: solid 1px #000 !important;
}
.drdr:hover{
    background: #555 !important;
}

.modal-backdrop{
    opacity:0.8 !important;
    transition:opacity .1s;
    background:#000 !important;
    z-index:99999998;
}

#description_update{
    border-radius:0px 0px 4px 4px;
}

.description_rel{
    color: #4c4c4c;
    padding: 5px !important;
    font-size: 11px;
    float: left;
    background: #fff;
    width:100%;
    overflow: hidden;
}

/* «No results» (2026-10-07, his "debe de ser mas discreto. y situado debajo o en medio de la pantalla si no hay nada"): no box - it was a light grey
   panel, a white block in dark mode with its text lost in it - just a quiet line in the page's soft text colour, under the head, about the middle of
   the screen */
.noresult{
    position: static;
    width: auto;
    max-width: 520px;
    margin: clamp(40px, 12vh, 120px) auto 0;   /* close enough under a tall head (the admin's hub page) to stay on screen */
    padding: 0;
    background: none;
    border-radius: 0;
    transform: none;
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    color: var(--vk-soft, #6b6a76);
}

.containernewsadd{
    height: 100% !important;
}

.noresult i{
    margin-right:5px;
}
/* the bar of the filters chosen above a page of files (.breadcrumbs: the search chip «🔍 term ×», a type...) is gone, chips and all (his "quita esta
   caja" and, when the chip stayed, "que te dije?????" with it crossed out, 2026-10-07). A search is cleared from the head's own path
   («Hub › Sección › 🔍 term ×») or by searching again. A bar that holds «Dar acceso» (view/css/vk_access.css .vkGive) keeps that button. */
.breadcrumbs:not(.vkGiveOnly):not(:has(.vkGive)){ display: none !important; }
.breadcrumbs .boxCont{ display: none !important; }
/* a page with nothing above the files - a search over everything (his screenshot with an arrow down, 2026-10-07): the middle of the screen */
body:not(:has(.vkHead)) .noresult{ margin-top: 30vh; }

.buttondtdwn{border-left: solid 1px #ececec !important; border-radius:0px; width: 52px;}
.buttondtdwn{border-right: solid 1px #ececec !important;}
.buttondtdwn:hover{background:#000 !important;}
.buttondtdwn i{color:#000 !important;}
.buttondtdwn:hover i{color:#FFF !important;}

.desk .plupload_container {
    padding: 8px;
}

#iuploit{
    float: left;
    position: absolute;
    top: 8px;
    padding: 4px 10px !important;
    bottom: initial;
    border: solid 0px #ccc;
    right: 68px;
    color: #fff;
    border-radius: 3px;
    background: #0363b3;
    font-size: 13px !important;
}

#iuploit:hover{
    text-decoration:none;
}

#iuploit:hover i{
    color:#000 !important;
}

.approvedlist{
    padding: 9px 11px;
    height: 34.5px;
    border-left: solid 7px #43d426;
    border-top: solid 0px #eaeaea;
    float: left;
    width: 100%;
    border-right: solid 0px #eaeaea;
}

.waitinglist{
    padding: 9px 11px;
    height: 34.5px;
    border-left: solid 7px #CCC;
    border-top: solid 1px #eaeaea;
    float: left;
    width: 100%;
    border-right: solid 1px #eaeaea;
}


.dstetime i{
    margin:0px 4px 0px 4px;
}

.download_app{
    width: 100%;
    background: #0164b3 !important;
    margin-bottom: 7px;
    color:#fff;
}

.approved_app {
    width: 100%;
    background: #00a700 !important;
    margin-bottom: 7px;
    color:#fff;
}

.seenversion{
    width: 100%;
    background:#ffd400 !important;
    margin-bottom: 7px;
}

.upload_app{
    width: 100%;
    background: #39CCCC !important;
    margin-bottom: 7px;
}

.del_app{
    width: 100%;
    background: #00ce00 !important;
    margin-bottom: 7px;
}

.upload_app .who{
    display:none;
}

.approved_app .who i,  .seenversion .who i, .download_app .who i, .del_app .who i{    
    display:none;
}


.approved_app .who,  .seenversion .who, .download_app .who, .del_app .who{
    display: block;
    width: auto;
    float: left;
    margin-top: -1px;
    margin-right: 13px;
    font-size: 12px !important;
}

.download_app .mess, .upload_app .mess, .seenversion .mess, .approved_app .mess, .del_app .mess{
    width: auto;
    float: left;
    font-size: 11.5px;
    margin: -1px 0px 0px 0px;
    border: 0px;
    padding: 0px 0px 4px 0px;
}

.download_app .dstetime i, .upload_app .dstetime i, .seenversion .dstetime i, .approved_app .dstetime i, .del_app .dstetime i{
    opacity:0;
    font-size:6px;
    margin:0px;
}

.unseen{opacity:0.4 !important;}
.okversion{background:#00ce00;}

#testheight{
    float:left;
    position:relative;
    bottom:0 !important;
    height: 100%;
    left:0;
    padding:10px;
    width: 100%;
}

.approveversion_btn{
    width: 100% !important;
    float: right !important;
    border: 0px;
    background: #525252;
    color: #fff;
    border-radius: 3px;
    margin-top: 17px;
    margin-bottom: 0px;
    padding: 5px;
}

.approveversion_btn:hover{
    color:#fff;
}

.moreheightheader{
    height:500px !important;
}

.moreleftsidebar {
    left: 0 !important;
    box-shadow: 0px 0px 15px rgba(0,0,0,0.2)!important;
    /*padding-top: 85px !important;*/
    padding-top: 90px !important;
}

.rel_proj_list{
    float: left !important;
    margin-left: 28px !important;
    padding: 0px 0px 0px 0px !important;
    width: calc(100% - 63px) !important;
}

.FilesInside{
    width: 100% !important;
    list-style: none;
    margin: 0;
    padding: 0;
}

.titliFilelist{
    width:100% !important;
    display:inline-block !important;
    margin: 8px 0px 2px 0px;
    font-size: 10px;
}
.FilesInside li img{
    width: 30px !important;
    border-radius: 5px !important;
    margin-right: 8px;
    margin-top: 8px;
}

.rel_proj:focus{
    border-bottom:solid 0px #fff !important;
    text-decoration:none !important;
}

.rel_proj {
    margin-top: 5px !important;
    border-top: solid 1px #ccc!important;
    width: 100%!important;
    padding: 5px 10px 0px 0px !important;
}

.rel_proj:hover{
    text-decoration:none !important;
}

.tagskw{
    float:left !important; 
    width:auto !important; 
    position:relative !important; 
    bottom:0 !important;
    color:#909090 !important;
    font-size:12px !important;
    padding: 1px 3px 4px 3px !important;
    margin:0px !important;
}

.tagskw{
    background:#FFF !important;
    top: 1px !important;
    left: -3px !important;
    right:initial !important;
}

.tagskw:focus{
    color:#000 !important;
}

.selectedkey{
    color:#000 !important;
}

.project_tags{
    border-radius: 3px;
    margin: 6px 3px 3px 3px !important;
    color: #000 !important;
    padding: 2px 7px !important;
    float: left !important;
    border: solid 1px #ccc;
}

.project_tags_selected{
    background: #0164b3 !important;
    border-color: #0164b3;
    color: #fff !important;
}

.headerlistshare h1{
    padding:4px 0px 0px 0px;
}


.rel_proj {
    margin-top: 5px !important;
    border-top: solid 1px #ccc!important;
    width: 100%!important;
    padding: 5px 10px 7px 3px !important;
}

.tagskw {
    float: left !important;
    position: relative !important;
    bottom: 0 !important;
    color: #909090 !important;
    font-size: 10.5px !important;
}

.project_tags_selected, .project_tags_selected:focus{
    color:#fff !important;
    text-decoration:none;
}

.selectedkey{color:#000 !important;}

.titlesproject {
    padding: 9px 5px;
    color: #a2a2a2;
    float: left;
}

.sourcecod{
    float: left;
    width: 100% !important;
    border-radius: 3px;
    margin: 5px 0px 10px 0px !important;
    border: 0;
    min-height: 500px;
    padding: 20px;
    height: auto !important;
    background: #1d1d1d;
    color: #afafaf;
    font-family: monospace;
}

.buttonsavefile{
    position: absolute;
    right: 2px;
    top: 7px;
    border: 0;
    padding: 2px 12px;
    font-size: 23px;
    color: #fff;
    background: #6b6b6b;
    border-radius: 2px;
    margin: 3px;
}

.owl-carousel .owl-stage-outer {height: 100%;}
.owl-carousel.owl-loaded { height: 100%;}
.owl-carousel .owl-stage-outer {height: 100%;}
.owl-carousel .owl-stage {height: 100%;}
.owl-carousel .owl-item { height: 100% !important;}

.modalcommon{
    width:auto;
}

.modalcommon .modal-content{
    border-radius: 0px;
    border: 0;
    padding:35px;
}

.clos {
    float: right;
    margin: 0;
    background: none;
    border: none;
    font-size: 53px;
    margin: -40px -10px 0px 0px;
    color: #999;
}

.modalcommon input[type="text"]{
    border-radius: 8px;
    margin-bottom: 12px;
    width: 100%;
    padding: 16px 15px 16px 15px;
    border-color: #999;
    height: 55px;
}

.modalcommon input[type="email"]{
    border-radius: 8px;
    margin-bottom: 12px;
    width: 100%;
    padding: 23px 15px 23px 15px;
    border-color: #999;
    height: 64px;
}

.modalcommon input[type="password"]{
    border-radius: 8px;
    margin-bottom: 12px;
    height: 64px;
    width: 100%;
    padding: 23px 15px 23px 15px;
    border-color: #999;
}

.modalcommon select{
    border-radius: 8px;
    margin-bottom: 15px;
    width: 48.5%;
    float:left;
    margin-right:3%;
    padding:15px 15px 15px 15px;
    border-color: #999;
}

.modalcommon .gradientformbuttons{
    border-radius: 8px;
    color: #FFF;
    text-shadow: initial;
    padding: 13px 40px 13px 40px;
    margin: 23px 0px 0px 0px;
    border: 0;
    outline: 0;
    height: 50px;
    float: left;
}


.modalcommon label{
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700;
    float: left;
}

.modalcommon form{
    text-align:left;
}

.modalcommon.co .modal-dialog {
    margin: 15px auto !important;
}

.modalcommon.co .modal-content{
    float: left;
    border-radius: 20px;
    width: 100%;
    margin-bottom:15px;
}

.modalcommon.co h3{
    float: left;
}

.modalcommon.co select {
    float: left;
    width: 100%;
    padding: 0px 12px;
}

.modalcommon.co label {
    width: 100%;
    margin-bottom: 10px;
    margin-top: 10px;
    font-weight: 700;
    float: left;
}

.imgset video{
    width:100%;
    height:auto;
    margin-top: 0px;
    border-radius: 3px;
}

.waiting{opacity:0.5 !important;}

.png_background img,
.png_background{
    background: #e8e8e8;
    box-shadow: none !important;
}

.not-loaded{display:none;}

img.lazy{
    display: block;
    width: 100%; 
    height:auto;
}

/*
.chatlayout{
    float:left; 
    width: auto; 
    margin-right: 15px; 
    position: fixed;
    top:100px;
    height: calc(100% - 150px);
}
*/

.leftsless{
    left:-500px;
}

.chatlayout{
    float: left;
    width: auto;
    margin-right: 15px;
    position: fixed;
    bottom: 7px;
    height: calc(100% - 176px);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.inputCat{
    position: fixed;
    z-index: 1002;
    top: 90px;
    border: 0;
    height: 34px;
    left: 10px;
    background-image:url('../custom/img/bcksearch.png');
    background-repeat:no-repeat;
    background-size:cover;
    padding: 0px 37px;
    background-color: #e4e4e4;
}


.inputUser{
    position: fixed;
    z-index: 1002;
    top: 90px;
    border: 0;
    height: 34px;
    left: 10px;
    background-image:url('../custom/img/bcksearch.png');
    background-repeat:no-repeat;
    background-size:cover;
    padding: 0px 37px;
    background-color: #e4e4e4;
    display: flex;
    align-content: center;
}


.inputCat:focus{
    outline:0;
}

.chatlayout_height{
    height: calc(100% - 114px) !important;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.userslayout{
    float: left;
    margin-right: 15px;
    padding: 0px;
    margin-bottom: 10px;
    background: #fff;
    max-height:200px;
    overflow-y:scroll;
    border-radius: 3px;
    width: calc(100% - 60px);
    margin-top: 0px;
}

.headerinfosender{
    float:left;
    padding: 12px 12px;
    width:100%;
    border-bottom:dotted 1px #ccc;
}

.userslayout ul{
    width:100%; float:left; padding:0; margin:0; list-style:none;
}

.userslayout ul li{
    float:left; width:100%; list-style:none; border-bottom:dotted 1px #ccc; padding: 12px;
}

.userslayout ul li:hover{
    opacity:0.8;
}

.userslayout ul li i.icon, .headerinfosender i{
    float: left;
    padding: 3px 11px 0px 0px;
}

.userslayout ul li .contacteinfo{
    border-right:solid 1px #ccc !important;
    padding: 0px 8px 0px 8px !important;
}

.userslayout ul li .contacteinfo.emaile, .userslayout ul li .contacteinfo.jobtitlee{
    font-size:0.8em;
    padding: 2px 8px 2px 8px !important;
}

.delete_user_job_btn, .info_user_job_btn{
    float: right;
    padding: 0px 6px 0px 7px;
    cursor: pointer;
    font-size: 1em;
}

.imageuserwork, .contacteinfo{
    cursor:pointer !important;
}

.info_user_job_btn{
    font-size: 0.9em;
}

.delete_user_job_btn:hover{
    opacity:0.6;
}


.detail_user_job .conter{
    width:100%; float:left;
}

.detail_user_job img{
    float:left; border-radius:999px; max-width:150px; margin-top:25px;
}

.detail_user_job ul{
    list-style:none; margin:0; padding:20px 0px 0px 0px; width:100%; float:left;
}

.detail_user_job ul li{
    list-style:none; margin:0; padding:10px 0px;
}

/*
.chat{
    height: calc(100% - 100px);
    width: calc(100% - 60px);
}
*/
.chat{
    height: calc(100% - 310px);
    width: calc(100% - 60px);
}


.titleflow.jobdiscussion{
    position: fixed;
    width: 30% !important;
    right: 0;
}

.managerdesktop{
    position: fixed;
    width: calc(100% - 17%);
    z-index: 99;
    top: 90px;
    padding: 17px 10px 10px 17px;
    /*background: #e6e6e6;
    background: linear-gradient(to top, rgba(230, 230, 230, 0),rgb(230, 230, 230),rgb(230, 230, 230),rgb(230, 230, 230));*/
}

.managerdesktop form{
    float: right !important;
    width: auto;
    margin-right: 88px;
    margin-top: -1px;
    border-radius: 7px;
    border: solid 10px #dadada;
    background: #dadada;
    
}

.logoHeader{
    max-width: 200px;
    height: auto;
    max-height: 55px;
    width: auto;
    margin-top: 4px !important;
    padding-right: 16px;
    padding-left: 16px;
    position: relative;
}

.inboxoutbox {
    margin-bottom: 0px;
}

.sharinglist{
    margin-top: 85px;
}

.showMob{
    display:none;
}

.showDesk{
    display:block;
}

.VisiMo{
    display:none;
}

@media(max-width: 1180px){

    .VisiMo{
        display:block;
        float: right !important;
        font-size: 24px;
        margin-bottom: -15px;
        margin-top: -5px;
    }
    
    .showMob{
        display:block !important;
    }

    .showDesk{
        display:none !important;
    }

    .showmovil_user img{
        cursor: pointer;
        width: 30px;
        margin-top: 2px;
        float: left;
        border-radius: 99px;
    }
    
    .manageUserBt{
        display:none;
    }
    
    ul.menucatstop label{
        padding: 15px 10px;
    }
    
    ul.menucatstop{
        width: calc(25% - 10px);
    }
    header{
        overflow:visible !important;
        width: 66px !important;
        transform: translateX(0px) !important;
        right: 0 !important;
        left: initial !important;
        box-shadow: 0px 0px 0px !important;
    }
    header .secondline{
        background:none !important;
    }

    header.begining{
        height: auto !important;
    }
    
    .managerdesktop{
        left: 25%;
        width: calc(100% - 25%);
    }
    
    .footerfonsbaix{width:calc(75% + 10px);}

    .openheader{
        position: fixed;
        right: 0px;
        bottom: 0px;
        display:block;
        z-index: 1;
        padding: 0px 17px;
        font-size: 35px;
        background: #fff;
        border-radius: 0px 0px 0px 0px;
        border-left: solid 0px #ccc;
        border-top: solid 1px #ccc;
    }
     
    .halff{
        width: 100% !important;
        float: left;
        padding: 9px 17px !important;
        height: auto;
    }

    
}



.headerlistshare form input{
    float: left !important;
    width:50% !important;
    border-radius:4px 0px 0px 4px !important;
}

.headerlistshare form button{
    border-radius:0px !important;
    border-left: 0px;
    border-right: 0px;
}

.headerlistshare form a{
    border-radius:0px 4px 4px 0px !important;
}

.headerlistshare form button, .headerlistshare form a{
    float: left !important;
    width:25% !important;
}

.inboxoutbox.sende{
    border-radius:4px 0px 0px 4px;
    margin-right: 0px;
    border-right: 0;
}

.inboxoutbox.recieve{
    border-radius:0px 4px 4px 0px;
    border-left:0px;
}

.attachm, .attachm .state{
    float:right;
    width:calc(100% - 46px);
}

.seeattachments{
    float: right;
    top: 6px;
    font-size: 1em;
    right: 52px;
    width: auto;
    padding-right: 8px;
    border-right: solid 0px #efefef;
    color: #8c8c8c;
    text-align: center;
}


.leessopp{
    opacity:0.5;
}

.caseinfo h3{
    margin-top: 10px;
    font-size: 13px !important;
    margin-bottom: 10px;
    opacity: 0.5;
}

.caseinfo p{
    border-top: dotted 1px #d4d4d4;
    padding-top: 6px;
}

.caseinfo h3 i{
    font-size: 17px !important;
    margin-right: 6px;
}

.attachm .state{
    padding:5px;
    background:#f6f6f6;
    margin-bottom:10px;
}

.state .caseinfo{
    float: left;
    width: calc(100% - 111px);
}

.attachm img{
    max-width: 88px;
    float: left;
    margin-right: 15px;
}

.topfolder{
    float: left;
    width: 100%;
    height: 52px;
    background: url(../../view/custom/img/topfolder.png);
    margin-top:-37px;
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: top;
    background-size: 113% auto;
}


/* NEW DESKTOP */
.imgset.sharinglist .sharinglistitem {
    width: calc(33% - 40px) !important;
    margin-right: 15px;
    margin-left: 15px;
    position:absolute;
    margin-bottom: 55px;
    /*max-width: 367px;*/
}

.whitico{
    font-size: 19px;
    margin: 0 !important;
    float: right !important;
    padding: 10px 20px !important;
    width: calc(100% - 100px);
    background: #fff;
    border-left: dotted 1px #ccc;
}

.sharinglist .inf .who{
    background:#fff !important;
    float: right;
}

.sharinglist .inf ul li{
    width: 100% !important;
    height:auto !important;
    border-top: dotted 1px #e2e2e2 !important;
}

.sharinglist .inf ul li:last-child {
    margin-bottom: 33px !important;
}
/* NEW DESKTOP */

.sharingdetail .inf ul li.groupsusers i{
    color: #ccc;
    margin-left: 6px;
    margin-right: 2px;
}

.sharingdetail .inf ul li.groupsusers{
    width:100% !important;
}

.usernotifications{
    float: left;
    width: 40px;
    height: auto;
    border-radius: 999px;
    margin-right: 10px;
    margin-bottom: 10px;
}

#chat_notifications{
    overflow-y: scroll;
    bottom: 47px;
    padding: 7px 0px;
    z-index: 10;
}

.deletenotif{
    float: left;
    position: absolute;
    right: 0;
    border: 0;
    background: #fff;
    margin-top: 2px;
    margin-right: 1px;
}


.usernotifications_item{
    float: left;
    width: auto;
    max-height: 81px;
    max-width: 83px;
    border: solid 1px #ececec;
    margin-right: 0px;
    border-radius: 3px;
}

.capsanotificacio{
    float:right;
    width: 100%;
    margin-bottom:2px;
}

.standoutjob{
    border: solid 6px #ffa500;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.4)!important;
}
/*
.seenversion .who{
   display:none;
}
*/
.adduserjob, .uploadver{
    position: relative;
    right: 0px;
    padding: 5px 10px;
    border-radius: 3px !important;
    left: 0px;
    padding: 6px 9px !important;
    top: 0px;
    font-size: 17px;
    background-color: #ffa100 !important;
    border-radius: 0 !important;
    width: 50% !important;
}

.uploadver{
    top:0 !important;
}

.squareshared{
    border: solid 1px #dcdcdc;
    border-radius: 3px;
    padding: 2px 9px 2px 0px !important;
    margin-right: 4px !important;
    float: left;
    margin-top: 1px;
    margin-bottom: 8px;
    position: relative;
}



.imginfouser{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 32px;
    display: none;
    z-index:999;
    text-align:center;
}

.imginfouser img{
    height: 70px !important;
    float:none !important;
    width: auto !important;
    border-radius: 999px !important;
    box-shadow: 0px 0px 10px #ccc;
    background:#fff;
}

.infonumberemail{
    float: left;
    background: #fff;
    border-radius: 4px !important;
    margin-top: 6px;
    padding: 4px 8px;
    box-shadow: 0px 0px 10px #ccc;
}

.squareshared:hover .imginfouser{
    display:block;
}


#adduserjob .messageuser{
    display:none;
}

.versionsleft{
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: #f00;
    color: #fff;
    right: -10px;
    top: -22px;
    text-align: center;
    padding-top: 10px;
    z-index: 99;
}

.shareduseralt{
    position: absolute;
    left: 29px;
    bottom: 20px;
}

.shareduseralt i{
    color: #4ebdb1;
    font-size: 40px;
}

.noadminaccessitem{
    position: absolute;
    padding: 14px;
    border: dotted 1px #a0a0a0;
    color: #000;
    z-index: 1;
    font-size: 13px;
    border-radius: 5px;
    text-align: center;
    width: 136px;
    right: 3%;
    background: #ffffffc9;
    transform: translate(0%,-5%);
}

.sobrecapsa{
    border: solid 1px #ccc;
    padding: 3px 9px;
    border-radius: 3px;
    top: -1px;
    right: 0px;
    float: left;
    margin: 6px 5px 6px 0px;
}



/* notification style */

.desplegable_notific{
    position: absolute;
    top: -50px;
    width: 250px;
    right: 67px;
    padding-top: 50px;
    /* width:106px; */
}

.desplegable_notific a{
    width:100%;
    float:left;
    padding:0;
    tet-align:left;
    margin:0;
}

.desplegable_notific .fotoimg{
    float:left;
    width:65px;
}

.desplegable_notific .fotoimg img{
    float: left;
    width: auto;
    height: auto;
    border-radius: 2px;
    max-width: 55px;
}

.desplegable_notific .sender{
    float: left;
    width: calc(100% - 80px);
    font-size: 12px;
    color: #929292;
}

.desplegable_notific ul{
    width: 100%;
    height: 100%;
    float: left;
    background: #eaeaea;
    padding: 0;
    margin: 0;
    overflow-y: scroll;
    border-radius: 5px;
    list-style:none;
    border: solid 5px #fff;
    box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.26);
}

.desplegable_notific ul li{
    padding: 7px 8px;
    margin: 0;
    width: 100%;
    float: left;
    border-bottom: solid 1px #e3e3e3;
    list-style: none;
    border-left: solid 1px #e9e9e9;
    border-right: solid 1px #e9e9e9;
    background: #f6f6f6;
    border-top: solid 1px #fff !important;
    position:relative;
}

.desplegable_notific ul li .iconet{
    position: absolute;
    bottom: 5px;
    right: 0px;
    color: #ccc;
    font-size: 17px;
}

.desplegable_notific ul li:hover{
    background: #fff !important;
    border-left: solid 1px #fff !important;
    border-right: solid 1px #fff !important;
}

.desplegable_notific ul li:last-child{
    background: #fff;
    border: 0 !important;
    border-radius:0px 0px 2px 2px !important;
    overflow:hidden;
}

.desplegable_notific ul li:last-child a{
    font-size:12px;
    color:#777;
    text-decoration:none;
    text-align:center;
    padding:4px 0px 4px 0px;
}

.desplegable_notific ul li:last-child a:hover{
    color:#ccc;
    text-decoration:none;
}

.desplegable_notific ul li:first-child{
    border-top: solid 1px #e9e9e9 !important;
    border-radius:2px 2px 0px 0px !important;
    overflow:hidden;
}

.desplegable_notific a:hover{
    background:none !important;
}

#notif_shared{
    /*float: left;
    padding: 3px 10px 2px 11px;
    border: solid 1px #d5d5d5;
    height: 38px;
    margin-top: -1px;
    border-radius: 3px;*/
    float: left;
    width: 100%;
    position:relative;
    overflow:hidden;
}

.desktopdesk{
    z-index: 100;
    position: relative;
}

.numnot{
    float:left;
    margin:7px 5px 7px 0px;
}

.desplegable_notific i{
    float: left;
    margin: 3px 7px 3px 0px;
}

/* fin notification style */

.jobtitle{
    position: relative;
    left: 0px;
    width:100% !important;
    float: right;
    background: #fff;
    padding: 6px 20px;
    font-size: 13px;
    color: #7d7c7c;
    border-bottom: dotted 0px #ccc;
}


#pagination{
    position: fixed;
    bottom: 0px;
    max-width:500px;
    right: 0px;
    background: #fff;
    padding: 0px;
    list-style: none;
    margin-bottom: 0;
    z-index: 1;
    z-index: 100;
    border-radius: 3px 0px 0px 0px;
    height: 50px;
    overflow-y: hidden;
    white-space: nowrap;
    overflow-x: scroll;
}

#pagination li{
    float:none;
    width:auto;
    padding:0;
    width:49px;
    display:inline-block;
    margin:0;
}


#pagination li a{
    float:left;
    color:#000;
    padding:10px 20px 7px 20px;
}

#pagination li a.highlight, #pagination li a.highlight:hover{
    background:#797979;
    color:#fff;
    text-decoration:none;
}

#pagination li a:hover{
    background:#ccc;
    text-decoration:none;
}


/* chat notification style */
.regularmessage{}
.welcomemessage, .newjob, .approveversion, .approvejob, .assignmaster, .uploadattachment, .reviewfirsttime, .downloadversion, .uploadversion{color:#fff; width:100% !important; padding-top:6px; padding-bottom:7px !important;}
.welcomemessage .dstetime, .newjob .dstetime, .approveversion .dstetime, .approvejob .dstetime, .assignmaster .dstetime, .uploadattachment .dstetime, .reviewfirsttime .dstetime, .downloadversion .dstetime, .uploadversion .dstetime{
    float: right;
    text-align: right;
    opacity: 0.8;
    font-size: 0.7em;
    padding-top: 5px;
    padding-bottom: 0px;
    width: 100%;
    border-top: solid 1px rgba(255,255,255,0.5);
    margin-top: 0;
}
.welcomemessage .who, .newjob .who, .approveversion .who, .approvejob .who, .assignmaster .who, .uploadattachment .who, .reviewfirsttime .who, .downloadversion .who, .uploadversion .who{display:none;}
.welcomemessage i, .newjob i, .approveversion i, .approvejob i, .assignmaster i, .uploadattachment i, .reviewfirsttime i, .downloadversion i, .uploadversion i{margin:0px 6px 0px 0px}
.welcomemessage .mess, .newjob .mess, .approveversion .mess, .approvejob .mess, .assignmaster .mess, .uploadattachment .mess, .reviewfirsttime .mess, .downloadversion .mess, .uploadversion .mess{    padding-bottom: 0px;
    padding-bottom: 9px;
    border-bottom: solid 1px #ababab;
    opacity: 1;
    font-size: 0.85em !important;
    border-radius: 5px !important;
}

.welcomemessage  .mess{background-color:#e0da93 !important; color:#000;}
.approveversion  .mess{background-color:#2dfb2a !important; color:#000;}
.newjob  .mess{background-color:#f3f3e4 !important; color:#000;}
.approvejob  .mess{background-color:#07d404 !important; color:#000;}
.assignmaster  .mess{background-color:#ff7600 !important; color:#fff;}
.uploadattachment  .mess{background-color:#b8def1 !important; color:#000;}
.reviewfirsttime  .mess{background-color:#ffd400 !important; color:#000;}
.downloadversion  .mess{background-color:#0363b3 !important; color:#fff;}
.uploadversion  .mess{background-color:#1de8e8 !important; color:#000;}
/* fin chat notification style */

.showmovil{display:none}

.loadversions{
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    padding: 10px 8px 0px 9px !important;
}

.loadversions form{
    display: inline-block;
    float: none !important;
}


@media(max-width: 1180px){
    .imgset.sharinglist .sharinglistitem{
        width: 44% !important;
    }
}

@media(max-width: 1300px){
    .capsaitem{
        width: calc(25% - 10px);
    }
}

.formmenu{
    position:absolute; 
    bottom:0; 
    right: 70px; 
    height:auto;
}

.shareitem.sharegroup.sharedesktop.showmovil{display:none; top: 0; bottom: initial !important;}


.desktop_ajax .versionscontrol{
    float: left !important;
    margin-left: 3px !important;
    margin-bottom: 3px !important;
    border-radius: 3px !important;
    padding: 10px 6px !important;
    font-size: 11px !important;
    width: calc(33% - 3px) !important;
}


.buttonscategory{
    /* his own, 2026-09-28 */
    position:relative;
    top: initial;
    right: initial;
    float:right;
    width: 36px;
    border-radius: 0;
    background:none;
    text-align:center;
    padding:0px;
}

.buttonscategory i{
    font-size:13px !important;
    width: auto !important;
    margin: 0 !important;
    padding-top: 0 !important;
}


.contcatoptions{
    position:relative;
    top: initial;
    right: initial;
    float:left;
    width:100%;
    background: #f9f9f9;
    border-radius: 0px 0px 10px 10px;
}

.sharecatmodal img{
    width: 100px;
    padding: 11px;
}


.searchIn{
    display:none;
    opacity:0;
}

.opacOKI{
    opacity:1 !important;
}

.SOpacityFULL{
    opacity:1 !important;
}

.searchIn_power2{
    z-index: 1000 !important;
    top: 101px !important;
    width: 9% !important;
    left: 57px !important;
}

.searchIn + .crossClose{
    display:none;
}


.videostart{
	background-image: url(../custom/img/uplo.png);
    background-size: 300px;
    background-position: center center;
    background-repeat: no-repeat;
}

.inputCat + .searchIn {
    display: block;
}

.singleLinkCat,
.singleLinkCat:hover{
    color: #000;
    text-decoration: none;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}

.singleLinkCat i{
    color: #000;
    display: block;
    margin-left: 5px;
    font-size: 10px;
    opacity:0.6;
}


.inputUser.hide + .searchIn{
    display:block;
}
 
.searchIn{
    position: fixed;
    z-index: 9999;
    top: 153px;
    width: 16%;
    border: 0px;
    height: 33px;
    left: 46px;
}

.searchIn:focus{
    outline:0;
    border:0;
}

.separerer{
    float: left;
    height: 50px;
    width: 100%;
}

.allStayed{
    height: 98%;
    box-shadow: none;
    background-image: none;
}

@media(max-width: 768px){
    
    .capsaitem .details{
        /* no black line under the picture on a phone either (found by brief AP's builder, 2026-10-07): the wide screen lost its 5 px line on
           2026-09-28 (see "The 5px black line" below), but this !important kept 3 px of it under every card's picture here */
        border-top: 0 !important;
        margin-top: 0px !important;
    }

    .seeattachments {
        position: absolute;
        top: 36px;
        font-size: 2em;
        right: 2px;
        width: auto;
        z-index:2;
        padding-right: 8px;
        border-right: solid 1px #efefef;
        color: #8c8c8c;
        text-align: center;
        background: #fff;
    }
    
    #shareicon i{
        color: #000 !important;
        font-size: 35px !important;
        margin-top: 14px;
        margin-right: 4px;
    }
    
    #iuploit{
        right: 22px;
    }

    .details{
        margin-top:10px;
    }
    
     #pagination {
        position: fixed;
        bottom: 0px;
        width: calc(100% - 65px);
        right: 65px;
        background: #fff;
        padding: 0px;
        list-style: none;
        margin-bottom: 0;
        border-radius: 0px 0px 0px 0px;
        overflow-x: scroll;
        white-space: nowrap;
        box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.54);
        height: 36px;
    }
    
    .formmenu{
        right: 0px; 
    }
    
    #loader{
        left: calc(50% - 33px);
    }
    
    #pagination li {
        float: none;
        width: 49px;
        padding: 0;
        display: inline-block;
    }

    
    .sidebarblock{
        top:85px;
        height: calc(100% - 135px);
        overflow-y: scroll;
    }
    
    .lupaactive{
        display:none;
    }
    
    .titleflow.jobdiscussion{
        position: static;
        width: 100% !important;
        right: 0;
    }
    .capsaitem{
        width: calc(33.3333% - 10px);
    }
    /*CHAN*/
    input[name='emailtosend']{
        padding: 26px 12px;
    }
    
    .textbox{
        display:none;
    }
    
    .managerdesktop{
        top: 85px;
        margin-top: 0px !important;
        left: 0px;
        padding:0px;
    }
    
    .approvedlist{border-right:0px !important;}
    
    .imgset.sharinglist .sharinglistitem{
        margin-bottom: 50px !important;
    }
    
    .sharinglist{
        margin-top:45px;
        padding-bottom: 70px;
    }
    
    .managerdesktop form{
        margin-right:47px;
    }
    
    ul.menucatstop{
        position:fixed;
        width:60%;
        left:-110%;
        height:100%;
        top:0;
    }
    .opensidebar{display:block;}
    header{height:90px; position:fixed; overflow:visible;}
    .detailphoto{padding-top:10px !important;}
    .footerfonsbaix{width:100%;}
    
    .desk{
        width:90%;
        margin:3% 5%;
    }
    .sharingdetail{
        padding-top: 6px;
    }
    
    .secondline .logo img{}
    
    .opensidebar{
        position: fixed;
        right: 70px;
        bottom: 0px;
        z-index: 1;
        padding: 0px 20px;
        font-size: 35px;
        border-radius:4px 0px 0px 0px;
        background: #fff;
        border-top: solid 1px #ccc;
        border-left: solid 1px #ccc;
    }
    
   
    .footerfonsbaix{
        padding-bottom: 110px;
    } 
   
    
    .headerlistshare{
        float: right;
        margin-top: 10px;
        width: 100%;
    }
    
    .inboxoutbox {
        opacity: 1;
        float: left;
        background: #CCC;
        color: #8c8c8c;
        font-size: 20px;
        margin-right: 10px;
        margin-bottom: 15px;
        border-radius: 3px;
        padding: 11px 14px;
        border: solid 0px #ababab;
        border-radius: 0 !important;
    }
    
    .headerlistshare form{
        float: left;
        margin-top: -1px;
        margin-bottom: 10px;
        width: 44%;
        margin-right: 65px !important;
    }
    
    .chatlayout {
        margin-bottom: 50px;
    }
    
    .who li{
        width:100% !important;
    }
    
    .titleflow.jobdiscussion {
        margin-top: 10px;
    }
    
    
    
    .movilheaderhidden form.form-inline div{
        border-top:solid 1px #ccc;
        border-bottom:solid 1px #ccc;
        margin-top:0px;
    }
    
    .movilheaderhidden form.form-inline div div{
        border-top:solid 0px #ccc !important;
        border-bottom:solid 0px #ccc !important;
        margin-top:0px !important;
    }
    
    .moreheightheader {
        height: 100% !important;
        z-index: 100;
    }
    
    .plupload_file_status{
        width: auto;
        margin-left: 10px;
        float: right;
        text-align: right;
    }
    
    .plupload_file_size{
        width:auto !important;
    }
    
    .desk .form-group{
       width: calc(100% - 17px) !important;
    }
    
    #dat{
        width: 100% !important;
    }
    
    .desk .form-group .form-group{
        width: 100% !important;
    }
    
    #filetype{
        margin-bottom: 7px !important;
    }
    
    .plupload_header_text{
        display:none;
    }
    
    
    .movilheaderhidden .countitems{
        margin-left: 15px;
        border-radius: 3px;
        border: solid 1px #ccc;
        padding: 6px 10px;
        margin-top: 28px;
    }
    
    .relateds {
        margin-bottom: 250px;
    }
    
    .owl-carousel{
        display:none;
    }
    
    header.begining{
        height: 100% !important;
    }
    
    .begining .secondline .form-group {
        width: 100%;
        height: auto;
        padding: 20px 20px 0px 20px;
        margin-top: 0px !important;
        margin-bottom: 0px !important;
        float: left !important;
    }
    
    .formbeginning.arrar{
        margin-right:0px !important;
    }
    
    .formbeginning input{
        border-radius: 3px !important;
        padding: 26px 14px;
        border-right: solid 1px #ccc !important;
        border-left: solid 1px #ccc !important;
    }
    
    .begining .secondline .logo{
        width: 100%;
        text-align: center;
    }
    
    .begining .secondline .logo a {
        height: 71px;
        float: left;
        width: 100%;
        text-align: center;
    }
    
    .begining .secondline .logo img.logoStandard {
        height: 100%;
        margin-top: 21px !important;
        padding-left: 0px;
        width: auto;
        padding-right: 0;
        float: none;
    }
    
    .secondline .slogan, .secondline .slogan h1{
        width:100%;
        float:left;
        margin:0 !important;
        padding:0 !important;
        text-align:center;
        margin-top:20px !important;
    }
    
    header .secondline form.arrar input[type="submit"], .forgotpassword {
        float: left;
        width: calc(100% - 38px);
        margin: 18px 18px 0px 18px !important;
        border: 0px !important;
        padding: 13px;
        border-radius: 3px !important;
    }
    
    .forgotpassword{
        margin-top: 10px !important;
    }
    
    .footerfonsbaix{
        padding: 20px !important;
    }
    
    .inf ul li:last-child {
        padding-bottom: 42px !important;
    }
    .imgset.sharinglist .sharinglistitem {
        width: 93% !important;
    }
    .capsaitem{
        width: calc(50% - 10px);
    }
}



@media(max-width: 1200px){
    ul.menucatstop{ width: calc(25% - 10px);}
    header{ overflow:visible; }
    .footerfonsbaix{width:calc(75% + 10px);}
    .openheader{
        position: fixed;
        right: 0px;
        bottom: 0px;
        display:block;
        z-index: 101;
        padding: 0px 17px;
        font-size: 35px;
        background: #fff;
        border-radius: 0px 0px 0px 0px;
        border-left: solid 0px #ccc;
        border-top: solid 1px #ccc;
    }
}

.selectalldesktop, .sharedesktop, .uploaddesktop, .desktopdesk{
    display:block;
}

.selectallmvl, .uploadmvl, .desktopmvl{
    display:none !important;
}

.sharemvl{
    display:none;
}

#shareiconmvl{display:none !important;}

#dat_kw_2 .bootstrap-tagsinput{
    height: 70px;
    border: solid 1px #ccc;
    width: 100%;
    margin-top:7px;
}

#dat_kw_2 .bootstrap-tagsinput input{
    width: 150px;
}

.kw_tags{
    background: none;
    padding: 1px 7px;
    margin: 4px 4px 0px 0px;
    border-radius: 3px;
    float: left;
    font-size: 12px;
    color: #757575;
    border: solid 1px #ccc;
}

.barfootmovil{display:none;}

#disco{
    padding: 16px 26px !important;
    font-size: 15px;
    height: auto;
    width: auto;
    right:65px;
    background: #fff !important;
    z-index: 9999;
    color: #000 !important;
    border-radius: 0px 0px 3px 3px !important;
}

#carregarUplo{
    padding: 0px 8px 8px 8px;
    float: left;
    width: 100%;
}

.hidemessages{
    width:40px;
    height:40px;
    background:#fff;
    border-radius:999px;
    text-align:center;
    float:left;
    padding:10px;
    box-shadow:0px 0px 6px rgba(0,0,0,0.4);
}

.hidemessages:hover{
    box-shadow:0px 0px 6px rgba(0,0,0,0.8);
    cursor:pointer;
}

.chatbutton{
    display:none;
}

@media(max-width: 768px){
    .attpiiii{
        top: 41px !important;
        right: 51px !important;
        z-index: 10;
    }
    .chat {
        /*width: calc(100% - 0px);*/
        position: fixed;
        width:0;
        height: calc(100% - 255px);
        z-index: 1;
        top: 84px;
        left: 0;
        overflow:hidden;
    }
    
    .chatAdded{
        width: calc(100% - 65px);
        overflow:visible;
    }
    
    .chatbutton{
        display:block;
    }
    
    .casemessages {
        margin: -8px 0px 0px 0px;
    }
    
    /*CHAN*/
    #resetform {
        z-index: 1;
        position: fixed;
        bottom: 12px;
        right: initial;
        margin-left: -14px !important;
        z-index: 999 !important;
        margin-left: -58px;
        padding: 5px 12px;
        height: 34px;
        color: #000000;
        width: 42px;
        background: none;
        border-radius: 4px;
        font-size: 27px;
        border: 0;
        cursor: pointer;
    }
    
    .chatlayout{
        position: static;
        width: 100%;
        margin-top: 0px;
    }
    .titleflow{
        width:auto !important;
        margin-top: 0px;
        margin-bottom: 10px;
    }
    .capsaitem{ width: calc(33.3333% - 10px); }
    
    header{ position:fixed; overflow:visible; height: 48px; width: 28% !important; }
    .detailphoto{
        padding-top: 0px !important;
        padding-left: 0px;
        padding-right: 0px !important;
    }
    .detailphoto .imgset{
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-top: 0px !important;
        margin-top: -6px !important;
    }
    .detailphoto .imgset img {
        border-radius:0px !important;
    }
    .footerfonsbaix{width:100%;}
    
    .desk {
        width: calc(100% - 66px);
        border-radius: 0px;
        margin: -6px 0px 1px 0px;
        padding:8px;
    }
    
    
    .contpujador {
        padding: 0;
    }
    
    .contpujador{margin-top:0 !important;}
    
    .plupload_file_size, .plupload_file_status{
        display:none;
    }
    
    .desk select, #dat_kw_2 .bootstrap-tagsinput{
        width: 100%;
    }
    
    .sharingdetail{
        padding-top: 6px;
    }
    
    /*CHAN*/
    .nomovilshow{display:none !important;}
    
    
    
    .footerfonsbaix{
        padding-bottom: 110px;
    }
    
    .lightboxOverlay, .lb-outerContainer, .lb-image{
        width: 100% !important;
        height: auto !important;
    }
    
    .lightbox {
        padding-left: 20px;
        padding-right: 20px;
        z-index: 99999;
        background: rgba(0,0,0,0.7);
    }
    
    .nouploadbtn{
        display:none !important;
    }
    
    .selectallmvl, .desktopmvl{
        display:block !important;
    }
    
    .desktopmvl{
        position: fixed;
        height: 36px;
        top: 30px;
        right: 0px;
    }
    
    .uploadmvl{
        display:block !important;
        float:left !important;
    }
    
    
    /*
    .sharemvl{
        display: block !important;
    }
    */
    #shareiconmvl{display:block !important;}
    
    .noresult{
        width: auto;
        margin-top: 10vh;
    }
    
    .sessout{
        margin-top: 28px !important;
    }
    
    .searchmovil{
        width: 100% !important;
        margin-top: 17px !important;
    }
    
    .formsearchmovil{
        width: 100% !important;
    }
    
    .movilheaderhidden {
        width: 100%;
    }
    
    .mobileline{
        width:100% !important;
    }
    
    .forgotpassword {
        width: calc(50% - 20px);
        margin: 18px 18px 0px 0px !important;
        border-radius: 0px 4px 4px 0px !important;
    }
    
    header .secondline form.arrar input[type="submit"]{
        float: left;
        width: calc(50% - 20px);
        margin: 18px 0px 0px 18px !important;
        border-right: solid 1px #777 !important;
        padding: 13px;
        border-radius: 4px 0px 0px 4px !important;
    }
    
    .formbeginning input[type='email']{
        border-radius: 3px 3px 0px 0px !important;
        border-bottom: 0px;
        text-align:center;
    }
    
    .formbeginning input[type='password']{
        border-radius: 0px 0px 3px 3px !important;
        text-align:center;
    }
    
    .begining .secondline .form-group{
        padding: 0px 20px 0px 20px;
    }
    
    #resetform {
        margin-left: -43px;
    }
   
}



.buttonshowicons{
    display:none;
}

.wholesearch{
    float: right;
    margin: 30px 10px;
    margin-left: 6px;
}

.sentencewhole{
    float: left;
    margin-right: -4px;
    font-size: 11px;
    text-align: left;
    width: 103px;
    margin-top: -17px;
    color: #9e9e9e;
    border: solid 1px #e4e4e4;
    padding: 10px;
    border-radius: 3px;
}

.autoheight{
    height:auto;
}

.wholesentence.sall{
    display:none;
}

.overflowvisible{
    overflow:visible !important;
}

.parte1{
    float:left;
    width:50%;
    padding: 20px;
}

.titlemodal{
    width: 100%;
    float: left;
    margin: 0;
    margin-bottom: 0;
    padding: 20px 20px 0px 20px;
}

.clos {
    margin: -29px -10px 0px 0px;
}

@media(min-width: 768px){
    #info_edit_modal .modal-dialog, #modaleditlist .modal-dialog {
        width: 900px !important;
    }
    #info_edit_modal .modal-content, #modaleditlist .modal-content {
        padding: 15px;
    }
}


@media(max-width: 768px){
    .parte1{
        width:100%;
    }
    .modalcommon .modal-content {
        padding: 10px;
    }
     
    .desktop_ajax .sharinglist{
        margin-top: 44px !important;
        margin-left: 5px !important;
        width: calc(100% - 34px);
    }
    
    .boxButtonsVersion{
        padding:8px !important
    }
    
    .desktopsD .inf{
        padding:10px !important;
        margin-bottom: 0px;
    }
    .desktopsD .inf ul li{
        line-height: 2em;
    }
    .desktopsD img {
        float: left;
        width: 100%;
        border-radius: 6px !important;
        padding: 0px 11px 11px 11px;
    }
    .desktopsD .inf ul li:last-child {
        padding-bottom: 11px !important;
    }
    .userslayout{
        width:100% !important;
    }
    .seeattachments {
        bottom: 11px;
        top: initial;
        right: 10px;
        padding-right: 0px;
        border-right: solid 0px #efefef;
        background: #fff;
    }
    .loadversions{
        float: left;
        width: calc(100% - 20px);
        margin-left: 10px;
        padding: 6px 6px 0px 6px;
        margin-bottom: 4px;
        margin-top: 4px;
        background: #fff;
        border-radius: 4px;
    }
    .secondline .logo img.logoStandard {
        float: left;
        width: auto;
        margin-top: 16px !important;
        padding-right: 0px;
        padding-left: 0px;
        max-width: 132px;
    }
}


.hidemovil_user{
    display:block;
}

.showmovil_user{
    display:none;
}


.showmovil_backer{
    display:none;
}

.selectalldesktop{
    margin-left: 25px !important;
}

.editers_laptop{
    float:right;
}

.hiddenmob{
    display:none !important;
}

.chooseType{
    margin: 0px 1px 0px 30px;
    float:left !important;
    position:relative;
}


.plusleftmenu{
    float: right !important;
    width: auto !important;
    position: fixed;
    z-index: 9999;
    background: #0479e9;
    color: #fff;
    padding: 8px 12px 6px 12px;
    top: 90px;
    left: 0px;
}

.droppers_hide{
    padding: 9px 11px 9px 12px;
    float: left;
    font-size: 1em;
    opacity:0;
    display:none;
}

.droppers{
    padding: 9px 9px 9px 13px;
    float: left;
    font-size: 1em;
    opacity: 0.4;
    cursor:grab;
    display:none !important; 
}

.droppers:hover{
    cursor:grab;
    opacity:1;
}

.droppers_cat{
    position: absolute;
    z-index: 999;
    right: 36px;
    top: 10px;
    opacity: 0.4;
    display:none !important; 
}

.droppers_cat:hover{
    opacity:1;
    cursor:grab;
}

.bodySpecial .detailphoto{
    width: calc(100% - 35px) !important;
    padding-top: 8px;
}

.bodySpecial .lessLeft{
    left:-100% !important;
}

.bodySpecial .contpujador{
    width: calc(100% - 20px);
    margin-top: 0px !important;
    padding-left: 53px;
}

.bodySpecial .box_dasboard {
    width: calc(22% - 41px);
}

@media(max-width: 1125px){
    /*
    .yyy{
        left:-100%;
        height:0;
        z-index:999;
    }*/
    
    .agafador{
        display:none;
    }
    /*
    .yyy.more{
        left:0;
        height:100%;
        width:100%;
    }*/
    
    .inputCat {
        top: 85px;
    }
    
    .droppers_cat{
        font-size: 1.5em;
        padding: 7px 12px;
    }
    
    #toggleDragg{
        display:block;
    }
    
    .nomobileshow{display:none;}
    
    .bodySpecial .contpujador{
        width: calc(100% - 0px);
        padding-left:17px;
    }
    
    .plusleftmenu{display:none !important;}
    
    .bodySpecial .detailphoto{
        width: calc(100% - 0px) !important;
        padding-top: 8px;
    }
    
    .chooseType{
        float: left !important;
        margin: 0 !important;
        position: absolute !important;
        right: 57px;
        top: 10px;
    }
    
    .editers_laptop{
        float: right;
        position: fixed;
        width: 60px;
        right: 6px;
        z-index: 99999;
        display: flex;
        flex-direction: column-reverse;
    }
    .littleAnim{
        display:none !important;
    }
    .yyy{
        padding-top: 5px !important;
    }
  
    .showmovil_backer{
        display: block;
        float: right;
        margin-top: 13px;
        margin-right: 5px;
    }
    
    .hidemovil_user{
        display:none;
    }
    
    .showmovil_user{
        display: block;
        margin-top: 10px !important;
        margin-left: 10px;
    }
    
    .showmovil_user .roundonline{
        display:none;
    }
    
    
    .sharinglist {
        margin-top: 45px;
    }
    
    #shareicon i{
        color: #000 !important;
        font-size: 35px !important;
        margin-top: 14px;
        margin-right: 4px;
    }
    
    .massivedownload {
        padding: 14px 11px;
        float: left;
        text-align: center;
        color: #fff;
        width: 76px;
        height: 53px;
        background: none !important;
        font-size: 20px;
        border-left: solid 1px #ccc;
        border-right: solid 1px #ccc;
        right: initial;
        left: 0;
        position: fixed;
        bottom: 0px;
        z-index: 999;
        border: 0;
        border-radius: 0px 0px 0px 0px;
    }
    
    header .secondline form {
        width: auto;
        margin-right: -1px;
        height: auto !important;
    }
    
    .sidebarblock{
        overflow-y: visible;
    }
    
    .desplegable_notific{
        display:none;
    }
    
    #pagination{bottom:53px; padding-bottom: 53px;}

    .tooltip.fade{display:none !important;}
    .wholesentence.sall{
        float: left !important;
        width: 107px !important;
        border: 0 !important;
        margin-top: 32px !important;
        display:block;
    }
    .sentencewhole{
        display:block;
        font-size:15px;
        width:auto;
        margin:0;
        padding:0;
        border: solid 0px #e4e4e4;
        margin-right:10px;
    }
    .wholesearch{border:0 !important; margin-left:0px;}
    
     /*CHAN*/
    .backdetmovil, .backdetmovil:hover, .backdetmovil:focus, .backdetmovil:active{
        float: right !important;
        margin-top: 0;
        position: static;
        border: 0px !important;
        border-radius: 0px;
        padding: 7px 15px 3px 15px !important;
        font-size: 30px !important;
        background: #fff !important;
    }
    /*CHAN*/
    .loginmodal-container {
        transform: translate(-50%,-50%) !important;
        max-width: 300px !important;
        padding: 20px !important;
    }
    
    .checkedcheck[type='checkbox']:after {
        width: 20px;
        top:0px;
        left:0px;
        height: 20px;
    }
    
    ul.menucatstop input[type=checkbox]:after, #selectall[type=checkbox]:after {
        left: -3.6px;
        top: -4px;
        margin-left: -3px;
        width: 23px;
        height: 18px;
        border: solid 1px #c7c7c7 !important;
    }
    
    
    #shareicon{
        position: absolute;
        top: -66px;
        bottom: initial !important;
    }
    
    .noshowmovil{display:none !important;}
    
    header .secondline form {
        width: 100%;
        background: none; 
    }
    
    header .botonet_notif, header .shareitem.sharegroup.nomovilshow{
        display:none;
    }
        
    .movilheaderhidden form div{
        width:100% !important;
        float:left !important;
    }
    
    .showmovil{
        display:block;
        top: 10px !important;
        bottom:initial;
        top:0;
        z-index: 9999;
        margin-right: 0px;
        border-radius: 0px;
        border: 0;
        padding: 20px !important;
    }
    
    .detailphoto{width:100% !important; padding-top: 10px;}
    .opensidebar{display:block;}
    .opensidebar{
        position: static;
        right: 66px;
        float: right;
        bottom: 0px;
        width: auto !important;
        z-index: 101;
        padding: 6px 22px;
        font-size: 29px;
        height: 100% !important;
        border-radius: 0;
        border-top: 0;
        border-left: solid 0px #eaeaea;
    }
    
    ul.menucatstop{
        position: fixed;
        width: calc(100% - 60px);
        left: 0%;
        height: 100%;
        top: 0;
        z-index: 9999;
        padding-bottom: 50px;
        padding-top: 0 !important;
        box-shadow: 0px 0px 100px rgba(0,0,0,0.8);
    }

    ul.menucatstop .addcat_button, .userListBox .createuserplus {
        width: 60px !important;
    }
    .userListBox .createuserplus i, .userListBox .createuserplus_detail i {
        width: 60px;
    }

    .copyMail {
        margin-left: 5px;
        font-size: 10px;
    }

    .companyMembers.inle .operators a {
        width: 19px !important;
        font-size: 0.8em !important;
    }

    .opensidebar{display:block;}
    
    /*CHAN*/
    .barfootmovil{
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 9999;
        background: #fff;
        box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.37);
        border-left: solid 10px #000;
    }

    ul.menucatstop .uploadcat {
        float: left;
    }
    
    .hiddenmob{
        display:block !important;
    }
    
    .mobilehide {
        display: none;
        background: #fff;
        position: fixed;
        top: initial;
        left: 0px;
        bottom: 53px;
        width: 100%;
        z-index: 99999;
        padding: 10px;
        box-shadow: 0px -23px 85px rgb(0 0 0 / 40%);
    }
    
    /*CHAN*/
    .buttonshowicons{
        float: right;
        padding: 15px 15px 15px 0px;
        font-size: 32px;
        border-left: solid 1px #eaeaea;
        border-radius: 0;
        width: 50px;
        height: auto;
        margin-top: 0px;
        padding: 8px 13px;
        font-size: 26px;
        margin-right: 0px;
        z-index: 100;
        position: static;
        display:block;
        right: 0px;
        bottom: 0;
        top: initial;
    }
    .number{
        bottom: -45px;
        right: -10px;
    }
    .movilheaderhidden form div {
        margin-top: 10px !important;
    }
    .movilheaderhidden .countitems {
        margin-left: 0px;
        margin-top: 13px;
    }
    .shareitem.sharegroup.desktopdesk{
        top: 9px;
    }
    header .secondline form input[type="search"] { 
        padding: 10px;
        background: none;
    }
    .movilheaderhidden form.form-inline div {
        border-left: solid 1px #e4e4e4;
        border-radius: 4px;
        overflow: hidden;
    }
    .opensidebar {
        right: 0px;
    }
    .botonet_notif .fa.fa-angle-left{
        margin-top: 14px !important;
    }
    
    
    .hidm{
        display:none !important;
    }
    
    .contpujador {
        width: 100%;
        margin-top: 0 !important;
    }
    
    .shareitem_head {
        padding: 4px 9px 4px 9px;
        margin: 3px 2px !important;
    }
    
    .shareitem_head i{
        font-size:12px;
    }

    .shareitem_head a:last-child{
        margin-top:40px !important;
    }

    .expandBig_style{
        display: none !important;
    }
    
}

@media(max-width: 600px){
    .capsaitem{ width: calc(100% - 10px); }
    
    ul.menucatstop label {
        padding: 10px 10px;
    }
    
    .topfolder {
        border-top:0px !important;
        background-size: 113% auto;
    }
    .imgset.sharinglist .sharinglistitem {
        width: calc(100% - 3px) !important;
        border-top: 0;
        left: 0 !important;
        margin-left: 10px;
        margin-bottom: 50px !important;
    }
    .specialFolder .topfolder {
        height:51px !important;
    }
    .specialFolder .checkedcheck[type='checkbox']:after {
        left: 0px !important;
        top: 10px !important;
        width: 20px !important;
        height: 20px !important;
    }
   
}


.nopacity{
    background:none !important;
}

.loginmodal-container{
    transform:translate(-50%,-50%) !important;
    top:50%;
}

.desktopmblbtn{
    position: static;
    margin: 0;
    padding: 0;
    width: auto;
    float: left;
}

.desktopmblbtn a{
    float: left;
    margin: 0px;
    background: #fff;
    padding: 12px 18px 13px 18px;
}
    
@media(max-width: 600px){
    /*
    .loginmodal-container{
        overflow-y: scroll;
        background: #fff !important;
        transform: none !important;
        height: auto;
        top: 0;
        left: 0;
        width: 100% !important;
        min-width: -webkit-fill-available;
        border-radius: 0;
        box-shadow: 0 0 0 #fff !important;
        padding-bottom: 18px !important;
        min-height: 100%;
        min-width: 100% !important;
    }
    .forgotpassword {
        margin: 0px 18px 0px 18px !important;
        margin: 0 !important;
    }
    .copyr {
        float: right;
        margin-top: 0px;
        font-size: 15px !important;
        color: #969696;
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
        position: absolute;
        bottom: 0;
        color: #000 !important;
        left: 0;
    }
    .loginmodal-container a, .loginmodal-container a:hover, .loginmodal-container a:focus {
        position: relative !important;
        bottom: 0 !important;
        margin-top: 31px;
    }*/
    body{background:#fff; padding-bottom:31px;}
}


/* uploadfield artpulse.eu */

.uploadfield label, .uploadfield input, .uploadfield select{
    width:100%;
    float:left;
    font-size: 12px;
    margin-top:0px;
    border: solid 1px #dadada;
}

.uploadfield{
    float:left;
    margin-top:0;
    margin:10px 10px 5px 10px;
}

.uploadfield .input-group-addon.add-on{
    padding:0;
    margin:0;
    width: 0;
}

.uploadfield:last-child{
    padding-bottom:13px;
}

.uploadfield .bootstrap-tagsinput{
    margin-top: -2px !important;
    padding-top: 10px;
    border: solid 1px #dadada !important;
    font-size: 12px;
    margin-bottom: 0;
}

.uploadfield textarea{
    border: solid 1px #dadada !important;
    font-size: 12px;
}

.uploadfield label{
    background: #efefef;
    border-radius: 3px 3px 0px 0px;
    padding: 6px 12px;
    margin-bottom: -4px;
    color: #757575;
    position: relative;
    z-index: 9;
    font-size: 12px;
    border: solid 1px #dadada;
    border-bottom: solid 0px #ccc;
}

.uploadfield.quarter{
   width:calc(25% - 20px);
}

.uploadfield.third{
    width:calc(33.3333% - 20px);
}

.uploadfield.half{
    width:calc(50% - 20px);
}

.uploadfield.full{
    width:calc(100% - 20px);
}

.rel_proj_list li{
    float: left;
    border-top: solid 1px #ccc !important;
}

.rel_proj_list li a{
    float: left;
    width:auto !important;
    border-top: solid 0px #ccc !important;
    margin-top:0 !important;
}

.rel_proj_list li i.pro{
    float: left;
    padding: 7px 5px;
    font-size: 0.8em;
    color: #ccc;
    cursor:pointer;
}

.rel_proj_list li i.pro:hover{
    color:#9a9a9a !important;
}

.modal h3{
    float: left;
    width: 100%;
    margin-top: 0;
    margin-bottom: 20px;
}

.adminbuscmvl{
    display:none
}
.adminbusc{
    display:block;
}

@media(max-width: 1180px){
    .uploadfield{
        width:calc(100% - 20px)!important;
    }
    .adminbusc{
        display:none
    }
    .adminbuscmvl{
        display:block;
    }
}


.modal .caseprevierw input[type="file"] {
    width: 100%;
    height: 111px;
    margin-bottom: 14px;
    background: url(../../view/custom/img/uplo.png);
    background-size: 75px;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 4px;
    background-color: #efefef;
    text-indent: -999em;
    outline: none;
    color: transparent;
}


.itemas{
    float: left;
    margin-top: 0px;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    margin-bottom: 50px;
}

.itemas .capsaitem .interior img {
    max-width: 100px !important;
    height:initial;
    margin-right:10px;
    border-right: solid 1px #CCC;
}

.itemas.users .capsaitem .interior img, .itemas.users .capsaitem .interior img:hover {
    max-width: 55px !important;
    height: initial;
    margin-right: 10px;
    border: solid 0px #CCC !important;
    border-radius: 999px;
    margin-bottom: 9px;
    margin-left: 10px;
    margin-top: 8px;
}

.itemas .capsaitem a:hover img {
    transform: initial !important;
}

.itemas .delete_profile_photo{
    background: #FFF;
    float: left;
    position: absolute;
    margin-left: 0px;
    top: 0;
    border-radius: 999px;
    left: 0;
    border: 0;
}

.itemas .linea {
    text-align: left;
    float: left;
    width: 100%;
    border-top: solid 1px #e5e5e5;
    border-bottom: solid 1px #fff;
    padding: 5px 10px;
    background: #f9f9f9;
}

.itemas .capsaitem .interior {
    overflow:hidden !important;
    padding:0 !important;
}


.itemas .capsaitem{
    margin-left: 12px;
    margin-right: 12px;
    margin-bottom: 12px;
    margin-top: 12px;
    width: calc(20% - 24px);
}

.itemas .capsaitem .interior{
    background: #FFF;
    box-shadow: 2px 2px 7px #c5c5c5;
    padding: 5%;
    border-radius: 3px;
    width: 100%;
}

.itemas .capsaitem .info i{
    width:18px;
    font-size:19px;
    color:#a1a1a1;
}

.itemas .linea.user a.edit, .itemas .linea.user a.editkey, .itemas .linea.user a.deleteuser{
    float: right;
    padding: 5px 8px;
    text-align: center;
}

.itemas .linea.user {margin: 0px;}

.itemas .btnusercontrol{
    margin-bottom:5px;
}

.itemas .btnusercontrol i{
    color:#fff !important;
    font-size:14px !important;
}


.itemas .progress {
    height: 23px;
    margin-bottom: 0px;
    overflow: hidden;
    float: left;
    width: calc(100% - 24px);
    background-color: #eaeaea;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    box-shadow: inset 0 0px 0px rgba(0,0,0,.1);
    text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.48);
    margin: 12px;
}

.itemas .diskused{
    float: left;
    width: 100%;
    padding: 6px 10px;
    font-size: 12px;
}

.itemas .diskused i {
    width: 18px;
    font-size: 13px !important;
    color: #a1a1a1;
}

.settingsbtn{
    width: auto !important;
    float: right !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
}

.assigncat .modal-dialog {
    margin: 15px auto !important;
    width: 330px !important;
}


.assigncat .modal-dialog {
    margin: 15px auto !important;
    width: 330px !important;
}

.assigncat label {
    margin-bottom: 7px !important;
}

.assigncat .modal-dialog {
    margin: 15px auto !important;
    width: 450px !important;
}

.assigncat ul{
    padding:0;
}

.assigncat ul li ul{
    padding-left:15px !important;
}

.assigncat ul{
    list-style:none;
    margin:0;
    width:100%;
    float:left;
}

.assigncat ul li{
    float:left;
    width:100%;
    list-style:none;
    margin:0;
    padding:0;
}
/*
.assignc input[type="checkbox"]{
    width: 0px !important;
    height: 0px !important;
    float: left !important;
    margin-left: 3px;
    margin-top: -14px !important;
    border: 0;
}

.assignc span.wword{
    float: left;
    margin-left: 42px;
}

.assignc .checkedcheck[type='checkbox']:after, .assignc #selectall2[type=checkbox]:after, .assignc input[type="checkbox"]:after{
    position: relative;
    display: block;
    left: -1.6px;
    top: 2.9px;
    width: 20px;
    height: 20px;
    border-radius: 2px;
    border-width: 1px;
    border-style: solid;
    border-color: #ccc;
    content: "";
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
}
*/
.assignc .checkedcheck[type='checkbox']:checked:after, 
.assignc #selectall2[type='checkbox']:checked:after, 
.assignc input[type="checkbox"]:checked:after{
    background-image:url(../../view/custom/img/check.png) !important;
    background-size: 19px;
    border:0;
}

.assignc button{
    float: left;
    margin-bottom: 12px;
    width: 100%;
}

.createuserplus,
.createuserplus_detail{
    width: 100%;
    padding: 12px;
    text-align: center;
    color: #fff;
    background: none;
    border: 0;
    cursor:pointer;
}

.createuserplus:focus,
.createuserplus_detail:focus{
    outline:0;
}

.adminbusc .btn.btn-primary{
    border:0 !important;
}

.externallist{
    float:left;
    width:100%;
    padding:0;
    margin:0;
    list-style:none;
}

.externallist li{
    float:left;
    width:100%;
    padding:5px;
    margin:0;
}


.lirowsending{
    float:left;
    width:100%;
}

.lirowsending img{
    width: 74px;
    height: auto;
    float: left;
    border-radius: 3px;
    margin-bottom: 20px;
}

.lirowsending .rowsending{
    float:left;
    width:100%;
}

.lirowsending .infocase{
    float: left;
    width: calc(100% - 100px);
    margin-left: 25px;
    margin-bottom: 15px;
}

@media(max-width: 1125px){
    .itemas .capsaitem{
        width:calc(33.333% - 12px);
    }
    .selectalldesktop{
        margin: 10px 20px 13px 11px !important;
    }
    .inputUser.hide + .searchIn{
        display:none;
    }
}

@media(max-width: 768px){
    .itemas .capsaitem{
        width:calc(100% - 18px) !important;
    }
}

@media(max-width: 600px){
    .conteinerscreens{
        width: 160px;
    }
    .conteinerscreens i:not(.plusiconFiletype){
        width:25% !important;
    }
    .conteinerscreens select{
        width:75% !important;
    }
    .secondline .logo img.logoStandard {
        height: auto;
        float: left;
        width: auto;
        margin-top: 0px !important;
        padding-right: 6px;
        padding-left: 12px;
        max-width: 170px;
    }
    .plusiconFiletype {
        width:auto !important;
    }
    
}

@media(max-width: 450px){
    .desktop_ajax .versionscontrol {
        margin-left: 0px !important;
        width: 100% !important;
    }
    .itemas .capsaitem{
        width:calc(100% - 12px);
    }
}

.selected_checkbox{
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.30);
    border: solid 4px #1767d4;
}

.opaclowe{
    opacity:0.6;
}

.inputUser, .inputCat{
    outline:0 !important;
}

.selected_checkbox_d{
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.30);
    border: solid 1px #1767d4;
}

.companyMembers li{
    padding: 10px 0px !important;
    border-top: dotted 0px #929292 !important;
    margin-bottom: 0px;
}

.companyMembers li:first-child{
    border-top: dotted 0px #929292 !important;
}

.companyMembers li.operators .btnusercontrol{
    background: none !important;
    color: #a7a7a7;
    font-size: 0.9em;
    border: 0;
    padding: 0px 6px;
    height: auto;
}

.usersList .infoCo{
    padding: 3px 30px;
    float: left;
    width: 100%;
    font-size: 0.9em;
}

.usersList .infoCo{
    padding: 5px 30px 0px 30px !important;
}

.usersList .infoCo i{
    width: 15px;
    color:#ccc;
}

.companyMembers li.operators {
    margin-bottom: 20px;
    padding-top: 12px !important;
    border-top: solid 0px #dadada !important;
}

.poweringUser{
    float:left;
}

.uploadPhotoCompany{
    cursor:pointer;
}

.poweringUser i{
    font-size:0.7em;
    margin-left:-3px;
}

.copyMail{
    margin-right: 2px;
    font-size: 12px;
}

#loadmenuCats.loading {
    opacity: 0.5;
    pointer-events: none;
}
#loadmenuCats.loading::after {
    content: '';
    position: fixed;
    top: 16%;
    left: 47px;
    z-index: 99999;
    width: 30px;
    height: 30px;
    border: 3px solid #ccc;
    border-top-color: #333;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

.companyPhoto img{
    max-width: 115px;
    width: 100%;
    height: auto;
    margin: 12px 0px;
    float: left;
    border-radius: 0;
    max-height: 80px;
    object-fit: contain;
}

.companyPhoto img.emptyE{
    max-width: 30px;
    width: 100%;
    height: auto;
    margin: 5px 0px;
}

.spaceButton{
    background: #fff;
    padding: 6px 8px;
    border-radius: 99px;
    box-shadow: 0px 0px 9px #00000021;
    margin: 5px 0px 0px 0px;
    text-align: center;
}

ul.menucatstop .subulcat input[type="checkbox"].the_one_search {
    left: 0;
    top: 4px !important;
    position: relative;
    float: left;
}

.buttonsCreate_modal{
    float:left;
    margin-bottom:20px;
}

.linkToCo, .linkToUs{
    font-weight: bold;
    font-size: 0.9em;
}

.buttonsCreate_modal button{
    margin-right:15px !important;
}

form.choose_v{
    float: left;
    background: #fff;
    width: calc(100% - 112px);
    margin-left: 111px;
    padding: 13px;
    margin-bottom: 10px;
    border-radius: 4px;
}

form.choose_v select:focus{
    outline:0;
}

.active_comparsion{
    float: left;
    padding: 2px 10px 0px 0px;
    cursor:pointer;
}

.active_comparsion:hover{
    opacity:0.7;
}

.active_comparsion i{
    font-size:1.4em
}

.sharingdetail .attachm, .attachm .state {
    float: right;
    width: calc(100% - 56px) !important;
}

.sharingdetail .attachm{
    width: 100%;
    border-top: solid 0px #ccc;
}

.sharingdetail .attachm .state{
    background:none;
    margin-bottom: 0px;
    padding:0;
}


.sharingdetail .attachm .state{
    border-top: dotted 1px #ccc;
}

.sharingdetail .attachm .state:first-child{
    border-top: dotted 0px #ccc;
}

.sharingdetail .attachm .caseinfo h3 {
    margin-top: 8px;
    font-size: 12px !important;
    margin-bottom: 0px;
    opacity: 0.5;
}

.sharingdetail .attachm .caseinfo h3 i {
    font-size: 10px !important;
    margin-right: 6px;
}

.sharingdetail .attachm .caseinfo p {
    border-top: dotted 0px #d4d4d4;
    padding-top: 7px;
    font-size: 0.85em;
    padding-left: 19px;
}

.newsletter_layout form{
    padding: 0;
    width: 100%;
    position: relative;
    float: left;
    margin-left: 2px;
    margin-top: 10px;
    border-radius: 4px;
}

.newsletter_layout .buttons_group{
    margin-top:20px;
}

.case_newsletter_sample{
    background: #fff;
    float: left;
    width: 100%;
    padding-top: 15px;
    border-radius: 4px;
    box-shadow: 0px 0px 20px hsla(0, 0%, 0%, 0.12);
}

.newsletter_layout form .form_btn{
    float:left;
    position:relative;
    padding:15px 20px;
    margin-right:8px;
}

.filenw{
    display: block;
    height: 100px;
    margin-bottom: 14px;
    color: transparent !important;
    float: right !important;
    background: url(../custom/img/uplo.png);
    width: 100% !important;
    background-size: 63px;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 4px;
    background-color: #efefef;
    text-indent: -999em;
    outline: none;
}

.newsletter_layout .casesnewsletter textarea{
    margin-top:10px;
    margin-bottom:20px;
    width: 100% !important;
}

.newsletter_layout .casesnewsletter input[type='text']{
    width: 100% !important;
}

.newsletter_layout .deletephotonewsletter{
    position: absolute;
    left: 15px;
    border:0;
}

.newsletter_layout .case_newsletter_sample h1{
    float: left;
    width: 100%;
    text-align: center;
    padding: 15px 0px 7px 0px;
    font-size: 2.3em;
    font-weight: bold;
}

.newsletter_layout .case_newsletter_sample h3{
    float: left;
    width: 100%;
    text-align: center;
    font-size: 1.5em;
    padding: 0px 10px 20px 10px;
    margin-top: 9px;
}




/*start artpulse*/

.visitlink_det, .visitlink_det:hover, .visitlink_det:focus{
    position: static !important;
    width: 100% !important;
    float: left !important;
    padding: 0 !important;
    border: 0 !important;
    background:#fff !important;
}

.iframe3d_thumbnail_related{
    width: 100%;
    height: 100px;
    float:left;
}

.iframe3d_thumbnail{
    width: 100%;
    height: 130px;
    float:left;
    margin-bottom: -6px;
}
.iframe3d_detail{
    width: 100%;
    float:left;
    height: 450px;
}

.overim{
    width: 100% !important;
    height: 130px;
    opacity: 0;
    position: absolute;
    z-index: 98;
    top: 0;
    left: 0;
}

.sidebar .overim{
    width: 100% !important;
    height: 130px;
    opacity: 0;
    position: absolute;
    z-index: 98;
    top: 0;
    left: 0;
    height: 100% !important;
}

/*fin artpulse*/



.linksite{
    float: none !important;
    position: static !important;
    border: 0 !important;
}

.linksite:hover{
    color:#000;
    background:#fff !important;
    border:0;
}


.listAdded{
    list-style:none;  padding:0; margin:30px 0px 0px 0px;
}

.listAdded li{
    list-style: none;
    float: left;
    background: #e6e6e6;
    margin-right: 8px;
    margin-top: 8px;
    padding: 6px;
    border-radius: 3px;
}

.listAdded li label{
    padding: 0;
    float: left !important;
    width: auto !important;
    margin: 3px 0px 3px 3px !important;
    font-size: 0.9em;
}

.modal.favScreens{
    padding:25px !important;
}

.listAdded li button{
    border: 0;
    background: none;
    float: left;
    padding: 4px 4px 0px 6px;
}


header .screens{
    float: left;
    background: #fff !important;
    border: 0;
    color: #000 !important;
    position: relative;
    margin: 25px 0px 13px -1px;
    z-index: 99999;
    border-radius: 0px;
    border: solid 1px #ccc;
}

header .screens i{
    padding: 9px 11px 9px 11px;
}

.listWindows{
    float: left;
    width: 100%;
    margin: 20px 0px 0px 0px;
    padding: 0;
    list-style: none;
}

.listWindows li{
    padding:10px 0px;
    border-bottom:solid 1px #ccc;
}

.listWindows li a, .listWindows li a:hover{
    color:#000;
    text-decoration:none;
}

.listWindows li i, #tempLink i{
    color:#ccc;
    margin-right:5px;
}

.listWindows li:last-child{
    border-bottom:solid 0px #ccc;
}

.listWindows li .closert{
    float:right !important; 
    color: #ccc; 
    margin: 4px 0px 4px 5px;
}


.refere.regular{
    width:auto; padding:5px 9px; background: #EAEAEA; color:#000; border-radius:2px; float:left; font-size:10px !important; margin-right:5px; margin-bottom: 5px;
}

.breadcrumbs{
    margin:-13px -7px 7px -9px;
    background: transparent;   /* no box behind the filters chosen, only their chips (his "quita esta caja", 2026-10-07); was #f7f7f7 */
    padding:0px 0px;
    border-radius: 0;
    position:relative;
    display: inline-block;
    width: calc(100% + 15px);
}

.boxCont{
    float:left;
}

.boxCont .boxInn{
    float: left;
    padding: 11px 18px 7px 18px;
    border-radius: 0px;
    margin-right: 1px;
    font-size: 0.8em;
    margin-bottom: 1px;
}

.boxCont .boxInn .cloe{
    margin-left:5px;
}

.boxCont .boxInn.subcat{
    background: none;
    color: #989898;
    padding-right: 10px;
    padding-left: 10px;
    margin-right: 0px;
}

.boxCont .boxInn.cat{
    background: #dddddd;
    border-radius: 5px;
    margin: 5px 0px 5px 5px;
    padding: 6px 15px;
}

.boxCont a{color:inherit !important;}

.bodySpecial .breadcrumbs{
    margin-top: -8px;
    padding-left: 6px;
}


.fitPhotoDetail{
    text-align:center;
}

.fitPhotoDetail img{
    float:none !important;
    width:auto !important;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.30);
    margin-top:30px;
}

.fitPhotoDetail.desktopsD img{
    margin: 0 auto !important;
}

.fitPhotoDetail .floatedAbs{
    position:absolute !important;
    top:0;
}

.fitPhotoDetail .inf{
    margin-bottom: 1px;
}

.turnView{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 999;
    background: #000;
    color: #fff;
    padding: 10px 20px;
    border-radius: 3px;
    margin: 7px 10px;
    opacity: 0.5;
    cursor:pointer;
}

.desktopsD .turnView{
    right: -3px;
    padding: 10px 13px;
    margin: 3px 3px;
    border-radius: 0px;
}

.turnViewplus{
    opacity: 1;
}


.buttondtdwn.buttonscategory{
    position: static !important;
    float: right !important;
    border: 0;
    background: #d6d6d6;
    padding: 13px;
    text-align: center;
    margin:0 !important;
    border-top: solid 0px #f7f7f7 !important;
    border-left: solid 0px #fff !important;
    width:auto;
}

.buttondtdwn.buttonscategory span{
    background:none;
    padding:0;
    border-bottom: solid 0px #ececec;
    border-left: solid 0px #f7f7f7;
    border-top: solid 0px #f7f7f7;
}

.buttondtdwn.buttonscategory span i{
    color:#fff !important;
}

.select2-dropdown{
    z-index: 9999 !important;
    width:260px !important;
}

.select2-container--default .select2-selection--single {
    border-radius: 2px 4px 4px 2px;
    border-left: 0px !important;
    height: 34px;
    margin-left: -1px;
}

.detcatdow{
    position: relative !important;
    bottom: 0 !important;
    margin: 0 !important;
    padding: 5px 7px 10px 7px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered{
    padding: 3px 16px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 32px;
}

.select2-container{
    max-width: 160px;
}

.modal .select2-container{
    max-width: 100%;
    width: 100% !important;
}


.modal .select2-container--default .select2-selection--single {
    border-radius: 0px;
    border-left: solid 1px #ccc !important;
    height:auto;
    margin-left:0px;
}

.dragHoverX, .dragHoverX_cat{
    position:relative;
}

.refere.draggeritem{
    font-size: 1.6em !important;
    cursor: grab;
    background: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) scale(1.5);
    padding: 19px;
    margin-top: 0;
    margin-left: 0;
    width: 66px;
    height: 66px;
    text-align: center;
    z-index: 999;
    opacity: 0;
    border-radius: 999px;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.6);
}

.refere.draggeritem:hover{
    opacity:1;
    transform: translate(-50%,-50%) scale(1);
}

.refere.draggeritem i{
    color:#000;
}

.addHightlight{
    transform: scale(1.20);
    margin-left: 10%;
    opacity:1;
    position: relative;
    z-index: 9999999;
}

.addHightlight .linelabel{
    color:#000;
    height:60px;
}

.dragHoverX_folder.addHightlight{
    background: #e6e6e6;
    padding: 8px;
    margin-top: 0px;
    padding-top: 0px;
}

.dragHoverX_folder.addHightlight .rel_proj{
    background: none !important;
    color: #000 !important;
    border:solid 0px #ccc !important;
}
    

.mespetitet{
    transform:translate(0%, 0%) scale(0.4);
}

.grupet{
    float:left;
    width:100%;
    margin-bottom:10px;
    margin-top: 10px;
}

.grupet input{
    float: left;
    width: 150px !important;
    border: solid 1px #ccc;
    border-right: 0;
    border-radius: 3px 0px 0px 3px !important;
    height: 39px !important;
    padding: 10px !important;
}

.grupet button{
    float: left;
    width: auto;
    border: solid 1px #a5a5a5;
    border-radius: 0px 3px 3px 0px;
    border-left: 0;
    height: 39px;
    text-align: center;
    padding: 10px 15px 10px 15px;
    background: #ccc;
}


.modalApproach .modal-content{
    float: left;
    border-radius: 3px;
    width: calc(100% - 25px) !important;
    margin-bottom: 15px;
    padding: 25px;
    margin: 20px;
}

.capsaitem .iconCatitem{
    width: 45px;
    float: left;
    margin-top: -20px;
    height: auto;
    position: relative;
    border-radius: 999px !important;
    border: 0 !important;
    box-shadow: 0px -16px 7px rgba(0,0,0,0.3);
}

.showOnlyinDesktop{ display:block !important; } 
.showOnlyinModile{ display:none !important; }

.searchInLI{
    margin-top: -8px;
    margin-bottom: 9px;
    padding-bottom: 0;
}

.searchInLI input{
    width: 100%;
    height: 35px;
    padding: 4px 36px;
    border: 0px;
}

.searchInLI input:focus{
    border:0;
}

@media(max-width: 1125px){

    .sidebarblock {
        width: 72%;
        position: fixed;
        top: 0 !important;
        top: 90px;
        left: 0;
        display: flex;
        height: auto;
        z-index: 1002;
        background: #0065b3;
        border-radius: 0;
    }

    .crossClose {
        position: absolute;
        top: 17px;
        right: 151px !important;
        left: initial;
        opacity: 0.6;
        z-index: 99999;
    }

    
    .showOnlyinDesktop{ display:none !important; }
    .showOnlyinModile{ 
        display:block !important; 
        height: 0px;
        padding: 0;
        z-index: 0;
    }
    .showOnlyinModile.show{
        height: auto;
        padding: 10px;
        z-index: 99999;
    }

    .showOnlyinModile.show.otherOne{
        display:none !important; 
    }

    .modal-open .modal{
        background:rgba(0,0,0,0.7) !important;
        z-index: 99999999 !important;
    }
    
    .box_dasboard.filelist {
        height: initial !important;
    }
    
    .box_dasboard:last-child {
        margin-bottom:65px;
    }
    
    .contpujador{
        margin-top: 5px !important;
    }
    
    .droppers{
        padding: 9px 15px 9px 8px;
        float: right;
        font-size:1.5em;
    }
    
    .droppers_hide{
        padding: 9px 15px 9px 8px;
        float: right;
    }
    
    ul.menucatstop li ul li label {
        padding-left: 23px;
    }
    
    .refere.draggeritem {
        cursor: grab;
        position: absolute;
        right: 5px;
        bottom: 43px;
        margin-left: 0;
        font-size: 1.3em !important;
        transform: scale(1) !important;
        width: 45px !important;
        height: 45px !important;
        margin: 0 !important;
        text-align: center;
        z-index: 99;
        border-radius: 999px !important;
        opacity: 1;
        left: initial;
        top: initial;
        box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
    }
    
    .select2-dropdown{
        width: auto !important;
    }
    
    
    .turnView{
        display:none;
    }
    .breadcrumbs{
        margin: -5px 0px 0px 0px;
        background: #f7f7f7;
        padding: 0px 0px;
        border-radius: 0;
        display: inline-block;
        width: calc(100% + 4px);
        display:none !important;
    }
    .boxCont .boxInn{
        padding: 17px 22px 14px 22px;
    }
    .containernews{
        margin-left: 3px;
        margin-top: 50px;
    }
    .boxCont, .boxCont .boxInn.cat{
        width:100%;
    }
    .boxCont .boxInn.subcat {
        padding-right: 20px;
        padding-left: 22px;
        margin-right: 0px;
        border-right: solid 1px #e0e0e0;
        border-bottom: solid 1px #e0e0e0;
        margin-bottom: 0px;
    }
    .charts{width: calc(30% - 16px);}
    .desk{width: calc(70% - 33px);}
    .bodySpecial .average_panel {
        width: calc(30% - 45px);
        margin: 0px 0px 40px -15px;
    }
    .bodySpecial .desk {
        margin-left:-15px;
    }
    .itemslazy .detailphoto{
        padding-top: 0px !important;
        padding-left: 0px;
        padding-right: 70px;
    }
    .itemslazy .detailphoto .containernews {
        margin-left: 6px;
        margin-right: 6px;
    }

    .selectalldesktop:after {
        left: -14px !important;
        top: -7px !important;
    }
    .selectalldesktop{
        margin-left: 38px !important;
        margin-bottom: 32px !important;
    }
    
    .box_dasboard {
        width: calc(50% - 50px) !important;
    }
    .hiddeChar{
        background:none !important;
        display:none;
    }
    #disco {
        padding: 16px 26px !important;
        font-size: 15px;
        height: auto;
        width: auto;
        right: -10px;
        background: #fff !important;
        z-index: 9;
        color: #000 !important;
        border-radius: 6px !important;
        border: 0;
        top: 4px !important;
        position: absolute;
    }
    #trigg_disco:hover, #trigg_disco {
        border-radius: 0px 0px 0px 0px;
    }
}


@media(max-width: 768px){

    .box_dasboard {
        width: calc(100% - 20px) !important;
        margin: 0px 10px 10px 10px;
    }

    .videostart {
        background-size: 140px;
        margin-top: 53px !important;
        height: 60vh !important;
    }

    .allStayed {
        box-shadow: none;
        background-color: #fff;
        height: 87vh !important;
        background-image: url(../custom/img/uplo.png);
    }
    
    .charts {
        float: left;
        width: calc(100% - 86px);
        margin-right: 0px;
        background: #fff;
        margin: 5px 10px 18px 10px;
        border-radius: 2px;
        box-shadow: 0px 0px 10px #ccc;
        padding: 20px;
    }
    .desk{width: calc(100% - 66px) !important;}
    .bodySpecial .average_panel{width: calc(100% - 52px) !important;}
    .bodySpecial .desk{width: calc(100% - 52px) !important;}
    .itemslazy .detailphoto{
        padding-right: 74px;
    }

    .capsaitem {
        margin-bottom: 0px;
        margin-left: 3px;
        margin-right: 3px;
        overflow: hidden;
        background: #FFF;
        border-radius: 3px;
        width:calc(100% - 6px) !important;
    }
    .refere.regular {
        width: auto;
        padding: 10px 13px;
        background: #EAEAEA;
        color: #000;
        border-radius: 2px;
        float: left;
        font-size: 12px;
        margin-right: 5px;
        margin-bottom: 0px;
        margin-top: 5px;
    }
    
    ul.menucatstop input[type=checkbox]:after {
        left: -19.6px;
        margin-left: -8px;
    }
    .subulcat input[type=checkbox]:after {
        left: -8.6px !important;
        top: -3px !important;
        margin-left: 0px !important;
    }
}


.buttonct, .buttonct:hover{
    padding: 5px 8px !important;
    background: none !important;
    color: #000 !important;
    width:20% !important;
}

.buttonct i, .buttonct:hover i{
    color: #000 !important;
}

.buttondtdwn.buttonscategory.deti {
    width:50px !important;
}


.specialFolder{
    background:none;
}

.specialFolder img{
    border: solid 0px #e2e2e2;
}

.specialFolder .checkedcheck[type='checkbox']:after {
    left: -3px;
    top: 6px;
    width: 12px;
    height: 12px;
}

.specialFolder .contcatoptions{
    background:orange;
}

.specialFolder .contcatoptions i{
    color:#fff !important;
}

.specialFolder .detop , .specialFolder .modal_job_versions{
    background:orange !important;
}

.specialFolder .backsavescroll{
    clear:both;
}

.viewermode, .editormode{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background: #fff;
    padding: 40px;
    text-align: center;
    font-size: 2em;
    box-shadow: 0px 0px 33px rgba(0,0,0,0.5);
    font-weight: bold;
    font-style: italic;
    border-radius: 5px;
    z-index: 99999;
}

.specialFolder .topfolder{
    margin-bottom: 0px;
    margin-top: 0px;
    z-index: 998;
    position: relative;
    background-position: bottom;
    height: 43px;
    display:block !important;
}

.specialFolder input[type=checkbox] {
    z-index: 998 !important;
}

.selected_checkbox{
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.30);
    border: solid 0px #1767d4;
    opacity:0.5;
}

.menucatstop input[type=checkbox], .menucatstop input[type=radio] {
    margin: 0px 0 0;
}

.subulcat .linelabel {
    margin-left: 28px;
    margin-top: 0px;
}

.seeattachments{
    display:none;
}

ul.menucatstop input[type=checkbox]:after{
    left: -12.6px;
    top: 0px;
}


ul.menucatstop .subulcat input[type=checkbox]:after {
    left: -2.6px;
    top: -1px;
}


.capsausers input[type=checkbox]{
    width:14px !important;
    height:14px !important;
}



@media(max-width: 768px){
    .containernews.is-visible-items .capsaitem{
        width: calc(50% - 10px) !important;
        margin-top: 8px !important; 
    }
    
    .containernews.is-visible-items .capsaitem.WiDerItem{
        width: calc(100% - 10px) !important;
    }

    .backUper {
        background: none;
        float: left;
        position: fixed !important;
        bottom: 57px !important;
        padding: 8px !important;
        right: 0px !important;
        z-index: 99999 !important;
    }

    header .screens{
        border: 0;
        height: 50px;
        width: 50px;
        padding: 0;
        background: #fff !important;
        border-radius: 999px;
        box-shadow: 3px 2px 10px rgba(0,0,0,0.3);
        display: flex;
        align-items: center;
        justify-content: center;
        right: 12px;
        position: fixed;
        top: 33px;
    }
    .containernews div.conty {
        margin-bottom: 90px;
    }

}



@media(max-width: 500px){
    .capsaitem{
        width: calc(100% - 6px) !important; 
    }
    .refere.draggeritem{
        display:none;
    }
    .checkedOK, .ui-selecting {
        opacity: 0.25 !important;
    }
}



.modal input[type=checkbox]{
    height: 13px;
    width: 13px;
    margin-left: 5px;
    margin-right: 12px;
    display: block;
    color: #FFF;
    float: left;
}

/*
.modal input[type=checkbox]::after{
    height: 13px;
    width: 13px;
    margin-left: 5px;
    margin-right: 12px;
    display: block;
    color: #FFF;
    float: left;
}
*/


.modal input[type="checkbox"]{
    -moz-appearance: auto !important;
}



.starting.box_dasboard{
    background:none;
    box-shadow:0px 0px 0px;
}

.starting.box_dasboard .sharinglist {
    padding-right: 15px !important;
    margin-top: 55px;
    padding-left: 15px !important;
}

.starting.box_dasboard .imgset.sharinglist .sharinglistitem {
    width: calc(33.33333% - 40px) !important;
    margin-right: 15px;
    margin-left: 15px;
    margin-bottom: 55px;
    background:#fff !important;
    max-width: initial;
}

.starting.box_dasboard .sharinglist .boxButtonsVersion{
    background:#fff !important;
    float:left;
    width:100%;
}

.starting.box_dasboard .sharinglist .boxButtonsVersion .versionscontrol{
    padding: 5px 8px 5px 7px !important;
    margin-left: 2px;
    margin-bottom: 2px;
    background: orange;
    font-size: 11px !important;
    width: calc(50% - 3px) !important;
}

.starting.box_dasboard .sharinglist .boxButtonsVersion .choosenVersion{
    margin: 0px 0px 2px 2px !important;
    border-radius: 0px !important;
}

.starting.box_dasboard .sharinglist .seen {
    opacity: 1;
    border-left: solid 0px orange !important;
}

.starting.box_dasboard .sharinglist .inf ul li:last-child {
    margin-bottom: 0px !important;
    background:none;
}

.starting.box_dasboard .sharinglist .shareduseralt {
    display: none;
}

.starting.box_dasboard .sharinglist .del{
    display: none;
}

.starting.box_dasboard .imgset.sharinglist .sharinglistitem {
    border-radius: 7px;
}

.starting.box_dasboard .sharinglist .inf .who {
    background: none !important;
}

@media(max-width: 1600px){
    .starting.box_dasboard .imgset.sharinglist .sharinglistitem {
        width: calc(50% - 50px) !important;
        margin-left:20px;
    }
}

@media(max-width: 1125px){
    .starting.box_dasboard .imgset.sharinglist .sharinglistitem {
        width: calc(100% - 40px) !important;
        margin-left: 0px;
    }
    .logoHeader{
        display:none;
    }
}

@media(max-width: 600px){
    .starting.box_dasboard .imgset.sharinglist .sharinglistitem {
        margin-left: 20px;
    }
}


.backUper{
    background: none;
    float: left;
    position: absolute;
    bottom: -88px;
    padding: 8px;
}

.backUper button, .backUper button:focus{
    color: #888;
    border: 0;
    outline: 0;
    height: 50px;
    width: 50px;
    padding: 0;
    background: #fff !important;
    border-radius: 999px;
    box-shadow: 3px 2px 10px rgba(0,0,0,0.3);
}

.backUper button i{
    color:#888 !important;
}

.backUper_modal{
    float: left;
    position: static;
    background: none !important;
    border-radius: 4px;
    width: 100%;
}

.backUper_modal button{
    float:left;
    background:#000;
    padding:10px 30px;
    color:#fff;
    border:0;
    border-radius:3px;
    margin-top:25px;
}

.backUper_modal .boxBackup{
    float:left;
    width:100%;
}

.backUper_modal .boxBackup h1{
    float:left;
    width:100%;
    margin: 5px 0px 20px 0px;
}

.backUper_modal .boxBackup p{
    float:left;
    width:100%;
}

.backUper_modal .contBCK{
    width:100%;
    float:left;
}

.backUper_modal .catselecB{
    float: left;
    border: solid 1px #000;
    padding: 9px 20px 9px 16px;
    margin-top: 10px;
    margin-right: 10px;
    opacity: 0.5;
    border-radius: 3px;
}

.backUper_modal .catselecB i{
    font-size: 0.8em;
    margin-right: 3px;
    opacity: 0.7;
}

.chatStyle{
    width: 323px;
    right: 81px;
    position: fixed;
    bottom: 0;
    box-shadow: 0px -5px 24px rgba(0,0,0,0.2);
    border-radius: 7px 7px 0px 0px;
    overflow: hidden;
    z-index: 99999;
}

.usersList .progress{
    height: 2px;
    margin-bottom: 0px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 0;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #b9deff;
}

.usersList .subulcat li{
    padding:10px 30px;
    float: left;
    width:100%;
}

.sentJobStandOut{
    opacity:0.25 !important;
}

.userListBoxController{
    position: fixed;
    top: 90px;
    z-index: 9999;
    margin: 0;
    padding: 0;
    left: 0;
    list-style: none;
}

.userListBox .createuserplus,
.userListBox .createuserplus_detail{
    background: #e6e6e6;
    margin: 0;
    width: 37px;
    font-size: 1em;
    padding: 0 !important;
    right: 0;
    float: right;
}

.showCatsSidebar{
    cursor:pointer;
    border-radius: 5px !important;
}

.userListBox .createuserplus i,
.userListBox .createuserplus_detail i{
    padding: 10px 13px;
    float: right;
}

.userListBox .operators a{
    height: 33px;
}

.userListBox .operators{
    margin-bottom:15px;
}

.switcherSidebar{
    position:fixed;
    top:90px;
    left:0;
    z-index:9999;
}

.switcherSidebar .turnCats{
    padding: 3px 9px;
    color: #fff;
    margin: 0;
    border-radius: 0;
    cursor: pointer;
    border-radius: 0px 6px 6px 0px;
}

.switcherSidebar .turnCats i{ 
    font-size: 2em;
}

.switcherSidebar .turnCats i.fa-sitemap{
    font-size: 14px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.switcherSidebar .turnCats i.fa-angle-left{
    padding-left: 2px;
    padding-right: 3px;
}

.labelUsersList a{
    float: left;
    width: 18px;
    margin-right: 4px;
}

.labelUsersList a img{
    float:left;
    border-radius: 99px;
    width:100%;
}

.labelUsersList .desplegar_s{
    margin-right: 6px !important;
}

.labelUsersList{
    background-image: linear-gradient(to top, #e0e0e0, #fff) !important;
    width:100%;
}

.formLayoutInputs{
    padding: 10px;
    width: 50%;
    float: left;
    margin-bottom: 0;
}

.manageUserBt{
    margin-top: 25px !important;
}

.usersList .subulcat{
    background-image: linear-gradient(to top, #ececec, #fff) !important;
    border-bottom: solid 1px #d0d0d0;
    padding-bottom: 20px;
}

.desplegar_s_user{
    float: left;
    right: 0;
    margin-top: 0px;
    margin-right: 6px;
    font-size: 20px;
    z-index: 1;
    cursor: pointer;
}

.desplegar_s_comp{
    float: left;
    right: 0;
    margin-top: 0px;
    margin-right: 6px;
    font-size: 20px;
    z-index: 1;
    cursor: pointer;
}

.crossClose{
    position: absolute;
    top: 107px;
    right: 80px;
    opacity: 0.6;
    z-index: 99999;
}

.inputUser.hide + .crossClose{
    display:none !important;
}

@media(max-width: 1125px){
    .switcherSidebar, .inputUser{
        left: -110% !important;
        top:85px !important;
        z-index:999999;
    }
    .switcherSidebar, .inputCat{
        left: -110%;
        top: 0px !important;
        z-index: 99999;
    }
    .switcherSidebar.minusleftUser{
        left: 0% !important;
        z-index: 999999;
        width: auto !important;
    } 
    .inputUser.minusleftUser{
        left: 10px !important;
        top: 0 !important;
        width: auto !important;
        background: none;
        padding: 11px 0px 11px 25px !important;
    }
    ul.menucatstop.moreleftsidebar{
        left:0 !important;
        width: calc(100% - 66px) !important;
    }
    .hideYU{
        display:none !important;
    }

    body ul.menucatstop.hoverManager {
        width: calc(100% - 60px) !important;
    }

    #userUserMenu::before {
        content: "";
        position: fixed;
        top: 0;
        right: 0;
        height: calc(100% - 55px);
        width: 15%;
        background: #000000ad;
        z-index: 9999;
    }

    .menucatstop::before {
        content: "";
        position: fixed;
        top: 0;
        right: 0;
        height: calc(100% - 55px);
        width: 15%;
        background: #000000ad;
        z-index: 9999;
    }

}




.exportUsers{
    float: left !important;
}

.exportUsers button{
    border: solid 1px #bfbfbf !important;
    background: none !important;
    color: #6d6d6d !important;
    font-size: 1em !important;
    padding: 6px 12px !important;
    height: 33px !important;
    margin-top: 25px;
    width: auto !important;
    border-radius: 3px !important;
    margin-left: 11px;
}


@media(max-width: 1125px){
    .exportUsers{
        width:auto !important;
    }
    .choose_v{
        display:none;
    }
    .formLayoutInputs{
        width:100%;
    }
}



.row3{
    float:left; 
    width:100%; 
    margin:15px 0px 15px 0px;
}
.caja1{
    float: left;
    width: 33%;
    background: #e6e6e6;
    margin-right: 1px;
    height: 70px;
    margin-top: 1px;
}
.caja2{
    float: left;
    width: 33%;
    background: #e6e6e6;
    margin-right: 1px;
    height: 70px;
    margin-top: 1px;
}
.caja3{
    float: left;
    width: 33%;
    background: #e6e6e6;
    height: 70px;
    margin-top: 1px;
}
.caja4{
    float: left;
    width: 49.2%;
    background: #e6e6e6;
    margin-right: 1px;
    height: 70px;
    margin-top: 1px;
}
.caja5{
    float: left;
    width: 50%;
    background: #e6e6e6;
    height: 70px;
    margin-top: 1px;
}


.social_networks .half input{
    width:50%;
    float:left;
}


@media (min-width: 768px){
    #modify_company_modal .modal-dialog{
        width: 1000px;
    }
}


.caseprevierw{
    float: left;
    width: 100%;
}

.choosePlace{
    float: left !important;
    padding: 23px;
}

.regular.spcial{
    background:#ccc !important;
    color:#000 !important;
    font-weight:bold;
    border-radius:4px;
}

.regular.spcial:hover{
    text-decoration:none;
    opacity:0.7;
}


ul.menucatstop .linelabelNotC{
    color: #a6a6a6 !important;
}

ul.menucatstop .editcat.linelabelNotC{
    color: #a6a6a6 !important;
}


.clickComp{
    border: solid 1px #ccc;
    padding: 10px 20px;
    display: table-cell;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
    position: relative;
    top: -15px;
}


@keyframes littleAnim222 {
  0%   { color:#CCC; transform:scale(1); }
  50%  { color:#F00; transform:scale(1.33); }
  100% { color:#CCC; transform:scale(1); }
}

.colorRed{
    position:relative;
    transform:scale(1);
    animation-name: littleAnim222;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    color:#CCC;
}


.checkedcheck[type="checkbox"]:checked::after, 
ul.menucatstop input[type="checkbox"]:checked::after, 
input[type="checkbox"]:checked::after, 
#selectall[type="checkbox"]:checked::after,
#selectall2[type="checkbox"]:checked::after, 
.checkbox-control[type="checkbox"]:checked::after, 
.assignc input[type="checkbox"]:checked::after {
  background-color: #258eea !important;
  background-image: url(../../view/custom/img/check.png) !important;
  background-size: 11px;
}

.notifmessag{
    margin-top: 20px;
    margin-bottom: 35px;
    background: #ebebeb;
    padding: 10px 20px;
    border-radius: 3px;
    font-style: italic;
    color: #7a7a7a;
    font-weight: bold;
}


.userListBox .createuserplus{
    border-radius: 7px 0px 0px 7px;
    width: 36px;
}


.logoMDL{
    width: 160px;
    margin-bottom: 34px;
}


/* searches cats adding */

.inputCat{
    width: 0px !important;
    margin: 0;
    padding: 0;
}

.logoColComp {
    float: left;
    height: 28px;
    width: auto;
    margin-top: 16px;
    margin-left: 49px;
    margin-bottom: 8px;
    max-width: 150px !important;
    object-fit: contain;
}

.switcherVisibles {
    top: 21px;
    right: 14px;
}

.switcherSidebar .turnCats {
    padding: 12px 14px;
}

ul.menucatstop .addcat_button,
.userListBox .createuserplus{
    width: 50px !important;
}

.addcat_button i,
.userListBox .createuserplus i,  
.userListBox .createuserplus_detail i{
    padding: 19px 20px !important;
}

.inputUser{
    width: calc(17% - 47px) !important;
    margin-left: 33px;
    padding: 11px 25px;
    height: 43px;
    margin: 6px !important;
    left: 16px;
    border-radius: 9px;
}


.modal-content {
    -webkit-box-shadow: 0 5px 15px rgb(0 0 0 / 50%);
    box-shadow: 0 5px 45px rgb(0 0 0 / 20%) !important;
}



.containernews.is-visible-items .capsaitem .legend{
    padding:0 !important;
    height:0 !important;
    overflow:hidden !important;
    width:0 !important;
    opacity:0 !important;
}





.caseBelong{
    display: block;
    float: left;
    background: #fff7c9;
    width: 100%;
    padding: 15px;
    border-radius: 5px;
    margin-top: 9px;
}

.caseBelong i{
    font-size: 1.5em;
    margin-top: 8px;
    cursor: pointer;
}



/* ITEM MODAL WATCH */

.watch_item_modal{
    position: fixed;
    max-width: 1000px;
    background: #fff;
    z-index: 9999999;
    border-radius: 0;
    width: 100%;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.5);
    transform: initial;
    padding: 0px;
    right: -1100px;
    top: 0;
    height: 100%;
    overflow-y: scroll;
    outline:0;
}

.watch_item_modal > div{
    padding:0px;
    min-height: 100vh;
    position:relative;
    outline:0;
}

/* A MAGNIFIED PDF TAKES THE WHOLE WIDTH OF THE PAGE (2026-09-28, his words: "en el pdf haz que al apretar
   la lupa se extienda el modal al 100 del ancho de la pagina, como en los demas elementos").
   The panel's own cap goes, for the layouts where it applies; in the side layout a PDF already had the
   window's width, and what actually held the pages back was the versions panel - view/js/vk_pdf.js folds
   it while the size bar is up, and the pages are drawn again for the width that frees. */
.watch_item_modal.is-vkPdfWide{ max-width: none; }

.watch_item_modal > div .mainImg{
    border-radius:0px;
    width:100%;
    border: 0;
    max-height: 534px;
    width: auto;
    margin: 0 auto;
    display: block;
    max-width: 750px;
}

.watch_item_modal .infoItem{
    width:100%;
    margin:0 auto;
    position:relative;
    max-width: 750px;
    display: flex;
    align-items: baseline;
    position: relative;
    flex-direction: column;
    min-width: 580px !important;
    margin-bottom: 90px;
}

.watch_item_modal .infoItem .button_actions{
    margin-top:20px;
    width: 100%;
    min-width: 580px !important;
}

.watch_item_modal .infoItem ul{
    padding: 13px 20px;
    margin-bottom: 20px !important;
    margin: 0;
    list-style: none;
    width: 100%;
    background: #f5f5f5;
    border-radius: 7px;
    margin-top: 17px;
}

.watch_item_modal .infoItem ul li{
    padding-bottom: 11px;
    padding-top: 11px;
    border-bottom: dotted 0px #999;
    font-size: 12px;
}

.watch_item_modal .infoItem ul li:last-child{
    border-bottom: dotted 0px #999;
}

.appearItem{
    right: 0px !important;
}

.watch_item_modal p{
    width: 100%;
    display: block;
    text-align: center;
    font-size: 1.15em;
    padding: 14px 10px 20px 10px;
}

.watch_item_modal p .blue{
    color:blue;
}

.watch_item_modal .modal_accept {
    right: 16px;
    top: 15px;
    left: initial;
    border-radius: 99px;
    display: flex;
    padding: 0px;
    height: 40px;
    width: 40px;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: #000;
    background: #fff;
    position: absolute;
    z-index: 2;
    cursor:pointer;
}

.modal_accept:hover{
    text-decoration:none;
}

.invisible{
    opacity:0;
}

.watch_item_modal .casing{
    background:#eaeaea;
    width: 100%;
    min-height: 535px;
    display: flex;
    align-items: center;
    position:relative;
}

.watch_item_modal .casing .overlayerPic{
    background: linear-gradient(0deg, rgb(0 0 0 / 56%), rgba(0,0,0,0));
    position: absolute;
    width: 100%;
    height: 70%;
    bottom: 0;
    left: 0;
    display:none;
}

.watch_item_modal .casing .overlayerPic:hover{
    opacity:0.1;
}



.button_actions{
    position: absolute;
    z-index: 999;
    right: 16px;
    top: 80px;
}

.button_actions > div{
    display: flex;
    flex-direction: column;
}

.tagify{
    padding:5px !important;
    height:auto !important;
}

.watch_item_modal .downloadbnts, 
.watch_item_modal .downloadbnts:hover, 
.watch_item_modal .downloadbnts:focus { 
    border: solid 0px #fff;
    float: right;
    padding: 6px 19px;
    color: #fff;
    font-size: 1.2em;
    color: #fff;
    background: rgba(0,0,0,0.6);
    display: flex;
    height: 38px;
    align-items: center;
    border-radius: 10px;
    margin-left: 2px;
    margin-right: 5px;
    text-decoration: none;

    margin-bottom: 7px;
    height: 40px;
    width: 40px;
    display: flex;
    align-items: center;
    margin-right: 0;
    justify-content: center;
    border-radius: 99px;
    font-size: 13px;
}

.changeIMG{
    margin-bottom: 7px;
    height: 40px;
    width: 40px;
    display: flex;
    align-items: center;
    margin-right: 0;
    justify-content: center;
    border-radius: 99px;
    font-size: 13px;
}


.watch_item_modal .loadingItem{
    position: absolute;
    width: 100%;
    height: 100vh;
    background: #fff;
    z-index: 999;
}

.watch_item_modal .loadingItem img{
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    width:150px;
    height:150px;
}

.OvYH{
    overflow-y:hidden !important;
}

.watch_item_modal p img{
    display: block;
    margin: -3px auto 27px auto;
    width: 90px;
}

.background_modal_em{
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    z-index:999998;
    top:0px;
    left:0px;
}


.watch_item_modal .relatedTitle{
    margin:20px auto 35px auto;
}

.watch_item_modal .relateds{
    margin: 0 auto;
    padding-bottom:50px;
    float:none;
}

.watch_item_modal .relateds a{
    padding:3px;
    width:33.333%;
    opacity: 0;
    transform: translateY(-50px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}


.watch_item_modal .relateds a img{
    width:100%;
    height:auto;
    display:block;
    border-radius:3px;
}

.watch_item_modal .button_actions .hookCompany{
    padding: 9px 20px;
    border-radius: 99px;
    color: #fff;
    margin-top: 0px;
    float: left;
}

.watch_item_modal > div object.mainImg {
    border-radius: 0px;
    width: 100%;
    border: 0;
    max-height: 534px;
    width: 100%;
    margin: 0 auto;
    display: block;
    max-width: 600px;
}

.CalCulation{
    margin: 0;
    list-style: none;
    margin-top: 23px;
    margin-bottom: -10px;
    background: #f1f1f1;
    padding: 16px 18px;
    border-radius: 8px;
}

.CalCulation li{
    margin-bottom:7px;
}

.CalCulation li:last-child{
    margin-bottom:0px;
}

.blued{
    color:blue;
}

.dobleFolder:after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    height:100%;
    width:100%;
}

.dobleFolder:before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    height:100%;
    width:100%;
}

.onToppe{
    position: relative;
    z-index: 99;
    height: 100%;
    overflow: hidden;
    border-radius: 7px;
}

.capsaitem {
    overflow: visible !important;
}


.listBackups{
    list-style: none;
    margin: 0;
    padding: 0;
    display: inline-block;
    width: 100%;
    margin-top: 25px;
    padding-top: 0px;
}

.listBackups li{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #000;
    padding: 9px 7px;
    border-bottom: solid 1px #ccc;
}

.listBackups li:last-child{
    border-bottom: solid 0px #ccc;
}

.listBackups li a,
.listBackups li i{
    cursor:pointer;
}

.listBackups li a:hover{
    text-decoration:none;
    opacity:0.7;
}

.listBackups li i:hover{
    text-decoration:none;
    opacity:0.7;
}

.downloadBackup_zip{
    display: flex;
    align-items: center;
    color: #000;
}

.downloadBackup_zip i{
    margin-right:7px;
}


@media (max-width:800px){

    .watch_item_modal > div object.mainImg {
        max-height: 75vh !important;
    }

    .watch_item_modal .caseCopy button{
        border-radius: 10px 0px 0px 10px;
    }

    .watch_item_modal .infoItem .button_actions {
        margin-top: 20px;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: self-start;
    }

    .watch_item_modal .infoItem .button_actions > div{
        width: 100%;
        display: flex;
        margin-top: 16px;
    }

    .watch_item_modal .relateds{
        padding: 4px 4px 50px 4px;
    }

    .watch_item_modal .loadingItem{
        position: fixed;
    }

    .watch_item_modal .infoItem{
        padding: 0px 15px;
        width: 100% !important;
        max-width: initial !important;
        min-width: initial !important;
    }

    .watch_item_modal .infoItem .button_actions {
        padding: 0px 0px;
    }

    .watch_item_modal .relatedTitle {
        padding: 0px 15px;
    }

    .watch_item_modal .overlayerPic{
        opacity: 0.4;
    }

    .watch_item_modal .relateds a{
        padding:0px;
        width:calc(50% - 10px);
        margin:3px;
    }

    .watch_item_modal .ComeHome:hover{
        text-decoration: none;
    }

    .watch_item_modal .ComeHome img{
        padding:12px;
    }

    .watch_item_modal {
        right: -100%;
    }

    .watch_item_modal .infoItem ul {
        padding: 30px 0px;
        width: 100%;
    }

    .watch_item_modal .infoItem ul li{
        padding: 11px 11px 11px 11px;
        border-bottom: dotted 1px #999;
        font-size: 12px;
    }

    .watch_item_modal > div video.mainImg {
        width: 100% !important;
    }

    .watch_item_modal .modal_accept {
        right: 12px;
        top: -52px;
    }

    .watch_item_modal .casing {
        margin-top: 65px;
        min-height: 150px;
    }

    .watch_item_modal > div img.mainImg {
        border-radius: 0;
        width: 100%;
        border: 0;
        width: 100%;
        margin: 0 auto;
        max-height: initial;
    }

    .watch_item_modal > div{
        padding:0px;
    }

    .capsaitem a:hover img {
        transform: scale(1) !important;
    }

}


@media (max-width: 1450px){ 

    .capsaitem {
        width: calc(25% - 10px) !important;
    }
    .capsaitem.WiDerItem {
        width: calc(50% - 10px) !important;
    } 
      
} 


.usersList .subulcat {
    padding-left: 0px !important;
}

.imagesample_f{
    width: 120px;
}

.contSampo{
    width:100%;
    display:block;
}

.contSampo .ImageCapsa{
    display: inline-flex;
    flex-direction: column;
    align-content: center;
    justify-items: center;
    text-align: center;
    padding: 10px;
    background: #eee;
    margin: 7px;
    border-radius: 7px;
}

.Labelita{
    background: #d7d7d7;
    padding: 7px 12px;
    border-radius: 6px;
    display: flex;
    align-content: center;
    align-items: center;
    margin-top: 8px;
    justify-content: space-between;
}

.Labelita:hover{
    background: #CCC;
    color:#fff;
}

.Labelita i{
    cursor:pointer;
}

.Labelita span i{
    font-size: 10px;
    margin-right: 3px;
    color: #999;
}

.keywordForm{
    display: flex;
    width: 100%;
    padding: 12px 24px 0px 24px;
    margin-bottom: 0px;
}

.keywordForm input[type=text]{
    width: 85%;
    border: solid 1px #666;
    border-radius: 9px 0px 0px 9px;
    border-right: 0px;
}

.keywordForm button{
    width: 15%;
    border-radius: 0px 10px 10px 0px;
    border: solid 0px;
    background: blue;
    color: #fff;
    height: 55px;
}

.megaBoxedH{
    padding:0px 17px 22px 17px;
}

.appluyal{
    padding: 0px 26px 26px 26px;
}

.LlistaLabelsgeneral{
    margin: 0px;
    padding: 0px 25px 35px 25px;
    display: inline-block;
    width: 100%;
}

.LlistaLabelsgeneral li{
    width: auto;
    margin-right: 8px;
    float: left;
    padding: 6px 16px;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    min-width: 145px;
}

.stickyEl{
    top: 0;
    position: sticky;
    z-index: 99999;
}



ul.menucatstop .companyMembers{
    display:none;
    position: absolute;
    right:10px;
}

ul.menucatstop.hoverManager {
    width: calc(20.7% + 78px) !important;
    box-shadow: 0px 0px 55px rgba(0, 0, 0, 0.44) !important;
}

ul.menucatstop.hoverManager .companyMembers{
    display:block;
    right:20px;
}


.subHubs .lineLin {
    padding: 8px 9px 9px 32px !important;
}
ul.menucatstop label {
    padding: 7px 9px 12px 10px !important;
}
.companyMembers.inle .operators a {
    padding: 5px 0px 0px 5px !important;
    width: 24px !important;
    font-size: 1.05em !important;
}


.layerFold {
    content: "";
    position: fixed;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,0.5);
    z-index: -1;
    left: 0%;
    filter: blur(0px);
    opacity: 0;
}

.layerFold.active{
    opacity: 1 !important;
    z-index: 999;
    background: rgba(0,0,0,0.5);
}



@media (max-height:799px){
    ul.menucatstop.hoverManager {
        width: calc(100% - 66px) !important;
        box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2) !important;
    }
    .dragHoverX, .dragHoverX_cat {
        position: relative;
        padding-right: 7px;
    }
    body .inputUser{
        top:0 !important;
    }
    .inputUser.minusleftUser {
        width: calc(100% - 120px) !important;
        position: fixed;
    }
}

ul.menucatstop.onCategories.hoverManager {
    width: calc(16.7% + 78px) !important;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2) !important;
}

@keyframes shine {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(100%);
    }
}

/* Style for the progress container */
#modal_upload_progress {
    animation: slideDown 0.3s ease;
}



@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ============================================
   PROFESSIONAL PROGRESS BAR WITH ::BEFORE
   ============================================ */

/* Progress bar container - each file item */
.modal_drop_upload .plupload_scroll .plupload_filelist li {
    position: relative !important;
    overflow: hidden !important;
}

:root {
    --progress-width: 0%;
}


.upload_filelist li::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    height: 100% !important;
    /* HERE - usa la variable del padre */
    width: var(--progress-width, 0%) !important;
    background: linear-gradient(90deg, rgba(67, 97, 238, 0.1), rgba(67, 97, 238, 0.2)) !important;
    border-right: 2px solid #4361ee !important;
    transition: width 0.3s ease !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

/* Asegura que el li sea relativo */
.upload_filelist li {
    position: relative !important;
    overflow: hidden !important;
    /* Solo para debug - quítalo después */
    border: 1px solid red !important;
}

/* Debug para ver el before */
.upload_filelist li::before {
    /* Temporal - para ver si existe */
    background: rgba(0, 255, 0, 0.2) !important;
}


/* Ensure content stays above the progress bar */
.modal_drop_upload .plupload_scroll .plupload_filelist li > * {
    position: relative !important;
    z-index: 2 !important;
}

/* Optional: Add a subtle animation to the progress bar */
@keyframes progressPulse {
    0% {
        background: linear-gradient(90deg, rgba(67, 97, 238, 0.1), rgba(67, 97, 238, 0.2));
    }
    50% {
        background: linear-gradient(90deg, rgba(67, 97, 238, 0.15), rgba(67, 97, 238, 0.25));
    }
    100% {
        background: linear-gradient(90deg, rgba(67, 97, 238, 0.1), rgba(67, 97, 238, 0.2));
    }
}

.modal_drop_upload .plupload_scroll .plupload_filelist li.uploading::before {
    animation: progressPulse 2s infinite !important;
}

/* Style for completed uploads */
.modal_drop_upload .plupload_scroll .plupload_filelist li.completed::before {
    background: linear-gradient(90deg, rgba(76, 175, 80, 0.1), rgba(76, 175, 80, 0.2)) !important;
    border-right-color: #4caf50 !important;
}

/* Style for failed uploads */
.modal_drop_upload .plupload_scroll .plupload_filelist li.failed::before {
    background: linear-gradient(90deg, rgba(244, 67, 54, 0.1), rgba(244, 67, 54, 0.2)) !important;
    border-right-color: #f44336 !important;
}


/* ============================================
   MANDATORY - Keep this for the overlay
   ============================================ */
.modal_drop_upload {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

/* This rule must stay - only affects direct overlay divs */
.modal_drop_upload > div {
    position: absolute !important;
    height: 100% !important;
    width: 100% !important;
}

/* ============================================
   RESET for ALL content inside plupload_scroll
   ============================================ */
.modal_drop_upload .plupload_scroll,
.modal_drop_upload .plupload_scroll * {
    position: static !important;
    height: auto !important;
    width: auto !important;
    max-height: none !important;
    max-width: none !important;
}

/* ============================================
   BEAUTIFUL PLUPLOAD SCROLL STYLING
   ============================================ */

/* Main container - now static positioned */
.modal_drop_upload .plupload_scroll {
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important;
    margin: 20px !important;
    overflow-y: auto !important;
    max-height: calc(100vh - 40px) !important;
}

/* File list container */
.modal_drop_upload .plupload_scroll .plupload_filelist {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* Individual file items */
.modal_drop_upload .plupload_scroll .plupload_filelist li {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 15px !important;
    margin-bottom: 0px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    height: auto !important;
    width: auto !important;
}

.modal_drop_upload .plupload_scroll .plupload_filelist li:hover {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05) !important;
}

/* File name */
.modal_drop_upload .plupload_scroll .plupload_file_name {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #1e293b !important;
    flex: 1 !important;
    min-width: 200px !important;
    padding-right: 15px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    position: relative !important;
    height: auto !important;
    width: auto !important;
}

.modal_drop_upload .plupload_scroll .plupload_file_name:before {
    content: "📄 " !important;
    margin-right: 8px !important;
    opacity: 0.7 !important;
}

/* File size */
.modal_drop_upload .plupload_scroll .plupload_file_size {
    font-size: 12px !important;
    color: #64748b !important;
    background: #e2e8f0 !important;
    padding: 4px 10px !important;
    border-radius: 20px !important;
    margin-right: 15px !important;
    white-space: nowrap !important;
    position: relative !important;
    height: auto !important;
    width: auto !important;
}

/* File status */
.modal_drop_upload .plupload_scroll .plupload_file_status {
    font-size: 12px !important;
    font-weight: 600 !important;
    min-width: 80px !important;
    text-align: right !important;
    position: relative !important;
    height: auto !important;
    width: auto !important;
}

/* Progress bar container */
.modal_drop_upload .plupload_scroll .plupload_file_progress {
    width: 100% !important;
    height: 6px !important;
    background: #e2e8f0 !important;
    border-radius: 10px !important;
    margin-top: 10px !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Progress bar fill */
.modal_drop_upload .plupload_scroll .plupload_file_progress_bar {
    height: 100% !important;
    background: linear-gradient(90deg, #4361ee, #6d8cff) !important;
    border-radius: 10px !important;
    transition: width 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Shine effect on progress bar */
.modal_drop_upload .plupload_scroll .plupload_file_progress_bar:after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(90deg, 
        transparent 0%, 
        rgba(255,255,255,0.3) 50%, 
        transparent 100%) !important;
    animation: progressShine 1.5s infinite !important;
}

@keyframes progressShine {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* Action buttons (remove, etc) */
.modal_drop_upload .plupload_scroll .plupload_file_action {
    width: 30px !important;
    height: 30px !important;
    margin-left: 10px !important;
    position: relative !important;
}

.modal_drop_upload .plupload_scroll .plupload_file_action a {
    display: inline-block !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    text-align: center !important;
    line-height: 30px !important;
    font-size: 14px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    background-image: url(../custom/img/cross_white.svg) !important;
    background-color: #bdbdbd !important;
    background-size: 60px;
    background-position: center center;
    background-repeat: no-repeat;
    margin-right: 30px;
    top: 6px;
}

.modal_drop_upload .plupload_scroll .plupload_file_action a:hover {
    background: #fecaca !important;
    transform: scale(1.1) !important;
}

/* File thumbnail/icon area */
.modal_drop_upload .plupload_scroll .plupload_file_thumb {
    width: 40px !important;
    height: 40px !important;
    border-radius: 8px !important;
    background: #e2e8f0 !important;
    margin-right: 15px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    position: relative !important;
}

/* Upload progress percentage */
.modal_drop_upload .plupload_scroll .plupload_file_percent {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #4361ee !important;
    background: #eef2ff !important;
    padding: 2px 8px !important;
    border-radius: 20px !important;
    margin-left: 10px !important;
    position: relative !important;
    height: auto !important;
    width: auto !important;
}

/* Footer area */
.modal_drop_upload .plupload_scroll .plupload_filelist_footer {
    background: #f8fafc !important;
    border-top: 1px solid #e2e8f0 !important;
    padding: 15px !important;
    margin-top: 15px !important;
    border-radius: 0 0 12px 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    position: relative !important;
    height: auto !important;
    width: auto !important;
}

/* Upload button */
.modal_drop_upload .plupload_scroll .plupload_button.plupload_start {
    background: #4361ee !important;
    color: white !important;
    border: none !important;
    padding: 10px 25px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    height: auto !important;
    width: auto !important;
}

/* Add files button */
.modal_drop_upload .plupload_scroll .plupload_button.plupload_add {
    background: #f1f5f9 !important;
    color: #1e293b !important;
    border: 1px solid #cbd5e1 !important;
    padding: 9px 25px !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    height: auto !important;
    width: auto !important;
}


.modal_drop_upload .plupload_scroll .plupload_filelist_footer{
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}


@media (max-width: 1200px){ 
    .btnPublisSite {
        margin-top: -50px;
    }
    ul.menucatstop.onCategories.hoverManager {
        width: calc(100% - 60px) !important;
        box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2) !important;
    }
    .choosePlace{
        display:none;
    }
    ul.menucatstop .companyMembers{
        display:block !important;
        right: 15px !important;
    }
    #pagination {
        bottom: 0px;
        padding-bottom: 0px;
        height: auto;
        box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.37);
    }
    .barfootmovil {
        display: block;
        position: fixed;
        bottom: 0;
        right: 0;
        width: 70px;
        height: 55px;
        left: initial;
        z-index: 9999;
        background: #fff;
        box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.37);
        border-left: solid 0px #000 !important;
    }
    .layerFold{
        display:none !important;
    }
    .companyMembers.inle.showDesk {
        display: none !important;
    }
    .crossClose {
        top: 17px !important;
        right: -60px !important;
    }
    
}


/* A file arrived that this person has not seen: a dot on its inbox, on the hub that holds it, and
   on "Recientes" (2026-09-28). It goes by itself once the list has been on screen. */
.vkRow-new{
    flex: 0 0 auto; width: 8px; height: 8px; margin-left: 7px; border-radius: 50%;
    background: var(--vk-brand, #0f52ff); box-shadow: 0 0 0 3px rgba(var(--vk-brand-rgb, 15, 82, 255), .16);   /* the account's colour (brief I) */
}
.vkTree-recent .vkRow-new{ margin-left: 6px; }
.vkSr{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ================================================================================================
   THE FILE CARDS OF THE GRID (2026-09-28, to _design-refs/body-card-2026-09-27.png)

   A polish of the card that was already there, not a new one: the same pieces in the same order -
   the picture, the extension and the weight, the button that points at its section, and the row of
   actions. What changes is the look: round corners, a soft shadow, the two facts as pills and the
   section button as a circle, the actions in ink rather than on a grey strip.

   Measured off the reference rather than eyeballed: the card's corner is 5.4% of its width (12px on
   the 223px-wide card in the picture), which is 18px on the 372px cards the grid draws here; the
   pills are #f0f0f0 on #ffffff.

   Scoped to .containernews so nothing else moves, and to .details so the drag handle - which shares
   the .refere.regular class with the pills - keeps the shape it needs.
   ================================================================================================ */
.containernews .capsaitem{
    background: #ffffff;
    border-radius: 9px;
    /* his own, 2026-09-28 (18px); halved 2026-10-10, his words: "reduce the border radius in the admin grid" and "si, la mitad" */
    box-shadow: none;
    padding: 7px;                       /* box-sizing is border-box: the grid's columns do not move */
}

/* the picture: its own rounded box, on the light grey the reference uses while it loads */
/* The picture's rounded box: .SeeDetail is the link that holds the <img>, and .onToppe wraps the
   WHOLE card - giving that one the placeholder colour paints it behind the actions as well, which
   is what the first attempt did. .onToppe still clips, so its radius has to match. */
.containernews .capsaitem .onToppe{ border-radius: 6px; }          /* halved with the card, 2026-10-10 */
.containernews .capsaitem .SeeDetail{
    display: block;
    border-radius: 6px;
    overflow: hidden;
    background: #f4f4f6;
}
.containernews .capsaitem .SeeDetail img{ border: 0; border-radius: 6px; }

/* ".png"  "41 KB" - pills, not boxes */
.containernews .capsaitem .details .refere.regular{
    background: #f0f0f0;
    color: #16161a;
    border-radius: 999px;
    padding: 7px 13px;
    font-size: 11px !important;
    font-weight: 700;
    line-height: 1;
    border: 0;
}
.containernews .capsaitem .details .refere.regular strong{ font-weight: 700; }

/* the one that points at its section: a circle, as in the reference */
.containernews .capsaitem .details .refere.regular.vkLocate{
    background: none;                    /* his, 2026-09-28 */
    width: 24px; height: 24px; padding: 0; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
}
.containernews .capsaitem .details .refere.regular.vkLocate i{ font-size: 12px; margin: 0; }

/* the actions: ink on the card itself, no grey strip under them */
.containernews .capsaitem .contcatoptions{
    background: transparent;
    border-radius: 0;
    padding-top: 2px;
}
.containernews .capsaitem .contcatoptions .buttonscategory i{
    color: #16161a;
    font-size: 15px !important;
}
.containernews .capsaitem .contcatoptions .buttonscategory:hover i{ color: var(--vk-brand-fg, #0f52ff); }

/* the name, quieter than the pills under it */
.containernews .capsaitem .details .cred{ color: #3c3b46; }

/* The handle that drags a card shares .refere.regular with the pills but sits outside .details, so
   it kept the old look: a white box on a white card. Same pill, quieter, and it stays where it was. */
.containernews .capsaitem .refere.regular.draggeritem{
    background: #f0f0f0;
    border-radius: 999px;
    border: 0;
}
.containernews .capsaitem .refere.regular.draggeritem i{ color: #6b6a75 !important; }

/* The 5px black line that separated the picture from the rest (.capsaitem .details border-top) is
   not in the reference, and with the picture in a rounded box of its own it has nothing to divide. */
/* THE PICTURE IS NEVER SHORTER THAN 140px (2026-09-28, his queue item 17)

   "ves las cajas que son muy poco antas? pues dificulta al usuario para interactuar con las opciones
   dentro de la caja", and, exactly: "me refiero a que la imagen no mida menos de 140px, no la caja".

   The floor is here rather than in the script so it holds from the first paint and Packery measures
   the final box. The picture keeps its own ratio inside it; what that leaves is filled with the same
   picture blurred (view/js/vk_cardfill.js sets --vk-fill), which is its dominant colours by
   definition and costs no second request. */
.containernews .capsaitem .SeeDetail{
    display: flex; align-items: center; justify-content: center;
    position: relative; overflow: hidden;
}
/* The floor waits for a picture to actually be there. A card whose preview never loads - a video
   whose thumbnail is missing, measured 2026-09-28 on his .mp4 - was being given a 140px box with
   nothing in it, which is worse than the small card it had. is-vkOk is set by vk_cardfill.js only
   once the <img> has really decoded. */
.containernews .capsaitem .SeeDetail.is-vkOk{ min-height: 140px; }
/* ROOM AROUND A FILE THAT IS AN ELEMENT, NOT A PHOTOGRAPH (2026-09-28, his ask with a screenshot):
   "la imagen debe de tener un espaciado para que no quede tan apretado al borde", and he asked for
   it on what is already uploaded as well as on what comes next - which is why it is here, in how
   they are shown, and not in how the thumbnail is made.

   NOT "a PNG": a PNG is just as often a photograph, and insetting those inside a grey frame was
   wrong - he saw it and said so. view/js/vk_cardfill.js looks at the picture itself and marks the
   ones that really are an element on nothing. box-sizing is border-box, so the 140px floor still
   measures 140. */
.containernews .capsaitem .SeeDetail.is-vkElement{
    padding: 14px; background: #e8e8e8; border-radius: 12px; box-sizing: border-box;
}
/* A DRAWING ON NOTHING IS SHOWN BARE, NO GREY BOX (2026-10-11). His words, with two pictures of his hub «Characters» - the grey box taken off
   in his browser: "puede algunas imagenes no llevar fondo como esto? ... porque queda mejor asi"; then a recording of his hub «Storytelling»
   with every drawing bare, each with its own room: "genial si se viera asi el grid en estos casos, toma ejemplo." (a first version kept the
   box for a drawing whose ink would vanish on the card - 48 of his 231 there; his recording has none). The card's picture box under it (the
   dark look's is vk_dark.css's) and no grey under the picture (.png_background img gives it one); the 14 px of room stay. */
.containernews .capsaitem .SeeDetail.is-vkElement{ background: #f4f4f6; }
.containernews .capsaitem .SeeDetail.is-vkElement img{ background: transparent; }
/* ...except a drawing of which nearly nothing shows on the card's colour (his «lines glitch»: "aquio se ha de aplicar un fondo para wque se vea que ontiene la
   imagen"): view/js/vk_cardfill.js marks it for the look where that happens, and it keeps the grey box there */
html:not([data-theme="dark"]) .containernews .capsaitem .SeeDetail.is-vkElement.is-vkBoxLight,
html[data-theme="dark"] .containernews .capsaitem .SeeDetail.is-vkElement.is-vkBoxDark,
html:not([data-theme="dark"]) .containernews .capsaitem .SeeDetail.is-vkElement.is-vkBoxLight img,
html[data-theme="dark"] .containernews .capsaitem .SeeDetail.is-vkElement.is-vkBoxDark img{ background: #e8e8e8; }
/* THE SAME ROOM FOR EVERY DRAWING ON NOTHING (2026-10-11). His words, with his «icona.png» - a round logo with no margin of its own, shown edge to edge - and the
   same logo small, with room round it: "I want like this all the cases looking like imag 2" (all the cases like the edge-to-edge one, like the roomy one).
   24 % of the card on each side (a percentage padding is taken of the card's width, top and bottom too) - with the card's own 5 % enlargement of every picture
   that leaves ~23 % of room, his picture's (the logo 112 px in a 207 px box) - whatever margin the file brings: its see-through
   margin is trimmed from the previews (core/vk/media.php), so the card alone decides the room. The few that keep the grey box keep its 14 px. */
/* 15 % FOR EVERY ONE, NOW (later that night): 24 % first; 15 % for a big card ("padding de un 15% en vez del 24%") and for a fine drawing of his «M2» ("se ven muy
   pequeñas"); then, asked whether his dense «M6.png» - or all - should go to 15 % too: "si". */
.containernews .capsaitem .SeeDetail.is-vkElement{ padding: 15%; }
html:not([data-theme="dark"]) .containernews .capsaitem .SeeDetail.is-vkElement.is-vkBoxLight,
html[data-theme="dark"] .containernews .capsaitem .SeeDetail.is-vkElement.is-vkBoxDark{ padding: 14px; }

/* the picture is sized as the card always sized it (width:100%, height auto, .capsaitem img):
   its ratio comes out of that on its own, and the floor above does the padding. Only the stacking
   is added, so it sits over the blurred backdrop. */
/* AND NEVER TALLER THAN HALF THE WINDOW (2026-09-28, his ask with a screenshot of a catalogue cover
   that ran off the bottom of the screen): "cabe la posibilidad que haya archivos muuuuuuy largos como
   este, que midan muy alto. nedesito que lo reduzca y que apliques las mismas leyes que hiziste con los
   archivos que no tienen mas de 140px de altura en su foto. Pero esta vez con las fotos de los archivos
   que miden mas de la mitad de la pantalla."

   The ceiling is the floor's mirror, and it is CSS for the same reason: Packery measures the final box
   from the first paint. object-fit keeps the picture's ratio inside the capped box, so a very tall one
   comes out narrower and centred, and what that leaves at its sides is filled exactly as the floor's
   gap is - the picture blurred, or the grey frame when it is an element (view/js/vk_cardfill.js). Half
   the WINDOW, so it follows a resize; every card is watched by vk_grid.js, which lays the grid out again. */
.containernews .capsaitem .SeeDetail img{ position: relative; z-index: 1; max-height: 50vh; object-fit: contain; }
/* A PNG's picture carries a grey of its own (.png_background img), which painted right over the blurred
   backdrop - visible as soon as a picture is letterboxed, which the ceiling above makes common. Where
   there is a backdrop, the picture lets it through. */
.containernews .capsaitem .SeeDetail.is-vkFilled img{ background: transparent; }
.containernews .capsaitem .SeeDetail.is-vkFilled::before{
    content: ""; position: absolute; inset: -12%;
    background-image: var(--vk-fill); background-size: cover; background-position: center;
    filter: blur(26px) saturate(1.05); opacity: 1; z-index: 0; pointer-events: none;
}

/* ROW WHILE THERE IS ROOM, COLUMN WHEN THERE IS NOT (2026-09-28, his ask with a screenshot):
   "la info de los archivos y botones de las cajas has de estar en row cuando cabe de sobras, pero en
   columna cuando no caben".

   .details and .contcatoptions are both float:left at width:100% inside .onToppe, so they always
   stacked. Given their real width they float beside each other when the card is wide and the buttons
   drop to their own line when it is narrow - which is the behaviour, with no flex container and no
   media query. It follows the card, not the window, and Packery keeps measuring the same box.

   (The first attempt made .capsaitem itself a flex container. The picture collapsed and every card
   became a strip: .capsaitem has ONE child, .onToppe, and everything else lives inside it.)
   flow-root, because .details holds floated pills and would otherwise have no height of its own. */
/* THE NAME ON A LINE OF ITS OWN, THE PILLS AND THE BUTTONS ON THE NEXT (2026-10-02 night, his words: "la parte baja de las cajas ha de
   estar asi. La leyenda ocupa 100% de la caja y la caja de abajo contiene los dos elementos restantes ... tiene que quedar proporcionales y
   perfectamente alineados como te muestro. Cuando no quepan, los pones cada caja debajo de otra."). The floats above put the buttons on the
   NAME's line in a wide card. The buttons are inside .details now (parts/category_items.php), after the pills, and .details is one wrapping
   row: the name, the caption and the list of sources take the whole width, the pills follow, the buttons go to the right of them - or, in a
   card too narrow for both, to the next line. Not .capsaitem: it holds only .onToppe (the 2026-09-28 note above). */
.containernews .capsaitem .onToppe > .details{
    display: flex; flex-wrap: wrap; align-items: center; float: none; width: 100%; max-width: 100%;
}
.containernews .capsaitem .details > .vkCardName, .containernews .capsaitem .details > .cred,
.containernews .capsaitem .details > .titliFilelist, .containernews .capsaitem .details > .FilesInside{ flex: 0 0 100%; }
.containernews .capsaitem .details > .contcatoptions{ float: none; width: auto; clear: none; margin-left: auto; }
/* the same margins above and below for the pills and the buttons at every width (a phone's rule gave the pills theirs above), so both are
   centred on one line - measured to the tenth of a pixel */
.containernews .capsaitem .onToppe > .details > .refere, .containernews .capsaitem .onToppe > .details > .contcatoptions{ margin-top: 0; margin-bottom: 5px; }
.containernews .capsaitem .details{
    border-top: 0;
    padding: 0;                          /* his, 2026-09-28 */
    background: transparent;
}

/* NO BLINK WHEN A PAGE IS SWAPPED IN PLACE (2026-09-28, his "hacen un glitch", "para borrado y para
   todos pasa").

   vk_nav.js takes the content out and puts the new content in without reloading. Every element that
   arrives is NEW to the browser, so anything with .effect or its own entry animation plays it again -
   the whole page appearing at once, which is exactly the flicker he means.

   Movement is turned off for the moment of the swap and given back on the next frame. Nothing is
   removed: a hover or a menu opening a second later animates as it always did. */
html.vkNav-swapping *,
html.vkNav-swapping *::before,
html.vkNav-swapping *::after{
    transition: none !important;
    animation: none !important;
}

/* A VECTOR IS A PICTURE LIKE ANY OTHER, AND IS NOT BLOWN UP TO FILL THE LAYER (2026-09-28, his
   "NO QUIERO QUE SEA TAN GRANDE A NO SER QUE SE AMPLIE"). core/item/watch_item.php gives it its own
   width and height, read out of the file, so it is drawn at its own size exactly as a .png is; these
   caps stop a big drawing from taking the whole panel, and the magnifier is what opens it full size.
   They need !important because .casing.fullHeight .mainImg above lifts the cap with one. */
.watch_item_modal .casing .mainImg.vkVector,
.watch_item_modal .casing.fullHeight .mainImg.vkVector{
    width: auto !important;
    height: auto !important;
    max-width: min(750px, 100%) !important;
    max-height: 534px !important;
}

/* THE CAPTION'S OWN SPACING, ONLY WHERE THERE IS A CAPTION (2026-09-28, his words: "si en las cajas del
   body existe caption, que esta propiedad se aplique al caption"). The element is always in the card -
   script.js writes an edited caption straight into it - so the rule hangs on it having something in it,
   and a caption typed without reloading gets the margin as soon as the text lands. */
.containernews .capsaitem .details .cred:not(:empty){ margin: 9px 0px 10px 0px; }

/* THE FILE'S NAME ON THE CARD (brief S, 2026-10-02, his "muestra el filename de los elementos, en el estilo del caption que actualmente
   tenemos"): the caption's size and colour, one line cut with an ellipsis (the whole name is its title). The caption, when there is one,
   comes right under it; when there is none, its empty element adds no gap of its own. */
.containernews .capsaitem .details .vkCardName{
    float: left; width: 100%; margin: 9px 0px 8px 0px;
    font-size: 10px; color: #3c3b46;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.containernews .capsaitem .details .vkCardName + .cred:empty{ margin-bottom: 0; }
.containernews .capsaitem .details .vkCardName + .cred:not(:empty){ margin-top: 0; }
/* A CAPTION SAYS IT, NOT THE FILE'S NAME (2026-10-12, his words: "haz que podamos elegir si mostrar el nombre del archivo en los items del grid o no. o mas facil todavia: si exoiste caption, no pongas
   el filename"): a card whose caption has something in it shows the caption alone, in the name's place (its top margin); the name stays in the document (script.js writes a rename into it, the detail
   reads it) and comes back the moment the caption is emptied. The panel's cards and the landing's alike. */
.containernews .capsaitem .details:has(> .cred:not(:empty)) > .vkCardName{ display: none; }
.containernews .capsaitem .details:has(> .cred:not(:empty)) > .vkCardName + .cred{ margin-top: 9px; }

/* "ORDENAR CARPETAS": the window that shows what would move before it moves it (2026-09-28, his
   "el modal solo estructura las carpetas del disco (...) tal i como lo tenemos en el sidebar"). */
.vkOrg{ position: fixed; inset: 0; z-index: 100000; background: rgba(16,16,26,.45); display: flex; align-items: center; justify-content: center; padding: 20px; }
.vkOrg-card{ background: #fff; border-radius: 18px; padding: 26px 28px; width: min(560px, 100%); max-height: 86vh; overflow: auto; box-shadow: 0 24px 60px rgba(0,0,0,.28); }
.vkOrg-title{ font-size: 19px; font-weight: 700; color: #16161a; margin: 0 0 10px 0; }
.vkOrg-text{ font-size: 13px; line-height: 1.5; color: #5f5e6b; margin: 0 0 14px 0; }
.vkOrg-list{ list-style: none; margin: 0 0 12px 0; padding: 0; }
.vkOrg-list li{ font-size: 14px; color: #16161a; padding: 6px 0; border-bottom: 1px solid #f0eff5; }
.vkOrg-list li.is-quiet{ color: #7b7a88; }
.vkOrg-list li.is-warn{ color: #b23c17; }
.vkOrg-dirs{ font-size: 12px; line-height: 1.6; color: #5f5e6b; background: #f7f6fb; border-radius: 10px; padding: 10px 12px; margin: 0 0 12px 0; word-break: break-all; }
.vkOrg-state{ font-size: 13px; color: #16161a; min-height: 20px; margin: 0 0 12px 0; }
.vkOrg-acts{ display: flex; gap: 10px; justify-content: flex-end; }
.vkOrg-go, .vkOrg-close{ border: 0; border-radius: 999px; padding: 10px 20px; font-size: 14px; font-weight: 600; cursor: pointer; }
.vkOrg-go{ background: #1668ff; color: #fff; }
.vkOrg-go[disabled]{ background: #c9c8d4; cursor: default; }
.vkOrg-close{ background: #f0eff5; color: #16161a; }
.vkHead-organize{ border: 0; background: #f0eff5; color: #16161a; border-radius: 999px; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.vkHead-organize:hover{ background: #e4e2ee; }

.vkOrg-all{ border: 0; border-radius: 999px; padding: 10px 20px; font-size: 14px; font-weight: 600; cursor: pointer; background: #efe9ff; color: #4a1fb8; margin-right: auto; }
.vkOrg-all[disabled]{ opacity: .6; cursor: default; }

/* The window that asks what the copy is called and what comes with it (his point 33, 2026-09-28).
   It wears the same card as "Ordenar carpetas": one look for the app's own questions. */
.vkDup-label{ display: block; font-size: 13px; font-weight: 600; color: #16161a; margin: 0 0 6px 0; }
.vkDup-name{ width: 100%; border: 1px solid #d9d7e4; border-radius: 10px; padding: 11px 13px; font-size: 14px; color: #16161a; margin: 0 0 14px 0; }
.vkDup-name:focus{ outline: 2px solid #1668ff; outline-offset: 1px; border-color: transparent; }
.vkDup-check{ display: flex; align-items: center; gap: 9px; font-size: 14px; color: #16161a; padding: 7px 0; cursor: pointer; }
.vkDup-check input{ width: 17px; height: 17px; accent-color: #1668ff; cursor: pointer; }

/* THE ICONS OF A CARD STAY ON ONE LINE (2026-09-28, his "haz algo para solucionar esto: que las iconas
   siempre esten en linea", with three cards whose fifth icon had dropped below). They were floated,
   36 px each, in a row as wide as the picture: five fit in a card of 345 px and four in one of 167,
   measured. A row that does not wrap and buttons that may narrow keep them together at any card width;
   row-reverse holds the order they have always had, which floating right gave them. */
.containernews .capsaitem .contcatoptions{
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    max-width: 100%;                    /* so the buttons narrow instead of hanging out of the card */
}
.containernews .capsaitem .contcatoptions > *{
    float: none !important;
    flex: 0 1 auto;
    min-width: 24px;
}

/* THE PSD / PSB DOWNLOAD BUTTON (2026-10-03, his words with a screenshot: "el boton de download se ve muy empegado al borde derecho, has de separarlo un poco, y
   quitar el borde que tiene a la derecha", then "en normal esta igual de separado, aplica la separacion en los dos modos"). The old .buttonct gave it 20 % of the row -
   24 px in a person's card, where it is alone - so its icon spilled over its 8 px padding onto the 1 px #ececec right border of .buttondtdwn, at the card's edge.
   Now it is the box every other button of the card is: 36 px, no padding, no border, the icon centred and inked as theirs (its menu: view/css/vk_dark.css). */
.containernews .capsaitem .contcatoptions .buttonunfold{
    width: 36px !important; min-width: 36px; min-height: 27px; padding: 0 !important; border: 0 !important; border-radius: 0;      /* 27 px: the line height of the others */
    display: flex; align-items: center; justify-content: center; align-self: stretch;
    background: transparent !important; cursor: pointer;
}
.containernews .capsaitem .contcatoptions .buttonunfold i{ color: #16161a !important; }
.containernews .capsaitem .contcatoptions .buttonunfold:hover i{ color: var(--vk-brand-fg, #0f52ff) !important; }
/* ITS MENU («Descargar el archivo» / «Descargar JPG») in the look of the app's menus (.vkMenu, view/css/sidebar_tree.css): the surface, a line, 14 px corners, rows of 9 px,
   as wide as its words. His words, 2026-10-03: "el dropbody diseñalo acorde nuestro estilo dark, con bordes redondeados", then, for the light look, "sí, iguálalo también
   en claro". It was a #424242 box of 97 x 100 px with square corners, which broke «Baixa el fitxer» in two. The dark look's shadow: view/css/vk_dark.css. */
.containernews .capsaitem .dropdwn{
    width: max-content; min-width: 168px; height: auto; padding: 6px; overflow: visible;
    background: var(--vk-surface, #ffffff); border: 1px solid var(--vk-line, #e4e3ea); border-radius: 14px; box-shadow: 0 14px 34px rgba(30, 20, 60, .16);
}
.containernews .capsaitem .dropdwn li{ float: none !important; width: auto !important; list-style: none; }      /* each li has float:left and width:100% written on it; unfloated, it would show its bullet */
.containernews .capsaitem .dropdwn li a.buttondrop.drdr{
    float: none !important; display: block; width: auto !important; padding: 9px 12px; border: 0 !important; border-radius: 9px;
    background: transparent !important; color: var(--vk-text, #16161a); font-size: 13px; line-height: 1.3; white-space: nowrap; text-decoration: none;
}
.containernews .capsaitem .dropdwn li a.buttondrop.drdr:hover,
.containernews .capsaitem .dropdwn li a.buttondrop.drdr:focus{ background: var(--vk-violet-tint-f3f0fb, #f3f0fb) !important; color: var(--vk-text, #16161a); outline: none; }


/* WHAT EACH ROW OF THE SIDEBAR IS, AT A GLANCE (2026-09-28, his ask): a stack of boxes for a hub that
   holds hubs, one box for a hub, a folder for a section. The drawing sits before the name, quieter than
   the text, and shrinks out of the way when the row is tight. */
.vkRow-line > .vkI{ flex: none; width: 15px; height: 15px; opacity: .55; }   /* the row already spaces them */
.vkNode--hub > .vkRow .vkRow-line > .vkI{ opacity: .7; }
.vkRow.is-current .vkRow-line > .vkI, .vkRow-link[aria-current] .vkRow-line > .vkI{ opacity: 1; }


/* THE WINDOW "Bulk Download", SECOND FACE (brief O, 2026-10-02). Files that weigh too much for one zip are not zipped: the form gives way to a list,
   one plain link per file - a download the browser can pause and resume. view/js/script.js vkMassList() fills it and adds .is-vkList. */
#masiv .vkMass-list{ display: none; }
#masiv .modal-body.is-vkList > :not(.vkMass-list){ display: none !important; }
#masiv .modal-body.is-vkList .vkMass-list{ display: block; width: 100%; }
#masiv .vkMass-note{ margin: 0 0 14px; }
#masiv .vkMass-files{ list-style: none; margin: 0; padding: 0; max-height: 50vh; overflow-y: auto; }
#masiv .vkMass-files li{ display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid rgba(0, 0, 0, .08); }
#masiv .vkMass-name{ flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
#masiv .vkMass-size{ flex: none; opacity: .6; font-size: 13px; white-space: nowrap; }
#masiv .vkMass-get{ flex: none; padding: 8px 14px; border-radius: 8px; background: var(--vk-brand, #0F52FF); color: var(--vk-brand-ink, #fff); font-size: 14px; white-space: nowrap; text-decoration: none; }
#masiv .vkMass-get:hover, #masiv .vkMass-get:focus{ opacity: .88; color: var(--vk-brand-ink, #fff); text-decoration: none; }
@media (max-width: 480px){
    #masiv .vkMass-files li{ flex-wrap: wrap; }
    #masiv .vkMass-name{ flex: 1 1 100%; }
    #masiv .vkMass-size{ flex: 1; }
}

/* THE PAGE NEVER SHAKES AT THE EDGE OF SCROLLING (2026-10-07, his recording of the hub Branding: "arregla este temblor ... el elemento toca al limite
   y hace glitch con el scroll"): a page just as tall as the window gained and lost its scrollbar in a loop - the bar takes ~15 px, the grid re-laid
   out narrower, grew taller, the bar came, and so on. Every page is a pixel taller than the window, so the bar is always there and the width never
   changes (scrollbar-gutter does not reach the window's own bar while html's overflow is visible, measured; and setting that overflow would undo
   Bootstrap's scroll lock under its windows). */
body{ min-height: calc(100vh + 1px); }

/* the app's header casts a shadow on the page under it, and the head's line (view/css/vk_stickhead.css, z-index 100) comes out from under both
   (his values, 2026-10-07: "quiero que apliques la sombra de debajo del header. hazla igual") */
/* then, the same night: "no adaptaste al modo light la ultima sombra del header ... suaviza muchisimo la sombra del header" - his shape, far
   lighter: a faint haze in light, a soft shade in dark */
header{ box-shadow: 0px 6px 44px -6px rgba(22, 22, 26, .10); z-index: 120 !important; }
html[data-theme="dark"] header{ box-shadow: 0px 6px 44px -6px rgba(6, 6, 7, .38); }

/* THE DATE PICKER OPENED AS A THIN BAR (brief AV, 2026-10-08; seen 2026-10-03 in the file's edit window). The script is bootstrap-datepicker 1.6.4 (inc/footer.php), the
   stylesheet is 1.3.0's (inc/header.php): 1.3.0 hides every view of the picker (.datepicker > div { display: none }) and shows the one under a class on the picker itself
   (.datepicker.days ...), which 1.6.4 no longer sets - it shows its view with jQuery .show(), which only takes an inline "display: none" away. So the days sat under the
   old rule, hidden, and the picker was a 10 px strip. Where the views stand: block. The views 1.6.4 means to hide carry an inline display: none, which wins over this. */
.datepicker-dropdown > div{ display: block; }

/* BRIEF BZ (2026-10-17): THE BOXES IN PLACE AT THE FIRST PAINT, EACH PICTURE FILLING ITS BOX AS IT ARRIVES (core/vk/pic_meta.php prints every picture's width and height and the
   classes the browser used to learn after decoding). His words, 2026-10-12: "hay una imagen de muy bajo peso con muy poca resolucion - desenfocala con css y nos servira como
   elemento placeholder de mientrs no carga la miniatura buena, el cambio de baja resolucion a buena resolucion tiene que ser con interpolacion". The low_ preview (.vkLow) sits blurred
   under the picture, scaled so the blur's edge never shows inside the rounded box; the good picture is transparent until it has decoded (data-vk-ld) and then fades in over it. */
.containernews .capsaitem .SeeDetail .vkLow{
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background-size: cover; background-position: center;
    filter: blur(9px); transform: scale(1.25);
}
.containernews .capsaitem .SeeDetail img[data-vk-ph]{ transition: opacity .25s ease, transform .2s ease-in-out; }
.containernews .capsaitem .SeeDetail img[data-vk-ph]:not([data-vk-ld]){ opacity: 0; }
/* THE CASCADE: on the card's inner element, never on the card (Packery positions that) */
@keyframes vkCasc{ from{ opacity: 0; transform: translateY(8px); } to{ opacity: 1; transform: none; } }
.containernews .conty > .capsaitem > .vkCasc{ animation: vkCasc .16s ease-out both; animation-delay: calc(var(--vk-ci, 0) * 25ms); }
@media (prefers-reduced-motion: reduce){
    .containernews .conty > .capsaitem > .vkCasc{ animation: none; }
    .containernews .capsaitem .SeeDetail img[data-vk-ph]{ transition: none; }
}