/** ********************************************** ** @Author Dorin Grigoras @Website www.stepofweb.com @Last Update Wednesday, Apryl 26, 2017 TABLE CONTENTS ------------------------------- Globals Boxed Color Background Slide Top Parallax Social Icons Page Header Top Nav Menu Vertical Page Menu Scroll To Top Preloader Misc Material Design Landing Page Featured Grid Captions Aside Masonry Gallery Simple Gallery [CSS ONLY] Image Hover Sticky Side Parallax Social icons Word Rotator Sliders Standard Forms Messages Portfolio Item Box Mixitup Blog Comments Timeline Contact Error 404 Maintenance Login & Register Search Page Block Review Cards Category Grid Footer Responsive DEMO ONLY [remove on production] *************************************************** **/ /** Globals **************************************************************** **/ html, body { height:100%; direction: ltr; } body { color:#666; background-color:#fff; font-family:'Open Sans',Arial,Helvetica,sans-serif; -webkit-font-smoothing: antialiased; font-size:16px; line-height:1.5; margin:0; padding:0; } /* example usage: index-onepage-youtube.html */ body #wrapper {/* used by RTL*/ overflow:hidden; min-height:100%; /* because short page hide long menus */ } body.bg-grey, body.bg-grey #wrapper { background-color:#f1f2f7; } section { display: block; position: relative; padding: 80px 0; border-bottom:rgba(0,0,0,0.1) 1px solid; background-color: #fff; -webkit-transition: all .400s; -moz-transition: all .400s; -o-transition: all .400s; transition: all .400s; background-attachment: fixed; background-position: center center; background-repeat: no-repeat; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; background-size: cover !important; box-sizing: border-box !important; } section:after, section:before { content:" "; display:table; } section:after { display: block; content: ""; clear: both; } /* remove effect on parallax */ section.parallax { -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } /** Static background image add to HTML: background-image:url(); **/ section.dark { background-color:#212121 !important; border-bottom:rgba(255,255,255,0.1) 1px solid; } /* eaf7ff */ /* different dark color */ section.dark-2, section.dark-2 div.heading-title h1, section.dark-2 div.heading-title h2, section.dark-2 div.heading-title h3, section.dark-2 div.heading-title h4, section.dark-2 div.heading-title h5, section.dark-2 div.heading-title h6 { color: #fff; background-color: #333a3f !important; } .dark-2 a, .dark-2 label, .dark-2 h1, .dark-2 h2, .dark-2 h3, .dark-2 h4, .dark-2 h5, .dark-2 h6 { color: #fff; } section.theme-color, section.theme-color h1, section.theme-color h2, section.theme-color h3, section.theme-color h4, section.theme-color h5, section.theme-color h6, section.dark, section.dark p, section.dark h1, section.dark h2, section.dark h3, section.dark h4, section.dark h5, section.dark h6 { color:#fff; } section.dark a { color:#999; } section.parallax { border:0; } body.bg-grey, body.bg-grey #wrapper { background-color:#f1f2f7; } .container { position:relative; } a:active, a:focus, a:hover { color: #212121; text-decoration:none; } /* black link color - override theme color link */ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color:#121212; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { color:#888; } section.dark h1 a, section.dark h2 a, section.dark h3 a, section.dark h4 a, section.dark h5 a, section.dark h6 a { color:#eee; } section.dark h1 a:hover, section.dark h2 a:hover, section.dark h3 a:hover, section.dark h4 a:hover, section.dark h5 a:hover, section.dark h6 a:hover { color:#fff; } section header>h1, section header>h2, section header>h3, section header>h4, section header>h5, section header>h6 { margin:0; } small { font-family: 'Lato', sans-serif; } label { display:block; } /* form control: inputs, textarea, etc */ .btn { position:relative; } .btn-default { border-width:2px; } .input-group-addon { border:#ddd 2px solid; border-right:0; } section.dark .input-group-addon { background-color:#212121; border-color:#666; color:#eaeaea; } .form-control { border:#ddd 2px solid; box-shadow:none; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .form-control:focus { border-color:#c6c6c6; } section.dark .form-control { border-color: #666; background-color: rgba(255,255,255,0.05); outline: none; } section.dark .form-control:focus { border-color:#999; } .nav-tabs>li>a { -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } /* DARK PRESETS */ section.dark input, section.dark select, section.dark textarea { color:#fff; } section.dark .btn { color:#fff; } section.dark h1.page-header, section.dark h2.page-header, section.dark h3.page-header, section.dark h4.page-header, section.dark h5.page-header, section.dark h6.page-header { border-bottom-color:#666; } /* fonts */ /* GLOBAL RADIUS Add here all needed bootstrap elements */ .alert, .card, .navbar-toggle, .btn { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } /* bootstrap rewrite */ img.img-fluid { display:inline-block; } /** Boxed **************************************************************** **/ body.boxed { background-color:#f1f2f7; } body.boxed section { background-color:#fff; } body.boxed #wrapper { max-width:1170px; margin-left:auto; margin-right:auto; margin-top:50px; margin-bottom:50px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } @media only screen and (max-width: 992px) { body.boxed #wrapper { margin-top:0; margin-bottom:0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } } /** Color Background **************************************************************** **/ /* GRAIN BLUE BACKGROUND */ body.grain-blue, body.grain-blue #wrapper, body.grain-blue #topBar, body.grain-blue #header.fixed, body.grain-blue #header li.search .search-box, body.grain-blue #header li.quick-cart .quick-cart-box, body.grain-blue div.heading-title h1, body.grain-blue div.heading-title h2, body.grain-blue div.heading-title h3, body.grain-blue div.heading-title h4, body.grain-blue div.heading-title h5, body.grain-blue div.heading-title h6 { background:#dce4e9 url('../images/grain_bg.png') repeat; } /* GRAIN GREY BACKGROUND */ body.grain-grey, body.grain-grey #wrapper, body.grain-grey #topBar, body.grain-grey #header.fixed, body.grain-grey #header li.search .search-box, body.grain-grey #header li.quick-cart .quick-cart-box, body.grain-grey div.heading-title h1, body.grain-grey div.heading-title h2, body.grain-grey div.heading-title h3, body.grain-grey div.heading-title h4, body.grain-grey div.heading-title h5, body.grain-grey div.heading-title h6 { background:#f1f2f7 url('../images/grain_bg.png') repeat; } /* GRAIN GREEN BACKGROUND */ body.grain-green, body.grain-green #wrapper, body.grain-green #topBar, body.grain-green #header.fixed, body.grain-green #header li.search .search-box, body.grain-green #header li.quick-cart .quick-cart-box, body.grain-green div.heading-title h1, body.grain-green div.heading-title h2, body.grain-green div.heading-title h3, body.grain-green div.heading-title h4, body.grain-green div.heading-title h5, body.grain-green div.heading-title h6 { background:#e6eeea url('../images/grain_bg.png') repeat; } /* GRAIN ORANGE BACKGROUND */ body.grain-orange, body.grain-orange #wrapper, body.grain-orange #topBar, body.grain-orange #header.fixed, body.grain-orange #header li.search .search-box, body.grain-orange #header li.quick-cart .quick-cart-box, body.grain-orange div.heading-title h1, body.grain-orange div.heading-title h2, body.grain-orange div.heading-title h3, body.grain-orange div.heading-title h4, body.grain-orange div.heading-title h5, body.grain-orange div.heading-title h6 { background:#fff4ea url('../images/grain_bg.png') repeat; } /* GRAIN YELLOW BACKGROUND */ body.grain-yellow, body.grain-yellow #wrapper, body.grain-yellow #topBar, body.grain-yellow #header.fixed, body.grain-yellow #header li.search .search-box, body.grain-yellow #header li.quick-cart .quick-cart-box, body.grain-yellow div.heading-title h1, body.grain-yellow div.heading-title h2, body.grain-yellow div.heading-title h3, body.grain-yellow div.heading-title h4, body.grain-yellow div.heading-title h5, body.grain-yellow div.heading-title h6 { background:#ffffe6 url('../images/grain_bg.png') repeat; } /* essentials.css rewrite : heading shortcode */ /* color header */ body.grain-blue #header, body.grain-grey #header, body.grain-green #header, body.grain-orange #header, body.grain-yellow #header { background-color:rgba(0,0,0,0.16); } body.grain-blue #header.dark, body.grain-grey #header.dark, body.grain-green #header.dark, body.grain-orange #header.dark, body.grain-yellow #header.dark { background-color:rgba(33,33,33,0.8); } body.grain-blue #header.dark.fixed, body.grain-grey #header.dark.fixed, body.grain-green #header.dark.fixed, body.grain-orange #header.dark.fixed, body.grain-yellow #header.dark .fixed{ background-color:#333; } body.grain-blue section.page-header, body.grain-grey section.page-header, body.grain-green section.page-header, body.grain-orange section.page-header, body.grain-yellow section.page-header { border:0; } /** Slide Top **************************************************************** **/ #slidetop { display: block; color:#888; font-size:13px; background-color:#363839; z-index: 1500; position: absolute; top: 0; right: 0; left:0; width: 100%; margin-left: auto; margin-right: auto; } #slidetop h1, #slidetop h2, #slidetop h3, #slidetop h4, #slidetop h5, #slidetop h6 { font-size:13px; line-height:20px; color:#fff; } #slidetop ul { margin:0; } #slidetop a { color:#ccc; text-decoration:none; } #slidetop ul>li>a { display:block; overflow:hidden; text-overflow:ellipsis; white-space: nowrap; width:100%; } #slidetop ul>li>a>i { margin-right:6px; } #slidetop h1>i, #slidetop h2>i, #slidetop h3>i, #slidetop h4>i, #slidetop h5>i, #slidetop h6>i { margin-right:8px; } #slidetop a:hover { color:#fff; } #slidetop .container { display:none; height: auto; padding:30px 0; } #slidetop a.slidetop-toggle { height:35px; position: absolute; right: 0; bottom:-35px; border-top: 35px solid #363839; border-left: 35px solid transparent; display:inline-block; text-decoration:none; color:#fff; text-align:center; } #slidetop a.slidetop-toggle:after { font-family:FontAwesome; content: "\f067"; height:18px; color:#fff; position:absolute; top: -34px; left: -16px; } #slidetop.active a.slidetop-toggle:after { content: "\f068"; } @media only screen and (max-width: 768px) { #slidetop { display:none !important; } } /** Parallax Social Icons **************************************************************** **/ #sidepanel { color:#888; font-size:13px; position: fixed; top: 0; right: -280px; bottom:0; width:280px; z-index: 3000; background-color:#363839; overflow:hidden; display:none; -webkit-transition: right .4s ease; -o-transition: right .4s ease; transition: right .4s ease; } #sidepanel_overlay { position:fixed; left:0; top:0; right:0; bottom:0; background-color:rgba(0,0,0,0.5); z-index:2999; -webkit-transition: all .400s; -moz-transition: all .400s; -o-transition: all .400s; transition: all .400s; } #sidepanel_close { color: #999; background-color:rgba(0,0,0,0.2); display: block; position: absolute; top: 0; right: 0; width: 40px; height: 40px; font-size: 18px; line-height: 40px; text-align: center; } #sidepanel_close:hover { color:#fff; } /* position */ #sidepanel.sidepanel-inverse { right:auto; left: -280px; } /* colors */ /* sidepanel content */ #sidepanel h1, #sidepanel h2, #sidepanel h3, #sidepanel h4, #sidepanel h5, #sidepanel h6 { color:#ddd; } /* sidepanel menu */ #sidepanel ul>li>a { font-size:14px; } #sidepanel ul ul>li>a { font-size:11px; } #sidepanel ul { border-bottom:rgba(0,0,0,0.2) 1px solid; padding-bottom:30px; } #sidepanel ul ul { margin-top:6px; border-bottom:0; padding-bottom:0; } #sidepanel ul ul>li { padding:5px 0 5px 32px; } #sidepanel ul li a[data-toggle="collapse"] { /* font-weight:bold; */ } #sidepanel ul li a[data-toggle="collapse"].collapsed { color:#ddd; font-weight:normal; } /* light */ /* theme color */ /** Page Header **************************************************************** **/ section.page-header { position: relative; padding: 50px 0 50px 0; border-top: 0; margin-top: 0; margin-bottom: 0 !important; background-color: rgba(0,0,0,0.05); border-bottom: rgba(0,0,0,0.05) 1px solid; -webkit-transition: all 0s; -moz-transition: all 0s; -o-transition: all 0s; transition: all 0s; } @media only screen and (max-width: 1024px) { section.page-header { background-position: center !important; background-attachment: inherit; -webkit-background-size: 100% 100% !important; -moz-background-size: 100% 100% !important; -o-background-size: 100% 100% !important; background-size: 100% 100% !important; -webkit-box-sizing: inherit !important; -moz-box-sizing: inherit !important; box-sizing: inherit !important; } } /* shadows */ section.page-header.shadow-after-1:before { content:' '; position:absolute; left:0; right:0; width:100%; height:60px; bottom:-60px; background-image:url('../images/_smarty/misc/shadow1.png'); background-size: 100% 100%; } section.page-header.shadow-after-2:before { content:' '; position:absolute; left:0; right:0; width:100%; height:60px; bottom:-60px; background-image:url('../images/_smarty/misc/shadow2.png'); background-size: 100% 100%; } section.page-header.shadow-after-3:before { content:' '; position:absolute; left:0; right:0; width:100%; height:60px; bottom:-60px; background-image:url('../images/_smarty/misc/shadow3.png'); background-size: 100% 100%; } section.dark.page-header { color:#fff; background-color:#151515 !important; } section.dark-2.page-header { color:#fff; background-color:#292e32 !important; } section.light.page-header { color:#151515; background-color:transparent; border-top: rgba(0,0,0,0.05) 1px solid; } /* page header tabs */ section.page-header>.container { min-height:42px; } section.page-header h1 { margin:0; padding:0; font-size:26px; font-weight:300; } @media only screen and (max-width: 767px) { section.page-header { text-align:center; } } /* options - like buttons */ /** Top Nav **************************************************************** **/ #header, #topNav, #topMain { display: block; } #header { position: relative; left:0; top:0; right:0; z-index:1000; font-size:14px; background-color:#fff; border-bottom: rgba(0,0,0,0.05) 1px solid; -webkit-box-shadow: 0 0 2px rgba(0,0,0,.1) !important; -moz-box-shadow: 0 0 2px rgba(0,0,0,.1) !important; box-shadow: 0 0 2px rgba(0,0,0,.1) !important; -webkit-transition: all .800s; -moz-transition: all .800s; -o-transition: all .800s; transition: all .800s; } #header a.logo>img { height:80px; -webkit-transition: all .300s; -moz-transition: all .300s; -o-transition: all .300s; transition: all .300s; } /* force uppercase links */ #topBar ul li a, #mainMenu ul li a, #topMain ul li a { text-transform:uppercase; } /* BS 4 fix */ #header.navbar-toggleable-md .navbar-collapse { display: inherit; width: auto; } /* two logo images : light & dark */ #header a.logo>img:last-child { display:none; } #header a.logo>img:first-child { display:inline-block; } #header.fixed a.logo>img:first-child { display:none; } #header.fixed a.logo>img:last-child { display:inline-block; } /* shadows */ #header.shadow-after-1:before { content:' '; position:absolute; left:0; right:0; width:100%; height:60px; bottom:-60px; background-image:url('../images/_smarty/misc/shadow1.png'); background-size: 100% 100%; } #header.shadow-before-1:before { content:' '; position:absolute; left:0; right:0; top:0; width:100%; height:60px; background-image:url('../images/_smarty/misc/shadow1.png'); background-size: 100% 100%; } #header.shadow-after-2:before { content:' '; position:absolute; left:0; right:0; width:100%; height:60px; bottom:-60px; background-image:url('../images/_smarty/misc/shadow2.png'); background-size: 100% 100%; } #header.shadow-before-2:before { content:' '; position:absolute; left:0; right:0; top:0; width:100%; height:60px; background-image:url('../images/_smarty/misc/shadow2.png'); background-size: 100% 100%; } #header.shadow-after-3:before { content:' '; position:absolute; left:0; right:0; width:100%; height:60px; bottom:-60px; background-image:url('../images/_smarty/misc/shadow3.png'); background-size: 100% 100%; } #header.shadow-before-3:before { content:' '; position:absolute; left:0; right:0; top:0; width:100%; height:60px; background-image:url('../images/_smarty/misc/shadow3.png'); background-size: 100% 100%; } /** Search - Default ********************** **/ #header li.search { display:inline-block; } #header li.search .search-box { display:none; right: 0; left:auto; /*top: 100%;*/ padding: 15px; background-color: #fff; position: absolute; box-shadow: 5px 5px rgba(91, 91, 91, 0.2); width: 274px; margin-top: 36px; z-index: 22; } #header.header-md li.search .search-box { margin-top:25px; } #header.header-sm li.search .search-box { margin-top:19px; } #header.fixed li.search .search-box { margin-top:18px; } #header.fixed.header-sm li.search .search-box { margin-top:18px; } #header.fixed.header-md li.search .search-box { margin-top:15px; } #header li.search i.fa { color: #333; cursor: pointer; position: relative; } /** Search - Fullscreen ********************** **/ #header li.search.fullscreen>.search-box { text-align:center; position:fixed; padding:30px; background-color:rgba(255,255,255,0.95) !important; left:0; top:0 !important; right:0; bottom:0; width:100%; height:100%; margin:0 !important; z-index:2000; } #header li.search.fullscreen>.search-box>form { width: 100%; max-width:800px; display:inline-block; margin:auto; margin-top:20%; } #header li.search.fullscreen>.search-box>form input { border: 0; background-color: rgba(0,0,0,0.1); padding-top: 15px; padding-bottom: 15px; height: 65px; font-size:24px; font-weight:300; color:#121212; border-right:rgba(0,0,0,0.2) 1px solid; } #header li.search.fullscreen>.search-box>form button { border: 0; font-size: 24px; padding: 15px 20px !important; height: 65px; background-color: rgba(0,0,0,0.1); color: #888; } #header li.search.fullscreen>.search-box>form button>i { color: #999; font-size: 22px; } #header li.search.fullscreen>.search-box>form button:hover>i { color: #121212; } #header li.search.fullscreen #closeSearch { background-color: rgba(0,0,0,0.05); text-decoration: none; text-align: center; width: 60px; height: 60px; line-height: 60px; position: absolute; top: -3px; left: 50%; margin-left: -30px; color: #888; font-size: 40px; z-index: 1000; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #header li.search.fullscreen #closeSearch:hover { color:#111; } /* Dark */ #header li.search.fullscreen.dark>.search-box { background-color:rgba(0,0,0,0.95) !important; } #header li.search.fullscreen.dark>.search-box>form input { color:#ddd; background-color: rgba(255,255,255,0.1); border-right-color:rgba(255,255,255,0.2); } #header li.search.fullscreen.dark>.search-box>form button { background-color: rgba(255,255,255,0.1); } #header li.search.fullscreen.dark>.search-box>form button>i { color: #999; } #header li.search.fullscreen.dark>.search-box>form button:hover>i { color: #fff; } #header li.search.fullscreen.dark #closeSearch { background-color: rgba(255,255,255,0.2); color: #888; } #header li.search.fullscreen.dark #closeSearch:hover { color:#fff; } @media only screen and (max-width: 480px) { #header li.search.fullscreen>.search-box>form { margin-top:30%; } } @media only screen and (max-height: 400px) { #header li.search.fullscreen>.search-box>form { margin-top:60px; } } /** Search - Header ********************** **/ /* dark */ #header.translucent #topMain, #header.dark.transparent #topMain { background-color:transparent; } /** Quick Shop Cart ********************** **/ #header li.quick-cart .quick-cart-box { display:none; right: 0; left:auto; top: 100%; padding:10px 0; background-color: #fff; position: absolute; box-shadow: 5px 5px rgba(91, 91, 91, 0.2); width: 274px; margin-top: 36px; z-index: 22; } #header.fixed li.quick-cart .quick-cart-box { /*margin-top:18px;*/ } #header.fixed.header-sm li.quick-cart .quick-cart-box { /*margin-top:18px;*/ } #header.fixed.header-md li.quick-cart .quick-cart-box { /*margin-top:15px;*/ } #header li.quick-cart .quick-cart-box h4 { font-size:17px; margin:0; padding:0 10px 10px 10px; border-bottom:rgba(0,0,0,0.1) 1px solid; } #header li.quick-cart .quick-cart-box a { display:block; padding:15px 10px; border-bottom:rgba(0,0,0,0.04) 1px solid; } #header li.quick-cart .quick-cart-box a:hover { background-color:rgba(0,0,0,0.03); } #header li.quick-cart .quick-cart-box a>img { float:left; margin-right:10px; } #header li.quick-cart .quick-cart-box a h6 { margin:0; padding:4px 0 0 0; text-overflow:ellipsis; white-space: nowrap; overflow:hidden; } #header li.quick-cart .quick-cart-box a.btn { background-color:#151515; border:0; margin:0; padding-top:6px; padding-bottom:4px; } @media only screen and (min-width: 992px) { /* min-width */ #header li.quick-cart .quick-cart-box { top:21px; } #header.header-sm li.quick-cart .quick-cart-box { margin-top:19px; } #header.header-md li.quick-cart .quick-cart-box { margin-top:26px; } } @media only screen and (max-width: 992px) { /* max-width */ #header li.quick-cart .quick-cart-box { margin-top:18px; } #header.dark li.search .search-box { margin-top:38px !important; } } @media only screen and (max-width: 769px) { #header li.quick-cart .quick-cart-box { position:fixed; width:100%; left:0; right:0; top:60px; margin-top:0; border:rgba(0,0,0,0.08) 1px solid !important; } #header.dark li.quick-cart .quick-cart-box { border:rgba(255,255,255,0.08) 1px solid; } /** Quick Cart & top Search Fix (if #topBar exists). .has-topBar - added by Javascript **/ #header ul.has-topBar>li.quick-cart .quick-cart-box, #header ul.has-topBar>li.search .search-box { top:98px !important; } } /** Menu Vertical ********************** **/ /* Aside Vertical */ /* Inline Search */ /* Column Menu / Mega Menu */ /* Top Options */ /* DARK */ /* OPEN ON CLICK */ .fancy_big_btn { position:absolute; right:-80px; top:15px; display:inline-block; background:rgba(255,255,255,0.2); padding:6px; z-index:100; -webkit-transition: background 600ms; -moz-transition: background 600ms; -o-transition: background 600ms; transition: background 600ms; } .fancy_big_btn { right:auto; left:-80px; } .fancy_big_btn:hover, .fancy_big_btn:active { background:#fff; } .fancy_big_btn i { display:block; width:54px; height:54px; background-image:url('data:image/gif;base64,R0lGODlhNwA3AJEAAAAAAP///////wAAACH5BAEAAAIALAAAAAA3ADcAAAJUlI+py+0Po5y02ouz3rz7D4biSJbmiabqyrZhAMfyTNc1Zue6je/+7goKh8Si8dj6KXmXpVPWezqR1Kr1is2apM8o9+f9ArXksvmMTqvX7Lb7DS8AADs='); background-repeat:no-repeat; background-position:center; background-color:#000; -webkit-transition: background 300ms; -moz-transition: background 300ms; -o-transition: background 300ms; transition: background 300ms; } .fancy_big_btn:hover i { background-color:#f6f6f6; background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADcAAAA3CAYAAACo29JGAAAARklEQVRoge3WsQ0AIAwDsML/P8MLdECoxZ4zJFsiAAAAqGgksutai7yj3vN2i5dajwPgex5KVa3HAfA9D6Wq1uMAAACoaQMxSAMQNhNmmQAAAABJRU5ErkJggg=='); } /* for anywhere use */ .fancy_big_btn { right:auto; left:0; top:20px; } .fancy_big_btn.inverse { left:auto; right:0; } /* custom icon */ .fancy_big_btn i.fa, .fancy_big_btn i.et, .fancy_big_btn i.glyphicon, .fancy_big_btn i.icon, .fancy_big_btn i.ico { background-image:none; color:#fff; font-size:30px; line-height:50px; margin:0; padding:0; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; } .fancy_big_btn:hover i.fa, .fancy_big_btn:hover i.et, .fancy_big_btn:hover i.glyphicon, .fancy_big_btn:hover i.icon, .fancy_big_btn:hover i.ico { color:#000; } /* Responsive */ @media (min-width: 768px) { /* uncomment if you would like the menu to be fixed */ /* .navbar { position: fixed; width: 170px; z-index: 2; } */ } /** Mobile Button ********************** **/ #topNav button.btn-mobile { display:none; } #topNav button.btn-mobile { color:#333; display: none; padding:6px 10px; float:right; margin-top:13px; margin-right:0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #topNav button.btn-mobile i { padding:0; margin:0; font-size:21px; } @media only screen and (max-width: 992px) { #topNav button.btn-mobile { display:inline-block; } } #header li.search .search-box, #header li.quick-cart .quick-cart-box { border:rgba(0,0,0,0.07) 1px solid; border-top:0; } /* Dark & Color Header */ #header.dark { background-color:#333; } #header.dark #topMain.nav-pills>li>a { color:#ccc; } #header.dark #topMain.nav-pills>li.active>a, #header.dark #topMain.nav-pills>li>a:hover { color:#fff; } /* DARK CART & SEARCH */ #header.dark li.search .search-box, #header.dark li.quick-cart .quick-cart-box { background-color:#333; } #header.translucent li.search .search-box, #header.translucent li.quick-cart .quick-cart-box { background-color:rgba(33,33,33,0.80); -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } #header.translucent li.search .search-box:hover, #header.translucent li.quick-cart .quick-cart-box:hover { background-color:rgba(33,33,33,0.88); } #header.translucent ul.nav-second-main li i, #header.translucent li.search i.fa, #header.dark li.quick-cart .quick-cart-box a, #header.dark li.quick-cart .quick-cart-box a h6, #header.dark li.quick-cart .quick-cart-box h4 { color:#fff !important; } #header.dark li.quick-cart .quick-cart-box h4, #header.dark li.quick-cart .quick-cart-box a { border-bottom: rgba(255,255,255,0.08) 1px solid; } #header.dark li.quick-cart .quick-cart-box a:hover { background-color:rgba(255,255,255,0.06); } #header.dark li.search .search-box input { color: #999; background-color: rgba(0,0,0,.2); border-color: rgba(0,0,0,.25); -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } #header.dark li.search .search-box input:focus, #header.dark li.search .search-box textarea:focus { background-color: rgba(0,0,0,.3); } /* Transparent Header */ #header.transparent { position:absolute; background-color:transparent; border-bottom:rgba(255,255,255,0.3) 1px solid; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } #header.transparent.color, #header.transparent.dark { border:0; } #header.transparent #topMain.nav-pills>li>a { color:#fff; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #header.transparent #topMain.nav-pills>li.active>a, #header.transparent #topMain.nav-pills>li>a:hover { background-color:rgba(0,0,0,0.03); } #header.transparent + section.page-header { /*margin-top:-100px;*/ padding:180px 0; } #header.transparent a.social-icon { background-color:rgba(0,0,0,0.2); } #header.transparent a.social-icon>i { color:#eaeaea; } /* on scroll */ #header.fixed.transparent{ background-color:#fff; } #header.fixed.dark, #header.fixed.dark.transparent { background-color:#333; border:0; } #header.fixed.transparent ul.nav-second-main li a, #header.fixed.transparent ul.nav-second-main li a>i, #header.fixed.transparent #topMain.nav-pills>li>a { color:#151515; } #header.fixed.dark.transparent ul.nav-second-main li a, #header.fixed.dark.transparent ul.nav-second-main li a>i, #header.fixed.dark.transparent #topMain.nav-pills>li>a { color:#fff; } @media only screen and (max-width: 992px) { #header.transparent.fixed #topNav button.btn-mobile { color:#333 !important; } #header.transparent.dark.fixed #topNav button.btn-mobile { color:#fff !important; } #header.transparent #topMain.nav-pills>li>a { color:#fff; } #header.transparent.dark #topMain.nav-pills>li>a { color:#fff; } } @media only screen and (max-width: 768px) { #header.transparent + section.page-header { margin-top:0; } /* force dark submenu */ #header.transparent #topMain { background-color:#333 !important; } #header.transparent #topMain li.active>a { color:#fff !important; } } /* Transparent Header */ #header.translucent { position:absolute; background-color:rgba(0,0,0,0.2); -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } #header.translucent #topMain.nav-pills>li>a { color:#fff; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #header.translucent #topMain.nav-pills>li.active>a, #header.translucent #topMain.nav-pills>li>a:hover { color:#fff; background-color:rgba(0,0,0,0.1); } #header.translucent + section.page-header { margin-top:-100px; padding:180px 0; } /* on scroll */ #header.fixed.translucent{ background-color:#fff; } #header.fixed.dark, #header.fixed.dark.translucent { background-color:#333; border:0; } #header.fixed.translucent ul.nav-second-main li a, #header.fixed.translucent ul.nav-second-main li a>i, #header.fixed.translucent #topMain.nav-pills>li>a { color:#151515; } #header.fixed.dark.translucent ul.nav-second-main li a, #header.fixed.dark.translucent ul.nav-second-main li a>i, #header.fixed.dark.translucent #topMain.nav-pills>li>a { color:#fff; } @media only screen and (max-width: 768px) { #header.transparent + section.page-header { margin-top:0; } } /* BOTTOM HEADER */ #header.bottom { position:absolute; top:auto; bottom:0; border-bottom:rgba(0,0,0,0.05) 1px solid; } #header.bottom.fixed { top:0; bottom:auto; } #header.bottom.sticky { position:absolute; } #header.bottom.fixed.sticky { position:fixed; } #header.bottom.dropup #topMain>li>ul.dropdown-menu ul.dropdown-menu { bottom: auto; box-shadow:none; } #header.bottom.dropup ul.dropdown-menu { bottom:94px; } #header.header-md.bottom.dropup ul.dropdown-menu { bottom:68px; } #header.header-sm.bottom.dropup ul.dropdown-menu { bottom:58px; } #header.bottom.dropup .nav-second-main .quick-cart-box, #header.bottom.dropup .nav-second-main .search-box { top:auto; bottom:100%; margin-bottom:39px; box-shadow: 5px -5px rgba(91, 91, 91, 0.2); border-bottom:0 } #header.bottom.header-md.dropup .nav-second-main .quick-cart-box, #header.bottom.header-md.dropup .nav-second-main .search-box { margin-bottom:23px; } #header.bottom.header-sm.dropup .nav-second-main .quick-cart-box, #header.bottom.header-sm.dropup .nav-second-main .search-box { margin-bottom:20px; } #header.bottom.dropup ul.dropdown-menu:before { top:auto; bottom: -10px !important; border-bottom:0 !important; border-top: rgba(255,255,255,1) 10px solid; } #header.bottom.dropup.dark ul.dropdown-menu:before { border-top: rgba(33,33,33,0.95) 10px solid !important; } #header.bottom + #slider { margin-bottom:94px; } #header.header-md.bottom + #slider { margin-bottom:70px; } #header.header-sm.bottom + #slider { margin-bottom:60px; } #header.header-sm.bottom.transparent + #slider, #header.header-sm.bottom.translucent + #slider { margin-bottom:0; } @media only screen and (max-width: 992px) { #header.bottom { top:0; bottom:auto; } #header.bottom.sticky { position:relative !important; } #header.bottom.transparent ul.nav-second-main li a, #header.bottom.transparent ul.nav-second-main li a>i, #header.bottom.transparent #topNav button.btn-mobile { color:#212121; } #header.bottom.dropup .nav-second-main .quick-cart-box, #header.bottom.dropup .nav-second-main .search-box { bottom:auto; } } /* STATIC HEADER */ #header.bottom.static + #slider { margin-bottom:0; } #header.bottom.static { border-top:rgba(0,0,0,0.15) 1px solid; } #header.bottom.static.dark { border-top:rgba(255,255,255,0.15) 1px solid; } #header.bottom.static .nav-second-main .quick-cart-box, #header.bottom.static .nav-second-main .search-box, #header.bottom.static .nav-second-main .quick-cart-box, #header.bottom.static .nav-second-main .search-box { border:rgba(0,0,0,0.15) 1px solid; border-bottom:0; } #header.bottom.static.dark .nav-second-main .quick-cart-box, #header.bottom.static.dark .nav-second-main .search-box, #header.bottom.static.dark .nav-second-main .quick-cart-box, #header.bottom.static.dark .nav-second-main .search-box { border:rgba(255,255,255,0.15) 1px solid; border-bottom:0; } @media only screen and (max-width: 992px) { #header.static { /*position:relative !important;*/ } } #header.static:not(.transparent) + section.page-header { margin-top:60px; } /* fullwidth container */ /* remove bootstrap issue */ #topNav ul.dropdown-menu>li, #topNav ul.dropdown-menu>li a { background-color:transparent; } #topNav .nav-pills>li+li { margin-left:0; } /* search */ #header li.search .search-box form { margin:0; } /* Medium Height : 70 */ #header.header-md #topNav a.logo { height:70px; line-height:50px; } #header.header-md #topNav a.logo>img { height:70px; } #header.header-md #topNav #topMain>li>a { height:70px; line-height:70px; } @media only screen and (max-width: 992px) { #header.header-md #topMain.nav-pills>li>a { color:#212121; } #header.header-md #topMain.nav-pills>li.active>a, #header.header-md #topMain.nav-pills>li>a:hover { color:#212121; background-color:rgba(0,0,0,0.02); } } /* Small Height : 60px */ #header.header-sm #topNav a.logo { height:60px; line-height:50px; } #header.header-sm #topNav a.logo>img { height:60px; } #header.header-sm #topNav #topMain>li>a { height:60px; line-height:60px; } @media only screen and (max-width: 992px) { #header.header-sm #topMain.nav-pills>li>a { color:#212121; } #header.header-sm #topMain.nav-pills>li.active>a, #header.header-sm #topMain.nav-pills>li>a:hover { color:#212121; background-color:rgba(0,0,0,0.02); } } /* Sticky 60px */ #header.fixed { position:fixed; border-bottom:rgba(0,0,0,0.08) 1px solid; } #header.fixed #topNav a.logo { height:60px; line-height:50px; } #header.fixed #topNav a.logo>img { height:60px; } #header.fixed #topNav #topMain>li>a { height:60px; line-height:60px; } /* Static */ #header.static { position:fixed; } #header.static:not(.transparent) { border-bottom:rgba(0,0,0,0.08) 1px solid; } @media only screen and (max-width: 992px) { #header.header-sm #topMain.nav-pills>li>a, #header.header-md #topMain.nav-pills>li>a { color:#212121; } #header.header-sm #topMain.nav-pills>li.active>a, #header.header-sm #topMain.nav-pills>li>a:hover, #header.header-md #topMain.nav-pills>li.active>a, #header.header-md #topMain.nav-pills>li>a:hover { color:#212121; background-color:rgba(0,0,0,0.02); } #header.transparent.header-sm #topMain.nav-pills>li>a, #header.transparent.header-md #topMain.nav-pills>li>a, #header.transparent.header-sm #topMain.nav-pills>li.active>a, #header.transparent.header-sm #topMain.nav-pills>li>a:hover, #header.transparent.header-md #topMain.nav-pills>li.active>a, #header.transparent.header-md #topMain.nav-pills>li>a:hover { color:#fff; } #header.transparent #topMain, #header .submenu-dark #topMain { background-color:#333; } #header.dark #topMain.nav-pills>li.active>a, #header.dark #topMain.nav-pills>li:hover>a, #header.dark #topMain.nav-pills>li>a { color:#333; } #header.dark .submenu-dark #topMain.nav-pills>li.active>a, #header.dark .submenu-dark #topMain.nav-pills>li:hover>a, #header.dark .submenu-dark #topMain.nav-pills>li>a { color:#fff; } #header.dark #topMain.nav-pills>li.active>a { background-color:rgba(0,0,0,0.1); } } /* Top Bar */ #topBar { display:block; background-color:#fff; border-bottom:rgba(0,0,0,0.05) 1px solid; } #topBar>.border-bottom { border-bottom:rgba(0,0,0,0.05) 1px solid; } #topBar>.border-top { border-top:rgba(0,0,0,0.05) 1px solid; } #topBar, #topBar>.container { min-height: 39px; } #topBar.dark { color:#ccc; background-color:#363839; border-bottom-color:rgba(255,255,255,0.1); } #topBar.dark .dropdown-menu a { color:#fff; } #topBar.dark .dropdown-menu a:hover { color:#fff !important; background-color:#333; } #topBar.dark .dropdown-menu { background-color:#363839; } #topBar.dark .dropdown-menu .divider { background-color:#444; } #topBar.dark>.border-bottom { border-bottom-color:rgba(255,255,255,0.1); } #topBar.dark>.border-top { border-top-color:rgba(255,255,255,0.1); } /* Logo */ #topBar .logo { display:inline-block; } #topBar .logo img { -webkit-transition: width .4s ease, height .4s ease; -o-transition: width .4s ease, height .4s ease; transition: width .4s ease, height .4s ease; } /* banner */ /* social Icon */ #topBar .social-icon { margin:3px 0 0 0; } /* Links */ @media only screen and (max-width: 768px) { #topBar { text-align:center; } } /* Drop Downs & Lang */ #topBar ul.dropdown-menu { min-width:50px; margin:0; padding:0; margin-left:-1px; } #topBar ul.dropdown-menu>li>a { padding:8px 6px; font-size:12px; } #topBar ul.dropdown-langs>li>a { padding:3px 6px; font-size:12px; } #topBar ul.dropdown-menu>li>a>i { margin-right:6px; } #topBar ul.dropdown-langs>li:hover>a { color:#000 !important; background-color:#eee; } #topBar ul.dropdown-menu>li.divider { margin:0; padding:0; border-bottom:0; height:1px; } /* Nav Second Main - search, etc */ #header ul.nav-second-main { border-left:rgba(0,0,0,0.1) 1px solid; padding-left:15px; margin-top: 39px; -webkit-transition: all .300s; -moz-transition: all .300s; -o-transition: all .300s; transition: all .300s; } #header.fixed ul.nav-second-main { margin-top:20px; } #header.header-sm ul.nav-second-main { margin-top:20px; } #header.header-md ul.nav-second-main { margin-top:23px; } #header.fixed.header-sm ul.nav-second-main.nav-social, #header.fixed.header-md ul.nav-second-main.nav-social { margin-top:18px; } #header ul.nav-second-main.nav-social a { margin-left:10px !important; } #header ul.nav-second-main.nav-social>li:first-child a { margin-left:10px !important; } #header.fixed ul.nav-second-main.nav-social a>i:hover { color: #fff !important; } #header ul.nav-second-main li { padding-top:33px; padding:0 5px 0px 5px; } #header ul.nav-second-main li>a { background-color:transparent; color:#666; padding:0 3px; display:block; } #header ul.nav-second-main li i { font-size:18px; width: 20px; height: 20px; margin:0; padding:0; opacity:0.6; filter: alpha(opacity=60); -webkit-transition: all .300s; -moz-transition: all .300s; -o-transition: all .300s; transition: all .300s; } #header ul.nav-second-main li:hover i { opacity:1; filter: alpha(opacity=100); } #header ul.nav-second-main li .badge { padding:3px 6px; } /* dark & color menu */ #header.transparent ul.nav-second-main li a, #header.transparent ul.nav-second-main li a>i, #header.color ul.nav-second-main li a, #header.color ul.nav-second-main li a>i, #header.dark ul.nav-second-main li a, #header.dark ul.nav-second-main li a>i { color:#fff; opacity:1; filter: alpha(opacity=100); } @media only screen and (max-width: 992px) { #header ul.nav-second-main { margin:15px 15px 0 0; border:0; } #header ul.nav-second-main li { padding:0; padding-top:6px; } #header ul.nav-second-main { -webkit-transition: all 0s; -moz-transition: all 0s; -o-transition: all 0s; transition: all 0s; } #header.fixed ul.nav-second-main li { padding-top:0; } #header.header-md ul.nav-second-main li>a, #header.header-sm ul.nav-second-main li>a { margin-top:-6px; } /* header social */ #header.header-md ul.nav-second-main { margin-top:20px; } #header.fixed.header-sm ul.nav-second-main.nav-social, #header.fixed.header-md ul.nav-second-main.nav-social { margin-top:26px; } /* header translucent fix */ #header.header-md.translucent ul.nav-second-main { margin-top:23px; } #header.header-md.translucent.fixed ul.nav-second-main { margin-top:29px; } } /** ************************************************************* **/ /* submenu */ #topNav ul.dropdown-menu { text-align:left; margin-top: 0; box-shadow:none; border:#eee 1px solid; border-top:#eee 1px solid; list-style:none; background:#fff; background-color:#fff; box-shadow:rgba(0,0,0,0.2) 0 6px 12px; min-width:200px; padding:0; border-color: #1ABC9C #fff #fff; -webkit-transition: top .4s ease; -o-transition: top .4s ease; transition: top .4s ease; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #topNav ul.dropdown-menu ul.dropdown-menu { margin-top: -1px !important; /* -1px required for border-top menu */ } #topNav ul.dropdown-menu li { position:relative; /*border-bottom: rgba(0,0,0,0.06) 1px solid;*/ } /* #topNav .submenu-dark ul.dropdown-menu li { border-bottom-color: rgba(0,0,0,0.2); } */ #topNav ul.dropdown-menu li:last-child { border-bottom:0; } #topNav ul.dropdown-menu li a { margin:0; padding:7px 15px; font-weight:400; line-height:23px; color:#666; font-size:12px; display:block; text-decoration:none; } #topNav ul.dropdown-menu>li a i { margin-right:6px; font-size:12px; } #topNav ul.dropdown-menu a.dropdown-toggle { background-position: right center; background-repeat: no-repeat; } #topNav ul.dropdown-menu li.active>a, #topNav ul.dropdown-menu li.active:hover>a, #topNav ul.dropdown-menu li.active:focus>a, #topNav ul.dropdown-menu li:hover>a, #topNav ul.dropdown-menu li:focus>a, #topNav ul.dropdown-menu li:focus>a { color:#000; background-color:rgba(0,0,0,0.05); } #topNav ul.dropdown-menu li.divider { margin:-1px 0 0 0; padding:0; border:0; background-color:rgba(0,0,0,0.1); } #topNav .nav li:hover>ul.dropdown-menu { padding:0; display:block; z-index:100; } #topNav ul.dropdown-menu li .badge { margin-top:4px; } /* sub-submenu */ #topNav ul.dropdown-menu>li:hover > ul.dropdown-menu { display:block; position:absolute; left:100%; top:0; padding:0; margin:0; border-left:0 !important; border-right:0 !important; border-bottom:0 !important; } /** ************************************************************* **/ /* onepage active link */ #topMain.nav-onepage>li.active>a { font-weight:bold; } /** Responsive Top Nav ********************* **/ @media only screen and (max-width: 992px) { .navbar-collapse { height:100%; } #topNav div.nav-main-collapse { padding:0; margin:0; } #topNav button.btn-mobile { display:block; float:right; margin-right:0; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } #header.dark #topNav button.btn-mobile, #header.transparent #topNav button.btn-mobile, #header.theme-color #topNav button.btn-mobile { color:#fff; } #topNav nav.nav-main { background-color:#fff; } #topNav div.nav-main-collapse, #topNav div.nav-main-collapse.in { width: 100%; margin:-1px 0 0 0; } #topNav div.nav-main-collapse { float: none; overflow-x:hidden; max-height:350px; } /* ======================== MOBILE MENU V2 ===================== */ html.noscroll, html.noscroll body { overflow: hidden !important; } #header.fixed #topNav div.nav-main-collapse, #topNav div.nav-main-collapse { max-height:100% !important; height:100%; width: 100%; position: fixed !important; left:0 !important; right:0; bottom:0; top:0; z-index:9999 !important; overflow-y: scroll !important; padding-top:58px !important; margin:0 !important; } #topNav div.nav-main-collapse { -webkit-overflow-scrolling: touch; /* iOS smooth scroll */ -webkit-animation: fadeIn .3s !important; animation: fadeIn .3s !important; } #header.fixed #topNav button.btn-mobile-active, #topNav button.btn-mobile-active { position: fixed !important; z-index:999999 !important; background-color: #232323 !important; height: 60px !important; top:0 !important; width: 100%; left:0; right:0; margin: 0 !important; opacity: 0.9; } #topNav button.btn-mobile-active>i { float:right; margin-right:10px; margin-left:10px; color: #fff !important; font-size:30px; } #topNav button.btn-mobile-active>i:before { content: "\f00d" !important; } #menu-overlay { position: fixed; top:0; bottom:0; left:0; right:0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4); z-index:10 !important; } /* dropdown background color */ #topMain, #topNav ul.dropdown-menu { color: #fff; background-color: #333; display: block; } #topNav ul.dropdown-menu { border: 0; } #topMain>li>a { color: #fff !important; } #topNav ul.dropdown-menu li>a { color: #fbfbfb !important; } #topMain>li>a, #topNav ul.dropdown-menu li>a { font-size:15px !important; } /* ====================== END MOBILE MENU V2 ==================== */ #topNav div.nav-main-collapse.collapse:not(.show) { display: none; } #topNav div.nav-main-collapse.in { display: block !important; } #topNav div.nav-main-collapse { position: relative; } #topMain>li>a>span { display:none !important; } #topMain li { display:block !important; float:none; text-align:left; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #topMain li a { text-align:left; border:0; height:auto; line-height:15px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #topMain>li:hover, #topMain>li:hover>a { border-top:0 !important; } #topMain>li>a { height:auto; line-height:auto; } /* submenu */ #topMain ul.dropdown-menu { position: static; clear: both; float: none; display: none !important; border-left:0 !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } #topNav nav.nav-main li.resp-active > ul.dropdown-menu { display: block !important; margin-left:30px; margin-right:30px; padding:20px 0; border-right:0; } #topNav nav.nav-main li.resp-active > ul.dropdown-menu li { border-left:0; } #topNav ul.nav>li:hover>a:before, #topNav ul.nav>li.active>a:before { background-color:transparent; } #topNav ul.dropdown-menu>li:hover > ul.dropdown-menu { position:static; } #topNav div.submenu-dark ul.dropdown-menu { border-top:0; } /** sub menu */ #topNav nav.nav-main li.resp-active > ul.dropdown-menu { margin:0; padding:0; } #topNav nav.nav-main li > ul.dropdown-menu li a { padding-left:40px; width: 100%; display: block; } #topNav .dropdown-menu.float-right, #topNav .dropdown-menu.float-left { float:none !important; } } @media only screen and (max-width: 500px) { #topNav div.nav-main-collapse { max-height:290px; overflow-y:auto; } } /* Mega Menu */ /* LIGHT SUBMENU */ #topNav ul.dropdown-menu a.dropdown-toggle { background-image: url('../images/submenu_light.png'); } /* DARK SUBMENU */ #topNav div.submenu-dark ul.dropdown-menu { background:#333; background-color:#333; } #topNav div.submenu-dark ul.dropdown-menu a.dropdown-toggle { background-image: url('../images/submenu_dark.png'); } #topNav div.submenu-dark ul.dropdown-menu li.active>a, #topNav div.submenu-dark ul.dropdown-menu li.active:hover>a, #topNav div.submenu-dark ul.dropdown-menu li.active:focus>a, #topNav div.submenu-dark ul.dropdown-menu li:hover>a, #topNav div.submenu-dark ul.dropdown-menu li:focus>a, #topNav div.submenu-dark ul.dropdown-menu li:focus>a { color:#fff; background-color:rgba(0,0,0,0.15); } #topNav div.submenu-dark ul.dropdown-menu li.divider { background-color:rgba(255,255,255,0.1); } #topNav div.submenu-dark ul.dropdown-menu>li a { color:#ccc; } @media only screen and (max-width: 992px) { #topNav div.submenu-dark li>a { color: #fff !important; } #header.translucent #topMain, #header.dark.transparent #topMain { background-color: #333 !important; } } /** Page Menu **************************************************************** **/ #page-menu { position: relative; height: 44px; line-height: 46px; background-color:#333; color:#fff; text-shadow:rgba(0,0,0,.1) 1px 1px 1px; z-index:100; overflow:hidden; } #page-menu ul { margin:0; line-height: 44px; } #page-menu ul>li { line-height: 44px; float:left; } #page-menu ul>li>a { color:#fff; height:44px; padding:0 10px; display:inline-block; text-decoration:none; -webkit-transition: all .300s; -moz-transition: all .300s; -o-transition: all .300s; transition: all .300s; } #page-menu ul>li>a>i { margin-right:5px; } #page-menu ul>li:hover, #page-menu ul>li.active { background-color:rgba(0,0,0,0.3); } #page-menu nav { position:relative; } #page-menu-mobile { display:none; font-size:21px; background-color:rgba(0,0,0,0.2); height:44px; width:44px; } @media only screen and (min-width: 990px) { #page-menu ul { display:block !important; } } @media only screen and (max-width: 992px) { #page-menu { overflow:visible; } #page-menu ul>li { float:none !important; } #page-menu-mobile { display:inline-block; } #page-menu ul { display:none; position:absolute; min-width:200px; } #page-menu nav.float-right ul { right:-15px; top:44px; } #page-menu nav.float-right #page-menu-mobile { margin-right:-15px; } #page-menu ul>li, #page-menu ul>li>a { color:#fff !important; display:block; float:none; } #page-menu ul>li>a { color:#ccc; } } /* page menu light */ /* page menu dark */ /* page menu color */ /* page menu transparent */ @media only screen and (max-width: 992px) { #page-menu ul li { border-left:0; } } /** BULLET NAV ********************* */ #nav-bullet { position: fixed; padding: 0; top: 50%; transform: translateY(-50%); right: 1em; z-index: 100; font-size:14px; } #nav-bullet ul { list-style: none; display: inline-block; padding: 0.92857143em; background: rgba(0, 0, 0, 0.4); border-radius: 1.85714286em; transition: all .2s ease; } #nav-bullet ul:hover { background: rgba(0, 0, 0, 0.6); } #nav-bullet ul li:not(:last-child) { margin-bottom: 1.85714286em; } @media all and (max-width: 767px) { #nav-bullet { right: 0; } #nav-bullet ul { border-radius: 1.85714286em 0 0 1.85714286em; padding: 1.85714286em 0.92857143em; } } #nav-bullet li a { width: 8px; height: 8px; background: #fff; border-radius: 50%; transition: all .2s ease; display: block; position: relative; } #nav-bullet li a:not(:hover) { opacity: .5; } #nav-bullet li.active a { opacity: 1; animation: bulge .5s ease; -webkit-animation: bulge .5s ease; } @keyframes bulge { 0% { transform: scale(1); } 50% { transform: scale(1.3); } 100% { transform: scale(1); } } @-webkit-keyframes bulge { 0% { transform: scale(1); } 50% { transform: scale(1.3); } 100% { transform: scale(1); } } #nav-bullet li a[data-title]:before { content: attr(data-title); position: absolute; right: 12px; top: -14px; background: #222; color: #fff; border-radius: 6px; padding: 4px 8px; display: inline-block; transition: all .2s ease; white-space: nowrap; } #nav-bullet li a[data-title]:not(:hover):before { opacity: 0; transform: translateX(-20px); } /** Scroll To Top **************************************************************** **/ #toTop { font-size:38px; line-height:33px; background-color: rgba(0,0,0,0.3); color: #FFF; position: fixed; height: 35px; width: 40px; right: 6px; bottom: 6px; text-align: center; text-transform: uppercase; opacity: 0.9; filter: alpha(opacity=90); text-decoration:none; display:none; z-index: 1000; -webkit-border-radius: 2px !important; -moz-border-radius: 2px !important; border-radius: 2px !important; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } #toTop:hover { background-color: rgba(0,0,0,0.7); } #toTop:before { font-family: "fontawesome"; content: "\f102"; } /** Preloader **************************************************************** **/ #preloader { position: fixed; z-index: 9999999; top: 0; bottom: 0; right: 0; left: 0; background: #fff; } .inner { position: absolute; top: 0; bottom: 0; right: 0; left: 0; width: 54px; height: 54px; margin: auto; } #preloader span.loader { width: 50px; height: 50px; position: absolute; top: 50%; left: 50%; margin: -25px 0 0 -25px; font-size: 10px; text-indent: -12345px; border-top: 1px solid rgba(0,0,0, 0.08); border-right: 1px solid rgba(0,0,0, 0.08); border-bottom: 1px solid rgba(0,0,0, 0.08); border-left: 1px solid rgba(0,0,0, 0.5); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-animation: spinner 700ms infinite linear; -moz-animation: spinner 700ms infinite linear; -ms-animation: spinner 700ms infinite linear; -o-animation: spinner 700ms infinite linear; animation: spinner 700ms infinite linear; z-index: 100001; } @-webkit-keyframes spinner { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-moz-keyframes spinner { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-o-keyframes spinner { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spinner { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } /** Misc **************************************************************** **/ /* ported from bootstrap 4 */ .dropdown-menu { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .navbar-toggle { border:0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .navbar-toggle { position: relative; float: right; padding: 9px 10px; margin-top: 8px; margin-right: 15px; margin-bottom: 8px; background-color: transparent; background-image: none; border: 1px solid transparent; border-radius: 4px; display: none; } .navbar-toggle .icon-bar { display: block; width: 22px; height: 2px; border-radius: 1px; margin-bottom:3px; } .navbar-default .navbar-toggle .icon-bar { background-color:#111; } @media only screen and (max-width: 768px) { .navbar-toggle { display: inherit; } } /* infinite scroll */ form .row { margin-bottom:20px; } form label { font-weight:bold; } table a { color:#666; } section.dark table a { color:#ddd; } /* Featured OWL Carousel */ /* increment / decrement - quantity shop like \3c !-- QTY --> - + \3c !-- /QTY --> */ /* Link List - example: page-faq-4.html */ /* Slimscroll */ /* Canvas Particles */ /* Youtube Background */ #video-volume { bottom: 85px; left: 50%; margin: 0 0 0 -15px; position: absolute; z-index: 100; width: 30px; height: 30px; line-height: 26px; font-size: 20px; text-align: center; border-radius: 50%; border: 1px solid #fff; color: #FFFFFF; cursor: pointer; } /* Text Rotator */ h1>span.rotate, h2>span.rotate, h3>span.rotate, h4>span.rotate, h5>span.rotate, h6>span.rotate { color:inherit !important; } /** EVENT LIST Example Usage: index-thematics-music.html
02 April

Columbia, SC

Colonial Life Arena w/ Aloe Blacc
Buy Now
**/ /** INLINE NEWS Example Usage: index-thematics-music.html
STICKY POST image
29 June 2015

Lorem Upsum Dolor

Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Idque Caesaris facere voluntate liceret: sese habere....

**/ /** TEAM ITEM example usage: index-thematics-wedding.html
wedding

MIKE BAKER

Groom

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Commodi, pariatur, magni! Omnis reiciendis architecto, cupiditate fuga dolores nam accusamus iste molestias quos mollitia totam eius porro culpa incidunt, sunt rerum molestiae aliquid non hic.

\3c !-- Social Icons -->
\3c !-- /Social Icons -->
********************** **/ /* flot chart */ /* Vectorial Map */ svg { touch-action: none; } /* breathing background zoom in - zoom out */ /* menu title */ #topNav #topMain li>h4 { display: block; padding: 10px 15px 10px 15px; margin:0; color: #111; font-weight: 600; font-size: 14px; background-color: rgba(0,0,0,0.05); } #topNav .submenu-dark #topMain li>h4 { color: #fff; background-color: rgba(0,0,0,0.15); } #header #topNav #topMain li>h4>i { margin-right: 8px; } /* menu caption */ /* no topmain dropdown icon */ #topMain.nav-pills>li>a.dropdown-toggle.noicon { padding-right: 15px !important; } #topMain.nav-pills>li>a.dropdown-toggle.noicon:after { display: none !important; } #topMain .dropdown-toggle>.badge { padding: .1em .4em .3em; } /* no menu lines */ #topNav ul.dropdown-menu.dropdown-menu-clean li { border-bottom: 0 !important; } /* dropdown open inversed */ #topMain li.dropdown.open-inverse ul.dropdown-menu li>ul { right:100%; left: auto; } /* DROPDOWN ANIMATE Dependency: animate.css */ /* FADE IN */ #topMain.nav-animate-fadeIn li.dropdown:hover>ul.dropdown-menu, #topMain .nav-animate-fadeIn:hover>ul.dropdown-menu { -webkit-animation: fadeIn .6s; animation: fadeIn .6s; } /* FADE IN UP */ #topMain.nav-animate-fadeInUp li.dropdown:hover>ul.dropdown-menu, #topMain .nav-animate-fadeInUp:hover>ul.dropdown-menu { -webkit-animation: fadeInUp .2s; animation: fadeInUp .2s; } /* BOUNCE IN */ #topMain.nav-animate-bounceIn li.dropdown:hover>ul.dropdown-menu, #topMain .nav-animate-bounceIn:hover>ul.dropdown-menu { -webkit-animation: bounceIn .6s; animation: bounceIn .6s; } /* BOUNCE IN UP */ #topMain.nav-animate-bounceInUp li.dropdown:hover>ul.dropdown-menu, #topMain .nav-animate-bounceInUp:hover>ul.dropdown-menu { -webkit-animation: bounceInUp .2s; animation: bounceInUp .2s; } /* FLIP IN X */ #topMain.nav-animate-flipInX li.dropdown:hover>ul.dropdown-menu, #topMain .nav-animate-flipInX:hover>ul.dropdown-menu { -webkit-animation: flipInX .5s; animation: flipInX .4s; } /* FLIP IN Y */ #topMain.nav-animate-flipInY li.dropdown:hover>ul.dropdown-menu, #topMain .nav-animate-flipInY:hover>ul.dropdown-menu { -webkit-animation: flipInY .5s; animation: flipInY .4s; } /* ZOOM IN */ #topMain.nav-animate-zoomIn li.dropdown:hover>ul.dropdown-menu, #topMain .nav-animate-zoomIn:hover>ul.dropdown-menu { -webkit-animation: zoomIn .5s; animation: zoomIn .5s; } /* SLIDE IN UP */ #topMain.nav-animate-slideInUp li.dropdown:hover>ul.dropdown-menu, #topMain .nav-animate-slideInUp:hover>ul.dropdown-menu { -webkit-animation: slideInUp .1s; animation: slideInUp .1s; } /* TOPMAIN TEXT HOVER ANIMATED */ #topMain.nav-hover-animate ul.dropdown-menu li a, #topMain .nav-hover-animate ul.dropdown-menu li a { -webkit-transition: all .300s; transition: all .300s; } #topMain.nav-hover-animate ul.dropdown-menu li:hover>a, #topMain .nav-hover-animate ul.dropdown-menu li:hover>a { padding-left: 23px; } /* topmain hover bounce in */ /* side nav mobile max height - essentials rewrite */ @media only screen and (max-width: 768px) { div.side-nav ul { max-height:650px; } } /* gradient bg */ /* sizes */ /* fix page title */ section.page-header * { z-index:10; } /* disable uppercase text transformation */ /* cookie alert */ #cookie-alert { position: fixed; left:0; right:0; top:-150px; bottom:auto; width: 100%; padding: 10px; margin: 0; border-radius:0; -moz-border-radius:0; border: 0; z-index:999999; } #cookie-alert.alert-position-bottom { top:auto; bottom:-150px; } #cookie-alert p { margin:0; padding: 6px 0 0 0; } #cookie-alert .fa { margin: 0 8px; font-size:16px; } #cookie-alert>.container { padding: 0; margin-top: 0; margin-bottom: 0; } /** FULLSCREEN GOOGLE MAP *************************** **/ /** BACKSTRETCH NAVIGATION *************************** **/ .bs-next, .bs-prev { display: block; position: absolute; width: 60px; height: 60px; top: 50%; margin-top: -30px; text-align: center; opacity: 0.5; border-radius: 3px; line-height: 60px; z-index: 100; } .bs-next:hover, .bs-prev:hover { background-color: rgba(0,0,0,0.2); opacity: 1; } .bs-next { right:15px; } .bs-prev { left:15px; } .bs-next:before, .bs-prev:before { content: "\f104"; font-family: 'FontAwesome'; display: block; font-size:50px; color: #fff; padding: 0; margin: 0; } .bs-next:before { content: "\f105"; } @media only screen and (max-width: 768px) { .bs-next, .bs-prev { top: auto; bottom: 15px; margin-top: 0; } } /** ROUNDED LOGO Usage: for sliders Example: feature-slider-backstretch.html *************************** **/ /** Premium Circles Example: shortcode-thumbnails.html *************************** **/ /** BS 4 fix ************************************ **/ .btn-default { color: #333; background-color: #fff; border-color: #ccc; padding: 6px 12px; line-height: 26px; } #topMain>li>a { display: block; position: relative; padding-left: 15px; padding-right: 15px; } #topMain .dropdown-toggle::after { border: 0; } #slider .page-header { border-radius: 2px; } ul.nav>li>a { display: block; } ul.nav.nav-pills>li { display: inline-block; } ul.dropdown-menu a { display: block; width: 100%; } ul.list-unstyled .dropdown-toggle::after { border:0; } .media { margin-top: 15px; } .dropdown-menu>li>a { font-weight: 400; color: #333; } .dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover { color: #fff; text-decoration: none; background-color: #337ab7; outline: 0; } .dropdown-menu .divider { height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5; padding: 0; } ul.pagination { display: inline-block; margin: 20px 0; } ul.pagination>li { float: left; } @media (min-width: 1200px) { .container { width: 1170px; max-width: 100%; } } /** Material Design **************************************************************** **/ /* WIDE CARD */ /* IMAGE CARD */ /* EVENT CARD */ /* checkbox fix */ /* table fix */ /* text fields fix */ /* RESPONSIVE CARDS */ /** Landing Page **************************************************************** **/ /** Featured Grid **************************************************************** **/ /* ribbon */ /** Captions **************************************************************** **/ /* Slider Default Caption Example usage: shop-4col-left.html (top banner) */ /** Aside **************************************************************** **/ /** Aside Navigation ********************* **/ ul.side-nav li { list-style:none; } ul.side-nav ul { margin:0 0 20px 0; padding:0; } ul.side-nav ul li { padding:0 15px; } ul.side-nav ul li:last-child { border-bottom:0; } ul.side-nav a { display:block; text-decoration:none; color:#333; font-size:13px; letter-spacing: 1px; } ul.side-nav a i.fa { width:10px; } ul.side-nav ul li a { padding:3px; font-size:12px; } ul.side-nav>li { padding:0; } ul.side-nav>li>a { padding:7px 10px; } ul.side-nav>li.active>a { background-color:transparent; } ul.side-nav > li.active>a { font-weight:700; } /** Masonry Gallery **************************************************************** **/ .masonry-gallery { position: relative; } .masonry-gallery a, .masonry-gallery img { display: block; height: auto!important; } .masonry-gallery a { position: relative; float: left; width: 25%; overflow: hidden; } .masonry-gallery img { width: 100%; border-radius: 0!important; padding: 0 1px 1px 0; } /* columns */ .masonry-gallery.columns-2 a { width: 50%; } .masonry-gallery.columns-3 a { width: 33.30%; } .masonry-gallery.columns-4 a { width: 25%; } .masonry-gallery.columns-5 a { width: 20%; } .masonry-gallery.columns-6 a { width: 16.60%; } /** Simple Gallery [CSS ONLY] **************************************************************** **/ /** Image Hover **************************************************************** **/ /** Sticky Side **************************************************************** **/ .sticky-side { position: fixed; top: 50%; left: 6px; width: 36px; z-index: 1; } .sticky-side .social-icon { margin:0; } /** Parallax Social icons **************************************************************** **/ ul.social-icons { display: inline-block; list-style: none; padding: 0; } ul.social-icons li { text-align:center; display: inline-block; padding: 15px 40px; } ul.social-icons a h4 { font-size: 15px; letter-spacing: 1px; margin-top: 0; margin-bottom: 0; } ul.social-icons a { color:#fff; text-decoration:none; } ul.social-icons a>span { font-size: 13px; color:#999; } ul.social-icons a>i.fa { line-height: 1!important; } ul.social-icons a h4, ul.social-icons a span { -webkit-transition: 0.2s all linear; -moz-transition: 0.2s all linear; -ms-transition: 0.2s all linear; -o-transition: 0.2s all linear; transition: 0.2s all linear; } ul.social-icons a>i.fa { border-radius: 50% !important; width: 100px; height: 100px; line-height:100px !important; margin: 0 auto 0 auto; font-size:60px; -webkit-transition: 0.16s all linear; -moz-transition: 0.16s all linear; -ms-transition: 0.16s all linear; -o-transition: 0.16s all linear; transition: 0.16s all linear; } ul.social-icons a:hover>i.fa { background: rgba(255,255,255,0.1); font-size: 50px; line-height:100px !important; } @media (max-width:482px) { ul.social-icons li { padding: 15px 10px; } } /** Word Rotator **************************************************************** **/ .word-rotator { visibility: hidden; width: 100px; height: 0; margin-bottom:-11px; display: inline-block; overflow: hidden; text-align: left; position: relative; } h1 .word-rotator { bottom:-3px; height: 54px !important; } section.page-header h1 .word-rotator { bottom:1px; height: 39px !important; } h2 .word-rotator { bottom:0; height: 45px !important; } h3 .word-rotator { bottom:2px; height: 36px !important; } h4 .word-rotator { bottom:4px; height: 27px !important; } h5 .word-rotator { bottom:6px; height: 21px !important; } a .word-rotator { bottom:5px; height:24px; } .word-rotator.active { visibility: visible; width: auto; } .word-rotator .items { position: relative; width: 100%; } .word-rotator .items span { display:block; margin-bottom:0; } /* Rotator Plugin */ /** Sliders **************************************************************** **/ section#slider { display:block; padding:0; margin:0; box-shadow:none; background-color:#151515; overflow:hidden !important; border-bottom:0; z-index:0; -webkit-transition: all 0s; -moz-transition: all 0s; -o-transition: all 0s; transition: all 0s; } /* enable animation for mobile fullheight */ section#slider.mobile-fullheight { -webkit-transition: all .400s; -moz-transition: all .400s; -o-transition: all .400s; transition: all .400s; } section#slider.transparent { background-color:transparent; } section#slider.parallax-slider:before { background-color: rgba(0,0,0,0.0); position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; } section#slider .text-muted { color: #fff !important; } section#slider canvas { width:auto !important; height:auto !important; } section#slider a:hover { color:#fff; } /* slider form */ section#slider:not(.custom-form) form .btn { margin:0; } section#slider:not(.custom-form) input { color:#fff; background-color:rgba(0,0,0,0.7); border-color:rgba(255,255,255,0.3); } section#slider:not(.custom-form) .input-group-addon:first-child { color:#ccc; background-color:rgba(0,0,0,0.7); border-color:rgba(255,255,255,0.3); } section#slider:not(.custom-form) form.validate input.error { color:#333; } section#slider:not(.custom-form) input:focus { border-color:rgba(255,255,255,0.3); } section#slider:not(.custom-form) .btn-default { background-color:rgba(0,0,0,0.2); border-color:rgba(255,255,255,0.5); } #slider h1, .slider h1, #slider h2, .slider h2, #slider h3, .slider h3, #slider h4, .slider h4, #slider h5, .slider h5, #slider h6, .slider h6 { color:#fff; } /* slider top links */ /* shadows - over image */ /** Next | Prev ************************* **/ .tparrows.round, .tp-leftarrow.round, .tp-rightarrow.round, .flex-prev, .flex-next { background-image:none !important; border:0; color:#ccc; font-size:34px; line-height:55px; height:auto !important; width:56px !important; text-align:center; background-color:rgba(0,0,0,0.2); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all .400s; -moz-transition: all .400s; -o-transition: all .400s; transition: all .400s; } .tp-rightarrow.round, .flex-next { right:-3px; } .tp-leftarrow.round, .flex-prev { left:-3px; } .tp-leftarrow.round:hover, .tp-rightarrow.round:hover, .flex-next:hover, .flex-prev:hover { color:#fff; background-color:rgba(0,0,0,0.5); } /** Flex Slider **/ /** Swiper Slider ************************* **/ /** Nivo Slider ************************* **/ /** Camera Slider ************************* **/ /** Elastic Slider ************************* **/ /** Revolution Slider ************************* **/ .tp-caption { text-shadow:#000 1px 1px 1px; } .tp-caption.text_white, .tp-caption.text_black, .tp-caption.block_white, .tp-caption.block_theme_color, .tp-caption.block_black { white-space: nowrap; line-height: 34px; border-width: 0px; margin: 0px; padding: 1px 10px; letter-spacing: 0px; font-size: 22px; color: #fff; text-shadow:none; } .tp-caption.block_white { background-color: #fff; } .tp-caption.block_black { background-color: #000; } .tp-caption.text_white { color: #fff; } .tp-caption.text_black { color: #111; } .tp-bannertimer { background:rgba(0,0,0,0.5) !important; height:2px !important; } .tparrows.round:before { font-family: 'revicons'; } .tparrows { top:50% !important; margin-top:-25px; } .tparrows.preview1 { margin-top:-50px !important; } .tparrows.preview4 { margin-top:-50px !important; } .tparrows.preview2 { line-height:1; } .tparrows:hover { color: #fff; } .tp-leftarrow.round:before { content: '\e824'; } .tp-rightarrow.round:before { content: '\e825'; } .tparrows.tp-rightarrow:before { margin-left: 1px; } /* bullets */ .tp-bullets.simplebullets.round { bottom:20px !important; } .tp-bullets.simplebullets.round .bullet { background:none; background-color:#fff; height:5px; } .tp-bullets.simplebullets.round .bullet.selected { background-color:#000; } /* revslider 5+ */ .rev_slider_wrapper.arrows-bottom .tparrows { top:100% !important; } .rev_slider_wrapper .tp-caption { text-shadow:none; } .rev_slider_wrapper .inner { bottom:inherit !important; right:auto !important; width:auto !important; height:auto !important; } .rev_slider_wrapper.bottom-noinherit .inner { bottom:0 !important; } .tp-tabs, .tp-tab-mask, .tp-thumb-mask { z-index:1001; } .tp-thumbs { width:auto; } .rev_slider_wrapper.bottom-noinherit .tp-tab-mask { transform: matrix(1, 0, 0, 1, 0, 100) !important; height:100% !important; max-height:100% !important; } .rev_slider_wrapper.tparrows-bottom .tparrows { top:auto !important; bottom:-80px !important; margin-top:0 !important; } /* centerig fix */ .tp-caption.Dining-Social, .tp-caption.VideoControls-Play { text-align:center !important; } /* rs-55.html arrows fix */ /* rs-57.html */ .rs-57 .bullet-bar.tp-bullets:before{ content:" "; position:absolute; width:100%; height:100%; background:transparent; padding:10px; margin-left:-10px; margin-top:-10px; box-sizing:content-box; } .rs-57 .bullet-bar .tp-bullet { width:60px; height:3px; position:absolute; background:#aaa; background:rgba(204,204,204,0.5); cursor:pointer; box-sizing:content-box; } .rs-57 .bullet-bar .tp-bullet:hover, .rs-57 .bullet-bar .tp-bullet.selected { background:rgba(204,204,204,1); } /** Layer Slider ************************* **/ /** Slider Featured Text ************************ **/ /** **/ #slider img.img-fluid { display:inline-block; } #slider h1, #slider h2, #slider h3, #slider h4, #slider h5, #slider h6, #slider p { color:#fff; text-shadow:rgba(0,0,0,0.16) 1px 1px 1px; } #slider h1 { font-size:60px; line-height:60px; } #slider h2 { font-size:40px; line-height:40px; } #slider h3 { font-size:30px; line-height:30px; } #slider:not(.custom-form) .btn { margin-top:30px; } #slider:not(.custom-form) .btn-default, .slider .btn-default { color:#fff; background-color:transparent; border-color:#fff; border-width:2px; } #slider:not(.custom-form) .btn-default:hover, .slider .btn-default:hover { background-color:rgba(255,255,255,0.1); } #slider:not(.custom-form) .btn, .slider .btn { color:#fff !important; } #slider .btn.btn-lg { font-size: 16px; } @media only screen and (max-width: 768px) { #slider h1 { font-size:30px !important; line-height:35px !important; text-align:center; } #slider h2 { font-size:27px !important; line-height:27px !important; text-align:center; } #slider h3 { font-size:23px !important; line-height:23px !important; text-align:center; } } /** Standard Forms Messages USAGE:

Message sent! Thank You!

**************************************************************** **/ /** Portfolio **************************************************************** **/ /* do not move from here - we rewrite this below */ .item-box-desc h2, .item-box-desc h3, .item-box-desc h4, .item-box-desc h5 { font-size:18px; line-height:21px; margin:0; padding:0; } .item-box .owl-carousel { margin-top:0px !important; } #portfolio { overflow:hidden; } #portfolio h2, #portfolio h3 { font-size:18px; line-height:20px; margin:0; color:#111; } #portfolio .portfolio-item h2, #portfolio .portfolio-item h3 { text-overflow:ellipsis; white-space: nowrap; } #portfolio div.col-md-3 h2, #portfolio div.col-md-3 h3 { font-size:18px; line-height:18px; } section.dark #portfolio h2, section.dark #portfolio h3 { color:#fff; } /* dark section */ section.dark#portfolio h2, section.dark #portfolio h2, section.dark#portfolio h3, section.dark #portfolio h3 { color:#fff !important; } .mix.row { display: -webkit-box !important; } #portfolio .mix-grid>.row.mix { border-bottom:rgba(0,0,0,0.1) 1px solid; margin-bottom:60px; padding-bottom:60px; } #portfolio .mix-grid>.row.mix:last-child { border-bottom:0; } #portfolio .mix-grid>.row>div:last-child { margin-bottom:0 !important; } #portfolio .item-box-desc h2, #portfolio .item-box-desc h3 { font-size:18px; line-height:20px; } #portfolio .item-box-overlay-title { display:block; position:absolute; left:0; right:0; bottom:0; padding:8px; color:#fff; background-color:rgba(0,0,0,0.6); color:#fff; z-index:100; } #portfolio .item-box-overlay-title h2, #portfolio .item-box-overlay-title h3, #portfolio .item-box-overlay-title h4, #portfolio .item-box-overlay-title a { color:#fff; } #portfolio .item-box-overlay-title a:hover { color:#fff !important; } @media only screen and (max-width: 992px) { #portfolio div.col-md-5>h2, #portfolio div.col-md-5>h3 { margin-top:30px; } } /** Gutter ****************** **/ #portfolio.portfolio-nogutter .row>div, #portfolio.portfolio-nogutter .item-box { padding: 0 !important; margin: 0 !important; } /** Isotope Portfolio ****************** **/ #portfolio.portfolio-isotope { display:block; margin:auto; width:100%; } #portfolio.portfolio-isotope .item-box-desc { margin-bottom:0; } /* 2 columns */ #portfolio.portfolio-isotope-2 .portfolio-item { margin: 0 20px 20px 0; float:left; } #portfolio.portfolio-isotope-2 .item-box-desc { padding:20px; } /* 3 columns */ #portfolio.portfolio-isotope-3 .portfolio-item { margin: 0 15px 15px 0; } #portfolio.portfolio-isotope-3 .item-box-desc { padding:20px; } /* 4 columns */ #portfolio.portfolio-isotope-4 .portfolio-item { margin: 0 12px 12px 0; } #portfolio.portfolio-isotope-4 .portfolio-item h3, #portfolio.portfolio-isotope-4 .portfolio-item h4 { font-size:17px; line-height:17px; } #portfolio.portfolio-isotope-4 .item-box-desc { padding:20px 10px 20px 10px; } /* 5 columns */ #portfolio.portfolio-isotope-5 .portfolio-item { margin: 0 10px 10px 0; } #portfolio.portfolio-isotope-5 .portfolio-item h3, #portfolio.portfolio-isotope-5 .portfolio-item h4 { font-size:16px; line-height:16px; } #portfolio.portfolio-isotope-5 .item-box-desc { padding:20px 10px 20px 10px; } /* 6 columns */ #portfolio.portfolio-isotope-6 .portfolio-item { margin: 0 6px 6px 0; } #portfolio.portfolio-isotope-6 .portfolio-item h3, #portfolio.portfolio-isotope-6 .portfolio-item h4 { font-size:15px; line-height:15px; } #portfolio.portfolio-isotope-6 .item-box-desc { padding:20px 10px 20px 10px; } #portfolio.portfolio-isotope.portfolio-nogutter .portfolio-item { margin:0; } /** Ajax Portfolio ****************** **/ /** Portfolio Single ****************** **/ /** Item Box **************************************************************** **/ .item-box { overflow:hidden; margin:0; position:relative; box-shadow:rgba(0,0,0,0.1) 0 0 5px; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; } .mix-grid .item-box, #portfolio .item-box { box-shadow:none; } .item-box.fullwidth { max-width:100%; } .item-box figure { width:100%; display:block; margin-bottom:0; overflow:hidden; position:relative; text-align:center; } .item-box.fixed-box figure img { width:100%; height:auto; } .item-box-desc { padding:30px 20px 20px 20px; overflow:hidden; margin-bottom:10px; text-align:left !important; } .item-box-desc p { margin-top:20px; display:block; overflow:hidden; text-overflow:ellipsis; /*white-space: nowrap;*/ } .item-box.fixed-box .item-box-desc p { height:98px; } .item-box-desc h2, .item-box-desc h3, .item-box-desc h4, .item-box-desc h5 { padding:0; margin:0; } .item-box .item-box-desc small { display:block; } .item-box.fixed-box .item-box-desc { height:256px; } .item-box.fixed-box figure { max-height:263px; } .item-box .socials { border-top:#eee 1px solid; text-align:center; display:block; } /* hover */ .item-box .item-hover { opacity: 0; filter: alpha(opacity=0); position:absolute; left:0; right:0; top:0; bottom:0; text-align:center; color:#fff; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .item-box .item-hover, .item-box .item-hover button, .item-box .item-hover a { color:#fff; } .item-box .item-hover .inner { position:absolute; display:block; left:0; right:0; top:50%; margin-top:-10px; margin-bottom:0; width:100%; z-index:100; line-height:23px; } .item-box:hover .item-hover { opacity: 1; filter: alpha(opacity=100); } .item-box .item-hover .inner .ico-rounded>span { color:#666; background-color:#fff; width:50px; height:50px; line-height:50px !important; margin:-20px 5px 0 5px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-bottom-right-radius: 20px; -webkit-border-top-left-radius: 20px; -moz-border-radius-bottomright: 20px; -moz-border-radius-topleft: 20px; border-bottom-right-radius: 20px; border-top-left-radius: 20px; } .nav-pills>li.active>a, .nav-pills>li.active>a:hover, .nav-pills>li.active>a:focus { color:#333; background-color:rgba(0,0,0,0.07); } /** Mixitup **************************************************************** **/ .mix-grid .mix { opacity: 0; display: none; } .mix.nogutter, .mix.nogutter>.item-box { padding:0 !important; margin:0 !important; line-height:0; } /** Blog **************************************************************** **/ .blog-post-item { display:block; margin-bottom:80px; padding-bottom:60px; border-bottom:#eee 1px solid; position:relative; } section.dark .blog-post-item { border-bottom:#444 1px solid; } .blog-post-item h2 { letter-spacing:0; font-family:'Open Sans',Arial,Helvetica,sans-serif; font-size:22px; margin-bottom:10px; } /* blog misc */ .blog-post-item .flexslider { margin-bottom:20px; } /** Blog Small Image ****************** **/ /** Isotope Blog ****************** **/ #blog.blog-isotope { display:block; margin:auto; width:100%; } #blog.blog-isotope-3 .blog-post-item .flexslider, #blog.blog-isotope-4 .blog-post-item .flexslider { margin-bottom:20px; } /* 2 columns */ #blog.blog-isotope-2 .blog-post-item { margin: 0 20px 20px 0; float:left; border:0; } #blog.blog-isotope-2.blog-post-item h2 { font-size:17px; line-height:17px; } /* 3 columns */ #blog.blog-isotope-3 .blog-post-item { margin: 0 15px 15px 0; border:0; } #blog.blog-isotope-3 .blog-post-item h2 { font-size:17px; line-height:17px; } /* 4 columns */ #blog.blog-isotope-4 .blog-post-item { margin: 0; padding:0 15px 60px 15px; border:0; } #blog.blog-isotope-4 .blog-post-item h2 { font-size:17px; line-height:17px; } /* 5 columns */ /* 6 columns */ /** Blog Single ****************** **/ /** Comments **************************************************************** **/ /* BORDERED COMMENTS */ /* Portrait tablets and medium desktops */ @media (min-width: 768px) { /*****Left Arrow*****/ /*Background color effect*/ /*****Right Arrow*****/ /*Background color effect*/ } /* article default comments usage example: page-profile-comments.html */ /** Timeline **************************************************************** **/ .timeline { position:relative; padding-left:100px; } /* horizontal line [left|center|right] */ /* timeline entry */ /* timeline center */ /** Contact **************************************************************** **/ /** Error 404 **************************************************************** **/ /** Maintenance **************************************************************** **/ /** Login & Register **************************************************************** **/ /** Search Page **************************************************************** **/ /** Block Review example usage: page-forum-post.html **************************************************************** **/ /** Category Grid **************************************************************** **/ @media only screen and (min-width: 768px) { /* 6 COLUMNS - RECALIBRATE FOR LONG TITLES */ /* 5 COLUMNS - RECALIBRATE FOR LONG TITLES */ /* 4 COLUMNS - RECALIBRATE FOR LONG TITLES */ /* 3 COLUMNS - RECALIBRATE FOR LONG TITLES */ } @media only screen and (max-width: 768px) { /* 2 COLUMNS - RECALIBRATE FOR LONG TITLES */ } /** Cards **************************************************************** **/ .card { margin-bottom: 26px; overflow-y: auto; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: rgba(0, 0, 0, 0.027451) 0px 2px 1px; -moz-box-shadow: rgba(0, 0, 0, 0.027451) 0px 2px 1px; -o-box-shadow: rgba(0, 0, 0, 0.027451) 0px 2px 1px; box-shadow: rgba(0, 0, 0, 0.027451) 0px 2px 1px; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; background-color: #fff; border: 1px solid rgba(0,0,0,.125); border-radius: .25rem; } .card img { width: 100%; } section.dark .card { background-color: rgba(0,0,0,0.2); } /** Footer **************************************************************** **/ #footer { font-size:14px; color: rgba(255,255,255,0.6); display: block; background: #313131; background: -moz-linear-gradient(top, #555555 0%, #313131 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1a1d2b), color-stop(100%, #313131)); background: -webkit-linear-gradient(top, #555555 0%, #313131 100%); background: -o-linear-gradient(top, #555555 0%, #313131 100%); background: -ms-linear-gradient(top, #555555 0%, #313131 100%); background: linear-gradient(to bottom, #555555 0%,#313131 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#313131',GradientType=0 ); } #footer>.container { padding-top:60px; margin-bottom:60px; } #footer:after, #footer:before { content:" "; display:table; } #footer:after { display: block; content: ""; clear: both; } #footer>.copyright { background-color:rgba(0,0,0,0.2); text-shadow: 1px 1px 1px rgba(0,0,0,0.1); padding:25px 0; font-size:13px; display:block; } #footer>.copyright:after, #footer>.copyright:before { content:" "; display:table; } #footer>.copyright:after { display: block; content: ""; clear: both; } #footer canvas { width:auto !important; height:auto !important; } /* Footer Logo */ #footer img.footer-logo { margin-bottom:20px; display:block; } /* Footer Typography */ #footer h2 { font-size:26px; text-shadow:rgba(0,0,0,0.3) 3px 3px 5px; } #footer h3 { font-size:18px; margin-bottom:25px; } #footer h4 { font-size:15px; margin-bottom:25px; } #footer a { color: rgba(255,255,255,0.6); text-decoration:none; } #footer a:hover { color: rgba(255,255,255,0.9); } #footer a>i.fa { padding-right: 6px; } #footer p { margin-top:0; } #footer ul { margin-bottom:0; } #footer address { margin-bottom:0; } #footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6 { color: rgba(255,255,255,0.8); font-weight:600; } /* footer form */ #footer form input, #footer form textarea { color: #999; background-color: rgba(0,0,0,.2); border-color: rgba(0,0,0,.25); margin-bottom:6px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } #footer form input:focus, #footer form textarea:focus { background-color: rgba(0,0,0,.3); } #footer form .input-group-addon { color: #999; background-color: rgba(0,0,0,.4); border-color: rgba(0,0,0,.25); } @media only screen and (max-width: 480px) { #footer h4 { margin-top:60px; display:block; } #footer .copyright { text-align:center; } } /* footer list links */ #footer ul.footer-links>li { padding-bottom:10px; font-weight:300; } #footer ul.footer-links>li>a { color: rgba(255,255,255,0.6); } #footer ul.footer-links>li>a:hover { color: rgba(255,255,255,0.9); } #footer ul.footer-links>li>a:before { content: "\f105"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; padding-right:10px; } /* footer news list */ /* footer posts */ /* footer contact text */ #footer address { background:url('../images/world-map.png') no-repeat center; } #footer p { line-height:18px; } /* footer links - breadcrumbs like */ /* footer images gallery */ @media only screen and (max-width: 768px) { #footer .row>div { margin-bottom:60px; } } /* sticky footer */ footer.sticky { width: 100%; } @media only screen and (max-width: 768px) { footer.sticky { top:auto !important; position:relative !important; } } #footer .btn, #footer .form-control { height:36px; } #footer .btn-lg { height:auto; } /* footer social icons */ #footer a.social-icon { color: #999 !important; } /** Footer Light ** ************************ **/ /* footer social icons */ /** Fixed Footer ** ************************ **/ /** Responsive **************************************************************** **/ @media only screen and (max-width: 992px) { #header.header-sm #topNav button.btn-mobile { margin-top:16px; } #header.header-sm #topNav button.btn-mobile { margin-top:11px; } #header .nav-second-main .quick-cart-box, #header .nav-second-main .search-box { box-shadow:none !important; } /* fullwidth button fix */ body>.btn.fullwidth, #wrapper>.btn.fullwidth { padding-top:0!important; padding-bottom:20px!important; white-space: pre; /* CSS 2.0 */ white-space: pre-wrap; /* CSS 2.1 */ white-space: pre-line; /* CSS 3.0 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ white-space: -moz-pre-wrap; /* Mozilla */ white-space: -hp-pre-wrap; /* HP Printers */ word-wrap: break-word; /* IE 5+ */ } body>.btn.fullwidth>span, #wrapper>.btn.fullwidth >span { line-height:30px !important; } } @media only screen and (max-width: 768px) { img.img-fluid { float: none !important; } #header.fixed { position:fixed; } #header.transparent + #slider h1 { margin-top:80px !important; } section div.row>div { margin-bottom:60px; } section div.row.lightbox>div { margin-bottom:0; } section form div.row>div { margin-bottom:15px; } section form div.row>div:last-child { margin-bottom:0; } } /** DEMO ONLY DO NOT USE THIS CSS - USED FOR DEMO ONLY! **************************************************************** **/ /** *** **/ /** *** **/ /** *** **/ /** *** **/ /** *** **/ /** et line icons */ .et-line-icons li>i { margin-top: 5px; margin-bottom: 10px; font-size: 26px; display:block; text-align:center; color:#000; margin-top:25px; } .et-line-icons li>span { font-size:13px; } .et-line-icons li { float: left; width: 25%; height: 115px; padding: 10px; font-size: 10px; line-height: 1.4; text-align: center; border: 1px solid #fff; background-color: #f9f9f9; cursor:pointer; } .et-line-icons li:hover { background-color:#f3f3f3; } @media (min-width: 769px) { .et-line-icons li { width: 12.5%; font-size: 12px; } } /* material design demo */ /* material section color switch */ /* END material section color switch */ /* start.html demo */