body {

  background:#cccccc;

  background-image: url(images/bk_gradient.jpg);

  margin:0px 0px;

}





.align-center {

   text-align:center;

}



div.div-aside {

  position: fixed;

  margin-right:0px;

}



/* working with fixed header */

div.div-body {

  padding-top:180px;

}



div.main-content {

  /*background-image: url('images/logo/simple-background.png');*/

  margin: 0px;

}



.footer {

   text-align:center;

   background-color:#bcbec2;

   margin:10px;

   padding:10px;

}



h1 {

   text-align:center;

   text-shadow: 2px 3px 2px #000;

   color: #f53d13;

   padding-top: 1px;

   font-size:40px;

   font-style: italic;

   margin:2px 0px 10px 0px;

}



h2 {

   text-align:center;

   color:blue;

   font-size:30px;

}



.image-space {

  padding-right: 50px;

  border-right: 20px;

}



.image-style1 {

  text-align:center;

}



.image-style2 {

  float:left;

  width:100px;

  margin 0 20px;

  border: 4px solid white;

  box-shadow: 5px 5px 3px #000;

      -moz-box-shadow: 5px 5px 3px #000;

      -webkit-box-shadow: 5px 5px 3px #000;

      -khtml-box-shadow: 5px 5px 3px #000;

  }



.image-style3 {

  width:500px;

  border: 5px solid white;

  padding: 10px;

  box-shadow: 10px 10px 5px #000;

      -moz-box-shadow: 10px 10px 5px #000;

      -webkit-box-shadow: 10px 10px 5px #000;

      -khtml-box-shadow: 10px 10px 5px #000;

  }



label {

  font-weight: bold;

}



 /* Navbar container */

.navbar {

  overflow: hidden;

  background-image: url('../images/logo/Flowers_and_Grass_background.png');

  /*background-color: #3a3a7d; */

  font-family: Arial;

}



/* Links inside the navbar */

.navbar a {

  float: left;

  font-size: 30px;

  color: blue;

  text-shadow: 1px 1px purple;

  text-align: center;

  padding: 14px 16px;

  text-decoration: none;

}



ol#frontlist, li#frontlist

{

  list-style-image:url(../images/arrow.gif);

}



p {

  /* text-align:justify; text-align: left|right|center|justify|initial|inherit; */

  font-size: 25px;

  text-align: justify;

  margin:10px;

  /*letter-spacing: 10px; */

  letter-spacing: normal;

}



.p-element-styles {

  /* font-weight: normal|bold|bolder|lighter|number|initial|inherit; */

  font-weight: bold;

  /* text-shadow: h-shadow v-shadow blur-radius color|none|initial|inherit;*/

  text-shadow: 2px 2px #000000; 

}



select {

  font-size: 25px;

}



span {

  color: #ba2807;

  /* font-style: normal|italic|oblique|initial|inherit; */

  /*font-style: italic; */

}



table {

  width:100%;

}



table, th, td {

  border: 0px solid lightblue;

  font-size: 30px;

}



td {

  height: 50px;

  /*vertical-align: middle; */

}



th {

  height: 50px;

  background-color: #4CAF50;

  color: white;

}



th.border-class {

  background-color: #5e4707;

}





tr:nth-child(even) {

  background-color: #f2f2f2;

}



/*

tr:hover {

  background-color: #f7e8be;

}

*/





table.roundedCorners { 

  border: 1px solid DarkOrange;

  border-radius: 13px; 

  border-spacing: 0;

  align-content: center;

  }

table.roundedCorners td, 

table.roundedCorners th { 

  border-bottom: 1px solid DarkOrange;

  padding: 10px; 

  }

table.roundedCorners tr:last-child > td {

  border-bottom: none;

}



table.border-class { 

  border-style: ridge;

  border-width: 25px;

  border-color: #8ebf42;

  background-color: #d9d9d9;

  box-shadow: 5px 5px 3px blue;

      -moz-box-shadow: 5px 5px 3px blue;

      -webkit-box-shadow: 5px 5px 3px blue;

      -khtml-box-shadow: 5px 5px 3px blue;

}





/* tree-div content begin */

 ul, #myUL {

  list-style-type: none;

  color:black;

  font-size: 24px;

}



#myUL {

  margin: 20px 0px 0px 10px;

  padding: 0;

}



.caret {

  cursor: pointer;

  -webkit-user-select: none; /* Safari 3.1+ */

  -moz-user-select: none; /* Firefox 2+ */

  -ms-user-select: none; /* IE 10+ */

  user-select: none;

}



.caret::before {

  content: "\25B6";

  color: blue;

  display: inline-block;

  margin-right: 6px;

}



