@charset "UTF-8";

:root {
  --cassiopeia-color-primary: #837E7C;
  --cassiopeia-color-hover: #837E7C;
  --cassiopeia-color-link: #837E7C;
}

.nomobile {
  display: none;
}


.sitebanner {
  min-width: 85%;
  height: 6vh;
  
}

.container-footer {
    background-color: #fff;
    background-image: none;
  	text-align: center;
  	height: 12vh;
}

.container-footer .p1{
    text-align: center;
}

* {
  box-sizing: border-box;
}

.zoom {
  padding: 2px;
  transition: transform .5s;
  width: 200px;
  height: 200px;
  margin: 0 auto;
}

.zoom:hover {
  -ms-transform: scale(1.5); /* IE 9 */
  -webkit-transform: scale(1.5); /* Safari 3-8 */
  transform: scale(1.5); 
}


/* Menu */

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

.header .mod-menu li:hover > ul {
  background-color: #fff;
  border: 1px solid #dfe3e7;  
  border-radius: 5px;
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 250px;
  padding: 16px;
}

.header .mod-menu li:hover > ul li {
  display: block;
}

/* Override the lila background with white */
.container-header {
    background-color: white;
    background-image: none;
  	height: 12vh;
}

/* Text should now be white */
.container-header .mod-menu {
  	background-color: #3a60a2;
        color: #ffffff;
   }


/* We add padding and radius so that on hover there is a nice background */
.container-header .mod-menu a {
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px; 
    padding: 3px 15px;
    color: #0088cc;
  	font-size: 15px /* Menu font size */
}

/* On hover there should be a dark gray background*/
.container-header .mod-menu a:hover {
    background-color: #484a5c;
}

/* We need to change the color of the Hamburger Menu because white on white is not good */
.container-header .navbar-toggler {
    color: #0088cc;
    border: 1px solid #0088cc;
    background-color: #eee;
  }


 

/*.container-below-top {
    background-color: white;
    background-image: none;
  	height: 25vh;
}*/

div.container-banner {
	margin: 20px 0 15px;
}

p.footctr{
  display: block;
  font-size: 110%;
  color: #fff;
  text-align: center;
}

p.artnote{
  display: block;
  font-size: 95%;
  color: #a66813;
  text-align: justify;
}


p.arthd{
  font-size: 175%;
  color: #0f8656;
  text-align: left;
}

p.artbdy{
  display: block;
  font-size: 105%;
  color: #0f8656;
  text-align: justify;
}


p.artbdyt2{
  display: block;
  font-size: 100%;
  color: #0f8656;
  text-align: justify;
  margin-left: 580px;

}





p.artbdyt3{
  display: block;
  font-size: 110%;
  color: #0f8656;
  text-align: justify;
}

p.artbdyt3ctr{
  display: block;
  font-size: 110%;
  color: #0f8656;
  text-align: center;
}

p.artbdyt4cb{
  display: block;
  font-size: 140%;
  font-weight: bold;
  color: #0f8656;
  text-align: center;
}

li.artbdyt3{
  display: block;
  font-size: 110%;
  color: #0f8656;
  text-align: justify;
}



p.artbdyt4{
  display: block;
  font-size: 120%;
  color: #0f8656;
  text-align: justify;
  margin-left: 5px;

}

p.artbdytablehd{
  display: block;
  font-size: 95%;
  color: #0f8656;
  text-align: left;
}


p.artnotet2{
  display: block;
  font-size: 95%;
  color: #a66813;
  text-align: justify;
  margin-left: 580px;


}
p.artnotered{
  display: block;
  font-size: 100%;
  color: #fa0505;
  text-align: justify;
  margin-left: 580px;

}

p.artnoteredfabric{
  display: block;
  font-size: 100%;
  color: #fa0505;
  text-align: left;
  margin-left: 0px;

}

p.artnotet3{
  display: block;
  font-style:italic;
  font-size: 100%;
  color: #0f8656;
  text-align: justify;
}

p.artnotet4{
  display: block;
  font-style:italic;
  font-size: 90%;
  color: #0f8656;
  text-align: center;
  line-height: 40%;
}


