/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */
body {
    font-family: 'Roboto', sans-serif !important;
    padding-top: 3rem;
    color: #5a5a5a;
    background-color: #f8f9fa !important;
  }

a
{
  color: #4473c5;
}

a:hover
{
  color: #4473c5;
}

.main
{
  width: 100%;
  min-height: 300px !important;
}

  /* CUSTOMIZE THE CAROUSEL
  -------------------------------------------------- */
  
  /* Carousel base class */
  .carousel {
    margin-bottom: 4rem;
  }
  /* Since positioning the image, we need to help out the caption */
  .carousel-caption {
    bottom: 3rem;
    z-index: 10;
  }
  
  /* Declare heights because of positioning of img element */
  .carousel-item {
    height: 32rem;
  }
  .carousel-item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 35%;
    height: 32rem;
  }
  
  
  /* MARKETING CONTENT
  -------------------------------------------------- */
  
  /* Center align the text within the three columns below the carousel */
  .marketing .col-lg-4 {
    margin-bottom: 1.5rem;
    text-align: center;
  }
  .marketing h2 {
    font-weight: 400;
  }
  .marketing .col-lg-4 p {
    margin-right: .75rem;
    margin-left: .75rem;
  }
  
  
  /* Featurettes
  ------------------------- */
  
  .featurette-divider {
    margin: 2.5rem 0; /* Space out the Bootstrap <hr> more */
  }
  
  /* Thin out the marketing headings */
  .featurette-heading {
    font-weight: 300;
    line-height: 1;
    letter-spacing: -.05rem;
  }
  
  
  /* RESPONSIVE CSS
  -------------------------------------------------- */
  
  @media (min-width: 40em) {
    /* Bump up size of carousel content */
    .carousel-caption p {
      margin-bottom: 1.25rem;
      font-size: 1.25rem;
      line-height: 1.4;
    }
  
    .featurette-heading {
      font-size: 50px;
    }
  }
  
  @media (min-width: 62em) {
    .featurette-heading {
      margin-top: 7rem;
    }
  }
  

/* ------ Override bootstrap css ------ */

.bg-apj-primary
{
    background-color: #4473c5;  
}

.bg-apj-secondary
{
  background-color: #a8a8a8;
}

.apj-primary
{
    color: #4473c5;  
}

.navbar-nav > li
{
    padding-left:15px;
    padding-right:15px;
}

.navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active
{
  color: #4473c5;
}

@media (min-width: 768px) {
  .nav-divider
  {
      border-left: 2px solid #4473c5;
  }

  ul li.active a
  {
      border-bottom: 2px solid #4473c5;
  }

  .border-rt-secondary
  {
    border-right: 2px solid #4473c5 !important;
  }

}

@media (max-width:629px) {
  .sm-no-display
  {
    display: none;
  }
}

.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus
{
  color: #4473c5;
}

.navbar-light .navbar-nav .nav-link
{
  color: #4473c59f;
}

.nav-highlight
{
    color: #4473c5 !important;

}

footer
{
  height: 200px;
  color: white;
}

footer a
{
   color: white;
   text-decoration: none;
}

footer a:hover
{
   color: #e4e4e4;
   text-decoration: none;
}

.carousel-img-right
{
  margin-left: 10%;
  max-width: 75%;
}

.bg-apj-warn-light > * >span
{
  background-color: #17ff8b70;
  
}

.brand-text
{
  color: #4473c5;
  font-weight: 450;
  font-size: 1em;
  font-family: cursive;
}

.text-border-big
{
  border-bottom: 5px solid #4473c5;
}

.card-header
{
  cursor: grab !important;
}

.jumbotron
{
  padding : 2rem !important;
}

.w--25
{
  width: 25px;
}

.card-header, .modal-header
{
  background-color: #4473c5;
  color: white;
}

/*
flip card
*/
.card-flip {
  min-height: 250px;
}

.card-flip > div {
  backface-visibility: hidden;
  transition: transform 300ms;
  transition-timing-function: linear;
  width: 100%;
  height: 100%;
  margin: 0;
  display: flex;
}

.card-front {
  transform: rotateY(0deg);
}

.card-back {
  transform: rotateY(180deg);
  position: absolute;
  top: 0;
}

.card-flip:hover .card-front {
  transform: rotateY(-180deg);
}
  
.card-flip:hover .card-back {
  transform: rotateY(0deg);
}

.card-front > .card-body
{
  color: #f1f1f1;
}

.bg-apj-light
{
  background-color: #4473c5;
  /* background-image: linear-gradient(141deg, #93b1e5 0%, #6085c4 51%, #4473c5 75%); */
}

/* News ticker */
.news-border
{
  border: 5px solid #4473c5;
}

.news-text
{
  color: #4e4e4e;
}

.h-300
{
  height: 300px;
}

.fa-facebook:hover
{
  color: #3B5998;
}

.fa-twitter:hover
{
  color: #00ACEE;
}

.fa-instagram:hover
{
  color: #DD2A7B;
}

.social-media-links> *
{
  color: #5a5a5a;
}

.font-size-13
{
  font-size: 1.2rem;
}

.detail-box
{
  border-radius: 0px !important;
}

.trainer-card-img
{
  border-radius: 50%;
  border: 2px solid #696969;
  background-color: #fff;
}

.bg-apj-light-new
{
  background: #b3d9ff;
}


.intro-message{
  font-size: 1.2em;
  font-style: italic;
  text-align: center;
}