body {
   font-family: 'Kumbh Sans', sans-serif;
}
header {
    padding: 15px 0;
}
header nav a {
    margin: 0 15px;
    text-decoration: none;
    color: #6c757d;
    font-weight: 500;
    transition: color 0.3s ease;
}

header nav a:hover {
    color: #007d7d; 
}
.navbar-nav .nav-link {
    color: #6c757d;
    font-weight: 500;
}
.navbar-nav .nav-link.active {
    color: #008080; /* Teal color for active link */
}

header a.text-muted {
    font-size: 1.2rem;
    transition: color 0.3s ease;
}

header a.text-muted:hover {
    color: #007d7d;
}

.dropdown-menu-items {
    display: none; /* Initially hide the dropdown menu */
    position: absolute; /* Position the dropdown menu */
    background-color: white; /* Optional: background for the dropdown */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Optional: shadow effect */
    z-index: 1000; /* Ensure it's above other content */
    padding: 20px; /* Optional: space for dropdown content */
    list-style: none; /* Remove default list styles */
}

/* Show dropdown menu when parent is hovered */
.nav-item.dropdown:hover .dropdown-menu-items {
    display: block; /* Show dropdown items */
}

/* Optional: Additional styling for dropdown items */
.dropdown-menu-items li {
    margin: 5px 0; /* Space between dropdown items */
}

/* Optional: Styling for links in the dropdown */
.dropdown-menu-items li a {
    text-decoration: none; /* Remove underline */
    color: #027174; /* Set text color */
    padding: 5px 10px; /* Add some padding */
    display: block; /* Ensure the link takes up the entire width */
}

.dropdown-menu-items li a:hover {
    background-color: #f0f0f0; /* Highlight effect on hover */
    color: #333; /* Change text color on hover */
}

