/* ECA Joomla 4 User.css */

@import url(https://fonts.bunny.net/css?family=open-sans:300,300i,400,400i,500,500i,600,600i,700,700i,800i);
body {font-family: 'Open Sans', sans-serif;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {font-family: 'Open Sans', sans-serif;}

.metismenu.mod-menu .metismenu-item.active > a, .metismenu.mod-menu .metismenu-item.active > button, .metismenu.mod-menu .metismenu-item > a:hover, .metismenu.mod-menu .metismenu-item > button:hover {
  text-decoration: none;
}
/* Footer */
body.wrapper-fluid .grid-child {
  color: #000;
    /*color: #ffffff;*/
  max-width: none;
}

/* Header */

fluid header > .grid-child {
  padding-left: 2em;
  padding-right: 2em;

}

.grid-child {
  display: block ruby;
}
/*
.grid-child {
  display: block ruby;
}
*/
.container-header {
  background-image: none;
  /*background-image: linear-gradient(135deg,var(--cassiopeia-color-primary) 0,var(--cassiopeia-color-hover) 100%); */
 margin: 0 0 0rem;
 
}

/* Main Container */
/*Customize the height of the Banner Module*/

body:not(.has-sidebar-right) .site-grid .container-component {
  grid-column-end: side-l-start;
}
body:not(.has-sidebar-left) .site-grid .container-component {
  grid-column-start: side-r-end;
}

/* CLASSIC BANNER */
.container-banner .banner-overlay {
    height: max(300px, 50vh); /* by default is 50vh in Cassiopeia */
}
@media (min-width: 768px) {
    .container-banner .banner-overlay {
        height: max(300px, 45vh);
    }
}
@media (min-width: 992px) {
    .container-banner .banner-overlay {
        height: max(300px, 40vh);
    }
}
@media (min-width: 1200px) {
    .container-banner .banner-overlay {
        height: max(300px, 35vh);
    }
}

/* End of Custom height of the Banner module*/


/* Define Color variables See other examples below */
.colors1 {
  --website-color-1: #ffffff;
  --cassiopeia-color-primary: var(--website-color-1);
}

:root {
  --cassiopeia-color-primary: #ffffff;
  /*  --cassiopeia-color-primary: #ffffff; */
  --cassiopeia-color-link: #30638d;
  --cassiopeia-color-hover: #003300;

}

/* Images */
.circle.item-image {
    border-radius: 50%;
}

/* Table */
table, th, td {
  margin: 20px;
  border-color: white;
  /* align: center; */
  border: 0px solid;
  width: auto;
  border-collapse: collapse;
}


/* Menu */

a:hover a:hover {
  color: ##003300!important;
}

.container-header .navbar-toggler {
  border: 1px solid #003300;
  color: #003300;
  cursor: pointer;
}

.container-header .mod-menu > li > a, .container-header .mod-menu > li > span {
  /*color: currentColor;*/
  color: #000000;
  position: relative;
  text-decoration: none;
}
.metismenu.mod-menu .mm-toggler {
  /*color: currentColor;*/
  color: #003300;
}
.button-hover {
  color: 003300;
}
/* Footer */
.footer {
  background-color: #ffffff;
  background-image: none;
  color: #fff;
  margin-top: 1em;
}

.footer .grid-child {
   display: Block;
}


/* Other example of Useing the variables See: https://slides.woluweb.be/cassiopeia/cassiopeia.html 
.colors1 {
  --website-color-primary: 37, 143, 167;
  --website-color-hover: 242, 48, 48;
  --cassiopeia-color-primary: rgba(var(--website-color-primary),0.5);
  --cassiopeia-color-hover: rgb(var(--website-color-hover));
  --cassiopeia-color-link: rgb(var(--website-color-primary));
}
*/

/*
#header {

	width: 976px;
	height: 142px;
	background-image: url(https://evergreencommonshoa.org/images/slides-home-page/Slide-02.jpg);

}
*/
/* Buttons */
.btn-primary:focus, .btn-primary:hover {
  background-color: #339900;
  border-color: #339900;
}
.btn-primary:focus, .btn-primary {
  background-color: #275e2f;
  border-color: #275e2f;
}
.btn-primary {
   background-color: #275e2f; 
   border-color: #275e2f; 
}

#shadow-border {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-attachment: scroll;
    background-clip: border-box;
    background-color: #97FF97;
    /*background-color: #97FF97; */
    background-image: none;
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto auto;
    border-bottom-color: #adadad;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-image-outset: 0 0 0 0;
    border-image-repeat: stretch stretch;
    border-image-slice: 100% 100% 100% 100%;
    border-image-source: none;
    border-image-width: 1 1 1 1;
    border-left-color-ltr-source: physical;
    border-left-color-rtl-source: physical;
    border-left-color-value: #adadad;
    border-left-style-ltr-source: physical;
    border-left-style-rtl-source: physical;
    border-left-style-value: solid;
    border-left-width-ltr-source: physical;
    border-left-width-rtl-source: physical;
    border-left-width-value: 1px;
    border-right-color-ltr-source: physical;
    border-right-color-rtl-source: physical;
    border-right-color-value: #adadad;
    border-right-style-ltr-source: physical;
    border-right-style-rtl-source: physical;
    border-right-style-value: solid;
    border-right-width-ltr-source: physical;
    border-right-width-rtl-source: physical;
    border-right-width-value: 1px;
    border-top-color: #adadad;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-top-style: solid;
    border-top-width: 1px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 1) inset;
    clear: both;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    min-height: 50px;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
}

#comp-w { background:#ffffff; clear:both;margin:0 auto; padding:20px;  min-height:50px;  -webkit-border-radius:5px;-moz-border-radius:5px;-o-border-radius:5px;border-radius:5px; border:1px solid #adadad;

-webkit-box-shadow:inset 0 0 10px rgba(0, 0, 0, 1); -moz-box-shadow:inset 0 0 10px rgba(0, 0, 0, 1); box-shadow:inset 0 0 10px rgba(0, 0, 0, 1);}

#comp-a { background:#E4E4E4; clear:both;margin:0 auto; padding:20px;  min-height:50px;  -webkit-border-radius:5px;-moz-border-radius:5px;-o-border-radius:5px;border-radius:5px; border:1px solid #adadad;

-webkit-box-shadow:inset 0 0 10px rgba(0, 0, 0, 1); -moz-box-shadow:inset 0 0 10px rgba(0, 0, 0, 1); box-shadow:inset 0 0 10px rgba(0, 0, 0, 1);}