.caret-down::before {

  -ms-transform: rotate(90deg); /* IE 9 */

  -webkit-transform: rotate(90deg); /* Safari */'

  transform: rotate(90deg);  

}



.nested {

  display: none;

}



.active {

  display: block;

}



div.tree-div {

  margin-left: 20px;

}

/* tree-div content End */



/* Slide Show Begin */

* {box-sizing: border-box;}

.mySlides {display: none;}

img {vertical-align: middle;}



/* Slideshow container */

.slideshow-container {

  margin: 20px 0px 0px 120px;

  max-width: 1000px;

  position: relative;

  z-index:80;

}



/* Caption text */

.text {

  color: #f2f2f2;

  font-size: 15px;

  padding: 8px 12px;

  position: absolute;

  bottom: 8px;

  width: 100%;

  text-align: center;

}



/* Number text (1/3 etc) */

.numbertext {

  color: #f2f2f2;

  font-size: 12px;

  padding: 8px 12px;

  position: absolute;

  top: 0;

}



/* The dots/bullets/indicators */

.dot {

  height: 15px;

  width: 15px;

  margin: 0 2px;

  background-color: #bbb;

  border-radius: 50%;

  display: inline-block;

  transition: background-color 0.6s ease;

}



.active {

  background-color: #f5f1f1;

}



/* Fading animation */

.fade {

  -webkit-animation-name: fade;

  -webkit-animation-duration: 1.5s;

  animation-name: fade;

  animation-duration: 1.5s;

}



@-webkit-keyframes fade {

  from {opacity: .4} 

  to {opacity: 1}

}



@keyframes fade {

  from {opacity: .4} 

  to {opacity: 1}

}



/* On smaller screens, decrease text size */

@media only screen and (max-width: 300px) {

  .text {font-size: 11px}

}

/* Slide Show End */



/* Blockquote begin */

#homepage-background {

    background: url('../images/pasture_background.jpg');

}



.scrolling-text {

    text-shadow: 2px 3px 2px red;

    text-align: left;

    color: white;

    font-size: 35px;

    margin: 30px;

    font-weight: bold;

}

/* Blockquote end */



/* Begin header navigation */

a.header-link {

  margin-top:60px;

}



a:hover {

  background-color:red;

}



.header-link:hover {

  background-color:lightgray;

}



.logo-link:hover {

  background-color:lightgray;  

}



.example {    

    /*background:#fff url(../images/clouds-in-blue-sky.jpg);

    width:770px; */

    position: fixed;

    z-index: 1200;

    height:62px;

    width:100%;

    /*border:1px #000 solid; */

    margin:1px 0px 123px 0px;

    padding:1px;

    border-radius:3px;

    -moz-border-radius:3px;

    -webkit-border-radius:3px;

}





/* main menu styles */

#nav {

    display:inline-block;

    width:100%;

    margin:0px auto;

    padding:0;

    background: url(../bootstrap/images/bg.png) repeat-x 0 -110px;



    border-radius:10px; /*some css3*/

    -moz-border-radius:10px;

    -webkit-border-radius:10px;

    box-shadow:0 2px 2px rgba(0,0,0, .5);

    -moz-box-shadow:0 2px 2px rgba(0,0,0, .5);

    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .5);

}

#nav li {

    margin:10px;

    float:left;

    position:relative;

    list-style:none;

    z-index:1000;

}

#nav a {

    font-weight:bold;

    font-size:28px;

    color:blue;

    text-decoration:none;

    display:block;

    padding:8px 10px;



    border-radius:10px; /*some css3*/

    -moz-border-radius:10px;

    -webkit-border-radius:10px;

    text-shadow:0 2px 2px rgba(0,0,0, .7);

}



/* selected menu element */

#nav .current a, #nav li:hover > a {

    /*background:#7788aa url(../images/bg.png) repeat-x 0 -20px;*/

    color:#000;

    border-top:1px solid #f8f8f8;



    box-shadow:0 2px 2px rgba(0,0,0, .7); /*some css3*/

    -moz-box-shadow:0 2px 2px rgba(0,0,0, .7);

    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .7);

    text-shadow:0 2px 2px rgba(255,255,255, 0.7);

}



/* sublevels */

#nav ul li:hover a, #nav li:hover li a {

    background:lightgray;

    border:none;

    color:#000;

}

#nav ul li a:hover {

    /*background:#335599 url(../images/bg.png) repeat-x 0 -100px;*/

    background:#335599;

    color:#fff;



    border-radius:10px; /*some css3*/

    -moz-border-radius:10px;

    -webkit-border-radius:10px;

    text-shadow:0 2px 2px rgba(0,0,0, 0.7);

}



#nav ul li:first-child > a {

    -moz-border-radius-topleft:10px; /*some css3*/

    -moz-border-radius-topright:10px;

    -webkit-border-top-left-radius:10px;

    -webkit-border-top-right-radius:10px;

}

