body, html {
  height:100%;
  width:100%
}

.navbar-custom, body {
  background-color: #D3D3D3;
}

.intro, body, html {
  width:100%;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

#community{
  background: url("../img/community/man.jpg");
  text-shadow: 1px 1px #000;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display:table-cell;
  vertical-align:middle;
  position:relative
}

body {
  font-family:Monteserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
  color: black;
  webkit-tap-highlight-color:rgba(255,255,255,.2);
}

.btn, .navbar-custom, h1, h2, h3, h4, h5, h6 {
  text-transform: uppercase;
  font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
}

h1, h2, h3, h4, h5 {
  margin:0 0 35px;
  font-weight:700;
  letter-spacing:1px;
}

h2 {
  font-size: 200%;
}
h6 {
  font-size: 125%;
  font-weight:400;
}


@media (min-width:768px) {
  p {
    margin:0 0 35px;
    font-size:20px;
    line-height:1.6;
  }
}

a {
 color:#42DCA3;
 -webkit-transition:all .2s ease-in-out;
 -moz-transition:all .2s ease-in-out;transition:all .2s ease-in-out;
}

a:focus, a:hover {
  text-decoration:none;
  color:#1d9b6c;
}

.light {
  font-weight:400;
}

.navbar-custom {
  margin-bottom:0;
  border-bottom:1px solid rgba(255,255,255,.3);
}

.navbar-custom,.navbar-toggle {
  color:#fff;
  background-color:rgba(255,255,255,.2);
  font-size:12px;
}

.navbar-custom .nav li a:active, .navbar-custom .nav li a:focus, .navbar-custom .nav li a:hover {
  background-color:transparent;
  outline:0;
}

.navbar-custom .navbar-toggle:active,.navbar-custom .navbar-toggle:focus {
  outline:0;
}

.navbar-custom .navbar-brand {
  font-weight:700;
}

.navbar-custom .navbar-brand:focus {
  outline:0;
}

.navbar-custom a {
  color:#fff;
}

.navbar-custom .nav li a {
  -webkit-transition:background .3s ease-in-out;
  -moz-transition:background .3s ease-in-out;
  transition:background .3s ease-in-out;
}

.navbar-custom .nav li a:hover{
  color:rgba(255,255,255,.8);
}

.navbar-custom .nav li.active {
  outline:0
}

.navbar-custom .nav li.active a {
  background-color:rgba(255,255,255,.3);
}

.navbar-custom .nav li.active a:hover {
  color:#fff;
}

@media (min-width:768px) {
  .navbar-custom {
    padding:20px 0;
    border-bottom:none;
    letter-spacing:1px;
    background:0 0;
    -webkit-transition:background .5s ease-in-out,padding .5s ease-in-out;
    -moz-transition:background .5s ease-in-out,padding .5s ease-in-out;
    transition:background .5s ease-in-out,padding .5s ease-in-out;
  }
  .navbar-custom.top-nav-collapse {
    padding:0;
    background:#000;
    border-bottom:1px solid rgba(255,255,255,.3);
    }
  }

/*THE HOME PAGE*/
.intro {
  display:table;
  height:auto;
  padding:100px 0;
  text-align:center;
  color:#fff;
  background:url(../img/background-images/woman-instrument.jpg) bottom center no-repeat #000;
  -webkit-background-size:cover;-moz-background-size:cover;
  background-size:cover;-o-background-size:cover;
}

.intro .intro-body {
  display:table-cell;
  vertical-align:middle;
}

.intro .intro-body .brand-heading {
  font-size:40px;
}

.intro .intro-body .intro-text {
  font-size:18px;
}

@media (min-width:768px) {
  .intro {
    height:100%;
    padding:0
  }
  .intro .intro-body .brand-heading {
    font-size:100px;
  }
  .intro .intro-body .intro-text {
    font-size:26px;
  }
}

.timeline1:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,.6)), url("../img/timeline/timeline1.jpg");
}

.timeline3:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline3.jpg");
}
.timeline4:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline2.jpg");
}
.timeline5:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline5.jpg");
}
.timeline6:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline6.jpg");
}
.timeline7:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline7.jpg");
}
.timeline8:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline8.jpg");
}
.timeline9:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline9.jpg");
}
.timeline10:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline10.jpg");
}
.timeline11:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline11.jpg");
}
.timeline12:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline12.jpg");
}
.timeline13:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,.2), rgba(0,0,0,0.6) ), url("../img/background-images/collaborating.JPG");
}
.timeline14:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline14.jpg");
}
.timeline15:hover{
  color:white;
  text-shadow: 1px 1px 5px #000;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  background-position: top center !important;
  background-repeat: no-repeat !important;
  background-image: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("../img/timeline/timeline15.jpg");
}
