
:root {
    background: black;
    font-size: 16px;
    padding: 0px;
    margin: 0px;

    --primary-color: rebeccapurple;
    --secondary-color: #536390;
    --tableBG-color: #7733ff;
    --Menu-bg-color: #1E2225;
    --Menu-link-color: #d8d8d8;
    --Menu-Hover-color: black;
    --font-color: white;
    --header-color: #33FFBD;
    --link-color: #33FFBD;
    --link-hover: #ff3355;
    --Selected-link-hover: #7733ff;
    --input-BG-color: lightgray;
    --Button-bg-Color: black;
    --Button-Color: White;
    --TransitionTime: 300ms;
    --Box-Shadow: 0px 4px 10px 0px rgba(0,0,0,.1);
}

.darkMode{filter: invert(100%);transition:1300ms;}

.lightMode{filter: invert(0%);transition:1300ms;}

.dontDarkMode{filter: invert(100%);transition:1300ms;}

*{margin: 0;}
*{margin: 0;}

html{background-color:black;font-family: 'Poppins', sans-serif;}


h1,h2,h3,h4,h5,p,td{color:white;}

input{background-color: black;color:white;border:solid 1px white;}

.main {margin-left:140px;padding:5px;position: relative;z-index:0;background-color: black;}


/*top menu case start */

.flex-container{
    display:flex;
    flex-wrap:nowrap;
    background-color:black;
    z-index:2;
    }
    
    .flex-container div{
    flex: 1 ;
    border-radius: 5px;
    margin:5px;
    height:110px;
    text-align: center;
    background-color:rgb(43, 43, 43);
    transition: 300ms;
    }
    
    .flex-container div:hover{
        background-color:white;
    }
    
    /*top menu case end */

   /*top menu items start */  
.SubMenuItems {
    margin:auto;
    display:block;
    background: linear-gradient(180deg, rgb(29, 29, 29) 0%, rgba(29, 29, 29) 30%, rgba(66,66,66,1) 30%);
    color:white;
    font-size: 16px;
    height: 120px;
    width: 100vw;
    text-align: center;
    transition:200ms;
    }
    .SubMenuItems:hover{background: linear-gradient(180deg, rgb(89, 89, 89) 0%, rgba(89, 89, 89) 30%, rgb(252, 252, 252) 30%);}
    
    .SubMenuItems::after{
        display:flex;
        font-family: "Font Awesome 5 Pro"; font-weight: 900;
    display: inline-block;
    font-size: 35px;
    position: relative;
    top:20px;
    text-align: center;
    width:100%;
    margin:auto;
    transition:200ms;   
    }
    
    .SubMenuItems:hover::after{color:black;font-size:45px;}

/*top menu items end */  


/*merchant menu labels start */  
.overview{}
.overview::after{
content: "\f859";}

 .merchant{}
 .merchant::after{
content: "\f509";}

.financials{}
.financials::after{
content: "\f81d";}

.data{}
.data::after{
content: "\f659";}

 .notes{}
 .notes::after{
 content: "\f5ad";}

 .stips{}
 .stips::after{
 content: "\f46d";}

 .support{}
 .support::after{
 content: "\f82d";}

 .ledger{}
 .ledger::after{
 content: "\f00b";}
/*merchant menu labels end */ 

/*admin menu labels start */ 
.accounting{}
.accounting::after{
content: "\f64c";}

.syndication{}
.syndication::after{
content: "\f233";}

.reports{}
.reports::after{
content: "\f65b";}

.hr{}
.hr::after{
content: "\f509";}

.nucleus{}
.nucleus::after{
content: "\f5d2";}

.misc{}
.misc::after{
content: "\f5fd";}
/*admin menu labels end */ 

/*ISO menu labels start */ 
.isooverview{}
.isooverview::after{
content: "\f1ad";}


.isoinfo{}
.isoinfo::after{
content: "\f4ff";}

.isoportfolio{}
.isoportfolio::after{
content: "\f737";}

.isosubmissions{}
.isosubmissions::after{
content: "\f00b";}

.isocommissions{}
.isocommissions::after{
content: "\f4d3";}
/*ISO menu labels end */ 


/*Sales menu labels start */  