p.artnotet5{
  display: block;
  font-style:italic;
  font-size: 80%;
  color: #8A8483;
  text-align: center;
  line-height: 40%;
}

p.arthdt2{
  font-size: 175%;
  color: #0f8656;
  text-align: left;
}

p.arthdtc{
  font-size: 150%;
  color: #0f8656;
  text-align: center;
}

h1.arthdt2{
  font-size: 175%;
  color: #0f8656;
  text-align: left;
}

h1.arthdtc{
  font-size: 150%;
  color: #0f8656;
  text-align: center;
}


p.matl{
font-size:75%;
line-height:90%;
color: olive;
}

p.note{
font-size:95%;
line-height:90%;
color: dimgrey;
}
p.rnghd{
  font-size: 110%;
  font-weight:bold;
  color: #0f8656;
  text-align: center;
}

p.rngdesc{
  font-size: 105%;
  color: #0f8656;
  text-align: center;
}

p.sitehdt2{
  display: block;
  font-size: 200%;
  color: #414341;
  text-align: center;
}

p.sitehdt3{
  display: block;
  font-size: 12px;
  color: #414341;
  text-align: center;
}


 div.img
   {
   
   border:1px solid #ffa30a;
   
   text-align:center;
   }
 div.img img
   {
   display:inline;
   
   border:1px solid #ffa30a;
   }
 div.img a:hover img
   {
   border:1px solid #0000ff;
}

imgctr {
display: block;
margin-left: 85px;

}

div.img2
   {
  
   margin-left:1px;
   margin-right:1px;
	margin-bottom:12px;

   border:1px solid #b9c0ba;
   float:left;
   text-align:center;
}

div.img2 img
   {
   display:inline;
   margin:-1px;
   border:1px solid #b9c0ba;
   }


div.img2 a:hover img
   {
   border:.5px solid #1E8114;
     
  background-color: rgba(201,198,198,.5);
  border-radius: 15%;
  z-index: 5;
}


div.img3
   {
   margin-left:18px;
   margin-right:18px;
	margin-bottom:12px;

   border:1.5px solid #ffa30a;
   float:left;
   text-align:center;
}

div.img3 img
   {
   display:inline;
   margin:-1px;
   border:1px solid #ffa30a;
   }


div.img3 a:hover img
   {
   border:1.5px solid #1E8114;
     
  background-color: rgba(201,198,198,.5);
  border-radius: 15%;
  z-index: 5;
  }


div.img4
   {
   margin-left:25px;
   margin-right:25px;
   margin-bottom:35px;

   border:1.5px solid #ffa30a;
   float:left;
   text-align:center;
}

div.img4 img
   {
   display:inline;
   margin:-1px;
   border:1px solid #ffa30a;
   }


div.img4 a:hover img
   {
   border:1.5px solid #1E8114;
     
  background-color: rgba(201,198,198,.5);
  border-radius: 15%;
  z-index: 5;
  
  -moz-transform:scale(1.5); 
  -webkit-transform:scale(1.5);
  -o-transform:scale(1.5);
}



div.img5
   {
   margin-left:25px;
   margin-right:25px;
   margin-bottom:35px;
   border:1.5px solid #FFFCEB;
   float:left;
   text-align:center;
}

div.img5 img
   {
   display:inline;
   margin:-1px;
   border:1px solid #ffa30a;
   }


div.img5 a:hover img
   {
   border:1.5px solid #1E8114;
     
  background-color: rgba(201,198,198,.5);
  border-radius: 15%;
  z-index: 5;
  
  -moz-transform:scale(1.1); 
  -webkit-transform:scale(1.1);
  -o-transform:scale(1.1);
}

div.imgbanner
   {
   margin:20px;
   border:1px solid #ffa30a;
   float:left;
   text-align:center;
   }
 div.imgbanner img
   {
   display:inline;
   margin:3px;
   border:1px solid #ffa30a;
   }



h3.mobMenu {
font-size:100%;
line-height:100%;
color: white;
}

footer div.mod-footer {
  display: flex;
  flex: 1 1 0%;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
@media (min-width: 768px) {
  footer div.mod-footer {
    flex-direction: row;
  }
}

@media (max-width: 600px) {
  .element {
    display: inline-block;
    width: 100%;
  }
}