body{

    background-color: #111122;
  
}
/*navber section start*/
.kamal-text{
    color: #FFFFFF !important;
    font-weight: bold !important;
    font-size: 30px !important;
    margin: 0 14px;
}
.navbar{
    margin: 0;
    padding: 0;
}
.navbar-toggler {
    padding: .25rem .75rem;
    font-size: 1.25rem;
    line-height: 1;
    background-color:#f5b711;
    border: 1px solid transparent;
}
.navbar-toggler-icon:hover{
    background-color: #6b5d5d;
}

.nav-item a{
    font-size: 15px;
    font-weight: 600;
    padding: 10px 20px !important;
    border-radius: 25px !important;
    transition: 1s;
    font-weight: bold;
    color:#FFFFFF !important;
    text-transform: capitalize;
   
}
.nav-link.active {
    color: #fff; 
    background-color:#f5b711; 
    border-radius: 5px; 
  }
  .nav-link:hover {
    color: #fff;
    background-color:#f5b711; 
    border-radius: 5px; 
  }
/*navber section end*/

/* ***************************************************** */
/*Banner Section start*/
.banner{
   margin: 0;
   padding: 0;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 2vh; /* Responsive padding */
}


.text {
    flex: 1;
    text-align: left;
    width: 100%;
    margin-top: 190px;
    margin-left: 0;
 
}

.text h1{
font-size: 50px;
}
.text h1, .text h3, .text p {
    margin: 1vh 0; 
    width: 100%;
    
}
.contact{
    margin-top: 60px;
    
}

.contact a{
    text-decoration: none;
    font-family: "Poppins", Sans-serif;
    font-size: 22px;
    font-weight: 600;
    text-transform: capitalize;
    background-color: #F3B90B;
    border-radius: 37px 37px 37px 37px;
    box-shadow: 0px 0px 5px 0px #F9C873;
    padding: 20px 50px 20px 50px;
    text-align: center;
    text-transform: capitalize;
    color: #0a0a0a;
    display: inline-block; /* Ensures the element is treated as a block element */
    animation: softBounce 3s ease-in-out infinite; /* Infinite smooth bounce */
    transition: transform 0.3s ease-in-out;
}
.contact a:hover{
    background-color: #000000;
    color: #FFFFFF;
}

.banner h4{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 10px 0;

}
.banner h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 50px;
    font-weight:bold;
    text-transform: uppercase;
}
.banner h3{
    color: #f5b711;
    font-family: "Poppins", Sans-serif;
    font-size: 20px;
    font-weight: 600;
}
.banner p{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    text-transform: capitalize;
    font-weight: 300;
    line-height: 1.6em;
}
.imag {
    flex: 1;
    position: relative;
    padding: 2vh; /* Responsive padding */
    width: 100%;
    height: auto;
}
.imag img{
    width:100%;
    height: auto;
    display: block;
    text-align: center;
    margin-right: 0;
   
}
.backgroun {
    position: relative;
    width: 100%;
    align-items: center;
}
.overlay-image {
    width: 100%;
    height: auto;
    display: block;
    text-align: center;
}
.expart{
    padding: 20px;
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    will-change: transform;
    height: auto;
    line-height: 1;
    transition: all 0.3s ease; /* Smooth transition for hover and animation*/
    bottom: 150px;
    padding: 2vh ; /* Vertical padding responsive to viewport height */
    background-color: #111122;
    border-style: solid;
    border-color: #F3B90F;
    width: 200px;
    margin-bottom: 2vh; /* Bottom margin responsive to viewport height */
    bottom:  30px;
    right: 0px;
    background-color: #111122;
    padding: 20px 0px 20px 0px;
    border-style: solid;
    border-width: 2px 2px 2px 2px;
    border-color: #F3B90F;
    border-radius: 40px 40px 40px 40px;
    text-align: center;
}
.phplaravel {
    padding: 20px;
    text-align: center;
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    will-change: transform;
    height: auto;
    line-height: 1;
    transition: all 0.3s ease; /* Smooth transition for hover and animation*/
    bottom: 150px;
    left:  70px;
    padding: 2vh; /* Vertical padding responsive to viewport height */
    border-style: solid;
    border-width: 2px;
    border-color: #F3B90F;
    border-radius: 40px;
    background-color: #111122;
    width: 200px;
    margin-top: 1vh;
    background-color: #111122;
    padding: 20px 0px 20px 0px;
    border-style: solid;
    border-width: 2px 2px 2px 2px;
    border-color: #F3B90F;
    border-radius: 40px 40px 40px 40px;

}
/* Bounce animation */


.expart, .phplaravel {
    animation: softBounce 1.5s ease-in-out infinite; /* Adjusted animation duration */
}

/* Hover effect */
.expart:hover, .phplaravel:hover {
    box-shadow: 0 10px 20px rgba(248, 189, 11, 0.15);
    /* You can add more hover effects if needed */
}


.expart p, .phplaravel p {
    margin: 0 auto;
    text-align: center;
    color: #F3B90F;
    line-height: 1;
    
}
.count {
    font-size: 26px; /* Larger font size for emphasis */
    font-weight: bold;
    display: block;
    justify-content: center;
    align-items: stretch;
    flex-direction: column-reverse;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-weight: 600;
}

.Years {
    color: #F5B711;
    font-family: "Poppins", Sans-serif;
    font-size: 14px;
    font-weight: 300;
    text-align: left !important;
    line-height: .5;
}

.php{
    color: #FFFFFF;
    font-size: 34px; /* Make text more prominent */
    font-weight: bold;
    display: block;
    margin-top: 10px;
}

.php, .laravel {
    font-size: 20px;
    line-height: .5;
    
}
@keyframes softBounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-15px); /* Reduced bounce height */
    }
}
/*Banner Section end*/
/* ***************************************************** */
/*whate Section start*/
.whatw_section_text{
    margin-top: 50px  ;
    width: 100%;
    text-align: center;
}
.whate{
    text-align: center;
    margin: 0 auto;
}
.whate p {
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 400;
}
.whate h1{
margin: 0 auto;
color: #FFFFFF;
font-family: "Poppins", Sans-serif;
font-size: 55px;
font-weight: 600;
text-transform: uppercase;
}
.whate_section{
    width: 100%;
    margin: 0 auto;
     margin-top:50px;
}   

.image_item{
    position: relative;
     width:100%;
     background-color: #1C222A;
     margin:0;
     font-weight: 500;
     box-sizing: border-box;
    padding: 40px 35px 40px 35px;
    border-radius: 30px ;
    height: 400px;
    overflow: hidden;  
    }
    .image_item img{
    width: 60px;
    font-weight: 600;
    padding: 8px ;
    display: block;
    border: 2px solid rgb(18, 139, 2);
    background-color:#000000 ;
    border-radius: 100%;
    box-shadow: 0px 4px 10px rgba(245, 242, 242, 0.5); 
    transition: transform 0.3s, box-shadow 0.3s; 
    }
    .image_item:hover {
        transform: scale(1); 
        box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.7); 
      }

      .skill_text{
        color: #ffffff;
        font-weight: 300;
        position: absolute;
         width: 85%;
         display: flex;
         display: block;    
    }
    .skill_text p{
        width: 100%;
        display: flex;
        font-size: 15px;
        font-weight: 300;
        line-height: 1.5em;
        font-family: "Poppins", Sans-serif;
        margin: 0;
    
    }
    .skill_text h3{
        text-transform: uppercase;
        font-weight: bold;
        font-size: 20px;
        color: #f0b505;
        width: 100%;
        margin: 0;
        padding: 10px 0;   
        
    }
    
    .say_hello  {
        color: #FFFFFF;
        text-transform: capitalize;
        font-weight: bold;
        text-decoration: none;
        background-color: #61CE7000;
        font-family: "Poppins", Sans-serif;
        font-size: 20px;
        font-weight: 700;
       letter-spacing: 1px;
        margin: 15px 0 !important;
        display: inline-block;

    }
    .say_hello:hover{
        color: #F3B90F;
    }
    .sayhello{
    color: #F3B90F;
    font-weight: bold;
    font-size: 20px;
    text-decoration: none;
    }

/*whate Section end*/
/* ***************************************************** */
/*Portfolio Section start*/
.protfolioll_section_text{
text-align: center;
margin-top: 95px;
justify-items: center;
width: 100%;
}
.protfolioll{
    width: 100%;
    margin: 0 auto;
}
.protfolioll h1{
    
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
}
.protfolioll h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 20px;
    font-weight: 400;
}
.profolio_section{
    margin-top: 30px;
    
  }
  .profolio_item{
    position: relative;
    width:100% !important;
    background-color: #1C222A;
    font-weight: 500;
    box-sizing: border-box;
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    padding: 40px 35px 40px 35px;
    border-radius: 30px ;
    height: 400px;
    overflow: hidden;
    box-sizing:border-box;
    height: 400px !important;
  }
  .profolio_item img{
    width: 100%;
    font-weight: 400;
    padding: 5px;
    display: block;
    height: 200px;
    
    }
    .profolio_item:hover{
        transform: scale(1); 
        box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.7); 
    }

    .protfolio_text{
        width: 100%;
        margin: 0;       
    } 
    .protfolio_text h3{
        color: aliceblue;
        text-transform: uppercase;
        color: #f0b505;
        font-weight: bold;
        margin: 10px 0;
        font-size: 18px;
        font-weight: 900;
        font-weight: bold;
    }
    .protfolio_text p{
        color: aliceblue;
        text-transform: capitalize;
        font-size: 12px;
        font-weight: 400;
        margin: 0;
        padding-bottom: 10px;
    }
    .protfolio_say_hello{
        color: #ffffff;
        text-decoration: none;
        text-transform: capitalize;
        font-weight: 600;
        font-family: "Poppins", Sans-serif;
       font-size: 20px;
       font-weight: 600;
       letter-spacing: 1px;
        }
        .protfolio_say_hello:hover{
            color: #f5b711;
        }
        
    .protfolio_sayhello{
        color: #f0b505;
        padding-left:5px;

    }
/*Portfolio Section end*/
/* ***************************************************** */
/*testimoniam Section start*/
.testimonial_text_section{
    margin-top: 100px;
    text-align: center;
    width: 100%;
}
.testimonial_text{
    margin: 0 auto;
    text-align: center;

}
.testimonial_text h1{
    margin: 0 auto;
    padding: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
}
.testimonial_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 400;
    text-align: center;
}
.testimonial_section{
    width: 100%;
    margin-top: 30px;
}

.testimonial{
    position: relative;
    width: 100% !important;;
    background-color: #1C222A;
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
   padding: 40px 35px ;
     border-radius: 30px ;
     height: 400px !important;
     overflow: hidden;
     box-sizing:border-box !important;
     display: block;
     display: flexbox;
  }
  .testimonial p{
  color: #fff;
  text-transform: capitalize;
  margin: 0;
  text-align: left;
  width: 100%;
  display: flex;
  font-size: 14px;
  font-weight: 300;
  line-height: 1.5em;
  font-family: "Poppins", Sans-serif;
  width: 100% !important;

  }
  .testimonial img{
    width: 40px;
    font-weight: 400;
    margin: 10px 0;
    display: block;
    background-color: #f0b505;
   border-radius: 30px ;

  }
  .testimonial h1{
   color: #f0b505;
   font-size: 20px;
   text-transform: uppercase;
   font-weight: 500;
    margin: 10px 0;
    padding: 0;

  }
  .testimonial h2{
color: #ffffff;
text-transform: capitalize;
font-size: 14px !important;
font-weight: 400;


  }

  .testimonial:hover{
    transform: scale(1);
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.7)
}









/*testimoniam Section end*/

/* ***************************************************** */
/*contact Section end*/
.contacts_text_section{
    margin-top: 100px;
}
.contacts_text{
    margin: 0 auto;
    
    text-align: center;
}
.contacts_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
    padding: 0;
    margin-top: 50px;

}
.contacts_text h2{
    color: #f0b505;
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 400;
}
.contacts_section{
    width: 100%;
    margin-top: 30px;
    text-align: center;
}
.contacts{
    width:100% !important;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
   border-radius: 30px ;
   height: auto;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
  }
  .contact_item{
    margin: 50px auto;
    margin-bottom: 80px;
  }
  .contacts:hover{
    transform: scale(1);
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.7)
  }
   
  .contacts h1{
    text-transform: capitalize;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 25px;
    font-weight: 500;
    margin: 10px auto;
      }
      .contacts h2{
        color: #FFFFFF;
        font-size: 20px;
        margin: 0 auto;
        text-transform: capitalize;
        font-weight: 300;
         line-height: 1em;

    
      }
      .icon {
        text-align: center;
      }
      
      .icon svg {
        width: 50px;
        height: 50px; 
        fill:#F3B90B;
        margin-left: 0px;
        top: 30px;
        margin: 0 auto !important;
    }
/*contact Section end*/

/* ***************************************************** */
/* footer_section start*/


.fotter_section {
    padding: 30px 0;
    font-family: Arial, sans-serif;
    background-color: #1C222A;
    margin-top: 70px;
    width: 100%;
    height: 100% !important;
}

.pottersection {
    text-align: center;
    margin-bottom: 20px;
  
}

.pottersection lu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: start;
    gap: 20px;
}

.fotter_item {
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 2px solid #dad602;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #0a0a08; /* White background for icons */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.fotter_item svg {
    width: 24px;
    height: 24px;
    color: #F3B90B;
    transition: color 0.3s ease;
}

.fotter_item:hover {
    transform: scale(1.1);
    box-shadow: 0 3px 10px rgb(192, 206, 3);
    background-color: #967001; /* Hover background color */
}

.fotter_item:hover svg {
    color: #F3B90B; /* Icon color on hover */
}

.potterlink {
    text-align: end;
    margin-top: 20px;
    font-size: 14px;
    color: #F3B90F;
}

.potterlink a {
    text-decoration: none;
    color: #F3B90F;
    transition: color 0.3s ease;
}

.potterlink a:hover {
    color: #a89d00;
    text-decoration: underline;
}


/* footer_section end*/

/* ***************************************************** */
/* ***************************************************** */
/* aboute_section start*/
.about-image{
    width: 60%;
    margin: 0 auto;
    text-align: center;
    margin-top: 30px;
    
    }
    
    .about-image img{
        width: 60%;
        margin: 0 auto;
        font-weight: 600;
        text-align: center;
        
    }
    .about-image h1{
        color: #D5D5D5;
        text-transform: uppercase;
        font-weight: bold;
        margin-top:-70px;
        text-transform: capitalize;
        font-weight: 700;
        text-align:center ;
        text-transform: uppercase;
        width: 100%;
        padding: 0;
        color: #D5D5D5;
        font-family: "Poppins", Sans-serif;
        font-size: 65px;
        
        
    }
    .about-image h2{
        color: #F5B711;
        text-align: center;
        font-size: 18px;
        font-family: "Poppins", Sans-serif;
        font-weight: 700;
        margin: 0;
        
    
        
    }
    .about-text{
        margin-top: 95px;
        justify-content: center;
        padding:0 30px;
       
    }
    .about-text h1{
        color:#F5B711;
        font-weight: 700;
        text-align: left;
        font-size: 35px;
        font-family: "Poppins", Sans-serif;
        margin: 10px auto;        
    
    
    }
    .about-text p{
    color: #e2d7d7;
    text-transform:capitalize;
    font-weight: 300;
    line-height: 1.6em;
    font-family: "Poppins", Sans-serif;
    margin: 0 auto;
      
    }
