
.contact-number{
  background-color: #ffd200
}
.contact-number span{
  border-bottom: 1px dotted #000;
  color: black;
}
.hero-image{
  background:#ffd200 url("../img/hero.jpg") bottom center no-repeat;
  background-size: cover;
  text-align: center;
}
.mb-6{
  margin-bottom: 4rem !important;
}
.btn-outline-dark {
      color: #343a40;
    background-color: transparent;
    background-image: none;
    border-color: #343a40;
}

.btn-outline-dark:hover {
  color: #ffd200;
  background-color: #343a40;
  border-color: #343a40;
}
.advantage{
  text-align: center;
}
.display-5 {
    font-size: 3rem;
    font-weight: 300;
    line-height: 1.1;
}
.display-6 {
    font-size: 2.15rem;
    font-weight: 300;
    line-height: 1.1;
}
.display-7 {
    font-size: 1.5rem;
    font-weight: 300;
    line-height: 1.1;
}
#testimonial{
  background: #F7F7F7 url("../img/banner-2.png") center left no-repeat;
  background-size: cover;
}
.display-container{
  position: relative;
}
.display-middle{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  -ms-transform:translate(-50%,-50%)
}
.bg-theme {
    background-color: #004614;
}
.text-theme{
    color: #004614;
}
.small-caps{
    font-variant: small-caps;
}

.mt-6-5 {
    margin-top: 4rem;
}

.mt-6 {
    margin-top: 2.5rem;
}


.text-xs-left { text-align: left; }
.text-xs-right { text-align: right; }
.text-xs-center { text-align: center; }
.text-xs-justify { text-align: justify; }

@media (max-width: 768px) {
    .text-s-left { text-align: left; }
    .text-s-right { text-align: right; }
    .text-s-center { text-align: center; }
    .text-s-justify { text-align: justify; }
}


.login-icon {
    width: 1.6rem;
}



#wrapper {
  width: 100%;
  margin: 0 auto 0;
}

#wrapper p {
  text-align: center;
  color: #fff;
  font-size: 2em;
  text-shadow: 2px 2px #555;
}

#slideshow {
  border: 1px solid #fff;
  background: url(../img/photos/school-1.jpg) no-repeat;
  background-size: contain;
  width: 100%;
  height: 410px;
  -webkit-animation: slider 10s infinite ease-in-out;
  -webkit-animation-direction: alternate;
  animation: slider 10s infinite ease-in-out;
  animation-direction: alternate;
}

@-webkit-keyframes slider {
  0% {
    background: url(../img/photos/school-1.jpg) top center no-repeat;
    background-size:cover;
  }
  25% {
    background: url(../img/photos/school-2.jpg) top center no-repeat;
    background-size: cover;
  }
  50% {
    background: url(../img/photos/school-3.jpg) top center no-repeat; 
    background-size: cover;
  }
  100% {
    background: url(../img/photos/school-1.jpg) top center no-repeat;
    background-size: cover;
  }
}

@keyframes slider {
  0% {
    background: url(../img/photos/school-1.jpg) top center no-repeat;
    background-size: cover;
  }
  25% {
    background: url(../img/photos/school-2.jpg) top center no-repeat;
    background-size: cover;
  }
  50% {
    background: url(../img/photos/school-3.jpg) top center no-repeat;
    background-size: cover;
  }
  100% {
    background: url(../img/photos/school-1.jpg) top center no-repeat;
    background-size: cover;
  }
}

.logo {
  text-align:left;
  margin: 1rem;
}

@media screen and (max-width: 768px) {
  #wrapper {
    width: 100%;
  margin:1em auto;
  }
  
  #wrapper p {
 font-size: 1.25em;
 letter-spacing:0.15em;
 text-shadow: 2px 1px #000;
 overflow:hidden;
 }
      
  #slideshow {
    width: 100%;
    height: 390px;
    background-size: cover;
  }
  #slideshow img {
    max-width: 100%;
    margin: 0 auto;
  }
  .logo {text-align:center;}
}



.post-border {
    border-bottom: 1.5px dotted grey;
}
