@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@500&display=swap');

/* Navigation Bar Styling */
nav{
    width: 100%;
    overflow: auto;
    background: #006633;
    height: 60px;
}
.titleStrip{
  background-image: url(../images/topimage.jpg);
  padding: 20vh 0;
  background-size: cover;
}
.w3-row-padding{
  background-color: #eff0e8;
}
.backside{
  background-color: #eff0e8;
}

.fontcolor{
  font-color: #006633;
}

/* Heading Bar Section : Styling */
section.headingbar{
  background: #eff0e8;
  margin-top: 2em;
  margin-left: 4em;
  margin-right: 4em;

}

/* Body & headings Section Styling */
body{
    background: #e1e8e3;
    margin: 0;
    padding: 0;
}

h1{
  font-family: 'Roboto Slab';
  color: #006633;
  font-weight: 500;
}

h3{
  color: #42413f;
  font-weight: 700;
}

/* Program List Styling */
ul.menubar{
    padding: 0;
    margin: 0 0 0 250px;
    list-style:none;
}

li.menu{
    float: left;
}

li a{
    width: 100px;
    display: block;
    padding: 20px 15px;
    text-decoration: none;
    font-family: arial;
    color: white;
    text-align: center;
}

li a:hover{
    background: #FFCC33;
    text-transform: uppercase;
}

/* General Information Section Styling */
section.Information{
  margin-left: 4em;
  margin-right: 4em;
}

.course-requirement{
  margin-left: 4em;
}

.infotext{
  font-size: 18px;
}

section.programs{
  align-items: center;
  background: #eff0e8;
  margin-right: 4em;
}

li.bullets{
  font-size: 1.1em;
  margin-bottom: 1em;
}

.box{
  width: 50%;
}

.box ul{
  position: relative;
}

.box ul li{
  list-style: none;
  padding: 10px;
  width: 100%;
  height: 50px;
  background:  #eff0e8;
  box-shadow: 0 5px 25px rgba(0, 0, 0, .1);
  transition: transform 0.5s;
  margin-left: 1em;
}

.box ul li:hover{
  transform: scale(1.1);
  z-index: 100;
  background: #e1e8e3;
  box-shadow: 0 5px 25px rgba(0,0,0,.2);
  color: #000000;
}

.button1{
background-color: #eff0e8;
border: none;
color: black;
text-align: center;
text-decoration: none;
display: inline;
font-size: 10px;
color: #006633;
}

/* Footer Section Styling */
img.resize{
width: 20vh;
height: 20vh;
margin-right: 4em;
margin-bottom: 4em;
}

.bottomfooter{
  background: #e1e8e3;
  padding: 5vh 0;
  margin-bottom: 4em;
}

.footer-about{
  margin-left: 4em;
  margin-right: 20em;
}

.footerindex-about{
  margin-left: 20em;
  margin-right: 20em;
}

/* Index Page : Side Image */
.w3-sidebar{
  background-image: url(../images/sidestrip.jpg);
}

/* Index Page : Assignment Section Styling */
.box{
  width: 50%;
}

.box-index ul{
  float: left;
}

.box-index ul li{
  list-style: none;
  padding: 10px;
  width: 100%;
  height: 50px;
  background:  #eff0e8;
  box-shadow: 0 5px 25px rgba(0, 0, 0, .1);
  transition: transform 0.5s;
}

.box-index ul li:hover{
  transform: scale(1.1);
  z-index: 100;
  background: #e1e8e3;
  box-shadow: 0 5px 25px rgba(0,0,0,.2);
  color: #000000;
}

li.bullets2{
  font-size: 1.1em;
  margin-bottom: 1em;
  align-self: center;
}

.course-requirement2{
  position:sticky;
}

.button2{
background-color: #eff0e8;
border: none;
color: black;
text-align: center;
text-decoration: none;
display: inline;
font-size: 10px;
color: #006633;
}