﻿/* Loaded after Admin.css */
::-webkit-scrollbar {background-color: #a7b0b9;width: 5px;height: 5px;border-radius: 3px; border: 4px solid transparent;}

::-webkit-scrollbar-thumb {background-color: #1e1f20;border-radius: 3px;border: 4px solid transparent;}

::-webkit-scrollbar-button {display: none;width: 0px;height: 0px;}

.MainDiv                                                                            {min-width:320px;display:flex;flex-direction:column;height:100vh}

.MainContent.Client                                                                 {padding-top:40px; flex:1;display:flex;flex-direction:column;min-height:auto}
.MainDiv .MainContent.Client div.ListWidthBlockWithTopBorder                        {flex:1; max-height:calc(100% + 40px);margin-top:-40px}
.MainDiv.ModalView .MainContent.Client                                              {margin:0px} 

.SideMenu                                                                           {display:block;}

.Header .Inner.Client                                                               {display:flex; justify-content:space-between;align-items:center; margin: 0px 20px; height:100%;}  
.Header .Inner.Client .DashboardTabs                                                {position:initial; width:255px; display:flex; align-items:center; justify-content:flex-end; gap:10px}
.Header .Inner.Client .Logo                                                         {position:initial}
.Header .Inner .DashboardTabs .AccountIcon                                          {width: 40px ;height: 40px; background-color: #b7bf10 ;position: relative; border-radius: 50%; cursor: pointer; display: flex; justify-content: center; align-items: center;}
.Header .Inner .DashboardTabs .AccountIcon span                                     { font-size:1.4em; font-weight:700; color:#ffffff;}
.Header .Inner .DashboardTabs .AccountIcon .NavDropdown                             { position: absolute; top: 45px; right: 0px; z-index:11 ; width: fit-content; background: #FFFFFF 0% 0% no-repeat padding-box; box-shadow: 0px 3px 6px #0000001A; border: 1px solid #D5D5D5; border-radius: 3px; padding:5px 10px;}
.Header .Inner .DashboardTabs .AccountIcon .NavDropdown .NavDropdownOption a        { text-align: left; font-size: 1.2em; margin:15px 10px; display: block; letter-spacing: 0px; color: #8D8D8D; white-space: nowrap; }
.Header .Inner .DashboardTabs .AccountIcon .NavDropdown .NavDropdownOption a:hover  { text-decoration:none;}

/*GlobalNav Menu*/
.Header .Inner.Client .MainNavigation                                               {width:100%}
.Header .Inner.Client .MainNavigation .GlobalNav                                    {display:flex;align-items:center;justify-content:center;gap:60px}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports                           {position:relative; display:flex;justify-content:space-between;align-items:center; gap:10px}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports .DropdownIcon             {width:20px;height:20px;background-size:40px 40px; background-position:center; background-repeat:no-repeat;background-image:url("../Content/Images/Icon_Form_Arrow.png")}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports.Open .DropdownIcon        {transform:rotate(180deg)}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports.Open .ReportsDropdown     {visibility:visible;transform:translateY(0);opacity:1}

/*Reports Nav Dropdown*/
.Header .Inner.Client .MainNavigation .GlobalNav a:hover                                {text-decoration:none}
.Header .Inner.Client .MainNavigation .GlobalNav div                                    {padding-bottom:5px}
.Header .Inner.Client .MainNavigation .GlobalNav div.Active                             {border-bottom:4px solid #B7BF10}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports                               {cursor:pointer}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports.Active                        {border-bottom:4px solid #B7BF10}
.Header .Inner.Client .MainNavigation .GlobalNav div a                                  {color:#666666;font-size:1.4em;text-transform:uppercase}
.Header .Inner.Client .MainNavigation .GlobalNav div span                               {color:#666666;font-size:1.4em;text-transform:uppercase}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports .ReportsDropdown              {position:absolute;z-index:11; top:40px; left:0px; min-width:125px;background: #FFFFFF 0% 0% no-repeat padding-box; box-shadow: 0px 3px 6px #0000001A; border: 1px solid #D5D5D5; border-radius: 3px; padding:5px 0; width:100%; visibility:hidden; transform:translateY(-10px); transition:opacity 0.3s ease, visibility 0.3s, transform 0.3s ease; opacity:0}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports .ReportsDropdown div          {width:100%;margin:10px; text-align:left}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports .ReportsDropdown div a        {font-size:1.2em; color:#8D8D8D; text-transform:initial}
.Header .Inner.Client .MainNavigation .GlobalNav .Reports .ReportsDropdown div a:hover  {text-decoration:none}

.MainDiv .LocalNav.Client                                                               {margin: 20px 20px 0px 20px; padding: 30px 40px 0px 40px; background-color: #fff; box-shadow: 0 2px 2px rgba(43,59,93,.29);}
.MainDiv .LocalNav.Client .LocalNavUpper                                                {display:flex; width:100%;gap:10px; justify-content:space-between; margin-bottom:20px;flex-wrap:wrap}
.MainDiv .LocalNav.Client .LocalNavUpper h1                                             {padding:4px 0px 4px 10px; border-left:4px solid #B7BF10; margin-bottom:0px; height:fit-content}
.MainDiv .LocalNav.Client .LocalNavUpper .Buttons                                       {display:flex; gap:10px; align-items:center;flex-wrap:wrap}
.MainDiv .LocalNav.Client .LocalNavInner                                                {padding:10px 0px 0px 0px}
.LocalNavInner .Centre                                                                  {cursor:pointer;font-weight: 400;text-transform: uppercase;letter-spacing: 2px;font-size: 12px;color: #000000;position: relative;}

.MainDiv.ModalView .LocalNav.Client                                                     {margin:0px}

a.Btn                                                                                   {border-radius:3px; line-height:30px; background-color:#244C5A; height:40px; padding:5px 15px; color:#ffffff; font-weight:600; font-size:1.3em; box-sizing:border-box}
a.Btn.BtnAdd                                                                            {padding-left:30px; margin-top:0px; background-position:left 10px center; background-repeat:no-repeat; background-size:12px auto; background-image:url("../Content/Images/Icon_Add.svg")}

.t-widget.t-grid                                                                        {overflow:auto !important; height:100%}
.t-grid-header .t-header .t-link                                                        {margin-right:10px}  

.Disabled                                                                              {pointer-events:none; opacity:0.3}
.ExcludedRoute                                                                         {pointer-events:none; opacity:0.3}

/*Dropdown */
.select2-container--default .select2-selection--single .select2-selection__arrow        {width: 35px !important;height: 38px !important;background-size: 40px 40px;background-position: center;background-repeat: no-repeat;background-image: url("../Content/Images/Icon_Form_Arrow.png")}
.select2-container--default .select2-selection--single .select2-selection__arrow b      {display:none}
.select2-container--default.select2-container--open .select2-selection__arrow           {transform:rotate(180deg)}
.select2-container--default .select2-selection--single                                  {height:40px !important; border:1px solid #D5D5D5 !important; background-color:#F5F5F5 !important}
.select2-container--default .select2-selection--single:hover                            {background-color:#E3EFFB !important}                   
.select2-container--default .select2-selection--single .select2-selection__rendered     {line-height:40px !important}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {border-color:#388DCF !important; border-bottom-left-radius:4px !important; border-bottom-right-radius:4px !important; background-color:#E3EFFB !important}
.select2-search--dropdown                                                               {padding:8px 10px !important}
.select2-container--default .select2-search--dropdown .select2-search__field            {border-radius:3px !important;padding-right:25px !important; border-color:#d5d5d5 !important; height:30px !important; background-position:right; background-size:35px auto; background-repeat:no-repeat; background-image:url("../Content/Images/Icon_Form_Search_01.png")}
.select2-container--default .select2-search--dropdown .select2-search__field::placeholder {content:"Type search here"}
.select2-container--open .select2-dropdown--below                                          {top:10px !important; border-radius:3px !important; box-shadow:0px 3px 6px #0000001A; border:1px solid #D5D5D5 !important; background-color:#F5F5F5 !important;}
.select2-results                                                                            {margin: 0px 10px 10px 10px !important}
.select2-container--default .select2-selection--single .select2-selection__rendered         {color:#333333 !important; font-size:1.2em !important}
.DropDownW1.Project                                                                         {width:325px !important}

/*Table row button*/
a.BtnTable {
    font-weight: 500;
    font-size: 1.1em
}
a.BtnTable:hover                                                                            {text-decoration:none;} 
a.BtnTable.View                                                                             {padding:8px 30px} 
a.BtnTable.WorkbookView                                                                     {padding:8px 20px} 

/*Projects List*/
.ProjectsList .ProjectsCode                                                                {min-width:70px}
.ProjectsList .UpToDate                                                                    {min-width:165px}
.ProjectsList .LastUpdate                                                                  {min-width:120px}

/*Project Overview*/
.Return                                                                                     {display:flex;align-items:center;gap:5px; margin-bottom:20px}
.Return .BackIcon                                                                           {width:20px;height:20px;cursor:pointer; background-size:40px 40px; background-position:center;background-repeat:no-repeat; background-image:url("../Content/Images/Icon_Form_Arrow.png");transform:rotate(90deg)}
.Return a                                                                                   {font-size:1.4em; color:#657478; text-decoration:underline}                                                
.OverviewHeader                                                                             {display:flex;align-items:center;justify-content:space-between;gap:360px}        
.OverviewHeader div                                                                         {margin-top:20px;display:flex;align-items:center;gap:10px}   
a.BtnAlt                                                                                    {background-color:#ffffff; color:#244C5A; border:1px solid #244C5A;}

.SelectorContainer                                                                          {display:flex; gap:10px; align-items:center; position:absolute;right:40px;top:-70px}                  
.Client.ProjectOverview .GridStackParentView                                                {width:initial}  

/*GridStack adjustments*/
.MainContent.Client .GridStackParentView                                                    {width:100%}
.MainContent.Client .GridStackParentView .grid-stack-item .grid-stack-item-content          {overflow:auto}

.MainContent.Client .Spinner                                                                {display:flex; align-items:center; justify-content:center; width:100%;margin:40px 0}

@media only screen and (max-width:1024px) {
    .MainDiv .Header                                    {height:60px;}
  .MainDiv .Header .HeaderTitle                       {display:none;}
  .MainDiv .Header .Logo                              {position:static; width:180px; margin:0px auto 0px auto; padding:5px 0px;}
  .MainDiv .Header .Logo img                          {width:190px;}
  .MainDiv .Header .Logo img                          {width:190px;}
  .BtnMenu                                            {display:block;}
  .Header .Inner.Client .MainNavigation               {display:none}
  .Header .Inner.Client .DashboardTabs                {width:initial}
  .OverflowPanel1 .MainNavigation .GlobalNav          {margin:30px; margin-left:25px}
  .OverflowPanel1 .MainNavigation .GlobalNav div                                    {margin-top:20px; min-height:25px; padding-left:5px; display:flex}
  .OverflowPanel1 .MainNavigation .GlobalNav div:first-of-type                      {margin-top:0px}
  .OverflowPanel1 .MainNavigation .GlobalNav div a                                  {color:#666666;font-size:1.4em;text-transform:uppercase; margin:auto 0}
  .OverflowPanel1 .MainNavigation .GlobalNav a:hover                                {text-decoration:none}
  .OverflowPanel1 .MainNavigation .GlobalNav div span                               {color:#666666;font-size:1.4em;text-transform:uppercase}
  .OverflowPanel1 .MainNavigation .GlobalNav div span                               {color:#666666;font-size:1.4em;text-transform:uppercase}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports                               {position:relative;cursor:pointer;flex-direction:column;height:fit-content}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports .DropdownIcon                 {width:20px;height:20px;background-size:40px 40px; background-position:center; background-repeat:no-repeat;background-image:url("../Content/Images/Icon_Form_Arrow.png"); position:absolute;top:-1px; right:-20px;}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports.Open .DropdownIcon            {transform:rotate(180deg)}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports.Open .ReportsDropdown         {visibility:visible;transform:translateY(0);opacity:1;display:block;}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports .ReportsDropdown              {display:none; padding-left:5px; width:100%; height:fit-content; visibility:hidden; transform:translateY(-10px); transition:opacity 0.3s ease, visibility 0.3s, transform 0.3s ease; opacity:0}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports .ReportsDropdown div          {height:initial; display:block; padding-left:initial}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports .ReportsDropdown div a:hover  {text-decoration:none}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports .ReportsDropdown div a        {font-size:1.2em; color:#8D8D8D; text-transform:initial}

  .OverflowPanel1 .MainNavigation .GlobalNav div.Active                             {border-left:4px solid #B7BF10}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports.Active                        {border-left:none; padding-left:0px}
  .OverflowPanel1 .MainNavigation .GlobalNav .Reports.Active span                   {padding-left:5px; border-left:4px solid #B7BF10; padding-top:5px; box-sizing:border-box}

@media only screen and (max-width:768px) {
  .GridStackParentView .Charts .List                                                {display:block; margin-bottom:-25px;}
  .GridStackParentView .Charts .List .Item                                          {display:inline-block; width:50%; margin-bottom:25px;}
  .DashCStatic .Charts .List                                                        {display:block;}
  .DashCStatic .Charts .List .Item                                                  {display:inline-block; width:50%;}
  .MainDiv .LocalNav.Client .LocalNavUpper                                          {flex-direction:column}
  .MainDiv .LocalNav.Client .LocalNavUpper .Buttons                                 {flex-direction:column}
  .MainDiv .LocalNav.Client .LocalNavUpper .Buttons div                             {width:100%}
  .MainDiv .LocalNav.Client .LocalNavUpper .Buttons .select2-container              {width:100% !important}
  a.Btn.BtnAdd                                                                      {width:100%}

  .SelectorContainer                                                                {position:initial; margin-bottom:20px}

}

@media screen and (max-width:600px) {
  .GridStackParentView .Infos .Desc .Name                                             {font-size:36px;}
  .GridStackParentView .Engagement .BigNbre                                           {font-size:70px;}
  .GridStackParentView .Engagement .BigNbre sup                                       {font-size:50px;}
  .GridStackParentView .grid-stack-item[data-gs-height="1"] .Engagement .BigNbre      {font-size:70px;}
  .GridStackParentView .grid-stack-item[data-gs-height="1"] .Engagement .BigNbre sup  {font-size:50px;}
}

@media screen and (max-width:480px) {
  .GridStackParentView .Infos .Desc .Name                                       {font-size:32px;}
  .GridStackParentView .Engagement .Difference .Label                           {line-height:1.3em; display:block;}
  .GridStackParentView .Engagement .Difference .Item                            {display:block; padding-left:0px; padding-top:10px;}

  .MainDiv .MainContent                                                         {margin:0px 10px; padding:10px 20px 20px 20px;}
  .MainDiv .MainNavigation .LocalNav                                            {margin-left:10px; margin-right:10px;}
  .LocalNavInner                                                                {padding:20px 20px 20px 20px;}

  .MainDiv .Header .Logo                                                        {width:190px;}
  .MainDiv .Header .Logo img                                                    {width:190px;}

  .SectionC .ContentC .Row .Stat .Block .StatRow.LabelRow .Cell                 {font-size:10px;}

  .MainDiv .LocalNav.Client                                                     {margin:10px 10px 0px 10px; padding: 20px 20px 0px 20px}
}


@media only screen and (max-width:480px){
  .SectionC .HeadC .Chart                                   {display:block; width:auto; padding:0px 0px 10px 0px;}
  .SectionC .HeadC .StatHide .Block .Cell .Txt              {font-size:10px;}
  .SectionC .ContentC .Row .Desc .Block .Nbre                       {width: 25px;}
  .SectionC .ContentC .Row .Desc .Block .Txt                        {padding:0px 0px 10px 0px;}
  .SectionC .ContentC .Row .Stat                                    {padding:0px 25px 5px 25px;}
  .SectionC .ContentC .Row .Stat .Block .Cell .Txt                  {font-size:10px;}
  .SectionC .ContentC .Row .Chart                                   {padding:0px 0px 0px 25px;}
  .SectionC .ContentC .TopRow .Chart                                {padding:0px;}

  .DashCStatic .Infos .Desc .Name                                       {font-size:40px;}
  .DashCStatic .TopBottom .Row .Nbre                                    {width:25px;}
  .DashCStatic .Engagement .BigNbre                                     {font-size:100px;}
  .DashCStatic .Engagement .BigNbre sup                                 {font-size:50px;}
  .DashCStatic .Engagement .Difference .Label                           {line-height:1.3em; display:block;}
  .DashCStatic .Engagement .Difference .Item                            {display:block; padding-left:0px; padding-top:10px;}

  .Comparison .SectionComp .ContentComp .Row .Desc .Block .Nbre                       {width: 25px;}
  .Comparison .SectionComp .ContentComp .Row .Stat                                    {padding:0px 25px 5px 25px;}
  .Comparison .SectionComp .ContentComp .Row .StatDash                                {padding:0px 0px 5px 0px;}
}




/* Navigation */
@media only screen and (max-width:1024px){
  .GlobalNav table a                          {font-size:12px; padding:19px 0px 17px 0px;}
}
@media only screen and (max-width:768px){
  .GlobalNav table td                         {display:block;}
  .GlobalNav table td.Active a                {color:#000000; border-bottom:none; background:#b7bf10;}
}
