*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html
{
  scroll-behavior: smooth;
}

body
{
  font-size: 16px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-weight: 400;
  line-height: 1.5;
  color: var(--main_color);
  background-color: var(--color_shade2);
}

/*----------- LINK STYLES -----------*/

a
{
  color: var( --highlight_color);
  text-decoration: none;
}

/*----------- PARAGRAPH STYLES -----------*/

p
{
  color: var(--color_shade10);
}

/*----------- TOP BAR STYLES -----------*/

.top_bar
{
  padding: 10px 50px;
  display: flex;
}

.logo_container
{
  width: 50px;
  overflow: hidden;
}

.logo_container img
{
  width: 100%;
}

.search_container
{
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 401;

}



.contact_container
{
  display: flex;
  align-items: center;
}

.contact_container a
{
  color: var(--main_color) !important;
}

.nav_icons_container .search_icon
{
  display: none ;
}

.search_btn ion-icon
{
  font-size: 23px;
}

.search_container .search_btn
{
  padding: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 402;
}

#search_form
{
  position: relative;
}

#search
{
  z-index: 402;
}

.search_dropdown
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 40px 0 20px 0;
  border: 1px solid var(--color_shade4);
  background-color: var(--color_shade1);
  display: none;

}

.search_dropdown_link
{
  display: flex;
  padding: 7px 20px;
  border-bottom: 1px solid var(--color_shade4);
  align-items: center;
}

.search_dropdown_img
{
  flex-basis: 60px;
  flex-shrink: 0;
  height: 60px;
  overflow: hidden;
}

.search_dropdown_img img
{
 width: 100%;
 height: 100%;
 object-fit: cover;
}

.dropdown_search_text
{
  padding: 10px 15px 10px 10px ;
  flex: 1;
}

.dropdown_search_text p
{
  overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
    padding: 0;
}

.search_dropdown_inner
{
  max-height: 400px;
  overflow: auto;
}


.dropdown_search_date
{
  padding: 10px;
}

.dropdown_search_date span{
  display: block;
  color: var(--color_shade8);
  font-size: 14px;
  white-space: nowrap;
}

.dropdown_search_date span:last-child
{
  color: var(--color_shade5);
}



/*----------- NAV BAR STYLES -----------*/

.nav_bar
{
  padding: 0 50px;
  background-color: var(  --main_color);
  display: flex;
  position: sticky;
  top: 0;
  z-index: 300;
}
.phone_icon
{
  color: var(--highlight_color);
}

.category_menu_container
{
  background-color: var(--highlight_color);
  flex-basis: 300px;
  display: flex;
  align-items: center;
  padding: 8px 20px;
  cursor: pointer;
  position: relative;
  
  
 
  
  
}
.category_content
{
  flex: 1;
  display: flex;
  align-items: center;
}

.category_content span
{
  margin-right: 5px;
}
.category_menu_container span
{
  color: var( --main_color_shade);
}

.nav_icons
{
  display: flex;
  align-items: center;

}

.nav_icons_container
{
  flex: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 8px 0px 8px 20px;
  
}

.nav_icons span
{
  color:var(--color_shade1) ;
}

.nav_icons a:not(:last-child)
{
  margin-right: 20px;
}

.nav_icons_container a
{
  display: flex;
  position: relative;
}

.reg_btn
{
  margin-right: 10px !important;
}

.nav_icons_container a .close_btn
{
  margin-left: 20px;
}

.item_container
{
  /*border: 2px solid var(--color_shade1);*/
  background-color: var(--highlight_color);
  color: var( --main_color_shade);
  width: 22px;
  height: 22px;
  border-radius: 50%;
  /* display: flex; */
  display: none;
  justify-content: center;
 align-items: center;
  overflow: hidden;
  /*margin-left: 5px;*/
  position: absolute;
  top: -12px;
  left: 18px;
}


.category_list_container
{
  position: absolute;
  left: 0;
  top: 64px;
  width: 100%;
  background-color: var(--main_color);
  display: none;
  z-index: 300;
  max-width:90rem;
  
 
}

.category_card
{
  display: flex;
  flex: 1;
}

.category_content
{
  flex: 1;
}

.category_list
{
  list-style-type: none;
  position: relative;
}
.category_list a
{
  padding: 10px 20px;
  display: block;
  color: var(  --main_color_shade);
}

