.top_bar{border: 1px solid var(--border);}
.top_bar .top_bar_left{float: left;padding: 7px 0px!important;}
.top_bar .top_bar_left li{display: inline-block;color: var(--heading)!important;font-size: 13px;font-weight: 400;}
.top_bar .top_bar_left li i{color: var(--heading)!important;font-size: 14px;}
.top_bar .top_bar_left li span{color: var(--heading)!important;font-size: 15px;font-weight: 600;}
.top_bar .top_bar_right{float: right;padding: 7px 0px!important;}
.top_bar .top_bar_right li a{display: inline-block;color: var(--heading)!important;font-size: 14px;font-weight: 400;}
.top_bar .top_bar_right li a i{color: var(--heading)!important;font-size: 14px;padding-right: 5px;}
.top_bar .top_bar_right li+li:before {content: "|";color: var(--border);display: inline-block;margin: 0 10px!important;}
/* Top Bar Section End Here */

header .masthead{background: var(--white);padding: 10px 0px;}
header .masthead .headtop{display: flex;align-items: center;justify-content: space-between;gap: 50px;}
header .masthead .headtop .logo img{width: 200px;}
header .masthead .headtop .searchform{margin-left: 30px;}
header .masthead .headtop .searchform form{width: 100%;}
header .masthead .headtop .searchform .input-group{border: 1px solid var(--second);border-radius: 50px;}
header .masthead .headtop .searchform form .input-search-field{width: 65%;}
header .masthead .headtop .searchform form .input-search-field input{width: 100%;border-radius:50px 0 0 50px;height: 40px;}
header .masthead .headtop .searchform form .input-search-field input:focus{box-shadow: none;border: 1px solid var(--second);}
header .masthead .headtop .searchform form .search-categories{width: 25%;}
header .masthead .headtop .searchform form .search-categories select{width: 100%;height: 40px;border: 1px solid var(--second);}
header .masthead .headtop .searchform form .search-categories select:focus{box-shadow: none;border: 1px solid var(--second);}
header .masthead .headtop .searchform form .input-group-btn{width: 10%;margin-left: 0.5px!important;}
header .masthead .headtop .searchform form .input-group-btn button{width: 100%;height: 40px;border-radius: 0 50px 50px 0;border: none;outline: none;box-shadow: none;background: var(--second);}
header .masthead .headtop .searchform form .input-group-btn button i{color: var(--heading);font-size: 18px;}

header .masthead .headtop .accountinfo{display: flex;align-items: center;justify-content: flex-end;}
header .masthead .headtop .accountinfo .acc_icon{margin-left: 2.714em;}
header .masthead .headtop .accountinfo .compare{position: relative;}
header .masthead .headtop .accountinfo .compare a{font-size: 14px;font-weight: 700;line-height: 22px;}
header .masthead .headtop .accountinfo .compare a i{font-size: 18px;font-weight: 700;line-height: 22px;color: var(--heading);}
header .masthead .headtop .accountinfo .compare a span{bottom: -7px;left: 10px;position: absolute;background: var(--second);color: var(--heading);padding: 0px 2px;border-radius: 50px;height: 20px;width: auto;line-height: 20px;font-size: 13px;}

header .masthead .headtop .accountinfo .wishlist{position: relative;}
header .masthead .headtop .accountinfo .wishlist a{font-size: 14px;font-weight: 700;line-height: 22px;}
header .masthead .headtop .accountinfo .wishlist a i{font-size: 18px;font-weight: 700;line-height: 22px;color: var(--heading);}
header .masthead .headtop .accountinfo .wishlist a span{bottom: -7px;left: 10px;position: absolute;background: var(--second);color: var(--heading);padding: 0px 2px;border-radius: 50px;height: 20px;min-width: 20px;width: auto;line-height: 20px;font-size: 12px;text-align: center;}

header .masthead .headtop .accountinfo .myaccount{position: relative;}
header .masthead .headtop .accountinfo .myaccount a{font-size: 14px;font-weight: 700;line-height: 22px;color: var(--heading)}
header .masthead .headtop .accountinfo .myaccount a i{font-size: 18px;font-weight: 700;line-height: 22px;color: var(--heading);}
header .masthead .headtop .accountinfo .myaccount a span{bottom: -7px;left: 10px;position: absolute;background: var(--second);color: var(--heading);padding: 0px 2px;border-radius: 50px;height: 20px;width: auto;line-height: 20px;font-size: 13px;}

