*{

    padding: 0px;

    margin: 0px;

    box-sizing: border-box;

    text-decoration: none;

    list-style: none;

}
.hover{
  transition: all ease .2s;
}
.hover:hover{
  background-color: var(--color-two) !important;
  

}

.transition2{

  transition: all ease .2s;

}

.transition3{

  transition: all ease .2s;

}

.transition5{

  transition: all ease .2s;

}

:root {

  --color-one: #0596cc;

--button-color:#4b5d61;

  --color-two: #004059;

  --gray:rgb(173, 173, 173);

}

.Active {

  color:var(--color-one) !important;

}

.large-container{

  max-width: 1640px;

  margin: auto;

}

.container{

  max-width: 1340px !important;

  margin: auto;

}

body{

  overflow-x: hidden;

}

ul,

li,

a,

span,

h1,

h2,

h3,

h4,

h5,

h6,

p {

  padding: 0px;

  margin: 0px;

  list-style: none;

  text-decoration: none;

}

.sub-heading {

  color:var(--color-one);

  font-size: 14px;

  font-weight: 600;

  text-transform: uppercase;

}

.main-heading {

  font-size: 55px;

  /* line-height: 75px !important; */

  font-weight: 700;

  color: var(--button-color);

  margin-bottom: 30px;

}
.main-heading span{
  display: block;
  color: #878d73;
}

.section-heading {

  font-size: 35px;

  color: black;

  font-weight: 700;

  margin-bottom: 60px;

  margin-bottom: 60px;

}

.theme-button1 {

  color: white !important;

  background-color: var(--button-color);

  padding: 5px 25px;

  border-radius: 5px;

  margin-top: 20px;

  text-transform: uppercase;

  font-weight: 500;

  transition: all ease 0.2s;

  display: block;

  width: max-content;

}



.theme-button1:hover

{

  background-color: var(--color-two) !important;

}





.section-padding {

  padding: 80px 0px;

}

.section-padding-top {

  padding-top: 80px;

}

.section-padding-bottom {

  padding-bottom: 80px;

}

.font-12 {

  font-size: 12px;

}

.font-14 {

  font-size: 14px;

}

.font-16 {

  font-size: 16px;

}

.font-18 {

  font-size: 18px;

}

.font-20 {

  font-size: 20px;

}

.font-22 {

  font-size: 22px;

}

.font-24 {

  font-size: 24px;

}

.font-26 {

  font-size: 26px;

}

.font-28 {

  font-size: 28px;

}

.font-30 {

  font-size: 30px;

}

.font-32 {

  font-size: 32px;

}

/*  */

.small-container{

  max-width: 1000px;

  margin: auto;

}



/* width */



::-webkit-scrollbar {

  width: 6px;

}





/* Track */



::-webkit-scrollbar-track {

  background: #000;

}





/* Handle */



::-webkit-scrollbar-thumb {

  background-color: var(--color-one);

  border-radius: 40px;

}







/* Handle on hover */



::-webkit-scrollbar-thumb:hover {

  background: #555;

}



/*  */



#header {

  display: flex;

  background-color: white;

  z-index: 3;

  /* transition: all ease .3s; */

  box-shadow: rgba(28, 28, 29, 0.363) 0px 7px 29px 0px !important;

}



header.fixed {

  position: fixed !important;

  width: 100%;

  top: -60px;

  left: 0;

  height: 64px;

  animation: goDown 0.7s ease-in-out forwards;

  

}







@keyframes goDown {

  0%{

    top:-60px;

  }

  100% {

    transform: translateY(60px);

  }

}



body.lock{

  overflow: hidden;

}



#header .logo img{

  width: 40px;

}





#header .nav-bar .nav-links {

  color: black;

  display: inline-block;

  padding: 20px 15px;

  font-weight: 600;

  transition: all ease 0.2s;

  position: relative;

}

#header .nav-bar .sub-nav-links {

  color: black;

  display: inline-block;

  padding: 20px 15px;

  font-weight: 600;

  transition: all ease 0.2s;

  position: relative;

}





#header .nav-bar .nav-links i {

  font-size: 16px;

}



#header .theme-button {

  padding: 7px 40px;

  background-color: var(--button-color);

  color: white;

  border-radius: 5px;

  display: inline-block;

  transition: all ease .2s;

}

#header .nav-items {

  position: relative;

}



#header .nav-items .nav-bar-nav {

  position: absolute;

  background-color: white;

  height: 0px;

  overflow: hidden;

width: max-content;

  top: 64px;

  transition: all ease 0.2s;

}

#header .nav-items .nav-bar-nav .sub-nav-links {

  font-weight: 500;

  padding: 10px 18px;

  transition: all ease 0.2s;

  z-index: 2;

  

}











#header .nav-bar .nav-bar-nav li a::before {

    content: "";

    display: inline-block;

    position: absolute;

    top: 0;

    left: inherit;

    right: 0;

    background-color: var(--color-one);

    width: 0px;

    height: 100%;

    z-index: -1;

    transition: all ease .3s;

  }

  #header .nav-bar .nav-bar-nav li .sub-nav-links::before {

    content: "";

    display: inline-block;

    position: absolute;

    top: 0;

    left: inherit;

    right: 0;

    background-color: var(--color-one);

    width: 0px;

    height: 100%;

    z-index: -1;

    transition: all ease .3s;

  }

 

  #header .nav-bar .nav-bar-nav li a:hover::before{

      width: 100%;

      right: inherit;

      left: 0;

  }

  #header .nav-bar .nav-bar-nav li .sub-nav-links:hover::before{

    width: 100%;

    right: inherit;

    left: 0;

}

  #header .nav-bar .nav-bar-nav li a:hover{

    color: rgb(255, 255, 255);

  }

  #header .nav-bar .nav-links:hover{

    color: var(--color-one);



  }



