/* mobile phone */

@media (max-width: 480px) {
  body {
 /* overflow: hidden; */
  }
  .navbar-brand img {
    height: 35px;
}

/* banner-section */


.carousel-caption h1 {
    font-size: 25px;
    font-weight: 500;
    margin-bottom: 10px !important;
    width: 100% !important;
}
.carousel-caption p {
    font-size: 15px;
    font-weight: 300;
   
}

/* //// */

/* about-section */

.about-section-cntnt {
    padding: 48px 24px;
}
.animation-circles-1 {
    width: 60px;
    height: 100%;
}
@keyframes example {
  0%   {background:linear-gradient(to left, rgb(127, 19, 216), rgb(2, 47, 105)); right:0%; top:00px;}
  25%  {background:linear-gradient(to left, rgba(127, 19, 216, 0.479), rgba(2, 47, 105, 0.24)); right:32%; top:0px;}

  75%  {background:linear-gradient(to left, rgb(127, 19, 216), rgb(2, 47, 105)); right:80%; top:0px;}
  /* 75%  {background-color:black; right:70%; top:0px;} */

  100% {background:linear-gradient(to left, rgb(127, 19, 216), rgb(2, 47, 105)); right:80%; top:0px;}
}

.about-section-cntnt .abt-heading-bx h2 {
    font-size: 30px;
    padding: 32px 21px ;
   
    height: 170px;
   
}
.clipped-section {
  
    height: 50px;
  
}

/* /// */


/* product-section */


.button-group {
  
    padding: 12px;
  
}
.button-group button {
    padding: 10px 10px;
  font-size: 16px;
    font-weight: 400;
  
}
#product-section {
    padding: 60px 30px;
}
.image-hover-box {
   
    margin-top: 40px;

    width: 100%;
   
}
.image-hover-box img {
  
    object-fit:unset;
  
}
.hover-text {
    padding: 15px;
}
.hover-text h5{
    font-size: 20px;
}
.prdct-spctn-bx ul li {
  
    font-size: 16px;
}
.prodct-name h5{
  width: 70%;
   margin-top: 5px;
  

}
.clipped-section-2 {
   
    height: 50px;

}

/* ////// */

/* description-section */


.description-section {
   
    height:600px;
    padding: 0px 30px;
  
}

.description-section-cntnt h1 {
    font-size: 35px;
    font-weight: 600;
   
}
.description-section-cntnt p {
    font-size: 16px;
    font-weight: 400;
    
}
.common-btn {
    position: relative;
    padding: 10px 10px;
    width: 100%;
    font-size: 15px;
    /* max-width: 15em; */
    /* border-radius: 5em; */
    letter-spacing: 1px;
}

.sctin-hdng-bx h1 {
   
    font-size: 30px;
    font-weight: 600;
  
}

/* /// */

/* ttrending-section */


.trending-section {
    padding: 60px 30px;
    
}
.treding-prdct-bx {
    margin-top: 30px;
}
.treding-prdct-bx-cntnt h5 {
    font-size: 18px;
   text-align: center;
}
.treding-prdct-bx-cntnt p {
    text-align: center;
}

/* //// */

/* //footer */

footer {
    display: none;
}


.footer-2 {
    padding: 60px 30px !important;
    display: block;
}
.footer-logo img {
    /* width: 100%; */
    height: 50px;
  
}
.footer-2 h5{
  font-size: 18px; 
  
}
.footer-2 ul li a {
  font-size: 16px; 

}


.footer-2 {
      padding: 60px 30px  !important;
}
.footer-2-logo img {
    /* width: 100%; */
    height: 50px;
  
}
.footer-2 h5{
  font-size: 18px; 
  
}
.footer-2 ul li{
  font-size: 16px; 

}
.footer-2 ul li a {
  font-size: 16px; 
  text-decoration: none;

}
.footr-scl-media-icns a {
text-decoration: none;

}
.footr-scl-media-icns a i{
  width: 30px;
  height: 30px;
/* padding: 10px; */
background-color:unset;
border-radius: 5px;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
}
.footr-scl-media-icns a i:hover{
background-color:#fff;
}


}

/* tablet */

@media (min-width: 481px) and (max-width: 768px) {
  body {
    /* overflow: hidden; */
  }
    .navbar-brand img {
    height: 65px;
}
.carousel-caption h1 {
    font-size: 43px;
    font-weight: 500;
    margin-bottom: 10px !important;
    width: 100% !important;
}
.carousel-caption p {
    font-size: 22px;
    font-weight: 300;
   
}

/* //// */

/* about-section */

.about-section-cntnt {
    padding: 48px 24px;
}
.animation-circles-1 {
    width: 60px;
    height: 100%;
}
@keyframes example {
  0%   {background:linear-gradient(to left, rgb(127, 19, 216), rgb(2, 47, 105)); right:0%; top:00px;}
  25%  {background:linear-gradient(to left, rgba(127, 19, 216, 0.479), rgba(2, 47, 105, 0.24)); right:32%; top:0px;}

  75%  {background:linear-gradient(to left, rgb(127, 19, 216), rgb(2, 47, 105)); right:80%; top:0px;}
  /* 75%  {background-color:black; right:70%; top:0px;} */

  100% {background:linear-gradient(to left, rgb(127, 19, 216), rgb(2, 47, 105)); right:80%; top:0px;}
}

.about-section-cntnt .abt-heading-bx h2 {
    font-size: 20px;
    padding: 10px 21px ;
   
    height: 60px;
   
}
.clipped-section {
  
    height: 50px;
  
}

/* /// */


/* product-section */


.button-group {
  
    padding: 12px;
  
}
.button-group button {
    padding: 10px 10px;
  font-size: 16px;
    font-weight: 400;
  
}
#product-section {
    padding: 60px 30px;
}
.image-hover-box {
   
    margin-top: 40px;

    width: 100%;
   
}
.image-hover-box img {
  
    object-fit:unset;
  
}
.hover-text {
    padding: 15px;
}
.hover-text h5{
    font-size: 20px;
}
.prdct-spctn-bx ul li {
  
    font-size: 16px;
}
.prodct-name h5{
  width: 70%;
   margin-top: 5px;
  

}
.clipped-section-2 {
   
    height: 50px;

}

/* ////// */

/* description-section */


.description-section {
   
    height:600px;
    padding: 0px 30px;
  
}

.description-section-cntnt h1 {
    font-size: 46px;
    font-weight: 600;
   
}
.description-section-cntnt p {
    font-size: 20px;
    font-weight: 400;
    
}
.common-btn {
    position: relative;
    padding: 10px 10px;
    width: 100%;
    font-size: 15px;
    /* max-width: 15em; */
    /* border-radius: 5em; */
    letter-spacing: 1px;
}

.sctin-hdng-bx h1 {
   
    font-size: 30px;
    font-weight: 600;
  
}

/* /// */

/* ttrending-section */


.trending-section {
    padding: 60px 30px;
    
}
.treding-prdct-bx {
    margin-top: 30px;
}
.treding-prdct-bx-cntnt h5 {
    font-size: 18px;
   text-align: center;
}
.treding-prdct-bx-cntnt p {
    text-align: center;
}

/* //// */

/* //footer */

footer {
    /* display: none; */
      padding: 60px 30px  !important;

}
.footer-logo img{
/* width: 100%; */
height: 80px;

}



}

/* small laptops */

@media (min-width: 769px) and (max-width: 1024px) {
  body {
    /* overflow: hidden; */
  }
}

/* large screen */

@media (min-width: 1025px) {
  body {
   /* overflow: hidden; */
  }
}