header .masthead .headtop .accountinfo .cart{position: relative;}
header .masthead .headtop .accountinfo .cart .cart_link{font-size: 14px;font-weight: 700;line-height: 22px;color: var(--heading)}
header .masthead .headtop .accountinfo .cart .cart_link i{font-size: 18px;font-weight: 700;line-height: 22px;color: var(--heading);padding-right: 7px;}
header .masthead .headtop .accountinfo .cart .cart_link span.count{bottom: -7px;left: 10px;position: absolute;background: var(--second);color: var(--heading);padding: 0px 2px;border-radius: 50px;height: 20px;min-width: 20px;width: auto;line-height: 20px;font-size: 12px;text-align: center;}
header .masthead .headtop .accountinfo .cart .cart_items{border: 1px solid #00000026;border-radius: 7px;box-shadow: 0 .125rem .312rem #00000047;margin: 0;position: absolute;z-index: 99;width: 332px;
left: auto !important;right: 0 !important;padding: 20px 15px;visibility: hidden;opacity: 0;transform: translateY(-10px) !important;transition: all .15s ease-in;background: var(--white);}
header .masthead .headtop .accountinfo .cart .cart_link:hover .cart_items{z-index: 999999;transform: scaleY(1) !important;opacity: 1;visibility: visible;transform: translate(0px, 42px);border-top: 2px solid var(--second);}
header .masthead .headtop .accountinfo .cart .cart_item{display: flex;align-items: center;justify-content: space-between;gap: 10px;margin-bottom: 10px;border-bottom: 1px solid var(--border);padding-bottom: 10px;}
header .masthead .headtop .accountinfo .cart .cart_item .cart_img{width: 20%;}
header .masthead .headtop .accountinfo .cart .cart_item .cart_img img{width: 50px;}
header .masthead .headtop .accountinfo .cart .cart_item .cart_dtl{width: 70%;}
header .masthead .headtop .accountinfo .cart .cart_item .cart_dtl a{font-size: 13px;color: var(--heading);display: block;}
header .masthead .headtop .accountinfo .cart .cart_item .cart_dtl span{font-size: 12px;color: var(--heading)}
header .masthead .headtop .accountinfo .cart .cart_item .cart_dtl a:hover{color: var(--primary);}
header .masthead .headtop .accountinfo .cart .cart_item .cart_dtl span:hover{color: var(--orange);}
header .masthead .headtop .accountinfo .cart .cart_item .cart_item_remove{width: 10%;}
header .masthead .headtop .accountinfo .cart .cart_item .cart_item_remove .remove-btn{color: var(--heading);}
header .masthead .headtop .accountinfo .cart .cart_item .cart_item_remove .remove-btn:hover{color: var(--primary);}
header .masthead .headtop .accountinfo .cart .cart_checkout{display: flex;align-items: center;justify-content: center;gap: 10px;}
header .masthead .headtop .accountinfo .cart .cart_checkout a{font-size: 14px;font-weight: 500;border-radius: 50px;padding: 7px 20px;text-align: center;display: block;width: 50%;}
header .masthead .headtop .accountinfo .cart .cart_checkout a.cart_btn{background: var(--bgcopy);border: 1px solid var(--bgcopy);color: var(--heading);}
header .masthead .headtop .accountinfo .cart .cart_checkout a.checkout_btn{background: var(--second);border: 1px solid var(--second);color: var(--heading);}
header .masthead .headtop .accountinfo .cart .cart_checkout a:hover{background: var(--heading);color: var(--white);border: 1px solid var(--heading);}
/* Mast Head Section End Here */

header .mastbody{background: var(--second);}
header .mastbody nav ul{display: inline-block;}
header .mastbody nav ul li{display: inline-block;}
header .mastbody nav ul li a{display: block;color: var(--heading);font-size: 16px;font-weight: 400;padding: 14px 25px;}
header .mastbody nav ul li a i{vertical-align: middle;}
header .mastbody nav ul li a:hover{background: var(--hover);}
/* Navigation End Here */
header .mastbody .contact{background: var(--primary);padding: 3px 10px;}
header .mastbody .contact .media{display: flex;align-items: center;}
header .mastbody .contact .media .call-us-icon{margin-right: 10px;}
header .mastbody .contact .media .call-us-icon i{font-size: 30px;color: var(--second);}
header .mastbody .contact .media .media-body .text{font-size: 13px;color: var(--white);display: block;}
header .mastbody .contact .media .media-body .number a{font-size: 18px;color: var(--white);font-weight: 500;display: inline-block;}
header .mastbody .contact .media .media-body .number a:hover{color: var(--black);}
/* Mast Body Section End Here */

nav ul li.dropdown {position: relative;}
nav ul li ul li {display: block!important;}
nav ul li ul li a{font-size: 15px!important;padding: 10px 15px!important;}
nav ul li.dropdown .dropdown-menu {display: none;position: absolute;top: 100%;left: 0;background: #fff;min-width: 200px;box-shadow: 0 8px 20px rgba(0,0,0,0.15);z-index: 999;}
nav ul li.dropdown:hover .dropdown-menu {display: block;}
/* Navigation Section End Here */

.acc_icon.dropdown-hover, .my-account.dropdown-hover {position: relative;display: inline-block;}
.dropdown-hover .dropdown-content {display: none;position: absolute;background-color: #fff;height: fit-content;min-width: 200px;box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.15);z-index: 1050;right: -35px;top: 95%;border-radius: 5px;border: 1px solid #eee;padding: 8px 0;margin-top: 2px;}
.dropdown-hover .dropdown-content a {color: #333;padding: 10px 20px;text-decoration: none;display: block;text-align: left;font-size: 14px;white-space: nowrap;}
.dropdown-hover .dropdown-content a i {margin-right: 8px;width: 15px;text-align: center;}
.dropdown-hover .dropdown-content a:hover {background-color: var(--primary);color: var(--white)!important;}
.dropdown-hover .dropdown-content a:hover i {color: var(--white)!important;}
.dropdown-hover:hover .dropdown-content {display: block;}
.header_phone .my-account.dropdown-hover .dropdown-content {top: 100%;right: -15px;}
/* Dropdown Contect End Here */

header .header_desktop {transition: all 0.5s ease;}
header .navBarfixed {position: fixed;top: 0; left: 0; width: 100%;background: #fff;box-shadow: 0 2px 30px rgba(0,0,0,0.1);animation: fadeIn 0.5s forwards;z-index: 99999;}
header .fadeOut {animation: fadeOut 0.5s forwards;}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeOut {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-20px); }
}