.pending{}
.pending::after{
content: "\f109";}



.renewals{}
.renewals::after{
content: "\f1b8";}

 .opencontracts{}
 .opencontracts::after{
content: "\f573";}

.openoffers{}
.openoffers::after{
content: "\e022";}

/*Sales menu labels end */  


/*collections menu labels start */ 
.covid{}
.covid::after{
content: "\e063";}


.inhouse{}
.inhouse::after{
content: "\f609";}

.legal{}
.legal::after{
content: "\f516";}

.bk{}
.bk::after{
content: "\f0e3";}

.default{}
.default::after{
content: "\f6b7";}
/*collections menu labels end */ 










   /*merchant overview folder start - folder to far left on merchant overview */  
   .merchantFiles {
    margin:auto;
    display:block;
    background: linear-gradient(180deg, rgb(29, 29, 29) 0%, rgba(29, 29, 29) 30%, rgba(66,66,66,1) 30%);
    color:white;
    font-size: 16px;
    height: 120px;
    width: 100vw;
    text-align: center;
    transition:200ms;
    }
    .merchantFiles:hover{background: linear-gradient(180deg, rgb(89, 89, 89) 0%, rgba(89, 89, 89) 30%, rgb(252, 252, 252) 30%);}
    
    .merchantFiles::after{
        display:flex;
        font-family: "Font Awesome 5 Pro"; font-weight: 900;content: "\f64b";
    display: inline-block;
    font-size: 35px;
    position: relative;
    top:20px;
    text-align: center;
    width:100%;
    margin:auto;
    transition:200ms;   
    }
    
    .merchantFiles:hover::after{color:black;font-size:45px;}

/*merchant overview folder end */  


.LoaderDiv{
height:100vh;
width:100vw;
position:fixed;
top:0px;
vertical-align: middle;
text-align: center;
z-index: 9999999
}


.MerchantMenuCase{
position: fixed;
top:0px;
margin: 0;
left:145px;
width: calc(100% - 140px);
z-index: 2;}

.mainNoHeadMenu{top:0px;
    margin: 0;
    position: relative;
    left:150px;
    height: 100vh;
    width: calc(100vw - 151px);
    z-index: 2;
background-color:black;}

.underMenu{height:115px;width:100%;background-color: black;}

