/* Theme Name: Promos Theme URI: https://www.templatesell.com/item/promos-plus/ Author: templatesell Author URI: https://www.templatesell.com/ Description: Promos is a theme for blog. It is a free feminine WordPress theme with tons of settings and useful sections. This theme is the awesome and minimal theme. This theme has search option, off-canvas sidebar, multiple sidebar options, footer options, featured slider, promo boxed, footer widgets and many more. Besides that, this theme comes with added custom widgets for author information, featured posts, social icons, etc. It comes with primary color option to change the whole site color with a single click. https://templatesell.net/demo/promos/ Version: 1.0.7 License: GNU General Promos License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: promos Requires PHP: 5.2 Tested up to: 5.8 Tags: grid-layout, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, block-patterns, block-styles, custom-background, custom-logo, custom-menu, featured-images, featured-image-header, flexible-header, full-width-template, threaded-comments, translation-ready, footer-widgets, custom-colors, custom-header, editor-style, rtl-language-support, sticky-post, theme-options, wide-blocks, blog, news, photography This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. Promos is free WordPress theme by, Template Sell. Promos is distributed under the terms of the GNU GPL v2 or later. Normalizing styles have been helped along thanks to the fine work of Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/ */ /** * 1.0 - General styles (body, headings, links, tags, margins, etc.) * ------------------------------------------------------------- */ html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } /* body */ body { color: #000; font-family: 'Lato', sans-serif; font-size: 16px; line-height: 1.5; background: #fafafa; } /* links */ a { color: #4c4f53; -webkit-transition: color 0.2s ease, background-color 0.2s ease; -moz-transition: color 0.2s ease, background-color 0.2s ease; -o-transition: color 0.2s ease, background-color 0.2s ease; transition: color 0.2s ease, background-color 0.2s ease; } button:focus, a:focus { color: #4c4f53; outline: 1px dotted #000!important; } a:hover { color: #f50649; } /* H1 - H6 */ h1, h2, h3, h4, h5, h6 { font-family: 'Bellefair', serif; font-weight: normal; color: #000; clear: both; line-height: 1.3em; font-weight: 500; margin-top: 1rem; margin-bottom: 1rem; } h1 { font-size: 2.4em; } h2 { font-size: 2.2em; } h3 { font-size: 2em; } h4 { font-size: 1.8em; } h5 { font-size: 1.6em; } h6 { font-size: 1.4em; } /* tags */ button { -webkit-transition: color 0.2s ease, background 0.2s ease; -moz-transition: color 0.2s ease, background 0.2s ease; -o-transition: color 0.2s ease, background 0.2s ease; transition: color 0.2s ease, background 0.2s ease; } p { margin: 0 0 15px; } dl { margin: 0 0 15px; } dl dt { font-weight: 700; margin: 0 0 5px; line-height: 1.7; } dl dd { margin: 0 0 15px; padding: 0 0 0 15px; line-height: 1.7; } dl dd:last-child { margin-bottom: 0; } address { display: block; margin: 0 0 15px; font-style: italic; } sup, sub { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } abbr { text-decoration: none; border-bottom: 1px dotted #4c4f53; cursor: help; } acronym { text-decoration: none; border-bottom: 1px dashed #4c4f53; cursor: help; } big { text-transform: uppercase; font-size: larger; } cite { font-style: italic; border: none; } code, kbd, tt { padding: 4px 5px; font-family: Menlo, Monaco, Consolas, 'Courier New', monospace; font-size: 15px; color: #4c4f53; background-color: #f7f8f8; border-radius: 0; } kbd { box-shadow: none; } s, strike, del { text-decoration: line-through; } pre { display: inline-block; width: 100%; font-family: Menlo, Monaco, Consolas, 'Courier New', monospace; font-size: 15px; line-height: 1.35; overflow: auto; white-space: pre; margin: 5px 0 13px; padding: 21px 30px; background-color: #f7f8f8; color: #4c4f53; border: none; border-radius: 0; } var { font-style: italic; font-weight: 700; } strong, b { font-weight: 700; } em, q { font-style: italic; } ins { text-decoration: none; border-bottom: 2px solid #4c4f53; } legend { margin-bottom: 15px; padding-bottom: 5px; font-size: 22px; font-weight: 700; color: #2f3235; border-bottom: 1px solid #eeefef; } hr { margin-top: 25px; margin-bottom: 25px; border-color: #eeefef; } blockquote { position: relative; margin: 0 0 40px; padding: 0 0 0 60px; border: none; font-family: 'Playfair Display', serif; font-size: 18px; font-style: normal; line-height: 1.65; } blockquote:before { position: absolute; top: -4px; left: -4px; z-index: 0; font-family: 'Playfair Display', serif; content: '\201c'; font-size: 120px; font-style: normal; line-height: 0.79; color: #f50649; } blockquote footer:before, blockquote small:before, blockquote .small:before { content: ''; } blockquote p { margin-bottom: 20px!important; } blockquote p:last-child { margin-bottom: 0 !important; } blockquote cite { display: block; margin-top: 10px; font-size: 18px; line-height: 1.3; text-align: left; color: #4c4f53; } ul { list-style: disc; margin: 0; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; padding-left: 10px; } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; } figure { margin:0; } table { border-collapse: collapse; border-spacing: 0; margin: 0 0 30px; width: 100%; } td, th { border: 1px solid #e7e7e7; padding: 7px 0; text-align: center; } /* text-align */ .aligncenter { text-align: center; } .alignright { text-align: right; } .alignleft { text-align: left; } /* float */ .floatleft { float: left; } .floatright { float: right; } /* font-width; !important - it is used to change a current "font-width" value */ .fw-300 { font-weight: 300 !important; } .fw-400 { font-weight: 400 !important; } .fw-500 { font-weight: 500 !important; } .fw-600 { font-weight: 600 !important; } .fw-700 { font-weight: 700 !important; } /* padding (none; 0); !important - it is used to change a current "padding-*" value */ .pt-none { padding-top: 0 !important; } .pb-none { padding-bottom: 0 !important; } .pr-none { padding-right: 0 !important; } .pl-none { padding-left: 0 !important; } /* margin (none; 0); !important - it is used to change a current "margin-*" value */ .mt-none { margin-top: 0 !important; } .mb-none { margin-bottom: 0 !important; } .mr-none { margin-right: 0 !important; } .ml-none { margin-left: 0 !important; } /* word-break */ .break-word { word-wrap: break-word; } /* overflow */ .o-hidden { overflow: hidden; } /* screen reader text */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); width: 1px; height: 1px; overflow: hidden; position: absolute !important; word-wrap: normal !important; } /* override Bootstrap's default container */ @media (min-width: 1200px) { /* .container { width: 1030px; }*/ } /*-------------------------------------------------------------- # Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; clip-path: none; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } /** * 2.0 - Animation * ------------------------------------------------------------- */ /** * SlideUpIn animation * * Used for the drop-down search form and for the drop-down mobile menu */ .SlideUpIn { animation-name: SlideUpIn; -webkit-animation-name: SlideUpIn; animation-duration: 0.2s; -webkit-animation-duration: 0.2s; animation-timing-function: ease; -webkit-animation-timing-function: ease; visibility: visible !important; } @keyframes SlideUpIn { 0% { transform: translateY(10px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } @-webkit-keyframes SlideUpIn { 0% { -webkit-transform: translateY(10px); opacity: 0; } 100% { -webkit-transform: translateY(0); opacity: 1; } } /** * SlideDownOut animation * * Used for the drop-down search form and for the drop-down mobile menu */ .SlideDownOut { animation-name: SlideDownOut; -webkit-animation-name: SlideDownOut; animation-duration: 0.2s; -webkit-animation-duration: 0.2s; animation-timing-function: ease; -webkit-animation-timing-function: ease; visibility: visible !important; } @keyframes SlideDownOut { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(10px); opacity: 0; } } @-webkit-keyframes SlideDownOut { 0% { -webkit-transform: translateY(0); opacity: 1; } 100% { -webkit-transform: translateY(10px); opacity: 0; } } /** * SlideLeftIn animation * * Used for the main menu container */ .SlideLeftIn { animation-name: SlideLeftIn; -webkit-animation-name: SlideLeftIn; animation-duration: 0.2s; -webkit-animation-duration: 0.2s; animation-timing-function: ease; -webkit-animation-timing-function: ease; visibility: visible !important; } @keyframes SlideLeftIn { 0% { transform: translateX(10px); opacity: 0; } 100% { transform: translateX(0); opacity: 1; } } @-webkit-keyframes SlideLeftIn { 0% { -webkit-transform: translateX(10px); opacity: 0; } 100% { -webkit-transform: translateX(0); opacity: 1; } } /** * SlideRightOut animation * * Used for the main menu container */ .SlideRightOut { animation-name: SlideRightOut; -webkit-animation-name: SlideRightOut; animation-duration: 0.2s; -webkit-animation-duration: 0.2s; animation-timing-function: ease; -webkit-animation-timing-function: ease; visibility: visible !important; } @keyframes SlideRightOut { 0% { transform: translateX(0); opacity: 1; } 100% { transform: translateX(10px); opacity: 0; } } @-webkit-keyframes SlideRightOut { 0% { -webkit-transform: translateX(0); opacity: 1; } 100% { -webkit-transform: translateX(10px); opacity: 0; } } /*** ==================================================================== ## Top Header ==================================================================== ***/ /** ##Search (dropdown search form) * ------------------------------------------------------------- */ .search-wrapper{ position: relative; } .search-box-text { position: absolute; top: 100%; right: 0; z-index: 1002; width: 320px; height: auto; padding: 25px 30px; background-color: #ffffff; box-shadow: 0 14px 28px -4px rgba(14,17,20,0.35); display: none; } .search-box-text:after { content: ''; position: absolute; z-index: 1002; right: 20px; bottom: 100%; margin-bottom: -1px; border: 6px solid transparent; border-bottom: 6px solid #ffffff; } .widget .search-form, .search-wrapper .search-form{ position: relative; display: table; border-collapse: separate; width: 100%; } .widget .search-form label, .widget .search-form .search-submit, .search-wrapper .search-form label, .search-wrapper .search-form .search-submit{ display: table-cell; } .widget .search-field, .search-wrapper .search-field{ position: relative; z-index: 2; float: left; width: 100%; margin-bottom: 0; } .widget .search-field, .search-wrapper .search-field { font-size: 15px; font-style: normal; font-weight: 400; color: #4c4f53; background: #f7f8f8; border: 1px solid #f7f8f8; border-right: 0; height: 45px; padding: 10px 15px; border-radius: 0; box-shadow: none !important; } .search-field::-webkit-input-placeholder { color: #4c4f53; } .search-field:-moz-placeholder { color: #4c4f53; } .search-field:-ms-input-placeholder { color: #4c4f53; } .widget .search-form .search-submit, .search-wrapper .search-form .search-submit { white-space: nowrap; vertical-align: middle; height: 45px; float: right; border: 1px solid #f7f8f8; background: #efefef; padding: 0 15px; margin-left: -1px; color: #6f6f6f; width: 100%; } .second_click { display:none; position: relative; z-index: 999999999; } .hide-show .second_click { display: block !important; } .hide-show .first_click { display: none !important; } .search_box{ display: block!important; } .search-box i { padding: 15px 0; cursor: pointer; width: 40px; text-align: center; } /* #Social ----------------------------------------*/ .social-links ul { margin: 0; padding: 0; } .social-links ul li { display: inline; padding: 0 5px; } .social-links ul li a { font-size: 0; color: transparent; line-height: 40px; } .social-links ul li a:hover { color: #54be73 } .social-links li:last-child { margin-right: 0; } .social-links ul li a:before { content: ""; font-family: FontAwesome, sans-serif; font-size: 14px; padding: 10px 5px; transition: color 0.3s ease-in-out 0s; vertical-align: middle; line-height: 12px; color: #68686d; display: inline-block; border: 0; border-radius:0; } .social-links ul li:hover a:before{ opacity: .6; } .social-links ul li a[href*="facebook.com"]:before { content: "\f09a"; } .social-links ul li a[href*="twitter.com"]:before { content: "\f099"; } .social-links ul li a[href*="linkedin.com"]:before { content: "\f0e1"; } .social-links ul li a[href*="plus.google.com"]:before { content: "\f0d5"; } .social-links ul li a[href*="youtube.com"]:before { content: "\f167"; } .social-links ul li a[href*="dribbble.com"]:before { content: "\f17d"; } .social-links ul li a[href*="pinterest.com"]:before { content: "\f0d2"; } .social-links ul li a[href*="bitbucket.org"]:before { content: "\f171"; } .social-links ul li a[href*="github.com"]:before { content: "\f113"; } .social-links ul li a[href*="codepen.io"]:before { content: "\f1cb"; } .social-links ul li a[href*="flickr.com"]:before { content: "\f16e"; } .social-links ul li a[href$="/feed/"]:before { content: "\f09e"; } .social-links ul li a[href*="foursquare.com"]:before { content: "\f180"; } .social-links ul li a[href*="instagram.com"]:before { content: "\f16d"; } .social-links ul li a[href*="tumblr.com"]:before { content: "\f173"; } .social-links ul li a[href*="reddit.com"]:before { content: "\f1a1"; } .social-links ul li a[href*="vimeo.com"]:before { content: "\f194"; } .social-links ul li a[href*="digg.com"]:before { content: "\f1a6"; } .social-links ul li a[href*="twitch.tv"]:before { content: "\f1e8"; } .social-links ul li a[href*="stumbleupon.com"]:before { content: "\f1a4"; } .social-links ul li a[href*="delicious.com"]:before { content: "\f1a5"; } .social-links ul li a[href*="mailto:"]:before { content: "\f0e0"; } .social-links ul li a[href*="skype.com"]:before { content: "\f17e"; } .social-links ul li a[href*="dribble.com"]:before { content: "\f17d"; } .social-links ul li a[href*="vk.com"]:before { content: "\f189"; } .social-links ul li a[href*="telegram.com"]:before{ content: '\f2c6'; } /*** ==================================================================== ## Main Menu ==================================================================== ***/ .main-header, .main-header * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .main-header .container{ position: relative; } .main-header:before, .main-header:after, .main-header *:before, .main-header *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .main-header { position: relative; font-size: 16px; line-height: 1.42857143; background-color: #fff; z-index: 200; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; } .main-header ul { margin-bottom: inherit; width: 100%; margin: 0; } .main-header img { max-width: 100%; height: auto; vertical-align: top; } .main-header a:hover, .main-header a:focus, .main-header a:active { text-decoration: none; } .main-header a:focus, .main-header a:active { *outline: none; } .main-header-container { position: relative; } .main-header-overlay .main-header-container { position: inherit; } .main-header .logo { position: relative; padding: 15px 0; text-align: center; line-height: 56px; } .main-header .logo p, .main-header .logo h1{ margin: 0; padding: 0; line-height: normal; } .main-header .logo h1 a { font-size: 3rem; line-height: 1.3; } .main-header .logo img { max-width: 100%; height: auto; vertical-align: middle; } .berger{ display: block; width: 20px; margin: 0; float: left; position: relative; z-index: 2; border: none; margin: 0 5px; } .berger:before, .berger:after{ content: ''; display: block; background: #333; height: 2px; } .berger span{ background: #333; display: block; height: 2px; margin: 6px 0; } .main-menu > ul { display: none; padding: 0 0 20px; } .main-menu li, .main-menu ul li { position: relative; list-style: none; display: block; } .main-menu li a, .main-menu ul li > a { display: block; font-size: 15px; color: #212121; padding: 14px 15px; font-family: 'Poppins', sans-serif; text-decoration: none; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .main-menu ul li.current-menu-item > a, .main-menu ul li:hover > a { color: #f50649; background-color: #f6f6f6; } .main-menu ul ul li > a { font-size: 16px; font-style: normal; text-transform: inherit; padding: 14px 15px 14px 30px; font-family: 'Lato', sans-serif; text-transform: uppercase; letter-spacing: 1.5px; } .main-menu ul ul li:hover > a { background-color: #efefef; } .dropdown-plus { width: 49px; height: 49px; line-height: 49px; position: absolute; top: 0; right: 0; cursor: pointer; } .dropdown-plus > a{ position: absolute; width: 100%; left: 0; height: 100%; } .dropdown-plus:before, .dropdown-plus:after { position: absolute; content: ''; top: 24px; right: 18px; width: 13px; height: 1px; background-color: #111111; } .dropdown-plus:after { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .main-menu li > ul, .dropdown-plus.dropdown-open:after { display: none; } .main-menu li:focus-within > ul, .main-menu li:focus > ul, .main-menu li:hover > ul { visibility: visible; opacity: 1; } .main-menu li:focus-within > ul{ display: block; } .header-shadow-wrapper { position: absolute; top: 100%; left: 0; width: 100%; height: 30px; overflow: hidden; z-index: -1; } .header-shadow-wrapper:after { display: block; position: relative; content: ""; width: 100%; height: 60px; top: -60px; border-radius: 50%; -webkit-box-shadow: 0px 10px 30px -5px rgba(0,0,0,0.1); -moz-box-shadow: 0px 10px 30px -5px rgba(0,0,0,0.1); -o-box-shadow: 0px 10px 30px -5px rgba(0,0,0,0.1); box-shadow: 0px 10px 30px -5px rgba(0,0,0,0.1); } /* ============================================= ##Media queries for responsive design ================================================ */ @media (min-width: 768px) { .header-default .main-header .logo { float: left; } .main-menu { clear: both; } .header-shadow-wrapper:after { -webkit-box-shadow: 0px 10px 40px -5px rgba(0,0,0,0.1); -moz-box-shadow: 0px 10px 40px -5px rgba(0,0,0,0.1); -o-box-shadow: 0px 10px 40px -5px rgba(0,0,0,0.1); box-shadow: 0px 10px 40px -5px rgba(0,0,0,0.1); } .main-header-overlay .logo { left: 30px; } .main-header-overlay .bar-menu { right: 30px; } .main-menu-overlay > ul > li { padding: 0 110px 0 30px; margin-bottom: 16px; } } @media (min-width: 992px) { /* ============================================= Viewport Breakpoint ================================================ */ .main-header-container { height: 90px; } .main-header-overlay .main-header-container { height: auto; } .main-header .logo { position: relative; } /*.main-header .logo img { max-width: inherit; max-height: 90px; width: auto; }*/ .header-default .bar-menu { display: none; } .main-menu { float: right; clear: inherit; } .main-menu > ul { display: block !important; padding: 0; font-size: 0; } .main-menu li, .main-menu > ul > li { display: inline-block; } .main-menu ul li { position: relative; } .main-menu > ul > li > a { position: relative; font-size: 16px; text-transform: uppercase; font-style: normal; font-weight: 400; color: #000000; box-sizing: border-box; white-space: nowrap; padding: 15px 10px; letter-spacing: 1.5px; font-family: 'Lato', sans-serif; } .main-menu > ul > li:last-child > a { padding: 0 0 0 20px; } .main-menu ul li.current-menu-item > a, .main-menu ul li:hover > a { background-color: inherit; } .dropdown-plus { display: none; } .main-menu ul li.dropdown_menu > a > span:before { border-style: solid; border-width: 2px 2px 0 0; border-color: #c1c1c1; position: relative; content: ''; display: inline-block; height: 4px; width: 4px; top: -3px; margin-left: 8px; box-sizing: content-box; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); } .main-menu li > ul { display: block !important; width: 250px; top: 100%; left: 0; background-color: #fff; padding: 0; visibility: hidden; opacity: 0; z-index: 1; -webkit-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: center top; -moz-transform-origin: center top; -ms-transform-origin: center top; -o-transform-origin: center top; transform-origin: center top; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; background: #fff; -webkit-box-shadow: 0 0 15px rgb(0 0 0 / 10%); box-shadow: 0 0 15px rgb(0 0 0 / 10%); } .main-menu li:focus-within > ul, .main-menu li:focus > ul, .main-menu li:hover > ul { visibility: visible; opacity: 1; -webkit-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); } .main-menu li.submenu-right > ul { left: inherit; right: 0; } .main-menu li > ul ul { top: 0; left: 100%; } .main-menu li.submenu-right > ul ul { left: -100% !important; } .main-menu ul ul li.dropdown_menu > a > span:before { float: right; top: 7px; right: -10px; margin: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .main-menu ul ul li > a { position: relative; color: #818181; padding: 1em 1.5em; border-bottom: 1px solid #eee; } .main-menu ul ul li > a, .main-menu ul ul li:hover > a { color: #818181; background-color: transparent; text-align: left; } .main-menu ul li.dropdown_menu > a > span { display: none; } .main-menu.menu-caret ul li.dropdown_menu > a > span { display: inline-block; } .main-menu.menu-caret ul ul li.dropdown_menu > a > span { display: inline; } .main-menu.separate-line > ul > li > a { position: relative; } .main-menu.separate-line > ul > li > a:before { position: absolute; content: ""; top: 50%; right: 0; width: 1px; height: 20px; background: #eeeeee; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .main-menu.separate-line > ul > li:last-child > a:before { display: none; } .main-menu.separate-line > ul > li > a { padding: 0 28px; } .main-menu.separate-line > ul > li:last-child > a { padding: 0 0 0 28px; } /* ============================================= Header sticky ================================================ */ .main-header{ -webkit-transition: all 0.5s ease; -moz-transition: position 10s; -ms-transition: position 10s; -o-transition: position 10s; transition: all 0.5s ease; } .main-header.sticky { top: 0; position: fixed; width: 100%; z-index: 100; animation: smoothScroll 1s forwards; } @keyframes smoothScroll { 0% { transform: translateY(-40px); } 100% { transform: translateY(0px); } } /* ============================================= Submenu ================================================ */ .main-menu.submenu-top-border li > ul { border-top: 3px solid #f50649; } .main-menu.submenu-top-border li > ul ul { top: -30px; } .main-menu.submenu-list-border li > ul ul { top: -20px; } .main-menu.submenu-top-border.submenu-list-border li > ul ul { top: -23px; } .main-menu.submenu-list-border ul ul li > a { padding: 15px 35px 14px !important; } .main-menu.submenu-list-border ul ul li:first-child > a { padding: 8px 35px 14px 35px !important; } .main-menu.submenu-list-border ul ul li:last-child > a { padding: 15px 35px 8px 35px !important; } .main-menu.submenu-list-border ul ul li:after { position: absolute; content: ""; bottom: 0; left: 35px; right: 35px; height: 1px; background: #eeeeee; } .main-menu.submenu-list-border ul ul li:last-child:after { display: none; } .main-menu.submenu-list-border ul ul li:hover > a { padding-left: 55px !important; } .main-menu.submenu-list-border ul ul li:nth-child(n+2) > a:before { top: 24px; } .header-dark .main-menu.submenu-list-border ul ul li:after { background: #333333; } /* ============================================= Submenu transitions ================================================ */ .main-menu.submenu-flip li > ul { -webkit-transition: all 0.35s ease-in-out; -moz-transition: all 0.35s ease-in-out; -o-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; -webkit-transform: rotateX(-90deg); -moz-transform: rotateX(-90deg); -o-transform: rotateX(-90deg); transform: rotateX(-90deg); -webkit-transform-origin: 0% 0%; -moz-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; } .main-menu.submenu-flip li:hover > ul { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); -o-transform: rotateX(0deg); transform: rotateX(0deg); } .main-menu.submenu-flip ul { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-perspective: 200px; -ms-perspective: 200px; perspective: 200px; } .main-menu.submenu-flip ul li { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-perspective: 200px; -ms-perspective: 200px; perspective: 200px; } .main-menu.submenu-scale li > ul { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: 0 0; transform-origin: 0 0; } .main-menu.submenu-scale li.submenu-right ul { -webkit-transform-origin: 100% 0; transform-origin: 100% 0; } .main-menu.submenu-scale li:hover > ul { -webkit-transform: scale(1); transform: scale(1); } } @media (max-width: 991px) { .main-menu > ul > li > a { line-height: normal!important; } .header-1 .header-image .main-menu ul{ background:transparent; } .main-menu > ul { text-align: left; } } .mobile-menu { display: block; width: 22px; padding: 21px 0; margin: 0; float: left; position: relative; z-index: 2; background: none; border: none; } .mobile-menu:before, .mobile-menu:after { content: ''; display: block; background: #333; height: 2px; width: 18px; } .mobile-menu span { background: #333; display: block; height: 2px; margin: 6px 0; } div#MobileMenu { background: #fff; } div#MobileMenu { display: inline-block; padding: 0 15px; line-height: 50px; font-size: 15px; font-weight: 700; letter-spacing: .02em; color: #111111; margin: 0; position: relative; -webkit-transition: 350ms; -moz-transition: 350ms; -o-transition: 350ms; transition: 350ms; font-family: 'Roboto', sans-serif; } /*============================================================== ## Header Type CSS ================================================================*/ /*## Header Images*/ .header-image { padding: 30px 0 0 0; position: relative; } .header-image .container { position: relative; z-index: 2; } .header-image:before { position: absolute; content: ""; background: rgba(0, 0, 0, 0.2); left: 0; top: 0; width: 100%; height: 100%; z-index: 1; } .header-image.sticky { padding: 5px 0; /*background: #fff!important;*/ } .header-image.sticky:after{ background: rgba(0, 0, 0, 0.8); } .header-1 .header-image .head_one { background: transparent; position: relative; } .header-image .menu-area { position: relative; z-index: 5; background: #fff; } .header-1 .header-image #site-navigation{ } .header-image .bar-menu a{ color: #fff; } .main-header.header-image .logo p, .main-header.header-image .logo h1 a{ color: #fff; } .main-header.header-image .logo h1 a { font-size: 3rem; line-height: 1.3; } .header-image .mobile-menu:before, .header-image .mobile-menu:after, .header-image .mobile-menu span{ background: #fff; } @media (min-width: 992px) { .main-menu ul li.dropdown_menu > a > span:before{ border-color: #848484; } .header-image .main-menu ul li.dropdown_menu > a > span:before{ border-color: #fff; } .header-image .main-menu ul ul li.dropdown_menu > a > span:before{ border-color: #848484; } } @media (max-width: 991px) { .header-1 .header-image .main-menu ul{ background:transparent; } } /*==================================================== ## Header One =======================================================*/ .header-1 #site-navigation { position: relative; border-bottom: 2px solid #333; border-top: 2px solid #333; display: flex; align-items: center; flex-wrap: wrap-reverse; justify-content: space-around; } .header-1 .bar-menu{ display: none; } .header-1 .head_one{ background: #fff; } .header-1 .head_one .logo{ /*margin: auto;*/ max-width: 500px; text-align: center; padding: 0 0 140px 0; margin: 20px 0 0 0; float: none; } .header-1 .sticky .head_one{ display: none; } .header-1 .main-menu{ max-width: 100%; text-align: left; } @media (min-width: 1200px){ .header-1 .main-menu { text-align: left; } .header-1 .main-menu > ul > li:first-child > a{ padding-left: 0; } } @media (max-width: 991px){ .header-1 .main-header .container { position: inherit; } .header-1 .search-wrapper { right: auto; position: relative; } .header-1 .bar-menu { padding: 12px 0; display: block; cursor: pointer; background: none; border: none; } .header-1 .header-image .head_one{ border: 0; } .header-1 .header-image .head_one .logo{ padding: 5px; } .header-1 .header-image .main-menu > ul { width: 100%; background: #fff; top: 100%; text-align: left; left: 0; margin: 0; z-index: 50; position: absolute; } .header-image .main-menu > ul > li > a { color: #212121; } .header-1 .bar-menu.menu-open { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .header-image { padding: 30px 0 0 0; } } @media (max-width: 991px){ .header-1 #site-navigation.toggled{ display: inline-block; min-width: 100%; } .header-1 #site-navigation{ display: inherit; } .header-1 #site-navigation .right-block { position: absolute; top: 0; right: 0; } .header-1 #site-navigation.toggled{ border-bottom: 0; } .header-1 #site-navigation.toggled .main-menu{ min-width: 100%; border-top: 2px solid #333; } } /*============================================================== ## Main Banner CSS ================================================================*/ section.slider-wrapper { position: relative; padding:50px 0; } /** ## slider Two **/ .slide-post{ width: 100%; background: #ffffff; } .slide-image { border-radius: 10px; -webkit-transition: all .5s; transition: all .5s; } .slide-info{ color: #999; vertical-align: middle; text-align: center; padding: 40px; } .slide-info h2 a{ font-size: 40px; line-height: normal; } .slide-info .entry-meta ul{ padding: 0; margin: 0; } .slide-info .entry-meta ul li{ padding: 5px 0; list-style: none; display: inline-block; } .slide-info .entry-meta ul li a, .slide-info .entry-meta ul li span{ font-size: 12px; text-decoration: none; text-transform: uppercase; letter-spacing: 0.15em; font-weight: 400; } .post-date span::after, .entry-meta ul li>span::after { content: "-"; display: inline-block; margin: 0 5px 0 10px; } .post-date span:last-of-type::after, .entry-meta ul li:last-of-type span::after { display: none; } .entry-meta ul li .min-read{ color: #4c4f53; } @media (min-width: 992px){ .td-md-table { display: table; } .td-table-cell { display: table-cell !important; } .slide-image{ width: 60%; } } .modern-slider .slide-wrap .caption span i{ margin-right: 5px; } .modern-slider .slick-prev, .modern-slider .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; background:#333; width: 40px; height: 40px; padding: 0; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%); cursor: pointer; border: none; outline: none; z-index: 9; text-align: center; } .modern-slider .slick-prev, .modern-slider .slick-next { top: 40px; } .modern-slider .slick-prev:before, .modern-slider .slick-next:before { font-size: 16px; font-family: 'FontAwesome'; font-size: 20px; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #fff; text-align: center; display: block; } .modern-slider .slick-next:before { content: '\f054'; } .modern-slider .slick-prev:before { content: '\f053'; } .modern-slider .slick-next { right: 25px; } .modern-slider .slick-prev { left: auto; right: 70px; } .modern-slider .slick-dots { position: absolute; left: 0; bottom: 30px; right: auto; width: 40%; text-align: center; margin: 0; padding: 0; } .modern-slider .slick-dots li { display: inline-block; line-height: 0; } .modern-slider .slick-dots li.slick-active button{ background: #f50649; } .modern-slider .slick-dots li button { text-indent: -99999px; border: 0; margin: 0 5px; padding: 0; height: 10px; width: 10px; border-radius: 50%; background: #959698; } @media (max-width: 991px){ .modern-slider .slide-wrap{ display: block; } .modern-slider .slide-wrap .caption { bottom: 30px; } .modern-slider .slide-wrap .caption h2 a{ font-size: 25px; } .modern-slider .slick-dots{ width: 100%; } } @media (max-width: 767px){ .modern-slider .slider-height { height: auto; } } @media (max-width: 640px){ .modern-slider .slide-wrap .caption { bottom: auto; left: auto; display: block; position: relative; } .modern-slider .slide-wrap .inner-wrapper{ background: #fff; display: block; padding: 15px; } .modern-slider .slide-wrap .caption h2{ max-width: none; } .modern-slider .slide-wrap .caption h2, .modern-slider .slide-wrap .inner-wrapper .btn-wrapper{ display: block; margin:0 0 10px 0; } .modern-slider .slide-wrap .caption h2 a{ border:0; } .modern-slider .slick-prev, .modern-slider .slick-next{ top: auto; bottom: 7px; } } /** ================================================ ## Archive page heading ==================================================== **/ .archive-heading{ width: 100%; padding: 0 15px; } .archive-title { margin: 0 0 15px; font-size: 29px; font-style: normal; font-weight: normal; line-height: 1.2; color: #2f3235; text-align: center; } .archive-description { margin: 15px 0 -3px; font-size: 16px; font-style: normal; font-weight: 400; line-height: 1.6; color: #4c4f53; } .archive-description p { margin-bottom: 10px; } .archive-description p:last-child { margin-bottom: 0; } /*** ==================================================================== ## Author Page ==================================================================== ***/ .fb-author-heading-social-links { margin-top: 8px; text-align: left; } .fb-author-heading-social-links > span { margin-right: 8px; font-size: 16px; font-style: normal; font-weight: 400; color: #4c4f53; } .fb-author-heading-social-links ul { margin: 0 -10px 0 0; display: inline-block; } .fb-author-heading-social-links ul li { display: inline-block; margin: 10px 10px 0 0; } .fb-author-heading-social-links ul li a { display: inline-block; width: 36px; height: 36px; line-height: 36px; text-align: center; font-family: sans-serif; font-size: 13px; font-weight: 400; color: #4c4f53; background-color: #ffffff; border-radius: 50%; } .fb-author-heading-social-links ul li a:active i { position: relative; top: 1px; } .fb-ah-twitter-link:hover, .fb-ah-twitter-link:focus { color: #43b1ff !important; } .fb-ah-facebook-f-link:hover, .fb-ah-facebook-f-link:focus { color: #6e8dd0 !important; } .fb-ah-pinterest-p-link:hover, .fb-ah-pinterest-p-link:focus { color: #ff3158 !important; } .fb-ah-vk-link:hover, .fb-ah-vk-link:focus { color: #6089b9 !important; } .fb-ah-telegram-plane-link:hover, .fb-ah-telegram-plane-link:focus { color: #4bb5e9 !important; } .fb-ah-flickr-link:hover, .fb-ah-flickr-link:focus { color: #3a7cf5 !important; } .fb-ah-instagram-link:hover, .fb-ah-instagram-link:focus { color: #f24b73 !important; } .fb-ah-500px-link:hover, .fb-ah-500px-link:focus { color: #3aadf6 !important; } .fb-ah-youtube-link:hover, .fb-ah-youtube-link:focus { color: #ff3449 !important; } .fb-ah-vimeo-v-link:hover, .fb-ah-vimeo-v-link:focus { color: #3bbff6 !important; } .fb-ah-soundcloud-link:hover, .fb-ah-soundcloud-link:focus { color: #fe823c !important; } .fb-ah-dribbble-link:hover, .fb-ah-dribbble-link:focus { color: #f65498 !important; } .fb-ah-behance-link:hover, .fb-ah-behance-link:focus { color: #537fff !important; } .fb-ah-github-link:hover, .fb-ah-github-link:focus { color: #010101; } .author .archive-heading { max-width: 70%; padding: 15px 0 30px 15px; } /*** ==================================================================== ##No results" message (content none) ==================================================================== **/ .search-no-results .page-content{ position: relative; margin-bottom: 40px; background-color: #ffffff; padding: 30px 15px; word-wrap: break-word; overflow: hidden; } .search-no-results h3 { margin: -7px 0 15px 0; font-size: 26px; font-style: normal; font-weight: 600; line-height: 1.2; color: #2f3235; } .search-no-results p { margin: 15px 0; font-size: 16px; font-style: normal; font-weight: 400; line-height: 1.6; color: #4c4f53; } /*** ==================================================================== ## Blog posts ==================================================================== ***/ .posts-container { padding-top: 10px; padding-bottom: 20px; overflow: hidden; } .home .posts-container{ padding-top: 30px; } .post-wrap { position: relative; margin-bottom: 0; padding: 0 20px; background-color: #ffffff; } /*** ==================================================================== ## Post Format ==================================================================== ***/ .date_title .post-date{ line-height: 30px; } span.post-format { float: left; width: 40px; position: relative; height: 30px; } .blog .format-status .post-excerpt p, .archive .format-status .post-excerpt p { font-size: 20px; font-style: italic; } @media (max-width: 767px){ .date_title .post-date { line-height: inherit; } } /*** ==================================================================== ## Post media: image ==================================================================== ***/ .post-media { position: relative; overflow: hidden; -webkit-transition: all .5s; transition: all .5s; } .post-media:hover { -webkit-transform: scale(.97); transform: scale(.97); box-shadow: 0 0 0 4px #f4f6f8; box-shadow: 0 0 0 4px rgb(255 255 255 / 10%); } /*** ==================================================================== ## Post media: slider (gallery) ==================================================================== ***/ .blog-gallery .slick-arrow { position: absolute; top: 50%; left: 30px; transform: translateY(-50%); background: none; padding: 0; font-size: 24px; height: 50px; width: 40px; border: 1px solid #c7c8ca; color: #c7c8ca; text-align: center; line-height: 50px; transition: all .3s; cursor: pointer; z-index: 99; } .blog-gallery .slick-arrow:hover{ border: 1px solid #c7c8ca; color: #c7c8ca; } .blog-gallery .slick-arrow.slick-next { right: 30px; left: auto; } .blog-gallery .slick-dots { position: absolute; text-align: center; left: 0; right: 0; bottom: 30px; padding-left: 0; } .blog-gallery .slick-dots li { display: inline-block; line-height: 0; } .blog-gallery .slick-dots li.slick-active button{ background: #fff; } .blog-gallery .slick-dots li button { text-indent: -99999px; border: 0; margin: 0 5px; padding: 0; height: 10px; width: 10px; border-radius: 50%; background: #959698; } /*** ==================================================================== ## Post media: video ==================================================================== ***/ /* tags */ video { height: auto; max-width: 100%; width: 100%; } embed, iframe, object { max-width: 100%; } embed, iframe, object { width: 100%; } /* video post format: iframe */ .iframe-video-wrap { overflow: hidden; height: 0; padding-bottom: 56.25%; position: relative; z-index: 10; } .iframe-video-wrap iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: none !important; } /** * 9.4 - Post media: audio * ------------------------------------------------------------- */ .iframe-audio-wrap iframe { display: block; min-height: 160px; width: 100%; } /** * 9.5 - Post content * ------------------------------------------------------------- */ .post-content { position: relative; padding: 20px 15px; word-wrap: break-word; overflow: hidden; } .post-content { padding-bottom: 0; } .single .post-content{ padding: 20px 0; } .single .post .content p a, .single .post .content h1 a, .single .post .content h2 a, .single .post .content h3 a, .single .post .content h4 a, .single .post .content h5 a, .single .post .content h6 a, .single .post .content ul li a, .single .post .content ol li a{ text-decoration: underline; } /* date */ .post-date { margin: 15px 0; font-size: 12px; text-transform: capitalize; color: #989ea6; letter-spacing: 1.5px; text-transform: uppercase; text-align: right; } .post-date a { color: #989ea6; } .post-date a:focus, .post-date a:hover { color: #f50649; text-decoration: underline !important; } .post-date.no-title { margin-bottom: 15px; } .updated:not(.published) { display: none; } /* title */ .post-title { margin: 10px 0 15px 0; font-size: 1.6em; font-weight: bold; line-height: 1.5; color: #000000; } .post-title a { color: #000000; } .post-title a:hover, .post-title a:focus { color: #4c4f53; text-decoration: underline !important; } .post-title-page { margin: 10px 0 15px 0; font-size: 1.6em; font-weight: bold; line-height: 1.5; color: #000000; text-align: center; } .post-title-page a { color: #000000; } .post-title-page a:hover, .post-title-page a:focus { color: #4c4f53; text-decoration: underline !important; } /* post excerpt and post content */ .post-excerpt, .content { color: #434343; font-weight: 400; font-size: 1em; /* margin: 0 auto 1.5em;a;*/ } .post-excerpt p a, .content p a{ text-decoration: underline !important; } .post-excerpt a:hover, .post-excerpt a:focus, .content a:hover, .content a:focus { color: #f50649; text-decoration: underline !important; } .content p { margin-bottom: 15px; } .drop-cap p:first-child:first-letter { float: left; font-size: 75px; line-height: 75px; padding-top: 0px; padding-right: 6px; padding-left: 3px; } .page-posts .content p:last-child { margin-bottom: 0; } .single .post-excerpt p, .single .post-excerpt ul, .single .post-excerpt ol{ margin-bottom: 40px; list-style-position: inside; } .single .post-excerpt ul li ul{ margin-bottom: 20px; } .single .post-excerpt ul li{ margin-bottom: 10px; } .single .post-excerpt h1, .single .post-excerpt h2, .single .post-excerpt h3, .single .post-excerpt h4, .single .post-excerpt h5, .single .post-excerpt h6{ margin-bottom: 25px; } .single .post-excerpt strong, .single .post-excerpt b{ font-weight: normal; } /* more link */ .more-link { font-style: normal; font-size: 13px; display: inline-block; background-color: #000; color: #fff; padding: 5px 20px; letter-spacing: 0.06em; transition: all .6s; } a.more-link:hover{ color: #fff !important; opacity: 0.8; } .content .more-link { display: inline-block; margin-bottom: 5px; } .content .more-link:after { content: '...'; display: inline-block; margin-left: 4px; } .content .more-link { margin-bottom: 0; } .content .more-link:after { display: none; } .content .more-link:before { content: '...'; display: inline-block; margin-right: 4px; } .content .more-link:hover:before, .content .more-link:focus:before { color: #4c4f53; } a.clean { background: #f7f8f8; padding: 10px 15px; margin: 15px 0 10px 0; border-radius: 3px; font-size: 12px; } a.effect { background:#f7f8f8; padding: 10px 15px; margin: 15px 0 10px 0; border-radius: 3px; display: inline-block; font-size: 12px; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } a.effect:before { width: 0%; height: 100%; top: 0; left: 0; background:#337ab7; border-radius: 3px; content: ''; position: absolute; z-index: -1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } a.effect:hover:before, a.effect:active:before { width: 100%; } a.effect:hover, a.effect:active { color: #fff!important; z-index: 1; } /* meta */ .post-cats{ display: block; font-size: 14px; color: #989ea6; } .post-cats > span{ padding-left: 10px; padding-right: 10px; vertical-align: middle; line-height: 1; } .post-cats > span:first-child { padding-left: 0; } .post-cats > span a{ font-size: 12px; line-height: 20px; text-transform: uppercase; color: #989ea6; letter-spacing: 1.5px; } .tags-links a, .tags-links i, .post-cats > span i{ color: #f50649; font-size: 12px; line-height: 20px; text-transform: uppercase; font-weight: 600; } .tags-links a:hover, .tags-links a:focus, .post-cats > span a:hover, .post-cats > span a:focus{ color: #f50649; text-decoration: underline !important; } .post-cats > span.tags-links{ display: none; border-left: 1px solid #d9d9d9; } .post-cats > span.tags-links i{ display: none; } .cat-links a:after{ content: ""; display: inline-block; border: 1px solid; font-size: 12px; width: 4px; height: 4px; margin: 0 10px; transform: rotate(45deg); } .cat-links a:last-child:after{ display:none; } .meta_bottom { min-width: 100%; position: absolute; bottom: 50px; padding: 5px 10px; visibility: hidden; opacity: 0; -webkit-transition: all 0.15s ease 0.4s; -moz-transition: all 0.15s ease 0.4s; -o-transition: all 0.15s ease 0.4s; transition: all 0.15s ease 0.4s; text-align: center; } .meta_bottom .post-share a { display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background: #fff; color: #000; margin: 0 4px 10px 4px; font-size: 0; } .meta_bottom .post-share a i{ font-size: 14px; line-height: 40px; } .single .meta_bottom .post-share a { position: relative; display: inline-block; width: auto; height: 34px; line-height: 34px; padding: 0 18px 0 50px; font-size: 11px; letter-spacing: 0.1em; font-weight: bold; text-transform: uppercase; border-radius: 2px; background: #fff; color: #222; border: 1px solid #ddd; -webkit-transition: background-color 0.3s, color 0.3s, border 0.3s; transition: background-color 0.3s, color 0.3s, border 0.3s; } .single .meta_bottom .post-share a i{ position: absolute; top: 0; left: 0; text-align: center; width: 32px; height: 32px; line-height: 32px; border-right: 1px solid #ddd; -webkit-transition: border 0.3s; transition: border 0.3s; } .single .meta_bottom .post-share .tooltip:after, .single .meta_bottom .post-share .tooltip:before{ position: absolute; text-align: center; text-transform: initial; font-weight: normal; left: 50%; opacity: 0; visibility: hidden; -webkit-transition: opacity 0.3s, visibility 0.3s, top 0.3s; transition: opacity 0.3s, visibility 0.3s, top 0.3s; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .single .meta_bottom .post-share .tooltip:before{ content: attr(data-tooltip); top: -40px; background: #000; color: #fff; min-width: 100px; height: 30px; line-height: 30px; font-size: 14px; letter-spacing: 0; padding: 0; border-radius: 4px; } .single .meta_bottom .post-share .tooltip:after{ content: ""; width: 0; height: 0; top: -10px; border-top: 6px solid #000; border-right: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid transparent; } .single .meta_bottom .post-share .tooltip:hover::before { top: -48px; opacity: 1; visibility: visible; } .single .meta_bottom .post-share .tooltip:hover::after { top: -18px; opacity: 1; visibility: visible; } .meta_bottom .post-share a:hover { background: #f28b71; color: #fff; } .post-media-wrapper{ position: relative; } .post-media-wrapper:hover .meta_bottom{ visibility: visible; opacity: 1; margin-bottom: 0; -webkit-transition: all 0.15s ease 0s; -moz-transition: all 0.15s ease 0s; -o-transition: all 0.15s ease 0s; transition: all 0.15s ease 0s; } .single .meta_bottom { position: relative; opacity: 1; bottom: auto; visibility: visible; padding: 0; margin: 20px 0; text-align: left; font-size: } /** ## Paginations (WordPress CSS classes) * ------------------------------------------------------------- */ .pagination { overflow: hidden; display: inline-block; margin: 0 0 50px; padding: 0; border-radius: 0; position: relative; text-align: center; width: 100%; } .pagination .page-numbers { font-size: 15px; font-style: normal; font-weight: 600; color: #4c4f53; min-width: 50px; line-height: 50px; text-align: center; background: #ddd; margin: 0 4px; display: inline-block; padding: 0 15px; border-radius: 30px; } .pagination a.page-numbers:focus { color: #4c4f53; } .pagination .page-numbers.current { background: #333; color: #fff; } .pagination a.page-numbers:hover { color: #f50649; text-decoration: underline !important; } .pagination .prev, .pagination .next{ padding: 0 25px; } .posts-navigation { margin: 5px 0 0; padding: 15px 0 0; border-top: 1px solid #eeefef; } .posts-navigation:before, .posts-navigation:after { content: " "; display: table; } .posts-navigation:after { clear: both; } .posts-navigation { zoom: 1; display: inline-block; width: 100%; } .posts-navigation .nav-previous, .posts-navigation .nav-next { display: inline-block; min-height: 1px; width: 50%; position: relative; } .posts-navigation .nav-previous { float: left; text-align: left; padding-right: 15px; } .posts-navigation .nav-next { float: right; text-align: right; padding-left: 15px; } .posts-navigation .nav-previous a:before { position: absolute; content: "Previous post"; font-size: 12px; font-weight: 600; text-transform: uppercase; color: #989ea6; display: block; padding-left: 10px; top: 0; } .posts-navigation .nav-previous a:after { position: absolute; content: "\f0d9"; font-family: "FontAwesome"; color: #989ea6; left: 0; top: -3px; } .posts-navigation .nav-next a:before { position: absolute; content: "Next post"; font-size: 12px; font-weight: 600; text-transform: uppercase; color: #989ea6; display: block; padding-right: 10px; top: 0; right: 0; } .posts-navigation .nav-next a:after { position: absolute; content: "\f0da"; font-family: "FontAwesome"; color: #989ea6; right: 0; top: -3px; } .posts-navigation .nav-links a { display: inline-block; width: 100%; padding: 20px 0 10px 0; font-size: 15px; font-style: normal; font-weight: 400; line-height: 1.7; color: #4c4f53; /* .post-title-nav color */ word-wrap: break-word; } .posts-navigation .nav-links a:hover, .posts-navigation .nav-links a:focus { color: #f50649; /* .post-title-nav color */ } /** ## Single post page * ------------------------------------------------------------- */ .archive.woocommerce .posts-container, .archive .posts-container, .page .posts-container, .single .posts-container{ padding-top: 30px; } /* post navigation (WordPress CSS classes) */ .post-navigation { margin: 5px 0 0; padding: 15px 0 0; } .post-navigation:before, .post-navigation:after { content: " "; display: table; } .post-navigation:after { clear: both; } .post-navigation { zoom: 1; } .post-navigation .nav-previous, .post-navigation .nav-next { display: inline-block; min-height: 1px; width: 50%; position: relative; } .post-navigation .nav-previous { float: left; text-align: left; padding-right: 15px; } .post-navigation .nav-next { float: right; text-align: right; padding-left: 15px; } .post-navigation .nav-previous a:before { position: absolute; content: "Previous post"; font-size: 12px; font-weight: 600; text-transform: uppercase; color: #989ea6; display: block; padding-left: 10px; top: 0; } .post-navigation .nav-previous a:after { position: absolute; content: "\f0d9"; font-family: "FontAwesome"; color: #989ea6; left: 0; top: -3px; } .post-navigation .nav-next a:before { position: absolute; content: "Next post"; font-size: 12px; font-weight: 600; text-transform: uppercase; color: #989ea6; display: block; padding-right: 10px; top: 0; right: 0; } .post-navigation .nav-next a:after { position: absolute; content: "\f0da"; font-family: "FontAwesome"; color: #989ea6; right: 0; top: -3px; } .post-navigation .nav-links a { display: inline-block; width: 100%; padding: 20px 0 10px 0; font-size: 15px; font-style: normal; font-weight: 400; line-height: 1.7; color: #4c4f53; /* .post-title-nav color */ word-wrap: break-word; } .post-navigation .nav-links a:hover, .post-navigation .nav-links a:focus { color: #f50649; /* .post-title-nav color */ } /** ## WordPress content styles * ------------------------------------------------------------- */ /* alignment */ .alignleft { float: left; margin: 5px 30px 15px 0; } .alignright { float: right; margin: 5px 0 15px 30px; } .aligncenter { clear: both; display: block; margin: 0 auto 20px; padding: 5px 0 0; } .alignnone { margin: 0 0 20px; padding: 5px 0 0; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } /* image with caption */ .wp-caption { max-width: 100%; margin-top: 0; margin-bottom: 15px; padding: 5px 0 0; } .wp-caption img { border: 0; margin: 0; padding: 0; max-width: 100%; height: auto; } .wp-caption .wp-caption-text { margin: 0; padding: 10px 0 0; font-size: 13px; text-align: left; line-height: 1.6; } /* responsive images */ .comment-content img { display: block; max-width: 100%; height: auto; } img[class*="align"], img[class*="wp-image-"], img[class*="attachment-"] { height: auto; } img.size-full, img.size-large, img.header-image, img.wp-post-image { max-width: 100%; height: auto; } /* gallery with images */ .gallery { margin: 0 -5px 5px !important; padding-top: 5px; } .gallery .gallery-item { display: inline-block; overflow: hidden; vertical-align: top; margin: 0 0 15px 0; padding: 0 5px; } .gallery .gallery-item .gallery-caption { margin: 0; padding: 10px 10px 0 0; font-size: 13px; line-height: 1.6; text-align: left; } .gallery.gallery-columns-7 .gallery-item .gallery-caption, .gallery.gallery-columns-8 .gallery-item .gallery-caption, .gallery.gallery-columns-9 .gallery-item .gallery-caption { display: none; } .gallery .gallery-icon a { display: block; } .gallery .gallery-icon img { display: block; max-width: 100%; height: auto; border: none !important; margin: 0; padding: 0; } .gallery.gallery-columns-1 .gallery-item { width: 100%; } .gallery.gallery-columns-2 .gallery-item { width: 50%; } .gallery.gallery-columns-3 .gallery-item { width: 33.3333336%; } .gallery.gallery-columns-4 .gallery-item { width: 25%; } .gallery.gallery-columns-5 .gallery-item { width: 20%; } .gallery.gallery-columns-6 .gallery-item { width: 16.6666667%; } .gallery.gallery-columns-7 .gallery-item { width: 14.2857143%; } .gallery.gallery-columns-8 .gallery-item { width: 12.5%; } .gallery.gallery-columns-9 .gallery-item { width: 11.1111111%; } /* twitter tweet */ .twitter-tweet { margin-top: 5px !important; margin-bottom: 20px !important; } /* checkbox and radio buttons */ input[type="checkbox"], input[type="radio"] { display: inline-block; margin: 0 5px 0 0; padding: 0; width: 16px; min-width: 16px; height: 16px; line-height: 0; position: relative; top: -2px; border: 2px solid #e3e5e6; background: #ffffff; clear: none; cursor: pointer; outline: none !important; text-align: center; vertical-align: middle; -webkit-appearance: none; -webkit-transition: border-color 0.2s ease; -moz-transition: border-color 0.2s ease; -o-transition: border-color 0.2s ease; transition: border-color 0.2s ease; } input[type="checkbox"] { border-radius: 0; border-top-width: 1px; } input[type="radio"] { border-radius: 50%; border-top-width: 2px; } input[type="checkbox"]:hover, input[type="checkbox"]:focus, input[type="radio"]:hover { border-color: #f50649; } input[type="checkbox"]:checked, input[type="radio"]:checked { background: #f50649; border-color: #f50649; } input[type="checkbox"]:checked:before { content: "\2714"; line-height: 13px; color: #ffffff; } input[type="radio"]:checked:before { content: "\2022"; font-size: 22px; line-height: 12px; color: #ffffff; } /** ## About the author * ------------------------------------------------------------- */ .about-author { position: relative; margin-bottom: 40px; padding: 30px; border: 1px solid #eeefef; } .container-title { margin-bottom: 25px; font-size: 26px; font-style: normal; line-height: 1.2; color: #2f3235; } /* avatar */ .about-author-avatar { float: left; margin: 0 20px 0 0; position: relative; overflow: hidden; } .about-author-avatar img { display: block; margin: 0; padding: 0; width: 72px; height: 72px !important; border-radius: 36px; } .about-author-avatar .avatar-bg-overlay { border-radius: 36px; } .about-author-avatar:hover .avatar-bg-overlay { opacity: 0.2; } /* biographical info */ .about-author-bio-wrap { padding-left: 92px; } .about-top { display: inline-block; width: 100%; vertical-align: middle; } .about-author-name { margin-bottom: 0; font-size: 16px; line-height: 1.3; color: #2f3235; float: left; } .about-author-name a { display: inline-block; color: #2f3235; } .about-author-name a:hover, .about-author-name a:focus { color: #f50649; text-decoration: underline !important; } .about-author-name .about-author-posts-num { display: block; margin-top: 5px; font-size: 12px; color: #989ea6; } .about-author-name .about-author-posts-num i { margin-right: 8px; } .about-author-bio { margin-top: 12px; font-size: 15px; font-style: normal; font-weight: 400; line-height: 1.7; color: #4c4f53; } .about-author-posts-link { display: inline-block; margin-top: 12px; font-size: 12px; font-style: normal; font-weight: 600; line-height: 1.3; color: #989ea6; } .about-author-posts-link i { margin-right: 8px; } .about-author-posts-link:hover, .about-author-posts-link:focus { color: #f50649; text-decoration: underline !important; } .author-socials { float: right; } .author-socials a{ padding:5px 10px; } .author .archive-heading { max-width: 70%; padding: 15px 0 30px 15px; } /** * ## Comments * ------------------------------------------------------------- * Comment form * ------------------------------------------------------------- */ /* comments area: comment form, comment list, and navigation */ .comments-area { font-size: 15px; font-style: normal; font-weight: 400; line-height: 1.7; color: #4c4f53; } /* comments area: styles for Font Awesome icons */ .comment-reply-title #cancel-comment-reply-link:before, .bypostauthor > article .fn:after { display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; } /* comment form title, comments title */ .comment-reply-title, .comments-title { margin: 25px 0; font-size: 26px; line-height: 1.2; color: #2f3235; } /* comment form */ .comment-form { margin-bottom: 0; padding: 20px; background-color: #ffffff; } .comment-form-comment { margin-bottom: 7px; } .comment-form-author, .comment-form-email, .comment-form-url { margin-bottom: 10px; } .comment-form label { display: block; margin-bottom: 0; padding-bottom: 5px; font-weight: 600; line-height: 1.7; color: #4c4f53; } .comment-form-comment label:after { content: ' *'; } .comment-form-cookies-consent { margin-bottom: 10px; padding-top: 12px; } .comment-form-cookies-consent input[type="checkbox"] { margin: 0 10px 0 0; } .comment-form-cookies-consent label { display: inline; padding-bottom: 0; font-weight: 400; } #author, #email, #url, #comment { width: 100%; height: 40px; padding: 0 10px; color: #4c4f53; background: #ffffff; border: 2px solid #eeefef; border-top-width: 1px; border-radius: 0; -webkit-transition: border-color 0.2s ease; -moz-transition: border-color 0.2s ease; -o-transition: border-color 0.2s ease; transition: border-color 0.2s ease; } #comment { height: 110px; padding: 10px; resize: vertical; } #author:hover, #email:hover, #url:hover, #comment:hover { border-color: #f50649; } #author:active, #email:active, #url:active, #comment:active, #author:focus, #email:focus, #url:focus, #comment:focus { outline: none; border-color: #f50649; } /* allowed tags */ .comment-form .form-allowed-tags { display: none; } /* comment form: submit button */ .comment-form .form-submit { padding: 15px 0 7px; margin-bottom: 0; } .comment-form #submit { border: none; outline: none; display: inline-block; padding: 0 35px; height: 48px; line-height: 48px; font-size: 15px; font-style: normal; font-weight: 600; color: #ffffff; background-color: #1f2123; border-radius: 0; cursor: pointer; -webkit-transition: background-color 0.2s ease; -moz-transition: background-color 0.2s ease; -o-transition: background-color 0.2s ease; transition: background-color 0.2s ease; } .comment-form #submit:hover, .comment-form #submit:focus { color: #ffffff; } .comment-form #submit:hover, .comment-form #submit:focus { background-color: #f50649; opacity: 0.8; } .comment-form #submit:active { position: relative; top: 1px; } /* "must login" message */ .comment-respond .must-log-in { margin-bottom: 40px; padding: 30px; background-color: #ffffff; } .comment-respond .must-log-in a { color: #4c4f53; text-decoration: underline !important; } .comment-respond .must-log-in a:hover, .comment-respond .must-log-in a:focus { color: #f50649; } /* "logged-in as ..." message */ .comment-form .logged-in-as a { color: #4c4f53; } .comment-form .logged-in-as a:first-child:hover, .comment-form .logged-in-as a:first-child:focus { color: #4c4f53; text-decoration: underline !important; } .comment-form .logged-in-as a:last-child { text-decoration: underline !important; } .comment-form .logged-in-as a:last-child:hover, .comment-form .logged-in-as a:last-child:focus { color: #f50649; } /* cancel comment reply link */ .comment-reply-title small { float: right; margin-top: 10px; } .comment-reply-title #cancel-comment-reply-link { font-size: 12px; font-style: normal; color: #989ea6; font-family: 'Lato', sans-serif; text-transform: uppercase; letter-spacing: 1px; } .comment-reply-title #cancel-comment-reply-link:before { font-family: 'FontAwesome'; font-weight: 900; content: '\f057'; margin-right: 8px; } .comment-reply-title #cancel-comment-reply-link:hover { color: #f50649; } /** * Comment list * ------------------------------------------------------------- */ /* comments */ .comment-list-wrap { margin-bottom: 0; padding: 30px 30px 15px; background-color: #ffffff; } .comment-list { list-style: none outside none; margin: 0; padding: 0 0 15px; } .comment-list .children { list-style: none outside none; margin: 0; padding: 0 0 0 30px; } /* comment body */ .comment .comment-body { margin-top: 25px; padding-top: 25px; border-top: 1px solid #eeefef; word-wrap: break-word; } .comment-list > .comment:first-child > .comment-body { margin-top: 0; padding-top: 0; border-top: none; } /* pingbacks and trackbacks */ .comment-list .pingback .comment-body { margin-top: 25px; padding-top: 25px; padding-left: 36px; border-top: 1px solid #eeefef; word-wrap: break-word; position: relative; font-size: 12px; font-style: normal; font-weight: 600; line-height: 1.3; color: #989ea6; } .comment-list .pingback .comment-body:before { display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-family: 'FontAwesome'; font-weight: 900; content: '\f35d'; position: absolute; top: auto; left: 0; margin-top: -2px; line-height: 1; font-size: 19px; color: #4c4f53; opacity: 0.2; } .comment-list > .pingback:first-child > .comment-body { margin-top: 0; padding-top: 0; border-top: none; } .comment-list .pingback .comment-body > a { display: block; margin-top: 12px; font-family: 'Lora', serif; font-size: 15px; font-weight: 400; line-height: 1.7; color: #4c4f53; } .comment-list .pingback .comment-body > a:hover, .comment-list .pingback .comment-body > a:focus { color: #f50649; text-decoration: underline !important; } .comment-list .pingback .comment-body .edit-link { display: inline-block; margin-top: 12px; font-size: 12px; font-style: normal; font-weight: 600; line-height: 1.3; } .comment-list .pingback .comment-body .edit-link .comment-edit-link { color: #989ea6; text-decoration: none !important; } .comment-list .pingback .comment-body .edit-link .comment-edit-link:hover, .comment-list .pingback .comment-body .edit-link .comment-edit-link:focus { color: #f50649; text-decoration: underline !important; } /* comment metadata: avatar */ .comment-meta .comment-author img { float: left; display: block; width: 46px; height: 46px !important; margin: 0 15px 0 0; padding: 0; border-radius: 23px; } /* comment metadata: author */ .comment-meta .comment-author .fn { font-size: 16px; font-style: normal; font-weight: 600; line-height: 1.3; color: #2f3235; } .comment-meta .comment-author .fn .url { color: #2f3235; text-decoration: underline !important; } .comment-meta .comment-author .fn .url:hover, .comment-meta .comment-author .fn .url:focus { color: #f50649; } .comment-meta .comment-author .says { clip: rect(1px, 1px, 1px, 1px); width: 1px; height: 1px; overflow: hidden; position: absolute !important; word-wrap: normal !important; } /* comment metadata: post author */ .bypostauthor > article .fn:after { font-family: 'FontAwesome'; font-weight: 900; content: '\f040'; margin-left: 8px; font-size: 75%; } /* comment metadata: date and edit links */ .comment-meta .comment-metadata { margin-top: 2px; font-size: 12px; font-style: normal; font-weight: 600; line-height: 1.3; color: #989ea6; } .comment-meta .comment-metadata a { color: #989ea6; } .comment-meta .comment-metadata a:hover, .comment-meta .comment-metadata a:focus { color: #f50649; text-decoration: underline !important; } /* comment metadata: edit link */ .comment-meta .edit-link { margin-left: 10px; } /* comment metadata: "comment awaiting moderation" message */ .comment-meta .comment-awaiting-moderation { display: block; margin: 15px 0 0 61px; padding: 4px 0; background-color: #f7f8f8; } /* comment content */ .comment-content { padding: 12px 0 0 61px; } .no-avatars .comment-content { padding-left: 0 !important; } .comment-content p { margin-bottom: 15px; } .comment-content a { color: #4c4f53; text-decoration: underline !important; } .comment-content a:hover, .comment-content a:focus { color: #f50649; } /* comment reply */ .comment-body .reply { padding: 0 0 0 61px; margin-top: -6px; line-height: 1.3; } .no-avatars .comment-body .reply { padding-left: 0 !important; } .comment-body .reply .comment-reply-link { font-size: 12px; font-style: normal; font-weight: 600; color: #989ea6; } .comment-body .reply .comment-reply-link:focus { color: #989ea6; } .comment-body .reply .comment-reply-link:hover { color: #f50649; text-decoration: underline !important; } /* comment reply: comment form */ .comment-list li .comment-respond { margin-top: 25px; padding-top: 25px; border-top: 1px solid #eeefef; } .comment-list li .comment-reply-title { margin-bottom: 16px; } .comment-list li .comment-form { margin-bottom: 0; padding: 0; box-shadow: none; } .comment-list li .comment-form .form-submit { padding-bottom: 5px; } /* comments are closed */ .comment-list-wrap.comments-closed .comment-list { padding-bottom: 0; } .comments-area .no-comments { margin-bottom: 40px; padding: 30px; background-color: #ffffff; } /** * Comments navigation * ------------------------------------------------------------- */ .comment-navigation { margin: 10px 0 0; padding: 20px 0 15px; border-top: 1px solid #eeefef; } .comment-list-wrap.comments-closed .comment-navigation { margin-top: 25px; } .comment-navigation:before, .comment-navigation:after { content: " "; display: table; } .comment-navigation:after { clear: both; } .comment-navigation { zoom: 1; } .comment-navigation .nav-previous, .comment-navigation .nav-next { display: inline-block; min-height: 1px; width: 50%; line-height: 1.6; } .comment-navigation .nav-previous { float: left; text-align: left; padding-right: 15px; } .comment-navigation .nav-next { float: right; text-align: right; padding-left: 15px; } .comment-navigation .nav-links a { display: inline-block; width: 100%; font-size: 12px; font-weight: 600; text-transform: uppercase; word-wrap: break-word; color: #989ea6; } .comment-navigation .nav-links a:hover, .comment-navigation .nav-links a:focus { color: #f50649; text-decoration: underline !important; } .comment-navigation .nav-previous i { margin-right: 10px; } .comment-navigation .nav-next i { margin-left: 10px; } /** * Related posts / Posts list on single pages * ------------------------------------------------------------- */ .post-wrap .related-posts { padding-top: 20px; border-top: 1px solid #eeeeee; margin-top: 10px; } .related-posts h2{ font-size: 26px; } .post-wrap .related-post-widget-title { padding: 0; margin-bottom: 20px; font-size: 15px; font-style: normal; font-weight: 700; line-height: 1.3; text-transform: uppercase; color: #2f3235; background-color: #ffffff; } .post-wrap .related-posts .post-title { font-size: 18px; } .post-wrap .related-posts .post-content{ padding: 15px 10px; } .post-wrap.left-image .related-posts{ display: none; } /*Slick arrow*/ .related-posts-list .slick-arrow { position: absolute; height: 25px; width: 25px; text-align: center; line-height: 22px; border-radius: 0; color: #000; top: -38px; right: 50px; z-index: 2; cursor: pointer; border: 0; background: #ffffff; border: 1px solid #eee; outline: none; } .related-posts-list .slick-arrow:hover{ background: #333; color: #fff; } .related-posts-list .slick-arrow.slick-next { right: 16px; left: auto; } .related-posts-list .slick-dots { position: absolute; text-align: center; left: 0; right: 0; bottom: 30px; padding-left: 0; } .related-posts-list .slick-dots li { display: inline-block; line-height: 0; } .related-posts-list .slick-dots li.slick-active button{ background: #fff; } .related-posts-list .slick-dots li button { text-indent: -99999px; border: 0; margin: 0 5px; padding: 0; height: 10px; width: 10px; border-radius: 50%; background: #959698; } .related-posts { overflow: hidden; margin-bottom: 30px; } .related-posts-list{ margin-left: -15px; margin-right: -15px; } .related-posts .show-2-related-posts { float: left; width: 50%; padding: 0 15px; margin-bottom: 15px; } .related-posts .show-3-related-posts .post { width: 33.33%; float: left; } @media (max-width: 767px){ .related-posts .show-2-related-posts{ width: 100%; } } /** * Page 404 * ------------------------------------------------------------- */ .error404 .posts-container{ padding-top: 0; } .page-404-container { margin: 60px 0; padding: 30px; text-align: center; background-color: #ffffff; } .page-404-content { max-width: 500px; width: 100%; margin: 0 auto; } .page-404-content h1, .page-404-content h2 { margin-bottom: 15px; font-style: normal; color: #2f3235; } .page-404-content h1 { font-size: 29px; line-height: 1.2; } .page-404-content .error-code { font-size: 110px; line-height: 110px; font-weight: 800; margin-bottom: 5px; color: #555555; } .page-404-content h2 { font-size: 23px; line-height: 1.3; } .page-404-content p { margin-bottom: 5px; font-size: 15px; font-style: normal; font-weight: 400; line-height: 1.7; color: #4c4f53; } .page-404-content a { color: #4c4f53; text-decoration: underline !important; } .page-404-content a:hover, .page-404-content a:focus { color: #f50649; } .search-no-results .search-form label, .page-404-content .search-form label { display: block; max-width: 100%; margin-bottom: 0; font-weight: 700; } .search-no-results .search-form input[type="search"], .page-404-content .search-form input[type="search"] { float: left; width: 75%; height: 45px; background: none; padding: 5px 15px; border-width: 1px; box-shadow: none; border: 1px solid #333; border-right: 0; } .search-no-results .search-field::-webkit-input-placeholder, .page-404-content .search-field::-webkit-input-placeholder { color: #999; } .search-no-results .search-field:-moz-placeholder, .page-404-content .search-field:-moz-placeholder { color: #999; } .search-no-results.search-field:-ms-input-placeholder, .page-404-content .search-field:-ms-input-placeholder { color: #999; } .search-no-results .search-form input[type="submit"], .page-404-content .search-form input[type="submit"] { float: left; width: 25%; padding: 0; height: 45px; border: 1px solid #333; position: relative; background: #212121; color: #fff; display: inline-block; font-size: 11px; letter-spacing: 2px; padding: 10px 20px !important; text-transform: uppercase; transition: all 0.3s ease 0s; } .back_home { padding: 20px; display: inline-block; } /** * Sidebar and Widgets * ------------------------------------------------------------- */ .blog.left-sidebar #primary, .archive.left-sidebar #primary, .page.left-sidebar #primary{ -ms-flex-order: 3; order: 3; } .blog.no-sidebar #secondary, .archive.no-sidebar #secondary, .page.no-sidebar #secondary, .blog.middle-column #secondary, .archive.middle-column #secondary, .page.middle-column #secondary{ display:none } .single.single-no-sidebar #secondary, .single.single-middle-column #secondary{ display:none } .single.single-left-sidebar #secondary, .single.single-right-sidebar #secondary{ display:block!important; } .single.single-left-sidebar #primary, .single.single-right-sidebar #primary{ max-width: 75%; } .single.single-left-sidebar #primary{ -ms-flex-order: 3; order: 3; } .blog.no-sidebar #primary, .archive.no-sidebar #primary, .page.no-sidebar #primary, .single.single-no-sidebar #primary, .post-template-post-no-sidebar.single #primary{ max-width: 100%; flex: 0 0 100%; } .blog.middle-column #primary, .archive.middle-column #primary, .page.middle-column #primary, .single.single-middle-column #primary, .post-template-post-middle-column.single #primary{ max-width: 100%; flex: 0 0 100%; } @media (min-width: 768px){ .blog.middle-column .posts-container .container, .archive.middle-column .posts-container .container, .page.middle-column .posts-container .container, .single.single-middle-column .posts-container .container{ max-width: 70%; flex: 0 0 70%; margin :auto; } } /* Blog Layout Column options */ .two-column article.two-column{ width: 50%; padding:0 15px; float: left; } .alternative article.alternative { width: 50%; padding:0 15px; float: left; } .alternative .site-main article:nth-child(3n-2) { width: 100%; } .home.both-sidebar #primary, .archive.both-sidebar #primary, .page.both-sidebar #primary, .single.both-sidebar #primary{ width: 33.33333333%; padding:0 15px; } /* widget container */ .widget { overflow: hidden; word-wrap: break-word; /* margin-bottom: 40px; */ font-size: 15px; font-style: normal; font-weight: 400; line-height: 1.7; color: #4c4f53; background: #fff; padding: 10px; } .widget a { color: #4c4f53; } .widget a:hover, .widget a:focus { color: #f50649; text-decoration: underline !important; } /* widget title */ .widget_block h2, .widget .wp-block-group h2, .widget .title, .widget .widgettitle, .widget .widget-title { border-bottom: 2px solid #f3f2f1; margin-top: auto; color: #333; font-family: 'Lato', sans-serif; font-weight: 700; letter-spacing: 1px; font-size: 14px; text-transform: uppercase; padding: 0 0 15px; margin-bottom: 15px; } .widget .widget-title a { color: #2f3235; } .widget .widget-title a:hover, .widget .widget-title a:focus { color: #f50649; text-decoration: underline !important; } /** * Widget: Archives * ------------------------------------------------------------- */ .widget_archive ul { list-style: none; margin: 0; padding: 0; } .widget_archive ul li { color: #989ea6; /* counter */ margin-bottom: 10px; } .widget_archive ul li:last-child { margin-bottom: 0; } .widget_archive ul li a { margin-right: 4px; } .widget_archive select { margin-top: 5px; padding: 8px 20px 8px 10px; max-width: 100%; width: 100%; color: #4c4f53; background: #ffffff; border: 1px solid #ffffff; } .widget_archive select:active, .widget_archive select:focus { outline: none; } /** * Widget: Pages * ------------------------------------------------------------- */ .widget_pages ul { list-style: none; margin: 0; padding: 0; } .widget_pages ul li { color: #989ea6; margin-bottom: 10px; } .widget_pages ul li:last-child { margin-bottom: 0; } .widget_pages ul ul { margin: 10px 0 0; padding: 0 0 1px 10px; } .widget_pages ul ul li:before { content: '- '; color: #4c4f53; } /** * Widget: Categories * ------------------------------------------------------------- */ .wp-block-categories-list, .widget_categories ul { list-style: none; margin: 0; padding: 0; } .wp-block-categories-list li, .widget_categories ul li { color: #989ea6; margin-bottom: 10px; display: block; text-align: left; width: 100%; } .wp-block-categories-list li:last-child, .widget_categories ul li:last-child { margin-bottom: 0; } .wp-block-categories-list li a, .widget_categories ul li a { margin-right: 4px; display: inline-block; text-align: left; } .widget_categories ul ul { margin: 10px 0 0; padding: 0 0 1px 10px; } .widget_categories ul ul li:before { content: '- '; color: #4c4f53; } .widget_categories select { margin-top: 5px; padding: 8px 20px 8px 10px; max-width: 100%; width: 100%; color: #4c4f53; background: #ffffff; border: 1px solid #ffffff; } .widget_categories select:active, .widget_categories select:focus { outline: none; } /** * Widget: Recent Posts * ------------------------------------------------------------- */ .wp-block-latest-posts, .widget_recent_entries ul { list-style: none; margin: 0; padding: 0; } .wp-block-latest-posts li, .widget_recent_entries ul li { margin-bottom: 10px; } .wp-block-latest-posts li:last-child, .widget_recent_entries ul li:last-child { margin-bottom: 0; } .widget_recent_entries ul li .post-date { display: block; font-size: 80%; color: #989ea6; } /** * Widget: Tag Cloud * ------------------------------------------------------------- */ .widget_tag_cloud .tagcloud { overflow: hidden; margin-right: -4px; line-height: normal !important; } .wp-block-tag-cloud { line-height: normal !important; } .wp-block-tag-cloud a, .widget_tag_cloud a { font-size: 10px!important; letter-spacing: 1px; text-transform: uppercase; background: #737373; color: #fff; padding: 6px 8px 7px; margin-right: 5px; margin-bottom: 8px; display: inline-block; border-radius: 2px; -o-transition: .3s; -ms-transition: .3s; -moz-transition: .3s; -webkit-transition: .3s; } /** * Widget: Calendar * ------------------------------------------------------------- */ #wp-calendar { max-width: 100%; width: 100%; line-height: 1.2; } /* caption */ #wp-calendar caption { padding: 0 0 15px; font-weight: 700; line-height: 1.7; color: #4c4f53; } /* thead */ #wp-calendar thead th { padding: 10px 0 10px; font-weight: 700; } /* tbody */ #wp-calendar tbody td { padding: 5px 0 5px 2px; } #wp-calendar tbody a { text-decoration: underline !important; } #wp-calendar tbody #today { font-weight: 700; } /* prev/next links */ #wp-calendar #next { text-align: right; } #wp-calendar #prev, #wp-calendar #next { padding: 10px 0 10px; font-weight: 700; } /** * Widget: Navigation Menu * ------------------------------------------------------------- */ .widget_nav_menu ul { list-style: none; margin: 0; padding: 0; } .widget_nav_menu ul li { margin-bottom: 10px; } .widget_nav_menu ul li:last-child { margin-bottom: 0; } .widget_nav_menu ul li i { margin-right: 8px; } .widget_nav_menu ul ul { margin: 10px 0 0; padding: 0 0 1px 10px; } .widget_nav_menu ul ul li:before { content: '- '; color: #4c4f53; } /** * Widget: Meta * ------------------------------------------------------------- */ .widget_meta ul { list-style: none; margin: 0; padding: 0; } .widget_meta ul li { margin-bottom: 10px; } .widget_meta ul li:last-child { margin-bottom: 0; } /** * Widget: Recent Comments * ------------------------------------------------------------- */ #recentcomments { list-style: none; margin: 0; padding: 0; } #recentcomments li { margin-bottom: 10px; } #recentcomments li:last-child { margin-bottom: 0; } #recentcomments li .comment-author-link a, #recentcomments li a { text-decoration: underline !important; } /** * Widgets: Text and Custom HTML * ------------------------------------------------------------- */ /* img */ .textwidget img { max-width: 100%; margin-bottom: 15px; } .textwidget .wp-caption img { margin-bottom: 0; } /* text elements */ .textwidget p { margin-bottom: 15px; } .textwidget a { text-decoration: underline !important; } .textwidget .wp-caption-text { padding: 0; } .textwidget ul, .textwidget ol { margin: 0 0 15px; padding-left: 18px; } .textwidget ul ol, .textwidget ul ul, .textwidget ol ul, .textwidget ol ol { margin: 2px 0; padding-left: 18px; } /* forms: buttons */ .textwidget button, .textwidget button[disabled]:hover, .textwidget button[disabled]:focus, .textwidget input[type="button"], .textwidget input[type="button"][disabled]:hover, .textwidget input[type="button"][disabled]:focus, .textwidget input[type="reset"], .textwidget input[type="reset"][disabled]:hover, .textwidget input[type="reset"][disabled]:focus, .textwidget input[type="submit"], .textwidget input[type="submit"][disabled]:hover, .textwidget input[type="submit"][disabled]:focus { border: none; outline: none; display: inline-block; padding: 0 30px; height: 42px; line-height: 42px; font-size: 14px; font-style: normal; font-weight: 700; color: #ffffff; background: #1f2123; border-radius: 0; -webkit-transition: background-color 0.2s ease; -moz-transition: background-color 0.2s ease; -o-transition: background-color 0.2s ease; transition: background-color 0.2s ease; } .textwidget button:focus, .textwidget input[type="button"]:focus, .textwidget input[type="reset"]:focus, .textwidget input[type="submit"]:focus { color: #ffffff; } .textwidget button:hover, .textwidget input[type="button"]:hover, .textwidget input[type="reset"]:hover, .textwidget input[type="submit"]:hover { color: #ffffff; background: #f50649; } .textwidget button:active, .textwidget input[type="button"]:active, .textwidget input[type="reset"]:active, .textwidget input[type="submit"]:active { position: relative; top: 1px; } /* forms: input tags, select element */ .textwidget input[type="text"], .textwidget input[type="email"], .textwidget input[type="url"], .textwidget input[type="password"], .textwidget input[type="search"], .textwidget input[type="tel"], .textwidget input[type="number"], .textwidget input[type="date"], .textwidget textarea, .textwidget select { max-width: 100%; width: 100%; height: 38px; padding: 0 10px; font-weight: 400; color: #4c4f53; background: #ffffff; border: 1px solid #ffffff; border-bottom-color: #e3e5e6; border-radius: 0; -webkit-transition: border-bottom-color 0.2s ease; -moz-transition: border-bottom-color 0.2s ease; -o-transition: border-bottom-color 0.2s ease; transition: border-bottom-color 0.2s ease; } .textwidget input[type="date"] { padding-top: 7px; padding-bottom: 7px; } .textwidget textarea { height: 90px; margin-bottom: -7px; padding: 10px; line-height: 1.7; resize: vertical; } .textwidget select { padding-left: 6px; } .textwidget select[multiple] { height: 90px; margin-bottom: -2px; padding: 5px 8px; } .textwidget input[type="text"]:hover, .textwidget input[type="email"]:hover, .textwidget input[type="url"]:hover, .textwidget input[type="password"]:hover, .textwidget input[type="search"]:hover, .textwidget input[type="tel"]:hover, .textwidget input[type="number"]:hover, .textwidget input[type="date"]:hover, .textwidget textarea:hover, .textwidget select:hover { border-bottom-color: #f50649; } .textwidget input[type="text"]:focus, .textwidget input[type="email"]:focus, .textwidget input[type="url"]:focus, .textwidget input[type="password"]:focus, .textwidget input[type="search"]:focus, .textwidget input[type="tel"]:focus, .textwidget input[type="number"]:focus, .textwidget input[type="date"]:focus, .textwidget textarea:focus, .textwidget select:active, .textwidget select:focus { outline: none; border-bottom-color: #f50649; } .textwidget input[type="file"] { width: 100%; margin: 0; padding: 9px; border: 1px dashed #e3e5e6; -webkit-transition: border-color 0.2s ease; -moz-transition: border-color 0.2s ease; -o-transition: border-color 0.2s ease; transition: border-color 0.2s ease; } .textwidget input[type="file"]:hover { border-color: #f50649; } .textwidget input[type="file"]:focus { outline: none; border-color: #f50649; } .textwidget input[type="checkbox"], .textwidget input[type="radio"] { border-width: 1px; } .textwidget input[type="checkbox"]:checked:before, .textwidget input[type="radio"]:checked:before { line-height: 14px; } /* label */ .textwidget label { display: inline-block; width: 100%; max-width: 100%; margin-bottom: 0; padding-bottom: 5px; font-size: 14px; font-weight: 700; line-height: 1.7; } .textwidget p label:last-child { padding-bottom: 0; } /* Contact Form 7: additional styles */ /* p */ .textwidget .wpcf7 p { margin-bottom: 10px; } /* label */ .textwidget .wpcf7 span[class*="quiz"] label { padding-bottom: 0; } /* input, textarea */ .textwidget .wpcf7 label input, .textwidget .wpcf7 label textarea { margin-top: 5px; font-size: 15px; font-weight: 400; } /* submit */ .textwidget .wpcf7 input[type="submit"] { margin: 10px 0 5px; font-weight: 700; } /* checkboxes, radio buttons */ .textwidget .wpcf7 .wpcf7-list-item { margin: 0 20px 0 0; } .textwidget .wpcf7 .wpcf7-list-item:last-child { margin-right: 0; } .textwidget .wpcf7 .wpcf7-list-item label { font-size: 15px; font-weight: 400; } .textwidget .wpcf7 .wpcf7-list-item input[type="checkbox"]:first-child, .textwidget .wpcf7 .wpcf7-list-item input[type="radio"]:first-child { margin-right: 5px; } .textwidget .wpcf7 .wpcf7-list-item input[type="checkbox"]:last-child, .textwidget .wpcf7 .wpcf7-list-item input[type="radio"]:last-child { margin-right: 0; margin-left: 5px; } .textwidget .wpcf7 .wpcf7-list-item label input[type="checkbox"], .textwidget .wpcf7 .wpcf7-list-item label input[type="radio"] { margin-top: 0; } /* action styles */ .textwidget .wpcf7 .ajax-loader { margin-left: 15px; } .textwidget .wpcf7 .wpcf7-not-valid-tip { margin-top: 6px; font-size: 12px; font-weight: 700; color: #f46180; } .textwidget .wpcf7 .wpcf7-response-output { margin: 15px 0; padding: 10px 15px; text-align: left; font-size: 13px; font-weight: 700; line-height: 1.6; border: none; background-color: #e9a62a; color: #ffffff; } .textwidget .wpcf7 .wpcf7-mail-sent-ok, .textwidget .wpcf7 .wpcf7-mail-sent-ng, .textwidget .wpcf7 .wpcf7-aborted, .textwidget .wpcf7 .wpcf7-spam-blocked, .textwidget .wpcf7 .wpcf7-validation-errors, .textwidget .wpcf7 .wpcf7-acceptance-missing { border: none; } .textwidget .wpcf7 .wpcf7-mail-sent-ok { background-color: #7cbd60; } .textwidget .wpcf7 .wpcf7-mail-sent-ng, .textwidget .wpcf7 .wpcf7-aborted { background-color: #f46180; } .textwidget .wpcf7 .wpcf7-spam-blocked { background-color: #e9a62a; } .textwidget .wpcf7 .wpcf7-validation-errors, .textwidget .wpcf7 .wpcf7-acceptance-missing { background-color: #f46180; } /** * Widget: Search * ------------------------------------------------------------- */ /* search form */ .widget_search #searchform .search-field { font-family: 'Lora', serif; font-size: 15px; font-style: normal; font-weight: 400; color: #4c4f53; background: transparent; border-bottom: 2px solid #e3e5e6; } /* search form: placeholder */ /* Chrome/Opera/Safari */ .widget_search #searchform .search-field::-webkit-input-placeholder { color: #4c4f53; opacity: 1; } /* Firefox 18- */ .widget_search #searchform .search-field:-moz-placeholder { color: #4c4f53; opacity: 1; } /* Firefox 19+ */ .widget_search #searchform .search-field::-moz-placeholder { color: #4c4f53; opacity: 1; } /* IE 10+ */ .widget_search #searchform .search-field:-ms-input-placeholder { color: #4c4f53; opacity: 1; } /* search form: submit button */ .widget_search #searchform .search-submit { color: #4c4f53; background: transparent; border-bottom: 2px solid #e3e5e6; } .widget_search #searchform .search-submit:hover { color: #f50649; } /** * Widget: RSS * ------------------------------------------------------------- */ .rsswidget img { display: none; } .widget_rss .widget-title .rsswidget:first-child:before { display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-family: 'FontAwesome'; font-weight: 900; content: '\f09e'; margin-right: 8px; font-size: 80%; } .widget_rss ul { list-style: none; margin: 0; padding: 0; } .widget_rss ul li { margin-bottom: 10px; } .widget_rss ul li:last-child { margin-bottom: 0; } .widget_rss ul li .rss-date { display: block; font-size: 80%; color: #989ea6; } .widget_rss ul li .rssSummary { margin-bottom: 2px; font-size: 90%; } .widget_rss ul li cite { display: block; margin: 0; text-align: left; font-style: normal; font-size: 80%; color: #989ea6; } /** * Widget: Image * ------------------------------------------------------------- */ .widget_media_image .wp-caption { margin-bottom: 0; } /** * Widget: Gallery * ------------------------------------------------------------- */ .widget_media_gallery .gallery { margin-bottom: 0 !important; } /** * Footer * ------------------------------------------------------------- */ .footer-wrap { background-color: #3a3a3a; padding: 0; } .foot-wrap { display: table; table-layout: fixed; } .footer-wrap .footer-top-box { padding-top: 50px; padding-bottom: 20px; } .footer-wrap .widget{ margin-bottom: 5px; padding:0; } .footer-wrap .widget-title, .footer-wrap .widget{ background: transparent; } .footer-wrap .widget a, .footer-wrap .widget{ color: #fff; } .footer-wrap .wp-block-group h2, .footer-wrap .widgettitle, .footer-wrap .title, .footer-wrap .widget-title{ color: #fff; padding: 15px 0; text-align: left; background: none; position: relative; border-bottom: 1px solid #464646; } .footer-wrap .widget_featured_post_num{ display: none; } .footer-wrap .widget_featured_content { height: 80px; } .footer-wrap .post-date{ margin:0; } .footer-wrap [class*="footer-col-"]:nth-child(2), .footer-wrap [class*="footer-col-"]:nth-child(3){ padding-left: 40px; } .footer-col-1, .footer-col-2, .footer-col-3, .footer-col-4{ position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; display: table-cell; overflow: hidden; } .footer-col-1{ width: 100%; } .footer-col-2{ width: 50%; } .footer-col-3{ width: 33.333%; } .footer-col-4{ width: 25%; } @media (max-width: 991px) { .footer-wrap [class*="footer-col-"]{ width: 100%; margin-bottom: 20px; display: block; border: 0; } .footer-wrap [class*="footer-col-"]:nth-child(2), .footer-wrap [class*="footer-col-"]:nth-child(3){ padding-left: 15px; } } /* footer text */ .site-footer{ font-size: 15px; padding: 10px 0; line-height: 1.7; color: #fff; border-top: 1px solid #464646; } .site-footer a { color: #fff; } .site-footer a:hover, .site-footer a:focus { text-decoration: underline !important; } .copyright { font-size: 14px; line-height: 1.3; padding: 30px 0; text-align: center; letter-spacing: .7px; text-transform: uppercase; opacity: .8; } /* footer social links */ .footer-social-links { float: right; width: 60%; text-align: right; margin: -5px -8px -5px 0; padding-left: 15px; } .footer-social-links a { display: inline-block; padding: 10px 8px; font-family: sans-serif; font-size: 14px; color: #fff; } .footer-social-links a:hover, .footer-social-links a:focus { color: #f50649; } /* footer menu */ .footer-menu { float: right; margin:0; padding:0; } .footer-menu li { float: left; list-style: none; } .footer-menu li a { display: inline-block; padding: 0 10px; font-size: 15px; font-style: normal; font-weight: 400; line-height: 3; color: rgb(51, 51, 51); } .footer-menu li a:hover, .footer-menu li a:focus { color: #f50649; text-decoration: underline !important; } .footer-menu li ul { display: none; } /** * "Back to top" button * ------------------------------------------------------------- */ #toTop { position: fixed; right: 30px; bottom: 20px; z-index: 1041; display: inline-block; width: 44px; height: 44px; line-height: 44px; text-align: center; font-family: sans-serif; font-size: 16px; color: #ffffff; background-color: #f50649; border-radius: 50%; box-shadow: 0 14px 28px -4px rgba(14,17,20,0.15); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } #toTop:focus { color: #4c4f53; } #toTop:hover { color: #ffffff; opacity: 0.7; } #toTop:active i { position: relative; top: 1px; } /*** ==================================================================== ## Breadcrumbs ==================================================================== ***/ .breadcrumbs-wrap { display: block; width: 100%; font-style: normal; color: #858585; padding:0 15px 30px 15px; text-align: center; } .breadcrumbs .location { text-transform: uppercase; font-weight: 600; padding-right: 15px; float: left; font-size: 13px; line-height: 19px; display: none; } ul.trail-items { margin: 0; padding: 0; } ul.trail-items li { list-style: none; display: inline; } ul.trail-items li a{ color: #858585; } ul.trail-items li [rel~=home] span { position: relative; padding-left: 20px; } ul.trail-items li [rel~=home] span:before { content: "\f015"; position: absolute; left: 0; width: 15px; height: 15px; font-family: Fontawesome; } ul.trail-items li a:hover span{ color: #f50649; } .breadcrumbs .delim { padding: 0 10px; font-size: 16px; color: #8d97a1; line-height: .7; } .breadcrumbs .delim:last-child{ display: none; } div#promos-breadcrumbs { float: left; } .home ul.trail-items li span { display: none; } a.img-link { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } /* Blog Images options */ .post-wrap.full-image{ margin-bottom: 40px; } .post-wrap.right-image, .post-wrap.left-image{ margin-bottom: 30px; } .post-wrap.right-image .img-cover, .post-wrap.left-image .img-cover{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: top center; } .post-media.img-corved{ min-height: 400px; } .left-image .post-content, .left-image .post-media{ width: 100%; } .right-image .post-media, .left-image .post-media{ display: block; position: relative; width: 100%; overflow: hidden; } .right-image .post-content, .left-image .post-content{ padding: 20px; } .two-column .left-image, .alternative .left-image{ margin-left: 0; margin-right: 0; display: block; padding:0; } .two-column .left-image .post-media, .two-column .left-image .post-content, .alternative .left-image .post-media, .alternative .left-image .post-content{ display: block; } .two-column .left-image .post-media, .alternative .left-image .post-media{ padding:0; } .two-column .left-image .post-content, .alternative .left-image .post-content{ padding:20px; } .alternative article:nth-child(3n-2) .left-image{ padding: 15px 0; display: table; } .alternative article:nth-child(3n-2) .left-image .post-media, .alternative article:nth-child(3n-2) .left-image .post-content{ display: table-cell; padding: 0 15px; } .blog.two-column .post-wrap{ min-height: 650px; } .blog.two-column .post-media iframe{ height: 200px; } .blog.two-column .full-image .post-media{ min-height: 200px; max-height: 200px; overflow: hidden; } .two-column .full-image .post-excerpt{ } .hide-image .post-media{ display: none; } /*============================================================== ## 棣栭〉鍒楄〃 寮规€у竷灞€ ================================================================*/ @media (min-width: 768px){ .has-post-thumbnail .post-wrap.left-image{ display: flex; flex-direction: row; align-items: center; } .has-post-thumbnail .right-image .post-media, .has-post-thumbnail .left-image .post-media{ width: 150px; } .has-post-thumbnail .right-image .post-content, .has-post-thumbnail .left-image .post-content{ width: calc( 100% - 150px); padding: 20px; } .has-post-thumbnail .post-wrap.right-image{ display: flex; flex-direction: row-reverse; align-items: center; } } /*============================================================== ## Belo Slider Widget section ================================================================*/ .slider-below-widget-wrapper { margin: 30px 0 0 0; } .slider-below-widget-wrapper .widget{ background: transparent; } .slider-below-widget-wrapper .widget.widget_mc4wp_form_widget { background: #f4f4f4; padding: 40px; border-radius: 5px; } .slider-below-widget-wrapper .widget .widget-title{ background:transparent; } div.mc4wp-form-fields { margin: 0 auto; box-sizing: border-box; display: flex; flex-direction: row; align-items: center; height: 100%; } .entry-newsletter-content, .newsletter-form{ flex-grow: 1; display: flex; flex-direction: column; justify-content: center; width: 50%; } .entry-newsletter-head{ font-size: 24px; font-weight: 400; margin-bottom: 1px; margin-top: -5px; } .newsletter-form{ display: flex; flex-direction: row; padding-left: 30px; } .newsletter-form p:first-child { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .newsletter-form input[type=email]{ background: #fff; border: 1px solid #e9e9e9; padding: 3px 18px; line-height: 1; height: 52px; border-radius: 2px; transition: .15s; width: 100%; border-radius: 4px 0 0 4px; } .newsletter-form input[type=submit]{ background: #000; color: #fff; border: 1px solid #e9e9e9; padding: 3px 18px; line-height: 1; height: 52px; border-radius: 2px; margin-left: -2px; transition: .15s; border-radius: 0 4px 4px 0; } .footer-wrap div.mc4wp-form-fields, .sidebar-area div.mc4wp-form-fields{ display: block; } .footer-wrap .entry-newsletter-content, .footer-wrap .newsletter-form, .sidebar-area .entry-newsletter-content, .sidebar-area .newsletter-form{ width: 100%; } .footer-wrap .newsletter-form, .sidebar-area .newsletter-form{ padding-left: 0; margin-top: 20px; } @media (max-width: 768px){ .slider-below-widget-wrapper .widget{ padding:15px; } div.mc4wp-form-fields{ display: block; } .entry-newsletter-content, .newsletter-form{ width: 100%; margin-bottom: 20px; } .newsletter-form{ padding-left: 0; flex-direction: column; } } /*============================================================== ## Promo section ================================================================ */ .promo-section figure:after { content: ""; background: rgb(0 0 0 / 30%); position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .promo-section .promo-content{ position: absolute; left: 15px; top: 15px; width: calc(100% - 30px); height: calc(100% - 30px); background: rgba(255,255,255,0); -webkit-transition: background 0.3s ease; -moz-transition: background 0.3s ease; -o-transition: background 0.3s ease; transition: background 0.3s ease; display: flex; text-align: center; padding: 10px; } .promo-content:hover{ background: rgba(255,255,255,0.9); } .promo-content .post-title a{ color: #fff; } .promo-content:hover .post-title a{ color: #000; } .promo-content a.s-cat { background: #f50649; color: #fff; padding: 5px 10px; text-transform: uppercase; font-size: 12px; letter-spacing: 1px; } /*============================================================== ## Search Result ================================================================ */ .search.search-results .posts-container, .search.search-no-results .posts-container{ padding-top: 40px; } /*============================================================== ##WordPress content styles: Gutenberg editor ================================================================ */ /* paragraph */ .post-excerpt .has-background { margin: 5px 0 20px; padding: 20px 30px; display: inline-block; width: 100%; } .post-excerpt .has-background a { color: inherit !important; } /* quote type 1: regular */ .post-excerpt .wp-block-quote:not(.is-large):not(.is-style-large) { display: inline-block; width: 100%; margin: 5px 0 40px; padding: 25px; border-left: 4px solid #4c4f53; font-size: 20px; line-height: 1.7; background: #fafafa; } .post-excerpt .wp-block-quote:not(.is-large):not(.is-style-large):before { display: none; } .post-excerpt .wp-block-quote:not(.is-large):not(.is-style-large) cite, .post-excerpt .wp-block-quote:not(.is-large):not(.is-style-large) footer { margin-top: 10px; font-size: 18px; font-style: normal; line-height: 1.7; } .post-excerpt .wp-block-quote:not(.is-large):not(.is-style-large) cite { display: block; } /* quote type 2: large */ .post-excerpt .wp-block-quote.is-large, .post-excerpt .wp-block-quote.is-style-large { margin: 0 0 20px; padding: 0 0 0 46px; } .post-excerpt .wp-block-quote.is-large p, .post-excerpt .wp-block-quote.is-style-large p { font-size: 18px; font-style: normal; line-height: 1.65; } .post-excerpt .wp-block-quote.is-large cite, .post-excerpt .wp-block-quote.is-large footer, .post-excerpt .wp-block-quote.is-style-large cite, .post-excerpt .wp-block-quote.is-style-large footer { font-size: 18px; font-style: normal; text-align: left; line-height: 1.3; } .post-excerpt .wp-block-quote.is-large cite, .post-excerpt .wp-block-quote.is-style-large cite { display: block; } /* quote type 3: pullquote */ .post-excerpt .wp-block-pullquote { display: inline-block; width: 100%; margin: 5px 0 20px; padding: 20px 30px; text-align: center; border: none; border-top: 4px solid #4c4f53; border-bottom: 4px solid #4c4f53; } .post-excerpt .wp-block-pullquote blockquote { margin: 0; padding: 0; font-family: 'Lora', serif; font-size: 18px !important; font-style: normal; line-height: 1.65 !important; } .post-excerpt .wp-block-pullquote p { font-size: 18px !important; font-style: normal; line-height: 1.65 !important; } .post-excerpt .wp-block-pullquote blockquote p { margin: 0 0 15px !important; } .post-excerpt .wp-block-pullquote blockquote p:last-child { margin-bottom: 0 !important; } .post-excerpt .wp-block-pullquote blockquote:before { display: none; } .post-excerpt .wp-block-pullquote cite, .post-excerpt .wp-block-pullquote footer { text-transform: uppercase; font-size: 13px; font-style: normal; line-height: 1.7; text-align: center; } .post-excerpt .wp-block-pullquote cite { margin-top: 15px; } /* pullquote: solid color */ .post-excerpt .wp-block-pullquote.is-style-solid-color { border-top: none; border-bottom: none; } .post-excerpt .wp-block-pullquote.is-style-solid-color blockquote { text-align: center; max-width: 100%; } .post-excerpt .wp-block-pullquote.is-style-solid-color blockquote cite { text-transform: uppercase; font-size: 13px; font-style: normal; line-height: 1.7; text-align: center; } /* button */ .post-excerpt .wp-block-button { margin: 0 0 20px; padding: 5px 0; } .post-excerpt .wp-block-button .wp-block-button__link { width: auto; margin: 0; padding: 15px 25px; font-size: 15px; line-height: 1; text-align: center; border: none; border-radius: 23px; box-shadow: none; text-decoration: none !important; } .post-excerpt .wp-block-button .wp-block-button__link:active { position: relative; top: 1px; } .post-excerpt .wp-block-button__link:not(.has-text-color), .post-excerpt .wp-block-button__link:not(.has-text-color):active, .post-excerpt .wp-block-button__link:not(.has-text-color):focus, .post-excerpt .wp-block-button__link:not(.has-text-color):hover { color: #ffffff; } .post-excerpt .wp-block-button__link:not(.has-background), .post-excerpt .wp-block-button__link:not(.has-background):active, .post-excerpt .wp-block-button__link:not(.has-background):focus, .post-excerpt .wp-block-button__link:not(.has-background):hover { background-color: #1f2123; } /* separator (3 different types) */ .post-excerpt .wp-block-separator, .post-excerpt .wp-block-separator.is-style-wide { margin: 25px auto; border: none; border-bottom: 1px solid #eeefef; } .post-excerpt .wp-block-separator:not(.is-style-wide):not(.is-style-dots) { max-width: 100px; border-bottom-width: 2px; } .post-excerpt .wp-block-separator.is-style-dots { margin-top: 15px; margin-bottom: 15px; background: none; border: none; text-align: center; max-width: none; line-height: 1; height: auto; } .post-excerpt .wp-block-separator.is-style-dots:before { color: #4c4f53; font-size: 20px; font-weight: 700; } /* captions for media files */ .post-excerpt .wp-block-image figcaption, .post-excerpt .wp-block-audio figcaption, .post-excerpt .wp-block-video figcaption, .post-excerpt .wp-block-embed figcaption { margin: 0; font-size: 13px; text-align: left; line-height: 1.6; color: #4c4f53; } /* image */ .post-excerpt figure.wp-block-image, .post-excerpt .wp-block-image figure { margin: 0 0 20px; padding: 5px 0 0; } .post-excerpt .wp-block-image figcaption { margin-bottom: -5px; padding: 10px 0 0; } .post-excerpt .wp-block-image .alignleft { float: left; margin: 5px 30px 15px 0; padding: 0; } .post-excerpt .wp-block-image .alignright { float: right; margin: 5px 0 15px 30px; padding: 0; } .post-excerpt .wp-block-image .aligncenter { margin: 0 auto 20px; padding: 5px 0 0; } /* cover image */ .post-excerpt .wp-block-cover, .post-excerpt .wp-block-cover-image { margin: 20px 0; } .post-excerpt > .wp-block-cover:first-child, .post-excerpt > .wp-block-cover-image:first-child { margin-top: 5px; margin-right: 20px; } .post-excerpt .wp-block-cover-image .wp-block-subhead, .post-excerpt .wp-block-cover-image h1, .post-excerpt .wp-block-cover-image h2, .post-excerpt .wp-block-cover-image h3, .post-excerpt .wp-block-cover-image h4, .post-excerpt .wp-block-cover-image h5, .post-excerpt .wp-block-cover-image h6, .post-excerpt .wp-block-cover-image p, .post-excerpt .wp-block-cover-image a, .post-excerpt .wp-block-cover-image a:active, .post-excerpt .wp-block-cover-image a:focus, .post-excerpt .wp-block-cover-image a:hover, .post-excerpt .wp-block-cover .wp-block-subhead, .post-excerpt .wp-block-cover h1, .post-excerpt .wp-block-cover h2, .post-excerpt .wp-block-cover h3, .post-excerpt .wp-block-cover h4, .post-excerpt .wp-block-cover h5, .post-excerpt .wp-block-cover h6, .post-excerpt .wp-block-cover p, .post-excerpt .wp-block-cover a, .post-excerpt .wp-block-cover a:active, .post-excerpt .wp-block-cover a:focus, .post-excerpt .wp-block-cover a:hover { color: inherit !important; } .post-excerpt .wp-block-cover-image h1:last-child, .post-excerpt .wp-block-cover-image h2:last-child, .post-excerpt .wp-block-cover-image h3:last-child, .post-excerpt .wp-block-cover-image h4:last-child, .post-excerpt .wp-block-cover-image h5:last-child, .post-excerpt .wp-block-cover-image h6:last-child, .post-excerpt .wp-block-cover-image p:last-child, .post-excerpt .wp-block-cover h1:last-child, .post-excerpt .wp-block-cover h2:last-child, .post-excerpt .wp-block-cover h3:last-child, .post-excerpt .wp-block-cover h4:last-child, .post-excerpt .wp-block-cover h5:last-child, .post-excerpt .wp-block-cover h6:last-child, .post-excerpt .wp-block-cover p:last-child { margin-bottom: 0; } /* gallery */ .post-excerpt .wp-block-gallery { margin: 0; padding: 5px 0 4px; } .post-excerpt .wp-block-gallery .blocks-gallery-image figcaption, .post-excerpt .wp-block-gallery .blocks-gallery-item figcaption { font-size: 13px; line-height: 1.6; text-align: left; padding-right: 15px; padding-bottom: 8px; padding-left: 15px; color: #eaedf1; } .post-excerpt .wp-block-gallery .blocks-gallery-image figcaption a, .post-excerpt .wp-block-gallery .blocks-gallery-image figcaption a:active, .post-excerpt .wp-block-gallery .blocks-gallery-image figcaption a:focus, .post-excerpt .wp-block-gallery .blocks-gallery-image figcaption a:hover, .post-excerpt .wp-block-gallery .blocks-gallery-item figcaption a, .post-excerpt .wp-block-gallery .blocks-gallery-item figcaption a:active, .post-excerpt .wp-block-gallery .blocks-gallery-item figcaption a:focus, .post-excerpt .wp-block-gallery .blocks-gallery-item figcaption a:hover { color: #eaedf1; } /* audio and video */ .post-excerpt .wp-block-audio, .post-excerpt .wp-block-video { margin: 0 0 15px; padding: 5px 0 0; } .post-excerpt .wp-block-audio audio { width: 100%; max-width: 100%; display: inline-block; } .post-excerpt .wp-block-audio figcaption, .post-excerpt .wp-block-video figcaption { padding: 3px 0 0; } /* embed elements */ .post-excerpt .wp-block-embed { clear: both; margin: 0 0 15px; padding: 5px 0 0; min-width: 160px; } .post-excerpt .wp-block-embed iframe, .post-excerpt .wp-block-embed embed { margin: 0; } .post-excerpt .wp-block-embed figcaption { padding: 3px 0 0; } .post-excerpt .wp-block-embed.wp-block-embed-youtube figcaption, .post-excerpt .wp-block-embed.wp-block-embed-vimeo figcaption, .post-excerpt .wp-block-embed.wp-block-embed-soundcloud figcaption { padding-top: 10px; } .post-excerpt .wp-block-embed .twitter-tweet { margin-top: 0 !important; } .post-excerpt .wp-block-embed-facebook .wp-block-embed__wrapper, .post-excerpt .wp-block-embed-facebook .fb_iframe_widget, .post-excerpt .wp-block-embed-facebook .fb_iframe_widget span { max-width: 100%; } /* file */ .post-excerpt .wp-block-file { margin: 0 0 15px; } .post-excerpt .wp-block-file a:not(.wp-block-file__button) { font-size: 15px; font-weight: 700; line-height: 1.7; color: #f50649; text-decoration: underline; } .post-excerpt .wp-block-file a:not(.wp-block-file__button):focus, .post-excerpt .wp-block-file a:not(.wp-block-file__button):hover { color: #f50649; } .post-excerpt .wp-block-file .wp-block-file__button { display: inline-block; font-size: 15px; text-decoration: none !important; margin: 0 0 0 15px; padding: 0 15px; height: 35px; line-height: 35px; border-radius: 18px; background: #1f2123; color: #ffffff; } .post-excerpt .wp-block-file .wp-block-file__button:active { position: relative; top: 1px; } .post-excerpt .wp-block-file .wp-block-file__button:active, .post-excerpt .wp-block-file .wp-block-file__button:focus, .post-excerpt .wp-block-file .wp-block-file__button:hover, .post-excerpt .wp-block-file .wp-block-file__button:visited { box-shadow: none; color: #ffffff; background: #f50649; opacity: 1; } /* code and preformatted */ .post-excerpt .wp-block-code, .post-excerpt .wp-block-preformatted { overflow: hidden; overflow-wrap: break-word; white-space: pre-wrap; word-break: normal; word-wrap: break-word; line-height: 1.5; } .post-excerpt .wp-block-code code { padding: 0; font-size: inherit; color: inherit; white-space: pre-wrap; background-color: transparent; border-radius: 0; } .post-excerpt .wp-block-preformatted { background-color: transparent; border: 1px solid #eeefef; } /* table */ .post-excerpt .wp-block-table { width: 100%; } .post-excerpt .wp-block-table tbody, .post-excerpt .wp-block-table tfoot, .post-excerpt .wp-block-table thead { width: 100%; min-width: 240px; display: table; } /* table: stripes style */ .post-excerpt .wp-block-table.is-style-stripes { border-bottom: none; } .post-excerpt .wp-block-table.is-style-stripes td { border-color: #eeefef; } .post-excerpt .wp-block-table.is-style-stripes tr:nth-child(odd) { background-color: #f7f8f8; } /* verse */ .post-excerpt .wp-block-verse { white-space: pre-wrap; overflow: auto; padding: 20px 30px; font-family: 'Playfair Display', serif; font-size: 17px; line-height: 1.7; background-color: transparent; border: 1px solid #eeefef; } /* columns */ .post-excerpt .wp-block-columns { margin: 0 -18px; padding: 0; overflow: hidden; } .post-excerpt .wp-block-columns .wp-block-column { margin: 0; padding: 0 18px; } /* widgets: archives and categories */ .post-excerpt .wp-block-archives li, .post-excerpt .wp-block-categories li { margin: 0 0 4px; } .post-excerpt .wp-block-archives li:last-child, .post-excerpt .wp-block-categories li:last-child { margin-bottom: 0; } .post-excerpt .wp-block-archives li a, .post-excerpt .wp-block-categories li a { margin-right: 4px; } .post-excerpt .wp-block-archives li ul, .post-excerpt .wp-block-categories li ul { margin: 4px 0; } .post-excerpt .wp-block-archives li:last-child ul, .post-excerpt .wp-block-categories li:last-child ul { margin-bottom: 0; } .post-excerpt .wp-block-archives .screen-reader-text, .post-excerpt .wp-block-categories-dropdown .screen-reader-text { width: 1px; padding-bottom: 0; } .post-excerpt .wp-block-archives select, .post-excerpt .wp-block-categories-dropdown select { margin: 5px 0 20px; } .post-excerpt .wp-block-archives.aligncenter, .post-excerpt .wp-block-categories-dropdown { margin: 0; padding: 0; } /* widget: latest comments */ .post-excerpt .wp-block-latest-comments { padding: 0 0 0 15px; } .post-excerpt .wp-block-latest-comments .wp-block-latest-comments__comment { margin: 0 0 10px; list-style: decimal; font-size: 15px; line-height: 1.7; } .post-excerpt .wp-block-latest-comments .wp-block-latest-comments__comment:last-child { margin-bottom: 0; } .post-excerpt .wp-block-latest-comments .wp-block-latest-comments__comment-date { display: block; font-size: 12px; line-height: 1.7; color: #989ea6; } .post-excerpt .wp-block-latest-comments .wp-block-latest-comments__comment-excerpt p { padding: 0; margin: 5px 0 15px; font-size: 14px; line-height: 1.7; } .post-excerpt .wp-block-latest-comments .wp-block-latest-comments__comment:last-child .wp-block-latest-comments__comment-excerpt p:last-child { margin-bottom: 0; } .post-excerpt .wp-block-latest-comments.has-avatars { padding: 3px 0 0; list-style: none; } .post-excerpt .wp-block-latest-comments.has-avatars .wp-block-latest-comments__comment { list-style: none; } .post-excerpt .wp-block-latest-comments.has-avatars .avatar, .post-excerpt .wp-block-latest-comments.has-avatars .wp-block-latest-comments__comment-avatar { margin: 2px 15px 0 0; } .post-excerpt .wp-block-latest-comments.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt { margin: 0; } .post-excerpt .wp-block-latest-comments.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta { margin: 0 0 0 55px; } /* widget: latest posts */ .post-excerpt .wp-block-latest-posts li { margin: 0 0 5px; } .post-excerpt .wp-block-latest-posts li:last-child { margin-bottom: 0; } .post-excerpt .wp-block-latest-posts .wp-block-latest-posts__post-date { display: block; font-size: 12px; line-height: 1.7; color: #989ea6; } .post-excerpt .wp-block-latest-posts.is-grid { list-style: none; margin-right: -15px; margin-bottom: 5px; padding: 0; overflow: hidden; } .post-excerpt .wp-block-latest-posts.is-grid li { margin-bottom: 15px; padding-right: 15px; line-height: 1.5; } .post-excerpt .wp-block-latest-posts.is-grid .wp-block-latest-posts__post-date { margin-top: 3px; line-height: 1.7; } /* widget: calendar */ .post-excerpt .wp-block-calendar #wp-calendar { display: table; text-align: center; font-family: 'Lora', serif; line-height: 1.7; } .post-excerpt .wp-block-calendar table caption, .post-excerpt .wp-block-calendar table tbody { color: #4c4f53; } .post-excerpt .wp-block-calendar #wp-calendar tbody td, .post-excerpt .wp-block-calendar #wp-calendar th { padding: 5px; border: 1px solid #eeefef; } .post-excerpt .wp-block-calendar #wp-calendar thead th { text-align: center; font-weight: 700; background: #f7f8f8; } .post-excerpt .wp-block-calendar #wp-calendar a { font-weight: 700; } .post-excerpt .wp-block-calendar #wp-calendar tfoot td { border: none; padding: 15px 5px 0 !important; } .post-excerpt .wp-block-calendar #wp-calendar tfoot td a { color: #4c4f53; } .post-excerpt .wp-block-calendar #wp-calendar tfoot td a:hover, .post-excerpt .wp-block-calendar #wp-calendar tfoot td a:focus { color: #f50649; } /* widget: rss */ .post-excerpt .wp-block-rss .wp-block-rss__item { margin: 0 0 10px; } .post-excerpt .wp-block-rss .wp-block-rss__item:last-child { margin-bottom: 0; } .post-excerpt .wp-block-rss .wp-block-rss__item-title a { font-weight: 700; } .post-excerpt .wp-block-rss .wp-block-rss__item-publish-date, .post-excerpt .wp-block-rss .wp-block-rss__item-author { display: block; font-size: 12px; line-height: 1.7; color: #989ea6; } .post-excerpt .wp-block-rss .wp-block-rss__item-excerpt { font-size: 14px; } .post-excerpt .wp-block-rss.is-grid { list-style: none; margin-right: -30px; margin-bottom: 5px; padding: 0; overflow: hidden; } .post-excerpt .wp-block-rss.is-grid .wp-block-rss__item { margin-bottom: 15px; padding-right: 30px; } /* widget: search */ .post-excerpt .wp-block-search { margin: 0 0 20px; } .post-excerpt .wp-block-search:last-child { margin-bottom: 0; } .post-excerpt .wp-block-search .wp-block-search__input { width: auto; height: 47px; } .post-excerpt .wp-block-search .wp-block-search__button { margin-left: 14px; padding: 0 20px; height: 47px; line-height: 47px; } /* search form: placeholder */ /* Chrome/Opera/Safari */ .post-excerpt .wp-block-search .wp-block-search__input::-webkit-input-placeholder { color: #989ea6; opacity: 1; } /* Firefox 18- */ .post-excerpt .wp-block-search .wp-block-search__input:-moz-placeholder { color: #989ea6; opacity: 1; } /* Firefox 19+ */ .post-excerpt .wp-block-search .wp-block-search__input::-moz-placeholder { color: #989ea6; opacity: 1; } /* IE 10+ */ .post-excerpt .wp-block-search .wp-block-search__input:-ms-input-placeholder { color: #989ea6; opacity: 1; } /* widget: tag cloud */ .post-excerpt .wp-block-tag-cloud a { display: inline-block; text-decoration: none !important; margin-right: 5px; } .post-excerpt .wp-block-tag-cloud a:hover, .post-excerpt .wp-block-tag-cloud a:focus, .post-excerpt .wp-block-tag-cloud a:hover span, .post-excerpt .wp-block-tag-cloud a:focus span { text-decoration: underline !important; } .post-excerpt .wp-block-tag-cloud a span { display: inline-block; margin-left: 5px; } /* media & text */ .post-excerpt .wp-block-media-text { margin-bottom: 15px; } .post-excerpt .wp-block-media-text .wp-block-media-text__media { padding-top: 5px; padding-bottom: 11px; } /* wide-images */ .post-excerpt .alignwide, .post-excerpt .alignfull { margin-left: -30px !important; margin-right: -30px !important; width: auto; max-width: 100vw; } .post-excerpt .alignwide figcaption, .post-excerpt .alignfull figcaption { padding-right: 30px !important; padding-left: 30px !important; } /* other wide elements */ .post-excerpt .wp-block-pullquote.alignwide, .post-excerpt .wp-block-pullquote.alignfull { display: block; margin-top: 20px; margin-bottom: 20px; } .post-excerpt > .wp-block-pullquote.alignwide:first-child, .post-excerpt > .wp-block-pullquote.alignfull:first-child { margin-top: 5px; } .post-excerpt .wp-block-table.alignwide, .post-excerpt .wp-block-table.alignfull { margin-left: -32px !important; margin-right: -33px !important; } /*Header Cart*/ .cart-right { float: right; } .cart-right > ul { display: inline-block; padding: 0; margin: 0; } .cart-right li { display: inline-block; position: relative; z-index: 99; } .cart-right > ul > li > a { color: #4c4f53; display: block; padding: 15px 10px; float: left; line-height: 56px; } .header-cart .cart-wrap{ position: relative; } .header-cart i { font-size: 15px; padding-right: 10px; color: #4c4f53; } .cart-inner { color: #fff; font-size: 12px; text-transform: uppercase; background: #f50649; border-radius: 50%; left: 10px; top: 5px; position: absolute; height: 25px; width: 25px; text-align: center; line-height: 25px; } .headr_btom_cart { background: #ffffff none repeat scroll 0 0; display: block; opacity: 0; padding: 0; position: absolute; right: 0; top: 100%; transform: scaleY(0); transform-origin: 0 0 0; transition: all 0.3s ease 0s; visibility: hidden; width: 300px; z-index: 999; -webkit-box-shadow: 0px 12px 30px -2px rgba(0,0,0,0.1); -moz-box-shadow: 0px 12px 30px -2px rgba(0,0,0,0.1); -o-box-shadow: 0px 12px 30px -2px rgba(0,0,0,0.1); box-shadow: 0px 12px 30px -2px rgba(0,0,0,0.1); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; } .headr_btom_cart ul { padding-left: 0px; margin-top: 0px; } .header-cart:hover .headr_btom_cart { opacity: 1; transform: scale(1); visibility: visible; } .header-cart .widgettitle { display: none; } .header-cart li.single-cart{ display: block; } /*CONTACT FORM 7 STYLE*/ .wpcf7-form label{ display: block; margin-top: auto; color: #333; font-family: 'Lato', sans-serif; letter-spacing: 1px; font-size: 14px; text-transform: uppercase; margin-bottom: 20px; } .wpcf7-form-control-wrap { display: block; position: relative; margin-top: 5px; } .wpcf7-form-control{ -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; background-color: #fff; border-width: 1px; line-height: 1.5; font-size: 16px; padding-left: 1rem; padding-right: 1rem; border-radius: 0; width: 100%; color: rgba(0,0,0,.6); padding-top: 7px; padding-bottom: 7px; border: 1px solid rgba(0,0,0,.1); } .wpcf7-form-control.wpcf7-submit{ display: inline-block; width: auto; cursor: pointer; background: #333; color: #fff; text-transform: uppercase; } .wpcf7-form-control.wpcf7-submit:hover{ color: #f50649; } /*Mailchim Form*/ .mc4wp-form-fields input[type="text"], .mc4wp-form-fields input[type="email"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; background-color: #fff; border-width: 1px; line-height: 1.5; font-size: 16px; padding-left: 1rem; padding-right: 1rem; border-radius: 0; width: 100%; color: rgba(0,0,0,.6); padding-top: 7px; padding-bottom: 7px; border: 1px solid rgba(0,0,0,.1); } .mc4wp-form-fields input[type="submit"]{ font-style: normal; font-size: 13px; display: inline-block; background-color: #000; color: #fff; padding: 5px 20px; letter-spacing: 0.06em; transition: all .6s; border: 0; cursor: pointer; } .mc4wp-form-fields input[type="submit"]:hover { opacity: 0.5; } /** * Responsive Styles * ------------------------------------------------------------- */ /* 1199px */ @media (max-width: 1199px) { /* pagination */ .pagination { padding-right: 15px; padding-left: 15px; } /* single page: post navigation */ .post-navigation .nav-previous { padding-right: 10px; } .post-navigation .nav-next { padding-left: 10px; } /* WordPress content styles: gallery */ .gallery.gallery-columns-6 .gallery-item .gallery-caption { display: none; } /* footer: menu */ .footer-menu { margin-right: -8px; } .footer-menu li a { padding-right: 8px; padding-left: 8px; } } /* 991px */ @media (max-width: 991px) { .post-wrap, .widget{ padding:10px 5px; } /* footer: copyright text (or some other text) */ .site-footer { float: none; width: 100%; margin-bottom: 15px; padding-right: 0; } /* footer: menu */ .footer-menu-wrap { float: none; width: 100%; margin-bottom: 15px; padding-left: 0; } .footer-menu { float: none; margin-right: -10px; margin-left: -10px; } .footer-menu li a { padding-right: 10px; padding-left: 10px; } .right-sidebar #primary{ float: none; } .blog.left-sidebar #primary, .archive.left-sidebar #primary, .page.left-sidebar #primary{ float: none; } .single.single-left-sidebar #primary, .single.single-right-sidebar #primary{ max-width: 100%; } .right-image .post-content, .left-image .post-content, .post-content{ padding-left: 0; padding-right: 0; } } /* 767px */ @media (max-width: 767px) { /* comments */ .comment-list .children { padding-left: 25px; } .right-sidebar #primary{ float: none; } .left-image .post-content, .left-image .post-media{ display: block; max-width: 100%; min-width:100%; } .blog.left-sidebar #primary, .archive.left-sidebar #primary, .page.left-sidebar #primary{ float: none; } } /* 720px */ @media (max-width: 720px) { /* container with posts */ .posts-container { padding-top: 40px; padding-bottom: 0; } /* pagination */ .pagination { margin-top: 10px; } .gallery.gallery-columns-5 .gallery-item .gallery-caption { display: none; } /* comments */ .comment-list .children { padding-left: 20px; } /* page 404 */ /* sidebar */ /* widgets */ /* footer widgets */ /* footer */ } /* 600px */ @media (max-width: 600px) { /* WordPress content styles */ .gallery.gallery-columns-4 .gallery-item .gallery-caption { display: none; } /* comments */ .comment-reply-title span, .comment-reply-title small { display: block; } .comment-reply-title small { float: none; } .comment-list .children { padding-left: 15px; } .container{ padding-left: 5px; padding-right: 5px; } } /* 480px */ @media (max-width: 480px) { /* pagination */ .pagination { margin-right: -15px; margin-left: -15px; padding-right: 0; padding-left: 0; } /* comments */ .comment-reply-title, .comments-title { padding-right: 30px; padding-left: 30px; } .comment-list li .comment-reply-title { padding-right: 0; padding-left: 0; } .comment-list .children { padding-left: 10px; } .comment-navigation .nav-previous { padding-right: 5px; } .comment-navigation .nav-next { padding-left: 5px; } } /* 360px */ @media (max-width: 360px) { /* containers with content: reduce left and right indents to 15 pixels */ pre, .post-content, .no-results, .about-author, .comment-reply-title, .comments-title, .comment-form, .comment-list-wrap, .comments-area .no-comments, .comment-respond .must-log-in{ padding-right: 15px; padding-left: 15px; } /* wide-images */ .alignwide, .alignfull { margin-left: -15px !important; margin-right: -15px !important; } .alignwide figcaption, .alignfull figcaption { padding-right: 15px !important; padding-left: 15px !important; } /* single page: post navigation */ .post-navigation .nav-previous { padding-right: 5px; } .post-navigation .nav-next { padding-left: 5px; } } /* 320px */ @media (max-width: 320px) { /* single page: post navigation */ .post-navigation .nav-previous, .post-navigation .nav-next { width: 100%; float: none; } .post-navigation .nav-previous { padding-right: 0; } .post-navigation .nav-next { padding-left: 0; text-align: left; } /* comments */ .comment-list-wrap { overflow: hidden; } .comment-meta .comment-awaiting-moderation { margin-left: 0; } .comment-content, .comment-body .reply { padding-left: 0; } .comment-navigation { padding-top: 15px; padding-bottom: 5px; } .comment-navigation .nav-previous, .comment-navigation .nav-next { float: none; width: 100%; line-height: 1.3; } .comment-navigation .nav-previous { padding-right: 0; } .comment-navigation .nav-next { padding-left: 0; text-align: left; } .comment-navigation .nav-links a { padding-top: 10px; padding-bottom: 10px; } .comment-navigation .nav-previous i { display: none; } .comment-navigation .nav-previous a:after { font-family: 'FontAwesome'; font-weight: 900; content: '\f0da'; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; margin-left: 8px; } } @media (max-width: 767px) { .cart-right{ position: absolute; top: 0; right: 10px; } .header-default .bar-menu { left:15px; } .left-side, .right-side{ float: none!important; } .top-menu, .social-links{ text-align: center; } .search-wrapper { padding-left: 0; position: absolute; top: 0; right: 0; } .bottom-caption{ display: none; } .caption h2 a{ font-size: 24px; } }