/* =================================================
 *  CUSTOM.CSS  —  Bootstrap 5 companion stylesheet
 *  (tidied, de-duplicated, uses design-tokens)
 * =================================================*/

/* ----------  PALETTE TOKENS  ---------- */
:root{
  --clr-blue-button-background:#005ba1;
  --clr-blue-button-text:#fff;
  --clr-grey-3:#333;
  --clr-grey-9:#949398;
  --clr-grey-d:#d8d8d8;
  --clr-grey-f:#f8f9fa;
}

/* ----------  FIREBASE UI / MDL ACCENTS  ---------- */
.firebaseui-idp-password,
.firebaseui-button,
.firebaseui-textfield.mdl-textfield .firebaseui-label:after,
.firebaseui-textfield.mdl-textfield .mdl-textfield--floating-label::after,
.mdl-progress>.progressbar{
  background-color:var(--clr-blue-button-background)!important;
  border-bottom-color:var(--clr-blue-button-background)!important;
}
.firebaseui-button{color:var(--clr-blue-button-text)!important;}
.firebaseui-idp-text{
  font:400 17px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif!important;
}
.mdl-textfield__input{
  border-bottom:1px solid var(--clr-blue-button-background)!important;
  box-shadow:0 0 0 rgba(0,0,0,.16),0 0 0 rgba(0,0,0,.23)!important;
}


/* ----------  BOOTSTRAP EXTENSIONS  ---------- */
.btn{
  background-color:var(--clr-blue-button-background);
  color:var(--clr-blue-button-text);
}

/* dropdown triggers keep their neutral look */
.dropdown-button1{
  background-color:var(--clr-grey-f);
  color:var(--clr-grey-3);
  opacity:.7;
}
.dropdown-button2{
  background:#fff;
  color:var(--clr-grey-3);
  opacity:1;
}

.navbar{border-bottom:1px solid var(--clr-grey-3);}
.navbar-nav .nav-item{align-items:center;}
.userpic,.nav-icon{
  width:32px;height:32px;border-radius:50%;
  background:center/cover no-repeat;
}
.nav-icon{opacity:.7;transition:opacity .3s;align-self:center;}
.navbar-nav .nav-item .nav-link.active .nav-icon,
.navbar-nav .nav-item .nav-icon:hover{opacity:1;}
@media (max-width:500px){ .navbar-nav .nav-item .nav-link, .nav-link-tight{margin:0!important;padding:0!important;} }


/* ----------  DROPDOWN MENUS  ---------- */
.dropdown-menu{
  background:#fff;border:1px solid #ddd;
  box-shadow:0 2px 5px rgba(0,0,0,.15);
}
.dropdown-menu .dropdown-item{color:var(--clr-grey-3);}
.dropdown-menu .dropdown-item:hover,
.dropdown-item.active{
  background:var(--clr-grey-f);
  font-weight:bold;
}
.dropdown-menu-center{left:50%;transform:translateX(-50%);}


/* ----------  CHECKBOX / ICON HELPERS  ---------- */
input[type=checkbox]{-moz-appearance:none;}
.editportfcheckbox{-moz-appearance:checkbox!important;}
.sorth{cursor:pointer;}
.pen:hover{cursor:pointer;filter:invert(.5);}
.hiddenRow{padding:0!important;}


