/**********************user.css for cmo all **********************/
.site-grid{
/***change***/    background: var(--DAR-site-background);
}
.no-task{
/***change***/    background: var(--DAR-site-background);
}
body.wrapper-fluid header>.grid-child{
    padding-left: 0;
    padding-right: 0;
}
.responsive{
    width: 100%;
    height: auto;
}
/***********chapter name and location*********************/
.container-header .grid-child{
    padding: 0;
}
.container-below-top{
    background: var(--DAR-chapname-background);
    border-top: 5px solid var(--DAR-main-border);
    border-bottom: 5px solid var(--DAR-main-border);
   padding: 0;
}
/*********For White Template***************/
/***topbar*******/
.container-topbar{
    margin: 0;
    padding: 0;
}
/****for all cmo templates****/
#mod-custom90.mod-custom.custom,
#mod-custom124.mod-custom.custom{
   /*background: 50% 0% / 100% 100% no-repeat radial-gradient(farthest-corner at 50% 100%, #ffffffff 5%, #cf150dff 50%, #004990ff 80%);background-blend-mode: soft-light;*/
   background: var(--DAR-topbar-treatment);
}  
#mod-custom90.mod-custom.custom p,
#mod-custom90.mod-custom.custom p img,
#mod-custom124.mod-custom.custom p,
#mod-custom124.mod-custom.custom p img{
    margin: 0;
    padding: 0;
}

/*********For Blue Template***************/
/*********Blue Rays***************/
/*#mod-custom91.mod-custom.custom{
    height: 117px;
    width: 100%;
    background: var(--DAR-conic-gradient);
}*/

/*chap name and loc*/
#mod-custom88.mod-custom.custom {     /* styles chapter name and location*/
    /*margin: auto .5rem;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 0;*/
    width: 100%;
    background-image: var(--DAR-name-gradient);
}
#mod-custom88.mod-custom.custom p {         /* styles chapter name and location*/
    font-family: book antiqua, palatino, serif;
    font-size: 1.8rem;
    font-weight: bold;
    color: var(--DAR-chapname-text);
    text-align: center;
    filter: drop-shadow(1px 1px #000);
    
}

@media (width<=701px) {         /* styles chapter name and location when viewport <=701*/

    #mod-custom88.mod-custom.custom {     
        /*margin-right: 5px;
        margin-left: 1rem;
        margin-bottom: .1rem;
        color: var(--DAR-chapname-text);*/
    }
    #mod-custom88.mod-custom.custom p {
        font-family: georgia, palatino, serif;
        font-size: 1.2rem;
        font-weight: bold;
    }
}
/*********sidebar right*********/
.sidebar-right.card{
   background: var(--DAR-site-background);     /*side-bar*/
   border: 2px solid var(--DAR-main-border);
   width: 15rem;
   text-align: center;
}
.sidebar-right.card a{
    color: var(--DAR-right-side-link);
    text-decoration: underline;
    font-weight:bold;
}
.sidebar-right.card a:hover{
    background: var(--DAR-right-side-lnk-hvr);
    color: var(--DAR-right-side-lnk-hvr-txt);
}

/***********Main article component*********************/
.container-component main{              /*article title and body*/
    border: 10px solid var(--DAR-main-border);
    background: var(--DAR-main-bkg);
    color: var(--DAR-main-content-text);
    padding: 20px;
     margin-left: auto;
   float: left;
   width: 100%;
}

/***********Nav formatting*********************/

/* container for top nav*/
.container-header{
    background: var(--DAR-site-background);                
}
.container-header nav,
.container-header .container-nav nav{
    margin-top: 0;
}
.container-nav{
    background: var(--DAR-site-background);           /* nav background*/
    border-bottom:var(--DAR-chapname-border) solid 2px;
    display: grid;
    grid-gap: 10px;
    grid-template-columns: 9em 1fr; 
    
}

.icon-menu {
    color: var(--DAR-menu-item);
}
.container-header .navbar-toggler{
    color: var(--DAR-menu-item);
    border: 1px solid var(--DAR-menu-item);
    margin-top: 0;
}

/* underlines the active menu item and the top level items (when hovered) */
/***Main menu styling***/
.metismenu.mod-menu .metismenu-item{      /*sets style for level-1 items*/
    padding: 0em .75em;
    color: var(--DAR-menu-item);
}

.mod-menu li a {   
   font-weight: bold;
   list-style: none;                            /* removes bullets*/
   margin: 1.0em 1.5em 1.0em 5.0em;             /* spaces the menu items*/
}
.mod-menu li:hover a{
    background: var(--DAR-menu-lnk-hvr);
    color: var(--DAR-menu-lnk-hvr-txt);
    
}

.mod-menu > li.parent {
  position: relative;
}

.mod-menu .active{
    text-decoration: underline; /* underlines the active menu item */
}
/*still need this????????????????*/
.container-header .mm-collapse.mm-show{                             /*needs to have .container-header*/
     background: var(--DAR-site-background);        
     display: flex;
}
/*styles the level-2*/

