:root{
    --primary_color : #302F95;
    --secondary_color : #018DD4;
    --secondary_light_color : #ECF8FD;
    --container_color : #FAF8F8;
}
html {
    scroll-behavior: smooth;
  }
*{
    font-family: "Poppins", serif;
}
.text_primary{color: var(--primary_color);}
.m_3{margin-top: -20px;}
body{background-color: white;}
.header_bg{background: linear-gradient(90deg, rgba(193,234,255,1) 0%, rgba(255,255,255,1) 35%, rgba(255,255,255,1) 100%); border-bottom-left-radius: 6%;}
.footer_bg{background: linear-gradient(90deg, rgba(193,234,255,1) 0%, rgba(255,255,255,1) 53%, rgba(193,234,255,1) 100%); }
.border_r{border-top-right-radius: 10%;}
.hr_{background-color: var(--secondary_color); width: 10%; height: 5px; opacity: 1; border-radius: 5px;}
.bg_secondar_light{background-color: var(--secondary_light_color);}
.sect_pl_pr{padding-left: 9rem;padding-right: 9rem;}
.hide{display: none;}
.mbl_show{display: none;}
.min_h_14{min-height: 14rem;}
header{
    /* border-bottom: 1px solid black; */
    width: 100%;
    height: 4.5rem;
    /* background-color: white; */
}
.logo{width: 5rem; height: 100%; object-fit: cover;}
.nav_text{color: black;}
.nav_text:hover{color: var(--primary_color);}
.top_section{display: flex; height: 35rem; }

.top_left{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.top_right{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}.top_right_mbl{
    display: none;
}

.top_right img {
    width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform 0.3s ease-in-out;
  }
  .top_right img:hover {
    transform: scale(0.9);  /* Zoom effect */
  }
  .bland_mode{
    mix-blend-mode: multiply;
  }
.head_text{
    font-weight: 500;
}
.mbl_m_3_top{margin-top: 8rem;}

.text5{
    overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 5; /* number of lines to show */
           line-clamp: 5; 
   -webkit-box-orient: vertical;
}
/* .address_box{width: 100%; height: 3rem; background-color: #018DD4;} */
.round_box{width: 32px; height: 32px; border-radius: 25px; background-color: var(--secondary_color);}
.tex_b{width: 100%; height: 100%; display: flex; justify-content: start; align-items: center;}
.bg_black_{background-color: black; opacity: 0.5;}
.hearer_top{width: 100%; height: 100%; display: flex; justify-content: space-between;  align-items: center;}
.search_row{background-color: white; border: 1px solid rgb(254, 217, 217); width: 100%; height: 100%;padding: 4px; border-radius: 10px;}
.input_grp{width: 100%;height: 100%;border: none;outline: none;padding: 10px; background-color: white;}.row_left{height: 100%; display: flex; align-items: center; justify-content: space-between;}


.btn_contact{border: none; outline: none; align-items: center; border-radius: 5px; color: white; cursor: pointer; padding: 10px;  background-color: var(--primary_color); transition: 0.3s;}
.btn_contact:hover{background-color: var(--secondary_color);}
.bg_container{

    background-color: var(--container_color);
}
.fex_x{display: grid; grid-template-columns: auto auto auto auto; justify-content: center;}

.fex_x::-webkit-scrollbar{width: 0px;}
.fex_x::-webkit-scrollbar-thumb{width: 0px;}
.fex_xitem{ width: auto; min-width: 7rem; cursor: pointer;}

.flex_item{height: auto; width: 18rem; min-width: 18rem; min-height: 18rem; margin: 0.8rem; padding: 10px; border-radius: 10px; cursor: pointer; display: flex; justify-content: center; align-items: center; transition: 0.3s;}
.flex_item:hover{background-color: var(--primary_color); color: white;}

.product_details_box{display: flex; justify-content: space-evenly;}
.p_detail_img_box{width: 100%; height: auto;}
.p_detail_img_box img{width: auto; height: 100%; object-fit: cover;}
.decription{text-align: justify;}
.w_75{width: 75%;}
.w_25{width: 25%;}
.ad_box{
    background-image: url('file:///S:/laravel/vechel_web/website_temp/assets/images/bg-themes/sidebar.jpg');
    background-size: cover; /* Ensures the image covers the entire element */
    background-position: center; /* Centers the image */
    background-repeat: no-repeat; 
    width: 100%;
    height: auto;
}
.mobile_side_bob{
    width: 15rem;
    height: 100vh;
    background-color: var(--primary_color);
    position: absolute;
    z-index: 999;
    transition: all  0.2s;
    float: right;
    display: none;
    padding: 15px;
    border-top-right-radius: 15px;
}
.mobile_side_bob li{
    list-style: none;
    margin-top: 10px;
    width: 100%;
    background-color: var(--primary_color);
    padding: 7px;
    border-radius: 0px  5px;
    margin-bottom: 10px;
    
}
.mobile_side_bob li:hover{  
    background-color: var(--primary_color);
    border: 1px solid var(--secondary_light_color);
    transition: all 0.5s;
    transform: scale(0.9);
    border-radius: 5px  0px;
    }
.mobile_side_bob li a{
    text-decoration: none;
    color: white;
}
.mobile_side_icon{
    display: none;
}

@media (max-width: 1400px) {.sect_pl_pr{padding-left: 4rem;padding-right: 4rem;} .product_box{grid-template-columns: auto  auto auto auto; }}

@media (max-width: 1300px) { .fex_x{grid-template-columns: auto auto auto; }}
@media (max-width: 1100px) {
    .w_75{width: 100%;}
    /*.btn_contact{width: 100%;}*/
    .hide-11{display: none;}
    .bg_container{height: auto;}
    .product_box{grid-template-columns: auto  auto auto; }
    .product_item{width: 100%; min-height: 13rem; overflow: hidden;}
    .product_image_box{width: 100%; min-height: 13rem;display: flex; justify-content: center; align-items: center;}
    .images_p{width: 100%; height: 100%; object-fit: cover;}
    .product_details_box{display: block;}
   
    /* .motorcycle_add{display: block;} */
}
@media (max-width: 950px) { .fex_x{grid-template-columns: auto auto; }}
@media (max-width: 680px) {
    .top_right_mbl{
        height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    }
    .top_right_mbl img {
        width: 100%;
        height: auto;
        object-fit: cover;
        transition: transform 0.3s ease-in-out;
      }
      .top_right_mbl img:hover {
        transform: scale(0.9);  /* Zoom effect */
      }
    .mbl_m_3_top{margin-top: 3rem;}
    .mbl_m_2_top{margin-top: 2rem;}
    .mbl_hide{display: none;}
    .mbl_show{display: block;}
    .top_section{display: block; height: auto; padding-top: 3rem; padding-bottom: 3rem;}
    .top_left{height: auto; width: 100%; }
    .top_left .di{text-align: center;}
    .w_25{width: 100%;}
    .top_right{height: auto;}
    .sect_pl_pr{padding-left: 1rem;padding-right: 1rem;}
    .fex_x{grid-template-columns: auto ; }
    .flex_item{width: 100%; min-width: 100%;}
    .product_item{width: 100%; min-height: 13rem; overflow: hidden;}

    
    
}