/* ================== Desktop Base CSS ================== */ .wsmenu html, .wsmenu body, .wsmenu iframe, .wsmenu h1, .wsmenu h2, .wsmenu h3, .wsmenu h4, .wsmenu h5, .wsmenu h6{margin:0; padding:0; border:0; font:inherit; vertical-align:baseline; font-weight:normal; font-size:12px; line-height:18px; font-family:Helvetica, sans-serif; -webkit-font-smoothing:subpixel-antialiased; font-smoothing:antialiased; font-smooth:antialiased; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -webkit-font-smoothing:subpixel-antialiased; font-smoothing:subpixel-antialiased; font-smooth:subpixel-antialiased;} .wsmenu .cl{clear:both;} .wsmenu img, object, embed, video{border:0 none; max-width:100%;} .wsmenu a:focus{outline:none;} .wsmenu:before, .wsmenu:after{content:""; display:table;} .wsmenu:after{clear:both;} /* ================== Desktop Main Menu CSS ================== */ .headerfull{width:100%; height:60px; position:relative; -webkit-box-shadow:0 0 4px rgba(0, 0, 0, 0.16); -moz-box-shadow:0 0 4px rgba(0, 0, 0, 0.16); box-shadow:0 0 4px rgba(0, 0, 0, 0.16);} .smllogo{padding:9px 0 0 16px; margin:0; float:left; width:6%;} .smllogo a{display:block; float:left; padding:0;} .wsmain{width:100%; margin:0 auto; padding:0 25px; max-width:1300px;} .wsmenu{width:98%; float:left; font-family:Helvetica, sans-serif; color:#fff; position:relative; font-size:13px; padding:0; display:block; margin:0; border-left:1px solid rgba(0, 0, 0, 0.1);} .wsmenu>.wsmenu-list{text-align:left; margin:0 auto; width:100%; display:block; padding:0; position:relative;} .wsmenu>.wsmenu-list>li{display:block; float:left; padding:0; margin:0;} .wsmenu>.wsmenu-list>li.header_logo{width:15%; height:auto; float:left; text-align:left; margin:0 0 0 2%; padding:0;} .wsmenu>.wsmenu-list>li.header_logo img{max-width:180.4px; width:100%;} .wsmenu>.wsmenu-list>li.header_logo a{width:auto; height:auto; float:left; display:block; text-decoration:none; position:relative;} .wsmenu>.wsmenu-list>li.header_logo a:hover{background:none;} .wsmenu>.wsmenu-list>li.header_mainnav{width:100%; height:auto; float:left; text-align:center; margin:0; padding:0;} .wsmenu>.wsmenu-list>li a.navtext{width:auto; height:auto; background:url('../../images/general/mainNavBG.png') no-repeat right top; background-position:right 20px top; display:inline-block; text-align:center; margin:0; padding:0 40px 0 0; color:#333333; font-size:17px; line-height:20px; font-weight:400; text-transform:uppercase; text-decoration:none;} .wsmenu>.wsmenu-list>li a.navtext:hover{width:auto; height:auto; background:url('../../images/general/mainNavBG.png') no-repeat right top #FFFFFF; background-position:right 20px top; border-bottom:6px solid #4072A8; display:inline-block; text-align:center; margin:0; padding:0 40px 0 0; color:#333333; font-size:17px; line-height:20px; font-weight:400; text-transform:uppercase; text-decoration:none;} .wsmenu>.wsmenu-list>li.header_content{width:25%; height:auto; float:right; text-align:center; margin:0; padding:0;} /* ================== Desktop Tabing Mega Menus CSS ================== */ /* Tabing Leftside */ .wsmenu>.wsmenu-list>li>.wsshoptabing{width:100%; text-align:left; margin:0; padding:0; position:absolute; top:26px; left:0; border-bottom:solid 2px #376cb7; border-top:solid 0; z-index:101;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp{width:100%; display:block; position:relative; background-color:#f5f5f5;} .wsmenu>.wsmenu-list>li>.wsshoptabing.wtsdepartmentmenu{border-bottom:solid 1px #d1d3d4;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem{display:block; margin:0; padding:0; font-size:12px;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li:before, .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li:after{content:""; display:table;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li:after{clear:both;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li{width:100%; list-style:none;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>a{display:block; padding:15px 11px; font-size:13px; color:#606060; border-bottom:solid 1px #e5e5e5; width:23%; float:left; position:relative; border-left:3px solid #fff; background-color:#fff;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li:hover a{text-decoration:none;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li:hover>a{text-decoration:none;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>a>i{color:#848484; margin-right:5px; text-align:center; width:24px; font-size:16px;} /* Tabing Rightside */ .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wstitemright{opacity:0; visibility:hidden; position:absolute; right:0; top:0; background-color:#fff; color:#000; display:block; float:left; padding:10px 8px 0 8px; width:77%; min-height:400px; z-index:10000;} .wsmenu>.wsmenu-list>li:hover>.wsshoptabing>.wsshopwp>.wstabitem>li.wsshoplink-active>.wstitemright{opacity:1; visibility:visible;} /* Mega Menu Content Formatting */ .carousel-caption{width:100%; display:block; text-align:center; right:0; left:0; margin:0; padding:0; bottom:0;} .carousel-caption h3{width:100%; display:block; padding:7px 0; background-color:rgba(0, 0, 0, 0.5);} .wsmenu>.wsmenu-list>li .wstbootslider{float:right; margin-top:8px;} .wsmenu>.wsmenu-list>li .wstmegamenucolr{display:block; float:right; margin-top:8px;} .wsmenu>.wsmenu-list>li .wstheading{width:100%; display:block; padding:10px 0 6px 0; font-size:14px; font-weight:bold; color:#333333; border-bottom:solid 1px #d9d9d9; margin-bottom:12px; text-transform:uppercase;} .wsmenu>.wsmenu-list>li .wstheading a{text-transform:uppercase; text-decoration:none; font-weight:600; color:#4072A8;} .wsmenu>.wsmenu-list>li .wstheading a:hover{color:#000000;} .wsmenu>.wsmenu-list>li .wstliststy01{padding:0 0 8px 0; margin:0;} .wsmenu>.wsmenu-list>li .wstliststy01 li{width:100%; float:left; line-height:23px; font-size:14px; list-style:none; padding:0; margin:0;} .wsmenu>.wsmenu-list>li .wstliststy01 li a{color:#6e6e6e; font-size:14px; text-decoration:none;} .wsmenu>.wsmenu-list>li .wstliststy01 li a:hover{color:#000; text-decoration:none;} .wsmenu>.wsmenu-list>li .wstliststy02{padding:5px 0 10px 0; margin:0; text-align:left;} .wsmenu>.wsmenu-list>li .wstliststy02 li{width:100%; list-style:none; line-height:25px;} .wsmenu>.wsmenu-list>li .wstliststy02 li a{color:#6e6e6e; font-size:12px;} .wsmenu>.wsmenu-list>li .wstliststy02 li a:hover{color:#000; text-decoration:none;} .wsmenu>.wsmenu-list>li .wstliststy02 li.wstheading{line-height:normal; padding-left:0; margin-top:0; text-transform:none;} .wsmenu>.wsmenu-list>li .wstliststy02 li a .wstcount{font-size:10px; color:#adadad;} .wsmenu>.wsmenu-list>li .wstliststy06 li.wstheading{line-height:normal; padding-left:0;} .wsmenu>.wsmenu-list>li .wstliststy06{padding:0; margin:0;} .wsmenu>.wsmenu-list>li .wstliststy06 li{width:100%; list-style:none; line-height:24px;} .wsmenu>.wsmenu-list>li .wstliststy06 li a{color:#6e6e6e; font-size:12px;} .wsmenu>.wsmenu-list>li .wstliststy06 li a:hover{color:#000; text-decoration:none;} .wsmenu>.wsmenu-list>li .wstliststy06 li.wstheading{line-height:normal;} .wsmenu>.wsmenu-list>li .wstliststy06 li a .wstcount{font-size:10px; color:#adadad;} .wsmenu>.wsmenu-list>li .wstliststy03{width:100%; padding:0 0 8px 0; margin:0;} .wsmenu>.wsmenu-list>li .wstliststy03 li{width:33.33%; float:left; line-height:23px; font-size:14px; list-style:none; padding:0; margin:0;} .wsmenu>.wsmenu-list>li .wstliststy03 li a{color:#6e6e6e; font-size:12px;} .wsmenu>.wsmenu-list>li .wstliststy03 li a:hover{color:#000; text-decoration:none;} .wsmenu>.wsmenu-list>li .wstliststy04{padding:14px 0 0 0; margin:0;} .wsmenu>.wsmenu-list>li .wstliststy04 li{width:100%; list-style:none; line-height:22px;} .wsmenu>.wsmenu-list>li .wstliststy04 li a{color:#6e6e6e; font-size:12px;} .wsmenu>.wsmenu-list>li .wstliststy04 li a:hover{color:#000; text-decoration:none;} .wsmenu>.wsmenu-list>li .wstliststy04 li.wstheading{line-height:normal; text-align:center; padding:12px 0; font-size:13px; margin-bottom:12px;} .wsmenu>.wsmenu-list>li .wstliststy04 li a .wstcount{font-size:10px; color:#adadad;} .wsmenu>.wsmenu-list>li .wstliststy05{padding:10px 0 0 0; margin:0;} .wsmenu>.wsmenu-list>li .wstmegamenucolr03{padding-top:10px; padding-left:20px;} .wsmenu>.wsmenu-list>li .wstliststy05 li{width:100%; list-style:none; line-height:22px;} .wsmenu>.wsmenu-list>li .wstliststy05 li a{color:#6e6e6e; font-size:12px;} .wsmenu>.wsmenu-list>li .wstliststy05 li a:hover{color:#000; text-decoration:none;} .wsmenu>.wsmenu-list>li .wstliststy05 li.wstheading{line-height:normal;} .wsmenu>.wsmenu-list>li .wstliststy05 li a .wstcount{font-size:10px; color:#adadad;} .wsmenu>.wsmenu-list>li .wstmorebtn{border-radius:2px; color:#9b9b9b; display:inline-block; float:right; font-size:10px; font-weight:normal; letter-spacing:0; padding:1px 7px; text-align:right; text-transform:none;} .wsmenu>.wsmenu-list>li .wstmenutag{height:18px; line-height:18px; text-align:center; font-size:11px; color:#fff; border-radius:2px; position:relative; font-family:Arial, Helvetica, sans-serif; font-weight:normal; padding:1px 6px 1px 6px; margin-left:6px; text-transform:none; letter-spacing:-0.0px;} .wsmenu>.wsmenu-list>li .wstmenutag:after{-moz-border-bottom-colors:none; -moz-border-left-colors:none; -moz-border-right-colors:none; -moz-border-top-colors:none; border-image:none; border-style:solid; border-width:3px; content:""; left:-6px; margin-top:0; position:absolute; top:4px; z-index:1;} .wsmenu>.wsmenu-list>li .wstmenutag.redtag{background-color:#fe7b8f;} .wsmenu>.wsmenu-list>li .wstmenutag.redtag:after{border-color:transparent #fe7b8f transparent transparent;} .wsmenu>.wsmenu-list>li .wstmenutag.greentag{background-color:#00c853;} .wsmenu>.wsmenu-list>li .wstmenutag.greentag:after{border-color:transparent #00c853 transparent transparent;} .wsmenu>.wsmenu-list>li .wstmenutag.bluetag{background-color:#4fc3f7;} .wsmenu>.wsmenu-list>li .wstmenutag.bluetag:after{border-color:transparent #4fc3f7 transparent transparent;} .wsmenu>.wsmenu-list>li .wstmenutag.orangetag{background-color:#FE7000;} .wsmenu>.wsmenu-list>li .wstmenutag.orangetag:after{border-color:transparent #FE7000 transparent transparent;} .wsmenu>.wsmenu-list>li .kitchenmenuimg{background-image:url(../../images/kitchen-menu-img.png); background-position:bottom right; background-repeat:no-repeat;} .wsmenu>.wsmenu-list>li .computermenubg{background-image:url(../../images/computer-menu-img.png); background-position:bottom right; background-repeat:no-repeat;} .wsmenu>.wsmenu-list>li .wstpngsml{padding-left:18px;} .wsmenu>.wsmenu-list>li .wstfullwtag{width:100%; display:block; border-bottom:solid 1px #e5e5e5; background-color:#f5f5f5;} /* ================== Desktop Mega Menus CSS ================== */ .wsmenu>.wsmenu-list>li>.wsmegamenu{width:100%; left:0; position:absolute; top:60px; color:#000; z-index:1000; margin:0; text-align:left; padding:14px 5px; font-size:15px; border:solid 1px #eeeeee; background-color:#fff;} .wsmenu>.wsmenu-list>li>.wsmegamenu .title{border-bottom:1px solid #CCC; font-size:14px; padding:9px 5px 9px 0; font-size:17px; color:#424242; margin:0 0 7px 0; text-align:left; height:39px;} .wsmenu>.wsmenu-list>li>.wsmegamenu .link-list li{display:block; text-align:center; white-space:nowrap; text-align:left;} .wsmenu>.wsmenu-list>li>.wsmegamenu .link-list li a{line-height:18px; border-right:none; text-align:left; padding:6px 0; background:#fff; background-image:none; color:#666666; border-right:0 none; display:block; background-color:#fff; color:#424242;} .wsmenu>.wsmenu-list>li>.wsmegamenu li i{margin-right:5px; text-align:center; width:18px;} .wsmenu>.wsmenu-list>li>.wsmegamenu li a:hover{background:transparent; text-decoration:underline;} .wsmenu>.wsmenu-list>li>.wsmegamenu .link-list li i{font-size:11px;} .wsmenu>.wsmenu-list>li>.wsmegamenu li i{margin-right:5px; text-align:center; width:18px;} .wsmenu>.wsmenu-list>li>.wsmegamenu .mrgtop{margin-top:15px;} .wsmenu>.wsmenu-list>li>.wsmegamenu .show-grid div{padding-bottom:10px; padding-top:10px; background-color:#dbdbdb; border:1px solid #e7e7e7; color:#6a6a6a; margin:2px 0; font-size:13px;} /* ================== Desktop Half Menus CSS ================== */ .wsmenu>.wsmenu-list>li>.wsmegamenu.halfmenu{width:40%; right:auto; left:auto;} .wsmenu>.wsmenu-list>li>.wsmegamenu.halfdiv{width:35%; right:0; left:auto;} /* ================== Desktop Extra CSS ================== */ .wsmobileheader{display:none;} .overlapblackbg{opacity:0; visibility:hidden;} .wsmenu .wsmenu-click{display:none;} .wsmenu .wsmenu-click02{display:none;} .wsmenu .wsmenu-click03{display:none;} .hometext{display:none;} /*============================================================================== Start Mobile CSS ===============================================================================*/ /* ================== Mobile Menu Change Brake Point ================== */ @media only screen and (max-width:991px){ /* ================== Mobile Base CSS ================== */ html{overflow:hidden; height:100%; -webkit-overflow-scrolling:touch;} body{height:100%; overflow-y:auto; overflow-x:hidden;} body.wsactive{overflow:hidden;} /* ================== Mobile Main Menu CSS ================== */ .smllogo{display:none;} .wsmain{margin:0; background-color:transparent;} .wsmenu{width:100%; background:rgba(0, 0, 0, 0) none repeat scroll 0 0; left:0; overflow-y:hidden; padding:0; top:0; visibility:hidden; position:fixed; margin:0; border-left:none;} .wsmenu>.wsmenu-list{height:auto; min-height:100%; width:260px; background:#fff; padding-bottom:0; margin-left:-260px; display:block; text-align:center; -webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out; position:static;} .wsmenu>.wsmenu-list>li{width:100%; display:block; float:none; border-right:none; background-color:transparent; position:relative; white-space:inherit;} @supports (-webkit-overflow-scrolling:touch){.wsmenu>.wsmenu-list>li:last-child{padding-bottom:110px;}} .wsmenu>.wsmenu-list>li>a{padding:9px 32px 9px 18px; font-size:14px; text-align:left; border-right:solid 0; background-color:transparent; color:#666666; line-height:25px; border-bottom:1px solid; position:static;} .wsmenu>.wsmenu-list>li>.navtext{padding-left:18px;} .wsmenu>.wsmenu-list>li.wscarticon a{padding-left:18px;} .wsmenu>.wsmenu-list>li.wsshopmyaccount>a{padding-left:18px;} .wsmenu>.wsmenu-list>li>a>i{font-size:16px; color:#bfbfbf;} .wsmenu>.wsmenu-list>li.wscarticon a i{margin-right:7px; font-size:15px;} .wsmenu>.wsmenu-list>li>a .wsarrow:after{display:none;} .wsmenu>.wsmenu-list>li.wscarticon em.roundpoint{display:inline-block; right:auto; left:27px;} .wsmenu>.wsmenu-list>li:hover>a{background-color:rgba(0, 0, 0, 0.08); text-decoration:none;} .wsmenu>.wsmenu-list>li>a>.hometext{display:inline-block;} .wsmenu>.wsmenu-list>li.wscarticon .hidetxt{display:inline-block;} .wsmenu>.wsmenu-list>li.wssearchbar{display:none;} .wsmenu>.wsmenu-list>li.wscarticon{float:none;} .wsmenu>.wsmenu-list>li.wsshopmyaccount{float:none;} .wsmenu>.wsmenu-list>li.wscarticon a{text-align:left; font-size:13px;} /* ================== Mobile Dropdown CSS ================== */ .wsmenu>.wsmenu-list>li>ul.sub-menu{display:none; position:relative; top:0; background-color:#fff; border-bottom:solid 1px #ccc; padding:0; opacity:1; visibility:visible; -webkit-transform:none; -moz-transform:none; -ms-transform:none; -o-transform:none; transform:none; -webkit-transition:inherit; -moz-transition:inherit; transition:inherit; -webkit-transform-style:flat;} .wsmenu>.wsmenu-list>li>ul.sub-menu>li>a{line-height:20px; font-size:13px; padding:13px 0 13px 16px; color:#6e6e6e; border-bottom:solid 1px rgba(0, 0, 0, 0.13);} .wsmenu>.wsmenu-list>li>ul.sub-menu>li span+a{padding-right:30px;} .wsmenu>.wsmenu-list>li>ul.sub-menu>li>a:hover{background-color:#e7e7e7; color:#666666; text-decoration:underline;} .wsmenu>.wsmenu-list>li>ul.sub-menu li:hover>a{background-color:#e7e7e7; color:#666666;} /* ================== Mobile Mega Menu CSS ================== */ .wsmenu>.wsmenu-list>li>.wsmegamenu{background-color:#fff; padding-top:5px; color:#666666; display:none; position:relative; top:0; padding:8px 0; border:solid 0; opacity:1; visibility:visible; transform:none; -o-transform:none; -moz-transform:none; -webkit-transform:none; border-bottom:1px solid rgba(0, 0, 0, 0.13); -webkit-transform-style:flat;} .wsmenu>.wsmenu-list>li>.wsmegamenu.halfmenu{width:100%;} .wstabitem02>.wsshoplink-active>a:after{display:none;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li{position:relative;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>a{width:100%; margin:0; float:none; font-size:12px; padding:14px 11px 14px 11px; font-weight:bold;} .wsmenu>.wsmenu-list>li .wstheading{font-weight:normal; padding-left:0; padding-right:0;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wstitemright{width:100%; position:static; top:0; min-height:inherit; padding:10px 0; opacity:1; visibility:visible; display:none; background-color:#fff; border-bottom:1px solid rgba(0, 0, 0, 0.13);} .wsmenu>.wsmenu-list>li .wstbootslider{width:auto;} .wsmenu>.wsmenu-list>li .wstmegamenucolr{width:auto;} .wsmenu>.wsmenu-list>li .wstliststy01>li{width:100%; padding:0; margin:0;} .wsmenu>.wsmenu-list>li .wstliststy02{width:100%; padding:0; margin:0 0 15px 0;} .wsmenu>.wsmenu-list>li .wstliststy03 li{width:100%;} .wsmenu>.wsmenu-list>li .wstliststy05{width:100%; padding:0; margin-bottom:10px;} .wsmenu>.wsmenu-list>li .kitchenmenuimg{background-image:none;} .wsmenu>.wsmenu-list>li .computermenubg{background-image:none;} .wsmenu>.wsmenu-list>li .wstbrandbottom{width:100%; position:static; top:0; min-height:inherit; padding:10px 5px 15px 5px; opacity:1; visibility:visible; display:none; border-bottom:1px solid rgba(0, 0, 0, 0.13);} .wsmenu>.wsmenu-list>li .wstabitem02{display:block;} .wsmenu>.wsmenu-list>li .wstabitem02>li{position:relative; text-align:left; display:block;} .wsmenu>.wsmenu-list>li .wstabitem02>li>a{padding:13px 11px;} .wsmenu>.wsmenu-list>li .wstabitem02>li>a{background-color:#fff;} .wsmenu>.wsmenu-list>li .wstheading{padding-left:0;} .wsmenu-list>li>.navtext{margin:0;} .wsmenu .wsmenu-list>li .wsshoptabingwp{background-color:#fff; padding-left:0; padding-right:0;} .wsmenu>.wsmenu-list>li>.wsshoptabing{background-color:#ffffff; color:#666666; display:none; position:relative; top:0; padding:0; border:solid 0; opacity:1; visibility:visible; transform:none; -o-transform:none; -moz-transform:none; -webkit-transform:none; -webkit-transform-style:flat;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem{width:100%; background-color:#fff;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>a:after{border:none;} .wsmenu>.wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>a i{display:none;} /* ================== Mobile Header CSS ================== */ .wsmobileheader{width:100%; display:block; position:fixed; top:0; left:0; z-index:10002; height:60px; background-color:#eaecf0; text-align:center; -webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out; box-shadow:0 0 1px rgba(0, 0, 0, .3);} .wsactive .wsmobileheader{margin-left:260px; -webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out;} .wsmobileheader>.smllogo{display:block; width:80px; margin:7px auto 0 auto; float:none; padding-left:0;} .mobiletext{display:inline-block;} /* Mobile Toggle Menu icon (X ICON) */ .wsanimated-arrow{position:absolute; left:0; top:0; z-index:102; -webkit-transition:all 0.4s ease-in-out; -moz-transition:all 0.4s ease-in-out; -o-transition:all 0.4s ease-in-out; -ms-transition:all 0.4s ease-in-out; transition:all 0.4s ease-in-out;} .wsanimated-arrow{cursor:pointer; padding:16px 35px 16px 0; margin:12px 0 0 15px;} .wsanimated-arrow span, .wsanimated-arrow span:before, .wsanimated-arrow span:after{cursor:pointer; height:2px; width:17px; background:#9196a0; position:absolute; display:block; content:'';} .wsanimated-arrow span:before{top:-7px; width:23px;} .wsanimated-arrow span:after{bottom:-7px; width:17px;} .wsanimated-arrow span, .wsanimated-arrow span:before, .wsanimated-arrow span:after{transition:all 500ms ease-in-out;} .wsactive .wsanimated-arrow span:after{width:23px;} .wsactive .wsanimated-arrow span{background-color:transparent;} .wsactive .wsanimated-arrow span:before, .wsactive .wsanimated-arrow.active span:after{top:7px;} .wsactive .wsanimated-arrow span:before{transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); -webkit-transform:rotate(45deg); bottom:0;} .wsactive .wsanimated-arrow span:after{transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); -webkit-transform:rotate(-45deg);} /* ================== Mobile Overlay/Drawer CSS ================== */ .wsmenu>.overlapblackbg{right:0; width:calc(100% - 260px); height:100vh; min-height:100%; position:fixed; top:0; opacity:0; visibility:hidden; background-color:rgba(0, 0, 0, 0.45); cursor:pointer;} .wsactive .wsmenu>.overlapblackbg{opacity:1; visibility:visible; -webkit-transition:opacity 1.5s ease-in-out; -moz-transition:opacity 1.5s ease-in-out; -ms-transition:opacity 1.5s ease-in-out; -o-transition:opacity 1.5s ease-in-out;} .wsmenucontainer{-webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out;} .wsactive .wsmenucontainer{margin-left:260px; -webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out;} .wsactive .wsmenu{overflow-y:scroll; -webkit-overflow-scrolling:touch; visibility:visible; z-index:1000; top:0;} .wsactive .wsmenu>.wsmenu-list{-webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; -o-transition:all 0.25s ease-in-out; -ms-transition:all 0.25s ease-in-out; transition:all 0.25s ease-in-out; margin-left:0;} /* ================== Mobile Sub Menu Expander Arrows ================== */ .wsmenu>.wsmenu-list>li>.wsmenu-click{border-left:1px solid; cursor:pointer; display:block; height:60px; position:absolute; right:0; top:0; width:49px; z-index:10;} .wsmenu>.wsmenu-list>li>.wsmenu-click>i{display:block; height:8px; width:8px; float:right; transform:rotate(-225deg); margin:23px 21px 0 0;} .wsmenu>.wsmenu-list>li>.wsmenu-click>i:before{content:""; width:100%; height:100%; border-width:1.5px 1.5px 0 0; border-style:solid; border-color:rgba(0, 0, 0, 0.40); transition:0.2s ease; display:block; transform-origin:100% 0;} .wsmenu>.wsmenu-list>li>.wsmenu-click.ws-activearrow>i{transform:rotate(-45deg); margin-top:27px;} .wsmenu .wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wsmenu-click02{border-left:1px solid #f3f3f3; cursor:pointer; display:block; height:45px; position:absolute; right:0; top:0; width:49px; z-index:10; background-color:#f5f5f5;} .wsmenu .wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wsmenu-click02 i{display:block; height:8px; width:8px; float:right; transform:rotate(-225deg); margin:17px 21px 0 0;} .wsmenu .wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wsmenu-click02 i:before{content:""; width:100%; height:100%; border-width:1.5px 1.5px 0 0; border-style:solid; border-color:rgba(0, 0, 0, 0.40); transition:0.2s ease; display:block; transform-origin:100% 0;} .wsmenu .wsmenu-list>li>.wsshoptabing>.wsshopwp>.wstabitem>li>.wsmenu-click02.ws-activearrow02>i{transform:rotate(-45deg); margin-top:21px;} .wsmenu .wsmenu-list>li>.wtsbrandmenu>.wsshoptabingwp>.wstabitem02>li>.wsmenu-click03{border-left:1px solid #f3f3f3; cursor:pointer; display:block; height:45px; position:absolute; right:0; top:0; width:49px; z-index:10; background-color:#f3f3f3;} .wsmenu .wsmenu-list>li>.wtsbrandmenu>.wsshoptabingwp>.wstabitem02>li>.wsmenu-click03 i{display:block; height:8px; width:8px; float:right; transform:rotate(-225deg); margin:17px 21px 0 0;} .wsmenu .wsmenu-list>li>.wtsbrandmenu>.wsshoptabingwp>.wstabitem02>li>.wsmenu-click03 i:before{content:""; width:100%; height:100%; border-width:1.5px 1.5px 0 0; border-style:solid; border-color:rgba(0, 0, 0, 0.40); transition:0.2s ease; display:block; transform-origin:100% 0;} .wsmenu .wsmenu-list>li>.wtsbrandmenu>.wsshoptabingwp>.wstabitem02>li>.wsmenu-click03.ws-activearrow03>i{transform:rotate(-45deg); margin-top:21px;} } @media only screen and (min-width:992px) and (max-width:1262px){ .wsmenu>.wsmenu-list>li.wssearchbar{width:21%;} .smllogo{width:7%;} /* .wsmenu{width:93%;} */ } @media only screen and (min-width:1024px) and (max-width:1270px){ .wsmenu>.wsmenu-list{text-align:left; margin:0 auto; width:100%; display:block; padding:0; position:relative;} .wsmenu>.wsmenu-list>li{display:block; float:left; padding:0; margin:0;} .wsmenu>.wsmenu-list>li.header_logo{width:15%; height:auto; float:left; text-align:left; margin:25px 0 0 27px; padding:0;} .wsmenu>.wsmenu-list>li.header_logo img{max-width:180.4px; width:100%;} .wsmenu>.wsmenu-list>li.header_logo a{width:auto; height:auto; float:left; display:block; text-decoration:none; position:relative;} .wsmenu>.wsmenu-list>li.header_logo a:hover{background:none;} /* .wsmenu>.wsmenu-list>li.header_mainnav{width:58%; height:auto; float:left; text-align:center; margin:36px 0 0 0; padding:0;} */ .wsmenu>.wsmenu-list>li.header_mainnav{height:auto; float:left; text-align:center; margin:0; padding:0;} .wsmenu>.wsmenu-list>li a.navtext{width:auto; height:auto; background:url('../../images/general/mainNavBG.png') no-repeat right top; display:inline-block; text-align:center; margin:0 13px; padding:0 20px 13px 0; color:#333333; font-size:14px; line-height:20px; font-weight:400; text-transform:uppercase; text-decoration:none;} .wsmenu>.wsmenu-list>li a.navtext:hover{width:auto; height:auto; background:url('../../images/general/mainNavBG.png') no-repeat right top #FFFFFF; border-bottom:6px solid #4072A8; display:inline-block; text-align:center; margin:0 13px; padding:0 20px 13px 0; color:#333333; font-size:14px; line-height:20px; font-weight:400; text-transform:uppercase; text-decoration:none;} .wsmenu>.wsmenu-list>li.header_content{width:25%; height:auto; float:right; text-align:center; margin:0; padding:0;} }