/********** common setting **********/

.navbar.navbar-1 .navbar-toggler-icon {
    background-image: url('https://mdbootstrap.com/img/svg/hamburger6.svg?color=000');
  }


h2 {
    font-size: 2.8rem !important;
    font-weight: 700;
}

img {
    display: block;
    max-width: 100%;
}

a,
button {
    cursor: pointer;
}

.jumbotron {
    margin-bottom: 0 !important;
}

.atlas-cta {
    border-radius: 22px !important;
    padding: 12px 30px !important;
    font-weight: 700;
    transition: .3s ease-in-out !important;
}

.atlas-cta:hover {
    text-decoration: none;
    transform: translateY(-5px);
}

.atlas-cta-wide {
    width: 100%;
}

.cta-green {
    background: #00FFAD;
    color: #192440;
}

.cta-green:hover {
    color: #ffffff;
    background: #00e69c;
}

.cta-blue {
    background: #192440;
    color: #ffffff;
}

.cta-blue:hover {
    color: #ffffff;
    background: #121a2e;
}

.cta-ghost {
    border: 2px solid #192440 !important;
    color: #192440;
}

.cta-ghost:hover {
    color: #ffffff;
    background: #121a2e;
}

#banner {
    background-size: cover;
}

/********** banner **********/
#banner header {
    overflow:hidden;
}

#banner header img {
    max-width: 50px;
}

.jumbotron {
    padding: 4px 2px;
}
/********** feature (skew background) **********/
.feature img {
    width: 100%;
    max-width: 480px;
}

#feature-first {
    background: linear-gradient(168deg, #ffffff 55%, #00FFAD 0);
}
#feature-second {
    background: linear-gradient(168deg, #ffffff 55%, #00FFAD 0);
}
#feature-third{
    background: linear-gradient(168deg, #ffffff 55%, #00FFAD 0);
}
#feature-fourth{
    background: linear-gradient(168deg, #ffffff 55%, #00FFAD 0);
}

#feature-last {
    background: #00FFAD;
}
#feature-last1 {
    background: #00FFAD;
}
#feature-last2{
    background: #00FFAD;   
}
/********** price table **********/
#price-table {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
}

#price-table__premium {
    background: #192440;
    color: #ffffff;
}

#price-table ul li {
    padding: 5px 0;
}

/********** contact **********/
#contact {
    background-size: cover;
}

#contact ul li {
    padding: 3px 0;
}

#contact form {
    color: #00FFAD;
}

#contact form input,
#contact form textarea {
    background: transparent;
    border: 1px solid #00FFAD;
    color: #ffffff;
}


/********** copyright **********/
#copyright {
    background: #192440;
    padding: 2rem 3rem;
}

#copyright #social-media a {
    width: 40px;
    height: 40px;
    border-radius: 99%;
    background: #ffffff;
    transition: .4s ease;
}

#copyright #social-media a i {
    color: #192440;
    font-size: 1.2rem;
    line-height: 40px;
}

#copyright #social-media a:hover {
    background: #00FFAD;
}

#copyright #social-media a:hover i {
    color: #ffffff;
}

.whatsapp {
    position: fixed;
    bottom: 100px; /* Adjust as needed */
    right: 25px; /* Adjust as needed */
}

.whatsapp .whatsapp-icon {
    width: 40px; /* Adjust as needed */
    height: auto;
}

.course-image {
    height: 200px; 
    width: auto; 
}
/********** RWD **********/
@media (max-width: 575px) {
    #banner h1 {
        font-size: 3.6rem;
    }
}

/* SlideBar */
.content{
    padding:50px 100px;
  }
  .content h2{
    padding:0;
    margin:0 0 20px;
    font-size:30px;
  }
  .content p{
    font-size:18px;
  }
  .sidebar-contact{
    position:fixed;
    top:50%;
    left:-350px;
    transform:translateY(-50%);
    width:350px;
    height:auto;
    padding:40px;
    background:#c9c4c4;
    box-shadow: 0 20px 50px rgba(0,0,0,.5);
    box-sizing:border-box;
    transition:0.5s;
  }
  .sidebar-contact.active{
    left:0;
  }
  .sidebar-contact input,
  .sidebar-contact textarea{
    width:100%;
    height:36px;
    padding:5px;
    margin-bottom:10px;
    box-sizing:border-box;
    border:1px solid rgba(0,0,0,.5);
    outline:none;
  }
  .sidebar-contact h2{
    font-family: 'Raleway';
    font-weight: 600;
    margin:0 0 20px;
    padding:0;
  }
  .sidebar-contact textarea{
    height:60px;
    resize:none;
  }
  .sidebar-contact input[type="submit"]{
    background:#00bcd4;
    color:#fff;
    cursor:pointer;
    border:none;
    font-size:18px;
  }
  .toggle{
    position:absolute;
    height:120px;
    width:48px;
    text-align:center;
    cursor:pointer;
    top:0;
    right:-15px;
    line-height:105px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    transform: rotate(90deg);
  }
  .toggle:before{
    content:url(../img/Apply.png);
    height:120px;
    width:48px;
  }
  .toggle.active:before{
    content:url(../img/Apply.png);
  }
  @media(max-width:200px)
  {
    .sidebar-contact{
      width:100%;
      height:100%;
      left:-100%;
    }
    .sidebar-contact .toggle{
      top:50%;
      transform:translateY(-50%);
      transition:0.5s;
    }
    .sidebar-contact.active .toggle
    {
      top:0;
      right:0;
      transform:translateY(0);
    }
    .scroll{
      width:100%;
      height:100%;
      overflow-y:auto;
    }
    .content{
      padding:50px 50px;
    }
  }