Файловый менеджер - Редактировать - /var/www/jonas-eriksen.dk/daddys/Domnoo/css/style.css
Назад
/* Template Name: Domnoo Version : 1.0 */ /*=========================== CSS INDEX ============================= 01. Fonts 02. @import CSS 03. Reset Stylesheet 04. CSS3 Animation 05. Header 06. Banner 07. Category 08. Special Offers 09. Deal Of The Day 10. Product Single 11. Shopping Cart 12. About us 13. Blog-Single 14. Blog 15. Demo Page /*============================================== 01. Fonts ==============================================*/ @import url('https://fonts.googleapis.com/css?family=Arizonia|Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i|Source+Sans+Pro:200,200i,300,300i,400,400i,600,600i,700,700i,900,900i'); /*============================================== 02. @import CSS ==============================================*/ @import url('flaticon.css'); @import url('magnific-popup.css'); @import url('animate.min.css'); @import url('slick.css'); @import url('slick-theme.css'); @import url('owl.carousel.min.css'); @import url('magnific-popup.css'); @import url('owl.theme.default.css'); @import url('nice-select.css'); @import url('dscountdown.css'); @import url('../font-awesome/css/fontawesome-all.min.css'); @import url('slick.css'); @import url('slick-theme.css'); /*============================================== 03. Reset Stylesheet ==============================================*/ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; } body { line-height:1; font-family: 'Roboto', sans-serif; } article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section { display:block; } nav ul { list-style:none; } blockquote, q { quotes:none; } blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; } a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; font-family: 'Roboto', sans-serif; } /* change colours to suit your needs */ ins { background-color:#ff9; color:#000; text-decoration:none; } /* change colours to suit your needs */ mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; } del { text-decoration: line-through; } abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; } table { border-collapse:collapse; border-spacing:0; } /* change border colour to suit your needs */ hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; } input, select { vertical-align:middle; } /*====== End Reset css =====*/ * { box-sizing: border-box; } body { margin: 0; font-weight: 400; } img { width: 100%; display: block; max-width: none; } a:hover, a:focus, a.active { text-decoration: none; outline: none; } a { color: #fff; } .parallax { background-size: cover !important; background-position: center !important; background-attachment: fixed !important; background-repeat: no-repeat !important; } .bg-full { background-size: cover; background-position: center; background-repeat: no-repeat; } #wrapper { position: relative; overflow: hidden; width: 100%; } .bg-gray { background: #f5f5f5; } .padding0 { padding:0; } .btn:focus, .form-control:focus { outline:none; -webkit-box-shadow:none; box-shadow:none; } /* NO-gutter */ .no-gutter,.no-gutter [class*='col-'] { padding: 0; } .no-gutter .row { margin-left: 0; margin-right: 0; } p { font-family: 'Source Sans Pro', sans-serif; font-size: 20px; font-weight: 400; } h1, h2, h3, h4, h5, h6 { font-family: 'Roboto', sans-serif; } h2 { font-weight: 700; } .fixed-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat !important; background-size: cover !important; background-position: center !important; z-index: -2; } .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index:-1; } /* loader */ .loader_wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #ffffff; z-index: 100000; text-align:center; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; visibility: visible; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .load .loader_wrapper { -webkit-transform: scale(10); -moz-transform: scale(10); -ms-transform: scale(10); -o-transform: scale(10); transform: scale(10); opacity: 0; visibility: hidden; } .loader { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10; width: 120px; } .loader img { width: 100%; max-width:700px; } /* End loader */ h1.loader2 { text-align: center; text-transform: uppercase; font-family: 'Nunito', sans-serif; font-size: 4.6875em; color: transparent; letter-spacing: 0.01em; } .loader2 span { text-shadow: 0 0 2px rgba(204, 208, 212,0.9), 0 15px 25px rgba(0, 0, 0, 0.3), 0 -2px 3px rgba(0, 0, 0, 0.1), 0 -5px 10px rgba(255, 255, 255, 0.5), 0 5px 10px rgba(0, 0, 0, 0.3), 0 3px 4px rgba(255, 255, 255, 0.2), 0 0 20px rgba(255, 255, 255, 0.45); animation: loading 0.85s ease-in-out infinite alternate; } @keyframes loading { to {text-shadow: 0 0 2px rgba(204, 208, 212,0.2), 0 0 3px rgba(0, 0, 0, 0.02), 0 0 0 rgba(0, 0, 0, 0), 0 0 0 rgba(255, 255, 255, 0), 0 0 0 rgba(0, 0, 0, 0), 0 0 0 rgba(255, 255, 255, 0), 0 0 0 rgba(255, 255, 255, 0);} } .loader2 span:nth-child(2) { animation-delay:0.15s; } .loader2 span:nth-child(3) { animation-delay:0.30s; } .loader2 span:nth-child(4) { animation-delay:0.45s; } .loader2 span:nth-child(5) { animation-delay:0.60s; } .loader2 span:nth-child(6) { animation-delay:0.75s; } .loader2 span:nth-child(7) { animation-delay:0.90s; } .nav-opener:hover, .nav-opener:active, .nav-opener:focus, .nav-opener:visited { color: #fff; } #cooking { position: relative; margin: 0 auto; top: 0; width: 300px; height: 300px; overflow: hidden; } #cooking .bubble { position: absolute; border-radius: 100%; box-shadow: 0 0 0.25vh #4d4d4d; opacity: 0; } #cooking .bubble:nth-child(1) { margin-top: 2.5vh; left: 58%; width: 3.5px; height: 3.5px; background-color: #454545; animation: bubble 2s cubic-bezier(0.53, 0.16, 0.39, 0.96) infinite; } #cooking .bubble:nth-child(2) { margin-top: 3px; left: 52%; width: 2px; height: 2px; background-color: #3d3d3d; animation: bubble 2s ease-in-out 0.35s infinite; } #cooking .bubble:nth-child(3) { margin-top: 2.8px; left: 50%; width: 2.5px; height: 2.5px; background-color: #333; animation: bubble 1.5s cubic-bezier(0.53, 0.16, 0.39, 0.96) 0.55s infinite; } #cooking .bubble:nth-child(4) { margin-top: 3.7px; left: 56%; width: 2.2px; height: 2.2px; background-color: #2b2b2b; animation: bubble 1.8s cubic-bezier(0.53, 0.16, 0.39, 0.96) 0.9s infinite; } #cooking .bubble:nth-child(5) { margin-top: 3.7px; left: 63%; width: 2.1px; height: 2.1px; background-color: #242424; animation: bubble 1.6s ease-in-out 1s infinite; } #cooking #area { position: absolute; bottom: 0; right: 0; width: 50%; height: 50%; background-color: transparent; transform-origin: 15% 60%; animation: flip 2.1s ease-in-out infinite; } #cooking #area #sides { position: absolute; width: 100%; height: 100%; transform-origin: 15% 60%; animation: switchSide 2.1s ease-in-out infinite; } #cooking #area #sides #handle { position: absolute; bottom: 18%; right: 80%; width: 35%; height: 20%; background-color: transparent; border-top: 1vh solid #333; border-left: 1vh solid transparent; border-radius: 100%; transform: rotate(20deg) rotateX(0deg) scale(1.3, 0.9); } #cooking #area #sides #pan { position: absolute; bottom: 20%; right: 30%; width: 50%; height: 8%; background-color: #333; border-radius: 0 0 1.4em 1.4em; transform-origin: -15% 0; } #cooking #area #pancake { position: absolute; top: 24%; width: 100%; height: 100%; transform: rotateX(85deg); animation: jump 2.1s ease-in-out infinite; } #cooking #area #pancake #pastry { position: absolute; bottom: 26%; right: 37%; width: 40%; height: 45%; background-color: #d4a54e; box-shadow: 0 0 3px 0 #ffe1aa; border-radius: 100%; transform-origin: -20% 0; animation: fly 2.1s ease-in-out infinite; } @keyframes jump { 0% { top: 24%; transform: rotateX(85deg); } 25% { top: 10%; transform: rotateX(0deg); } 50% { top: 30%; transform: rotateX(85deg); } 75% { transform: rotateX(0deg); } 100% { transform: rotateX(85deg); } } @keyframes flip { 0% { transform: rotate(0deg); } 5% { transform: rotate(-27deg); } 30%, 50% { transform: rotate(0deg); } 55% { transform: rotate(27deg); } 83.3% { transform: rotate(0deg); } 100% { transform: rotate(0deg); } } @keyframes switchSide { 0% { transform: rotateY(0deg); } 50% { transform: rotateY(180deg); } 100% { transform: rotateY(0deg); } } @keyframes fly { 0% { bottom: 26%; transform: rotate(0deg); } 10% { bottom: 40%; } 50% { bottom: 26%; transform: rotate(-190deg); } 80% { bottom: 40%; } 100% { bottom: 26%; transform: rotate(0deg); } } @keyframes bubble { 0% { transform: scale(0.15, 0.15); top: 80%; opacity: 0; } 50% { transform: scale(1.1, 1.1); opacity: 1; } 100% { transform: scale(0.33, 0.33); top: 60%; opacity: 0; } } @keyframes pulse { 0% { transform: scale(1, 1); opacity: 0.25; } 50% { transform: scale(1.2, 1); opacity: 1; } 100% { transform: scale(1, 1); opacity: 0.25; } } /*============== go-to-top ==============*/ .go-to-top { position:fixed; right:25px; bottom:-30px; color:#fff; font-size:2em; opacity:0; cursor: pointer; border-radius: 0px; padding: 11px; width: 60px; text-align: center; z-index: 8888; height: 60px; -webkit-box-shadow: 0 0 10px 1px rgba(000,000,000,0.1); box-shadow: 0 0 10px 1px rgba(000,000,000,0.1); } .go-to-top.goto { opacity: 1; right: 25px; bottom: 0px; } .go-to-top.goto:hover { bottom: 5px; } .pd0 { padding: 0; } .btn1 { line-height: 20px; padding: 10px; min-width: 189px; border-radius: 50px; display: inline-block; text-align: center; border: 2px solid; } .btn1.stl1 { border-color: #fff; } .btn1.stl2:hover,.btn1.stl1:hover { color: #fff; } .btn1.stl2:hover { background-color: transparent; border-color: #fff; } .btn2 { line-height: 1; padding: 8px; min-width: 178px; border-radius: 50px; display: inline-block; text-align: center; font-size: 14px; border:1px solid; } .btn3 { line-height: 1; padding: 10px; min-width: 145px; border-radius: 50px; display: inline-block; text-align: center; border: 2px solid; font-size: 12px; text-transform: uppercase; } .btn3:hover { background-color: transparent; } /*=============== Helper Classes ===============*/ .new-block { width: 100%; float: left; position: relative; } .new-block:after { content:''; display:block; clear: both; } [class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after { margin-left: 0; display: inline-block; } .clearfix { display: block; content: ""; width: 100%; clear: both; } .pd0 { padding: 0; } .pdT0 { padding-top: 0; } .pdB0 { padding-bottom: 0; } .mr0 { margin-right: 0; } .mrT0 { margin-top: 0; } .mrB0 { margin-bottom: 0; } /*============== style-switcher ==============*/ .theme-menu { position:fixed; top:15vh; left:-60px; z-index:99999; background: #fff; border: 1px solid #eee; width: 184px; padding: 8px; height: auto; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } .theme-menu button{margin-left: 0%; width: 50px; height: 50px;} .theme-menu button i{ font-size: 22px; color: #fff;} .btn-default:active:focus{ background-color: #eff0f2; border-color: #fff;} .theme-menu h2 { color: #5d5d5d; font-size: 18px; margin: 0; border-color: #fff; line-height: 8px; text-align: center; padding: 10px 5px; } .theme-menu ul.theme-btn { list-style-type:none; padding: 0; display: table; position:relative; display: inline; } .theme-menu ul li { width: auto; display: inline-table; padding:5px; float:left; } .theme-btn li p.btn.clr-style { width: 45px; height: 40px; position:relative; content:""; padding:0; } .theme-menu button.btn { background: #fff; border: 1px solid #eee; color:#fff; font-size:1.5em; position:absolute; right: -50px; top: 20px; padding:2px; border-radius: 0px; } .theme-menu button.btn:focus { outline: none; -webkit-outline: none; } .hide-sidebar { left: -184px; } .show-sidebar { left: 0; -webkit-box-shadow: 0 0 10px 1px rgba(000,000,000,0.1); box-shadow: 0 0 10px 1px rgba(000,000,000,0.1); } .btn-clr-clicked { opacity: 1; } #style-switcher { margin: 10px 0 0; } /*============================================== 04. CSS3 Animation ==============================================*/ .special-offer-block .nav>li>span:before, .blog-stl1 .img-holder:before, .blog-stl1 .img-holder .ovrl-block h3, .blog-stl1 .img-holder .ovrl-block .btn1, .social-nav li a i:before, .social-nav li a, .filter-tabnav .button-group li span:before, .block-stl14 .img-holder .overlay ul.social-nav li, .block-stl14 h5, .image-heading2 li a, .tags li a, .about li a, .about li i:before, .nws>p, .image-heading1 i:before, .special-offer-block .nav .filterer span:before, .block-stl2,.btn4,.btn1,.btn2,.btn3,.btn5, .block-stl2 .btn-sec, .block-stl2 .text-block, .main-footer .flickr ul li a, .footer-content ul.card-block li a, .go-to-top.goto, .go-to-top, .footer-content ul li a, .main-nav .nav ul li:before, .main-nav .nav ul li.drop>.drop-down, .this-month-blog .owl-nav .owl-next, .this-month-blog .owl-nav .owl-prev, .block-stl4 i:before, .f-contact ul li a, .f-contact ul li, .vid-block .img-holder, .bg-single .image-holder .overlay, .block-stl11, .block-stl11 i:before,.block-stl11 p, .review_slider .owl-nav .owl-next,.review_slider .owl-nav .owl-prev, .block-stl8 .img-holder img, .block-stl8 .txt-block i:before, .block-stl8, .block-stl2, .list-grid-sec.l-view .block-stl2 .text-block, .pegination-block .pagination>li>a, .history_slider .owl-nav .owl-next,.history_slider .owl-nav .owl-prev, .search-box, .slider1 .owl-nav .owl-next, .slider1 .owl-nav .owl-prev, .bg-single-neww .owl-nav .owl-next, .bg-single-neww .owl-nav .owl-prev, .bg-single .image-holder li, .bg-single .image-holder li a, .bg-single .image-holder li a i:before, .blog-pagination .pagination li a, .blog-pagination .pagination li a i:before, .blog-info-nav li a, .blog-info-nav li a i:before, .slick_next.slick-arrow, .slick_prev.slick-arrow, .slick_next.slick-arrow i:before, .slick_prev.slick-arrow i:before, .item-slider2 .owl-nav .owl-next i:before, .item-slider2 .owl-nav .owl-prev i:before, .item-slider2 .owl-nav .owl-next, .item-slider2 .owl-nav .owl-prev, .fastive-season .owl-nav .owl-next, .fastive-season .owl-nav .owl-prev, .block-stl1 h4, .block-stl1, .block-stl1 span:before, .main-nav .nav ul li.drop>.drop-down>li>a { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .list-grid-sec.l-view .block-stl2 .btn-sec { -webkit-transition: all 0.0s ease; -moz-transition: all 0.0s ease; -ms-transition: all 0.0s ease; -o-transition: all 0.0s ease; transition: all 0.0s ease; -webkit-transition-delay: 0ms; -moz-transition-delay: 0ms; -o-transition-delay: 0ms; transition-delay: 0ms; } .great-thankful .img-holder:before { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .animated { -webkit-animation-duration :3s; animation-duration :3s; -webkit-animation-delay : 500ms; animation-delay : 500ms; } .animate-out { -webkit-animation-delay : 0ms; animation-delay : 0ms; } /*============================================= 05. Header ==============================================*/ .main-header { background: #ffffff; z-index: 9; } .main-header .topnav { padding: 18px 0; } .main-nav { padding: 0 0; position: relative; z-index: 2; } .main-nav:before { content: ""; position: absolute; background: url('../images/brd.png'); background-repeat: repeat-x !important; width: 100%; height: 12px; bottom: -10px; z-index: 2; width: calc(100% - 13.1%); width: -webkit-calc(100% - 13.1%); width: -moz-calc(100% - 13.1%); background-position: 3px !important; } .main-nav .logo { width: 15.2%; float: left; padding: 25px 0 0 40px; position: relative; } .main-nav .logo:before { position: absolute; height: 100%; width: 1px; background: #000; } .logo .img-responsive { width: auto; display: inline-block; } .main-nav .nav { display: inline-block; width: 58.3%; padding: 0 0 0 0; text-align: right; float: left; } .main-nav .nav ul { float: right; display: inline-block; text-align: center; width: auto; } .main-nav .nav ul li { display: inline-block; margin: 0; float: left; position: relative; } .main-nav .nav ul li.active:before { content: ""; height: 4px; position: absolute; width: 100%; background: #fff; top: 0; left: 0; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .main-nav .nav ul li:hover:before { opacity: 1; } .main-nav .nav ul li:before { content: ""; top: 0; left: 0; width: 100%; position: absolute; height: 4px; opacity: 0; -webkit-transform: scale(0.0); -moz-transform: scale(0.0); -ms-transform: scale(0.0); -o-transform: scale(0.0); transform: scale(0.0); -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; -ms-transition: all 0.4s linear; -o-transition: all 0.4s linear; transition: all 0.4s linear; } .main-nav .nav ul li:hover:before { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; background: #fff; } .main-nav .nav ul li.active:before { opacity: 1; } .main-nav .nav ul li a { display: block; color: #fff; font-size: 17px; font-weight: 400; padding: 50px 22px; position: relative; border-radius: 50px; } .main-nav .nav ul li.active a { border-color: #fff; } .main-nav .nav ul li.drop { position: relative; } .main-nav .nav ul li.drop>.drop-down { position: absolute; width: 150px; background: #fff; left: 0; top: 120px; text-align: left; padding-top: 20px; -webkit-transform: translateX(10px); -moz-transform: translateX(10px); -ms-transform: translateX(10px); -o-transform: translateX(10px); transform: translateX(10px); opacity: 0; visibility: hidden; } .main-nav .nav ul li.drop>.drop-down li:before { display: none; } .main-nav.home2 .nav ul li.drop>.drop-down { top: 79px; padding: 0; } .main-nav .nav ul li.drop:hover>.drop-down { -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -ms-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px); opacity: 1; visibility: visible; } .main-nav .nav ul li.drop>.drop-down>li { display: block; width: 100%; } .main-nav .nav ul li.drop>.drop-down>li>a { color: #999; padding: 15px 20px; border-radius: 0px; } .main-nav .nav ul li.drop>.drop-down>li>a:hover { color: #fff; } .main-nav .nav-right-block { float: left; position: relative; padding: 40px 0 45px; background: #d70729; line-height: 35px; width: 13.1%; position: relative; right: -15px; text-align: center; } .main-nav .nav-right-block a { color: #fff; } .main-nav .nav-right-block i:before { font-size: 17px; display: inline-block; width: 34px; height: 34px; border:2px solid #fff; line-height: 30px; text-align: center; border-radius: 50%; margin-right: 5px; } .main-nav .nav-right-block:before { content: ""; position: absolute; background: url(../images/brd2.png); background-repeat: repeat-x !important; width: 100%; height: 17px; bottom: -16px; z-index: 3; background-position-x: -2px !important; left: 0; } .main-nav .location-block { width: 13.3%; display: inline-block; float: left; padding: 32px 0 0 40px; position: relative; z-index: 1; } .main-nav .location-block:after { content: ""; position: absolute; width: 0px; height: 70px; top: 20px; left: 0; border: 1px solid; border-left-color: #fff; border-right-color: #000; border-right-width: 1px; border-style: none solid; opacity: 0.2; } .main-nav .location-block p { color: #fff; font-size: 18px; font-weight: 400; margin-bottom: 5px; position: relative; } .main-nav .location-block p:before { position: absolute; content: "\f10c"; font-family: Flaticon; font-size: 15px; left: -20px; font-weight: bold; top: 2px; } .main-nav .location-block span { font-size: 22px; font-weight: 500; color: #fff; } /*============================================== 06. Banner ==============================================*/ .slider1 .slider-block { padding: 140px 0 75px 0; overflow: hidden; } .slider1 .slide1 .img-block.ab1 { min-height: 1px; position: relative; text-align: center; z-index: 1; } .slider1 .slide1 .img-block.ab1 img.img-responsive { position: absolute; bottom: -66px; width: 100%; height: auto; text-align: center; width: auto; left: 12.5%; } .slider1 .slide1 .img-block.img2 .img-holder { position: relative; left: 0; margin-left: 80px; } .slider1 .slide1 .img-holder { width: 100%; max-width: 666px; } .slider1 .owl-nav { margin: 0; } .slider1 .owl-nav .owl-next,.slider1 .owl-nav .owl-prev { margin: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); top: 50%; position: absolute; background: #ffffff; padding: 0; margin: 0; opacity: 0.2; padding: 70px 12px; color: #000000; } .slider1 .owl-nav .owl-next { right: 0; } .slider1 .owl-nav .owl-prev { left: 0; } .slider1 .owl-nav .owl-next:hover,.slider1 .owl-nav .owl-prev:hover { background: #ffffff; color: #000000; opacity: 1; } .slider1 .text-stl1 { font-size: 144px; color: #e4c5a6; font-weight: 900; text-transform: uppercase; text-align: center; line-height: 130px; } .slider1 .text-block { padding: 90px 0 0; max-width: 655px; float: right; position: relative; left: 65px; } .slider1 .number-block { position: relative; width: 100%; float: left; margin: 20px 0 0; padding: 35px 0; left: 20px; } .slider1 .number-block p { text-align: center; color: #ffffff; font-family: 'Source Sans Pro', sans-serif; font-weight: 100; font-size: 26px; line-height: 35px; margin-bottom: 15px; } .slider1 .number-block:after,.slider1 .number-block:before { content: ""; position: absolute; left: 0; background: #fff; width: 100%; height: 1px; } .slider1 .number-block:after { top: 0; } .slider1 .number-block:before { bottom: 0; } .slider1 .number-block .text-stl3 { font-size: 50px; color: #fff; text-align: center; } .slider1 .number-block .text-center a { margin: 24px 17px 5px; text-transform: uppercase; } .slider1 .number-block .text-center .btn1 { font-size: 16px; } .main-nav .nav-right-block span { font-family: 'Roboto', sans-serif; font-size: 18px; margin-left: 5px; } .img-holder.animated { -webkit-animation-duration :2s; animation-duration :2s; -webkit-animation-delay : 100ms; animation-delay : 100ms; } .text-stl1.animated { -webkit-animation-duration :2s; animation-duration :2s; -webkit-animation-delay : 50ms; animation-delay : 50ms; } .number-block.animated { -webkit-animation-duration :1s; animation-duration :1s; -webkit-animation-delay : 50ms; animation-delay : 50ms; } a.btn1.stl2.animated { -webkit-animation-duration :1.2s; animation-duration :1.2s; -webkit-animation-delay : 500ms; animation-delay : 500ms; } a.btn1.stl1.animated { -webkit-animation-duration :1.2s; animation-duration :1.2s; -webkit-animation-delay : 800ms; animation-delay : 800ms; } /*============================================== 07. Category ==============================================*/ .cat-sec { width: 100%; float: left; } .cat-sec { } .block-stl1 { width: 100%; float: left; text-align: center; padding: 45px 10px 25px; position: relative; z-index: 1; } .block-stl1 span:before { font-size: 65px; color: #fff; display: inline-block; margin-bottom: 5px; backface-visibility: hidden; } .block-stl1 h4 { font-size: 25px; font-weight: 400; color: #fff; backface-visibility: hidden; } .cat-sec .cat-block { width: 14.285%; display: inline-block; float: left; } .block-stl1:hover { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); -webkit-box-shadow: 0 0 10px 0 rgba(000,000,000,0.1); box-shadow: 0 0 10px 0 rgba(000,000,000,0.1); z-index: 2; } /*----------------------- Title -----------------------*/ .title { width: 100%; float: left; text-align: center; } .title p.top-h { font-family: 'Arizonia', cursive; font-size: 50px; } .title h2 { font-size: 50px; color: #000000; text-transform: uppercase; margin-top: 5px; } .title p.bottom-p { font-family: 'Source Sans Pro', sans-serif; font-size: 20px; color: #616161; line-height: 26px; margin-top: 10px; display: block; float: left; width: 100%; } .title .btm-style { width: 100%; float: left; display: block; } .title .btm-style span { width: 350px; display: inline-block; margin-top: 5px; } .title .btm-style span img { display: inline-block; margin: 0 10px; width: auto; float: left; } .title .btm-style span:before, .title .btm-style span:after { width: calc(50% - 49px); width: -webkit-calc(50% - 49px); width: -moz-calc(50% - 49px); display: inline-block; float: left; background: #dbdbdb; height: 1px; content: ""; position: relative; top: 7px; } /*============================================== 08. Special Offers ==============================================*/ .special-offers-sec { background: #ffffff; padding-bottom: 155px; } .special-offers-sec .title { margin-bottom: 30px; } .special-offer-inr-block { padding: 75px 60px 0; background: #f1f1f1; } .special-offer-block { text-align: center; } .special-offer-block .nav .filterer { font-size: 18px; padding: 15px; position: relative; float: left; color: #000000; cursor: pointer; } .block-stl2 .btn1.stl2 { font-size: 12px; } .special-offers-sec .slider-flr { position: relative; top: 104px; width: 100%; float: left; } .special-offer-block .nav .filterer { display: inline-block; background-color: transparent; } .special-offer-block .nav .filterer { background-color: transparent; } .special-offer-block .nav { display: inline-block; margin: 0 auto -36px; float: none; border-bottom: 1px solid #cccccc; } .special-offer-block .nav .filterer span:before { content: ""; position: absolute; bottom: -2px; height: 2px; width: 100%; left: 0; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } .special-offer-block .nav .filterer.active-btn span:before { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .special-offer-block .nav .filterer:hover span:before { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .block-stl2 { width: 100%; float: left; border: 1px solid; border-color: transparent; position: relative; z-index: 1; } .block-stl2 .img-holder { width: 100%; float: left; border: 1px solid; border-color: #e1e1e1; background: #fff; } .block-stl2 .text-block { width: 100%; float: left; padding: 18px 10px; text-align: center; position: relative; top: 0; } .block-stl2 .text-block h3 { font-size: 18px; color: #000000; margin-bottom: 5px; text-transform: uppercase; } .block-stl2 .text-block p { font-family: 'Source Sans Pro', sans-serif; } .block-stl2 .text-block p.sz { font-size: 18px; color: #a3a3a3; margin-bottom: 5px; } .block-stl2 .text-block p.price { color: #a3a3a3; } .block-stl2_dsn2.md2 { display: flex; -webkit-align-items: center; align-items: center; border: 1px solid #d3d3d3; background: #fff; position: relative; } .block-stl2_dsn2.md2:hover { border-color: #d3d3d3; } .block-stl2_dsn2.md2 .text-block p.price { margin-bottom: 11px; } .block-stl2_dsn2.md2 .img-holder { width: 46%; border: 1px; border-color:#d3d3d3; border-style: none solid none none; } .block-stl2_dsn2.md2:hover .img-holder { border-color: #d3d3d3; } .block-stl2_dsn2.md2 .text-block { width: 54%; text-align: left; padding: 10px 40px; } .block-stl2_dsn2.md2:hover .text-block p.price { opacity: 1; visibility: visible; } .block-stl2_dsn2.md2:hover .text-block { top: 0; } .block-stl2_dsn2.md2 .text-block .btn-sec, .list-grid-sec .grid .items-for-flr .block-stl2_dsn2.md2 .btn-sec { opacity: 1; top: 0; left: 0; margin: 0; position: relative; text-align: left; -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -ms-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px); } .block-stl2_dsn2.md2 .text-block .btn-sec .btn4 { min-width: 155px; } .block-stl2_dsn2.md2 .text-block .ab-it { display: block; } .list-grid-sec.l-view .grid .items-for-flr .block-stl2 { display: none; } .list-grid-sec.l-view .grid .items-for-flr .block-stl2_dsn2.md2 { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; } .list-grid-sec .grid .items-for-flr .block-stl2 { display: block; } .list-grid-sec .grid .items-for-flr .block-stl2_dsn2.md2 { display: none; } .block-stl2_dsn2 .text-block h3 { font-size: 18px; color: #000000; margin-bottom: 6px; text-transform: uppercase; } .block-stl2_dsn2 .text-block p.sz { font-size: 18px; color: #a3a3a3; margin-bottom: 6px; } .block-stl2_dsn2 .text-block .ab-it { display: none; font-size: 17px; margin-bottom: 7px; } .block-stl2_dsn2 .text-block p.price { color: #a3a3a3; font-family: 'Source Sans Pro', sans-serif; } .block-stl2_dsn2 .btn-sec a { margin-bottom: 10px; } .special-offer-block .owl-nav { margin: 0; } .special-offer-block .owl-nav .owl-next,.special-offer-block .owl-nav .owl-prev { margin: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); top: 50%; position: absolute; background: transparent; padding: 0; margin: 0; font-size: 40px; border-radius: 50%; overflow: hidden; } .special-offer-block .owl-nav .owl-next { right: -60px; } .special-offer-block .owl-nav .owl-prev { left: -60px; } .special-offer-block .owl-nav .owl-next i:before,.special-offer-block .owl-nav .owl-prev i:before { font-size: 40px; color: #dadada; } .special-offer-block .owl-nav .owl-next:hover i:before,.special-offer-block .owl-nav .owl-prev:hover i:before { color: #fff; } .spl-offer { padding: 0 0; } .block-stl3 { width: 100%; float: left; position: relative; z-index: 1; background: #f4edda; margin-bottom: 30px; overflow: hidden; } .block-stl3 .fixed-bg { -webkit-transition: all 4s linear; -moz-transition: all 4s linear; -ms-transition: all 4s linear; -o-transition: all 4s linear; transition: all 4s linear; } .block-stl3 .img-holder { width: 100%; float: left; } .block-stl3 .offer-block { position: absolute; width: 100%; max-width: 520px; z-index: 2; } .block-stl3.stl1 .offer-block { top: 45px; right: 0px; padding: 0 105px 0 0; } .block-stl3 .btn3 { margin: 12px 0 0; } .block-stl3 p { font-size: 18px; line-height: 22px; } .block-stl3 h2 { font-size: 40px; color: #181818; text-transform: uppercase; margin-bottom: 8px; } .block-stl3 p.top-h { font-size: 50px; font-family: 'Arizonia', cursive; margin-bottom: 2px; line-height: 1.1; } .c-grid { padding: 0; } .c-grid .grid1 { width: 60.01%; display: inline-block; float: left; padding: 0 15px; } .c-grid .grid2 { width: 39.99%; display: inline-block; float: left; padding: 0 15px; } .c-grid .fixed-bg { opacity: 0.1; } .bg9 { background: #f0f2c5; } .block-stl3.stl2 .offer-block { top: 120px; left: 45px; max-width: 318px; } .block-stl3.stl3 .offer-block { top: 125px; left: 35px; max-width: 318px; text-align: left; } .block-stl3.stl4 .offer-block { top: 55px; right: 0; max-width: 310px; text-align: left; padding: 0 25px 0 0; } .c-grid2 { width: 100%; float: left; } .c-grid2 .col1 { width: 49.6%; display: inline-block; float: left; padding-right: 15px; } .c-grid2 .col2 { width: 50.4%; display: inline-block; float: left; padding-left: 15px; } .block-stl3.stl4 { padding: 0 0 18px; } .block-stl3.stl3 { padding: 0 0 8px; } .slick_next.slick-arrow, .slick_prev.slick-arrow { display: inline-block; position: absolute; bottom: 55%; z-index: 999; border: 2px solid #dddddd; color: #dddddd; border-radius: 50%; width: 40px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); cursor: pointer; } .slick_next.slick-arrow i:before, .slick_prev.slick-arrow i:before { line-height: 36px; font-size: 15px; color: #a1a1a1; } .slick_next.slick-arrow:hover i:before, .slick_prev.slick-arrow:hover i:before { color: #fff; } .slick_next.slick-arrow { left: -40px; } .slick_prev.slick-arrow { right: -40px; } /*============================================== 09. Deal Of The Day ==============================================*/ .deal-of-day { padding: 100px 0 150px; } .deal-of-day .dsCountDown.ds-white { max-width: 336px; margin: 0 auto; position: relative; margin-bottom: 80px; padding: 0 20px; } .deal-of-day .title { margin-bottom: 35px; } .deal-of-day .ds-white .ds-element-value { font-size: 34px; } .deal-of-day .dsCountDown .ds-element-value { position: relative; } .deal-of-day .dsCountDown .ds-element-value:before, .deal-of-day .dsCountDown .ds-element-value:after { position: absolute; right: -2px; content: ""; width: 5px; height: 5px; background: #fff; border-radius: 50%; } .deal-of-day .dsCountDown .ds-element-value:before,.deal-of-day .dsCountDown .ds-element-value:before { top: 8px; } .deal-of-day .dsCountDown .ds-element-value:after, .deal-of-day .dsCountDown .ds-element-value:after { bottom: 8px; } .deal-of-day .dsCountDown .ds-element:nth-child(4) .ds-element-value:before, .deal-of-day .dsCountDown .ds-element:nth-child(4) .ds-element-value:after { display: none; } .deal-of-day .item-slider2 .owl-nav .owl-next, .deal-of-day .item-slider2 .owl-nav .owl-prev { top: 39%; } .deal-of-day .ds-white .ds-element-title { font-size: 16px; } .deal-of-day .owl-nav { margin: 0; } .deal-of-day .owl-nav .owl-next,.deal-of-day .owl-nav .owl-prev { margin: 0; transform: translateY(-50%); top: 50%; position: absolute; background: transparent; padding: 0; margin: 0; border-radius: 50%; overflow: hidden; } .deal-of-day .owl-nav .owl-next { right: -65px; } .deal-of-day .owl-nav .owl-prev { left: -65px; } .deal-of-day .owl-nav .owl-next i:before,.deal-of-day .owl-nav .owl-prev i:before { font-size: 40px; color: #d3d3d3; } .deal-of-day .owl-nav .owl-next:hover, .deal-of-day .owl-nav .owl-prev:hover { color: #fff; } .veg-nonveg { position: absolute; top: 10px; left: 10px; width: 20px; height: 20px; z-index: 2; border: 1px solid; border-color: #999; } .veg-nonveg:before { position: absolute; top: 3px; left: 3px; background: #000; content: ""; width: 12px; height: 12px; border-radius: 50%; } .veg.veg-nonveg { border-color: #00923f; } .veg.veg-nonveg:before { background: #00923f; } .nonveg.veg-nonveg { border-color: #ea1313; } .nonveg.veg-nonveg:before { background: #ea1313; } .block-stl2 .btn-sec { width: 100%; float: left; position: absolute; bottom: 8px; left: 0; visibility: hidden; text-align: center; opacity: 0; -webkit-transition-delay: 0ms; -moz-transition-delay: 0ms; -o-transition-delay: 0ms; transition-delay: 0ms; } .block-stl2 .btn-sec a { margin-bottom: 10px; } .btn4 { line-height: 20px; padding: 4px 10px; min-width: 189px; border-radius: 50px; display: inline-block; text-align: center; border: 2px solid; border-color: #dadada; color: #dadada; text-transform: uppercase; font-size: 12px; } .block-stl2 .btn1.stl2 { padding: 4px 10px; } .btn4:hover { color: #fff; } .block-stl2:hover .text-block { top: -60px; } .block-stl2:hover .text-block p.price { opacity: 0; } .block-stl2:hover { background: #fff; } .block-stl2:hover .img-holder { border-color: transparent; } .block-stl2:hover .btn-sec { opacity: 1; visibility: visible; -webkit-transition-delay: 200ms; -moz-transition-delay: 200ms; -o-transition-delay: 200ms; transition-delay: 200ms; } .amezing-offers { padding: 125px 0 0; } .amezing-offers .overlay { background: #383838; z-index: -1; } .amezing-offers .fixed-bg { z-index: -1; opacity: 0.09; } .amezing-offers .img-holder { position: relative; right: -40px; } .amezing-offers .img-holder img { width: auto; float: right; } .text-block-stl1 { width: 100%; float: left; padding: 20px 0 0 76px; max-width: 540px; } .text-block-stl1 .title { text-align: left; } .text-block-stl1 .title h2,.text-block-stl1 .title p.top-h,.text-block-stl1 .title p.bottom-p { color: #fff; } .btn1 { text-transform: uppercase; } .text-block-stl1 .btn1 { margin:0 10px 10px 0; } .text-block-stl1 .title h2 { font-size: 59px; } .text-block-stl1 .title .top-h { font-size: 60px; } .this-month { padding: 125px 0 45px; } .this-month .title { margin-bottom: 75px; } .this-month .block-stl2 { margin-bottom: 30px; /*padding-bottom: 60px;*/ } .this-month-blog { padding: 45px 0 0; } .this-month-blog .title { margin-bottom: 80px; } .blog-stl1 { width: 100%; float: left; } .blog-stl1 { position: relative; width: 100%; float: left; background: #fff; } .blog-stl1 .img-holder { position: relative; overflow: hidden; } .blog-stl1 .img-holder img { opacity: 0.5; } .blog-stl1 .img-holder .ovrl-block { position: absolute; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 50%; width: 100%; height: auto; padding: 0 40px; text-align: center; } .blog-stl1 .img-holder .ovrl-block h3 { font-size: 22px; color: #fff; margin-bottom: 10px; line-height: 30px; -webkit-transform: translateY(30px); -moz-transform: translateY(30px); -ms-transform: translateY(30px); -o-transform: translateY(30px); transform: translateY(30px); opacity: 0; } .blog-stl1:hover .img-holder .ovrl-block h3 { -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } .blog-stl1 .btn1 { max-width: 138px; padding: 7px 10px; font-size: 14px; -webkit-transform: translateY(40px); -moz-transform: translateY(40px); -ms-transform: translateY(40px); -o-transform: translateY(40px); transform: translateY(40px); opacity: 0; } .blog-info-nav { position: absolute; bottom: 0; left: 0; list-style: none; display: inline-block; } .blog-info-nav li { display: inline-block; margin: 0 0 10px 10px; } .blog-info-nav li a { display: inline-block; border-radius: 50px; color: #111111; padding: 8px 15px; display: block; background: #fff; font-size: 15px; } .blog-info-nav li a i:before { margin: 0 5px 0 0; font-size: 16px; font-weight: 400; vertical-align: middle; display: inline-block; } .blog-info-nav li a:hover, .blog-info-nav li a:hover i:before { color: #fff; } .blog-stl1:hover .btn1 { -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } .blog-stl1 .img-holder:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -ms-transform: scale(0.8); -o-transform: scale(0.8); transform: scale(0.8); opacity: 0; } .blog-stl1:hover { background: #403423; } .blog-stl1:hover .img-holder img { opacity: 1; } .blog-stl1:hover .img-holder:before { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 0.75; } .main-footer { background: #343a3c; padding: 135px 0 130px; } .main-footer p { color: #aab4b7; font-size: 16px; line-height: 22px; margin-bottom: 10px; } .footer-head { min-height: 60px; } .footer-head h3 { color: #ffffff; font-size: 20px; font-weight: 500; } .footer-content ul { display: block; width: 100%; float: left; } .footer-content ul.card-block { display: block; width: 100%; float: left; margin-top: 30px; } .footer-content ul.card-block li { display: inline-block; float: left; } .footer-content ul.card-block li:hover a { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); } .footer-content ul.card-block a { margin-right: 6px; } .footer-content ul li a { display: block; font-size: 16px; color: #aab4b7; line-height: 20px; padding: 0 0 10px 0; } .footer-content ul li a:hover { color: #fff; -webkit-transform: translateX(2px); -moz-transform: translateX(2px); -ms-transform: translateX(2px); -o-transform: translateX(2px); transform: translateX(2px); } .footer-content { width: 100%; float: left; } .footer-content a.link { color: #747d80; font-family: 'Source Sans Pro', sans-serif; text-decoration: underline; } .footer-content li { display: block; } .main-footer .flickr { width: 100%; max-width: 330px; position: relative; left: 8px; float: right; } .main-footer .flickr ul { display: block; width: 100%; float: left; } .main-footer .flickr li { width: calc(25% - 6px); width: -webkit-calc(25% - 6px); width: -moz-calc(25% - 6px); margin-right: 6px; float: left; margin-bottom: 8px; background: #000; } .main-footer .flickr li:nth-child(4n + 4) { float: right; } .main-footer .flickr li:nth-child(5n + 5) { clear: both; } .main-footer .flickr ul:hover li a { opacity: 0.6; -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -ms-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px); } .main-footer .flickr ul li:hover a { opacity: 1; } .main-footer .flickr li a { padding-bottom: 0; } .our-company { width: 100%; max-width: 230px; float: right; } .copy-right { width: 100%; float: left; background: #c10a28; padding: 35px 0; } .copy-right p { line-height: 34px; font-size: 16px; color: #e6e6e6; font-family: 'Roboto', sans-serif; font-weight: 300; display: inline-block; float: left; } .copy-right p>a { font-weight: 500; color: #fff; } .social-nav { display: inline-block; float: right; margin-right: 30px; } .social-nav li { display: inline-block; float: left; margin-left: 15px; } .social-nav li a { display: inline-block; line-height: 30px; border:2px solid #fff; text-align: center; width: 34px; opacity: 0.5; } .social-nav li a i:before { line-height: 30px; font-size: 16px; color: #fff; } .social-nav li:hover a { opacity: 1; -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); } .main-header.home2 { position: absolute; z-index: 3; width: 100%; height: auto; background-color: transparent; } .slider2 .fixed-bg:before { position: absolute; width: 100%; height: 100%; content: ""; background: #000; opacity: 0.8; z-index: 1; } .slider2 .video-wrap { z-index: -2 !important; } .slider2 .slide2 .img-block .img-holder img { width: auto; float: right; margin-right: 70px; } .main-nav.home2 { width: 100%; background-color: transparent; float: left; top: 0; border-style: solid; border: none; } .main-nav.home2:before,.main-nav.home2 .nav-right-block:before { background: none; display: none; } .banner.slider2 .slider-block { padding: 280px 0 0 0; min-height: 918px; } .banner.slider2 { overflow: hidden; } .banner.slider2 video { width: 100%; position: absolute; top: 0; left: 0; z-index: -1; } .main-nav.home2 .nav-right-block { background-color: transparent; } .slider2 .text-block-stl1 .title h2 { font-size: 48px; margin-top: 2px; } .slider2 .text-block-stl1 { padding: 140px 45px 0 0px; } .slider2 .text-block-stl1 .title .top-h { font-size: 50px; } .banner.slider2 .owl-nav { margin: 0; } .banner.slider2 .owl-nav .owl-next,.banner.slider2 .owl-nav .owl-prev { margin: 0; transform: translateY(-50%); top: 50%; position: absolute; background: transparent; padding: 0; margin: 0; } .banner.slider2 .owl-nav .owl-next { right: 30px; } .banner.slider2 .owl-nav .owl-prev { left: 30px; } .banner.slider2 .title p.bottom-p { color: #9f9f9f; margin-bottom: 20px; margin-top: 20px; } .banner.slider2 .owl-nav .owl-next i:before,.banner.slider2 .owl-nav .owl-prev i:before { font-size: 50px; color: #fff; } .nav-wrapper { width: 100%; float: left; text-align: center; } .home2 .location-block { color: #fff; padding: 20px 0; display: inline-block; float: left; } .home2 .logo { display: inline-block; margin: 0 auto; } .home2.main-nav .nav { width: 100%; text-align: center; } .home2.main-nav .nav ul { margin: 0 auto; float: none; } .home2.main-nav .nav ul li a { padding: 29px 30px; } .home2 .top-nav { padding: 44px 0 15px 0; } .home2 .location-block { min-width: 320px; text-align: left; } .home2 .location-block i:before { font-size: 37px; vertical-align: middle; margin-right: 40px; } .home2 .location-block p { position: relative; z-index: 1; font-size: 20px; font-family: 'Roboto', sans-serif; } .home2 .location-block p:before { position: absolute; content: "\f10c"; font-family: Flaticon; font-size: 15px; left: 58px; font-weight: bold; top: 10px; } .home2 .location-block p span { font-weight: 500; } .home2 .nav-right-block { float: right; padding: 29px 0; min-width: 320px; } .home2 .nav-right-block ul { display: inline-block; float: right; } .home2 .nav-right-block ul li { display: inline-block; float: left; position: relative; width: 24px; margin-left: 26px; text-align: center; } .home2 .nav-right-block ul li a { display: block; color: #fff; } .home2 .nav-right-block ul li .cart-block { position: absolute; bottom: -9px; right: -8px; line-height: 20px; min-width: 20px; text-align: center; color: #fff; border-radius: 50%; } .search-box { position: fixed; width: 100%; height: 100%; background: rgba(255,255,255,1); top: 0; left: 0; z-index: 8; opacity: 0; visibility: hidden; -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); } .search-box.active { opacity: 1; visibility: visible; transform: scale(1); } button.btn.btn-search.active { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .home2 .nav-right-block ul li .btn-search.active { z-index: 999; position: relative; } .home2 .nav-right-block ul .btn-search.active i { position: fixed; top: 40px; right: 50px; } .home2 .nav-right-block ul .btn-search.active i:before { color: #000; } .btn-search .flaticon-search { display: block; } .btn-search .flaticon-cancel { display: none; } .btn-search.active .flaticon-search { display: none; } .btn-search.active .flaticon-cancel { display: block; } .search-box .search-block { position: absolute; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); top: 50%; left: 50%; width: 100%; max-width: 800px; padding: 0 30px } .search-box .search-block .form-block { width: 100%; } .search-box .search-block .form-block .form-control { height: auto; border:2px solid #9b9b9b; height: auto; background-color: rgba(255,255,255,0.4); border-radius: 0; padding: 12px 50px 12px 20px; font-size: 20px; } .search-box .search-block .form-block .form-control:focus { outline: none; border-color: #fff; } .search-box .search-block .form-block .form-control:focus { border-bottom-color: #9b9b9b; } .search-form-btn { background: transparent; position: absolute; top: 0; right: 30px; z-index: 9; padding: 14px 13px; } .search-form-btn i:before { font-size: 25px; color: #9b9b9b; } .search-box .search-block .form-block .form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #9b9b9b; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .search-box .search-block .form-block .form-control::-moz-placeholder { /* Firefox 19+ */ color: #9b9b9b; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .search-box .search-block .form-block .form-control:-ms-input-placeholder { /* IE 10+ */ color: #9b9b9b; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .search-box .search-block .form-block .form-control:-moz-placeholder { /* Firefox 18- */ color: #9b9b9b; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .search-box .search-block .form-block .form-control:focus::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: transparent; } .search-box .search-block .form-block .form-control:focus::-moz-placeholder { /* Firefox 19+ */ color: transparent; } .search-box .search-block .form-block .form-control:focus:-ms-input-placeholder { /* IE 10+ */ color: transparent; } .search-box .search-block .form-block .form-control:focus:-moz-placeholder { /* Firefox 18- */ color: transparent; } .cat-sec.home2 { background: #f7f7f7; } .cat-sec.home2 .cat-block { width: 100%; } .cat-sec.home2 .block-stl1 { padding: 40px 10px 40px; } .tab-filter { padding: 50px 60px 0px 0; width: 100%; float: left; } .cat-sec.home2 .block-stl2 { background: #fff; padding: 25px 0 0; margin-bottom: 30px; } .cat-sec.home2 .block-stl2 .img-holder { border-color: transparent; } .cat-sec.home2 .block-stl2 .img-holder img { float: none; width: auto; margin: 0 auto; } .cat-sec.home2 .block-stl2 .text-block { padding: 18px 10px 45px; } .cat-sec.home2 .block-stl2:hover .text-block { top: -25px; } .cat-sec.home2 .block-stl2 .btn-sec { bottom: 0; } .cat-sec.home2 .block-stl2 .btn1.stl2 { font-size: 12px; } .cat-sec.home2 .list-unstyled { padding-right: 30px; } .cat-sec.home2 .list-unstyled li { position: relative; display: block; float: left; width: 100%; } .cat-sec.home2 .list-unstyled li .block-stl1:before, .domnoo-menu-filter2 .tab-flr-btn .block-stl1:before { content: ""; -webkit-clip-path: polygon(100% 0, 35% 51%, 100% 100%); clip-path: polygon(100% 0, 35% 51%, 100% 100%); width: 25px; height: 25px; background: #f7f7f7; position: absolute; top: 50%; right: -1px; opacity: 0; z-index: 3; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .cat-sec.home2 .list-unstyled li.active .block-stl1:before, .domnoo-menu-filter2 .tab-flr-btn .tab-flr-btn-btn-flr-active .block-stl1:before { opacity: 1; } .combopack-offer { width: 100%; float: left; padding: 80px 0 0; margin-bottom: 89px; } .combopack-offer .fixed-bg { z-index: -2; } .combopack-offer .overlay { z-index: -1; opacity: 0.8; background: #000; } .combopack-offer .text-block-stl1 { float: right; padding: 0px 0 0 70px; max-width: 570px; } .combopack-offer .img-block,.combopack-offer .img-block .img-holder { width: 100%; float: left; } .combopack-offer .title .bottom-p { margin-bottom: 25px; margin-top: 0; color: #939393 !important; } .combopack-offer .img-block .img-holder img { width: auto; } .combopack-offer .img-block .img-holder { position: relative; bottom: -89px; z-index: 1; left: -180px; } .combopack-offer .text-block-stl1 .title h2 { font-size: 48px; margin-bottom: 15px; } .combopack-offer .text-block-stl1 .title .top-h { font-size: 50px; } .most-popular { padding: 125px 0 100px; } .most-popular .title { margin-bottom: 50px; } .most-popular .block-stl2 { margin-bottom: 30px; } .block-stl3 { overflow: hidden; } .block-stl3.stl5 .offer-block { top: 90px; left: 95px; max-width: 430px; text-align: left; padding: 0 0 0 0; } .block-stl3.stl6 .offer-block { width: 310px; top: 55px; right: 100px; } .block-stl3.stl7 .offer-block { width: 310px; top: 55px; left: 62px; } .block-stl3:hover .fixed-bg { -webkit-transform: scale(1.2)rotate(3deg); -moz-transform: scale(1.2)rotate(3deg); -ms-transform: scale(1.2)rotate(3deg); -o-transform: scale(1.2)rotate(3deg); transform: scale(1.2)rotate(3deg); } .this-month-blog .owl-nav { margin: 0; } .this-month-blog .owl-nav .owl-next,.this-month-blog .owl-nav .owl-prev { margin: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); top: 50%; position: absolute; padding: 0; margin: 0; border-radius: 50%; overflow: hidden; border: 1px solid #dadada; padding: 8px; background: #fff; } .this-month-blog .owl-nav .owl-next { right: -65px; } .this-month-blog .owl-nav .owl-prev { left: -65px; } .this-month-blog .owl-nav .owl-next i:before,.this-month-blog .owl-nav .owl-prev i:before { color: #dadada; font-size: 16px; } .this-month-blog .owl-nav .owl-next:hover i:before, .this-month-blog .owl-nav .owl-prev:hover i:before { color: #fff; } .this-month-blog.home2 { padding: 70px 0 125px; } .blog-slider, .blog-slider1 { width: 100%; float: left; } .fastive-season { padding: 65px 0 0; margin-bottom: 103px; } .fastive-season .title { margin-bottom: -56px; position: relative; z-index: 9; } .fastive-season .title h2 { color: #fff; } .fastive-season .title p.bottom-p { color: #9f9f9f; } .fastive-season .overlay { background: #000; opacity: 0.8; } .fastive-season .item-slider1 { position: relative; z-index: 2; top: 104px; width: 100%; float: left; padding: 0 60px; } .fastive-season .owl-nav { margin: 0; } .fastive-season .owl-nav .owl-next, .fastive-season .owl-nav .owl-prev { top: 39%; } .owl-nav { margin: 0; } .fastive-season .owl-nav .owl-next,.fastive-season .owl-nav .owl-prev { margin: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); top: 38%; position: absolute; background: transparent; padding: 0; margin: 0; border: 2px solid #e1e1e1; padding: 9px; border-radius: 50%; overflow: hidden; background-color: transparent; } .fastive-season .owl-nav .owl-next { right: -0px; } .fastive-season .owl-nav .owl-prev { left: -0px; } .fastive-season .owl-nav .owl-next i:before,.fastive-season .owl-nav .owl-prev i:before { font-size: 14px; line-height: 16px; width: 16px; color: #d3d3d3; } .fastive-season .owl-nav .owl-next:hover i:before, .fastive-season .owl-nav .owl-prev:hover i:before { color: #fff; } .fastive-season .block-stl2 .img-holder { background: #fbfbfb; border-color: #fbfbfb; } .fastive-season .item-slider1 .item-slider1 .block-stl2:hover { background: #fbfbfb; } .great-thankful { padding: 90px 15px 0; } .th-slider { width: 100%; float: left; } .great-thankful .title { margin-bottom: 45px; } .great-thankful .img-holder { width: 100%; text-align: center; padding: 58px 0; position: relative; } .great-thankful .img-holder:before { position: absolute; content: ""; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .great-thankful .img-holder:hover:before { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .great-thankful .img-holder img { width: auto; margin: 0 auto; position: relative; z-index: 2; } .great-thankful .img-holder img.img1 { display: block; } .great-thankful .img-holder img.img2 { display: none; } .great-thankful .img-holder:hover img.img2 { display: block; } .great-thankful .img-holder:hover img.img1 { display: none; } .main-footer.home2 { background-color: transparent; } .main-footer.home2 .fixed-bg { opacity: 0.5; } .main-footer.home2 .overlay { background: #000; opacity: 0.9; } .f-contact { width: 100%; float: left; text-align: center; margin-bottom: 75px; } .f-contact ul { display: inline-block; margin: 0 auto; } .f-contact ul li { display: inline-block; float: left; max-width: 250px; padding: 0 10px; } .f-contact ul li a { color: #aab4b7; font-size: 20px; font-family: 'Source Sans Pro', sans-serif; line-height: 26px; display: block; float: left; width: 100%; } .f-contact ul:hover li { opacity: 0.5; } .f-contact ul li:hover { opacity: 1; } .f-contact ul li:hover a { color: #fff; opacity: 1; } .block-stl4 { width: 100%; float: left; text-align: center; } .block-stl4 i:before { font-size: 30px; display: inline-block; margin: 0 auto; color: #fff; line-height: 76px; width: 75px; margin-bottom: 20px; border-radius: 50%; } .block-stl4:hover i:before { -webkit-transform: translateY(-8px); -moz-transform: translateY(-8px); -ms-transform: translateY(-8px); -o-transform: translateY(-8px); transform: translateY(-8px); } .page-info { padding: 60px 0 55px; text-align: center; } .page-info h2 { font-family: 'Arizonia', cursive; font-size: 50px; color: #fff; margin-bottom: 15px; font-weight: 100; } .page-info .breadcrumb { display: inline-block; margin: 0 auto; background-color: transparent; } .page-info .breadcrumb li { display: inline-block; float: left; } .page-info .breadcrumb li a { font-size: 20px; color: #fff; } .page-info .overlay { background: #000; opacity: 0.9; } .page-info .breadcrumb>.active { color: #fff; } .domnoo-menu-filter { padding: 0 0 0 0; background-repeat: repeat; } .domnoo-menu-filter .fixed-bg { background-repeat: repeat !important; background-size: auto !important; } .domnoo-menu-filter .overlay { background: #f2f2f2; opacity: 0.9; } .domnoo-menu-filter .block-stl1 span:before { margin-bottom: 8px; } .domnoo-menu-filter .list-unstyled { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .domnoo-menu-filter .list-unstyled li { display: block; width: 100%; } .custom-contaier { width: 100%; float: left; } .items-for-flr { width: 25%; padding: 0 15px; margin-bottom: 30px; float: left; } .list-grid-sec.l-view .grid .items-for-flr { width: 50%; } .tab-flr-btn { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .tab-flr-btn li { width: 100%; cursor: pointer; } ul.button-group { list-style: none; } .custom-contaier.l-view .mix { width: 100%; } .domnoo-menu-filter .list-grid { background: #f6f6f6; margin-bottom: 80px; width: 100%; float: left; } .filter-tabnav { font-size: 15px; color: #505050; line-height: 20px; background: #f4f4f4; width: 100%; float: left; margin-bottom: 80px; } .filter-tabnav .showing-result { display: inline-block; float: left; font-size: 15px; margin-right: 35px; padding: 30px 0; } .filter-tabnav ol.filter-nav li { padding: 30px 0; line-height: 20px; color: #505050; } .list-grid-btns { display: inline-block; float: right; padding: 18px 0; } .list-grid-btns .btn { background: transparent; -webkit-box-shadow: none; box-shadow: none; } .list-grid-btns .btn.active { background-color: transparent; } .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus { outline: none; } .filter-tabnav .filter-nav { display: inline-block; float: left; } .filter-tabnav .filter-check-box { display: inline-block; float: left; padding: 17px 0; } /*Radio box*/ .filter-check input[type="radio"] + .label-text:before { content: "\f096"; font-family: "FontAwesome"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; -webkit-font-smoothing:antialiased; display: inline-block; float: right; line-height: 1; font-size: 30px; position: relative; right: 0; top: 0; } .filter-check input[type="radio"]:checked + .label-text:before { content: "\f14a"; animation: effect 250ms ease-in; } .filter-check input[type="radio"]:checked + .label-text { /*color: #1fb03a;*/ } .filter-check input[type="radio"]:disabled + .label-text{ color: #aaa; } .filter-check input[type="radio"]:disabled + .label-text:before{ content: "\f111"; color: #ccc; } /*Radio Toggle*/ .filter-check .toggle input[type="radio"] + .label-text:before{ content: "\f204"; font-family: "FontAwesome"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing:antialiased; width: 1em; display: inline-block; margin-right: 10px; } .filter-check .toggle input[type="radio"]:checked + .label-text:before{ content: "\f205"; color: #16a085; animation: effect 250ms ease-in; } .filter-check .toggle input[type="radio"]:disabled + .label-text{ color: #aaa; } .filter-check .toggle input[type="radio"]:disabled + .label-text:before{ content: "\f204"; color: #ccc; } @keyframes effect{ 0%{transform: scale(0);} 25%{transform: scale(1.3);} 75%{transform: scale(1.4);} 100%{transform: scale(1);} } .filter-check-box .form-check input { position: absolute; opacity: 0; z-index: -1; } .form-check { display: inline-block; margin-left: 18px; padding: 17px 0; } .filter-tabnav .label-text { position: relative; padding: 0 0 0 35px; line-height: 46px; display: inline-block; } .filter-check input[type="radio"] + .label-text:before { position: absolute; left: 0; top: 12px; right: unset; color: #eaeaea; } .list-grid-btns .btn { padding: 7px 0; margin-left: 18px; float: left; } .filter-tabnav ol.filter-nav .active.fl-btn:before { opacity: 1; } .filter-tabnav .sort-by { display: inline-block; float: left; line-height: 20px; margin: 0 20px 0 0; padding: 30px 0; } .filter-tabnav ul { display: inline-block; float: left; list-style-type: none; } .filter-tabnav ul li { display: inline-block; float: left; } .grid { width: 100%; max-width: 1200px; margin: 0 auto; } .filter-tabnav .button-group li { margin: 0 5px; cursor: pointer; } .filter-tabnav .button-group li span { padding: 30px 5px; display: inline-block; position: relative; } .filter-tabnav .button-group li span:before { position: absolute; z-index: 1; width: 100%; height: 2px; content: ""; left: 0; bottom: 0; opacity: 0; -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); -o-transform: scale(0.5); transform: scale(0.5); } .filter-tabnav .button-group li:hover span:before, .filter-tabnav .button-group li.tab-flr-btn-sort-btn-active span:before { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; } .filter-tabnav .button-group li.tab-flr-btn-sort-btn-active span:before { opacity: 1; } .form-check input { position: absolute; z-index: -2; opacity: 0; } .list-grid-btns { float: right; display: inline-block; } .pegination-block { width: 100%; float: left; } .pegination-block .pagination { margin-bottom: 80px; } .pegination-block .pagination>li:first-child>a, .pegination-block .pagination>li:last-child>a { border-radius: 0; } .pegination-block .pagination>li { display: inline-block; margin: 5px 12px 0; } .pegination-block .pagination>li i:before { line-height: 40px; font-size: 15px; } .pegination-block .pagination>li>a { line-height: 40px; min-width: 54px; } .pegination-block .pagination>li>a:hover { color: #fff; } .amezing-offers.stl2 { padding: 0; } .amezing-offers.stl2 .text-block-stl1 { float: right; padding: 65px 0 20px; max-width: 570px; } .amezing-offers .title p.bottom-p { margin-bottom: 20px; margin-top: 0; } .amezing-offers.stl2 .img-holder img { margin-bottom: -87px; } .amezing-offers.stl2 { margin-bottom: 86px; } .amezing-offers.stl2 .img-holder { right: 150px; } .amezing-offers.stl2 .overlay { background: #000; } .limited-deal { padding: 110px 0 120px; } .limited-deal .title { margin-bottom: 80px; } .limited-deal .text-block-stl1 { padding: 130px 0 0; max-width: 450px; } .limited-deal .text-block-stl1 .title h2 { color: #181818; font-size: 40px; } .limited-deal .text-block-stl1 .title .top-h { font-size: 50px; } .limited-deal .title p.bottom-p { color: #616161; font-size: 16px; line-height: 22px; margin-bottom: 15px; } .limited-deal .text-block-stl1 .title p.bottom { margin-top: 0; font-size: 18px; } .block-stl5 { width: 100%; float: left; position: relative; } .block-stl5 .overlay { background: #000; opacity: 0.9; } .block-stl5 .img-holder { position: relative; padding: 15px; } .block-stl5 .img-holder .lbl { position: absolute; top: -30px; left: -40px; } .block-stl5 .text-block { width: 100%; float: left; padding: 25px 10px; text-align: center; position: relative; top: 0; } .block-stl5 .text-block h3 { font-size: 18px; color: #000000; margin-bottom: 5px; text-transform: uppercase; } .block-stl5 .text-block p.sz { font-size: 18px; color: #a3a3a3; margin-bottom: 5px; } .block-stl5 .text-block p.price { color: #a3a3a3; } .limited-deal .nav-pills>li>a, .limited-deal .nav-pills>li.active a { padding: 0; background-color: transparent; } .limited-deal .nav-pills>li>a .img-holder { background-color: #f2f2f2; border:1px solid transparent; border-radius: 0px; padding: 0; margin-bottom: 12px; } .limited-deal .nav-pills>li>a span { display: block; text-align: center; padding: 10px 0; } .limited-deal .nav-pills>li { margin-right: 8px; } .limited-deal .text-block-stl1 .title { margin-bottom: 0; } .limited-deal .text-block-stl1 .title p.bottom-p { font-size: 18px; margin-bottom: 20px; } .block-stl2 .text-block .ab-it { display: none; font-size: 17px; margin-bottom: 6px; } .domnoo-menu-filter2 { width: 100%; float: left; } .domnoo-menu-filter2 .fixed-bg { background-repeat: repeat !important; background-size: inherit !important; } .domnoo-menu-filter2 .overlay { background: #f2f2f2; opacity: 0.9; } .domnoo-menu-filter2 .col1 { width: 270px; display: inline-block; float: left; } .domnoo-menu-filter2 .col2 { display: inline-block; width: calc(100% - 540px); width: -webkit-calc(100% - 540px); width: -moz-calc(100% - 540px); float: left; padding: 200px 0 0; position: relative; left: 0px; } .domnoo-menu-filter2 .tab-flr-btn { display: block; position: relative; z-index: 2; } .domnoo-menu-filter2 .filter-tabnav { position: absolute; right: 0; top: 0; z-index: 1; background-color: transparent; } .domnoo-menu-filter2 .bg_fff { background: #fff; } /*============================================== 10. Product Single ==============================================*/ .about-product { width: 100%; padding: 100px 0 200px; background: #fcfcfc; } .block-stl6 { width: 100%; float: left; } .about-product .img-holder { text-align: center; padding: 40px 0 0; } .about-product .img-holder img { width: auto; margin: 0 auto; } .block-stl6 h2 { color: #000000; font-size: 50px; font-weight: 900; position: relative; margin-bottom: 8px; } .block-stl6 h2 span.veg { position: relative; top: -30px; right: 7px; z-index: 1; left: unset; display: inline-block; } .img-holder { width: 100%; float: left; } .block-stl6 .price { font-size: 24px; font-weight: 400; color: #a3a3a3; } .block-stl6 .price span { color: #eb2424; text-decoration: underline; } .block-stl6 .price small { color: #a3a3a3; display: inline-block; } .block-stl6 .rating-star { margin-top: 8px; } .block-stl6 .rating-star i { color: #ffa727; font-size: 12px; vertical-align: middle; display: inline-block; } .block-stl6 .rating-star span { font-size: 16px; color: #757575; } .block-stl6 .ab-txt { font-size: 20px; line-height: 26px; margin-top: 20px; margin-bottom: 30px; } .form-block { width: 100%; float: left; } .form-block .form-group { width: 100%; float: left; margin-bottom: 30px; } .nice-select, .nice-select .list, .nice-select .option { width: 100%; } .nice-select:focus { border-color: #aeaeae; } .nice-select:after { width: 8px; height: 8px; } .form-block .form-group label { font-size: 20px; margin-bottom: 15px; font-weight: 500; } .nice-select.c_select { padding: 9px 20px; height: auto; } .nice-select.c_select span.current { font-size: 17px; color: #aeaeae; } .form-block .btn1 { width: 100%; margin-top: 15px; padding: 15px 0; } .form-block .btn1.stl1 { border-color: #dadada; color: #dadada; } .form-block .btn1.stl2:hover { border-color: #dadada; color: #dadada; } .form-block .btn1.stl1:hover { color: #fff; } .center-wrapper { width: 100%; float: left; } .center-wrapper .inner-wrapper { margin: 0 auto; background: #fff; width: 100%; position: relative; max-width: 1618px; top: -135px; z-index: 1; margin-bottom: -135px; overflow: hidden; } .center-wrapper .fixed-bg { background-repeat: repeat !important; -webkit-background-size: inherit !important; background-size: inherit !important; } .about-product-block { width: 100%; float: left; } .center-wrapper .overlay { background: #f7f7f7; opacity: 0.9; } .block-stl7 { padding: 70px 0 0 } .block-stl7 h4 { font-size: 18px; margin-bottom: 25px; text-transform: uppercase; } .block-stl7 p { font-size: 18px; line-height: 24px; color: #616161; margin-bottom: 30px; } .review-slider { width: 100%; float: left; padding: 10px 0px; } .block-stl8 { text-align: center; width: 100%; float: left; padding: 34px 100px 30px; border: 1px solid #ebebeb; background: #fbfbfb; } .block-stl8 .img-holder { text-align: center; padding-bottom: 25px; } .block-stl8 .img-holder img { width: auto; margin: 0 auto; } .block-stl8:hover .img-holder img { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); } .block-stl8 .txt-block { width: 100%; float: left; } .block-stl8 .txt-block p { font-size: 17px; font-style: italic; line-height: 22px; color: #616161; padding: 5px 0 0px; } .block-stl8 .txt-block h5 { color: #111111; font-size: 16px; margin-top: 10px; margin-bottom: 5px; } .block-stl8 .txt-block i:before { font-size: 12px; color: #616161; } .review_slider .owl-nav { margin: 0; } .review_slider .owl-nav .owl-next,.review_slider .owl-nav .owl-prev { margin: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); top: 50%; position: absolute; background: transparent; padding: 0; margin: 0; padding: 10px; border: 1px solid #dadada; border-radius: 50%; } .review_slider .owl-nav .owl-next:hover, .review_slider .owl-nav .owl-prev:hover { background-color: #fff; color: #fff; } .review_slider .owl-nav .owl-next:hover i:before, .review_slider .owl-nav .owl-prev:hover i:before { } .review_slider .owl-nav .owl-next { right: -65px; } .review_slider .owl-nav .owl-prev { left: -65px; } .review_slider .owl-nav .owl-next i:before, .review_slider .owl-nav .owl-prev i:before{ font-size: 20px; color: #dadada; } .related-products { width: 100%; float: left; padding: 135px 0 135px; } .related-products .title { margin-bottom: 70px; } .item-slider2 { width: 100%; float: left; } .item-slider2 .owl-nav { margin: 0; } .item-slider2 .owl-nav .owl-next, .item-slider2 .owl-nav .owl-prev { margin: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); top: 50%; position: absolute; background: transparent; padding: 0; margin: 0; border-radius: 50%; border: 1px solid #c9c9c9; overflow: hidden; } .item-slider2 .owl-nav .owl-next { right: -65px; } .item-slider2 .owl-nav .owl-prev { left: -65px; } .item-slider2 .owl-nav .owl-next i:before, .item-slider2 .owl-nav .owl-prev i:before { color: #dadada; font-size: 15px; line-height: 38px; display: inline-block; width: 38px; } /*============================================== 11. Shopping Cart ==============================================*/ .shopping-cart { width: 100%; padding: 115px 0 50px; } .block-stl9 { width: 100%; float: left; } .block-stl9 .img-holder { width: 112px; background: #fafafa; float: left; border:1px solid #ebebeb; } .block-stl9 .info-block { width: calc(100% - 112px); width: -webkit-calc(100% - 112px); width: -moz-calc(100% - 112px); float: left; padding: 5px 20px; } .block-stl9 .info-block h5 { font-size: 18px; color: #111111; text-transform: uppercase; } .block-stl9 .info-block .txt-cat { font-size: 16px; color: #a3a3a3; margin-bottom: 5px; } .block-stl9 .info-block .ab-txt-block { font-size: 16px; color: #616161; line-height: 22px; } .btn1.stl3 { border-color: #dadada; color: #dadada; min-width: auto; padding: 3px 25px; font-size: 12px; display: inline-block; } .btn1.stl3:hover { color: #fff; } .cart-tbl.table>tbody>tr>td { vertical-align: middle; } .cart-tbl .btn1 { margin-right: 10px; } .cart-tbl .p_dtl { width: 33%; } .cart-tbl .p_btn { width: 25%; text-align: center; } .cart-tbl .p_price { width: 15.5%; } .cart-tbl .p_quantity { width: 15.5%; } .cart-tbl .p_ttl { width: 10%; } .cart-tbl .quantity { display: inline-block; width: auto; margin: 0 auto; float: none; border: 1px solid #dcdcdc; padding: 3px 10px; } .quantity .quantity-button { display: inline-block; width: auto; font-size: 15px; padding: 0 0px; background: #dcdcdc; width: 21px; text-align: center; border-radius: 50%; cursor: pointer; } .quantity .form-control { width: 100%; max-width: 40px; display: inline-block; padding: 0; text-align: center; border-style: none; box-shadow: none; font-size: 16px; -webkit-box-shadow: none; } .quantity .quantity-button i:before { font-size: 8px; display: inline-block; vertical-align: middle; line-height: 20px; } .quantity input[type="number"]::-webkit-inner-spin-button, .quantity input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; } .cart-tbl thead th { font-size: 20px; font-weight: 500; } .cart-tbl.table>tbody { border-bottom: 1px solid #ddd; } .cart-tbl.table>tbody>tr>td, .cart-tbl.table>tbody>tr>th, .cart-tbl.table>tfoot>tr>td, .cart-tbl.table>tfoot>tr>th, .cart-tbl.table>thead>tr>td, .cart-tbl.table>thead>tr>th { padding: 40px 0; } .cart-tbl.table>thead>tr>th { border-bottom: none; } .cart-tbl.table>tbody>tr>td.p_price, .cart-tbl.table>tbody>tr>td.p_quantity, .cart-tbl.table>tbody>tr>td.p_ttl { font-weight: 700; font-family: 'Roboto', sans-serif; font-size: 18px; } .loc-cop-sum { padding: 0 0 150px; } .block-stl10 { width: 100%; float: left; background: #fafafa; border: 1px solid #ebebeb; padding: 30px 26px 75px; } .block-stl10 h3 { color: #000000; font-size: 20px; text-transform: uppercase; margin-bottom: 10px; font-weight: 600; } .block-stl10 p { color: #616161; font-size: 18px; line-height: 22px; margin-bottom: 20px; padding: 0 15px 0 0; } .block-stl10 .form-group { margin-bottom: 30px; } .block-stl10 .form-control { background: #fff; border-radius: 0px; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; padding: 13px 15px; height: auto; border-color: #ebebeb; } .block-stl10 .btn5 { background: #e3e3e3; color: #8d8d8d; min-width: 154px; padding: 5px 10px; border-radius: 40px; text-transform: uppercase; font-size: 12px; } .block-stl10 .btn5:hover { color: #fff; } .block-stl10 .list-unstyled { float: left; display: block; width: 100%; border-top: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb; margin-top: 20px; padding: 20px 0 20px; margin-bottom: 15px; } .block-stl10 .list-unstyled li { width: 100%; display: block; float: left; line-height: 20px; padding: 7px 0; } .block-stl10 .ttl, .block-stl10 .stts { font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 400; } .block-stl10 .ttl { float: left; } .block-stl10 .stts { float: right; font-weight: 500; } .block-stl10 .ttl-all { width: 100%; float: left; font-weight: 800; } .block-stl10 .odr-stts { float: right; } .block-stl10.odr-summary { padding-bottom: 16px; } .loc-cop-sum .btn1.stl2 { color: #fff; width: 100%; margin-top: 30px; } .loc-cop-sum .btn1.stl2:hover { background: transparent; } #map1 { width: 100%; height: 690px; float: left; } .block-stl11 { width: 100%; float: left; padding: 52px 65px 55px; text-align: center; background: #fff; } .block-stl11 i:before { display: inline-block; margin: 0 auto; color: #fff; font-size: 34px; line-height: 76px; width: 76px; text-align: center; border-radius: 50%; } .block-stl11 p { font-size: 20px; color: #616161; line-height: 26px; margin-top: 25px; } .block-stl11:hover { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); } .block-stl11:hover p { color: #fff; } .block-stl11:hover i:before { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); background: #fff; } .center-wrapper.cn-us .inner-wrapper { top: 0; margin-bottom: 0; } .send-msg { padding: 80px 0 40px; width: 100%; float: left; } .form-block1 { width: 100%; float: left; padding: 40px 0 80px; } .form-block1 .form-group { margin-bottom: 30px; } .form-block1 .form-control { border-radius: 0; height: auto; background: #fff; font-size: 18px; padding: 23px 18px; border-color: #e7e7e7; font-style: italic; } .form-block1 textarea.form-control { min-height: 268px; } .form-block1 .btn3 { color: #fff; padding: 15px 8px; min-width: 338px; font-size: 18px; line-height: 20px; margin-top: 10px; } /* Place Holder CSS */ .form-block1 input.form-control::-webkit-input-placeholder,.form-block1 textarea.form-control::-webkit-input-placeholder { color: #b7b7b7; opacity: 1; -webkit-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:-moz-placeholder,.form-block1 textarea.form-control:-moz-placeholder { color: #b7b7b7; opacity: 1; -moz-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control::-moz-placeholder,.form-block1 textarea.form-control::-moz-placeholder { color: #b7b7b7; opacity: 1; -moz-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:-ms-input-placeholder,.form-block1 textarea.form-control:-ms-input-placeholder { color: #b7b7b7; opacity: 1; -ms-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } /* Place Holder CSS for Focus */ .form-block1 input.form-control:hover::-webkit-input-placeholder,.form-block1 textarea.form-control:hover::-webkit-input-placeholder { opacity: 0.75; -webkit-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:hover:-moz-placeholder,.form-block1 textarea.form-control:hover:-moz-placeholder { opacity: 0.75; -moz-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:hover::-moz-placeholder,.form-block1 textarea.form-control:hover::-moz-placeholder { opacity: 0.75; -moz-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:hover:-ms-input-placeholder,.form-block1 textarea.form-control:hover:-ms-input-placeholder { opacity: 0.75; -ms-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } /* Place Holder CSS for Focus */ .form-block1 input.form-control:focus::-webkit-input-placeholder,.form-block1 textarea.form-control:focus::-webkit-input-placeholder { opacity: 0; -webkit-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:focus:-moz-placeholder,.form-block1 textarea.form-control:focus:-moz-placeholder { opacity: 0; -moz-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:focus::-moz-placeholder,.form-block1 textarea.form-control:focus::-moz-placeholder { opacity: 0; -moz-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:focus:-ms-input-placeholder,.form-block1 textarea.form-control:focus:-ms-input-placeholder { opacity: 0; -ms-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; } .form-block1 input.form-control:focus,.form-block1 textarea.form-control:focus { border-color: #b7b7b7 !important; color: #b7b7b7 !important; } .form-block1 input.form-control:focus,.form-block1 textarea.form-control:focus { border-color: #b7b7b7 !important; color: #b7b7b7 !important; } .form-block1 input.form-control:focus,.form-block1 textarea.form-control:focus { border-color: #b7b7b7 !important; color: #b7b7b7 !important; } .form-block1 input.form-control:focus,.form-block1 textarea.form-control:focus { border-color: #b7b7b7 !important; color: #b7b7b7 !important; } .form-block1 .title { margin-bottom: 30px; } .form-block1 .title h2 { font-size: 40px; text-transform: inherit; margin-top: 0; font-weight: 500; } /*============================================== 12. About us ==============================================*/ .about-us-block { padding: 0 0; overflow: hidden; } .about-us-block .col-custom1 { width: 48.8%; float: left; position: relative; } .about-us-block .col-custom2 { width: 51.2%; float: left; position: relative; } .about-us-block .img-holder { padding: 0 0px 0 0; } .block-stl12 { width: 100%; float: left; max-width: 600px; padding: 130px 0px 45px 69px; } .block-stl12 .title h2 { font-size: 39px; margin-bottom: 30px; } .block-stl12 .title { text-align: left; } .block-stl12>p { margin-bottom: 22px; font-size: 18px; line-height: 24px; color: #797979; } .block-stl12 ul { font-size: 18px; line-height: 24px; font-family: 'Source Sans Pro', sans-serif; padding-top: 15px; } .block-stl12 ul li { color: #181818; padding: 3px 0; } .block-stl12 ul li i { font-size: 12px; margin-right: 18px; } .about-us-block .fixed-bg { opacity: 0.05; } .our-history { padding: 85px 0 145px; } .our-history .title { margin-bottom: 65px; } .our-history .title h2 { color: #fff; } .our-history .title p.bottom-p { color: #fff; } .our-history .overlay { opacity: 0.8; background: #000000; } .block-stl13 { width: 100%; float: left; background: #fff; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .block-stl13:hover { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); } .our-history .history_slider { width: 100%; float: left; padding: 0 80px; } .block-stl13 h3 { font-size: 25px; margin-bottom: 25px; text-transform: uppercase; font-weight: 600; } .block-stl13 p { font-size: 18px; line-height: 24px; margin-bottom: 18px; color: #606060; } .block-stl13 .txt-container { width: 50.8%; display: inline; float: left; padding: 45px 20px 0 30px; } .block-stl13 .img-holder { width: 49.2%; display: inline; float: right; overflow: hidden; } .block-stl13 .img-holder img { -webkit-transition: all 0.9s linear; -moz-transition: all 0.9s linear; -ms-transition: all 0.9s linear; -o-transition: all 0.9s linear; transition: all 0.9s linear; } .block-stl13:hover .img-holder img { -webkit-transform: scale(1.1)rotate(2deg); -moz-transform: scale(1.1)rotate(2deg); -ms-transform: scale(1.1)rotate(2deg); -o-transform: scale(1.1)rotate(2deg); transform: scale(1.1)rotate(2deg); } /*.history_slider.owl-carousel { position: unset; } .history_slider.owl-carousel .owl-stage-outer { overflow: visible !important; }*/ .block-stl13 .btn1 { line-height: 20px; padding: 6px 10px; min-width: 145px; font-size: 12px; } .history_slider .owl-nav { margin: 0; } .history_slider .owl-nav .disabled { opacity: 0; } .history_slider .owl-nav .owl-next,.history_slider .owl-nav .owl-prev { margin: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); top: 50%; position: absolute; background: transparent; padding: 0; margin: 0; border-radius: 50%; padding: 12px; opacity: 0.8; } .history_slider .owl-nav .owl-next { right: 20px; } .history_slider .owl-nav .owl-prev { left: 20px; } .history_slider .owl-nav .disabled { opacity: 0; visibility: hidden; } .history_slider .owl-nav .owl-next:hover,.history_slider .owl-nav .owl-prev:hover { opacity: 1; } .history_slider .owl-nav .owl-prev:hover { left: 15px; } .history_slider .owl-nav .owl-next:hover { right: 15px; } .meet-our-chef { padding: 130px 0 110px; } .meet-our-chef .title { margin-bottom: 75px; } .block-stl14 { width: 100%; float: left; margin-bottom: 40px; } .block-stl14 h5 { padding: 30px 25px 20px; float: left; display: block; width: 100%; text-transform: uppercase; border-bottom: 2px solid #f3f3f3; } .block-stl14 .img-holder { position: relative; } .block-stl14 .img-holder .overlay { opacity: 1; z-index: 1; } .block-stl14 .img-holder .overlay:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; content: ""; opacity: 0; -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); -o-transform: scale(0.9); transform: scale(0.9); -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; -webkit-transition-delay: 500ms; -moz-transition-delay: 500ms; -o-transition-delay: 500ms; transition-delay: 500ms; } .block-stl14 .img-holder .overlay ul.social-nav { float: left; position: relative; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 50%; } .block-stl14 .img-holder .overlay ul.social-nav li { margin: 0 7px; } .block-stl14 .img-holder .overlay ul.social-nav li { opacity: 0; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); transform: translateY(10px); } .block-stl14 .img-holder .overlay ul.social-nav li i:before { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; } .block-stl14 .img-holder .overlay ul.social-nav li:nth-child(1) { -webkit-transition-delay: 100ms; -moz-transition-delay: 100ms; -o-transition-delay: 100ms; transition-delay: 100ms; } .block-stl14 .img-holder .overlay ul.social-nav li:nth-child(2) { -webkit-transition-delay: 200ms; -moz-transition-delay: 200ms; -o-transition-delay: 200ms; transition-delay: 200ms; } .block-stl14 .img-holder .overlay ul.social-nav li:nth-child(3) { -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; } .block-stl14 .img-holder .overlay ul.social-nav li:nth-child(4) { -webkit-transition-delay: 400ms; -moz-transition-delay: 400ms; -o-transition-delay: 400ms; transition-delay: 400ms; } .block-stl14:hover .img-holder .overlay ul.social-nav li { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); opacity: 1; } .block-stl14:hover .img-holder .overlay:before { opacity: 0.9; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); -webkit-transition-delay: 0ms; -moz-transition-delay: 0ms; -o-transition-delay: 0ms; transition-delay: 0ms; } .vid-sec { padding: 75px 0; background: rgb(000,000,000,0.8); } .vid-block { width: 100%; float: left; position: relative; background: #fff; } .vid-block:hover .img-holder { opacity: 0.4; } .vid-block .ovl { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width:auto; display: inline-block; z-index: 1; text-align: center; width: 100%; max-width: 400px; } .vid-block .img-holder { opacity: 0.2; } .vid-block .ovl h4 { font-size: 30px; font-weight: 400; color: #000000; text-align: center; margin-bottom: 25px; } .vid-block .ovl .video { display: inline-block; float: none; margin: 0 auto; } .vid-block .ovl .video i:before { font-size: 57px; display: inline-block; } .vid-block:hover .ovl .video i:before { animation: anim1 ease 1s; animation-iteration-count: 1; transform-origin: 50% 50%; animation-fill-mode:forwards; /*when the spec is finished*/ -webkit-animation: anim1 ease 1s; -webkit-animation-iteration-count: 1; -webkit-transform-origin: 50% 50%; -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ -moz-animation: anim1 ease 1s; -moz-animation-iteration-count: 1; -moz-transform-origin: 50% 50%; -moz-animation-fill-mode:forwards; /*FF 5+*/ -o-animation: anim1 ease 1s; -o-animation-iteration-count: 1; -o-transform-origin: 50% 50%; -o-animation-fill-mode:forwards; /*Not implemented yet*/ -ms-animation: anim1 ease 1s; -ms-animation-iteration-count: 1; -ms-transform-origin: 50% 50%; -ms-animation-fill-mode:forwards; /*IE 10+*/ } @keyframes anim1 { 0% { opacity:0; transform: translate(0px,-25px) ; } 100% { opacity:1; transform: translate(0px,0px) ; } } @-moz-keyframes anim1{ 0% { opacity:0; -moz-transform: translate(0px,-25px) ; } 100% { opacity:1; -moz-transform: translate(0px,0px) ; } } @-webkit-keyframes anim1 { 0% { opacity:0; -webkit-transform: translate(0px,-25px) ; } 100% { opacity:1; -webkit-transform: translate(0px,0px) ; } } @-o-keyframes anim1 { 0% { opacity:0; -o-transform: translate(0px,-25px) ; } 100% { opacity:1; -o-transform: translate(0px,0px) ; } } @-ms-keyframes anim1 { 0% { opacity:0; -ms-transform: translate(0px,-25px) ; } 100% { opacity:1; -ms-transform: translate(0px,0px) ; } } .gallery-sec { padding: 140px 0 45px; } .gallery-sec .title { margin-bottom: 65px; } .block-stl14.stl2 li { display: inline-block; padding: 5px; border-radius: 50%; background: rgba(255, 255, 255, 0.5); } .block-stl14.stl2 li a { background: rgba(208, 208, 208, 0.5); display: inline-block; text-align: center; border-style: none; border-radius: 50%; width: 62px; opacity: 1; } .block-stl14.stl2 li:hover a { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } .block-stl14.stl2 li:hover a { background: rgba(000,000,000,0.5); } .block-stl14.stl2 .social-nav li a i:before { line-height: 62px; } .block-stl14.stl2:hover .overlay:before { -webkit-transition-delay: 0ms; -moz-transition-delay: 0ms; -o-transition-delay: 0ms; transition-delay: 0ms; } /*============================================ 13. Blog-Single ==============================================*/ .blog-single { width: 100%; height: auto; float: left; padding: 145px 0 150px; } .bg-single .image-holder { width: 100%; height: auto; float: left; position: relative; overflow: hidden; } .bg-single .image-holder .overlay { opacity:0.4; z-index: 1; background: #ffffff; } .bg-single-neww:hover .image-holder .overlay { opacity: 0.3; } .bg-single-neww .image-holder img { -webkit-transition: all 20s linear; -moz-transition: all 20s linear; -ms-transition: all 20s linear; -o-transition: all 20s linear; transition: all 20s linear; } .bg-single-neww:hover .image-holder img { -webkit-transform: scale(1.5); -moz-transform: scale(1.5); -ms-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); } .bg-single .image-holder ul { display: inline-block; float: left; list-style-type: none; position: absolute; bottom:0; left: 0; z-index: 1; padding-bottom: 9px; } .bg-single .image-holder li { display: inline-block; float: left; margin: 0 0 5px 8px; font-size:14px; font-weight: 400; font-family: 'Roboto', sans-serif; color:#111111; border-radius: 50px; overflow: hidden; background-color:#fff; padding: 0; } .bg-single .image-holder li:hover a, .bg-single .image-holder li:hover a i:before { color: #fff; } .bg-single .image-holder li a { color:#111111; padding: 8px 14px; display: block; } .bg-single .image-holder i:before { margin: 0 5px 0 0; font-size:16px; font-weight: 400; vertical-align: middle; display: inline-block; } .bg-single .image-heading { width: 100%; float: left; padding-top: 34px; } .bg-single .image-heading h2{ font-size: 22px; font-weight:400; font-family: 'Roboto', sans-serif; color:#111111; margin-bottom: 15px; } .bg-single .image-holder .holder-new { border:1px solid #e2e2e2; } .bg-single-new .image-holder .holder-new img { -webkit-transition: all 2s linear; -moz-transition: all 2s linear; -ms-transition: all 2s linear; -o-transition: all 2s linear; transition: all 2s linear; } .bg-single-new .image-holder:hover .holder-new img { -webkit-transform: scale(1.2)rotate(1deg); -moz-transform: scale(1.2)rotate(1deg); -ms-transform: scale(1.2)rotate(1deg); -o-transform: scale(1.2)rotate(1deg); transform: scale(1.2)rotate(1deg); } .image-heading p { font-size: 18px; line-height:24px; font-weight: 400; font-family: 'Source Sans Pro', sans-serif; color:#848484; margin-bottom: 25px; } .image-heading1 { width: 100%; float: left; background-color:#fafafa; text-align: center; padding: 66px 0 64px 0px; margin: 25px 0 50px; } .image-heading1 i:before { font-size: 25px; font-weight: 400; line-height: 26px; color:#dfdfdf; text-align: center; } .image-heading1 p { font-size: 18px; font-weight: 400 ; line-height: 27px; font-style: italic; padding: 28px 100px; color:#545454; } .image-heading2{ width: 100%; float: left; padding: 15px 0px; border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; } .image-heading2 i{ font-size: 18px; line-height: 27px; color:#1e1e1e; display: inline-block; margin-right: 11px; } .image-heading2 ul{ display: inline-block; list-style: none; } .image-heading2 li{ display: inline-block; vertical-align: middle; } .image-heading2 li a { color: #000; font-size: 16px; font-weight:400; font-style: italic; padding: 0 16px; } .image-heading3{ width: 100%; float: left; padding:80px 0 27px 0; border-bottom:1px solid #e2e2e2; } .image-heading3 h2{ font-size: 20px; font-weight:700; color:#000000 ; margin-bottom: 37px; } .comment-block{ width: 100%; float: left; padding: 17px 0 33px 0px; } .comment{ width: 141px; float: left; padding: 0px 40px 0 0; } .comment-new{ width: calc(100% - 141px); width: -webkit-calc(100% - 141px); width: -moz-calc(100% - 141px); float: left; display: inline-block; color: #838d8f; padding: 36px 31px 36px; border: 2px solid #e2e2e2; border-radius: 35px; position: relative; } .comment-new:after{ content: ""; position: absolute; width: 180px; height: 180px; background:url(../images/bg.png); top: -2px; left: -35px; background-repeat: no-repeat; } .comment-new img { width:10%; position: absolute; } .comment-new ul { display: inline-block; float: left; list-style-type: none; bottom:0; left: 0; z-index: 2; padding-bottom: 9px; position: relative; z-index: 2; } .comment-new li { display: inline-block; float: left; font-size:14px; font-weight: 400; font-family: 'Roboto', sans-serif; color:#111111; border-radius: 50px; background-color:#fff; padding: 3px 12px; } .comment-new i:before { margin-right: 10px; font-size:16px; font-weight: 400; vertical-align: middle; } .comment-new p { font-size: 16px; line-height: 22px; font-weight: 400 ; float: left; padding: 5px 0px 0px 13px; } .comment-new a { float: right; font-size: 14px; font-weight: 400; text-decoration: underline; } .comment-short { width: 100%; float: left; padding-left: 88px; margin-bottom: 71px; } .leave-reply { width: 100%; float: left; padding: 58px 0 133px 0; } .form-group.nm { width: calc(50% - 15px); width: -webkit-calc(50% - 15px); width: -moz-calc(50% - 15px); display: inline-block; float: left; } .form-group.nm:nth-child(2) { float: right; } .leave-reply .form-group .form-control { border-color: #ececec; padding: 20px; color: #838d8f; font-size: 16px; font-weight: 400; font-family: 'Source Sans Pro', sans-serif; font-style: italic; background-color:#f9f9f9; border-radius: 0px; margin-bottom: 12px; box-shadow:none; -webkit-box-shadow:none; height: auto; } .leave-reply .form-group.nm:first-child { margin-right: 24px; } .leave-reply .form-group textarea.form-control { min-height:180px; margin-bottom: 30px; width: 100%; float: left; } .leave-reply .form-group button.btn1 { color: #fff; border: 1px solid; padding: 13px 20px; font-size: 14px; font-weight: 400; min-width: 230px; line-height: 1; border-radius: 50px; border:1px solid; } .leave-reply .form-group button.btn1:hover { background-color: transparent; } .leave-reply .form-group { margin-bottom: 15px; } .about{ width: 100%; float: left; padding: 28px 28px 15px; border:1px solid #e2e2e2; margin-bottom: 88px; background-color:#fbfbfb; } .about h2{ font-size: 20px; font-weight: 700; margin-bottom: 30px; } .about .img-holder { padding: 0 0 26px; } .about h3{ font-size: 18px; font-weight: 600; margin-bottom: 15px; } .about p{ font-size: 18px; font-weight: 400; line-height: 22px; color:#616161; margin-bottom: 23px; } .about h4{ font-size: 17px; font-weight: 400; line-height: 24px; } .about a { color: #111111; } .about-new{ width: 100%; float: left; } .about-new p{ font-size: 16px; font-weight: 400; font-family: 'Roboto', sans-serif; padding-top: 8px; color:#848484; } .about ul{ display: inline-block; margin-bottom: 12px; } .about li{ float: left; list-style-type: none; width: 100%; padding: 12px 0; } .about li:hover i:before { -webkit-transform: translateX(5px); -moz-transform: translateX(5px); -ms-transform: translateX(5px); -o-transform: translateX(5px); transform: translateX(5px); } .about li a { font-size: 18px; font-weight: 400; color:#7b7b7b; margin-left: 18px; } .about i:before{ font-size: 11px; font-weight: 400; color:#6c6c6c; } .about a:hover{ color:black; } .block_r { width: 100%; float: left; position: relative; margin-bottom: 74px; } .block_r1 .overlay { opacity:0.8; background-color:#131313; z-index: 1; } .content { position: absolute; top: 63%; left: 50%; -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); transform:translate(-50%, -50%); height: 160px; overflow: hidden; font-family: 'Roboto', sans-serif; font-size: 30px; line-height: 35px; color: #ecf0f1; z-index: 2; width: 100%; font-weight: 900; } .content_container { font-weight: 600; overflow: hidden; height: 70px; padding: 0 24px; } .content_container_text { display: inline; float: left; margin: 0; } .content_container_list { margin-top: 0; padding-left: 110px; text-align:center; list-style: none; -webkit-animation-name: change; -webkit-animation-duration: 10s; -webkit-animation-iteration-count: infinite; animation-name: change; animation-duration: 10s; animation-iteration-count: infinite; } .content_container_list_item { margin: 0; } @-webkit-keyframes opacity { 0%, 100% { opacity: 0; } 50% { opacity: 1; } } @-webkit-keyframes change { 0%, 12.66%, 100% { transform: translate3d(0, 0, 0); } 16.66%, 29.32% { transform: translate3d(0, -25%, 0); } 33.32%, 45.98% { transform: translate3d(0, -50%, 0); } 49.98%, 62.64% { transform: translate3d(0, -75%, 0); } 66.64%, 79.3% { transform: translate3d(0, -50%, 0); } 83.3%, 95.96% { transform: translate3d(0, -25%, 0); } } @-o-keyframes opacity { 0%, 100% { opacity: 0; } 50% { opacity: 1; } } @-o-keyframes change { 0%, 12.66%, 100% { transform: translate3d(0, 0, 0); } 16.66%, 29.32% { transform: translate3d(0, -25%, 0); } 33.32%, 45.98% { transform: translate3d(0, -50%, 0); } 49.98%, 62.64% { transform: translate3d(0, -75%, 0); } 66.64%, 79.3% { transform: translate3d(0, -50%, 0); } 83.3%, 95.96% { transform: translate3d(0, -25%, 0); } } @-moz-keyframes opacity { 0%, 100% { opacity: 0; } 50% { opacity: 1; } } @-moz-keyframes change { 0%, 12.66%, 100% { transform: translate3d(0, 0, 0); } 16.66%, 29.32% { transform: translate3d(0, -25%, 0); } 33.32%, 45.98% { transform: translate3d(0, -50%, 0); } 49.98%, 62.64% { transform: translate3d(0, -75%, 0); } 66.64%, 79.3% { transform: translate3d(0, -50%, 0); } 83.3%, 95.96% { transform: translate3d(0, -25%, 0); } } @keyframes opacity { 0%, 100% { opacity: 0; } 50% { opacity: 1; } } @keyframes change { 0%, 12.66%, 100% { transform: translate3d(0, 0, 0); } 16.66%, 29.32% { transform: translate3d(0, -25%, 0); } 33.32%, 45.98% { transform: translate3d(0, -50%, 0); } 49.98%, 62.64% { transform: translate3d(0, -75%, 0); } 66.64%, 79.3% { transform: translate3d(0, -50%, 0); } 83.3%, 95.96% { transform: translate3d(0, -25%, 0); } } .content ul { padding: 0px; } .content ul li{ width: 100%; } .tags{ width: 100%; float: left; } .tags h2{ font-size: 20px; font-weight: 700; font-family: 'Roboto', sans-serif; } .tags ul{ display: inline-block; } .tags ul li{ list-style:none; display: inline-block; } .tags li a{ font-size: 16px; font-weight: 400; color:#111111; line-height: 32px; padding: 0 18px; background-color:#e1e1e1; margin: 0 8px 10px 0; display: inline-block; } .tags li a:hover { color: #fff; } .tags-line{ width: 100%; float: left; margin: 34px 0 0 0; } /*============================================== 14. Blog ===============================================*/ .bg-single-neww { width: 100%; float: left; padding-bottom:50px; } .image-heading a { font-size: 18px; line-height: 22px; font-weight: 400; font-family: 'Source Sans Pro', sans-serif; color:#bfbfbf; position: relative; } .video-block { width: 100%; float: left; } .video-block.bg-single-neww:hover .image-holder .overlay { opacity: 0.6; } .video-block .holder-new .overlay { background-color:#111111; opacity: 0.8; } .bg-single-neww.video-block a.video { position: absolute; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); top: 50%; left: 50%; z-index: 2; color: #fff; } .bg-single-neww.video-block a.video i:before{ color: #fff; font-size: 50px; } .bg-single-neww.sound-block .image-holder ul { position: relative; padding: 28px 0 9px 0; } .bg-single-neww.sound-block iframe { height: 165px; width: 100%; display: block; } .bg-single-neww.sound-block .image-holder ul li { background: #f5f5f5; } .bg-single-neww .owl-nav { margin: 0; width: 100%; } .image-heading p>a { text-decoration: underline; } .bg-single-neww .owl-nav .owl-next, .bg-single-neww .owl-nav .owl-prev { -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); top: 50%; position: absolute; padding: 12px; margin: 0 16px; border-radius: 50px; width: 38px; height: 38px; background: transparent; border: 2px solid #dcdcdc; } .bg-single-neww .owl-nav .owl-next { right: 0; } .bg-single-neww .owl-nav .owl-prev { left: 0; } .bg-single-neww .owl-nav .owl-next i:before, .bg-single-neww .owl-nav .owl-prev i:before { font-size:12px; color:#e8e8e8; } .bg-single-neww .owl-theme .owl-nav [class*='owl-']:hover { background-color:#c10a28; color: #fff; text-decoration: none; } .blog-pagination .pagination { width: 100%; float: left; margin-top: 5px; display: inline-block; } .bg-single .blog-pagination .pagination { -webkit-transform: translateX(-12px); -moz-transform: translateX(-12px); -ms-transform: translateX(-12px); -o-transform: translateX(-12px); transform: translateX(-12px); } .blog-pagination .pagination li { display: inline-block; float: left; list-style-type: none; } .blog-pagination .pagination li a { color:#111111; font-size: 20px; margin: 0px 12px; padding: 11px 11px; min-width: 52px; text-align: center; } .blog-pagination .pagination li a:hover, .blog-pagination .pagination li a:hover i:before { color: #fff; } .blog-pagination .pagination i:before{ font-size: 20px; color:#323232; padding: 0px; } .slick-initialized .slick-slide { margin: 0 15px; } .pagination-center { width: 100%; text-align: center; } .pagination-center .pagination { width: auto; float: none; } /*============================================== 15. Demo Page ==============================================*/ .demo main { width: 100%; float: left; } .demo .banner2 { overflow: hidden; text-transform: uppercase; color: #fff; position: relative; padding: 0 0 0; float: left; width: 100%; } .demo .fixedbackground { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: repeat-x !important; background-size: cover !important; z-index: -2; } .demo .all-page-slider { text-align: center; width: 100%; float: left; height: 100vh; } .demo .all-page-slider .allpage { position: absolute; width: 100%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); top: 50%; left: 50%; } .demo .banner2 .logo { width: 170px; margin: 0 auto 40px; float: none; padding: 0; } .demo .banner2 .logo a img { max-width: 130px; } .demo .banner2 h1 { font-size: 70px; line-height: 86px; color: #fff; margin: 0 0 14px; letter-spacing: 1px; font-weight: bold; } .demo .banner2 h1 .clr { padding: 0 8px; } .demo .banner2 .btn { color: #fff; padding: 15px 40px; margin: 25px 0 0 0; } .demo .banner2 p { margin: 0 0 30px; text-transform: none; line-height: 30px; font-size: 21px; padding: 0 14% 0; } .demo .bannerbtn { background:transparent !important; border:2px solid #fff; } .demo .bannerbtn:hover { background:#df1840 !important; border-color:#df1840 !important; } .demo .main-holder { margin:0px 0 0; overflow:hidden; position:relative; z-index:2; width: 100%; float: left; background-attachment: fixed; padding: 120px 0 0; background: url('../../images/bg.jpg'); background-attachment: fixed; background-size: cover; } .demo .main-holder:before { position: absolute; top: 0; left: 0; width:100%; height: 100%; z-index: 1; background: #000; opacity: 0.85; content: ""; z-index: -1; } .demo .main-holder .txt-holder { padding: 30px 0; color: #fff; background: #161616; margin: 0 0 100px; font-family: 'Roboto', sans-serif; } .demo .main-holder .txt-holder .clr { padding: 2px 15px; border-radius: 20px; margin: 0 10px 0 0; background: #fff; color: #666; } .demo .main-holder .img-holder { width: 100%; overflow: hidden; margin: 0 0 30px; } .demo .main-holder strong { font-size: 20px; line-height: 22px; font-weight: 500; margin: 0 0 70px; color: #fff; letter-spacing: 1px; display: block; font-weight: 400; font-family: 'Roboto', sans-serif; } .demo #footer { overflow: hidden; background: #161616; width: 100%; float: left; } .demo #footer .footer-area { padding:20px; } .demo #footer .footer-area p { color: #9a9a9a; font-size: 14px; } .demo #footer .footer-area p a { font-size: 14px; } .demo .screen { display: block; height: 350px; overflow: hidden; position: relative; border: 2px solid #2f2f2f; border-radius: 1px; margin: 0 auto; } .demo .screen img { max-width: 100%; height: auto; position: absolute; z-index: 0; margin: auto; left: 0; right: 0; padding: 0; } .demo .copyright { background: #161616; color: #8b8b8b; } .demo .copyright a { color: #fff; } .demo .jumbotron { margin-bottom: 0; padding: 0 0 0 0; float: left; width: 100%; background: transparent; position: relative; z-index: 2; } .demo .intro-centered { position: relative; z-index: 1; width: 100%; float: left; } .demo .intro-centered .overlay.overlay-theme { z-index: 2; opacity: 0.95; background: rgb(240,18,5); background: -moz-linear-gradient(-45deg, rgba(240,18,5,1) 0%, rgba(255,159,21,1) 100%); background: -webkit-linear-gradient(-45deg, rgba(240,18,5,1) 0%,rgba(255,159,21,1) 100%); background: linear-gradient(135deg, rgba(240,18,5,1) 0%,rgba(255,159,21,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f01205', endColorstr='#ff9f15',GradientType=1 ); } .demo .intro-centered .demo-inner-wrapper { position: relative; z-index: 3; text-align: center; float: left; width: 100%; padding: 7vh 0 0; } .demo .intro-centered .demo-inner-wrapper img { margin: 0 auto; width: auto; } .demo .intro-centered .demo-inner-wrapper h1 { font-size: 42px; text-transform: capitalize; line-height: 42px; margin-bottom: 10px; margin-top: -5px; } .demo .intro-centered .demo-inner-wrapper p { font-size: 20px; color: #fff; text-transform: uppercase; font-size: 22px; font-family: 'Montserrat', sans-serif; font-weight: 500; } .demo .intro-centered .demo-inner-wrapper img.img-responsive { -webkit-transform: translateY(230px); -moz-transform: translateY(230px); -ms-transform: translateY(230px); -o-transform: translateY(230px); transform: translateY(230px); opacity: 0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; -webkit-transition-delay: 800ms; -moz-transition-delay: 800ms; -o-transition-delay: 800ms; transition-delay: 800ms; -ms-transition-delay: 800ms; } body.demo.load .intro-centered .demo-inner-wrapper img.img-responsive { -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } .demo .intro-centered .demo-inner-wrapper img.logo-d { -webkit-transform: translateY(50px); -moz-transform: translateY(50px); -ms-transform: translateY(50px); -o-transform: translateY(50px); transform: translateY(50px); opacity: 0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; -webkit-transition-delay: 200ms; -moz-transition-delay: 200ms; -o-transition-delay: 200ms; transition-delay: 200ms; -ms-transition-delay: 200ms; } body.demo.load .intro-centered .demo-inner-wrapper img.logo-d { -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } .demo .intro-centered .demo-inner-wrapper h1 { -webkit-transform: translateY(50px); -moz-transform: translateY(50px); -ms-transform: translateY(50px); -o-transform: translateY(50px); transform: translateY(50px); opacity: 0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; -webkit-transition-delay: 400ms; -moz-transition-delay: 400ms; -o-transition-delay: 400ms; transition-delay: 400ms; -ms-transition-delay: 400ms; } body.demo.load .intro-centered .demo-inner-wrapper h1 { -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } .demo .intro-centered .demo-inner-wrapper p { -webkit-transform: translateY(40px); -moz-transform: translateY(40px); -ms-transform: translateY(40px); -o-transform: translateY(40px); transform: translateY(40px); opacity: 0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; -webkit-transition-delay: 600ms; -moz-transition-delay: 600ms; -o-transition-delay: 600ms; transition-delay: 600ms; -ms-transition-delay: 600ms; } body.demo.load .intro-centered .demo-inner-wrapper p { -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } /*-------------- splash ---------------*/ .demo .body-2 { position: relative; overflow: hidden; background-size: cover; text-align: center; padding: 0em; color: rgba(255, 255, 255, 0.9); margin-bottom: 0px; border-bottom: none; background-color: #00B5AD; background-image: -webkit-radial-gradient(farthest-corner, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.95)); background-image: radial-gradient(farthest-corner, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.95)); } .demo .text { box-sizing: border-box; color: rgb(255, 255, 255); display: inline; font-family: Arial, Helvetica, sans-serif; font-size: 30px; font-weight: normal; height: auto; text-align: center; text-shadow: rgba(0, 0, 0, 0.2) 0px 0px 10px; text-transform: none; width: auto; z-index: 10000; } .demo .text a { color: aqua; font-weight: bold; } .demo .body-2 .grid { margin: 0em; padding: 15rem 0em; } .demo .body-2 { -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -ms-transition: background-color 3s ease-in-out 2s; -moz-transition: background-color 3s ease-in-out 2s; -webkit-transition: background-color 3s ease-in-out 2s; transition: background-color 3s ease-in-out 2s; -webkit-perspective: 1000px; -moz-perspective: 1000px; -o-perspective: 1000px; -ms-perspective: 1000px; perspective: 1000px; } .demo .following.bar iframe.github { margin-top: 0px; } .demo .pushed .body-2, .demo .pushed .following.bar { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .demo .colored.following.bar, .demo .body-2.colored { -webkit-animation-name: colors; -moz-animation-name: colors; -o-animation-name: colors; animation-name: colors; -webkit-animation-delay: 0s; -moz-animation-delay: 0s; -ms-animation-delay: 0s; -o-animation-delay: 0s; animation-delay: 0s; -webkit-animation-duration: 120s; -moz-animation-duration: 120s; -ms-animation-duration: 120s; -o-animation-duration: 120s; animation-duration: 120s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; animation-timing-function: linear; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; } .demo .body-2:after { position: absolute; z-index: 1; width: 135%; height: 150%; top: 0%; left: 0px; content: ''; background: url(../../images/ui.png); -moz-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-animation-name: splash; -moz-animation-name: splash; -o-animation-name: splash; animation-name: splash; -ms-transition: opacity 3s ease-in-out, transform 5s ease-in-out; -webkit-transition: opacity 3s ease-in-out, transform 5s ease-in-out; -moz-transition: opacity 3s ease-in-out, transform 5s ease-in-out; transition: opacity 3s ease-in-out, transform 5s ease-in-out; opacity: 1; -webkit-animation-duration: 15s; -moz-animation-duration: 15s; -ms-animation-duration: 15s; -o-animation-duration: 15s; animation-duration: 15s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; animation-timing-function: linear; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-transform: rotateX(50deg) rotateZ(0deg) rotateY(0deg) translateY(-14%) translateX(-14%) translateZ(370px); -moz-transform: rotateX(50deg) rotateZ(0deg) rotateY(0deg) translateY(-14%) translateX(-14%) translateZ(370px); transform: rotateX(50deg) rotateZ(0deg) rotateY(0deg) translateY(-14%) translateX(-14%) translateZ(370px); } .demo .fixed.following.bar { background-image: none; } .demo .fixed.following.bar { position: fixed; top: 0px; padding: 1em 0em; background-color: #FFFFFF; } .demo .fixed.light.following.bar { background-color: #FFFFFF; border-bottom: 1px solid #DDDDDD; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.04); } @keyframes splash { 0% { background-position: 0% 0%; } 100% { background-position: 0% -475px; } } @-moz-keyframes splash { 0% { background-position: 0% 0%; } 100% { background-position: 0% -475px; } } @-webkit-keyframes splash { 0% { background-position: 0% 0%; } 100% { background-position: 0% -475px; } } @-ms-keyframes splash { 0% { background-position: 0% 0%; } 100% { background-position: 0% -475px; } } @-o-keyframes splash { 0% { background-position: 0% 0%; } 100% { background-position: 0% -475px; } } @keyframes colors { 0% { background-color: #00B5AD; } 12% { background-color: #3B83C0; } 25% { background-color: #E07B53; } 37% { background-color: #D9499A; } 50% { background-color: #564F8A; } 62% { background-color: #F2C61F; } 75% { background-color: #D95C5C; } 87% { background-color: #5BBD72; } 100% { background-color: #F2C61F; } } @-moz-keyframes colors { 0% { background-color: #00B5AD; } 12% { background-color: #3B83C0; } 25% { background-color: #E07B53; } 37% { background-color: #D9499A; } 50% { background-color: #564F8A; } 62% { background-color: #F2C61F; } 75% { background-color: #D95C5C; } 87% { background-color: #5BBD72; } 100% { background-color: #F2C61F; } } @-webkit-keyframes colors { 0% { background-color: #00B5AD; } 12% { background-color: #3B83C0; } 25% { background-color: #E07B53; } 37% { background-color: #D9499A; } 50% { background-color: #564F8A; } 62% { background-color: #F2C61F; } 75% { background-color: #D95C5C; } 87% { background-color: #5BBD72; } 100% { background-color: #F2C61F; } } @-ms-keyframes colors { 0% { background-color: #00B5AD; } 12% { background-color: #3B83C0; } 25% { background-color: #E07B53; } 37% { background-color: #D9499A; } 50% { background-color: #564F8A; } 62% { background-color: #F2C61F; } 75% { background-color: #D95C5C; } 87% { background-color: #5BBD72; } 100% { background-color: #F2C61F; } } @-o-keyframes colors { 0% { background-color: #00B5AD; } 12% { background-color: #3B83C0; } 25% { background-color: #E07B53; } 37% { background-color: #D9499A; } 50% { background-color: #564F8A; } 62% { background-color: #F2C61F; } 75% { background-color: #D95C5C; } 87% { background-color: #5BBD72; } 100% { background-color: #F2C61F; } }
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Генерация страницы: 0 |
proxy
|
phpinfo
|
Настройка