body{
  font-family: 'Open Sans', sans-serif;
  margin: 0;
  color: #333333;
  text-align: left;
  box-sizing: border-box;
  /* background-color: #f5f6f9; */
}

::selection {
  background: #71c3f0;
}

::-moz-selection {
  background: #71c3f0; 
}

:root {
  --BID_COLOR       : #004e70; /*#314867 #2f5c97*/ 
  --BID_COLOR_SEC   : #4ba6de; /* 06a8b2 */
  --BID_COLOR_TER   : #cc0288;
  --BID_COLOR_L     : #3c77c4;
  --BID_COLOR_M     : #3166ac;
  --BID_COLOR_D     : #003e5a; /* 314867 */
  --BID_COLOR_SEC_L : #0cd3dd;
  --BID_COLOR_SEC_D : #089097;
  --BID_COLOR_TER_L : #e7049c;
  --BID_COLOR_TER_D : #aa0573;
  --BID_SOFT        : #CFD9E6;
  --BID_LIGHTER     : #29ABE2;

  --BID_PRIMARY_BLUE : #004e70;
  --BID_PRIMARY_BLACK : #3c3b3b;
  --BID_PRIMARY_CIAN : #4ba6de;

  --BID_PRIMARY_BLUE_1A: #196e8c;
  --BID_PRIMARY_BLUE_1B: #5e90a8;
  --BID_PRIMARY_BLUE_1C: #94b4c4;
  --BID_PRIMARY_BLUE_1D: #cbd8df;
  --BID_PRIMARY_BLUE_2A: #003e5a;
  --BID_PRIMARY_BLUE_2B: #00374e;
  --BID_PRIMARY_BLUE_2C: #002f43;
  --BID_PRIMARY_BLUE_2D: #002738; 

  --BID_PRIMARY_BLACK_1A: #605f59;
  --BID_PRIMARY_BLACK_1B: #878681;
  --BID_PRIMARY_BLACK_1C: #aeadab;
  --BID_PRIMARY_BLACK_1D: #d3d2d1;
  --BID_PRIMARY_BLACK_2A: #302f2f;
  --BID_PRIMARY_BLACK_2B: #2a2929;
  --BID_PRIMARY_BLACK_2C: #242323;
  --BID_PRIMARY_BLACK_2D: #1e1e1e;

  --BID_PRIMARY_CIAN_1A: #6fb8e5;
  --BID_PRIMARY_CIAN_1B: #93caeb;
  --BID_PRIMARY_CIAN_1C: #b7dbf2;
  --BID_PRIMARY_CIAN_1D: #dbedf8;
  --BID_PRIMARY_CIAN_2A: #3c85b2;
  --BID_PRIMARY_CIAN_2B: #35749b;
  --BID_PRIMARY_CIAN_2C: #2d6485;
  --BID_PRIMARY_CIAN_2D: #26536f;

  --BID_SECONDARY_YELLOW: #F4DB4E;
  --BID_SECONDARY_DARK_GREEN: #308144;
  --BID_SECONDARY_LIGHT_GREEN: #8dba38;
  --BID_SECONDARY_GRAY: #a6a6a8;

  --BID_SECONDARY_YELLOW_1A: #f6e271;
  --BID_SECONDARY_YELLOW_1B: #f8e995;
  --BID_SECONDARY_YELLOW_1C: #fbf1b8;
  --BID_SECONDARY_YELLOW_1D: #fdf8dc;
  --BID_SECONDARY_YELLOW_2A: #f6e271;
  --BID_SECONDARY_YELLOW_2B: #f9ec3a;
  --BID_SECONDARY_YELLOW_2C: #fbef60;
  --BID_SECONDARY_YELLOW_2D: #f9f076;
  --BID_SECONDARY_YELLOW_3A: #7a6e27;
  --BID_SECONDARY_YELLOW_3B: #92832f;
  --BID_SECONDARY_YELLOW_3C: #ab9937;
  --BID_SECONDARY_YELLOW_3D: #c3af3e;

  --BID_SECONDARY_DARK_GREEN_1A: #599a69;
  --BID_SECONDARY_DARK_GREEN_1B: #83b38f;
  --BID_SECONDARY_DARK_GREEN_1C: #accdb4;
  --BID_SECONDARY_DARK_GREEN_1D: #d6e6da;
  --BID_SECONDARY_DARK_GREEN_2A: #77ae74;
  --BID_SECONDARY_DARK_GREEN_2B: #4b894a;
  --BID_SECONDARY_DARK_GREEN_2C: #7cae5e;
  --BID_SECONDARY_DARK_GREEN_2D: #527f41;
  --BID_SECONDARY_DARK_GREEN_3A: #194122;
  --BID_SECONDARY_DARK_GREEN_3B: #1d4d29;
  --BID_SECONDARY_DARK_GREEN_3C: #225a30;
  --BID_SECONDARY_DARK_GREEN_3D: #266736;

  --BID_SECONDARY_LIGHT_GREEN_1A: #a4c860;
  --BID_SECONDARY_LIGHT_GREEN_1B: #bbd688;
  --BID_SECONDARY_LIGHT_GREEN_1C: #d1e3af;
  --BID_SECONDARY_LIGHT_GREEN_1D: #e8f1d7;
  --BID_SECONDARY_LIGHT_GREEN_2A: #acc34d;
  --BID_SECONDARY_LIGHT_GREEN_2B: #8db43d;
  --BID_SECONDARY_LIGHT_GREEN_2C: #75a93b;
  --BID_SECONDARY_LIGHT_GREEN_2D: #91b435;
  --BID_SECONDARY_LIGHT_GREEN_3A: #475d1c;
  --BID_SECONDARY_LIGHT_GREEN_3B: #557022;
  --BID_SECONDARY_LIGHT_GREEN_3C: #638227;
  --BID_SECONDARY_LIGHT_GREEN_3D: #71952d;

  --LOGO_BLUE       : #2b76c9;
  --LOGO_AQUA       : #06a8b2;
  --OVERALL_COLOR   : #377dff;
  --FISCAL_COLOR    : #2f5c97;
  --MACRO_COLOR     : #009DDC;
  --INSTIT_COLOR    : #262C31;
  --BLUE_COLOR      : #377dff;
  --LIGHTBLUE_COLOR : #f5f8fb;
  --INDIGO_COLOR    : #6610f2;
  --RED_COLOR       : #E84A5F;
  --ORANGE_COLOR    : #fd7e14;
  --CREAM_COLOR     : #EEA47F;
  --GOLD_COLOR      : #DC9C34;
  --YELLOW1_COLOR   : #F1BC5F;
  --GREEN_COLOR     : #28a745;
  --AQUA_COLOR      : #00ADA5;
  --TEAL_COLOR      : #00c9a7;
  --CYAN_COLOR      : #00c9db;
  --GRAY_COLOR      : #8c98a4;
  --GRAYDARK_COLOR  : #71869d;
  --PRIMARY_COLOR   : #377dff;
  --SECONDARY_COLOR : #71869d;
  --BLUE_TAIL_COLOR : #677788;
  --WHITE_COLOR     : #FFFFFF;
  --MEDVIOLET_COLOR : #cc0288;
  --VIDEO_GREENLIGHT: #BCEAEE;

  --GRADIENT_MAGENTA: linear-gradient(130deg, #CB058C, #9E0488);
  --GRADIENT_MAGENTA_D: linear-gradient(130deg, #af057a, #850371);
  --BOX_SHADOW_1    : 0px 2px 9px 0px rgba(0,0,0,0.1);
  --BID_GRADIENT    : background-image: linear-gradient(130deg, #2f5c97 60%, transparent);
  --BID_VIOLET_GRAD : background-image: linear-gradient(130deg, #CB058C, #9E0488);
  --LOGO_GRADIENT   : background-image: linear-gradient(92deg, rgb(47,92,151), rgb(0,173,165));
  --COLOR_HEADER    : #302f2f; /* #303950; */

  --BID_GRADIENT_PRIMARY_1_45: linear-gradient(45deg, #444444,var(--BID_COLOR_D), var(--BID_COLOR));
  --BID_GRADIENT_PRIMARY_1_130: linear-gradient(130deg, #444444,var(--BID_COLOR_D), var(--BID_COLOR));
  --BID_GRADIENT_PRIMARY_1R_45: linear-gradient(45deg, #444444,var(--BID_COLOR), var(--BID_COLOR_D));
  --BID_GRADIENT_PRIMARY_1R_130: linear-gradient(130deg, #444444,var(--BID_COLOR), var(--BID_COLOR_D));
  --BID_GRADIENT_PRIMARY_2_45: linear-gradient(45deg, var(--BID_PRIMARY_CIAN), var(--BID_PRIMARY_BLUE));
  --BID_GRADIENT_PRIMARY_2_130: linear-gradient(130deg, var(--BID_PRIMARY_CIAN), var(--BID_PRIMARY_BLUE));
  --BID_GRADIENT_PRIMARY_2R_45: linear-gradient(45deg, var(--BID_PRIMARY_BLUE), var(--BID_PRIMARY_CIAN));
  --BID_GRADIENT_PRIMARY_2R_130: linear-gradient(130deg, var(--BID_PRIMARY_BLUE), var(--BID_PRIMARY_CIAN));
  --BID_GRADIENT_PRIMARY_2D_45: linear-gradient(45deg, var(--BID_PRIMARY_CIAN_2A), var(--BID_PRIMARY_BLUE_2A));
  --BID_GRADIENT_PRIMARY_2D_130: linear-gradient(130deg, var(--BID_PRIMARY_CIAN_2A), var(--BID_PRIMARY_BLUE_2A));
}


.noselect {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.hide{
  display: none !important;
}


/* Alertify Styles */
.ajs-footer{
  border-top: none !important;
  padding: 0.3rem 1rem !important;
}

.ajs-header{
  border-bottom: none !important;
}
.ajs-content{
  color: #333;
}
.btn-alert{
  background: transparent;
  border: 0;
  color: var(--GRAYDARK_COLOR);
  font-weight: 900;
  font-size: 1.2rem;
  letter-spacing: 0.1rem;
  opacity: 1;
}
.btn-alert.ok{
  color: var(--BID_COLOR_D);
}
.btn-alert.cancel{
  color: var(--RED_COLOR);
}
.btn-alert:hover{
  opacity: 0.7;
}
/* ----------------- */

/* DJANGO CORRECTION OF ERROR RESPONSIVE RATIO */
.dj-dash-correction div.embed-responsive{
  height: calc(100vh - 75px) !important;
}

@media only screen and (max-width: 768px) {
  .dj-dash-correction div.embed-responsive{
    height: calc(100vh - 150px) !important;
  }
}

/* ------------- */


main{
  padding: 75px 10px 50px 10px !important;
}

.remove_outline{ outline: none; }

.remove-btn-outline:active, .remove-btn-outline:focus{
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

.no-border{ border: none !important;}

.disabled { pointer-events: none !important; }

.mg-5 {margin: 5px !important;}
.mg-10 {margin: 10px !important;}
.mg-15 {margin: 15px !important;}
.mg-20 {margin: 20px !important;}

.mgt-5 {margin-top: 5px !important;}
.mgt-10 {margin-top: 10px !important;}
.mgt-15 {margin-top: 15px !important;}
.mgt-20 {margin-top: 20px !important;}

.mgb-5 {margin-bottom: 5px !important;}
.mgb-10 {margin-bottom: 10px !important;}
.mgb-15 {margin-bottom: 15px !important;}
.mgb-20 {margin-bottom: 20px !important;}
.mgb-30 {margin-bottom: 30px !important;}
.mgb-40 {margin-bottom: 40px !important;}
.mgb-50 {margin-bottom: 50px !important;}

.mgl-5 {margin-left: 5px !important;}
.mgl-10 {margin-left: 10px !important;}
.mgl-15 {margin-left: 15px !important;}
.mgl-20 {margin-left: 20px !important;}

.mgr-5 {margin-right: 5px !important;}
.mgr-10 {margin-right: 10px !important;}
.mgr-15 {margin-right: 15px !important;}
.mgr-20 {margin-right: 20px !important;}

.mxw-100 {max-width: 100px; width: 100%;}
.mxw-150 {max-width: 150px; width: 100%;}
.mxw-200 {max-width: 200px; width: 100%;}
.mxw-250 {max-width: 250px; width: 100%;}
.mxw-300 {max-width: 300px; width: 100%;}
.mxw-350 {max-width: 350px; width: 100%;}
.mxw-400 {max-width: 400px; width: 100%;}
.mxw-500 {max-width: 500px; width: 100%;}
.mxw-600 {max-width: 600px; width: 100%;}
.mxw-700 {max-width: 700px; width: 100%;}
.mxw-750 {max-width: 750px; width: 100%;}
.mxw-800 {max-width: 800px; width: 100%;}
.mxw-850 {max-width: 850px; width: 100%;}
.mxw-900 {max-width: 900px; width: 100%;}
.mxw-950 {max-width: 950px; width: 100%;}
.mxw-1000 {max-width: 1000px; width: 100%;}
.mxw-1100 {max-width: 1100px; width: 100%;}
.mxw-1200 {max-width: 1200px; width: 100%;}
.mxw-1300 {max-width: 1300px; width: 100%;}
.mxw-1400 {max-width: 1400px; width: 100%;}
.mxw-1500 {max-width: 1500px; width: 100%;}

.mxw-60p {max-width: 60%; width: 100%;}
.mxw-65p {max-width: 65%; width: 100%;}
.mxw-75p {max-width: 75%; width: 100%;}
.mxw-80p {max-width: 80%; width: 100%;}
.mxw-85p {max-width: 85%; width: 100%;}
.mxw-90p {max-width: 90%; width: 100%;}
.mxw-95p {max-width: 95%; width: 100%;}

.minw-100 {min-width: 100px;}
.minw-200 {min-width: 200px;}
.minw-300 {min-width: 300px;}
.minw-400 {min-width: 400px;}
.minw-500 {min-width: 500px;}
.minw-600 {min-width: 600px;}
.minw-700 {min-width: 700px;}
.minw-750 {min-width: 750px;}
.minw-800 {min-width: 800px;}
.minw-850 {min-width: 850px;}
.minw-900 {min-width: 900px;}
.minw-950 {min-width: 950px;}
.minw-1000 {min-width: 1000px;}

.text-600{ font-size: 6rem; }
.text-500{ font-size: 5rem; }
.text-500-rsp{ font-size: min(11vw, 5rem); }
.text-400{ font-size: 4rem; }
.text-300{ font-size: 3rem; }
.text-300-rsp{ font-size: min(10vw, 3rem); }
.text-250{ font-size: 2.5rem; }
.text-250-rsp{ font-size: min(7vw, 2.5rem); }
.text-200{ font-size: 2rem; }
.text-200-rsp{ font-size: min(6vw, 2rem); }
.text-150{ font-size: 1.5rem; }
.text-145{ font-size: 1.45rem; }
.text-140{ font-size: 1.4rem; }
.text-135{ font-size: 1.35rem; }
.text-130{ font-size: 1.3rem; }
.text-125{ font-size: 1.25rem; }
.text-120-rsp{ font-size: min(6vw, 1.2rem); }
.text-120{ font-size: 1.2rem; }
.text-115{ font-size: 1.15rem; }
.text-110{ font-size: 1.1rem; }
.text-105{ font-size: 1.05rem; }
.text-100-rsp{ font-size: min(6vw, 1rem); }
.text-100{ font-size: 1rem; }
.text-95{ font-size: 0.95rem; }
.text-90{ font-size: 0.9rem; }
.text-85{ font-size: 0.85rem; }
.text-80{ font-size: 0.8rem; }
.text-75{ font-size: 0.75rem; }
.text-70{ font-size: 0.7rem; }
.text-65{ font-size: 0.65rem; }
.text-60{ font-size: 0.6rem; }
.text-55{ font-size: 0.55rem; }
.text-50{ font-size: 0.5rem; }

.lineh-1{line-height: 1.1rem;}
.lineh-2{line-height: 1.2rem;}
.lineh-3{line-height: 1.3rem;}
.lineh-4{line-height: 1.4rem;}
.lineh-5{line-height: 1.5rem;}
.lineh-6{line-height: 1.6rem;}
.lineh-7{line-height: 1.7rem;}
.lineh-8{line-height: 1.8rem;}
.lineh-9{line-height: 1.9rem;}

.lettspace-0{ letter-spacing: 1px; }
.lettspace-1{ letter-spacing: 3px; }
.lettspace-2{ letter-spacing: 5px; }

.rounded-circle{border-radius: 50% !important;}
.rounded-1{border-radius: 1rem !important;}
.rounded-2{border-radius: 2rem !important;}
.rounded-3{border-radius: 3rem !important;}

.font-weight-100{font-weight: 100 !important;}
.font-weight-200{font-weight: 200 !important;}
.font-weight-300{font-weight: 300 !important;}
.font-weight-400{font-weight: 400 !important;}
.font-weight-500{font-weight: 500 !important;}
.font-weight-600{font-weight: 600 !important;}
.font-weight-700{font-weight: 700 !important;}
.font-weight-800{font-weight: 800 !important;}
.font-weight-900{font-weight: 900 !important;}

.img-500-rsp{width: min(100%, 500px);}

.link-bid{ color: var(--BID_COLOR); cursor: pointer; text-decoration: underline; }
.link-bid:hover{ color: var(--BID_COLOR_D);}

.border-bottom-strong{ border-bottom: 2px solid var(--COLOR_HEADER)!important;}
.border-bottom-light{ border-bottom: 2px solid #d2d5df!important; }

.full-height { min-height: 100vh; }

.bg_bid_sec{ background: var(--BID_COLOR_SEC) !important;}
.bg_bid_ter{ background: var(--BID_COLOR_TER) !important;}
.bg_bid_violet_grad{ background: var(--GRADIENT_MAGENTA) !important;}
.bg_bid_lighter{ background: var(--BID_LIGHTER) !important;}
.bg_bid_medium{ background: var(--BID_COLOR) !important; }
.bg_bid_soft{ background: var(--BID_SOFT) !important; }
.bg_lightgray{ background-color:rgb(243, 244, 245) !important;}
.bg_lightblue{ background:var(--LIGHTBLUE_COLOR) !important;}
.bg_creamy{ background: var(--CREAM_COLOR) !important; }
.bg_red{ background: var(--RED_COLOR) !important; }
.bg_gold{ background: var(--GOLD_COLOR) !important; }
.bg_yellow{ background: var(--YELLOW1_COLOR) !important; }
.bg_bluetail{ background: var(--BLUE_TAIL_COLOR) !important; }
.bg_blue1{ background-color: #314662 !important; }
.bg_white{ background: #FFFFFF !important; }
.bg_dark3{ background: #333333 !important; }
.bg_dark4{ background: #444444 !important; }
.bg_dark5{ background: #555555 !important; }
.bg_dark6{ background: #666666 !important; }
.bg_softgray{ background: #FAFAFA !important;}
.bg_aqua{ background: var(--LOGO_AQUA) !important;}
.bg_logo_blue{ background: var(--LOGO_BLUE) !important;}
.bg_logo_aqua{ background: var(--LOGO_AQUA) !important;}
.bg_header{ background-image: linear-gradient(130deg, var(--BID_COLOR_D) 50%, transparent) !important;}
.bg_header_st { background: var(--BID_COLOR)  !important; } /* rgb(49 71 100) */
.bg_amchartsblue{ background: #303950 !important;}
.bg_transparent{ background: transparent !important;}
.blur-background{  backdrop-filter: blur(10px) !important; background: hsl(0deg 0% 85% / 65%) !important; }

.color_bid_lighter{color: var(--BID_LIGHTER) !important;}
.color_bid_medium{ color: var(--BID_COLOR) !important; }
.color_bid_soft{ color: var(--BID_SOFT) !important; }
.color_creamy{ color: var(--CREAM_COLOR) !important; }
.color_red{ color: var(--RED_COLOR) !important; }
.color_gold{ color: var(--GOLD_COLOR) !important; }
.color_yellow{ color: var(--YELLOW1_COLOR) !important; }
.color_bluetail{ color: var(--BLUE_TAIL_COLOR) !important; }
.color_header{ color: var(--COLOR_HEADER) !important; }
.color_white{ color: #FFFFFF !important; }
.color_dark3{ color: #333333 !important; }
.color_dark4{ color: #444444 !important; }
.color_dark5{ color: #555555 !important; }
.color_dark6{ color: #666666 !important; }
.color_aqua{ color: var(--LOGO_AQUA) !important; }
.color_logo_blue{ color: var(--LOGO_BLUE) !important; }
.color_logo_aqua{ color: var(--LOGO_AQUA)  !important; }
.color_bid_sec{ color: var(--BID_COLOR_SEC) !important; }
.color_bid_ter{ color: var(--BID_COLOR_TER) !important; }
.color_bid_cua{ color: #aa0573 !important; }

.color_bid_primary_blue { color: var(--BID_PRIMARY_BLUE) !important; }
.color_bid_primary_black { color: var(--BID_PRIMARY_BLACK) !important; }
.color_bid_primary_cian { color: var(--BID_PRIMARY_CIAN) !important; }
.color_bid_primary_blue_1A { color: var(--BID_PRIMARY_BLUE_1A) !important };
.color_bid_primary_blue_1B { color: var(--BID_PRIMARY_BLUE_1B) !important };
.color_bid_primary_blue_1C { color: var(--BID_PRIMARY_BLUE_1C) !important };
.color_bid_primary_blue_1D { color: var(--BID_PRIMARY_BLUE_1D) !important };
.color_bid_primary_blue_2A { color: var(--BID_PRIMARY_BLUE_2A) !important };
.color_bid_primary_blue_2B { color: var(--BID_PRIMARY_BLUE_2B) !important };
.color_bid_primary_blue_2C { color: var(--BID_PRIMARY_BLUE_2C) !important };
.color_bid_primary_blue_2D { color: var(--BID_PRIMARY_BLUE_2D) !important };
.color_bid_primary_black_1A { color: var(--BID_PRIMARY_BLACK_1A) !important };
.color_bid_primary_black_1B { color: var(--BID_PRIMARY_BLACK_1B) !important };
.color_bid_primary_black_1C { color: var(--BID_PRIMARY_BLACK_1C) !important };
.color_bid_primary_black_1D { color: var(--BID_PRIMARY_BLACK_1D) !important };
.color_bid_primary_black_2A { color: var(--BID_PRIMARY_BLACK_2A) !important };
.color_bid_primary_black_2B { color: var(--BID_PRIMARY_BLACK_2B) !important };
.color_bid_primary_black_2C { color: var(--BID_PRIMARY_BLACK_2C) !important };
.color_bid_primary_black_2D { color: var(--BID_PRIMARY_BLACK_2D) !important };
.color_bid_primary_cian_1A { color: var(--BID_PRIMARY_CIAN_1A) !important };
.color_bid_primary_cian_1B { color: var(--BID_PRIMARY_CIAN_1B) !important };
.color_bid_primary_cian_1C { color: var(--BID_PRIMARY_CIAN_1C) !important };
.color_bid_primary_cian_1D { color: var(--BID_PRIMARY_CIAN_1D) !important };
.color_bid_primary_cian_2A { color: var(--BID_PRIMARY_CIAN_2A) !important };
.color_bid_primary_cian_2B { color: var(--BID_PRIMARY_CIAN_2B) !important };
.color_bid_primary_cian_2C { color: var(--BID_PRIMARY_CIAN_2C) !important };
.color_bid_primary_cian_2D { color: var(--BID_PRIMARY_CIAN_2D) !important };

.bg_bid_primary_blue { background: var(--BID_PRIMARY_BLUE) !important; }
.bg_bid_primary_black { background: var(--BID_PRIMARY_BLACK) !important; }
.bg_bid_primary_cian { background: var(--BID_PRIMARY_CIAN) !important; }
.bg_bid_primary_blue_1A { background: var(--BID_PRIMARY_BLUE_1A) !important };
.bg_bid_primary_blue_1B { background: var(--BID_PRIMARY_BLUE_1B) !important };
.bg_bid_primary_blue_1C { background: var(--BID_PRIMARY_BLUE_1C) !important };
.bg_bid_primary_blue_1D { background: var(--BID_PRIMARY_BLUE_1D) !important };
.bg_bid_primary_blue_2A { background: var(--BID_PRIMARY_BLUE_2A) !important };
.bg_bid_primary_blue_2B { background: var(--BID_PRIMARY_BLUE_2B) !important };
.bg_bid_primary_blue_2C { background: var(--BID_PRIMARY_BLUE_2C) !important };
.bg_bid_primary_blue_2D { background: var(--BID_PRIMARY_BLUE_2D) !important };
.bg_bid_primary_black_1A { background: var(--BID_PRIMARY_BLACK_1A) !important };
.bg_bid_primary_black_1B { background: var(--BID_PRIMARY_BLACK_1B) !important };
.bg_bid_primary_black_1C { background: var(--BID_PRIMARY_BLACK_1C) !important };
.bg_bid_primary_black_1D { background: var(--BID_PRIMARY_BLACK_1D) !important };
.bg_bid_primary_black_2A { background: var(--BID_PRIMARY_BLACK_2A) !important };
.bg_bid_primary_black_2B { background: var(--BID_PRIMARY_BLACK_2B) !important };
.bg_bid_primary_black_2C { background: var(--BID_PRIMARY_BLACK_2C) !important };
.bg_bid_primary_black_2D { background: var(--BID_PRIMARY_BLACK_2D) !important };
.bg_bid_primary_cian_1A { background: var(--BID_PRIMARY_CIAN_1A) !important };
.bg_bid_primary_cian_1B { background: var(--BID_PRIMARY_CIAN_1B) !important };
.bg_bid_primary_cian_1C { background: var(--BID_PRIMARY_CIAN_1C) !important };
.bg_bid_primary_cian_1D { background: var(--BID_PRIMARY_CIAN_1D) !important };
.bg_bid_primary_cian_2A { background: var(--BID_PRIMARY_CIAN_2A) !important };
.bg_bid_primary_cian_2B { background: var(--BID_PRIMARY_CIAN_2B) !important };
.bg_bid_primary_cian_2C { background: var(--BID_PRIMARY_CIAN_2C) !important };
.bg_bid_primary_cian_2D { background: var(--BID_PRIMARY_CIAN_2D) !important };

/* TRANSITION EFFECTS  */

.effects-rotate90-hover{
  transform: rotate(0deg);
  transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.effects-rotate90-hover:hover{
  transform: rotate(90deg);
}

/* END OF TRANSITION EFFECTS */

/* Bootstrap changes */

.alert-info {
  color: #0c5460;
  background-color: var(--BID_PRIMARY_CIAN_1D);
  border-color: var(--BID_PRIMARY_CIAN_1D);
}

.modal-title {
  margin-bottom: 0;
  line-height: 1.5;
  font-weight: 800;
}

/* ***********  **/

.title{
  font-weight: 600;
  font-size: 2.6rem;
  letter-spacing: 3px;
  text-align: center;
  color: var(--BID_COLOR);
  text-transform: uppercase;
}

.subtitle {
  font-weight: 400;
  font-size: 1.5rem;
  letter-spacing: 3px;
  text-align: center;
  color: var(--BID_COLOR);
  text-transform: uppercase;
}

.description {
  font-size: 1rem;
  color: var(--COLOR_HEADER);
  letter-spacing: 1px;
  text-align: justify;
}

footer{
  font-size: 0.75rem;
  color: var(--SECONDARY_COLOR);
  letter-spacing: 1px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.title-top {
  font-weight: 400;
  font-size: 1.3rem;
  letter-spacing: 3px;
  color: var(--BID_COLOR);
  text-transform: uppercase;
}

.section-headline {
  font-size: 2.3rem;
  line-height: 1.5;
  font-weight: 300;
  letter-spacing: .02em;
  margin-bottom: 40px;
  color: var(--BID_COLOR);
}

.divider{
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.divider::before {
  margin-right: 1.5rem;
}

.divider::after, .divider::before {
  -ms-flex: 1 1 0%;
  flex: 1 1 0%;
  border-top: .0625rem solid #e7eaf3;
  content: "";
  margin-top: .0625rem;
}



/* NOTY (NOTIFICATION FOR FORMS AND OTHER STUFF) */

.noty{
  width: 100%;
  padding: 0;
  color: #252525;
  font-size: 1rem;
  background-color: #E2E3E5;
  opacity: 0;
  transition: opacity 250ms ease-in, max-height 0ms ease-in 250ms, padding 0ms ease-in 250ms;
  border-radius: 0.25rem;
  max-height: 0;
}

.noty.show{
  opacity: 1;
  padding: 1rem;
  max-height: 1000px;
  transition-delay: 0ms;
}

.noty.noty-success{
  color: #435e49; 
  background-color: #D4EDDA; 
}

.noty.noty-error{
  color: #65262e; 
  background-color: #e8939e; 
}

.noty.noty-warning{
  color: #746840; 
  background-color: #FFF3CD; 
}


/* ---------------------- */

.txtarea-mono{
  height: 150px !important;
  font-family: monospace !important;
  font-size: 0.81rem !important;
  line-height: 16px !important;
}

.video-container{ 
  position: fixed;
  inset: 0;
  background: rgba(0,0,0, 0.3);
  z-index: 1040;
  opacity: 1;
  transition: all .5s ease;
  backdrop-filter: blur(10px);
  background: hsl(0deg 0% 85% / 65%);
}

.video-wrapper {
  background: white;
  min-width: 100px;
  width: 95%;
  max-width: 1000px;
  height: 90%;
  max-height: 500px;
  border-radius: 10px;
  position: fixed;
  inset: 0;
  margin: auto;
  box-shadow: var(--BOX_SHADOW_1);
}

.video-wrapper.responsive{
  height: fit-content !important;
  max-height: 95% !important;
  overflow-y: auto !important;
}

.videocontainer{  
  overflow: hidden;
  position: absolute;
  width: 100%;
  min-height: calc(100vh - 47px);
  left: 40px;
  top: 48px;
}

.vc_nomargin{
  left: 0 !important;
}


.videowrapper{
  margin: 0 auto;
  position: relative;
}

.video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  border-radius: 10px;
}

.videocontainer-content {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  width: 100%;
  height: fit-content;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 15px 20px;
  max-width: 1000px;
  transform: translate(-50%, -50%);
  transition: all 0.75s ease;
  opacity: 1;
}

.playing{
  opacity: 0 !important;
}

.video-controlers{
  position: absolute;
  top: 10px;
  left: 0;
  display: flex;
  width: calc(100% - 35px);
  align-items: center;
  justify-content: flex-end;
  z-index: 2;
  padding: 0px 7px;
}

.content-text > h1{
  font-weight: 800;
  line-height: 40px;
  color: var(--BID_COLOR) !important;
  letter-spacing: 3px;
}

.content-text > h5{
  font-weight: 400;
  font-size: 1.1rem;
  margin: 0 auto 20px auto;
  color: #6c757d !important;
}

.content-text {
  display: block;
}

.content-btns {
  display: flex;
  align-items: center;
  justify-content: center;
}

.content-btns > button, .content-btns > a {
  margin: 0 10px;
}

#video-wave{
  position: absolute;
  bottom: 0;
  left: 0;
  transition: all 0.75s ease;
  opacity: 1;
}

@media only screen and (max-width: 768px) {
  .videocontainer{
    /* position: relative;
    top: 10px !important;
    transform: translateY(0%);
    padding: 0 !important;
    margin-left: 0 !important; */

    left: 0;
    top: 90px;
    min-height: calc(100vh - 140px);
  }  
}

@media only screen and (max-width: 468px) {
  #video-wave{
    animation-name: animate_wave;
    animation-duration: 5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
  }
  .video-controlers{
    width: 100% !important;
  }
}

/* ------- Sobreescribir Estilos Originales de Plotly------ */

.sidebar, .nav-link.active{
  color: var(--BID_COLOR) !important;
}

/* :::::::::::: SCROLL ::::::::::::::: */

::-webkit-scrollbar {
  width: 5px;
  height: 2.5px;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
  -webkit-border-radius: 30px;
  border-radius: 30px;
}
::-webkit-scrollbar-thumb {
  -webkit-border-radius: 30px;
  border-radius: 30px;
  background: var(--BID_COLOR);
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
  box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
::-webkit-scrollbar-thumb:window-inactive {
  background: var(--BID_COLOR); 
}

.cursor-pointer{
  cursor: pointer !important;
}

.page-item.active .page-link{
  background-color: var(--BID_COLOR) !important;
  border-color: var(--BID_COLOR) !important;
}

.page-link{
  color: var(--BID_COLOR);
}

a.bid_link{
  color: var(--BID_COLOR_SEC) !important;
}
a.bid_link:hover{
  color:  var(--BID_COLOR_SEC_D)  !important;
}


.btn_bid_primary_cian,
.btn_bid_primary_blue,
.btn_bid_primary_black,
.btn_bid_primary_1, 
.btn_bid_primary_2, 
.btn_bid_primary_3 {
  color: #ffffff;
  transition: 0.25s all ease-in;
  border: none;
  opacity: 1;
}

.btn_bid_primary_cian:hover,
.btn_bid_primary_blue:hover,
.btn_bid_primary_black:hover,
.btn_bid_primary_1:hover, 
.btn_bid_primary_2:hover, 
.btn_bid_primary_3:hover {
  color: #ffffff;
  opacity: 0.85;
}

.btn_bid_primary_cian,
.btn_bid_primary_1{
  background: var(--BID_PRIMARY_CIAN);
}

.btn_bid_primary_blue,
.btn_bid_primary_2{
  background: var(--BID_PRIMARY_BLUE);
}

.btn_bid_primary_black,
.btn_bid_primary_3{
  background: var(--BID_PRIMARY_BLACK);
}


.btn_bid_primary_cian_outline,
.btn_bid_primary_blue_outline,
.btn_bid_primary_black_outline,
.btn_bid_primary_1_outline,
.btn_bid_primary_2_outline,
.btn_bid_primary_3_outline {
  background: transparent;
  transition: 0.25s all ease-in;
}

.btn_bid_primary_cian_outline, 
.btn_bid_primary_1_outline{
  border: 2px solid var(--BID_PRIMARY_CIAN);
  color: var(--BID_PRIMARY_CIAN);
}

.btn_bid_primary_blue_outline, 
.btn_bid_primary_2_outline{
  border: 2px solid var(--BID_PRIMARY_BLUE);
  color: var(--BID_PRIMARY_BLUE);
}

.btn_bid_primary_black_outline, 
.btn_bid_primary_3_outline{
  border: 2px solid var(--BID_PRIMARY_BLACK);
  color: var(--BID_PRIMARY_BLACK);
}

.btn_bid_primary_cian_outline:hover,
.btn_bid_primary_1_outline:hover {
  color: #FFFFFF;
  background: var(--BID_PRIMARY_CIAN);
  border-color: var(--BID_PRIMARY_CIAN);
}

.btn_bid_primary_blue_outline:hover,
.btn_bid_primary_2_outline:hover {
  color: #FFFFFF;
  background: var(--BID_PRIMARY_BLUE);
  border-color: var(--BID_PRIMARY_BLUE);
}

.btn_bid_primary_black_outline:hover,
.btn_bid_primary_3_outline:hover {
  color: #FFFFFF;
  background: var(--BID_PRIMARY_BLACK);
  border-color: var(--BID_PRIMARY_BLACK);
}

.btn_bid_primary_gradient_1 {
  border: none;
  color: #FFFFFF;
  background: linear-gradient(45deg, var(--BID_PRIMARY_CIAN), var(--BID_PRIMARY_BLUE));
  transition: 0.5s all ease-in;
}

.btn_bid_primary_gradient_1:hover {
  color: #FFFFFF;
  background: linear-gradient(45deg, var(--BID_PRIMARY_BLUE), var(--BID_PRIMARY_CIAN));
}

.btn_bid{ background: var(--BID_COLOR); color: #ffffff; transition: 0.5s ease-in; opacity: 1;}
.btn_bid:hover{ opacity: 0.8; color: #ffffff;}

.btn_bid_sec{ background: var(--BID_COLOR_SEC); color: #ffffff; transition: 0.5s ease-in; opacity: 1;}
.btn_bid_sec:hover{ opacity: 0.8; color: #ffffff;}

.btn_bid_ter{ background: var(--BID_COLOR_TER); color: #ffffff; transition: 0.5s ease-in; opacity: 1;}
.btn_bid_ter:hover{ opacity: 0.8; color: #ffffff;}

.btn_bid_violet_gradient{ background: var(--GRADIENT_MAGENTA); color: #ffffff; transition: 0.5s ease-in;}
.btn_bid_violet_gradient:hover{ background: linear-gradient(130deg, #CB058C, #CB058C); color: #ffffff; }

.btn_bid_violet_gradient-outline{ border: 3px solid #9E0488; color: #9E0488; transition: 0.5s ease-in;}
.btn_bid_violet_gradient-outline:hover{ border: 3px solid transparent; background: var(--GRADIENT_MAGENTA); color: #ffffff; transition: 0.5s ease-in;}

.btn-bg_logo_aqua{
  background: var(--LOGO_AQUA);
  color: #ffffff;
}

.btn-bg_logo_aqua:hover{
  background: var(--TEAL_COLOR);
  color: #ffffff;
}

.btn-bg_logo_aqua-outline{
  border-color: var(--LOGO_AQUA) !important;
  background: transparent;
  color: var(--LOGO_AQUA);
}

.btn-bg_logo_aqua-outline:hover{
  background: var(--LOGO_AQUA) !important;
  color: #ffffff;
}

.btn-bg_bid_medium{
  background: var(--BID_COLOR);
  color: #ffffff;
}

.btn-bg_bid_medium:hover{
  background: var(--BID_COLOR_L);
  color: #ffffff;
}

.btn-bg_bid_medium-outline{
  border-color: var(--BID_COLOR) !important;
  background: #ffffff;
  color: var(--BID_COLOR);
}

.btn-bg_bid_medium-outline:hover{
  background: var(--BID_COLOR) !important;
  color: #ffffff;
}

.btn-bg_bid_light{
  background: var(--BLUE_TAIL_COLOR);
  color: #ffffff;
}

.btn-bg_bid_light:hover{
  background: var(--GRAY_COLOR);
  color: #ffffff;
}

.btn-bg_bid_yellow{
  background: var(--YELLOW1_COLOR);
  color: var(--BID_COLOR);
}

.btn-bg_bid_yellow:hover{
  background: var(--YELLOW1_COLOR);
  color: #ffffff;
}

.btn-bg_bid_creamy{
  background: var(--CREAM_COLOR);
  color: var(--BID_COLOR);
}

.btn-bg_bid_creamy:hover{
  background: var(--CREAM_COLOR);
  color: #ffffff;
}

.btn-bg_bid_aqua{
  background: var(--AQUA_COLOR);
  color: #ffffff;
}

.btn-bg_bid_aqua:hover{
  background: var(--TEAL_COLOR);
  color: #ffffff;
}

.btn-bg_bid_red{
  background: var(--RED_COLOR);
  color: #ffffff;
  opacity: 1;
}

.btn-bg_bid_red:hover{
  background: var(--RED_COLOR);
  color: #ffffff;
  opacity: 0.9;
}

.btn-bg_blue_train{
  background: #5E81F4;
  color: #ffffff;
  opacity: 1;
}

.btn-bg_blue_train:hover{
  background: #4263cf;
  color: #ffffff;
  opacity: 0.9;
}


.color_bid_medium{
  color: var(--BID_COLOR) !important;
}

.btn-bg_bid_lighter{
  background: var(--BID_LIGHTER) !important;
  color: #ffffff;
}

.btn-controler{
  font-size: 1rem;
  background: transparent;
  color: rgba(166, 166, 166, 0.6);
  outline: none;
  border: none !important;
  transition: all 0.5s ease-in;
}

.btn-controler:hover{
  color: #333333;
}

.btn-controler:active, .btn-controler:focus{
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

.control-overexpansion{
  max-width: 1500px !important;
  margin: auto;
}

.input-file { cursor: pointer;}

input[type="text"],
input[type="email"],
input[type="password"] {
  border-bottom: 1px solid #3333;
}

.logo_img{max-width: 170px;}

.navbar-logo-2{
  background-color: rgba(0, 0, 0, 0.10);
}

.navbar-toggler{
  border: 0;
  position: absolute !important;
  right: 10px;
  transform: translateY(-50%);
}

.only-top-border{
  border: none;
  border-top: 1px solid rgba(0,0,0,.125);
  border-radius: 0 !important;
}

.reset-border{
  border: none;
  border-radius: 0 !important;
}

table td {
  position: relative;
}

table td input[type=text],
table td input[type=password],
table td input[type=number],
table td select {
  position: absolute;
  display: block;
  top:0;
  left:0;
  margin: 0;
  height: 100%;
  width: 100%;
  border: none;
  box-sizing: border-box;
  background: transparent;
}

.label-input-top {
  font-weight: 400;
  color: rgb(103, 119, 136);
  letter-spacing: 1px;
  font-size: 0.87rem;
}

.form-control{
  border: .0625rem solid #e7eaf3 !important;
}
.form-control::placeholder{
  color: #999999;
}
.bootstrap-select>.dropdown-toggle{
  background: #ffffff;
  /* padding: 0.5rem 0.9rem; */
  color: #333333;
}
.bootstrap-select>.dropdown-toggle:focus{
  border: none;
}

.menu-scroll-container{
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  flex-wrap: wrap;
  /* margin-top: 20px; */
}

.menu-scroll-container > div:first-child{
  width: 20%;
  min-width: 200px;
  padding: 20px 0;
  background: white;
  border-radius: 10px;
  border: 1px solid #efefef;
  box-shadow: var(--BOX_SHADOW_1);
  margin-bottom: 20px;
}

.menu-scroll-container > .feather{
  margin: 0 1rem 0 0;
}

.menu-scroll-container > div:last-child{
  width: 80%;
  min-width: 300px;
  padding: 0 25px;
  height: calc(100vh - 235px);
  overflow: auto;
  position: relative;
}

@media only screen and (max-width: 768px) {

  /* For mobile phones: */
  .menu-scroll-container > div:last-child{
    width: 100%;
  }

  .menu-scroll-container > div:first-child{
    width: 100%;
    display: flex;
    flex-direction: row;
    overflow-y: hidden;
    overflow-x: auto;
    align-items: center;
  }

  .menu-scroll-container > div:first-child > a > span{
    margin: 0 !important;
  }

  .list-group-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.5rem 1rem !important;
  }

  .list-group-item.active {
    border: none !important;
  }
}

.list-group-item{
  border: none;
  letter-spacing: 0.1rem;
  text-transform: uppercase;
  padding: 0.8rem 2rem 0.8rem 1.5rem;
  font-size: 0.82rem;
  border-left: 4px solid var(--WHITE_COLOR);
  border-radius: 0 !important;
}
.list-group-item.active{
  background-color: var(--WHITE_COLOR);
  color: var(--BID_COLOR);
  border-left: 4px solid var(--BID_COLOR);
  font-weight: bold;
}

.horizontal-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  justify-content: flex-start;
}
.horizontal-list > .list-group-item {
  border: 1px solid #efefef;
  margin: 2px;
} 
.img-rounded{
  border-radius: 50%;
}

.card-shadow{
  box-shadow: 0 6px 12px rgba(140,152,164,.075);
  background-color: #fff;
  border: .0625rem solid rgba(231,234,243,.7);
}

.card-body-height::-webkit-scrollbar{
  width: .6125rem;
}
.card-body-height::-webkit-scrollbar-thumb {
  background-color: rgba(189,197,209,.6);
}

.cards-container{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  position: relative;
  padding: 1rem;
}

.card {
  flex-grow: 1;
  min-width: 20%;
  margin: 10px;
  padding: 15px 5px;
  cursor: default;
  position: relative;
  overflow: hidden;
}

.card.round {
  border-radius: 10px;
}

.card.clickable {
  cursor: pointer;
}

.card.silent{
  border: none !important;
  color: transparent !important;
  box-shadow: none !important;
}

@media only screen and (max-width: 768px) {
  .card.responsive_silent{
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}
.card-report {
  display: flex;
  flex-direction: column;
  border-radius: 10px;
  align-items: center;
}

.card-report > img {
  width: 80%;
  margin: 20px 5px;
  max-height: 200px;
  transition: all 0.3s ease-in-out;
  transform: scale(1);
  object-fit: contain;
}

.card-report.clickable:hover > img {
  transform: scale(1.07);
}

.map-container{
  opacity: 0.8;
  transform: scale(1);
  transition: all 0.3s ease-in-out;
}

.card-report:hover > .map-container{
  opacity: 1;
  transform: scale(1.07);
}

.card-report > p {
  font-weight: bold;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 1rem;
  text-align: center;
  padding: 10px 5px 5px 5px;
  margin: 0;
  box-sizing: border-box;
  color: var(--BID_COLOR);
}

.card-report > span {
  font-size: 0.75rem;
  color: var(--SECONDARY_COLOR);
  text-align: center;
  padding: 5px 20px;
}

.card-report > ul {
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  color: white;
  font-size: 1.15rem;
  justify-content: space-around;
  width: 100%;
  align-items: center;
  flex-direction: column;
  background: var(--BID_COLOR_D);
  border-top-right-radius: 7%;
  border-top-left-radius: 7%;
  font-weight: 900;
  align-content: center;
  overflow: hidden;
}

.card-report > ul > li {
  margin: 0;
  cursor: pointer;
  width: 100%;
  flex-grow: 1;
  vertical-align: middle;
  justify-content: center;
  display: flex;
  align-items: center;
}

.card-report > ul > li > a{
  text-decoration: none;
  color: inherit;
}

.card-report > ul > li:hover {
  background: #465e7e;
}

.menu-appear-bottom{
  transition: all 0.3s ease-in-out;
  position: absolute;
  bottom: -115px;
  left: 0;
  min-height: 50px;
  background: var(--BID_GRADIENT_PRIMARY_2_130) !important;
  /* background: var(--GRADIENT_MAGENTA) !important; */
}
.menu-appear-bottom > li:hover {
  /* background: var(--GRADIENT_MAGENTA_D) !important; */
  background: var(--BID_GRADIENT_PRIMARY_2D_130) !important;
}

.card-report:hover > .menu-appear-bottom{
  bottom: 0px;
  height: 70%;
}

.menu-appear-bottom.active{
  bottom: 0px;
  height: 70%;
}

.card-report:hover {
  text-decoration: none;
}

.card-report.clickable:hover > p {
  text-decoration: underline;
}

.dropdown-divider {
  height: 0;
  margin: .5rem 0;
  overflow: hidden;
  border-top: 1px solid #e7eaf3;
}

.menu-container {
  position: relative;
}

.menu-container > .feather{
  cursor: pointer;
}

.menu-popup {
  border: none;
  font-family: inherit; 
  z-index: 102;
  box-shadow: 0 10px 40px 10px rgba(140,152,164,.175);
  border-radius: .75rem;
  background: #FFFFFF;
  text-align: left;
  min-width: 200px;
  padding: 0.87rem 0 0.27rem 0;
  margin: .625rem 0 0;
  color: var(--SECONDARY_COLOR);
  max-width: 15rem;
  position: absolute;
  top: 100%;
  left: 0;
  transition: opacity 0.5s ease-in;
}

.menu-popup.openleft{
  left: auto !important;
  right: 0 !important;
}

.menu-popup.openmiddle{
  left: 50% !important;
  transform: translateX(-50%) !important;
}

.menu-popup.hidden{
  visibility: hidden;
  pointer-events: none;
  user-select: none;
  opacity: 0;
}

/* .menu-popup::before {
  content: "";
  position: absolute;
  width: 15px;
  height: 10px;
  background-color: #ffffff;
  transform: rotate(40deg);
  top: -5px;
  left: 20px;
  border-radius: 2px;
} */

.menu-popup > span {
  font-size: 0.75rem;
  font-weight: bold;
  padding-left: 1rem;
  text-transform: uppercase;
} 

.menu-popup a {
  color: inherit;
  text-decoration: none;
}

.menu-popup > ul {
  list-style-type: none;
  margin: 0.45rem 0;
  padding: 0;
  max-height: 200px;
  overflow-y: auto;
}

.menu-popup > ul > li {
  font-size: 0.85rem;
  padding: 0.357rem 1rem;
  cursor: pointer;
  font-weight: normal;
  text-transform: capitalize;
}

.menu-popup > ul  .icon_list {
  margin-right: 1rem;
  max-width: 0.91rem;
}

.menu-popup > ul > li:hover {
  background: rgba(0,0,0,.125);
  color: #333333;
}

.menu-popup > ul > li.active{
  background: rgba(55,125,255,.1);
  color: var(--BID_COLOR);
}



.menu_bottom{
  width: 100%;
  height: 75px;
  position: fixed;
  bottom: 0px;
  border-top: 1px solid #e1e1e1;
  box-shadow: 0px -5px 10px 0px rgb(0 0 0 / 7%);
  background-color: #ffffff;
  z-index: 100;
}

.menu_bottom.home{
  border-top: none !important;
  box-shadow: none !important;
  background-color: rgb(243, 244, 245) !important;
}

.menu_bottom>ul{
  list-style: none;
  padding: 5px 7px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  flex-wrap: nowrap;
  margin: auto;
  position: relative;
  height: inherit;
}

.menu_bottom>ul>li{
  align-self: center;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.menu_bottom>ul>li>a{
  color: var(--SECONDARY_COLOR);
  width: 25px;
  font-size: 10px;
}

.menu_bottom>ul>li>span{
  color: var(--SECONDARY_COLOR);
  font-size: 0.70rem;
  text-align: center;
  padding-top: 5px;
  line-height: 12px;
}

.menu_bottom .active > a,
.menu_bottom .active > span{
  color: var(--BID_COLOR_L) !important;
}

@media only screen and (min-width: 768px) {
  .menu_bottom{
    display: none;
  }
}


/*
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
  MOMENTICO LOADING FULL SCREEN
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/

.momentico-contaniner{
  background:  rgba(50,50,50,0.90);
  position: fixed;
  z-index: 5000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  justify-content: center;
  align-items: center;
  backdrop-filter: blur(10px);
}

.momentico-contaniner.show{
  display: flex !important;
}

.momentico-wrapper{
  max-width: 500px;
  max-height: 500px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.momentico-title{
  font-size: 1rem;
  color: white;
  letter-spacing: 1px;
  margin: 30px 0px;
  text-align: center;
  font-weight: bold;
  font-weight: lighter;
}

.momentico-figures{
  width: 80px;
  height: 100px;
  position: relative;
}

.momentico-figures>div{
  background: #2b76c9;
  border-radius: 3px;
  height: 25px;
  position: absolute; 
  animation-duration: 5s;
  /*animation-fill-mode: both;*/
  animation-iteration-count: infinite;	  
}

.momentico-figures>div:first-child{
  width: 25px;
  border-radius: 50%;
  top: 0;
  bottom: 0;
  margin-top: auto; 
  margin-bottom: auto;
  animation-name: animate_f_bar_1;
}

.momentico-figures>div:nth-child(2){
  width: 25px;
  border-radius: 50%;
  top: 0;
  bottom: 0;
  margin-top: auto; 
  margin-bottom: auto;
  left: 0;
  right: auto;
  animation-name: animate_f_bar_2;
}

.momentico-figures>div:nth-child(3){
  width: 25px;  
  border-radius: 50%;
  top: 0;
  bottom: 0;
  margin-top: auto; 
  margin-bottom: auto;
  animation-name: animate_f_bar_3;	  	  
  animation-delay: 0s;
}

.momentico-figures>div:nth-child(4){
  width: 25px;
  height: 0px;	  
  border-radius: 50%;
  bottom: 7px;
  left: 60px;
  margin-top: auto; 
  margin-bottom: auto;
  animation-name: animate_f_bar_4;	  	  
  animation-delay: 0s;
}

/* The animation code background-color: #2f5c97; background-color: #06a8b2; */
@keyframes animate_f_bar_1 {
  from   {opacity: 0;}
  to { 
  opacity: 0.9; 
  width: 100%; 
  transform: translateY(-30px); 
  border-radius: 5%; 
  background-image: linear-gradient(180deg, #06a8b2, #2b76c9);
  }
}

@keyframes animate_f_bar_2 {
  from   {opacity: 0;}
  to {opacity: 0.9; width: 65%;  border-radius: 5%;}
}


@keyframes animate_f_bar_3 {
  from   {opacity: 0;}
  to { 
  opacity: 0.9; 
  width: 45%; 
  transform: translateY(30px);  
  border-radius: 5%; 
  background-image: linear-gradient(180deg, #2b76c9, #cc0288);
  }
}

@keyframes animate_f_bar_4 {
  from   {opacity: 0;}
  to { 
  opacity: 0.9;
  height: 55px;
  border-radius: 5%; 
  background-image: linear-gradient(180deg, #2b76c9, #cc0288);
  }
}

@keyframes animate_wave {
  0%{
    height: 100px;
  }
  50%{
    height: 100vw;
  }
  100%{
    height: 100px;
  }
}


/*
END OF MOMENTICO
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/


/**
%%%%%%%%%%%%%%%%%%% CHECK MARK OK ANIMATION %%%%%%%%%%%%%%%%%%%%%%%%
 * Extracted from: SweetAlert
 * Modified by: Istiak Tridip
*/
 .success-checkmark {
  width: 80px;
  height: 115px;
  margin: 0 auto;
}
.success-checkmark .check-icon {
  width: 80px;
  height: 80px;
  position: relative;
  border-radius: 50%;
  box-sizing: content-box;
  border: 4px solid #4caf50;
}
.success-checkmark .check-icon::before {
  top: 3px;
  left: -2px;
  width: 30px;
  transform-origin: 100% 50%;
  border-radius: 100px 0 0 100px;
}
.success-checkmark .check-icon::after {
  top: 0;
  left: 30px;
  width: 60px;
  transform-origin: 0 50%;
  border-radius: 0 100px 100px 0;
  animation: rotate-circle 4.25s ease-in;
}
.success-checkmark .check-icon::before, .success-checkmark .check-icon::after {
  content: "";
  height: 100px;
  position: absolute;
  background: #ffffff;
  transform: rotate(-45deg);
}
.success-checkmark .check-icon .icon-line {
  height: 5px;
  background-color: #4caf50;
  display: block;
  border-radius: 2px;
  position: absolute;
  z-index: 10;
}
.success-checkmark .check-icon .icon-line.line-tip {
  top: 46px;
  left: 14px;
  width: 25px;
  transform: rotate(45deg);
  animation: icon-line-tip 0.75s;
}
.success-checkmark .check-icon .icon-line.line-long {
  top: 38px;
  right: 8px;
  width: 47px;
  transform: rotate(-45deg);
  animation: icon-line-long 0.75s;
}
.success-checkmark .check-icon .icon-circle {
  top: -4px;
  left: -4px;
  z-index: 10;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  position: absolute;
  box-sizing: content-box;
  border: 4px solid rgba(76, 175, 80, 0.5);
}
.success-checkmark .check-icon .icon-fix {
  top: 8px;
  width: 5px;
  left: 26px;
  z-index: 1;
  height: 85px;
  position: absolute;
  transform: rotate(-45deg);
  background-color: #ffffff;
}

@keyframes rotate-circle {
  0% {
    transform: rotate(-45deg);
  }
  5% {
    transform: rotate(-45deg);
  }
  12% {
    transform: rotate(-405deg);
  }
  100% {
    transform: rotate(-405deg);
  }
}
@keyframes icon-line-tip {
  0% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }
  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }
  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}
@keyframes icon-line-long {
  0% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  84% {
    width: 55px;
    right: 0px;
    top: 35px;
  }
  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}
/*
%%%%%%%%%%%%%%%% END OF CHECKMARK ANIMATION %%%%%%%%%%%%%%%%%%%%%%
*/

#reportModelResultsFromJS{
  display: block;
  border-top: 1px solid #efefef;
  padding-top: 5px !important;
}


#mapImgCountry{
  max-height: 150px;
  margin-bottom: 20px;
}

@media only screen and (max-width: 768px) {
  #mapImgCountry{
    display: none !important;
  }
}

/*
TOOLBAR
*/

.panel-card{
  -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 8%), 0 5px 26px 0 rgb(67 94 131 / 15%);
  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 8%), 0 5px 26px 0 rgb(67 94 131 / 15%);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #fff;
  border-radius: 5px;
  overflow-x: auto;
}

.panel-card.full-width{
  width: 100%;
}

.panel-card .chart-container {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 350px;
  max-width: 1000px;
  position: relative;
  width: 100%;
  margin: auto;
}

.panel-card .panel-card-footer{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 10px;
}

.panel-card .sub_title{
  font-size: 1.7rem;
  line-height: 1.5;
  font-weight: 300;
  letter-spacing: .02em;
  color: var(--BID_COLOR_SEC);
}

.toolbar{
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 5px 10px;
}

.toolbar .item{
  color: #455f7c;
  opacity: .7;
  background: white;
  border: 1px solid #efefef;
  transition: color 0.5s;
  border-radius: 10px;
  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 8%), 0 5px 26px 0 rgb(67 94 131 / 15%);
  margin: 2px;
}

.toolbar .item:hover{
  color: var(--BID_COLOR_L) !important;
}



/* .chartReportContainer{
  max-width: 1200px;
  margin: 35px auto;
}
.chartReportContainer>div{
  margin: 20px 15px;
  flex-grow: 1;
} */


/*
  TOOLTIP BOOSTRAP STYLE
*/

.tooltip-inner{
  background-color: white !important;
  -webkit-box-shadow: 0 16px 24px 2px rgb(0 0 0 / 3%), 0 6px 30px 5px rgb(0 0 0 / 7%), 0 8px 10px -5px rgb(0 0 0 / 20%);
  box-shadow: 0 16px 24px 2px rgb(0 0 0 / 3%), 0 6px 30px 5px rgb(0 0 0 / 7%), 0 8px 10px -5px rgb(0 0 0 / 20%);
  color: #455f7c !important;
}

.tooltip-arrow{
  background-color: white !important;
  border: 1px solid #455f7c;
}

.bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before{ 
  border-left-color: white !important;
}
.bs-tooltip-auto[x-placement^=right] .arrow::before, .bs-tooltip-right .arrow::before{ 
  border-right-color: white !important;
}
.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before{ 
  border-top-color: white !important;
}
.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before{ 
  border-bottom-color: white !important;
}

@media screen and (min-width: 767px) {
  .dt-buttons{
    height: 1px !important;
  }    
}

.dt-buttons > button,
.dt-buttons > .btn-group > button{
  background-color: transparent;
  font-weight: 300;
  border: 1px solid var(--BID_COLOR_SEC);
  color: var(--BID_COLOR_SEC);
  padding: 5px 12px;
  transition: all 0.5s ease;
  font-size: 0.94rem;
}
.dt-buttons > button:hover,
.dt-buttons > .btn-group > button:hover{
  background-color: var(--BID_COLOR_SEC) !important;
  border: 1px solid var(--BID_COLOR_SEC) !important;
  color: #fff !important;
}
.dropdown-item.active, .dropdown-item:active{
  background-color: var(--BID_COLOR_SEC);
  opacity: 0.8;
  font-weight: 300;
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before{
  background-color: transparent !important;
  color: #06a8b2 !important;
  font-weight: bold !important;
  border: .15em solid transparent !important;
  box-shadow: none !important;
}

table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th.dtr-control:before{
  background-color: transparent !important;
  color: #06a8b2 !important;
  font-weight: bold !important;
  border: .15em solid transparent !important;
  box-shadow: none !important;
}

.tb_options_cell{
  font-size: 0.9rem;
  color: var(--BID_COLOR_SEC);
}
.tb_options_cell > i{
  margin-left: 3px;
  cursor: pointer;
}
.fiscal_row_tag > span,
.macroeconomic_row_tag > span,
.institutional_row_tag > span{
  background-color: #333;
  color: #fff;
  letter-spacing: 1px;
  padding: 3px 10px;
  border-radius: 6px;
  opacity: 0.9;
}

.fiscal_row_tag > span{
  background-color: var(--FISCAL_COLOR) !important;
}

.macroeconomic_row_tag > span{
  background-color: var(--MACRO_COLOR) !important;
}

.institutional_row_tag > span{
  background-color: var(--INSTIT_COLOR) !important;
}


.big-title{
  letter-spacing: 3px;
  font-weight: 900;
  color: var(--COLOR_HEADER) !important;
  font-size: 3.5rem;
}

.dash-section-header-txt{
  font-family: sans-serif;
  font-weight: 900;
  color: var(--COLOR_HEADER);
}

.info_card{
  border: 1px solid #efefef;
  padding: 0.4rem;
  display: flex;
  flex-direction: column;
  background: white;
  /* border-left: .1875rem solid #7fb3dc; */
  border-left: .1875rem solid var(--BID_PRIMARY_CIAN_1B);
  border-radius: 2px;
  transition: all 0.5s ease-in;
  overflow: hidden;
}
.info_card.figure{
  padding: 12px 5px 20px 15px;
  max-width: 450px;
  height: 170px;
  margin: 1rem 0;
  cursor: pointer;
  transition: all 0.3s ease-in;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.info_card.figure:hover{
  box-shadow: var(--BOX_SHADOW_1);
  transform: scale(1.02);
  background: rgba(50,50,50,0.01);
}

@media only screen and (max-width: 768px) {
  .info_card.figure{
    max-width: none;
    margin-top: 10px;
  }
  .big-title{
    font-size: 3rem;
  }
}

/* .info_card.figure>div:nth-child(2){
  margin: auto;
} */

div.figure_extrainfo{
  color: var(--BLUE_TAIL_COLOR);
  font-size: 0.9rem;
  font-weight: 400;
  margin-top: 6.4px;
}
div.figure_extrainfo>span:nth-child(1){
  font-weight: 500;
  font-size: 1rem;
  background: var(--COLOR_HEADER);
  margin-right: 5px;
  color: #fff;
  padding: 3px 7px;
  border-radius: 5px;
}

div.figure_extrainfo>span:nth-child(1).colorlightblue{
  /* background: #7fb3dc; */
  background: var(--BID_PRIMARY_CIAN_1B);
}
div.figure_extrainfo>span:nth-child(1).coloraqua{
  background: var(--AQUA_COLOR);
}

div.figure_extrainfo>span:nth-child(1).colorcream{
  background: var(--CREAM_COLOR);
}
div.figure_extrainfo>span:nth-child(1).colorheader{
  background: var(--COLOR_HEADER);
}


.info_card.figure_border_top_lightblue{
  border-left: none;
  border-top: 0.1875rem solid var(--BID_PRIMARY_CIAN_1B);
}
.info_card.figure_border_top_aqua{
  border-left: none;
  border-top: 0.1875rem solid var(--AQUA_COLOR);
}
.info_card.figure_border_top_cream{
  border-left: none;
  border-top: 0.1875rem solid var(--CREAM_COLOR);
}
.info_card.figure_border_top_header{
  border-left: none;
  border-top: 0.1875rem solid var(--COLOR_HEADER);
}
.info_card p{
  color: #333;
  font-weight: 700;
  letter-spacing: 0.3px;
  margin: 0;
  padding: 0;
  font-size: 0.75rem;
}
.info_card p.figure_title{
  color: var(--GRAYDARK_COLOR);
  font-weight: 400;
  font-size: 0.85rem;
  margin-bottom: 5px;
  text-transform: uppercase;
}
.info_card h3.figure_value{
  font-size: 2rem;
  color: var(--BID_COLOR_D);
}
.info_card>span, .info_card>select{
  color: var(--BID_COLOR_SEC);
  font-weight: 300;
  font-size: 1.3rem;
  /* text-transform: capitalize; */

  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  /* width: 150px; */
  display: inline-block;
}
.info_card>select{
  border: 0;
  outline: none;
  cursor: pointer;
  outline-style: none;
  box-shadow: none;
  border-color: transparent;
}

.info_card.active{
  /* background: rgb(127 179 220 / 72%); */
  background: rgba(147, 202, 235, 0.75);
  
}
.info_card.active>p, .info_card.active>span, .info_card.active>select{
  color: #fff;
  font-weight: bold;
}
.info_card.active>select {
  color: var(--BID_COLOR_L) !important;
}

.countrymap_svg{
  max-width: 300px; 
  filter: hue-rotate(325deg) opacity(0.8);
  transition: filter 0.3s ease;
}

.arrow_box{
  padding: 5px;
  background: var(--COLOR_HEADER);
  color: #fff;
  font-size: 1rem;
}

/*
:::::::::::::::::::: DETAIL PANEL (FISCAL INDEX REPORT BY COUNTRY) :::::::::::::::::::::
*/

.detail-panel{
  max-width: 1000px;
  margin: 1.5rem auto;
}

.dp-category, .dp-subcategory{
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: stretch;
  padding: 0.75rem 1rem;
  margin: 0;
  border-radius: 0;
  border-collapse: collapse;
}
.dp-category{
  border-bottom: 2px solid #06a8b27d;
  margin-top: 0.3rem;
}
.dp-subcategory{
  padding: 0.40rem 1rem;
  border-bottom: 1px solid rgba(0,0,0,.125);
  border-top: 0;
}

.dp-header, .dp-header-ghost{
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: stretch;
  padding: 0.75rem 1rem;
}

.dp-header-ghost{
  border: 0;
  background: transparent;
}

.dp-btn-toggle {
  font-size: 1rem;
  padding: 0 10px;
  margin: 0;
  background: transparent;
  border: 0;
}

.dp-content{
  display: flex;
  align-items: center;
  flex-grow: 50;
  justify-content: space-between;
  flex-wrap: wrap;
}

.dp-content > h3, .dp-content > h4{
  margin: 5px 0;
  letter-spacing: 0.1rem;
  color: var(--LOGO_AQUA);
  cursor: pointer;
}

.dp-content > h3{
  font-weight: 700;
  font-size: 1.4rem;
}

.dp-content > h4{
  font-weight: 300;
  font-size: 1rem;
  padding-left: 1rem;
}

.dp-labels{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
}
.dp-labels > div{
  margin: 0 0.3rem;
  display: flex;
  align-items: center;
}
.dp-labels-cicle{
  border-radius: 50%;
  width: 15px;
  height: 15px;
  margin-right: 0.3rem;
}
.dp-labels-cicle.country{
  background-color: var(--BID_COLOR_L);
}
.dp-labels-cicle.region{
  background-color: var(--RED_COLOR);
}
.dp-labels-cicle.subregion{
  background-color: var(--CREAM_COLOR);
}
.dp-labels-cicle.income{
  background-color: var(--BID_COLOR_SEC_D);
}
.dp-labels-cicle.rating{
  background-color: var(--ORANGE_COLOR);
}
.dp-labels-cicle.minmax{
  background-color: #333;
}
.dp-labels-info{
  font-size: 0.75rem;
  color: #333;
  font-weight: 100;
  letter-spacing: 0.1rem;
}


/*
:::::::::::::::::::: BOX RANGE CHART :::::::::::::::::::::
*/


.box-range-chart{
  width: 100%;
  max-width: 500px;
  margin: 0 1rem;
}
.brc-container, .brc-header{
  height: 20px;
  width: 100%;
  background: #ededed;
  position: relative;
}
.brc-header{
  display: flex;
  justify-content: space-between;
  color: #747474;
  background: transparent;
  border-bottom: 1px solid #747474;
  padding-bottom: 3px;
  box-sizing: initial;
  font-size: 0.8rem;
}

.brc-maxmin-range, .brc-min, .brc-value1, .brc-value2, .brc-value3, .brc-value4, .brc-value5, .brc-max{
  position: absolute;
  top: 0;
  width: 4px;
  height: inherit;
  cursor: pointer;
}
.brc-min{
  left: calc(var(--index) - 2px);
  background-color: #333;
  height: calc(100% - 0%);
} 
.brc-max{
  left: calc(var(--index) - 2px);
  background-color: #333;
  height: calc(100% - 0%);
}
.brc-value1{
  left: calc(var(--index) - 2px);
  background-color: var(--BID_COLOR_L);
  height: calc(100% - 0%);
} 
.brc-value2{
  left: calc(var(--index) - 2px);
  background-color: var(--RED_COLOR);
  height: calc(100% - 0%);
} 
.brc-value3{
  left: calc(var(--index) - 2px);
  background-color: var(--CREAM_COLOR);
  height: calc(100% - 0%);
}
.brc-value4{
  left: calc(var(--index) - 2px);
  background-color: var(--BID_COLOR_SEC_D);
  height: calc(100% - 0%);
} 
.brc-value5{
  left: calc(var(--index) - 2px);
  background-color: var(--ORANGE_COLOR);
  height: calc(100% - 0%);
} 

.brc-maxmin-range{
  left: calc(var(--min_index) - 2px);
  width: calc(var(--max_index) - var(--min_index));
  /* background-color: #aaaaaa; */
  background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIj48ZGVmcz48cGF0dGVybiBpZD0icGF0dGVybiIgd2lkdGg9IjYiIGhlaWdodD0iNiIgdmlld0JveD0iMCAwIDQwLDQwIiBwYXR0ZXJuVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBwYXR0ZXJuVHJhbnNmb3JtPSJyb3RhdGUoMTM3KSAiPjxyZWN0IGlkPSJwYXR0ZXJuLWJhY2tncm91bmQiIHdpZHRoPSI0MDAlIiBoZWlnaHQ9IjQwMCUiIGZpbGw9InJnYmEoMTcwLCAxNzAsIDE3MCwxKSI+PC9yZWN0PiA8cGF0aCBmaWxsPSJyZ2JhKDI0NywgMjUwLCAyNTIsMSkiIGQ9Ik0gLTEwIDMwIGggNjAgdjIgaC02MHogTS0xMCAtMTAgaDYwIHYyIGgtNjAiPjwvcGF0aD48cGF0aCBmaWxsPSJyZ2JhKDI0NywgMjUwLCAyNTIsMSkiIGQ9Im0gLTEwIDEwIGggNjAgdjIgaC02MHogTS0xMCAtMzAgaDYwIHYyIGgtNjB6Ij48L3BhdGg+PC9wYXR0ZXJuPiAgPC9kZWZzPiA8cmVjdCBmaWxsPSJ1cmwoI3BhdHRlcm4pIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIj48L3JlY3Q+PC9zdmc+");
  opacity: 40%;
  cursor: default;
}



@media only screen and (max-width: 768px) {
  .brc-header{
    margin-top: 15px;
  }

}

.bootstrap-select.bs-container .dropdown-menu{ 
  max-width: 100% !important;
  font-size: 95%;
}


 
/* #wrapper {
  width: 100%;
  overflow: hidden;
  position: absolute;
  top: 1500px;
  left: 0;
}  */
/* max-width: 100vw; */
/* height: 600px; */


#introchart {
  width: 100%; /*2600px*/
  height: calc(100vh - 40px);
  top: 40px;
  position: absolute;
  /* left: -20px; */
  /* left: 50%; */
  /* margin-left: -1300px; */
  background: #303950;
  color: #fff;
}

@media only screen and (max-width: 768px) {

  #introchart {
    height: calc(100vh - 100px) !important;
    top: 90px !important;
  }
}



.txt-username{
  font-weight: 800;
  font-size: 2.7rem;
  color: var(--BLUE_TAIL_COLOR);
}

.padx-corr{
  padding: 20px 50px !important;
}

.activatelightdarkmode{
  color: #959da5;
  background-color: transparent;
  display: inline-block;
  padding: 10px;
  cursor: pointer;
}

@media only screen and (max-width: 768px) {
  .padx-corr{
    padding: 15px 5px 50px 5px !important;
  }
}



.card_info{
  height: auto;
  width: auto;
  max-width: 250px;
  border-radius: .5rem;
  position: absolute;
  bottom: 30px;
  left: 0;
  right: 0;
  cursor: pointer;
  background: linear-gradient(137deg, #2f5c97, #049e84);
  transition: all 0.7s ease-out;
  opacity: 1;
  margin: 1rem 0.6rem;
  padding: 1rem 0.5rem;
  box-shadow: inset -1px 0 0 rgb(0 0 0 / 10%);
  border: 1px solid #ced4da;
}

.card_info.client{
  background: transparent;
  border: 0 !important;
  text-align: center;
  box-shadow: none !important;
  margin: 10px auto;
  transition: all 0.5s ease;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.card_info.client > p{
  font-size: 100%;
  font-weight: 900;
  color: var(--BID_COLOR_D);
  padding: 0 10px 0 0;
  margin: 0;
}

.card_info.client:hover{
  background: #e2e2e2;
} 

.card_info.hidden{
  display: none !important;
}

@media only screen and (max-width: 768px) {
  .card_info{
    bottom: auto;
  }
}

.card_info:hover{
  opacity: 0.9;
}

.ci_content{
  color: #fff;
  text-align: left;
  line-height: 13px;
  margin: 0.4rem; 
}

.ci_content > h5{
  font-weight: 800;
  font-size: 1rem;
}

.ci_content > p{
  font-size: 0.9rem;
  font-weight: 400;
  margin: 0;
}


/* ================================================================ */
/* =========================== GUIDEME  =========================== */
/* ================================================================ */


.guideme-container{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0, 0.3);
  z-index: 1040;
  opacity: 1;
  transition: all .5s ease;
  backdrop-filter: blur(10px);
  background: hsl(0deg 0% 85% / 65%);
}

.guideme-container.closed{
  opacity: 0;
  pointer-events: none;
}

.guideme-window{
  background: white;
  min-width: 100px;
  width: 95%;
  max-width: 1000px;
  height: 90%;
  max-height: 500px;
  border-radius: 10px;
  position: fixed;
  inset: 0;
  margin: auto;
  box-shadow: var(--BOX_SHADOW_1);
}
.guideme-text{
  height: 100%;
  width: 40%;
  padding: 1rem 1.5rem 1rem 2.3rem;
  color: var(--BLUE_TAIL_COLOR);
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.guideme-img{
  height: 100%;
  width: 80%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5rem 2rem 0rem 0.5rem;
}
.guideme-img > img, .guideme-img > svg{
  width: 100%;
} 

.guideme-img > svg.bottom{
  align-self: flex-end;
}
.gmw-close{
  position: absolute;
  top: 5px;
  right: 10px; 
  font-size: 1.3rem;
  cursor: pointer;
  color: #333;
  z-index: 1;
}
.gmw-close:hover{
  color: #555;
}
.gmw-previous, .gmw-next{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  background: #333;
  aspect-ratio: 1 / 1;
  width: 40px;
  border-radius: 52%;
  text-align: center;
  line-height: 40px;
  z-index: 1;
}
.gmw-previous:hover, .gmw-next:hover{
  background: #444;
}
.gmw-previous{
  left: -20px;
}
.gmw-next{
  right: -20px;
}
.gmw-stepguides-wrapper{
  width: 100%;
  height: 25px;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  top: 10px;
}
.gmw-stepguides-wrapper > div {
  width: 10px;
  aspect-ratio: 1 / 1;
  background: #999;
  border-radius: 100%;
  margin: 0 0.5rem;  
}
.gmw-stepguides-wrapper > div.active {
  background: var(--BID_LIGHTER);
}

.guideme-text-content{
  display: flex;
  flex-direction: column;
  margin: auto;
}
.guideme-text-content > h1{
  font-weight: 800;
  color: #333;
}
.guideme-text-content > ul{
  list-style: none;
  display: flex;
  justify-content: space-around;
  padding: 0 0 0 1rem;
  flex-direction: column;
  font-weight: 900;
  font-size: 1rem;
}

.gtc-smallmsg{
  font-size: 0.68rem;
  text-decoration: underline;
  color: var(--GRAY_COLOR);
  margin: auto 0 0 0;
  padding-bottom: 1.3rem;
  cursor: pointer;
  transition: color 0.5s linear;
}

.gtc-smallmsg:hover{
  color: #444;
}

.guideme-wrapper, .guideme-card{
  height: 100%;
  width: auto;
}

.guideme-wrapper{
  overflow: hidden;
}

.guideme-card{
  display: none;
  transition: all 0.6s ease-in;
}

.guideme-card.active{
  display: flex;
}

.guideme-card.move_right{
  transition: all 0.7s cubic-bezier(0.6, -0.28, 0.74, 0.05);
  transform: translateX(100%);
}

.guideme-card.move_left{
  transition: all 0.7s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  transform: translateX(-100%);
}

@media only screen and (max-width: 768px) {
  .guideme-text-content > ul{
    padding: 0;
    flex-direction: row;
    font-size: 1rem;
  }
  .guideme-window{
    height: 90%;
    width: 90%;
    max-height: 470px;
  }
  .guideme-card.active{
    flex-direction: column;
  }
  .guideme-text, .guideme-img{
    width: 95%;
    height: 50%;
    margin: auto;
  }
  .guideme-text{
    padding: 2.6rem .5rem 1rem .5rem;    
  }
  .guideme-img{
    padding: 1rem 0.1rem 0rem 0.1rem
  }
  .guideme-text-content{
    text-align: center;
  }
}




#excel{
  animation: excel 3.5s cubic-bezier(0.68, -0.55, 0.27, 1.55) 1;
  /* animation-fill-mode: forwards; */
  animation-delay: 0.5s;
  cursor: pointer;
}

@keyframes excel {
  0% {
    transform: translateY(0px) translateX(0px);
  }
  50%{
    transform: translateY(50px) translateX(350px);
  }
  100%{
    transform: translateY(0px) translateX(0px);
  }
}

#Window #Vector_4{
  animation: Vector_4 0.75s linear 1; 
  animation-delay: 4s; 
  animation-fill-mode: forwards;
  transform: scaleX(1.5);
}

@keyframes Vector_4 {
  0% {
    transform: scaleX(1.5);
  }
  100% {
    transform: scaleX(1);
  }
}

#svg-model-btn-run, #svg-model-group-inputs, #svg-model-group-model-run, #svg-model-cursor,
#svg-model-icon-menu, #svg-model-menu-options{
  transform-origin: center;
  transform-box: fill-box;
}

#svg-model-btn-run, #svg-model-group-inputs, #svg-model-group-model-run, #svg-model-menu-options,
#svg-model-menu-options-selected{
  opacity:0;
}

#svg-model-group-inputs{
  animation: anm-show-soft 5s ease;
}

#svg-model-btn-run{
  animation: anm-show-soft 4s 1s, anm-push-btn 0.5s 3s;
}

#svg-model-group-model-run{
  animation: anm-show-soft-keep 5s ease 5s;
  animation-fill-mode: forwards;
}

#svg-model-icon-menu{
  animation: anm-push-btn 0.5s 6s;
}

#svg-model-menu-options{
  animation: anm-show-soft-keep 4s ease 6s;
  animation-fill-mode: forwards;
}

#svg-model-menu-options-selected{
  animation: anm-show-soft-keep 2s ease 8s;
  animation-fill-mode: forwards;
}

#svg-model-cursor{
  animation: anm-model-move-cursor-start-to-btn 1s 2s, anm-model-move-cursor-btn-to-options 1s 5s, anm-model-move-cursor-options-to-savemodel 1s 7s;
  animation-fill-mode: forwards;
}

@keyframes anm-show-soft {
  0% {
    opacity:0;
  }
  10% {
    opacity:1;
  }
  90% {
    opacity:1;
  }
  100% {
    opacity:0;
  }
}

@keyframes anm-show-soft-keep {
  0% {
    opacity:0;
  }
  10% {
    opacity:1;
  }
  100% {
    opacity:1;
  }
}

@keyframes anm-push-btn {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.9);
  }
  100% {
    transform: scale(1);
  }
}


@keyframes anm-model-move-cursor-start-to-btn {
  0% {
    transform: translate(0px, 0px);
  }
  100% {
    transform: translate(50px, 5px);
  }
}


@keyframes anm-model-move-cursor-btn-to-options{
  0% {    
    transform: translate(50px, 5px);
  }
  100% {
    transform: translate(227px, -70px);
  }
}

@keyframes anm-model-move-cursor-options-to-savemodel{
  0% {    
    transform: translate(227px, -70px);
  }
  100% {
    transform: translate(207px, -50px);
  }
}


#svg-report-cursor{
  display: none;
}

#svg-report-card-country, #svg-report-card-threshold, #svg-report-card-fiscal-index{
  cursor: pointer;
}

#svg-report-auxtxt-fiscal-index,  #svg-report-auxtxt-threshold, #svg-report-auxtxt-country {
  transform-origin: center;
  transform-box: fill-box;
  transition: transform 1s ease;
  cursor: pointer;
}

#svg-report-auxtxt-fiscal-index{
  transform: translateY(50px);
  animation: anm-report-card-show-hoverme 1.5s linear 0.5s 1;
}

#svg-report-auxtxt-threshold{
  transform: translateY(42px);
}

#svg-report-auxtxt-country {
  transform: translateY(34px);
}

#svg-report-auxtxt-fiscal-index:hover, #svg-report-auxtxt-threshold:hover, #svg-report-auxtxt-country:hover{
  transform: translateY(0px);
}



#srcb-b1, #srcb-b2, #srcb-b3, #srcb-b4, #flag_1{
  transform-origin: center;
  transform-box: fill-box;
  transition: transform 0.5s ease;
}

#flag_1{
  transform: scale(1.3) translate(-9px, 0px);
}

#svg-model-chart-line-area:hover > #flag_1{  
  transform: scale(1.3) translate(0px, 0px);
}

#svg-report-chart-bar:hover > #srcb-b1{
  transform: translateY(-5px);
}

#svg-report-chart-bar:hover > #srcb-b2{
  transform: scaleY(0.6);
}

#svg-report-chart-bar:hover > #srcb-b3{
  transform: translateY(-10px);
}

#svg-report-chart-bar:hover > #srcb-b4{
  transform: scaleY(0.3) translateY(10px);
}



@keyframes anm-report-card-show-hoverme{
  0% {    
    transform: translateY(50px);
  }
  25% {    
    transform: translateY(40px);
  }
  50% {    
    transform: translateY(50px);
  }
  75% {    
    transform: translateY(40px);
  }
  100% {
    transform: translateY(50px);
  }
}


.page-header{
  border-bottom: 0.06rem solid #e7eaf3;
  padding-bottom: 1.75rem;
  margin-bottom: 2.25rem;
}
.ph-title{
  font-size: 2.3678rem;
  font-weight: 900;
}

.dropdown-disabled{
  cursor: not-allowed !important;
  background: #f0f0f0 !important;
  color: #9999 !important;
}

.left-border{
  border-left: 0.5rem solid #ced2dc;
  padding: 1rem 0 1rem 1rem;
}

.risk-scale{
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.risk-scale-label{
  font-size: 0.9rem;
  font-weight: 900;
  margin-right: 1rem;
  text-align: right;
}

.risk-scale-item{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 5rem;
  height: 3rem;
  margin-right: 0.5rem;
  flex-direction: column;
}

.risk-scale-item-title{
  font-size: 0.9rem;
  font-weight: 100;
  color: var(--COLOR_HEADER);
}

.risk-scale-item-box{
  width: 100%;
  max-width: 150px;
  height: 100%;
  border-radius: 5px;
}

.risk-low{
  background: #7EA1FA;
  color: #FFFFFF;
}

.risk-medium{
  background: #EDD1C2;
  color: #333333;
}

.risk-high{
  background: #DC5D4A;
  color: #FFFFFF;
}

.text-highlight.flashy {
  background-image: linear-gradient( to bottom, #ffc20e 27%, transparent 27% );
  background-position: 0px 0.96em;
  padding: 0px 1px 0px 1px;
}

.text-highlight.low {
  background-image: linear-gradient( to bottom, #7EA1FA 27%, transparent 27% );
  background-position: 0px 0.96em;
  padding: 0px 1px 0px 1px;
}

.text-highlight.medium {
  background-image: linear-gradient( to bottom, #EDD1C2 27%, transparent 27% );
  background-position: 0px 0.96em;
  padding: 0px 1px 0px 1px;
}

.text-highlight.high {
  background-image: linear-gradient( to bottom, #DC5D4A 27%, transparent 27% );
  background-position: 0px 0.96em;
  padding: 0px 1px 0px 1px;
}


.risk-boxes{
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 1rem auto;
  height: auto;
  flex-wrap: wrap;
  max-width: 1000px;
  width: 100%;
  flex-direction: column;
}

.risk-boxes > div{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 250px;
  height: 5rem;
  cursor: pointer;
  transition: all 0.5s ease;
  border: 3px #F5F8FB solid;
}

.risk-boxes > div.selected{
  border: 3px solid #333;
}

.risk-boxes > div:hover{
  transform: scale(1.1);
}

.risk-boxes > div > p{
  font-size: 1.2rem;
  font-weight: 900;
  margin: 0;
  text-align: center;
}


.title-labels{
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
  width: fit-content;
  flex-direction: row;
  flex-wrap: nowrap;
  margin: auto;
}

@media only screen and (max-width: 768px) {
  .risk-boxes > div{
    max-width: 200px;
  }

  .title-labels{
    flex-direction: column;
  }
}

.highlight-country-values:hover .risk-variables-bars-chart-bar.label-box-1{
  opacity: 0.3;
}

.title-label-item{
  width: 100%;
  height: 1.5rem;
  display: flex;
  margin: 0.35rem 1rem;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}

.title-label-item-box{
  width: 60px;
  max-width: 150px;
  height: 100%;
  border-radius: 5px;
  margin-right: 10px;
}

.title-label-item-dotted{
  height: 1px;
  border-bottom-style: dotted;
  border-bottom-width: 5px;
  opacity: 0.75;
  width: 60px;
  max-width: 150px;
  margin-right: 10px;
}

.title-label-item-title{
  font-size: 1rem;
  font-weight: 600;
}

@media only screen and (min-width: 768px) {
  .title-label-item-title{
    width: max-content;
  }
}

/* 578ACC */
.label-box-1{
  background: #4D73A5;
  color: #FFFFFF;
}

.label-dotted-1{
  color: #4D73A5;
  background: transparent;
}

.label-box-1-text{
  color: #4D73A5;
}

.label-box-1-border{
  border-left-color: #2E5189;
}

/* F2A068 */
.label-box-2{
  background: #2AB4BC;
  color: #FFFFFF;
}

.label-dotted-2{
  color: #2AB4BC;
  background: #FFFFFF;
}

.label-box-2-text{
  color: #2AB4BC;
}

.label-box-2-border{
  border-left-color: #1f7579;
}

.risk-variables-bars-wrapper{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  max-height: 620px;
  overflow-y: auto;
  overflow-x: hidden;
  border-bottom: 1px solid #b1b1b1;
  border-top: 1px solid #b1b1b1;
  background: #f3f3f3;
}

.risk-variables-bars-container{
  display: flex;
  flex-direction: column;
  justify-content: start;
  width: 100%;
  height: auto;
  margin: 1rem 2rem;  
  max-width: 400px;
  cursor: pointer;
}

.risk-variables-label{
  font-weight: 500;
  font-size: 1rem;
  width: 100%;
  min-width: 250px;
  text-align: center;
  padding: 20px 5px 2.5rem 5px; /* 0 0 2.5rem;*/
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.risk-variables-label > span:first-child{
  font-weight: 900;
  font-size: 1.2rem;
}

.risk-variables-bars{  
  width: 100%;
  display: flex;
  flex-direction: row;
  height: 150px
}

.risk-label-box{
  border-bottom: 3px solid #333333;
  border-top: 3px solid #333333;
  border-left: 3px solid #333333;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  font-size: 1rem;
  font-weight: 600;
  max-width: 5rem;
  text-align: center;
  padding: 0 0.5rem;
}

.risk-label-box > p{
  margin: 0;
}

.risk-variables-bars-chart{
  min-width: 100px;
  background-color: #FFFFFF;
  border: 3px solid #333333;
  width: 100%;

  padding: 1rem 0.5rem 1rem 0;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: self-start;
  position: relative;
}

.risk-variables-bars-chart-bar{
  width: 1%;
  height: 100%;
  margin: 0.21rem 0;
  position: relative;
  transition: all 0.5s ease;
}

.risk-variables-bars-chart-bar:hover{
  transform: scaleY(1.07);
}

.risk-variables-bars-chart-bar-label{
  font-size: 0.9rem;
  font-weight: 900;
  text-align: center;
  margin: 0;
  position: absolute;
  top: 50%;
  border-left: hidden;
  transform: translateY(-50%);
  background: white;
  padding: 0 3px;
}

.risk-variables-bars-chart-bar-label.internal{
  color: #FFFFFF !important;
  right: 1rem !important;
}

.risk-variables-bars-chart-threshold{
  position: absolute;
  top: 0;
  left: 0;
  width: 5px;
  height: 100%;
  border-left-style: dotted;
  border-left-width: 4px;
  opacity: 0.75;
}

.risk-variables-bars-chart-threshold > span{
  position: absolute;
  top: -29px;
  font-size: 0.9rem;
  transform: translateX(-25px);
  font-weight: 900;
  padding: 0 5px;
  background: white;
  border: 1px solid #efefef;
  border-radius: 5px;
  transition: all 0.3s ease;
}

.risk-variables-bars-chart-threshold > span:hover{
  background: #fbfbfb;
  transform: translateX(-25px) translateY(-15px) scale(1.2);
}

.risk-variables-bars-chart-threshold:hover{
  opacity: 1 !important;
}
.risk-variable-evolution-container{
  max-width: 1200px;
  margin: auto;
}

@media only screen and (max-width: 768px) {

  .risk-variables-bars-container{
    margin: 1rem 0.1rem;
  }

  .risk-variables-label{
    font-size: 1.3rem;
    width: 100%;
    padding: 0 0 1.5rem 0;
  }
}


/* ::::::::::::::::::::: SELECT OPTIONS ::::::::::::::::::::: */

.select-ctr {
  position: relative;
  width: auto;
  text-align: center;
  line-height: 2.4rem;
  letter-spacing: 1px;
  min-width: 350px;
  text-transform: uppercase;
}

.select-ctr > .options.show {
  max-height: 900px;
  box-shadow: 0 2px 15px 3px rgb(0 0 0 / 10%);
}

.select-ctr > .options {
  position: absolute;
  width: 100%;
  z-index: 1;
  overflow: hidden;
  height: max-content;
  max-height: 0px;
  transition: 0.3s all ease;
  box-shadow: none;
  border-radius: 5px;
  max-width: 600px;
  left: 50%;
  transform: translateX(-50%);
}

.select-ctr > .options > div.input {
  background: #fff;
  color: #777;
  font-size: 1rem;
  cursor: pointer;
  font-weight: 500;
  letter-spacing: 1px;
  height: 50px;
  line-height: 50px;
  transition: 0.3s all ease;
  overflow: hidden;
  border-bottom: 1px solid #efefef;
}

.select-ctr > .options > div.input:hover {
  background: #f2f2f2;
}

.select-ctr > .options > div.input.selected {
  color: #1d77ef;
}

.select-ctr > div.input-preview {
  position: relative;
  transition: 0.3s all ease;
  color: var(--COLOR_HEADER);
  font-weight: 900;
  font-size: 2rem;
  padding: 1rem;
  cursor: pointer;
}

.select-ctr > div.input-preview:hover {
  text-decoration: underline;
}

.select-ctr > div.input-preview:before {
  content: "";
  position: absolute;
  top: 50%;
  right: -20px;
  bottom: 50%;
  width: 20px;
  transform: translateY(-50%);
  background: var(--COLOR_HEADER);
  -webkit-clip-path: polygon(50% 73%, 0 0, 100% 0);
  clip-path: polygon(50% 73%, 0 0, 100% 0);
  padding: 10px;
  box-sizing: border-box;
  transition: 0.3s all ease;
}

.select-ctr > div.input-preview.active:before {
  background: white;
  -webkit-clip-path: polygon(50% 0, 0 73%, 100% 73%);
  clip-path: polygon(50% 0, 0 73%, 100% 73%);
}

#errorPage{
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.guide-btn {
  color: #70521f;
  background: var(--BID_SECONDARY_YELLOW);
  border-radius: 10px;
  padding: 0.1rem 1rem;
  font-weight: 800;
  box-shadow: var(--BOX_SHADOW_1);
  outline: none;
  border: none;
}

.guide-btn.morado {
  background: var(--GRADIENT_MAGENTA);
  color: white;
}

.guide-btn.bid_primary {
  background: var(--BID_GRADIENT_PRIMARY_2D_130);
  color: white;
}

.guide-btn.sm {
  position: absolute;
  right: 20px;
}

.guide-btn.md {
  position: relative;
  margin: auto;
  width: 100%;
  max-width: 300px;
  font-size: 1.2rem;
  height: 40px;
  line-height: 32px;
}

.guide-btn:hover {
  color: #333;
}

.guide-btn.morado:hover {
  background: linear-gradient(130deg, #9E0488, #CB058C);
  color: white;
}

.guide-btn.bid_primary:hover {
  background: var(--BID_GRADIENT_PRIMARY_2_130);
  color: white;
}

.header-menu-wrapper{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
}

.header-menu-wrapper > div, 
.header-menu-wrapper > button {
  min-width: 300px;
  margin: auto !important;
}

.variable-desc {
  max-width: 70%;
  margin: auto;
  font-weight: 400;
  font-size: 1.2rem;
  box-shadow: 0 1px 6px rgb(32 33 36 / 28%);
  border-radius: 8px;
  border: 1px solid #dadce0;
  padding: 1.6rem 1.4rem;
  margin-bottom: 3rem !important;
  text-align: center !important;
  background: #fff;
  color: var(--COLOR_HEADER);
}

@media only screen and (max-width: 768px) {

  .variable-desc {
    max-width: 100%;
  }

  .header-menu-wrapper{
    flex-wrap: wrap;
  }

  .guide-btn.sm {
    top: 110px;
    right: 50%;
    left: 50%;
    width: 200px;
    transform: translateX(-50%);
  }

  .header-menu-wrapper > div, 
  .header-menu-wrapper > button {
    margin: 0.31rem 0 !important;
  }
}

.guide-highlight {
  border: 5px solid lightblue !important;
  box-shadow: var(--BOX_SHADOW_1) !important;
}


#keyFiguresSectionBoxes {
  max-height: 420px;
  overflow-x: hidden;
  overflow-y: auto;
  border-bottom: 1px solid #dadce0;
  border-top: 1px solid #dadce0;
}

@media only screen and (max-width: 768px) {
  #keyFiguresSectionBoxes {
    max-height: 400px;
  }
}

.range-value{
  padding: 0 10px;
  font-size: 1.2rem;
  font-weight: 900;
  color: var(--COLOR_HEADER);
  max-width: 150px;
}

.home-first-section {
  position: relative;
  background-image: linear-gradient(180deg, var(--BID_PRIMARY_BLUE), var(--BID_PRIMARY_BLACK_2A));
  /* background-image: linear-gradient(180deg, rgb(49 71 100), rgb(37 46 54)); */
  border-bottom-left-radius: 6rem;
  border-bottom-right-radius: 6rem;
  box-shadow: 0 1px 6px rgb(32 33 36 / 28%);
  border: 1px solid #dadce0;
}

.home-banner {
  /* background-image: linear-gradient(80deg, rgb(49 71 100), rgb(37 46 54)); */
  background: var(--BID_PRIMARY_BLUE); 
  border-radius: 2rem;
  color: white !important;
}

.content-home{
  max-width: 1700px;
  margin: auto;
}

.plotly_dash_container{
  max-width: 1200px;
  margin: auto;  
}

@media only screen and (max-width: 768px) {
  #keyFiguresSectionBoxes {
    max-height: 400px;
  }
  
  .home-banner {
    border-radius: 0;
  }

  .content-home{
    max-width: 100%;
  }

  .plotly_dash_container{
    max-width: 100%;
  }
}

.box-tocs {
  border: 1px solid #efefef;
  max-height: 400px;
  margin: auto;
  overflow-y: auto;
  overflow-x: hidden;
  background: #fbfbfb;
}