@icon-height: 20px; @icon-offset: 0px; .loop-wrapper { &.regular { .list-item { &:first-child { .post-row { padding-top: 0px; } } .post-content-outer { box-sizing: border-box; order: 3; flex: 12.5 1; } h2 { margin: 0px 0px 10px 0px; } .media-inner { > div { margin: 0; } } .post-meta { width: 100% !important; margin-top: 10px !important; a { margin-left: 5px; .vamtam-font(h6-); font-weight: normal; text-transform: uppercase; } } .post-row { display: flex; flex-wrap: wrap; padding-top: 60px; .media-inner { background-color: var( --vamtam-accent-color-5 ); transition: background .4s ease-out; > img { -webkit-backface-visibility: hidden; transition: opacity .4s; } > img, > a > img.wp-post-image { width: 100%; } } } } .sticky { background: var( --vamtam-accent-color-5 ); padding: 40px 40px 40px 20px; border-bottom: 10px solid var( --vamtam-accent-color-1 ); border-radius: var( --vamtam-border-radius ); box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1); box-sizing: border-box; } } .post-actions-wrapper { height: auto; width: 100%; padding-bottom: 10px; text-transform: uppercase; display: flex; align-items: center; .comment-word { display: none; } a { .vamtam-font(h6-); transition: all .3s ease; color: var( --vamtam-accent-color-6 ); opacity: 0.5; border: var( --vamtam-no-border-link ); &:hover { opacity: 1; color: var( --vamtam-body-link-hover ); .icon { color: var( --vamtam-body-link-hover ); } } } .author a .icon { display: none; } div:nth-child(2), div:nth-child(3) { &:before { content: "°"; font-size: 14px; padding-left: 5px; padding-right: 1px; line-height: 1.0em; vertical-align: bottom; padding-bottom: 14px; color: var( --vamtam-accent-color-4 ); } } .post-edit-link { margin-left: 10px; } } .layout-left-right &.regular { .list-item { .post-media { order: -1; flex-basis: 100%; padding-bottom: 30px; } .post-content-outer { max-width: 100%; } } } .post-row:hover { .media-inner > img { opacity: 0.8; -webkit-backface-visibility: hidden; } } .vamtam-meta-author { display: inline-block; padding: 0px; } .vamtam-meta-comments { display: inline-block; } .list-item { margin-bottom: 0; &:last-child { border-bottom: 0; } &:hover { .vamtam-meta-author, .vamtam-meta-comments { opacity: 1; } } .post-content-outer { .post-content { > ol, > ul { &:last-child { margin-bottom: 1em; } } } } .post-media { min-width: 37%; max-width: 37%; flex: 0 1 ; order: 2; margin: 0px; margin-bottom: 20px; margin-top: 0px; padding-right: 5%; .media-inner { display: block; } } .post-article { display: block; } } header { position: relative; } .page-content { position: relative; } .post-article { display: inline-block; margin: 0; width: 100%; p { font-size: inherit; } .post-content-outer { .post-meta { overflow: hidden; margin: 40px 0 10px 0; text-align: center; clear: both; nav > div:not(.post-actions), .post-actions > div, .post-edit-link { .vamtam-font(h6-); float: left; padding-right: 20px; margin-bottom: 10px; min-height: 20px; line-height: 20px; text-align: left; > span.icon { color: var( --vamtam-accent-color-4 ); font-family: "theme" !important; } &.blog-buttons { padding-top: 24px; border-right: none !important; a { position: relative; &:after { position: absolute; top: -25px; right: -20px; width: 1px; height: 300%; border-right: 1px solid var( --vamtam-accent-color-7 ); content: ""; } } } } span.icon { display: inline-block; overflow: hidden; text-align: center; width: auto; vertical-align: top; font-size: 18px; line-height: 18px; padding-top: 2px; font-family: "theme" !important; color: var( --vamtam-accent-color-2 ); } .post-actions { float: right; } } } } &.news { .audio-post-format { .post-media { margin: 0px; } } .post-media { max-width: 100%; padding: 0px; } } } .page-content { label[for|=pwbox] { position: relative; top: -3px; display: inline-block !important; font-size: 0 !important; input { font-size: var( --vamtam-primary-font-font-size ) !important; &[type=password] { padding: 14px; top: -1px; margin: 0; font-size: 8px; line-height: 17px; } } } } .post-article { header { &.sep-text.single { .content { text-align: left; white-space: normal; } .sep-text-after { display: none; } } h4 { margin: 0px 0px 10px 0px; } } .vamtam-button-wrap { margin: 0px 0px 30px 30px; } .post-subheader { display: table; width: 100%; font-size: 14px; .post-date { display: table-cell; margin: 0; padding-right: 1em; text-transform: uppercase; white-space: nowrap; font-size: 11px; line-height: 1; } .post-date-after { display: table-cell; overflow: visible; width: 100%; vertical-align: top; white-space: nowrap; &:after { display: inline-block; width: 100%; height: 1ex; border-bottom: 1px solid var( --vamtam-default-line-color ); content: ""; vertical-align: top; } } } .post-media { text-align: center; max-width: 1120px; margin: auto; .media-inner { position: relative; min-height: @icon-height + @icon-offset * 2; > div { max-width: none !important; width: auto !important; } > img, > a img { transition: all .3s; width: 100%; } } } .blog-buttons { text-align: center; &:after { display: block; clear: both; content: ""; } a { display: inline-block; margin: 0 auto; .icon { margin: 0 8px 0 0; padding: 0; color: var( --vamtam-accent-color-1 ); font-size: 16px; } } } /////////////////// // media posts // /////////////////// .audio-post-format { .media-inner { display: block; } } /* Quote Post ----------------------------------------------------------- */ .quote-post-format { blockquote.large { padding: 0; overflow: visible; text-align: left; .quote-text { &, p { .vamtam-font(h3-); } } } .cite { img { border-bottom: 1px solid var( --vamtam-accent-color-7 ); padding-bottom: 10px; margin-bottom: 10px; + .quote-author { display: block; } } } } /* Aside Post ----------------------------------------------------------- */ .aside-post-format { .post-content-outer { padding-top: 0; } } /* Status Post ----------------------------------------------------------- */ .status-post-format { .the-content { padding-right: calc( var( --vamtam-small-padding ) + 16px ) !important; } } /* Gallery Post --------------------------------------------------------- */ .gallery-post-format { .post-media { position: relative; text-align: center; .button { position: absolute; bottom: var( --vamtam-horizontal-padding ); left: 50%; z-index: 5; margin-left: -var( --vamtam-horizontal-padding ); padding: 0.7em 0.7em 0.75em; span { &:after { border: none !important; } } &:hover { text-decoration: none; } } .media-inner { display: block; } } } .excerpt-more { float: left; margin-top: -.6em; } .status-post-format, .aside-post-format, .link-post-format { .post-subheader { margin-bottom: 0 !important; } .post-media { margin-top: var( --vamtam-small-padding ); } } .link-post-format { .post-media { margin-top: 0; } } .video-post-format { .media-inner { iframe { height: 360px; } } } } .vamtam-related-content { clear: both; position: relative; padding-top: 40px; padding-bottom: 50px; border-top: solid 1px var( --vamtam-default-line-color ); &.related-portfolios .excerpt { display: none; } &.related-posts { padding-bottom: 35px; .related-content-title { padding-bottom: 25px; } } } .header-middle { .limit-wrapper { .news.scroll-x { padding-top: 10px !important; } } }