.category_list a:hover, .category_list a:focus
{
  color: var(--highlight_color);
  font-weight: bold;
}
.category_list:not(:last-child)
{
  border-bottom: 1px solid var(--color_shade4);
}

#courses_menu
{
  font-size: 20px;
}

.category_submenu
{
  position: absolute;
  top: 0;
  left: 300px;
  width: 300px;
 background-color: var(--main_color);
 z-index: 201;
 display: none;
 max-height:20vh;
 overflow:auto;
}

.category_submenu_list
{
  list-style: none;

}

.category_submenu_list:hover, .category_submenu_list:focus
{
  background-color: var(--color_shade9);

  
}

a>span>.close_btn
{
    display:none;
}





/*----------- OTHER SECTIONS STYLES -----------*/
.main_desc,.service_desc,.categories_container,.product_container,.product_container
{
  padding: 20px 50px;
}
/*
.main_desc,.service_desc,.categories_container,.product_container,.Advert_container,.product_container,.nav_bar,.top_bar,.footer_container
{
  border: 1px solid var(  --color_shade7);
}
*/

/* PRODUCT SLIDER SECTION */
.main_desc
{
  display: flex;
}

.slider_container
{
  flex: 2;
  height: 0;
  position: relative;
  padding-bottom: 33.3%;
  overflow: hidden;
}
.slider_container img
{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.slider_inner_container
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
 
}

.advert_inner_container
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.advert_container
{
 /* flex-basis: 400px;*/
  flex: 1;
  margin-left: 20px;
  height: 0;
  position: relative;
  padding-bottom: 32.3%;
  
}
.advert_content
{
  width: 100%;
  overflow: hidden;
  height: 100%;
  position: relative;
  
}
.advert_content img
{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.advert_content:not(:last-child)
{
  margin-bottom: 20px;
}
.overlay_container
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--main_color);
  opacity: .3;

}

.content_container
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 20px;
}


.product_title
{
  color: var(  --main_color_shade);
  font-size: 40px;
  margin-bottom: 20px;
  text-align: center;
}

.product_desc
{
      color: var(  --main_color_shade);
      margin-bottom: 20px;
      text-align: center;
      font-family: Arial;
      max-width: 400px;

      overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}


.advert_content .product_title
{
  font-size: 20px;
  margin-bottom: 10px;
}

.advert_content .close_btn
{
  padding: 8px 16px;
  border: 1px solid var(--main_color_shade);
  background: none;
}

.advert_content .close_btn:hover
{
  background-color: var( --highlight_color);
}


/*----------- SERVICE DESCRIPTION SECTIONS STYLE -----------*/
.service_desc
{
  /*display: flex;*/
  display: grid;
  grid-gap: 20px;
  grid-template-columns: repeat(auto-fill, minmax(20em, 1fr));
}
.service_container
{
  flex: 1;
  background-color: var( --main_color);
  border: 1px solid var(--color_shade3);
  padding: 20px;
  display: flex;
  color: var(--main_color_shade);
  align-items: center;

}
/*
.service_container:not(:last-child)
{
 margin-right: 20px;
  
}
*/
.service_icon span
{
  color: var(--highlight_color);
  font-size: 45px;

}

.service_text
{
  font-size: 20px;
  font-weight: bold;
  padding-left: 20px;
  display: flex;
  align-items: center;
  white-space: nowrap;
}


/*----------- CATEGORY SECTION STYLES -----------*/
.category_title_container
{
  display: flex;
  margin-bottom: 20px;
}


.line_container
{
  display: flex;
  align-items: center;
  flex: 1;
  padding: 5px 0 0 20px;
}
.line_container .line
{
  width: 100%;
  border: none;
  border-bottom: 1px dashed var(--color_shade5);

}

.category_heading
{
  text-transform: uppercase;
}

.category_content_container
{
  display: grid;
  grid-gap: 1em;
  grid-template-columns: repeat(auto-fill, minmax(20em, 1fr));
}



.category_box
{
  display: flex;
  background-color: var(  --highlight_color);
  border: 1px solid var(--color_shade4);
}

.category_box:hover
{
background-color: var(---color_shade1);
}

.category_box:hover .category_desc_heading, .category_box:hover small
{
color: var(  --main_color);
}
.category_img
{
  width: 100px;
  height: 100px;
  overflow: hidden;
}

.category_img img
{
  width: 100%;
  height:100%;
  object-fit: cover;
}

.category_desc
{
  padding: 20px;
  display: flex;
 justify-content: center;
  flex-direction: column;
}

