/* Theme Name: Fashionistas Theme URI: https://athemes.com/theme/fashionista Author: aThemes Author URI: https://athemes.com Description: Fashionistas is a bold and fun theme built on Bootstrap, suitable for magazine style blogs. Version: 1.9 License: GNU General Public License v3.0 License URI: license.txt Text Domain: fashionistas Tags: two-columns, threaded-comments, full-width-template, custom-menu */ /* Global ----------------------------------------------- */ body { color: #333; font-weight: 400; font-family: Georgia, "Times New Roman", Times, serif; line-height: 1.8; background: #fff; } /* Headings */ h1, h2, h3, h4, h5, h6 { margin: 1.25em 0 .5em; font-weight: 400; font-family: Oswald, Arial, Helvetica, sans-serif; line-height: 1.2em; } h1 { font-size: 16px; font-size: 1.6rem; } h2 { font-size: 14px; font-size: 1.4rem; } h3 { font-size: 13px; font-size: 1.3rem; } h4 { font-size: 12px; font-size: 1.2rem; } h5 { font-size: 11px; font-size: 1.1rem; } h6 { font-size: 10px; font-size: 1rem; } /* Links */ a { color: #1fa0ae; outline: none; -webkit-transition: all 0.14s ease 0s; -moz-transition: all 0.14s ease 0s; -o-transition: all 0.14s ease 0s; } a:visited { color: #1fa0ae; } a:hover, a:focus, a:active { color: #333; } /* Text Elements */ blockquote p { line-height: 1.6; } dd { margin-bottom: 1em; } /* Forms */ select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { height: 26px; color: #333; line-height: 26px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } textarea { width: 80%; height: auto; } textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus { border-color: #d6d6d6; outline: 0; outline: thin dotted \9; /* IE6-9 */ -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } button, input[type="button"], input[type="reset"], input[type="submit"] { padding: 4px 15px; color: #fff; font-size: 1.2em; font-weight: 300; font-family: Oswald, Arial, Helvetica, sans-serif; line-height: 26px; text-transform: uppercase; background: #333; border: solid #666; border-width: 0 0 3px; } button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { background: #666; border-color: #333; } /* Tables */ table { width: 100%; margin-bottom: 20px; } table th, table td { padding: 8px; line-height: 20px; text-align: left; vertical-align: top; border-top: 1px solid #ddd; } table th { font-weight: bold; } table thead th { vertical-align: bottom; } table caption + thead tr:first-child th, table caption + thead tr:first-child td, table colgroup + thead tr:first-child th, table colgroup + thead tr:first-child td, table thead:first-child tr:first-child th, table thead:first-child tr:first-child td { border-top: 0; } table tbody + tbody { border-top: 2px solid #ddd; } /* Make sure embeds and iframes fit their containers */ embed, iframe, object { max-width: 100%; } /* Alignment */ .alignleft { display: inline; float: left; margin: 0 1.5em 1.5em 0; } .alignright { display: inline; float: right; margin: 0 0 1.5em 1.5em; } .aligncenter { clear: both; display: block; margin: 0 auto; } /* Text meant only for screen readers */ .screen-reader-text { position: absolute !important; clip: rect(1px, 1px, 1px, 1px); } .screen-reader-text:hover, .screen-reader-text:active, .screen-reader-text:focus { top: 0; left: 0; width: auto; height: auto; display: block; clip: auto !important; line-height: normal; text-decoration: none; z-index: 100000; /* Above WP toolbar */ } /* Clearing */ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix { display: inline-block; } * html .clearfix { height: 1%; } *:first-child+html .clearfix { min-height: 1px; } .clearfix { display: block; } .clear { clear: both; } /* HEADER ----------------------------------------------- */ .site-header { padding: 40px 0 20px; } .site-branding { float: left; } .site-title { margin: 0; font-size: 30px; font-size: 3rem; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; line-height: 1em; } .site-title a { color: #333; text-decoration: none; } .site-description { color: #a6a6a6; font-weight: 300; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: 2px; } /* MENU ----------------------------------------------- */ .sf-menu ul:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .sf-menu ul { display: inline-block; } * html .sf-menu ul { height: 1%; } *:first-child+html .sf-menu ul { min-height: 1px; } .sf-menu ul { display: block; } .sf-menu ul { margin: 0; padding: 0; list-style: none; } .sf-menu li ul { top: -999em; position: absolute; z-index: 900; } .sf-menu li:hover ul, .sf-menu li.sfHover ul { top: 40px; } .sf-menu li:hover li ul, .sf-menu li.sfHover li ul { top: -999em; } .sf-menu li li:hover ul, .sf-menu li li.sfHover ul { top: 0; left: 170px; } .sf-menu li li:hover li ul, .sf-menu li li.sfHover li ul { top: -999em; } .sf-menu li li li:hover ul, .sf-menu li li li.sfHover ul { top: 0; left: 170px; } .sf-menu li { float: left; position: relative; visibility: inherit; } .sf-menu li a { float: left; display: block; font-weight: 400; font-family: Oswald, Arial, Helvetica, sans-serif; text-decoration: none; text-transform: uppercase; } .sf-menu li a:hover, .sf-menu li.sfHover > a, .sf-menu li.current_page_item > a, .sf-menu li.current-menu-item > a, .sf-menu li.current-menu-parent > a, .sf-menu li.current-page-parent > a, .sf-menu li.current-page-ancestor > a, .sf-menu li.current_page_ancestor > a { } .sf-menu li:hover li a, .sf-menu li.sfHover li a { width: 140px; } #top-navigation { background: #333; } #top-navigation ul { border-left: 1px dotted #565656; } #top-navigation li ul { } #top-navigation li:hover ul, #top-navigation li.sfHover ul { top: 40px; background: #333; border-left: none; border-top: 1px dotted #565656; } #top-navigation li li:hover ul, #top-navigation li li.sfHover ul { top: -1px; border-left: 1px dotted #565656; } #top-navigation li { border-right: 1px dotted #565656; } #top-navigation li li { border-right: none; border-bottom: 1px dotted #565656; } #top-navigation li a { padding: 0 15px; color: #a6a6a6; font-size: .9em; line-height: 40px; } #top-navigation li a:hover, #top-navigation li.sfHover > a, #top-navigation li.current_page_item > a, #top-navigation li.current-menu-item > a, #top-navigation li.current-menu-parent > a, #top-navigation li.current-page-parent > a, #top-navigation li.current-page-ancestor > a, #top-navigation li.current_page_ancestor > a { color: #fff; } #top-navigation li:hover li a, #top-navigation li.sfHover li a { padding: 10px 15px; font-size: .75em; line-height: normal; } #main-navigation { border: solid #333; border-width: 1px 0 3px; } #main-navigation li a { padding: 0 20px; color: #333; font-size: 1.2em; line-height: 50px; letter-spacing: 1px; } #main-navigation .sf-menu > ul > li:after { width: 6px; float: left; margin-top: 16px; content: "/"; display: block; color: #e6e6e6; font-size: 1.8em; font-family: Arial, Helvetica, sans-serif; } #main-navigation .sf-menu > ul > li:last-child:after { display: none; } #main-navigation li:hover ul, #main-navigation li.sfHover ul { top: 50px; background: #333; } #main-navigation li li:hover ul, #main-navigation li li.sfHover ul { top: -1px; border-left: 1px dotted #565656; } #main-navigation li li { border-bottom: 1px dotted #565656; } #main-navigation li li a { color: #a6a6a6; } #main-navigation li a:hover, #main-navigation li.sfHover > a, #main-navigation li.current_page_item > a, #main-navigation li.current-menu-item > a, #main-navigation li.current-menu-parent > a, #main-navigation li.current-page-parent > a, #main-navigation li.current-page-ancestor > a, #main-navigation li.current_page_ancestor > a { color: #1fa0ae; } #main-navigation li:hover li a, #main-navigation li.sfHover li a { padding: 10px 20px; font-size: .75em; line-height: normal; } /* Small Navigation */ .nav-open, .nav-close { display: none; color: #333; font-size: 1.2em; font-weight: 400; font-family: Oswald, Arial, Helvetica, sans-serif; text-decoration: none; text-transform: uppercase; line-height: 50px; letter-spacing: 1px; } @media only screen and (max-width: 60em) { .nav-open { display: inline-block; } #main-navigation:target > .nav-open { display: none; } #main-navigation:target > .nav-close { display: inline-block; } #main-navigation > .sf-menu { position: relative; text-align: left; } #main-navigation > .sf-menu > ul { position: absolute; top: 0; left: 0; width: 100%; max-height: 0; max-width: 16em; overflow: hidden; background: #333; } #main-navigation:target > .sf-menu > ul { max-height: 900px; max-width: 100%; z-index: 901; } #main-navigation > .sf-menu > ul > li { float: none; display: block; border-bottom: 1px dotted #565656; } #main-navigation > .sf-menu ul li:only-child { border-top: 1px dotted #565656; } #main-navigation > .sf-menu ul li:last-child { border-bottom: none; } #main-navigation > .sf-menu > ul > li:after { display: none; } #main-navigation li a { float: none; display: block; color: #fff; } #main-navigation li li:hover ul, #main-navigation li li.sfHover ul { border-left: none; } ul.sub-menu li { float: none; display: block; z-index: 902; } .sf-menu li ul { top: -999em; position: static; z-index: 900; } } /* LAYOUT ----------------------------------------------- */ .container { width: 980px; } .content-area { width: 100%; float: left; } .site-content { margin: 0 340px 0 0; } .site-sidebar { width: 300px; float: left; margin: 0 0 0 -300px; } /* CONTENT ----------------------------------------------- */ .site-main { padding: 40px 0; } .site-content li { margin: 0 0 .75em; } .site-content ul ul, .site-content ul ol, .site-content ol ol, .site-content ol ul { margin-top: .75em; } .sticky { } .hentry { margin: 0 0 40px; -ms-word-wrap: break-word; word-wrap: break-word; } .entry-header { margin: 0 0 1.25em; text-align: center; } .entry-title { margin: 0 40px; font-size: 16px; font-size: 1.6rem; line-height: 1.4; text-transform: uppercase; } .entry-title a { color: #333; text-decoration: none; } .entry-title a:hover { color: #1fa0ae; } .entry-meta { color: #a6a6a6; font-size: .9em; font-weight: 300; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; } .entry-meta a { color: #a6a6a6; text-decoration: none; } .entry-meta a:hover { color: #333; } .entry-meta .cat-links { margin: 0 20px 0 0; } .entry-meta [class^="ico-"]:before { margin-right: 5px; color: #333; } .comments-link:before, .author.vcard:before { margin: 0 0 0 8px; padding: 0 6px 0 0; content: "/"; color: #d6d6d6; } .entry-thumbnail { margin: 0 0 20px; } .entry-thumbnail img { display: block; } .entry-content { margin: 0 0 30px; } .entry-summary { margin: 0 0 30px; } .entry-footer { clear: both; padding: 8px 0; border: solid #333; border-width: 1px 0 3px; } .more-link, .page-links { margin: 15px 0 0; display: block; text-align: center; } .post-password-required label { float: left; margin: 0 10px 0 0; } .page-header { margin: 0 0 30px; border-bottom: 3px solid #333; } .page-title { margin: 0 0 10px; color: #a6a6a6; font-size: 1.2em; text-transform: uppercase; letter-spacing: 2px; } body.page .entry-header { text-align: left; } body.page .entry-title { margin: 0; } body.search .page .entry-footer { padding: 0; border-top: none; } /* Author Box */ .author-info { margin: 0 0 40px; padding: 0 0 30px; border-bottom: 1px solid #333; } .author-info .author-photo { float: left; margin: 0 30px 0 0; } .author-info .author-content { margin: 0 0 0 105px; } .author-info .author-content h3 { margin: 0 0 10px; font-size: 1.2em; text-transform: uppercase; letter-spacing: 1px; } .author-info .author-links a { margin: 0 20px 0 0; color: #a6a6a6; font-size: .9em; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; text-decoration: none; letter-spacing: 2px; } .author-info .author-links a:hover { color: #333; } /* Media ----------------------------------------------- */ .page-content img.wp-smiley, .entry-content img.wp-smiley, .comment-content img.wp-smiley { margin-bottom: 0; margin-top: 0; padding: 0; border: none; } .wp-caption { border: 1px solid #d5d5d5; margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin: 1.2% auto 0; max-width: 98%; } .wp-caption-text { text-align: center; } .wp-caption .wp-caption-text { margin: .5em 0; } .site-content .gallery { margin-bottom: 1.5em; } .gallery-caption { } .site-content .gallery a img { border: none; height: auto; max-width: 90%; } .site-content .gallery dd { margin: 0; } .entry-attachment .attachment { margin: 0 0 15px; } /* Navigation ----------------------------------------------- */ .site-content [class*="navigation"] { margin: 0 0 15px; overflow: hidden; } [class*="navigation"] .nav-previous { width: 50%; float: left; } [class*="navigation"] .nav-next { width: 50%; float: right; text-align: right; } .site-content [class*="navigation"] a { display: inline-block; padding: 4px 15px; color: #fff; font-size: 1.2em; font-weight: 300; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; text-decoration: none; line-height: 26px; background: #333; border: solid #666; border-width: 0 0 3px; } .site-content [class*="navigation"] a:hover { background: #666; border-color: #333; } .site-content .post-navigation { margin-top: -25px; padding: 0 0 10px; border-bottom: 1px solid #333; } .site-content .post-navigation a { padding: 0; color: #333; font-size: .9em; font-weight: 400; line-height: 20px; background: none; border: none; } .site-content .post-navigation a:hover { color: #1fa0ae; background: none; border: none; } .site-content .post-navigation span { display: block; color: #a6a6a6; font-size: 1.3em; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; } .site-content .post-navigation .meta-nav { display: none; } .site-content .post-navigation .nav-next { width: 35%; margin-left: 5%; padding-right: 10%; text-align: left; } .site-content .post-navigation .nav-previous { width: 35%; margin-right: 5%; padding-left: 10%; text-align: right; } /* COMMENTS ----------------------------------------------- */ #reply-title, .comments-title { margin: 0 0 20px; padding: 0 0 15px; color: #a6a6a6; font-size: 1.3em; text-transform: uppercase; letter-spacing: 2px; border-bottom: 3px solid #333; } .comment-list { margin: 0 0 20px; padding: 0; list-style: none; } .comment-list ul.children { margin: 0 0 0 50px; list-style: none; } .comment-list li.comment, .comment-list li.pingback { margin: 0; padding: 0; } .comment-list li.pingback p { margin: 0; font-style: italic; } .comment-list li.comment .comment-body { padding: 30px 0 20px; border-bottom: 1px solid #d6d6d6; } .comment-list li.comment .comment-author .avatar { float: left; margin: 0 20px 0 0; display: block; } .comment-list li.comment .comment-author .fn { color: #999; font-size: 1.2em; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; } .comment-list li.comment .comment-author .fn a { color: #333; text-decoration: none; } .comment-list li.comment .comment-author .fn a:hover { color: #1fa0ae; } .comment-list li.comment .comment-metadata { margin: 0 0 3px; } .comment-list li.comment .comment-metadata a { color: #a6a6a6; font-size: .9em; font-weight: 300; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; text-decoration: none; } .comment-list li.comment .comment-metadata a:hover { color: #333; } .comment-list li.comment .reply { float: right; } .comment-list li.comment .reply a { color: #a6a6a6; font-size: .9em; font-weight: 300; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; text-decoration: none; } .comment-list li.comment .reply a:hover { color: #333; } .comment-content { clear: both; margin: 20px 0 0; } .comment-content a { word-wrap: break-word; } .bypostauthor { } /* Comment Form */ #reply-title { margin-top: 20px; } #cancel-comment-reply-link { margin: 0 0 0 10px; color: #333; font-size: .9em; text-decoration: none; } #commentform { margin: 0; padding: 0; } #commentform label { color: #a6a6a6; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: 2px; } #commentform textarea { height: 125px; } /* WIDGETS ----------------------------------------------- */ .widget { margin: 0 0 15px; border-bottom: 1px solid #333; } .widget-title { margin: 0 0 15px; padding: 0 0 15px; font-size: 1.2em; font-weight: 400; text-align: center; text-transform: uppercase; letter-spacing: 2px; border-bottom: 3px solid #333; } /* Make sure select elements fit in widgets */ .widget select { max-width: 100%; } .widget ul { margin: 0 0 20px; padding: 0; list-style: none; } .widget ul ul { margin: 0 0 0 10px; } .widget li { margin: 0 0 10px; } .widget li a { color: #333; } .widget li a:hover { color: #1fa0ae; } /* Widget Tabs */ ul.widget-tab-nav { margin: 0 0 15px; border-bottom: 3px solid #333; *zoom: 1; } .widget-tab-nav li { float: left; width: 33.3%; margin: 0; text-align: center; } .widget-tab-nav li a { display: block; padding: 4px 15px; color: #a6a6a6; font-size: 1.1em; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: 2px; line-height: 30px; background: none; border: none; border-radius: 0; } .widget-tab-nav li a:hover, .widget-tab-nav li a:focus { color: #333; text-decoration: none; } .widget-tab-nav li.active a { color: #fff; background: #333; } .widget-tab-content .tab-pane { display: none; } .widget-tab-content .active { display: block; } .widget-tab-content .tab-pane li { margin: 0 0 15px; } .widget-entry-thumbnail { float: left; width: 50px; height: 50px; } .widget-entry-thumbnail img { width: 50px; height: 50px; display: block; } .widget-entry-summary { margin: 3px 0 0 60px; } .widget-entry-content span, .widget-entry-summary span { color: #a6a6a6; font-size: .875em; font-weight: 300; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; } .widget-entry-content h4, .widget-entry-summary h4 { margin: 0; font-size: 1em; text-transform: uppercase; line-height: 1.4; } .widget-entry-content h4 a, .widget-entry-summary h4 a { } .widget-entry-content h4 a:hover, .widget-entry-summary h4 a:hover { text-decoration: none; } #widget-tab-tags { padding: 0 0 15px; font-size: .9em; font-weight: 300; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; line-height: 1.8; } #widget-tab-tags a { color: #a6a6a6; text-decoration: none; } #widget-tab-tags a:hover { color: #333; } /* Widget oEmbed */ .widget-oembed-content { margin: 0 auto 5px; } .widget-oembed-content embed, .widget-oembed-content iframe, .widget-oembed-content object, .widget-oembed-content video { max-width: 100%; min-height: 200px; max-height: 250px; } .widget-oembed-description { margin: 0 0 15px; } /* Widget Social Icons */ .widget-social-icons li { float: left; margin: 5px 10px 5px 0; text-align: center; } .widget-social-icons li a { display: block; } .widget-social-icons li a [class^="ico-"]:before { width: 40px; margin: 0; color: #fff; font-size: 20px; line-height: 40px; background: #333; } .widget-social-icons li a:hover [class^="ico-"]:before { background: #1fa0ae; } /* Widget Flickr */ .widget-flickr-stream { margin: 0 -10px; } .flickr_badge_image { float: left; width: 60px; display: block; margin: 0 10px 20px 10px; } .flickr_badge_image img { display: block; } /* Header Widgets */ .site-header .widget { float: right; clear: right; margin: 0; text-align: right; border: none; } /* SIDEBAR ----------------------------------------------- */ .site-sidebar .widget_search .search-form { margin: 15px 0; } .site-sidebar .widget_search .search-field { float: left; width: 65%; margin: 0 10px 0 0; } /* SITE EXTRA ----------------------------------------------- */ .site-extra { padding: 20px 0; border-top: 1px solid #333; } .site-extra .pad { margin: 0 -15px; } .site-extra .widget-area { float: left; width: 25%; } .extra-one .widget-area { width: 100%; } .extra-two .widget-area { width: 50%; } .extra-three .widget-area { width: 33.3%; } .site-extra .widget { margin: 0 15px 30px; padding: 0; border: none; } .site-extra .widget-social-icons li a [class^="ico-"]:before { width: 25px; line-height: 25px; background: none; } .site-extra .widget-social-icons li a:hover [class^="ico-"]:before { color: #1fa0ae; } /* FOOTER ----------------------------------------------- */ .site-footer { padding: 15px; color: #a6a6a6; font-size: .875em; font-family: Oswald, Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: 1px; background: #333; } .site-footer a { color: #fff; text-decoration: none; } .site-footer a:hover { color: #1fa0ae; } .site-info { float: left; } .site-credit { float: right; } /* RESPONSIVE SUPPORT ----------------------------------------------- */ @media screen and (max-width: 960px) { .container { width: 90%; } .site-content { margin-right: 40%; } .site-sidebar { width: 35%; margin-left: -35%; } .site-sidebar .widget_search .search-field { width: 95%; margin: 0 0 10px; } .site-extra .widget-area { width: 50%; } } @media screen and (max-width: 758px) { .site-header .widget-area { display: none; } .site-header .site-branding { float: none; text-align: center; } .content-area { float: none; } .site-content { margin: 0; } .site-sidebar { width: auto; float: none; margin: 20px 0 0; } .site-extra .widget-area { width: 100%; } } @media screen and (max-width: 480px) { .site-footer { text-align: center; } .site-footer .site-info, .site-footer .site-credit { float: none; } } @media screen and (max-width: 320px) { }