.mod-menu li.parent:hover > ul.mm-collapse {
  background-color: var(--DAR-site-background);   /*background of drop*/
  border: 1px solid var(--DAR-drop-border);
  border-radius: 5px;
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
 
}
.mm-collapse >li{
   margin: .25em 0;
   border-bottom: 1px solid var(--DAR-chapname-border);
   font-weight: normal;
   width: auto;
   
}
/***styles the second level menu items*/
.mod-menu.mod-menu_dropdown-metismenu.metismenu.mod-list .level-2 > a{
    color: var(--DAR-menu-item);
    background: var(--DAR-site-background);
    margin-left: 0px;
    font-weight: bold;
    font-size: .75em;
               
}

.mod-menu.mod-menu_dropdown-metismenu.metismenu.mod-list .level-2 a:hover{
    color: var(--DAR-menu-lnk-hvr-txt);
    background:  var(--DAR-menu-lnk-hvr);
}  
@media (width>=992px) {
    .container-header .mod-menu {
        flex-direction: row;
        flex: fit-content;
        display: flex;
        flex-wrap: wrap;
    }
}


/***********sidebr nav************/
#navbar96.collapse.navbar-collapse{
    margin: auto;
}
#navbar96.metismenu.mod-menu .metismenu-item{      /*sets style for level-1 items*/
    padding: 0em 1em;
    color: var(--DAR-menu-item);
}

#navbar96.mod-menu li a {   
   font-weight: bold;
   list-style: none;                            /* removes bullets*/
   margin: 1.0em 1.5em 1.0em 5.0em;             /* spaces the menu items*/
}
#navbar96.mod-menu li:hover a{
    background: var(--DAR-menu-lnk-hvr);
    color: var(--DAR-menu-lnk-hvr-txt);
    
}

/******content styling******/

.page-content p{
    margin-top: 10px;
	margin-bottom: 20px;
	font-size: 1em;
 }
.page-content h1{
	margin-top: 10px;
	margin-bottom: 20px;
	font-weight: bold;
	font-size: 2.0rem;
	top: 0px;
    color: var(--DAR-heading-text);
 }
 .page-content h2{
    color: var(--DAR-heading-text);
    font-weight: bold;
    text-decoration: none;
    font-size: 1.5em;
    margin-top: .2em;
 }
 .page-content h3{
    color: var(--DAR-heading-text);
    font-weight: bold;
    text-decoration: none;
    font-size: 1.35em;
    margin-top: .2em;
 }
.page-content h4{
     color: var(--DAR-heading-text);
    font-weight: bold;
    text-decoration: none;
    font-size: 1.25em;
    margin-top: .2em;
 }
 .page-content h5{
     color: var(--DAR-heading-text);
    font-weight: bold;
    text-decoration: none;
    font-size: 1.2em;
    margin-top: .2em;
 }
 
 .page-content h6{
     font-size:0;
 }
.page-content p a {
	text-decoration: underline;
	font-weight: bold;
    color: var(--DAR-page-content-link);
}
.page-content p a:hover, .page-content h3 a:hover {
    color: var(--DAR-page-content-lnk-hvr-txt);
    background:  var(--DAR-page-content-lnk-hvr-bg);
}
.page-content p img,
.page_content td img{
    margin: 0 .2rem;
    
}
.page-content ul {
	padding: 0;
	margin-left: 20px;
	margin-bottom: 20px;
}
.page-content ul li {
	/*font-family:Lucida Sans, sans-serif;*/
	color: var(--DAR-main-content-text);
	font-size: 1em;
	list-style: disc;
}
.page-content ul li a {
    color: var(--DAR-page-content-link);
	font-weight: bold;
	margin: 0 0 3px 0;
	text-decoration: underline;
}
.page-content ul li a:hover {
    background-color: var(--DAR-page-content-lnk-hvr-bg);
	color: var(--DAR-page-content-lnk-hvr-txt);
}
/*general table*/
table {
	vertical-align:top;
	border-color: var(--cassiopeia-table-border-color) solid 1px;
	width:100%;
	margin-bottom:1rem
}
.page-content table tbody tr td a,
.page-content table tbody tr td li a{
	text-decoration: underline;
	font-weight: bold;
    color: var(--DAR-page-content-link);
}
.page-content table tbody tr td a:hover,
.page-content table tbody tr td li a:hover{
    color: var(--DAR-page-content-lnk-hvr-txt);
    background:  var(--DAR-page-content-lnk-hvr-bg);
}
/***********Tables***************/
.table {
--table-color-type:initial;
--table-bg-type:initial;
--table-color-state:initial;
--table-bg-state:initial;
--table-color:var(--emphasis-color);
--table-bg:var(--body-bg);
--table-border-color:var(--DAR-table-border-color);
--table-accent-bg:transparent;
--table-striped-color:var(--DAR-emphasis-color);
--table-striped-bg:rgba(var(--DAR-emphasis-color-rgb), .25);
--table-active-color:var(--emphasis-color);
--table-active-bg:rgba(var(--emphasis-color-rgb), .1);
--table-hover-color:var(--emphasis-color);
--table-hover-bg:rgba(var(--emphasis-color-rgb), .075);
	vertical-align:top;
	border-color:var(--DAR-table-border-color);
	width:100%;
	margin-bottom:1rem
}



