/* -----------------------------------------------------------------------------
TABLE OF CONTENTS
1. General
2. Components
3. Sidebar
4. Elements
5. Editor
----------------------------------------------------------------------------- */
// Import additional CSS files
@import 'grid.scss', 'beautyspot-icons.scss';
body .editor-styles-wrapper {
/* -----------------------------------------------------------------------------
1. GENERAL
----------------------------------------------------------------------------- */
$vs: 30px; // vertical space
/* -------------------------------------------------------------------------
MIXINS
-------------------------------------------------------------------------- */
// Border box
@mixin border-box {
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
// Clearfix
@mixin clearfix {
&:before,
&:after { display: table; clear: both; height: 0; content: ''; }
}
// BeautySpot font
@mixin beautyspot-icons { font-family: 'beautyspot-icons'!important;
speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
// Button
@mixin c-button { @include transition( all 250ms ); display: inline-block; padding: 7px 25px; line-height: 1.5em; font-size: 0.875em; font-weight: bold;
text-transform: uppercase; text-decoration: none; border-radius: 30px; }
// List reset
@mixin list-reset { list-style-type: none; margin: 0; padding: 0; }
@mixin list-item-reset { list-style-type: none; margin: 0; padding: 0; line-height: 1.3em; }
// Section header decor
@mixin section-header-decor { position: relative; padding-left: 25px;
&:before { content: ''; display: block; position: absolute; top: 2px; bottom: 2px; left: 0; width: 5px; }
}
// Transition
@mixin transition( $params... ) { -webkit-transition: $params; -moz-transition: $params; -ms-transition: $params; -o-transition: $params; transition: $params; }
@mixin transition-none { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
// Transform
@mixin transform( $params... ) { -webkit-transform: $params; -ms-transform: $params; transform: $params; }
/* -------------------------------------------------------------------------
TYPOGRAPHY
------------------------------------------------------------------------- */
html { height: 100%; }
body { position: relative; margin: 0; font-size: 16px; font-family: 'Arial', sans-serif; font-weight: 400;
-ms-word-wrap: break-word; word-wrap: break-word; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
a { @include transition( all 250ms ); text-decoration: underline; }
a:hover { text-decoration: none; }
abbr { border-bottom: 1px dotted transparent; }
address { margin-bottom: $vs; }
blockquote { margin: 0 0 $vs 0; font-size: 1.5em; font-style: italic; }
button { @include transition( all 250ms ); background: none; cursor: pointer; outline: 0; border: 0; }
code { padding: 5px; font-family: monospace; border: 1px solid transparent; }
em { font-style: italic; }
fieldset { margin: 0; padding: 0; border: 0; }
figure { margin: 0 0 $vs 0; padding: 0; }
img { max-width: 100%; height: auto; }
p { line-height: 1.5em; margin: 0 0 $vs 0; }
pre { margin-bottom: $vs; padding: 10px; font-family: monospace; border: 1px solid transparent; overflow-x: scroll; }
q { font-style: italic; }
strong { font-weight: bold; }
sub,
sup { position: relative; top: -0.5em; font-size: 0.750em; vertical-align: top; }
sub { top: auto; bottom: -0.5em; }
var { font-style: italic; }
// Headings
h1, h2, h3, h4, h5, h6 { position: relative; margin: 0 0 $vs 0; line-height: normal; font-weight: bold; }
h1 { font-size: 3em; }
h2 { font-size: 2.25em; }
h3 { font-size: 1.5em; }
h4 { font-size: 1.125em; line-height: normal; }
h5 { margin-bottom: $vs / 2; font-size: 1em; }
h6 { margin-bottom: $vs / 2; font-size: 1em; font-weight: normal; }
// Definition list
dl { margin: 0 0 $vs 0; }
dt { margin: $vs / 2 0 0 0; font-weight: bold; }
dt:first-child { margin-top: 0; }
dd { margin: 0; }
// List
ul { margin: 0 0 $vs 0; padding: 0 0 0 20px; list-style: disc outside; }
ol { margin: 0 0 $vs 0; padding: 0 0 0 20px; list-style: decimal outside; }
li { margin-bottom: 7px; padding: 0; line-height: 1.5em; }
ul ul, ol ol,
ul ol, ol ul { margin: 10px 0 10px 10px; }
// Table
table { margin-bottom: $vs; width: 100%; border-collapse: collapse; }
table th { padding: 15px 20px 13px 20px; font-weight: normal; text-align: left; text-transform: uppercase; border: 0; }
table td { padding: 15px 20px 13px 20px; vertical-align: middle; border: 0; }
table p { margin-bottom: $vs / 2; }
table p:last-child { margin: 0; }
/* -------------------------------------------------------------------------
FORMS
------------------------------------------------------------------------- */
label { display: block; margin: 0 0 5px 0; padding: 0; font-size: 0.875em; letter-spacing: 0.04em; font-weight: bold;
line-height: normal; text-transform: uppercase; }
input, select, textarea { @include border-box; padding: 12px 20px; width: 100%;
max-width: 900px; line-height: normal; font-size: 15px; border: 0; }
textarea { max-width: 100%; }
input[type="checkbox"],input[type="radio"] { width: auto; border: 0; }
input:focus { outline: none; }
select { padding: 11px 20px; font-size: 15px; }
label input[type="text"], label input[type="password"] { display: block; }
input[type="submit"] { width: auto; cursor: pointer; }
/* -------------------------------------------------------------------------
WORDPRESS
------------------------------------------------------------------------- */
.aligncenter { margin-left: auto; margin-right: auto; }
.alignleft { float: left; margin: 0 15px 15px 0; }
.alignright { float: right; margin: 0 0 15px 15px; }
.bypostauthor .comment-author .fn { font-style: italic; }
.clearfix:before,
.clearfix:after { display: table; clear: both; height: 0; content: ''; }
.embed-media { margin-bottom: $vs; }
.gallery-caption { padding: 4px; }
.hidden { display: none; }
.screen-reader-text { clip: rect( 1px, 1px, 1px, 1px ); position: absolute !important; height: 1px; width: 1px; overflow: hidden; }
.lead { line-height: 1.5em; font-size: 1.500em; font-weight: 400; }
.strikethrough { text-decoration: line-through; }
.valign-middle { vertical-align: middle; }
.valign-top { vertical-align: top; }
.valign-bottom { vertical-align: bottom; }
.wp-caption { padding: 4px; max-width: 100%; }
.wp-caption-text { font-size: 0.875em; }
p.wp-caption-text { margin-top: 5px; }
.wp-audio-shortcode,
.wp-video,
.wp-block-audio,
.wp-block-video { margin: 0 0 $vs 0; }
.wp-block-column { margin: 0; }
.wp-block-separator { margin: $vs 0; border: 0; border-top: 1px solid transparent; }
// Blockquote
.wp-block-quote { margin: 0 0 $vs 0; font-size: 1.5em; font-style: italic; padding-left: 30px; border: 3px solid transparent; border-width: 0 0 0 3px; }
.wp-block-quote p { margin: 0 0 $vs / 2 0; }
.wp-block-quote cite { font-style: normal; font-size: 0.583em; text-transform: uppercase; }
// Columns
.core__columns--fullwidth .wp-block-columns,
.main--fullwidth .wp-block-columns { @include border-box; margin: $vs * 2.5 auto $vs * 1.5 auto; padding: 0 60px; width: 100%; max-width: 1000px; }
// Embed
.wp-block-embed { margin: 0 0 $vs 0; }
.wp-block-embed__wrapper { text-align: center; }
.wp-embed-aspect-1-1 > .wp-block-embed__wrapper,
.wp-embed-aspect-4-3 > .wp-block-embed__wrapper,
.wp-embed-aspect-16-9 > .wp-block-embed__wrapper { position: relative; width: 100%; height: 0; }
.wp-embed-aspect-1-1 > .wp-block-embed__wrapper { padding-bottom: 100%; }
.wp-embed-aspect-4-3 > .wp-block-embed__wrapper { padding-bottom: 75%; }
.wp-embed-aspect-16-9 > .wp-block-embed__wrapper { padding-bottom: 56.25%; }
.wp-embed-aspect-1-1 > .wp-block-embed__wrapper > iframe,
.wp-embed-aspect-4-3 > .wp-block-embed__wrapper > iframe,
.wp-embed-aspect-16-9 > .wp-block-embed__wrapper > iframe { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; }
// File
.wp-block-file { margin: 0 0 $vs 0; padding: 10px 0; }
// Image
.wp-block-image { margin: 0 0 $vs 0; }
.wp-block-image figcaption { line-height: 1.5em; text-align: left; }
// Gallery
.gallery { @include clearfix; margin: 0 0 $vs 0; }
.gallery-item { @include border-box; float: left; margin: 0; padding: 5px; }
.gallery-columns-1 .gallery-item { float: none; }
.gallery-columns-2 .gallery-item { width: 50%; }
.gallery-columns-2 .gallery-item:nth-child(2n+1) { clear: left; }
.gallery-columns-3 .gallery-item { width: 33%; }
.gallery-columns-3 .gallery-item:nth-child(3n+1) { clear: left; }
.gallery-columns-4 .gallery-item { width: 25%; }
.gallery-columns-4 .gallery-item:nth-child(4n+1) { clear: left; }
.gallery-columns-5 .gallery-item { width: 20%; }
.gallery-columns-5 .gallery-item:nth-child(5n+1) { clear: left; }
.gallery-columns-6 .gallery-item { width: 16%; }
.gallery-columns-6 .gallery-item:nth-child(6n+1) { clear: left; }
.gallery-columns-7 .gallery-item { width: 14%; }
.gallery-columns-7 .gallery-item:nth-child(7n+1) { clear: left; }
.gallery-columns-8 .gallery-item { width: 12.5%; }
.gallery-columns-8 .gallery-item:nth-child(8n+1) { clear: left; }
.gallery-columns-9 .gallery-item { width: 11.111%; }
.gallery-columns-9 .gallery-item:nth-child(9n+1) { clear: left; }
.wp-block-gallery { @include clearfix; margin: 0 0 $vs 0; }
.wp-block-gallery .blocks-gallery-item figcaption { @include border-box; }
// Table
.wp-block-table.is-style-regular td { border: 1px solid transparent; }
/* -------------------------------------------------------------------------
THEME
------------------------------------------------------------------------- */
#wrapper { position: relative; padding-left: 30%; }
/* -----------------------------------------------------------------------------
2. COMPONENTS
----------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------
ALERT MESSAGE
------------------------------------------------------------------------- */
.c-alert-message { position: relative; margin: 0 0 $vs 0; padding: 22px 20px 20px 50px; }
.c-alert-message:before { @include beautyspot-icons; content: '\f129'; position: absolute; top: 23px; left: 20px; font-size: 20px; }
/* -------------------------------------------------------------------------
BUTTON
------------------------------------------------------------------------- */
.c-button { @include c-button; }
/* -------------------------------------------------------------------------
PERSON SOCIAL ICONS
------------------------------------------------------------------------- */
.lsvr_person-social-icon:before { @include beautyspot-icons; }
.lsvr_person-social-icon--facebook:before { content: '\f09a'; }
.lsvr_person-social-icon--linkedin:before { content: '\f0e1'; }
.lsvr_person-social-icon--skype:before { content: '\f17e'; }
.lsvr_person-social-icon--twitter:before { content: '\f099'; }
/* -------------------------------------------------------------------------
SEARCH FORM
------------------------------------------------------------------------- */
.c-search-form { max-width: 400px; }
.c-search-form__input-holder { position: relative; }
.c-search-form__input { padding: 8px 40px 8px 15px; font-size: 16px; font-style: italic; border: 2px solid transparent; border-radius: 0; }
.c-search-form__button { @include transition( all 250ms ); display: block; position: absolute; top: 50%; right: 5px; margin-top: -15px; padding: 0;
width: 30px; height: 30px; line-height: 30px; text-align: center; }
.c-search-form__button:hover { opacity: 0.8; }
.c-search-form__button:active { opacity: 0.5; }
.c-search-form__button-icon { font-size: 16px; }
.c-search-form__button-icon:before { @include beautyspot-icons; content: '\f002'; }
/* -----------------------------------------------------------------------------
3. SIDEBAR
----------------------------------------------------------------------------- */
#sidebar { margin-bottom: $vs * 2; }
/* -------------------------------------------------------------------------
WIDGETS
------------------------------------------------------------------------- */
.widget { margin: 0 0 $vs * 2 0; }
.widget-title,
.widget__title { position: relative; margin: 0 0 $vs 0; padding-bottom: 10px; font-size: 0.875em; font-weight: bold; text-transform: uppercase;
border-bottom: 1px solid transparent; }
.widget__more { margin: $vs 0 0 0; padding-top: $vs / 2; font-size: 0.875em; border-top: 1px solid transparent; }
.widget__more-link { text-decoration: none; }
// Definition list
.lsvr-definition-list-widget__list { @include clearfix; }
.lsvr-definition-list-widget__item-title { @include border-box; clear: both; float: left; margin: 10px 0 0 0; padding: 10px 10px 0 0;
width: 50%; border-top: 1px solid transparent; }
.lsvr-definition-list-widget__item-text { @include border-box; float: right; margin: 10px 0 0 0; padding: 10px 0 0 10px; width: 50%;
text-align: right; border-top: 1px solid transparent; }
.lsvr-definition-list-widget__item-title:first-of-type,
.lsvr-definition-list-widget__item-text:first-of-type { margin: 0; padding-top: 0; border: 0; }
.lsvr-definition-list-widget__item-text-link { text-decoration: none; }
// LSVR Posts
.lsvr-post-list-widget__list { @include list-reset; margin: 0; }
.lsvr-post-list-widget__item { @include list-item-reset; margin: $vs / 2 0 0 0; padding-top: $vs / 2; border-top: 1px solid transparent; }
.lsvr-post-list-widget__item:first-child { margin-top: 0; padding-top: 0; border: 0; }
.lsvr-post-list-widget__item-inner { position: relative; }
.lsvr-post-list-widget__item--has-thumb .lsvr-post-list-widget__item-inner { padding-left: 65px; min-height: 50px; }
.lsvr-post-list-widget__item-thumb { position: absolute; left: 0; top: 2px; width: 50px; }
.lsvr-post-list-widget__item-thumb-link { display: block; }
.lsvr-post-list-widget__item-thumb-link:hover { opacity: 0.9; }
.lsvr-post-list-widget__item-thumb-link:active { opacity: 0.8; }
.lsvr-post-list-widget__item-thumb img { display: block; }
.lsvr-post-list-widget__item-title { margin: 0; font-size: 1em; }
.lsvr-post-list-widget__item-title-link { text-decoration: none; }
.lsvr-post-list-widget__item-date,
.lsvr-post-list-widget__item-category { display: inline-block; margin: 2px 0 0 0; font-size: 0.875em; }
.lsvr-post-list-widget__item-category-link { text-decoration: none; }
// LSVR Featured Post
.lsvr-post-featured-widget .widget__title { margin-bottom: $vs / 2; padding: 0; border: 0; }
.lsvr-post-featured-widget__thumb { margin: 0; }
.lsvr-post-featured-widget__thumb-link { display: block; }
.lsvr-post-featured-widget__thumb-link:hover { opacity: 0.9; }
.lsvr-post-featured-widget__thumb-link:active { opacity: 0.8; }
.lsvr-post-featured-widget__thumb img { display: block; }
.lsvr-post-featured-widget__content-inner { padding: 20px; border: 1px solid transparent; }
.lsvr-post-featured-widget__title { margin: 0; font-size: 1em; }
.lsvr-post-featured-widget__title-link { text-decoration: none; }
.lsvr-post-featured-widget__date,
.lsvr-post-featured-widget__category { display: inline-block; margin: 2px 0 0 0; font-size: 0.875em; }
.lsvr-post-featured-widget__category-link { text-decoration: none; }
.lsvr-post-featured-widget__excerpt p { margin: $vs / 2 0 0 0; }
.lsvr-post-featured-widget .widget__more { margin-top: $vs / 2; }
// Category widget
.lsvr_service-categories-widget,
.lsvr_gallery-categories-widget,
.lsvr_person-categories-widget,
.lsvr_faq-categories-widget { margin: 0 0 $vs * 1.5 0;
.widget__title { margin-bottom: $vs / 2; }
ul { @include list-reset; }
li { @include list-item-reset; margin: 5px 0 0 0; }
a { text-decoration: none; }
.current-cat > a { font-weight: bold; }
.root > li { position: relative; }
.root > li > ul { font-size: 0.875em; }
ul ul { margin: 5px 0 0 0; }
ul ul > li { margin: 2px 0 0 0; }
}
// LSVR Services
.lsvr_service-list-widget .widget__title { margin-bottom: $vs / 2;}
.lsvr_service-list-widget__list { @include list-reset; margin: 0; }
.lsvr_service-list-widget__item { @include list-item-reset; position: relative; margin: 5px 0 0 0; padding: 8px 10px; }
.lsvr_service-list-widget__item:first-child { margin-top: 0; }
.lsvr_service-list-widget__item--has-icon { padding-left: 35px; }
.lsvr_service-list-widget__item-icon { position: absolute; top: 9px; left: 8px; font-size: 20px; }
.lsvr_service-list-widget__item-link { text-decoration: none; }
.lsvr_service-list-widget__item--current { font-weight: bold; }
// LSVR Featured Service
.lsvr_service-featured-widget .widget__title { margin-bottom: $vs / 2; padding: 0; border: 0; }
.lsvr_service-featured-widget__content-inner { padding: 20px; border: 1px solid transparent; }
.lsvr_service-featured-widget__thumb { margin: 0; }
.lsvr_service-featured-widget__thumb-link { display: block; }
.lsvr_service-featured-widget__thumb-link:hover { opacity: 0.9; }
.lsvr_service-featured-widget__thumb-link:active { opacity: 0.8; }
.lsvr_service-featured-widget__thumb img { display: block; }
.lsvr_service-featured-widget__icon { display: block; margin: 0 auto $vs / 2 auto;
font-size: 28px; width: 50px; height: 50px; line-height: 52px; text-align: center; border-radius: 50%; }
.lsvr_service-featured-widget__content--has-thumb .lsvr_service-featured-widget__icon { position: relative; top: -5px; margin: -50px auto 0 auto; }
.lsvr_service-featured-widget__title { margin: 0; font-size: 1em; }
.lsvr_service-featured-widget__title-link { text-decoration: none; }
.lsvr_service-featured-widget__category { display: inline-block; margin: 2px 0 0 0; font-size: 0.875em; }
.lsvr_service-featured-widget__category-link { text-decoration: none; }
.lsvr_service-featured-widget__excerpt p { margin: $vs / 2 0 0 0; }
.lsvr_service-featured-widget .widget__more { margin-top: $vs / 2; }
// LSVR Galleries
.lsvr_gallery-list-widget__list { @include list-reset; margin: 0; }
.lsvr_gallery-list-widget__item { @include list-item-reset; margin: $vs / 2 0 0 0; padding-top: $vs / 2; border-top: 1px solid transparent; }
.lsvr_gallery-list-widget__item:first-child { margin-top: 0; padding-top: 0; border: 0; }
.lsvr_gallery-list-widget__item-inner { position: relative; }
.lsvr_gallery-list-widget__item--has-thumb .lsvr_gallery-list-widget__item-inner { padding-left: 65px; min-height: 50px; }
.lsvr_gallery-list-widget__item-thumb { position: absolute; left: 0; top: 0; width: 50px; }
.lsvr_gallery-list-widget__item-thumb-link { display: block; }
.lsvr_gallery-list-widget__item-thumb-link:hover { opacity: 0.9; }
.lsvr_gallery-list-widget__item-thumb-link:active { opacity: 0.8; }
.lsvr_gallery-list-widget__item-thumb img { display: block; }
.lsvr_gallery-list-widget__item-title { margin: 0; font-size: 0.875em; }
.lsvr_gallery-list-widget__item-title-link { text-decoration: none; }
.lsvr_gallery-list-widget__item-date,
.lsvr_gallery-list-widget__item-count { margin: 0; font-size: 0.875em; }
// LSVR Featured Gallery
.lsvr_gallery-featured-widget .widget__title { margin-bottom: $vs / 2; padding: 0; border: 0; }
.lsvr_gallery-featured-widget__thumb { margin: 0; }
.lsvr_gallery-featured-widget__thumb-link { display: block; }
.lsvr_gallery-featured-widget__thumb-link:hover { opacity: 0.9; }
.lsvr_gallery-featured-widget__thumb-link:active { opacity: 0.8; }
.lsvr_gallery-featured-widget__thumb img { display: block; }
.lsvr_gallery-featured-widget__content-inner { padding: 20px; border: 1px solid transparent; }
.lsvr_gallery-featured-widget__title { margin: 0; font-size: 1em; }
.lsvr_gallery-featured-widget__title-link { text-decoration: none; }
.lsvr_gallery-featured-widget__date,
.lsvr_gallery-featured-widget__count { display: inline-block; margin: 2px 10px 0 0; font-size: 0.875em; }
.lsvr_gallery-featured-widget__excerpt p { margin: $vs / 2 0 0 0; }
.lsvr_gallery-featured-widget .widget__more { margin-top: $vs / 2; }
// LSVR People
.lsvr_person-list-widget__list { @include list-reset; margin: 0; }
.lsvr_person-list-widget__item { @include list-item-reset; margin: $vs / 2 0 0 0; padding-top: $vs / 2; border-top: 1px solid transparent; }
.lsvr_person-list-widget__item:first-child { margin-top: 0; padding-top: 0; border: 0; }
.lsvr_person-list-widget__item-inner { position: relative; }
.lsvr_person-list-widget__item--has-thumb .lsvr_person-list-widget__item-inner { padding-left: 65px; min-height: 50px; }
.lsvr_person-list-widget__item-thumb { position: absolute; top: 0; left: 0; max-width: 50px; }
.lsvr_person-list-widget__item-thumb-link { display: block; padding: 2px; border-radius: 50%; }
.lsvr_person-list-widget__item-thumb-link:hover { opacity: 0.9; }
.lsvr_person-list-widget__item-thumb-link > img { display: block; border-radius: 50%; }
.lsvr_person-list-widget__item-title { margin: 0; font-size: 1em; }
.lsvr_person-list-widget__item-title-link { text-decoration: none; }
.lsvr_person-list-widget__item-subtitle { margin: 2px 0 0 0; font-size: 0.875em; font-weight: normal; font-style: italic; }
.lsvr_person-list-widget__item-social { @include list-reset; margin: 7px 0 0 0; }
.lsvr_person-list-widget__item-social-item { @include list-item-reset; display: inline-block; }
.lsvr_person-list-widget__item-social-link { display: block; position: relative; margin: 0 2px 0 0; width: 20px; height: 20px;
line-height: 20px; font-size: 12px; border-radius: 50%; text-decoration: none; text-align: center;}
.lsvr_person-list-widget__item-social-icon:before { line-height: inherit; }
.lsvr_person-list-widget .widget__more { margin-top: $vs; }
// LSVR Featured Person
.lsvr_person-featured-widget .widget__title { margin-bottom: $vs / 2; padding: 0; border: 0; }
.lsvr_person-featured-widget__content { padding: 20px; text-align: center; border: 1px solid transparent; }
.lsvr_person-featured-widget__thumb { margin: 0 0 $vs / 2 0; }
.lsvr_person-featured-widget__thumb-link { display: inline-block; padding: 3px; max-width: 100px; border-radius: 50%; }
.lsvr_person-featured-widget__thumb-link:hover { opacity: 0.9; }
.lsvr_person-featured-widget__thumb-link > img { display: block; border-radius: 50%; }
.lsvr_person-featured-widget__title { margin: 0; font-size: 1em; }
.lsvr_person-featured-widget__title-link { text-decoration: none; }
.lsvr_person-featured-widget__subtitle { margin: 2px 0 0 0; font-size: 0.875em; font-weight: normal; font-style: italic; }
.lsvr_person-featured-widget__excerpt { margin: $vs / 2 0 0 0; }
.lsvr_person-featured-widget__excerpt p { margin: $vs / 2 0 0 0; }
.lsvr_person-featured-widget__social { @include list-reset; margin: $vs / 2 0 0 0; }
.lsvr_person-featured-widget__social-item { @include list-item-reset; display: inline-block; }
.lsvr_person-featured-widget__social-link { display: block; position: relative; margin: 0 2px; width: 24px; height: 24px; line-height: 24px;
font-size: 14px; text-align: center; border-radius: 50%; text-decoration: none; }
.lsvr_person-featured-widget__social-icon:before { line-height: inherit; }
.lsvr_person-featured-widget .widget__more { margin-top: $vs / 2; }
// LSVR Testimonials
.lsvr_testimonial-list-widget__list { @include list-reset; margin: 0; }
.lsvr_testimonial-list-widget__item { @include list-item-reset; position: relative; margin: $vs / 2 0 0 0; padding-top: $vs /2;
border-top: 1px solid transparent; }
.lsvr_testimonial-list-widget__item:first-child { margin: 0; padding-top: 0; border: 0; }
.lsvr_testimonial-list-widget__item-quote { margin: 0; font-size: 1em; }
.lsvr_testimonial-list-widget__item-quote > p { margin: 0 0 $vs / 2 0; font-size: 1em; }
.lsvr_testimonial-list-widget__item-footer { position: relative; }
.lsvr_testimonial-list-widget__item-footer--has-thumb { padding-left: 50px; }
.lsvr_testimonial-list-widget__item-thumb { margin: 0; position: absolute; top: 0; left: 0; width: 40px; }
.lsvr_testimonial-list-widget__item-thumb-link { display: block; border: 2px solid transparent; border-radius: 50%; }
.lsvr_testimonial-list-widget__item-thumb-link > img { display: block; border-radius: 50%; }
.lsvr_testimonial-list-widget__item-author { font-style: normal; }
.lsvr_testimonial-list-widget__item-author-link { font-size: 0.875em; font-weight: bold; text-decoration: none; }
.lsvr_testimonial-list-widget__item-author-description { display: block; margin: 0; font-size: 0.75em; }
// LSVR Featured Testimonial
.lsvr_testimonial-featured-widget .widget__title { margin-bottom: $vs / 2; padding: 0; border: 0; }
.lsvr_testimonial-featured-widget__content { padding: 20px; border: 1px solid transparent; }
.lsvr_testimonial-featured-widget__quote { margin: 0; font-size: 1em; }
.lsvr_testimonial-featured-widget__quote > p { margin: 0 0 $vs / 2 0; font-size: 1em; }
.lsvr_testimonial-featured-widget__footer { position: relative; margin-top: 10px; }
.lsvr_testimonial-featured-widget__footer--has-thumb { padding-left: 55px; min-height: 40px; }
.lsvr_testimonial-featured-widget__thumb { margin: 0; position: absolute; top: 0; left: 0; width: 40px; }
.lsvr_testimonial-featured-widget__thumb-link { display: block; border: 2px solid transparent; border-radius: 50%; }
.lsvr_testimonial-featured-widget__thumb-link > img { display: block; border-radius: 50%; }
.lsvr_testimonial-featured-widget__author { font-style: normal; }
.lsvr_testimonial-featured-widget__author-link { font-size: 0.875em; font-weight: bold; text-decoration: none; }
.lsvr_testimonial-featured-widget__author-description { display: block; margin: 2px 0 0 0; font-size: 0.75em; }
.lsvr_testimonial-featured-widget .widget__more { margin-top: $vs / 2; }
// LSVR FAQ
.lsvr_faq-list-widget__list { @include list-reset; margin: 0; }
.lsvr_faq-list-widget__item { @include list-item-reset; margin: $vs / 2 0 0 0; padding-top: $vs / 2; border-top: 1px solid transparent; }
.lsvr_faq-list-widget__item:first-child { margin-top: 0; padding-top: 0; border: 0; }
.lsvr_faq-list-widget__item-title { margin: 0; font-size: 1em; }
.lsvr_faq-list-widget__item-title-link { text-decoration: none; }
.lsvr_faq-list-widget__item-category { margin: 2px 0 0 0; font-size: 0.875em; }
.lsvr_faq-list-widget__item-category-link { text-decoration: none; }
// LSVR Featured FAQ
.lsvr_faq-featured-widget .widget__title { margin-bottom: $vs / 2; padding: 0; border: 0; }
.lsvr_faq-featured-widget__content-inner { padding: 20px; border: 1px solid transparent; }
.lsvr_faq-featured-widget__title { margin: 0; font-size: 1em; }
.lsvr_faq-featured-widget__title-link { text-decoration: none; }
.lsvr_faq-featured-widget__category { margin: $vs / 2 0 0 0; font-size: 0.875em; }
.lsvr_faq-featured-widget__category-link { text-decoration: none; }
.lsvr_faq-featured-widget__excerpt p { margin: $vs / 2 0 0 0; }
.lsvr_faq-featured-widget .widget__more { margin-top: $vs / 2; }
// Archive
.widget_archive {
ul { @include list-reset; }
li { @include list-item-reset; margin: 10px 0 0 0; }
li:first-child { margin: 0; }
select { max-width: 260px; }
a { text-decoration: none; }
}
// Calendar
.widget_calendar {
table { width: 100%; border-collapse: collapse; border: 0; }
caption { margin-bottom: 10px; font-size: 0.875em; text-transform: uppercase; letter-spacing: 0.04em; }
th { padding-bottom: 10px; font-size: 0.875em; border: 0; }
td { border: 0; }
tbody td { padding: 8px 0; font-size: 0.875em; text-align: center; }
tfoot td { padding: 8px 0 0 0; font-size: 0.875em; }
tfoot a { font-weight: bold; text-decoration: none; }
#prev { text-align: left; }
#next { text-align: right; }
}
// Categories
.widget_categories {
ul { @include list-reset; }
li { @include list-item-reset; margin: 10px 0 0 0; }
.widget__inner > li:first-child { margin: 0; }
ul ul { margin-left: 30px; }
select { max-width: 260px; }
a { text-decoration: none; }
}
// Gallery
.widget.widget_media_gallery {
.gallery-item a:hover { opacity: 0.9; }
.gallery-item a:active { opacity: 0.8; }
}
// Image
.widget_media_image {
a:hover { opacity: 0.9; }
a:active { opacity: 0.8; }
}
// Meta
.widget_meta {
ul { @include list-reset; }
li { @include list-item-reset; margin: $vs / 2 0 0 0; }
a { text-decoration: none; }
}
// Menu
.widget_nav_menu {
.current-menu-item > .sub-menu,
.current-menu-ancestor > .sub-menu { display: block; }
.current-menu-item > a { font-weight: bold; }
ul { @include list-reset; }
li { @include list-item-reset; position: relative; margin: 10px 0 0 0; }
.menu > li > .sub-menu,
.menu > li > .sub-menu > li > .sub-menu,
.menu > li > .sub-menu > li > .sub-menu > li > .sub-menu { margin-left: 30px; }
.menu > li > .sub-menu > li > .sub-menu > li > .sub-menu ul { margin-left: 5px; }
a { text-decoration: none; }
}
// Pages
.widget_pages {
ul { @include list-reset; }
li { @include list-item-reset; margin: $vs / 2 0 0 0; }
.widget__inner > li:first-child { margin: 0; }
ul ul { margin-left: 30px; }
a { text-decoration: none; }
}
// Recent comments
.widget_recent_comments {
ul { @include list-reset; }
li { @include list-item-reset; margin: $vs / 2 0 0 0; }
a { text-decoration: none; }
.url { font-weight: normal; }
}
// Recent posts
.widget_recent_entries {
ul { @include list-reset; }
li { @include list-item-reset; margin: $vs / 2 0 0 0; }
.post-date { display: block; margin: 5px 0 0 0; font-size: 0.875em; }
a { text-decoration: none; }
}
// RSS
.widget_rss {
ul { @include list-reset; }
li { @include list-item-reset; margin: $vs / 2 0 0 0; }
.rss-date { display: block; margin: 5px 0 0 0; font-size: 0.875em; }
.rssSummary { display: block; margin: 5px 0 0 0; font-size: 0.875em; }
a { text-decoration: none; }
}
// Tagcloud
.widget_tag_cloud {
.tag-cloud-link { display: inline-block; margin: 0 2px 4px 0; padding: 2px 5px; text-decoration: none; }
}
/* -----------------------------------------------------------------------------
4. ELEMENTS
----------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------
CTA
------------------------------------------------------------------------- */
.lsvr-beautyspot-cta { margin: $vs * 2 0 $vs * 2 0; }
.lsvr-beautyspot-cta__inner { position: relative; padding: 0 30px; }
.lsvr-beautyspot-cta__content { position: relative; z-index: 20; }
.lsvr-beautyspot-cta--has-button .lsvr-beautyspot-cta__content { padding-right: 300px; }
.lsvr-beautyspot-cta__title { margin: 0; }
.lsvr-beautyspot-cta__text { font-size: 1.125em; font-style: italic; }
.lsvr-beautyspot-cta__text > p { margin: 5px 0 0 0; }
.lsvr-beautyspot-cta__button { position: absolute; top: 50%; right: 0; margin: -25px 0 0 0; font-size: 1.125em; text-transform: uppercase; }
.lsvr-beautyspot-cta__button-link { @include c-button; }
// Has dark background
.lsvr-beautyspot-cta--has-dark-background { margin: 0;
.lsvr-beautyspot-cta__inner { padding-top: $vs * 2; padding-bottom: $vs * 2 }
}
/* -------------------------------------------------------------------------
FAQ
------------------------------------------------------------------------- */
.lsvr-beautyspot-faq { margin: $vs * 2.5 0 $vs * 1.5 0; }
.lsvr-beautyspot-faq__inner { position: relative; padding: 0 30px; }
.lsvr-beautyspot-faq__header { @include section-header-decor; margin: 0 0 $vs * 1.5 0; }
.lsvr-beautyspot-faq__content { position: relative; z-index: 20; }
.lsvr-beautyspot-faq__title { margin: 0; }
.lsvr-beautyspot-faq__title-link { text-decoration: none; }
.lsvr-beautyspot-faq__subtitle { margin: 5px 0 0 0; font-size: 1.125em; font-family: inherit; font-weight: normal; font-style: italic; }
.lsvr-beautyspot-faq__subtitle a { text-decoration: none; }
.lsvr-beautyspot-faq__list { margin: 0; }
.lsvr-beautyspot-faq__post { margin: 0 0 $vs / 2 0; border: 1px solid transparent; }
.lsvr-beautyspot-faq__post-header { @include transition( background-color 500ms ); position: relative;
padding: 20px 50px 20px 30px; cursor: pointer; }
.lsvr-beautyspot-faq__post-header:before { @include beautyspot-icons; content: '\f107'; position: absolute;
top: 20px; right: 25px; font-size: 20px; }
.lsvr-beautyspot-faq__post--expanded .lsvr-beautyspot-faq__post-header:before { content: '\f106'; }
.lsvr-beautyspot-faq__post-title { margin: 0; font-size: 1em; }
.lsvr-beautyspot-faq__post-content-wrapper { display: none; padding: 30px; border-top: 1px solid transparent; }
.lsvr-beautyspot-faq__post-content > p { margin: $vs / 2 0 0 0; }
.lsvr-beautyspot-faq__post-content > p:first-child { margin: 0; }
.lsvr-beautyspot-faq__post-permalink-link { font-size: 0.875em; text-decoration: none; }
.lsvr-beautyspot-faq__post-footer { margin-top: $vs / 2; }
.lsvr-beautyspot-faq__post-meta { display: inline-block; margin: 0 20px 0 0; font-size: 0.875em; }
.lsvr-beautyspot-faq__post-meta .post__term-link { text-decoration: none; }
.lsvr-beautyspot-faq__post-footer-permalink { display: inline-block; margin: 0; font-size: 0.875em; }
.lsvr-beautyspot-faq__post-footer-permalink-link { text-decoration: none; }
// Has dark background
.lsvr-beautyspot-faq--has-dark-background { margin: 0;
.lsvr-beautyspot-faq__inner { padding-top: $vs * 2.5; padding-bottom: $vs * 1.5; }
}
/* -------------------------------------------------------------------------
GALLERIES
------------------------------------------------------------------------- */
.lsvr-beautyspot-galleries { margin: $vs * 2.5 0 $vs * 1.5 0; }
.lsvr-beautyspot-galleries__inner { position: relative; }
.lsvr-beautyspot-galleries__header-wrapper { padding-left: 30px; padding-right: 30px; }
.lsvr-beautyspot-galleries__header { @include section-header-decor; margin: 0 0 $vs * 1.5 0; }
.lsvr-beautyspot-galleries__title { margin: 0; }
.lsvr-beautyspot-galleries__title-link { text-decoration: none; }
.lsvr-beautyspot-galleries__subtitle { margin: 0; font-size: 1.125em; font-family: inherit; font-weight: normal; font-style: italic; }
.lsvr-beautyspot-galleries__subtitle a { text-decoration: none; }
.lsvr-beautyspot-galleries__list-wrapper { padding-left: 30px; padding-right: 30px; }
.lsvr-beautyspot-galleries__list { margin: -5px; }
.lsvr-beautyspot-galleries__item { padding: 5px; }
.lsvr-beautyspot-galleries__post { margin: 0 0 $vs 0; background-size: cover; background-position: center; }
.lsvr-beautyspot-galleries__post-inner { position: relative; display: table; table-layout: fixed; width: 100%; height: 300px; }
.lsvr-beautyspot-galleries__post-bg { display: table-cell; position: relative; padding: 20px;
@include transition( all, 300ms ); vertical-align: bottom; border-radius: 3px; }
.lsvr-beautyspot-galleries__post-header { position: relative; z-index: 20; }
.lsvr-beautyspot-galleries__post-title { margin: 0; font-size: 1.125em; }
.lsvr-beautyspot-galleries__post-title-link { text-decoration: none; }
.lsvr-beautyspot-galleries__post-meta { position: relative; margin: $vs / 2 0 0 0; padding: 5px 0 0 0; font-size: 0.875em;
border-top: 1px solid transparent; z-index: 20; }
.lsvr-beautyspot-galleries__post-meta .post__term-link { text-decoration: none; }
.lsvr-beautyspot-galleries__post-meta-images { display: block; }
.lsvr-beautyspot-galleries__post-overlay-link { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; }
// Fullwidth layout
.lsvr-beautyspot-galleries--fullwidth-layout { margin-top: 0; margin-bottom: 0;
.lsvr-beautyspot-galleries__header { margin-top: $vs * 2.5; }
.lsvr-beautyspot-galleries__list-wrapper { padding-left: 0; padding-right: 0; }
.lsvr-beautyspot-galleries__list-wrapper .lsvr-container { width: 100%; max-width: 100%; margin: 0; padding: 0; }
.lsvr-beautyspot-galleries__list { margin: 0; }
.lsvr-beautyspot-galleries__item { padding: 0; }
.lsvr-beautyspot-galleries__post { margin: 0; }
}
// Has dark background
.lsvr-beautyspot-galleries--has-dark-background { margin: 0;
.lsvr-beautyspot-galleries__inner { padding-top: $vs * 2.5; padding-bottom: $vs * 2.5; }
}
// Fullwidth layout and has dark background
.lsvr-beautyspot-galleries--fullwidth-layout.lsvr-beautyspot-galleries--has-dark-background {
.lsvr-beautyspot-galleries__header { margin-top: 0; }
.lsvr-beautyspot-galleries__inner { padding-bottom: 0; }
}
/* -------------------------------------------------------------------------
GALLERY
------------------------------------------------------------------------- */
.lsvr-beautyspot-gallery { margin: $vs * 2.5 0 $vs * 1.5 0; }
.lsvr-beautyspot-gallery__inner { position: relative; }
.lsvr-beautyspot-gallery__header-wrapper { padding-left: 30px; padding-right: 30px; }
.lsvr-beautyspot-gallery__header { @include section-header-decor; margin: 0 0 $vs * 1.5 0; }
.lsvr-beautyspot-gallery__title { margin: 0; }
.lsvr-beautyspot-gallery__title-link { text-decoration: none; }
.lsvr-beautyspot-gallery__subtitle { margin: 0; font-size: 1.125em; font-family: inherit; font-weight: normal; font-style: italic; }
.lsvr-beautyspot-gallery__subtitle a { text-decoration: none; }
.lsvr-beautyspot-gallery__list-wrapper { padding-left: 30px; padding-right: 30px; }
.lsvr-beautyspot-gallery__list { @include list-reset; margin: -5px; }
.lsvr-beautyspot-gallery__item { @include list-item-reset; padding: 5px; }
.lsvr-beautyspot-gallery__item-thumb { margin: 0; }
.lsvr-beautyspot-gallery__item-thumb-link:hover { opacity: 0.8; }
.lsvr-beautyspot-gallery__item-thumb-link:active { opacity: 0.7; }
.lsvr-beautyspot-gallery__item-image { display: block; }
// Cropped
.lsvr-beautyspot-gallery__item-thumb--cropped .lsvr-beautyspot-gallery__item-thumb-link { display: block; padding-bottom: 70%; background-position: center; background-size: cover; }
// Fullwidth layout
.lsvr-beautyspot-gallery--fullwidth-layout { margin-top: 0; margin-bottom: 0;
.lsvr-beautyspot-gallery__header { margin-top: $vs * 2.5; }
.lsvr-beautyspot-gallery__list-wrapper { padding-left: 0; padding-right: 0; }
.lsvr-beautyspot-gallery__list-wrapper .lsvr-container { width: 100%; max-width: 100%; margin: 0; padding: 0; }
.lsvr-beautyspot-gallery__list { margin: 0; }
.lsvr-beautyspot-gallery__item { padding: 0; }
}
// Has dark background
.lsvr-beautyspot-gallery--has-dark-background { margin: 0;
.lsvr-beautyspot-gallery__inner { padding-top: $vs * 2.5; padding-bottom: $vs * 2.5; }
}
// Fullwidth layout and has dark background
.lsvr-beautyspot-gallery--fullwidth-layout.lsvr-beautyspot-gallery--has-dark-background {
.lsvr-beautyspot-gallery__header { margin-top: 0; }
.lsvr-beautyspot-gallery__inner { padding-bottom: 0; }
}
/* -------------------------------------------------------------------------
INTRO
------------------------------------------------------------------------- */
.lsvr-beautyspot-intro { margin: $vs * 2.5 0 $vs * 2.5 0; }
.lsvr-beautyspot-intro__inner { position: relative; margin: 0 auto; padding: 0 30px; max-width: 1000px; }
.lsvr-beautyspot-intro__image-wrapper { display: inline-block; margin: 0; }
.lsvr-beautyspot-intro__image { border-radius: 50%; }
.lsvr-beautyspot-intro__title { margin: 0; }
.lsvr-beautyspot-intro__title a { text-decoration: none; }
.lsvr-beautyspot-intro__subtitle { margin: 0; font-size: 1.125em; font-family: inherit; font-weight: normal; font-style: italic; }
.lsvr-beautyspot-intro__subtitle a { text-decoration: none; }
.lsvr-beautyspot-intro__text { margin-top: $vs; font-size: 1.125em; }
.lsvr-beautyspot-intro__text:first-child { margin: 0; }
.lsvr-beautyspot-intro__text p { margin: $vs 0 0 0; }
.lsvr-beautyspot-intro__text p:first-child { margin: 0; }
.lsvr-beautyspot-intro__more { margin: $vs 0 0 0; }
// Has image
.lsvr-beautyspot-intro--has-image {
.lsvr-beautyspot-intro__wrapper { display: table; }
.lsvr-beautyspot-intro__image-col { display: table-cell; width: 25%; }
.lsvr-beautyspot-intro__text-col { @include border-box; display: table-cell;
padding-left: 50px; width: 75%; vertical-align: middle; }
}
/* -------------------------------------------------------------------------
POSTS
------------------------------------------------------------------------- */
.lsvr-beautyspot-posts { margin: $vs * 2.5 0 $vs * 1.5 0; }
.lsvr-beautyspot-posts__inner { position: relative; padding: 0 30px; }
.lsvr-beautyspot-posts__header { @include section-header-decor; margin: 0 0 $vs * 1.5 0; }
.lsvr-beautyspot-posts__title { margin: 0; }
.lsvr-beautyspot-posts__title-link { text-decoration: none; }
.lsvr-beautyspot-posts__subtitle { margin: 5px 0 0 0; font-size: 1.125em; font-family: inherit; font-weight: normal; font-style: italic; }
.lsvr-beautyspot-posts__subtitle a { text-decoration: none; }
.lsvr-beautyspot-posts__content { position: relative; z-index: 20; }
.lsvr-beautyspot-posts__post { margin: 0 0 $vs 0; }
.lsvr-beautyspot-posts__post-thumbnail { margin: 0 0 $vs / 2 0; }
.lsvr-beautyspot-posts__post-thumbnail-link { display: block; }
.lsvr-beautyspot-posts__post-thumbnail-link:hover { opacity: 0.9; }
.lsvr-beautyspot-posts__post-thumbnail-link:active { opacity: 0.8; }
.lsvr-beautyspot-posts__post-thumbnail img { display: block; }
.lsvr-beautyspot-posts__post-title { margin: 0; font-size: 1.125em; }
.lsvr-beautyspot-posts__post-title-link { text-decoration: none; }
.lsvr-beautyspot-posts__post-meta { margin: 5px 0 0 0; font-size: 0.875em; }
.lsvr-beautyspot-posts__post-meta .post__term-link { text-decoration: none; }
.lsvr-beautyspot-posts__post-content p { margin: $vs / 2 0 0 0; }
.lsvr-beautyspot-posts__post-permalink { margin: $vs / 2 0 0 0; }
.lsvr-beautyspot-posts__post-permalink-link { font-size: 0.875em; text-decoration: none; }
// Has background color or image
.lsvr-beautyspot-posts--has-dark-background { margin: 0;
.lsvr-beautyspot-posts__inner { padding-top: $vs * 2.5; padding-bottom: $vs * 1.5; }
}
/* -------------------------------------------------------------------------
SERVICES
------------------------------------------------------------------------- */
.lsvr-beautyspot-services { margin: $vs * 2.5 0 $vs * 1.5 0; }
.lsvr-beautyspot-services__inner { position: relative; }
.lsvr-beautyspot-services__header-wrapper { padding-left: 30px; padding-right: 30px; }
.lsvr-beautyspot-services__header { @include section-header-decor; margin: 0 0 $vs * 1.5 0; }
.lsvr-beautyspot-services__title { margin: 0; }
.lsvr-beautyspot-services__title-link { text-decoration: none; }
.lsvr-beautyspot-services__subtitle { margin: 0; font-size: 1.125em; font-family: inherit; font-weight: normal; font-style: italic; }
.lsvr-beautyspot-services__subtitle a { text-decoration: none; }
.lsvr-beautyspot-services__list-wrapper { padding-left: 30px; padding-right: 30px; }
.lsvr-beautyspot-services__list { margin: -5px; }
.lsvr-beautyspot-services__item { padding: 5px; }
.lsvr-beautyspot-services__post { position: relative; overflow: hidden; }
.lsvr-beautyspot-services__post-bg { position: relative; padding-bottom: 70%; background-size: cover; }
.lsvr-beautyspot-services__post-inner { position: absolute; top: 0; left: 0; right: 0; bottom: 0;
width: 100%; height: 100%; overflow: hidden; }
.lsvr-beautyspot-services__post-header { display: table; width: 100%; height: 100%; }
.lsvr-beautyspot-services__post-header-inner { @include border-box; display: table-cell; padding: 30px;
width: 100%; height: 100%; text-align: center; vertical-align: middle; }
.lsvr-beautyspot-services__post-icon { font-size: 60px; }
.lsvr-beautyspot-services__post-title { margin: 10px 0 0 0; font-size: 1.5em; font-family: inherit; font-weight: normal; }
.lsvr-beautyspot-services__post-title-link { text-decoration: none; }
.lsvr-beautyspot-services__post-meta { margin: 0; font-size: 0.75em; }
.lsvr-beautyspot-services__post-meta .post__term-link { text-decoration: none; }
.lsvr-beautyspot-services__post-description { @include border-box; @include transition( opacity 250ms ); display: table; position: absolute;
top: 100%; left: 0; right: 0; bottom: 0; padding: 30px; width: 100%; height: 100%; opacity: 0; z-index: 10; }
.lsvr-beautyspot-services__item:hover .lsvr-beautyspot-services__post-description { top: 0; opacity: 1; }
.lsvr-beautyspot-services__item:active .lsvr-beautyspot-services__post-description { opacity: 0.9; }
.lsvr-beautyspot-services__post-description-inner { display: table-cell; text-align: center; vertical-align: middle; }
.lsvr-beautyspot-services__post-description p { margin: $vs / 2 0 0 0; }
.lsvr-beautyspot-services__post-description p:first-child { margin: 0; }
.lsvr-beautyspot-services__post-permalink-link { display: inline-block; border: 2px solid transparent; }
.lsvr-beautyspot-services__post-overlay-link { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
width: 100%; height: 100%; z-index: 20; }
// Fullwidth layout
.lsvr-beautyspot-services--fullwidth-layout { margin-top: 0; margin-bottom: 0;
.lsvr-beautyspot-services__header { margin-top: $vs * 2.5; }
.lsvr-beautyspot-services__list-wrapper { padding-left: 0; padding-right: 0; }
.lsvr-beautyspot-services__list-wrapper .lsvr-container { width: 100%; max-width: 100%; margin: 0; padding: 0; }
.lsvr-beautyspot-services__list { margin: 0; }
.lsvr-beautyspot-services__item { padding: 0; }
}
// Has dark background
.lsvr-beautyspot-services--has-dark-background { margin: 0;
.lsvr-beautyspot-services__inner { padding-top: $vs * 2.5; padding-bottom: $vs * 2.5; }
}
// Fullwidth layout and has dark background
.lsvr-beautyspot-services--fullwidth-layout.lsvr-beautyspot-services--has-dark-background {
.lsvr-beautyspot-services__header { margin-top: 0; }
.lsvr-beautyspot-services__inner { padding-bottom: 0; }
}
/* -------------------------------------------------------------------------
SIDEBAR
------------------------------------------------------------------------- */
.lsvr-beautyspot-sidebar { margin: $vs * 2.5 0 $vs * 1.5 0; }
.lsvr-beautyspot-sidebar__inner { padding: 0 30px; }
.lsvr-beautyspot-sidebar__list { @include clearfix; @include border-box; position: relative; margin-left: -15px; margin-right: -15px; }
.lsvr-beautyspot-sidebar__list > .widget { position: relative; float: left; margin: 0 0 $vs 0; padding-left: 15px; padding-right: 15px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
.lsvr-beautyspot-sidebar__list--1-cols > .widget { float: none; }
.lsvr-beautyspot-sidebar__list--2-cols > .widget:nth-child( 2n+1 ),
.lsvr-beautyspot-sidebar__list--3-cols > .widget:nth-child( 3n+1 ),
.lsvr-beautyspot-sidebar__list--4-cols > .widget:nth-child( 4n+1 ) { clear: left; }
.lsvr-beautyspot-sidebar__list--1-cols > .widget { width: 100; }
.lsvr-beautyspot-sidebar__list--2-cols > .widget { width: 50%; }
.lsvr-beautyspot-sidebar__list--3-cols > .widget { width: 33.33%; }
.lsvr-beautyspot-sidebar__list--4-cols > .widget { width: 25%; }
/* -------------------------------------------------------------------------
TESTIMONIALS
------------------------------------------------------------------------- */
.lsvr-beautyspot-testimonials { margin: $vs * 2.5 0 $vs * 1.5 0; }
.lsvr-beautyspot-testimonials__inner { padding: 0 30px; }
.lsvr-beautyspot-testimonials__header { @include section-header-decor; margin: 0 0 $vs * 1.5 0; }
.lsvr-beautyspot-testimonials__title { margin: 0; }
.lsvr-beautyspot-testimonials__title-link { text-decoration: none; }
.lsvr-beautyspot-testimonials__subtitle { margin: 0; font-size: 1.125em; font-family: inherit; font-weight: normal; font-style: italic; }
.lsvr-beautyspot-testimonials__subtitle a { text-decoration: none; }
.lsvr-beautyspot-testimonials__content { position: relative; z-index: 20; }
.lsvr-beautyspot-testimonials__post { margin: 0 0 $vs 0; padding: 30px; border: 1px solid transparent; }
.lsvr-beautyspot-testimonials__post-quote { margin: 0; font-size: 1em; }
.lsvr-beautyspot-testimonials__post-quote > p { margin: 0 0 $vs / 2 0; font-size: 1.125em; }
.lsvr-beautyspot-testimonials__post-footer { position: relative; }
.lsvr-beautyspot-testimonials__post-footer--has-thumbnail { padding-left: 50px; }
.lsvr-beautyspot-testimonials__post-thumbnail { margin: 0; position: absolute; top: -2px; left: 0; width: 40px; }
.lsvr-beautyspot-testimonials__post-thumbnail-link { display: block; border: 2px solid transparent; border-radius: 50%; }
.lsvr-beautyspot-testimonials__post-thumbnail-link > img { display: block; border-radius: 50%; }
.lsvr-beautyspot-testimonials__post-title { font-size: 1em; font-style: normal; }
.lsvr-beautyspot-testimonials__post-title-link { font-weight: bold; text-decoration: none; }
.lsvr-beautyspot-testimonials__post-title-description { display: block; margin: 2px 0 0 0; font-size: 0.875em; }
// Has background color or image
.lsvr-beautyspot-testimonials--has-dark-background { margin: 0;
.lsvr-beautyspot-testimonials__inner { padding-top: $vs * 2.5; padding-bottom: $vs * 1.5; }
}
/* -------------------------------------------------------------------------
LSVR ELEMENTS
------------------------------------------------------------------------- */
.shortcode-widget { margin-bottom: $vs; }
// Alert message
.lsvr-alert-message { position: relative; margin: 0 0 $vs 0; padding: 22px 20px 20px 50px; }
.lsvr-alert-message:before { @include beautyspot-icons; content: '\f129'; position: absolute; top: 23px; left: 20px; font-size: 20px; }
.lsvr-alert-message__title { margin: 0; font-size: 1em; }
.lsvr-alert-message__text { margin: 2px 0 0 0; }
.lsvr-alert-message__text:first-child { margin-top: 0; }
.lsvr-alert-message__text > p { margin: $vs / 2 0 0 0; }
.lsvr-alert-message__text > p:first-child { margin: 0; }
// Button
.lsvr-button { @include c-button; margin: 0 0 $vs 0; }
.lsvr-button--small { padding: 5px 15px; font-size: 0.75em; }
.lsvr-button--large { padding: 10px 30px; font-size: 1.125em; }
// Counter
.lsvr-counter { margin: 0 0 $vs 0; }
.lsvr-counter__number { margin: 0; font-size: 3em; font-weight: bold; }
.lsvr-counter__label { margin: 0; }
// CTA
.lsvr-cta { margin: 0 0 $vs 0; padding: 30px; border: 1px solid transparent; }
.lsvr-cta--has-button .lsvr-cta__inner { padding-right: 200px; }
.lsvr-cta__inner { position: relative; }
.lsvr-cta__title { margin: 0 0 $vs / 2 0; }
.lsvr-cta__text { font-size: 1.125em; font-style: italic; }
.lsvr-cta__text > p { margin: $vs / 2 0 0 0; }
.lsvr-cta__text > p:first-child { margin: 0; }
.lsvr-cta__button { position: absolute; top: 50%; right: 0; margin: -25px 0 0 0; }
.lsvr-cta__button-link { @include c-button; }
// Feature
.lsvr-feature { margin: 0 0 $vs 0; }
.lsvr-feature--has-icon .lsvr-feature__inner { position: relative; padding-left: 50px; }
.lsvr-feature__icon { position: absolute; top: 0; left: 0; font-size: 36px; }
.lsvr-feature__title { margin: 0 0 $vs / 2 0; font-size: 1.125em; }
.lsvr-feature__title-link { text-decoration: none; }
.lsvr-feature__text > p { margin: $vs / 2 0 0 0; }
.lsvr-feature__text > p:first-child { margin: 0; }
.lsvr-feature__more { margin: $vs / 2 0 0 0; }
.lsvr-feature__more-link { text-decoration: none; }
// Pricing table
.lsvr-pricing-table { margin: 0 0 $vs 0; border: 1px solid transparent; text-align: center; }
.lsvr-pricing-table__inner { padding: 30px; }
.lsvr-pricing-table__title { padding: 15px 10px; margin: -31px -31px $vs / 2 -31px; font-weight: normal; }
.lsvr-pricing-table__price { margin: 0 0 $vs / 2 0; }
.lsvr-pricing-table__price-value { display: block; line-height: 1em; font-size: 3.75em; font-weight: bold; }
.lsvr-pricing-table__price-description { display: block; margin: 0; }
.lsvr-pricing-table__text { padding-top: $vs; border-top: 1px solid transparent; }
.lsvr-pricing-table__text > p { margin: $vs / 2 0 0 0; }
.lsvr-pricing-table__text > p:first-child { margin: 0; }
.lsvr-pricing-table__button { margin: $vs 0 0 0; }
.lsvr-pricing-table__button-link { @include c-button; }
// Progress bar
.lsvr-progress-bar { margin: 0 0 $vs 0; }
.lsvr-progress-bar__title { margin: 0 0 $vs / 2 0; }
.lsvr-progress-bar__bar { position: relative; }
.lsvr-progress-bar__bar-inner { height: 25px; }
.lsvr-progress-bar__bar-label { position: absolute; top: 4px; right: 10px; font-size: 0.875em; font-weight: bold; }
// Slides
.lsvr_slide-list { position: relative; }
.lsvr_slide-list__bg { background-position: center 0; background-size: cover; background-repeat: no-repeat; }
.lsvr_slide-list__list { position: relative; width: 100%; height: 500px; overflow: hidden; }
.lsvr_slide-list__item { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.lsvr_slide-list__item:first-child { display: block; }
.lsvr_slide-list__item--active { display: block; z-index: 20; }
.lsvr_slide-list__item--next { display: block; opacity: 0; z-index: 10; }
.lsvr_slide-list__item-bg { position: relative; width: 100%; height: 100%; background-position: center 0; background-size: cover; background-repeat: no-repeat; z-index: 10; }
.lsvr_slide-list__item-inner { position: relative; width: 100%; height: 100%; }
.lsvr_slide-list__item-content-wrapper { position: relative; display: table; width: 100%; height: 100%; z-index: 40; }
.lsvr_slide-list__item-content { display: table-cell; padding: 0 30px; width: 100%; height: 100%; vertical-align: bottom; }
.lsvr_slide-list__item-content-inner { @include border-box; position: relative; display: inline-block; left: 0; padding: $vs * 2 30px $vs * 2 2px;
width: 100%; max-width: 380px; z-index: 30; }
.lsvr_slide-list__item-content-inner:before { content: ''; display: block; position: absolute; top: 0; left: -1000px; bottom: 0;
width: 1000px; height: 100%; }
.lsvr_slide-list__item--next .lsvr_slide-list__item-content-inner { left: -500px; }
.lsvr_slide-list__item-title { margin: 0; }
.lsvr_slide-list__item-text { margin-top: $vs / 2; font-size: 1.125em; }
.lsvr_slide-list__item-text:first-child { margin-top: 0; }
.lsvr_slide-list__item-text > p { margin: $vs / 2 0 0 0; }
.lsvr_slide-list__item-text > p:first-child { margin: 0; }
.lsvr_slide-list__item-button { margin: $vs 0 0 0; }
.lsvr_slide-list__item-button:first-child { margin: 0; }
.lsvr_slide-list__item-button-link { padding: 10px 30px; font-size: 1em; }
.lsvr_slide-list__item-overlay-link { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; }
.lsvr_slide-list__nav { position: absolute; right: 30px; bottom: 30px; z-index: 50; }
.lsvr_slide-list__nav-button { display: inline-block; margin: 0 5px; padding: 0; width: 40px; height: 40px; line-height: 42px; }
.lsvr_slide-list__nav-button-icon { @include transition( left 250ms ); position: relative; left: 0; }
.lsvr_slide-list__nav-button-icon:before { @include beautyspot-icons; font-size: 16px; }
.lsvr_slide-list__nav-button--prev .lsvr_slide-list__nav-button-icon:before { content: '\f053'; }
.lsvr_slide-list__nav-button--next .lsvr_slide-list__nav-button-icon:before { content: '\f054'; }
.lsvr_slide-list__nav-button--prev:active .lsvr_slide-list__nav-button-icon { left: -2px; }
.lsvr_slide-list__nav-button--next:active .lsvr_slide-list__nav-button-icon { left: 2px; }
// Slide animation
@media ( min-width: 768px ) {
.lsvr_slide-list__item--animate-out {
animation: lsvr_slide-list-out 500ms 1 ease-in-out; animation-fill-mode: forwards;
animation-delay: 300ms;
}
.lsvr_slide-list__item--animate-out .lsvr_slide-list__item-content-inner {
animation: lsvr_slide-list-content-out 500ms 1 ease-in-out; animation-fill-mode: forwards;
}
.lsvr_slide-list__item--animate-in {
animation: lsvr_slide-list-in 250ms 1 ease-in-out; animation-fill-mode: forwards;
animation-delay: 250ms;
}
.lsvr_slide-list__item--animate-in .lsvr_slide-list__item-content-inner {
animation: lsvr_slide-list-content-in 500ms 1 ease-in-out; animation-fill-mode: forwards;
animation-delay: 500ms;
}
@keyframes lsvr_slide-list-out {
0% {
opacity: 1;
} 100% {
opacity: 0;
}
}
@keyframes lsvr_slide-list-content-out {
0% {
left: 0;
} 100% {
left: -500px;
}
}
@keyframes lsvr_slide-list-in {
0% {
opacity: 0;
} 100% {
opacity: 1;
}
}
@keyframes lsvr_slide-list-content-in {
0% {
left: -500px;
} 100% {
left: 0;
}
}
}
/* -----------------------------------------------------------------------------
5. EDITOR
----------------------------------------------------------------------------- */
.wp-block { max-width: 900px; }
.lsvr-shortcode-block-view__html { line-height: normal; }
.lsvr-shortcode-block-view__html p { line-height: 1.5em; }
.lsvr-container { padding: 0 10px; }
} // Close .editor-styles-wrapper |