/* aboute_section end*/
/* ***************************************************** */


/* aboute_progress_section start*/
    .aboute_progress_section{
    text-align: center;
}
.aboute_progress{
    margin-top: 80px;
    height: 100%;

}
.skills-text{
    background: #1C2229;
    width: 100%;
    padding: 20px;
    width: 100%; 
    width: 95%;
   height:100%;
   border-radius: 30px ;
   text-align: start;

}
.custom-icon {
    width:30px; 
    height: 30px; 
    fill: #f0b505; 
    margin: 10px 0;   
}
.skills-text h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 600;
    font-weight: bold;
    margin: 0;
    font-size: 26px;
  
}
.skills-text h6{
color: #ffffff;
font-weight: 500;
padding: 0;
margin:  0;
}
.skills-text h5{
    color: #ffffff;
    font-weight: 600;
    margin: 10px 0;
    font-size: 20px;

}

.progress{
    margin: 15px;
    background-color:#111122;
      
    width: 95%;
    height: 40px;
    text-align: center;

}
.progress-bar h5{
    color: #000000;
    text-transform: capitalize;
    margin: 20px;
    font-size: 15px;
    font-weight: 500;
}
.count-text{
    background: #1C2229;
    width: 100%;
    padding: 20px;
    border-radius: 30px ;
    justify-content: start;
   
   
}
.count-text h1{
    color: #F3B90B;
    text-align: start;
    margin: 10px 12px;
    text-transform: uppercase;
    font-weight: 600;
    font-weight: bold;
    font-size: 26px;

}
.progress .progress-bar{
    background-color: #F3B90B;
    color: #050400;
    text-align: left;
  
   
}
/* animition */

.progress-bar {
    transition: width 2s ease-in-out; 
}

.progress-animated {
    animation: fillProgressBar 2s forwards;
}

@keyframes fillProgressBar {
    from {
        width: 0;
    }
    to {
        
    }
}

/* aboute_progress_section end*/

/* ***************************************************** */
/*aboute_exparianc secion star*/
.experience_text{
    text-align: center;
    margin-top: 140px;
    justify-content: center;
    width: 100%;

}
.experience_text h1{
   margin: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;

}
.experience_text h3{
  text-transform: capitalize;
  margin: 10px 0;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 22px;
  font-weight: 400;
  text-align: center;
 
}
.experience_section{
    width: 100%;
    margin-top: 10px;
    padding: 0;
}
.experience{
    background: #1C2229;
    border-radius: 30px;
    height: 250px;
    overflow: hidden;
    margin: 38px 0 ;
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    box-sizing: border-box;
}
.experience-images-icon svg{
    width: 50px;
    height: 50px;
    color: #f0b505;
    text-align: center;
    margin-left: 33px;
  
}
.experience-item-text{
    margin-left: 46px;
    width: 700px;
    flex-grow: 1;
}
.experience-item-text h1{
    color:#ffffff;
    font-size: 18px;
    font-weight: 600;
    font-size: 30px;
    font-weight: bold;
    overflow: hidden;
    padding: 0;
    margin: 0;
   


}
.experience-item-text p{
    color: rgb(240, 235, 226);
    font-size: 18px;
    margin: 10px 0;

}

  
  .experience-images-icon {
    margin-right: 15px;
    flex-shrink: 0;
   
  }
  
  
/*aboute_exparianc setion end*/

/* ***************************************************** */
/*aboute_contact section start*/
.protfolioll-Contact{
    margin: 0 auto;
    transform: translateY(70px);
    text-align: center;
    width: 100%;
}

.protfolioll-Contact h1{
    text-align: center;
    margin-top: -30px;
    padding: 0;
    margin: 0 auto;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
}
.protfolioll-Contact h2{
  text-transform: capitalize;
  margin: 10px auto;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 26px;
  font-weight: 400;
    
}
.about-contacts_section{
    width: 100%;
    margin-top: 95px ;
    justify-content: center;
  }
  .about-contacts{
    width:100% !important;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
   border-radius: 30px ;
   height: auto;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
  }
  .about-contacts:hover{
    transform: scale(1);
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.7)

  }

  .about-contacts h1{
    color: #FFFFFF;
    text-transform: capitalize;
    font-weight: bold;
    margin-top: 10px;
    font-size: 30px;
    text-transform: capitalize;
    text-align: center;
  }
  .about-contacts h2{
    color: #FFFFFF;
    font-size: 20px;
    margin: 10px;
    text-transform: capitalize;
    text-align: center;
  }
  .about_contacts_icon{
    margin: 50px auto;
    margin-bottom: 80px;
    justify-content: center;
  }
   
  .icon-about svg{
    width: 50px;
    height: 50px;
    fill: #F3B90B;
    margin-left: 0px;
    top: 30px;
    margin: 0 auto !important;
    justify-content: center;
  }
  .icon-about{
    text-align: center;
    margin: 0;
    padding: 0;
    justify-content: center;

  }
  
 
 
/*aboute_contact secion end*/
/* ***************************************************** */
/* ***************************************************** */
/*contact secion start*/
.contact_the_section{
    margin: 0 auto;
    transform: translateY(40px);
    text-align: center;
  }
  .contact-the-email{
    text-align: center;
    margin-top: 70px;


  }
  .contact-the-email h1{
    margin: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
  }
  .contact-the-email h4{
    color: #f0b505;
    text-transform: capitalize;
    font-weight: 500;
    font-weight: bold;
    margin: 10px 0;

  }
  .contact-section{
    margin: 0 auto;
}

.contact_images_item{
    margin: auto;
    margin-top: 90px;
   }
  
   .contact_images{
    width: 100%;
    height:  auto;
  }
  .contact_images img{
    width: 100%;
    height: auto;
    border-radius: 20px;
    align-items: center;
  }
  .contact_detels h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 700;
    font-weight: bold;
    margin: 10px 0;
    font-size: 30px;

  }
  .contact_detels h2{
    color:#fff;
    text-transform: capitalize;
    margin: 0;
    font-weight: 400;
    font-size: 20px;
  }
  .contact_detels p{
    color: #fff;
    width: 100%;
    font-size: 14px;
    margin: 10px 0;
  }
  .address-items {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 50px;
    color: #f0b505;
    margin-top: 25px;
  }
  .address-items svg{
   width: 30px;
   height: 30px;
   margin-top: 0;
    
  }
  
  .address-items-text h3 {
    color: #ffffff;
    margin-left: 15px;
    margin-top: 45px;
    text-transform: capitalize;
    font-size: 20px;
    font-family:cursive;
    font-weight: 300;
  
   
    
  }
  .address-items-text p {
    color: #ffffff;
    margin-left: 15px;
    text-transform: capitalize;
    
  }
  .contact_images_item_section{
    margin: 20px ;
    margin-top: 45px;

   }
  .contact-the-email-text{
   margin: 20px;

  }
  .contact-the-email-text input{
    width: 100%;
    padding: 22px;
    margin: 10px;
    margin-left: 0;
    border-radius: 20px;
    background-color:#1C2229;
    height: 20px;
    
  }
  .contact-the-email-text label{
    margin-left: 0;
    color: #fff;
    text-transform: capitalize;
    font-size: 15px;
    font-weight: 600;
  }
  .form-control{
    height: 200px;
    border-radius: 20px;
    background-color:#1C2229 ;
    width: 100%;
    height: 30%;
    margin: 10px;
    margin-left: 0;
 }
 .btn-primary{
    width: 220px !important;
    height: 50px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    font-size: 16px;
    text-transform: capitalize;
 }

/*contact secion end*/
/* ***************************************************** */
/*cource_ secion start*/

.education_section_text{
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 100px;
}
.education_section_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 45px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
}
.education_section_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 20px;
    font-weight: 400;
}
.education_section_start{
    width: 100%;
    justify-content: center;
    margin-top: 50px;
}
.education_qualification_start{
  position: relative;
  width: 100%;
  background-color: #1C222A;
  font-weight: 500;
  box-sizing: border-box;
  padding: 40px 35px 40px 35px;
  border-radius: 30px;
  height: 400px;
  overflow: hidden;
  justify-content: center;
}
.education_qualification_start p{
  width: 95%;
  display: flex;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.5em;
  font-family: "Poppins", Sans-serif;
  margin: 0;
  color: #FFFF;
}
.education_qualification_start img{
    width: 40px;
  font-weight: 400;
  margin: 10px 0;
  display: block;
  background-color: #f0b505;
  border-radius: 30px;
}
.education_section_start h1{
    color: #f0b505;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 500;
    margin: 10px 0;
    padding: 0;
}
.education_qualification_start h2{
    color: #ffffff;
    text-transform: capitalize;
    font-size: 14px !important;
    font-weight: 400;
  }
.cource_section_start{
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 0;
    margin-top: 90px;
}
.cource_Contact_text{
    text-align: center;
    margin: 0;
    padding: 0;
}
.cource_Contact_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    margin: 0;
    padding: 0;
  
}
.cource_Contact_text h2{
    text-transform: capitalize;
    margin: 10px 0;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 20px;
    font-weight: 400;
    text-align: center;
}
.cource_contacts_section{
    width: 100%;
    justify-content: center;
    text-align: center;
    margin-top: 30px;
}
.cource_contacts{
    width:100% !important;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
   border-radius: 30px ;
   height: auto;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
   justify-content: center;
}
.cource_contacts_icon{
    margin: 50px auto;
    margin-bottom: 80px;
    text-align: center;
}
.icon_cource{
text-align: center;
}
.icon_cource svg {
        width: 50px;
        height: 50px; 
        fill:#F3B90B;
        margin-left: 0px;
        top: 30px;
        margin: 0 auto !important;
        text-align: center;
    } 
     .cource_contacts h1{
     text-transform: capitalize;
    color: #FFFFFF;
     font-family: "Poppins", Sans-serif;
    font-size: 25px;
    font-weight: 500;
    margin: 10px auto;
    text-align: center;
    }
  .cource_contacts h2{
 color: #FFFFFF;
  font-size: 20px;
  margin: 0 ;
  text-transform: capitalize;
  font-weight: 300;
  line-height: 1em;
  text-align: center;
  }
/*cource_ secion end*/
/* ***************************************************** */
/* ***************************************************** */
/* ***************************************************** */
/* ***************************************************** */
/* ***************************************************** */



  

  
 
 
 

 
  
 
 


 
  
 
 
.contact_footer{
    padding-bottom: 52rem !important

}
.cources_footer{
    padding-bottom: 78rem !important
}

