/* student.css 
   Project: 
   Author: 
   Date: 
	
   Helpful links: 
   	Web colors: 
   		https://en.wikipedia.org/wiki/Web_colors#X11_color_names
	Color picker tool:
		https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Colors/Color_picker_tool
		http://colorpicker.com

	This is from W3Schools.com "How to create a parallax scrolling effect": 
	https://www.w3schools.com/howto/howto_css_parallax.asp

≈

header {
background-image: url("../img/group2.jpg");
  height: 90%;*/

  header{
    background-image: url("../img/group2.jpg");
    height:90%;
  }


.title h1 {
  color:blanchedalmond;
  padding-top:214px;
  font-family:decorative;
  font-size:48px;
}

.title h2 {
 color: maroon;
}

.title0 h1 {
  color: maroon;
  font-family:decorative;
}

.title0 h2 {
  color: red;
  padding-top:10px;
  font-family:decorative;
  font-size:48px;


}

.bigger:hover img {
width:400px;
transition:all 1s ease;
z-index:1;
}

section.maintext {
  /* background-image: url("../img/gr"); */
}

    .divider.bgimg1 {
       background-image: url("../img/Reds.png"); */
    }

section.mainvideo {
  /* background-image: url("../img/griffith.jpg");*/
}

    .divider.bgimg2 {
       background-image: url("../img/cheering.png"); 
    }

/*Popup boxes*/
.tleft img{
  cursor: pointer;
}

.bigbox{
  width:100%;
  height:100%;
  background-color:black;
  display:none;
  position:fixed;
  top:0px;
  left:0;
  overflow-y: auto;
}
.bigbox img{
  padding:300px;
  padding-top:200px;
  padding-left:250px;
  padding-right:250px;
}

.littlebox img {
  width: 700px;
  cursor: pointer;
}

section.mainaudio {
  height: 800px;
  border:10px solid red;
}


.audiotext {
  width: 10px;
  color:black;
  background-color:blue;
}

 aside.sound {
  width: 35%;
  margin: 10px 0px 0px 10px;
  padding: 6px;
  position: relative;
  float: left;
 }

aside.sound img {
  width: 325px;
  border: 5px solid red;
  height:325px;
  padding:5px;
}

 .slideup{
  height:95px;
  width:330px;
  border:3px solid black;
  bottom:15px;
  left:5px;
  position:absolute;
  padding:2px;
  background-color:rgba(255,255,255,0.5);
  color: black;
  font-weight: bold;
  font-size: 20px;
  display: none;
 }
 

    .divider.bgimg3 {
    background-image: url("../img/blue.JPG"); */
    }
    
section.sidebar {
  /* background-image: url("../img/griffith.jpg");*/
}

    .divider.bgimg4 {
       background-image: url("../img/p.png"); */
    }

section.vr360video {
  /* background-image: url("../img/griffith.jpg"); */
}

    .divider.bgimg5 {
      background-image: url("../img/p.png"); */
    }

section.slideshow {
  /* background-image: url("../img/griffith.jpg"); */
}

    .divider.bgimg6 {
      /*  background-image: url("../img/coverphoto.jpg"); */
    }

section.gmapmain {
  /* background-image: url("../img/griffith.jpg"); */
}

    .divider.bgimg7 {
      /*  background-image: url("../img/griffith.jpg"); */
    }

section.knightlab {
  /* background-image: url("../img/griffith.jpg"); */
}

    .divider.bgimg8 {
      /*  background-image: url("../img/beach.jpg"); */
    }

section.socialmedia {
  /* background-image: url("../img/griffith.jpg"); */
}

    .divider.bgimg9 {
      /*  background-image: url("../img/coverphoto.jpg"); */
    }

section.dataviz {
  /* background-image: url("../img/griffith.jpg"); */
}

section.footer {
  /* background-image: url("../img/griffith.jpg"); */
}