.ferrariTheme.loginScreen { background-image: url('../images/ferrari-background.png');background-size: cover; color: white;}
  .ferrariTheme .imageLogo{filter: invert(1);max-height:155px; max-width:100%; content:url(../images/ferrariMaserati_2.png);}
  .ferrariTheme .loginData{padding:0px}
  .ferrariTheme .loginItem{  float: none;}
  .ferrariTheme .supportForm{display: none;}
  .ferrariTheme .loginItem .forgot{color: red;}
  .ferrariTheme .loginItem .remember .checkbox{border: 1px solid white;}
  .ferrariTheme .keepSignedin{float: left;margin: 0px 0px 20px 40px;}
  .ferrariTheme .loginItem .inputText{border-radius: 5px;box-sizing: border-box;}
  .ferrariTheme .loginItem .btn-blue{background-color: #0C2340;color:white;border: 1px solid white;border-radius:5px;}

  .ferrariDarkTheme  #ReportGrid.OutbackReport tr.Regular1{background-color: rgba(0, 0, 0, 1);}
  .ferrariDarkTheme  #ReportGrid.OutbackReport tr.Regular2{background-color: rgba(75, 75, 75, 1);}
  .ferrariDarkTheme  #ReportGrid.OutbackReport tr td{padding:5px;border: 1px solid white;}
  .ferrariDarkTheme .widgetPageSection{ background-color: transparent;}
  /*.ferrariDarkTheme .gridster{background: linear-gradient(180deg, rgba(0, 0, 0, 0) -3.01%, rgba(255, 0, 0, 1) 160%), url('../images/ferrari-background.png');    background-size: cover; color: white;box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);}*/
  .ferrariDarkTheme .gridster article { border: none;}
  .ferrariDarkTheme .newMenu {box-shadow: 4px 0px 4px -2px rgba(0, 0, 0, 0.5);background-color: #0D0D0D;top:59px}
  .ferrariDarkTheme .menuMH { color: white; }
  .ferrariDarkTheme #block { background: linear-gradient(180deg, rgba(0, 0, 0, 0) -3.01%, rgba(255, 0, 0, 1) 160%), url('../images/ferrari-background.png');background-size: cover; color: white;box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);}
  .ferrariDarkTheme .logoGridster{box-shadow: 0px 2px 0px rgba(255, 255, 255, 1)}
  /*.ferrariDarkTheme .FerMasLogo{content: url('../images/FerMasMenuLogo.png');padding-top:10px;max-width: 100%;max-height: 60px;}*/
  .ferrariDarkTheme .menuList .menuMH .searchStatus{background-color: black;}
  .ferrariDarkTheme .menuList .menuMH .favStatus{background-color: black;}
  .ferrariDarkTheme #menuToggle div,.ferrariDarkTheme #menuToggle div:before,.ferrariDarkTheme #menuToggle div:after {background: white;}
  .ferrariDarkTheme #block .newMenu .navSNElogo{background: url('../images/ferrari-logo-white.png') top center, url('../images/maserati-logo-white.png') bottom center ;background-repeat: no-repeat;background-size: contain;width:90%;height:150px;top:10px;left:10px}
  .ferrariDarkTheme #block .newMenu .menulist{top:175px}

 /* .ferrariLightTheme .widgetPageSection{ background-color: transparent;}
  .ferrariLightTheme .gridster article { border: none;}
  .ferrariLightTheme .newMenu {box-shadow: 4px 0px 4px -2px rgba(0, 0, 0, 0.5);background-color: white;top:59px}
  .ferrariLightTheme .menuMH { color: black; }
  .ferrariLightTheme #block { background: linear-gradient(180deg, rgba(0, 0, 0, 0) -3.01%, rgba(255, 0, 0, 1) 160%), url('../images/ferrariWhiteBgn.png');background-size: cover; color: black;box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);}
  .ferrariLightTheme #block .newMenu .navSNElogo{background: url('../images/ferrari-logo-black.png') top center, url('../images/maserati-logo-black.png') bottom center ;background-repeat: no-repeat;background-size: contain;width:90%;height:150px;top:10px;left:10px}
  .ferrariLightTheme #block .newMenu .menulist{top:175px}
  .ferrariLightTheme .menuList .menuMH .searchStatus{background-color: white;}
  .ferrariLightTheme .menuList .menuMH .favStatus{background-color: white;}
  .ferrariLightTheme  #ReportGrid.OutbackReport tr.Regular1{background-color: white;}
  .ferrariLightTheme  #ReportGrid.OutbackReport tr.Regular2{background-color: #f1f1f1;}
  .ferrariLightTheme  #ReportGrid.OutbackReport tr td{padding:5px;border: 1px solid lightgray;}*/

.lightMode .btn-blue{background-color: #00205B;color: white;}
.lightMode .btn-tertiary{background-color:#1179F7 ; color:white;}
.lightMode .btn-SecAction{background-color: #E5E5E5; color:#00205B;}
.lightMode .btn-black{background-color: black;color: white;}
.lightMode .inputText{background-color: white;color: black;}
.lightMode .inputDate{background-color: white;color: black;}
.lightMode .textarea{background-color: white;color: black;}
.lightMode .select{background-color: white;color: black;}
.lightMode .checkbox{border:1px solid #525252}
.lightMode .table-striped tr:nth-child(even) {background-color: #bfd3ef;}
.lightMode button[disabled] { background-color: #C4C4C4;cursor: default;}
/*.lightMode .disableInput{background-color: #F6F6F6;}*/
.lightMode input[type=text]:disabled {background: #F6F6F6;}
.lightMode select:disabled{background-color:#F6F6F6;}

/*login screen*/
.lightMode.loginScreen { background-color: #f0f0f0;}
.lightMode .loginData { border-radius: 5px; box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.5);}
.lightMode .loginData {background-color: #fff;color:black}



.lightMode .mainPageWidget{background-color: #f0f0f0;}
.lightMode .widgetPageSection{background-color: white;color:#333;} 
.lightMode .widgetPageSectionPopup [ss-widget] {background-color: white;color:#333;position: absolute;height:100%;width: 100%;}   
.lightMode .gridster article{border:3px solid #ccc }

/* main home page menu*/
.lightMode .newMenu {box-shadow: 4px 0px 4px -2px rgba(0, 0, 0, 0.5);background-color: #fff;}
.lightMode .main { background-color:#f0f0f0; }
.lightMode .dashBoardHeader { color:#525252 }
.lightMode .PageSection{background-color: #f0f0f0;}
.lightMode .favMenuBox { background-color:#525252 }
.lightMode .overlay { color: #fff; }

.lightMode .topRightNavMenu i {color:#525252; }
.lightMode .topRightNavMenu i:hover {color:#f6f6f6; background-color: #525252;}
.lightMode .navHeader .subMenus{color: black; background-color: white;}

.lightMode a{ color:#333; }
.lightMode .logoGridster{background-color: #fff;}
.lightMode .menuList .menuMH .searchStatus{background-color: #fff;}
.lightMode .menuList .menuMH .favStatus{background-color: #fff;}
.lightMode .menuMH { color: #002469; }
.lightMode .menuList .menuMH .inputText{border-color: black;}
.lightMode .menuList .menuMH .menuSearchSubmit{color:black}
.lightMode #mobileMenu:checked + label div {background-color:rgb(0, 36, 105)}
.lightMode #mobileMenu:checked + label div:nth-child(3) {background-color:rgb(0, 36, 105)}
.lightMode #menuToggle div,.lightMode #menuToggle div:before,.lightMode #menuToggle div:after  {background: #525252;}

/*sub menu-item tables*/
.lightMode .menuMainBlock{width: 100%;background-color: #F0F0F0 !important;}
.lightMode .menuitem-table{background-color:#fff;}
.lightMode .menuBlock-header {font-weight: bold;background-color: #C6D3E3;}
.lightMode .menuItem i{color:#005491;}
.lightMode .menuItem a{color:#005491;}

/*Report*/
.lightMode .rptBasicBtn{color: white;background-color: #00205B;height: 18px;border-radius:20px;font-size: 11px;display: inline-block;padding:0px 10px;line-height: 1.75;}
.lightMode .rptBasicBtn a{color:white;text-decoration: none !important;}
.lightMode .rptBasicBtn a:hover{color:white !important;}
.lightMode #ReportGrid .rtpNumCol{font-family: Helvetica;text-align: right;padding-right: 10px;}
.lightMode #ReportGrid .dataTableCss .desc{ border-top-color: black; }
.lightMode #ReportGrid .dataTableCss .asc{ border-bottom-color: black; }
.lightMode #ReportGrid .dataTableCss .SearchOption .search .menuSearchSubmit{color:black}
.lightMode #ReportGrid .dataTableCss .SearchOption .search .inputText{border-color: rgb(0,0,0)}
.lightMode #ReportGrid.OutbackReport tr.Search{background-color:white ;border-top:1px solid gray}
/*.lightMode #ReportGrid.OutbackReport tr td{padding:0px}
.lightMode #ReportGrid.OutbackReport tr.Header td{padding:5px 0px}*/

/*slider*/


.lightMode .mainSlider{ background-color: #fff;color: black;}
.lightMode .cd-panel__container{background:white;color:black;}
.lightMode .cd-panel__header{background: rgba(255, 255, 255, 0.96);}
.lightMode .cd-panel__header h1 {color:black}
.lightMode .cd-panel__close::before,.lightMode .cd-panel__close::after{background-color: black;}

/* text Colors*/
.lightMode .greyText{color:rgba(0, 0, 0, 0.8); font-size: 12px;}
.lightMode .greenText{color:#008000;}
.lightMode .redText{color:red;}
.lightMode .whiteblackText{color: black;}
.lightMode .activeTab{color:black !important; border-bottom:2px solid black;}

/*colors for smaller section*/
.lightMode .background-blue{background-color: #bfd3ef;}
.lightMode .background-grey{background-color: #F0F0F0;}
.lightMode .background-whiteblack{background-color: white;}
.lightMode .partOrder .bulk{background-color: white;}
.lightMode .partOrder .bulk-list{background-color: white;}


  

/*sne drive images*/
.lightMode .imageLogo{max-height:155px; max-width:100%; content:url(../images/core/snedrive2.png);}
/*.lightMode .loginLogo{background-image: url('../images/core/snedrive2.png');background-position: center;background-repeat: no-repeat;background-size: contain;height:155px; }*/
.lightMode #block .newMenu .navSNElogo{background-image: url('../images/core/snedrive2.png');background-position: center;background-repeat: no-repeat;background-size: contain;height:60px; padding-top:10px;}
.lightMode #block .newMenu .retail-name{position: relative;text-align: center;top:5px;}
.lightMode .main .logoGridster .sneLogoMobile{background-image: url('../images/snedrive_mobile.png');background-position: center;background-repeat: no-repeat;background-size: contain;min-height: 55px;}

/* DARK MODE */

.darkMode .btn-blue{background-color: #1D4F91;color: white;}
.darkMode .btn-black{background-color: white;color: #1D4F91;}
.darkMode .btn-tertiary{background-color:#1179F7 ; color:white;}
.darkMode .btn-SecAction{background-color: #E5E5E5; color:#00205B;}
.darkMode .inputText{background-color: #222222;color: white;}
.darkMode .inputDate{background-color: transparent;filter: grayscale(100%) contrast(200%) invert(100%);border:2px solid}
.darkMode .textarea{background-color: #222222;color: white;}
.darkMode .angular-editor-wrapper{background-color: #222222;color: white;}
.darkMode .select{background-color: #222222;color: white;}
.darkMode .checkbox{border:1px solid lightgray}
.darkMode button[disabled] { background-color: #A6A6A6;cursor: default;}
/*.darkMode .disableInput{background-color: #111111;}*/
.darkMode input[type=text]:disabled {background-color: #111111;}
.darkMode select:disabled{background-color: #111111;}


/*login screen*/
.darkMode.loginScreen { background-color: #111111;}
.darkMode .loginData { border-radius: 5px; box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.5);}
.darkMode .loginData {background-color: #222222;color:white}
/*.darkMode .loginItem .forgot{color:#1D4F91}*/


/*.lightMode .pageWidget{background-color: #222222;}*/
.darkMode .mainPageWidget{background-color: #111111;}
.darkMode .widgetPageSection{background-color: #222222;color: white;}
.darkMode .widgetPageSectionPopup [ss-widget] {background-color: #222222;color: white;position: absolute;height:100%;width: 100%;}
.darkMode .gridster article{border:2px solid #888888 }

.darkMode .table-striped tr:nth-child(even) {background-color: #203859;}

/*main menu*/
.darkMode .main{background-color:#111111 ;color:white}
.darkMode .newMenu {box-shadow: 4px 0px 4px -2px rgba(0, 0, 0, 0.5);background-color: #222222;color:white;}
.darkMode .dashBoardHeader { color:white }
.darkMode .favMenuBox { background-color:#525252 }
.darkMode .overlay { color: #fff; }

.darkMode .topRightNavMenu i {color:white; }
.darkMode .topRightNavMenu i:hover {color:#f6f6f6; background-color: #525252;}
.darkMode .navHeader .subMenus{color: white; background-color: #222222;}

.darkMode a{ color:white; }
.darkMode .logoGridster{background-color: #222222;}
.darkMode .menuList .menuMH .searchStatus{background-color: #222222;}
.darkMode .menuList .menuMH .favStatus{background-color: #222222;}
.darkMode .menuMH { color: white; }
.darkMode .menuList .menuMH .inputText{border-color: white;}
.darkMode .menuList .menuMH .menuSearchSubmit{color:white}
.darkMode #mobileMenu:checked + label div {background-color:white}
.darkMode #mobileMenu:checked + label div:nth-child(3) {background-color:white}
.darkMode #menuToggle div,.darkMode #menuToggle div:before,.darkMode #menuToggle div:after {background: white;}

/*sub menu  item tables*/
.darkMode .menuMainBlock{width: 100%; }
.darkMode .menuitem-table{background-color:#525252;}
.darkMode .menuBlock-header {font-weight: bold;background-color: #203859;}
.darkMode .menuItem i{color:white;}
.darkMode .menuItem a{color:white;}


/*Report*/
.darkMode .rptBasicBtn{color: white;background-color: #00205B;height: 18px;border-radius:20px;font-size: 11px;display: inline-block;padding:0px 10px;line-height: 1.75;}
.darkMode .rptBasicBtn a{color:white;text-decoration: none !important;}
.darkMode .rptBasicBtn a:hover{color:white !important;}
.darkMode #ReportGrid .rtpNumCol{font-family: Helvetica;text-align: right;padding-right: 10px;}
.darkMode #ReportGrid .dataTableCss .desc{ border-top-color: #fff; }
.darkMode #ReportGrid .dataTableCss .asc{ border-bottom-color: #fff; }
.darkMode #ReportGrid .dataTableCss .SearchOption .search .inputText{border-color:#fff}
.darkMode #ReportGrid .dataTableCss .SearchOption .search .menuSearchSubmit{color:white}
.darkMode #ReportGrid.OutbackReport tr.Regular1{background-color: #203859;}
.darkMode #ReportGrid.OutbackReport tr.SearchOption td{background-color:#222222 !important;}
.darkMode #ReportGrid.OutbackReport .ReportOptions{background-color: transparent;}
.darkMode #ReportGrid.OutbackReport tr.Header td{background-color:#222222 !important;}
.darkMode #ReportGrid.OutbackReport tr.Header{background-color: #222222 !important; color:white ;}
.darkMode #ReportGrid.OutbackReport tr.Search{background-color:#222222 ;border-top:1px solid gray}



/*slider*/


.darkMode .mainSlider{ background-color: #666666;color: white;}
.darkMode .cd-panel__container{background:#666666;color:white;}
.darkMode .cd-panel__header{background: #666666;}
.darkMode .cd-panel__header h1 {color:white}
.darkMode .cd-panel__close::before, .darkMode .cd-panel__close::after{background-color: white;}

/* text Colors*/
.darkMode .greyText{color:rgba(255, 255, 255, 0.8); font-size: 12px;}
.darkMode .greenText{color:#86B500;}
.darkMode .whiteblackText{color: white;}
.darkMode .redText{color:red;}
.darkMode .activeTab{color:white !important; border-bottom:2px solid white;}

/*colors for small section*/
.darkMode .background-blue{background-color: #203859;}
.darkMode .background-grey{background-color: #333333;}
.darkMode .background-whiteblack{background-color: #222222;}
.darkMode .partOrder .bulk{background-color: #333333;}
.darkMode .partOrder .bulk-list{background-color: #333333;}

/*sne drive images*/
.darkMode .loginLogo{background-image: url('../images/core/snedrive_darkMode.png');background-position: center;background-repeat: no-repeat;background-size: cover;height:155px; padding-top:10px;}
.darkMode #block .newMenu .navSNElogo{background-image: url('../images/core/snedrive_darkMode.png');background-position: center;background-repeat: no-repeat;background-size: contain;height:80px; padding-top:10px;}
.darkMode #block .newMenu .retail-name{position: relative;text-align: center;top:-6px;}
.darkMode .main .logoGridster .sneLogoMobile{background-image: url('../images/snedrive-darkMode-mobile.png');background-position: center;background-repeat: no-repeat;background-size: contain;min-height: 55px;}
.darkMode .navHeader .topRightNavMenu .subarunetImage{filter: grayscale(100%) contrast(200%) invert(100%);}


@media only screen and (max-width:1280px) {  
        .ferrariDarkTheme #block .newMenu .test{color:black}
    .ferrariDarkTheme #block .newMenu .menulist {top:20px}
    .ferrariDarkTheme #block .newMenu .FerMasLogo {
        background-image:url('../images/FerMasMenuLogo.png');
         background-position: center;
         background-repeat: no-repeat;
         background-size: contain;
         height:80px;
         width:100%;
         position: absolute;
         bottom: 30px;
         filter: invert(1);}

         .ferrariLightTheme #block .newMenu .menulist {top:20px}
         .ferrariLightTheme #block .newMenu .FerMasLogo {
        background-image:url('../images/FerMasMenuLogo.png');
         background-position: center;
         background-repeat: no-repeat;
         background-size: contain;
         height:80px;
         width:100%;
         position: absolute;
         bottom: 30px;}
    
}


@media only screen and (max-width: 600px) {
    .ferrariTheme .loginItem{margin:10px auto}
    .ferrariTheme .imageLogo{max-height:155px; max-width:100%; content:url(../images/mobileFerrariImage.png);filter: none;}
  
   
}
@media only screen and (max-height:500px) and (min-width:480px){
    .ferrariTheme .loginForm { width: 100%; float: left;}
    .ferrariTheme .loginItem { margin: 10px auto }
}