/*-------------------------------------------------------------------------------- Template Name: Multipurpose eCommerce Bootstrap Template. Template URI: http://ourshop.infinitelayout.com Description: This is html5 template Author: InfiniteLayout Author URI: http://infinitelayout.com Version: 1.0 ----------------------------------------------------------------------------------- CSS INDEX =================== 1. Theme Default CSS (body, link color, section, scrollUp etc) 2. Header 2.1 Header-top-left 2.2 Header-top-Right 2.3 Logo 2.4 Search-category-wrap 2.5 Header-cart-wrap 3. Mainmenu-area 3.1 Dropdown Menu 3.2 Mega Menu 3.3 Sticky Menu 3.4 Mobile Menu 4. Slider-area 5. Welcome-area 6. Banner-area 7. Featured-product-wrap 8. Latest-trend-wrap 9. Latest-products-wrap 10. Latest-testimonials-wrap 11. Shop-by-Category 12. New-Trending 13. Brand-area 14. latest-blog-wrap 15. Instagram 16. Various-Product-Wrap 17. Footer 18. Home-2 19. Home-3 20. Home-4 21. Home-5 22. Home-6 23. Home-7 23.1. Fatures-Area 23.2. About-Area 23.3. Portfolio-Area 24. Home-8 24.1. Pricing table 25. Home-9 26. Portfolio 27. Gallery 28. Faq Page 29. About Us 30. Blog page 31. Blog Details 32. Checkout page 33. Collection List 34. Contact Us 35. Contact-Version-2 36. Login page 37. My Account Page 38. Shop Page 39. Cart page 40. Wishlist page 41. Single Product 42. Four-Zero-Four 43. Product Modal 44. Preloader 45. Newsletter Popup Area 46. Single Page Sidebar 47. Home-10 48. Thankyou -----------------------------------------------------------------------------------*/ /*----------------------------------------*/ /* 1. Theme default CSS /*----------------------------------------*/ html, body {height: 100%;} .floatleft {float:left} .floatright {float:right} .alignleft {float:left;margin-right:15px;margin-bottom: 15px} .alignright {float:right;margin-left:15px;margin-bottom: 15px} .aligncenter {display:block;margin:0 auto 15px} a:focus {outline:0px solid} img {max-width:100%;height:auto} .fix {overflow:hidden} .clear{clear:both} p {margin: 0 0 15px;} h1, h2, h3, h4, h5, h6 { margin: 0 0 10px; color: inherit; font-family: 'Raleway', sans-serif; font-weight: 500; line-height: 1.1; } a { -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; text-decoration:none; color: #222;} a:hover { color: #57ae10; text-decoration: none; } a:active, a:hover, a:focus { outline: 0 none; text-decoration: none; } ul { list-style: outside none none; margin: 0; padding: 0; } body { color: #333; font-family: 'Roboto', sans-serif; font-size: 13px; font-weight: 400; text-align: left; line-height: 30px; background: #fff; } ::-moz-selection { background: #33A8F3; text-shadow: none; color: #fff; } ::selection { background: #33A8F3; text-shadow: none; color: #fff; } .browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } #scrollUp { background: #333 none repeat scroll 0 0; bottom: 51px; color: #ffffff; font-size: 30px; font-weight: 700; font-weight: normal; height: 40px; line-height: 38px; margin: 0 auto; right: 9px; text-align: center; text-decoration: none; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; width: 40px; } #scrollUp:hover { background: #dfdfdf; color: #000000; } input:focus, textarea:focus { background-color: #edf7fd; } /*================================ 2. Header-area =================================*/ /*----------------------------- 2.1 Header-top-left ------------------------------*/ .welcome-mg { display: inline-block; padding: 0px 20px 0 0px; color: #fff; font-size: 13px; float: left; border-right: 1px solid #fff; } .phone_number { margin-left: 20px; display: inline-block; color: #fff; font-size: 13px; } .phone_number span { color: #57ae10; } .phone_number:after { content: "\f095"; display: inline-block; float: right; font-family: FontAwesome; margin-left: 10px; margin-top: 2px; } /*-------------------- --- SOCIAL ----------- ----------------------*/ .social-icons-container { width: 100%; float: left; } .social-icons-container .top-social-icons { margin: 0; padding: 0px; position: absolute; right: 0; } .social-icons-container .top-social-icons li { padding: 0px; margin: -5px; list-style-type: none; display: inline-block; border-left: none; float: left; margin-right: 10px; } .social-icons-container .top-social-icons li:last-child { border-right: none; } .social-icons-container .top-social-icons li a { display: inline-block; height: 40px; width: 40px; text-align: left; line-height: 40px; color: #ddd; transition-duration: .3s; } .social-icons-container .top-social-icons li a:hover { background: #1b1b1b; color: #FFFFFF!important; } .header-logo.home-2 img{ max-width: 21%; float: left; } @media screen and (min-width:768px) and (max-width:1920px) { .megamenuLi_img_frame{ position: relative; } .megamenuLi_img_frame .megamenuLi_img{ position: absolute; right: 0; top: -95px; } } /*-------------------- 2.2 Header-top-Right ----------------------*/ .header-top-wrap { background: #000 none repeat scroll 0 0; padding: 4px 0 5px; } .top-language-wrap, .top-currency-wrap { margin: 0; display: inline-block; } .top-language-wrap .dropdown-menu>li,.top-currency-wrap .dropdown-menu>li { padding: 1px 0px; border-bottom: 1px #bbb solid; } .top-language-wrap .dropdown-menu>li:last-child,.top-currency-wrap .dropdown-menu>li:last-child { border-bottom: none; } .top-language-wrap .dropdown-menu > li > a img { margin: 0px 6px 0px 0px; } .top-link-wrap div.single-link ul.dropdown-menu > li > a { color: #000; } .top-language-wrap .dropdown-menu,.top-currency-wrap .dropdown-menu { min-width: 95px; border-radius: 0px; z-index: 1000; border-bottom: 3px solid #57ae10; } .top-language-wrap .dropdown-menu a { padding: 3px 10px 3px 10px; } .top-link-wrap div.single-link .dropdown-menu a:hover,.top-link-wrap div.single-link .dropdown-menu a:hover { background: none; color: #57ae10; } .top-language,.top-currency {border: none; background: none; color: #fff; font-size: 13px; letter-spacing: 1px; text-transform: capitalize; } .welcome-mg:hover { color: #57ae10; } a.top-language:focus,a.top-currency:focus { color: #fff; } .top-language img {padding: 0px 5px 0px 0px; margin: auto; font-weight: normal; } .top-currency-wrap .dropdown-menu a { padding: 3px 15px; } .dropdown-menu { box-shadow: none; } .top-link-wrap { text-align: right; } .top-link-wrap .single-link>div {display: inline-block; } .top-link-wrap .single-link a { color: #fff; font-size: 13px; text-transform: capitalize; padding-left: 18px; letter-spacing: 1px; } .top-link-wrap div.single-link div a:hover {color: #57ae10; } .single-link .my-account a:before,.single-link .wishlist a:before,.single-link .check a:before,.single-link .login a:before { content: '\f007'; font-family: FontAwesome; font-size: 11px; padding-right: 6px } .single-link .wishlist a:before {content: '\f004'; } .single-link .check a:before {content: '\f00c'; } .single-link .login a:before {content: '\f13e'; } /*----------------------- 2.3 Logo -------------------------*/ .header-logo > a { display: inline-block; margin-top: px; } /*------------------------------- 2.4 Search-category-wrap ---------------------------------*/ .header-mid-content { padding: 20px 0; } .header-search-box.home-1 { width: 100%; } .header-mid-wrap { border-bottom: 1px solid #fff; } .mid-shipping.home-1 p { color: #fff; font-size: 17px; text-transform: capitalize; margin: 8px 0 0 0px; } .mid-shipping p span { color: #57ae10; margin-right: 10px; font-size: 22px; } .header-mid-wrap { background: #1c1c1c; } .header-search-box { background-color: #fff; width: 100%; position: relative; z-index: 111; margin-top: 5px; } #text-search,#text-search-blog { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: medium none; padding: 0 55px 0 20px; font-size: 15px; outline: medium none; height: 40px; line-height: 40px; width: 100%; } #text-search:focus,#text-search-blog {outline: none} #btn-search-category { background: #57ae10 none repeat scroll 0 0; border: 0 none; color: #fff; font-size: 16px; position: absolute; height: 40px; outline: medium none; right: 0 !important; line-height: 40px; margin: 0; top: 0; z-index: 99; width: 25%; } #btn-search-category:hover, #btn-search-two:hover i {color: #000} #btn-search-category i { font-style: normal; padding: 0 13px 0; transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; } .mid-shipping p { font-size: 18px; color: #fff; margin: 18px 0 0 0; } .home-1 .header-logo { margin: 4px 0 0 0; } /*--------------------------- 2.5 Header-cart-wrap -----------------------------*/ .mini-cart-content .sing-cart-pro { padding: 10px 15px; float: none; margin: 0 -15px; overflow: hidden; width: auto; } .sing-cart-pro .cart-image a img { overflow: hidden; display: block; } .sing-cart-pro .cart-image:hover { -webkit-transform: scale(1.1); transform: scale(1.1); -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .header-cart-wrap { float: right; position: relative; margin: 15px 0; } .header-cart-wrap > li { background: #fff none repeat scroll 0 0; height: 40px; overflow: hidden; display: block; } .header-cart-wrap > li > a { color: #000; font-size: 14px; display: block; position: relative; line-height: 40px; padding: 0 12px 0 60px; font-weight: 500; } .header-cart-wrap > li:hover > a, .header-cart-wrap li:hover a::before, .cart-product-info .product-name:hover { color: #57ae10 } .header-cart-wrap > li > a:before { position: absolute; color: #fff; font-size: 18px !important; content: " \f07a "; font-family: "FontAwesome"; font-weight: 300; height: 40px; left: 0; text-align: center; top: 0; width: 50px; z-index: 1; background: #57ae10; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } ul.header-cart-wrap li:hover a:before { background: #f2eeee; } ul.header-cart-wrap .mini-cart-content { background: #fff none repeat scroll 0 0; border-top: 2px solid #57ae10; padding: 10px 15px; position: absolute; right: 0; text-align: left; top: 100%; -webkit-transform: translateY(40px); transform: translateY(40px); -webkit-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; width: 273px; visibility: hidden; z-index: -99; } ul.header-cart-wrap li:hover .mini-cart-content { margin-top: 0; -webkit-transform: translateY(0px); transform: translateY(0px); visibility: visible; z-index: 99999; } .mini-cart-content .cart-image { background-color: #f1f1f1; border: 1px solid #eeeeee; margin-right: 10px; float: left; } .mini-cart-content .cart-image a img { width: 70px; } .mini-cart-content .cart-product-info { display: inline-block; min-height: 70px; position: relative; width: 65%; } .cart-product-info .product-name { display: block; font-size: 14px; font-weight: 400; line-height: 1.25; margin-bottom: 9px; margin-right: 5px; text-transform: uppercase; width: auto; } .cart-product-info .cart-price { font-size: 13px; line-height: 1.25; } .price-amount { clear: both; font-size: 14px; margin: 15px 0 40px; padding-top: 10px; font-weight: normal; text-transform: uppercase; border-top: 1px solid #eeeeee; } .edit-pro,.remove-pro { font-size: 14px; margin: 0 10px 0 0; color: #57ae10; cursor: pointer; } .edit-pro:hover,.remove-pro:hover { color: #333; } .remove-pro {margin: 0; } .price-amount .cart-subtotal { font-size: 16px; font-weight: 600; display: inline-block; float: left; } .cart-price-list span {float: right; } .cart-price-list .cart-checkout { display: inline-block; text-align: center; /* width: 51%; */ float: right; } .header-cart-wrap .cart-checkout a{ color: #fff; height: 38px; padding: 0 30px; text-align: center; white-space: nowrap; display: table-cell; display: inline-block; text-transform: uppercase; -webkit-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s; vertical-align: middle; display: table-cell; font-weight: 500; background: #57ae10 none repeat scroll 0 0; } .cart-price-list .cart-checkout a:hover { color: #1c1c1c; background: #fff none repeat scroll 0 0; box-shadow: 0 5px 18px 0 rgba(0, 0, 0, 0.2); } /*---------------------- 3. mainmenu-area -----------------------*/ .mainmenu-area { position: relative; background: #1c1c1c; z-index: 999; height: 50px; } .mainmenu ul#nav li { position: relative; display: inline-block; } .mainmenu ul#nav > li > a { text-decoration: none; color: #fff; display: block; font-size: 14px; padding: 10px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .mainmenu nav > ul > li.angle-down > a::after,.mainmenu nav > ul > li.angle-down.fixed > a::after { color: #fff; content: ""; position: absolute; right: 38%; border-right: 10px solid transparent; border-left: 10px solid transparent; border-top: 12px solid #fff; top: 0px; -webkit-transition: all 0.4s ease-in-out 0s; transition: all 0.4s ease-in-out 0s; opacity: 0; visibility: hidden; } .mainmenu nav > ul > li.angle-down.fixed > a::after { opacity: 1; visibility: visible; } .mainmenu nav > ul > li:hover > a::after { opacity: 1; visibility: visible; } .mainmenu ul#nav > li:nth-child(1) { background: #57ae10; } .mainmenu ul#nav > li:hover { background: #57ae10; } .mainmenu ul#nav > li:hover > a {color: #000; } .megamenu .megamenu-list > .mega-single:hover > a.mega-title { color: #57ae10 !important; letter-spacing: 1px; -webkit-transition: all 1s ease 0s !important; transition: all 1s ease 0s !important; } a.mega-title:hover { letter-spacing: 0px !important; -webkit-transition: all 0.3s ease 0s !important; transition: all 0.3s ease 0s !important; } .mainmenu ul#nav > li > a::before { position: absolute; left: 50%; font-size: 30px; top: 50%; content: "-"; -webkit-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: text-shadow 0.3s ease 0s, color 0.3s ease 0s; transition: text-shadow 0.3s ease 0s, color 0.3s ease 0s; color: transparent; font-weight: 400; } .mainmenu ul#nav > li:hover > a::before { color: #fff; text-shadow: 11px 0 #fff, -11px 0 #fff; } /*-------------------- 3.1 Dropdown Menu ----------------------*/ .mainmenu ul.sub-menu { position: absolute; visibility: hidden; text-align: left; left: 0; margin: 0; border-top: 2px solid #57ae10; top: 100%; width: 215px; z-index: -99; background-color: #fff; padding: 30px 20px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); transform-origin: top center; -webkit-transform-origin: top center; transition: all 0.4s ease-out 0s; -webkit-transition: all 0.4s ease-out 0s; transform: rotateX(90deg); -webkit-transform: rotateX(90deg); } .mainmenu ul#nav li ul.sub-menu > li { position: relative; display: block; padding: 0; margin: 0; } .mainmenu ul#nav li ul.sub-menu > li a, .mainmenu ul#nav li .megamenu span > a { font-size: 14px; display: block; font-weight: normal; line-height: 30px; color: #222; text-transform: capitalize; } .mainmenu > nav > ul#nav > li:hover ul.sub-menu, .mainmenu ul#nav li:hover .megamenu { margin-top: 0; visibility: visible; z-index: 99999; transform: rotateX(0deg); -webkit-transform: rotateX(0deg); } .mainmenu ul#nav li.drop-down {position: relative;} .mainmenu ul#nav li ul.sub-menu > li {padding: 0} /*-------------------- 3.2 Mega Menu ---------------------*/ .mainmenu ul#nav li .megamenu { position: absolute; text-align: left; visibility: hidden; left: -127px; margin: 0; top: 100%; width: 1200px; border-top: 2px solid #57ae10; z-index: -99; padding: 30px 20px; background-color: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); transform-origin: top center; -webkit-transform-origin: top center; transition: all 0.4s ease-out 0s; -webkit-transition: all 0.4s ease-out 0s; transform: rotateX(90deg); -webkit-transform: rotateX(90deg); } .mainmenu ul#nav li .megamenu.pages { width: 480px; } .mainmenu ul#nav li .megamenu span > a.mega-title, .mainmenu ul#nav li .sub-menu a.mega-title { border-bottom: 4px double #57ae10; position: relative; color: #333333; display: block; font-size: 14px; font-weight: 600; line-height: 28px; margin-bottom: 20px; padding-bottom: 7px; text-decoration: none; text-transform: uppercase; } .mainmenu ul#nav li .megamenu span { padding: 0 10px; float: left; width: 20%; min-height: 55px; height: auto; } .mainmenu ul#nav li .megamenu span.pages { width: 200px; text-align: left; } .mainmenu ul#nav li .megamenu span > a:hover, .mainmenu ul#nav li .megamenu span a.mega-title:hover, .mainmenu ul#nav li ul.sub-menu > li a:hover { color: #57ae10; padding-left: 8px; } .menu-banner { margin-top: 30px; display: inline-block; } .sin-menu-banner { position: relative; overflow: hidden; } .menu-banner a img { transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .menu-banner a:hover img { transform: scale(1.3); -webkit-transform: scale(1.3); } .mainmenu ul#nav li .megamenu span a.mega-title:hover,.mainmenu ul#nav li ul.sub-menu a.mega-title:hover { padding-left: 0px; } @media screen and (min-width:300px) and (max-width:768px) { nav#dropdown{ display: none; } .show-menu-style-mobile{ display: flex; flex-direction: row; justify-content: center;top: 6%; width: 100%; height: 40vh; background: #ddd; left: 0; position: absolute; } .header-mid-content{ padding-top: 0!important; } .header-items-align-mobile{ display: flex; flex-wrap: wrap-reverse; flex-direction: row; justify-content: center; } #btn-menu-trigger { display: block; position: absolute; right: 10px; top: 5px; padding: 0px 7px; line-height: 2px; height: 32px; } #btn-menu-trigger i.fa::before{ margin-top: -5px; } } @media screen and (max-width:480px) { .top-link-wrap .single-link>div.social-icons-container{display: none;} } @media screen and (min-width:768px) and (max-width:1920px) { #btn-menu-trigger{display: none;} #text-search, #text-search-blog{ width: 0%; padding: 0; height: 0; } #btn-search-category{left: 0; border-radius: 50%; width: 40px;} #btn-search-category i { padding: 0 6px 0; } .pulse.animated{ left: 0%!important; top: 0px!important; border-radius: 0!important; transition: border-radius .1s ease-in-out; } #text-search.fullWidthAnimated{ width: 100%; height: 40px; padding-left: 10px; margin-left: 40px; transition: width 1s ease-out, margin-left .99s ease-in-out; } } /*--------------------- 3.3. Sticky Menu ----------------------*/ .sticky { animation: 500ms ease-in-out 0s normal none 1 running fadeInDown; background: rgba(31, 35, 46, 0.95) none repeat scroll 0 0; box-shadow: 0 8px 6px -8px rgb(85, 85, 85, 0.2); left: 0; margin: auto; position: fixed; top: 0; width: 100%; z-index: 9999; } #sticker .mainmenu > .nav-menu > ul > li > a { color: #fff; } .mainmenu-area #sticker.sticky .mainmenu ul#nav > li > a { color: #fff; } /*----------------------- 3.4 Mobile menu ------------------------*/ .mean-container .mean-nav ul li a.mean-expand { line-height: 25px; } .mean-container .mean-nav ul li:hover { background: #fff none repeat scroll 0 0; } .mean-container .mean-bar { background: #1c1c1c none repeat scroll 0 0; } .mean-container .mean-bar::after { content: "Menu"; top: 7px; left: 12px; } .mean-container a.meanmenu-reveal { padding: 9px 13px 11px; } .mobile-menu-area { background: #e6e6e6 none repeat scroll 0 0; padding: 30px 0; } .mean-container .mean-nav ul li a.mean-expand { height: 28px; width: 30px; } /*------------------- 4. Slider-area --------------------*/ /*-------------------- Home-1-slider ---------------------*/ .home-1 .slider-content { color: #fff; padding: 150px 0; display: block; } .home-1 .layer-1-1 .title1 { color: #fff; font-size: 60px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; text-align: center; margin: 0; } .home-1 .layer-1-2 .title2 { text-align: center; font-size: 18px; text-transform: uppercase; margin-bottom: 10px; } .home-1 .layer-1-3 p.title3 { color: #fff; font-size: 18px; font-weight: 500; margin: 30px 0 0; text-transform: capitalize; word-spacing: 1px; background: #000; padding: 10px 30px; display: inline-block; text-align: center; margin-right: 32%; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .home-1 .layer-1-3 p.title3:hover { background: #57ae10; } .home-1 .layer-2-3 p.title3:hover { background: #000; border-radius: 30px; } .home-1 .layer-2-3 p.title3 { margin: 30px 0px 0 0px; background: #57ae10; padding: 10px 30px; text-align: center; margin-left: 34%; } .home-1 .layer-2-4 a.shop-n, .home-1 .layer-1-4 a.shop-n { background: #fff none repeat scroll 0 0; color: #1b1b1b; display: inline-block; font-size: 15px; font-weight: 500; line-height: 40px; margin: 3% 43% 0 0px; padding: 0 20px; text-transform: uppercase; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .home-1 .layer-2-4 a.shop-n { margin: 3% 0px 0 46%; } a.shop-n.saleup-button:hover,.home-1 .layer-2-4 a.shop-n:hover, .home-1 .layer-1-4 a.shop-n:hover { background-color: #57ae10; color: #fff; } /*-------------------- Home-2-slider ---------------------*/ .home-2 .slider-content { padding: 118px 0; } .home-2 .layer-2-3 p.title3 { margin-left: 28%; } .home-2 .layer-2-4 a.shop-n { margin: 3% 0px 0 45%; } .home-2 .layer-1-3 p.title3 { margin-right: 26%; } .home-2 .layer-1-4 a.shop-n { margin: 3% 41% 0 0px; } /*-------------------- Home-4-slider ---------------------*/ .home-4 .slider-content { float: left; padding: 140px 0 140px 50px; } .home-4 .slider-content .layer-1-2 .title2 { text-align: left; color: #ff9e21; font-size: 22px; font-weight: bold; } .home-4 .slider-content.content-1 .layer-1-2 .title2 { color: #fff; } .home-4 .layer-1-1 .title1 { font-size: 70px; } .home-4 .slider-content span.h-color { color: #ff9e21; } .home-4 .layer-1-3 p.title3 { background: #ff9e21; font-size: 22px; text-transform: uppercase; } .home-4 .layer-2-3 p.title3:hover,.home-4 .layer-1-3 p.title3:hover { background: #000; border-radius: 0px; } .home-4 .layer-2-4 a.shop-n:hover, .home-4 .layer-1-4 a.shop-n:hover { background-color: #ff9e21; color: #fff; border-radius: 0px; } .home-4 .layer-2-3 p.title3 { margin-left: 0%; } .home-4 .layer-2-4 a.shop-n,.home-4 .layer-1-4 a.shop-n { margin: 6% 0px 0 0%; } /*-------------------- Home-5-slider ---------------------*/ .home-5 .slider-content { float: left; padding: 140px 0 140px 70px; } .home-5 .slider-content .layer-1-2 .title2 { color: #000; font-size: 20px; } .home-5 .slider-content.content-1 .layer-1-2 .title2 { color: #000; } .home-5 .layer-1-1 .title1 { font-size: 50px; color: #e25d5d; letter-spacing: 0.2px; } .home-4 .slider-content span.h-color { color: #ff9e21; } .home-4 .layer-2-4 a.shop-n{ margin: 6% 0px 0 0%; } .home-4 .layer-1-4 a.shop-n { margin: 4% 0px 0 0%; } .home-5 .layer-2-4 a.shop-n, .home-5 .layer-1-4 a.shop-n { background: #ff9e21 none repeat scroll 0 0; } .home-5 .layer-2-4 a.shop-n:hover, .home-5 .layer-1-4 a.shop-n:hover { background-color: #111; } .service-area.home-5 { margin-top: 70px; background: #ddded8; padding: 0px; } .service-area.home-5 .service-border:last-child { border-right: 0px; } .home-5 .service .service-border .icon { background: #57ae10; padding: 25px; } .home-5 .service .service-border .icon.two { background: #38B0FC; } .home-5 .service .service-border .icon.three { background: #EA6060; } .home-5 .service .service-border .info { margin-top: 17px; } /*-------------------- 5. Welcome-area ---------------------*/ .padding-t { padding: 80px 0 0; } .welcome-content { text-transform: uppercase; } .welcome-area { } .welcome-area h4 { font-weight: 700; margin-bottom: 25px; } .welcome-area h1 { font-weight: bold; color: #222; } .welcome-area img { margin-bottom: 15px; } .welcome-area p { text-transform: capitalize; line-height: 20px; font-size: 15px; } .welcome-area .top-social-icon { margin-top: 22px; } .welcome-area li { display: inline-block; margin-left: 5px; height: 40px; width: 40px; background: #222; border-radius: 100%; opacity: 0.45; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .welcome-area li:hover { opacity: 1; border-radius:0%; } .welcome-area li:hover a { color: #d58585; } .welcome-area li a { line-height: 40px; text-align: center; font-size: 17px; font-weight: 600; color: #fff; } .welcome-area .facebook { } .welcome-area .twitter { } .welcome-area .youtube { } .welcome-aree .dribble { } .welcome-area .instagram { } /*------------------ 6. Banner-area --------------------*/ .banner-area { position: relative; overflow: hidden; } .single-banner.banner-m-b { margin-bottom: 30px; } .single-banner a img { display: block; -webkit-transition: all 0.4s ease-out 0s; transition: all 0.4s ease-out 0s; } .single-banner a { display: block; float: left; overflow: hidden; padding: 0; position: relative; text-align: center; width: 100%; } .single-banner { position: relative; overflow: hidden; } .single-banner:hover a img { opacity: 0.6; } .single-banner span:before { background: rgba(0, 0, 0, 0.3) none repeat scroll 0 0; content: ""; opacity: 0; position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 2; display: block; overflow: hidden; transition: opacity 0.35s ease 0s, transform 0.35s ease 0s; } .single-banner:hover span:before { opacity: 1; } .single-banner a::before { border-bottom: 1px solid #fff; border-top: 1px solid #fff; bottom: 30px; content: ""; left: 10px; opacity: 0; position: absolute; right: 10px; top: 30px; transform: scale(0, 1); transform-origin: 0 0 0; transition: opacity 0.35s ease 0s, transform 0.35s ease 0s; z-index: 5; } .single-banner a::after { border-left: 1px solid #fff; border-right: 1px solid #fff; bottom: 10px; content: ""; left: 30px; opacity: 0; position: absolute; right: 30px; top: 10px; z-index: 2; transform: scale(1, 0); transform-origin: 100% 0 0; transition: opacity 0.35s ease 0s, transform 0.25s ease 0s; } .single-banner a:hover:before, .single-banner a:hover:after { opacity: 1; transform: scale(1); } /*----------------------------- 7. Featured-product-wrap -------------------------------*/ .section-heading { font-weight: bold; margin: 0 0 10px; position: relative; text-align: center; } .section-heading h3 { background: #fff none repeat scroll 0 0; display: inline-block; font-size: 27px; color: 000; font-weight: bold; padding: 0 15px; position: relative; text-transform: uppercase; width: auto; z-index: 1; margin-bottom:0; word-spacing: 8px; letter-spacing: 1px; line-height: 24px; } .h-color { color: #57ae10; } .features-tab .nav-tabs { border-bottom: 0 none; text-align: center; margin-bottom: 35px; } .features-tab .nav-tabs > li { float: none; margin-bottom: 0; display: inline-block; } .features-tab .nav-tabs > li > a { border: 0; border-radius: 0; line-height: 1.42857; position: relative; } .features-tab .nav-tabs > li > a:after { border: 0; position: absolute; top: 5px; left: -6px; content: ""; height: 30px; width: 1px; background: #57ae10; transform: rotate(30deg); } .features-tab .nav-tabs > li:nth-child(1) a:after { display: none; } .features-tab .nav-tabs > li > a { border: 0 none; border-radius: 0; color: #000; font-size: 14px; font-weight: 500; line-height: 1.42857; margin: 0 5px; text-transform: uppercase; } .features-tab .nav > li > a:focus,.features-tab .nav > li > a:hover { background-color: inherit; text-decoration: none; color: #57ae10; } .features-tab .nav-tabs > li.active > a,.features-tab .nav-tabs > li.active > a:focus,.features-tab .nav-tabs > li.active > a:hover { border: medium none; color: #57ae10; font-weight: bold; } .product-img-wrap {position: relative; overflow: hidden; } .sold-text { background: #57ae10 none repeat scroll 0 0; border-radius: 100%; color: #fff; font-size: 21px; font-weight: 500; height: 100px; left: 0; line-height: 24px; margin: 0 auto; padding: 26px 0 0; position: absolute; right: 0; text-align: center; text-transform: uppercase; top: 118px; width: 100px; z-index: 999; } .product-single-wrap.sold-out { opacity: 0.45 !important; } .single-product:hover .image a img, .shop-by-category .shop-by-content:hover img { opacity: 0.3; transform: scale(1.3); -webkit-transform: scale(1.3); } .single-product .image a img,.shop-by-content img { transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; } .single-product .image{ position: relative; overflow: hidden; } /*Start-product-css*/ .product-single-wrap { min-height: 458px; position: relative; } .product-single-wrap.hover:hover .single-product { background-color: #fff; box-shadow: 0 3px 4px 0 #cacaca; min-height: 456px; position: absolute; width: 100%; z-index: 999; } .product-single-wrap.hover { position: relative; } .product-single-wrap { background-color: #fff; border: 1px solid #e8e8e8; position: relative; } .red.ribbon::after { border-bottom-color: #e03d3d; } .ribbon::after { border-right: 14px solid transparent; border-top-style: transparent; border-bottom: 15px solid #57ae10; border-bottom-width: 25px; content: ""; display: inline-block; left: 0; min-width: 70px; position: absolute; top: 1px; width: 100%; } .product-single-wrap .ribbon { position: absolute; } .ribbon { font-size: 11px; font-weight: 700; line-height: 20px; padding: 4px 14px; top: 10px; z-index: 100; } .ribbon,.brand { text-transform: uppercase; } .ribbon span { margin-right: 11px; position: relative; z-index: 100; } .red, .green { color: #fff; letter-spacing: 0.5px; } #products-tab .image { min-height: 215px; } .product-single-wrap .image { text-align: center; } .product-single-wrap .image { text-align: center; } .product-single-wrap .single-content { border-bottom: 1px solid #d9d9d9; margin: 0 25px; min-height: 105px; padding-top: 12px; } .single-content .title { line-height: 18px; margin: 7px 0 0; } .product-single-wrap .single-content .title a { color: #105fbc; font-weight: bold; font-size: 17px; } .product-single-wrap .single-content .title a:hover, .product-single-wrap .single-content .brand:hover { color: #57ae10; } .product-single-wrap .single-content .brand { color: #353535; font-size: 11px; line-height: 15px; font-weight: bold; } .product-single-wrap .prices { margin: 0 25px; padding: 11px 0; } .product-single-wrap .price-prev { color: #5a5956; display: inline-block; font-size: 14px; font-weight: bold; text-decoration: line-through; } .product-single-wrap .present-price { color: #57ae10; font-size: 17px; font-weight: 600; } .product-single-wrap.hover .single-product .hover-area { bottom: 11px; text-align: center; width: 100%; } .product-single-wrap.hover .single-product .hover-area .add-cart-button { margin-bottom: 10px; } .product-single-wrap.hover .single-product .hover-area { position: relative; } .product-single-wrap.hover .single-product .hover-area .add-cart-button { text-align: center; position: absolute; /* right: 25%; */ bottom: 120px; left: 0; right: 0; margin: 0 auto; opacity: 0; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; z-index: 99999999999999999; display: inline-block; } .product-single-wrap.hover .single-product .hover-area .product-link { text-align: center; position: absolute; left: 0; top: -250px; right: 0; margin: 0 auto; opacity: 0; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; z-index: 99; } .product-single-wrap.hover:hover .hover-area .product-link { opacity: 1; top: -191px; } .product-single-wrap.hover:hover .hover-area .add-cart-button { opacity: 1; bottom: 215px; } .product-single-wrap.hover .single-product .hover-area .add-cart-button a { padding: 8px 20px; position: relative; z-index: 10; } .add-cart-button a { border: medium none; border-radius: 4px; color: #fff; display: inline-block; font-size: 15px; font-weight: bold; line-height: 20px; padding: 10px 20px; transition: all 0.3s ease 0s; background-color: #57ae10; text-transform: capitalize; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .add-cart-button a:hover { color: #57ae10; background-color: #000; } .b-add-to-compare::before, .b-add-to-wishlist::before , .b-add-to-eye::before { color: #57ae10; font-size: 18px; margin: 0 5px 0 0; transition: all 0.3s ease 0s; } .btn-add-to-compare, .btn-add-to-wishlist, .btn-add-to-eye { color: #3d3d3d; font-size: 12px; line-height: 24px; } .single-product .hover-area .product-link a { margin: 0 1px; font-size: 14px; color: #fff; } /*ribbon css*/ .green.ribbon::after { border-bottom-color: #57ae10; } .ribbon:nth-child(2) { margin-top: 30px; } .b-add-to-wishlist::before { content: "\f004 "; font-family: fontawesome; font-size: 12px; } .b-add-to-eye::before { content: "\f06e"; font-family: fontawesome; font-size: 12px; } .b-add-to-compare::before { content: " \f074 "; font-family: fontawesome; font-size: 12px; } .pro-rating ul li { display: inline-block; text-align: center; color: #ffbb00; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .pro-rating ul li:hover, .pro-rating ul li.r-grey:hover { color: #57ae10; } .pro-rating ul li.r-grey { color: #d1d1d1; } .product-link { padding: 7px 0px; transition: all 0.3s ease-out 0s; background: #000; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .product-link:hover { background: #4b980e; } .product-link:hover .b-add-to-eye::before,.product-link:hover .b-add-to-wishlist::before,.product-link:hover .b-add-to-compare::before { color: #fff !important; } .product-link a:hover { color: #000 !important; } .brands-carousel .col-md-2,.featured-carousel .col-lg-3,.newarrival-carousel .col-lg-6,.blog-carousel .col-lg-4,.sing-sidebar-caro-latest .col-md-4 {width:100%} .owl-theme .owl-controls .owl-buttons div { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; background: #57ae10; border-radius: 0; color: #fff; display: inline-block; font-size: 22px; height: 60px; left: 15px; margin: 0; padding: 0; position: absolute; text-align: center; top: 50%; width: 30px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; margin-top: -25px; line-height: 61px; z-index: 33; visibility: hidden; opacity: 0; margin-left: 30px; } .owl-theme .owl-controls .owl-buttons div.owl-next { left:auto; right: 14px; margin-right: 30px; } .indicator:hover.owl-theme .owl-controls .owl-buttons div { opacity:1; visibility:visible; z-index: 9; margin-left: 0px; } .indicator:hover.owl-theme .owl-controls .owl-buttons div.owl-next { margin-right: 0px !important; } .owl-theme .owl-controls .owl-buttons div.owl-prev i,.owl-theme .owl-controls .owl-buttons div.owl-next i { padding: 5px 0 0; display: inline-block; font-size: 25px; font-weight: bold; } .indicator.owl-theme .owl-controls .owl-buttons div:hover { background: #000; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; color: #57ae10; } .owl-theme .owl-controls { margin-top: 0; text-align: center; } .page-1 .featured-product-wrap.padding-t.padding-dis { padding-bottom: 42px; } /*countdown*/ .upcoming-product.featured-count { background: #57ae10 none repeat scroll 0 0; top: 140px; position: absolute; width: 100%; z-index: 999; } .upcoming-product .cdown { position: relative; text-align:center; text-transform: uppercase; width:25%; float:left; color:#fff; padding: 5px 0; line-height: 22px; } .upcoming-product { position: absolute; left: 0; width: 100%; z-index: 999; } .single-product.trend-pro .upcoming-product { background: #ffbb00 none repeat scroll 0 0; display: inline-block; width: 248px; margin-left: 22px; } .upcoming-product .cdown:after { content: ""; position: absolute; border-right: 1px solid #fff; height: 70%; width: 100%; right: 0; top: 15%; } .upcoming-product .cdown:last-child:after { border-right: 0px; } .upcoming-product .cdown p { margin: 0; font-size: 12px; font-weight: 500; } .upcoming-product .cdown .time-count { font-size: 20px; font-weight: 500; } /*--------------------------- 8. Latest-trend-wrap ----------------------------*/ .latest-trend-wrap.padding-t { margin: 55px 0 0; } .latest-trend-wrap { background: rgba(0, 0, 0, 0) url("../public/images/trend/bg.jpg") no-repeat fixed left center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: relative; height: 700px; padding: 50px 0 0; } .trend-content { padding: 130px 0; position: relative; text-align: right; z-index: 4; display: inline-block; } .trend-content h3 { color: #fff; font-size: 30px; text-transform: uppercase; font-weight: 700; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .trend-content h1 { color: #fff; font-size: 80px; font-weight: 700; text-transform: uppercase; padding: 20px 0; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .trend-content h1:hover,.trend-content h3:hover { color: #57ae10; } .trend-content p { color: #fff; font-size: 40px; font-weight: 500; text-transform: capitalize; padding: 0 0 50px; letter-spacing: 2px; } .trend-content a { background: #57ae10; border: 2px solid #57ae10; color: #fff; font-size: 14px; font-weight: 600; padding: 7px 30px; text-transform: uppercase; margin-right: 20px; display: inline-block; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; letter-spacing: 0.5px; } .trend-content a:hover { background: none; color: #000; border: 2px solid #fff; } /*------------------------------- 9. Latest-products-wrap ---------------------------------*/ .latest-content{ padding: 0 0 30px; } p.heading-pra { font-size: 15px; font-weight: 400; letter-spacing: 0.5px; padding: 0 250px; margin: 0; line-height: 22px; color: #222; } .section-heading p img { padding: 10px 0 2px 0; } /*----------------------------------- 10. Latest-testimonials-wrap -------------------------------------*/ .main-testimonial { background: rgba(0, 0, 0, 0) url("../public/images/testimonial/bg.jpg") no-repeat fixed center center / cover; position: relative; overflow: hidden; height: auto; padding: 130px 0; width: 100%; z-index: 99; } .main-testimonial:after { background: rgba(0, 0, 0, 0.7); height: 100%; width: 100%; position: absolute; content: ""; left: 0; top: 0; } .latest-testimonial-wrap .testimonial-heading { padding: 0px 0 30px; } .single-testimonial { display: block; text-align: center; color: #fff; } .testimonial-carousel.indicator.owl-carousel.owl-theme,.testimonial-carousel-two.indicator.owl-carousel.owl-theme { position: relative; z-index: 99; overflow: hidden; width: 100%; } .testimonial-carousel.owl-theme .owl-controls .owl-buttons div { left: 7px; } .testimonial-carousel.owl-theme .owl-controls .owl-buttons div.owl-next,.testimonial-carousel-two.owl-theme .owl-controls .owl-buttons div.owl-next { left:auto; right: 7px; margin-right: -50px; } .testimonial-img img { border-radius: 100%; height: 120px; width: 120px; } .testimonial-img { position: relative; } .testimonial-img:after { content: ''; width: 0; height: 0; border-top: 1px solid #555; border-bottom: 16px solid transparent; border-left: 18px solid #555; position: absolute; left: 46%; bottom: -6px; opacity: .9; transform: rotate(30deg); -webkit-transform: rotate(30deg); } .testimonial-carousel-two .testimonial-img:after { display: none; } .testimonial-des > p { font-size: 15px; padding: 0 150px; } .testimonial-author h5 { color: #fff; font-size: 22px; font-weight: 600; } /*------------------------------- 11. Shop-by-Category --------------------------------*/ .shop-by-category { position: relative; overflow: hidden; } .shop-by-category .section-heading { margin-bottom: 40px; } .shop-by-category .shop-by-content h4 { position: absolute; right: 25px; bottom: -5px; margin: 0 auto; color: #222; font-size: 15px; background: #fff; padding: 10px 20px; text-transform: uppercase; font-weight: 600; letter-spacing: 0.5px; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .shop-by-category .shop-by-content h4:hover { background: #57ae10; color: #fff; } .shop-by-content { position: relative; overflow: hidden; } /*--------------------------- 12. New-Trending ----------------------------*/ /*--------------------------- 13. Brand-area ----------------------------*/ .brand-area { background: url("../public/images/about/aboutUs_bcg.jpg") no-repeat fixed center center / cover; padding: 80px 0; } .single-brand a { background: #f2f2f2; display: inline-block; padding: 6px; transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; box-shadow: 0 0 10px rgba(0,0,0,.25); text-align: center; width: 100%; } .single-brand a:hover img { -webkit-animation-name: zoomIn; -webkit-transform-origin: center; animation-duration: .4s; animation-timing-function: linear; } .single-brand a img { background: #fff; padding: 8px 0; } /*------------------------------- 14. latest-blog-wrap ---------------------------------*/ .post-date, .comment, .likes { font-size: 14px; padding: 0 15px 0 0; } .post-date i, .comment i, .likes i, .share i { color: #57ae10; margin-right: 3px; } .single-blog { position: relative; overflow: hidden; } .single-blog:hover a > img { opacity: 0.6; -webkit-transform: scale(1.3); transform: scale(1.3); } .blog-img a img { -webkit-transition: all 0.4s ease-in-out 0s; transition: all 0.4s ease-in-out 0s; } .blog-img > a { display: block; width: 100%; overflow: hidden; } .blog-heading { padding: 0 0 30px; } .blog-img {position: relative; } .blog-up-text { background: #fff none repeat scroll 0 0; color: #000; display: inline-block; font-size: 14px; left: 20px; padding: 8px 25px; position: absolute; text-align: center; top: 0; word-spacing: 3px; } .blog-up-text .date { font-size: 20px; font-weight: 600; line-height: 20px; color: #57ae10; } .blog-up-text .month { font-size: 15px; font-weight: 500; line-height: 20px; letter-spacing: 1px; } .blog-title h4 { font-size: 19px; font-weight: 600; padding: 30px 0 0; text-transform: capitalize; } .post-date { font-size: 14px; padding: 0 10px 0 0; } .post-date i { margin-right: 5px; } .comment, .comment a { font-size: 14px; color: #333; font-weight: 500; letter-spacing: 1px; } .comment i { font-size: 14px; font-weight: 600; } .post-time > p { line-height: 22px; padding: 10px 0 0; font-size: 15px; } .blog-button a.blog-readmore { font-size: 14px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; color: #57ae10; } .blog-button a.blog-readmore i { font-size: 16px; font-weight: 500; } .blog-button a.blog-readmore:hover,.comment:hover,.comment a:hover { color: #000; } /*---------------------- 15. Instagram -----------------------*/ .instagram-area { position: relative; overflow: hidden; } .instafeed a:after { content: ""; display: block; z-index: 1; left: 0; top: 0; height: 100%; width: 100%; position: absolute; opacity: 0; background-color: rgba(87, 174, 16, 0.7); -webkit-transition: all 300ms linear 0s; -moz-transition: all 300ms linear 0s; -ms-transition: all 300ms linear 0s; transition: all 300ms linear 0s; } .instafeed a:before { position: absolute; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-family: FontAwesome; display: block; top: 50%; width: 100%; text-align: center; content: "\f101"; font-size: 22px; color: #fff; opacity: 0; z-index: 7; } .instafeed a { display: block; position: relative; overflow: hidden; float: left; width: 18.75%; margin-left: 1.5%; height: auto; text-decoration: none; -webkit-transition: all 300ms linear 0s; -moz-transition: all 300ms linear 0s; -ms-transition: all 300ms linear 0s; -o-transition: all 300ms linear 0s; transition: all 300ms linear 0s; } .instafeed a:hover:before { opacity: 1; } .instafeed a:nth-child(1) { margin-left: 0px; } .instafeed a:hover:after { opacity: 0.88; } .instafeed img { display: block; width: 100%; } .instafeed_ref a:before { position: absolute; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-family: FontAwesome; display: block; top: 50%; width: 100%; text-align: center; content: "\f101"; font-size: 22px; color: #fff; opacity: 0; z-index: 7; display: none; } .instafeed_ref a { display: block; position: relative; overflow: hidden; float: left; width: 14.75%; margin-left: 1.5%; height: 23vh; text-decoration: none; -webkit-transition: all 300ms linear 0s; -moz-transition: all 300ms linear 0s; -ms-transition: all 300ms linear 0s; -o-transition: all 300ms linear 0s; transition: all 300ms linear 0s; display: flex!important; justify-content: center!important; align-items: center!important; } @media screen and (min-width:1024px) and (max-width:1920px){ .flex_center_section{ display: flex; -moz-box-pack: center; justify-content: flex-end; -moz-box-align: center; align-items: center; position: absolute; right: 0; width: 22%; flex-direction: column; top: 29%; } } @media screen and (min-width:240px) and (max-width:780px){ .instafeed_ref a{ width: 100%; } .instafeed_ref{ display: flex; } .video-text strong span{ font-size: 16px; left: 0; position: absolute; top: 0; width: 100%; } .about-text > h2{ display: none; } .about-text > h2::before{ content: 'biz kimiz ? '; } .aboutUs-svgFrame{ width: 60%!important; } .ab-us .video-text{ left: 14%!important; } .top-banner-area { padding: 30px 0!important; } .video-text{ top:31%!important; } .signle-heading.about-us{ display: none; } .container_passive{ margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; width: 100%!important; } .padd_xs{ padding: 10px 22px; text-align: center; } .about-text > h2 { margin: 0 0 20px; font-size: 16px; border-bottom: 1px solid #cbcbcb; padding-bottom: 8px; } } .instafeed_ref a:hover:before { opacity: 1; } .instafeed_ref a:nth-child(1) { margin-left: 0px; } .instafeed_ref a:hover:after { opacity: 0.88; } .instafeed_ref img { display: block; width: 100%; } .btn_continue { box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: transparent; border: 2px solid #e74c3c; border-radius: 0.6em; color: #e74c3c; cursor: pointer; display: flex; align-self: center; font-size: 1rem; font-weight: 400; line-height: 1; margin: 20px; padding: 1.2em 2.8em; text-decoration: none; text-align: center; text-transform: uppercase; font-family: "Montserrat", sans-serif; font-weight: 700; } .btn_continue:hover { color: #fff; outline: 0; } .btn_continue:focus{ color: darkred; outline: 0; } .btn_continue:focus:hover{ color: #fff; } .first { transition: box-shadow 300ms ease-in-out, color 300ms ease-in-out; } .first:hover { box-shadow: 0 0 40px 40px #e74c3c inset; } .trans_detail { visibility: hidden; opacity: 0; transition: visibility 0s, opacity 0.5s linear; } @media only screen and (min-width:1024px){ .mb_20_lg{ margin-bottom: 20%; } .line-frame{ height: 5px; background: -moz-linear-gradient(top, transparent 2px, #e74c3c 2px, #bb4c41 3px, transparent 3px); background: linear-gradient(to bottom, transparent 2px, #e74c3c 2px, #bb4c41 3px, transparent 3px); display: flex; flex: .3; } } .section-heading.brend_title_frame h3{ background: #E6E6E6; } @media only screen and (min-width:240px) and (max-width:1024px){ .instafeed_ref a, #instafeed_cont a { height: 10vh; width: 15vw; } #instafeed_cont{ display: inline-block; } .mb_20_lg{ margin-bottom: 20%; } .line-frame{ display: none; } } .flex-center{display: flex; justify-content: center; align-items: center;} /*-------------------------------- 16. Various-Product-Wrap ---------------------------------*/ .product-list-area { background: url(../public/images/bg/list.png); background-repeat: repeat; background-size: inherit; box-shadow: 0 0 10px rgba(0, 0, 0, 0.09); position: relative; padding: 80px 0; overflow: hidden; margin: 80px 0 0; } .single-list .media { clear: both; margin-top: 35px; } .single-list .media-link img { -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .media-link:hover img { transform: scale(1.3); -webkit-transform: scale(1.3); } .btn-more { background-color: rgba(0, 0, 0, 0); } .btn.btn-more { float: right; font-size: 11px; padding: 12px 15px; margin-top: -10px; margin-left: 20px; margin-bottom: -30px; background-color: transparent; border-width: 3px; border-color: #dedede; color: #333; font-weight: 600; line-height: 1; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; letter-spacing: 1px; border-radius: 0; } .btn-more:hover { border-color: #222; color: #fff; background: #222; } .list-title { margin-top: 0; font-size: 19px; font-weight: bold; line-height: 20px; text-transform: uppercase; color: #222; overflow: hidden; } .list-title span { display: inline-block; position: relative; } .list-title span:after { content: ""; position: absolute; height: 1px; width: 2000px; background-color: #a5abb7; top: 10px; margin-left: 15px; left: 100%; } .single-list .media { clear: both; } .single-list .media-link { padding: 0; margin-right: 20px; display: inline-block; position: relative; overflow: hidden; text-align: center; width: 75px; } .single-list .media-body { min-height: 82px; } .single-list .media-heading { font-size: 19px; font-weight: 400; color: #222; } .single-list .media-heading a { color: #222; } .single-list .media-heading a:hover { color: #57ae10; } .single-list .price { font-size: 16px; font-weight: bold; line-height: 1.3; } .single-list .price ins { color: #57ae10; text-decoration: none; } .single-list .price del { font-weight: normal; font-size: 14px; color: #232323; padding-right: 5px; } /*----------------- 17. Footer -------------------*/ .footer-top-area { background: rgba(0, 0, 0, 0) linear-gradient(90deg, #1f1e1e 50%, #151515 50%) repeat scroll 0 0; padding: 50px 0; } .footer-logo {margin: 0 0px 10px 0; } .footer-area .widget { margin-bottom: 0px; } .footer-top-content p.des { color: #fff; font-size: 14px; font-weight: 400; line-height: 22px; padding-top: 10px; margin: 0 0 5px; } .footer-read-more a { display: inline-block; font-size: 15px; font-weight: 600; letter-spacing: 1px; margin-top: 4px; text-transform: capitalize; color: #57ae10; } .footer-read-more a:hover { text-decoration: underline; color: #fff; } .footer-read-more span i { padding-left: 7px; display: inline-block; color: #fff; } .social-icon h4 { display: block; color: #fff; font-weight: 700; margin: 15px 0 0; padding: 15px 0 0; font-size: 20px; border-top: 1px solid #999; } .social-icon a { border: 1px solid #fff; color: #fff; display: inline-block; font-size: 16px; height: 35px; line-height: 35px; margin: 20px 10px 0 0; text-align: center; width: 35px; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .social-icon a:hover { border-radius: 100%; } h3.wedget-title { font-weight: 600; margin-bottom: 10px; display: block; color: #fff; font-size: 19px; line-height: 60px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .footer-account-area ul li a { display: block; font-size: 14px; text-transform: capitalize; line-height: 34px; color: #fff; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } h3.wedget-title:hover,.footer-account-area ul li a:hover { color: #57ae10; } .footer-account-area ul li a:hover { padding-left: 8px; } .copy-right { color: #fff; font-size: 14px; line-height: 32px; } .copy-right a {color: #57ae10;} .copy-right a:hover { text-decoration: underline; } .payment-area { padding-top: 5px; } .payment-area ul li { display: inline-block; padding-left: 5px; } .footer-contact { background: url("../public/images/footer/bg.png") no-repeat scroll center center; } .footer-contact p { margin-bottom: 13px; padding-bottom: 13px; border-bottom: 1px solid #999; text-transform: capitalize; } .payment-area ul li a img { width: 45px; } .footer-contact:last-child p.web { border: medium none; margin: 0; padding: 0; } .footer-contact p { clear: both; color: #fff; overflow: hidden; font-size: 14px; font-weight: normal; line-height: 22px; } .ft-content.web-site a { color: #fff; } label { display: inline-block; font-weight: bold; max-width: 100%; } .footer-contact label { color: #d4d4d4; float: left; font-size: 20px; font-weight: normal; margin-right: 10px; min-width: 30px; text-transform: capitalize; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .footer-contact label i:hover { color: #57ae10; } .social-icon a.faceb { background: #3e61be; border: 1px solid #3e61be; } .social-icon a.twitt { background: #2AA6F2; border: 1px solid #2AA6F2; } .social-icon a.youtube { background: #CF2200; border: 1px solid #CF2200; } .social-icon a.google { background: #4285F4; border: 1px solid #4285F4; } .social-icon a.dribb { background: #E84C88; border: 1px solid #E46092; } .footer-newsletter { background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0; margin: 45px auto; padding: 25px 20px; text-align: center; } .footer-newsletter:hover h4 { color: #57ae10; } .footer-newsletter h4 { color: #ffffff; display: inline-block; line-height: 40px; margin-bottom: 0; margin-right: 15px; vertical-align: middle; font-size: 23px; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .footer-newslettr-inner { display: inline-block; } form { position: relative; } .footer-newslettr-inner input { border: 1px solid #ffffff; min-width: 320px; } input.fancy { border-radius: 50px 0 0 50px; vertical-align: middle; display: inline-block; } input.input-md, .input-md { padding-top: 15px; padding-bottom: 16px; } .btn.fancy { border-radius: 0 50px 49px 0; margin-left: -5px; display: inline-block; font-size: 14px; font-weight: 500; letter-spacing: 1px; } .btn-color { background-color: #57ae10; border-color: transparent; color: #fff !important; } .btn-color:hover { background-color: #333; } .btn-md { padding: 16px 35px !important; display: inline-block; } .btn { font-size: 14px; line-height: 1; font-weight: 400; text-decoration: none !important; text-transform: uppercase; text-align: center; outline: none; border-width: 1px; border-style: solid; display: inline-block; vertical-align: middle; transition: all 0.3s ease 0s !important; -moz-transition: all 0.3s ease 0s !important; -webkit-transition: all 0.3s ease 0s !important; -o-transition: all 0.3s ease 0s !important; border-radius: 50px; -moz-border-radius: 50px; -webkit-border-radius: 50px; } input[type="text"] { appearance: none; -webkit-appearance: none; border: 1px solid rgba(0, 0, 0, 0.10); background: #fff; color: #333; outline: none; font-weight: 400; font-size: 13px; padding-left: 25px; padding-right: 23px; transition: all 0.2s cubic-bezier(0, 0, 0.58, 1) 0s; -moz-transition: all 0.2s cubic-bezier(0, 0, 0.58, 1) 0s; -webkit-transition: all 0.2s cubic-bezier(0, 0, 0.58, 1) 0s; -o-transition: all 0.2s cubic-bezier(0, 0, 0.58, 1) 0s; display: inline-block; text-transform: none; line-height: 1; vertical-align: middle; } /*------------------ 18. Home-2 --------------------*/ .header-search-box.home-2 { margin-top: 15px; } .slider-area.home-2 { padding: 25px 0 0 0; } .my-account-h2 .dropdown-menu { min-width: 130px; } .single-link .my-account-h2 > a:before { content: '\f007'; font-family: FontAwesome; font-size: 11px; padding-right: 6px; } .header-logo.home-2 { text-align: center; margin: 0 0 0px 110px; } .header-mid-wrap.home-2 { background: #fff; } .home-2 #text-search,.home-2 .header-cart-wrap > li > a, .mainmenu-area.home-2 { background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0; } .mainmenu.home-2 ul#nav > li > a { color: #000; } .mainmenu.home-2 ul#nav > li > a:hover { color: #fff; } /* category-section */ .category-main-wrap { position: relative; z-index: 100; } .category-title { color: #000; background-color: rgba(0, 0, 0, 0.1); } .category-title h3 { position: relative; letter-spacing: 1px; margin: 0; font-size: 20px; padding: 13px 20px; font-weight: 700; text-transform: uppercase; } .cat-single-wrap { border-bottom: 1px solid #cfcfcf; border-left: 1px solid #cfcfcf; border-right: 1px solid #cfcfcf; } .cat-single-wrap > .nav > li > a { color: #000; font-size: 14px; font-weight: 500; padding: 10.5px 15px; letter-spacing: 0.5px; background-color: #fff; border-bottom: 1px solid #cfcfcf; text-transform: capitalize; } .cat-single-wrap > .nav > li { position: relative; } .cat-single-wrap > .nav > li > a:before { display: inline-block; margin-right: 10px; font-size: 12px; content: "\f068"; font-family: FontAwesome; } .cat-single-wrap > .nav > li.cat-none > a:after { display: none; } .cat-single-wrap > .nav > li.more-view { display: none; } .cat-single-wrap > .nav > li.view-more > a { border-bottom: 0; } .cat-single-wrap > .nav > li.view-more > a:after { content: "\f0fe"; position: absolute; font-family: FontAwesome; display: inline-block; font-size: 17px; right: 15px; } .cat-single-wrap > .nav > li:hover > a, .cat-single-wrap > .nav > li:focus > a { background-color: #57ae10; color: #fff; } .single-wrap { left: 101%; position: absolute; top: 0; width: 580px; opacity: 0; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; visibility: hidden; -webkit-transform: translateY(50px); transform: translateY(50px); } .cat-single-wrap > .nav > li:hover .single-wrap { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); visibility: visible; } .cat-single-wrap > .nav > li > .single-wrap:before { content: ""; position: absolute; top: 4px; left: -15px; border-bottom: 22px solid transparent; border-top: 22px solid transparent; border-right: 30px solid #fff; -webkit-transition: all 0.4s ease-in-out 0s; transition: all 0.4s ease-in-out 0s; z-index: 999; } .single-wrap.smart-phone { width: 380px; } .single-wrap.tablet { width: 180px; } .cat-wrap { box-shadow: 0 1px 4px rgba(0, 0, 0, .15); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .15); text-align: left; background-color: #fff; padding: 30px; } .cat-wrap h3 { margin-top: 0; margin-bottom: 20px; font-size: 14px; font-weight: 700; text-transform: uppercase; } .cat-wrap .nav > li > a { color: #333; padding: 2px 0; text-transform: uppercase; } .cat-wrap .nav > li > a:hover,.cat-wrap .nav > li > a:focus { background-color: transparent; color: #57ae10; padding-left: 5px; } .box-category { border-bottom: 1px solid #cfcfcf; padding-bottom: 15px; } .box-category:last-child { border-bottom: 0; padding-bottom: 0; } .box-category h3 { color: #404040; font-weight: 600; margin: 0; font-size: 25px; text-transform: capitalize; } .box-category .category-price { color: #57ae10; font-size: 38px; font-weight: 400; line-height: 30px; padding: 12px 0 2px; } .box-category a { text-transform: capitalize; color: #7e7e7e; word-spacing: 2px; text-decoration: underline #d8241f; } .box-category a:hover { color: #57ae10; } .service-area { padding: 25px 0 0; } .service { background: #E5E5E5; padding: 20px } .service .service-border .icon { float: left; font-size: 35px; padding: 7px 0 0 0; transition: all 0.3s ease-out 0; -webkit-transition: all 0.3s ease-out 0; } .service .service-border { border-right: 1px solid #ccc; overflow: hidden; text-align: center; } .service .service-border:nth-child(4) { border-right: 0px solid #ccc; } .service .service-border .info { display: inline-block; text-align: left; } .service .service-border h3 { margin: 0; padding: 0; font-size: 21px; text-transform: uppercase; } .single-service { margin-left: 18px; } .single-service:hover .icon { color: #57ae10; } /*Icon-bar-area*/ .icon-bar { display: inline-block; cursor: pointer; position: absolute; z-index: 99; right: 13px; top: 6px; } .bar1, .bar2, .bar3 { width: 35px; height: 4px; background-color: #333; margin: 6px 0; transition: 0.4s; } .change .bar1 { -webkit-transform: rotate(-45deg) translate(-7px, 6px); transform: rotate(-45deg) translate(-7px, 6px); } .change .bar2 {opacity: 0;} .change .bar3 { -webkit-transform: rotate(45deg) translate(-8px, -8px); transform: rotate(45deg) translate(-8px, -8px); } /*newsletter-area*/ .newsletter-area { background: #1c1c1c; } .footer-bottom-area.home-2 { background: #1c1c1c; padding: 20px 0; } /*-------------------- 19. Home-3 ---------------------*/ .home-3 #text-search { padding: 0 62px 0 20px; } .home-3 #btn-search-category { width: 15%; } .header-search-box.home-3 { width: 70%; margin: 16px 0 0 26%; } .mainmenu-area.home-3 { text-align: center; } .service-area.home-3 { padding: 0px 0 0; background: #dedede; margin-top: 80px; } .service { background: #E5E5E5; padding: 20px } .product-list-area.home-3 { margin: 0px 0 0; } .slider-banner { padding: 25px 0 0 0; } .slider-3.owl-theme .owl-controls .owl-page span { background: #fff none repeat scroll 0 0; border-radius: 100%; display: block; height: 15px; margin: 5px 2px; opacity: 1; text-align: center; width: 15px; border: 0px solid #7b7b7b; outline: 0px solid #000; } .slider-3.owl-theme .owl-controls .owl-page { display: inline-block; } .slider-3.owl-theme .owl-controls .owl-page span::before { border-radius: 0px; height: 0px; width: 0px; } .slider-3.owl-theme .owl-controls .owl-pagination { bottom: 0; right: 4%; margin: 0; position: absolute; padding-bottom: 5px; top: 92%; } .slider-3.owl-theme .owl-controls .owl-page.active span, .slider-3.owl-theme .owl-controls.clickable .owl-page:hover span { background: #57ae10; } .slider-3 { position: relative; } .slide-3-des { position: absolute; bottom: 0; left: -180px; right: 0; top: 0; text-align: center; margin: 0 auto; color: #fff; z-index: 999; margin-top: 251px; } .footer-newsletter.home-3 { background: #e8e8e8; border-radius: 50px; padding: 13px 20px; } .footer-newsletter.home-3 h4 { color: #333; } .footer-newsletter.home-3:hover h4 { color: #57ae10; } .slide-3-des h3 { font-size: 45px; font-weight: bold; text-transform: capitalize; } .slide-3-des h4 { font-size: 20px; font-weight: bold; letter-spacing: 0.5px; } .slide-3-des p { font-size: 18px; text-transform: capitalize; font-weight: 500; letter-spacing: 1px; } .slide-3-des .slide-button { color: #222; font-size: 17px; text-transform: capitalize; font-weight: bold; letter-spacing: 1px; background: #fff; padding: 8px 18px; border: 1px solid #fff; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .slide-3-des .slide-button:hover { color: #fff; background: #57ae10; border: 1px solid #57ae10; } .mainmenu ul#nav li .megamenu.left-mega1 { left: -45px; } .mainmenu ul#nav li .megamenu.left-mega2 { left: -114px; } .mainmenu ul#nav li .megamenu.left-mega3 { left: -68px; } .home-3 .header-logo { margin-top: 7px; } .home-3 .mainmenu ul#nav li .megamenu.pages { left: -87px; } .home-3 .mainmenu nav > ul > li.angle-down > a::after,.home-3 .mainmenu nav > ul > li.angle-down.fixed > a::after { right: 37%; } /*--------------- 20. Home-4 ----------------*/ .home-4 .top-language-wrap .dropdown-menu,.home-4 .top-currency-wrap .dropdown-menu { border-bottom: 3px solid #ff9e21; } .header-search-box.home-4 { width: 60%; float: right; margin-top: 10px; } .home-4 .header-logo > a { margin-top: 0px; } .header-cart-wrap.home-4 { margin: 5px 0; } .home-4 #btn-search-category { background: #ff9e21 none repeat scroll 0 0; } .home-4 .welcome-mg:hover,.home-4 .phone_number span,.home-4 .top-link-wrap div.single-link div a:hover, .home-4 .mainmenu ul#nav li .megamenu span > a:hover,.home-4 .mainmenu ul#nav li .megamenu span a.mega-title:hover,.home-4 .mainmenu ul#nav li ul.sub-menu > li a:hover,.home-4 .cart-product-info .product-name:hover,.home-4 .edit-pro,.home-4 .remove-pro,.home-4 .header-cart-wrap > li:hover > a,.home-4 .header-cart-wrap li:hover a::before { color: #ff9e21 !important; } .home-4 .mainmenu ul#nav > li:nth-child(1),.home-6 .mainmenu ul#nav > li:hover:nth-child(1),.home-4 .mainmenu ul#nav > li:hover,.home-4 .header-cart-wrap > li > a:before,.home-4 .header-cart-wrap .cart-checkout a { background: #ff9e21; } .home-4 .mainmenu ul#nav li .megamenu span > a.mega-title,.home-4 .mainmenu ul#nav li .sub-menu a.mega-title { border-bottom: 4px double #ff9e21; } .home-4 .mainmenu ul#nav li .megamenu,.home-4 .mainmenu ul.sub-menu,.home-4 ul.header-cart-wrap .mini-cart-content { border-top: 2px solid #ff9e21; } .features-tab .nav-tabs.home-4 > li.active > a,.features-tab .nav-tabs.home-4 > li.active > a:focus,.features-tab .nav-tabs.home-4 > li.active > a:hover,.home-4 .features-tab .nav > li > a:hover { color: #ff9e21; } .features-tab .nav-tabs.home-4 > li > a:after { background: #ff9e21; } .home-4 .upcoming-product.featured-count { background: #ff9e21 none repeat scroll 0 0; } .home-4 .sold-text { background: #ff9e21 none repeat scroll 0 0; } .home-4 .product-link:hover { background: #f0951f; } .home-4 .add-cart-button a { background-color: #ff9e21; } .home-4 .add-cart-button a:hover { color: #111; } .home-4 .owl-theme .owl-controls .owl-buttons div { background: #ff9e21; } .home-4 .indicator.owl-theme .owl-controls .owl-buttons div:hover { color: #ff9e21; } .home-4 .trend-content h1:hover,.home-4 .trend-content h3:hover { color: #ff9e21; } .home-4 .trend-content a { background: #ff9e21; border: 2px solid #ff9e21; } .shop-by-category.home-4 .shop-by-content h4:hover { background: #ff9e21; } .home-4 .product-single-wrap .single-content .title a:hover,.home-4 .product-single-wrap .single-content .brand:hover { color: #ff9e21; } .home-4 .instafeed a:after { background-color: rgba(255, 158, 33, 0.7); } .home-4 .blog-up-text .date { color: #ff9e21; } .home-4 .post-date i,.home-4 .comment i,.home-4 .likes i,.home-4 .share i { color: #ff9e21; } .home-4 .blog-title a:hover,.home-4 .post-time a:hover { color: #ff9e21; } .home-4 .blog-button a.blog-readmore,.home-4 h3.wedget-title:hover,.home-4 .footer-account-area ul li a:hover,.home-4 .footer-contact label i:hover,.home-4 .footer-newsletter:hover h4,.home-4 .copy-right a,.home-4 .footer-read-more a { color: #ff9e21; } .home-4 .blog-button a.blog-readmore:hover { color: #222; } .home-4 .btn-color { background-color: #ff9e21; } .home-4 .btn-color:hover { background-color: #333; } .home-4 .btn-more:hover { border-color: #ff9e21; background: #ff9e21; } .home-4 .single-service:hover .icon { color: #ff9e21; } .home-4 .single-service:hover .info a { color: #ff9e21; } .latest-trend-wrap.home-4 { background: rgba(0, 0, 0, 0) url("../public/images/trend/2.jpg") no-repeat fixed left center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: relative; height: 700px; padding: 50px 0 0; } .banner-area.home-4 { padding: 25px 0 0 0; } .home-4 .phone_number { margin-left: 0px; display: inline-block; color: #fff; font-size: 13px; } /*---------------- 21. Home-5 -----------------*/ .home-5 .top-link-wrap { text-align: center; } .home-5 .header-top-wrap { padding: 14px 0px; } .header-search-box.home-5 { width: 100%; margin-top: 0px; } .home-5 .header-top-left,.home-5 .single-link { margin-top: 4px; } .home-5 .header-mid-content { position: relative; padding: 17px 0 24px; } .home-5 .header-cart-wrap.home-4 { margin: 14px 0 7px; } section.slider-area.home-5 { margin-top: 25px; } .section-heading.home-5:after { position: absolute; top: 17%; border-top: 1px solid #cdcdcd; left: 0; content: ""; width: 100%; } .product-list-area.home-5 { margin: 0 0 0px; } /*------------------ 22. Home-6 -------------------*/ .home-6 .slider-content { padding: 155px 0 140px 70px; } .home-6 .layer-2-4 a.shop-n { margin: 4% 0px 0 0%; } .home-6 .top-link-wrap .single-link>div { background: #333; padding: 0 13px 0 0px; } .home-6 .mainmenu-area { height: 0px; } .home-6 .mainmenu ul#nav > li:nth-child(1){ background: inherit; } .home-6 .mainmenu { margin-top: 11px; } .header-mid-wrap.home-6 { background: #434242; } .mainmenu ul#nav li .megamenu.home-6-1 { left: -151px; } .mainmenu ul#nav li .megamenu.home-6-2 { left: -235px; } .home-6 .cat-single-wrap > .nav > li:hover > a,.home-6 .cat-single-wrap > .nav > li:focus > a { background-color: #ff9e21; color: #fff; } .home-6 .cat-wrap .nav > li > a:hover,.home-6 .cat-wrap .nav > li > a:focus { color: #ff9e21; } .banner-area.home-6 { padding: 80px 0 0 0; } .footer-top-area.home-6 { background: rgba(0, 0, 0, 0) linear-gradient(90deg, #413f3f 50%, #151515 50%) repeat scroll 0 0; padding: 50px 0 0px; } .home-6 .copy-right a { color: #ff9e21; } /*------------------ 23. Home-7 -------------------*/ .latest-trend-wrap.home-7,.latest-trend-wrap.home-9 { background: rgba(0, 0, 0, 0) url("../public/images/trend/3.jpg") no-repeat fixed left center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: relative; height: 700px; padding: 50px 0 0; } .home-7 .testimonial-des > p { font-size: 15px; padding: 0 0px; } .home-7 .trend-content h3 { font-size: 17px; text-transform: capitalize; font-weight: 500; padding: 0 0 28px 500px; line-height: 26px; } .home-7 .trend-content h1 { font-size: 65px; } .home-7 .single-service { margin-left: 0px; } .home-7 .trend-content a { border-radius: 0 15px 0 15px; } .opening-time { display: inline-block; padding: 0 0 0 10px; } .opening-time p { color: #fff; } .opening-time .fa { padding: 0 5px 0 0; } .opening-time span.ope-time { padding: 0 0 0 5px; display: inline-block; color: #ff9e21; } .home-7 .header-top-wrap { padding: 17px 0px 9px; } .home-7 .header-top-left { margin-top: 8px; } .header-search-box.home-7 { width: 100%; margin-top: 2px; } .header-mid-wrap.home-7 { background: none; } .home-7 .mainmenu ul#nav > li > a { color: #000; padding: 10px 13px; } .home-7 .phone_number,.home-7 .opening-time { font-size: 14px; } .home-7 .mainmenu { margin-top: 13px; } .home-7 .mainmenu ul#nav li .megamenu span.mega-single { width: 50%; } .home-7 .mainmenu ul#nav li .megamenu.shop { width: 650px; left: -83px; } .home-7 .mainmenu ul#nav li .megamenu.pages { width: 460px; } .mega-single.home-7 { margin: 10px 0 0 0; } .mega-single a > span.lime { background: #8ad137; color: #fff; float: right !important; text-align: center; } .megamenu span.mega-single > a > span.hot { background: #e9494e; border-radius: 2px; float: right !important; font-size: 10px; padding: 2px 6px; display: inline-block; text-transform: uppercase; color: #fff; text-align: center; } /*slider*/ .home-7 .layer-1-1 .title1 { text-align: left; } .home-7 .layer-1-3 p.title3 { font-size: 18px; margin: 20px 0 0; background: none; padding: 0px 0px; text-align: left; margin-right: 32%; text-transform: capitalize; } .home-7 .layer-1-3 p.title3:hover { background: none; } .home-7 .layer-1-1 .title1 { font-size: 60px; } .home-7 .layer-1-4 a.shop-n,.home-7 .layer-2-4 a.shop-n { margin: 3% 0px 0 0%; border-radius: 0 15px 0 15px; } .footer-newsletter.home-7 { background: #151515; margin: 0px auto; padding: 0px 0px; text-align: left; } .footer-newsletter h4 { margin: 4px 15px 6px 0; } .footer-top-area.home-7 { padding: 50px 0; } .home-7 .footer-contact p { margin-bottom: 16px; padding-bottom: 16px; } .home-7 .margin-t { margin: 6px 0 0 0; display: inline-block; } .home-7 .single-service { padding: 18px 14px 7px 14px; } .portfolio-area.home-7 { margin: 0px 0 0px; } /*.padding-t.home-7 { padding: 50px 0 0; }*/ /*------------------------ 23.1. Fatures-Area -------------------------*/ .subtitle { font-size: 18px; font-weight: 600; margin-bottom: 30px; } .service-icon i { color: #ff9e21; } .service-icon i { font-size: 35px; margin-bottom: 15px; } .row.service-margin-bottom { margin-bottom: 5px; } .single-service-content strong { word-spacing: 2px; } .single-service { padding: 2px 4px; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .single-service:hover { background: #e7e7e7 none repeat scroll 0 0; } .single-service:hover h4 { color: #ff9e21; } .single-service-content p { font-size: 15px; line-height: 24px; } .counter-icon { color: #ff9e21; font-size: 50px; } /*------counter-area----*/ .counter-area { background: url("../public/images/bg/11.jpg") no-repeat fixed top center / cover; padding: 80px 0; } .counter-area { margin-top: 60px; } .single-counter { text-align: center; } .timer.counter-number { display: block; } .timer.counter-number { display: block; font-size: 30px; font-weight: 700; color: #fff; padding: 25px 0 12px; } .counter-text { font-size: 20px; font-weight: 600; margin-top: 7px; color: #fff; text-transform: capitalize; } .border-right { border-right: 1px solid rgba(255, 158, 33, 0.7); } /*---------------------- 23.2. About-Area -----------------------*/ .about-area { background: #f2f2f2 none repeat scroll 0 0; padding: 80px 0; } .section-title > h1 { font-size: 38px; font-weight: 700; margin-bottom: 15px; padding-bottom: 15px; color: #2196f3; position: relative; } .single-ab-content h4 { font-size: 20px; font-weight: 700; text-transform: uppercase; } .section-title h1:before { content: ''; position: absolute; width: 120px; margin-left: -35px; height: 2px; left: 48%; bottom: 0px; background-color: #ff9e21; } .single-ab-content ul li { color: #444; display: block; font-size: 14px; } .single-ab-content ul li:hover { color: #ff9e21; } .single-ab-content ul li i { color: #ff9e21; font-size: 12px; padding-right: 10px; } .about-content { margin-top: 23px; } .about-big-image { margin-top: 30px; } .single-ab-content p { font-size: 15px; line-height: 23px; margin: 0 0 10px 0px; } .single-ab-content a:hover { color: #ff9e21; } .section-heading.home-7 h3 { background: none; } /*--------------------------- 23.3. Portfolio-Area ----------------------------*/ .isotope-area { position: relative; } .isotop-manu { text-align: center; margin: 15px 0 20px 0; } .isotop-headign-area { margin-bottom: 10px; position: relative; } .isotop-manu ul { list-style: none; margin: 0; padding: 0px; } .isotop-manu ul li { color: #1c1c1c; cursor: pointer; display: inline-block; font-size: 18px; margin: 0 10px; font-weight: 600; padding: 0 10px 7px; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .isotop-manu ul li:hover { color: #ff9e21 !important; border-bottom: 2px solid #ff9e21; } .isotop-manu ul li.active { color: #ff9e21; border-bottom: 2px solid #ff9e21; } .isotop-items { display: block; } .single-item { float: left; } .single-item { position: relative; overflow: hidden; } .single-item:hover .isotop-title { opacity: 1; visibility: visible; bottom: -10px; } .isotop-title { background: rgba(0, 0, 0, 0.6); bottom: -50px; color: #fff; display: inline-block; padding: 20px; position: absolute; text-align: center; width: 100%; opacity: 0; visibility: hidden; z-index: 333; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .isotop-title a { color: #fff; font-size: 18px; font-weight: 400; letter-spacing: 0.5px; text-transform: uppercase; } .isotop-items .single-item img { transition: all 300ms ease 0s; width: 100%; } .isotop-items .single-item .isotop-effect::before, .isotop-items .single-item .isotop-effect::after { background: #fff none repeat scroll 0 0; bottom: 0; content: ""; display: block; left: 0; margin: auto; position: absolute; right: 0; top: 0; transition: all 500ms ease 0s; -webkit-transition: all 500ms ease 0s; } .isotop-items .single-item .isotop-effect::before { height: 1px; width: 40px; } .isotop-items .single-item .isotop-effect::after { height: 40px; width: 1px; } .isotop-items .single-item .isotop-effect { background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0; bottom: 0; display: block; font-size: 0; left: 0; margin: 0; position: absolute; right: 0; top: 0; z-index: 3; } .isotop-items .single-item .isotop-effect { opacity: 0; transform: scale(0.55); transition: all 300ms ease 0s; } .single-item:hover .isotop-effect{ opacity: 1; transform: scale(1); } .isotop-items .single-item img { transition: all 300ms ease 0s; width: 100%; } .single-item:hover img { transform: rotate(5deg) scale(1.05); } .about-button.isotop-but a { margin-top: 366px; right: -114px; } .section-title.iso-title h1 { font-size: 40px; font-weight: bold; letter-spacing: 1px; color: 1c1c1c; text-transform: uppercase; } .blog-img.port-details img { width: 100%; } .single-testimonial.home-7 { padding: 0 50px; } /*--------------------------- 24. Home-8 ----------------------------*/ .email-us { display: inline-block; color: #fff; font-size: 14px; margin: 0 0 0 10px; } .email-us p a { color: #ff9e21; } .home-9 .single-service { padding: 10px 4px; } .email-us p i { margin-right: 5px; } .home-8 .mainmenu { margin-top: 0px; } .home-8 .mainmenu ul#nav > li > a { color: #fff; padding: 10px 13px; } .home-8 .header-top-wrap { padding: 9px 0px 1px; } .home-8 .mainmenu ul#nav > li:first-child > a { background: #ff9e21; } .home-8 .header-search-box { margin: 7px 0 4px; } .newsletter-area.home-8,.footer-newsletter.home-8 { background: none; } .single-team.home-8 img { transition: all 0.3s ease 0s; filter: grayscale(100%); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; } .single-team.home-8:hover img { filter: grayscale(0%); } .home-8 .header-logo > a { margin-top: 0px; } /*slider*/ .home-8 .layer-1-1 .title1 { font-size: 55px; letter-spacing: 0px; } .home-8 .slider-content { float: left; padding: 160px 0 140px 50px; } /*---------------------- 24.1 Pricing table -----------------------*/ .single_table { width: 25%; float: left; text-align: center; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .single_table.active { border: 0 solid; box-shadow: 0 1px 16px #666; background: #f2f2f2; } .single_table ul { margin: 0; padding: 0; list-style: none; border-left: 1px solid #dedede; } .single_table:nth-child(4) ul { border-right: 1px solid #dedede; } .section-heading.home-8 { padding: 0 0 20px 0; } .single_table ul li { border-bottom: 1px solid #ddd; padding: 5px; font-size: 14px; } .pricing_header { background: #ddd; position: relative; } .single_table .pricing_ribbon { height: 170px; overflow: hidden; position: absolute; right: 0; top: -3px; width: 123px; } .single_table .pricing_header .pricing_ribbon p, .single_table.active .pricing_header .pricing_ribbon p { background: red none repeat scroll 0 0; color: #fff; display: inline-block; left: 22px; padding: 6px 42px; position: absolute; text-transform: uppercase; top: 10px; transform: rotate(40deg); -webkit-transform: rotate(40deg); box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.15); } .single_table .pricing_header .pricing_ribbon:before { border: 2px solid green; content: ""; left: 19px; position: absolute; top: 0; width: 51%; } .single_table .pricing_header .pricing_ribbon:after { border: 3px solid green; content: ""; left: 97px; position: absolute; top: 56px; transform: rotate(90deg); width: 43%; } .pricing_header h3 { background: #ccc; padding: 10px; margin-top: 15px; border-top: 1px solid #f1f1f1; color: #fff; } .single_table.active .pricing_header h3 { margin-top: 0px; border-top: 0px solid #f1f1f1; } .single_table.active:hover .pricing_header h1 { color: #fff; font-size: 60px; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; } .pricing_header h1 { font-size: 40px; margin-bottom: 0px; color: #fff; padding: 20px 20px 8px; } .single_table.active:hover { transform: scale(1.07); transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; z-index: 333; } .single_table.active .pricing_header p { padding-bottom: 20px; } .pricing_header p { margin: 0px; padding-bottom: 30px; color: #fff; } .pricing_footer { padding: 10px; } .pricing_footer { border-left: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; } .single_table:nth-child(4) .pricing_footer { border-right: 1px solid #f1f1f1; } .pricing_footer a { background: #000 none repeat scroll 0 0; display: inline-block; font-size: 15px; padding: 5px 25px; border-radius: 5px; color: #fff; text-transform: uppercase; cursor: pointer; } /*Pricing Table color*/ .single_table .pricing_header .pricing_ribbon.green_ribbon P { background: green; } .single_table.magenta-color {} .single_table.magenta-color .pricing_header {background-color: #8e44ad;} .single_table.magenta-color .pricing_header h3 {background-color: #9b59b6;} .single_table.magenta-color .pricing_footer a {background-color: #8e44ad;} .single_table.carrot-color {} .single_table.carrot-color .pricing_header {background-color: #d35400;} .single_table.carrot-color .pricing_header h3 {background-color: #e67e22;} .single_table.carrot-color .pricing_footer a {background-color: #d35400;} .single_table.m-blue-color {} .single_table.m-blue-color .pricing_header {background-color: #2c3e50;} .single_table.m-blue-color .pricing_header h3 {background-color: #34495e;} .single_table.m-blue-color .pricing_footer a {background-color: #2c3e50;} .single_table.silver-color {} .single_table.silver-color .pricing_header {background-color: #2980b9;} .single_table.silver-color .pricing_header h3 {background-color: #4aa3df;} .single_table.silver-color .pricing_footer a {background-color: #2980b9;} /*------------------ 25. Home-9 -------------------*/ .header-search-box.home-9 { width: 100%; } .header-top-left.home-9 { float: right; margin: 5px 0 2px 0; } .header-top-left.home-9 .phone_number { color: #000; } .header-top-left.home-9 .phone_number .top-phone,.header-top-left.home-9 .opening-time p .ope-time,.header-top-left.home-9 .email-us p a { color: #4d9710 !important; font-size: 15px; } .header-top-left.home-9 .phone_number p i,.header-top-left.home-9 .opening-time p i, .header-top-left.home-9 .email-us p i { font-weight: bold; margin-right: 4px; } .header-top-left.home-9 .phone_number:after { display: none; } .header-top-left.home-9 .opening-time p, .header-top-left.home-9 .email-us p { color: #000; } .header-top-left.home-9 .opening-time p, .header-top-left.home-9 .email-us p,.header-top-left.home-9 .phone_number p { margin-bottom: 0px; } a.we-button { font-size: 15px; font-weight: 600; text-transform: capitalize; } a.we-button:hover { color: #ff9e21; } .home-9 .single-service-content strong { text-transform: capitalize; } .latest-trend-wrap.home-9 { background: rgba(0, 0, 0, 0) url("../public/images/trend/4.jpg") no-repeat fixed left center; margin-top: 40px; } .counter-area.home-9 { margin-top: 0px; } .about-skills-area.home-9 { background: url(../public/images/bg/sk.jpg) no-repeat fixed left center / cover; padding: 70px 0 10px; margin: 70px 0 0; } .order-recipe-area { background: #333; padding: 50px 0; } .order-button a { display: inline-block; color: #fff; font-size: 18px; text-transform: capitalize; font-weight: bold; background: #ff9e21; padding: 10px 20px; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .order-button:hover a { color: #000; background: #fff; } /*------------------------- 26. Portfolio --------------------------*/ .top-banner-area { background: rgba(0, 0, 0, 0.45) url("../public/images/about/aboutFrame_bcg.png") repeat scroll 0 0; padding: 120px 0; position: relative; overflow: hidden; background-position-y: -115px; } .top-banner-area.others-page { background: rgba(0, 0, 0, 0.45) url("../public/images/about/aboutFrame_bcg.png") repeat scroll 0 0; background-position-y: -115px; } .video-text { color: #fff; left: 0; top: 40%; position: absolute; right: 0; margin: 0 auto; text-align: center; } .video-text h1 { color: #fff; } .typewrite > .wrap { border-right: 0 none; } .video-text strong { border-bottom: 3px solid #57ae10; } /*----portfolio-area----*/ .portfolio-area { margin: 80px 0 50px; } .pst-content { padding-left: 10px; } .portfolio-menu { margin-bottom: 40px; text-align: center; } .portfolio-menu li { display: inline-block; } .portfolio-menu li a { background: #fff none repeat scroll 0 0; color: #222; cursor: pointer; display: inline-block; font-size: 15px; font-weight: 500; margin: 0 4px; padding: 6px 18px; text-transform: capitalize; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; } .portfolio-menu li a.active,.portfolio-menu li a:hover { background: #57ae10; color: #fff; text-decoration: none; } .single-portfolio-project { overflow: hidden; margin-bottom: 30px; } .first-item { margin-bottom: 30px; } .portfolio-img{ display: block; width: 100%; height: 100%; position: relative; } .portfolio-img > a { display: block; position: relative; } .single-portfolio-project:hover .portfolio-img > a::after{ opacity: 1; } .single-portfolio-project:hover .add-actions{ opacity: 1; bottom: 0; } .add-actions { background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0; bottom: 30px; display: block; height: 100%; left: 0; opacity: 0; overflow: hidden; padding: 10px 15px; position: absolute; transition: all 0.4s ease 0s; width: 100%; } .portfolio-img > a::after { background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0; content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; opacity: 0; transition: 0.4s; } .project-dec { display: block; height: 100%; width: 100%; } .project-dec a { display: block; height: 100%; width: 100%; } .project-dec h4 { margin-bottom: 5px; } .project-dec h4:hover { color: #fff; } .project-dec h4 { color: #ddd; font-size: 22px; font-weight: 700; margin-top: -14%; padding-top: 51%; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; } .project-dec span { color: #ddd; font-size: 13px; } .project-action-btn { display: block; height: 100%; text-align: center; transition: all 1s ease 0s; width: 100%; } .project-action-btn li { display: block; height: 100%; width: 100%; } .project-action-btn li a { display: block; height: 100%; width: 100%; } /*------------------ 27. Gallery -------------------*/ .gallery-area { padding: 20px 0 50px; } .gallery-post { margin: 0 0 30px; overflow: hidden; width: 100%; } .gallery-post a span.g-icon {animation-duration: 0.5s; border: 2px solid #fff; border-radius: 100%; color: #fff; display: inline-block; height: 50px; left: 0; line-height: 50px; margin: -20px auto 0; opacity: 0; position: absolute; right: 0; text-align: center; top: 0; transition: all 0.5s ease 0s; visibility: hidden; width: 50px; z-index: 3; } .gallery-post a span.g-icon:before{content: "\f0c1"; display: inline-block; font: 14px/1 FontAwesome; text-rendering: auto; transform: translate(0px, 0px); } .single-gallery:hover .gallery-post a span.g-icon{opacity: 1; top: 50%; visibility: visible;} .gallery-post a {display: block; overflow: hidden; position: relative; text-align: center; } .gallery-post a:before{animation-duration: 0.5s; background: rgba(0, 0, 0, 0.3) none repeat scroll 0 0; content: ""; display: block; height: 100%; left: 0; opacity: 0; position: absolute; top: 0; transform: translateX(-100%); transition: all 0.5s ease 0s; width: 50%; z-index: 1; } .gallery-post a:after{animation-duration: 0.5s; background: rgba(0, 0, 0, 0.3) none repeat scroll 0 0; content: ""; display: block; height: 100%; opacity: 0; position: absolute; right: 0; top: 0; transform: translateX(100%); transition: all 0.5s ease 0s; width: 50%; z-index: 1; } .single-gallery:hover .gallery-post a:before{opacity: 1; transform: translateX(0px); visibility: visible; } .single-gallery:hover .gallery-post a:after {opacity: 1; transform: translateX(0px); visibility: visible; } /*------------------ 28. Faq Page --------------------*/ .signle-heading.faq,.signle-heading.login { margin-bottom: 0px; } .faq-main-heading h2 { font-size: 35px; font-weight: bold; } .faq-area { background: #f2f2f2 none repeat scroll 0 0; padding: 70px 0; } .faq-accordion .panel-title a.collapsed::after, .faq-accordion .panel-title a::after { border-left: 1px solid #d8d8d8; content: ""; font-family: fontawesome; font-size: 20px; line-height: 52px; padding-left: 20px; position: absolute; right: 19px; top: 0; } .faq-accordion .panel-title a::after { content: ""; } .panel-title { color: inherit; font-size: 16px; margin-bottom: 0; margin-top: 0; } .panel-default > .panel-heading { background-color: #ececec; } .faq-accordion .panel-group .panel { border: 0 none; box-shadow: 0 4px 5px -1px #c8c8c8; margin-bottom: 20px; } .faq-accordion .panel-group:last-child { margin-bottom: 0; } .faq-accordion .panel-title a { color: #222; display: block; font-size: 16px; font-weight: bold; line-height: 1.5; padding: 15px 10px 15px 25px; position: relative; } .panel-default .panel-heading a.collapsed { background: #fff none repeat scroll 0 0; } .panel-heading { padding: 0px; } .faq-main-heading > p { font-size: 16px; font-weight: bold; padding: 7px 0 30px; } .panel-body > p { color: #222; font-size: 14px; } /*-------------------- 29. About Us ---------------------*/ .section-title h2 { font-size: 25px; font-weight: 700; margin-bottom: 0; text-transform: uppercase; } .section-title { margin-bottom: 50px; text-align: center; } .about-text h2, .section-title h2 { font-size: 25px; font-weight: 700; letter-spacing: 0.5px; margin-bottom: 0; text-transform: uppercase; word-spacing: 1px; } .about-text > h2 { margin: 0 0 20px; } .about-text { margin: 50px 0; } .about-text p { line-height: 20px; font-size: 14px; } .team-area { background: #f5f5f5 none repeat scroll 0 0; padding: 70px 0; } .single-team {background: #fff none repeat scroll 0 0; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .team-img { overflow: hidden; position: relative; } .team-icon { background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0; bottom: -55px; left: 0; padding: 10px 0; position: absolute; right: 0; text-align: center; opacity:0; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .single-team:hover .team-icon{bottom:0;opacity:1; } .team-icon > a { border: 1px solid #fff; color: #fff; display: inline-block; font-size: 18px; height: 35px; line-height: 32px; margin: 0 3px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; width: 35px; } .team-icon > a:hover{background:#ff9e21; border-color:#ff9e21; } .team-info { padding: 15px 0 5px; text-align: center; } .team-info h2 { color: #333; font-size: 19px; font-weight: 700; text-transform: capitalize; } .team-info span { font-size: 12px; letter-spacing: 0.5px; text-transform: capitalize; } .our-team-member { margin: 30px 0 0 0; } .team-info p { font-size: 14px; line-height: 24px; margin: 0 0 5px 0; } .single-team:hover { background: #ff9e21 none repeat scroll 0 0; } .single-team:hover h2,.single-team:hover span{color:#fff; } .quality-service-area { background: #f8f8f8 none repeat scroll 0 0; padding: 50px 0; } .quality-products { text-align: center; } .quality-products i { background: #e7e7e7 none repeat scroll 0 0; border-radius: 50%; color: #ff9e21; display: inline-block; font-size: 40px; height: 100px; margin: 0 0 25px; padding: 32px 0 0; text-align: center; width: 100px; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .quality-products:hover i { border-radius: 0%; background: #57ae10 !important; color: #fff; } .quality-products h4 { color: #333; font-size: 18px; font-weight: 600; letter-spacing: 1px; text-align: center; } .quality-products p { color: #777; font-size: 15px; font-weight: 400; margin: 0; text-align: center; line-height: 23px; } /*----Our-skill-team----*/ .our-skill-team{ padding-top: 30px; } .skill .progress .lead {bottom: -30px;color: #fff;font-size: 16px; font-weight: normal; left: 0;margin: 0; position: absolute; z-index: 99; } .skill-hedding > h3 {font-size: 25px; font-weight: 700; margin: 0; padding: 50px 0; text-align: center; text-transform: uppercase; } .skill .progress .lead span {color: #fff;font-size: 16px; margin-left: 10px; } .progress-bar {background-color: #ff9e21; } .skill .progress {background-color: #ebebeb;border-radius: 0;box-shadow: none; height: 5px; margin-bottom: 70px; overflow: visible; position: relative; } .skill .progress-bar > span { background: #333 none repeat scroll 0 0; float: right; font-size: 14px; margin-right: 10px; margin-top: -26px; position: relative; padding: 2px 14px; text-align: center; display: inline-block; } .skill .progress-bar > span:before,.skill .progress-bar > span:after{ border: medium solid transparent;content: " "; height: 0; pointer-events: none;position: absolute; top: 100%;width: 0; } .skill .progress-bar > span:before {border-top-color: #333;border-width: 5px; left: 50%;margin-left: -5px; } /*------------------ 30. Blog page -------------------- */ .blog-inner-text { border-bottom: 1px solid #ebebeb; margin-bottom: 10px; padding: 0 0 10px; } .blog-pragraph > p { font-size: 14px; line-height: 22px; } .margin-blog { margin-bottom: 30px; } .tag-area.blog-tag > ul > li > a { border: 1px solid #d9d9d9; color: #000; padding: 3px 15px; display: inline-block; text-transform: capitalize; } .tag-area.blog-tag li { display: inline-block; margin: 0 0 5px 0; } .tag-area.blog-tag > ul > li:hover a { color: #57ae10; } .blog-pagination { border-top: 1px solid #d9d9d9; margin-top: 31px; overflow: hidden; padding-top: 30px; } .blog-pagination .shop-breadcrumb { text-align: center; width: 100%; } .shop-breadcrumb { float: left; text-align: right; width: 25%; } .shop-breadcrumb ul li { display: inline-block; } .shop-breadcrumb ul li a { border: 1px solid #ddd; color: #444; display: block; height: 35px; line-height: 35px; text-align: center; width: 35px; font-size: 16px; font-weight: 500; } .shop-breadcrumb ul li a:hover, .shop-breadcrumb ul li.active a { background: #57ae10 none repeat scroll 0 0; border-color: #57ae10; color: #fff; } .short-by { float: left; text-align: center; width: 25%; } /*blog-sideber*/ .header-search-box-blog { background-color: #fff; width: 100%; position: relative; z-index: 11; display: block; margin-bottom: } form.header-search-box-blog input[type="search"] { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: 1px solid #dddddd; font-size: 14px; font-weight: 400; padding: 0px 45px 0px 20px; position: absolute; width: 100%; height: 50px; } form.header-search-box-blog input[type="search"]:focus { border: 1px solid #ffbb00; } #btn-search-category-blog { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: 0 none; color: #777; font-size: 14px; outline: medium none; position: absolute; right: 1px; top: 10px; width: 60px; z-index: 99; } .left-sidebar.blog { margin-top: 68px; } .recent-post ul li .post-thumb:hover a img { transform: scale(1.2); transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .pad-right { padding: 0 7px 0 12px; } .pad-left { padding: 0 7px; } .recent-post li { border-bottom: 0px dotted #000; display: inline-block; margin-top: 12px; } .recent-post ul li .post-info a { color: #444; display: inline-block; font-size: 16px; font-weight: 400; text-transform: capitalize; text-decoration: none; transition: .3s; } .recent-post > ul > li> .post-info > span.re-date { color: #5f5f5f; font-weight: 400; text-align: left; float: none; } .post-info span.re-date { float: left; margin-left: 0px; } /*blog-fullwidth*/ .blog-img a img { width: 100%; } /*youtuve-video*/ .youtube-video { height: 0; padding: 225px 0; position: relative; width: 100%; } .youtube-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .blog-audio audio { display: inline-block; height: 40px; width: 100%; } .blog-carousel-2 .col-md-6 {width:100%} span.da-yar { padding-left: 8px; font-size: 14px; font-weight: 400; } /*--------------------- 31. Blog Details ----------------------- */ blockquote { border-left: 4px solid #ffbb00; font-size: 16px; font-style: italic; margin: 0 0 20px 30px; line-height: 22px; } .single-post-comments { margin-top: 40px; max-width: 100%; } .comments-heading h3, h3.comment-reply-title { border-bottom: 1px solid #e8e8e9; font-size: 18px; margin: 0 0 20px; padding: 0 0 5px; text-transform: uppercase; } .comments-list-img { float: left; margin-right: 15px; } .comments-list-img img { width: 50px; } .comments-content-wrap::before { background: #fff none repeat scroll 0 0; border-bottom: 1px solid #ececec; border-left: 1px solid #ececec; content: ""; display: block; height: 10px; left: -5px; position: absolute; top: 10px; -webkit-transform: rotate(45deg); transform: rotate(45deg); width: 10px; } .comments-list ul li { margin-bottom: 25px; } .comments-content-wrap { border: 1px solid #ddd; color: #42414f; font-size: 12px; line-height: 1; margin: 0 0 15px 63px; padding: 10px; position: relative; } .comments-content-wrap span b { margin-right: 5px; } .comments-content-wrap a { color: #444; } .comments-content-wrap { color: #42414f; font-size: 12px; line-height: 1; } .comments-content-wrap p { color: #444; line-height: 15px; margin-bottom: 5px; margin-top: 10px; } li.threaded-comments { margin-left: 50px; } .comments-content-wrap a:hover,.recent-post .post-info > a:hover { color: #57ae10; } .comment-respond { margin-top: 60px; } .comment-respond p { margin-bottom: 5px; } .comment-respond input[type="text"], .comment-respond input[type="email"] { background: #fff none repeat scroll 0 0; border: 1px solid #e5e5e5; border-radius: 0; height: 32px; margin-bottom: 15px; padding: 0 0 0 10px; width: 100%; } .comment-respond textarea#message { background: #fff none repeat scroll 0 0; border: 1px solid #e5e5e5; border-radius: 0; height: 130px; max-width: 100%; padding: 10px; width: 100%; } .comment-respond input[type="submit"] { background: #333 none repeat scroll 0 0; border: medium none; border-radius: 0; box-shadow: none; color: #fff; display: inline-block; font-size: 14px; font-weight: 700; height: 40px; line-height: 40px; margin-top: 20px; padding: 0 15px; text-shadow: none; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; white-space: nowrap; letter-spacing: 1px; } .login-content form input.login-sub:hover,.comment-respond input[type="submit"]:hover { background: #57ae10; } /*----------------------- 32. Checkout page ------------------------- */ .coupon-area { padding: 0px 0 50px; } .coupon-accordion h3 { background-color: #f7f6f7; border-top: 3px solid #57ae10; color: #444; font-size: 14px; font-weight: 400; margin: 0 0 25px; padding: 1em 2em 1em 3.5em; position: relative; width: auto; } .coupon-accordion h3::before { color: #1e85be; content: ""; display: inline-block; font-family: fontawesome; left: 1.5em; position: absolute; top: 1em; } .coupon-accordion span { color: #000; cursor: pointer; font-size: 15px; font-weight: 600; } .coupon-accordion span:hover, p.lost-password a:hover { color: #57ae10; } .coupon-content { border: 1px solid #e5e5e5; display: none; margin-bottom: 20px; padding: 20px; } .coupon-info p.coupon-text{margin-bottom:15px } .coupon-info p{margin-bottom:0 } .coupon-info p.form-row-first label,.coupon-info p.form-row-last label{display: block; } .coupon-info p.form-row-first label span.required,.coupon-info p.form-row-last label span.required{ color: red; font-weight: 700; } .coupon-info p.form-row-first input,.coupon-info p.form-row-last input{border: 1px solid #e5e5e5; height: 36px; margin: 0 0 14px; max-width: 100%; padding: 0 0 0 10px; width: 370px; } .coupon-info p.form-row input[type="submit"]:hover, p.checkout-coupon input[type="submit"]:hover { background: #57ae10 none repeat scroll 0 0; } .coupon-info p.form-row input[type="checkbox"] { position: relative; top: 2px; } .form-row > label { margin-top: 7px; } .buttons-cart input, .coupon input[type="submit"], .buttons-cart a, .coupon-info p.form-row input[type="submit"] { background: #252525 none repeat scroll 0 0; border: medium none; color: #fff; display: inline-block; float: left; font-size: 12px; font-weight: 700; height: 40px; line-height: 40px; margin-right: 15px; padding: 0 15px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } p.lost-password{margin-top: 15px; } p.lost-password a{color: #6f6f6f; } p.checkout-coupon input[type="text"] { border: 1px solid #e5e5e5; height: 38px; padding-left: 10px; width: 170px; } p.checkout-coupon input[type="submit"] { background: #333 none repeat scroll 0 0; border: medium none; border-radius: 0; color: #fff; height: 38px; line-height: 0; margin-left: 6px; padding: 5px 10px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .checkout-area {padding-bottom: 30px; } .checkbox-form h3 { border-bottom: 1px solid #e5e5e5; color: #222; font-size: 26px; margin: 0 0 20px; padding-bottom: 10px; text-transform: uppercase; width: 100%; } .country-select{margin-bottom: 30px; position: relative; } .country-select label, .checkout-form-list label {color: #222; display: block; margin: 0 0 5px; } .country-select select option { padding: 4px 10px; } .country-select label span.required,.checkout-form-list label span.required{color:red} .country-select select{ -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; border: 1px solid #ddd; height: 32px; padding-left: 10px; width: 100%; } .country-select::before {content: "";display: inline-block;font-family: fontawesome; font-size: 20px; position: absolute; right: 12px; top: 35px; } .checkout-form-list{margin-bottom: 30px; } .checkout-form-list label{color: #333; } .checkout-form-list input[type="text"], .checkout-form-list input[type="password"], .checkout-form-list input[type="email"] { background: #fff none repeat scroll 0 0; border: 1px solid #e5e5e5; border-radius: 0; height: 42px; padding: 0 0 0 10px; width: 100%; } .checkout-form-list input[type="checkbox"] { display: inline-block; margin-right: 10px; position: relative; top: 2px; } .create-acc label {color: #333; display: inline-block; } .create-account{display:none} .ship-different-title h3 label{display: inline-block; margin-right: 20px; } .order-notes textarea { border: 1px solid #e5e5e5; height: 90px; padding: 15px; width: 100%; } #ship-box-info{display:none; } .panel-group .panel { border-radius: 0; } .panel-default > .panel-heading {border-radius: 0; } .your-order{background: #f2f2f2 none repeat scroll 0 0; padding: 30px 40px 45px } .your-order h3 { border-bottom: 1px solid #d8d8d8; color: #222; font-size: 30px; margin: 0 0 20px; padding-bottom: 10px; text-transform: uppercase; width: 100%; } .your-order-table table{background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: medium none; width: 100%;} .your-order-table table th, .your-order-table table td { border-bottom: 1px solid #d8d8d8; border-right: medium none; color: #222; font-size: 14px; padding: 15px 0; text-align: center; } .your-order-table table th { border-top: medium none; color: #222; font-weight: normal; text-align: center; text-transform: uppercase; vertical-align: middle; white-space: nowrap; width: 250px; } .panel-body > p {color: #222; } .your-order-table table .shipping ul li input{position: relative; top: 2px; } .your-order-table table .shipping th{vertical-align: top; } .your-order-table table .order-total th{border-bottom: medium none; font-size: 18px; } .your-order-table table .order-total td{border-bottom: medium none; } .your-order-table table tr.cart_item:hover{background:#fff } .your-order-table table tr.order-total td span {color: #57ae10 ;font-size: 20px; } .payment-method { margin-top: 40px; } .panel-title > a { display: block; font-weight: 700; letter-spacing: 1px; padding: 10px 15px; } .order-button-payment input {background: #222 none repeat scroll 0 0; border: medium none; color: #fff; font-size: 15px; font-weight: 700; height: 34px; margin: 20px 0 0; padding: 0; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; width: 100%; } .order-button-payment input:hover {background: #57ae10 none repeat scroll 0 0; } /*-------------------------- 33. Collection List ----------------------------*/ .news-letter-wrap.collection-news { margin-top: 0px; } .signle-heading.collection-single { margin-bottom: 0px; } /*--------------------- 34. Contact Us -----------------------*/ .touch-text h3 { font-size: 24px; color: #222; font-weight: 600; display: inline-block; text-transform: uppercase; margin: 50px 0 0 0; padding-bottom: 30px; border-bottom: 2px solid #57ae10; width: 27%; } .smal-text { display: inline-block; border-top: 1px solid #EDEDED; padding-top: 40px; width: 100%; } .smal-text p { font-size: 15px; color: #777; line-height: 26px; margin-bottom: 40px; } /* touch-form*/ .touch-textarea .name, .touch-form .name { font-size: 14px; color: #555; display: inline-block; margin-bottom: 5px; } .touch-form input[type="text"] { width: 100%; border: 1px solid #F4F4F4; padding: 15px 0 15px 10px; margin-bottom: 20px; background: #F4F4F4; } .touch-form input[type="tel"] { width: 100%; border: 1px solid #F4F4F4; padding: 7px 0 7px 10px; margin-bottom: 20px; background: #F4F4F4; } .touch-form input[type="email"] { width: 100%; border: 1px solid #F4F4F4; padding: 7px 0 7px 10px; margin-bottom: 20px; background: #F4F4F4; } /* touch-textarea*/ .touch-textarea textarea { background: #F4F4F4; border: 1px solid #F4F4F4; width: 100%; padding: 10px; } .touch-textarea input[type="submit"] { background: #f4f4f4 none repeat scroll 0 0; border: 1px solid #57ae10; color: #000; font-size: 14px; font-weight: 500; letter-spacing: 1px; padding: 8px 25px; text-transform: uppercase; -webkit-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; margin: 20px 0 60px; } .touch-textarea input[type="submit"]:hover { background: #57ae10; box-shadow: 0 2px 3px rgba(181, 167, 167, 0.5), 0 3px 5px rgba(222, 222, 222, 0.8); } /* address_area*/ .address-area { margin-top: 100px; display: inline-block; } .single-address p i,.single-email p i,.customar-supp p i { color: #57ae10; display: inline-block; font-size: 30px; line-height: 33px; float: left; } .single-address strong.stro { font-size: 15px; color: #222; font-weight: 700; margin: 0 0 10px 25px; display: inline-block; text-transform: uppercase; } .single-address span.add-tex { font-size: 16px; color: #222; font-weight: 400; margin: 0 0 25px 45px; display: inline-block; } .single-email strong.emai-stro { font-size: 15px; color: #222; font-weight: 700; margin: 0 0 10px 25px; display: inline-block; text-transform: uppercase; } .single-email span.email-tex { font-size: 16px; color: #222; font-weight: 400; margin: 0 0 25px 45px; display: inline-block; } .customar-supp strong.cus-stro { font-size: 15px; color: #222; font-weight: 700; margin: 0 0 10px 25px; display: inline-block; text-transform: uppercase; } .customar-supp span.cus-tex { font-size: 16px; color: #222; font-weight: 400; margin: 0 0 25px 45px; display: inline-block; } /*---------------------------- 35. Contact-Version-2 -----------------------------*/ .address-area.add-con-2 { margin-top: 0px; } .touch-text.touch-con2 h3 { margin-top: 0px; } /*-------------------- 36. Login page ---------------------*/ .login-area { background: #efefef none repeat scroll 0 0; padding: 60px 0; } .login-content { background: #fff none repeat scroll 0 0; padding: 25px; } .signle-heading.login-m { margin-bottom: 0; } .social-sign a { background: #3e5c98 none repeat scroll 0 0; color: #fff; display: inline-block; font-size: 14px; margin-right: 10px; padding: 9px 15px; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .social-sign a:hover { background: #22A9E0 none repeat scroll 0 0; } .social-sign a i { margin-right: 3px; } .social-sign a.twitter { background:#22A9E0; } .social-sign a.twitter:hover { background:#3e5c98; } .login-title { color: #2a2a2a; font-size: 20px; font-weight: 700; letter-spacing: 1px; margin-bottom: 13px; margin-top: 0; text-transform: uppercase; } .login-content form {margin-top: 30px; } .login-content form label {color: #444; margin-bottom: 5px; } .login-content form input { border: 1px solid #e3e3e3; box-shadow: none; font-size: 14px; height: 40px; letter-spacing: 1px; margin-bottom: 20px; padding-left: 10px; width: 100%; } .login-content form input.login-sub {background: #444 none repeat scroll 0 0; border: 0 none; color: #fff; font-weight: 700; margin-bottom: 0; margin-top: 5px; padding: 0 40px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; width: inherit; } .login-lost span.log-rem input {height: inherit;margin-right: 5px; position: relative; top: 2px; width: inherit; } .login-lost span.forgot-login {float: right; } .login-lost span.forgot-login a {color: #444; } .login-lost span.forgot-login a:hover{color:#ffbb00 } .sign-up-today {margin-top: 32px; } .sign-up-today ul li span i {color: #666;display: inline-block; font-size: 15px; margin-right: 6px; } .sign-up-today ul li span p {color: #666;display: inline-block;font-size: 15px; line-height: 30px; text-transform: capitalize; } .login-brand { margin: 60px 0 0; } /*------------------------- 37. My Account Page --------------------------*/ .my-account-title { margin: 0px 0 30px; overflow: hidden; } .my-account-title h2 { color: #252525; font-size: 20px; margin: 0; text-transform: uppercase; } .customer-inner{ border: 1px solid #e5e5e5; min-height: 345px; padding: 14px 21px; } .user-title h2 { border-bottom: 1px solid #e5e5e5; color: #444443; font-size: 13px; font-weight: normal; margin: 0 0 14px; padding: 0 0 5px 0px; text-transform: uppercase; } .user-title h2 i{margin-right:10px; margin-left:1px; } .user-bottom{ border-bottom: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; padding: 14px 21px; } .user-bottom button { background: #eeeeee none repeat scroll 0 0; color: #000; display: block; float: right; font-size: 13px; font-weight: 700; letter-spacing: 1px; margin-left: 10px; padding: 12px; text-align: center; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; border-radius: 0; } .user-bottom button:hover { background: #57ae10 none repeat scroll 0 0; color: #fff; } .user-bottom a { color: #e2211b; display: inline-block; line-height: 45px; } .account-form label { color: #666; font-size: 12px; font-weight: normal; position: relative; } .account-form label sup { color: #e2211b; font-size: 11px; position: absolute; right: -8px; top: 8px; } .account-form input{ border: 1px solid #e5e5e5; border-radius: 0; box-shadow: none; margin-bottom: 10px; } .reauired-fields { color: #666; font-size: 11px; font-weight: normal; position: relative; } .reauired-fields sup { font-size: 12px; position: absolute; left: -8px; top: 8px; } .brands-area.brands-account { margin: 60px 0 0; } /*------------------ 38. Shop Page -------------------*/ .shop-product-area .product-single-wrap { min-height: 488px; } /*left-sidebar*/ #text-search-blog { height: 50px; border: 1px solid #e7e7e7; } .left-sidebar { border: 1px solid #ebebeb; padding: 17px; } .left-sidebar-title h2 { background-color: #57ae10; color: #fff; font-size: 21px; font-weight: 700; line-height: 25px; margin: 0; padding: 13px 0; text-align: center; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .layout-title h2 { border-bottom: 2px solid #57ae10; color: #363636; font-size: 18px; font-weight: 700; margin-bottom: 15px; padding-bottom: 5px; text-transform: uppercase; display: inline-block; } .widget {margin-bottom: 20px; } .layout-list ul li a { color: #7d7d7d; display: inline-block; font-size: 14px; font-weight: normal; line-height: 28px; text-transform: capitalize; } .layout-list ul li span { color: #57ae10; float: right; font-weight: normal; line-height: 29px; margin-left: 2px; font-weight: 600; } .layout-list li { border-bottom: 1px dotted #000; margin-bottom: 4px; padding-bottom: 5px; } .shop-banner-area {margin-top: 30px; } .layout-list.compare {border: 1px solid #ebebeb;display: block;padding: 17px 17px 64px; } .layout-list.compare.information { padding-bottom: 20px; } .clear-button { display: inline-block; float: left; } .product-cart.compare { display: inline-block; float: right; overflow: hidden; text-transform: uppercase; margin-top: 12px; } .product-cart.compare .button { font-size: 13px; text-transform: uppercase; } .clear-button a { color: #222; display: inline-block; font-size: 14px; margin-top: 14px; text-transform: capitalize; } .layout-list.compare ul li a { color: #252525; display: inline-block; font-size: 13px; font-weight: 400; line-height: 21px; text-transform: uppercase; } .layout-list.compare ul li {line-height: 30px; } span.compare-icon { float: right; display: inline-block; } .compare-action {margin-top: 20px; } .compare-icon i { color: #252525; } .layout-title h2:hover,.layout-list ul li a:hover,.layout-list.compare ul li a:hover,.clear-button > a:hover,.compare-icon:hover i { color: #57ae10; } /*price-filter*/ .price-filter-area .price-filter .ui-slider-horizontal .ui-slider-range { background: #ff9e21 none repeat scroll 0 0; } .price-filter-area .price-filter .ui-widget-content { border: none; } .price-filter-area .price-filter .ui-slider-horizontal .ui-slider-handle { margin-left: -12px; top: -10px; } .price-filter-area .price-filter .ui-slider .ui-slider-handle { background: #fff none repeat scroll 0 0; border: 6px solid #ff9e21; height: 35px; top: -16px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; width: 24px; } .price-filter-area .price-filter .ui-slider .ui-slider-handle:hover { border-color: #57ae10; } .price-filter-area .price-filter .ui-slider-horizontal { height: 0.5em; } .price-filter-area .price-filter .ui-slider-horizontal { background: #dbdbdb none repeat scroll 0 0; height: 0.2em; margin: 30px 8px 25px; } .price-filter-area .price-filter > p input { color: #57ae10 !important; font-size: 14px; margin-bottom: 3px; } .price-filter-area .btn-default { background: #57ae10 none repeat scroll 0 0; border-radius: 5px; color: #fff; font-weight: 700; margin: 20px 0; padding: 6px 20px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .btn-default { border-color: #57ae10; } .price-filter-area .btn-default:hover { background: none; border: 1px solid #ffbb00; color: #ffbb00; } .price-filter > p {display: flex; } .price-filter-area label.range-text { color: #000; font-size: 13px; font-weight: normal; margin-right: 3px; } button.button { background: transparent none repeat scroll 0 0; border: 0 none; cursor: pointer; margin: 0; overflow: visible; padding: 0; width: auto; } .product-cart { background: #fff none repeat scroll 0 0; border: 1px solid #e2e2e2; border-radius: 4px; color: #484848; display: inline-block; font-size: 14px; font-weight: 600; line-height: 30px; padding: 0 25px; text-transform: uppercase; white-space: nowrap; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .product-cart:hover { background: #57ae10 none repeat scroll 0 0; color: #fff } .shop-page .news-letter-wrap.shop-news { margin-top: 65px; } /*tab-area*/ .tab-bar { border: 1px solid #ebebeb; border-radius: 4px; color: #3e3e3e; font-size: 12px; font-weight: 400; margin: 0 0 60px; overflow: hidden; padding: 15px 20px 9px; position: relative; } .tab-bar .tab-bar-inner { float: left; } .tab-bar-inner .nav-tabs { display: inline-block; overflow: hidden; padding: 0; } .tab-bar-inner .nav-tabs li { cursor: pointer; display: inline-block; text-transform: uppercase; } .nav-tabs {border-bottom: 0px solid; } .tab-bar-inner .nav-tabs > li.active > a, .tab-bar-inner .nav-tabs > li.active > a:focus, .tab-bar-inner .nav-tabs > li.active > a:hover {color: #57ae10; border: 0 solid; } .tab-bar-inner .nav-tabs > li > a { color: #363636; font-size: 19px; } .tab-bar-inner .nav-tabs a:hover {color: #57ae10; } .toolbar .sorter {float: right; width: 40%; } .sorter .sort-by {float: right; } .sorter .sort-by label { font-weight: normal; margin: 0 5px 0 0; vertical-align: middle; color: #363636; font-size: 14px; } .pager-list .limiter select, .sorter .sort-by select { background: #fff none repeat scroll 0 0; border: 1px solid #ebebeb; color: #363636; font-size: 14px; height: 28px; left: 95px; line-height: 28px; margin: 0 5px; min-width: 110px; padding: 2px 5px; text-align: center; vertical-align: middle; } .pager-list .limiter { color: #363636; float: right; font-size: 14px; } .pager-list .limiter select { margin: 0 5px; padding: 2px 5px; min-width: 40px; } .tab-bar-inner .nav > li > a:hover, .nav > li > a:focus { background-color: #fff; text-decoration: none; } .tab-bar-inner .nav-tabs > li > a { border: 0 solid transparent; padding: 0; } .toolbar a.up-arrow i { padding: 3px 5px; } .tab-bar-inner .grid,.tab-bar-inner .list { margin: 0 10px; font-size: 18px; text-transform: capitalize; } .tab-bar-inner .list {margin: 0 0 0 10px; } .pages {text-align: center; } .toolbar .pages {display: block; color: #363636; float: right; margin: 5px 0 0; font-size: 14px; font-size: 14px; } .toolbar .pages strong {font-weight: normal; } .toolbar .pages ol {display: inline; } .toolbar .pages .current {color: #f26522; text-decoration: underline; } .toolbar .pages li { display: inline; margin: 0 2px; } .toolbar .pages ol {padding: 0; } .toolbar a {color: #57ae10; margin: 0 0 1px; padding: 3px 5px; vertical-align: middle; font-size: 17px; } .shop-mar-bottom { margin-bottom: 50px; } .shop-article.text-left > p { line-height: 22px; font-size: 14px; } .add-to-cartbest.shop a span { line-height: 0px; } .product-single-wrap .single-content.shop-g,.product-single-wrap .prices.shop-g { margin: 0 0px; } .price-current.present-price.shop-price { display: inline-block; margin-left: 10px; } .add-to-cartbest.shop { background: #57ae10; display: inline-block; padding: 5px 20px; font-size: 14px; font-weight: 600; text-transform: capitalize; letter-spacing: 0.5px; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .add-to-cartbest.shop a { color: #fff; } .add-to-cartbest.shop:hover a { color: #222; } .add-to-link.shop a { font-size: 14px; background: #57ae10; display: inline-block; padding: 7px 20px 5px; margin-top: 20px; font-weight: 600; color: #fff; text-transform: capitalize; letter-spacing: 0.5px; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .add-to-link.shop a:hover,.add-to-cartbest.shop:hover { background: #e6e6e6; color: #222; } .product-single-wrap.shop-wrap,.product-single-wrap.hover.shop-wrap:hover .single-product { min-height: 420px; } .product-single-wrap.hover.shop-wrap { margin-bottom: 50px; } /*------------------- 39. Cart page --------------------- */ .cart-main-area { border-bottom: 1px solid #000; padding: 0 0 50px; } .table-content table { background: #fff none repeat scroll 0 0; border-color: #e5e5e5; border-radius: 0; border-style: solid; border-width: 1px 0 0 1px; margin: 0 0 60px; text-align: center; width: 100%; } .table-content table th { border-top: medium none; font-weight: normal; padding: 20px 10px; text-align: center; text-transform: uppercase; vertical-align: middle; white-space: nowrap; } .table-content table th, .table-content table td { border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; color: #444; font-weight: 600; } .table-content table td { border-top: medium none; font-size: 13px; padding: 20px 10px; vertical-align: middle; } .table-content table td input { background: #e5e5e5 none repeat scroll 0 0; border: medium none; border-radius: 3px; color: #6f6f6f; font-size: 15px; font-weight: normal; height: 40px; padding: 0 5px 0 10px; text-align: center; width: 60px; } .table-content table td.product-subtotal { font-size: 14px; font-weight: bold; width: 120px; } .table-content table td.product-name a ,.product-name > a{ color: #444; font-size: 20px; font-weight: 600; margin-left: 10px; letter-spacing: 1px; } .table-content table td.product-name{width: 270px;} .table-content table td.product-thumbnail{width: 130px;} .table-content table td.product-remove i { color: #444; display: inline-block; font-size: 20px; height: 40px; line-height: 40px; text-align: center; width: 40px; } .table-content table .product-price .amount { font-size: 15px; font-weight: 700; } .table-content table td.product-remove i:hover{color:#57ae10} .table-content table td.product-quantity{width: 180px;} .table-content table td.product-remove{width: 150px;} .table-content table td.product-price{width: 130px;} .table-content table td.product-name a:hover, .buttons-cart a:hover,.product-name > a:hover { color: #57ae10; } .buttons-cart { margin-bottom: 30px; overflow: hidden; } .buttons-cart input, .coupon input[type="submit"], .buttons-cart a, .coupon-info p.form-row input[type="submit"] { background: #252525 none repeat scroll 0 0; border: medium none; color: #fff; display: inline-block; float: left; font-size: 14px; font-weight: 600; height: 40px; letter-spacing: 1px; line-height: 40px; margin-right: 15px; padding: 0 15px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .buttons-cart input:hover, .coupon input[type="submit"]:hover, .buttons-cart a:hover { background: #57ae10 none repeat scroll 0 0; color: #fff; } .buttons-cart a { color: #fff; float: left; height: 40px; line-height: 40px; } .coupon { margin-bottom: 40px; overflow: hidden; padding-bottom: 20px; } .coupon h3 { font-size: 14px; margin: 0 0 10px; text-transform: uppercase; } .coupon input[type="text"] { border: 1px solid #e5e5e5; float: left; height: 40px; margin: 0 6px 20px 0; max-width: 100%; padding: 0 0 0 10px; width: 170px; } .cart_totals { float: left; text-align: right; width: 100%; } .cart_totals h2 { border-bottom: 2px solid #333; display: inline-block; font-size: 30px; margin: 0 0 35px; text-transform: uppercase; } .cart_totals table { border: medium none; float: right; margin: 0; text-align: right; } .cart_totals table th { border: medium none; font-size: 14px; font-weight: bold; padding: 0 20px 12px 0; text-align: right; text-transform: uppercase; vertical-align: top; } .cart_totals table td{border: medium none; padding: 0 0 12px; vertical-align: top; } .cart_totals table td .amount { color: #ffbb00; float: right; font-size: 13px; font-weight: bold; margin-left: 5px; text-align: right; text-transform: uppercase; } .cart_totals table td ul#shipping_method { list-style: outside none none; margin: 0; padding: 0; } .cart_totals table td ul#shipping_method li { float: left; margin: 0 0 10px; padding: 0; text-indent: 0; width: 100%; } .cart_totals table td ul#shipping_method li input { margin: 0; position: relative; top: 2px; } a.shipping-calculator-button { color: #6f6f6f; font-weight: bold; } a.shipping-calculator-button:hover { color: #eb3b60; } .cart_totals table tr.order-total th, .cart_totals table tr.order-total .amount { font-size: 20px; text-transform: uppercase; white-space: nowrap; } .wc-proceed-to-checkout a { background: #252525 none repeat scroll 0 0; color: #fff; display: inline-block; font-size: 14px; font-weight: 600; height: 45px; letter-spacing: 1px; line-height: 45px; margin-top: 20px; padding: 0 20px; text-transform: uppercase; } .wc-proceed-to-checkout a:hover { background: #57ae10 none repeat scroll 0 0; } /*---------------------- 40. Wishlist page ------------------------ */ .brand-area-wrap.wishlist{ padding: 40px 0 0 0; } wishlist-area { padding: 60px 0; } .wishlist-table table { background: #fff none repeat scroll 0 0; border-color: #e8e8e9; border-radius: 0; border-style: solid; border-width: 1px 0 0 1px; margin: 0; width: 100%; } .wishlist-table table th { font-weight: 600; } .wishlist-table table th, .wishlist-table table td { border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; color: #444; font-size: 14px; padding: 15px 10px; text-align: center; } .wishlist-table table .product-remove { padding: 0 15px; width: 20px; } .wishlist-table table .product-remove > a { color: #444; font-size: 25px; } .wishlist-table table .product-remove > a:hover{color:#57ae10; } .wishlist-table table .product-thumbnail { width: 150px; } .wishlist-table table td.product-price .amount { font-weight: 700; } .wishlist-table table .wishlist-in-stock { color: #57ae10; font-size: 14px; font-weight: bold; } .wishlist-table table .product-add-to-cart > a { background: #000 none repeat scroll 0 0; color: #fff; display: block; font-weight: 700; margin: auto; padding: 10px 15px; text-transform: uppercase; width: 180px; letter-spacing: 0.5px; } .wishlist-table table .product-add-to-cart > a:hover { background: #57ae10 none repeat scroll 0 0; } .wishlist-table table .product-add-to-cart { width: 240px; } .wishlist-share-wrap { padding: 60px 0 0; } .wishlist-share ul li a.facebook { background: rgba(0, 0, 0, 0) url("../public/images/icon/facebook.png") no-repeat scroll 0 0; } .wishlist-share ul li a.twitter { background: rgba(0, 0, 0, 0) url("../public/images/icon/twitter.png") no-repeat scroll 0 0; } .wishlist-share ul li a.pinterest { background: rgba(0, 0, 0, 0) url("../public/images/icon/pinterest.jpg") no-repeat scroll 0 0; } .wishlist-share ul li a.googleplus { background: rgba(0, 0, 0, 0) url("../public/images/icon/googleplus.png") no-repeat scroll 0 0; } .wishlist-share ul li a.email { background: rgba(0, 0, 0, 0) url("../public/images/icon/email.png") no-repeat scroll 0 0; } .wishlist-share ul li { display: inline-block; height: 30px; margin-left: 0; margin-right: 0; } .wishlist-share ul li a { background-position: left top; border: medium none; display: inline-block; height: 30px; width: 30px; } .wishlist-share ul li a:hover { background-position: left bottom; } .wishlist-share-title { font-size: 18px; font-weight: 700; text-transform: capitalize; } /*------------------------ 41. Single Product -------------------------*/ .single-page-area.padding-t { padding: 20px 0 0; } .single-ban-top-content > p { color: #fff; font-size: 40px; font-weight: 600; margin: 0; padding: 80px 0; text-transform: uppercase; } .signle-heading { background: #e3e3e3 none repeat scroll 0 0; margin: 0 0 60px; padding: 5px 0; } .signle-heading.about-us { margin: 0 0 0px; } .shop-head-menu ul li { display: inline-block; font-size: 17px; font-weight: 500; padding-right: 15px; letter-spacing: 1px; } .shop-head-menu ul li a { color: #000; font-size: 15px; font-weight: 500; } .shop-head-menu ul li:hover a { color: #57ae10; } .shop-home { padding: 0 15px 0 5px; } .shop-pro { color: #dd1e1e; } .single-procuct-view .simpleLens-big-image-container { width: 457px; } .single-procuct-view .simpleLens-lens-image { width: 457px; } .single-procuct-view .simpleLens-thumbnails-container { margin: 40px 72px; } .single-procuct-view .nav > li > a { padding: 0; width: 100%; } .single-procuct-view .nav-tabs { border: none; } .single-procuct-view .nav-tabs > li.active > a, .single-procuct-view .nav-tabs > li.active > a:focus, .single-procuct-view .nav-tabs > li.active > a:hover { background:none; border:none; } .single-procuct-view .nav-tabs li:last-child { margin-right: 0px; } .single-procuct-view .nav-tabs > li > a { border: medium none; } .single-procuct-view .owl-theme .owl-controls .owl-pagination { left: 10px; top: 115px; } .single-pro .product-name { border-bottom: 2px solid #000; margin: 0 0 37px; } .single-pro .product-name h3 a { font-size: 30px; } .single-pro .product-name.sing-sidebar-name h3 a { font-size: 27px; } .rating-links { display: inline-block; float: left; padding-left: 30px; } .rating-links.sing-sidebar-rating { padding-left: 10px; } .single-pro-rating { display: inline-block; float: left; } .pro-rating.single-p { display: inline-block; } .pro-price.single-p .normal-price { font-size: 20px; color: #57ae10; } .add-to-cartbest.single-add a span { float: left; display: inline-block; line-height: 20px; padding: 8px 20px; border: 2px solid #57ae10; margin-left: 30px; } .product-reveiw > p { font-size: 15px; line-height: 26px; margin: 20px 0 10px; } .social-icon-img { display: inline-block; margin: 30px 0 10px; } .qty-button { display: inline-block; float: left; } .qty-button input.input-text { background: #fff none repeat scroll 0 0; border: 2px solid #444; color: #363636; height: 40px; text-align: center; width: 110px; } .button-plus { display: inline-block; position: relative; } .button-plus input.qty-increase { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: medium none; color: #444; font-size: 18px; position: absolute; right: 8px; top: -18px; outline: none; } .button-minus { display: inline-block; position: relative; } .button-minus input.qty-decrease { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: medium none; color: #444; display: block; font-size: 25px; position: absolute; right: 88px; top: -20px; outline: none; } .add-to-link.single-p { bottom: 69px; left: inherit; } .single-pro-cart .fa-random { padding-right: 5px; } .single-product-description { margin: 70px 0 20px; } .product-description-tab { background: #f7f7f7 none repeat scroll 0 0; padding: 30px; } .product-description-tab ul.nav-tabs { border-bottom: 2px solid #ccc; } .product-description-tab.custom-tab .nav > li > a { color: #444; display: block; font-size: 14px; font-weight: 700; margin-right: 30px; padding: 10px 0; text-transform: uppercase; background: none; border: none; } .product-description-tab.custom-tab ul.nav-tabs li a:hover { color: #57ae10; position: relative; } .product-description-tab.custom-tab ul.nav-tabs li a:hover::after,.product-description-tab.custom-tab ul.nav-tabs li.active a::after { background: #57ae10 none repeat scroll 0 0; content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; } .product-description-tab.custom-tab ul.nav-tabs li.active a { color: #57ae10; position: relative; } #product-des > p { color: #444; } .product-description-tab p{line-height: 25px; font-size: 14px; } .product-description-tab .tab-content { margin: 40px 0; overflow: hidden; } .product-description-tab .product-action a { color: #898989; } .product-description-tab .product-action a:hover{ color: #39b3e4; } .product-description-tab .product-rev-left span.posted { font-style:italic; } .product-description-tab .product-ratting td { padding-right: 15px; } .product-description-tab .product-ratting td i { color: #ff9e21; } .product-description-tab .product-ratting td li.r-grey i { color: #c9c9c9; } .product-description-tab .product-rev-right h3{font-size:13px; color:#2b2b2b; } .product-description-tab .product-rev-right table{border: 1px solid #e1e1e1; width: 100%; } .product-description-tab .product-rev-right table thead {border-right: 1px solid #f2f2f2; color: #2c2c2c; font-size: 14px; font-weight: 700; padding: 10px; text-align: center; text-transform: uppercase; vertical-align: middle; white-space: nowrap; } .product-description-tab .product-rev-right table th { border-bottom: 1px solid #e1e1e1; border-right: 1px solid #e1e1e1; padding: 10px; } .porduct-rev-right-form{margin-top: 20px; } .porduct-rev-right-form label{color: #666; font-size: 13px; font-weight: normal; position:relative; } .porduct-rev-right-form label sup{color: #ec4445; font-size: 11px; position: absolute; right: -8px; top: 8px; } .product-form input, .product-form textarea{border: 1px solid #e3e3e3; border-radius: 0; box-shadow: none; margin-bottom: 10px; } .product-form input:focus, .product-form select:focus, .product-form textarea:focus { box-shadow:none; border: 1px solid #57ae10; } button.custom-button { background: #fff none repeat scroll 0 0; border: 2px solid #57ae10; color: #222; font-size: 14px; font-weight: 600; padding: 10px 20px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .product-form button { margin-top: 10px; float: right; } button.custom-button:hover { color: #57ae10; } .porduct-rev-right-form .form-group-button { border-top: 1px solid #e5e5e5; margin-top:30px; } #product-tag { overflow:hidden; } #product-tag .product-form { overflow: hidden; width: 100%; } #product-tag h2 { color: #444; font-size: 13px; font-weight: 600; text-transform: uppercase; } #product-tag label { display: block; margin-top: 15px; } #product-tag input { background: #f1f1f1 none repeat scroll 0 0; color: #222; float: left; height: 44px; margin-right: 10px; padding: 5px; width: 20%; } #product-tag button {float: left; line-height: 12px; margin-top: 0; padding: 13px 20px; } .quality-single-p ul li { display: inline-block; color: #57ae10; } .s-padding-t { padding-top: 65px; } .shop-news { margin-top: 110px; } .single-page .news-letter-wrap,.single-page .brands-area{ margin-top: 60px; } .signle-stock { color: #fa1c15; } /*size-choice*/ .skill-checklist { margin: 0px 0 20px; } .skill-checklist label { color: #999; } .skill-checklist select { border: 1px solid #4e4e4e; color: #222; height: 27px; padding: 0 5px; width: 25%; } .size-cho,.color-cho { color: #444; font-weight: 600; } #skillc > option { padding: 0 10px; } /*color-choice*/ .color-instock .skill-colors { overflow: hidden; width: 50%; } .italic { font-style: italic; } .skill-colors li { cursor: pointer; display: inline-block; height: 25px; margin-right: 3px; width: 25px; } .light-black { background: #434a54 none repeat scroll 0 0; } .skill-orange { background: #f39c11 none repeat scroll 0 0; } .skill-blue { background: #5d9cec none repeat scroll 0 0; } .skill-yellow { background: #f1c40f none repeat scroll 0 0; } .skill-green { background: #0da241 none repeat scroll 0 0; } .skill-grey { background: #c7c7c5 none repeat scroll 0 0; } .active-skill { border: 1px solid red; padding: 10px; } .active-skill { border: 4px solid #f00; } .color-instock { margin: 0 0 20px; } /*sidebar*/ .layout-title.left-sidebar-title h2 { display: block; width: 100%; color: #fff; padding: 13px 0; font-size: 21px; margin-top: 30px; font-weight: 700; } /*simplelence slider*/ .owl-theme .owl-controls .owl-pagination { margin: 0; position: absolute; right: 20px; top: -68px; } .owl-theme .owl-controls .owl-page { display: inline-block; } .owl-theme .owl-controls .owl-page span { background: #000 none repeat scroll 0 0; border: 0px solid #7b7b7b; outline: 1px solid #000; outline-offset: 3px; border-radius: 1px; display: block; height: 5px; margin: 5px 6px; opacity: 1; text-align: center; width: 20px; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .owl-theme .owl-controls .owl-page.active span { background: #57ae10 none repeat scroll 0 0; } .owl-theme .owl-controls.clickable .owl-page:hover span { background: ##ffbb00 none repeat scroll 0 0; } .add-to-link.single-p a { background: #57ae10; display: inline-block; padding: 6px 20px; font-size: 15px; color: #fff; transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; } .add-to-link.single-p a:hover { background: #d4d8d1; color: #000; } .single-pro-cart { margin: 30px 0 0 0; } /*------------------------ 42. Four-Zero-Four -------------------------*/ .four-zero-four { padding: 30px 0 100px; } .error-text > h1 { font-size: 100px; font-weight: 700; letter-spacing: 1px; padding: 0 154px 60px 0; text-align: center; text-transform: uppercase; } .four-zero-content a { background: #333333 none repeat scroll 0 0; color: #fff; display: inline-block; font-size: 15px; margin: 40px 0 0 383px; padding: 12px 30px; font-weight: 600; text-transform: uppercase; } .four-zero-content a:hover{background:#57ae10;color: #000; } .video-text p { font-size: 36px; text-align: left; } /*--------------------------- 43. Product Modal -----------------------------*/ .modal { z-index: 13000 } #productModal .modal-dialog { margin: 5% auto; max-width: 96%; min-height: 300px; padding: 20px; -webkit-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; width: 870px; } #productModal .modal-header { border: 0 none; padding: 0; min-height: auto; } #productModal button.close { position: absolute; right: 10px; top: 10px; transition: all 0.3s ease 0s; z-index: 2; -webkit-transition: all 0.3s ease 0s; } #productModal button.close:hover {opacity: 1; } #productModal button.close span {border: 1px solid #909295; border-radius: 60px; color: #909295; display: block; height: 30px; line-height: 25px; text-align: center; width: 30px; padding-top: 1px; } #productModal button.close:hover span { color: #ffbb00; } #quickview-wrapper .modal-content { border-radius: 0; } .modal-product { overflow: hidden; } .modal-product .product-images { float: left; width: 40%; } .modal-product .product-images .quick-thumbnails { float: left; width: 100%; } .modal-product .product-images .main-image {float: left; width: 100%; } .modal-product .product-images .main-image img { box-shadow: none; } .modal-product .product-info { float: left; padding-left: 30px; width: 60%; } .modal-product .product-info h1 {font-size: 22px; font-weight: normal; margin: 0 0 20px; } .modal-product .product-info .s-price-box .normal-price {color: #ffbb00; } .modal-product .product-info .see-all {color: #252525;display: inline-block; margin: 15px 0 25px;text-decoration: underline; text-transform: capitalize; } .numbers-row > input {float: left;height: 40px;text-align: center;width: 60px; border: none;border: 1px solid #ddd; } .quick-add-to-cart .single_add_to_cart_button { background: #42414f none repeat scroll 0 0;border: medium none;color: #fff;float: left;font-weight: 700;height: 40px; margin-left: 15px; padding: 0 70px; text-transform: uppercase; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .quick-add-to-cart .single_add_to_cart_button:hover{ background:#ffbb00; } .modal-product .product-info .see-all:hover { color: #ffbb00; } h3.widget-title-modal { color: #42414f;float: left;font-size: 16px;line-height: 30px; margin: 0 0 5px;text-align: left;text-transform: none;width: 100%; } .modal-product .product-info .quick-add-to-cart { border-bottom: 1px solid #ebebeb; float: left;margin: 0 0 20px; padding: 0 0 38px; width: 100%; } .modal-product .product-info .quick-desc { border-bottom: 1px solid #ebebeb; color: #909295;float: left;font-size: 14px;line-height: 21px;margin: 0 0 25px; padding: 0 0 15px; width: 100%; } .modal-product .widget { float: left; width: 100%; } .modal-product .widget .widget-title {background: none;color: #909295;float: left; font-size: 16px;line-height: 30px;margin: 0 0 5px;text-align: left; text-transform: none; width: 100%; } .modal-product .widget .social-icons { float: left;margin: 0;padding: 0; } .modal-product .widget > .social-icons > li {float: left;line-height: 30px;list-style: none; margin-right: 10px; } .modal-product .widget .social-icons li .social-icon { border: 1px solid #e5e5e5; border-radius: 3px; color: #909295; display: inline-block;font-size: 18px; line-height: 28px;text-align: center; width: 40px; } .modal-product .widget .social-icons li .social-icon:hover { color: #fff; } .modal-product .widget .social-icons li .social-icon.facebook:hover { background: #3e61be; border: 1px solid #3e61be; } .modal-product .widget .social-icons li .social-icon.twitter:hover { background: #3ACAFF; border: 1px solid #3ACAFF; } .modal-product .widget .social-icons li .social-icon.pinterest:hover { background: #CB2027; border: 1px solid #CB2027; } .modal-product .widget .social-icons li .social-icon.tumblr:hover { background: #304E6C; border: 1px solid #304E6C; } .modal-product .widget .social-icons li .social-icon.gplus:hover {background: #D11717; border: 1px solid #D11717; } .modal-product .widget .social-icons li .social-icon.linkedin:hover { background: #0097BD;border: 1px solid #0097BD; } /*-------------------------- 44. Preloader ----------------------------*/ .preloader { background-color: #fff; height: 100%; width: 100%; position: fixed; z-index: 1; margin-top: 0px; top: 0px; z-index: 99999999; } .loading-center { width: 100%; height: 100%; position: relative; } .loading-center-absolute { position: absolute; left: 50%; top: 50%; height: 150px; width: 150px; margin-top: -75px; margin-left: -75px; } .object { width: 20px; height: 20px; background-color: #ffbb00; float: left; margin-right: 20px; margin-top: 65px; -moz-border-radius: 50% 50% 50% 50%; -webkit-border-radius: 50% 50% 50% 50%; border-radius: 50% 50% 50% 50%; } .object.home-2 { background-color: #1096EB; } .object.home-3 { background-color: #0BC3CB; } .object.home-4 { background-color: #D8241F; } .object.home-5 { background-color: #C514D0; } .object.home-6 { background-color: #cd6419; } .object_one { -webkit-animation: object_one 1.5s infinite; animation: object_one 1.5s infinite; } .object_two { -webkit-animation: object_two 1.5s infinite; animation: object_two 1.5s infinite; -webkit-animation-delay: 0.25s; animation-delay: 0.25s; } .object_three { -webkit-animation: object_three 1.5s infinite; animation: object_three 1.5s infinite; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; } @-webkit-keyframes object_one { 75% { -webkit-transform: scale(0); } } @keyframes object_one { 75% { transform: scale(0); -webkit-transform: scale(0); } } @-webkit-keyframes object_two { 75% { -webkit-transform: scale(0); } } @keyframes object_two { 75% { transform: scale(0); -webkit-transform: scale(0); } } @-webkit-keyframes object_three { 75% { -webkit-transform: scale(0); } } @keyframes object_three { 75% { transform: scale(0); -webkit-transform: scale(0); } } /*---------------------------------- 45. Newsletter Popup Area ------------------------------------*/ #newsletter-popup-conatiner { background-color: rgba(0, 0, 0, 0.7); bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 9998; } #newsletter-popup { background: rgba(0, 0, 0, 0) url("../public/images/newsletter/1.jpg") repeat scroll 0 0; color: #ffffff; height: 400px; left: 50%; min-width: 450px; padding: 35px; position: absolute; text-align: left; top: 50%; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); width: 800px; } #newsletter-popup .hide-popup { background: #000000 none repeat scroll 0 0; border: 1px solid #ffffff; cursor: pointer; font-size: 12px; font-weight: bold; line-height: 24px; min-width: 70px; position: absolute; right: 0; text-align: center; text-transform: uppercase; top: -30px; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; } #newsletter-popup .hide-popup:hover { background: #ffbb00; } .title-subscribe h1 { font-size: 2.5em; font-weight: bold; line-height: 1; margin-bottom: 0; margin-top: 60px; color: #000; text-transform: uppercase; } #newsletter-form .content-subscribe {overflow: hidden} .form-subscribe-header label { color: #333; font-size: 1.1em; font-weight: normal; line-height: 25px; margin: 20px 0; max-width: 72%; } #newsletter-form .input-box, #newsletter-form .content-subscribe .actions {float: left} #newsletter-form .input-box .input-text { border: 1px solid #eeeeee; height: 40px; line-height: 40px; margin: 0 0 5px; padding-left: 10px; width: 380px; } #newsletter-form .actions .button-subscribe { background-color: #222222; border: medium none; color: #ffffff; font-size: 20; font-weight: bold; height: 40px; line-height: 40px; min-width: 115px; padding: 0 10px; text-transform: uppercase; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; } #newsletter-form .actions .button-subscribe:hover { background: #ffbb00; color: #fff; } .subscribe-bottom { color: #000000; display: block; margin-top: 15px; overflow: hidden; } .subscribe-bottom label { color: #000; font-size: 12px; margin-bottom: 0; } #dont_show { margin: 0; vertical-align: middle; } /*----------------------------- 46. Single Page Sidebar -------------------------------*/ .single-procuct-view.single-sidebar .simpleLens-lens-image { width: 340px; } .single-procuct-view.single-sidebar .simpleLens-thumbnails-container { margin: 40px 72px; } .single-sidebar .last-li img { width: 92px; } .signle-heading.single-side-heading { line-height: 15px; padding: 20px 13px; } /*----------------------------- 47. Home-10 -------------------------------*/ .banner-img { position: relative; overflow: hidden; } .single-ban-content { background: #fff none repeat scroll 0 0; bottom: -9px; left: 22px; padding: 10px 25px; position: absolute; z-index: 3; text-align: right; } .single-ban-content > h4 { font-size: 22px; margin: 3px 0; font-weight: 600; text-transform: capitalize; } .single-ban-content > p { font-size: 17px; margin: 0 0 5px; font-weight: 500; text-transform: capitalize; } .single-ban-content a { background: #57ae10 none repeat scroll 0 0; display: inline-block; font-size: 15px; font-weight: 500; padding: 3px 10px; text-transform: capitalize; border: 1px solid #57ae10; color: #fff; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .single-ban-content a:hover { background: none; color: #000; } /*category-box*/ .search-cat { position: relative; text-transform: capitalize; font-weight: 700; line-height: 40px; height: 40px; padding: 0; width: 190px; background: #FFFFFF; margin: 16px 0 0 38%; } .search-cat::before { color: #000; content: "\f0d7"; font-family: FontAwesome; font-size: 17px; font-weight: 700; left: 167px; position: absolute; top: 1px; } .category-items { background: rgba(0, 0, 0, 0) none no-repeat scroll 0 0; font-size: 13px !important; -moz-appearance: none; -webkit-appearance: none; border: 0 none; border-radius: 0; color: #333333; height: 40px; padding: 0 10px; left: 0; line-height: 40px; outline: medium none; overflow: hidden; position: absolute; width: 100%; z-index: 999; cursor: pointer; letter-spacing: 0.5px; } .home-10 .header-top-wrap { background: #F2F2F2 none repeat scroll 0 0; } .home-10 .header-mid-wrap { background: #d7d7d7; } .home-10 .mainmenu-area { background: #848484; } .home-10 .welcome-mg { color: #000; border-right: 1px solid #000; } .home-10 .phone_number { color: #000; } .home-10 .top-link-wrap .single-link a { color: #000; } /*--------------------- 48. Thankyou ----------------------*/ .thank-text h3{ font-size: 30px; color: #222; font-weight: 600; margin: 100px 0 0 0; line-height: 40px; } @import url('https://fonts.googleapis.com/css?family=Poppins|Ubuntu&display=swap'); .box { position: relative; width: 100%; padding-right: 15px; padding-left: 15px } .our-services { margin-top: 140px; padding-bottom: 30px; padding: 0 60px; min-height: 198px; text-align: center; border-radius: 10px; background-color: #fff; transition: all .4s ease-in-out; box-shadow: 0 0 25px 0 rgba(20, 27, 202, .17); max-height: 150px; } .our-services .icon { margin-bottom: -21px; transform: translateY(-50%); text-align: center } .our-services h4{ position: absolute; top: 150px; width: 100%; text-align: center; left: 0; } .our-services:hover h4, .our-services:hover p { color: #fff } .speedup:hover { box-shadow: 0 0 25px 0 rgba(20, 27, 201, .05); cursor: pointer; background-image: linear-gradient(-45deg, #fb0054 0%, #f55b2a 100%) } .settings:hover { box-shadow: 0 0 25px 0 rgba(20, 27, 201, .05); cursor: pointer; background-image: linear-gradient(-45deg, #34b5bf 0%, #210c59 100%) } .privacy:hover { box-shadow: 0 0 25px 0 rgba(20, 27, 201, .05); cursor: pointer; background-image: linear-gradient(-45deg, #3615e7 0%, #44a2f6 100%) } .backups:hover { box-shadow: 0 0 25px 0 rgba(20, 27, 201, .05); cursor: pointer; background-image: linear-gradient(-45deg, #fc6a0e 0%, #fdb642 100%) } .ssl:hover { box-shadow: 0 0 25px 0 rgba(20, 27, 201, .05); cursor: pointer; background-image: linear-gradient(-45deg, #8d40fb 0%, #5a57fb 100%) } .database:hover { box-shadow: 0 0 25px 0 rgba(20, 27, 201, .05); cursor: pointer; background-image: linear-gradient(-45deg, #27b88d 0%, #22dd73 100%) } .store-title{ font-size: 2rem; color: #000; text-shadow: -2px -1px 0 white, 2px 5px 5px rgb(0 0 0 / 22%), 12px 13px 18px rgb(0 0 0 / 6%); } .filter-list { text-align: center; padding: 5rem 0; text-transform: uppercase; width: 100%; } .filter-list h3{ display: block; } .filter-list .btn { cursor: pointer; text-transform: uppercase; padding: 0.5rem 1.5rem; border-radius: 0; } .filter-list .btn.active { background: #2e7ab5; color: #fff; } /* .product{ transition: 0.5s; margin-bottom: 2em; border:none; min-height: 42vh; } .product:hover { border: 1px solid #eee; border-radius: 10px; box-shadow: 0 0 5px 5px #235aab; transition: box-shadow .25s ease-in-out, border-radius .4s ease-in-out; } .product img{ width: auto; height: 196px; } .product .info{ display: flex; flex-direction: row; justify-content: flex-start; padding: 0.5em 1em; margin: 0 0 0.5em 0; background-color: #fff; } .product:hover .product .info{ display: flex; flex-direction: row; justify-content: flex-start; padding: 0 0!important; margin: 0 0 0 0!important; background-color: #235aab!important; transition: background-color .23s ease-in-out!important; } .product .info .name{ flex: 2 0 0; font-size: 1.3em; font-weight: 400; line-height: 1.4em; color: #2d7bb5; } .product .info .price{ font-size: 1.5em; font-weight: 600; color: #75b546; } .product .info .price .original-price{ color: #f54336; text-decoration: line-through; font-size: 0.7em; } .product .links{ display: flex; flex-direction: row; padding: 0.5em 1em; background-color: #fff; justify-content: center; align-items: center; } .product .links .more{ width: 150px; padding: 0.5em; text-transform: uppercase; text-align: center; color: #fff; background-color: #2e7ab5; } .product .links .more:hover{ text-decoration: none; opacity: .9; } .product .links .add-to{ margin-left: auto; padding: 0.5em; color: #fff; font-weight: 600; background-color: #75b545; text-transform: uppercase; } .product .links .add-to:hover{ text-decoration: none; opacity: .9; } @media screen and (min-width:300px) and (max-width:549px) { .product img{ margin-left: 20%; } } @media screen and (min-width:550px) and (max-width:768px) { .product img{ margin-left: 20%; } } @media screen and (min-width:768px) and (max-width:1024px) { .product img{ margin-left: 20%; } } @media screen and (min-width:1024px) and (max-width:1920px) { .product img{ margin-left: 20%; } } .mb-10-yuzde{margin-bottom: 10%;} .pb_90{ padding-bottom: 90px!important; } */ @import url('https://fonts.googleapis.com/css?family=Yantramanav:100,300'); /* ------------- */ /* GLOBAL STYLES */ /* ------------- */ * { box-sizing: border-box; } .contactFrame .container { margin-left: auto; margin-right: auto; padding: 1em; } @media screen and (min-width:240px) and (max-width:768px) { .contactFrame .container { width: 100%; } } @media screen and (min-width:768px) and (max-width:1920px) { .contactFrame .container { max-width: 1170px; } } .contactFrame ul { list-style: none; padding: 0; } .contactFrame .brand { text-align: center; font-weight: 300; text-transform: uppercase; letter-spacing: 0.1em; } .contactFrame .brand span { color: #ffffff; } .contactFrame .wrapper { box-shadow: 0 0 20px 0 rgba(57, 82, 163, 0.7); } .contactFrame .wrapper > * { padding: 1em; } /* ------------------- */ /* COMPANY INFORMATION */ /* ------------------- */ .contactFrame .company-info { background: #C3C9DD; border-top-left-radius: 4px; border-top-right-radius: 4px; } .contactFrame .company-info h3, .contactFrame .company-info ul { text-align: center; margin: 0 0 1rem 0; } /* ------- */ /* CONTACT */ /* ------- */ .contactFrame .contact { background: #dcdfea; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } /* ---- */ /* FORM */ /* ---- */ .contactFrame .contact form { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 20px; } .contactFrame .contact form label { display: block; } .contactFrame .contact form p { margin: 0; } .contactFrame .contact form .full { grid-column: 1 / 3; } .contactFrame .contact form button, .contactFrame .contact form input, .contactFrame .contact form textarea { width: 100%; padding: 1em; border: solid 1px #627EDC; border-radius: 4px; } .contactFrame .contact form textarea { resize: none; } .contactFrame .contact form button { background: #627EDC; border: 0; color: #e4e4e4; text-transform: uppercase; font-size: 14px; font-weight: bold; } .contactFrame .contact form button:hover, .contactFrame .contact form button:focus { background: #3952a3; color: #ffffff; outline: 0; transition: background-color 2s ease-out; } /* ------------- */ /* MEDIA QUERIES */ /* ------------- */ @media only screen and (min-width: 700px) { .contactFrame .wrapper { display: grid; grid-template-columns: 1fr 1fr; } .contactFrame .wrapper > * { padding: 2em; } .contactFrame .company-info { border-radius: 4px 0 0 4px; } .contactFrame .contact { border-radius: 0 4px 4px 0; } .contactFrame .company-info h3, .contactFrame .company-info ul, .contactFrame .brand { text-align: left; } } .company-info a:hover{ color: #000!important; font-weight: bolder!important; transition: color .45s ease-in-out; } .mapFrame{ width: 100%; height: 30vh; max-height:200px; background-color: #ddd; } .contactFrame input[type="email"]{ height: 47px; } .mt-10{margin-top: 10px;} @media screen and (min-width:768px) and (max-width:1920px) { .flex-prod-view-frame{ display: flex; justify-content: space-between; align-items: baseline; border-radius: 10px; background: transparent; width: 15vw; max-width: 15vw; } .customImageHeight{ height: 11vh; } } .single-brand a:hover img~span{ display: block!important; transition: display .45s ease-in-out; position: absolute; width: auto; text-align: center; background: #ddd; justify-content: center; display: flex!important; margin-top: 3px; margin-left: -12px; padding: 0px 4px; letter-spacing: 0px; font-size: 10px; align-items: center; flex: 1; width: 11vw; max-width: 11vw; } @media screen and (min-width:1145px) and (max-width:1920px) { .single-brand a:hover img~span{ margin-left: -6px; padding: 0px 4px; background: #57ae10; color: white; min-width: 186px; width: 100%; max-width: 186px; } } .top-banner-area, .top-banner-area.others-page { background: rgba(0,0,0,.45) url(../img/aboutFrame_bcg.b40986b4e324dfde37cd30b715f60ca3.png) repeat scroll 0 0; background-position-y: -115px; } .aboutUs-svgFrame { position: relative; bottom: 30px; right: 0; left: 0; width: 20%; height: 100%; margin: auto; } @media screen and (min-width: 768px) and (max-width: 1920px) { .section-heading h3 span { font-size: 20px; } } .Home_footerDB__1at7m, .Home_footerDN__3lJ4A { width: 100%; height: 70px; border-top: 1px solid #eaeaea; -moz-box-pack: center; justify-content: center; -moz-box-align: center; align-items: center; bottom: 0; display: flex; background: #fff; z-index: 100000000; color: #333; font-size: 13px; font-weight: 400; text-align: left; line-height: 30px; background: #fff; margin-top:30px; } @media only screen and (min-width: 1024px) { .mb_20_lg { margin-bottom: 100px; } } .targetPageLogo { margin:15px auto; max-height: 200px; } @media screen and (min-width: 1024px) and (max-width: 1920px) { .targetPageLogo { margin-left: 0; } } .brands{ display:block; width:100%; min-height:200px; margin-bottom:15px; line-height:200px; } .categories{ width:100%; min-height:300px; margin-bottom:15px; box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px; position:relative; vertical-align: middle; } .categories{ width:100%; min-height:300px; margin-bottom:15px; box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px; position:relative; vertical-align: middle; } .cattitle{ display:block; margin:5px; text-align:center; position:absolute; bottom:10px; width:100%; } /* products */ .wrapper{ list-style:none; margin:0; padding:0; width:auto; margin:30px auto 0; text-align:left; } .product{ width:250px; margin-right:20px; background-color:#FFFFFF; position:relative; min-height:auto !important; } .product:last-of-type{ margin-right:0; } .container-prod{ height:310px; overflow:hidden; position:relative; -moz-box-shadow: 0px 0px 0px 0px #F2F2F2; -webkit-box-shadow: 0px 0px 0px 0px #F2F2F2; box-shadow: 0px 0px 0px 0px #F2F2F2; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; } .container-prod:hover, .container-prod.information, .container-prod.social-sharing{ -moz-box-shadow: 0px 0px 5px 0px #333; -webkit-box-shadow: 0px 0px 5px 0px #333; box-shadow: 0px 0px 5px 0px #333; } .image{ height:270px; background-position:center; background-size:cover; background-repeat:no-repeat; -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease; } .information .image{ height:150px; } .container-information{ height:40px; overflow:hidden; -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease; background-color:#57ae10; color:#FFFFFF; } .information .container-information{ height:160px; } .container-information .title{ height:40px; line-height:40px; padding:0 10px; background-color:#57ae10; color:#FFFFFF; font-size:18px; font-weight:bold; position:relative; } .close{ width:40px; height:40px; text-align:center; line-height:40px; background-color:#11956c; position:absolute; right:-40px; -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease; color:#FFFFFF; } .information .close{ right:0; } .container-information .description{ padding:10px; height:120px; overflow-x:hidden; overflow-y:auto; } .sharing{ text-align:center; width:100%; position:absolute; bottom:-50px; overflow:hidden; -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease; background-color:#031E16; z-index:1; } .social-sharing .sharing{ bottom:40px; } .sharing a{ color:#FFFFFF; font-size:20px; width:25%; height:40px; line-height:40px; } .sharing a:hover{ color:#5DBA9D; } .buttons{ position:relative; z-index:2; } .buttons a{ text-align:center; width:25%; height:40px; line-height:40px; background-color:#11956c; color:#FFFFFF; text-decoration:none; position:relative; overflow:hidden; } .buttons a > span > span{ position:relative; z-index:3; display:block; width:100%; } .buttons a > span:before{ content:""; background-color:rgba(0,0,0,0); width:100%; height:40px; position:absolute; top:40px; left:0; z-index:1; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; } .buttons a:hover > span:before, .information .buttons a.more > span:before , .social-sharing .buttons a.share > span:before{ top:0; background-color:rgba(0,0,0,0.5); } .information .buttons a.more > span:before , .social-sharing .buttons a.share > span:before{ top:0; background-color:rgba(0,0,0,0.8); } .buttons a.cart.added > span:before{ top:0; background-color:rgba(255,255,255,0.8); } .buttons a.cart > span > span.check{ width:100%; height:40px; position:absolute; top:40px; left:0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; } .buttons a.cart.added > span > span.check{ top:0; color:#11956c; } .buttons a.cart > span > span.add{ width:100%; height:40px; position:absolute; top:0; left:0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; } .buttons a.cart.added > span > span.add{ top:-40px; } .buttons a i{ font-size:20px; } .buttons a:first-of-type{ width:50%; }