/**********Patriots************/

#patriots {
	font-size: .85em;
	font-weight: normal;
	line-height: 1.5em;
	padding: .2em;
	background: var(--DAR-main-bkg);
	margin: 10px;
	width: 99%;
	border:1px solid var(--DAR-dark-heading-text);
}
@media (width<=992px) {
   #patriots{
    font-size: .85em;
    padding: .1em;
    margin: 5px;
}
}
@media (width<=543px) {
   #patriots{
    font-size: .65em;
    padding: .05em;
    margin: 2px;
}
}
#patriots td{
    border-left:1px solid var(--DAR-dark-heading-text);
}
#patriots p {
	
	margin: 0;
	padding: .1em;
	tesxt-align: left;
}
#patriots h5 {
    
    color: var(--DAR-heading-text);
    font-weight: bold;
    text-decoration: none;
    font-size: 1.2em;
    text-align: center;
    margin-top: .2em;
 }


ul.mod-menu.mod-menu_dropdown-metismenu.metismenu.mod-list.menu-horizontal.full-width{
    width: 100%;
}
#mod-custom99.mod-custom.custom{
    width: 100%;
}
#mod-custom124.mod-custom.custom{
    width: 100%;
}
/************Footer Content*********************/
.container-footer{
    background: var(--DAR-footer-background);
    border-top: 5px solid var(--DAR-chapname-border);
}

/*#mod-custom124.mod-custom.custom p a{
    color:var(--DAR-footer-text);
    font-weight:bold;
    text-decoration: underline;
}
#mod-custom124.mod-custom.custom p a:hover{
    background: var(--DAR-footer-lnk-hvr);
    color:var(--DAR-footer-lnk-hvr-txt);
}
#mod-custom124.mod-custom.custom {
   width: 100%;
   padding-right: 1.5rem;
   padding-left: 2rem;
   float:left;
}*/
/*Footer text*/
.footer.grid-child{
    display: block;
}
/*Footer Text For J4Clean*/
/*don't use 118 for other sites*/
/*#mod-custom118.mod-custom.custom p a{
    color:#fff;
}
#mod-custom118.mod-custom.custom p a:hover{
    background: var( --DAR-site-background);
    color:var(--DAR-page-content-link-hvr-txt);
}
#mod-custom118.mod-custom.custom {
   width: 70%;
   padding-right: 1.5rem;
   padding-left: 2rem;
   float:left;
}*/
/**********webmaster login menu on home page************/
/* Webmaster menu For J4clean 9*/
li.nav-item.item-129 a{
    color: var(--DAR-footer-text);
    float: right;
    width: 150px;
}
li.nav-item.item-129 a:hover{
    background: var(--DAR-footer-lnk-hvr);
    
}
.nav-item.item-129::marker  {
    color: var(--DAR-footer-background);
}

/*Wemaster menu*/

/*use the menu item number*/
li.nav-item.item-114 a,
li.nav-item.item-209 a {
    color: var(--DAR-footer-text);
    float: right;
    width: 150px;
}
li.nav-item.item-114 a:hover, 
li.nav-item.item-209 a:hover {
    background: var(--DAR-footer-lnk-hvr);
    color:var(--DAR-footer-text);
}
.nav-item.item-114::marker, 
.nav-item.item-209::marker{
    color: var(--DAR-webmaster-marker) !important;
}




/***login button***/


/*********login*****/
#jtl button.login-toggle121{
    /*margin: 1px 10px !important;*/
    margin-left: 2em !important;
    border: 1px solid var(--DAR-btn-brdr) !important;
    color: var(--DAR-btn-txt);
    background: var(--DAR-btn-background);
    padding: 2px 15px !important;
}
button.login-toggle121.login{
    background: var(--DAR-button-background);
    color: var(--DAR-btn-brdr);
    border: 1px solid var(--DAR-btn-brdr);
    font-weight: bold;
    height: 2rem;
    margin-bottom: .2rem;
}
.btn.btn-primary{
    background: var(--DAR-chapname-border);  
}
button.btn.btn-primary{
  color: var(--DAR-btn-txt);
  background: var(--DAR-btn-background);
  font-weight: bold;
  width: 6rem;
  height: 2rem;
  border: 1px solid var(--DAR-btn-brdr);
  margin-left: 2em;
  padding:0;
}
button.btn.btn-primary.btn-block{
    background: var(--DAR-btn-background);
    color: var(--DAR-btn-txt);
}

/**********not sure this is needed***************/
input#modlgn-username-16.form-control,
input#modlgn-passwd-16.form-control{
	width: 150px !important;
	height: 50px !important;
	background: #004990;
	color: #fff;
	float: left;
	padding-right: 5px;
}
p.updated{
    width: 70%;
    padding-left: 4.2em;
    display: flex;
}