.category_desc_heading
{
  color: var( --main_color_shade);
  user-select: none;
}

.category_desc small
{
  color: var( --main_color_shade);
  user-select: none;
}

/*----------- POPULAR COURSES STYLES -----------*/

.product_box
{
  background-color: var(--main_color_shade);
  box-shadow: 0 0 5px 1px var(--color_shade4);
}

.product_box:hover .product_img
{
  transform: scale(1.05,1.05);
  transition: .3s ease-in;
}
.product_content
{
  display: grid;
  grid-gap: 1em;
  grid-template-columns: repeat(auto-fill, minmax(16em, 1fr));
}

.product_img_container
{
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  position: relative;
}

.product_img
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.product_img img
{
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: .3s ease-in;
  
}

.product_details
{
  padding: 10px;
}

.product_name
{
  text-align: center;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.product_price
{
  text-align: center;
}

.product_call_to_action
{
  display: flex;
  padding: 10px;
}
.view_details_container, .add_to_cart_container
{
  flex: 1;
}

.view_details_container
{
  margin-right: 5px;
}

.add_to_cart_container
{
  display: flex;
  justify-content: flex-end;
  margin-left: 5px;
}

.view_details_btn
{
  padding: 2px 8px;
  background: none;
 border: 1px solid var(--highlight_color);
 border-radius: 3px;
 /* border: none;*/
  display: flex;
  align-items: center;
  cursor: pointer;
  white-space: nowrap;
}

.add_to_cart_btn
{
  padding: 2px 8px;
  background: none;
 border: 1px solid var(--highlight_color);
 background-color: var(--highlight_color);
 color: var( --main_color_shade);
 border-radius: 3px;
 /* border: none;*/
  display: flex;
  align-items: center;
  cursor: pointer;
  white-space: nowrap;
}

.add_to_cart_btn span
{
 
  color: var(--main_color_shade);
  margin-right: 6px;
}

.view_details_btn span
{
 
  color: var(--highlight_color);
  margin-right: 6px;
}

.add_to_cart_btn:hover
{
  opacity: .8;
}

.view_details_btn:hover, .view_details_btn:hover span
{
  background-color: var(--highlight_color);
  color: var(--main_color);
}

.view_details_btn:focus, .add_to_cart_btn:focus
{
  border: 1px solid var(--highlight_color_dim);
  border-radius: 3px;
}

.advert_section
{
  display: flex;
  padding: 20px 50px;
}

.advert_box_container
{
  flex: 1;
  height: 0;
  position: relative;
  padding-bottom: 25%;
  overflow: hidden;
}

.advert_box_container:not(last-child)
{
  margin-right: 20px;
}
.advert_img_box
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.advert_img_box img
{
 
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: .5s ease-in;
}

.advert_overlay_container
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var( --main_color);
  opacity: .5;
  z-index: 20;
}

.advert_box
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 21;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.advert_box h1
{
  color: var(--main_color_shade);
  font-size: 35px;
  margin-bottom: 20px;
}

.advert_box h3
{
  color: var(--main_color_shade);
  
}

.advert_box_container:hover .advert_img_box
{
  transform: scale(1.2,1.2);
  transition: .5s ease-in;
}


/*----------- TESTIMONIAL  STYLES -----------*/
/* Slideshow container */
.slideshow-container {
  position: relative;
  background: var(--highlight_color);
}

/* Slides */
.mySlides {
  display: none;
  padding: 80px;
  text-align: center;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -30px;
  padding: 16px;
  color: var(--foreground_color1);
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  position: absolute;
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: var(--foreground_color1);
  color: var(--main_color_shade);
}

