html, body {
  padding-top: 25px;
  font-family: 'Open Sans', sans-serif;
  height: 100%;
  width: 100%;
  }

h1 {
  font-size: 60px;
  font-weight: 800;
  }

  h2 {
  font-size: 45px;
  font-weight: 800;
  }

  h3 {
  font-size: 30px;
  font-weight: 800;
  }

.heavyfont {
  font-weight: 800;
}

.centertext {
  text-align:center;
}

.justifytext {
  text-align:justify;
}

.largetext {
  font-size: 20px;  
}

.hugetext {
  font-size: 80px;
  font-weight: 800;
  text-align: center;
}


.bigtext {
  font-size: 60px;
  font-weight: 800;
  text-align: center;
}



  /* Smartphones (portrait and landscape) ----------- */
 @media only screen and (max-width: 768px) {
       .bigtext {     font-size: 40px;
                      font-weight: 800;
                      text-align: center;}

        .staff {min-height: 400px;}
    }


  /* Smartphones (portrait and landscape) ----------- */
 @media only screen and (max-width: 768px) {
       .hugetext {    font-size: 40px;
                      font-weight: 800;
                      text-align: center;}
    }

      /* Smartphones (portrait and landscape) ----------- */
 @media only screen and (max-width: 768px) {
       .largetext {    font-size: 15px;
                      }
    }




  /* Smartphones (portrait and landscape) ----------- */
 @media only screen and (max-width: 480px) {
       h1 { font-size: 40px;}
    }

#loading {
    position: absolute; width: 100%; height: 100%; background: #fff url('../files/images/Pelham-logo.gif') no-repeat scroll center center #FFF;
}

.navbar-inverse {
  background-color: #0c0f40;
  border-color: #fff;
}


.container-fluid.openpage {
  height: 100%;
  background: url(/webapps/mbk/files/images/EdTechBackground.jpg) #0c0f40;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center; 
  color: white;  
  min-height: 1000px;
  text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
               0px 8px 13px rgba(0,0,0,0.1),
               0px 18px 23px rgba(0,0,0,0.1);
}

.container-fluid.projects {
  background: url(/webapps/mbk/files/images/projectsBackground.jpg) #0c0f40;
  background-attachment: scroll;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: bottom; 
  color: white;
}

.container-fluid.socialmedia {
  background: url(/webapps/mbk/files/images/socialmedia.jpg) #0c0f40;
  background-attachment: scroll;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: bottom; 
  color: white;
}

.container-fluid.meetthestaff {
  background: #fff;
  background-attachment: fixed;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center; 
}

.container-fluid.projectspage {
  background-attachment: fixed;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center; 
}

.parralax {
    background: url("/webapps/mbk/files/images/equipment.jpg") #0c0f40;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 841px;
    color: white;
}

.content{
  padding-top: 15%;
  text-align: center;
  padding-bottom: 15%;
}

.contentSmall{
  padding-top: 7%;
  text-align: center;
  padding-bottom: 7%;
}

.content.meetthestaff{
  color: #0c0f40;
  padding-top: 0%;
  text-align: center;  
}

.content.meetthestaff h4{
  font-weight: 600;  
}

#footerone {
 text-align: center;
 padding-top: 15px;
 padding-bottom: 15px;
 color: white;
 background: #0c0f40;
}

#footerone a{
 color: white;
}

.staffphoto {
  width: 80%;
  /*box-shadow: 10px 5px 15px 0px #000;*/
  transition: filter .5s ease-in-out;
  -webkit-filter: grayscale(0%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
  filter: grayscale(0%); /* FF 35+ */
}

.staffphoto:hover { 
  -webkit-filter: grayscale(100%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
  filter: grayscale(100%); /* FF 35+ */
  }

.hideforanimate{
     opacity: 0;
}
.visible{
     opacity: 1;
}

.delay-1 {
animation-delay: .25s;
}
.delay-2 {
animation-delay: .5s;
}
.delay-3 {
animation-delay: .75s;
}
.delay-4 {
animation-delay: 1s;
}