/* Theme Name: Binder Theme URI: http://demos.quadroideas.com/binder Author: QuadroIdeas Author URI: http://quadroideas.com/ Description: A personal WordPress theme to share your ideas with the world. Version: 1.0.4 License: GNU General Public License version 3.0 License URI: http://www.gnu.org/licenses/gpl-3.0.html Text Domain: quadro Domain Path: /languages/ Tags: white, light, two-columns, three-columns, four-columns, fluid-layout, responsive-layout, custom-background, custom-colors, custom-menu, featured-images, full-width-template, theme-options, threaded-comments, translation-ready, post-formats Binder WordPress Theme, Copyright 2015 Quadro Ideas Binder is distributed under the terms of the GNU GPL */ /* =Reset -------------------------------------------------------------- */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline; } html { font-size: 62.5%; /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */ overflow-y: scroll; /* Keeps page centred in all browsers regardless of content height */ -webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */ -ms-text-size-adjust: 100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */ } body { -ms-word-wrap: break-word; word-wrap: break-word; } article, aside, details, figcaption, figure, footer, header, nav, section { display: block; } ol, ul { list-style: none; } table { /* tables still need 'cellspacing="0"' in the markup */ border-collapse: separate; border-spacing: 0; } caption, th, td { font-weight: normal; text-align: left; } a:focus { outline: none; } a:hover, a:active { /* Improves readability when focused and also mouse hovered in all browsers people.opera.com/patrickl/experiments/keyboard/test */ outline: 0; } a img { border: 0; } /* =Global ----------------------------------------------- */ body, button, input, select, textarea { color: #484848; font-size: 16px; line-height: 1.5; } body { background-color: #eaeaea; /* Default BG color */ background-attachment: fixed; } /* Headings */ h1,h2,h3,h4,h5,h6 { clear: both; margin-bottom: 18px; } h1 { font-size: 40px; } h2 { font-size: 36px; } h3 { font-size: 26.667px; } h4 { font-size: 24px; } h5 { font-size: 17.778px; } h6 { font-size: 16px; } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 24px; } /* Text elements */ p { margin-bottom: 24px; } ul, ol { margin: 0 0 24px 20px; } ul { list-style: disc; } ol { list-style: decimal; } li > ul, li > ol { margin-bottom: 0; margin-left: 20px; } dl { margin-bottom: 24px; } dt { font-weight: bold; } dd { margin: 0 20px 24px; } b, strong { font-weight: bold; } dfn, cite, em, i { font-style: italic; } blockquote, q { quotes: "" ""; margin-bottom: 24px; font-size: 125%; font-style: italic; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } .blog-container blockquote, .blog-container q { margin-bottom: 10px; } .blog-container blockquote p { margin-bottom: 0; } cite { display: block; margin-top: 5px; font-size: 15px; font-weight: bold; } address { margin: 0 0 24px; font-size: 90%; line-height: 1.8; } pre { background: #eee; font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; line-height: 1.6; margin-bottom: 24px; padding: 20px; overflow: auto; max-width: 100%; } code, kbd, tt, var { font: 15px Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } sup, sub { font-size: 75%; height: 0; line-height: 0; position: relative; vertical-align: baseline; } sup { bottom: 1ex; } sub { top: .5ex; } small { font-size: 75%; } big { font-size: 125%; } figure { margin: 0; } table { width: 100%; margin: 0 0 24px; padding: 15px 30px 30px; background: rgba(255,255,255,0.8); font-size: 90%; } table td, table th { padding: 20px 0; border-bottom: 1px solid #dedede; } th { font-size: 15px; font-weight: bold; text-transform: uppercase; } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ } button, input, select, textarea { font-size: 100%; /* Corrects font size not being inherited in all browsers */ margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */ vertical-align: baseline; /* Improves appearance and consistency in all browsers */ /*vertical-align: middle;*/ /* Improves appearance and consistency in all browsers */ } select { padding: 8px 40px 8px 8px !important; background: url('images/select-arrows.png') no-repeat right center; background-size: 30px; border: 1px solid #dedede; font-size: 12px; text-transform: uppercase; cursor: pointer; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; } select[multiple] { background: none; cursor: auto; } button, input { line-height: normal; /* Addresses FF3/4 setting line-height using !important in the UA stylesheet */ } input[type="file"] { font-size: 14px; line-height: 1; color: #555; } button, a.button, a.qbtn, html input[type="button"], input[type="reset"], input[type="submit"] { display: inline-block; padding: 10px 15px; cursor: pointer; /* Improves usability and consistency of cursor style between image-type 'input' and others */ /*-webkit-appearance: button;*/ /* Corrects inability to style clickable 'input' types in iOS */ font-size: 85%; background: none; border: 1px solid; box-shadow: none; text-shadow: none; font-style: italic; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } button:hover, a.button:hover, a.qbtn:hover, html input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { box-shadow: none; text-shadow: none; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } button:focus, a.button:focus, html input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, button:active, html input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active { outline: none; zoom: 1; filter: alpha(opacity=100); opacity: 1; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* Addresses box sizing set to content-box in IE8/9 */ padding: 0; /* Addresses excess padding in IE8/9 */ } button::-moz-focus-inner, input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */ border: 0; padding: 0; } input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="url"], input[type="tel"], input[type="number"], input[type="date"], textarea { display: inline-block; width: 100%; max-width: 100%; padding: 8px !important; background: none; border: 1px solid #dedede; color: #666; line-height: 1.5; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } input[type="number"], input[type="date"] { width: auto; } input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="url"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="date"]:focus, textarea:focus, select:focus { color: #111; outline: none; -webkit-box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 0px 4px rgba(0, 0, 0, 0.1); } textarea { overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */ padding: 2%; vertical-align: top; /* Improves readability and alignment in all browsers */ width: 100%; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } input[type="search"] { -webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 1px; width: auto; height: 40px; vertical-align: top; } input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */ -webkit-appearance: none; -moz-appearance: none; appearance: none; } /* Contact Form 7 Support */ div.wpcf7 { max-width: 540px; margin: 30px 0; } div.wpcf7 p { font-size: 90%; } .widget div.wpcf7 p { margin-bottom: 10px; font-size: 85%; } span.wpcf7-form-control-wrap { width: 100%; } img.wpcf7-captchac { display: inline; margin-top: 10px; } input[type="text"].wpcf7-captchar { display: inline; width: auto; } span.wpcf7-list-item { margin: 0 15px 0 0; } span.wpcf7-not-valid-tip { font-size: 80%; padding: 5px 0; } div.wpcf7-response-output { margin: 20px 0; padding: 10px 15px; border-width: 1px !important; font-size: 85%; } .widget div.wpcf7 input[type="text"], .widget div.wpcf7 input[type="email"], .widget div.wpcf7 input[type="password"], .widget div.wpcf7 input[type="search"], .widget div.wpcf7 input[type="url"], .widget div.wpcf7 input[type="tel"], .widget div.wpcf7 input[type="number"], .widget div.wpcf7 input[type="date"], .widget div.wpcf7 textarea { padding: 8px; } .wpcf7-textarea { height: 200px; } .widget .wpcf7-textarea { height: 100px; } /* Gravity Forms Support */ .gform_heading { text-align: center; margin-bottom: 30px !important; } .gform_title:before, .gform_title:after { content: ""; display: inline-block; width: 20px; margin: 0 10px; border-top: 1px solid; vertical-align: middle; zoom: 1; filter: alpha(opacity=40); opacity: 0.4; } .gform_description { font-style: 90%; font-style: italic; } .gform_body { font-size: 85%; } .gform_wrapper .gf_progressbar_wrapper { margin-bottom: 30px !important; padding: 10px !important; background: #f5f5f5; border: none !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .gform_wrapper .gf_progressbar { background-image: none !important; border: 1px solid #dedede !important; -webkit-box-shadow: none !important; box-shadow: none !important; -webkit-border-radius: 1px !important; -moz-border-radius: 1px !important; border-radius: 1px !important; } .gform_wrapper .gf_progressbar_wrapper h3.gf_progressbar_title { zoom: 1; filter: alpha(opacity=80) !important; opacity: 0.8 !important; } .gform_wrapper .gf_progressbar_percentage { background-image: none !important; } .gform_wrapper .left_label .gfield_label { font-weight: normal !important; } .gform_wrapper .gfield_description { padding-top: 5px !important; font-size: 11px !important; color: #666; font-style: italic; } .gform_wrapper input[type=text], .gform_wrapper input[type=url], .gform_wrapper input[type=email], .gform_wrapper input[type=tel], .gform_wrapper input[type=number], .gform_wrapper input[type=password], .gform_wrapper select, .gform_wrapper textarea { font-size: 12px !important; color: #000 !important; } .gform_wrapper .gfield_checkbox li input[type=checkbox], .gform_wrapper .gfield_radio li input[type=radio], .gform_wrapper .gfield_checkbox li input { margin-left: 1px !important; } .gform_wrapper .gform_page_footer { margin-top: 40px !important; padding-top: 20px !important; border-top: 5px solid #f5f5f5 !important; } .gform_wrapper div.validation_error { font-size: 85% !important; } .gform_confirmation_wrapper { padding: 20px; background: #f5f5f5; font-size: 85%; font-weight: bold; } /* Links */ a { color: #6a6a6a; text-decoration: none; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } a:visited { color: #6a6a6a; } a:hover, a:focus, a:active { color: #231f20; } a::selection { background: none; } /* Alignment */ .alignleft { display: inline; float: left; margin-right: 20px; } .alignright { display: inline; float: right; margin-left: 20px; } .aligncenter { clear: both; display: block; margin: 0 auto; } /* Text meant only for screen readers */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; } .screen-reader-text:hover, .screen-reader-text:active, .screen-reader-text:focus { background-color: #f1f1f1; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; 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 */ } /* Clearing */ .clear:before, .clear:after, [class*="content"]:before, [class*="content"]:after, [class*="site"]:before, [class*="site"]:after { content: ''; display: table; } .clear:after, [class*="content"]:after, [class*="site"]:after { clear: both; } /* =Main Layout ----------------------------------------------- */ .site { margin: 0 auto; overflow: hidden; } .site-content { width: 78%; float: right; } .content-area { max-width: 1370px; min-height: 600px; margin: 30px; padding: 60px; background: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .page-template-template-landing-php .content-area { width: 92%; max-width: none; margin: 30px 4%; } .site-main {} .back-to-top { display: none; position: fixed; bottom: 80px; right: 4%; width: 60px; height: 60px; background: #fff; text-align: center; line-height: 60px; zoom: 1; filter: alpha(opacity=90); opacity: 0.9; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; z-index: 9999; } .back-to-top:before { font-family: 'FontAwesome'; content: "\f106"; font-size: 40px; color: #333; } /* =Header ----------------------------------------------- */ .site-header { position: fixed; top: 0; left: 0; width: 22%; height: 100%; padding: 100px 30px 80px; background: #fff; -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15); box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; z-index: 100; } .inner-header { max-width: 280px; margin: 0 auto; text-align: center; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .site-branding {} .site-branding a {} .site-branding a:hover { zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } .site-branding .avatar { margin-bottom: 10px; -webkit-border-radius: 70px; -moz-border-radius: 70px; border-radius: 70px; } .site-title { font-size: 28px; margin-bottom: 20px; } .site-title a { color: #111; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .site-title.logo-title a { display: block; } .site-title img { max-width: 100%; max-height: 140px; vertical-align: middle; } .menu-toggle { position: absolute; top: 30px; left: 30px; margin: 0; font-size: 28px; color: #6a6a6a; line-height: 1; cursor: pointer; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; z-index: 99999; } .menu-toggle:hover { zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } .open-nav .menu-toggle { color: #ebebeb; } .site-description { margin-bottom: 0; font-size: 16px; font-style: italic; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } .site-description:before, .site-description:after { display: block; content: ""; width: 80px; height: 3px; margin: 0 auto; background: #eee; } .site-description:before { margin-bottom: 15px; } .site-description:after { margin-top: 15px; } .site-header .widget { margin: 15px 0 0; text-align: left; font-size: 80%; } .site-header .widget:first-of-type { margin-top: 25px; } .site-header .widget-title { font-size: 14px; text-transform: uppercase; margin-bottom: 5px; } .site-header .widget .quadro-rpost-data h4 { font-size: 14px; } .social-area { list-style: none; margin: 0; text-align: center; } .social-area.header-social-icons { position: absolute; left: 0; bottom: 40px; width: 100%; padding: 0 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .social-area li { display: inline-block; margin: 0 2px 5px; } .social-area li a i { display: block; position: relative; width: 32px; height: 32px; border: 2px solid; font-size: 13px; line-height: 32px; color: #aaa; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .social-area.footer-social-icons li a i { width: 28px; height: 28px; font-size: 12px; line-height: 28px; } .social-area li a i:hover { zoom: 1; filter: alpha(opacity=100); opacity: 1; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); z-index: 99; } .social-area.brand-color li a i { color: #fff; border: none; zoom: 1; filter: alpha(opacity=100); opacity: 1; } .brand-color .fa-dribbble { background-color: #EA4C89; } .brand-color .fa-facebook { background-color: #3B5998; } .brand-color .fa-flickr { background-color: #FF0084; } .brand-color .fa-github { background-color: #4183C4; } .brand-color .fa-google-plus { background-color: #DD4B39; } .brand-color .fa-instagram { background-color: #3F729B; } .brand-color .fa-linkedin { background-color: #3399CC; } .brand-color .fa-pinterest { background-color: #CB2027; } .brand-color .fa-skype { background-color: #00AFF0; } .brand-color .fa-tumblr { background-color: #2C4762; } .brand-color .fa-twitter { background-color: #00ACED; } .brand-color .fa-vimeo-square { background-color: #44BBFF; } .brand-color .fa-youtube { background-color: #C4302B; } .main-navigation { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 100px 30px 120px; background: #1e1f20; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-transform: translateX(-100%); -webkit-transform: translateX(-100%); -o-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; z-index: 9999; } .open-nav .main-navigation { -moz-transform: translateX(0); -webkit-transform: translateX(0); -o-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .header-search { position: absolute; left: 30px; right: 30px; bottom: 40px; background: #1E1F20; } .header-search span { color: #dedede; font-size: 11px; line-height: 10px; text-transform: uppercase; } .header-search .search-field { width: 80%; height: 30px; padding-right: 2px !important; border-color: #555; color: #ddd; font-size: 12px; } .header-search .search-field:focus { box-shadow: none; color: #ddd; } .header-search .search-submit { height: 20px; width: 20px; background: url('images/search-icon.png') no-repeat center center; background-size: contain; border: none; text-indent: -9999px; vertical-align: middle; zoom: 1; filter: alpha(opacity=50); opacity: 0.5; } /* = Navigation Menu ----------------------------------------------- */ .main-navigation ul { list-style: none; margin: 0; padding-left: 0; } .main-navigation li { position: relative; margin-bottom: 5px; } .main-navigation a { display: block; padding: 8px 0; color: #aaa; font-size: 16px; text-decoration: none; border-bottom: 1px solid #333; } .main-navigation ul ul { margin: 5px 0 0; } .main-navigation ul ul a { padding-left: 30px; } .main-navigation ul ul ul a { padding-left: 60px; } .main-navigation li:hover > a { color: #ddd; } .main-navigation li.current_page_item > a, .main-navigation li.current-menu-item > a { color: #fff; } /* Sub Menu in Larger Devices */ @media only screen and (min-width: 759px) { .site-header { overflow: visible; } .main-navigation { padding: 100px 0 120px 30px; } .main-navigation li { position: static; padding-right: 30px; } .main-navigation ul ul { position: absolute; top: 0; left: 100%; width: 100%; height: 100%; margin: 0; padding: 100px 30px 30px; background: #1f1f1f; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-box-shadow: inset 3px 0 6px 0 #191919; box-shadow: inset 3px 0 6px 0 #191919; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; visibility: hidden; } .main-navigation ul li:hover > ul { visibility: visible; } .main-navigation ul ul li { padding-right: 0; } .main-navigation ul ul a { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; zoom: 1; filter: alpha(opacity=0); opacity: 0; } .main-navigation ul li:hover > ul > li > a { zoom: 1; filter: alpha(opacity=100); opacity: 1; } .main-navigation ul ul a, .main-navigation ul ul ul a { padding-left: 0; } } /* =General Content ----------------------------------------------- */ .sticky { } .updated { display: none; } iframe.twitter-tweet { width: 100%; } /* = Pages ----------------------------------------------- */ .page-header { margin-bottom: 40px; background-size: cover; background-position: center; } .page.has-post-thumbnail .page-header { margin: -60px -60px 40px; padding: 60px; text-align: center; } .page-header.colored-header { margin: -60px -60px 40px; padding: 40px; text-align: center; } .page-inner-header { max-width: 1400px; margin: 0 auto; } .page-title { font-size: 46px; line-height: 56px; max-width: 960px; margin: 0 auto; } .page-tagline { max-width: 960px; margin: 5px auto 0; font-size: 20px; zoom: 1; filter: alpha(opacity=70); opacity: 0.7; } .page.has-post-thumbnail .page-tagline:before, .page.has-post-thumbnail .page-tagline:after, .page-header.colored-header .page-tagline:before, .page-header.colored-header .page-tagline:after { content: ""; display: inline-block; width: 30px; margin: 0 10px; border-top: 1px solid; vertical-align: middle; zoom: 1; filter: alpha(opacity=40); opacity: 0.4; } .page-breadcrumbs { display: block; max-width: 960px; margin: 30px auto 0; font-size: 12px; text-transform: uppercase; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .page.has-post-thumbnail .page-breadcrumbs, .page-header.colored-header .page-breadcrumbs { display: inline-block; background: rgba(0, 0, 0, 0.8); padding: 3px 8px; color: #eee; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .page.has-post-thumbnail .page-breadcrumbs a, .page-header.colored-header .page-breadcrumbs a { color: #aaa !important; } .page-header.colored-header .page-title, .page.has-post-thumbnail .page-header .page-title, .page-header.colored-header .page-tagline, .page.has-post-thumbnail .page-header .page-tagline, .page-header.colored-header .page-breadcrumbs, .page.has-post-thumbnail .page-header .page-breadcrumbs { margin-right: auto; margin-left: auto; } .page-content { max-width: 960px; margin: 0 auto; } .page-content *:last-child { margin-bottom: 0; } .page-footer { max-width: 960px; margin: 40px auto 0; } .error-404 .search-form { margin: 20px 0 0; } /* = Blog ----------------------------------------------- */ .blog-style-masonry, .blog-style-classic { padding: 0; background: none; } /* Blog Masonry Style */ .blog-style-masonry { float: none; width: 100% !important; max-width: 1400px; margin: 0 !important; } .blog-item { float: left; width: 50%; padding: 40px; background: #fafafa; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .entry-header { margin-bottom: 30px; text-align: center; } .blog-style-masonry .blog-container .format-image .entry-header { margin-bottom: 0; } .entry-thumbnail { position: relative; margin: 0 0 40px; min-height: 80px; overflow: visible; } .blog-style-masonry .has-post-thumbnail .entry-thumbnail, .blog-style-masonry .blog-container .format-gallery .entry-thumbnail { margin: -40px -40px 40px; } .blog-style-masonry .blog-container .format-aside .entry-thumbnail, .blog-style-masonry .blog-container .format-status .entry-thumbnail { margin: 0 0 40px; } .blog-style-masonry .blog-container .type-page .entry-thumbnail { display: none; } .blog-style-masonry .blog-container .type-page.has-post-thumbnail .entry-thumbnail { display: block; } .entry-thumbnail a { display: block; line-height: 0; } a.auto-screenshot-link { margin: -60px -60px 0; } .entry-thumbnail img { width: 100%; } .post-icon { position: absolute; top: 0; bottom: 0; left: 0; right: 0; display: inline-block; width: 80px; height: 80px; margin: auto; background: #fafafa; text-align: center; -webkit-border-radius: 60px; -moz-border-radius: 60px; border-radius: 60px; zoom: 1; filter: alpha(opacity=100); opacity: 1; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; z-index: 99; } .blog-style-masonry .format-video .post-icon { zoom: 1; filter: alpha(opacity=90); opacity: 0.9; } .blog-style-masonry .blog-container article.format-aside .post-icon, .blog-style-masonry .blog-container article.format-status .post-icon { background: rgba(0,0,0,0.1) !important; } .blog-style-masonry .blog-container .has-post-thumbnail .entry-thumbnail:hover .post-icon { zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } .blog-style-masonry .blog-container .format-gallery .entry-thumbnail:hover .post-icon, .blog-style-masonry .blog-container .format-image .entry-thumbnail:hover .post-icon { zoom: 1; filter: alpha(opacity=0); opacity: 0; } .blog-style-masonry .blog-container .format-aside .entry-thumbnail:hover .post-icon, .blog-style-masonry .blog-container .format-status .entry-thumbnail:hover .post-icon { zoom: 1; filter: alpha(opacity=100); opacity: 1; } .posted-on { display: inline-block; margin-bottom: 10px; font-size: 13px; text-transform: uppercase; } .posted-on:before, .posted-on:after { content: ""; display: inline-block; width: 20px; margin: 0 10px; border-top: 1px solid; vertical-align: middle; zoom: 1; filter: alpha(opacity=40); opacity: 0.4; } .posted-on a { color: #000; } .entry-title { font-size: 30px; line-height: 38px; margin-bottom: 0; } .entry-title a { color: #000; } .cat-links, .single-tags { display: inline-block; margin-top: 10px; font-size: 13px; text-transform: uppercase; text-align: center; zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } p.cat-links, p.single-tags { margin-bottom: 0; } .single-tags { display: block; } .cat-links a, .single-tags a { color: #000; } .entry-summary {} .readmore-link { display: block; margin: 30px 0 0; text-align: center; color: #1e1f20; } .readmore-link:hover, .more-link:hover { zoom: 1; filter: alpha(opacity=50); opacity: 0.5; } .read-more, .more-link { display: inline-block; padding: 8px 16px; font-size: 85%; font-style: italic; border: 1px solid; } /* Masonry Style: Three Columns */ @media only screen and (min-width: 1040px) { .blog-style-masonry .blog-columns-three .blog-item { width: 33.3333%; padding: 30px 20px; } .blog-style-masonry.with-sidebar .blog-item { padding: 30px 20px; } .blog-style-masonry .blog-columns-three .entry-thumbnail { margin: 0 0 20px; min-height: 60px; } .blog-style-masonry .blog-columns-three .has-post-thumbnail .entry-thumbnail, .blog-style-masonry .blog-columns-three .format-gallery .entry-thumbnail { margin: -30px -20px 20px; } .blog-style-masonry .blog-columns-three .format-aside .entry-thumbnail, .blog-style-masonry .blog-columns-three .format-status .entry-thumbnail { margin: 0 0 20px; } .blog-style-masonry .blog-columns-three a.auto-screenshot-link { margin: -30px -20px 0; } .blog-style-masonry .blog-columns-three .post-icon { width: 60px; height: 60px; } .blog-style-masonry .blog-columns-three .post-icon:before { font-size: 28px; line-height: 60px; } .blog-style-masonry .blog-columns-three .posted-on { font-size: 12px; margin-bottom: 5px; } .blog-style-masonry .blog-columns-three .entry-title { font-size: 24px; line-height: 30px; } .blog-style-masonry .blog-columns-three .type-page .entry-title { margin-bottom: 10px; } .blog-style-masonry .blog-columns-three .cat-links { margin-top: 0; } .blog-style-masonry .blog-columns-three .entry-summary { font-size: 90%; } .blog-style-masonry .blog-columns-three .readmore-link { margin: 15px 0 0; text-align: center; } .blog-style-masonry .blog-columns-three .read-more { display: inline-block; float: none; } .blog-style-masonry .blog-columns-three .archive-header { padding: 40px 4%; } .blog-style-masonry .blog-columns-three .archive-title { font-size: 28px; line-height: 36px; } .blog-style-masonry .blog-columns-three .taxonomy-description { font-size: 90%; } .blog-style-masonry .blog-columns-three .entry-header { margin-bottom: 10px; } .blog-style-masonry .blog-columns-three .format-quote .entry-header, .blog-style-masonry .blog-columns-three .format-aside .entry-header, .blog-style-masonry .blog-columns-three .format-status .entry-header { margin-bottom: 15px; } } /* Blog Classic Style */ .content-area.blog-style-classic { } .blog-style-classic article { margin-bottom: 30px; padding: 60px; background: #fff !important; } .blog-style-classic article, .blog-style-classic article .entry-title a, .blog-style-classic article .posted-on a, .blog-style-classic article .cat-links, .blog-style-classic article .cat-links a, .blog-style-classic article .single-tags a { color: #484848 !important; } .blog-style-classic article a { color: #6a6a6a !important; } .blog-style-classic blockquote, .blog-style-classic q { margin-bottom: 24px; } .blog-style-classic article .edit-link { margin-top: 10px; } /* =Post Formats ----------------------------------------------- */ .post-icon:before { font-family: 'FontAwesome'; color: #000; font-size: 42px; line-height: 80px; zoom: 1; filter: alpha(opacity=50); opacity: 0.5; } .format-standard .post-icon:before { content: '\F0F6'; } .format-quote .post-icon:before { content: '\F10E'; } .format-video .post-icon:before { content: '\F04b'; } .format-audio .post-icon:before { content: '\F025'; } .format-image .post-icon:before { content: '\F030'; } .format-gallery .post-icon:before { content: '\F06E'; } .format-status .post-icon:before { content: '\F021'; } .format-aside .post-icon:before { content: '\F0C6'; } .format-link .post-icon:before { content: '\F0C1'; } .format-chat .post-icon:before { content: '\f086'; } /* Audio */ .wp-audio-shortcode { margin-bottom: 30px; } .mejs-controls, .mejs-mediaelement, .mejs-container { background: #424547 !important; } .mejs-container { padding: 25px 0 !important; } .mejs-controls { position: relative !important; width: 92% !important; margin: auto !important; } .mejs-controls .mejs-time-rail .mejs-time-loaded { background: #aaa !important; } .mejs-controls div.mejs-horizontal-volume-slider { width: 50px !important; } .mejs-controls .mejs-button button:focus { outline: none !important; } /* Galleries */ .entry-gallery { position: relative; overflow: hidden; } .slides { list-style: none; margin: 0; } .entry-gallery .slides .gallery-item { display: none; position: relative; padding: 0; line-height: 0; } .flex-direction-nav { list-style: none; margin: 0; } .flex-direction-nav a { position: absolute; top: 0; bottom: 0; left: 20px; display: inline-block; width: 20px; height: 40px; margin: auto 0; color: #fff !important; font-size: 40px; line-height: 40px; text-align: center; text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8); text-indent: -9999px; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; z-index: 99; } .flex-direction-nav a.flex-next { left: auto; right: 20px; } .flex-direction-nav a:before { font-family: 'FontAwesome'; text-indent: 0; float: left; } .flex-direction-nav .flex-prev:before { content: "\f104";} .flex-direction-nav .flex-next:before { content: "\f105"; float: right; } .flex-direction-nav a:hover { zoom: 1; filter: alpha(opacity=100); opacity: 1; } .flex-control-nav { list-style: none; margin: 20px 0 0; text-align: center; } .flex-control-nav li { display: inline-block; margin: 0 3px; line-height: 0; } .flex-control-nav a { display: inline-block; width: 10px; height: 10px; background: #000; border: 4px solid #000; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-indent: -9999px; z-index: 99; zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } .flex-control-nav a:hover { zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } .flex-control-nav .flex-active { background: #999; } .gallery-caption { position: absolute; right: 5px; bottom: 5px; margin: 0 0 0 5px; padding: 5px 15px; background: #000; background: rgba(0,0,0,0.8); color: #fff; font-size: 11px; line-height: 1.5; text-transform: uppercase; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Link */ .blog-style-masonry .blog-container .format-link .entry-header { margin-bottom: 5px; } .the-link-url { font-size: 120%; text-align: center; margin-bottom: 0; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } /* =Grid CSS Animations - CREDITS: http://www.codrops.com ----------------------------------------------- */ @media only screen and (min-width: 760px) { .anim-grid article:not(.shown) { zoom: 1; filter: alpha(opacity=0); opacity: 0; } .anim-grid .shown, .no-js .anim-grid article, .no-cssanimations .anim-grid article, .anim-none.anim-grid article { zoom: 1; filter: alpha(opacity=100); opacity: 1; } /* Animation 3: Scale Up */ .anim-grid.anim-3 article.animate { -webkit-transform: scale(0.6); -moz-transform: scale(0.6); transform: scale(0.6); -webkit-animation: scaleUp 0.65s ease-in-out forwards; -moz-animation: scaleUp 0.65s ease-in-out forwards; animation: scaleUp 0.65s ease-in-out forwards; } @-webkit-keyframes scaleUp { to { -webkit-transform: scale(1); opacity: 1; } } @-moz-keyframes scaleUp { to { -moz-transform: scale(1); opacity: 1; } } @keyframes scaleUp { to { transform: scale(1); opacity: 1; } } /* No animations for IE */ .ie .anim-grid article { zoom: 1; filter: alpha(opacity=100); opacity: 1; -webkit-transform-style: none !important; transform-style: none !important; -webkit-transform: none !important; transform: none !important; -webkit-animation: none !important; animation: none !important; } } /* =Single Post ----------------------------------------------- */ .single-post .site-header {} .single-post .content-area, .single-attachment .content-area { max-width: 1370px; margin: 30px; padding: 60px; background: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .single-post .entry-header, .single-attachment .entry-header, .blog-style-classic article .entry-header { max-width: 740px; margin: 0 auto 40px; text-align: left; } .single-post .entry-title, .single-attachment .entry-title, .blog-style-classic article .entry-title { font-size: 52px; line-height: 62px; } .single-post .entry-meta, .single-attachment .entry-meta, .blog-style-classic article .entry-meta { margin: 20px auto 0; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .single-post .post-icon, .single-attachment .post-icon, .blog-style-classic article .post-icon { position: static; width: 26px; height: 26px; margin-right: 4px; border: 2px solid rgba(0,0,0,0.08); } .single-post .post-icon:before, .single-attachment .post-icon:before, .blog-style-classic article .post-icon:before { font-size: 13px; line-height: 26px; vertical-align: top; } .single-attachment .post-icon { display: none; } .single-post .posted-on, .single-attachment .posted-on, .blog-style-classic article .posted-on { margin: 0; } .single-post .posted-on:before, .single-post .posted-on:after, .single-attachment .posted-on:before, .single-attachment .posted-on:after, .blog-style-classic article .posted-on:before, .blog-style-classic article .posted-on:after { display: none; } .single-post .posted-on a, .single-attachment .posted-on a, .blog-style-classic article .posted-on a { color: #000 !important; } .byline { display: inline-block; margin: 0 20px; text-transform: uppercase; font-size: 13px; } .single-post .entry-meta .avatar, .single-attachment .entry-meta .avatar, .blog-style-classic article .entry-meta .avatar { width: 30px; margin-right: 5px; vertical-align: -9px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } .single-post .cat-links, .single-post .single-tags, .single-attachment .cat-links, .single-attachment .single-tags, .blog-style-classic article .cat-links, .blog-style-classic article .single-tags { margin: 0; zoom: 1; filter: alpha(opacity=100); opacity: 1; } .single-post .cat-links, .single-attachment .cat-links, .blog-style-classic article .cat-links { text-align: left; } .single-post .has-post-thumbnail .entry-thumbnail, .single-attachment .has-post-thumbnail .entry-thumbnail, .blog-style-classic article .entry-thumbnail { margin: 0 -60px 30px; } .single-post .entry-content, .single-attachment .entry-content, .blog-style-classic article .entry-content { max-width: 740px; margin: 0 auto 40px; } .entry-content *:last-child { margin-bottom: 0; } .single-post .entry-footer, .single-attachment .entry-footer, .blog-style-classic article .entry-footer { text-align: center; margin: 0 auto; } .single-post .single-tags, .single-attachment .single-tags { max-width: 740px; margin: 0 auto 40px; } .edit-link { display: inline-block; padding: 3px 10px; font-size: 85%; font-style: italic; border: 1px solid #000; color: #000 !important; zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } .single-post .edit-link, .single-attachment .edit-link { margin-bottom: 40px; } .edit-link a { color: #000 !important; } .author-box { position: relative; } .inner-author { max-width: 740px; margin: 0 auto; } /* =Media ----------------------------------------------- */ .page-content img.wp-smiley, .entry-content img.wp-smiley, .comment-content img.wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } .wp-caption { max-width: 100%; line-height: 0; } .wp-caption-text { position: absolute; left: 5px; bottom: 5px; max-width: 80%; margin: 0; padding: 5px 4%; background: #000; background: rgba(0,0,0,0.8); color: #fff; text-align: left; font-size: 11px; line-height: 1.2; } .wp-caption .wp-caption-text { position: static; display: block; max-width: 100%; margin: 10px 0 12px !important; padding: 0; background: none; color: #000; font-size: 12px; text-align: center; font-style: italic; } .site-content .gallery { float: left; width: 100%; margin-bottom: 30px; text-align: center; } .gallery-item { position: relative; float: left; padding: 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .gallery-columns-1 .gallery-item { width: 100%; } .gallery-columns-2 .gallery-item { width: 50%; } .gallery-columns-3 .gallery-item { width: 33.33333%; } .gallery-columns-4 .gallery-item { width: 25%; } .gallery-columns-5 .gallery-item { width: 20%; } .gallery-columns-6 .gallery-item { width: 16.6666%; } .gallery-columns-7 .gallery-item { width: 14.2857%; } .gallery-columns-8 .gallery-item { width: 12.5%; } .gallery-columns-9 .gallery-item { width: 11.1111%; } div.gallery-icon { line-height: 0; } .gallery-item a { display: block; background: #000; } .gallery-item a img { width: 100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .gallery-item a:hover img { zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } /* Make sure embeds and iframes fit their containers */ embed, iframe, object { max-width: 100%; } /* =Post & Page Navigation ----------------------------------------------- */ .post-navigation, .paging-navigation { margin: 0 -60px; background: #ddd; height: 200px; overflow: hidden; } .content-area .site-main .post-navigation:last-child { margin-bottom: -60px; } .paging-navigation { max-width: 1400px; margin: 0 auto; background: none; } .comment-navigation { margin-bottom: 40px; } .post-navigation .nav-previous, .paging-navigation .nav-previous, .post-navigation .nav-next, .paging-navigation .nav-next { position: relative; float: left; width: 50%; height: 200px; background: #000; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .paging-navigation .nav-previous, .paging-navigation .nav-next { background: #f5f5f5; } .paging-navigation .nav-next { border-left: 1px solid #dedede; } .paging-navigation .nav-previous:hover, .paging-navigation .nav-next:hover { background: #eee; } .paging-navigation .nav-links .nav-previous:only-child, .paging-navigation .nav-links .nav-next:only-child { width: 100%; } .comment-navigation .nav-previous, .comment-navigation .nav-next { float: left; width: 50%; } .post-navigation a, .paging-navigation a { display: block; font-size: 90%; line-height: 0; } .comment-navigation a { display: inline-block; padding: 8px 10px; background: #eee; background: rgba(0,0,0,0.05); font-size: 90%; } .comment-navigation a:hover { zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } .post-navigation a img { width: 100%; zoom: 1; filter: alpha(opacity=50); opacity: 0.5; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .post-navigation a:hover img { zoom: 1; filter: alpha(opacity=30); opacity: 0.3; } .post-navigation .meta-nav, .paging-navigation .meta-nav { position: absolute; left: 0; top: 0; bottom: 0; width: 100%; height: 100px; margin: auto; padding: 30px; text-align: center; color: #fff; line-height: 1.5; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .post-navigation .meta-nav { height: 120px; } .paging-navigation .meta-nav { color: #000; } .meta-nav strong { display: block; font-size: 85%; text-transform: uppercase; } .meta-nav .fa { font-size: 90%; } .nav-previous .fa { margin-right: 5px; } .nav-next .fa { margin-left: 5px; } /* Post w/Pagination */ .page-links { font-size: 80%; text-transform: uppercase; text-align: center; letter-spacing: 1px; } .page-links a { display: inline-block; border-bottom: 1px solid; } /* =Comments ----------------------------------------------- */ .comments-area { width: 100%; max-width: 740px; margin: 60px auto 0; } .comments-title { margin-bottom: 40px; font-size: 24px; text-align: center; } .comments-title:after, .comments-title:before { content: ""; display: inline-block; width: 30px; margin: 0 10px; border-top: 1px solid; vertical-align: middle; zoom: 1; filter: alpha(opacity=40); opacity: 0.4; } .comments-area ol { list-style: none; margin: 30px 0 40px; } .comment-list li.pingback { margin-bottom: 20px; padding-left: 10px; border-left: 2px solid #DEDEDE; } .comment-list li.pingback .comment-body { font-style: 90%; } .comment-list li.pingback a { display: block; } .bypostauthor {} .comment-list article { position: relative; min-height: 100px; margin-bottom: 30px; padding-left: 100px; } .comment-meta { line-height: 22px; } .comment-author { float: left; width: 44%; } .comment-author img { position: absolute; left: 0; top: 0; width: 80px; height: 80px; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; } .comment-author cite { display: inline-block; font-size: 100%; font-style: normal; font-weight: normal; } .comment-metadata { float: right; width: 54%; text-align: right; font-size: 80%; } .comment-metadata a { color: #000 !important; } .comment-metadata .edit-link { margin: 0 0 0 10px; } .comment-awaiting-moderation { float: right; font-size: 90%; font-style: italic; } .comment-content { clear: both; width: 100%; margin: 15px 0; font-size: 95%; } .comment-content p { margin-bottom: 5px; } .comment-reply-link, .cancel-comment-reply-link { display: inline-block; padding: 3px 10px; font-size: 85%; font-style: italic; border: 1px solid #000; color: #000 !important; zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } .cancel-comment-reply-link { font-size: 65%; } .comment-list .children { list-style: none; margin: 20px 0 0 60px; } .comment-respond {} .comment-reply-title { margin-bottom: 5px; font-size: 22px; text-align: center; } .comment-reply-title:after, .comment-reply-title:before { content: ""; display: inline-block; width: 30px; margin: 0 10px; border-top: 1px solid; vertical-align: middle; zoom: 1; filter: alpha(opacity=40); opacity: 0.4; } .logged-in-as, .comment-notes { font-size: 80%; text-align: center; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } p.comment-subscription-form { margin-bottom: 0; font-size: 80%; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } .comment-content a { word-wrap: break-word; } /* =Jetpack Support ----------------------------------------------- */ /* Tiled Galleries */ .tiled-gallery {} .tiled-gallery-item {} .tiled-gallery-caption { bottom: 2px !important; left: 2px !important; right: 2px !important; width: auto !important; background: #111 !important; background: rgba(0,0,0,0.8) !important; color: #fff !important; text-align: center; } /* Sharing Buttons & Related Posts */ div.sharedaddy { margin: 40px 0; text-align: center; } div.sharedaddy h3.sd-title, div#jp-relatedposts h3.jp-relatedposts-headline { font-size: 22px !important; margin-bottom: 20px !important; font-weight: normal !important; } div.sharedaddy h3.sd-title:before, div.sharedaddy h3.sd-title:after, div#jp-relatedposts h3.jp-relatedposts-headline:after, div#jp-relatedposts h3.jp-relatedposts-headline:before { content: ""; display: inline-block !important; width: 30px !important; margin: 0 10px !important; border-top: 1px solid !important; vertical-align: middle; zoom: 1; filter: alpha(opacity=40); opacity: 0.4; } .sharedaddy .sd-content ul { margin: 0 !important; } div#jp-relatedposts { margin: 40px auto; padding: 0; text-align: left; } div#jp-relatedposts h3.jp-relatedposts-headline { width: 100%; text-align: center; } div#jp-relatedposts h3.jp-relatedposts-headline em { font-weight: normal !important; } div#jp-relatedposts h3.jp-relatedposts-headline em:before { display: none !important; } div#jp-relatedposts div.jp-relatedposts-items-visual { margin: 0 !important; } div#jp-relatedposts div.jp-relatedposts-items-visual .jp-relatedposts-post { zoom: 1; filter: alpha(opacity=100) !important; opacity: 1 !important; } div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post { width: 32.5% !important; margin: 0 1.25% 0 0 !important; padding: 8px !important; background: #F5F5F5; } div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post:nth-of-type(3n) { margin-right: 0 !important; } div#jp-relatedposts div.jp-relatedposts-items-visual .jp-relatedposts-post img.jp-relatedposts-post-img { width: 100% !important; margin-bottom: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } div#jp-relatedposts div.jp-relatedposts-items-visual .jp-relatedposts-post img.jp-relatedposts-post-img:hover { zoom: 1; filter: alpha(opacity=90); opacity: 0.9; } div#jp-relatedposts div.jp-relatedposts-items-visual h4.jp-relatedposts-post-title, .jp-relatedposts-post-title { font-size: 16px !important; line-height: 1.3 !important; } div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-title a { color: #666 !important; text-decoration: none !important; } div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-title a:hover { color: #222 !important; text-decoration: none !important; } div#jp-relatedposts div.jp-relatedposts-items p { margin-top: 5px !important; } div#jp-relatedposts div.jp-relatedposts-items p.jp-relatedposts-post { margin-top: 0 !important; } div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-context { display: inline-block; font-size: 12px !important; text-transform: uppercase; padding: 1px 6px; background: #000; color: #fff; zoom: 1; filter: alpha(opacity=80) !important; opacity: 0.8 !important; } span.jp-relatedposts-post-context, div#jp-relatedposts div.jp-relatedposts-items p.jp-relatedposts-post-context { margin-top: 8px !important; } @media only screen and (max-width: 759px) { div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post { width: 49.4% !important; margin: 0 1.2% 10px 0 !important; } div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post:nth-of-type(3n) { margin-right: 1.2% !important; } div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post:nth-of-type(2n) { margin-right: 0 !important; } } @media only screen and (max-width: 519px) { div#jp-relatedposts div.jp-relatedposts-items-visual { margin-right: 0 !important; } div#jp-relatedposts div.jp-relatedposts-items-visual .jp-relatedposts-post { width: 100% !important; margin: 0 0 15px 0 !important; } } /* Widgets: Subscription - Facebook box */ #subscribe-email, #subscribe-submit { margin-bottom: 0; padding: 15px 10px 0; background: #f5f5f5; text-align: center; } #subscribe-email input { background: #fff; } #subscribe-submit { padding: 10px 10px 15px; } .widget_facebook_likebox iframe { padding: 5px; border: 1px solid #dedede !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* =Archive & Search Results ----------------------------------------------- */ .archive-header { padding: 40px 4%; } .blog-style-classic .archive-header { position: static; float: none; width: 100%; margin-bottom: 30px; padding: 40px 60px; } .archive-title, .blog-style-classic .archive-title { margin-bottom: 0; font-size: 34px; line-height: 42px; } .archive-title span { zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } .taxonomy-description, .blog-style-classic .taxonomy-description { margin-top: 2px; font-size: 100%; zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } .taxonomy-description p { margin-bottom: 0; } .archive.author .archive-title { text-indent: -9999px; height: 0; } .author-box { position: relative; } .inner-author { max-width: 740px; margin: 0 auto; } .archive-header .author-box { text-align: center; } .archive-header .author-name { margin: 0; } .author-name .avatar { position: absolute; top: 0; left: 0; width: 80px; padding: 4px; background: rgba(255, 255, 255, 0.3); -webkit-border-radius: 60px; -moz-border-radius: 60px; border-radius: 60px; } .ie .author-name .avatar { padding: 0 !important; } .archive-header .author-name .avatar { position: static; width: 100px; margin-bottom: 5px; } .author-name h3 { margin: 0; font-size: 22px; line-height: 26px; } .author-name h3 a { color: #232527 !important; } .archive-header .author-bio, .archive-header .author-extras { margin: 15px 0 0; } .author-bio { font-size: 80%; } .author-extras { margin-bottom: 15px; } .author-extras a { display: inline-block; width: 24px; margin-right: 5px; line-height: 24px; text-align: center; background: #222; background: rgba(0, 0, 0, 0.4); color: #fff !important; font-size: 11px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } .author-extras a:hover { zoom: 1; filter: alpha(opacity=100); opacity: 1; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); z-index: 99; } .search-results .type-page .entry-meta { display: none; } /* =Footer ----------------------------------------------- */ .site-footer { float: right; width: 78%; padding: 40px 0 30px; background: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .inner-footer, .bottom-footer { max-width: 1288px; padding: 0 4%; } .site-info { float: left; display: inline-block; margin-top: 5px; font-size: 12px; } .footer-social-icons { float: right; } /* =Widgetized Layouts ----------------------------------------------- */ .widg-layout2 { float: left; width: 31.333333%; margin-left: 3%; } .widg-layout2:first-child { margin-left: 0; } .widg-layout5 { float: left; width: 48.5%; } .widg-layout5:first-child { margin-right: 3%; } .widg-layout6 { width: 100%; } .widg-layout2, .widg-layout5, .widg-layout6 { min-height: 1px; } /* =Widgets & Sidebar ----------------------------------------------- */ .widget { margin: 0 0 60px; font-size: 85%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .widget-title { font-size: 22px; margin-bottom: 30px; } .widget ul { list-style: none; margin: 0; } .widget ul li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #dedede; } .widget ul li a { display: inline-block; } .widget ul li a:hover { zoom: 1; filter: alpha(opacity=70); opacity: 0.7; } .widget .children, .widget .sub-menu { margin-top: 10px; padding-left: 20px; border-left: 1px solid #dedede; } .widget .children li, .widget .sub-menu li { border: none; } /* Make sure select elements fit in widgets */ .widget select { width: 100%; max-width: 100%; } /* Search Widget */ .widget_search .search-field { float: left; width: 60%; height: 40px; border-color: #dedede; } .widget_search .search-submit { float: right; width: 38%; height: 40px; white-space: nowrap; } /* Recent Posts Widget */ .widget_recent_entries li .post-date { display: block; font-size: 80%; text-transform: uppercase; } /* Recent Comments Widget */ .recentcomments a:last-child { display: block !important; width: 100%; } /* Tags Widget */ .tagcloud a { display: inline-block; margin: 0 0 5px; text-transform: uppercase; font-size: 80% !important; } .tagcloud a:after { content: "\2022"; margin: 0 10px; } .tagcloud a:last-of-type:after { display: none; } /* Calendar Widget */ #calendar_wrap { padding: 20px; border: 1px solid #dedede; } .widget_calendar table { margin-bottom: 0; } .widget_calendar caption { margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #dedede; text-transform: uppercase; font-size: 95%; } .widget_calendar thead th, .widget_calendar tbody td { text-align: center; } .widget_calendar tfoot tr a { display: block; margin-top: 10px; text-transform: uppercase; font-size: 90%; } td#next { text-align: right; } /* RSS Widget */ .widget a.rsswidget { display: block; font-size: 18px; } .rss-date { font-size: 12px; zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } .rssSummary { margin-top: 10px; } .widget_rss cite { display: block; margin-top: 5px; font-weight: bold; } /* Quadro Widgets */ .widget-image-container { padding: 5px; border: 1px solid #dedede; line-height: 0; } .quadro-video-widget iframe { padding: 5px; border: 1px solid #dedede; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .quadro-rpost-thumb-link { display: block !important; } .quadro-rpost img { float: left; width: 20%; margin-right: 3%; padding: 3px; border: 1px solid #dedede; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .quadro-rpost-data { float: left; width: 77%; } .quadro-rpost-data h4 { font-size: 16px; line-height: 1.3; margin-bottom: 5px; } .quadro-rpost-data p { margin-bottom: 0; font-size: 80%; text-transform: uppercase; } .quadro-feat-post { position: relative; } .quadro-feat-post-data { position: absolute; bottom: 0; left: 0; width: 100%; padding: 15px; background: rgba(0,0,0,0.7); color: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; z-index: 1; } .quadro-feat-post-data a { color: #fff !important; } .quadro-feat-post-data h4 { display: inline; margin-bottom: 5px; font-size: 18px; line-height: 24px; } .quadro-feat-post-data .meta { display: inline; margin: 0; font-size: 12px; text-transform: uppercase; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; } .quadro-feat-post-data .meta:before { content: "\2044"; margin: 0 3px; } .quadro-feat-post-thumb-link { display: block; line-height: 0; } .quadro-feat-post-thumb-link:hover { zoom: 1; filter: alpha(opacity=90); opacity: 0.9; } .quadro-feat-post-thumb-link img { width: 100%; } .widget_quadro_twitter_widget .follow-section { margin-top: 5px; text-align: center; } .widget_quadro_twitter_widget .twitter-feed { clear: both; } .widget_quadro_twitter_widget .twitter-feed li { position: relative; } .tweet-avatar-link { line-height: 0; vertical-align: middle; } .tweet-avatar-link img { width: 30px; padding: 2px; border: 1px solid #dedede; } .widget_quadro_twitter_widget .tweet { display: inline; } .tweet-author-link { padding-right: 40px; } .tweet-author-link h5 { display: inline; margin-right: 5px; font-size: 100%; } .tweet-author-link span { font-size: 90%; } .tweet-date-link { position: absolute; top: 0; right: 0; font-size: 11px; line-height: 30px; } .tweet-content { margin-top: 5px; } .widget_quadro_twitter_widget .tweet-actions { margin-top: 5px; font-size: 12px; } .widget_quadro_twitter_widget .tweet-actions a { display: inline; padding: 0 5px; color: #888; } .widget_quadro_twitter_widget .tweet-actions a:hover { color: #222; } /* =Infinite Scroll ----------------------------------------------- */ /* Globally hidden elements when Infinite Scroll is supported and in use. */ .infinite-scroll .paging-navigation, /* Older / Newer Posts Navigation (always hidden) */ .infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */ display: none; } /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */ .infinity-end.neverending .site-footer { display: block; } /* =Media Queries - Responsive ----------------------------------------------- */ @media only screen and (min-width: 1700px) { .site-header { width: 20%; } .site-content, .site-footer { width: 80%; } .site-footer { float: left; max-width: 1400px; margin-left: 20%; } } @media only screen and (max-width: 1040px) { .site-header { width: 30%; } .site-content, .site-footer { width: 70%; } .blog-item { padding: 40px 20px 40px; } .entry-thumbnail { margin: 0 0 40px; min-height: 60px; } .blog-style-masonry .has-post-thumbnail .entry-thumbnail, .blog-style-masonry .blog-container .format-gallery .entry-thumbnail { margin: -40px -20px 40px; } .post-icon { width: 60px; height: 60px; } .post-icon:before { font-size: 28px; line-height: 60px; } .archive-header { padding: 30px 40px; } .gallery-item { width: 100% !important; } /* Widget Layouts */ .widg-layout2 { width: 100%; margin: 0; } .site-info { width: 100%; margin-bottom: 15px; text-align: center; } .footer-social-icons { width: 100%; } } @media only screen and (max-width: 910px) { .content-area, .single-post .content-area { width: 92%; margin: 30px 4%; } .blog-item { width: 100%; } .post-navigation, .post-navigation .nav-previous, .post-navigation .nav-next, .paging-navigation, .paging-navigation .nav-previous, .paging-navigation .nav-next { height: 150px; } .post-navigation .meta-nav { padding: 0 30px; } } @media only screen and (max-width: 759px) { .site-header, .site-content, .site-footer { width: 100% !important; margin: 0 !important; } .site-header { position: relative; height: auto; padding: 60px 20px 40px; -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15); box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15); overflow: visible; } .site-header .site-branding .avatar { width: 60px; margin: 0 10px 20px 0; vertical-align: middle; } .site-header .site-title { display: inline-block; margin: 0 0 20px; vertical-align: middle; } .menu-toggle { top: 20px; left: auto; right: 20px; } .main-navigation { height: auto; padding: 20px 60px 20px 20px; line-height: 1.5; -moz-transform: translateY(-100%); -webkit-transform: translateY(-100%); -o-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); } .open-nav .main-navigation { min-height: 100%; height: auto; -moz-transform: translateY(0); -webkit-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .header-search { position: static; width: 100%; margin-top: 20px; } .site-header .widget { display: none; } .social-area.header-social-icons { position: static; margin-top: 20px; padding: 0; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } .single-post .entry-title, .single-attachment .entry-title, .blog-style-classic article .entry-title { font-size: 44px; line-height: 54px; } .single-post .cat-links, .single-attachment .cat-links, .blog-style-classic article .cat-links { width: 100%; margin: 10px 0 0; } .comment-list article { padding: 0px; margin-bottom: 40px; } .comment-meta { padding-left: 70px; min-height: 60px; } .comment-author { width: 100%; } .comment-author img { width: 60px; height: 60px; } .comment-content { margin-top: 10px; } .comment-metadata { display: block; float: none; clear: both; width: 100%; text-align: left; } .comment-metadata a { display: block; } .comment-metadata .edit-link { margin: 5px 0 0; } .comment-list ul.children { margin-left: 0; } /* Blog & Archives */ .blog-item { width: 100%; } .blog-container .format-gallery .entry-thumbnail .post-icon { zoom: 1; filter: alpha(opacity=0); opacity: 0; } } @media only screen and (max-width: 519px) { body { font-size: 20px !important; } .alignleft, .alignright, .aligncenter { width: 100%; display: block; margin: 0 0 20px; } .site-header { padding: 20px; } .site-header .inner-header { max-width: none; } .site-header .site-title { margin-bottom: 10px !important; } .site-header .site-title img { max-width: 180px; max-height: 90px; } .site-header .site-description:before { margin-bottom: 10px; } .site-header .site-description:after { margin-top: 10px; } .social-area.header-social-icons { margin-top: 10px; } .content-area, .single-post .content-area, .single-attachment .content-area, .blog-style-classic article { padding: 40px 20px !important; } .content-area.blog-style-masonry, .content-area.blog-style-classic { padding: 0 !important; } .page.has-post-thumbnail .page-header { padding: 40px 20px; margin: -40px -20px 40px; } .page-header.colored-header { margin: -40px -20px 30px; } .page-tagline:before, .page-tagline:after { display: none !important; } .single-post .entry-header, .single-attachment .entry-header, .blog-style-classic article .entry-header { margin-bottom: 20px; } .byline { width: 100%; margin: 10px 0 0; } .single-post .has-post-thumbnail .entry-thumbnail, .single-attachment .has-post-thumbnail .entry-thumbnail, .blog-style-classic article .entry-thumbnail { margin: 0 -20px 20px; } .archive-header { padding: 30px 20px !important; } /* Post & Page Navigation */ .post-navigation { margin: 0 -20px; height: auto; } .paging-navigation { margin: 0; height: auto; } .content-area .site-main .post-navigation:last-child { margin-bottom: -40px; } .post-navigation .nav-previous, .post-navigation .nav-next, .paging-navigation .nav-previous, .paging-navigation .nav-next { width: 100%; } .paging-navigation .nav-next { border: none; border-top: 1px solid #dedede; } .post-navigation .nav-previous, .post-navigation .nav-next { height: 180px; } .comments-title:before, .comments-title:after, .comment-reply-title:before, .comment-reply-title:after, .posted-on:before, .posted-on:after { width: 15px; margin: 0 5px; } /* Footer */ .site-footer { padding: 40px 0 30px; } /* Widget Layouts */ .widg-layout5 { width: 100%; margin: 0; } }