#nav ul li:last-child > a {

    -moz-border-radius-bottomleft:10px; /*some css3*/

    -moz-border-radius-bottomright:10px;

    -webkit-border-bottom-left-radius:10px;

    -webkit-border-bottom-right-radius:10px;

}



/* drop down */

#nav li:hover > ul {

    opacity:1;

    visibility:visible;

}

#nav ul {

    opacity:0;

    visibility:hidden;

    padding:0;

    width:375px;  /* modified by jli on 1-15-2018 for wider drop down menu */

    position:absolute;

    /*background:#aabbcc url(../images/bg.png) repeat-x 0 0;  */

    background:#aabbcc;

    border:1px solid #7788aa;



    border-radius:10px; /*some css3*/

    -moz-border-radius:10px;

    -webkit-border-radius:10px;

    box-shadow:0 2px 2px rgba(0,0,0, .5);

    -moz-box-shadow:0 2px 2px rgba(0,0,0, .5);

    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .5);



    -moz-transition:opacity .25s linear, visibility .1s linear .1s;

    -webkit-transition:opacity .25s linear, visibility .1s linear .1s;

    -o-transition:opacity .25s linear, visibility .1s linear .1s;

    transition:opacity .25s linear, visibility .1s linear .1s;

}

#nav ul li {

    float:none;

    margin:0;

}

#nav ul a {

    font-weight:normal;

    text-shadow:0 2px 2px rgba(255,255,255, 0.7);

}

#nav ul ul {

    left:370px; /* modified by jli on 1-15-2018 for wider drop down menu */

    top:0px;

}

/* End of header navigation */









blink, .blink {

    -webkit-animation: blink 1s step-end infinite;

    -moz-animation: blink 1s step-end infinite;

    -o-animation: blink 1s step-end infinite;

    animation: blink 1s step-end infinite;

}

@-webkit-keyframes blink { 67% { opacity: 0 }}

@-moz-keyframes blink {  67% { opacity: 0 }}

@-o-keyframes blink {  67% { opacity: 0 }}

@keyframes blink {  67% { opacity: 0 }}







span {

   text-decoration: overline;

}



p {

   text-decoration: blink;

}



p {

    text-indent:20px;

}



span {

   /*text-transform: uppercase;*/

}



span {

  /*white-space: pre;*/

  word-spacing: 20px;

  font-variant: small-caps;

}



div.div-aside {

  position: fixed;

  margin-right:0px;

}



div.my-container {

  color:blue;

  font-size:40px;

  border:10px dotted red;

  width:50%;

  padding: 30px;

  margin:10px;

  background:#fff;

  letter-spacing: 0px;

  /*text-transform: uppercase; */

  /*white-space: pre; */

  word-spacing: 20px;

  font-weight: lighter;

  height: 250px;

  display: flex;

  justify-content: center;

  align-items: center;

  /*display:none;*/



}



.italic {

  font-style: italic;

}



p {

  text-align: justify;

  line-height: 50px;

}



span {

  text-decoration: underline;

}



.my-list {

  list-style-type:lower-roman;

}



.video-border {

  margin: 0 auto;

  border: 10px outset #000;

}



/* Slide Show Begin */

* {box-sizing: border-box;}

.mySlides {display: none;}

img {vertical-align: middle;}



/* Slideshow container */

.slideshow-container {

  margin: 20px 0px 0px 120px;

  max-width: 1000px;

  position: relative;

  z-index:80;

}



/* Caption text */

.text {

  color: #f2f2f2;

  font-size: 15px;

  padding: 8px 12px;

  position: absolute;

  bottom: 8px;

  width: 100%;

  text-align: center;

}



/* Number text (1/3 etc) */

.numbertext {

  color: #f2f2f2;

  font-size: 12px;

  padding: 8px 12px;

  position: absolute;

  top: 0;

}



/* The dots/bullets/indicators */

.dot {

  height: 15px;

  width: 15px;

  margin: 0 2px;

  background-color: #bbb;

  border-radius: 50%;

  display: inline-block;

  transition: background-color 0.6s ease;

}



.active {

  background-color: #f5f1f1;

}



/* Fading animation */

.fade {

  -webkit-animation-name: fade;

  -webkit-animation-duration: 1.5s;

  animation-name: fade;

  animation-duration: 1.5s;

}



@-webkit-keyframes fade {

  from {opacity: .4} 

  to {opacity: 1}

}



@keyframes fade {

  from {opacity: .4} 

  to {opacity: 1}

}



/* On smaller screens, decrease text size */

@media only screen and (max-width: 300px) {

  .text {font-size: 11px}

}

/* Slide Show End */