/* ----------  STAR & PSTAR CONTROLS  ---------- */
.star,.pstar{
  position:relative;visibility:hidden;cursor:pointer;
}
.star:before,.pstar:before{
  position:absolute;visibility:visible;color:var(--clr-grey-d);
}
.star:hover,.pstar:hover{filter:invert(.5);}
.star{font-size:18px;}
.star:before{content:"○";margin-top:-6px;}
.star:checked:before{content:"●";color:var(--clr-grey-9);}
.pstar{font-size:20px;}
.pstar:before{content:"☆";margin-top:-10px;color:#aaa;}
.pstar:checked:before{content:"★";color:var(--clr-grey-9);}
@-moz-document url-prefix(){ .star:before{margin-top:-18px;} .star:checked:before{margin-top:-18px;} }


/* ----------  CUSTOM FILE INPUT  ---------- */
.custom-file-button input[type=file]{margin-left:-2px!important;}
.custom-file-button input[type=file]::file-selector-button,
.custom-file-button input[type=file]::-webkit-file-upload-button{display:none;}
.custom-file-button:hover label{background:#dde0e3;cursor:pointer;}


/* ----------  TOOLTIP  ---------- */
.tooltip-container{position:relative;display:inline-block;cursor:pointer;}
.tooltip-text{
  visibility:hidden;opacity:0;transition:opacity .3s;
  width:120px;padding:5px 0;border-radius:4px;text-align:center;
  background:#555;color:#fff;
  position:absolute;top:50%;left:150%;margin-top:-15px;z-index:1201;
}
.tooltip-text::before{
  content:"";position:absolute;top:50%;right:100%;margin-top:-5px;
  border:5px solid transparent;border-right-color:#555;
}
.tooltip-container:hover .tooltip-text{visibility:visible;opacity:1;}


/* ==============================================================
 *  Responsive tooltip  
 *  --------------------------------------------------------------
 *  add BOTH classes:  tooltip-container tooltip-responsive
 * ============================================================== */

/* ---------- default ----------------- */
.tooltip-container.tooltip-responsive .tooltip-text{
  width:300px;
  white-space:normal;
  text-align:left;      /* ← left-align the contents */
  padding-left:8px;     /* ← small interior margin   */  top:calc(100% + 8px);   /* below trigger */
  left:-20px;             /* slight left shift */
  margin-top:0;
}
.tooltip-container.tooltip-responsive .tooltip-text::before{
  content:"";
  position:absolute;
  top:-6px;               /* arrow on top edge (points up)          */
  left:25px;              /* 25 px from left of bubble               */
  border:6px solid transparent;
  border-bottom-color:#555;
}

/* ---------- wide screens  ------------------- */
@media (min-width:1200px){
  .tooltip-container.tooltip-responsive .tooltip-text{
    width:320px;
    top:50%;              /* centre vertically beside trigger        */
    left:150%;
    transform:translateY(calc(-50% + 0px)); /* nudge downward 16 px */
    padding-left:8px;     /* interior left margin                     */
  }
  .tooltip-container.tooltip-responsive .tooltip-text::before{
    top:50%;
    right:100%;           /* arrow moves to left edge, centred       */
    left:auto;
    margin-top:-6px;
    border:6px solid transparent;
    border-right-color:#555;      /* arrow now points LEFT            */
    border-bottom-color:transparent;
  }
}


/* -------------------------------------------------------------
 *  “side-left” tooltip
 *  • bubble is 50 px to the LEFT of the trigger element
 *  • arrow points right ⟶
 *  ----------------------------------------------------------- */

.tooltip-container.tooltip-left .tooltip-text{
  width:300px;                     /* same width you had */
  top:50%;                         /* vertically centred */
  right:calc(100% + 100px);         /* 50 px gap to the left */
  left:auto;                       /* override any “left:” */
  transform:translateY(calc(-50% + 16px)); /* nudge downward 16 px */
  white-space:normal;
  text-align:left;
  padding-left:8px;
}

.tooltip-container.tooltip-left .tooltip-text::before{
  content:"";
  position:absolute;
  top:50%;
  left:100%;                       /* stick to bubble’s right edge */
  margin-top:-6px;                 /* centre arrow vertically       */
  border:6px solid transparent;    /* create arrow */
  border-left-color:#555;          /* → arrow points RIGHT          */
}


/* ==============================================================
 *  Tooltip variant: farther-right offset on wide screens
 *  usage:  <span class="tooltip-container tooltip-responsive-right-shift">…</span>
 * ============================================================== */

/* (≤1199 px) → identical to your current behaviour, so no extra rules */

/* ≥1200 px – move bubble farther to the right */
/* extra offset on ≥1200 px screens */
@media (min-width:1200px){
  .tooltip-container.tooltip-responsive-right-shift .tooltip-text{
    left:200px;                       /* moved farther right (was 150%) */
  }
  .tooltip-container.tooltip-responsive-right-shift .tooltip-text::before{
    /* keep the arrow touching the bubble’s left edge */
    right:100%;
    left:auto;
  }
}

/* Help page */

.tooltip-container.tooltip-responsive.edge-right .tooltip-text {
  left: auto;               /* cancel default */
  right:100%;               /* place to left of trigger */
  top: 0;                   /* start at top of icon */
  width: 410px;             /* wider */
  min-height: 100px;        /* taller */
  white-space: normal;
  padding: 10px 12px;
  text-align: left;
  margin-top: 0;
  transform: none;          /* cancel vertical centering */
  z-index: 1150;  /* 🆙 on top */
}

.tooltip-container.tooltip-responsive.edge-right .tooltip-text::before {
  left: 100%;               /* stick to right edge of bubble */
  right: auto;
  top: 12px;                /* near top edge of bubble */
  margin-top: 0;
  border: 6px solid transparent;
  border-left-color: #555;  /* → arrow points RIGHT */
  border-right-color: transparent;
  border-bottom-color: transparent;
}



.help-icon {
  width: 2.5rem;           /* bigger circle */
  height: 2.5rem;
  object-fit: contain;     /* preserve aspect */
  cursor: pointer;
  user-select: none;
  /* invert black→white then scale down to ~75% brightness = mid-gray */
  filter: invert(100%) brightness(80%);
  transition: filter 0.15s ease;
}

.help-icon:hover,
.help-icon:focus {
  /* darker gray on hover */
  filter: invert(100%) brightness(50%);
}

.tooltip-container.edge-right {
  margin-right: 22px;  /* push the whole thing left by 3rem */
}


/* ----------  EDITABLE STATES  ---------- */
div[contenteditable]:focus{background:#FFFFF0;}
div.error{background:#ffdddd;outline:1px solid #dc3445;}
.portfolio-name,.newasset{min-height:24px;}
.portfolio-name:empty:before{content:attr(placeholder);color:grey;display:block;}
.newasset:empty:before{content:attr(placeholder);color:#ccc;display:block;}


/* ----------  TABLE BASICS  ---------- */
.table{table-layout:fixed;}
.today-section{font:700 16px/1 sans-serif;}
.today-table,.filter-table,.portfolios-table{font-size:16px;}
.asset-table,.community-table,.report-table{font-size:14px;}
.table-gray-row td,
.community-table tbody tr,
.report-table tbody tr{background:var(--clr-grey-f);}
@media (max-width:1000px){ .today-table,.filter-table{font-size:14px;} h1{font-size:30px;} .my-container{width:100%;max-width:100%;padding:0 15px;} }


/* ----------  TEXT HELPERS ---------- */
.flips-filter{color:#888!important;}
.flips-filter:focus{color:#222!important;}
.cnote_date{
  font-size:13px;min-width:60px;color:#888;
  white-space:nowrap;text-overflow:ellipsis;overflow:hidden;
}
.cnote_nickname{
  font-size:13px;min-width:110px;max-width:110px;color:#888;text-align:right;
  white-space:nowrap;text-overflow:ellipsis;overflow:hidden;
}



/* =================================================
 *  Discovery
 * =================================================*/

/* ------------------------------------------------------------------
 *  1. Color tokens  (keep close to your existing palette)
 * ------------------------------------------------------------------ */
:root{
  --g-0:#ffffff;
  --g-1:#f8f9fa;          /* ≈ Bootstrap bg-light                */
  --g-3:#e4e4e6;          /* thin outline / hover bg             */
  --g-7:#949398;          /* icons / placeholder txt             */
  --g-9:#333333;          /* text                          */

  --brand-accent:#ff7b00; /* the orange you use for coins/stocks */
}

/* ------------------------------------------------------------------
 *  2. Domain buttons  (Coins / Stocks / Commodities)
 *     – "btn-grey" behaves like Bootstrap's secondary but flatter
 * ------------------------------------------------------------------ */

/* ------------------------------------------------------------------
 *  btn-grey  – fully overrides Bootstrap’s primary defaults
 * ------------------------------------------------------------------ */
.btn-grey{
  /* CSS variables (what we set before) */
  --bs-btn-bg:           var(--g-1);
  --bs-btn-border-color: var(--g-3);
  --bs-btn-color:        var(--g-9);
  --bs-btn-hover-bg:     var(--g-3);
  --bs-btn-hover-border-color:var(--g-3);

  /* add the two physical fallbacks ↓↓↓*/
  background-color: var(--g-1) !important;
  border-color:     var(--g-3) !important;
  color:            var(--g-9) !important;
}

.btn-grey:hover{
  background-color: var(--g-3) !important;
  border-color:     var(--g-3) !important;
}

.btn-grey.active,
.btn-grey:active{
  --bs-btn-bg:           var(--clr-blue-button-background);
  --bs-btn-color:        var(--g-0);
  background-color:      var(--clr-blue-button-background) !important;
  border-color:          var(--clr-blue-button-background) !important;
  color:                 var(--g-0) !important;
}



/* ------------------------------------------------------------------
 *  “Go!” button  – blue by default, yellow on hover
 * ------------------------------------------------------------------ */
#filtersApply{
  /* same blue you already use for active navigation buttons */
  --bs-btn-bg:           var(--clr-blue-button-background);
  --bs-btn-border-color: var(--clr-blue-button-background);
  --bs-btn-color:        var(--g-0);      /* white text */

  background-color: var(--clr-blue-button-background) !important;
  border-color:     var(--clr-blue-button-background) !important;
  color:            var(--g-0) !important;
}

#filtersApply:hover,
#filtersApply:focus{
  /* bright yellow + black text */
  background-color: #ffd60a !important;   /* pick any brand-yellow */
  border-color:     #ffd60a !important;
  color:            #000      !important;
}




/* simple column layout */
.filter-grid{
  display:grid;
  grid-template-columns:max-content 1fr;
  column-gap:.75rem;
  row-gap:.25rem;
  align-items:center;
}

/* ---------------------------------------------------------------
 *  Grey toggle buttons
 *  -------------------------------------------------------------
 *  • Un-selected : medium-light grey bg  (#e4e4e6) + dim text
 *  • Hover       : a hair brighter bg    (#f8f9fa) + dark text
 *  • Selected    : white bg + dark text + darker outline
 * ------------------------------------------------------------- */
.btn-grey-outline{
  --bs-btn-bg:           var(--g-3);   /* #e4e4e6 */
  --bs-btn-border-color: var(--g-3);
  --bs-btn-color:        var(--g-7);   /* #949398 dim */
  /* physical fallbacks */
  background-color: var(--g-3) !important;
  border-color:     var(--g-3) !important;
  color:            var(--g-7) !important;
}

.btn-grey-outline:hover{
  --bs-btn-bg:var(--g-1);              /* #f8f9fa */
  --bs-btn-color:var(--g-9);           /* #333    */
  background-color: var(--g-1) !important;
  color:            var(--g-9) !important;
}

.btn-check:checked + .btn-grey-outline{
  --bs-btn-bg:           var(--g-0);   /* white */
  --bs-btn-border-color: var(--g-9);   /* darker outline */
  --bs-btn-color:        var(--g-9);
  background-color: var(--g-0) !important;
  border-color:     var(--g-9) !important;
  color:            var(--g-9) !important;
}



/* --------  slim grey-outline inputs (scoped)  -------- */
.flt-input{
  border:1px solid var(--g-3);
  background:var(--g-1);
  font-size:.825rem;                      /* ≈ form-control-sm */
  padding:.25rem .5rem;
}
.flt-input:focus{
  border-color:var(--g-9);
  background:#FFFFF0;
  outline:none;
}

/* ----------------------------------------------------------------------------
 *  Filter inputs / selects should look like “un-selected” toggles when empty,
 *  then flip to the “selected” style as soon as they have a value.
 * ---------------------------------------------------------------------------- */
.flt-input {
  /* start out looking like an un-selected toggle */
  background-color: var(--g-3) !important;
  border-color:     var(--g-3) !important;
  color:            var(--g-7) !important;
}

.flt-input.filled {
  /* once they have content, look like a checked toggle */
  background-color: var(--g-0) !important;
  border-color:     var(--g-9) !important;
  color:            var(--g-9) !important;
}

#advFilters .flt-input {
  flex: 1 1 auto;        /* grow & shrink, doesn't work */
  min-width: 10ch;        /* never shrink below ~10 chars */
  width: auto !important;/* override Bootstrap’s width:100% */
}



.flt-input-wrapper {
  position: relative;
  display: inline-block; /* shrinkwrap to the input */
}

.always-hint {
  position: absolute;
  top: 50%;                 /* vertically center inside the input */
  right: 0.5rem;            /* match your input’s right padding */
  transform: translateY(-50%);
  pointer-events: none;
  color: #6c757d;
  font-size: .825rem;
  line-height: 1;
  user-select: none;
  z-index: 2;               /* ensure it’s above the input text */
  opacity: 0;
  transition: opacity .2s;
}

/* 2) when the input has content, show it */
.flt-input:not(:placeholder-shown) + .always-hint {
  opacity: 1;
}



.today-table thead.sticky-top {           /* override Bootstrap’s top:0 */
  top:0px;        /* height of navbar + filter bar */
}

.navbar .dropdown-menu {
  z-index: 1100;      /* just higher than 1020 */
}

#prosListMenuItems1 {
  z-index: 1100; /* Match navbar dropdown */
}

#comListMenuItems1 {
  z-index: 1100; /* Match navbar dropdown */
}

.today-name {
  cursor: pointer;
}


/* =================================================
 *  COLUMN WIDTHS
 * =================================================*/

/* ----------  asset-table ---------- */
.asset-table th:nth-child(1)  {width:110px;}
.asset-table th:nth-child(2)  {width:80px;}
.asset-table th:nth-child(3)  {width:100px;}
.asset-table th:nth-child(4)  {width:80px;}
.asset-table th:nth-child(5)  {width:40px;}
.asset-table th:nth-child(6)  {width:40px;}
.asset-table th:nth-child(7)  {width:40px;}
.asset-table th:nth-child(8)  {width:80px;}
.asset-table th:nth-child(9)  {width:100px;}
.asset-table th:nth-child(10)  {width:300px;}
.asset-table th:nth-child(11) {width:30px;}
.asset-table th:nth-child(12) {width:30px;}
.asset-table th:nth-child(13) {width:30px;}

@media (max-width:820px){                         .asset-table th:nth-child(10) {width:180px;} }
@media (min-width:820px) and (max-width:1050px){  .asset-table th:nth-child(10) {width:200px;} }
@media (min-width:1050px) and (max-width:1250px){ .asset-table th:nth-child(10) {width:220px;} }
@media (min-width:1200px) and (max-width:1450px){ .asset-table th:nth-child(10) {width:390px;} }
@media (min-width:1400px){                        .asset-table th:nth-child(10) {width:600px;} }

/* make the centred container wider only on very large screens default with is 1320 */
@media (min-width:1400px){.container.asset-container{max-width:1400px}}


/* ----------  community-table ---------- */
.community-table th:nth-child(1)  {width:100px;}
.community-table th:nth-child(2)  {width:70px;}
.community-table th:nth-child(3)  {width:40px;}
.community-table th:nth-child(4)  {width:40px;}
.community-table th:nth-child(5)  {width:40px;}
.community-table th:nth-child(6)  {width:80px;}
.community-table th:nth-child(7)  {width:100px;}
.community-table th:nth-child(8)  {width:250px;}
.community-table th:nth-child(9)  {width:30px;}
.community-table th:nth-child(10)  {width:30px;}
.community-table th:nth-child(11) {width:30px;}

@media (max-width:767px){                         .community-table th:nth-child(8){width:200px;} }
@media (min-width:768px) and (max-width:1000px){  .community-table th:nth-child(8){width:250px;} }
@media (min-width:1000px) and (max-width:1200px){ .community-table th:nth-child(8){width:250px;} }
@media (min-width:1200px) and (max-width:1400px){ .community-table th:nth-child(8){width:400px;} }
@media (min-width:1400px){                        .community-table th:nth-child(8){width:600px;} }

/* ----------  report-table ---------- */
.report-table th:nth-child(1)  {width:100px;}
.report-table th:nth-child(2)  {width:40px;}
.report-table th:nth-child(3)  {width:40px;}
.report-table th:nth-child(4)  {width:40px;}
.report-table th:nth-child(5)  {width:80px;}
.report-table th:nth-child(6)  {width:110px;}
.report-table th:nth-child(7)  {width:330px;}
.report-table th:nth-child(8)  {width:30px;}
.report-table th:nth-child(9)  {width:30px;}
.report-table th:nth-child(10)  {width:30px;}

@media (max-width:767px){                         .report-table th:nth-child(6){width:100px;} }
@media (min-width:768px) and (max-width:1000px){  .report-table th:nth-child(6){width:100px;} }
@media (min-width:1000px) and (max-width:1100px){ .report-table th:nth-child(6){width:240px;} }
@media (min-width:1100px) and (max-width:1200px){ .report-table th:nth-child(6){width:280px;} }
@media (min-width:1200px) and (max-width:1300px){ .report-table th:nth-child(6){width:300px;} }
@media (min-width:1300px) and (max-width:1400px){ .report-table th:nth-child(6){width:480px;} }
@media (min-width:1400px){                        .report-table th:nth-child(6){width:580px;} }

/* ----------  today-table ---------- */
.today-table th:nth-child(1)  {width:25px;}
.today-table th:nth-child(2)  {width:25px;}
.today-table th:nth-child(3)  {width:25px;}
.today-table th:nth-child(4)  {width:90px;}
.today-table th:nth-child(5)  {width:120px;}
.today-table th:nth-child(6)  {width:100px;}
.today-table th:nth-child(7)  {width:90px;}
.today-table th:nth-child(8)  {width:100px;}
.today-table th:nth-child(9)  {width:120px;}
.today-table th:nth-child(10)  {width:40px;}
.today-table th:nth-child(11) {width:30px;}
.today-table th:nth-child(12) {width:30px;}
.today-table th:nth-child(13) {width:30px;}

@media (max-width:1000px){                        .today-table th:nth-child(10){width:40px;} }
@media (min-width:1000px){                        .today-table th:nth-child(10){width:60px;} }

/* ----------  today-table ---------- */
.today-table-st th:nth-child(1)  {width:25px;}
.today-table-st th:nth-child(2)  {width:25px;}
.today-table-st th:nth-child(3)  {width:25px;}
.today-table-st th:nth-child(4)  {width:110px;}
.today-table-st th:nth-child(5)  {width:140px;}
.today-table-st th:nth-child(6)  {width:80px;}
.today-table-st th:nth-child(7)  {width:70px;}
.today-table-st th:nth-child(8)  {width:100px;}
.today-table-st th:nth-child(9)  {width:140px;}
.today-table-st th:nth-child(10)  {width:25px;}
.today-table-st th:nth-child(11) {width:25px;}
.today-table-st th:nth-child(12) {width:25px;}
.today-table-st th:nth-child(13) {width:25px;}

@media (max-width:1000px){                        .today-table-st th:nth-child(10){width:40px;} }
@media (min-width:1000px){                        .today-table-st th:nth-child(10){width:60px;} }

/* ----------  today-table ---------- */
.today-table-comm th:nth-child(1)  {width:25px;}
.today-table-comm th:nth-child(2)  {width:25px;}
.today-table-comm th:nth-child(3)  {width:25px;}
.today-table-comm th:nth-child(4)  {width:120px;}
.today-table-comm th:nth-child(5)  {width:220px;}
.today-table-comm th:nth-child(6)  {width:100px;}
.today-table-comm th:nth-child(7)  {width:100px;}
.today-table-comm th:nth-child(8)  {width:40px;}
.today-table-comm th:nth-child(9) {width:30px;}
.today-table-comm th:nth-child(10) {width:30px;}
.today-table-comm th:nth-child(11) {width:30px;}

@media (max-width:1000px){                        .today-table-comm th:nth-child(8){width:40px;} }
@media (min-width:1000px){                        .today-table-comm th:nth-child(8){width:60px;} }

/* ----------  filter-table ---------- */
.filter-table td:nth-child(1)  {width:55px;}
.filter-table td:nth-child(2)  {width:50px;}
.filter-table td:nth-child(3)  {width:120px;}
.filter-table td:nth-child(4)  {width:80px;}
.filter-table td:nth-child(5)  {width:100px;}
.filter-table td:nth-child(6)  {width:100px;}
.filter-table td:nth-child(7)  {width:100px;}
.filter-table td:nth-child(8)  {width:120px;}
.filter-table td:nth-child(9)  {width:40px;}
.filter-table td:nth-child(10) {width:30px;}
.filter-table td:nth-child(11) {width:30px;}
.filter-table td:nth-child(12) {width:30px;}

@media (max-width:1000px){                        .filter-table td:nth-child(9){width:40px;} }
@media (min-width:1000px){                        .filter-table td:nth-child(9){width:60px;} }

/* ----------  editportf-table ---------- */
.editportf-table th:nth-child(1)  {width:200px;}
.editportf-table th:nth-child(2)  {width:40px;}
.editportf-table th:nth-child(3)  {width:40px;}
.editportf-table th:nth-child(4)  {width:40px;}