/* The dot/bullet/indicator container */
.dot-container {
  text-align: center;
  padding: 20px;
  background: #ddd;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

/* Add a background color to the active dot/circle */
.active, .dot:hover {
  background-color: #717171;
}

/* Add an italic font style to all quotes */
q 
{
  font-style: italic;
  font-weight: bold;
  font-size: 20px;
}

/* Add a blue color to the author */
.author 
{
  color: var(--foreground_color1);
  font-size: 30px;
  padding-top: 10px;
}

#testimonial_text
{
  font-size: 45px;
  text-align: center;
  padding: 30px 0;
}

/*----------- FOOTER STYLES -----------*/
.footer_container
{
  padding: 50px 50px 30px 50px;
  background-color: var(--main_color);
}

.footer1
{
  display: grid;
  grid-gap: 2em;
  grid-template-columns: repeat(auto-fill, minmax(20em, 1fr));
  padding-bottom: 50px;

}

.footer_column h3
{
  color: var(--main_color_shade);
  text-transform: uppercase;
  margin-bottom: 20px;

}

.footer_column p
{
  color: var(--main_color_shade);

}

.footer_column .logo_container
{
 margin-bottom: 20px;

}
.get_in_touch p
{
  display: flex;
  align-items: center;
  
}

.get_in_touch a
{
  color: var(--main_color_shade);
  
}


.get_in_touch p span:first-child
{
  margin-right: 10px;
}

.get_in_touch p:not(:last-child)
{
  margin-bottom: 10px;
}

.quick_links a
{
  display: flex;
  width: 100%;
  align-items: center;
  color: var(--main_color_shade);
}

.quick_links a:hover span:last-child
{
 opacity: .8;
 text-decoration: underline;
}

.quick_links a:not(:last-child)
{
  margin-bottom: 10px;
}

#subscribe
{
  display: flex;
  margin: 20px 0;
}

.social_links_container
{
  display: flex;
}

.social_links_container a
{
  width: 35px;
  height: 35px;
  background-color: var(--highlight_color2);
  border: 2px solid var(--highlight_color2);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var( --foreground_color1);
}

.social_links_container a:hover
{
  background-color: var(--highlight_color);
  border: 2px solid var(--highlight_color_dim);
}

.social_links_container a:focus
{
  border: 2px solid var(--highlight_color);
}

.social_links_container a:not(:last-child)
{
 margin-right: 8px;
}

.social_links_container i
{
  color: var( --foreground_color1);
  border: none;
  font-size: 18px;
}

.social_container h3
{
  margin-bottom: 10px;
}

.footer2
{
  display: flex;
  border-top: 1px solid var(--color_shade6);
  padding-top: 20px;
}

.copyright_container
{
  flex: 1;
}

.copyright_container span
{
  color: var(--main_color_shade);
}

.payment_method_container
{
  display: flex;

}

.payment_img_container
{
  width: 80px;
  height: 40px;
  overflow: hidden;
  background-color: var(--main_color_shade);
}

.payment_img_container:not(:last-child)
{
 margin-right: 10px;
}

.payment_img_container img
{
  width: 100%;
  height: 100%;
  object-fit: cover;
}




/*----------- PRODUCT DETAILS STYLE -----------*/
.product_details_container
{
  min-height: 200px;
  padding: 20px 50px;
 
}



.details_inner_content
{
  overflow: auto;
}

.product_details_content
{
   display: flex;
}

.product_detail_img_container
{
   flex: 2;
 
}

.product_details_image_box
{
  overflow: hidden;
  position: relative;
  height: 0;
  padding-bottom: 50%;
 
}

.product_details_inner_box
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.product_details_image_box img
{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
 
}

.product_details_title_container
{

  flex: 1;
  margin-left: 20px;
  /* display: flex;
  align-items: stretch; */
  height: 0;
  padding-bottom: 52%;
  position: relative;

}

.product_img_list
{
  
  overflow-x: auto;
  padding: 10px 0;
}

.image_list_scroll_container
{
  display: flex;
}

.product_list_box
{
  flex-basis: 150px;
  flex-shrink: 0;
  height: 150px;
  overflow: hidden;
}

.product_list_box img
{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product_list_box:not(:last-child)
{
 margin-right: 10px;
}

.product_details_title_content
{
  padding: 10px 60px;
  background-color: var(--color_shade1);
  box-shadow: 0 0 5px 1px var(--color_shade4);
  /*overflow: auto;*/
  /* height: 716px; */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
}

.price_qty_container
{
  display: flex;
  border-top: 1px solid var(--color_shade4);
  border-bottom: 1px solid var(--color_shade4);
  padding: 10px 0;
}

.product_details_qty_box
{
  display: flex;
}

.qty_box
{
  background-color: var(--main_color);
  color: var(--color_shade1);
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  border: none;
}

.column_item .qty_box
{
  width: 30px;
  height: 30px;
  font-weight: 300;

}


.column_item .qty_value
{
  font-size: 16px;
}
.qty_box.btn
{
  border: 1px solid var(  --main_color_shade);
  cursor: pointer;
}

.qty_box.btn:focus
{
  border: 1px solid var( --highlight_color);
}

.qty_box.qty
{
  background-color: var(--highlight_color);

}

.product_details_price_box
{
  flex: 1;
  margin-right: 10px;
}

.product_details_price_box span
{
  font-size: 25px;
}

.product_details_title
{
  margin-bottom: 20px;
  font-size: 30px;
}

.product_details_btn_container
{
  display: grid;
  grid-gap: 10px;
  grid-template-columns: 1fr 1fr;
  padding: 10px 0;
  border-bottom: 1px solid var(--color_shade4);
}

.product_details_btn_container button
{
  width: 100%;
}

.footer_column .product_details_btn_container
{
  border-bottom: none;
}

.product_spec
{
  border-bottom: 1px solid var(--color_shade4);
  padding: 20px 0;
  max-height: 320px;
  overflow: auto;
}


.product_spec h3, .product_details_text h2
{
  padding-bottom: 10px;
}

.product_spec ul li
{
  margin-left: 20px;
  color: var(--color_shade8);
}

.product_details_text
{
  padding: 20px 0;
  background-color: var(--color_shade1);
  margin: 20px 0 0 0 ;
  padding: 10px 20px 20px 20px;
  box-shadow: 0 0 5px 1px var(--color_shade4);
  
}

.product_details_text p:not(:last-child)
{
  margin-bottom: 20px;
}

.social_container.details 
{
  padding: 20px 0;
}

.social_container.details .social_links_container
{
 justify-content: center;
}

.social_container.details h3
{
  text-align: center;
}

/* ----------- PRODUCT SCROLL STYLE ------*/
.related_product_container h2
{
    margin-left: 50px;
}
.product_scroll_container
{
  width: 100%;
  overflow: auto;
  display: flex;
  
}
.product_scroll_content
{
  display: flex;
  padding: 20px 50px ;
  overflow: auto;

}



.product_scroll_content .product_box:not(:last-child)
{
  margin-right: 20px;
  
}

/*----------- PRODUCT CART STYLE -----------*/

.columns_container
{
  padding: 20px 50px;
}

.column_heading
{
  display: grid;
  grid-template-columns: 3fr 1fr 2fr 1fr 1fr ;
  column-gap: 10px;
  background-color: var(--highlight_color);
  color: var(--main_color_shade);
  padding: 10px;

}

.heading_item:first-child
{
  min-width: 120px;
}

.heading_item:first-child
{
  min-width: 250px;
}

.heading_item h3
{
  text-align: center;
  font-size: 18px;
}

.column_wrapper
{
  display: grid;
  grid-template-columns: 2fr 1fr  ;
  column-gap: 20px;
}

.column_wrap
{
  min-width: 800px;
}
.column_inner_container:first-child
{
  overflow: auto;
  min-width: 800px;
}

.column_desc
{
  padding-left: 10px;
  
}

.column_desc p
{
  text-align: left !important;
}

/* .column_inner_container
{
   min-width: 900px;
   width: 100%;
} */

.column_content
{
  display: grid;
  grid-template-columns: 3fr 1fr 2fr 1fr 1fr ;
  column-gap: 10px;
  background-color: var( --main_color_shade);
  color: var(--color_shade8);
  padding: 10px;
  margin: 10px 0;
}

.column_item.img_desc
{
  display: flex;
  justify-content: flex-start;
  min-width: 300px;
}

.column_desc
{
  padding-left: 10px;
}

.column_img
{
  flex-basis: 50px;
  flex-shrink: 0;
  height: 50px;
  overflow: hidden;
}

.column_img img
{
  width: 100%;
  height: 100%;
  object-fit: contain;
  
}

.column_item 
{
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
}



/* .column_item:nth-child(2), .column_item:nth-child(4),
.heading_item:nth-child(2), .heading_item:nth-child(4)
{
  min-width: 120px;
} */

.column_item:last-child,.heading_item:last-child
{
  min-width: 100px;
}

.column_item p
{
  text-align: center;
  
}

.product_remove_btn
{
  background-color: var(--highlight_color);
  color: var( --main_color);
  border: none;
  padding: 2px;
  cursor: pointer;
  width: 25px;
  height: 25px;
  justify-content: center;
  align-items: center;
}

.product_remove_btn span
{
  font-size: 17px;
  font-weight: bold;
}


.product_remove_btn:focus
{
  border: 2px solid var( --highlight_color2);
}

.product_remove_btn:hover
{
  background-color:  var( --highlight_color_dim);
}


#coupon_form
{
  display: flex;
}

#coupon_form button
{
  font-size: 16px;
}

#coupon_form input
{
    flex: 1;
}

.summary_container .category_title_container
{
  padding: 20px 0 0 0;
}

.summary_container
{
  min-width: 300px;
}

.summary_deatils_container
{
  background-color: var(--main_color_shade);
  padding: 15px;
  border: 1px solid var(--color_shade4);
}

.summary_list
{
  display: flex;
  padding: 10px 0;
}

.summary_list p:first-child
{
  flex: 1;
  padding-right: 10px;
}

.summary_list.last
{
  border-bottom: 1px solid var(--color_shade4);
}

.summary_total
{
  display: flex;
  padding: 10px 0;
}


.summary_total p
{
  font-weight: bold;
}
.summary_total p:first-child
{
  flex: 1;
  padding: 10px 0 15px 0;
}

.summary_details_container .close_btn
{
  width: 100%;
  font-size: 16px;
}

/* ------------ CHECKOUT STYLES -----------*/
.column_content.checkout
{
    display: flex;
    align-items: center;
}

.checkout .column_desc
{
  flex: 1;
  padding: 0 20px;
}

.columns_title.order_details
{
  margin-top: 20px;
}

.columns_title.summary
{
  margin: 0;
}

.order_details_wrapper
{
  max-width: 700px;
  overflow: auto;
}

.order_details_wrapper .column_desc
{
  min-width: 150px;
}

.order_details_inner
{
  min-width: 450px;
}

.category_title_container.summary
{
  padding: 0;
}

.payment_method
{
  font-weight: bold;
}

.column_content.payment
{
  padding: 20px;
}

.complete_order_btn
{
  width: 100%;
}

/* ------ CATEGORY STYLES ------------*/

.category_wrapper .product_columns_heading
{
  padding: 0 50px;
}

.category_wrapper .category_title_container
{
  margin-bottom: 0px;
  margin-top: 20px;
}

.categories_heading
{
  padding: 20px 50px 0 50px;
}



/*----------- RESPONSIVE MEDIA  -----------*/


@media only screen and (max-width: 1339px)

{
  /*
  .service_desc
  {
    grid-template-columns: repeat(auto-fill, minmax(20em, 1fr));
  }
  */
}


@media only screen and (max-width: 1332px)

{
  .product_details_title_container
  {

    
    padding-bottom: 55%

  }
}

@media only screen and (max-width: 1209px)

{
  .column_wrapper
  {
    grid-template-columns:1fr  ;
   
  }

  .column_wrapper.checkout_wrap
  {
    grid-template-columns:2fr 1fr  ;
  }

  .column_inner_container:last-child
  {
    max-width: 400px;
  }
}


@media only screen and (max-width: 1150px)

{
 
    .product_details_title
    {
      font-size: 23px;
    }
   

  
}

@media only screen and (max-width: 1108px)

{
  .product_details_title_container
  {

    
    padding-bottom: 58%

  }
}



@media only screen and (max-width: 1121px)
{
 .advert_box h1
 {
  font-size: 24px;
 }

 .advert_box h3
 {
  font-size: 16px;
 }

 .advert_box button
 {
  padding: 8px 12px;
 }
} 



@media only screen and (max-width: 1099px)
{
  /* 
  .service_desc
  {
    grid-template-columns: repeat(auto-fill, minmax(15em, 1fr));
  }
  */
} 


@media only screen and (max-width: 953px)
{
   .product_details_content
   {
    flex-direction: column;
   }

   .product_details_title_container
   {
    margin-left: 0;
   }

   .product_details_title_container
   {
    padding-bottom: 0;
    position: static;
   }

   .product_details_title_content
   {
    position: static;
    width: 100%;
    
   }

   .details_inner_content
    {
      overflow: visible;
    }

    .product_spec
    {
      max-height:initial;
      overflow: visible;
    }

}
@media only screen and (max-width: 931px)
{
    .service_desc
  {
    grid-template-columns: repeat(auto-fill, minmax(15em, 1fr));
  }
}


@media only screen and (max-width: 900px)
{
  .product_desc
   {
    width: 70%;
   }
}

@media only screen and (max-width: 850px)
{
    .main_desc
  {
    flex-direction: column;
  }

  .advert_inner_container
  {
    flex-direction: row;
  }

  .advert_container
  {
    margin-left: 0px;
    
  }

  
.slider_container
  {
    padding-bottom: 50%;
    margin-bottom: 20px;
  }

  .advert_content:not(:last-child)
  {
    margin-right: 20px;
  }

  .advert_container
  {
   padding-bottom: 33.3%;
  }

}
  
@media only screen and (max-width: 700px)
  {

    .categories_heading
      {
        padding: 20px 20px 0 20px;
      }

      .category_wrapper .product_columns_heading
      {
        padding: 0 20px;
      }

    .product_scroll_content
      {
        padding: 20px;
      }

    .related_product_container h2
      {
          margin-left: 20px;
      }

        .category_list_container
        {
          top: 70px;
        
        }

        .product_list_box
        {
          flex-basis: 100px;
          height: 100px;
        }

        .nav_bar
        {
          padding: 0px 35px 0px 20px;
        }

      .main_desc,.service_desc,.categories_container,.product_container,.product_container,.advert_section,.product_details_container, .columns_container
        {
          padding: 20px ;
        }

        .product_title
        {
          color: var(  --main_color_shade);
          font-size: 22px;
        }

        .product_desc
        {
            font-size: 14px;
        }

        .slide .close_btn
        {
          padding: 10px 16px;
        }

        .search_container
        {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          padding: 20px 0px;
          background: var(--color_shade2);
          display: none;
        }

        .contact_container
        {
          flex: 1;
          justify-content: flex-end;
        }

       

        .top_bar
        {
          padding: 10px 20px;
        }

        .nav_icons_container .search_icon
        {
          display: block;
        }


  }

  @media only screen and (max-width: 675px)
  {
     .footer_column .logo_container
     {
       display: flex;
      justify-content: center;
      width: 100%;
     }

     .footer_column .logo_container a
     {
      flex-basis: 80px;
      
     }

     .first_footer_p
     {
      text-align: center;
     }

     .column_wrapper.checkout_wrap
     {
       grid-template-columns: 1fr  ;
     }

  }

 

  @media only screen and (max-width: 650px)
  {
    .advert_section
    {
      flex-direction: column;
    }
/* 
    .advert_box_container:not(last-child)
    {
      margin-right: 0px;
    }*/
    .advert_box_container:not(last-child)
    {
      margin-top: 20px;
    } 
    
    .advert_box_container
    {
      padding-bottom: 45%;
    }
  }

  @media only screen and (max-width: 600px)
  {
    

    .footer2
    {
      flex-direction: column;
      align-items: center;
    }

    .copyright_container
    {
      margin-bottom: 20px;
    }

    .product_call_to_action
    {
      flex-direction: column;
    }

    .product_content
    {
      /* grid-template-columns: repeat(auto-fill, minmax(12em, 1fr)); */
      grid-template-columns: repeat(2, 1fr);
    }

    .product_call_to_action button
    {
      width: 100%;
      justify-content: center;
    }

    .add_to_cart_container
    {
      margin-left: 0px;
      margin-top: 10px;
    }

    .view_details_container
    {
      margin-right: 0px;
    }
  }

  @media only screen and (max-width: 540px)
  {

    .category_submenu
    {
      position: relative;
      left: 0px;
      width: 100%;
      background-color: var(--color_shade9);
    }

    .product_name
    {
      font-size: 14px;
    }

    .category_menu_container .category_dropdown,
     .category_content span:last-child 
    {
      display: none;
    }

    .category_menu_container
    {
      flex-basis: 0px;
      position: static;
    }

    .advert_inner_container
      {
        flex-direction: column;
      } 

      .advert_container
      {
        padding-bottom: 100%;
        
      }
  }

  @media only screen and (max-width: 425px)
  {

    .product_list_box
    {
      flex-basis: 80px;
      height: 80px;
    }

    .summary_container
      {
        min-width: 0px;
      }

    .advert_box_container
    {
      padding-bottom: 55%;
    }

    .product_title
    {
      font-size: 20px;
      margin-bottom: 10px;
    }

    .product_desc
    {
        font-size: 13px;
    }

    .slide .close_btn
    {
      padding: 8px 12px;
    }

    .slider_container
    {
      padding-bottom: 60%;
    }

   
  }
  
  
  @media only screen and (max-width: 416px)
  {

.first_footer_p
     {
      padding-right:40px;
     }
     
.add
{
    padding-right:40px;
}

a>span>.close_btn
{
    display:none;
}
  }
  
     
