/* student.css 
   Project: MY MOTHER, MYSELF: Sacrifices and aspirations shape the lives of second-generation daughters in California.
   Authors: Group 8: Alexandria Mason, Benedek Mohay, Julia Gibson, Karina Saidi, Sherry Simpson Dean.
   Coder: Karina Saidi.
   Date: Aug 16, 2017
	
   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

*/

/* Infogram */

.infogram-embed {
  width: 50%;
  margin: auto;
}


/*
section .infogram-embed-1 {
  width: 25%;
  margin: auto;
  display: inline-block;

}
*/

/* Header */

header {
/*background-image: url("../img/coverphoto.jpg");*/
  z-index: 1000;
  height: 88%;
  border-bottom: .5em solid #D15C45;

  background-image: url("../img/cover-photo.jpg");

  /*
  background-repeat: repeat-x;
  background-clip: url("https://www.youtube.com/embed/qhLWS3oTtgE")
  */
}

.title h1 {
  /* color: blanchedalmond;*/
}

.title h2 {
  /*  color: navajowhite;*/
}

.title0 h1 {
  /*color: darkslategray;*/
  margin: auto;
}

.title0 h2 {
  /*color: darkslategray; */
  margin: auto;
}

.title0 h3 {
  padding: .5em;
}

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

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

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

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

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

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

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

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

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

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"); */
}

/* Text Highlight Colour */
    
    ::-moz-selection {
        color: #E54D24;
}

    ::selection {
        color: #E54D24;
}

/* Share Buttons  
#share-buttons img {
width: 2em;
padding-bottom: 3em;
border: 0;
background-color: white;
display: block;
margin-left: 100%;
}
*/

/* Social Media Icons */

    @import url(http://weloveiconfonts.com/api/?family=entypo);

    /* entypo */
    [class*="entypo-"]:before {
       font-family: "entypo", sans-serif;
    }

    a { 
       text-decoration: none;
    }

    ul {
       list-style: none;
       margin: 0;
       padding: 0;  
    }

    li {
      margin-bottom: 1em;
    }

    .container {
       margin: 0 auto;
       padding: 20px 50px;
       background: white;
    }

    #sticky-social {
       left: 0;
       position: fixed;
       top: 150px;
       z-index: 500;
    }

    #sticky-social a {
       background: #333;
       color: #fff;
       display: block;
       height: 50px;
       font: 16px "Avenir Next", sans-serif;
       line-height: 50px;
       position: relative;
       text-align: center;
       width: 50px;
       font-weight: bold;
    }

    #sticky-social a span {
       line-height: 50px;
       left: -120px;
       position: absolute;
       text-align:center;
       width:120px;
       background-color: #E54D24;
    }

    #sticky-social a:hover span {
       left: 100%;
       background-color: #E54D24;
    }

    #sticky-social a[class*="facebook"],
    #sticky-social a[class*="facebook"]:hover,
    #sticky-social a[class*="facebook"] span { background: #D15C45; }

    #sticky-social a[class*="twitter"],
    #sticky-social a[class*="twitter"]:hover,
    #sticky-social a[class*="twitter"] span { background: #D15C45; }

    #sticky-social a[class*="instagrem"],
    #sticky-social a[class*="instagrem"]:hover,
    #sticky-social a[class*="instagrem"] span { background: #D15C45; }

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

        h1 {
    font-size: 150%;
  }


    #sticky-social a {
     background: #333;
     color: #fff;
     display: block;
     height: 35px;
     font: 16px "Avenir Next", sans-serif;
     line-height: 35px;
     position: relative;
     text-align: center;
     width: 35px;
     font-weight: bold;
    }

      #sticky-social a span {
     line-height: 35px;
     left: -90px;
     position: absolute;
     text-align:center;
     width:90px;
    }

}

.tags {
  margin: auto;
  width: 50%;
}

.tags li {
  list-style-type: none;
  float: left;
}

.tags li a {
  color: white;
  background-color: #D15C45;
  text-align: center;
  padding: .5em;
  margin-right: .5em;
  text-decoration: none;
  border-radius: .5em;
  font-weight: 600;
  letter-spacing: .025em;
}

/* Change the link color to #111 (black) on hover */
.tags li a:hover {
  background-color: #E54D24;
  color: white;
}