*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


.img-logo{
  /* background-color: plum; */
  width: 150px;
  height: 40px;
}

.img-logo{
  width: 100%;
  height: 100%;
}


.nav-pills .nav-link {
  color: black !important;
}

.nav-pills .nav-link.active {
  color: white !important; 
}

.image-1{
  width: 210px;
  height: 460px;
  /* background-color: brown; */

}

.image-1 img{
  width: 100%;
  height: 100%;
}

.reg-btn{
  width: 130px;
  height: 50px;
}

.icon-div{
  width: 700px;
  height: 50px;
  /* background-color: purple; */
}

.icon-div img{
  width: 100%;
  height: 100%;
}

.img-4{
  width: 350px;
  height: 30px;
  /* background-color: yellowgreen; */
}

.img-4 img{
  width: 100%;
  height: 100%;
}


.back-color{
  background-color: #58615a;
}














































































/* Extra small devices (phones, less than 576px) */
@media (max-width: 575.98px) {
    body {
      /* background-color: lightblue; */
    }

    .image-1{
      width: 400px;
      height: 300px;
      /* background-color: brown; */
    
    }
    
    .image-1 img{
      width: 100%;
      height: 100%;
    }

    .icon-div{
      width: 350px;
      height: 50px;
      /* background-color: purple; */
    }
    
    .icon-div img{
      width: 100%;
      height: 100%;
    }
    .icon-1{
      width: 60px;
      height: 50px;
      /* background-color: yellowgreen; */
    }
  
    .icon-1{
      height: 100%;
      width: 100%;
    }
    
  }

  .image-2{
    width: 350px;
      height: 200px;
  }

  .image-2 img{
    width: 100%;
    height: 100%;
  }

  .image-3{
    width: 500px;
      height: 400px;
  }

  .image-3 img{
    width: 100%;
    height: 100%;
  }


  









  
  /* Small devices (tablets, 576px and up) */
  @media (min-width: 576px) and (max-width: 767.98px) {
    body {
      /* background-color: lightgreen; */
    }

    .image-1{
      width: 400px;
      height: 300px;
      /* background-color: brown; */
    
    }
    
    .image-1 img{
      width: 100%;
      height: 100%;
    }

    .icon-div{
      width: 350px;
      height: 50px;
      /* background-color: purple; */
    }
    
    .icon-div img{
      width: 100%;
      height: 100%;
    }
    .icon-1{
      width: 60px;
      height: 50px;
      /* background-color: yellowgreen; */
    }
  
    .icon-1{
      height: 100%;
      width: 100%;
    }
    
    .image-3{
      width: 500px;
        height: 400px;
    }
  
    .image-3 img{
      width: 100%;
      height: 100%;
    }
    
    
  }










  
  /* Medium devices (desktops, 768px and up) */
  @media (min-width: 768px) and (max-width: 991.98px) {
    body {
      /* background-color: lightcoral; */
    }
  }












  
  /* Large devices (large desktops, 992px and up) */
  @media (min-width: 992px) and (max-width: 1199.98px) {
    body {
      /* background-color: lightgoldenrodyellow; */
    }
  }














  
  /* Extra large devices (1200px and up) */
  @media (min-width: 1200px) {
    body {
      /* background-color: lightgray; */
    }
  }