/*  */

@media(min-width:992px){

#header .nav-items:hover .nav-bar-nav {

  height: max-content;

  z-index: 3;

}

}





#header .toggle-button {

  outline: none;

  border: none;

  background-color: transparent;

  color: black;

}



.modal-header{

  background-color: var(--color-one) !important;

  color: white !important;

}



.modal .btn-close{

  background: none !important;

  display: flex;

  align-items: center;

  opacity: 1 !important;

  justify-content: center;

  color: white;

}

.modal .btn-close::after{

content: "\F62A";

font-family: bootstrap-icons;

font-size: 22px;

}



.form-control:focus {

  box-shadow: none !important;

}

/* .section-title{

  position: relative;

  width: max-content;

}



.section-title::after{

  content: "";

    display: inline-block;

    width: 42px;

    height: 3px;

    background-color: var(--color-one);

    right: -53px;

    top: 20px;

  

    position: absolute;

} */

/* ================== header end ============= */







#page-slide{

position: relative;

   min-height: 40vh;

   color: white;

   text-align: center;

   background: url(../images/page-slide.webp);

   background-size: cover;

   background-position: center;

}
#page-slide.course{
       background: url(../images/courses.jpg);
         background-size: cover;

   background-position: center;
       
}
#page-slide.training{
       background: url(../images/training.jpg);
         background-size: cover;

   background-position: center;
}
#page-slide.about{
       background: url(../images/aboutus.jpg);
         background-size: cover;

   background-position: center;
}
#page-slide.blog{
       background: url(../images/blogs.jpg);
         background-size: cover;

   background-position: center;
}
#page-slide.contact{
       background: url(../images/contactus.jpg);
         background-size: cover;

   background-position: center;
}

#page-slide .overlay{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 25px;
position: absolute;

top: 0;

left: 0;

padding: 50px;

width: 100%;

height: 100%;

background-color: rgba(0, 0, 0, 0.25);

}

#page-slide .overlay h2{
display:none;
font-size: 40px;

}
@media(max-width:768px){
    #page-slide .overlay h2{
display:block;



}
}
.modal .btn-close:focus {

  box-shadow: none !important;
 }


/* ==============single */


/*formmmmmm*/


.floating-label-group {
	position: relative;
  display: flex;
/*gap: 10px;*/
align-items: center;
border: 1px solid rgb(209, 209, 209);
padding: 4px 7px;
border-radius: 5px;
margin-bottom: 12px;
}
.floating-label-group  i{
color: #7a7a7a;
}
.floating-label-group input{
border: none;
font-size: 14px;

}

form .number-box {
  display: flex;
  align-items: stretch;
  margin-bottom: 12px;
}
form .number-box .text{
  padding: 4px 6px;
  border: 1px solid rgb(209, 209, 209);
  border-radius: 5px;
  margin-right: 7px;
}

	.floating-label {
line-height: 0;
		font-size: 13px;
		color: #363636;
		position: absolute;
		pointer-events: none;
		top: 20px;
		left: 35px;
		transition: all 0.1s ease;
	}
	.floating-label span{
font-weight: 600;
		color: #ff0000;

	}
  .floating-label.select {
    top: -1px !important;
    background-color: white;
    z-index: 5;
  }

	input:focus ~ .floating-label,
	input:not(:focus):valid ~ .floating-label {
		top: -8px;
		bottom: 0px;
		left: 22px;
		font-size: 11px;
		opacity: 1;
    padding: 6px;
    background: #ffffff;
    height: max-content;
    font-weight: 600;
    color: #bdbdbd;

	}
	
  .form-toggle {
    position: relative;
    box-sizing: border-box;
  }
  .form-toggle input[type="checkbox"] {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0;
  }
  .form-toggle label {
    position: relative;
    display: flex;
    align-items: center;
    box-sizing: border-box;
  }
   .form-toggle label:before {
    content: 'No';
    width: 53px;
    display: flex;
    height: 20px;
    background: #ccc;
    position: relative;
    display: flex;
    border-radius: 46px;
    box-sizing: border-box;
    transition: 0.2s ease-in;
    justify-content: end;
    padding-right: 10px;
    font-size: 12px;
    font-weight: 600;
    align-items: center;
  }
  .form-toggle label:after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50%;
   left: -3px;
    top: 0px;
    box-shadow: 1px 1px 5px #858585;
    z-index: 2;
    background: #fff;
    box-sizing: border-box;
    transition: 0.2s ease-in;
  }
   .form-toggle input[type="checkbox"]:checked + label:before {
    background: #4BD865;
    justify-content: start;
    padding-left: 10px;
    color: white;
    content: "Yes";
  }
  .form-toggle input[type="checkbox"]:checked + label:after {
    left: 35px;
  }
  /**/
  
  .onload .modal-body {
      position:relative;
      
  }
  .onload .modal-body .overlay {
      position:absolute;
      top:0;
      left:0;
      width:100%;
      height:100%;
      background:rgba(0, 0 , 0 , 20%);
      
  }