.slider-po{
    background-image: url(https://www.strategiadatasciences.com/wp-content/uploads/2023/08/BDS1541-1.jpg);
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 620px; 
 }
 .inner-content{
    color: #ffff;
    width: 400px;
    margin-left: 12%;
    padding-top: 12%;
 }
 .sub-title{
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: 2px;
    margin-bottom: 10px;
 }
 .sub-title::after{
   display: inline-block;
   background: #0F978E !important;
   content: '';
   width: 18px;
   height: 3px;
   z-index: 1;
   margin-left: 10px;
   margin-bottom: 5px;
   border-radius: 5px;
}
 .title{
    font-size: 45px;
    line-height: 50px;
    font-weight: 700;
    letter-spacing: -0.8px;
 }
 .gsc{
    margin-top: 35px;
    width: 850px;
    text-align: center;
    color: #82828a;            
    font-size: 15px;
 }
 .ic{
    letter-spacing: 2px;
    font-weight: 600;
    line-height: 22px;
    text-transform: uppercase;
    margin-bottom: 10px;
 }
 .tt{
    color: #0C0707;
    font-size: 33px;
    letter-spacing: -0.8px;
    font-weight: 700;
    line-height: 1.22;
 }
 .st{
    padding: 20px 0px 0px 0px;
    line-height: 2;
    letter-spacing: 0px;
 }
 .explore{
    margin-top: 80px;
 }
 .c-one{
    height: 280px;
    border-radius: 8px;
    text-align: left;
    color: #ffff;
    padding: 40px 35px;
 }
 .icon-america {
    
    font-size: 72px;
    font-weight: 900;
    line-height: 1;
    text-align: right
 }
 .cont-one{
    font-weight: 600;
    line-height: 22px;
    font-size: 14px;
    letter-spacing: 1px;
 }
 h5{
    letter-spacing: -0.4px;
    font-weight: 700;
    line-height: 1.22;
    color: #2B2B5E;
    font-size: 1.15rem;
    margin-bottom: 30px;
    text-align: center;
 }
 h5 a{
    text-decoration: none;
    color: #0f978e;
 }
 .aboutus{
    background: linear-gradient(0.25turn, #003852, #027174, #0F978E);
    height: 250px;            
    color: white;
 }
 .topic{
    
    margin-left: 150px;
    padding-top: 70px;
 }
 p{
    text-align: left;
    color: #82828a;            
    font-size: 16px;
    line-height: 30px;
    a {
      text-decoration: none;      
      color: #0f978e;
    }
 }  

 .strategy-section {
   max-width: 1200px;
   margin: auto;
   .sub-title {
      color: #82828A;
   }
   .title {
      color: #2B2B5E;
   }
}
 .about-one__single {
   position: relative;
   /* margin: 0 auto 10px; */
   /* padding-left: 30px; */
   max-width: 590px;
   box-sizing: border-box; 
}
.about-one__image {            
   position: relative;
   z-index: 9;
   padding: 0 60px;
}
.about-one__shape-1:before, .about-one__shape-1:after {
   content: '';
   width: 65px;
   position: absolute;
   top: 60px;
   background: #F4F3F8;
   z-index: -1;
}
.about-one__shape-1:before {
   left: 5px;
   bottom: 135px;
}
.about-one__shape-1:after {
   right: 5px;
   bottom: 110px;
}
.about-one__shape-2 {
   width: 26px;
   height: 26px;
   background: #FDBE44;
   position: absolute;
   top: 34px;
   left: 34px;
}
.about-one__shape-3 {
   width: 170px;
   height: 170px;
   border: 6px solid #FDBE44;
   position: absolute;
   bottom: -60px;
   right: 5px;
   z-index: 12;
}
.about-one__shape-4 {   
   height: 60px;
   position: absolute;
   bottom: -60px;
   left: 60px;
   right: 175px;
   background: #F4F3F8;
   z-index: 12;
}
.products{
   .row{
       max-width: 1200px;
         margin: 0 auto;
         text-align: center;
       h2 {
           font-size: 1.8rem;
           letter-spacing: -1px;
           font-weight: 700;
       }
   }
}
.myfriend{
   max-width: 1200px;
   margin: 0 auto;
   .content{
      h3 {
         color:#020000;
      }
      margin-top: 30px;
  }
  p{  
      letter-spacing: -0.2px;
      line-height: 30px;
  }
  h5{
   color: #020000;
   text-align: left;
   font-weight: 400;
   margin-bottom: 10px;
  }
}
.slide{
   height: 400px;
   .carousel-indicators {
       .rounded-circle{
         margin-left: 10px;
         background-color: #abb8c3;
         width: 6px;
         height: 6px;
       }
       .active {
         background-color: black;
       }       
   }
   button i {
      /* padding-left: 40px; */
      color: #82828a;
      font-size: 22px;
  }
  .fa-chevron-left{
      padding-right: 60px;
  }
  .fa-chevron-right{
      padding-left: 60px;
  }
  .slide-pics{
      margin: 0 auto;
      text-align: center;
  }
}

.kano-one {
   width: 1200px;
   margin: 80px auto;

   .block {
      background: linear-gradient(0.25turn, #003852, #027174, #0F978E) !important;
      border-radius: 8px;
      /* height: fit-content; */
      padding: 30px;
      h3 {
        color: white;
          text-decoration: underline;
      }
      p {
        color: white;
        font-weight: 600;
        letter-spacing: 1px;
        line-height: 22px;
      }
      h5 {
         padding: 10px;
         text-align: left;
         color: white;
         line-height: 30px;
         font-weight: 400;
         font-size: 20px;
         margin-bottom: 10px;
     }
  }
   .description {
     padding: 20px 0px 0px 40px;
     p {
      color: #030101;
       letter-spacing: 0.2px;
       line-height: 30px;
     }
   }
   .reference {
      p {
         font-size: 7px;
         color: gray;
       }
   }
   .fa-solid {
       padding-top: 10px;
       background-color: #0F978E;
       width: 2em;
       height: 2em;
       font-size: 24px;    
       color: #fff;
       border-radius: 50%;
       text-align: center;
   }
   .row p {
      color: #030101;
       padding-right: 5rem !important;
       padding-left: 3rem !important;
   }
   .sub-title {
      color: #82828A;
   }
   .title {
      color: #2B2B5E;
   }
   .my-kano {
       margin-top: 70px;
       margin-left: 40px;
   }
   .dog {
       margin-top: 150px;
   }
   video {
      height: 100%;
      width: 100%;
      display: flex;
      border: none;
      background-color: #000;
  }
  .widgets {
      .box {
         border-style: solid;
         border-radius: 15px 15px 15px 15px;
         border-width: 1px 1px 1px 1px;
         border-color: #0C876F;
         transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
         padding: 20px 20px 20px 20px;
         h2 {
            font-size: 1.8rem;
            color: #090505;
            font-weight: 700;
            text-align: center;
            letter-spacing: -0.4px;
         }
         p {
            /* margin-bottom: 1rem; */
            text-align: center;
            color: #100202;
         }
      }
   .d-flex{
         p {
            text-align: left;
            padding-right: 10px !important;
            padding-left: 10px !important;
         }
      }
      .doctor {
         display: flex;
         align-items: center;
         justify-content: center;
      }
   }
}
.news {
   width: 1180px;
   margin: auto;
   .widget-image {
       display: block;
       margin-left: auto;
       margin-right: auto;
       width: 50%;
   }
   p {
      color: #060202;
   }
}

.contact-us {
   width: 1200px;
   margin: auto;
   .form-control:focus {
      outline: none;
      box-shadow: 0 0 0 1px #00CDE5;
   }
   .link {
      background: #2B2B5E;
      border-radius: 8px;
      height: 50px; 
      margin-right: 10px;
      margin-bottom: 10px;
      padding: 8px 20px !important;
      border: 1px solid #E2DFEB;
      display: inline-block;
      a { 
          text-decoration: none;
          color: #fff;
          font-size: 14px;
          font-weight: 700;
      }
   }
   .input, .textarea {
      color: #82828A;
      width: 100%;
      height: 60px;
      padding: 0 15px;
      border: 1px solid transparent !important;
      -webkit-transition: all 0.35s;
      transition: all 0.35s;
      background: #F4F3F8;
  }
  .textarea {
      height: 180px;
   }
  .submit-btn {
   background: #00CDE5;
    color: #fff;
    font-weight: 700;
    padding: 18px 32px 18px 32px;
    line-height: 22px;
    font-size: 16px;
    position: relative;
    z-index: 9;
    display: inline-block;
    -webkit-transition: all 0.35s;
    transition: all 0.35s;
    -moz-transition: all 0.35s;
    -ms-transition: all 0.35s;
    border: none;
    border-radius: 8px;
  }
  .instalink{
      width: 70px;
      height: 70px;
      a {
         color: #030303;
         font-size: 24px;
      }
   }
   .instalink:hover{
      background-color: #030303;
      a {
         color: #ffff;
         font-size: 24px;
      }
   }
   .card {
      /* max-width: 260px; */
      width: 100%;
      margin: 0 auto;
      border: none;
      color: #82828A;
  }
  .card-body {
      background: #fff;
      padding: 55px 55px 60px;
      position: relative;
      box-shadow: 0px 10px 30px 0px rgba(65, 80, 138, 0.1);
  }
  .plan-price {
      padding-bottom: 15px;
      color: #2B2B5E;
      .currency {
          font-size: 22px;
          position: relative;
          top: -20px;
      }
      .price {
          line-height: 1;
          margin-bottom: 10px;
          font-weight: 400;
          font-size: 60px;
      }
      .interval {
          font-size: 11px;
          text-transform: uppercase;
          font-weight: 500;
      }
  }
  .plan-title {
      color: #070404;
      font-size: 15px;
      font-weight: 700;
      margin: 0 0 18px;
      letter-spacing: 5px;
      text-transform: uppercase;
  }
  .plan-desc {
      font-size: 17px;
      font-weight: 500;
      line-height: 24px;
  }
  .plan-list {
      list-style-type: none;
      padding: 0;
      margin: 25px 0 8px;
      font-size: 17px;
  }
  .plan-list li {
      position: relative;
      padding: 10px 0 10px 30px;
      line-height: 24px;
  }
  .plan-list li:after {
      content: '\f00c';
      font-family: "Font Awesome 5 Free";
      position: absolute;
      top: 8px;
      left: 0;
      font-size: 15px;
      color: #00CDE5;
      z-index: 1;
      font-weight: 900;
  }
}

footer {
   height: 500px;
   margin-top: 50px;
   background: linear-gradient(0.25turn, #003852, #027174, #0F978E);
   line-height: 25px;
   padding: 10px 0;
   p, span{
      color: white;
       font-size: 15px;
       font-weight: 500;
   }
   h5 {
      color: white;
      text-align: left;
   }

   .instalink{
       width: 40px;
       height: 40px;
       a {
           color: #2B2B5E;
       }
   }
   
   button{
       background-color: #0D9490;
       border-radius: 3px;
       font-size: 12px;
       letter-spacing: 2px;
       height: 40px;
       border: none;
       color:white;
   }
   /* input {
       height: 60px;
   } */
   .btn-gradient {
      background: linear-gradient(0.25turn, #003852, #027174, #0F978E);
      color: white;      
      height: 60px;
      width: 50px;
      border: none;
      transition: background 0.3s ease;
  }

  .btn-gradient:hover {
      color: white;
      background: linear-gradient(-90deg, #00CDE5 0%, #2B2B5E 100%);
  }
  .copyright p{
      text-align: center;
      margin-top: 100px;
  }
}