Created
March 26, 2017 08:20
-
-
Save tobymarsden/6d962a6c60ad83229d163b1b4d64f514 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.hypervisual__cf:before, | |
.hypervisual__cf:after { | |
content: " "; /* 1 */ | |
display: table; /* 2 */ | |
} | |
.hypervisual__cf:after { | |
clear: both; | |
} | |
.hypervisual__cf { | |
*zoom: 1; | |
} | |
.hypervisual__content-block { | |
width: 100%; | |
box-sizing: border-box; | |
position: relative; | |
/*margin-top: -1px;*/ /* buggy with floats */ | |
} | |
.hypervisual__content-block:not(.hypervisual__content-block--columns) { | |
z-index: 0; | |
} | |
.hypervisual__content-block * { | |
box-sizing: border-box; | |
} | |
.hypervisual__content-block a { | |
color: inherit; | |
text-decoration: underline; | |
} | |
.hypervisual__content-block ul { | |
list-style-type: disc; | |
padding-left: 1.2em; | |
} | |
.hypervisual__content-block ul li { | |
list-style-type: disc; | |
} | |
.hypervisual__content-block--heading h2 { | |
padding: 20px 40px; | |
text-align: inherit; | |
font-weight: bold; | |
margin: 0; | |
color: inherit; | |
} | |
.hypervisual__content-block--heading.hypervisual__text-align-left h2 { | |
margin-right: auto; | |
} | |
.hypervisual__content-block--heading.hypervisual__text-align-center h2 { | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.hypervisual__content-block--heading.hypervisual__text-align-right h2 { | |
margin-left: auto; | |
} | |
/* legacy */ | |
.hypervisual__content-block--heading:not(.hypervisual__text-small):not(.hypervisual__text-medium):not(.hypervisual__text-large):not(.hypervisual__text-xlarge) h2 { | |
font-size: 40px; | |
} | |
.hypervisual__content-block--text-image, | |
.hypervisual__content-block--html, | |
.hypervisual__content-block--html-image, | |
.hypervisual__content-block--text-video, | |
.hypervisual__content-block--columns { | |
display: table; | |
table-layout: fixed; | |
} | |
.hypervisual__content-block--text-image .hypervisual__text, | |
.hypervisual__content-block--text-video .hypervisual__text { | |
position: relative; | |
width: 50%; | |
display: table-cell; | |
padding: 20px 50px; | |
line-height: 1.58; | |
} | |
.hypervisual__content-block--columns .hypervisual__column { | |
position: relative; | |
width: 50%; | |
display: table-cell; | |
margin-top: 0; | |
} | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_10 { width: 10%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_15 { width: 15%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_20 { width: 20%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_25 { width: 25%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_30 { width: 30%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_35 { width: 35%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_40 { width: 40%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_45 { width: 45%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_50 { width: 50%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_55 { width: 55%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_60 { width: 60%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_65 { width: 65%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_70 { width: 70%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_75 { width: 75%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_80 { width: 80%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_85 { width: 85%; } | |
.hypervisual__content-block--columns .hypervisual__column.hypervisual__column_width_90 { width: 90%; } | |
.hypervisual__content-block--columns .hypervisual__columns-wrapper { | |
margin-left: auto; | |
margin-right: auto; | |
display: table; | |
table-layout: fixed; | |
width: 100%; | |
} | |
.hypervisual__content-block--columns .hypervisual__content-block--video { | |
vertical-align: top; | |
} | |
.hypervisual__content-block--video { | |
text-align: center; | |
} | |
.hypervisual__content-block--html { | |
vertical-align: middle; | |
text-align: center; | |
} | |
.hypervisual__content-block--product { | |
vertical-align: middle; | |
text-align: center; | |
} | |
.hypervisual__content-block--html-image .hypervisual__html { | |
width: 50%; | |
} | |
.hypervisual__content-block--html-image .hypervisual__html, .hypervisual__content-block--html .hypervisual__html { | |
position: relative; | |
display: table-cell; | |
vertical-align: middle; | |
text-align: center; | |
} | |
.hypervisual__text-top { | |
vertical-align: top; | |
} | |
.hypervisual__text-middle { | |
vertical-align: middle; | |
} | |
.hypervisual__text-align-left { | |
text-align: left; | |
} | |
.hypervisual__text-align-right { | |
text-align: right; | |
} | |
.hypervisual__text-align-center { | |
text-align: center; | |
} | |
.hypervisual__image-align-left { | |
text-align: left; | |
} | |
.hypervisual__image-align-right { | |
text-align: right; | |
} | |
.hypervisual__image-align-center { | |
text-align: center; | |
} | |
.hypervisual__text-left { | |
position: relative; | |
left: -50%; | |
} | |
.hypervisual__html-left { | |
position: relative; | |
left: -50%; | |
} | |
.hypervisual__text_line_one { | |
margin-bottom: 10px; | |
color: inherit; | |
} | |
.hypervisual__text_line_two { | |
margin-bottom: 10px; | |
color: inherit; | |
} | |
.hypervisual__image, | |
.hypervisual__video { | |
width: 50%; | |
display: table-cell; | |
} | |
.hypervisual__image-valign-top { | |
vertical-align: top; | |
} | |
.hypervisual__image-valign-middle { | |
vertical-align: middle; | |
} | |
.hypervisual__image-valign-bottom { | |
vertical-align: bottom; | |
} | |
.hypervisual__image-right, .hypervisual__video-right { | |
position: relative; | |
left: 50%; | |
} | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block { | |
left: -50%; | |
} | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block { | |
left: 50%; | |
} | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_90 { left: -10%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_90 { left: 10%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_85 { left: -15%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_85 { left: 15%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_80 { left: -20%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_80 { left: 20%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_75 { left: -25%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_75 { left: 25%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_70 { left: -30%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_70 { left: 30%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_65 { left: -35%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_65 { left: 35%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_60 { left: -40%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_60 { left: 40%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_55 { left: -45%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_55 { left: 45%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_50 { left: -50%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_50 { left: 50%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_45 { left: -55%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_45 { left: 55%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_40 { left: -60%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_40 { left: 60%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_35 { left: -65%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_35 { left: 65%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_30 { left: -70%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_30 { left: 70%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_25 { left: -75%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_25 { left: 75%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_20 { left: -80%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_20 { left: 80%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_15 { left: -85%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_15 { left: 85%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column1-block.hypervisual__column_width_10 { left: -90%; } | |
.hypervisual__column_stacking_reverse .hypervisual__column2-block.hypervisual__column_width_10 { left: 90%; } | |
.hypervisual__image img { | |
width: 100%; | |
display: table-cell; | |
vertical-align: bottom; /* Firefox */ | |
} | |
.hypervisual__content-block--2up-quote { | |
width: 768px; | |
margin: auto; | |
padding: 75px 20px; | |
} | |
.hypervisual__quote-image { | |
width: 250px; | |
height: 250px; | |
border-radius: 125px; | |
float: left; | |
background-size: cover; | |
background-position: center; | |
} | |
.hypervisual__quote-image-left { | |
float: left; | |
margin-right: 40px; | |
} | |
.hypervisual__content-block--2up-quote .hypervisual__quote-text { | |
width: 438px; | |
} | |
.hypervisual__quote-text-right { | |
float: right; | |
} | |
.hypervisual__content-block--text { | |
padding: 0 40px; | |
text-align: center; | |
} | |
.hypervisual__content-block--text .hypervisual__text-wrapper { | |
max-width: 728px; | |
padding: 25px 0; | |
margin: 0 auto; | |
line-height: 1.58; | |
} | |
.hypervisual__content-block--text .hypervisual__text-wrapper p { | |
margin-top: 0; | |
} | |
.hypervisual__text-wrapper ul { | |
display: inline-block; | |
text-align: left; | |
} | |
.hypervisual__util-left-align { | |
text-align: left; | |
} | |
.hypervisual__util-right-align { | |
text-align: right; | |
} | |
.hypervisual__util-center-align { | |
text-align: center; | |
} | |
.hypervisual__content-block--spacer { | |
min-height: 30px; | |
} | |
.hypervisual__content-block--video .hypervisual__util-video-wrapper, | |
.hypervisual__content-block--text-video .hypervisual__util-video-wrapper { | |
position: relative; | |
padding-bottom: 56.25%; /* 16:9 */ | |
height: 0; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.hypervisual__content-block--video .hypervisual__util-video-wrapper iframe, | |
.hypervisual__content-block--text-video .hypervisual__util-video-wrapper iframe { | |
position: absolute; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
/*z-index: 100;*/ | |
} | |
.hypervisual__content-block--image { | |
font-size: 0; | |
line-height: 0; | |
} | |
.hypervisual__content-block--image img { | |
width: 100%; | |
display: block; | |
} | |
.hypervisual__embed_product, .hypervisual__embed_collection-product { | |
min-width: 240px; | |
max-width: 420px; | |
display: inline-block; | |
margin-top: 20px; | |
margin-bottom: 20px; | |
padding-left: 20px; | |
padding-right: 20px; | |
} | |
.hypervisual__embed_product { | |
width: 80%; | |
} | |
.hypervisual__embed_product-image { | |
max-width: 100%; | |
} | |
.hypervisual__embed_product-title { | |
font-size: 18px; | |
line-height: 22px; | |
margin-top: 5px; | |
margin-bottom: 5px; | |
} | |
.hypervisual__embed_product-variant-title { | |
margin-top: 0px; | |
margin-bottom: 0px; | |
} | |
a.hypervisual__embed_product-title-link { | |
text-decoration: none; | |
color: inherit; | |
} | |
label.hypervisual__embed_product-option-label { | |
text-align: left; | |
font-size: 12px; | |
text-transform: uppercase; | |
letter-spacing: 2px; | |
line-height: 20px; | |
display: block; | |
} | |
label.hypervisual__embed_product-option-label select { | |
font-size: 14px; | |
text-transform: none; | |
letter-spacing: 0; | |
border: 1px solid #ddd; | |
width: 100%; | |
max-width: 100%; | |
display: block; | |
margin: 0 0 1em; | |
color: #333 !important; | |
} | |
.hypervisual__embed_product_variant_select { | |
display: none; | |
} | |
.hypervisual__embed_product-button, .hypervisual__button, .hypervisual__content-block .hypervisual__button, | |
a.hypervisual__embed_product-button, a.hypervisual__button, .hypervisual__content-block a.hypervisual__button { | |
background: #00a3f0; | |
color: #ffffff; | |
text-decoration: none; | |
padding: 8px 16px; | |
border: none; | |
border-radius: 4px; | |
font-weight: bold; | |
outline: none; | |
display: inline-block; | |
margin-top: 10px; | |
} | |
.hypervisual__button, .hypervisual__embed_product-button, a.hypervisual__embed_product-button { | |
font-size: 18px; | |
line-height: 1.2; | |
} | |
.hypervisual__embed_product-button[disabled] { | |
background-color: #CCC; | |
} | |
.hypervisual__embed_product-button a, | |
.hypervisual__button a, | |
.hypervisual__content-block .hypervisual__button a { | |
padding: 8px 16px; | |
margin: -8px -16px; | |
display: inline-block; | |
} | |
.hypervisual__embed_product-button, a.hypervisual__embed_product-button { | |
margin-left: 15px; | |
margin-right: 15px; | |
margin-bottom: 0; | |
} | |
.hypervisual__button a { | |
text-decoration: none; | |
} | |
.hypervisual__content-block .hypervisual__button.hypervisual__email-opt-in-button, .hypervisual__button.hypervisual__email-opt-in-button { | |
border-radius: 0 4px 4px 0; | |
margin-left: 0; | |
margin-right: 0; | |
margin-top: 0; | |
margin-bottom: 15px; | |
} | |
input.hypervisual__form-input { | |
border-radius: 4px; | |
background-color: #FFF; | |
border-width: 1px; | |
border-color: #999; | |
border-style: solid; | |
padding: 7px 16px; | |
margin-right: 0px; | |
margin-left: 0px; | |
width: 48%; | |
display: inline-block; | |
max-width: 250px; | |
margin-bottom: 15px; | |
outline: none; | |
color: #333; | |
} | |
input.hypervisual__form-input:focus { | |
outline: none; | |
} | |
input.hypervisual__email-opt-in-email-input { | |
border-radius: 4px 0 0 4px; | |
border-width: 1px 0 1px 1px; | |
} | |
.hypervisual__content-block .hypervisual__button { | |
/*margin-top: 20px;*/ | |
} | |
.hypervisual__embed_product-price-wrapper { | |
white-space: nowrap; | |
margin-top: 5px; | |
margin-bottom: 5px; | |
display: inline-block; | |
} | |
.hypervisual__embed_product-price-wrapper.hypervisual__embed_product-price-wrapper-hidden { | |
display: none; | |
} | |
.hypervisual__embed_product-price { | |
font-weight: bold; | |
} | |
.hypervisual__embed_product-compare-at-price { | |
opacity: 1; | |
position: relative; | |
margin-right: 10px; | |
} | |
.hypervisual__embed_product-compare-at-price:before { | |
position: absolute; | |
content: ""; | |
left: 0; | |
top: 50%; | |
right: 0; | |
border-top: 2px solid; | |
border-color: #000; | |
opacity: 0.33; | |
-webkit-transform:rotate(-8deg); | |
-moz-transform:rotate(-8deg); | |
-ms-transform:rotate(-8deg); | |
-o-transform:rotate(-8deg); | |
transform:rotate(-8deg); | |
} | |
.hypervisual__devices-mobile-only { | |
display: none; | |
} | |
.hypervisual__utils-background-image { | |
top: 0; | |
left: 0; | |
bottom: 0; | |
right: 0; | |
position: absolute; | |
z-index: -1; | |
background-position: center center; | |
} | |
.hypervisual__text-small, .hypervisual__text-small *, .hypervisual__button.hypervisual__text-small, input.hypervisual__text-small { | |
font-size: 16px; | |
line-height: 23px; | |
} | |
.hypervisual__text-medium, .hypervisual__text-medium *, .hypervisual__button.hypervisual__text-medium, input.hypervisual__text-medium { | |
font-size: 20px; | |
line-height: 28px; | |
} | |
.hypervisual__text-large, .hypervisual__text-large *, .hypervisual__button.hypervisual__text-large, input.hypervisual__text-large { | |
font-size: 26px; | |
line-height: 32.5px; | |
} | |
.hypervisual__text-xlarge, .hypervisual__text-xlarge *, .hypervisual__button.hypervisual__text-xlarge, input.hypervisual__text-xlarge { | |
font-size: 40px; | |
line-height: 50px; | |
} | |
.hypervisual__content-wrapper { | |
/*display: inline-block; | |
vertical-align: top;*/ /* fixes spacing issue when display: inline-block */ | |
width: 100%; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.hypervisual__clearfix:before, | |
.hypervisual__clearfix:after { | |
content: " "; | |
display: table; | |
} | |
.hypervisual__clearfix:after { | |
clear: both; | |
} | |
.hypervisual__clearfix { | |
*zoom: 1; | |
} | |
/* Collection */ | |
.hypervisual__content-block--collection { | |
padding: 30px 0; | |
} | |
.hypervisual__content-block--collection .hypervisual__content-wrapper { | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.hypervisual__collection-2up .hypervisual__collection-product-column { | |
width: 50%; | |
} | |
.hypervisual__collection-3up .hypervisual__collection-product-column { | |
width: 33.3%; | |
} | |
.hypervisual__collection-4up .hypervisual__collection-product-column { | |
width: 25%; | |
} | |
.hypervisual__embed_collection .hypervisual__collection-product-column { | |
float: left; | |
} | |
.hypervisual__embed_collection .hypervisual__embed_collection-product { | |
min-width: auto; | |
} | |
/* LIBRARY */ | |
/* Pricing Table */ | |
.hypervisual__content-block--library-pricing-table { | |
padding: 30px 0; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.hypervisual__library-pricing-table-headline { | |
padding: 5px 0; | |
} | |
.hypervisual__library-pricing-table-subhead { | |
padding: 5px 0 10px; | |
} | |
.hypervisual__library-pricing-table-column { | |
padding: 0 20px; | |
float: left; | |
} | |
.hypervisual__library-pricing-table-column img { | |
width: 100%; | |
} | |
.hypervisual__library-pricing-table-column-2up { | |
width: 50%; | |
} | |
.hypervisual__library-pricing-table-column-3up { | |
width: 33.3%; | |
} | |
.hypervisual__library-pricing-table-column-4up { | |
width: 25%; | |
} | |
.hypervisual__library-pricing-table-details ul { | |
padding: 0; | |
margin: 0; | |
} | |
.hypervisual__library-pricing-table-details ul li { | |
list-style-type: none; | |
border-top: 1px solid #CCC; | |
padding: 5px 0; | |
margin: 0px; | |
} | |
/* Multi-column image/text */ | |
.hypervisual__content-block--multi-column-image-text { | |
padding: 30px 0; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.hypervisual__library-multi-column-image-text-headline { | |
margin: 5px 0; | |
} | |
.hypervisual__library-multi-column-image-text-subhead { | |
} | |
.hypervisual__library-multi-column-image-text-column { | |
float: left; | |
} | |
.hypervisual__library-multi-column-image-text-column-text { | |
padding: 0 20px; | |
} | |
.hypervisual__library-multi-column-image-text-column img { | |
width: 100%; | |
} | |
.hypervisual__library-multi-column-image-text-column-2up { | |
width: 50%; | |
} | |
.hypervisual__library-multi-column-image-text-column-3up { | |
width: 33.3%; | |
} | |
.hypervisual__library-multi-column-image-text-column-4up { | |
width: 25%; | |
} | |
.hypervisual__library-multi-column-image-text-column-image { | |
text-align: center; | |
} | |
.hypervisual__multi-column-image-format-padded .hypervisual__library-multi-column-image-text-column-image { | |
padding: 0 20px; | |
} | |
/* Multi-column product */ | |
.hypervisual__content-block--multi-column-product { | |
padding: 30px 0; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.hypervisual__library-multi-column-product-column { | |
float: left; | |
} | |
.hypervisual__library-multi-column-product-column-2up { | |
width: 50%; | |
} | |
.hypervisual__library-multi-column-product-column-3up { | |
width: 33.3%; | |
} | |
.hypervisual__library-multi-column-product-column-4up { | |
width: 25%; | |
} | |
.hypervisual__library-multi-column-product-column .hypervisual__embed_product { | |
min-width: auto; | |
width: 100%; | |
} | |
/* Vertical image + text */ | |
.hypervisual__library-vertical-image-text-image { | |
font-size: 0; | |
line-height: 0; | |
margin-left: -40px; | |
margin-right: -40px; | |
} | |
.hypervisual__library-vertical-image-text-image img { | |
width: 100%; | |
} | |
/* Slider */ | |
.hypervisual__slider { | |
margin: 0 auto; | |
} | |
.hypervisual__slider.hypervisual__slider-active { | |
position: relative; | |
overflow: hidden; | |
padding-left: 0; | |
padding-right: 0; | |
} | |
.hypervisual__slider.hypervisual__slider-active .hypervisual__slider-slides { | |
position: relative; | |
overflow: hidden; /* clearfix */ | |
-ms-touch-action: pan-y; | |
touch-action: pan-y; | |
} | |
.hypervisual__slider.hypervisual__slider-active .hypervisual__slider-slides > * { | |
float: left; | |
margin: 0; | |
-moz-box-sizing: border-box; | |
-webkit-box-sizing: border-box; | |
box-sizing: border-box; | |
-webkit-tap-highlight-color: transparent; | |
tap-highlight-color: transparent; | |
} | |
.hypervisual__slider.hypervisual__slider-active .hypervisual__slider-slides a:active, | |
.hypervisual__slider.hypervisual__slider-active .hypervisual__slider-slides a:active img { | |
outline: none; | |
} | |
.hypervisual__slider.hypervisual__slider-active, | |
.hypervisual__slider.hypervisual__slider-active .hypervisual__slider-dots, | |
.hypervisual__slider.hypervisual__slider-active .hypervisual__slider-slides, | |
.hypervisual__slider.hypervisual__slider-active .hypervisual__slider-slides > * { | |
-webkit-transform: translate3d(0,0,0); | |
-ms-transform: translate3d(0,0,0); | |
-moz-transform: translate3d(0,0,0); | |
transform: translate3d(0,0,0); | |
-webkit-backface-visibility: hidden; | |
-moz-backface-visibility: hidden; | |
-ms-backface-visibility: hidden; | |
backface-visibility: hidden; | |
} | |
.hypervisual__slider.hypervisual__slider-mouse .hypervisual__slider-slides { | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
user-select: none; | |
cursor: move; | |
cursor: -webkit-grab; | |
cursor: -moz-grab; | |
cursor: grab; | |
} | |
.hypervisual__slider.hypervisual__slider-mouse.hypervisual__slider-drag .hypervisual__slider-slides * { | |
cursor: move; | |
cursor: -webkit-grabbing; | |
cursor: -moz-grabbing; | |
cursor: grabbing; | |
} | |
/* default appearance styles */ | |
.hypervisual__slider { | |
text-align: center; | |
} | |
.hypervisual__slider > div { | |
margin: 0 0 1.5em 0; | |
} | |
.hypervisual__slider > div img { | |
vertical-align: top; | |
max-width: 100%; | |
width: 100%; | |
} | |
.hypervisual__slider > div figcaption { | |
font-style: italic; | |
color: #787575; | |
font-size: 0.8em; | |
margin-top: 0.5em; | |
} | |
.hypervisual__slider.hypervisual__slider-active { | |
margin-bottom: 1.5em; | |
} | |
.hypervisual__slider-slides { | |
/*padding-top: 0.5em; | |
padding-bottom: 0.5em;*/ | |
} | |
/* dots */ | |
ul.hypervisual__slider-dots { | |
margin: 0.6em 0; | |
padding: 0; | |
text-align: center; | |
list-style-type: none; | |
} | |
.hypervisual__slider.hypervisual__slider-active ul.hypervisual__slider-dots { | |
margin: 0 0 0.6em 0; | |
} | |
.hypervisual__slider.hypervisual__slider-active .hypervisual__slider-slides + ul.hypervisual__slider-dots { | |
margin: 0.6em 0 0 0; | |
} | |
ul.hypervisual__slider-dots > li { | |
display: inline-block; | |
position: relative; | |
padding: 0.5em 0.6em; | |
width: 12px; | |
height: 12px; | |
cursor: pointer; | |
text-align: center; | |
vertical-align: middle; | |
-webkit-user-select: none; | |
-moz-user-select: none; | |
-ms-user-select: none; | |
user-select: none; | |
-webkit-tap-highlight-color: transparent; | |
/* ie7 fallback */ | |
*display: inline; | |
*zoom: 1; | |
} | |
ul.hypervisual__slider-dots > li.hypervisual__slider-mouse-clicked, | |
ul.hypervisual__slider-dots > li:active { | |
outline: 0; | |
} | |
ul.hypervisual__slider-dots > li > span { | |
display: inline-block; | |
position: absolute; | |
top: 50%; | |
left: 50%; | |
margin: -4px 0 0 -4px; | |
width: 8px; | |
height: 8px; | |
border-radius: 50%; | |
background: #9b9890; | |
} | |
ul.hypervisual__slider-dots > li.hypervisual__slider-active-dot > span { | |
margin: -6px 0 0 -6px; | |
width: 10px; | |
height: 10px; | |
border: 1px solid #9b9890; | |
background: transparent; | |
} | |
/* FLEX PRODUCT EMBEDS EXPERIMENT */ | |
.hypervisual__utils-product-flex .hypervisual__embed_collection { | |
display: flex; | |
flex-wrap: wrap; | |
} | |
.hypervisual__utils-product-flex .hypervisual__embed_collection .hypervisual__collection-product-column { | |
display: flex; | |
} | |
.hypervisual__utils-product-flex .hypervisual__embed_collection-product { | |
display: flex; | |
flex-direction: column; | |
} | |
.hypervisual__utils-product-flex .hypervisual__embed_product-form-wrapper { | |
display: flex; | |
flex-grow: 1; | |
} | |
.hypervisual__utils-product-flex .hypervisual__embed_product-form-wrapper form { | |
width: 100%; | |
align-self: flex-end; | |
} | |
.hypervisual__utils-product-flex .hypervisual__content-block--library-multi-column-product .hypervisual__content-wrapper { | |
display: flex; | |
flex-wrap: wrap; | |
} | |
.hypervisual__utils-product-flex .hypervisual__library-multi-column-product-column { | |
display: flex; | |
} | |
.hypervisual__utils-product-flex .hypervisual__library-multi-column-product-column .hypervisual__embed_product { | |
display: flex; | |
flex-direction: column; | |
margin-left: auto; | |
margin-right: auto; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment