662 lines
13 KiB
CSS
662 lines
13 KiB
CSS
|
/*--------------------------------------------------------------
|
||
|
# Accessibility
|
||
|
--------------------------------------------------------------*/
|
||
|
/* Text meant only for screen readers. */
|
||
|
|
||
|
.screen-reader-text:focus {
|
||
|
right: 5px;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
/* Do not show the outline on the skip link target. */
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Alignments
|
||
|
--------------------------------------------------------------*/
|
||
|
.alignright {
|
||
|
float: right;
|
||
|
margin: 0.4em 0 0.4em 1.6em;
|
||
|
}
|
||
|
|
||
|
.alignleft {
|
||
|
float: left;
|
||
|
margin: 0.4em 1.6em 0.4em 0;
|
||
|
}
|
||
|
|
||
|
.aligncenter {
|
||
|
margin-right: auto;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Typography
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
blockquote blockquote {
|
||
|
padding-right: .8em;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
blockquote cite {
|
||
|
text-align: left;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Forms
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
textarea {
|
||
|
padding-right: .4em;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
/* Jetpack Comment Form */
|
||
|
|
||
|
form.contact-form input {
|
||
|
direction: rtl;
|
||
|
}
|
||
|
|
||
|
.contact-form label.text,
|
||
|
.contact-form label.email,
|
||
|
.contact-form label.name,
|
||
|
.contact-form label.url,
|
||
|
.contact-form label.textarea {
|
||
|
right: .8em;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.contact-form input[type="text"],
|
||
|
.contact-form input[type="email"],
|
||
|
.contact-form input[type="url"],
|
||
|
.contact-form input[type="name"],
|
||
|
.contact-form textarea {
|
||
|
margin-right: auto;
|
||
|
margin-left: auto;
|
||
|
padding-right: 28%;
|
||
|
padding-left: .5em;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Forms
|
||
|
--------------------------------------------------------------*/
|
||
|
.button,
|
||
|
button,
|
||
|
#infinite-handle span,
|
||
|
input[type="button"],
|
||
|
input[type="reset"],
|
||
|
input[type="submit"] {
|
||
|
margin-left: .8em;
|
||
|
right: 4px;
|
||
|
left: auto;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Lists
|
||
|
--------------------------------------------------------------*/
|
||
|
ul, ol {
|
||
|
margin: 0 3.2em 1.6em 0;
|
||
|
padding-right: 0;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
li > ul,
|
||
|
li > ol {
|
||
|
margin-right: 1.6em;
|
||
|
padding-right: 0;
|
||
|
padding-left: 0;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Tables
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
th {
|
||
|
text-align: right;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
## Posts
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
.site-header .entry-title {
|
||
|
right: 50%;
|
||
|
left: auto;
|
||
|
transform: translate(50%, -50%);
|
||
|
}
|
||
|
|
||
|
.entry-meta {
|
||
|
clear: right;
|
||
|
}
|
||
|
|
||
|
.featured-image a:before {
|
||
|
right: 0;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
## Front Page
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
.custom-header-image {
|
||
|
background-position: top right;
|
||
|
}
|
||
|
|
||
|
.affinity-front-page .edit-link {
|
||
|
margin-right: auto;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
.panel-navigation {
|
||
|
left: 1.6em;
|
||
|
right: auto;
|
||
|
}
|
||
|
|
||
|
.panel-navigation a .hidden,
|
||
|
.panel-navigation a:visited .hidden {
|
||
|
padding: 0.8em 0.8em 0.8em 3.2em;
|
||
|
transform: translateX(-6em);
|
||
|
}
|
||
|
|
||
|
.panel-navigation a:hover .hidden, .panel-navigation a:active .hidden, .panel-navigation a:focus .hidden,
|
||
|
.panel-navigation a:visited:hover .hidden,
|
||
|
.panel-navigation a:visited:active .hidden,
|
||
|
.panel-navigation a:visited:focus .hidden {
|
||
|
left: 100%;
|
||
|
right: auto;
|
||
|
transform: translateX(-2.4em);
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
## Site Header
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
.site-title {
|
||
|
right: 1.6em;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Navigation
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
.main-navigation ul ul a {
|
||
|
padding-right: 1.6em;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul ul a {
|
||
|
padding-right: 3.2em;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul ul ul a {
|
||
|
padding-right: 4.8em;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul ul ul ul a {
|
||
|
padding-right: 6.4em;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
/* Small menu. */
|
||
|
|
||
|
.menu-toggle {
|
||
|
right: 100%;
|
||
|
left: auto;
|
||
|
transform: translateX(100%) translateX(1.6em);
|
||
|
}
|
||
|
|
||
|
.comment-navigation .nav-next,
|
||
|
.posts-navigation .nav-next,
|
||
|
.post-navigation .nav-next {
|
||
|
text-align: left;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Comments
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
.comments-title a,
|
||
|
.comments-title a:visited,
|
||
|
.comment-reply-title a,
|
||
|
.comment-reply-title a:visited {
|
||
|
float: left;
|
||
|
}
|
||
|
|
||
|
.comment-author .avatar {
|
||
|
float: right;
|
||
|
margin-left: 1.6em;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
.comment-metadata .edit-link:before {
|
||
|
margin-right: .4em;
|
||
|
margin-left: .8em;
|
||
|
}
|
||
|
|
||
|
.pingback .edit-link,
|
||
|
.trackback .edit-link {
|
||
|
float: left;
|
||
|
}
|
||
|
|
||
|
.comment-form-author label,
|
||
|
.comment-form-email label,
|
||
|
.comment-form-url label,
|
||
|
.comment-form-comment label {
|
||
|
right: 0;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.comment-form-author input,
|
||
|
.comment-form-author textarea,
|
||
|
.comment-form-email input,
|
||
|
.comment-form-email textarea,
|
||
|
.comment-form-url input,
|
||
|
.comment-form-url textarea,
|
||
|
.comment-form-comment input,
|
||
|
.comment-form-comment textarea {
|
||
|
padding-right: 6.4em;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
17.10 Guestbook Template
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
.page-template-guestbook .comments-area .comment {
|
||
|
float: right;
|
||
|
}
|
||
|
|
||
|
.page-template-guestbook .comments-area .comment:nth-of-type(2n) {
|
||
|
margin-left: 0;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
.page-template-guestbook .content-area .hentry,
|
||
|
.page-template-guestbook .comment-respond {
|
||
|
margin-right: auto;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
.page-template-guestbook .comment-author .avatar {
|
||
|
float: right;
|
||
|
margin-left: .8em;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
.page-template-guestbook .comment-edit-link:before {
|
||
|
margin-right: .4em;
|
||
|
margin-left: .8em;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Widgets
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
.footer-widgets .widget-area {
|
||
|
float: right;
|
||
|
}
|
||
|
|
||
|
/* Specific widgets */
|
||
|
|
||
|
.widget_calendar td#next {
|
||
|
text-align: left;
|
||
|
}
|
||
|
|
||
|
.widget_calendar td#prev {
|
||
|
text-align: right;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Infinite scroll
|
||
|
--------------------------------------------------------------*/
|
||
|
/* Globally hidden elements when Infinite Scroll is supported and in use. */
|
||
|
|
||
|
/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
|
||
|
|
||
|
#infinite-handle span {
|
||
|
right: 50%;
|
||
|
left: auto;
|
||
|
transform: translateX(50%);
|
||
|
}
|
||
|
|
||
|
.infinite-loader .spinner {
|
||
|
margin: 0 auto;
|
||
|
right: 50%;
|
||
|
left: auto;
|
||
|
transform: translateX(50%);
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Media
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
/* Make sure embeds and iframes fit their containers. */
|
||
|
|
||
|
.wp-caption img[class*="wp-image-"] {
|
||
|
margin-right: auto;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Customizer
|
||
|
--------------------------------------------------------------*/
|
||
|
/* Hide this until we're in the Customizer */
|
||
|
|
||
|
.affinity-customizer.affinity-front-page .affinity-panel::after {
|
||
|
right: 1.6em;
|
||
|
left: 1.6em;
|
||
|
}
|
||
|
|
||
|
.affinity-customizer.affinity-front-page .affinity-panel .affinity-panel-title {
|
||
|
left: 3.2em;
|
||
|
right: auto;
|
||
|
transform: translate(-3px, -3px);
|
||
|
}
|
||
|
|
||
|
|
||
|
/*--------------------------------------------------------------
|
||
|
# Media Queries
|
||
|
--------------------------------------------------------------*/
|
||
|
|
||
|
@media screen and (min-width: 46em) {
|
||
|
.affinity-front-page .custom-header .entry-title {
|
||
|
right: 50%;
|
||
|
left: auto;
|
||
|
transform: translate(50%, -50%);
|
||
|
}
|
||
|
|
||
|
.affinity-front-page .edit-link a,
|
||
|
.affinity-front-page .edit-link a:visited {
|
||
|
right: 1.6em;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.affinity-front-page .hentry:first-of-type .edit-link a,
|
||
|
.affinity-front-page .hentry:first-of-type .edit-link a:visited {
|
||
|
right: auto;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.affinity-front-page .no-featured-image .entry-title {
|
||
|
right: auto;
|
||
|
left: auto;
|
||
|
transform: none;
|
||
|
}
|
||
|
|
||
|
.affinity-front-page .no-featured-image .edit-link a,
|
||
|
.affinity-front-page .no-featured-image .edit-link a:visited {
|
||
|
right: auto;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.entry-title {
|
||
|
text-align: right;
|
||
|
}
|
||
|
|
||
|
.header-wrapper {
|
||
|
right: 0;
|
||
|
padding-right: 1.6em;
|
||
|
padding-left: 1.6em;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.no-custom-header .site-title,
|
||
|
.site-title {
|
||
|
text-align: right;
|
||
|
right: auto;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.site-description-wrapper {
|
||
|
right: 50%;
|
||
|
left: auto;
|
||
|
transform: translate(50%, -50%);
|
||
|
}
|
||
|
|
||
|
.site-branding {
|
||
|
float: right;
|
||
|
}
|
||
|
|
||
|
.main-navigation {
|
||
|
float: left;
|
||
|
text-align: left;
|
||
|
}
|
||
|
|
||
|
.main-navigation.toggled > div {
|
||
|
margin-right: auto;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation.toggled > div > ul > li {
|
||
|
padding-right: 0;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul {
|
||
|
float: right;
|
||
|
right: -9999em;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul a {
|
||
|
padding-right: inherit;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul:before {
|
||
|
border-right: 14px solid transparent;
|
||
|
border-left: 14px solid transparent;
|
||
|
right: 50%;
|
||
|
left: auto;
|
||
|
transform: translateX(50%);
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul:after {
|
||
|
right: 0;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul ul {
|
||
|
right: -999em;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul ul a {
|
||
|
padding-right: inherit;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul li {
|
||
|
margin-right: 0;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul li:hover > ul,
|
||
|
.main-navigation ul ul li.focus > ul {
|
||
|
right: 100%;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul li:hover > ul,
|
||
|
.main-navigation ul ul li.focus > ul {
|
||
|
right: 100%;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul li:hover > ul,
|
||
|
.main-navigation ul li.focus > ul {
|
||
|
right: 50%;
|
||
|
left: auto;
|
||
|
transform: translateX(0.75em) translateX(50%);
|
||
|
}
|
||
|
|
||
|
.main-navigation li {
|
||
|
margin-right: 0.8em;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation li a:after {
|
||
|
margin-right: 1em;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation li.menu-item-has-children > a,
|
||
|
.main-navigation li.page_item_has_children > a {
|
||
|
padding-left: 1.6em;
|
||
|
padding-right: 0;
|
||
|
}
|
||
|
|
||
|
.main-navigation li.menu-item-has-children > a:before,
|
||
|
.main-navigation li.page_item_has_children > a:before {
|
||
|
left: 1.4em;
|
||
|
right: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation li.menu-item-has-children > a:after,
|
||
|
.main-navigation li.page_item_has_children > a:after {
|
||
|
right: 1.6em;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation li.menu-item-has-children:last-of-type > a:before,
|
||
|
.main-navigation li.page_item_has_children:last-of-type > a:before {
|
||
|
left: -.1em;
|
||
|
right: auto;
|
||
|
}
|
||
|
|
||
|
.main-navigation ul ul li.menu-item-has-children > a:after,
|
||
|
.main-navigation ul ul li.page_item_has_children > a:after {
|
||
|
margin: 0 0.4em 0 0;
|
||
|
transform: rotate(90deg);
|
||
|
}
|
||
|
|
||
|
.header-wrapper {
|
||
|
right: 0;
|
||
|
left: auto;
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
@media screen and (min-width: 58em) {
|
||
|
.content-area {
|
||
|
float: right;
|
||
|
margin: 0 0 0 -25%;
|
||
|
}
|
||
|
|
||
|
.site-main {
|
||
|
margin: 0 0 0 30%;
|
||
|
}
|
||
|
|
||
|
.affinity-front-page .site-content .entry-header,
|
||
|
.affinity-front-page .site-content .entry-content,
|
||
|
.affinity-front-page .site-content .entry-footer {
|
||
|
margin-right: auto;
|
||
|
margin-left: auto;
|
||
|
}
|
||
|
|
||
|
.site-content .widget-area {
|
||
|
float: left;
|
||
|
}
|
||
|
|
||
|
.comment-author .avatar {
|
||
|
margin-left: 0;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
.entry-meta,
|
||
|
.comment-meta {
|
||
|
border-left: 1px solid #e8e9ea;
|
||
|
padding-left: .8em;
|
||
|
float: right;
|
||
|
padding-right: 0;
|
||
|
border-right: none;
|
||
|
}
|
||
|
|
||
|
.entry-content,
|
||
|
.search-results .entry-summary,
|
||
|
.entry-footer,
|
||
|
.comment-content,
|
||
|
.reply {
|
||
|
float: left;
|
||
|
}
|
||
|
|
||
|
.comment-navigation .nav-previous,
|
||
|
.posts-navigation .nav-previous,
|
||
|
.post-navigation .nav-previous {
|
||
|
float: right;
|
||
|
}
|
||
|
|
||
|
.comment-navigation .nav-next,
|
||
|
.posts-navigation .nav-next,
|
||
|
.post-navigation .nav-next {
|
||
|
float: left;
|
||
|
text-align: left;
|
||
|
}
|
||
|
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(1):nth-last-child(2),
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(2):nth-last-child(1) {
|
||
|
margin-left: 6%;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(1):nth-last-child(2):last-of-type,
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(2):nth-last-child(1):last-of-type {
|
||
|
margin-left: 0;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(1):nth-last-child(3),
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(2):nth-last-child(2),
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(3):nth-last-child(1) {
|
||
|
margin-left: 5%;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(1):nth-last-child(3):last-of-type,
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(2):nth-last-child(2):last-of-type,
|
||
|
.footer-widgets .widget-areas .widget-area:nth-child(3):nth-last-child(1):last-of-type {
|
||
|
margin-left: 0;
|
||
|
margin-right: auto;
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
@media screen and (min-width: 68em) {
|
||
|
|
||
|
blockquote.alignright.below-entry-meta {
|
||
|
margin-right: -7.2em;
|
||
|
margin-left: 1.6em;
|
||
|
}
|
||
|
|
||
|
blockquote.alignleft.below-sidebar {
|
||
|
margin-left: -7.2em;
|
||
|
margin-right: 1.6em;
|
||
|
}
|
||
|
|
||
|
img.alignright.below-entry-meta {
|
||
|
margin-right: -7.2em;
|
||
|
margin-left: 1.6em;
|
||
|
}
|
||
|
|
||
|
img.alignleft.below-sidebar {
|
||
|
margin-left: -7.2em;
|
||
|
margin-right: 1.6em;
|
||
|
}
|
||
|
|
||
|
.wp-caption.alignright.below-entry-meta .wp-caption-text {
|
||
|
transform: translateX(100%) translateX(1.6em);
|
||
|
text-align: left;
|
||
|
}
|
||
|
|
||
|
.wp-caption.alignleft.below-sidebar .wp-caption-text {
|
||
|
left: 0;
|
||
|
text-align: right;
|
||
|
right: auto;
|
||
|
transform: translateX(-100%) translateX(-1.6em);
|
||
|
}
|
||
|
|
||
|
}
|