.adminTable{width: calc(100vw - 153px);margin-left:5px;background-color: black;border-spacing: 5px;}
.adminTable th{border:none;background-color:rgb(97, 97, 97);height:40px;font-size:25px;vertical-align:center;color:#00ffff}
.adminTable td {text-align: center;background-color: rgb(45, 45, 45) ;transition:200ms;border-radius: 5px;width:20%;height:55px;margin:20px;}

.adminTable td:hover{background-color:white;color:black;}

.adminTable td:hover{background-color:white;color:black;}

.dashBoardTable{width: calc(100vw - 180px);float:LEFT;border-spacing:5px;}

.dashBoardTable th{text-align:center;border:none;padding:10px;font-size:20px;letter-spacing:5px;font-family: 'Poppins',sans-serif;color:#00ffff;}

.dashBoardTable td {height:60px;background-color: rgb(58, 58, 58);color:var(--Menu-link-color);border:solid 1px white;text-align:center;border-radius:5px;font-family: 'Poppins',sans-serif;transition:200ms;font-size:16px;}

    .dashBoardTable td hr {border-top: none;border-bottom:none;}
.navigation{
position: fixed;
top:0px;
left:0px;
width: 150px;
height: 100vh;
display:flex;
flex-wrap:nowrap;
flex-direction:column;
align-items:center;
background-color:black;
z-index:4;

}



.ISOOVERVIEW{width: calc(100vw - 180px);float:LEFT;border-spacing:5px;}

ISOOVERVIEW Table{width: calc(100vw - 180px);}

.ISOOVERVIEW Table th{text-align:center;border:none;padding:10px;font-size:20px;letter-spacing:5px;font-family: 'Poppins',sans-serif;color:#00ffff;text-transform: uppercase;}

.ISOOVERVIEW Table td {height:50px;background-color: rgb(34, 34, 34);color:var(--Menu-link-color);text-align:left;font-family: 'Poppins',sans-serif;transition:200ms;font-size:14px;
width: calc((100vw - 180px)/6);border-radius:5px;border: solid 1px white;}

.ISOOVERVIEW Table td hr {border-top: none;border-bottom:none;}

.ISOMetrics{width: calc(100vw - 180px);float:LEFT;border-spacing:5px;font-size:16px;box-shadow:0px 0px 15px  #007b7b,0px 0px 10px #00ffff,0px 0px 1px black;margin: 20px 0px;border-radius: 5px;}

.ISOMetrics table {width:100%;height:100px;background-color: rgb(24, 24, 24);border-radius:5px;padding:5px;}

.ISOMetrics td:nth-child(even){
    color:#00ffff;font-weight: bold;   
    }
    
    .ISOMetrics td:nth-child(odd){
            color:rgb(203, 203, 203);   
            }

.navigation{
position: fixed;
top:0px;
left:0px;
width: 150px;
height: 100vh;
display:flex;
flex-wrap:nowrap;
flex-direction:column;
align-items:center;
background-color:black;
z-index:4;

}







.navigation input {flex: 1 ;
text-align:center;
text-decoration: none;
font-size:15px;
text-transform:uppercase;
color:black;
border: solid 0px red;
border-radius: 5px;
background-color:white;
margin:3px;
height:30px;
padding:5px;
width:120px;
transition: 300ms;}

.navigation a{
flex: 1 ;
text-align:center;
text-decoration: none;
font-size:15px;
text-transform:uppercase;
color:white;
border-radius: 5px;
background-color:rgb(135, 135, 135);
margin:3px;
height:100%;
padding:5px;
width:120px;
transition: 300ms;
}

.navigation a:hover{background-color:rgb(60, 60, 60);color:white}

.navigation div{
text-align:center;
height:100%;
text-decoration: none;
font-size:15px;
text-transform:uppercase;
color:black;
border-radius: 5px;
margin:3px;
padding:5px;
width:140px;
transition: 300ms;
}



.switch {flex: 1 ;
  position: relative;
  display: inline-block;
width:130px;
  border-radius:5px;
  
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {flex: 1 ;
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;

 vertical-align: middle;
 justify-content: center;
 background-color:rgb(135, 135, 135);
  border-radius: 5px;
  -webkit-transition: .4s;
  transition: .4s;
  margin-top:3px;
}

.slider:before {flex: 1 ;
    display: block;position: relative;text-align: center;
  font-size: calc(3.6vh);
  height:100%;
  width: 65px;
  color:white;
  border-radius: 5px;
  background-color: rgb(187, 187, 187);
  -webkit-transition: .4s;
  font-family: "Font Awesome 5 Pro"; font-weight: 900;content: "\f0eb";
  transition: .4s;
}

.slider:after{ content: "";}

input:checked + .slider {
  background-color: #3f3f3f;
}

input:focus + .slider {
  box-shadow: 0 0 1px #3f3f3f;
}

input:checked + .slider:before {
  -webkit-transform: translateX(65px);
  -ms-transform: translateX(65px);
  transform: translateX(65px);
}


.overviewBusinessFlex-container{
display:flex;
flex-wrap:nowrap;
background-color:black;
z-index:2;
}

.overviewBusinessFlex-container div{
    flex: 1 ;
border-radius: 5px;
margin:5px;
height:280px;
text-align: center;
background-color:rgb(43, 43, 43);
transition: 300ms;
}

.overviewBusinessFlex-container section{
    background-color:rgb(26, 26, 26);
width:100%;
transition: 300ms;
height:25px;
margin: auto;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
color:#00ffff;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

.overviewBusinessFlex-container table{width:100%;height:230px;text-align:left;}


.overviewBusinessFlex-container td:nth-child(even){
color:white;font-weight: bold;   
}

.overviewBusinessFlex-container td:nth-child(odd){
color:rgb(203, 203, 203);   
}

.pageTitle{height:50px;font-size:30px;text-align:center;color:#00ffff;vertical-align: center;padding:36px;letter-spacing:30px;margin-bottom:10PX;background-color: rgb(41, 41, 41);}


.TDMap{width:350px;}    

.map-container {
border-radius: 5px;
max-width:300px;
height:280px;

}

.map-container iframe {
border-radius: 5px;
padding: none;
}



.overviewOwnerFlex-container{
display:flex;
flex-wrap:nowrap;
background-color:black;
z-index:2;
}

.overviewOwnerFlex-container div{
    flex: 1 ;
border-radius: 5px;
margin:5px;
height:190px;
text-align: center;
background-color:rgb(65, 65, 65);
transition: 300ms;
}

.overviewOwnerFlex-container section{
    background-color:rgb(26, 26, 26);
width:100%;
transition: 300ms;
height:25px;
margin: auto;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
color:#00ffff;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

.overviewOwnerFlex-container table{width:100%;height:140px;text-align:left;}


.overviewOwnerFlex-container td:nth-child(even){
color:white;font-weight: bold;   
}

.overviewOwnerFlex-container td:nth-child(odd){
color:rgb(203, 203, 203);   
}

.googleSearch{width:100%;color:#00ffff;text-align:center;font-size:16px;background-color:#353535;transition:200ms;border-radius:5px ;}


.googleSearch:hover{background-color:white;color:black;}




.bankAggregateFlex-container{
display:flex;
flex-wrap:nowrap;
background-color:rgb(33, 33, 33);
z-index:2;
min-width: calc(100vw - 180px);
font-size:16px;
}

.bankAggregateFlex-container div{
    flex: 1 ;
border-radius: 5px;
margin:5px;
height:200px;
text-align: center;
background-color:rgb(65, 65, 65);
transition: 300ms;
}

.bankAggregateFlex-container section{
    background-color:rgb(26, 26, 26);
width:100%;
transition: 300ms;
height:25px;
margin: auto;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
color:white;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

.bankAggregateFlex-container table{width:100%;height:140px;text-align:left;}

.bankAggregateFlex-container th{height: 25px;text-align: center;background-color:rgb(65, 65, 65);color:#00ffff;}

.bankAggregateFlex-container td:nth-child(even){
color:white;font-weight: bold;   
}

.bankAggregateFlex-container td:nth-child(odd){
color:rgb(203, 203, 203);   
}

A:hover {
    color: var(--link-hover);
}

td{color:var(--Menu-link-color)}


input:focus, textarea:focus, select:focus{
outline: none;}    

Button {
    border: solid 1px var(--Button-Color);
    background-color: var(--Button-bg-Color);
    color: var(--Button-Color);
    transition: var(--TransitionTime);
    padding: 5px;
    border-radius: 0px;
    font-family: 'Julius Sans One', sans-serif;
    text-transform: uppercase;
    box-shadow: var(--Box-Shadow);
    font-size: 1rem;
    white-space: nowrap;
    letter-spacing: .2rem;
}
Button:hover {
    border: solid 1px var(--Button-bg-Color);
    background-color: var(--Button-Color);
    color: var(--Button-bg-Color);
    transition: var(--TransitionTime);
}


.offerButton {
    border: solid 1px var(--Button-Color);
    background-color: var(--Button-bg-Color);
    color: var(--Button-Color);
    transition: var(--TransitionTime);
    padding: 5px;
    border-radius: 0px;
    font-family: 'Julius Sans One', sans-serif;
    text-transform: uppercase;
    box-shadow: var(--Box-Shadow);
    font-size: 1rem;
    white-space: nowrap;
    text-align: center;
    letter-spacing: .2rem;
    width:calc(100vw - 190px);}

.offerButton:hover{border: solid 1px var(--Button-bg-Color);
    background-color: var(--Button-Color);
    color: var(--Button-bg-Color);
    transition: var(--TransitionTime);}



.SubmitButton {
    border: solid 1px var(--Button-Color);
    background-color: var(--Button-bg-Color);
    color: var(--Button-Color);
    transition: var(--TransitionTime);
    padding: 4px 10px 4px 10px;
    border-radius: 0px;
    font-family: 'Julius Sans One', sans-serif;
    text-transform: uppercase;
    box-shadow: var(--Box-Shadow);
    font-size: 1rem;
    white-space: nowrap;
    letter-spacing: .2rem;
    position: relative;
    top:-10px;
}
.SubmitButton:hover {
    border: solid 1px var(--Button-bg-Color);
    background-color: var(--Button-Color);
    color: var(--Button-bg-Color);
    transition: var(--TransitionTime);
}
.collectionButtonsCase{
position: fixed;
min-height:20px;z-index: 3;background-color: black;width:100%;
}

.collectionStatusButton{
width:calc(100% - 150px);
}

.hrSpread{border-top: 0px dashed #545454;height:1px;background-color: black;
    border-bottom: none;
    width:calc(100vw - 190px);height:1px;}

.MerchantPageModule{overflow: hidden;}



.MerchantSubModule {width: 100%;
padding:1rem;
border-radius: 5px;
background-color: #141313;
margin-bottom: 3px;}

.MerchantSubModule th{background-color:#262525;color:#00ffff;font-family: 'Mulish', sans-serif;font-size:20px;letter-spacing:3px;border-radius:5px;text-align:center;padding:10px;text-transform: uppercase;}

.MerchantSubModule td:nth-child(even){
color:white;font-weight: bold;   
}

.MerchantSubModule td:nth-child(odd){
color:rgb(203, 203, 203);   
}

.aboutDocsModal{
    height:30vw;
    width:97vw;
    position: fixed;
    bottom:0px;
    vertical-align: middle;
    text-align: center;
    z-index: 9999999;
    margin: 0 auto;
    background-color:black;
    display: none;
    justify-content: center;
    border:solid 20px #2b2b2b;
    align-content: center;
    text-align: center;
    transition: 500ms;
}

/*Vertical bars at top of Data Tab */
.Merchantdata {min-width:calc(100vw - 180px);}

.Merchantdata table {border-collapse: collapse;}

.Merchantdata th{color:#00ffff}

.merchantDataBarCase{
width:20%;height:100px;background: linear-gradient(180deg, rgb(53, 53, 53) 0%,
 rgb(210, 210, 210) 100%);vertical-align: bottom;color:white;font-size:18px;margin:0;border:solid 1px white;font-family: 'Mulish', sans-serif;}


 .merchantDataBar{width:100%;background-color:#00ffff;min-height:20%; height:70%;text-align:center;color:black;}
/* horizontal Bars on top of the funding module page */ 

.recoupBar{
background-color:#07d0dd;
min-width:15%;
color:black;
width:85%;
max-width:100%;
height: 100%;
text-align: left;
transition: 200ms;
padding-left:5px}


.completeBar{
background-color:#07d0dd;
min-width:15%;
width:30%;
max-width:100%;
color:black;
text-align: left;
transition: 200ms;
padding-left:5px }

.completeBar:hover,.recoupBar:hover{
opacity:0.7;}




#docGenMenu{float:left;background-color:#141313;color:var(--Menu-link-color) ;padding:5px;font-size:15px;border: solid .02rem var(--Menu-link-color);text-align:center;}


.docGenButton{background-color:#141313;color:white ;padding:5px;font-size:15px;width:100%;box-shadow:none;font-family: 'Mulish', sans-serif;border: solid .02rem var(--Menu-link-color);}

.docGenButton:hover{background-color:var(--header-color);color:black;font-family: 'Mulish', sans-serif;}

.emailMerchantButton {display:inline; float:left;text-align:center;background-color:#141313;color:white ;padding:5px;font-size:15px;width:25%;box-shadow:none;font-family: 'Mulish', sans-serif;border: solid .02rem var(--Menu-link-color);}
    
.emailMerchantButton:hover{background-color:var(--Menu-link-color); ;} 

.popUpNoteClosed {background-color:rgb(159, 159, 159);position:fixed;bottom:0px;right:6px;height:50px;z-index:3;
    width: 50px;transition:300ms;border-radius:50%;text-align:center;border: solid 2px white;vertical-align:bottom;font-size:32px;color:white;}

    .popUpNoteOpen {background-color:black;position:fixed;bottom:0px;right:6px;height:calc(100vh - 160px);z-index:3;
    width: 460px;transition:300ms;border-radius:5px;border: solid 20px rgba(128, 128, 128, 0.523);}

 

.displayNone{display:none;}

.displayBlock{display:block;}