/* animation section start*/
/*navber animation section start*/
.my-section h1 {
    opacity: 0;
    animation: fadeInDown 1.5s ease-out forwards;
    animation-delay: 0.3s;
  }
  
  @keyframes fadeInDown {
    from {
      opacity: 0;
      transform: translatey(50px);
    }
    to {
      opacity: 1;
      transform: translatey(0);
    }
  }
  
  /* Animation for h3 in .my-section */
  .my-section h3 {
    opacity: 0;
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 0.3s;
  }
  
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translatey(50px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  /* Animation for p in .my-section */
  .my-section p {
    opacity: 0;
    animation: fadeInLeft 2s ease-out forwards;
    animation-delay: 0.5s;
  }
  
  @keyframes fadeInLeft {
    from {
      opacity: 0;
      transform: translateX(-100%);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  
  
/*navber animation section endt*/
/* প্রাথমিক অবস্থার জন্য */

/*whate animation section start*/
/* Keyframes */
@keyframes slideInLeft {
    0% {
        opacity: 0;
        transform: translateX(-100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInBottom {
    0% {
        opacity: 0;
        transform: translateY(50%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Base styles */
.animate-left, .animate-right, .animate-bottom {
    opacity: 0; /* স্ক্রীনে আসার আগে অদৃশ্য থাকবে */
    transition: opacity 1s ease-out, transform 1s ease-out;
}

/* In-view animations */
.in-view.animate-left {
    animation: slideInLeft 1s ease-out forwards;
}

.in-view.animate-right {
    animation: slideInRight 1s ease-out forwards;
}

.in-view.animate-bottom {
    animation: slideInBottom 1s ease-out forwards;
}

/*whate animation section endt*/


  
/*profolio section animation start*/

/* সেকশনের প্রাথমিক অবস্থান */
.profolio_item {
    opacity: 0; /* প্রাথমিকভাবে অদৃশ্য */
    transform: translateY(30px); /* নিচ থেকে উপরে আসবে */
    transition: opacity 1s ease-out, transform 1s ease-out;
}

/* সেকশন যখন স্ক্রীনে আসবে, তখন এনিমেশন হবে */
.profolio_item.in-view {
    opacity: 1;
    transform: translateY(0); /* নিচ থেকে উপরে উঠবে */
}

/* ডান দিক থেকে আসার জন্য এনিমেশন */
.profolio_item-left.in-view {
    opacity: 1;
    transform: translateX(0);
    animation: slideInLeft 1s ease-out forwards;
}

/* বাম দিক থেকে আসার জন্য এনিমেশন */
.profolio_item-right.in-view {
    opacity: 1;
    transform: translateX(0);
    animation: slideInRight 1s ease-out forwards;
}

/* নিচ থেকে আসার জন্য এনিমেশন */
.profolio_item-bottom.in-view {
    opacity: 1;
    transform: translateY(0);
    animation: slideInBottom 1s ease-out forwards;
}

/* স্লাইড ইন ডান দিক থেকে */
@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* স্লাইড ইন বাম দিক থেকে */
@keyframes slideInLeft {
    0% {
        opacity: 0;
        transform: translateX(-100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* স্লাইড ইন নিচ থেকে */
@keyframes slideInBottom {
    0% {
        opacity: 0;
        transform: translateY(50%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/*profolio section animation end*/

/*testimonial section animation start*/
/* Testimonial Items এর জন্য প্রাথমিক অবস্থান */
.testimonial {
    opacity: 0;
    transform: translateY(30px); /* নিচ থেকে উপরে আসবে */
    transition: opacity 1s ease-out, transform 1s ease-out;
}

/* সেকশন স্ক্রীনে আসলে এনিমেশন শুরু হবে */
.testimonial.in-view {
    opacity: 1;
    transform: translateY(0); /* নিচ থেকে উপরে উঠবে */
}

/* ডান দিক থেকে আসার জন্য এনিমেশন */
.testimonial.animate-left.in-view {
    animation: slideInLeft 1s ease-out forwards;
}

/* বাম দিক থেকে আসার জন্য এনিমেশন */
.testimonial.animate-right.in-view {
    animation: slideInRight 1s ease-out forwards;
}

/* নিচ থেকে আসার জন্য এনিমেশন */
.testimonial.animate-bottom.in-view {
    animation: slideInBottom 1s ease-out forwards;
}

/* স্লাইড ইন ডান দিক থেকে */
@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* স্লাইড ইন বাম দিক থেকে */
@keyframes slideInLeft {
    0% {
        opacity: 0;
        transform: translateX(-100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* স্লাইড ইন নিচ থেকে */
@keyframes slideInBottom {
    0% {
        opacity: 0;
        transform: translateY(50%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/*contact section animation start*/
/* Contacts Item এর জন্য প্রাথমিক অবস্থান */
.contacts {
    opacity: 0;
    transform: translateY(30px); /* নিচ থেকে উপরে আসবে */
    transition: opacity 1.5s ease-out, transform 1.5s ease-out;
}

/* সেকশন স্ক্রীনে আসলে এনিমেশন শুরু হবে */
.contacts.in-view {
    opacity: 1;
    transform: translateY(0); /* নিচ থেকে উপরে উঠবে */
}

/* ডান দিক থেকে আসার জন্য এনিমেশন */
.contacts.animate-left.in-view {
    animation: slideInLeft 1s ease-out forwards;
}

/* বাম দিক থেকে আসার জন্য এনিমেশন */
.contacts.animate-right.in-view {
    animation: slideInRight 1s ease-out forwards;
}

/* নিচ থেকে আসার জন্য এনিমেশন */
.contacts.animate-bottom.in-view {
    animation: slideInBottom 1s ease-out forwards;
}

/* স্লাইড ইন ডান দিক থেকে */
@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* স্লাইড ইন বাম দিক থেকে */
@keyframes slideInLeft {
    0% {
        opacity: 0;
        transform: translateX(-100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

/* স্লাইড ইন নিচ থেকে */
@keyframes slideInBottom {
    0% {
        opacity: 0;
        transform: translateY(50%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

  
/*contact section animation end*/


/*aboute_contact section animation star*/
.about-contacts {
    opacity: 0;
    transform: translateY(30px); /* নিচ থেকে উপরে আসবে */
    transition: opacity 1s ease-out, transform 1s ease-out;
  }
  
  /* সেকশন স্ক্রীনে আসলে এনিমেশন শুরু হবে */
  .about-contacts.in-view {
    opacity: 1;
    transform: translateY(0); /* নিচ থেকে উপরে উঠবে */
  }
  
  /* ডান দিক থেকে আসার জন্য এনিমেশন */
  .about-contacts.animate-left.in-view {
    animation: slideInLeft 1s ease-out forwards;
  }
  
  /* বাম দিক থেকে আসার জন্য এনিমেশন */
  .about-contacts.animate-right.in-view {
    animation: slideInRight 1s ease-out forwards;
  }
  
  /* নিচ থেকে আসার জন্য এনিমেশন */
  .about-contacts.animate-bottom.in-view {
    animation: slideInBottom 1s ease-out forwards;
  }
  
  /* স্লাইড ইন ডান দিক থেকে */
  @keyframes slideInRight {
    0% {
      opacity: 0;
      transform: translateX(100%);
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  /* স্লাইড ইন বাম দিক থেকে */
  @keyframes slideInLeft {
    0% {
      opacity: 0;
      transform: translateX(-100%);
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  /* স্লাইড ইন নিচ থেকে */
  @keyframes slideInBottom {
    0% {
      opacity: 0;
      transform: translateY(50%);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
/*aboute_contact section animation end*/






/*about section animation start*/
/* Animation for the image */
.animated-img {
    transform: translateY(100px);
    opacity: 0;
    animation: slideIn 1s ease-out forwards;
}

/* Animation for the name */
.animated-name {
    transform: scale(0.7);
    opacity: 0;
    animation: zoomIn .6s ease-out forwards 0.6s;
}

/* Animation for the title */


/* Keyframes */
@keyframes slideIn {
    0% {
        transform: translateY(70%);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes zoomIn {
    0% {
        transform: scale(0.8);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes fadeUp {
    0% {
        transform: translateY(50px);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

/*proggrsber section start*/
.animated-element {
    opacity: 0;
    transform: translatex(-30%); /* নিচ থেকে উপরে আসবে */
    transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out;
}

.animated-element.visible {
    opacity: 1;
    transform: translateY(0);
}


  
/*proggrsber section end*/
/*exparianc section start*/
.experience_section .experience {
    opacity: 0;
    transform: translatex(-80%); /* নিচ থেকে উপরে আসবে */
    transition: all 1.5s ease-in-out;
  }
  
  .experience_section .experience.visible {
    opacity: 1;
    transform: translateY(0);
  }
  
/*exparianc section end*/



/*about section animation end*/

/*cource_section section animation start*/

/* Education Section Item এর জন্য প্রাথমিক অবস্থান */
.education_qualification {
    opacity: 0;
    transform: translateY(30px); /* নিচ থেকে উপরে আসবে */
    transition: opacity 1s ease-out, transform 1s ease-out;
}

/* সেকশন স্ক্রীনে আসলে এনিমেশন শুরু হবে */
.education_qualification.in-view {
    opacity: 1;
    transform: translateY(0); /* নিচ থেকে উপরে উঠবে */
}

/* স্লাইড ইন ডান থেকে বাম */
@keyframes slideInFromRight {
    0% {
        opacity: 0;
        transform: translatex(-50%); /* ডান থেকে আসবে */
    }
    100% {
        opacity: 1;
        transform: translateX(0); /* সোজা অবস্থায় আসবে */
    }
}

/* স্লাইড ইন বাম থেকে ডান */
@keyframes slideInFromLeft {
    0% {
        opacity: 0;
        transform: translatey(50%); /* বাম থেকে আসবে */
    }
    100% {
        opacity: 1;
        transform: translateX(0); /* সোজা অবস্থায় আসবে */
    }
}

/* স্লাইড ইন মাঝখান থেকে */
@keyframes slideInFromCenter {
    0% {
        opacity: 0;
        transform: translatex(50%); /* মাঝ থেকে নিচ থেকে উঠবে */
    }
    100% {
        opacity: 1;
        transform: translateY(0); /* সোজা অবস্থায় আসবে */
    }
}

/* ডান থেকে বাম স্লাইড */
.animate-righte {
    animation: slideInFromRight 1s ease-out forwards;
}

/* বাম থেকে ডান স্লাইড */
.animate-lefte {
    animation: slideInFromLeft 1s ease-out forwards;
}

/* মাঝখান থেকে স্লাইড */
.animate-centere {
    animation: slideInFromCenter 1s ease-out forwards;
}


/*cource_section section animation end*/












/* navber & banner section*/

@media (max-width: 991px) {
    .banner {
        display: flex;
        flex-direction: column;
    }
    
    .imag {
        order: 1; 
        text-align: center;
        width: 100%;
     
       
    }
    .imag img{
        text-align: center;
       margin: 0;
       padding: 0;
       
    }

    .text {
        order: 2; 
        text-align: center;
        margin-top: -162px;

    }


    .imag img {
        max-width: 50%; 
        margin: 0 auto;
        padding-bottom: 20px; 
    }

    .expart, .expartText {
        margin-top: 10px;
        text-align: center;
    }
    .banner {
        display: flex;
        flex-direction: column;
    }
    
    .imag {
        order: 1;
        text-align: center !important;
        width: 100%;
        margin: 10px 0;
    }

    .text {
        order: 2;
        text-align: center;
        margin-left: 0;
        width: 100%;
    }
   

    .imag img {
        max-width: 100%;
        margin: 0 auto;
        padding-bottom: 20px;
        text-align: center;
        margin-top: -70px;
    }

    .expart, .expartText {
        margin-top: 10px;
        text-align: center;
    }

    .nav-item a {
        color: #000000 !important;
        margin: 0px;
        text-align: left;

    }
    .navbar-nav .nav-item .nav-link:hover  {
        color: #000000 !important;
        background-color: #b9e948 !important; 
        margin: 5px ;
    }
    
      .navbar-nav .nav-item .nav-link.active {
        color: #000000 !important; 
        background-color: #b9e948 !important;   
        margin: 7px; 
       
       
      }

    .navbar-collapse {
        position: absolute;
        top: 0;
        left: 0;
        width: 70%;
        z-index: 1000;
        background-color: #f5b711;
        border-radius: 0 0 7px 7px;
    }
    
    .navbar-toggler {
        display: block;
        z-index: 1100;
    }
    
    .navbar-toggler-icon {
        color: #d1a6a6;
        border-radius: 20%;
    }
    
    .navbar.show {
        display: block;
    }
    
    .navbar-collapse.collapse.show {
        display: block;
    }
    .kamal-text {
        text-align: center;
        margin: 0;
        padding: 0;
        
    }
    .banner{
        width: 100%;
        margin-left: 0;
       
        
    }
    .text{
        order: 2;
        text-align: left;
        margin-left: 0;
        width: 100%; 

    }
    .banner h4{
      
        padding: 10px 0;
        margin-left: 0px;
        text-align: left;
        padding-top: 0;
       
        
    }
    .banner h1 {
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-size: 35px;
        font-weight: bold;
        margin: 0;
        bottom: 250px;
        width: 100%;


      }
    .expart{
        padding: 0;
        margin-left: 0;
        text-align: center;
        width: 100%;
        text-align:center ;
        margin-top: 10px;
        left:  0;
        order: 1;
         height: 80PX;
       
    }
    .phplaravel {
        margin-left: 0;
        width: 100%;
        text-align: center; 
        left: 0;
        order: 2;
        text-align: center;
        margin-top: 130px;
        padding: 0;
        height: 80PX;
      }
      .phplaravel p {
        margin: 0 auto;
        text-align: center;
        color: #F3B90F;
        line-height: 1;
        margin-top:10px;
      }
      
      
    /* whate section start*/
    .whate {
        text-align: center;
        margin-top: 70px;
        width: 100%;
        text-align: center;
        margin-left: 0;
      }

    .whate h1 {
        margin-top: 70px;
        text-align: center;
    
        }
        .whate p {
           
            font-size: 20px;
            text-align: center;
          }
          .whate_section{
            margin-top: 10px;
        }
        .image_item{
            width: 100%;
            margin: 40px 0;
            margin-left: 0;
            height: 470px;
           
        } 
        
        .image_item img{
            width: 60px;
            font-weight: 600;
            border: 2px solid rgb(18, 139, 2);
            background-color:#000000 ;
            border-radius: 100%;
            box-shadow: 0px 4px 10px rgba(245, 242, 242, 0.5); 
            transition: transform 0.3s, box-shadow 0.3s; 
            margin: 10px 0;
            
            }
            .skill_text {
                width: 90%;
                overflow: hidden;
            }
            .skill_text p{
                width: 100%;
                padding: 0;
                margin: 0;
                overflow: hidden;
                color: #FFFFFF;
                font-family: "Poppins", Sans-serif;
                text-transform: capitalize;
                font-weight: 300;
                line-height: 1.6em;
                font-size: 20px;
            }
            .skill_text h3{
                text-transform: uppercase;
                font-weight: bold;
                font-size: 26px;
                color: #f0b505;
                width: 100%;
                margin: 0;
                padding: 10px 0;   
            }
    
    .say_hello {
        color: #FFFFFF;
        text-decoration: none;
        font-size: 20px;
        text-transform: capitalize;
        font-weight: bold;
        display: inline-block;
        font-size: 26px;
        font-weight: bold;
        border: none;
        margin-top: 30px;
    }
    .say_hello:hover{
        color: #F3B90F;
    }
   
    .sayhello{
    color: #F3B90F;
    font-weight: bold;
    font-size: 20px;
    }

  /* whate section end*/

  /*********************************************************************************/

  /* protfolioll_section start*/

  .protfolioll_section_text{
    text-align: center;
    margin-top: 95px;
    justify-items: center;
    width: 100%;
    }
    .protfolioll{
        width: 100%;
        margin: 0 auto;
    }
    .protfolioll h1{
        
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-size: 55px;
        font-weight: 600;
        text-transform: uppercase;
        margin: 0 auto;
    }
    .protfolioll h2{
        text-transform: capitalize;
        margin: 10px auto;
        color: #F3B90B;
        font-family: "Poppins", Sans-serif;
        font-size: 20px;
        font-weight: 400;
    }
    .profolio_section{
        margin-top: -20px !important;
      }

.profolio_item{
    width: 100% !important;
    margin: 0 auto;
    left: 0;
    margin: 40px 0;
    height: 470px !important;
    margin-left: 0;
    }
    .profolio_item img{
        width: 100%;
        left: 0;
        margin-left: 0;
    }
    .protfolio_text h3{
        width: 100%;
        margin: 10px 0 !important;
        text-align: left;
        font-size: 30px !important;
    }
    .protfolio_text p{
        margin: 0 !important;
        width: 100%;
        margin:  0 ;
        font-size: 26px;
        font-family: 400;
        font-family: "Poppins", Sans-serif;
      line-height: 1.6em;
    }
    .protfolio_say_hello{
        margin: 20px 0;
        padding: 10px 0;
        margin-left: 0;
        font-size: 30px;
        font-weight: 400;
        font-family: "Poppins", Sans-serif;
     
    }
    .protfolio_sayhello{
        color: #f0b505;
        

    }

   /* protfolioll_section end*/

/*********************************************************************************/

/*testimonial_section start*/
.testimonial_text_section{
    margin-top: 100px;
    text-align: center;
    width: 100%;
}
.testimonial_text{
    margin: 0 auto;
    text-align: center;

}
.testimonial_text h1{
    margin: 0 auto;
    padding: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
}
.testimonial_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 400;
    text-align: center;
}
.testimonial_section{
    width: 100%;
    margin-top: -20px;
}
.testimonial{
    overflow: hidden;
    width: 100%;
    margin: 40px 0;
    height: auto;
   
}
.testimonial h1{
    padding:10px 0;
    margin-left: 0;
}
.testimonial h2{
  
    margin-left: 0;
    margin-bottom: 0px ;
    margin-left: 0;
    font-size: 25px !important;
}
.testimonial p{
   margin: 0px;
  text-transform: capitalize;
  font-weight: 600;
  font-size: 18px;
  margin: 0;
  text-align: left;
  color: #FFFFFF;
  font-family: "Poppins", Sans-serif;
  text-transform: capitalize;
  font-weight: 300;
  line-height: 1.6em;
  width: 100%;
  margin: 15px 0 !important;
}
/*testimonial_section end*/

/*********************************************************************************/

/*contact_section start*/
.contacts_text_section{
    margin-top: 100px;
    width: 100%;
}
.contacts_text{
    margin: 0 auto;
    text-align: center; 
    width: 100%;
}
.contacts_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
    padding: 0;
    margin-top: 50px;

}
.contacts_text h2{
    color: #f0b505;
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 400;
}
.contacts_section{
    width: 100%;
    margin-top: 10px;
    text-align: center;
}
.contacts{
    width:100%;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
   border-radius: 30px ;
   height: 250px;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
   margin: 40px 0;
  }
  .contacts h2{
    color: #FFFFFF;
    font-size: 20px;
    margin: 0 auto;
    text-transform: capitalize;
    font-weight: 300;
     line-height: 1.6em;

  }
/*contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*about_section start*/
.about-image{
width: 100%;
margin: 0 auto;
text-align: center;

}

.about-image img{
    width: 60% !important;
    margin: 0 auto;
    font-weight: 600;
    text-align: center;
    margin-top:50px;

    
}
.about-image h1{
    color: #D5D5D5;
    text-transform: uppercase;
    font-weight: bold;
    margin-top:-70px;
    text-transform: capitalize;
    font-weight: 700;
    text-align:center ;
    text-transform: uppercase;
    width: 100%;
    padding: 0;
    color: #D5D5D5;
    font-family: "Poppins", Sans-serif;
    font-size: 60px;  
    
}
.about-image h2{
    color: #F5B711;
    text-align: center;
    font-size: 18px;
    font-family: "Poppins", Sans-serif;
    font-weight: 700;
    margin: 0;
      
}

.about-text{
    width: 100%;
    padding: 30px;

}
.about-text h1{
margin: 10px 0;
justify-content: center;
}
.about-text p{
    width: 100%;
    font-size: 15px;
}
/*pograss_section start*/
.aboute_progress_section{
    text-align: center;
}
.aboute_progress{
    margin-top: 40px;
    height: 100%;

}
.skills-text{

    width: 100%;
    margin-left: 0;
    margin: 20px 0;
  }
  .skills-text h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 600;
    font-weight: bold;
    margin: 0;
  
}
.skills-text h6{
color: #ffffff;
font-weight: 500;
padding: 0;
margin:  0;
}
.skills-text h5{
    color: #ffffff;
    font-weight: 700;
    font-weight: bold;
    margin: 10px 0;

}
  .count-text{
  background: #1C2229;
  width: 100%;
  border-radius: 40px;
  justify-content: start;
  margin: 75px 0;
  }
/*pograss_section end*/

/*********************************************************************************/
/*aboute_experience_section end*/
.experience_text{
    text-align: center;
    margin-top: 40px;
    justify-content: center;
    width: 100%;

}
.experience_text h1{
   margin: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;

}
.experience_text h3{
  text-transform: capitalize;
  margin: 10px 0;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 22px;
  font-weight: 400;
  text-align: center;
 
}
.experience_section{
    width: 100%;
    margin-top: -30px;
    padding: 0;
}
.experience{
    width: 100%;
    margin-left: 0;
    margin:60px 0;
}
.experience-images-icon{
    margin: 0;
}

.experience-image {
    max-width: 100%;
    height: auto;
  }
  .experience-item-text {
    width: 100%;
    margin-left: 20px  ;
  }
  .experience-item-text p {
    
    margin: 20px ;
    margin-left: 0;
    font-size: 18px;
    
    
  }
  .experience-item-text h1{
    color:#ffffff;
    font-size: 18px;
    font-weight: 600;
    font-size: 30px;
    font-weight: bold;
    overflow: hidden;
    padding: 0;
    margin: 0;
   


}



/*aboute_experience_section end*/
/*********************************************************************************/
/*aboute_contact_section start*/
.protfolioll-Contact{
    margin: 0 auto;
    transform: translateY(40px) !important;
    text-align: center;
    justify-content: center;
    width: 100%;
}

.protfolioll-Contact h1{  
    text-align: center;
    margin-top: -30px;
    padding: 0;
    margin: 0 auto;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    justify-content: center;
}
.protfolioll-Contact h2{
  text-transform: capitalize;
  margin: 10px auto;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 16px;
  font-weight: 300;
text-align: center;
justify-content: center;
    
}

.about-contacts_section{
    width: 100%;
    margin-top: 20px !important;
    justify-content: center;
  }
  .about-contacts{
    width: 100%;
    background-color: #1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
    border-radius: 30px;
    height: 250px;
    overflow: hidden;
    box-sizing: border-box;
    text-align: center;
    margin: 32px auto;
    justify-content: center;
    
  }
  .about_contacts_icon {
    margin: 50px auto;
      margin-bottom: 50px;
    margin-bottom: 80px;
    justify-content: center;
  }
  .icon-about svg{
    width: 50px;
    height: 50px; 
    fill:#F3B90B;
    margin-top:20px;
    text-align: center;
  }
  
  .about-contacts h1{
    color: #FFFFFF;
    text-transform: capitalize;
    font-weight: bold;
    margin-top: 10px;
    font-size: 30px;
    text-transform: capitalize;
    text-align: center;
  }
  .about-contacts h2{
    color: #FFFFFF;
    font-size: 20px;
    margin: 10px;
    text-transform: capitalize;
    text-align: center;
  }

/*aboute_contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*cource_ secion start*/

.education_section_text{
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 100px;
}
.education_section_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
}
.education_section_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 18px;
    font-weight: 400;
    text-align:center ;
}
.education_section_start{
    width: 100%;
    justify-content: center;
    margin-top: -10px !important;
}
.education_qualification_start{
  position: relative;
  width: 100%;
  background-color: #1C222A;
  font-weight: 500;
  box-sizing: border-box;
  padding: 40px 35px 40px 35px;
  border-radius: 30px;
  height: 330px;
  overflow: hidden;
  justify-content: center;
  margin: 32px 0;
}
.education_qualification_start p{
  width: 95%;
  display: flex;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.5em;
  font-family: "Poppins", Sans-serif;
  margin: 0;
  color: #FFFF;
}
.education_qualification_start img{
    width: 40px;
  font-weight: 400;
  margin: 10px 0;
  display: block;
  background-color: #f0b505;
  border-radius: 30px;
}
.education_section_start h1{
    color: #f0b505;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 500;
    margin: 10px 0;
    padding: 0;
}
.education_qualification_start h2{
    color: #ffffff;
    text-transform: capitalize;
    font-size: 14px !important;
    font-weight: 400;
  }
.cource_section_start{
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 0;
    margin-top: 70px;
}
.cource_Contact_text{
    text-align: center;
    margin: 0;
    padding: 0;
}
.cource_Contact_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 40px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    margin: 0 auto;
    padding: 0;
  
}
.cource_Contact_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 18px;
    font-weight: 400;
    text-align: center !important;
    width: 90%;
}
.cource_contacts_section{
    width: 100%;
    justify-content: center;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 40px;
}
.cource_contacts{
    width:100% !important;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
   border-radius: 30px ;
   height: auto;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
   justify-content: center;
   margin: 32px auto;
}
.cource_contacts_icon{
    margin: 50px auto;
    margin-bottom: 80px;
    text-align: center;
}
.icon_cource{
text-align: center;
}
.icon_cource svg {
        width: 50px;
        height: 50px; 
        fill:#F3B90B;
        margin-left: 0px;
        top: 30px;
        margin: 0 auto !important;
        text-align: center;
    } 
     .cource_contacts h1{
     text-transform: capitalize;
    color: #FFFFFF;
     font-family: "Poppins", Sans-serif;
    font-size: 25px;
    font-weight: 500;
    margin: 10px auto;
    text-align: center;
    }
  .cource_contacts h2{
 color: #FFFFFF;
  font-size: 20px;
  margin: 0 ;
  text-transform: capitalize;
  font-weight: 300;
  line-height: 1em;
  text-align: center;
  }
/*********************************************************************************/
/*********************************************************************************/
/*Education Qualification_section end*/
/*contact_section start*/
.contact_the_section{
    margin: 0 auto;
    transform: translateY(40px);
    text-align: center;
  }
  .contact-the-email{
    text-align: center;
    margin-top: 60px;


  }
  .contact-the-email-text{
    margin: 20px;
    margin-top: 70px ;
 
   }
  .btn-primary{
    width: 220px !important;
    height: 50px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    text-transform: capitalize;
 }
  .contact-the-email h1{
    text-transform: uppercase;
    color: #ffff;
    font-weight: 700;
    font-size: 50px;
    margin: 0;
    font-family: "Poppins", Sans-serif; 
 }
  .contact-the-.btn-primary{
    width: 220px !important;
    height: 50px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    font-size: 16px;
    text-transform: capitalize;
 } h4{
    color: #f0b505;
    text-transform: capitalize;
    font-weight: 500;
    font-weight: bold;
    margin: 10px 0;

  }
.contact-section{
    margin: 0 auto;
    margin-top: -60px;

}
.contact_images_item{
    margin: auto;
    margin-top: 90px;
   }
   .contact_images{
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}
.contact_images img{
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}  
.contact_detels h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 700;
    font-weight: bold;
    margin: 10px 0;

  }
  .contact_detels h2{
    color:#fff;
    text-transform: capitalize;
    margin: 0;
    font-weight: 600;
    font-weight: bold;
    font-size: 25px;
  }
  .contact_detels p{
    color: #fff;
    width: 100%;
    font-size: 14px;
    margin: 10px 0;
  }
  .address-items svg{
    width: 30px;
    height: 30px;
    margin-top: 0;
     
   }
   
   .address-items-text h3 {
     color: #ffffff;
     margin-left: 15px;
     margin-top: 40px;
     text-transform: capitalize;
   
    
     
   }
   .address-items-text p {
     color: #ffffff;
     margin-left: 15px;
     text-transform: capitalize;
     
   }
  



/*contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
    /*footr sectiob star */


    .fotter_section {
        padding: 30px 0;
        font-family: Arial, sans-serif;
        background-color: #1C222A;
        margin-top: 30px;
        width: 100%;
        height: auto;
    }
    
    .pottersection {
        text-align: center;
        margin: 15px auto;
      
    }
    
    .pottersection lu {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: center;
        gap: 20px;
    }
    
    .fotter_item {
        display: inline-block;
        width: 50px;
        height: 50px;
        border: 2px solid #dad602;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #0a0a08; /* White background for icons */
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    
    .fotter_item svg {
        width: 24px;
        height: 24px;
        color: #F3B90B;
        transition: color 0.3s ease;
    }
    
    .fotter_item:hover {
        transform: scale(1.1);
        box-shadow: 0 3px 10px rgb(192, 206, 3);
        background-color: #967001; /* Hover background color */
    }
    
    .fotter_item:hover svg {
        color: #F3B90B; /* Icon color on hover */
    }
    
    .potterlink {
        text-align: center;
        margin: 15px a;
        font-size: 20px;
        color: #F3B90F;
    }
    
    .potterlink a {
        text-decoration: none;
        color: #F3B90F;
        transition: color 0.3s ease;
    }
    
    .potterlink a:hover {
        color: #a89d00;
        text-decoration: underline;
    }
    
    
    /* footer_section end*/
/*********************************************************************************/
      











}




@media (max-width: 767px) {
    .banner {
        display: flex;
        flex-direction: column;
    }
    
    .imag {
        order: 1; 
        text-align: center;
        width: 100%;
     
       
    }
    .imag img{
        text-align: center;
       margin: 0;
       padding: 0;
       
    }

    .text {
        order: 2; 
        text-align: center;
        margin-top: -100px;

    }


    .imag img {
        max-width: 50%; 
        margin: 0 auto;
        padding-bottom: 20px; 
    }

    .expart, .expartText {
        margin-top: 10px;
        text-align: center;
    }
    .banner {
        display: flex;
        flex-direction: column;
    }
    
    .imag {
        order: 1;
        text-align: center !important;
        width: 100%;
        margin: 10px 0;
    }

    .text {
        order: 2;
        text-align: center;
        margin-left: 0;
        width: 100%;
    }
   

    .imag img {
        max-width: 100%;
        margin: 0 auto;
        padding-bottom: 20px;
        text-align: center;
        margin-top: -70px;
    }

    .expart, .expartText {
        margin-top: 10px;
        text-align: center;
    }

    .nav-item a {
        color: #000000 !important;
        margin: 0px;
        text-align: left;

    }
    .navbar-nav .nav-item .nav-link:hover  {
        color: #000000 !important;
        background-color: #b9e948 !important; 
        margin: 5px ;
    }
    
      .navbar-nav .nav-item .nav-link.active {
        color: #000000 !important; 
        background-color: #b9e948 !important;   
        margin: 7px; 
       
       
      }

    .navbar-collapse {
        position: absolute;
        top: 0;
        left: 0;
        width: 70%;
        z-index: 1000;
        background-color: #f5b711;
        border-radius: 0 0 7px 7px;
    }
    
    .navbar-toggler {
        display: block;
        z-index: 1100;
    }
    
    .navbar-toggler-icon {
        color: #d1a6a6;
        border-radius: 20%;
    }
    
    .navbar.show {
        display: block;
    }
    
    .navbar-collapse.collapse.show {
        display: block;
    }
    .kamal-text {
        text-align: center;
        margin: 0;
        padding: 0;
        
    }
    .banner{
        width: 100%;
        margin-left: 0;
       
        
    }
    .text{
        order: 2;
        text-align: left;
        margin-left: 0;
        width: 100%; 

    }
    .banner h4{
      
        padding: 10px 0;
        margin-left: 0px;
        text-align: left;
        padding-top: 0;
       
        
    }
    .banner h1 {
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-size: 35px;
        font-weight: bold;
        margin: 0;
        bottom: 250px;
        width: 100%;


      }
    .expart{
        padding: 0;
        margin-left: 0;
        text-align: center;
        width: 100%;
        text-align:center ;
        margin-top: 10px;
        left:  0;
        order: 1;
         height: 80PX;
       
    }
    .phplaravel {
        margin-left: 0;
        width: 100%;
        text-align: center; 
        left: 0;
        order: 2;
        text-align: center;
        margin-top: 130px;
        padding: 0;
        height: 80PX;
      }
     
      
      
    /* whate section start*/
    .whate {
        text-align: center;
        margin-top: 90px;
        width: 100%;
        text-align: center;
        margin-left: 0;
      }

    .whate h1 {
        margin-top: -17px;
        text-align: center;
    
        }
        .whate p {
           
            font-size: 20px;
            text-align: center;
          }
          .whate_section{
            margin-top: 10px;
        }
        .image_item{
            width: 100% !important;
            margin: 32px 0;
            margin-left: 0;
            height: 410px;
                } 
        
        .image_item img{
            width: 60px;
            font-weight: 600;
            border: 2px solid rgb(18, 139, 2);
            background-color:#000000 ;
            border-radius: 100%;
            box-shadow: 0px 4px 10px rgba(245, 242, 242, 0.5); 
            transition: transform 0.3s, box-shadow 0.3s; 
            margin: 10px 0;
            
            }
            .skill_text {
                width: 90% !important;
                overflow: hidden;
            }
          .skill_text p{
                width: 100% !;
                padding: 0;
                margin: 0;
                overflow: hidden;
                color: #FFFFFF;
                font-family: "Poppins", Sans-serif;
                text-transform: capitalize;
                font-weight: 300;
                line-height: 1.6em;
                font-size: 16px;
            }
            .skill_text h3{
                text-transform: uppercase;
                font-weight: bold;
                font-size: 26px;
                color: #f0b505;
                width: 100%;
                margin: 0;
                padding: 10px 0;   
            }
    
    .say_hello {
        color: #FFFFFF;
        text-decoration: none;
        font-size: 20px;
        text-transform: capitalize;
        font-weight: bold;
        display: inline-block;
        font-size: 26px;
        font-weight: bold;
        border: none;
        margin-top: 30px;
    }
    .say_hello:hover{
        color: #F3B90F;
    }
   
    .sayhello{
    color: #F3B90F;
    font-weight: bold;
    font-size: 20px;
    }

  /* whate section end*/

  /*********************************************************************************/

  /* protfolioll_section start*/

  .protfolioll_section_text{
    text-align: center;
    margin-top: 95px;
    justify-items: center;
    width: 100%;
    }
    .protfolioll{
        width: 100%;
        margin: 0 auto;
    }
    .protfolioll h1{
        
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-size: 55px;
        font-weight: 600;
        text-transform: uppercase;
        margin: 0 auto;
    }
    .protfolioll h2{
        text-transform: capitalize;
        margin: 10px auto;
        color: #F3B90B;
        font-family: "Poppins", Sans-serif;
        font-size: 20px;
        font-weight: 400;
    }
    .profolio_section{
        margin-top: -20px !important;
      }

.profolio_item{
    width: 100% !important;
    margin: 0 auto;
    left: 0;
    margin: 32px 0;
    height: auto;
    margin-left: 0;
    }
    .profolio_item img{
        width: 100%;
        left: 0;
        margin-left: 0;
    }
    .protfolio_text h3{
        width: 100%;
        margin: 0;
        text-align: left;
    }
    .protfolio_text p{
        margin: 0;
        width: 100%;
        margin: 10px 0;
        font-size: 20px;
    }
    .protfolio_say_hello{
        margin: 20px 0 !important;
        margin-left: 0;
        font-family: "Poppins", Sans-serif;
        font-weight: 700;

        
     
    }
    .protfolio_sayhello{
        color: #f0b505;
        

    }

   /* protfolioll_section end*/

/*********************************************************************************/

/*testimonial_section start*/
.testimonial_text_section{
    margin-top: 100px;
    text-align: center;
    width: 100%;
}
.testimonial_text{
    margin: 0 auto;
    text-align: center;

}
.testimonial_text h1{
    margin: 0 auto;
    padding: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 50px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
}
.testimonial_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 400;
    text-align: center;
}
.testimonial_section{
    width: 100%;
    margin-top: -20px;
}
.testimonial{
    overflow: hidden;
    width: 100%;
    margin: 32px 0;
   
}
.testimonial h1{
    padding:10px 0;
    margin-left: 0;
}
.testimonial h2{
  margin: 0;
    margin-left: 0;
    font-size: 22px;
}
.testimonial p{
margin: 0px;
width: 100%;
font-size: 15px;
}
/*testimonial_section end*/

/*********************************************************************************/

/*contact_section start*/
.contacts_text_section{
    margin-top: 100px;
    width: 100%;
}
.contacts_text{
    margin: 0 auto;
    text-align: center; 
    width: 100%;
}
.contacts_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 55px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
    padding: 0;
    margin-top: 50px;

}
.contacts_text h2{
    color: #f0b505;
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 20px;
    font-weight: 400;
}
.contacts_section{
    width: 100%;
    margin-top: 10px;
    text-align: center;
}
.contacts{
    width:100%;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
   border-radius: 30px ;
   height: 250px;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
   margin: 32px 0;
  }
/*contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*about_section start*/
.about-image{
width: 100% !important;
margin: 0 auto;
text-align: center;

}

.about-image img{
    width: 70%!important;
    margin: 0 auto;
    font-weight: 600;
    text-align: center;
    margin: 0 auto;
    margin-top: 0px;
    font-weight: 600;
    text-align: center;
    margin-top: 50px;
}
.about-image h1{
    color: #D5D5D5;
    text-transform: uppercase;
    font-weight: bold;
    margin-top:-20px;
    text-transform: capitalize;
    font-weight: 700;
    text-align:center ;
    text-transform: uppercase;
    width: 100%;
    padding: 0;
    color: #D5D5D5;
    font-family: "Poppins", Sans-serif;
    font-size: 50px;
    
}
.about-image h2{
    color: #F5B711;
    text-align: center;
    font-size: 18px;
    font-family: "Poppins", Sans-serif;
    font-weight: 700;
    margin: 0;
      
}

.about-text{
    width: 100%;
    padding: 0 30px;
    justify-content: center;
}
.about-text h1{
    width: 100%;
    margin: 10px a;
}
.about-text p{
    width: 100%;
    font-size: 15px;
    margin: 0 auto;
}
.skills-text {
    width: 100%;
    padding-top: 30px !important;
    margin-left: 0;
  }
/*pograss_section start*/
.aboute_progress_section{
    text-align: center;
}
.aboute_progress{
    margin-top: 40px;
    height: 100%;

}
.skills-text{

    width: 100%;
    padding-top: 10px;  
    margin-left: 0;
  }
  .skills-text h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 600;
    font-weight: bold;
    margin: 0;
  
}
.skills-text h6{
color: #ffffff;
font-weight: 500;
padding: 0;
margin:  0;
}
.skills-text h5{
    color: #ffffff;
    font-weight: 700;
    font-weight: bold;
    margin: 10px 0;

}
  

/*pograss_section end*/

/*********************************************************************************/
/*aboute_experience_section end*/
.experience_text{
    text-align: center;
    margin-top: 10px;
    justify-content: center;
    width: 100%;

}
.experience_text h1{
   margin: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 40px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;

}
.experience_text h3{
  text-transform: capitalize;
  margin: 10px 0;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 22px;
  font-weight: 400;
  text-align: center;
 
}
.experience_section{
    width: 100%;
    margin-top: -40px;
    padding: 0;
}
.experience{
    width: 100%;
    margin-left: 0;
}
.experience-images-icon{
    margin: 0;
}

.experience-image {
    max-width: 100%;
    height: auto;
  }
  .experience-item-text {
    width: 100%;
    margin-left: 20px  ;
  }
  .experience-item-text p {
    
    margin: 20px ;
    margin-left: 0;
    font-size: 16px;
    
  }
  .experience-item-text h1{
    color:#ffffff;
    font-weight: 400;
    font-size: 26px;
    font-weight: bold;
    overflow: hidden;
    padding: 0;
    margin: 0;
   


}



/*aboute_experience_section end*/
/*********************************************************************************/
/*aboute_contact_section start*/
.protfolioll-Contact{
    margin: 0 auto;
    transform: translateY(20px) !important;
    text-align: center;
    justify-content: center;
    width: 100%;
}

.protfolioll-Contact h1{  
    text-align: center;
    margin-top: -30px;
    padding: 0;
    margin: 0 auto;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 35px;
    font-weight: 600;
    text-transform: uppercase;
    justify-content: center;
}
.protfolioll-Contact h2{
  text-transform: capitalize;
  margin: 10px auto;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 16px;
  font-weight: 300;
text-align: center;
justify-content: center;
width: 90%;
    
}

.about-contacts_section{
    width: 100%;
    margin-top: 20px !important;
    justify-content: center;
  }

.about-contacts_section{
    width: 100%;
    margin-top: 10px !important;
  }
  .about-contacts{
    width: 100%;
    background-color: #1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
    border-radius: 30px;
    height: 250px;
    overflow: hidden;
    box-sizing: border-box;
    text-align: center;
  }
  .icon-about svg{
    width: 50px;
    height: 50px; 
    fill:#F3B90B;
    margin-top:20px;
  }
  
  .about-contacts h1{
    color: #FFFFFF;
    text-transform: capitalize;
    font-weight: bold;
    margin-top: 10px;
    font-size: 20px;
    text-transform: capitalize;
  }
  .about-contacts h2{
    color: #FFFFFF;
    font-size: 20px;
    margin: 10px;
    text-transform: capitalize;
  }

/*aboute_contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*cource_ secion start*/

.education_section_text{
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 100px;
}
.education_section_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
}
.education_section_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 15px;
    font-weight: 400;
    text-align:center ;
}
.education_section_start{
    width: 100%;
    justify-content: center;
    margin-top: -10px !important;
}
.education_qualification_start{
  position: relative;
  width: 100%;
  background-color: #1C222A;
  font-weight: 500;
  box-sizing: border-box;
  padding: 40px 35px 40px 35px;
  border-radius: 30px;
  height: 330px;
  overflow: hidden;
  justify-content: center;
  margin: 32px 0;
}
.education_qualification_start p{
  width: 95%;
  display: flex;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.5em;
  font-family: "Poppins", Sans-serif;
  margin: 0;
  color: #FFFF;
}
.education_qualification_start img{
    width: 40px;
  font-weight: 400;
  margin: 10px 0;
  display: block;
  background-color: #f0b505;
  border-radius: 30px;
}
.education_section_start h1{
    color: #f0b505;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 500;
    margin: 10px 0;
    padding: 0;
}
.education_qualification_start h2{
    color: #ffffff;
    text-transform: capitalize;
    font-size: 14px !important;
    font-weight: 400;
  }
.cource_section_start{
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 0;
    margin-top: 40px;
}
.cource_Contact_text{
    text-align: center;
    margin: 0;
    padding: 0;
}
.cource_Contact_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    margin: 0 auto;
    padding: 0;
  
}
.cource_Contact_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 16px;
    font-weight: 400;
    text-align: center !important;
    width: 90%;
}
.cource_contacts_section{
    width: 100%;
    justify-content: center;
    text-align: center;
    margin-top: -30px;
    margin-bottom: 40px;
}
.cource_contacts{
    width:100% !important;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
   border-radius: 30px ;
   height: auto;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
   justify-content: center;
   margin: 32px auto;
}
.cource_contacts_icon{
    margin: 50px auto;
    margin-bottom: 80px;
    text-align: center;
}
.icon_cource{
text-align: center;
}
.icon_cource svg {
        width: 50px;
        height: 50px; 
        fill:#F3B90B;
        margin-left: 0px;
        top: 30px;
        margin: 0 auto !important;
        text-align: center;
    } 
     .cource_contacts h1{
     text-transform: capitalize;
    color: #FFFFFF;
     font-family: "Poppins", Sans-serif;
    font-size: 25px;
    font-weight: 500;
    margin: 10px auto;
    text-align: center;
    }
  .cource_contacts h2{
 color: #FFFFFF;
  font-size: 20px;
  margin: 0 ;
  text-transform: capitalize;
  font-weight: 300;
  line-height: 1em;
  text-align: center;
  }
/*cource_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*Education Qualification_section end*/
/*contact_section start*/
.contact_the_section{
    margin: 0 auto;
    transform: translateY(40px);
    text-align: center;
  }
  .contact-the-email{
    text-align: center;
    margin-top: 45px;


  }
  .contact-the-email-text{
    margin: 20px;
    margin-top: 70px ;
 
   }
  .btn-primary{
    width: 220px !important;
    height: 50px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    text-transform: capitalize;
 }
  .contact-the-email h1{
    text-transform: uppercase;
    color: #ffff;
    font-weight: 700;
    font-size: 36px;
    margin: 0;
    font-family: "Poppins", Sans-serif; 
 }
  .contact-the-.btn-primary{
    width: 220px !important;
    height: 50px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    font-size: 16px;
    text-transform: capitalize;
 } h4{
    color: #f0b505;
    text-transform: capitalize;
    font-weight: 500;
    font-weight: bold;
    margin: 10px 0;
    

  }
  .contact-the-email h4 {
    color: #f0b505;
    text-transform: capitalize;
    font-weight: 500;
    font-weight: bold;
    margin: 10px 0;
    font-size: 20px;
  }
.contact-section{
    margin: 0 auto;
    margin-top: -60px;

}
.contact_images_item{
    margin: auto;
    margin-top: 90px;
   }
   .contact_images{
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}
.contact_images img{
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}  
.contact_detels h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 700;
    font-weight: bold;
    margin: 10px 0;

  }
  .contact_detels h2{
    color:#fff;
    text-transform: capitalize;
    margin: 0;
    font-weight: 600;
    font-weight: bold;
    font-size: 25px;
  }
  .contact_detels p{
    color: #fff;
    width: 100%;
    font-size: 14px;
    margin: 10px 0;
  }
  .address-items svg{
    width: 30px;
    height: 30px;
    margin-top: 0;
     
   }
   
   .address-items-text h3 {
     color: #ffffff;
     margin-left: 15px;
     margin-top: 40px;
     text-transform: capitalize;
   
    
     
   }
   .address-items-text p {
     color: #ffffff;
     margin-left: 15px;
     text-transform: capitalize;
     
   }
  





/*contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
    /*footr sectiob star */


    .fotter_section {
        padding: 30px 0;
        font-family: Arial, sans-serif;
        background-color: #1C222A;
        margin-top: 30px;
        width: 100%;
        height: auto;
    }
    
    .pottersection {
        text-align: center;
        margin: 15px auto;
      
    }
    
    .pottersection lu {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: center;
        gap: 20px;
    }
    
    .fotter_item {
        display: inline-block;
        width: 50px;
        height: 50px;
        border: 1px solid #dad602;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #0a0a08; /* White background for icons */
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    
    .fotter_item svg {
        width: 24px;
        height: 24px;
        color: #F3B90B;
        transition: color 0.3s ease;
    }
    
    .fotter_item:hover {
        transform: scale(1.1);
        box-shadow: 0 3px 10px rgb(192, 206, 3);
        background-color: #967001; /* Hover background color */
    }
    
    .fotter_item:hover svg {
        color: #F3B90B; /* Icon color on hover */
    }
    
    .potterlink {
        text-align: center;
        margin: 15px auto;
        font-size: 10px;
        color: #F3B90F;
    }
    
    .potterlink a {
        text-decoration: none;
        color: #F3B90F;
        transition: color 0.3s ease;
        font-size: 10px;
    }
    
    .potterlink a:hover {
        color: #a89d00;
        text-decoration: underline;
    }
    /*footr sectiob start*/
/*********************************************************************************/
      
}


@media (max-width: 575px) {
    .banner {
        display: flex;
        flex-direction: column;
    }
    
    .imag {
        order: 1; 
        text-align: center;
        width: 100%;
        margin-top: 90px !important;


    }
    .imag img{
        text-align: center;
       margin: 0;
       padding: 0;
       
    }

    .text {
        order: 2; 
        text-align: center;
        margin-top: -100px;

    }


    .imag img {
        max-width: 50%; 
        margin: 0 auto;
        padding-bottom: 20px; 
    }

    .expart, .expartText {
        margin-top: 10px;
        text-align: center;
    }
    .banner {
        display: flex;
        flex-direction: column;
    }
    
    .imag {
        order: 1;
        text-align: center !important;
        width: 100%;
        margin: 10px 0;
    }

    .text {
        order: 2;
        text-align: center;
        margin-left: 0;
        width: 100%;
    }
   

    .imag img {
        max-width: 100%;
        margin: 0 auto;
        padding-bottom: 20px;
        text-align: center;
        margin-top: -100px;
    }

    .expart, .expartText {
        margin-top: 10px;
        text-align: center;
    }

    .nav-item a {
        color: #000000 !important;
        margin: 0px;
        text-align: left;

    }
    .navbar-nav .nav-item .nav-link:hover  {
        color: #000000 !important;
        background-color: #b9e948 !important; 
        margin: 5px ;
    }
    
      .navbar-nav .nav-item .nav-link.active {
        color: #000000 !important; 
        background-color: #b9e948 !important;   
        margin: 7px; 
       
       
      }

    .navbar-collapse {
        position: absolute;
        top: 0;
        left: 0;
        width: 70%;
        z-index: 1000;
        background-color: #f5b711;
        border-radius: 0 0 7px 7px;
    }
    
    .navbar-toggler {
        display: block;
        z-index: 1100;
    }
    
    .navbar-toggler-icon {
        color: #d1a6a6;
        border-radius: 20%;
    }
    
    .navbar.show {
        display: block;
    }
    
    .navbar-collapse.collapse.show {
        display: block;
    }
    .kamal-text {
        text-align: center;
        margin: 0;
        padding: 0;
        
    }
    .banner{
        width: 100%;
        margin-left: 0;
       
        
    }
    .banner p{
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        text-transform: capitalize;
        font-weight: 300;
        line-height: 1.6em;
        font-size: 14px;
        margin: 0;
        padding: 0;
    }
    .text{
        order: 2;
        text-align: left;
        margin-left: 0;
        width: 100%; 
        margin-top: -139px;

    }
    .count {
        font-size: 20px; /* Larger font size for emphasis */
        font-weight: bold;
        display: block;
        justify-content: center;
        align-items: stretch;
        flex-direction: column-reverse;
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-weight: 600;
    }
    .Years {
        color: #F5B711;
        font-family: "Poppins", Sans-serif;
        font-size: 14px;
        font-weight: 300;
        text-align: left !important;
        line-height: 1.1em;
    }
    .php{
        color: #f7f4eb;
        font-size: 18px; /* Make text more prominent */
        font-weight: bold;
        display: block;
        margin-top: 10px;
    }
    
    .laravel {
        font-size: 16px;
        line-height: 1.5em;
        color: #F5B711;

        
    }
    .banner h4{
      
        padding:  0;
        margin-left: 0px;
        text-align: left;
        padding-top: 0;
        font-size: 15px;
       
        
    }
    .banner h3 {
        color: #f5b711;
        font-family: "Poppins", Sans-serif;
        font-size: 16px;
        font-weight: 600;
      }
    .banner h1 {
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-size: 30px;
        font-weight: bold;
        margin: 0;
        bottom: 250px;
        width: 100%;


      }
    .expart{
        padding: 0;
        margin-left: 0;
        text-align: center;
        width: 100%;
        text-align:center ;
        margin-top: 10px;
        left:  0;
        order: 1;
         height: 70PX;
         border-radius: 20px 20px 20px 20px;
         line-height: 1.5em;
       
    }
    .phplaravel {
        margin-left: 0;
        width: 100%;
        text-align: center; 
        left: 0;
        order: 2;
        text-align: center;
        margin-top: 130px;
        padding: 0;
        height: 70PX;
        border-radius: 20px 20px 20px 20px;

      }
     
      
      
    /* whate section start*/
    .whate {
        text-align: center;
        margin-top: 90px;
        width: 100%;
        text-align: center;
        margin-left: 0;
      }

    .whate h1 {
        margin-top: -17px;
        text-align: center;
        font-size: 26px;
        margin:  auto;
        width: 90%;
    
        }
        .whate p {
           
            font-size: 18px;
            text-align: center;
             width: 90%;
             margin: auto;
          }
          .whate_section{
            margin-top: -20px;
            width: 100%;
            
        }
        .image_item{
            width: 90%;
            margin: 32px auto;
            height:  0 auto !important;
            border-radius: 15px ;

            
        } 
        
        .image_item img{
            width: 60px;
            font-weight: 600;
            border: 2px solid rgb(18, 139, 2);
            background-color:#000000 ;
            border-radius: 100%;
            box-shadow: 0px 4px 10px rgba(245, 242, 242, 0.5); 
            transition: transform 0.3s, box-shadow 0.3s; 
            margin: 10px 0;
            
            }
            .image_item img{
                width: 60px;
                font-weight: 600;
                border: 2px solid rgb(18, 139, 2);
                background-color:#000000 ;
                border-radius: 100%;
                box-shadow: 0px 4px 10px rgba(245, 242, 242, 0.5); 
                transition: transform 0.3s, box-shadow 0.3s; 
                margin: 10px 0;
                
                }
                .skill_text {
                    width: 90% !important;
                    overflow: hidden;
                }
              .skill_text p{
                    width: 90%;
                    padding: 0;
                    margin:0;
                    overflow: hidden;
                    color: #FFFFFF;
                    font-family: "Poppins", Sans-serif;
                    text-transform: capitalize;
                    font-weight: 300;
                    line-height: 1.5em;
                    font-size: 14px;
            }
            .skill_text h3 {
                text-transform: uppercase;
                font-weight: bold;
                font-size: 20px;
                color: #f0b505;
                width: 90%;
                margin: 0;
                padding: 10px 0;
            }
        
            .say_hello {
                color: #FFFFFF;
                text-decoration: none;
                font-size: 20px;
                text-transform: capitalize;
                font-weight: bold;
                display: inline-block;
                font-size: 20px;
                font-weight: bold;
                border: none;
                margin-top: 30px;
            }
    

  /* whate section end*/

  /*********************************************************************************/

  /* protfolioll_section start*/

  .protfolioll_section_text{
    text-align: center;
    margin-top: 40px;
    justify-items: center;
    width: 100%;
    }
    .protfolioll{
        width: 100%;
        margin: 0 auto;
    }
    .protfolioll h1{
        
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-size: 26px;
        font-weight: 600;
        text-transform: uppercase;
        margin: 0 auto;
    }
    .protfolioll h2{
        text-transform: capitalize;
        margin: 10px auto;
        color: #F3B90B;
        font-family: "Poppins", Sans-serif;
        font-size: 18px;
        font-weight: 400;
    }
    .profolio_section{
        margin-top: -20px !important;
      }

.profolio_item{
    width: 90%;
    left: 0;
    margin: 32px auto;
    height: 450px !important;
    border-radius: 15px;
    }

    .profolio_item img{
        width: 100% !important;
        left: 0;
        margin-left: 0;
        height: 220px !important;
    }
    .protfolio_text h3{
        width: 100%;
        margin: 0;
        text-align: left;
        font-size: 18px !important;
    }
    .protfolio_text p{
        margin: 0;
        width: 100%;
        margin: 10px 0;
        font-size: 16px;
    }
    .protfolio_say_hello{
        margin: 20px 0;
        padding: 10px 0;
        margin-left: 0;
        font-size: 20px;
     
    }
    .protfolio_sayhello{
        color: #f0b505;
        

    }

   /* protfolioll_section end*/

/*********************************************************************************/

/*testimonial_section start*/
.testimonial_text{
    text-align: center;
    margin-top: -70px;
    width: 100%;
    text-align: center;
    margin-left: 0;
}
.testimonial_text h1{
    text-align: center;
    font-size: 26px;
    width: 90%;
    margin: auto;

}
.testimonial_text h2{
    width: 90%;
    text-align: center;
    margin: 10px auto;
    padding: 0;
    font-size: 18px;
}
.testimonial_section{
    width: 100%;
    margin-top: -30px;
}
.testimonial{
    overflow: hidden;
    width: 90%;
    margin: 32px  auto;
    height: auto;
    border-radius: 15px;
}
.testimonial h1{
    padding: 0;
    margin-left: 0;
}
.testimonial h2{
    margin-left: 0;
    font-size: 18px !important;
    margin: 10px 0;
}

.testimonial p{
margin: 0 !important;
width: 100%;
font-size: 13px !important;
font-family: "Poppins", Sans-serif;
font-weight: 400;


}
/*testimonial_section end*/

/*********************************************************************************/

/*contact_section start*/
.contacts_text_section{
    margin-top: 20px;
    width: 100%;
}
.contacts_text{
    margin: 0 auto;
    text-align: center; 
    width: 100%;
}
.contacts_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
    padding: 0;
    margin-top: 50px;
    text-align: center;

}
.contacts_text h2{
    color: #f0b505;
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 18px;
    font-weight: 400;
    width: 90%;
}
.contacts_section{
    width: 100%;
    margin-top: -30px;
    text-align: center;
}
.contacts{
    width:90%;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
   border-radius: 15px !important;
   height: 250px;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
   margin: 32px auto;
  }
/*contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*about_section start*/
.about-image{
width: 100%;
margin: 0 auto;
text-align: center;

}

.about-image img{
    width: 60% !important;
    margin: 0 auto;
    font-weight: 600;
    text-align: center;
    margin-top: 50px;
    display: block;
    
}
.about-image h1{
    color: #D5D5D5;
    text-transform: uppercase;
    font-weight: bold;
    margin-top:-10px;
    text-transform: capitalize;
    font-weight: 900;
    text-align:center ;
    text-transform: uppercase;
    width: 100%;
    padding: 0;
    color: #D5D5D5;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;  
    margin: 0;
    
}
.about-image h2{
    color: #F5B711;
    text-align: center;
    font-size: 14px;
    font-family: "Poppins", Sans-serif;
    font-weight: 700;
    margin: 8px auto;
      
}

.about-text{
    width: 100%;
    padding: 0 30px ;
    justify-content: center;
    margin-top: 60px;
}
.about-text h1{
    width: 100%;
    margin: 10px 0;
    font-size: 26px;
    justify-content: center;
}
.about-text p{
    width: 100%;
    font-size: 14px;
    margin: 0 auto;
    justify-content: center;
}
/*pograss_section start*/
.aboute_progress_section{
    text-align: center;
}
.aboute_progress{
    margin-top: 40px;
    height: 100%;

}
.skills-text{

    width: 100%;
    padding-top: 10px;  
    margin-left: 0;
  }
  .skills-text h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 600;
    font-weight: bold;
    margin: 0;
    font-size: 20px ;
    margin: 15px 20px;
  
}
.custom-icon {
    width: 30px;
    height: 30px;
    fill: #f0b505;
    margin: 15px 10px;
  }
.skills-text h6{
color: #ffffff;
font-weight: 400;
padding: 0;
margin:  0;
margin-left: 60px;
font-size: 20px;
margin-top: -45px;
}
.skills-text h5{
    color: #ffffff;
    font-weight: 400;
    font-weight: bold;
    font-size: 14px;
    margin-top: 20px;
    margin-left: 60px;

}
.skills-text{
border-radius: 15px;
}
.count-text{
    border-radius: 15px;
}
.count-text h1 {
    color: #F3B90B;
    text-align: start;
    margin: 12px 14px;
    text-transform: uppercase;
    font-weight: 600;
    font-weight: bold;
    font-size: 26px;
  }
  .progress {
    margin: 10px;
    background-color: #111122;
    width: 95%;
    height: 25px;
    text-align: center;
  }
/*pograss_section end*/

/*********************************************************************************/
/*aboute_experience_section end*/
.experience_text{
    text-align: center;
    margin-top: 10px;
    justify-content: center;
    width: 100%;

}
.experience_text h1{
   margin: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;

}
.experience_text h3{
  text-transform: capitalize;
  margin: 10px 0;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 16px;
  font-weight: 400;
  text-align: center;
 
}
.experience_section{
    width: 100%;
    margin-top: -40px;
    padding: 0;
}
.experience{
    width: 100%;
    margin-left: 0;
    height: 310px;
    border-radius: 15px;
}
.experience-images-icon{
    margin: 0;
}

.experience-image {
    max-width: 100%;
    height: auto;
  }
  .experience-item-text {
    width: 100%;
    margin-left: 20px  ;
  }
  .experience-item-text p {
    width: 90%;
    margin: 10px ;
    margin-left: 0;
    font-size: 13px;
    
  }
  .experience-item-text h1{
    color:#ffffff;
    font-size: 18px;
    font-weight: 400;
    font-weight: bold;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

.experience-images-icon svg {
    width: 40px;
    height: 40px;
    color: #f0b505;
    text-align: center;
    margin-left: 33px;
  }

/*aboute_experience_section end*/
/*********************************************************************************/
/*aboute_cntact_section start*/
.protfolioll-Contact{
    margin: 0 auto;
    transform: translateY(20px) !important;
    text-align: center;
    justify-content: center;
    width: 100%;
}

.protfolioll-Contact h1{  
    text-align: center;
    margin-top: -30px;
    padding: 0;
    margin: 0 auto;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 30px;
    font-weight: 600;
    text-transform: uppercase;
    justify-content: center;
}
.protfolioll-Contact h2{
  text-transform: capitalize;
  margin: 10px auto;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 14px;
  font-weight: 300;
text-align: center;
justify-content: center;
width: 90%;
    
}

.about-contacts_section{
    width: 100%;
    margin-top: 20px !important;
    justify-content: center;
  }

.about-contacts_section{
    width: 100%;
    margin-top: 10px !important;
  }
  .about-contacts{
    width: 100%;
    background-color: #1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
    border-radius: 15px;
    height: 250px;
    overflow: hidden;
    box-sizing: border-box;
    text-align: center;
  }
  .icon-about svg{
    width: 50px;
    height: 50px; 
    fill:#F3B90B;
    margin-top:20px;
  }
  
  .about-contacts h1{
    color: #FFFFFF;
    text-transform: capitalize;
    font-weight: bold;
    margin-top: 10px;
    font-size: 20px;
    text-transform: capitalize;
    text-align: center;
  }
  .about-contacts h2{
    color: #FFFFFF;
    font-size: 15px;
    margin: 10px;
    text-transform: capitalize;
  }

/*aboute_contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*cource_ secion start*/

.education_section_text{
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 60px;
}
.education_section_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
}
.education_section_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 15px;
    font-weight: 400;
    text-align:center ;
}
.education_section_start{
    width: 100%;
    justify-content: center;
    margin-top: -10px !important;
}
.education_qualification_start{
  position: relative;
  width: 100%;
  background-color: #1C222A;
  font-weight: 500;
  box-sizing: border-box;
  padding: 40px 35px 40px 35px;
  border-radius: 15px;
  height: 330px;
  overflow: hidden;
  justify-content: center;
  margin: 32px 0;
}
.education_qualification_start p{
  width: 100%;
  display: flex;
  font-size: 12px;
  font-weight: 300;
  line-height: 1.5em;
  font-family: "Poppins", Sans-serif;
  margin: 0;
  color: #FFFF;
}
.education_qualification_start img{
    width: 30px;
  font-weight: 400;
  margin: 10px 0;
  display: block;
  background-color: #f0b505;
  border-radius: 30px;
}
.education_section_start h1{
    color: #f0b505;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 500;
    margin: 10px 0;
    padding: 0;
}
.education_qualification_start h2{
    color: #ffffff;
    text-transform: capitalize;
    font-size: 14px !important;
    font-weight: 400;
  }
.cource_section_start{
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 0;
    margin-top: 40px;
}
.cource_Contact_text{
    text-align: center;
    margin: 0;
    padding: 0;
}
.cource_Contact_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 22px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    margin: 0 auto;
    padding: 0;
  
}
.cource_Contact_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 12px;
    font-weight: 400;
    text-align: center !important;
    width: 90%;
}
.cource_contacts_section{
    width: 100%;
    justify-content: center;
    text-align: center;
    margin-top: -20px;
    margin-bottom: 40px;
}
.cource_contacts{
    width:100% !important;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
   border-radius: 15px ;
   height: auto;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
   justify-content: center;
   margin: 32px auto;
}
.cource_contacts_icon{
    margin: 50px auto;
    margin-bottom: 80px;
    text-align: center;
}
.icon_cource{
text-align: center;
}
.icon_cource svg {
        width: 30px;
        height: 30px; 
        fill:#F3B90B;
        margin-left: 0px;
        top: 30px;
        margin: 0 auto !important;
        text-align: center;
    } 
     .cource_contacts h1{
     text-transform: capitalize;
    color: #FFFFFF;
     font-family: "Poppins", Sans-serif;
    font-size: 25px;
    font-weight: 500;
    margin: 10px auto;
    text-align: center;
    }
  .cource_contacts h2{
 color: #FFFFFF;
  font-size: 20px;
  margin: 0 ;
  text-transform: capitalize;
  font-weight: 300;
  line-height: 1em;
  text-align: center;
  }
/*cource_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*Education Qualification_section end*/
/*contact_section start*/
.contact_the_section{
    margin: 0 auto;
    transform: translateY(40px);
    text-align: center;
  }
  .contact-the-email{
    text-align: center;
    margin-top: 40px;


  }
  .contact-the-email-text{
    margin: 20px;
    margin-top: 50px ;
    margin-bottom: 80px;
 
   }
  .btn-primary{
    width: 220px !important;
    height: 50px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    text-transform: capitalize;
 }
  .contact-the-email h1{
    text-transform: uppercase;
    color: #ffff;
    font-weight: 700;
    font-size: 36px;
    margin: 0;
    font-family: "Poppins", Sans-serif; 
 }
  .contact-the-.btn-primary{
    width: 220px !important;
    height: 50px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    font-size: 16px;
    text-transform: capitalize;
 } h4{
    color: #f0b505;
    text-transform: capitalize;
    font-weight: 500;
    font-weight: bold;
    margin: 10px 0;
    

  }
  .contact-the-email h4 {
    color: #f0b505;
    text-transform: capitalize;
    font-weight: 500;
    font-weight: bold;
    margin: 10px 0;
    font-size: 20px;
  }
.contact-section{
    margin: 0 auto;
    margin-top: -60px;

}
.contact_images_item{
    margin: auto;
    margin-top: 90px;
   }
   .contact_images{
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}
.contact_images img{
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}  
.contact_detels h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 700;
    font-weight: bold;
    margin: 10px 0;
    font-size: 26px;

  }
  .contact_detels h2{
    color:#fff;
    text-transform: capitalize;
    margin: 0;
    font-weight: 600;
    font-weight: bold;
    font-size: 14px;
  }
  .contact_detels p{
    color: #fff;
    width: 100%;
    font-size: 15px;
    margin: 10px 0;
  }
  .address-items svg{
    width: 30px;
    height: 30px;
    margin-top: 0;
     
   }
   
   .address-items-text h3 {
     color: #ffffff;
     margin-left: 15px;
     margin-top: 40px;
     text-transform: capitalize;
    font-size: 18px;
    font-weight: 300;
     
   }
   .address-items-text p {
     color: #ffffff;
     margin-left: 15px;
     text-transform: capitalize;
     
   }
  




/*contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
.fotter_section {
    padding: 30px 0;
    font-family: Arial, sans-serif;
    background-color: #1C222A;
    margin-top: 30px;
    width: 100%;
    margin: 0 auto;
    height: auto;
}

.pottersection {
    text-align: center;
    margin: 15px auto;
  
}

.pottersection lu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.fotter_item {
    display: inline-block;
    width: 30px;
    height: 30px;
    border: 1px solid #ccc900;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000000f1; /* White background for icons */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.fotter_item svg {
    width: 20px;
    height: 20px;
    color: #F3B90B;
    transition: color 0.3s ease;
    text-align: center;

}

.fotter_item:hover {
    transform: scale(1.1);
    box-shadow: 0 3px 10px rgb(192, 206, 3);
    background-color: #967001; /* Hover background color */
}

.fotter_item:hover svg {
    color: #F3B90B; /* Icon color on hover */
}

.potterlink {
    text-align: center;
    margin: 15px a;
    font-size: 15px;
    color: #F3B90F;
    width: 90%;
}

.potterlink a {
    text-decoration: none;
    color: #F3B90F;
    transition: color 0.3s ease;
}

.potterlink a:hover {
    color: #a89d00;
    text-decoration: underline;
}
      


}

/*********************************************************************************/











@media (max-width: 320px) {
    .banner {
        display: flex;
        flex-direction: column;
    }
    
    .imag {
        order: 1; 
        text-align: center;
        width: 100%;
     
       
    }
    .kamal-text{
        font-size: 20px !important;
    }
    .imag img{
        text-align: center;
       margin: 0;
       padding: 0;
       
    }

    .text {
        order: 2; 
        text-align: center;
        margin-top: -100px;

    }


    .imag img {
        max-width: 50%; 
        margin: 0 auto;
        padding-bottom: 20px; 
    }

    .expart, .expartText {
        margin-top: 10px;
        text-align: center;
    }
    .banner {
        display: flex;
        flex-direction: column;
    }
    
    .imag {
        order: 1;
        text-align: center !important;
        width: 100%;
        margin: 10px 0;
    }

    .text {
        order: 2;
        text-align: center;
        margin-left: 0;
        width: 100%;
    }
   

    .imag img {
        max-width: 100%;
        margin: 0 auto;
        padding-bottom: 20px;
        text-align: center;
        margin-top: -30px;
    }

    .expart, .expartText {
        margin-top: 10px;
        text-align: center;
    }

    .nav-item a {
        color: #000000 !important;
        margin: 0px;
        text-align: left;

    }
    .navbar-nav .nav-item .nav-link:hover  {
        color: #000000 !important;
        background-color: #b9e948 !important; 
        margin: 5px ;
    }
    
      .navbar-nav .nav-item .nav-link.active {
        color: #000000 !important; 
        background-color: #b9e948 !important;   
        margin: 7px; 
       
       
      }

    .navbar-collapse {
        position: absolute;
        top: 0;
        left: 0;
        width: 70%;
        z-index: 1000;
        background-color: #f5b711;
        border-radius: 0 0 7px 7px;
    }
    
    .navbar-toggler {
        display: block;
        z-index: 1100;
    }
    
    .navbar-toggler-icon {
        color: #d1a6a6;
        border-radius: 20%;
    }
    
    .navbar.show {
        display: block;
    }
    
    .navbar-collapse.collapse.show {
        display: block;
    }
    .kamal-text {
        text-align: center;
        margin: 0;
        padding: 0;
        
    }
    .banner p{
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        text-transform: capitalize;
        font-weight: 300;
        line-height: 1.6em;
        font-size: 12px;
        margin: 0;
        padding: 0;
    }
    .imag {
        order: 1; 
        text-align: center;
        width: 100%;
        margin-top: 20px !important;


    }
    .text{
        order: 2;
        text-align: left;
        margin-left: 0;
        width: 100%; 
        margin-top: -139px;

    }
    .count {
        font-size: 20px; /* Larger font size for emphasis */
        font-weight: bold;
        display: block;
        justify-content: center;
        align-items: stretch;
        flex-direction: column-reverse;
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-weight: 600;
    }
    .Years {
        color: #F5B711;
        font-family: "Poppins", Sans-serif;
        font-size: 14px;
        font-weight: 300;
        text-align: left !important;
        line-height: 1.1em;
    }
    .php{
        color: #f7f4eb;
        font-size: 18px; /* Make text more prominent */
        font-weight: bold;
        display: block;
        margin-top: 10px;
    }
    
    .laravel {
        font-size: 16px;
        line-height: 1.5em;
        color: #F5B711;

        
    }
    .banner h4{
      
        padding:  0;
        margin-left: 0px;
        text-align: left;
        padding-top: 0;
        font-size: 12px;
       
        
    }
    .banner h3 {
        color: #f5b711;
        font-family: "Poppins", Sans-serif;
        font-size: 14px;
        font-weight: 600;
      }
    .banner h1 {
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        bottom: 250px;
        width: 100%;


      }
    .expart{
        padding: 0;
        margin-left: 0;
        text-align: center;
        width: 100%;
        text-align:center ;
        margin-top: 10px;
        left:  0;
        order: 1;
         height: 70PX;
         border-radius: 20px 20px 20px 20px;
         line-height: 1.5em;
       
    }
    .phplaravel {
        margin-left: 0;
        width: 100%;
        text-align: center; 
        left: 0;
        order: 2;
        text-align: center;
        margin-top: 130px;
        padding: 0;
        height: 70PX;
        border-radius: 20px 20px 20px 20px;

      }
     
      .contact a {
        text-decoration: none;
        font-family: "Poppins", Sans-serif;
        font-size: 22px;
        font-weight: 600;
        text-transform: capitalize;
        background-color: #F3B90B;
        border-radius: 37px 37px 37px 37px;
        box-shadow: 0px 0px 5px 0px #F9C873;
        padding: 10px 25px 10px 25px !important;
        text-align: center !important;
        text-transform: capitalize;
        color: #0a0a0a;
        display: inline-block;
        animation: softBounce 3s ease-in-out infinite;
        transition: transform 0.3s ease-in-out;
        margin: 0 auto;
      }
      
      
    /* whate section start*/
    .whate {
        text-align: center;
        margin-top: 90px;
        width: 100%;
        text-align: center;
        margin-left: 0;
      }

    .whate h1 {
        margin-top: -17px;
        text-align: center;
        font-size: 20px;
        margin:  auto;
        width: 90%;
    
        }
        .whate p {
           
            font-size: 14px;
            text-align: center;
             width: 90%;
             margin: auto;
          }
          .whate_section{
            margin-top: -10px;
            width: 100%;
            
        }
        .image_item{
            width: 90%;
            margin: 32px auto;
            height:  0 auto !important;
            margin: 24px 0 !important;
            
        } 
        
        .image_item img{
            width: 40px !important;
            font-weight: 600;
            border: 2px solid rgb(18, 139, 2);
            background-color:#000000 ;
            border-radius: 100%;
            box-shadow: 0px 4px 10px rgba(245, 242, 242, 0.5); 
            transition: transform 0.3s, box-shadow 0.3s; 
            margin: 10px 0;
            
            }
            .image_item img{
                width: 60px;
                font-weight: 600;
                border: 2px solid rgb(18, 139, 2);
                background-color:#000000 ;
                border-radius: 100%;
                box-shadow: 0px 4px 10px rgba(245, 242, 242, 0.5); 
                transition: transform 0.3s, box-shadow 0.3s; 
                margin: 10px 0;
                
                }
                .skill_text {
                    width: 90% !important;
                    overflow: hidden;
                }
              .skill_text p{
                    width: 90%;
                    padding: 0;
                    margin:0;
                    overflow: hidden;
                    color: #FFFFFF;
                    font-family: "Poppins", Sans-serif;
                    text-transform: capitalize;
                    font-weight: 300;
                    line-height: 1.5em;
                    font-size: 13px;
            }
            .skill_text h3 {
                text-transform: uppercase;
                font-weight: bold;
                font-size: 16px;
                color: #f0b505;
                width: 90%;
                margin: 0;
                padding: 10px 0;
            }
        
            .say_hello {
                color: #FFFFFF;
                text-decoration: none;
                font-size: 20px;
                text-transform: capitalize;
                font-weight: bold;
                display: inline-block;
                font-size: 20px;
                font-weight: bold;
                border: none;
                margin-top: 30px;
            }
    

  /* whate section end*/

  /*********************************************************************************/

  /* protfolioll_section start*/

  .protfolioll_section_text{
    text-align: center;
    margin-top: 40px;
    justify-items: center;
    width: 100%;
    }
    .protfolioll{
        width: 100%;
        margin: 0 auto;
    }
    .protfolioll h1{
        
        color: #FFFFFF;
        font-family: "Poppins", Sans-serif;
        font-size: 20px;
        font-weight: 600;
        text-transform: uppercase;
        margin: 0 auto;
    }
    .protfolioll h2{
        text-transform: capitalize;
        margin: 10px auto;
        color: #F3B90B;
        font-family: "Poppins", Sans-serif;
        font-size: 14px;
        font-weight: 400;
    }
    .profolio_section{
        margin-top: -20px !important;
        text-align: center;
      }

.profolio_item{
    width: 90%;
    left: 0;
    margin: 32px auto;
    height: 350px !important;
    }
    .profolio_item img{
        width: 100% !important;
        left: 0;
        margin-left: 0;
        height: 150px !important;
    }
    .protfolio_text h3{
        width: 100%;
        margin: 0;
        text-align: left;
        font-size: 14px !important;
    }
    .protfolio_text p{
        margin: 0;
        width: 100%;
        margin: 10px 0;
        font-size: 14px;
    }
    .protfolio_say_hello{
        margin: 20px 0;
        padding: 10px 0;
        margin-left: 0;
        font-size: 17px;
     
    }
    .protfolio_sayhello{
        color: #f0b505;
        

    }

   /* protfolioll_section end*/

/*********************************************************************************/

/*testimonial_section start*/
.testimonial_text{
    text-align: center;
    margin-top: -90px !important;
    width: 100%;
    text-align: center;
    margin-left: 0;
}
.testimonial_text h1{
    text-align: center;
    font-size: 20px;
    width: 90%;
    margin: auto;

}
.testimonial_text h2{
    width: 90%;
    text-align: center;
    margin: 10px auto;
    padding: 0;
    font-size: 12px;
}
.testimonial_section{
    width: 100%;
    margin-top: px;
}
.testimonial{
    overflow: hidden;
    width: 90%;
    margin: 30px  auto;
    height: auto;
}
.testimonial h1{
    padding: 0;
    margin-left: 0;
}
.testimonial h2{
    margin-left: 0;
    font-size: 14px !important;
    margin: 10px 0;
}

.testimonial p{
margin: 0 !important;
width: 100%;
font-size: 12px !important;
font-family: "Poppins", Sans-serif;
font-weight: 400;


}
/*testimonial_section end*/

/*********************************************************************************/
/*********************************************************************************/

/*contact_section start*/
.contacts_text_section{
    margin-top: -30px;
    width: 100%;
}
.contacts_text{
    margin: 0 auto;
    text-align: center; 
    width: 100%;
}
.contacts_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
    padding: 0;
    margin-top: 50px;
    text-align: center;

}
.contacts_text h2{
    color: #f0b505;
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 12px;
    font-weight: 400;
    width: 90%;
}
.contacts_section{
    width: 100%;
    margin-top: -30px;
    text-align: center;
}
.contacts{
    width:100% !important;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
   border-radius: 30px ;
   height: auto;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
  }
  .contact_item{
    margin: 50px auto;
    margin-bottom: 80px;
  }
  .contacts:hover{
    transform: scale(1);
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.7)
  }
   
  .contacts h1{
    text-transform: capitalize;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 25px;
    font-weight: 500;
    margin: 10px auto;
      }
      .contacts h2{
        color: #FFFFFF;
        font-size: 14px;
        margin: 0 auto;
        text-transform: capitalize;
        font-weight: 300;
         line-height: 1em;
            width: 90%;
    
      }
      .icon {
        text-align: center;
      }
      
      .icon svg {
        width: 50px;
        height: 50px; 
        fill:#F3B90B;
        margin-left: 0px;
        top: 30px;
        margin: 0 auto !important;
    }
/*contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*about_section start*/
.about-image{
width: 100%;
margin: 0 auto;
text-align: center;

}

.about-image img{
    width: 70%;
    margin: 0 auto;
    font-weight: 600;
    text-align: center;
    margin-top: 40px;
    
}
.about-image h1{
    color: #D5D5D5;
    text-transform: uppercase;
    font-weight: bold;
    margin-top:-10px;
    text-transform: capitalize;
    font-weight: 700;
    text-align:center ;
    text-transform: uppercase;
    width: 100%;
    padding: 0;
    color: #D5D5D5;
    font-family: "Poppins", Sans-serif;
    font-size: 22px;  
    
}
.about-image h2{
    color: #F5B711;
    text-align: center;
    font-size: 10px;
    font-family: "Poppins", Sans-serif;
    font-weight: 700;
    margin: 0;
      
}

.about-text{
    width: 100%;
   margin-top: 100px;
}
.about-text h1{
    width: 100%;
    margin-left: 0;
    font-size: 20px;
    margin-top: -50px;
}
.about-text p{
    width: 100%;
    margin-left: 0;
    font-size: 10px;
}
/*pograss_section start*/
.aboute_progress_section{
    text-align: center;
}
.aboute_progress{
    margin-top: 40px;
    height: 100%;

}
.skills-text{

    width: 100%;
    padding-top: 10px;  
    margin-left: 0;
  }
  .skills-text h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 600;
    font-weight: bold;
    margin: 0;
    font-size: 18px ;
    margin: 10px 10px;  
}
.custom-icon {
    width: 30px;
    height: 30px;
    fill: #f0b505;
    margin: 10px 10px;
  }
.skills-text h6{
color: #ffffff;
font-weight: 400;
padding: 0;
margin:  0;
margin-left: 60px;
font-size: 16px;
margin-top: -35px;
}
.skills-text h5{
    color: #ffffff;
    font-weight: 400;
    font-weight: bold;
    font-size: 12px;
    margin-top: 20px;
    margin-left: 60px;

}
.count-text h1 {
    color: #F3B90B;
    text-align: start;
    margin: 12px 14px;
    text-transform: uppercase;
    font-weight: 600;
    font-weight: bold;
    font-size: 26px;
  }
  .progress {
    margin: 10px;
    background-color: #111122;
    width: 95%;
    height: 20px;
    text-align: center;
  }
  .progress-bar h5 {
    color: #000000;
    text-transform: capitalize;
    margin: 10px;
    font-size: 12px;
    font-weight: 400;
  }
/*pograss_section end*/

/*********************************************************************************/
/*aboute_experience_section end*/
.experience_text{
    text-align: center;
    margin-top: -22px;
    justify-content: center;
    width: 100%;

}
.experience_text h1{
   margin: 0;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 20px !important;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;

}
.experience_text h3{
  text-transform: capitalize;
  margin: 7px 0;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 12px;
  font-weight: 400;
  text-align: center;
 
}
.experience_section{
    width: 100%;
    margin-top: -40px;
    padding: 0;
}
.experience{
    width: 100%;
    margin-left: 0;
    height: 310px;
}
.experience-images-icon{
    margin: 0;
}

.experience-image {
    max-width: 100%;
    height: auto;
  }
  .experience-item-text {
    width: 100%;
    margin-left: 20px  ;
  }
  .experience-item-text p {
    width: 90%;
    margin: 10px ;
    margin-left: 0;
    font-size: 12px;
    
  }
  .experience-item-text h1{
    width: 90%;
    color:#ffffff;
    font-size: 16px;
    font-weight: 400;
    font-weight: bold;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

.experience-images-icon svg {
    width: 30px;
    height: 30px;
    color: #f0b505;
    text-align: center;
    margin-left: 33px;
  }


/*aboute_experience_section end*/
/*********************************************************************************/
/*aboute_contact_section start*/
.protfolioll-Contact{
    margin: 0 auto;
    transform: translateY(10px) !important;
    text-align: center;
    justify-content: center;
    width: 100%;
}

.protfolioll-Contact h1{  
    text-align: center;
    margin-top: -30px;
    padding: 0;
    margin: 0 auto;
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 26px;
    font-weight: 600;
    text-transform: uppercase;
    justify-content: center;
}
.protfolioll-Contact h2{
  text-transform: capitalize;
  margin: 10px auto;
  color: #F3B90B;
  font-family: "Poppins", Sans-serif;
  font-size: 14px;
  font-weight: 300;
text-align: center;
justify-content: center;
width: 90%;
    
}

.about-contacts_section{
    width: 100%;
    margin-top: -10px !important;
    justify-content: center;
  }


  .about-contacts{
    width: 100%;
    background-color: #1C222A;
    font-weight: 500;
    box-sizing: border-box;
    margin-left: 0;
    border-radius: 15px;
    height: 250px;
    overflow: hidden;
    box-sizing: border-box;
    text-align: center;
  }
  .icon-about svg{
    width: 50px;
    height: 50px; 
    fill:#F3B90B;
    margin-top:20px;
  }
  
  .about-contacts h1{
    color: #FFFFFF;
    text-transform: capitalize;
    font-weight: bold;
    margin-top: 10px;
    font-size: 20px;
    text-transform: capitalize;
    text-align: center;
  }
  .about-contacts h2{
    color: #FFFFFF;
    font-size: 15px;
    margin: 10px;
    text-transform: capitalize;
  }


/*aboute_contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
/*cource_ secion start*/

.education_section_text{
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 60px;
}
.education_section_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 auto;
}
.education_section_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 10px;
    font-weight: 400;
    text-align:center ;
}
.education_section_start{
    width: 100%;
    justify-content: center;
    margin-top: -10px !important;
}
.education_qualification_start{
  position: relative;
  width: 100%;
  background-color: #1C222A;
  font-weight: 500;
  box-sizing: border-box;
  padding: 40px 35px 40px 35px;
  border-radius: 30px;
  height: 330px;
  overflow: hidden;
  justify-content: center;
  margin: 32px 0;
}
.education_qualification_start p{
  width: 100%;
  display: flex;
  font-size: 10px;
  font-weight: 300;
  line-height: 1.5em;
  font-family: "Poppins", Sans-serif;
  margin: 0;
  color: #FFFF;
}
.education_qualification_start img{
    width: 30px;
  font-weight: 400;
  margin: 10px 0;
  display: block;
  background-color: #f0b505;
  border-radius: 30px;
}
.education_section_start h1{
    color: #f0b505;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 500;
    margin: 10px 0;
    padding: 0;
}
.education_qualification_start h2{
    color: #ffffff;
    text-transform: capitalize;
    font-size: 12px !important;
    font-weight: 400;
  }
.cource_section_start{
    width: 100%;
    justify-content: center;
    text-align: center;
    padding: 0;
    margin-top: 40px;
}
.cource_Contact_text{
    text-align: center;
    margin: 0;
    padding: 0;
}
.cource_Contact_text h1{
    color: #FFFFFF;
    font-family: "Poppins", Sans-serif;
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    margin: 0 auto;
    padding: 0;
  
}
.cource_Contact_text h2{
    text-transform: capitalize;
    margin: 10px auto;
    color: #F3B90B;
    font-family: "Poppins", Sans-serif;
    font-size: 10px;
    font-weight: 400;
    text-align: center !important;
    width: 90%;
}
.cource_contacts_section{
    width: 100%;
    justify-content: center;
    text-align: center;
    margin-top: -20px;
    margin-bottom: 40px;
}
.cource_contacts{
    width:100% !important;
    background-color:#1C222A;
    font-weight: 500;
    box-sizing: border-box;
   border-radius: 30px ;
   height: auto;
   overflow: hidden;
   box-sizing:border-box;
   text-align: center;
   justify-content: center;
   margin: 32px auto;
}
.cource_contacts_icon{
    margin: 50px auto;
    margin-bottom: 80px;
    text-align: center;
}
.icon_cource{
text-align: center;
}
.icon_cource svg {
        width: 30px;
        height: 30px; 
        fill:#F3B90B;
        margin-left: 0px;
        top: 30px;
        margin: 0 auto !important;
        text-align: center;
    } 
     .cource_contacts h1{
     text-transform: capitalize;
    color: #FFFFFF;
     font-family: "Poppins", Sans-serif;
    font-size: 18px;
    font-weight: 500;
    margin: 10px auto;
    text-align: center;
    }
  .cource_contacts h2{
 color: #FFFFFF;
  font-size: 14px;
  margin: 0 ;
  text-transform: capitalize;
  font-weight: 300;
  line-height: 1em;
  text-align: center;
  }
/*cource_section end*/
/*********************************************************************************/
/*********************************************************************************/

/*********************************************************************************/
/*********************************************************************************/
/*Education Qualification_section end*/
/*contact_section start*/
.contact_the_section{
    margin: 0 auto;
    transform: translateY(40px);
    text-align: center;
  }
  .contact-the-email{
    text-align: center;
    margin-top: 20px;


  }
  .contact-the-email-text{
    margin: 20px;
    margin-top: 10px ;
    margin-bottom: 80px;
 
   }
   .contact-the-email-text label {
    margin-left: 0;
    color: #fff;
    text-transform: capitalize;
    font-size: 10px;
    font-weight: 300;
  }
  .contact-the-email-text input {
    width: 100%;
    padding: 10px;
    margin: 5px;
     margin-left: 10px;
    margin-left: 0;
    border-radius: 16px;
    background-color: #1C2229;
    height: 6px;
    font-size: 10px;
  }
  .btn-primary{
    width: 120px !important;
    height: 30px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    text-transform: capitalize;
    text-align: center;
    margin: auto !important;
    justify-content: center !important;
    font-size: 10px;
 }
  .contact-the-email h1{
    text-transform: uppercase;
    color: #ffff;
    font-weight: 300;
    font-size: 18px;
    margin: 0;
    font-family: "Poppins", Sans-serif; 
    text-align: center;
 }
  .contact-the-.btn-primary{
    width: 220px !important;
    height: 50px;
    text-align: center;
    border-radius: 30px;
    background-color: #070707;
    margin: 10px;
    font-size: 16px;
    text-transform: capitalize;
 } h4{
    color: #f0b505;
    text-transform: capitalize;
    font-weight: 500;
    font-weight: bold;
    margin: 10px 0;
    

  }
  .contact-the-email h4 {
    color: #f0b505;
    text-transform: capitalize;
    font-weight: 500;
    font-weight: bold;
    margin: 10px 0;
    font-size: 12px;
  }
.contact-section{
    margin: 0 auto;
    margin-top: -60px;

}
.contact_images_item{
    margin: auto;
    margin-top: 90px;
   }
   .contact_images{
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}
.contact_images img{
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
}  
.contact_detels h1{
    color: #f0b505;
    text-transform: uppercase;
    font-weight: 700;
    font-weight: bold;
    margin: 10px 0;
    font-size: 14px;

  }
  .contact_detels h2{
    color:#fff;
    text-transform: capitalize;
    margin: 0;
    font-weight: 600;
    font-weight: bold;
    font-size: 10px;
  }
  .contact_detels p{
    color: #fff;
    width: 100%;
    font-size: 10px;
    margin: 10px 0;
  }
  .address-items svg{
    width: 20px !important;
    height: 20px !important;
    margin-top: 0;
     
   }
   
   .address-items-text h3 {
     color: #ffffff;
     margin-left: 15px;
     margin-top: 30px;
     text-transform: capitalize;
    font-size: 12px;
    font-weight: 300;
     
   }
   .address-items-text p {
     color: #ffffff;
     margin-left: 15px;
     text-transform: capitalize;
     font-size: 10px;
     
   }
  

   .address-items {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 50px;
    color: #f0b505;
    margin-top: 4px;
  }
  .form-control {
    height: 200px;
    border-radius: 20px;
    background-color: #1C2229;
    width: 100%;
    height: 20px;
    margin: 10px;
    margin-left: 10px;
    margin-left: 0;
    margin-bottom: 0;
    margin: 0;
  }

/*contact_section end*/
/*********************************************************************************/
/*********************************************************************************/
.fotter_section {
    padding: 30px 0;
    font-family: Arial, sans-serif;
    background-color: #1C222A;
    margin-top: 30px;
    width: 100%;
    margin: 0 auto;
    height: auto;
}

.pottersection {
    text-align: center;
    margin: 15px auto;
  
}

.pottersection lu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.fotter_item {
    display: inline-block;
    width: 30px;
    height: 30px;
    border: 1px solid #ccc900;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000000f1; /* White background for icons */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.fotter_item svg {
    width: 20px;
    height: 20px;
    color: #F3B90B;
    transition: color 0.3s ease;
}

.fotter_item:hover {
    transform: scale(1.1);
    box-shadow: 0 3px 10px rgb(192, 206, 3);
    background-color: #967001; /* Hover background color */
}

.fotter_item:hover svg {
    color: #F3B90B; /* Icon color on hover */
}

.potterlink {
    text-align: center;
    margin: 15px a;
    font-size: 10px;
    color: #F3B90F;
    width: 90%;
}

.potterlink a {
    text-decoration: none;
    color: #F3B90F;
    transition: color 0.3s ease;
    font-size: 10px;
}

.potterlink a:hover {
    color: #a89d00;
    text-decoration: underline;
}
      


}

/*********************************************************************************/






/* বডি এবং এইচটিএমএল অংশ */
html, body {
    margin: 0;
    padding: 0;
    height: 100%; /* পুরো স্ক্রিন কভার করবে */
    display: flex;
    flex-direction: column; /* কলাম লেআউট */
}

/* ফুটার ডিজাইন */
.ftr {
    font-family: Arial, sans-serif;
    background-color: #1C222A;
    color: white;
    text-align: center;
    width: 100%; /* পুরো স্ক্রিন কভার করবে */
    margin-top: 30px auto; /* কন্টেন্টের নিচে ফুটার রাখতে সাহায্য করবে */

}