body, html {
    height: 100%;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
  }
  
  .navbar
  {
      background-color:#ffffff;
      width:100%;
      align-items: center;
      display: block;
      margin-left: auto;
      margin-right: auto;
      padding:18px;
  }
  .navbar-brand
  {
      height:30px;
      width:170px;
      margin-top: -15px;
  }
  .nav-link
  {
      color:rgb(0, 0, 0);
      float:right;
      text-align: right;
      font-size: 18px;
      letter-spacing: 0.22px;
      font-family: 'Montserrat', sans-serif;
      margin-top: -30px;
      margin-right: 20px;
      font-weight: 500;
  }
  .nav-link:hover{
      color:black;
  }
  .active
  {
      background-color:#f9b169;
      color:black;
      border-radius: 10px 0 10px 0;
      font-family: 'Montserrat', sans-serif;
  }
  
/* Image banner */ 
.imga {
  
  margin-top: 30px;
  margin-bottom: 45px;
  width:auto;
}

  .navbar-toggler-icon
  {
      border:2px solid white;
      color:rgb(0, 0, 0);
      width:35px;
      float:right;
  }
  .fa-bars
  {
      margin-top: 3px;
      color:black;
      display: block;
      margin-right: auto;
      margin-left: auto;
  }
  @media (max-width:450px)
  {
      .navbar{
          margin-top: 10px;
          padding:20px;
          background-color: white;
      }
      
      .nav-link{
          color:black;
          letter-spacing: 0.52px;
          margin-top: 1px;
          height:45px;
      }
      .navbar-brand
      {
          display: block;
          width:180px;
          height:30px;
          float: right;
          margin-top: -15px;
      }
      
      .mobile
      {
          height:55px;
          width:auto;
          margin-left: 30%;
      }
      .navbar-toggler-icon
      {
          border:2px solid black;
      }
      .fa-bars
      {
          color:black;
      }
  }

  /* Style tab links */
  .tablink {
    background-color: rgb(214, 214, 214);
    color: rgb(0, 0, 0);
    text-align: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 10px;
    font-size: 15px;
    width: 25%;
    font-weight: 500;
  }
  
  
  /* Style the tab content (and add height:100% for full page content) */
  .tabcontent {
    color: rgb(0, 0, 0);
    display: none;
    padding: 50px 20px;
    height: 100%;
  }
  .tablink-data
  {
      font-size: 18px;
      font-weight: 700;
  }
.section
{
    color:black;
      font-family: "Montserrat" , sans-serif;
      font-weight: 500;
      font-size: 21px;
      margin-top: 5px;
}
  .course
  {
      color:black;
      font-family: "Montserrat" , sans-serif;
      font-weight: 700;
  }
  .para
  {
      font-family: "Montserrat" , sans-serif;
      font-size: 16px;
      font-weight: 300;
  }
  .tablehead
  {
    color:black;
    font-family: "Montserrat" , sans-serif;
    font-weight: 700;
    font-size: 22px;
    text-align: center;
  }
 i {
      margin-left:25%  ;
  }
@media  (max-width:400px)
{
     .tablink-data{
        display: none;
    } 
    .fa-bookmark , .fa-book , .fa-user , .fa-star
    {
        display:block;
        margin-left: 45%;
    }   
}
/*accordation*/
.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 10px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
    align-items: center;
  }
  
  .active, .accordion:hover {
    background-color: #ccc;
  }
  
  .accordion:after {
    content: '\1F883';
    color: #777;
    font-weight: bold;
    float: right;
    margin-left: 5px;
    margin-top: -25px;
    align-items: center;
  }
  
  .active:after {
    content: "\1F881";
  }
  
  .panel {
    
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
  }
.progress{
  margin-top: 15px;
}
  .progress-bar{

    color: black;
    font-size: 14px;
  }
  .imga{
    margin-left: auto;
    margin-right: auto;
    display: block;

  }

  /*Footer */
  .footer
{
    background: linear-gradient(rgba(10, 45, 61, 0.7),rgba(17, 22, 27, 0.7)),url("images/footer.jpg");
    padding:25px;
    background-size: cover;
    background-repeat: no-repeat;
}
.footer-image
{
    height:80px;
    width:200px;
    display: block;
    margin-left: auto;
    margin-right: auto;
   
}
.footer-contact
{
    color:#f1a334;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;  
    font-size: 22px;
    letter-spacing: 0.52px; 
}
.fa-phone , .fa-envelope
{
    color:white;
    margin-left: -1px;
    
}
.f-span
{
    font-size: 16px;
    margin-left: 20px;
    font-weight: 300;
    color:white;
}
.footer-li
{
    list-style-type: none;
    color:white;
    font-size: 16px;
    font-weight: 300;
    text-decoration: none;
    margin-left: -35px;
    font-family: 'Montserrat', sans-serif;
}
ul:hover , li:hover , a
{
    text-decoration: none;
}
hr
{
    border:1px solid white;
    width:100%;
    margin-top: 20px;
}
.fa-facebook , .fa-youtube , .fa-instagram , .fa-linkedin
{
    color:#fff;
    display: block;
    margin-left: 10%;
    margin-right: auto;
    text-align: center  ;
    background-color: #f1a334;
    padding:10px;
    border-radius: 55%;
    transition: transform .7s ease-in-out;
    
}
.fa-facebook:hover , .fa-youtube:hover , .fa-instagram:hover , .fa-linkedin:hover{
    background-color: #000000;
    color:#f1a334;
    transform: rotateY(360deg);
    
}
.copy a 
{
    float:right;
    color:#f1a334;
    text-decoration: none;
    font-size: 16px;
    font-family: 'Montserrat', sans-serif;
    margin-top: 10px;
}

@media (max-width:380px)
{
    .fa-facebook , .fa-youtube , .fa-instagram , .fa-linkedin
{
    color:#fff;
    display: block;
    margin-left: 15px;
    margin-right: auto;
    text-align: center  ;
    background-color: #f1a334;
    padding:15px;
    border-radius: 50%;
    transition: transform .7s ease-in-out;
    
}
.fa-facebook:hover , .fa-youtube:hover , .fa-instagram:hover , .fa-linkedin:hover{
    background-color: #000000;
    color:#f1a334;
    transform: rotateY(360deg);
    
}
.copy a 
{
    float:left;
    color:black;
    text-decoration: none;
    font-size: 16px;
    font-family: 'Montserrat', sans-serif;
    margin-top: 20px;
    margin-left: 50px;
}
.copy a:hover{
    color:#f1a334;
}
}